@charset "utf-8";

/*sp nav
************************************************************************************/
.sp_menu_icons{
	display: none;
}
@media screen and (max-width: 979px) {
.sp_menu_icons{
	display: block;
	margin: 22% 1% 2%;
}
.sp_menu_icons ul{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: auto;
	column-gap: 5px;
	row-gap: 5px;
	align-items: stretch;
}
.sp_menu_icons ul li{
	background: #eec8ed;
	border-radius: 5px;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
}
.sp_menu_icons ul li a,
.sp_menu_icons ul li label{
	color: #353434;
	text-decoration: none;
	display: block;
	padding: 15px;
	background:  url("../../img/ar_white.svg") no-repeat right 15px center;
	-moz-background-size: 15px auto;
	background-size: 15px auto;
}
.sp_menu_icons ul li img.icon{
	width: 15px;
	height: auto;
}

}
@media screen and (max-width: 620px) {
.sp_menu_icons ul{
	grid-template-columns: 1fr 1fr;
}
.sp_menu_icons ul li a,
.sp_menu_icons ul li label{
	padding: 10px;
}

}
/*first
************************************************************************************/
#first .prof-frame{
	display: grid;
	grid-template-columns: 1fr 5fr;
	grid-template-rows: auto;
	column-gap: 50px;
	row-gap: 50px;
	align-items: stretch;
}
#first .prof-frame .photo img{
	width: 100%;
	height: auto;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
}
#first .prof-frame .profile dl{
	float: left;
}
#first .prof-frame .profile dl:first-child{
	margin-right: 40px;
}
#first #message{
	margin: 30px 0 50px;
	padding: 65px 0 0;
	position: relative;
}
#first #message p{
}
#first #message:after{
	position: absolute;
	top: 0px;
	font-family: "century-gothic", sans-serif;
	content: "Greeting";
	color: #d4eef4;
	font-size: 60px;
	font-style: italic;
	z-index: -1;
}
@media screen and (max-width: 979px) {
#first .prof-frame{
	display: grid;
	grid-template-columns: 2fr 5fr;
	grid-template-rows: auto;
	column-gap: 20px;
	row-gap: 20px;
	align-items: stretch;
}
#first .prof-frame .profile dl{
	float: none;
}
#first .prof-frame .profile dl:first-child{
	margin: 0 0 40px 0;
}
#first #message:after{
	color: #b7d9e6;
}
}
@media screen and (max-width: 768px){
#first #message .txt_l{
	font-size: 15px;
}
}
@media screen and (max-width: 480px){
#first #message{
	margin: 30px 0 50px;
	padding: 15px;
	background-color: rgba( 255, 255, 255, 0.75 );
	position: static;
}
#first #message:after{
	display: none;
}
#first #message:before{
	position: relative;
	top: 0px;
	font-family: "century-gothic", sans-serif;
	content: "Greeting";
	color: #d4eef4;
	font-size: 60px;
	font-weight: 700;
	font-style: italic;
	z-index: 1;
}
#first .prof-frame{
	display: block;
}
#first .prof-frame .photo img{
	width: 50%;
	margin: auto;
	display: block;
}
#first .prof-frame .profile{
	border-bottom: 1px solid #c58fcd;
	padding-bottom: 30px;
	margin-bottom: 30px;
}
#first .prof-frame .profile dl:first-child{
	margin: 0 0 10px 0;
}
#first .prof-frame .profile .lv_h4{
	margin: 15px 0 3px;
}
}


/*main-diseases-treated
************************************************************************************/
#main-diseases-treated{
	background: #fff2f2;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	margin: 60px auto;
	padding: 4% 5%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

#main-diseases-treated .wrapper{
	display: grid;
	grid-template-columns: 2fr 4fr;
	grid-template-rows: auto;
	column-gap: 50px;
	row-gap: 50px;
	align-items: stretch;
}
#main-diseases-treated .wrapper .image img{
	width: 100%;
	height: auto;
	border-radius: 15px;
	-webkit-border-radius: 15px;
	-moz-border-radius: 15px;
}


