/* リセットCSS */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}

div#outer {
    max-width: unset;
}

html {
    scroll-behavior: smooth;
}

/* 基本設定 */
body {
    font-family: -apple-system, BlinkMacSystemFont, 
             "Hiragino Sans", "Noto Sans JP", sans-serif;
    background-color: white;
    color: #221815;
    line-height: 1.8;
    overflow-x: hidden;
}

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

.contents {
    width: 100vw;
    overflow-x: hidden;
}

.pc {
    display: block;
}

.sp {
    display: none;
}

/* セクション共通 */
section {
    width: 100%;
    overflow-x: hidden;
}

/* ヒーローセクション */
.hero {
    width: 100vw;
    height: 42.222vw;
    background-image: url('../images/fv.jpg');
    background-size: cover;
    background-position: center;
}

/* アバウトセクション */
.about {
    width: 100vw;
    background-color: rgba(0, 130, 179, 0.04);
    padding: 8.333vw 0;
}

.about__container {
    width: 77.778vw;
    margin: 0 auto;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: flex-start;
}

.about__title {
    color: #943862;
    margin: 0;
    padding: 0;
    font-size: 3.472vw;
    font-weight: 400;
    letter-spacing: 0.3em;
    writing-mode: vertical-rl;
}

.about__text {
    width: 55.556vw;
    font-size: 1.389vw;
    font-weight: 400;
    line-height: 2.4;
    letter-spacing: 0;
}


.o_btn {
    width: 20.764vw;
    height: 5.278vw;
    color: #943862;
    border: 2px solid #943862;
    background-color: transparent;
    display: inline-block;
    font-size: 1.389vw;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 0.08em;
    position: relative;
    text-decoration: none;
    border-radius: 1.111vw;
    padding: 1.667vw 0 1.667vw 5.556vw;
    position: relative;
    margin: 0 auto;
}

