@charset "UTF-8";
/* CSS Document */

body{
    margin: 0;
}

.sp{
    display: none;
}

.pc{
    display: inherit;
}


/*動き*/
.kv_fadein {
  opacity: 0;
  transform: translateY(20px);
}

.kv_fadein.animate {
  animation: kv_fadein 1s ease forwards;
}

@keyframes kv_fadein {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/**/
/* 新しく追加するふわふわアニメーション */
.kv_fadein.fuwafuwa {
    animation: fuwafuwa 3s ease-in-out infinite alternate;
    opacity: 1;
}

@keyframes fuwafuwa {
    0% {
        transform: translate(0, 0) rotate(0deg);
    }
    30% {
        transform: translate(0, 0) rotate(2deg);
    }
    70% {
        transform: translate(0, 0) rotate(0deg);
    }
    100% {
        transform: translate(0, 0) rotate(2deg);
  }
}
/**/

.fadein_element {
    opacity: 0;
    visibility: hidden;
    transform: translateY(30px);
    transition: opacity 1s, visibility 1s, transform 1s;
}

.fadein_element_is_fadein {
    opacity: 1;
    visibility: visible;
    transform: translateX(0);
    left: 0;
    right: 0;
}

.shivering,
#about .wchance::before{
    animation: shivering 2s linear infinite;
}

@keyframes shivering{
    0%, 7% {
        transform: rotateZ(0);
    }
    15% {
        transform: rotateZ(-10deg);
    }
    20% {
        transform: rotateZ(5deg);
    }
    25% {
        transform: rotateZ(-5deg);
    }
    30% {
        transform: rotateZ(3deg);
    }
    35% {
        transform: rotateZ(-2deg);
    }
    40%, 100% {
        transform: rotateZ(0);
    }
}

/*buruburu-hover*/
.buruburu_hover:hover {
    display: block;
    animation: hurueru .1s  infinite;
}

@keyframes hurueru {
    0% {transform: translate(0px, 0px) rotateZ(0deg)}
    25% {transform: translate(1%, 0px) rotateZ(1deg)}
/*    50% {transform: translate(0px, 1px) rotateZ(0deg)}*/
/*    75% {transform: translate(1px, 0px) rotateZ(-1deg)}*/
    100% {transform: translate(0px, 0px) rotateZ(0deg)}
}

/* fuwafuwa */
@keyframes fuwafuwa-uesita {
  0%   { transform: translateY(-8px); }
  50%  { transform: translateY(8px); }
  100% { transform: translateY(-8px); }
}

@keyframes fuwafuwa-uesita2 {
  0%   { transform: translateY(8px); }
  50%  { transform: translateY(-8px); }
  100% { transform: translateY(8px); }
}



.fuwafuwa-uesita2 {
    animation: fuwafuwa-uesita2 3s linear infinite;
/*    animation-delay: 3s;*/
} 

/* fuwafuwa-uesita */
.fuwafuwa-uesita{
    animation: fuwafuwa-uesita 3s linear infinite;
} 

@keyframes fuwafuwa-uesita {
  0% { transform: translateY(0) }
  50% { transform: translateY(10px) }
  100% { transform: translateY(0) }
}

/*fuwafuwa*/
/*
.fuwafuwa{
  animation: fuwafuwa 3s infinite ease-in-out .8s alternate;
  display: inline-block;
  transition: 1.5s ease-in-out;
}
 
@keyframes fuwafuwa {
  0% {
    transform:translate(0, 0) rotate(-3deg);
  }
  50% {
    transform:translate(0, -7px) rotate(0deg);
  }
  100% {
    transform:translate(0, 0) rotate(3deg);
  }
}
*/

/*yurayura*/
.yurayura,
.package_02 div::before{
    transform-origin: center bottom;
    animation: yurayura 2s linear infinite;
}

@keyframes yurayura {
  0% , 100%{
      transform:translate(0, 0)  rotate(3deg);
  }
  50%{
      transform:translate(0, 0)  rotate(-3deg);
  }
}

/* slidein_shu_left */
.slidein_shu_left{
    opacity: 0;
    visibility: hidden;
    z-index: 0;
    position: relative;
}
.slidein_shu_left_move {
    animation: slidein_shu_left_move 3s 1;
    opacity: 1;
    visibility: visible;
}

