@charset "utf-8";


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

default

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

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure,
footer, header, hgroup, menu, nav, section, summary,
time, mark, audio, video {
   margin: 0;
   padding: 0;
   border: 0;
   outline: 0;
   font-size: 100%;
   vertical-align: baseline;
   background: transparent;
   font-weight:normal;
   font-style: normal
}
article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
main,
menu,
nav,
section,
time {
  display: block; }

ol,
ul {
  list-style: none; }

a{text-decoration: none; color:#000; transition: 0.3s}
a:hover{ color:#E9B6B6; opacity: 0.5 }



.youtubebg{margin: 0px 8% 0; text-align: center ; padding-top: 20px}
.youtubebg img{width: 300px; }
.youtube {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.youtubebg .tira{font-size:16px; z-index: 5; position: relative; margin-top: -10px; padding-bottom: 10px}
.youtubebg .tira img{width:18px; }
.youtubebg .tira img {
  animation: floating-y 1.8s ease-in-out infinite alternate-reverse;
}
@keyframes floating-y {
  0% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(20px);
  }
}

.min{font-family: 'Zen Old Mincho', serif; font-weight:700 }
.en {font-family: 'Cinzel Decorative', cursive;}
.imp{font-weight: bold}
.pink{color:#cc8092 }
.red{color: #d28b8b}
.gosi{font-family: 'Noto Sans JP', sans-serif;}

.tC{text-align: center;}
.tR {text-align: right;}

.line{background: linear-gradient(transparent 70%, #eee5d3 70%); font-weight: 700}

body{font-family: 'Noto Sans JP', sans-serif; color:#4b474d; 
 font-size: 3.4666666667vw; letter-spacing: 1px; line-height: 2em; }
 
 .animated {
  -webkit-animation-duration: 2s;
  animation-duration: 2s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

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

.sen{background: url("../img/line.png") repeat-x; background-size: 2px 8px;
	animation: border_anim 2s linear forwards; width: 100%; height: 8px; width: 0}
    


@keyframes border_anim {
	0%{
		width: 0%; opacity: 0
	}
	10%{
		width: 10%; opacity: 1
	}    
	100%{
		width: 100%; opacity: 1
	}
}


@keyframes bounceIn {
  0% {
    opacity: 0;
    -webkit-transform: translateY(-60px);
    transform: translateY(-60px);
  }
  50% {
    opacity: 0.5;
        -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }  
  65% {
    opacity: 0.8;
        -webkit-transform: translateY(-10px);
    transform: translateY(-10px);
  }
  100% {
    opacity: 1;
        -webkit-transform: translateY(0px);
    transform: translateY(0px);
  }  
  
}

.bounceIn {
  -webkit-animation-name: bounceIn;
  animation-name: bounceIn;
    animation-duration: 1s;
}

.n-out{
  animation-name: n-out;
  animation-duration: 1.5s;
  animation-timing-function: ease;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes n-out {
  0% {opacity: 0;transform: scale(1);}
  50%{transform: scale(0.5);}
  100% {opacity: 1;transform: scale(1);}
}
.n-out2{
  animation-name: n-out2;
  animation-duration: 2s;
  animation-timing-function: ease;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes n-out2 {
  0% {opacity: 0;transform: scale(1);}
  50%{transform: scale(0.5);}
  100% {opacity: 1;transform: scale(1);}
}
.n-out3{
  animation-name: n-out3;
  animation-duration: 2.2s;
  animation-timing-function: ease;
  animation-delay: 0s;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}

@keyframes n-out3 {
  0% {opacity: 0;transform: scale(1);}
  50%{transform: scale(0.5);}
  100% {opacity: 1;transform: scale(1);}
}

.fadeInUp {
  -webkit-animation-name: fadeInUp;
  animation-name: fadeInUp;
}
@-webkit-keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }
}

@keyframes fadeInUp {
  0% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
  100% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }
}

.fadeInUpwl {
  -webkit-animation-name: fadeInUpwl;
  animation-name: fadeInUpwl;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 3s;
  animation-duration: 3s;  
}
@-webkit-keyframes fadeInUpwl {
  0% {
    opacity: 0;
-webkit-transform: translate(0, 20px) rotate(0);
transform: translate(0, 20px) rotate(0);
  }
  70% {
    opacity: 1;
-webkit-transform: translate(0, 0) rotate(0);
transform: translate(0, 0) rotate(0);
  }
  100% {
    opacity: 1;
-webkit-transform: translate(-5px, 0px) rotate(-15deg);
transform: translate(-5px, 0px) rotate(-15deg);
  }  
}
@keyframes fadeInUpwl {
  0% {
    opacity: 0;
-webkit-transform: translate(0, 20px) rotate(0);
transform: translate(0, 20px) rotate(0);
  }
  70% {
    opacity: 1;
-webkit-transform: translate(0, 0) rotate(0);
transform: translate(0, 0) rotate(0);
  }
  100% {
    opacity: 1;
-webkit-transform: translate(-5px, 0px) rotate(-15deg);
transform: translate(-5px, 0px) rotate(-15deg);
  }  
}

.fadeInUpwr {
  -webkit-animation-name: fadeInUpwr;
  animation-name: fadeInUpwr;
  animation-fill-mode: forwards;
  -webkit-animation-duration: 3s;
  animation-duration: 3s;
}
@-webkit-keyframes fadeInUpwr {
  0% {
    opacity: 0;
    -webkit-transform: translate(0, 20px) rotate(0);
    transform: translate(0, 20px) rotate(0);
  }
  70% {
    opacity: 1;
    -webkit-transform: translate(0, 0) rotate(0deg);
    transform: translate(0, 0) rotate(0deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(5px, 0) rotate(15deg);
    transform: translate(5px, 0) rotate(15deg);
  }  
}
@keyframes fadeInUpwr {
  0% {
    opacity: 0;
    -webkit-transform: translate(0, 20px) rotate(0);
    transform: translate(0, 20px) rotate(0);
  }
  70% {
    opacity: 1;
    -webkit-transform: translate(0, 0) rotate(0deg);
    transform: translate(0, 0) rotate(0deg);
  }
  100% {
    opacity: 1;
    -webkit-transform: translate(5px, 0) rotate(15deg);
    transform: translate(5px, 0) rotate(15deg);
  }  
}

.fadeInUpkai {
  -webkit-animation-name: fadeInUpkai;
  animation-name: fadeInUpkai;
    -webkit-animation-duration: 3s;
  animation-duration: 3s;
 
}
@-webkit-keyframes fadeInUpkai {
  0% {
    opacity: 0;
    -webkit-transform: translate(0, 20px) rotate(0);
    transform: translate(0, 20px) rotate(0);
  }
  50% {
    opacity: 1;
    -webkit-transform: translate(0, 0) rotate(0deg);
    transform: translate(0, 0) rotate(0deg);
  }
  70% {
    -webkit-transform: translate(0, 0) rotate(10deg);
    transform: translate(0, 0) rotate(10deg);
  }
  80% {
    -webkit-transform: translate(0, 0) rotate(-10deg);
    transform: translate(0, 0) rotate(-10deg);
  }
  90% {
    -webkit-transform: translate(0, 0) rotate(10deg);
    transform: translate(0, 0) rotate(10deg);
  }
   100% {
    -webkit-transform: translate(0, 0) rotate(0deg);
    transform: translate(0, 0) rotate(0deg);
  }  
}


@keyframes fadeInUpkai {
  0% {
    opacity: 0;
    -webkit-transform: translate(0, 20px) rotate(0);
    transform: translate(0, 20px) rotate(0);
  }
  50% {
    opacity: 1;
    -webkit-transform: translate(0, 0) rotate(0deg);
    transform: translate(0, 0) rotate(0deg);
  }
  70% {
    -webkit-transform: translate(0, 0) rotate(10deg);
    transform: translate(0, 0) rotate(10deg);
  }
  80% {
    -webkit-transform: translate(0, 0) rotate(-10deg);
    transform: translate(0, 0) rotate(-10deg);
  }
  90% {
    -webkit-transform: translate(0, 0) rotate(10deg);
    transform: translate(0, 0) rotate(10deg);
  }
   100% {
    -webkit-transform: translate(0, 0) rotate(0deg);
    transform: translate(0, 0) rotate(0deg);
  }  
}

/*ボタン*/
/*丸がボタンに変形する*/
.btntransform{
    /*丸の基点とするためrelativeを指定*/
	position: relative;
    /*ボタンの形状*/	
    display: inline-block;
	padding:0 0 0 15px;
	line-height: 50px;
    color: #333;
    text-decoration: none;
    outline: none;
}

/* 丸が動く */
.btntransform::before{
	content:'';
    /*絶対配置で丸の位置を決める*/
	position:absolute;
	left:0;
    /*丸の形状*/
	width:50px;
	height:50px;
	background:#ffd4d4;
	border-radius:25px;
    /*アニメーションの指定*/
    transition:.3s ease-out;
}
.btntransform span{    z-index: 1; position: relative;}
/*hoverした際の形状*/
.btntransform:hover::before{
	width:110%;
}

/* 矢印の形状 */
.btntransform::after{
	position: absolute;
    content: '';
    top: 22px;
    right: -15px;
    width: 5px;
    height: 5px;
    border-top: 1px solid #000;
    border-right: 1px solid #000;
    transform: rotate(45deg);
}

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

.背景

-------------------------------*/
#your-element-selector{
  height:100vh;
  width: 100%;
  position: fixed; z-index:-1
}
/*-------------------------------

firstflex

-------------------------------*/
.headBox{ position: relative}
.headflex{padding: 40px 8% 0; margin-bottom: 50px;}
.headtext { position: relative}
.headflex h1{ margin:10px 10px 0;}

.headimg { position: relative; margin-top:-20px;}
.headimg .text0{width: 100%; color:#cd7878; letter-spacing: -2px; position: absolute; top:-10px; z-index: 3; text-align: center;
font-size:clamp(1.125rem, 0.75rem + 1.88vw, 1.5rem) }/*18-24*/
.headimg .text0 span{font-weight: 700 ; font-size:clamp(1.375rem, 1rem + 1.88vw, 1.75rem) }/*22-28*/
.headflex .i01{ position: absolute; left:-3%; bottom: -80%}
.headflex .i02{ position: absolute; right: 10%; top: -30%}
.headflex .i03{ position: absolute; right: 0; top:60% }
.headflex .i01 img, .headflex .i03 img{width:54px }
.headflex .i02 img{width:26px }

.headflex .medal{position: absolute; bottom: 22%; width:30%; right: 3%}

.last-text{position: absolute; bottom: -16%; z-index: 5; }
.last-text p{font-size: 10px; line-height: 1.3; padding:0 5% 0 8%; letter-spacing: normal; color: #919191}

.firstflex{padding-top: 180px; text-align: center; background: url("../img/lp/bg_b.png") no-repeat right 20%;background-size:35%; position: relative ;}
.firstflex .last{position: relative}
.firstflex .last .ltext01{margin: 0 10% 0 25%}
.firstflex .last .ltext01 img{max-width:446px }
.firstflex .last .ltext02{position: absolute; left: 8%; bottom:-28px }
.firstflex .last .ltext02 img{max-width:102px ; width:80%}

.firstflex .madBox{ background: url("../img/lp/wel.png") no-repeat center 54%; background-size: contain}
.firstflex .t01{font-size: 5.3333333333vw; padding: 20px 0 10px; line-height:1.8 ; letter-spacing: normal }
.firstflex .t02{font-size: 5.3333333333vw; padding: 0px; line-height:1.8; letter-spacing: normal}
.logob{width:250px; margin: 30px auto 10px; position: relative;}
.logob .p01{width: 124px; position: absolute; left: 50%; top: 42px; margin-left: -67px}
.logob .p02{width: 158px; position: absolute; left: 50%; top: 135px; margin-left: -85px}
.logob .p03{width: 54px; position: absolute; left: 55%; top: 0px; margin-left: 45%;}

.logob .i01{ position: absolute; left:-3%; top: -5%}
.logob .i02{ position: absolute; left: -9%; top: 98%}
.logob .i03{ position: absolute; right: -10%; bottom:5% }
.logob .i04{ position: absolute; right: -5%; top:20% }
.logob .i01 img{width:54px }
.logob .i02 img, .logob .i03 img{width:26px }
.logob .i04 img{width:32px }

.firstflex .t03{ letter-spacing: normal; font-size: 4.8vw; padding-bottom: 80px ; line-height: 1.8;}
.firstflex .t03 span{font-size: 6vw; font-weight: 700}

.firstflex .w01{width: 50%; margin-right: 40%; margin-left: 0; margin-bottom: 100px}
.firstflex .w02{ position: absolute; width: 38%; left: 57%; bottom: 15%}
.firstflex .w03{ position: absolute; width: 30%; left: 50%; bottom: 7%}

.firstflex .i01a{ position: absolute; left:8%; bottom: 2%; width: 54px}

.headtext p.text0 {
  position: relative;
  display: inline;
  font-size: 6.2vw;
  font-weight: 500;
  line-height: 1.8;
  padding-bottom: 5px;
  border-bottom: 1px solid #948673;
  z-index: 2;
}

p.text0.fv-txt2 {
    font-size: 5vw;
    font-weight: 500;
    line-height: 1.6;
    text-align: center;
    color: #948673;
}
p.text0.fv-txt2 span {
    font-size: 1.2em;
}

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

.leadBox

-------------------------------*/
.leadBox {
    position: relative;
    padding: 150px 0 160px;
    height: auto;
    background: url(../img/lp/lead_bg.png) no-repeat center;
    text-align: center;
    background-size: 560px;
    overflow-x: hidden;
    overflow-y: visible;
}
img.lead_txt {
    width: 80vw;
}
.leadBox img.deco {
    width: 50px;
    display: block;
    margin: 15px auto 20px;
}
.leadBox p.text01 {
    font-weight: 500;
    font-size: 16px;
    line-height: 1.8;
    margin-bottom: 10px;
}
img.lead_bg_left {
    position: absolute;
    width: 50vw;
    top: 20px;
    left: -50px;
    z-index: -1;
}
img.lead_bg_right {
    position: absolute;
    width: 50vw;
    bottom: 0;
    right: -50px;
    z-index: 0;
}
.leadBox p.i01 {width: 50px;position: absolute;top: 13%;right: 30px;}
.leadBox p.i02 {width: 30px;position: absolute;top: 33%;right: 0;}
.leadBox p.i03 {position: absolute;bottom: 25px;left: 0;}


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

.achBox

-------------------------------*/
.achBox{text-align: center;  position: relative; background: #fff; padding-bottom: 40px; }
.achBox .h2waku{margin-top: -8%}
.achBox h2{font-family: 'Zen Old Mincho', serif; font-weight:900; font-size: 8vw; 
display: inline-block; padding: 0 20px; line-height: 1.2; background: url("../img/touka.png") repeat; position: relative; z-index: 1; margin-bottom: 10px;}
.achBox h2 span{font-size: 4.6vw; display: block; font-weight: 700; margin-top: -20px; padding-bottom: 5px}

.achflex{margin: 20px 5% 0; display: flex; justify-content:space-between }
.achflex .achl{width: 47%}
.achflex .achl img:last-of-type {margin-top: 10px} 

.achflex .achr{width: 47%; margin-top: -10px}
.achflex .achr img:last-of-type {margin-top: 10px} 

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

1,000人以上の

-------------------------------*/
.thouBox{margin: 70px 0 0; background: url("../img/lp/top.jpg") no-repeat center top ; text-align: center; background-size: 2600px 100%}
.thouBox .toprated{margin-top: -20px}
.thouBox .t05{padding: 32% 0 30px; position: relative; margin: 0 8% }
.thouBox .t05 img{ width:26px }
.thouBox .t05 .wakul{width:42px; position: absolute; left: 0; bottom: 5%}
.thouBox .t05 .wakur{width:42px; position: absolute; right: 0; bottom: 5%}
.thouBox .thouin{position: relative ; margin-top:  -20px ; padding-bottom: 80px }
.thouBox .thouin .metho{max-width:440px; width: 80% }
.thouBox .thouin .textBox{position:  absolute; top: 10px; font-size: 3.6vw; width: 100% }
.thouBox .thouin .textBox .text01{line-height: 1.5; margin-bottom: 10px; font-weight: 700; position: relative; display: inline-block; padding: 0 0 0 20px ; margin-left: -40%;}
.thouBox .thouin .textBox .text02 p{line-height: 1.5; font-weight: 700; position: relative; display: inline-block; padding: 0 10px 0 0px ; margin-left: 25%; margin-right: 10px}
.thouBox .thouin .textBox .text01::before ,
.thouBox .thouin .textBox .text02 p::before {
      content: "";
      position: absolute;
      bottom: -6px;
      left: 50%;
      width: 100%;
      height: 100%;
      box-sizing: border-box;
      border-left: 1px solid #c87e7e; border-bottom: 1px solid #c87e7e;
      border-top: none;
      border-bottom-left-radius: 10px; /* 右下の角丸 */
      translate: -50%;
    }
.thouBox .thouin .textBox .text01::after,
.thouBox .thouin .textBox .text02 p::after{
      content: "";
      position: absolute;
      top: calc(100% + 8px); /* フキダシのサイズに応じて調整してください */
      left: 50%;
      width: 15px;
      height: 1px;
      box-sizing: border-box;
      background-color: #c87e7e;
      box-shadow: 0 2px 0 #ffffff, 0 -2px 0 #ffffff;
      rotate: 90deg;
      translate: -50%;
    }
.thouBox .thouin .textBox .text02 p::before{border-left: none; border-right: 1px solid #c87e7e;
border-bottom-right-radius: 10px; border-bottom-left-radius: 0px; }

.thouBox .thouin .textBox .text03{margin: 10px 0 20px}


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

.triangleBox

-------------------------------*/
.triangleBox h2 {
    font-size: 4.5vw;
    font-weight: 500;
    background: #fff;
    padding: 0 5px;
    letter-spacing: 3px;
}

.triangleBox {
    background: #fbf6f6;
    padding: 50px 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 20px;
}

.triangleBox h2 span {
    color: #e58888;
}

.triangleBox img {
    width: 100%;
    height: auto;
}

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

.lessonBox

-------------------------------*/
.lessonBox{text-align: center;  position: relative; background: #fff; margin-top:50px; padding-bottom: 50px; }
.lessonBox .h2waku{margin-top: -15%}
.lessonBox h2{font-family: 'Zen Old Mincho', serif; font-weight:500; font-size: 7vw; 
display: inline-block; padding: 0 20px; line-height: 1.2; background: url("../img/touka.png") repeat; position: relative; z-index: 1; margin-bottom: 30px;}
.lessonBox h2 span {font-size: .8em;}
.lessonBox h2 img{ width: 58px; margin-right: 10px; margin-right: 8px}
.lessonBox .listBox{ margin: 20px 8% 0}
.lessonBox .listBox li{border: 1px solid #c0b494; padding: 10px 4% 20px; position: relative; margin-bottom: 40px}
.lessonBox .waku{background: url("../img/lp/bgw.jpg") no-repeat left top}
.lessonBox h3{ color: #d28b8b; padding:5px 0 10px; font-size: 5.4vw;}
.lessonBox li:first-child h3 {letter-spacing: normal}
.lessonBox .listBox .comel li{border: none; padding: 0 0 8px 20px; background: url("../img/lp/list.png") no-repeat left 2px; background-size: 14px 14px; line-height: 1.4; text-align: left; margin-bottom: 0; letter-spacing: normal}
.lessonBox .nomber{width: 78px; position: absolute; left: 0; top: -30px}

.lessonBox .i01{width: 54px; position: absolute; top:3%; right: 4% }
.lessonBox .i02{width: 26px; position: absolute; top:5%; right: 2% }
.lessonBox .i03{width: 26px; position: absolute; top:28%; right: 10% }
.lessonBox .i04{width: 26px; position: absolute; top:51%; right: 15% }
.lessonBox .i05{width: 32px; position: absolute; bottom:-0.5%; right: 15% }
.lessonBox .i06{width: 36px; position: absolute; bottom:0; right: 8% }

.movieBox dl {
    display: flex;
    flex-direction: column-reverse;
}

.movie_txt p {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.8;
}
.movie_txt {
    position: relative;
    margin: 40px 8% 60px;
    padding: 15px 10px;
    border: 1px solid #D28B8B;
}
.movie_txt::after {
    position: absolute;
    content: '';
    display: block;
    width: 45px;
    height: 37px;
    background: url(../img/lp/movie_fukidashi.svg);
    top: -23px;
    right: 47%;
    left: auto;
    transform: rotate(-90deg);
}

.movie-box iframe#demo-1 {
    width: 100%;
    height: auto;
    aspect-ratio: 16 / 9;
}

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

.pointBox

-------------------------------*/
.vocBox {
    font-size: 15px;
    color: #c87e7e;
}

.vocBox p.text01 {line-height: 1.5;font-weight: 500;position: relative;display: inline-block;padding: 0 0 0 20px;margin-left: -20%;margin-bottom: 25px;}

.vocBox p.text02 {line-height: 1.5;font-weight: 700;position: relative;display: inline-block;padding: 0 10px 0 0px;margin-left: 20%;margin-right: 10px;}

.vocBox p.text01::before,
.vocBox .text02 p::before {
    content: "";
    position: absolute;
    bottom: -6px;
    left: 50%;
    width: 100%;
    height: 100%;
    box-sizing: border-box;
    border-left: 1px solid #c87e7e;
    border-bottom: 1px solid #c87e7e;
    border-top: none;
    border-bottom-left-radius: 10px;
    translate: -50%;
}

.vocBox .text02 p {
    line-height: 1.5;
    font-weight: 500;
    position: relative;
    display: inline-block;
    padding: 0 10px 0 0;
    margin-left: 20%;
    margin-right: 10px;
    margin-bottom: 25px;
}

.vocBox .text02 p::before {
    border-left: none;
    border-right: 1px solid #c87e7e;
    border-bottom-right-radius: 10px;
    border-bottom-left-radius: 0px;
}

.vocBox p.text01::after,
.vocBox .text02 p::after {
    content: "";
    position: absolute;
    top: calc(100% + 8px);
    left: 50%;
    width: 15px;
    height: 1px;
    box-sizing: border-box;
    background-color: #c87e7e;
    box-shadow: 0 2px 0 #ffffff, 0 -2px 0 #ffffff;
    rotate: 90deg;
    translate: -50%;
}

.pointBox img.h2-icon {
    display: block;
    width: 50px;
    margin: 30px auto 10px;
}

.pointBox .point-txt h3 img {
    width: 15vw;
}

.pointBox h2 {
    font-size: 7vw;
    font-weight: 500;
    text-align: center;
    margin-bottom: 30px;
    background: url(../img/lp/point.svg) no-repeat left top;
    text-align: center;
    background-size: 50vw;
}

.pointBox h2 span {
    font-size: 18px;
    line-height: 2.6;
}

.point-list h3 {
    display: flex;
    gap: 10px;
    align-items: center;
    font-size: 5vw;
    font-weight: 700;
    margin-bottom: 10px;
}

.point-list p.text01 {
    font-size: 4vw;
    font-weight: 700;
    line-height: 1.6;
}

.point-list>li {
    margin: 0 8% 50px;
    display: flex;
    flex-direction: column-reverse;
    gap: 10px;
}

.pointBox .cp_actab {
    border: none;
}

.point-list .cp_actab label {
    margin-top: 10px;
    background: none;
    text-align: center;
    background-color: #DE9C9D;
    color: #fff;
    font-weight: 500;
}

.point-list .cp_actab label {
    margin-top: 10px;
    background: none;
    text-align: center;
    background-color: #DE9C9D;
    color: #fff;
    font-weight: 500;
}

.pointBox .cp_actab label::before {
    color: #fff;
}

.pointBox .cp_actab input[type=checkbox] + label::after {
    color: #fff;
}

.pointBox .cp_actab .cp_actab-content {
    background: #F9F2F2;
}

ul.service-list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    padding-top: 10px;
    margin-bottom: 10px;
}

ul.service-list li {
    width: 33%;
    text-align: center;
}

.service-list .cp_actab .cp_actab-content p {
    font-weight: 500;
    padding: 0!important;
    background: none;
    text-align: center;
}

.mynote {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    margin-bottom: 20px;
}
.mynote-txt {
    text-align: center;
}
.mynote img {
    width: 45%;
}
.cp_actab .cp_actab-content p.text01 {
    background: #DE9C9D;
    padding: 0 6px !important;
    color: #fff;
    font-weight: 300;
}
.cp_actab .cp_actab-content p.text02 {
    font-size: 6vw;
    color: #DE9C9D;
    padding: 0 !important;
    background: none;
}

.cp_actab .cp_actab-content p.text03 {
    font-size: 5vw;
    line-height: 1;
    padding: 0 !important;
    background: 0;
    font-weight: 500;
}

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

.aboutBox

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

.aboutBox{ padding: 0 0 40px; text-align: center; background: url("../img/lp/bgen.png") no-repeat center top; background-size: 130% 4%; position: relative}
.aboutBox h2 {letter-spacing: -1px;
    font-family: 'Zen Old Mincho', serif;
    font-weight: 500; line-height: 1.4;
    font-size: 7vw; margin-bottom: 10px;}
.aboutBox h2 .i02 {
    width: 80px;
    margin-right: 3px;
}
.aboutBox dd{text-align: left;}
.aboutBox h3{font-size: 5.3333333333vw; padding: 20px 0; font-weight: 900; background: url("../img/ab.png") no-repeat top left; background-size:contain}
.aboutBox h3 span{font-size: 3.2vw; display: block}
.aboutBox .text01{margin: 0 8%; letter-spacing: normal; font-size: 3.5vw; line-height: 1.8; padding-top: 20px;font-weight: 500;}
.aboutBox .text01 span{display: inline-block; padding: 20px 0 0px; margin:0 auto 70px; font-weight: 700; text-align: center; background: url("../img/lp/line01.png") no-repeat bottom center; background-size:contain;  font-size: 5.6vw; line-height: 1.4;}
.aboutBox .text01 i{font-weight: 900; text-align: left; display: block}
.aboutBox .medi{background: url("../img/touka.png") repeat; padding:0 10px 20px; position: relative; margin-bottom: 20px; border-radius: 0 100px 0 0}
.aboutBox .text02{margin:0 0 0 8%;  font-weight: 900; position: absolute; left: 10px; top: -15px}
.aboutBox ul{padding-top: 20px}
.aboutBox li{padding: 0 5px}
.aboutBox .text03{margin: 0 8%; letter-spacing: normal;
    font-size: 2.9333333333vw;
    padding-top: 20px;
    line-height: 1.7;}
.aboutBox .text03 span{display: block; padding: 8px 0}
.aboutBox .alink{text-align: right; margin-right: 8%}
.aboutBox .i01{width: 54px; position: absolute; bottom:23%; right: 6% }

.aboutBox .text01.fs_XL {
    font-size: 6vw;
    font-weight: 500;
    letter-spacing: 0.05em;
    line-height: 1.6;
}
.aboutBox .text01.sign span {
    background: none;
    font-weight: 500;
    padding: 0 0 0 5px;
    margin: 0;
}

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

.contBox

-------------------------------*/
.spBox{padding-top: 60px; background: #fff}
.supBox{background: #fff; text-align: center}
.supBox a{ color:#fe7272 }
.supBox p{text-align: center; padding-bottom: 20px;}
.supBox h2{font-family: 'Zen Old Mincho', serif; font-weight:900; font-size: 6.6vw; 
display: inline-block; padding: 0 20px; line-height: 1.2; background: url("../img/touka.png") repeat; position: relative; z-index: 1; margin-bottom: 10px; letter-spacing: -1px}
.supBox h2 img{ width: 82px; margin-right: 10px; margin-right: 8px}
.supBox .h2waku { margin-top: -5%;}

.contBox{padding: 0px 8%; text-align: center; background: #fff}
.contBox .img01 img, #TraBox .img01 img{ width:68px; margin-bottom: 10px; padding-top: 20px }
.contBox .text01{margin-top: -10px; font-size: 8vw;}
.contBox h2{font-size: 3.2vw; line-height: 1.8; margin: 10px 0 20px;}

.contBox li{margin-bottom: 40px}
.contBox li:last-child{margin-bottom: 0px}
.contBox dd{position: relative}
.contBox .text01a{ font-size: 2.6666666667vw; background:#fdf4f4 ; position: absolute; left: -20px; top: 20px; line-height: 1; padding: 0 10px;  }

#supp, #sur{background: url("../img/lp/mado1.jpg") no-repeat center top; background-size:80%; position: relative}
#supp .text01a{left: -25px}
#sur .text01a{left: -50px}

.contBox li:last-child{padding-bottom: 50px;}


.contBox .pic02 { background: url("../img/lp/fuki.png") no-repeat center bottom; padding-bottom: 25px; background-size:212px 59px; min-width: 212px; line-height: 1.4;}
.contBox h3{font-size: 5.3333333333vw; margin: 0 0 11px; color: #d28b8b}
.contBox .come{text-align: left}

#supp .i01{width: 54px; position: absolute; top:0; left: 4% }
#supp .i02{width: 26px; position: absolute; top:2%; right: 2% }
#supp .i03{width: 36px; position: absolute; top:3%; right: 4% }
#supp .i04{width: 26px; position: absolute; top:44%; right: 15% }
#supp .i05{width: 54px; position: absolute; top:50%; right: 4% }
#supp .i06{width: 26px; position: absolute; top:89%; right: 8% }

#sur .i01{width: 54px; position: absolute; top:0; left: 4% }
#sur .i02{width: 26px; position: absolute; top:2%; right: 2% }
#sur .i03{width: 36px; position: absolute; top:3%; right: 4% }


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

TraBox

-------------------------------*/
#TraBox{ background: url("../img/lp/bg_sp.png") no-repeat right 92% #fff; background-size: 50%; position: relative}
.TraBoxbg{background: url("../img/lp/mado1.jpg") no-repeat center top; background-size:80%; padding: 0px 8% ; text-align: center}
#TraBox h2{font-size: 3.2vw; line-height: 1.8; margin: 10px 0 20px;}
#TraBox .text01{margin-top: -10px; font-size: 7vw;}

#TraBox ul{ margin: 20px 0 0; display: flex; justify-content: space-between; flex-wrap: wrap }
#TraBox ul li{ width: 45%;  padding-bottom: 20px}
#TraBox ul .old{font-size: 2.9333333333vw;}
#TraBox ul .old img{width:9px }
#TraBox .pic0 img{border-radius: 90px 90px 0 0}
#TraBox h3{text-align: left; line-height: 1.7; font-size: 3.2vw;}
#TraBox .love{font-size: 4.8vw; letter-spacing: normal; padding-bottom: 5px }

#TraBox .i01{width: 54px; position: absolute; bottom:22%; right: 20% }
#TraBox .i02{width: 26px; position: absolute; bottom:10%; right: 10% }
#TraBox .i03{width: 36px; position: absolute; bottom:8%; right: 16% }
/*-------------------------------

flowwaku

-------------------------------*/
.flowBoxbg{ background: url(../img/support/su.png) no-repeat -10% 0px #fff; padding-top: 30px; background-size: 30%; margin-bottom: 80px}
.flowwaku{border: 1px solid #fbdada; padding: 10px}
.flowBox{text-align: center; background: url( "../img/support/flowbg.png") repeat; padding: 40px 0;}
.flowBox .h2waku{margin-top: -5%}
.flowBox h2{font-family: 'Zen Old Mincho', serif; font-weight:900; font-size: 6.5vw; background: url("../img/touka.png") repeat; letter-spacing: 3px; margin-bottom: 20px;
display: inline-block; padding: 0 20px; position: relative; z-index: 1}

.flowcontflex{display: flex; justify-content: space-between }

.flowBoxbg .midashi{background: #fef7f7}
.flowcontl .midashi img{ width:124px }
.flowcont .midashi img{ width:158px }

.flowcontl .text0{font-size: 3.7333333333vw; letter-spacing: -1px; font-weight: 900}
.flowcont .text0{font-weight: 900; font-size: 4vw; letter-spacing: -1px}
.flowcont .gosi{ font-size: 3.2vw;}

.flowcontl , .flowcont{background: url("../img/support/line.png") repeat-y 3% top; background-size: 27px 2px; width: 50%}
.flowBox dl{display: flex; justify-content: space-between; margin: 0 10px}
.flowBox dt {width: 15%; box-sizing: border-box; padding: 15px 0 10px; text-align: left;}
.flowBox dt img{ width: 27px}
.flowBox dd{width: 85%; box-sizing: border-box;
    font-size: 4.8vw;
    font-weight: 900;
    text-align: left;
     padding: 15px 0 10px;
    border-bottom: 1px solid #cac6c6; position: relative}
.flowBox dd .ya{width:19px; vertical-align: middle; margin-top: -5px; }

.flowBox dd .pic img{width: 100%}
.flowBox dd .pic{ position: absolute; width:30% ; top: -5%; left: 78%; }
.flowBox dl:nth-of-type(5) dd .pic{ width: 60%; top: 22%; left: 50%;}
.flowBox dl:nth-of-type(7) dd .pic{ width: 40%; top: 11%; left: 42%;}
.flowBox dl:nth-of-type(7) dd .pic2{  width: 65%; top: 55%; left: 50%; position: absolute;}
.flowBox dl:nth-of-type(9) dd .pic{ width: 55%; top: 25%; left: 40%;}

.flowBox a{display: inline-block}

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

.voieBox

-------------------------------*/
.voieBox{text-align: center; background: #fff;padding-top: 10px; position: relative}
.voieBox h2{padding: 0 5%}
.voieBox ul{ margin: 20px 0 0; text-align: left}
.voieBox ul li{ width: 46%;  padding-bottom: 30px}
.voieBox .slick-slide{
  padding: 0px 10px;
}


.voieBox ul .old{font-size: 2.9333333333vw;}
.voieBox ul .old img{width:9px }
.voieBox h3{text-align: left; line-height: 1.7; font-size: 3.2vw;}
.voieBox .love{font-size: 2.6666666667vw; letter-spacing: normal; }
.voieBox .love img{width:9px; display: inline-block}
.voieBox .love img:last-child{padding-left: 10px}

.voieBox .i01{width: 54px; position: absolute; top:0; left: 4% }
.voieBox .i02{width: 26px; position: absolute; top:2%; right: 12% }
.voieBox .i03{width: 36px; position: absolute; bottom:0%; right: 4% }

.voieBox img.divorce0 {
    width: 25vw;
    position: absolute;
    z-index: 2;
    top: 25%;
    right: 6px;
}
/*-------------------------------

.qaBox

-------------------------------*/
.qaBox{text-align: center; padding-top: 10px;}
.qaBox .h2waku{margin-top: -8%}
.qaBox h2{font-family: 'Zen Old Mincho', serif; font-weight:900; font-size: 7vw; background: url("../img/touka.png") repeat; position: relative; z-index: 1 ;
display: inline-block; padding: 0 20px; line-height: 1.2; margin-bottom: 20px;} 
.qaBox h2 .i01{ width:20px; margin-right: 8px }

.qaBox{ padding: 70px 8% 60px; background: #fff; text-align: center}
.qaBox .timg{text-align: center; padding: 0 10px }
.qaBox .timg img{width: 132px}


.cp_actab {text-align: left;border-bottom: 1px solid #eaeaea;
	position: relative;
	overflow: hidden;
	max-width:830px;
	margin: 0 auto 1px; background:#fff;
  font-size: 3.4666666667vw;
}
.cp_actab input {
	position: absolute;
	z-index: -1;
	opacity: 0;
}
.cp_actab label {
	font-weight: 900;
	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 18px; background-size: 20px
}
.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 {font-size: 3.2vw; font-weight: 900;
	margin: 0; padding:20px 20px 20px 45px !important; line-height:1.8em;
	background: url("../img/a.png") no-repeat 12px 25px #fff2f2; background-size: 20px
}
.cp_actab .cp_actab-content p span{font-weight: 900}

/* :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: 35px;
	height: 3em;
	-webkit-transition: all 0.35s;
	transition: all 0.35s;
	text-align: center;color:#e6c3c3; 
}
.cp_actab input[type=checkbox] + label::after {
	content: '>';transform: rotate(90deg);
}
.cp_actab input[type=checkbox]:checked + label::after {
	transform: rotate(-90deg);
}
.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;

}

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

.ctaBox

-------------------------------*/
.ctaBox {
    margin-top: 30px;
}
.ctaBox p.text01 {
    font-size: 3.5vw;
    margin-bottom: 20px;
    line-height: 1.6;
}
.ctaBox p.text01.fs_L {
    font-size: 1.4em;
    font-weight: 500;
}

.ctaBox .contflexmll {
    margin-bottom: 20px;
}



.kotei{font-size: 4vw; font-weight: bold;
  position: fixed;
  bottom: 0;
  color: #fff;
  cursor: pointer;
  transition: .3s;
  width: 100%;
  /*デフォルトで非表示にする*/
  opacity: 0;
  visibility: hidden;
  z-index: 88; text-align: center
}

/*このクラスが付与されると表示する*/
.ftbtn .active{
  opacity: 1;
  visibility: visible;
}


/*== footerボタン外の線が伸びる */

.cntb{margin: 0 10% 120px;  font-size: 7vw; text-align: center; position: relative}
.cntb a img{width:40px; margin-right: 8px; vertical-align: middle; margin-top: -5px  }
.cntb .i01{width: 54px; position: absolute; bottom:-30%; left: -10px }
.cntb .i02{width: 26px; position: absolute; top:-30%; right: -5% }
.cntb .i03{width: 36px; position: absolute; top:-50%; right: 8% }

.btnlinestretches{
    /*線の基点とするためrelativeを指定*/
  position:relative;
    /*ボタンの形状*/
  color:#fff; font-weight: 900;
  border:1px solid #d6ba95;
    padding: 30px; 
  display:inline-block;
    text-decoration: none;
    outline: none;
    background: #d6ba95;
    /*アニメーションの指定*/
  transition:all 0.3s ease-in-out;
  width: 80%
}

/*hoverした際の背景の形状*/
.btnlinestretches:hover{
  background:#fab6b6;
  color: #fff;
  border-color:transparent;
}

/*線の設定*/
.btnlinestretches::before,
.btnlinestretches::after {
  content:'';
    /*絶対配置で線の位置を決める*/   
  position:absolute;
  border:solid #d6ba95;
  width:10px;
  height:10px;
    /*アニメーションの指定*/
  transition:all 0.3s ease-in-out;
}

/*線の位置と形状*/
.btnlinestretches::before{
  top:-6px;
  left:-6px;
  border-width:1px 0 0 1px;
}

/*線の位置と形状*/
.btnlinestretches::after{
  bottom:-6px;
  right:-6px;
  border-width:0 1px 1px 0;
}

/*hoverした際の線の形状*/
.btnlinestretches:hover::before,
.btnlinestretches:hover::after{
  width:calc(100% + 11px);
  height:calc(100% + 11px);
  border-color:#d6ba95;
}
.headcont .btnlinestretches{ background: #fab6b6;   border: 1px solid #fab6b6;}
.headcont .btnlinestretches:hover::before,
.headcont .btnlinestretches:hover::after{border-color:#fab6b6;}
.headcont .btnlinestretches::before,
.headcont .btnlinestretches::after{border-color:#fab6b6;}
.headcont a:hover{opacity: 1}



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

.outBox

-------------------------------*/
.outBox{text-align: center; margin: 0 8%}
.outBoxbg {
    padding: 0 0 60px;
    text-align: center;
    background: url(../img/lp/bgen.png) no-repeat center top;
    background-size: 130% 4%;
}
.outBox h2 {
    font-family: 'Zen Old Mincho', serif;
    font-weight: 900;
    font-size: 7vw;
    display: inline-block;
    padding: 0 20px;
    line-height: 1.2;
    margin-bottom: 20px;
}

.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:#de9c9c; text-align: center; border-radius: 80px}
.outBox dd{line-height: 1.6;
    padding-top: 8px;
}
.outBox dd li{list-style: disc; margin: 0 0 5px 20px}
.outBox dd a{ color: #f01414}

.outflex img{width:164px }
.outfll .tokuten li:nth-child(4),.outfll .tokuten li:nth-child(5){ list-style: none; background: url("../img/lp/kome.png") no-repeat left 4px; background-size: 10px 10px; margin-left: 0; padding-left: 15px}
.outflr{margin-bottom: 0px}

#footer{background:#fab6b6; color: #fff }
.footBox{ text-align: center; margin: 0 8%; position: relative; padding-top: 70px;}
.footBox .paget{display: block;
    width: 80px;
    height: 80px;
    border-radius: 360px;
    background: #fab6b6; color: #fff;
    position: absolute;
    right: 0;
    top: -40px;
    font-size: 11px;
    line-height: 1;
    letter-spacing: normal;
    padding-top: 10px;}
.footBox .paget:hover{ opacity: 1; transform: translateY(10px); }    
.footBox .paget img{width:8px }
.footBox .priv{color: #fff; margin: 40px 0 50px;}
.footBox .priv a{display: block; color: #fff}
.footr .text01 img{width:147px }
.footr .text02{font-size: 3.2vw; line-height: 1.7;}
.footr .text02 span{display: block; padding-top: 10px; font-size: 2.9333333333vw;letter-spacing: normal}
.footr .text02 a{display: inline-block; padding: 0 10px; background: #fff; color:#de9c9c; font-weight: bold}

address{ font-size: 2.6666666667vw; letter-spacing: normal; padding: 60px 0 100px; line-height: 1.3;}



@media screen and (max-width: 639px) {
.smtno{display: none!important;}
img{width: 100%; height: auto}

body{  
 font-size: 3.4666666667vw;
}
.f30 {
  font-size: 30px;
  font-size: 8vw;
}

.f20 {
  font-size: 20px;
  font-size: 5.3333333333vw;
}

.f18 {
  font-size: 18px;
  font-size: 4.8vw;
}

.f16 {
  font-size: 16px;
  font-size: 4.2666666667vw;
}

.f15 {
  font-size: 15px;
  font-size: 4vw;
}

.f14 {
  font-size: 14px;
  font-size: 3.7333333333vw;
}


.f12 {
  font-size: 12px;
  font-size: 3.2vw;
}

.f11 {
  font-size: 11px;
  font-size: 2.9333333333vw;
}

.f10 {
  font-size: 10px;
  font-size: 2.6666666667vw;
}

.firstflex {
    padding-top: 0;
    text-align: center;
}

.contBox .text01a{transform:rotate(90deg);}

.flowcontl .midashi img { width: 80px;}
.flowcont .midashi img { width: 105px;}
.flowBox dt img { width: 15px;}
.flowcontl .text0{line-height: 1.4;}
.flowcont dt{padding-top: 19px}

.lessonBox .listBox li{padding: 8% 8% 20px;}
.lessonBox .listBox .comel li{font-size: 3.2vw;}

.contBox .pic02{font-size: 2.9333333333vw; font-weight: 900}
.contBox #supp li:nth-child(2n) .pic02{margin-top: 8px}
.contBox #supp li:nth-child(2n) .oma .pic02{margin-top: 0px}


.contBox .come{padding: 0 5%}

.kotei{ width: 100%; margin: 0 auto; font-size: 5.6vw; background: #fab6b6; box-shadow: 0 -5px 3px #eeeeee;}
.kotei a{ display: block;  color:#fff; line-height: 2.6; margin: 2px 2px 5px; border-bottom: none ;letter-spacing: 2px; width: 100%; 
}
.kotei dt{background: #fff; border-top: 5px solid #fab6b6; color: #fab6b6; line-height: 2.5;}
.kotei img{ width: 30px; vertical-align: middle; margin-top: -5px; margin-right: 5px}
.kotei dd li:last-child{border-left:1px solid #fff;}
.kotei dd li a{display: block; width: 100%}
.footBox .priv a{ border-bottom:1px solid #fff; padding: 5px 0}
.footr .text02{margin: 0 auto;}
address{padding-top:30px;}


}


@media screen and (min-width: 640px) {
body{ font-size:14px;}
img{height: auto; max-width: 100%}
.pcno{display: none!important;}



.youtubebg {
padding:0;
max-width: 550px;
margin: 0 auto
}

.p-mainvisual{background: none}

.whfull{height:100vh; overflow: hidden; min-height: 735px;}
.headBox{min-width: 1100px; margin: 0 auto}

.headflex{ text-align: right; position: relative; padding: 30px 30px 0}
.headtext{position: absolute; top: 17%; right: 5%}
.headtext p.text0{
  color: #363636;
  font-size: 36px;
  font-weight: 500;
  text-align: left;
  position: relative;
  z-index: 5;
  display: block;
  width: fit-content;
}
.headtext p.text0.smtno {
    border: none;
    color: #948673;
    font-size: 24px;
}

.headflex h1 {
    margin: 40px auto 20px 0;
    text-align: left;
}

.headimg {width: 73%; margin: 0 auto 0 0;}
.headimg img{width: 100%}

img.sub-copy.smtno {
    z-index: 5;
    position: relative;
    display: block;
}

.headflex .i01{ position: absolute; left:-15%; bottom: -10%}
.headflex .i02{ position: absolute; right: 8%; top: 22%}
.headflex .i03{ position: absolute; right: 0; top:-13% }

.headBox .last-text{position: absolute;
    top: 410px;
    z-index: 5;
    width: 580px;
    right: 5%;
}
.headimg .text0{width: 580px; top:30%; right: 5%; }

.headflex{ position: relative}
.firstflex .last .ltext02{left: 0}
.firstflex .last .ltext02 img{width: 100%}

.headflex .i04{ position: absolute; right: 10%; top: 56%}
.headflex .i04 img{width: 30px;}
.headflex .i05{ position: absolute; right: 4%; bottom:2%; z-index: 5}
.headflex .i05 img{width: 80px;}


.firstflex .i01a{ position: absolute; left:24%; bottom: 25%; width: 54px}
.firstflex .i02a{ position: absolute; left:22%; bottom: 22%; width: 36px}
.firstflex .i03a{ position: absolute; right:8%; bottom: 18%; width: 26px}
.firstflex .i04a{ position: absolute; right:11%; bottom: 12%; width: 54px}

.firstflex dl{display: flex; flex-direction:row; justify-content: space-between;align-items: center; width: 1000px; margin: 0 auto; position: relative}
.firstflex dt{width: 420px}
.firstflex dd{width: 500px}
.firstflex .last .ltext01{margin:40px 0 0 40px}
.firstflex .last .ltext01 img{max-width: 330px}
.youtubebg .toha{position: absolute; top: -100px; width: 380px; left: 50%; margin-left: -190px}
.youtubebg .toha img{width: 100%}
.firstflex .last .tira{padding-top: 10px; text-align: right; font-size: 18px; font-weight: bold}
.firstflex .last .tira img{ vertical-align: middle; animation: fluffy2 3s infinite;
}

@keyframes fluffy2 {
  0%, 100% {
    transform: translateX(0) rotate( -90deg );
  }
  50% {
    transform: translateX(-20px) rotate( -90deg );
  }
}
.firstflex .madBox{padding-bottom: 80px; background: url(../img/lp/wel.png) no-repeat center 48%;
    background-size: 446px 98px}

.firstflex {
        margin: 0 auto 100px;
        position: relative;
        background: url(../img/lp/lesson.svg) no-repeat left top;
        top: 0;
        padding-top: 30px;
}
.firstflex .t01{font-size: 30px; padding-top: 30px}
.firstflex .t02{font-size: 30px}
.logob{margin: 40px auto; width: 270px}
.firstflex .t03{font-size: 28px; padding-bottom: 50px;}
.firstflex .t03 span{font-size: 30px}

.firstflex .t04 ,.firstflex .t05{font-size: 16px}
.firstflex .t05{width: 580px; margin: 0 auto;}
.firstflex .w01 {
    position: absolute;
    width: 300px;
    margin-right: 0;
    margin-left: -580px;
    margin-bottom: 0;
    left: 50%;
    top: 770px;
}
.firstflex .w02 {
    position: absolute;
    width: 256px;
    left: 50%;
    bottom: 0;
    top: 810px;
    margin-left: 320px;
}
.firstflex .w03 {
    position: absolute;
    width: 203px;
    left: 50%;
    bottom: 0;
    margin-left: 300px;
    top: 1050px;
}

.movie_txt::after {
    transform: none;
    right: -27px;
    top: calc(50% - 25px);
}

.movie_txt p {
    font-size: 18px;
}

.firstflex dt {
    width: 500px;
    top: 50px;
    position: relative;
}

.logob .p03{left: 50%;}

.achflex{margin: 30px auto 0; width: 1000px}
.achBox .h2waku{margin-top: -50px}
.achBox h2 {font-size: 38px}
.achBox h2 span{font-size: 24px}
.achflex .achl img:last-of-type,
.achflex .achr img:last-of-type{ margin-top: 0px;}
.achflex .achl img:first-child{position: relative; top: -80px}
.achflex .achr img:first-child{position: relative; top: -60px}

.triangleBox {
    gap: 30px;
    margin-bottom: 20px;
}
.triangleBox h2 {
    font-size: 32px;
    padding: 5px 5px;
}
.triangleBox img {
    max-width: 600px;
}

.lessonBox{ margin-top: 160px;}
.lessonBox h2{font-size: 30px;line-height: 1.4;}
.lessonBox .h2waku {margin-top: -70px;}
.lessonBox .sub{font-size: 14px}

.lessonBox .listBox{margin: 50px auto 0; width: 1100px; display: flex; justify-content: space-between; flex-wrap: wrap;}
.lessonBox .listBox li{width: 320px;padding: 10px 10px 20px; margin-bottom: 50px;}
.lessonBox h3 { font-size: 24px; line-height: 1.4;}
.lessonBox .listBox .comel{margin: 0 10px}
.lessonBox .listBox .comel li{width: 280px}

.lessonBox .i01{width: 54px; position: absolute; top:32%; left: 6% }
.lessonBox .i02{width: 26px; position: absolute; top:36%; left: 9% }
.lessonBox .i03{width: 26px; position: absolute; top:53%; right: 37% }
.lessonBox .i04{width: 26px; position: absolute; top:15%; right: 11% }
.lessonBox .i05{width: 32px; position: absolute; bottom:5%; right: 7% }
.lessonBox .i06{width: 36px; position: absolute; bottom:2%; right: 8% }

.supBox h2{font-size: 38px}
.supBox .h2waku { margin-top: -30px;}

.contBox {padding: 20px 0 0; width: 1100px; margin: 0 auto}
.contBox .text01 , #TraBox .text01{font-size: 30px}
.contBox h2 , #TraBox h2 { font-size: 17px; margin-bottom: 36px; font-family: 'Zen Old Mincho', serif; font-weight:700 ;     line-height: 1.8;}
.contBox .img01 img, #TraBox .img01 img{width:84px }
.contBox ul{display: flex; justify-content: space-between; flex-wrap: wrap;}
.contBox li{width:504px }
.contBox dl{display: flex; justify-content: space-between; flex-flow: row-reverse; position: relative}
.contBox dt{width:360px }
.contBox dd{width:300px; text-align: left; position: absolute; left: 0; top: 10px;}
.contBox dt img{width: 100%}
.contBox .text01a, #supp .text01a, #sur .text01a {font-size: 10px; left: 0}
.contBox .pic02{font-size: 12px; font-weight: 900; margin-top: 80px;background-size: 100% 59px; min-width: auto; display: inline-block; margin-bottom: 5px;
box-sizing: border-box; min-height: 60px; padding-top: 15px; line-height: 1.8;}

.contBox #supp li:nth-child(5) .pic02,
.contBox #sur li:first-child .pic02{padding-top: 0px;}

.contBox h3 { font-size: 24px; line-height: 1.4;}
.contBox h3 span{display: block}
.contBox .come{margin-top: 20px}
.contBox #supp li:nth-child(3) .pic02{margin-top: 50px;}
.contBox #sur li:first-child .pic02{margin-top: 50px;}
.contBox #sur li:last-child .pic02{margin-top: 20px;}

#supp, #sur {
    padding-top: 30px;
     background: url(../img/lp/mado1.jpg) no-repeat center top;
    background-size: 630px 970px;
}
#sur .surpcbg { background: url("../img/lp/bg_sp.png") no-repeat right bottom; background-size:312px 388px }

#TraBox{background:#fff}
.TraBoxbg { background: none;}
#TraBox ul li{width: 190px}
#TraBox .love {font-size: 20px;}
#TraBox h3 {line-height: 1.7; font-size: 12px;}

.bgfff{background: #fff; padding-bottom: 60px}
.flowwaku { width: 1010px; margin: 0 auto; box-sizing: border-box; position: relative}
.flowBoxbg{background: url(../img/support/su.png) no-repeat left top #fff ; padding:80px 0 0;
    background-size: 174px 860px; width: 1100px; margin: 0 auto;}
.flowBox{padding: 80px 0;}
.flowBox h2{font-size: 38px}
.flowBox .h2waku { margin-top: -20px; margin-bottom: 28px;}

.flowcontflex{width: 880px; margin: 0 auto; margin:0 auto 0 100px}
.flowcontl, .flowcont{width:446px }
.flowcont{ margin: 0 ; background: url(../img/support/line.png) repeat-y 10px top; background-size: 27px 2px;}
.flowBox dt { width: 46px; padding: 30px 0 25px;}
.flowBox dd{font-size: 24px; width: 400px; padding: 0; border: none;}
.flowBox dd .text0 {border-bottom: 1px solid #cac6c6; display: inline-block;  padding: 30px 0 25px; font-size: 24px;
 width: 340px}
.flowcont dd .text0{padding-bottom: 30px}
.flowcontl dd .text0{ font-size: 20px !important; padding-left: 60px; width: 280px }
.flowBox dd .gosi{font-size: 16px !important}
.flowcontl .st1{ background: url("../img/lp/n01.png") no-repeat left 40px; background-size: 54px 38px}
.flowcontl .st2{ background: url("../img/lp/n02.png") no-repeat left 40px; background-size: 54px 38px}
.flowcontl .st3{ background: url("../img/lp/n03.png") no-repeat left 40px; background-size: 54px 38px}
.flowcontl .st4{ background: url("../img/lp/n04.png") no-repeat left 22px; background-size: 54px 38px}
.flowcontl .st5{ background: url("../img/lp/n05.png") no-repeat left 25px; background-size: 54px 38px;}
.flowcontl .st5 .text0{ padding-top: 15px}
.flowcontl .st6{ background: url("../img/lp/n06.png") no-repeat left 40px; background-size: 54px 38px}

.flowwaku .i01{width: 54px; position: absolute; top:5%; left: 26% }
.flowwaku .i02{width: 26px; position: absolute; top:10%; right: 28% }
.flowwaku .i03{width: 36px; position: absolute; top:5%; right: 24% }
.flowwaku .i04{width: 54px; position: absolute; bottom:45%; right: 48% }
.flowwaku .i05{width: 26px; position: absolute; bottom:12%; right: 8% }

.voieBox{ padding: 20px 0 0; background: #fff;}
.voieBox h2{
  width: 600px;
  display: block;
  margin: 0 auto;
}
.voieBox img.divorce0 {
    width: 160px;
    position: relative;
    top: -120px;
    left: 275px;
    margin: 0 0 -180px;
}
.voieBox .h2waku{margin-top: -25px;}
.voieBox h2 .i01a { width: 30px;}
.voieBox ul {margin: 10px auto 30px;  flex-wrap:nowrap}
.voieBox ul li{width:210px; padding-bottom: 0 }
.voieBox ul .old { font-size: 12px; line-height: 3;}
.voieBox ul .old img{margin-right: 5px}
.voieBox h3{ font-size: 12px;}
.voieBox .love{font-size: 11px; }

.voieBox .i01{width: 54px; position: absolute; top:5%; left: 26% }
.voieBox .i02{width: 26px; position: absolute; top:10%; right: 28% }
.voieBox .i03{width: 36px; position: absolute; top:5%; right: 24% }

.leadBox {
    background-size: 700px;
}

img.lead_txt {
    width: 420px;
}

img.lead_bg_left {
    width: 260px;
    top: 180px;
    left: auto;
    right: auto;
    margin-left: -460px;
}

img.lead_bg_right {
    width: 300px;
    right: auto;
    left: auto;
    margin-left: 200px;
}

.leadBox p.text01 {
    font-size: 18px;
}

.leadBox p.i01 {right: 30%;}
.leadBox p.i02 {right: 25%;}
.leadBox p.i03 {left: 30%;bottom: 10%;}

.pointBox h2 {
    background-size: 320px;
    font-size: 42px;
    margin-bottom: 50px;
}

.pointBox h2 span {
    font-size: 30px;
}

.pointBox img.h2-icon {
    width: 80px;
    margin: 30px auto 0;
}

.vocBox {
    font-size: 18px;
}

ul.point-list {
    max-width: 1100px;
    margin: 20px auto;
}

ul.point-list>li {flex-direction: row-reverse;gap: 30px;align-items: center;}

.point-txt {
    width: 50%;
    min-width: 500px;
}
.point-txt .text01 {
    font-size: 4vw;
}

.point-img {
    width: 50%;
}

.point-list h3 {
    font-size: 26px;
    line-height: 1.4;
    font-weight: 500;
}

.pointBox .point-txt h3 img {
    width: 88px;
}

.point-list p.text01 {
    font-size: 18px;
    font-weight: 500;
}

ul.point-list>li.point02 {
    flex-direction: row;
}
ul.point-list>li.point03 {
    align-items: flex-start;
}

.pointBox .cp_actab label::before {
    right: 10px;
}

.pointBox .cp_actab input[type=checkbox] + label::after {
    right: 6px;
}

ul.point-list>li.point03 {
    align-items: flex-start;
}

.mynote {
    margin: 0 10px 30px;
}

.cp_actab .cp_actab-content p.text02 {
    font-size: 36px;
    font-weight: 500;
}

.cp_actab .cp_actab-content p.text03 {
    font-size: 26px;
}

.thouBox{margin-top: 110px}
.thouBox .thouin{margin-top: -20px; width: 800px ; margin: 0 auto}
.thouBox .thouin .textBox{font-size: 16px}
.thouBox .thouin .metho{max-width: 623px; width: 100%}
.thouBox .thouin .textBox .text01{margin-left: -25%}
.thouBox .thouin .textBox .text03{margin: 20px}
.thouBox .t05{ padding: 100px 0 30px;}


.inforbg{width: 1100px; margin: 0 auto; padding: 0 0 114px}
.inforbox{padding: 50px; display: flex; justify-content: space-between}
.inforl{width:450px; margin: 0 }
.inforr{width:450px;}
.inforbox h2{font-size: 28px; margin-bottom: 30px;}
.inforl li h3{font-size: 12px}
.inforl li time .t01 {font-size: 38px;}
.inforl li time .t01 span {font-size: 20px;}
.inforl li time .t02 {letter-spacing: normal; font-size: 13px;}

.inforr ul li{padding-bottom: 0;}
.inforr .pic0 span{font-size: 11px}
.inforr h3{font-size: 12px}
.inforr .staf{font-size: 11px}

.aboutBox{ padding: 90px 0; text-align: center;
background-image: url("../img/lp/yu.png") , url(../img/lp/bgen.png);
background-repeat: no-repeat, no-repeat;
background-size:  833px 233px, 2086px 417px ;
background-position: right top, center top
}
.aboutBox h2{font-size: 30px;  margin-bottom: 50px; letter-spacing: 2px}
.aboutBox h2 .i02{width: 143px;vertical-align: bottom; margin: 0 8px; }
.aboutBox dl{width: 1100px; margin: 0 auto; display: flex; justify-content: space-between; position: relative}
.aboutBox dt{width:544px }
.aboutBox dt img{width: 100%}
.aboutBox dd{width:530px; margin: 0; padding-top: 30px; }
.aboutBox h3 {font-size: 35px; padding: 45px 0 40px; background: url(../img/lp/ab.png) no-repeat top left;
    background-size:112px 105px;}
.aboutBox h3 span {font-size: 26px; display: inline;letter-spacing: -2px; font-weight: 900;}
.aboutBox .text01 {font-size: 16px; font-weight: 500;}
.aboutBox .text01 span{ margin-right: 0; font-size: 22px; padding-top: 30px;}
.aboutBox .text03{font-size: 11px; line-height: 1.4;}
.aboutBox .medi{padding: 0 10px 10px; margin-right:0; position: absolute; left: 0; top: 600px; width: 520px}
.aboutBox p.text_sign.min.tR {
    text-align: right;
    font-size: 16px;
    font-weight: 500;
    margin-top: 20px;
}
.aboutBox p.text_sign.min.tR .fs_L {font-size: 1.4em;}
.aboutBox .text01.fs_XL {
    font-size: 30px;
}
.ctaBox p.text01.fs_L {
    font-size: 2em;
}
.ctaBox p.text01 {
    font-size: 16px;
}

.spBox{padding-top: 80px}
.supBox p{font-size: 22px}

#supp .i01{width: 54px; position: absolute; top:5%; left: 26% }
#supp .i02{width: 26px; position: absolute; top:15%; right: 28% }
#supp .i03{width: 36px; position: absolute; top:12%; right: 24% }
#supp .i04{width: 26px; position: absolute; top:46%; left: 0% }
#supp .i05{width: 54px; position: absolute; top:47%; left: -4% }
#supp .i06{width: 26px; position: absolute; top:58%; right: 8% }

#sur .i01{width: 54px; position: absolute; top:5%; left: 26% }
#sur .i02{width: 26px; position: absolute; top:15%; right: 28% }
#sur .i03{width: 36px; position: absolute; top:13%; right: 24% }
#sur .i04{width: 54px; position: absolute; bottom:28%; right: 26% }
#sur .i05{width: 26px; position: absolute; bottom:12%; right: 8% }
#sur .i06{width: 36px; position: absolute; bottom:8%; right: 4% }

#TraBox .i01{width: 54px; position: absolute; top:5%; left: 26% }
#TraBox .i02{width: 26px; position: absolute; top:30%; right: 28% }
#TraBox .i03{width: 36px; position: absolute; top:25%; right: 24% }

.qaBox{ padding:100px 0 0; }
.qaBox h2{font-size:38px;  letter-spacing: 0.2em; margin-bottom: 40px; }
.qaBox h2 .i01 {width: 30px;}
.qaBox .h2waku{margin-top: -30px;}
.cp_actab{font-size:16px }
.qaflex{display: flex; justify-content: space-between; width: 1100px; margin: 0 auto; padding-bottom: 100px}
.qaflexl, .qaflexr{width:500px }
.cp_actab .cp_actab-content p {font-size: 16px;}
.cp_actab label{padding: 20px 0 20px 45px;background-position: 10px 25px;}
.cp_actab label::before{top: 18px}
.cp_actab label::after{top: 20px}

.outBox h2{font-size: 38px}
.outBoxbg{background-image: url("../img/lp/out.png"),url(../img/lp/bgen.png); padding: 0 0 80px;
background-repeat: no-repeat, no-repeat;
background-size:674px 156px , 2086px 40% ;
background-position:  right top , center top}
.outBox{width: 1100px; 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;display: flex; justify-content: space-between; margin: 0 auto 10px; }
.out01 dt{width: 80px}
.out01 dt.lst{height: 26px;}
.out01 dd{width:730px; padding-top: 0}

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


.cntb{font-size: 52px; margin: 0 auto 160px; width: 620px}
.cntb a img {width: 72px; margin-top: -15px}
.btnlinestretches{padding: 40px 30px 30px;}
.btnlinestretches::before, .btnlinestretches::after{ width: 50px; height: 50px;}
.cntb .i01{width: 54px; position: absolute; bottom:-50%; left: -10px }
.cntb .i02{width: 26px; position: absolute; top:-2%; right: -4% }
.cntb .i03{width: 36px; position: absolute; top:-35%; right: -2% }

.footBox .paget {top: -50px; width: 140px; height: 140px}
.footr .text02 { font-size: 16px;text-align: left;}
.footBox .btnlinestretches{padding: 20px 30px; font-size: 27px; background: #fff; color:  #fab6b6; }
.footr{width: 380px;}


.kotei{display: flex; font-size: 18px;
    justify-content: space-between;
    width: 50px;
    margin: 0;
    top: 35%;
    right: 5px;
    background: #d6ba95; height: 200px;}
.kotei a{ display: block; padding: 20px 10px; color: #fff; font-weight: 900;-webkit-writing-mode: vertical-rl;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
	  text-align: justify;
  text-justify: inter-ideograph;
}
.kotei li:last-child a{ border-top: #fff 1px solid}

.kotei dt{  -ms-writing-mode: tb-rl; writing-mode: vertical-rl; padding: 10px 0;;
    color: #fab6b6;
    background: #fff;
    width: 50px;
    border: 1px solid;}
.kotei dt p{padding-right:10px }
.kotei span{display: none}
.kotei dd{background: #d6ba95;}
.kotei dd img{width: 36px; margin-bottom: 10px;}
address{font-size: 11px; text-align: left; padding: 0px 0 30px; padding-top: 5px;}

}