@charset "utf-8";
@import "reset.css";
@import "cmn-options.css";



#wrapper {
  width: 100%;
  max-width: 750px;
  height: auto;
  background: #fff;
  margin: 0 auto;
}

.midashi {
  color:#f399a9;
  letter-spacing: 3px;
	text-indent: 6px;
  font-size: 2em;
}

#wrapper img{max-width:100%;}


#contents{
    clear:both;font-size: 0;
}
 

.box2{
visibility : hidden;
}

.box3{
visibility : hidden;
}

.box4{
visibility : hidden;
}

.box5{
visibility : hidden;
}


#icon_box_bk{
	display: none;
	width:350px;
	position: fixed;
	top:1px;
	right: 1%;
	padding:0;
	margin:0;
	z-index: 999;
}


.txt {
  font-size: 1.2em;
  line-height: 1.2;
}

.txt2 {
  font-size: 1.0em;
  line-height: 1.2;
}


/* ヘッダー */

#header{
  position:relative;
  background: url(../img/220606_main.jpg) 0 0 no-repeat;
  background-size: 100% auto;
  background-color:#fff;
	padding-top: 143%;
  }
#header.ver2{
  position:relative;
  background: url(../img/220606_main2.jpg) 0 0 no-repeat;
  background-size: 100% auto;
  background-color:#fff;
	padding-top: 160%;
  }
#header h1{
	display: none;
  }
#header .btnBox{
 position: absolute;
	bottom: 0;
	padding:0 5%;
	
  }


#header h3 {
  width: 92%;
}




h2{
  position: absolute;
padding:2% 0.5% 0 0.5%;
  z-index:997;
  }



.mark1 {
  position: absolute;
  top:40.5%;
	width:100%;
  left:0%;
  z-index:1;
}



/* セクション02 */

#section_senior {
  background: url(../img/senior_back.png) 0 0 no-repeat;
  background-size: 100% auto;
}

#section_baby {
  background: url(../img/baby_back.png) 0 0 no-repeat;
  background-size: 100% auto;
}

#section_kids {
  background: url(../img/kids_back.png) 0 0 no-repeat;
  background-size: 100% auto;
}

#section_youth {
  background: url(../img/youth_back.png) 0 0 no-repeat;
  background-size: 100% auto;
}


.font5 {
  font-size: 1.6em;
}

@media (max-width: 767px) { 
.font5 {
  font-size: 0.9em;
}
	.txt {
  font-size: 0.7em;
  line-height: 1.2;
}
	.midashi {
  color:#f399a9;
  letter-spacing: 3px;
	text-indent: 6px;
  font-size: 1.4em;
}
	
	.txt2 {
  font-size: 1em;
  line-height: 1.5;
}


}

/* セクション03 */

#section03 {

}

#section03 h4 {
  width: 95%;
 padding-top: 8%;
 padding-left: 5%;
}





/* 仕切り罫 */
hr {
border: 1px #fff solid;
}


/* TOPボタン */
  .pagetop {
	cursor : pointer;
    position: fixed;
    bottom: 5px;
    right: 5px;
	z-index:999;
}
.pagetop p {
    display: block;
    text-align: center;
    font-size: 12px;
    text-decoration: none;
    padding: 5px 10px;
}


/* フッター
*******************************/
#footer {
  border-top: solid 1px #000;
  text-align: center;
  padding: 10px 0;
  width: 100%;
  margin-top: 5px;
}

#footer p {
  width: 100%;
  margin: 0 auto;
}
ul.example {text-align: center;}
ul.example li {
text-align: center;	
display: inline-block; border-right: 1px solid #000;
	padding:1% 4% 1% 4%;
}

ul.example li a{
color: #333333;
display: block;
text-decoration:none;
	font-size: 2.6vw;

}
ul.example li:last-child {
border-right: 0px solid #000;
}

.youtube-container {
  position: relative;
  padding-bottom: 70%;
  padding-top: 00%;
  height: 0;
  overflow: hidden;
  background-color: #fff000;
}
.youtube-container iframe {
  position: absolute;
  top: 10%;
  bottom:8%;
  right:2%;
  left: 2%;
  width: 96%;
  height: 80%;
}

