@charset "utf-8";
/*

color
赤#bd3361
黒#2a2a2a
グレー#a6a6a6
ライトグレー#f0f0f0
ブルー・グレー#dde6e6
文字用ブルー・グレー62a6a6
*/

/*---------------------------------


	COMMON
	
	
-----------------------------------*/

/* header */
header img{
height:100%;
}
footer img{
width:100%;
height:auto;
}
header h1,header .tel{
height:50px;
}
header{
padding:25px 0 10px;
}

.header ul{
font-size:1.3rem;
font-weight:;
padding:15px 0 5px;
justify-content:space-between;
}
.header li{
margin:0 1% 10px;
letter-spacing:1;
}
@media only screen and (max-width: 720px){
	header.flx{
		display:inherit;
		text-align:center;
		padding:10px 0 0;
	}
	header img{
		width:auto;
	}
	header h1,header .tel{
		width:95%;
		height:auto;
		max-width:480px;
		margin:0 auto 10px;
	}
	header h1 img,header .tel img{
		width:100%;
		padding:0 34px;
	}
	.header ul li{
		width:100%;
		margin:0 0 1.5rem 10%;
	}
	/*navigation*/
	/*.win_sml, */
	button.drawer-hamburger{
		display:block;
		width:26px;
		padding:10px 8px 20px;
		background:rgba(255,255,255,0.8);
		top:9px;
	}
	button.drawer-hamburger:hover{
		background:rgba(255,255,255,0.8);
	}
	.drawer-open button.drawer-hamburger{
		background:rgba(255,255,255,1);
	}
	.win_lrg{
		display:none;
	}
}
/* 矯正バナー */
.headolbanner {
	max-width: 960px;
	margin: 10px auto 20px;
	display: flex;
	font-size: 90%;

}
.headolbanner .banner {
	margin:0 15px 0 0;
}
.headolbanner .banner img {
	max-height: 40px;
	width: auto;
	display: block;
}
.headolbanner .caution {
	flex: 1;
	border: 1px solid #bd3361;
	padding: 0.5rem 0.8rem;
	background: rgba(255, 255, 255, 0.5);
	
}


@media only screen and (max-width: 720px){
	.olbanner {
		margin: 0 auto 2rem;
	}
	.olbanner img {
		max-height: 40px;
		display: block;
		margin: 0.5rem auto;
	}
}

@media only screen and (min-width: 721px){
/*navigation*/
	.win_sml, button.drawer-hamburger{
		display:none;
	}
	.win_lrg{
		display:block;
	}
}

/* footer */
footer .address{
background:#dde6e6;
padding:25px 0;
}
footer .name_box{
margin-bottom:20px;
}
footer .name_box img,footer .tel_box img{
height:50px;
width:auto;
}

footer .info_box,footer .on_box,footer .card_box{
background:#fff;
padding:15px 20px;
}
footer .info_box{
width:49%;
}

footer .info_box img{
}
footer .on_box{
width:49%;
}
footer .on_box p{
font-size:1.1rem;
text-align:left;
}
footer .on_box span{
color:#CCC;
}
footer .on_box .calendar {
width:47%;
margin-bottom:6px;
}
footer .on_box .calendar caption {
font-weight:bold;
border-bottom:1px solid #CCC;
margin-bottom:5px;
padding-bottom:5px;
}
footer .on_box .calendar thead th {
font-size:1.1rem;
}
footer .on_box .calendar td {
}
footer .on_box .calendar .off {
color:#FFF;
background:#CCC;
}

/* 施設基準 */
footer .guideline{
	max-width: 960px;
	margin: 15px auto 0;
	width:100%;
	background: rgba(255, 255, 255, 1);
	padding: 10px 15px;
	border: 1px solid #fff;
  box-shadow: inset 0 0 0 1px #bd3361, 0 0 0 1px #bd3361;
}
footer .guideline strong{
	color: #bd3361;
	display: block;
	font-size: 16px;
	margin-bottom:5px;
}
footer .card_box{
width:100%;
margin-top:13px;
}
footer .card_box div > img{
width:auto;
height:18px;
}
footer .card_box ul li img{
}
footer .card_box ul li{
width:45px;
margin:0 5px;
}
/* 矯正バナー */
.footolbanner {
	max-width: 960px;
	margin: 20px auto 20px;
	display: flex;
}
.footolbanner .banner {
	margin:0 15px 0 0;
}
.footolbanner .banner img {
	max-height: 60px;
	width: auto;
	display: block;
}
.footolbanner .caution {
	flex: 1;
	border: 1px solid #bd3361;
	padding: 0.5rem 0.8rem;
	background: rgba(255, 255, 255, 1);
	
}

