@charset "utf-8"; 

/* CSS Document */
@font-face{    
font-family:'neo_sanslight';     
src:url('fonts/neo-sans-light-1361508437.eot');     
src:url('fonts/neo-sans-light-1361508437.eot?#iefix') 
format('embedded-opentype'),         
url('fonts/neo-sans-light-1361508437.woff') 
format('woff'),         
url('fonts/neo-sans-light-1361508437.ttf') 
format('truetype'),         
url('fonts/neo-sans-light-1361508437.svg#neo_sanslight') 
format('svg');  
font-weight:normal;  
font-style:normal}

/* --- loading --- */
#loader{background-color:#1e939e; height:100%; width:100%; top:0; position:fixed; z-index:1600; _position:absolute; _top:0px; _left:0px}
#loader .loader{width:256px; height:230px; left:50%; top:50%; position:absolute; text-align:center; margin-left:-128px; margin-top:-115px; color:#fff ; text-transform: uppercase;}
#loader .loader img{margin-bottom:-60px}

body{overflow-x:hidden; background-color:#fff; font-family: Arial, "LiHei Pro Medium", Helvetica, sans-serif , "微軟正黑體";}

@media (max-width:1024px){  
body{ height:auto !important}

}

#footer{position:relative; display:block; width:100%; height:250px; margin: 0 auto ; color:#555; background:#515151; font-size:13px; line-height:20px}
.logo_footer{width:110px; height:80px; display:block; margin:10px; background:url(../images/logo_footer.png) center no-repeat transparent; z-index:10; color: #fff; line-height: 165px;}
.icon_ft{ float: left }
.icon_ft li{ display: inline-block; margin: 0 10px;}
.wp-inner_ft{display:block; text-align:center; width:768px; margin:0 auto; padding:0 20px;}
.wp-inner_ft span{ color: #868686; font-size: 14px; display: block; text-align: left; margin: 20px 0 0 23px; text-transform:uppercase; letter-spacing: 1px; }
.text_menu a{ color: #ddd }
.text_menu li{ display: inline-table; margin: 20px; line-height: 32px; text-align: left; }
.top_ft{ background: url(../images/top.png) no-repeat center; width: 62px; height: 47px; display: block; position: absolute; right: 60px; top: -45px;}


.title-unit{padding:25px 0; font-weight:normal; text-align:center}
.title-bn-content{width: 100%; height: 430px; padding: 210px 0 0; margin:0 0 -260px; font-weight:normal; text-align:center}
.title-bn-content-inquiry{width: 100%; height: 430px; padding: 210px 0 0; margin:0 0 -260px; font-weight:normal; text-align:center}
.title-bn-en{color:#333; font: 40px 'neo_sanslight'; letter-spacing: 10px; text-transform: uppercase;}
.title-bn-tw{display:block; color:#333; margin-left:0; font-size:28px; line-height: 40px;}
.title-hot{ margin: -100px 0 0; }

.title-left{ text-align: right; margin: 0 30px 0 0;}
.title-right{ text-align: left; margin: 0 0 0 30px;}
.title-unit-en{color:#2f828a; font:32px 'neo_sanslight'}
.title-unit-tw{display:block; color:#2f828a; margin-left:0; font-size:28px}
.title-img-en{ color: #fff; font-size:30px 'neo_sanslight'; top: 100px; position: relative; z-index: 888}

.title-pr-tw{display:block; color:#2f828a; margin-left:0; font-size:28px; float: left; border-bottom: 3px solid #ebd769; padding: 0 0 5px; position: absolute;}

.title-img-tw{ display:block; color: #fff; font-size:32px; top: 100px; position: relative; z-index: 888}

.title-date{font-size:12px; color:#aaa}
.title-grid{margin:10px 0; color:#c91d1d; font-size:15px; line-height:22px}
.title-main{margin:15px 0; color:#0b888d; font-size:24px; line-height:30px; text-align: left;}

.grid_list{display:block; text-align:center; width:1040px; margin:0 auto}
.grid_list li{width:250px; height:250px; float:left; margin:3px}

.wp-inner{display:block; text-align:center; width:1040px; margin:80px auto; padding:0 20px;}
.wp-inner-content{display:block; margin:0 20px; text-align: left;} /*內頁+ .wp-inner-content*/

.img-100{ width: 100%; margin: 0 0 20px; display: initial; }
.img-right{ margin: 0 0 20px 50px; float: right; width: 450px; }
.img-right img , .img-conter img{ width: 100%;}

.img-list{ width: 100%; margin: 0 auto; text-align: center;}
.img-list li{ display: inline-block; margin: 0 10px; }

.icon0b1 , .icon0b2 , .icon0b3{ width: 105px; height: 70px; margin: 20px 0 0; line-height: 20px; color: #0b888d; font-size: 15px; border-bottom: 1px #afbfc0 solid; font-style: inherit; letter-spacing: 2px; font-weight: initial; display: inline-block; text-align: center; padding:30px 0 0 ;}
.icon0b1{ background: url(../images/menu_left_0b1.png) no-repeat top center;}
.icon0b2{ background: url(../images/menu_left_0b2.png) no-repeat top center;}
.icon0b3{ background: url(../images/menu_left_0b3.png) no-repeat top center;}

.icon_print{ width: 32px; height: 25px; background: url(../images/btn_Print.png) no-repeat; display: inline-block; margin: 5px 5px -6px 0;}

.line-gray{width:100%; height:1px; border-top:1px solid #b99349}
.line-gray2{width:100%; height:3px; border-top:2px solid #f0e2cd; margin: 40px 0 20px}
.line-gray3{width:100%; height:3px; border-top:5px solid #b99349; margin: 0 0 20px}
.title_h3{ margin: 20px 0; color: #c9a063;	font-size: 20px; line-height: 34px; }

[class^="text-gray"]{color:#333}
.text-gray-m{font-size:16px; line-height:26px}
.text-gray-s{font-size:15px; line-height:26px}
.text-gray-xs{font-size:13px; line-height:22px}

.list-normal{ list-style-type: decimal;}
.list-normal li{ margin: 0 0 15px 20px;}


/*XX*/
[class^="btn-text"]{
	color: #4c97d3;
}
[class^="btn-text"]:hover{
	text-decoration: underline;
}
.btn-text-m{
	font-size: 14px;
}

[class^="btn-trans-"]{
	border: 1px solid transparent;
	text-align: center;
}
[class^="btn-trans-"]:hover{
	border-color: #040000;
	background-color: rgba(4,0,0,0.45);
}
.ie8 [class^="btn-trans-"]:hover{
	background: url(../images/bg-ie8-black-45.png) 0 0 repeat transparent;
}
[class^="btn-trans-l"]{
	display: block;
	width: 198px;
	height: 85px;
	margin: 0 auto;
	font-size: 20px;
	font-weight: bold;
	line-height: 85px;
}
.btn-trans-l-red{
	color: #c91d1d;
}
.btn-trans-l-blue{
	color: #4c97d3;
}
.btn-trans-social{
	display: block;
	width: 48px;
	height: 48px;
	line-height: 48px;
	text-align: inherit;
	text-indent: 9999px;
}
[class^="btn-box"]{
	text-align: center;
}
[class^="btn-box-s-"]{
	display: inline-block;
	width: 138px;
	height: 38px;
	margin: 0 5px;
	color: #fff;
	font-size: 15px;
	line-height: 40px;
}
.btn-box-s-red{
	background-color: #c9a063;
}
.btn-box-s-red:hover {
	background-color: #f5b14c;
}
[class^="btn-box-m-"]{
	display: inline-block;
	width: 110px;
	height: 40px;
	margin: 0 5px;
	color: #fff;
	font-size: 16px;
	line-height: 40px;
}
.btn-box-m-red{
	background-color: #c9a063;
}
.btn-box-m-red:hover {
	background-color: #f5b14c;
}
.btn-box-m-red.off{
	color: #666;
	background-color: #222;
	border-color: #111;
	cursor: auto;
}
.btn-box-m-light-gray{
	color: #fff;
	background-color: #666;
	border: 1px solid #333;
}
.btn-box-m-light-gray:hover{
	background-color: #777;
}
[class^="icon-s-"]{
	display: inline-block;
	width: 20px;
	height: 20px;
	margin-right: 5px;
	background: url(../images/icon-s.png) 0 0 no-repeat transparent;
	vertical-align: middle;
}
.icon-s-download{
	background-position: 0 0;
}
a:hover .icon-s-download{
	background-position: 0 -20px;
}
.icon-s-log{
	background-position: 0 -40px;
}
a:hover .icon-s-log{
	background-position: 0 -60px;
}
.icon-s-online{
	background-position: 0 -80px;
}
a:hover .icon-s-online{
	background-position: 0 -100px;
}
.icon-s-phone{
	background-position: 0 -120px;
}
.icon-s-download-blue{
	background-position: 0 -140px;
}
[class^="icon-m-"]{
	display: inline-block;
	width: 25px;
	height: 25px;
	margin-right: 5px;
	background: url(../images/icon-m.png) 0 0 no-repeat transparent;
	vertical-align: middle;
}
.icon-m-all{
	background-position: 0 0;
}
a:hover .icon-m-all, .on .icon-m-all{
	background-position: 0 -25px;
}
.icon-m-purple{
	background-position: 0 -50px;
}
a:hover .icon-m-purple, .on .icon-m-purple{
	background-position: 0 -75px;
}
.icon-m-green{
	background-position: 0 -100px;
}
a:hover .icon-m-green, .on .icon-m-green{
	background-position: 0 -125px;
}
.icon-m-blue{
	background-position: 0 -150px;
}
a:hover .icon-m-blue, .on .icon-m-blue{
	background-position: 0 -175px;
}
.icon-m-yellow{
	background-position: 0 -200px;
}
a:hover .icon-m-yellow, .on .icon-m-yellow{
	background-position: 0 -225px;
}
[class^="icon-l-"]{
	display: inline-block;
	width: 35px;
	height: 35px;
	margin-right: 15px;
	background: url(../images/icon-l.png) 0 0 no-repeat transparent;
	vertical-align: middle;
}
.icon-l-login{
	background-position: 0 0;
}
.icon-l-registration{
	background-position: 0 -35px;
}
[class^="icon-social"]{
	display: block;
	width: 30px;
	height: 30px;
	margin: 9px;
	background: url(../images/icon-social.png) 0 0 no-repeat transparent;
}
.icon-social-facebook{
	background-position: 0 0;
}
a:hover .icon-social-facebook{
	background-position: 0 -30px;
}
.icon-social-youtube{
	background-position: 0 -60px;
}
a:hover .icon-social-youtube{
	background-position: 0 -90px;
}
.icon-social-mail{
	background-position: 0 -120px;
}
a:hover .icon-social-mail{
	background-position: 0 -150px;
}
.icon-video{
	display: block;
	width: 60px;
	height: 60px;
	background: url(../images/icon-video.png) 0 0 no-repeat transparent;
}
.list-grid-item-type{
	position: absolute;
	display: inline-block;
	top: 40px;
	right: 15px;
	padding: 4px 5px;
	background-color: rgba(4,0,0,0.45);
	border: 1px solid #040000;
}
.ie8 .list-grid-item-type{
	background: url(../images/bg-ie8-black-45.png) 0 0 repeat transparent;
}
.list-grid-item-type li{
	float: left;
	margin: 0 5px;
}
.btn-grid-item-type{
	display: block;
	width: 113px;
	height: 38px;
	color: #fff;
	font-size: 15px;
	line-height: 38px;
	text-align: center;
	border: 1px solid transparent;

	-webkit-transition:all ease .1s;-moz-transition:all ease .1s;
}
.btn-grid-item-type:hover , .btn-grid-item-type.on{
	background-color: #bd2121;
	border: 1px solid #740101;

}
.btn-close{
	display: block;
	width: 50px;
	height: 50px;
	background: url(../images/btn-close.png) 0 0 no-repeat transparent;
	text-indent: -9999px;
	cursor: pointer;
}
.btn-close:hover{
	background-position: 0 -50px;
}
.smooth-motion{
	-webkit-transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1) 0s;
	-moz-transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1) 0s;
	-o-transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1) 0s;
	-ms-transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1) 0s;
	transition: all 500ms cubic-bezier(0.23, 1, 0.32, 1) 0s;
}
.grid-item{
	display: block;
	float: left;
	cursor: pointer;
}
.grid-item:hover{
	background-color: #151515;
}
.grid-item-line{
	position: absolute;
	width: 100%;
	height: 2px;
	left: 0;
	bottom: 0;
	z-index: 6;
}
.type-purple .grid-item-line{
	background-color: #c500b0;
}
.type-green .grid-item-line{
	background-color: #20c500;
}
.type-blue .grid-item-line{
	background-color: #0074b6;
}
.type-yellow .grid-item-line{
	background-color: #ed8103;
}
.icon-grid-item{
	position: absolute;
	display: block;
	width: 28px;
	height: 28px;
	right: 0px;
	bottom: 2px;
	z-index: 6;
	background-image: url(../images/icon-grid-item.png);
	background-repeat: no-repeat;
}
.type-purple .icon-grid-item{
	background-color: #c500b0;
	background-position: 0 0;
}
.type-green .icon-grid-item{
	background-color: #20c500;
	background-position: 0 -28px;
}
.type-blue .icon-grid-item{
	background-color: #0074b6;
	background-position: 0 -56px;
}
.type-yellow .icon-grid-item{
	background-color: #ed8103;
	background-position: 0 -84px;
}



.grid-black{
	border: 1px solid #040000;
	background-color: rgba(4,0,0,0.45);
}

.ie8 .grid-black{
	background: url(../images/bg-ie8-black-45.png) 0 0 repeat transparent;
}




/* -- unifrom -- */
.grid-form{margin-bottom:50px}
.form-item{width:90px; height:40px; margin-right:15px; color:#333; font-size:15px; line-height:40px; text-align:left; vertical-align:middle}
.form-detail{display:inline-block; height:40px; margin-right:15px; padding:0 10px; color:#ddd; font-size:15px; line-height:40px; vertical-align:middle}
.form-item-radio{display:inline-block; height:40px; margin:0 30px 0 15px; color:#ddd; font-size:15px; line-height:40px; vertical-align:middle}
.left-for1{ width: 780px; }
.left-for2{ width: 170px; }
.left-for3{ width: 740px; margin: 0 0 0 -10px;}
.list-form li{padding:5px 0; color:#333; font-size:16px; display: inline-block; text-align: left;}
.list-form label{display:inline-block; vertical-align:middle}
.left-list-form, .right-list-form{display:inline-block; vertical-align:text-top}
.left-list-form{width:110px}
.list-form{ width: 780px; margin: 0 auto; }
.right-list-form{width:260px; margin-left:10px}
.right-list-form b{ margin: 0 10px; }
.error-message{display:block; padding:10px 0 0; color:#c91d1d; font-size:13px}
.text-l{width:205px}
.text-2{ width:80px;}
.text-3{ width:180px;}
.let-text{ width: 773px; }

.textarea-l{width: 615px;}

/* 用於上方有select */
.text-top{margin-top:10px !important}

/* selector-m */
.selector-m div.selector{ width:159px}
.selector-m div.selector select{ min-width:171px}
.selector-m div.selector span{ width:159px}

/* selector-l */
.selector-l div.selector{ width:334px}
.selector-l div.selector select{ min-width:346px}
.selector-l div.selector span{ width:334px}

/* --- table-normal --- */
.table-normal{border:none; color:#ddd; text-align:center}
.table-normal thead{font-size:15px}
.table-normal thead th{padding:15px 0}
.table-normal tbody td{padding:15px 0; font-size:14px; border-top:1px solid #272727}


/* Landscape and down
===============================*/
@media (min-width:1080px){
.wp-inner-content{display:block; width:1020px; margin:0 auto; text-align: left;} /*內頁+ .wp-inner-content*/
.img-left img{ float: left; margin: 0 40px 0 0; width: 24%;}

}
@media (max-width:1080px){
.wp-inner-content{display:block; width:980px; margin:0 auto; text-align: left;} /*內頁+ .wp-inner-content*/
.img-left img{ float: left; margin: 0 40px 0 0; width: 25%;}
.img-list li{ display: inline-block; margin: 0 20px; }

}

@media (max-width:1024px){
.grid_list{display:block; text-align:center; width:780px; margin:0 auto}
.wp-inner{display:block; text-align:center; width:760px; margin:80 auto}
.wp-inner-content{display:block; width:760px; margin:0 auto; text-align: left;} /*內頁+ .wp-inner-content*/
.img-left img{ float: left; margin: 0 40px 0 0; width: 37%;}
.img-list li{ display: inline-block; margin: 0 5px; }

}

@media (max-width:820px){
.wp-inner-content{display:block; width:460px; margin:0 auto; text-align: left;} /*內頁+ .wp-inner-content*/
.img-left img{ float: left; margin: 0 40px 0 0; width: 40%;}
.wp-inner_ft{width:760px; margin:0 auto; padding:0px;}

.list-form{ width:550px; }
.textarea-l{ width: 345px;}
.text-l{ width:90px; }
.left-list-form{ width: 87px; }
.right-list-form{ width: 130px; }
}

@media (max-width:760px){
.grid_list{display:block; text-align:center; width:520px; margin:0 auto}
.wp-inner{display:block; text-align:center; width:460px; margin:80px auto}
.img-left img{ float: left; margin: 0 40px 0 0; width: 40%;}

#footer{height:315px;}
.icon_ft{ float: none; }
.wp-inner_ft{width:450px; margin:0 auto; padding:0px;}
.wp-inner_ft span{ text-align: center; }

.list-form{ width:550px; }
.textarea-l{ width: 345px;}
.text-l{ width:90px; }
.left-list-form{ width: 87px; }
.right-list-form{ width: 130px; }
}

@media (max-width:510px){
.wp-inner-content{display:block; width:260px; margin:0 auto; text-align: left;} /*內頁+ .wp-inner-content*/
.img-right{ width: 100%; }
.img-left img{ float: left; margin: 0 40px 0 0; width: 100%;}
.right-list-form{width:250px; margin-left:10px}
.article_contain img{ margin: 0 0 20px; width:100%; }

.list-form{ width:450px; }
.textarea-l{ width: 345px;}
.text-l{ width: 326px; }
.left-list-form{ width: 87px; }
.right-list-form{ width: 130px; }
.left-for3{ width: 400px; }

}
@media (max-width:480px){
.grid_list{display:block; text-align:center; width:260px; margin:0 auto}
.wp-inner{display:block; text-align:center; width:300px; margin:80px auto}
.img-right{ width: 100%; }
.img-left img{ float: left; margin: 0 40px 0 0; width: 100%;}

#footer{height:550px;}
.logo_footer{ display: none; }
.icon_ft{ float: none; }
.icon_ft li{ margin: 0px 5px 0px; }
.wp-inner_ft{width:300px; margin:0 auto; padding:0px;}
.wp-inner_ft span{ text-align: center; }
.top_ft{ top: -15px; position: relative; margin: 0 auto; right: 0px;}

.list-form{ width:250px; }
.textarea-l{ width: 145px;}
.text-l{ width: 126px; }
.left-list-form{ width: 87px; }
.right-list-form{ width: 130px; }
.left-for3{ width: 300px; }
}

@media (max-width:320px){
.grid_list{display:block; text-align:center; width:260px; margin:0 auto}
.wp-inner{display:block; text-align:center; width:300px; margin:80px auto}
.img-right{ width: 100%; }


}