@charset "utf-8";

/* =========================================================
   #37743 アポロ 太陽光発電所 買取LP
   PC : 769px以上（デザイン基準幅 1980px / 1rem = 10px 相当）
   SP : 768px以下（デザイン基準幅  750px / 1rem = 10px 相当）
   ========================================================= */

/* ---------- base ---------- */
:root {
    --o: #ff7300;
    --o-d: #e05f00;
    --beige: #fff1c8;
    --beige-l: #fff8e4;
    --ink: #121212;
    --blue: #008ae5;
    --gray: #e1e1e1;
}

/* reset.css を後追いで読み込む前提だが、単体でも崩れないよう最低限を初期化 */
*,
*::before,
*::after {
    box-sizing: border-box;
}

html,
body,
div,
p,
h1,
h2,
h3,
h4,
ul,
ol,
li,
dl,
dt,
dd,
form,
fieldset,
figure,
picture,
blockquote,
pre {
    margin: 0;
    padding: 0;
}

ul,
ol {
    list-style: none;
}

h1,
h2,
h3,
h4 {
    font-size: 100%;
    font-weight: inherit;
}

em,
address {
    font-style: normal;
}

mark {
    background: none;
    color: inherit;
}

input,
textarea,
button,
select {
    font: inherit;
    color: inherit;
}

/* PC: 1rem = 10px 固定（文字サイズが画面幅で変わらない）
   デザインカンバス1980px = 実寸1980px。セクション背景のみ全幅で敷く */
html {
    font-size: 10px;
}

body {
    font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Hiragino Sans", Meiryo, sans-serif;
    font-weight: 500;
    color: var(--ink);
    background: #fff;
    line-height: 1.5;
    -webkit-text-size-adjust: 100%;
    text-align: center;
}

img {
    max-width: 100%;
    height: auto;
    vertical-align: bottom;
}

/* 親要素で寸法を決めている画像は、width属性の値ではなく親幅に追従させる
   （PC/SPで別サイズの素材に差し替わるため） */
.point__img img,
.c02__cardImg img,
.c06__boxImg img,
.c04__chart img {
    width: 100%;
}

a {
    color: inherit;
    text-decoration: none;
}

button {
    font-family: inherit;
    cursor: pointer;
}

.l-page {
    overflow: hidden;
    min-width: 124rem;
    /* コンテンツ幅1200px+左右余白。これより狭い画面は横スクロール */
}

.u-hidden {
    position: absolute !important;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
    border: 0;
}

.u-sp {
    display: none;
}

.br-sp {
    display: none;
}

/* ---------- 共通見出し ---------- */
.ttl-lead {
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.4;
    color: var(--o);
}

.ttl {
    font-size: 4.6rem;
    font-weight: 700;
    line-height: 1.4;
}

/* =========================================================
   MV
   背景画像に文字が焼き込まれているため、MV内だけは
   --u（可変ユニット）で画像と一体にスケールさせる
   ========================================================= */
.mv {
    position: relative;
    --u: calc(max(100vw, 124rem) / 1980);
}

.mv__bg img {
    display: block;
    width: 100%;
}

/* 背景（MV_PC.jpg）＋ロゴ＋前景（MV_img_PC.png）を --u で一体スケール */
.mv__logo,
.mv__lead {
    position: absolute;
    line-height: 0;
    z-index: 1;
}

.mv__logo img,
.mv__lead img {
    width: 95%;
}

.mv__logo {
    left: calc(var(--u) * 20);
    top: calc(var(--u) * 18);
    width: calc(var(--u) * 240);
}

.mv__lead {
    left: calc(var(--u) * 378);
    top: calc(var(--u) * 48);
    width: calc(var(--u) * 855);
}

.mvform {
    position: absolute;
    z-index: 2;
    left: 57.879%;
    top: 7.73%;
    width: 22.374%;
    padding: calc(var(--u) * 24) calc(var(--u) * 22) calc(var(--u) * 27);
    background: #fff;
    border-radius: calc(var(--u) * 12);
    box-shadow: 0 calc(var(--u) * 4) calc(var(--u) * 16) rgba(0, 0, 0, .12);
    text-align: left;
    box-sizing: border-box;
}