@keyframes slidein_shu_left_move {
  0% {
    opacity: 0;
    transform: translateX(-1000px);
  }
  60% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* slidein_shu_right */
.slidein_shu_right{
    opacity: 0;
    visibility: hidden;
    z-index: 0;
    position: relative;
}
.slidein_shu_right_move {
    animation: slidein_shu_right_move 3s 1;
    opacity: 1;
    visibility: visible;
}

@keyframes slidein_shu_right_move {
  0% {
    opacity: 0;
    transform: translateX(1000px);
  }
  60% {
    opacity: 1;
    transform: translateX(0);
  }
}

/* slidein_shu_down */
.slidein_shu_down{
    opacity: 0;
    visibility: hidden;
    z-index: 0;
    position: relative;
}
.slidein_shu_down_move {
    animation: slidein_shu_down_move 3s 1;
    opacity: 1;
    visibility: visible;
}

@keyframes slidein_shu_down_move {
  0% {
    opacity: 0;
    transform: translateY(1000px);
  }
  60% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes kurukuru{
  0%{ transform:rotateY(0);}
  100%{ transform:rotateY(360deg); }
}

/**/


/* poyoyon */
.poyoyon {
  animation: poyoyon 0.8s cubic-bezier(0.25, 1, 0.5, 1) forwards;
  animation-delay: 0.6s;
  opacity: 0;
}

/* 次fuwafuwa */
/*
.fuwafuwa {
  animation: fuwafuwa 3s infinite ease-in-out alternate;
  display: inline-block;
  opacity: 1;
  animation-delay: 1.4s;
}
*/

@keyframes poyoyon {
  0% {
    transform: translateX(-50%) translateY(-200px);
    opacity: 0;
  }
  50% {
    transform: translateX(-50%) translateY(0);
    opacity: 1;
  }
  65% {
    transform: translateX(-50%) translateY(-35px);
  }
  80% {
    transform: translateX(-50%) translateY(0); 
  }
  90% {
    transform: translateX(-50%) translateY(-20px); 
  }
  100% {
    transform: translateX(-50%) translateY(0);
    opacity: 1;
  }
}
/*
@keyframes fuwafuwa {
    0% {
        transform: translateX(-50%) rotate(0deg);
    }
    30% {
        transform: translateX(-50%) rotate(3deg);
    }
    70% {
        transform: translateX(-50%) rotate(0deg);
    }
    100% {
        transform: translateX(-50%) rotate(3deg);
  }
}
*/



/* popup */
@keyframes popup {
    0% {
        transform: translateX(100%) scale(0.8);
        opacity: 0;
    }
    70% {
        transform: translateX(0) scale(1.0);
        opacity: 1;
    }
    100% {
        transform: translateX(0) scale(1.0);
        opacity: 1;
    }
}

@keyframes poyopoyo {
    0%, 40%, 60%, 80% {
        transform: scale(1.0);
    }
    50%, 70% {
        transform: scale(0.93);
    }
}

.popup.is-popup {
  animation: popup 1s ease-in-out, poyopoyo 1.5s ease-out 0.8s infinite;
}

/* popup2 */
@keyframes popup2 {
    0% {
        transform: translateX(-100%) scale(0.8);
        opacity: 0;
    }
    70% {
        transform: translateX(0) scale(1.0);
        opacity: 1;
    }
    100% {
        transform: translateX(0) scale(1.0);
        opacity: 1;
    }
}

.popup2 {
  opacity: 0; /* 初期状態で非表示 */
  visibility: hidden; /* 画面上に存在しないようにする */
  transition: opacity 0.5s ease-in-out, visibility 0.5s ease-in-out;
}

.popup2.is-popup2 {
  visibility: visible;
  opacity: 1;
  animation: popup2 1s ease-in-out, poyopoyo 1.5s ease-out 0.8s infinite;
}


/**/

#endbox{
    display: none;
}

/*共通*/
section#top{
    background: #FDE8BE;
    font-size: 16px;
    text-align: left;
    color: #454545;
    max-width: none;
    width: 100%;
    padding: 0;
    letter-spacing: 0.07em;
    word-break: break-all;
    font-family: 'Noto Sans JP', sans-serif;
    line-height: 1.6;
    font-weight: 500;
}

.asterisk{
    text-indent: -1em;
    margin-left: 1em;
}

.asterisk::before{
    content: '※';
}

.t-c{
    text-align: center;
}

#top section{
    padding: 100px 0;
    margin: 0 auto;
}

#top section .inner{
    max-width: 930px;
    width: 86.8%;
    margin: 0 auto;
}

#top img{
    width: 100%;
}

#top a{
    display: block;
    width: 100%;
    height: 100%;
}

.section_wrapper{
    max-width: 1108px;
    width: 86.67%;
    margin: 0 auto;
}

.font_ki{
    font-family: fot-chiaro-std, sans-serif;
}

.section_title{
    margin-bottom: 60px;
}

/*nav*/
#top #nav{
    padding: 30px 0;
    background: #662047;
    text-align: center;
    color: #fff;
    font-size: 18px;
    letter-spacing: 0.01em;
}

#nav ul{
    display: flex;
    justify-content: space-between;
    max-width: 1030px;
/*    width: 86.67%;*/
    width: 98%;
    margin: 0 auto;
}

#nav ul li{
    width: 16.6%;
    height: 50px;
    border-right: 1px solid #fff;
    vertical-align: middle;
    position: relative;
    padding: 0.3em 0.8% 0 0.8%;
    line-height: 1;
}

#nav ul li:first-child{
     border-left: 1px solid #fff;
}

#nav ul li a::after{
    content: '';
    background: url(../img/nav.png);
    background-size: contain;
    width: 8px;
    height: 8px;
    display: block;
    margin: 10px auto auto auto;
}

#nav ul li:hover a{
    margin-top: 5px;
}



/*mv kv*/
#top section#kv{
    padding: 0;
}

#kv{
    position: relative;
    width: 100%;
/*    height: 58vw;*/
    background: rgba(0, 0, 0, 0) url(../img/mv_bg.png) 50% 0 no-repeat;
    background-size: cover;
}

.mv_chara_box{
    position: relative;
    display: block;
    max-width: 1380px;
    width: 98%;
    margin: 0 auto;
}

.mv_chara_box::before{
    content: '';
    background: url(../img/mv_chara_l.png);
    background-size: contain;
    background-repeat: no-repeat;
/*    width: 271px;*/
/*    max-width: 260px;*/
/*    width: 100%;*/
/*    height: 22.6vw;*/
    width: 16.5%;
    height: 290px;
    position: absolute;
/*    left: 3.5vw;*/
    left: 0;
    top: 140px;
    z-index: 0;
}

.mv_chara_box::after{
    content: '';
    background: url(../img/mv_chara_r.png);
    background-size: contain;
    background-repeat: no-repeat;
/*    width: 271px;*/
/*    max-width: 260px;*/
/*    width: 100%;*/
/*    height: 22.6vw;*/
    width: 16.5%;
    height: 290px;
    position: absolute;
/*    right: 3.5vw;*/
    right: 0;
    top: 140px;
    z-index: 0;
}

#kv .kv_01{
    position: relative;
/*    height: 60.8%;*/
/*    height: 62.978vh;*/
    max-width: 885px;
    width: 80%;
    margin: 0 auto;
    z-index: 1;
}

