@font-face{font-family:'Patrick Hand';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/patrickhand/v14/LDI1apSQOAYtSuYWp8ZhfYe8UcLLubg58xGL.woff2) format('woff2');unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+1EA0-1EF9,U+20AB}
@font-face{font-family:'Patrick Hand';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/patrickhand/v14/LDI1apSQOAYtSuYWp8ZhfYe8UMLLubg58xGL.woff2) format('woff2');unicode-range:U+0100-024F,U+0259,U+1E00-1EFF,U+2020,U+20A0-20AB,U+20AD-20CF,U+2113,U+2C60-2C7F,U+A720-A7FF}
@font-face{font-family:'Patrick Hand';font-style:normal;font-weight:400;font-display:swap;src:url(https://fonts.gstatic.com/s/patrickhand/v14/LDI1apSQOAYtSuYWp8ZhfYe8XsLLubg58w.woff2) format('woff2');unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+2000-206F,U+2074,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}

/**------------------- slide -------------------**/
.swiper-container{width:100%;clear:both;background-color:#030303;}
.swiper-slide{min-height:550px;}
.swiper-slide .i-content{position:absolute;top:26%;width:100%;z-index:3;text-align:center;}
.swiper-slide .i-mask{position:absolute;width:100%;height:100%;top:0;left:0;background-color:rgba(0,0,0,0.2);}
.swiper-slide .i-h{color:#FFF;font-size:48px;font-weight:800;margin-bottom:20px;}
.swiper-slide .i-summary{color:#FFF;font-size:22px;margin-bottom:50px;font-weight:300;}
.swiper-slide .i-btn-1{position:absolute;z-index:3;right:10%;bottom:15%;}
.swiper-slide .i-btn a, .swiper-slide .i-btn-1 a{display:inline-block;color:#FFF;font-size:15px;border:1px solid #FFF;height:50px;line-height:50px;
text-transform:uppercase;font-weight:300;padding:0 50px;
border-radius:25px;-webkit-border-radius:25px;-moz-border-radius:25px;}
.swiper-slide .i-btn a:hover, .swiper-slide .i-btn-1 a{background-color:#00a0e9;border-color:#00a0e9;text-decoration:none;}
.swiper-slide .i-btn-1 a{padding:0 35px;}
.swiper-slide .i-btn-1 a .icon{margin-left:8px;}
.swiper-slide .i-btn-1 a:hover{background-color:transparent;border-color:#FFF;}
.swiper-slide img{width:100%;height:auto;min-height:100%;transition:1s linear 2s;transform:scale(1.1,1.1)}
.swiper-slide-active img,.swiper-slide-duplicate-active img{transition:6s linear;transform:scale(1,1)}

/**------------------- feature -------------------**/
.col-product{background:url(../images/home-bg-product.jpg) no-repeat top center;background-size:cover;padding:140px 0;}
.col-product .i-title-summary{margin-bottom:80px;}
.col-product .i-title{float:left;width:40%;}
.col-product .i-summary{float:right;width:50%;line-height:180%;}
.col-product .i-gallery-title{border:1px solid #EEE;margin-bottom:10px;background-color:#FFF;}
.col-product .i-gallery-title h3{text-align:center;margin:0;padding:12px 0;font-size:29px;}
.col-product .i-gallery-title-en h3{font-family:"Patrick Hand";}
.col-product .i-gallery-title-cn h3{font-family:"Segoe UI", SegoeUI, "Microsoft YaHei";}
.col-product .i-gallery-floor:hover .i-gallery-title h3{background-color:#00a0e9;color:#FFF;}
.col-product .i-gallery{position:relative;height:494px;}
.col-product .i-gitem{position:absolute;border:1px solid #EEE;width:236px;height:236px;overflow:hidden;}
.col-product .i-gitem a{display:block;position:relative;}
.col-product .i-gitem img{width:100%;}
.col-product .g0{width:484px;height:484px;}
.col-product .g1{left:496px;}
.col-product .g2{right:248px;}
.col-product .g3{left:496px;top:248px;}
.col-product .g4{right:248px;top:248px;}
.col-product .g5{right:0;height:484px;}
.col-product .mask{position:absolute;background:rgba(0, 160, 233,0.75);left:0;top:0;height:100%;width:100%;
-webkit-transform: rotateY(-90deg);-ms-transform: rotateY(-90deg);-o-transform: rotateY(-90deg);transform: rotateY(-90deg);
-webkit-transform-origin: left center;-moz-transform-origin: left center;-ms-transform-origin: left center;transform-origin: left center;
-webkit-transition: all 0.6s ease 0s;-o-transition: all 0.6s ease 0s;transition: all 0.6s ease 0s;
opacity: 0;filter: alpha(opacity=0);}
.col-product .i-gitem:hover .mask{-webkit-transform: rotateY(0);-ms-transform: rotateY(0);-o-transform: rotateY(0);transform: rotateY(0);
opacity: 1;filter: alpha(opacity=100);}
.col-product .i-gitem .mb{padding:20px;}
.col-product .i-gitem h4{font-size:17px;color:#FFF;margin-bottom:30px;position:relative;}
.col-product .i-gitem h4:after{position:absolute;content:'';left:0;bottom:-15px;width:30px;height:1px;background-color:#FFF;}
.col-product .i-gitem p{color:#FFF;font-size:14px;}
.col-product .i-name{position:absolute;z-index:2;bottom:0;left:0;width:100%;}
.col-product .i-name span{display:block;padding:15px;font-size:13px;text-align:center;color:#777;}
.col-product .i-gitem:hover .i-name{display:none;}


/**------------------- about -------------------**/
.col-about, .col-feature{padding:140px 0;background-color:#00a0e9;}
.col-about .floor{position:relative;}
.col-about .i-img{float:right;width:795px;}
.col-about .i-img img{min-height:870px;width:100%;}
.col-about .i-content{position:absolute;width:500px;left:0;top:60px;background-color:#FFF;z-index:1;}
.col-about .i-content-box{padding:50px;}
.col-about .i-p{padding:10px 0 35px 0;line-height:195%;}


/**------------------- video -------------------**/
.col-video{float:left;width:61%;position:relative;background-color:#000;}
.col-video .i-title{position:absolute;bottom:0;left:0;width:100%;background-color:rgba(0,0,0,0.5);}
.col-video .i-tb{padding:15px;color:#FFF;}
.col-video .i-p{float:left;width:76%;color:#FFF;font-size:12px;}
.col-video .i-btn{float:right;color:#FFF;cursor:pointer;}

.col-video .i-play{position:absolute;left:0;top:46%;width:100%;text-align:center;z-index:1;}
.col-video .i-play .icon{font-size:52px;cursor: pointer;}
.col-video .i-play .icon:hover{color:#63d8cb;}

/**------------------- news -------------------**/
.col-news{float:right;width:31%;}
.col-news .i-title{margin-bottom:15px;position:relative;}
.col-news .i-title h2{float:left;padding-right:20px;margin:0;height:34px;line-height:34px;background-color:#FFF;}
.col-news .i-title h2 a{font-size:35px;font-weight:bold;line-height:34px;}
.col-news .thumb{float:left;width:30%;}
.col-news .thumb img{width:100%;min-height:54px;}
.col-news .text{float:right;width:62%;}
.col-news li{margin-top:40px;}
.col-news h3 a{font-size:17px;font-weight:bold;}
.col-news h3{margin:0;}
.col-news h3, .col-news h3 a{line-height:100%;}
.col-news .date{font-size:12px;color:#999;margin:13px 0;}
.col-news p{margin:0;color:#666;}
.col-news a:hover{text-decoration:none;}
.col-news h3, .col-news p{overflow:hidden;white-space: nowrap;text-overflow: ellipsis;}

/** feature **/
.col-feature{background-color:#F2F2F2;}
.col-feature .i-content{float:left;width:270px;}
.col-feature .i-p{padding:10px 0 35px 0;line-height:180%;}
.col-feature .i-gallery{float:right;overflow:hidden;width:804px;}
.col-feature .i-slide{position:relative;overflow:hidden;}
.col-feature .i-slide-box{position:relative;}
.col-feature .i-slide-box img{width:100%;height:auto;}
.col-feature .i-slide:hover .slide-prev, .col-feature .i-slide:hover .slide-next{width:28px;}
.col-feature .i-slide-tabs{text-align:center;margin-top:25px;}
.col-feature .i-slide-tabs li{display:inline-block;margin:0 5px;padding:2px 10px;}
.col-feature .i-slide-tabs li.on{background-color:#00a0e9;color:#FFF;}

/** contact **/
.col-contact{height:775px;overflow:hidden;}
.col-contact .floor{margin-top:120px;}
.col-contact .i-box{float:right;width:560px;background-color:#FFF;}
.col-contact .b{padding:50px;}
.col-contact .btn-submit{padding-left:0;padding-right:0;width:100%;}

/**------------------- common -------------------**/
.col-about, .col-video-news
{margin-bottom:140px;}

.slide-prev, .slide-next{position:absolute;background-color:rgba(0,0,0,0.5);width:0;height:50px;color:#FFF;top:40%;z-index:10;text-align:center;cursor:pointer;overflow:hidden;
transition:all 0.2s ease 0s;-webkit-transition:all 0.2s ease 0s;-moz-transition:all 0.2s ease 0s;-o-transition:all 0.2s ease 0s;}
.slide-prev{left:0;border-radius:0 3px 3px 0;-webkit-border-radius:0 3px 3px 0;-moz-border-radius:0 3px 3px 0;}
.slide-next{right:0;border-radius:3px 0 0 3px;-webkit-border-radius:3px 0 0 3px;-moz-border-radius:3px 0 0 3px;}
.slide-prev .icon, .slide-next .icon{line-height:48px;font-size:22px;}


.swiper-slide .i-btn a,
.col-product .i-gallery-title h3,
.col-feature .i-slide-tabs li
{transition:all .5s ease 0s;-webkit-transition:all .5s ease 0s;-moz-transition:all .5s ease 0s;-o-transition:all .5s ease 0s}
.col-feature .i-slide-tabs li
{border-radius:3px;-webkit-border-radius:3px;-moz-border-radius:3px;}


.col-about .i-content
{-moz-box-shadow: 0 1px 10px rgba(0,0,0,0.3);-webkit-box-shadow: 0 1px 10px rgba(0,0,0,0.3);box-shadow: 0 1px 10px rgba(0,0,0,0.3);}

/** ---------------- media ------------------ **/
@media screen and (max-width:1230px){
.swiper-slide{min-height:300px;}

.col-product .i-gallery{height:auto;}
.col-product .i-gitem{position:static !important;float:left;border:none;width:25%;height:auto;}
.col-product .i-gitem a{border:1px solid #EEE;}
.col-product .g0{width:50%;height:auto;}
.col-product .g5{display:none;}
.col-product .i-gallery{margin-bottom:15px;}

.col-about .i-content{left:15px;}

.col-feature .i-content{width:28%;}
.col-feature .i-gallery{width:68%;}
}

@media screen and (max-width:1080px){
.swiper-slide .i-h{font-size:38px;margin-bottom:15px;}
.swiper-slide .i-summary{font-size:18px;margin-bottom:35px;}
.swiper-slide .i-btn a, .swiper-slide .i-btn-1 a{font-size:14px;height:40px;line-height:40px;padding:0 30px;
border-radius:20px;-webkit-border-radius:20px;-moz-border-radius:20px;}

.col-product .i-name span{font-size:12px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.col-product .i-gitem h4{font-size:14px;margin-bottom:20px;}
.col-product .i-gitem h4:after{bottom:-10px;}
.col-product .i-gitem p{color:#FFF;font-size:11px;}
}

@media screen and (max-width:760px){
.col-about, .col-video-news
{margin-bottom:120px;}
.col-about, .col-feature, .col-product{padding:120px 0;}

.swiper-slide{min-height:220px;}
.swiper-slide .i-h{font-size:28px;margin-bottom:12px;}
.swiper-slide .i-summary{font-size:14px;margin-bottom:25px;}
.swiper-slide .i-btn a, .swiper-slide .i-btn-1 a{font-size:12px;height:30px;line-height:30px;padding:0 20px;
border-radius:15px;-webkit-border-radius:15px;-moz-border-radius:15px;}

.col-product .i-title, .col-product .i-summary{width:100%;}
.col-product .i-title{margin-bottom:35px;}
.col-product .i-gallery-title h3{font-size:24px;}

.col-about .i-img{width:98%;}
.col-about .i-img img{min-height:auto;}

.col-video, .col-news{float:inherit;clear:both;width:100%;}
.col-news{margin-top:60px;}

.col-feature .i-content, .col-feature .i-gallery{width:100%;}
.col-feature .i-gallery{margin-top:60px;}

.col-contact .i-box{width:100%;}
}

@media screen and (max-width:640px) {
.col-about, .col-video-news
{margin-bottom:60px;}
.col-about, .col-feature, .col-product{padding:60px 0;}

.swiper-slide{min-height:150px;}
.swiper-button-white{display:none;}
.swiper-slide .i-content{top:16%;}
.swiper-slide .i-h{font-size:20px;font-weight:600;margin-bottom:8px;}
.swiper-slide .i-summary{font-size:12px;margin-bottom:15px;}
.swiper-slide .i-btn a, .swiper-slide .i-btn-1 a{font-size:10px;height:26px;line-height:26px;padding:0 15px;
border-radius:13px;-webkit-border-radius:13px;-moz-border-radius:13px;}

.col-product .i-gallery-title h3{font-size:22px;padding:7px 0;}
.col-product .i-title-summary{margin-bottom:40px;}
.col-product .i-gitem{width:50%;}
.col-product .g0{width:100%;margin-bottom:4px;}
.col-product .g0, .col-product .g1, .col-product .g2{margin-bottom:4px;}
.col-product .g1 a, .col-product .g3 a{margin-right:2px;}
.col-product .g2 a, .col-product .g4 a{margin-left:2px;}

.col-about .i-img{float:inherit;clear:both;width:100%;}
.col-about .i-content{position:static;margin-top:15px;width:100%;}
.col-about .i-content-box{padding:30px;}

.col-news .thumb, .col-news .text{width:100%;}
.col-news .text{margin-top:20px;}
.col-video .i-title{display:none;}
.col-news .i-title{margin:0;}
.col-news .i-title h2 a{font-size:30px;}
.col-news h3 a{font-size:19px;}
.col-news h3, .col-news p{white-space:normal;}

.col-feature .i-slide-tabs li{font-size:12px;}

.col-contact{height:auto;}
.col-contact .floor {margin:60px 0;}
.col-contact .b{padding:30px;}
}