@charset "utf-8";
/* CSS Document */


.flex{ display:flex; display: -webkit-flex; align-items:center;flex-wrap:  wrap ; justify-content:space-between}
.flex2{ display:flex; display: -webkit-flex; align-items:stretch;flex-wrap:  wrap ; justify-content:space-between}

.headerwhite.header .nav li a{ color:#fff;}
.header{ z-index:100; position:fixed; top:0; left:0; width:100%; padding:.55rem 0; padding-right:.5rem; transition:all .3s;}
.header.open{ background:#fff; padding-top:.2rem; padding-bottom:.2rem;}
.header .logo { padding-left:1.2rem;}
.header .logo img{ width:1rem; vertical-align:middle;}
.header .nav li a{ font-size:.2rem; color:#000000; margin-left:.8rem; font-weight:bold;}

.header.open .nav li a{ color:#000}
.headerwhite.header  .logo img.b{ display:none;}
.headerwhite.header.open .logo img.b{ display:block;}
.headerwhite.header.open .logo img.w{ display:none;}


.banner .swiper-slide{ overflow: hidden;}
.banner .swiper-slide img{ transition: all 7s; width: 100%; height: 100%; object-fit: cover; -webkit-transition: all 7s; -moz-transition: all 7s; -ms-transition: all 7s; -o-transition: all 7s; }
.banner .swiper-slide.swiper-slide-active img{ transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -ms-transform: scale(1.05); -o-transform: scale(1.05); }
.banner .swiper-button-next,.banner  .swiper-button-prev{ width: 50px; height: 50px; background-size: 50px 50px; margin: 0; margin-top: -25px;}
.banner .swiper-button-next{ right: 80px;}
.banner .swiper-button-prev{ left: 80px; }

.banner .swiper-button-next:after,.banner  .swiper-button-prev:after{ color:#000}

.index01{ padding:1.6rem 2.5rem .9rem;}



.index01top .img{ width:48%;}
.index01top .img img{ width:100%;}
.index01top .txt{ width:48%;}

.index01top .txt>b{ font-size:.44rem; line-height:1; color:#000000; text-transform:uppercase; display:block; text-align:center;}
.index01top .txt .line{ width:1.5rem; height:2px; background:#000; margin:0 auto; margin-bottom:.4rem; margin-top:.4rem;}
.index01top .txt .txts p{ margin-top:.3rem; font-size:.16rem; color:#282828;}

.index01bot li{ width:32.5%; margin-top:2%;}

.index02{ margin-bottom:1rem; background:#f4f4f4; padding-left:1.55rem; padding-right:1.55rem;}
.index02 li{ width:33.33%;}
.index02 li:nth-child(2){ padding:.7rem .5rem;}

.indextitle b{ font-size:.44rem; text-transform:uppercase; line-height:1.4;}
.indextitle{ text-align:center;}
.indextitle .line{width:1.5rem; height:2px; background:#000; margin:0 auto; margin-bottom:.5rem; margin-top:.2rem;}

.index02 .indextxt{ padding:0 .3rem;}
.index02 .indextxt p{ line-height:2.6; font-size:.16rem; color:#282828;}

.index03{ padding:1.2rem 3.5rem .8rem; background:#f4f4f4;}

.index3le,.index3ri{ width:48%;}
.index3le .indextxt p{ margin-bottom:.25rem; font-size:.16rem; color:#282828;}

.index3ri li{ width:49%; text-align:center; margin-bottom:.6rem; transform:translateY(-.5rem); -webkit-transform:translateY(-.5rem);}
.index3ri li b{ font-size:.26rem; color:#737373;}


.index3ri li:nth-child(2n){ transform:none;}


.index04{ padding:1.2rem 3.5rem 1rem;}
.index04tit{ font-size:.26rem; color:#282828; text-align:center; font-family:siyuanH;}
.index4bot{ font-size:.16rem; color:#282828; text-align:center; padding:.3rem 0 .6rem}

.index04 li{ width:33%; text-align:center;}
.index04 li span{ display:block; font-size:.16rem; color:#282828; text-transform:uppercase; margin-top:.2rem;}

.index05{ position:relative;}
.index05 img{ width:100%;}
.index05 .txt{ position:absolute; right:3.5rem; top:2.5rem; max-width:5.8rem;}
.index05 .txt b{ color:#fff;}
.index05 .txt .line{ background:#fff;}
.index05 .txt p{ color:#ffffff; font-size:.16rem;}

.index06 img{ width:100%; height:100%; object-fit:cover;}


.footer{ margin-top:1rem; background:#000000; text-align:center; }
.fotnav li a{ color:#fff; font-size:.16rem;}
.fotnav { padding:25px 0;    justify-content: center; border-bottom:1px solid #808080;}
.fotnav li{margin:0 33px;}
.link{ margin-top:30px;}
.link a{ margin:0 5px;}

.fotintro,.fotintro p,.fotintro span,.fotintro a{ color:#fff; text-transform:uppercase; font-size:.16rem;}
.fotintro span{ margin:5px 30px; display:inline-block; }
.fotintro{ padding:15px 0 20px;}

.ban img,.ban2 img{ width:100%; height:100%; object-fit:cover;}

.creative_list{ margin-top:1rem; background:#fafafa;}
.creative_list .img{ width:57%;}
.creative_list .img img{ width:100%;}
.creative_list .txt{ padding:30px 0; width:42%; padding-left:2.4rem;}
.creative_list .txt b{ font-size:.3rem; line-height:1.4; color:#727171; display:block; font-family:siyuanH;margin-bottom:.2rem;}
.creative_list .txt p{ font-size:.16rem; color:#727171;}
.creative_list:nth-child(2n) .txt{ padding-left:0; padding-right:2rem;}


.pro01 { padding:.9rem 0;}
.pro1top table{ max-width:9.7rem; margin:.7rem auto;}
.pro1top td{ font-size:.22rem; color:#282828; vertical-align:top; font-weight:lighter; padding:0 5px;}
.pro1top td:first-child{ white-space:nowrap;}

.pro01img img{ max-width:100%; display:block; margin:0 auto;}


.pro03{ position:relative; padding:1rem 5px .2rem; overflow:hidden;}
.pro03 span{ z-index:1; font-size:3.3rem; font-weight:bold; line-height:1; color:rgba(0,0,0,.04); position:absolute; right:-1.2rem; bottom:.8rem;}
.pro03 li{ width:25%; padding:0 5px;text-align:center; margin-bottom:.8rem;}
.pro03 li .img{ height:3.4rem;}
.pro03 li img{ }
.flexstart{    justify-content: flex-start;}
.pro03 li b{ font-size:.38rem; color:#a7a7a7; text-transform:uppercase; margin-top:.15rem; display:block;}
.pro03 ul{ position:relative; z-index:2;}

.pro04{ padding:1.2rem 1.6rem; background:#f4f4f4;}
.pro4le{ text-align:right; width:35%}
.pro4ri{ width:62%;}
.pro4ri img{ width:100%;}
.pro4le b{ font-size:.3rem; line-height:1.6; text-transform:uppercase; }
.pro4le .txt{ margin-top:.4rem;}
.pro4le .txt p{ font-size:.16rem; color:#282828;}

.pro05{ padding:1.3rem 3.5rem;}
.pro5le{ width:40%;}
.pro5le img{ max-width:100%; display:block;}
.pro5ri{ width:52%;}
.pro5ri b{ font-size:.3rem; line-height:1.6; text-transform:uppercase; font-weight:normal;}
.pro5ri .txt{ margin-top:.4rem;}
.pro5ri  p{ font-size:.16rem; color:#282828;}
.pro5ri p.fbt{ font-size:.22rem;}
.pro5ri  p strong{ color:#448444; padding-left:20px; background-image:url(../images/dui_03.jpg); background-position:left center; background-repeat:no-repeat;}

.about01{ padding-top:1.4rem;}
.index3le2{ padding-left:.5rem;}
.pro4le2{ padding-left:.7rem;}

.about01box{ margin-top:.8rem;}
.about03 .txt{ left:3.15rem; right:auto; top:3.5rem; max-width:5.6rem;}
.about01le{ width:41%; padding-left:1.55rem;}
.about01ri{ width:58%;}
.about01ri img{ width:100%;}
.about01le li{ margin-bottom:.7rem;}
.about01le li span{ font-size:1rem; font-weight:bold; color:#e7e7e7; z-index:1; line-height:1; display:block; position:absolute; left:0; top:-.4rem;}
.about01le li{ position:relative;}
.about01le li b{ text-transform:uppercase; position:relative; z-index:2; font-size:.28rem; color:#a7a7a7; line-height:1; display:block; padding:0; margin-bottom:.2rem;}
.about01le li p{ font-size:.18rem; color:#a7a7a7;}

.ban3 img{ width:100% ; height:100%; object-fit:cover;}

.contact01{ padding:.6rem 0; text-align:center;}
.contat1box{  display:inline-block; text-align:left;}
.contat1box p{padding:.25rem 0; background-size:.37rem auto; font-size:.2rem; padding-left:.6rem; background-position:left center;  background-repeat:no-repeat;}
.contat1box p.tel{ background-image:url(../images/contact_04.jpg);}
.contat1box p.mail{ background-image:url(../images/contact_08.jpg);}
.contat1box p.tel2{ background-image:url(../images/contact_12.jpg);}

.contact02{ padding:1.3rem 3.5rem; background:#fafafa;}

.contact02tit b{ display:block; text-align:center; font-size:.68rem;}
.contact02tit .line{ width:145px; margin:0 auto; height:2px; background:#000}
.contact02 .titxt{ max-width:10.7rem; margin:.4rem auto; text-align:center;}
.contact02 .titxt p{ font-size:.22rem; color:#727171;}

.contactform{ padding-top:.3rem;}
.contactform input{ background:#fff; padding:0 .3rem; height:40px; line-height:40px;border:none; width:48%; margin-bottom:.4rem;}
.contactform textarea{ margin-bottom:.4rem; width:100%; height:110px;background:#fff; padding:.1rem .3rem; border:none;}
.contactform button{ width:130px; height:50px; margin:0 auto; border:1px solid #000; border-radius:10px; display:block; background:none; font-size:16px; cursor:pointer; transition:all .3s;}
.contactform button:hover{ background:#fff;}


.newslists,.newsarticle{ padding:1.2rem 2.5rem .5rem;}
.newle{ width:71%;}
.newri{ width:25%;}
.newsli li{ width:49%; position:relative; margin-bottom:2%;}
.newsli li .img{ height:3.2rem;}
.newsli li .txt{ position:absolute; transition:all .3s; left:0; top:0; width:100%; height:100%;}
.newsli li .txt h2{ position:absolute; padding:15px 20px; bottom:0; left:0; width:100%; font-size:.2rem; color:#fff; font-weight:normal; line-height:1.4;}
.newsli li:hover .txt{ background:rgba(0,0,0,.5);}


.ritit{ font-size:.24rem; font-weight:bold; border-bottom:2px solid #000; color:#000; text-transform:uppercase; padding-bottom:.15rem; margin-bottom:.2rem;}

.ri01 li{ margin-bottom:15px;}
.ri01 .img{ width:40%;}
.ri01 .txt{ width:58%;}
.ri01 .txt h2{ font-size:16px; line-height:1.4; font-weight:normal; color:#666}
.ri01 li:hover .txt  h2{ color:#000}


.ri02{ background-size:cover; background-position:center;  background-repeat:no-repeat; padding:.4rem 20px; text-align:center;}
.ri02 a{ display:inline-block; padding:0 20px; border-radius:100px; color:#333; background:#fff; line-height:40px;}

.ri03{ margin-top:.4rem;}
.link a{ width:40px; height:40px; background:#000; border-radius:100%; display:inline-block; text-align:center;}
.link a i{ line-height:40px; font-size:20px; color:#fff;}

.pages{ padding-top:.5rem;}
.pages ul{justify-content: center;}
.pages ul li a{ display:block; padding:0 15px; line-height:40px; background:#eee; border-radius:100%; margin:0 5px;}
.pages ul li.active a,.pages ul li a:hover{ background:#000; color:#fff;}


.newsarticle h1{ font-size:.3rem; font-weight:normal}
.newsarticle .tim{ font-size:16px; color:#666; padding:.2rem 0;}
.content{ padding:.15rem 0;}
.content p{ font-size:16px; color:#666}

.prev_next { margin:.5rem auto;}
.prev_next a{ max-width:48%; color:#888; font-size:16px}
.prev_next a:hover{ color:#000}


.zuxin b{ font-size:.3rem; display:block; margin-bottom:.2rem;}

.zuxin li{ width:31.33%; position:relative; margin:1%;}
.zuxin li .img{ height:3.2rem;}
.zuxin li .txt{ position:absolute; transition:all .3s; left:0; top:0; width:100%; height:100%;}
.zuxin li .txt h2{ position:absolute; padding:15px 20px 20px; bottom:0; left:0; width:100%; font-size:.2rem; color:#fff; font-weight:normal; line-height:1.4;}
.zuxin li:hover .txt{ background:rgba(0,0,0,.5);}

.asb { font-family:siyuanB}


@font-face
{
font-family: siyuanB;
src: url('../fonts/SourceHanSerifCN-Bold.otf')
}
@font-face
{
font-family: siyuanH;
src: url('../fonts/SourceHanSerifCN-Heavy.otf')
}

@media screen and (max-width:960px){
	.index05 .txt{ right:0.5rem; max-width:9.8rem;}
	 
	}


@media screen and (max-width:768px){
	 .wap{ display:block;}
	 .pc{ display:none;}
	 .banner .swiper-button-prev{ left:10px;}
	 .banner .swiper-button-next{ right:10px;}
	 .index01{ padding:30px 20px;}
	 .index01top .img{ width:100%;}
	 .index01top .txt{ width:100%; margin-top:25px;}
	 .index01top .txt>b,.indextitle b{ font-size:22px;}
	 .index01top .txt .txts p{ font-size:14px; margin-bottom:10px;}
	 .index01top .txt .line,.indextitle .line{ width:30px; margin:20px auto;}
	 .index02{ padding:30px 20px;}
	 .index02 li:nth-child(2){ height:auto; padding:20px 0;}
	 .index02 li{ width:100%; height:10rem;}
	 .index02 .indextxt p,.index3le .indextxt p{ font-size:14px; line-height:1.75;}
	 .index03,.index04{ padding:30px 20px;}
	 .index3ri li b{ font-size:12px;}
	 .index3ri li{ transform:none; -webkit-transform:none;}
	 .index3le, .index3ri{ width:100%;}
	 .index3le{ margin-bottom:15px;}
	 .index04tit{ font-size:14px;}
	 .index04 li span{ margin-top:10px; font-size:12px; line-height:1.3;}
	 .index4bot{ font-size:12px; padding:20px 0;}
	 .index05 .txt{ position:static; max-width:none; padding:0 20px; margin-bottom:20px;}
	 .index05 .txt b{ color:#000}
	 .index05 .txt .line{ background:#000}
	 .index05 .txt p{ font-size:14px; line-height:1.75; color:#000}
	 .fotnav{ display:none;}
	 .link{ margin-top:0; padding-top:30px;}
	 .fotintro span{ font-size:14px;}
	 .footer{ padding:0 20px; margin-top:0;}
	 
.banner .swiper-button-next:after,.banner  .swiper-button-prev:after{  font-size:30px;}

.ban { height:18rem;}
.list_li{ padding:0 20px; padding-bottom:40px;}
.creative_list .txt p{ font-size:14px;line-height:1.4}
.creative_list .txt b{ font-size:16px; margin-bottom:10px; }
.creative_list .txt,.creative_list:nth-child(2n) .txt{ padding:20px; width:100%;}
.creative_list .img{ width:100%;}
.creative_list{ margin-top:20px; padding-top:12rem; position:relative;}
.creative_list .img { position:absolute; top:0; left:0; width:100%; height:12rem; padding:20px 10px;}
.pro1top table{ max-width:none;}
.pro1top{ padding:0 20px;}
.pro1top td{ font-size:14px;}
.pro01{ padding:30px 0;}
.pro1top table{ margin:25px auto;}
.index3le .indextxt p{ margin-bottom:5px;}
.pro03 li{ width:48%; margin:1%;}
.pro03 li .img{ height:6rem;}
.pro03 li b{ font-size:14px; margin-top:5px;}
.pro04{ padding:30px 20px;}
.pro4le{ width:100%; text-align:left;}
.pro4ri{ width:100%; margin-top:10px;}
.pro4le b{ font-size:16px;}
.pro4le .txt p{ font-size:14px;}
.pro5le,.pro5ri{ width:100%;}
.pro05{ padding:30px 20px;}
.pro5ri{ margin-top:25px;}
.pro5ri b{ font-size:18px;}
.pro5ri p.fbt{ font-size:16px;}
.pro5ri p{ font-size:14px;}
.ban3{ height:18rem;}
.about01{ padding-top:30px;}
.about01box{ margin-top:25px; padding:0 20px;}
.about01le{ width:100%; padding:0;}
.about01ri{ width:100%;}
.about01le li b{ font-size:16px; margin-bottom:10px;}
.about01le li span{ font-size:30px;}
.about01le li p{ font-size:14px; line-height:1.6;}
.about01le li{ margin-bottom:25px;}
.index3le{ padding-left:0}
.pro4le2{ padding-left:0; padding-top:20px;}
.contact01{ padding:30px 0;}
.contact02{ padding:30px 20px;}
.contact02tit b{ font-size:20px;}
.contact02tit .line{ margin:15px auto;}
.contact02 .titxt p{ font-size:12px;}
.contact02 .titxt{ max-width:none; margin:15px auto;}
.contactform input{ padding:0 15px; width:100%;}
.contactform textarea{ padding:5px 15px;}
.contactform button{ height:40px;}
.contat1box p{ padding:10px 0; padding-left:35px; font-size:16px; background-size:25px auto;}

.newslists, .newsarticle{ padding:30px 20px;}
.newle,.newri{ width:100%;}
.newsli li{ width:100%; margin-bottom:15px;}
.newsli li .img{ height:10rem;}
.newsli li .txt h2{ font-size:14px;}
.newri{ margin-top:30px;}
.ritit{ font-size:20px; padding-bottom:10px; margin-bottom:25px;}
.ri01 .txt h2{ font-size:14px;}
.ri02{ padding:40px 20px;}

.ri03{ margin-top:30px;}
.ri03 .link{ margin-top:0; padding-top:0}
.newsarticle h1{ font-size:18px;}
.newsarticle .tim{ padding:10px 0; font-size:14px;}
.content p{ font-size:14px;}
.prev_next{ margin:40px auto;}
.prev_next a{ max-width:none; margin-bottom:10px; font-size:14px;}
.zuxin li{ width:100%;}
.zuxin li .img{ height:10rem; width:100%;}
.zuxin li .txt h2{ font-size:14px;}
.zuxin b{ font-size:20px;}
.fotintro, .fotintro p, .fotintro span, .fotintro a{ font-size:14px;}
.pro1top td{ font-weight:normal;}
	}