

html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;-webkit-margin-before:0px;-webkit-margin-after:0px;-webkit-margin-start:0px;-webkit-margin-end:0px}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:'';content:none}table{border-collapse:collapse;border-spacing:0;font-size:inherit;font:100%}li img{vertical-align:bottom}dt img{vertical-align:bottom}*:first-child+html *{letter-spacing:0}


html {
   font-size: 62.5%;
   color: #3B3B3B;
   font-family:"Zen Kaku Gothic New", "游ゴシック", YuGothic, 'Yu Gothic', "游ゴシック体", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo sans-serif;
}
body {
  /* じわっと画像が表示される */
  animation: fadeIn 1.5s ease 0s 1 normal;
   -webkit-animation: fadeIn 1.5s ease 0s 1 normal;
   background-color: #efece7;
   background-image: url(../img/bg-body.jpg);
   background-size: 100%;
   background-repeat: no-repeat;
   color: #333;
   background-attachment: fixed;
}

* {
   min-height:0;
   min-width : 0;
   box-sizing: border-box;
}

.main_flex {
   width: calc(100% / 3);
   min-width: 751px;
   margin: 50px auto;
   position: relative;
   border-radius: 50px;
   overflow: hidden;
   z-index: 3;
   box-shadow: 0 0rem 3rem hsl(0 0% 0% / 20%);
}

.main_flex .g_header1{
   display: none;
}

main {
   width: 100%;
   background-color: #fff;
   background-image:url(../img/bg-main.png);
   background-repeat:no-repeat;
   background-size: 100%;
   background-position:top center;
   padding-top: 0;
}

img {
   width: 100%;
}

p {
   font-size: 2.4rem;
   line-height: 1.7em;
}

h3 {
   text-align: center;
   font-weight: 700;
   font-size: 3rem;
}

.black {
   color: #333333;
}
.white {
   color: #fff;
}

.yellow {
   color: #f5d848;
}
.lightyellow {
   color: #fffdd2;
}

.pink {
   color: #d5925c;
}
.green {
   color: #8cb589;
}

.left {
   text-align: left;
}
.blue {
   color:#415ca3;
}
.blue2 {
   color:#6475a2;
}
.beige {
   color:#a69c7c;
}
.center {
   text-align: center;
   margin: 0 auto;
}
.note {
   font-size: 1.6rem;
   line-height: 1.7em;
   color: #333333;
   margin: 20px 0;
}

.card-radius {
   border-radius: 0 40px 0 40px;
   padding: 50px;
}
.card-white {
   background-color: #fff;
   padding: 100px 60px 60px;
   color: #333;
}
.card-white p{
   color: #333;
}
.card-beige{
   background-color: #f4f4f4;
}
.card-blue{
   background-color: #e3ebf4;
}
.card-instructor p {
   font-size: 2.2rem;
}
.card-instructor .right {
   font-size: 2rem;
   padding-top: 5px;
}
.pic-card-instructor {
   display: block;
   width: 40%;
   margin: 0 auto;
   margin-top: -152px;
   margin-bottom: 20px;
}



/* じわっと画像が表示される */
@keyframes fadeIn { /*上のbody内で呼び出しているアニメーションと名前をそろえる*/
   0% {opacity: 0} /* 始め */
   100% {opacity: 1} /* 終わり */
}

/*古いブラウザ用*/
@-webkit-keyframes fadeIn {
   0% {opacity: 0}
   100% {opacity: 1}
}

ol, ul {
   list-style: none;
}

.animated{
  /* 3秒待ってからアニメーションする */
  -webkit-animation-duration: 3s;
  animation-delay:3s;
  /* 2秒かけてアニメーションする */
  -webkit-animation-duration: 2s;
  animation-duration: 2s;

}

.effect img {
  transition: 2s;
}

.mt10 {
   margin-top: 10px !important;
}

.mt20 {
   margin-top: 20px !important;
}

.mt30 {
   margin-top: 30px !important;
}

.mt70 {
   margin-top: 70px !important;
}


.futura{
   font-family: "futura-pt", "游ゴシック", YuGothic, 'Yu Gothic', "游ゴシック体", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', "メイリオ", Meiryo !important;
   font-style: normal;
   font-weight: 300;
}


/**common**/

.section--bg1 {
   background:url(../img/bg-body.png);
   background-repeat:no-repeat;
   background-size: 100%;
   background-position:top right;
}


.section-title {
   font-size: 4.3rem;
   text-align: center;
   font-weight: 500;
   letter-spacing: 0.05em;
   margin-bottom: 60px;
   line-height: 1.4em;
}
.section-title .text-s {
   font-size: 2.8rem;
   display: block;
   border-bottom: none;
   line-height: 1.5em;
   margin-bottom: 20px;

}
.section-title .line {
   display: inline-block;
   border-bottom: solid 1px #333;
   line-height: 1.5em;
   padding-bottom: 2px;
}

.top-contents-header {
   text-align: center;
}
.top-contents-header .title {
   font-size: 2.9rem;
   color: #000;
   letter-spacing: 2px;
   margin: 0 0 70px 0;
   padding: 0;
}

.voice {
    display: flex;
    align-items: center;
    margin-top: 60px;
    justify-content: space-between;
    padding: 40px 40px 40px;
}
.voice .image_student {
   width: 30%;
   text-align: center;
}
.voice .image_student img {
   display: block;
   margin: auto;
   width: 100%;
}
.voice .text_voice {
   width: 70%;
   padding-left: 30px;
}
.voice .text p {
   font-size: 1.8rem;
}


.price_img {
   padding: 0 70px;
   margin: 30px 0;
}

.price_img img{
   width: 100%;
}

