@charset "UTF-8";


body{font-family: "Shin Maru Go Regular";}

.wrap{margin: 0 auto;
	width: 90%;
	max-width: 1000px;}

#front_cs{}

.bg_wrap{
	padding: 3em 0;
}

section:before{
	content:'';
	width: 100%;
	max-width: 700px;
	display: block;
	padding-bottom: 3em;
}


@media screen and (max-width: 667px) {
	section:before{
		background: url(../img/landing/dot_line_sp.png) no-repeat center center;
		-moz-background-size:96% auto;
		background-size:96% auto;
	}
	section:before{margin: 3em auto}
}	

@media print, screen and (min-width: 668px) {
	section:before{
		background: url(../img/landing/dot_line.png) no-repeat center center;
		-moz-background-size:100% auto;
		background-size:100% auto;
	}
	
	section:before{margin: 5em auto}
}	


@media print, screen and (min-width: 1024px) {
	section:before{max-width: 1000px}
}


h2.ci{
	border-radius: 50px;
	position: relative;
	letter-spacing: .2em;
	text-align: center;
	color: #fff;
	padding: .8em 1.5em;
	margin: 0 auto 2em;
	font-family: 'Jun 501';
	line-height: 1em;
	display: flex;
	justify-content: center;
	align-items: center;
}

h2.ci span{
	display: block
}

h2.ci:before{
	content: "";
	display:block;
	width:70px;
	height:70px;
	background:url(../img/h2_icon.png) no-repeat;
	background-size:contain;
	position: absolute;
	left: -2em
}



@media screen and (max-width: 667px) {
	h2.ci{margin: 0 1em 2em 3em;}
	ul.link_ban li{margin-bottom: 1em}
}	

@media print, screen and (min-width: 668px) {
	h2.ci{max-width: 280px;}
	ul.link_ban{
		display: flex;
		justify-content: center;
		flex-wrap:wrap;
		max-width: 1000px;
		margin: 0 auto
	}
	ul.link_ban li{
		width: 48%;
		margin: 0 1% 2%;
		text-align: center
	}
	.wrap_pc{margin: 0 auto;
	width: 90%;
	max-width: 1000px;}
}	




/* ------------------------------
  header 
------------------------------ */
#header_logo{}	

#gnav ul.nav{
	width: 100%;
	max-width: 1000px
}
#gnav nav a{
	color: #73B8EB;
	font-size: 1.2rem;
	font-family: "Shin Maru Go Regular";
	padding: 1em 0
}
#gnav a:before{display: none}


@media screen and (max-width: 667px) {
	#header_logo img{height: 40px}
	.nav-button span{background-color: #6289d5}
	#gnav{background: rgba(255,255,255,.9)}
}	

@media print, screen and (min-width: 668px) {
	header{margin-bottom: 2em;text-align: center;}
	#header_logo{
	text-align: center;
	margin: 0 auto 1.5em}
	
	#header_logo:before{
		content:'';
		width: 100%;
		max-width: 700px;
		display: block;
		padding-bottom: 3em;
		background: url(../img/landing/dot_line.png) no-repeat center center;
		-moz-background-size:100% auto;
		background-size:100% auto;
		margin: 1em auto 2em
	}

	#header_logo img{max-width: 300px;}

	#gnav ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-between
	}
	#header_logo img{max-width: 300px;}
		
}

@media print, screen and (min-width: 769px) {	
	#header_logo:before{max-width: 1000px;}
}


header .link_ban{margin-top: 5em}



#intoro_mv{
	position: relative;
	margin-bottom: 1em
}

#intoro_mv video{
	width: 100%
}
#sound_button{
	position: absolute;
	left: 1.5em;
	bottom: 1.5em;
}
.sound_on{color: #222}

.sound_on:before{
	content: '';
	display: inline-block;
	width: 24px;
	height: 24px;
	background-image: url(../img/sound-on.png);
	background-repeat: no-repeat;
	background-size: contain;
	vertical-align: middle;
	padding-right: 5px
}

.sound_off{color: #666}

.sound_off:before{
	content: '';
	display: inline-block;
	width: 24px;
	height: 24px;
	background-image: url(../img/sound-off.png);
	background-repeat: no-repeat;
	background-size: contain;
	vertical-align: middle;
	padding-right: 5px
}


#video-btn{
	position: absolute;
	right: 1.5em;
	bottom: 1.5em;}

#video-btn.stop:before{
	content: '';
	display: inline-block;
	width: 24px;
	height: 24px;
	background-image: url(../img/play.png);
	background-repeat: no-repeat;
	background-size: contain;
	vertical-align: middle;
	padding-right: 5px
}