@media screen and (max-width: 768px){
#main-diseases-treated{
	margin: 30px auto;
	padding: 6% 5%;
}
#main-diseases-treated .wrapper{
	display: block;
}
}


/*#examinations
************************************************************************************/
#examinations{
	background: #fbfce9;
	padding: 3% 5%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
}
#examinations a{
	color: #000;
	text-decoration: none;
	display: block;
}

#examinations ul{
	display: grid;
	grid-template-columns: 1fr 1fr 1fr;
	grid-template-rows: auto;
	column-gap: 40px;
	row-gap: 40px;
	align-items: stretch;
}
#examinations ul li{
	background: #FFF;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	padding: 25px 25px 45px;
	text-align: center;
	position: relative;
}
#examinations ul li:after{
	content: "more »";
	position: absolute;
	bottom: 10px;
	right: 25px;
	color: #efb04c;
}
#examinations ul li .image{
	width: 50%;
	margin: auto;
	background: #000;
	overflow: hidden;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	font-size: 0;
	margin-bottom: 30px;
	position: relative;
}
#examinations ul li .image:before {
	content:"";
	display: block;
	padding-top: 100%;
}
#examinations ul li .image img{
	height: 100%;
	width: auto;
	position: absolute;
	top: 1px;
	left: 1px;
	bottom: 0;
	right: 0;
	margin: auto;
}
@media screen and (min-width: 980px) {
#examinations ul li{
	box-shadow:0px 0px 23px #e2e2e2;
	-moz-box-shadow:0px 0px 23px #e2e2e2;
	-webkit-box-shadow:0px 0px 23px #e2e2e2;
	-webkit-transition: .3s;
	-moz-transition: all .3s;
	-o-transition: all .3s;
	transition: all .3s;
}
#examinations ul li:hover{
	box-shadow:0px 0px 0px #c3c3c3;
	-moz-box-shadow:0px 0px 0px #c3c3c3;
	-webkit-box-shadow:0px 0px 0px #c3c3c3;
}
}

@media screen and (max-width: 979px) {
#examinations ul{
	column-gap: 15px;
	row-gap: 15px;
}
#examinations ul li{
	padding: 15px 15px 45px;
}
}
@media screen and (max-width: 768px){
#examinations{
	padding: 6% 5%;
}
#examinations ul{
	display: block;
}
#examinations ul li{
	width: 90%;
	margin: 0 auto 10px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	padding: 15px;
}
#examinations ul li label{
	width: 100%;
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: left;
	justify-content: left;
	align-items: center;
}
#examinations ul li .image{
	width: 150px;
	margin: 0;
}
#examinations ul li h2.link_ar_pink{
	width: calc(100% - 200px);
	display: block;
	margin-left: 25px;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
}
@media screen and (max-width: 620px) {
#examinations ul li{
	width: 100%;
}
}
@media screen and (max-width: 480px){
#examinations ul li .image{
	width: 90px;
	margin: 0;
}
#examinations ul li h2.link_ar_pink{
	width: calc(100% - 120px);
}
}


/*advanced
************************************************************************************/
#advanced{
	background: #edf9fc;
	padding: 3% 5%;
    margin: 60px auto;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
}
#advanced .jihi tbody th{
	background: rgb(159,192,252);
	background: -moz-linear-gradient(90deg, rgba(159,192,252,1) 0%, rgba(214,228,254,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(159,192,252,1) 0%, rgba(214,228,254,1) 100%);
	background: linear-gradient(90deg, rgba(159,192,252,1) 0%, rgba(214,228,254,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#9fc0fc",endColorstr="#d6e4fe",GradientType=1); 
}

#advanced td{
    width: 12em;
}


@media screen and (max-width: 768px){
    #advanced{
        margin: 30px auto;
        padding: 6% 5%;
    }
	#advanced table.normal{
		display: block;
		border-top: none !important;
		border-bottom: none !important;
		width: 100%;
	}
	#advanced table.normal thead{
		display: none;
	}
	#advanced table.normal tbody{
		display: block;
		width: 100%;
		border-top: none !important;
	}
	#advanced table.normal tr{
		display: block;
		margin-bottom: .1em;
		width: 100%;
	}
	#advanced table.normal th,
	#advanced table.normal td{
		display: list-item;
		width: 100%;
		padding: 5px 10px !important;
		border: none !important;
	}
	#advanced table.normal th{
		list-style-type: none;
		display: block;
	}
	#advanced table.normal td{
        width: 100% !important;
		list-style-type: none;
		display: block;
        margin: 3px 0;
	}
}



