﻿@charset "UTF-8";

/*! autoprefixer grid: no-autoplace */
/* ======== _typography ======== */
@media screen and (min-width: 768px) {
    #archive.main-contents .archive__title--brand {
        font-size: 2.8rem;
    }

    #archive.main-contents .archive__title--heading {
        font-size: 4.1rem;
        letter-spacing: 0.01em;
    }

    #archive.main-contents .archive__title {
        font-size: 1.4rem;
        letter-spacing: 0.1em;
        line-height: 1;
    }
}

@media screen and (max-width: 767px) {

    #archive.main-contents .archive__title--heading {
        font-size: calc(49 * (100vw / 750));
    }

    #archive.main-contents .archive__slider .archive__title {
        font-size: calc(24 * (100vw / 750));
        line-height: 1.5;
    }
}

/* ======== _typography ======== */

/* ======== _layout ======== */
#archive.main-contents .archive__slider .swiper-button-next,
#archive.main-contents .archive__slider .swiper-button-prev {
    --swiper-navigation-size: 2.8rem;
    top: 42.5%;
}

#archive.main-contents .archive__slider .swiper-button-prev {
    left: 0;
}

#archive.main-contents .archive__slider .swiper-button-next {
    right: 0;
}

#archive.main-contents .archive__slider .swiper-button-prev.slide-previous::after,
#archive.main-contents .archive__slider .swiper-button-next.slide-next::after {
    content: none;
}

@media screen and (min-width: 768px) {
    #archive.main-contents {
        width: 51rem;
        margin: 0 auto;
        padding: 0 0 14rem 0;
    }

    #archive.main-contents .archive__title--heading {
        margin-top: 2.4rem;
        margin-bottom: 2.4rem;
    }

    #archive.main-contents .archive__slider-wrap {
        overflow: hidden;
    }

    #archive.main-contents .archive__slider {
        position: relative;
        width: 44rem;
        column-gap: 4.2rem;
        margin: 4rem auto 0;
    }

    #archive.main-contents .archive__slider-wrap .archive-wrapper {
        position: relative;
        max-width: 44rem;
        margin: 0 auto;
    }

    #archive.main-contents .archive__slider-wrap .archive-slide {
        margin: 0 2rem;
    }

    #archive.main-contents .archive__slider-wrap figure {
        width: 20rem;
    }

    #archive.main-contents .archive__slider-wrap figcaption {
        margin-top: 2.2rem;
    }
    #archive.main-contents .archive__slider-wrap figcaption .vol {
        display: inline-block;
        font-size: 1.4rem;
        letter-spacing: 0.1em;
    }
    #archive.main-contents .archive__slider-wrap figcaption .num {
        display: inline-block;
        margin: 0 0 0 0;
        font-size: 1.6rem;
        letter-spacing: 0.1em;
    }
}

@media screen and (max-width: 767px) {
    .footer .footer-inner .page-top {
        margin: 0 0 calc(45*(100vw / 750)) calc(645*(100vw / 750));
    }
    #archive.main-contents {
        padding: 0 0 calc(190 * (100vw / 750)) 0;
    }
    #archive.main-contents dl {
        width: 100%;
        border-top: 1px solid #c4c4c4;
        border-bottom: 1px solid #c4c4c4;
        flex-wrap: wrap;
        padding-block: calc(54 * (100vw / 750)) calc(62 * (100vw / 750));
        justify-content: center;
        margin-bottom: calc(200 * (100vw / 750));
    }
    #archive.main-contents .archive__slider-wrap {
        width: 100%;
        max-width: calc(642 * (100vw / 750));
        margin-top: calc(56 * (100vw / 750));
        margin-inline: auto;
        position: relative;
    }

    #archive.main-contents .archive__slider-wrap .archive-slide {
        margin: 0 calc(10*(100vw / 750));
    }

    #archive.main-contents .archive__slider-wrap figure {
        width: calc(311 * (100vw / 750));
    }

    #archive.main-contents .archive__slider-wrap figcaption {
        margin-top: calc(34 * (100vw / 750));
        font-size: calc(30 * (100vw / 750));
    }
    #archive.main-contents .archive__slider-wrap figcaption .vol {
        font-size: calc(24 * (100vw / 750));
        letter-spacing: 0.1em;
    }
    #archive.main-contents .archive__slider-wrap figcaption .num {
        margin: 0 0 0 calc(5 * (100vw / 750));
        font-size: calc(30 * (100vw / 750));
        letter-spacing: 0.1em;
    }
}

/* ======== _layout ======== */

#archive.main-contents .archive__slider-wrap.archive__slider-wrap--single {
    width: 20rem;
    margin: 4rem auto 0;
}

/* ======== _slidercontent ======== */
#archive .slide-arrow.slick-arrow {
    width: 1.5rem;
    height: 4.5rem;
    position: absolute;
    top: 31%;
    z-index: 1;
}

#archive .slide-arrow.slick-arrow:hover {
    cursor: pointer;
}

#archive .slide-arrow.prev-arrow.slick-arrow {
    left: -3.5rem;
}

#archive .slide-arrow.next-arrow.slick-arrow {
    right: -3.5rem;
}

@media screen and (max-width: 767px) {

    #archive.main-contents .archive__slider-wrap.archive__slider-wrap--single {
        width: calc(311 * (100vw / 750));
        margin: calc(60 * (100vw / 750)) auto 0;
    }

    #archive .slide-arrow.slick-arrow {
        margin: 0;
        display: block !important;
        width: calc(25 * (100vw / 750));
        height: calc(80 * (100vw / 750));
        top: calc(120 * (100vw / 750));
        transform: translateY(0);
    }

    #archive .slide-arrow.prev-arrow.slick-arrow {
        left: calc(-35 * (100vw / 750));
    }

    #archive .slide-arrow.next-arrow.slick-arrow {
        right: calc(-35 * (100vw / 750));
    }
}

/* ======== _slidercontent ======== */

/* ======== _title ======== */
#archive.main-contents .archive__heading {
    width: 44rem;
    margin: 9.5rem auto 0;
    height: 4.2rem;
    border-top: 1px solid #5f5a5a;
    border-bottom: 1px solid #5f5a5a;
    font-family: "canada-type-gibson", sans-serif;
    font-size: 1.6rem;
    font-weight: 400;
    text-align: center;
    letter-spacing: 0.15em;
    line-height: 4.2rem;
}

@media screen and (max-width: 767px) {
    #archive.main-contents .archive__heading {
        width: 100%;
        margin: calc(125 * (100vw / 750)) auto 0;
        height: calc(82 * (100vw / 750));
        border-top: calc(2 * (100vw / 750)) solid #5f5a5a;
        border-bottom: calc(2 * (100vw / 750)) solid #5f5a5a;
        font-family: "canada-type-gibson", sans-serif;
        font-size:  calc(30 * (100vw / 750));
        font-weight: 400;
        text-align: center;
        letter-spacing: 0.15em;
        line-height: calc(82 * (100vw / 750));
    }
}

#archive.main-contents img {
    width: 100%;
    height: auto;
}

#archive.main-contents .en-text {
    font-family: "canada-type-gibson", sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;
}

#archive.main-contents .archive__copy {
    font-family: yu-mincho-pr6n, sans-serif;
    font-weight: 400;
    font-style: normal;
    text-align: center;
}

/* ======== _title ======== */