main{
    overflow-x: hidden;
}
/* -------------------------------base(mobile)↓-------------------------------------- */
/* h start */
h2,
.wp_categories>span{
    font-weight: 700;
    font-size: calc(24 * var(--site-horizontal-ratio));
}
h2::before,
.wp_categories>span::before{
    color: #DAD0C2;
    font-family: var(--site-font-family-Aboreto);
    font-weight: 400;
    font-size: calc(20 * var(--site-horizontal-ratio));
    line-height: calc(20 * var(--site-horizontal-ratio));
    display: block;
    width: fit-content;
    margin: auto;
    margin-bottom: calc(calc(3383 - 3343 - 20) * var(--site-horizontal-ratio));
    text-align: center;
}
h2.vertical{
    position: relative;
}
h2.vertical::before{
    margin-bottom: 0;
    position: absolute;
    top: 0;
    left: 0;
    transform: rotate(-90deg) translate(-100%,calc(20 * var(--site-horizontal-ratio)));
    transform-origin: 0 0;
}
h3{
    font-weight: 700;
    font-size: calc(16 * var(--site-horizontal-ratio));
    text-align: center;
}
h4{
    font-weight: 700;
    font-size: calc(14 * var(--site-horizontal-ratio));
    text-align: center;
    letter-spacing: 0.1em;
}
/* h end */

