:root {
    --padding-vertical: 10%;
    --padding-vertical-sp: 5%;
    --padding-vertical-num: 0.1;
    --color-primary: #c4ab61;
    --color-medium: #a9a9a9;
    --color-white: #ffffff;
}

html,
body {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
    overflow-x: hidden;
    scroll-behavior: smooth;
    /* background: var(--color-black); */
}


section {
    padding: 80px var(--padding-vertical-sp);
}

.letter-space-wide {
    letter-spacing: .3rem;
}

.line-height-wide {
    line-height: 2.5rem !important;
}

.absolute-center {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}

.color-primary {
    color: var(--color-primary);
}

.bg-primary {
    background-color: var(--color-primary) !important;
}

.bg-medium {
    background-color: var(--color-medium) !important;
}

.must-icon::before {
    content: "必須";
    display: inline-block;
    color: var(--color-white);
    background-color: var(--color-green);
    padding: 0 0.4rem;
    margin-right: 0.4rem;
    font-size: 0.7rem;
}

/** TOP -------------------------------------------*/

.yt-container {
    height: 0;
    padding-bottom: 56.25%;
}

.slide-arrow {
    position: absolute;
    top: 50%;
    z-index: 999;
    width: 20px;
    height: 20px;
    border-top: solid 2px var(--color-primary);
    border-right: solid 2px var(--color-primary);
    margin-top: -10px;
}

.prev-arrow {
    left: 1.5rem;
    transform: rotate(225deg);
}

.next-arrow {
    right: 1.5rem;
    transform: rotate(45deg);
}


@media (min-width: 640px) {
    section {
        padding: 80px var(--padding-vertical);
    }

    .letter-space-wide {
        letter-spacing: .5rem;
    }

    .line-height-wide {
        line-height: 3rem !important;
    }

    .prev-arrow {
        left: 19.5%;
        
    }
    
    .next-arrow {
        right: 19.5%;
    }
}

/** TOP -------------------------------------------*/

/** kiyaku -------------------------------------------*/
.kiyaku {
    height: 400px;

}

/** kiyaku -------------------------------------------*/



@media (min-width: 640px) {

}