a,a:visited {
   color: #000;
   text-decoration: none;
}


.pc-tab{
  display: inline-block;
}

.pc{
  display: inline-block;
}
.sp, .tab {
  display: none;
}

.flex {
   display: flex !important;
}


/*logo*/

.top-contents .workshop_item .title .text {
   width: 50%;
   max-width: 300px;
   height: auto;
   margin-bottom: 35px;
}

.top-contents .workshop_item .title img {
   display: block;
   margin: auto;
}

/*js-animation*/
.js-animation{
   opacity: 0;
   -webkit-transform: translate3d(0, 100%, 0);
   transform: translate3d(0, 30px, 0);
   -webkit-transition: all 0.5s ease;
   transition: all 0.5s ease;
}

.js-animation.active{
   opacity: 1;
   -webkit-transform: translate3d(0, 0, 0);
   transform: translate3d(0, 0, 0);
}

.animated{
  /* 3秒待ってからアニメーションする */
  -webkit-animation-duration: 2s;
  animation-delay:2s;
  /* 2秒かけてアニメーションする */
  -webkit-animation-duration: 2s;
  animation-duration: 2s;

}

/**nav**/

.g_header1.retractable.scrolled {
   /*height: 50px;*/
}

.g_header1 {
   transition: all .1s;
}
.g_header1 {
   width: calc((100% - 751px) /2);
   flex-shrink: 0;
   background: transparent;
   top: 50%;
   left: 0%;
   transform: translateY(-50%);
   -webkit-transform: translateY(-50%);
   -ms-transform: translateY(-50%);
}
.g_header1 .g_navi-head {
}
.g_header1 .g_navi-head {
   /*width: 100%;*/
}

.g_header1 .g_navi-head-sub, .g_header1 .g_navi-head {
   transition: all .4s;
}
.g_header1 .g_navi-head_logo {
   width: 100%;

}
.g_header1 .g_navi-head_logo .header__logo {
   margin: 0 auto;
   width: 120px;
}

.g_header1 .g_navi-head_logo a {
   display: block;
   max-width: 100%;
   width: 100%;
   margin: 0 auto 50px;
}
.g_header1 a:visited {
   text-decoration: none !important;
}
.g_header1 a:link {
   text-decoration: none !important;
}
.g_header1 .g_navi-head_logo img{
   width: 100%;
   margin: 0 auto;
}
.g_header1 .g_navi-head .menu-trigger {
   float: left;
   position: absolute;
   top: 2rem;
   left: 2rem;
   width: 15px;
   height: 11px;
}

.g_header1 .g_navi-head .menu-trigger, .g_header1 .g_navi-head .menu-trigger span {
   display: inline-block;
   transition: all .4s;
   box-sizing: border-box;
   z-index: 10000;
}

.g_header1 .g_navi-head .btn {
   width: auto;
   font-size: 1.2rem;
   font-weight: bold;
   color: #1DA1F2;
   border: solid 1px #c1c1c1;
   padding: 8px 24px 8px 10px;
   letter-spacing: 0.08em;
   margin-top: 10px;
   background: #fff url(../img/icon-vector-b.svg) no-repeat 90% center;
   background-size: 15px;
}
.g_header1 .g_navi-head .btn:hover{
  opacity: 0.6;
}

.g_header1 .g_navi-head_menu {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-wrap:wrap;
   width: 100%;
   margin:0 auto;
}

.g_navi-head_btns {
  display: inline-block;
}
.g_header1 .g_navi-head_menu ul{
   display: flex;
   align-items: center;
   justify-content: center;
   flex-wrap: wrap;
}
.g_header1 .g_navi-head_menu ul li {
   display: flex;
   justify-content: flex-start;
   align-items: center;
   letter-spacing: 0.06em;
   margin-bottom: 34px;
   width: 100%;
}
.g_header1 .g_navi-head_menu ul li a {
   font-size:2.2rem;
   font-weight: 600;
   color: #333;
}

.g_header1 .g_navi-head_menu ul li a:hover{
  opacity: 0.6;
}

.fixed {
   position: fixed;
   z-index: 1
}

@media screen and  (min-width:1024px) and (max-width:1174px) {
  .g_header1 .g_navi-head_menu {

   }
   .g_header1 .g_navi-head_menu ul li{
   margin: 0 6px;
   }
}


/**keyvisual**/
.lp_main-visual{
  text-align: center;
  height: auto;
  position: relative;
  border-radius: 40px 40px 0 0;
  z-index: 2;
}
.lp_main-visual::after {
   content: "";
   display: block;
   background-image: url(../img/bg-bottom-lightblue.svg);
   background-repeat: no-repeat;
   position: absolute;
   bottom: -20%;
   left: 0;
   width: 100%;
   height: 20%;
      background-size: 100%;

}


.lp_main-visual .inner {
   position: relative;
   width: 100%;
   height: auto;
   background-image: url(../img/main_image.png);
   background-repeat: no-repeat;
   background-size: 93%;
   background-position: top right;
   margin: 0 auto;
   z-index: 1;
}

.lp_main-visual .logo img{
  width: 50%;
}
.lp_main-visual .text{
   position: relative;
   width: 100%;
}

.lp_main-visual .top_cv{
  position: absolute;
  bottom: -15%;
  right: 60px;
}

.lp_main-visual .top_cv img{
  width: 200px;
}


