@charset "utf-8";



/* Gloval Reset*/
html { height: 100%; }
body { 
font-size:17px;
background:#fff;
line-height:1.8; 
height: 100%; 
font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', メイリオ, Meiryo, 'ＭＳ Ｐゴシック', sans-serif;
color:#000;
-webkit-text-size-adjust:none;
 /*overflow:hidden;*/}



/*-----------------------------------imgoverを指マークに*/
.imgover { cursor:pointer; }

/*-----------------------------------link*/
a{ outline : 0 ;}
a { text-decoration: underline; color:#000;}
a:hover { text-decoration: none; color:#00b4ff; }

/*-----------------------------------マウスオーバーで画像半透明*/
img.icon:hover{
    opacity: 0.7;
    filter: alpha(opacity=70);
    -moz-opacity: 0.7;
}

/*-----------------------------------マージン*/
.marT5 { margin-top: 5px; }
.marT10 { margin-top: 10px; }
.marT15 { margin-top: 15px; }
.marT20 { margin-top: 20px; }
.marT25 { margin-top: 25px; }
.marT30 { margin-top: 30px; }
.marT40 { margin-top: 40px; }
.marB5 { margin-bottom: 5px; }
.marB10 { margin-bottom: 10px; }
.marB15 { margin-bottom: 15px; }
.marB20 { margin-bottom: 20px; }
.marB30 { margin-bottom: 30px; }
.marB40 { margin-bottom: 40px; }
.marB50 { margin-bottom: 50px; }
.marB60 { margin-bottom: 60px; }
.marB70 { margin-bottom: 70px; }
.marB80 { margin-bottom: 80px; }
.marR5 { margin-right: 5px; }
.marR7 { margin-right: 7px; }
.marR8 { margin-right: 8px; }
.marR10 { margin-right: 10px; }
.marR20 { margin-right: 20px; }
.marL10 { margin-left: 10px; }
.center{text-align:center;}
.left{text-align:left;}
.right{text-align:right;}
.claerB{clear:both;}
.fR{float:right;}
.fL{float:left;}
.small{font-size:11px;}
.f12{font-size:12px;}
.f13{font-size:13px;}
.f14{font-size:14px;}
.f15{font-size:15px;}
.f16{font-size:16px;}
.f17{font-size:17px;}
.f18{font-size:18px;}
.f20{font-size:20px;}
.f22{font-size:22px;}
.pink{color:#ed1e79;}
.ore{color:#F39B00;}
.blue{color:#00b4ff;}
.bold{font-weight:bold;}
.w650{width:650px;}
.w260{width:260px;}

.hidari {
  float: left;
  margin-right: 2em;
  margin-bottom: 1em;
}

.migi {
  float: right;
  margin-left: 2em;
  margin-bottom: 1em;
}


.sponly{display: none;}



/*-----------------------------------コンテナ*/
#container{width:100%; margin:0 auto; margin-top: 120px;}



/*-----------------------------------header設定（PC）*/
#pcheader{width: 100%; margin: 0 auto; position: fixed; z-index: 10; border-top: 4px solid #00b4ff; background: #fff; top:0px;}
#pcheader #area{width: 1000px; margin-left: auto; margin-right: auto; position:relative; height: 120px;}
#pcheader #area h1{position:absolute; z-index:20; left:0; top:35px;}
#pcheader #area #btn{position: absolute; z-index: 20; right: 0; top: 0;}
#pcheader #area #btn li{float: left; margin-left: 10px; list-style: none;}

#pcheader nav{position:absolute; right:0; top:55px;}
#pcheader nav ul{text-align: center; height:40px;}
#pcheader nav li{height:40px; margin-right:10px; margin-left: 10px; font-size:15px; text-align:center; line-height: 40px; float: left;}


#pcheader nav li:last-child{margin-right:0;}
/* hover時のアンダーライン
https://www.nxworld.net/tips/css-hover-underline-animation-examples-and-sass-mixin.html*/
#pcheader nav li a{
	display: inline-block;
	position: relative;
	color: #000;
 	text-decoration: none;
}
#pcheader nav li a:before{
	content: "";
	position: absolute;
	left: 0;
	bottom: -3px;
	width: 100%;
	height: 3px;
	background: #00b4ff;
	transform: scale(0, 1);
	transition: 0.4s;
}
#pcheader nav li a:hover:before {
	transform: scale(1);
}
/* hover時のアンダーライン end*/

#spheader{display:none;}

/************グローバルナビ　ツールチップ設定（PC）************/
/* https://memocarilog.info/webdesign/4615 */
#tooltip{
    margin:0px;
}
#tooltip li{
    height:40px;
    display:block;
    float:left; 
    position:relative;      
}
#tooltip li > div {
    min-height: 20px;
    position: absolute;
    top:60px;
    padding: 10px;
    visibility:hidden;
    opacity: 0;
    background: #ffffff;
    font-size:1em;
    line-height: 30px;

    -moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
    border-radius: 5px; 

    -moz-box-shadow: 0 0 8px gray; 
    -webkit-box-shadow: 0 0 8px gray; 
    filter: progid:DXImageTransform.Microsoft.Shadow(color='#272229', Direction=135, Strength=3); 
    box-shadow: 0 0 8px gray; 
    
  　-moz-transition: all 0.5s ease-in-out; 
    -webkit-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out; 
    transition: all 0.5s ease-in-out;
}
#tooltip li > div:after {
    content:"\25B8"; 
    display:block;
    font-size:2em;
    height:0;
    line-height:0;
    position:absolute;
    color:#fff;
    top:-3px;
    left:1px;
    text-align:center;
    -moz-transform:rotate(90deg);
    -webkit-transform:rotate(270deg);
    width:100%;
    text-shadow: 3px 0 2px #ccc;
}
#tooltip li:hover > div {
    visibility:visible;
    opacity: 1;
    top:60px;
    font-size: 90%;

    -moz-transition: all 0.5s ease-in-out;
    -webkit-transition: all 0.5s ease-in-out; 
    -o-transition: all 0.5s ease-in-out; 
    transition: all 0.5s ease-in-out;
}
#tooltip li:hover > div a{text-decoration:none; color:#000;}
#tooltip li:hover > div a:hover{text-decoration:none; color:#ed1e79;}
#tooltip li:hover > div a:before{background: #fff;}