footer .sitemap{
background:#f0f0f0;
font-size:1.3rem;
color:#343434;
padding:25px 0;
}
footer .sitemap .inner > ul{
width:25%;
}
footer .sitemap .inner > ul:nth-of-type(2){
column-count: 2;
width:50%;
}
footer .sitemap li{
margin-bottom:0.7rem;
}
footer .sitemap ul ul{
margin-top:0.7rem
}
footer .sitemap li li{
font-size:1.1rem;
list-style:inside;
}
footer .sitemap li a{
display:inline-block;
}

@media only screen and (max-width: 720px){
	footer .address .inner{
		display:inherit;
		padding:0 2%;
	}
	footer .name_box img,footer .tel_box img{
		height:inherit;
		width:100%;
	}
	footer .name_box,
	footer .tel_box,
	footer .info_box,
	footer .on_box,
	footer .card_box{
		width:auto;
		max-width:420px;
		margin:0 auto 10px;
		text-align:center;
	}	
	footer .card_box ul {
		width:auto;
	}
	footer .sitemap{
		padding:25px 2%;
	}
	footer .sitemap .inner > ul,footer .sitemap .inner > ul:nth-of-type(2){
		column-count: 1;
		width:100%;
	}
	footer .sitemap .inner{
		display:inherit;
	}
}

.pagetop a{
position:fixed;
bottom:-3rem;
right:-3rem;
background:rgba(0,0,0,0.75);
width:6.5rem;
height:6.5rem;
border-radius:50%;
}
.pagetop a:after{
display:block;
content:'';
border: 6px solid transparent;
border-bottom: 8px solid #FFF;
width:0;
margin:1rem 0 0 1.55rem;
}

.copy{
text-align:center;
margin:1rem auto;
}


header,.inner,.header ul{
max-width:960px;
margin:0 auto;
}

/* parts */
h2{
font-size:2.2rem;
margin-bottom:30px;
font-weight:bold;
}
.top h2{
text-align:center;
}
.top h2:first-letter{
color:#bd3361;
}
.top h3{
font-size:1.6rem;
margin-bottom:20px;
font-weight:bold;
text-align:center;
}

h4{
border-left:#bd3361 4px solid;
padding-left:1rem;
margin-bottom:10px;
font-weight:bold;
}


.link{
background:url(../../medical/imgs/icon_link.png) left 0.5rem no-repeat;
background-size:7px auto;
padding-left:12px;
}
.btnlink{
text-align:right;
}
.btnlink a{
border: solid 1px #d0d0d0;
box-shadow: 0 2px 0 #d0d0d0;
padding:10px 10px 10px 3%;

min-width:25rem;
max-width:300px;
display:block;
font-size:1.4rem;
margin:20px 0 20px auto;
text-align:center;
background:url(../../medical/imgs/icon_link.png) 1rem center no-repeat;
background-size:7px auto;
}

ul.normal_li, ol.normal_li{
list-style:outside;
}
ol.normal_li{
list-style:decimal
}
ul.normal_li li, ol.normal_li li{
margin-left:2rem;
}


/* font color */
.fc_st{
color:#bd3361
}
.fc_dw{
color:#62a6a6
}
/* margin */
.marg20{
margin-bottom:20px;
}
.marg30{
margin-bottom:30px;
}


/*img right left*/
.pageinner .flx_left{
	padding-right:20px;
	margin-right:auto;
	text-align:left;
}
.pageinner .flx_right{
	padding-left:20px;
	margin-left:auto;
	height:auto;
}
.pageinner.flx p{
	flex:1;
}

.pageinner .flx_left img,
.pageinner .flx_right img{
	display:block;
	width:auto;
	min-width:200px;
	max-width:450px;
}

@media only screen and (min-width: 0px) and (max-width: 640px){
	.pageinner .flx_left{
		padding-right:0;
	}
	.pageinner .flx_right{
		padding-left:0;
	}
	.pageinner .flx_left img,
	.pageinner .flx_right img{
	margin-left:auto;
	margin-right:auto;
	max-width:100%;
	}
}
/* page common */
.panlist{
border-top:1px solid #a6a6a6;
height:2rem;
}

.panlist ul, .pagetitle h1{
max-width:960px;
margin:0 auto;
}
.pagetitle {
border-top:2px solid #bd3361;
background:#2a2a2a;
width:100%;
}
.pagetitle h1{
color:#FFF;
font-size:2.2rem;
letter-spacing:0.3rem;
font-family: 'Noto Serif JP', serif;
padding:0.4rem 0;
}

.mainarea{
max-width:960px;
margin:30px auto;
word-break:break-all;
}
.read{
margin:0 auto 30px;
line-height:1.7;
}
.pageinner{
margin:0 10px 30px;
line-height:1.7;
}
/*title直下P*/
.pageinner > p:first-child{
margin-bottom:20px;
}

