@charset "utf-8";



/*
#digest_bg .youtube {
  width: 900px;
  margin:0 auto;
  aspect-ratio: 16 / 9;
}
#digest_bg .youtube iframe {
  width: 100%;
  height: 100%;
}

@media screen and (max-width: 812px) {
#digest_bg .youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
#digest_bg .youtube iframe {
  width: 100%;
  height: 100%;
}
}
*/


#digest_yt{
	width:900px;
	margin:0 auto;
}
@media screen and (max-width: 812px) {
#digest_yt{
	width:100%;
}	
}


.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
  margin:15px auto 0 auto;
  text-align:center
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
}





.digest_tyu{
	font-size:12px;
	line-height:1.4em;
}
@media screen and (max-width: 812px) {
.digest_tyu{
	width:90%;
	margin:0 auto;
	text-align:left;
	font-size:11px;
	line-height:1.4em;
}	
	
}



.text a{
	border-bottom:1px dashed #08C3D9;
	transition:ease-in-out 0.3s;
}
.text a:hover{
	color:#08C3D9;
	border-bottom:1px dashed #fff;
}

.ba_img{
	margin:50px auto 15px auto;
}
@media screen and (max-width: 812px) {
.ba_img{
	margin:30px auto 15px auto;
}		
}

.sub_photo{
	display:flex;
	margin:50px 0 0 0
}
@media screen and (max-width: 812px) {
.sub_photo{
	margin:20px 0 0 0
}	
}

.sub_photo li img{
	width:100%;
}

.title{
	font-family: 'Montserrat', sans-serif;
	font-weight:600;
	font-size:3.4em;
	letter-spacing:0.05em;
	margin:0 0 60px 0;
	line-height: 1.2em;
}
@media screen and (max-width: 812px) {
.title{	
	line-height: 1em;
}
}

.about_tyu{
	font-size:14px;
	letter-spacing:0.1em
}
@media screen and (max-width: 812px) {
.about_tyu{
	font-size:1em;
	width:94%;
	margin:0 auto;
	text-align:justify
}	
}
	

.about_lead{
	font-size:1.8em;
	font-weight:500;
	line-height:2em;
	letter-spacing:0.1em;
	margin:0 0 10px 0
}
@media screen and (max-width: 812px) {
.about_lead{
	font-size:1.5em;
	line-height:1.7em;
	letter-spacing:0.1em;
	margin:0 auto 10px auto;
	width:94%;
}

#gra_sp{
	margin-top:27px;
}

#gra_sp img{
	width:90%;
	margin:0 auto;
}

.sp_img{
	margin-top:-15px !important;
}
}




.about_mini{
	font-size:70%;
}
@media screen and (max-width: 812px) {
.about_mini{
	font-size: 70%;
    line-height: 1.6em;
	margin-top:10px
}
}

.about_mini2{
	font-size:70%;
}
@media screen and (max-width: 812px) {
.about_mini2{
	font-size: 70%;
    display: block;
    line-height: 1.6em;
	margin-top:10px
}
}

	
.about_big{
	font-size:140%;
}



#about_bg{
	 background:url(../images/about_bg_pc.jpg) no-repeat;
	 height:auto;
	 width:100%;
	 background-size:cover;
	 padding: 110px 0 260px 0;
	 background-position: bottom center;
	 text-align:center;
	 color:#fff
}

@media screen and (max-width: 812px) {
#about_bg{	
background:url(../images/about_bg_sp.jpg) no-repeat;
height: auto;
width: 100%;
background-size: cover;
padding: 80px 0 50px 0;
background-position: top center;
}


.about_text{
	width:94%;
	margin:0 auto;
}
}



#kingaku{
	margin:30px 0 10px 0;
}







#digest_bg{
	background:#faeedd;
	 height:auto;
	 width:100%;
	 padding: 110px 0 160px 0;
	 background-position: bottom center;
	 text-align:center;
}

@media screen and (max-width: 812px) {
#digest_bg {
    padding: 75px 0 75px 0;
}	
}




/*--------------------------------------------------------------
message
--------------------------------------------------------------*/
#message_bg{
	 background: url(../images/message_bg.jpg);
	 height:auto;
	 width:100%;
	 padding: 110px 0 160px 0;
	 background-position: bottom center;
	 text-align:center;
}
@media screen and (max-width: 812px) {
#message_bg {
    padding: 75px 0 75px 0;
}	
}

