@charset "UTF-8";
@font-face {
    font-family: 'HiraginoSans';
    font-weight: normal;
    font-style: normal;
    font-display: swap;
    src: url('./../font/HiraginoSansW3.ttf') format('truetype');
}

@font-face {
    font-family: 'HiraginoSans';
    font-weight: bold;
    font-style: normal;
    font-display: swap;
    src: url("./../font/HiraginoSansW6.ttf") format("truetype");
}


/*　共通設定
----------------------------------------------- */

body {
    font-family: 'HiraginoSans', 'Yu Gothic', YuGothic, 'メイリオ', Meiryo, sans-serif;
    font-size: 16px;
    font-weight: bold;
    line-height: 1.6;
}

@media screen and (max-width: 600px) {
    body {
        font-size: 15px;
    }
}

.body-wrapper {
    overflow-x: hidden;
}

figure {
    line-height: 0;
}

.container {
    width: 100%;
    max-width: 1010px;
    margin: 0 auto;
    padding: 0 15px;
}


/*　レイアウト系
----------------------------------------------- */

.d-block {
    display: block;
}

.d-flex, .buylink__list {
    display: flex !important;
}

.flex-wrap, .buylink__list {
    flex-wrap: wrap;
}

.justify-content-center {
    justify-content: center;
}

.justify-content-between, .buylink__list {
    justify-content: space-between;
}

.justify-content-end {
    justify-content: flex-end;
}

.align-items-start {
    align-items: flex-start;
}

.align-items-center {
    align-items: center;
}

.align-items-end {
    align-items: flex-end;
}

.flex-row-reverse {
    flex-direction: row-reverse;
}

.font-weight-bold {
    font-weight: bold;
}

.text-center, .buylink__ttl {
    text-align: center;
}

.text-right {
    text-align: right;
}

.position-relative {
    position: relative;
}

.flex-1 {
    flex: 1;
}

.line-2 {
    line-height: 2.2;
}

.col-white {
    color: #fff;
}


/* SPのみ表示用 */

.sp {
    display: block;
}

.pc,
.sp-hide {
    display: none;
}
.buylink__ttl span br:first-child {
    display: block;
    content:" ";
}
@media screen and (min-width: 600px) {
    .sp-show {
        display: none;
    }
    .sp-hide {
        display: block;
    }
    /*.buylink__ttl span br:first-child {
        display: none;
    }*/
}

@media screen and (min-width: 769px) {
    /* PCのみ表示用 */
    .sp {
        display: none;
    }
    .pc {
        display: block;
    }
    /*.buylink__ttl span br:first-child {
        display: none;
    }*/
}

.f-20 {
    font-size: 1.25rem !important;
}

.f-24 {
    font-size: 1.5rem !important;
}

.f-35 {
    font-size: 2.125rem !important;
}

@media screen and (max-width: 600px) {
    .f-35 {
        font-size: 1.5rem !important;
    }
    .f-24 {
        font-size: 1.125rem !important;
    }
    .f-20 {
        font-size: 1rem !important;
    }
}

@media screen and (max-width: 768px) {
    .w_50 {
        width: 100%;
    }
}

main {
    width: 100vw;
    overflow-x: hidden;
}

.mv {
    width: 400vw;
    transform: translateX(0);
    transition: all .4s ease;
}

.mv-item {
    width: 100vw;
}

.main-bg1 {
    background: #007BC8;
}

.main-bg2 {
    background: #f6f48d;
}

.main-bg3 {
    /* background: url(./../images/bg2.jpg) no-repeat bottom center / cover, #ffd9e4; */
    background: url(./../images/bg7.jpg) no-repeat bottom center / cover, #D9EFFF;
}

.main-bg6 {
    background: url(./../images/bg6.jpg) no-repeat center / cover, #ffa6c6;
}

/* 202406 add */
.js-height-adjust {
	height: 1000px;
	overflow: hidden;
}
.ma_to-5 {
    margin-top: -5px !important;
}
#movie-pokemon {
    display: none;
}

/* 202406 addend */

.slider {
    max-width: 791px;
    margin: 0 auto;
}