.mvform__badge {
    position: absolute;
    left: calc(var(--u) * -53);
    top: calc(var(--u) * -11);
    width: calc(var(--u) * 93);
    height: calc(var(--u) * 93);
    border-radius: 50%;
    background: var(--o);
    color: #fff;
    font-size: calc(var(--u) * 16);
    font-weight: 700;
    line-height: 1.35;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.mvform__ttl {
    padding-left: calc(var(--u) * 32);
    font-size: calc(var(--u) * 24);
    font-weight: 700;
    line-height: 1.2;
    text-align: center;
    letter-spacing: -.01em;
    white-space: nowrap;
}

.mvform__ttl em {
    font-style: normal;
    color: var(--o);
}

.mvform__form {
    margin-top: calc(var(--u) * 3);
    padding-top: calc(var(--u) * 20);
    border-top: calc(var(--u) * 3) dotted var(--o);
}

.mvform__row {
    display: flex;
    align-items: center;
    /* エラーメッセージが出た行だけ高さを伸ばす */
    min-height: calc(var(--u) * 50);
}

.mvform__row--area {
    min-height: 0;
    margin-bottom: calc(var(--u) * 24);
}

.mvform__label {
    width: calc(var(--u) * 94);
    flex: none;
    font-size: calc(var(--u) * 15);
    font-weight: 500;
    line-height: 1.25;
}

.mvform__input {
    width: 100%;
    height: calc(var(--u) * 38);
    padding: 0 calc(var(--u) * 6);
    border: none;
    border-radius: calc(var(--u) * 4);
    background: var(--beige-l);
    font-family: inherit;
    font-size: calc(var(--u) * 15);
    color: var(--ink);
    box-sizing: border-box;
}

.mvform__textarea {
    height: calc(var(--u) * 74);
    padding: calc(var(--u) * 6);
    resize: vertical;
    line-height: 1.5;
}

.mvform__submit {
    margin-top: calc(var(--u) * 9);
    text-align: center;
}

/* MV内の共通パーツも可変ユニットに合わせる */
.mv .req--v {
    width: calc(var(--u) * 26);
    height: calc(var(--u) * 34);
    margin: 0 calc(var(--u) * 4);
    font-size: calc(var(--u) * 12);
    border-radius: calc(var(--u) * 2);
}

.mv .req--v>span {
    width: calc(var(--u) * 12);
}

.mv .formcheck {
    gap: calc(var(--u) * 6);
    font-size: calc(var(--u) * 15);
}

.mv .formcheck__box {
    width: calc(var(--u) * 14);
    height: calc(var(--u) * 14);
}

.mv .submitbtn {
    width: calc(var(--u) * 316);
    height: calc(var(--u) * 48);
    border-radius: calc(var(--u) * 6);
    font-size: calc(var(--u) * 24);
}


/*最短30分で査定可能！相見積もり歓迎！*/
/* スマホ用 */
@media (max-width: 768px) {
    .pc {
        display: none;
    }
    
        .c00 {
        background: var(--beige);
        padding: 38px 10px 38px 10px;
    }

    .c00 h2 {
        font-size: 5rem;
        margin-bottom: .9rem;
        font-weight: 700;
        line-height: 1.4;
        color: var(--o);
    }

    .c00 h3 {
        margin-top: .9rem;
        font-size: 3.8rem;
        font-weight: 700;
        line-height: 1.3;
    }

}

/* PC用 */
@media (min-width: 769px) {
    .sp {
        display: none;
    }

 

    .c00 {
        background: var(--beige);
        padding: 80px 10px 80px 10px;
    }

    .c00 h2 {
        font-size: 4.6rem;
        line-height: 1.45;
        color: var(--o);
    }

    .c00 h3 {
        margin-top: .8rem;
        margin-bottom: .9rem;
        font-size: 4rem;
        line-height: 1.2;
    }
}


/* 必須バッジ */
.req {
    flex: none;
    margin: 0 .4rem;
    background: var(--o);
    color: #fff;
    font-size: 1.2rem;
    font-weight: 700;
    line-height: 1.1;
    border-radius: .2rem;
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.req--v {
    width: 2.6rem;
    height: 3rem;
    writing-mode: horizontal-tb;
}

.req--v>span {
    display: block;
    width: 1.2rem;
    word-break: break-all;
}

.req--none {
    background: none;
}

/* プライバシーポリシー同意 */
.formcheck {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: .6rem;
    font-size: 1.5rem;
}

.formcheck__box {
    width: 1.4rem;
    height: 1.4rem;
    margin: 0;
    accent-color: #121212;
}

.formcheck__label a:hover,
.formcheck__label a:focus-visible {
    text-decoration: underline;
}

/* 送信ボタン */
.submitbtn {
    display: inline-block;
    width: 31.6rem;
    height: 4.8rem;
    border: none;
    border-radius: .6rem;
    background: linear-gradient(180deg, #f98407 0%, #ee6a00 55%, #d95400 100%);
    box-shadow: 0 .2rem .4rem rgba(0, 0, 0, .18);
    color: #fff;
    font-size: 2.4rem;
    font-weight: 700;
    letter-spacing: .08em;
    transition: opacity .2s;
}

.submitbtn:disabled {
    opacity: .45;
    cursor: not-allowed;
}

.submitbtn--lg {
    width: 39.6rem;
    height: 6.9rem;
    border-radius: .8rem;
    font-size: 3rem;
}

/* =========================================================
   フォームのバリデーション表示
   ========================================================= */
/* 入力欄とエラーメッセージをまとめる枠。行の flex スロットを引き継ぐ */
.formfield {
    position: relative;
    flex: 1 1 auto;
    min-width: 0;
}

.formmsg {
    display: none;
    margin-top: .6rem;
    color: #d93025;
    font-size: 1.6rem;
    font-weight: 500;
    line-height: 1.4;
    text-align: left;
}

.formmsg.is-show {
    display: block;
}

.formmsg--c {
    margin-top: 1.2rem;
    text-align: center;
}

/* input は border: none のため、レイアウトを崩さない内側の影で枠を出す */
.mvform__input.is-error,
.bigform__input.is-error {
    background-color: #fdf1f0;
    box-shadow: inset 0 0 0 .2rem #d93025;
}

.formcheck__box.is-error {
    outline: .2rem solid #d93025;
    outline-offset: .2rem;
}

.mvform__input:focus-visible,
.bigform__input:focus-visible,
.formcheck__box:focus-visible {
    outline: .2rem solid var(--blue);
    outline-offset: .2rem;
}

/* MV内のフォームは --u でスケールさせる */
.mv .formmsg {
    margin-top: calc(var(--u) * 4);
    font-size: calc(var(--u) * 13);
    line-height: 1.3;
}

.mv .formmsg--c {
    margin-top: calc(var(--u) * 8);
}

.mv .mvform__input.is-error {
    box-shadow: inset 0 0 0 calc(var(--u) * 2) #d93025;
}

/* =========================================================
   日付ピッカー（発電開始年月日）
   ========================================================= */
.datefield {
    padding-right: 3.4rem !important;
    background-image: url("data:image/svg+xml;charset=utf8,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23ff7300' stroke-width='2' stroke-linecap='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 1rem center;
    background-size: 2rem 2rem;
    cursor: pointer;
}

.mv .datefield {
    padding-right: calc(var(--u) * 26) !important;
    background-position: right calc(var(--u) * 6) center;
    background-size: calc(var(--u) * 16) calc(var(--u) * 16);
}

.dp {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9999;
    width: 30rem;
    padding: 1.2rem;
    background: #fff;
    border: .1rem solid var(--gray);
    border-radius: 1rem;
    box-shadow: 0 .8rem 2.4rem rgba(0, 0, 0, .22);
    font-size: 1.4rem;
    text-align: center;
    box-sizing: border-box;
    /* スマホでのダブルタップ拡大待ちを無くし、タップ判定を速くする */
    touch-action: manipulation;
}

.dp[hidden] {
    display: none;
}

.dp__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: .6rem;
    margin-bottom: .8rem;
}

.dp__nav {
    flex: none;
    width: 3rem;
    height: 3rem;
    padding: 0;
    border: none;
    border-radius: .6rem;
    background: var(--beige);
    position: relative;
}

.dp__nav::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: .9rem;
    height: .9rem;
    border-top: .2rem solid var(--o);
    border-right: .2rem solid var(--o);
}

.dp__nav--prev::before {
    transform: translate(-30%, -50%) rotate(-135deg);
}

.dp__nav--next::before {
    transform: translate(-70%, -50%) rotate(45deg);
}

.dp__nav:disabled {
    opacity: .3;
    cursor: not-allowed;
}

.dp__sels {
    display: flex;
    gap: .6rem;
}

.dp__sels select {
    height: 3rem;
    padding: 0 .6rem;
    border: .1rem solid var(--gray);
    border-radius: .6rem;
    background: #fff;
    font-size: 1.5rem;
    font-weight: 700;
    cursor: pointer;
}

.dp__table {
    width: 100%;
    table-layout: fixed;
}

.dp__wd {
    padding-bottom: .4rem;
    font-size: 1.2rem;
    font-weight: 700;
    color: #767676;
}

.dp__wd--sun {
    color: #d93025;
}

.dp__wd--sat {
    color: #1a73e8;
}

.dp__cell {
    padding: .1rem;
}

.dp__day {
    width: 100%;
    height: 3.4rem;
    padding: 0;
    border: none;
    border-radius: .6rem;
    background: none;
    font-size: 1.5rem;
    line-height: 1;
    color: var(--ink);
}

.dp__day--sun {
    color: #d93025;
}

.dp__day--sat {
    color: #1a73e8;
}

.dp__day:hover:not(:disabled) {
    background: var(--beige);
}

.dp__day:focus-visible {
    outline: .2rem solid var(--blue);
    outline-offset: -.2rem;
}

.dp__day.is-today {
    box-shadow: inset 0 0 0 .2rem var(--beige);
    font-weight: 700;
}

.dp__day.is-selected {
    background: var(--o);
    color: #fff;
    font-weight: 700;
    box-shadow: none;
}

.dp__day:disabled {
    opacity: .3;
    cursor: not-allowed;
}

.dp__foot {
    display: flex;
    justify-content: center;
    gap: .8rem;
    margin-top: .8rem;
    padding-top: .8rem;
    border-top: .1rem solid var(--gray);
}

.dp__btn {
    padding: .6rem 1.6rem;
    border: .1rem solid var(--gray);
    border-radius: 99rem;
    background: #fff;
    font-size: 1.4rem;
    font-weight: 700;
}

.dp__btn--today {
    border-color: var(--o);
    color: var(--o);
}

/* =========================================================
   content01 なぜ「今」売却するのが一番得なのか？
   ========================================================= */
.c01 {
    padding: 9rem 0 10.2rem;
    /* 方眼のマス目が画面幅で歪まないよう等倍タイリング */
    background: url(../img/content01_bg_PC.jpg) repeat center top / auto;
}

.c01__head {
    margin-bottom: 6.9rem;
}

.point {
    position: relative;
    min-height: 43.3rem;
    padding: 2rem 0;
    display: flex;
    align-items: center;
    box-sizing: border-box;
}

.point::before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    background: var(--beige);
    z-index: 0;
}

/* センタリングした1200pxコンテンツの左端から908px 伸びる形状 */
.point--l::before {
    left: -.1rem;
    right: calc(50% - 30.8rem);
    border-radius: 0 99rem 99rem 0;
}

.point--r::before {
    right: -.1rem;
    left: calc(50% - 30.8rem);
    border-radius: 99rem 0 0 99rem;
}

.point+.point {
    margin-top: 4.6rem;
}

.point__inner {
    position: relative;
    z-index: 1;
    width: 120rem;
    margin: 0 auto;
}

.point__body {
    width: 61.2rem;
}

.point--l .point__body {
    margin-left: 3.9rem;
}

.point--r .point__body {
    margin-left: auto;
    margin-right: 3.9rem;
}

.point__num {
    display: inline-block;
    min-width: 10.9rem;
    padding: 0 1rem;
    height: 4rem;
    line-height: 4rem;
    border-radius: 2rem;
    background: var(--o);
    color: #fff;
    font-size: 2.4rem;
    font-weight: 700;
    letter-spacing: .06em;
    box-sizing: border-box;
}

.point__ttl {
    margin-top: .8rem;
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.25;
}

.point__txt {
    margin-top: 1.1rem;
    padding-top: 3.5rem;
    border-top: .4rem dotted var(--o);
    font-size: 2.4rem;
    line-height: 1.5;
}

.point__txt strong {
    color: var(--o);
    font-weight: 700;
}

.point__img {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    width: 41.9rem;
    line-height: 0;
}

.point--l .point__img {
    right: 8.2rem;
}

.point--r .point__img {
    left: 9.7rem;
}

.point--l .point__img--tall {
    width: 36rem;
    right: 11.3rem;
}

/* =========================================================
   CTA
   ========================================================= */
.cta {
    background: var(--o);
    padding: 8.3rem 0 7.6rem;
}

.cta__card {
    width: 120rem;
    margin: 0 auto;
    padding: 3.5rem 0 2.8rem;
    background: #fff;
    border-radius: 2rem;
    box-sizing: border-box;
}

.cta__lead {
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.1;
    color: var(--ink);
}

.cta__ttl {
    margin-top: .3rem;
    font-size: 4.6rem;
    font-weight: 700;
    line-height: 1.4;
}

.cta__btn {
    margin-top: 1rem;
}

.cta__btn a {
    display: inline-block;
    width: 77.5rem;
}

.cta__btn img {
    display: block;
    width: 100%;
}

/* 電話／メインCTAボタンのぷよアニメーション（動きを抑えたもの） */
.puyoBtn__area {
    width: 100%;
    height: auto;
    animation: puyoBtn 1.6s ease-in infinite;
    transform-origin: center center;
}

@keyframes puyoBtn {
    0% {
        transform: scale(1.03);
    }

    10% {
        transform: scale(1.03);
    }

    30% {
        transform: scale(1);
    }

    40% {
        transform: scale(1);
    }

    50% {
        transform: scale(1, 1.015);
    }

    60% {
        transform: scale(1.03);
    }

    70% {
        transform: scale(1.007);
    }

    100% {
        transform: scale(1.03);
    }
}

@media (prefers-reduced-motion: reduce) {
    .puyoBtn__area {
        animation: none;
    }
}

/* =========================================================
   content02 中古太陽光発電所の売買市場が拡大中！
   ========================================================= */
.c02 {
    padding: 9rem 0 10.2rem;
    background: var(--beige);
}

.c02__list {
    margin-top: 4.7rem;
    display: flex;
    justify-content: center;
    gap: 2.6rem;
}

.c02__item {
    width: 28rem;
    height: 28rem;
    border-radius: 50%;
    background: #fff;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.c02__item img {
    margin-bottom: 2.7rem;
}

.c02__item--1 img {
    width: 12.4rem;
}

.c02__item--2 img {
    width: 8.9rem;
}

.c02__item--3 img {
    width: 10.7rem;
}

.c02__item--4 img {
    width: 10.8rem;
}

.c02__item p {
    font-size: 3rem;
    font-weight: 500;
    line-height: 1.33;
}

.c02__item strong {
    color: var(--o);
    font-weight: 700;
}

.c02__arrow {
    margin-top: 2.5rem;
    line-height: 0;
}

.c02__arrow img {
    width: 23.6rem;
}

.c02__card {
    position: relative;
    width: 120rem;
    margin: 2.2rem auto 0;
    padding: 3.6rem 35rem 0 0;
    min-height: 21.7rem;
    background: #fff;
    border-radius: 1.6rem;
    box-sizing: border-box;
}

.c02__cardTtl {
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.4;
    color: var(--blue);
}

.c02__cardTxt {
    margin-top: 1.4rem;
    font-size: 2.4rem;
    font-weight: 700;
    line-height: 1.5;
}

.c02__cardTxt span {
    display: block;
    font-size: 2rem;
    font-weight: 500;
}

.c02__cardImg {
    position: absolute;
    right: 4rem;
    bottom: .3rem;
    width: 35.4rem;
    line-height: 0;
}

/* =========================================================
   content03 実績（No.1 / 98%）
   ========================================================= */
/* 月桂冠（No.1／98%）は背景画像に焼き込まれているため等倍・中央固定で配置し、
   1980pxより広い画面はCSSグラデーションで左右を埋める */
.c03 {
    padding: 8.5rem 0 0;
    height: 71.5rem;
    background-image: url(../img/content03_bg_PC.jpg),
        linear-gradient(180deg, #fff 0%, #fffff2 12%, #ffffe6 45%, #ffffdb 72%, #ffffd4 100%);
    background-repeat: no-repeat, no-repeat;
    background-position: center top, center top;
    background-size: 198rem 71.5rem, 100% 100%;
    box-sizing: border-box;
}

.c03__lead {
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.4;
    color: var(--o);
}

.c03__lead::before,
.c03__lead::after {
    content: "";
    display: inline-block;
    width: .4rem;
    height: 4.2rem;
    margin: 0 2rem;
    background: var(--o);
    vertical-align: -.9rem;
}

.c03__lead::before {
    transform: rotate(-30deg);
}

.c03__lead::after {
    transform: rotate(30deg);
}

.c03__ttl {
    margin-top: .6rem;
    font-size: 4.6rem;
    font-weight: 700;
    line-height: 1.4;
}

.c03__award {
    height: 34rem;
}

.c03__note {
    width: 120rem;
    margin: 0 auto;
    font-size: 1.4rem;
    font-weight: 400;
    line-height: 1.35;
    text-align: left;
    box-sizing: border-box;
}

/* =========================================================
   content04 他社よりスピード買取できるワケ
   ========================================================= */
.c04 {
    padding: 9rem 0 10rem;
    background: #fff;
}

.c04__head {
    margin-bottom: 6rem;
}

.c04__chart {
    width: 120rem;
    margin: 0 auto;
    line-height: 0;
}

.c04__boxes {
    position: relative;
    width: 120rem;
    margin: 4.5rem auto 0;
    display: flex;
    justify-content: space-between;
}

.c04__boxes::before {
    content: "";
    position: absolute;
    left: 28.9rem;
    right: 29rem;
    bottom: -4rem;
    height: .3rem;
    background: var(--o);
}

/* 横線の直下に隙間なく接する下向き三角 */
.c04__boxes::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -6.3rem;
    transform: translateX(-50%);
    border-left: 1.4rem solid transparent;
    border-right: 1.4rem solid transparent;
    border-top: 2.3rem solid var(--o);
}

/* SPでのみ表示する背面の矢印（PCはCSS描画の連結線を使用） */
.c04__arrow {
    display: none;
}

.c04__box {
    position: relative;
    z-index: 1;
    width: 57.9rem;
    padding: 3.6rem 5.8rem 3.4rem;
    border: .3rem solid var(--o);
    border-radius: 1.6rem;
    background: #fff;
    box-sizing: border-box;
}

.c04__box::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    width: .3rem;
    height: 4rem;
    background: var(--o);
}

