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

/*banner*/
.ibanner{ height:100vh; position:relative;}
.ibanner .swiper-slide a{ display:block; height:100%; background:#fff center no-repeat; background-size:cover; overflow:hidden; position:relative;}
.ibanner .swiper-slide a video{ display:block; width:108%; min-height:100%; position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);}
.ibanner .swiper-pagination{ display:block; height:14px; bottom:5%;}
.ibanner .swiper-pagination-bullet{ width:14px; height:14px; background:#fff; opacity:0.6; margin:0 9px !important; vertical-align:top;}
.ibanner .swiper-pagination-bullet-active{ background:#c01727; opacity:1;}

.slogan{ line-height:1.65; color:#fff; font-size:32px; text-align:center; background:url(../images/icons/slogan_bg.jpg) center no-repeat; background-size:cover; text-shadow:0 3px 0 #7d0202; padding:2.22em 0;}

.main{ width:auto;}
.bg{ background:url(../images/icons/bg.png) center no-repeat; background-size:cover;}
.ibox{ overflow:hidden;}
.ibox .con{ width:1200px; overflow:hidden; margin:0 auto; position:relative;}
.ibox h2.title{ display:block; line-height:2; color:#535353; font-size:26px; text-align:center; overflow:hidden; padding:2.5em 0 0; position:relative;}
.ibox h2.title span{ display:block; font-weight:normal;}
.ibox h2.title i{ display:block; width:1.4em; height:2px; background:#c01727; margin:0 auto;}
.ibox h2.title em{ display:block; line-height:1.36; font-size:2.34em; opacity:0.15;}
.ibox{ overflow:hidden;}

.box1 ul.project{ display:block; overflow:hidden; padding:60px 0 90px; margin:0 -10px;}
.box1 ul.project li{ display:block; width:25%; float:left;}
.box1 ul.project li a{ display:block; margin:0 10px;}
.box1 ul.project li a em{ display:block; background:#c01727; overflow:hidden;}
.box1 ul.project li a em img{ display:block; width:100%; transition:all ease 0.4s;}
.box1 ul.project li a:hover em img{ transform:scale(1.2); opacity:0.8;}
.box1 ul.project li a span{ display:block; line-height:2.625; color:#fff; font-size:16px; text-align:center; background:#c01727; margin:2px 0 0;}

.box2{ background:url(../images/icons/youshi_bg.jpg) center no-repeat; background-size:cover;}
.box2 h2.title em{ color:#b6b6b6;}
.box2 ul.youshi{ display:block; overflow:hidden; padding:42px 0 60px;}
.box2 ul.youshi li{ display:block; width:20%; float:left;}
.box2 ul.youshi li a{ display:block;}
.box2 ul.youshi li a img{ display:block; max-width:80%; transition:all ease 0.4s; margin:0 auto;}
.box2 ul.youshi li a span{ display:block; line-height:3.25; color:#535353; font-size:16px; text-align:center;}
.box2 ul.youshi li a:hover img{ transform:rotateY(180deg);}
.box2 ul.youshi li a:hover span{ color:#c01727;}

.cusBox{ position:relative; padding:42px 0 24px;}
.cusBox .swiper-container{ padding:0 0 24px;}
.cusBox .swiper-slide{ overflow:hidden;}
.cusBox .swiper-slide a{ display:block; width:20%; padding:14px 12px; box-sizing:border-box; float:left;}
.cusBox .swiper-slide a img{ display:block; width:100%; transition:all ease 0.4s; background:#fff; box-shadow:0 0 12px 0 rgba(0,0,0,0.15);}
.cusBox .swiper-slide a:hover img{ transform:scale(1.05); box-shadow:0 0 8px 0 rgba(183,28,34,0.5);}
.cusBox .swiper-pagination{ height:10px; bottom:0;}
.cusBox .swiper-pagination-bullet{ width:10px; height:10px; background:#c3c3c3; margin:0 5px !important; vertical-align:top; opacity:1;}
.cusBox .swiper-pagination-bullet-active{ background:#c01727;}

.box4{ background:url(../images/icons/about_bg.png) right bottom no-repeat; background-size:50% auto; padding:0 0 92px;}
.box4 h2.title span{ color:#c01727;}
.box4 .con{ position:relative;}
.box4 .txt{ width:53%; line-height:1.75; color:#535353; font-size:16px; padding:3em 0 0; overflow:hidden;}
.box4 a.more{ display:block; line-height:2; color:#c01727; font-size:16px; overflow:hidden; float:left;}

.ads{ display:block;}
.ads img{ display:block; width:100%;}

/*pc适配*/
@media only screen and (min-width:1480px){
.ibox .con{ width:82%;}
}

@media only screen and (max-width:1240px){
.ibanner{ height:100vh;}
.ibanner .swiper-slide a video{ width:auto; min-width:108%; height:100%;}

.ibox .con{ width:auto; margin:0 20px;}
.ibox h2.title{}
}

@media only screen and (max-width:1024px){
.ibanner{ height:68vw;}
.ibanner .swiper-pagination{ height:12px;}
.ibanner .swiper-pagination-bullet{ width:12px; height:12px; margin:0 8px !important;}

.slogan{ font-size:24px; padding:1.5em 0;}

.ibox .con{ width:auto; margin:0 20px;}
.ibox h2.title{ padding:1.5em 0 0;}
.ibox h2.title em{ line-height:2; font-size:1.5em;}

.box1 ul.project{ padding:20px 0 80px;}
.box1 ul.project li{ width:50%;}
.box1 ul.project li a{ margin:20px 10px 0;}

.box2 ul.youshi{ padding:22px 0 50px;}
.box2 ul.youshi li a span{ font-size:14px;}

.cusBox{ padding:16px 0 24px;}
.cusBox .swiper-container{ padding:0 0 40px}
.cusBox .swiper-slide a{ padding:6px;}

.box4{ padding:0 0 62px;}
.box4 .txt{ width:auto; padding:1.5em 0 0;}

}

@media only screen and (max-width:480px){
.ibanner .swiper-slide a video{ opacity:0;}
.ibanner .swiper-pagination{ height:10px;}
.ibanner .swiper-pagination-bullet{ width:10px; height:10px; margin:0 4px !important;}

.slogan{ font-size:16px; padding:1.5em;}

.ibox .con{ margin:0 10px;}
.ibox h2.title{ font-size:20px; padding:1.2em 0 0;}

.box1 ul.project{ padding:10px 0 60px; margin:0 -5px;}
.box1 ul.project li a{ margin:12px 5px 0;}
.box1 ul.project li a span{ font-size:14px;}

.box2 ul.youshi{ padding:12px 0 40px;}
.box2 ul.youshi li{ width:33.33%;}
.box2 ul.youshi li:nth-child(4){ margin-left:16.67%;}
.box2 ul.youshi li a img{ max-width:70%;}
.box2 ul.youshi li a span{ line-height:1.5; padding:1em 0.6em 0.6em;}

.cusBox .swiper-slide a{ width:50%;}

.box4 .txt{ font-size:14px; padding:1em 0 0;}
}




/**/