.inner {
    @media (max-width:1200px) {
        width: 92%;
    }
}
.pankuzu {
    display: flex;
    margin-top: 20px;
    font-size: 1.2rem;
    a {
        display: inline-block;
        margin-right: 25px;
        padding: 0 0 3px 0;
        border-bottom: 1px solid #000;
        position: relative;
        &::after {
            content: '';
            display: inline-block;
            width: 6px;
            height: 10px;
            background: url(/about/parts/img/arrow.png) no-repeat;
            margin-left: 7px;
            position: absolute;
            right: -15px;
            top: 1px;            
        }
        @media (hover:hover) {
            &:hover {
                border-color: #e5006c;            
            }
        }
    }
    @

}
.l-pankuzu {
    @media (max-width:1200px) {
        .inner {
            width: 92%;
        }
    }
    @media (max-width:768px) {
        display: none;
    }
}




.c-list-recipes-ambassador {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: min(calc((24 / 1240) * 100vw), 24px);
    @media (max-width:768px) {
        grid-template-columns: auto;
    }
}

.c-list-recipes-ambassador__item {
    a {
        display: block;
        background: #fff;
        overflow: clip;
        filter: drop-shadow(0 0 16px rgba(0,0,0,.1));
    }
    .c-list-recipes-ambassador__item__img {
        aspect-ratio: 350/230;
        img {
            width: 100%;
            height: auto;
        }
    }
    .c-list-recipes-ambassador__item__name {
        padding: 1.2em 1em;
        text-align: center;
        span {
            display: flex;
            justify-content: space-between;
            &::after {
                content: '';
                width: 1em;
                aspect-ratio: 1/1;
                background: url(/shared/img/arrow_b.png) no-repeat left center;
                background-size: contain;
            }
        }
    }
}

.l-section-common {
    padding: 6.4em 0;
    margin: 0 auto;
    &.-recipes {
        background: #efeae6;
        @media (max-width:768px) {
            .inner {
                width: 86%;
            }
        }
    }
    &.-event {
        padding-bottom: 3.2em;
    }
    @media (max-width:768px) {
        padding: 4em 0;
    }
}

h3 {
    font-family: unset;
    font-size: unset;
    text-align: unset;
    &::before {
        display: none;
    }
}

.hl-section-common {
    padding-top: 25px;
    margin-bottom: 20px;
    font-size: min(calc((30 / 1200) * 100vw), 2.4em);
    font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", "Sawarabi Mincho", serif;
    text-align: center;
    position: relative;
    line-height: 1.4;
    &::before {
        content: "";
        display: block;
        width: 56px;
        height: 9px;
        text-align: center;
        background: url(../../shared/img/h3_icon.png) no-repeat;
        background-size: cover;
        position: absolute;
        top: 0;
        right: 0;
        left: 0;
        margin: auto;        
    }
    @media (max-width:768px) {
        font-size: calc((24 / 390) * 100vw);
    }   
}

.l-section-common.-involvement {
    padding: min(calc((72 / 1200) * 100vw), 6em) 0 min(calc((144 / 1200) * 100vw), 12em);
    .inner {
        width: 90%;
        max-width: 1200px;
    }
} 
.p-grid-involvement {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    align-items: flex-start; 
    .c-img {
        position: relative;
        img {
            width: 100%;
            height: auto;
            position: relative;
        }
    }
    .c-text {
        p {
            font-size: min(calc((20 / 1200) * 100vw), 1.2em);
            line-height: 1.74;
            @media (max-width:768px) {
                font-size: calc((14 / 390) * 100vw);
            }
        }
    }
    &:nth-of-type(2n+1) {
        margin-top: min(calc((60 / 1200) * 100vw), 5em);
        .c-text {
            padding-left: min(calc((80 / 1200) * 100vw), 8em);
        }
        .c-img {
            img {
                width: 110%;
                left: -10%;
                box-shadow: min(calc((24 / 1200) * 100vw), 24px) min(calc((24 / 1200) * 100vw), 24px) 0 rgba(239,234,230,.5);
            }
        }
    }
    &:nth-of-type(2n) {
        margin-top: 4em;
        .c-text {
            order: -1;
            padding-right: min(calc((60 / 1200) * 100vw), 5em);
        }
    }
    @media (max-width:768px) {
        grid-template-columns: 1fr;
        padding: 0 1em;
        &:nth-of-type(2n+1) { 
            .c-img {
                img {
                    width: 100%;
                    left: unset;
                }
            }
            .c-text {
                padding: 3em 1em 0;
            }
        }
        &:nth-of-type(2n) {
            margin-top: 1em;
            .c-text {
                order: unset;
                padding: 5em 1em 0;
            }
        }        
    }

}
.hl-involvement {
    font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", "Sawarabi Mincho", serif;    
    font-size: min(calc((30 / 1200) * 100vw), 2.2em);
    padding: 0;
    color: #e5006c;
    position: relative;
    &::before {
        content: '';
        display: block;
        width: 1.2em;
        height: auto;
        margin: unset;
        aspect-ratio: 1/1;
        background: #e98279;
        position: absolute;
        top: -.5em;
        left: -.7em;
        opacity: .4;
        z-index: -1;
    }
    @media (max-width:768px) {
        font-size: calc((22 / 390) * 100vw);
    }
}