.fixed {
  position: fixed;
  width: 100%;
  height: 100%;
}



.timing{
  /* 0.5秒待ってからアニメーションする */
  -webkit-animation-delay: 0.5s;
  -moz-animation-delay: 0.5s;
  -ms-animation-delay: 0.5s;
  -o-animation-delay: 0.5s;
  animation-delay:0.5s;
}





.btnBox{ width:90%; margin: 0 auto 5%;}
.btnBox .btn{ margin: 0;}
.btnBox p{ font-size: 2.6vw!important; text-align: center;}
.pageNav .current img{opacity:0;}
.pageNav{overflow: hidden; font-size: 0; padding: 0;}
.pageNav li{width:20%;display: inline-block; background-size: contain;}
.pageNav li img:hover{opacity: 0;}
.pageNav li:nth-child(1){background-image:url("../img/220606_menu1on.jpg");}
.pageNav li:nth-child(2){background-image:url("../img/220606_menu2on.jpg");}
.pageNav li:nth-child(3){background-image:url("../img/220606_menu3on.jpg");}
.pageNav li:nth-child(4){background-image:url("../img/220606_menu4on.jpg");}
.pageNav li:nth-child(5){background-image:url("../img/220606_menu5on.jpg");}
.m0{margin: 0!important;}
.p0{padding: 0!important;}

#section03{background-color: #e2e2e2; margin: 10% 0 0; padding-bottom: 10%;}
#section03 .schoolBtn{ padding:0 15% 5% 15%}
#section03 .schoolBtn div{ display: inline-block; padding: 1% 2%; background-color: #FFF; border: 2px solid #000; width: 35%; text-align: center; margin: 2% 3%; border-radius: 30px; font-size: 3.4vw; font-weight: bold;}

.interviewTxt{width:90%!important; margin:5% auto!important; font-size: 3.2vw!important;}




/*モデルスライダー*/
.slider {margin: 5% 0;}
.slider img{width:90%; margin: auto;}

/*赤ちゃん*/
#tab1 .caseArea{overflow: hidden;}
#tab1 .caseBox p{padding: 0;margin: 0; font-size: 0;}
#tab1 .case{position: relative; font-size: 0;}

#tab1 .case .caseA1{position: absolute; left: 10%; top:10%; width:43%;}

#tab1 .case .caseB1{position: absolute; left: 45%; top:10%; width:21%;}
#tab1 .case .caseB2{position: absolute; left: 71%; top:23%; width:21%;}
#tab1 .case .caseB3{position: absolute; left: 48%; top:43%; width:21%;}
#tab1 .case .caseB4{position: absolute; left: 7%; top:56%; width:21%;}
#tab1 .case .caseB5{position: absolute; left: 30%; top:66%; width:21%;}
#tab1 .case .caseB6{position: absolute; left: 71%; top:59%; width:21%;}

#tab1 .case .caseC1{position: absolute; left: 4%; top:7%; width:50%;}
#tab1 .case .caseC2{position: absolute; left: 45%; top:46%; width:50%;}

#tab1 .qa p{margin-bottom: 5%; font-size: 3.2vw; text-align: center;}
#tab1 .qa .answer{font-size:5.4vw; color:#d83546; font-weight: bold; margin-bottom: 0;}

/*キッズジュニア*/
#tab2 .caseArea{overflow: hidden;}
#tab2 .caseBox p{padding: 0;margin: 0; font-size: 0;}
#tab2 .case{position: relative; font-size: 0;}
#tab2 .case .caseA1{position: absolute; left: 10%; top:10%; width:43%;}

#tab2 .qa p{margin-bottom: 5%; font-size: 3.2vw; text-align: center;}
#tab2 .qa .answer{font-size:5.4vw; color:#e7831e; font-weight: bold; margin-bottom: 0;}
#tab2 .qa span{font-size:2.4vw;}

