@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:0 10px 50px 10px !important;font-size: 16px;line-height: 30px;}

/*連結*/
a{color: #000000;text-decoration:none;}
a:hover{ color:#a21827; }

/*提示文字內容*/
#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{position:absolute;bottom: 235px;left:0;right:0;margin-left:auto;margin-right:auto;width: 62px;}

/*按鈕1*/
.btn-1{position:relative;display:inline-block;color: #ffffff;padding: 20px 150px 20px 40px;margin: 0 5px;font-size: 15px;cursor:pointer;background: #192d80;}
.btn-1 i{position:absolute;top: 15px;right: 8px;padding-right:6px;font-style: inherit;border-left: 1px solid #5e6ca6;padding: 5px 15px;}
.btn-1:hover{transition: all 0.5s linear;background: #0a1855;}

/*全營幕遮罩*/ 
.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: 28px;color: #000000; font-weight:bold; letter-spacing: 5px;line-height: 30px;padding: 4vw 10px 3vw 10px;margin: 0 0 0 0;}
.common-title span{display: block;line-height: 30px;text-transform: uppercase;font-size: 30px;padding-bottom: 15px;color: #dcbc8a;font-weight: bold;letter-spacing: 3px;font-family: 'Noto Sans TC', sans-serif;}
.common-title > .line{background: #3cd2ff;width: 50px;height: 1px;margin: 20px auto 20px auto;animation:1s ease-in-out 0.8s 1 widthGroup-1;}

/*網頁小標題*/
.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;}


/*Layout Column Flex*/
.layout-flex {
	display: flex;
	flex-direction: column;
	flex-wrap: wrap;
	margin: 30px 0 30px 0;
}
.layout-flex .flex-item {
	order:3;
}
.layout-flex .flex-item-1{ order:1; }
.layout-flex .flex-item-1,
.layout-flex .flex-item-2{width: 25%;padding: 0 0 0 5px;}
.layout-flex .flex-item-3{width: 75%;}
.layout-flex .flex-item-3 .flex-layout{ display:flex; }
.layout-flex .flex-item-3 .flex-layout .flex-left{ flex:3; }
.layout-flex .flex-item-3 .flex-layout .flex-right{ flex:1; }
.layout-flex .flex-item-4{ width:100%;}

.layout-flex2 { display: flex; flex-wrap: wrap; margin: 30px 0 30px 0; }
.layout-flex2 .flex-item-1,
.layout-flex2 .flex-item-2{width:28%;padding: 0 0 0 5px;}
.layout-flex2 .flex-item-3{ width:72%;}

/*內頁banner*/
#banner-box{width:100%;/*max-width: 1200px;*/margin: 0 auto;overflow:hidden;background:#110102;}
#banner-inner{position:relative;height: 300px;background:url(../../images/banner-inner.jpg) center no-repeat;background-size: cover;}
#banner-inner .overlay{display:flex;align-items:center;justify-content: center;width:100%;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; }
#banner-inner .common-title span{}
#banner-inner .common-title > .line{background: #ffffff;}

/*麵包屑*/
#sitemap{width:100%;margin:0;padding:0 10px;box-sizing: border-box;letter-spacing:1px;color: #737373;text-align: left;}
#sitemap .wrap{width:100%;max-width:1200px;overflow:hidden;margin: 0 auto;padding: 20px 0px;color: #9d9d9d;font-size: 13px;}
#sitemap .wrap a{color: #9d9d9d;text-decoration:none;}
#sitemap .wrap:before{font-family: "Font Awesome 5 Free"; font-weight: 900;  content: "\f015"; text-decoration:none; padding-right:5px; }
#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) {
	.layout-flex { flex-direction: row; }
	.layout-flex .flex-item {flex:100%;padding: 0 5px;}
	.layout-flex .flex-item-3{ order:2 !important; }
	.layout-flex .flex-item-3 .flex-layout{ display:block; }
	
	.layout-flex2 .flex-item {flex:100%;padding: 0 5px;}
	
	.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; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 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-bg1.jpg) no-repeat left; */}
#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:353px; }
#header .wrap .navigation{position:relative;flex: 6;height: 140px;/* background:url(../../images/header-bg.jpg) no-repeat left; */display:flex;align-items:center;justify-content:flex-end;text-align: right;}
#header .wrap .navigation .top{padding: 0px 0 14px 0;margin-top: -40px;}
#header .wrap .navigation .bottom{position:relative;margin-top: 0px;padding-top: 15px;position: absolute;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: 15px 1.8vw 30px 1.8vw;font-size: 16px;color: #121212;font-weight: bold;/* border-right: 1px solid #fffefe; */}
#header ul > li a{color: #121212;text-decoration:none;}
#header ul > li a:hover{ color:#192d80; }
#header ul > li span{ letter-spacing: 0px; }
/*選單第二層*/
#header ul li nav{min-width:200px;display:none;padding: 0px 0;z-index:99;position:absolute;left:-15px;top: 56px;/* min-height: 400px; *//* overflow:hidden; */background: #192d80;/* 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: 200px;}
#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: 12px;cursor: pointer;}
#header ul li nav ul li:before{position:absolute;left: 15px;top: 15px;font-family: "Font Awesome 5 Free";content: "\f054";font-size: 12px;}
#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:#0fb0e8; }
#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-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;}

@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 : 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: #014f86;background-size: cover;}
#footer .wrap{max-width: 1200px;width:100%;margin:0 auto;color:#ffffff;display:flex;padding:0 10px;}
#footer .wrap .left{flex:1;/* display:flex; */align-items:center;/* 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:30px; }

#footer .wrap .right{flex: 1;text-align: right;}
#footer .wrap .contact-info{float:right;color:#9fd3c7;font-size:14px;display:flex;width: 100%;max-width: 650px;margin: 8vh 0 2vh 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;}
#footer .wrap .contact-info .items:not(:last-child){padding-bottom: 10px;}
#footer .wrap .contact-info .items .items-title{flex: 1;max-width: 100px;color: #cfcfcf;font-size: 14px;display: flex;/* justify-content: flex-end; */padding-right: 10px;}
#footer .wrap .contact-info .items .items-title i{ padding-right:10px; }
#footer .wrap .contact-info .items .items-content{flex: 4;color: #cfcfcf;letter-spacing: 2px;word-break: break-all;line-height: 20px; margin-left: 20px;}
#footer .wrap .contact-info .items .items-content:before{color:#7d7d7d;padding-right:15px;}

#copyright{width:100%;overflow:hidden;line-height:18px;color: #407499;padding: 0 0 10px 0;text-align: left;}
#copyright a{color: #407499;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;float:none;}
	#footer .wrap .contact-info .items .items-title{justify-content:unset;min-width: 100px;}
	#copyright{ text-align:left; }		
}

@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{ padding-right:0; }			
}

@media screen and (max-width: 480px) {
	#footer .wrap .left .logo{ font-size:20px; }	
}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> Index <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

/*創新與技術*/
.advertise {}
.advertise .wrap{display: flex;max-width: 1200px;overflow:hidden;margin: 0 auto 30px auto;}
.advertise .lefter{position: relative;flex: 1;background:#efefef;color:#262626;font-size: 16px;line-height: 30px;padding: 30px 20px 20px 20px;/* float:left; *//* width:50%; */}
.advertise .lefter .sign{
    position: absolute;
    bottom: 20px;
    right: 30px;
    display: flex;
    align-items:center;
    justify-content: flex-end;
}
.advertise .lefter .sign div{
    padding: 0 0 0 30px;
}
.advertise .righter{flex: 1;/* float:left; *//* width:50%; */}
.advertise .righter > div{ width:100%; max-width:575px; }
.advertise .margin-1{
    margin: 20px;
}
.advertise .margin-2{
    margin: 20px;
}
.advertise .pager{ text-align:right; }

/*flex*/
.flex {display:flex; }
.row { flex-direction:row; }
.column { flex-direction:column; }
.p33 {flex: 1 1 40%;}
.p66 {flex: 1 1 41%;}

@media screen and (max-width: 1200px) {
	.advertise.flex{ display:block; }
	.advertise .margin-1{ margin:0px 0 10px 0px; }
	.advertise .margin-2{margin: 0;padding-left: 0;}	
	.advertise img{ margin-bottom:10px !important; }
	
	.advertise .lefter{float:none;width:100%;display:flex;/* align-items:center; */justify-content: center;}
	.advertise .righter{float:none; width:100%;}
	.advertise .righter > div{display:flex; align-items:center; justify-content: center;}
}

@media screen and (max-width: 1110px) {
	.advertise .lefter{ padding-top: 10px; }
	.advertise .lefter .sign{ top: 290px; right: 10px; }
}

@media screen and (max-width: 1060px) {
	.advertise .lefter .sign{ top: 300px; right: 10px; }
}

@media screen and (max-width: 1050px) {
	.advertise .wrap{display:block;background: #efefef;}
	.advertise .lefter{ display:block; }
	.advertise .lefter .sign{ position:inherit; top:0; right:0; }
	.advertise .righter > div{ margin:0 auto; }
	.advertise .pager{ text-align:center; }
}

/*產品領域*/
#product-area{}
#product-area .slogan{color:#222222;background: #efefef;font-size: 16px;padding: 30px 3vw;margin: 0 0 30px 0;line-height: 30px;text-align: center;}
#product-area .pager{ text-align:right; }

#activity-list{display:flex;/* justify-content: space-between; */flex-wrap:wrap;width:100%;overflow:hidden;text-align: center;/* padding-bottom: 5vw; *//* border-bottom: 1px dashed #878787; */}
#activity-list .items{ position:relative; display: inline-block;vertical-align: top;flex: 0 31%;margin: 10px 1.1% 50px 1.2%;box-sizing:border-box;text-align:center;background:#ffffff;}
#activity-list .items > .date{text-align:left;font-size: 13px;line-height: 18px;color: #999999;padding: 0 0 5px 0;}
.activity-detail-title{ color:#bc8e8e; font-size:18px; border-bottom:1px solid #bc8e8e; margin:30px 0; padding:0 0 10px 0; }
#activity-list .photo-mask-content span{color:#ffffff;font-size: 22px;/* line-height:22px; */padding: 10px 0 10px 0;/* border-bottom: 1px solid #ffffff; */}
#activity-list .photo-mask-content span i{ font-size:30px; }

@media screen and (max-width: 1050px) {
	#product-area .pager{ text-align:center; }
	#activity-list .items img{/* display:none; */}		
}

@media screen and (max-width:800px) {
	#activity-list .items{flex:0 46%;margin: 20px 1.5%;}	
}
@media screen and (max-width:480px) {
	#activity-list .items{ flex:0 100%;margin: 20px 2%; }

}


/*環境與企業社會責任*/
#index-about {width:100%;background:url(../../images/about-bg.jpg?v=1) no-repeat;background-position: center bottom;/* background-size: cover; *//* background-attachment: fixed; */}
.index-about-contain {position:relative;max-width: 1200px;min-height: 565px;overflow: hidden;margin:0 auto;color:#797979;font-size:14px;line-height:25px;letter-spacing:1px;}
#index-about .common-title{
    color: #ffffff;
}
#index-about .common-title span{}
#index-about .common-title > .line{background: #ffffff;}
#index-about .about-box{width: 47%;right: 0;position: absolute;padding: 50px 20px 50px 20px;box-sizing:border-box;}
#index-about .about-box .content{color: #ffffff;font-size:16px;padding:10px 20px 0px 50px;line-height: 25px;}
#index-about .about-box .content .caption{
	line-height:30px;
    font-size: 24px;
    padding-bottom: 3vw;
}
#index-about .btn-3{margin: 70px 0 0 0;padding:3px 140px 3px 20px;background:transparent;border:1px double #ffffff;}
#index-about .btn-3:hover{ border:4px double #ffffff; }


@media screen and (max-width: 1024px) {	
	#index-about .about-box{position: inherit;margin: 0 auto;width: 95%;background-color: rgba(0, 0, 0, 0.7);}	
	.index-about-contain{ min-height:inherit; padding:50px 0; }
}
@media screen and (max-width: 480px) {	
	#index-about .about-box{ position:inherit; }
	#index-about .common-title span{ display:block; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 公司簡介 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

/*公司簡介與未來展望*/
.about-info{ text-align:center; }
.about-info .caption{ width:100%; margin:0 auto;background: #efefef; }
.about-info .slogan{max-width:1200px;color:#222222;font-size: 16px;padding: 30px 3vw;margin: 0 auto 30px auto;line-height: 30px;text-align: left;}
.about-info .slogan .title{font-size: 20px;font-weight: bold;}
.about-info img{ width:100%; max-width:811px; }

/*經營理念*/
#inner-about {width:100%;background:url(../../images/about-bg-2.jpg) no-repeat;background-position: center bottom;/* background-size: cover; *//* background-attachment: fixed; */}
.inner-about-contain {position:relative;max-width: 1200px;min-height: 565px;overflow: hidden;margin:0 auto;color:#797979;font-size:14px;line-height:25px;letter-spacing:1px;}
#inner-about .common-title{
    color: #000000;
}
#inner-about .common-title span{}
#inner-about .common-title > .line{background: #000000;}
#inner-about .about-box{width: 47%;right: 0;position: absolute;padding: 50px 20px 50px 20px;box-sizing:border-box;}
#inner-about .about-box .content{color: #000000;font-size:16px;padding:30px 0;line-height: 25px;}
#inner-about .about-box .content .caption{
	line-height:30px;
    font-size: 24px;
    padding-bottom: 3vw;
}
#inner-about .btn-3{margin: 70px 0 0 0;padding:3px 140px 3px 20px;background:transparent;border:1px double #ffffff;}
#inner-about .btn-3:hover{ border:4px double #ffffff; }


@media screen and (max-width: 1024px) {	
	#inner-about .about-box{position: inherit;margin: 0 auto;width: 95%;background-color: rgba(0, 0, 0, 0.7);}	
	.inner-about-contain{ min-height:inherit; padding:50px 0; }
	#inner-about .common-title{ color: #ffffff; }
	#inner-about .about-box .content{ color:#ffffff; }
}
@media screen and (max-width: 480px) {	
	#inner-about .about-box{ position:inherit; }
	#inner-about .common-title span{ display:block; }
}


/*董事長的話*/
.chairman {
    width: 100%;
    background: #efefef;
}
.chairman .wrap{display: flex;max-width: 1200px;overflow:hidden;margin: 0 auto 30px auto;}
.chairman .lefter{position: relative;flex: 1;background:#efefef;color:#262626;font-size: 16px;line-height: 30px;min-height: 300px;padding: 30px 30px 20px 30px;/* float:left; *//* width:50%; */}
.chairman .lefter .sign{
    position: absolute;
    bottom: 50px;
    right: 30px;
    display: flex;
    align-items:center;
    justify-content: flex-end;
}
.chairman .lefter .sign div{
    padding: 0 0 0 30px;
}
.chairman .righter{flex: 1;/* float:left; *//* width:50%; */}
.chairman .righter > div{ width:100%; max-width:575px; }

@media screen and (max-width: 785px) {	
	.chairman .lefter{min-height: 350px;}
}


@media screen and (max-width: 480px) {
	.chairman .lefter{min-height: 400px;}	
	.chairman .lefter .sign{ position:inherit; bottom:0; right:0; }
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 最新消息 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


/*最新消息*/
#index-news{width:100%; max-width:1200px; overflow:hidden; margin:0 auto;}
#index-news .news-area {display: flex;flex-wrap: wrap;width:100%;overflow:hidden;}
#index-news .news-area > .items{position:relative;width: 45%;margin: 25px 25px;padding: 20px 20px 20px 20px;justify-content:space-between;background:#ffffff;/* box-shadow: 1px 1px 5px #dfe4e7; */border: 1px solid #bfbfbf;}
#index-news .news-area > .items .date{/* background: #efebe1; */color: #939393;font-weight: bold;font-size: 13px;display: inline-block;padding: 10px 0px;margin: 0px 0 0 0;border-bottom: 3px solid #233169;}
#index-news .news-area > .items .title{width:100%;min-height: 70px;border-top: 1px solid #c8dbe0;}
#index-news .news-area > .items .title a{padding: 20px 0 0px 0;color: #282828;font-size: 16px;font-weight: bold;line-height: 25px;min-height: 70px;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}
#index-news .news-area > .items a.more{float:right;color: #233169;font-size: 14px;font-weight: bold;margin-top: 10px;}
#index-news .news-area > .items a.more i{font-size: 20px;vertical-align: -15%;}


#index-news .news-area > .items:hover{ background:#EBEBEB; transition: all 0.5s ease; }
/*
#index-news .news-area > .items:hover .title a{ color:#ffffff; }
#index-news .news-area > .items:hover .date{ background:#59482C; color:#918986; }
#index-news .news-area > .items:hover a.more{ color:#ffffff; }
#index-news .news-area > .items:hover a.more i{ color:#ffffff; }
*/


@media screen and (max-width : 1024px) {
	#index-news .news-area > .items{ width:100% !important; margin:20px 10px; }
}

/*最新消息內頁*/
#news-detail{width:100%;max-width:1200px;overflow:hidden;margin: 0px auto;}
#news-detail .pager{ text-align:right; }
#news-detail .pager .btn-1{ padding:20px 90px 20px 40px; margin-right: 20px; }
#news-detail .news_annex{ border-top: 1px solid #cacaca; margin-top: 20px; padding-top: 20px; }
#news-detail .news_annex .annex{ padding-left: 5px; padding-bottom: 10px; }
#news-detail .news_annex .annex .fa-link{ padding-right: 10px; }
#news-detail .news_annex .annex .fa-file-download{ padding-right: 14px; }

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 檢測項目 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#index-activity{width:100%;padding: 40px 0 150px 0;background-image:url(../../images/container-bg-4.jpg);background-position:bottom;background-repeat:no-repeat; background-size:100%; background-color:#ffffff;}
#index-activity .wrap{display:flex;flex-wrap: wrap;width:100%;max-width:1200px;margin:0 auto;}

#activity-list{display:flex;justify-content: center;flex-wrap:wrap;width:100%;overflow:hidden;text-align: center;padding-bottom: 2vw;margin: 40px 0;/* border-bottom: 1px dashed #878787; */}
#activity-list .items{display: inline-block;vertical-align: top;flex: 0 29%;margin: 10px 2% 50px 2%;box-sizing:border-box;text-align:center;background:#ffffff;}
#activity-list .items > .date{text-align:left;font-size: 13px;line-height: 18px;color: #999999;padding: 0 0 5px 0;}
.activity-detail-title{ color:#bc8e8e; font-size:18px; border-bottom:1px solid #bc8e8e; margin:30px 0; padding:0 0 10px 0; }
#activity-list .photo-mask-content span{color:#ffffff;font-size:16px;/* line-height: 30px; */}
#activity-list .photo-mask-content font{ border-bottom: 1px solid; padding-bottom: 5px;}
#activity-list .photo-mask-content span i{ font-size:30px; }
#activity-list .items .title-area{display:flex;width:100%;overflow:hidden;padding: 15px 20px 15px 20px;background: #192d80;color: #ffffff; line-height: 25px;}
#activity-list .items .title-area .left{font-size: 15px;display: flex;align-items:center;/* justify-content: center; */flex: 1;}
#activity-list .items .title-area .left a{color: #ffffff;font-weight:bold;}
#activity-list .items .title-area .right{/* flex:1; */}
#activity-list .items .title-area .right i{
    font-size: 16px;
    border-left: 1px solid #ffffff;
    padding-left: 15px;
}

@media screen and (max-width:800px) {
	#activity-list .items{flex:0 46%;margin: 20px 1.5%;}	
}
@media screen and (max-width:480px) {
	#activity-list .items{ flex:0 100%;margin: 20px 2%; }	
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 貼合類型 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


#inner-member{width:100%;overflow:hidden;margin: 30px auto 0 auto;}
#inner-member .pager{ text-align: right; }
#inner-member .pager .btn-1{ margin-right: 20px; }
#inner-member .member-list{display: flex;flex-wrap: wrap;align-items: stretch;margin: 0 1% 50px 1%;vertical-align: top;line-height: 25px;/* border: 1px solid #bcbcbc; */padding: 0px 0px;/* box-shadow: 0 0px 6px rgb(0 0 0 / 25%); */}
#inner-member .member-list .caption{width:100%;overflow:hidden;color: #000000;font-size: 30px;font-weight: bold;/* border-bottom: 2px solid #8dbb00; */padding: 0 0 10px 0;margin: 0 0 20px 0;display: flex;align-items:center;/* justify-content: center; */}
#inner-member .member-list .caption span{
    display: inline-block;
    /*min-width: 70px;*/
    font-size: 14px;
    color: #424242;
    font-weight: normal;
    padding: 7px 20px;
    margin: 0 20px 0px 0;
    background: linear-gradient(gray,black);
    color: #ffffff;
}
#inner-member .member-list .caption i{font-style:normal;padding: 20px 0 20px 0;border-bottom: 1px solid #cccccc;display: inline-block;width: 100%;}
#inner-member .member-list .title-area{flex: 1;padding: 0 20px;/* text-align: center; */}
#inner-member .member-list .title-area img{/* box-shadow: 0 5px 8px rgba(0, 0, 0, 0.25); */padding: 0 10px;width:100%;max-width: 455px;}
#inner-member .member-list .title-area img.shadow{box-shadow:15px 15px rgb(239 239 239); padding:0;}
#inner-member .member-list .info-area{
    flex: 1.3;
    padding: 0 20px;
}
#inner-member .member-list .info-area .info{
    /* display: flex; */
    align-items: stretch;
    /* justify-content: center; */
    /* border-top: 1px solid #d6d6d3; */
}
#inner-member .member-list .info-area .info .title{
    width: 100%;
    background: #efefef;
    color: #002e7a;
    font-size: 18px;
    font-weight: bold;
    padding: 10px 20px;
    margin: 0 0 0 0;
}
#inner-member .member-list .info-area .info .content{
    padding: 20px 0px;
    font-size: 16px;
}

#inner-member .member-list .info-area .info .content-list{
    line-height: 30px;
}

@media screen and (max-width : 1200px){
	#inner-member .member-list{ width:98%; }
}

@media screen and (max-width : 780px){
	#inner-member .member-list .title-area{ text-align:center; }
	#inner-member .member-list{ display:block; }
	#inner-teacher .member-list{width: 98%;}
	#inner-teacher .member-list .title-area{display:block;text-align: center;}
	
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 聯絡我們 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/

/*聯絡資訊*/
#contact_info{position:relative;max-width:1200px;overflow:hidden;padding: 30px 20px;}
#contact_info .contact_info_right{float:left;width: 50%;margin: 0px 0 30px 0;}
#contact_info .contact_info_left{float:left;/* max-width:400px; */width: 50%;font-size:15px;padding: 0px 30px 0 0px;box-sizing: border-box;letter-spacing:1px;color:#4f4f4f;line-height:30px;}
.contact_info_area{width:100%;overflow:hidden;line-height:25px;padding: 10px 0;/* border-bottom:1px dashed #a7a7a4; */}
.contact_info_title{float:left;width: 25%;min-width: 120px;color: #000000;/* background:#c6e0a8; */text-align:center;margin: 0 2% 0 0;padding:0 5px;-webkit-border-radius: 5px;-moz-border-radius: 5px;border-radius: 5px;}
.contact_info_title i{padding-right:8px;color: #e9e9e9;}
.contact_info_content{float:left;width: 70%;}

@media screen and (max-width : 1024px) {
	#contact_info .contact_info_right{ float:none; width:100%; }
	#contact_info .contact_info_left{float:none;width:100%;padding: 0px 0 25px 0;}
	.contact_info_title{ text-align:left; max-width:100px; }	
}

/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 聯絡我們表單 <<<----------------------------------------------------------------*/
/* ----------------------------------------------------------------------------------------------------------------*/


.enrolment-form{width:100%;background:#ffffff;padding:30px;box-shadow: 1px 1px 5px #ebebeb;background:url(../../images/contact-bg.jpg) no-repeat bottom;}
.enrolment-form .caption{color:#262626;font-size:16px;line-height:28px;font-weight:bold;text-align:center;padding: 30px 0;}
.enrolment-form .wrap{ max-width:1200px; width:100%; margin:0 auto; }
.enrolment-form .wrap .pager{ text-align: right; }
.enrolment-form .wrap .pager .btn-1{ margin-right: 20px; }
.enrolment-form .form1{ width:100%; display:flex; }
.enrolment-form .form1 .row{width:100%;display: flex;overflow: hidden;padding: 10px 0;/* border-bottom: 1px dashed #cccccc; */}
.enrolment-form .form1 .title{flex:1;display: flex;align-items:center;/*justify-content: flex-end;*/padding:10px; line-height:20px;font-size:16px;color:#282828;}
.enrolment-form .form1 .title img{ width:100%; }
.enrolment-form .form1 i{ color:#F00; padding-right:5px; }

.enrolment-form .input-item{width:100%;display: flex;align-items:center;justify-content: center;background-color: rgba(244, 244, 244, 0.9);margin: 0px 20px;padding: 5px 10px;border: 1px solid transparent;border-left: 5px solid transparent;transition: all 0.5s ease;}
.enrolment-form .input-item:hover{border:1px solid #014f86; border-left:5px solid #014f86;}
.enrolment-form .input-item .left{flex:1;color: #000000;font-size: 16px;font-weight: bold;letter-spacing: 1px;min-width: 100px;}
.enrolment-form .input-item .left span{ color:#cb333e; width:13px; display:inline-block; }
.enrolment-form .input-item .right{flex: 5;padding: 0 15px;border-left: 1px solid #d5d5d5;}
.enrolment-form .input-item .right input{width:100%;font-size:16px;border:0;background:transparent;outline: 0;}
.enrolment-form .input-item .right textarea{width:100%;font-size:16px;padding: 10px 0;height:150px;border:0;background:transparent;resize:none;outline: 0;}
.enrolment-form .input-item .right .rand-img{position:absolute;right: -20px;top: -5px;cursor:pointer;}


@media screen and (max-width : 1024px) {
	.enrolment-form .input-item{ margin:0; }
	.enrolment-form .form1{ display:block; }
	.enrolment-form .form1 .row{ display:block; border-bottom:0; }
	.enrolment-form .form1 .title{justify-content: flex-start;font-weight: bold;color: #9c885e;}
	
}

@media screen and (max-width : 768px) {

}

@media screen and (max-width : 480px) {

}


/* ----------------------------------------------------------------------------------------------------------------*/
/* ------------------------------>>> 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: 25px;right: 10px;color: #002E7A;}

.sidenav .head {width:100%;position: relative;overflow:hidden;/* text-align: center; */padding: 3px 0 3px 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: 50px; }
}

.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;
  margin: 0 auto;
}
.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(35, 35, 35, 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-mask2{opacity:0;position:absolute;left:0;bottom:0;color:#ffffff;width:100%;height:100%;background-color:#192d80;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 .line{border:1px solid #FFFFFF;}
.photo-mask2 .line{border:1px solid #FFFFFF;}
.gallery{ position:relative; }
.gallery .photo-mask{ opacity:0; cursor:pointer; }
.gallery .photo-mask2{ opacity:0; cursor:pointer; }
.gallery:hover .photo-mask{ opacity:1; }
.gallery:hover .photo-mask2{ opacity:0.9; }
.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: 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 {
  height: 70px;
  font-size: 16px;
  padding-top: 5px;
  padding-bottom: 5px;
  background-color: #014f86;
  color: white;
}

#table-1 td {
	height: 70px;
	font-size: 16px;
	line-height: 25px;
}