/*==================================================
# 共通
==================================================*/
body {
    font-family: 'Noto Sans JP', sans-serif;
    font-size: clamp(14px, calc((16 * 100vw) / 1440), 16px);
    letter-spacing: calc(0.64 / 16 * 1em);
    color: #161616;
}


@media screen and (min-width: 768px) {
    .sp-only {
    display: none!important;
}
}

@media screen and (min-width: 1025px) {
    .u-tab-show {
    display: none!important;
}
}


@media screen and (max-width: 1024px) {
    .u-tab-none {
        display: none!important;
    }
}

@media screen and (max-width: 767px) {

    .pc-only {
        display: none!important;
    }
}

/* ボタン */
.common-btn {
    display: block;
    transition: all 0.3s ease 0s;
    max-width: 400px;
    border-radius: 4px;
    text-align: center;
    background: linear-gradient(180deg, #F35900 0%, #F38200 100%);
    padding: 18px 42px 18px 63px;
    box-shadow: 4px 4px #FBA52A;
    position: relative;
    transition: all 0.3s ease 0s;
    margin: 0 auto;
}

@media screen and (max-width: 767px) {
    .common-btn {
        padding: 13px 40px 13px 50px;
        max-width: 320px;
    }
}


.common-btn:hover {
    transform: translate(4px, 4px);
    box-shadow: 0 0 #FBA52A;
}


.common-btn::before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 39px;
    width: 24px;
    aspect-ratio: 24 / 18;
    background-image: url(../img/common/icon_mail.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

@media screen and (max-width: 767px) {
    .common-btn::before {
        left: 18px;
    }
}

.common-btn::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 30px;
    width: 12px;
    aspect-ratio: 12 / 9;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-image: url(../img/common/icon_right.svg);
}

@media screen and (max-width: 767px) {
    .common-btn::after {
        right: 18px;
    }
}

.common-btn__text {
    color: #FFF;
    font-size: 20px;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: calc(0.8 / 16 * 1em);

}

@media screen and (max-width: 767px) {
    .common-btn__text {
        font-size: 18px;
    }
}

@media screen and (max-width: 374px) {
    .common-btn {
        padding: calc(13 * 100vw / 375) calc(40 * 100vw / 375) calc(13 * 100vw / 375) calc(50 * 100vw / 375);
        max-width: calc(320 * 100vw / 375);
    }

    .common-btn::before {
        left: calc(18 * 100vw / 375);
        width: calc(24 * 100vw / 375);
    }

    .common-btn::after {
        right: calc(18 * 100vw / 375);
        width: calc(12 * 100vw / 375);
    }

    .common-btn__text {
        font-size: calc(18 * 100vw / 375);
    }
}




/*==================================================
# ヘッダー
==================================================*/
.header {
    position: sticky;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 100;
    background: #fff;
}

.header__inner {
    padding: 10px 30px;
    max-width: 1400px;
    margin: 0 auto;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.header__logo {
    max-width: 240px;
    width: 100%;
}

.header__button-wrapper {
    width: 100%;
    display: flex;
    justify-content: flex-end;
}

.header__button {
    display: block;
    transition: all 0.3s ease 0s;
    max-width: 280px;
    border-radius: 4px;
    background: linear-gradient(180deg, #F35900 0%, #F38200 100%);
    padding: 15px 30px 15px 44px;
    box-shadow: 4px 4px #FBA52A;
    position: relative;
    transition: all 0.3s ease 0s;
}

.header__button:hover {
    transform: translate(4px, 4px);
    box-shadow: 0 0 #FBA52A;
}


.header__button::before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 16px;
    width: 16px;
    height: 16px;
    background-image: url(../img/common/icon_mail.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.header__button::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 16px;
    width: 8px;
    height: 8px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-image: url(../img/common/icon_right.svg);
}

.header__button-text {
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: calc(0.8 / 16 * 1em);
    
}

@media screen and (max-width: 767px) {
    .header__inner {
        padding: 12px;
        gap: 23px;
    }

    .header__logo {
        max-width: 120px;
    }

    .header__button {
        max-width: 203px;
        padding: 8px 28px 8px 33px;
    }

    .header__button::before {
        left: 12px;
    }

    .header__button::after {
        right: 12px;
    }

    .header__button-text {
        font-size: 13px;
    }
}

/* 374px以下は vw で縮小（375基準） */
@media screen and (max-width: 374px) {
    .header__inner {
        padding: calc(12 * 100vw / 375);
        gap: calc(23 * 100vw / 375);
    }

    .header__logo {
        max-width: calc(120 * 100vw / 375);
    }

    .header__button {
        max-width: calc(203 * 100vw / 375);
        padding: calc(8 * 100vw / 375) calc(28 * 100vw / 375) calc(8 * 100vw / 375) calc(33 * 100vw / 375);
    }

    .header__button::before {
        left: calc(12 * 100vw / 375);
    }

    .header__button::after {
        right: calc(12 * 100vw / 375);
    }

    .header__button-text {
        font-size: calc(13 * 100vw / 375);
    }
}



/*==================================================
# TOP
==================================================*/
/* FV */
.index-fv {
    position: relative;
    padding: clamp(30px, calc(54 * 100vw / 1440), 54px) 0 clamp(24px, calc(45 * 100vw / 1440), 45px);
    background: url(../img/top/index_fv_bg.jpg) no-repeat center center /cover;
    overflow: hidden;
}

.index-fv__inner {
    max-width: 1340px;
    padding: 0 clamp(16px, calc(30 * 100vw / 1440), 30px);
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.index-fv__contents {
    width: fit-content;
}

.index-fv__heading {
    color: #161616;
    display: inline-block;
    font-size: clamp(18px, calc(32 * 100vw / 1440), 32px);
    font-weight: 700;
    letter-spacing: calc(1.6 / 32 * 1em);
    position: relative;
    z-index: 1;
    padding: 2px clamp(24px, calc(46 * 100vw / 1440), 46px) 2px clamp(26px, calc(50 * 100vw / 1440), 50px);
}

.index-fv__heading::before {
    content: "";
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
    width: 100vw;
    height: 100%;
    background: #FFF200;
    z-index: -1;
    clip-path: polygon(0 0, calc(100% - 30px) 0, 100% 100%, 0 100%);
}

.index-fv__lead {
    margin-top: clamp(6px, calc(12 * 100vw / 1440), 12px);
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    line-height: 1.4;
}

.index-fv__lead-primary,
.index-fv__lead-normal,
.index-fv__lead-secondary {
    background: linear-gradient(88deg, #B3FCF3 0.63%, #F0FEFF 47.15%, #CBE5FF 99.37%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    font-weight: 700;
}

.index-fv__lead-primary {
    font-size: clamp(30px, calc(56 * 100vw / 1440), 56px);
    letter-spacing: clamp(1.5px, calc(2.8 * 100vw / 1440), 2.8px);
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
}

.index-fv__lead-normal {
    font-size: clamp(22px, calc(40 * 100vw / 1440), 40px);
    filter: drop-shadow(2px 4px 4px rgba(0, 0, 0, 0.25));
    margin-left: clamp(-24px, calc(-24 * 100vw / 1440), -13px);
}

.index-fv__lead-secondary {
    display: block;
    font-size: clamp(28px, calc(52 * 100vw / 1440), 52px);
    filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.25));
    padding-left: clamp(30px, calc(57 * 100vw / 1440), 57px);
}

.index-fv__badges {
    margin-top: clamp(6px, calc(12 * 100vw / 1440), 12px);
    padding-left: clamp(60px, calc(111 * 100vw / 1440), 111px);
}

.index-fv__badges img {
    width: clamp(275px, calc(516 * 100vw / 1440), 516px);
    height: auto;
}

.index-fv__description {
    margin-top: clamp(10px, calc(20 * 100vw / 1440), 20px);
    display: inline-block;
    color: #161616;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(14px, calc(20 * 100vw / 1440), 20px);
    font-weight: 700;
    line-height: 1.6;
    padding: clamp(10px, calc(15 * 100vw / 1440), 15px) clamp(20px, calc(30 * 100vw / 1440), 30px) clamp(9px, calc(14 * 100vw / 1440), 14px) clamp(52px, calc(60 * 100vw / 1440), 60px);
    background: rgba(250, 250, 250, 0.80);
    clip-path: polygon(0 0, calc(100% - 40px) 0, 100% 100%, 40px 100%);
}

.index-fv__description-emphasis {
    font-size: clamp(14px, calc(24 * 100vw / 1440), 24px);
    font-weight: 700;
    line-height: calc(32 / 24 * 1em);
    background: linear-gradient(180deg, #F35900 0%, #F38200 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.index-fv__button-wrapper {
    margin-top: clamp(16px, calc(30 * 100vw / 1440), 30px);
    padding-left: clamp(96px, calc(180 * 100vw / 1440), 180px);
}

.index-fv__button {
    display: block;
    transition: all 0.3s ease 0s;
    max-width: 280px;
    border-radius: 4px;
    background: linear-gradient(180deg, #0070CF 0%, #003969 100%);
    padding: 15px 30px 15px 44px;
    box-shadow: 4px 4px #E1F7FF;
    position: relative;
    transition: all 0.3s ease 0s;
}

.index-fv__button:hover {
    transform: translate(4px, 4px);
    box-shadow: 0 0 #E1F7FF;
}

.index-fv__button::before {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    left: 16px;
    width: 16px;
    height: 16px;
    background-image: url(../img/common/icon_mail_blue.svg);
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
}

.index-fv__button::after {
    content: "";
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 16px;
    width: 8px;
    height: 8px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: contain;
    background-image: url(../img/common/icon_right.svg);
}

.index-fv__button-text {
    color: #FFF;
    font-size: 16px;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: calc(0.8 / 16 * 1em);
}

.index-fv__image {
    position: absolute;
    top: 0;
    right: clamp(-172px, calc(-172 * 100vw / 1440), -92px);
    height: 100%;
    clip-path: polygon(0 0, calc(100% - 180px) 0, 100% 100%, 180px 100%);
    z-index: 0;
}

.index-fv__image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

@media screen and (max-width: 767px) {
    .index-fv {
        padding: 40px 0;
        background-image: url(../img/top/index_fv_bg_sp.jpg);
    }

    .index-fv__contents {
        margin-top: -110px;
    }

    /* 王道リボン（SP: .index-fv 直下） */
    .index-fv > .index-fv__heading {
        font-size: 18px;
        padding: 6px 26px 6px 16px;
    }

    .index-fv > .index-fv__heading::before {
        clip-path: polygon(0 0, calc(100% - 15px) 0, 100% 100%, 0 100%);
    }

    /* 画像（平行四辺形、常に左右30pxずつはみ出し、高さ315px） */
    .index-fv__image {
        position: static;
        width: calc(100vw + 60px);
        height: 315px;
        margin: -26px 0 0 -30px;
        clip-path: polygon(0 0, 80% 0, 100% 100%, 20% 100%);
    }

    /* inner */
    .index-fv__inner {
        max-width: 400px;
        padding: 0 16px;
    }

    .index-fv__lead {
        margin-top: 0;
    }

    /* SP：description-top（sp-only、新規要素） */
    .index-fv__description-top {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        max-width: 330px;
    }

    .index-fv__description-top-item {
        display: inline-block;
        background: rgba(255, 255, 255, 0.70);
        padding: 0 12px 0 20px;
        color: #161616;
        font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
        font-size: 16px;
        font-weight: 700;
        line-height: 30px;
        clip-path: polygon(0 0, calc(100% - 14px) 0, 100% 100%, 14px 100%);
    }

    /* 2行目「業界最安値！」は右寄せ */
    .index-fv__description-top-item:nth-child(2) {
        align-self: flex-end;
        margin-top: 4px;
    }

    .index-fv__description-top .index-fv__description-emphasis {
        font-size: 18px;
        line-height: 34px;
    }

    .index-fv__lead-primary {
        font-size: 28px;
        letter-spacing: calc(1.4 / 28 * 1em);
        filter: drop-shadow(0 4px 4px rgba(0, 0, 0, 0.40));
        margin-left: -16px;
    }

    .index-fv__lead-normal {
        font-size: 18px;
        margin-left: -6px;
        filter: drop-shadow(2px 4px 4px rgba(0, 0, 0, 0.40));
    }

    .index-fv__lead-secondary {
        font-size: 28px;
        padding-left: 0;
    }

    /* バッジ */
    .index-fv__badges {
        margin-top: 12px;
        padding-left: 0;
    }

    .index-fv__badges img {
        width: 100%;
        max-width: none;
    }

    /* SP：description-bottom（sp-only、新規要素） */
    .index-fv__description-bottom {
        margin-top: 12px;
        text-align: center;
        color: #FFF;
        text-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
        font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
        font-size: 16px;
        font-weight: 600;
        line-height: 150%;
        letter-spacing: 0;
    }

    /* ボタン */
    .index-fv__button-wrapper {
        margin-top: 20px;
        padding-left: 0;
    }

    .index-fv__button {
        width: fit-content;
        padding: 16px 40px 16px 44px;
        text-align: center;
        max-width: none;
        margin: 0 auto;
    }
}

@media screen and (max-width: 374px) {
    .index-fv__inner {
        padding: 0 10px;
    }

    .index-fv__description-bottom {
        font-size: 14px;
    }

    .index-fv__lead-primary {
        font-size: calc(28 * 100vw / 375);
        margin-left: calc(-16 * 100vw / 375);
    }

    .index-fv__lead-normal {
        font-size: calc(18 * 100vw / 375);
        margin-left: calc(-6 * 100vw / 375);
    }

    .index-fv__lead-secondary {
        font-size: calc(28 * 100vw / 375);
    }
}

/* why */
.index-why {
    background: url(../img/top/index_why_bg.jpg) no-repeat center center /cover;
    padding: clamp(43px, calc(80 * 100vw / 1440), 80px) 0;
}

.index-why__inner {
    padding: 0 clamp(16px, calc(30 * 100vw / 1440), 30px);
    max-width: 1200px;
    margin: 0 auto;
}

.index-why__heading {
    color: #161616;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(26px, calc(32 * 100vw / 1440), 32px);
    font-weight: 700;
    letter-spacing: calc(1.6 / 32 * 1em);
    text-align: center;
    padding-bottom: 6px;
    position: relative;
}

.index-why__heading::before {
    content: "";
    position: absolute;
    bottom: clamp(-22px, calc(-22 * 100vw / 1440), -18px);
    left: 50%;
    transform: translateX(-50%);
    width: clamp(470px, calc(569 * 100vw / 1440), 569px);
    aspect-ratio: 570 / 25;
    background: url(../img/top/index_why_heading-line.svg) no-repeat center center /contain;
}

.index-why__heading-quote {
    font-size: clamp(40px, calc(48 * 100vw / 1440), 48px);
    font-weight: 700;
}

.index-why__heading-marker {
    font-size: clamp(40px, calc(48 * 100vw / 1440), 48px);
    font-weight: 700;
    letter-spacing: calc(2.4 / 48 * 1em);
    background: linear-gradient(180deg, #F35900 0%, #F38200 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}

.index-why__box {
    margin: clamp(50px, calc(60 * 100vw / 1100), 60px) auto 0;
    max-width: 1040px;
    border-radius: 16px;
    background: #FFF;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.15);
    position: relative;
    z-index: 1;
    padding-bottom: clamp(18px, calc(34 * 100vw / 1100), 34px);
}

.index-why__box-head {
    color: #FFF;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(15px, calc(28 * 100vw / 1100), 28px);
    font-weight: 700;
    letter-spacing: calc(0.84 / 28 * 1em);
    padding: 8px;
    width: 90%;
    max-width: 800px;
    text-align: center;
    background: linear-gradient(90deg, #4D4D4D 0.87%, #161616 98.71%);
    border-radius: 33.5px;
    border: 2px solid #A6A6A6;
    position: absolute;
    top: clamp(-33px, calc(-33 * 100vw / 1100), -22px);
    left: 50%;
    transform: translateX(-50%);
}

.index-why__problems {
    position: relative;
    padding-top: clamp(89px, calc(166 * 100vw / 1100), 166px);
}

.index-why__problem-list {

}

.index-why__problem-item {
    color: #161616;
    font-size: clamp(14px, calc(24 * 100vw / 1100), 24px);
    font-weight: 500;
    line-height: calc(36 / 24 * 1em);
    padding: clamp(10px, calc(18 * 100vw / 1100), 18px);
    border-radius: 24px;
    background: #EFEFEF;
    display: inline-block;
    position: absolute;
}

.index-why__problem-item:nth-child(1) { top: clamp(40px, calc(74 * 100vw / 1100), 74px);  left: clamp(30px, calc(174 * 100vw / 1100), 174px); }
.index-why__problem-item:nth-child(2) { top: clamp(40px, calc(74 * 100vw / 1100), 74px);  right: clamp(16px, calc(57 * 100vw / 1100), 57px); }
.index-why__problem-item:nth-child(3) { top: clamp(140px, calc(227 * 100vw / 1100), 227px); left: clamp(16px, calc(102 * 100vw / 1100), 102px); }
.index-why__problem-item:nth-child(4) { top: clamp(140px, calc(230 * 100vw / 1100), 230px); right: clamp(16px, calc(57 * 100vw / 1100), 57px); }

.index-why__problem-item::after {
    content: "";
    position: absolute;
    width: clamp(20px, calc(38 * 100vw / 1100), 38px);
    height: clamp(11px, calc(20 * 100vw / 1100), 20px);
    background: url(../img/top/index_why_tail.svg) no-repeat center / contain;
    transform-origin: center;
    z-index: -1;
}

/* 左上の吹き出し：右下向きに突き出す */
.index-why__problem-item:nth-child(1)::after {
    right: clamp(-25px, calc(-25 * 100vw / 1100), -14px);
    bottom: clamp(4px, calc(8 * 100vw / 1100), 8px);
    transform: rotate(40deg);
}

/* 右上：左下向き */
.index-why__problem-item:nth-child(2)::after {
    left: clamp(28px, calc(50 * 100vw / 1100), 50px);
    bottom: clamp(-24px, calc(-24 * 100vw / 1100), -13px);
    transform: scaleX(-1) rotate(80deg);
}

/* 左下：右上向き */
.index-why__problem-item:nth-child(3)::after {
    right: clamp(-31px, calc(-31 * 100vw / 1100), -17px);
    top: clamp(20px, calc(36 * 100vw / 1100), 36px);
}

/* 右下：左上向き */
.index-why__problem-item:nth-child(4)::after {
    left: clamp(-32px, calc(-32 * 100vw / 1100), -18px);
    top: clamp(12px, calc(22 * 100vw / 1100), 22px);
    transform: scale(-1, 1) rotate(-15deg);
}

.index-why__problem-img {
    width: clamp(149px, calc(280 * 100vw / 1100), 280px);
    margin: 0 auto;
}

.index-why__problem-img img {
    width: 100%;
    height: auto;
    aspect-ratio: 558 / 414;
    object-fit: cover;
}

.index-why__arrow {
    width: clamp(224px, calc(420 * 100vw / 1100), 420px);
    height: clamp(18px, calc(32 * 100vw / 1100), 32px);
    background: #2D579A;
    clip-path: polygon(0 0, 100% 0, 50% 100%);
    margin: clamp(20px, calc(40 * 100vw / 1100), 40px) auto 0;
}

.index-why__conclusion {
    color: #161616;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(16px, calc(30 * 100vw / 1100), 30px);
    font-weight: 700;
    letter-spacing: calc(0.9 / 30 * 1em);
    margin-top: clamp(10px, calc(20 * 100vw / 1100), 20px);
    display: flex;
    justify-content: center;
}

.index-why__conclusion-emphasis {
    width: clamp(67px, calc(126 * 100vw / 1100), 126px);
    height: auto;
}

.index-why__conclusion-content {
    width: fit-content;
    margin: clamp(20px, calc(40 * 100vw / 1440), 40px) auto 0;
}

.index-why__lead {
    color: #161616;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(14px, calc(24 * 100vw / 1440), 24px);
    font-weight: 700;
    letter-spacing: calc(0.72 / 24 * 1em);
    margin-left: 23px;
    position: relative;
    display: inline-block;
}

.index-why__lead::before {
    content: "";
    position: absolute;
    bottom: -12px;
    left: 50%;
    transform: translateX(-50%);
    width: clamp(81px, calc(152 * 100vw / 1440), 152px);
    aspect-ratio: 153 / 14;
    background: url(../img/top/index_why_heading-line2.svg) no-repeat center center /contain;
}

.index-why__text {
    margin-top: clamp(12px, calc(22 * 100vw / 1440), 22px);
    color: #161616;
    font-size: clamp(14px, calc(20 * 100vw / 1440), 20px);
    font-weight: 500;
    line-height: calc(36 / 20 * 1em);
}

.index-why__text-marker {
    font-weight: 700;
    background: #FFF200;
}

.index-why__text-emphasis {
    background: linear-gradient(180deg, #F35900 0%, #F38200 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: clamp(14px, calc(20 * 100vw / 1440), 20px);
    font-weight: 900;
    line-height: 180%;
}

.index-why__media-list {
    margin-top: clamp(16px, calc(30 * 100vw / 1440), 30px);
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: clamp(8px, calc(16 * 100vw / 1440), 16px);
}

.index-why__media-item {
    flex: 1;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.10);
    max-width: 270px;
}

.index-why__media-item img {
    width: 100%;
    height: auto;
    aspect-ratio: 270 / 300;
    object-fit: cover;
}



@media screen and (max-width: 767px) {
    .index-why {
        padding: 40px 0;
    }

    .index-why__inner {
        max-width: 500px;
    }

    /* 見出し */
    .index-why__heading {
        font-size: 18px;
        letter-spacing: 0.9px;
        padding-bottom: 4px;
    }

    .index-why__heading::before {
        bottom: -12px;
        width: 286px;
    }

    .index-why__heading-quote,
    .index-why__heading-marker {
        font-size: 24px;
    }

    /* box-head「D2C/店頭メーカーが抱える 深刻な課題」 */
    .index-why__box-head {
        font-size: 16px;
        max-width: 263px;
        top: -30px;
    }

    /* 吹き出し 絶対配置解除、縦積み・交互配置 */
    .index-why__problems {
        padding-top: 52px;
    }

    .index-why__problem-list {
        display: flex;
        flex-direction: column;
        gap: 16px;
        padding: 0 12px;
        max-width: 350px;
        margin: 0 auto;
    }

    .index-why__problem-item {
        position: relative;
        font-size: 14px;
        line-height: 160%;
        padding: 12px 16px;
    }

    /* PC の nth-child ごとの top/left/right をリセット */
    .index-why__problem-item:nth-child(1),
    .index-why__problem-item:nth-child(2),
    .index-why__problem-item:nth-child(3),
    .index-why__problem-item:nth-child(4) {
        top: auto;
        left: auto;
        right: auto;
    }

    .index-why__problem-item:nth-child(2), .index-why__problem-item:nth-child(3) {
        margin-top: 11px;
    }

    .index-why__problem-item:nth-child(odd) {
        align-self: flex-start;
    }

    .index-why__problem-item:nth-child(even) {
        align-self: flex-end;
    }

    /* しっぽ共通：下向きに配置、z-index を戻して見えるように */
    .index-why__problem-item::after {
        z-index: 0;
        top: auto;
        transform-origin: center;
    }

    /* 左寄せバブル（1, 3）: しっぽは右下、下向き */
    .index-why__problem-item:nth-child(odd)::after {
        left: 66px;
        bottom: -14px;
        transform: rotate(90deg);
        top: auto;
    }

    /* 右寄せバブル（2, 4）: しっぽは左下、下向き（反転） */
    .index-why__problem-item:nth-child(even)::after {
        right: 66px;
        left: auto;
        bottom: -14px;
        top: auto;
        transform: scaleX(-1) rotate(90deg);
    }

    /* 人物画像 */
    .index-why__problem-img {
        width: 220px;
        margin-top: 20px;
    }

    /* 下向き三角 */
    .index-why__arrow {
        width: 240px;
        height: 32px;
        margin-top: 30px;
    }

    /* 「今ある広告戦略はどれも」 */
    .index-why__conclusion {
        font-size: 26px;
        flex-direction: column;
        align-items: center;
    }

    /* 頭打ち画像 */
    .index-why__conclusion-emphasis {
        width: 130px;
    }

    /* 一方で・・・ */
    .index-why__lead {
        font-size: 16px;
        letter-spacing: 0.48px;
        margin-left: 0;
    }

    .index-why__lead::before {
        width: 100%;
        bottom: -9px;
    }

    /* 本文 */
    .index-why__text {
        font-size: 16px;
        line-height: 180%;
        letter-spacing: 0.8px;
    }

    .index-why__text-emphasis {
        font-size: 16px;

    }

    /* メディア掲載画像 2×2 */
    .index-why__media-list {
        flex-wrap: wrap;
        gap: 12px;
    }

    .index-why__media-item {
        flex: 0 0 calc((100% - 16px) / 2);
        max-width: none;
    }

    /* 3 と 4 を入れ替えて 1, 2, 4, 3 の並びにする */
    .index-why__media-item:nth-child(3) {
        order: 4;
    }

    .index-why__media-item:nth-child(4) {
        order: 3;
    }
}

/* value */
.index-value {
    background: rgba(186, 221, 255, 0.50);
    padding: clamp(43px, calc(80 * 100vw / 1440), 80px) 0;
    position: relative;
    overflow: hidden;
}

.index-value::before {
    content: "FOUR VALUE";
    position: absolute;
    top: clamp(21px, calc(40 * 100vw / 1440), 40px);
    left: 50%;
    transform: translateX(-50%);
    font-family: "Koulen", sans-serif;
    line-height: 1;
    z-index: 0;
    color: rgba(255, 255, 255, 0.80);
    font-size: clamp(107px, calc(200 * 100vw / 1440), 200px);
    letter-spacing: calc(20 / 200 * 1em);
    white-space: nowrap;
}

.index-value__inner {
    padding: 0 clamp(16px, calc(30 * 100vw / 1440), 30px);
    max-width: 1100px;
    margin: 0 auto;
    position: relative;
}

.index-value__heading {
    color: #161616;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(26px, calc(32 * 100vw / 1440), 32px);
    font-weight: 700;
    letter-spacing: calc(1.6 / 32 * 1em);
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
}

.index-value__heading::before,
.index-value__heading::after {
    content: "";
    display: block;
    width: 2px;
    height: clamp(32px, calc(40 * 100vw / 1440), 40px);
    background: #161616;
}

.index-value__heading::before {
    transform: rotate(-40deg);
    margin-right: clamp(24px, calc(30 * 100vw / 1440), 30px);
}

.index-value__heading::after {
    transform: rotate(40deg);
    margin-left: clamp(24px, calc(30 * 100vw / 1440), 30px);
}

.index-value__heading-emphasis {
    background: linear-gradient(180deg, #F35900 0%, #F38200 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: clamp(40px, calc(48 * 100vw / 1440), 48px);
    font-weight: 700;
    line-height: 100%;
    letter-spacing: calc(2.4 / 48 * 1em);
}

.index-value__list {
    margin-top: clamp(26px, calc(48 * 100vw / 1440), 48px);
    display: flex;
    flex-wrap: wrap;
    gap: clamp(12px, calc(20 * 100vw / 1440), 20px);
}

.index-value__item {
    flex: 1;
    background: linear-gradient(0deg, #0068B7 0%, #2D579A 100%);
    border-radius: 50%;
    box-shadow: 0 4px 8px rgba(45, 87, 154, 0.30);
    aspect-ratio: 1 / 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border: 3px solid #fff;
}

.index-value__item-icon img {
    height: 44px;
}

.index-value__item-title {
    margin-top: 10px;
    color: #FFFAA3;
    text-align: center;
    text-shadow: 0 4px 4px rgba(0, 0, 0, 0.10);
    font-size: 24px;
    font-weight: 900;
    line-height: 100%;
    letter-spacing: calc(4.8 / 24 * 1em);
    padding-bottom: 12px;
    position: relative;
}

.index-value__item-title:before {
    content: "";
    position: absolute;
    bottom: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 36px;
    height: 1px;
    background: #fff;
}

.index-value__item-text {
    margin-top: 8px;
    text-align: center;
    color: #FFF;
    font-size: 16px;
    line-height: 130%;
    letter-spacing: calc(0.64 / 16 * 1em);
}

.index-value__button-wrapper {
    margin: clamp(28px, calc(50 * 100vw / 1440), 50px) auto 0;
}

/* 999px以下：2×2 レイアウトに切り替え */
@media screen and (max-width: 999px) {
    .index-value__list {
        justify-content: center;
        row-gap: 30px;
    }

    .index-value__item {
        flex: 0 0 253px;
        max-width: 253px;
    }
}

.index-value__button {

}


@media screen and (max-width: 767px) {
    .index-value {
        padding: 40px 0;
    }

    /* FOUR VALUE 背景テキスト（2行に） */
    .index-value::before {
        content: "Four\A Value";
        white-space: pre;
        font-size: 100px;
        top: 20px;
        text-align: center;
    }

    .index-value__inner {
        padding: 0 16px;
    }

    /* 見出し */
    .index-value__heading {
        font-size: 18px;
        line-height: 100%;
    }

    .index-value__heading-emphasis {
        font-size: 28px;
    }

    /* リスト（2×2 は PC の 999px以下 media query で既に対応済み） */
    .index-value__list {
        margin: 22px auto 0;
        gap: 12px;
        max-width: 375px;
    }

    .index-value__item {
        flex: 0 0 calc((100% - 12px) / 2);
        max-width: none;
        padding-bottom: 14px;
    }

    /* アイコン */
    .index-value__item-icon img {
        height: 22px;
    }

    /* タイトル */
    .index-value__item-title {
        margin-top: 6px;
        font-family: "Noto Sans JP", sans-serif;
        font-size: 17px;
        padding-bottom: 8px;
    }

    .index-value__item-title:before {
        width: 36px;
    }

    /* テキスト */
    .index-value__item-text {
        margin-top: 6px;
        font-family: "Noto Sans JP", sans-serif;
        font-size: 12px;
        font-weight: 400;
        line-height: 130%;
        text-shadow: 0 4px 4px rgba(0, 0, 0, 0.10);
    }

    /* 4つ目のカード（ブランド格上げ）だけ letter-spacing を調整 */
    .index-value__item:nth-child(4) .index-value__item-title {
        letter-spacing: calc(0.34 / 17 * 1em);
    }

    .index-value__item:nth-child(4) .index-value__item-text {
        letter-spacing: -0.05em;
    }

    /* ボタン */
    .index-value__button-wrapper {
        margin-top: 30px;
    }
}

/* 374px以下は vw で縮小（375基準） */
@media screen and (max-width: 374px) {
    .index-value {
        padding: calc(40 * 100vw / 375) 0;
    }

    .index-value::before {
        font-size: calc(100 * 100vw / 375);
        letter-spacing: calc(10 * 100vw / 375);
        top: calc(60 * 100vw / 375);
    }

    .index-value__inner {
        padding: 0 calc(16 * 100vw / 375);
    }

    .index-value__heading {
        font-size: calc(18 * 100vw / 375);
    }

    .index-value__heading-emphasis {
        font-size: calc(28 * 100vw / 375);
    }

    .index-value__list {
        margin-top: calc(22 * 100vw / 375);
        gap: calc(12 * 100vw / 375);
        max-width: 100%;
    }

    .index-value__item-icon img {
        height: calc(22 * 100vw / 375);
    }

    .index-value__item-title {
        margin-top: calc(6 * 100vw / 375);
        font-size: calc(17 * 100vw / 375);
        padding-bottom: calc(8 * 100vw / 375);
    }

    .index-value__item-title:before {
        width: calc(36 * 100vw / 375);
    }

    .index-value__item-text {
        margin-top: calc(6 * 100vw / 375);
        font-size: calc(13 * 100vw / 375);
    }

    .index-value__item:nth-child(4) .index-value__item-text {
        letter-spacing: -0.05em;
    }

    .index-value__button-wrapper {
        margin-top: calc(30 * 100vw / 375);
    }
}

/* reason */
.index-reason {
    background: url(../img/top/index_reason_bg_pc.jpg) no-repeat center center /cover;
    padding: clamp(43px, calc(80 * 100vw / 1440), 80px) 0;
}

.index-reason__inner {
    padding: 0 clamp(16px, calc(30 * 100vw / 1440), 30px);
    max-width: 960px;
    margin: 0 auto;
}

.index-reason__heading {
    color: #161616;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(26px, calc(32 * 100vw / 1440), 32px);
    font-weight: 700;
    letter-spacing: calc(1.6 / 32 * 1em);
    text-align: center;
    position: relative;
    width: fit-content;
    margin: 0 auto;
    padding: 7px 40px;
    background: #FFF;
    border-radius: 8px;
    filter: drop-shadow(0 3px 3px rgba(0, 0, 0, 0.15));
}

.index-reason__heading::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    width: 0;
    height: 0;
    border-left: 22px solid transparent;
    border-right: 22px solid transparent;
    border-top: 20px solid #FFF;
}

.index-reason__heading-marker {
    background: linear-gradient(transparent 60%, #FFF200 60%);
    font-weight: 700;
}

.index-reason__heading-emphasis {
    background: linear-gradient(180deg, #F35900 0%, #F38200 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    font-size: clamp(40px, calc(48 * 100vw / 1440), 48px);
    font-weight: 700;
    letter-spacing: calc(2.4 / 48 * 1em);
}

.index-reason__list {
    margin-top: clamp(38px, calc(70 * 100vw / 1440), 70px);
    display: flex;
    flex-direction: column;
    gap: clamp(32px, calc(60 * 100vw / 1440), 60px);
}

.index-reason__item {
    filter: drop-shadow(0 3px 3px rgba(0, 0, 0, 0.15));
}

.index-reason__item-head {
    border-radius: 8px 8px 0 0;
    background: linear-gradient(180deg, #0070CF 0%, #2D579A 100%);
    display: flex;
    justify-content: center;
    align-items: flex-end;
    height: 50px;
    padding: 5px 0;
}

.index-reason__item-label {
    color: #FFF;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(20px, calc(24 * 100vw / 1440), 24px);
    font-weight: 700;
    line-height: 170%;
    letter-spacing: calc(0.72 / 24 * 1em);
    padding-right: clamp(10px, calc(16 * 100vw / 1440), 16px);
    position: relative;
}

.index-reason__item-label:before {
    content: "";
    position: absolute;
    bottom: 0;
    right: 0;
    width: 1px;
    height: 32px;
    background: #FFF;
}

.index-reason__item-num {
    color: #FFF;
    -webkit-text-stroke: 2px #2D579A;
    font-family: Arial, sans-serif;
    font-size: clamp(54px, calc(80 * 100vw / 1440), 80px);
    font-style: italic;
    font-weight: 700;
    line-height: 1;
}

.index-reason__item-title {
    color: #FFF;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(20px, calc(24 * 100vw / 1440), 24px);
    font-weight: 700;
    line-height: 170%;
    letter-spacing: calc(0.72 / 24 * 1em);
    padding-left: clamp(10px, calc(16 * 100vw / 1440), 16px);
}

.index-reason__item-title-marker {
    color: #FFF200;
    font-weight: 700;
}

.index-reason__item-body {
    display: flex;
    border-radius: 0 0 8px 8px;
    background: #FFF;
    overflow: hidden;
}

.index-reason__item-img {
    width: calc(400 / 900 * 100%);
}

.index-reason__item-img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

.index-reason__item-text {
    flex: 1;
    padding: clamp(16px, calc(30 * 100vw / 1440), 30px);
    color: #000;
    font-size: clamp(16px, calc(20 * 100vw / 1440), 20px);
    line-height: 160%;
    letter-spacing: calc(1 / 20 * 1em);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.index-reason__item-text p + p {
    margin-top: clamp(10px, calc(20 * 100vw / 1440), 20px);
}

.index-reason__item-text-strong {
    background: linear-gradient(transparent 60%, #9FD1FF 60%);
}

.index-reason__button-wrapper {
    margin-top: clamp(28px, calc(50 * 100vw / 1440), 50px);
}



@media screen and (max-width: 767px) {
    .index-reason {
        padding: 40px 0;
        background: url(../img/top/index_reason_bg_sp.jpg) no-repeat center center /cover;
    }

    .index-reason__inner {
        padding: 0 16px;
        max-width: 500px;
    }

    /* 見出し */
    .index-reason__heading {
        font-size: 18px;
        line-height: 130%;
        padding: 7px 25px 5px;
    }

    .index-reason__heading::after {
        border-left-width: 23.78px;
        border-right-width: 23.78px;
        border-top-width: 28.364px;
    }

    .index-reason__heading-emphasis {
        font-size: 24px;
        line-height: 130%;
    }

    /* リスト */
    .index-reason__list {
        margin-top: 60px;
        gap: 44px;
    }

    /* 項目ヘッダー */
    .index-reason__item-head {
        height: auto;
        padding: 13px 16px 4px 13px;
        flex-direction: column;
        align-items: center;
    }

    .index-reason__item-label {
        font-size: 16px;
        padding-right: 0;
        margin-top: -34px;
    }

    .index-reason__item-label:before {
        display: none;
    }

    .index-reason__item-num {
        font-size: 32px;
        -webkit-text-stroke-width: 1px;
    }

    .index-reason__item-title {
        font-size: 16px;
        line-height: 140%;
        text-align: center;
    }

    /* 項目本文（画像を上、テキストを下に縦積み） */
    .index-reason__item-body {
        flex-direction: column;
    }

    .index-reason__item-img {
        width: 100%;
        height: 180px;
    }

    .index-reason__item-text {
        padding: 20px 20px 24px;
        line-height: 140%;
    }

    .index-reason__item-text p + p {
        margin-top: 8px;
    }

    /* ボタン */
    .index-reason__button-wrapper {
        margin-top: 40px;
    }
}

/* strength */
.index-strength {
    background: url(../img/top/index_strength_bg_pc.jpg) no-repeat center center /cover;
    padding: clamp(43px, calc(80 * 100vw / 1440), 80px) 0;
    overflow: hidden;
}

.index-strength__inner {
    padding: 0 clamp(16px, calc(30 * 100vw / 1440), 30px);
    max-width: 1160px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}

.index-strength__inner:before {
    content: "";
    position: absolute;
    bottom: -80px;
    right: -111px;
    width: 198px;
    aspect-ratio: 198 / 245;
    background: url(../img/top/index_strength_img_pc.png) no-repeat center center /contain;
    z-index: 2;
}

@media screen and (max-width: 1240px) {
    .index-strength__inner:before {
        display: none;
    }
}

.index-strength__heading {
    color: #161616;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(26px, calc(32 * 100vw / 1440), 32px);
    letter-spacing: calc(1.6 / 32 * 1em);
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.index-strength__heading-inner {
    font-weight: 700;
}

.index-strength__heading::before,
.index-strength__heading::after {
    content: "";
    display: block;
    width: 2px;
    height: clamp(48px, calc(64 * 100vw / 1440), 64px);
    background: #161616;
}

.index-strength__heading::before {
    transform: rotate(-20deg);
    margin-right: clamp(20px, calc(30 * 100vw / 1440), 30px);
}

.index-strength__heading::after {
    transform: rotate(20deg);
    margin-left: clamp(20px, calc(30 * 100vw / 1440), 30px);
}

.index-strength__heading-small {
    font-size: clamp(22px, calc(28 * 100vw / 1440), 28px);
    font-weight: 700;
}

.index-strength__heading-num {
    color: #0070CF;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(40px, calc(48 * 100vw / 1440), 48px);
    font-weight: 700;
    letter-spacing: calc(2.4 / 48 * 1em);
    line-height: 1;
}

.index-strength__list {
    margin-top: clamp(36px, calc(67 * 100vw / 1440), 67px);
    display: flex;
    gap: clamp(14px, calc(24 * 100vw / 1440), 24px);
}

.index-strength__item {
    flex: 1;
    border-radius: 8px;
    filter: drop-shadow(0 2px 4px rgba(255, 242, 0, 0.20));
    display: flex;
    flex-direction: column;
}

.index-strength__item-head {
    border-radius: 8px 8px 0 0;
    border: 2px solid #F38200;
    background: #FFF;
    background: linear-gradient(180deg, #F35900 0%, #F38200 100%);
    text-align: center;
    min-height: clamp(90px, calc(120 * 100vw / 1440), 120px);
}

.index-strength__item-label {
    color: #2D579A;
    text-align: center;
    text-shadow: 0 4px 4px rgba(0, 0, 0, 0.15);
    -webkit-text-stroke-width: 3px;
    -webkit-text-stroke-color: #FFF;
    paint-order: stroke fill;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(28px, calc(40 * 100vw / 1440), 40px);
    font-weight: 700;
    line-height: 1;
    margin-top: clamp(-30px, calc(-30 * 100vw / 1440), -22px);
    display: block;
}

.index-strength__item-num {
    font-size: clamp(36px, calc(50 * 100vw / 1440), 50px);
    font-weight: 700;
    margin-left: 0.25em;
}

.index-strength__item-title {
    color: #FFF;
    font-size: clamp(16px, calc(24 * 100vw / 1440), 24px);
    font-weight: 700;
    line-height: 130%;
    margin-top: 8px;
    padding-bottom: 6px;
}

.index-strength__item:not(:last-child) .index-strength__item-title {
    margin-top: 14px;
}

.index-strength__item:last-child .index-strength__item-title {
    font-size: clamp(14px, calc(20 * 100vw / 1440), 20px);
}

.index-strength__item-body {
    border-radius: 0 0 8px 8px;
    border: 2px solid #F38200;
    background: #FFF;
    border-top: none;
    color: #161616;
    font-size: clamp(14px, calc(18 * 100vw / 1440), 18px);
    font-weight: 500;
    line-height: 160%;
    padding: clamp(12px, calc(17 * 100vw / 1440), 17px) clamp(16px, calc(32 * 100vw / 1440), 32px);
    flex-grow: 1;
}



@media screen and (max-width: 767px) {
    .index-strength {
        padding: 40px 0 145px;
        background: url(../img/top/index_strength_bg_sp.png) no-repeat center center /cover;
    }

    .index-strength__inner {
        padding: 0 25px;
        max-width: 500px;
    }

    /* ビジネスマン画像：SPで表示、幅160px、セクション下辺に固定 */
    .index-strength__inner:before {
        display: block;
        bottom: -176px;
        right: 50%;
        transform: translateX(50%);
        width: 160px;
    }

    /* 見出し全体を18pxに（PC 32pxを上書き） */
    .index-strength__heading {
        font-size: 18px;
    }

    /* 「の」heading-small を 18px に（PC 28px 上書き） */
    .index-strength__heading-small {
        font-size: 18px;
    }

    /* 「3」を28pxに（PC 48px上書き） */
    .index-strength__heading-num {
        font-size: 28px;
    }

    /* 両脇の斜線を小さめに */
    .index-strength__heading::before,
    .index-strength__heading::after {
        height: 40px;
    }

    /* カードリスト */
    .index-strength__list {
        margin-top: 43px;
        flex-direction: column;
        gap: 37px;
        align-items: center;
    }

    .index-strength__item {
        width: 100%;
    }

    /* カードヘッダー */
    .index-strength__item-head {
        min-height: auto;
        padding: 16px 16px;
    }

    .index-strength__item-label {
        font-size: 24px;
        margin-top: -34px;
        -webkit-text-stroke-width: 4px;
        paint-order: stroke fill;
    }

    .index-strength__item-num {
        font-size: 28px;
    }

    /* カードタイトル（Point下のテキスト） */
    .index-strength__item-title {
        font-size: 20px;
        line-height: 140%;
        padding-bottom: 0;
    }

    /* Point 3（最後のカード）のタイトルだけ 18px */
    .index-strength__item:last-child .index-strength__item-title {
        font-size: 18px;
        line-height: 140%;
        padding-bottom: 0;
    }

    /* カード本文 */
    .index-strength__item-body {
        font-size: 18px;
        font-weight: 400;
        padding: 20px 22px 28px;
    }
}

/* 374px以下は vw で縮小（375基準） */
@media screen and (max-width: 374px) {
    .index-strength__item-title {
        font-size: calc(20 * 100vw / 375);
    }

    .index-strength__item:last-child .index-strength__item-title {
        font-size: calc(18 * 100vw / 375);
    }

    .index-strength__item-body {
        font-size: calc(18 * 100vw / 375);
    }
}

/* results */
.index-results {
    padding: clamp(43px, calc(80 * 100vw / 1440), 80px) 0;
    overflow: hidden;
}

.index-results__inner {
    padding: 0 clamp(16px, calc(30 * 100vw / 1440), 30px);
    max-width: 970px;
    margin: 0 auto;
}

.index-results__heading {
    color: #161616;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(26px, calc(32 * 100vw / 1440), 32px);
    font-weight: 700;
    letter-spacing: calc(1.6 / 32 * 1em);
    text-align: center;
    padding: 0 20px;
    position: relative;
    width: fit-content;
    margin: 0 auto;
}

.index-results__heading::before, .index-results__heading::after {
    content: "";
    display: block;
    width: clamp(107px, calc(200 * 100vw / 1440), 200px);
    height: 1px;
    background: #000;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
}

.index-results__heading::before {
    right: 100%;
}

.index-results__heading::after {
    left: 100%;
}

.index-results__heading-emphasis {
    color: #FFF;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(40px, calc(48 * 100vw / 1440), 48px);
    font-weight: 700;
    letter-spacing: calc(2.4 / 48 * 1em);
    background: linear-gradient(180deg, #0070CF 0%, #003969 100%);
    padding: 5px;
    margin-left: 8px;
}

.index-results__text {
    margin-top: clamp(16px, calc(30 * 100vw / 1440), 30px);
    text-align: center;
    color: #161616;
    font-family: "Noto Sans JP";
    font-size: clamp(16px, calc(20 * 100vw / 1440), 20px);
    font-weight: 500;
    line-height: 160%;
    letter-spacing: calc(1 / 20 * 1em);
}

.index-results__text-marker {
    color: #0070CF;
    font-weight: 700;
}

.index-results__effect {
    margin-top: clamp(26px, calc(50 * 100vw / 1440), 50px);
}

.index-results__effect img {
    width: 100%;
    height: auto;
}

.index-results__button-wrapper {
    margin-top: clamp(32px, calc(62 * 100vw / 1440), 62px);
}



@media screen and (max-width: 767px) {
    .index-results {
        padding: 40px 0;
    }

    .index-results__inner {
        padding: 0 24px;
        max-width: 500px;
    }

    /* 見出し */
    .index-results__heading {
        font-size: 18px;
        padding: 0;
    }

    /* 両脇の横線 */
    .index-results__heading::before,
    .index-results__heading::after {
        width: 40px;
        height: 1.6px;
    }

    .index-results__heading::before {
        right: calc(100% + 8px);
    }

    .index-results__heading::after {
        left: calc(100% + 8px);
    }

    /* 「成」「果」ネイビーボックス */
    .index-results__heading-emphasis {
        font-size: 24px;
        letter-spacing: calc(2.4 / 24 * 1em);
        padding: 4px;
        margin-left: 4px;
    }

    /* リード文 */
    .index-results__text {
        margin-top: 20px;
    }

    /* 効果図 */
    .index-results__effect {
        margin-top: 30px;
    }

    /* ボタン */
    .index-results__button-wrapper {
        margin-top: 40px;
    }
}

/* support */
.index-support {
    padding: clamp(96px, calc(180 * 100vw / 1440), 180px) 0 clamp(43px, calc(80 * 100vw / 1440), 80px);
    background: rgba(159, 209, 255, 0.30);
    position: relative;
    overflow: hidden;
}

.index-support::before,
.index-support::after {
    content: "";
    position: absolute;
    background-repeat: no-repeat;
    background-size: contain;
    pointer-events: none;
    z-index: 0;
}

.index-support::before {
    top: 0;
    left: 0;
    width: clamp(240px, calc(440 * 100vw / 1440), 440px);
    aspect-ratio: 440 / 446;
    background-image: url(../img/top/index_support_deco_01.svg);
}

.index-support::after {
    bottom: 0;
    right: 0;
    width: clamp(240px, calc(440 * 100vw / 1440), 440px);
    aspect-ratio: 440 / 468;
    background-image: url(../img/top/index_support_deco_02.svg);
}

.index-support__inner {
    padding: 0 clamp(16px, calc(30 * 100vw / 1440), 30px);
    max-width: 1220px;
    margin: 0 auto;
    position: relative;
    z-index: 1;
}


.index-support__heading {
    color: #000;
    text-align: center;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(26px, calc(32 * 100vw / 1440), 32px);
    font-weight: 700;
    line-height: 100%;
}

.index-support__heading-small {
    font-weight: 700;
}

.index-support__heading-emphasis {
    color: #FFF;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(40px, calc(48 * 100vw / 1440), 48px);
    font-weight: 700;
    letter-spacing: calc(2.4 / 48 * 1em);
    background: linear-gradient(180deg, #0070CF 0%, #003969 100%);
    padding: 5px;
    margin-right: 8px;
}


.index-support__box {
    padding: clamp(40px, calc(73 * 100vw / 1440), 73px) clamp(24px, calc(64 * 100vw / 1440), 64px) clamp(26px, calc(48 * 100vw / 1440), 48px);
    background: #FFF;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.15);
    margin-top: -20px;
}

.index-support__columns {
    display: flex;
    justify-content: space-between;
    gap: clamp(20px, calc(40 * 100vw / 1440), 40px);
}

.index-support__column {
    width: 100%;
    max-width: 483px;
}

.index-support__column-label {
    color: #FFF;
    text-align: center;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(18px, calc(24 * 100vw / 1440), 24px);
    font-weight: 700;
    line-height: 100%;
    letter-spacing: calc(0.96 / 24 * 1em);
    display: inline-block;
    padding: 11px 40px 11px 24px;
    background: linear-gradient(180deg, #F35900 0%, #F38200 100%);
    clip-path: polygon(0 0, calc(100% - 20px) 0, 100% 100%, 0 100%);
    filter: drop-shadow(0 2px 4px rgba(0, 0, 0, 0.15));
    margin-left: -20px;
}

.index-support__column-img {
    margin-top: -20px;
}

.index-support__column-img img {
    width: 100%;
    height: auto;
    aspect-ratio: 440 / 280;
    object-fit: cover;
}

.index-support__list {
    margin-top: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    padding-left: clamp(0px, calc(32 * 100vw / 1440), 32px);
}

.index-support__item {
    color: #3C3C3C;
    font-size: clamp(16px, calc(24 * 100vw / 1440), 24px);
    font-weight: 500;
    line-height: 185%;
    letter-spacing: calc(0.72 / 24 * 1em);
    padding-left: 30px;
    background: url(../img/common/icon_check.svg) no-repeat left center /contain;
    background-size: 20px;
}

.index-support__text {
    margin-top: clamp(20px, calc(32 * 100vw / 1440), 32px);
    text-align: center;
    color: #161616;
    font-family: "Noto Sans JP";
    font-size: clamp(14px, calc(20 * 100vw / 1440), 20px);
    font-weight: 500;
    line-height: 160%;
    letter-spacing: calc(1 / 20 * 1em);
}

.index-support__text-marker {
    color: #0070CF;
    font-weight: 700;
}

.index-support__button-wrapper {
    margin-top: clamp(28px, calc(50 * 100vw / 1440), 50px);
}

@media screen and (max-width: 767px) {
    .index-support {
        padding: 84px 0 44px;
    }

    /* 背景装飾 */
    .index-support::before,
    .index-support::after {
        width: 240.002px;
    }

    .index-support__inner {
        padding: 0 16px;
        max-width: 500px;
    }

    /* 見出し */
    .index-support__heading {
        font-size: 18px;
        letter-spacing: calc(1.6 / 32 * 1em);
    }

    /* 「の」だけ小さく */
    .index-support__heading-small {
        font-size: 16px;
    }

    /* 「充」「実」ネイビーボックス */
    .index-support__heading-emphasis {
        font-size: 24px;
        letter-spacing: calc(2.4 / 24 * 1em);
        padding: 4px;
    }

    /* 白ボックス */
    .index-support__box {
        margin-top: -13px;
        padding: 48px 22px 40px;
    }

    /* カラム縦積み */
    .index-support__columns {
        flex-direction: column;
        gap: 30px;
    }

    /* オレンジラベル */
    .index-support__column-label {
        margin-left: -8px;
        font-size: 16px;
        padding: 6px 40px 6px 15px;
    }

    /* 画像 */
    .index-support__column-img {
        margin-top: -15px;
    }


    /* チェックリスト */
    .index-support__list {
        margin-top: 16px;
        padding-left: 10px;
        gap: 0;
    }

    .index-support__item {
        font-size: 16px;
        padding-left: 20px;
        background-size: 14px;
    }

    /* 説明文 */
    .index-support__text {
        margin-top: 20px;
        font-size: 16px;
    }

    /* ボタン */
    .index-support__button-wrapper {
        margin-top: 30px;
    }
}

/* 374px以下は vw で縮小（375基準） */
@media screen and (max-width: 374px) {
    .index-support__box {
        padding: calc(58 * 100vw / 375) calc(22 * 100vw / 375) calc(40 * 100vw / 375);
    }

    .index-support__item {
        font-size: calc(16 * 100vw / 375);
    }
}

/* approach */
.index-approach {
    padding: clamp(43px, calc(80 * 100vw / 1440), 80px) 0;
}

.index-approach__inner {
    padding: 0 clamp(16px, calc(30 * 100vw / 1440), 30px);
    max-width: 1100px;
    margin: 0 auto;
}


.index-approach__heading {
    color: #000;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    line-height: 1.4;
    text-align: center;
}

.index-approach__heading-lead {
    display: block;
    font-size: clamp(22px, calc(32 * 100vw / 1440), 32px);
    font-weight: 700;
    letter-spacing: 0.96px;
}

.index-approach__heading-main {
    display: block;
    font-size: clamp(34px, calc(48 * 100vw / 1440), 48px);
    font-weight: 700;
    letter-spacing: 1.44px;
}

.index-approach__heading-small {
    font-size: clamp(28px, calc(40 * 100vw / 1440), 40px);
    font-weight: 700;
    letter-spacing: 1.2px;
}

.index-approach__heading-emphasis {
    font-weight: 700;
    background: linear-gradient(180deg, #F35900 0%, #F38200 100%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
    padding: 4px;
    border: 1px solid #F35900;
}

.index-approach__text {
    margin-top: clamp(16px, calc(30 * 100vw / 1440), 30px);
    text-align: center;
    color: #161616;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(16px, calc(20 * 100vw / 1440), 20px);
    font-weight: 500;
    line-height: 160%;
    letter-spacing: calc(1 / 20 * 1em);
}

.index-approach__text-marker {
    color: #0070CF;
    font-weight: 700;
}

.index-approach__list {
    margin-top: clamp(24px, calc(40 * 100vw / 1440), 40px);
    display: flex;
    justify-content: space-between;
    gap: clamp(16px, calc(40 * 100vw / 1440), 40px);
}

.index-approach__item {
    flex: 1;
}

.index-approach__item-img img {
    width: 100%;
    height: auto;
    aspect-ratio: 320 / 200;
    object-fit: cover;
}

.index-approach__item-title {
    margin: clamp(14px, calc(24 * 100vw / 1440), 24px) auto 0;
    width: fit-content;
    color: #040000;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(18px, calc(24 * 100vw / 1440), 24px);
    line-height: 100%;
    padding-left: clamp(28px, calc(36 * 100vw / 1440), 36px);
    background: url(../img/common/icon_check_02.svg) no-repeat left center /contain;
    background-size: clamp(20px, calc(24 * 100vw / 1440), 24px);
}

.index-approach__item-title-text {
    background: linear-gradient(transparent 60%, #FFF200 60%);
    font-weight: 600;
}

.index-approach__item-text {
    margin-top: clamp(12px, calc(20 * 100vw / 1440), 20px);
    color: #161616;
    font-family: "Noto Sans JP", sans-serif;
    font-size: clamp(14px, calc(18 * 100vw / 1440), 18px);
    font-weight: 500;
    line-height: 160%;
    padding: 0 10px;
}



@media screen and (max-width: 767px) {
    .index-approach {
        padding: 40px 0;
    }

    .index-approach__inner {
        padding: 0 20px;
        max-width: 500px;
    }

    /* 見出し 1行目「さまざまな広告手法が飽和した今、」 */
    .index-approach__heading-lead {
        font-size: 18px;
        letter-spacing: calc(0.54 / 18 * 1em);
    }

    /* 2行目ベース「最も効率的な近道」 */
    .index-approach__heading-main {
        font-size: 20px;
        letter-spacing: calc(0.6 / 20 * 1em);
    }

    /* 2行目 small「な」「への」 */
    .index-approach__heading-small {
        font-size: 20px;
        letter-spacing: calc(0.6 / 20 * 1em);
    }

    /* 「新規獲得」オレンジグラデ */
    .index-approach__heading-emphasis {
        font-size: 24px;
        letter-spacing: calc(0.72 / 24 * 1em);
    }

    /* 見出しと本文の距離 */
    .index-approach__text {
        margin-top: 30px;
        font-size: 16px;
    }

    /* 本文と項目リストの距離 */
    .index-approach__list {
        margin-top: 24px;
        flex-direction: column;
        gap: 30px;
    }

    /* 各項目 */
    .index-approach__item-title {
        margin-top: 20px;
        font-size: 20px;
        font-weight: 600;
        padding-left: 33px;
        background-size: 24px;
    }

    .index-approach__item-text {
        margin-top: 16px;
        font-size: 18px;
        padding: 0 10px;
    }
}

/* 374px以下は vw で縮小（375基準） */
@media screen and (max-width: 374px) {
    .index-approach__heading-lead {
        font-size: calc(18 * 100vw / 375);
    }

    .index-approach__heading-main {
        font-size: calc(20 * 100vw / 375);
    }

    .index-approach__heading-small {
        font-size: calc(20 * 100vw / 375);
    }

    .index-approach__heading-emphasis {
        font-size: calc(24 * 100vw / 375);
    }

    .index-approach__text {
        font-size: calc(16 * 100vw / 375);
    }

    .index-approach__item-title {
        font-size: calc(20 * 100vw / 375);
    }

    .index-approach__item-text {
        font-size: calc(18 * 100vw / 375);
    }
}

/* contact */
.index-contact {

}

.index-contact__inner {
    display: flex;
}

.index-contact__img {
    width: calc(560 / 1440 * 100%);
}

.index-contact__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.index-contact__contents {
    padding: clamp(37px, calc(70 * 100vw / 1440), 70px) 0;
    width: calc(880 / 1440 * 100%);
    background-color: #D0E6FA;
    display: flex;
    align-items: center;
}

.index-contact__contents-inner {
    padding: 0 clamp(16px, calc(30 * 100vw / 1440), 30px);
    max-width: 700px;
    margin: 0 auto;
}

.index-contact__heading {
    color: #000;
    font-family: "Hiragino Sans", "Noto Sans JP", sans-serif;
    font-size: clamp(28px, calc(40 * 100vw / 1440), 40px);
    font-weight: 700;
    line-height: 100%;
    letter-spacing: calc(1.2 / 40 * 1em);
    display: flex;
    align-items: center;
    justify-content: center;
}

.index-contact__heading::before,
.index-contact__heading::after {
    content: "";
    display: block;
    width: clamp(22px, calc(32 * 100vw / 1440), 32px);
    aspect-ratio: 32 / 36;
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

.index-contact__heading::before {
    margin-right: clamp(12px, calc(20 * 100vw / 1440), 20px);
    background-image: url(../img/top/index_contact_line_left.svg);
}

.index-contact__heading::after {
    margin-left: clamp(12px, calc(20 * 100vw / 1440), 20px);
    background-image: url(../img/top/index_contact_line_right.svg);
}

.index-contact__text {
    margin-top: clamp(16px, calc(30 * 100vw / 1440), 30px);
    color: #161616;
    font-family: "Noto Sans JP", sans-serif;
    font-size: clamp(14px, calc(20 * 100vw / 1440), 20px);
    font-weight: 500;
    line-height: 160%;
    letter-spacing: calc(0.8 / 20 * 1em);
}

.index-contact__text p + p {
    margin-top: 8px;
}

.index-contact__text-marker {
    font-weight: 700;
    background: linear-gradient(transparent 60%, #FFF200 60%);
}

.index-contact__button {
    margin-top: clamp(24px, calc(40 * 100vw / 1440), 40px);
}

@media screen and (max-width: 767px) {
    .index-contact__inner {
        flex-direction: column;
    }

    /* 画像 */
    .index-contact__img {
        width: 100%;
    }

    .index-contact__img img {
        aspect-ratio: 375 / 190;
        height: auto;
    }

    /* コンテンツエリア（青背景） */
    .index-contact__contents {
        padding: 40px 20px;
        width: 100%;
        display: block;
    }

    .index-contact__contents-inner {
        padding: 0;
        max-width: 500px;
    }

    /* 見出し */
    .index-contact__heading {
        font-size: 24px;
    }

    /* 本文 */
    .index-contact__text {
        margin-top: 20px;
        font-size: 16px;
    }

    .index-contact__text p + p {
        margin-top: 10px;
    }

    /* ボタン */
    .index-contact__button {
        margin-top: 30px;
    }
}

/* 374px以下は vw で縮小（375基準） */
@media screen and (max-width: 374px) {
    .index-contact__heading {
        font-size: calc(24 * 100vw / 375);
    }

    .index-contact__heading::before,
    .index-contact__heading::after {
        width: calc(22 * 100vw / 375);
    }

    .index-contact__heading::before {
        margin-right: calc(12 * 100vw / 375);
    }

    .index-contact__heading::after {
        margin-left: calc(12 * 100vw / 375);
    }

    .index-contact__text {
        font-size: calc(16 * 100vw / 375);
    }
}

/* link-area */
.index-link-area {
    padding: 50px 0;
    background: #F8F8F8;
}

.index-link-area__inner {
    padding: 0 30px;
    max-width: 1010px;
    margin: 0 auto;

}

.index-link-area__column {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 40px calc(142 / 950 * 100%);
}

.index-link-area__button-wrapper {
    width: calc(404 / 950 * 100%);
}

.index-link-area__button {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    max-width: 320px;
    height: 60px;
    margin: 0 auto;
    border: 1px solid #FFBBDD;
    border-radius: 4px;
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.50) 0%, rgba(255, 187, 221, 0.50) 100%);
    box-shadow: 4px 4px 0 #FFBBDD, 0 2px 2px 0 rgba(0, 0, 0, 0.25);
    transition: all 0.3s ease 0s;
}

.index-link-area__button::after {
    content: "";
    position: absolute;
    top: 50%;
    right: 16px;
    transform: translateY(-50%);
    width: 20px;
    height: 20px;
    background: url(../img/common/icon_external.svg) no-repeat center /contain;
}

.index-link-area__button:hover {
    transform: translate(4px, 4px);
    box-shadow: 0 0 0 #FFBBDD, 0 2px 2px 0 rgba(0, 0, 0, 0.25);
}

.index-link-area__button-text {
    color: #1B1B1B;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 24px;
    font-weight: 700;
    line-height: 100%;
    letter-spacing: 4.8px;
}

@media screen and (max-width: 767px) {
    .index-link-area {
        padding: 40px 0;
    }

    .index-link-area__inner {
        padding: 0 26px;
    }

    .index-link-area__column {
        gap: 40px;
    }

    .index-link-area__button-wrapper {
        width: 100%;
    }

    .index-link-area__button img {
        margin: 0 auto;
    }
}

/* footer */
.footer {
    background-color: #6FA8DC;
    padding: 60px 0 16px;

}

.footer__inner {
    padding: 0 30px;

}

.footer__sns-list {
    display: flex;
    justify-content: center;
    gap: 38px;
}

.footer__sns-item {

}

.footer__sns-link {
    display: block;
    transition: all 0.3s ease 0s;
}

.footer__sns-link:hover {
    opacity: 0.7;
}

.footer__link {
    margin-top: 60px;
    display: block;
    width: fit-content;
    margin-inline: auto;
    padding: 0 10px;
    text-align: center;
    font-size: 20px;
    letter-spacing: 0.05em;
    font-weight: 500;
    transition: all 0.3s ease 0s;
}

.footer__link:hover {
    opacity: 0.7;
}

.footer__copy {
    display: block;
    margin-top: 10px;
    text-align: center;
    font-size: 12px;
}

@media screen and (max-width: 767px) {
    .footer {
        padding: 40px 0 12px;
    }

    .footer__inner {
        padding: 0 13px;
    }

    .footer__sns-list {
        gap: 38px;
    }

    .footer__link {
        margin-top: 40px;
        font-size: 16px;
    }

    .footer__copy {
        margin-top: 10px;
    }
}