#kv .kv_01 li:first-child{
/*    max-width: 305px;*/
/*    width: 100%;*/
    width: 34.465%;
    margin: auto auto 25px auto;
    padding-top: 20px;
}

#kv .kv_01 li:nth-child(2){
/*    max-width: 821px;*/
/*    width: 100%;*/
    width: 92.77%;
    margin: auto auto 20px auto;
}

#kv .kv_01 li:last-child{
/*    max-width: 884px;*/
    width: 100%;
    margin: auto auto 40px auto;
}

#kv div{
    position: relative;
    background: #DDB86F;
}

#kv div::before{
    content: '';
    background: url(../img/mv_line.png);
    background-size: 100%;
    background-repeat: no-repeat;
    width: 100%;
    height: 52px;
    position: absolute;
    top: -22px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    z-index: 0;
}

#kv div .kv_02{
    max-width: 930px;
    width: 95%;
    margin: 0 auto;
}

#kv div .kv_02 li:first-child{
/*    max-width: 666px;*/
/*    width: 100%;*/
    width: 71.62%;
    margin: 0 auto;
    z-index: 1;
    position: relative;
}

#kv div .kv_02 li:nth-child(2){
/*    max-width: 930px;*/
    width: 100%;
    margin: -43px auto auto auto;
}

#kv div .kv_02 li:last-child{
/*    max-width: 930px;*/
    width: 100%;
    margin: 20px auto auto auto;
    padding-bottom: 10px;
}

/*introduction*/
#introduction{
    color: #fff;
    text-align: center;
    position: relative;
    padding: 0!important;
}

#introduction p:first-child{
    position: relative;
    z-index: 0;
}

#introduction p:last-child{
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
/*    max-width: 592px;*/
    width: 36%;
    z-index: 1;
    padding-top: 3.2vw;
}

/*package*/
#package{
    padding: 130px 0 100px 0!important;
    background: linear-gradient(180deg,rgba(221, 184, 111, 1) 0%, rgba(255, 255, 255, 1) 100%);

}

.package_text{
    max-width: 635px;
    width: 70%;
    margin: 0 auto;
    text-align: center;
    font-size: 14px;
    line-height: 1.7;
    color: #454545;
}

.package_text ul{
    margin-top: 20px;
}

.package_01{
    margin-bottom: 70px;
    margin-top: 100px;
}

.package_01 p,
.package_02 p{
    text-align: center;
    color: #8D5E24;
    font-size: 30px;
    border-bottom: 1px solid #8D5E24;
    max-width: 260px;
    width: 100%;
    display: block;
    margin: 0 auto;
}

.package_01 div,
.package_02 div{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.package_01 div ul{
    width: 50%;
    position: relative;
}

.package_01 div ul li{
    text-align: center;
}

.package_01 div ul li:first-child{
    width: 91px;
    margin: 0 auto;
    z-index: 1;
    position: relative;
}

.package_01 div ul:first-child li:nth-child(2){
    max-width: 202px;
    width: 100%;
    position: absolute;
    left: 17px;
    top: 0;
    z-index: 0;
}

.package_01 div ul:first-child li:nth-child(3){
    max-width: 190px;
    width: 100%;
    position: absolute;
    right: 15px;
    top: 45px;
    z-index: 0;
}

.package_01 div ul:last-child li:nth-child(2){
    max-width: 193px;
    width: 100%;
    position: absolute;
    left: 8px;
    top: 45px;
    z-index: 0;
}

.package_01 div ul:last-child li:nth-child(3){
    max-width: 190px;
    width: 100%;
    position: absolute;
    right: 30px;
    top: 0;
    z-index: 0;
}

.package_01 div ul li:last-child{
    font-size: 16px;
    font-weight: 600;
    margin: 10px auto auto auto;
}

.package_01 div ul:first-child li:last-child{
    color: #7E318E;
}

.package_01 div ul:last-child li:last-child{
    color: #C93B41;
}

.package_01:after {
    background: url(../img/dod_line.png);
    background-size: contain;
    background-repeat: repeat-x;
    content: '';
    display: inline-block;
    height: 7px;
    width: 100%;
    margin-top: 70px;
}

.package_02 div{
    position: relative;
}

.package_02 div ul{
    width: 48.28%;
    position: relative;
}

.package_02 div::before{
    content: '';
    background: url(../img/package_comment.png);
    background-size: contain;
    background-repeat: no-repeat;
    width: 185px;
    height: 181px;
    position: absolute;
    top: -100px;
    right: 0;
    z-index: 0;    
}

.package_02 span{
    text-align: center;
    font-size: 16px;
    font-weight: 600;
    color: #8D5E24;
    display: block;
}

.package_01 div ul li:first-child img{
    padding-top: 140px;
}



/*campaign*/
#campaign{
    background-image: url(../img/bg.png);
    background-size: 24px;
    background-repeat: repeat;
}

.campaign_text{
    text-align: center;
    width: 95%;
    margin: 0 auto;
}

.campaign_text p:first-child{
    font-size: 22px;
    font-weight: 600;
    color: #8D5E24;
    letter-spacing: 0.1em;
    line-height: 1.9; 
}

.campaign_text p:first-child .red{
    color: #C93B41;
    font-weight: 800;
}

.campaign_text p:first-child .big{
    font-size: 29px;
}

.campaign_text p:first-child .big_2{
    font-size: 28px;
}

.campaign_text p:last-child{
    font-size: 14px;
    color: #454545;
    margin-top: 20px;
}

.present_box{
    margin-top: 100px;
    
    overflow: hidden;
}

.course_a{
    max-width: 1250px;
    width: 96%;
    margin-bottom: 55px;
}

.course_b{
    max-width: 1250px;
    width: 96%;
    margin: auto 0 20px auto;
}

.present_box .asterisk{
    text-align: center;
    font-size: 14px;
    color: #454545;
    list-style: none;
    margin: 30px auto auto auto;
}

