﻿textarea::-webkit-input-placeholder {color: #ddd;}
textarea::-moz-placeholder { color: #ddd;}
textarea:-moz-placeholder { color: #ddd;}
textarea:-ms-input-placeholder { color: #ddd;}

/*header*/
/*header*/
.header { position: absolute; top: 0; left: 0; }
.header:after { position: absolute; content: ""; width: 100%; height: 250px; background: linear-gradient(to bottom,rgba(36,36,36,0.4) 0%,transparent 100%); left: 0; top: 0; }
.header .slogan { color: #F4E515; }
.header .slogan:before { background: #F4E515; opacity: 0.5; }
.header .language { border-color: #fff; }
.header .language .front img { filter: invert(0); }
.header .language .front i { color: #ffff; }
.header .language .front:after { border-color: #fff; }
.header .language span { border-color: #fff; }
.header .language span a { color: #fff; }
.header .search_box .s_btn { border-color: #fff; }
.header .search_box .s_btn img { filter: invert(0); }
.header .search_box .s_key { border: none; }
.header .search_box .s_key .submit { background-color: #F4E515; filter: invert(0); }
.header .menu li a { color: #fff; }
/*banner*/
.banner { position: relative; background: #fff; margin: 0 auto; overflow: hidden; padding-bottom: 34px; clear: both; }
.banner .swiper-slide { line-height: 0; }
.banner .swiper-slide img { width: 100%; }
.banner .swiper-pagination { bottom: 80px !important; }
.banner .swiper-pagination-bullet { width: 8px; height: 8px; background: #fff; opacity: 0.6; border-radius: 4px; cursor: pointer; margin: 0 8px !important; transition: all 0.5s ease; }
.banner .swiper-pagination-bullet-active { opacity: 1; width: 26px; }
.banner .prev,.banner .next { width: 54px; height: 54px; cursor: pointer; margin-left: 10px; border-radius: 50%; border: 1px solid rgba(255,255,255,0.8); background-color: rgba(255,255,255,0.2); top: 46%; left: -100px; position: absolute; z-index: 9; transition: all 0.5s ease; }
.banner .prev:hover,.banner .next:hover { border-color: #fff; }
.banner .next { left: auto; right: -100px; }
.banner:hover .prev { left: 3%; }
.banner:hover .next { right: 3%; }
/*title*/
h2.main_title { text-align: center; position: relative; }
h2.main_title a { display: block; line-height: 0; }
h2.main_title strong { display: block; font-size: 48px; line-height: 100%; color: #000; font-family: MiSans-Heavy; margin-bottom: 16px; }
h2.main_title span { display: block; font-weight: normal; font-size: 18px; line-height: 28px; color: #000; }
.principle { margin-top: 59px; background: url(/images/principle_bg.png) no-repeat center top; padding: 110px 0 120px; }
.principle .container { position: relative; }
.principle h2 { width: 400px; margin-bottom: 50px; }
.principle h2 span { display: block; font-size: 22px; line-height: 100%; color: #F4E515; font-weight: bold; font-variation-settings: "BEVL" 1,"wght" 700; text-transform: uppercase; margin-bottom: 26px; }
.principle h2 strong { display: block; font-size: 54px; line-height: 64px; color: #212122; font-weight: bold; font-variation-settings: "BEVL" 1,"wght" 700; }
.principle p.info { position: absolute; right: 0; top: 0; width: calc(100% - 552px); font-size: 22px; font-weight: 400; letter-spacing: 0px; line-height: 32px; color: #606266; padding-top: 51px; }
.principle p.info:before { position: absolute; content: ""; width: 100%; height: 1px; opacity: 1; background: #eaebec; left: 0; top: 0; }
.open-video { line-height: 0; position: relative; cursor: pointer; }
.open-video:after { position: absolute; content: ""; width: 100%; height: 100%; background: url(/images/video_icon.png) no-repeat center; background-size: 82px 82px; left: 0; top: 0; }
.open-video img { width: 100%; }
.video-box {position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:100%;height:100%;font-size:0;z-index:9999;background:rgba(0,0,0,0.9);display:none;}
.video-box .video { width: 60vw; position: absolute; top: 50%; left: 50%; -webkit-transform: translate(-50%,-50%); -o-transform: translate(-50%,-50%); -ms-transform: translate(-50%,-50%); -moz-transform: translate(-50%,-50%); transform: translate(-50%,-50%); }
.video-box .video iframe,.video-box .video video { width: 60vw;}
.video-box .close-video { position: absolute; top: calc(54px); right: 5%; width: 30px; height: 30px; cursor: pointer; background: url(/images/close.png) no-repeat center; }
.product { max-height: 1120px; overflow: hidden; box-sizing: border-box; background: url("/images/product_bg.jpg") no-repeat center top; padding: 110px 0; }
.product h2 a { display: block; font-size: 54px; font-weight: 700; font-variation-settings: "BEVL" 1,"wght" 700; letter-spacing: 0px; line-height: 64px; color: #212122; text-align: center; }
.product .pro_con { margin-top: 50px; display: flex; display: -webkit-flex; justify-content: flex-start; -webkit-justify-content: flex-start; flex-wrap: wrap; }
.product .pro_con li { width: 23.94%; margin-bottom: 20px;margin-right: 1.413%;}
.product .pro_con li:nth-of-type(4n){margin-right: 0;}
.product .pro_con li > a { display: block; border-radius: 20px; line-height: 0; overflow: hidden; background: #fff; box-sizing: border-box; transition: all 0.5s ease; border: 2px solid #fff; padding: 28px 11px 13px; }
.product .pro_con li h4 { font-size: 20px; line-height: 24px; color: #333; max-height: 48px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; height: 48px; padding: 0 17px; font-variation-settings: "BEVL" 1,"wght" 700; }
.product .pro_con li span { display: inline-block; margin: 14px 0; padding-left: 17px; padding-right: 24px; font-size: 16px; line-height: 18px; color: #909399; background: url(/images/more1.png) no-repeat right center; background-size: 13px auto; transition: all 0.5s ease; }
.product .pro_con li span:hover { padding-right: 28px; }
.product .pro_con li img { width: 100%; }
.product .pro_con li:hover > a { border: 2px solid #f4e515; box-shadow: 8px 4px 20px rgba(1,32,66,0.12); }
.product .more { width: 166px; margin-top: 30px; }
.product .more:hover { width: 170px; }
.more { margin: 0 auto; transition: all 0.5s ease; }
.more a { display: inline-block; margin: 0 auto; height: 44px; background: #F4E515; box-sizing: border-box; padding: 8px 8px 8px 20px; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; transition: all 0.5s ease; border-radius: 25px; }
.more a span { display: block; font-size: 18px; font-weight: 400; letter-spacing: 0px; line-height: 21.09px; color: #212122; }
.more a i { display: block; width: 28px; height: 28px; border-radius: 50%; background: #ffffff; box-sizing: border-box; padding: 7px; }
.more a i img { width: 14px; }
.sm_banner { height: 340px; background: url(/images/sm_banner_bg.jpg) no-repeat center top; box-sizing: border-box; }
.sm_banner .container { display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; height: 100%; }
.sm_banner p { width: calc(100% - 625px); font-size: 40px; font-weight: 700; font-variation-settings: "BEVL" 1,"wght" 700; letter-spacing: 0px; line-height: 46px; color: #ffffff; }
.sm_banner a { display: block; width: 428px; height: 74px; background: #F4E515; border-radius: 43px; box-sizing: border-box; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; transition: all 0.5s ease; padding: 12px 44px 12px 12px; }
.sm_banner a img { width: 50px; }
.sm_banner a span { font-size: 24px; font-weight: 700; font-variation-settings: "BEVL" 1,"wght" 700; line-height: 28px; color: #212122; transition: all 0.5s ease; }
.sm_banner a:hover { background: #f6ea46; }
.sm_banner a:hover span { letter-spacing: 0.5px; }
.ys { height: 890px; background: #f1f1f1; }
.ys .container { position: relative; }
.ys .pic { width: 960px; position: absolute; right: 50%; top: 0; }
.ys .pic img { width: 100%; }
.ys .con { width: 50%; position: absolute; left: 50%; top: 0; padding-top: 65px; padding-left: 100px; box-sizing: border-box; }
.ys h2 { font-size: 54px; font-weight: 700; font-variation-settings: "BEVL" 1,"wght" 700; line-height: 72px; color: #212122; margin-bottom: 47px; }
.ys p { font-size: 20px; font-weight: 500; font-variation-settings: "BEVL" 1,"wght" 500; letter-spacing: 0px; line-height: 24px; color: #606266; margin-bottom: 30px; padding-left: 26px; position: relative; }
.ys p:before { position: absolute; content: ""; width: 14px; height: 2px; opacity: 1; background: #d8d8d8; left: 0; top: 11px; }
.ys .more { margin: 52px 0 0 0; width: 307px; }
.ys .more:hover { width: 312px; }
.news { overflow: hidden; background: #f6f8fa; padding: 110px 0; }
.news h2 a { display: block; font-size: 60px; font-weight: 700; font-variation-settings: "BEVL" 1,"wght" 700; letter-spacing: 0px; line-height: 70px; color: #212122; text-align: center; }
.news .container { position: relative; }
.news .news_con { margin-top: 50px; overflow: hidden; }
.news .news_con dl { width: 32.394%; }
.news .news_con dt { line-height: 0; overflow: hidden; border-radius: 10px; height: 320px; }
.news .news_con dt img { width: 100%; height: 100%; object-fit: cover; }
.news .news_con dd a { display: block; padding-top: 30px; box-sizing: border-box; }
.news .news_con dd h4 { font-size: 22px; line-height: 30px; color: #212122; max-height: 60px; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; height: 60px; font-weight: bold; font-variation-settings: "BEVL" 1,"wght" 700; }
.news .news_con dd p { width: 166px; height: 44px; box-sizing: border-box; background: #fff; border-radius: 25px; padding: 0 8px 0 19px; display: flex; display: -webkit-flex; justify-content: space-between; -webkit-justify-content: space-between; align-items: center; -webkit-align-items: center; transition: all 0.5s ease; margin-top: 30px; }
.news .news_con dd p span { font-size: 18px; font-weight: 400; letter-spacing: 0px; line-height: 22px; color: #212122; }
.news .news_con dd p i { display: block; width: 28px; height: 28px; opacity: 1; background: #fff; padding: 7px; box-sizing: border-box; border-radius: 50%; filter: invert(1); }
.news .news_con dd p i img { width: 14px; }
.news .news_con dd p:hover { width: 170px; }
.news dl:hover dd p { background: #F4E515; }
.news dl:hover dd p i { filter: invert(0); }
.news .news_prev,.news .news_next { width: 72px; height: 72px; border-radius: 50%; position: relative; background: #fff; cursor: pointer; position: absolute; top: 254px; box-sizing: border-box; display: flex; display: -webkit-flex; justify-content: center; -webkit-justify-content: center; align-items: center; -webkit-align-items: center; transition: all 0.5s ease; }
.news .news_prev img,.news .news_next img { width: 15px; height: 26px; }
.news .news_prev:hover,.news .news_next:hover { box-shadow: 0px 6px 18px 0px rgba(10,30,64,0.13); }
.news .news_prev { left: -110px; }
.news .news_next { right: -110px; }
@media screen and (max-width:1440px),screen and (max-width:1440px) and (-webkit-min-device-pixel-ratio:2) {
  .sm_banner p { width: calc(100% - 590px); }
  .news .news_prev,.news .news_next { width: 58px; height: 58px; }
  .news .news_prev { left: -70px; }
  .news .news_next { right: -70px; }
}
