@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Lato:100,400,900); /* font */
@import url(https://fonts.googleapis.com/css?family=Monda:400,700); /* font */

/* CSS Document */
/*body, html { height:100%; }*/
body{font-family:'Lato','微軟正黑體',sans-serif;font-size: 15px;line-height:1.5;color:#333;background:#a3daff;background:-moz-linear-gradient(top,#a3daff 0%,#fff 70%);background:-webkit-linear-gradient(top,#a3daff 0%,#fff 70%);background:linear-gradient(to bottom,#a3daff 0%,#fff 70%);filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#a3daff',endColorstr='#ffffff',GradientType=0);}
a{color:#000;text-decoration:none}
a:hover{color:#777;-o-transition:all .3s linear;-webkit-transition:all .3s linear;-moz-transition:all .3s linear;transition:all .3s linear}
.imgg{width:100%;height:auto}

/*---------------------- 基礎設定 ----------------------*/
/*反白設定
::selection { background: #666; color: #FFF; }
::-moz-selection { background: #666; color: #FFF; }
*/

/* CSS3 style  陰影圓角範例，可自行增減使用 */
.css-radius{-webkit-border-radius:3px;-moz-border-radius:3px;border-radius:3px}
.css-shadow{-webkit-box-shadow:0 0 6px rgba(0,0,0,.4);-moz-box-shadow:0 0 6px rgba(0,0,0,.4);box-shadow:0 0 6px rgba(0,0,0,.4)}
.imgholder img{transform:scale(1,1);-ms-transform:scale(1,1);-moz-transform:scale(1,1);-webkit-transform:scale(1,1);-o-transform:scale(1,1);transition:transform .5s ease-in-out,opacity .5s;-moz-transition:-moz-transform .5s ease-in-out,opacity .5s;-webkit-transition:-webkit-transform .5s ease-in-out,opacity .5s}
.imgholder:hover img{transform:scale(1.05,1.05);-ms-transform:scale(1.05,1.05);-moz-transform:scale(1.05,1.05);-webkit-transform:scale(1.05,1.05);-o-transform:scale(1.05,1.05)}
.rotation360{transition:All .4s ease-in-out;-webkit-transition:All .4s ease-in-out;-moz-transition:All .4s ease-in-out;-o-transition:All .4s ease-in-out}
.rotation360:hover{transform:rotate(360deg);-webkit-transform:rotate(360deg);-moz-transform:rotate(360deg);-o-transform:rotate(360deg);-ms-transform:rotate(360deg)}
.fadeout img{filter:alpha(opacity=100);-moz-opacity:1;opacity:1;-webkit-transition:opacity .5s ease-in-out;-moz-transition:opacity .5s ease-in-out;-o-transition:opacity .5s ease-in-out;-ms-transition:opacity .5s ease-in-out;transition:opacity .5s ease-in-out}
.fadeout:hover img{filter:alpha(opacity=70);-moz-opacity:.7;opacity:.7}


/*元件(共用)*/
.input1, .textarea, .select { background: #FFF; border: 1px solid #CCC; font-family: 'Lato', '微軟正黑體', sans-serif; font-size:15px; line-height:1.1; color:#555; }
.input1:focus, .textarea:focus, .select:focus { border:1px solid #000; }
.btn{border: solid 2px #fff;border-radius: 50px;padding: 0;letter-spacing:  2px;}
.btn:hover{ background:#fff;}
.btn a{color:#fff;text-decoration:none;outline:none;display:  block;padding:  10px;}
.btn:hover a{ color:#1e489d;}

/*線(共用)*/
hr { height:1px; background:#CCC; }

/*文字樣式(共用)*/
.white { color: #FFF; }
.gray { color:#999; }
.black { color:#000; }
.blue { color: #0097de; }
.red { color: #be0000; }
.green { color: #19a568; }
.orange { color: #FF6600; }
.yellow { color: #FFFF00; }
.purple { color:#6633CC; }
.brown { color:#6e453c; }

/* 回頂端 */
#goTop {color: #fff;background: #fecb00;text-align:center;position:fixed;bottom:20px;right:20px;width:50px;height:50px;line-height:50px;cursor:pointer;display:none;font-family:Verdana, Geneva, sans-serif;}
#goTop:hover { background:#fea600; color:#FFF; }

/*-------------------------------*/
/*縮放*/
.action1{-webkit-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);-webkit-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-moz-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-o-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-ms-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);}
.action1:hover{-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}

.action2{-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);-webkit-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-moz-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-o-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-ms-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);}
.action2:hover{-webkit-transform: scale(0.95);-ms-transform: scale(0.95);transform: scale(0.95);}

.action3{-webkit-transform: scale(.95);-ms-transform: scale(.95);transform: scale(.95);-webkit-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-moz-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-o-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-ms-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);}
.action3:hover{-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);}

.action4{-webkit-transform: scale(1);-ms-transform: scale(1);transform: scale(1);-webkit-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-moz-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-o-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);-ms-transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);transition: all 3s cubic-bezier(0.165, 0.84, 0.44, 1);}
.action4:hover{-webkit-transform: scale(1.05);-ms-transform: scale(1.05);transform: scale(1.05);}

/*-------------------------------*/
/*漸變用*/
.gradient-03s{-webkit-transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);-moz-transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);-o-transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);-ms-transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);transition: all .3s cubic-bezier(0.165, 0.84, 0.44, 1);}
.gradient-1s{-webkit-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);-moz-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);-o-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);-ms-transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);transition: all 1s cubic-bezier(0.165, 0.84, 0.44, 1);}


.scrollbar-style::-webkit-scrollbar-track{-webkit-box-shadow: inset 0 0 6px rgb(30, 72, 157);background-color: #1e489d;}
.scrollbar-style::-webkit-scrollbar{width: 6px;background-color: transparent;}
.scrollbar-style::-webkit-scrollbar-thumb{ background-color: #0f3176;background-image: -webkit-gradient(linear,left bottom,left top,color-stop(0.44, #0f3176),color-stop(0.72, #0f3176),color-stop(0.86, #0f3176));}

/*---------------------- 頁面開始 ----------------------*/
/*全頁佈局*/
.wrapper {position: relative;}
.wrapper:before{content: '';display:block;width:  100%;height: 64px;background: #1e489d;position:  absolute;z-index: -1;}
.container.inside{ padding:0;}

/*頁首*/
.header ul { list-style:none; padding:0; margin:0; }

/*主選單*/
.navbar-custom{margin-bottom:0;border-bottom:1px solid rgba(0,0,0,.3);text-transform:uppercase;padding:10px 0}
.navbar-custom .navbar-brand{width:240px;padding:0;line-height:normal;height:auto}
.navbar-brand>img{display:block;width:auto;height:60px}
.navbar-custom .navbar-brand:focus{outline:0}
.navbar-custom .navbar-brand .navbar-toggle{padding:4px 6px;font-size:16px;color:#fff}
.navbar-custom .navbar-brand .navbar-toggle:focus,.navbar-custom .navbar-brand .navbar-toggle:active{outline:0}
.navbar-custom a{color:#fff}
.navbar-custom .nav li > a{-webkit-transition:background .3s ease-in-out;-moz-transition:background .3s ease-in-out;transition:background .3s ease-in-out;color:#1e489d;font-weight:700;letter-spacing:4px;padding:0 20px;height:60px;line-height:60px}
.navbar-custom .nav li > a:hover{outline:0;background-color:transparent;color:#1e489d;border-bottom:solid 3px}
.navbar-custom .nav li a:focus,.navbar-custom .nav li a:active{outline:0;background-color:transparent}
.navbar-custom .nav li.active{outline:0}
.navbar-custom .nav li.active > a{color:#1e489d;border-bottom:solid 3px}
.navbar-custom .nav li.active > a:hover{color:#1e489d;border-bottom:solid 3px}
.navbar-toggle{margin-right:0;margin-top:5px;margin-bottom:5px;color:#1f499d}
@media(min-width:768px) {
.navbar-custom{padding:0;border-bottom:0;letter-spacing:1px;-webkit-transition:background .5s ease-in-out,padding .5s ease-in-out;-moz-transition:background .5s ease-in-out,padding .5s ease-in-out;transition:background .5s ease-in-out,padding .5s ease-in-out;background:#fff;border-top: solid 6px #1e489d;/* border-bottom:0; */}
.navbar-custom.top-nav-collapse{padding:0}
}
.nav .open > a,.nav .open > a:hover,.nav .open > a:focus{background:none}


/*次選單*/
/*---------sidebar--------------*/
.panel{ background-color:transparent;}
.affix { top: 115px; }
.sidebar {float: left;width: 250px;}
.sidebar .navbar-toggle { display:none; width:100%; float:inherit; text-align:left; margin:0;  position:relative; height: inherit;}
.sidebar .navbar-toggle .fa-caret-down { position:absolute; right:15px; top:12px; }
.sidebar .navbar > li {border: 0;border-bottom: solid thin #e0e0e0;padding-bottom: 0;margin-bottom: 0;box-shadow:  none;border-radius:  0;}
.sidebar .navbar > li:last-child{ border-bottom:0}
.sidebar .navbar > li a:before{content:'-';margin-right: 10px;}
.sidebar .navbar > li > a {display:flex;padding: 8px 15px;text-decoration: none;}
.sidebar .navbar > li > a:hover, .sidebar .navbar > .active > a, .nav>li>a:focus, .nav>li>a:hover{color: #fff;background: #ffb41b;}
.sidebar .navbar ul { list-style:none; margin:0px 0 10px 0; padding-left:15px; padding-top:0; }
.sidebar .navbar ul li a .fa { margin-right:4px; }
.sidebar .navbar ul > li > a { display:block; padding:5px 0 5px 30px; color:#fff; text-decoration:none;  }
.sidebar .navbar ul > li > a:hover, .sidebar .navbar ul > li.active > a { color:#fff;  }
.sidebar .navbar ul.submenu > li > a {  color: #606060;  padding: 5px 8px; }
.sidebar .navbar li ul.submenu li:before { content: '-'; float: left; padding: 3px;  }
.sidebar .navbar ul.submenu > li:hover > a,.sidebar .navbar li ul.submenu li.active a  { color: #c13207;  margin-left: 10px; font-weight: bold; }
.sidebar .navbar li ul.submenu li.active a{ margin-left: 0px;}
.sidebar .navbar li ul.submenu li.active:before { color: #c13207;  }
.sidebar .submenu li { width:100%; }
.sidebar .submenu li.panel { margin: 0; box-shadow: none;}
.sidebar .navbar > li.active > a:hover::before, .sidebar .navbar > li > a:focus::before, 
.sidebar .navbar > li.active > a::before { transform: translateX(6px); }
.sidebar header{padding: 20px 15px;color: #fff;background: #1e489d;}
.sidebar .navbar{margin-bottom:  0;border-radius:  0; /* Old browsers */ /* FF3.6-15 */ /* Chrome10-25,Safari5.1-6 */ /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ /* IE6-9 */border: solid thin #eee;}

/*頁尾*/
.footer {background: #1e489d;padding: 20px 0;color: #c3d7ff;text-align:  center;font-size: 14px;line-height: 24px;letter-spacing:  1px;}
.footer p{margin: 0;}
.footer a{ color:#c3d7ff}

/*按鈕*/
.btnWrap { margin:2em 0; text-align:center; }

/*RWD編輯器表格(X捲軸)*/
.table-container table td {min-width: 100px;padding: 5px;white-space: inherit;}

/*----banner---*/
.banner{margin-top: 66px;height: 260px;background-size: cover !important;background-position: top center !important;}
.carousel{margin-top: 88px;height: 450px;}
.carousel:hover .carousel-control{display:block}
/*.carousel .item{position:relative}*/
.carousel-caption{width:440px;text-align:left;background:#fc0;padding:10px 15px;position:absolute;right:15%;bottom:25%;left:initial;z-index:10}
.carousel-caption h2{margin:0;font-size:26px;line-height:1.5;font-style:italic;letter-spacing:2px}
.carousel .item,.carousel .item.active,.carousel .carousel-inner{height:100%;border-radius: 16px;}
.carousel .fill{width:100%;height:100%;background-position:center;background-size:cover}
.carousel .carousel-control{background:none;}
.carousel-control .icon-prev::before,.carousel-control .icon-next::before{content:''}
.carousel-control .icon-prev,.carousel-control .icon-next{width:40px;height:60px; line-height:60px;margin:-30px 0 0;background-color: #000 !important;}
.carousel-control .icon-prev{left:0; border-radius:0 50px 50px 0;}
.carousel-control .icon-next{right:0; border-radius:50px 0 0 50px;}
.carousel-indicators{ display:none;}

/*淡入 淡出*/
.carousel-fade .carousel-inner .item {  transition-property: opacity; }
.carousel-fade .carousel-inner .item,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {  opacity: 0; }
.carousel-fade .carousel-inner .active,
.carousel-fade .carousel-inner .next.left,
.carousel-fade .carousel-inner .prev.right {  opacity: 1; }
.carousel-fade .carousel-inner .next,
.carousel-fade .carousel-inner .prev,
.carousel-fade .carousel-inner .active.left,
.carousel-fade .carousel-inner .active.right {  left: 0;  transform: translate3d(0, 0, 0); }

/*首頁-關於*/
.index-about{padding:20px 0 0}
.index-about .box{position:relative}
.index-about .box .l{width:55%;background:#1e489d;padding:60px 50px;position:relative;z-index:1}
.index-about .box .l p{color:#fff;4:300px;padding-right:20%;text-align:justify}
.index-about .box .l .btn{width:200px;margin:20px 0}
.index-about .box .r{width:55%;position:relative;z-index:2;margin-top:-25%;margin-left:auto}
.index-about .box .r img{width:100%;height:100%}

/*首頁-產品輪播*/
.index-product{padding: 50px 10px;}
.slick-slide a{ display:block}
.slick-slide img{width: calc(100% - 5px);height:auto;}
.sidebar + .content{width: calc(100% - 250px);min-height: 500px;float:  right;}
.content .titleBox{padding: 20px;color: #fff;background: #1e489d;} 

/*麵包屑*/
.path{text-align:right;padding:20px 5px}
.path ul{padding-left:0;margin-bottom:0}
.path ul li{color:#444;display:inline-block;font-size:12px}
.path ul li.active{color:#1e489d}
.path ul li:after{content:'/';padding:0 5px;color:#c2c2c2}
.path ul li:last-child:after{display:none}
.insideWrap{display:inline-block;width:100%;background:#eee}
.contentBox{padding:0 40px 30px;background:#fff}
.contentBox article{margin-bottom:30px;border-bottom:solid thin #eee;padding-bottom:30px}
.contentBox article:last-child{border-bottom:0}
.contentBox article h3{margin-top:0;color:#ffb41b;font-weight:700;margin-bottom:20px;font-size:20px}
.contentBox article h3 .small{color:#ffb41b;margin-left:5px}
.contentBox article h3:before{content:'\f013';font-family: Font Awesome\ 5 Free;font-weight:900;margin-right:4px;color:#94d1cd;font-size:.7em;vertical-align:middle}
.contentBox article p{line-height:1.8}
.contentBox article table{border-top:solid thin rgba(30,157,151,0.5);border-left:solid thin rgba(30,157,151,0.5)}
.contentBox article table tr td{border-right:solid thin rgba(30,157,151,0.5);border-bottom:solid thin rgba(30,157,151,0.5);padding:5px 10px}
.contentBox article table tr:nth-child(even){background:#f4f4f4}
.contentBox article ul{margin-bottom:10px;padding-bottom:10px}
.contentBox article ul:last-child{padding-bottom:0;margin-bottom:0}
.contentBox article ul.spec{margin:0}
.contentBox article ul li{line-height:1.8}
.contentBox article ul li:last-child{margin-bottom:0}
.contentBox article ul li .en{display:block;font-size:.9em}
.contentBox article ul li ul{padding-left:20px}
.contentBox article ul li ul li{margin-bottom:0}
.contentBox article ul li ol{padding-left:20px;margin-bottom:5px}
.contentBox article ul li ol li{font-size:95%}
.contentBox article .imgBox{margin-bottom:20px}
.contentBox article .imgBox:last-child{margin-bottom:0}
.contentBox article .imgBox h4{color:#629ac0}
.contentBox article .imgBox ul{list-style:none;padding-left:0;margin-bottom:0;margin-top:0}
.contentBox article .imgBox ul:after{content:'';display:block;clear:both}
.contentBox article .imgBox ul li{width:calc(100% / 4 - 8px);margin-right:10px;float:left}
.contentBox article .imgBox ul li:nth-child(4n){margin-right:0}
.contentBox article .imgBox ul li:nth-child(4n+1){clear:both}
.spec{list-style:none;padding-left:0;margin-bottom:0}
.spec li ~ li{text-indent:30px}

/*聯絡我們*/
.tinfo-bform .m_t{margin:0 0 1em}
.tinfo-bform .contact_1{border-right:1px dashed #ccc;padding:0 2%;overflow:hidden;color:#666;font-size:1.5rem}
.tinfo-bform .contact_2{padding:0 2%;overflow:hidden;color:#666;font-size:1.5rem}
.tinfo-bform .contact_pic{float:left;width:130px;height:130px;line-height:125px;border:2px solid #da1e26;text-align:center;-webkit-border-radius:65px;-moz-border-radius:65px;border-radius:65px;font-size:3rem;color:#da1e26;margin:0 4%}
.tinfo-bform .title02{font-size:2.2rem;color:#000;font-weight:700}
.tinfo-bform .contact_1 a,.tinfo-bform .contact_2 a{color:#da1e26;font-size:1.8rem}
.tinfo-bform .contact_pic .fa{margin-right:0;font-size:1.5em}
.tinfo-bform .name{line-height:36px;color:#222}
.tinfo-bform .text{margin:0 0 10px}
.tinfo-bform .input1,.tinfo-bform select.form-control{border:none;border-bottom:1px solid #dbdbdb!important;color:#555;height:36px;width:98%;padding:0 0 0 8px;box-shadow:none;margin:0 5px}
.tinfo-bform .input2,.tinfo-bform .input3{border:none;border-bottom:1px solid #dbdbdb!important;color:#555;margin:0 5px}
.tinfo-bform .input2{width:100%}
.tinfo-bform .m_t .btn{background:#1e489d;display:table;width:100%;max-width:160px;margin:20px auto}
.tinfo-bform .m_t .btn:hover{border-color:#1e489d;background:#fff;color:#1e489d;font-weight:700}
.tinfo-bform .m_t p{max-width:900px;margin:40px auto;text-align:center}

input:focus, textarea:focus{outline: none;background: #f6f6f6;}

@media (max-width: 1200px) { 
.index-about .box .l{width: 50%;padding: 40px;}
.index-about .box .l p{padding-right: 10%;}
.index-about .box .r {margin-top: -30%;}
}

@media (max-width: 1024px) { 
.index-about .box .l{width:100%;padding:40px;position:static;z-index:inherit}
.index-about .box .l p{padding-right:0}
.index-about .box .r{width:100%;position:static;z-index:inherit;margin-top:0}
}

@media (max-width: 996px) { 
.tinfo-bform .contact_1{ float:none; border-right:0px dashed #ccc; border-bottom:1px dashed #ccc; width:100%; padding-bottom:5%; overflow:hidden; margin-bottom:5%;}
.tinfo-bform .contact_2{ float:none; width:100%; padding-bottom:5%;  }
}
 
@media (max-width: 992px) { 
/*---------sidebar--------------*/
.navbar{margin-bottom:0}
.sidebar{float:inherit;width:100%;min-height:auto;border-radius:0;padding:0;margin:20px auto;background:#fff}
.sidebar .navbar-toggle{display:block;padding:8px;color:#fff;background:#1e489d;border:0}
.sidebar .navbar > li{margin:0;border:none}
.sidebar .navbar > li > a{padding:10px 20px}
.sidebar header.mtitle{display:none}
.affix{position:inherit;top:inherit}
.sidebar .navbar > li.active > a::before{display:none}
.wrapper > .container:first-child{background-color:#fff}
.wrapper:before{display:none}
.insideWrap{background:transparent}
.sidebar + .content{width:100%;float:none}
.content .titleBox{padding:10px 15px}
.contentBox{padding:0 10px}
.path{padding:10px 0}
.map{ margin-bottom: 30px;}

}

@media (max-width: 768px) { 
/*RWD編輯器表格(X捲軸)*/
.table-container { width: 100%;overflow-y: auto;_overflow: auto;margin: 0 0 1em;}

.navbar-brand>img{height:50px}
.carousel{height:350px}
.carousel-caption{width:100%;padding:10px 15px;position:absolute;right:0;bottom:0}
.carousel-caption h2{margin:0;font-size:18px;line-height:1.5;font-style:inherit;letter-spacing:0}
.navbar-custom{border-top:solid 5px #1e489d;border-bottom:0;background:#fff;padding:5px 10px}
.index-about .box .l{padding:30px}
.contentBox article .imgBox ul li{width:calc(100% / 2 - 8px)}
.contentBox article .imgBox ul li:nth-child(4n){margin-right:10px}
.contentBox article .imgBox ul li:nth-child(4n+1){clear:none}
.contentBox article .imgBox ul li:nth-child(2n){margin-right:0}
.contentBox article .imgBox ul li:nth-child(2n+1){clear:both}
}

@media (max-width: 640px) { 
body{border:0}
.navbar-custom{border:0;border-top:solid 5px #1e489d}
.banner{margin-top:69px;height:160px}
.index-about{padding:20px 0 0}
.index-about .box .l{padding:20px}
.index-about .box .l p{font-size:14px}
.index-about .box .l .btn{width:120px;display:block;margin:20px auto 0}
.index-product{padding:20px 15px}
.footer{padding:20px 25px;font-size:13px;line-height:20px;letter-spacing:0}
.map iframe{height: 300px;}.tinfo-bform .m_t p{ margin: 20px auto;}

}
@media (max-width: 480px) { 
/*----banner---*/
.carousel {height: 250px;}
}