/*
Theme Name: Ocean
Theme URI: http://crazy-wp.com/
Author: CRAZY WP
Author URI:  http://crazy-wp.com/
*/
-------------------------------------------------------------- */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td, p {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
	-webkit-font-smoothing: antialiased;
}
:focus {/* remember to define focus styles! */
	outline: 0;
}
html,body {
	width: 100%;
	background: #fff;
	line-height: 1;
	margin: 0;
	padding: 0;
}
ol, ul {
	list-style: none;
}
table {/* tables still need 'cellspacing="0"' in the markup */
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	font-weight: normal;
	text-align: left;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
a img {
	border: none;
}
article, aside, details, figcaption, figure,
footer, header, hgroup, menu, nav, section {
	display: block;
}

/*===============================
	テキスト,フォント
=================================*/
h1{ font-size: 24px;}
h2{ font-size: 22px;}
h3{ font-size: 20px;}
h4{ font-size: 18px;}
p{ font-size: 14px; line-height: 1.6em;}
.t-right{
	text-align: right;
}
.t-left{
	text-align: left;
}
.t-center{
	text-align: center;
}
.ft-family1{
		font-family: 'AvenirNextLTW01-Regular', Arial, 'AxisStd-Light', "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
}

/*===============================
	背景
=================================*/
.bg-gray{
	background: #f9f9f9;
}
.bg-color1{
	background: #d2ebee;
}
.bg-color2{
	background: #d2ebee;
}

/*===============================
	配置
=================================*/
.fl-right{
	float: right;
}
.fl-left{
	float: left;
}
.mt10{
	margin-top: 10px;
}

/*===============================
	画像
=================================*/
img{
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
.img-responsive{
	width: 100%;
}
.img-responsive-half{
	width: 50%;
	height: auto;
}
.img-responsive-third{
	width: 33%;
	height: auto;
}
img.alignright{
	float: right;
}

/*===============================
	お問合せ
=================================*/
form.wpcf7-form, form.wpcf7-form input, form.wpcf7-form textarea{
	width: 100%;
	overflow: hidden;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	-webkit-appearance: none
}
form.wpcf7-form input{
	 height: 40px;
	 border: 1px solid #e2e2e2;
	 font-size: 1rem;
	 padding: 5px;
 }
form.wpcf7-form textarea{
	border-color:#e2e2e2;
	font-size: 1rem;
	padding: 5px;
}
form.wpcf7-form input[type="submit"]{
	background: #1e99a8;
	color: white;
	border: none;
	font-weight: bold;
	width: 200px;
	float: right;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}


/*===============================
	基本構造
=================================*/
html,body {
	width: 100%;
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
	font-family: 'AvenirNextLTW01-Regular', Arial, 'AxisStd-Light', "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
}
#page {
	width: 100%;
}
.top-contents{
	padding: 80px 0;
}
/* 	サイト横幅
-------------------------*/
header,footer,.site-width section{
	max-width: 1080px;
	margin: 0 auto;
}

/*===============================
	基本フォント
=================================*/
html,body,#top-logo,.footer,nav a,a:hover,p,a{
	color: #555;
}