.message_lead{
	font-size:1.8em;
	font-weight:500;
	line-height:1.6em;
	margin:0 0 10px 0
}
@media screen and (max-width: 812px) {
.message_lead{
	font-size:1.4em;
	width:94%;
	margin:0 auto;
	text-align:justify
}
}

.gray{
	color:#c1c1c1;
}

#video {
  display: none;
}

#video2 {
  display: none;
}

#player{
	width:842px;
}



.mikawa_movie{
	width:960px;
	height:540px;
	display: inline-block;
	margin:30px auto 0 auto;
}

@media screen and (max-width: 812px) {
.mikawa_movie{
	width:92%;
	height:auto;
}
.mikawa_movie video{
	width:100%;
	height:100%;
}
}


@media screen and (max-width: 812px) {
#player{
	width:100%;
}	

}

.mikawa_text{
	margin:5px 0 0 0;
	font-size-adjust:14px;
	font-weight:400
}
@media screen and (max-width: 812px) {
.mikawa_text{
	font-size:1em;
	width:90%;
	margin:5px auto 0 auto;
	padding-left: 1em;
	text-indent: -1em;
	line-height: 1.5em;
	text-align:left;

}	
	
}


/*--------------------------------------------------------------
INFECTION CONTROL
--------------------------------------------------------------*/

#control_bg{
	background:#3389bc;
	padding:90px 0;
	text-align:center;
	color:#fff
}

.control_jp{
	font-size:60%;
	font-family: 'Noto Sans JP', sans-serif;
	font-weight:600;
}
@media screen and (max-width: 812px) {
.control_jp{
	font-size:40%;	
}
}


.control_lead{
	font-size:1.4em;
	font-weight:500;
	letter-spacing:0.05em
}
@media screen and (max-width: 812px) {
.control_lead{
	font-size:1.3em;
	width:90%;
	margin:0 auto;
	text-align:justify
}	
}

.control_attention{
	font-size: 1.6em;
    font-weight: 600;
    border: 2px #fff solid;
    display: inline-block;
    padding: 0px 12px 2px 12px;
    line-height: 1.6em;
    letter-spacing: 0.05em;
    margin: 30px 0 0 0;
}
@media screen and (max-width: 812px) {
.control_attention{	
	width: 82%;
    margin: 0 auto;
    padding: 11px 12px 12px 12px;
    text-align: justify;
    line-height: 1.4em;
    margin: 20px auto 0 auto;
}
}

.yellow{
	color:#ffff00;
}







@media screen and (max-width: 812px) {
#control_bg{
	padding:70px 0 50px 0;
}	
	
}

.blue{
	color:#00BEFF !important;
}

.lead{
	font-size:20px;
}

@media screen and (max-width: 812px) {
.lead{
	font-size:18px;
	text-align:left;
	width:90%;
	margin:0 auto
}	
	
}


#control_list{
	width:1100px;
	margin:40px auto 0 auto;
	display:flex;
	flex-wrap: wrap;
	justify-content: space-around;
}


#control_list::before{
  content:"";
  display: block;
  width:23%;
  order:1;
}
#control_list::after{
  content:"";
  display: block;
  width:23%;
}


#control_list li{
	width:248px;
	margin: 0 0 30px 0;
	
}

#control_list li img{
	border-radius:6px;
}

#control_list li p{
	font-size:14px;
	text-align: justify;
	line-height:1.5em;
	margin:5px 0 0 0
}



@media screen and (max-width: 812px) {
#control_list{
	width:90%;
	margin:40px auto 0 auto;
	display:flex;
	flex-wrap: wrap;
	justify-content: space-around;
}

#control_list li{
	width:100%;
	margin: 0 0 30px 0
	
}	
#control_list li p{
	font-size:14px;	
}	
}






/*

.youtube {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtube iframe {
  width: 100%;
  height: 100%;
}

*/

@media screen and (max-width: 812px) {
.img_change{
	margin-top:100vh !important;
}
}


:root{
 /* --gracolor:#e8a02a;*/
 --gracolor:#cea842;
  --sp1color:#dd274f;
  --sp2color:#00b6da;
}


