@charset "utf-8";
/* CSS Document */
.mt40{ margin-top: 40px;}
/*ad-banner*/
.ad-banner{ width: 100%; height:200px; position: relative;}
.ad-banner img{ max-width: 100%; display: none;}
.ad-banner .ad-title{/* position: absolute; left: 0; top: 50%;margin-top:-24px;*/  text-align: left; width: 100%;}
.ad-title h3{ font-size: 24px;  color: #fff; line-height:36px;font-weight:normal; position: relative; text-transform: uppercase; }
.ad-title h3:before{position: absolute; left: 0; top: -10px; content:""; width:30px; height:2px; background: #2aabd2; }
.ad-title p{  color: #fff; line-height:20px; margin-bottom: 0;}

/*麵包屑導航*/
.location-bg{ width:100%; height:36px; line-height: 36px; background: #eee;}
.location-bg a{ margin: 5px;}

/*===============联系我们==================*/
.contact-us-box{ margin-top: 40px; }
.contact-us-box .contact-us-left{ width:60%; float: left; }
.contact-us-box .contact-us-left h1{ margin-bottom: 20px;}
.contact-us-box .contact-us-left p{ font-size: 16px; line-height: 36px; }
.contact-us-box .contact-us-left p span{  display:inline-block;  }
.contact-us-box .contact-us-right{ width:40%; float: right; }

.contact-us-box .contact-us-right .form .form-input{margin:8px auto; width: 100%;}
.contact-us-box .contact-us-right .form .form-input span{display: block; height:24px; line-height:24px;}
.contact-us-box .contact-us-right .form .form-input input{ display: block;width:100%; height:40px; padding:10px 12px;  background: #fff; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;border:solid 1px #eee; }
.contact-us-box .contact-us-right .form .form-input textarea{display: block;width:100%;line-height:22px;padding:10px 20px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background: #ffffff;  -webkit-border-radius:0;min-height: 80px; resize:none; border:solid 1px #eee; font-family:"Microsoft JhengHei"; }

.contact-us-box .contact-us-right .form .form-button{width:160px; margin-top:20px;padding:10px 20px; height:30px; line-height:30px;background: #2196ce; cursor: pointer;}
.contact-us-box .contact-us-right .form .form-button #form-btn1{ width:100%; background: #2196ce; border: none; color: #fff;cursor: pointer;}

/*=================活動資訊===============*/
.news-list-box ul.UL{ margin:40px 0; }
.news-list-box ul.UL li{ background: #fff; width:auto; float:left;-webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition:  all .4s ease;  -o-transition:  all .4s ease; transition: all .4s ease; padding: 10px; border-radius: 5px; margin: 3px; box-sizing:border-box;  -moz-box-sizing:border-box;  -webkit-box-sizing:border-box; margin: 5px 0; }
.news-list-box ul.UL li div{ width:270px; margin: 0 auto; /* opacity:0; filter:alpha(opacity=0);*/}
.news-list-box ul.UL li div.news-img{overflow:hidden;width:270px; height: 190px;}
.news-list-box ul.UL li div.news-img img{ max-width: 100%;width:270px; height: 190px;-moz-transition: -moz-transform .8s ease-in-out;  -webkit-transition: -webkit-transform .8s ease-in-out;  transition: transform .8s ease-in-out;}
.news-list-box ul.UL li h4{ font-size: 20px;line-height: 50px;  height:50px; font-weight:normal; color: #414141; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; margin-top:20px;-webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition:  all .4s ease;  -o-transition:  all .4s ease; transition: all .4s ease;}
.news-list-box ul.UL li p{ margin-top:8px; color: #6b6b6b; font-weight: normal; line-height: 25px;-webkit-transition: all .4s ease; -moz-transition: all .4s ease; -ms-transition:  all .4s ease;  -o-transition:  all .4s ease; transition: all .4s ease;}
.news-list-box ul.UL li em{ font-style: normal; margin-top:18px; color: #2196ce; display:block;}

.news-list-box ul.UL li:hover{ -moz-box-shadow:0 0 15px rgba(0,0,0,0.15);  -webkit-box-shadow:0 0 15px rgba(0,0,0,0.15);box-shadow:0 0 15px rgba(0,0,0,0.15);}
.news-list-box ul.UL li:hover div.news-img img{-ms-transform: scale(1.1);  -webkit-transform: scale(1.1);  transform: scale(1.1);}
.news-list-box ul.UL li:hover h4{color: #2196ce;}
.news-list-box ul.UL li:hover p{color: #414141;}

/*翻頁*/
.Page{ text-align: center; margin:80px 0 120px;}
.pagination>li{ display: inline-block;}
.pagination>li>a, .pagination>li>span{ color: #444; text-align: center;}
.pagination>li>a, .pagination>li>span{ padding: 8px 15px; font-size: 16px;  text-decoration: none;  color: #555555;  background-color: #f6f6f6;  border: 1px solid #dddddd;  margin-left: -1px; border-radius:2px;}
.pagination>.active>a, .pagination>.active>a:focus, .pagination>.active>a:hover, .pagination>.active>span, .pagination>.active>span:focus, .pagination>.active>span:hover, .pagination>li:hover a{ background: #2196ce;border: solid 1px #2196ce; color: #fff; }

/*=============文章詳情======================*/
.news-article{padding: 40px 0;}
.news-left{ width:76%; float: left; }
.news-right{ width:20%; float:right;}
.news-right .news-title{ border-bottom: solid 1px #eee; position: relative;  height: 40px;}
.news-right .news-title h2{position:absolute; left: 0; top: -1px; border-bottom:solid 2px #2196ce;line-height: 40px; padding:0 3px; }
.news-right .hot{border-left: solid 1px #eee;border-right: solid 1px #eee;}
.news-right .hot li{line-height:24px; padding:0 3px; /*overflow: hidden; white-space:nowrap; text-overflow:ellipsis;*/ padding:15px; border-bottom: solid 1px #eee; }

/*文章*/
.article-title{ border-bottom: solid 1px #eee; padding:0 0 15px; text-align: center;}
.article-title h1{ margin-bottom: 16px;}
.article-title p{}
.news-article-text{ margin-top: 20px;}
.news-article-text p{ margin:0; line-height:24px;}
.news-article-text p img{ max-width: 100%; display: block; margin: 0 auto;}

/*==============公司簡介===================*/
/*left*/
.aboutus_left{width: 60%; float:left;}
.aboutus_left h4{ margin-bottom: 10px;}
/*right*/
.aboutus_right{ width:38%; float:right;}
.aboutus_right img{ max-width:100%; }
.team-six{ margin: 30px;}
.team-six li{width:25%; float: left; }
.team-six li img{max-width:100%;}
.team-six li .team-member{ padding: 15px; text-align: center;}


/*==============产品展示================*/
.product-box｛｝
.product-title{ text-align: center; margin:60px 0 60px;}
.product-title li{ display:inline-block; text-align: center; background: #0ca4d2; margin:0 3px; }
.product-title li a{padding:3px 15px; color: #fff; display:block; height: 30px; line-height: 30px;}
.product-title li:hover,.product-title li.active{ background:#0b5bc7; -webkit-transition:all .5s ease; transition:all .5s ease;}

.product-item{ margin:60px 0; overflow: hidden;}
.product-item li{ width:25%; float: left;}
.product-item li .widget {margin-right:10px;margin-bottom:10px;border-radius:0px;border-radius:0;}
.product-item li .widget .img-holder {position:relative;overflow:hidden;}
.product-item li .widget .img-holder img {width:100%;display: block;}
.product-item li .widget .img-holder .overlay {position:absolute;left:0;right:0;bottom:0;background:rgba(30,139,195,0.5);text-align:center;-webkit-transition:all .3s ease;transition:all .3s ease; height: 38px; overflow:hidden;}
.product-item li .widget .img-holder a {color:#fff;}
.product-item li .widget:hover .img-holder .overlay { height:100%;}
.product-item li .widget .img-holder .overlay .inner{display:table;width:100%;height:100%;position:relative;}
/*.product-item li .widget .img-holder .overlay .inner:before {content:'';position:absolute;top:8px;left:8px;right:8px;bottom:8px;border:1px solid rgba(255,255,255,0.5);}*/
.product-item li .widget .img-holder .overlay .social{display:table-cell;vertical-align:middle;position:relative;padding:0 15px;}
.product-item li .widget .img-holder .overlay .social p{ color: #fff;padding:10px; border-top: solid 1px #fff; display: inline-block;}
.product-item li .widget .img-holder .overlay .social h4{text-transform:uppercase;color:#fff; height:38px; line-height:38px;margin:0;font-size:18px; font-weight:normal;-webkit-transition:all .3s ease;transition:all .3s ease;overflow:hidden;}

.product-item li .widget .content-holder {text-align:center;background:#fff;display:block;margin-top:0px;padding:16px 20px 12px;}
.product-item li .widget .content-holder:before {background:#2574a9;}
.product-item li .widget:hover .content-holder {border-top-color:#2574a9;}
.product-item li .widget:hover .content-holder:before {-webkit-transform:scaleY(1);transform:scaleY(1);}
.product-item li .widget:hover .content-holder h4 {color:#fff;}
.product-item li .widget:hover .content-holder p {color:#fff;}


/*==============产品详情页================*/
.product-article dt{ width:55%; float: left; margin-right: 5%;}
.product-article dd{}
.product-article .swiper-container { margin-left:auto;margin-right:auto;position:relative;overflow:hidden;z-index:1;}
.product-article .swiper-slide {text-align:center;font-size:18px;background:#fff;display:flex;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;align-items:center;}
.product-article .swiper-wrapper {position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:flex;transition-property:transform;box-sizing:content-box}
.product-article .swiper-slide{-webkit-flex-shrink:0;-ms-flex:0 0 auto;flex-shrink:0;width:100%;height:100%;position:relative}
.product-article .swiper-slide img{ max-width: 100%; display:block;}
.product-article .swiper-container-autoheight,.product-article .swiper-container-autoheight .swiper-slide {height:auto}
.product-article .swiper-container-autoheight .swiper-wrapper {align-items:flex-start;transition-property:transform,height}
.product-article .swiper-container .swiper-notification {position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}
.product-article .swiper-pagination { bottom: 5%;  right:18px;   position: absolute;  text-align:right;  transform: translate3d(0px, 0px, 0px); transition: all 0.3s ease 0s;  z-index: 10; padding-right:0%;}
.product-article .swiper-container-horizontal>.swiper-pagination-bullets{bottom:20px;width:100%; text-align: center;}
.product-article .swiper-pagination-bullet{display:inline-block;margin:0 10px; position: relative; text-align:left; font-size:18px; color: #fff; font-weight:300;}
.product-article .swiper-container .swiper-button-next,.product-article .swiper-container .swiper-button-prev{position: absolute; top: 50%;  width: 27px;  height: 44px;  margin-top: -22px; z-index: 10; cursor: pointer;}
.product-article .swiper-container .swiper-button-next{left: 0;}
.product-article .swiper-container .swiper-button-prev{ right: 0;}
.gallery-top { height: 85%;  width: 100%;}
.gallery-thumbs { height: 15%;  box-sizing: border-box; padding: 10px 0;}
.gallery-thumbs .swiper-slide{ width: 20%; height: 100%; opacity: 0.4;}
.gallery-thumbs .swiper-slide-active { opacity: 1;}

.product-article dd h1{ margin-bottom: 16px}
.product-article dd p{line-height: 26px;}

.product-article-item{border-left: solid 1px #eee;border-right: solid 1px #eee;}
.product-article-item li{ padding:15px; border-bottom: solid 1px #eee; }
.product-article-item li .holder{}
.product-article-item li .holder img{max-width:100%;-moz-transition: -moz-transform .8s ease-in-out;  -webkit-transition: -webkit-transform .8s ease-in-out;  transition: transform .8s ease-in-out;}
.product-article-item li .holder h4{ font-weight:normal; line-height:26px; margin-top:10px; text-align: center; }
.product-article-item li:hover .holder img{-ms-transform: scale(1.05);  -webkit-transform: scale(1.05);  transform: scale(1.05);}

@media only screen and (max-width:1360px){
    /*新闻资讯*/
    .news-list-box ul.UL li{padding: 9px;}
    .news-list-box ul.UL li div{ width:220px;}
    .news-list-box ul.UL li div.news-img{width:220px; height: 155px;}
    .news-list-box ul.UL li div.news-img img{width:220px; height: 155px;}

}