@charset "utf-8";
/* CSS Document 320-640 */


.en{font-family: "Arial"; font-weight: 800;}

.wa01 dl .insta-video {
      width: 100%;
      margin: 0 0 0 0;
      padding: 5px; border: 1px solid #ccc2c4
    }
.lessmov .insta-video {
      width: 72%;
      margin: 0 0 0 0; padding: 3px; border: 1px solid #ccc2c4
    }
    .insta-video video {
      background-image: url('assets/img/day/thumbnail.jpg');
  background-size: cover;
  background-position: center;
      /* ネイティブコントロールを利用 */
      box-sizing: content-box;
    }

.lessmov .insta-video video {
      background-image: url('assets/img/day/thumbnail2.jpg');
      background-size: cover;
  background-position: center;
      /* ネイティブコントロールを利用 */
      box-sizing: content-box;}

    /* ---------- ① モダン対応: aspect-ratio 利用 ---------- */
    @supports (aspect-ratio: 4 / 6) {
      .insta-video {
        aspect-ratio: 4 / 6;  /* 縦横比 4:5 */
        overflow: hidden;
        position: relative;
      }
      .insta-video video {
        width: 100%;
        height: 100%;
        object-fit: cover;    /* 枠いっぱいに敷きつめ、上下カット */
      }
    }

    /* ---------- ② 非対応ブラウザ: padding-hack fallback ---------- */
    @supports not (aspect-ratio: 4 / 6) {
      .insta-video {
        position: relative;
        /* 5/4 = 1.25 → 125% + コントロールバー分（約40px） */
        padding-bottom: calc(100% * (5/6) + 40px);
        height: 0;
        overflow: hidden;
      }
      .insta-video video {
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        width: auto;          /* 横幅は auto で高さ100%に合わせる */
        height: 100%;
        object-fit: cover;    /* 枠いっぱいに敷きつめ、上下カット */
      }
    }



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

mainhead

