#loader {background-color: #000000; position: fixed; z-index: 999; width: 100%; height: 100%;}
#loader::after {content: ''; display: block; width: 100%; height: 100%; background: url('/img/loader.gif') no-repeat center center; background-size: 120px;}


#wrap {width: 100%; height: 100vh;}
#wrap header nav h3 {text-align: center; transform: scaleX(1.4); letter-spacing: -8px;}
#wrap header nav h3 a {font-family: 'ZCOOLQingKeHuangYou-Regular'; font-size: 120px; color: #ffffff; animation: fadeinout 5s infinite;}
#wrap header nav h3 a:hover {color: #800000;}

.background-image {position: fixed; width: 100vw; height: 100vh; z-index: -1;}
.background-image img {width: 100vw; height: 100vh; object-fit: cover; object-position: center center;}

#wrap header nav h3 a {margin-right: 5px;}
.swiper-pagination-bullet-active {background: #800000 !important;}

.swiper-container {width: 100%; height: 100%;}
.swiper-container-horizontal>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction {bottom: 25px !important;}
.swiper-pagination-bullet {width: 10px !important; height: 10px !important;}
.swiper-pagination-bullet-active {background-color: #800000 !important;}

header {position: fixed; width: 100%; z-index: 15; top: 0;}
header h1 {color: #808080; text-align: center; font-size: 30px; padding: 15px 0 10px;}
header nav.gnb {width: 160px; margin: 0 auto; background-color: #000000; padding: 25px; box-sizing: border-box; animation: bgfd 5s infinite;}
header nav.gnb a {display: block; text-align: center; color: #ffffff; font-size: 27.5px; margin-bottom: 10px;}
header nav.gnb a:hover {color: #800000;}
header nav.gnb a:last-child {margin-bottom: 0; letter-spacing: 2px;}
footer {position: fixed; width: 100%; bottom: 35px;}
footer .social {width: 128px; height: 36px; display: flex; flex-flow: row nowrap; justify-content: space-between; margin: 0 auto;}
footer .social a {width: 36px; height: 36px; display: inline-block;}
footer .social a img {width: 100%; height: 100%;}

@keyframes fadeinout {
    0% {opacity: 0;}
    50% {opacity: 1;}
    100% {opacity: 0;}
}

@keyframes bgfd {
    0% {background: rgba(0, 0, 0, 0);}
    50% {background: rgba(0, 0, 0, 1);}
    100% {background: rgba(0, 0, 0, 0);}
}

@media screen and (max-width: 1440px) {
    .background-video {display: none;}
    .background-image {display: block;}
}