@charset "utf-8";
@import url(https://fonts.googleapis.com/css?family=Lato);
@import url(https://fonts.googleapis.com/css2?family=Lato:wght@300;400;700&family=Noto+Sans+TC&family=Noto+Serif+TC:wght@400;600&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: 100%; 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 Sans TC", Arial, Helvetica, "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", Meiryo, "sans-serif"; font-size: 1em; color: rgb(255, 255, 255); word-wrap: break-word; background: #ffffff; }
.font-en, #header small, .text-en, .load-box,.img-caption,h7{font-family: "Lato","Noto Sans TC", Arial, Helvetica, "儷黑 Pro", "LiHei Pro", "微軟正黑體", "Microsoft JhengHei", Meiryo, "sans-serif";}
p,.small-text { font-family: "Noto Sans TC";  font-size: 23px; line-height:40px; letter-spacing: 3px; margin-top: 35px;  color: #333;}
p span, .br, h1 span, h2 span { display: inline-block; }
::selection { background: #d7ded3; color: #d7ded3; }
a { color: #fff;}
a:hover  { color: #f5da66; }
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: #f5da66; 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,h2{transform: scale(1,1.10);letter-spacing: 3px;}
h1 {font-size: 60px;line-height:80px; font-weight:880;position: relative; color: #fff; }
h2 { font-size: 52px;}
h3 { font-size: 26px;}
h4, h5, h6 { font-size: 1em; }
.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;}

/*============base===============*/
body, html { width: 100%; }
.wrapper {position:relative; width: 100%; max-width: 1920px; margin: 0 auto;}

/*============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%; }
.embed-responsive{position: absolute;}
#video-box{/* width: 1920px !important;*/height: 100vh !important; position: absolute; display: block; left: 0; right: 0;}
/*============header===============*/
#header { position: fixed; display: block; top:80%; right:1%; z-index: 101; -webkit-transition: all 1000ms ease-in-out; -o-transition: all 1000ms ease-in-out; -moz-transition: all 1000ms ease-in-out; transition: all 1000ms ease-in-out;}
.button-icon a{position: relative; display: block; width: 50px; height: 50px; overflow: hidden; color: #FF6400; background-color: #E6E6E6; text-align: center; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius: 50%; filter: alpha(opacity=80); opacity: .8; 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: #FF6400;filter: alpha(opacity=100); opacity: 1; color: #fff;}
.button-icon a:hover i{ margin-top: -50px;}
.icon_com{display: block; margin: 0px auto;}
.icon_com img{width: 30px; vertical-align: middle;}

/*============load===============*/
.load-box{/*background-image: url('../images/logo-2.png');*/ background-color:rgb(179 87 59 / 48%); 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===============*/

.text-pre{color: #f5da66;}
.text-box{ position: relative;}
img{width: 100%;}
/* .section:not(.section:first-child) .fp-tableCell,.section:not(.section:first-child) {height: auto!important;} */
.fp-tableCell{display: flex;}
.pc-hide{ display: none !important;;}
.mobile-hide{display: block;}

/*============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: 0px; left:15px; padding:5px 15px; font-size: 18px; letter-spacing:1px; color: #fff; min-height: 35px; font-weight:400;text-shadow: 0 0 10px rgba(0, 0, 0, 100),0 0 10px rgba(0, 0, 0, 100) ; 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.03); -webkit-transform: scale(1.03); -moz-transform: scale(1.03); -o-transform: scale(1.03); transform: scale(1.03); }
.icon-box span { position: absolute; display: block; top: 0px; right: 0; bottom: 0; left: 0; margin: auto; width: 60px; height: 60px; background:rgb(255,100,0,.62); -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;}
/*============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;}

/*==============section1==================*/
#section1,#section1 .fp-tableCell{overflow:hidden;}
#section1 .left{display: flex;}
#section1 .right{background-color: #FF6400;}
#section1 .logo{width: 65%; display: flex; flex-direction: column; align-items: center; justify-content: center;margin: -100px auto 0 auto;}
#section1 .woman-img{width: 98%; position: absolute; bottom: 0; right: -20px;}

/*==============section2==================*/

#section2 .fp-tableCell,#section3 .fp-tableCell,#section4 .fp-tableCell{height: auto!important;}
#section2 .text-box{width: 25%; position: absolute; z-index: 2; right: 70px; top: 50px;}
#section2 .img-slide .img-box{width:100%; height: auto; }
#section2 .mobile-map .img-box{width: 1920px; height: auto; }
#section2 .mobile-map {overflow-x:auto;}
#section2 .sky_mouse{position: absolute;z-index: 2;width: 80px;height: 80px;border-radius: 50px;background-color: rgb(255 102 0 / 47%);display: flex;justify-content: center;align-items: center;bottom: 20px;left: 50%;transform: translate(-50%, -50%);}
#section2 .sky_mouse img{width: 50px;}
/*==============section3==================*/

#section3 .text-box{width: 40%; position: absolute; z-index: 2;display: flex; align-items: flex-end; }
#section3 .text,#section3 .color{display: flex;}
#section3 .text{width: 15%;}
#section3 .color{width: 18%; margin-right: 10%; }
#section3 .lightBox-img{height: 100%; display: flex;align-items: center;}
#section3 .img-box{height: 0; padding-bottom: 50.5%;}
.text-box1,.text-box2{left: 13%; right: 87%; top: 8%;}
.text-box3,.text-box4,.text-box5{left: 30%;right: auto;justify-content: center;top: 8%;}
.text-box4{top: 28%;}
.text-box5{top: 8%; right: 7%; left: auto;}

/*==============section4==================*/
#section4 .right{width: 31%;}
#section4 .left{width: 69%; position: relative; height: 0; padding-bottom:50%;}
#section4 .left .img-caption{right: 15px; left: auto;}
#section4 .public-img2:first-child .img-box {margin-top: 0;}
#section4 .public-img2 .img-box{width: 97%; margin:.5% 1.5%;}
#section4 .text-box{position: absolute; width: 9%; top: 8%; right:20%;}
/*==============section5==================*/
#section5{background-color: #E6E6E6;}
#section5 .text-box{width: 19%; margin: 70px auto 50px auto;}
#section5 .con{width: 100%; display: flex;}
#section5 .con .img-list{display: flex; margin: 0 5px;}
#section5 .text-box2{width: 85%; margin: 50px auto 50px 15px;}

/*==============infro==================*/
#info{background-color: #d5b39d;}
/* #info .grid-6-12{width: 100%;} */
#info .grid-large{display: flex;align-items: center;}
#info .grid-6-12:first-child {display: flex;align-items: center; flex-direction: column; }
.infro{display: block;margin-bottom: 30px;}
.infro-box{width: 55%;}
/* .form iframe{height: 100vh;} */
#info .iframe-googlemap,#info iframe,#info .tel-btn{width: 100%;}
#info .tel-btn{margin-top: 8%; display: block;}
#info .infro{width: 70%; display: block; margin: 0 auto 10%;}
#info .box{display: flex; align-items: center;overflow: hidden; margin-top: 70px;}
#info .text-side{width: 40%; display: flex; flex-direction: column; align-items: center; margin: 0 25% 0 auto;}
#info h8{color: #3e3a39; font-weight: 450; text-align: center; font-size: 20px; line-height: 45px; display: block;}
#info .form-box{width: 70%;border: #fff solid 1.5px; padding: 5%;}
.logo_info{width: 70%; margin: 0 auto 50px;}

.tel-text{float: left;}
#info a.phone_btn,#info a.button_map{width: 200px; height: 45px;background-color: #ededee;  display: block; margin: 0 auto; }
#info a.phone_btn:hover,#info a.button_map:hover{display: block;background-color: #3e3a39;  transition: 1s;}
#info a.phone_btn h4,#info a.button_map h8,#info a.button_map i.icon{letter-spacing: 2px;  transition: 1s; }
#info a.phone_btn:hover h4,#info a.button_map:hover h8,#info a.button_map:hover i.icon,.submit_btn:hover{color: #fff; transition: 1s;}
form { position: relative; display: block;}
form .input-column,form .input-row,form .input-button,form .select-row { position: relative; display: block; line-height:0; margin:0 0.8% 20px 0.8%; width:48%; float:left; min-height: 46px; color:#7a3f17;}
form .input-row,form .input-button,form .select-row{ width:98%; clear:both;}
form .input-button{ margin-top: 40px;display: flex; justify-content: center; align-items: center;}
form select,form label,form input[type="text"], form input[type="password"], form select, form textarea, .input-box{font-size: 18px;}
form label {  position: absolute; width:30%; height: 46px; line-height: 46px; display: block;}
form input[type="text"], form input[type="password"], form select, form textarea, .input-box{ height: 46px; width: 100%; padding-left: 100px; background-color:transparent; border-bottom: solid 1px #FFECE0; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; color: #333;}
form textarea { height: 150px; line-height: 24px; padding-top: 13px;}
form select {  width: 75%; float: right; line-height: 46px; padding:0;}
.input-box{line-height: 24px; padding-top: 8px;height: inherit; min-height:50px;}
form small { font-size: 18px; width: 15px; display: inline-block; color:#ffffff; font-weight:bold;text-align: center; padding-top: 0;}
form input:focus, form textarea:focus, form select:focus { border-bottom: solid 1.8px #000;}
form input.error, form textarea.error, form select.error { border-bottom: solid 1px #CC3333; }
img.rand-img { position: absolute; right: 0px; bottom:1px; width:90px; height:49px;cursor: pointer;}
.input-button input[type="submit"]{ float: right;}
.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"]{float: none; margin: 0 auto;display: inline-block; min-height: 20px; line-height:20px; padding:13px 0;width:100%; text-align: center; cursor: pointer;font-size: 20px; letter-spacing: 10px; font-weight: 550; color:#333; background:#FFf;box-shadow: rgba(50, 50, 93, .2) 0px 2px 5px -1px, rgba(0, 0, 0, .2) 0px 1px 3px -1px;}
input[type="reset"]:hover, input[type="submit"]:hover, input[type="reset"]:focus, input[type="submit"]:focus,input[type="button"]:hover{background:#FF6400; color: #fff;}

#result,#result2{color: #333; font-size: 18px;}
#result h6,#result2 h6{font-size:36px; font-weight: 600; line-height: 50px!important;} 
@-webkit-keyframes autofill { to {color: #fff; background: transparent;} }
input:-webkit-autofill {-webkit-animation-name: autofill;-webkit-animation-fill-mode: both;}
.info-text{float: left;}
.info-tel:hover{border-bottom: solid 1px #D9E476;}
.input-button{margin: 10px 0; background: #5e7948;text-align: center;}

#info .form .text-box h7{font-size: 24px;text-align: center;display: block;  }
#info .form .text-box{display: block;  margin:0 auto 40px;}
.infro-map{width: 100%;margin: 25px auto 0; border: solid 1px #b3b3b4;}
.submit_btn{width: 100%; background-color:#fff; color: #FF6400; line-height: 20px;font-size: 20px;font-weight: 550;letter-spacing: 10px; }
.submit_btn a{color:#FF6400;}
.submit_btn:hover{cursor: pointer; background-color: #FF6400; }
.submit_btn:hover a{color: #fff;}
.small-text{font-size: 16px;  margin: 5px auto; letter-spacing: 1px;  line-height: normal; color: #555; text-align: justify;}
.small-text-con{ display: flex; flex-direction: row; justify-content:left;width: 100%; box-sizing: border-box;}
.small-text-con li{margin-right: 15px;}
.right_text{ margin-top: 15px; line-height: 20px;}
.right_text input[type="checkbox"]{margin-right: 10px;}
.right_text a,.right_text i{color: #7a3f17; }
.right_text a:hover{color: rgb(0, 0, 0); }
.copyright{position: absolute; width: 100%; bottom: 10px;}
.copyright img{width: 300px;  display: block; margin: 0 auto;}
/*============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: #FF6400;}
.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) {
	
	/* #section1 .box2{margin: 30% auto 0;} */
	
}
@media screen and (orientation:landscape) {
	

}
@media screen and (max-width: 1400px) and (orientation:landscape) {

	/* #section1 .logo{width: 28%;right: 14%;}
#section1 .content {width: 11%;} */
}




@media screen and (max-width: 1100px){
.mobile-hide{ display:none!important;}
.pc-hide{display: block!important;}
.grid-large,.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%; }
.fp-tableCell,.section {height: auto!important;}
.fp-tableCell{display: block;}

/* #section2 .text-box img,#section3 .text-box img,#section4 .text-box img,#section5 .text-box img,#section6 .text-box img{width: 105%; margin-left: -2.5%;} */

/*============#section1===============*/
#section1 .fp-tableCell,#section1.section{height: 130vh!important;}
#section1,#section1 .fp-tableCell{overflow: hidden;}
#section1 .left{height: 70vh;}
#section1 .right{height: 30vh; position: absolute; bottom: 0;}
#section1 .logo{ display:block; margin: 70px auto;}
#section1 .woman-img{position: relative;width: 100%;height: 100%; right: auto;}
#section1 .woman-img img{position: absolute; width: 90%;right: 0; bottom: 0;}
/* #section1 .fp-tableCell, #section1.section{height: 1400px!important;} */

/*============#section2===============*/
#section2 .text-box{width: 70%; right: 15%;}

/*============#section3===============*/

#section3 .text-box{width: 75%; left: 12.5%; right: 0; justify-content: space-between;align-items: flex-start;}
#section3 .text{width: 25%;}
#section3 .color{margin: 0; width: 28%;}
#section3 .img-box{height: auto; padding-bottom: 0;}
.img-caption{bottom: 20px;}
.text-box4{top: 8%;}
/*==============section4==================*/

#section4 .left{width: 100%; height: auto; padding-bottom: 0;}
#section4 .text-box{width: 50%; right: 25%;}
#section4 .right{width: 80%; margin: 50px auto;}

/*==============section5==================*/
#section5 .text-box{width: 53%; }
#section5 .con{flex-wrap: wrap; justify-content: center;}
#section5 .con .img-list{width: 30%; margin-bottom: 10px; box-sizing: border-box;}
#section5 .con .img-list:nth-child(n+4){margin-bottom: 0;}
#section5 .text-box2{margin-left: auto;}
/*==============infro==================*/

#info .grid-6-12 { margin: 140px auto;}
#info .grid-6-12:last-child{margin-top: 0;}
#info .infro-box{width: 70%;}
#info .form{width: 80%; margin: 0 auto;}
#info {width: 100%;}
#info .grid-large{flex-direction: column;}
#info,#info .fp-tableCell{height: auto!important;}
.infro-box{width: 70%;}
.small-text-con{flex-direction: column;}

#info h7{margin-bottom: 0;}
/* .bg-img{left: -300px; top:30vh;} */
.brand{ width: 60%;}
.form{width: 100%; margin: 90px auto 140px;}
#info .text-side{width: 80%; margin: 0 auto;}
#info .box{ flex-direction: column; margin-top: 90px;}
/* #info .text-box{width: 100%;} */
.logo_info{ margin-bottom: 100px;}
/* .map{width: 80%;} */
#info .form-box{float: none; width: 80%; margin: 0px auto 100px;}
#info .logo-black{margin-top: 0px; left: auto; position: relative;}
#info h1{font-size: 36px;}
#info .logo-side h1{font-size: 28px;}
#info .logo-side{margin-bottom: 210px;}


}

@media screen and (min-width:420px) and (max-width:1100px) and (max-height:1000px) {
	#section1 .woman-img img{position: absolute;  width:60%; right: 15%;  bottom: 0;}
}

@media screen and (max-height: 1000px) {
	#section1 .fp-tableCell, #section1.section{height: 100vh!important;}
}


@media screen and (max-height: 800px) {
	#section1 .fp-tableCell, #section1.section{height: 110vh!important;}
}

@media screen and (max-width: 1100px) and (max-height: 800px) and (orientation:landscape) {
	#section1 .fp-tableCell, #section1.section{height: 1400px!important;}
}

@media screen and (max-height: 380px) {
	#section1 .fp-tableCell, #section1.section{height: 1200px!important;}
	#section1 .left{height: 70%;}
#section1 .right{height: 30%; }
#section1 .woman-img img{position: absolute; width:70%; right: 0; bottom: 0;}
	#info .form{width: 90%;}
}



@media screen and (max-width: 600px) {
	h1{font-size: 50px;line-height: 66px;}
	h2{font-size: 43px;}
	p{font-size: 20px; line-height:33px; margin-top: 29px;}
	#section3 .text-pre{margin-top: 60px;}
	form select, form label, form input[type="text"], form input[type="password"], form select, form textarea, .input-box {
		font-size: 16px;
	}
}

@media screen and (max-width: 450px) {
	#info .form{width: 90%;}
	#info .form-box{width: 100%; box-sizing: border-box;}
	.copyright img{width: 50%;}
	form select{width:70%;}
}


@media screen and (max-width: 400px) {
	h1{font-size: 41px;line-height: 54px;}
	h2{font-size: 34px;}
	p{font-size: 16px;line-height:27px; margin-top: 24px;}
	#section3 .text-pre{margin-top: 50px;}

	/* #section1 .box2{width: 70%; margin-top: 30%;}
	#section1 .box1{width: 70%;} */
}

@media screen and (max-width: 360px){
	
}