@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100;300;400;500;700;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@300;700;900&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');
body{
  background-image:  url(../img/img_main/pc_body_bg.webp);
  background-attachment: fixed;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  overflow-x: hidden;
  font-size: 1.6em;
}
section{
    margin: 0 auto;
    width: 750px;
    max-width: 100%;
    box-sizing: border-box;
    font-family: 'Noto Sans JP', sans-serif;

}
.pc {
  display: block !important;
}
.sp {
  display: none !important;
}

@media screen and (max-width: 450px){
  
  .pc {
    display: none !important;
  }
  .sp {
    display: block !important;
  }
}
/*---header-----------------------------------------------------*/
header .header__top__wrap {
  position: fixed;
  width: 100%;
  height: 50px;
  background-color: #ffffff;
  padding: 3px 30px;
  box-sizing: border-box;
  z-index: 10;
}
header .header__top {
  display: flex;
  flex-direction: row;
  justify-content: center;
  align-items: center;
}
header .header__top div:first-child {
  margin-right: auto;
}
header .header__top li {
  display: inline;
  margin-right: 16px;
}
header .header__top .btn {
  /* background: #94e032; */
  border-radius: 20px;
  color: #fff;
  margin-left: 1em;
  padding: 6px 24px;
  font-weight: 700;
  font-size: 14px;
  background: linear-gradient(95deg, #FFE101 0%, #FFBC01 100%), #D9D9D9;
  white-space: nowrap;
}
header .header__top .btn:hover {
  /* background: #ec6762; */
  background: linear-gradient(95deg, #E5EA01 0%, #B0EE00 100%), #D9D9D9;
}
header .header__main__wrap {
  padding-top: 60px;
}
header .header__main {
  background: center center / 2500px no-repeat url("../img/bg01.png");
  padding: 60px 4%;
}
.menu {
  position: relative;
}
ul.menu li a{
  font-weight: 700;
  font-size: 14px;
}
.menu__second-level-genre {
  position: absolute;
  left: 3em;
  background: #454b4b;
  opacity: 0;
  padding: .5em 3em;
  -webkit-transition: all .2s ease;
  transition: all .2s ease;
  visibility: hidden;
  z-index: 10;
}


.menu__second-level-scene {
  position: absolute;
  left: 8em;
  right: -11em;
  background: #454b4b;
  opacity: 0;
  padding: .5em 3em;
  -webkit-transition: all .2s ease;
  transition: all .2s ease;
  visibility: hidden;
  z-index: 10;
}
@media screen and (max-width:720px) {
  .menu__second-level-genre,
  .menu__second-level-scene {
    display: none;
  }
  .menu__second-level-genre,
  .menu__second-level-scene{
    position: relative;
    left: 0;
    right: 0;
  }
  .menu__single-genre:hover .menu__second-level-genre,
  .menu__single-scene:hover .menu__second-level-scene {
    display: block;
  }
  }


.menu__single-genre:hover ul.menu__second-level-genre {
  opacity: 1;
  visibility: visible;
}
.menu__single-scene:hover ul.menu__second-level-scene {
  opacity: 1;
  visibility: visible;
}
.menu__second-level-genre li {
  padding: .3em;
}
.menu__second-level-scene li {
  padding: .3em;
}
.menu__second-level-genre li a {
  color: #94e032;
  display: list-item;
}
.menu__second-level-scene li a {
  color: #94e032;
  display: list-item;
}
header .pk li {
  margin: 0 1em;
}
header .pk {
  align-items: center;
  display: flex;
  font-size: 1.2rem;
  margin: 1em auto .5em;
  max-width: 1000px;
}
@media screen and (max-width:720px){
  header .header__top__wrap{
    height: auto;
    padding: 0;
  }
  header .header__top {
    padding: 6px 55px 6px 6px;
  }
  header .header__top ul {
    margin: 4em 0;
  }
  header .header__top li {
    display: block;
    font-size: 1.8rem;
    margin: 2em 0 0 0;
  }
  header .header__top ul.menu__second-level-genre,
  header .header__top ul.menu__second-level-scene{
    margin: 0;
  }

  
}
.globalMenuSp .sp-cta-btn{
  display: none;
}
/*------------------hamburger---------------------------------*/
@media only screen and (max-width: 767px) {
  .hamburger {
    display : block;
    position: fixed;
    z-index : 3;
    right : 10px;
    top   : 17px;
    width : 45px;
    height: 45px;
    cursor: pointer;
    text-align: center;
  }
  .hamburger span {
    display : block;
    position: absolute;
    width   : 30px;
    height  : 2px ;
    left    : 13px;
    background : #94e032;
    -webkit-transition: 0.3s ease-in-out;
    -moz-transition   : 0.3s ease-in-out;
    transition        : 0.3s ease-in-out;
  }
  .hamburger span:nth-child(1) {
    top: 0px;
  }
  .hamburger span:nth-child(2) {
    top: 10px;
  }
  .hamburger span:nth-child(3) {
    top: 20px;
  }
  .hamburger.active span:nth-child(1) {
    top : 10px;
    left: 13px;
    -webkit-transform: rotate(-45deg);
    -moz-transform   : rotate(-45deg);
    transform        : rotate(-45deg);
  }
  .hamburger.active span:nth-child(2),
  .hamburger.active span:nth-child(3) {
    top: 10px;
    -webkit-transform: rotate(45deg);
    -moz-transform   : rotate(45deg);
    transform        : rotate(45deg);
  }
  .globalMenuSp {
    position: fixed;
    z-index: 0;
    top  : 0;
    left : 0;
    color: #fff;
    background: #454b4b;
    text-align: center;
    transform: translateY(-100%);
    transition: all 0.6s;
    width: 100%;
    padding-bottom: 80px;
  }
  .globalMenuSp.active {
    transform: translateY(0%);
    overflow-y: scroll;
    height: 700px;
  }
  .globalMenuSp a:link,
  .globalMenuSp a:visited,
  .globalMenuSp a:hover,
  .globalMenuSp a:active {
    color: #94e032;
    font-size: 1.8rem;
  }


  @media screen and (max-width:720px) {
    .globalMenuSp .sp-cta-btn{
      display: flex;
      flex-direction: column;
    }
  }
.globalMenuSp a.sp-cta-btn{
  color: #fff;
  max-width: 230px;
  width: 100%;
  margin: auto;
  display: block;
}
  .menu__second-level {
    position: initial;
    background: none;
    margin: 0 !important;
    opacity: 1;
    padding: 0;
    visibility: visible;
  }
  .menu__second-level li {
    padding: 0;
  } 
}
.fv{
    position: relative;
    height: 100vh;
    background-image: url(../img/img_main/fv_bg.webp);
    background-repeat: no-repeat;
    background-position: center 50px;
    background-size: cover;
}

.fv::after {
    position: absolute;
    content: '';
    right: 0;
    top: 50px;
    background-image: url(../img/img_main/fv_poptext.svg);
    width: 202px;
    height: 202px;
    background-size: cover;
}

@media (max-width:720px) {

.fv::after{
  top: 54.5px;
  width: 101px;
  height: 101px;
}

}

@media (max-width:480px) {

.fv{
  height: 485px;
}

}

.fv_cont{
  width: auto;
  position:absolute;
  bottom: 30px;
}
.fv_cont article{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  margin: 0 auto 4%;
  padding-left: 30px;
}
.fv_cont article h1{
    z-index: 0;
    font-size: clamp(28px,5.2vw,52px);
    font-weight: 700;
    line-height: 1.2;
    color: #000;
    text-shadow:1px 1px 0 #FFF, -1px -1px 0 #FFF,
                -1px 1px 0 #FFF, 1px -1px 0 #FFF,
                0px 1px 0 #FFF,  0-1px 0 #FFF,
                -1px 0 0 #FFF, 1px 0 0 #FFF;
}
.fv_cont article h1 span{
    font-size: clamp(25px,5vw,50px);
}
.fv_cont ul{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
}
.fv_cont ul li{
    width: 23%;
    margin-right: 4px;
}
.fv_cont ul li:last-child{
    margin-right: 0;
}
.fv_cont ul li img{
  width: 100%;
}

@media(max-width:450px){
.fv_cont article{
  padding-left: 15px;
}

}

  /* form */

  .form{  
    padding: 30px;
    background-color: #ffffff;
  }
  .form h3 img{
    width: 60%;
    margin: 0 0 30px 0;
  }

  .form h3 {
    text-align: center;
  }

  .form-title {
    text-align: center;
  }

  img.two_weeks{
    width: 100%;
    max-width: 578px;
    margin: 0 0 40px 0;
  }
  input,textarea {
    font-size: 16px;
  }
  .form_req {
    background: #ff4e6a;
    border-radius: 5px;
    color: #fff;
    font-size: 10px;
    margin-left: 8px;
    padding: 4px 8px;
  }
  form input.txt {
    background: #f7f7f7;
    border: 1px solid #eee;
    border-radius: 6px;
    margin: 8px 0 30px;
    padding: 10px 2%;
    width: 96%;
  }
  form textarea.txt2 {
    background: #f7e8b2;
    border: 1px solid #fff;
    border-radius: 6px;
    margin: 8px 0;
    padding: 16px 2%;
    width: 96%;
    height: 150px;
  }
  form input.txt3 {
    background: #f7f7f7;
    border: 1px solid #ddd;
    border-radius: 8px;
    margin: 8px 70% 16px 0;
    padding: 16px 2%;
    width: 26%;
  }
  ::-webkit-input-placeholder {
    color: #cacaca;
    font-size: 1.6rem;
  }
  .formtext{
    margin-top: 1rem;
  }
  .formtext2{
    margin-top: 1rem; 
    line-height: 1.2;
    font-size: 12px;
  }
  .btn__submit{
    background: linear-gradient(to right, #ff4e6a, #ff6f86);
    border: 1px solid #fff;
    border-radius: 10px;
    color: #fff;
    cursor: pointer;
    display: table;
    filter: drop-shadow(0 4px 0 rgba(0,0,0,0.1));
    font-size: 21px;
    font-weight: 700;
    margin: 16px auto 0;
    width: 100%;
    padding: 8px;
    line-height: 1.2;
    letter-spacing: 0.01rem;
    transition: .4s;
  }
  .btn__submit:hover {
    background: #FF4E6A;
    opacity: 0.3;
  }
  .btn__submit span{
    font-size: 18px;
    letter-spacing: 0.1rem;
  }

  @media (max-width:450px) {

  .form h3 img{
  width: 90%;
  }

  }
  /*select*/
  .select__wrap {
    align-items: flex-end;
    display: flex;
    flex-wrap: wrap;
    margin: 8px 0 16px;
  }
  select {
    background: #f7f7f7;
    border: 1px solid #ddd;
    border-radius: 24px;
    -webkit-appearance:none;
    font-size: 16px;
    margin-bottom: 4px;
    padding: 16px 10%;
    width: 100px;
  }
  .select {
    position: relative;
  }
  .select::after {
    position: absolute;
    content: '';
    border-left: 3px solid transparent;
    border-right: 3px solid transparent;
    border-top: 5px solid #454e56;
    top: 42%;
    right: 12%;
  }
  .select:not(:first-child) {
    margin-left: 16px;
  }
  /*radio*/
  .radio__wrap {
    line-height: 3rem;
    margin: 5px 0 24px;
  }
  .radio__wrap2 {
    margin: 16px 0 24px;
  }
  .radio__wrap3 {
    align-items: center;
    display: flex;
    flex-wrap: wrap;
    line-height: 3rem;
  }
  input {
    font-size: 16px;
  }
  .radio-container{
    display: flex;
    flex-direction: row;
    justify-content: flex-start;
    align-items: center;
    margin: 0 5px 0 0;
  }
  
  @media screen and (max-width: 450px){
    .form{
      width: 750px;
      box-sizing: border-box;
      box-shadow: none;
      background-color: #ffffff;
      margin: 0;
    }

    input, textarea{
      font-size: 16px;
    }
    
    ::placeholder {
      color: #cccccc;
      /* font-size: 30px; */
    }
    
    .radio{
      margin: 0 10px 0 0;
      transform: scale(1.5);
    }
    .btn__submit{
      font-size: 20px;
      border-radius: 10px;
    }
    .btn__submit span{
      font-size: 18px;
      letter-spacing: 0.1rem;
    }
  }
  .cont1{
    background-image:  url(../img/img_main/cont1_bg.webp);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    padding: 80px 20px;
    box-sizing: border-box;
  }
  .cont1 h2{
    font-family: 'Roboto', sans-serif;
    font-weight: 700;
    font-size: 34px;
    color: #ffffff;
    text-align: center;
  }
  .cont1 h3{
    font-family: 'Noto Sans JP', sans-serif;
    font-weight: 600;
    font-size: 34px;
    color: #ffffff;
    margin: 0 0 10px 0;
  }
  .cont1 p{
    margin: 0 0 30px 0;
    color: #ffffff;
    text-align: center;
  }
  .cont1 img{
    width: 90%;
  }
  .cont2{
    background-image:  url(../img/img_main/cont2_bg.png);
    background-color: #ECECEC;
    background-repeat: no-repeat;
    background-position: top;
    background-size: contain;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    padding: 80px 0;
    box-sizing: border-box;
  }
  .cont2 h2{
    font-size: clamp(25px,5vw,50px);
    font-weight: 700;
    margin: 0 0 30px 0;
    margin-left: 0;
    margin-right: auto;
    padding-left: 10%;
  }
  .cont2 article{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 0 30px 0;
  }
  .cont2 article p{
    width: 80%;
    font-size: 20px;
    font-weight: 400;
    margin: 25px 0 25px 0;
  }
  img.cont2_1{
    margin-bottom: -25px;
    z-index: 5;
    width: 80%;
  }
  .cont2_2_wrap{
    background-color: #ffffff;
    border-radius: 30px;
    padding:66px 20px;
    box-sizing: border-box;
    width: 90%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
  }

  .cont2_2_wrap article h3{
    width: 100%;
    font-size: 35px;
    font-weight: 700;
    text-align: center;
    margin: 0 0 30px 0;
  }

  .cont2_2_wrap article h4{
    margin-top: 60px;
  }
  @media screen and (max-width: 450px){
    .cont2 article p{
      font-size: 12px;
      font-weight: 500;
    }
    .cont2_2_wrap article{
      width: 90%;;
    }

    .cont2_2_wrap article h3 {
    font-size: 18px;
    font-weight: 700;
    line-height: 1.8;
}
    
  }

  .cont3{
    position: relative;
    background-color: #ECECEC;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    box-sizing: border-box;
    padding-bottom: 80px;
  }

  .cont3::after{
    content: "";
    position: absolute;
    bottom: -60px;
    left: calc(50% - 15px);
    margin-left: -15px;
    border: 30px solid transparent;
    border-top: 30px solid #ECECEC;
  }

  .cont3_inner{
    width: 90%;
    border-radius: 10px;
    padding: 30px;
    box-sizing: border-box;
    background-image:  url(../img/img_main/cont3_bg.webp);
    background-repeat: no-repeat;
    background-position: top;
    background-size: cover;
  }
  .cont3_inner h2{
    color: #ffffff;
    font-size: clamp(18px,2.5vw,25px);
    font-weight: 600;
    padding-bottom: 15px;
  }
  .cont3_inner div{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border-top: 1px dashed #ffffff;
    padding: 15px 0;
  }
  .cont3_inner div li h4{
   color: #ffffff;
   font-weight: 600;
   font-size: clamp(16px,2.5vw,27px);
    margin-bottom: 5px;
  }
  .cont3_inner div li{
    color: #ffffff;
    font-size: clamp(14px,2vw,21px);
    font-weight: 300;
    line-height: 1.7;
  }
  .cont3_inner div img{
    height: auto;
    margin: 0 30px 0 0;
    width: 100px;
  }

@media(max-width:768px){

.cont3_inner div img{
  width: 50px;
  margin-right: 15px;
}

.cont3_inner{
  padding: 30px 15px;
}



}

  a.free_button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 1;
    text-decoration: none;
    color: #ffffff;
    font-size: 27px;
    margin: 50px auto;
    transition: 0.3s;
    background-image: linear-gradient(180deg, rgb(128 176 3), rgb(104 131 35));
    background: url(../img/img_main/gr_btn_bg.svg) no-repeat;
    background-position: center;
    background-size: contain;
    width: 495.92px;
    height: 125.043px;
    flex-shrink: 0;
  }

  a.free_button::after{
    content: '';
    width: 9px;
    height: 9px;
    border: 0;
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
    position: absolute;
    top: 50%;
    right: 25px;
    margin-top: -4px;
    transform: rotate(45deg);
  }

  .cv{
    padding: 60px 0;
    background-color: #fff;
  }
  a.free_button:hover {
    box-shadow: 0 0 rgba(0, 0, 0, 0);
  }
  a.free_button span{
    font-size: 83px;
    font-weight: 500;
    padding: 0 10px 5px;
  }
  .cont4{
    margin: 0 auto;
    padding: 80px 0px 30px;
    box-sizing: border-box;
    background-color   : #cbe905;
    background-image: radial-gradient(#ffffff8a 13%, transparent 16%),
                         radial-gradient(#ffffff80 13%, transparent 16%);
    background-position: 0 0, 19px 19px;
    background-size    : 38px 38px;
  }
  .cont4_inner{
    max-width: 90%;
    margin: 0 auto;
  }
  .cont4 h3{
    font-size: 16px;
    font-weight: 600;
    text-align: center;
  }
  .cont4 h2{
    font-size: clamp(20px,3vw,30px);
    font-weight: 700;
    text-align: center;
    line-height: 1.2;
    letter-spacing: 0.05em;
  }
  .cont4 h2 .liner{
    font-size: clamp(30px,4vw,40px);
    font-weight: bold;
    text-align: center;
    background: #9455dc;
    background: -webkit-linear-gradient(300deg, #9455dc 20%, #ec5d57 30%, #d357ec 100%);
    background: linear-gradient(300deg, #9455dc 20%, #ec5d57 30%, #d357ec 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
  }

   .cont4 h2 .liner.big {
    font-size: clamp(60px,8vw,80px);
   }
  .cont4 h5{
    font-size: 40px;
    font-weight: 700;
    text-align: center;
    line-height: 1;
    margin: 0 0 30px 0;
  }
  .cont4_1,
  .cont4_2,
  .cont4_3,
  .cont4_4{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto 50px;
  }
  .cont4_1 img,
  .cont4_2 img,
  .cont4_3 img,
  .cont4_4 img{
    max-width: 90%;
    margin: 0 auto;
  }
  .cont4_1 article,
  .cont4_2 article,
  .cont4_3 article{
    width: 90%;
    margin-top: 1em;
  }
  .cont4_1 article p,
  .cont4_2 article p,
  .cont4_3 article p{
    font-size: 16px;
  }

  .cont4_3 > h3 {
    font-size: 20px;
    margin-bottom: 20px;
  }

  @media screen and (max-width: 450px){
    .cont4_1 article p,
    .cont4_2 article p,
    .cont4_3 article p{
      font-size: 14px;
      font-weight: 500;
    } 
  }
  .cont5{
    z-index: -10;
    padding-top: 80px;
    background: rgb(173,0,255);
    background: linear-gradient(196deg, rgba(173,0,255,1) 0%, rgba(92,12,193,1) 30%, rgba(178,0,255,1) 58%, rgba(255,0,161,1) 99%);
    background: url(../img/img_main/course_bg.png) no-repeat center/cover;
  }
  .cont5_inner{
    max-width: 100%;
    margin: 0 auto;
  }
  .cont5 h3{
    color: #ffffff;
    font-size: clamp(17px,3vw,34px);
    font-weight: 600;
    margin: 0 auto 20px;
    text-align: center;
  }
  .cont5 h2{
    color: #ffffff;
    font-size: clamp(24px,4vw,43px);
    font-weight: 700;
    text-align: center;
    line-height: 1.2;
    margin: 0 0 26px 0;
  }
  .cont5 article p{
    color: #ffffff;
    font-size: clamp(14px,2vw,20px);
    font-weight: 300;
    text-align: center;
    margin-bottom: 80px;
    padding: 0 20px;
  }
  .cont5_3{
    padding-bottom: 50px;
  }
  .cont5_1 p,
  .cont5_2 p,
  .cont5_3 p{
    color: #ffffff;
    text-align: center;
    font-family: 'Roboto', sans-serif;
    margin-bottom: 1rem;
    font-size: clamp(12px,2vw,20px);
    letter-spacing: 0.1em;
  }
  .cont5_1 h3,
  .cont5_2 h3,
  .cont5_3 h3{
    font-size: clamp(18px,2.6vw,26px);
    margin-bottom: 2rem;
    letter-spacing: 0.1em;
  }
  .cont5_1 img,
  .cont5_2 img,
  .cont5_3 img{
    width: 100%;
    margin-bottom: 30px;
  }
  
  .cont6{
    margin: 0 auto;
    background-color: #fff;
  }

  .cont6 > h2{
    text-align: center;
    padding-top: 50px;
    font-size: 23px;
  }

  .cont6 dl{
    width: 85%;
    bottom: -50px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
    filter: drop-shadow(3px 3px 3px rgba(3, 0, 0, 0.30));
  }
  .cont6 dl dt{
    font-size: clamp(16px,3.2vw,32px);
    text-align: center;
    color: #ffffff;
    line-height: 2.2;
    background-color: #FB506D;
  }
  .cont6 dl dd{
    background-color: #ffffff;
    padding: 15px 30px;
  }
  .cont6 dl dd ul li{
    font-size: clamp(15px,3vw,30px);
    font-weight: 700;
    text-align: center;
  }
  .cont6 dl dd ul li:first-child{
    border-bottom: 1px solid #000000;
  }
  .cont6 dl dd ul li:last-child{
    font-size: clamp(9px,1.8vw,18px);
    font-weight: 200;
  }
  .cont6 dl dd ul li span{
    font-family: 'Roboto', sans-serif;
    color: #FB506D;
    font-size: clamp(45px,9vw,90px);
    font-weight: 700;
  }
  .cont6 dl dd ul li span.tate{
    font-family: 'Noto Sans JP', sans-serif;
    -ms-writing-mode: tb-rl;
    writing-mode: vertical-rl;
    font-size: clamp(16px,3.3vw,33px);
  }  
  .cont6 dl dd ul li small{
    color: #FB506D;
    font-size: clamp(15px,3vw,30px);
  }
  .cont6_1{
    padding: 50px 0 50px 0;
    box-sizing: border-box;
    background-size: 750px;
    background-color: rgba(251, 217, 34, 1);
    background-image: repeating-linear-gradient(45deg, transparent, transparent 14px, rgba(249, 204, 19, 1) 14px, rgba(249, 204, 19, 1) 24px )
  }
  .cont6_1 article{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }
  .cont6_1 article p{
    font-size: clamp(21px,4.2vw,42px);
    font-weight: 700;
  }
  .cont6_1 article p span{
    color: #FB506D;
    font-size: clamp(82px,16.4vw,164px);
    margin-left: 15px;
  }
  .cont6_1 article p small{
    color: #FB506D;
    font-size: clamp(25px,4.9vw,49px); 
  }
  .cont6_2{
    width: 90%;
    background-color: #ffffff;
    border-radius: 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    padding: 30px;
    box-sizing: border-box;
  }

  .cont6_2 > h2 {
    text-align: center;
    font-size: 14px;
  }

  .cont6_2 h3{
    text-align: center;
  }
  .cont6_2 > h3 span{
    position:relative;
    font-size: clamp(15px,3.3vw,33px);
    text-align: center;
    color: #AF881A;
  }
  .cont6_2 > h3 span::before{
    position: absolute;
    content: '';
    left: -90px;
    background: url(../img/img_main/cont6_2_h4_before.webp);
    width: 80px;
    height: 20px;
    width: 79.846px;
    height: 18.846px;
    flex-shrink: 0;
    top: 50%;
    transform: translateY(-50%);
    background-size: contain;
  }
  .cont6_2 > h3 span::after{
    position: absolute;
    content: '';
    right: -90px;
    background: url(../img/img_main/cont6_2_h4_after.webp);
    width: 79.846px;
    height: 18.846px;
    flex-shrink: 0;
    top: 50%;
    transform: translateY(-50%);
    background-size: contain;
  }

  @media (max-width:450px){

    .cont6_2 > h3 span::before,
    .cont6_2 > h3 span::after{
      width: calc(79.846px / 2);
      height: calc(18.846px / 2);
    }

    .cont6_2 > h3 span::before{
      left: -45px;
    }

    .cont6_2 > h3 span::after{
      right: -45px;
    }

  }
  /* .cont6_2 h3 span{
    font-size: clamp(27px,5.5vw,55px);
    text-align: center;
    color: #AF881A;
  } */
  .cont6_2 img.no1{
    width: 90%;
    margin: 10px 0 30px 0;
  }
  .cont6_3{
    width: 100%;
    padding: 40px 0;
    box-sizing: border-box;
    background-image: url(../img/img_main/cont6_3_frame.webp);
    background-repeat: no-repeat;
    background-position: top;
    background-size: contain;
  }
  .cont6_3 h3{
    color: #AF881A;
    font-size:clamp(18px,3.2vw,32px);
    text-align: center;
  }
  .cont6_3 h3 span{
    color: #000000;
  }
  .cont6_3 .evaluation{
    display: flex;
    flex-direction: row;
    column-gap: 10px;
    justify-content: center;
    align-items: center;
  }
  .cont6_3 .evaluation img{
    width: 35%;
    margin: 10px 0 10px 0;
  }
  .cont6_3 .point3{
    display: flex;
    flex-direction: row;
    column-gap: 5px;
    justify-content: center;
    align-items: center;
    z-index: 10;
  }
  .cont6_3 .point3 img{
    width: 38%;
  }
  .cont7{
    padding: 50px 20px;
    box-sizing: border-box;
    background: rgb(173,0,255);
    background: linear-gradient(196deg, rgba(173,0,255,1) 0%, rgba(92,12,193,1) 25%, rgba(178,0,255,1) 50%, rgba(255,0,161,1) 75%, rgba(255,136,0,1) 99%);
  }
  .cont7 h2 {
    text-align: center;
    color: #fff;
  }
  .cont7_inner{
    background-color: #F0F0F0;
    border-radius: 30px;
    width:95%;
    margin: 0 auto;
    padding: 30px 0;
    box-sizing: border-box;
    margin-top: 20px;
  }


  .cont7_inner h2 img {
    width: 80%;
  }

  @media (max-width:450px) {

.cont7_inner{
  width: 100%;
}

  }
  .cont7 h3{
    color: #ffffff;
    font-size: clamp(25px,4.9vw,49px);
    font-weight: 700;
    text-align: center;
    line-height: 1.2;
    padding: 0 0 40px 0;
    background-image:  url(../img/img_main/cont7_h3_bg.webp);
    background-repeat: no-repeat;
    background-position: top;
    background-size: contain;
  }
  .cont7 h3 span{
   font-size: clamp(18px,3vw,30px); 
  }
  
  @media (max-width:450px){

    .cont7 h3{
      padding: 0 0 20px 0;
    }

  }

  .cont7 .slick-next:before,
  .cont7 .slick-prev:before{
    content: none;
  }

  .cont7 .slick-prev, .cont7 .slick-next{
    position: absolute;
    top: 42%;
    cursor: pointer;
    outline: none;
    border-top: 2px solid #666;
    border-right: 2px solid #666;
    height: 21px;
    width: 21px;
  }

  .cont7 .slick-slide{
    padding: 0 15px;
  }

  .cont7 .slick-prev{
    transform: rotate(-135deg);
    left: 20px!important;
  }

  .cont7 .slick-next{
    transform: rotate(45deg);
    right: 20px!important;
  }

  @media (max-width:450px){

    .cont7 .slick-prev, .cont7 .slick-next{
      width: 15px;
      height: 15px;
    }

    .cont7 .slick-next{
      right: 12px!important;
    }

    .cont7 .slick-prev{
      left: 12px!important;
    }

  }

  .custumer_supoort{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    padding: 50px 0px;
    box-sizing: border-box;
    background-color: #f8ebd1;
    /* background: repeating-linear-gradient(-45deg, #ffae00, #ffae00 5px, #fce6ba 5px, #fce6ba 10px); */
  }
  .custumer_supoort div{
    width: 90%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
    background-color: #ffffff;
    border-radius: 10px;
    padding: 40px 30px;
    box-sizing: border-box;
    box-shadow: 0 0 20px rgba(0,0,0,0.15);
  }
  .custumer_supoort h3{
    font-size: clamp(20px,3.4vw,34px);
    font-weight: bold;
    margin: 0 0 30px 0;
    padding: 5px 0;
    /* background-color: #ffae00; */
    border-bottom: 6px solid #ffae00;
    color: #ffae00;
    /* text-shadow: 0px 2px 2px #9c6d09; */
  }
  .custumer_supoort article{
    width: 90%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
  }
  .custumer_supoort p{
    font-size: clamp(14px,1.8vw,18px);
    line-height: 1.6;
    color: #222;
    margin: 0 0 30px;
  }
  .custumer_supoort img{
    width: 90%;
    border: 3px solid #ffae00;
  }
  @media screen and (max-width: 450px){
    
    .custumer_supoort div{
      padding: 20px 20px 40px;
    }
    .custumer_supoort h3{
      margin: 0 0 15px;
    } 
    .custumer_supoort article{
      width: 90%;
    } 
    .custumer_supoort p{
      margin: 0 0 15px;
    }
    .custumer_supoort img{
      width: 90%;
    }
  }
  .faq{
    background-color: #fff;
    padding: 40px 0;
    box-sizing: border-box;
  }

  .faq-title {
    width: 60%;
    margin: 0 auto 20px;
  }

  .faq h4{
    color: #80B004;
    font-size: 41px;
    font-weight: 700;
    font-family: 'Roboto', sans-serif;
    text-align: center;
  }
  .faq h3{
    width: fit-content;
    color: #ffffff;
    background-color: #80b003;
    border-radius: 30px;
    font-size: 60px;
    font-weight: 700;
    font-family: 'Noto Sans JP', sans-serif;
    text-align: center;
    margin: 0 auto 15px;
    padding: 5px 30px;
  }
  .faq article{
    width: 90%;
    margin: 0 auto 30px;
  }
  .qablock{
    position: relative;
    padding: 10px 0;
    width: 90%;
    margin: auto;
  }
  .question_txt{
    box-sizing: border-box;
    text-align: left;
    position: relative;
    border-bottom: 1px solid #3788ba;
    padding-bottom: 15px;
    padding-left: 34px;
  }
  /* .question_txt::before{
    content: url(../img/img_main/Q.webp);
    display:inline-block;
    width: 40px;
    position: relative;
    top: 20px;
  } */

  .qicon img{
    width: 20px;
    margin-right: 15px;
  }

  .question_txt::before {
    position: absolute;
    content: '';
    width: 20px;
    height: 25px;
    background: url(../img/Q.webp) no-repeat;
    left: 0;
    top: 0;
    background-size: contain;
  }

  .answer_txt{
    position: relative;
    background: #fff;
    padding: 10px 0;
    text-align: left;
  }

  .answer_txt::before {
    position: absolute;
    content: '';
    width: 20px;
    height: 20px;
    background: url(../img/A.webp) no-repeat;
    left: 0;
    top: 12px;
    background-size: contain;
  }

  .answer_txt p{
    padding-left: 34px;
  }
  /* .answer_txt p::before{
    content: url(../img/img_main/A.webp);
    display:inline-block;
    width:40px;
    position: relative;
    top: 15px;
  } */
  /* .show_button{
    position: absolute;
    bottom:0px;
    right:0px;
    width:43px;
    height:43px;
  } */
  .show_button:after{
    position: absolute;
    content: '▼'!important;
    text-align: center;
    width: 43px;
    height: 43px;
    line-height: 43px;
    top: 27px;
    transform: translateY(-50%);
    right: 0;
    color: #3788ba;
  }
  /* .show_button.closebutton:after{
    position: absolute;
    content: '▼'!important;
    display: block;
    text-align: center;
    width: 43px;
    height: 43px;
    line-height: 43px;
    top: -8px;
    left: 0;
    margin-left: 0px;
    margin-top: 0px;
    color:#b4ada9;
  } */
  @media screen and (max-width: 450px){

    .faq-title{
      width: 90%;
    }
    
    .faq article p{
      font-size: 24px;
      font-weight: 700;
    }

    .show_button:after{
      top: 23px;
      right: -10px;
    }
   
  }

  .form.second {
    padding: 0 0 50px;
  }

  .form.second form {
    width: 90%;
    margin: auto;
  }
  .cont8{
    background-color: #9DB81A;
    padding: 30px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto;
  }
  .cont8 img.logo{
    margin: 0 0 20px 0;
  }
  .cont8 h3{
    color: #ffffff;
    font-size: clamp(15px,3vw,30px);
    font-weight: 600;
    margin: 0 0 20px 0;
  }
  .cont8 div.app_btn{
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
  }
  .cont8 div.app_btn article p{
    color: #ffffff;
    font-size: 16px;
    font-weight: 300;
  }

  .cont8 div.app_btn img {
    height: 94px;
  }

  .cont8 article{
    width: 90%;
    margin: 0 auto;
  }
  .cont8 article p{
    color: #ffffff;
    font-weight: 200;
    margin-top: 20px;
  }

  @media (max-width:450px) {

    .cont8 img.logo{
      width: 50%;
    }

    .cont8 div.app_btn img{
      height: 47px;
    }

    .cont8 article p{
      font-size: 10px;
      margin-top: 10px;
    }

  }
  .company_info{
    background: #f7f7f7;
    padding: 50px 10px;
  }
  .company_info h3{
    font-size: 2.0rem;
    text-align: center;
    margin: 0 0 20px 0;
  }
  .company_info_wrap {
    margin: 0 auto 50px;
    text-align: left;
  }
  .company_info dt{
    font-weight: 700;
  }
  .company_info dd{
    margin: 0 0 20px 0;
  }
  .company_info a{
    text-align: center;
    font-size: 14px;
  }
  
  footer {
    max-width: 750px;
    width: 100%;
    margin: auto;
    background: #454b4b;
    color: #fff;
    padding: 45px 20px 10px;
    box-sizing: border-box;
  }
  footer .inner {
    max-width: 750px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin: 0 auto 5em;
  }
  footer .inner div.sec1{
    margin: 0 0 30px 0;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
  footer .inner div.sec1 img {
      margin-bottom: 2em;
  }
  footer .inner div.sec2{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 30px;
    max-width: 750px;
    width: 100%;
    font-size: 14px;
  }
  footer .inner div.sec2 ul {
      /* font-weight: 700; */
  }
  footer .inner div.sec2 ul li:first-child{
    font-weight: bold;
  }
  footer .inner div.sec2 ul li {
      margin-bottom: 0.6em;
      text-align: left;
  }
  footer .inner div.sec2 ul li a {
      color: #fff;
      text-align: left;
  }
  footer .t1 {
      font-size:14px;
      text-align: center;
  }
  @media screen and (max-width: 450px){
    footer {
        padding: 32px 4% 8px;
    }
    footer .inner {
        margin: 15px auto;
        display: flex;
        flex-direction: column;
        justify-content: flex-start;
        align-items: flex-start;
        /* margin: 0 auto; */
    }
    footer .inner div.sec1 {
        margin-bottom: 2em;
        width: 100%;
    }
    footer .inner div.sec1 img {
        display: block;
        margin: 0 auto 2em;
    }
    footer .inner div.sec2{
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      justify-content: flex-start;
      align-items: flex-start;
    }
    footer .inner div.sec2 ul  {
        font-size: 1.4rem;
    }
    footer .inner div.sec2 ul {
        margin-bottom: 0.8em;
    }
    
    
  }  
/* 下部追従*/
.cont_fixed{
  width: 100%;
}
#fixed-menu{
  position: fixed;
  width: 100%;
  bottom: -9px;
  z-index: 99;
  height: 150px;
  background-color: #FFFE37;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  flex-direction: column;
}

#fixed-menu > img {
  max-width: 280px;
}
 #fixed-menu img{
  top: -29px;
  width: 28%;
  margin: 0 0 4px 0;
} 
#fixed-menu > a {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  margin: 0 auto;
  padding: 0;
  margin-top: -28px;
  width: auto;
}
#fixed-menu a img{
  width: 70%;
}
  @media screen and (max-width: 450px){ 

    #fixed-menu{
      height: 100px;
      padding-bottom: 10px;
    }
    
    #fixed-menu img{
      position: relative;
      top: 10px;
      width: 50%;
    } 
    #fixed-menu a img{
      width: 100%;
    }
    a.free_button{
    width: 80%;
    height: 90px;
    margin: 0 auto;
    font-size: 16px;
    font-weight: 500;
   }
    a.free_button span{
    font-size: 42px;
    padding: 0 5px 5px 10px;
    }

    a.free_button::after{
      right: 15px;
    }
}