.whitebox{
	background:rgba(255,255,255,1);
	padding:60px 30px;
	color:#737373;
	margin:0 0 40px 0;
	position:relative;
	border-radius:16px
}

.wb_last{
	margin-bottom:150px;
}

/*
.whitebox::before {
    content: "";
    top: 0;
    left: 0;
    border-bottom: 3em solid transparent;
    border-left: 3em solid #c12748; 
    position: absolute;
    z-index: 100;
}
*/


@media screen and (max-width: 812px) {
.whitebox{
	background:rgba(255,255,255,0.9);
	padding:30px 15px;
	border-radius:12px
}	
}

.prize_box{
	display:flex;
	align-items: center;
}
@media screen and (max-width: 812px) {
.prize_box{
	display:block;	
}	
}

.prize_title{
	font-family: 'Montserrat', sans-serif;
	font-weight:700;
	    font-size: 3em;
}
@media screen and (max-width: 812px) {
.prize_title{
	font-size: 3em;
    line-height: 0.9em;
    margin-bottom: 5px;
    letter-spacing: 0em;
}	
}

.prize_ja{
	font-size:18px;
	font-weight:600
	 
}

.gra_c{
	color:var(--gracolor);
}
.sp1_c{
	color:var(--sp1color);
}
.sp1_bg{
	background:var(--sp1color) !important;
}
.sp2_c{
	color:var(--sp2color);
}
.sp2_bg{
	background:var(--sp2color) !important;
}


.text{
	text-align:justify;
	margin:30px 0 0 0
}


.name_salon{
	display:flex;
	align-items: center;
	margin:20px 0 0 0
}
@media screen and (max-width: 812px) {
.name_salon{
	display: block;	
}
}
.name{
	font-size:1.7em;
	font-weight:600;
	margin:0 20px 0 0 
}
@media screen and (max-width: 812px) {
.name{
	font-size:1.6em;	
}	
}

.age{
	font-weight:600;
	font-size:70%;
}
.salon{
	background:var(--gracolor);
	color:#fff;
	border-radius: 14px;
    padding: 0 10px;
	font-weight:500
}
@media screen and (max-width: 812px) {
.salon{
	display: inline-block;
	margin-top: 8px;
}
}

.course li{
	line-height:1.6em
}

.course{
	margin:10px 0;
}
@media screen and (max-width: 812px) {
.course{
	margin:15px 0;
}	
}

.naiyou{
	font-weight:600;
}

.braek{
	margin:10px 0 0 0;
	font-weight:600
}
.midashi{
	font-size:130%;
	font-weight:600;
	margin: 14px 0 5px 0;
}


.sub_title{
	font-family: 'Montserrat', sans-serif;
	font-weight:700;
	font-size:2.6em;
	color:#c5c5c5;
	text-align:center;
	margin:0 0 20px 0
}
@media screen and (max-width: 812px) {
.sub_title{	
	font-size:2.2em;
}
}

.tyu{
	font-size:12px;
	line-height:1.4em;
}

.mt_text{
	margin-top:10px;
}

.data_img{
	margin:25px auto;
}
@media screen and (max-width: 812px) {
.data_img{
	margin:10px auto 15px auto;
}	
}


@media screen and (max-width: 812px) {
.tyu{
	font-size:11px;
	line-height:1.4em;
}	
	
}









/*--------------------------------------------------------------
GALLERY
--------------------------------------------------------------*/
.txt-hide{
display: none;
}


.more_box{
	display:table;
	margin:30px auto 0 auto;
}

button.more {
ursor: pointer;
width: 390px;
margin: 40px auto 40px auto;
display: block;
background-color: #000;
color: #fff;
padding: 12px 15px;
font-size: 16px;
font-weight: 600;
border: none;
outline: 0;
transition: .5s;
-erbkit-transition: .5s;
font-family: 'Noto Sans JP', sans-serif;
display:block;
border-radius: 6px;
}

@media screen and (max-width: 812px) {
button.more {
ursor: pointer;
width: 100%;	
	
}	
}


button.more:hover{
	opacity:0.7;
}
 
button.more::after {
content: "+　ギャラリーをもっと見る";
transition: .2s;
-erbkit-transition: .2s;
}