/*#btm-block
************************************************************************************/
#btm-block section{
	display: grid;
	grid-template-columns: 1fr 4fr;
	grid-template-rows: auto;
	column-gap: 50px;
	row-gap: 50px;
	align-items: stretch;
	margin: 60px auto;
}


#btm-block section .btn_staff{
	background: #eedaf3;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	padding: 10%;
	text-align: center;
}
#btm-block section .btn_staff .image{
	width: 60%;
	margin: auto;
	background: #000;
	overflow: hidden;
	border-radius: 10px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	font-size: 0;
	margin-top: 10px;
	position: relative;
}
#btm-block section .btn_staff .image:before {
	content:"";
	display: block;
	padding-top: 100%;
}
#btm-block section .btn_staff .image img{
	height: 100%;
	width: auto;
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
	margin: auto;
}


#btm-block section #contact{
	/*background: url("../../img/contact_bg.jpg") no-repeat top;
	-moz-background-size: 100% auto;
	background-size: 100% auto;*/
	background: #fff2f2;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	padding: 4%;
	
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: left;
	justify-content: left;
}
#btm-block section #contact .title{
	font-size: 24px;
	padding-right: 15px;
	width: 7em;
}
#btm-block section #contact dl{
	padding-left: 15px;
	border-left: 1px solid #999;
	
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: right;
	justify-content: right;
	width: calc(100% - 13em);
}
#btm-block section #contact dl dt{
	width: 6.5em;
	margin-right: 5px;
}
#btm-block section #contact dl dd{
	margin-left: 5px;
	padding-left: 1.5em;
	position: relative;
	width: calc(100% - 9.5em);
}
#btm-block section #contact dl dd:after{
	content: "";
	background: #999;
	height: 1px;
	width: .7em;
	position: absolute;
	top: .7em;
	left: 0;
}
#btm-block section #contact dl dd a{
	color: #999;
}

@media screen and (max-width: 979px) {
#btm-block section{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: left;
	justify-content: left;
}
#btm-block section .btn_staff{
	padding: 5%;
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
#btm-block section .btn_staff label{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: left;
	justify-content: left;
	align-items: center;
}
#btm-block section .btn_staff .image{
	display: none;
}
#btm-block section .btn_staff .link_ar_black{
	padding-left: 1.5em;
	width: 100%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

#btm-block section #contact .title{
	font-size: 21px;
	width: 100%;
}
#btm-block section #contact dl{
	margin-top: 15px;
	padding: 15px 0 0 0;
	border: 0;
	border-top: 1px solid #FFF;
	
	-webkit-justify-content: left;
	justify-content: left;
	width: auto;
}
}
@media screen and (max-width: 768px){
#btm-block section{
	margin: 30px auto;
}
#btm-block section .btn_staff .image{
	width: 150px;
	display: block;
}
#btm-block section .btn_staff .link_ar_black{
	width: calc(100% - 200px);
	margin-right: 25px;
	padding: 0;
}

#btm-block section #contact{
	padding: 6% 5%;
}
}

@media screen and (max-width: 620px) {
#btm-block section #contact{
	padding: 6% 3%;
}
	
#btm-block section #contact dl{
	display: block;
}
#btm-block section #contact dl dt{
	width: auto;
	margin-right: 0;
}
#btm-block section #contact dl dd{
	margin: 0;
	padding: 0 0 1em 0;
	position: static;
	width: 100%;
}
#btm-block section #contact dl dd:after{
	display: none;
}
}

