@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;text-decoration: 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:1440px;transition: 0.2s;background-color: #FFF}
.navbar-short .navbar-header{background:#FFF}
.navbar-short .navbar-collapse {top:30px;}
.navbar-header {position: relative;height:100px;transition: .2s}
.navbar-logo {height:84px;transition: 0.2s;margin-top: 10px;}
.navbar-toggle {display:none; position:absolute;right:20px;border: none;height:100%; background: none; font-size: 1.5em; color: #6bc2b3 ;    text-shadow: 0 0 5px rgba(0,0,0,0); }
.navbar-toggle:focus {outline: none}
.navbar-collapse {position:absolute;top:30px;left:240px;transition: .2s}
.navbar-nav {display:flex;justify-content: center;margin: 0 auto; width:100%;padding: 0; list-style: none; }
.nn-list-item {display: flex;align-items: center;justify-content: center;position: relative;margin:0 16px;text-align:center; font-size: 1.1em; font-weight:bold;transition: .2s}
.nn-list-item .fa-facebook-f{width:16px;line-height:16px;border-radius:20%;text-align:center;padding:2px;font-size:15px;background:#3b5988;color:#fff;}
.nn-list-item:hover .nn-link{color:#45a786;}
.nn-link{display:inline-block; padding:10px 10px; color:#4f4e4e;text-shadow:0 0 5px rgba(237,195,95,0);text-decoration: none; transition: 0.2s }

@media (max-width: 1280px) {
  .nn-list-item {margin:0 10px}
}

@media (max-width: 1024px) {
  .navbar-header {height: 100px!important;}
  .navbar-toggle{display:inline-block;}
  .navbar-brand {margin-top:10px!important;}
  .navbar-nav {display:none;position:fixed;left:0;top:100px;width:100%;padding:10px 0 ;background:rgba(107,194,179,.9); text-align: center;box-shadow: 2px 2px 15px rgba(0,0,0,0.2);}
  .navbar-logo { height:84px !important;margin-top: 0;}
  .nn-list-item {margin:0;width:100%;line-height:40px !important;}
}

@media (max-width: 640px) {
  .navbar-header {height: 80px!important;background-size:cover!important;}
  .navbar-nav {top:80px;}
}


/* banner */
.header {position:relative;left:0;right:0;margin:100px auto 0 auto; width:100%; max-width: 1440px;height:450px;}
.header-banner{height: 100%;max-width: 1440px;}
.header-banner:hover .header-banner-icon{opacity:1;}
.header-banner .owl-stage {height: 100%;}
.header-banner .owl-item {height: 100%;}
.header-banner .owl-stage-outer{height: 100%;}
.header-banner .owl-slide{height: 100%;}
.header-banner-link {display:block;height: 100%;}
.header-banner-item {background-repeat: no-repeat; background-size: cover; background-position: center; }
.header-banner-video{cursor:pointer;}
.header-banner-icon{ z-index: 99;position: absolute; left: 50%;top:50%;width:100px!important;transform:translate(-50%,-50%);opacity:.3;transition: .2s}
.header-text{ z-index: 99;position: absolute; left: 50%;top:50%; 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-t1{ text-align:center; font-size: 3em; line-height:1.6em;letter-spacing: .2em;}
.header-t2{ padding-bottom: 0px;text-align:center; font-size: 1.4em;font-weight: bold}
.header-size-s{ height:360px; }
.video{margin-top:20px;height:500px;}

@media (max-width: 1024px) {
  .header {margin-top: 66px;}
  .header-size-l { height:339px; }
  .header-size-s { height:250px; }
  .header-t1{ font-size: 1.8em; }
  .header-t2{ font-size: 1.2em;}
  .video{margin-top:15px;height:420px;}
}

@media (max-width: 640px) {
  .header-size-l { height:200px; }
  .header-size-s { height:200px; }
  .header-t1{ font-size: 1em; }
  .header-t2{ font-size: 1em;}
  .video{margin-top:10px;height:320px;}
}

@media (max-width: 480px) {
  .header {margin-top: 80px;}
  .video{margin-top:5px;height:240px;}
  .header-size-s{ height:100px; }
}

/* 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:0 auto 0 auto;max-width:1440px;min-width:320px;}
.article-header{box-sizing: border-box;margin:20px auto 20px auto;width:86%;padding:0 30px;}
.article-title{margin:0;font-weight:800;font-size: 2em;}
.article-subtitle{margin-bottom:6px;font-weight:normal;font-size: 1.4rem;}
.article-content{box-sizing: border-box;margin:0 auto;width:86%;padding:0 30px;color:#333;font-size: 1.1em;line-height:1.8em;}
.article-photo{display: flex;flex-wrap:wrap;margin:30px 0 0 0;padding:0;list-style:none;}
.article-photo-item{margin-bottom:10px;width:100%;}
.article-photo-pic{width:80%;padding-top: 80px;}
.article-photo-text{display: flex;align-items: center; padding: 0 40px 20px 40px;color: #FFF}
.article-photo-text .fa{margin-top:5px;margin-right:5px;transform: scaleY(1.6) translateY(15%)}
.article-photo-2row .article-photo-item{width:calc(50% - 0px);}
.article-photo-2row .article-photo-item:nth-child(2n){margin-right:0;}
.article-photo-3row .article-photo-item{margin-right:10px;width:calc(33.333% - 10px);}
.article-photo-3row .article-photo-item:nth-child(3n){margin-right:0;}
.mapitem {width: 49%;}
.service-list {width: 23%;display: block;float: left;margin: 0 1% 0 1%; }
.pic-title{ text-align: center;z-index: 998;position: absolute;color: #FFF;font-size: 1.5em;width: 95%;padding-top: 30px; max-width: 1175px;font-weight: 800; margin: 0 auto;}
.fbframe {margin: 20px 20px 10px 20px;}
@media (max-width: 1024px) {
  .article{}
}

@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%;}
  .service-list {width: 48%; }
}

@media (max-width: 480px) {
  .article-header{margin:20px auto !important;}
  .article-title{font-size:1.4em !important;}
  .article-img{width:100%;}
  .article-hr{height:3px;}
  .article-photo-2row .article-photo-item{margin-right:0;width:100%;}
  .article-photo-3row .article-photo-item{margin-right:0;width:100%;}
  .mapitem {width: 100%;}
  .article-photo-pic{width:100%;padding-top: 50px;}
  .pic-title {position: relative;padding: 0;width: 100%; padding-top: 30px;}
  .fbframe {margin: 20px 0;}
}

/*page*/
.page-control{padding-top:20px;text-align:center;}
.page-link{display:inline-block;margin:0 4px;border-radius:5px;padding:2px 26px;background: #68b554;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:26px auto 26px auto;max-width:1440px;padding:0 30px;height: 100px;}
/* .footer-link{display:flex;justify-content:center;align-items: center;flex-wrap: wrap;} */
.footer-link-item{display: inline-block;box-sizing:border-box;height:40px;line-height: 40px;padding:0 5px;font-size: 20px}
.footer-link-pic{height:100%;}
.footer-link .fa-facebook-f{margin-right:5px;width:16px;line-height:16px;border-radius:20%;text-align:center;padding:2px;font-size:15px;background:#3b5988;color:#fff;}
.footer-copyright{display:flex;justify-content:center;align-items: center;flex-wrap: wrap; text-align: center;}
.footer-copyright a{display: inline-block;}
.footer a{text-decoration: none;color:#3b5988;}
.footer a:hover{text-decoration: underline;color:#00f;}

@media (max-width: 480px) {
  .footer{margin:0 auto}
  .footer-copyright a{display: block;}
  .footer-copyright img{display: block;height:45px;}
}

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

.index-article {margin:0 auto;max-width: 1440px}
.index-pic-pc{width: 100%;}
.index-pic-mobile{display: none;width: 100%;}

@media (max-width: 768px) {
  .index-pic-pc{display: none;}
  .index-pic-mobile{display: block;}
}


/*--------------------------------------------------------------*/
/*  About
/*--------------------------------------------------------------*/

.about{}
.about .article-content{font-size:24px;}
.about-link{margin-top:40px;}
.about-link-title{margin-top:20px;font-weight:bold}
.about-link .fa{width:20px;line-height: 20px;text-align: center}
.about-link-pic{display: block;margin-top:30px;}
.about-link a{text-decoration: none;color:#333;}
.about-link a:hover{color:#00f;}


/*--------------------------------------------------------------*/
/*  street
/*--------------------------------------------------------------*/
.street-map{position:relative;margin-top:20px;}
.street-map-link{position: absolute;}
.street-img{margin:0;width:100%; border-radius:5px;background:no-repeat center;background-size: cover}
.street-list{margin:0;padding:0;list-style:none}
.street-list-item{margin: 0 0px 0px 0px;padding: 10px 0;font-size: 1.1em}
.street-item-link{color:#333;text-decoration: none;transition: 0.2s}
.street-item-link:hover{text-decoration: none;color:#00f;}
.street-item-no{display: inline-block;border-radius: 50%;width:30px;line-height: 30px;text-align: center;background:#f44336;color:#fff;}
.street-title{clear:both;margin:0;padding:10px 0;font-weight: 400;color:#68b554;}
.street-text{margin:0;font-size:0.96em;line-height:1.4em;}
.street-url{margin:0;padding:0;list-style:none}
.street-url-item{padding:0px 0;}
.street-url-link{color:#333;text-decoration: none;transition: 0.2s}
.street-url-link:hover{text-decoration: none;color:#00f;}
.street-url .fa{border-radius: 10%;width:20px;line-height: 20px;text-align: center;}
.street-url .fa-instagram{color:#127997;}
.street-url .fa-comment{color:#00B900;}
.street-url .fa-youtube{color:#c4302b;}
.street-url .fa-facebook-f{color:#3b5998;}

@media (max-width: 480px) {
  .street-class{width:100%;}
  .street-list{margin:10px auto 30px auto;width:90%;}
  .street-list-item{padding:5px 0;}
}


/*--------------------------------------------------------------*/
/*  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-btnd-submit{width:100%;}
.ui-btnd{outline:none;box-sizing:border-box;display:inline-block;border:none;border-radius:10px;padding:8px 20px;background-color:#FFF;color:#1f73a7;font-size:20px;font-weight:800;text-decoration: none;transition: .2s; cursor: pointer;}
.ui-btnd:hover{background-color:rgb(139, 190, 231);color:white;}


.ui-btnd-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-btnd-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-btnd-info:hover{border:1px solid #25a5d7;background: #25a5d7;color: #fff}
.ui-btnd-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-btnd-info-white:hover{border:1px solid #25a5d7;background: #25a5d7;color: #fff}

.ui-btnf-submit{width:100%;}
.ui-btnf{outline:none;box-sizing:border-box;display:inline-block;border:none;border-radius:10px;padding:8px 20px;background-color:#FFF;color:#6bc2b3;font-size:20px;font-weight:800;text-decoration: none;transition: .2s;cursor: pointer;}
.ui-btnf:hover{background-color:rgb(159, 219, 154);color:white;}

.ui-btnf-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-btnf-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-btnf-info:hover{border:1px solid #25a5d7;background: #25a5d7;color: #fff}
.ui-btnf-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-btnf-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: 0 0px;}
.ui-table th{border-right:1px solid #fff;padding:10px 10px ;background:#999; text-align:center;color:#fff;font-size:12px;}
.ui-table td{border-right:1px solid #fff;padding:10px 10px; }
.ui-table tr{transition: .2s}
.ui-table tr:hover td{background-color: #fef4e5!important}
.ui-table tr:hover{position: relative; outline: 1px #333; box-shadow: 0 0 15px rgba(0,0,0,.15)}
.ui-table tr:nth-child(2n) td{background-color: #f2f7fc}
.ui-table tr th:last-child,.ui-table tr td:last-child{border-right:none;}
.ui-table td a{color:#333;}
.ui-table .active{background:#fef4e5;}
.ui-table .danger{background:#ffeeba;box-shadow: 0 0 10px rgba(204,0,0,.3)}
.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:12px;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:#1472bc;}
.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: 12px}

.ui-table-clear {margin:0 auto;width:100%;border-spacing: 0 0px;}
.ui-table-clear th{border-top:1px solid #ddd;padding:10px 10px ;background:#005dc7; text-align:center;color:#fff;font-size:12px;}
.ui-table-clear td{border-top:1px solid #ddd;padding:10px 10px; }
.ui-table-clear tr{transition: .2s}
.ui-table-clear tbody tr:last-child td{border-bottom:1px solid #ddd;}
.ui-table-clear td a{color:#333;}
.ui-table-clear a{text-decoration:none;color:#1472bc;}
.ui-table-clear a:hover{text-decoration:underline;}


@media screen and (max-width: 640px) {
  .ui-table-rwd thead {display: none; }
  .ui-table-rwd tr {display: block; margin-bottom:10px;border:1px solid #e6e6e6;}
  .ui-table-rwd td {display: block; border: none; text-align:left!important;}
  .ui-table-rwd td:before {content: attr(data-th) " : "; font-weight: bold; }
  .ui-table-rwd td {padding:10px;background:#f2f7fc;text-align:left;}
  .ui-table-rwd tbody tr td:nth-child(even) {background:#fff;}
}

/*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}
.color-blue{color: blue;}
.color-green {color: green;}
.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;}


/*popup*/
.popup{z-index:999;position:fixed;top:52px;}
.popup-title{margin-top:10px;}
.popup-content{text-align: center}
.popup-video{width:640px;height:480px}
.popup-close{position: absolute;top:0;right:0;box-sizing:content-box;border-radius:50%;color:#fff;border:2px solid #fff;height:30px;width:30px;text-align: center;line-height: 30px!important;background-color: #2f7ab3;transform: translateX(50%);cursor:pointer;}

@media (max-width:768px) {
  .popup-video{width:480px;height:320px}
}

@media (max-width:480px) {
  .popup-video{width:320px;height:240px}
}

/*fixnav*/
.fixnav{z-index:9999;position: fixed;bottom:24px;right:24px;}
.fixnav-item{position:relative;margin-bottom: 10px}
.fixnav-icon{border-radius: 50%;width:68px;height:68px;user-select:none;}
.fixnav-backtop{width:64px;height:64px;display: flex;align-items: center;justify-content: center;border:3px solid rgb(245, 125, 0);border-radius:50%;background: #fff}
.fixnav-backtop .fa{font-size: 24px;color:rgb(245, 125, 0);}
.fixnav-popup{position:absolute;bottom:0;right:calc(100% + 10px);display:none;padding:10px; text-align: center;background: #fff;box-shadow: 5px 5px 15px rgba(0,0,0,.2);}
.fixnav-popup:after{position:absolute; bottom:20px; right:-14px; content:""; border-top:7px solid transparent; border-right:7px solid transparent; border-bottom:7px solid transparent; border-left:7px solid #fff; transform: translateY(-50%);}

@media (max-width: 480px) {
  .fixnav{right:12px;}
  .fixnav-item{position:relative;margin-bottom: 6px;text-decoration: none!important;}
  .fixnav-icon{width:48px;height:48px;}
  .fixnav-line .fixnav-popup img{width:220px;}
  .fixnav-backtop .fa{font-size: 18px;}
  .fixnav-backtop{width:42px;height:42px;}
}

/*google search*/
.nav__search{min-width: 200px;padding-right: 20px}
.gsst_a{line-height: 1rem!important}
.nav__search .nav__inner a{line-height: 1rem!important}
.gsc-input-box{border:none!important;border-radius: 16px!important;padding-top: 2px!important;padding-bottom: 2px!important;}
form.gsc-search-box{margin-bottom:0!important;}
.gsc-control-cse{border:none!important;background-color: transparent!important;}
.gsc-search-box-tools .gsc-search-box .gsc-input{padding-right: 4px!important}
.cse .gsc-control-cse, .gsc-control-cse{padding-left:0!important;}
.cse .gsc-search-button-v2, .gsc-search-button-v2{padding:0px 0px!important;background:transparent!important;}
.gsc-search-button-v2, .gsc-search-button-v2:hover, .gsc-search-button-v2:focus{background: transparent!important;}
.gsc-search-button-v2 svg{width:22px!important;height:22px!important;}
.hover-none{}
.hover-none:hover{background-color: transparent!important;}  
.gsc-search-button-v2 {border-color: #f57d00!important;}

/* subnavbar */
.subnavbar{z-index:999;box-sizing: border-box; position: fixed; top:0; width: 100%; padding: 8px 34px; border-bottom:2px solid rgba(255,255,255,0.1);background: linear-gradient(to bottom, #f1f1f1 0%,#d8d8d8 100%);}
.subnavbar-header {float:left;}
.subnavbar-collapse {float:right; display: none}
.subnavbar-collapse span{display:none;}
.subnavbar-nav {margin: 0; padding: 0; list-style: none; }
.subnavbar-nav>li{float:left;margin: 0; padding:11px 6px; }
.subnavbar-header-img{vertical-align: middle}
.clock{display: inline-block;font-size:18px;;}
.clock-flip{display: inline-block;padding:3px;border-radius:3px;color:#f00;font-size:32px;vertical-align: middle;}

@media (max-width: 768px) {
  .subnavbar{padding: 8px 24px;}
}

@media (max-width: 640px) {
  .subnavbar{padding: 3px 0;}
  .subnavbar-nav>li {box-sizing:border-box;display:block;float:left;width:33%;border-right:1px solid #999;border-top:1px solid #999;text-align:center;}
  .subnavbar li a{color:#fff;text-decoration: none}
  .subnavbar ul li:last-child{border-right:none}
  .subnavbar-collapse{display: inline; position: fixed;width:100%;bottom:0;background:#333;box-shadow: 0 0 10px rgba(0,0,0,0.5)}
  .subnavbar-collapse img{display:none;}
  .subnavbar-collapse span{display:inline;color: #FFF}
  .subnavbar-header{float:none;}
  .subnavbar-header-img{width:60px;}
  .clock{font-size:16px;}
  .clock-flip{font-size:24px;}
}

@media (max-width: 480px) {
  .subnavbar-header{text-align:center;}
  .subnavbar-header-img{width:50px;}
}

.mobile-title{ text-align: center;color: #FFF;font-size: 1.5em;width: 95%;padding-top: 30px; max-width: 1175px;font-weight: 800; margin: 0 auto;}
.mobile-btn { width:80%; margin:20px auto; line-height:40px; }

/*form*/
.ui-form{display: flex;justify-content: space-between;flex-wrap: wrap;margin:0;padding:0;list-style:none}
.ui-form-item{}
.ui-form-title{margin-bottom:18px;width:100%;padding:10px;text-align:center;background: var(--ui-form-title);color:#fff;}
.ui-form .ui-form-control{;width:100%}
.ui-form .ui-label{display:block;margin-bottom:5px;color:#999;font-size:16px;}
.ui-form .half{width: calc(50% - 8px);}
.ui-form .warning{color:#f3ea00;}
.ui-form hr{margin-bottom:16px;}
.ui-form-foot{margin-top:20px}
.ui-form-control{display:flex;flex-wrap:wrap;align-items: center;margin-bottom: 10px}
.ui-form-control .ui-input,.ui-form-control .ui-select{width:100%;}

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

/*fileupload*/
.ui-fileupload{position:relative;display:flex;flex-wrap:wrap;align-self:center;align-content: center;box-sizing:border-box;padding:10px;width:100%;height:140px;border:1px dashed #ccc;line-height: 26px;}
.ui-fileupload-input{position:absolute;top:0;left:0;width:100%;height:100%;opacity:0;}
.ui-fileupload-state{width:100%;text-align: center;pointer-events:none}
.ui-fileupload-btn{display:none;}
.ui-fileupload-progress{margin:0 auto 10px auto;max-width:500px;width: 80%; height: 15px;background: #ccc}
.ui-fileupload-precent{width: 20px;height:100%;background: #005dc7 }
.ui-fileupload-info{width:100%;text-align: center;pointer-events:none}

/*file*/
.filelist{margin:0;padding:0;list-style:none;width:100%;text-align: left}
.filelist-item{position: relative;box-sizing:border-box;margin-bottom: 12px;border:1px solid #e6e6e6;padding:16px 16px 16px 72px;background:no-repeat 20px center;transition:.2s;}
.filelist-item:hover{box-shadow: 0 0 15px rgba(0,0,0,.15)}
.filelist-item .delete{position: absolute;right:10px;top:50%;display:block;border:none;background:transparent;cursor:pointer;transform: translateY(-50%);transition: .2s}
.filelist-item .delete:hover{color:#cc0000;}
.filelist-link{display:block;color:#333;text-decoration: none}
.filelist-type-pdf{background-image: url(../images/icon-pdf.png)!important}
.filelist-type-doc{background-image: url(../images/icon-doc.png)!important}
.filelist-type-folder{background-image: url(../images/icon-folder.png)!important}
.filelist-type-link{background-image: url(../images/icon-link.png)!important}


/*simple table*/

table {
  border: 1px solid #ccc;
  border-collapse: collapse;
  margin: 0;
  padding: 0;
  width: 100%;
  table-layout: fixed;
}

table caption {
  font-size: 1.5em;
  margin: .5em 0 .75em;
}

table tr {
  background-color: #f8f8f8;
  border: 1px solid #ddd;
  padding: .35em;
}

table th,
table td {
  padding: .625em;
  text-align: center;
}

table th {
  font-size: .85em;
  letter-spacing: .1em;
  text-transform: uppercase;
}

@media screen and (max-width: 600px) {
  table {
    border: 0;
  }

  table caption {
    font-size: 1.3em;
  }
  
  table thead {
    border: none;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
  }
  
  table tr {
    border-bottom: 3px solid #ddd;
    display: block;
    margin-bottom: .625em;
  }
  
  table td {
    border-bottom: 1px solid #ddd;
    display: block;
    font-size: .8em;
    text-align: right;
  }
  
  table td::before {
    /*
    * aria-label has no advantage, it won't be read inside a table
    content: attr(aria-label);
    */
    content: attr(data-label);
    float: left;
    font-weight: bold;
    text-transform: uppercase;
  }
  
  table td:last-child {
    border-bottom: 0;
  }
}