@charset "utf-8";
/* CSS Document */


@import url("sp_common.css");
@import url("spmenu.css");
@import url("sp_top.css");


@media screen and (max-width: 736px) {




/*  -------------------------------------------------------------------------------------------------------------------- */

/* SP レイアウト設定 */

/*  -------------------------------------------------------------------------------------------------------------------- */


/* ヘッダー */
/*  ------------------------------------------------------------ */


#head{ background: #FFF;  transition: 0.2s;}
#head .spTop .spTopWrap{background:#FFFFFF;}
#header{border-top: #2FBDEF solid 5px;}
#header .headerWrap{}


/* ヘッダ高さ*/
#header .logo{ height:60px; padding: 0 0 0 6px; text-align:left;}

#header .logo img{ width:80%; height:auto; max-width: 260px;}

0
/*ナビ位置*/
#head #SpNavBlock .menuBtn {
	right: 10px;
	top: 15px;
}

/*ナビ開閉時　背景位置*/
#head #SpNavBlock #SpNavWrapper { top:65px;}



/*ナビ onメニュー*/
/*  ------------------------------------------------------------ */

#head #SpNavBlock #SpNav li.on{
	background:#2FBDEF;
}

#head #SpNavBlock #SpNav li.on a{
	color: #FFFFFF;
	background-image: url(../images/common/btnR_wh.svg) ;
}


#head #SpNavBlock #SpNav li a:hover{background-color:#EAF9FD;}






/* ページBG*/
/*  ------------------------------------------------------------ */

.mid #titleArea{
	height:100px;
	padding:0;
	margin-top:65px;
	margin-bottom:10px;
	background-size: cover;
}


#titleArea .midMV{
	margin-bottom:30px;
	background-size: cover;}


#titleArea h2{
	height:100px;
	text-align:right;
	font-size:100%;
	font-weight:bold;
	color:#471F13;
	filter: drop-shadow(4px 4px 6px #FFF);
}

/*.mid #titleArea h2 img{ height:1.5em}*/




/* トップページ＆インフォエリア */
/*  ------------------------------------------------------------ */