.youtube-thumbnail .slick-slide {
    padding: 0 5px;
    cursor: pointer;
}

.slider figure {
    width: 20%;
    cursor: pointer;
    border: 5px solid transparent;
}

.slider figure img {
    border-radius: 8px;
}

.slider figure.current {
    border: 5px solid #FF3C80;
    border-radius: 12px;
}

.youtube-slider .slick-slide {
    padding: 0 20px;
}

.youtube-wrapper {
    position: relative;
    padding-bottom: 56.25%;
}

.youtube-wrapper iframe {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.youtube-thumbnail {
    padding: 0 90px;
    line-height: 0;
}

.youtube-thumbnail .slick-current figure {
    border: 5px solid #FF3C80;
}

.youtube-thumbnail .slick-prev,
.youtube-thumbnail .slick-next {
    top: 0;
    width: 80px;
    height: 100%;
    transform: none;
    color: #fff;
}

.youtube-thumbnail .slick-prev {
    left: 0;
    background: linear-gradient(to left, #FFA3C6, #DE2A9F 70%, #BD00A0);
}

.youtube-thumbnail .slick-prev::before {
    content: url(./../images/icon-prev.png);
}

.youtube-thumbnail .slick-next {
    right: 0;
    background: linear-gradient(to right, #FFA3C6, #DE2A9F 70%, #BD00A0);
}

.youtube-thumbnail .slick-next::before {
    content: url(./../images/icon-next.png);
}

.slider-cont h2 {
    font-size: 3rem;
    line-height: 1.5;
}

.slider-cont .bg {
    background-size: 100% auto;
    background-position: bottom;
    background-repeat: repeat;
}

.slider-cont .slider-cont1 .bg {
    background-image: url(./../images/bg5.jpg);
    background-position: top;
}

.slider-cont .slider-cont2 .bg {
    background-image: url(./../images/bg1.jpg);
    background-position: top;
}

.slider-cont .slider-cont6 .bg {
    background-image: url(./../images/bg6.jpg);
}
/* 20240611 add */
.slider-cont .slider-cont3 .bg {
    background-image: url(./../images/bg2.jpg);
}
.slider-cont .slider-cont3 .bg.second {
    background-image: url(./../images/bg7.jpg);
}
/* 20240611 addend */

ul.step li {
    width: 33.33%;
}

ul.step li:not(:last-child)::after {
    content: url(./../images/arrow.png);
    position: absolute;
    right: 0;
    top: 50%;
    transform: translateX(50%);
    line-height: 0;
    z-index: 2;
}

.step-num::before {
    content: '';
    position: absolute;
    left: 0;
    width: 100%;
    top: -35%;
    height: 185%;
    background: url(./../images/step-bg.png) no-repeat center / contain;
}

.step-num img {
    position: relative;
    width: 25%;
}

.slider-cont ul li p {
    margin-top: -25px;
    line-height: 1.8;
    text-shadow: rgb(255, 255, 255) 5px 0px 0px, rgb(255, 255, 255) 4.90033px 0.993347px 0px, rgb(255, 255, 255) 4.60531px 1.94709px 0px, rgb(255, 255, 255) 4.12668px 2.82321px 0px, rgb(255, 255, 255) 3.48353px 3.58678px 0px, rgb(255, 255, 255) 2.70151px 4.20736px 0px, rgb(255, 255, 255) 1.81179px 4.6602px 0px, rgb(255, 255, 255) 0.849836px 4.92725px 0px, rgb(255, 255, 255) -0.145998px 4.99787px 0px, rgb(255, 255, 255) -1.13601px 4.86924px 0px, rgb(255, 255, 255) -2.08073px 4.54649px 0px, rgb(255, 255, 255) -2.94251px 4.04248px 0px, rgb(255, 255, 255) -3.68697px 3.37732px 0px, rgb(255, 255, 255) -4.28444px 2.57751px 0px, rgb(255, 255, 255) -4.71111px 1.67494px 0px, rgb(255, 255, 255) -4.94996px 0.7056px 0px, rgb(255, 255, 255) -4.99147px -0.291871px 0px, rgb(255, 255, 255) -4.83399px -1.27771px 0px, rgb(255, 255, 255) -4.48379px -2.2126px 0px, rgb(255, 255, 255) -3.95484px -3.05929px 0px, rgb(255, 255, 255) -3.26822px -3.78401px 0px, rgb(255, 255, 255) -2.4513px -4.35788px 0px, rgb(255, 255, 255) -1.53666px -4.75801px 0px, rgb(255, 255, 255) -0.560763px -4.96845px 0px, rgb(255, 255, 255) 0.437495px -4.98082px 0px, rgb(255, 255, 255) 1.41831px -4.79462px 0px, rgb(255, 255, 255) 2.34258px -4.41727px 0px, rgb(255, 255, 255) 3.17346px -3.86382px 0px, rgb(255, 255, 255) 3.87783px -3.15633px 0px, rgb(255, 255, 255) 4.4276px -2.32301px 0px, rgb(255, 255, 255) 4.80085px -1.39708px 0px, rgb(255, 255, 255) 4.98271px -0.415447px 0px, rgb(255, 255, 255) 10px 0px 0px, rgb(255, 255, 255) 9.95004px 0.998334px 0px, rgb(255, 255, 255) 9.80067px 1.98669px 0px, rgb(255, 255, 255) 9.55336px 2.9552px 0px, rgb(255, 255, 255) 9.21061px 3.89418px 0px, rgb(255, 255, 255) 8.77583px 4.79426px 0px, rgb(255, 255, 255) 8.25336px 5.64642px 0px, rgb(255, 255, 255) 7.64842px 6.44218px 0px, rgb(255, 255, 255) 6.96707px 7.17356px 0px, rgb(255, 255, 255) 6.2161px 7.83327px 0px, rgb(255, 255, 255) 5.40302px 8.41471px 0px, rgb(255, 255, 255) 4.53596px 8.91207px 0px, rgb(255, 255, 255) 3.62358px 9.32039px 0px, rgb(255, 255, 255) 2.67499px 9.63558px 0px, rgb(255, 255, 255) 1.69967px 9.8545px 0px, rgb(255, 255, 255) 0.707372px 9.97495px 0px, rgb(255, 255, 255) -0.291995px 9.99574px 0px, rgb(255, 255, 255) -1.28844px 9.91665px 0px, rgb(255, 255, 255) -2.27202px 9.73848px 0px, rgb(255, 255, 255) -3.2329px 9.463px 0px, rgb(255, 255, 255) -4.16147px 9.09297px 0px, rgb(255, 255, 255) -5.04846px 8.63209px 0px, rgb(255, 255, 255) -5.88501px 8.08496px 0px, rgb(255, 255, 255) -6.66276px 7.45705px 0px, rgb(255, 255, 255) -7.37394px 6.75463px 0px, rgb(255, 255, 255) -8.01144px 5.98472px 0px, rgb(255, 255, 255) -8.56889px 5.15501px 0px, rgb(255, 255, 255) -9.04072px 4.2738px 0px, rgb(255, 255, 255) -9.42222px 3.34988px 0px, rgb(255, 255, 255) -9.70958px 2.39249px 0px, rgb(255, 255, 255) -9.89993px 1.4112px 0px, rgb(255, 255, 255) -9.99135px 0.415807px 0px, rgb(255, 255, 255) -9.98295px -0.583741px 0px, rgb(255, 255, 255) -9.8748px -1.57746px 0px, rgb(255, 255, 255) -9.66798px -2.55541px 0px, rgb(255, 255, 255) -9.36457px -3.50783px 0px, rgb(255, 255, 255) -8.96758px -4.4252px 0px, rgb(255, 255, 255) -8.481px -5.29836px 0px, rgb(255, 255, 255) -7.90968px -6.11858px 0px, rgb(255, 255, 255) -7.25932px -6.87766px 0px, rgb(255, 255, 255) -6.53644px -7.56803px 0px, rgb(255, 255, 255) -5.74824px -8.18277px 0px, rgb(255, 255, 255) -4.90261px -8.71576px 0px, rgb(255, 255, 255) -4.00799px -9.16166px 0px, rgb(255, 255, 255) -3.07333px -9.51602px 0px, rgb(255, 255, 255) -2.10796px -9.7753px 0px, rgb(255, 255, 255) -1.12153px -9.93691px 0px, rgb(255, 255, 255) -0.123887px -9.99923px 0px, rgb(255, 255, 255) 0.87499px -9.96165px 0px, rgb(255, 255, 255) 1.86512px -9.82453px 0px, rgb(255, 255, 255) 2.83662px -9.58924px 0px, rgb(255, 255, 255) 3.77978px -9.25815px 0px, rgb(255, 255, 255) 4.68517px -8.83455px 0px, rgb(255, 255, 255) 5.54374px -8.32267px 0px, rgb(255, 255, 255) 6.34693px -7.72764px 0px, rgb(255, 255, 255) 7.0867px -7.0554px 0px, rgb(255, 255, 255) 7.75566px -6.31267px 0px, rgb(255, 255, 255) 8.34713px -5.50686px 0px, rgb(255, 255, 255) 8.8552px -4.64602px 0px, rgb(255, 255, 255) 9.27478px -3.73877px 0px, rgb(255, 255, 255) 9.6017px -2.79415px 0px, rgb(255, 255, 255) 9.83268px -1.82162px 0px, rgb(255, 255, 255) 9.96542px -0.830894px 0px;
}

.slider-cont1 ul li p {
    margin-top: -5px;
}

.slider-btn p {
    display: inline-block;
    width: 100%;
    padding: 20px;
    border-radius: 100px;
    line-height: 1.5;
    cursor: pointer;
}

.slider-cont1 .slider-btn p {
    max-width: 650px;
    background: linear-gradient(to bottom, #FFFF26, #D9A300);
}

.slider-cont2 .slider-btn p {
    max-width: 650px;
    background: linear-gradient(to bottom, #FFAB00, #FF1000);
}

.slider-cont3 .slider-btn p {
    max-width: 780px;
    background: linear-gradient(to bottom, #FFADC9, #FF3C80 75%, #FF176A);
}

.slider-cont6 .slider-btn p {
    max-width: 665px;
    background: linear-gradient(to bottom, #f4769e, #d7235c);
}

.cmn-cont {
    background: #FFF8CD;
}

.cmn-cont h2 {
    font-size: 3.25rem;
}

.cmn-item {
    position: relative;
    width: 48%;
    margin-bottom: 40px;
    padding: 30px 4%;
    font-size: .875rem;
    background: linear-gradient(to bottom, #F499C1, #D53994 70%, #BD00A0);
    border-radius: 12px;
}

.cmn-item::before {
    content: '';
    position: absolute;
    left: 7px;
    right: 7px;
    top: 7px;
    bottom: 7px;
    background: #fff;
    border-radius: 12px;
}

.cmn-logo {
    position: absolute;
    left: -20px;
    top: -30px;
    width: 30%;
    z-index: 2;
}

.cmn-item h3 {
    font-size: 1.25rem;
    font-weight: bold;
}

.cmn-item p {
    position: relative;
}

.cmn-item .cmn-btn {
    position: relative;
    margin-bottom: 10px;
    text-align: center;
    line-height: 65px;
    font-size: 1.25rem;
    color: #fff;
    background: linear-gradient(to bottom, #F499C1, #D53994 70%, #BD00A0);
    box-shadow: 0 3px 3px rgba(0, 0, 0, .3);
    border-radius: 100px;
    cursor: pointer;
}

footer {
    background: #FFF8CD;
    line-height: 2;
}

.social-link a {
    display: block;
    width: 50px;
    margin: 0 10px;
}

.modal-box {
    display: none;
}

.modal-box.active {
    display: flex;
    align-items: center;
    justify-content: center;
    position: fixed;
    left: 0;
    top: 0;
    width: 100vw;
    height: 100vh;
    padding: 10vh 5%;
    background: rgba(0, 0, 0, .7);
    z-index: 5;
}

.modal-box-wrapper {
    position: relative;
    width: 100%;
    max-width: 840px;
    max-height: 80vh;
    padding: 80px 5%;
    background: #fff;
    border-radius: 10px;
    overflow-y: scroll;
}

.modal-box-wrapper::-webkit-scrollbar-track {
    margin: 50px 0;
}

.modal-box-wrapper::-webkit-scrollbar {
    width: 5px;
}

.modal-box-wrapper::-webkit-scrollbar-thumb {
    background-color: #fff;
}

.modal-box-wrapper .close {
    position: absolute;
    top: 20px;
    right: 20px;
    z-index: 10;
    cursor: pointer;
}

.modal-box-wrapper p, .buylink__ttl {
    font-size: 1.875rem;
    font-weight: bold;
    margin-bottom: 30px;
}

.modal-box-wrapper ul li, .buylink__list-item {
    width: 49%;
    margin: 10px 0;
    color: #fff;
    background: linear-gradient(to bottom, #F499C1, #D53994 70%, #BD00A0);
    border-radius: 60px;
}

.modal-box-wrapper ul li a, .buylink__link {
    padding: 0 10px;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
}

.slider1-modal .modal-box-wrapper ul li {
    background: linear-gradient(to bottom, #FFAB00, #FF1000);
}

.slider2-modal .modal-box-wrapper ul li {
    background: linear-gradient(to bottom, #FFADC9, #FF3C80 75%, #FF176A);
}

.slider3-modal .modal-box-wrapper ul li,
.slider7-modal .modal-box-wrapper ul li {
    background: linear-gradient(to bottom, #BFD3E7, #1E8FCA 55%, #0075B1 85%, #005B8A);
}

.slider6-modal .modal-box-wrapper ul li {
    background: linear-gradient(to bottom, #f4769e, #d7235c);
}

.sanrio {
    display: none;
}

.copyright {
    text-align: center;
}

.copyright p {
    display: inline-block;
    text-align: left;
}

@media screen and (max-width: 768px) {
    .main-bg3 {
        /* background: url(./../images/bg2-sp.jpg) no-repeat bottom center / cover, #ffd9e4; */
        background: url(./../images/bg7.jpg) no-repeat bottom center / cover, #D9EFFF;
    }
    .slider {
        padding: 0 1%;
    }
    .slider-cont .slider-cont2 .bg {
        background-image: url(./../images/bg1-sp.jpg);
    }
    .slider-cont .slider-cont4 .bg {
        background-image: url(./../images/bg6-sp.jpg);
    }
    .slider-cont h2 {
        font-size: 2rem;
    }
}

@media screen and (max-width: 600px) {
    .youtube-thumbnail .slick-current figure {
        border: 2px solid #FF3C80;
    }
    .slider .slick-slide,
    .youtube-thumbnail .slick-slide {
        padding: 0 2px;
    }
    .youtube-thumbnail .slick-prev,
    .youtube-thumbnail .slick-next {
        width: 40px;
    }
    .youtube-thumbnail {
        padding: 0 44px;
    }
    ul.step li {
        width: 100%;
        margin-bottom: 50px;
    }
    .step-num img,
    .cmn-item {
        width: 100%;
    }
    .step-num {
        position: absolute;
        left: 8%;
        top: 2%;
        width: 15%;
    }
    .step-num::before {
        left: -65%;
        width: 240%;
        top: -60%;
        height: 220%;
        transform: rotate(-22deg);
    }
    .cmn-cont h2 {
        font-size: 1.5rem;
    }
    .modal-box-wrapper ul li, .buylink__list-item {
        width: 100%;
        margin: 5px 0;
    }
    .modal-box-wrapper {
        padding: 50px 5%;
    }
    ul.step li:not(:last-child)::after {
        right: 50%;
        top: 100%;
        transform: translateX(50%) rotate(90deg);
    }
}

@media screen and (max-width: 480px) {
    .youtube-slider .slick-slide {
        padding: 0 5px;
    }
    .slider-cont h2,
    .modal-box-wrapper p {
        font-size: 1.25rem;
    }
    .modal-box-wrapper .close {
        right: 0;
        top: 0;
    }
}