/*---------------------------------


	TOP
	
	
-----------------------------------*/
.mainbg{
position:relative;
width:100%;
height:550px;
margin-bottom:70px;
}

.swiper-container{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
z-index:1;
}
.swiper-container ul li{
width:100%;
height:550px;
}
.swiper-slide.bg01{
background:url(../../imgs/top_mainimage.jpg) center center no-repeat;
background-size:cover;
}
.swiper-slide.bg02{
background:url(../../imgs/top_mainimage2.jpg) center center no-repeat;
background-size:cover;
}
.swiper-slide.bg03{
background:url(../../imgs/top_mainimage3.jpg) center center no-repeat;
background-size:cover;
}

/*
.mainimage{
position:absolute;
top:0;
left:0;
width:100%;
height:550px;
z-index:2;
}
.mainimage .medical_main{
}
.mainimage .medical_main div{
margin-bottom:20px;
}
.medical1, .medical4{
margin-left:20px
}
.mainimage .medical_main div img{
width:116px;
}
*/

ul.medical_top{
margin-bottom:70px;
}
ul.medical_top ul{
margin:0 auto;
}
ul.medical_top li{
margin:12px;
border:1px solid #fff;
box-shadow:inset 0 0 0 1px #ccc, 0 0 0 1px #ccc;
font-size:1.3rem;
text-align:center;
line-height:1;
}

ul.medical_top li a{
width:120px;
height:120px;
display:block;
}
ul.medical_top li a img{
width:40%;
height:auto;
display:block;
margin:0 auto;
padding-top:22%;
}
ul.medical_top li a:hover{
background:#62a6a6;
opacity:1;
filter: alpha(opacity=0);
color:#FFFFFF;
}
ul.medical_top li a:hover img{
filter: brightness(100);
}
ul.medical_top li span{
font-size:0.9rem;
line-height:1;
}

.top.covid_box{
	width:90%;
	margin:0 auto 50px;
	font-size:1.3rem;
	line-height:1.7;
	border:2px solid #bd3361;
	padding:20px;
	}
.top.covid_box h3{
	font-size:1.8rem;
	color:#bd3361;
	margin: 0 0 1rem;
}
.top.covid_box p{
	font-size:1.6rem;
	margin: 0 0 1rem;
	padding: 1rem 0 0;
	border-top:1px solid #bd3361;
}
.top.apperl{
width:90%;
margin:0 auto 50px;
font-size:1.3rem;
line-height:1.7;
border:1px solid #fff;
box-shadow:inset 0 0 0 1px #bd3361, 0 0 0 1px #bd3361;
padding:20px;
}

@media only screen and (min-width: 0px) and (max-width: 720px){
		.mainimage.flx.around{
		justify-content:space-between;
		}
}
@media only screen and (min-width: 0px) and (max-width: 480px){
		.swiper-container ul li/*,
		.mainimage*/{
		height:440px;
		}
		.mainimage .medical_main{
		display:none;
		}
}
/*---------------------------------


	single page
	
	
-----------------------------------*/
/* about */

.about_box{
min-height:50vh;
padding:100px auto;
margin-top:40px;
background-size:cover;
background-position:center center;
}
.about_box p{
text-align:left;
font-size:1.3rem;
line-height:1.7;
}
.about_box p:first-child{
font-size:1.8rem;
margin-bottom:20px;
}
.about_box:nth-child(odd) p{
margin-right:50%;
}
.about_box:nth-child(even) p{
margin-left:50%;
}
@media only screen and (min-width: 0px) and (max-width: 640px){
	.about_box:nth-child(odd) p,
	.about_box:nth-child(even) p{
	margin:0 2%;
	text-shadow:-1px -1px 1px #FFF,-1px 1px 1px #FFF,1px -1px 1px #FFF,1px 1px 1px #FFF;
	}
}
/*price list*/
.single_page h2{
font-size:1.7rem;
padding-bottom:6px;
border-bottom: solid 1px #a6a6a6;
box-shadow: 0 2px 0 #FFF,0 3px 0 #a6a6a6;
}
.single_page h2:first-letter{
color:#bd3361;
}
.single_clumn{
width: 85%;
margin-left:15%;
}
.single_clumn .pickup{
padding: 1rem;
border: #bd3361 1px solid;
}