/* 枠囲みブロック　ボーダーカラー */
.borderBlock{ border: 7px solid #E1F3F9;}


/* トップ・インフォエリア　Ｈタグ */

.top h2.is_SP,
.top .newsinfo h3,
.spInfoArea h2{
	color:#FFFFFF; 
	padding:0.4em 0.5em 0.5em;
	font-weight:bold;
	background:#6DC3DE;}	


/* Ｈタグ */
/*  ------------------------------------------------------------ */

/* メインタイトル */
h2.pageTitle{
font-size:110% ;
padding: 14px 0 14px 20px;
line-height:1.25;
}


/* レイアウト内 H3 */

#contentArea h3{
	font-size:100%;
	background-position:-5px center;
	padding: 15px 0 15px 37px; 
}

/*基本要素要素 フォントサイズ */

dl.headingText dt{ font-size:100%; }
.tx-b{ font-size:110%;}

.spBtn{font-size:110%;}







/*フッター*/
/*  ------------------------------------------------------------ */

#foot{border-top:1px solid #E6DDBE;}
#footArea{ padding: 0px 0 0; font-size:96%;}

#foot .wrap{ padding: 0.6em 1% 0.5em 1%; }
#foot .footLeft{padding:0;}
#foot .spTxtS{font-size:85%;line-height: 1.4;}

#foot h2{ margin-bottom:0.3em; width:85%;}
#foot h2 img{width:100%;}
#foot p{ margin-bottom:0.3em; font-size:90%;}

#foot .copyright{font-size:75%; padding:2px 0;}

.spInfoArea h3{font-size:110%; color:#2CA3C9; font-weight:600; line-height:1.4; margin:10px 0 5px 0;}


.spInfoArea p.infoIcon{width:40%;margin-bottom: 8px; height:auto;}
.iconKensa{background:url(../images/iconKensa.png) no-repeat left 0.2em; padding:0 0 0px 25px; background-size:22px; line-height:1.3;}
.holiday{background:url(../images/iconHoliday.png) no-repeat left 0.22em; padding:0px 0 0px 54px; font-size:90%;}

.spInfoArea .borderBox{border-top:1px dotted #959B97; padding:0px 0 0px 0; margin:20px 0 0 0;}



#footArea .spInfoArea .colorGreen{color:#59C7BA}
#footArea .spInfoArea p.sq{margin-bottom:0.3em;}
#footArea .spInfoArea .infoBorder{border-top:1px dotted #0080CB; padding:10px 0; margin-bottom:15px;}

#footArea .spInfoArea p.iconTime{
	background:url(../images/iconTime.png) no-repeat left center; margin:0 0 5px 0;
	padding:0 0 0 23px; font-weight:600; background-size:auto 20px;}

#footArea .spInfoArea p.iconAccess{
	background:url(../images/iconTrain.png) no-repeat left center; margin:0 0 5px 0;
	padding:5px 0 5px 23px; font-weight:600; background-size:auto 20px; border-bottom:1px dotted #333333;}



#footArea .spInfoArea .linksBtn02{margin:5px 0;}
.linksBtn02 li{width:45%; padding:2%;}
.linksBtn02 li img{width:100%;}
.linksBtn02 li{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f3f3f3+50,ededed+51,ffffff+100;White+Gloss+%232 */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(243,243,243,1) 50%, rgba(237,237,237,1) 51%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

border:#CCCCCC solid 1px; border-radius:5px;}

#foot .footLeft{width:100%; float:none;}
.pr10{padding-right:10px;}


#yoyaku{
    width:100%;
	position: fixed;
	z-index: 200; 
	bottom: 0;
	left: 0;
	transition: .3s;}

#yoyaku .footWebYoyku{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff7fa4+1,ff4362+100 */
background: #ff7fa4; /* Old browsers */
background: -moz-linear-gradient(top, #ff7fa4 1%, #ff4362 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ff7fa4 1%,#ff4362 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ff7fa4 1%,#ff4362 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7fa4', endColorstr='#ff4362',GradientType=0 ); /* IE6-9 */	
}



/*  ------------------------------------------------------------ */

/*スマホ用リンクボタン*/

/*  ------------------------------------------------------------ */


/*ボタン下マージン*/

ul.spBtn li{	margin-bottom:4px;}
ul.spBtn li:last-child{  margin-bottom:0em}
.spBtn{	margin-bottom:4px;}



/*基本ボタンカラー*/

.links.spBtn li,
.link.spBtn {
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ff7fa4+1,ff4362+100 */
background: #ff7fa4; /* Old browsers */
background: -moz-linear-gradient(top, #ff7fa4 1%, #ff4362 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #ff7fa4 1%,#ff4362 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #ff7fa4 1%,#ff4362 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ff7fa4', endColorstr='#ff4362',GradientType=0 ); /* IE6-9 */
}

/*四角ボタンカラー*/

.links.spBtn li a,.link.spBtn a{	color:#FFFFFF;}




/* 電話ボタン*/
.link.btnTEL,
.links.spBtn  li.btnTEL{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f196b1+0,f06a8c+100 */
background: #f196b1; /* Old browsers */
background: -moz-linear-gradient(top, #f196b1 0%, #f06a8c 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f196b1 0%,#f06a8c 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f196b1 0%,#f06a8c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f196b1', endColorstr='#f06a8c',GradientType=0 ); /* IE6-9 */
}



/* 予約専用電話ボタン*/
.link.btnyoyakuTEL,
.links.spBtn  li.btnyoyakuTEL{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#e85298+0,b3195c+100 */
background: rgb(232,82,152); /* Old browsers */
background: -moz-linear-gradient(top, rgba(232,82,152,1) 0%, rgba(179,25,92,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, rgba(232,82,152,1) 0%,rgba(179,25,92,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, rgba(232,82,152,1) 0%,rgba(179,25,92,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e85298', endColorstr='#b3195c',GradientType=0 ); /* IE6-9 */
}


/* 予約ボタン*/
.link.reserve,
.links.spBtn  li.reserve{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#f2ba8c+0,f3a15c+100 */
background: #f2ba8c; /* Old browsers */
background: -moz-linear-gradient(top, #f2ba8c 0%, #f3a15c 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #f2ba8c 0%,#f3a15c 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #f2ba8c 0%,#f3a15c 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f2ba8c', endColorstr='#f3a15c',GradientType=0 ); /* IE6-9 */
}

/* 地図ボタン　アイコン変更例*/
.link.map,
.links.spBtn  li.map{ 
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f3f3f3+50,ededed+51,ffffff+100;White+Gloss+%232 */
background: rgb(255,255,255); /* Old browsers */
background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(243,243,243,1) 50%, rgba(237,237,237,1) 51%, rgba(255,255,255,1) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(243,243,243,1) 50%,rgba(237,237,237,1) 51%,rgba(255,255,255,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ffffff',GradientType=0 ); /* IE6-9 */

border:#CCCCCC solid 1px; border-radius:5px;}

.link.map a,
.links.spBtn  li.map a{background-image:url(../images/common/btnSQ.svg) ; color: #333;}


/*ボタンカラー追加例*/

.links.spBtn.green li,
.links.spBtn li.green,
.link.spBtn.green{
/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#bfd255+0,8eb92a+50,72aa00+51,9ecb2d+100;Green+Gloss */
background: #bfd255; /* Old browsers */
background: -moz-linear-gradient(top,  #bfd255 0%, #8eb92a 50%, #72aa00 51%, #9ecb2d 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  #bfd255 0%,#8eb92a 50%,#72aa00 51%,#9ecb2d 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  #bfd255 0%,#8eb92a 50%,#72aa00 51%,#9ecb2d 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bfd255', endColorstr='#9ecb2d',GradientType=0 ); /* IE6-9 */

}



.link.spBtn.download{border:2px solid #8CC99D; background:#FFF;}
.link.spBtn.download a{background-image:url(../images/iconDownload.png) ; color: #4DA061; line-height:1.3; font-size:90%;}

.link.spBtn.medical{
	/* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#fb858e+1,f7646d+100 */
background: #fb858e; /* Old browsers */
background: -moz-linear-gradient(top, #fb858e 1%, #f7646d 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top, #fb858e 1%,#f7646d 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom, #fb858e 1%,#f7646d 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fb858e', endColorstr='#f7646d',GradientType=0 ); /* IE6-9 */
}






/*  -------------------------------------------------------------------------------------------------------------------- */

/* SP 個別ページレイアウト設定 */

/*  -------------------------------------------------------------------------------------------------------------------- */


/*　診療のご案内 ------------------------------------------------- */

.medicalBox dl dt{float:left; width:10%; margin:5px 0px 0 10px;}
.medicalBox dl dd{float:right; width:86%; margin-bottom:20px;}
.medicalBox dl dd br{display:none;}

.displayBlock{display:block;}


/*　内視鏡検査 ------------------------------------------------- */

#contentArea h4.textType{font-size:114%; font-weight:500; margin:0px 0 10px 0; text-indent:0; padding:0 0 0 0;}
#contentArea h4.textType::before{content:none;}

#contentArea h4.imgType{margin:0px 0 10px 0;}

.lightBox{margin:5px 0 10px 0;}
.lightBox dl{width:49%; margin:0 0 10px 0;}
.lightBox dl dt,.systemBox dl dt{margin-bottom:5px;}
.lightBox dl dd{text-align:center; font-size:90%;}

#contentArea h5 img{width:100%;}
#contentArea h5{margin:0 auto 0.5em; width:96%;}

table.listTable td.colorTD{background:#FAFDFE; text-align:center;}
table.listTable td{padding:0.6em 2%;}

table.listTable td .insurance{background:#F5FBFD; border-right:solid 1px #6DC2DE; text-align:center; display:block;}




/*　院長挨拶 ------------------------------------------------- */


#contentArea table.profContent{width:100%;}
 

/*交通アクセス-------------------------------------------*/

.accessMap{padding:5px;}
.accessMap p{padding:5px;}


.googleMap{
position: relative;
padding-bottom: 56.25%;
padding-top: 30px;
height: 0;
overflow: hidden;
width:100%;
}
 
.googleMap iframe,
.googleMap object,
.googleMap embed {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}


#contentArea h3.typeTextH3{font-size:103%;}
#contentArea h3.typeTextH3 br{display:none;}

.accessImg dl dt{width:80%; margin:0 auto;}




/*お知らせ-------------------------------------------*/

#contentArea .news-block h3{
	background:url(../images/newsH3.png) no-repeat -5px center;
	font-weight:bold; margin: 2em 0 1em;  line-height:1;
	border:none;
	border-radius: 5px;
	padding: 12px 5px 12px 24px;
	color:#FFF; 
}




/*スクロール*/
.scroll{
overflow: auto; /*tableをスクロールさせる*/
white-space: nowrap; /*tableのセル内にある文字の折り返しを禁止*/
margin-bottom:10px;
}

.scroll::-webkit-scrollbar{ /*tableにスクロールバーを追加*/
 height: 5px;
}
.scroll::-webkit-scrollbar-track{ /*tableにスクロールバーを追加*/
 background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb { /*tableにスクロールバーを追加*/
 background: #BCBCBC;
}






}
