:root {
    --black-color: #121212;
    --black-color-02: #000;
    --black-color-03: #2B2B2B;
    --accent-color: #7F0001;
    --color-white: #ffffff;
    --background-color-beige: #EEE1D7;
    --leather_background: lightgray 50% / cover no-repeat, #F9F9F9;
    --gray-line: #C0C0C0;
    --font-base: 16px;
    --base-font: 'Noto Sans JP', sans-serif;
    --secondary-font: 'Open Sans', sans-serif;
    --english-font: 'Jost', sans-serif;
    --l-inner-width1-pc: 1092px;
    --l-inner-width2-pc: 1088px;
    --l-inner-width3-pc: 960px;
    --l-inner-width4-pc: 1090px;
    --l-inner-width5-pc: 1182px;
    --l-inner-width6-pc: 730px;
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-bold: 700;
    --breakpoint-desktop: 1921px;
    --breakpoint-pc: 1280px;
    --breakpoint-tablet: 960px;
    --breakpoint-sp: 768px;
}

.c-link {
    text-decoration: none;
    color: inherit;
    transition: opacity 0.3s;
}

.c-link:hover {
    opacity: .8;
    text-decoration: none;
}

@media (max-width: 960px) {
    #start-contents {
        margin-top: 95px;
        margin-bottom: -89px;
        padding-top: 0;
    }
}

@media (max-width: 540px) {
    #start-contents {
        margin-top: 35px;
        margin-bottom: -89px;
        padding-top: 0;
    }
}

.l-inner-width1-pc {
    max-width: var(--l-inner-width1-pc);
    width: 100%;
    margin-inline: auto;
    padding-inline: 25px;
}

@media (max-width: 768px) {
    .l-inner-width1-pc {
        max-width: 640px;
        padding-inline: 20px;
    }
}

.l-inner-width2-pc {
    max-width: var(--l-inner-width2-pc);
    width: 100%;
    margin-inline: auto;
    padding-inline: 25px;
}

@media (max-width: 960px) {
    .l-inner-width2-pc {
        max-width: 654px;
        padding-inline: 27px;
    }
}

.l-inner-width3-pc {
    max-width: var(--l-inner-width3-pc);
    width: 100%;
    margin-inline: auto;
    padding-inline: 25px;
}

@media (max-width: 768px) {
    .l-inner-width3-pc {
        max-width: 640px;
        padding-inline: 27px;
    }
}

.l-inner-width4-pc {
    max-width: var(--l-inner-width4-pc);
    width: 100%;
    margin-inline: auto;
    padding-inline: 25px;
}

@media (max-width: 768px) {
    .l-inner-width4-pc {
        max-width: 640px;
        padding-inline: 27px;
    }
}

.l-inner-width6-pc {
    max-width: var(--l-inner-width6-pc);
    width: 100%;
    margin-inline: auto;
    padding-inline: 25px;
}

@media (max-width: 768px) {
    .l-inner-width6-pc {
        max-width: 640px;
        padding-inline: 27px;
    }
}

.c-btn01 {
    display: block;
    width: 243px;
    max-width: 100%;
    padding: 20px 48px;
    border-radius: 5px;
    border: 1px solid var(--accent-color);
    background-color: var(--color-white);
    color: var(--accent-color);
    text-align: center;
    font-family: var(--base-font);
    font-size: var(--font-base);
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    box-shadow: 0 4px 4px 0 rgb(0 0 0 / .25);
    transition: color 0.3s, background-color 0.3s;
}

@media (max-width: 768px) {
    .c-btn01 {
        font-size: 14px;
        font-weight: var(--font-weight-medium);
        line-height: 1.7;
        width: 160px;
        padding: 14px;
        letter-spacing: .02em;
    }
}

.c-btn01:hover {
    border: 1px solid var(--accent-color);
    background-color: #FDEFEF;
    opacity: 1;
}

@media (min-width: 1921px) {
    .c-btn01--fv {
        font-size: .83vw;
        width: auto;
        padding: 1.04vw 2.5vw;
    }
}

@media (max-width: 1280px) {
    .c-btn01--fv {
        width: 200px;
        padding: 20px 0;
    }
}

@media (max-width: 960px) {
    .c-btn01--fv {
        width: 175px;
        padding: 14px;
    }
}

@media (max-width: 450px) {
    .c-btn01--fv {
        width: 162px;
    }
}

@media (max-width: 389px) {
    .c-btn01--fv {
        font-size: 12px;
        width: 145px;
        padding: 5px;
    }
}

@media (max-width: 768px) {
    .c-btn01--ranking {
        font-size: 16px;
        width: 100%;
        padding: 17px 48px;
    }
}

.c-btn02 {
    display: block;
    width: 243px;
    max-width: 100%;
    padding: 20px 48px;
    border-radius: 5px;
    border: 1px solid var(--accent-color);
    background: var(--accent-color);
    box-shadow: 0 4px 4px 0 rgb(0 0 0 / .25);
    color: var(--color-white);
    text-align: center;
    font-family: var(--base-font);
    font-size: var(--font-base);
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    transition: background-color 0.3s;
}

@media (max-width: 768px) {
    .c-btn02 {
        font-size: 14px;
        font-weight: var(--font-weight-medium);
        line-height: 1.7;
        letter-spacing: .02em;
        width: 160px;
        padding: 14px;
    }
}

.c-btn02:hover {
    background-color: #C01516;
    opacity: 1;
}

@media (min-width: 1921px) {
    .c-btn02--fv {
        font-size: .83vw;
        width: auto;
        padding: 1.04vw 2.5vw;
    }
}

@media (max-width: 1280px) {
    .c-btn02--fv {
        width: 200px;
        padding: 20px 0;
    }
}

@media (max-width: 960px) {
    .c-btn02--fv {
        width: 175px;
        padding: 14px;
    }
}

@media (max-width: 450px) {
    .c-btn02--fv {
        width: 162px;
    }
}

@media (max-width: 389px) {
    .c-btn02--fv {
        font-size: 12px;
        width: 145px;
        padding: 5px;
    }
}

.c-btn02--ranking {
    white-space: nowrap;
}

@media (max-width: 768px) {
    .c-btn02--ranking {
        font-size: 16px;
        width: 100%;
        padding: 18px 48px;
    }
}