/*entry*/
#entry,
#entry2{
    background: #894E63;
    text-align: center;
    padding: 75px 0 120px 0!important;
    position: relative;
}

#entry::before,
#entry2::before{
    content: '';
    background: url(../img/entry_line.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top center;
    width: 100%;
    height: 22px;
    top: -20px;
    left: 50%;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    position: absolute;
}

#entry p,
#entry2 p{
    color: #fff;
    text-align: center;
    font-size: 22px;
    letter-spacing: 0.1em;
}

#entry .btn,
#entry2 .btn{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 50px;
}

#entry .btn li,
#entry2 .btn li{
    width: 47.85%;
    border-radius: 45px;
    text-align: center;
    color: #fff;
    font-size: 22px;
    font-weight: 600;
    letter-spacing: 0.02em;
    position: relative;
}

#entry .btn li:first-child,
#entry2 .btn li:first-child{
    background: #D70A1D;
    border: 3px solid #90040B;
    box-shadow: 0 8px 0 #90040B;
}

#entry .btn li:last-child,
#entry2 .btn li:last-child{
    background: #0A51D7;
    border: 3px solid #003293;
    box-shadow: 0 8px 0 #003293;
}

#entry .btn li:hover,
#entry2 .btn li:hover{
    top: 8px;
    box-shadow: none;
}

#entry .btn li a,
#entry2 .btn li a{
    padding: 16px 5px;
}

#entry .btn li span,
#entry2 .btn li span{
    display: block;
    font-size: 17px;
}

#entry .btn li::after,
#entry2 .btn li::after{
    content: '';
    background: url(../img/arrow.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 30px;
    height: 30px;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    position: absolute;
}

/*product*/
#product{
    padding: 80px 0 100px 0!important;
}

.product_text{
    color: #8D5E24;
    font-size: 22px;
    letter-spacing: 0.01em;
    text-align: center;
}

.product_text p:first-child{
    font-weight: 600;
}

.product_text p span{
    display: block;
    font-size: 15px;
    margin-top: 5px;
}

.product_text .asterisk{
    font-size: 14px;
    color: #454545;
    margin-top: 10px;
}

.product_box{
    max-width: 828px;
    width: 100%;
    margin: 0 auto;
    text-align: center;
    color: #8D5E24;
    font-size: 20px;
    font-weight: 600;
}

.product_1{
    display: flex;
    border-bottom: 1px solid #8D5E24;
    padding-bottom: 50px;
    margin-bottom: 60px;
    margin-top: 70px;
    justify-content: center;
}

.product_1 ul{
    width: 41.427%;
}

.product_1 ul li:first-child {
    width: 54.813%;
    text-align: center;
    margin: auto auto 20px auto;
}

.product_2{
    max-width: 454px;
    width: 54.711%;
    margin: auto auto 50px auto;
}

.product_2 ul li:last-child {
    margin-top: 40px;
}

.product_asterisk{
    text-align: center;
    font-size: 14px;
    color: #454545;
    line-height: 1.7;
}

/*application*/
#application{
    background: #FEEFD2;
    background-image: repeating-linear-gradient(-55deg, #feebc7, #feebc7 15px, transparent 15px, transparent 30px);
    padding: 80px 0 100px 0!important;
}

.application_text{
    text-align: center;
    font-size: 22px;
    font-weight: 500;
    color: #8D5E24;
    letter-spacing: 0.1em;
    margin-bottom: 90px;
}

.application_text small{
    font-size: 75%;
}

.step_box{
    background: #FFD99D;
    border-radius: 10px;
    padding: 30px 50px;
    margin-bottom: 80px;
    position: relative;
    color: #333333;
}

.step_box.last{
    margin-bottom: 40px;
}

.step_box::before{
    font-family: fot-chiaro-std, sans-serif;
    font-size: 45px;
    color: #FFD99D;
    position: absolute;
    top: -61px;
    left: 30px;
}

.step_box.one::before{
    content: 'STEP 1';
}

.step_box.two::before{
    content: 'STEP 2';
}

.step_box.three::before{
    content: 'STEP 3';
}

.step_box.last::before{
    content: 'STEP 4';
}

.step_box{
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.step_box:nth-child(n+4) ul:first-child{
    width: 24.82%;
}

.step_box:nth-child(n+4) ul:last-child{
    width: 70%;
}

.step_box.one ul:first-child li:first-child,
.step_box:nth-child(n+4) ul:last-child li:first-child{
    font-size: 23px;
    font-weight: 800;
    border-bottom: 1px solid #333333;
    margin-bottom: 10px;
    padding-bottom: 5px;
}

.step_box ul:last-child li.asterisk{
    font-size: 13px;
    color: #F00000;
    line-height: 1.6;
}

.step_box ul:last-child li:nth-child(2){
    margin-bottom: 10px;
}

.step_box.one ul:first-child{
    width: 50.35%;
}

.step_box.one ul:last-child{
    width: 45%;
}

.step_box.one .btn{
}

.step_box.one .btn li{
    width: 100%;
    border-radius: 45px;
    text-align: center;
    color: #fff;
    font-size: 18px;
    font-weight: 600;
    letter-spacing: 0.07em;
    position: relative;
}

.step_box.one .btn li:first-child{
    background: #D70A1D;
    border: 3px solid #90040B;
    box-shadow: 0 8px 0 #90040B;
    margin-bottom: 17px;
}

.step_box.one .btn li:last-child{
    background: #0A51D7;
    border: 3px solid #003293;
    box-shadow: 0 8px 0 #003293;
}

.step_box.one .btn li:hover{
    top: 8px;
    box-shadow: none;
}

.step_box.one .btn li a{
    padding: 10px 5px;
}

.step_box.one .btn li span{
    display: block;
    font-size: 14px;
}

.step_box.one .btn li::after{
    content: '';
    background: url(../img/arrow.png);
    background-repeat: no-repeat;
    background-size: contain;
    width: 20px;
    height: 20px;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
    -ms-transform: translateY(-50%);
    position: absolute;
}

.attention{
    background: #fff;
    border: 3px solid #FED99D;
    border-radius: 10px;
    padding: 30px 50px;
}

.attention p:first-child{
    text-align: center;
    border-bottom: 1px solid #333333;
    padding-bottom: 5px;
    margin-bottom: 10px;
    font-size: 23px;
    font-weight: 800;
}

/*notes*/
#notes{
    background: #fff;
    border-radius: 10px;
    width: 100%;
    margin: 100px auto auto auto;
    position: relative;
    text-align: left;
    color: #333333;
}

