@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);/*思源黑體 Noto Sans TC*/
@import url(https://fonts.googleapis.com/earlyaccess/cwtexyen.css);/*圓體 cwTeXYen*/
body{
	font-family: "微軟正黑體", "Arial Unicode MS";
	font-size: 15px;
	color: #000;
	word-wrap: break-word;
	word-break: break-all; 
	}
a{color:#535353;}
a:hover{color:#336699; text-decoration: none}

/*==反選的底色==========================================*/	
::selection {text-shadow: none;background: #362e2b;	color:#eee;}
img::selection {background: 0 0}
/*============================================================*/
.title{font-family:'微軟正黑體', Arial; font-size: 30px; color: #e83338; text-align: center;display:flex;
        align-items: center; margin:1% 0 2.5%;}/*標題*/
.title:after,.title:before {
        content: "";
        flex: 1;/*幾等份*/
        border: none;
        margin: 0 1.5rem;
        border-top: 5px solid #e83338;
}

.title2{font-family:'微軟正黑體', Arial; font-size: 30px; color: #011641; text-align: center;display:flex;
        align-items: center; margin:1% 0 2.5%;}/*標題*/
.title2:after,.title2:before {
        content: "";
        flex: 1;/*幾等份*/
        border: none;
        margin: 0 1.5rem;
        border-top: 5px solid #011641;
}

.title-textsyle1{ color: #992621; text-align: left;margin: 1% 0 2%; padding: 0 0 3px 15px; width: 100%; }
.title-textsyle2{color: #a65d02; text-align: left;margin: 1% 0 2%; padding: 0 0 3px 15px; width: 100%;}
.title-textsyle3{color: #006633; text-align: left;margin: 1% 0 2%; padding: 0 0 3px 15px; width: 100%;}
.container-padding{padding: 1.5% 15px; min-height: 70vh; }
.container-bg-padding{padding: 1.5% 15px; min-height: 70vh; background-color:#fff; margin:1% auto;}
/*欄位設定*/
.col-bottom{ margin-bottom: 30px;}
@media (max-width:767px){
.col-bottom{ margin-bottom: 10px;}	
}
.img-box{position: relative; overflow: hidden;;box-sizing: border-box;background-color: #fff; box-shadow: 0 0 5px #d2d2d2}
.col-bottom img.img-borderstyle2:hover{opacity: .6}
/*img設定*/
.img-borderstyle1{transition: all 0.5s; padding: 5px;}
.img-borderstyle1:hover{opacity: 0.6; transform: scale(1.1);}
.img-borderstyle2{border: 1px solid #a2c571;transition: all 0.5s;}


/*scroll-up-top*/
.scroll-up{ width: 50px; height: 50px;background-color: #44413f; border: 1px solid #fff;border-radius: 50%;position: fixed;
    bottom: 65px;right: 20px;z-index: 100;cursor: pointer; text-align: center; line-height: 50px; display: none;color: #fff}
.scroll-up::before{content: "\f106";  font-family: FontAwesome; ; color:#fff;  position: absolute;top: -15px;width: 50px;
    left: 0px;}
.scroll-up:hover{ background-color: #333; color:#E4C798}

/*顏色設定*/
.color_red{ color:#FF0004}

/*==navbar_padding==========================================*/	
.navbar_padding{padding-top:90px }
@media  (max-width : 1440px) {
.navbar_padding{padding-top:100px }
}
@media  (max-width : 768px) {
.navbar_padding{padding-top:60px }	
}
/*==index-about==========================================*/
.index-about{ background-image: url(../images/symbol/aboutbg.jpg); background-position: center right; background-size:cover;  background-repeat: no-repeat; box-sizing: border-box;padding: 8% 0; margin: 1% 0;}
@media(max-width:768px){
 .bg-xs{ background-color: rgba(255,255,255,0.8);}	
}
/*====index-link===========*/
.index-link{}
.index-link ul{ margin:0; padding:0}
.index-link > ul > li{ list-style: none;line-height:2.0; border-bottom:1px #91bed4 dashed; padding-right:30px; padding:0; width:47%; float:left; box-sizing:border-box; margin-right:3%}
.index-link > ul > li::before{ content: "\f0da";  font-family: FontAwesome; padding-right: 5px}
.index-link > ul > li a:hover{ color:#d2d2d2}
@media (max-width: 767px) {
.index-link > ul > li{width:100%}
}
/*========indexnews============*/
.indexnews{margin: 5% auto 2%;}
.newtime{font-size: 14px;color: #676767;float: right;padding-top: 25px}
.indexnews ul{ margin:0; padding:0; width: 100%;display:flex;flex-wrap:wrap;}
.indexnews ul li{list-style:none;}
.indexnews .news-box{background-color:#fff; box-sizing: border-box; box-shadow: 0 0 5px #d2d2d2; overflow: hidden; transition:all .5s; padding-bottom: 10px;}
.indexnews .news-box .news-img-box,.indexnews .news-box .mv{position: relative;/*max-height: 180px; overflow: hidden*/;box-sizing: border-box;background-color: #fff;}
.img-bg2{position: relative;background-size: cover; height:190px;background-position: center;transition: all 0.5s;width: 99.99%}
.img-bg2:hover{opacity: 0.6; transform: scale(1.1);}
.news-box h4{padding: 0 10px; line-height: 1.3}
.indexnews ul li h4 a{font-size: 17px; color:#fff;letter-spacing:1px;  }
.indexnews ul li h4 a:hover{color: #fff;text-decoration: none;}
/*=====news==========================================*/
.news{box-shadow: 0 0 5px #d2d2d2; margin: 1% 0;background-color: rgba(255,255,255,.8);transition: all 0.5s;padding-bottom: 10px;}
.news:hover{ background-color:#30426a;}
.news:hover a span.date{color:#fff;}
.news h3{padding: 0 2%;}
.news:hover  h3{color:#fff;}
.news .news-img-box,.news .mv{/*height: 190px;*/ overflow: hidden;background-color: #fff;}
.img-bg{position: relative;background-size: cover; height:190px;background-position: center;transition: all 0.5s;width: 99.99%}
.img-bg:hover{opacity: 0.6; transform: scale(1.1);}
.news a span.date,.indexnews span.date{color: #898989; border-radius: 20px;padding: 1px 10px;font-size: 13px; letter-spacing: 0.5px}
.news a span.date::before,.indexnews span.date::before{content: "\f073";  font-family: FontAwesome; padding-right:5px;}
/*==news_detail==========================================*/	
.news_detail{}
.news_detail > h2{ font-size:24px; font-weight: bold;}
.news_detail_img{ text-align:center; width:auto;height: auto;max-width: 90%; margin-bottom:10px;}
.news_detail img{ max-width:100% !important; height:auto !important}
.share{}
.share ul{}
@media (max-width:420px){
.share ul{margin-left: 20%}	
}
.share ul li{list-style: none;float: left;margin-right: 3% }
.share ul li a{color: #fff;  }
.share ul li.share-fb{background-color:#3b5998;color: #fff;padding: 5px 10px;box-sizing: border-box;}
.share ul li.share-fb::before{content: "\f09a";font-family: FontAwesome; padding-right: 5px }
.share ul li.share-line{background-color:#01b901;color: #fff;padding: 5px 10px 5px 30px;box-sizing: border-box;position: relative;}
.share ul li.share-line::before{content: "";background-image: url(../images/symbol/line_icon.svg);width: 30px;height: 30px;position: absolute;left: 0;top: 0;background-repeat: no-repeat;}
.share ul li.share-fb a,.share ul li.share-line a{display: inline-block}
/*==bannerimg==========================================*/	
.bannerimg{ background-repeat: no-repeat; width: 100%; height: 100vh;background-size:contain;}
/*====MemoSpec===========*/
.memoSpec { font-size:15px; color: #000;}
.memoSpec a{ color:#333}
.memoSpec a:hover{ text-decoration:none; color:#003567 !important; font-weight:bold;}
.memoSpec p{font-size: 15px;letter-spacing: 1px;line-height:1.3;}
.memoSpec h1{font-family: 'Kaushan Script',"微軟正黑體", Arial; font-size: 48px;color: #362e2b;}/*英文標題*/
.memoSpec img{ max-width:100% !important; height: auto !important;}
.memoSpec table.noborder{ borer:0;}
.memoSpec table.noborder tr td{ text-align: center}
.memoSpec  table tr th{ background-color:#969696; color:#333; text-align:center;}
.table_style1{}
.table_style1 tr.block{ background-color:#262626; color:#fff;}
.table_style1 tr td{ padding:3% 0 2% 3%;}
/*==coll_info==========================================*/
.coll_info{color: #535353;font-size:14px;}
.coll_info h3{ color:#362e2b; text-align:center; line-height:1.5; font-size:16px;margin:15px 0 10px;}
.coll-info-title {margin-bottom: 1%}
.coll-info-title p{font-size: 18px;padding-top: 3%;line-height: 2;font-weight: 600}
.coll-info-title img{width: 120px; border: 1px solid #999;float: right;margin-bottom: 2%;margin-right: 3%}
@media (max-width: 767px){
.coll-info-title img{float: none;margin: 0 auto;display: block;}
.coll-info-title p{text-align: center}	
}
/*===========bottom-comp-info===========*/
.comp-info{
	background:#304269;
	padding: 2% 0 0;
	color: #fff;
	line-height:1.5;
	letter-spacing:0.5px;
	}
.comp-info  a{color: #fff}
.comp-info h4{ padding:0; margin:0 0 1%; letter-spacing:1px; }
@media (max-width:767px) {
	.comp-info h4{ margin: 5% 0}	
}
.comp-info h2{ width: 50%; margin: 15px auto;color: #fff; text-align: center;}
.comp-time-title{ color:#fff;background-color: #982A2B; letter-spacing:2px; text-align:center; padding:2%; margin-bottom:1%}
.comp-time{ color:#fff;background-color: #B80608; letter-spacing:2px;padding:2% ;margin-bottom:1%}
.info-item{padding-bottom: 1%}
@media (max-width:767px) {
	.comp-info h2{ width: 100%;} 
}
/*====bottom-icon===========*/
.bottom-icon{ height: 40px;margin-top:2%;}
.bottom-icon ul {margin: 0; padding: 0;}
.bottom-icon ul li{ list-style: none;float: left; margin-right: 3%;}

/*====footer===========*/
footer {padding: 5px 0;text-align: center;font-size:13px;background-color:#333;color:#fff;}
footer a{ color:#fff}
footer a:hover{ color:#E4C798}
/*==============================公司網頁內文==============================*/
/*關於我們*/
.about{}
.about p{ line-height: 2.0}
/*==prodshow 產品===================================================================*/
/*prodimgbox*/
.prodimgbox{ padding:15px; }
.prodimgbox:hover{opacity:0.7;}
.prodimgsize{ height:200px; display: flex; justify-content: center; align-items: center; }/*垂直置中*/
@media (max-width: 420px){
.prodimgsize{ height:120px;}
}
/*prodshow*/
.prod_imggroup{}
.prod_imggroup ul{ margin: 10px 5px;}
.prod_imggroup ul li{float: left; border: 3px solid #fff; width:125px;height: 125px;  background-size: cover; background-position: center center;background-repeat: no-repeat;position: relative;display: inline-block;margin-right: 15px; margin-bottom: 10px;}
.prod_imggroup ul li:nth-child(4n){margin-right: 0px;}
.prod_imggroup ul li:after{width:130px;  height: 130px;  content: " ";  position: absolute;  top:-6px;  left:-6px;  border: 1px solid #c9c9c9;}
/*prodtext*/

.prodtext { }
.prodtext h6{color:#294273; font-size: 14px; font-weight: 600;margin: 10px 0 10px }/*型號*/
.prodtext h3{font-family: "微軟正黑體"," 新細明體", Arial Unicode MS; font-weight: 800;color: #000;font-size: 20px;margin: 10px 0 20px; }
.prodtext h4{color: #898989;line-height: 1.8;font-size: 15px;margin-bottom: 10px;}

.prodname{font-family: "微軟正黑體","新細明體", Arial Unicode MS; font-size: 15px;color: #000}
.prodname a{color: #000}
.prodname a:hover{color:#632a89 }
@media (max-width: 767px){
	.prodname{ height: 40px}
	
}
.price-1{color: #333; line-height:20px}/*原價*/
.price-2{color: #7d0000;font-weight: 600;line-height:20px}/*熱銷價*/

.prodshow_content{ padding-top: 20px;}
/*==產品選單===================================================================*/
/*leftemenu_prod*/

h5.lar i{color:#5e2b88}
h5.lar a{ color:#333;}
#menu{
	margin:0px; padding:0px;
	}
#menu h4{
	padding-bottom: 5px;
	color:#000; font-size:16px; font-weight:bold;letter-spacing:1px;
	padding-left: 5px;
	cursor: pointer;
	margin-bottom: 5px; margin-top:10px;
	}
#menu h4 span{color: #ccc;font-size: 15px;font-weight: normal;margin-left: 3px;}
#menu li{list-style-type: none;}
#menu li {color: #002a40;}	
#menu li a{
	color: #000; letter-spacing:1px;font-size:15px; padding: 2px 0px 2px 15px; display: block;position: relative;transition: all 0.3s;
	}
#menu li a::before{content: "\f101";font-family: FontAwesome; padding-right: 5px}	
#menu li a:hover{
	color: #002a40;padding-left:30px; font-weight:600;}
#menu li .active,#menu li .active:hover{
	background-color: #002a40;transition: all 0.5s;	color: #fff;
	}
#menu .prod-lartext {margin-bottom:10px;;color: #000;}	
#menu .prod-lartext a{color: #000;transition: all .5s}
#menu .prod-lartext a:hover{color: #065076;padding-left:10px;}	
.menu_style{
	display:none;
	margin:0;
	padding-left:10px;
	}
.menu_style li{
	list-style-type: none;
	font-size:14px;
	}
/*==prod===================================================================*/
/*會員專選單*/
.leftmenu{}
.leftmenu ul{ margin: 0; padding: 0}
.leftmenu ul li{list-style: none;margin-bottom: 10px;}
.leftmenu ul li a::before{content: "\f0a9";  font-family: FontAwesome; ; padding-right: 7px; }
.leftmenu ul li a{ color: #333}
.leftmenu ul li a:hover{ color:#555}
/*my_info_save*/
.col_bg{ background-color:#eee; padding:5px 0px 5px 10px; margin-bottom:5px;}

/*==nav2- 第一選單===================================================================*/
.nav2{ text-align:right}
.nav2 a{ font-size:13px; color:#333}
.nav2  span.nav-member{padding-top:5px; display:inline}
@media (max-width:420px){
.nav2{ text-align:center;}
.nav2 a{ font-size:14px;}
.nav2 span.nav-member{ padding:10px 0;}
	
	}
/*google-map*/	
.rwd-map {
display: block; position: relative;
overflow: hidden; height: 0; padding: 0;
padding-bottom: 200%;/*100%*/
}
@media (max-width: 767px){
.rwd-map {padding-bottom: 100%;}
}
.rwd-map iframe {
position: absolute;
height: 100%; width: 100%;
left: 0; top: 0;
}
/*20181205新增*/
.navbar-default-bg{background-image: url(../images/symbol/nabar_bg.jpg); background-repeat:no-repeat; background-size: cover; background-position: center bottom}
.navbar-brand img{height:70px}
.nav2-position{margin-left:10px;padding-top:10px;padding-top:35px; float:right}
.nav2-position2{display: inline !important}
.nav-padding{padding-top:35px;}
.navbar-form .input-group>.form-control { width:100px;}
@media (max-width:767px){
.navbar-default-bg{ background-image:none}
.nav-padding{padding-top:5px;}
.navbar-brand{ padding-top:10px}
.navbar-brand img{height:40px}
.nav2-position{float: left;padding-top:10px;}
.nav2-position2{float:right; margin-left:0px;}
.navbar-form .input-group>.form-control { width:100%;}	
}
.navbar-default .navbar-nav>li>a{ color:#000 ; font-size:18px;}
.nav2 a{color:#333}
.form-control-black {
    background-color: transparent;
    border: 0;
    border-radius: 0px;
    border-bottom: 1px solid #333;
    color: #000;
}
.form-control,.form-control:focus{
    box-shadow: inset 0 0px 0px;
}

::placeholder {
   color:#333 !important;
   opacity: 1;
}