:root { --pad: -webkit-calc(50vw - 830px); --pad: calc(50vw - 830px); } @media (max-width: 1720px) { :root { --pad: -webkit-calc(50vw - 705px); --pad: calc(50vw - 705px); } } @media (max-width: 1470px) { :root { --pad: -webkit-calc(50vw - 660px); --pad: calc(50vw - 660px); } } @media (max-width: 1400px) { :root { --pad: -webkit-calc(50vw - 570px); --pad: calc(50vw - 570px); } } @media (max-width: 1199px) { :root { --pad: 6vw; } } @media (max-width: 991px) { :root { --pad: 7.5vw; } } @media (max-width: 767px) { :root { --pad: 15px; } } @-webkit-keyframes fadeInUp { from { -webkit-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } @keyframes fadeInUp { from { -webkit-transform: translate3d(0, 50%, 0); transform: translate3d(0, 50%, 0); opacity: 1; } to { -webkit-transform: none; transform: none; opacity: 1; } } @-webkit-keyframes fadeInDown { from { -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0); opacity: 0; } to { -webkit-transform: none; transform: none; opacity: 1; } } @keyframes fadeInDown { from { -webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0); opacity: 0; } to { -webkit-transform: none; transform: none; opacity: 1; } } :root { --pad: -webkit-calc(50vw - 845px); --pad: calc(50vw - 845px); } @media (max-width: 1720px) { :root { --pad: -webkit-calc(50vw - 705px); --pad: calc(50vw - 705px); } } @media (max-width: 1470px) { :root { --pad: -webkit-calc(50vw - 660px); --pad: calc(50vw - 660px); } } @media (max-width: 1400px) { :root { --pad: -webkit-calc(50vw - 570px); --pad: calc(50vw - 570px); } } @media (max-width: 1199px) { :root { --pad: 6vw; } } @media (max-width: 991px) { :root { --pad: 7.5vw; } } @media (max-width: 767px) { :root { --pad: 15px; } } .ff, .banner .mobile-video:before { font-family: 'iconfont' !important; } .iconfont { font-size: inherit; } @font-face { font-family: 'Fredoka'; font-weight: 500; font-style: normal; src: local('Fredoka Medium'), local('Fredoka-Medium'), url('../fonts/Fredoka-Medium.woff2') format('woff2'), url('../fonts/Fredoka-Medium.woff') format('woff'), url('../fonts/Fredoka-Medium.ttf') format('truetype'); font-display: swap; } @font-face { font-family: 'Fredoka'; font-weight: 600; font-style: normal; src: local('Fredoka SemiBold'), local('Fredoka-SemiBold'), url('../fonts/Fredoka-SemiBold.woff2') format('woff2'), url('../fonts/Fredoka-SemiBold.woff') format('woff'), url('../fonts/Fredoka-SemiBold.ttf') format('truetype'); font-display: swap; } @font-face { font-family: 'Onest'; font-weight: normal; font-style: normal; src: local('Onest Regular'), local('Onest-Regular'), url('../fonts/Onest-Regular.woff2') format('woff2'), url('../fonts/Onest-Regular.woff') format('woff'), url('../fonts/Onest-Regular.ttf') format('truetype'); font-display: swap; } @font-face { font-family: 'Onest'; font-weight: 600; font-style: normal; src: local('Onest SemiBold'), local('Onest-SemiBold'), url('../fonts/Onest-SemiBold.woff2') format('woff2'), url('../fonts/Onest-SemiBold.woff') format('woff'), url('../fonts/Onest-SemiBold.ttf') format('truetype'); font-display: swap; } @font-face { font-family: 'Onest'; font-weight: bold; font-style: normal; src: local('Onest Bold'), local('Onest-Bold'), url('../fonts/Onest-Bold.woff2') format('woff2'), url('../fonts/Onest-Bold.woff') format('woff'), url('../fonts/Onest-Bold.ttf') format('truetype'); font-display: swap; } body { font-family: 'Onest', Arial, Helvetica, 'Microsoft YaHei', 'WenQuanYi Micro Hei', 'Heiti SC', 'PingFang SC', 'Hiragino Sans GB', sans-serif; font-size: 16px; font-weight: normal; overflow-x: hidden; color: #000; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; -ms-scroll-chaining: none; overscroll-behavior: none; } @media (max-width: 767px) { body { font-size: 14px; } } .row { --bs-gutter-x: 1.875rem; } :root { scroll-behavior: unset; } .img-box { position: relative; z-index: 1; display: block; overflow: hidden; height: 0; padding-bottom: 100%; } .img-box img, .img-box iframe { position: absolute; top: 0; left: 0; display: block; width: 100%; height: 100%; } .fszero { font-size: 0; overflow: hidden; width: 0; height: 0; } .fszero h1 { margin: 0; } .wrap-map .map-content { display: none; } [lang='zh-CN'] .share-cn { display: block; } [lang='zh-CN'] .share-other { display: none; } [lang='zh-CN'] .wrap-map .map-content { display: block; } [lang='zh-CN'] .wrap-map .map { display: none; } [lang='zh-CN'] .box-follow { display: none; } .a2a_kit { display: inline-block; vertical-align: middle; } @-ms-viewport { width: auto !important; } li, ol, ul { margin: 0; padding: 0; list-style: none; } a, a:hover, a:link, a:visited { text-decoration: none; color: inherit; } input[type='number'] { -moz-appearance: textfield; } input[type='number']::-webkit-inner-spin-button, input[type='number']::-webkit-outer-spin-button { margin: 0; -webkit-appearance: none; } button, input, textarea { border: none; outline: none; } a[data-fancybox] { outline: none; } a[data-fancybox] img { outline: none !important; } .slick-slide { outline: none; } .slick-slide a { outline: none !important; } @media (min-width: 1200px) { .wow { visibility: hidden; } } img[data-lazy] { background: url(../images/ajax-loader.gif) no-repeat center; } img.lazy { min-width: 1px; min-height: 1px; background: url(../images/ajax-loader.gif) no-repeat center; } .lazy { background-image: url(../images/ajax-loader.gif); background-repeat: no-repeat; background-position: center; } .loaded { background-size: cover; } .slick-slide, .slick-slider .slick-track, .slick-slider .slick-list, .slick-slide img, .slick-slider .slick-track img, .slick-slider .slick-list img { -webkit-transform: translateZ(1px); -webkit-transform: translate3d(0, 0, 1px); transform: translateZ(1px); transform: translate3d(0, 0, 1px); -webkit-backface-visibility: hidden; backface-visibility: hidden; } .at-resp-share-element .at-share-btn { margin-bottom: 0 !important; } .transform-0 { -webkit-transform: translate(0) !important; -ms-transform: translate(0) !important; transform: translate(0) !important; } .slick-disabled { cursor: no-drop; opacity: .5; } body.fixed { position: fixed; overflow: hidden; width: 100%; height: 100%; } body.searchactive { position: fixed; overflow: hidden; width: 100%; height: 100%; } @media (min-width: 1470px) { .container { max-width: 1440px; } .con1410 { max-width: 1440px; } } @media (min-width: 1710px) { .container { max-width: 1690px; } .con1410 { max-width: 1440px; } .con1690 { max-width: 1720px; } } @media (min-width: 1920px) { .container { max-width: 1890px; } .con1410 { max-width: 1440px; } .con1690 { max-width: 1720px; } } @media (max-width: 767px) { .col-6:nth-child(2n + 1) { padding-right: 7.5px; } .col-6:nth-child(2n) { padding-left: 7.5px; } } .fancybox-slide--iframe .fancybox-content { width: 100%; max-width: 80%; height: 100%; min-height: 50%; max-height: 80%; margin: 0; } .fancybox-slide--video video { max-width: 80%; padding: 0; } @media (max-width: 767px) { .fancybox-slide--video video { max-width: 95%; } } .fancybox-slide > video { padding: 0; } .swiper-lazy { background: url(../images/ajax-loader.gif) no-repeat center; } .scrollbar::-webkit-scrollbar { position: absolute; z-index: 2; left: 0; width: 6px; } .scrollbar::-webkit-scrollbar-track { background-color: #eee; } .scrollbar::-webkit-scrollbar-thumb { background-color: #dcdcdc; } .swiper-button { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 118px; margin: 0 auto; padding: 2px; border-radius: 40px; background: #d4d8dd; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .slick-arrow { font-size: 0; line-height: 54px; position: relative; position: absolute; z-index: 6; top: 0; top: 50%; left: 0; display: block; width: 54px; height: 54px; margin: 0; padding: 0; -webkit-transition: all .2s; transition: all .2s; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); text-align: center; color: #fff; border-radius: 50%; background: #bbb; } @media (max-width: 1199px) { .slick-arrow { line-height: 40px; width: 40px; height: 40px; } } .slick-arrow::after { display: none; } .slick-arrow:before { font-family: 'iconfont' !important; font-size: 18px; display: block; content: '\eb60'; } .slick-arrow:hover { background-color: #ff6310; } .slick-next { right: 0; left: auto; } .slick-next:before { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } @media (min-width: 768px) { .arrow-top-right .slick-arrow { position: absolute; top: -94px; right: 60px; left: auto; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } .arrow-top-right .slick-arrow.slick-next { right: 0; } } .arrow-bottom { padding-bottom: 80px; } .arrow-bottom .slick-arrow { position: absolute; top: auto; bottom: 0; left: 50%; -webkit-transform: translateX(-120%); -ms-transform: translateX(-120%); transform: translateX(-120%); } .arrow-bottom .slick-arrow.slick-next { right: 50%; left: auto; -webkit-transform: translateX(120%); -ms-transform: translateX(120%); transform: translateX(120%); } .arrow-bottom .slick-arrow:hover { background-color: #ff6310; } .slick-dots { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-top: 60px; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media (max-width: 1199px) { .slick-dots { margin-top: 30px; } } .slick-dots:before, .slick-dots:after { display: block; width: 30%; height: 10px; content: ''; background: url(../images/dot-left.png) no-repeat center; background-size: 100%; } .slick-dots:after { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .slick-dots li { width: 22px; height: 22px; margin: 0 9px; border-radius: 9px; background: #e4e4e5; } @media (max-width: 1199px) { .slick-dots li { width: 18px; height: 18px; } } @media (max-width: 767px) { .slick-dots li { width: 10px; height: 10px; margin: 0 4px; } } .slick-dots li button { display: none; } .slick-dots li.slick-active { background-color: #ff6310; } .center { top: 50%; left: 50%; -webkit-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); } .slick-list { margin: 0 -15px; } @media (max-width: 1199px) { .slick-list { margin: 0 -10px; } } @media (max-width: 767px) { .slick-list { margin: 0 -5px; } } .slick-list .slick-slide { padding: 0 15px; } @media (max-width: 1199px) { .slick-list .slick-slide { padding: 0 10px; } } @media (max-width: 767px) { .slick-list .slick-slide { padding: 0 5px; } } .share-cn { display: none; } .addcart { cursor: pointer; } .addcart.active .icon:before { content: '\e69a'; } .translate { min-width: 158px; } @media (max-width: 767px) { .translate { min-width: 145px; } } @media (max-width: 767px) { .translate .goog-te-gadget-simple .VIpgJd-ZVi9od-xl07Ob-lTBxed span { font-size: 12px; } } .translate .goog-te-gadget-simple { border-color: #fff; } .fluid_html_on_pause, .fluid_pseudo_poster, .fluid_controls_container { display: none; } .map-content label { line-height: 30px !important; max-width: 200px; padding: 0 10px !important; border: none !important; box-shadow: 0 0 10px rgba(0, 0, 0, .2) !important; } .mt-40 { margin-top: 40px; } @media (max-width: 991px) { .mt-40 { margin-top: 20px; } } .mt-60 { margin-top: 60px; } @media (max-width: 1199px) { .mt-60 { margin-top: 30px; } } .common-share ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -8px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; } .common-share ul li { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; padding: 0 8px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .common-share ul li a { font-size: 22px; line-height: 48px; display: block; width: 48px; height: 48px; -webkit-transition: all .6s; transition: all .6s; text-align: center; color: #fff; border-radius: 50%; background: #0077b5; } @media (max-width: 991px) { .common-share ul li a { line-height: 40px; width: 40px; height: 40px; border-radius: 6px; } } .common-share ul li a:hover { -webkit-transform: translateY(-15px); -ms-transform: translateY(-15px); transform: translateY(-15px); } .common-share ul li.facebook a { background-color: #3b5999; } .common-share ul li.twitter a { background-color: #55acee; } .common-share ul li.instagram a { background-color: #e4405f; } .common-share ul li.youtube a { background-color: #f00; } .formbox { margin-top: 20px; } .formbox form ul { margin: 0 -10px; } .formbox form ul li { padding: 0 10px; } .formbox form .group { position: relative; margin-top: 20px; } @media (max-width: 767px) { .formbox form .group { margin-top: 10px; } } .formbox form .group label { font-size: 14px; font-weight: 500; line-height: 30px; margin-bottom: 10px; } .formbox form .group label span { color: #c7371f; } .formbox form .group input, .formbox form .group textarea { font-size: 14px; line-height: 30px; width: 100%; padding: 10px 20px; border: 1px solid #e5e5e5; border-radius: 6px; background: #fff; } @media (max-width: 767px) { .formbox form .group input, .formbox form .group textarea { line-height: 24px; } } .formbox form .group input::-webkit-input-placeholder, .formbox form .group textarea::-webkit-input-placeholder { color: #666; } .formbox form .group input:-o-placeholder, .formbox form .group textarea:-o-placeholder { color: #666; } .formbox form .group input::-moz-placeholder, .formbox form .group textarea::-moz-placeholder { color: #666; } .formbox form .group input:-ms-input-placeholder, .formbox form .group textarea:-ms-input-placeholder { color: #666; } .formbox form .group input:focus::-webkit-input-placeholder, .formbox form .group textarea:focus::-webkit-input-placeholder { color: #c5c5c5; } .formbox form .group input:focus::-o-placeholder, .formbox form .group textarea:focus::-o-placeholder { color: #c5c5c5; } .formbox form .group input:focus::-moz-placeholder, .formbox form .group textarea:focus::-moz-placeholder { color: #c5c5c5; } .formbox form .group input:focus::-ms-input-placeholder, .formbox form .group textarea:focus::-ms-input-placeholder { color: #c5c5c5; } .formbox form .group-read input { color: #fff !important; background: #ff6310 !important; } .formbox form .submit { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; height: 48px; margin-top: 24px; -webkit-transition: all .2s; transition: all .2s; color: #fff; border-radius: 100px; background-color: #ff6310; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } @media (max-width: 767px) { .formbox form .submit { font-size: 16px; height: 42px; } } .formbox form .submit .iconfont { margin-left: 20px; -webkit-transition: all .4s; transition: all .4s; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .formbox form .submit:hover { background: -webkit-gradient(linear, left top, left bottom, from(#ff6310), to(#ff6310)); background: -webkit-linear-gradient(top, #ff6310 0%, #ff6310 100%); background: linear-gradient(180deg, #ff6310 0%, #ff6310 100%); } .formbox form .submit:hover .iconfont { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } .wrap-reviews { position: relative; overflow: hidden; background-color: #f4f6f7; } .wrap-reviews .slick-reviews { margin-top: 50px; } .wrap-reviews .slick-arrow { top: -100px; } @media (max-width: 1199px) { .wrap-reviews .slick-arrow { top: -70px; } } @media (max-width: 991px) { .wrap-reviews .slick-arrow { top: -60px; } } @media (max-width: 767px) { .wrap-reviews .slick-arrow { top: 50%; left: -12px; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } } .wrap-reviews .item { padding: 10px 30px; -webkit-transition: all .2s; transition: all .2s; border-radius: 5px; background: #fff; } .wrap-reviews .item .title-reviews { line-height: 30px; padding: 10px 0; border-bottom: 1px solid #dcdcdc; } .wrap-reviews .item .title-reviews h4 { font-size: 18px; font-weight: bold; margin: 0; text-transform: capitalize; } .wrap-reviews .item .title-reviews h4 span { min-width: 90px; margin-right: 6px; } .wrap-reviews .item .title-reviews h4 .icon { font-size: 12px; color: #a41517; } .wrap-reviews .item .title-reviews .date { font-size: 12px; color: #666; } .wrap-reviews .item .title-reviews .date .icon { float: left; margin-right: 4px; color: #a41517; } .wrap-reviews .item .note { padding: 14px 0; } .wrap-reviews .write-reviews { margin-top: 30px; } @media (max-width: 991px) { .wrap-reviews .write-reviews { margin-top: 20px; } } .wrap-reviews .write-reviews .title-write h3 { font-size: 22px; font-weight: bold; line-height: 30/22; } @media (max-width: 991px) { .wrap-reviews .write-reviews .title-write h3 { font-size: 20px; } } .wrap-reviews .write-reviews .message form ul { margin: 0 -10px; } .wrap-reviews .write-reviews .message form ul li { padding: 0 10px; } .wrap-reviews .write-reviews .message form .group { position: relative; margin-top: 20px; background: #fff; } .wrap-reviews .write-reviews .message form .group-read { overflow: hidden; background: #000; } .wrap-reviews .write-reviews .message form .group-read input { font-size: 14px; line-height: 30px; width: 100%; padding: 10px 40px; border-radius: 5px; outline: none; background: none; background: #f9f9f9; } @media (max-width: 1560px) { .wrap-reviews .write-reviews .message form .group-read input { padding: 10px 30px; } } @media (max-width: 1400px) { .wrap-reviews .write-reviews .message form .group-read input { padding: 10px 20px; } } .wrap-reviews .write-reviews .message form .group label { font-size: 14px; font-weight: 500; line-height: 50px; position: absolute; top: 0; left: 40px; -webkit-transition: all .3s ease; transition: all .3s ease; } @media (max-width: 1560px) { .wrap-reviews .write-reviews .message form .group label { left: 30px; } } @media (max-width: 1400px) { .wrap-reviews .write-reviews .message form .group label { left: 20px; } } .wrap-reviews .write-reviews .message form .group input, .wrap-reviews .write-reviews .message form .group textarea { font-size: 14px; line-height: 30px; position: relative; z-index: 2; width: 100%; padding: 10px 40px; border-radius: 0; border-radius: 5px; outline: 0; background: none; } @media (max-width: 1560px) { .wrap-reviews .write-reviews .message form .group input, .wrap-reviews .write-reviews .message form .group textarea { padding: 10px 30px; } } @media (max-width: 1400px) { .wrap-reviews .write-reviews .message form .group input, .wrap-reviews .write-reviews .message form .group textarea { padding: 10px 20px; } } .wrap-reviews .write-reviews .message form .group input:-moz-placeholder + label, .wrap-reviews .write-reviews .message form .group textarea:-moz-placeholder + label { top: 0; background-color: transparent; } .wrap-reviews .write-reviews .message form .group input:-ms-input-placeholder + label, .wrap-reviews .write-reviews .message form .group textarea:-ms-input-placeholder + label { top: 0; background-color: transparent; } .wrap-reviews .write-reviews .message form .group input:placeholder-shown + label, .wrap-reviews .write-reviews .message form .group textarea:placeholder-shown + label { top: 0; background-color: transparent; } .wrap-reviews .write-reviews .message form .group input:focus + label, .wrap-reviews .write-reviews .message form .group textarea:focus + label, .wrap-reviews .write-reviews .message form .group input:valid + label, .wrap-reviews .write-reviews .message form .group textarea:valid + label { top: -32px; left: 40px; -webkit-transform: scale(.8); -ms-transform: scale(.8); transform: scale(.8); opacity: .8; color: #fff; } @media (max-width: 1560px) { .wrap-reviews .write-reviews .message form .group input:focus + label, .wrap-reviews .write-reviews .message form .group textarea:focus + label, .wrap-reviews .write-reviews .message form .group input:valid + label, .wrap-reviews .write-reviews .message form .group textarea:valid + label { left: 30px; } } @media (max-width: 1400px) { .wrap-reviews .write-reviews .message form .group input:focus + label, .wrap-reviews .write-reviews .message form .group textarea:focus + label, .wrap-reviews .write-reviews .message form .group input:valid + label, .wrap-reviews .write-reviews .message form .group textarea:valid + label { left: 20px; } } .wrap-reviews .write-reviews .message form .group textarea { resize: none; } .wrap-reviews .write-reviews .message form .submit-group .submit { -webkit-transition: all .2s; transition: all .2s; color: #fff; background: #eb5301; } .wrap-reviews .write-reviews .message form .submit-group .submit:hover { background-color: #ff6310; } .open-quote { display: none; width: 96%; max-width: 860px; padding: 0; border-radius: 20px; } .open-quote .pic img { width: 100%; } .open-quote .quote-message { width: 100%; padding: 30px; } .open-quote .quote-message .title-in h2 { font-size: 36px; font-weight: 600; line-height: 40/36; color: #ff6310; } @media (max-width: 1560px) { .open-quote .quote-message .title-in h2 { font-size: 30px; } } @media (max-width: 1199px) { .open-quote .quote-message .title-in h2 { font-size: 24px; } } .open-quote .quote-message .formbox .group input { color: #ff6310; } .open-quote .quote-message .formbox .group input::-webkit-input-placeholder, .open-quote .quote-message .formbox .group textarea::-webkit-input-placeholder { color: #ff6310; } .open-quote .quote-message .formbox .group input:-o-placeholder, .open-quote .quote-message .formbox .group textarea:-o-placeholder { color: #ff6310; } .open-quote .quote-message .formbox .group input::-moz-placeholder, .open-quote .quote-message .formbox .group textarea::-moz-placeholder { color: #ff6310; } .open-quote .quote-message .formbox .group input:-ms-input-placeholder, .open-quote .quote-message .formbox .group textarea:-ms-input-placeholder { color: #ff6310; } .open-quote .quote-message .formbox .group input:focus::-webkit-input-placeholder, .open-quote .quote-message .formbox .group textarea:focus::-webkit-input-placeholder { color: rgba(255, 99, 16, .2); } .open-quote .quote-message .formbox .group input:focus::-o-placeholder, .open-quote .quote-message .formbox .group textarea:focus::-o-placeholder { color: rgba(255, 99, 16, .2); } .open-quote .quote-message .formbox .group input:focus::-moz-placeholder, .open-quote .quote-message .formbox .group textarea:focus::-moz-placeholder { color: rgba(255, 99, 16, .2); } .open-quote .quote-message .formbox .group input:focus::-ms-input-placeholder, .open-quote .quote-message .formbox .group textarea:focus::-ms-input-placeholder { color: rgba(255, 99, 16, .2); } .open-quote .quote-message .formbox .submit { width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 0 40px; } .fancybox-close-small:after { background-color: #fff; } .header { position: -webkit-sticky; position: sticky; z-index: 10; top: 0; width: 100%; -webkit-transition: all .4s; transition: all .4s; background-color: #fff; } @media (max-width: 767px) { .header { position: -webkit-sticky; position: sticky; top: 0; color: #000; } } .header .header-top { line-height: 40px; color: #fff; background: #372121; } @media (max-width: 1199px) { .header .header-top { line-height: 24px; } } .header .header-top p { margin: 0; } .header .header-top p a span { -webkit-transition: background-size .56s; transition: background-size .56s; background-image: -webkit-gradient(linear, left top, right top, from(#fff), to(#fff)); background-image: -webkit-linear-gradient(left, #fff 0%, #fff 100%); background-image: linear-gradient(to right, #fff 0%, #fff 100%); background-repeat: no-repeat; background-position: 0 95%; background-size: 0 1px; } .header .header-top p a:hover span { background-size: 100% 1px; } .header .header-top .line { margin: 0 24px; } .header .logo { display: block; height: 71px; -webkit-transition: all .4s; transition: all .4s; } @media (max-width: 1199px) { .header .logo { height: 60px; padding: 10px 0; } } .header .logo img { display: block; height: 100%; } .header .serach-part { margin-left: 40px; cursor: pointer; } @media (max-width: 1560px) { .header .serach-part { margin-left: 20px; } } @media (max-width: 1400px) { .header .serach-part { margin: 0; } } .header .find { font-size: 20px; line-height: 52px; width: 52px; height: 52px; -webkit-transition: all .2s; transition: all .2s; text-align: center; border-radius: 26px; background: #faf0dd; } @media (max-width: 1199px) { .header .find { line-height: 40px; width: 40px; height: 40px; } } .header .find:hover { color: #fff; background-color: #ff6310; } .header .search-wrap { font-size: 14px; position: fixed; z-index: 9; top: -15px; left: 50%; display: none; width: 100vw; height: 100vh; padding: 10px; -webkit-transform: translateX(-50%); -ms-transform: translateX(-50%); transform: translateX(-50%); background-color: rgba(0, 0, 0, .8); box-shadow: 0 0 10px rgba(0, 0, 0, .1); } .header .search-wrap .search-close { position: absolute; top: 5%; right: 10%; cursor: pointer; -webkit-transform: rotate(45deg); -ms-transform: rotate(45deg); transform: rotate(45deg); color: #fff; } @media (max-width: 1199px) { .header .search-wrap .search-close { right: 5%; } } .header .search-wrap .search-close .icon { font-size: 30px; } .header .search-wrap .search-box { position: absolute; top: 50%; left: 10%; overflow: hidden; width: 80%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); border-radius: 6px; } @media (max-width: 1199px) { .header .search-wrap .search-box { left: 5%; width: 90%; } } .header .search-wrap input { line-height: 30px; width: 100%; padding: 15px; color: #666; } .header .search-wrap .submit { font-size: 20px; line-height: 60px; position: absolute; top: 0; right: 0; width: 46px; height: 60px; padding: 0; -webkit-transition: all .2s; transition: all .2s; border-radius: 0; } .header .search-wrap .submit:before { font-family: 'iconfont' !important; content: '\e60e'; } .header .search-wrap .submit:hover { color: #fff; background-color: #ff6310; } .header .cart { line-height: 52px; position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-left: 12px; padding: 0 20px; -webkit-transition: all .2s; transition: all .2s; border-radius: 30px; background: #faf0dd; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } @media (max-width: 1470px) { .header .cart { margin-left: 10px; padding: 0 10px; } } @media (max-width: 1400px) { .header .cart { font-size: 14px; } } @media (max-width: 1199px) { .header .cart { line-height: 40px; margin-left: 10px; } } @media (max-width: 767px) { .header .cart { font-size: 0; line-height: 40px; display: block; width: 40px; height: 40px; padding: 0; text-align: center; } } .header .cart .iconfont { font-size: 22px; margin-right: 6px; } @media (max-width: 767px) { .header .cart .iconfont { margin: 0; } } .header .cart span { font-size: 12px; font-weight: bold; line-height: 20px; position: absolute; top: -5px; right: -5px; width: 20px; height: 20px; text-align: center; color: #fff; border-radius: 50%; background-color: red; } .header .cart:hover { color: #fff; background-color: #ff6310; } .header .language { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-left: 12px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .header .language a { line-height: 22px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 15px 26px; -webkit-transition: all .2s; transition: all .2s; color: #fff; border-radius: 50px; background-color: #ff6310; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media (max-width: 1470px) { .header .language a { padding: 15px; } } @media (max-width: 1400px) { .header .language a { font-size: 14px; } } @media (max-width: 1199px) { .header .language a { line-height: 20px; padding: 10px; } } @media (max-width: 767px) { .header .language a { font-size: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 40px; height: 40px; padding: 0; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } } .header .language a img { margin-right: 10px; -webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1); } @media (max-width: 767px) { .header .language a img { margin-right: 0; } } .header .language a:hover { background-color: #eb5301; } @media (max-width: 1199px) { .header .pc-nav { display: none; } } .header .pc-nav > ul { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .header .pc-nav > ul > li { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .header .pc-nav > ul > li > a { font-size: 18px; position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; height: 100px; padding: 0 38px; -webkit-transition: all .2s; transition: all .2s; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media (max-width: 1720px) { .header .pc-nav > ul > li > a { padding: 0 25px; } } @media (max-width: 1560px) { .header .pc-nav > ul > li > a { padding: 0 20px; } } @media (max-width: 1400px) { .header .pc-nav > ul > li > a { padding: 0 10px; } } .header .pc-nav > ul > li.active > a, .header .pc-nav > ul > li:hover > a { color: #ff6310; } .header .nav-list2 { position: absolute; z-index: 50; top: 100%; display: none; min-width: 230px; padding: 20px 0; color: #333; border-radius: 0 0 10px 10px; background: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, .1); -webkit-backdrop-filter: blur(6.5999999px); backdrop-filter: blur(6.5999999px); } .header .nav-list2 li { list-style: none; } .header .nav-list2 li > a { font-size: 16px; line-height: 24px; display: block; padding: 6px 20px; -webkit-transition: all .2s; transition: all .2s; } .header .nav-list2 li.active > a, .header .nav-list2 li:hover > a { color: #ff6310; } .header .nav-list3 { position: absolute; top: 0; left: 100%; display: none; padding: 10px; border-radius: 10px; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, .1); } .header .nav-list3 > li > a { line-height: 24px; display: block; padding: 5px 20px; -webkit-transition: all .2s; transition: all .2s; white-space: nowrap; border-radius: 10px; } .header .nav-list3 > li:hover > a { color: #fff; background-color: #ff6310; } .header .btn-menu { position: relative; display: none; width: 24px; height: 40px; } @media (max-width: 1199px) { .header .btn-menu { display: inline-block; margin-left: 10px; vertical-align: middle; } } .header .btn-menu div { position: absolute; top: 0; left: 0; display: block; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: column; width: 100%; height: 100%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } .header .btn-menu div:before, .header .btn-menu div:after { display: block; height: 2px; content: ''; -webkit-transition: all .4s; transition: all .4s; background: #ff6310; } .header .btn-menu div span { display: block; height: 2px; margin: 5px 0; -webkit-transition: all .4s; transition: all .4s; background: #ff6310; } .header .translate { margin-left: 3vw; } .stuck { color: #333; background-color: #fff; box-shadow: 0 0 10px rgba(0, 0, 0, .1); } .hc-mobile-nav { text-transform: capitalize; } .hc-mobile-nav .lst-clone { display: none; } .hc-mobile-nav p { margin: 0; } .hc-mobile-nav .navright { display: none; } .hc-mobile-nav li.nav-close { padding-top: 40px; } .hc-mobile-nav .nav-list2 li.nav-parent > a { padding-right: 44px; padding-left: 30px; } .hc-mobile-nav .nav-list3 li a { padding-left: 40px; } .hc-mobile-nav ul { text-indent: 0 !important; } .hc-mobile-nav .nav-wrapper { color: #333; background-color: #fff; } .hc-mobile-nav li.nav-close a, .hc-mobile-nav li.nav-back a, .hc-mobile-nav.nav-levels-expand .nav-container li.level-open a:hover, .hc-mobile-nav.nav-levels-none .nav-container li.level-open a:hover, .hc-mobile-nav.nav-levels-expand .nav-container ul .nav-wrapper, .hc-mobile-nav.nav-levels-none .nav-container ul .nav-wrapper, .hc-mobile-nav.nav-levels-expand .nav-container li.level-open, .hc-mobile-nav.nav-levels-none .nav-container li.level-open, .hc-mobile-nav li.nav-close a:hover, .hc-mobile-nav li.nav-back a:hover { background-color: #eee; } .hc-mobile-nav li.nav-close span::before, .hc-mobile-nav li.nav-close span::after, .hc-mobile-nav span.nav-next::before, .hc-mobile-nav li.nav-back span::before { border-color: #222; } .hc-mobile-nav:not(.touch-device) a:hover { background-color: #eee; } .online-wrap { position: fixed; z-index: 9; top: 50%; right: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } @media (max-width: 991px) { .online-wrap { top: auto; bottom: 100px; -webkit-transform: translateY(0); -ms-transform: translateY(0); transform: translateY(0); } } .online-wrap .btn { line-height: 44px; width: 44px; height: 44px; padding: 0; -webkit-transform-origin: center center; -ms-transform-origin: center center; transform-origin: center center; text-align: center; color: #fff; border: 1px solid #ff6310; border-radius: 0; border-radius: 50%; outline: none; background-color: #ff6310; } @media (min-width: 992px) { .online-wrap .btn { display: none; } } .online-wrap .btn:before { font-family: 'iconfont' !important; font-size: 18px; font-weight: bold; display: inline-block; content: '\e625'; -webkit-transition: -webkit-transform .3s; transition: -webkit-transform .3s; transition: transform .3s; transition: transform .3s, -webkit-transform .3s; } .online-wrap .btn.active:before { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .online-wrap .code-pic { position: fixed; z-index: 101; right: 45px; bottom: 180px; display: none; max-width: 120px; } .online-wrap .code-pic .pic-box { background-color: #fff; } .online-wrap .code-pic img { display: block; max-width: 100%; } .online-wrap .online { position: relative; -webkit-transition: right .3s; transition: right .3s; border-radius: 30px; background-color: rgba(0, 0, 0, .2); } @media (max-width: 991px) { .online-wrap .online { position: absolute; top: auto; right: -60px; bottom: 70px; -webkit-transform: translateY(0%); -ms-transform: translateY(0%); transform: translateY(0%); } .online-wrap .online.active { right: 0; } } .online-wrap .online a { line-height: 50px; display: block; width: 50px; height: 50px; margin: 4px 0; text-align: center; color: #fff; } .online-wrap .online a .iconfont { font-size: 22px; } .online-wrap .online a b { font-weight: normal; } .online-wrap .online a:hover { color: #ff6310; } .online-wrap .online .codenum { position: relative; } .online-wrap .online .codenum .open-num { position: absolute; z-index: -1; top: 0; right: -300px; padding-right: 0; -webkit-transition: right .3s; transition: right .3s; white-space: nowrap; } .online-wrap .online .codenum .open-num p { line-height: 50px; display: block; margin: 0; padding: 0 20px; color: #fff; border-radius: 10px; background: #ff6310; } @media (min-width: 1200px) { .online-wrap .online .codenum:hover .open-num { right: 100%; } } .online-wrap .online .code { position: relative; } @media (max-width: 767px) { .online-wrap .online .code:before { font-size: 22px; } } .online-wrap .online .code .mask { position: absolute; z-index: 10; top: 0; right: 100%; display: none; width: 130px; height: 130px; padding-right: 5px; } .online-wrap .online .code .mask .mask-box { border: 1px solid #e5e5e5; background-color: #fff; } .online-wrap .online .code .mask img { display: block; width: 100%; } .online-wrap .online .code .mask p { font-size: 13px; line-height: 16px; margin: 5px 0 8px 0; color: #888; } .online-wrap .online .online-cart span { font-size: 12px; line-height: 18px; position: absolute; top: 18px; right: 14px; width: 18px; height: 18px; text-align: center; color: #fff; border-radius: 50%; background-color: #eb5301; } .xs-online { position: fixed; z-index: 8; bottom: 0; left: 0; display: none; width: 100%; color: #fff; background-color: #ff6310; box-shadow: 0 -2px 14px 1px rgba(0, 0, 0, .2); } @media (max-width: 991px) { .xs-online { display: block !important; } } .xs-online ul { margin: 0; padding: 0; text-align: center; } .xs-online ul li { float: left; width: 20%; list-style: none; border-right: 1px solid rgba(0, 0, 0, .2); border-left: 1px solid rgba(255, 255, 255, .6); } .xs-online ul li > a { font-size: 10px; display: block; padding: 8px 0; text-transform: uppercase; color: inherit; } .xs-online ul li > a .iconfont { font-size: 20px; display: block; } @media (max-width: 320px) { .xs-online ul li > a { font-size: 8px; } } .xs-online ul li:first-child { border-left: none; } .xs-online ul li:last-child { border-right: none; } .xs-online ul li.xs-online-wechat > a { position: relative; } .xs-online ul li.xs-online-wechat > a:hover img { display: block; } .xs-online ul li.xs-online-wechat > a img { position: absolute; bottom: 57px; left: 0; display: none; width: 100%; } .banner-box { padding: 0 30px; } @media (max-width: 767px) { .banner-box { padding: 0 10px; } } .banner { font-size: 0; position: relative; z-index: 8; clear: both; overflow: hidden; width: 100%; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; border-radius: 80px; } @media (max-width: 1560px) { .banner { border-radius: 60px; } } @media (max-width: 1199px) { .banner { border-radius: 30px; } } @media (max-width: 767px) { .banner { border-radius: 10px; } } .banner .item a { height: 100%; } .banner img { display: block; width: 100%; } .banner .img-box { padding-bottom: 42.708%; } .banner .swiper-slide { overflow: hidden; } .banner .swiper-pagination { position: absolute; z-index: 2; bottom: 24px; text-align: center; } @media (max-width: 1199px) { .banner .swiper-pagination { bottom: 10px; } } .banner .swiper-pagination .swiper-pagination-bullet { position: relative; width: 26px; height: 26px; margin: 0 10px; -webkit-transition: all .2s; transition: all .2s; opacity: 1; border: 1px solid #fff; border-radius: 50%; background: rgba(255, 255, 255, .15); -webkit-backdrop-filter: blur(2px); backdrop-filter: blur(2px); } .banner .swiper-pagination .swiper-pagination-bullet:before { position: absolute; top: 8px; left: 8px; display: block; width: 8px; height: 8px; content: ''; border-radius: 50%; background-color: #fff; } .banner .swiper-pagination .swiper-pagination-bullet-active { background-color: #ff6310; } .banner .swiper-pagination .swiper-pagination-bullet-active:before { background-color: #fff; } .banner .slick-arrow { top: -webkit-calc(50% + 40px); top: calc(50% + 40px); width: auto; -webkit-transition: all .2s; transition: all .2s; text-align: center; color: #fff; border: none; background: none; } .banner .slick-arrow:before { font-size: 30px; } .banner .slick-arrow:hover { color: #eb5301; background: none; } .banner .slick-prev { left: 2%; } @media (max-width: 991px) { .banner .slick-prev { left: 0; } } .banner .slick-next { right: 2%; } @media (max-width: 991px) { .banner .slick-next { right: 0; } } .banner .item { position: relative; display: block; overflow: hidden; } @media (max-width: 767px) { .banner .item { width: 110%; max-width: 110%; margin-left: -5%; } } .banner-video { position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; } .banner.hide-arrow .slick-arrow, .banner.hide-arrow .swiper-pagination { display: none !important; } .banner.hide-video video { display: none !important; } .banner-video-box { position: relative; display: block; padding-bottom: 960/1920 * 100%; -webkit-transform: translateZ(10px); transform: translateZ(10px); } .banner-video-box .fluid_video_wrapper { position: absolute; z-index: 10; } .banner-video-box .fluid_initial_play { background-color: #ff6310 !important; } .banner .mobile-video { position: relative; display: block; } .banner .mobile-video:after { z-index: 2; content: ''; background-color: rgba(0, 0, 0, .1); } .banner .mobile-video:before { font-size: 50px; position: absolute; z-index: 3; top: 50%; left: 50%; content: '\e644'; -webkit-transform: translateY(-50%) translateX(-50%); -ms-transform: translateY(-50%) translateX(-50%); transform: translateY(-50%) translateX(-50%); color: #fff; text-shadow: 0 0 20px rgba(0, 0, 0, .3); } .banner-in { position: relative; overflow: hidden; border-radius: 80px; } @media (max-width: 1560px) { .banner-in { border-radius: 60px; } } @media (max-width: 1199px) { .banner-in { border-radius: 30px; } } @media (max-width: 767px) { .banner-in { border-radius: 10px; } } .banner-in img { width: 100%; } .banner-in .banner-text { position: absolute; z-index: 6; top: 50%; width: 100%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); color: #fff; } .banner-in .title-banner h2 { font-family: 'Fredoka'; font-size: 70px; line-height: 80/70; max-width: 800px; } @media (max-width: 1560px) { .banner-in .title-banner h2 { font-size: 60px; } } @media (max-width: 1470px) { .banner-in .title-banner h2 { font-size: 50px; } } @media (max-width: 1199px) { .banner-in .title-banner h2 { font-size: 40px; } } @media (max-width: 991px) { .banner-in .title-banner h2 { font-size: 30px; } } @media (max-width: 767px) { .banner-in .title-banner h2 { font-size: 24px; } } .banner-in .wrap-location { margin-top: 18px; } .box { overflow: hidden; padding: 120px 0; } @media (max-width: 1560px) { .box { padding: 100px 0; } } @media (max-width: 1400px) { .box { padding: 80px 0; } } @media (max-width: 991px) { .box { padding: 50px 0; } } @-webkit-keyframes zhuan { 0% { -webkit-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } @keyframes zhuan { 0% { -webkit-transform: rotate(0); transform: rotate(0); } 100% { -webkit-transform: rotate(360deg); transform: rotate(360deg); } } .common-more { -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .common-more a, .common-more span { line-height: 48px; display: block; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 0 25px; -webkit-transition: all .2s; transition: all .2s; color: #fff; border-radius: 50px; background-color: #ff6310; } .common-more a:hover, .common-more span:hover { background-color: #000; } .common-more-nobg a, .common-more-nobg span { color: #222; border: 1px solid rgba(0, 0, 0, .1); border-radius: 50px; background: none; } .common-more-nobg a:hover, .common-more-nobg span:hover { color: #fff; border-color: #ff6310; background-color: #ff6310; } .common-more-big a, .common-more-big span { width: 100%; } .title .subtitle { font-size: 24px; font-weight: 600; line-height: 30/24; } @media (max-width: 1199px) { .title .subtitle { font-size: 20px; } } @media (max-width: 767px) { .title .subtitle { font-size: 18px; } } .title h2 { font-family: 'Fredoka'; font-size: 58px; font-weight: 600; line-height: 1.2; padding: 20px 0; background: url(../images/title-icon.png) no-repeat center; background-size: auto 100%; } @media (max-width: 1720px) { .title h2 { font-size: 50px; } } @media (max-width: 1470px) { .title h2 { font-size: 46px; } } @media (max-width: 1400px) { .title h2 { font-size: 40px; padding: 10px 0; } } @media (max-width: 1199px) { .title h2 { font-size: 36px; } } @media (max-width: 991px) { .title h2 { font-size: 30px; letter-spacing: 0; } } @media (max-width: 767px) { .title h2 { font-size: 24px; } } .title .editor-content { max-width: 1030px; margin-top: 20px; color: #444; } @media (max-width: 767px) { .title .editor-content { margin-top: 10px; } } .title.text-center .editor-content { margin: 0 auto; margin-top: 20px; } @-webkit-keyframes slideFromLeft { from { -webkit-transform: translateX(-100px); transform: translateX(-100px); opacity: 0; } to { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @keyframes slideFromLeft { from { -webkit-transform: translateX(-100px); transform: translateX(-100px); opacity: 0; } to { -webkit-transform: translateX(0); transform: translateX(0); opacity: 1; } } @-webkit-keyframes slideFromRight { from { -webkit-transform: translateX(100px) rotate(180deg); transform: translateX(100px) rotate(180deg); opacity: 0; } to { -webkit-transform: translateX(0) rotate(180deg); transform: translateX(0) rotate(180deg); opacity: 1; } } @keyframes slideFromRight { from { -webkit-transform: translateX(100px) rotate(180deg); transform: translateX(100px) rotate(180deg); opacity: 0; } to { -webkit-transform: translateX(0) rotate(180deg); transform: translateX(0) rotate(180deg); opacity: 1; } } .box-category .category { margin-top: 40px; } .box-category .category .item { display: block; } .box-category .category .item .img-box { padding-bottom: 105.74712644%; border-radius: 38px; } @media (max-width: 1560px) { .box-category .category .item .img-box { border-radius: 30px; } } .box-category .category .item .img-box img { -webkit-transition: all 1s; transition: all 1s; } .box-category .category .item .text { padding: 0 5%; } @media (max-width: 1400px) { .box-category .category .item .text { padding: 0 15px; } } @media (max-width: 1199px) { .box-category .category .item .text { padding: 0; } } .box-category .category .item .title-category { font-family: 'Fredoka'; font-size: 30px; font-weight: 500; line-height: 40px; display: -webkit-box; overflow: hidden; height: 40px; margin-top: 20px; -webkit-transition: all .2s; transition: all .2s; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } @media (max-width: 1720px) { .box-category .category .item .title-category { font-size: 24px; } } @media (max-width: 1400px) { .box-category .category .item .title-category { margin-top: 10px; } } @media (max-width: 1199px) { .box-category .category .item .title-category { font-size: 20px; line-height: 30px; height: 30px; } } .box-category .category .item .common-more { margin-top: 30px; } @media (max-width: 1720px) { .box-category .category .item .common-more { margin-top: 20px; } } @media (max-width: 1400px) { .box-category .category .item .common-more { margin-top: 10px; } } @media (min-width: 1200px) { .box-category .category .item:hover .img-box img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .box-category .category .item:hover .title-category { color: #ff6310; } .box-category .category .item:hover .common-more span { color: #fff; border-color: #ff6310; background-color: #ff6310; } } .box-about .about .title .icon { width: 98px; } @media (max-width: 1199px) { .box-about .about .title .icon { width: 80px; } } @media (max-width: 991px) { .box-about .about .title .icon { width: 70px; } } .box-about .about .title .icon img { width: 100%; } .box-about .about .title .subtitle { position: relative; display: inline-block; margin-top: 40px; } @media (max-width: 1199px) { .box-about .about .title .subtitle { margin-top: 20px; } } .box-about .about .title .subtitle img { width: 110px; } .box-about .about .title .subtitle img img { width: 100%; } .box-about .about .title .subtitle h3 { font-family: 'Fredoka'; font-size: 16px; font-weight: 500; line-height: 24px; position: absolute; top: 50%; left: 40%; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); white-space: nowrap; color: #ff6310; } .box-about .about .title h2 { background: none; } .box-about .about .link { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-top: 8vw; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media (max-width: 1560px) { .box-about .about .link { margin-top: 4vw; } } @media (max-width: 1199px) { .box-about .about .link { margin-top: 30px; } } .box-about .about .common-more { margin-right: 50px; } @media (max-width: 1400px) { .box-about .about .common-more { margin-right: 30px; } } .box-about .about .email { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media (max-width: 767px) { .box-about .about .email { width: 100%; margin-top: 20px; } } .box-about .about .email .icon { font-size: 20px; line-height: 48px; width: 48px; height: 48px; text-align: center; border: 1px solid #a1a4b1; border-radius: 24px; border-radius: 50%; } .box-about .about .email .txt { padding-left: 6px; } .box-about .about .email b { font-family: 'Fredoka'; font-size: 24px; font-weight: 500; line-height: 30/24; } @media (max-width: 1400px) { .box-about .about .email b { font-size: 20px; } } .box-about .about .email p { font-size: 18px; line-height: 24/18; margin: 4px 0 0 0; } .box-about .about .email p a { -webkit-transition: all .2s; transition: all .2s; } .box-about .about .email p a span { -webkit-transition: background-size .56s; transition: background-size .56s; background-image: -webkit-gradient(linear, left top, right top, from(#ff6310), to(#ff6310)); background-image: -webkit-linear-gradient(left, #ff6310 0%, #ff6310 100%); background-image: linear-gradient(to right, #ff6310 0%, #ff6310 100%); background-repeat: no-repeat; background-position: 0 95%; background-size: 0 1px; } .box-about .about .email p a:hover { color: #ff6310; } .box-about .about .email p a:hover span { background-size: 100% 1px; } .box-about .about .about-left { width: 50%; padding-right: 5%; } @media (max-width: 991px) { .box-about .about .about-left { width: 100%; padding-right: 0; } } .box-about .about .about-right { position: relative; width: 50%; height: 100%; } @media (max-width: 991px) { .box-about .about .about-right { width: 100%; margin-top: 30px; } } .box-about .about .about-right img { width: 100%; } .box-about .about .about-right .number { position: absolute; z-index: 6; top: 0; right: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: column; width: 25%; height: 26%; text-align: center; color: #fff; border-radius: 30px; background-color: #ff6310; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media (max-width: 1199px) { .box-about .about .about-right .number { border-radius: 20px; } } @media (max-width: 767px) { .box-about .about .about-right .number { border-radius: 10px; } } .box-about .about .about-right .number b { font-size: 49px; font-weight: 600; line-height: 1; display: block; } @media (max-width: 1720px) { .box-about .about .about-right .number b { font-size: 40px; } } @media (max-width: 1400px) { .box-about .about .about-right .number b { font-size: 34px; } } @media (max-width: 1199px) { .box-about .about .about-right .number b { font-size: 30px; } } @media (max-width: 767px) { .box-about .about .about-right .number b { font-size: 16px; } } .box-about .about .about-right .number p { font-size: 20px; line-height: 24/20; margin: 10px 0 0 0; } @media (max-width: 1720px) { .box-about .about .about-right .number p { font-size: 18px; } } @media (max-width: 1400px) { .box-about .about .about-right .number p { font-size: 16px; } } @media (max-width: 767px) { .box-about .about .about-right .number p { font-size: 12px; } } .box-about .best { margin-top: 60px; } @media (max-width: 1199px) { .box-about .best { margin-top: 30px; } } @media (max-width: 767px) { .box-about .best { margin-top: 0; } } .box-about .best ul li:nth-child(2) .item { background-image: url(../images/best_right_bg.jpg); } .box-about .best .item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: row-reverse; margin-top: 30px; color: #fff; border-radius: 30px; background: url(../images/best_left_bg.jpg) no-repeat center; background-size: 100% 100%; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-orient: horizontal; -webkit-box-direction: reverse; -webkit-flex-direction: row-reverse; -ms-flex-direction: row-reverse; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media (max-width: 1199px) { .box-about .best .item { border-radius: 20px; } } @media (max-width: 767px) { .box-about .best .item { border-radius: 10px; } } .box-about .best .item .pic { overflow: hidden; width: 50%; height: 100%; border-radius: 20px; } @media (max-width: 1720px) { .box-about .best .item .pic { width: 55%; } } @media (max-width: 767px) { .box-about .best .item .pic { width: 100%; border-radius: 10px; } } .box-about .best .item .pic .img-box { padding-bottom: 57.14285714%; } .box-about .best .item .pic .img-box img { -webkit-transition: all 1s; transition: all 1s; } .box-about .best .item .text { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: column; width: 50%; padding: 20px 30px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } @media (max-width: 1720px) { .box-about .best .item .text { width: 45%; padding: 10px 20px; } } @media (max-width: 1560px) { .box-about .best .item .text { padding-top: 8px; padding-bottom: 8px; } } @media (max-width: 767px) { .box-about .best .item .text { width: 100%; padding: 15px; } } .box-about .best .item .text:after { position: absolute; right: 30px; bottom: 20px; display: block; width: 65px; height: 78px; content: ''; background: url(../images/best-line.png) no-repeat center; background-size: cover; } @media (max-width: 1720px) { .box-about .best .item .text:after { right: 20px; bottom: 20px; width: 50px; height: 60px; } } @media (max-width: 991px) { .box-about .best .item .text:after { right: 0; bottom: 0; } } .box-about .best .item .text .title-best h3 { font-size: 24px; line-height: 30/24; color: #ff6310; } @media (max-width: 1720px) { .box-about .best .item .text .title-best h3 { font-size: 20px; } } .box-about .best .item .text .title-best h2 { font-family: 'Fredoka'; font-size: 36px; font-weight: 600; line-height: 40/36; } @media (max-width: 1720px) { .box-about .best .item .text .title-best h2 { font-size: 30px; } } @media (max-width: 1560px) { .box-about .best .item .text .title-best h2 { font-size: 24px; } } .box-about .best .item .text .note { display: -webkit-box; overflow: hidden; max-height: 56px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } @media (max-width: 767px) { .box-about .best .item .text .note { max-height: 48px; } } .box-about .best .item .text .note p { color: rgba(255, 255, 255, .8); } .box-about .best .item .text .common-more { margin-top: 10px; } .box-process .process { position: relative; } .box-process .process:before { position: absolute; z-index: 6; top: 0; right: 100%; display: block; width: 100%; height: 100%; content: ''; background-color: #fff; } .box-process .process .slick-list { overflow: visible; } .box-process .process .item { position: relative; text-align: center; } .box-process .process .item .num { font-family: 'Fredoka'; font-size: 40px; font-weight: 500; line-height: 100px; position: absolute; z-index: 3; top: 0; right: 0; width: 100px; height: 100px; text-align: center; color: #ff6310; border: 1px solid #ff6310; border-radius: 50%; } @media (max-width: 1720px) { .box-process .process .item .num { font-size: 30px; line-height: 70px; width: 70px; height: 70px; } } @media (max-width: 1400px) { .box-process .process .item .num { font-size: 24px; line-height: 50px; width: 50px; height: 50px; } } .box-process .process .item .pic { position: relative; -webkit-mask: url('data:image/svg+xml;utf8,') no-repeat center / contain; mask: url('data:image/svg+xml;utf8,') no-repeat center / contain; } .box-process .process .item .pic .img-box { padding-bottom: 117.85714286%; } .box-process .process .item .title-process { font-family: 'Fredoka'; font-size: 32px; font-weight: 500; line-height: 40/32; position: absolute; z-index: 6; bottom: 0; left: 0; width: 100%; padding: 40px; color: #fff; background-image: -webkit-gradient(linear, left top, left bottom, from(transparent), to(rgba(0, 0, 0, .7))); background-image: -webkit-linear-gradient(transparent, rgba(0, 0, 0, .7)); background-image: linear-gradient(transparent, rgba(0, 0, 0, .7)); } @media (max-width: 1720px) { .box-process .process .item .title-process { font-size: 28px; padding: 20px; } } @media (max-width: 1560px) { .box-process .process .item .title-process { font-size: 24px; } } @media (max-width: 1400px) { .box-process .process .item .title-process { font-size: 20px; } } @media (max-width: 991px) { .box-process .process .item .title-process { font-size: 18px; } } .box-choose { background: url(../images/choose_bg.png) no-repeat bottom center; background-size: 100% 90%; } @media (max-width: 1199px) { .box-choose { background: #ff6310; } } .box-choose .choose-left { width: 50%; padding-right: 5%; } @media (max-width: 1720px) { .box-choose .choose-left { padding: 150px 0; } } @media (max-width: 1199px) { .box-choose .choose-left { padding: 50px 0; } } @media (max-width: 991px) { .box-choose .choose-left { width: 100%; } } .box-choose .choose-left .title .subtitle { color: #fff; } .box-choose .choose-left .title h2 { background: none; } .box-choose .choose-left .note { max-width: 570px; } .box-choose .choose-left .note p { color: #222; } .box-choose .choose-left .choose-list { margin-top: 30px; } @media (min-width: 1200px) { .box-choose .choose-left .choose-list ul { margin: 0 -20px; } .box-choose .choose-left .choose-list ul li { padding: 0 20px; } } .box-choose .choose-left .choose-list ul li { margin-top: 20px; } .box-choose .choose-left .choose-list .title-choose { font-family: 'Fredoka'; font-size: 32px; font-weight: 600; color: #fff; } @media (max-width: 1560px) { .box-choose .choose-left .choose-list .title-choose { font-size: 28px; } } @media (max-width: 1199px) { .box-choose .choose-left .choose-list .title-choose { font-size: 24px; } } @media (max-width: 767px) { .box-choose .choose-left .choose-list .title-choose { font-size: 20px; } } .box-choose .choose-left .choose-list .item .icon { font-size: 30px; line-height: 80px; width: 80px; height: 80px; text-align: center; color: #fff; border-radius: 30px; background-color: #222; } @media (max-width: 1199px) { .box-choose .choose-left .choose-list .item .icon { font-size: 24px; line-height: 60px; width: 60px; height: 60px; border-radius: 20px; } } @media (max-width: 767px) { .box-choose .choose-left .choose-list .item .icon { border-radius: 10px; } } .box-choose .choose-left .choose-list .item .note { margin-top: 10px; } .box-choose .choose-left .choose-list .item .note h3 { font-size: 18px; font-weight: 600; line-height: 24/18; } .box-choose .choose-left .choose-list .item .note p { font-size: 14px; line-height: 22/14; margin: 0; } @media (min-width: 1200px) { .box-choose .choose-left .choose-list .item:hover .icon { -webkit-animation: swing 1s 0s ease both; animation: swing 1s 0s ease both; } } .box-choose .choose-right { width: 50%; padding: 0 3%; } @media (max-width: 991px) { .box-choose .choose-right { width: 100%; } } .box-choose .choose-right .pic { position: relative; } .box-choose .choose-right .pic .img2 { position: absolute; z-index: 6; bottom: 0; width: 100%; } .box-choose .choose-right img { width: 100%; } @media (min-width: 768px) { .box-workshop .workshop ul { display: grid; grid-template-columns: repeat(6, 1fr); grid-template-rows: repeat(2, 1fr); grid-column-gap: 30px; grid-row-gap: 30px; } } @media (min-width: 768px) and (max-width: 1400px) { .box-workshop .workshop ul { grid-column-gap: 20px; grid-row-gap: 20px; } } @media (min-width: 768px) and (max-width: 1199px) { .box-workshop .workshop ul { grid-column-gap: 10px; grid-row-gap: 10px; } } @media (max-width: 767px) { .box-workshop .workshop ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -8px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } @media (max-width: 767px) { .box-workshop .workshop ul li { width: 50%; padding: 8px; } } @media (min-width: 768px) { .box-workshop .workshop ul li:nth-child(1) { grid-area: 1 / 1 / 3 / 3; } .box-workshop .workshop ul li:nth-child(2) { grid-area: 1 / 3 / 2 / 4; } .box-workshop .workshop ul li:nth-child(3) { grid-area: 2 / 3 / 3 / 4; } .box-workshop .workshop ul li:nth-child(4) { grid-area: 1 / 4 / 3 / 6; } .box-workshop .workshop ul li:nth-child(5) { grid-area: 1 / 6 / 2 / 7; } .box-workshop .workshop ul li:nth-child(6) { grid-area: 2 / 6 / 3 / 7; } } @media (max-width: 767px) { .box-workshop .workshop ul li:nth-child(1), .box-workshop .workshop ul li:nth-child(4) { width: 100%; } } .box-workshop .item { overflow: hidden; height: 100%; border-radius: 30px; } @media (max-width: 1400px) { .box-workshop .item { border-radius: 20px; } } @media (max-width: 1199px) { .box-workshop .item { border-radius: 10px; } } .box-workshop .item img { width: 100%; height: 100%; object-fit: cover; } .common-news-item .pic { overflow: hidden; border-radius: 30px; } @media (max-width: 1199px) { .common-news-item .pic { border-radius: 20px; } } @media (max-width: 767px) { .common-news-item .pic { border-radius: 10px; } } .common-news-item .pic .img-box { padding-bottom: 62.06896552%; } .common-news-item .pic .img-box img { -webkit-transition: all 1s; transition: all 1s; } .common-news-item .text { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; margin-top: 40px; } @media (max-width: 1199px) { .common-news-item .text { margin-top: 20px; } } .common-news-item .text .date { width: 70px; } @media (max-width: 1199px) { .common-news-item .text .date { width: 60px; } } @media (max-width: 767px) { .common-news-item .text .date { width: 50px; } } .common-news-item .text .date b { font-size: 56px; font-weight: 500; line-height: 1.2; display: block; border-bottom: 1px solid #cfd4ef; } @media (max-width: 1560px) { .common-news-item .text .date b { font-size: 50px; } } @media (max-width: 1470px) { .common-news-item .text .date b { font-size: 44px; } } @media (max-width: 1400px) { .common-news-item .text .date b { font-size: 40px; } } @media (max-width: 1199px) { .common-news-item .text .date b { font-size: 36px; } } @media (max-width: 991px) { .common-news-item .text .date b { font-size: 30px; } } @media (max-width: 767px) { .common-news-item .text .date b { font-size: 24px; } } .common-news-item .text .date span { font-size: 22px; font-weight: 500; line-height: 30/22; display: block; margin-top: 8px; } @media (max-width: 1560px) { .common-news-item .text .date span { font-size: 20px; } } @media (max-width: 1199px) { .common-news-item .text .date span { font-size: 18px; } } @media (max-width: 991px) { .common-news-item .text .date span { font-size: 16px; } } .common-news-item .text .note { width: -webkit-calc(100% - 70px); width: calc(100% - 70px); padding-left: 5%; } @media (max-width: 1199px) { .common-news-item .text .note { width: -webkit-calc(100% - 60px); width: calc(100% - 60px); padding-left: 20px; } } @media (max-width: 767px) { .common-news-item .text .note { width: -webkit-calc(100% - 50px); width: calc(100% - 50px); } } .common-news-item .text .title-news { font-size: 26px; font-weight: 500; line-height: 30px; display: -webkit-box; overflow: hidden; max-height: 60px; letter-spacing: -1.04px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } @media (max-width: 1560px) { .common-news-item .text .title-news { font-size: 24px; } } @media (max-width: 1199px) { .common-news-item .text .title-news { font-size: 20px; } } @media (max-width: 991px) { .common-news-item .text .title-news { font-size: 18px; line-height: 24px; max-height: 48px; letter-spacing: -.04px; } } .common-news-item .text .title-news span { -webkit-transition: background-size .56s; transition: background-size .56s; background-image: -webkit-gradient(linear, left top, right top, from(#ff6310), to(#ff6310)); background-image: -webkit-linear-gradient(left, #ff6310 0%, #ff6310 100%); background-image: linear-gradient(to right, #ff6310 0%, #ff6310 100%); background-repeat: no-repeat; background-position: 0 95%; background-size: 0 1px; } .common-news-item .text .editor-content { display: -webkit-box; overflow: hidden; max-height: 56px; margin-top: 10px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } @media (max-width: 767px) { .common-news-item .text .editor-content { max-height: 48px; } } @media (min-width: 1200px) { .common-news-item:hover .pic .img-box img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .common-news-item:hover .text .date b { color: #ff6310; } .common-news-item:hover .text .title-news { color: #ff6310; } .common-news-item:hover .text .title-news span { background-size: 100% 1px; } } .box-follow .follow .item { margin: 10px 0; } .box-follow .follow .item .title-follow { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-top: 30px; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } @media (max-width: 1199px) { .box-follow .follow .item .title-follow { margin-top: 20px; } } .box-follow .follow .item .title-follow .icon { font-size: 32px; line-height: 1; margin-right: 20px; } @media (max-width: 767px) { .box-follow .follow .item .title-follow .icon { font-size: 24px; } } .box-follow .follow .item .title-follow h3 { font-size: 24px; font-weight: 500; line-height: 30/20; margin: 0; } @media (max-width: 1400px) { .box-follow .follow .item .title-follow h3 { font-size: 20px; } } @media (max-width: 991px) { .box-follow .follow .item .title-follow h3 { font-size: 18px; margin-top: 10px; } } .box-follow .follow .item .title-follow:hover h3 { color: #ff6310; } .box-follow .follow .item .iframe { overflow: hidden; border-radius: 10px; } .box-follow .follow .item .img-box { padding-bottom: 124.52830189%; } .box-follow .follow .item .img-box > img { display: none !important; height: auto; } .box-follow .follow .item iframe[src=''], .box-follow .follow .item iframe[data-src=''] { display: none; border: 1px solid #000; } .box-follow .follow .item iframe[src=''] + img, .box-follow .follow .item iframe[data-src=''] + img { display: block !important; } .footer { overflow: hidden; color: #fff; background: url(../images/foot_bg.jpg) no-repeat left bottom; background-size: cover; } @media (max-width: 991px) { .footer { padding-bottom: 80px; } } .footer .title-foot h3 { font-size: 24px; font-weight: bold; line-height: 30/26; } @media (max-width: 1199px) { .footer .title-foot h3 { font-size: 20px; } } .footer .foot { padding: 80px 0 60px; } @media (max-width: 1400px) { .footer .foot { padding: 60px 0 40px; } } @media (max-width: 1199px) { .footer .foot { padding: 30px 0; } } .footer .foot-txt { max-width: 360px; } @media (max-width: 1470px) { .footer .foot-txt { max-width: 300px; } } @media (max-width: 1400px) { .footer .foot-txt { max-width: 250px; } } @media (max-width: 991px) { .footer .foot-txt { max-width: 50%; } } @media (max-width: 767px) { .footer .foot-txt { max-width: 100%; margin-top: 20px; } } .footer .foot-txt .txt { padding: 25px 0; } @media (max-width: 1400px) { .footer .foot-txt .txt { padding: 20px 0; } } @media (max-width: 1199px) { .footer .foot-txt .txt { padding: 15px 0; } } @media (max-width: 767px) { .footer .foot-txt .txt { margin-top: 10px; padding: 0; } } .footer .foot-txt .txt b { font-size: 16px; font-weight: normal; line-height: 26/16; display: block; margin-bottom: 10px; -webkit-transition: all .2s; transition: all .2s; } .footer .foot-txt .txt p { font-size: 20px; line-height: 32/20; margin: 0; } @media (max-width: 1400px) { .footer .foot-txt .txt p { font-size: 18px; } } @media (max-width: 767px) { .footer .foot-txt .txt p { font-size: 16px; } } .footer .foot-txt .txt a { -webkit-transition: all .2s; transition: all .2s; } .footer .foot-txt .txt a:hover { color: #ff6310; } @media (max-width: 991px) { .footer .foot-nav { width: 50%; } } @media (max-width: 767px) { .footer .foot-nav { width: 100%; margin-top: 20px; } } .footer .foot-nav .foot-info { margin-top: 15px; } @media (max-width: 767px) { .footer .foot-nav .foot-info > ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } } @media (max-width: 767px) { .footer .foot-nav .foot-info > ul > li { margin-right: 15px; } } .footer .foot-nav .foot-info > ul > li > a { font-size: 20px; line-height: 24px; display: block; padding: 12px 0; -webkit-transition: all .2s; transition: all .2s; } @media (max-width: 1400px) { .footer .foot-nav .foot-info > ul > li > a { font-size: 18px; padding: 8px 0; } } @media (max-width: 767px) { .footer .foot-nav .foot-info > ul > li > a { font-size: 16px; padding: 4px 0; } } .footer .foot-nav .foot-info > ul > li > a:hover { color: #ff6310; } .footer .foot-message { width: 100%; max-width: 440px; } @media (max-width: 1400px) { .footer .foot-message { max-width: 340px; } } @media (max-width: 991px) { .footer .foot-message { max-width: 50%; padding-right: 5%; } } @media (max-width: 767px) { .footer .foot-message { max-width: 100%; padding-right: 0; } } .footer .foot-message .foot-logo { height: 90px; } @media (max-width: 1199px) { .footer .foot-message .foot-logo { height: 80px; } } @media (max-width: 991px) { .footer .foot-message .foot-logo { height: 70px; } } @media (max-width: 767px) { .footer .foot-message .foot-logo { height: 60px; } } .footer .foot-message .foot-logo img { height: 100%; } .footer .foot-message .message { margin-top: 30px; } @media (max-width: 1400px) { .footer .foot-message .message { margin-top: 20px; } } .footer .foot-message .message p { font-size: 26px; font-weight: bold; line-height: 30/24; color: #fff; } @media (max-width: 1199px) { .footer .foot-message .message p { font-size: 20px; letter-spacing: 0; } } @media (max-width: 991px) { .footer .foot-message .message p { font-size: 18px; } } .footer .foot-message .message form { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } .footer .foot-message .message form:before { font-family: 'iconfont' !important; font-size: 24px; line-height: 54px; position: absolute; left: 10px; content: '\e908'; } .footer .foot-message .message form input { line-height: 24px; width: -webkit-calc(100% - 60px); width: calc(100% - 60px); padding: 15px 20px 15px 40px; color: #fff; border: 1px solid #fff; border-radius: 6px; background: none; background-size: cover; } @media (max-width: 991px) { .footer .foot-message .message form input { width: -webkit-calc(100% - 50px); width: calc(100% - 50px); padding: 10px 15px 10px 40px; } } .footer .foot-message .message form input::-webkit-input-placeholder, .footer .foot-message .message form textarea::-webkit-input-placeholder { color: #fff; } .footer .foot-message .message form input:-o-placeholder, .footer .foot-message .message form textarea:-o-placeholder { color: #fff; } .footer .foot-message .message form input::-moz-placeholder, .footer .foot-message .message form textarea::-moz-placeholder { color: #fff; } .footer .foot-message .message form input:-ms-input-placeholder, .footer .foot-message .message form textarea:-ms-input-placeholder { color: #fff; } .footer .foot-message .message form input:focus::-webkit-input-placeholder, .footer .foot-message .message form textarea:focus::-webkit-input-placeholder { color: #c5c5c5; } .footer .foot-message .message form input:focus::-o-placeholder, .footer .foot-message .message form textarea:focus::-o-placeholder { color: #c5c5c5; } .footer .foot-message .message form input:focus::-moz-placeholder, .footer .foot-message .message form textarea:focus::-moz-placeholder { color: #c5c5c5; } .footer .foot-message .message form input:focus::-ms-input-placeholder, .footer .foot-message .message form textarea:focus::-ms-input-placeholder { color: #c5c5c5; } .footer .foot-message .message form .submit { width: 54px; height: 54px; color: #fff; background-color: #ff6310; } @media (max-width: 991px) { .footer .foot-message .message form .submit { width: 44px; height: 44px; } } .footer .foot-message .message form .submit .iconfont { display: block; -webkit-transition: all .6s; transition: all .6s; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .footer .foot-message .message form .submit:hover .iconfont { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } .footer .copyright { font-size: 20px; line-height: 24px; margin-top: 30px; padding: 25px 0; color: rgba(255, 255, 255, .8); border-top: 1px solid rgba(161, 164, 177, .2); } @media (max-width: 1400px) { .footer .copyright { font-size: 18px; padding: 20px 0; } } @media (max-width: 1199px) { .footer .copyright { font-size: 16px; line-height: 24px; } } @media (max-width: 767px) { .footer .copyright { padding: 10px 0; } } .footer .copyright p { margin: 0; } .footer .copyright a span { -webkit-transition: background-size .56s; transition: background-size .56s; background-image: -webkit-gradient(linear, left top, right top, from(#ff6310), to(#ff6310)); background-image: -webkit-linear-gradient(left, #ff6310 0%, #ff6310 100%); background-image: linear-gradient(to right, #ff6310 0%, #ff6310 100%); background-repeat: no-repeat; background-position: 0 95%; background-size: 0 1px; } .footer .copyright a:hover { color: #ff6310; } .footer .copyright a:hover span { background-size: 100% 1px; } .footer .copyright .link { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .footer .copyright .link .line { width: 1px; height: 8px; margin: 0 20px; background: #c9cee0; } .wrap { overflow: hidden; padding: 100px 0; } @media (max-width: 1560px) { .wrap { padding: 80px 0; } } @media (max-width: 1400px) { .wrap { padding: 70px 0; } } @media (max-width: 991px) { .wrap { padding: 50px 0; } } .pt-60 { padding-top: 60px; } @media (max-width: 1199px) { .pt-60 { padding-top: 50px; } } @media (max-width: 991px) { .pt-60 { padding-top: 40px; } } .wrap-left { width: 380px; } @media (max-width: 1560px) { .wrap-left { width: 300px; } } .wrap-right { width: -webkit-calc(100% - 380px); width: calc(100% - 380px); padding-left: 3%; } @media (max-width: 1560px) { .wrap-right { width: -webkit-calc(100% - 300px); width: calc(100% - 300px); } } @media (max-width: 1199px) { .wrap-right { width: 100%; padding-left: 15px; } } .wrap-location .location { font-family: 'Fredoka'; font-size: 20px; font-weight: 600; line-height: 30/20; } @media (max-width: 1199px) { .wrap-location .location { font-size: 18px; } } @media (max-width: 991px) { .wrap-location .location { font-size: 16px; } } .wrap-location .location > ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .wrap-location .location > ul > li { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .wrap-location .location > ul > li:after { margin: 0 4px; content: '/'; } .wrap-location .location > ul > li:last-child:after { display: none; } .wrap-location .location > ul > li > a { display: block; -webkit-transition: all .2s; transition: all .2s; } .wrap-location .location > ul > li > a:hover { text-decoration: underline; color: #eb5301; } .wrap-menu { position: relative; z-index: 9; margin-top: -30px; } @media (max-width: 767px) { .wrap-menu { margin-top: -25px; } } .wrap-menu ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -5px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .wrap-menu ul li { padding: 5px; } .wrap-menu ul li a { font-weight: 600; line-height: 26/16; display: block; padding: 12px 34px; -webkit-transition: all .2s; transition: all .2s; color: #fff; border: 1px solid #ebe9d9; border-radius: 30px; background: #2b2b2b; } @media (max-width: 1199px) { .wrap-menu ul li a { padding: 12px 20px; } } @media (max-width: 767px) { .wrap-menu ul li a { font-size: 14px; line-height: 20/14; padding: 10px; } } .wrap-menu ul li.active a, .wrap-menu ul li:hover a { color: #fff; border-color: #ff6310; background-color: #ff6310; } .wrap-sidenav { position: relative; } @media (max-width: 1199px) { .wrap-sidenav { display: none; } } .wrap-sidenav .title-sidenav h3 { font-family: 'Fredoka'; font-size: 34px; font-weight: 500; line-height: 1; } @media (max-width: 1400px) { .wrap-sidenav .title-sidenav h3 { font-size: 30px; } } .wrap-sidenav .search-product { margin-top: 14px; } .wrap-sidenav .search-product form { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; border-radius: 10px; background: rgba(255, 99, 16, .05); -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .wrap-sidenav .search-product form input { line-height: 50px; width: 100%; padding: 0 16px; background: none; } .wrap-sidenav .search-product form input::-webkit-input-placeholder, .wrap-sidenav .search-product form textarea::-webkit-input-placeholder { color: #666; } .wrap-sidenav .search-product form input:-o-placeholder, .wrap-sidenav .search-product form textarea:-o-placeholder { color: #666; } .wrap-sidenav .search-product form input::-moz-placeholder, .wrap-sidenav .search-product form textarea::-moz-placeholder { color: #666; } .wrap-sidenav .search-product form input:-ms-input-placeholder, .wrap-sidenav .search-product form textarea:-ms-input-placeholder { color: #666; } .wrap-sidenav .search-product form input:focus::-webkit-input-placeholder, .wrap-sidenav .search-product form textarea:focus::-webkit-input-placeholder { color: #c5c5c5; } .wrap-sidenav .search-product form input:focus::-o-placeholder, .wrap-sidenav .search-product form textarea:focus::-o-placeholder { color: #c5c5c5; } .wrap-sidenav .search-product form input:focus::-moz-placeholder, .wrap-sidenav .search-product form textarea:focus::-moz-placeholder { color: #c5c5c5; } .wrap-sidenav .search-product form input:focus::-ms-input-placeholder, .wrap-sidenav .search-product form textarea:focus::-ms-input-placeholder { color: #c5c5c5; } .wrap-sidenav .search-product form .submit { width: 40px; height: 50px; text-align: center; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .wrap-sidenav .sidenav { position: relative; z-index: 6; margin-top: 30px; } .wrap-sidenav .sidenav .slevel-1 > li { position: relative; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; overflow: hidden; width: 100%; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } .wrap-sidenav .sidenav .slevel-1 > li:before { display: block; width: 6px; height: 30px; margin-right: 18px; content: ''; border-radius: 0 6px 6px 0; background-color: #ff6310; } .wrap-sidenav .sidenav .slevel-1 > li > a { font-family: 'Fredoka'; font-size: 24px; font-weight: 500; line-height: 30px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; padding: 30px 0; -webkit-transition: all .2s; transition: all .2s; border-bottom: 1px solid #c4c9ea; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } @media (max-width: 1560px) { .wrap-sidenav .sidenav .slevel-1 > li > a { font-size: 20px; } } .wrap-sidenav .sidenav .slevel-1 > li > a:after { font-family: 'iconfont' !important; line-height: 30px; width: 30px; height: 30px; margin-left: 20px; content: '\e9b6'; -webkit-transition: all .4s; transition: all .4s; text-align: center; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } .wrap-sidenav .sidenav .slevel-1 > li.active > a, .wrap-sidenav .sidenav .slevel-1 > li:hover > a { color: #ff6310; } .wrap-sidenav .sidenav .slevel-1 > li.active .slevel-2 { display: block; } .wrap-sidenav .sidenav .slevel-2 { display: none; padding: 15px 20px; } @media (max-width: 1400px) { .wrap-sidenav .sidenav .slevel-2 { padding: 15px; } } .wrap-sidenav .sidenav .slevel-2 > li { padding: 5px 0; border-left: 1px solid #dedede; } .wrap-sidenav .sidenav .slevel-2 > li > a { font-size: 18px; line-height: 24px; position: relative; display: block; padding: 3px 20px; -webkit-transition: all .4s; transition: all .4s; color: #666; border-radius: 10px; } @media (max-width: 1400px) { .wrap-sidenav .sidenav .slevel-2 > li > a { font-size: 16px; } } .wrap-sidenav .sidenav .slevel-2 > li > a:before { position: absolute; top: 50%; left: 0; display: block; width: 1px; height: 0; content: ''; -webkit-transition: all .4s; transition: all .4s; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); background-color: #ff6310; } .wrap-sidenav .sidenav .slevel-2 > li.active > a, .wrap-sidenav .sidenav .slevel-2 > li:hover > a { color: #ff6310; } .wrap-sidenav .sidenav .slevel-2 > li.active > a:before, .wrap-sidenav .sidenav .slevel-2 > li:hover > a:before { height: 100%; } .xs-product-nav { display: none; overflow: hidden; padding: 20px 0 0 0; } @media (max-width: 1199px) { .xs-product-nav { display: block; } } .xs-product-nav ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -4px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } .xs-product-nav ul > li { display: inline-block; overflow: hidden; height: auto; padding: 4px; vertical-align: top; } @media (max-width: 767px) { .xs-product-nav ul > li { width: 50%; } } .xs-product-nav ul > li > a { font-size: 14px; line-height: 24px; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: column; height: 100%; padding: 4px 10px; text-transform: capitalize; border: 1px solid #dcdcdc; border-radius: 5px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } @media (max-width: 767px) { .xs-product-nav ul > li > a { line-height: 20px; } } .xs-product-nav ul > li.active > a { color: #fff; border-color: #ff6310; background-color: #ff6310; } .wrap-about { position: relative; z-index: 6; } .wrap-about .about { max-width: 1420px; margin: 0 auto; } .wrap-about .video { position: relative; overflow: hidden; border-radius: 80px; } @media (max-width: 1560px) { .wrap-about .video { border-radius: 60px; } } @media (max-width: 1199px) { .wrap-about .video { border-radius: 30px; } } @media (max-width: 767px) { .wrap-about .video { border-radius: 10px; } } .wrap-about .video img { width: 100%; } .wrap-about .video .play { font-size: 30px; position: absolute; z-index: 6; top: 50%; left: 50%; display: block; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 120px; height: 120px; cursor: pointer; -webkit-transition: all .6s; transition: all .6s; -webkit-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); color: #ff6310; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } @media (max-width: 1560px) { .wrap-about .video .play { width: 100px; height: 100px; } } @media (max-width: 1199px) { .wrap-about .video .play { width: 80px; height: 80px; } } .wrap-about .video .play:before { position: absolute; z-index: 1; top: 0; left: 0; display: block; width: 100%; height: 100%; content: ''; -webkit-animation: zhuan 3s linear infinite; animation: zhuan 3s linear infinite; background: url(../images/play.png) no-repeat center; background-size: cover; } .wrap-about .video .play .iconfont { position: relative; z-index: 6; } .wrap-about .video .play:hover { width: 130px; height: 130px; } .wrap-number { position: relative; z-index: 1; } @media (min-width: 1200px) { .wrap-number { overflow: visible; } } .wrap-number .numbg { position: absolute; z-index: 1; top: 50%; left: 0; -webkit-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); } @media (max-width: 1199px) { .wrap-number .numbg { display: none; } } .wrap-number .number { position: relative; z-index: 6; } .wrap-number .number ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin: 0 -30px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; } @media (max-width: 1199px) { .wrap-number .number ul { margin: 0 -10px; } } .wrap-number .number ul li { width: 25%; padding: 0 30px; } @media (max-width: 1199px) { .wrap-number .number ul li { width: 50%; margin-top: 20px; padding: 0 10px; } } .wrap-number .number .item .subtitle { font-size: 28px; font-weight: 500; line-height: 30/20; margin-top: 10px; padding: 10px 0; border-bottom: 1px solid #c4c9ea; } @media (max-width: 1560px) { .wrap-number .number .item .subtitle { font-size: 24px; } } @media (max-width: 1199px) { .wrap-number .number .item .subtitle { font-size: 20px; } } @media (max-width: 767px) { .wrap-number .number .item .subtitle { font-size: 18px; } } .wrap-number .number .item b { font-family: 'Fredoka'; font-size: 120px; font-weight: 500; line-height: 1; color: #ff6310; } @media (max-width: 1560px) { .wrap-number .number .item b { font-size: 100px; } } @media (max-width: 1470px) { .wrap-number .number .item b { font-size: 80px; } } @media (max-width: 1199px) { .wrap-number .number .item b { font-size: 60px; } } @media (max-width: 991px) { .wrap-number .number .item b { font-size: 34px; } } .wrap-number .number .item p { line-height: 24px; margin: 10px 0 0 0; letter-spacing: -.16px; color: #666; } .wrap-factory { position: relative; z-index: 6; } .wrap-factory .factory .slick-factory { margin: 0 -12px; } .wrap-factory .factory .slick-slide > div > div { margin-top: 40px; padding: 0 12px; } @media (max-width: 991px) { .wrap-factory .factory .slick-slide > div > div { margin-top: 20px; } } .wrap-factory .factory .item { position: relative; cursor: pointer; } .wrap-factory .factory .item .pic { position: relative; overflow: hidden; border-radius: 10px; } .wrap-factory .factory .item .pic:before { position: absolute; z-index: 2; bottom: 0; left: 0; display: block; width: 100%; height: 30%; content: ''; background: -webkit-gradient(linear, left top, left bottom, from(rgba(0, 0, 0, 0)), to(#000)); background: -webkit-linear-gradient(top, rgba(0, 0, 0, 0) 0%, #000 100%); background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%); } .wrap-factory .factory .item .pic .img-box { padding-bottom: 67.04545455%; } .wrap-factory .factory .item .pic .img-box img { -webkit-transition: all 1s; transition: all 1s; } @media (min-width: 1200px) { .wrap-factory .factory .item:hover .pic .img-box img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } } .wrap-solutions .slick-list { font-size: 0; margin: 0; } .wrap-solutions .slick-list .slick-slide { padding: 0; } .wrap-solutions .item .img-box { padding-bottom: 150%; } .wrap-solutions .item .img-box img { -webkit-transition: all 1s; transition: all 1s; } .wrap-solutions .item .text { position: absolute; z-index: 6; bottom: 0; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: column; width: 100%; min-height: 280px; padding: 40px 8%; background: -webkit-gradient(linear, left top, left bottom, from(rgba(255, 255, 255, 0)), to(rgba(255, 255, 255, .6))); background: -webkit-linear-gradient(top, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .6) 100%); background: linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, .6) 100%); -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; -webkit-backdrop-filter: blur(50px); backdrop-filter: blur(50px); } @media (max-width: 1470px) { .wrap-solutions .item .text { min-height: 200px; } } @media (max-width: 767px) { .wrap-solutions .item .text { min-height: 180px; } } .wrap-solutions .item .text .line { position: absolute; right: 20%; bottom: 100px; overflow: hidden; -webkit-transition: all .4s; transition: all .4s; opacity: 0; } .wrap-solutions .item .text .title-solutions { font-family: 'Fredoka'; font-size: 36px; font-weight: 500; letter-spacing: -.64px; color: #3e0202; } @media (max-width: 1560px) { .wrap-solutions .item .text .title-solutions { font-size: 30px; } } @media (max-width: 1199px) { .wrap-solutions .item .text .title-solutions { font-size: 24px; } } .wrap-solutions .item .text .editor-content { max-width: 370px; } .wrap-solutions .item .text .editor-content p { color: #222; } @media (min-width: 1200px) { .wrap-solutions .item:hover .img-box img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .wrap-solutions .item:hover .text .line { opacity: 1; } } .wrap-honor .title { padding-right: 140px; } @media (max-width: 767px) { .wrap-honor .title { padding-right: 0; } } .wrap-honor .title .editor-content { max-width: 1270px; } .wrap-honor .honor { margin-top: 40px; } @media (max-width: 1199px) { .wrap-honor .honor { margin-top: 30px; } } .wrap-honor .honor .slick-honor { margin: 0 -20px; } @media (max-width: 1199px) { .wrap-honor .honor .slick-honor { margin: 0 -10px; } } .wrap-honor .honor .slick-honor .slick-slide { padding: 0 20px; } @media (max-width: 1199px) { .wrap-honor .honor .slick-honor .slick-slide { padding: 0 10px; } } .wrap-honor .honor .item { padding: 30px; cursor: pointer; border: 1.12px solid #e6e6e6; border-radius: 30px; background: #fff; } @media (max-width: 1199px) { .wrap-honor .honor .item { padding: 20px; border-radius: 20px; } } @media (max-width: 767px) { .wrap-honor .honor .item { padding: 10px; border-radius: 10px; } } .wrap-honor .honor .item .img-box { padding-bottom: 141.53846154%; } .wrap-honor .honor .item .img-box img { -webkit-transition: all 1s; transition: all 1s; } .wrap-honor .honor .item .mask { line-height: 40px; display: inline-block; padding: 0 30px; -webkit-transition: all .2s; transition: all .2s; color: #666; border-radius: 33.596px; background: #ebebeb; } @media (max-width: 767px) { .wrap-honor .honor .item .mask { line-height: 30px; padding: 0 20px; } } .wrap-honor .honor .item .title-honor { font-size: 24px; font-weight: 600; line-height: 30px; display: -webkit-box; overflow: hidden; margin-top: 30px; -webkit-transition: all .2s; transition: all .2s; -webkit-box-orient: vertical; -webkit-line-clamp: 1; } @media (max-width: 1400px) { .wrap-honor .honor .item .title-honor { font-size: 20px; } } @media (max-width: 991px) { .wrap-honor .honor .item .title-honor { font-size: 18px; margin-top: 20px; } } @media (max-width: 767px) { .wrap-honor .honor .item .title-honor { font-size: 16px; margin-top: 10px; } } .wrap-honor .honor .item .pic { overflow: hidden; margin-top: 20px; -webkit-transition: all .2s; transition: all .2s; border: 6px solid #b7b7b7; border-radius: 10px; } @media (max-width: 767px) { .wrap-honor .honor .item .pic { margin-top: 10px; border-width: 3px; } } @media (min-width: 1200px) { .wrap-honor .honor .item:hover .img-box img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .wrap-honor .honor .item:hover .mask { color: #ff6310; } .wrap-honor .honor .item:hover .title-honor { color: #ff6310; } .wrap-honor .honor .item:hover .pic { border-color: #ff6310; } } .wrap-contact .contact .item { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; margin-top: 20px; padding: 20px; border-radius: 30px; background: #f7e9e2; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media (max-width: 1400px) { .wrap-contact .contact .item { padding: 10px; } } @media (max-width: 1199px) { .wrap-contact .contact .item { border-radius: 20px; } } @media (max-width: 767px) { .wrap-contact .contact .item { border-radius: 10px; } } .wrap-contact .contact .item .pic { overflow: hidden; width: 160px; border-radius: 14px; } @media (max-width: 1199px) { .wrap-contact .contact .item .pic { width: 140px; } } .wrap-contact .contact .item .pic .img-box { padding-bottom: 145.45454545%; } .wrap-contact .contact .item .pic .img-box img { -webkit-transition: all 1s; transition: all 1s; } .wrap-contact .contact .item .text { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: column; width: -webkit-calc(100% - 160px); width: calc(100% - 160px); padding-left: 20px; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } @media (max-width: 1400px) { .wrap-contact .contact .item .text { padding-left: 10px; } } @media (max-width: 1199px) { .wrap-contact .contact .item .text { width: -webkit-calc(100% - 140px); width: calc(100% - 140px); } } .wrap-contact .contact .item .title-contact h3 { font-size: 24px; font-weight: bold; line-height: 30/24; } @media (max-width: 1400px) { .wrap-contact .contact .item .title-contact h3 { font-size: 20px; } } .wrap-contact .contact .item .title-contact span { font-size: 18px; font-weight: 500; line-height: 24px; display: block; } @media (max-width: 1400px) { .wrap-contact .contact .item .title-contact span { font-size: 16px; } } .wrap-contact .contact .item .txt { margin-top: 20px; } @media (max-width: 1400px) { .wrap-contact .contact .item .txt { margin-top: 10px; } } .wrap-contact .contact .item .txt b { font-size: 20px; font-weight: 600; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; color: #ff6310; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media (max-width: 1400px) { .wrap-contact .contact .item .txt b { font-size: 18px; } } .wrap-contact .contact .item .txt b .iconfont { margin-right: 6px; } .wrap-contact .contact .item .txt p { font-size: 18px; line-height: 24/18; margin: 0; letter-spacing: -.36px; } @media (max-width: 1400px) { .wrap-contact .contact .item .txt p { font-size: 16px; } } .wrap-contact .contact .item .txt p a { -webkit-transition: all .2s; transition: all .2s; } .wrap-contact .contact .item .txt p a:hover { text-decoration: underline; color: #ff6310; } .wrap-contact .message .pic { overflow: hidden; width: 45%; margin-top: 60px; border-radius: 10px; } @media (max-width: 991px) { .wrap-contact .message .pic { width: 100%; margin-top: 30px; } } .wrap-contact .message .message-right { width: 55%; margin-top: 60px; padding-left: 5%; } @media (max-width: 991px) { .wrap-contact .message .message-right { width: 100%; margin-top: 20px; padding-left: 0; } } .wrap-contact .message .message-right .title { padding-bottom: 40px; border-bottom: 1px solid #e5e5e5; } .wrap-contact .message .message-right .title h2 { background: none; } .wrap-contact .message .message-right .formbox { margin-top: 48px; } @media (max-width: 991px) { .wrap-contact .message .message-right .formbox { margin-top: 30px; } } .wrap-contact .message .message-right .formbox h4 { font-size: 24px; font-weight: 500; line-height: 32/24; letter-spacing: -.24px; } @media (max-width: 1199px) { .wrap-contact .message .message-right .formbox h4 { font-size: 20px; letter-spacing: 0; } } .common-product-item { display: block; } .common-product-item .pic { overflow: hidden; border-radius: 30px; } @media (max-width: 1199px) { .common-product-item .pic { border-radius: 20px; } } @media (max-width: 767px) { .common-product-item .pic { border-radius: 10px; } } .common-product-item .pic .img-box { padding-bottom: 105.74712644%; } .common-product-item .pic .img-box img { -webkit-transition: all 1s; transition: all 1s; } .common-product-item .title-products { font-size: 20px; line-height: 30px; display: -webkit-box; overflow: hidden; height: 60px; margin-top: 20px; -webkit-transition: all .2s; transition: all .2s; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } @media (max-width: 1400px) { .common-product-item .title-products { font-size: 18px; } } @media (max-width: 991px) { .common-product-item .title-products { font-size: 16px; line-height: 24px; height: 48px; margin-top: 10px; } } @media (max-width: 767px) { .common-product-item .title-products { font-size: 15px; height: auto; max-height: 48px; } } .common-product-item .common-more { margin-top: 30px; } @media (max-width: 1199px) { .common-product-item .common-more { margin-top: 20px; } } @media (max-width: 767px) { .common-product-item .common-more { margin-top: 10px; } } @media (max-width: 767px) { .common-product-item .common-more span { line-height: 30px; padding: 0 5px; } } @media (min-width: 1200px) { .common-product-item:hover .pic .img-box img { -webkit-transform: scale(1.1); -ms-transform: scale(1.1); transform: scale(1.1); } .common-product-item:hover .title-products { color: #ff6310; } .common-product-item:hover .common-more span { color: #fff; border-color: #ff6310; background-color: #ff6310; } } .wrap-product .product { margin-top: -50px; } @media (max-width: 1560px) { .wrap-product .product { margin-top: -30px; } } .wrap-product .product > ul { margin: 0 -25px; } @media (max-width: 1560px) { .wrap-product .product > ul { margin: 0 -15px; } } @media (max-width: 767px) { .wrap-product .product > ul { margin: 0 -6px; } } .wrap-product .product > ul > li { margin-top: 50px; padding: 0 25px; } @media (max-width: 1560px) { .wrap-product .product > ul > li { margin-top: 30px; padding: 0 15px; } } @media (max-width: 767px) { .wrap-product .product > ul > li { margin-top: 15px; padding: 0 6px; } } #productcontent { position: relative; top: -120px; } @media (max-width: 1199px) { #productcontent { top: 0; } } .wrap-product-show .product-show { padding-bottom: 80px; } @media (max-width: 1560px) { .wrap-product-show .product-show { padding-bottom: 60px; } } @media (max-width: 767px) { .wrap-product-show .product-show { padding-bottom: 40px; } } .wrap-product-show .carousel-wrap .carousel { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; overflow: hidden; padding-right: 1px; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-box-align: start; -webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start; } .wrap-product-show .carousel-wrap .item-video { position: relative; z-index: 3; } .wrap-product-show .carousel-wrap .item { overflow: hidden; border-radius: 30px; } @media (max-width: 1660px) { .wrap-product-show .carousel-wrap .item { border-radius: 20px; } } @media (max-width: 767px) { .wrap-product-show .carousel-wrap .item { border-radius: 10px; } } .wrap-product-show .carousel-wrap .slider-for { font-size: 0; position: relative; width: 79.5%; } @media (max-width: 767px) { .wrap-product-show .carousel-wrap .slider-for { width: 100%; } } .wrap-product-show .carousel-wrap .zoom { position: relative; cursor: crosshair; } .wrap-product-show .carousel-wrap iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; } .wrap-product-show .carousel-wrap .slick-arrow { left: 2%; } .wrap-product-show .carousel-wrap .slick-arrow.slick-next { right: 2%; left: auto; } .wrap-product-show .slider-nav { font-size: 0; width: -webkit-calc(20.5% - 18px); width: calc(20.5% - 18px); } @media (max-width: 767px) { .wrap-product-show .slider-nav { width: 100%; margin-top: 20px; } } .wrap-product-show .slider-nav .slick-list { margin: -9px 0; } @media (max-width: 767px) { .wrap-product-show .slider-nav .slick-list { margin: 0 -4px; } } .wrap-product-show .slider-nav .slick-slide { padding: 9px 0; } @media (max-width: 767px) { .wrap-product-show .slider-nav .slick-slide { padding: 0 4px; } } .wrap-product-show .slider-nav .item { position: relative; cursor: pointer; border-radius: 30px; } @media (max-width: 1660px) { .wrap-product-show .slider-nav .item { border-radius: 20px; } } @media (max-width: 767px) { .wrap-product-show .slider-nav .item { border-radius: 10px; } } .wrap-product-show .slider-nav .item-video { position: relative; background-color: #000; } .wrap-product-show .slider-nav .item-video .img-box { opacity: .6; } .wrap-product-show .slider-nav .item-video:after { font-family: 'iconfont' !important; font-size: 32px; line-height: 40px; position: absolute; z-index: 2; top: 50%; left: 50%; display: block; width: 40px; height: 40px; content: '\e726'; -webkit-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0); text-align: center; color: #ff6310; border-radius: 50%; background-color: #f6f7f8; } .wrap-product-show .slider-nav .slick-current .item { border: 1px solid #ff6310; } .wrap-product-show .info-box { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; flex-direction: column; min-height: 100%; padding-left: 5%; -webkit-box-orient: vertical; -webkit-box-direction: normal; -webkit-flex-direction: column; -ms-flex-direction: column; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; } @media (max-width: 1400px) { .wrap-product-show .info-box { padding: 0 0 0 3%; } } @media (max-width: 1199px) { .wrap-product-show .info-box { min-height: auto; margin-top: 30px; padding-left: 0; } } .wrap-product-show .info-box .title-info-box h2 { font-family: 'Fredoka'; font-size: 32px; font-weight: 600; line-height: 54/44; margin: 0; } @media (max-width: 1660px) { .wrap-product-show .info-box .title-info-box h2 { font-size: 28px; } } @media (max-width: 1400px) { .wrap-product-show .info-box .title-info-box h2 { font-size: 24px; } } @media (max-width: 991px) { .wrap-product-show .info-box .title-info-box h2 { font-size: 20px; } } .wrap-product-show .info-box .text { margin-top: 30px; } @media (max-width: 1560px) { .wrap-product-show .info-box .text { margin-top: 24px; } } @media (max-width: 767px) { .wrap-product-show .info-box .text { margin-top: 20px; } } .wrap-product-show .info-box .text h3 { font-size: 20px; font-weight: 600; line-height: 30/18; color: #ff6310; } .wrap-product-show .info-box .text p { color: #666; } @media (min-width: 1200px) { .wrap-product-show .info-box .text p { line-height: 24px; } } .wrap-product-show .info-box .text table { font-size: 18px; color: #666; } @media (max-width: 1660px) { .wrap-product-show .info-box .text table { font-size: 16px; } } .wrap-product-show .info-box .text table td { padding: 15px 0 !important; border: none; border-bottom: 1px solid #e1e1e1; } .wrap-product-show .info-box .text table td:nth-child(1) { font-weight: bold; color: #000; } .wrap-product-show .info-box .link-share { margin-top: 30px; } @media (max-width: 767px) { .wrap-product-show .info-box .link-share { margin-top: 20px; } } .wrap-product-show .info-box .share { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media (max-width: 767px) { .wrap-product-show .info-box .share { width: 100%; margin-top: 20px; } } .wrap-product-show .info-box .share p { font-size: 15px; margin: 0; margin-right: 10px; color: #3c313c; } .wrap-product-show .info-box .link { overflow: hidden; margin-right: 40px; } @media (max-width: 1560px) { .wrap-product-show .info-box .link { margin-right: 20px; } } .wrap-product-show .info-box .link a { line-height: 24px; display: block; display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: -webkit-fit-content; width: -moz-fit-content; width: fit-content; padding: 10px 50px; -webkit-transition: all .2s; transition: all .2s; color: #fff; border-radius: 60px; background-color: #ff6310; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media (max-width: 1660px) { .wrap-product-show .info-box .link a { padding: 10px 30px; } } .wrap-product-show .info-box .link a .iconfont { display: block; margin-left: 10px; -webkit-transition: all .4s; transition: all .4s; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); } .wrap-product-show .info-box .link a:hover { background: -webkit-gradient(linear, left top, left bottom, from(#ff6310), to(#ff6310)); background: -webkit-linear-gradient(top, #ff6310 0%, #ff6310 100%); background: linear-gradient(180deg, #ff6310 0%, #ff6310 100%); } .wrap-product-show .info-box .link a:hover .iconfont { -webkit-transform: rotate(0deg); -ms-transform: rotate(0deg); transform: rotate(0deg); } .wrap-product-show .stickybox { padding: 60px 0; } .wrap-product-show .wrap-show-menu { z-index: 9; border-top: 1px solid #e1e1e1; border-bottom: 1px solid #e1e1e1; background-color: #fff; } .wrap-product-show .wrap-show-menu.stuck-show-menu { top: 90px !important; } @media (max-width: 1199px) { .wrap-product-show .wrap-show-menu.stuck-show-menu { top: 60px !important; } } .wrap-product-show .wrap-show-menu ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; overflow-x: auto; overflow-y: hidden; margin: 0 -60px; white-space: nowrap; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; } @media (max-width: 1560px) { .wrap-product-show .wrap-show-menu ul { margin: 0 -30px; } } @media (max-width: 1199px) { .wrap-product-show .wrap-show-menu ul { margin: 0 -20px; } } .wrap-product-show .wrap-show-menu ul::-webkit-scrollbar { position: absolute; left: 0; height: 4px; } .wrap-product-show .wrap-show-menu ul::-webkit-scrollbar-track { background-color: #dcdcdc; } .wrap-product-show .wrap-show-menu ul::-webkit-scrollbar-thumb { background-color: #9f9f9f; } .wrap-product-show .wrap-show-menu ul li a { font-size: 18px; line-height: 30px; position: relative; display: block; padding: 15px 60px; cursor: pointer; -webkit-transition: all .2s; transition: all .2s; letter-spacing: -.36px; } @media (max-width: 1560px) { .wrap-product-show .wrap-show-menu ul li a { padding: 15px 30px; } } @media (max-width: 1199px) { .wrap-product-show .wrap-show-menu ul li a { padding: 10px 20px; } } @media (max-width: 767px) { .wrap-product-show .wrap-show-menu ul li a { font-size: 16px; } } .wrap-product-show .wrap-show-menu ul li.active a { color: #ff6310; } .wrap-product-show .title-product-show h3 { font-family: 'Fredoka'; font-size: 30px; font-weight: 600; line-height: 50/40; color: #ff6310; } @media (max-width: 1199px) { .wrap-product-show .title-product-show h3 { font-size: 28px; } } @media (max-width: 991px) { .wrap-product-show .title-product-show h3 { font-size: 26px; } } @media (max-width: 767px) { .wrap-product-show .title-product-show h3 { font-size: 24px; } } .wrap-product-show .title-product-show p { max-width: 80%; color: #666; } .wrap-product-show .parameter .editor-content { margin-top: 20px; } .wrap-product-show .parameter .editor-content h3 { font-size: 20px; font-weight: 600; line-height: 1.8; color: #000; } @media (max-width: 1199px) { .wrap-product-show .parameter .editor-content h3 { font-size: 18px; } } @media (max-width: 767px) { .wrap-product-show .parameter .editor-content h3 { font-size: 16px; } } .wrap-product-show .parameter .editor-content p { color: #666; } .wrap-product-show .inquiry .formbox form .group input, .wrap-product-show .inquiry .formbox form .group textarea { border: 1px solid #f5f5f5; background: #f5f5f5; } .wrap-product-show .inquiry .formbox form .group input::-webkit-input-placeholder, .wrap-product-show .inquiry .formbox form .group textarea::-webkit-input-placeholder { color: #6f6f6f; } .wrap-product-show .inquiry .formbox form .group input:-o-placeholder, .wrap-product-show .inquiry .formbox form .group textarea:-o-placeholder { color: #6f6f6f; } .wrap-product-show .inquiry .formbox form .group input::-moz-placeholder, .wrap-product-show .inquiry .formbox form .group textarea::-moz-placeholder { color: #6f6f6f; } .wrap-product-show .inquiry .formbox form .group input:-ms-input-placeholder, .wrap-product-show .inquiry .formbox form .group textarea:-ms-input-placeholder { color: #6f6f6f; } .wrap-product-show .inquiry .formbox form .group input:focus::-webkit-input-placeholder, .wrap-product-show .inquiry .formbox form .group textarea:focus::-webkit-input-placeholder { color: #c5c5c5; } .wrap-product-show .inquiry .formbox form .group input:focus::-o-placeholder, .wrap-product-show .inquiry .formbox form .group textarea:focus::-o-placeholder { color: #c5c5c5; } .wrap-product-show .inquiry .formbox form .group input:focus::-moz-placeholder, .wrap-product-show .inquiry .formbox form .group textarea:focus::-moz-placeholder { color: #c5c5c5; } .wrap-product-show .inquiry .formbox form .group input:focus::-ms-input-placeholder, .wrap-product-show .inquiry .formbox form .group textarea:focus::-ms-input-placeholder { color: #c5c5c5; } .wrap-product-show .inquiry .formbox form .submit-group { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-box-pack: end; -webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end; } .wrap-product-show .inquiry .formbox form .submit-group .submit { width: auto; padding: 0 30px; background: #ff6310; } .wrap-product-show .relate-product .slick-related { margin-top: 40px; } @media (max-width: 1199px) { .wrap-product-show .relate-product .slick-related { margin-top: 20px; } } .wrap-news .news { margin-top: -60px; } @media (max-width: 1199px) { .wrap-news .news { margin-top: -30px; } } .wrap-news .news > ul { margin: 0 -4vw; } .wrap-news .news > ul > li { margin-top: 60px; padding: 0 4vw; } @media (max-width: 1199px) { .wrap-news .news > ul > li { margin-top: 30px; } } .wrap-details .title-details { padding-bottom: 30px; border-bottom: 1px solid #eee; } .wrap-details .title-details h2 { font-family: 'Fredoka'; font-size: 36px; font-weight: 600; line-height: 1.2; margin: 10px 0 0 0; } @media (max-width: 1560px) { .wrap-details .title-details h2 { font-size: 30px; } } @media (max-width: 1470px) { .wrap-details .title-details h2 { font-size: 28px; } } @media (max-width: 1199px) { .wrap-details .title-details h2 { font-size: 24px; } } @media (max-width: 991px) { .wrap-details .title-details h2 { font-size: 22px; } } .wrap-details .title-details .date { width: 70px; } @media (max-width: 1199px) { .wrap-details .title-details .date { width: 60px; } } @media (max-width: 767px) { .wrap-details .title-details .date { width: 50px; } } .wrap-details .title-details .date b { font-size: 56px; font-weight: 500; line-height: 1.2; display: block; border-bottom: 1px solid #cfd4ef; } @media (max-width: 1560px) { .wrap-details .title-details .date b { font-size: 50px; } } @media (max-width: 1470px) { .wrap-details .title-details .date b { font-size: 44px; } } @media (max-width: 1400px) { .wrap-details .title-details .date b { font-size: 40px; } } @media (max-width: 1199px) { .wrap-details .title-details .date b { font-size: 36px; } } @media (max-width: 991px) { .wrap-details .title-details .date b { font-size: 30px; } } @media (max-width: 767px) { .wrap-details .title-details .date b { font-size: 24px; } } .wrap-details .title-details .date span { font-size: 22px; font-weight: 500; line-height: 30/22; display: block; margin-top: 8px; } @media (max-width: 1560px) { .wrap-details .title-details .date span { font-size: 20px; } } @media (max-width: 1199px) { .wrap-details .title-details .date span { font-size: 18px; } } @media (max-width: 991px) { .wrap-details .title-details .date span { font-size: 16px; } } .wrap-details .details .text { margin-top: 30px; } .wrap-details .details .text h3 { font-size: 22px; font-weight: bold; line-height: 30/22; } @media (max-width: 1199px) { .wrap-details .details .text h3 { font-size: 20px; } } @media (max-width: 767px) { .wrap-details .details .text h3 { font-size: 18px; } } .wrap-details .details .text p { line-height: 28px; } .wrap-details .share { margin-top: 80px; } @media (max-width: 1560px) { .wrap-details .share { margin-top: 60px; } } @media (max-width: 1199px) { .wrap-details .share { margin-top: 30px; } } .wrap-details .share p { font-size: 18px; font-weight: bold; margin: 0; } .wrap-details .share p, .wrap-details .share .a2a_kit { display: inline-block; vertical-align: middle; } .wrap-details .relate-details { margin-top: 20px; } .wrap-details .relate-details a { font-size: 18px; font-weight: 500; line-height: 32px; position: relative; display: inline-block; margin-top: 16px; padding-left: 76px; } @media (max-width: 1199px) { .wrap-details .relate-details a { font-size: 16px; line-height: 28px; } } @media (max-width: 767px) { .wrap-details .relate-details a { font-size: 14px; line-height: 24px; } } .wrap-details .relate-details a:before { font-family: 'iconfont' !important; font-size: 14px; line-height: 32px; position: absolute; top: 0; left: 0; display: block; width: 52px; height: 32px; content: '\e9b6'; -webkit-transition: all .2s; transition: all .2s; text-align: center; border: 1px solid #d4d8dd; border-radius: 99px; background: #f6f7f8; } @media (max-width: 1199px) { .wrap-details .relate-details a:before { line-height: 28px; height: 28px; } } .wrap-details .relate-details a.prev:before { -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .wrap-details .relate-details a:hover:before { color: #fff; background-color: #ff6310; } .wrap-service .service > ul > li { padding: 40px 0; -webkit-transition: all .2s; transition: all .2s; border-bottom: 1px solid #c1c7d0; } .wrap-service .service > ul > li:hover { background: #f7e9e2; } .wrap-service .service > ul > li:hover .item .more { color: #fff; background-color: #ff6310; } .wrap-service .service .item { padding: 0 5%; } @media (max-width: 991px) { .wrap-service .service .item { padding: 0; } } .wrap-service .service .item .num { font-family: 'Fredoka'; font-size: 24px; font-weight: 500; line-height: 40px; width: 150px; color: #666; -webkit-flex-shrink: 0; -ms-flex-negative: 0; flex-shrink: 0; } @media (max-width: 1199px) { .wrap-service .service .item .num { width: 100px; } } @media (max-width: 991px) { .wrap-service .service .item .num { width: 30px; } } @media (max-width: 767px) { .wrap-service .service .item .num { width: 100%; } } .wrap-service .service .item .note { width: -webkit-calc(100% - 550px); width: calc(100% - 550px); padding-right: 10%; padding-left: 40px; } @media (max-width: 1560px) { .wrap-service .service .item .note { padding: 0 5% 0 20px; } } @media (max-width: 1400px) { .wrap-service .service .item .note { width: -webkit-calc(100% - 450px); width: calc(100% - 450px); } } @media (max-width: 1199px) { .wrap-service .service .item .note { width: -webkit-calc(100% - 400px); width: calc(100% - 400px); } } @media (max-width: 991px) { .wrap-service .service .item .note { width: -webkit-calc(100% - 330px); width: calc(100% - 330px); } } @media (max-width: 767px) { .wrap-service .service .item .note { width: 100%; padding: 10px 0; } } .wrap-service .service .item .title-process { font-family: 'Fredoka'; font-size: 36px; font-weight: 500; line-height: 40/36; } @media (max-width: 1400px) { .wrap-service .service .item .title-process { font-size: 30px; } } @media (max-width: 1199px) { .wrap-service .service .item .title-process { font-size: 24px; } } .wrap-service .service .item .editor-content { display: -webkit-box; overflow: hidden; max-height: 56px; margin-top: 18px; -webkit-box-orient: vertical; -webkit-line-clamp: 2; } @media (max-width: 1400px) { .wrap-service .service .item .editor-content { margin-top: 10px; } } @media (max-width: 767px) { .wrap-service .service .item .editor-content { max-height: 48px; } } .wrap-service .service .item .more { line-height: 60px; display: block; width: 60px; height: 60px; margin-top: 20px; -webkit-transform: rotate(-45deg); -ms-transform: rotate(-45deg); transform: rotate(-45deg); text-align: center; color: #ff6310; border-radius: 50%; background-color: #000; } @media (max-width: 1400px) { .wrap-service .service .item .more { margin-top: 10px; } } @media (max-width: 1199px) { .wrap-service .service .item .more { line-height: 50px; width: 50px; height: 50px; } } @media (max-width: 767px) { .wrap-service .service .item .more { line-height: 40px; width: 40px; height: 40px; } } .wrap-service .service .item .pic { overflow: hidden; width: 400px; height: 100%; border-radius: 30px; } @media (max-width: 1400px) { .wrap-service .service .item .pic { width: 300px; } } @media (max-width: 1199px) { .wrap-service .service .item .pic { border-radius: 20px; } } @media (max-width: 767px) { .wrap-service .service .item .pic { border-radius: 10px; } } @media (max-width: 767px) { .wrap-service .service .item .pic { width: 100%; } } .wrap-service .service .item .pic .img-box { padding-bottom: 75%; } .wrap-service .service .item .pic .img-box img { object-fit: cover; } .wrap-sitemap .sitemap .title h2 { margin: 0; } .wrap-sitemap .sitemap > ul > li { position: relative; width: 100%; margin-top: 30px; } @media (max-width: 767px) { .wrap-sitemap .sitemap > ul > li { min-height: 38px; margin-top: 20px; padding-left: 0; } } .wrap-sitemap .sitemap > ul > li > a { font-size: 18px; font-weight: bold; line-height: 28px; display: inline-block; min-width: 240px; padding: 10px 30px; -webkit-transition: all .2s; transition: all .2s; text-transform: uppercase; border: 1px solid #dcdcdc; border-radius: 10px; } @media (max-width: 767px) { .wrap-sitemap .sitemap > ul > li > a { font-size: 16px; min-width: 140px; padding: 4px 10px; } } .wrap-sitemap .sitemap > ul > li:hover > a { color: #fff; border-color: #ff6310; background-color: #ff6310; } .wrap-sitemap .sitemap > ul > li:hover > a { text-decoration: underline; border-color: #ff6310; background-color: #ff6310; } .wrap-sitemap .sitemap > ul > li > ul { font-size: 0; margin: 0 -15px; margin-top: 20px; } @media (max-width: 767px) { .wrap-sitemap .sitemap > ul > li > ul { margin: 0 -5px; margin-top: 20px; } } .wrap-sitemap .sitemap > ul > li > ul > li { position: relative; list-style: none; } .wrap-sitemap .sitemap > ul > li > ul > li > a { font-size: 16px; line-height: 30px; position: relative; display: block; padding: 5px 20px; text-transform: capitalize; } .wrap-sitemap .sitemap > ul > li > ul > li > a img { -webkit-filter: brightness(1) invert(1); filter: brightness(1) invert(1); } .wrap-sitemap .sitemap > ul > li > ul > li > ul > li { display: inline-block; vertical-align: top; } .wrap-sitemap .sitemap > ul > li > ul > li > ul > li > a { font-size: 16px; display: block; padding: 5px 30px; color: #999; } .wrap-sitemap .sitemap > ul > li > ul > li > ul > li > a:before { content: '-'; } .wrap-sitemap .sitemap > ul > li > ul > li > ul > li:hover > a { color: #ff6310; } .wrap-sitemap .sitemap > ul > li > ul > li:hover > a { text-decoration: underline; color: #ff6310; } .wrap-sitemap .sitemap > ul > li > ul > li:hover > a:before { opacity: 1; } .wrap-sitemap .sitemap-vertical { margin-top: 50px; } @media (max-width: 991px) { .wrap-sitemap .sitemap-vertical { margin-top: 20px; } } .wrap-sitemap .sitemap-vertical > ul { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; width: 100%; margin: 0 -15px; -webkit-box-pack: justify; -webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; } @media (max-width: 1199px) { .wrap-sitemap .sitemap-vertical > ul { display: block; } } .wrap-sitemap .sitemap-vertical > ul > li { display: inline-block; margin-top: 10px; padding: 0 15px; vertical-align: top; } @media (max-width: 1199px) { .wrap-sitemap .sitemap-vertical > ul > li { display: block; } } .wrap-sitemap .sitemap-vertical > ul > li > a { font-size: 18px; font-weight: bold; line-height: 28px; display: inline-block; padding: 10px 20px; -webkit-transition: all .2s; transition: all .2s; text-transform: capitalize; } @media (max-width: 767px) { .wrap-sitemap .sitemap-vertical > ul > li > a { font-size: 16px; padding: 10px; } } .wrap-sitemap .sitemap-vertical > ul > li > ul { margin-top: 20px; } @media (max-width: 767px) { .wrap-sitemap .sitemap-vertical > ul > li > ul { margin-top: 0; } } .wrap-sitemap .sitemap-vertical > ul > li > ul > li { position: relative; list-style: none; vertical-align: top; } @media (max-width: 1199px) { .wrap-sitemap .sitemap-vertical > ul > li > ul > li { display: inline-block; vertical-align: top; } } .wrap-sitemap .sitemap-vertical > ul > li > ul > li > a { font-size: 16px; line-height: 30px; position: relative; display: block; padding: 5px 20px; text-transform: capitalize; color: #666; } @media (max-width: 767px) { .wrap-sitemap .sitemap-vertical > ul > li > ul > li > a { font-size: 15px; padding: 5px 10px; } } @media (max-width: 1199px) { .wrap-sitemap .sitemap-vertical > ul > li > ul > li > ul > li { display: inline-block; vertical-align: top; } } .wrap-sitemap .sitemap-vertical > ul > li > ul > li > ul > li > a { font-size: 14px; display: block; padding: 5px 30px; color: #999; } @media (max-width: 767px) { .wrap-sitemap .sitemap-vertical > ul > li > ul > li > ul > li > a { padding: 5px 15px; } } .wrap-sitemap .sitemap-vertical > ul > li > ul > li > ul > li > a:before { content: '-'; } .wrap-sitemap .sitemap-vertical > ul > li > ul > li > ul > li:hover > a { text-decoration: underline; color: #ff6310; } .wrap-sitemap .sitemap-vertical > ul > li > ul > li > ul > li:hover > a:before { opacity: 1; } .wrap-sitemap .sitemap-vertical > ul > li > ul > li:hover > a { text-decoration: underline; color: #ff6310; } .wrap-sitemap .sitemap-vertical > ul > li > ul > li:hover > a:before { opacity: 1; } .wrap-sitemap .sitemap-vertical > ul > li:hover > a { color: #ff6310; } .wrap-nosearch { margin: 30px 0; } .wrap-nosearch h3 { font-size: 18px; font-weight: bold; line-height: 1.4; margin: 0; } .wrap-nosearch p { line-height: 22px; margin: 10px 0 0 0; padding: 10px 20px; color: #666; border: 1px solid rgba(255, 99, 16, .5); border-radius: 5px; background-color: rgba(255, 99, 16, .1); } .wrap-nosearch .title-in { margin-top: 30px; } @media (min-width: 1200px) { .wrap-nosearch .title-in h2 { font-size: 30px; } } .pagination-info { margin-top: 80px; } @media (max-width: 1560px) { .pagination-info { margin-top: 60px; } } @media (max-width: 1199px) { .pagination-info { margin-top: 30px; } } .pagination { display: inline-block; padding: 7px 25px; border-radius: 50px; background-color: rgba(255, 99, 16, .05); } .pagination a, .pagination span:not(.ellipsis) { font-size: 14px; line-height: 35px; display: -webkit-inline-box; display: -webkit-inline-flex; display: -ms-inline-flexbox; display: inline-flex; overflow: hidden; width: 35px; height: 35px; margin: 0 4px; cursor: pointer; text-align: center; vertical-align: middle; border-radius: 50%; background: none; -webkit-box-align: center; -webkit-align-items: center; -ms-flex-align: center; align-items: center; -webkit-box-pack: center; -webkit-justify-content: center; -ms-flex-pack: center; justify-content: center; } @media (min-width: 1200px) { .pagination a, .pagination span:not(.ellipsis) { -webkit-transition: .2s; transition: .2s; } .pagination a:hover, .pagination span:not(.ellipsis):hover { color: #ff6310; } } @media (max-width: 1199.98px) { .pagination a, .pagination span:not(.ellipsis) { line-height: 30px; width: 30px; height: 30px; } .pagination a:active, .pagination span:not(.ellipsis):active { color: #ff6310; } } @media (max-width: 767.98px) { .pagination a, .pagination span:not(.ellipsis) { font-size: 14px; margin: 0 3px; } } .pagination span.current { color: #ff6310; } .pagination span.current.prev, .pagination span.current.next { display: none; } .pagination .next, .pagination .prev { background-color: rgba(255, 99, 16, .12); } .pagination .next:hover, .pagination .prev:hover { color: #fff; background-color: #ff6310; } .pagination .prev:before { font-family: 'iconfont' !important; content: '\e9b6'; -webkit-transform: rotate(180deg); -ms-transform: rotate(180deg); transform: rotate(180deg); } .pagination .next:before { font-family: 'iconfont' !important; content: '\e9b6'; } .editor-content p { font-size: 18px; line-height: 28px; margin: 0; color: #666; } @media (max-width: 1400px) { .editor-content p { font-size: 16px; } } @media (max-width: 767px) { .editor-content p { font-size: 14px; line-height: 24px; } } .editor-content h3 { font-size: 20px; font-weight: bold; line-height: 32/22; } @media (max-width: 1560px) { .editor-content h3 { font-size: 20px; } } @media (max-width: 991px) { .editor-content h3 { font-size: 18px; } } .editor-content img { max-width: 100% !important; height: auto !important; } .editor-content.lh24 p { line-height: 24px; } .editor-content.lh30 p { line-height: 30px; } @media (max-width: 767px) { .editor-content.lh30 p { line-height: 24px; } } .editor-content ul, .editor-content ol { padding-left: 1em; } .editor-content ul li, .editor-content ol li { list-style: inherit; } .editor-content .table-box { line-height: 26/16; overflow: auto; width: 100%; max-width: 100%; margin-top: 20px; } .editor-content .table-box table { font-size: 16px; line-height: 1.2; width: 100%; max-width: 100%; border-spacing: 0; border-collapse: collapse; background: #fff; } .editor-content .table-box table p { font-size: 16px; } .editor-content .table-box table tr, .editor-content .table-box table td, .editor-content .table-box table th { width: auto !important; height: auto !important; } .editor-content .table-box table td, .editor-content .table-box table th { font-weight: normal; padding: 15px 20px !important; border: 1px solid #e1e1e1; } @media (max-width: 480px) { .editor-content .table-box table td, .editor-content .table-box table th { padding: 8px !important; } } .editor-content .table-box table tr p, .editor-content .table-box table tr span { margin: 0 !important; padding: 0 !important; background: none !important; } .editor-content .table-box table th { text-align: center; } .auto-adjust-img.is-mobile img { max-width: 100% !important; height: auto !important; margin: 5px 0; } .auto-adjust-img p.contains-pictures { font-size: 0 !important; overflow-x: hidden; margin: 0 -10px !important; padding: 0; } @media (min-width: 768px) { .auto-adjust-img p.contains-pictures { white-space: nowrap; } } .auto-adjust-img p.contains-pictures > img { display: inline-block; margin: 5px 10px; }