/*===============================
	トップライン
=================================*/
.top-line{
	background: #d2ebee;
}
/* 	縦幅
-------------------------*/
.top-line,.top-line p.left,.top-line a.right,.top-line p.center{
	min-height: 30px;
}
.top-line p.left,.top-line a.right{
	font-size: 0.8em;
	margin: 0;
	padding-top: 6px;
}
.top-line p.center{
	font-size: 1rem;
	margin: 0;
	padding-top: 3px;
	letter-spacing: 0.2em;
	color: #666;
}
.top-line a.right{
	display: block;
	font-size: 1rem;
	margin: 0;
	letter-spacing: 0.2em;
	color: #f9f9f9;
	background: #e5c440;
	width: 70%;
	padding:  20px 10px;
	-webkit-border-bottom-right-radius: 3px;
	-moz-border-radius-bottomright: 3px;
}
.top-line .pst-ab{
	position: absolute;
	width: 300px;
	right: 20px;
	text-align: center;
}
.top-line a.right i{
	padding-right: 5px;
}
.top-line a.reserve{
	color: #f9f9f9;
	font-size: 1rem;
	background: #1e99a8;
	width: 30%;
	display: block;
	padding:  20px 10px;
	float: right;
	-webkit-border-bottom-left-radius: 3px;  
	-moz-border-radius-bottomleft: 3px;
}
.top-line a:hover{
	text-decoration: none;
}
/*===============================
	ヘッダー
=================================*/
.header{
	background: white;
	min-height: 200px;
	overflow: hidden;
	padding: 30px;
}
/* 	ロゴ
-------------------------*/
#top-logo{
	width: 200px;
	margin-top: 30px;
}
#top-logo h1{
	width: 100%;
}
#top-logo .sub-logo{
	font-size: 0.5em;
}
/* 	トップバナー
-------------------------*/
.top-baner{
	padding-bottom: 50px;
	background: #d2ebee;
	padding: 20px 0;
}
.top-baner h1{
	margin-left: 150px;
	line-height: 3rem;
	letter-spacing: 5px;
	font-family: "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
	font-weight: normal;
}
.top-baner .flexslider{
	float: right;
}
.top-baner .flexslider , .top-baner .flexslider ul, .top-baner .flexslider ul li, .top-baner .flexslider ul li img{
	margin-bottom: 0;
	width: 100%;
	height: 500px;
}
.top-baner .flexslider .flex-direction-nav{
	display: none;
}
.top-baner .flexslider .flex-control-nav{
	display: none;
	position: absolute;
	bottom: 10px;
	z-index: 999999;
}
.top-baner img{
	-webkit-border-top-right-radius: 80px; 
	-webkit-border-bottom-left-radius: 80px;  
	-moz-border-radius-topright: 80px;  
	-moz-border-radius-bottomleft: 80px;
	padding: 3px;
	background: #f9f9f9;
}
.flex-direction-nav .flex-prev{
	left: 0;
}
.flex-direction-nav .flex-next{
	right: 0;
}

/*===============================
	ナビゲーション
=================================*/