#notes .notes_box_title{
    color: #fff;
    font-size: 25px;
    font-weight: 800;
    text-align: center;
    background: #8D5E24;
    border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    padding: 20px 1em;
}

#notes .notes_inner{
    width: 89.033%;
    margin: 0 auto;
    padding: 30px 0;
}

#notes .notes_inner .receipt{
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-top: 25px;
}

#notes .notes_inner .receipt li:first-child{
    width: 48.31%;
}

#notes .notes_inner .receipt li:last-child{
    width: 46.62%;
}

#notes .notes_inner .receipt li:last-child span{
    width: 89.12%;
    display: block;
    margin-bottom: 18px;
}

#notes .notes_inner .receipt_2,
#notes .notes_inner .receipt_3{
    margin-top: 30px;
}

#notes .notes_inner .receipt_2 .notes_inner_title,
#notes .notes_inner .receipt_3 .notes_inner_title{
    border-bottom: 1px solid #000;
    font-size: 20px;
    padding-bottom: 8px;
    margin-bottom: 15px;
    text-align: center;
    font-weight: 600;
    letter-spacing: 0;
}

#notes .notes_inner .receipt_2 .disc::before{
    content: '・';
}

#notes .notes_inner .receipt_2 .disc{
    text-indent: -1em;
    margin-left: 1em;
}

#notes .notes_inner .receipt_2 .asterisk{
    color: #F00000;
}

#notes .notes_inner .receipt_3 ul{
    display: flex;
    justify-content: space-between;
}

#notes .notes_inner .receipt_3 ul li{
    width:  15.6%;
}


/*terms*/
#terms{
}

#terms p{
    line-height: 1.875;
    margin: auto auto 30px auto;
}

.accordion{
}

.accordion_header,
.accordion_content{
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 15px 0;
    width: 100%;
}

.accordion_header {
    cursor: pointer;
    background-color: #662047;
    color: #fff;
    position: relative;
    border-radius: 10px;
    font-size: 18px;
    letter-spacing: 0.13em;
    font-weight: 400;
}

.accordion_content {
    display: none;
    font-size: 15px;
}

.accordion_content ul{
/*    width: 90.11%;*/
/*    margin: 0 auto;*/
}

.accordion_header:nth-child(n+1) {
    margin-top: 20px;
}

.accordion_header::before{
    position: absolute;
    content: '';
    top: 50%;
    right: 30px;
    width: 20px;
    height: 3px;
    background-color:#fff;
    transform: rotate(90deg);
    transition: all .3s ease-in-out;
}

.accordion_header::after{
    position: absolute;
    content: '';
    top: 50%;
    right: 30px;
    width: 20px;
    height: 3px;
    background-color:#fff;
    transition: all .3s ease-in-out;
}

.accordion_header.open::before {
    transform: rotate(180deg);
}

.accordion_header.open::after {
    opacity:0;
}

.accordion_content ul .disc::before{
    content: '・';
}

.accordion_content ul .maru::before{
    content: '●';
}

.accordion_content ul .disc,
.accordion_content ul .maru{
    text-indent: -1em;
    margin-left: 1em;
}

.mb-1{
    margin-bottom: 1em;
}

.accordion_content ul ol li:nth-child(n+1){
    text-indent: -1em;
    margin-left: 2em;
}

.accordion_content ul li a{
    display: inline!important;
    color: #007D9B;
    text-decoration: underline;
}


/*contact*/
#contact{
    padding: 80px 0 30px 0!important;
}

.contact{
    max-width: 600px;
    width: 100%;
    height: auto;
    margin: 0 auto;
    padding: 20px 0;
    text-align: center;
    background: #fff;
    text-align: center;
    border-radius: 10px;
    border: 2px solid #D3605B;
}

.contact li:first-child{
    width: 84.23%;
    font-size: 18px;
    background: #D3605B;
    color: #fff;
    padding: 5px 1em;
    border-radius: 45px;
    line-height: 1.6;
    margin: auto auto 10px auto;
    font-weight: 500;
}

.contact li:nth-child(2){
/*    letter-spacing: 0em;*/
    line-height: 1.5;
    margin-bottom: 5px;
    font-size: 18px;
    font-weight: 600;
}

.contact li:nth-child(3){
    font-size: 35px;
    font-weight: 900;
    margin-bottom: 5px;
}

.contact li:last-child{
    line-height: 1.6;
}

#contact p{
    font-size: 12px;
    font-weight: 400;
    letter-spacing: 0;
    margin-top: 100px;
    text-align: center;
}

/*追従系*/
#top section#pagetop,
#top section#qr{
    padding: 0;
}

#pagetop{
    right: 10px;
    bottom: 10px;
    width: 70px;
    height: 70px;
    position: fixed;
    z-index: 9;
}

#pagetop:hover{
    opacity: 0.5;
}

#qr{
    width: 120px;
    height: 170px;
    position: fixed;
    right: 0;
    bottom: 120px;
}

/*
@media screen and (max-width:915px){
    #top #nav {
        font-size: 1.7vw;
    }
    #nav ul li:last-child a {
        width: 20%;
    }
    #application .step_box .btn li a {
        font-size: 2.2vw;
    }
    #entry ul li a,
    #entry2 ul li a {
    font-size: 2.5vw;
    }
}
*/