@media screen and (max-width: 480px){
#btm-block section .btn_staff .image{
	width: 90px;
	margin: 0;
}
#btm-block section .btn_staff .link_ar_black{
	width: calc(100% - 120px);
}
}

/*#howto
************************************************************************************/
#howto{
	background: #ebf1fa;
	padding: 3% 5%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
}
#examinations a{
	color: #000;
	text-decoration: none;
	display: block;
}

@media screen and (max-width: 768px){
#howto{
	padding: 6% 5%;
}
}

/*news
************************************************************************************/
#news{
}
#news section{
	background: #fff2f2;
	border-radius: 25px;
	-webkit-border-radius: 25px;
	-moz-border-radius: 25px;
	margin: 60px auto;
	padding: 3% 5%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}

#news .news-wrap{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: left;
	justify-content: left;
}

#news .title{
	color: #f96dad;
	font-size: 30px;
	-ms-writing-mode: tb-rl;
	writing-mode: vertical-rl;
	margin: 0;
	padding: 25px 0 0;
	width: 2em;
}
#news .news-frame{
	width: calc(100% - 4em);
	padding-left: 2em;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
#news li{
	padding: 15px 3px;
	border-bottom: 1px solid #fac7c7;
	width: 100%;
	display: table;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
#news li:last-child{
	border: 0;
}

#news li p{
	display: table-cell;
}
#news li p.date{
	width: 6em;
	font-family: "century-gothic", sans-serif;
	font-size: 14px;
	color: #7f7f7f;
}
#news li p.news-ttl{
	padding-left: 1.5em;
	font-size: 18px;
}
#news li a{
	color: #2a4395;
	text-decoration: none;
}

#news .btnNormal{
	text-align: right;
}

@media screen and (max-width: 979px) {
#news .title{
	font-size: 25px;
}
}
@media screen and (max-width: 768px){
#news section{
	margin: 30px auto;
}
}
@media screen and (max-width: 620px) {
#news li{
	display: block;
}
#news li p{
	display: block;
}
#news li p.date{
	width: auto;
}
#news li p.news-ttl{
	padding: 5px 0 0;
	font-size: 15px;
}
}

/*modal
************************************************************************************/
.modalCheck {
	display: none;
}
label {
	cursor: pointer;
}

.modalWrap, .modalBg {
	position: fixed;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	width: 100%;
	height: 100%;
	margin: auto;
	z-index: 99999;
}

.modalWrap {
	opacity: 0;
	visibility: hidden;
	-webkit-transition: 0.3s cubic-bezier(1, 0, 0, 1);
	transition: 0.3s cubic-bezier(1, 0, 0, 1);
	-webkit-transition-property: opacity;
	transition-property: opacity;
	will-change: opacity;
}

.modalBg {
	cursor: pointer;
	opacity: 0.7;
	background-color: #000;
	z-index: 2;
}
.modalBg label {
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	display: block;
}

.modalCon {
	position: absolute;
	top: 5%;
	left: 0;
	right: 0;
	width: 92%;
	max-width: 920px;
	height: 86%;
	margin: auto;
	z-index: 3;
}

.modalInner {
	overflow: auto;
	-webkit-overflow-scrolling: touch;
	position: relative;
	height: 100%;
	padding: 0 1.5em 1.5em;
	cursor: default;
	background-color: #fff;
	border-radius: 5px;
	-webkit-box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.3);
					box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.3);
}

.modalCloseBtn {
	position: absolute;
	top: 0;
	right: 0;
}
.modalCloseBtn label {
	display: inline-block;
	padding: 0.5em;
	color: #333;
	text-decoration: none;
	font-size: 2em;
}

.modalCheck:not(:checked) ~ .modal-wrap > *:not(.modalWrap) {
	-webkit-filter: blur(0px);
					filter: blur(0px);
}
.modalCheck:not(:checked) ~ .modal-wrap .modalWrap {
	opacity: 0;
	visibility: hidden;
}

.modalCheck:checked ~ .modal-wrap > *:not(.modalWrap) {
	-webkit-filter: blur(3px);
					filter: blur(3px);
}

