@charset "utf-8";
/* CSS Document */
html,body{ width:100%; height:100%;}
body{ font-family:arial,"Microsoft YaHei",sans-serif; font-size:14px; line-height:1.5; color:#333; background:#fff;}
a{ text-decoration:none; color:#333;-webkit-tap-highlight-color:transparent;}
*{ list-style:none; margin:0; border:none; outline:none; padding:0;}
.fl{ float:left;}
.fr{ float:right;}
.ov{ overflow:hidden;}
.dis{ display:block !important;}
.dn{ display:none;}
.clear{ clear:both;}
.clear:after{ content:""; display:block; clear:both;}
input::-webkit-input-placeholder,textarea::-webkit-input-placeholder{ color:#999;} 
input:-moz-placeholder,textarea:-moz-placeholder{ color:#999;} 
input::-moz-placeholder,textarea::-moz-placeholder{ color:#999;} 
input:-ms-input-placeholder,textarea:-ms-input-placeholder{ color:#999;} 
input,select,textarea{ -webkit-appearance:none;}
input[type=checkbox]{ -webkit-appearance:checkbox;}

/*header*/
@media screen and (min-width:1280px){
.header{ width:100%; background-color:#fff; position:relative; z-index:999; left:0; top:0; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.header .m_nav{ width:1200px; margin:25px auto;}
.header .m_nav .m_logo{ float:left; height:60px;}
.header .m_nav .m_logo img{ display:block; height:60px;}
.header .m_nav .m_logo img.img02{ display:none;}
.header .m_nav .nav_button{ display:none;}
.header .m_nav .yu{ float:right; height:40px; line-height:40px; margin:10px 0; border-radius:40px; background:linear-gradient(to right,#dd3333,#ff3333); padding:0 25px; display:flex; align-items:center;}
.header .m_nav .yu a{ display:block; color:#fff; font-size:14px; color:#ccc;}
.header .m_nav .yu a.on{ color:#fff;}
.header .m_nav .yu a:hover{ text-decoration:underline;}
.header .m_nav .yu span{ margin:0 9px; display:block; color:#fff; font-size:14px; color:#ccc;}
.header .m_nav .yu01{ display:none;}
.header .m_nav .ser{ width:346px; height:36px; border:2px solid #dd3333; border-radius:40px; float:right; margin:10px 20px; position:relative;}
.header .m_nav .ser p{ width:268px; float:left; height:36px; display:block; overflow:hidden; border-radius:40px;}
.header .m_nav .ser p input{ width:230px; display:block; font-size:14px; line-height:36px; padding-left:18px; padding-right:20px;}
.header .m_nav .ser a{ width:80px; height:40px; display:block; position:absolute; right:-2px; top:-2px; border-radius:40px; overflow:hidden;}
.header .m_nav .ser a input{ width:100%; height:40px; line-height:40px; background-color:#dd3333; text-align:center; font-size:14px; color:#fff; cursor:pointer;}
.header .m_nav_list{ width:100%;}
.header .m_nav_list .first_list{ display:block; width:1200px; margin:auto; border-top:1px solid #eee; height:50px; display:flex; justify-content:space-between;}
.header .m_nav_list .first_list li{ position:relative; float:left; text-align:center; height:50px;}
.header .m_nav_list .first_list li>a{ display:block; overflow:hidden; width:100%; height:50px; line-height:50px; font-size:18px; text-transform:capitalize; box-sizing:border-box; border-bottom:2px solid #fff;}
.header .m_nav_list .first_list li:last-child a{ color:#dd3333;}
.header .m_nav_list .first_list li .m_next{ display:none;}
.header .m_nav_list .first_list li.on>a,.header .m_nav_list .first_list li:hover>a{ color:#dd3333; border-bottom:2px solid #dd3333;}
.header .m_nav_list .first_list li p{ width:230px; box-sizing:border-box; position:absolute; left:50%; margin-left:-115px; top:100%; padding:10px 0; display:none; background-color:#f7f7f7;}
.header .m_nav_list .first_list li p a{ font-size:14px; line-height:30px; height:30px; padding:0 20px; display:block; overflow:hidden; text-align:center; color:#333;}
.header .m_nav_list .first_list li p>strong{ display:block; font-weight:normal; position:relative;}
.header .m_nav_list .first_list li p>strong b{ display:none; position:absolute; left:100%; top:0; width:100%; font-weight:normal; background-color:#f7f7f7; padding:10px 0;}
.header .m_nav_list .first_list li:hover p{ display:block;}
.header .m_nav_list .first_list li p>strong:hover b{ display:block;}
.header .m_nav_list .first_list li p a:hover{ color:#dd3333;}
.header .m_nav_list .second_list{ display:none;}
.header.pos{ position:fixed; width:94%; padding:0 3%; box-shadow:0 0 10px rgba(0,0,0,.1);}
.header.pos .m_nav{ width:auto; float:left; margin:15px 0;}
.header.pos .m_nav .m_logo{ height:40px;}
.header.pos .m_nav .m_logo img{ height:40px;}
.header.pos .m_nav .m_logo img.img02{ display:block;}
.header.pos .m_nav .m_logo img.img01{ display:none;}
.header.pos .m_nav .ser{ display:none;}
.header.pos .m_nav .yu{ height:30px; line-height:30px; margin:5px 2vw; margin-right:0; padding:0 20px;}
.header.pos .m_nav_list{ width:auto; float:right;}
.header.pos .m_nav_list .first_list{ width:auto; border-top:none; height:70px;}
.header.pos .m_nav_list li{ height:70px; width:auto !important; margin-left:1.5vw;}
.header.pos .m_nav_list li>a{ font-size:16px; height:70px; line-height:70px;}
}
@media screen and (min-width: 1280px) and (max-width: 1439px){
.header.pos .m_nav .yu{ margin-left:1vw;}
.header.pos .m_nav_list li{ margin-left:1vw;}
}
@media screen and (min-width: 1024px) and (max-width: 1279px){
.header{ width:100%; background-color:#fff; position:relative; z-index:999; left:0; top:0; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.header .m_nav{ width:94%; margin:15px auto;}
.header .m_nav .m_logo{ float:left; height:40px;}
.header .m_nav .m_logo img{ display:block; height:40px;}
.header .m_nav .m_logo img.img01{ display:none;}
.header .m_nav .nav_button{ display:none;}
.header .m_nav .yu{ float:right; height:34px; line-height:34px; border-radius:40px; margin:3px 0; background:linear-gradient(to right,#dd3333,#ff3333); padding:0 20px; display:flex; align-items:center;}
.header .m_nav .yu a{ display:block; color:#fff; font-size:14px; color:#ccc;}
.header .m_nav .yu a.on{ color:#fff;}
.header .m_nav .yu a:hover{ text-decoration:underline;}
.header .m_nav .yu span{ margin:0 5px; display:block; color:#fff; font-size:14px; color:#ccc;}
.header .m_nav .yu01{ float:right; height:34px; line-height:34px; border-radius:40px; margin:3px 0; background:linear-gradient(to right,#dd3333,#ff3333); padding:0 20px; align-items:center; display:none;}
.header .m_nav .yu01 a{ display:block; color:#fff; font-size:14px; color:#ccc;}
.header .m_nav .yu01 a.on{ color:#fff;}
.header .m_nav .yu01 a:hover{ text-decoration:underline;}
.header .m_nav .yu01 span{ margin:0 5px; display:block; color:#fff; font-size:14px; color:#ccc;}
.header .m_nav .ser{ width:306px; height:30px; border:2px solid #dd3333; border-radius:40px; float:right; margin:3px 1.5vw; position:relative;}
.header .m_nav .ser p{ width:228px; float:left; height:30px; display:block; overflow:hidden; border-radius:40px;}
.header .m_nav .ser p input{ width:198px; display:block; font-size:14px; line-height:30px; padding:0 15px;}
.header .m_nav .ser a{ width:80px; height:34px; display:block; position:absolute; right:-2px; top:-2px; border-radius:40px; overflow:hidden;}
.header .m_nav .ser a input{ width:100%; height:34px; line-height:34px; background-color:#dd3333; text-align:center; font-size:14px; color:#fff; cursor:pointer;}
.header .m_nav_list{ width:100%;}
.header .m_nav_list .first_list{ display:block; width:100%; margin:auto; border-top:1px solid #eee; height:50px; display:flex; justify-content:space-between;}
.header .m_nav_list .first_list li{ position:relative; float:left; text-align:center; height:50px;}
.header .m_nav_list .first_list li>a{ display:block; overflow:hidden; width:100%; height:50px; line-height:50px; font-size:16px; text-transform:capitalize; box-sizing:border-box; border-bottom:2px solid #fff;}
.header .m_nav_list .first_list li:last-child a{ color:#dd3333;}
.header .m_nav_list .first_list li .m_next{ display:none;}
.header .m_nav_list .first_list li.on>a,.header .m_nav_list .first_list li:hover>a{ color:#dd3333; border-bottom:2px solid #dd3333;}
.header .m_nav_list .first_list li p{ width:230px; box-sizing:border-box; position:absolute; left:50%; margin-left:-115px; top:100%; padding:10px 0; display:none; background-color:#f7f7f7;}
.header .m_nav_list .first_list li p a{ font-size:14px; line-height:30px; height:30px; display:block; overflow:hidden; text-align:center; color:#333; padding:0 20px;}
.header .m_nav_list .first_list li p>strong{ display:block; font-weight:normal; position:relative;}
.header .m_nav_list .first_list li p>strong b{ display:none; position:absolute; left:100%; top:0; width:100%; font-weight:normal; background-color:#f7f7f7; padding:10px 0;}
.header .m_nav_list .first_list li:hover p{ display:block;}
.header .m_nav_list .first_list li p>strong:hover b{ display:block;}
.header .m_nav_list .first_list li p a:hover{ color:#dd3333;}
.header .m_nav_list .second_list{ display:none;}
.header.pos{ position:fixed; width:94%; padding:0 3%; box-shadow:0 0 10px rgba(0,0,0,.1);}
.header.pos .m_nav{ width:auto; float:left; margin:15px 0;}
.header.pos .m_nav .m_logo{ height:30px;}
.header.pos .m_nav .m_logo img{ height:30px;}
.header.pos .m_nav .m_logo img.img01{ display:block;}
.header.pos .m_nav .m_logo img.img02{ display:none;}
.header.pos .m_nav .ser{ display:none;}
.header.pos .m_nav .yu{ display:none;}
.header.pos .m_nav .yu01{ height:24px; line-height:24px; margin-left:1vw; padding:0 15px; display:flex;}
.header.pos .m_nav_list{ width:auto; float:right;}
.header.pos .m_nav_list .first_list{ width:auto; border-top:none; height:60px;}
.header.pos .m_nav_list li{ height:60px; width:auto !important; margin-left:1.5vw;}
.header.pos .m_nav_list li>a{ font-size:14px; height:60px; line-height:60px;}
}
@media only screen and (max-width: 1023px){
.header{ width:100%; height:60px; background-color:#fff; position:fixed; z-index:999; left:0; top:0; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.header.pos{ box-shadow:0 0 10px rgba(0,0,0,.1);}
.header .m_nav{ width:94%; margin:15px auto;}
.header .m_nav .m_logo{ float:left; height:30px;}
.header .m_nav .m_logo img{ display:block; height:30px;}
.header .m_nav .m_logo img.img02{ display:none;}
.header .m_nav .yu{ display:none;}
.header .m_nav .yu01{ float:right; height:24px; line-height:24px; border-radius:40px; background:linear-gradient(to right,#dd3333,#ff3333); padding:0 10px; display:flex; align-items:center; margin:3px 10px; margin-left: 0;}
.header .m_nav .yu01 a{ display:block; color:#fff; font-size:12px; color:#ccc;}
.header .m_nav .yu01 a.on{ color:#fff;}
.header .m_nav .yu01 a:hover{ text-decoration:underline;}
.header .m_nav .yu01 span{ margin:0 3px; display:block; color:#fff; font-size:12px; color:#ccc;}
.header .m_nav .ser{ display:none;}
.header .m_nav .nav_button{ display:block; height:22px; width:28px; float:right; position:relative; margin:4px 0;}
.header .m_nav .nav_button::after{ content:""; display:block; width:100%; height:2px; position:absolute; background:#000; bottom:0; left:0; transition:all 0.3s;}
.header .m_nav .nav_button::before{ content:""; display:block; width:100%; height:2px; position:absolute; background:#000; top:0; left:0; transition:all 0.3s;}
.header .m_nav .nav_button span{ display:block; height:2px; width:100%; background:#000; position:absolute; left:0; top:50%; margin-top:-1px;}
.header .m_nav .nav_button.on span{ opacity:0;}
.header .m_nav .nav_button.on::after{ transform:rotate(-45deg); top:50%;}
.header .m_nav .nav_button.on::before{ transform:rotate(45deg); top:50%;}
body.oh{ overflow:hidden;}
.phonemask{ position:fixed; z-index:990; height:100%; width:100%; top:0; left:0; background:rgba(0,0,0,0.6); display:none; margin-top:60px;}
.m_nav_list{ position:fixed; top:60px; width:80%; bottom:0; overflow:hidden; font-size:14px; transition:all 0.5s; left:-100%; z-index:999; background-color:#fff;}
.m_nav_list.on{ transition-delay:0.2s; left:0;}
.nav_box{ transition:all 0.3s; background:#fff; height:100%; position:absolute; width:100%;}
.m_nav_list li{ padding:15px 0; background:#fff; border-top:1px solid #efefef; padding-left:20px; position:relative;}
.m_nav_list li a{ display:block;}
.m_nav_list ul.first_list li a{ text-transform:capitalize; font-size:16px;}
.m_nav_list ul.first_list li.on a{ color:#dd3333;}
.m_nav_list ul.first_list li:last-child a{ color:#dd3333;}
.m_nav_list li .m_next{ display:block; width:50px; height:100%; border-left:1px solid #efefef; position:absolute; right:0; top:0; z-index:10;}
.m_nav_list li .m_next::after{ content:""; display:block; height:0; width:0; border:4px solid transparent; border-left-color:#000; position:absolute; top:50%; margin-top:-4px; left:50%; margin-left:-4px;}
.m_nav_list li p{ display:none;}
.m_nav_list .second_list li p{ display:block; height:0; opacity:0;}
.m_nav_list .second_list li p b{ width:100%; height:54px; position:absolute; left:0; top:0; display:block;}
.m_nav_list .second_list li p.open{ opacity:1; height:auto; padding-top:10px;}
.m_nav_list .second_list li p a{ text-indent:15px; line-height:24px; color:#666; display:block;}
.m_nav_list ul.first_list{ top:0; left:0;}
.m_nav_list .second_list{ background:#fff; width:100%; height:100%; position:absolute; top:0; left:100%;}
.m_nav_list .second_list ul{ background:#fff; height:100%; position:absolute; width:100%; opacity:0;}
.m_nav_list .second_list ul.ztop{ z-index:99; opacity:1;}
.m_nav_list .second_list .m_nav_title{ height:52px; background:#efefef; text-align:center; line-height:52px; font-size:16px; position:relative; cursor:pointer; text-transform:uppercase;}
.m_nav_list .second_list .m_nav_title span{ display:block; width:52px; height:100%; position:absolute; top:0; left:0;}
.m_nav_list .second_list .m_nav_title span::before{ content:""; border-top:2px solid transparent; border-left:2px solid transparent; display:block; width:8px; height:8px; margin:auto; position:absolute; top:0; bottom:0; border-color:#000; -ms-transform:rotate(-45deg); transform:rotate(-45deg); left:50%; box-sizing:border-box;}
}

/*Inquiry Now*/
@media screen and (min-width:1280px){
.inquiry{ cursor:pointer;}
.ibox{ position:fixed; z-index:9999; height:100%; width:100%; top:0; left:0; background:rgba(0,0,0,0.6); display:none;}
.ibox .box{ width:960px; display:flex; background-color:#fff; position:absolute; top:50%; left:50%; transform:translateX(-50%) translateY(-50%);}
.ibox .left{ width:50%; background-position:center; background-repeat:no-repeat; background-size:cover;}
.ibox .right{ width:50%; padding:50px; box-sizing:border-box; position:relative;}
.ibox .right .close{ width:15px; position:absolute; right:15px; top:15px; cursor:pointer;}
.ibox .right .close img{ width:100%; display:block;}
.ibox .right .c01{ text-align:center; font-weight:bold; font-size:30px;}
.ibox .right .c02{ width:100%; box-sizing:border-box; border:1px solid #cacaca; margin-top:15px; position:relative;}
.ibox .right .c02 input{ padding:0 14px; box-sizing:border-box; width:100%; font-size:14px; line-height:32px; height:32px; display:block; overflow:hidden;}
.ibox .right .c02 select{ padding:0 14px; box-sizing:border-box; width:100%; font-size:14px; line-height:32px; height:32px; display:block; overflow:hidden;}
.ibox .right .c02 img{ position:absolute; right:10px; top:50%; margin-top:-2px; height:4px;}
.ibox .right .c02 textarea{ padding:4px 14px; box-sizing:border-box; width:100%; font-size:14px; line-height:24px; height:72px; display:block; overflow:hidden;}
.ibox .right .c03{ margin-top:15px;}
.ibox .right .c04{ width:100%; margin-top:15px;}
.ibox .right .c04 input{ width:100%; height:40px; line-height:40px; text-align:center; font-weight:bold; border-radius:40px; background-color:#333; font-size:16px; color:#fff; cursor:pointer; overflow:hidden;}
.ibox .right .c04 input:hover{ background-color:#dd3333;}
}
@media screen and (min-width: 769px) and (max-width: 1279px){
.inquiry{ cursor:pointer;}
.ibox{ position:fixed; z-index:9999; height:100%; width:100%; top:0; left:0; background:rgba(0,0,0,0.6); display:none;}
.ibox .box{ max-width:800px; width:94%; display:flex; background-color:#fff; position:absolute; top:50%; left:50%; transform:translateX(-50%) translateY(-50%);}
.ibox .left{ width:50%; background-position:center; background-repeat:no-repeat; background-size:cover;}
.ibox .right{ width:50%; padding:30px; padding-bottom:35px; box-sizing:border-box; position:relative;}
.ibox .right .close{ width:15px; position:absolute; right:10px; top:10px; cursor:pointer;}
.ibox .right .close img{ width:100%; display:block;}
.ibox .right .c01{ text-align:center; font-weight:bold; font-size:26px;}
.ibox .right .c02{ width:100%; box-sizing:border-box; border:1px solid #cacaca; margin-top:15px; position:relative;}
.ibox .right .c02 input{ padding:0 14px; box-sizing:border-box; width:100%; font-size:14px; line-height:32px; height:32px; display:block; overflow:hidden;}
.ibox .right .c02 select{ padding:0 14px; box-sizing:border-box; width:100%; font-size:14px; line-height:32px; height:32px; display:block; overflow:hidden;}
.ibox .right .c02 img{ position:absolute; right:10px; top:50%; margin-top:-2px; height:4px;}
.ibox .right .c02 textarea{ padding:4px 14px; box-sizing:border-box; width:100%; font-size:14px; line-height:24px; height:72px; display:block; overflow:hidden;}
.ibox .right .c03{ margin-top:15px;}
.ibox .right .c04{ width:100%; margin-top:15px;}
.ibox .right .c04 input{ width:100%; height:40px; line-height:40px; text-align:center; font-weight:bold; border-radius:40px; background-color:#333; font-size:16px; color:#fff; cursor:pointer; overflow:hidden;}
.ibox .right .c04 input:hover{ background-color:#dd3333;}
}
@media only screen and (max-width: 768px){
.inquiry{ cursor:pointer;}
.ibox{ position:fixed; z-index:9999; height:100%; width:100%; top:0; left:0; background:rgba(0,0,0,0.6); display:none;}
.ibox .box{ width:94%; background-color:#fff; position:absolute; top:50%; left:50%; transform:translateX(-50%) translateY(-50%);}
.ibox .left{ display:none;}
.ibox .right{ width:100%; padding:25px 15px; padding-bottom:30px; box-sizing:border-box; position:relative;}
.ibox .right .close{ width:15px; position:absolute; right:10px; top:10px; cursor:pointer;}
.ibox .right .close img{ width:100%; display:block;}
.ibox .right .c01{ text-align:center; font-weight:bold; font-size:20px;}
.ibox .right .c02{ width:100%; box-sizing:border-box; border:1px solid #cacaca; margin-top:15px; position:relative;}
.ibox .right .c02 input{ padding:0 14px; box-sizing:border-box; width:100%; font-size:14px; line-height:32px; height:32px; display:block; overflow:hidden;}
.ibox .right .c02 select{ padding:0 14px; box-sizing:border-box; width:100%; font-size:14px; line-height:32px; height:32px; display:block; overflow:hidden;}
.ibox .right .c02 img{ position:absolute; right:10px; top:50%; margin-top:-2px; height:4px;}
.ibox .right .c02 textarea{ padding:4px 14px; box-sizing:border-box; width:100%; font-size:14px; line-height:24px; height:72px; display:block; overflow:hidden;}
.ibox .right .c03{ margin-top:15px;}
.ibox .right .c04{ width:100%; margin-top:15px;}
.ibox .right .c04 input{ width:100%; height:40px; line-height:40px; text-align:center; font-weight:bold; border-radius:40px; background-color:#333; font-size:16px; color:#fff; cursor:pointer; overflow:hidden;}
.ibox .right .c04 input:hover{ background-color:#dd3333;}
}

/*banner*/
@media screen and (min-width:1280px){
.banner{ width:100%; height:550px; position:relative; z-index:1;}
.banner .swiper-container{ width:100%; height:100%;}
.banner .swiper-container .swiper-slide{ width:100%; height:100%; position:relative; overflow:hidden; display:block;}
.banner .swiper-container .swiper-slide .tu{ width:100%; height:100%; position:relative; z-index:1;}
.banner .swiper-container .swiper-slide .tu img{ width:1920px; display:block; position:absolute; top:50%; left:50%; transform:translateX(-50%) translateY(-50%);}
.banner .swiper-container .swiper-slide .tu img.img02{ display:none;}
.banner .swiper-container .swiper-slide .wen{ width:560px; z-index:9; position:absolute; top:50%; right:50%; margin-right:-600px; transform:translateY(-50%);}
.banner .swiper-container .swiper-slide .wen .b01{ width:560px;}
.banner .swiper-container .swiper-slide .wen .b01 img{ width:100%; display:block;}
.banner .swiper-container .swiper-slide .wen .b02{ width:100%; font-size:16px; line-height:24px; height:96px; font-weight:bold; margin-top:25px; color:#333; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:4;}
.banner .swiper-container .swiper-slide .wen .b03{ width:100%; margin-top:25px;}
.banner .swiper-container .swiper-slide .wen .b03 a{ width:168px; text-align:center; height:38px; line-height:38px; border:1px solid #dd3333; background-color:#dd3333; color:#fff; font-size:16px; font-weight:bold; display:block; float:left; margin-right:10px; border-radius:40px;}
.banner .swiper-container .swiper-slide .wen .b03 a:hover{ background-color:#ff3333;}
.banner .swiper-container .swiper-slide .wen .b03 a:last-child{ border:1px solid #fff; background-color:rgba(0,0,0,.2);}
.banner .swiper-container .swiper-slide .wen .b03 a:last-child:hover{ background-color:rgba(255,255,255,.7); color:#dd3333;}
.banner .swiper-container .swiper-pagination{ position:absolute; right:50%; margin-right:-600px; bottom:40px;}
.banner .swiper-container .swiper-pagination span{ width:20px; height:20px; display:block; float:left; background-image:url(../images/ban_18.png); background-position:center; background-repeat:no-repeat; margin-left:5px;}
.banner .swiper-container .swiper-pagination span.swiper-pagination-bullet-active{ background-image:url(../images/banh_20.png);}
.banner .swiper-button-prev{ position:absolute; left:50%; margin-left:-600px; bottom:30px; background-image:url(../images/prev_07.png); background-position:center; background-repeat:no-repeat; width:40px; height:40px; cursor:pointer; border-radius:100%; background-color:rgba(255,255,255,.7);}
.banner .swiper-button-next{ position:absolute; left:50%; margin-left:-530px; bottom:30px; background-image:url(../images/next_09.png); background-position:center; background-repeat:no-repeat; width:40px; height:40px; cursor:pointer; border-radius:100%; background-color:rgba(255,255,255,.7);}
.banner .swiper-button-prev:hover,.banner .swiper-button-next:hover{ background-color:#fff;}
.banner .swiper-container .swiper-slide:nth-child(1) .wen{ width:500px;}
.banner .swiper-container .swiper-slide:nth-child(2) .wen{ width:500px;}
}
}
@media screen and (min-width: 769px) and (max-width: 1279px){
.banner{ width:100%; height:43.08vw; position:relative; z-index:1;}
.banner .swiper-container{ width:100%; height:100%;}
.banner .swiper-container .swiper-slide{ width:100%; height:100%; position:relative; overflow:hidden; display:block;}
.banner .swiper-container .swiper-slide .tu{ width:100%; height:100%; position:relative; z-index:1;}
.banner .swiper-container .swiper-slide .tu img{ height:43.08vw; display:block; position:absolute; top:50%; left:50%; transform:translateX(-50%) translateY(-50%);}
.banner .swiper-container .swiper-slide .tu img.img02{ display:none;}
.banner .swiper-container .swiper-slide .wen{ max-width:560px; width:44%; z-index:9; position:absolute; top:50%; right:3%; transform:translateY(-50%);}
.banner .swiper-container .swiper-slide .wen .b01{ width:100%;}
.banner .swiper-container .swiper-slide .wen .b01 img{ width:100%; display:block;}
.banner .swiper-container .swiper-slide .wen .b02{ width:100%; font-size:16px; line-height:24px; height:120px; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:5; font-weight:bold; margin-top:20px; color:#333;}
.banner .swiper-container .swiper-slide .wen .b03{ width:100%; margin-top:20px;}
.banner .swiper-container .swiper-slide .wen .b03 a{ width:168px; text-align:center; height:38px; line-height:38px; border:1px solid #dd3333; background-color:#dd3333; color:#fff; font-size:16px; font-weight:bold; display:block; float:left; margin-right:10px; border-radius:40px;}
.banner .swiper-container .swiper-slide .wen .b03 a:hover{ background-color:#ff3333;}
.banner .swiper-container .swiper-slide .wen .b03 a:last-child{ border:1px solid #fff; background-color:rgba(0,0,0,.2);}
.banner .swiper-container .swiper-slide .wen .b03 a:last-child:hover{ background-color:rgba(255,255,255,.7); color:#dd3333;}
.banner .swiper-container .swiper-pagination{ position:absolute; right:3%; bottom:25px;}
.banner .swiper-container .swiper-pagination span{ width:20px; height:20px; display:block; float:left; background-image:url(../images/ban_18.png); background-position:center; background-repeat:no-repeat; margin-left:5px;}
.banner .swiper-container .swiper-pagination span.swiper-pagination-bullet-active{ background-image:url(../images/banh_20.png);}
.banner .swiper-button-prev{ position:absolute; left:3%; bottom:25px; background-image:url(../images/prev_07.png); background-position:center; background-repeat:no-repeat; width:40px; height:40px; cursor:pointer; border-radius:100%; background-color:rgba(255,255,255,.7);}
.banner .swiper-button-next{ position:absolute; left:3%; margin-left:50px; bottom:25px; background-image:url(../images/next_09.png); background-position:center; background-repeat:no-repeat; width:40px; height:40px; cursor:pointer; border-radius:100%; background-color:rgba(255,255,255,.7);}
.banner .swiper-button-prev:hover,.banner .swiper-button-next:hover{ background-color:#fff;}
}
@media screen and (min-width: 769px) and (max-width: 1023px){
.banner{ padding-top:60px;}
}
@media only screen and (max-width: 768px){
.banner{ width:100%; position:relative; z-index:1; padding-top:60px;}
.banner .swiper-container{ width:100%;}
.banner .swiper-container .swiper-slide{ width:100%; position:relative; overflow:hidden; display:block;}
.banner .swiper-container .swiper-slide .tu{ width:100%; height:100%; position:relative; z-index:1;}
.banner .swiper-container .swiper-slide .tu img{ width:100%; display:block;}
.banner .swiper-container .swiper-slide .tu img.img01{ display:none;}
.banner .swiper-container .swiper-slide .wen{ width:94%; z-index:9; position:absolute; top:6vw; right:3%;}
.banner .swiper-container .swiper-slide .wen .b01{ width:100%; float:right;}
.banner .swiper-container .swiper-slide .wen .b01 img{ width:280px; display:block; float:right;}
.banner .swiper-container .swiper-slide .wen .b02{ float:right; width:60%; padding-left:40%; font-size:14px; line-height:20px; height:80px; margin-top:3vw; color:#333; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:4;}
.banner .swiper-container .swiper-slide .wen .b03{ min-width:60%; float:right; margin-top:3vw;}
.banner .swiper-container .swiper-slide .wen .b03 a{ width:108px; text-align:center; height:30px; line-height:30px; border:1px solid #dd3333; background-color:#dd3333; color:#fff; font-size:14px; display:block; float:left; margin-right:10px; border-radius:40px;}
.banner .swiper-container .swiper-slide .wen .b03 a:hover{ background-color:#ff3333;}
.banner .swiper-container .swiper-slide .wen .b03 a:last-child{ border:1px solid #fff; background-color:rgba(0,0,0,.2); margin-right:0;}
.banner .swiper-container .swiper-slide .wen .b03 a:last-child:hover{ background-color:rgba(255,255,255,.7); color:#dd3333;}
.banner .swiper-container .swiper-pagination{ position:absolute; left:50%; transform:translateX(-50%); bottom:10px;}
.banner .swiper-container .swiper-pagination span{ width:10px; height:10px; display:block; float:left; background-image:url(../images/ban_18.png); background-position:center; background-repeat:no-repeat; margin:0 3px; border-radius:100%; opacity:.7;}
.banner .swiper-container .swiper-pagination span.swiper-pagination-bullet-active{ background-image:url(../images/banh_20.png); opacity:1;}
.banner .swiper-button-prev,.banner .swiper-button-next{ display:none;}
}

/*products Collections*/
@media screen and (min-width:1280px){
.pbox{ padding-top:60px; padding-bottom:70px; position:relative; z-index:1; background-color:#fff;}
.pbox .title{ width:1200px; margin:auto; text-align:center;}
.pbox .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.pbox .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.pbox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.pbox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.pbox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.pbox .box{ width:1200px; margin:auto; margin-top:30px; position:relative;}
.pbox .box .swi{ width:260px; margin:auto; margin-top:50px;}
.pbox .box .swiper-button-prev{ width:18px; height:20px; float:left; background-image:url(../images/left.png); background-position:center; background-repeat:no-repeat;}
.pbox .box .swiper-button-next{ width:18px; height:20px; float:right; background-image:url(../images/right.png); background-position:center; background-repeat:no-repeat;}
.pbox .box .swiper-button-prev:hover{ background-image:url(../images/lefth.png);}
.pbox .box .swiper-button-next:hover{ background-image:url(../images/righth.png);}
.pbox .box .swiper-pagination{ width:180px; position:absolute; left:50%; margin-left:-90px; bottom:20px; font-size:16px; line-height:30px; height:30px; color:#999; text-align:center;}
.pbox .box .swiper-pagination span.swiper-pagination-current,.pbox .box .swiper-pagination a{ color:#dd3333;}
.pbox .box .swiper-pagination01{ width:180px; position:absolute; left:50%; margin-left:-90px; bottom:9px; height:3px; background-image:url(../images/line_27.png); background-position:left center; background-repeat:repeat-x;}
.pbox .box .swiper-pagination01 .swiper-pagination-progressbar-fill{ background-color:#dd3333;}
.pbox .box .swiper-slide{ width:285px; height:450px; display:block; overflow:hidden;}
.pbox .box .swiper-slide a{ width:100%; height:100%; display:block; position:relative; overflow:hidden; background-position:center; background-size:cover;}
.pbox .box .swiper-slide a .mask{ width:100%; height:100%; background:linear-gradient(to top,rgba(0,0,0,0.7),rgba(0,0,0,0));}
.pbox .box .swiper-slide a .wen{ width:calc(100% - 40px); position:absolute; left:20px; bottom:20px; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pbox .box .swiper-slide a .wen .p01{ height:50px;}
.pbox .box .swiper-slide a .wen .p01 img{ display:block; height:50px;}
.pbox .box .swiper-slide a .wen .p02{ margin-top:10px; font-size:22px; font-weight:bold; line-height:40px; height:40px; text-overflow:ellipsis; white-space:nowrap; color:#fff;}
.pbox .box .swiper-slide a .wen .p03{ height:0; position:relative; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pbox .box .swiper-slide a .wen .p03 p{ display:block; font-size:14px; line-height:32px; height:32px; text-align:right; padding-right:10px; color:#fff; text-transform:uppercase;}
.pbox .box .swiper-slide a .wen .p03 span{ display:block; float:right; width:80px; height:1px; background-color:#fff; overflow:hidden;}
.pbox .box .swiper-slide a:hover .wen{ bottom:30px;}
.pbox .box .swiper-slide a:hover .wen .p03{ height:33px;}
.pbox .box .swiper-slide a:hover .mask{ background:rgba(221,51,51,0.7);}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.pbox{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-color:#fff;}
.pbox .title{ width:94%; margin:auto; text-align:center;}
.pbox .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.pbox .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.pbox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.pbox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.pbox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.pbox .box{ width:94%; margin:auto; margin-top:25px; position:relative;}
.pbox .box .swi{ width:260px; margin:auto; margin-top:45px;}
.pbox .box .swiper-button-prev{ width:18px; height:20px; float:left; background-image:url(../images/left.png); background-position:center; background-repeat:no-repeat;}
.pbox .box .swiper-button-next{ width:18px; height:20px; float:right; background-image:url(../images/right.png); background-position:center; background-repeat:no-repeat;}
.pbox .box .swiper-button-prev:hover{ background-image:url(../images/lefth.png);}
.pbox .box .swiper-button-next:hover{ background-image:url(../images/righth.png);}
.pbox .box .swiper-pagination{ width:180px; position:absolute; left:50%; margin-left:-90px; bottom:20px; font-size:16px; line-height:30px; height:30px; color:#999; text-align:center;}
.pbox .box .swiper-pagination span.swiper-pagination-current,.pbox .box .swiper-pagination a{ color:#dd3333;}
.pbox .box .swiper-pagination01{ width:180px; position:absolute; left:50%; margin-left:-90px; bottom:9px; height:3px; background-image:url(../images/line_27.png); background-position:left center; background-repeat:repeat-x;}
.pbox .box .swiper-pagination01 .swiper-pagination-progressbar-fill{ background-color:#dd3333;}
.pbox .box .swiper-slide{ width:285px; height:450px; display:block; overflow:hidden;}
.pbox .box .swiper-slide a{ width:100%; height:100%; display:block; position:relative; overflow:hidden; background-position:center; background-size:cover;}
.pbox .box .swiper-slide a .mask{ width:100%; height:100%; background:linear-gradient(to top,rgba(0,0,0,0.7),rgba(0,0,0,0));}
.pbox .box .swiper-slide a .wen{ width:calc(100% - 40px); position:absolute; left:20px; bottom:15px; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pbox .box .swiper-slide a .wen .p01{ height:50px;}
.pbox .box .swiper-slide a .wen .p01 img{ display:block; height:50px;}
.pbox .box .swiper-slide a .wen .p02{ margin-top:10px; font-size:20px; font-weight:bold; line-height:38px; height:38px; text-overflow:ellipsis; white-space:nowrap; color:#fff;}
.pbox .box .swiper-slide a .wen .p03{ height:0; position:relative; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pbox .box .swiper-slide a .wen .p03 p{ display:block; font-size:14px; line-height:30px; height:30px; text-align:right; padding-right:10px; color:#fff; text-transform:uppercase;}
.pbox .box .swiper-slide a .wen .p03 span{ display:block; float:right; width:70px; height:1px; background-color:#fff; overflow:hidden;}
.pbox .box .swiper-slide a:hover .wen{ bottom:20px;}
.pbox .box .swiper-slide a:hover .wen .p03{ height:31px;}
.pbox .box .swiper-slide a:hover .mask{ background:rgba(221,51,51,0.7);}
}
@media only screen and (max-width: 767px){
.pbox{ padding-top:25px; padding-bottom:30px; position:relative; z-index:1; background-color:#fff;}
.pbox .title{ width:94%; margin:auto; text-align:center;}
.pbox .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.pbox .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.pbox .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.pbox .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.pbox .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.pbox .box{ width:94%; margin:auto; margin-top:20px; position:relative;}
.pbox .box .swi{ width:230px; margin:auto; margin-top:35px;}
.pbox .box .swiper-button-prev{ width:18px; height:20px; float:left; background-image:url(../images/left.png); background-position:center; background-repeat:no-repeat;}
.pbox .box .swiper-button-next{ width:18px; height:20px; float:right; background-image:url(../images/right.png); background-position:center; background-repeat:no-repeat;}
.pbox .box .swiper-button-prev:hover{ background-image:url(../images/lefth.png);}
.pbox .box .swiper-button-next:hover{ background-image:url(../images/righth.png);}
.pbox .box .swiper-pagination{ width:160px; position:absolute; left:50%; margin-left:-80px; bottom:15px; font-size:14px; line-height:30px; height:30px; color:#999; text-align:center;}
.pbox .box .swiper-pagination span.swiper-pagination-current,.pbox .box .swiper-pagination a{ color:#dd3333;}
.pbox .box .swiper-pagination01{ width:160px; position:absolute; left:50%; margin-left:-80px; bottom:9px; height:3px; background-image:url(../images/line_27.png); background-position:left center; background-repeat:repeat-x;}
.pbox .box .swiper-pagination01 .swiper-pagination-progressbar-fill{ background-color:#dd3333;}
.pbox .box .swiper-slide{ width:285px; height:350px; display:block; overflow:hidden;}
.pbox .box .swiper-slide a{ width:100%; height:100%; display:block; position:relative; overflow:hidden; background-position:center; background-size:cover;}
.pbox .box .swiper-slide a .mask{ width:100%; height:100%; background:linear-gradient(to top,rgba(0,0,0,0.7),rgba(0,0,0,0));}
.pbox .box .swiper-slide a .wen{ width:calc(100% - 30px); position:absolute; left:15px; bottom:10px; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pbox .box .swiper-slide a .wen .p01{ height:50px;}
.pbox .box .swiper-slide a .wen .p01 img{ display:block; height:50px;}
.pbox .box .swiper-slide a .wen .p02{ margin-top:5px; font-size:18px; font-weight:bold; line-height:28px; height:28px; text-overflow:ellipsis; white-space:nowrap; color:#fff;}
.pbox .box .swiper-slide a .wen .p03{ height:0; position:relative; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pbox .box .swiper-slide a .wen .p03 p{ display:block; font-size:14px; line-height:28px; height:28px; text-align:right; padding-right:5px; color:#fff; text-transform:uppercase;}
.pbox .box .swiper-slide a .wen .p03 span{ display:block; float:right; width:60px; height:1px; background-color:#fff; overflow:hidden;}
.pbox .box .swiper-slide a:hover .wen{ bottom:15px;}
.pbox .box .swiper-slide a:hover .wen .p03{ height:29px;}
.pbox .box .swiper-slide a:hover .mask{ background:rgba(221,51,51,0.7);}
}

/*about*/
@media screen and (min-width:1280px){
.abox{ padding-top:60px; padding-bottom:70px; position:relative; z-index:1; background-color:#f1f1f1; background-position:bottom center; background-repeat:no-repeat; background-image:url(../images/abg_14.jpg);}
.abox .title{ width:1200px; margin:auto; text-align:center;}
.abox .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.abox .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.abox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.abox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.abox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.abox .box{ width:1200px; margin:auto; margin-top:30px; position:relative; height:520px;}
.abox .box .left{ width:520px; margin-top:40px; float:left;}
.abox .box .left img{ max-width:100%; display:block;}
.abox .box .right{ width:630px; margin-top:5px; float:right;}
.abox .box .right .a01{ font-weight:bold; font-size:24px; line-height:52px;}
.abox .box .right .a02{ font-size:14px; line-height:24px; height:192px; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:8;}
.abox .box .right .a03{ margin-top:28px; width:120px; padding-bottom:1px; position:relative;}
.abox .box .right .a03 p{ font-size:14px; line-height:32px; height:32px; display:block; text-transform:uppercase;}
.abox .box .right .a03 span{ display:block; overflow:hidden; width:80px; height:1px; background-color:#dd3333; position:absolute; right:0; bottom:0; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.abox .box .right .a01:hover{ color:#dd3333;}
.abox .box .right .a03:hover p{ color:#dd3333;}
.abox .box .right .a03:hover span{ right:10px;}
.abox .box .bt{ font-size:30px; line-height:38px; position:absolute; right:0; bottom:0; text-align:right; color:#fff; font-weight:bold;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.abox{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-color:#f1f1f1; background-position:bottom center; background-repeat:no-repeat; background-image:url(../images/abg_14.jpg); background-size:130% auto;}
.abox .title{ width:94%; margin:auto; text-align:center;}
.abox .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.abox .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.abox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.abox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.abox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.abox .box{ width:94%; margin:auto; margin-top:25px; position:relative; padding-bottom:60px;}
.abox .box .left{ width:43.33%; margin-top:30px; float:left;}
.abox .box .left img{ max-width:100%; display:block;}
.abox .box .right{ width:52.5%; float:right; margin-top:5px;}
.abox .box .right .a01{ font-weight:bold; font-size:20px; line-height:30px;}
.abox .box .right .a02{ font-size:14px; line-height:24px; height:192px; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:8; margin-top:5px;}
.abox .box .right .a03{ margin-top:15px; width:120px; padding-bottom:1px; position:relative;}
.abox .box .right .a03 p{ font-size:14px; line-height:30px; height:30px; display:block; text-transform:uppercase;}
.abox .box .right .a03 span{ display:block; overflow:hidden; width:80px; height:1px; background-color:#dd3333; position:absolute; right:0; bottom:0; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.abox .box .right .a01:hover{ color:#dd3333;}
.abox .box .right .a03:hover p{ color:#dd3333;}
.abox .box .right .a03:hover span{ right:10px;}
.abox .box .bt{ font-size:26px; line-height:34px; position:absolute; right:0; bottom:0; text-align:right; color:#fff; font-weight:bold;}
}
@media only screen and (max-width: 767px){
.abox{ padding-top:25px; padding-bottom:30px; position:relative; z-index:1; background-color:#f1f1f1; background-position:bottom center; background-repeat:no-repeat; background-image:url(../images/abg_14.jpg); background-size:200% auto;}
.abox .title{ width:94%; margin:auto; text-align:center;}
.abox .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.abox .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.abox .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.abox .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.abox .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.abox .box{ width:94%; margin:auto; margin-top:20px; position:relative;}
.abox .box .left{ width:100%;}
.abox .box .left img{ max-width:100%; display:block; margin:auto;}
.abox .box .right{ width:100%; margin-top:10px;}
.abox .box .right .a01{ font-weight:bold; font-size:18px; line-height:28px;}
.abox .box .right .a02{ font-size:14px; line-height:24px; height:192px; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:8;}
.abox .box .right .a03{ margin-top:5px; width:110px; padding-bottom:1px; position:relative;}
.abox .box .right .a03 p{ font-size:14px; line-height:28px; height:28px; display:block; text-transform:uppercase;}
.abox .box .right .a03 span{ display:block; overflow:hidden; width:70px; height:1px; background-color:#dd3333; position:absolute; right:0; bottom:0; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.abox .box .right .a01:hover{ color:#dd3333;}
.abox .box .right .a03:hover p{ color:#dd3333;}
.abox .box .right .a03:hover span{ right:5px;}
.abox .box .bt{ width:100%; font-size:22px; line-height:26px; text-align:right; color:#fff; font-weight:bold; margin-top:20px;}
}

/*OUR SERVICES*/
@media screen and (min-width:1280px){
.sbox{ padding-top:60px; padding-bottom:65px; position:relative; z-index:1; background-position:center; background-repeat:no-repeat; background-size:cover; background-attachment:fixed;}
.sbox .mask{ width:100%; height:100%; position:absolute; left:0; top:0; background-color:#000; opacity:0.9; z-index:1;}
.sbox .title{ width:1200px; margin:auto; text-align:center;}
.sbox .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden; color:#fff;}
.sbox .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#fff;}
.sbox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.sbox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.sbox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#fff; overflow:hidden;}
.sbox .box{ width:1200px; margin:auto; position:relative; z-index:9;}
.sbox .box .list{ width:100%; padding-top:5px; display:block;}
.sbox .box .list li{ display:block; float:left; width:570px; margin-left:60px; margin-top:45px;}
.sbox .box .list li:nth-child(2n+1){ clear:left; float:left; margin-left:0;}
.sbox .box .list li .left{ width:50px; margin-right:10px; float:left;}
.sbox .box .list li .left img{ display:block; max-width:100%; -webkit-transition:-webkit-transform 1s,height 1s,width 1s;}
.sbox .box .list li:hover .left img{ -webkit-transform:rotateY(-360deg);}
.sbox .box .list li .right{ float:left; width:calc(100% - 60px); float:left;}
.sbox .box .list li .right .bt{ font-size:24px; line-height:34px; color:#fff; padding-top:3px; font-weight:bold;}
.sbox .box .list li .right .wen{ font-size:14px; line-height:24px; color:#ebeaea; padding-top:18px;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.sbox{ padding-top:45px; padding-bottom:45px; position:relative; z-index:1; background-position:center; background-repeat:no-repeat; background-size:cover;}
.sbox .mask{ width:100%; height:100%; position:absolute; left:0; top:0; background-color:#000; opacity:0.9; z-index:1;}
.sbox .title{ width:94%; margin:auto; text-align:center;}
.sbox .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden; color:#fff;}
.sbox .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#fff;}
.sbox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.sbox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.sbox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#fff; overflow:hidden;}
.sbox .box{ width:94%; margin:auto; position:relative; z-index:9;}
.sbox .box .list{ width:100%; padding-top:5px; display:block;}
.sbox .box .list li{ display:block; float:left; width:48.5%; margin-left:3%; margin-top:30px;}
.sbox .box .list li:nth-child(2n+1){ clear:left; float:left; margin-left:0;}
.sbox .box .list li .left{ width:50px; margin-right:10px; float:left;}
.sbox .box .list li .left img{ display:block; max-width:100%; -webkit-transition:-webkit-transform 1s,height 1s,width 1s;}
.sbox .box .list li:hover .left img{ -webkit-transform:rotateY(-360deg);}
.sbox .box .list li .right{ float:left; width:calc(100% - 60px); float:left;}
.sbox .box .list li .right .bt{ font-size:20px; line-height:30px; color:#fff; font-weight:bold; padding-top:5px;}
.sbox .box .list li .right .wen{ font-size:14px; line-height:24px; color:#ebeaea; padding-top:10px;}
}
@media only screen and (max-width: 767px){
.sbox{ padding-top:25px; padding-bottom:25px; position:relative; z-index:1; background-position:center; background-repeat:no-repeat; background-size:cover;}
.sbox .mask{ width:100%; height:100%; position:absolute; left:0; top:0; background-color:#000; opacity:0.9; z-index:1;}
.sbox .title{ width:94%; margin:auto; text-align:center;}
.sbox .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden; color:#fff;}
.sbox .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#fff;}
.sbox .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.sbox .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.sbox .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#fff; overflow:hidden;}
.sbox .box{ width:94%; margin:auto; position:relative; z-index:9;}
.sbox .box .list{ width:100%; padding-top:5px; display:block;}
.sbox .box .list li{ display:block; float:left; width:100%; margin-top:15px;}
.sbox .box .list li:nth-child(2n+1){ clear:left; float:left; margin-left:0;}
.sbox .box .list li .left{ width:50px; margin-right:10px; float:left;}
.sbox .box .list li .left img{ display:block; max-width:100%; -webkit-transition:-webkit-transform 1s,height 1s,width 1s;}
.sbox .box .list li:hover .left img{ -webkit-transform:rotateY(-360deg);}
.sbox .box .list li .right{ float:left; width:calc(100% - 60px); float:left;}
.sbox .box .list li .right .bt{ font-size:18px; line-height:28px; color:#fff; font-weight:bold;}
.sbox .box .list li .right .wen{ font-size:14px; line-height:24px; color:#ebeaea; padding-top:5px;}
}

/*Eco-Friendly Water Bottles For Your Business*/
@media screen and (min-width:1280px){
.ebox{ padding-top:60px; padding-bottom:70px; position:relative; z-index:1; background-color:#fff;}
.ebox .title{ width:1200px; margin:auto; text-align:center;}
.ebox .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.ebox .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.ebox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.ebox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ebox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.ebox .box{ width:1200px; margin:auto; margin-top:45px;}
.ebox .box .e01{ text-align:center; font-size:24px; line-height:32px;}
.ebox .box .e02{ text-align:center; font-size:14px; line-height:34px; margin-top:15px;}
.ebox .box .e03{ width:160px; height:40px; margin:26px auto; margin-bottom:70px;}
.ebox .box .e03 a{ width:100%; display:block; overflow:hidden; color:#fff; font-size:14px; text-transform:uppercase; text-align:center; height:40px; line-height:40px; border-radius:40px; background:linear-gradient(to right,#dd3333,#ff3333); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ebox .box .e03 a:hover{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
.ebox .box .e04{ width:100%; display:flex; align-items:center; justify-content:center;}
.ebox .box .e04 a{ display:block; margin:0 50px; height:100px;}
.ebox .box .e04 a img{ height:100px; display:block;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.ebox{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-color:#fff;}
.ebox .title{ width:94%; margin:auto; text-align:center;}
.ebox .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.ebox .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.ebox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.ebox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ebox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.ebox .box{ width:94%; margin:auto; margin-top:30px;}
.ebox .box .e01{ text-align:center; font-size:20px; line-height:30px;}
.ebox .box .e02{ text-align:center; font-size:14px; line-height:30px; margin-top:10px;}
.ebox .box .e03{ width:160px; height:40px; margin:20px auto; margin-bottom:50px;}
.ebox .box .e03 a{ width:100%; display:block; overflow:hidden; color:#fff; font-size:14px; text-transform:uppercase; text-align:center; height:40px; line-height:40px; border-radius:40px; background:linear-gradient(to right,#dd3333,#ff3333); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ebox .box .e03 a:hover{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
.ebox .box .e04{ width:100%; display:flex; align-items:center; justify-content:center;}
.ebox .box .e04 a{ display:block; margin:0 50px; height:100px;}
.ebox .box .e04 a img{ height:100px; display:block;}
}
@media only screen and (max-width: 767px){
.ebox{ padding-top:25px; padding-bottom:30px; position:relative; z-index:1; background-color:#fff;}
.ebox .title{ width:94%; margin:auto; text-align:center;}
.ebox .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.ebox .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.ebox .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.ebox .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ebox .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.ebox .box{ width:94%; margin:auto; margin-top:15px;}
.ebox .box .e01{ text-align:center; font-size:18px; line-height:28px;}
.ebox .box .e02{ text-align:center; font-size:14px; line-height:24px; margin-top:5px;}
.ebox .box .e03{ width:140px; height:40px; margin:10px auto; margin-bottom:30px;}
.ebox .box .e03 a{ width:100%; display:block; overflow:hidden; color:#fff; font-size:14px; text-transform:uppercase; text-align:center; height:34px; line-height:34px; border-radius:40px; background:linear-gradient(to right,#dd3333,#ff3333); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ebox .box .e03 a:hover{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
.ebox .box .e04{ width:100%; display:flex; align-items:center; justify-content:center; flex-wrap:wrap;}
.ebox .box .e04 a{ display:block; margin:0 10px; height:50px;}
.ebox .box .e04 a img{ height:50px; display:block;}
}

/*Products*/
@media screen and (min-width:1280px){
.mbox{ padding-top:60px; position:relative; z-index:1; background-color:#f1f1f1;}
.mbox .title{ width:1200px; margin:auto; text-align:center;}
.mbox .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.mbox .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.mbox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.mbox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.mbox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.mbox .box{ width:1200px; margin:auto; margin-top:30px;}
.mbox .swiper-container{ width:100%;}
.mbox .swiper-container .swiper-slide{ width:285px; background-color:#fff; border-radius:5px; background-position:top center; background-repeat:no-repeat; background-size:100% 170px;}
.mbox .swiper-container .swiper-slide.c01{ background-image:url(../images/pg01.jpg);}
.mbox .swiper-container .swiper-slide.c02{ background-image:url(../images/pg02.jpg);}
.mbox .swiper-container .swiper-slide.c03{ background-image:url(../images/pg03.jpg);}
.mbox .swiper-container .swiper-slide.c04{ background-image:url(../images/pg04.jpg);}
.mbox .swiper-container .swiper-slide a{ display:block; padding:15px 20px; padding-bottom:30px; overflow:hidden;}
.mbox .swiper-container .swiper-slide .w01{ font-size:16px; line-height:24px; height:24px; color:#fff; text-overflow:ellipsis; white-space:nowrap; font-weight:bold;}
.mbox .swiper-container .swiper-slide .w02{ font-size:18px; line-height:26px; height:52px; color:#eee; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2; margin-top:6px;}
.mbox .swiper-container .swiper-slide .w03{ width:100%; height:190px; display:flex; align-items:center; margin-top:20px;}
.mbox .swiper-container .swiper-slide .w03 img{ max-width:100%; max-height:190px; display:block; margin:auto;}
.mbox .swiper-container .swiper-slide .w04{ width:100%; height:40px; border:1px solid #cacaca; box-sizing:border-box; margin-top:25px; display:flex; align-items:center; justify-content:center; border-radius:5px;}
.mbox .swiper-container .swiper-slide .w04 img{ display:block;}
.mbox .swiper-container .swiper-slide .w04 p{ display:block; margin-left:10px; font-size:16px; line-height:26px;}
.mbox .swiper-container .swiper-slide a:hover .w04{ border:1px solid #dd3333;}
.mbox .swiper-container .swiper-slide a:hover .w04 p{ color:#dd3333;}
.mbox .swi{ width:260px; height:40px; margin:auto; margin-top:30px;}
.mbox .swi .button{ width:40px; height:40px; border-radius:100%; background-color:#333; overflow:hidden; float:left;}
.mbox .swi .button img{ width:100%; display:block;}
.mbox .swi .more{ width:160px; height:40px; border-radius:40px; background-color:#333; float:left; margin:0 10px;}
.mbox .swi .more a{ width:100%; display:block; color:#fff; text-align:center; font-size:16px; height:40px; line-height:40px;}
.mbox .swi .more:hover,.mbox .swi .button:hover{ background-color:#dd3333;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.mbox{ padding-top:45px; position:relative; z-index:1; background-color:#f1f1f1;}
.mbox .title{ width:94%; margin:auto; text-align:center;}
.mbox .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.mbox .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.mbox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.mbox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.mbox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.mbox .box{ width:94%; margin:auto; margin-top:25px;}
.mbox .swiper-container{ width:100%;}
.mbox .swiper-container .swiper-slide{ width:285px; background-color:#fff; border-radius:5px; background-position:top center; background-repeat:no-repeat; background-size:100% 170px;}
.mbox .swiper-container .swiper-slide.c01{ background-image:url(../images/pg01.jpg);}
.mbox .swiper-container .swiper-slide.c02{ background-image:url(../images/pg02.jpg);}
.mbox .swiper-container .swiper-slide.c03{ background-image:url(../images/pg03.jpg);}
.mbox .swiper-container .swiper-slide.c04{ background-image:url(../images/pg04.jpg);}
.mbox .swiper-container .swiper-slide a{ display:block; padding:15px; padding-bottom:25px; overflow:hidden;}
.mbox .swiper-container .swiper-slide .w01{ font-size:16px; line-height:24px; height:24px; color:#fff; text-overflow:ellipsis; white-space:nowrap; font-weight:bold;}
.mbox .swiper-container .swiper-slide .w02{ font-size:18px; line-height:26px; height:52px; color:#eee; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2; margin-top:6px;}
.mbox .swiper-container .swiper-slide .w03{ width:100%; height:190px; display:flex; align-items:center; margin-top:15px;}
.mbox .swiper-container .swiper-slide .w03 img{ max-width:100%; max-height:190px; display:block; margin:auto;}
.mbox .swiper-container .swiper-slide .w04{ width:100%; height:40px; border:1px solid #cacaca; box-sizing:border-box; margin-top:20px; display:flex; align-items:center; justify-content:center; border-radius:5px;}
.mbox .swiper-container .swiper-slide .w04 img{ display:block;}
.mbox .swiper-container .swiper-slide .w04 p{ display:block; margin-left:10px; font-size:16px; line-height:26px;}
.mbox .swiper-container .swiper-slide a:hover .w04{ border:1px solid #dd3333;}
.mbox .swiper-container .swiper-slide a:hover .w04 p{ color:#dd3333;}
.mbox .swi{ width:260px; height:40px; margin:auto; margin-top:25px;}
.mbox .swi .button{ width:40px; height:40px; border-radius:100%; background-color:#333; overflow:hidden; float:left;}
.mbox .swi .button img{ width:100%; display:block;}
.mbox .swi .more{ width:160px; height:40px; border-radius:40px; background-color:#333; float:left; margin:0 10px;}
.mbox .swi .more a{ width:100%; display:block; color:#fff; text-align:center; font-size:16px; height:40px; line-height:40px;}
.mbox .swi .more:hover,.mbox .swi .button:hover{ background-color:#dd3333;}
}
@media only screen and (max-width: 767px){
.mbox{ padding-top:25px; position:relative; z-index:1; background-color:#f1f1f1;}
.mbox .title{ width:94%; margin:auto; text-align:center;}
.mbox .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.mbox .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.mbox .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.mbox .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.mbox .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.mbox .box{ width:94%; margin:auto; margin-top:20px;}
.mbox .swiper-container{ width:100%;}
.mbox .swiper-container .swiper-slide{ width:285px; background-color:#fff; border-radius:5px; background-position:top center; background-repeat:no-repeat; background-size:100% 170px;}
.mbox .swiper-container .swiper-slide.c01{ background-image:url(../images/pg01.jpg);}
.mbox .swiper-container .swiper-slide.c02{ background-image:url(../images/pg02.jpg);}
.mbox .swiper-container .swiper-slide.c03{ background-image:url(../images/pg03.jpg);}
.mbox .swiper-container .swiper-slide.c04{ background-image:url(../images/pg04.jpg);}
.mbox .swiper-container .swiper-slide a{ display:block; padding:15px; padding-bottom:20px; overflow:hidden;}
.mbox .swiper-container .swiper-slide .w01{ font-size:14px; line-height:24px; height:24px; color:#fff; text-overflow:ellipsis; white-space:nowrap; font-weight:bold;}
.mbox .swiper-container .swiper-slide .w02{ font-size:16px; line-height:24px; height:48px; color:#eee; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2; margin-top:6px;}
.mbox .swiper-container .swiper-slide .w03{ width:100%; height:190px; display:flex; align-items:center; margin-top:10px;}
.mbox .swiper-container .swiper-slide .w03 img{ max-width:100%; max-height:190px; display:block; margin:auto;}
.mbox .swiper-container .swiper-slide .w04{ width:100%; height:40px; border:1px solid #cacaca; box-sizing:border-box; margin-top:15px; display:flex; align-items:center; justify-content:center; border-radius:5px;}
.mbox .swiper-container .swiper-slide .w04 img{ display:block;}
.mbox .swiper-container .swiper-slide .w04 p{ display:block; margin-left:10px; font-size:14px; line-height:24px;}
.mbox .swiper-container .swiper-slide a:hover .w04{ border:1px solid #dd3333;}
.mbox .swiper-container .swiper-slide a:hover .w04 p{ color:#dd3333;}
.mbox .swi{ width:220px; height:34px; margin:auto; margin-top:15px;}
.mbox .swi .button{ width:34px; height:34px; border-radius:100%; background-color:#333; overflow:hidden; float:left;}
.mbox .swi .button img{ width:100%; display:block;}
.mbox .swi .more{ width:140px; height:34px; border-radius:34px; background-color:#333; float:left; margin:0 6px;}
.mbox .swi .more a{ width:100%; display:block; color:#fff; text-align:center; font-size:14px; height:34px; line-height:34px;}
.mbox .swi .more:hover,.mbox .swi .button:hover{ background-color:#dd3333;}
}

/*customization*/
@media screen and (min-width:1280px){
.cbox{ padding-top:60px; position:relative; z-index:1; background-color:#f1f1f1;}
.cbox .title{ width:1200px; margin:auto; text-align:center;}
.cbox .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.cbox .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.cbox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.cbox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.cbox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.cbox .box{ width:100%; margin:auto; margin-top:30px;}
.cbox .box .c01{ width:50%; float:left; height:360px; background-position:center; background-repeat:no-repeat; background-size:cover; float:left;}
.cbox .box .c01 a{ width:100%; height:100%; display:flex; align-items:center; background-color:rgba(0,0,0,.5); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.cbox .box .c01 .wen{ width:90%; max-width:430px; text-align:center; margin:auto;}
.cbox .box .c01 .wen .w01{ font-size:20px; line-height:30px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.cbox .box .c01 .wen .w02{ width:50px; height:2px; margin:15px auto; margin-bottom:25px; background-color:#fff;}
.cbox .box .c01 .wen .w03{ font-size:14px; line-height:24px; max-height:72px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:3;}
.cbox .box .c01 .wen .w04{ width:160px; margin:35px auto; margin-bottom:5px; border-radius:40px; background-color:#dd3333; color:#fff; text-align:center; font-size:14px; height:40px; line-height:40px; text-transform:uppercase;}
.cbox .box .c01 a:hover{ opacity:0;}
.cbox .box .c02{ width:50%; float:left; height:360px; float:left;}
.cbox .box .c02 .right{ width:50%; height:100%; float:left; display:flex; align-items:center; background-color:#dd3333;}
.cbox .box .c02 .wen{ width:90%; max-width:380px; text-align:center; margin:auto;}
.cbox .box .c02 .wen .w01{ font-size:20px; line-height:30px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.cbox .box .c02 .wen .w02{ width:50px; height:2px; margin:15px auto; margin-bottom:25px; background-color:#fff;}
.cbox .box .c02 .wen .w03{ font-size:14px; line-height:24px; max-height:120px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:5;}
.cbox .box .c02 .left{ width:50%; height:100%; float:left; display:block; position:relative;}
.cbox .box .c02 .left p{ width:100%; height:100%; display:block; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s; overflow:hidden;}
.cbox .box .c02 .left img{ width:5%; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.cbox .box .c02:hover .left p{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
.cbox .box .c03{ width:50%; float:left; height:360px; float:left;}
.cbox .box .c03 .right{ width:50%; height:100%; float:left; display:flex; align-items:center; background-color:#dd3333;}
.cbox .box .c03 .wen{ width:90%; max-width:380px; text-align:center; margin:auto;}
.cbox .box .c03 .wen .w01{ font-size:20px; line-height:30px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.cbox .box .c03 .wen .w02{ width:50px; height:2px; margin:15px auto; margin-bottom:25px; background-color:#fff;}
.cbox .box .c03 .wen .w03{ font-size:14px; line-height:24px; max-height:120px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:5;}
.cbox .box .c03 .left{ width:50%; height:100%; float:left; display:block; position:relative;}
.cbox .box .c03 .left p{ width:100%; height:100%; display:block; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s; overflow:hidden;}
.cbox .box .c03 .left img{ width:5%; display:block; position:absolute; right:0; top:50%; transform:translateY(-50%);}
.cbox .box .c03:hover .left p{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.cbox{ padding-top:45px; position:relative; z-index:1; background-color:#f1f1f1;}
.cbox .title{ width:94%; margin:auto; text-align:center;}
.cbox .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.cbox .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.cbox .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.cbox .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.cbox .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.cbox .box{ width:100%; margin:auto; margin-top:25px;}
.cbox .box .c01{ width:50%; float:left; height:300px; background-position:center; background-repeat:no-repeat; background-size:cover; float:left;}
.cbox .box .c01 a{ width:100%; height:100%; display:flex; align-items:center; background-color:rgba(0,0,0,.5); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.cbox .box .c01 .wen{ width:88%; max-width:430px; text-align:center; margin:auto;}
.cbox .box .c01 .wen .w01{ font-size:20px; line-height:30px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.cbox .box .c01 .wen .w02{ width:50px; height:2px; margin:10px auto; margin-bottom:15px; background-color:#fff;}
.cbox .box .c01 .wen .w03{ font-size:14px; line-height:24px; max-height:72px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:3;}
.cbox .box .c01 .wen .w04{ width:160px; margin:20px auto; margin-bottom:5px; border-radius:40px; background-color:#dd3333; color:#fff; text-align:center; font-size:14px; height:40px; line-height:40px; text-transform:uppercase;}
.cbox .box .c01 a:hover{ opacity:0;}
.cbox .box .c02{ width:50%; float:left; height:300px; float:left;}
.cbox .box .c02 .right{ width:50%; height:100%; float:left; display:flex; align-items:center; background-color:#dd3333;}
.cbox .box .c02 .wen{ width:88%; max-width:380px; text-align:center; margin:auto;}
.cbox .box .c02 .wen .w01{ font-size:20px; line-height:30px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.cbox .box .c02 .wen .w02{ width:50px; height:2px; margin:10px auto; margin-bottom:15px; background-color:#fff;}
.cbox .box .c02 .wen .w03{ font-size:14px; line-height:24px; max-height:144px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:6;}
.cbox .box .c02 .left{ width:50%; height:100%; float:left; display:block; position:relative;}
.cbox .box .c02 .left p{ width:100%; height:100%; display:block; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s; overflow:hidden;}
.cbox .box .c02 .left img{ width:5%; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.cbox .box .c02:hover .left p{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
.cbox .box .c03{ width:50%; float:left; height:300px; float:left;}
.cbox .box .c03 .right{ width:50%; height:100%; float:left; display:flex; align-items:center; background-color:#dd3333;}
.cbox .box .c03 .wen{ width:88%; max-width:380px; text-align:center; margin:auto;}
.cbox .box .c03 .wen .w01{ font-size:20px; line-height:30px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.cbox .box .c03 .wen .w02{ width:50px; height:2px; margin:10px auto; margin-bottom:15px; background-color:#fff;}
.cbox .box .c03 .wen .w03{ font-size:14px; line-height:24px; max-height:144px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:6;}
.cbox .box .c03 .left{ width:50%; height:100%; float:left; display:block; position:relative;}
.cbox .box .c03 .left p{ width:100%; height:100%; display:block; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s; overflow:hidden;}
.cbox .box .c03 .left img{ width:5%; display:block; position:absolute; right:0; top:50%; transform:translateY(-50%);}
.cbox .box .c03:hover .left p{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
}
@media only screen and (max-width: 767px){
.cbox{ padding-top:25px; position:relative; z-index:1; background-color:#f1f1f1;}
.cbox .title{ width:94%; margin:auto; text-align:center;}
.cbox .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.cbox .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.cbox .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.cbox .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.cbox .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.cbox .box{ width:100%; margin:auto; margin-top:20px;}
.cbox .box .c01{ width:100%; float:left; height:260px; background-position:center; background-repeat:no-repeat; background-size:cover; float:left;}
.cbox .box .c01 a{ width:100%; height:100%; display:flex; align-items:center; background-color:rgba(0,0,0,.5); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.cbox .box .c01 .wen{ width:94%; max-width:430px; text-align:center; margin:auto;}
.cbox .box .c01 .wen .w01{ font-size:18px; line-height:28px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.cbox .box .c01 .wen .w02{ width:50px; height:2px; margin:5px auto; margin-bottom:10px; background-color:#fff;}
.cbox .box .c01 .wen .w03{ font-size:14px; line-height:24px; max-height:72px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:3;}
.cbox .box .c01 .wen .w04{ width:140px; margin:15px auto; margin-bottom:5px; border-radius:34px; background-color:#dd3333; color:#fff; text-align:center; font-size:14px; height:34px; line-height:34px; text-transform:uppercase;}
.cbox .box .c01 a:hover{ opacity:0;}
.cbox .box .c02{ width:100%; float:left; height:260px; float:left;}
.cbox .box .c02 .right{ width:50%; height:100%; float:left; display:flex; align-items:center; background-color:#dd3333;}
.cbox .box .c02 .wen{ width:94%; max-width:430px; text-align:center; margin:auto;}
.cbox .box .c02 .wen .w01{ font-size:18px; line-height:28px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.cbox .box .c02 .wen .w02{ width:50px; height:2px; margin:5px auto; margin-bottom:10px; background-color:#fff;}
.cbox .box .c02 .wen .w03{ font-size:14px; line-height:24px; max-height:144px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:6;}
.cbox .box .c02 .left{ width:50%; height:100%; float:left; display:block; position:relative;}
.cbox .box .c02 .left p{ width:100%; height:100%; display:block; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s; overflow:hidden;}
.cbox .box .c02 .left img{ width:5%; display:block; position:absolute; left:0; top:50%; transform:translateY(-50%);}
.cbox .box .c02:hover .left p{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
.cbox .box .c03{ width:100%; float:left; height:260px; float:left;}
.cbox .box .c03 .right{ width:50%; height:100%; float:left; display:flex; align-items:center; background-color:#dd3333;}
.cbox .box .c03 .wen{ width:94%; max-width:430px; text-align:center; margin:auto;}
.cbox .box .c03 .wen .w01{ font-size:18px; line-height:28px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.cbox .box .c03 .wen .w02{ width:50px; height:2px; margin:5px auto; margin-bottom:10px; background-color:#fff;}
.cbox .box .c03 .wen .w03{ font-size:14px; line-height:24px; max-height:144px; color:#fff; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:6;}
.cbox .box .c03 .left{ width:50%; height:100%; float:left; display:block; position:relative;}
.cbox .box .c03 .left p{ width:100%; height:100%; display:block; background-position:center; background-repeat:no-repeat; background-size:cover; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s; overflow:hidden;}
.cbox .box .c03 .left img{ width:5%; display:block; position:absolute; right:0; top:50%; transform:translateY(-50%);}
.cbox .box .c03:hover .left p{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
}

/*Looking For A Wholesale Water Bottle Supplier ?*/
@media screen and (min-width:1280px){
.lbox{ width:100%; padding:70px 0; position:relative; z-index:1; background-color:#fff;}
.lbox .box{ width:1200px; margin:auto; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,.3); padding:70px; padding-top:65px; box-sizing:border-box;}
.lbox .box .title{ text-align:center; padding-bottom:28px;}
.lbox .box .title b{ font-size:30px; line-height:48px; display:block;}
.lbox .box .title strong{ font-size:16px; line-height:34px; display:block; color:#dd3333;}
.lbox .box .inp{ width:100%; margin-top:20px;}
.lbox .box .inp .t01{ font-size:16px; line-height:36px; height:36px; font-weight:bold;}
.lbox .box .inp .t01 a{ color:#dd3333;}
.lbox .box .inp .t02{ width:100%; height:34px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lbox .box .inp .t02 input{ width:100%; padding:0 14px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lbox .box .inp .t02 select{ width:100%; padding:0 14px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lbox .box .inp .t02 img{ position:absolute; right:10px; top:50%; margin-top:-4px; height:8px;}
.lbox .box .inp .t03{ width:100%; height:84px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lbox .box .inp .t03 textarea{ padding:4px 14px; line-height:24px; width:100%; height:100%; box-sizing:border-box; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lbox .box .but{ width:160px; height:40px; margin-top:30px; display:flex; align-items:center; justify-content:center; border-radius:40px; position:relative; background:linear-gradient(to right,#dd3333,#ff3333);}
.lbox .box .but img{ display:block;}
.lbox .box .but b{ display:block; margin-left:10px; font-size:16px; line-height:26px; color:#fff;}
.lbox .box .but input{ width:100%; height:100%; display:block; opacity:0; position:absolute; left:0; top:0; cursor:pointer;}
.lbox .box .but:hover{ background:#dd3333;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.lbox{ width:100%; padding:50px 0; position:relative; z-index:1; background-color:#fff;}
.lbox .box{ width:94%; margin:auto; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,.3); padding:50px; padding-top:45px; box-sizing:border-box;}
.lbox .box .title{ text-align:center;}
.lbox .box .title b{ font-size:24px; line-height:34px; display:block;}
.lbox .box .title strong{ font-size:14px; line-height:30px; display:block; color:#dd3333;}
.lbox .box .inp{ width:100%; margin-top:15px;}
.lbox .box .inp .t01{ font-size:16px; line-height:36px; height:36px; font-weight:bold;}
.lbox .box .inp .t01 a{ color:#dd3333;}
.lbox .box .inp .t02{ width:100%; height:34px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lbox .box .inp .t02 input{ width:100%; padding:0 14px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lbox .box .inp .t02 select{ width:100%; padding:0 14px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lbox .box .inp .t02 img{ position:absolute; right:10px; top:50%; margin-top:-4px; height:8px;}
.lbox .box .inp .t03{ width:100%; height:84px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lbox .box .inp .t03 textarea{ padding:4px 14px; line-height:24px; width:100%; height:100%; box-sizing:border-box; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lbox .box .but{ width:160px; height:40px; margin-top:25px; display:flex; align-items:center; justify-content:center; border-radius:40px; position:relative; background:linear-gradient(to right,#dd3333,#ff3333);}
.lbox .box .but img{ display:block;}
.lbox .box .but b{ display:block; margin-left:10px; font-size:16px; line-height:26px; color:#fff;}
.lbox .box .but input{ width:100%; height:100%; display:block; opacity:0; position:absolute; left:0; top:0; cursor:pointer;}
.lbox .box .but:hover{ background:#dd3333;}
}
@media only screen and (max-width: 767px){
.lbox{ width:100%; padding:30px 0; position:relative; z-index:1; background-color:#fff;}
.lbox .box{ width:94%; margin:auto; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,.3); padding:30px 15px; padding-top:25px; box-sizing:border-box;}
.lbox .box .title{ text-align:center;}
.lbox .box .title b{ font-size:20px; line-height:30px; display:block;}
.lbox .box .title strong{ font-size:14px; line-height:24px; display:block; color:#dd3333;}
.lbox .box .inp{ width:100%; margin-top:10px;}
.lbox .box .inp .t01{ font-size:14px; line-height:30px; height:30px; font-weight:bold;}
.lbox .box .inp .t01 a{ color:#dd3333;}
.lbox .box .inp .t02{ width:100%; height:34px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lbox .box .inp .t02 input{ width:100%; padding:0 9px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lbox .box .inp .t02 select{ width:100%; padding:0 9px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lbox .box .inp .t02 img{ position:absolute; right:10px; top:50%; margin-top:-3px; height:6px;}
.lbox .box .inp .t03{ width:100%; height:84px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lbox .box .inp .t03 textarea{ padding:4px 9px; line-height:24px; width:100%; height:100%; box-sizing:border-box; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lbox .box .but{ width:120px; height:34px; margin-top:20px; display:flex; align-items:center; justify-content:center; border-radius:34px; position:relative; background:linear-gradient(to right,#dd3333,#ff3333);}
.lbox .box .but img{ display:block;}
.lbox .box .but b{ display:block; margin-left:5px; font-size:14px; line-height:24px; color:#fff;}
.lbox .box .but input{ width:100%; height:100%; display:block; opacity:0; position:absolute; left:0; top:0; cursor:pointer;}
.lbox .box .but:hover{ background:#dd3333;}
}

/*footer*/
@media screen and (min-width:1280px){
.footer{ width:100%; background-color:#000;}
.footer .foot{ width:1200px; margin:15px auto; margin-top:40px;}
.footer .foot .left{ width:340px; float:left; margin-right:60px;}
.footer .foot .left .f01{ margin-top:10px;}
.footer .foot .left .f01 img{ max-width:100%; display:block;}
.footer .foot .left .f02{ margin-top:22px; font-size:14px; line-height:18px; color:#fff;}
.footer .foot .left .f03{ margin-top:13px;}
.footer .foot .left .f03 input{ width:240px; padding:0 14px; box-sizing:border-box; border:1px solid #fff; height:34px; line-height:32px; font-size:14px; color:#fff; margin-bottom:10px; display:block; background-color:transparent;}
.footer .foot .left .f03 textarea{ width:240px; padding:4px 14px; box-sizing:border-box; border:1px solid #fff; height:74px; line-height:24px; font-size:14px; color:#fff; margin-bottom:10px; display:block; background-color:transparent;}
.footer .foot .left .f04{ width:100%;}
.footer .foot .left .f04 input{ width:240px; height:34px; line-height:34px; display:block; cursor:pointer; text-align:center; background-color:#fff; border-radius:34px; font-size:14px; font-weight:bold; overflow:hidden;}
.footer .foot .left .f04 input:hover{ color:#dd3333;}
.footer .foot .left .f04 p{ display:block; font-size:14px; line-height:34px; color:#fff;}
.footer .foot .mil{ width:220px; float:left;}
.footer .foot .mil b{ display:block; font-size:20px; line-height:40px; color:#fff;}
.footer .foot .mil b a{ color:#fff; text-decoration:underline; font-weight:bold; display:block;}
.footer .foot .mil p{ display:block; margin-top:11px;}
.footer .foot .mil p a{ display:block; font-size:16px; line-height:34px; height:34px; color:#fff; overflow:hidden;}
.footer .foot .mil p a:hover{ color:#dd3333;}
.footer .foot .right{ width:360px; float:right;}
.footer .foot .right b{ display:block; font-size:20px; line-height:40px; color:#fff; padding-bottom:16px;}
.footer .foot .right b a{ color:#fff; text-decoration:underline; font-weight:bold; display:block;}
.footer .foot .right p{ display:block; margin-bottom:22px; padding-left:30px; background-position:left center; background-repeat:no-repeat; overflow:hidden; font-size:16px; line-height:24px; color:#fff;}
.footer .foot .right p strong{ font-size:16px;}
.footer .foot .right span{ display:block; margin-left:-15px; overflow:hidden;}
.footer .foot .right span a{ height:24px; display:block; float:left; margin-top:4px; margin-left:15px;}
.footer .foot .right span a img{ display:block; height:24px;}
.footer .bq{ width:100%; border-top:1px solid #fff;}
.footer .bq p{ width:1200px; display:block; margin:auto; font-size:14px; line-height:52px; height:52px; color:#fff; text-align:center;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.footer{ width:100%; background-color:#000;}
.footer .foot{ width:94%; margin:15px auto; margin-top:30px;}
.footer .foot .left{ width:28.33%; float:left;}
.footer .foot .left .f01{ margin-top:5px;}
.footer .foot .left .f01 img{ max-width:100%; display:block;}
.footer .foot .left .f02{ margin-top:15px; font-size:14px; line-height:18px; color:#fff;}
.footer .foot .left .f03{ margin-top:10px;}
.footer .foot .left .f03 input{ width:100%; padding:0 14px; box-sizing:border-box; border:1px solid #fff; height:34px; line-height:32px; font-size:14px; color:#fff; margin-bottom:10px; display:block; background-color:transparent;}
.footer .foot .left .f03 textarea{ width:100%; padding:4px 14px; box-sizing:border-box; border:1px solid #fff; height:74px; line-height:24px; font-size:14px; color:#fff; margin-bottom:10px; display:block; background-color:transparent;}
.footer .foot .left .f04{ width:100%;}
.footer .foot .left .f04 input{ width:100%; height:34px; line-height:34px; display:block; cursor:pointer; text-align:center; background-color:#fff; border-radius:34px; font-size:14px; font-weight:bold; overflow:hidden;}
.footer .foot .left .f04 input:hover{ color:#dd3333;}
.footer .foot .left .f04 p{ display:block; font-size:14px; line-height:34px; color:#fff;}
.footer .foot .mil{ width:18.33%; float:left; margin-left:3%;}
.footer .foot .mil b{ display:block; font-size:18px; line-height:28px; color:#fff;}
.footer .foot .mil b a{ color:#fff; text-decoration:underline; font-weight:bold; display:block;}
.footer .foot .mil p{ display:block; margin-top:10px;}
.footer .foot .mil p a{ display:block; font-size:16px; line-height:30px; height:30px; color:#fff; overflow:hidden;}
.footer .foot .mil p a:hover{ color:#dd3333;}
.footer .foot .right{ width:26%; float:right;}
.footer .foot .right b{ display:block; font-size:18px; line-height:28px; color:#fff; padding-bottom:12px;}
.footer .foot .right b a{ color:#fff; text-decoration:underline; font-weight:bold; display:block;}
.footer .foot .right p{ display:block; margin-bottom:10px; padding-left:30px; background-position:left center; background-repeat:no-repeat; overflow:hidden; font-size:16px; line-height:24px; color:#fff;}
.footer .foot .right p strong{ font-size:16px;}
.footer .foot .right span{ display:block; margin-left:-10px; overflow:hidden;}
.footer .foot .right span a{ height:24px; display:block; float:left; margin-top:4px; margin-left:10px;}
.footer .foot .right span a img{ display:block; height:24px;}
.footer .bq{ width:100%; border-top:1px solid #fff;}
.footer .bq p{ width:94%; display:block; margin:auto; font-size:14px; line-height:46px; height:46px; color:#fff; text-align:center;}
}
@media only screen and (max-width: 767px){
.footer{ width:100%; background-color:#000;}
.footer .foot{ width:94%; margin:20px auto;}
.footer .foot .left{ width:100%; float:left;}
.footer .foot .left .f01{ width:100%;}
.footer .foot .left .f01 img{ max-width:100%; display:block;}
.footer .foot .left .f02{ margin-top:15px; font-size:14px; line-height:18px; color:#fff;}
.footer .foot .left .f03{ margin-top:10px;}
.footer .foot .left .f03 input{ width:100%; padding:0 14px; box-sizing:border-box; border:1px solid #fff; height:34px; line-height:32px; font-size:14px; color:#fff; margin-bottom:10px; display:block; background-color:transparent;}
.footer .foot .left .f03 textarea{ width:100%; padding:4px 14px; box-sizing:border-box; border:1px solid #fff; height:74px; line-height:24px; font-size:14px; color:#fff; margin-bottom:10px; display:block; background-color:transparent;}
.footer .foot .left .f04{ width:100%;}
.footer .foot .left .f04 input{ width:100%; height:34px; line-height:34px; display:block; cursor:pointer; text-align:center; background-color:#fff; border-radius:34px; font-size:14px; font-weight:bold; overflow:hidden;}
.footer .foot .left .f04 input:hover{ color:#dd3333;}
.footer .foot .left .f04 p{ display:block; font-size:14px; line-height:34px; color:#fff;}
.footer .foot .mil{ width:48.5%; float:left; margin-left:3%;}
.footer .foot .mil:nth-child(2){ margin-left:0;}
.footer .foot .mil b{ display:block; font-size:16px; line-height:26px; color:#fff;}
.footer .foot .mil b a{ color:#fff; text-decoration:underline; font-weight:bold; display:block;}
.footer .foot .mil p{ display:block; margin-top:5px;}
.footer .foot .mil p a{ display:block; font-size:14px; line-height:24px; height:24px; color:#fff; overflow:hidden;}
.footer .foot .mil p a:hover{ color:#dd3333;}
.footer .foot .right{ width:100%; float:right; margin-top:10px;}
.footer .foot .right b{ display:block; font-size:16px; line-height:26px; color:#fff;}
.footer .foot .right b a{ color:#fff; text-decoration:underline; font-weight:bold; display:block;}
.footer .foot .right p{ display:block; margin-top:5px; padding-left:25px; background-position:left center; background-repeat:no-repeat; overflow:hidden; font-size:14px; line-height:24px; color:#fff;}
.footer .foot .right p strong{ font-size:16px;}
.footer .foot .right span{ display:block; margin-left:-10px; overflow:hidden; padding-top:5px;}
.footer .foot .right span a{ height:24px; display:block; float:left; margin-top:5px; margin-left:10px;}
.footer .foot .right span a img{ display:block; height:24px;}
.footer .bq{ width:100%; border-top:1px solid #fff;}
.footer .bq p{ width:94%; display:block; padding:8px 3%; font-size:14px; line-height:18px; color:#fff; text-align:center;}
}

@media screen and (min-width:1280px){
#gotop{ width:40px; height:40px; display:block; cursor:pointer; background-color:rgba(221,51,51,0.7); border-radius:5px; position:fixed; right:3%; bottom:5%; z-index:99; overflow:hidden;}
#gotop img{ width:100%; display:block;}
}
@media screen and (min-width:768px) and (max-width:1279px){
#gotop{ width:40px; height:40px; display:block; cursor:pointer; background-color:rgba(221,51,51,0.7); border-radius:5px; position:fixed; right:3%; bottom:70px; z-index:99; overflow:hidden;}
#gotop img{ width:100%; display:block;}
}
@media only screen and (max-width:767px){
#gotop{ width:30px; height:30px; display:block; cursor:pointer; background-color:rgba(221,51,51,0.7); border-radius:5px; position:fixed; right:3%; bottom:70px; z-index:99; overflow:hidden;}
#gotop img{ width:100%; display:block;}
}

/*内页*/
@media screen and (min-width:1280px){
.ban{ width:100%; height:350px; position:relative; z-index:1; background-position:center; background-repeat:no-repeat; background-size:cover;}
.ban a{ width:100%; height:100%; display:flex; align-items:center; background-color:rgba(0,0,0,.5);}
.ban a b{ font-size:70px; width:1200px; margin:auto; text-align:center; color:#fff;}
}
@media screen and (min-width: 769px) and (max-width: 1279px){
.ban{ width:100%; height:250px; position:relative; z-index:1; background-position:center; background-repeat:no-repeat; background-size:cover;}
.ban a{ width:100%; height:100%; display:flex; align-items:center; background-color:rgba(0,0,0,.5);}
.ban a b{ font-size:50px; width:94%; margin:auto; text-align:center; color:#fff;}
}
@media screen and (min-width: 769px) and (max-width: 1023px){
.ban{ margin-top:60px;}
}
@media only screen and (max-width: 768px){
.ban{ width:100%; height:150px; position:relative; z-index:1; margin-top:60px; background-position:center; background-repeat:no-repeat; background-size:cover;}
.ban a{ width:100%; height:100%; display:flex; align-items:center; background-color:rgba(0,0,0,.5);}
.ban a b{ font-size:30px; width:94%; margin:auto; text-align:center; color:#fff;}
}

/*about*/
@media screen and (min-width:1280px){
.ab01{ padding-top:60px; padding-bottom:70px; position:relative; z-index:1; background-color:#fff;}
.ab01 .title{ width:1200px; margin:auto; text-align:center;}
.ab01 .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.ab01 .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.ab01 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.ab01 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ab01 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.ab01 .box{ width:100%;}
.ab01 .box .news{ width:1200px; margin:auto; padding-top:5px; display:block;}
.ab01 .box .news li{ width:285px; display:block; float:left; margin-left:20px; margin-top:25px; overflow:hidden;}
.ab01 .box .news li:nth-child(4n+1){ clear:left; float:left; margin-left:0;}
.ab01 .box .news li .tu{ width:100%; height:210px;}
.ab01 .box .news li .tu img{ width:100%; display:block;}
.ab01 .box .news li .bt{ font-size:18px; line-height:24px; max-height:48px; font-weight:bold; margin-top:10px; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.ab01 .box .news li .wen{ font-size:14px; line-height:20px; max-height:80px; margin-top:2px; color:#666; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:4;}
.ab01 .box .news li .duo{ font-size:14px; line-height:20px; height:20px; color:#dd3333; margin-top:5px;}
.ab01 .box .news li:hover .bt{ color:#dd3333;}
.ab01 .box .more{ width:160px; height:40px; margin:auto; margin-top:25px;}
.ab01 .box .more a{ width:100%; display:block; overflow:hidden; color:#fff; font-size:14px; text-transform:uppercase; text-align:center; height:40px; line-height:40px; border-radius:40px; background:linear-gradient(to right,#dd3333,#ff3333); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ab01 .box .more a:hover{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.ab01{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-color:#fff;}
.ab01 .title{ width:94%; margin:auto; text-align:center;}
.ab01 .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.ab01 .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.ab01 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.ab01 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ab01 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.ab01 .box{ width:100%;}
.ab01 .box .news{ width:94%; margin:auto; padding-top:5px; display:block;}
.ab01 .box .news li{ width:32%; display:block; float:left; margin-left:2%; margin-top:20px; overflow:hidden;}
.ab01 .box .news li:nth-child(3n+1){ clear:left; float:left; margin-left:0;}
.ab01 .box .news li .tu{ width:100%; height:22.16vw;}
.ab01 .box .news li .tu img{ width:100%; display:block;}
.ab01 .box .news li .bt{ font-size:18px; line-height:24px; max-height:48px; font-weight:bold; margin-top:10px; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.ab01 .box .news li .wen{ font-size:14px; line-height:20px; max-height:80px; margin-top:2px; color:#666; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:4;}
.ab01 .box .news li .duo{ font-size:14px; line-height:20px; height:20px; color:#dd3333; margin-top:5px;}
.ab01 .box .news li:hover .bt{ color:#dd3333;}
.ab01 .box .more{ width:160px; height:40px; margin:auto; margin-top:20px;}
.ab01 .box .more a{ width:100%; display:block; overflow:hidden; color:#fff; font-size:14px; text-transform:uppercase; text-align:center; height:40px; line-height:40px; border-radius:40px; background:linear-gradient(to right,#dd3333,#ff3333); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ab01 .box .more a:hover{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
}
@media only screen and (max-width: 767px){
.ab01{ padding-top:25px; padding-bottom:30px; position:relative; z-index:1; background-color:#fff;}
.ab01 .title{ width:94%; margin:auto; text-align:center;}
.ab01 .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.ab01 .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.ab01 .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.ab01 .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ab01 .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.ab01 .box{ width:100%;}
.ab01 .box .news{ width:94%; margin:auto; padding-top:5px; display:block;}
.ab01 .box .news li{ width:48.5%; display:block; float:left; margin-left:3%; margin-top:15px; overflow:hidden;}
.ab01 .box .news li:nth-child(2n+1){ clear:left; float:left; margin-left:0;}
.ab01 .box .news li .tu{ width:100%; height:33.59vw;}
.ab01 .box .news li .tu img{ width:100%; display:block;}
.ab01 .box .news li .bt{ font-size:16px; line-height:22px; max-height:44px; font-weight:bold; margin-top:8px; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.ab01 .box .news li .wen{ font-size:14px; line-height:20px; max-height:80px; color:#666; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:4;}
.ab01 .box .news li .duo{ font-size:14px; line-height:20px; height:20px; color:#dd3333; margin-top:2px;}
.ab01 .box .news li:hover .bt{ color:#dd3333;}
.ab01 .box .more{ width:140px; height:40px; margin:auto; margin-top:15px;}
.ab01 .box .more a{ width:100%; display:block; overflow:hidden; color:#fff; font-size:14px; text-transform:uppercase; text-align:center; height:34px; line-height:34px; border-radius:40px; background:linear-gradient(to right,#dd3333,#ff3333); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ab01 .box .more a:hover{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
}

/*blog_son*/
@media screen and (min-width:1280px){
.ny{ width:100%; padding:70px 0; position:relative; background-color:#f1f1f1;}
.ny .box{ width:1200px; margin:auto;}
.ny .left{ width:67.48%; float:left;}
.ny .left .n01{ font-size:20px; line-height:30px; color:#dd3333;}
.ny .left .n02{ font-size:30px; line-height:40px; color:#333; margin-top:.2vw;}
.ny .left .n03{ width:140px; height:4px; display:block; margin-top:.5vw; background:linear-gradient(to right,#dd3333,#ff3333);}
.ny .left .n04{ font-size:16px; color:#333; margin-top:1.8vw;}
.ny .left .n04 img{ max-width:100%; height:auto; margin:5px 0;}
.ny .left .n04 iframe{ display:block; width:100%; height:460px; margin:5px 0;}
.ny .left .fy{ width:100%; padding-top:2.34vw;}
.ny .left .fy a{ display:flex; align-items:center; padding:.78125vw 1vw; border:1px solid #cacaca; border-radius:5px; width:calc(50% - 8px); box-sizing:border-box; float:left; overflow:hidden;}
.ny .left .fy a:nth-child(1){ margin-right:8px;}
.ny .left .fy a:nth-child(2){ margin-left:8px;}
.ny .left .fy a svg{ height:30px; display:block; color:#999;}
.ny .left .fy a p{ line-height:24px; font-size:14px; font-weight:400; display:block; color:#999; width:calc(100% - 24px);}
.ny .left .fy a span{ line-height:28px; height:28px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:18px; font-weight:500; display:block; color:#333;}
.ny .left .fy a:nth-child(1) p{ text-align:right;}
.ny .left .fy a:hover{ border:1px solid #dd3333;}
.ny .left .fy a:hover span,.ny .left .fy a:hover svg{ color:#dd3333;}
.ny .right{ width:21.95%; float:right; padding:1.5625vw 2.4%; border-radius:10px; background-color:#fff; background-image:url(../images/right_03.jpg); background-position:left bottom; background-repeat:no-repeat; background-size:100% auto;}
.ny .right .n01{ font-size:22px; line-height:32px; color:#dd3333;}
.ny .right .n02{ font-size:16px; line-height:26px; color:#333; margin-top:1vw;}
.ny .right .n03{ margin-top:2vw;}
.ny .right .n03 img{ display:block; float:left; width:40px; max-width:40px;}
.ny .right .n03 a{ display:block; float:left; margin-left:10px; font-size:16px; line-height:40px; height:40px; color:#dd3333;}
.ny .right .n03 a:hover{ font-weight:bold;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.ny{ width:100%; padding:50px 0; position:relative; background-color:#f1f1f1;}
.ny .box{ width:94%; margin:auto;}
.ny .left{ width:67.48%; float:left;}
.ny .left .n01{ font-size:16px; line-height:26px; color:#dd3333;}
.ny .left .n02{ font-size:26px; line-height:36px; color:#333; margin-top:.2vw;}
.ny .left .n03{ width:90px; height:3px; display:block; margin-top:.5vw; background:linear-gradient(to right,#dd3333,#ff3333);}
.ny .left .n04{ font-size:14px; color:#333; margin-top:1.8vw;}
.ny .left .n04 iframe{ display:block; width:100%; height:360px; margin:5px 0;}
.ny .left .n04 img{ max-width:100%; height:auto; margin:5px 0;}
.ny .left .fy{ width:100%; padding-top:2.34vw;}
.ny .left .fy a{ display:flex; align-items:center; padding:5px 15px; border:1px solid #cacaca; border-radius:5px; width:calc(50% - 8px); box-sizing:border-box; float:left; overflow:hidden;}
.ny .left .fy a:nth-child(1){ margin-right:8px;}
.ny .left .fy a:nth-child(2){ margin-left:8px;}
.ny .left .fy a svg{ height:30px; display:block; color:#999;}
.ny .left .fy a p{ line-height:24px; font-size:14px; font-weight:400; display:block; color:#999; width:calc(100% - 24px);}
.ny .left .fy a span{ line-height:28px; height:28px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:16px; font-weight:500; display:block; color:#333;}
.ny .left .fy a:nth-child(1) p{ text-align:right;}
.ny .left .fy a:hover{ border:1px solid #dd3333;}
.ny .left .fy a:hover span,.ny .left .fy a:hover svg{ color:#dd3333;}
.ny .right{ width:23.95%; float:right; padding:1.5625vw 2.4%; border-radius:10px; background-color:#fff; background-image:url(../images/right_03.jpg); background-position:left bottom; background-repeat:no-repeat; background-size:100% auto;}
.ny .right .n01{ font-size:18px; line-height:28px; color:#dd3333;}
.ny .right .n02{ font-size:14px; line-height:24px; color:#333; margin-top:1vw;}
.ny .right .n03{ margin-top:1vw;}
.ny .right .n03 img{ display:block; float:left; width:40px; max-width:40px;}
.ny .right .n03 a{ display:block; float:left; margin-left:10px; font-size:14px; line-height:40px; height:40px; color:#dd3333;}
.ny .right .n03 a:hover{ font-weight:bold;}
}
@media only screen and (max-width: 767px){
.ny{ width:100%; padding-top:20px; padding-bottom:30px; position:relative; background-color:#f1f1f1;}
.ny .box{ width:94%; margin:auto;}
.ny .left{ width:100%; float:left;}
.ny .left .n01{ font-size:14px; line-height:24px; color:#dd3333;}
.ny .left .n02{ font-size:18px; line-height:28px; color:#333;}
.ny .left .n03{ width:50px; height:2px; display:block; margin-top:1vw; background:linear-gradient(to right,#dd3333,#ff3333);}
.ny .left .n04{ font-size:14px; color:#333; margin-top:1.8vw;}
.ny .left .n04 iframe{ display:block; width:100%; height:260px; margin:5px 0;}
.ny .left .n04 img{ max-width:100%; height:auto; margin:5px 0;}
.ny .left .fy{ width:100%; padding-top:2.34vw;}
.ny .left .fy a{ display:flex; align-items:center; padding:5px 10px; border:1px solid #cacaca; border-radius:5px; width:calc(50% - 8px); box-sizing:border-box; float:left; overflow:hidden;}
.ny .left .fy a:nth-child(1){ margin-right:8px;}
.ny .left .fy a:nth-child(2){ margin-left:8px;}
.ny .left .fy a svg{ height:30px; display:block; color:#999;}
.ny .left .fy a p{ line-height:24px; font-size:14px; font-weight:400; display:block; color:#999; width:calc(100% - 24px);}
.ny .left .fy a span{ line-height:28px; height:28px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:16px; font-weight:500; display:block; color:#333;}
.ny .left .fy a:nth-child(1) p{ text-align:right;}
.ny .left .fy a:hover{ border:1px solid #dd3333;}
.ny .left .fy a:hover span,.ny .left .fy a:hover svg{ color:#dd3333;}
.ny .right{ width:100%; float:right; padding:15px; box-sizing:border-box; border-radius:10px; background-color:#fff; background-image:url(../images/right_03.jpg); background-position:left bottom; background-repeat:no-repeat; background-size:100% auto; margin-top:20px;}
.ny .right .n01{ font-size:20px; line-height:30px; color:#dd3333;}
.ny .right .n02{ font-size:14px; line-height:24px; color:#333; margin-top:5px;}
.ny .right .n03{ margin-top:10px;}
.ny .right .n03 img{ display:block; float:left; width:20px; max-width:20px;}
.ny .right .n03 a{ display:block; float:left; margin-left:5px; font-size:14px; line-height:20px; height:20px; color:#dd3333;}
.ny .right .n03 a:hover{ font-weight:bold;}
}

/*video*/
@media screen and (min-width:1280px){
.ab01 .box .video{ width:1200px; margin:auto; display:block; padding-bottom:5px;}
.ab01 .box .video li{ width:580px; height:360px; display:block; float:left; margin-left:40px; margin-top:30px; overflow:hidden; position:relative;}
.ab01 .box .video li:nth-child(2n+1){ clear:left; float:left; margin-left:0;}
.ab01 .box .video li img{ width:100%; display:block;}
.ab01 .box .video li .mask{ width:100%; height:100%; background:linear-gradient(to top,rgba(0,0,0,0.7),rgba(0,0,0,0)); position:absolute; left:0; top:0; z-index:2;}
.ab01 .box .video li .wen{ width:calc(100% - 40px); position:absolute; left:20px; bottom:20px; z-index:3; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ab01 .box .video li .wen .p02{ font-size:20px; font-weight:bold; line-height:30px; height:30px; text-overflow:ellipsis; white-space:nowrap; color:#fff;}
.ab01 .box .video li .wen .p03{ height:0; position:relative; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ab01 .box .video li .wen .p03 p{ display:block; font-size:14px; line-height:32px; height:32px; text-align:right; padding-right:10px; color:#fff; text-transform:uppercase;}
.ab01 .box .video li .wen .p03 span{ display:block; float:right; width:80px; height:1px; background-color:#fff; overflow:hidden;}
.ab01 .box .video li a:hover .wen{ bottom:30px;}
.ab01 .box .video li a:hover .wen .p03{ height:33px;}
.ab01 .box .video li a:hover .mask{ background:rgba(221,51,51,0.7);}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.ab01 .box .video{ width:94%; margin:auto; display:block; padding-bottom:5px;}
.ab01 .box .video li{ width:49%; height:28.58vw; display:block; float:left; margin-left:2%; margin-top:25px; overflow:hidden; position:relative;}
.ab01 .box .video li:nth-child(2n+1){ clear:left; float:left; margin-left:0;}
.ab01 .box .video li img{ width:100%; display:block;}
.ab01 .box .video li .mask{ width:100%; height:100%; background:linear-gradient(to top,rgba(0,0,0,0.7),rgba(0,0,0,0)); position:absolute; left:0; top:0; z-index:2;}
.ab01 .box .video li .wen{ width:calc(100% - 40px); position:absolute; left:20px; bottom:15px; z-index:3; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ab01 .box .video li .wen .p02{ font-size:18px; font-weight:bold; line-height:28px; height:28px; text-overflow:ellipsis; white-space:nowrap; color:#fff;}
.ab01 .box .video li .wen .p03{ height:0; position:relative; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ab01 .box .video li .wen .p03 p{ display:block; font-size:14px; line-height:30px; height:30px; text-align:right; padding-right:10px; color:#fff; text-transform:uppercase;}
.ab01 .box .video li .wen .p03 span{ display:block; float:right; width:70px; height:1px; background-color:#fff; overflow:hidden;}
.ab01 .box .video li:hover .wen{ bottom:20px;}
.ab01 .box .video li:hover .wen .p03{ height:31px;}
.ab01 .box .video li:hover .mask{ background:rgba(221,51,51,0.7);}
}
@media only screen and (max-width: 767px){
.ab01 .box .video{ width:94%; margin:auto; padding:5px 0; display:block;}
.ab01 .box .video li{ width:100%; height:58.34vw; display:block; float:left; margin-top:15px; overflow:hidden; position:relative;}
.ab01 .box .video li img{ width:100%; display:block;}
.ab01 .box .video li .mask{ width:100%; height:100%; background:linear-gradient(to top,rgba(0,0,0,0.7),rgba(0,0,0,0)); position:absolute; left:0; top:0; z-index:2;}
.ab01 .box .video li .wen{ width:calc(100% - 40px); position:absolute; left:20px; bottom:15px; z-index:3; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ab01 .box .video li .wen .p02{ font-size:16px; font-weight:bold; line-height:26px; height:26px; text-overflow:ellipsis; white-space:nowrap; color:#fff;}
.ab01 .box .video li .wen .p03{ height:0; position:relative; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.ab01 .box .video li .wen .p03 p{ display:block; font-size:14px; line-height:30px; height:30px; text-align:right; padding-right:10px; color:#fff; text-transform:uppercase;}
.ab01 .box .video li .wen .p03 span{ display:block; float:right; width:70px; height:1px; background-color:#fff; overflow:hidden;}
.ab01 .box .video li:hover .wen{ bottom:20px;}
.ab01 .box .video li:hover .wen .p03{ height:31px;}
.ab01 .box .video li:hover .mask{ background:rgba(221,51,51,0.7);}
}

@media screen and (min-width:1280px){
.ly{ padding-top:65px; padding-bottom:70px; position:relative; z-index:1; background-position:center; background-repeat:no-repeat; background-size:cover; background-attachment:fixed;}
.ly .mask{ width:100%; height:100%; position:absolute; left:0; top:0; background-color:#000; opacity:0.7; z-index:1;}
.ly .box{ width:1200px; margin:auto; position:relative; z-index:9; text-align:center;}
.ly .l01{ font-weight:bold; font-size:36px; height:46px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden; color:#fff;}
.ly .l02{ font-size:18px; line-height:28px; margin-top:20px; display:block; overflow:hidden; color:#fff;}
.ly .l03{ width:160px; height:40px; margin:auto; margin-top:30px; display:flex; align-items:center; justify-content:center; border-radius:40px; position:relative; background:linear-gradient(to right,#dd3333,#ff3333);}
.ly .l03 img{ display:block;}
.ly .l03 strong{ display:block; margin-left:10px; font-size:16px; line-height:26px; color:#fff;}
.ly .l03:hover{ background:#dd3333;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.ly{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-position:center; background-repeat:no-repeat; background-size:cover;}
.ly .mask{ width:100%; height:100%; position:absolute; left:0; top:0; background-color:#000; opacity:0.9; z-index:1;}
.ly .box{ width:94%; margin:auto; position:relative; z-index:9; text-align:center;}
.ly .l01{ font-weight:bold; font-size:28px; text-transform:uppercase; line-height:38px; display:block; overflow:hidden; color:#fff;}
.ly .l02{ font-size:16px; line-height:26px; margin-top:15px; display:block; overflow:hidden; color:#fff;}
.ly .l03{ width:160px; height:40px; margin:auto; margin-top:25px; display:flex; align-items:center; justify-content:center; border-radius:40px; position:relative; background:linear-gradient(to right,#dd3333,#ff3333);}
.ly .l03 img{ display:block;}
.ly .l03 strong{ display:block; margin-left:10px; font-size:16px; line-height:26px; color:#fff;}
.ly .l03:hover{ background:#dd3333;}
}
@media only screen and (max-width: 767px){
.ly{ padding-top:25px; padding-bottom:30px; position:relative; z-index:1; background-position:center; background-repeat:no-repeat; background-size:cover;}
.ly .mask{ width:100%; height:100%; position:absolute; left:0; top:0; background-color:#000; opacity:0.9; z-index:1;}
.ly .box{ width:94%; margin:auto; position:relative; z-index:9; text-align:center;}
.ly .l01{ font-weight:bold; font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden; color:#fff;}
.ly .l02{ font-size:14px; line-height:24px; margin-top:10px; display:block; overflow:hidden; color:#fff;}
.ly .l03{ width:140px; height:34px; margin:auto; margin-top:15px; display:flex; align-items:center; justify-content:center; border-radius:34px; position:relative; background:linear-gradient(to right,#dd3333,#ff3333);}
.ly .l03 img{ display:block;}
.ly .l03 strong{ display:block; margin-left:5px; font-size:14px; line-height:24px; color:#fff;}
.ly .l03:hover{ background:#dd3333;}
}

/*faq*/
@media screen and (min-width:1280px){
.faq{ width:1200px; margin:auto; display:block; padding-bottom:5px;}
.faq li{ display:block; padding:25px 0; border-bottom:1px solid #cacaca;}
.faq li .t01{ position:relative; padding-right:30px; font-size:20px; line-height:30px; font-weight:bold;}
.faq li .t01 span{ display:block; width:20px; position:absolute; right:0; top:50%; transform:translateY(-50%);}
.faq li .t01 span svg{ display:block; width:100%; transform:rotate(180deg); fill:#dd3333;}
.faq li .t01.cur span svg{ fill:#333; transform:rotate(0deg);}
.faq li .t02{ font-size:16px; line-height:26px; color:#666; display:none; margin-top:10px;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.faq{ width:94%; margin:auto; display:block; padding-bottom:5px;}
.faq li{ display:block; padding:20px 0; border-bottom:1px solid #cacaca;}
.faq li .t01{ position:relative; padding-right:25px; font-size:18px; line-height:28px; font-weight:bold;}
.faq li .t01 span{ display:block; width:15px; position:absolute; right:0; top:50%; transform:translateY(-50%);}
.faq li .t01 span svg{ display:block; width:100%; transform:rotate(180deg); fill:#dd3333;}
.faq li .t01.cur span svg{ fill:#333; transform:rotate(0deg);}
.faq li .t02{ font-size:16px; line-height:26px; color:#666; display:none; margin-top:5px;}
}
@media only screen and (max-width: 767px){
.faq{ width:94%; margin:auto; display:block; padding-top:5px;}
.faq li{ display:block; padding:15px 0; border-bottom:1px solid #cacaca;}
.faq li .t01{ position:relative; padding-right:20px; font-size:16px; line-height:26px; font-weight:bold;}
.faq li .t01 span{ display:block; width:10px; position:absolute; right:0; top:50%; transform:translateY(-50%);}
.faq li .t01 span svg{ display:block; width:100%; transform:rotate(180deg); fill:#dd3333;}
.faq li .t01.cur span svg{ fill:#333; transform:rotate(0deg);}
.faq li .t02{ font-size:14px; line-height:24px; color:#666; display:none; margin-top:5px;}
}

/*Sample*/
@media screen and (min-width:1280px){
.ab01 .box .sample{ width:1200px; margin:auto; display:block; margin-top:5px;}
.ab01 .box .sample li{ width:360px; display:block; float:left; margin-left:60px; margin-top:30px; overflow:hidden; position:relative;}
.ab01 .box .sample li:nth-child(3n+1){ clear:left; float:left; margin-left:0;}
.ab01 .box .sample li .t01{ font-size:20px; line-height:30px; font-weight:bold;}
.ab01 .box .sample li .t02{ font-size:16px; line-height:26px; color:#666; margin-top:10px;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.ab01 .box .sample{ width:94%; margin:auto; display:block; margin-top:5px;}
.ab01 .box .sample li{ width:48.5%; display:block; float:left; margin-left:3%; margin-top:25px; overflow:hidden; position:relative;}
.ab01 .box .sample li:nth-child(2n+1){ clear:left; float:left; margin-left:0;}
.ab01 .box .sample li .t01{ font-size:18px; line-height:28px; font-weight:bold;}
.ab01 .box .sample li .t02{ font-size:16px; line-height:26px; color:#666; margin-top:5px;}
}
@media only screen and (max-width: 767px){
.ab01 .box .sample{ width:94%; margin:auto; margin-top:5px; display:block;}
.ab01 .box .sample li{ width:100%; display:block; float:left; margin-top:10px; overflow:hidden; position:relative;}
.ab01 .box .sample li .t01{ font-size:16px; line-height:26px; font-weight:bold;}
.ab01 .box .sample li .t02{ font-size:14px; line-height:24px; color:#666;}
}

/*Quality*/
@media screen and (min-width:1280px){
.ab01 .box .quality{ width:1200px; margin:auto; display:block; margin-top:30px;}
.ab01 .box .quality .left{ width:550px; float:left;}
.ab01 .box .quality .left .t01{ font-size:30px; line-height:40px; font-weight:bold; margin-top:20px;}
.ab01 .box .quality .left .t02{ font-size:16px; line-height:26px; margin-top:15px;}
.ab01 .box .quality .right{ width:600px; float:right;}
.ab01 .box .quality .right img{ width:100%; display:block;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.ab01 .box .quality{ width:94%; margin:auto; display:block; margin-top:25px;}
.ab01 .box .quality .left{ width:47%; float:left;}
.ab01 .box .quality .left .t01{ font-size:24px; line-height:34px; font-weight:bold; margin-top:10px;}
.ab01 .box .quality .left .t02{ font-size:16px; line-height:26px; margin-top:10px;}
.ab01 .box .quality .right{ width:50%; float:right;}
.ab01 .box .quality .right img{ width:100%; display:block;}
}
@media only screen and (max-width: 767px){
.ab01 .box .quality{ width:94%; margin:auto; margin-top:20px; display:block;}
.ab01 .box .quality .left{ width:100%; float:left;}
.ab01 .box .quality .left .t01{ font-size:18px; line-height:28px; font-weight:bold; margin-top:10px;}
.ab01 .box .quality .left .t02{ font-size:14px; line-height:24px; margin-top:5px;}
.ab01 .box .quality .right{ width:100%; float:right;}
.ab01 .box .quality .right img{ width:100%; display:block;}
}

/*Privacy*/
@media screen and (min-width:1280px){
.ab02{ padding:70px 0; position:relative; z-index:1; background-color:#f1f1f1;}
.ab02 .box{ width:1200px; margin:auto; padding:65px 70px; padding-top:60px; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,.3); box-sizing:border-box;}
.ab02 .title{ width:100%; margin:auto; text-align:center;}
.ab02 .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.ab02 .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.ab02 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.ab02 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ab02 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.ab02 .wen{ font-size:16px; margin-top:25px;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.ab02{ padding:50px 0; position:relative; z-index:1; background-color:#f1f1f1;}
.ab02 .box{ width:94%; margin:auto; padding:45px 50px; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,.3); box-sizing:border-box;}
.ab02 .title{ width:100%; margin:auto; text-align:center;}
.ab02 .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.ab02 .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.ab02 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.ab02 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ab02 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.ab02 .wen{ font-size:16px; margin-top:20px;}
}
@media only screen and (max-width: 767px){
.ab02{ padding:30px 0; position:relative; z-index:1; background-color:#f1f1f1;}
.ab02 .box{ width:94%; margin:auto; padding:25px 15px; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,.3); box-sizing:border-box;}
.ab02 .title{ width:100%; margin:auto; text-align:center;}
.ab02 .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.ab02 .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.ab02 .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.ab02 .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ab02 .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.ab02 .wen{ font-size:14px; margin-top:15px;}
}

/*product*/
@media screen and (min-width:1280px){
.pro01{ padding-top:60px; padding-bottom:65px; position:relative; z-index:1; background-color:#fff;}
.pro01 .title{ width:1200px; margin:auto; text-align:center;}
.pro01 .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.pro01 .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.pro01 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.pro01 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.pro01 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.pro01 .box{ width:1200px; margin:auto; margin-top:25px;}
.pro01 .box .wen{ width:100%; font-size:16px; line-height:26px;}
.pro01 .box .wen img{ max-width:100%; height:auto;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.pro01{ padding-top:45px; padding-bottom:45px; position:relative; z-index:1; background-color:#fff;}
.pro01 .title{ width:94%; margin:auto; text-align:center;}
.pro01 .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.pro01 .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.pro01 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.pro01 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.pro01 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.pro01 .box{ width:94%; margin:auto; margin-top:20px;}
.pro01 .box .wen{ width:100%; font-size:16px; line-height:26px;}
.pro01 .box .wen img{ max-width:100%; height:auto;}
}
@media only screen and (max-width: 767px){
.pro01{ padding-top:25px; padding-bottom:25px; position:relative; z-index:1; background-color:#fff;}
.pro01 .title{ width:94%; margin:auto; text-align:center;}
.pro01 .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.pro01 .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.pro01 .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.pro01 .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.pro01 .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.pro01 .box{ width:94%; margin:auto; margin-top:15px;}
.pro01 .box .wen{ width:100%; font-size:14px; line-height:24px;}
.pro01 .box .wen img{ max-width:100%; height:auto;}
}

@media screen and (min-width:1280px){
.pro02{ padding-top:60px; padding-bottom:70px; position:relative; z-index:1; background-color:#f1f1f1;}
.pro02 .title{ width:1200px; margin:auto; text-align:center;}
.pro02 .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.pro02 .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.pro02 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.pro02 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.pro02 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.pro02 .box{ width:100%;}
.pro02 .box .list{ width:1200px; margin:auto; display:block; padding-bottom:5px;}
.pro02 .box .list li{ width:285px; display:block; float:left; margin-left:20px; margin-top:30px; overflow:hidden; background-color:#fff;}
.pro02 .box .list li:nth-child(4n+1){ clear:left; float:left; margin-left:0;}
.pro02 .box .list li .p01{ width:100%; height:240px; display:flex; align-items:center; position:relative;}
.pro02 .box .list li .p01>img{ display:block; max-width:calc(100% - 40px); max-height:200px; margin:auto;}
.pro02 .box .list li .p01 b{ width:100%; height:100%; background-color:#fff; display:block; position:absolute; left:0; top:0; overflow:hidden; opacity:0; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pro02 .box .list li .p01 b img{ width:100%; display:block;}
.pro02 .box .list li:hover .p01 b{ opacity:1;}
.pro02 .box .list li .p02{ padding:10px 20px; padding-bottom:0; line-height:24px; height:24px; font-size:14px; color:#999; text-align:center;}
.pro02 .box .list li .p03{ padding:0 20px; line-height:28px; height:56px; font-size:18px; color:#333; text-align:center; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.pro02 .box .list li .p04{ width:120px; height:34px; line-height:34px; background:linear-gradient(to right,#dd3333,#ff3333); margin:10px auto; margin-bottom:20px; text-align:center; font-size:16px; color:#fff; border-radius:36px;}
.pro02 .box .list li:hover .p03{ color:#dd3333;}
.pro02 .box .more{ width:160px; height:40px; margin:auto; margin-top:25px;}
.pro02 .box .more a{ width:100%; display:block; overflow:hidden; color:#fff; font-size:14px; text-transform:uppercase; text-align:center; height:40px; line-height:40px; border-radius:40px; background:linear-gradient(to right,#dd3333,#ff3333); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pro02 .box .more a:hover{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.pro02{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-color:#f1f1f1;}
.pro02 .title{ width:94%; margin:auto; text-align:center;}
.pro02 .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.pro02 .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.pro02 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.pro02 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.pro02 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.pro02 .box{ width:100%;}
.pro02 .box .list{ width:94%; margin:auto; display:block; padding-bottom:5px;}
.pro02 .box .list li{ width:32%; display:block; float:left; margin-left:2%; margin-top:20px; overflow:hidden; background-color:#fff;}
.pro02 .box .list li:nth-child(3n+1){ clear:left; float:left; margin-left:0;}
.pro02 .box .list li .p01{ width:100%; height:25.33vw; display:flex; align-items:center; position:relative;}
.pro02 .box .list li .p01>img{ display:block; max-width:calc(100% - 40px); max-height:calc(25.33vw - 80px); margin:auto;}
.pro02 .box .list li .p01 b{ width:100%; height:100%; background-color:#fff; display:block; position:absolute; left:0; top:0; overflow:hidden; opacity:0; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pro02 .box .list li .p01 b img{ width:100%; display:block;}
.pro02 .box .list li:hover .p01 b{ opacity:1;}
.pro02 .box .list li .p02{ padding:10px 20px; padding-bottom:0; line-height:24px; height:24px; font-size:14px; color:#999; text-align:center;}
.pro02 .box .list li .p03{ padding:0 20px; line-height:28px; height:56px; font-size:18px; color:#333; text-align:center; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.pro02 .box .list li .p04{ width:120px; height:34px; line-height:34px; background:linear-gradient(to right,#dd3333,#ff3333); margin:10px auto; margin-bottom:20px; text-align:center; font-size:16px; color:#fff; border-radius:36px;}
.pro02 .box .list li:hover .p03{ color:#dd3333;}
.pro02 .box .more{ width:160px; height:40px; margin:auto; margin-top:20px;}
.pro02 .box .more a{ width:100%; display:block; overflow:hidden; color:#fff; font-size:14px; text-transform:uppercase; text-align:center; height:40px; line-height:40px; border-radius:40px; background:linear-gradient(to right,#dd3333,#ff3333); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pro02 .box .more a:hover{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
}
@media only screen and (max-width: 767px){
.pro02{ padding-top:25px; padding-bottom:30px; position:relative; z-index:1; background-color:#f1f1f1;}
.pro02 .title{ width:94%; margin:auto; text-align:center;}
.pro02 .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.pro02 .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.pro02 .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.pro02 .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.pro02 .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.pro02 .box{ width:100%;}
.pro02 .box .list{ width:94%; margin:auto; display:block; padding:5px 0;}
.pro02 .box .list li{ width:48.5%; display:block; float:left; margin-left:3%; margin-top:15px; overflow:hidden; background-color:#fff;}
.pro02 .box .list li:nth-child(2n+1){ clear:left; float:left; margin-left:0;}
.pro02 .box .list li .p01{ width:100%; height:38.39vw; display:flex; align-items:center; position:relative;}
.pro02 .box .list li .p01>img{ display:block; max-width:calc(100% - 40px); max-height:calc(38.39vw - 80px); margin:auto;}
.pro02 .box .list li .p01 b{ width:100%; height:100%; background-color:#fff; display:block; position:absolute; left:0; top:0; overflow:hidden; opacity:0; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pro02 .box .list li .p01 b img{ width:100%; display:block;}
.pro02 .box .list li:hover .p01 b{ opacity:1;}
.pro02 .box .list li .p02{ padding:5px 15px; padding-bottom:0; line-height:20px; height:20px; font-size:14px; color:#999; text-align:center;}
.pro02 .box .list li .p03{ padding:0 15px; line-height:26px; height:52px; font-size:16px; color:#333; text-align:center; display:-webkit-box; -webkit-box-orient:vertical;-webkit-line-clamp:2;}
.pro02 .box .list li .p04{ width:90px; height:30px; line-height:30px; background:linear-gradient(to right,#dd3333,#ff3333); margin:5px auto; margin-bottom:15px; text-align:center; font-size:14px; color:#fff; border-radius:36px;}
.pro02 .box .list li:hover .p03{ color:#dd3333;}
.pro02 .box .more{ width:140px; height:40px; margin:auto; margin-top:15px;}
.pro02 .box .more a{ width:100%; display:block; overflow:hidden; color:#fff; font-size:14px; text-transform:uppercase; text-align:center; height:34px; line-height:34px; border-radius:40px; background:linear-gradient(to right,#dd3333,#ff3333); -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pro02 .box .more a:hover{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
}

@media screen and (min-width:1280px){
.pro01 .box .left{ width:600px; float:left; margin:5px 0; position:relative;}
.pro01 .box .left img{ width:100%; display:block;}
.pro01 .swiper-button-prev{ position:absolute; left:10px; top:50%; margin-top:-20px; background-image:url(../images/prev_07.png); background-position:center; background-repeat:no-repeat; width:40px; height:40px; cursor:pointer; border-radius:100%; background-color:rgba(255,255,255,.7);}
.pro01 .swiper-button-next{ position:absolute; right:10px; top:50%; margin-top:-20px; background-image:url(../images/next_09.png); background-position:center; background-repeat:no-repeat; width:40px; height:40px; cursor:pointer; border-radius:100%; background-color:rgba(255,255,255,.7);}
.pro01 .swiper-button-prev:hover,.pro01 .swiper-button-next:hover{ background-color:#fff;}
.pro01 .box .right{ width:550px; float:right;}
.pro01 .box .right .p01{ font-size:30px; font-weight:bold; line-height:40px;}
.pro01 .box .right .p03{ width:70px; height:4px; background-color:#dd3333; margin-top:10px;}
.pro01 .box .right .p02{ font-size:16px; line-height:26px; color:#666; margin-top:20px;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.pro01 .box .left{ width:50%; float:left; margin:5px 0; position:relative;}
.pro01 .box .left img{ width:100%; display:block;}
.pro01 .swiper-button-prev{ position:absolute; left:10px; top:50%; margin-top:-20px; background-image:url(../images/prev_07.png); background-position:center; background-repeat:no-repeat; width:40px; height:40px; cursor:pointer; border-radius:100%; background-color:rgba(255,255,255,.7);}
.pro01 .swiper-button-next{ position:absolute; right:10px; top:50%; margin-top:-20px; background-image:url(../images/next_09.png); background-position:center; background-repeat:no-repeat; width:40px; height:40px; cursor:pointer; border-radius:100%; background-color:rgba(255,255,255,.7);}
.pro01 .swiper-button-prev:hover,.pro01 .swiper-button-next:hover{ background-color:#fff;}
.pro01 .box .right{ width:47%; float:right;}
.pro01 .box .right .p01{ font-size:24px; font-weight:bold; line-height:34px;}
.pro01 .box .right .p03{ width:60px; height:3px; background-color:#dd3333; margin-top:10px;}
.pro01 .box .right .p02{ font-size:16px; line-height:26px; color:#666; margin-top:15px;}
}
@media only screen and (max-width: 767px){
.pro01 .box .left{ width:100%; float:left; margin:5px 0; position:relative;}
.pro01 .box .left img{ width:100%; display:block;}
.pro01 .swiper-button-prev{ position:absolute; left:10px; top:50%; margin-top:-20px; background-image:url(../images/prev_07.png); background-position:center; background-repeat:no-repeat; width:40px; height:40px; cursor:pointer; border-radius:100%; background-color:rgba(255,255,255,.7);}
.pro01 .swiper-button-next{ position:absolute; right:10px; top:50%; margin-top:-20px; background-image:url(../images/next_09.png); background-position:center; background-repeat:no-repeat; width:40px; height:40px; cursor:pointer; border-radius:100%; background-color:rgba(255,255,255,.7);}
.pro01 .swiper-button-prev:hover,.pro01 .swiper-button-next:hover{ background-color:#fff;}
.pro01 .box .right{ width:100%; float:right; padding-top:5px;}
.pro01 .box .right .p01{ font-size:18px; font-weight:bold; line-height:28px;}
.pro01 .box .right .p03{ width:50px; height:2px; background-color:#dd3333; margin-top:5px;}
.pro01 .box .right .p02{ font-size:14px; line-height:24px; color:#666; margin-top:10px;}
}

@media screen and (min-width:1280px){
.pro02 .box .list02{ width:1200px; margin:auto; padding-top:5px; display:block;}
.pro02 .box .list02 li{ width:285px; display:block; float:left; margin-left:20px; margin-top:25px; overflow:hidden;}
.pro02 .box .list02 li:nth-child(4n+1){ clear:left; float:left; margin-left:0;}
.pro02 .box .list02 li .tu{ width:100%; height:210px;}
.pro02 .box .list02 li .tu img{ width:100%; display:block; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pro02 .box .list02 li:hover .tu img{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
.pro02 .box .list02 li .bt{ font-size:20px; line-height:30px; font-weight:bold; margin-top:10px; text-align:center;}
.pro02 .box .list02 li .wen{ font-size:16px; line-height:26px; margin-top:5px; color:#666;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.pro02 .box .list02{ width:94%; margin:auto; padding-top:5px; display:block;}
.pro02 .box .list02 li{ width:32%; display:block; float:left; margin-left:2%; margin-top:20px; overflow:hidden;}
.pro02 .box .list02 li:nth-child(3n+1){ clear:left; float:left; margin-left:0;}
.pro02 .box .list02 li .tu{ width:100%; height:22.16vw;}
.pro02 .box .list02 li .tu img{ width:100%; display:block; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pro02 .box .list02 li:hover .tu img{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
.pro02 .box .list02 li .bt{ font-size:18px; line-height:28px; font-weight:bold; margin-top:10px; text-align:center;}
.pro02 .box .list02 li .wen{ font-size:16px; line-height:26px; margin-top:2px; color:#666;}
}
@media only screen and (max-width: 767px){
.pro02 .box .list02{ width:94%; margin:auto; padding-top:5px; display:block;}
.pro02 .box .list02 li{ width:48.5%; display:block; float:left; margin-left:3%; margin-top:15px; overflow:hidden;}
.pro02 .box .list02 li:nth-child(2n+1){ clear:left; float:left; margin-left:0;}
.pro02 .box .list02 li .tu{ width:100%; height:33.59vw;}
.pro02 .box .list02 li .tu img{ width:100%; display:block; -webkit-transition:.5s; -moz-transition:.5s; -o-transition:.5s; transition:.5s;}
.pro02 .box .list02 li:hover .tu img{ transform:scale(1.03, 1.03); -ms-transform:scale(1.03, 1.03); -moz-transform:scale(1.03, 1.03); -webkit-transform:scale(1.03, 1.03); -o-transform:scale(1.03, 1.03);}
.pro02 .box .list02 li .bt{ font-size:16px; line-height:26px; font-weight:bold; margin-top:5px; text-align:center;}
.pro02 .box .list02 li .wen{ font-size:14px; line-height:24px; color:#666;}
}

/*product_son*/
@media screen and (min-width:1280px){
.pro03{ padding:70px 0; position:relative; z-index:1; background-color:#f1f1f1;}
.pro03 .box{ width:1200px; margin:auto; display:flex;}
.product-left{ width:410px; border:10px solid #fff; border-radius:10px; margin-right:30px; position:relative; float:left; background-color:#fff;}
.product-left .tb-pic{ width:410px; height:410px; position:relative;}
.product-left .tb-pic a{ width:410px; height:410px; display:table-cell; text-align:center; vertical-align:middle;}
.product-left .tb-pic a img{ vertical-align:middle; max-width:400px; max-height:400px;}
.product-left .tb-pic a{ *display:block;* font-family:Arial; *line-height:1;}
.zoomDiv{ z-index:999; position:absolute; top:0px; left:0px; width:200px; height:200px; background:#ffffff; border:1px solid #CCCCCC; display:none; text-align:center; overflow:hidden;}
.zoomMask{ position:absolute; background:url("../images/mask.png") repeat scroll 0 0 transparent; cursor:move; z-index:999;}
.tb-thumb{ width:300px; margin:auto; margin-top:10px; overflow:hidden;}
.tb-thumb li{ width:50px; border:1px solid #cacaca; height:50px; overflow:hidden; margin:0 4px; float:left; display:block;}
.tb-thumb li img{ width:100%; display:block;}
.tb-thumb li.tb-selected{ border:1px solid #dd3333;}
.product-right{ width:680px; float:right; padding:30px; border-radius:10px; background-color:#fff;}
.product-right .p01{ font-size:24px; line-height:34px; font-weight:bold;}
.product-right .p02{ font-size:16px; line-height:26px; color:#dd3333; font-weight:bold; margin-top:10px;}
.product-right .p03{ font-size:14px; line-height:24px; color:#666;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.pro03{ padding:50px 0; position:relative; z-index:1; background-color:#f1f1f1;}
.pro03 .box{ width:94%; margin:auto;display:flex;}
.product-left{ width:410px; border:10px solid #fff; border-radius:10px; margin-right:3%; position:relative; float:left; background-color:#fff;}
.product-left .tb-pic{ width:410px; height:410px; position:relative;}
.product-left .tb-pic a{ width:410px; height:410px; display:table-cell; text-align:center; vertical-align:middle;}
.product-left .tb-pic a img{ vertical-align:middle; max-width:400px; max-height:400px;}
.product-left .tb-pic a{ *display:block;* font-family:Arial; *line-height:1;}
.zoomDiv{ z-index:999; position:absolute; top:0px; left:0px; width:200px; height:200px; background:#ffffff; border:1px solid #CCCCCC; display:none; text-align:center; overflow:hidden;}
.zoomMask{ position:absolute; background:url("../images/mask.png") repeat scroll 0 0 transparent; cursor:move; z-index:999;}
.tb-thumb{ width:300px; margin:auto; margin-top:10px; overflow:hidden;}
.tb-thumb li{ width:50px; border:1px solid #cacaca; height:50px; overflow:hidden; margin:0 4px; float:left; display:block;}
.tb-thumb li img{ width:100%; display:block;}
.tb-thumb li.tb-selected{ border:1px solid #dd3333;}
.product-right{ width:calc(97% - 450px); float:right; padding:20px; border-radius:10px; background-color:#fff;}
.product-right .p01{ font-size:22px; line-height:32px; font-weight:bold;}
.product-right .p02{ font-size:16px; line-height:26px; color:#dd3333; font-weight:bold; margin-top:10px;}
.product-right .p03{ font-size:14px; line-height:24px; color:#666;}
}
@media only screen and (max-width: 767px){
.pro03{ padding:30px 0; position:relative; z-index:1; background-color:#f1f1f1;}
.pro03 .box{ width:94%; margin:auto;}
.product-left{ width:calc(94vw - 20px); border:10px solid #fff; border-radius:10px; position:relative; background-color:#fff;}
.product-left .tb-pic{ width:calc(94vw - 20px); height:calc(94vw - 20px); position:relative;}
.product-left .tb-pic a{ width:calc(94vw - 20px); height:calc(94vw - 20px); display:table-cell; text-align:center; vertical-align:middle;}
.product-left .tb-pic a img{ vertical-align:middle; max-width:calc(94vw - 20px); max-height:calc(94vw - 20px);}
.product-left .tb-pic a{ *display:block;* font-family:Arial; *line-height:1;}
.zoomDiv{ display:none !important;}
.zoomMask{ display:none !important;}
.tb-thumb{ width:300px; margin:auto; margin-top:10px; overflow:hidden;}
.tb-thumb li{ width:50px; border:1px solid #cacaca; height:50px; overflow:hidden; margin:0 4px; float:left; display:block;}
.tb-thumb li img{ width:100%; display:block;}
.tb-thumb li.tb-selected{ border:1px solid #dd3333;}
.product-right{ width:calc(100% - 30px); margin-top:15px; padding:10px 15px; border-radius:10px; background-color:#fff;}
.product-right .p01{ font-size:18px; line-height:28px; font-weight:bold;}
.product-right .p02{ font-size:16px; line-height:26px; color:#dd3333; font-weight:bold; margin-top:5px;}
.product-right .p03{ font-size:14px; line-height:24px; color:#666;}
}

/*series*/
@media screen and (min-width:1280px){
.ser01{ padding-top:60px; padding-bottom:70px; position:relative; z-index:1; background-color:#fff;}
.ser01 .title{ width:1200px; margin:auto; text-align:center;}
.ser01 .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.ser01 .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.ser01 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.ser01 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ser01 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.ser01 .box{ width:1200px; margin:auto; margin-top:30px; display:flex; align-items:center;}
.ser01 .box .left{ width:600px; float:left; position:relative;}
.ser01 .box .left img{ width:100%; display:block;}
.ser01 .box .right{ width:550px; float:right; text-align:center; margin-left:50px;}
.ser01 .box .right .p01{ font-size:30px; font-weight:bold; line-height:40px;}
.ser01 .box .right .p03{ width:70px; height:4px; background-color:#dd3333; margin:auto; margin-top:10px;}
.ser01 .box .right .p02{ font-size:16px; line-height:26px; color:#666; margin-top:20px;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.ser01{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-color:#fff;}
.ser01 .title{ width:94%; margin:auto; text-align:center;}
.ser01 .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.ser01 .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.ser01 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.ser01 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ser01 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.ser01 .box{ width:94%; margin:auto; margin-top:25px; display:flex; align-items:center;}
.ser01 .box .left{ width:50%; float:left; position:relative;}
.ser01 .box .left img{ width:100%; display:block;}
.ser01 .box .right{ width:47%; float:right; text-align:center; margin-left:3%;}
.ser01 .box .right .p01{ font-size:24px; font-weight:bold; line-height:34px;}
.ser01 .box .right .p03{ width:60px; height:3px; background-color:#dd3333; margin:auto; margin-top:10px;}
.ser01 .box .right .p02{ font-size:16px; line-height:26px; color:#666; margin-top:15px;}
}
@media only screen and (max-width: 767px){
.ser01{ padding-top:25px; padding-bottom:25px; position:relative; z-index:1; background-color:#fff;}
.ser01 .title{ width:94%; margin:auto; text-align:center;}
.ser01 .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.ser01 .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.ser01 .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.ser01 .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ser01 .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.ser01 .box{ width:94%; margin:auto; margin-top:15px;}
.ser01 .box .left{ width:100%; float:left; margin:5px 0; position:relative;}
.ser01 .box .left img{ width:100%; display:block;}
.ser01 .box .right{ width:100%; float:right; padding-top:5px; text-align:center;}
.ser01 .box .right .p01{ font-size:18px; font-weight:bold; line-height:28px;}
.ser01 .box .right .p03{ width:50px; height:2px; background-color:#dd3333; margin:auto; margin-top:5px;}
.ser01 .box .right .p02{ font-size:14px; line-height:24px; color:#666; margin-top:10px;}
}

@media screen and (min-width:1280px){
.ser02{ padding-top:60px; padding-bottom:70px; position:relative; z-index:1; background-color:#f1f1f1;}
.ser02 .title{ width:1200px; margin:auto; text-align:center;}
.ser02 .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.ser02 .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.ser02 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.ser02 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ser02 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.ser02 .box{ width:1200px; margin:auto; margin-top:30px; display:flex; align-items:center; background-color:#fff;}
.ser02 .box01{ width:1200px; margin:auto; margin-top:30px; display:flex; align-items:center; flex-direction:row-reverse; background-color:#fff;}
.ser02 .left{ width:50%; float:left; position:relative;}
.ser02 .left img{ width:100%; display:block;}
.ser02 .right{ width:50%; float:right; padding:0 50px; box-sizing:border-box;}
.ser02 .right .p01{ font-size:20px; font-weight:bold; line-height:30px;}
.ser02 .right .p02{ font-size:16px; line-height:26px; color:#666; margin-top:15px;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.ser02{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-color:#f1f1f1;}
.ser02 .title{ width:94%; margin:auto; text-align:center;}
.ser02 .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.ser02 .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.ser02 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.ser02 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ser02 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.ser02 .box{ width:94%; margin:auto; margin-top:25px; display:flex; align-items:center; background-color:#fff;}
.ser02 .box01{ width:94%; margin:auto; margin-top:25px; display:flex; align-items:center; flex-direction:row-reverse; background-color:#fff;}
.ser02 .left{ width:50%; float:left; position:relative;}
.ser02 .left img{ width:100%; display:block;}
.ser02 .right{ width:50%; float:right; padding:0 30px; box-sizing:border-box;}
.ser02 .right .p01{ font-size:18px; font-weight:bold; line-height:28px;}
.ser02 .right .p02{ font-size:16px; line-height:26px; color:#666; margin-top:10px;}
}
@media only screen and (max-width: 767px){
.ser02{ padding-top:25px; padding-bottom:25px; position:relative; z-index:1; background-color:#f1f1f1;}
.ser02 .title{ width:94%; margin:auto; text-align:center; padding-bottom:5px;}
.ser02 .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.ser02 .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.ser02 .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.ser02 .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.ser02 .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.ser02 .box{ width:94%; margin:auto; margin-top:15px; background-color:#fff;}
.ser02 .box01{ width:94%; margin:auto; margin-top:15px; background-color:#fff;}
.ser02 .left{ width:100%; float:left; position:relative;}
.ser02 .left img{ width:100%; display:block;}
.ser02 .right{ width:100%; float:right; padding:10px 15px; box-sizing:border-box;}
.ser02 .right .p01{ font-size:18px; font-weight:bold; line-height:28px;}
.ser02 .right .p02{ font-size:14px; line-height:24px; color:#666; margin-top:5px;}
}

/*customization*/
@media screen and (min-width:1280px){
.cus01{ padding-top:60px; padding-bottom:70px; position:relative; z-index:1; background-color:#fff;}
.cus01 .title{ width:1200px; margin:auto; text-align:center;}
.cus01 .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.cus01 .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.cus01 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.cus01 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.cus01 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.cus01 .box{ width:1200px; margin:auto; margin-top:30px;}
.cus01 .box img{ max-width:100%; height:auto;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.cus01{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-color:#fff;}
.cus01 .title{ width:94%; margin:auto; text-align:center;}
.cus01 .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.cus01 .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.cus01 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.cus01 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.cus01 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.cus01 .box{ width:94%; margin:auto; margin-top:25px;}
.cus01 .box img{ max-width:100%; height:auto;}
}
@media only screen and (max-width: 767px){
.cus01{ padding-top:25px; padding-bottom:25px; position:relative; z-index:1; background-color:#fff;}
.cus01 .title{ width:94%; margin:auto; text-align:center;}
.cus01 .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.cus01 .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.cus01 .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.cus01 .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.cus01 .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.cus01 .box{ width:94%; margin:auto; margin-top:20px;}
.cus01 .box img{ max-width:100%; height:auto;}
}

@media screen and (min-width:1280px){
.cus02{ padding-top:60px; padding-bottom:70px; position:relative; z-index:1; background-color:#f1f1f1;}
.cus02 .title{ width:1200px; margin:auto; text-align:center;}
.cus02 .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.cus02 .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.cus02 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.cus02 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.cus02 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.cus02 .box{ width:1200px; margin:auto; margin-top:10px;}
.cus02 .box .image_container{ width:100%;}
.cus02 .box .image_container a{ width:285px; height:200px; background-color:#fff; position:relative; display:flex; align-items:center; float:left; margin-left:20px; margin-top:25px; overflow:hidden;}
.cus02 .box .image_container a:nth-child(4n+1){ clear:left; float:left; margin-left:0;}
.cus02 .box .image_container a img{ max-width:100%; max-height:200px; display:block; margin:auto;}
.cus02 .box .image_container a p{ width:100%; height:100%; padding:20px; box-sizing:border-box; background-color:rgba(0,0,0,7); font-size:20px; font-weight:bold; position:absolute; left:0; top:0; text-align:center; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; color:#fff; opacity:0;}
.cus02 .box .image_container a:hover p{ opacity:1;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.cus02{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-color:#f1f1f1;}
.cus02 .title{ width:94%; margin:auto; text-align:center;}
.cus02 .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.cus02 .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.cus02 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.cus02 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.cus02 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.cus02 .box{ width:94%; margin:auto; margin-top:5px;}
.cus02 .box .image_container{ width:100%;}
.cus02 .box .image_container a{ width:32%; height:21.1vw; background-color:#fff; position:relative; display:flex; align-items:center; float:left; margin-left:2%; margin-top:20px; overflow:hidden;}
.cus02 .box .image_container a:nth-child(3n+1){ clear:left; float:left; margin-left:0;}
.cus02 .box .image_container a img{ max-width:100%; max-height:21.1vw; display:block; margin:auto;}
.cus02 .box .image_container a p{ width:100%; height:100%; padding:20px; box-sizing:border-box; background-color:rgba(0,0,0,7); font-size:18px; font-weight:bold; position:absolute; left:0; top:0; text-align:center; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; color:#fff; opacity:0;}
.cus02 .box .image_container a:hover p{ opacity:1;}
}
@media only screen and (max-width: 767px){
.cus02{ padding-top:25px; padding-bottom:25px; position:relative; z-index:1; background-color:#f1f1f1;}
.cus02 .title{ width:94%; margin:auto; text-align:center;}
.cus02 .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.cus02 .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.cus02 .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.cus02 .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.cus02 .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.cus02 .box{ width:94%; margin:auto; margin-top:5px;}
.cus02 .box .image_container{ width:100%;}
.cus02 .box .image_container a{ width:48.5%; height:31.99vw; background-color:#fff; position:relative; display:flex; align-items:center; float:left; margin-left:3%; margin-top:15px; overflow:hidden;}
.cus02 .box .image_container a:nth-child(2n+1){ clear:left; float:left; margin-left:0;}
.cus02 .box .image_container a img{ max-width:100%; max-height:31.99vw; display:block; margin:auto;}
.cus02 .box .image_container a p{ width:100%; height:100%; padding:15px; box-sizing:border-box; background-color:rgba(0,0,0,7); font-size:16px; font-weight:bold; position:absolute; left:0; top:0; text-align:center; display:flex; flex-wrap:wrap; align-items:center; justify-content:center; color:#fff; opacity:0;}
.cus02 .box .image_container a:hover p{ opacity:1;}
}

/*Contact*/
@media screen and (min-width:1280px){
.lx01{ padding-top:60px; padding-bottom:70px; position:relative; z-index:1; background-color:#fff;}
.lx01 .title{ width:1200px; margin:auto; text-align:center;}
.lx01 .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.lx01 .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.lx01 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.lx01 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.lx01 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.lx01 .box{ width:1200px; margin:auto; margin-top:30px;}
.lx01 .box .left{ width:600px; float:left; margin-top:-20px;}
.lx01 .box .left .p01{ font-size:24px; font-weight:bold; line-height:34px; margin-top:20px;}
.lx01 .box .left .p03{ width:70px; height:4px; background-color:#dd3333; margin-top:5px;}
.lx01 .box .left .p02{ font-size:14px; line-height:24px; color:#666; margin-top:15px;}
.lx01 .box .left .p04{ padding-top:10px; margin-left:-10px;}
.lx01 .box .left .p04 a{ width:40px; height:40px; display:flex; align-items:center; float:left; overflow:hidden; margin-top:10px; margin-left:10px; background-color:#333; border-radius:100%;}
.lx01 .box .left .p04 a img{ max-width:24px; max-height:24px; display:block; margin:auto;}
.lx01 .box .left .p04 a:hover{ background-color:#dd3333;}

.lx01 .box .right{ width:550px; float:right; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,.3); padding:50px; padding-top:45px; box-sizing:border-box;}
.lx01 .box .right .bt{ font-size:24px; line-height:34px; display:block; color:#dd3333; font-weight:bold;}
.lx01 .box .right .inp{ width:100%; margin-top:20px;}
.lx01 .box .right .inp .t01{ font-size:16px; line-height:36px; height:36px; font-weight:bold;}
.lx01 .box .right .inp .t01 a{ color:#dd3333;}
.lx01 .box .right .inp .t02{ width:100%; height:34px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lx01 .box .right .inp .t02 input{ width:100%; padding:0 14px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lx01 .box .right .inp .t02 select{ width:100%; padding:0 14px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lx01 .box .right .inp .t02 img{ position:absolute; right:10px; top:50%; margin-top:-4px; height:8px;}
.lx01 .box .right .inp .t03{ width:100%; height:84px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lx01 .box .right .inp .t03 textarea{ padding:4px 14px; line-height:24px; width:100%; height:100%; box-sizing:border-box; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lx01 .box .right .but{ width:160px; height:40px; margin-top:30px; display:flex; align-items:center; justify-content:center; border-radius:40px; position:relative; background:linear-gradient(to right,#dd3333,#ff3333);}
.lx01 .box .right .but img{ display:block;}
.lx01 .box .right .but b{ display:block; margin-left:10px; font-size:16px; line-height:26px; color:#fff;}
.lx01 .box .right .but input{ width:100%; height:100%; display:block; opacity:0; position:absolute; left:0; top:0; cursor:pointer;}
.lx01 .box .right .but:hover{ background:#dd3333;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.lx01{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-color:#fff;}
.lx01 .title{ width:94%; margin:auto; text-align:center;}
.lx01 .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.lx01 .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.lx01 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.lx01 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.lx01 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.lx01 .box{ width:94%; margin:auto; margin-top:25px;}
.lx01 .box .left{ width:50%; float:left; margin-top:-15px;}
.lx01 .box .left .p01{ font-size:20px; font-weight:bold; line-height:34px; margin-top:15px;}
.lx01 .box .left .p03{ width:60px; height:3px; background-color:#dd3333; margin-top:5px;}
.lx01 .box .left .p02{ font-size:14px; line-height:24px; color:#666; margin-top:10px;}
.lx01 .box .left .p04{ padding-top:5px; margin-left:-10px;}
.lx01 .box .left .p04 a{ width:40px; height:40px; display:flex; align-items:center; float:left; overflow:hidden; margin-top:10px; margin-left:10px; background-color:#333; border-radius:100%;}
.lx01 .box .left .p04 a img{ max-width:24px; max-height:24px; display:block; margin:auto;}
.lx01 .box .left .p04 a:hover{ background-color:#dd3333;}

.lx01 .box .right{ width:47%; float:right; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,.3); padding:30px; padding-top:25px; box-sizing:border-box;}
.lx01 .box .right .bt{ font-size:20px; line-height:30px; display:block; color:#dd3333; font-weight:bold;}
.lx01 .box .right .inp{ width:100%; margin-top:10px;}
.lx01 .box .right .inp .t01{ font-size:16px; line-height:36px; height:36px; font-weight:bold;}
.lx01 .box .right .inp .t01 a{ color:#dd3333;}
.lx01 .box .right .inp .t02{ width:100%; height:34px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lx01 .box .right .inp .t02 input{ width:100%; padding:0 14px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lx01 .box .right .inp .t02 select{ width:100%; padding:0 14px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lx01 .box .right .inp .t02 img{ position:absolute; right:10px; top:50%; margin-top:-4px; height:8px;}
.lx01 .box .right .inp .t03{ width:100%; height:84px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lx01 .box .right .inp .t03 textarea{ padding:4px 14px; line-height:24px; width:100%; height:100%; box-sizing:border-box; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lx01 .box .right .but{ width:160px; height:40px; margin-top:20px; display:flex; align-items:center; justify-content:center; border-radius:40px; position:relative; background:linear-gradient(to right,#dd3333,#ff3333);}
.lx01 .box .right .but img{ display:block;}
.lx01 .box .right .but b{ display:block; margin-left:10px; font-size:16px; line-height:26px; color:#fff;}
.lx01 .box .right .but input{ width:100%; height:100%; display:block; opacity:0; position:absolute; left:0; top:0; cursor:pointer;}
.lx01 .box .right .but:hover{ background:#dd3333;}
}
@media only screen and (max-width: 767px){
.lx01{ padding-top:25px; padding-bottom:30px; position:relative; z-index:1; background-color:#fff;}
.lx01 .title{ width:94%; margin:auto; text-align:center;}
.lx01 .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.lx01 .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.lx01 .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.lx01 .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.lx01 .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.lx01 .box{ width:94%; margin:auto;}
.lx01 .box .left{ width:100%; float:left;}
.lx01 .box .left .p01{ font-size:18px; font-weight:bold; line-height:28px; margin-top:10px;}
.lx01 .box .left .p03{ width:50px; height:2px; background-color:#dd3333; margin-top:5px;}
.lx01 .box .left .p02{ font-size:14px; line-height:24px; color:#666; margin-top:5px;}
.lx01 .box .left .p04{ margin-left:-10px;}
.lx01 .box .left .p04 a{ width:34px; height:34px; display:flex; align-items:center; float:left; overflow:hidden; margin-top:10px; margin-left:10px; background-color:#333; border-radius:100%;}
.lx01 .box .left .p04 a img{ max-width:24px; max-height:24px; display:block; margin:auto;}
.lx01 .box .left .p04 a:hover{ background-color:#dd3333;}
.lx01 .box .right{ width:100%; float:right; background-color:#fff; box-shadow:0 0 10px rgba(0,0,0,.3); padding:15px; padding-top:10px; box-sizing:border-box; margin-top:20px;}
.lx01 .box .right .bt{ font-size:18px; line-height:28px; display:block; color:#dd3333; font-weight:bold;}
.lx01 .box .right .inp{ width:100%; margin-top:5px;}
.lx01 .box .right .inp .t01{ font-size:14px; line-height:30px; height:30px; font-weight:bold;}
.lx01 .box .right .inp .t01 a{ color:#dd3333;}
.lx01 .box .right .inp .t02{ width:100%; height:34px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lx01 .box .right .inp .t02 input{ width:100%; padding:0 9px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lx01 .box .right .inp .t02 select{ width:100%; padding:0 9px; box-sizing:; height:32px; line-height:32px; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lx01 .box .right .inp .t02 img{ position:absolute; right:10px; top:50%; margin-top:-3px; height:6px;}
.lx01 .box .right .inp .t03{ width:100%; height:84px; border:1px solid #e5e5e5; box-sizing:border-box; position:relative;}
.lx01 .box .right .inp .t03 textarea{ padding:4px 9px; line-height:24px; width:100%; height:100%; box-sizing:border-box; font-size:14px; background-color:#fafafa; display:block; overflow:hidden;}
.lx01 .box .right .but{ width:120px; height:34px; margin-top:15px; display:flex; align-items:center; justify-content:center; border-radius:34px; position:relative; background:linear-gradient(to right,#dd3333,#ff3333);}
.lx01 .box .right .but img{ display:block;}
.lx01 .box .right .but b{ display:block; margin-left:5px; font-size:14px; line-height:24px; color:#fff;}
.lx01 .box .right .but input{ width:100%; height:100%; display:block; opacity:0; position:absolute; left:0; top:0; cursor:pointer;}
.lx01 .box .right .but:hover{ background:#dd3333;}
}

@media screen and (min-width:1280px){
.lx02{ padding-top:60px; padding-bottom:70px; position:relative; z-index:1; background-color:#f1f1f1;}
.lx02 .title{ width:1200px; margin:auto; text-align:center;}
.lx02 .title b{ font-size:36px; text-transform:uppercase; line-height:46px; display:block; overflow:hidden;}
.lx02 .title p{ font-size:16px; line-height:26px; display:block; overflow:hidden; color:#666;}
.lx02 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:10px;}
.lx02 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.lx02 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.lx02 .box{ width:1200px; margin:auto; margin-top:30px;}
}
@media screen and (min-width:768px) and (max-width: 1279px){
.lx02{ padding-top:45px; padding-bottom:50px; position:relative; z-index:1; background-color:#f1f1f1;}
.lx02 .title{ width:94%; margin:auto; text-align:center;}
.lx02 .title b{ font-size:28px; text-transform:uppercase; line-height:32px; display:block; overflow:hidden;}
.lx02 .title p{ font-size:16px; line-height:28px; display:block; overflow:hidden; color:#666;}
.lx02 .title strong{ display:block; width:98px; height:8px; margin:auto; overflow:hidden; margin-top:7px;}
.lx02 .title strong span{ display:block; float:left; width:80px; height:8px; border-radius:8px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.lx02 .title strong a{ display:block; float:right; width:8px; height:8px; border-radius:8px; background-color:#333; overflow:hidden;}
.lx02 .box{ width:94%; margin:auto; margin-top:25px;}
}
@media only screen and (max-width: 767px){
.lx02{ padding-top:25px; padding-bottom:30px; position:relative; z-index:1; background-color:#f1f1f1;}
.lx02 .title{ width:94%; margin:auto; text-align:center;}
.lx02 .title b{ font-size:20px; text-transform:uppercase; line-height:30px; display:block; overflow:hidden;}
.lx02 .title p{ font-size:14px; line-height:20px; display:block; overflow:hidden; color:#666;}
.lx02 .title strong{ display:block; width:70px; height:6px; margin:auto; overflow:hidden; margin-top:9px;}
.lx02 .title strong span{ display:block; float:left; width:60px; height:6px; border-radius:6px; background:linear-gradient(to right,#dd3333,#ff3333); overflow:hidden;}
.lx02 .title strong a{ display:block; float:right; width:6px; height:6px; border-radius:6px; background-color:#333; overflow:hidden;}
.lx02 .box{ width:94%; margin:auto; padding-top:5px;}
}

@media screen and (min-width:1280px){
.lx02 .box ul{ width:1260px; display:block; overflow:hidden;}
.lx02 .box ul li{ width:360px; float:left; display:block; background-color:#fff; overflow:hidden; margin-right:60px;}
.lx02 .box ul li strong{ padding-top:30px; padding-bottom:15px; display:block; overflow:hidden;}
.lx02 .box ul li strong img{ display:block; height:50px; margin:auto;}
.lx02 .box ul li strong span{ font-size:18px; line-height:28px; height:28px; text-align:center; overflow:hidden; margin-top:15px; display:block;}
.lx02 .box ul li b{ display:block; overflow:hidden; height:2px; width:100%; background-image:url(../images/cline.png); background-position:center; background-repeat:no-repeat;}
.lx02 .box ul li p{ width:320px; height:94px; padding:20px; display:table; text-align:center; vertical-align:middle; overflow:hidden;}
.lx02 .box ul li p span{ width:100%; height:100%; display:table-cell; text-align:center; vertical-align:middle; overflow:hidden; font-size:14px; line-height:24px;}
.lx02 .box ul li p span a{ font-size:18px; line-height:28px;}
.lx02 .box ul li p span img{ max-width:140px; text-align:center;}

#map{ width:100%; height:500px;}
}
@media screen and (min-width:768px) and (max-width:1279px){
.lx02 .box ul{ width:100%; display:block; overflow:hidden;}
.lx02 .box ul li{ width:29.33%; float:left; display:block; background-color:#fff; overflow:hidden; margin-left:3%;}
.lx02 .box ul li strong{ padding-top:30px; padding-bottom:15px; display:block; overflow:hidden;}
.lx02 .box ul li strong img{ display:block; height:50px; margin:auto;}
.lx02 .box ul li strong span{ font-size:18px; line-height:28px; height:28px; text-align:center; overflow:hidden; margin-top:10px; display:block;}
.lx02 .box ul li b{ display:block; overflow:hidden; height:2px; width:100%; background-image:url(../images/cline.png); background-position:center; background-repeat:no-repeat;}
.lx02 .box ul li p{ width:90%; height:94px; padding:20px 5%; display:table; text-align:center; vertical-align:middle; overflow:hidden;}
.lx02 .box ul li p span{ width:100%; height:100%; display:table-cell; text-align:center; vertical-align:middle; overflow:hidden; font-size:14px; line-height:24px;}
.lx02 .box ul li p span a{ font-size:18px; line-height:28px;}
.lx02 .box ul li p span img{ max-width:140px; text-align:center;}
#map{ width:100%; height:400px;}
}
@media only screen and (max-width:767px){
.lx02 .box ul{ width:100%; display:block; overflow:hidden;}
.lx02 .box ul li{ width:94%; float:left; display:block; background-color:#fff; overflow:hidden; margin-left:3%; margin-top:15px;}
.lx02 .box ul li strong{ padding-top:20px; padding-bottom:5px; display:block; overflow:hidden;}
.lx02 .box ul li strong img{ display:block; height:50px; margin:auto;}
.lx02 .box ul li strong span{ font-size:16px; line-height:26px; height:26px; text-align:center; overflow:hidden; margin-top:5px; display:block;}
.lx02 .box ul li b{ display:block; overflow:hidden; height:2px; width:94%; margin:auto; background-image:url(../images/cline.png); background-position:center; background-repeat:no-repeat;}
.lx02 .box ul li p{ width:94%; height:100px; padding:10px 3%; display:table; text-align:center; vertical-align:middle; overflow:hidden;}
.lx02 .box ul li p span{ width:100%; height:100%; display:table-cell; text-align:center; vertical-align:middle; overflow:hidden; font-size:14px; line-height:24px;}
.lx02 .box ul li p span a{ font-size:18px; line-height:28px;}
.lx02 .box ul li p img{ max-width:120px;}
#map{ width:100%; height:300px;}
}