/*flow*/
.flow_title .number{
background:url(../../imgs/icon_flowhead.png) left center no-repeat;
background-size:29px auto;
min-height:38px;
color:#FFFFFF;
width:3rem;
font-size:1.6rem;
padding:0.6rem 0 0;
}
.flow_title .title{
color:#bd3361;
font-size:1.8rem;
margin:0.6rem
}
.flow_title:after {
border-top: 1px solid #a6a6a6;
content: "";
display: inline; /* for IE */
flex-grow: 1;
margin-left: 0.5em;
}
.flow h4{
margin-top:15px;
}
.flow.single_clumn{
position: relative;
margin-bottom:50px;
}
.flow.single_clumn::after {
position: absolute;
content:"";
display: block;
width:100%;
bottom: -50px;
height:50px;
left:0;
background:url(../../medical/imgs/icon_flow.png) center center no-repeat;
background-size:33px 30px;
}
.flow.single_clumn.en::after {
background-image:none;
}
div.modal{
width:auto;
max-width:100%;
}
div.modal img{
width:auto;
height:auto;
max-width:100%;
max-height:100%;
}



@media only screen and (min-width: 0px) and (max-width: 640px){
	.single_clumn{
	display:inherit;
	width:96%;
	margin:10px auto 0;
	}
	.single_clumn .flx_right{
	margin:10px auto 0;
	text-align:center;
	}
}

/*facility list*/
.inside{
margin-bottom:50px
}
.inside img{
max-width:100%;
}
.inside_photo{
margin-top:20px;
}
.inside_photo img{
width:calc((100% - 40px) / 3);
height:calc((100% - 40px) / 3 * 0.64);
}
.explain{
}
.explain p{
margin:0 0 10px;
}
.explain_box{
width:49%;
margin-bottom:20px;
}
.explain_box img{
width:100%;
height:auto;
margin-top:10px;
}
@media only screen and (min-width: 0px) and (max-width: 720px){
	.explain_box{
	width:96%;
	margin:0 auto 20px;
	}
}
/*price list*/
.price{
display: table;
}
.price dl{
display:table-row;
}
.price dl:nth-child(2n){
background:#f0f0f0;
}
.price h4{
margin-top:20px;
}
.price dl dt{
width:60%;
}
.price dl dt,.price dl dd{
display:table-cell;
padding:12px 10px;
}
.price dl span{
font-size:0.9rem;
}
.price dl.priceinner{
background:none;
}
.price > p{
margin:10px 0;
}
dl.priceinner dt, dl.priceinner dd{
color:#a6a6a6;
border-top:1px solid #a6a6a6;
padding:4px 4px 4px 2rem;
}
dl.dlclm dd{
overflow: hidden;
}
dl.dlclm dt p{
margin-left:2rem;
}
dl.dlclm dt p.in{
margin-left:4rem;
}
dl.dlclm dd{
vertical-align:bottom;
}
/*staff*/
.staff {
border:2px solid #dde6e6;
margin-bottom:30px;
}
.staff .photo{
width:18%;
margin:20px 0 20px 20px;
}
.staff .photo img{
width:100%;
}
.staff .profile{
width:30%;
margin:20px;
}
.staff .profile p{
margin-bottom:12px;
}
.staff .profile p.job{
font-size:1.3rem;
}
.staff .profile p.name{
font-size:2.4rem;
}
.staff .profile strong{
font-size:1.35rem;
}
.staff .history{
width:47%;
background:#dde6e6;
padding:20px;
}
.staff dl dt{
width:30%;
}
.staff dl dd{
width:68%;
}
@media only screen and (min-width: 0px) and (max-width: 720px){
	.staff{
	display:inherit;
	}
	.staff .photo{
	text-align:center;
	}
	.staff .photo img{
	width:60%;
	max-width:260px;
	}
	.staff .profile p{
	margin-bottom:0;
	text-align:center;
	}
	.staff .photo,
	.staff .profile,
	.staff .history{
		width:auto;
	}
}
/*recruit*/
.recruit{
display: table;
}
.recruit dl{
display:table-row;
}
.recruit dl dt{
width:20%;
}
.recruit dl dt,.recruit dl dd{
display:table-cell;
padding:12px 10px;
border-top:1px solid #a6a6a6;
}
.recruit div div{
width:48%;
}
.recruit div img{
width:100%;
display:block;
}
@media only screen and (min-width: 0px) and (max-width: 640px){
.recruit > div{
display:inherit;
margin:0 auto;
}
.recruit div div{
width:100%;
text-align:center;
margin:0 0 20px;
}

}

/* access */
.access{
border:2px solid #dde6e6;
margin-bottom:30px;
}
.access dl{
margin:20px;
}
.access dl dt{
width:20%;
font-weight:bold;
margin-bottom:10px;
}
.access dl dd{
width:78%;
margin-bottom:10px;
}
.access #mapcanvas{
height:50vh;
min-height:400px;
}
.access #mapcanvas iframe{
width:100%;
height:100%;
filter: saturate(0%);
}