.o_btn::after {
    content: '';
    width: 1.667vw;
    height: 1.667vw;;
    position: absolute;
    top: 1.806vw;
    right: 5.556vw;
    background-image: url('../images/arrow.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}


.image-section {
    width: 100vw;
    height: 27.778vw;
    background-image: url('../images/image01.jpg');
    background-size: cover;
    background-position: center;
}

.point {
    width: 100vw;
    background-color: white;
    padding: 11.111vw 0;
}

.point__container {
    width: 77.778vw;
    margin: 0 auto;
    display: flex;
    flex-direction: column;
    gap: 5.556vw;
}

.point__content {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    padding-right: 1.158vw;
}

.point__title {
    writing-mode: vertical-rl;
    font-size: 1.667vw;
    font-weight: 400;
    letter-spacing: 0.3em;
    color: #943862;
    margin: 0 0 5.556vw 0;
    padding: 0;
    padding-top: 10vw;
    position: relative;
}

.point__title::before {
    content: '';
    position: absolute;
    top: 0;
    left: 1.528vw;
    width: 0.069vw;
    height: 8.333vw;
    background-color: #943862;
}

.point__row {
    width: 69.375vw;
    display: flex;
    flex-direction: column;
    gap: 4.444vw;
}

.point__item {
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}

.point__item:nth-child(even) {
    flex-direction: row-reverse;
}

.point__item-image {
    width: 32.083vw;
    height: 20.972vw;
    border-radius: 0.556vw;
    overflow: hidden;
    border: 4px solid #A15176;
}

.point__item-content {
    width: 34.514vw;
    display: flex;
    flex-direction: column;
    gap: 1.667vw;
}

.point__item-title-row {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 1.667vw;
}

.point__item-number {
    font-size: 2.778vw;
    font-weight: 400;
    letter-spacing: 0.3em;
    color: #943862;
}

.point__item-title {
    font-size: 1.667vw;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 0.15em;
    color: black;
}

.point__item-text {
    font-size: 1.25vw;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 0.09em;
}

.product {
    width: 100vw;
    padding: 11.111vw 0;
    background-color: rgba(137, 67, 90, 0.04);
}

.product__container {
    width: 77.778vw;
    margin: 0 auto;
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: flex-start;
}

.product__title {
    writing-mode: vertical-rl;
    font-size: 1.667vw;
    font-weight: 700;
    letter-spacing: 0.3em;
    color: #943862;
    margin: 0 0 5.556vw 0;
    padding: 0;
    padding-top: 10vw;
    position: relative;
}

.product__title::before {
    content: '';
    position: absolute;
    top: 0;
    left: 1.528vw;
    width: 0.069vw;
    height: 8.333vw;
    background-color: #943862;
}

.product__row {
    width: 69.375vw;
    display: flex;
    flex-direction: column;
    gap: 5.556vw;
}

.product__item {
    width: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: flex-start;
}

.product__item:nth-child(even) {
    flex-direction: row-reverse;
}

.product__item-image {
    width: 31.316vw;
    height: 34.028vw;
    border-radius: 0.556vw;
    overflow: hidden;
}

.product__item-content-wrap {
    width: 35.281vw;
    display: flex;
    flex-direction: column;
    gap: 2.778vw;
}

.product__item-content {
    width: 100%;
    display: flex;
    flex-direction: column;
    gap: 1.111vw;
    position: relative;
    padding-top: 3.333vw;
    overflow: visible;
}

.product__item-new {
    position: absolute;
    top: -3.296vw;
    left: 0;
    width: 7.014vw;
    height: 2.222vw;
}

.product__item-title {
    margin: 0;
    padding: 0;
    font-size: 2.222vw;
    font-weight: 400;
    line-height: 1;
    letter-spacing: 0.1125em;
    color: black;
    width: 48.61vw;
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
}

.product__item-title span {
    position: relative;
    display: inline;
    display: inline;
    background-image: linear-gradient(to bottom, transparent 65%, rgba(148, 56, 98, 0.4) 65%);
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: 100%;
    box-decoration-break: clone;
    -webkit-box-decoration-break: clone;
}

.product__item-price-row {
    display: flex;
    align-items: center;
    gap: 1.111vw;
}

.product__item-price {
    font-size: 1.25vw;
    font-weight: 400;
    line-height: 1.6;
    letter-spacing: 0.128em;
}

.product__item-price span {
    font-size: 1.944vw;
}

.product__item-size {
    font-size: 1.111vw;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 0.225em;
}

.product__item-text {
    font-size: 1.25vw;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 0.22em;
}

.product__item-info-row {
    display: flex;
    gap: 1.667vw;
}

.product__item-info-row-first {
    display: flex;
    flex-direction: column;
    gap: 0.556vw;
}

.product__item-info-row-first-item {
    display: flex;
    align-items: center;
    gap: 1.111vw;
}

.product__item-info-row-index {
    width: 8.333vw;
    height: 1.944vw;
    border: 1px solid black;
    border-radius: 0.278vw;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 0.972vw;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 0.285em;
    color: black;
}

.product__item-info-row-text {
    font-size: 1.111vw;
    font-weight: 400;
    line-height: 1.8;
    letter-spacing: 0.25em;
}

.product__item-info-row-text.tight {
    letter-spacing: 0.01em;
}

.product__item-btn {
    width: 20.764vw;
    height: 5.278vw;
    color: white;
    background-color: #943862;;
    display: inline-block;
    font-size: 1.389vw;
    font-weight: 400;
    line-height: 1.4;
    letter-spacing: 0.08em;
    border-radius: 1.111vw;
    text-decoration: none;
    padding: 1.667vw 0 1.667vw 5.556vw;
    position: relative;
}

.product__item-btn::after {
    content: '';
    width: 1.667vw;
    height: 1.667vw;;
    position: absolute;
    top: 1.806vw;
    right: 5.556vw;
    background-image: url('../images/arrow-white.png');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
}

.image-section02 {
    width: 100vw;
    height: 27.778vw;
    background-image: url('../images/image02.jpg');
    background-size: cover;
    background-position: center;
}

/* レスポンシブデザイン */
@media (max-width: 780px) {
    .pc {
        display: none;
    }

    .sp {
        display: block;
    }

    .contents {
        width: 100vw;
    }

    /* セクション共通 */
    section {
        width: 100%;
        overflow-x: hidden;
    }

    /* ヒーローセクション */
    .hero {
        width: 100vw;
        height: 161.333vw;
        background-image: url('../images/sp-fv.jpg');
        background-size: cover;
        background-position: center;
    }

    /* アバウトセクション */
    .about {
        width: 100vw;
        padding: 21.333vw 0;
    }

    .about__container {
        width: 89.333vw;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        gap: 10.667vw;
    }

    .about__title {
        margin: 0;
        padding: 0;
        font-size: 6.4vw;
        writing-mode: horizontal-tb;
    }

    .about__text {
        width: 100%;
        font-size: 5.333vw;
    }


    .o_btn {
        width: 79.733vw;
        height: 20.267vw;
        color: #943862;
        border: 2px solid #943862;
        background-color: transparent;
        display: inline-block;
        font-size: 5.333vw;
        font-weight: 400;
        line-height: 1.4;
        letter-spacing: 0.08em;
        position: relative;
        text-decoration: none;
        border-radius: 4.267vw;
        padding: 6.4vw 0 6.4vw 21.333vw;
        position: relative;
        margin: 0 auto;
    }

    .o_btn::after {
        content: '';
        width: 6.4vw;
        height: 6.4vw;;
        position: absolute;
        top: 6.933vw;
        right: 21.333vw;
        background-image: url('../images/arrow.png');
        background-size: contain;
        background-repeat: no-repeat;
        background-position: center;
    }

    .image-section {
        width: 100vw;
        height: 60vw;
    }

    .point {
        width: 100vw;
        padding: 21.333vw 0;
    }

    .point__container {
        width: 93.333vw;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        gap: 21.333vw;
    }

    .point__content {
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        padding-right: 0;
        gap: 16vw;
    }

    .point__title {
        writing-mode: horizontal-tb;
        font-size: 6.4vw;
        font-weight: 400;
        letter-spacing: 0.3em;
        margin: 0;
        padding: 0;
        padding-left: 24vw;
        position: relative;
    }

    .point__title::before {
        content: '';
        position: absolute;
        top: 5vw;
        left: 0;
        width: 21.333vw;
        height: 0.267vw;
    }

    .point__row {
        width: 93.333vw;
        display: flex;
        flex-direction: column;
        gap: 17.067vw;
    }

    .point__item {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        gap: 10.667vw;
    }

    .point__item:nth-child(even) {
        flex-direction: column;
    }

    .point__item-image {
        width: 93.333vw;
        height: 61.008vw;
    }

    .point__item-content {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 6.4vw;
    }

    .point__item-title-row {
        width: 100%;
        display: flex;
        align-items: center;
        gap: 6.4vw;
    }

    .point__item-number {
        font-size: 9.6vw;
    }

    .point__item-title {
        font-size: 5.333vw;
    }

    .point__item-text {
        font-size: 4.267vw;
    }
               
    .product {
        width: 100vw;
        padding: 21.333vw 0;
    }

    .product__container {
        width: 93.333vw;
        margin: 0 auto;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        gap: 40px;
    }

    .product__title {
        writing-mode: horizontal-tb;
        font-size: 6.4vw;
        font-weight: 700;
        margin: 0;
        padding: 0;
        padding-left: 24vw;
        position: relative;
    }

    .product__title::before {
        content: '';
        position: absolute;
        top: 5vw;
        left: 0;
        width: 21.333vw;
        height: 0.267vw;
    }

    .product__row {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 21.333vw;
    }

    .product__item {
        width: 100%;
        display: flex;
        flex-direction: column;
        justify-content: space-between;
        align-items: flex-start;
        gap: 10vw;
    }
    
    .product__item.sp-new {
        gap: 21.333vw;
    }

    .product__item:nth-child(even) {
        flex-direction: column;
    }

    .product__item-image {
        width: 120.253vw;
        height: 130.667vw;
        width: 93.333vw;
        height: 101.416vw;
    }

    .product__item-content-wrap {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 10.667vw;
    }

    .product__item-content {
        width: 100%;
        display: flex;
        flex-direction: column;
        gap: 2vw;
        padding-top: 11.733vw;
    }

    .sp-wide .product__item-content {
        padding-top: 18vw;
    }

    .product__item-new {
        position: absolute;
        top: -12.656vw;
        left: 0;
        width: 26.933vw;
        height: 8.533vw;
    }

    .product__item-title {
        width: 100%;
        margin: 0;
        padding: 0;
        font-size: 7.467vw;
        line-height: 1.2;
    }

    .product__item-price-row {
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        gap: 1.067vw;
        margin-top: 2.133vw;
    }

    .product__item-price {
        font-size: 4.8vw;
        font-weight: 400;
        line-height: 1.6;
        letter-spacing: 0.128em;
    }

    .product__item-price span {
        font-size: 7.467vw;
    }

    .product__item-size {
        font-size: 4.267vw;
        font-weight: 400;
        line-height: 1.8;
        letter-spacing: 0.225em;
    }

    .product__item-text {
        font-size: 4.8vw;
        font-weight: 400;
        line-height: 1.8;
        letter-spacing: 0.22em;
    }

    .product__item-info-row {
        display: flex;
        flex-direction: column;
        gap: 3.2vw;
    }

    .product__item-info-row-first {
        display: flex;
        flex-direction: column;
        gap: 3.2vw;
    }

    .product__item-info-row-first-item {
        display: flex;
        align-items: flex-start;
        gap: 4.267vw;
    }

    .product__item-info-row-index {
        width: 32vw;
        height: 7.467vw;
        border: 1px solid black;
        border-radius: 1.067vw;
        display: flex;
        justify-content: center;
        align-items: center;
        font-size: 3.733vw;
        font-weight: 400;
        line-height: 1.4;
        letter-spacing: 0.285em;
        color: black;
    }

    .product__item-info-row-text {
       font-size: 3.733vw;
    }

    .product__item-btn {
        width: 79.733vw;
        height: 20.267vw;
        color: white;
        background-color: #943862;;
        display: inline-block;
        font-size: 5.333vw;
        font-weight: 400;
        line-height: 1.4;
        letter-spacing: 0.08em;
        border-radius: 4.267vw;
        text-decoration: none;
        padding: 6.4vw 0 6.4vw 21.333vw;
        position: relative;
    }

    .product__item-btn::after {
        content: '';
        width: 6.4vw;
        height: 6.4vw;;
        position: absolute;
        top: 6.933vw;
        right: 21.333vw;
    }

    .image-section02 {
        width: 384vw;
        height: 106.667vw;
        border: 1px solid gray;
    }
}