.hero__group {
   text-align: left;
   position: relative;
   height: 863px;
}
.hero__group__title {
   position: absolute;
   bottom: -10px;
   left: 40px;
   text-align: left;
   font-size: 4.8rem;
   font-weight: 300;
   background-color: transparent;
}
.hero__group__title__sub {
   display: block;
   padding-bottom: 20px;
}
.hero__group__title .line {
   margin: 0 0 1.5rem 0;
   display: inline-block;
   font-weight: 500;
   position: relative;
   z-index: 3;
   padding: 10px 20px;
   opacity: 1;
   color: #1f1f1f;
   font-size:5.7rem;
   letter-spacing: 0.03em;
   background-color: #fff;
}


.mask__wrap {
   position: relative;
   display: inline-block !important;
}

.mask.is-active .mask__text {
    -webkit-animation: in 0s 0.8s forwards;
    animation: in 0s 0.8s forwards;
}

.mask.is-active .mask__wrap:before, .mask.is-active .mask__wrap:after {
   position: absolute;
   top: 0;
   width: 100%;
   height: 100%;
   content: "";
}

.mask.is-active .mask__wrap:before {
   left: 0;
   -webkit-transform-origin: left center;
   transform-origin: left center;
   -webkit-animation: bgIn 0.8s cubic-bezier(0.22, 1, 0.36, 1) forwards;
   animation: bgIn 0.8s cubic-bezier(0.22, 1, 0.36, 1) forwards;
   background: #fff;
}

.sub_read {
   font-size: 2rem;
   font-weight: bold;
}

.hero_sub_text {
   position: absolute;
   top:10%;
   right:7%;
   display: flex;
   gap:10px;
   align-items: flex-start;
   flex-direction: row-reverse;
}
.hero_sub_text .bg-line {
   -ms-writing-mode: tb-rl;
   writing-mode: vertical-rl;
   color: #434343;
   font-size: 3.8rem;
   font-weight: 400;
   margin-bottom: 30px;
   display: inline-block;
   padding: 0 7px;
   letter-spacing: 0.05em;
   border-right: solid 2px #fff;
}
.hero_sub_text .bg-line:nth-child(2) {
   margin-top: 106px;
}
.contents_area {
   padding: 80px 60px;
}



/*about*/
.about {
   position: relative;
   padding-top: 230px;
   padding-bottom: 60px;
   background-color: #d0d7de;

}
.about::after {
   content: "";
   display: block;
   background-image: url(../img/bg-bottom-gray.svg);
   background-repeat: no-repeat;
   position: absolute;
   bottom: -100px;
   left: 0;
   width: 100%;
   height: 150px;
   z-index: 2;
      background-size: 100%;

}

.about_title {
   font-size: 36px;
   text-align: center;
   margin-bottom: 40px;
   margin-top: 55px;
   line-height: 1.5em;
   letter-spacing: 0.05em;
   border-bottom: none;
   color: #fff;
}

.nayami_ttl {
   color: #fff;
   font-size: 3.4rem;
   line-height: 1.5em;
   margin-bottom: 20px;
}
.nayami {
   position: relative;
   background-color: #8e93a1;
   padding: 40px 5% 20px;
   border-radius: 10px;
}
.nayami::after {
   display: block;
   content: "";
   position: absolute;
   background-image: url(../img/triangle-gray.svg);
   background-size: 100%;
   background-repeat: no-repeat;
   width: 40px;
   height: 40px;
   bottom: -40px;
   left: 0;
   right: 0;
   margin: auto;
}

.title-check {
   width: 35%;
   display: block;
   margin: 0 auto 20px;
}
.nayami_list {
   background-color: #fff;
   border-radius: 10px;
   position: relative;
   margin-bottom: 30px;
   padding: 30px 40px 50px;
}
.nayami_li {
   padding-left: 40px;
   position: relative;
   font-size: 2.4rem;
   font-weight: 500;
   padding-bottom: 15px;
   padding-top: 20px;
   border-bottom: dashed 1px #9d9d9d;
}
.nayami_li::before {
   content: "";
   display: block;
   position: absolute;
   top: 0;
   bottom: 0;
   left: 0;
   margin: auto;
   width: 28px;
   height: 28px;
   background-image: url(../img/icon-check.png);
   background-repeat: no-repeat;
   background-size: 100%;
}

.illust-nayami {
   width: 90%;
   margin: -10% auto 30px;
   position: relative;
   z-index: 2;
}
.solution {
   background-color: #dfdec5;
   padding: 60px 5% 30px;

}
.solution_ttl {
   margin-bottom: 40px;
}
.solution_ttl_small {
   display: inline-block;
   border-radius: 100px;
   background-color: #fff;
   padding: 10px 20px;
   font-size: 2.8rem;
   margin-bottom: 10px;
   line-height: 1em;
}
.solution_ttl_big {
   display: block;
   line-height: 1.4em;
}
.solution_text {
   background-color: #fff;
   border-radius: 10px;
   margin-bottom: 30px;
   padding: 50px 50px;
}

/*approach*/

#approach {
   position: relative;
   padding-bottom: 0;
   margin-bottom: 200px;
}
.approach::after {
   content: "";
   display: block;
   background-image: url(../img/approach-bottom-nami.svg);
   background-repeat: no-repeat;
   position: absolute;
   bottom: -100px;
   left: 0;
   width: 100%;
   height: 150px;
   z-index: 2;
   background-size: 100%;
}

.inner-approach {
   z-index: 1;
   position: relative;
}

.approach-title {
   color: #fff;
   line-height: 1.3em;
}
.approach-title .text-s {
   margin-bottom: 10px;

}
.approach-title .lightlellow {
   font-size: 1.2em;

}

.chart-approach {
   background-color: #748fb4;
   background-image: url(../img/bg-water.png);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 100%;
   background-position: bottom 0 center;
   position: relative;
   z-index: 0;
   padding-bottom: 250px;
   padding-top: 180px;
}