/************グローバルナビ　ツールチップ設定（PC）************/

/*-----------------------------------下層タイトル*/
#pagetitle{width: 100%; margin-bottom: 40px; text-align: center; position: relative;}
#pagetitle h2{position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto;}

.all{width:1000px; margin:0 auto 60px auto;}

h3{border-left:5px solid #00b4ff; color:#00b4ff; font-size:22px; padding-left:20px; margin-bottom:30px;}

h4{background: url(../images/mark_white.png) left center no-repeat #00b4ff; padding-top:10px; padding-bottom:10px; padding-left:55px; font-size:18px; color:#fff; margin-bottom:20px;}

.bar{background:#00b4ff; padding:8px 20px; font-size:18px; color:#fff; margin-bottom:20px; font-weight: bold;}

.kome {text-indent: -1em; margin-left: 1em;}
.kome:before {content: '※';}

.txt01{color:#ed1e79; font-weight:bold; font-size:130%;}
.txt02{font-weight:bold; font-size:130%;}


.listmaru li ul{list-style-position: inside;}
.listmaru li{list-style: none; border-bottom: 1px dotted #b3b3b3; padding-bottom: 5px; padding-top: 5px; font-weight: bold; font-size: 120%; padding-left: 1.5em; text-indent: -1.5em;}
.listmaru li:before{content:'◎ '; color: #00b4ff;}

.listmaru2 li ul{list-style-position: inside;}
.listmaru2 li{list-style: none; padding-left: 1.5em; text-indent: -1.5em;}
.listmaru2 li:before{content:'◎ '; color: #00b4ff;}

.listmaru3 li ul{list-style-position: inside;}
.listmaru3 li{list-style: none; border-bottom: 1px dotted #b3b3b3; padding-bottom: 5px; padding-top: 5px; font-weight: bold; font-size: 120%; padding-left: 1.5em; text-indent: -1.5em; float: left; width: 45%; margin-right: 35px;}
.listmaru3 li:before{content:'◎ '; color: #00b4ff;}
.listmaru3 li:nth-child(even){margin-right: 0;}


/* 外来診療表 */
#time{width: 100%; margin-bottom: 20px;}
#time th{background: #ece5dc; border: 1px solid #b3b3b3; padding: 10px; font-weight: normal; text-align: center; vertical-align: middle;}
#time td{border: 1px solid #b3b3b3; padding: 20px 10px; text-align: center; vertical-align: middle;}
#time td img{vertical-align: middle;}
#yoyakusei{vertical-align: middle; margin-bottom: 20px;}
#yoyakusei img{vertical-align: middle; margin-left: 30px;}


/*-----------------------------------PC専用footer*/

#pcfooter{width:1000px; margin: 0 auto;}
#pcfooter table{width: 100%; margin-top: 50px; margin-bottom: 50px;}
#pcfooter td{border-left: 1px solid #b3b3b3; padding: 10px 20px; font-size: 15px;}
#pcfooter td span{color: #00b4ff; padding-right: 5px;}
#pcfooter td a{text-decoration: none;}
#pcfooter td a:hover{text-decoration: none; color: #0064ff}
#pcfooter td:nth-child(3){border-right: 1px solid #b3b3b3;} 

#copy{ height: 30px; width: 100%; text-align: center; line-height: 30px; background: #fff; font-size: 12px; background: #00b4ff; color: #fff;}

/*-----------------------------------フッター問い合わせエリア*/
#btninfo{width: 100%; padding-top: 50px; padding-bottom: 30px; border-top: 1px solid #b3b3b3;}
#btninfo #area{width: 1000px; margin: 0 auto;}
#btninfo #area #title{font-weight: bold; font-size: 25px; margin-bottom: 30px; line-height: 40px; height: 40px;}
#btninfo #area #title img{margin-right: 10px; vertical-align: middle;}
#btninfo #area #bnr{text-align: center;} 
#btninfo #area #bnr img{margin-left: 4px; margin-right: 4px;}

/*-----------------------------------フッターアドレスエリア*/
#add{width: 100%; padding-top: 40px; padding-bottom: 40px; text-align: center; line-height: 25px; font-size: 90%;}
#add img{ margin-bottom: 20px;}

/*-----------------------------------下部バナーエリア*/
#bnrarea{width: 100%; background: #e6e6e6; padding-top: 20px; padding-bottom: 20px; text-align: center;}
#bnrarea img{margin-left: 10px; margin-right: 10px;}

/*-----------------------------------pagetop設定*/
#page-top {position: fixed; bottom: 20px; right: 20px;}



/*================================================
 *  タブレット向けデザイン
 ================================================*/
/* スクロールバーを考慮して20px大きいサイズで切り替え */
@media screen and (max-width:1100px) {

.all{width:95%;}

}

/*================================================
 *  スマートフォン向けデザイン
 ================================================*/
@media screen and (max-width:767px) {

body{ font-size:13px;}
img{
max-width: 100%;
height: auto;
width /***/:auto;　
}

.pconly{display: none;}
.sponly{display: block;}

/*-----------------------------------コンテナ*/
#container{width:100%; margin:0 auto; margin-top: 60px;}

/*-----------------------------------header設定（PC）*/

#pcheader{display:none;}
#spheader{position: fixed;
    top: 0;
    left:0;
	height:60px;
	width:100%;
	z-index:30;
	display:block;
    background-color:#fff;
    border-bottom: 2px solid #00b4ff;
    margin-bottom: 0px;
	}

#spheader h1{position: absolute; top: 10px; left:10px; z-index: 13;}
#spheader h1 img{width: 250px;}

/******* ハンバーガーメニューここから *******/
.menu-btn {
    position: absolute;
    top: 15px;
    right: 10px;
    width: 30px;
    height: 30px;
    cursor: pointer;
    z-index: 10;
}
.menu-btn img{width: 80px;}

.menu-btn span {
    color: #fff;
}

.menu-btn span:after {
    content: attr(data-txt-menu);
}

/* 開閉用ボタンがクリックされた時のスタイル */
.open .menu-btn span:after {
    content: attr(data-txt-close);
}

.menu {
    position: fixed;
    display: table;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(0,180,255,0.9);
    -webkit-transition: all .5s;
    transition: all .5s;
    visibility: hidden;
    opacity: 0;
}

.menu ul {
    display: table-cell;
    vertical-align: middle;
}

.menu li {
    width: 300px;
    height: 28px;
    line-height: 28px;
    margin: 0 auto;
    text-align: center;
    border-bottom: 1px solid #fff;
    text-align: left;
    font-family: "M PLUS 1p";
}

.menu li a {
    display: block;
    font-size: 15px;
    color: #fff;
    text-decoration: none;
}

.menu li a:hover {
    color: #fff;
}
.menu li.linenone{border-bottom: none;}

.menu li:nth-child(1){padding-top: 50px;}

/* 開閉用ボタンがクリックされた時のスタイル */
.open .menu {
    cursor: url(../images/cross.svg),auto;
    -webkit-transition: all .5s;
    transition: all .5s;
    visibility: visible;
    opacity: 1;
}
/******* ハンバーガーメニューここまで *******/

#pagetitle{width: 100%; margin-bottom: 20px; text-align: center; position:static;}
#pagetitle h2{position: static; top: 0; left: 0; right: 0; bottom: 0; margin: auto;}
#pagetitle h2 img{width: 100%;}

.all{width:95%; margin:0 auto 30px auto; word-wrap:break-word;
}
h3{font-size:18px; padding-left:10px; margin-bottom:20px;}
h4{padding-top:5px; padding-bottom:5px; padding-left:50px; font-size:16px; margin-bottom:15px;}

.listmaru3 li{width: 95%; margin-right: 0px;}

.bar{background:#00b4ff; padding:5px 10px; font-size:16px;}


/* 外来診療表 */

#time th{padding: 5px;}
#time td{padding: 10px 5px;}
#time td img{width: 35px;}
#yoyakusei{}
#yoyakusei img{width: 65%; margin-left: 0px;}


/*-----------------------------------フッター問い合わせエリア*/
#btninfo{width: 100%; padding-top: 20px;}
#btninfo #area{width: 100%; margin: 0 auto;}
#btninfo #area #title{font-size: 20px; margin-bottom: 30px;}
#btninfo #area #title img{margin-right: 3px; vertical-align: middle; width: 40px;}
#btninfo #area #bnr{text-align: center;} 
#btninfo #area #bnr img{ width: 70%; margin-left: 4px; margin-right: 4px;}

#btninfo{padding-bottom: 20px;}
#btninfo #area{width: 95%;}
#btninfo #area #title{font-size: 20px; margin-bottom: 10px; line-height: 40px; height: 40px; text-align: center;}

/*-----------------------------------フッターアドレスエリア*/
#add{padding-top: 30px; padding-bottom: 30px; line-height: 22px; font-size: 90%;}
#add img{ width: 50%; margin-bottom: 10px;}

/*-----------------------------------下部バナーエリア*/
#bnrarea{width: 100%;}
#bnrarea img{ width: 32%; margin-left: 1px; margin-right: 1px;}

/*-----------------------------------SP専用footer*/
#pcfooter{display: none;}

#copy{font-size:10px;}




}