/* 	ヘッダーナビ
-------------------------*/
nav{
	font-family: 'AvenirNextLTW01-Regular', Arial, 'AxisStd-Light', "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
	font-size: 0.95rem;
}
nav ul{
	overflow: hidden;
}
nav ul li{
	float: left;
//	width: 33%;
}
nav ul li a{
	padding: 10px 20px;
	display: block;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.header nav{
	float: right;
	margin-top: 30px;
}
.header nav li:hover,.header nav li:active{
	-webkit-border-top-left-radius: 3px;  
	-webkit-border-top-right-radius: 3px;  
	-webkit-border-bottom-right-radius: 3px;  
	-webkit-border-bottom-left-radius: 3px;  
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	-moz-border-radius-bottomright: 3px;  
	-moz-border-radius-bottomleft: 3px;
}
.header nav li a:hover, .header nav li a:active{
	color: #1e99a8 !important;
	text-decoration: none !important;
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.header nav li a:hover:before, .header nav li a:active:before{
	content: "・";
	margin-left: -15px;
	font-size: 15px;
}
header a.sp-menu{
	visibility: hidden;
	display: none;
}
header a.sp-menu i{
	padding-right: 0;
}

/*===============================
	トップページコンテンツ共通
=================================*/
.top-contents h1.title{
	font-size:1.4rem;
	text-align:left;
	color: #1e99a8;
	padding-bottom: 10px;
	margin: 0 auto;
	margin-bottom: 10px;
	-webkit-font-smoothing: antialiased;
	font-family: 'AvenirNextLTW01-Regular', Arial, 'AxisStd-Light', "游ゴシック", YuGothic, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
}
.top-contents p.sub-title{
	font-size:1.6rem; text-align:center;
	margin-bottom: 30px;
}
.recomend div.title, .merit div.title, .access div.title, .voice div.title, .news div.title{

}

/*===============================
	固定ページ共通
=================================*/
.page-title{
	color: #444;
	background: #d2ebee;
	text-align: center;
	padding: 20px;
	-webkit-font-smoothing: antialiased;
	font-family: 'AvenirNextLTW01-Regular', Arial, 'AxisStd-Light', '游ゴシック', YuGothic, 'ヒラギノ角ゴ ProN W3', 'Hiragino Kaku Gothic ProN', 'メイリオ', Meiryo, sans-serif;
}

/*===============================
	オススメ
=================================*/
.recomend .panel-body{
	padding: 30px 15px;
}
.recomend img{
	margin: 0 auto;
}
.recomend .ctn p.description{
	padding: 10px 0;
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
	letter-spacing: 0.2em;
	line-height: 1.5em;
}
.recomend .ctn{
	padding: 10px;
	box-shadow: none;
}
.recomend .ctn h2.title{
	font-size: 1.4rem;
	text-align: center;
	margin: 10px auto;
	border-bottom: 1px double #efefef;
	max-width: 100px;
}
.recomend .ctn a.btn-detail{
	color: white;
}
.recomend .panel-body{
	background: #f5f5f5;	
	-webkit-border-top-left-radius: 3px;  
	-webkit-border-top-right-radius: 3px;  
	-webkit-border-bottom-right-radius: 3px;  
	-webkit-border-bottom-left-radius: 3px;  
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	-moz-border-radius-bottomright: 3px;  
	-moz-border-radius-bottomleft: 3px;
}

/*===============================
	当院の強み
=================================*/
.merit{
	background: white;
}
.merit .row h1{
	font-size: 1.6rem;
	padding: 10px 15px;
	margin: 0;
}
.merit .row h1 i{
	color: #d9e594;
	padding-right: 20px;
	font-size: 2.2em;
	position: relative;
	top: 6px;
}
.merit .row p{
	padding: 15px;
	letter-spacing: 0.2rem;
	line-height: 2rem;
}

/*===============================
	お客様の声
=================================*/
.voice .panel{
	box-shadow: none;
	background: #f9f9f9;
	margin-bottom: 20px;
}
.voice .panel-head h2.title{
	font-size: 1.2rem;
}
.voice .row p{
	letter-spacing: 0.1rem;
	line-height: 2rem;
}
.voice .panel img{
	margin-bottom: 10px;
}



/*===============================
	アクセス
=================================*/
.access{
	height: 450px;
}
.access-right{
	padding: 50px 30px;
}
.access section.panel-access{
	background: none;
	-webkit-border-top-left-radius: 0;  
	-webkit-border-top-right-radius: 0;  
	-webkit-border-bottom-right-radius: 0;  
	-webkit-border-bottom-left-radius: 0;  
	-moz-border-radius-topleft: 0;
	-moz-border-radius-topright: 0;
	-moz-border-radius-bottomright: 0;  
	-moz-border-radius-bottomleft: 0;
	box-shadow: none;
}
.access .tel{
	font-size: 1.8rem;
}
.access .info{
	overflow: hidden;
	margin-bottom: 10px;
	padding: 60px 30px;
	letter-spacing: 0.1rem;
	min-height: 300px;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
.access .btn-detail:hover{
	color: white;
}
.access section{
	height: 100%;
}
.access iframe{
	height: 100%;
}
/*===============================
	ニュース
=================================*/
.news a, .news a:hover{
	color: #555;
}
.news a.btn-detail, .news a.btn-detail:hover{
	color: white;
}
.news .news-section{
	margin-bottom: 30px;
}



/*===============================
	テーブル
=================================*/
table{
	width: 100%;
	border: 1px solid #e2e2e2;
	margin-bottom: 10px;
	border-bottom: none;
}
table tr.title td{
	border-left: 1px solid #e2e2e2;
}
table th,table td, table tr.title{
	border-bottom: 1px solid #e2e2e2;
	font-size: 1rem;
}
table tr.last th, table tr.last td{
	border-bottom: none;
}
table td{
	border-left: 1px solid #e2e2e2;
}
table th, table td{
	padding: 15px 5px;
	text-align: center;
}
table tr.title th, table tr.title td{
	font-size: 0.9rem;
	border-right: 1px solid #f9f9f9;
	color: #f9f9f9;
}
table tr.title th:last-child{
	border-right: none;
}
table.time th, table.price th{
	background: #d2ebee;
}
table.time tr.title th, table.price tr.title th, table.price tr.title td{
	background: #1e99a8;
}

/* 	priceテーブル
-------------------------*/
table.price{
	width: 60%;
}
table.price tr.title th, table.price tr.title td{
	text-align: center;
}
table.price th{
	width: 70%;
}
table.price td{
	width: 30%;
}


/*===============================
	ボタン
=================================*/
.btn{
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "ＭＳ Ｐゴシック", "MS PGothic", Osaka, sans-serif;
}
.btn{
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.btn:hover{
	-webkit-transition: all 0.3s;
	-moz-transition: all 0.3s;
	-ms-transition: all 0.3s;
	-o-transition: all 0.3s;
	transition: all 0.3s;
}
.btn-detail{
	font-size: 0.8rem;
	margin: 0;
	background:none;
	color: #1e99a8;
	padding-right: 0;
}
.btn-detail:hover{
	color: rgba(42,167,183,0.68) !important;
}
.btn-gray{
	background: #ddd;
}
.btn-gray:hover{
	background: #ccc;
}
.btn-tel{
	background: #e5c440;
	margin-top: -4px;
	margin-left: 10px;
	color: white;
	text-shadow: 1px 1px 0 #aaa;
}
.btn-tel:hover,.btn-tel:active,.btn-tel:focus{
	color: white !important;
}
.btn-big{
	font-size: 2rem;
	width: 80%;
	-webkit-font-smoothing: antialiased;
	font-family: 'Lato', sans-serif;
	font-weight: 300;
	display: block;
	overflow: hidden;
	height: 80px;
	line-height: 80px;
	padding: 0;
	margin-left: 0;
}
.fs-custom1{
	font-size: 1.7rem;
}

/*===============================
	アイコン
=================================*/
i.fa{
	padding-right: 5px;
}

/*===============================
	パネル
=================================*/
.panel{
	box-shadow: none;
}
.panel-3col{
	box-shadow: none;
}
.panel-3col .panel-head h2{
	font-size: 1rem;
	margin: 0;
}
.panel-3col img{
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
}
.panel-head{
	padding: 0 15px;
}

.menu-wrap ul{
	float: right;
	z-index: 777;
}

/*===============================
	投稿コンテンツ
=================================*/
#post-contents{
	color: #333;
}
#post-contents p{
	font-size: 0.9rem;
	color: #333;
}
#post-contents h1{
	font-size: 1.6rem;
	padding: 10px;
	margin-bottom: 20px;
	-webkit-border-top-left-radius: 3px;  
	-webkit-border-top-right-radius: 3px;  
	-webkit-border-bottom-right-radius: 3px;  
	-webkit-border-bottom-left-radius: 3px;  
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	-moz-border-radius-bottomright: 3px;  
	-moz-border-radius-bottomleft: 3px;
}
#post-contents h2{
	margin-bottom: 20px;
}
#post-contents img{
	margin: 15px;
	border-radius: 3px !important;
	-webkit-border-radius: 3px !important;
	-moz-border-radius: 3px !important;
}
#post-contents ul li:before{
	content: '◯';
	color: #1e99a8;
}
#post-contents ul{
	padding-left: 0;
}