.hr-approach {
   height: 150px;
   width: 1px;
   border-right: solid 1px #fff;
   margin: 40px auto 40px auto;
}

.title-totonou {
   color: #fff;
   font-size: 3.6rem;
   line-height: 1.4em;
   margin-bottom: 40px;
}
.text-totonou {
   color: #fff;
   text-align: center;
   width: 90%;
   margin: 0 auto;
}


.approach_list_text {
   width: 80%;
   margin: 0 auto 100px;

}

.approach_list {
   margin-bottom: 10px;
   position: relative;
   z-index: 0;
   margin-top: 50px;
   background-color: #eeeee6;
}

.approach_list::before {
   content: "";
   display: block;
   background-image: url(../img/approach-top-nami.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 100%;
   height: 148px;
   position: absolute;
   top:-145px;
   left: 0;
   z-index: 1;
}

.approach_list .logo-mark {
   width: 15%;
   margin: 0 auto;
   display: block;
}
.approach_item {
   background-image: url(../img/approach-img-1.png);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 100%;
   display: flex;
   justify-content: center;
   flex-direction: column;
   align-items: flex-start;
   font-weight: 500;
   padding-top: 14%;
   padding-bottom: 10%;
   color: #000;
}
.approach_item.approach-2 {
   background-image: url(../img/approach-img-2.png);
}
.approach_item.approach-3 {
   background-image: url(../img/approach-img-3.png);
   margin-bottom: 30px;
}

.approach_item.approach-2 {
   align-items: flex-end;
   text-align: right;
   padding-right:4%;
}

.approach_item.approach-3 {
   padding-left: 5%;
}
.approach-num {
   display: block;
   width: 100px;
   margin-bottom: 10px;
}
.approach-1 .approach-num {
   width: 45%;
   margin-top: 5%;
}
.approach-2 .approach-num {
   width: 34%;
   margin-top: -5%;
}
.approach-3 .approach-num {
   width: 36%;
}




.approach-subtitle {
   display: flex;
   flex-direction: column;
   font-size: 3.4rem;
   align-items: flex-start;
}

.approach-subtitle span {
   display: inline-block;
   background-color: #fff;
   padding: 7px 13px;
   margin-bottom: 10px;
   flex: none;
   width: auto;
}
.approach_item.approach-1{
   padding-left:5%;
}
.approach_item.approach-2 .approach-text,
.approach_item.approach-4 .approach-text {
   text-align: right;
}

.approach .arrow-line {
   width: 20%;
   margin: 0 auto 20px;
}


.list-logo {
   justify-content: center;
   gap: 10%;
   margin-bottom: 50px;
}
.list-logo img {
   width: 25%;
   display: block;
}



/*entry*/


.entry {
   background-color:#fff;
   padding-top: 250px;
   padding-bottom: 100px;
}
.entry.card-beige {
   background-color: #e7dec5;
}
.entry.card-blue {
   background-color: #e6ebf3;
}
.entry.card-pink {
   background-color: #d18755;
}
.entry .entry-title {
   font-size: 3.8rem;
   font-weight: 500;
   margin-bottom: 30px;
}
.card-entry {
   margin-bottom: 50px;
}
.card-entry.card-white {
   border: none;
}
.entry .phone {
   width: 60%;
   display: block;
   margin: -280px auto 50px;
   position: relative;
}
.entry .phone .icon-imanara {
   position: absolute;
   top: -50px;
   left: -150px;
   width: 188px;
   height: 188px;
   color:#1f3852;
   display: flex;
   align-items: center;
   justify-content: center;
   border-radius: 50%;
   background-color: #f7ea5a;
   font-size: 40px;
   font-weight: 700;
}
.entry .icon-imanara.card-pink {
   background-color: #d18755;
   color: #fff;
}
.btn-entry {
   position: relative;
   z-index: 2;
}


/*event*/
.event {
   background-color: #748fb4;
   padding-top: 180px;
   position: relative;
   margin-bottom: 300px;
}
.event::before {
   content: "";
   display: block;
   background-image: url(../img/bg-bottom-white.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 100%;
   height: 148px;
   position: absolute;
   top:-2px;
   left: 0;
   z-index: 1;
}
.event::after {
   content: "";
   display: block;
   background-image: url(../img/bg-bottom-blue.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 100%;
   height: 148px;
   position: absolute;
   bottom:-148px;
   left: 0;
   z-index: 1;
}

.event-title-sub {
   display: inline-block;
   border-radius: 100px;
   background-color: #fff;
   padding: 10px 20px;
   font-size: 2.8rem;
   margin-bottom: 10px;
   line-height: 1em;
}

.event-title {
   margin-bottom: 0;
}
.event-title-big {
      color: #fff;

}
.icon-rank {
   width: 50px;
   display: block;
   margin: 0 auto;
}
.list-event {
   margin-top: 200px;
}
.item-event {
   margin-bottom: 300px;

}
.item-event:last-child {
   margin-bottom: 0;
}
.item-event .card-white {
   border: none;
}

.item-event .event_image_box {
   width: 65%;
   display: block;
   margin: -250px auto 30px;
   position: relative;
}
.item-event .event_image_box img {
   width: 100%;
   display: block;
}
.item-event .event_image_box img.event_image1-icon {
   position: absolute;
   display: block;
   width: 50%;
   bottom: -5%;
   right: -20%;
}
.item-event .event-name {
   font-size: 3rem;
   text-align: center;
   margin-bottom: 10px;
   letter-spacing: 0.05em;
   font-weight: 600;
   line-height: 1.5em;
}
.event-author {
   font-size: 2.2rem;
   text-align: center;
   margin-bottom: 30px;
   letter-spacing: 0.05em;
   font-weight: 600;
}

.tutor-shoko {
   background-color: #e3ebf4;
   border-radius: 10px;
   padding: 40px 35px 40px;
   margin-top: 50px;
   margin-bottom: 20px;
}
.tutor-shoko-title {
   color:#748fb4 ;
   margin-bottom: 30px;
}
.comment-tutor {
      justify-content: space-between;
      margin-top: 30px;
      align-items: center;
}
.event-tutor {
   width: 30%;
   text-align: center;
   font-size: 1.6rem;
}
.event-tutor img {
   display: block;
   width: 80%;
   margin: 0 auto;
   margin-bottom: 10px;
}
.tutor-shoko .event-tutor img {
   width: 100%;

}
.event-fukidashi {
   width: 65%;
   background-color: #fff;
   border-radius: 10px;
   padding: 20px 20px;
   position: relative;
}
.event-fukidashi::before {
position: absolute;
display: block;
content: '';
top: 50%;
transform: translateY(-50%);
left: -15px;
width: 20px;
height: 20px;
background-color: #fff;
clip-path: polygon(100% 0, 100% 100%, 0% 50%);
}
.event-fukidashi-blue {
   background-color: #e3ebf4;
}
.event-fukidashi-blue::before {
background-color: #e3ebf4;
}
.event-fukidashi p{
   font-size: 2rem;

}
.event-date-group {
   border: solid 1px #748fb4;
   padding: 20px 30px;
   text-align: center;
   margin-top: 40px;
}
.event-date-title {
   background-color: #748fb4;
   padding: 8px;
   text-align: center;
   color: #fff;
   font-size: 2.4rem;
   margin-bottom: 20px;

}


/*mukumi*/
.mukumi {
   background-color: #f1eee4;
   position: relative;
   padding-top: 270px;
}
.mukumi::before {
   content: "";
   display: block;
   background-image: url(../img/bg-bottom-white.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 100%;
   height: 148px;
   position: absolute;
   top:-2px;
   left: 0;
   z-index: 1;
}
.mukumi::after {
   content: "";
   display: block;
   background-image: url(../img/approach-bottom-nami.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 100%;
   height: 148px;
   position: absolute;
   bottom:-148px;
   left: 0;
   z-index: 1;
}
.mukumi-illust {
   display: block;
   width: 100%;
   margin-bottom: 200px;
}
.mukumi-comment {
   position: relative;
   margin-top: 50px;
   overflow: visible
}
.mukumi-comment-illust {
   position: absolute;
   display: block;
   width: 40%;
   top: -40%;
   right: 0;
   left: 0;
   margin: 0 auto;
   z-index: 2;
}




/**rate**/

.rate {
   background-color: #8999af;
   padding-top: 240px;
   padding-bottom: 70px;
   position: relative;
}
.rate::after {
   content: "";
   display: block;
   background-image: url(../img/morning-time-bottom-nami.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 100%;
   height: 148px;
   position: absolute;
   top:0;
   left: 0;
   z-index: 1;

}

.rate-title {
   font-size: 2.8rem;
   line-height: 1.9em;
   margin-bottom: 20px;
   margin-top: 50px;
}
.pic-rate {
   display: block;
   width: 70%;
   margin: 0 auto 10px;
}

.note-rate {
   color: #000;
   font-size: 1.8rem;
   margin-bottom: 20px;
}
.catch-rate {
   font-weight: 700;
   font-size: 3rem;
   color: #fff;
}

/*feature*/

.feature {
   background-color: #f1eee4;
   position: relative;
   padding-top: 130px;
   padding-bottom: 0;
}

.feature::after {
   content: "";
   display: block;
   background-image: url(../img/feature-bottom-nami.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 100%;
   height: 148px;
   position: absolute;
   bottom:-148px;
   left: 0;
   z-index: 1;
}

.feature .section-title {
   font-size: 3.8rem;
}
.feature-list {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   margin-bottom: 70px;
}
.feature-item {
   width: 46%;
   margin-bottom: 50px;
}
.feature-item_image {
   width: 100%;
   margin-bottom: 30px;
   position: relative;
}
.feature-item_image img {
   width: 100%;
   display: block;
}
.feature-item_image::after {
   content: "";
   display: block;
   background-image: url(../img/icon-feature.png);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 60px;
   height: 47px;
   margin: auto;
   position: absolute;
   top:0;
   left: 0;
   z-index: 1;
}
.feature-item_ttl {
   font-size: 2.6rem;
   margin-bottom: 25px;
   font-weight: 600;
   letter-spacing: 0.05em;
}
.feature-item_text {
   font-size: 1.8rem;
   letter-spacing: 0.05em;
   font-size: 2.2rem;
   padding: 0 0 0 5px;
}



/*class*/
.class {
   background-color: #748fb4;
   padding-top: 250px;
   padding-bottom: 250px;
   position: relative;
   z-index: 0;
}
.class-title {
   color: #fff;
}
.icon-rank {
   width: 50px;
   display: block;
   margin: 0 auto;
}
.list-class {
   margin-top: 30px;
}
.item-class {
   margin-bottom: 110px;
}
.item-class .card-white {
   border: none;
}
.item-class .icon-rank-class {
   text-align: center;
   position: relative;
   width: 55px;
   margin: 0 auto 175px;

}
.item-class .icon-rank-class img {
   display: block;
   width: 100%;
}

.item-class .class_image {
   width: 65%;
   display: block;
   margin: -250px auto 30px;
}
.rank4-5 {
   justify-content: space-between;
   align-items: stretch;

}
.rank4-5 .item-class {
   width: 48%;
}
.rank4-5 .item-class .card-white {
   padding: 40px;
}
.rank4-5 .item-class .class_image {
   width: 85%;
   margin: -180px auto 30px;
}


.item-class .class-name {
   font-size: 3rem;
   text-align: center;
   margin-bottom: 20px;
   letter-spacing: 0.05em;
   font-weight: 600;
   line-height: 1.6em;
}
.rank4-5 .item-class .class-name {
      font-size: 2.3rem;
}
.rank4-5 .item-class p {
   font-size: 2em;
}
.title-osusume-jikan {
   color: #748fb4;
   border-bottom: solid 2px #748fb4;
   padding-bottom: 25px;
   padding-top: 40px;
   margin-bottom: 10px;
   text-align: center;
   font-size: 2.4rem;
   font-weight: 500;
}



.class-other {
   border: solid 2px #fff;
   color: #fff;
   padding-top: 90px;
}
.title-class-other {
   margin-bottom: 70px;
}

.list-class-other {
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
   justify-content: space-between;
   width: 90%;
   margin-bottom: 4px;
   margin-top: 40px;
   margin-left: auto;
   margin-right: auto;
}
.list-class-other li {
   width: 45%;
   text-align: center;
   margin-bottom: 40px;
}
.class-other-name {
   text-align: center;
   font-weight: 500;
   line-height: 1.5em;
}
.class-other-image {
   margin-bottom: 20px;
}



/**student-voice**/

.student-voice {
   background-color: #f1eee4;
   position: relative;
   z-index: 2;
   padding-top: 0;
   padding-bottom: 0;
}
.student-voice::before {
   content: "";
   display: block;
   background-image: url(../img/approach-top-nami.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 100%;
   height: 148px;
   position: absolute;
   top:-146px;
   left: 0;
   z-index: 1;
}
.student-voice::after {
   content: "";
   display: block;
   background-image: url(../img/feature-bottom-nami.svg);
   background-repeat: no-repeat;
   background-size: 100%;
   width: 100%;
   height: 148px;
   position: absolute;
   bottom:-148px;
   left: 0;
   z-index: 1;
}

.student-voice-item {
   margin-bottom: 40px;
}
.student-voice-image {
   width: 30%;
   margin-right: 30px;
}
.student-voice-image img {
   width: 100%;
   display: block;
}
.student-voice-title p {
   font-size: 3.2rem;
   line-height: 1.4em;
   margin-bottom: 40px;
   font-weight: 500;
   margin-bottom: 10px;
}
.student-voice-title p.student-voice-name {
   font-size: 2.2rem;
   font-weight: 400;
}
.student-voice-flex {
   margin-bottom: 30px;
}




/**instructor**/

.instructor {
   background-color: #e6ebf3;
   padding-top: 180px;
   padding-bottom: 0;
   position: relative;
   margin-bottom: 250px;
}

.instructor::after {
   content: "";
   display: block;
   background-image: url(../img/bg-bottom-lightblue.svg);
   background-repeat: no-repeat;
   position: absolute;
   bottom: -20%;
   left: 0;
   width: 100%;
   height: 20%;
   background-size: 100%;
}


.instructor-title {
   font-size: 3.8rem;
   line-height: 1.8em;
   margin-bottom: 40px;
}
.tutor-shoko-image {
   width: 43%;
   display: block;
   margin: 0 auto 40px;
}
.tutor-shoko-name {
   text-align: center;
   font-size: 3rem;
   font-weight: 500;
   margin-bottom: 40px;
}
.tutor-shoko-name .text-s {
   font-size: 2rem;
   margin-bottom:10px;
   display: block;
}
.tutor-shoko-text {
   width: 75%;
   margin: 0 auto 60px;
}
.title-conditioning {
   text-align: center;
   font-size: 4rem;
   margin-bottom: 40px;
   font-weight:500;
}
.title-conditioning-s {
   display: inline-block;
   border-radius: 100px;
   background-color: #748fb4;
   color: #fff;
   padding: 10px 40px;
   font-size: 2.6rem;
   margin-bottom: 20px;
   line-height: 1em;
   font-weight: 400;
}

.instructor-list {
   flex-wrap: wrap;
   justify-content: space-between;
   padding: 0;

}
.instructor-list .instructor-item {
   width: 48%;
   box-shadow: none;
   padding: 30px;
   margin-bottom: 30px;
}
.instructor-list .instructor-item p {
   font-size: 2rem;
   line-height: 1.5em;
}
.instructor-list img {
   width: 70%;
   display: block;
   margin: 0 auto 30px;
}
.instructor-name {
   font-size: 2.5rem;
   font-weight: 500;
   margin-bottom: 20px;
}





/**footer**/
.g_footer {
   max-width: 100%;
   background: #f0f0f0;
   border-top: solid 1px #d7d7d7;
   padding: 140px 0 40px;
   color: #333;
   border-radius: 0 0 40px 40px;
}
.g_footer .logo{
  text-align: center;
  margin-top: 60px;
}
.g_footer .logo img{
  height: 40px;
  color: #3075ba;
}

.g_footer-nav {
   padding: 20px 20px 0;
}
.g_footer-nav ul, .g_footer-nav li {
   text-align: center;
}
.g_footer-nav li {
   display: inline-block;
   margin: 20px;
   font-size: 1.2rem;
}
.g_footer a:visited {
   text-decoration: none !important;
   color: #333!important;
}
.g_footer a:hover {
  opacity: 0.6;
}

.g_footer .copyright {
   text-align: center;
   font-size: 10px;
   padding: 40px 0;
}







/*アコーディオン*/
.accordion-s {
   margin-top: 20px;
}

.accordion-s__icon {
    position: relative;
    z-index: 0;
    width: 10px;
    margin: 0 0.5rem;
    cursor: pointer;
    -webkit-transition: all ease-in-out 0.3s;
    transition: all ease-in-out 0.3s;
    flex-shrink: 0;
    flex-grow: 0;
}

.accordion-s.is-toggle .accordion-s__icon {
    -webkit-transition: all ease-in-out 0.3s;
    transition: all ease-in-out 0.3s;
    -webkit-transform: rotate(180deg) !important;
    transform: rotate(180deg) !important;
}

/*右側のコンテンツ*/
.contents_right {
   right: 0;
   width: calc((100% - 751px) /2);
   flex-shrink: 0;
   padding-top: 50vh;
   background: transparent;
}

.join_campaign {
   width: 100%;
}

.btn-trial {
   background: #f7ea5a;
   /*box-shadow: 0 0.5rem 1rem hsl(0 0% 0% / 10%);*/
   line-height: 1.5;
   margin: 20px auto 0 ;
   font-size: 2rem;
   font-weight: bold;
   width: 188px;
   height: 188px;
   display: flex;
   flex-direction: column;
   justify-content: center;
   align-items: center;
   text-align: center;
   transition: 0.3s;
   color: #415ca3;
   border-radius: 50%;
   font-size: 1.8rem;
   line-height: 1.4em;

  /* padding: 3ch;*/
}

a.btn-trial:visited {
   color: #415ca3;

}
.btn-trial p {
   margin: 0;
   padding: 0;
   color: #415ca3;
   line-height: 1em;
}
.text-bg {
   background: #415ca3;
   color: #f7ea5a;
   display: block;
   padding: 5px 27px;
   line-height: 1em;
   border-radius: 40px;
   text-align: center;
   font-size: 2rem;
   margin-bottom: 15px;
}
.btn-trial .text-l {
   font-size: 4.7rem;
   font-weight: 500;
   line-height: 0.5em;
   margin-bottom: 5px;


}
.btn-trial .text-l .yen {
   font-size: 3.3rem;
   font-weight: bold;
}
.btn-trial .text-pre {
   line-height: 1.3em;
}

.btn-trial:hover{
   opacity: 0.7;
}


/*feature*/

.feature_card {
   text-align: center;
   margin-bottom: 50px;
}

p.feature_card_ttl {
   font-weight: bold;
   font-size: 2.2rem;
   line-height: 3.5rem;
   margin: 40px 0 30px;
}

p.feature_card_text {
   text-align: left;
}

.feature_card_point {
   background: #ebf2f7;
   padding: 20px 30px;
   text-align: left;
   margin-top: 30px;
}

.feature_point_tag {
   display: inline-block;
   background: #83b1d7;
   font-weight: bold;
   font-size: 1.4rem;
   margin-bottom: 5px;
   padding: 5px;
   color: #fff;
}




@media screen and (max-width: 1366px) {
   .flex_menu-pc{
      display: none !important;
   }

   .flex_menu-sp{
      display: block !important;
   }
   .g_header1 {
      padding: 0;
      top:100px;
      transform: none;
      z-index: 3;
   }
   .main_flex .g_header1{
      display: block;
   }
   .g_header1 .g_navi-head_logo a {
      margin: 0 auto;
      width: 120px;
   }
   .g_header1 .g_navi-head_logo .header__logo {
      width: 100%;
   }
}

@media screen and (min-width: 1366px) {
   .flex_menu-pc{
      display: block !important;
   }

   .flex_menu-sp{
      display: none !important;
   }

}



/*===========================================

faq

===========================================*/
#faq {
   background: #fff;
}
#faq .instructor_ttl_box, #plan .instructor_ttl_box {
   font-family: "Zen Kaku Gothic New", sans-serif;
}
#faq .contents_ttl, #plan .contents_ttl {
   margin-bottom: 30px;
   text-align: left;
   font-weight: 400;
}
#faq .subttl_text-en, #plan .subttl_text-en {
   color: #777762;
   font-size: 1.6rem;
   font-weight: 500;
   margin-bottom: 30px;
}
.asayoga .faq-section .accordion-s {
   background: transparent;
   border-bottom: solid 1px #eee;
   color: #333;
   font-weight: 500;
}

.asayoga .faq-section .accordion-s .accordion-s__text:before {
   font-family: 'Zen Kaku Gothic Antique', sans-serif;
   font-weight: 300;
   font-size: 2rem;
}


.asayoga .faq-section .accordion-s.s-toggle .accordion-s__icon {
   -webkit-transition: all ease-in-out 0.3s;
   transition: all ease-in-out 0.3s;
   -webkit-transform: rotate(180deg) !important;
   transform: rotate(180deg) !important;
}


.s-toggle .asayoga .faq-section .note {
   font-size: 1.6rem;
}

@media screen and (max-width:900px) {
   .asayoga .faq {
      margin-top: 40px;
   }
}

@media screen and (max-width:600px) {
   .asayoga .faq-section {
      background: #fff;

   }
   .asayoga .faq {
      margin-top: 40px;
   }
   .asayoga .faq-section .accordion-s .accordion-s__text{
      font-size: 1.4rem;
   }
   .asayoga .faq-section .accordion-s .accordion-s__text:before {
      font-size: 1.5rem;
      top: 0.9em;
   }
}




/*===========================================

料金

===========================================*/
#plan {
   background: #f8f8f8;
   padding-top: 250px;
}
.plans__list {
   width: 100%;
   color: #333;
   margin: 0;
   height: 40%;
   padding: 4rem 3rem 3rem 3rem;
}
.plans__list,.plans__list:not(:first-of-type) {
   border: none;
   margin: 0;
}

.plan__box {
   background: #fff;
}

.plans__lists .plan_ttl{
   display: block;
   color: #fff;
   font-weight: bold;
   text-align: center;
   padding: 10px 0 15px;
}
.plans__lists .plan_ttl p {
   line-height: 1.3em;

}

.plans__lists .plan_ttl .plan_ttl-en{
   font-size: 3rem;
}
.plans__lists .plan_ttl .plan_ttl-jp{
   font-size: 1.5rem;
}

.plans__lists .plan_ttl-light{
   background: #92bebe;
}

.plans__lists .plan_ttl-freepass{
   background: #f9d849;
}

.plans__lists .plan_ttl-video{
   background: #7b85a1;
}

.plans__lists .plan__box .plans__list .plans__list__title{
   color: #fff;
   border-radius: 45px;
   text-align: center;
   font-size: 1.6rem;
   padding: 10px 5px;
   margin-bottom: 20px;
}

.plans__list.is-light-plan:after, .plans__list.is-one-year-plan:after {
   display: none;
}

.plans__lists .plan__box .is-light-plan .plans__list__title{
   background: #92bebe;
}

.plans__lists .plan__box .is-one-year-plan .plans__list__title{
   background: #f9d849;
}

.plans__lists .plan__box .is-video-plan .plans__list__title{
   background: #7b85a1;
}

.plans__lists .plan__box .is-light-plan .plans__list__title-4w{
   border: solid 2px #92bebe;
   background: transparent;
   color: #333;
}

.plans__lists .plan__box .is-one-year-plan .plans__list__title-4w{
   border: solid 2px #f9d849;
   background: transparent;
   color: #333;
}

.plans__lists .plan__box .is-video-plan .plans__list__title-4w{
   border: solid 2px #7b85a1;
   background: transparent;
   color: #333;
}

.freepass_plan {
   border-left: solid 2px #eee;
   border-right: solid 2px #eee;
}

.plans__list__lists__list:after {
   border-bottom: none;
   border-left: none;
   border: solid 2px #eee;
   border-radius: 50%;
   width: 20px;
   height: 20px;
   top: 1px;
}

.plans__list__lists__list,.plans__list__lists__list:not(:last-of-type){
   font-size: 1.3rem;
   position: relative;
   padding: 0 0 0 1.8em;
   margin-bottom: 15px;

}

.plans__list.is-one-year-plan .plans__list__label {
   font-size: 1.4rem;
   color: #fff;
   transform: none;
   background: #c46548;
   height: 50px;
   width: 50px;
   border-radius: 50%;
   line-height: 50px;
   position: absolute;
   right: 15%;
   top: 30px;
   left: auto;
}


@media screen and (max-width:900px) {
   .plans__lists {
      flex-direction: unset;
   }

   .plans__list.is-one-year-plan .plans__list__label {
      font-size: 1.1rem;
      color: #fff;
      height: 40px;
      width: 40px;
      line-height: 40px;
      right: 15%;
      top: 25px;
   }
}


@media screen and (max-width:600px) {
   .plans__list {
      padding: 20px;
   }
   .freepass_plan {
      border: none;
   }

   .plans__lists .plan__box .plans__list .plans__list__title{
      margin-bottom: 20px;
      padding: 5px 0;
   }

   .plans__list__description,
   .plans__list__price,
   .plans__list__lists__list {
      text-align: left;
   }

   .plans__list__price {
      margin-top: -20px;
   }

   .freepass_plan .plans__list__price {
      margin-top: -10px;
   }

   .plans__list__lists__list {
      padding: 0 0 0 2em;
   }

   .plans__list__price,
   .plans__list__price__tax {
      font-size: 1.8rem;
   }

   .plans__list__description {
      margin: 0 0 2rem 0;
   }
   .plans__list__price__number {
      font-size: 4rem;
   }

   .tabBox .tabArea {
      width: 100%;
      height: 80px;
      display: flex;
      flex-wrap: wrap;
      justify-content: space-between;
      align-items: flex-end;
   }
   .tabBox .tabArea .one_tab {
      width: 50%;
   }
   .tabBox .tabArea .one_tab a {
      display: block;
      text-decoration: none;
      transition-duration: 0.3s;
      text-align: center;
      color: #fff;
   }
   .tabBox .tabArea .one_tab a:hover {
      opacity: 0.7;
      text-decoration: none;
   }
   .tabBox .tabArea .one_tab .tab_inner {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      height: 60px;
      transition-duration: 0.3s;
   }
   .tabBox .tabArea .one_tab:nth-child(1) .tab_inner {
      background-color: #92bebe;
   }
   .tabBox .tabArea .one_tab:nth-child(2) .tab_inner {
      background-color: #f9d849;
   }
   .tabBox .tabArea .one_tab:nth-child(3) .tab_inner {
      background-color: #7b85a1;
   }
   .tabBox .tabArea .one_tab a.select .tab_inner {
      height: 70px;
   }
   .contents .tab_main {
      display: none;
      text-align: center;
      min-height: 280px;
      border: 2px solid #92bebe;
      transition-duration: 0.3s;
   }
   .tab_main.is_show {
      display: block;
      background: #fff;
      border: 2px solid #fff;
   }

   .plans__lists .plan_ttl{
      padding-bottom: 0;
   }
   .plans__lists .plan_ttl .plan_ttl-en {
      font-size: 2rem;
      margin-bottom: -5px;
   }

   .plans__lists .plan_ttl .plan_ttl-jp {
      display: block;
      width: 100%;
      font-size: 1.3rem;
      font-weight: 400;
      margin-top: -10px;
   }

   .plans__list.is-one-year-plan .plans__list__label {
      right: 15%;
      top: 10px;
   }

}