.c04__boxLead {
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 1.4;
}

.c04__boxTtl {
    margin-top: .8rem;
    height: 4.5rem;
    line-height: 4.5rem;
    border-radius: .4rem;
    background: var(--o);
    color: #fff;
    font-size: 3rem;
    font-weight: 700;
}

.c04__boxTxt {
    margin-top: 1.6rem;
    font-size: 2rem;
    line-height: 1.75;
}

.c04__conc {
    margin-top: 10rem;
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.7;
}

.c04__conc mark {
    background: var(--beige);
    color: var(--o);
    padding: 0 .6rem;
}

/* =========================================================
   content05 買取実績（スライダー）
   ========================================================= */
.c05 {
    padding: 9rem 0 10rem;
    background: var(--beige);
}

.c05__ttl {
    margin-bottom: 3.7rem;
}

.slider {
    position: relative;
    width: min(156rem, 100%);
    margin: 0 auto;
}

/* touch-action: pan-y … 横スワイプはJSで処理し、縦スクロールはブラウザに任せる
   user-select / user-drag … PCでのドラッグ操作が選択・画像ドラッグに奪われるのを防ぐ */
.slider__viewport {
    overflow: hidden;
    touch-action: pan-y;
    cursor: grab;
    -webkit-user-select: none;
    user-select: none;
}

