@charset "utf-8";
@import url(font-awesome/css/font-awesome.min.css);
@import url(font-awesome/css/font-awesome-ie7.min.css);
@import url(https://fonts.googleapis.com/css?family=Lato);
@import url(https://fonts.googleapis.com/css2?family=Noto+Sans+TC&family=Noto+Serif+TC&display=swap);
@import url(ElegantIcons/style.css);
@import url(animate-custom.css);

/*============reset===============*/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, button, textarea, select, p, blockquote, th, td, iframe, figure, figcaption { margin: 0; padding: 0; font-size: 100%; }
article, aside, audio, canvas, command, datalist, details, embed, figcaption, figure, footer, header, hgroup, keygen, meter, nav, output, progress, section, source, video { display: block; }
table, table td { border-collapse: collapse; border-spacing: 0; border: none; }
fieldset, img { border: 0; vertical-align: bottom; }
address, caption, cite, code, dfn, em, strong, th, var, optgroup { font-style: inherit; font-weight: inherit; }
a, del, ins { text-decoration: none; }
ol, li { list-style: none; }
caption, th { text-align: left; }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: normal; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
abbr, acronym { border: 0; font-variant: normal; }
sup, sub { vertical-align: baseline; }
input, button, textarea, select, optgroup, option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; outline: 0; border: 0; }
/*============clear===============*/
.clear { clear: both; }
.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }
/*============animate===============*/
a, .visible, .header-tel, a i, .icon-box, .img-box img, .img-over-box img, a:before, #fp-nav,form input { -webkit-transition: all 250ms ease-in; -o-transition: all 250ms ease-in; -moz-transition: all 250ms ease-in; transition: all 250ms ease-in; }
.button-icon a:hover{-ms-transform: scale(1.1);-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-o-transform: scale(1.1);transform: scale(1.1);}
.hidden { opacity: 0; }
.visible { opacity: 1; }
.fade { display: none; }
.delay-1 { -webkit-animation-delay: .3s; -moz-animation-delay: .3s; animation-delay: .3s; }
.delay-2 { -webkit-animation-delay: .5s; -moz-animation-delay: .5s; animation-delay: .5s; }
.delay-3 { -webkit-animation-delay: 1s; -moz-animation-delay: 1s; animation-delay: 1s; }
.delay-4 { -webkit-animation-delay: 2s; -moz-animation-delay: 2s; animation-delay: 2s; }
.delay-list li { opacity: 0;opacity:1\9\0;/*IE9hack*/ -webkit-animation: fadeInUp 0.9s 1;  animation: fadeInUp 0.9s 1;  -webkit-animation-fill-mode: forwards;  animation-fill-mode: forwards;}
.delay-list li:nth-child(10n+1) {-webkit-animation-delay: 0.2s;  animation-delay: 0.2s;}
.delay-list li:nth-child(10n+2) {-webkit-animation-delay: 0.4s;  animation-delay: 0.4s;}
.delay-list li:nth-child(10n+3) {-webkit-animation-delay: 0.6s;  animation-delay: 0.6s;}
.delay-list li:nth-child(10n+4) {-webkit-animation-delay: 0.8s;  animation-delay: 0.8s;}
.delay-list li:nth-child(10n+5) {-webkit-animation-delay: 1.0s;  animation-delay: 1.0s;}
.delay-list li:nth-child(10n+6) {-webkit-animation-delay: 1.2s;  animation-delay: 1.2s;}
.delay-list li:nth-child(10n+7) {-webkit-animation-delay: 1.4s;  animation-delay: 1.4s;}
.delay-list li:nth-child(10n+8) {-webkit-animation-delay: 1.6s;  animation-delay: 1.6s;}
.delay-list li:nth-child(10n+9) {-webkit-animation-delay: 1.8s;  animation-delay: 1.8s;}
.delay-list li:nth-child(10n+10) {-webkit-animation-delay: 2.0s;  animation-delay: 2.0s;}
.canvas-animation { position: absolute; width: 100%; height: 0; overflow: hidden; }
.canvas-animation canvas { display: block; position: absolute; width: 100%; height: 100%; top: 0;}
.canvas-animation img{ width:100%;}
/*============iframe===============*/
.iframe-16x9 { position: relative; padding-bottom: 56.24%; height: 0; overflow: hidden; }
.iframe-4x3 { position: relative; padding-bottom: 75%; height: 0; overflow: hidden; }
.iframe-16x9 iframe, .iframe-4x3 iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/*============grids===============*/
.grid-full, .grid-large, .grid-middle, .grid-small, .grid-max, .grid-min, .grid-content { width: 80%; margin: 0 auto; position: relative; }
.grid-full { max-width: 1920px; }
.grid-large { max-width: 1680px; }
.grid-middle { max-width:950px; }
.grid-small { max-width: 400px; }
.grid-1-12, .grid-2-12, .grid-3-12, .grid-4-12, .grid-5-12, .grid-6-12, .grid-7-12, .grid-8-12, .grid-9-12, .grid-10-12, .grid-11-12, .grid-3-8, .grid-5-8, .grid-1-2 { float: left; display: block; position: relative; }
.grid-1-12 { width: 8.3%; }
.grid-2-12 { width: 16.6%; }
.grid-3-12 { width: 25%; }
.grid-4-12 { width: 33.3%; }
.grid-5-12 { width: 41.6%; }
.grid-6-12 { width: 50%; }
.grid-7-12 { width: 58.3%; }
.grid-8-12 { width: 66.6%; }
.grid-9-12 { width: 75%; }
.grid-10-12 { width: 83.3%; }
.grid-11-12 { width: 91.6%; }
.grid-3-8 { width: 38%; }
.grid-5-8 { width: 62%; }
.grid-1-2 { width: 47%; }
.grid-1-8{width: 12.5%;}
.grid-2-8{width: 25%;}
.grid-3-8{width: 37.5%;}
.grid-4-8{width: 50%;}
.grid-5-8{width:62.5%;}