.c-btn03 {
    position: relative;
    display: block;
    width: max-content;
    max-width: 100%;
    padding: 0 2px;
    border-bottom: 1px solid var(--accent-color);
    color: var(--black, #121212);
    font-size: 14px;
    font-weight: var(--font-weight-medium);
    line-height: 1.9;
    letter-spacing: .02em;
    margin-inline-start: auto;
    margin-inline-end: 37px;
    transition: border-bottom 0.3s;
}

@media (max-width: 768px) {
    .c-btn03 {
        margin-inline-end: 41px;
    }
}

.c-btn03::after {
    position: absolute;
    content: "";
    width: 32px;
    height: 32px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15' fill='none'%3E%3Cpath d='M6.25 4.375L9.375 7.5L6.25 10.625' stroke='white' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
    background-color: var(--accent-color);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 70% 70%;
    border-radius: 50%;
    top: 50%;
    right: -42px;
    transform: translateY(-50%);
    transition: background-color 0.3s;
}

@media (max-width: 768px) {
    .c-btn03::after {
        top: 63%;
        right: -41px;
    }
}

.c-btn03:hover {
    border-bottom: 1px solid #C01516;
    opacity: 1;
}

.c-btn03:hover::after {
    background-color: #C01516;
}

a.c-btn03 {
    text-decoration: none;
}

.c-btn04-group {
    display: flex;
    justify-content: center;
    column-gap: 24px;
}

@media (max-width: 768px) {
    .c-btn04-group {
        flex-direction: column-reverse;
    }
}

@media (max-width: 768px) {
    .c-btn04-group--margin {
        margin-block-start: 40px;
    }
}

.c-btn04-group__detail {
    font-size: 14px;
    font-weight: var(--font-weight-medium);
    line-height: 2;
    letter-spacing: .02em;
    text-align: center;
}

.c-btn04-group__outer {
    margin-block-start: 8px;
}

.c-title {
    font-size: 32px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .1em;
    text-align: center;
}

@media (max-width: 768px) {
    .c-title {
        font-size: 20px;
        letter-spacing: .06em;
    }
}

.p-fv {
    background-image: url(https://gigaplus.makeshop.jp/topuniverse/images/trial-set/coding/fv/bg_fv_pc.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    height: 48.54vw;
    overflow: hidden;
}

@media (max-width: 960px) {
    .p-fv {
        height: auto;
        padding-bottom: 37px;
    }
}

.p-fv__inner {
    height: 100%;
}

.p-fv__container {
    display: flex;
    height: 100%;
}

@media (max-width: 960px) {
    .p-fv__container {
        flex-direction: column-reverse;
    }
}

.p-fv__wrapper {
    display: flex;
    flex-direction: column;
    max-width: 501px;
    width: 100%;
    margin-block-start: 165px;
    margin-inline: auto 102px;
}

@media (min-width: 1537px) {
    .p-fv__wrapper {
        margin-block: auto;
    }
}

@media (min-width: 1921px) {
    .p-fv__wrapper {
        max-width: 100%;
        width: auto;
    }
}

@media (max-width: 1280px) {
    .p-fv__wrapper {
        max-width: 43.14%;
        margin-inline-end: 3%;
    }
}

@media (max-width: 960px) {
    .p-fv__wrapper {
        align-items: center;
        max-width: none;
        margin-block-start: 24px;
        padding-inline: 20px;
    }
}

.p-fv__sub-title {
    position: relative;
    font-size: 24px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .08em;
    padding-block-end: 7px;
}

@media (min-width: 1921px) {
    .p-fv__sub-title {
        font-size: 1.25vw;
    }
}

@media (max-width: 1280px) {
    .p-fv__sub-title {
        font-size: 20px;
        width: max-content;
    }
}

@media (max-width: 960px) {
    .p-fv__sub-title {
        font-size: 24px;
        font-weight: var(--font-weight-medium);
    }
}

@media (max-width: 600px) {
    .p-fv__sub-title {
        font-size: 18px;
    }
}

@media (max-width: 450px) {
    .p-fv__sub-title {
        font-size: 16px;
    }
}

@media (max-width: 389px) {
    .p-fv__sub-title {
        font-size: 14px;
    }
}

.p-fv__sub-title::before {
    position: absolute;
    content: "";
    width: 102%;
    height: 2px;
    background-color: var(--black-color);
    bottom: 0;
    left: -6px;
}

.p-fv__title {
    font-size: 40px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .05em;
    margin-block-start: 23px;
}

@media (min-width: 1921px) {
    .p-fv__title {
        font-size: 2.08vw;
    }
}

@media (max-width: 1280px) {
    .p-fv__title {
        font-size: 32px;
    }
}

@media (max-width: 960px) {
    .p-fv__title {
        font-size: 40px;
        line-height: 1.35;
        letter-spacing: .1em;
        margin-block-start: 15px;
        text-align: center;
    }
}

@media (max-width: 600px) {
    .p-fv__title {
        font-size: 30px;
    }
}

@media (max-width: 450px) {
    .p-fv__title {
        font-size: 26px;
        text-align: left;
    }
}

@media (max-width: 389px) {
    .p-fv__title {
        font-size: 22px;
    }
}

.p-fv__link-group {
    display: flex;
    margin-block-start: 32px;
}

@media (max-width: 960px) {
    .p-fv__link-group {
        margin-block-start: 23px;
    }
}

.p-fv__link--margin {
    margin-left: 20px;
}

.c-p-fv__link {
    white-space: nowrap;
}

@media (min-width: 1921px) {
    .p-fv__link--margin {
        margin-left: 1.04vw;
    }
}

@media (max-width: 389px) {
    .p-fv__link--margin {
        margin-left: 5px;
    }
}

.p-fv__images {
    display: flex;
    max-width: 50.69%;
    width: 100%;
    height: 100%;
}

@media (max-width: 960px) {
    .p-fv__images {
        max-width: none;
        height: 92.31vw;
        padding-left: 6.67%;
        overflow: hidden;
    }
}

.p-fv__img-group {
    max-width: 50%;
    width: 100%;
    height: 100%;
}

@media (max-width: 960px) {
    .p-fv__img-group {
        max-width: 49.5%;
    }
}

@media (min-width: 961px) {
    .p-fv__img {
        font-size: 0;
    }
}

@media (max-width: 960px) {
    .p-fv__img {
        height: 33.3%;
    }
}

.p-fv__img img {
    width: 100%;
    height: auto;
    aspect-ratio: 365 / 233;
}

@media (max-width: 960px) {
    .p-fv__img img {
        height: 100%;
    }
}

.p-fv__img-swiper {
    max-width: 50%;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

@media (max-width: 960px) {
    .p-fv__img-swiper {
        max-width: 51%;
    }
}

.p-fv__img-swiper .swiper-wrapper {
    transition-timing-function: linear !important;
}

.swiper-no-swiping .swiper-wrapper {
    visibility: hidden;
}

.swiper-initialized .swiper-wrapper {
    visibility: visible;
}

.p-fv__img-swiper .swiper-slide img {
    width: 100%;
    height: 100%;
    aspect-ratio: 365 / 233;
    object-fit: cover;
    object-position: center;
}

.p-problem {
    padding-block: 112px 130px;
    background-image: url(/cdn/shop/files/bg_problem_pc.png?v=1743329332);
    background-size: cover;
    background-position: center bottom;
    background-repeat: no-repeat;
}

@media (max-width: 768px) {
    .p-problem {
        padding-block: 32px 56px;
        background-image: url(/cdn/shop/files/bg_problem_sp.png?v=1743329371);
    }
}

@media (max-width: 960px) {
    .p-problem__inner {
        max-width: 640px;
    }
}

.p-problem__container {
    text-align: center;
}

.p-problem__arrow {
    width: 298px;
    height: 7px;
    margin-block-start: 4px;
    margin-inline: auto;
}

@media (max-width: 768px) {
    .p-problem__arrow {
        display: none;
    }
}

.p-problem__sub-title {
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
}

@media (max-width: 768px) {
    .p-problem__sub-title {
        font-size: 16px;
        font-weight: var(--font-weight-medium);
        letter-spacing: .08em;
    }
}

.p-problem__title {
    font-size: 32px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .1em;
    margin-block-start: 27px;
}

@media (max-width: 768px) {
    .p-problem__title {
        font-size: 20px;
        letter-spacing: .06em;
        margin-block-start: 27px;
    }
}

@media (max-width: 375px) {
    .p-problem__title {
        font-size: 16px;
    }
}

.p-problem__wrapper {
    display: flex;
    column-gap: 23px;
    margin-block-start: 48px;
}

@media (max-width: 960px) {
    .p-problem__wrapper {
        display: block;
        max-width: 67%;
        width: 100%;
        margin-inline: auto;
        margin-block-start: 31px;
    }
}

@media (max-width: 768px) {
    .p-problem__wrapper {
        max-width: 264px;
    }
}

@media (max-width: 450px) {
    .p-problem__wrapper {
        max-width: 297px;
    }
}

.p-problem__group {
    display: flex;
    max-width: 31.86%;
    width: 100%;
    border-radius: 5px;
    border: 1.5px solid var(--black-color);
    background: var(--color-white);
    padding: 21px 17px 24px 17px;
}

@media (max-width: 960px) {
    .p-problem__group {
        max-width: none;
        margin-block-start: 16px;
        padding: 7px 9px 12px 12px;
    }
}

@media (max-width: 960px) {
    .p-problem__group:first-child {
        margin-block-start: 0;
    }
}

.p-problem__check-icon {
    width: 39px;
    height: 39px;
    margin-block-start: 2px;
}

@media (max-width: 960px) {
    .p-problem__check-icon {
        width: 30px;
        height: 30px;
    }
}

.p-problem__text-group {
    max-width: 87%;
    width: 100%;
    margin-block-start: 4px;
    margin-inline-start: 6px;
}

.p-problem__text {
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
    text-align: left;
}

@media (max-width: 1280px) {
    .p-problem__text {
        font-size: 16px;
    }
}

@media (max-width: 1080px) {
    .p-problem__text {
        font-size: 14px;
    }
}

@media (max-width: 960px) {
    .p-problem__text {
        font-weight: var(--font-weight-normal);
    }
}

@media (max-width: 450px) {
    .p-problem__text {
        font-size: 16px;
    }
}

.p-problem__text--line {
    font-size: 20px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .05em;
    text-decoration: underline;
}

@media (max-width: 1280px) {
    .p-problem__text--line {
        font-size: 18px;
    }
}

@media (max-width: 1080px) {
    .p-problem__text--line {
        font-size: 16px;
    }
}

.p-exactly {
    padding-block-start: 32px;
    padding-block-end: 83px;
    overflow: hidden;
}

@media (max-width: 768px) {
    .p-exactly {
        padding-block-start: 31px;
        padding-block-end: 56px;
    }
}

.p-exactly__title {
    text-align: center;
    font-size: 32px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .1em;
    padding-inline: 20px;
}

@media (max-width: 768px) {
    .p-exactly__title {
        font-size: 20px;
        letter-spacing: .06em;
    }
}

@media (max-width: 375px) {
    .p-exactly__title {
        font-size: 18px;
    }
}

.p-exactly__container {
    margin-block-start: 40px;
}

@media (max-width: 768px) {
    .p-exactly__container {
        margin-block-start: 32px;
    }
}

.p-exactly__summary {
    color: var(--color-white);
    text-align: center;
    font-size: 20px;
    font-weight: var(--font-weight-medium);
    line-height: 1;
    letter-spacing: .05em;
    background-color: var(--black-color);
    padding-block: 16px;
}

@media (max-width: 768px) {
    .p-exactly__summary {
        font-size: 16px;
        line-height: 1.5;
        letter-spacing: .08em;
        padding-block: 12px;
    }
}

.p-exactly__swiper .swiper-wrapper {
    transition-timing-function: linear !important;
    align-items: center;
}

.p-exactly__swiper .swiper-slide {
    opacity: 1 !important;
    visibility: visible !important;
    transition: opacity 0.3s ease-in-out;
}

.p-exactly__swiper .swiper-slide:hover {
    opacity: 0.5 !important;
}

.p-exactly__swiper .swiper-slide img {
    aspect-ratio: 1/1;
}

.p-exactly__btn {
    width: max-content;
    margin-block-start: 37px;
    margin-inline: auto;
}

.p-exactly__btn a {
    margin-inline-end: auto;
}

.p-reason {
    padding-block: 75px 112px;
    background-image: url(/cdn/shop/files/bg_reason_pc.png?v=1743329439);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

@media (max-width: 960px) {
    .p-reason {
        padding-block: 21px 72px;
        background-image: url(/cdn/shop/files/bg_reason_sp.png?v=1743329459);
    }
}

.p-reason__main-title {
    position: relative;
    text-align: center;
    font-size: 32px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .1em;
    width: max-content;
    margin-inline: auto;
    padding-block-end: 7px;
}

@media (max-width: 960px) {
    .p-reason__main-title {
        font-size: 20px;
        letter-spacing: .06em;
        padding-block-end: 10px;
    }
}

@media (max-width: 450px) {
    .p-reason__main-title {
        width: auto;
    }
}

@media (max-width: 375px) {
    .p-reason__main-title {
        font-size: 16px;
    }
}

.p-reason__main-title::before,
.p-reason__main-title::after {
    position: absolute;
    content: "";
    width: 100%;
    height: 2px;
    background-color: var(--black-color);
    left: 0;
}

.p-reason__main-title::before {
    bottom: 6px;
}

.p-reason__main-title::after {
    bottom: 0;
}

.p-reason__main-title--number {
    font-size: 56px;
    font-weight: var(--font-weight-medium);
}

@media (max-width: 960px) {
    .p-reason__main-title--number {
        font-size: 36px;
        font-weight: var(--font-weight-medium);
    }
}

@media (max-width: 375px) {
    .p-reason__main-title--number {
        font-size: 28px;
    }
}

.p-reason__container {
    margin-block-start: 81px;
}

@media (max-width: 960px) {
    .p-reason__container {
        margin-block-start: 48px;
    }
}

.p-reason__wrapper {
    display: flex;
    margin-block-start: 72px;
}

@media (max-width: 960px) {
    .p-reason__wrapper {
        flex-direction: column-reverse;
        margin-block-start: 61px;
    }
}

.p-reason__wrapper:first-of-type {
    margin-block-start: 0;
}

@media (max-width: 960px) {
    .p-reason__wrapper--reverse {
        flex-direction: column;
        margin-block-start: 73px;
    }
}

.p-reason__group {
    max-width: 45.7%;
    width: 100%;
    margin-block-start: -8px;
}

@media (max-width: 960px) {
    .p-reason__group {
        max-width: none;
        margin-block-start: 16px;
    }
}

.p-reason__group--reverse {
    margin-left: auto;
    max-width: 46.3%;
    margin-block-start: -10px;
}

@media (max-width: 960px) {
    .p-reason__group--reverse {
        max-width: none;
        margin-block-start: 13px;
        margin-left: 0;
    }
}

.p-reason__number {
    font-size: 32px;
    font-weight: var(--font-weight-medium);
    line-height: 1.7;
    letter-spacing: .1em;
    margin-inline-start: 7px;
}

@media (max-width: 960px) {
    .p-reason__number {
        font-size: 18px;
        font-weight: var(--font-weight-bold);
        line-height: 1.5;
        margin-inline-start: 0;
    }
}

.p-reason__summary-group {
    color: var(--color-white);
    font-size: 24px;
    font-weight: var(--font-weight-bold);
    line-height: 1.8;
    letter-spacing: .06em;
    margin-block-start: 5.5px;
}

@media (max-width: 1080px) {
    .p-reason__summary-group {
        font-size: 22px;
    }
}

@media (max-width: 960px) {
    .p-reason__summary-group {
        font-size: 18px;
        line-height: 1.5;
        letter-spacing: .1em;
        margin-block-start: 4px;
    }
}

@media (max-width: 375px) {
    .p-reason__summary-group {
        font-size: 15px;
    }
}

.p-reason__summary {
    width: max-content;
    padding: 2px 10px;
    background-color: var(--black-color);
}

@media (max-width: 768px) {
    .p-reason__summary {
        letter-spacing: .01em;
        padding: 4px 10px;
    }
}

.p-reason__summary:first-child {
    margin-block-end: 9px;
}

@media (max-width: 768px) {
    .p-reason__summary:first-child {
        margin-block-end: 7px;
    }
}

.p-reason__summary--reverse {
    padding: 2px 9px;
}

@media (max-width: 960px) {
    .p-reason__summary--reverse {
        margin-block-start: 5px;
        padding: 0;
    }
}

.p-reason__detail {
    color: var(--black-color);
    font-size: var(--font-base);
    font-weight: var(--font-weight-regular);
    line-height: 1.5;
    letter-spacing: .05em;
    margin-block-start: 24px;
}

@media (max-width: 960px) {
    .p-reason__detail {
        margin-block-start: 16px;
    }
}

@media (max-width: 375px) {
    .p-reason__detail {
        font-size: 14px;
    }
}

.p-reason__detail--reverse {
    margin-block-start: 26px;
}

@media (max-width: 960px) {
    .p-reason__detail--reverse {
        margin-block-start: 20px;
    }
}

.p-reason__btn {
    margin-block-start: 27px;
    margin-inline-end: 4px;
}

.p-reason__img {
    max-width: 46.5%;
    width: 100%;
    margin-left: auto;
}

@media (max-width: 960px) {
    .p-reason__img {
        max-width: none;
    }
}

.p-reason__img--reverse {
    margin-left: 0;
}

.p-reason__img img {
    width: 100%;
    height: auto;
    aspect-ratio: 481 / 295;
}

@media (min-width: 769px) {
    .p-reason__img img {
        aspect-ratio: 336 / 235;
    }
}

.u-new-line {
    display: block;
}

@media (min-width: 769px) {
    .u-new-line--pc {
        display: block;
    }
}

@media (max-width: 768px) {
    .u-new-line--sp {
        display: block;
    }
}

.u-new-line--ib {
    display: inline-block;
}

.p-pickup {
    padding-block: 80px 200px;
}

@media (max-width: 768px) {
    .p-pickup {
        padding-block: 40px 72px;
    }
}

@media (max-width: 375px) {
    .p-pickup__inner {
        padding-inline: 15px;
    }
}

.p-pickup__sub-title {
    position: relative;
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .1em;
    width: 300px;
    margin-inline: auto;
    text-align: center;
}

@media (max-width: 768px) {
    .p-pickup__sub-title {
        font-size: 16px;
        letter-spacing: .08em;
    }
}

@media (max-width: 450px) {
    .p-pickup__sub-title {
        width: auto;
    }
}

@media (max-width: 375px) {
    .p-pickup__sub-title {
        font-size: 14px;
    }
}

.p-pickup__sub-title::after {
    position: absolute;
    content: "";
    width: 298px;
    height: 18px;
    background-image: url(/cdn/shop/files/icon_pickup-arrow_pc.svg?v=1743331668);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    left: 50%;
    bottom: -80%;
    transform: translateX(-50%);
}

@media (max-width: 768px) {
    .p-pickup__sub-title::after {
        width: 258px;
        height: 16px;
        bottom: -97%;
    }
}

@media (max-width: 375px) {
    .p-pickup__sub-title::after {
        width: 215px;
        background-size: 100% 100%;
    }
}

.p-pickup__main-title {
    font-size: 32px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .1em;
    width: max-content;
    margin-inline: auto;
    margin-block-start: 49px;
}

@media (max-width: 768px) {
    .p-pickup__main-title {
        font-size: 20px;
        letter-spacing: .06em;
        text-align: center;
    }
}

@media (max-width: 450px) {
    .p-pickup__main-title {
        font-size: 19px;
        width: auto;
    }
}

@media (max-width: 375px) {
    .p-pickup__main-title {
        font-size: 15px;
    }
}

.p-pickup__container {
    display: flex;
    margin-block-start: 40px;
}

@media (max-width: 768px) {
    .p-pickup__container {
        display: block;
        margin-block-start: 32px;
    }
}

.p-pickup__img-wrapper1 {
    max-width: 51.32%;
    width: 100%;
}

@media (max-width: 768px) {
    .p-pickup__img-wrapper1 {
        max-width: none;
    }
}

@media (max-width: 768px) {
    .p-pickup__main-img {
        width: 100%;
    }

    .p-pickup__main-img img {
        width: 100%;
        height: auto;
    }

    .p-pickup__img {
        width: 30%;
    }

    .p-pickup__img img {
        width: 100%;
        height: auto;
        object-fit: cover;
    }

    .p-pickup__group {
        display: flex;
        justify-content: space-between;
        gap: 10px;
    }
}

.p-pickup__img-area {
    margin-block-start: 16px;
}

@media (max-width: 768px) {
    .p-pickup__img-area {
        margin-block-start: 24px;
    }
}

.p-pickup__item {
    color: var(--black-color-02);
    font-size: 16px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
}

.p-pickup__group {
    display: flex;
    column-gap: 24px;
    margin-block-start: 8px;
}

@media (max-width: 768px) {
    .p-pickup__group {
        column-gap: 18px;
    }
}

.p-pickup__wrapper {
    max-width: 41.64%;
    width: 100%;
    margin-inline-start: auto;
}

@media (max-width: 768px) {
    .p-pickup__wrapper {
        max-width: none;
        margin-block-start: 32px;
    }
}

.p-pickup__postage {
    color: var(--accent-color);
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
    border-radius: 2px;
    border: 2px solid var(--accent-color);
    width: max-content;
    padding: 0 14px;
}

@media (max-width: 768px) {
    .p-pickup__postage {
        font-size: 16px;
        letter-spacing: .08em;
    }
}

.p-pickup__trial-set {
    color: var(--black-color-02);
    font-size: 24px;
    font-weight: var(--font-weight-bold);
    line-height: 1;
    letter-spacing: .05em;
    margin-block-start: 24px;
}

@media (max-width: 768px) {
    .p-pickup__trial-set {
        font-size: 20px;
        letter-spacing: .08em;
    }
}

.p-pickup__price {
    color: var(--black-color-02);
    font-size: 24px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
    margin-block-start: 12px;
}

@media (max-width: 768px) {
    .p-pickup__price {
        font-size: 20px;
        letter-spacing: .06em;
        margin-block-start: 9px;
    }
}

.p-pickup__price--tax {
    font-size: 14px;
    margin-left: -6px;
}

@media (max-width: 768px) {
    .p-pickup__price--tax {
        letter-spacing: .05em;
    }
}

.p-pickup__contents-group {
    margin-block-start: 24px;
}

@media (max-width: 768px) {
    .p-pickup__contents-group {
        display: flex;
        flex-direction: column-reverse;
        margin-block-start: 20px;
    }
}

@media (max-width: 768px) {
    .p-pickup__btn {
        margin-block-start: 38px;
    }
}

.p-pickup__link {
    width: 100%;
}

@media (max-width: 768px) {
    .p-pickup__link {
        font-size: 16px;
        font-weight: var(--font-weight-bold);
        padding: 17px;
    }
}

.p-pickup__text-group {
    margin-block-start: 24px;
}

@media (max-width: 768px) {
    .p-pickup__text-group {
        margin-block-start: 0;
    }
}

.p-pickup__text {
    color: var(--black-color-02);
    font-size: var(--font-base);
    font-weight: var(--font-weight-normal);
    line-height: 1.5;
    letter-spacing: .05em;
}

@media (max-width: 375px) {
    .p-pickup__text {
        font-size: 14px;
    }
}

.p-pickup__set-contents {
    margin-block-start: 16px;
}

.p-pickup__set {
    margin-block-start: 8px;
    color: var(--black-color-02);
    font-size: var(--font-base);
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
}

.p-pickup__set-summary {
    color: var(--black-color-02);
    font-size: var(--font-base);
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .05em;
    margin-block-start: 8px;
}

@media (max-width: 375px) {
    .p-pickup__set-summary {
        font-size: 14px;
    }
}

.p-pickup__set-list {
    margin-block-start: 2px;
    margin-inline-start: 4px;
}

.p-pickup__set-item {
    color: var(--black-color-02);
    font-size: var(--font-base);
    font-weight: var(--font-weight-medium);
    line-height: 1.8;
    letter-spacing: .05em;
}

@media (max-width: 768px) {
    .p-pickup__set-item {
        font-size: 14px;
        letter-spacing: .02em;
    }
}

@media (max-width: 375px) {
    .p-pickup__set-item {
        font-size: 12px;
    }
}

.p-colornume {
    padding-block: 80px 200px;
}

@media (max-width: 768px) {
    .p-colornume {
        padding-block: 40px 72px;
    }
}

@media (max-width: 375px) {
    .p-colornume__inner {
        padding-inline: 15px;
    }
}

.p-colornume__sub-title {
    position: relative;
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .1em;
    width: 300px;
    margin-inline: auto;
    text-align: center;
}

@media (max-width: 768px) {
    .p-colornume__sub-title {
        font-size: 16px;
        letter-spacing: .08em;
    }
}

@media (max-width: 450px) {
    .p-colornume__sub-title {
        width: auto;
    }
}

@media (max-width: 375px) {
    .p-colornume__sub-title {
        font-size: 14px;
    }
}

.p-colornume__sub-title::after {
    position: absolute;
    content: "";
    width: 298px;
    height: 18px;
    background-image: url(/cdn/shop/files/icon_pickup-arrow_pc.svg?v=1743331668);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    left: 50%;
    bottom: -80%;
    transform: translateX(-50%);
}

@media (max-width: 768px) {
    .p-colornume__sub-title::after {
        width: 258px;
        height: 16px;
        bottom: -97%;
    }
}

@media (max-width: 375px) {
    .p-colornume__sub-title::after {
        width: 215px;
        background-size: 100% 100%;
    }
}

.p-colornume__main-title {
    font-size: 32px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .1em;
    width: max-content;
    margin-inline: auto;
    margin-block-start: 49px;
}

@media (max-width: 768px) {
    .p-colornume__main-title {
        font-size: 20px;
        letter-spacing: .06em;
        text-align: center;
    }
}

@media (max-width: 450px) {
    .p-colornume__main-title {
        font-size: 19px;
        width: auto;
    }
}

@media (max-width: 375px) {
    .p-colornume__main-title {
        font-size: 15px;
    }
}

.p-colornume__container {
    display: flex;
    margin-block-start: 40px;
}

@media (max-width: 768px) {
    .p-colornume__container {
        display: block;
        margin-block-start: 32px;
    }
}

.p-colornume__img-wrapper1 {
    max-width: 51.32%;
    width: 100%;
}

@media (max-width: 768px) {
    .p-colornume__img-wrapper1 {
        max-width: none;
    }
}

@media (max-width: 768px) {
    .p-colornume__main-img {
        width: 100%;
    }

    .p-colornume__main-img img {
        width: 100%;
        height: auto;
    }

    .p-colornume__img {
        width: 30%;
    }

    .p-colornume__img img {
        width: 100%;
        height: auto;
        object-fit: cover;
    }

    .p-colornume__group {
        display: flex;
        justify-content: space-between;
        gap: 10px;
    }
}

.p-colornume__img-area {
    margin-block-start: 16px;
}

@media (max-width: 768px) {
    .p-colornume__img-area {
        margin-block-start: 24px;
    }
}

.p-colornume__item {
    color: var(--black-color-02);
    font-size: 16px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
}

.p-colornume__group {
    display: flex;
    column-gap: 24px;
    margin-block-start: 8px;
}

@media (max-width: 768px) {
    .p-colornume__group {
        column-gap: 18px;
    }
}

.p-colornume__wrapper {
    max-width: 41.64%;
    width: 100%;
    margin-inline-start: auto;
}

@media (max-width: 768px) {
    .p-colornume__wrapper {
        max-width: none;
        margin-block-start: 32px;
    }
}

.p-colornume__postage {
    color: var(--accent-color);
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
    border-radius: 2px;
    border: 2px solid var(--accent-color);
    width: max-content;
    padding: 0 14px;
}

@media (max-width: 768px) {
    .p-colornume__postage {
        font-size: 16px;
        letter-spacing: .08em;
    }
}

.p-colornume__trial-set {
    color: var(--black-color-02);
    font-size: 24px;
    font-weight: var(--font-weight-bold);
    line-height: 1;
    letter-spacing: .05em;
    margin-block-start: 24px;
}

@media (max-width: 768px) {
    .p-colornume__trial-set {
        font-size: 20px;
        letter-spacing: .08em;
    }
}

.p-colornume__price {
    color: var(--black-color-02);
    font-size: 24px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
    margin-block-start: 12px;
}

@media (max-width: 768px) {
    .p-colornume__price {
        font-size: 20px;
        letter-spacing: .06em;
        margin-block-start: 9px;
    }
}

.p-colornume__price--tax {
    font-size: 14px;
    margin-left: -6px;
}

@media (max-width: 768px) {
    .p-colornume__price--tax {
        letter-spacing: .05em;
    }
}

.p-colornume__contents-group {
    margin-block-start: 24px;
}

@media (max-width: 768px) {
    .p-colornume__contents-group {
        display: flex;
        flex-direction: column-reverse;
        margin-block-start: 20px;
    }
}

@media (max-width: 768px) {
    .p-colornume__btn {
        margin-block-start: 38px;
    }
}

.p-colornume__link {
    width: 100%;
}

@media (max-width: 768px) {
    .p-colornume__link {
        font-size: 16px;
        font-weight: var(--font-weight-bold);
        padding: 17px;
    }
}

.p-colornume__text-group {
    margin-block-start: 24px;
}

@media (max-width: 768px) {
    .p-colornume__text-group {
        margin-block-start: 0;
    }
}

.p-colornume__text {
    color: var(--black-color-02);
    font-size: var(--font-base);
    font-weight: var(--font-weight-normal);
    line-height: 1.5;
    letter-spacing: .05em;
}

@media (max-width: 375px) {
    .p-colornume__text {
        font-size: 14px;
    }
}

.p-colornume__set-contents {
    margin-block-start: 16px;
}

.p-colornume__set {
    margin-block-start: 8px;
    color: var(--black-color-02);
    font-size: var(--font-base);
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
}

.p-colornume__set-summary {
    color: var(--black-color-02);
    font-size: var(--font-base);
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .05em;
    margin-block-start: 8px;
}

@media (max-width: 375px) {
    .p-colornume__set-summary {
        font-size: 14px;
    }
}

.p-colornume__set-list {
    margin-block-start: 2px;
    margin-inline-start: 4px;
}

.p-colornume__set-item {
    color: var(--black-color-02);
    font-size: var(--font-base);
    font-weight: var(--font-weight-medium);
    line-height: 1.8;
    letter-spacing: .05em;
}

@media (max-width: 768px) {
    .p-colornume__set-item {
        font-size: 14px;
        letter-spacing: .02em;
    }
}

@media (max-width: 375px) {
    .p-colornume__set-item {
        font-size: 12px;
    }
}


.p-ranking {
    background-color: #F9F9F9;
    padding-block: 80px 112px;
    background-image: url(/cdn/shop/files/bg_ranking_pc.png?v=1743331721);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

@media (max-width: 768px) {
    .p-ranking {
        padding-block: 40px 72px;
        background-image: url(/cdn/shop/files/bg_ranking_pc.png?v=1743331721);
    }
}

.p-ranking__container {
    display: flex;
    column-gap: 20px;
    margin-block-start: 61px;
}

@media (max-width: 768px) {
    .p-ranking__container {
        display: block;
        max-width: 744px;
        width: 100%;
        margin-block-start: 40px;
        margin-inline: auto;
        padding-inline: 45px;
    }
}

.p-ranking__card {
    position: relative;
}

@media (max-width: 768px) {
    .p-ranking__card {
        margin-block-start: 64px;
    }
}

@media (max-width: 768px) {
    .p-ranking__card:first-of-type {
        margin-block-start: 0;
    }
}

.p-ranking__card-number {
    position: absolute;
    top: 0;
    left: 0;
    color: var(--color-white);
    font-family: var(--english-font);
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    line-height: 1;
    letter-spacing: .1em;
    padding: 8px;
}

@media (max-width: 768px) {
    .p-ranking__card-number {
        font-size: 20px;
        padding: 8px 6px;
    }
}

.p-ranking__card:nth-child(1) .p-ranking__card-number {
    background-color: #C79B33;
}

.p-ranking__card:nth-child(2) .p-ranking__card-number {
    background-color: #9A9A9A;
}

.p-ranking__card:nth-child(3) .p-ranking__card-number {
    background-color: #977C54;
}

.p-ranking__card:nth-child(n+4) .p-ranking__card-number {
    background-color: var(--black-color);
}

.p-ranking__card-body {
    padding-block-start: 16px;
}

.p-ranking__item-name {
    font-size: var(--font-base);
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    text-align: center;
}

@media (max-width: 768px) {
    .p-ranking__item-name {
        letter-spacing: .08em;
    }
}

.p-ranking__item-price {
    font-family: var(--english-font);
    font-size: var(--font-base);
    font-weight: var(--font-weight-normal);
    line-height: 1.5;
    letter-spacing: .05em;
    margin-block-start: 8px;
    text-align: center;
}

.p-ranking__item-price--tax {
    font-size: 10px;
    font-weight: var(--font-weight-normal);
    line-height: 1.35;
}

.p-ranking__wrapper {
    margin-block-start: 80px;
}

@media (max-width: 768px) {
    .p-ranking__wrapper {
        margin-block-start: 64px;
    }
}

.p-review {
    padding-block: 80px 112px;
}

@media (max-width: 960px) {
    .p-review {
        padding-block: 56px;
    }
}

.p-review .swiper-area {
    position: relative;
    padding-inline: 46px;
    margin-block-start: 64px;
}

@media (max-width: 960px) {
    .p-review .swiper-area {
        margin-block-start: 32px;
        padding-inline: 0;
    }
}

.swiper-area .swiper-button-prev,
.swiper-area .swiper-button-next {
    position: absolute;
    top: 49.5%;
}

@media (max-width: 960px) {
    .swiper-area .swiper-button-prev,
    .swiper-area .swiper-button-next {
        width: 40px;
        height: 40px;
        background-color: var(--accent-color);
        background-repeat: no-repeat;
        background-position: center;
        background-size: 80% 80%;
        border-radius: 50%;
        transform: translateY(-50%);
        top: 193px;
    }
}

.swiper-area .swiper-button-prev::after,
.swiper-area .swiper-button-next::after {
    font-size: 24px;
    color: var(--black-color);
}

@media (max-width: 960px) {
    .swiper-area .swiper-button-prev::after,
    .swiper-area .swiper-button-next::after {
        display: none;
    }
}

.swiper-area .swiper-button-prev {
    left: 0;
}

@media (max-width: 960px) {
    .swiper-area .swiper-button-prev {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15' fill='none'%3E%3Cpath d='M8.75 10.625L5.625 7.5L8.75 4.375' stroke='white' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        left: -3%;
    }
}

.swiper-area .swiper-button-next {
    right: 0;
}

@media (max-width: 960px) {
    .swiper-area .swiper-button-next {
        background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='15' height='15' viewBox='0 0 15 15' fill='none'%3E%3Cpath d='M6.25 4.375L9.375 7.5L6.25 10.625' stroke='white' stroke-width='1.25' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
        right: -3%;
    }
}

.p-review__inner {
    max-width: 1180px;
    width: 100%;
    margin-inline: auto;
    padding-inline: 25px;
}

.p-review__swiper .swiper-slide {
    display: flex;
    flex-direction: column;
    width: 30.5% !important;
    min-height: 346px;
    height: 100%;
    margin: 7px 0 7px 7px;
    padding: 20px 12px 20px 20px;
    border-radius: 5px;
    background-color: var(--color-white);
    box-shadow: 1px 1px 7px 0 rgb(0 0 0 / .13), 0 0 2px 0 rgb(0 0 0 / .05);
}

@media (max-width: 960px) {
    .p-review__swiper .swiper-slide {
        width: 335px !important;
    }
}

@media (max-width: 450px) {
    .p-review__swiper .swiper-slide {
        width: 85% !important;
        margin-left: 0;
    }
}

.p-review__user {
    display: flex;
    align-items: center;
}

.p-review__user-icon {
    width: 40px;
    height: 40px;
}

.p-review__user-name {
    font-family: var(--secondary-font);
    font-size: 14px;
    font-weight: var(--font-weight-bold);
    line-height: 1.4;
    margin-inline-start: 15px;
}

.p-review__star {
    width: 89px;
    height: 17px;
    margin-block-start: 16px;
}

.p-review__star--triple {
    width: 53px;
    height: 17px;
}

.p-review__text {
    color: var(--black-color);
    font-size: 16px;
    font-weight: var(--font-weight-normal);
    line-height: 1.5;
    letter-spacing: .05em;
    margin-block-start: 8px;
}

.p-review__text--hidden {
    display: none;
}

.p-review__more-btn {
    position: relative;
    color: var(--grey_line, #C0C0C0);
    font-size: 14px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
    width: max-content;
    margin-block-start: 19px;
    margin-inline-start: auto;
    background-color: #fff0;
    border: none;
    cursor: pointer;
    transition: color 0.3s ease;
}

.p-review__more-btn::after {
    position: absolute;
    content: "";
    width: 88%;
    height: 1px;
    background-color: var(--grey_line, #C0C0C0);
    bottom: 3px;
    left: 50%;
    transform: translateX(-50%);
}

.p-review__more-btn.hover-enabled:hover {
    color: var(--accent-color);
}

@media (max-width: 768px) {
    .p-review__more-btn.hover-enabled:hover {
        color: var(--grey_line, #C0C0C0);
    }
}

.p-review__more-btn.hover-enabled:hover::after {
    background-color: var(--accent-color);
}

@media (max-width: 768px) {
    .p-review__more-btn.hover-enabled:hover::after {
        background-color: var(--grey_line, #C0C0C0);
    }
}

.p-review__category {
    color: var(--color-white);
    font-size: 14px;
    font-weight: var(--font-weight-medium);
    line-height: 2;
    letter-spacing: .02em;
    background-color: var(--black-color);
    padding: 0 8px;
    margin-top: auto;
    width: max-content;
}

.p-qa {
    padding-block: 80px 112px;
    background-image: url(/cdn/shop/files/bg_ranking_pc.png?v=1743331721);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

@media (max-width: 768px) {
    .p-qa {
        padding-block: 60px;
    }
}

.p-qa__wrapper {
    margin-block-start: 64px;
}

@media (max-width: 768px) {
    .p-qa__wrapper {
        margin-block-start: 29px;
    }
}

.p-qa__menu-item {
    margin-block-start: 24px;
    border-radius: 5px;
    border: 1px solid var(--grey_line, #C0C0C0);
    background: var(--color-white);
}

@media (max-width: 768px) {
    .p-qa__menu-item {
        margin-block-start: 16px;
        border: 1.5px solid var(--gray, #E6E6E6);
    }
}

.p-qa__menu-item:first-child {
    margin-block-start: 0;
}

.p-qa__menu-item:hover {
    cursor: pointer;
}

.p-qa__question {
    position: relative;
    color: var(--accent, #7F0001);
    font-size: 20px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .05em;
    width: 100%;
    padding: 25px 65px;
    text-align: left;
    border: none;
    background-color: var(--color-white);
    transition: color 0.3s ease;
    cursor: pointer;
}

@media (max-width: 768px) {
    .p-qa__question {
        font-size: 16px;
        letter-spacing: .05em;
        padding: 16px 42px 16px 13px;
    }
}

.p-qa__question::after {
    position: absolute;
    content: "";
    width: 15px;
    height: 15px;
    top: 36%;
    right: 7.2%;
    border-bottom: 3px solid var(--accent-color);
    border-right: 3px solid var(--accent-color);
    transform: rotate(45deg);
    transition: transform 0.3s ease;
}

@media (max-width: 768px) {
    .p-qa__question::after {
        width: 10px;
        height: 10px;
        top: 32%;
        right: 5.9%;
        border-bottom: 2px solid var(--accent-color);
        border-right: 2px solid var(--accent-color);
    }
}

.p-qa__menu-item.js-open .p-qa__question::after {
    top: 46%;
    transform: rotate(225deg);
}

.p-qa__answer {
    display: none;
    color: var(--black-color-03);
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
    background-color: var(--color-white);
    padding: 0 21.06% 24px 65px;
}

@media (max-width: 960px) {
    .p-qa__answer {
        padding-right: 14%;
    }
}

@media (max-width: 768px) {
    .p-qa__answer {
        font-size: 14px;
        letter-spacing: .04em;
        padding: 0 29px 16px 16px;
        text-align: justify;
    }
}

.p-qa__answer-group--margin {
    margin-block-start: 30px;
}

.p-qa__answer-case {
    color: var(--black-color-03);
    font-size: 22px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .05em;
    margin-block-end: 5px;
}

@media (max-width: 768px) {
    .p-qa__answer-case {
        font-size: 18px;
    }
}

@media (max-width: 450px) {
    .p-qa__answer-case {
        letter-spacing: .02em;
    }
}

@media (max-width: 375px) {
    .p-qa__answer-case {
        font-size: 16px;
    }
}

.p-qa__answer-text {
    color: var(--black-color-03);
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
}

@media (max-width: 768px) {
    .p-qa__answer-text {
        font-size: 16px;
    }
}

.faq__payment__imgs {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    gap: 20px;
    margin-block-start: 10px;
}

@media (max-width: 375px) {
    .faq__payment__imgs {
        gap: 10px;
    }
}

.faq__payment__img {
    width: 19%;
}

@media (max-width: 768px) {
    .faq__payment__img {
        width: 46%;
    }
}

.design08 {
    text-align: center;
    border-collapse: collapse;
    border-spacing: 0;
    margin-top: 15px;
    margin-bottom: 15px;
}

@media (max-width: 768px) {
    .design08 {
        width: 100%;
    }
}

.design08 th {
    padding: 10px;
    background: brown;
    border: solid 1px #666;
    color: #fff;
    vertical-align: middle;
    line-height: 1.5em;
}

.design08 td:first-child {
    background: pink;
}

.design08 td {
    padding: 10px;
    background-color: #fff;
    border: solid 1px #666;
}

@media (max-width: 960px) {
    .u-show--tab {
        display: none;
    }
}

@media (max-width: 768px) {
    .u-show--sp {
        display: none;
    }
}

@media (min-width: 769px) {
    .u-hidden--sp-over {
        display: none;
    }
}

@media (min-width: 961px) {
    .u-hidden--tab-over {
        display: none;
    }
}

.p-qa__answer-link {
    color: var(--accent-color);
    border-bottom: 1px solid var(--accent-color);
    transition: opacity 0.3s ease;
}

.p-qa__answer-link:hover {
    opacity: .7;
    text-decoration: none;
}

.p-btn {
    padding-block: 40px;
    background: var(--background01, #EEE1D7);
}

@media (max-width: 768px) {
    .p-btn {
        padding-block: 48px 64px;
    }
}

.p-btn__title {
    text-align: center;
    font-size: 24px;
    font-weight: var(--font-weight-bold);
    line-height: 1.5;
    letter-spacing: .08em;
}

@media (max-width: 768px) {
    .p-btn__title {
        font-size: 20px;
        letter-spacing: .06em;
    }
}

@media (max-width: 375px) {
    .p-btn__title {
        font-size: 18px;
    }
}

.p-btn__wrapper {
    margin-block-start: 32px;
}

.p-service {
    padding-block: 80px 160px;
    background-color: var(--color-white);
}

@media (max-width: 768px) {
    .p-service {
        padding-block: 56px 64px;
    }
}

.p-service__sub-title {
    position: relative;
    font-size: 18px;
    font-weight: var(--font-weight-medium);
    line-height: 1.5;
    letter-spacing: .05em;
    width: max-content;
    margin-inline: auto;
}

@media (max-width: 768px) {
    .p-service__sub-title {
        font-size: 16px;
        letter-spacing: .08em;
    }
}

.p-service__sub-title::after {
    position: absolute;
    content: "";
    width: 298px;
    height: 18px;
    background-image: url(/cdn/shop/files/icon_service_pc.svg?v=1743331933);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    bottom: -86%;
    left: 50%;
    transform: translateX(-50%);
}

@media (max-width: 768px) {
    .p-service__sub-title::after {
        width: 260px;
        bottom: -91%;
        background-image: url(/cdn/shop/files/icon_service_sp.svg?v=1743331973);
    }
}

.p-service__title {
    margin-block-start: 49px;
}

@media (max-width: 768px) {
    .p-service__title {
        margin-block-start: 48px;
    }
}

.p-service__container {
    display: flex;
    margin-block-start: 40px;
    column-gap: 24px;
}

@media (max-width: 768px) {
    .p-service__container {
        display: block;
        margin-block-start: 39px;
    }
}

.p-service__card {
    max-width: 31.82%;
    width: 100%;
}

@media (max-width: 768px) {
    .p-service__card {
        max-width: none;
    }
}

@media (max-width: 768px) {
    .p-service__card {
        margin-block-start: 64px;
    }
}

@media (max-width: 768px) {
    .p-service__card:first-of-type {
        margin-block-start: 0;
    }
}

.p-service__card-img img {
    object-fit: cover;
    object-position: center;
    aspect-ratio: 331 / 221;
    height: 100%;
}

.p-service__card-body {
    padding-block-start: 24px;
}

@media (max-width: 768px) {
    .p-service__card-body {
        padding-block-start: 16px;
    }
}

.p-service__card-title {
    font-size: 20px;
    font-weight: var(--font-weight-medium);
    line-height: 1;
    letter-spacing: .05em;
    text-align: center;
}

@media (max-width: 768px) {
    .p-service__card-title {
        font-size: 18px;
        line-height: 1.5;
        letter-spacing: .01em;
    }
}

.p-service__card-text {
    font-size: 16px;
    font-weight: var(--font-weight-regular);
    line-height: 1.5;
    letter-spacing: .05em;
    margin-block-start: 16px;
}

.p-service__card-btn {
    margin-block-start: 32px;
}

@media (max-width: 768px) {
    .p-service__card-btn {
        margin-block-start: 24px;
    }
}

.p-service__card-btn--contact {
    margin-block-start: 37px;
}

@media (max-width: 768px) {
    .p-service__card-btn--contact {
        margin-block-start: 18px;
    }
}

.p-service__link {
    font-size: 16px;
    width: 100%;
    padding: 18px;
}

.p-service__link--content {
    font-size: 14px;
    width: max-content;
    margin-inline-end: 45px;
    padding: 0 2px;
}

@media (max-width: 768px) {
    .p-service__link--content {
        font-size: 14px;
        padding: 0 2px;
    }
}

.p-service__link--content::after {
    top: 54%;
    background-size: 60% 60%;
}

.p-ranking__container {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
    max-width: 1200px;
    margin-inline: auto;
}

@media screen and (max-width: 768px) {
    .p-ranking__container {
        grid-template-columns: repeat(1, 1fr);
    }
}

.accordion__title {
    display: inline-block;
    max-width: calc(100% - 6rem) !important;
    min-height: 1.6rem;
    margin: 0;
    word-break: break-word;
}