.c-grid-mv-ambassador {
    display: grid;
    margin: min(calc((24 / 1200) * 100vw), 24px) auto 0;
    padding-bottom: 2em;
    grid-template-columns: 50% auto;
    align-items: flex-start;
    position: relative;
    .c-text {
        display: flex;
        flex-direction: column;
        justify-content:center;;
        gap: min(calc((70 / 1200) * 100vw), 5em);
        padding: min(calc((42 / 1200) * 100vw), 3em) min(calc((56 / 1200) * 100vw), 4em) 0 0;
        overflow-wrap: break-word; /* 追加 */
        word-break: break-word; /* 追加 */
        .c-label {
            margin-bottom: 1em;
            span {
                display: inline-block;
                background: #000;
                color: #fff;
                padding: .64em 1em;
                font-size: clamp(16.5px, calc((18 / 1200) * 100vw), 1.35em); /* 150%に拡大（11px→16.5px、0.9em→1.35em） */
                white-space: normal; /* 追加：折り返しを許可 */
                overflow-wrap: break-word; /* 追加 */
                word-break: break-word; /* 追加 */
            }
        }
    }
    .c-img {
        img {
            width: 112%;
            min-width: 500px;
            height: auto;
            filter: drop-shadow(8px 8px 24px rgba(0,0,0,.3));
        }
    }
    &::after {
        content: '';
        display: block;
        width: 120vw;
        height: 15%;
        background: #175152;
        position: absolute;
        bottom: 0;
        z-index: -1;
        left: 50%;
        translate: -50% 0;
        rotate: -5deg;
    }
    @media (max-width:768px) {
        margin-top: 3em;
        grid-template-columns: 1fr;
        .c-text {
            padding: 1.5em 0 2em; /* 左右にパディングを追加 */
            gap:2.4em;
            .c-title {
                text-align: center;
            }
        }
        .c-label {
            span {
                font-size: clamp(10px, 3.5vw, 0.8em); /* フォントサイズを調整 */
                padding: .5em 0.8em;
                white-space: normal;
                overflow-wrap: break-word;
                word-break: break-word;
                line-height: 1.4; /* 行間を調整 */
            }
        }
        .hl-ambassador {
            font-size: clamp(24px, 8vw, 2.5em); /* 見出しのフォントサイズを調整 */
            line-height: 1.3;
            span {
                overflow-wrap: break-word;
                word-break: break-word;
            }
        }
        .hl-ambassador {
            font-size: clamp(24px, 8vw, 2.5em); /* 見出しのフォントサイズを調整 */
            line-height: 1.3;
            span {
                overflow-wrap: break-word;
                word-break: break-word;
            }
        }
        .c-img {
            order: -1;
            margin: 0 auto;
            img {
                min-width: unset;
                width: 100%;
                height: auto;
                filter: unset;
            }
        }
        &::after {
            display: none;
        }        
    }
}