@media screen and (max-width:1250px){
    /*mv kv*/
    .mv_chara_box::before{
        content: '';
        background: url(../img/mv_chara_l.png);
        background-size: contain;
        background-repeat: no-repeat;
        width: 14.5%;
        height: 290px;
        position: absolute;
        left: 0;
        top: 17vw;
        z-index: 0;
    }

    .mv_chara_box::after{
        content: '';
        background: url(../img/mv_chara_r.png);
        background-size: contain;
        background-repeat: no-repeat;
        width: 14.5%;
        height: 290px;
        position: absolute;
        right: 0;
        top: 17vw;
        z-index: 0;
    }
}

@media screen and (max-width:1070px){
    .package_01 div ul li:first-child img{
        padding-top: 7.5vw;
    }

    .package_01 div ul:first-child li:nth-child(2) {
        width: 19vw;
        top: auto;
/*        bottom: 10vw;*/
        bottom: 32%;
        left: 10px;
    }

    .package_01 div ul:first-child li:nth-child(3) {
        width: 17.3vw;
        top: auto;
/*        bottom: 6vw;*/
        bottom: 22%;
        right: 5px;
    }
    
    .package_01 div ul:last-child li:nth-child(2) {
        width: 17.5vw;
        top: auto;
/*        bottom: 6vw;*/
        bottom: 22%;
        left: 3px;
    }

    .package_01 div ul:last-child li:nth-child(3) {
        width: 18vw;
        top: auto;
/*        bottom: 10vw;*/
        bottom: 32%;
        right: 12px;
    }
}


@media screen and (max-width:1000px){
    #entry .btn li,
    #entry2 .btn li{
        font-size: 2.3vw;
    }
    #entry .btn li::after,
    #entry2 .btn li::after {
        content: '';
        background: url(../img/arrow.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 20px;
        height: 20px;
        right: 1.5vw;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        position: absolute;
    }
    .step_box.one .btn li::after{
        display: none;
    }
    
    .step_box.one .btn li{
        font-size: 2vw;
    }
    .step_box.one .btn li span{
        font-size: 1.8vw;
    }
}

@media screen and (max-width:997px){
    #top #nav{
        font-size: 1.8vw;
    }
    #entry .btn li span,
    #entry2 .btn li span{
        font-size: 1.8vw;
    }
}

