@charset "utf-8";

/**
 * --------------------------------
 * common CSS
 * --------------------------------
*/

/* base */
html {width:100%;margin:0;padding:0;}
body {width:100%;margin:0;padding:0;font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";font-weight:400;font-size:16px;line-height:1;color:#767676;letter-spacing:-0.025em;word-wrap:break-word;image-rendering: -webkit-optimize-contrast;}
h1,h2,h3,h4,h5,h6 {margin:0;font-weight:400;}
ul, ol {list-style:none;margin:0;padding:0;}
button {font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", sans-serif, "Apple Color Emoji", "Segoe UI Emoji", "Segoe UI Symbol", "Noto Color Emoji";cursor:pointer;padding:0;border:none;letter-spacing:-0.025em;background-color:transparent;outline:none;}
a {color:#767676;text-decoration:none;outline:none;}
i, p, div, span, li {margin:0;}
em {display:inline-block;font-style:normal;}
table {table-layout:fixed;width:100%;border-collapse:collapse;border-spacing:0;}
table caption {display:none;}
th, td {padding:0;}
dl, dd {margin:0;}
figure {margin:0;}
img {vertical-align:top;}
address {font-style:normal;}
.hide {position:absolute !important;left:-9999px;}
*, *:before, *:after {box-sizing:border-box;}


body {position: relative;min-width: 1240px;width: 100%;/*overflow: hidden;overflow-y: scroll;*/overflow: hidden;overflow-y: scroll;}
.inner {position: relative;margin: 0 auto;width: 1200px;}
.con {position: relative;}

#wrap {min-width: 1200px;width: 100%;}

.top-banner {position: relative;width: 100%;background-color: #101010;z-index:20;cursor: pointer;}

header {position: sticky;top: 0;width: 100%;background-color: #fff;z-index:20;}
header .dim {display: none;position: fixed;left: 0;top: 136px;right: 0;bottom: 0;width: 100vw;height: 100vh;background-color: rgba(0, 0, 0, 0.25);z-index: -1;cursor: pointer;}
header .inner .btn-menu {position: absolute;left: 0;top: 0;width: 36px;height: 96px;}
header .inner .btn-menu img {opacity: 0;}
header .inner .btn-menu.active img {opacity: 1;}
header .inner .btn-top {position: absolute;left: 36px;top: 0;width: 180px;height: 96px;}
header .inner .btn-link {display: block;position: absolute;left: 300px;top: 0;width: 640px;height: 96px;}
header .menu {display: none;position: absolute;left: 0;right: 0;top: 96px;background-color: #fff;}
header .menu .btn-sub {display: block;position: absolute;left: 200px;top: 80px;width: 100px;height: 35px;}
header .menu .btn-close {display: block;position: absolute;right: 0;bottom: 0;width: 200px;height: 100px;}

footer {position: relative;width: 100%;background-color: #101010;z-index:10;}
footer .chat {opacity: 0;transition: opacity 0.5s;}
footer .chat.active {opacity: 1;}
footer .chat {position: fixed;bottom: 80px;right: 10px;width: 74px;animation: chat-effect 1.4s ease-in-out infinite;z-index:1;}

@keyframes chat-effect {
	0% {transform: translateY(0);}
	50% {transform: translateY(10px);}
	100% {transform: translateY(0);}
}

.middle-banner .swiper-pagination {bottom: 28px;}
.middle-banner .swiper-pagination .swiper-pagination-bullet {opacity: 0.15;}
.middle-banner .swiper-pagination .swiper-pagination-bullet-active {background-color: #000;opacity: 1;}