.page-mq {
    background-image: url(../images/exhibition/permanent/mq/4.png);
}

/* =================== banner ==================== */
.banner {
    background-image: url(../images/exhibition/permanent/mq/2.png),
        url(../images/exhibition/permanent/mq/1.png);
    background-size: 100% auto, cover;
    background-position: top, top;
    position: relative;
}

.banner-inner {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, segoe ui, Roboto, Helvetica, Arial, sans-serif;
    position: absolute;
    top: 0; left: 0;
    height: 100%; width: 100%;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.banner-gif { width: 39.37%; }

.banner-gif img { width: 100%; }

.banner-text { 
    text-indent: 2em;
	color: var(--font-white);
    line-height: 2;
    font-size: 20px;
}

.banner-text p { 
    padding-left: 120px; padding-right: 120px;
}

.section-first,
.section-second, 
.section-third {
    max-width: 1920px;
    margin-left: auto;
    margin-right: auto;
}

/* =================== 第一部分 ==================== */
.section-first { margin-top: -5%; }

.section-title-wrapper {
    position: relative;
}

.section-title-inner {
    position: absolute;
    bottom: 0; left: 50%;
}

.section-title-left-image {
    width: 63.59%; max-width: 1221px;
}

.section-title-right-image {
    width: 42.08%; max-width: 808px; margin-left: auto;
}

.section-title {
    font-size: 36px;
    color: var(--font-white);
}

.section-title-left { position: relative; }

.section-title-left-text {
    -ms-writing-mode: tb-lr;
    writing-mode: vertical-lr;
    position: absolute;
    top: 50%; left: 50%; 
    height: 100%; text-align: center;
    font-size: 36px; color: var(--font-white);
}

.section-title-right { 
    padding-left: 48px;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-pack: center;
    justify-content: center;
}

.section-text {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, segoe ui, Roboto, Helvetica, Arial, sans-serif;
    color: var(--font-white);
    letter-spacing: 0.5px; margin-top: 30px;
    text-indent: 2em; line-height: 1.8;
}

.section-first-exhibits-wrap .left-container {
    width: 22%; padding: 40px 15px;
    background-color: rgba(255, 255, 255, .1);
}

.exhibits-name {
    font-family: system-ui, -apple-system, BlinkMacSystemFont, segoe ui, Roboto, Helvetica, Arial, sans-serif;
    font-size: 20px;
    color: var(--font-white);
    text-align: center;
    margin-top: 20px;
}

.section-second > .container,
.section-first-container-wrap { margin-top: 50px; }

.section-first-exhibits-wrap .right-container {
    width: 77%; padding: 40px;
    background-color: rgba(255, 255, 255, .1);
}

.section-first-exhibits-item img { width: 100%; }

.right-container .section-first-exhibits-item:nth-child(n + 5) {
    margin-top: 30px;
}

.right-container .serial-number {
    width: 30px; height: 30px;
    border-radius: 50%;
    text-align: center; line-height: 30px;
    margin: 15px auto 0;
    color: var(--font-white);
    background-color: #fea32e;
}

.section-first-exhibits-wrap-two .left-container,
.section-first-exhibits-wrap-two .right-container {
    width: 50%;
    padding: 50px; text-align: center;
    background-color: #37374c;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-direction: column;
    flex-direction: column;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.section-first-exhibits-wrap-two .left-container img, 
.section-first-exhibits-wrap-two .right-container img {
    max-width: 76.79%;
}

.section-first-exhibits-wrap-two { position: relative; margin-top: 1%; }

.section-first-exhibits-wrap-two::before,
.section-first-exhibits-wrap-two::after {
    content: "";
    position: absolute;
    left: 50%; top: 0;
    -webkit-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    transform: translateX(-50%);
}

.section-first-exhibits-wrap-two::before {
    width: 1%; height: 100%;
    border-width: 0 1px 0 1px;
    border-style: solid;
    border-color: #f3d2ae;
}

.section-first-exhibits-wrap-two::after {
    width: 88px; height: 84px; 
    top: 50%; margin-top: -42px;
    background-image: url(../images/exhibition/permanent/mq/9-3.png);
    background-size: cover; background-repeat: no-repeat;
}

/* =================== 第二部分 ==================== */
.section-second, .section-third { margin-top: 100px; }

/* =================== 第三部分 ==================== */
.swiper-button-next,
.swiper-button-prev {
    width: 90px;
    height: 90px;
    margin-top: -45px;
    border-radius: 50%;
    background-color: var(--font-white);
}

.swiper-button-prev { left: 0; }
.swiper-button-next {
    right: 0;
    -webkit-transform: translateX(50%);
    -moz-transform: translateX(50%);
    -ms-transform: translateX(50%);
    -o-transform: translateX(50%);
    transform: translateX(50%);
}

.swiper-button-next::after,
.swiper-button-prev::after {
    color: var(--font-black);
    font-size: var(--medium-size);
}

.section-second-container-wrap .swiper-button-prev {
    left: 15px;
}

.section-second-container-wrap .swiper-button-next {
    right: 15px;
    -webkit-transform: translateX(50%);
    -moz-transform: translateX(50%);
    -ms-transform: translateX(50%);
    -o-transform: translateX(50%);
    transform: translateX(50%);
}

.section-third { margin-bottom: 120px; }

.section-third-exhibits-item {
    background-color: #37374c;
    text-align: center; margin-top: 100px;
}

.section-third-exhibits-item .section-third-exhibits-inner {
    -webkit-transform: translateY(20%);
    -moz-transform: translateY(20%);
    -ms-transform: translateY(20%);
    -o-transform: translateY(20%);
    transform: translateY(20%);
    width: 65.67%; margin: 0 auto;
}

.section-third-exhibits-item + .section-third-exhibits-item {
    margin-top: 200px;
}

.section-third-exhibits-item:nth-child(2) .section-third-exhibits-inner {
    -webkit-transform: translateY(40%);
    -moz-transform: translateY(40%);
    -ms-transform: translateY(40%);
    -o-transform: translateY(40%);
    transform: translateY(40%);
    width: 90%;
}

.section-third-exhibits-inner img {
    width: 100%;
}

@media (max-width: 1399px) {
    :root {
        --minimum-size: 16px;
    }

    .banner-text {
        font-size: var(--minimum-size);
    }
}

@media (max-width: 1199px) {
    .banner-gif { width: 30%; }
    .banner-text p { padding-left: 80px; padding-right: 80px; }

    /* =================== 第一部分 ==================== */
    .section-first { margin-top: 0; }
    .section-title { font-size: 30px; }
    .exhibits-name { font-size: 18px; }

    .swiper-button-next, .swiper-button-prev {
        width: 70px; height: 70px; margin-top: -35px;
    }

    .swiper-button-next::after, .swiper-button-prev::after {
        font-size: 26px;
    }
}

@media (max-width: 991px) {
    :root {
        --minimum-size: 14px;
    }

    .banner-text { line-height: 1.625; }
    .banner-text p { padding-left: 0; padding-right: 0; }
    .section-text { margin-top: 0; }
    .section-title-right { padding-left: 30px; }
    .section-title { font-size: 26px; }

    .section-first { margin-top: 50px; }

    .section-first-exhibits-wrap-two,
    .section-first-exhibits-wrap {
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .section-first-exhibits-wrap-two .left-container, 
    .section-first-exhibits-wrap-two .right-container,
    .section-first-exhibits-wrap .left-container,
    .section-first-exhibits-wrap .right-container {
        width: 100%;
    }

    .section-first-exhibits-wrap .left-container {
        -ms-flex-direction: row !important;
        flex-direction: row !important;
        padding: 30px 15px;
    }

    .section-first-exhibits-wrap .left-container .section-first-exhibits-item {
        padding: 0 15px;
    }

    .section-first-exhibits-wrap .right-container {
        padding: 30px;
    }

    .section-first-exhibits-wrap-two::before {
        left: 0; top: 50%;
        width: 100%; height: 1%;
        border-width: 1px 0 1px 0;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
    }

    .section-third-exhibits-item { padding: 50px 0; margin-top: 50px; }

    .section-third-exhibits-item + .section-third-exhibits-item { margin-top: 40px; }

    .section-third-exhibits-item .section-third-exhibits-inner,
    .section-third-exhibits-item:nth-child(2) .section-third-exhibits-inner {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
    }

    .section-third { margin-bottom: 60px; }
}

@media (max-width: 767px) {
    .banner { 
        height: auto;
        padding-bottom: 0px;
        background-size: 100% auto, 100% 100%;
    }

    .banner-inner {
        position: static;
        padding-top: 80px;
        padding-bottom: 80px;
    }

    .banner-text {
        line-height: 1.8;
        text-align: justify;
        text-indent: 2em;
    }

    .section-title-inner {
        margin-top: -30%;
        position: static;
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
    }

    .section-title-inner > .d-flex {
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .section-title-left-text {
        -ms-writing-mode: initial;
        writing-mode: initial;
        left: 50px; font-size: 26px;
        -webkit-transform: translate(0, -50%);
        -moz-transform: translate(0, -50%);
        -ms-transform: translate(0, -50%);
        -o-transform: translate(0, -50%);
        transform: translate(0, -50%);
        display: -ms-flexbox;
        display: flex;
        -ms-flex-align: center;
        align-items: center;
        -ms-flex-pack: center;
        justify-content: center;
    }

    .section-title-left > img {
        width: 100px;
        -webkit-transform: translateX(47%) rotate(90deg);
        -moz-transform: translateX(47%) rotate(90deg);
        -ms-transform: translateX(47%) rotate(90deg);
        -o-transform: translateX(47%) rotate(90deg);
        transform: translateX(47%) rotate(90deg);
    }

    .section-first-exhibits-wrap-two::before,
    .section-first-exhibits-wrap-two::after { content: unset; }

    .section-second-container-wrap .swiper-button-next,
    .section-second-container-wrap .swiper-button-prev {
        -webkit-transform: translateX(0);
        -moz-transform: translateX(0);
        -ms-transform: translateX(0);
        -o-transform: translateX(0);
        transform: translateX(0);
        width: 50px; height: 50px;
    }

    .swiper-button-next::after, .swiper-button-prev::after {
        font-size: 20px;
    }
}

@media (max-width: 576px) {
    .banner-inner {
        padding-top: 70px;
        padding-bottom: 0px;
    }
}