.c-list-sns {
    display: flex;
    gap: 1.2em;
    margin-top: 2em;
    @media (max-width:768px) {
        justify-content: end;
        margin-top: 1em;
        img {
            width: 32px;
            height: auto;
        }
    }
}
.hl-ambassador {
    span:not(.c-small) {
        font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", "Sawarabi Mincho", serif;    
        font-size: clamp(48px, calc((60 / 1200) * 100vw), 4.4em);
        letter-spacing: .1em;
        font-weight: normal;
        @media (max-width:768px) {
            font-size: calc((40 / 390) * 100vw);
        }
    }
    span.c-small {
        font-size: clamp(14px, calc((17 / 1200) * 100vw), 1.2em);
        font-weight: normal;
        margin-top: .8em;
        display: block;
    }
}

.c-profile {
    p:not(.hl-profile) {
        line-height: 1.6;
    }
    .hl-profile {
        margin-bottom: .64em;        
        position: relative;
        span {
            display: inline-block;
            background: #fff;
            line-height: 1;
            padding: .4em 1.5em .4em 0;
            position: relative;
            z-index: 2;
        }
        &::before {
            content: '';
            display: block;
            width: 100%;
            height: 1px;
            background: #ccc;
            position: absolute;
            top: 50%;
            z-index: -1;
        }
    }
    @media (max-width:768px) {
        padding: 0 1em;
    }
}

.sec_interview_mv {
    margin-bottom: 8em;
    position: relative;
    overflow-x: clip;
    .inner {
        position: relative;
        z-index: 2;
        @media (max-width:1200px) {
            width: 92%;
        }
    }
   &::after {
        content: '';
        display: block;
        width: 100%;
        height: 40%;
        background: #efeae6;
        position: absolute;
        bottom: -6.4%;
        z-index: -1;
        opacity: .4;
        @media (max-width:768px) {
            height: 50%;
            bottom: -1%;
        }
    }
    .c-lead {
        padding: 0 0 5em;
    }
    @media (max-width:768px) {
        margin-bottom: 4em;
    }
}

.c-grid-lead {
    position: relative;
    display: grid;
    gap: min(calc((120 / 1200) * 100vw), 10em);
    .c-img__left {
        display: flex;
        align-items: flex-start;
        img {
            width: 148%;
            height: auto;
            position: relative;
            left: -16%;
            filter: drop-shadow(4px 4px 16px rgba(0,0,0,.4));
        }
    }
    .c-img__right {
        display: flex;
        align-items: flex-end;        
        img {
            width: 120%;
            height: auto;
            position: relative;
            right: 20%;
            top: 20px;
            box-shadow: 5px 5px 0 #175152;
        }
    }
    .c-text {
        > p {
            font-size: min(calc((20 / 1200) * 100vw), 1.2em);
            line-height: 2;
            @media (max-width:768px) {
                font-size: calc((15 / 390) * 100vw);
            }
        }
        > *+p {
            margin-top: 1em;
        }
    }
    &::after {
        content: '';
        display: block;
        width: 120vw;
        background: #175152;
        position: absolute;
        left: 50%;
        translate: -50% 0;
        top: 0;
        z-index: -1;
        rotate: -5deg;
    }

    &.-lead {
        grid-template-columns: 20% auto ;
        .c-text {
            padding-top: 1.6em;
            color: #fff;
        }
        &::after {
            height: 124%;
            @media (max-width:768px) {
                height: 116%;
            }
        }
        @media (max-width:768px) {
            grid-template-columns: 1fr;
            .c-text {
                padding: 0 1em;
            }
            .c-img__left {
                justify-content: center;
                order: -1;
                img {
                    width: 64%;
                    left: unset;
                    margin-top: calc((-40 / 390) * 100vw);

                }
            }
        }        
    }
    &.-comment {
        grid-template-columns: auto 20%;
        @media (max-width:768px) {
            grid-template-columns: 1fr;
        }
        .c-text {
            @media (max-width:768px) {
                padding: 0 1em;
            }
        }
        .c-img__right {
            @media (max-width:768px) {
                order: -1;
                justify-content: center;
                img {
                    width: 56%;
                    right: unset;
                    margin-top: calc((40 / 390) * 100vw);
                }
            }
        }
    }

    @media (max-width:768px) {
        gap: 2em;

    }
}

