@charset "utf-8";
@import url("reset.css");
@import url("loading.css");
@import url("fontawesome_all.css");
@import url("animate.css");
/*@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@400&display=swap');*/

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> Main <<<------------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

* { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; letter-spacing:1px; }
html { height:100% }
body { margin-left: 0px; margin-top: 0px; margin-right: 0px; margin-bottom: 0px; -webkit-text-size-adjust:none; font-size:12px; overflow-y:scroll; overflow-x:hidden; }
body, td, th,select,input {font-size:12px; font-family: /*Arial,*/'Noto Sans TC' , "文泉驛正黑", "WenQuanYi Zen Hei", "儷黑 Pro", "Microsoft JhengHei", "新細明體", "PMingLiU", sans-serif;color:#333333; box-sizing: border-box;}

/*簡易設定*/
.iframe_ch { display:none }
.middle { vertical-align:middle; }
.center { text-align:center; }
.w100{width: 100%;}

/*fix safari*/
input, select, textarea{ -ms-box-sizing:content-box; -moz-box-sizing:content-box; box-sizing:content-box; -webkit-box-sizing:content-box;}
input[type='text'],input[type='password'],input[type='button'],input[type='submit']{border:1px solid #dbd5d5;padding:5px 10px;-webkit-appearance: none;}
select{ border:1px solid #949494; padding:5px 10px; color:#333333; }

/*分頁*/
.pager{width:100%;overflow:hidden;margin: 50px auto 50px auto;text-align:center;}

/*編輯器*/
.editor{padding: 50px 0px 50px 10px !important;font-size: 20px;line-height: 35px;}

/*連結*/
a{color: #000000;text-decoration:none;}
a:hover{color: #8dbb00;}

/*提示文字內容*/
#tip_box { position: fixed; line-height:22px; background-image:url(../../images/bg.png); color: #FFF; padding-left:10px; padding-right:10px; padding-top:5px; padding-bottom:5px; -webkit-border-radius: 2px; -moz-border-radius: 2px; border-radius: 2px; margin-left:10px; }
/*提示圖片處理*/
.tip { cursor:pointer; cursor:hand; vertical-align:middle; }


/*表格*/
.css_table { display:table; width:100%; }
.css_table .css_tr {display: table-row;}
.css_table .css_th {display: table-cell;text-align: center;vertical-align:middle;padding: 5px 10px;box-sizing:border-box;letter-spacing:1px;font-size: 15px;border-bottom: 3px solid #dbd5d5;color:#121212;}
.css_table .css_td {display: table-cell;text-align:center;vertical-align:middle;padding: 0px 10px;box-sizing:border-box;letter-spacing:1px;font-size:14px;color:#121212;}
.css_table .css_th.text-left , .css_table .css_td.text-left{ text-align:left !important; }
.css_table .css_th.border-none , .css_table .css_td.border-none{ border:0 !important; }

.gotop_area{width:100%;max-width:1200px;margin:0 auto;overflow:hidden;text-align:right;}

/*按鈕1*/
.btn1{position:relative;display: inline-block;color:#FFF !important;font-size: 16px !important;width:auto !important;padding: 15px 60px;margin: 0 100px 0 0px;text-decoration:none;letter-spacing: 5px;border: 1px solid #8dbb00;cursor:pointer;font-weight: bold;background: #8dbb00;/* border-radius: 30px; */}
.btn1:after{content:'';position: absolute;bottom: -1px;right: -100px;width: 100px;height: 5px;background: #8dbb00;animation:1s ease-in-out 0.8s 1 widthGroup-1;}
.btn1:hover{
 background: #3f910d;
 border: 1px solid #3f910d;
 -webkit-transition: all .4s ease;
 -moz-transition: all .4s ease;
 -o-transition: all .4s ease;
 transition: all .4s ease;
 -ms-transition: all .4s ease;
}

/*按鈕2*/
.btn2{position:relative;display: inline-block;color:#FFF !important;font-size: 20px !important;width:auto !important;padding: 15px 60px;margin: 0 0px 0 0px;text-decoration:none;letter-spacing: 5px;border: 1px solid #8dbb00;cursor:pointer;font-weight: bold;background: #8dbb00;/* border-radius: 30px; */}
.btn2:hover{
 background: #3f910d;
 border: 1px solid #3f910d;

 -webkit-transition: all .4s ease;
 -moz-transition: all .4s ease;
 -o-transition: all .4s ease;
 transition: all .4s ease;
 -ms-transition: all .4s ease;
}
 
/*全營幕遮罩*/ 
.bg-overlay { display:block; position:fixed; left:0; top:0; background:rgba(0, 0, 0, 0.7); opacity:0; visibility:hidden; width:100%; height:100%; z-index:9999; transition: all 0.2s linear; }
.bg-overlay.visible { opacity:1; visibility:visible }

/*網頁大標題*/
.common-title{text-align: center;font-size: 26px;color: #be6c29;font-weight:bold;letter-spacing: 34px;line-height: 34px;padding: 80px 10px 40px 10px;margin: 0 0 0 0;}
.common-title span{position:relative;display: inline-block;line-height: 30px;text-transform: uppercase;font-size: 60px;padding-bottom: 40px;color: #4d4d4d;font-weight: bold;letter-spacing: 30px;/* font-family: 'Noto Sans TC', sans-serif; */}
.common-title span:before{position:absolute;top: -20px;left: -45px;content:url(../../images/common-title-line.png);}
.common-title span:after{position:absolute;top: -20px;right: -20px;content:url(../../images/common-title-line.png);}

/*網頁小標題*/
.common-title2{text-align: center;font-size: 30px;color: #000000;/* font-weight:bold; */letter-spacing: 3px;line-height: 30px;padding: 4vw 10px 15px 10px;margin: 0 0 40px 0;border-bottom: 1px solid #cacaca;}


/*內頁banner*/
#banner-box{width:100%;/*max-width: 1200px;*/margin: 0 auto;overflow:hidden;background:#f1f1f1;}
#banner-inner{position:relative;height: 350px;background: url(../../images/banner-inner.jpg) left no-repeat;background-size: cover;}
#banner-inner .overlay{display:flex;align-items:center;/* justify-content: center; */width:100%;max-width: 1200px;margin: 0 auto;padding: 0 5vw;height: 100%;/* background-color: rgba(0, 0, 0, 0.5);*/}
#banner-inner .title{opacity:0;text-align:center;color:#ffffff;font-size: 30px;font-weight: bold;letter-spacing: 5px;padding: 0 0 10px 0;text-shadow: 2px 2px 2px #101010;}
#banner-inner .common-title{color: #ffffff;text-shadow: 2px 2px 2px #999999;}
#banner-inner .common-title span{
    color: #ffffff;
    text-shadow: 2px 2px 2px #999999;
}
#banner-inner .common-title span:before{filter: brightness(0) invert(1);}
#banner-inner .common-title span:after{
    filter: brightness(0) invert(1);
}


/*麵包屑*/
#sitemap{width:100%;margin:0;padding: 0 10px 20px 10px;box-sizing: border-box;letter-spacing:1px;color: #737373;text-align: left;}
#sitemap .wrap{position: relative;width:100%;max-width:1200px;overflow:hidden;margin: 0 auto;padding: 20px 0px 20px 30px;color: #9d9d9d;font-size: 20px;font-weight: bold;border-bottom: 1px solid #ebebeb;}
#sitemap .wrap a{color: #9d9d9d;text-decoration:none;}
#sitemap .wrap:before{position: absolute;left: 1px;font-family: "Font Awesome 5 Free";font-weight: 900;content: "\f015";text-decoration:none;padding-right:5px;color: #afcf4c;}
#sitemap .wrap a{text-decoration: none;}

/*表格*/
#css_table { display:table; width:100%; }
.css_tr { display: table-row; }
.css_td {display: table-cell;text-align:left;vertical-align:middle;padding: 15px 5px;box-sizing:border-box;letter-spacing:1px;font-size: 14px;color: #4C3434; line-height: 25px;}
	

@media screen and (max-width : 1024px) {
	
	#banner-inner{ height:300px; }
	#banner-inner .overlay{ justify-content: center; }

	.common-title{text-align: center;font-size: 20px;color: #be6c29;font-weight:bold;letter-spacing: 10px;line-height: 30px;padding: 40px 10px 40px 10px;margin: 0 0 0 0;}
	.common-title span{position:relative;display: inline-block;line-height: 30px;text-transform: uppercase;font-size: 35px;padding-bottom: 20px;color: #4d4d4d;font-weight: bold;letter-spacing: 10px;/* font-family: 'Noto Sans TC', sans-serif; */}
	.common-title span:before{position:absolute;top: -15px;left: -45px;content:url(../../images/common-title-line.png);}
	.common-title span:after{position:absolute;top: -15px;right: -35px;content:url(../../images/common-title-line.png);}
	
	.gotop{/* position:fixed; *//* bottom:100px; *//* right:20px; *//* margin:0; *//* left:auto; */}
}

@media screen and (max-width : 600px) {


	#banner-inner .title{ font-size:20px; }
	#banner-inner .title span{ font-size:14px; }
	
	.bx-wrapper .bx-pager{ display:none;}
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Common <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#wrapper{width:100%;position: relative;/* overflow:hidden; *//*min-height:1500px;*/}

#header{width:100%;/* overflow:hidden; *//* background: url(../../images/header-bg2.jpg) repeat-x; */}
#header.on{ position:fixed; top:0; z-index:9998; }
#header .bg{width:100%;/* height:149px; */background: url(../../images/header-bg.jpg) no-repeat center;background-size: cover;}
#header .wrap{width:100%;max-width: 1200px;/* height:149px; */margin: 0px auto;/* overflow: hidden; */display:flex;align-items:center;justify-content: center;/* background: #ffffff; */border-bottom: 1px solid #ebebeb;}
#header .wrap .logo{flex:1;/* height: 149px; */display: flex;align-items:center;justify-content: center;}
#header .wrap .logo img{max-width: 443px;}
#header .wrap .navigation{position:relative;flex: 6;height: 90px;/* background:url(../../images/header-bg.jpg) no-repeat left; */}
#header .wrap .navigation .top{padding: 0px 0 14px 0;margin-top: -40px;}
#header .wrap .navigation .bottom{position:relative;margin-top: 0px;/* padding-top: 14px; */position: absolute;top: 10px;right: 0px;max-width: 800px;/* border-top: 1px solid #e2e2e2; */}

/*搜尋*/
#header nav{display: inline-block;text-align: right;padding:0;margin:0;list-style:none;}
#header nav input[type='text']{box-sizing:border-box;font-size: 15px;border: 1px solid #ababab; color:#ffffff; background: transparent;letter-spacing:1px;padding: 5px 10px 5px 10px;letter-spacing:1px;outline:0;}
#header nav input[type='text']:hover{ border:1px solid #ffffff; transition: all 0.5s ease; }
#header nav span{ position:relative; }
#header nav span div{color: #143874;font-size: 17px;position:absolute;top: -5px;right: 8px;cursor: pointer;}

#header nav ::placeholder { color: #ffffff; opacity: 1; }
#header nav :-ms-input-placeholder { color: #ffffff; }
#header nav ::-ms-input-placeholder { color: #ffffff; }

/*導覽*/
#header #linker{display: inline-block;margin:0 auto;text-align:right;padding: 5px 10px;}
#header #linker span{display: inline-block;padding: 0 10px;font-size: 14px;letter-spacing: 2px;color: #121212;border-right: 1px solid #e2e2e2;}
#header #linker span:last-child{ border:0; }
#header #linker span img{vertical-align: -60%;padding-right: 5px;}
#header #linker span a{color: #121212;text-decoration: none;}
#header #linker span a:hover{ text-decoration:underline; }
#header #linker span:last-child a:hover{ text-decoration:none; }
#header #linker span a i{ font-style:normal; }

/*選單*/
#header ul{margin:0;padding:0;list-style:none;}
#header ul > li:last-child{ border-right:0; padding-right:10px; }
#header ul > li:before{/* content:url(../../images/header-line.png); */position:absolute;right:0;}
#header ul > li i{padding: 0 5px 0 5px;color: #33abff;font-size: 12px;}
#header ul > li{position:relative;float:left;padding: 20px 2.9vw 23px 2vw;font-size: 20px;color: #121212;font-weight: bold;text-align: center;letter-spacing: 2px;cursor: pointer;/* border-right: 1px solid #fffefe; */}
#header ul > li:not(:last-child):after{position:absolute;top:20px;content:url(../../images/menu-line.png);margin: 0 0 0 20px;}
#header ul > li a{color: #121212;text-decoration:none;}
#header ul > li a:hover{ color:#192d80; }
#header ul > li span{
    display: block;
    text-transform: uppercase;
    font-size: 15px;
    padding: 0 0 10px 0;
    letter-spacing: 1px;
}
/*選單第二層*/
#header ul li nav{display:none;padding: 0px 0;z-index:99;position:absolute;left:0;top: 81px;/* min-height: 400px; *//* overflow:hidden; */background: #8dbc18;/* border: 1px solid #ebebeb; */box-shadow: 0 3px 5px rgb(0 0 0 / 25%);}
#header ul li nav.width-b{width: 700px;}
#header ul li nav.width-s{width: 210px;}
#header ul li .triangle-top{ display:none; }
/*選單第三層*/
#header ul li nav ul{display: inline;margin:0;padding: 10px 0;list-style:none;/* overflow: hidden; */}
#header ul li nav ul li{position:relative;float:left;width: 100%;text-align: left;color: #ffffff;padding: 15px 20px 15px 30px;line-height: 20px;font-size: 18px;cursor: pointer;}
#header ul li nav ul li:not(:last-child):after{ content:''; }
#header ul li nav ul li:before{position:absolute;left: 15px;top: 15px;font-size: 12px; content:url(../../images/dot.png); filter: brightness(0) invert(1); }
#header ul li nav ul li i{ position:absolute; right:10px; top:10px; }
#header ul li nav ul li a{display: block;width: 100%;color: #ffffff;padding: 15px 20px 15px 30px;font-weight: normal;font-size: 16px;}
#header ul li nav ul li:hover{ background:#3f910d; }
#header ul li nav ul li a:hover{ color:#ffffff !important; }
#header ul li nav ul li nav{display:none;z-index:99;position:absolute;top: 0px !important;/* min-height: 400px; *//* overflow:hidden; */background: #ffffff;border: 1px solid #ebebeb;box-shadow: 0 3px 5px rgb(0 0 0 / 25%);}
#header ul li nav ul li nav.position-r{left: 209px !important;}
#header ul li nav ul li nav.position-l{left: -211px !important;}
#header ul li nav ul li nav ul li{ position:relative; float:left;width: 100%;text-align: left;color:#333333; padding:0 !important; }
#header ul li nav ul li nav ul li i{ position:absolute; right:10px; top:10px; }

#header ul li nav ul li nav ul li a{display: inline-block;width: 100%;color:#333333 !important;padding: 6px 10px 6px 10px;}

#header ul li nav .items{/* float: left; */display:inline-block;width: 155px;text-align: left;vertical-align: top;margin: 10px 7px;}
#header ul li nav .items .caption{
    font-weight: bold;
    border-bottom: 1px solid #e1e1e1;
    padding: 5px 0 5px 0;
    margin: 0 0 10px 0;
    letter-spacing: 1px;
}
#header ul li nav .items .caption a{color: #000000 !important;}
#header ul li nav .items a{color: #5E5E5E;display: block;margin: 12px 0;font-size: 14px !important;}
#header ul li nav .items a:hover{ color:#9f1623; }

/*banner*/
ul.bxslider-home , ul.bxslider-advertise { margin:0; padding:0; }

/*手機版選單按鈕*/
#mobileMenu {
	 bottom:20px;
	 z-index: 999;
	 cursor: pointer;
	 display: none;
	 position:absolute;
	 top: 40%;
	 right: 10px;
	 width: 35px;
	 height: 30px;
	 font-size: 25px;
	 color: #002E7A;
	 background: #002E7A;
	 padding: 6px 8px;
	 border: 2px solid #002E7A;
	 cursor:pointer;
	 border-radius: 5px;
}
#mobileMenu span {
	 width: 15px;
	 height: 2px;
	 display: block;
	 background: #ffffff;
	 margin-top: 4px;
	 -webkit-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
	 -moz-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
	 -ms-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
	 -o-transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
	 transition: 0.7s cubic-bezier(0.18, 1, 0.21, 1);
}
.mobileMenu_spac {
	background: #fff !important
}
#mobileMenu span:first-child {
	margin-top: 0;
}
#mobileMenu .top {
	 position: absolute;
	 top: 10px;
	 -webkit-transform: rotate(225deg);
	 -moz-transform: rotate(225deg);
	 transform: rotate(225deg)
}
#mobileMenu .bottom {
	 position: absolute;
	 top: 10px;
	 margin-top: 0 !important;
	 -webkit-transform: rotate(-225deg);
	 -moz-transform: rotate(-225deg);
	 transform: rotate(-225deg)
}
#mobileMenu .middle {
	opacity: 0
}

/*輪播*/
#banner{width:100%;overflow:hidden;max-height:500px;margin: 0 0 40px 0;}
#banner .bx-wrapper{margin: 30px auto;}
#banner-advertise{width:100%;overflow:hidden;max-height:500px;margin: 0 0 40px 0;}
#banner-advertise .bx-wrapper{margin:0 auto 30px auto;}

/*主版架構*/
.container{position:relative;width:100%;/* max-width: 1200px; */min-height:500px;margin: 0px auto;overflow: hidden;}
.container .wrap{max-width:1200px;overflow:hidden;margin: 30px auto;}
.container-full{position:relative;width:100%;min-height:500px;overflow: hidden;padding-bottom: 100px;}
.container-full .wrap{ max-width:1200px; overflow:hidden; margin: 0px auto; }
.container-full.bg{background: url(../../images/container-bg.jpg) bottom center no-repeat;}

/*左右欄的頁面1*/
.container .wrap .layout-left{width: 25%;float:left;box-sizing: border-box;padding: 0 20px 0 0px;margin: 0 0 50px 0;}
.container .wrap .layout-right{width: 75%;float:left;box-sizing: border-box;padding: 0px 10px;}
.container .wrap .layout-all{ width:100%; }
.container .wrap .layout-right .end{margin-bottom: 50px;}

/*左右欄的頁面2*/
.layout-flex{display:flex;/* margin:40px auto !important; */}
.layout-flexleft{flex: 1;padding: 0 50px 0 10px;font-weight:bold;}
.layout-flexright{flex:3;margin-bottom: 70px;padding: 0 10px;}

/*左邊選單*/
.layout-left .caption{text-transform:uppercase;background: #afcf4c;color: #ffffff;font-size: 20px;padding: 15px 20px;text-align: center;font-weight: bold;letter-spacing: 3px;}
.layout-left > ul{list-style:none;margin:0;padding:0;/* border-top: 5px solid #8dbb00; *//* border-bottom: 5px solid #8dbb00; */}
.layout-left > ul > li{width: 100%;font-size: 20px;border-bottom: 1px solid #dbdbdb;}
.layout-left > ul > li em{ font-style:inherit; width:20px; display:inline-block; }
.layout-left > ul > li > a{position:relative;color: #0b0b0b;font-weight: bold;text-decoration:none;display: block;letter-spacing: 1px;line-height: 22px;padding: 20px 10px 20px 35px;}
.layout-left > ul > li > a:before{position:absolute;left: 15px;/* top: 3px; */font-size: 12px;content:url(../../images/dot.png);/* filter: brightness(0) invert(1); */}
.layout-left > ul > li > a:hover{ background:#F1F1F1; transition: all 0.5s ease; }
.layout-left > ul > li > a.on{ background:#F1F1F1; }
.layout-left > ul > li:hover{ /*background:#bbd2ed; transition: all 0.5s ease;*/ }
.layout-left > ul > li:last-child{ border-bottom:0; }
.layout-left > ul > li ul{ display:block; list-style:none; margin:0; padding:0; }
.layout-left > ul > li ul li{width:100%;padding: 18px 0px;font-size:16px;border-top: 1px dashed #cccccc;}
.layout-left > ul > li ul li:last-child{ border-bottom:0; }
.layout-left > ul > li ul li:hover{ background:#e1ebf2; transition: all 0.5s ease; }
.layout-left > ul > li ul li a{position: relative;color:#000000;text-decoration:none;display: block;padding: 0px 0px 0px 35px;line-height: 20px;}
.layout-left > ul > li ul li a:before{position: absolute;left: 10px;top: -6px;content:"‧";font-size:60px;color: #8dbb00;}
.layout-left > ul > li ul li.third{ padding-left:20px; }
.layout-left > ul li:hover ul{ /*display:block; height:inherit; transition: all 0.5s ease;*/ }

.layout-left > ul > li:nth-child(even) {background: #ffffff}
.layout-left > ul > li:nth-child(odd) {background: #f9f9f9}

@media screen and (max-width : 1200px) {
	.container .wrap .layout-left{ width:30%; }
	.container .wrap .layout-right{ width:70%; }
	
	.layout-flexleft{flex: 2;padding: 0 10px 0 10px;}
	.layout-flexright{flex:3;}		
}
	
@media screen and (max-width : 1024px) {
	#mobileMenu{ display:block; }
	#header #linker{ padding:5px 60px 5px 10px; }
	#header .wrap .navigation .top nav{ display:none; }
	#header .wrap .navigation .bottom{ display:none; }
	#header #linker span{ display:none; }		
}

@media screen and (max-width : 900px) {
	.container .wrap .layout-left{ display:none; }
	.container .wrap .layout-right{ width:100%; }
	.layout-flex{ display:block; }
}	


@media screen and (max-width : 480px) {
	#header .wrap .logo img{ max-width:280px; }
	#header .wrap .navigation{background:none;/* height:110px; */}
}


/*footer*/
#footer{width:100%;overflow:hidden;min-height:210px;background-color:#2d2d2d;padding: 30px 020px 0;background: url(../../images/footer-bg.jpg) repeat-x bottom;/* background-size:cover; */box-shadow: inset 0px 15px 10px -16px #ccc;}
#footer .wrap{max-width: 1200px;width:100%;margin:0 auto;color:#ffffff;display:flex;padding:0 10px;}
#footer .wrap .left{flex: 0.6;display: flex;align-items: flex-start;justify-content: center;}
#footer .wrap .left .logo{margin: 10px;vertical-align:middle;color: #FFFFFE;font-size: 28px;letter-spacing:4px;display:flex;align-items:center;justify-content: center;font-family: 'Noto Sans TC', sans-serif;cursor:pointer;/* font-weight: normal; */}
#footer .wrap .left .logo img{padding-right: 0px;}

#footer .wrap .right{flex: 2;text-align: right;}
#footer .wrap .contact-info{/* float:right; */color:#9fd3c7;font-size:14px;display:flex;width: 100%;/* max-width: 650px; */margin: 15px 0 3vh 0;}
#footer .wrap .contact-info .contact-left,
#footer .wrap .contact-info .contact-right{flex:1;padding: 0;text-align: left;}
#footer .wrap .contact-info .items{display:flex;align-items: flex-start;letter-spacing: 2px;font-size: 20px;}
#footer .wrap .contact-info .items:not(:last-child){padding-bottom: 15px;}
#footer .wrap .contact-info .items .items-title{flex: 1;max-width: 100px;color: #404040;font-size: 20px;display: flex;align-items:center;justify-content: center;padding-right: 10px;padding-top: 3px;}
#footer .wrap .contact-info .items .items-title i{padding-right:10px;}
#footer .wrap .contact-info .items .items-content{flex: 4;color: #7c7c7c;letter-spacing: 2px;word-break: break-all;line-height: 25px;}
#footer .wrap .contact-info .items .items-content:before{/* content: ""; */color:#7d7d7d;padding-right:15px;}

#copyright{position:relative;font-size: 15px;/* max-width:1400px; */width:100%;overflow: hidden;margin:0 auto;line-height:20px;background:#404040;color: #ababab;text-align: center;padding: 12px 10px 12px 10px;}
#copyright a{color: #ababab;text-decoration:none;}
#copyright a:hover{ text-decoration:underline; }


@media screen and (max-width: 1024px) {
	#footer .wrap{ display:block; }
	#footer .wrap .left{ margin-bottom:25px; }
	#footer .wrap .contact-info{margin: 10px 0 20px 0;float:none;}
	#footer .wrap .contact-info .items .items-title{justify-content:unset;min-width: 100px;}
	#copyright{text-align: center;}		
}

@media screen and (max-width: 768px) {
	#footer .wrap .contact-info{ display:block; }
	#footer .wrap .contact-info .items{padding-bottom:15px; }
	#footer .wrap .contact-info .items .items-content:before{ content:""; padding-right:0; }			
}

@media screen and (max-width: 480px) {
	#footer .wrap .left .logo{ font-size:20px; }
	#footer .wrap .contact-info .items{ display:block; font-size:14px; }
	#footer .wrap .contact-info .items .items-title{ padding-bottom:5px; font-size:16px; }	
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Index <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

/*產品介紹*/
#index-pdt{width:100%;min-height: 780px;overflow:hidden;background:url(../../images/product-bg.jpg) no-repeat top;}
#index-pdt .wrap{ max-width: 1200px;margin: 0 auto; }

/*owl*/
#index-pdt .pdt-carousel{display: flex;position: relative;margin-bottom: 20px;}
#index-pdt .owl-left{position: absolute;left: 20px;top: 40%;cursor:pointer;display:flex;align-items:center;justify-content: center;/* width: 12%; */float:left;}
#index-pdt .owl-center{width: 100%;float:left;padding: 0 0vw;margin: 0 auto;}
#index-pdt .owl-right{position: absolute;right: 20px;top: 40%;cursor:pointer;display:flex;align-items:center;justify-content: center;/* width: 12%; */text-align: right;float:left;}
#index-pdt .contain{ text-align:center; font-size:22px; }
#index-pdt .contain a{display:block;padding: 10px 0 10px 0;color: #2b2b2b;text-decoration: none;font-size: 18px;font-weight: bold;}
#index-pdt .contain span{
    color: #747474;
    font-size: 16px;
    font-weight: bold;
    word-break: break-all;
    padding: 0 25px;
    display: inline-block;
}
#index-pdt .contain a:hover{ text-decoration:underline; }
#index-pdt .item{margin: 0 auto;padding: 10px 1vw;margin: 10px 15px;max-width: 100%;max-height: 100%;height: 280px;overflow:hidden;display:flex;align-items:center;justify-content: center;-webkit-box-shadow: 0px 0px 10px #cccccc;background:#ffffff;}
#index-pdt .item img{max-width: 100%;max-height: 90%;cursor:pointer;}
#index-pdt .pager{ text-align: right; max-width: 1370px; }

@media screen and (max-width: 1400px) {
	#index-pdt .pager{text-align: center;margin: 10px auto 10px auto;}
	#index-pdt .pager .btn1{ margin:0 0 0 0; }	
	#index-pdt .pager .btn1:after{ position:inherit; }
}

/*最新消息*/
#index-news{width:100%;min-height: 600px;overflow:hidden;background:url(../../images/leaf.png) no-repeat bottom left;}
#index-news .wrap{ max-width: 1200px;margin: 0 auto; }

#index-news .news-list:nth-child(even) {background: #f5f5f5}
#index-news .news-list:nth-child(odd) {/* background: #FFF */background-color: rgba(255, 255, 255, 0.8);}

#index-news .news-frame{width: 75%;float:right;padding: 0 15px;/* background: #ffffff; *//* border-top:3px solid #e5e5e5; *//* border-bottom:3px solid #e5e5e5; */}
#index-news .news-list{display:flex;flex-wrap:wrap;width:100%;overflow:hidden;margin: 0px 0;text-align: left;padding: 13px 0px 13px 0;border-bottom: 1px solid #dadada;}
#index-news .news-list:last-child{ border:0; }
#index-news .news-list .types{flex: 1;color: #ffffff;background: #709500;padding: 10px 10px;min-width: 140px;text-align: center;margin: 0 0 0px 0;font-weight: normal;font-size: 15px;display: flex;align-items:center;justify-content: center;border-radius: 20px;}
#index-news .news-list .title{flex: 4;color: #28231c;font-weight: bold;font-size: 20px;line-height:22px;font-family: 'Noto Sans TC', sans-serif;display: flex;align-items:center;padding: 0 0 0 20px;}
#index-news .news-list .title a:hover{color: #008006;text-decoration:underline;}
#index-news .news-list .date{position: relative;flex: 1;min-width: 150px;padding: 0 10px;font-size: 14px;display: flex;align-items: center;justify-content: center;font-weight: bold;color: #656565;}
#index-news .news-list .date span{padding: 0 0 0 10px;color: #7a7a7a;font-size: 18px;}
#index-news .news-list .date span:before{position:absolute;left: 15px;top: 3px;font-size: 12px;content:url(../../images/dot.png);/* filter: brightness(0) invert(1); */}

#index-news .news-list .more{flex:1;padding:0 20px;min-width:150px;color: #143874;font-size: 14px;display: flex;align-items: flex-end;justify-content: center;}
#index-news .news-list .more a{ color:#143874; }
#index-news .pager{ text-align: right; max-width: 1370px; }

@media screen and (max-width: 1400px) {
	#index-news .pager .btn1{margin: 0 15px 0 0px;}
	#index-news .pager .btn1:after{ position:inherit; }
}

@media screen and (max-width : 1024px) {
	#index-news .news-frame{ width:100%; }
}

@media screen and (max-width : 900px) {
	#index-news .news-list{ padding:13px 0px 0px 0; }
	#index-news .news-list .date{ justify-content: start; min-width: auto; }
	#index-news .news-list .date span{ border:0; padding:0 0 0px 30px; }
	#index-news .news-list .title{flex:100%;padding: 10px 20px;}
}

/*關於我們*/
#index-about{bottom:0;width:100%;/* min-height:820px; */background:url(../../images/index-about-bg.png) no-repeat;min-height:745px;overflow: hidden;background-size:cover;background-position-x:center;}
#index-about .wrap{max-width: 1170px;margin: 0 auto;}
#index-about .wrap .frame{color: #ffffff;min-height:500px;font-size: 20px;line-height: 35px;font-weight: bold;padding: 50px 5vw 60px 5vw;background-color: rgba(0, 0, 0, 0.6);}
#index-about .common-title{ color:#ffffff; }
#index-about .common-title span{ color:#ffffff; }
#index-about .common-title span:before{filter: brightness(0) invert(1);}
#index-about .common-title span:after{filter: brightness(0) invert(1);}
#index-about .pager{ text-align: right; max-width: 1370px; }


@media screen and (max-width: 1400px) {
	#index-about .pager{ text-align: center; }
	#index-about .pager .btn1{ margin:0 0 0 0; }	
	#index-about .pager .btn1:after{ position:inherit; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 關於我們 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#inner-about.editor{ padding:0px 10px 50px 10px !important; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 最新消息 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#inner-news{width:100%;min-height: 600px;overflow:hidden; }
#inner-news .wrap{ max-width: 1200px;margin: 0 auto; }

#inner-news .news-list:nth-child(even) {background: #f5f5f5}
#inner-news .news-list:nth-child(odd) {/* background: #FFF */background-color: rgba(255, 255, 255, 0.8);}

#inner-news .news-frame{width: 100%;max-width: 1200px;margin: 0 auto;padding: 0 15px;/* background: #ffffff; *//* border-top:3px solid #e5e5e5; *//* border-bottom:3px solid #e5e5e5; */}
#inner-news .news-list{display:flex;flex-wrap:wrap;width:100%;overflow:hidden;margin: 0px 0;text-align: left;padding: 18px 0px 18px 0;border-bottom: 1px solid #dadada;}
#inner-news .news-list:last-child{ border:0; }
#inner-news .news-list .types{flex: 1;color: #ffffff;background: #709500;padding: 10px 10px;min-width: 140px;text-align: center;margin: 0 0 0px 0;font-weight: normal;font-size: 15px;display: flex;align-items:center;justify-content: center;border-radius: 20px;}
#inner-news .news-list .title{flex: 6;color: #28231c;font-weight: bold;font-size: 20px;line-height:22px;font-family: 'Noto Sans TC', sans-serif;display: flex;align-items:center;padding: 0 0 0 20px;}
#inner-news .news-list .title a:hover{color: #008006;text-decoration:underline;}
#inner-news .news-list .date{position: relative;flex: 1;min-width: 175px;width: 175px;padding: 5px 10px;font-size: 14px;display: flex;align-items: center;justify-content: center;font-weight: bold;color: #656565;}
#inner-news .news-list .date span{padding: 0 0 0 0px;color: #7a7a7a;font-size: 18px;font-weight: bold;}
#inner-news .news-list .date span:before{position:absolute;left: 15px;top: 7px;font-size: 12px;content:url(../../images/dot.png);/* filter: brightness(0) invert(1); */}


#inner-news .news-list .more{flex:1;padding:0 20px;min-width:150px;color: #143874;font-size: 14px;display: flex;align-items: flex-end;justify-content: center;}
#inner-news .news-list .more a{ color:#143874; }
#inner-news .pager{max-width: 1370px;}

/*內頁*/
#inner-news .news-detail{width: 100%;max-width: 1200px;margin: 30px auto;padding: 0 15px;/* background: #ffffff; *//* border-top:3px solid #e5e5e5; *//* border-bottom:3px solid #e5e5e5; */}
#inner-news .news-detail .caption{
    padding: 10px 20px;
    background: #f5f5f5;
    border-bottom: 1px solid #ebebeb;
    font-size: 24px;
    font-weight: bold;
}
#inner-news .news-detail .caption span{
	position:relative;
	display: block;
	padding: 20px 0px 0px 20px;
	font-size: 18px;
	color: #7a7a7a;
}
#inner-news .news-detail .caption span:before{position:absolute;left: 0px;top: 22px;font-size: 12px;content:url(../../images/dot.png);/* filter: brightness(0) invert(1); */}

/*附加檔案*/
#inner-news .news-detail .news-attach{width:100%;background:#f5f5f5;display:flex;padding: 20px 20px;}
#inner-news .news-detail .news-attach .left{min-width: 100px;font-size: 20px;color: #4f4f4f;display: flex;align-items:center;/* justify-content: center; */}
#inner-news .news-detail .news-attach .left span:before{/* position:absolute; */vertical-align: 25%;font-size: 12px;padding: 0 10px 0 0;content:url(../../images/dot.png);/* filter: brightness(0) invert(1); */}
#inner-news .news-detail .news-attach .right{}
#inner-news .news-detail .news-attach .right a{
    display: inline-block;
    background: #8dbb00;
    color: #ffffff;
    font-size: 20px;
    padding: 15px 15px;
    margin: 5px;
}
#inner-news .news-detail .news-attach .right a:hover{ background:#008006; }

@media screen and (max-width: 1024px) {
	#inner-news .news-list{ display:block; }
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 產品介紹 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#inner-pdt{
    display: flex;
    flex-wrap: wrap;
}
#inner-pdt .contain{width: 33%;text-align:center;font-size:22px;margin: 8px 0 5vw 0;}
#inner-pdt .contain a{display:block;padding: 20px 0 10px 0;color: #2b2b2b;text-decoration: none;font-size: 18px;font-weight: bold;}
#inner-pdt .contain span{
    color: #747474;
    font-size: 16px;
    font-weight: bold;
    word-break: break-all;
    padding: 0 20px;
    display: inline-block;
}
#inner-pdt .contain a:hover{ text-decoration:underline; }
#inner-pdt .item{margin: 0 auto;padding: 10px 0.5vw;margin: 0px 15px;/* width: 90%; */height: 280px;overflow:hidden;display:flex;align-items:center;justify-content: center;-webkit-box-shadow: 0px 0px 10px #cccccc;background:#ffffff;}
#inner-pdt .item img{max-width: 100%;max-height: 100%;cursor:pointer;}

@media screen and (max-width: 780px) {
	#inner-pdt .contain{width: 50%; }
}

@media screen and (max-width: 480px) {
	#inner-pdt .contain{width: 100%;margin: 0 0 50px 0;}
	#inner-pdt .item{margin: 0px 5px;}
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 產品詳細頁 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#product-detail{/*display:flex;*/width:100%;FONT-VARIANT: JIS04;/* margin: 0 0 50px 0; *//* padding-bottom: 50px; */}
#product-detail .left{float:left;width: 45%;padding: 0 0 30px 0px;text-align:center;}
#product-detail .left .editor{padding:0px 0px 0px 10px !important;max-height: 300px;height: 300px;line-height: 350px;/* overflow: hidden; *//* display: flex; *//* align-items:center; */justify-content: center;}
#product-detail .left img{
    max-width: 100%;
    max-height: 100%;
}
#product-detail .right{float:left;width: 55%;padding: 0 10px;}
#product-detail .right > .title{
    font-size: 24px;
    line-height: 30px;
    font-weight: bold;
    color: #2b2b2b;
    letter-spacing: 1px;
    margin-bottom: 20px;
}
#product-detail .right .title_en{

font-size: 20px;

color: #9a9a9a;

margin-bottom: 20px;

line-height: 29px;
}
#product-detail .right .intro{
    /* border-top: 1px solid #ebebeb; */
    /* border-bottom: 1px solid #ebebeb; */
    padding: 20px;
    font-size: 20px;
    line-height: 30px;
    min-height: 200px;
    background: #f9f9f9;
    word-break: break-all;
}
#product-detail .right .intro .title{
    color: #8dbb00;
    font-weight: bold;
    font-size: 20px;
    padding: 0px 0 10px 0;
    margin: 0 0 20px 0;
    border-bottom: 1px solid #e1e1e1;
}


/*owl*/
#product-detail .owl-left{cursor:hand;cursor:pointer;display:flex;align-items:center;justify-content: center;width: 5%;float:left;}
#product-detail .owl-center{width: 90%;float:left;}
#product-detail .owl-right{cursor:hand;cursor:pointer;display:flex;align-items:center;justify-content: center;width: 7%;text-align: right;float:left;}

#owl-photography .item{margin: 12px;/* padding: 10px; */height: 75px;overflow:hidden;display:flex;align-items:center;justify-content: center;width: 90%;background:#ffffff;-webkit-box-shadow: 0px 0px 5px #cccccc;}

/*詳細*/
#product-detail .caption{
    color: #8dbb00;
    font-weight: bold;
    font-size: 20px;
    padding: 0px 0 10px 0;
    margin: 0 0 10px 0;
    border-bottom: 1px solid #e1e1e1;
}
#product-detail .editor{ padding:30px 0px 30px 10px !important; }
#product-detail .pager{text-align: right;padding: 0 0 40px 0;margin: 30px auto 30px auto !important;border-bottom:1px solid #e1e1e1;}

@media screen and (max-width: 1024px) {
	#product-detail .left{ float:none; width:100%; }
	#product-detail .right{ width:100%; padding:0; }
	
	#product-detail .editor{ padding:20px 0 !important; }
	#product-detail .right .intro{ padding: 20px 0; }	
}
@media screen and (max-width: 600px) {
	.video-items{flex: 0 100%;}
	#product-detail .right > .title{ font-size:24px; line-height:30px; }
}
@media screen and (max-width: 480px) {

	#product-detail .product_button{ display:block; justify-content:initial; }
	#product-detail .product_button .webbtn1{ width:100%; }
	#product-detail .left .editor{ max-height:none; line-height:inherit; height:auto; }
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 聯絡我們 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.contact_info{width:100%;overflow:hidden;background: #f5f5f5;padding: 30px 20px;}
.contact_info .title{font-weight:bold;font-size: 28px;padding: 0 0 10px 0;}
.contact_info .title span{
    display: block;
    color: #8e8e8e;
    font-size: 20px;
    padding: 10px 0;
    text-transform: uppercase;
}
.contact_info .contact_info_area{float:left;/* max-width:400px; */width: 100%;font-size:15px;box-sizing: border-box;letter-spacing:1px;color:#4f4f4f;line-height:30px;}

.contact_info_btitle{ width:100%; border-bottom:1px solid #6d6b64; }
.contact_info_area{/* display: flex; */width:100%;overflow:hidden;line-height:25px;padding: 7px 0;/* border-bottom:1px dashed #a7a7a4; */}
.contact_info_title{width: 100%;min-width: 120px;color: #82ac01;background: #ebebeb;text-align: left;margin: 0 0 5px 0;padding: 3px 10px;text-transform: uppercase;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.contact_info_title i{
    padding-right: 10px;
    color: #82ac01;
}
.contact_info_content{width: 100%;word-break: break-all;color: #0c0c0c;}
.contact_info_content img{vertical-align: -35%;}

@media screen and (max-width : 1200px) {
	.contact-info .left{ flex:1; width:auto; }
	.contact-info .right{ flex:1; width:auto; }	
}
@media screen and (max-width : 1024px) {
	.contact-info .wrap{ display:block; }
	#index-contact .contact-form{padding-top: 0px;}
}
@media screen and (max-width : 768px) {
	#index-contact .contact-form{ display:block; }
	.contact_info .contact_info_area{ float:none; width:100%; }
	
}
@media screen and (max-width : 480px) {
	.contact-info .left .css-td:nth-child(2){ display:none; }
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 聯絡我們表單 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

#inner-signup{
    width: 100%;
    max-width: 630px;
    margin: 0 auto;
}
#inner-signup i{font-style:normal;color: #ffffff;font-weight:bold;padding: 0 0 0 10px;}
.signup-caption{display:flex;/* text-align: center; */font-size: 20px;color: #525252;font-weight:bold;line-height: 23px;/* font-family: 'Noto Sans TC', sans-serif; *//* border-top: 1px solid #d3d3d3; */margin: 0 0 50px 0;padding: 50px 10px 0 10px;}
.signup-caption div{flex:1;display: flex;align-items:center;/* justify-content: center; */}
.signup-caption img{/* display:block; */vertical-align: -90%;margin:0 auto;padding:10px 0;}
#inner-signup .flex-table{display:flex;max-width: 1200px;width:100%;margin:0 auto;padding: 0 0px;border-right: 1px solid #8b8b8b;border-left: 1px solid #8b8b8b;}

.flex-table {}

.flex-table {}
#inner-signup .flex-table .flex-th{flex: 1;text-align:left;display:flex;align-items:center;font-size: 20px;font-weight: bold;padding: 0 10px;background: #afcf4c;border-top: 1px solid #8b8b8b;/* border-right: 1px solid #8b8b8b; */}
#inner-signup .flex-table .flex-td{flex: 2.5;/* padding: 5px 10px; */font-size: 20px;text-align:left;border-top: 1px solid #8b8b8b;/* display: flex; *//* align-items:center; */}
#inner-signup .flex-table .flex-td span.tips{ display:inline-block; color:#00629f; padding:10px 0; }
#inner-signup .flex-table .middle{ display:flex; align-items:center; }
#inner-signup .flex-table input[type='text'],
#inner-signup .flex-table input[type='file']
{width:100%;border:0;color:#333333;font-size: 20px;padding: 10px 20px;margin: 5px 0;box-sizing: border-box;outline: 0;}
#inner-signup .flex-table textarea
{width:100%;/* background: #fbf6eb; */border:0;color:#333333;font-size: 20px;padding:15px 20px;margin: 5px 0;min-height:200px;outline: 0;box-sizing: border-box;resize: none;}
#inner-signup .flex-table select{width:100%;background: #fbf6eb;border:0;color:#333333;font-size:15px;padding:15px 20px;margin: 5px 0;box-sizing: border-box;}
#inner-signup .flex-area{display:flex;}
#inner-signup .flex-area .flex-column{flex: 1;padding: 0 5px; font-size:15px; }

#inner-signup .flex-area .flex-column2{flex: 2;padding: 0 5px;}
#inner-signup .flex-area .flex-column5{flex: 5;padding: 0 5px;}
#inner-signup .flex-table .zipcode{ font-size:15px; color:#787878; }
#inner-signup .flex-table .zipcode span{ font-size:13px; color:#00629f; padding:0 10px; }
#inner-signup span.btn{display: inline-block;border: 1px solid #cf6b00;color: #cf6b00;cursor:pointer;margin: 5px 3px;text-decoration: none;padding: 10px 20px;-webkit-border-radius: 20px;-moz-border-radius: 20px;border-radius: 20px;}

#inner-signup .pager{text-align: right;padding: 0 0 40px 0;margin: 30px auto 30px auto !important;}


@media screen and (max-width : 768px) {
  	#inner-signup .flex-area{ display:block; }
  	#inner-signup .flex-area .flex-column{ padding:5px; }
	#inner-signup i{ display:none; }
}

@media screen and (max-width : 480px) {
	#inner-signup .flex-table .flex-th{/* border:0; *//* padding:15px 0; */font-weight:bold;}
	#inner-signup .flex-table{/* display:block; */}
	
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Mobile Menu <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


body { transition: background-color .2s; }
#wrapper { transition: margin-left .2s; }
.sidenav {display:flex;flex-direction: column;height: 100%;overflow:hidden;width: 0;position: fixed;z-index: 99999;top: 0;right: 0;background-color: rgba(255, 255, 255, 1);overflow-x: hidden;transition: 0.2s;/*padding-top: 60px;*/box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);}
.sidenav .closebtn {font-size: 25px;position: absolute;top: 15px;right: 10px;color: #002E7A;}

.sidenav .head {width:100%;position: relative;overflow:hidden;/* text-align: center; */padding: 10px 15px 10px 15px;border-top: 3px solid #002E7A;border-bottom: 1px solid #ebebeb;background: #ffffff;}
.sidenav .head img{max-width: 200px;}

.sidenav .menu-top{background: #ffffff;}
.sidenav .menu-bottom{width: 100%;height: 100%;background: #ffffff;padding: 20px 0 10px 0;display: flex;align-items: flex-end;justify-content: center;}
.sidenav .menu-bottom .search{padding:10px 20px;}
.sidenav .menu-bottom .search .items{
    margin: 20px 0;
    display:flex;
}
.sidenav .menu-bottom .search .items .lefter{
	flex: 1;
	width: 80px;
	font-size: 16px;
	color: #3c3c3c;
	display: flex;
	align-items:center;
	justify-content: center;
}
.sidenav .menu-bottom .search .items .lefter i{color: #0557A1;padding-right:8px;}
.sidenav .menu-bottom .search .items .righter{flex: 1;padding: 0 0 0 10px;}
.sidenav .menu-bottom .search .items .righter .search-items{ display:flex;}
.sidenav .menu-bottom .search .items .righter .search-items .input{flex: 1;}
.sidenav .menu-bottom .search .items .righter .search-items .input input[type="text"]{border:0;outline: 0;max-width: 100px;padding: 15px;-webkit-border-top-left-radius: 20px;-webkit-border-bottom-left-radius: 20px;-moz-border-radius-topleft: 20px;-moz-border-radius-bottomleft: 20px;border-top-left-radius: 20px;border-bottom-left-radius: 20px;}
.sidenav .menu-bottom .search .items .righter .search-items .button{flex:1;background: #0557A1;color: #ffffff;padding: 15px 20px;-webkit-border-top-right-radius: 20px;-webkit-border-bottom-right-radius: 20px;-moz-border-radius-topright: 20px;-moz-border-radius-bottomright: 20px;border-top-right-radius: 20px;border-bottom-right-radius: 20px;}

.sidenav .menu-bottom .community{padding: 10px 5px;text-align: center;}
.sidenav .menu-bottom .copyright a{color: #939797;text-decoration:none;}
.sidenav .menu-bottom .copyright a:hover{ text-decoration:underline; }

@media screen and (max-height: 450px) {
 .sidenav {padding-top: 15px;}
 .sidenav a {font-size: 18px;}
}

/*選單 - 選項*/
#ajax-sidenav > div {position:relative;width: 100%;border-left: 5px solid #002E7A;border-bottom: 1px solid #ebebeb;color: #333333;padding: 15px 25px;line-height:20px;box-sizing:border-box;cursor: pointer;cursor: hand;font-size: 14px;letter-spacing: 3px;}
#ajax-sidenav > div:before {/*content:url(../../images/header-icon.png);vertical-align:0; padding-right:10px;color: #000000;*/}
#ajax-sidenav > div i {position:absolute;right: 15px;top: 17px;color: #002E7A;cursor: pointer;}
#ajax-sidenav > div.title { background: #b19bb5; color: #ffffff; }
#ajax-sidenav > div:hover { /*color:#57708e;*/ }
#ajax-sidenav > div span { position:absolute; right:0; top: 0; display:block; padding: 15px 20px; border-left: 1px solid #ebebeb;/* border-right: 1px solid #ebebeb; */ }


#ajax-sidenav > div.nav {background: #ffffff;border-bottom: 1px solid #ebebeb;color: #ffffff;font-weight: bold;}
#ajax-sidenav > div.nav:before { content:""; padding-right:0px; }
#ajax-sidenav > div img { vertical-align:middle; padding-right:8px; }
.submenu-nav { width: 100%; overflow:hidden; display:none; background-color: #FFFFFF; }
.submenu-nav div {position:relative;font-size: 14px;background: #ffffff;line-height: 20px;border-bottom: 1px solid #ebebeb!important;padding: 18px 30px 18px 55px !important;/* cursor:pointer; */}
.submenu-nav div:before{position: absolute;left: 30px;top: 20px;font-family: "Font Awesome 5 Free";font-weight: 900;content: "\f111";color: #e2e2e2;padding-right: 8px;}
.submenu-nav div a{font-size: 14px;color: #333333 !important;}
.submenu-nav div i{position:absolute;top:20px;right: 16px;color: #ffffff; cursor:pointer;}
.submenu-nav.layer3 div{padding: 18px 10px 18px 80px !important;}
.submenu-nav.layer3 div:before{position: absolute;left: 55px;top: 20px;font-family: "Font Awesome 5 Free";font-weight: 100;content: "\f111";color: #e2e2e2;padding-right: 8px;}

.jq-submenu a {color: #333333;} 

.submenu2{background:#ebebeb !important;border-left: 5px solid #9B7354;}
.submenu3{background:#f5f5f5 !important;border-left: 5px solid #9B7354;}

.copyright{text-align: center;color: #939797;line-height: 18px;padding-bottom: 20px;}
.copyright a{color: #ffffff;}
.copyright a:hover{text-decoration: underline;}

@media screen and (max-height: 450px) {
 .sidenav { padding-top: 15px;}

 .sidenav a { font-size: 18px;}
}

/*搜尋*/
.jq-submenu.srh{position:relative;padding:0 !important;}
.jq-submenu.srh .srh-btn{position:absolute;right: 30px;top: 20px;}
.jq-submenu.srh input[type="text"]{
	/* max-width:218px; */
	background: #999999;
	-webkit-appearance: none;
	border-radius: 0;
	width: 100%;
	height: 50px;
	border:0;
	font-size: 14px;
	padding: 0 50px 0 25px;
	box-sizing: border-box;
	letter-spacing:1px;
	color: #ffffff;
	outline:0;
}


.jq-submenu.nav{ border-left:0 !important; }
.jq-submenu.nav i{ position:initial !important; padding-right:8px; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 顯示 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


@media screen and (max-width: 768px) {


	.none-b{ display:none !important; }
}
@media screen and (max-width: 600px) {
	.none-m{ display:none !important; }
}

@media screen and (max-width: 480px) {
	.none-s{ display:none !important; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Triangle <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

.triangle-top{
  width: 0;
  height: 0;
  border-left: 8px solid transparent;
  border-right: 8px solid transparent;
  position: absolute;
  top: 30px;
  border-bottom: 10px solid #ffffff;
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Common Animation <<<----------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/

@keyframes widthGroup-1 {
    0% { width: 0; }	
    100%   { width: 100px; }
}

.scaleZoom {
	-webkit-animation: scaleZoom 2s ease both;
	animation: scaleZoom 2s ease both;
}
@-webkit-keyframes scaleZoom {
	from { opacity: 0; -webkit-transform: scale(1.2); }
}
@keyframes scaleZoom {
	from { opacity: 0; -webkit-transform: scale(1.2); transform: scale(1.2); }
}


/*區塊位移效果*/
.transImg{
	transition: 0.3s;
}

.transImg:hover{
	transform: translateY(-5px);
}
	
/*image zoom*/
.photo-zoom {


  position: relative;
  overflow: hidden;
  width: 100%;
}
.photo-zoom img {
  display: block;
  max-width: 100%;
  -moz-transition: all 0.3s;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
.photo-zoom:hover img {

  -moz-transform: scale(1.1);
  -webkit-transform: scale(1.1);
  transform: scale(1.1);
}
	
	
	
/*------image mask--------*/
.photo-mask{opacity:0;position:absolute;left:0;bottom:0;color:#ffffff;width:100%;height:100%;background-color: rgba(155, 155, 155, 0.9);letter-spacing:3px;text-align:center;padding: 4vw;box-sizing:border-box;line-height:22px;-webkit-transition:.2s;-ms-transition:.2s;-moz-transition:.2s;}
.photo-mask-content{ width:100%; height:100%; display:flex; align-items:center; justify-content: center; }
.photo-mask-content span{color:#8dbb00 !important;font-weight:normal !important;font-size: 18px !important;}
.photo-mask .line{border:1px solid #FFFFFF;}
.gallery{ position:relative; }
.gallery .photo-mask{ opacity:0; cursor:pointer; }
.gallery:hover .photo-mask{ opacity:1; }
.gallery:hover .title{ opacity:0; }	
	

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> checkbox/radio template <<<------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/



/* The container */
.container-item {
    position: relative;
    color: #474747;
    letter-spacing: 2px;
    padding-left: 35px;
    padding-right: 20px;
    margin-bottom: 10px;
    margin-top: 10px;
    cursor: pointer;
    font-size: 16px;
    font-weight:normal;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default checkbox */
.container-item input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom checkbox */
.checkmark {
    position: absolute;
    top: 0px;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #fff;
    border:1px solid #b9b7b7;
}

/* On mouse-over, add a grey background color */
.container-item:hover input ~ .checkmark {
    background-color: #ccc;
}

/* When the checkbox is checked, add a blue background */


.container-item input:checked ~ .checkmark {
    background-color: #fff;
}

/* Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the checkmark when checked */
.container-item input:checked ~ .checkmark:after {
    display: block;
}


/* Style the checkmark/indicator */
.container-item .checkmark:after {
    left: 6px;
    top: 1px;
    width: 4px;

    height: 10px;
    border: solid #0067B7;

    border-width: 0 3px 3px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Loadaction <<<----------------------------------------------------------------*/


/* ----------------------------------------------------------------------------------------------------------------*/

.Loadaction_Box { position:relative; height: 100%; width: 0%; position: fixed; overflow:auto; top: 0; left: 0; overflow:auto; background-color:rgba(0, 0, 0, 0.5); z-index:100000000 }
.Loadaction {width: 220px;height: 60px;top: 42%;position: absolute;margin-left: auto;margin-right: auto;padding-top: 10px;left: 0;right: 0;background-color:rgba(0, 0, 0, 0.5);-webkit-border-radius: 2px;-moz-border-radius: 2px;border-radius: 2px;}
.Actionupload_Text {font-size:13px;color:#FFFFFF;height: 25px;}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ---------------------------------->>> pagelink <<<--------------------------------------------------------------*/

/* ----------------------------------------------------------------------------------------------------------------*/

.pageselect{border:1px solid #CCCCCC;padding: 4px 5px;font-size:12px;}
.pageselect:hover{ background:#ebebeb; }
a.pagelink_no{color:#333333;text-decoration:none;border: 1px solid #cccccc;padding: 7px 5px;display: inline-block;margin: 5px 0;}
a.pagelink_no:hover{ background:#ebebeb; }
a.pagelink{color:#333333;text-decoration:none;border: 1px solid #CCCCCC;padding: 5px 10px;}
a.pagelink:hover{ background:#ebebeb; }
a.pagelink_ch{color:#333333;padding: 5px 10px;border: 1px solid #cccccc;background: #ebebeb;text-decoration:none;}

.installment{ background: #EEE; padding: 5px 15px 15px 15px; border-radius: 5px; margin-top: 10px;}
.installment .title{ font-size: 16px; padding: 10px 0 10px 0; color: #666;}
.installment .content{ border-left: 2px solid #aaa; color: #aaa; padding: 3px 0 3px 5px;}
.installment .separate{ margin: 15px 0 5px 0; border-top: 2px solid #aaa; padding: 10px 0 0 0; letter-spacing: 2px; }
.installment .separate a{ color: #a40000; }
.installment .separate a:hover{ text-decoration: underline; }

#bank_info{ border: 10px solid #999; padding: 10px; font-size: 16px; position: absolute; z-index: 1000; background: #ffffff; line-height: 25px; margin: 0 2% 0 0; }

/*表格樣式*/
#table-1 {
  font-family: Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}


#table-1 td, #table-1 th {
  border: 1px solid #ddd;
  padding: 5px;
}

#table-1 tr:nth-child(even){background-color: #f2f1f1;}

#table-1 tr:hover {background-color: #ddd;}

#table-1 th {
  padding-top: 5px;
  padding-bottom: 5px;
  background-color: #F4F4D9;
  color: white;
}