/*ユース*/
#tab3 .caseArea{overflow: hidden;}
#tab3 .caseBox p{padding: 0;margin: 0; font-size: 0;}
#tab3 .caseA{position: relative; font-size: 0; padding-top: 110%; margin: 5% 0;}
#tab3 .profileTxt{width:80%; background-color:#eef7dc;position: absolute; top: 0; left:0; padding: 10% 0 20%; text-align: center;}
#tab3 .caseA .caseA1{position: absolute; right:0; bottom:0%;width:80%;}

#tab3 .caseB{position: relative; font-size: 0; padding-top: 130%; margin:0 0 5% 0;}
#tab3 .caseB .caseB2{position: absolute; right:0; bottom:0; width:80%;}

#tab3 .case{position: relative;}
#tab3 .case .caseA1{position: absolute; right: 0; bottom:0; width:100%;}
#tab3 .ycolor{background-color:#eef7dc; }
#tab3 .qa p{margin-bottom: 5%; font-size: 3.2vw; text-align: center;}
#tab3 .qa .answer{font-size:5.4vw; color:#80c400; font-weight: bold; margin-bottom: 0;}

/*アカデミー*/
#tab4 .caseArea{overflow: hidden;}
#tab4 .caseBox p{padding: 0;margin: 0; font-size: 0;}
#tab4 .caseA{position: relative; font-size: 0; padding-top: 110%; margin: 5% 0;}
#tab4 .profileTxt{width:80%; background-color:#e1f0f0;position: absolute; top: 0; left:0; padding: 10% 0 20%; text-align: center;}
#tab4 .caseA .caseA1{position: absolute; right:0; bottom:0%;width:80%;}

#tab4 .caseB{position: relative; font-size: 0; padding-top: 130%; margin:0 0 5% 0;}
#tab4 .caseB .caseB2{position: absolute; right:0; bottom:0; width:80%;}

#tab4 .case{position: relative;}
#tab4 .case .caseA1{position: absolute; right: 0; bottom:0; width:100%;}
#tab4 .ycolor{background-color:#e1f0f0; }
#tab4 .qa p{margin-bottom: 5%; font-size: 3.2vw; text-align: center;}
#tab4 .qa .answer{font-size:5.4vw; color:#00c4bc; font-weight: bold; margin-bottom: 0;}


/*シニア*/
#tab5 .case{position: relative; font-size: 0; overflow: hidden;}
#tab5 .caseBox{background-color:#eae5ea; overflow: hidden;}
#tab5 .case .caseA1{position: absolute; right: 0; top:0; width:100%;}
#tab5 .qa p{margin-bottom: 5%; font-size: 3.2vw; text-align: center;}
#tab5 .qa .answer{font-size:5.4vw; color:#864b8d; font-weight: bold; margin-bottom: 0; line-height: 100%;}
#tab5 .qa span{font-size:2.4vw;}





.container {width: 100%;}
.container .slider{margin-bottom: 3%;}
.thumbnail {padding: 0 10%;}
.thumbnail .slick-track { transform: unset !important;}
.thumbnail-img { background-position: center; background-repeat: no-repeat;padding-top: 63%;position: relative; width:63%!important; background-size: 100%;}
.thumbnail-img img{opacity: 0; transition: opacity .3s linear; width: 100%!important;position: absolute; top:0;}
.thumbnail .slick-current img{opacity: 1;}


.thumb1{background-image:url("../img/220606_step1.jpg");}
.thumb2{background-image:url("../img/220606_step2.jpg");}
.thumb3{background-image:url("../img/220606_step3.jpg");}
.thumb4{background-image:url("../img/220606_step4.jpg");}
.thumb5{background-image:url("../img/220606_step5.jpg");}
.copy{text-align: center; font-size: 2.6vw;}


@media (min-width: 750px) {
.btnBox p{ font-size: 18px!important;}
#section03 .schoolBtn div{  border: 4px solid #000!important; font-size: 20px!important; font-weight: bold;}
.qa p{font-size: 20px!important;}
.qa .answer{font-size:40px!important;}
.interviewTxt{font-size: 20px!important;}

	
	
	
.copy{text-align: center; font-size: 16px;}
ul.example li a{font-size: 16px;}
}