/*============style===============*/
body { font-family: "Noto Serif TC", Times, "Times New Roman", "儷宋 Pro", "LiSong Pro Light", "宋体", SimSun, serif; font-size: 1em; color: #333; word-wrap: break-word; background: #002a64; }
.font-en, #header small, .text-en, .load-box,.img-caption{font-family: "Lato", Arial, Helvetica, "微軟正黑體", "Microsoft JhengHei", "儷黑 Pro", "LiHei Pro", sans-serif;}
p { font-size: 17px; line-height: 30px; letter-spacing: 2px; }
p span, .br, h1 span, h2 span { display: inline-block; }
::selection { background: #e9e8e8; color: #e9e8e8; }
a { color: #fff;}
a:hover  { color: #D9E476; }

a .icon-box { filter: alpha(opacity=0); opacity: 0; }
a:hover .icon-box { filter: alpha(opacity=100); opacity: 1; top: 40px; font-size: 2em;}
a:hover .icon-box, .button-in .img-over-box:hover .icon-box {background-position: right top;}
a.button-line:before, .footer-info a:before{ position: absolute; content: ''; display: block; background-color: #D9E476; bottom:0; left:50%; width: 0px; height: 2px;}
a.button-line:hover:before, .footer-info a:hover:before{ width: 100%; left:0;}
strong { font-weight: bold; }
em, i { font-style: normal; }
big { font-size: 1.1em; }
small { font-size: 0.85em; }
h1 { text-align: center; font-size: 38px;line-height:85px; font-weight:500;position: relative;}
h2 { font-size: 16px; letter-spacing: 30px;margin-top: 3px;}
h3 { font-size: 26px;}
h4, h5, h6 { font-size: 1em; }
.text-en{font-size: 12px; line-height: 16px;letter-spacing: 1px;}
.nowrap{ white-space: nowrap; text-overflow: ellipsis; overflow: hidden; }
.offscreen{position: absolute;clip: rect(1px 1px 1px 1px);clip: rect(1px, 1px, 1px, 1px);padding: 0;border: 0;height: 1px;width: 1px;overflow: hidden;}
.no-space{ letter-spacing: 0 !important;}
.align-left{ float: left;}
.align-right{ float: right;}
.align-center{ margin: 0 auto;}
.text-right{margin-right: 10px;}
.text-left{margin-left: 10px;}
.text-top{margin-top:40px;}
.text-bottom{margin-bottom:25px;}
.box-top{margin-top:50px;}
.box-bottom{ margin-bottom: 50px;}
/*============base===============*/
body, html { height: 100%; }
.wrapper { min-height: 100%; width: 100%; position: relative;}

/*============iframe===============*/
.iframe-16x9 { position: relative; padding-bottom: 56.24%; height: 0; overflow: hidden; }
.iframe-4x3 { position: relative; padding-bottom: 75%; height: 0; overflow: hidden; }
.iframe-16x9 iframe, .iframe-4x3 iframe, .googlemap iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.video-box{ width: 100% !important; height: auto !important; }
/*============header===============*/
#header { position: fixed; display: block; top: 12%; left:1%; z-index: 101;}
.button-icon a{position: relative; display: block; width: 50px; height: 50px; overflow: hidden; color: #fff; background-color: #333; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; filter: alpha(opacity=50); opacity: 0.5; margin-bottom: 5px;}
.button-icon i{ display: block;font-size: 20px; line-height: 50px;}
.button-icon small{ display: block; font-size: 13px; line-height: 16px; margin-top: 10px;}
.button-icon a:hover{ background: #e84709;filter: alpha(opacity=100); opacity: 1;}
.button-icon a:hover i{ margin-top: -50px;}
/*============load===============*/

.load-box{background-image: url('../images/logo-2.png'); background-color: rgba(0,0,0,0.72); background-position: center center; background-repeat: no-repeat; }
.load-box:before{ content: 'loading...'; position: absolute;top:40%; left: 0; width: 100%; font-size: 16px; text-align: center; color: #fff;}
.load-box.active{ height: 0px;top: -2px;}

.load-box{ position: fixed; top: 0; left: 0; height: 100%; width: 100%; z-index: 101; overflow: hidden; font-size: 0; line-height: 0; -webkit-transition: all 500ms ease-in; -o-transition: all 500ms ease-in; -moz-transition: all 500ms ease-in; transition: all 500ms ease-in;}
.load-box.active{ height: 0px;top: -2px;}
.loader{position: absolute;top:40%; left: 50%; width: 80px;margin-left: -40px; font-size: 12px; padding-top: 50px; text-align: center; color: #fff;}
.loader .dot {width: 10px; height: 10px;background: #fff; border-radius: 50%; position: absolute; top: calc(50% - 5px);}
.loader .dot1 {left: 15px;-webkit-animation: dot-jump 0.5s cubic-bezier(0.77, 0.47, 0.64, 0.28) alternate infinite;animation: dot-jump 0.5s cubic-bezier(0.77, 0.47, 0.64, 0.28) alternate infinite;}
.loader .dot2 { left: 35px;-webkit-animation: dot-jump 0.5s 0.2s cubic-bezier(0.77, 0.47, 0.64, 0.28) alternate infinite;animation: dot-jump 0.5s 0.2s cubic-bezier(0.77, 0.47, 0.64, 0.28) alternate infinite;}
.loader .dot3 { left: 55px;-webkit-animation: dot-jump 0.5s 0.4s cubic-bezier(0.77, 0.47, 0.64, 0.28) alternate infinite;animation: dot-jump 0.5s 0.4s cubic-bezier(0.77, 0.47, 0.64, 0.28) alternate infinite;}
@-webkit-keyframes dot-jump {
0% {-webkit-transform: translateY(0);transform: translateY(0);}
100% { -webkit-transform: translateY(-15px); transform: translateY(-15px);}
}
/*============main===============*/
.bg-org { background:#e84709;}
.logo{position: absolute; width: 100%; max-width:269px; top:15px;left: 25px;z-index: 3;}
.title-en img{display: block;width: 100%;}
.mobile-hide{display: block;}
.pc-hide,.company-mobile{display: none!important;}
.opacity{-moz-opacity:0.7;-khtml-opacity:0.7;filter: alpha(opacity=70);opacity: 0.7;}
.bg-white { background:#ffffff;}
.bg-blue { background:#00314f;}
/*============lightBox-img===============*/
.img-slide{display: block; width: 100%;}
.lightBox-img a{position: relative;}
.img-container { position: relative; overflow: hidden; }
.img-container img { width: 100%; height: auto; }
.img-caption { position: absolute; display: block; bottom: 0; right:0px; padding:5px 15px; font-size: 16px; letter-spacing:1px; color: #fff; min-height: 35px; font-weight:900;text-shadow: 0px 0px 0.2em black,0px 0px 0.2em black; z-index: 1;}
.img-caption i{ margin-right: 3px;}
.img-box, .img-over-box { position: relative; display: block; text-align: center; overflow: hidden; }
.img-box img, .img-over-box img { width: 100%; height: auto; -ms-transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -o-transform: scale(1); transform: scale(1); -webkit-transition: all 1000ms ease-out; -o-transition: all 1000ms ease-out; -moz-transition: all 1000ms ease-out; transition: all 1000ms ease-out; }
a:hover .img-box img, a.img-box:hover img, a:hover .img-over-box img { -ms-transform: scale(1.05); -webkit-transform: scale(1.05); -moz-transform: scale(1.05); -o-transform: scale(1.05); transform: scale(1.05); }
.icon-box span { position: absolute; display: block; top: 0px; right: 0; bottom: 0; left: 0; margin: auto; width: 60px; height: 60px; background: #e84709; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px; }
.icon-box span:after { content: ''; display: block; text-align: center; font-size: 0.7em; }
.icon-box i { background: url(../images/icon-zoom.png) no-repeat center center; display: block;margin: 0 auto;width: 100%; height: 100%;max-width: 25px;}

/*============mb.YTPlayer===============*/

.video-full-wrapper .inline-YTPlayer{ position: absolute!important; max-width:inherit!important; height: 100%; width: 100%;}
.video-full-wrapper .mb_YTPlayer{ /*padding-bottom:52.08%!important;*/ height: auto!important; position: absolute!important; width: 100%;}
.video-full-contain .mbYTP_wrapper iframe{width: 100% !important; height: 100% !important;margin-left: 0 !important;margin-top: 0 !important;}
/*.video-full-wrapper .mbYTP_wrapper{ position: absolute!important;}
.video-full-contain .mbYTP_wrapper iframe{width: 100% !important; height: 100% !important;margin-left: 0 !important;margin-top: 0 !important;}
.mb_YTPlayer:hover .inlinePlayButton, .inlinePlayButton:hover { transform: scale(1.1) !important;}
.inlinePlayButton{ width: 50px;height: 50px; line-height: 50px;font-size: 26px;transform: scale(1);left: auto; right: 3%;}
.mb_YTPlayer:hover .inlinePlayButton, .inlinePlayButton:hover { transform: scale(1.1) !important;}*/

/*==============section2==================*/
#section2 .text-box{width: 80%;}
#section2 .text-box img{width: 85%;}
#section2 .title-en{max-width: 1077px;}
#section2 .text-box{max-width:819px; display: block; margin: 0 auto;}
#section2 .img-slide{width: 80%; margin: 10% auto;}

/*==============section3==================*/
.location-img1 .img-box{width: 25%; float: left;}
#section3 .text-box{width: 50%; float: left; max-width:960px; background-color: #fff;}
#section3 .text-box img{width: 90%;/* max-width:506px;*/display: block; margin: 4% auto;}
/*==============section4==================*/
.build{height: 100%; max-width:1470px; overflow: hidden; background: url(../images/build-img.jpg) no-repeat center/cover;}
#section4 .text-box img{max-width:188px; margin: 25% auto 15% 20%;}

/*==============section5==================*/
#section5 .text-box::after {/*content: " "; position: absolute; background: url(../images/public-en.png) no-repeat left bottom/auto; height: 100%; width: 100%;opacity: 0.7; filter: alpha(opacity=70);-moz-opacity:0.7;-khtml-opacity:0.7; z-index: -1;*/}
#section5 .text-box img{width: 75%; max-width:840px;display: block;}
#section5 .img-caption,#section6 .img-caption{text-align: right;background-color: #e84709;text-shadow: inherit; font-weight: 500;padding: 25px 15px;right: 15px;}
.img-caption span{font-size: 28px;}

/*==============section6==================*/
#section6 .grid-full{width: 100%;}
#section6 .img-caption{width: 150px; bottom: 10%; right: 0; padding: 15px;}
#section6 .title-en{width: 33.3%; max-width:640px; position: absolute; left: 6.7%; right: 60%; bottom: 10%; z-index: 3;}

/*==============section7==================*/
#section7{background: url(../images/section7-bg.jpg) no-repeat top right; background-size: contain;}
#section7 .grid-5-12{background-color: #050b1b;height: 100%;}
#section7 .grid-4-12{background-color: #050b1b;height: 100%;}
#section7 .text-box{width: 65%; max-width: 615px; display: block; margin: 20% auto;}

/*==============section8==================*/
.location2{height: 100%; max-width:1470px; overflow: hidden; background: url(../images/location-img.jpg) no-repeat center/cover;}
#section8 .text-box img{width: 80%; max-width: 740px;display: block;margin: 20% auto;}

/*==============section9==================*/
#section9 {background-color: #050b1b;}
/*============section1===============*/
/*#page0,#page1{ background:url(../images/page1.jpg) no-repeat center; background-size: cover;}*/
/*.pic0-1{ position: relative; width: 100%; max-width: 539px; margin: 0 auto; top: 0; animation-delay: 1s;}*/
.pic0-1{position: relative; width: 33.3%; margin: 0 auto; top: -10%; /*animation-delay: 1s;*/}
.pic0-1 img{ width: 100%; max-width: 539px;}
.transition-1s{ -webkit-transition: all 1000ms ease-out; -o-transition: all 1000ms ease-out; -moz-transition: all 1000ms ease-out; transition: all 1000ms ease-out;}
#section1{background: url(../images/page1.jpg) no-repeat top left; background-size: cover;}

/*============info===============*/
#info .grid-5-12,.iframe-googlemap{height: 100%;}
#info .text-box{width: 75%; max-width: 600px; display: block; margin: 30% auto 10% auto;}
.iframe-googlemap{position:relative;display: block;overflow: hidden;}
.iframe-googlemap iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
.button-box{width: 100%;}
hr{background-color:#e84709;width: 75%; height:1px; border:none;}
.button-box a:hover{background: #fff; border: #e84709 1px solid;}
.button-box a:hover span{color: #e84709;}
.button-web{background: #e84709;border: #e84709 1px solid; padding: 15px;display: table;margin: 0 auto;position: relative;top:-35px;}

/*============form===============*/
#form{background: url(../images/form-bg.jpg) no-repeat top left; background-size: cover;}
.content-mail{text-align:left; padding:0 0;}
form { position: relative; display: block; width:100%; margin: 0 auto; padding-bottom:30px;}
form .input-column,form .input-row {
	position: relative;
	display: block;
	line-height: 0;
	margin: 0 0.8% 8px 0.8%;
	width: 48%;
	color: #000;
	float: left;
	border: solid 1px #ddd;
	min-height: 46px;
}
form .input-button{ position: relative; display: block; margin:0 0.8% 8px 0.8%; width:98%; text-align:center; float:left;}
form .input-row{ width:98%; clear:both;}
form label { position: absolute; width: 100px; height: 46px; line-height: 46px; display: block;}
form input[type="text"], form input[type="password"], form select, form textarea, .input-box{
	line-height: 20px;
	padding-top: 13px;
	padding-bottom: 13px;
	height: 46px;
	width: 100%;
	padding-left: 105px;
*padding:13px 0 13px 30%; *height: 20px; *width: 70%; 	background-color: #FFF;
	border: solid 1px transparent;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
form textarea { height: 214px; line-height: 24px; padding-top: 8px;}
form select {  width: 80%; margin-left: 19%; line-height: 46px; padding:0;}
.input-box{line-height: 24px; padding-top: 8px;height: inherit; min-height:50px;}
form small { font-size: 16px; width: 15px; display: inline-block; color:#006f68; font-weight:bold;text-align: center; padding-left: 5px;}
form input:focus, form textarea:focus, form select:focus { border: solid 1px #e96e30;}
form input.error, form textarea.error, form select.error { border: dotted 2px #e96e30; background-color:#ffece2; }
.rand-img { position: absolute; right: 1px; bottom:1px; width:110px; height:44px;cursor: pointer;}
.input-button input[type="submit"]{ width:100%; margin-top:15px;}
.input-button input[type="reset"]{filter: alpha(opacity=80); opacity: 0.8; width:48.5%; margin-right:1%;}
input[type="reset"], input[type="submit"],input[type="button"],input[type="file"]{ display: inline-block; min-height: 20px; line-height:20px; padding:13px 25px; cursor: pointer;background-color:#000;  min-width: 120px; letter-spacing: 0.2em; font-weight:bold; color:#fff;}
input[type="reset"]:hover, input[type="submit"]:hover, input[type="reset"]:focus, input[type="submit"]:focus,input[type="button"]:hover{ background-color:#e96e30;}
.form-title{ text-align: center; font-size: 36px; margin-bottom: 30px; color:#C60;}
#result{ text-align: center;}
/*============pswp===============*/
.pswp__bg { opacity: 0.85 !important; }
.pswp__caption__center { font-size: 15px !important; }
/*============owl===============*/

.owl-prev, .owl-next{ position:absolute; display:block; top:50%; height:50px; width:50px; margin-top:-25px; z-index:1; text-align:center;font-size:18px; color:#fff;filter: alpha(opacity=80); opacity: 0.8; -webkit-border-radius: 30px; -moz-border-radius: 30px; border-radius: 30px;}
.owl-prev .fa, .owl-next .fa{line-height: 50px;}
.owl-prev:hover, .owl-next:hover, #portfolio-list .owl-prev:hover, #portfolio-list .owl-next:hover{filter: alpha(opacity=100); opacity: 1; color: #fff;}
.owl-prev{left:0px;}
.owl-next{right:0px;}
.owl-prev i, .owl-next i{font-size: 45px;}
/*.owl-carousel.off {display: block;}*/
.owl-prev.disabled, .owl-next.disabled{filter: alpha(opacity=0); opacity: 0;}
.owl-button{position: absolute; left:10px; bottom:40px; z-index:3;}
.owl-button a{ display:block; width: 50px; padding-top:8px; height: 42px; overflow: hidden; font-size:14px; text-align:center;color: #fff;}
.owl-button i{ font-size:10px; width:16px; height:16px; line-height:16px; border: solid 2px #fff; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;}
.owl-stage {display: -webkit-box;display: -moz-box;display: -ms-box;display: box;}
.owl-carousel.off {display: block;}
.owl-prev.disabled, .owl-next.disabled{filter: alpha(opacity=0); opacity: 0;}
.owl-dots { text-align: center; -webkit-tap-highlight-color: transparent;position: absolute; bottom:0; width: 100%;}
.owl-dots .owl-dot {display: inline-block; zoom: 1; *display: inline; }
.owl-dots .owl-dot span { width: 5px; height: 5px; margin: 10px 5px; background: transparent; display: block; -webkit-backface-visibility: visible; transition: opacity 200ms ease; border: solid 2px #fff;-webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%;}
.owl-dots .owl-dot.active span, .owl-dots .owl-dot:hover span { background: #FFF; width: 5px; height: 5px; margin: 10px 5px;}
/*============jquery.fullPage===============*/
.fp-section{overflow: hidden;}
.fp-tableCell{ position: relative;overflow: hidden; }
.full-height .fp-tableCell{ display:block; }
#fp-nav ul li a span, .fp-slidesNav ul li a span{ background: #e84709;}
.fp-controlArrow{width: 40px; height: 40px; border-radius:50%; color: #fff; text-align: center; line-height: 40px;}
.fp-controlArrow.fp-next, .fp-controlArrow.fp-prev{border-width:2px;border-color:#fff;width: 40px;}
/*============ie===============*/
.ie { position: fixed; display: block; top: 0; left: 0; z-index: 200; height: 100%; width: 100%; background:#333; }
.ie-content { position: relative; display: block; margin: 0 auto; margin-top: 3%; width: 90%; max-width: 600px; height: 300px; background-color: #fff; padding: 3%; border: solid 1px #ddd;}
.ie h1,.ie p { margin-bottom: 10px; }
.ie-close { position: absolute; display: block; width: 50px; height: 35px; right: 0; top: 0; text-align: center; padding-top: 15px; }
.ie , .ie a{color:#000;}
.ie a:hover{text-decoration: underline;}
.lightbox-bg{ position: fixed; display: block; top: 0; left: 0; height: 100%; width: 100%;}


@media screen and (orientation:portrait) {

/*============main===============*/
}
@media screen and (orientation:landscape) {
}
@media screen and (max-width: 1700px){
	
	#section5 .text-box img{margin: 0 auto;}
	#section5 .text-box::after{background-position: center bottom;}
}
@media screen and (min-width: 1000px)and (max-width: 1400px)and (max-height: 600px){
	
	#section5 .text-box img{margin: 0 auto;}
	#section5 .text-box::after{height: 52%;}
}
	
@media screen and (max-width: 1500px)and (max-height: 1100px){
	
.video-full-wrapper .mb_YTPlayer{top: 100px; padding-bottom: 52.08%;}
#section2 .text-box{width: 80%;}
#section5 .text-box::after{/*height: 50%;*/background-position: center bottom;}
#section7{background-size: cover;background-position:45px;}
}

@media screen and (max-width: 1200px), (max-height: 650px){
	#section5 .text-box::after{/*height:50%;*/ background-size: 90%;}
}
@media screen and (max-width: 650px),(min-height:1000px) and (orientation:portrait) {
.mobile-hide{ display:none !important;}
.pc-hide{display: block!important;}
.grid-1-12, .grid-2-12, .grid-3-12, .grid-4-12, .grid-5-12, .grid-6-12, .grid-7-12, .grid-8-12, .grid-9-12, .grid-10-12, .grid-11-12, .grid-3-8, .grid-5-8, .grid-1-2{ float: none; width: 100%; }
/*============owl===============*/	
.owl-prev i, .owl-next i {font-size: 30px;position: absolute; top: 25%; bottom: 25%; left: 0; right: 0;}

/*============mb_YTPlayer===============*/	
	#header{top: 3%;}
	.logo{margin: 0 auto;width: 50%; left: 0; right: 0; top: 80px;}
.video-full-wrapper .mb_YTPlayer{top: 30%;}
	
/*============#section2===============*/
#section2 .text-box img{width: 100%;}
#section2 .img-slide{width: 100%;}
#section2 .text-box{float: none; margin-top: 5%;}
	
/*============#section3===============*/
.location-img2 .img-box{width: 100%; }
#section3 .text-box{width: 80%; float: none;margin: 10% auto;background: none;}
#section3 .text-box img,#section4 .text-box img{width: 100%; max-width: 855px;margin: 10% 0;}
#section4 .text-box img{max-width: 848px; }
/*============#section4===============*/
.build{max-width: 1000px;max-height: 1112px; height: 68.3%; overflow: hidden;margin: 0 auto;background: url(../images/build-mb-img.jpg) no-repeat center/cover; }
#section4 .text-box{width: 80%; margin: 0 auto;}

/*============#section5===============*/
#section5 .text-box::after{background: none;}
#section5 .text-box{height: auto;margin: 10% auto;}
#section5 .text-box img{margin: 0 auto;}
#section5 .img-caption,#section6 .img-caption{padding: 10px; right: 0;}
#section5 .img-caption span,#section6 .img-caption span{font-size: 18px;}

/*============#section6===============*/
#section6 .title-en{width: 55%;max-width: 636px; right: 0;bottom: 0;position: relative;margin: auto auto 5% 10%;}	
#section6 .img-caption{width:auto; bottom: 0;}
	
/*============#section7===============*/
#section7{background:0; background-color: #050b1b;}
.pic-box img{width: 100%; max-width: 1000px;display: block; margin: 0 auto;}
#section7 .grid-5-12{width: 100%;height: auto;padding: 10% 0;}
#section7 .grid-4-12{width: 100%;height: auto;padding: 10% 0;}
#section7 .text-box{margin: 0 auto;}

/*============#section8===============*/
.location2{/*max-width: 1000px;max-height: 1112px; height: 68.3%;*/ position:absolute; top:0; overflow: hidden; /*margin: 0 auto; */background: url(../images/location-mb-img.jpg) no-repeat center/cover; background-size:contain; background-position:bottom;}
#section8 .grid-4-12{width: 80%; margin: 0 auto; z-index:3;}
/*#section8 .text-box{width: 80%; margin: 0 auto;}*/
/*#section8 .text-box img{max-width:65%;margin-top: 5%;}
#section8 .text-box img{width: 60%;margin-top: 5%;}*/
/*#section8 .text-box{float: none; margin-top: 5%;}
#section8 .text-box img{max-width:75%; margin: 25% auto 15% 20%;}*/

/*============#section1===============*/
#section1{max-width: 1000px;max-height: 1112px; height: 68.3%; overflow: hidden;margin: 0 auto;background: url(../images/page1-mb.jpg) no-repeat center/cover; }
/*#page0{ background-image:url(../images/page1-mb.jpg); background-repeat:no-repeat;}*/
.pic0-1{ width: 80%; /*position: absolute; left:5%; top:5%;*/ animation-delay: 1s;}

/*============#info===============*/
#info .grid-5-12{height: auto;}
.iframe-googlemap{height: 50%;}
	
}
@media screen and (max-width: 850px) and (orientation:landscape) {
	.video-full-wrapper .mb_YTPlayer{top: 0;}
	#section2,#section3,#section4,#section5,#section6{margin-top: 70px;}
	#section4 .text-box img{width: 50%; margin:15% auto;}
	#section6 .title-en{bottom: 20%;}
	#section6 .img-caption{bottom: 15%;}
	#section7{background-position: 60px top;}
    /*#section8 .text-box img{width: 50%; margin:15% auto;}*/
	
}
@media screen and (max-width: 650px) and (orientation:landscape) {
	.logo{display: none;}
}

@media screen and (max-width: 360px){
	.logo{width: 100%;top: 50px;}
}