@charset "utf-8";




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

フェードイン
--------------------------------------------------------------------*/	
.text-focus-in {
	-webkit-animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
	        animation: text-focus-in 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
}

@-webkit-keyframes text-focus-in {
  0% {
    -webkit-filter: blur(12px);
            filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
            filter: blur(0px);
    opacity: 1;
  }
}
@keyframes text-focus-in {
  0% {
    -webkit-filter: blur(12px);
            filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
            filter: blur(0px);
    opacity: 1;
  }
}


.bgcont01{ background: url("../img/aboutbg.jpg") no-repeat right bottom; background-size: 1600px 700px; position: relative}


 .slick-slide img {
    display: block;
    width: 100%;
}

.timg{padding-right:20% }
.tou{ vertical-align: super;font-size: 2.6666666667vw;}


.uneCircle {
  background: #f2cfd3;
  animation: uneune 5s linear infinite; /* 5秒アニメーションをループ */
  width: 100px;
  height:100px;
}

@keyframes uneune {

  0% {
    border-radius: 60% 50% 70% 80% / 50% 60% 50% 70%; 
  }

  25% {
    border-radius: 70% 60% 60% 90% / 70% 80% 40% 90%; 
  }

  50% {
    border-radius: 60% 40% 70% 60% / 40% 60% 50% 60%; 
  }

  75% {
    border-radius: 90% 60% 40% 70% / 70% 50% 80% 40%; 
  }

  100% {
    border-radius: 60% 50% 70% 80% / 50% 60% 50% 70%; 
  }
}
/*-------------------------------

.bgcont01

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

.line.active{
    background-position: -100% .5em;
}
 
.line {
    background-image: -webkit-linear-gradient(left, transparent 50%, rgb(255,220,216) 50%);
    background-image: -moz-linear-gradient(left, transparent 50%, rgb(255,220,216) 50%);
    background-image: -ms-linear-gradient(left, transparent 50%, rgb(255,220,216) 50%);
    background-image: -o-linear-gradient(left, transparent 50%, rgb(255,220,216) 50%);
    background-image: linear-gradient(left, transparent 50%, rgb(255,220,216) 50%);
    background-repeat: repeat-x;
    background-size: 200% .8em;
    background-position: 0 .5em;
    transition: all 2s ease;
    font-weight: bold;
}



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

head

-------------------------------*/
head{text-align:center}

