@charset "utf-8";
/* Css Reset */
html { font-size: 62.5%; }
* { box-sizing: border-box; }
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td, img { padding: 0; margin: 0; }
fieldset, img { border: 0; display: block; vertical-align: middle; }
address, caption, cite, code, dfn, em, th, var, i { font-weight: normal; font-style: normal; }
ol, ul, li { list-style: none; }
div, dl, dt, dd, ol, ul, li { zoom: 1; }
div { display: block; }
caption, th { text-align: left; }
h1, h2, h3, h4, h5, h6 { font-weight: normal; font-size: 100%; line-height: 1; }
/* 提示框*/
.xxts { width: 100%; height: 100%; position: fixed; top: 0; left: 0; z-index: 100; background-color: #fff; }
.xxts .tsbt { width: 600px; height: 300px; border: 1px solid #D2D2D2; color: #fff; text-align: center; position: absolute; top: 0; left: 0; bottom: 0; right: 0; margin: auto; }
.xxts .tsbt .info { width: 100%; height: 60px; line-height: 60px; background: #42a5f5; }
.xxts .tsbt .errorif p { width: 100%; height: 130px; padding: 20px 0; color: #333; line-height: 40px; }
.xxts .tsbt .errorif a { margin: 0 20px; padding: 0 15px; line-height: 40px; border-radius: 15px; background: #2196f3; color: #ffffff; display: block; }
/* Public */
html { width: 100%; }
body { width: 100%; line-height: 26px; ; color: #555; font: 1.6rem "Open Sans", Lora, Arial, Verdana, Helvetica, "Microsoft Yahei", Raleway, Roboto, Oregano, Oswald, "Seaweed Script", sans-serif; -webkit-text-size-adjust: none; background: url(../images/bbg.png); }
a { color: #302e2f; text-decoration: none; outline: none; }
a:hover { color: #d99578; }
.clearfix::after { display: block; clear: both; content: ""; }
.eg-btn { border-radius: 5px; text-align: center; display: inline-block; text-decoration: none; transition: all .4s ease; text-transform: capitalize; font-family: poppins, sans-serif }
.btn--primary { background: #18212e; color: #ffffff; position: relative; z-index: 1; white-space: nowrap; font-family: poppins, sans-serif }
.btn--primary::after { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; background: #d99578; transition: all .52s; z-index: -1; border-radius: 5px }
.btn--primary:hover { color: #ffffff; }
.btn--primary:hover::after { transform: rotateY(90deg) }
.btn--primary2 { background: #18212e; color: #ffffff; position: relative; z-index: 1; white-space: nowrap; border-radius: 100px; font-family: poppins, sans-serif }
.btn--primary2::before { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; background: #00caeb; transition: all .52s; z-index: -1; border-radius: 100px }
.btn--primary2::after { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; background: #00caeb; transition: all .52s; z-index: -1; border-radius: 100px }
.btn--primary2:hover { color: #ffffff; }
.btn--primary2:hover::before { transform: rotateX(90deg) }
.btn--primary2:hover::after { transform: rotateY(90deg) }
.btn--primary2-light { font-weight: 600; position: relative; z-index: 1; white-space: nowrap; border-radius: 100px; border: 1px solid transparent; font-family: poppins, sans-serif }
.btn--primary2-light::before { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; background: #ffffff; transition: all .52s; z-index: -1; border-radius: 100px }
.btn--primary2-light::after { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; background: #ffffff; transition: all .52s; z-index: -1; border-radius: 100px }
.btn--primary2-light:hover { color: #ffffff; }
.btn--primary2-light:hover::before { transform: rotateX(90deg) }
.btn--primary2-light:hover::after { transform: rotateY(90deg) }
.btn--primary3 { background: #18212e; color: #ffffff; position: relative; z-index: 1; white-space: nowrap; border-radius: 5px }
.btn--primary3::before { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; background: #a044ff; transition: all .52s; z-index: -1; border-radius: 5px }
.btn--primary3::after { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; background: #a044ff; transition: all .52s; z-index: -1; border-radius: 5px }
.btn--primary3:hover { color: #ffffff; }
.btn--primary3:hover::before { transform: rotateX(90deg) }
.btn--primary3:hover::after { transform: rotateY(90deg) }
.btn--primary3.capsule { border-radius: 100px }
.btn--primary3.capsule::before { border-radius: 100px }
.btn--primary3.capsule::after { border-radius: 100px }
.btn--primary4 { background: #18212e; color: #ffffff; position: relative; z-index: 1; white-space: nowrap; border-radius: 5px }
.btn--primary4::before { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; transition: all .52s; z-index: -1; border-radius: 5px }
.btn--primary4::after { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; transition: all .52s; z-index: -1; border-radius: 5px }
.btn--primary4:hover { color: #ffffff; }
.btn--primary4:hover::before { transform: rotateX(90deg) }
.btn--primary4:hover::after { transform: rotateY(90deg) }
.btn--primary4.capsule { border-radius: 100px }
.btn--primary4.capsule::before { border-radius: 100px }
.btn--primary4.capsule::after { border-radius: 100px }
.btn--primary5 { background: #18212e; color: #ffffff; position: relative; z-index: 1; white-space: nowrap; border-radius: 0; }
.btn--primary5::before { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; transition: all .52s; z-index: -1; border-radius: 0 }
.btn--primary5::after { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; transition: all .52s; z-index: -1; border-radius: 0 }
.btn--primary5:hover { color: #ffffff; }
.btn--primary5:hover::before { transform: rotateX(90deg) }
.btn--primary5:hover::after { transform: rotateY(90deg) }
.btn--primary5.capsule { border-radius: 100px }
.btn--primary5.capsule::before { border-radius: 100px }
.btn--primary5.capsule::after { border-radius: 100px }
.btn--primary5.btn--outline { }
.btn--primary5.btn--outline::before { background: #fef4e9; }
.btn--primary5.btn--outline::after { background: #fef4e9; }
.btn--primary5.btn--outline:hover { }
.btn--primary5.btn--outline:hover::before { transform: rotateX(90deg) }
.btn--primary5.btn--outline:hover::after { transform: rotateY(90deg) }
.btn--transparent { background: rgba(255,255,255,.2); color: #ffffff; position: relative; z-index: 1; white-space: nowrap; border-radius: 5px }
.btn--transparent::before { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; background: rgba(255,255,255,.1); transition: all .52s; z-index: -1; border-radius: 5px }
.btn--transparent::after { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; background: rgba(255,255,255,.1); transition: all .52s; z-index: -1; border-radius: 5px }
.btn--transparent:hover { color: #ffffff; }
.btn--transparent:hover::before { transform: rotateX(90deg) }
.btn--transparent:hover::after { transform: rotateY(90deg) }
.btn--primary3-outline { border: 1px solid #a044ff; color: #a044ff; white-space: nowrap; transition: all .52s ease }
.btn--primary3-outline:hover { background: #a044ff; }
.btn--lg { font-size: 16px; font-weight: 600; text-transform: uppercase; padding: 17px 32px }
.btn--md { padding: 14px 45px; font-size: 16px; font-weight: 700 }
.btn--sm { font-size: 14px; font-weight: 500; padding: 5px 12px }
.header-btn { color: #ffffff; font-size: 16px; font-weight: 600; font-family: cuprum, sans-serif; padding: 9px 20px }
.action-btn { min-width: 26px; height: 26px; line-height: 0; border: 0; outline: 0 }
.action-btn.red { background: #00caeb }
.action-btn.green { }
.hover-style { background: #ffffff; position: relative; z-index: 1 }
.hover-style::before { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; transition: all .52s; z-index: -1; border-radius: 5px; opacity: 0 }
.hover-style::after { width: 100%; height: 100%; content: ""; margin: auto; position: absolute; top: 0; left: 0; transition: all .52s; z-index: -1; border-radius: 5px; opacity: 0 }
.hover-style:hover::before { transform: rotateX(90deg); opacity: .2 }
.hover-style:hover::after { transform: rotateY(90deg); opacity: .2 }
.hover-border1 { background: #ffffff; position: relative; z-index: 1 }
.mobile-logo-area { display: none; }
.mobile-form { display: block; }
.mobile-menu-form { margin-top: 50px; }
.input-with-btn { display: flex; flex-direction: column; }
.mobile-search { background: rgba(0,0,0,.85); box-shadow: 0 0 10px rgba(0,0,0,.09); width: 100%; height: 100%; border-radius: 4px; display: flex; justify-content: center; flex-wrap: wrap; align-items: center; align-items: center; position: fixed; cursor: popoppins; transform: scale(0); top: 0; left: 0; z-index: 9999; opacity: 0; visibility: hidden; transition: .65s ease; padding: 35px 100px }
.mobile-search label { color: #fff; margin-bottom: 20px; display: inline-block; font-family: cuprum, sans-serif; }
.mobile-search.slide { transform: scale(1); opacity: 1; visibility: visible }
.mobile-search.slide .container { width: 100%; max-width: 1140px; padding: 0 20px; margin: 0 auto; }
.mobile-search.slide .container .box { display: flex; justify-content: center; }
.mobile-search.slide .box-col { flex: 0 0 auto; width: 91.6666666667%; }
.mobile-search.slide .box-col form { display: flex; }
.mobile-search.slide .box-col form .keyword { width: calc(100% - 90px); height: 45px; border: 1px solid #ffffff; padding: 30px; }
.mobile-search.slide .box-col form .search-submit { width: 60px; border: 1px solid #ffffff; }
.mobile-search.slide .box-cor { display: flex; gap: 0.5rem; justify-content: flex-end; align-items: center; }
.mobile-search input { border-radius: unset; background: 0; transition: .3s ease-in-out; color: #fff; }
.mobile-search input:focus { border-bottom: 1px solid #fff }
.mobile-search input::placeholder {
font-family:cuprum, sans-serif;
color:#676767
}
.mobile-search .search-cross-btn { color: #fff; cursor: pointer; border-radius: 50%; height: 40px; width: 40px; text-align: center; line-height: 43px; transition: .5s ease }
.mobile-search .search-cross-btn:hover { color: #fff }
.mobile-search .search-cross-btn i { font-size: 25px; cursor: popoppins }
.menu-toggle-btn-full-shape.show-sidebar { transform: translateX(0)!important; }
.sidebar-top-area { display: flex; align-items: center; justify-content: space-between; padding-left: 20px; }
.sidebar-top-area img { width: 40px; }
.menu-toggle-btn-full-shape { position: relative; width: 100%; max-width: 375px; padding: 30px 25px 0; height: 100%; position: fixed; right: 0; top: 0; bottom: 0; z-index: 999; transform: translateX(100%)!important; transition: all .6s ease 0s; background: #fff; overflow-y: auto; border-left: 1px solid rgba(238,238,238,.8) }
.menu-toggle-btn-full-shape .cross-icon i { color: #000000; font-size: 26px; cursor: pointer; transition: .4s; height: 36px; width: 36px; line-height: 36px; border-radius: 50%; text-align: center }
.menu-toggle-btn-full-shape .cross-icon i:hover { transform: rotate(90deg) }
.menu-toggle-btn-full-shape .sidebar-body { padding-top: 30px; padding-bottom: 30px }
.address-card { position: relative; z-index: 1; border-radius: 5px; overflow: hidden; box-shadow: 3px 4px 30px rgb(136 136 136 / 10%); }
.address-card .content { background: #fff; box-shadow: 3px 4px 30px rgb(136 136 136 / 10%); padding: 30px; z-index: 2; position: relative; transition: all .5s ease; }
.address-card .header { display: flex; justify-content: start; align-items: center; margin-bottom: 20px; }
.address-card .header h3 { font-size: 2rem; font-weight: 700; margin-bottom: 0; transition: all .5s ease; }
.address-card .address-list { margin: 0; padding: 0; }
.address-card .address-list li { line-height: 1.7; margin-bottom: 8px; transition: all .5s ease; }
.address-card .address-list li span { font-size: 16px; font-weight: 500; margin-right: 5px; transition: all .5s ease; }
.address-card:hover img { margin-top: 0; opacity: 1; visibility: visible }
.address-card:hover .content { background: #d99578; }
.address-card:hover .header h3 { color: #ffffff; }
.address-card:hover .address-list li { color: #ffffff; }
.address-card:hover .address-list li span { color: #ffffff; }
.address-card img { width: 100%; transition-delay: .52s; border-radius: 0; }
.blog-widget-item { background: #fff; box-shadow: 3px 4px 30px rgb(136 136 136 / 10%); border-radius: 5px; margin-bottom: 40px; }
.blog-widget-item .follow-area { padding: 30px 25px; }
.follow-list { margin: 0; padding: 10px 0 0; display: flex; flex-direction: row; align-items: flex-start; gap: 1.5rem; }
.follow-list a i { width: 36px; height: 36px; line-height: 36px; text-align: center; border: 1px solid #eee; background: #ffffff; border-radius: 3px; font-size: 18px; color: #333; transition: all .35s ease-in-out; }
.menu-toggle-btn-full-shape .sidebar-body h5 { font-size: 22px; font-weight: 800; position: relative; padding-bottom: 8px; margin-bottom: 40px }
.menu-toggle-btn-full-shape .sidebar-body h5::after { content: ""; width: 45px; height: 3px; border-radius: 4px; position: absolute; left: 0; bottom: 0 }
.menu-toggle-btn-full-shape .sidebar-body .sidebar-social { padding-left: 0; margin-left: 0 }
.menu-toggle-btn-full-shape .sidebar-body .sidebar-social li { margin-bottom: 20px }
.menu-toggle-btn-full-shape .sidebar-body .sidebar-social i { height: 34px; width: 34px; line-height: 34px; text-align: center; border-radius: 50%; background: #fff; border: 1px solid #eee; margin-right: 15px }
.menu-toggle-btn-full-shape .sidebar-body .sidebar-social a { font-size: 18px; font-weight: 500; transition: .4s ease; display: flex; align-items: center; justify-content: start; flex-direction: row }
.menu-toggle-btn-full-shape .sidebar-body .sidebar-social a:hover i { border: 1px solid #eee; color: #fff }
.menu-toggle-btn-full-shape .sidebar-bottom { border-top: 1px solid #eee; padding-top: 20px; padding-bottom: 20px }
.menu-toggle-btn-full-shape .sidebar-bottom p { font-size: 16px; font-weight: 700; margin-bottom: 5px }
.menu-toggle-btn-full-shape .sidebar-bottom span { font-size: 16px; font-weight: 500; }
.mobile-menu-form { margin-top: 50px }
.mobile-menu-form input { width: 100%; border: 1px solid #eee; padding: 10px 15px; background-color: #ffffff; margin-bottom: 15px; outline: 0; border-radius: 5px }
.mobile-menu-form input::placeholder {
font-size:12px
}
.mobile-menu-form input.style-capsule { border-radius: 30px }
.mobile-menu-form button { outline: 0; border: 0; padding: 10px }
.mobile-menu-form.style-2 input { border-radius: 30px }
header { background-color: #302e2f; width: 100%; z-index: 99; padding: 0 60px; display: flex; justify-content: space-between; align-items: center; position: fixed; top: 0; right: 0; }
header .nav-right .header-icons { margin-right: 20px; display: flex; align-items: center; }
header .nav-right .hotline { display: flex; justify-content: center; align-items: center; margin-right: 20px; color: white; }
header .nav-right .hotline .hotline-icon { margin-right: 8px }
header .nav-right .hotline .hotline-icon i { color: #ffffff; font-size: 3rem; }
header .nav-right .hotline .hotline-info span { font-size: 12px; font-weight: 500; font-family: poppins, sans-serif; color: #ffffff; }
header .nav-right .hotline .hotline-info h6 { font-size: 16px; font-weight: 500; font-family: poppins, sans-serif; color: #ffffff; white-space: nowrap }
header .nav-right .sidebar-btn .fa { font-size: 22px; color: #ffffff; cursor: pointer; }
header .nav-right .search-btn { height: 42px; line-height: 45px; text-align: center; border-radius: 5px; cursor: pointer; position: relative; padding-right: 15px; margin-right: 15px }
header .nav-right .search-btn::after { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 2px; height: 20px; border-radius: 1px; background: #ffffff }
header .nav-right .search-btn .fa { font-size: 18px; color: #ffffff }
header .header-logo img { width: 180px; }
header .header-btn { font-size: 1rem; font-weight: 600; border-radius: 5px; display: inline-block; transition: .35s ease-in; cursor: pointer; white-space: nowrap; font-family: poppins, sans-serif }
header .header-btn a { color: #fff; }
header .header-btn:hover { background: #191a1c }
header .header-btn:hover a { }
header .main-nav { display: inline-block }
header .main-nav ul { list-style: none; margin: 0; padding: 0 }
header .main-nav ul li { display: inline-block; position: relative; padding: 0 20px }
header .main-nav ul li a { font-size: 16px; color: #fff; font-weight: 500; display: block; text-transform: capitalize; padding: 30px 0; position: relative; -webkit-transition: all .5s ease-out 0s; -moz-transition: all .5s ease-out 0s; -ms-transition: all .5s ease-out 0s; -o-transition: all .5s ease-out 0s; transition: all .5s ease-out 0s }
header .main-nav ul li a:hover { color: #d99578; }
header .main-nav ul li a.active { color: #d99578; }
header .main-nav ul li i { width: 30px; font-size: 14px; text-align: center; color: #adadad; font-style: normal; position: absolute; right: -9px; top: 35px; z-index: 999; cursor: pointer; display: none }
header .main-nav ul li ul.sub-menu { position: absolute; left: 0; right: 0; top: auto; margin: 0; padding: 0; opacity: 0; visibility: hidden; min-width: 215px; background: #302e2f; text-align: left; transition: all .5s ease-out 0s; transform: translateY(20px) }
header .main-nav ul li ul.sub-menu>li { padding: 0; display: block; border-bottom: 1px solid rgba(56,56,56,.5); position: relative }
header .main-nav ul li ul.sub-menu>li i { position: absolute; top: 10px; right: 6px; display: block }
header .main-nav ul li ul.sub-menu>li a { display: block; padding: 15px; color: #fff; font-weight: 300; text-transform: capitalize; font-size: 15px; line-height: 1; -webkit-transition: all .4s ease-out 0s; transition: all .4s ease-out 0s }
header .main-nav ul li ul.sub-menu>li a:hover { color: #d99578; margin-left: 10px }
header .main-nav ul li ul.sub-menu>li a.active { }
header .main-nav ul li ul.sub-menu>li .sub-menu { left: 215px; position: absolute; max-width: 230px; min-width: 215px; background: #302e2f; top: 0 }
header .main-nav ul li ul.sub-menu>li .sub-menu li i { display: block }
header .main-nav ul li ul.sub-menu>li:last-child { border-bottom: 0 }
header .main-nav ul li:hover>ul.sub-menu { visibility: visible; opacity: 1; transform: translateY(0) }
header .main-nav ul li.menu-item-has-children>i { display: block; -webkit-transition: all 500ms ease; -moz-transition: all 500ms ease; -ms-transition: all 500ms ease; -o-transition: all 500ms ease; transition: all 500ms ease; }
.mobile-form { display: none; }
.mobile-form form { display: flex; flex-direction: column; }
.mobile-form form .search-field { line-height: 30px; border-radius: 4px; }
.mobile-form form .search-submit { line-height: 30px; background: #d99578; margin-top: 10px; color: #ffffff; border-radius: 4px; }
.nav-right { display: flex; gap: 3rem; align-items: center; }
.mobile-menu-btn { display: none; }
/* banner */
.main-slider { position: relative; display: block; z-index: 91; overflow: hidden; margin-top: 81px; }
.main-slider .swiper-slide { position: relative; background-color: #000; }
.main-slider .container { width: 100%; margin-right: auto; margin-left: auto; position: relative; max-width: 1200px; padding-top: 170px; padding-bottom: 175px; z-index: 30; }
.main-slider .container .col { width: 40%; }
.main-slider .image-layer { position: absolute; top: 0; right: -20px; bottom: 0; width: 55%; //mix-blend-mode: luminosity;
background-repeat: no-repeat; background-size: cover; background-position: left center; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: opacity 1500ms ease-in, -webkit-transform 7000ms ease; transition: opacity 1500ms ease-in, -webkit-transform 7000ms ease; transition: transform 7000ms ease, opacity 1500ms ease-in; transition: transform 7000ms ease, opacity 1500ms ease-in, -webkit-transform 7000ms ease; z-index: 1 }
.main-slider .image-layer:after { position: absolute; content: ''; width: 100%; height: 100%; /* background: -webkit-linear-gradient(0deg, rgb(20 12 6) 1%, rgba(0, 0, 0, 0.0) 40%); */ background: linear-gradient(0deg, rgb(20 12 6) 1%, rgb(0 0 0 / 0%) 40%); top: 0; right: 0; }
.main-slider .swiper-slide-active .image-layer { -webkit-transform: scale(1.15); transform: scale(1.15) }
.main-slider-shape-1 { position: absolute; top: 0; bottom: 0; left: 0; width: 50%; background-repeat: no-repeat; background-position: right; background-size: cover; z-index: 1; }
.main-slider-shape-1:after { position: absolute; content: ''; width: 100%; height: 100%; /* background: -webkit-linear-gradient(98.1deg,rgb(20 12 6) 45%,rgba(0,0,0,0.0) 85%); */ background: linear-gradient(98.1deg, rgb(20 12 6) 45%, rgb(0 0 0 / 0%) 85%); top: 0; right: 0; }
.main-slider-shape-2 { width: 25%; position: absolute; bottom: 0; left: 30px; opacity: 0.05; z-index: 1; }
.main-slider-shape-2 img { width: 100%; }
.main-slider__content { position: relative; display: block; text-align: left; color: #ffffff; }
.main-slider__sub-title { font-size: 20px; line-height: 40px; opacity: 0; visibility: hidden; -webkit-transform: translateY(-120px); transform: translateY(-120px); -webkit-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease }
.main-slider__title { position: relative; font-size: 36px; font-weight: 900; height: 100px; line-height: 50px; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; word-break: break-all; -webkit-box-orient: vertical; text-overflow: ellipsis; white-space: pre-wrap; margin-top: 16px; margin-bottom: 17px; opacity: 0; visibility: hidden; -webkit-transform: translateY(-120px); transform: translateY(-120px); -webkit-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease }
.main-slider__btn-box { position: relative; display: block; opacity: 0; visibility: hidden; -webkit-transform: translateY(120px); transform: translateY(120px); -webkit-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease }
.main-slider .swiper-slide-active .main-slider__title, .main-slider .swiper-slide-active .main-slider__sub-title, .main-slider .swiper-slide-active .main-slider__btn-box { visibility: visible; opacity: 1; -webkit-transform: translateY(0) translateX(0); transform: translateY(0) translateX(0) }
.main-slider__nav { position: absolute; top: 42%; left: 0; z-index: 100; transform: translateY(-50%) translateX(0%); display: flex; align-items: flex-start; flex-direction: column; max-width: 1200px; padding: 0 15px; }
.main-slider__nav .swiper-button-next, .main-slider__nav .swiper-button-prev { position: relative; top: auto; left: auto; right: auto; bottom: auto; z-index: 100; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; font-size: 2rem; color: #ffffff; border: 1px solid #ffffff; border-radius: 6px; margin: 0; text-align: center; transition: all 500ms ease; padding: 23px 0; background: none; }
.main-slider__nav .swiper-button-next:hover, .main-slider__nav .swiper-button-prev:hover { color: #ffffff; border: 2px solid #ffffff; }
.main-slider__nav .swiper-button-next::after, .main-slider__nav .swiper-button-prev::after { display: none }
.main-slider__nav .swiper-button-prev { margin-bottom: 10px }
.main-slider-two { position: relative; display: block; z-index: 91 }
.main-slider-two .swiper-slide { position: relative; }
.main-slider-two .container { position: relative; padding-top: 185px; padding-bottom: 190px; z-index: 30 }
.image-layer-two { position: absolute; top: 0; right: 0; bottom: 0; left: 0; mix-blend-mode: luminosity; background-repeat: no-repeat; background-size: cover; background-position: left center; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: opacity 1500ms ease-in, -webkit-transform 7000ms ease; transition: opacity 1500ms ease-in, -webkit-transform 7000ms ease; transition: transform 7000ms ease, opacity 1500ms ease-in; transition: transform 7000ms ease, opacity 1500ms ease-in, -webkit-transform 7000ms ease; z-index: 1 }
.main-slider-two .swiper-slide-active .image-layer-two { -webkit-transform: scale(1.15); transform: scale(1.15) }
.image-layer-two:before { position: absolute; top: 0; bottom: 0; left: 0; right: 0; content: ""; }
.main-slider-two-shape-1 { position: absolute; top: 0; right: 0; mix-blend-mode: color-dodge; opacity: .50; z-index: 1 }
.main-slider-two-shape-1 img { width: auto }
.main-slider-two-shape-2 { position: absolute; top: 0; right: 0; z-index: -1 }
.main-slider-two-shape-2 img { width: auto }
.main-slider-two__content { position: relative; display: block; text-align: center }
.main-slider-two__sub-title { font-size: 30px; font-weight: 700; line-height: 30px; opacity: 0; visibility: hidden; -webkit-transform: translateY(-120px); transform: translateY(-120px); -webkit-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease }
.main-slider-two__title { position: relative; font-size: 90px; font-weight: 900; line-height: 110px; letter-spacing: -0.04em; text-transform: uppercase; margin-top: 18px; margin-bottom: 24px; opacity: 0; visibility: hidden; -webkit-transform: translateY(-120px); transform: translateY(-120px); -webkit-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease }
.main-slider-two__btn-box { position: relative; display: block; opacity: 0; visibility: hidden; -webkit-transform: translateY(120px); transform: translateY(120px); -webkit-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease }
.main-slider-two__btn { font-weight: 800 }
.main-slider-two__btn:hover { }
.main-slider-two__btn:before { }
.main-slider-two .swiper-slide-active .main-slider-two__sub-title, .main-slider-two .swiper-slide-active .main-slider-two__title, .main-slider-two .swiper-slide-active .main-slider-two__btn-box { visibility: visible; opacity: 1; -webkit-transform: translateY(0) translateX(0); transform: translateY(0) translateX(0) }
.main-slider-two__nav { width: 100%; max-width: 100%; padding-left: 60px; padding-right: 60px; position: absolute; top: 50%; left: 50%; z-index: 100; transform: translateY(-50%) translateX(-50%); display: flex; align-items: center; justify-content: space-between; height: 0; line-height: 0 }
.main-slider-two__nav .swiper-button-next, .main-slider-two__nav .swiper-button-prev { position: relative; top: auto; left: auto; right: auto; bottom: auto; z-index: 100; width: 50px; height: 50px; display: flex; justify-content: center; align-items: center; font-size: 18px; border-radius: 50%; margin: 0; text-align: center; transition: all 500ms ease }
.main-slider-two__nav .swiper-button-next:hover, .main-slider-two__nav .swiper-button-prev:hover { }
.main-slider-two__nav .swiper-button-next:hover, .main-slider-two__nav .swiper-button-prev:hover { opacity: 1 }
.main-slider-two__nav .swiper-button-next::after, .main-slider-two__nav .swiper-button-prev::after { display: none }
.main-slider-three { position: relative; display: block; z-index: 91 }
.main-slider-three .swiper-slide { position: relative; background-color: #212d2b }
.main-slider-three .container { position: relative; padding-top: 297px; padding-bottom: 160px; z-index: 30 }
.image-layer-three { position: absolute; top: 0; right: 0; bottom: 0; left: 0; mix-blend-mode: luminosity; background-repeat: no-repeat; background-size: cover; background-position: left center; -webkit-transform: scale(1); transform: scale(1); -webkit-transition: opacity 1500ms ease-in, -webkit-transform 7000ms ease; transition: opacity 1500ms ease-in, -webkit-transform 7000ms ease; transition: transform 7000ms ease, opacity 1500ms ease-in; transition: transform 7000ms ease, opacity 1500ms ease-in, -webkit-transform 7000ms ease; z-index: 1 }
.main-slider-three .swiper-slide-active .image-layer-three { -webkit-transform: scale(1.15); transform: scale(1.15) }
.image-layer-three:before { position: absolute; top: 0; bottom: 0; left: 0; right: 0; content: ""; background-color: rgba(33,45,43,.60) }
.main-slider-three-color { position: absolute; top: 0; left: 0; right: 0; height: 420px; background: #212d2b; background: linear-gradient(180deg, rgba(33,45,43,0.969625350140056) 7%, rgba(33,45,43,0) 100%); z-index: 1 }
.main-slider-three__content { position: relative; display: block; text-align: center }
.main-slider-three__sub-title { font-size: 20px; font-weight: 600; line-height: 30px; opacity: 0; visibility: hidden; -webkit-transform: translateY(-120px); transform: translateY(-120px); -webkit-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease }
.main-slider-three__title { position: relative; font-size: 90px; font-weight: 900; line-height: 110px; letter-spacing: -0.04em; margin-top: 14px; margin-bottom: 25px; opacity: 0; visibility: hidden; -webkit-transform: translateY(-120px); transform: translateY(-120px); -webkit-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease }
.main-slider-three__btn-box { position: relative; display: block; opacity: 0; visibility: hidden; -webkit-transform: translateY(120px); transform: translateY(120px); -webkit-transition-delay: 1000ms; transition-delay: 1000ms; -webkit-transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: opacity 2000ms ease, -webkit-transform 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease; transition: transform 2000ms ease, opacity 2000ms ease, -webkit-transform 2000ms ease }
.main-slider-three__btn { font-weight: 800 }
.main-slider-three__btn:hover { }
.main-slider-three__btn:before { }
.main-slider-three .swiper-slide-active .main-slider-three__sub-title, .main-slider-three .swiper-slide-active .main-slider-three__title, .main-slider-three .swiper-slide-active .main-slider-three__btn-box { visibility: visible; opacity: 1; -webkit-transform: translateY(0) translateX(0); transform: translateY(0) translateX(0) }
.thm-btn { position: relative; display: inline-block; vertical-align: middle; -webkit-appearance: none; outline: none!important; background-color: #d99578; font-size: 14px; font-weight: 800; color: #ffffff; border-radius: 30px; padding: 15px 49px 15px; transition: all .5s linear; overflow: hidden; z-index: 1; }
.thm-btn i { margin-left: 10px; }
.thm-btn:before { content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; width: 0; height: 100%; background: #ffffff; border-radius: 0; transition: .6s ease-in-out; z-index: -1; }
.thm-btn:hover:before { width: 100%; left: 0; right: auto; }
@-webkit-keyframes float-bob-x {
0% {
transform:translateX(-30px)
}
50% {
transform:translateX(-10px)
}
100% {
transform:translateX(-30px)
}
}
@keyframes float-bob-x {
0% {
transform:translateX(-30px)
}
50% {
transform:translateX(-10px)
}
100% {
transform:translateX(-30px)
}
}
.float-bob-x { -webkit-animation-name: float-bob-x; animation-name: float-bob-x; -webkit-animation-duration: 10s; animation-duration: 10s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear }
/* banner下1样式 */
.about-one { position: relative; display: block; padding: 90px 0 120px; z-index: 1; }
.about-one__shape-1 { position: absolute; top: 0; left: 0; right: 0; height: 470px; background-position: top center; background-repeat: no-repeat; background-size: cover; z-index: -1; }
.about-one .container { max-width: 1320px; padding-left: 15px; padding-right: 15px; margin-right: auto; margin-left: auto; }
.about-one .row { display: flex; flex-wrap: wrap; }
.about-one .row .col { width: 50%; padding: 0 20px; flex: 0 0 auto; }
.about-one__left { position: relative; display: block; margin-right: 38px; }
.section-title { position: relative; display: block; margin-bottom: 48px; }
.section-title__tagline { position: relative; display: block; font-size: 15px; font-weight: 500; line-height: 27px; text-transform: uppercase; }
.section-title__title { position: relative; display: block; margin: 0; font-size: 55px; line-height: 60px; font-weight: 700; margin-top: 4px; }
.about-one__img { position: relative; display: block; }
.about-one__img img { width: 100%; border-radius: 4px; }
.about-one__experience { position: absolute; bottom: -32px; right: -62px; max-width: 323px; background-color: #d99578; display: flex; align-items: center; padding: 25px 22px 25px; border-radius: 4px; }
.about-one__experience-icon { position: relative; display: inline-block; margin-right: 12px; top: 3px; }
.about-one__experience-icon span { position: relative; display: inline-block; font-size: 57px; color: #ffffff; -webkit-transition: all 500ms linear; transition: all 500ms linear; -webkit-transition-delay: .1s; transition-delay: .1s; }
.about-one__experience-text { font-size: 20px; line-height: 32px; color: #fff; }
.about-one__right { position: relative; display: flex; flex-direction: column; justify-content: space-between; margin-left: 22px; margin-right: 22px; }
.about-one__digital-agency { position: relative; display: flex; }
.about-one__digital-agency-left { position: relative; display: block; align-items: center; background-color: #302e2f; max-width: 188px; border-radius: 10px; padding: 30px 23px 21px; }
.about-one__digital-agency-icon { position: relative; display: inline-block; margin-bottom: 5px; }
.about-one__digital-agency-icon span { position: relative; display: inline-block; font-size: 40px; color: #ffffff; -webkit-transition: all 500ms linear; transition: all 500ms linear; -webkit-transition-delay: .1s; transition-delay: .1s; }
.about-one__digital-agency-title { font-size: 20px; font-weight: 700; line-height: 30px; color: #fff; }
.about-one__digital-agency-right { position: relative; display: block; margin-left: 30px; }
.about-one__digital-agency-points { position: relative; display: block; }
.about-one__digital-agency-points li { position: relative; display: flex; align-items: center; }
.about-one__digital-agency-points li .icon { position: relative; display: inline-block; top: 4px; margin-right: 3px; }
.about-one__digital-agency-points li .icon span { font-size: 20px; }
.about-one__since { position: relative; display: flex; align-items: center; margin-top: 50px; margin-left: 18px; }
.about-one__since-title { position: relative; display: block; }
.about-one__since-title::before { position: absolute; content: ""; width: 64px; height: 75px; left: -11px; top: -12px; background-color: #f6eee7; z-index: -1; }
.about-one__since-title h2 { font-size: 45px; font-weight: 700; line-height: 55px; }
.about-one__experience-subtitle { position: relative; display: block; margin-left: 24px; }
.about-one__experience-subtitle p { font-size: 20px; font-weight: 700; line-height: 31px; }
.about-one__digital-agency-text { font-size: 18px; margin-top: 49px; font-weight: 500; }
.about-one__digital-agency-creativity { position: relative; display: flex; align-items: center; background-color: #f2ebe8; padding: 15px 25px 15px; border-radius: 3px; margin-top: 57px; margin-bottom: 50px; }
.about-one__digital-agency-creativity .icon { position: relative; display: inline-block; }
.about-one__digital-agency-creativity .icon span { position: relative; display: flex; align-items: center; justify-content: center; width: 80px; height: 80px; background-color: #ffffff; border-radius: 50%; font-size: 45px; color: #d99578; -webkit-transition: all 500ms linear; transition: all 500ms linear; -webkit-transition-delay: .1s; transition-delay: .1s; }
.about-one__digital-agency-creativity .text { position: relative; display: block; margin-left: 25px; }
.about-one__digital-agency-creativity .text h3 { font-size: 22px; font-weight: 600; line-height: 32px; }
.about-one__global-solutions { position: relative; display: block; margin-left: 25px; }
.about-one__global-solutions::before { position: absolute; content: ""; top: 7px; bottom: 9px; width: 5px; background-color: #302e2f; left: -25px; }
.about-one__global-solutions-title { font-size: 22px; font-weight: 600; line-height: 32px; }
.about-one__global-solutions-text-1 { font-size: 18px; padding-bottom: 17px; padding-top: 10px; font-weight: 500; }
.about-one__global-solutions-text-2 { font-size: 18px; font-weight: 500; }
/* 文章 */

.p_relative { position: relative; padding: 120px 0; /*background: url(../images/shape-bg.jpg); background-size: 100% 100%;*/ z-index: 0; }
.p_relative:before { position: absolute; content: ''; background: url(../images/main2bg.jpg); width: calc(50% - 100px); top: 0; right: 0; height: 100%; z-index: -1; }
.p_relative:after { position: absolute; content: ''; background: #fff; width: calc(50% - 100px); height: 2px; top: 50%; transform: translateY(-50%); right: 0; z-index: -1; }
.auto-container { position: static; max-width: 1320px; margin: 0 auto; }
.p_relative .row { display: flex; flex-wrap: wrap; justify-content: space-between; }
.p_relative .content_block_2 { height: 100%; display: flex; flex-direction: column; justify-content: space-between; }
.sec-title { margin-bottom: 5px; }
.sec-title h3 { margin-bottom: 10px; }
.sec-title h2 { display: block; font-size: 24px; line-height: 1.5; font-weight: 700; }
.content_block_2 .list { margin: 25px 0; }
.content_block_2 .list li { font-size: 18px; line-height: 32px; color: rgba(28, 32, 53, 0.8); font-weight: 400; display: flex; align-items: center; position: relative; background: url(../images/dot.png) center left; background-repeat: no-repeat; padding-left: 20px; }
.content_block_2 .list li a { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; position: relative; }
.events-block-one { display: flex; align-items: center; justify-content: space-between; margin-bottom: 80px; }
.events-block-one+.events-block-one { margin-bottom: 0; }
.events-block-one .inner-box { width: 68%; padding: 20px; }
.events-block-one .inner-box .image-box { width: 205px; height: 205px; margin: 0; overflow: hidden; position: absolute; left: 0; top: 0; }
.events-block-one .inner-box .image-box::before { position: absolute; top: 50%; left: 50%; z-index: 2; display: block; content: ''; width: 0; height: 0; background: rgba(255,255,255,.2); border-radius: 100%; -webkit-transform: translate(-50%, -50%); transform: translate(-50%, -50%); opacity: 0; }
.image-box { position: relative; width: 30%; border-radius: 6px; overflow: hidden; }
.post-date { width: 60px; height: 60px; position: absolute; bottom: 0; right: 0; font-size: 20px; background-color: #d99578; color: #fff; text-align: center; font-weight: 600; z-index: 2; display: flex; align-items: center; justify-content: center; flex-direction: column; border-radius: 6px; }
.post-date p { font-size: 18px; text-align: center; }
.post-date p+p { font-size: 14px; }
.image-box .mask { position: relative; width: 100%; height: 0; padding-bottom: 100%; }
.image-box a { position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: block; overflow: hidden; }
.image-box img { width: 100%; height: 100%; object-fit: cover; }
.events-block-one .inner-box .info { margin-bottom: 1px; display: flex; }
.events-block-one .inner-box .info li { display: flex; align-items: center; margin-right: 8px; font-weight: 500; font-size: 14px; position: relative; }
.events-block-one .inner-box .info li i { color: #d99578; margin-right: 5px; }
.events-block-one .inner-box h3 { margin-bottom: 40px; line-height: 30px; font-weight: 700; display: block; font-size: 24px; position: relative; font-family: 'DM Sans', sans-serif; margin: 0; transition: all 500ms ease; }
.events-block-one .inner-box h3 a { text-align: justify; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; word-break: break-all; -webkit-box-orient: vertical; text-overflow: ellipsis; white-space: pre-wrap; }
.events-block-one .inner-box p { margin: 0; text-align: justify; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; word-break: break-all; -webkit-box-orient: vertical; text-overflow: ellipsis; white-space: pre-wrap; }
/* 主页新闻 */
.news-section .pattern-layer { position: absolute; left: -100px; top: -20px; width: 350px; height: 400px; background-repeat: no-repeat; background-size: 100% 100%; z-index: -1; }
.news-section .sec-title { text-align: center; margin-bottom: 50px; }
.news-section .sec-title span:before { left: 50%!important; transform: translateX(-50%); right: inherit!important; }
.news-section .col-3 { width: 32%; }
.news-block-one { background: #fff; padding: 40px 20px; border-radius: 6px; box-shadow: 0 0 40px rgb(0 0 0 / 10%); }
.news-block-one .inner-tit { line-height: 2; display: flex; justify-content: space-between; align-items: center; }
.news-block-one .inner-tit a { width: 30px; height: 36px; background: #d99578; -webkit-mask: url(../images/more.png); mask: url(../images/more.png); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; }
.news-block-one .inner-tit a:hover { background: #ffc1a6; }
.news-block-one .inner-box { position: relative; display: flex; justify-content: space-between; margin: 30px 0; }
.news-block-one .inner-box .image-box { width: 45%; }
.news-block-one .inner-box .image-box .mask { position: relative; background: #fff; width: 100%; height: 0; padding-bottom: 66%; }
.news-block-one .inner-box .image { border-radius: 6px; overflow: hidden; background: #0b0e6c; position: absolute; top: 0; right: 0; width: 100%; height: 100%; display: block; margin: 0; }
.news-block-one .inner-box .image img { width: 100%; height: 100%; object-fit: cover; transition: all 500ms ease; }
.news-block-one .inner-box .lower-content { width: 52%; }
.news-block-one ul { display: flex; flex-direction: column; }
.news-block-one li { font-size: 18px; line-height: 2; position: relative; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; background: url(../images/dot.png) center left; background-repeat: no-repeat; padding-left: 20px; }
.news-block-one .inner-box .lower-content h3 { display: block; line-height: 34px; font-size: 18px; }
.news-block-one .inner-box .lower-content h3 a { text-align: justify; max-width: 100%; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 3; word-break: break-all; -webkit-box-orient: vertical; text-overflow: ellipsis; white-space: pre-wrap; line-height: 25px; }
/* exhibition */
.exhibition-one { position: relative; display: block; background: #302e2f; padding: 0; z-index: 1; }
.exhibition-one .row { display: flex; width: 90%; margin: 0 auto; justify-content: space-between; }
.exhibition-one .row .col { width: 50%; overflow: hidden; }
.exhibition-one .row .col .swiper-slide { width: 100%; height: 100%; }
.exhibition-one .row .col .swiper-slide a { width: 100%; height: 0; padding-bottom: 63%; position: relative; display: block; }
.exhibition-one .row .col .swiper-slide .exhibition-pic { width: 100%; height: 100%; position: absolute; top: 0; left: 0; }
.exhibition-one .row .col .swiper-slide a:before { position: absolute; content: ""; height: 0; width: 5px; left: 0; top: 0; transition: all .4s; background-color: #d99578; z-index: 1; }
.exhibition-one .row .col .swiper-slide a:hover:before { height: 33px }
.exhibition-one .row .col .swiper-slide img { width: 100%; height: 100%; object-fit: cover; }
.exhibition-one .row .col.black { width: 40%; background: #302e2f; padding: 40px 0 40px; }
.exhibition-one .mask { display: block; width: 100%; height: 0; padding-top: 60%; position: relative; }
.exhibition-one .exhibition-tit { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.exhibition-one .exhibition-tit img { width: 100%; height: 100%; object-fit: cover; }
.exhibition-title { margin: 0 auto; }
.exhibition-title p { line-height: 30px; color: #7e7e7e; }
.exhibition-title h5 { color: #ffffff; margin-bottom: 15px; }
.exhibition-one .exhibition-link { width: 100%; }
.exhibition-one .exhibition-pic { width: 100%; height: 100%; }
.exhibition-one .portfolio-inner { position: absolute; left: 0; bottom: 0; padding: 30px; color: #ffffff; }
.portfolio-inner span { display: block; padding-bottom: 7px; position: relative; }
.portfolio-inner span:before { position: absolute; content: ''; width: 60px; height: 1px; left: 0; bottom: 0; background-color: #d99578; }
.portfolio-inner h3 { margin-bottom: 0; line-height: 1.4; font-size: 20px; font-weight: bold; }
.portfolio-inner h3 a { overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; word-break: break-all; -webkit-box-orient: vertical; text-overflow: ellipsis; white-space: pre-wrap; }
.exhibition-one .gen-button1 { position: absolute; right: 0; bottom: 0; opacity: 0; -webkit-transition: all 0.5s ease-in-out; transition: all 0.5s ease-in-out; z-index: 1; background: #d99578; color: #ffffff; padding: 15px; }
.exhibition-one .swiper-slide a:hover .gen-button1 { opacity: 1; }
.exhibition-one .exhibition-link ul { display: flex; flex-wrap: wrap; justify-content: space-between; }
.exhibition-one .exhibition-link ul li { width: 30%; margin-bottom: 20px; border: 6px solid #ffffff; }
.exhibition-one .exhibition-link ul i { width: 30%; }
.exhibition-one .exhibition-link ul li.active { border: 6px solid #d99578; }
/*第二新闻样式 */
.aboutCompany01 { padding: 73px 0; background: url(../images/main1.jpg); }
.aboutCompany01.times { padding: 0 0 73px; }
.aboutCompany01 .container { max-width: 1320px; margin-right: auto; margin-left: auto; }
.aboutCompany01 .row { display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; justify-content: space-between; }
.aboutCompany01-LeftContent { width: 100%; height: 0; position: relative; padding-bottom: 56.25%; }
.aboutCompany01-LeftContent .row { width: 100%; }
.aboutCompany01-LeftContent .col-news { position: absolute; top: 0; right: 0; width: 100%; height: 100%; }
.aboutCompany01-LeftContent .col-news a { display: block; width: 100%; height: 100%; border-radius: 6px 6px 0 0; overflow: hidden; }
.aboutCompany01-LeftContent .col-news img { width: 100%; height: 100%; object-fit: cover; }
.homeAbout-company-mainThumb img { width: 100%; }
.col-news .date { position: absolute; bottom: -15px; right: 15px; background-color: #d99578; color: #fff; display: flex; align-items: center; justify-content: center; flex-direction: column; width: 60px; height: 60px; border-radius: 6px; }
.col-news .date p { font-size: 18px; text-align: center; }
.col-news .date p+p { font-size: 14px; }
.col-hf .portfolio-inner { border-radius: 0 0 6px 6px; overflow: hidden; width: 100%; padding: 20px; background: #ffffff; z-index: 1; box-shadow: 0 0.125rem 0.125rem -0.125rem rgb(31 27 45 / 8%), 0 0.25rem 0.75rem rgb(31 27 45 / 28%) }
.aboutHm01-col5 { flex: 0 0 auto; width: 40%; }
.aboutHm01-col7 { width: 55%; }
.aboutHm01-col7 a { display: block; border-radius: 6px; overflow: hidden; position: relative; width: 100%; height: 100%; }
.aboutHm01-col7 a span { width: 100%; height: 60px; background: linear-gradient(#00000000, #000000c2); padding-top: 30px; font-weight: bold; position: absolute; bottom: 0; right: 0; color: #ffffff; text-align: center; }
.aboutHm01-col7 img { width: 100%; height: 100%; object-fit: cover; }
.anmoCounter { text-align: center; background: url(../images/yes.jpg) no-repeat; background-size: 100% 100%; width: 100%; height: 100%; border-radius: 6px; padding: 33px 9px; display: flex; flex-direction: column; justify-content: center; }
.anmoCounter01 { position: relative; margin: 0 0 3px; }
.anmoCounter01 .timer { color: #fff; margin-bottom: 0; font-size: 60px; }
.anmoCounter01 .timerSuffix { color: #fff; font-size: 18px; }
.anmoCounter01-desc { font-size: 22px; line-height: 30px; font-family: "Kumbh Sans", sans-serif; font-weight: 400; color: #fff; }
.about-company-content { height: 100%; display: flex; flex-direction: column; justify-content: space-between; }
.secSubTitle { display: inline-block; position: relative; border-radius: 4px; font-size: 2rem; line-height: 30px; padding: 0 30px; font-weight: 500; margin: 0; font-family: "Kumbh Sans", sans-serif; text-transform: uppercase; }
.secSubTitle::before { width: 16px; height: 20px; content: ""; display: block; position: absolute; left: 0; top: 50%; margin-top: -10px; background: url(../images/kw-icon.png) no-repeat center; background-size: auto 100%; }
.secSubTitle::after { width: 16px; height: 20px; content: ""; display: block; -webkit-transform: rotate(-180deg); transform: rotate(-180deg); position: absolute; right: 0; top: 50%; margin-top: -10px; background: url(../images/kw-icon.png) no-repeat center; background-size: auto 100%; }
.about-company-content .secTitle { display: flex; justify-content: center; align-items: center; }
.about-company-content .secTitle a { max-width: calc(100% - 81px); font-size: 20px; line-height: 45px; text-align: center; font-weight: bold; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.about-company-content .secTitle .rgt { font-size: 18px; font-weight: normal; background: #c62828; color: #fff; padding: 2px 4px; border-radius: 4px; margin-right: 5px; }
.about-company-content .secTitle .date { color: #8b8b8b; font-size: 14px; width: 60px; text-align: right; }
.iconBox02 { display: flex; flex-direction: column; margin-bottom: 10px; }
.iconBox02 .tit { display: flex; flex-direction: row; justify-content: space-between; align-items: center; margin-bottom: 10px; }
.iconBox02 .tit a { width: 30px; height: 30px; background: #d99578; -webkit-mask: url(../images/more.png); mask: url(../images/more.png); -webkit-mask-repeat: no-repeat; mask-repeat: no-repeat; -webkit-mask-position: center; mask-position: center; -webkit-mask-size: contain; mask-size: contain; }
.iconBox02 .tit a:hover { background: #ffc1a6; }
.iconBox02 ul { }
.iconBox02 li { font-size: 18px; line-height: 2; color: rgba(28,32,53,0.8); font-weight: 400; display: flex; align-items: center; justify-content: space-between; background: url(../images/dot.png) center left; background-repeat: no-repeat; padding-left: 20px; }
.iconBox02 li a { max-width: calc(100% - 45px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; position: relative; padding-right: 5px; }
.iconBox02 li a em { position: absolute; top: 5px; right: 0; background-color: #c62828; display: block; width: 8px; height: 8px; border-radius: 50%; }
.iconBox02 li span { color: #8b8b8b; font-size: 14px; width: 45px; text-align: right; }
.aboutCompany01-readMore { background: #d99578; display: -webkit-box; display: -ms-flexbox; display: flex; -webkit-box-align: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -ms-flex-pack: justify; justify-content: space-between; padding: 20px; height: 100%; border-radius: 6px; }
.aboutCompany01-readMore .lhh { width: 25%; padding: 10px; display: flex; flex-direction: column; align-items: center; border-right: 1px solid #e1a992; }
.aboutCompany01-readMore .lhh a { display: flex; flex-direction: column; align-items: center; transition: .35s ease-in; }
.aboutCompany01-readMore .lhh a:hover { margin-bottom: 5px; transition: .35s ease-in; text-shadow: 0 2px 4px rgb(0 0 0 / 40%); }
.aboutCompany01-readMore .lhh:nth-child(4) { border-right: none; }
.lhh .icon { font-size: 5rem; color: #FFFFFF; }
.lhh .t { color: #FFFFFF; }
.anmoBTN01 { font-family: "Kumbh Sans", sans-serif; display: inline-block; position: relative; height: 60px; min-width: 157px; font-size: 16px; line-height: 59px; color: #fff; font-weight: 500; text-transform: capitalize; text-align: center; overflow: hidden; border: 0; z-index: 1; background: #d99578; border-radius: 3px; transition: all ease 350ms; -moz-transition: all ease 350ms; -webkit-transition: all ease 350ms; }
/* banner2样式 */

.gen-banner { width: 100%; background: url(../images/bg1.jpg); background-size: cover!important; background-position: center center!important; background-repeat: no-repeat!important; }
.gen-banner .swiper-slide { position: relative; width: 100%; height: 500px; background-size: cover!important; background-position: center center!important; background-repeat: no-repeat!important; }
.gen-banner .swiper-slide:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: inline-block; background-color: #302e2f; }
.gen-banner .container { max-width: 1710px; height: 100%; margin: 0 auto; }
.flex-row-reverse { height: 100%; padding: 0 20px; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; margin-right: -15px; margin-left: -15px; flex-direction: row-reverse; align-items: center; }
.col-hf { width: 48%; }
.col-hf .inner-content { display: flex; flex-direction: column; justify-content: space-between; height: 100%; }
.gen-front-image { position: relative; display: inline-block; width: 100%; }
.gen-front-image:before { content: ""; position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: inline-block; opacity: .4; }
.gen-front-image img { width: 100%; }
.gen-banner .swiper-slide.swiper-slide-active .gen-front-image { -webkit-animation: fadeInLeft .6s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both; animation: fadeInLeft .6s cubic-bezier(0.390, 0.575, 0.565, 1.000) 1s both; }
.gen-front-image a { margin: auto; text-align: center; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%, -50%); -ms-transform: translate(-50%, -50%); transform: translate(-50%, -50%); }
.gen-front-image a i { height: 90px; width: auto; }
.gen-front-image a span { color: #ffffff; margin: 15px 0 0 0; padding: 0; font-size: 24px; line-height: normal; display: flex; }
.gen-banner .swiper-slide.swiper-slide-active .gen-tag-line { -webkit-animation: fadeInRight .6s cubic-bezier(0.390, 0.575, 0.565, 1.000) .2s both; animation: fadeInRight .6s cubic-bezier(0.390, 0.575, 0.565, 1.000) .2s both; }
.col-hf .gen-tag-line { text-transform: uppercase; letter-spacing: 4px; font-weight: 600; font-size: 20px; line-height: 28px; margin: 0 0 15px 0; border-left: 2px solid #ffffff; padding: 0 0 0 15px; color: #ffffff; }
.gen-banner .swiper-slide.swiper-slide-active .gen-movie-meta-holder { -webkit-animation: fadeInRight .6s cubic-bezier(0.390, 0.575, 0.565, 1.000) .6s both; animation: fadeInRight .6s cubic-bezier(0.390, 0.575, 0.565, 1.000) .6s both; }
.col-hf .gen-movie-info h3 { font-size: 62px; line-height: 70px; text-transform: uppercase; color: #ffffff; }
.gen-banner .swiper-slide.swiper-slide-active .gen-movie-info { -webkit-animation: fadeInRight .6s cubic-bezier(0.390, 0.575, 0.565, 1.000) .4s both; animation: fadeInRight .6s cubic-bezier(0.390, 0.575, 0.565, 1.000) .4s both; }
.col-hf .gen-movie-meta-holder ul.gen-meta-after-title { margin: 5px 0 15px; padding: 0; display: flex; align-items: center; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.gen-movie-meta-holder ul.gen-meta-after-title li { list-style: none; color: #ffffff; margin: 10px 0 0 20px; padding: 0 0 0 20px; font-size: 16px; line-height: normal; display: flex; float: left; align-items: center; position: relative; }
.gen-movie-meta-holder ul.gen-meta-after-title li:before { content: ""; position: absolute; top: 50%; margin-top: -2px; left: -2px; height: 4px; width: 4px; display: inline-block; background: #ffffff; opacity: .8; -webkit-border-radius: 900px; -moz-border-radius: 900px; border-radius: 900px; }
.gen-movie-meta-holder ul.gen-meta-after-title li:first-child { margin-left: 0; padding-left: 0; }
.gen-movie-meta-holder ul.gen-meta-after-title li:last-child { margin-right: 0; padding-right: 0; }
.gen-movie-meta-holder ul.gen-meta-after-title li.gen-sen-rating span { color: #ffffff; border: 1px solid #ffffff; padding: 2px 8px; }
.gen-movie-meta-holder ul.gen-meta-after-title li img { height: 25px; width: auto; margin-right: 10px; float: left; }
.gen-movie-meta-holder ul.gen-meta-after-title li.gen-sen-rating span { color: #ffffff; border: 1px solid #ffffff; padding: 2px 8px; }
.gen-movie-meta-holder p, .gen-movie-contain-style-2 .gen-movie-info p { display: inline-block; width: 100%; color: #ffffff; font-size: 18px; margin-bottom: 20px; }
.gen-movie-contain-style-2 .gen-movie-meta-holder .gen-meta-info ul { margin: 0 0 40px; padding: 0; }
.gen-movie-meta-holder .gen-meta-info ul li { margin: 0 0 5px; padding: 0; list-style: none; color: #ffffff; font-size: 18px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }
.gen-movie-contain-style-2 .gen-movie-meta-holder .gen-meta-info ul li strong { }
.gen-banner .swiper-slide.swiper-slide-active .gen-movie-action { -webkit-animation: fadeInRight .6s cubic-bezier(0.390, 0.575, 0.565, 1.000) .8s both; animation: fadeInRight .6s cubic-bezier(0.390, 0.575, 0.565, 1.000) .8s both; }
.gen-movie-contain-style-2 .gen-movie-action .gen-btn-container { display: inline-block; margin-right: 30px; }
.gen-button { text-transform: uppercase; position: relative; width: auto; font-weight: 400; background: #d99578; color: #ffffff; font-size: 16px; padding: 12px 30px; line-height: 2; vertical-align: middle; border-radius : 6px; display: inline-block; overflow: hidden; z-index: 1; }
.gen-button:before { content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; width: 0; height: 100%; background: #ffffff; border-radius: 0; transition: .6s ease-in-out; z-index: -1; }
.gen-button:hover:before { width: 100%; left: 0; right: auto }
.gen-button i { margin-right: 10px; }
.gen-button span { z-index: 9; position: relative; }
/* foot上样式 */
.team-area-with-color { padding: 100px 0; background-image: -webkit-gradient(linear, right top, left top, from(#d99578), color-stop(70%, #302e2f)); background-image: linear-gradient(-90deg, #d99578 0%, #302e2f 70%); overflow: hidden; position: relative; z-index: 1; }
.team-area-with-color .container-fluid { position: relative; width: 100%; overflow: hidden; left: calc((100% - 1320px)/2); }
.team-area-with-color .container-fluid .row { display: flex; flex-wrap: wrap; align-items: center; }
.team-area-with-color .container-fluid .col-lf { flex: 0 0 auto; width: 25%; }
.team-box-content { margin-right: 20px; color: #ffffff; }
.team-box-content span { display: block; margin-bottom: 15px; color: #7e7e7e; }
.team-box-content h3 { margin-bottom: 12px; }
.team-box-content p { margin-bottom: 0; }
.team-box-content .team-btn { margin-top: 20px; }
.team-area-with-color .container-fluid .col-rt { flex: 0 0 auto; width: 75%; overflow: hidden; }
.team-area-with-color .swiper-slide { opacity: 0.6; transition: all 1s ease 0s; border-radius: 6px; overflow: hidden; }
.team-area-with-color .swiper-slide.swiper-slide-active, .team-area-with-color .swiper-slide.swiper-slide-next { opacity: 1; }
.team-area-with-color .swiper-slide .mask { width: 100%; height: 0; padding-top: 65%; position: relative; }
.team-area-with-color .swiper-slide .team-image { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; }
.team-area-with-color .swiper-slide .team-image img { width: 100%; height: 100%; object-fit: cover; }
.team-area-with-color .swiper-slide .team-content { background: #302e2f; padding: 25px; position: relative; z-index: 1; overflow: hidden; }
.team-area-with-color .swiper-slide .team-content:before { content: ''; display: block; position: absolute; top: 0; right: 0; bottom: 0; width: 0; height: 100%; background: #1a191a; border-radius: 0; transition: .6s ease-in-out; z-index: -1; }
.team-area-with-color .swiper-slide:hover .team-content:before { width: 100%; left: 0; right: auto }
.team-area-with-color .swiper-slide .team-content h3 { font-size: 24px; margin-bottom: 0; }
.team-area-with-color .swiper-slide .team-content h3 a { color: #ffffff; }
.team-area-with-color .swiper-slide .team-content span { font-size: 15px; color: #ffffff; display: block; margin-top: 12px; }
.team-shape-1 { position: absolute; top: 20%; left: 25%; -webkit-transform: translateY(-20%) translateX(-25%); transform: translateY(-20%) translateX(-25%); }
/* 列表页样式 */
.nyrttitle { height: 80px; line-height: 80px; }
.nyrttitle .rttitlenav { font-size: 1.4rem; color: #333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.list-child { width: 100%; overflow: hidden; margin: 0 auto; display: flex; flex-wrap: wrap; justify-content: center; }
.list-child a { margin: 0 3px 10px; padding: 8px 15px; background: url(../images/an.png) no-repeat; background-size: 100% 100%; display: inline-block; font-size: 14px; font-weight: 700; }
.main.bkli .list-child a { background: #d2d2d2; -webkit-box-shadow: 2px 2px 3px 0 #98a0a1; -moz-box-shadow: 2px 2px 3px 0 #98a0a1; box-shadow: 2px 2px 3px 0 #98a0a1; }
.list-child a:hover { background: url(../images/an1.png) #d99578 no-repeat; background-size: 100% 100%; color: #ffffff; }
.class-tit h3 { font-size: 24px; font-weight: bold; line-height: 50px; }
.list-child .lfaon { background: url(../images/an1.png) #d99578 no-repeat; background-size: 100% 100%; color: #ffffff; }
.class-list-img li { width: 100%; border: solid 1px #ebebeb; border-radius: 4px; background: #ffffff; margin: 20px 0; padding: 20px; overflow: hidden; display: flex; justify-content: space-between; box-shadow: 0px 12px 13px rgb(121 121 121 / 10%); }
.list_wrap { padding: 30px 0; }
.class-list-img li:hover { box-shadow: 8px 6px 13px #ccc; transition: all 300ms ease 0s; }
.class-list-img li .mask { width: 20%; overflow: hidden; }
.class-list-img li .mask a { width: 100%; height: 0; padding-top: 63.63%; position: relative; display: block; overflow: hidden; border-radius: 4px; }
.class-list-img li img { width: 100%; height: 100%; object-fit: cover; position: absolute; top: 0; left: 0; }
.class-list-img .tit { width: 78%; display: flex; flex-direction: column; justify-content: space-between; }
.class-list-img .oth { color: #8b8b8b; font-size: 1.4rem; display: flex; justify-content: space-between; align-items: center; }
.class-list-img .oth i { margin: 0 10px; color: #d99578 }
.class-list-img .oth .othbg { display: flex; justify-content: space-between; align-items: center; }
.class-list-img .titt { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.class-list-img .titt a { font-weight: 600; font-size: 2.4rem; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; word-break: break-all; -webkit-box-orient: vertical; text-overflow: ellipsis; white-space: pre-wrap; }
.class-list-img .dspt { font-size: 1.6rem; line-height: 24px; color: #646464; }
.class-list-img .dspt a { color: #9d9d9d; }
.class-list-img li a:hover { color: #d99578; }
.class-list li { width: 100%; display: flex; justify-content: space-between; line-height: 55px; border-bottom: dashed 1px #c8c8c8; overflow: hidden; }
.class-list li a { font-size: 18px; color: #333; max-width: calc(100% - 90px); overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.class-list li a:hover { color: #cfa06b; }
.class-list li span { font-size: 14px; color: #8b8b8b; width: 80px; text-align: right; }
.class-img ul { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 40px; }
.class-img li { width: 30%; background: #ffffff; padding: 5px; border-radius: 8px; box-shadow: 0 11px 16.15px 0.85px rgb(121 121 121 / 7%); }
.class-img ul > i { width: 30%; }
.class-img li .mask { width: 100%; height: 0; padding-bottom: 60%; position: relative; }
.class-img li .mask2 { width: 100%; height: 100%; position: absolute; overflow: hidden; left: 0; top: 0; display: block; }
.class-img li img { width: 100%; height: 100%; object-fit: cover; position: absolute; border-radius: 4px; }
.class-img li .titt { padding: 15px; }
.class-img li .titt a { font-size: 2.2rem; font-family: 'kaiti'; text-align: justify; max-width: 100%; overflow: hidden; display: -webkit-box; -webkit-line-clamp: 2; word-break: break-all; -webkit-box-orient: vertical; text-overflow: ellipsis; white-space: pre-wrap; line-height: 25px; text-shadow: 0 2px 4px rgb(0 0 0 / 20%); }
.class-img li:hover { box-shadow: 8px 6px 13px #ccc; }
.class-img li:hover img { }
/* 页码 */
#MultiPage { padding: 20px 0 50px; font-size: 1.4rem; display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
#MultiPage span { display: inline; line-height: 26px; height: 26px; }
#MultiPage a { border: 1px solid #d99578; border-radius: 4px; display: inline; background: #ffffff; overflow: hidden; padding: 0 9px; color: #d99578; line-height: 26px; height: 26px; text-align: center; text-decoration: none; }
#MultiPage>a>b { background: none; border: none; color: #d99578; }
#MultiPage b { border: 1px solid #d99578; border-radius: 4px; display: inline; background: #d99578; overflow: hidden; padding: 0 9px; color: #ffffff; line-height: 26px; height: 26px; text-decoration: none; text-align: center; }
#MultiPage a:hover { border: 1px solid #cccccc; background: #FFF; color: #676568; text-decoration: none; }
/* 内容页样式*/
.news-txt { background: url(../images/main1.jpg); padding-bottom: 50px; margin-top: 81px; }
.news-list { margin-top: 81px; background: url(../images/main1.jpg); }
.txt-wrap { border: solid 1px #cecece; background : #fff; padding: 30px 100px; margin-top: 30px; background-image: url(../images/acts1.jpg), url(../images/acts2.jpg), url(../images/acts3.jpg), url(../images/acts4.jpg); background-repeat: no-repeat, no-repeat, no-repeat, no-repeat; background-position: top left, top right, bottom right, bottom left; }
.txt-wrap h2 { font-size: 2.6rem; font-weight: normal; line-height: 50px; text-align : center; margin: 40px 0 20px 0; }
.news_time { display: block; font-size: 1.4rem; color: #b4ab97; text-align: center; padding: 10px 0; }
.news_time i+i { margin-left: 20px; }
.fenge { height: 10px; background: url(../images/listqtws.png) repeat-x; background-size : contain; margin-bottom: 50px; }
.bodytext { min-height: 642px; padding-bottom: 50px; }
.bodytext p { font-size: 1.8rem; line-height: 33px; text-indent: 3.6rem; text-align: justify; margin-bottom: 20px; }
.bodytext p img { max-width: 100% !important; height: auto !important; display: block; margin: 0 auto; }
.bodytext h5 { text-align: center; padding: 30px 0; }
.bodytext h5 a { display: inline-block; text-align: center; color: #ffffff; font-weight: bold; width: 90px; line-height: 30px; height: 90px; background: url(../images/download.jpg) no-repeat; background-size: 100% 100%; }
.bodytext h6 { font-weight: bold; line-height: 1.5; text-align: center; margin-bottom: 20px; }
.m_t { border-top: 1px solid #d9d9d9; padding-top: 15px }
.m_t .next { display: block; color: #d99578; line-height: 2; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* foot样式 */
.footer-bg { background-position: -180px center!important; background-size: cover; padding-top: 90px; }
.footer-top { padding-bottom: 70px; border-bottom: 1px solid #1e1e1e; }
.footer-top .container { max-width: 1320px; padding-right: .75rem; padding-left: .75rem; margin-right: auto; margin-left: auto; }
.footer-top .container .row { display: flex; flex-wrap: wrap; justify-content: space-between!important; }
.footercol1 { width: 33.33%; padding: 0 20px; }
.footer-widget { display: flex; flex-direction: column; height: -webkit-fill-available; }
.footercol1 .f-contact { height: -webkit-fill-available; }
.footercol2 { height: -webkit-fill-available; display: flex; flex-direction: column; }
.recent-blog-footer { height: -webkit-fill-available; }
.footercol3 { width: 16.66%; padding: 0 20px; }
.footer-link { height: -webkit-fill-available; display: flex; flex-direction: column; justify-content: space-between; }
.footercol4 { width: 25%; padding: 0 20px; }
.f-widget-title h2, .footer-widget .widgettitle { font-size: 24px; margin-bottom: 5px; position: relative; padding-bottom: 30px; color: #fff; }
.footer-widget p { color: #ffffff; text-align: justify; line-height: 1.5; }
.friend-link { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 10px; }
.friend-link a { color: #ffffff; }
.footer-social { margin-top: 10px; }
.recent-blog-footer ul { height: -webkit-fill-available; display: flex; flex-direction: column; justify-content: space-between; }
.recent-blog-footer li { margin-bottom: 5px; }
.recent-blog-footer li i { display: table-cell; position: relative; vertical-align: middle; color: #8b8b8b; }
.recent-blog-footer li i:before { margin-right: 15px; width: 30px; height: 30px; line-height: 30px; background: #3b3b3b; border-radius: 3px; font-size: 12px; display: block; text-align: center; }
.recent-blog-footer li span { color: #ffffff; display: table-cell; vertical-align: middle; }
.p-relative { overflow: hidden; position: relative; }
.p-relative .search-field { padding: 0 1rem; width: 100%; height: 50px; border-radius: 5px; outline: none !important; margin-bottom: 0; border: 1px solid #f8f8f8; background: #f8f8f8; }
.p-relative .search-submit { position: absolute; right: 5px; top: 5px; border-radius: 4px; background: #d99578; border: 0; color: #ffffff; padding: 0 15px; line-height: 40px; cursor: pointer; }
.footer-input { padding: 0 1rem; width: 100%; height: 70px; border-radius: 5px; outline: none!important; margin-bottom: 0; border: 1px solid #f8f8f8; background: #f8f8f8; }
.footer-btn { position: absolute; right: 15px; top: 15px; bottom: 15px; border-radius: 4px; background: #d99578; border: 0; color: #fff; padding: 5px 15px; }
.footer-social a { font-size: 16px; display: inline-block; margin-right: 10px; width: 40px; height: 40px; border-radius: 50%; background-color: #fff47; text-align: center; line-height: 40px; color: #d99578!important }
.footer-social a:hover { background: #d99578; color: #fff!important }
.f-widget-title h2, .footer-widget .widgettitle { font-size: 24px; margin-bottom: 5px; position: relative; padding-bottom: 30px; color: #fff }
.f-widget-title h2::before, .footer-widget .widgettitle::before { content: ""; position: absolute; left: 0; bottom: 20px; height: 1px; width: 45px; background: #d99578; }
.footer-link ul li i { color: #d99578; margin-right: 5px }
.footer-link ul li a { color: #ffffff; display: inline-block }
.footer-link ul li a::before { font-family: "fontawesome"; content: "\f0a9"; margin-right: 8px; color: #d99578; font-size: 18px }
.footer-link ul li a:hover { color: #fff }
.footer-link ul li { margin-bottom: 10px; }
.footer-link ul { display: flex; flex-direction: column; height: -webkit-fill-available; justify-content: space-between; }
.footer-link ul li:last-child { margin-bottom: 0 }
.copyright-wrap { color: #fff; font-size: 15px; border-top: 1px solid #403e3f; }
.copyright-wrap .container { max-width: 1320px; padding: 20px 0; margin: 0 auto; }
.copyright-wrap .container .row { display: flex; flex-wrap: wrap; align-items: center; }
.copyright-wrap .container .row .col { width: 33.333333%; display: flex; justify-content: center; }
.copyright-wrap .container .row .col.btlogo img { width: 40px; }
.copyright-wrap a { display: flex; justify-content: flex-end; align-items: center; color: #fff; }
#scrollUp { background: #d99578; height: 45px; width: 45px; right: 50px; bottom: 77px; color: #fff; text-align: center; border-radius: 50%; border: 1px solid #ffffff; font-size: 22px; line-height: 45px; transition: .3s; }
#scrollUp:hover { background: #f4572e; }

@media only screen and (max-width: 1550px) {
.main-slider__nav { left: inherit; right: 0; }
header .nav-right .hotline { display: none; }
header .main-nav ul li { padding: 0 15px; }
}

@media only screen and (max-width: 1320px) {
header .header-btn { display: none; }
}

@media only screen and (max-width: 960px) {
.mobile-search { padding: 35px 20px; }
header { padding: 0 20px; top: 0; }
header .header-logo { padding: 15px 0; }
header .nav-right .header-icons { margin-right: 0; }
header .main-nav { position: fixed; top: 0; left: 0; width: 280px; padding: 30px 20px; z-index: 99999; height: 100%; overflow: auto; background: #000; -webkit-transform: translateX(-260px); transform: translateX(-100%); -webkit-transition: -webkit-transform .3s ease-in; transition: -webkit-transform .3s ease-in; transition: transform .3s ease-in; transition: transform .3s ease-in, -webkit-transform .3s ease-in; }
header .main-nav.show-menu { transform: translateX(0); }
.mobile-logo-area { display: block; display: flex; justify-content: space-between; align-items: center; }
.mobile-logo-area img { width: 80%; ; }
.mobile-menu-btn { display: block; color: #ffffff; }
header .main-nav ul { float: none; text-align: left; padding: 25px 10px 25px 0; }
header .main-nav ul li { display: block; position: relative; padding: 0 5px; }
header .main-nav ul li a { width: calc(100% - 60px); padding: 10px 0; display: block; font-weight: 300; }
header .main-nav ul li .fa { top: 8px; font-size: 16px; }
header .main-nav ul li ul.sub-menu { position: static; min-width: 200px; background: 0; border: 0; opacity: 1; visibility: visible; -webkit-box-shadow: none; box-shadow: none; -webkit-transform: none; transform: none; -webkit-transition: none; transition: none; display: none; margin-top: 0; transform: translateY(0px); }
.mobile-form { display: block; }
header .nav-right .hotline { display: none; }
header .header-btn { display: none; visibility: hidden; }
.main-slider { margin-top: 69px; }
.about-one .container { width: 100%; }
.about-one .row .col { width: 100%; }
.main-slider .image-layer { right: 0; width: 100%; background-size: cover; background-position: center center; }
.main-slider-shape-1 { display: none; }
.main-slider .container .col { width: 70%; padding-left: 35px; }
.main-slider__title { font-size: 30px; text-shadow: 0 2px 4px rgb(0 0 0 / 20%); }
.col-hf { width: 94%; margin: 0 auto; }
.col-hf+.col-hf { margin-top: 50px; }
.events-block-one .inner-box .info { display: none; }
.iconBox02+.iconBox02 { margin-top: 30px; }
.anmoCounter01 .timer { font-size: 48px; }
.exhibition-one .row { width: 100%; flex-direction: column; }
.exhibition-one .row .col { width: 100%; }
.exhibition-one .row .col.black { width: 100%; padding: 20px; }
.news-section .pattern-layer { left: -200px; }
.auto-container { width: 100%; }
.news-list>.auto-container, .news-txt>.auto-container { width: 94%; margin: 0 auto; }
.list_wrap { padding: 0; margin-top: 30px; }
.class-tit h3 { line-height: 30px; }
.class-img li { width: 47%; }
.class-img li .titt a { font-size: 1.8rem; }
.news-section .sec-title { margin-bottom: 0; }
.news-section .col-3 { width: 94%; margin: 0 auto; margin-top: 40px; }
.team-area-with-color { background-image: -webkit-gradient(linear, right top, left top, from(#d99578), color-stop(90%, #302e2f)); background-image: linear-gradient(-90deg, #d99578 0%, #302e2f 90%); }
.team-area-with-color .container-fluid { left: 0; }
.team-area-with-color .container-fluid .row { flex-wrap: wrap; flex-direction: column-reverse; }
.team-area-with-color .container-fluid .col-rt { width: 94%; }
.team-area-with-color .container-fluid .col-lf { width: 94%; margin-top: 50px; }
.p_relative:before { background: none; }
.class-list-img .dspt { display: none; }
.class-list-img li { padding: 8px; }
.class-list-img li .mask { width: 30%; }
.class-list-img .tit { width: 68%; }
.class-list-img .titt a { font-size: 2rem; }
.class-list-img .oth { font-size: 1.2rem; }
.news-txt, .news-list { margin-top: 69px; }
.txt-wrap { padding: 30px 20px; }
#scrollUp { right: 10px; }
.footer-top .container { width: 100%; }
.footercol1 { width: 100%; padding: 0 20px; }
.footercol2 { width: 100%; margin-top: 50px; padding: 0 20px; }
.footercol3 { display: none; }
.footercol4 { display: none; }
.copyright-wrap .container { width: 100%; ; }
.copyright-wrap .container .row .col { display: none; }
.copyright-wrap .container .row .col.btlogo { width: 100%; display: block; display: flex; justify-content: center; }
}