.post-title h1{
	padding-left: 0 !important;
}
.post-title h1 a{
	color: #1e99a8;
}
.label-default{
	background: #bbb;
}

/* 	ブログサイドバー
-------------------------*/
#sidebar-blog h2{
	font-size: 1rem;
	margin-bottom: 20px;
}
#sidebar-blog h2:before{
	content: '◯';
	color: #1e99a8;
	margin-right: 5px;
}
.sidebar-widget > div{
	margin-bottom: 30px;
}
.sidebar-widget > div > ul{
	padding: 0;
}
.sidebar-widget > div > ul > li{
	margin-bottom: 10px;
}
span.post-date{
	font-size: 0.7rem;
}

/* 	新しい記事へ、前の記事へナビ
-------------------------*/
.nav-below{
	overflow: hidden;
	margin: 20px 0;
	border-bottom: 1px solid #ddd;
	border-top: 1px solid #ddd;
	padding: 10px;
}
.nav-below .nav-previous{
	float: right;
	
}
.nav-below .nav-next{
	float: left;
}

/*===============================
	フッター
=================================*/
.footer{
	background: #efefef;
	min-height: 100px;
	overflow: hidden;
	padding: 15px 0;
	padding-bottom: 0;
}
.footer #top-logo{
	margin: 0 auto;
}

.footer nav ul{
	float: left;
	width: 100%;
}
.footer nav ul li{
	float: left;
	width: auto;
}
.footer nav ul li a{
	font-size: 0.8rem;
	color: #1e99a8;
}
.copyright{
	text-align: center;
	position: relative;
	margin-bottom: 0;
	padding-bottom: 0;
	color: #9bd1d6;
	font-size: 0.5rem;
	padding: 15px;
	background: #1e99a8;
}