.slider__viewport:active {
    cursor: grabbing;
}

.slider__track {
    position: relative;
    display: flex;
    gap: 3rem;
    transition: transform .45s ease;
    will-change: transform;
    touch-action: pan-y;
}

.slider__slide {
    flex: none;
    width: 50rem;
    opacity: .55;
    transition: opacity .45s ease;
    line-height: 0;
}

.slider__slide.is-active {
    opacity: 1;
}

.slider__slide img {
    width: 100%;
    -webkit-user-drag: none;
    -webkit-touch-callout: none;
}

.slider__arrow {
    position: absolute;
    top: 35.1rem;
    width: 5.6rem;
    height: 5.6rem;
    border: none;
    border-radius: 50%;
    background: var(--blue);
    padding: 0;
    z-index: 2;
}

.slider__arrow::before {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    border-top: 1.1rem solid transparent;
    border-bottom: 1.1rem solid transparent;
}

.slider__arrow--prev {
    left: 24.2rem;
}

.slider__arrow--prev::before {
    transform: translate(-60%, -50%);
    border-right: 1.4rem solid #fff;
}

.slider__arrow--next {
    right: 24.2rem;
}

.slider__arrow--next::before {
    transform: translate(-40%, -50%);
    border-left: 1.4rem solid #fff;
}

.slider__dots {
    margin-top: 4.7rem;
    display: flex;
    justify-content: center;
    gap: 2.7rem;
}

.slider__dots button {
    display: block;
    width: 1.5rem;
    height: 1.5rem;
    padding: 0;
    border: none;
    border-radius: 50%;
    background: #b3b3b3;
}

.slider__dots .is-current button {
    background: var(--o);
}

/* =========================================================
   content06 アポロの強み
   ========================================================= */
.c06 {
    padding: 17.3rem 0 10.2rem;
    background: url(../img/content06_bg01_PC.jpg) no-repeat center top / cover;
}

.c06__inner {
    position: relative;
    width: 120rem;
    margin: 0 auto;
}

.c06__tab {
    position: absolute;
    left: 50%;
    top: -6rem;
    transform: translateX(-50%);
    width: 47.2rem;
    height: 7.2rem;
    line-height: 7.2rem;
    border-radius: .8rem;
    background: var(--o);
    color: #fff;
    font-size: 3.6rem;
    font-weight: 700;
    z-index: 2;
}

.c06__tab::after {
    content: "";
    position: absolute;
    left: 50%;
    top: 100%;
    transform: translateX(-50%);
    border-left: 1.4rem solid transparent;
    border-right: 1.4rem solid transparent;
    border-top: 2.5rem solid var(--o);
}

.c06__card {
    padding: 7.1rem 0 5.8rem;
    background: #fff;
    border-radius: 2.4rem;
}

.c06__ttl {
    font-size: 4rem;
    font-weight: 700;
    line-height: 1.4;
}