.headBoxin{border: 1px solid #cdcdcd; padding: 0 8% 10px; }
.headBox h1{position: absolute;line-height: 1.3;
    left: 50%;
    width: 250px;
    margin:-30px 0 0 -145px; background:#dcc1ba; color: #fff; display: inline-block;padding: 5px 20px; font-size: 6.2vw; text-align: center; }
.headBox h1 img{width: 52%;
    position: absolute;
    top: -60%;
    left: -15%;
}
.headBox h1 span{vertical-align: super; font-size: 2.6666666667vw;  }
.headBox .text01{padding-top: 22%}
.headBox .text01 img{max-width: 528px}
/*-------------------------------

.aboutBox

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

.youtubebg{ text-align: center ; position: relative; padding-top: 30px }
.youtubebg .toha img{width: 25%; max-width:139px; padding-bottom: 20px; position: absolute; right: 1%; top: -60px; z-index: 55}
.youtubebg{margin: 0; text-align: center ; }
.youtubewaku{border: 1px solid #e6c3c3; padding: 5px; margin: 0 10px; 
	box-shadow: 0px 0px 8px #bc8e8e;}
.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.youtubebg .check{width: 30%; max-width:180px; position: absolute; bottom: -20%; right: 2%; }


.aboutBox{text-align: center; position: relative; z-index: 2;  padding: 40px 0 0 }
.aboutBox dfn{display: inline-block; font-size: 4.8vw; position: relative}
.aboutBox dfn:before {
    content: "";
    display: inline-block;
    background: url("../img/wakul.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    left: -15px; top:0
}
.aboutBox dfn:after {
    content: "";
    display: inline-block;
    background: url("../img/wakur.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    right: -35px; bottom:5%
}
.aboutBox .syo{font-size: 2.6666666667vw; text-align: right;  margin: 0 8% 0 0}
.aboutBox .text02 {font-size: 5.5vw; padding: 10px 8% 25px; line-height: 1.4; 

/*background-image: url(../img/line_4.jpg);*/
    background-repeat: no-repeat;
    background-position: bottom center;
    background-size: 100% 35px;
font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;font-weight: 500;
	display: inline-block}
.aboutBox .text02 span{font-weight: 500}
.aboutBox .text03{font-size: 6vw; margin: 30px 0 0; line-height: 1.6;font-family: "Times New Roman", "YuMincho", "Hiragino Mincho ProN", "Yu Mincho", "MS PMincho", serif;font-weight: 500}
.aboutBox .text03 span{font-size: 4vw; font-weight: 500}


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

.future

-------------------------------*/
.bgimg{ /*background: url(../img/perbg.jpg) no-repeat left 300px; background-size: auto; */}

.future{text-align: center; padding-top: 100px}
.future li{margin-bottom: 25px}
.future .sub{text-align: center; margin-bottom: 30px; font-size: 6vw; position: relative; display: inline-block; }
.future .sub:before {
    content: "";
    display: inline-block;
    background: url("../img/wakul.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    left: -35px; top:-10px
}
.future .sub:after {
    content: "";
    display: inline-block;
    background: url("../img/wakur.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    right: -35px; bottom:-15%
}
.future ul{margin: 0 8%}
.future li{background: #fff; padding: 4px}
.future li .inwaku{border:#e6c3c3 solid 1px; padding:25px 20px 20px; position: relative}
.future li .inwaku:before,
.future li .inwaku:after {
    position: absolute;
    left: 50%;
    content: "";
    height: 0;
    width: 0;
}

.future li .inwaku:before {
    top: 98%;
    border: 16px solid;
    border-color: transparent;
    border-top-color: #e6c3c3;
    margin-left: -16px;
}

.future li .inwaku:after {
    top: 97%;
    border: 16px solid;
    border-color: transparent;
    border-top-color: white;
    margin-left: -16px;
}

.future li .inwaku .text0{position: absolute; left: -5px; top: -5px; background: #fff; padding: 3px ; line-height: 1.2; font-size: 4.2666666667vw;}
.future li .inwaku .text1{font-size: 5.3333333333vw; color:#ca7b7b ; line-height: 1.5}
.future li .inwaku .name{position: absolute; right: -5px; bottom: -5px; background: #fff; padding: 3px 3px 0; font-size: 2.9333333333vw; color:#ca7b7b ; line-height: 1.2; }

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

voice

-------------------------------*/
.voice{text-align: center; padding: 50px 0 0}
.voice .sub{text-align: center; margin-bottom: 30px; font-size: 6vw; position: relative; display: inline-block; }
.voice .sub:before {
    content: "";
    display: inline-block;
    background: url("../img/wakul.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    left: -35px; top:-10px
}
.voice .sub:after {
    content: "";
    display: inline-block;
    background: url("../img/wakur.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    right: -35px; bottom:-15%
}
.voice ul{margin: 0 8%}
.voice li{ padding: 8px; border: solid 1px #f1e2e0 ; background: #f3dcdf; text-align: left; margin-bottom: 30px}
.voice li:last-child{margin-bottom: 50px}
.voice li:nth-child(2){background:#f5d7db}
.voice li:nth-child(3){background:#fde8e8}
.voice li:nth-child(4){background:#ffecec}
.voice li .waku{padding: 30px 20px 20px 0; position: relative; background: #fff}
.voice li .waku .vo{position: absolute; left: 5px; top: 5px; width:49px }
.voice li .waku dl{display: flex; justify-content: space-between}
.voice li .waku dt{width: 30%; margin-left: -10px}
.voice li .waku dd{width: 67%;}
.voice li .waku p{padding: 10px 0 0 20px}
.voice li .waku .pink{font-weight: bold ; color: #ca7b7b}


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

.proBox

-------------------------------*/
.achflex{margin-right: 8%}
.achflex .achl h2{font-size: 4vw; margin-bottom: 10px}
.achflex .achl .pic01{margin-right: 30%; margin-bottom: 10px}
.achflex .pink{ border: 1px solid #ebdadc; display: inline-block; padding: 2px 15px 0; text-align: center; font-size: 3.2vw; font-weight: 600; margin-bottom: 5px; line-height: 1.4;}
.achflex .achl ul{font-size: 2.9333333333vw; line-height: 1.5; margin-bottom: 10px}
.achflex .achr ul{display: flex; justify-content: space-between; flex-wrap: wrap;
align-items: flex-end;}
.achflex .achr ul li{width: 20%; margin-bottom: 10px}
.achflex .achr ul li:first-child{width: 100%; margin-bottom: 0}
.achflex .achr ul li .lank{font-size: 1.8vw; line-height: 1.2;letter-spacing: normal;padding: 0 7px 5px;}

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

.pertBox

-------------------------------*/
.pertBox{text-align: center}
.pertBox h2{display: inline-block; margin-bottom: 10px; position: relative}
.pertBox h2:before {
    content: "";
    display: inline-block;
    background: url("../img/wakupl.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    left: -35px; top:0
}
.pertBox h2:after {
    content: "";
    display: inline-block;
    background: url("../img/wakupr.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    right: -35px; bottom:5%
}
.pertBox .text01{    font-size: 7vw;
    line-height: 1.6;
    letter-spacing: normal;}


.pertBox .text02{margin: 30px 8% 50px; text-align: center}

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

.whtatbox

-------------------------------*/
.whtatbox{text-align: center}
.whtatbox .whtatl h2{font-size: 4vw; margin-bottom: 10px}
.whtatbox .whtatl .text01{font-size: 5vw;line-height: 1.6;    padding-bottom: 50px; letter-spacing: normal;}
.whtatbox .whtatl .text01 span{letter-spacing: -4px; display: inline-block}
/*-------------------------------

.sevBox

-------------------------------*/
.sevBox{margin: 0 8% 20px; background: url("../img/touka.png") repeat  ;padding: 5px; z-index: 1; position: relative;border: 1px solid #cdcdcd;}
.sevin{border: 1px solid #cdcdcd; padding: 0 2% 20px 8%; }
.sevBox .text01{    position: absolute;
    line-height: 1.3;
    left: 50%;
    width: 250px;
    margin: -30px 0 0 -125px;
    background: #dcc1ba;
    color: #fff;
    display: inline-block;
    padding: 5px 10%;
    font-size: 6.2vw;
    text-align: center;
    box-sizing: border-box; }
.sevBox .text02{    margin: 30px 15% 10px;}
.sevin ul{position: relative}
.sevin li{text-align: left;font-size: 3.2vw; background: url("../img/m01.png") no-repeat left top; background-size: 22px; padding-left: 30px;line-height: 1.4;
    padding-bottom: 15px;}
.sevin li:nth-child(2){ background: url("../img/m02.png") no-repeat left top; background-size: 22px;}
.sevin li:nth-child(3){ background: url("../img/m03.png") no-repeat left top; background-size: 22px;}
.sevin li:nth-child(4){ background: url("../img/m04.png") no-repeat left top; background-size: 22px;}
.sevin li:nth-child(5){ background: url("../img/m05.png") no-repeat left top; background-size: 22px;}
.sevin li:nth-child(6){ background: url("../img/m06.png") no-repeat left top; background-size: 22px;}
.sevin li:nth-child(7){ background: url("../img/m07.png") no-repeat left top; background-size: 22px;}
.sevin li:last-child{ background:none; width:150px; position: absolute; right: -20px; bottom: -80px}

.whtatbox .sevtex02 {
    font-size: 7.2vw;
    line-height: 1.6;
    padding: 10px 0 3px;
	    background: url(../img/line01.png) no-repeat bottom center;
    background-size: contain;
    display: inline-block;
}


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

.poiBox

-------------------------------*/
.poiBox {text-align: center ; background: url(../img/aboutbg.jpg) no-repeat bottom center; padding-bottom: 640px}
.poiBox .sub{text-align: center; margin-bottom: 30px; font-size: 5.3333333333vw; position: relative; display: inline-block; z-index: 5 }
.poiBox .sub:before {
    content: "";
    display: inline-block;
    background: url("../img/wakul.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    left: -35px; top:-10px
}
.poiBox .sub:after {
    content: "";
    display: inline-block;
    background: url("../img/wakur.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    right: -35px; bottom:-15%
}

.poiBox .pflex{position: relative}
.poiBox .pflex .wa{position: absolute; width: 50%; max-width:193px; top: -50px; left: 2% }


.poiBox .sub img{width: 131px; display: block; position: absolute; top: -50px; left: 50%; margin-left: -65px}
.poiflex {margin: 0 8% 40px }
.po02{padding-top:50px}
.poiflex .poil{position: relative}

.poiflex .uneCircle {
    width: 100px;
    height: 100px;
}

.poiflex .poir{text-align: left}

.poiflex .poir .kaz{position: relative}
.poiflex .poir .kaz .uneCircle{position: absolute; top: -20px; background: #f8dfe2}
#p02 .poiflex .poir .kaz .uneCircle{ background: #f2cfd3}
.poiflex .poir h2{font-size: 6vw;position: relative; z-index: 1;
    line-height: 1.4; margin: -5px 0 20px; padding-top: 10px}
.poiflex .poir h2 .min{display: block; text-align: right; font-size: 2.6666666667vw;}
.poiflex .poir .mini{text-align: right; display: block; font-size: 2.9333333333vw; }

.afflex{background: url("../img/afterbg.jpg") no-repeat 15% center; position: relative}


.prof{margin:80px 8% 0; font-size: 2.6666666667vw; line-height:1.6}
.prof dl{display: flex; justify-content: space-between; margin-bottom: 8px}
.prof dt{text-align: right; font-weight: bold ;width: 15%}
.prof dd{width: 80%; border-left: solid #b8b8b8 1px; padding-left: 3%}

.prof dl img{width: 100%; max-width: 105px}

.prof dl.pro02 li{list-style: disc; margin-left: 15px}

.prof dl.pro03 {margin-bottom: 0px}
.pro03 .achr ul{display: flex; justify-content: space-between; flex-wrap: wrap;
align-items: flex-end;}

.pro03 .achr ul li{width: 18%}

.pro03 .achr ul li{width: 20%;}
.pro03 .achr ul li .lank{font-size: 1.8vw; line-height: 1.2;letter-spacing: normal;padding: 0 7px 5px;}


.slideshow-container {
  position: relative;
  max-width: 1100px;
  margin: auto;
}

.mySlides {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  transition: opacity 1s ease-in-out;
}

.fade {
  animation-name: fade;
  animation-duration: 1.5s;
}

@keyframes fade {
  from {
    opacity: 0.4;
  }
  to {
    opacity: 1;
  }
}


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

.curBox

-------------------------------*/
.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.hinge {
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}

@-webkit-keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

@keyframes fadeIn {
  0% {
    opacity: 0;
  }

  100% {
    opacity: 1;
  }
}

.fadeIn {  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-name: fadeIn;
  animation-name: fadeIn;
}


.curBox{text-align: center; margin: 0px 0px 130px}
.curBox img{vertical-align: bottom}
.curBox .timg{padding: 10px 10px}
.curBox .tit{margin-bottom: 30px}


.curBox .lesl{position: relative}
.curBox .nomver{width: 10%; left: 0; top:0; position: absolute}
.curBox .midashi{position: absolute; left: 11%; top: 2%; color: #fff; text-align: left}
.curBox .lesspic{width: 20%;}
.curBox h3{font-size: 6vw; margin-top: -5%; letter-spacing: normal;white-space: nowrap}
.curBox .lesr{ border: 1px solid /*#f3e8e9*/ #df7991; padding:30px 5% ; text-align: left; margin-bottom: 40px}
.curBox .lesr .text01{ color: #ba8491; display: inline-block; padding: 0 10px; margin-bottom: 20px !important; font-family: 'Sawarabi Mincho', serif; position: relative; font-size: 4.2666666667vw; letter-spacing: normal;}

.curBox .lesr .text01:before {
    content: "";
    display: inline-block;
    background: url("../img/waku01l.png");
    background-size: cover;
    width: 16px;
    height: 16px;
    position: absolute;
    left: -5px; top:-5px
}

.curBox .lesr .text01:after {
    content: "";
    display: inline-block;
/*    background: url("../img/waku01r.png");*/
    background-size: cover;
    width: 16px;
    height: 16px;
    position: absolute;
    right: -5px; bottom:-15%
}
.curBox .lesr .tright{text-align: right; margin-top: 10px;}
.curBox .lesr .text02{margin: 15px 0 10px; }

#less02 .lesr .text01{ color: #cc8092;}
#less03 .lesr .text01{ color: #df7991;}
#less04 .lesr .text01{ color: #f48384;}
#less05 .lesr .text01{ color: #ff7070;}

/*
#less02 .lesr .text01:before { background: url("../img/waku02l.png"); background-size: cover;}
#less02 .lesr .text01:after { background: url("../img/waku02r.png"); background-size: cover;}
#less03 .lesr .text01:before { background: url("../img/waku03l.png"); background-size: cover;}
#less03 .lesr .text01:after { background: url("../img/waku03r.png"); background-size: cover;}
#less04 .lesr .text01:before { background: url("../img/waku04l.png"); background-size: cover;}
#less04 .lesr .text01:after { background: url("../img/waku04r.png"); background-size: cover;}
#less05 .lesr .text01:before { background: url("../img/waku05l.png"); background-size: cover;}
#less05 .lesr .text01:after { background: url("../img/waku05r.png"); background-size: cover;}
*/

.curBox #less05 .lesr{margin-bottom: 0}

#less05 .lesr{position: relative}



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

.messimg

-------------------------------*/
.messimg {background: url(../img/perbg.jpg) no-repeat bottom center;
    padding-bottom: 80px; background-size:auto;}
    
.messimg .name{text-align: center}
.messimg .name .sub{margin-bottom: 30px; font-size: 28px; letter-spacing: 2px}
.messimg .name .sub span{font-size: 12px; line-height: 1.8 ; display: block; letter-spacing: normal;padding-top: 15px}
.messimg .name .timg{padding: 0px 10px 10px}

.messBox2 {position: relative;}

  
.messBox2 .handr{ margin: 20px 8%; z-index: 1; position: relative}
.messBox2 .handr .text02{font-size: 4.2666666667vw; margin: 20px 0}
.messBox2 .lastBox{position: relative; z-index: 1; margin: 0 ; line-height: 1.8;}
.messBox2 .lastBox .pic{width: 30%; position: absolute; right: 3%; bottom: -60px}
.messBox2 .lastBox .text04{font-size: 4vw; text-align: center; padding-top: 50px}
.messBox2 .lastBox .text05{font-size: 5vw; margin: 20px 0 0; text-align: center}
.messBox2 .lastBox .text05 .sen{background: url( "../img/line1p1.png" ) no-repeat -20px bottom ; background-size: contain ; display:  inline-block}
.messBox2 .lastBox .text05 .sen2{background: url( "../img/line1p2.png" ) no-repeat center bottom ; background-size: contain ; display:  inline-block}


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

.outBox

-------------------------------*/
.outBox{text-align: center; margin: 0 0%}
.outBox .timg{padding: 10px 10px}
.outBox dl{text-align: left; font-size: 3.2vw; margin-top: 20px}
.outBox dt{font-weight: bold; color: #fff; background:#dcc1ba; text-align: center; border-radius: 80px; font-size: 16px;}
.outBox dd{line-height: 1.8; padding-top: 8px;}
.outBox dd li{list-style: disc; margin: 0 0 5px 20px}

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

.qaBox

-------------------------------*/
.qaBox{ margin: 70px 8%}
.qaBox .timg{text-align: center; padding: 0 10px }
.qaBox .timg img{width: 132px}

.cp_actab {
	position: relative;
	overflow: hidden;
	max-width:830px;
	margin: 0 auto 1px; background:#fff;
border: 1px solid #e6c3c3; font-size: 3.2vw;
}
.cp_actab input {
	position: absolute;
	z-index: -1;
	opacity: 0;
}
.cp_actab label {
	font-weight: bold;
	position: relative;
	display: block;
	padding: 15px 0 15px 45px;
	cursor: pointer;
	margin: 0 0 1px 0;
padding-right:40px;
color:#4b474d;
line-height: 1.4;
background: url("../img/q.png") no-repeat 10px 12px; background-size: 30px
}
.cp_actab label span{font-weight:normal;}
.cp_actab .cp_actab-content {
	overflow: hidden;
	max-height: 0;
	-webkit-transition: max-height 0.35s;
	transition: max-height 0.35s;



}
.cp_actab .cp_actab-content p {
	margin: 0; padding:0px 20px 20px 45px !important; line-height:1.6em;
	background: url("../img/a.png") no-repeat 10px 4px; background-size: 30px
}
/* :checked */
.cp_actab input:checked ~ .cp_actab-content {
	max-height: 200em;
}
/* Icon */
.cp_actab label::after {
	line-height: 3;
	position: absolute;
	top: 10px;
	right: 0;
	display: block;
	width: 3em;
	height: 3em;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
	text-align: center;color:#e6c3c3;
}
.cp_actab input[type=checkbox] + label::after {
	content: 'â–¼';
}
.cp_actab input[type=checkbox]:checked + label::after {
	transform: rotate(180deg);
}
.cp_actab label::before {
	content: 'CLICK';	text-align: center;color:#e6c3c3;
		position: absolute;
top: 8px;
    right: 4px;
	display: block;
	width: 3em;
	height: 3em;    font-size: 10px;
    letter-spacing: normal;

}

.kokuchi{margin: 0 8%; border:#e7d6d6 1px solid; padding: 10px 0}
.kokuchi .text0{font-size: 4vw;}

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

ボタン

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

.butBox{margin:0px 8% 20px; max-width:664px; padding: 5px;
background: rgb(254,244,232);
background: linear-gradient(90deg, rgba(254,244,232,1) 0%, rgba(253,182,198,1) 100%); background-size: 200% 200%;
  animation: GradietionAnimation 4s ease infinite;}
.button4{ border: 1px solid #fff;font-size: 5vw;
  display:block; padding: 10px 0;
  line-height:50px;
  position:relative;
  text-decoration:none;
  text-align:center;
  color:#fff;
  transition:0.5s;
background: rgb(254,244,232);
background: linear-gradient(90deg, rgba(255,198,198,1) 0%, rgba(255,162,183,1) 100%);  background-size: 200% 200%;
  animation: GradietionAnimation 4s ease infinite;
}
.button5{ border: 1px solid #fff;font-size: 8vw;
  display:block; padding: 20px 0;
  line-height:50px;
  position:relative;
  text-decoration:none;
  text-align:center;
  color:#fff;
  transition:0.5s;
background: rgb(254,244,232);
background: linear-gradient(90deg, rgba(255,200,194,1) 0%, rgba(255,173,155,1) 100%);  background-size: 200% 200%;
  animation: GradietionAnimation 4s ease infinite;
}



@keyframes GradietionAnimation { 
  0%{background-position:0% 50%}
  60%{background-position:100% 50%}
  100%{background-position:0% 50%}
}

.manin{padding-bottom: 150px; text-align: center}

#footer ul{display: flex; justify-content: space-between; margin: 0 8% 100px}
#footer ul li{width: 23%}
#footer ul li:first-child{width: 31%; font-size: 4.2666666667vw;}
#footer img{ width: 64px}
#footer {padding-bottom: 80px}

#footer ul.footbtn{display: block}
#footer ul.footbtn li:first-child , #footer .footbtn li {width:100% ;  }
#footer .footbtn li .butBox{margin: 0 0 20px}


@media screen and (min-width: 480px) {
.poiBox{padding-bottom: 770px}
}


@media screen and (max-width: 639px) {
.voice li:nth-child(2n) .waku{padding-right: 0}
.voice li:nth-child(2n) .waku dl{flex-direction:row-reverse; padding-left: 20px}
.voice li:nth-child(2n) .waku dt{width: 30%; margin-left: -10px; margin-left: 0; margin-right: -10px}
.voice li:nth-child(2n) .waku p{padding-right: 20px}

.bgcont01 .hikari{ position: absolute; left: 0; top: 30%; z-index: 1; width: 100%;
mix-blend-mode: overlay; 
  animation: hikari 5s ease 0s infinite alternate;
  transform-origin:center;
}
@keyframes hikari {
  from {
    transform: scale(1,2);
  }
  to {
    transform: scale(1,1.5);top: 35%;
  }}
	
	
	.headBox{margin: -20% 8% 20px; background: url("../img/touka.png") repeat  ;padding: 5px; z-index: 1; position: relative;}
	
.pertBox .text01 span{line-height: 1.6; display: block; margin-top: 0px;}
.pertBox .text01 span i{font-size:2.6666666667vw;}

.achflex{ border: #ebdadc solid 1px}
.achflex .achl{padding: 20px 20px 0;}
.achflex .achr ul li:first-child{margin-left: 20px;}


.bgcont01smt{background: url("../img/sevbg.jpg") no-repeat top center; background-size: contain }

.whtatbox{background: url("../img/aboutbg.jpg") no-repeat bottom center; padding-bottom: 120px }


.afflex .hikari{ position: absolute; right: 0;top: 230px; z-index: 1; width: 50%;
mix-blend-mode: overlay; 
  animation: hikari3 5s ease 0s infinite alternate; 

}
@keyframes hikari3 {
  from {
    transform: scale(1,3);
  }
  to {
    transform: scale(1,1.5);bottom: 80%;
  }}


.messageBox .lose{   background:  url("../img/messbg.jpg") ; position: relative;
background-size: 640px 900px;
padding: 40px 8% 0;
  min-height: 400px;
		background-attachment: scroll;
    background-repeat: no-repeat;
    background-position: center center;
    z-index: 2;	}
.messageBox .textl{position: relative; padding: 0px 20px 60px 0; background: url("../img/touka.png") repeat; display: inline-block;  }
.messageBox .textl span{font-size: 4.2666666667vw; line-height: 1.8; letter-spacing: normal}





img{max-width:100%}
.smtno{display: none !important}



.kotei{font-size: 5.3333333333vw;
  position: fixed;
  right: 0;
  bottom: 0;
  color: #fff;
  padding: 5px;
  cursor: pointer;
  transition: .3s;
  width: 100%;
background: rgb(254,244,232);
background: linear-gradient(90deg, rgba(254,244,232,1) 0%, rgba(253,182,198,1) 100%);
  
  /*デフォルトで非表示にする*/
  opacity: 0;
  visibility: hidden;
  z-index: 88
}
.kotei ul{display: flex}
.kotei li{width: 50%; padding:0 2px; }
.kotei li:nth-child(2){padding-right: 0; padding-left: 2px}
/*このクラスが付与されると表示する*/
.active{
  opacity: 1;
  visibility: visible;
}
.kotei .button1{ border: 1px solid #fff;font-size: 5.5vw;
  display:block; padding: 10px 0;
  line-height:50px;
  width: 100%;
  position:relative;
  text-decoration:none;
  text-align:center;
  color:#fff;
background: rgb(254,244,232);
background: linear-gradient(90deg, rgb(255 200 200) 0%, rgba(255, 160, 181, 1) 100%)
}
.kotei .button2{ border: 1px solid #fff;font-size: 5.5vw;
  display:block; padding: 10px 0;
  line-height:50px;
  width: 100%;
  position:relative;
  text-decoration:none;
  text-align:center;
  color:#fff;
background: rgb(254,244,232);
background: linear-gradient(90deg, rgb(252 207 201) 0%, rgba(255, 177, 165, 1) 100%)
}
}


@media screen and (min-width: 640px) {
body{ font-size:14px }

.tou {
    vertical-align: super;
    font-size: 13px;
}

.bgcont01 .hikari{ position: absolute; left: 0; top: 15%; z-index: 1; width: 940px; height: 898px;
mix-blend-mode: overlay; 
  animation: hikari 5s ease 0s infinite alternate;
  transform-origin:center;
}
@keyframes hikari {
  from {
    transform: scale(1,1);
  }
  to {
    transform: scale(1,1);top: 30%;
  }}
	


.head{ width: 100%;
  height: 100vh;
  background-image: url("../img/head.jpg");
  background-size: cover;
  background-position: center; min-height: 770px
}
	
.headBox{ background: url("../img/touka.png") repeat  ;padding: 5px; z-index: 2; position: absolute; width: 614px; left: 50%; margin-left: -307px; bottom:33%}
	.headBoxin{padding: 0; text-align: center;}
.headBox h1{font-size:40px; width: 530px; margin: 0 0 0 -285px; top: -5%; }
.headBox h1 img{width: 189px;}
.headBox .text01 {
    padding-top: 70px;
}

.kari01{background: #fff;}


.bgimg {
/*
    background: url(../img/perbg.jpg) no-repeat center 300px;
    background-size: auto;
*/
}

.youtubebg {
padding: 50px 30px 38px; background: url("../img/course.png") no-repeat left bottom; background-size: 281px 234px;
max-width: 750px;
margin: 0 auto
}
.youtubebg .toha img{width:139px;right: -60px; }
.youtubebg .check{width:96px;bottom: 10px;right: 0px; }

.future .sub{font-size: 36px ; letter-spacing: 2px}
.future ul{margin: 0 auto; width: 1010px; display: flex; justify-content: space-between ;  flex-flow: wrap}
.future li{width: 44%; margin-bottom: 40px}
.future li:nth-child(2){margin-right:8% }
.future li:nth-child(3){margin-left:8% ; width: 38%}
.future li:nth-child(4){width: 50%}
.future li .inwaku .text0{font-size:20px }
.future li .inwaku .text1{font-size:26px }
.future li .inwaku .name{font-size:14px }

.voice .sub{font-size: 36px ; letter-spacing: 2px}
.voice ul{margin: 0 auto; width: 1100px; display: flex; justify-content: space-between ;  flex-flow: wrap}
.voice li {width: 510px;
    padding: 10px;
    margin-bottom: 35px; font-size: 16px
}
.voice li .waku{padding: 30px}
.voice li:nth-child(4) .waku{padding-bottom: 60px}
.voice li .waku dt{margin-left: 0 ; width: 120px}
.voice li .waku dt img{width: 100%}
.voice li .waku dd{width: 306px}
.voice li .waku .vo{left: 10px; top: 10px;}
.voice li:last-child{margin-bottom: 35px}


.aboutBox{padding: 90px 0 0; position: relative}

.aboutBox dfn{font-size: 25px}
.aboutBox .syo {
    font-size: 10px;
    width: 480px;
    margin:0 auto 20px;
    text-align: right;}
.aboutBox .text01{font-size: 20px; line-height: 1.4;}
.aboutBox .text02 {
    font-size: 32px;
    padding: 0 0 25px;
}
.aboutBox .text03{font-size: 36px; margin-top: 20px}
.aboutBox .text03 span {font-size: 24px;}
	
.timg{ padding: 0; width: 400px}
.timg img{ width: 400px}



.uneCircle { width: 150px; height: 150px;}

.achflex .achl h2 {font-size: 16px;}
.achflex {
    margin: 50px auto 0; padding-bottom: 50px;
    width: 1100px;
}
.achflex .achl .pic01 { margin-right: 0;}
.achflex .achl .pic01 img{width: 296px;}
.achflex .pink{font-size: 14px;padding: 5px 15px; }

.achflex{display: flex; justify-content: space-between;}
.achflex .achl{width:610px }
.achflex .achr{width:490px }
.achflex .achl ul { font-size: 14px; display: flex; justify-content: space-between;}
.achflex .achl ul li{width:88px }
.achflex .achl ul li:last-child{width:480px;  align-self: center; }

.achflex .achr ul{padding-top: 40px}
.achflex .achr ul li:first-child{width:88px;align-self: baseline; }
.achflex .achr ul li{width:60px }
.achflex .achr ul li img{width:100%}
.achflex .achr ul li .lank{padding: 0 0 5px }

.bgcont01smt{background: #fff url("../img/perbg.jpg") no-repeat center bottom; padding-bottom: 145px}

.pertBox {
    text-align: center;
    padding: 100px 0 0;
}
.pertBox .text01 { letter-spacing: 2px;
    font-size: 36px;}
.pertBox .text01a{font-size: 36px; padding-top: 5px;}
.pertBox .sub{text-align: center; font-size: 38px; position: relative; display: inline-block;}
.pertBox .sub:before {
    content: "";
    display: inline-block;
    background: url("../img/wakul.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    left: -35px; top:-10px
}
.pertBox .sub:after {
    content: "";
    display: inline-block;
    background: url("../img/wakur.png");
    background-size: cover;
    width: 30px;
    height: 30px;
    position: absolute;
    right: -35px; bottom:-15%
}


.pertBox .text01 span img {
    width: 36px;
    transform: rotate(0deg);
}
.pertBox .text02 {line-height: 1.8;
    margin: 110px auto 0;
    text-align: left;
    font-size: 18px;
    width: 1100px;    z-index: 2;
    position: relative;
}

.prof{ font-size:13px; width:1100px; position: absolute; top:600px; left: 50%; margin-left: -550px }
.prof dl{margin-left: 580px}

.poiBox .pflex .wa{left: 50%; margin-left: -596px }

.sevBox {
    margin: 0 auto;
    width: 640px;}
.sevBox .text01 {
    width: 400px;
    margin: -30px 0 0 -200px;
    padding: 10px 0; font-size: inherit; }
.sevBox .text01 img{width:242px}
.sevBox .text02 img{width:214px }
.sevin li{font-size: 17px; font-family: 'Sawarabi Mincho', serif; padding-left: 35px;}
.sevin {
    padding: 0 100px 20px 100px;
}
.sevBox .text02 {
    margin: 40px auto 10px;
}
.sevin li:last-child {
    width: 216px;
    right: -170px;
    box-sizing: border-box;
    bottom: -50px;
}
.sevin li:last-child img{width: 216px;}
.sevtex01{font-size: 20px; padding-top: 40px; margin-bottom: 10px}
.whtatbox .sevtex02 {background: url(../img/line02.png) no-repeat bottom center;
    background-size: 930px 30px;
    font-size: 38px;
    padding: 0px 0 18px;
    letter-spacing: normal; width: 100%}


.poiBox {text-align: center; background: url("../img/perbg.jpg") no-repeat center bottom; padding-bottom: 570px;}
.poiBox .sub{font-size: 32px; margin-bottom: 40px;}
.pflex ul{width: 1100px; margin: 0 auto; justify-content: space-between; display: flex}
.pflex li{width:340px }
.poiflex .poil img{width:100% }

.poiflex .poir h2 {    font-size: 28px;
    margin: -20px 0 20px;
    padding-top:20px }
.poiflex .poir .mini{font-size: 10px}
.poiflex .poir .text01 { font-size: 15px; line-height: 2; font-weight: 500}

.poiflex .poir .kaz .uneCircle {
    top: -0px;
    left: -10px;
}
.poiflex {
    margin: 0 0 40px;
}
.poiBox .sub img {
    width: 131px; position: static;
    display: inline-block;
   margin-left:auto; vertical-align: middle; margin-right: 10px}
.po02{padding-top: 20px;}


ul.katu {width: 1100px; margin: 0 auto; justify-content: space-between; display: flex}
.katu li{width:340px }
.katu .poil img{width:100% }

.katu .poir h2 {    font-size: 28px;
    margin: -20px 0 20px;
    padding-top:20px }
.katu .poir .mini{font-size: 10px}
.katu .poir .text01 { font-size: 15px; line-height: 2; font-weight: 500}


.afflex {
    background: none;
    position: relative; padding-bottom: 40px;
}

.afflex .hikari{ position: absolute; right: 0px; top: -25%; z-index: 1; width: 640px; height: 898px;
mix-blend-mode: overlay; 
  animation: hikari3 5s ease 0s infinite alternate; 

}
@keyframes hikari3 {
  from {
    transform: scale(1,1);
  }
  to {
    transform: scale(1,1);top: 10%;
  }}

.whtatbox{position: relative; max-width: 1400px; margin: 0 auto}
.whtatbox .pic01{position: absolute; top: -180px; right: 0; width:788px }
.whtatbox .whtatl{width: 1100px;
    text-align: left;
    margin: 40px auto 0; position: relative; z-index: 1}
.whtatbox .whtatl h2 {font-size: 18px;margin-bottom: 0;}
.whtatbox .whtatl .text01 { font-size: 40px; line-height: 1.5; padding-bottom: 120px;}
.whtatbox .whtatl i {background: #fff; padding: 0 10px 0 0}


.curBox {background: #fff;
    text-align: center;
    margin:0px auto 0px; padding: 0px 0 130px;
}
.curBox .timg {
    padding: 10px 0;
    margin: 0 auto;
}
.lesflex{ /* width: 990px; */ margin: 0 auto 50px; /* display: flex; */ justify-content: space-between;}
.lesflex .lesl{width:490px;box-sizing: border-box;  }
.lesflex .lesr{/*width:500px;*/box-sizing: border-box; margin-bottom: 0; padding: 60px 50px 60px;
    line-height: 2; }
.curBox .nomver { width: 46px;}
.curBox .midashi{top: 3%}
.curBox .lesspic{width:54px }

.curBox .lesr .text02, .curBox .lesr .text02a{font-weight: 500}

.curBox h3 {  font-size: 30px;line-height: 1.4;
    padding-top: 10px;}
#less03 .lesl h3 { font-size: 28px; letter-spacing: -1px; margin-top: -7px;	}	
.curBox .lesr .text01{font-size: 28px; }
#less04 .lesr .text01{letter-spacing: -1px}

.lesflex .lesl img.mainpic{width: 100%}

#less05{ width: 1100px; margin: 0 auto; position: relative}




.mesbg{background: url("../img/bgyuhaginaka.jpg") no-repeat right top; background-size: 60% ; position: relative}
.messageBox {max-width: 1400px; margin: 0 auto; position: relative;}


.messimg .name{ margin-left: 15%; text-align: left;padding: 80px 0 40px;
    width: 470px; position: relative}
.messimg .name .uneCircle{position: absolute; top:35px;}				
	.messimg .name .timg {
    padding: 0;
    position: relative;
    z-index: 1;
    margin-left: -60px;
}
.messimg .name .sub {
    margin-bottom: 0;
    position: relative;
    z-index: 1;
    padding-top: 10px;
}


.messageBox .textl{margin-left: 15%; width: 470px; font-size: 18px;padding: 0px 0 0px; margin-bottom: 0px; font-weight: 500; line-height: 1.6} 
.messageBox .textl span{font-size: 20px;}
.messBox2 { background:none;}
				
.messBox2 .lastBox .text04 { font-size: 22px; text-align: center;margin: 0px 0 40px; padding-top: 70px}
.messBox2 .lastBox .text05 {width: 1000px; margin: 0 auto;font-size: 30px;}
.messBox2 .lastBox .text05 .span{font-size: 36px; display: block}
.messBox2 .lastBox .text05 .sen {
    background: url(../img/line1p1.png) no-repeat -30px bottom;
    background-size: 508px 18px; font-size: 36px;
}
.messBox2 .lastBox .text05 .sen2 {
    background: url(../img/line1p2.png) no-repeat center bottom;
    background-size:462px 18px; font-size: 36px;
}
.messBox2 .lastBox .pic {
    width: 246px;    bottom: -70px;
    left: 50%;
    margin-left: 210px;}
.messBox2 .hikari{ position: absolute; left: 0; top: 0%; z-index: 1;  width: 640px; height: 898px;
mix-blend-mode: overlay; 
  animation: hikari2 6s ease 0s infinite alternate;
  transform-origin:center;
}
.lose{position: relative}



@keyframes hikari2 {
  from {
    transform: scale(1,2);
  }
  to {
    transform: scale(1,1.5);top: 30%;
  }}

.prof {font-size: 12px}
.prof dt{width: 18%}
.prof dd{width: 76%}

.outBoxbg{background: #fff}
.outBox{width: /*1100px*/ 100%; margin: 0 auto}
.outBox .timg {
    padding: 0 0 10px;
    margin: 0 auto;
}
.outBox dl{font-size: 13px}
.out01 {padding: 20px 0}
.out01 dl { width: /*830px*/ 100%; /*display: flex;*/ justify-content: space-between; margin: 0 auto 10px; }
.out01 dt{width: /*80px*/ 100%}
.out01 dt.lst{height: 26px;}
.out01 dd{width:730px; padding-top: 10px; padding-left: 20px;}

.outflex{ width: 1100px;display: flex; justify-content: space-between;  margin: 0 auto}
.outflex .outfll{width: 520px}
.outflex .outflr{width: 520px}


.qaBoxbg{background: #fff}
.qaBox{margin: 0 auto; padding: 70px 0 90px}
.qaBox .timg{ width: auto}
.cp_actab{font-size: 14px}

.kokuchi {
    margin: 0 auto;
    width: 680px;
}
.kokuchi .text0 {
    font-size: 4vw;
}
.kokuchi .text01 {
        font-size: 13px;
}

.butBox {
    margin: 0px auto 20px;
    max-width: 680px;}
.button4, .button5{font-size: 40px}

.manin{font-size: 14px;}

#footer{ padding-bottom: 20px;
 background: url("../img/footer.jpg") no-repeat center bottom #fff}
.footBox{width: 1100px; margin: 0 auto}
#footer ul{width: 405px;    margin: 0; text-align: left;}
#footer ul li:first-child{font-size: 20px}
address{ color: #cc8092; font-size: 14px; text-align: left; padding-top: 60px}

#footer ul.footbtn{width: 1000px; margin: 0 auto 100px; display: flex}
#footer ul.footbtn li:first-child, #footer .footbtn li{width: 48%}

.pcno{display: none !important}
.rotate_a{height: auto}
img{height: auto; }

#logo_loader { text-align: center; padding: 25% 0;}

.bookBox .slider img{width: 100%!important}

#main{line-height: 1.8}

/*このクラスが付与されると表示する*/
.ftbtn .active{
  opacity: 1;
  visibility: visible;
}
.kotei{font-size: 5.3333333333vw;
  position: fixed;
  right: 0;
  top: 5%;
  color: #fff;
  padding: 5px;
  transition: .3s;
background: rgb(254,244,232);
background: linear-gradient(45deg, rgba(254,244,232,1) 0%, rgba(253,182,198,1) 100%);
  
  /*デフォルトで非表示にする*/
  opacity: 0;
  visibility: hidden;
  z-index: 88;
}
.kotei .button1{ border: 1px solid #fff;font-size:24px;
    box-sizing: border-box;font-family: 'Noto Sans JP', sans-serif;
    display: grid;
  text-align:center;padding: 30px 10px;
  color:#fff;
background: rgb(254,244,232);
background: linear-gradient(45deg, rgba(255,219,219,1) 0%, rgba(253,182,198,1) 100%);
line-height: 1em;
  -webkit-writing-mode: vertical-rl;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  -ms-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
		
}

.kotei .button2{ border: 1px solid #fff;font-size:24px;
    box-sizing: border-box;font-family: 'Noto Sans JP', sans-serif;
    display: grid;
  text-align:center;padding: 30px 10px;
  color:#fff;
background: rgb(254,244,232);
background: linear-gradient(45deg, rgba(255,222,218,1) 0%, rgba(248,180,180,1) 100%);
line-height: 1em;
  -webkit-writing-mode: vertical-rl;
  -moz-writing-mode: vertical-rl;
  -ms-writing-mode: tb-rl;
  -ms-writing-mode: vertical-rl;
  writing-mode: vertical-rl;
		
}
}