--------------------------------------------------------------------*/
.mainhead{position: relative; }
.mainhead h2{max-width:546px; width:84%; position: absolute; bottom: 0px ; left: 50%; transform: translateX(-50%);}
.mainhead .text01 img{position: absolute; left: 5%; top: -20px; max-width: 239px; width: 38%}
.mainhead .text02{line-height: 1.4; width: 50%; position: absolute; right: 5%; top:43%; text-align: right; font-size: clamp(0.875rem, 0.25rem + 3.13vw, 1.5rem)}/*14-24*/
.mainhead .text02 span{display: inline-block; color: #fff}
.mainhead .text02 span.mini{letter-spacing: -1px; font-size: clamp(0.813rem, 0.608rem + 1.02vw, 1.375rem)}/*13-22*/
.mainhead .text02 span.mini i{position: relative; top: -5px; font-size:clamp(0.625rem, 0.534rem + 0.45vw, 0.875rem) }/*10-14*/

.muti{width: 100%; padding-top:30px; text-align: center; padding-bottom: 60px}
.muti h2{letter-spacing: -1px; font-weight: 700; font-size:clamp(1.125rem, 0.5rem + 3.13vw, 1.75rem)}/*18-28*/
.muti h2 span{display: block}

.muti h2{color: #8c4a55;
position: relative;background-size: 200% 100%; /* これを追加 */
background-image: linear-gradient(
		20deg,
		rgb(140, 74, 85, 0.8)  45%, 
		#e49ba7 50%,
		rgb(140, 74, 85, 0.8) 55% 
	  );
    background-clip: text;
  	-webkit-background-clip: text;
	  color: transparent;
 animation: shinea 4s infinite;
font-weight: 900; }
@keyframes shinea {
  0% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}


.shedule{margin: 80px 5% 0; border-top: 1px solid #b9b9b9; border-bottom: 1px solid #b9b9b9;   }
.shedule h2 {letter-spacing: normal; position: relative ;font-size:clamp(0.875rem, 0.75rem + 0.63vw, 1rem) }/*14-16*/
.shedule h2 span{display: block; text-align: left; position: absolute; top: -30px}
.shedule h2 img{max-width:419px; width: 100%; padding-top: 0;position: relative; top: -40px}
.shedule ul{margin-top: -25px; position: relative; z-index: 2}
.shedule li{padding-bottom: 15px; text-align: left; list-style: disc; margin-left: 20px; font-size:clamp(0.75rem, 0.625rem + 0.63vw, 0.875rem) }/*12-14*/
.shedule li span{display: inline-block; font-size: 11px; color: #fff; background:#766372; padding: 0 5px }

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

.whatBox

--------------------------------------------------------------------*/
.whatBox{padding: 70px 0 0; text-align: center; background: url("../img/bg2.png") repeat; background-size:80%}
.whatBox .text{ background: url("../img/norgazm/what.png") no-repeat center 0; background-size: 80%; font-size:clamp(1.125rem, 0.125rem + 5vw, 2.125rem)}/*18-34*/
.whatBox .text dfn{margin-bottom: 10px; padding-top: 40px; display: block; font-size: clamp(1.125rem, 0.5rem + 3.13vw, 1.75rem)}/*18-28*/
.whatBox .text span{display: inline-block; background:#766372; color: #fff; padding: 0 10px; letter-spacing: -1px}
.whatBox dl{display: flex; justify-content: space-between ; flex-direction:row-reverse; margin: 30px 5% 0 ; align-items: center}
.whatBox dt{width: 50%}
.whatBox dt img{max-width: 345px}
.whatBox dd{line-height: 1.6; text-align: left ; width: 48%; font-size: clamp(1.125rem, 0.688rem + 2.19vw, 1.563rem) }/*18-25*/
.whatBox .text01{position: relative; text-align: left; padding: 30px 5%  0px}
.whatBox .text01 img{position: absolute; right: 0; bottom: -20px; width: 40%; max-width:233px }
.whatBox .text01 span{position: relative; z-index: 1}

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

.nayami

--------------------------------------------------------------------*/
.nayamibg{background: url("../img/norgazm/bg2a.png") repeat-x center top; background-size:80%; padding-top: 50px}
.nayami{ text-align: center; background: url("../img/norgazm/wa.png") no-repeat center top ; background-size:620px 100%; position: relative; font-size:clamp(0.75rem, 0.125rem + 3.13vw, 1.375rem) }/*12-22*/
.nayami .text{margin-bottom: 20px; padding: 60px 0 0; text-align: center;font-size: clamp(1.125rem, 0.688rem + 2.19vw, 1.563rem)}/*18-25*/
.nayami .text span{display: block}
.nayami .text .imp{font-size: clamp(1.563rem, 1.188rem + 1.88vw, 1.938rem)}/*25-31*/
.nayami .text0{line-height: 1.5}
.nayami .fuki{padding: 0 40px 10px; margin-top: 5px}

.nayami .naya1{text-align: left; padding: 10px 2% 20px 5%}
.nayami .naya1:last-child{padding-bottom: 90px}
.nayami .tit{margin-bottom: 10px; display: inline-block; background:#766372; color: #fff; padding: 0 10px; font-size:clamp(1.063rem, 0.563rem + 2.5vw, 1.563rem)}/*17-25*/
.nayami li {margin-bottom: 10px; background: url("../img/day/check.png") no-repeat left 0px; background-size: 20px auto; padding-left: 28px; font-weight: 700 ; font-size:clamp(0.75rem, 0.125rem + 3.13vw, 1.375rem)}/*12-22*/


.baseBox{letter-spacing: -1px; background: url("../img/bg2a.png") no-repeat; background-size: 100% ; text-align: center; padding-top: 40px ; font-size: clamp(0.875rem, 0.25rem + 3.13vw, 1.5rem)}/*14-24*/
.baseBox .text01{font-weight: 800; font-size:clamp(1.25rem, 0.313rem + 4.69vw, 2.188rem)}/*20-35*/
.baseBox .text01 span{letter-spacing: -3px}
.baseBox .text02 {margin-bottom: 30px; font-weight: 700; font-size:clamp(1rem, 0.125rem + 4.38vw, 1.875rem)}/*16-30*/
.baseBox .fuki span{font-size:clamp(1.625rem, 1rem + 3.13vw, 2.25rem)}/*26-36*/
.baseBox .fuki{letter-spacing: -1px ; margin-top: -5px}
.baseBox .fuki i{letter-spacing: -3px}

.baseBox .metho{background: url("../img/bg2.png") repeat; background-size:80%}

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

.voiceBox

--------------------------------------------------------------------*/
.voiceBox{text-align: center; background: url("../img/bg2.png") repeat; background-size:80%; padding-bottom: 30px}
.voiceBox h2 {padding: 60px 5% 40px}
.voiceBox h2 img{max-width:580px }
.voiceBox li{margin-bottom: 60px; position: relative; display: flex; justify-content: space-between ; align-items: flex-start; }
.voiceBox li .tate{width: 21%; position: absolute; top: -20px; right: 0; color: #fff; background:#91808d; 
border-radius: 10px 0 0 10px; padding: 20px 8px 20px 0; line-height: 1.3; text-align: left; 
font-weight: 700; font-size:clamp(1rem, 0.125rem + 4.38vw, 1.875rem)}/*16-30*/
.voiceBox li img{width: 75%; margin-left: 5%}

.voiceBox li:nth-child(2n){flex-direction:row-reverse}
.voiceBox li:nth-child(2n) .tate{border-radius: 0px 10px 10px 0px; right: auto; left: 0}
.voiceBox li:nth-child(2n) img{margin-left: 0%; margin-right: 4%}

.voiceBox li:nth-child(3) .tate{ width: 15%}



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

ABOUT

--------------------------------------------------------------------*/
.about{text-align: center ; background: url("../img/bg2.png") repeat; background-size: 80% auto;}
.about .img img{max-width: 360px ;width: 80%}
.wakuBox{ padding: 50px 0 70px}
/*3の土台全体*/
.wakuont {position: relative; margin: 0 2%}
.wakuont::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  border: 1px solid #ccc2c4; /* 枠線の太さと色 */
  border-radius: 8px; /* 角丸（お好みで） */
  pointer-events: none; /* クリックイベントを透過 */
}

.wakuont .wakuhead{position: relative; text-align: center; top: -20px}
.wakuont .wakuhead span{font-size:clamp(1rem, 0.682rem + 1.59vw, 1.875rem) }/*16-30*/
.wakuont .wakuhead::before,
.wakuont .wakuhead::after {
            content: '';
            position: absolute;
            top: 50%;
            width: 60px;
            height: 1px;
            background: #ccc2c4;
        }

.wakuont .wakuhead::before {
            left: 20px;
            transform: rotate(-70deg);
            transform-origin: left center;
            top: calc(15% + 52px);
        }
.wakuont .wakuhead::after {
            right: 20px;
            transform: rotate(-70deg);
            transform-origin: right center;
            top: 10%;
        }

.wakuont .wakuhead h2{
text-shadow:
10px 10px 0 #f9f4f6,
-10px 10px 0 #f9f4f6,
-10px -10px 0 #f9f4f6,
10px -10px 0 #f9f4f6,
10px 0px 0 #f9f4f6,
0px 10px 0 #f9f4f6,
-10px 0px 0 #f9f4f6,
0px -10px 0 #f9f4f6;
letter-spacing: -3px; font-weight: 700; line-height: 1.2; font-size:clamp(1.875rem, 0.625rem + 6.25vw, 3.125rem) }/*30-50*/
.wakuont .wakuhead .sub{letter-spacing: normal; font-size:clamp(0.813rem, 0.375rem + 2.19vw, 1.25rem) } /*13-20*/



.wa01 dl{padding-right: 2%; display: flex; justify-content: space-between; flex-flow: row-reverse}
.wa01 dt{width: 23% ; text-align: left ; line-height: 1.3;}
.wa01 dt span{padding: 10px 0 ; margin-left: 3px; display: inline-block; color: #fff; font-weight: 700; background:#766372 ; font-size: clamp(1.25rem, 0.955rem + 1.48vw, 2.063rem)}/*20-33*/
.wa01 dd{width: 72%}

.wa01 dt img{max-width:107px; width: 80% }
.wa01 dd .cli{padding: 0 0 0 20px}
.wa01 dd .ya{max-width:57px; width: 13% }
.wa01 dd .click{max-width:184px; position: relative; top:10px}
.wa01 .noupic{padding:80px 5%  30px}
.wa01 .noupic img{max-width:527px; }
.wa01 .text01{text-align: left; padding: 0 5% 40px}

.wakuont .none1{position: relative}
.wakuont .none1 .sera{position: absolute; left: 0%; top: 20px; max-width:198px; width:30% ; z-index: 5 }
.wakuont .none1 .casepic{width: 104%; margin-left: -2%;}

.wa01 .tec h3{margin-top: -30px; font-weight: 800;  font-size: clamp(1.625rem, 1.352rem + 1.36vw, 2.375rem)}/*26-38*/
.wa01 .tec .tecpic{width: 104%; margin-left: -2%; margin-top: -10px; position: relative; z-index: 1}
.wa01 .tec .tectext{text-align: left; padding: 20px 5% 90px}

.wa01 .tra .trapic{margin: 0 5%}
.wa01 .tra .trapic img{max-width:531px; }
.wa01 .tra h3{line-height: 2.4; margin-top: -40px; margin-bottom: 30px; font-weight: 800;  font-size: clamp(1.625rem, 1.352rem + 1.36vw, 2.375rem)}/*26-38*/ 
.wa01 .tra h3 span{margin-top: -10px; display: block; font-size:clamp(1rem, 0.5rem + 2.5vw, 1.5rem) }/*16-24*/
.wa01 .tra h3 span i{font-weight: 900}
.wa01 .tra h3 span em{font-size: 10px; position: relative; top: -10px}

.wa01 .tra dl{ margin: 0 5% 20px; text-align: left; flex-flow: wrap-reverse }
.wa01 .tra dd{line-height: 1.3; width: 77%}
.wa01 .tra .tratext{text-align: left; padding: 20px 5% 50px}
.wa01 .tra .fuki{line-height: 1.5; padding-bottom: 20px; font-weight:800 }
.wa01 .tra .text02{margin-bottom: 80px; display: inline-block; border: 1px solid #ccc2c4 ; padding:10px 0px 20px; border-radius: 20px 0 20px 0;
box-shadow: 0 0 8px #a79ba4; transition: 0.2s; background: #fff}
.wa01 .tra .text02:hover{box-shadow: none}
.wa01 .tra .text02 span{display: block; font-size:clamp(1.375rem, 0.75rem + 3.13vw, 2rem) }/*22-32*/
.wa01 .tra .text02 img{max-width: 300px; width: 60%}


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

.courseBox

--------------------------------------------------------------------*/
.courseBox{padding: 100px 5% 0 ; text-align: center}
.courseBox .pic img{max-width:521px }
.courseBox h2{margin-bottom: 30px; margin-top: -30px; font-weight: 800;  font-size: clamp(1.875rem, 1.125rem + 3.75vw, 2.625rem)}/*30-42*/

.courseBox .btn_box{
    /*矢印と下線の基点とするためrelativeを指定*/
  position: relative; text-align: left; box-shadow: 0 0 8px #a79ba4; transition: 2s;
    /*形状*/
  padding: 0 20px;
    text-decoration: none;
    outline: none;
    background: #f8f0f0; margin-bottom: 40px; padding-bottom: 30px; border-radius: 20px 0 20px 0
}
.courseBox .btn_box:last-child{margin-bottom: 80px}

.courseBox .btn_box:hover{ box-shadow: none}
.courseBox h3{position: relative ; transition: 0.5s; padding-right: 5px}
.courseBox .btn{
  display: block;
}

.courseBox h3:after {
  content: "⇒";
  position: absolute;
  right: -10px;
}

.courseBox h3:hover:after {
  transform: rotate3d(1,0,0,360deg);
  transition: 2s;
}

.courseBox .target{font-size: 13px; margin-top: 20px; color: #fff; background: #91808d; padding: 0 8px; display: inline-block; font-size: 12px; font-weight: 500}
.courseBox h3{line-height: 1.6; letter-spacing: -1px; font-size: clamp(1rem, 0.375rem + 3.13vw, 1.625rem)}/*16-26*/



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

.messbg

--------------------------------------------------------------------*/
.messbg{margin-top: -110px; padding-top: 50px; background: url( "../img/norgazm/maru.png") no-repeat; background-size: 100% auto}
.messbg .nao{position: relative}
.messbg .nao .higashi {width: 90%; max-width:562px; margin:0 5% }
.messbg .nao .tit img{position: absolute; top: 20%; left: 5%; max-width:141px; width: 22% }
.messbg .name{text-align: right; padding: 20px 5% 0}
.messbg .name img{max-width:350px; width: 60% }
.messbg .career{font-weight: 500; text-align: left; padding: 20px 5% 0}
.messbg .career .imp{font-size:clamp(1rem, 0.75rem + 1.25vw, 1.25rem) }/*16-20*/
.messbg .career1{text-align: left; padding: 0px 5% 20px}
.messbg .career1 li{background: url("../img/day/hoshi.png") no-repeat left 1px; background-size: 18px 18px; padding-left: 25px; font-size:clamp(0.75rem, 0.375rem + 1.88vw, 1.125rem) }/*12-18*/

.messbg .car{text-align: center; line-height: 2; padding-bottom: 60px;font-size: clamp(0.938rem, 4.69vw, 1.875rem)}/*15-30*/


.followBox {padding-bottom: 190px; text-align: center ; background: url("../img/bg2.png") repeat; background-size: 80%}
.followBox .pic{ padding: 60px 5% 0 ; }
.followBox .pic img{max-width:473px; width: 90% }
.followBox h2{margin-bottom: 0px; margin-top: -30px; font-weight: 800;  font-size: clamp(1.875rem, 1.125rem + 3.75vw, 2.625rem)}/*30-42*/
.followBox .text01 img{width: 60%; margin:0 5px} 
.followBox .text01{margin-bottom: 30px; font-size:clamp(1rem, 0.5rem + 2.5vw, 1.5rem) }/*16-24*/

.followBox ul{margin: 0 5%}
.followBox li a{ display: block;  position: relative; text-align: left; box-shadow: 0 0 8px #a79ba4; transition: 2s;
    /*形状*/
  padding: 20px 0px 0 0;
    text-decoration: none;
    outline: none;
    background: #f8f0f0; margin-bottom: 40px; padding-bottom: 30px; border-radius: 20px 0 20px 0
}
.followBox li a:hover{ box-shadow: none}
.courseBox h3{position: relative ; transition: 0.5s; padding-right: 5px}
.courseBox .btn{
  display: block;
}

.followBox li a:after {
  content: "⇒";
  position: absolute;
  right: 10px;
  bottom: 5px
}

.followBox li a:hover:after {
  transform: rotate3d(1,0,0,360deg);
  transition: 2s;
}

.followBox dl{display: flex; justify-content: space-between; align-items: center}
.followBox dt{width: 28%}
.followBox dd{width: 68% ;text-align: center ; color: #000; }
.followBox dd .sub{line-height: 1.4;}
.followBox dd h3{line-height: 1.3; letter-spacing: -1px; margin-bottom: 5px; color:#99153d ; font-size:clamp(1.375rem, 0.75rem + 3.13vw, 2rem) }/*16-28*/
.followBox dd .text02{font-size: 11px ; text-align: left}

.moushi{text-align: center; padding: 30px 0 30px}
.moushi .text{padding-bottom: 20px ; font-size:clamp(1.125rem, 0.75rem + 1.88vw, 1.5rem);
color: #8c4a55;
position: relative;background-size: 200% 100%; /* これを追加 */
background-image: linear-gradient(
		20deg,
		rgb(140, 74, 85, 0.8)  45%, 
		#e49ba7 50%,
		rgb(140, 74, 85, 0.8) 55% 
	  );
    background-clip: text;
  	-webkit-background-clip: text;
	  color: transparent;
 animation: shinea 4s infinite;
font-weight: 900; }}/*18-24*/



.moushi a{font-size:clamp(1.875rem, 0.625rem + 6.25vw, 3.125rem) }/*30-50*/







@media (min-width: 640px){
body{font-size: 18px}
.shedule h2 img{padding-top: 0}


.voiceBox h2 {
    padding: 60px 0 40px;
}
.whatBox .text dfn{ padding-top: 60px;}

.wakuont .wakuhead{top: -30px;}

.wa01 .noupic {
    padding: 80px 0 30px;
}

.wakuont .none1 .casepic{margin-left: 0}

.wa01 .tra .text02{padding: 10px 20px 20px}

.followBox dd .text02{font-size: 16px}
.followBox dd h3{margin-bottom: 10px}
}