#video-btn.play:before{
	content: '';
	display: inline-block;
	width: 24px;
	height: 24px;
	background-image: url(../img/stop.png);
	background-repeat: no-repeat;
	background-size: contain;
	vertical-align: middle;
	padding-right: 5px
}

#video-btn.play2:before{
	content: '';
	display: inline-block;
	width: 24px;
	height: 24px;
	background-image: url(../img/sound-off.png);
	background-repeat: no-repeat;
	background-size: contain;
	vertical-align: middle;
	padding-right: 5px
}


@media print, screen and (min-width: 769px) {
/*
	#intoro_mv video{
	width: 100%;
	height: 60vh;
	object-fit: cover;}
*/
}

.remodal video{
	width: 100%;
	height: auto
}

#mv_full{margin: 0 auto 3em;
	text-align: center;
	padding: 0 2em
}

#mv_full a.marker{
	display: inline-block
}

#mv_full a:before{
	font-family: icomoon;
	content: "\ea7f";
	padding-right: 5px
}

.marker{
  position: relative;
  z-index: 1;
  cursor: pointer;
}
.marker::after{
  content:"";
  width: 0%;
  height: 2px;
  background: #ffb580;
  position: absolute;
  bottom: -5px;
  left: 0;
  z-index: -1;
  transition: all .3s;  /*アニメーションの長さ*/
}	
.marker:hover::after{
  width: 100%;    /*hover時に100%で広がる*/
}



/* ------------------------------
 #concept
------------------------------ */


#concept h2{background: #6289D5}


#concept h1{
	margin-bottom: 1em;
	font-size: 1.2rem;
	font-family: "Shin Maru Go Regular";
	letter-spacing: .2em;
	color: #648cd2;
	text-align: center
}

#concept #comment p{
	margin-top: 1.6em;
	font-size: 1.1em
}

@media print, screen and (min-width: 668px) {
	#concept h1{font-size: 1.8rem;}
}

@media screen and (max-width: 767px) {
	#comment{padding: 1em 1.5em}
	#imgs{
		display: flex;
		justify-content: space-between;
		flex-wrap:wrap;
	}
	#imgs figure{
width: 50%
	}
}	


@media print, screen and (min-width: 768px) {
	#concept_wrap{
		display: flex;
		flex-wrap:wrap;
		justify-content: space-between
	}
	
	#concept_wrap #imgs{width: 25%}
	#concept_wrap #imgs figure:nth-child(1){margin-bottom: 2em}
	#concept_wrap #comment{width: 70%}
}	

@media print, screen and (min-width: 1024px) {
	#concept{padding: 3em 0;}
	
}



/* ------------------------------
 #news
------------------------------ */

#news .bg_wrap{background: #f5f5ff;}
#news h2{background: #b98cbe;margin-bottom: 3em}


#news ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-start;
	align-items: stretch;
}

#news li{
	border: solid 2px #b98cbe;
	border-radius: 1em;
	background: #fff;
	box-shadow: 0 3px 3px #c3bec3;
	margin: 1em 2%;
	padding: 1em
}

#news span,
#news h3{
	color: #b98cbe;
	font-size: 1.2rem
}

#news span{font-size: .8rem}
#news h3{
	margin-bottom: .5em;
	font-family: "Shin Maru Go Regular";
}

.more-btn{
	display: block;
	border-radius: 50px;
	position: relative;
	max-width: 300px;
	margin: 2em auto;
	background: #959595;
	color: #fff;
	text-align: center;
	padding: 1em;
	-webkit-transition: all .3s;
	transition: all .3s;
}

.more-btn:hover{
	background: #4c4c4c;
}

@media screen and (max-width: 667px) {
	#news li{width: 100%}
}	


@media print, screen and (min-width: 668px) {
	#news ul{
		display: flex;
		flex-wrap: wrap;
		justify-content: flex-start;
		align-items: stretch;
	}
	
	#news li{width: 46%;}
}		




/* ------------------------------
 #subject
------------------------------ */

#subject .bg_wrap{background: #eef6fc;text-align: center}
#subject h2{background: #73b9eb}

