/* smart.css */

/* common
--------------------------------- */
body{
	font-size: 13px!important;
	-webkit-text-size-adjust : 100%;
}

.noPC{ display: block!important;}
.noSP{ display: none!important;}

.fl_l, .fl_r{
	float: none!important;
}

img{
	max-width: 100%!important;
	height: auto!important;
	display: block;
	margin: 0 auto;
	float: none;
}

.inner{
	width: auto;
	max-width: initial!important;
	max-width: auto!important;
}

/* ヘッダー
---------------------------------------------- */
#header{
	display: block;
	height: 50px;
}

#header .logo{
	display: block;
	width: 80%;
	height: 60px;
}

#header .logo a{
	display: block;
	height: 55px;
	padding-top: 5px;
}

#header .logo a img{
	width: auto!important;
	height: 50px;
}

#nav_btn {position: fixed!important; top: 5px; right: 5px;width: 40px!important; height: 40px!important; z-index:999999;background: rgba(4,69,137,0.4);cursor:pointer;box-sizing: border-box;}
#nav_icon { display: block; position: absolute; top: 50%; left: 50%; width: 24px; height: 2px; margin: -1px 0 0 -12px; background: #fff; transition: .2s; }
#nav_icon:before, #nav_icon:after { display: block; content: ""; position: absolute; top: 50%; left: 50%; width: 24px; height: 2px; margin-left: -12px; background: #fff; transition: .3s; }
#nav_icon:before { margin-top: -6px; }
#nav_icon:after { margin-top: 4px; }

#nav_btn .close { background: transparent!important; }
#nav_btn .close:before, #nav_btn .close:after { margin-top: 0; background: #fff;}
#nav_btn .close:before { transform: rotate(-45deg); -webkit-transform: rotate(-45deg); }
#nav_btn .close:after { transform: rotate(-135deg); -webkit-transform: rotate(-135deg); }

#gnav{
	position: fixed;
	top: 0px;
	float: none;
	width: 100%;
	max-height: 0px;
	z-index: 999;
	overflow: hidden;
	background: rgba(255,255,255,0.9);
	box-shadow: 0px 4px 2px rgba(0,0,0,0.1);
	-webkit-transition: max-height .5s ease-in-out;
	-moz-transition: max-height .5s ease-in-out;
	transition: max-height .5s ease-in-out;

}

#gnav.open{
	height: auto!important;
	max-height: 1500px!important;
}

.nav ul{
	display: block;
	padding: 50px 0;
}

.nav li{
	display: block;
}

.nav li a{
	display: block;
	padding: 20px 10px;
	height: auto;
	line-height: 1;
	color: #80756b;
	font-size: 16px; font-size: 1.6rem;
	text-decoration: none;
	border-top: 1px solid #ccc;
}

#mv{
	height: auto;
	padding: 100px 10%;
	background: url(../img/top/mv_sp.jpg) no-repeat center center;
	background-size: cover;
}

#top_contents{
	display: block;
	max-width: initial!important;
	max-width: auto!important;
}

#top_contents .about, #top_contents .greeting{
	display: block;
	padding: 0;
	background: none;
}

#top_contents .box{
	width: auto;
	max-width: initial!important;
	max-width: auto!important;
	margin: 20px;
	padding: 15px;
}

#top_contents .box::before,
#top_contents .box::after{
	width: 60px;
	height: 40px;
	top: -10px;
}

#top_contents .box::before {	left: -10px;}
#top_contents .box::after {right: -10px;}

#top_contents .about h2, #top_contents .greeting h2{
	padding: 15px 0 0 0!important;
}

/* 
-----------------------------------------------------------*/
.title{
	height: 70px;
	line-height: 70px;
	font-size: 18px; font-size: 1.8rem;
}

.tt{
	font-size: 20px; font-size: 2.0rem;
	margin: 40px 0 20px 0;
}

.case{
	padding: 0;
}

.tb{
	width: 100%;
	margin: 10px 0;
}

.tb th, .tb td{
	padding: 8px 5px;
}

#contents{
	padding: 0 10px 30px 10px;
}

.set{
	display: block;
}

.set .img, .set .txt{
	display: block;
	width: 100%!important;
	padding: 0!important;
}

.set .img{
	margin: 15px 0;
}

.btn, .btn2{
	margin: 20px 0;
}

.btn a, .btn2 a{
	padding: 10px 20px;
	font-size: 15px; font-size: 1.5rem;
}

.btn a::after{
	right: 10px;
}

/* 診療時間・料金表・アクセス（hospital_info）
-----------------------------------------------------------*/
#access .case{
	display: block;
}

#access .case .txt,
#access .case .gmap{
	display: block;
}

#access .case .txt{
	width: auto;
}

#access .case .gmap iframe{
	height: 180px;
	margin-top: 15px;
}


/* フッター
---------------------------------------------- */
.pageup a{
	height: 50px;
	line-height: 50px;
}

footer{
	width: auto;
	padding: 20px 0;
}

footer .logo{
	width: 70%;
}
footer .tel img{
	margin: 20px auto;
}

footer .open{
	text-align: center;
}

.copy{
	margin-top: 20px;
	font-size: 10px; font-size: 1.0rem;
}
