@font-face {
  font-family: 'cwTeXHei';
  font-style: normal;
  font-weight: 500;
  src: url(https://fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.eot);
  src: url(https://fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.eot?#iefix) format('embedded-opentype'),
       url(https://fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.woff2) format('woff2'),
       url(https://fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.woff) format('woff'),
       url(https://fonts.gstatic.com/ea/cwtexhei/v3/cwTeXHei-zhonly.ttf) format('truetype');
}
body {
  overflow-x: hidden;
  font-family: Arial, 文泉驛正黑, "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", 微軟正黑體, "Microsoft JhengHei", 標楷體, DFKai-SB, sans-serif;
  margin:0;
  color:#333;
}
a {outline: none; }
a:hover, a:focus, a:active, a.active {outline: none; }
h1, h2, h3, h4, h5, h6 {font-family: Arial, 文泉驛正黑, "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", 微軟正黑體, "Microsoft JhengHei", 標楷體, DFKai-SB, sans-serif; letter-spacing: 2px; }
input,select,button {font-family: "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", "標楷體", "DFKai-SB", "sans-serif"; letter-spacing: 2px; }


/*--------------------------------------------------------------*/
/*  Header
/*--------------------------------------------------------------*/

/* navbar */
.navbar{z-index:999;box-sizing: border-box; position: fixed; top:0; left:0;right:0;margin:auto;width: 100%; max-width:1680px;transition: 0.2s}
.navbar-header {position: relative;background:#fff;text-align:center;vertical-align: middle }
.navbar-brand {display:inline-block; vertical-align: middle; font-size: 0;}
.navbar-logo {width:100%;padding:10px 0;transition: 0.2s}
.navbar-toggle {display:none; position:absolute;left:40px;border: none;height:100%; background: none; font-size: 1.5em; color: #0e6f41; }
.navbar-toggle:focus {outline: none}
.navbar-collapse {vertical-align: middle ;background:#000000;}
.navbar-nav {display:flex;justify-content: center;margin: 0 auto; width:90%;padding: 0; list-style: none; }
.nn-list-item {position: relative;width:16.666%;line-height:66px; text-align:center;transition: .2s}
.nn-list-item:hover {background:rgba(255,255,255,0.2)}
.nn-list-item:hover .navbar-subnav{visibility: visible; opacity: 1;}
.nn-list-item:hover .nn-link{text-shadow:0 0 10px #0e6f41;}
.nn-link{display:inline-block; color:#fff; font-size: 1.1em; text-decoration: none; transition: 0.2s }
.navbar-short .navbar-logo { width:300px;padding:5px 0;}
.navbar-short .nn-list-item {line-height:50px;}

@media (max-width: 1024px) {
  .navbar-toggle{display:inline-block;}
  .navbar-brand {padding-right:10px;}
  .navbar-weblink {display:none;}
  .navbar-nav {display:none;position:fixed;left:0;top:75px;width:100%;padding:10px 0 ;background:#000000; text-align: center;box-shadow: 2px 2px 15px rgba(0,0,0,0.2);}
  .navbar-logo { width:300px !important;padding:5px 0 !important;}
  .nn-list-item {position: relative; display:block;width:100%;line-height:40px !important;}
  .nn-list-item:hover .navbar-subnav{display:block;}
}

@media (max-width: 480px) {
  .navbar-nav {top:58px;}
  .navbar-logo{width:240px!important}
  .navbar-toggle{left:10px;}
}


/* banner */
.header {position:relative;left:0;right:0;margin:186px auto 0 auto; width:100%; max-width: 1680px;height:450px;}
.header .owl-theme {position: relative; padding: 0; height: 100%;}
.header .owl-theme div:not(.owl-controls) {height: 100%; }
.header .owl-theme .owl-slide { background-repeat: no-repeat; background-size: cover; background-position: center; }
.header-search{ z-index: 99;position: absolute; left: 50%;top:50%; width:100%;text-align:center;color:#fff;text-shadow: 2px 2px 10px rgba(0,0,0,.5), 2px 2px 1px rgba(0,0,0,1);transform:translate(-50%,-50%);}
.header-search-input{margin-right:0px;border-color:#000!important;}

@media (max-width: 1024px) {
  .header {margin-top: 66px;height:300px;}
}

@media (max-width: 480px) {
  .header {margin-top: 58px;height:200px;}
  .header-search-input{width:280px;}
}

/* owl.carousel */
.owl-theme .owl-text {position: absolute; bottom: 10px; left: 2em; }
.owl-theme .owl-dots {top:auto; bottom: 20px; width: 100%; text-align: center; }


/*--------------------------------------------------------------*/
/*  Article, Layout
/*--------------------------------------------------------------*/

/*article*/
.article{margin:240px auto 50px auto;max-width:1440px;min-width:320px;}
.article-header{box-sizing: border-box;margin:53px auto 20px auto;width:86%;padding:0;}
.article-hr{margin:0 auto 20px auto;width:86%;height:5px;background:#0e6f41;}
.article-title{margin:0;font-size: 2em;color:#0e6f41;}
.article-subtitle{margin-bottom:6px;font-size: 1.8rem;color:#0e6f41;}
.article-content{box-sizing: border-box;margin:0 auto;width:86%;padding:0 0px;font-size: 1.1em;line-height:1.8em;text-align: justify; text-justify: inter-ideograph;}
.article-img{width:500px;}
.article-content-title{margin:0;font-size: 1.8em;font-weight: 100}
.article-content-part{padding-bottom:56px;}
.article-h3{margin:0;font-size: 1.2em;color:#0e6f41;}
.article-h4{margin:0;font-size: 1.2em;}
.article-p{margin:0 0 20px 0;font-size: 1em;}
.article-content .article-p:last-child{margin-bottom:0;}
.article-backpage{float:left;font-size:2em;text-decoration: none;color:#000;}
.article-backpage:hover{color:#0e6f41;}

@media (max-width: 1024px) {
  .article{margin-top:100px;}
}

@media (max-width: 768px) {
  .article-content{width:90% !important;padding:0 !important;font-size:1em !important;}
  .article-header{margin:30px auto 20px auto!important;width:90% !important;padding:0;}
  .article-title{font-size:1.6em !important;margin: 0;}
  .article-subtitle{font-size:1.6em !important;}
  .article-img{width:100%;}
  .article-hr{width:90%;}
}

@media (max-width: 480px) {
  .article{margin-top:70px}
  .article-header{margin:20px auto !important;}
  .article-title{font-size:1.4em !important;}
  .article-img{width:100%;}
  .article-hr{height:3px;}
}

/*page*/
.page-control{padding-top:20px;text-align:center;}
.page-link{display:inline-block;margin:0 4px;border-radius:5px;padding:2px 26px;background: #0e6f41;color:#fff;font-weight:bold;font-size:1.2em;text-decoration: none;opacity:.7;transition: .2s}
.page-link:hover{opacity:1;}
.page-link-active{opacity:1;}


/*--------------------------------------------------------------*/
/*  Footer
/*--------------------------------------------------------------*/

.footer{clear:both;margin-top:0;padding:20px 0;background:#000000;}
.footer-text{box-sizing:border-box;margin:0 auto;width:86%;padding:0 20px;color:#fff;font-size: 1.1em;line-height: 2em}
.footer a{text-decoration: none;color:#fff;}
.footer a:hover{text-decoration: underline;color:#fff;}

@media (max-width: 768px) {
  .footer{padding:20px 0;}
  .footer-text{line-height: 1.5em}
}

@media (max-width: 480px) {
  .footer{font-size: .9em}
}


/*--------------------------------------------------------------*/
/*  Index
/*--------------------------------------------------------------*/

.index-article {margin:0 auto;}
.index-article .article-header{box-sizing: border-box;margin:70px auto 50px auto;width:86%;padding:0 30px;}
.index-article .article-title{margin:0;text-align:center;font-size: 2.2em;color:#0e6f41;}
.index-article .article-title:before{content:"—";padding-right:5px;}
.index-article .article-title:after{content:"—";padding-left:5px;}


/*--------------------------------------------------------------*/
/*  Floor, Product
/*--------------------------------------------------------------*/

.product-list{display:flex;margin:0;padding: 0;list-style: none;flex-wrap: wrap}
.product-list-item{box-sizing: border-box;margin: 0 10px 35px 10px;border:1px solid #ccc;width:calc(33.333% - 20px); padding: 10px;}
.product-img{margin:0;width:100%;height:210px; border-radius:5px;background:no-repeat center;background-size: cover}
.product-title{clear:both;margin:0;padding:10px 0;font-weight: 400;color:#0e6f41;}
.product-text{margin:0;font-size:0.96em;line-height:1.4em;}
.product-link{color:#333;text-decoration: none;transition: 0.2s}
.product-link:hover{text-decoration: none;color:#0e6f41;}
.product-article{}
.product-article-header{display: flex;justify-content: space-between;}
.pah-pic{width:50%;}
.pah-title{margin-bottom:10px;line-height: 46px}
.pah-content{width:calc(50% - 20px);line-height: 30px}

.map{position: relative;}
.map-img{width:100%;}
.map-marker{position: absolute;}

.tower-table {max-width:800px;}
.tower-table th{background:#000;}
.tower-table tr:nth-child(odd) {background: #fff; }
.tower-table tr:nth-child(even) {background: #F5FAFA;}

.tower-article{display:flex;flex-wrap: wrap}
.tower-article-info{width:40%;}
.tower-article-map{width:60%;}
.tower-article-list{margin:20px 0 30px 0;padding:0;list-style:none}
.tower-article-item{margin:0;padding:0;list-style:none}

@media (max-width: 768px) {
  .product-list-item{margin-bottom:15px;width:calc(50% - 20px);font-size: .9em;}
  .tower-article-info{width:100%;}
  .tower-article-map{width:100%;}
}

@media (max-width: 640px) {
  .product-article-header{display:block;}
  .pah-pic{width:100%;height:100%;}
  .pah-title{line-height: 1.8rem}
  .pah-content{width:100%;}
}

@media (max-width: 480px) {
  .product-list-item{width:100%;font-size: .9em;}
  .product-img{height:200px;}
}

@media (max-width: 480px) {
  .product-img{height:150px;}
}


/*--------------------------------------------------------------*/
/*  Tool
/*--------------------------------------------------------------*/

/*ui*/
.ui-input{display:inline-block;box-sizing:border-box;border:1px solid #ddd;padding:8px 10px;background:#f2f0f0;font-size:18px;}
.ui-select{display:inline-block;box-sizing:border-box;border:1px solid #ddd;padding:8px 10px;background:#f2f0f0;font-size:18px;}
.ui-link{text-decoration: none;color:#666;}
.ui-link:hover{text-decoration: underline;}
.ui-btn-submit{width:100%;}
.ui-btn{box-sizing:border-box;display:inline-block;border:none;padding:9px 20px;background:#000000;color:#fff;font-size:18px;text-decoration: none;transition: .2s}
.ui-btn:hover{background:#999;}
.ui-btn-light{box-sizing:border-box;display:inline-block;border:none;border-radius:5px;padding:5px 10px;line-height:18px;background:#bbb;color:#fff;font-size:20px;transition: .2s}
.ui-btn-info{border: 1px solid rgba(0,0,0,0.2);padding:7px 25px;border-radius:30px;color:#333;font-size: 1.1em;text-decoration: none;transition: 0.2s}
.ui-btn-info:hover{border:1px solid #25a5d7;background: #25a5d7;color: #fff}
.ui-btn-info-white{border: 1px solid rgba(255,255,255,.2);padding:7px 25px;border-radius:30px;color:#fff;font-size: 1.1em;text-decoration: none;transition: 0.2s}
.ui-btn-info-white:hover{border:1px solid #25a5d7;background: #25a5d7;color: #fff}
.ui-file{padding:10px;border:1px dashed #ccc}
.ui-form hr{margin:40px 0;border:none;border-top:1px dashed #ccc;}
.ui-block {display: flex;justify-content: space-around;flex-wrap: wrap}
.ui-block .ui-block-helf{width:50%;}
.form-control{display:flex;flex-wrap:wrap;justify-content: space-between;margin-bottom: 20px}
.form-control .ui-input,.form-control .ui-select{width:calc(50% - 5px);}

@media screen and (max-width: 480px) {
  .form-control {margin-bottom:10px;}
  .form-control .ui-input{margin-bottom:10px;}
  .form-control .ui-input:last-child{margin-bottom:0;}
  .form-control .ui-input,.form-control .ui-select{width:100%;}
}

/*table*/
.ui-table {margin:0 auto;width:100%;border-spacing: 0px;}
.ui-table th{padding:10px 10px ;background:#999;color:#fff;font-weight: normal;font-size:18px;}
.ui-table td{padding:13px 10px;border-bottom:1px solid #d9d9d9;}
.ui-table tr{transition: .2s}
.ui-table tr:hover{background:#ddd;}
.ui-table .active{background:#fef4e5;}
.ui-table .delete {display: inline-block; margin:0 14px 0 0;width:16px;height:16px;border-radius:50%;text-align:center;background:#5cc2cf;color:#fff;font-size:13px;font-weight: bold;line-height: 16px;cursor: pointer}
.ui-table .add,.ui-table .subtract{display: inline-block;box-sizing:border-box;width:25px;height:25px;line-height:25px;border:1px solid #bcbcbc;vertical-align: middle;cursor: pointer;transition: 0.2s}
.ui-table .add:hover,.ui-table .subtract:hover{border-color:#f39800;background:#f39800;color:#fff;}
.ui-table a{text-decoration:none;color:#0e6f41;}
.ui-table a:hover{text-decoration:underline;}
.ui-table .label{display:inline-block;padding:6px 10px;border-radius:5px;background:#f39800;color:#fff;font-size: 15px}
/*.ui-table tbody tr td:nth-child(2){text-align: left}*/

@media screen and (max-width: 667px) {
  .ui-table th {display: none; }
  .ui-table td {display: block; border: none; text-align:left!important;}
  .ui-table td:before {content: attr(data-th) " : "; font-weight: bold; }
  .ui-table td {padding:10px;background:#ddd;text-align:left;}
  .ui-table td:nth-child(even) {background:#eee;}
  .ui-block .ui-block-helf{width:100%;}
}

.img-response{width:100%;}

/*effect*/
.fx-opacity0{opacity:0;}
.fx-opacity25{opacity:.25;}
.fx-opacity50{opacity:.5;}
.fx-opacity100{opacity:1;}
.d-none{display:none!important;}

/*flaticon*/
.fa-sign-out-option{background-image: url(../images/icon-sign-out-option.svg)}

/*color or bg*/
.color-purple{color:#431199;}
.color-orange{color:#ea7a48}
.color-orangelight{color:#fde7d5}
.color-red{color:#c00!important}
.color-clay{color: #999}
.bg-cover{background-repeat:no-repeat;background-position:center;background-size:cover;}
.bg-clay{background-color: #999}
.bg-claylight{background-color: #eee}
.bg-red{background-color:#c00}
.bg-orangelight{background-color:#fccfab}
.bg-pruplewhite{background-color: #e7e3f6}
.bg-linear{background: linear-gradient(0deg, rgba(0, 0, 0,.1) 0%,  rgba(0, 0, 0,0) 20%);}

/*float align*/
.flex-center{display:flex;justify-content:center;align-items:center}
.float-left{float:left;}
.float-right{float:right;}
.float-center{margin:0 auto;}
.text-left{text-align:left !important}
.text-right{text-align:right !important}
.text-center{text-align:center !important}
.text-justify {text-align: justify; text-justify: inter-ideograph; -ms-text-justify: inter-ideograph; /*IE9*/ -moz-text-align-last:justify; /*Firefox*/ -webkit-text-align-last:justify; /*Chrome*/ }
.text-justify:after {content: ''; display: inline-block; width: 100%; height:0; line-height:0; font-size:0; }
.valign-box{display:inline-block;vertical-align:middle;width:0;height:100%;visibility:hidden;}

/*clear*/
.clear-left{clear:left;}
.clear-right{clear:right;}
.clear-both{clear:both;width:100%}
.clear-fix{clear:both;}
.clear-fix:after{content:".";clear:both;display:block;font-size:0;height:0;line-height:0;visibility: hidden;}