@charset "utf-8";
/* =============== 按鈕列 ================== */
nav .a1{float: right; position: absolute; right: 14%; top: 15px; width: 200px; }
nav .top-search{float: left;}

/* =============== RWD for search ================== */
@media(max-width:1600px){
nav .a1{right: 15%;}
}

@media(max-width:1500px){
nav .a1{right: 11%;}
}

@media(max-width:1440px){
    nav .a1{top:20px; right: 11%; }
}

@media(max-width:1280px){
    nav .a1{top:5px; right: 18%; }
}

@media(max-width:1024px){
nav .a1{right: 16%;}
   nav .top-search{ margin-top: 35px; margin-right: 10px;} 
}

@media(max-width:770px){
   nav .a1{top: 0; right: 18%;}
   nav .top-search{ margin-top: 35px; } 
}

@media(max-width:700px){
   nav .top-search{ margin-top: -10px; margin-right: 20px;} 
}

/* =============== Top Search ================== */
.navbar-nav li:last-child{display: none;}
ul language{display: none;}

@media(max-width:620px){
   .navbar-nav li:last-child{display: block;} 
}

.sub{font-family: 'Droid Serif', serif;
     font-size: 30px; width: 280px; margin: 60px auto 50px; color: #7b6f6f; text-decoration: underline;}

.sub_1{font-family: 'Droid Serif', serif;
     font-size: 30px; width: 200px; margin: 30px 0 30px 13%; color: #dad2cc; text-decoration: underline;}

.sub_2{font-family: 'Droid Serif', serif;
     font-size: 30px; width: 280px; margin: -20px auto -40px; color: #7b6f6f; text-decoration: underline;}

.sub_about{font-family: 'Droid Serif', serif;
     font-size: 30px; width: 280px; margin: 0px auto; color: #7b6f6f; text-decoration: underline;}

.sub_PS{font-family: 'Droid Serif', serif;
     font-size: 30px; width: 330px; margin: 0px auto; color: #7b6f6f; text-decoration: underline;}

/* =============== RWD for sub ================== */
@media(max-width:1650px){
    .sub_1{margin: 30px 0 10px 17%;}
}

@media(max-width:1600px){
    .sub_1{margin: 30px 0 30px 15%;}
}

@media(max-width:770px){
    .sub{margin: 30px auto 40px;}
    .sub_2{margin: -80px auto 0px;}
}

@media(max-width:650px){
    .sub{margin: 30px 10% 20px 20%;}
}

@media(max-width:420px){
    .sub_2{margin: -70px auto -50px;}
}

@media(max-width:380px){
    .sub{margin: 30px 10% 20px 15%;}
    .sub_2{margin: -90px auto -40px;}
}

@media(max-width:330px){
    .sub{margin: 30px 10% 20px 10%;}
    .sub_2{margin:-80px auto -20px;}
}
.about{width: 700px; margin: 30px 20% 10px -80px; font-family: 'Roboto', sans-serif; font-size: 30px; line-height: 40px; color: #fff; text-align: justify;}

/* =============== RWD for about ================== */
@media(max-width:1600px){
   .about{margin: 30px 20% 10px -120px;} 
}

@media(max-width:800px){
   .about{margin: 0 0 0 0;} 
}

@media(max-width:450px){
   .about{margin: 30px 20% 10px 15px;} 
}

@media(max-width:350px){
   .about{margin: 30px 0% 10px -120px;} 
}

.ABOUT-TXT{padding: 50px 5% 50px 5%;}

/* =============== inside banner ================== */
.ABOUT_top{background-color: #1a1a1a;}
.ABOUT_top img{width:817px; height: auto; position: relative; left:34%;}

/* =============== RWD for inside banner ================== */
@media(max-width:1680px){
    .ABOUT_top img{left:31%;}
}

@media(max-width:1600px){
    .ABOUT_top img{left:31%;}
}

@media(max-width:1440px){
    .ABOUT_top img{left:29%;}
}

@media(max-width:1400px){
    .ABOUT_top img{left:28%;}
}

@media(max-width:1360px){
    .ABOUT_top img{left:28%;}
}

@media(max-width:1280px){
    .ABOUT_top img{left:28%;}
}

@media(max-width:1152px){
    .ABOUT_top img{left:23%;}
}

@media(max-width:1024px){
    .ABOUT_top img{left:19%;}
}

@media(max-width:800px){
    .ABOUT_top img{width:85%; left:15%;}
}

@media(max-width:770px){
    .ABOUT_top img{margin-left: 1%;}
}

@media(max-width:450px){
    .ABOUT_top img{margin-left: -4%;}
}

@media(max-width:360px){
    .ABOUT_top img{margin-left: 1%;}
}

/* =============== RWD for default -- About us ================== */
@media(max-width:1600px){
    .ABOUT-TXT{padding: 50px 10% 50px 5%;}
    .ABOUT-TXT p{
    width: 600px;
    font-size: 18px;
    line-height: 30px;
    margin: 0 0 20px 100px;
}
}

@media(max-width:1500px){
    .sub_1{margin: 30px 0 30px 5%;}

    .ABOUT-TXT{padding: 50px 5% 30px 15%;}
    .ABOUT-TXT p{
    width: 600px;
    font-size: 18px;
    line-height: 30px;
    margin: 0 0 0 -20px;
}
}

@media(max-width:1300px){
    .ABOUT-TXT{padding: 50px 15% 10px 15%;}
    .ABOUT-TXT p{
    width: 550px;
    font-size: 16px;
    line-height: 25px;}
    .HOME_ABOUT{min-height: 500px;}
}

@media(max-width:1180px){
    .sub_1{margin: 30px 0 30px 0%;}
    .ABOUT-TXT{padding: 50px 10% 10px 12%;}
    .ABOUT-TXT p{
    width: 500px;
    font-size: 16px;
    line-height: 22px;}
    .HOME_ABOUT{min-height: 420px;}
}

@media(max-width:1050px){
    .ABOUT-TXT{padding: 50px 10% 10px 12%;}
    .ABOUT-TXT p{width: 450px; margin-left: 30px;}
    .HOME_ABOUT{min-height: 480px;}
}

@media(max-width:800px){
    .sub_1{margin: 30px 0 30px 18%;}
    .ABOUT-TXT{padding: 0px 10% 10px 12%;}
    .ABOUT-TXT p{width: 720px; margin-left: -100px;}
}

@media(max-width:500px){
    .sub_1{margin:-20px 0 20px 12%;}
    .ABOUT-TXT{padding: 50px 30% 10px 0%;}
    .ABOUT-TXT p{width: 400px; margin-left: 0px;}
}

@media(max-width:420px){
    .ABOUT-TXT p{width: 370px; margin-left: -30px;}
}

@media(max-width:380px){
    .sub_1{margin: 20px 0 20px 5%;}
    .ABOUT-TXT{padding: 50px 20% 10px 0%;}
    .ABOUT-TXT p{width: 320px; margin-left: -30px;}
}

@media(max-width:330px){
    .sub_1{margin: 10px 0 20px 3%;}
    .ABOUT-TXT p{width: 290px; margin-left: 14%;}
}

.rowbox3{padding-bottom: 40px;}
.rowbox4{padding-bottom: 40px;}

@media(max-width:780px){
    .rowbox3{width: 98%; margin-top: -20px; margin-left: 40px;}
    .rowbox4{width: 105%; margin-left: 15px; margin-bottom: -50px;}
}

@media(max-width:420px){
    .rowbox3{width: 110%; margin-left: -20px; padding-bottom: 40px;}
    .rowbox4{width: 130%; margin-left: -50px; padding-bottom: 0px;}
}

@media(max-width:380px){
    .rowbox3{width: 100%; margin-left: 0px; padding-bottom: 40px;}
    .rowbox4{width: 100%; margin-left: -8px; padding-bottom: 0px;}
}

@media(max-width:370px){
    .rowbox3{width: 100%; margin-left: 0px; padding-bottom: 40px;}
    .rowbox4{width: 102%; margin-left: -10px; padding-bottom: 0px;}
}

@media(max-width:330px){
	.rowbox3 .controls {
	 margin-top: 10px; margin-bottom: -20px;
}
    .rowbox4 .controls {
     margin-top: 0px; margin-bottom: -20px;
}
}

/* =============== Product ================== */
.idec_1{font-size: 18px; font-weight: bolder; margin: 20px 0 0 10px;}
.idec_2{font-size: 16px; text-align: justify; margin: 20px 25px 0 10px;}
.idec_3{font-family: 'Roboto', sans-serif; margin: 20px 0 0 30px; font-size: 15px; line-height: 25px; text-align: justify; width: 800px;}
.idec_4{font-size: 18px; font-weight: bolder; margin: -20px 0 0 30px;}
.idec_5{font-family: 'Roboto', sans-serif; margin: 20px 0 0 15px; font-size: 15px; line-height: 25px; text-align: justify; width: 800px;}

@media(max-width:1200px){
.idec_5{width: 600px;}
}

@media(max-width:768px){
.idec_5{width: 420px;}
}

.view img {transition: all 0.5s;}
.view img:hover{transform: scale(1.1,1.1); box-shadow: 3px 3px 3px #999;}

section {margin-top: -290px; margin-left: -10px;}
section article ul{margin: 25px 0 0 -30px; font-size: 16px; font-weight: bolder; line-height: 30px;}

/* =============== RWD for Product ================== */
@media(max-width:1200px){
    section img {width:98%;}
    .idec_2{width: 96%;}
    .idec_3{width: 96%;}
}

@media(max-width:1000px){
    section img {width:92%;}
    .idec_2{width: 88%;}
    .idec_3{width: 88%;}
}

/* =============== Nav 中英文切換 ================== */
nav ul li {overflow:hidden;}
.item-container {top: 0; position:relative; height:30px; cursor:pointer; -webkit-transition: all 0.3s ease;
                -moz-transition: all 0.3s ease;-o-transition: all 0.3s ease;transition: all 0.3s ease; text-align: left;}
.item-container:hover{top:-60px;}
.item-top,.item-bottom {height:60px; position:relative; text-align: center;}
.item-top {color:#585858;}
.item-bottom {color:#585858;font-family: 'cwTeXHei', sans-serif; font-size: 15px;}

/* =============== 產品區 ================== */
.TStyle5{color: #6f6464; font-size: 17px; display: block;
    font-family: 'Roboto Condensed', sans-serif;
    width: 250px;
    padding: 8px 0;
    margin: 5px 0px 10px;
    text-decoration: none;}

.TStyle6{color: #000000; font-size: 14px;
    font-family: 'cwTeXHei', sans-serif;
    text-decoration: none; margin-top: 0px;}

.TStyle7{color: #4a4242; font-size: 22px; font-weight: bolder;
    font-family: 'cwTeXYen', sans-serif;
    text-decoration: none;}

.TStyle8{color: #000000; font-size: 14px;
    font-family: 'PT Sans', sans-serif;
    text-decoration: none; margin-top: 0px;}

/* =============== RWD fot 產品區 ================== */
@media(max-width:1200px){
    .TStyle5{width:auto;}
}

/* =============== Footer ================== */
footer{background-color: #90794e; width: 100%; min-height: 285px; position: relative;}
.footer_logo{float: none; margin-left: 20%; padding-top: 20px;}
.footer_address{position: relative; float: none; margin: 10px 10px 10px 21%;}

.QR{margin-left: 0px;}
.add{float: left; position: absolute; left: 150px; top:10px; }
footer .add_name{font-family: 'cwTeXHei', sans-serif; font-size: 20px; line-height: 20px; color: #e9e5d3; letter-spacing:3px;}
footer .add_name p{margin-top: 7px}
footer .tel{font-family: 'cwTeXHei', sans-serif; color: #e9e5d3; font-size: 14px; line-height: 15px; letter-spacing:2px; }
footer .tel p{ margin-bottom: 7px; }
footer .mail{font-family: 'cwTeXHei', sans-serif; color: #e9e5d3; font-size: 14px; line-height: 15px; letter-spacing:2px; text-decoration: none;}
footer .mail:hover{text-decoration: underline; color: #FFF;}

footer .footer_nav{float: left; position: absolute; margin-left: 50%; margin-top: -150px; width: 800px; font-size: 18px; font-weight: bold;}
footer .footer_nav a{font-size: 18px; float: left; display: block; color: #d6d1b7; text-decoration: none; margin-left: 20px; }
footer .footer_nav a:hover{text-decoration: underline; color: #fff;}

footer .media_icon{position: absolute; margin: 50px 0 0 10px;}
footer .media_icon a{float: left; margin-left: 5px;}
footer .design{font-size: 15px; color: rgba(255, 255, 255, 0.7);}
footer .design a{clear: both; font-size: 14px; font-weight: normal; margin: 80px 0 0 20px;}

/* =============== RWD for Footer ================== */
@media(max-width:1800px){
    .footer_logo{margin-left: 14%;}
    .footer_address{margin: 10px 10px 10px 15%;}
    footer .add_name{font-size: 20px; line-height: 22px; }
    footer .tel{font-size: 14px; line-height: 21px; }
    footer .footer_nav{margin-left: 50%;}
}

@media(max-width:1600px){
    .footer_logo{margin-left: 15%;}
    .footer_address{margin: 10px 10px 10px 16%;}
    footer .footer_nav{margin-left: 48%;}
}

@media(max-width:1200px){
    footer .design a{margin: 10px 0 0 20px;}
}

@media(max-width:400px){
    footer .design a{margin: 5px 0 0 20px;}
}

/* =============== RWD for footer ================== */
@media (max-width:1550px){
    .footer_logo{margin-left: 10%;}
    .footer_address{margin: 10px 10px 10px 12%;}
    footer .footer_nav{margin-left: 47%; width: 800px;}
}

@media (max-width:1400px){
    .footer_logo{margin-left: 7%;}
    .footer_address{margin: 10px 10px 10px 9%;}
    footer .footer_nav{margin-left: 48%; width: 500px;}
    footer .media_icon{margin: 60px 0 0 10px;}
    footer .design{margin-top: 110px;}
}

@media (max-width:1200px){
    footer .footer_nav{margin-left: 52%; width: 500px;}
}

@media (max-width:1000px){
    .footer_logo{margin-left: 4%;}
    .footer_address{margin: 10px 10px 10px 6%;}
    footer .footer_nav{margin-left: 58%; width: 350px;}
}

@media (max-width:850px){
    .footer_logo{margin-left: 2%;}
    .footer_address{margin: 10px 10px 10px 4%;}
    footer .footer_nav{margin-left: 62%; width: 280px;}
    footer .media_icon{margin: 85px 0 0 10px;}
    footer .design{margin-top: 120px;}
}

@media (max-width:750px){
    footer{min-height: 400px;}
    .footer_logo{margin-left: 10%;}
    .footer_address{margin: 10px 10px 10px 12%;}
    footer .footer_nav{float: none; margin-left: 10%; width: 500px; margin-top: 0px; }
    footer .media_icon{margin: 60px 0 0 10px;}
    footer .design{margin-top: 105px;}
}

@media (max-width:750px){
    .footer_logo{margin-left: 3%;}
    .footer_address{margin: 10px 10px 10px 5%;}
    footer .footer_nav{float: none; margin-left: 3%; width: 500px; margin-top: 0px; }  
}

@media (max-width:500px){
    .footer_logo{margin-left: 1%;}
    .footer_address{margin: 10px 10px 10px 3%;}
    footer .footer_nav{float: none; margin-left: 1%; width: 350px; margin-top: 0px; }  
    footer .media_icon{margin: 60px 0 0 10px;}
    footer .design{margin-top: 100px;}
    footer .add_name{letter-spacing:1px; margin-top: 5px;}
    footer .tel{letter-spacing:1px; }
    footer .tel p{margin-bottom: 12px;}
    footer .mail{letter-spacing:1px;}
}

@media (max-width:470px){
     footer{padding-left: 20px; min-height: 400px; overflow: hidden;}
    .footer_address{height: 200px; padding-top: 50px; overflow: hidden;}
    .QR{margin-top: -40px; margin-left: 1%;}
    .QR img{width: 70px;}
    .add{float: none; position: absolute; left: 23%; top:10px; overflow: hidden;}
    footer .footer_nav{float: none; width: 350px; margin-left: 1%; margin-top: -40px; }  
}

@media (max-width:400px){
    footer{padding-left: 0px;}
}

@media (max-width:350px){
    .add{left: 29%;}
    footer{min-height: 500px;}
    footer .footer_nav{margin-top: 10px; }
    footer .footer_nav a{margin-right: 30px;}
    footer .media_icon{margin: 120px 0 0 10px;}
    .media_icon img{margin-right: -20px;}
    footer .design{margin-top: 80px;}
}
/* =============== RWD for other ================== */
@media (max-width:767px){
    nav .a1{width: 200px; right: 20%; top:5px;}
}

@media (max-width:700px){
    nav .a1{top:45px;}
}

@media (max-width:620px){
    .top-search{display: none;}
 li .top-search{display:block;}
}

@media (max-width:480px){
	nav .language{display: none;}
	ul .top-search{display: block;}
	ul .language{display: block;}
    .HOME_SERVICE{background: url(../images/service_bg_mobile.jpg) repeat right top;}   
}

@media (max-width:550px){
    ul .top-search{margin-top: -35px;}
}

@media (max-width:420px){
    ul .top-search{margin-top: -35px;}
}

@media (max-width:360px){
    ul .top-search{margin-right: -20px; margin-left: 50px;}
}

/* =============== Search 位置 ================== */
#pro_box{min-height: 400px;}
.top-search{width: 200px; /*position: absolute; right: -100px; top:10px;*/}

/* =============== Search for RWD ================== */
@media(max-width:1215px){
    .top-search{right: -100px; top:30px;}
}

@media(max-width:1350px){
    .top-search{right: -80px; top:30px;}
}

@media(max-width:1280px){
    .top-search{margin-top: 35px;}
}

@media(max-width:1200px){
    .top-search{right: -70px; top:30px;}
}

@media(max-width:1150px){
    .top-search{right: -50px; top:30px;}
}

@media(max-width:1000px){
    .top-search{right: -30px; top:30px;}
}

@media(max-width:770px){
    .top-search{right: 40px; top:25px;}
}

@media(max-width:660px){
    .top-search{right: 60px; top:25px;}
}

/* ============== google_translate_element 多國翻譯_開始 ================= */
.a3{/*position: absolute; right: 210px; top: 78px;*/}

/* =============== RWD for 多國翻譯位置 ================== */
@media (max-width:1700px){
    .a3{right: 150px;}
}

@media (max-width:1500px){
    .a3{right: 130px;}
}

@media (max-width:1350px){
    .a3{right: 125px; }
}

@media (max-width:1050px){
    .navbar-right {margin-top: 10px;}
}

@media (max-width:770px){
    .navbar-right {margin-top: 10px; margin-left: 40%;}
    .a3{right: 350px; top: 40px;}
}

@media (max-width:550px){
    .navbar-right {margin-left: 25%;}
}

@media (max-width:450px){
    .navbar-right {margin-top: 10px;}
    .a3{right: 170px; top: 40px;}
}

@media (max-width:330px){
    .navbar-right {margin-top: 10px;}
}

.goog-te-gadget-simple{
	background-color:transparent !important;
	opacity:0.8 ;
	border-left: 1px solid transparent  !important;
	border-top: 1px solid transparent  !important;
    border-bottom: 1px solid transparent  !important;
    border-right: 1px solid transparent  !important;
    padding-top:0px!important;
    padding-bottom: 0px!important;
	
}
.goog-te-gadget-simple .goog-te-menu-value{
	color:#683629 !important;
}
.goog-te-gadget-icon{
	display:none !important;
}
.goog-te-menu-value span {
    border-left: rgba(255,255,255,0)!important;
    color: #683629 !important;
    font-size: 15px;font-family: "微軟正黑體", Arial, Helvetica, sans-serif!important;
}

@media (max-width:1215px){
    #google_translate_element{
	margin-top:130px;
    margin-right: 5%;}
}

@media (max-width:1050px){
    #google_translate_element{
	margin-top:0px;
    margin-right: 0px;}
}

@media (max-width: 919px){
.goog-te-gadget-simple .goog-te-menu-value{
	color:#e7cd7c !important;
}	
#google_translate_element{
	margin-top:330px;
    margin-left: 25%;}
}

@media (max-width: 770px){
#google_translate_element{
	margin-top:0px;
    margin-left: 0px;}
}

@media (max-width: 380px){
.wrapper {
    display: flex;
    flex-wrap: wrap;
    margin-left: -20px;
}
}

@media (max-width: 330px){
#google_translate_element{
    margin-top: 0px;
    margin-left: 0%;}
}

#goog-gt-tt {
    color: #683629 !important;
    box-shadow: 0 0 0 transparent  !important;
    font-size: 15px !important;
    font-family: "微軟正黑體", Arial, Helvetica, sans-serif!important;
}
/* =============== google_translate_element 多國翻譯_結束 ================== */

/* =============== News ================== */
.Pro_content img { max-width: 80% !important;}

/* =============== 商品詳述頁 ================== */
#prod_intro{display:block !important;}

.title-none{font-weight: bolder; font-size: 20px; margin-bottom: -30px;}
.clearfix{font-size: 14px;}
.CodeNum{font-size: 14px; display: none;}
.PersonNum{font-size: 14px; display: none;}