.c-box-comment {
    margin: 14em auto 2em;
    padding: min(calc((30 / 1200) * 100vw), 2em) min(calc((48 / 1200) * 100vw), 4em);
    position: relative;
    p {
        font-size: min(calc((24 / 1200) * 100vw), 1.25em);
        line-height: 1.7;
        @media (max-width:768px) {
            font-size: calc((15 / 390) * 100vw);
        }
    }
    &::before {
        content: '';
        display: block;
        width: 2.4em;
        aspect-ratio: 1/1;
        position: absolute;
        top: 0;
        left: 0;
        border-top: 1px solid #175152;
        border-left: 1px solid #175152;
        opacity: .5;
    }
    &::after {
        content: '';
        display: block;
        width: 2.4em;
        aspect-ratio: 1/1;
        position: absolute;
        bottom: 0;
        right: 0;
        border-bottom: 1px solid #175152;
        border-right: 1px solid #175152;    
        opacity: .5;
    }
    @media (max-width:768px) {
        margin-top: 2em;
        padding: 1.5em 1em;
        &::before {
            width: 1.6em;
        }
        &::after {
            width: 1.6em;
        }
    }
}
.hl-comment {
    margin-bottom: 1em;
    font-weight: bold;
    color: #fff;
    font-size: .9em!important;
    span {
        background: #175152;
        display: inline-block;
        padding: .5em 1em;
        @media (max-width:768px) {
            display: block;
            text-align: center;
        }
    }
}

.c-img-list {
    display: flex;
    position: relative;
    top: 2em;
    li {
        position: relative;
        img {
            width: 100%;
            height: auto;
        }        
        &:nth-of-type(1) {
            z-index: 2;
            margin-top: 30%;
            img {
                filter: drop-shadow(2px 2px 8px rgba(0,0,0,.2));
            }
            @media (max-width:768px) {
                margin-top: 16%;
            }
        }
        &:nth-of-type(2) {
            img {
                position: relative;
                width: 112%;
                height: auto;
                right: 12%;
                box-shadow: min(calc((24 / 1200) * 100vw), 24px) min(calc((24 / 1200) * 100vw), 24px) 0 rgba(239,234,230,.5);
            }
        }
    }
}

.c-grid-events {
    margin: min(calc((56 / 1200) * 100vw), 4em) auto 0;
    display: grid;
    grid-template-columns: 1fr;
    gap: min(calc((24 / 1200) * 100vw), 1.6em);
    .c-box-history {
        padding: min(calc((28 / 1200) * 100vw), 2em) min(calc((42 / 1200) * 100vw), 3em);
        background: #f3e0de;
        p {
            font-size: 1.1em;
            line-height: 1.4;
            margin-bottom: 2em;
        }
    }
    @media (max-width:768px) {
        grid-template-columns: 1fr;
        .c-box-history {
            padding: 1.5em;
        }
    }
}
.c-list-events {
    border-top: 1px dotted #a5a5a5;
    font-size: min(calc((20 / 1200) * 100vw), 1.3em);
    counter-reset: name 0;
    margin-right: 1em;
    align-items: center;
    li {
        display: flex;
        align-items: center;
        padding: 1.5em .8em;
        border-bottom: 1px dotted #a5a5a5;
        gap: 1em;
        counter-increment: name 1;
        &::before {
            content: counter(name) '.';
            color: #e5006c;
            font-family: "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "游明朝", YuMincho, "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", "Sawarabi Mincho", serif;
            font-size: min(calc((24 / 1200) * 100vw), 1.4em);
        }
    }
    @media (max-width:768px) {
        margin: 0 0 1em;
        font-size: calc((16 / 390) * 100vw);
        li {
            padding: 1.2em .4em;
            &::before {
                font-size: calc((16 / 390) * 100vw);
            }
        }
    }
}
.c-list-history {
    li {
        display: flex;
        gap: .5em;
        span {
            font-size: 1.1em;
            line-height: 1.2;
        }
        &::before {
            content: '';
            display: block;
            padding-left: 1em;
            height: 1em;
            background: #e5006c;
            border-radius: 50%;
            scale: .5;
        }
    }
    *+li {
        margin-top: 1em;
    }
}

.c-text-center {
    text-align: center;
    margin: 1em auto 2em;
    font-size: 1.2em;
    color: #272332;
    @media (max-width:768px) {
        font-size: calc((15 / 390) * 100vw);
        line-height: 1.7;
    }
}