button.more.on-click::after{
content: "－　閉じる";
}

#wrap{
	margin:50px 0 0 0;
	padding: 0 0 50px 0;
}
@media screen and (max-width: 812px) {
#wrap{
	margin:50px 0 0 0;
	padding: 0 0 0px 0;
}
}


.gallery_lead{
	font-size: 1.6em;
	font-weight: 500;
	line-height: 2em;
	letter-spacing: 0.1em;
	margin: -30px 0 0px 0;
}


@media screen and (max-width: 812px) {
.gallery_lead{
	font-size:18px;
	text-align:center;
	width:90%;
	margin:-50px auto 0 auto
}	
	
}


.gallery_mini{
	font-size:70%;
}
.gallery_big{
	font-size:140%;
}



#gallery_bg{
	 background:url(../images/gallery_bg.jpg) no-repeat;
	 height:auto;
	 width:100%;
	 background-size:cover;
	 padding: 80px 0 0px 0;
	 background-position: bottom center;
	 text-align:center;
	 color:#fff
}

@media screen and (max-width: 812px) {
#gallery_bg{	
background:url(../images/gallery_bg_sp.jpg) no-repeat;
height: auto;
width: 100%;
background-size: cover;
padding: 55px 0 0px 0;
background-position: top center;
}
}







ul.gallary_photo {
	margin:0px 0 0 0;
	padding:0;
	clear:both;
	width:100%

}

.gallary_photo li img{
   max-height: auto;
	float:left;
	display:inline-block;
	width:16.66%;
	height:auto
}


@media screen and (max-width: 812px) {
.gallary_text{
	font-size:150%;
	margin:0
}

.gallary_photo li img{
		float:left;
		width:33.3%;
	}
}







#footer_bg{
	 background:url(../images/footer_bg_pc.jpg) no-repeat;
	 height:auto;
	 width:100%;
	 background-size:cover;
	 padding: 230px 0 30px 0;
	 background-position: bottom center;
}

@media screen and (max-width: 812px) {
#footer_bg{	
background:url(../images/footer_bg_pc.jpg) no-repeat;
height: auto;
width: 100%;
background-size: cover;
padding: 125px 0 20px 0;
background-position: top center;
}	
}


.footer_lead{
	color: #fff;
    font-size: 47px;
    line-height: 1.3em;
	margin: -95px 0 110px 0;
	font-style: italic;
	font-weight: 500;
	text-align: center;
	letter-spacing: 0.01em;
	text-shadow: black 0 0 8px;
}
@media screen and (max-width:  812px) {
.footer_lead{
    font-size: 31px;
	padding: 80px 0 0 0;
	margin: -95px 0 60px 0;	
}
}
@media screen and (max-width: 320px) {
.footer_lead{
    font-size: 28px;
	padding: 80px 0 0 0;		
}
}


.footer_logo{
	margin:50px auto 0 auto;
	width:300px;
}
@media screen and (max-width:  812px) {
.footer_logo{
	margin:50px auto 0 auto;
	width:80%
}	
}


.btn{
	margin:20px auto;
	text-align:center;
	transition:ease-in-out 0.3s
}
.btn:hover{
	opacity:0.85;
}


.tel{
	display:none;
}

.telnumber{
	text-align:center;
}

@media screen and (max-width: 812px) {
.btn{
	margin:20px auto;
	width:90%
}	

.tel{
	display:block;
	margin:0px auto;
	width:90%;
}
.telnumber{
	width:90%;
	margin:12px auto;
}
}






body.white {
}
body.black {
}
#container {
  width: 100%;
	margin: 0 auto;
	position: relative;
}
header.global {
    position: absolute;
		top: 0;
		left: 0;
	  width: calc(100% - 20px);
    height: 50px;
    padding: 5px 15px 5px 5px;
    display: flex;
    align-items: center;
    justify-content: space-between;
	
}
@media screen and (max-width: 812px) {
header.global{
	padding: 5px 5px 5px 5px;
	text-align: center;
}
	
}


header.global h1 {
    width:170px;
    margin: 0;
}
@media screen and (max-width: 812px) {
header.global h1 {
    width:auto;
    margin: 0;
	display:block
}	
	
}


