@charset "utf-8";

/** bootstrap **/
@import "bootstrap-4.2.1.css";

/** 文字icon **/
@import "font-awesome.min.css";

/** 手機選單 **/
@import url("slicknav.css") screen and (max-width:930px);

/** edm **/
@import "edm.css";

/** google font **/
@import "Exo+2.css";

*{-webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
html{width:100%; height:auto;}
body{background:#ffffff; margin:0; padding:0; width:100%; height:auto; font-size:medium;line-height: 1.6;font-family:'Exo 2', "Microsoft JhengHei", sans-serif;word-break: break-word;}
a,a:hover{text-decoration:none;transition: all 0.5s ease 0s;}
img{border:0; vertical-align:middle; max-width:100%;}
input{vertical-align:middle;border-radius: 0; }
input:focus, select:focus, textarea:focus, button:focus{outline:0;}
/** 取消ios按鈕樣式 **/
input[type="button"], input[type="submit"], input[type="reset"], button[type="button"], button[type="submit"], button[type="reset"], a[type="button"], a[type="submit"], a[type="reset"], textarea{border-radius: 0; -webkit-appearance: none;-moz-appearance: none;appearance: none;}
.slicknav_menu{display:none;}

/** 表單預設文字顏色設定 **/
::-webkit-input-placeholder{color:#999999;}
::-moz-placeholder{color:#999999;}
:-ms-input-placeholder{color:#999999;}
input:-moz-placeholder{color:#999999;}
#field2::-webkit-input-placeholder{color:#999999;}
#field3::-webkit-input-placeholder{color:#999999; background:lightgreen; text-transform:uppercase;}
#field4::-webkit-input-placeholder{font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999999;}
#field2::-moz-placeholder{color:#999999;}
#field3::-moz-placeholder{color:#999999; background:lightgreen; text-transform:uppercase;}
#field4::-moz-placeholder{font-style:italic; text-decoration:overline; letter-spacing:3px; color:#999999;}
.writing-mode-vertical{writing-mode:tb-lr; -ms-writing-mode:tb-lr; -webkit-writing-mode:vertical-lr; -moz-writing-mode:vertical-lr; -ms-writing-mode:vertical-lr; writing-mode:vertical-lr;}

/** 手機選單、選單 色塊-變色 **/
.b-color, .slicknav_menu{}
.slicknav_icon-bar{background-color:#003586;}
.b-color>li:hover, .b-color>li>ul>li>a:hover, .slicknav_nav .slicknav_row:hover, .slicknav_nav a:hover{background:#003586;color: #ffffff;}
.border-color{border-left:7px #A0A0A0 solid;}
.slicknav_nav span.slicknav_arrow{font-family:Arial;position: absolute;top: 22px;right: 15px;color: #000000;width: auto;}

/** 上版 **/
header{height: 108px;background: url("../images/head_bg.png")repeat-x center bottom;position: fixed;width: 100%;z-index: 10000;transition: all 0.5s ease 0s;}
.head-main{max-width:1200px; margin:0 auto; padding:0; position:relative;}
.head-main .logo{position:absolute; left:0px; top:26px; height:auto;width: 200px;transition: all 0.5s ease 0s;}
.head-main .logo a{display: block;}
.head-main .logo img{width:100%; height:auto;}
.head-main .logo02{position:absolute; left:210px; top:31px; height:auto;width: 51px;transition: all 0.5s ease 0s;}
.head-main .logo03{position:absolute; left:271px; top:31px; height:auto;width: 51px;transition: all 0.5s ease 0s;}
.head-main .logo04{position:absolute; left:332px; top:31px; height:auto;width: 46px;transition: all 0.5s ease 0s;}
.header-height{height: 60px;background:#ffffff;box-shadow: 0 1px 8px 0 rgba(0,0,0,.1);transition: all 0.5s ease 0s;}
.header-height .logo{top:10px;width: 140px;transition: all 0.5s ease 0s;}
.header-height .logo02{left:146px;top:15px;width: 33px;transition: all 0.5s ease 0s;}
.header-height .logo03{left:185px;top:15px;width: 33px;transition: all 0.5s ease 0s;}
.header-height .logo04{left:224px;top:15px;width: 29px;transition: all 0.5s ease 0s;}
.header-height .language{top:15px;transition: all 0.5s ease 0s;}
@media screen and (max-width:1200px){
	.language{right:15px;}
    .head-main .logo{left:15px; }
    .head-main .logo02{left:225px; }
    .head-main .logo03{left:286px; }
    .head-main .logo04{left:347px; }
    .header-height .logo02{left:161px;top:15px;width: 33px;}
    .header-height .logo03{left:200px;top:15px;width: 33px;}
    .header-height .logo04{left:239px;top:15px;width: 29px;}
}
@media screen and (max-width:1100px){
    header{height:60px;}
	.head-main .logo{ top:10px;width: 140px;}
    .head-main .logo02{top:15px;left:161px; width: 33px; }
    .head-main .logo03{top:15px;left:200px; width: 33px;}
    .head-main .logo04{top:15px;left:239px; width: 29px;}
    .language{top:15px;}
}
@media screen and (max-width:930px){
    header{height: 0;position: inherit;}
    .header-height{height: 0;background:none;box-shadow: 0 0 0px 0 rgba(0,0,0,0);}
    .language{position:fixed; top:7px; right:55px;z-index: 10000;}
    .language ul li a{padding:2px 4.5px; }
    .head-main .logo{position:fixed; z-index: 10000;width: 100px;top: 4.5px;}
    .head-main .logo02{position:fixed; z-index: 10000;top:4.5px;left:120px; width: 30px; }
    .head-main .logo03{position:fixed; z-index: 10000;top:4.5px;left:155px; width: 30px;}
    .head-main .logo04{position:fixed; z-index: 10000;top:4.5px;left:190px; width: 27px;}
    .header-height .logo{top:4.5px;width: 100px;}
    .header-height .language{top:7px;}
}

/** 主選單與下拉 **/
nav{margin: 0 0 0 210px;}
.menu{max-width:1200px; padding:0; list-style:none; position:relative; margin:0 auto; display:flex;justify-content: flex-end;}
.menu>li{width: auto;color:#000000; font-size:17px; text-align:center; position:relative; cursor:pointer; padding:0; margin:0;}
.menu>li>a{color:#000000; display:block; padding:29.5px 16px; margin:0;position: relative;overflow: hidden;transition: all 0.5s ease 0s;}
.menu>li>a span{color:#666666; display:block; width: 100%;font-size:14px;}
.menu>li:after{content: "";display: block;width: 40px; height: 2px; background: #003586;position: absolute;bottom:0px;left: calc(50% - 20px);transition: all 0.3s ease 0s;opacity: 0;}
.menu>li>a:hover{position: relative;}
.menu>li:hover{position: relative;}
.menu>li:hover:after{content: "";display: block;width: 40px; height: 2px; background: #003586;position: absolute;bottom:20px;left: calc(50% - 20px);transition: all 0.5s ease 0s;opacity: 1;}
.menu>li.sub>ul.sub-menu{width: 150px; background:#003586; display:none; position:static; z-index:999; margin:0; padding:0; border-radius:0 0 5px 5px; overflow:hidden;}
.menu>li.sub:hover ul.sub-menu{position:absolute; display:block; width:150px; left:calc(50% - 75px); top:88px;transition: all 0.5s ease 0s;}
.menu>li.sub>ul.sub-menu>li{display:block;font-size: 15px;border-bottom: 1px rgba(255,255,255,.4) solid;line-height: 1.5;font-weight: 300;}
.menu>li.sub>ul.sub-menu>li:last-of-type{border-bottom: 0;}
.menu>li.sub>ul.sub-menu>li>a{display:block; color:#fff; padding:8px 10px; margin:0;}
.menu>li.sub>ul.sub-menu>li>a:hover{background:#000000;}
.header-height .menu>li>a{padding:5.5px 16px;transition: all 0.5s ease 0s;}
.header-height .menu>li:hover:after{bottom:0px;transition: all 0.5s ease 0s;}
.header-height .menu>li.sub:hover ul.sub-menu{top:60px;transition: all 0.5s ease 0s;}
@media screen and (max-width:1100px){
    nav{margin: 0 0 0 165px;}
    .menu>li>a{padding:5.5px 12px;}
    .menu>li:hover:after{bottom:0px;}
    .menu>li.sub:hover ul.sub-menu{ top:60px;}
    .header-height .menu>li>a{padding:5.5px 12px;}
}
@media screen and (max-width:930px){
	.slicknav_menu{display:none;}
	#menu{display:none;}
	.slicknav_menu{display:block;background: #ffffff;width: 100%;position: fixed;z-index: 10000;box-shadow: 0 1px 8px 0 rgba(0,0,0,.1);}
}

/** edm輪播 **/
.edm{background:#ffffff; max-width:100%; margin:0 auto; position:relative;}
.edm img{vertical-align:middle; width:100%; height:auto; position:absolute;}
@media screen and (max-width:930px){
	.edm{padding: 39px 0 0 0;}
}

/** 配置 **/
.warpper{overflow: hidden;}
.main{}
.i-title{margin: 0 0 25px 0;text-align: center;}
.i-title h2{font-size: 30px; color: #263449;font-weight: bold;padding: 0;margin: 0;line-height: 1.4;}
.i-title .i-title-en{color: #8c94a1;font-size: 14px;font-weight:none;letter-spacing: 1.4px;}
.more{color:#fa8616;font-size: 12px;display: flex;justify-content: flex-end;text-transform: uppercase;margin: 15px 0 0 0;}
.more a{display: block; color:#fa8616;position: relative;padding: 0px 12px;}
.more a:after{content: "";display: block;position: absolute;bottom: 0;right: 0; width: 0;height: 0;border-style: solid;border-width: 0 0 8px 8px;border-color: transparent transparent #fa8616 transparent;transition: all 0.5s ease 0s;}
.more a:hover{position: relative;color: #ffffff;z-index: 0;}
.more a:hover:after{content: "";display: block;position: absolute;bottom: 0;right: 0; width:100%;height: 100%;background:#fa8616;z-index: -1;transition: all 0.5s ease 0s;}
@media screen and (max-width:767px){
    .i-title{margin: 0 0 20px 0;}
	.i-title h2{font-size: 26px; }
    .i-title .i-title-en{color: #8c94a1;font-size: 12px;}
}

/** 首頁最新消息 **/
.i-news-main{padding:70px 15px;}
.i-news{max-width: 1200px; margin:0 auto;}
.i-news ul{list-style:none; color: #666666;padding:0px; margin:0;display: flex;flex-wrap: wrap;}
.i-news ul li{padding:0; font-size:16px;width: calc(100%/4);margin: 0;}
.i-news ul li a{color: #666666;display:flex;flex-wrap: wrap; }
.i-news ul li:nth-child(even) a{flex-direction: column-reverse;}
.i-news ul li a:hover{}
.i-news ul li .i-news-photo-main{overflow: hidden;}
.i-news ul li .i-news-photo{width: 100%; background-color: #ffffff; background-position: center center;background-repeat: no-repeat;background-size: cover;transform:scale(1);transition: all 0.5s ease 0s;overflow: hidden;}
.i-news ul li .i-news-information{width: 100%; background: #f6f6f6;padding: 15px;}
.i-news ul li .i-news-information h3{font-size: 16px; color: #000000;font-weight: bold;padding: 0;margin: 0;line-height: 1.4;overflow: hidden;text-overflow: ellipsis;height:22px;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.i-news ul li .i-news-information .i-news-date{font-size: 12px; color: #003586;margin: 10px 0;}
.i-news ul li .i-news-information .i-news-content{font-size: 16px; color: #666666;overflow: hidden;text-overflow: ellipsis;height:75px;display: -webkit-box;-webkit-line-clamp: 3;-webkit-box-orient: vertical;}
.i-news ul li .i-news-information .i-news-more{color:#fa8616;font-size: 12px;display: flex;justify-content: flex-end;text-transform: uppercase;margin: 15px 0 0 0;position: relative;padding: 0px 12px;}
.i-news ul li .i-news-information .i-news-more:after{content: "";display: block;position: absolute;bottom: 0;right: 0; width: 0;height: 0;border-style: solid;border-width: 0 0 8px 8px;border-color: transparent transparent #fa8616 transparent;transition: all 0.5s ease 0s;}
.i-news ul li:hover .i-news-information .i-news-more{position: relative;color: #ffffff;z-index: 0;}
.i-news ul li:hover .i-news-information .i-news-more:after{content: "";display: block;position: absolute;bottom: 0;right: 0; width:100%;height: 100%;background:#fa8616;z-index: -1;transition: all 0.5s ease 0s;}
.i-news ul li:hover .i-news-photo{transform:scale(1.1);transition: all 0.5s ease 0s;}
@media screen and (max-width:767px){
    .i-news-main{padding:30px 15px ;}
	.i-news ul li{width: calc(100%/2);}
    .i-news ul li .i-news-information .i-news-date{margin: 5px 0;}
    .i-news ul li .i-news-information .i-news-content{font-size: 15px;height:96px;-webkit-line-clamp: 4;}
    .i-news ul li .i-news-information .i-news-more{margin: 10px 0 0 0;}
}
@media screen and (max-width:575px){
    .i-news ul li .i-news-information .i-news-content{height:48px;-webkit-line-clamp: 2;}
    .i-news ul li .i-news-information .i-news-more{margin: 5px 0 0 0;}
}

/** 首頁頁籤 **/
.index-brand{ padding: 30px 0 0 0;}
#brand{ height:auto;  font-family:"微軟正黑體"; width:100%;}
#brand ul{  list-style:none;  height:auto; margin:0;  padding:0;display: flex;}
#brand ul li{ text-align:center;cursor:pointer; width: calc(100%/5 - 1px);margin: 0.5px; font-size:18px;  padding:15px 10px; color:#aaaaaa; display:flex; align-items:center; justify-content:center;position: relative;z-index: 1;background: #08254f;}
#brand ul li br{display: none;}
#brand ul li:last-of-type{ border-right:1px solid #2b2b2b;}
#brand ul li img{vertical-align:text-bottom; }
#brand ul li:hover{ color:#ffffff; background:#003586;} 
#brand ul li.active{ color:#263449; font-size:20px;font-weight: 600; border-bottom:0; background:#eeeeee;margin: 0;}
#brand ul li.active:before{content: "";display: block;position: absolute;top:-30px;left: 0px;width: 100%;height: 30px;background: url("../images/tab.svg")no-repeat bottom right;}
#brand-info{ color:#000; font-size:16px; font-weight:normal; border:0;border-top: 3px #eeeeee solid;padding: 30px 0; width:100%;overflow:hidden; }
#brand-info>.box{  width:auto;  height:auto;  display:none;}
#brand-info>.box table{ background:#55BCFF;}
@media screen and (max-width:1050px){
    #brand ul li{ width: calc(100%/4 - 2px);}
}
@media screen and (max-width:767px){
    .index-brand{ padding: 0;}
    #brand ul{justify-content: center;}
    #brand ul li{ font-size:16px;padding: 10px 6px;}
    #brand ul li br{display:block;}
    #brand ul li.active{ font-size:16px;padding:10px 6px;}
}
@media screen and (max-width:575px){
    #brand ul li{ font-size:15px;}
    #brand ul li.active{ font-size:15px;}
}

/** 首頁產品 **/
.i-pro-main{background: #263449;padding: 0px 15px 40px 15px;}
.i-pro{max-width: 1200px; margin:0 auto;}
.i-flir-title{position: relative;display: table;margin: 0 auto;width: 392px;z-index: 0;padding: 0px 0 90px 0;}
.i-flir-title:after{content: "";display: block; width: 0;height: 0;border-style: solid;border-width: 113px 196px 0 196px;border-color: #ffffff transparent transparent transparent;position: absolute;top: 0;left: 0;z-index: -1;}
.item h4{padding: 0px;margin:0 5px;position: relative;line-height: 1.4;}
.item h4 .i-pro-photo-main{overflow: hidden;}
.item h4 .i-pro-photo{width: 100%;  background-position: center center;background-repeat: no-repeat;background-size: contain;transform:scale(1);transition: all 0.5s ease 0s;overflow: hidden;}
.item h4 .i-pro-title{font-size: 16px; color: #000000;font-weight: bold;width: 100%;position:absolute;bottom: 0;left: 0;background: rgba(255,255,255,.8);text-align: center;line-height: 1.4;padding: 10px 10px;}
.item h4:hover .i-pro-photo{transform:scale(1.1);transition: all 0.5s ease 0s;}
.i-pro-more{color:#fa8616;font-size: 12px;display: flex;justify-content: flex-end;text-transform: uppercase;margin:0;position: absolute;bottom: 41px;left: calc(50% - 36.36px);z-index: 0;}
.i-pro-more:before{content: "";display: block;width: 0;height: 0;border-style: solid;border-width: 21px 37px 21px 0;border-color: transparent #263449 transparent transparent;position: absolute;left: 0;top: -10px;z-index: -1;transition: all 0.5s ease 0s;}
.i-pro-more:after{content: "";display: block;width: 0;height: 0;border-style: solid;border-width: 21px 0 21px 37px;border-color: transparent transparent transparent #263449;position: absolute;right: 0;top: -10px;z-index: -1;transition: all 0.5s ease 0s;}
.i-pro-more a{display: block; color:#fa8616;position: relative;padding: 6px 20px 6px 20px;z-index: 1;top: -6px;}
.i-pro-more a:after{content: "";display: block;position: absolute;bottom: 0;left:calc(50% - 11px); width: 0;height: 0;border-style: solid;border-width: 6px 11px 0 11px;border-color: #fa8616 transparent transparent transparent;transition: all 0.5s ease 0s;}
.i-pro-more a:hover{position: relative;color: #ffffff;z-index: 0;}
.i-pro-more a:hover:after{content: "";display: block;position: absolute;bottom: 0;left:calc(50% - 11px); width: 0;height: 0;border-style: solid;border-width: 6px 11px 0 11px;border-color: #ffffff transparent transparent transparent;transition: all 0.5s ease 0s;}
.i-pro-more:hover{color: #ffffff;}
.i-pro-more:hover:before{content: "";display: block;width: 0;height: 0;border-style: solid;border-width: 21px 37px 21px 0;border-color: transparent #fa8616 transparent transparent;position: absolute;left: 0;top: -10px;z-index: -1;transition: all 0.5s ease 0s;}
.i-pro-more:hover:after{content: "";display: block;width: 0;height: 0;border-style: solid;border-width: 21px 0 21px 37px;border-color: transparent transparent transparent #fa8616;position: absolute;right: 0;top: -10px;z-index: -1;transition: all 0.5s ease 0s;}
@media screen and (max-width:767px){
    .i-pro-main{padding: 0 15px 10px 15px;}
    .i-pro-more{bottom: 36px;}
    .i-flir-title{width: 290px;}
	.i-flir-title:after{border-width: 113px 145px 0 145px;}
    .item h4{margin: 0px;}
    .item h4 .i-pro-title{padding: 6px 6px;}
    .i-pro-more:before{border-width: 28.5px 37px 28.5px 0;top: -12px;}
    .i-pro-more:after{border-width: 28.5px 0 28.5px 37px;top: -12px;}
    .i-pro-more:hover:before{border-width: 28.5px 37px 28.5px 0;top: -12px;}
    .i-pro-more:hover:after{border-width: 28.5px 0 28.5px 37px;top: -12px;}
    .i-pro-more a{padding: 10px 20px 10px 20px;}
    .i-pro-more a:after{bottom: 4px;}
    .i-pro-more a:hover:after{bottom: 4px;}
}

/** 內頁banner **/
.inside-banner{background:#999999 url("../images/banner.jpg")no-repeat center center;background-size: cover; padding:260px 0 0 0;min-height: 340px;}
.inside-banner .banner-title{max-width: 1200px; font-size:30px; color:#ffffff; margin:0 auto;font-weight:bold;letter-spacing: 6px; line-height: 1.6;text-align: center;display:flex;flex-wrap: wrap; align-items:flex-end;justify-content:center;position: relative;padding: 5px 15px 10px 15px;z-index: 1;}
.inside-banner .banner-title span{font-size: 14px;display: block;width: 100%;font-weight:400;line-height: 1;letter-spacing:4px;font-style: italic;}
.inside-banner .banner-title:after{content: "";display: block;width: 240px; height:100%;background:#003586;position: absolute;bottom: 0;left: calc(50% - 123px); z-index: -1;border-radius: 5px 5px 0 0;}
@media screen and (max-width:930px){
	.inside-banner{padding:180px 0 0 0;min-height: 260px;}
}
@media screen and (max-width:767px){
    .inside-banner{padding:100px 0 0 0;min-height: 170px;}
	.inside-banner .banner-title{font-size:24px; letter-spacing: 4px;}
    .inside-banner .banner-title:after{width: 220px; left: calc(50% - 112px);}
}

/** Breadcrumb **/
nav[aria-label="breadcrumb"]{width: 100%; margin: 0;background: rgba(236,236,236,.96);padding: 5px 15px;}
.breadcrumb{display:flex; flex-wrap:wrap; width:100%; max-width:1200px; margin:0 auto; padding:0; list-style:none; background-color:transparent; border-radius:0;font-size: 14px;}
.breadcrumb-item{padding-left:0;}
.breadcrumb-item + .breadcrumb-item::before{display:inline-block; padding-right:0.5rem; color:#333333; content:"/";}
.breadcrumb-item a{font-weight:400; text-decoration:none; color:#333333;}
.breadcrumb-item a:hover{color:#fa8616; text-decoration:none;}
.breadcrumb-item.active{color:#333333;}

/** 內頁架構 **/
.content-body{max-width:1200px; margin:0 auto; padding:30px 0;}
.page-title{font-size:24px; color:#333333; padding:0 0 0 30px; margin:25px 0 15px 0;background: url("../images/title-icon.svg")no-repeat left top 8px;background-size: 16px;}
.page-main{padding:0; font-size:16px; color:#333333;}
.content-main{display: flex;flex-wrap: wrap;margin:0 0 20px 0;}
.content-font{flex: 1;background: #263449;padding: 20px;color: #eeeeee;min-height: 250px;}
.content-photo{flex: 1.8;background-color: #f9f9f9;background-position: center top;background-repeat: no-repeat;background-size: cover;}
.content-block{flex: 1;}
.content-block02{flex: 1.42;}
.content-block03{flex: 1;}
.distance-left{margin:0 0 0 20px;}
.distance-right{margin:0 20px 0 0;}
.font001{font-size:24px; color:#263449;font-weight:bold;margin: 0 0 1.5vmin 0;border-left: 4px #fa8616 solid;padding: 0 0 0 15px;letter-spacing: 3px;}
.font001:first-letter{ color:#fa8616;}
.font002{font-size:18px;color: #003586; padding:0 ;margin: 0 0 2.5vmin 0;font-weight:bold;letter-spacing: 1px;}
.font003{font-size:22px;color: #ffffff;font-weight: bold;margin: 0 0 12px 0; line-height: 1.4;}
.content-main02{display: flex;flex-wrap: wrap;margin:0 0 20px 0;}
.content-font02{flex: 1.5;padding: 20px; color: #333333;position: relative;margin: 50px 0 0 0;z-index: 1;}
.content-font02:after{content: "";display: block;background: #f9f9f9;width: 130%;height: 100%;position: absolute;top: 0;left: -30%;z-index: -1;}
.content-photo02{flex: 1;position: relative;z-index: 2;border: 1px #cccccc solid;height: 100%;}
.information-en{border-top: 1px #dddddd dashed;color: #666666;padding: 2vmin 0 0 0;margin: 2vmin 0 0 0;}
.information-en-white{color: #ffffff;}
@media screen and (max-width:767px){
    .page-title{font-size:22px; padding:0 0 0 22px; background: url("../images/title-icon.svg")no-repeat left top 8px;background-size: 14px;}
    .content-main{display: block;}
    .content-photo{padding: 40% 0;}
    .distance-left{margin:20px 0 0 0;}
    .distance-right{margin:0 0 20px 0;}
    .font001{font-size:20px;}
    .font002{font-size:17px;}
    .content-main02{display: block;}
    .content-font02{width: 100%;margin: 0;padding: 20px 0;}
    .content-font02:after{width:calc(100% + 30px);height:calc(100% + 100px); top: -100px; left: -15px;}
    .content-photo02{width: 100%;max-width: 600px;margin: 0 auto;}
}
    
/** 左邊分類 **/
.left-menu-title{background:#e9ecef; text-align:center; font-size:18px; font-weight:bold; padding:8px 0; border-radius:5px 5px 0 0; margin-bottom:3px; border-bottom:2px solid #6d6d6d; color:#525252;}
.in-left-menu>ul{margin:0; padding:0; list-style:none;display: flex;flex-wrap: wrap;justify-content: center;}
.in-left-menu>ul>li{font-size:16px; color:#666666; padding:0;margin: 6px; width: calc(100%/4 - 12px);text-align: center;}
.in-left-menu>ul>li>a{color:#333; border-bottom:1px #263449 solid; display:block; padding:10px 10px; }
.in-left-menu>ul>li>a:hover{background-color:#263449;color: #ffffff;}
.in-left-menu>ul>li>.current{background:#fa8616;color: #ffffff;}
.in-left-menu>ul>li>.current:hover{background:#fa8616;color: #ffffff; }
.in-left-menu>ul>li ul{margin:5px 0 0 30px; padding:0; list-style:square;}
.in-left-menu>ul>li ul li{border-top:1px #CCC dotted; padding:5px 5px 5px 0;}
.in-left-menu>ul>li ul li a{font-size:14px; color:#666666; display:block;}
.in-left-menu>ul>li ul li a:hover{color:#71743D;}
.left-beautify img{width:100%; height:auto; margin-top:0px;}
.m_classLink{display:none;}
@media screen and (max-width:767px){
	.classBox{padding:0;}
	ul.classLink{display:none;}
	.m_classLink{display:block; position:relative; background-color:#ffffff; border:1px solid #263449;}
	.m_classLink a.main{display:block; background:none; font-size:16px; font-family:"Microsoft JhengHei", "新細明體", sans-serif; color:#333; position:relative; padding: 8px 49px 8px 8px;}
	.m_classLink a.main i{display:block; font-size:16px; background:#263449; width:41px; height:100%; text-align:center; color:#FFF; line-height:41px; position:absolute; right:0; top:0;}
	.m_classLink a.main b{font-weight: normal;}
	.m_classLink ul{display:none; margin:0; padding:0; list-style:none; width:100%; background:#FFF; border:1px solid #263449; position:absolute; left:0; top:100%; z-index:99; box-sizing:border-box;}
	.m_classLink ul li{margin:0; padding:0;}
	.m_classLink ul li a{display:block; padding:8px; border-top:1px solid #263449; font-family:"Microsoft JhengHei", "新細明體", sans-serif; font-size:16px; color:#222;}
	.m_classLink ul li:first-child a{border:none;}
	.m_classLink ul li a:hover{background:#fa8616;color: #ffffff;}
	.m_classLink ul li ul{display:block; margin:0 10px 10px 10px; padding:0; list-style:none; width:calc(100% - 20px); background:#FFF; border:1px solid #263449; position:inherit; left:inherit; top:inherit; z-index:999; box-sizing:border-box;}
	.left-menu-title{display:none;}
	.left-beautify{display:none;}
}

/** 關於我們 **/
.about-photo{display: flex;flex-wrap: wrap; padding: 0 5vmin 0 15px;position: relative;}
.about-photo .about-photo001{width: 76%; margin: 0 -26% 0 0;}
.about-photo .about-photo002{width: 80%;margin: -8% 0 0 20%;}
.about-photo .about-photo003{width: 70%; margin: -8% 0 0 5%;}
.about-photo .about-photo004{width: 66%;margin: -8% 0 0 30%;}
.about-information{border: 1px #e9f0f9 solid;padding: 2vmin;background: #ffffff;}
.about-photo-bottom {width: calc(100% + 10px);margin:4vmin -5px 10px -5px;position: relative;z-index: 1;}
.about-photo-bottom:before{content: "";display: block;width:calc(100% + 20px); height: 100%;background: #f6faff;position: absolute;top: -35%; left: -10px;z-index: -1;}
.about-photo-bottom ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
.about-photo-bottom ul li{display: block; padding: 0;margin:10px;width: calc(100%/3 - 20px);}
@media screen and (max-width:767px){
    .about-photo{width: calc(100% + 10px); padding: 0 15px;margin: 0 -5px 4vmin -5px;}
    .about-photo .about-photo001{width:calc(50% - 20px); margin:10px;}
    .about-photo .about-photo002{width:calc(50% - 20px); margin:10px;}
    .about-photo .about-photo003{width:calc(50% - 20px); margin:10px;}
    .about-photo .about-photo004{width:calc(50% - 20px); margin:10px;}
    .about-information{padding:15px;}
    .about-photo-bottom ul li{width: calc(100%/2 - 20px);}
}
@media screen and (max-width:575px){
    .about-photo{width: 100%; margin: 0 0 4vmin 0;}
    .about-photo .about-photo001{width: 100%; margin:0 0 20px 0;}
    .about-photo .about-photo002{width: 100%;margin:0 0 20px 0;}
    .about-photo .about-photo003{width: 100%;margin:0 0 20px 0;}
    .about-photo .about-photo004{width: 100%;margin:0 0 20px 0;}
    .about-photo-bottom {width:100%;margin:0;padding: 15px 0;}
    .about-photo-bottom:before{width:calc(100% + 30px); top:0; left: -15px;}
    .about-photo-bottom ul li{width: calc(100%/1);margin: 10px 0;}
}

/** 服務中心 **/
.service{line-height: 1.4;}
.service-title{font-size:18px;color: #ffffff;font-weight: bold;margin: 0 0 15px 0; line-height: 1.4;}
.service ul{list-style: none;padding: 0;margin: 0;}
.service ul li{padding: 0 0 0 15px;margin:8px 0;position: relative;}
.service ul li:before{content: "";width: 8px ;height: 2px;background: #ffffff;position: absolute;top:14px;left: 0;}
.service-photo{margin: 0 0 15px 0;padding: 10px 0 40px 0; position: relative;z-index: 1;}
.service-photo:before{content: "";display: block;width: 140%;height: calc(50% + 15px);background: #d7e1f0;position: absolute;left:-100%;top: -30px;z-index: -1;}
.service-photo:after{content: "";display: block;width: 180%;height: calc(50% + 15px);background: #d7e1f0;position: absolute;right:-100%;bottom: 0;z-index: -1;}
.service-photo ul{list-style: none;padding:0;margin: 0;display: flex;flex-wrap: wrap;}
.service-photo ul li{width: calc(100%/4 - 16px);margin: 8px; padding:6px;border: 1px #f6f6f6 solid;}
@media screen and (max-width:767px){
    .service-photo ul li{width: calc(100%/2 - 10px);margin: 5px;}
    .service-photo:before{height: calc(65% + 15px);}
    .service-photo:after{height: calc(35% + 15px);}
}
@media screen and (max-width:575px){
    .service-photo ul li{width: calc(100%/1 - 0px);margin: 5px 0;}
}

/** 最新消息 **/
.news{}
.news ul{margin:0; padding:0; list-style:none;display: flex;flex-wrap: wrap;}
.news ul li{width: calc(100%/2 - 20px);margin: 10px; padding: 0;}
.news ul li a{color:#333; display:flex; padding:10px;border: 1px #eeeeee solid;position: relative;}
.news ul li a:before{content: "";display: block;width: 14px; height: 14px;border-top: 1px #263449 solid;border-left: 1px #263449 solid;position: absolute;top: -1px; left: -1px;transition: all 0.5s ease 0s;}
.news ul li a:after{content: "";display: block;width: 14px; height: 14px;border-bottom: 1px #263449 solid;border-right: 1px #263449 solid;position: absolute;bottom: -1px; right: -1px;transition: all 0.5s ease 0s;}
.news ul li a:hover{background:#f9f9f9;position: relative;}
.news ul li a:hover:before{content: "";display: block;width:calc(100% + 2px); height: calc(100% + 2px);border-top: 1px #263449 solid;border-left: 1px #263449 solid;position: absolute;top: -1px; left: -1px;transition: all 0.5s ease 0s;}
.news ul li a:hover:after{content: "";display: block;width:calc(100% + 2px); height:calc(100% + 2px);border-bottom: 1px #263449 solid;border-right: 1px #263449 solid;position: absolute;bottom: -1px; right: -1px;transition: all 0.5s ease 0s;}
.news ul li .news-photo-main{overflow: hidden;flex: 1;height: 100%;}
.news ul li .news-photo{width: 100%; background-color: #f9f9f9; background-position: center center;background-repeat: no-repeat;background-size: cover;transform:scale(1);transition: all 0.5s ease 0s;overflow: hidden;}
.news ul li .news-information{width: 100%; padding:0 0 0 15px;flex: 1.5;}
.news ul li .news-information h3{font-size: 16px; color: #000000;font-weight: bold;padding: 0;margin:5px 0;line-height: 1.4;overflow: hidden;text-overflow: ellipsis;height:22px;display: -webkit-box;-webkit-line-clamp: 1;-webkit-box-orient: vertical;}
.news ul li .news-information .news-date{font-size: 13px;text-transform: uppercase; color: #ffffff;margin: 10px 0;padding: 3px 15px; background: #263449;display: table;}
.news ul li .news-information .news-content{font-size: 15px; color: #666666;overflow: hidden;text-overflow: ellipsis;height:48px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.news ul li:hover .news-photo{transform:scale(1.1);transition: all 0.5s ease 0s;}
.news-detail-date{font-size: 13px;text-transform: uppercase; color: #ffffff;margin: 15px 0;padding: 3px 15px; background: #263449;display: table;font-style: italic;}
@media screen and (max-width:767px){
	.news ul li{width: calc(100%/1 - 0px);margin: 10px 0;}
}
@media screen and (max-width:575px){
    .news ul li{width: calc(100%/2 - 10px);margin: 5px;}
	.news ul li a{ display:block;}
    .news ul li .news-photo-main{width: 100%;}
    .news ul li .news-information{padding:0;}
    .news ul li .news-information .news-date{display: block;text-align: center;}
}

/** 產品搜尋 **/
.pro-search-info{font-size:18px; color:#64691F; line-height:1.5em; border-bottom:1px #CCC dotted; margin-bottom:20px; text-align:center; padding-bottom:10px;}

/** 產品列表介紹 **/
.pro-store-info{font-size:16px; color:#333333; padding:0; margin-bottom:20px;}
.pro-list ul{max-width:1200px; margin:0 auto; padding:0; list-style:none; display:flex; flex-wrap:wrap;}
.pro-list ul li{width:calc(100%/4 - 20px); margin:10px; padding:0; text-align:center;}
.pro-list ul li a{display: block;}
.pro-list ul li a:hover{background:#f8f6f6;}
.pro-list ul li h4{font-size:16px; color:#333333;background: #f3f3f3; line-height:1.4; font-weight:normal; padding:8px 10px; margin:0;}
.pro-photo-main{border-bottom: 3px #003586 solid;overflow: hidden;}
.pro-photo{background-color: #ffffff;background-position: center center;background-size:contain;background-repeat: no-repeat;transform:scale(1);transition: all 0.5s ease 0s;}
.pro-photo img{width:100%; height:auto;}
.pro-list ul li:hover .pro-photo{transform:scale(1.1);transition: all 0.5s ease 0s;}
@media screen and (max-width:767px){
	.pro-list ul li{width:calc(100%/3 - 20px);}
}
@media screen and (max-width:575px){
		.pro-list ul li{width:calc(100%/2 - 10px);margin: 5px;}
}

/** 產品明細 **/
.pro-detaile-title{font-size:18px; color:#333; padding:5px; margin:0 0 10px 0; font-weight:normal;}
.pro-detaile-box{display:flex; flex-wrap:wrap; margin:0 0 15px 0;}
.pro-detaile-photo-box{width:calc(50% - 25px); margin:0 25px 0 0;}
.pro-detaile-spe-box{width:50%; position:relative; padding-bottom:210px;}
.pro-detaile .pro-photo-box{background:#fff; width:100%; margin:0; padding:0;}
.pro-detaile .pro-photo-box img{width:100%; height:auto;}
.pro-list-time{background:url(../images/time.png) left center no-repeat; font-size:12px; color:#968c69; padding-left:20px;}
.pro-specification{font-size:15px; color:#333; position:relative;}
.cart-info{position:absolute; width:100%; bottom:0;}
.cart-info .price{font-size:22px; font-weight:bold; color:#F00; vertical-align:middle; display:block; text-align:right;}
.cart-info .price.origin{font-size:smaller; color:#666; text-decoration:line-through;}
.cart-info .price.special{font-size:smaller; color:#000;}
h3.pro-introduce{background:#999; font-weight:normal; border-left:5px #111111 solid; padding:8px 10px; font-size:20px; color:#fff; margin:25px 0 15px 0;}
.pro-content{padding:0px 0; font-size:15px; color:#333; clear:both;}
@media screen and (max-width:767px){
	.pro-detaile-box{display:block;}
	.pro-detaile-photo-box{width:100%; margin:0 0 15px 0;}
	.pro-detaile-spe-box{width:100%; padding-bottom:0;}
	.cart-info{position:inherit; bottom:inherit;}
}

/** 聯絡我們 **/
.contact-body{}
.contact-note{font-weight:normal; font-size:14px; background:#d92121;border-radius: 3px; padding: 2px 15px;display: table;color: #ffffff;}
.contact-content{}
.contact-content ul{list-style: none;padding: 0;margin: 0;}
.contact-content ul li{padding: 0;margin:8px 0;display: flex;}
.contact-content ul li .contact-icon{width: 30px;padding: 6px 0; }
.contact-content ul li .contact-content{flex: 1;margin: 0 0 0 15px;}
.contact-content ul li .contact-content span{font-size: 16px;color: #003586;font-weight: bold;display: block;width: 100%;}
.googlemap {position: relative;padding-bottom: 57%;padding-top: 30px;height: 0;overflow: hidden;margin: 15px 0 0 0;}
.googlemap iframe {position: absolute;top:0;left: 0;width: 100%;height: 100%;}
@media screen and (max-width:767px){
	.googlemap {margin: 15px 0;}
    .contact-content ul li .contact-icon{width: 25px;padding: 3px 0;}
}

/** 表單欄位 **/
label{margin-bottom: 0;min-width: 100px;}
.form-box input, .form-box img{vertical-align:middle;}
.opinion{display:flex; flex-wrap:wrap; margin:5px 0;border-radius:3px; overflow:hidden;}
.opinion-left01{ width:100%; min-width:100%; padding:5px 15px; font-weight:bold; font-size:16px; font-family:"Microsoft JhengHei"; color:#495057; line-height:1.8; display:flex; align-items:center;}
.input-main-style01{background:#ffffff; width:100%; border:0; margin:0; padding:5px 15px;border-bottom: 1px #cccccc solid; font-size:16px; font-family:"Microsoft JhengHei"; color:#333; line-height:1.8; min-height:37px;}
.input-main-style02{background:#ffffff; flex:1; width:100%; border:0;border-bottom: 1px #cccccc solid;margin:0; padding:5px 15px; font-size:16px; font-family:"Microsoft JhengHei"; color:#333; line-height:1.8; min-height:37px;}
.input-main-style03{background:#f4f8fb; flex:1; width:100%; border:0; margin:5px 0 0 0; padding:5px 15px; font-size:16px; font-family:"Microsoft JhengHei"; color:#333; line-height:1.8; min-height:37px;}
.input-main-select{background:none; flex:1; width:100%; border:0; margin:0; padding:5px; font-size:16px; font-family:"Microsoft JhengHei"; color:#333; line-height:1.8; display:flex; flex-wrap:wrap;}
.input-main-select select{background:#f4f8fb; width:calc(50% - 2.5px); margin-right:5px; padding:5px 15px; line-height:1.8; border:0; font-size:16px; font-family:"Microsoft JhengHei"; color:#333; min-height:37px;}
.input-main-select select:nth-child(2){margin-right:0;}
.select-style{background:#8a6e0c; font-size:16px; color:#ffffff; line-height:20px; padding:5px 10px; border:0;}
.input-style01{background:#f4f8fb; flex:1; width:100%; border:0; margin:0; padding:5px 15px; font-size:16px; font-family:"Microsoft JhengHei"; color:#333; line-height:1.8; min-height:37px;}
input:disabled{background-color:#fff; color:#2d7fb9; cursor:no-drop;}
.btn.openlink{margin:3px 0; padding:0 10px; text-align:center; font-size:16px; line-height:1.5; font-weight:bold; background-color:#2d7fb9; color:#fff; border-radius:5px;}
.btn.openlink:hover{background-color:#ffbe00;}
img.code{width:100px; height:37px; margin:0; vertical-align:middle; display:inline-block;}
.input-main-style01:focus,.input-main-style02:focus{border-bottom: 1px #d92121 solid;}
@media screen and (max-width:575px){
	.input-main-style02{width:calc(100% - 105px); display:inline-block;}
}

/** 按鈕 **/
.cart-btn{text-align:center; margin-top:20px; display:flex; flex-wrap:wrap; justify-content:flex-end; align-items:center;}
.cart-btn i{margin: 0 10px 0 0;}
.btn-send{font-size:13px;}
a.btn-send{padding:5px 20px;background:#003586; text-align:center; font-size:15px; color:#ffffff; min-width:100px; margin:5px 0 5px 10px;border-radius:0px;}
a.btn-send:hover{background:#fa8616;box-shadow: 2px 2px 0 0 #999999;}
a.btn-reset{background:#666666; padding:5px 20px; text-align:center; font-size:15px; color:#ffffff; min-width:100px; margin:5px 0 5px 10px; border-radius:0px;}
a.btn-reset:hover{background:#333333; box-shadow: 2px 2px 0 0 #999999;}
a.btn-send-over{background:#7ea2c5; padding:5px 20px; text-align:center; font-size:15px; color:#fff; min-width:100px; margin:5px; border-radius:0px; }
a.btn-send-over:hover{background:#96b9dc; border:2px solid #96b9dc;}
@media screen and (max-width:575px){
	a.btn-send{padding:5px 10px; width:calc(50% - 5px);margin: 5px 0 5px 5px;}
	a.btn-reset{padding:5px 10px; width:calc(50% - 5px);margin: 5px 5px 5px 0px;}
	a.btn-send-over{padding:5px 10px; width:calc(50% - 10px);}
}

/** 頁次 **/
.page{font-size:14px; color:#333; text-align:center; clear:both; margin:30px 0 15px 0;}
.page a{display:inline-block;margin: 10px 0; background:#000000; color:#fff; padding:3px 15px;}
.page a:hover{background:#fa8616; color:#fff;}
.page br{display:none;}
@media screen and (max-width:640px){
	.page br{display:block;}
}

/** 下版 **/
footer{background: #f6f6f6;padding:6px 15px;}
footer .footer{max-width:1000px; margin:0 auto;}
footer .footer .footer-content{display: flex;padding: 26px 0;}
footer .footer .footer-content .footer-logo{width: 180px;text-align: center;display: flex;flex-wrap: wrap; align-content: center;justify-content: center;}
footer .footer .footer-content .footer-logo img{width: 100%;}
footer .footer .footer-content .footer-logo .logo-font{font-size: 16px; color: #003586;font-weight: bold;margin: 3px 0 0 0;width: 100%;}
footer .footer .footer-content .footer-icon{width: 126px;display: flex;align-items: flex-end;justify-content: flex-end;}
footer .footer .footer-content .footer-icon ul{list-style: none;padding: 0;margin: 0;display: flex;}
footer .footer .footer-content .footer-icon ul li{width: 42px; padding:6px 6px;margin: 0;transition: all 0.3s ease 0s;}
footer .footer .footer-content .footer-icon ul li:hover{transform: translateY(-5px);transition: all 0.3s ease 0s;}
footer .footer .footer-information{flex: 1; padding: 0 25px;border-left: 1px #d3d3d3 solid;margin: 0 35px;display: flex;align-items: center;}
footer .footer .footer-information ul{list-style: none;padding: 0;margin: 0;display: flex;flex-wrap: wrap;}
footer .footer .footer-information ul li{padding: 0;margin:8px 10px;width: auto;font-size: 14px; color: #000000;display: flex;}
footer .footer .footer-information ul li:nth-child(odd){margin: 8px 30px 8px 10px;}
footer .footer .footer-information ul li i{width: 22px; margin: 0 10px 0 0; }
footer .footer .footer-information ul li .footer-dep{flex: 1;}
footer .footer .footer-information span{display: inline-block;padding: 0 25px;font-size: 14px; color: #000000;}
footer .footer .footer-information ul li a{color: #000000;}
footer .footer .footer-information ul li a:hover{color: #003586;}
.copyright{color:#999999;font-size:12px;text-align: center;padding: 8px 15px;}
.copyright .wd {padding: 0 0 0 18px;}
.copyright .wd a{color:#999999;}
.copyright .wd a:hover{color: #003586;}
@media screen and (max-width:930px){
    footer .footer .footer-content{flex-wrap: wrap;padding: 15px 0;}
    footer .footer .footer-information{padding: 0 20px;margin: 0 20px;}
    footer .footer .footer-information ul li{width: 100%;margin: 8px 0;}
    footer .footer .footer-information ul li:nth-child(odd){margin: 8px 0;}
}
@media screen and (max-width:767px){
    footer .footer .footer-content .footer-logo{align-content:flex-start;}
    footer .footer .footer-content .footer-icon{width: 100%; margin:-65px auto 0 auto;justify-content:flex-start;}
    footer .footer .footer-content .footer-icon ul{width: 126px;}
    footer .footer .footer-information{padding: 0 0 0 20px;margin: 0 0 0 20px;}
    .copyright .wd {padding: 0 ;width: 100%;display: block;}
}
@media screen and (max-width:575px){
    footer .footer .footer-content{display: block;}
    footer .footer .footer-content .footer-logo{width: 160px;margin: 0 auto 10px auto;}
    footer .footer .footer-content .footer-logo .logo-font{font-size: 15px;}
    footer .footer .footer-information{width: 100%; padding: 0 ;margin: 0;border-left: 0;}
    footer .footer .footer-information ul li{text-align: center;margin: 0}
    footer .footer .footer-information ul li:nth-child(odd){margin: 0;}
    footer .footer .footer-information ul li i{display: none;}
    footer .footer .footer-content .footer-icon{width: 100%; margin:10px auto 0 auto;justify-content:center;}
}