@media screen and (max-width:990px){
    .package_02 div::before {
        top: auto;
        bottom: 22vw;
    }
}


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

    .sp{
        display: inherit;
    }

    section#top{
        font-size: 15px;
    }

    #top section{
        padding: 50px 0;
    }
    
    @keyframes poyoyon {
      0% {
        transform: translateX(-50%) translateY(-200px);
        opacity: 0;
      }
      50% {
        transform: translateX(-50%) translateY(0);
        opacity: 1;
      }
      65% {
        transform: translateX(-50%) translateY(-15px);
      }
      80% {
        transform: translateX(-50%) translateY(0); 
      }
      90% {
        transform: translateX(-50%) translateY(-10px); 
      }
      100% {
        transform: translateX(-50%) translateY(0);
        opacity: 1;
      }
    }

    
    @keyframes popup {
        0% {
            transform: translateX(-100%) scale(0.8);
            opacity: 0;
        }
        70% {
            transform: translateX(0) scale(1.0);
            opacity: 1;
        }
        100% {
            transform: translateX(0) scale(1.0);
            opacity: 1;
        }
    }
    
    
    .section_title{
        margin-bottom: 30px;
    }
    
    /*nav*/
    #top #nav{
        padding: 10px 0;
        font-size: 15px;
        letter-spacing: 0.03em;
    }

    #nav ul{
        flex-wrap: wrap;
        width: 86.67%;
        margin: 0 auto;
    }

    #nav ul li{
        width: 50%;
        height: 50px;
        border-right: 1px solid #fff;
        border-bottom: 1px solid #fff;
        vertical-align: middle;
        position: relative;
        padding: 0.3em 0.8% 0 0.8%;
        line-height: 1;
    }

    #nav ul li:first-child{
        border-left: none;
    }

    #nav ul li:nth-child(even){
        border-right: none;
    }

    #nav ul li:nth-child(5),
    #nav ul li:last-child{
        border-bottom: 0;
    }

    #nav ul li a::after{
        content: '';
        background: url(../img/nav.png);
        background-size: contain;
        width: 6px;
        height: 6px;
        display: block;
        margin: 6px auto auto auto;
    }

    #nav ul li:hover a{
        margin-top: 0;
        padding: 5px 0;
    }
    
    #nav ul li a{
        padding: 8px 0;
    }
    
    
    /*mv kv*/
    #kv{
        background: rgba(0, 0, 0, 0) url(../img/sp/mv_bg.png) 50% 0 no-repeat;
        background-size: cover;
    }
    
    .mv_chara_box::before,
    .mv_chara_box::after,
    #kv::before,
    #kv::after{
        display: none;
    }

    #kv .kv_01{
        width: 100%;
    }

    #kv .kv_01 li:first-child{
        width: 54.33%;
        margin: auto auto 15px auto;
    }

    #kv .kv_01 li:nth-child(2){
        width: 97%;
        margin: auto auto 20px auto;
    }

    #kv .kv_01 li:last-child{
        width: 95.2%;
        margin: -35px auto 15px auto;
    }

    #kv div::before{
        content: '';
        background: url(../img/sp/mv_line.png);
        background-size: contain;
        background-repeat: no-repeat;
        width: 100%;
        height: 4.6vw;
        position: absolute;
        top: -2vw;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        z-index: 0;
    }


    #kv div .kv_02 li:first-child{
        width: 82.67%;
    }

    #kv div .kv_02 li:nth-child(2){
        width: 95.2%;
        margin: -18px auto auto auto;
    }

    #kv div .kv_02 li:last-child{
        width: 95.2%;
        margin: 15px auto auto auto;
        padding-bottom: 17px;
    }

    /*introduction*/
    #introduction p:last-child{
        position: absolute;
        top: 0;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
    /*    max-width: 592px;*/
        width: 87%;
        z-index: 1;
        padding-top: 12vw;
    }
    
    /*package*/
    #package{
        padding: 50px 0 !important;
    }

    .package_text{
        width: 100%;
        text-align: left;
        font-size: 12px;
    }

    .package_01{
        margin-bottom: 40px;
        margin-top: 30px;
    }

    .package_01 p,
    .package_02 p{
        font-size: 20px;
        max-width: none;
        width: 100%;
        margin-bottom: 15px;
    }

    .package_01 div,
    .package_02 div{
        display: block;
    }

    .package_01 div ul{
        max-width: 320px;
        width: 100%;
        margin: 0 auto;
    }

    .package_01 div ul li:first-child{
        width: 71px;
    }
    
    .package_01 div ul li:first-child img{
        padding-top: 120px;
    }

    .package_01 div ul:first-child li:nth-child(2){
        max-width: 162px;
        width: 52%;
        position: absolute;
        left: -10px;
        top: 0;
        z-index: 0;
    }

    .package_01 div ul:first-child li:nth-child(3){
        max-width: 162px;
        width: 52%;
        position: absolute;
        right: -10px;
        top: 0;
        z-index: 0;
    }

    .package_01 div ul:last-child li:nth-child(2){
        max-width: 168px;
        width: 52%;
        position: absolute;
        left: -10px;
        top: 0;
        z-index: 0;
    }

    .package_01 div ul:last-child li:nth-child(3){
        max-width: 163px;
        width: 52%;
        position: absolute;
        right: -10px;
        top: 0;
        z-index: 0;
    }

    .package_01 div ul li:last-child{
        margin: 5px auto auto auto;
    }

    .package_01 div ul:first-child li:last-child{
        margin-bottom: 40px;
    }

    .package_01:after {
        background: url(../img/dod_line.png);
        background-size: contain;
        background-repeat: repeat-x;
        content: '';
        display: inline-block;
        height: 6px;
        width: 100%;
        margin-top: 40px;
    }
    
    .package_02 div ul{
        max-width: 400px;
        width: 100%;
        margin: 0 auto;
    }

    .package_02 div::before{
        content: '';
        background: url(../img/sp/package_comment.png);
        background-size: contain;
        background-repeat: no-repeat;
        width: 98px;
        height: 97px;
        position: absolute;
        top: -75px;
        right: -15px;
        z-index: 0;

    }

    /*campaign*/

    .campaign_text{
        width: 93.6%;
    }

    .campaign_text p:first-child{
        font-size: 17px;
        line-height: 1.5;
    }

    .campaign_text p:first-child .red_sp{
        letter-spacing: 0;
        margin-top: 5px;
        display: inline-block;
    }

    .campaign_text p:first-child .big{
        font-size: 23px;
    }

    .campaign_text p:first-child .big_2{
        font-size: 20px;
    }

    .campaign_text p:first-child .big_sp{
        font-size: 23px;
    }

    .campaign_text p:last-child{
        font-size: 12px;
        text-align: left;
        width: 86.8%;
        margin: 20px auto auto auto;
    }

    .present_box{
        margin-top: 40px;
    }

    .course_a{
        margin-bottom: 30px;
    }

    .course_b{
        margin: auto 0 20px auto;
    }
    
    .present_box .asterisk{
        font-size: 12px;
    }
    
    /*entry*/
    #entry,
    #entry2{
        padding: 40px 0 50px 0!important;
    }

    #entry::before,
    #entry2::before{
        content: '';
        background: url(../img/sp/entry_line.png);
        background-repeat: no-repeat;
        background-size: contain;
        background-position: top center;
        width: 100%;
        height: 20px;
        top: -2vw;
        left: 50%;
        transform: translateX(-50%);
        -webkit-transform: translateX(-50%);
        -ms-transform: translateX(-50%);
        position: absolute;
    }

    #entry p,
    #entry2 p{
        font-size: 17px;
    }

    #entry .btn,
    #entry2 .btn{
        display: block;
        margin-top: 30px;
    }

    #entry .btn li,
    #entry2 .btn li{
        width: 100%;
        font-size: 16px;
        letter-spacing: 0;
    }

    #entry .btn li:first-child,
    #entry2 .btn li:first-child{
        box-shadow: 0 7px 0 #90040B;
        margin-bottom: 15px;
    }

    #entry .btn li:last-child,
    #entry2 .btn li:last-child{
        box-shadow: 0 7px 0 #003293;
    }

    #entry .btn li:hover,
    #entry2 .btn li:hover{
        top: 7px;
        box-shadow: none;
    }

    #entry .btn li a,
    #entry2 .btn li a{
        padding: 10px 5px;
    }

    #entry .btn li span,
    #entry2 .btn li span{
        font-size: 14px;
    }

    #entry .btn li::after,
    #entry2 .btn li::after{
        content: '';
        background: url(../img/arrow.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 20px;
        height: 20px;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        position: absolute;
    }


    /*product*/
    #product{
        padding: 50px 0 50px 0!important;
    }

    .product_text{
        font-size: 17px;
    }

    .product_text .asterisk{
        font-size: 12px;
    }

    .product_box{
        font-size: 14px;
    }

    .product_1{
        padding-bottom: 30px;
        margin-bottom: 35px;
        margin-top: 40px;
        justify-content: space-between;
    }

    .product_1 ul{
        width: 50%;
    }

    .product_1 ul li:first-child {
        width: 66.36%;
        margin: auto auto 10px auto;
    }

    .product_2{
        max-width: 500px;
        width: 66.8%;
        margin: auto auto 30px auto;
    }

    .product_2 ul li:last-child {
        margin-top: 20px;
    }

    .product_asterisk{
        text-align: left;
        font-size: 12px;
    }

    /*application*/
    #application{
        background: #FEEFD2;
        background-image: repeating-linear-gradient(-55deg, #FEECCA, #FEECCA 15px, transparent 15px, transparent 30px);
        padding: 50px 0 50px 0!important;
    }

    .application_text{
        font-size: 17px;
        margin-bottom: 70px;
        line-height: 1.76;
    }

    .step_box{
        padding: 20px 18px;
        margin-bottom: 60px;
    }

    .step_box.last{
        margin-bottom: 30px;
    }

    .step_box::before{
        font-size: 35px;
        top: -46px;
        left: 18px;
    }

    .step_box{
        display: block;
    }

    .step_box:nth-child(n+4) ul:first-child{
        width: 100%;
    }
    
    .step_box:nth-child(n+4) ul:first-child li{
        width: 56.3%;
        margin: auto auto 20px auto;
    }

    .step_box:nth-child(n+4) ul:last-child{
        width: 100%;
    }

    .step_box.one ul:first-child li:first-child,
    .step_box:nth-child(n+4) ul:last-child li:first-child{
        font-size: 20px;
        text-align: center;
    }

    .step_box ul:last-child li.asterisk{
        font-size: 12px;
    }

    .step_box.one ul:first-child{
        width: 100%;
    }

    .step_box.one ul:last-child{
        width: 100%;
    }

    .step_box.one .btn{
        margin-top: 20px;
    }

    .step_box.one .btn li{
        width: 100%;
        font-size: 15px;
        letter-spacing: 0;
    }

    .step_box.one .btn li:first-child{
        box-shadow: 0 7px 0 #90040B;
        margin-bottom: 15px;
    }

    .step_box.one .btn li:last-child{
        box-shadow: 0 7px 0 #003293;
    }

    .step_box.one .btn li:hover{
        top: 7px;
        box-shadow: none;
    }

    .step_box.one .btn li span{
        font-size: 12px;
    }

    .step_box.one .btn li::after{
        content: '';
        background: url(../img/arrow.png);
        background-repeat: no-repeat;
        background-size: contain;
        width: 17px;
        height: 17px;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
        -webkit-transform: translateY(-50%);
        -ms-transform: translateY(-50%);
        position: absolute;
        display: block;
    }

    .attention{
        padding: 20px 16px;
        letter-spacing: 0.04em;
    }

    .attention p:first-child{
        font-size: 20px;
        letter-spacing: 0.07em;
    }

    /*notes*/
    #notes{
        margin: 60px auto auto auto;
    }

    #notes .notes_box_title{
        font-size: 18px;
        padding: 10px 1em;
    }

    #notes .notes_inner{
        padding: 15px 0 5px 0;
    }
    
    #notes .notes_inner p.t-c{
        letter-spacing: 0.04em;
        line-height: 1.73;
    }

    #notes .notes_inner .receipt{
        display: block;
        margin-top: 20px;
    }

    #notes .notes_inner .receipt li:first-child{
        width: 100%;
        margin-bottom: 10px;
    }

    #notes .notes_inner .receipt li:last-child{
        width: 100%;
    }

    #notes .notes_inner .receipt li:last-child span{
        width: 100%;
        margin-bottom: 15px;
    }
    
    #notes .notes_inner .receipt_2 .notes_inner_title,
    #notes .notes_inner .receipt_3 .notes_inner_title{
        font-size: 18px;
        padding-bottom: 5px;
        margin-bottom: 10px;
    }
    
    #notes .notes_inner .receipt_3 .notes_inner_title{
        margin-bottom: 15px;
    }
    
    #notes .notes_inner .receipt_2{
        letter-spacing: 0;
        line-height: 1.6;
    }

    #notes .notes_inner .receipt_3 ul{
        flex-wrap: wrap;
        width: 93.52%;
        margin: 0 auto;
    }

    #notes .notes_inner .receipt_3 ul li{
        width:  46.2%;
        margin-bottom: 20px;
    }
    
    /*terms*/
    #terms p{
        font-size: 13px;
        line-height: 1.9;
        margin: auto auto 15px auto;
    }

    .accordion_header,
    .accordion_content{
        padding: 10px 0;
    }

    .accordion_header {
        font-size: 15px;
        letter-spacing: 0.07em;
    }

    .accordion_content {
        display: none;
        font-size: 14px;
    }

    .accordion_header::before{
        position: absolute;
        content: '';
        top: 49%;
        right: 15px;
        width: 15px;
        height: 3px;
        background-color:#fff;
        transform: rotate(90deg);
        transition: all .3s ease-in-out;
    }

    .accordion_header::after{
        position: absolute;
        content: '';
        top: 49%;
        right: 15px;
        width: 15px;
        height: 3px;
        background-color:#fff;
        transition: all .3s ease-in-out;
    }
    
    /*contact*/
    #contact {
        padding: 50px 0 30px 0 !important;
    }

    .contact{
        padding: 15px 0;
    }

    .contact li:first-child{
        width: 90.9%;
        font-size: 15px;
        margin: auto auto 15px auto;
        line-height: 1.3;
    }

    .contact li:nth-child(n+2){
        width: 95%;
        margin: 0 auto;
    }

    .contact li:nth-child(2){
        font-size: 15px;
    }

    .contact li:nth-child(3){
        font-size: 25px;
        margin: 5px auto;
    }

    .contact li:last-child{
        line-height: 1.6;
        letter-spacing: 0;
        font-size: 12px;
    }   
    
    #contact p{
        margin-top: 40px;
    }
    
    /*追従系*/
    #pagetop{
        right: 7px;
        bottom: 7px;
        width: 45px;
        height: 45px;
    }

    
}


@media screen and (max-width:340px){
    #entry .btn li::after,
    #entry2 .btn li::after,
    .step_box.one .btn li::after{
        display: none;
    }
}