#subject p {
	font-size: 1.3rem;
	color: #73b9eb;
	text-align: center;
	padding: 1em 0
}

#subject dl{text-align: left;display: inline-block}

#subject dd{font-size: .9rem;}


@media screen and (max-width: 667px) {
	#subject p{font-size: 1.1rem}
	#subject p br{display: none}
	
}	

@media print, screen and (min-width: 1024px) {
	#subject{padding: 4em 0 2em}
}	


/* ------------------------------
 #doctor
------------------------------ */

#doctor .bg_wrap{background: #fcf2f2}
#doctor h2{background: #e3808b}


#doctor .wrap{margin: 2em auto;}

#doctor figure{}
.prof_info{}


.prof_info dl{margin: 1em 0;}
.prof_info dt{
	font-weight: bold;
	font-size: .9rem;
	margin-right: 1em;
	letter-spacing: 1px;
}
	
.prof_info dd{font-weight: bold;}


.prof_info h3{
	font-size: 1.5rem;
	line-height: 1em
}

.prof_info h3 span{font-size: .9rem;padding-left: 1em}

.prof_info p{font-family: "Shin Maru Go Regular";}

@media screen and (max-width: 667px) {
	.prof_info{padding: 1em}
	.prof_info dl dt{margin-bottom: .5em}
}	

@media print, screen and (min-width: 668px){
	#doctor .wrap,
	.prof_info dl{
		display: flex;
		flex-wrap: wrap;
	}
	#doctor .wrap{justify-content: space-between}
	.prof_info dl{justify-content: flex-start}
	
	#doctor .wrap > *{width: 46%;}
}	


@media print, screen and (min-width: 1000px) {}	
	



/* ------------------------------
 #gallery
------------------------------ */

#gallery .bg_wrap{background: #fef7ee}
#gallery h2{background: #edb659}

.gallery{margin: 5em auto}

.gallery .slick-slide{
	padding: 0 .5em;
	width: 100%;
	max-width: 460px;
	height: 69.56%;
	overflow: hidden;
}


.gallery img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	margin: 0 auto
}

.slick-prev:before, .slick-next:before{
	color: #333
}




/* ------------------------------
 #facility
------------------------------ */
#facility{margin-bottom: 3em}

#facility .bg_wrap{background: #edf6f3}
#facility h2{background: #60a48f}

#facility ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between
}

#facility li{
	margin: 0 1% 1em
}

#facility figure{
	margin-bottom: .5em
}


#facility figcaption span{
	color: #60a48f;
	margin:0 0 .2em;
	font-family: "Shin Maru Go Regular";
	font-size: 1.1rem;
	display: block
}


@media screen and (max-width: 667px) {
	#facility figure{display: flex;}
	#facility figcaption{line-height: 1.4em;font-size: .9em}

	#facility figure img{
		width: 120px;
		height: 100px;
		object-fit: cover;
		margin-right: 1.5em
	}
}	

@media print, screen and (min-width: 668px) {
	#facility li{width: 45%}
	#facility figcaption span{font-size: 1.2rem;margin:.5em 0 .3em;}
}	
	
	


/* ------------------------------
 #footer
------------------------------ */

#access_info{width: 100%;margin: 1em auto}

#access_info dl{margin-bottom: 1em}

#access_info dt{
	color: #fff;
	padding: .5em 1em;
	border-radius: 2em;
	display: inline-block;
	line-height: 1em;
	margin-bottom: .5em
}
#access_info dl:first-child dt{background: #6289D5;}
#access_info dl:last-child dt{background: #b98cbe;}


#btn_top{
	max-width: 100px;
	text-align: center;
	margin: 3em auto 0;
	position: relative;
	bottom: 0;
	right: 0
}
	
#btn_top a{color: #6289D5!important;}

#btn_top a:before{
	font-family: icomoon;
	content: "\e97c";
	display: block;
	font-size: 25px;
	width: 50px;
	height: 50px;
	border-radius: 50%;
	line-height: 50px;
	color: #6289D5;
	border: solid 2px #6289D5;
	margin: 0 auto
}


@media screen and (max-width: 667px) {}	

@media print, screen and (min-width: 769px) {
	#access_info dl{
		display: flex;
		align-items: center
	}
	#access_info dl dt{margin-right: 1em;margin-bottom: 0}
}	