.c06__ttl span {
    background: linear-gradient(transparent 55%, #fff2a8 55%);
    padding: 0 .4rem;
}

.c06__lead {
    margin-top: 2.8rem;
    font-size: 3.2rem;
    font-weight: 700;
    line-height: 1.25;
    color: var(--o);
}

.c06__medals {
    position: relative;
    margin-top: 3rem;
    display: flex;
    justify-content: center;
    line-height: 0;
}

/* メダル背面の淡い黄色グラデーション（デザインの光彩） */
.c06__medals::before {
    content: "";
    position: absolute;
    left: 50%;
    top: 50%;
    width: 108rem;
    height: 46rem;
    transform: translate(-50%, -50%);
    background: radial-gradient(ellipse closest-side, rgba(255, 243, 165, .92) 0%, rgba(255, 245, 180, .55) 45%, rgba(255, 248, 200, 0) 78%);
    pointer-events: none;
    z-index: 0;
}

.c06__medals img {
    position: relative;
    z-index: 1;
}

.c06__medals img {
    width: 29.7rem;
}

.c06__txt {
    margin-top: 4.1rem;
    font-size: 2rem;
    line-height: 1.75;
}

.c06__txt strong {
    color: var(--o);
    font-weight: 700;
}

.c06__box {
    position: relative;
    width: 108.4rem;
    margin: 6.3rem auto 0;
    min-height: 30.2rem;
    padding: 6rem 0 0;
    background: var(--beige);
    border-radius: 1.6rem;
    overflow: hidden;
    box-sizing: border-box;
}

.c06__boxBody {
    position: relative;
    z-index: 2;
    width: 80rem;
}

.c06__boxTtl {
    display: inline-block;
    padding: 0 3.4rem;
    height: 4.5rem;
    line-height: 4.5rem;
    border-radius: 2.3rem;
    background: var(--o);
    color: #fff;
    font-size: 2.8rem;
    font-weight: 700;
}

.c06__boxTxt {
    margin-top: 1.6rem;
    font-size: 2rem;
    line-height: 1.7;
}

.c06__boxTxt strong {
    color: var(--o);
    font-weight: 700;
    font-size: 2.2rem;
    /* 本文より2px大きく */
}

.c06__boxImg {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 47.4rem;
    line-height: 0;
    z-index: 1;
}

/* =========================================================
   content07 売却までの流れ
   ========================================================= */
.c07 {
    padding: 9rem 0 11.3rem;
    background: #fff;
}

.c07__ttl {
    margin-bottom: 5.8rem;
}

.flow {
    width: 120rem;
    margin: 0 auto;
}

.flow__item {
    position: relative;
    display: flex;
    align-items: center;
    min-height: 18.4rem;
    padding: 2rem 0 2rem 2.8rem;
    background: var(--beige);
    border-radius: 1.6rem;
    box-sizing: border-box;
    text-align: left;
}

.flow__item+.flow__item {
    margin-top: 3.3rem;
}

.flow__item+.flow__item::before {
    content: "";
    position: absolute;
    left: 50%;
    top: -3.3rem;
    transform: translateX(-50%);
    width: .4rem;
    height: 3.3rem;
    background: var(--o);
}

.flow__icon {
    flex: none;
    width: 13.7rem;
    height: 13.7rem;
    border-radius: 50%;
    background: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}

.flow__icon img {
    width: auto;
    max-height: 8.1rem;
}

.flow__body {
    flex: 1 1 auto;
    min-width: 0;
    padding: 0 0 0 3rem;
}

.flow__head {
    display: flex;
    align-items: center;
    gap: .9rem;
}

.flow__step {
    display: block;
    min-width: 13.6rem;
    height: 4rem;
    line-height: 4rem;
    border-radius: 2rem;
    background: var(--o);
    color: #fff;
    font-size: 2.2rem;
    font-weight: 700;
    letter-spacing: .04em;
    text-align: center;
}

.flow__ttl {
    font-size: 3.2rem;
    font-weight: 700;
}

.flow__txt {
    margin-top: 1.4rem;
    font-size: 2rem;
    line-height: 1.6;
}

/* 注記はフローに影響させず、見出しをボックスの上下中央に保つ */
.flow__note {
    position: absolute;
    right: 0;
    bottom: 1rem;
    font-size: 1.4rem;
    font-weight: 400;
    text-align: right;
}

/* =========================================================
   content08 売却オーナー様のお声
   ========================================================= */
.c08 {
    padding: 7.4rem 0 10rem;
    background: var(--beige);
}

.c08__ttl {
    margin-bottom: 5.4rem;
}

.voice {
    width: 120rem;
    margin: 0 auto;
}

.voice__item {
    display: flex;
    align-items: flex-start;
    padding: 0 10rem;
    gap: 2.8rem;
}

.voice__item+.voice__item {
    margin-top: 2.7rem;
}

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

.voice__person {
    flex: none;
    width: 15.5rem;
}

.voice__person img {
    width: 15.5rem;
}

.voice__name {
    margin-top: 1.8rem;
    font-size: 2rem;
    font-weight: 700;
    color: var(--o);
    white-space: nowrap;
}

.voice__bubble {
    position: relative;
    width: 77.7rem;
    flex: none;
    min-height: 18.8rem;
    padding: 2rem 6rem;
    background: #fff;
    border-radius: 1.6rem;
    box-sizing: border-box;
    text-align: left;
    display: flex;
    align-items: center;
}

.voice__bubble p {
    font-size: 1.8rem;
    line-height: 1.95;
}

.voice__bubble::before {
    content: "";
    position: absolute;
    top: 9.8rem;
    border-top: 1.4rem solid transparent;
    border-bottom: 1.4rem solid transparent;
}

.voice__item:not(.voice__item--r) .voice__bubble::before {
    left: -2.4rem;
    border-right: 2.5rem solid #fff;
}

.voice__item--r .voice__bubble::before {
    right: -2.4rem;
    border-left: 2.5rem solid #fff;
}

/* =========================================================
   content09 よくあるご質問
   ========================================================= */
.c09 {
    padding: 9.1rem 0 5rem;
    background: #fff;
}

.c09__ttl {
    margin-bottom: 4.5rem;
}

.faq {
    width: 100rem;
    margin: 0 auto;
    text-align: left;
}

.faq__q {
    display: flex;
    align-items: center;
    min-height: 7.6rem;
    padding: 1.4rem 3.2rem;
    background: #c4e6ff;
    border-radius: 1rem;
    font-size: 2.6rem;
    font-weight: 700;
    line-height: 1.4;
    box-sizing: border-box;
}

.faq__mark {
    flex: none;
    margin-right: .8rem;
}

.faq__a {
    padding: 3.1rem 3.2rem 3.7rem;
    font-size: 2rem;
    line-height: 1.8;
}

/* =========================================================
   content10 買取金額無料シミュレーション
   ========================================================= */
.c10 {
    padding: 9rem 0 10.5rem;
    background: var(--o);
}

.c10__head {
    position: relative;
    width: 100rem;
    margin: 0 auto;
}

.c10__badge {
    position: absolute;
    left: 6rem;
    top: .5rem;
    width: 10.5rem;
    height: 10.5rem;
    border-radius: 50%;
    background: #fdf1dd;
    color: var(--o);
    font-size: 1.9rem;
    font-weight: 700;
    line-height: 1.35;
    display: flex;
    align-items: center;
    justify-content: center;
}

.c10__lead {
    font-size: 4.2rem;
    font-weight: 700;
    line-height: 1.4;
    color: #fff;
}

.c10__lead::before,
.c10__lead::after {
    content: "";
    display: inline-block;
    width: .4rem;
    height: 4.4rem;
    margin: 0 1.6rem;
    background: #fff;
    vertical-align: -.9rem;
}

.c10__lead::before {
    transform: rotate(-30deg);
}

.c10__lead::after {
    transform: rotate(30deg);
}

.c10__ttl {
    margin-top: .2rem;
    font-size: 4.6rem;
    font-weight: 700;
    line-height: 1.4;
    letter-spacing: -.02em;
    color: #fff;
}

.c10__card {
    width: 100rem;
    margin: 3.5rem auto 0;
    padding: 6rem 5rem 4.9rem;
    background: #fff;
    border-radius: 2.4rem;
    box-sizing: border-box;
}

.bigform {
    text-align: left;
}

.bigform__row {
    display: flex;
    align-items: center;
    margin-bottom: 2rem;
}

.bigform__row--area {
    align-items: flex-start;
    margin-bottom: 3.5rem;
}

.bigform__label {
    width: 16.5rem;
    flex: none;
    font-size: 2.2rem;
    font-weight: 700;
    line-height: 1.4;
}

.bigform__input {
    width: 100%;
    height: 5.5rem;
    padding: 0 1.2rem;
    border: none;
    border-radius: .4rem;
    background: var(--beige-l);
    font-family: inherit;
    font-size: 2.2rem;
    color: var(--ink);
    box-sizing: border-box;
}

.bigform__textarea {
    height: 19.5rem;
    padding: 1.2rem;
    line-height: 1.6;
    resize: vertical;
}

.bigform__submit {
    margin-top: 2.1rem;
    text-align: center;
}

.req:not(.req--v) {
    width: 3.8rem;
    height: 2.2rem;
    margin: 0 2.4rem 0 0;
    font-size: 1.4rem;
}

.formcheck--c {
    font-size: 2rem;
}

.formcheck--c .formcheck__box {
    width: 1.8rem;
    height: 1.8rem;
}

/* =========================================================
   footer
   ========================================================= */
.footer {
    padding: 5.7rem 0 6rem;
    background: #fff;
}

.footer__ttl {
    font-size: 2rem;
    font-weight: 700;
    color: var(--blue);
}

.footer__box {
    width: 95rem;
    margin: .7rem auto 0;
    padding: 2.4rem 0 2.2rem 18.6rem;
    background: var(--gray);
    border-radius: 1rem;
    text-align: left;
    font-size: 1.8rem;
    line-height: 1.4;
    box-sizing: border-box;
}

.footer__box a {
    text-decoration: none;
}

.footer__links {
    margin-top: 2.8rem;
    display: flex;
    justify-content: center;
    gap: 4.8rem;
}

.footer__links a {
    display: inline-block;
    padding-bottom: .8rem;
    border-bottom: .2rem solid var(--blue);
    color: var(--blue);
    font-size: 1.8rem;
    font-weight: 700;
}

.footer__links a::before {
    content: ">";
    margin-right: 1.4rem;
    font-weight: 500;
}

/* =========================================================
   下層ページ（プライバシーポリシー／免責事項）
   ========================================================= */
.page {
    padding: 8rem 0 12rem;
    background: #fff;
}

.page__inner {
    width: 100rem;
    margin: 0 auto;
    text-align: left;
}

.page__ttl {
    margin-bottom: 6rem;
    font-size: 4.6rem;
    font-weight: 700;
    text-align: center;
}

.page__lead {
    font-size: 2.4rem;
    line-height: 1.9;
}

.page__h3 {
    margin-top: 4.6rem;
    margin-bottom: 1.2rem;
    padding-left: 1.6rem;
    border-left: .6rem solid var(--o);
    font-size: 2.8rem;
    font-weight: 700;
    line-height: 1.4;
}

.page__txt {
    font-size: 2.2rem;
    line-height: 1.9;
}

.page__list {
    margin-top: 1rem;
    padding-left: 2.6rem;
    font-size: 2.2rem;
    line-height: 1.9;
    list-style: disc;
}

.page__back {
    margin-top: 8rem;
    text-align: center;
}

.page__back a {
    display: inline-block;
    padding: 1.6rem 4rem;
    border: .2rem solid var(--o);
    border-radius: 99rem;
    color: var(--o);
    font-size: 2.2rem;
    font-weight: 700;
}

.pageheader {
    padding: 3rem 0;
    border-bottom: .2rem solid var(--beige);
}

.pageheader a {
    font-size: 2.6rem;
    font-weight: 700;
}

/* ---------- 入力内容確認 / サンクス ---------- */
.confirm {
    margin-top: 4rem;
    border-top: .1rem solid var(--gray);
}

.confirm__ttl {
    padding: 2.4rem 2rem .6rem;
    font-size: 2rem;
    font-weight: 700;
    color: var(--o);
}

.confirm__val {
    padding: 0 2rem 2.4rem;
    border-bottom: .1rem solid var(--gray);
    font-size: 2.2rem;
    line-height: 1.7;
    word-break: break-all;
}

.confirm__btns {
    margin-top: 5rem;
    text-align: center;
}

.confirm__back {
    margin-top: 3.4rem;
    font-size: 2rem;
}

.confirm__back a {
    color: var(--blue);
    text-decoration: underline;
}

p.confirm__back a {
    background: #b3b3b3;
    color: #fff;
    text-decoration: none;
    padding: 10px 30px;
    border-radius: 100px;
}

.formerr {
    margin-bottom: 3rem;
    padding: 2.4rem 2.8rem;
    border: .2rem solid #d93025;
    border-radius: .8rem;
    background: #fdf1f0;
    color: #c5221f;
    font-size: 2.2rem;
    line-height: 1.7;
    list-style: disc inside;
}

.formerr--single {
    list-style: none;
}

.thanks__lead {
    text-align: center;
}

/* =========================================================
   SP（768px以下）
   ========================================================= */
@media screen and (max-width: 768px) {

    html {
        font-size: calc(100vw / 75);
        /* 1rem = 10px @750px */
    }

    .l-page {
        min-width: 0;
    }

    .u-pc {
        display: none;
    }

    .u-sp {
        display: block;
    }

    .br-sp {
        display: inline;
    }

    /* SPでは本文のPC用改行を解除して自然に折り返す */
    .flow__txt br,
    .c02__cardTxt span br {
        display: none;
    }

    /* ---------- 共通見出し ---------- */
    .ttl-lead {
        font-size: 4.6rem;
        line-height: 1.2;
    }

    .ttl {
        font-size: 5.6rem;
        line-height: 1.45;
    }

    /* ---------- MV ---------- */
    .mv {
        --u: calc(100vw / 750);
    }

    .mvform {
        left: 6.667%;
        top: 41.78%;
        width: 86.533%;
        padding: calc(var(--u) * 33) calc(var(--u) * 35) calc(var(--u) * 48) calc(var(--u) * 38);
        border-radius: calc(var(--u) * 20);
    }

    .mvform__badge {
        display: none;
    }

    .mvform__ttl {
        padding-left: 0;
        font-size: calc(var(--u) * 36);
        line-height: 1.2;
    }

    .mvform__form {
        margin-top: calc(var(--u) * 10);
        padding-top: calc(var(--u) * 42);
        border-top-width: calc(var(--u) * 4);
    }

    .mvform__row {
        min-height: 0;
        margin-bottom: calc(var(--u) * 20);
    }

    .mvform__row--area {
        margin-bottom: calc(var(--u) * 40);
    }

    .mvform__label {
        width: calc(var(--u) * 140);
        font-size: calc(var(--u) * 23);
        line-height: 1.25;
    }

    .mvform__input {
        height: calc(var(--u) * 78);
        padding: 0 calc(var(--u) * 14);
        border-radius: calc(var(--u) * 6);
        font-size: calc(var(--u) * 28);
    }

    .mvform__textarea {
        height: calc(var(--u) * 80);
        padding: calc(var(--u) * 12) calc(var(--u) * 14);
    }

    .mvform__submit {
        margin-top: calc(var(--u) * 20);
    }

    .mv .req--v {
        width: calc(var(--u) * 25);
        height: calc(var(--u) * 45);
        margin: 0 calc(var(--u) * 7) 0 calc(var(--u) * 5);
        font-size: calc(var(--u) * 18);
        border-radius: calc(var(--u) * 4);
    }

    .mv .req--v>span {
        width: calc(var(--u) * 18);
    }

    .mv .formcheck {
        gap: calc(var(--u) * 10);
        font-size: calc(var(--u) * 28);
    }

    .mv .formcheck__box {
        width: calc(var(--u) * 24);
        height: calc(var(--u) * 24);
    }

    .mv .submitbtn {
        width: calc(var(--u) * 472);
        height: calc(var(--u) * 97);
        border-radius: calc(var(--u) * 10);
        font-size: calc(var(--u) * 38);
    }

    .req {
        font-size: 2rem;
        border-radius: .4rem;
    }

    .formcheck {
        gap: 1rem;
        font-size: 2.8rem;
    }

    .formcheck__box {
        width: 2.4rem;
        height: 2.4rem;
    }

    .submitbtn {
        width: 47.2rem;
        height: 9.7rem;
        border-radius: 1rem;
        font-size: 3.8rem;
    }

    .submitbtn--lg {
        width: 40rem;
        height: 8rem;
        font-size: 3.6rem;
    }

    /* ---------- バリデーション表示 ---------- */
    .formmsg {
        margin-top: 1rem;
        font-size: 2.4rem;
    }

    .formmsg--c {
        margin-top: 1.6rem;
    }

    .mvform__input.is-error,
    .bigform__input.is-error {
        box-shadow: inset 0 0 0 .3rem #d93025;
    }

    .mv .formmsg {
        margin-top: calc(var(--u) * 8);
        font-size: calc(var(--u) * 22);
    }

    .mv .formmsg--c {
        margin-top: calc(var(--u) * 14);
    }

    .mv .mvform__input.is-error {
        box-shadow: inset 0 0 0 calc(var(--u) * 3) #d93025;
    }

    /* ---------- 日付ピッカー ---------- */
    .datefield {
        padding-right: 5.6rem !important;
        background-position: right 1.6rem center;
        background-size: 3.2rem 3.2rem;
    }

    .mv .datefield {
        padding-right: calc(var(--u) * 62) !important;
        background-position: right calc(var(--u) * 14) center;
        background-size: calc(var(--u) * 34) calc(var(--u) * 34);
    }

    .dp {
        width: 46rem;
        padding: 2rem;
        border-radius: 1.6rem;
        font-size: 2.4rem;
    }

    .dp__head {
        gap: 1rem;
        margin-bottom: 1.4rem;
    }

    .dp__nav {
        width: 5.6rem;
        height: 5.6rem;
        border-radius: 1rem;
    }

    .dp__nav::before {
        width: 1.6rem;
        height: 1.6rem;
        border-top-width: .3rem;
        border-right-width: .3rem;
    }

    .dp__sels {
        gap: 1rem;
    }

    .dp__sels select {
        height: 5.6rem;
        padding: 0 1rem;
        border-radius: 1rem;
        font-size: 2.6rem;
    }

    .dp__wd {
        padding-bottom: .8rem;
        font-size: 2.2rem;
    }

    .dp__cell {
        padding: .2rem;
    }

    .dp__day {
        height: 5.6rem;
        border-radius: 1rem;
        font-size: 2.6rem;
    }

    .dp__day.is-today {
        box-shadow: inset 0 0 0 .3rem var(--beige);
    }

    .dp__foot {
        gap: 1.4rem;
        margin-top: 1.4rem;
        padding-top: 1.4rem;
    }

    .dp__btn {
        padding: 1rem 2.8rem;
        font-size: 2.4rem;
    }

    /* ---------- content01 ---------- */
    .c01 {
        padding: 12.9rem 0 34.8rem;
        background-image: url(../img/content01_bg_SP.jpg);
        background-repeat: no-repeat;
        background-size: 100% 100%;
    }

    .c01__head {
        width: 86.667%;
        margin: 0 auto 7.6rem;
    }

    .c01__head .ttl {
        margin-top: 1.1rem;
    }

    .point {
        display: block;
        min-height: 0;
        padding: 6.2rem 0 25.9rem;
    }

    .point--l::before {
        left: -.1rem;
        right: 6.667%;
        border-radius: 0 14rem 14rem 0;
    }

    .point--r::before {
        right: -.1rem;
        left: 6.533%;
        border-radius: 14rem 0 0 14rem;
    }

    .point+.point {
        margin-top: 26.5rem;
    }

    .point__inner {
        width: auto;
    }

    .point--l .point__inner {
        padding: 0 9.5rem 0 4.5rem;
    }

    .point--r .point__inner {
        padding: 0 4.5rem 0 9.4rem;
        display: flex;
        flex-direction: column-reverse;
        /* SPは 本文 → 画像 の順で表示 */
    }

    .point__body,
    .point--l .point__body,
    .point--r .point__body {
        width: auto;
        margin: 0;
    }

    .point__num {
        min-width: 11.2rem;
        height: 4.6rem;
        line-height: 4.6rem;
        border-radius: 2.3rem;
        font-size: 3rem;
    }

    .point__ttl {
        margin-top: 2.7rem;
        font-size: 4.6rem;
        line-height: 1.3;
    }

    .point__txt {
        margin-top: 2.2rem;
        padding-top: 3.1rem;
        font-size: 3.6rem;
        line-height: 1.53;
    }

    .point__img,
    .point--l .point__img,
    .point--r .point__img {
        position: absolute;
        top: 100%;
        left: 50%;
        right: auto;
        transform: translateX(-50%);
        width: 53.3rem;
        margin: 5rem 0 0;
    }

    .point--l .point__img--tall {
        width: 45.7rem;
        right: auto;
    }

    /* ---------- CTA ---------- */
    .cta {
        padding: 8rem 0;
    }

    .cta__card {
        width: 90%;
        padding: 3.7rem 0;
        border-radius: 2rem;
    }

    .cta__lead {
        font-size: 4.4rem;
    }

    .cta__ttl {
        margin-top: 1rem;
        font-size: 5.4rem;
        line-height: 1.35;
    }

    .cta__btn {
        margin-top: 3rem;
    }

    .cta__btn a {
        width: 63.1rem;
    }

    /* ---------- content02 ---------- */
    .c02 {
        padding: 11.9rem 0 25rem;
    }

    .c02__list {
        flex-wrap: wrap;
        gap: 2.8rem;
        width: 64.8rem;
        margin: 5.4rem auto 0;
    }

    .c02__item {
        width: 31rem;
        height: 31rem;
    }

    .c02__item--1 {
        order: 1;
    }

    .c02__item--2 {
        order: 2;
    }

    .c02__item--3 {
        order: 3;
    }

    .c02__item--4 {
        order: 4;
    }

    .c02__item img {
        margin-bottom: 1.6rem;
    }

    .c02__item--1 img {
        width: 13.4rem;
    }

    .c02__item--2 img {
        width: 9.8rem;
    }

    .c02__item--3 img {
        width: 12.1rem;
    }

    .c02__item--4 img {
        width: 12rem;
    }

    .c02__item p {
        font-size: 3.2rem;
    }

    .c02__arrow {
        margin-top: 3.8rem;
    }

    .c02__arrow img {
        width: 30.6rem;
    }

    .c02__card {
        width: 86.667%;
        margin-top: 3.6rem;
        padding: 6rem 4rem 25.3rem;
        min-height: 0;
    }

    .c02__cardTtl {
        font-size: 4.6rem;
        line-height: 1.3;
    }

    .c02__cardTxt {
        margin-top: 2.9rem;
        font-size: 3.8rem;
        line-height: 1.55;
    }

    .c02__cardTxt span {
        font-size: 3.4rem;
        line-height: 1.68;
    }

    .c02__cardImg {
        left: 50%;
        right: auto;
        bottom: -13.7rem;
        transform: translateX(-50%);
        width: 50.3rem;
        margin: 0;
    }

    /* ---------- content03 ---------- */
    .c03 {
        height: 154.2rem;
        padding: 12.8rem 0 0;
        background-image: url(../img/content03_bg_SP.jpg);
        background-size: 100% 100%, 100% 100%;
    }

    .c03__lead {
        font-size: 4.4rem;
    }

    .c03__lead::before,
    .c03__lead::after {
        height: 4.6rem;
        margin: 0 2.2rem;
    }

    .c03__ttl {
        margin-top: 1.1rem;
        font-size: 5.6rem;
        line-height: 1.45;
    }

    .c03__award {
        height: 82.1rem;
    }

    .c03__note {
        width: 65rem;
        font-size: 2rem;
        line-height: 1.3;
    }

    /* ---------- content04 ---------- */
    .c04 {
        padding: 12.8rem 0 11.9rem;
    }

    .c04__head {
        margin-bottom: 7.1rem;
    }

    .c04__head .ttl {
        margin-top: 2.2rem;
    }

    .c04__chart {
        width: 65rem;
    }

    .c04__boxes {
        width: 65rem;
        margin-top: 6.7rem;
        display: block;
    }

    /* SPは content04_img.png の矢印をボックス背面に敷く */
    .c04__boxes::before,
    .c04__boxes::after,
    .c04__box::after {
        display: none;
    }

    .c04__arrow {
        display: block;
        position: absolute;
        left: 50%;
        top: 20.8rem;
        transform: translateX(-50%);
        width: 13rem;
        line-height: 0;
        z-index: 0;
    }

    .c04__arrow img {
        width: 100%;
    }

    .c04__box {
        width: 100%;
        padding: 4.9rem 3rem 2.9rem;
        border-radius: 2rem;
    }

    .c04__box+.c04__box {
        margin-top: 6rem;
    }

    .c04__box:last-child::after {
        display: none;
    }

    .c04__box::after {
        height: 6rem;
        width: .4rem;
    }

    .c04__boxLead {
        font-size: 3.6rem;
        line-height: 1.4;
    }

    .c04__boxTtl {
        margin-top: 1.9rem;
        height: 6.7rem;
        line-height: 6.7rem;
        border-radius: .6rem;
        font-size: 4rem;
    }

    .c04__boxTxt {
        margin-top: 2.1rem;
        font-size: 3.4rem;
        line-height: 1.6;
    }

    .c04__conc {
        width: 65rem;
        margin: 12.7rem auto 0;
        font-size: 4rem;
        line-height: 1.6;
    }

    /* ---------- content05 ---------- */
    .c05 {
        padding: 11.6rem 0 13.2rem;
    }

    .c05__ttl {
        margin-bottom: 4.5rem;
    }

    .slider {
        width: 59.7rem;
    }

    .slider__track {
        gap: 4rem;
    }

    .slider__slide {
        width: 59.7rem;
    }

    .slider__arrow {
        top: 40.8rem;
        width: 6.8rem;
        height: 6.8rem;
    }

    .slider__arrow--prev {
        left: -5.5rem;
    }

    .slider__arrow--next {
        right: -5.8rem;
    }

    .slider__arrow::before {
        border-top-width: 1.3rem;
        border-bottom-width: 1.3rem;
    }

    .slider__arrow--prev::before {
        border-right-width: 1.7rem;
    }

    .slider__arrow--next::before {
        border-left-width: 1.7rem;
    }

    .slider__dots {
        margin-top: 5.2rem;
        gap: 3.4rem;
    }

    .slider__dots button {
        width: 2.4rem;
        height: 2.4rem;
    }

    /* ---------- content06 ---------- */
    .c06 {
        padding: 16rem 0 10.8rem;
        background-image: url(../img/content06_bg01_SP.jpg);
    }

    .c06__inner {
        width: 90.667%;
    }

    .c06__tab {
        top: -4.8rem;
        width: 53rem;
        height: 8.6rem;
        line-height: 8.6rem;
        border-radius: 1.2rem;
        font-size: 5rem;
    }

    .c06__tab::after {
        border-left-width: 2rem;
        border-right-width: 2rem;
        border-top-width: 2.8rem;
    }

    .c06__card {
        padding: 9rem 4rem 9.9rem;
        border-radius: 3rem;
    }

    .c06__ttl {
        font-size: 5.2rem;
        line-height: 1.3;
    }

    .c06__lead {
        margin-top: 3rem;
        font-size: 4rem;
        line-height: 1.4;
    }

    .c06__medals {
        margin-top: 4rem;
    }

    .c06__medals::before {
        width: 72rem;
        height: 40rem;
    }

    .c06__medals img {
        width: 30rem;
    }

    .c06__txt {
        margin-top: 4rem;
        font-size: 3.6rem;
        line-height: 1.6;
    }

    .c06__box {
        width: 100%;
        margin-top: 6rem;
        min-height: 0;
        padding: 3.5rem 3rem 7.5rem;
        border-radius: 2rem;
    }

    .c06__boxBody {
        width: auto;
    }

    .c06__boxTtl {
        padding: 1.7rem 11rem;
        height: auto;
        line-height: 1.3;
        border-radius: 1.2rem;
        font-size: 4.4rem;
    }

    .c06__boxTxt {
        margin-top: 3.7rem;
        font-size: 3.4rem;
        line-height: 1.6;
        text-shadow: 4px 4px 4px #fff1c8, -4px -4px 4px #fff1c8, -4px 4px 4px #fff1c8, 4px -4px 4px #fff1c8, 4px 0 4px #fff1c8, -4px 0 4px #fff1c8, 0 4px 4px #fff1c8, 0 -4px 4px #fff1c8;
    }

    .c06__boxTxt strong {
        font-size: 3.6rem;
        /* 本文より2px大きく */
    }

    /* SPはテキストの背面に敷く（右側はボックスでトリミング） */
    .c06__boxImg {
        left: 50%;
        right: auto;
        bottom: 0;
        transform: translateX(-50%);
        width: 66.7rem;
        margin: 0;
    }

    /* ---------- content07 ---------- */
    .c07 {
        padding: 11.9rem 0 14rem;
    }

    .c07__ttl {
        margin-bottom: 7.5rem;
    }

    .flow {
        width: 86.667%;
    }

    .flow__item {
        display: block;
        min-height: 0;
        padding: 4rem 4rem 4.4rem;
        border-radius: 2rem;
    }

    .flow__item+.flow__item {
        margin-top: 4.7rem;
    }

    .flow__item+.flow__item::before {
        top: -4.7rem;
        height: 4.7rem;
        width: .6rem;
    }

    .flow__icon {
        width: 14.9rem;
        height: 14.9rem;
        float: left;
        margin-right: 3rem;
    }

    .flow__icon img {
        max-height: 8rem;
    }

    .flow__body {
        padding: 0;
        overflow: visible;
    }

    .flow__head {
        display: block;
        padding-top: 1.4rem;
    }

    .flow__step {
        display: inline-block;
        min-width: 16.4rem;
        height: 4.6rem;
        line-height: 4.6rem;
        border-radius: 2.3rem;
        font-size: 2.8rem;
    }

    .flow__ttl {
        display: block;
        margin-top: 1rem;
        font-size: 4.2rem;
    }

    .flow__txt {
        clear: both;
        margin-top: 2.6rem;
        font-size: 3.2rem;
        line-height: 1.6;
    }

    .flow__note {
        position: static;
        clear: both;
        right: auto;
        bottom: auto;
        margin-top: 2.6rem;
        font-size: 2.2rem;
        text-align: left;
    }

    /* ---------- content08 ---------- */
    .c08 {
        padding: 10.1rem 0 12rem;
    }

    .c08__ttl {
        margin-bottom: 6.3rem;
    }

    .voice {
        width: 86.667%;
    }

    .voice__item,
    .voice__item--r {
        display: block;
        padding: 4rem 4rem 4.6rem;
        background: #fff;
        border-radius: 2rem;
        text-align: left;
    }

    .voice__item+.voice__item {
        margin-top: 4.7rem;
    }

    .voice__person {
        width: auto;
        display: flex;
        align-items: center;
        gap: 3rem;
    }

    .voice__person img {
        width: 20rem;
        flex: none;
    }

    .voice__name {
        margin-top: 0;
        max-width: 24rem;
        font-size: 4rem;
        line-height: 1.3;
        white-space: normal;
        word-break: keep-all;
    }

    .voice__bubble {
        width: auto;
        min-height: 0;
        padding: 5.6rem 0 0;
        background: none;
        border-radius: 0;
        display: block;
    }

    .voice__bubble::before {
        display: none;
    }

    .voice__bubble p {
        font-size: 3.2rem;
        line-height: 1.75;
    }

    /* ---------- content09 ---------- */
    .c09 {
        padding: 12rem 0 5rem;
    }

    .c09__ttl {
        margin-bottom: 6.6rem;
    }

    .faq {
        width: 86.667%;
    }

    .faq__q {
        min-height: 0;
        padding: 2.7rem 3rem;
        border-radius: 1.4rem;
        font-size: 3.4rem;
        line-height: 1.45;
        align-items: flex-start;
    }

    .faq__mark {
        margin-right: 1rem;
    }

    .faq__a {
        padding: 3.6rem 1rem 4.6rem;
        font-size: 3.2rem;
        line-height: 1.7;
    }

    /* ---------- content10 ---------- */
    .c10 {
        padding: 9.9rem 0 14.1rem;
    }

    .c10__head {
        width: 86.667%;
        display: block;
        position: relative;
    }

    .c10__badge {
        position: absolute;
        left: 0;
        top: 5.4rem;
        width: 14.4rem;
        height: 14.4rem;
        background: #fff;
        font-size: 2.8rem;
    }

    .c10__lead {
        font-size: 4rem;
    }

    .c10__lead::before,
    .c10__lead::after {
        height: 4.2rem;
        margin: 0 1.4rem;
    }

    .c10__ttl {
        margin-top: 1.2rem;
        font-size: 5.6rem;
        line-height: 1.25;
        padding-left: 8rem;
    }

    .c10__card {
        width: 86.667%;
        margin-top: 7.5rem;
        padding: 5rem 4.4rem 6.9rem;
        border-radius: 2rem;
    }

    .bigform__row {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        margin-bottom: 2.4rem;
    }

    .bigform__row--area {
        margin-bottom: 4rem;
    }

    .bigform__label {
        width: auto;
        margin-bottom: 2.6rem;
        font-size: 3.2rem;
    }

    .bigform__label br {
        display: none;
    }

    /* ラベル・必須バッジで1行、入力欄で1行に折り返す */
    .bigform__row>.formfield {
        flex: 0 0 100%;
    }

    .bigform__input {
        height: 10.1rem;
        padding: 0 1.6rem;
        border-radius: .6rem;
        font-size: 3rem;
    }

    .bigform__textarea {
        height: 30.3rem;
        padding: 1.6rem;
    }

    .req:not(.req--v) {
        width: 5.4rem;
        height: 3.4rem;
        margin: 0 0 2.6rem 1.2rem;
        font-size: 2.2rem;
    }

    .formcheck--c {
        font-size: 3rem;
    }

    .formcheck--c .formcheck__box {
        width: 2.6rem;
        height: 2.6rem;
    }

    .bigform__submit {
        margin-top: 3.6rem;
    }

    .submitbtn--lg {
        width: 47.3rem;
        height: 10rem;
        font-size: 3.8rem;
    }
    /* ---------- footer ---------- */
    .footer {
        padding: 12.5rem 0 16.7rem;
    }

    .footer__ttl {
        font-size: 3.6rem;
        line-height: 1.4;
    }

    .footer__box {
        width: 86.667%;
        margin: 1.9rem auto 0;
        padding: 3.3rem 3.4rem 2.5rem;
        border-radius: 1.4rem;
        font-size: 3rem;
        line-height: 1.47;
    }

    .footer__links {
        display: block;
        width: 86.667%;
        margin: 4.5rem auto 0;
        text-align: left;
    }

    .footer__links li+li {
        margin-top: 2.9rem;
    }

    .footer__links a {
        font-size: 3.2rem;
        padding-bottom: .6rem;
    }

    .footer__links a::before {
        margin-right: 1.8rem;
    }

    /* ---------- 下層ページ ---------- */
    .page {
        padding: 6rem 0 10rem;
    }

    .page__inner {
        width: 86.667%;
    }

    .page__ttl {
        margin-bottom: 5rem;
        font-size: 5.2rem;
    }

    .page__lead {
        font-size: 3.2rem;
    }

    .page__h3 {
        font-size: 3.8rem;
        margin-top: 5rem;
    }

    .page__txt {
        font-size: 3rem;
    }

    .page__list {
        font-size: 3rem;
    }

    .page__back a {
        font-size: 3rem;
        padding: 2rem 5rem;
    }

    .pageheader a {
        font-size: 3.6rem;
    }

    /* 入力内容確認 / サンクス */
    .confirm {
        margin-top: 4rem;
    }

    .confirm__ttl {
        padding: 3rem 1rem .8rem;
        font-size: 2.8rem;
    }

    .confirm__val {
        padding: 0 1rem 3rem;
        font-size: 3rem;
    }

    .confirm__btns {
        margin-top: 6rem;
    }

    .confirm__back {
        margin-top: 6rem;
        font-size: 2.8rem;
    }

    .formerr {
        padding: 3rem;
        border-radius: 1.2rem;
        font-size: 3rem;
    }
}

/* ----------追従CTA---------- */

.follow {
    position: fixed;
    display: block;
    opacity: 0;
    width: 24%;
    height: auto;
    z-index: 10;
    margin: 0 auto;
    bottom: 1%;
    right:1%;
    transition: all 0.3s;}
    
    .follow.is-active{
    opacity: 1;
     pointer-events: static;
}

/* スマホ用 */
@media (max-width: 768px) {
    .follow {
    width: 98%;
    bottom: 1%;
    text-align:center;
        
    }
}