@charset "utf-8";
:root {
  --main-color: #015ea2;  /*主要颜色*/
}
a:hover {color: var(--main-color);}

/*分页*/
.pagelist {margin:15px auto;}
.pagelist .aa, .pagelist .bb, .page_front, .page_back, .page_first, .page_last {font-size:12px; width:30px; height:30px; line-height:30px; overflow:hidden; display:block; text-align:center; margin:0 3px; border-radius:3px; box-sizing: border-box;}
.pagelist .aa {color:#fff;}
.pagelist .bb {background:#ffffff; color:#464646; border:1px solid #d2d2d2;}
.pagelist .aa:hover {color:#fff; text-decoration:none;}
.pagelist .bb:hover {color:#fff; text-decoration:none;}
.page_front, .page_back, .page_first, .page_last {width:55px; background:#ffffff; color:#464646; border:1px solid #d2d2d2;}
.page_first, .page_last {font-size:14px; width:32px;}
.pagelist .page_select {min-width:62px; height:30px; border-radius:3px; padding:0 10px 0 10px; border:1px solid #d2d2d2; box-sizing: border-box;}
.pagelist .page_front:hover, .pagelist .page_back:hover, .pagelist .page_first:hover, .pagelist .page_last:hover {color:#fff; text-decoration:none;}
.pagelist .aa, .pagelist .aa:hover, .pagelist .bb:hover, .pagelist .page_front:hover, .pagelist .page_back:hover, .pagelist .page_first:hover, .pagelist .page_last:hover {background-color:var(--main-color);}
.pagelist .aa, .pagelist .bb:hover, .pagelist .page_front:hover, .pagelist .page_back:hover, .pagelist .page_first:hover, .pagelist .page_last:hover {border:1px solid var(--main-color);}

.book_input {padding-bottom:10px;}
.book_input .h1 {font-size:14px; padding-bottom:3px;}
.book_input .h2 {position:relative;}
.book_input .h2 .fl {width:100px; position:absolute; top:0; left:0;}
.book_input .h2 .lr {margin-left:110px;}
.book_btn {padding-top:6px;}
.verify {width:100%; height:100%; position:fixed; top:0; left:0; z-index:-1; display:none;}
.verify.on {display:block; z-index:9999;}
.verify_bg {width:100%; height:100%; background:rgba(0,0,0,0.5); position:absolute; top:0; left:0; z-index:1;}
.verify_in {width:320px; height:190px; background:#fff; position:absolute; top:50%; margin-top:-95px; left:50%; margin-left:-160px; z-index:2;}
.verify_pad {padding:20px;}
.verify_tit {font-size:15px; font-weight:bold; padding-top:10px;}
.verify_div {position:relative; height:38px; margin-top:15px;}
.verify_div .ll {position:absolute; top:0; left:0;}
.verify_div .lr {margin-left:112px;}
.vbutton {width:100%; height:40px; background:var(--main-color); color:#fff; font-size:15px; padding:0 40px;}
.verify_close {width:20px; height:20px; background:#ccc; border:2px solid #fff; border-radius:50%; position:absolute; top:-6px; right:-6px; cursor:pointer;}
.verify_close:before, .verify_close:after {content:""; width:12px; height:2px; background:#fff; position:absolute; top:9px; left:4px;}
.verify_close:before {transform:rotate(45deg);}
.verify_close:after {transform:rotate(135deg);}
.verify_close:hover {background:#222;}
@media (max-width: 640px) {
	.book_btn .xbutton {width:100%;}
}

@font-face {
    font-family: 'Gadugi';
    src: url('font/Gadugi/Gadugi.eot');
    src: url('font/Gadugi/Gadugi.eot?#iefix') format('embedded-opentype'),
         url('font/Gadugi/Gadugi.woff2') format('woff2'),
         url('font/Gadugi/Gadugi.woff') format('woff'),
         url('font/Gadugi/Gadugi.ttf') format('truetype'),
         url('font/Gadugi/Gadugi.svg#Gadugi') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'GadugiBold';
    src: url('font/GadugiBold/Gadugi-Bold.eot');
    src: url('font/GadugiBold/Gadugi-Bold.eot?#iefix') format('embedded-opentype'),
         url('font/GadugiBold/Gadugi-Bold.woff2') format('woff2'),
         url('font/GadugiBold/Gadugi-Bold.woff') format('woff'),
         url('font/GadugiBold/Gadugi-Bold.ttf') format('truetype'),
         url('font/GadugiBold/Gadugi-Bold.svg#Gadugi-Bold') format('svg');
    font-weight: bold;
    font-style: normal;
    font-display: swap;
}

body, input, textarea, select, button, code, pre {font-family: "Gadugi", "Open Sans", "Arial", "PingFangSC-Light", "Microsoft Yahei", "SimSun", sans-serif;}
body::-webkit-scrollbar {width: 8px;}
body::-webkit-scrollbar-track {background-color: #f6f6f6; box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.2); border-radius:12px;}
body::-webkit-scrollbar-thumb {background-color: #7f7f7f; border-radius: 6px;}
.fb, strong {font-family: "GadugiBold";}

/*******************************************/

.hello {height: 40px; line-height: 40px; color: #969696; font-size: 15px; text-align: center;}
.hello a {text-decoration: underline;}
.logo {position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.logo img {height: 48px;}
.top_height {height: 96px;}
.top {background-color: #000; z-index: 100;}
.top_in {position: relative;}
.top.on {position: fixed; top: 0;}
.nav {position: absolute; top: 50%; right: 100px; transform: translateY(-50%); z-index: 100;}
.nav>ul>li {float: left; margin-left: 20px; position: relative;}
.nav>ul>li:first-child {margin-left: 0;}
.nav>ul>li>a {color: #fff; font-size: 18px; height: 96px; line-height: 96px; display: block; padding: 0 10px;}
.nav>ul>li>a:hover {color: rgba(255, 255, 255, 0.6);}
.navselect {position: absolute; top: 92px; background-color: #000; min-width: 160px; display: none;}
.navslide-a {white-space: nowrap;}
.navslide-a a {font-size: 15px; color: #fff; display: block; padding: 0 15px; height: 36px; line-height: 36px;}
.navslide-a a:hover {background-color: #fff; color: #000;}
.topicon {position: absolute; top: 50%; right: 0; transform: translateY(-50%); cursor: pointer;}
.topicon-i {color: #fff; font-size: 30px; margin-left: 20px;}

.menu_height {height: 70px;}
.menu-in {position: relative;}
.menu-ul>li {float: left; margin-right: 30px;}
.menu-ul>li>a {color: #000; font-size: 18px; height: 70px; line-height: 70px; display: block;}
.menu-ul>li>a:hover {color: var(--main-color);}
.menu-message {position: absolute; top: 50%; right: 0; transform: translateY(-50%);}
.menu-message a {color: #fff; background-color: #000; height: 38px; line-height: 38px; padding: 0 15px; font-size: 16px; color: #fff;}
.menu-message a:hover {color: #fff; background-color: var(--main-color);}
.menu-message i {font-size: 24px; padding-right: 5px;}

.navslide {width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; z-index: 105; display: none;}
.navslide.on {display: block;}
.navslide-bg {width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.5); z-index: 1; opacity: 0;}
.navslide-con {transform: translateX(110%); width: 30vw; height: 100vh; background-color: #000; position: absolute; top: 0; right: 0; z-index: 2;}
.navslide-dt {font-size: 24px; font-weight: bold; padding-bottom: 20px; color: #fff;}
.navslide-dt a {color: #fff;}
.navslide-search {width: 800px; max-width: 90%; background-color: #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); border-radius: 16px; padding: 56px 36px; opacity: 0; box-sizing: border-box;}
.navslide-search .h1 {font-size: 36px; padding-bottom: 10px;}
.navslide-search .xinput {font-size: 16px; height: 60px;}
.navslide-search .h2 {padding-top: 15px;}
.navslide-search .xbutton {height: 54px; font-size: 16px;}
.navslide-search-close {font-size: 32px; color: #222; position: absolute; top: 15px; right: 25px; cursor: pointer; padding: 5px;}
.navslide.on .navslide-con {animation: navslide 0.3s 1 linear forwards; animation-delay: 0.1s;}
.navslide.on .navslide-bg {animation: navslideBg 0.3s 1 linear forwards; animation-delay: 0.1s;}
.navslide.off .navslide-con {animation: navslideOff 0.3s 1 linear forwards; animation-delay: 0s;}
.navslide.off .navslide-bg {animation: navslideBgOff 0.3s 1 linear forwards; animation-delay: 0s;}
.navslide.on .navslide-search {animation: navslideBg 0.3s 1 linear forwards; animation-delay: 0.1s;}
.navslide.off .navslide-search {animation: navslideBgOff 0.3s 1 linear forwards; animation-delay: 0s;}
.navslide-dson {display: none;}
.navmore {position: absolute; top: 10px; right: 0; color: #fff; font-size: 20px; width: 32px; height: 32px; cursor: pointer; z-index: 2;}
@keyframes navslide {
    0% {transform: translateX(110%);}
    100% {transform: translateX(0%);}
}
@keyframes navslideBg {
    0% {opacity: 0;}
    100% {opacity: 1;}
}
@keyframes navslideOff {
    0% {transform: translateX(0%);}
    100% {transform: translateX(110%);}
}
@keyframes navslideBgOff {
    0% {opacity: 1;}
    100% {opacity: 0;}
}
.navslide-close {color: #fff; cursor: pointer; padding: 8px; font-size: 40px; position: absolute; top: 32px; right: 32px;}
.navslide-close i {display: block;}
.navslide-ul {width: calc(100% - 64px); height: calc(100% - 140px); position: absolute; left: 32px; bottom: 40px; overflow-y: auto; overflow-x: hidden;}
.navslide-ul::-webkit-scrollbar {width: 8px;}
.navslide-ul::-webkit-scrollbar-track {background-color: #f6f6f6; box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.2); border-radius:12px;}
.navslide-ul::-webkit-scrollbar-thumb {background-color: #7f7f7f; border-radius: 6px;}
.navslide-li {margin-bottom: 10px; position: relative;}
.navslide-li a {font-size: 18px; color: #fff; height: 52px; line-height: 52px; border-radius: 8px; overflow: hidden; display: block; padding: 0 14px;}
.navslide-li a:hover {background-color: #323232; color: #fff;}
.navslide-lan {font-size: 16px; color: #fff; position: absolute; top: 30px; left: 40px;}
.navslide-lan span {color: rgba(255, 255, 255, 0.5);}
.navslide-lan a {color: #fff;}
.navslide-lan a:hover {color: #fff; text-decoration: underline;}
.navslide-lan img {height: 22px; padding-right: 5px;}
.navslide-dsona {margin-bottom: 8px;}
.navslide-dsona a {font-size: 16px; height: 32px; line-height: 32px; padding: 0 28px;}

.iproducts {background-color: #f7f9f9;}
.iproducts-tit {font-size: 46px; font-weight: bold; text-align: center; padding-bottom: 20px;}
.iproducts-cate {border-top: 2px solid #e4e4e4; padding: 30px 80px;}
.iproducts-cli {text-align: center;}
.iproducts-cli .pic img {height: 90px; mix-blend-mode: multiply;}
.iproducts-cli .tit {color: #454646; font-size: 15px;}
.iproducts-cli:hover .tit {color: var(--main-color);}

.technology-fl {width: calc(50% - 50px); float: left;}
.technology-fr {width: calc(50% - 50px); float: right;}
.technology-tit {padding-bottom: 26px; margin-bottom: 30px; position: relative;}
.technology-tit:after {content: ""; display: block; width: 122px; height: 7px; background-color: #000; position: absolute; bottom: 0; left: 0;}
.technology-tit .h1 {font-size: 60px;}
.technology-tit .h2 {font-size: 40px;}
.technology-p2 {padding-bottom: 46px;}
.technology-p:hover {transform: scale(1.04);}

.footer {background-color: #1a1a1a; padding: 80px 0 40px; position: relative; z-index: 10;}
.footer-letter {width: 460px; color: #fff; margin-right: 80px;}
.footer-letter .h1 {font-size: 38px; font-weight: bold;}
.footer-letter .h2 {font-size: 22px; color: #a2a2a2; padding: 20px 0;}
.footer-letter .h3 {position: relative;}
#f-email {width: 100%; box-sizing: border-box; height: 54px; background: transparent; border: 0; padding: 0 15px; font-size: 16px; border: 2px solid #2d2d2d; border-radius: 6px; -webkit-transition: 0.2s ease-in; transition: 0.2s ease-in; color: #fff;}
#f-email:focus {border-color: rgba(255, 255, 255, 0.6);}
.f-button {width: 28px; height: 28px; background-color: #313131; border-radius: 50%; position: absolute; top: 50%; right: 20px; border: 0; color: #fff; font-size: 16px; transform: translateY(-50%);}
.bpart-top {color: #fff; font-size: 22px; font-weight: bold; padding-bottom: 20px;}
.bpart-top a {color: #fff;}
.bpart-top a:hover {color: var(--main-color);}
.bpart ul li {padding-bottom: 8px;}
.bpart ul li a, .bpart-con {color: #a2a2a2; font-size: 16px; font-weight: bold; line-height: 24px;}
.bpart ul li a:hover {color: var(--main-color);}
.bpart-con {font-weight: normal; width: 346px; line-height: 32px;}
.copyright {color: #a2a2a2; font-size: 17px; padding: 60px 0 0;}
.copyright a {color: #a2a2a2;}

.block {padding: 80px 0;}
.block-t {padding-top: 80px;}
.block-b {padding-bottom: 80px;}
.banner-in {height: 360px; background-color: #ddd; background-size: cover; background-repeat: no-repeat; background-position: center center;}

.aboutus-title {text-align: center; background: url("../images/line.png") no-repeat center bottom; padding-bottom: 30px; margin-bottom: 56px;}
.aboutus-title .h1 {font-size: 17px; color: #696969;}
.aboutus-title .h2 {font-size: 57px;}
.aboutus-profile {position: relative;}
.aboutus-profile .fl, .aboutus-profile .fr {width: calc(50% - 20px);}
.aboutus-profile .fr {height: 100%; position: absolute; top: 0; right: 0; float: none; background-color: #ddd; background-repeat: no-repeat; background-size: cover; background-position: center center;}

.news-tit {font-size: 28px; padding-bottom: 20px;}
.news-mes {font-size: 16px; border-bottom: 1px solid #ddd; padding: 15px 0; margin-bottom: 20px;}
.news-img {text-align: center; padding-bottom: 10px;}
.news-img img {max-width: 100%;}
.news-con {font-size: 18px; line-height: 34px;}
.news-con img {max-width: 100%;}
.news-con a {color: var(--main-color);}

.maintitle {margin-bottom: 0;}
.maintitle .h1 {font-size: 40px; font-weight: bold; position: relative;}
.maintitle.center {text-align: center;}
.maintitle.white {color: #fff;}
.maintitle.bline .h1 {padding-bottom: 20px; margin-bottom: 20px;}
.maintitle.bline .h1:after {content: ""; display: block; width: 80px; height: 5px; position: absolute; bottom: 0; left: 0; background-color: #000;}
.maintitle .h2 {text-align: center; padding-top: 6px; font-size: 16px;}
.maintitle .line {background-color: var(--main-color); width: 44px; height: 3px; margin-top: 20px;}
.maintitle.center .line {margin: 20px auto 0;}

.soncate {text-align: center; padding-top: 15px;}
.soncate a {font-size: 16px; border-radius: 19px; height: 38px; line-height: 38px; border: 2px solid #000; display: inline-block; padding: 0 24px; margin: 0 10px;}
.soncate a.on, .soncate a:hover {background-color: #222; color: #fff;}

.gad {text-align: center; color: #fff; background: url("../images/gad.jpg") no-repeat center center; background-size: cover; padding: 80px 0;}
.gad .h1 {font-size: 46px;}
.gad .h2 {font-size: 24px; padding: 10px 0;}
.gad .h3 {padding-top: 25px;}
.gad .h3 a {display: inline-block; border: 3px solid #ddd; padding: 0 30px; height: 44px; line-height: 44px; font-size: 19px; background-color: transparent; border-radius: 25px; color: #fff;}

.iaboutus {position: relative;}
.iaboutus-fl {width: calc(48% - 25px); float: left; background: url("../images/iaboutus-bg1.png") repeat-y top left; padding: 25px 0 115px; position: relative; z-index: 2;}
.iaboutus-fr {width: calc(52% - 25px); float: right; position: relative; z-index: 2;}
.iaboutus-album {position: relative;}
.iaboutus-ctrls {width: 132px; height: 62px; background-color: #fff; position: absolute; bottom: 0; right: 0; z-index: 2;}
.iaboutus-ctrl {font-size: 26px; width: 50%; height: 62px; position: absolute; top: 0; outline: none; cursor: pointer;}
.iaboutus-ctrl:hover {background-color: var(--main-color); color: #fff;}
.iaboutus-ctrl-l {left: 0;}
.iaboutus-ctrl-r {right: 0;}
.iaboutus-thumbs {--gap-col: 20px;}
.iaboutus-thumb {overflow: hidden;}
.iaboutus-thumb:hover img {transform: scale(1.08);}
.iaboutus-tit {background: url("../images/iaboutus-bg3.png") no-repeat left center; padding-left: 21px; height: 140px; margin-bottom: 20px;}
.iaboutus-tit-in {height: 70px; position: relative; padding-left: 30px;}
.iaboutus-tit .h1 {font-size: 32px; font-weight: bold; text-transform: uppercase;}
.iaboutus-tit .h2 {font-size: 18px; color: #999; padding-top: 4px;}
.iaboutus-tit-in:after {content: ""; display: block; width: 2px; height: 100%; background-color: #000; position: absolute; top: 0; left: 0;}
.iaboutus-bg {background: url("../images/iaboutus-bg2.png") repeat left center; width: 56vw; position: absolute; top: 50%; left: 47%; z-index: 1; transform: translateY(-50%); height: 218px;}
.iaboutus-con {font-size: 18px; line-height: 28px; padding: 20px 20px 0; background-color: #fff;}

.atitle {position: relative;}
.atitle .h1 {font-size: 16px; color: #8a8a8a; text-transform: uppercase; position: relative; padding-left: 56px; height: 20px; line-height: 20px; margin-bottom: 10px;}
.atitle .h1:after {content: ""; display: block; width: 42px; height: 4px; background-color: var(--main-color); position: absolute; top: 50%; left: 0;}
.atitle .h2 {font-size: 40px; font-weight: bold;}
.atitle-more {position: absolute; right: 0; top: 42px;}
.atitle-more a {height: 42px; line-height: 42px; font-size: 15px; padding: 0 30px; background-color: var(--main-color); color: #fff; display: block; border-radius: 21px;}
.atitle-more a:hover {background-color: #222; color: #fff;}
.red {color: red;}

.strength {background-color: #1a1a1a; padding: 80px 0; position: relative;}
.strength-bg {width: 50vw; height: 100%; position: absolute; top: 0; right: 0; background-color: #000; background-repeat: no-repeat; background-position: center center; background-size: cover; z-index: 1;}
.strength-in {position: relative; z-index: 2;}
.numdata, .vision {width: 50%; float: left;}
.numdata-pad {padding-right: 30px;}
.numdata-li {color: #fff;}
.numdata-li .fl {width: 70px; height: 70px; border-right: 1px solid #fff; font-size: 50px;}
.numdata-li .fr {width: calc(100% - 70px - 20px);}
.numdata-li .fr .h1 .span1 {font-size: 42px;}
.numdata-li .fr .h1 .span2 {font-size: 13px; display: inline-block;}
.numdata-li .fr .h1 .span3 {font-size: 16px;}
.numdata-li .fr .h2 {font-size: 16px; white-space: nowrap;}
.numdata-con {--gap-row: 30px;}
.vision {background-size: 0 0;}
.vision-pad {padding-left: 30px;}
.strength-con {font-size: 18px; font-weight: bold; line-height: 35px; color: #fff; padding-bottom: 30px;}

.history-fl {width: calc(100% - 360px - 60px); float: left;}
.history-fr {width: 360px; background-color: #1a1a1a; float: right;}
.history-fr-pad {}
.history-year {background-color: var(--main-color); width: 126px; height: 126px; background-color: var(--main-color); border-radius: 50%; position: relative; color: #fff; font-weight: bold; font-size: 28px;}
.history-year:after {content: ""; display: block; width: 120px; height: 120px; background-color: transparent; border: 3px solid #fff; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); box-sizing: border-box; border-radius: 50%;}
.history-year-line {content: ""; display: block; width: 132px; height: 3px; background-color: var(--main-color); position: absolute; top: 50%; right: 0;}
.history-li {padding: 40px 0;}
.history-li .fl {width: 256px; position: relative;}
.history-text {position: relative; padding-right: 40px; padding-left: 76px;}
.history-text .h1 {font-size: 20px; font-weight: bold; padding-bottom: 10px;}
.history-text .h2 {font-size: 16px; line-height: 26px;}
.history-text .poi {width: 36px; height: 36px; background: url("../images/poi.png") no-repeat; position: absolute; top: 50%; left: 0; transform: translateY(-50%);}
.history-ul {height: 618px; overflow-x: hidden; overflow-y: auto; background: url("../images/line2.png") repeat-y 312px top;}
.history-ul::-webkit-scrollbar {width: 10px;}
.history-ul::-webkit-scrollbar-track {background-color: #e5e5e5; box-shadow: inset 0 0 8px rgba(0, 0, 0, 0.2); border-radius: 6px;}
.history-ul::-webkit-scrollbar-thumb {background-color: var(--main-color); border-radius: 6px;}
.history-li .fr {min-height: 126px; width: calc(100% - 256px - 40px);}
.history-div {font-size: 18px; color: #fff; padding-bottom: 34px;}
.history-input {width: 100%; height: 32px; border-width: 0 0 1px 0; border-color: #fff; background-color: transparent; color: #fff; font-size: 16px;}
.history-input2 {height: 160px;}
.history-button {background-color: var(--main-color); color: #fff; border: 2px solid var(--main-color); height: 50px; padding: 0 38px; font-size: 16px;}
.history-button:hover {background-color: #fff; color: var(--main-color);}

.ceoletter {background-color: #f2f2f2; padding: 60px 0;}
.ceoletter-pad {padding: 0 60px;}
.ceoletter-f1 {width: 330px; float: left; margin-right: 30px;}
.ceoletter-f2 {min-height: 92px; border-left: 2px solid var(--main-color); padding-left: 54px; padding-right: 90px; font-size: 16px; line-height: 20px; color: #565656; background: url("../images/yin.png") no-repeat 18px 0;}
.ceoletter-f3 {width: 228px; font-size: 18px; padding-top: 10px; text-align: right;}
.ceoletter-f3 .span1 {font-weight: bold;}
.ceoletter-f3 img {max-width: 100%;}

.certificate-con {margin: 0 80px; background: url("../images/table.png") no-repeat bottom center; padding-top: 50px; padding-bottom: 100px; background-size: 100% auto; position: relative;}

.gallery {background-color: #f2f2f2; padding: 60px 0;}
.gallery-con {padding: 30px 0;}
.gallery-part {overflow: hidden;}
.gallery-part:hover img {transform: scale(1.06);}

.position {background-color: #ededed; padding: 16px 0; font-size: 16px;}

.propage {padding: 30px 0;}
.pcatename {padding: 20px 0; font-size: 40px; border-bottom: 1px solid #000; text-transform: uppercase; position: relative;}
.pcatename-menu {font-size: 24px; position: absolute; top: 20px; right: 0; cursor: pointer;}
.proleft {width: 260px; float: left;}
.proul-top {font-size: 22px; font-weight: bold; padding-bottom: 15px;}
.proul-li {font-size: 18px; line-height: 22px; margin-bottom: 15px; position: relative; padding-left: 16px; font-weight: bold;}
.proul-li-son {padding-left: 30px; font-weight: normal;}
.proul-li.on:after {content: ""; display: block; width: 8px; height: 8px; background-color: #000; position: absolute; top: 8px; left: 0; border-radius: 50%;}
.proul-li-son:after {transform: scale(0.7) translateX(20px);}
.proul-dl {display: none;}
.proright {width: calc(100% - 260px - 50px); float: right;}
.msglist {--gap-col: 36px; --gap-row: 46px;}
.pro-part {border: 1px solid #d7d7d7; background-color: #fff; border-radius: 10px; overflow: hidden; box-shadow: 0 0 10px rgba(127, 127, 127, 0.1);}
.pro-part .pic {overflow: hidden;}
.pro-part .text {padding: 15px 15px 35px 15px;}
.pro-part .h1 {font-weight: bold; font-size: 20px; line-height: 22px; height: 44px;}
.pro-part .tag {padding: 30px 0 40px;}
.pro-part .tag span {display: inline-block; background-color: #f7f7f7; border-radius: 8px; padding: 0 10px; font-size: 12px; margin-right: 10px; height: 26px; line-height: 26px;}
.pro-part .tag span:last-child {margin-right: 0;}
.pro-part .more a {display: inline-block; width: 100%; background-color: #000; color: #fff; font-size: 15px; text-align: center; height: 38px; line-height: 38px; border-radius: 10px; overflow: hidden; cursor: pointer;}
.pro-part .more a:hover {background-color: var(--main-color);}
.pro-part .more a i {font-size: 22px; display: inline-block; transform: translateY(2px); padding-right: 5px;}
.pro-part:hover .pic img {transform: scale(1.06);}

.proinfo {position: relative;}
.proimage {width: 700px; float: left; position: relative; background-color: #fff}
.proimage.on {position: fixed; top: 96px;}
.proimage-fl {width: 130px; height: 100%; position: absolute; top: 0; left: 0;;}
.proimage-crtl {width: 100%; height: 24px; background-color: #f5f5f5; left: 0; position: absolute; font-size: 20px; cursor: pointer;}
.proimage-crtl-t {top: 0;}
.proimage-crtl-b {bottom: 0;}
.proimage-crtl:hover {background-color: var(--main-color); color: #fff;}
.proimage-crtl:hover i {color: #fff;}
.proimage-ul {width: 100%; min-height: 400px; position: absolute; top: 30px; overflow: hidden;}
.proimage-ul-in {position: absolute; top: 0; left: 0; width: 100%;}
.proimage-li {border: 1px solid #ddd; box-sizing: border-box; overflow: hidden; cursor: pointer; width: 100%; background-repeat: no-repeat; background-position: center center; background-size: contain; min-height: 100px;}
.proimage-li.on {border-color: var(--main-color);}
.proimage-fr {width: calc(100% - 130px - 18px); float: right;}
.proimage-fr-one {width: 100%;}
.proimage-fr img {border: 1px solid #ddd; box-sizing: border-box; width: 100%; height: auto;}
.protext {width: calc(100% - 700px - 50px); float: right;}
.protext-h1 {font-size: 44px; font-weight: bold;}
.protext-h2 {font-size: 33px; font-weight: normal;}
.protext-tt {background-color: #000; color: #fff; height: 38px; line-height: 38px; padding: 0 15px; font-size: 18px;}
.protext-cc {font-size: 16px; line-height: 30px; padding: 15px 0 30px; position: relative;}
.protext-cc p {position: relative; padding-left: 13px;}
.protext-cc p:after {content: ""; display: block; width: 3px; height: 3px; position: absolute; top: 14px; left: 0; background-color: #000;}
.protext-par {padding-top: 10px;}
.protext-td {font-size: 16px;}
.protext-table-max {width: 100%; overflow-x: auto; overflow-y: hidden;}
.protext-table {width: 100%;}
.protext-table tr:nth-child(even) {background-color: #ebebeb;}
.protext-table td {padding: 10px 15px;}
.related {background-color: #fff; position: relative; z-index: 2;}

.proicon {position: absolute; top: 12px; right: 12px;}
.proicon-li {border-radius: 8px; background-color: rgba(0, 0, 0, 0.8); color: #fff; font-size: 15px; height: 34px; padding: 0 16px; cursor: pointer; margin-left: 8px;}
.proicon-li:first-child {margin-left: 0;}
.proicon-li i {font-size: 24px; padding-right: 5px;}

.proshow {width: 100vw; height: 100vh; position: fixed; top: 0; left: 0; z-index: 1000; display: none;}
.proshow-bg {width: 100%; height: 100%; background-color: rgba(0, 0, 0, 0.6); position: absolute; top: 0; left: 0; z-index: 1;}
.proshow-in {width: 70%; height: 80%; background-color: #fff; border-radius: 18px; z-index: 2; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); position: relative;}
.proshow-img {width: 96%; height: 96%; text-align: center;}
#proshow-images {width: auto; max-width: 100%; height: 100%;}
.proshow-close {font-size: 44px; color: #222; position: absolute; top: 10px; right: 15px; cursor: pointer;}

.prorecipe {padding-top: 30px;}
.prorecipe a {display: inline-block; height: 42px; line-height: 42px; border-radius: 8px; color: #fff; padding: 0 30px; background-color: #000; font-size: 18px;}
.prorecipe i {font-size: 22px;}

.cerlist {--gap-col: 20px; --gap-row: 30px; padding-bottom: 30px;}
.cer-part {text-align: center;}
.cer-part .pic {border: 1px solid #ddd; box-sizing: border-box; overflow: hidden;}
.cer-part .h1 {font-weight: bold; font-size: 18px; line-height: 22px; height: 44px; margin-top: 10px;}
.cer-part:hover .pic img {transform: scale(1.06);}

.newslist-bor {border-top: 1px solid #d9d9d9;}
.news-part {border-bottom: 1px solid #d9d9d9; padding: 22px 0;}
.news-part .date {width: 100px; margin-right: 20px; font-size: 14px; color: #999;}
.news-part .text {font-size: 16px;}
.news-part .text a {padding: 6px 0; display: block;}
.viewmore {text-align: center; padding-top: 30px;}
.viewmore a {border: 1px solid #ccc; height: 52px; line-height: 52px; font-size: 18px; padding: 0 46px; display: inline-block; border-radius: 26px;}
.viewmore a:hover {background-color: #222; color: #fff;}

.recipe-con {padding: 40px 0; position: relative;}
.recipe-part-pad {padding-bottom: 28px;}
.recipe-part .text {width: calc(100% - 460px - 30px); float: left; padding-top: 40px;}
.recipe-part .text .h1 {font-size: 24px; font-weight: bold; padding-bottom: 15px;}
.recipe-part .text .h2 {font-size: 16px; line-height: 24px;}
.recipe-part .text .h3 {font-size: 16px; padding-top: 30px;}
.recipe-part .text .h3 a {display: inline-block; background-color: var(--main-color); color: #fff; height: 46px; line-height: 46px; padding: 0 20px; border-radius: 8px;}
.recipe-part .text .h3 i {font-size: 26px; padding-right: 8px;}
.recipe-part .text .h3 a:hover {background-color: #222; color: #fff;}
.recipe-part .text .h3 a:hover i {color: #fff;}
.recipe-part .pic {width: 460px; float: right;}

.contact_page {background: url("../images/contact_bg.jpg") no-repeat center top; background-size: 100% auto;}
.cont_infocon {position: relative; padding-top: 30px;}
.cont_inpart {display:inline-block; vertical-align:top; width: 50%; float: left;}
.cont_inpart .pic {float:left; width:76px; height:76px; border-radius:50%; border:2px solid #e4e4e4; text-align:center; position:relative; box-sizing:border-box; margin-right:20px;}
.cont_inpart .pic i {font-size: 36px; color: var(--main-color);}
.cont_inpart .words {float:left; padding-top:12px; width:calc(100% - 76px - 20px);}
.cont_inpart .words .h1 {font-size:24px; font-weight:bold; height:20px; line-height:20px; margin-bottom:10px;}
.cont_inpart .words .h2 {font-size:17px; line-height:22px; height:66px;}
.form {background-color:#fff; padding:50px; box-shadow:inset 0 0 10px rgba(0, 0, 0, 0.1);}
.form_tit {text-align:center; font-size:26px; font-weight:bold; padding-bottom:20px;}
.form_tit:after {content:""; display:block; width:48px; height:3px; background-color:var(--main-color); margin:10px auto 10px;}
.form_bot {height:80px;}
.form_div {padding-bottom:20px;}
.form_div .fl, .form_div .fr {width: calc(50% - 10px);}
.history-fr-pad .form_div .fl, .history-fr-pad .form_div .fr {width: auto; float: none;}
.history-fr-pad .form_div .fl {padding-bottom: 20px;}
.form_input, .form_text {width:100%; height:50px; padding:0 20px; box-sizing:border-box; box-shadow:inset 0 0 6px rgba(0, 0, 0, 0.1); font-size:15px; border:1px solid #d4d4d4; -webkit-transition:0.2s ease-in; transition:0.2s ease-in;}
.form_text {padding:15px 20px; height:150px;}
.form_input:focus, .form_text:focus {border-color:#7a9cd3; box-shadow:inset 0 1px 1px rgba(0,0,0,0.075), 0 0 8px rgba(122,156,211,0.6);}

@media (max-width: 1450px) {
    .logo img {height: 40px;}
    .nav>ul>li {margin-left: 5px;}
    .nav>ul>li>a {padding: 0 8px; font-size: 16px;}
    .menu-ul>li>a {font-size: 16px;}
    .top_height {height: 80px;}
    .proimage.on {top: 80px;}
    .footer-letter {width: 400px; margin-right: 40px;}
    .bpart ul li a, .bpart-con {font-size: 16px;}
    .msglist {--gap-col: 20px; --gap-row: 20px;}
    .block {padding: 60px 0;}
    .block-t {padding-top: 60px;}
    .block-b {padding-bottom: 60px;}
    .banner-in {height: 300px;}

    .proimage {width: 600px;}
    .protext {width: calc(100% - 600px - 50px);}
    .proimage-fl {width: 100px;}
    .proimage-fr {width: calc(100% - 100px - 18px);}

    .atitle .h1 {margin-bottom: 5px;}
    .aboutus-title .h2 {font-size: 40px;}
    .atitle .h2, .maintitle .h1 {font-size: 34px;}
}
@media (max-width: 1250px) {
    .nav>ul>li:nth-child(6), .nav>ul>li:nth-child(7), .nav>ul>li:nth-child(8) {display: none;}
    .gad {padding: 60px 0;}
    .gad .h1 {font-size: 38px;}
    .iaboutus-tit {margin-bottom: 0;}
    .iaboutus-tit-in {font-size: 25px;}
    .iaboutus-con {font-size: 16px; line-height: 25px; padding-top: 70px;}
    .bpart:nth-child(1), .bpart:nth-child(2) {display: none;}
    .footer-letter {margin-right: 100px;}
    .footer-letter .h1 {font-size: 30px;}

    .proleft {width: 220px;}
    .proright {width: calc(100% - 220px - 20px);}
    .pro-part .tag {padding: 10px 0 20px;}
    .pro-part .text {padding: 10px 10px 20px 10px;}
    .proimage {width: 520px;}
    .protext {width: calc(100% - 520px - 30px);}
    .protext-h1 {font-size: 34px;}

    .aboutus-title .h2 {font-size: 38px;}
    .atitle .h2, .maintitle .h1 {font-size: 30px;}
    .history-li {padding: 20px 0;}
    .history-li .fl {width: 166px;}
    .history-li .fr {width: calc(100% - 166px - 20px);}
    .history-year-line {width: 42px;}
    .history-ul {background-position: 203px top;}
    .history-text {padding-left: 40px;}
    .ceoletter-pad {padding: 0;}
    .ceoletter-f1 {width: 270px;}
    .ceoletter-f2 {padding-right: 10px;}
    .ceoletter-f3 {width: 200px;}

    .cont_inpart:nth-child(1), .cont_inpart:nth-child(2) {width: 50%;}
    .cont_inpart:nth-child(3) {width: auto;}
}
@media (max-width: 820px) {
    .logo {left: 15px;}
    .logo img {height: 36px;}
    .top_height {height: 68px;}
    .topicon {right: 15px;}
    .topicon-i {font-size: 26px;}
    .navslide-con {width: 74vw;}
    .navslide-close {font-size: 30px; top: 20px; right: 20px;}
    .navslide-search {padding: 36px 26px;}
    .navslide-search .h1 {font-size: 26px;}
    .navslide-search .xinput {height: 50px;}
    .block {padding: 30px 0;}
    .block-t {padding-top: 30px;}
    .block-b {padding-bottom: 30px;}
    .iproducts-tit {font-size: 28px;}
    .gad {padding: 25px 0;}
    .gad .h1 {font-size: 22px;}
    .gad .h2 {font-size: 16px;}
    .gad .h3 {padding-top: 5px;}
    .gad .h3 a {font-size: 15px; height: 30px; line-height: 30px;}
    .footer {padding: 30px 0 20px;}
    .footer-letter {margin-right: 0;}
    .footer-letter .h1 {font-size: 26px;}
    .footer-letter .h2 {padding: 10px 0; font-size: 18px;}
    .copyright {text-align: center; font-size: 15px; padding-top: 30px;}
    .iaboutus-fl, .iaboutus-fr {width: auto; float: none;}
    .iaboutus-fl {padding-bottom: 30px; margin-bottom: 20px;}
    .iaboutus-bg {display: none;}
    .iaboutus-tit {background: none; padding-left: 0; height: auto; padding-bottom: 10px;}
    .iaboutus-tit-in {height: 50px; line-height: 50px; padding-left: 20px; font-size: 20px; white-space: nowrap;}
    .iaboutus-con {padding-top: 20px;}

    .banner-in {height: 140px;}
    .atitle .h2, .maintitle .h1 {font-size: 26px;}
    .maintitle.bline .h1 {padding-bottom: 10px;}
    .soncate a {padding: 0 10px; margin: 0 2px; font-size: 14px; border: 1px solid #000;}
    .position {font-size: 13px;}
    .ceoletter {padding: 30px 0;}
    .aboutus-profile .fl, .aboutus-profile .fr, .numdata, .vision {width: auto; float: none;}
    .strength-bg {display: none;}
    .strength {padding: 20px 0;}
    .strength-con {font-size: 16px; line-height: 30px; padding-top: 15px;}
    .numdata {padding: 20px;}
    .numdata-pad {padding-right: 0;}
    .vision {padding: 20px; background-size: cover; margin-top: 20px;}
    .vision-pad {padding-left: 0;}
    .numdata-li {padding-bottom: 15px;}
    .numdata-li .fr .h1 .span1 {font-size: 36px;}
    .history-fl {width: auto; float: none;}
    .history-fr {display: none;}
    .certificate-con {margin: 0; padding-top: 30px; padding-bottom: 34px;}
    .atitle-more {top: 20px;}
    .atitle-more a {height: 36px; line-height: 36px; padding: 0 12px; font-size: 14px;}
    .gallery-con {padding: 20px 0;}

    .proleft {display: none; width: auto; float: none;}
    .proright {width: auto; float: none;}
    .msglist, .cerlist {--gap-col: 10px; --gap-row: 10px;}
    .pro-part .h1 {font-size: 16px;}
    .pro-part .tag span {padding: 0 5px; margin-right: 5px;}
    .pcatename {padding: 20px 0 10px; font-size: 20px;}
    .proimage, .protext {width: auto; float: none;}
    .proimage-fl, .proimage-fr {display: none;}
    .protext-table-maxin {min-width: 100vw;}
    .protext-td {white-space: nowrap;}
    .proimage-app {padding-bottom: 10px;}
    .protext-h1 {font-size: 26px;}
    .protext-h2 {font-size: 26px;}
    .pro-part .more a {font-size: 14px;}

    .cont_inpart:nth-child(1), .cont_inpart:nth-child(2), .cont_inpart:nth-child(3) {width: auto;}
    .cont_inpart .pic i {font-size: 30px;}
    .cont_inpart .words .h1 {font-size: 20px; margin-bottom: 5px;}
    .form {padding: 0; box-shadow: none;}
    .form_div .fl, .form_div .fr {width: calc(50% - 5px);}
    .form_div {padding-bottom: 10px;}
    .history-button {width: 100%; padding: 0;}

    .news-part .date {width: 84px; margin-right: 10px;}
    .news-tit {font-size: 20px;}
    .news-con {font-size: 16px; line-height: 26px;}
    .recipe-part .text {width: calc(100% - 150px - 20px); padding-top: 18px;}
    .recipe-part .text .h1 {font-size: 17px;}
    .recipe-part .text .h2 {display: none;}
    .recipe-part .text .h3 {display: none;}
    .recipe-part .pic {width: 150px;}
    .recipe-con {padding: 15px 0;}
    .viewmore {padding-top: 15px;}
    .viewmore a {padding: 0 20px; font-size: 16px; height: 42px; line-height: 42px;}
}