:root {
    --bg-primary: #fcefe7;
    --bg-primary-light: #fafafa;
    --bg-accent: #4f4c4a;
    --bg-goods: #737a73;

    --border-primary: #252525;
    --border-light: #c0c0c0;
    --border-gray: #4f4c4a;

    --font-primary: #333333;
    --font-gray: #4f4c4a;
    --font-white: #fff;
    --font-accent: #baa8a2;
}

html {
    scroll-behavior: smooth;
    
}


body {
    font-family: "dnp-shuei-mincho-pr6n", sans-serif;
    font-weight: 400;
    font-style: normal;
    letter-spacing: 0.1em;
    color: var(--font-primary);

    background-color: var(--bg-primary-light);
}

html, body {
    width: 100%;
    overflow-x: hidden;
}

.container {
    width: min(1270px, 100%);
    margin-inline: auto;
    padding-inline: clamp(10px, 5vw, 100px);
    position: relative;
    background: #fafafa;
}

.container::before {
    content: "";
    position: absolute;
    top: 0;
    left: -100vw;
    width: 100vw;
    height: 100%;
    background: #fafafa;
}

.container::after {
    content: "";
    position: absolute;
    top: 0;
    right: -100vw;
    width: 100vw;
    height: 100%;
    background: #fafafa;
}

section {
    margin-bottom: 100px;
    scroll-margin-top: 60px;
}

.section-title {
    display: flex;
    align-items: center;
    justify-content: center;
    font-family: "p22-dearest", serif;
    font-size: 16px;
    font-weight: 500;
    letter-spacing: 0.1em;

    margin-bottom: 80px;
}

.section-title::before,
.section-title::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--border-primary);
}

.section-title::before {
    margin-right: 20px;
}

.section-title::after {
    margin-left: 20px;
}

.goods .section-title::before,
.goods .section-title::after {
    content: "";
    flex: 1;
    height: 1px;
    background: var(--bg-primary);
}


/* ------------------------------------------
    Fade up animation
---------------------------------------------*/
.fade-up {
    opacity: 0;
    transform: translateY(50px);
    transition: opacity 1s ease-in-out, transform 1s ease-in-out;
    /* transition-delay: 0.2s; */
}

.fade-up.show {
    opacity: 1;
    transform: translateY(0);
}