/* top start */
.top{
    padding-top: calc(520 * var(--site-horizontal-ratio));
    position: relative;
    overflow: hidden;
}
.top>video{
    height: calc(520 * var(--site-horizontal-ratio));
    position: absolute;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
}
.top>div{
    position: absolute;
    width: fit-content;
    top: calc(20 * var(--site-horizontal-ratio));
    left: calc(20 * var(--site-horizontal-ratio));
}
.top>div>img{
    width: calc(121.77 * var(--site-horizontal-ratio));
}
.top>div>h1{
    font-size: calc(7 * var(--site-horizontal-ratio));
    text-align: center;
}
.top>p{
    margin-top: calc(calc(540 - 520) * var(--site-horizontal-ratio));
    padding-left: calc(20 * var(--site-horizontal-ratio));
    font-weight: 700;
    font-size: calc(24 * var(--site-horizontal-ratio));
    line-height: calc(30 * var(--site-horizontal-ratio));
    letter-spacing: 0.2em;
}
.top>p>span{
    margin-top: calc(calc(612 - 540 - 60) * var(--site-horizontal-ratio));
    font-size: calc(14 * var(--site-horizontal-ratio));
    line-height: calc(14 * var(--site-horizontal-ratio));
    letter-spacing: 0.1em;
}
.top>a{
    width: 100%;
    height: calc(60 * var(--site-horizontal-ratio));
    padding-left: calc(30 * var(--site-horizontal-ratio));
    padding-right: calc(9.25 * var(--site-horizontal-ratio));
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: calc(calc(666 - 612 - 14) * var(--site-horizontal-ratio));
    background: linear-gradient(to left,#D4CA04 calc(30 * var(--site-horizontal-ratio)),#FAEE00 calc(30 * var(--site-horizontal-ratio)) 100%);
    font-size: calc(16 * var(--site-horizontal-ratio));
    line-height: calc(23.68 * var(--site-horizontal-ratio));
    letter-spacing: 0.1em;
    text-decoration: none;
    color: var(--site-color-baseText);
    font-weight: 700;
    position: relative;
}
.top>a>span{
    color: rgb(240, 102, 102);
}
.top>a::after{
    content: "";
    display: block;
    width: calc(9 * var(--site-horizontal-ratio));
    height: calc(7.5 * var(--site-horizontal-ratio));
    background-image: url(../images/index/top-button-after.svg);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    transform: scale(1.5);
    position: absolute;
    right: calc(10 * var(--site-horizontal-ratio));
}
/* top end */

/* impress start */
.impress{
    margin-top: calc(calc(790 - 738 - 40) * var(--site-horizontal-ratio));
    padding: calc(calc(850 - 790) * var(--site-horizontal-ratio)) calc(20 * var(--site-horizontal-ratio)) calc(calc(1561 - 1305 - 196) * var(--site-horizontal-ratio));
    background-image: url(../images/index/impress-background.png);
    background-position: right bottom;
    background-size: contain;
    position: relative;
}
.impress::before{
    content: "";
    display: block;
    height: 100%;
    width: calc(160 * var(--site-horizontal-ratio));
    background-color: #F2E600;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
}
.impress>img{
    width: calc(258 * var(--site-horizontal-ratio));
}
.impress>h2{
    margin-top: calc(calc(1177 - 850 - 307) * var(--site-horizontal-ratio));
    line-height: calc(36 * var(--site-horizontal-ratio));
}
.impress>P{
    margin-top: calc(calc(1305 - 108 - 1177) * var(--site-horizontal-ratio));
    font-weight: 700;
    font-size: calc(14 * var(--site-horizontal-ratio));
    line-height: calc(28 * var(--site-horizontal-ratio));
    letter-spacing: 0.1em;
}
/* impress end */

/* campaign start */
.campaign img{
    width: 100%;
}
/* campaign end */

/* professional start */
.professional{
    background-color: #F7F4ED;
    padding-top: calc(calc(1621 - 1561) * var(--site-horizontal-ratio));
    padding-bottom: calc(calc(1561 + 934 - 2213 - 222) * var(--site-horizontal-ratio));
}
.professional>*{
    padding: 0 calc(20 * var(--site-horizontal-ratio));
}
.professional>*[class~='splide']{
    padding: 0;
}
.professional>h2,
.professional>p{
    padding-left: calc(49 * var(--site-horizontal-ratio));
}
.professional>h2{
    line-height: calc(32 * var(--site-horizontal-ratio));
}
.professional>h2>span:nth-of-type(1){
    color: rgb(240, 102, 102);
}
.professional>h2::before{
    content: "Professional";
}
.professional>p{
    margin-top: calc(calc(1705 - 1621 - 64) * var(--site-horizontal-ratio));
    font-weight: 500;
    font-size: calc(14 * var(--site-horizontal-ratio));
    line-height: calc(21 * var(--site-horizontal-ratio));
    letter-spacing: 0.1em;
}
.professional>span{
    display: block;
    font-weight: 500;
    font-size: calc(12 * var(--site-horizontal-ratio));
    line-height: calc(18 * var(--site-horizontal-ratio));
}
.professional>span:nth-of-type(1){
    margin-top: calc(calc(1808 - 1705 - 63) * var(--site-horizontal-ratio));
}
.professional>span:nth-of-type(1)::before{
    content: "";
    display: block;
    width: 100%;
    height: calc(54 * var(--site-horizontal-ratio));
    background-image: url(../images/index/professional-span-before.png);
    background-repeat: no-repeat;
    background-size: contain;
    background-position: center;
    margin-bottom: calc(calc(1882 - 1808 - 54) * var(--site-horizontal-ratio));
}
.professional>video{
    width: 100%;
    margin-top: calc(calc(1948 - 1882 - 36) * var(--site-horizontal-ratio));
}
.professional>span:nth-of-type(2){
    margin-top: calc(calc(2157 - 1948 - 196.72) * var(--site-horizontal-ratio));
}
.professional>.professional_splide{
    margin-top: calc(calc(2213 - 2157 - 36) * var(--site-horizontal-ratio));
}
.professional>.professional_splide .splide__slide>video{
    width: 100%;
}
.professional>.professional_splide .splide__slide>p{
    margin-top: calc(calc(147 - 135) * var(--site-horizontal-ratio));
    font-weight: 700;
    font-size: calc(14 * var(--site-horizontal-ratio));
    line-height: calc(21 * var(--site-horizontal-ratio));
}
.professional>.professional_splide .splide__slide>span{
    display: block;
    width: 100%;
    text-align: right;
    margin-top: calc(calc(201 - 147 - 42) * var(--site-horizontal-ratio));
    font-weight: 500;
    font-size: calc(14 * var(--site-horizontal-ratio));
    line-height: calc(21 * var(--site-horizontal-ratio));
}
/* professional end */

/* partner start */
.partner{
    margin-top: calc(calc(2555 - 1561 - 934) * var(--site-horizontal-ratio));
}
.partner>*{
    padding: 0 calc(20 * var(--site-horizontal-ratio));
}
.partner>h2::before{
    content: "PARTNER";
}
.partner>h2,
.partner>p{
    padding-left: calc(49 * var(--site-horizontal-ratio));
}
.partner>h2{
    line-height: calc(32 * var(--site-horizontal-ratio));
    word-break: keep-all;
}
.partner>h2>span::before,
.partner>h2>span::after{
    content: "”";
}
.partner>p{
    margin-top: calc(calc(2671 - 2555 - 96) * var(--site-horizontal-ratio));
    font-weight: 500;
    font-size: calc(14 * var(--site-horizontal-ratio));
    line-height: calc(21 * var(--site-horizontal-ratio));
    letter-spacing: 0.1em;
}
.partner>.partner_splide{
    padding: 0;
    margin-top: calc(calc(2795 - 2671 - 84) * var(--site-horizontal-ratio));
    margin-bottom: calc(calc(2988 - 2795 - 273) * var(--site-horizontal-ratio));
}
.partner>dl{
    background-color: #F2E600;
    padding-top: calc(calc(3108 - 2988) * var(--site-horizontal-ratio));
    padding-bottom: calc(50 * var(--site-horizontal-ratio));
}
.partner>dl>dt{
    font-weight: 700;
    font-size: calc(14 * var(--site-horizontal-ratio));
    line-height: calc(20.72 * var(--site-horizontal-ratio));
}
.partner>dl>dd{
    margin-top: calc(10 * var(--site-horizontal-ratio));
    font-weight: 400;
    font-size: calc(14 * var(--site-horizontal-ratio));
    line-height: calc(20.72 * var(--site-horizontal-ratio));
}
/* partner end */

.faq+.campaign img{
    margin: calc(30 * var(--site-horizontal-ratio)) auto;
}

/* wp_categories start */
.wp_categories{
    background-color: #F2E600;
    padding: calc(calc(1467.57 - 1347.57) * var(--site-horizontal-ratio) / 2) calc(20 * var(--site-horizontal-ratio));
}
.wp_categories>span{
    display: block;
    text-align: center;
}
.wp_categories>span::before{
    content: "CATEGORIES";
    color: #ffffff;
}
.wp_categories>div{
    margin-top: calc(60 * var(--site-horizontal-ratio));
    display: flex;
    flex-wrap: wrap;
    gap: calc(20 * var(--site-horizontal-ratio));
}
.wp_categories>div>a{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: calc(9 * var(--site-horizontal-ratio));
    width: calc(calc(100% - calc(20 * var(--site-horizontal-ratio))) / 2);
    text-decoration: none;
    color: inherit;
}
.wp_categories>div>a>img{
    width: 100%;
}
.wp_categories>div>a>span{
    font-weight: 700;
    font-size: calc(10 * var(--site-horizontal-ratio));
    letter-spacing: 0.1em;
}
/* wp_categories end */

/* notice start */
.notice{
    margin-top: calc(calc(7150 - 6215 - 855) * var(--site-horizontal-ratio));
    padding: 0 calc(20 * var(--site-horizontal-ratio));
}
.notice>h2{
    font-size: calc(18 * var(--site-horizontal-ratio));
    line-height: calc(27 * var(--site-horizontal-ratio));
}
.notice>ul{
    margin-top: calc(calc(7187 - 7150 - 27) * var(--site-horizontal-ratio));
    border: calc(1 * var(--site-horizontal-ratio)) solid var(--site-color-baseText);
    padding: calc(20 * var(--site-horizontal-ratio));
    display: flex;
    flex-wrap: wrap;
    gap: calc(20 * var(--site-horizontal-ratio));
}
.notice>ul>li{
    width: 100%;
    display: flex;
    flex-wrap: wrap;
    gap: calc(10 * var(--site-horizontal-ratio));
}
.notice>ul>li>*{
    display: block;
    width: 100%;
    text-decoration: none;
    color: var(--site-color-baseText);
    font-weight: 500;
    font-size: calc(14 * var(--site-horizontal-ratio));
    line-height: calc(21 * var(--site-horizontal-ratio));
    letter-spacing: 0.1em;
}
/* notice end */

/* overlay start */
.overlay{
    display: none;
}
@keyframes overlay_fadeIn{
    0% {opacity: 0;}
    100% {opacity: 1;}
}
.overlay_fadeIn{
    display: flex;
    flex-wrap: nowrap;
    position: fixed;
    bottom: 0;
    animation:overlay_fadeIn 0.5s linear;
}
.overlay>a{
    display: block;
    width: 50%;
}
.overlay>a>img{
    width: 100%;
}
/* overlay end */

/*== landscape responsive ==*/
@media screen and (max-width: 767px) and (orientation: landscape){
}
/*== landscape responsive ==*/
/* -------------------------------base(mobile)↑-------------------------------------- */

/* ---------------------------desktop(include ipad)↓--------------------------------- */
@media screen and (min-width: 768px){

/* h start */
h2,
.wp_categories>span{
    font-size: calc(32 * var(--site-horizontal-ratio));
}
h2::before,
.wp_categories>span::before{
    font-size: calc(30 * var(--site-horizontal-ratio));
    line-height: calc(30 * var(--site-horizontal-ratio));
    margin-bottom: calc(calc(3418 - 3378 - 30) * var(--site-horizontal-ratio));
}
h2.vertical::before{
    transform: rotate(-90deg) translate(-100%, calc(40 * var(--site-horizontal-ratio)));
}
h3{
    font-size: calc(24 * var(--site-horizontal-ratio));
}
h4{
    font-size: calc(16 * var(--site-horizontal-ratio));
}
/* h start */

/* top start */
.top{
    padding-top: 0;
    height: calc(840 * var(--site-horizontal-ratio));
    height: calc(810 * var(--site-horizontal-ratio));
    max-height: 100vh;
}
.top>video{
    width: 100vw;
    height: auto;
}
.top>div{
    top: calc(40 * var(--site-horizontal-ratio));
    left: calc(40 * var(--site-horizontal-ratio));
}
.top>p{
    margin-top: 0;
    padding-left: 0;
    font-size: calc(48 * var(--site-horizontal-ratio));
    line-height: calc(60 * var(--site-horizontal-ratio));
    letter-spacing: 0.2em;
    color: #ffffff;
    position: absolute;
    left: calc(40 * var(--site-horizontal-ratio));
    bottom: calc(calc(840 - 733 - 27) * var(--site-horizontal-ratio));
}
.top>a{
    width: fit-content;
    margin-top: 0;
    background: linear-gradient(to left, #F2E600 calc(24 * var(--site-horizontal-ratio)), #ffffff calc(24 * var(--site-horizontal-ratio)) 100%);
    font-size: calc(18 * var(--site-horizontal-ratio));
    line-height: calc(26.64 * var(--site-horizontal-ratio));
    position: absolute;
    right: 0;
    bottom: calc(calc(840 - 700 - 60) * var(--site-horizontal-ratio));
    padding: 0 calc(36 * var(--site-horizontal-ratio)) 0 calc(18 * var(--site-horizontal-ratio));
}
.top>a::after{
    height: calc(10.5 * var(--site-horizontal-ratio));
    transform: scale(1.2);
    right: calc(6 * var(--site-horizontal-ratio));
}
.top>p>span{
    margin-top: calc(calc(733 - 595 - 120) * var(--site-horizontal-ratio));
    font-size: calc(18 * var(--site-horizontal-ratio));
    line-height: calc(27 * var(--site-horizontal-ratio));
    margin-left: calc(-6 * var(--site-horizontal-ratio));
}
/* top end */

/* impress start */
.impress{
    margin-top: calc(calc(840 - 870 - 31.21) * var(--site-horizontal-ratio));
    padding: calc(calc(974 - 840) * var(--site-horizontal-ratio)) calc(40 * var(--site-horizontal-ratio)) calc(calc(1598 - 974 - 500 + 30) * var(--site-horizontal-ratio));
    display: grid;
    grid-template-areas: 
        "impress-img impress-h2"
        "impress-img impress-p";
    grid-template-columns: calc(420 * var(--site-horizontal-ratio)) 1fr;
    column-gap: calc(calc(580 - 420 - 40) * var(--site-horizontal-ratio));
    row-gap: calc(calc(1257 - 1035 - 192) * var(--site-horizontal-ratio));
    background-image: url(../images/index/impress-background-desktop.png);
    background-size: cover;
}
.impress::before{
    width: calc(200 * var(--site-horizontal-ratio));
}
.impress>img{
    width: 100%;
    grid-area: impress-img;
}
.impress>h2{
    grid-area: impress-h2;
    margin-top: 0;
    align-self: flex-end;
    line-height: calc(64 * var(--site-horizontal-ratio));
}
.impress>p{
    grid-area: impress-p;
    margin-top: 0;
    align-self: flex-start;
    font-size: calc(16 * var(--site-horizontal-ratio));
    line-height: calc(44 * var(--site-horizontal-ratio));
}
/* impress end */

/* campaign start */
.campaign{
    display: block;
    width: fit-content;
    margin: auto;
}
.campaign img{
    display: block;
    width: auto;
    height: calc(250 * var(--site-horizontal-ratio));
}
.impress+.campaign{
    position: relative;
    z-index: 1;
}
.impress+.campaign img{
    margin: calc(-125 * var(--site-horizontal-ratio)) auto calc(-125 * var(--site-horizontal-ratio));
}
/* campaign end */

/* professional start */
.professional{
    padding-top: calc(calc(1688  - 1598 + 30) * var(--site-horizontal-ratio));
    padding-bottom: calc(calc(1598 + 899 - 2119 - 280) * var(--site-horizontal-ratio));
    display: grid;
    grid-template-areas:
        "professional-h2 professional-video"
        "professional-p professional-video"
        "professional-span1 professional-video"
        "professional-splide professional-splide";
    grid-template-columns: 1fr calc(600 * var(--site-horizontal-ratio));
}
.professional>*{
    padding: 0 calc(40 * var(--site-horizontal-ratio));
}
.professional>h2,
.professional>p,
.professional>span:nth-of-type(1){
    padding-left: calc(114 * var(--site-horizontal-ratio));
}
.professional>h2{
    grid-area: professional-h2;
    line-height: calc(64 * var(--site-horizontal-ratio));
}
.professional>p{
    grid-area: professional-p;
    margin-top: calc(calc(1836 - 1688 - 128) * var(--site-horizontal-ratio));
    font-weight: 700;
    font-size: calc(16 * var(--site-horizontal-ratio));
    line-height: calc(32 * var(--site-horizontal-ratio));
}
.professional>span:nth-of-type(1){
    grid-area: professional-span1;
    margin-top: calc(calc(1940 - 1836 - 64) * var(--site-horizontal-ratio));
}
.professional>span:nth-of-type(1)::before{
    height: calc(74 * var(--site-horizontal-ratio));
    background-position: left;
    margin-bottom: calc(calc(2034 - 1940 - 74) * var(--site-horizontal-ratio));
}
.professional>video{
    grid-area: professional-video;
    margin-top: 0;
    align-self: flex-end;
}
.professional>span:nth-of-type(2){
    grid-area: professional-span2;
    margin-top: calc(calc(2036 - 1688 - 337.24) * var(--site-horizontal-ratio));
}
.professional>.professional_splide{
    grid-area: professional-splide;
    margin-top: calc(calc(2119 - 2034 - 18) * var(--site-horizontal-ratio));
}
.professional>.professional_splide .splide__slide>p{
    margin-top: calc(calc(199 - 180.18) * var(--site-horizontal-ratio));
}
.professional>.professional_splide .splide__slide>span{
    margin-top: calc(calc(259 - 199 - 42) * var(--site-horizontal-ratio));
}
/* professional end */

/* partner end */
.partner{
    margin-top: calc(calc(2617 - 1598 - 899) * var(--site-horizontal-ratio));
}
.partner>*{
    padding: 0 calc(40 * var(--site-horizontal-ratio));
}
.partner>h2,
.partner>p{
    padding-left: calc(114 * var(--site-horizontal-ratio));
}
.partner>h2{
    line-height: calc(48 * var(--site-horizontal-ratio));
}
.partner>h2>span::before,
.partner>h2>span::after{
    font-weight: 400;
    font-family: initial;
}
.partner>h2>span::before{
    content: "「";
}
.partner>h2>span::after{
    content: "」";
}
.partner>p{
    margin-top: calc(calc(2731 - 2617 - 96) * var(--site-horizontal-ratio));
    font-weight: 700;
    font-size: calc(16 * var(--site-horizontal-ratio));
    line-height: calc(32 * var(--site-horizontal-ratio));
}
.partner>.partner_splide{
    margin-top: calc(calc(2855 - 2731 - 64) * var(--site-horizontal-ratio));
    margin-bottom: calc(calc(2991 - 2855 - 273) * var(--site-horizontal-ratio));
}
.partner>dl{
    padding-top: calc(calc(3168 - 2991) * var(--site-horizontal-ratio));
    padding-bottom: calc(calc(3301 - 3168 - 73) * var(--site-horizontal-ratio));
}
/* partner end */

.faq+.campaign img{
    margin: calc(50 * var(--site-horizontal-ratio)) auto;
}

/* wp_categories start */
.wp_categories{
    padding: calc(calc(1282 - 1042) * var(--site-horizontal-ratio) / 2) calc(calc(1440 - 1240) * var(--site-horizontal-ratio) / 2);
}
.wp_categories>div{
    gap: calc(10 * var(--site-horizontal-ratio)) calc(40 * var(--site-horizontal-ratio));
}
.wp_categories>div>a{
    width: calc(calc(100% - calc(3 * 40 * var(--site-horizontal-ratio))) / 4);
}
.wp_categories>div>a>span{
    font-size: calc(14 * var(--site-horizontal-ratio));
}
/* wp_categories end */

/* notice start */
.notice{
    margin-top: calc(calc(6754 - 5914 - 720) * var(--site-horizontal-ratio));
    padding: 0 calc(40 * var(--site-horizontal-ratio));
}
.notice>ul{
    margin-top: calc(calc(6791 - 6754 - 27) * var(--site-horizontal-ratio));
    padding: calc(40 * var(--site-horizontal-ratio));
}
.notice>ul>li{
    flex-wrap: wrap;
    gap: calc(40 * var(--site-horizontal-ratio));
}
.notice>ul>li>*{
    width: fit-content;
}
/* notice end */

/* overlay start */
.overlay{
    display: none !important;
}
.overlay_fadeIn{
    display: none !important;
    opacity: 0;
}
/* overlay end */

}
/* ---------------------------desktop(include ipad)↑--------------------------------- */