/*===============================
	その他
=================================*/
/* ページトップへ戻るボタン
-------------------------*/
#pageTop{
	background:rgba(150,150,150,0.5);
	-webkit-border-top-left-radius: 3px;  
	-webkit-border-top-right-radius: 3px;  
	-moz-border-radius-topleft: 3px;
	-moz-border-radius-topright: 3px;
	color:#FFF;
	padding:20px;
	position:fixed;
	bottom: 0px;
	right:20px;

}
#pageTop:hover{
	opacity: 0.7;

}
/* 	その他を見る
-------------------------*/
a.watch-other{
	margin-right: 20px;
	float: right;
	font-size: 0.8rem;
	color: #1e99a8;
}
a.watch-other:hover{
	color: rgba(70,183,198,0.73);
}

/*===============================
	メディアクエリ
=================================*/
@media screen and (max-width: 979px) { /* 979px以下用（タブレット用）の記述 */
	/* 	ロゴ中央表示
	-------------------------*/
	#top-logo{
		margin: 0 auto;
		margin-top: 20px;
		margin-bottom: 10px;
	}
	.top-line a.right{
		display: block;
		text-align: center;
	}
	/* 	トップナビメニュー
	-------------------------*/
	.header nav{
		margin-top: 0;
		position: relative;
		overflow: hidden;
		float: none;
	}

}
@media screen and (max-width: 768px) { /* 768px以下用（タブレット／スマートフォン用）の記述 */
	.top-line a.right{
		font-size: 15px;
	}
	.merit .row h1{
		font-size: 18px;
		line-height: 2rem;
	}
	.merit .row h1 i{
		font-size: 30px;
		top: 2px;
		padding: 0;
	}
	.top-contents h1.title{
		font-size: 26px;
	}
	.top-contents p.sub-title{
		font-size: 20px;
	}
	table.price{
		width: 100%;
	}
	.copyright{
		bottom: 0;
	}
	.btn-big{
		width: 100%;
	}
	#post-contents img{
		margin-left: 0;
	}
	.top-baner .flexslider, .top-baner .flexslider ul , .top-baner .flexslider ul li , .top-baner .flexslider ul li img{
		height: 350px;
	}
	.top-baner .flexslider ul li img{
		-webkit-border-top-right-radius: 40px; 
	-webkit-border-bottom-left-radius: 40px;  
	-moz-border-radius-topright: 40px;  
	-moz-border-radius-bottomleft: 40px;
	}
	
}
@media screen and (max-width: 479px) { /* 479px以下用（スマートフォン用）の記述 */	
	.access .info{
		margin-top: 10px;
	}
	.top-baner div.flexslider{
		margin-top: 10px;
	}
	/* 	メニュー非表示
	-------------------------*/
	.menu-wrap{
		display: none; /*要素のエリアも非表示*/
	}
	/* 	メニューボタン表示
	-------------------------*/
	header a.sp-menu{
		visibility: visible;
		display: block;
		width: 100%;
		float: right;
		font-size: 10px;
		margin-bottom: 0;
		padding-right: 12px;
	}
	header a.sp-menu i{
		font-size: 30px;
	}
	/* 	スマホ用メニューをリスト表示
	-------------------------*/
	#top-menu, #top-menu ul, #top-menu ul li{
		width: 100%;
	}
	#top-menu ul li{
		text-align: center;
	}
	.description{
		text-align: center;
	}
	
	.top-contents h1.title{
		font-size: 24px;
	}
	.top-contents p.sub-title{
		font-size: 18px;
	}
	.top-line .t-right{
		padding: 0;
		width: 100%;
	}
	.top-line .pst-ab{
		width: 100%;
		position: initial;
		height: 36px;
	}
	.top-line a.reserve{
		float: right;
		padding: 10px;
		width: 30%;
	}
	.top-line a.right{
		float: right;
		padding: 10px;
		font-size: 1rem;
		width: 70%;
	}
	
	.top-baner .flexslider, .top-baner .flexslider ul , .top-baner .flexslider ul li , .top-baner .flexslider ul li img{
		height: auto;
	}
	
	.access-right{
		padding: 15px !important;
	}
	
	.fs-custom1{
	font-size: 1.5rem;
}

}