@charset "utf-8";
#banner{height:894px;}
#banner a{ position: absolute;left: 0;top: 0;width: 100%;height: 100%;}

.index_box{width:990px;margin:0px auto;text-align:center;}
.index_box>dt>p:nth-child(1){color:#222;font-size:22px;}
.index_box>dt>p:nth-child(2){color:#333;font-size:14px}
.index_box>dd>ul>li{ display:inline-block;width:32%;margin: 0 0.5%;}

.index_pro_catalog{background:url(../images/home/index_pro_catalog.jpg) center;height:355px;background-size:cover;}
.index_pro_catalog a{display:block;height: 100%;}

.index_pic .thumb{ position: relative;padding-top: 117.5%;overflow: hidden;margin-right: 1px ;margin-bottom: 1px ;}
.index_pic .thumb a{ position: absolute;left: 0;top: 0;width: 100%;height: 100%;}
.index_pic .thumb .bgcolor{ position: absolute;left: 0;top: 0; background: #000;opacity: 0;width: 100%;height: 100%;}
.index_pic .thumb .mask{ position: absolute;left: 30px;top: 30px;right: 30px;bottom: 30px; }
.index_pic .thumb .mask i.line_l{ position: absolute;height: 0;width: 1px;background: #ffffff;left: 0;bottom: 0;}
.index_pic .thumb .mask i.line_t{ position: absolute;width: 0;height: 1px;background: #ffffff;left: 0;top: 0;}
.index_pic .thumb .mask i.line_r{ position: absolute;height: 0;width: 1px;background: #ffffff;right: 0;top: 0;}
.index_pic .thumb .mask i.line_b{ position: absolute;width: 0;height: 1px;background: #ffffff;right: 0;bottom: 0;}
.index_pic .thumb h4{ -webkit-transition-delay: .2s;transition-delay: .2s; transform: rotate(8deg); opacity: 0; color: #ffffff;position: absolute;height: 30px;line-height: 30px;top: 40%;margin-top: -15px;left: 15%;overflow: hidden;width: 70%;text-align: center;font-size: 1.2em;font-weight: normal;}
.index_pic .thumb h4.odd{ transform: rotate(-8deg); }
.index_pic:hover .thumb .bgcolor{ opacity: 0.6;}
.index_pic:hover .thumb .mask i.line_l,.index_pic:hover .thumb .mask i.line_r{ height: 100%;}
.index_pic:hover .thumb .mask i.line_t,.index_pic:hover .thumb .mask i.line_b{ width: 100%;}
.index_pic:hover .thumb h4{ opacity: 1;top: 50%;transform: rotate(0);}
.cms_tran{ -webkit-transition: all .5s  ease-out;transition: all .5s  ease-out;}
.cms_tran_in{ -webkit-transition: all .5s  ease-in;transition: all .5s  ease-in;}


.index_pro{max-width:1580px;margin:0px auto; padding:0px 10px}
.index_pro_title{float: left;}
.index_pro_title>h1{font-size: 34px;color:#000000; font-weight: normal}
.index_pro_title>em{font-size: 15px;color:#808080; font-style: normal}
.index_pro>dt>ul{float: right;}
.index_pro>dt>ul>li{ display: inline-block;color:#808080;font-size: 14px;line-height:36px; }
.index_pro>dt>ul>li a{color:#808080; font-size: 14px; line-height:36px;margin:10px 15px 0px 15px; padding: 0px 10px;display: inline-block;}
.index_pro>dd li{float:left;width:28.3%;padding-right:7%;}
.index_pro>dd li:nth-of-type(3n){padding-right:0px;}
.index_pro_t { display: none}


.index_store{max-width:1580px;margin:0px auto; padding:0px 10px}
.index_store_title{float: left;}
.index_store_title>h1{font-size: 34px;color:#000000; font-weight: normal}
.index_store_title>em{font-size: 15px;color:#808080; font-style: normal}
.index_store>dt>ul{float: right; display: none;}
.index_store>dt>ul>li{ display: inline-block;color:#808080;font-size: 14px;line-height:36px; }
.index_store>dt>ul>li a{color:#808080; font-size: 14px; line-height:36px;margin:10px 15px 0px 15px; padding: 0px 10px;display: inline-block;}
.index_store>dd li{float:left;width:32%;padding-right:2%;padding-bottom:1%;}
.index_store>dd li:nth-of-type(3n){padding-right:0px;}
.index_store_t { display: none}
.index_store .index_pic .thumb{padding-top:64.64%;}


.index_news{max-width:1580px;margin:0px auto;padding:0px 10px}
.index_news_title>h1{font-size: 34px;color:#000000; font-weight: normal}
.index_news_title>em{font-size: 15px;color:#808080; font-style: normal}
.index_news_swiper{width:100%;position:relative;}
.index_news_swiper .swiper-slide{float:left;}
.index_news_swiper .swiper-slide .thumb{padding-top:75%;}
.index_news_t{margin:5px 0px 10px 0px}
.index_news_t a{color:#2d2d2d;font-size:14px;}
.index_news_swiper .swiper-button-prev{right:40px;left:auto;top:-50px;width:8px;height:20px;background-size:100%;}
.index_news_swiper .swiper-button-next{right:0;top:-50px;width:8px;height:20px;background-size:100%;}



@media screen and (max-width: 1440px) {
    .index_pro_catalog{height: 300px;}

}

@media screen and (max-width: 768px) {
    #banner{height:187px;}
    .index_box{ width: 100%;}
    .index_box>dd>ul>li{ width: 95%;}
    .index_pro_catalog{height:80px;}

    .index_pro{width:95%;padding:0px}
    .index_pro_title,.index_pro>dt>ul{width:100%;margin-bottom:5px;}
    .index_pro_title>h1{float: left;font-size: 18px;}
    .index_pro_title>em{float: right;line-height: 36px;}
    .index_pro>dt>ul>li{width:50%;float:left;}
    .index_pro>dt>ul>li a{ display: block;text-align: center; padding: 0px;margin:5px 10px;border: 1px #e5e5e5 solid;}
    .index_pro>dt>ul>li span{display: none;}
    .index_pro>dd li{width:100%;padding-right:0px;}
    .index_pro_t{text-align: center;display:block; margin:5px 0px 10px 0px}
    .index_pro_t a{color:#2d2d2d;font-size:16px;}

    .index_store{width:95%;padding:0px}
    .index_store_title,.index_store>dt>ul{width:100%;margin-bottom:5px;}
    .index_store_title>h1{float: left;font-size: 18px;}
    .index_store_title>em{float: right;line-height: 36px;}
    .index_store>dt>ul>li{width:50%;float:left;}
    .index_store>dt>ul>li a{ display: block;text-align: center; padding: 0px;margin:5px 10px;border: 1px #e5e5e5 solid;}
    .index_store>dt>ul>li span{display: none;}
    .index_store>dd li{width:49%;padding-right:2%;padding-bottom:1%;}
    .index_store>dd li:nth-of-type(3n){padding-right:2%;}
    .index_store>dd li:nth-of-type(2n){padding-right:0px;}
    .index_store_t{text-align: center;display:block; margin:5px 0px 10px 0px}
    .index_store_t a{color:#2d2d2d;font-size:16px;}

    .index_news{width:95%;}
    .index_news_title>h1{font-size: 18px;}
    .index_news_dd_title,.index_news_dd_content{width:100%;text-align: left}
    .index_news_swiper .swiper-button-prev,.index_news_swiper .swiper-button-next{top:0px;}

}