/* 1129追加 */

.h2-title{
  font-size: 4rem;
  font-weight: 700;
  line-height: 1.5;
}
.h2-title span{
  font-size: 3rem;
}
.h3-title{
  font-size: 3rem;
  font-weight: 700;
  line-height: 1.5;
}
.text {
  font-size: 1.6rem;
  line-height: 1.5;
}
@media screen and (max-width: 720px){
  .h2-title{
    font-size: 2.4rem;
  }
  .h2-title span{
    font-size: 1.8rem;
  }
  .h3-title{
  font-size: 1.8rem;
  }
}


.top-genre {
  background-image: url(/assets/img/genre_bg.webp);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center ;
}
.top-genre .h2-title {
  text-align: center;
  padding-top: 130px;
}
.top-genre__contents {
  margin: auto;
  margin-top: 80px;
  max-width: 90%;
  width: 100%;
  display: flex;
  flex-direction: column;
  row-gap: 50px;
padding-bottom: 80px;
}

.top-genre__item {
  display: flex;
  column-gap: 20px;
  width: 100%;
}

.top-genre__image {
  width: 45%;
}

.top-genre__body {
  padding: 20px 0;
  display: flex;
  flex-direction: column;
  row-gap: 20px;
width: 55%;
}

.h3-title {

}



.top-genre__btn{
  border-radius: 20px;
  background: linear-gradient(92deg, #A010FE 6.98%, #F3239A 94.5%), linear-gradient(114deg, #FFEB00 -20.84%, #FFC900 55.38%, #FFB900 105.68%), linear-gradient(92deg, #FF10FE 6.98%, #F3239A 94.5%);
  max-width: 200px;
  width: 100%;
  color: #fff;
}
.top-genre__btn a{
  color: #fff;
  font-weight: bold;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  padding: 10px 0;
}
.top-genre__btn a:hover{
  opacity: .7;
}