#modal-examinations01:checked ~ .modal-wrap #modal-examinations01-contents,
#modal-examinations02:checked ~ .modal-wrap #modal-examinations02-contents,
#modal-examinations03:checked ~ .modal-wrap #modal-examinations03-contents,
#modal-staff:checked ~ .modal-wrap #modal-staff-contents,
#modal-contact:checked ~ .modal-wrap #modal-contact-contents{
  opacity: 1;
  visibility: visible;
}

/*
.modalTtl {
	padding: 2em 0.5em 1.5em;
	font-size: 2em;
	line-height: 1.3;
	text-align: center;
}

.modalText .modalCover {
	margin: 2em 0 1em;
	text-align: center;
}
.modalText .modalCover img{
	max-width: 100%;
	height: auto;
}*/
.modalText{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: left;
	justify-content: left;
	padding-top: 60px;
}
.modalText > section{
	padding-top: 25px;
	margin-top: 25px;
	position: relative;
}
.modal_prof > article > section{
	padding-bottom: 25px;
	margin-bottom: 25px;
	position: relative;
}
.modalText > section:after,
.modal_prof > article > section:after{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 5px;
	content: "";
	background: rgb(242,165,200);
	background: -moz-linear-gradient(90deg, rgba(242,165,200,1) 0%, rgba(182,123,181,1) 100%);
	background: -webkit-linear-gradient(90deg, rgba(242,165,200,1) 0%, rgba(182,123,181,1) 100%);
	background: linear-gradient(90deg, rgba(242,165,200,1) 0%, rgba(182,123,181,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#f2a5c8",endColorstr="#b67bb5",GradientType=1); 
}
.modal_prof > article > section:after{
	bottom: 0;
	top: inherit;
}
.modalText > section:first-child:after,
.modal_prof > article > section:last-child:after{
	background: none;
}

.modalText > section dt{
	font-size: 18px;
	padding: 15px 0 5px;
}
.modalText > section ul.layout_box{
	width: 80%;
	margin: auto;
}

.modal_prof{
	padding-top: 60px;
}

.modal_prof > article > section{
	display: -webkit-flex;
	display: flex;
	-webkit-flex-flow: row wrap;
	flex-flow: row wrap;
	-webkit-justify-content: left;
	justify-content: left;
}
.modal_prof .photo{
	width: 200px;
}
.modal_prof .photo img{
	max-width: 100%;
	height: auto;
}

.modal_prof .prof-text{
	padding: 0 0 0 30px;
	width: calc(100% - 220px);
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	box-sizing: border-box;
}
.modal_prof .prof-text p{
	padding-bottom: 1em;
}
.modal_prof .prof-text p:last-child{
	padding-bottom: 0;
}
.modal_prof .prof-text .type{
	text-align: center;
	font-size: 15px;
	padding-bottom: 20px !important;
}
.modal_prof .btn-pageop{
	text-align: right;
}
.modal_prof .btn-pageop a{
	background: url("../../img/ar_pink_up.svg") no-repeat 15px .6em;
	display: inline-block;
	padding: 7px 15px 7px 37px;
	-moz-background-size: 17px auto;
	background-size: 17px auto;
	color: #828282;
	text-decoration: none;
	border: 1px solid #eee;
	border-radius: 4px;
	-webkit-border-radius: 4px;
	-moz-border-radius: 4px;
	font-size: 14px;
}
.modal_prof .btns-box li a{
	font-size: 13.5px;
}

@media (max-width: 640px) {
	.modalInner {
		padding-left: 1em;
		padding-right: 1em;
	}

	.modalTtl {
		font-size: 1.5em;
		padding-bottom: 1em;
	}

	.modalText .modalCover {
		margin: 0 -1em 1em;
	}
	.modalText{
		display: block;
	}

	.modal_prof .photo{
		width: auto;
		text-align: center;
	}
	.modal_prof .photo img{
		max-width: 70%;
		height: auto;
	}

	.modal_prof .prof-text{
		padding: 30px 0 0 0;
		width: auto;
	}
	
.modalText > section ul.layout_box{
	width: 100%;
	margin-top: 20px;
}
}
