/* --- about専用css --- */
    .mainview img {
        max-width: 1000px;
        width: 100%;
        height: auto;
        display: block;
        margin: 60px auto 0 auto;
    }

    .about-intro {
        text-align: center;
        padding: 80px 20px 62px;
    }

    .about-intro__head {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 24px;
        flex-wrap: nowrap;
        margin: 0 auto 24px;
        max-width: 1000px;
    }

    .about-intro__logo img {
        width: 100px;
        height: auto;
        display: block;
        margin: 0;
    }

    .about-intro__title {
        font-size: 25px;
        line-height: 1.4;
        margin: 0;
        font-weight: 600;
        text-align: left;
    }

    .about-intro__title .accent {
        color: #DE7E02;
        font-size: 30px;
    }

    .about-intro__text {
        font-size: 18px;
        line-height: 2.2;
    }

    .about-intro__text p {
        margin: 0 0 18px;
    }

    .about-intro__text p:last-child {
        margin-bottom: 0;
    }

    /* Timeline section */
    .timeline {
        background: #F7F3EB;
        padding: 80px 0;
    }

    .timeline__inner {
        max-width: 1000px;
        margin: 0 auto;
        padding: 0 20px;
    }

    .timeline__heading {
        text-align: center;
        font-weight: 600;
    }

    .timeline__list {
        list-style: none;
        margin: 0;
        padding: 0;
        position: relative;
    }

    .timeline__item {
        display: flex;
        gap: 16px;
        padding: 16px 0;
        align-items: start;
        position: relative;
    }

    .timeline__img {
        width: 160px;
        margin-top: 14px;
        height: 120px;
        object-fit: cover;
        flex: 0 0 auto;
    }

    /* Hide inline timeline photos by default (PC) */
    .timeline__photo {
        display: none;
    }

    /* timeline gallery hidden by default (PC) */
    .timeline__gallery {
        display: none;
        list-style: none;
        margin: 0;
        padding: 0;
    }

    .timeline__body {
        flex: 1 1 auto;
        padding-left: 12px;
        /* lineとテキストの余白 */
    }

    .timeline__date {
        color: #DE7E02;
        font-size: 18px;
        margin: 2px 0 6px;
        position: relative;
        padding-left: 30px;
        font-weight: 600;
    }

    .timeline__date:before {
        content: '';
        position: absolute;
        left: 0;
        top: 50%;
        width: 13px;
        height: 13px;
        border: 2px solid #DE7E02;
        background: #FFFFFF;
        border-radius: 50%;
        transform: translateY(-50%);
    }

    .timeline__list:before {
        content: none;
    }

    .timeline__item:before {
        content: '';
        position: absolute;
        left: calc(160px + 16px + 6px + 12px);
        /* 画像幅 + ギャップ + 丸中心 + 余白 */
        top: 36px;
        /* 丸の中心に合わせる（微調整可） */
        height: calc(100% + 24px);
        /* 次のアイテムの丸中心まで伸ばす */
        width: 2px;
        background: #EBB877;
    }

    .timeline__item:last-child:before {
        height: calc(100% - 60px);
        /* 最後の行はテキスト末尾に合わせる */
    }

    .timeline__title {
        font-weight: 400;
        font-size: 20px;
        margin: 0 0 0px 27px;
    }

    .timeline__text {
        line-height: 1.9;
        margin: 0 0 0 27px;
    }

    /* Thought section */
    .thought {
        position: relative;
        color: #fff;
        background-image: url('https://gigaplus.makeshop.jp/fukusukecof/img/about/pc/thought.png');
        background-size: cover;
        background-position: center;
    }

    .thought::before {
        content: '';
        position: absolute;
        inset: 0;
    }

    .thought__inner {
        position: relative;
        z-index: 1;
        max-width: 1000px;
        margin: 0 auto;
        padding: 80px 20px;
        text-align: center;
    }

    .thought__title {
        font-size: 28px;
        font-weight: 600;
        margin: 0 0 16px;
    }

    .thought__divider {
        width: 2px;
        height: 30px;
        background: #fff;
        margin: 0 auto 30px;
    }

    .thought__catch {
        font-size: 22px;
        font-weight: 700;
        line-height: 1.8;
        margin: 0 0 18px;
    }

    .thought__text {
        font-size: 16px;
        line-height: 2.2;
    }


    /* add 40px only for these sections */
    .awards h2,
    .media h2,
    .store h2 {
        margin-bottom: 40px;
    }

    /* vertical spacing for specific sections */
    .awards,
    .media,
    .store {
        padding-top: 80px;
    }

    /* ボタン */
    .btn {
        font-family: 'Zen Kaku Gothic New', sans-serif;
        cursor: pointer;
    }

    /* オレンジボタン: テーマの hover グレーを上書き */
    a.btn:hover,
    .btn-container a:hover .btn {
        background-color: #F09A1A !important;
        background-image: none !important;
        border-color: #F09A1A !important;
    }

    .btn-container {
        display: flex;
        justify-content: center;
        align-items: center;
        width: 100%;
        margin-top: 20px;
        margin-bottom: 80px;
    }

    /* store section button spacing */
    .store .btn-container {
        margin-top: 40px;
    }

    /* 画像 */
    .shop-image {
        display: block;
        margin-left: auto;
        margin-right: auto;
        max-width: 100%;
        height: auto;
    }

    /* image sizing for Awards and Media sections */
    .awards .shop-image,
    .media .shop-image {
        width: 100%;
        max-width: 480px;
        height: auto;
        object-fit: cover;
    }

    /* store section image size */
    .store .shop-image {
        width: 100%;
        max-width: 480px;
        height: auto;
        object-fit: cover;
        margin-right: 0;
        /* request: no right margin */
        margin-left: 0;
    }

    /* 店舗情報 */
    .shop-info {
        line-height: 1.6;
    }

    .shop-info-line {
        margin: 0;
        padding: 2px 0;
    }

    .shop-info-line.shopname {
        margin-top: 10px;
        font-size: 20px;
        font-weight: bold;
        line-height: 1.6;
    }

    .shop-info-line.note {
        margin-top: 10px;
        font-size: 0.9em;
    }

    /* レイアウト補助 */
    .product-wrap {
        text-align: center;
    }

    .shop-section {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
        gap: 30px;
    }

    .shop-info {
        max-width: 400px;
        text-align: left;
    }

    /* Awards/Media description spacing */
    .awards .information-list-wrap,
    .media .information-list-wrap {
        margin-top: 40px;
        margin-bottom: 40px;
    }

    /* スマホ対応 */
    @media screen and (max-width: 768px) {

        /* KV (mainview) no padding on SP */
        .contents-section.mainview,
        .mainview {
            padding: 0;
        }

        /* About intro spacing on SP */
        .about-intro {
            padding: 50px 10px;
        }

        .about-intro__title {
            font-size: 20px;
        }

        .about-intro__title .accent {
            font-size: 23px;
        }

        .about-intro__text {
            font-size: 16px;
        }

        .about-intro__head {
            gap: 10px
        }

        .about-intro__logo img {
            width: 70px;
        }

        .shop-info {
            text-align: center;
        }

        .shop-info-line.shopname {
            font-size: 18px;
        }

        /* Mainview: remove side gutters on SP */
        .mainview {
            margin-left: calc(50% - 50vw);
            margin-right: calc(50% - 50vw);
        }

        .mainview picture,
        .mainview img {
            width: 100vw;
            max-width: 100vw;
        }

        .timeline {
            padding: 50px 10px;
        }

        .timeline__inner {
            padding: 0;
        }

        .timeline__body {
            padding-left: 0;
        }

        /* Stack timeline text and show photos at bottom as horizontal slider */
        .timeline__item {
            flex-direction: column;
        }

        .timeline__img {
            display: none;
        }

        /* Align the vertical line directly under the orange dot */
        .timeline__item:before {
            left: 6px;
            /* circle center ≈ 6.5px */
            top: 36px;
            /* start just below the dot */
        }

        /* Disable slider gallery on SP for now */
        .timeline__gallery {
            display: none !important;
        }

        /* Inline timeline photos between date and title */
        .timeline__photo {
            width: calc(100% - 27px);
            /* match text width */
            height: auto;
            display: block;
            margin: 8px 0 12px 27px;
            /* align with text left edge */
        }

        /* Thought section (SP): spacing and background */
        .thought {
            background-image: url('https://gigaplus.makeshop.jp/fukusukecof/img/about/sp/thoughts.png');
            background-size: cover;
            background-position: center;
        }

        .thought__title {
            font-size: 22px;
            margin-bottom: 6px;
        }

        .thought__catch {
            font-size: 20px;
        }

        .thought__text {
            font-size: 16px;
        }

        .thought__inner {
            padding: 50px 0px;
        }

        .bx-wrapper {
            margin-bottom: 0;
        }
    }

    /* Show line break only on SP */
    br.sp-only {
        display: none;
    }

    @media screen and (max-width: 768px) {
        br.sp-only {
            display: inline;
        }

        /* Section spacing for Awards / Media / Store on SP */
        .awards,
        .media,
        .store {
            padding-top: 50px;
            /* 上余白 */
            padding-left: 10px;
            /* 左右余白 */
            padding-right: 10px;
        }

        .btn-container {
            margin-bottom: 20px;
        }
    }