header.global h1 {
    display: flex;
    height: 50px;
    align-items: center;
    width: calc(100% - 16px);
    padding: 8px 8px 8px 0px;
}
@media screen and (max-width: 812px) {
	header.global h1 {
	width: auto;
}
}


header.global h1 img {
/*    width: 110px;
		height:34px; */
		zoom: 1;
        height: 70px;
		margin:10px 0 0 0
}
@media screen and (max-width: 812px) {
header.global h1 img {	
	height: 46px;
	margin:0 0 0 5px
}	
}

.promotion-label {
    font-size: 10px;
		text-transform: uppercase;
		letter-spacing: 0.06em;
}

/* for white version */

header.global.white .promotion-label {
  color: #fff;
}

/* footer */
footer.global {
    padding: 30px 0;
    background-color: #000;
    color: #fff;
    text-align: center;
    font-size: 10px;
		line-height: 1;
    letter-spacing: 0.06em;
}
footer.global span.label-promotion {
    border: 1px solid #fff;
    padding: 6px 13px 5px;
    display: inline-block;
    margin-bottom: 15px;
}
footer.global .copyright {
    background-color: transparent;
    line-height: 1.5;
}

/* --- for access from PC and larger screen --- */
@media screen and (min-width:480px) {
  header.global {
    width: calc(100% - 48px);
    height: 48px;
    padding: 20px 24px;
  }
  /* if width is fixed */
  header.w1100 {
    width: 1100px;
    right: 0;
    margin: 0 auto;
    position: relative;
  } 
  header.w980 {
    width: 980px;
    position: relative;
    right: 0;
    margin: 0 auto;
  } 
  header.global h1 a {
  /*  height: 100px;
    height: 66px; */
    padding: 0;
  }
  header.global h1 a img {
  /*  width: 220px; */
		height:48px;
  }
  .promotion-label {
    font-size: 14px;
  }
  footer.global {
    padding: 40px 0;
    font-size: 16px;
  }
  footer.global span.label-promotion {
    margin-bottom: 20px;
    font-size: 14px;
  }
  footer.global .copyright {
    font-size: 12px;
    line-height: 1;
  }
}


@media (min-width: 812px) {
a[href*="tel:"] {
pointer-events: none;
cursor: default;
text-decoration: none;
}
}




/* ページトップへ戻る */
.pageTop {
  display:none;
  position:relative;
  width:100%;
  height:0;
  margin:0 auto;
}
.pageTop a {
  position: fixed;
  bottom: 0px;
  left:auto;
  display: block;
  width: 50px;
  height:50px;
  right: 3%;
  padding:1em 0 1em 2px;
  background:#0082dd;
  text-align:center;
  outline:none;
  text-decoration: none;
  z-index:19999;
  border: 1px solid #ffffff;
  opacity: 0.7;
}
.pageTop a:before,
.pageTop a:after {
  position:absolute;
  left:50%;
  content:"";
  width:0px;
  height:0px;
  margin-left:-10px;
  border:10px solid transparent;

}
.pageTop a:before {
  top:50%;
  margin-top:-13px;
  border-bottom:10px solid #0082dd;
}
.pageTop a:after {
  top:50%;
  margin-top:-15px;
  z-index:-1;
  border-bottom:10px solid #fff; /* 矢印の色 */
}


@media screen and (max-width:812px) {
.pageTop {
  display:none;
  position:relative;
  width:100%;
  height:0;
  margin:0 auto;
}
.pageTop a {
  position: fixed;
  bottom: 10% !important;
  left:auto;
  display: block;
  width: 30px;
  height:30px;
  right: 2%;
  padding:1em 0 1em 2px;
  background:#0082dd;
  text-align:center;
  outline:none;
  text-decoration: none;
  z-index:100;
  border: 1px solid #ffffff;
  opacity: 0.7;
}

.pageTop a:before,
.pageTop a:after {
  position:absolute;
  left:50%;
  content:"";
  width:0px;
  height:0px;
  margin-left:-10px;
  border:10px solid transparent;

}
.pageTop a:before {
  top:50%;
  margin-top:-13px;
  border-bottom:10px solid #0082dd;
}
.pageTop a:after {
  top:50%;
  margin-top:-15px;
  z-index:-1;
  border-bottom:10px solid #fff; /* 矢印の色 */
}

	
	
}