@charset "utf-8";
@import url('https://fonts.googleapis.com/css?family=Gilda+Display|Lato:400,700|Noto+Serif+TC:400,700&display=swap');
@import url('ElegantIcons/style.css');
@import url('pe-icon-7-stroke/pe-icon-7-stroke.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; }
img {image-rendering:-webkit-optimize-contrast; /*fixd Chrome Img Blur*/-webkit-backface-visibility: hidden; -ms-transform: translateZ(0);-webkit-transform: translateZ(0);transform: translateZ(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, .hidden, a:before, a:after, .owl-prev i, .owl-next i, .owl-dots .owl-dot span, input, textarea, select, a i, a b, .icon-box, #header, #header:before, #nav, #nav strong, .nav-toggle, b:before, strong:before, .logo, .contact-box, .text-more:before, .news-list .grid-item:before, .justified-gallery > a > .caption, .justified-gallery > a > .caption.caption-visible{ -webkit-transition: all 250ms ease-in; -o-transition: all 250ms ease-in; -moz-transition: all 250ms ease-in; transition: all 250ms ease-in; }
.back-box{ -webkit-transition: all 1000ms ease-out; -o-transition: all 1000ms ease-out; -moz-transition: all 1000ms ease-out; transition: all 1000ms ease-out !important;}
/*.transition-1s,*/ .img-box img, .img-over-box img, .justified-gallery img{ -webkit-transition: -webkit-transform 1000ms ease-out !important; -o-transition: -o-transform 1000ms ease-out !important; -moz-transition: -moz-transform 1000ms ease-out !important; transition: transform 1000ms ease-out !important;}
.grid-aside, .img-over-box{ -webkit-transition: top 1000ms ease-out; -o-transition: top 1000ms ease-out; -moz-transition: top 1000ms ease-out; transition: top 1000ms ease-out !important;}
.transition-5s{ -webkit-transition: all 5000ms ease-out; -o-transition: all 5000ms ease-out; -moz-transition: all 5000ms ease-out; transition: all 5000ms ease-out;}
.img-bg .zoomout, .icon-box, .page a:hover { -ms-transform: scale(1.3);-webkit-transform: scale(1.3);-moz-transform: scale(1.3);-o-transform: scale(1.3);transform: scale(1.3);}
a:hover .img-box img, a:hover .img-over-box img, a:hover .back-box, .justified-gallery a:hover img{-ms-transform: scale(1.1);-webkit-transform: scale(1.1);-moz-transform: scale(1.1);-o-transform: scale(1.1);transform: scale(1.1);}
.img-box img, .img-over-box img, .img-bg .loaded, a:hover .icon-box, .back-box{ -ms-transform: scale(1);-webkit-transform: scale(1);-moz-transform: scale(1);-o-transform: scale(1);transform: scale(1);}
.button-top:hover, .share-button a:hover, .button-icon-text a:hover{-ms-transform: translate(0,-3px); -moz-transform: translate(0,-3px); -webkit-transform: translate(0,-3px); -o-transform: translate(0,-3px); transform: translate(0,-3px);}
.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(12n+1) {-webkit-animation-delay: 0.2s;  animation-delay: 0.2s;}
.delay-list li:nth-child(12n+2) {-webkit-animation-delay: 0.4s;  animation-delay: 0.4s;}
.delay-list li:nth-child(12n+3) {-webkit-animation-delay: 0.6s;  animation-delay: 0.6s;}
.delay-list li:nth-child(12n+4) {-webkit-animation-delay: 0.8s;  animation-delay: 0.8s;}
.delay-list li:nth-child(12n+5) {-webkit-animation-delay: 1.0s;  animation-delay: 1.0s;}
.delay-list li:nth-child(12n+6) {-webkit-animation-delay: 1.2s;  animation-delay: 1.2s;}
.delay-list li:nth-child(12n+7) {-webkit-animation-delay: 1.4s;  animation-delay: 1.4s;}
.delay-list li:nth-child(12n+8) {-webkit-animation-delay: 1.6s;  animation-delay: 1.6s;}
.delay-list li:nth-child(12n+9) {-webkit-animation-delay: 1.8s;  animation-delay: 1.8s;}
.delay-list li:nth-child(12n+10) {-webkit-animation-delay: 2.0s;  animation-delay: 2.0s;}
.delay-list li:nth-child(12n+11) {-webkit-animation-delay: 2.2s;  animation-delay: 2.2s;}
.delay-list li:nth-child(12n+12) {-webkit-animation-delay: 2.4s;  animation-delay: 2.4s;}
.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%;}
.particles { position:fixed; width: 100%; height: 100%; z-index: 0;}
/*============iframe===============*/
.iframe-16x9,.plyr__video-embed{ position: relative; padding-bottom: 56.25%; height: 0; overflow: hidden; }
.iframe-4x3 { position: relative; padding-bottom: 75%; height: 0; overflow: hidden; }
.iframe-16x9 iframe, .iframe-4x3 iframe, .plyr__video-embed iframe, .full-video iframe{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.full-video { position: relative;width: 100%; height: 100%;}
/*.iframe-16x9:before{ content: ''; position: absolute; top:0; right: 0; width: 100%; height: 100%; border: solid 2px #fff; z-index: 2;}*/
/*==============text-ver==================*/
.text-ver{ writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl; white-space: nowrap;}
.text-hor { writing-mode: lr-tb; -ms-writing-mode: lr-tb; -webkit-writing-mode: horizontal-tb; -moz-writing-mode: horizontal-tb; -ms-writing-mode: horizontal-tb; writing-mode: horizontal-tb; }
/*============grids===============*/
.grid-large, .grid-middle, .grid-small, .grid-max, .grid-min, .grid { width: 85%; margin: 0 auto; position: relative; }
.grid-max { max-width: 1640px; }
.grid-large { max-width: 1540px;}
.grid-middle { max-width: 1000px;}
.grid-small { max-width: 600px;}
.grid-min { 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-space{ -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding-right: 5%;}
.grid-right{ float: right;}
/*============style===============*/
body { font-family:"Lato", Arial, Helvetica, "微軟正黑體", "Microsoft JhengHei", "儷黑 Pro", "LiHei Pro", sans-serif; font-size: 1em; word-wrap: break-word; overflow-x: hidden; color: #fff; background: #ae272d;}
/*page-transition*/
.particles,#about .wrapper{background: #a9aaab; }
@media screen and (max-width: 980px){#about #footer {background: #a9aaab; }}
/*page-transition*/
.text-font, h1{ font-family: "Noto Serif TC", Times, "Times New Roman", "儷宋 Pro", "LiSong Pro Light", "宋体", SimSun, serif;}
.title-en{ font-family: "Gilda Display", Times, "Times New Roman", serif;}
p,.text0{ font-size: 1em; line-height: 1.75em; /*letter-spacing: 0.1em;*/ margin-bottom: 10px;}
p span, h1 span, h2 span, h3 span, h4 span, .br, li span, b span, em span{ display: inline-block; }
::selection { background: #ae272d; color: #fff; }
a { color: #fff; }
a:hover { color: #fff;}
p a { color: #ae272d; text-decoration:underline; }
p a:hover {background: #ae272d;color: #fff; text-decoration:none; }
strong { font-weight: bold; }
em, i { font-style: normal; }
big { font-size: 1.125em; }
small { font-size: 0.9375em; }
h1{font-size: 3.75em; line-height: 1.2em;}
h2{font-size:1.375em;line-height: 1.6em;}
h3 { font-size: 1em; line-height: 1.75em;}
h4, h5, h6 { font-size: 1em; }
.title1{font-size: 3.75em; }
.title2 {font-size: 2.8125em;}
.title3 {font-size: 1.875em;}
.title4 {font-size: 1.375em;line-height: 1.4em;}
.title5 { font-size: 1.25em;letter-spacing:0.7em;margin-left: 3px;}
.title6 {font-size: 1.5em; line-height: 1.4em;}
.text1 { font-size: 1em;}
.text2 { font-size: 0.9375em; line-height: 1.4em;}
.title-en{font-size: 85px;line-height: 80px;display: block; margin-left: -5px;white-space: nowrap;}
.text-year{display: block;font-size: 18px;line-height: 18px;font-weight: bold;}
.text-year-small{display: block;font-size: 12px; line-height: 30px;letter-spacing:5px;white-space: pre-line;}
.text-spacing-normal{letter-spacing:0em;}
.text-block{display:block; font-weight: normal;}
.color-white { color: #fff; }
.color-black {color: #000;}
.color1 { color: #ae272d; }
.color2 { color: #a9aaab; }
.color3 { color: #ccc;}
.color4 {color: #545556;}
.nowrap{ white-space: nowrap; text-overflow: ellipsis; overflow: hidden; width: 100%; }
.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;}
.align-left{ float: left;}
.align-right{ float: right;}
.align-center{ margin: 0 auto;}
.text-top{margin-top:15px;}
.text-bottom{margin-bottom:15px;}
.text-top2{margin-top:30px;}
.text-bottom2{margin-bottom:30px;}
.box-top{margin-top:50px;}
.box-bottom{ margin-bottom: 50px;}
/*============base===============*/
body, html { height: 100%; }
.wrapper { min-height: 100%; width: 100%; position: relative; overflow: hidden; }
.main { position: relative; /*padding-bottom: 50px; */width: 100%;}
#footer { position: relative; width: 100%; margin-top: -50px; min-height: 50px; z-index: 1;}
/*============nav===============*/
.logo { position: relative; display: block; width: 130px; height: auto; padding-top:30px; padding-left: 40px; float: left;z-index: 1;}
.logo img{ width:100%; height:auto;}
#header { position:absolute; display: block; top: -1px; left: 0px; z-index: 20; overflow: hidden; width:100%;min-height: 130px;}
#header:before{position: absolute; content: '';display: block; width: 100%; height: 130px;top:0;left: 0;background: url('../images/menu-bg.png') center bottom repeat-x;opacity: 0;}
#header:hover:before{opacity: 1;}
#nav{ position: relative; }
#nav li {position: relative; display: block; float: left; margin-left: 50px; }
#nav li a{ position:relative; display:block; width: 100%; color:#fff;}
#nav li a em{position: relative;font-size: 16px;z-index: 1;white-space: nowrap;}
#nav li > a strong{position: relative;display: block; font-size: 13px;opacity: 0;z-index: 1;}
#header:hover #nav li > a strong{opacity: .7;}
#nav li > a{ padding-top: 40px;height:50px;line-height: 18px;}
#nav li > a:before{position: absolute; content: '';display: block; width: 100%; height: 0px;top:0;left: 0;background: #ae272d;z-index: 0;}
#nav li.active > a:before,#nav li:hover > a:before{height: 3px;}
#nav li > a:hover:before{height:90px;}
#nav li a:hover{ color:#fff;}
#nav .subnav{display: none;}
#nav .subnav a{ font-size: 14px; line-height: 15px; padding: 10px 0; border-bottom: solid 1px #fff;opacity: .7;max-width: 100px;white-space: nowrap;text-overflow: ellipsis; overflow: hidden;}
#nav .subnav a:first-child{border-top: solid 1px #fff;}
#nav .subnav a:hover{opacity: 1;/*background:#ae272d;*/ }
#nav .subnav a:hover strong{padding-left: 5px;}
#header:hover #nav .subnav{display: block;}

.nav-toggle{position: fixed;display:block; right: 10px; top:0px; width: 20px; height: 0px; line-height: 20px;padding: 0px 15px; font-size: 16px; text-align: center; z-index: 21; cursor:pointer;opacity: 0;}
.nav-toggle:hover{/*background: #ae272d;*/}
.nav-toggle span ,.nav-toggle span:before ,.nav-toggle span:after{ display:block; width:100%; background:#fff; height:1px;}
.nav-toggle span{ position:relative; top:35%; }
.nav-toggle span:before ,.nav-toggle span:after{ content:''; position:absolute; }
.nav-toggle span:before{ top:-.3em; }
.nav-toggle span:after{ bottom:-.3em; }
body.active .nav-toggle span{ background:none; transition:background .3s .6s;}
body.active .nav-toggle span:before{ top:0; transform:rotate(135deg); transition:top .2s .1s,transform .2s .6s;}
body.active .nav-toggle span:after{ bottom:0; transform:rotate(225deg);  transition:bottom .2s .1s,transform .2s .6s;}
body.sticky .nav-toggle{opacity: 1; top:10px;padding: 15px;height: 20px;}
/*============footer===============*/
.footer-copyright { font-size: 12px;line-height: 20px;text-align: right; margin: 0 20px;padding: 15px 0;}
.footer-copyright li{display: inline-block; margin-left: 10px;}
.footer-design{display: inline-block;}
.footer-button a{ position: relative;display:inline-block; width:20px; height:20px; text-align:center; margin-left: 5px;}
.footer-button img{ width: 100%; height: auto;}
/*============html-edit===============*/
.html-edit { text-align:left; line-height: 1.65em;}
.html-edit a{ color:#fff; text-decoration:underline;}
.html-edit a:hover { color: #fff; background:#ae272d;text-decoration:none;}
.html-edit img { max-width: 100%; height:auto !important; }
.html-edit h1{ font-size: 1.25em;}
.html-edit li { list-style: outside; margin-left: 30px; }
.html-edit ul li { list-style-type: disc; }
.html-edit ol li { list-style-type: decimal; }
.html-edit p,.html-edit h1,.html-edit h2,.html-edit h3{ margin-bottom: 10px;}
.html-edit p{line-height: 1.75em; text-align: justify;}
/*============load===============*/
.load-box{ position: fixed; top: 0; left: 0; height: 100%; width: 100%; z-index: 200; overflow: hidden; font-size: 0; line-height: 0;background:#ae272d; -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===============*/
.img-bg { position: fixed !important; top: 0; left: 0; height: 100% !important; width: 100%; overflow: hidden; z-index: 0;}
.img-bg .img-bg-box,.full-box .img-box{ position: relative; top: 0; left: 0; height: 100%; width: 100%; background-position: center center; background-size: cover; }
.full-box{position: absolute; left: 0; top:0; height: 100%; width: 100%;overflow: hidden;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background-position: center center; background-size: cover;}
.full-box .grid-item{overflow: hidden;}
.content-page .full-box{ padding-right: 350px;}
.content-page .wrapper{background-color: #ae272d;}
.content-page .grid-min{width: 75%;clear: both;margin-bottom:50px; }
.content-page .title-box{padding-top:85px;margin-bottom: 40px;} 
.content-page #footer{background-color: #a21e24;margin-top: 0px; min-height: 30px;color:#ccc;}
.content-page #footer a{color:#ccc;}
.content-page .footer-copyright{padding: 7px 0;}
.content-page .button-icon, .content-page-full .button-icon{position:relative; margin-right: 20px; padding-top: 13px;float: right; margin-bottom: -10px;z-index: 21;}
.content-page-full .wrapper{background-color: #545556;}
#section-header{width: 350px;float: right; z-index: 21; }
.logo-box img{height: 100%;width: auto;}
.logo-box h1{font-size: 50px;}
#section-header .logo-box{text-align: center;}
#section-header .logo-box img{height: 70px;}
.img-bg-text{position: absolute;right: 3%;bottom:100px;text-align: right; }
.img-bg-text h2{margin-top: 5px;}
.content { position: relative; padding-top: 200px; margin-bottom: 190px; min-height: 220px;}
.content-small{ padding-top: 150px; margin-bottom: 150px;}
.content-container{max-width: 1200px;}
.content-container .img-list{margin-top: 20px;}
.grid-container{position: relative; display: block;}
.grid-content { position: relative; padding-right: 400px;}
.grid-aside{ position: absolute; width: 400px;right:0;top:0;}
.imgtext-container{ position: relative;width: 100%;background: #545556;}
.imgtext-box{ position: relative; display: block; background: #545556; }
.imgtext-box.full{width: 100%;}
.imgtext-box.full .text-box{position: absolute;bottom:5%;left:7.5%;}
.imgtext-box.full.right .text-box{left:auto;right:7.5%;}
.imgtext-box.normal{width: 85%; max-width: 1640px; margin: 150px auto;}
.imgtext-box.normal:first-child{margin-top: 0;padding-top: 150px;}
.imgtext-box.normal .text-box {float: left;width: 30%;margin-top: 13%;}
.imgtext-box.normal .img-over-box{float: right;width: 70%;}
.imgtext-box.normal.right .img-over-box{float: left;}
.imgtext-box.normal.right .text-box{padding-left: 3%;}
.imgtext-box.no-img .text-box{position: relative !important; float: none !important;left: auto !important; right: auto !important;width: 100% !important;margin: 0 !important;}
.skrollr .imgtext-box .img-over-box img{margin-top: -4%; margin-bottom: -4%;}
.text-box{ position:relative; display:block; float:left;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.grid-item{ position:relative; display:block;}

.text-more{position: relative;}
a .text-more, a.text-more{padding-bottom: 35px;}
a .text-more:before, a.text-more:before{ display: block;content: 'MORE'; color: #a9aaab; background:#fff;text-align: center;position: absolute; width: 60px;height: 20px; bottom: 0;left: 0; font-size: 12px; line-height: 20px;white-space: nowrap;letter-spacing: 0;}
a:hover .text-more:before, a.text-more:hover:before{ color:#ae272d;}

.img-caption{ position:absolute; display:block; bottom:0; font-size:0.95em; line-height: 1.4em; color:#fff; z-index:1; left:0; padding: 0 10px; width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; text-align: left;}
.img-box,.img-over-box{ position:relative; display: block; text-align:center; overflow:hidden; }
.img-box{background-position: center center; background-repeat: no-repeat; background-size:cover;}
.img-box img,.img-over-box img{ width:100%; height:auto;}
.img-box img{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto;}
.img-box.height img{ width:auto; height:100%; }
.video .img-box:before, .video .img-over-box:before, .justified-gallery .video:before{ content:''; background: url(../images/icon-video.png) center center no-repeat; position:absolute; display:block; height:100%; width:100%; z-index:1;}
.back-box{ position: absolute; display: block; top:0; left: 0; width: 100%; height: 100%; filter: alpha(opacity=0); opacity: 0; z-index:1;background-position: center center; background-repeat: no-repeat; background-size:cover; /*background-color: rgba(151,127,108,0.8);*/ }
a:hover .back-box, .back-box.active{ color: #fff; filter: alpha(opacity=100); opacity: 1;}
.back-box.active{background-color: rgba(0,0,0,0.5);}
a:hover .back-box.active{background-color: rgba(151,127,108,0.8);}
.vertical-box, .icon-box, .num-box{ position: absolute; display:block; top: 0px; right: 0; bottom: 0; left: 0; margin: auto; height: 50px; color:#fff; filter: alpha(opacity=0); opacity: 0; text-align:center;}
.back-box.active .num-box{filter: alpha(opacity=100); opacity: 1;}
.icon-box{ height: 50px; width: 50px; line-height: 50px; background:#bea794; -webkit-border-radius: 50%; -moz-border-radius: 50%; border-radius:50%;z-index: 1;}
a:hover .vertical-box, a:hover .icon-box{ filter: alpha(opacity=100); opacity: 1;}
a:hover .vertical-box i{ margin-top: -10px;}
.img-box i, .img-over-box i, .img-list i{display:block;font-size:24px;line-height: 50px;z-index: 1;}
.img-box em, .img-over-box em, .img-list em{display:block;font-size:12px; line-height: 12px; letter-spacing: 0.1em;}
.img-box b, .img-over-box b, .img-list b{display:block;font-size:14px; line-height: 20px; font-weight: normal;}
.img-box big{display:block;font-size:40px; line-height: 40px;}
.info-list{width: 105%;}
.info-list li{ position: relative; display: block; padding:5px 0; width: 100%;min-height: 20px; line-height: 20px; font-size: 16px;color:#ccc;}
.info-list small{ position: absolute; display: block; left: 0;top:5px; font-size: 15px;letter-spacing: -1px;}
.info-list strong{ display: block; padding-left:70px; font-weight: normal;}
.info-list.label-small strong{padding-left:40px;}
.info-list i{ display: none; }
.info-list a i{display: inline-block;margin-left: 7px;}

.computer-img{ display:block; opacity: 1 !important;}
.mobile-img{ display:none; opacity: 0 !important;}
/*============button===============*/
.underline b, .underline strong{position: relative;display:inline-block;/*font-weight: normal;*/}
.underline b:before, .underline strong:before{ position: absolute; content: ''; display: block; height: 1px; width: 0px; bottom: 0px; left: 50%; background-color:#ae272d; z-index: 1; }
.underline.left a b:before, .underline.left a strong:before{ left: 0;}
.underline a:hover b:before, .underline a.active b:before, .underline a:hover strong:before, .underline a.active strong:before{width: 100%; left: 0%;}
.border-line a{overflow: hidden;}
.border-line a:before, .border-line a:after{content: ''; position: absolute; border: solid 1px transparent; width: 0; height: 0;}
.border-line a:before, .border-line a:hover:before{left: 0; top:0;}
.border-line a:after, .border-line a:hover:after{right: 0; bottom: 0;}
.border-line a:hover:before, .border-line a:hover:after{ width: 100%; height: 100%;}
.border-line a:hover:before{ border-top: solid 1px #ae272d; border-left: solid 1px #ae272d;}
.border-line a:hover:after{ border-bottom: solid 1px #ae272d; border-right: solid 1px #ae272d;}

.button-icon a, a.button-icon{ position: relative;display:inline-block; text-align:center; overflow:hidden; font-size:26px;line-height: 40px;width: 40px;height: 40px;}
.button-icon i{line-height: 40px;}
.button-icon a:hover i, a.button-icon:hover i{font-size:40px;}
.button-icon-ver{position: fixed;display: block;bottom: 50px;right: 0; width: 60px;z-index: 1;overflow: hidden;}
.button-icon-ver a{position:relative;display: block;width: 50px; height: 50px; line-height: 50px; text-align: center;/*background:#545556;*/ margin-left:100%; margin-bottom: 1px;}
.button-icon-ver a i{font-size: 24px;line-height: 50px;}
.button-icon-ver a:hover{margin-left:5px!important;background:#ae272d;}
.sticky .button-icon-ver a{ margin-left: 0;}
.sticky-footer .button-icon-ver a{ margin-left: 100%;}

.button-text a{position: relative;display:block;left: 0px;}
.button-text strong{ position: relative;display:block;float: left;font-weight: normal; padding: 11px 0;min-height: 22px; font-size:16px;line-height: 22px;}
.button-text a:hover{left: 5px;}
.button-text small{display: block; font-size: 14px;line-height: 20px;}
.button-text-list{margin-bottom: 40px;}
.button-text-list a:first-child strong{border-top: solid 1px #c6686c;}
.button-text-list strong{ border-bottom: solid 1px #c6686c;width: 105%;padding-right: 12%;}

.button-icon-text{margin-left:-20px; margin-right:-20px;}
.button-icon-text a{ position: relative;; float:left; display: block;}
.button-icon-text strong{float:left; display:block; line-height:50px;font-size: 14px;font-weight: normal;}
.button-icon-text i{color:#fff; font-size:24px; line-height:50px;width: 35px; text-align:right; display: inline-block;}
.button-icon-text div{position: relative;display: block; float:left; padding: 0 20px;}
.button-icon-text div:before{content: "";position: absolute;display: block; top:50%; left: 0; width: 1px; height: 26px; margin-top: -13px; background-color:#ccc; opacity: .2; }
.button-icon-text div:first-child:before{display: none;}
.share-button{ font-size:15px; line-height:50px;}
.share-button a{ position: relative; float:left; display:block; width:40px; height:50px; text-align:center;}
.share-button i{ color:#fff; font-size:20px; line-height:50px;width:40px; text-align:center;}
.share-button span{ display: block; position:absolute; top:0; left:0;bottom:0; right:0; margin:auto; width: 24px; height: 24px; overflow: hidden;}
.share-button img{ position:absolute; left: 0; top:0; width: 24px; height: 24px;}
.share-text{float:left; display:block; line-height:50px;font-size: 14px;margin: 0;font-weight: normal;}

/*a.button-top {position:fixed;display: block;opacity: 0;font-size: 12px;width: 0px; padding: 15px 0px;right: 0;bottom: 100px;z-index: 1;z-index: 2;}
.sticky a.button-top i{display: inline;font-size: 20px;}
.sticky a.button-top{opacity: 1;width: 20px;padding: 15px;}
.button-down{ position:absolute; display:block; bottom: 0px; left: 50%; margin-left: -35px; width:70px; height:50px; padding-top: 20px; font-size: 12px;line-height: 16px;color:#fff; z-index:1; text-align:center;}
.button-down i{ display:block; font-size:24px;}
.button-down:hover{ color:#000; background-color:#fff;}*/

.sidebar-nav{ position: fixed; right:0px; bottom:90px; z-index: 1; width: 190px;}
.sidebar-nav a{ position:relative; display: block; font-size:16px;text-align: right; line-height: 20px; min-height: 20px; width: 100%;white-space: nowrap;}
.sidebar-nav a b{display: block; padding: 10px 45px 10px 0;border-right: 1px solid transparent;}
.sidebar-nav a:hover b{padding-right: 55px;}
.sidebar-nav a.active b{border-right: 3px solid #ae272d;}
.sidebar-nav a:before{ content: ''; position: absolute; display: block; height: 1px; width: 100%; right: 0; bottom:0; background: #fff;opacity: .3;}

.category-list{ display:block;text-align: center; font-size: 0;}
.category-list li{position: relative; display:inline-block;font-size: 16px; line-height: 20px; letter-spacing: 0.2em; }
.category-list a{display:inline-block; color:#fff;padding: 7px 15px;}
.category-list li.active a, .category-list a:hover{color: #ae272d;}
/*============page===============*/
.page {display: inline-block;clear: both;text-align: center; font-size: 0; margin-top: 40px;position: relative;left: 50%; -ms-transform: translateX(-50%); -moz-transform: translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); transform: translateX(-50%);}
.page a {position: relative; min-width:40px; height: 40px; line-height: 40px; display: inline-block;text-align: center;font-size: 16px;/*color:#9f8268;*/vertical-align: middle;}
.page a.active{color:#ae272d;}
.page i{font-size: 30px;vertical-align:middle;}
/*==============index==================*/
#index .text-more:before{background:#ae272d; color: #fff !important;}
#index .text-more:hover:before{width: 80px;}
#index button.owl-next, #index button.owl-prev, #index .owl-dots{bottom: 70px;}
.index-box{position: absolute; max-width: 94%;left: 3%;bottom: 140px;overflow: hidden;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#index .grid-item a{position: absolute;left: 0; top: 0; width: 100%;height: 100%;padding-bottom: 0;}
.index-box h2{margin-top: 5px;} 
.index-box.right{text-align: right;left: auto; right: 3%;}
.index-box.top{bottom: auto; top: 120px;}
.index-box.center{bottom: auto;left: auto; top: 40%; width: 100%; max-width: 100%;text-align: center;}
.right .text-more:before, .text-more.right:before{left: auto; right: 0;}
.center .text-more:before, .text-more.center:before{left: 50%; margin-left: -30px;}
/*==============about==================*/
.full-box-bottom { position: absolute; bottom: 10%;width: 100%;}
.full-box-top { position: absolute; top: 100px;width: 100%;}
 #about .grid-max p{white-space: nowrap;}
/*==============projects==================*/
#projects-content .full-height{ min-height:680px;}
#projects-content .img-bg-text{bottom: auto; top:140px;}
.section-footer{position: relative; display: block; background-color: #ae272d; padding: 30px 200px 30px 70px;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;min-height: 120px;overflow: hidden;}
.section-footer .logo-img{float: left;height: 60px; width: auto; margin-right: 40px;}
.section-footer .button-text strong{ padding: 10px 30px 10px 0;}
.section-footer .share-button{position: absolute;right: 50px;top: 40px; }
/*==============awards==================*/
.awards-list .grid-item a{position: relative; display: block;}
.awards-list .grid-item a:hover{ background: #ae272d;box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);}
.awards-list .grid-item{margin-bottom: 6px;}
.awards-list .grid-content { padding-right: 460px;padding-left: 6px;}
.awards-list .grid-aside{padding-top: 60px;width: 300px;}
.awards-list .img-box{height: 340px;width: 100%;}
.awards-list .logo-box{position: absolute; height: 90px; right: 110%;z-index: 1;white-space: nowrap;}
#awards-content .html-edit{margin-top: 20px; padding-top: 20px; border-top:solid 1px #c6686c;}
#awards-content .title-box{text-align: center;}
#awards-content .logo-box{margin-bottom: 10px;}
#awards-content #section-header h3{text-align: center;}
.text-year-small2{position: relative; display: inline-block; letter-spacing: 0.1em;;font-size: 13px; line-height: 30px; }
.text-year-small2:before, .text-year-small2:after{ content: ''; position: absolute; display: block; height: 1px; width: 10px; left: -15px; top:50%; background: #fff;}
.text-year-small2:after{left: auto;right: -15px;}
#awards-content .full-box{position: fixed;}
/*==============history==================*/
.history-list{ position:relative; margin-top: -40px;padding-top: 40px;}
.history-list:before{ content:''; position:absolute; width:3px; top:0; background-color:#fff; height:100%; z-index:0; left:5%;}
.history-list .grid-item { position:relative; display:block; float:left;width: 85%; padding-left: 10%; min-height: 80px; margin-left: 5%;}
.history-list .img-over-box{ float:left; margin-right:5%;width: 35%; max-width: 180px;margin-top: -3%;}
.history-list .grid-item:before{ content:''; position:absolute; display:block; left:0px; top:17px; width:9%; height:1px; background-color:#fff;}
.history-list .text-year{ position:absolute; z-index:1; left:0; top: 0px;margin-left:-30px;min-width: 60px; text-align: center; padding: 7px 0; background-color:#a9aaab;}
.history-list .text-box{width: 60%;}
.history-list .grid-item.odd .text-year{color:#ae272d;}
.history-list .grid-item.odd:before{background-color:#ae272d;}
/*==============news==================*/
.news-list .gutter-sizer{width: 4%;}
.news-list .grid-item{width: 22%;margin-bottom:30px;position: relative; display: block;padding-top: 35px;padding-left: 10px;padding-right: 10px;box-sizing: border-box;}
.news-list .grid-item:before{content: ''; position: absolute;width: 100%;height: 100%;left: 0;top:0; background: #ae272d;box-shadow: 0 10px 30px rgba(0, 0, 0, 0.4);z-index:0;opacity: 0;}
.news-list .grid-item:hover:before{opacity: 1;}
.news-list .grid-item a{position: relative;}
.news-list .grid-item .text-box{float: none; margin-bottom: 20px;}
.news-list .grid-item em{position:relative;display: inline-block; left: 100%;margin-left: -70px; z-index:1;-moz-text-shadow:1px 1px 10px rgba(0,0,0,.7); -webkit-text-shadow:1px 1px 10px rgba(0,0,0,.7); text-shadow: 1px 1px 10px rgba(0,0,0,.7);}
.news-list .grid-item em:before{display: none;}
/*.news-list .grid-item em:before{-moz-text-shadow:none; -webkit-text-shadow:none; text-shadow:none;}*/
.news-list .grid-item .img-box + em, .news-list .grid-item .plyr + a em{margin-top: -30px;}
.news-list .grid-item .text2{margin-top: 5px;white-space: pre-line;}
.news-list a .text-more{padding-bottom: 25px;}
/*.icon-new h1:after,*/ .icon-hot h1:after{content: "NEW"; display: inline-block; font-size:12px;vertical-align:bottom;margin-left: 7px;}
.icon-hot h1:after{content: "HOT"; color:#ae272d;}
.content-box .html-edit{margin-bottom: 20px;}
.content-box .button-icon-text {float: right;}
.content-title{min-height: 60px; padding-bottom: 35px;margin-bottom: 35px;border-bottom: solid 1px rgba(200,200,200,.2);}
.content-title h2{margin-top: 8px;}
.content-title h2:empty{margin-top:0;}
.content-date{float: right;padding-left: 10px;}
.content-date strong{font-size: 14px;line-height: 24px;font-weight: normal;letter-spacing: 0.1em;}
/*==============form==================*/
.contact-box{position:fixed; display:block;top: 0; right: -520px; width: 100%; max-width: 520px; height: 100%; background: #ae272d; overflow: auto; z-index: 30;}
.lightbox .contact-box{ right: 0px; }
form { position: relative; display: block; font-size:16px;}
form .input-column,form .input-row{ position: relative; display: block; line-height:0; margin:0; width:100%; border-bottom: solid 1px #c6686c; min-height:50px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
form .input-column{float:left; width:50%;}
form .input-column:nth-child(odd){width:48%; margin-right: 2%;}
.input-text{ position: relative; display: inline-block; min-height: 20px; line-height: 24px; margin:0; padding: 13px 0;}
.input-text a{ display:inline-block;}
form label { position:absolute; height: 20px; top: 15px; line-height: 20px; display: block;}
form input[type="text"], form input[type="password"], form select, form textarea, .input-box{color: #fff; line-height: 20px; padding-top: 15px; padding-bottom: 15px; padding-left:70px; height: 50px; width: 100%;background-color:transparent; border: solid 1px transparent; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
form textarea { height: 100px; line-height: 24px; padding-top: 10px;}
form select {-webkit-appearance: none;-moz-appearance: none;appearance:none; line-height: 50px; padding: 0 30px 0 70px; background: url(../images/icon-select.png) no-repeat right center #ae272d; padding-right: 0 \9; background-image: none \9;}
*::-ms-backdrop, form select{ padding-right: 0;background-image:none; }/*IE11*/
.input-box{ line-height: 26px; min-height: 50px; height:inherit; padding-top: 10px;}
form small {font-size:16px; width: 15px; display: inline-block; /*color:#990000;*/}
form input[type="text"]:focus, form input[type="password"]:focus, form textarea:focus, form select:focus { border-bottom:solid 1px #fff; }
form input[type="text"].error, form input[type="password"].error, form textarea.error, form select.error { border-bottom: dotted 2px #fff; }
img.rand-img { position: absolute; right: 0px; bottom: 1px; width:100px; height:48px;cursor: pointer;}
input[type="reset"], input[type="submit"], #submit, #reset,.submitBTN{width:100%; height: 50px; display: inline-block; text-align: center;  cursor: pointer; background:#fff; color:#ae272d;}
input[type="reset"], #reset{opacity: .7;}
input[type="submit"]:hover,input[type="reset"]:hover, input[type="reset"]:focus, input[type="submit"]:focus, #submit:hover, .submitBTN:hover{}
input[type="button"], input[type="file"], input[type="button"]:focus, input[type="file"]:focus{ background:transparent; color:#fff; cursor: pointer; padding-right:5px;text-decoration: underline; }
.input-button{ width: 100%; margin-top: 10px;}
@-webkit-keyframes autofill { to {color: #fff; background: transparent;} }/*Change Chrome fill*/
input:-webkit-autofill {-webkit-animation-name: autofill;-webkit-animation-fill-mode: both;}
.hide-box span{ display: block; padding: 0 0px 10px 15px;font-size: 15px;line-height: 24px;}
.form-link{ color: #fff; text-decoration: underline; display: inline-block;}
.form-link:hover{ text-decoration: none;}
.pswp-box { position: absolute; display: block; top: 0px; right: 0; bottom: 0; left: 0; margin: auto; width: 85%; max-width: 500px;height: 300px; background-color: #fff; padding: 40px; border: solid 1px #ddd; text-align: left; }
.placeholder ::placeholder { color: #ae272d;}
.placeholder ::-webkit-input-placeholder { color: #ae272d;}
.placeholder :-ms-input-placeholder {color: #ae272d;}
.placeholder ::-moz-placeholder { color: #ae272d; opacity: 1;}
.select-category{-webkit-appearance: none;-moz-appearance: none;appearance:none;min-width: 150px; height: 40px; line-height: 40px;font-size: 15px; color:#ae272d; letter-spacing: 1px; padding: 0 30px 0 10px; background: url(../images/icon-select-w.png) no-repeat right center #fff;-webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius:3px; padding-right: 0 \9; background-image: none \9;}
*::-ms-backdrop, .select-category{ padding-right: 0;background-image:none; }
/*============pswp===============*/
.pswp__bg { opacity: 0.9 !important; }
.pswp__caption__center { font-size: 15px !important; }
.pswp__zoom-wrap { text-align: center; }
.pswp__zoom-wrap:before { content: ''; display: inline-block; height: 100%; vertical-align: middle; }
.pswp__wrapper { line-height: 0; width: 100%; max-width: 1280px; position: relative; display: inline-block; vertical-align: middle; margin: 0 auto; text-align: left; z-index: 1045; }
.pswp__video_wrapper { position: relative; padding-bottom:56.25%; height: 0; width: 100%; }
.pswp__video_wrapper iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }
video { width: 100% !important; height: auto !important; }
@media screen and (max-height: 750px) {
.pswp__wrapper { max-width: 960px;}
}
@media screen and (max-height: 600px) {
.pswp__wrapper { max-width: 720px;}
}
@media screen and (max-width: 790px) and (orientation:landscape){
.pswp__ui--fit .pswp__top-bar, .pswp__ui--fit .pswp__caption { background:rgba(0, 0, 0, 0) !important;}
.pswp__counter, .pswp__caption{ display:none;}
}
/*============owl===============*/
button.owl-next, button.owl-prev{ position:absolute; display:block;bottom: 40px; height:40px; width:35px; line-height: 40px; z-index:1; text-align:center; color: #fff;}
.owl-prev i, .owl-next i{font-size: 26px;line-height: 40px;}
.owl-prev:hover i, .owl-next:hover i{font-size:40px;}
.owl-prev{ right:2.5%;margin-right: 35px;}
.owl-next{ right:2.5%;}
.owl-carousel.off {display: block;}
.owl-prev.disabled, .owl-next.disabled{filter: alpha(opacity=50); opacity: 0.5;}
.owl-prev.disabled:hover i, .owl-next.disabled:hover i{font-size:26px;}
/*.owl-nav.disabled + .owl-dots { margin-top: 30px; }*/
.owl-dots {-webkit-tap-highlight-color: transparent;text-align: right;position: absolute;bottom: 40px; height: 30px;width: 95%; margin: 0 2.5%;padding-right: 80px;-webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
.owl-dots .owl-dot {display: inline-block; zoom: 1; *display: inline; }
.owl-dots .owl-dot span { width: 5px; height: 5px; margin: 9px 6px; background: #ffffff; display: block; -webkit-backface-visibility: visible; transition: opacity 200ms ease; }
.owl-dots .owl-dot.active span, .owl-dots .owl-dot:hover span { background: #ae272d; width: 5px; height: 5px; margin: 9px 6px;}
.owl-item.active .img-box{-webkit-animation: kenburns 8s ease-out;animation: kenburns 8s ease-out;}
.owl-carousel .animated{-webkit-animation-duration:1s;animation-duration:1s;}
.owl-carousel .owl-item .owl-lazy.full-height:not([src]), .owl-carousel .owl-item .owl-lazy.full-height[src^=""] {max-height:inherit; }
/*============googlemaps===============*/
#map_canvas iframe{width:100%; height:550px; z-index: 9;}
/*============mb.YTPlayer===============*/
.inline-YTPlayer{max-width:inherit!important;}
.video-full{ padding-bottom:0!important; height: auto!important;}
.inlinePlayButton{ width: 50px;height: 50px; line-height: 50px;font-size: 26px;transform: scale(1);}
.mb_YTPlayer:hover .inlinePlayButton, .inlinePlayButton:hover { transform: scale(1.1) !important;}
#index .inlinePlayButton{left: auto; right: 3%;}
.video-full .mbYTP_wrapper iframe{width: 100% !important; height: 100% !important;margin-left: 0 !important;margin-top: 0 !important;}
.mb_YTPBar{z-index: 10!important;}
@media screen and (max-width: 800px) {
.inlinePlayButton{ width: 40px;height: 40px; line-height:40px;font-size: 20px;}
#index .inlinePlayButton{ bottom: 40px;top: auto;}
}
/*============page-transition===============*/
.animsition,.animsition-overlay{position:static !important;}
.animsition-overlay-slide{z-index:101 !important;background-color: #ae272d !important;}  
.animsition-loading, .animsition-loading:after{z-index:102 !important;}
/*============lazy===============*/
img.lazy,picture.lazy img {background-image: url('../images/loader.gif'); background-repeat: no-repeat; background-position: 50% 50%; }
picture.lazy img{ opacity: 0;-webkit-transition: opacity 500ms ease-out; -o-transition: opacity 500ms ease-out; -moz-transition: opacity 500ms ease-out; transition: opacity 500ms ease-out;}
picture.lazy.lazy-loaded img{opacity: 1;}
/*============plyr===============*/
.plyr__control--overlaid{ background: rgba(174,39,45,.8) !important;}
.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{background:#ae272d !important;}
.plyr--audio .plyr__control.plyr__tab-focus,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#ae272d !important;color:#fff}
.plyr--video .plyr__controls .plyr__control.plyr__tab-focus,.plyr--video .plyr__controls .plyr__control:hover,.plyr--video .plyr__controls .plyr__control[aria-expanded=true]{background:#ae272d !important;color:#fff}
.plyr__menu__container label.plyr__control input[type=radio]:checked+span{background:#ae272d !important;}
.plyr--full-ui input[type=range]{color: #ae272d !important;}
.plyr__control--overlaid{z-index: 3!important;}
/*============justifiedGallery===============*/
.justified-gallery > a > .caption{ display: block; opacity: 0;padding:10px;font-size: 15px;background-color:transparent;z-index: 1;background-image: -webkit-linear-gradient( to top, rgba(0,0,0,.9) 0%, rgba(0,0,0,0) 100%); background-image: -moz-linear-gradient( to top, rgba(0,0,0,.9) 0%, rgba(0,0,0,0) 100%); background-image: -o-linear-gradient( to top, rgba(0,0,0,.9) 0%, rgba(0,0,0,0) 100%); background-image: linear-gradient( to top, rgba(0,0,0,.9) 0%, rgba(0,0,0,0) 100%);white-space: pre-line;}
.justified-gallery > a > .caption.caption-visible{ opacity: 1;}
/*============fancybox===============*/
.fancybox-button {background: transparent;}
.fancybox-thumbs{background: rgba(0,0,0,.5);}
.fancybox-thumbs__list a:before {border: 4px solid rgba(255,255,255,.8);}
.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track{background:#000;}
.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb{background:#666;}
.fancybox-progress {background: #fff;}
.fancybox-button, .fancybox-button:link, .fancybox-button:visited { color: #fff;}
.fancybox-thumbs {width: 110px;}
.fancybox-show-thumbs .fancybox-inner { right: 110px;}
.fancybox-thumbs__list a{max-width: calc(100% - 10px);}
.fancybox-caption{white-space: pre-line;}
/*============ie/lightbox===============*/
.ie, .lightbox-container { position: fixed; display: block; top: 0; left: 0; z-index: 200; height: 100%; width: 100%; background: url(../images/bg-alpha.png) repeat; overflow: auto;}
.ie-content { position: relative; display: block; margin: 0 auto; margin-top: 3%; width: 90%; max-width: 600px; height: 300px; background-color: #fff; color:#333; padding: 3%; border: solid 1px #ddd; }
.ie-content a{color:#333;}
.ie-close, .lightbox-close { position:absolute; display: block; width: 50px; height: 35px; right: 0; top: 0; text-align: center; padding-top: 15px;}
.lightbox-close {position: fixed; color: #fff; right: 10px;}
body.lightbox{overflow:hidden !important;}
.lightbox-container, .lightbox-item{ display: none;}
.lightbox-container.active, .lightbox-item.active{ display: block;}
.lightbox-bg{ position: fixed; display: block; top: 0; left: 0; height: 100%; width: 100%;}
.lightbox-content{ position: relative; display: block; width: 90%; max-width:1000px; margin: 0 auto; background: #fff;}
.lightbox-item{ min-height: 400px; margin: 50px 0;}

@media screen and (min-width:1100px) {
#history .grid-max{width: 95%;}
.history-list:before{ left:50%;}
.history-list .grid-item{ width:44%; margin-left: 0;}
.history-list .grid-item.odd{ margin-left:50%; padding-left: 6%;}
.history-list .grid-item.even{padding-left: 0;padding-right: 6%;}
.history-list .grid-item.even .text-box{text-align:right;float:right;}
.history-list .grid-item.even .img-over-box{float:right; margin-right:0%; margin-left:5%;}
.even .text-year{ left: auto; right:0; margin-left:0; margin-right:-30px;}
.even.grid-item:before{ left: auto; right:0;}
}
@media screen and (min-width:1300px) {
#projects-content #section-header{ width: 400px;}
#projects-content .img-bg , #projects-content .full-box{ padding-right: 400px;}
#projects-content .logo-box img{height: 90px;}
.content-container.content-column{max-width: 1640px;}
.content-container.content-column .content-box{float:right; width: 42%;}
.content-container.content-column .img-list{float: left;width: 52%;margin-right: 6%;margin-top: 0;}
}
@media screen and (max-width: 1500px) {
h1,.title1 {font-size: 2.8125em}
.title2{font-size: 2.25em;}
.title-en {font-size: 65px;line-height: 60px;}
.awards-list .grid-content {padding-right: 380px;}
.imgtext-box.normal .text-box { width: 40%;margin-top: 5%;}
.imgtext-box.normal .img-over-box { width: 60%;}
.news-list .grid-item{width: 30%;}
.news-list .gutter-sizer{width: 5%;}
}
@media screen and (max-width: 1200px) {
/*============nav===============*/
.logo { width: 120px; height: auto; padding-left: 25px;}
#nav li { margin-left: 30px;}
#nav li a em { font-size: 14px;}
#header{min-height: 90px;}
#header:before{height: 90px;}
#footer {margin-top: -70px;min-height: 70px;}
/*============main===============*/
.content { padding-top: 160px; margin-bottom: 150px;}
.content-small{ padding-top: 130px;}
}
@media screen and (max-width: 1100px) {
/*============other===============*/
.history-list{ max-width: 700px;margin: 0 auto; padding-top: 0px;}
.history-list .grid-item {padding-bottom: 50px;}
.history-list .grid-item:last-child{padding-bottom: 0px;}
.history-list .img-over-box{margin-top: -2%;}
.imgtext-box.normal {margin: 100px auto;}
.imgtext-box.normal:first-child{padding-top: 100px;}
.imgtext-box.normal .text-box,.imgtext-box.normal .img-over-box {float: none !important;width: 100% !important;padding-left: 0 !important;}
.imgtext-box.normal .text-box{margin-top: 50px;}
.news-list .grid-item{width: 47%;}
.news-list .gutter-sizer{width: 6%;}
}
@media screen and (min-width: 980px) and (min-height: 700px) and (orientation:landscape) {	
#projects-content .header-content{position: absolute; bottom: 0;width: 100%;}
}
@media screen and (max-width: 980px),(orientation:portrait) {
/*============aside===============*/
#section-header{  width:100%; height:auto !important; float: none; z-index: 1;}
.content-page .full-box { padding-right: 0!important;position: relative!important;}
.content-page .title-box{padding-top: 60px;}
.button-text-list strong{ width: 100%;padding-right: 0;}
.content-page .grid-min{width: 85%;margin-bottom: 60px;}
.content-page .full-box .full-height{height: 0 !important; padding-bottom: 66.66%;}
.content-page .full-box .video-box .full-height{ padding-bottom: 56.25%;}
.content-page .button-icon{margin-bottom: -20px;}
#projects-content .full-height{ min-height: auto;}
#projects-content .img-bg-text {top: 100px;}
#awards-content .img-bg-text {bottom: 40px;}
button.owl-next, button.owl-prev{display: none;}
.owl-dots{padding-right: 0px;bottom: 0px;}
}
@media screen and (max-width: 980px) {
/*============main===============*/
.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%;}
.grid-space{ padding-right: 0;}
#map_canvas iframe {height: 400px;}
.sidebar-nav{display: none;}
.button-icon-ver { width: 55px;}
.button-icon-ver a {width: 40px;height: 40px;line-height: 40px;}
.button-icon-ver a i {font-size: 20px;line-height: 40px;}
/*============other===============*/
#about #footer { margin-top: 0px;}
#about .full-box{position: relative;padding-bottom: 56.25%; height: 0;margin-top: 150px;} 
#about .grid-max{margin-bottom: 60px;}
.full-box-bottom, .full-box-top {position: relative; bottom:auto;top: auto;margin-top: -80px;}
.section-footer .logo-img{display: none;}
.section-footer .button-text {float: none; }
.section-footer{ padding-left:7.5%;}
.awards-list .grid-content {padding: 0;}
.awards-list .grid-aside {position: relative; padding: 50px 7.5%; width: 85%;}
.awards-list .logo-box {right:auto; left: 7%;height: 70px;top: -30px;}
.awards-list .img-box {height: 0; padding-bottom: 50%;}
}
/*============nav===============*/
body.sticky.active{overflow: hidden;}
body.sticky #header{z-index: 30;}
body.sticky.active #header{position: fixed; height: 100%; overflow: auto; top: 0px; z-index: 30;}
body.sticky #nav{position: absolute; width: 100%; height: 0px; top:0; left: 0; background:#ae272d; overflow: hidden;}
body.sticky.active #nav{ height: 100%; overflow:auto;z-index: 1;}
body.sticky #nav ul{width: 85%; max-width: 300px; margin: 0 auto;padding: 60px 0;}
body.sticky #nav li {margin-left: 0;float: none; width: 100%;}
body.sticky #nav li > a {line-height: 30px;}
body.sticky #nav li a em {font-size: 32px;}
body.sticky #nav li > a strong{opacity: .8;font-size: 15px;letter-spacing: 3px;line-height: 15px;}
body.sticky #nav .subnav {display: block;}
body.sticky #nav .subnav { margin-top: 15px;}
body.sticky #nav .subnav a { font-size: 16px; line-height: 20px;max-width:100%;}
@media screen and (max-width: 800px) {
/*============nav===============*/
body.active{overflow: hidden;}
body.active #header{position: fixed; height: 100%; overflow: auto; top: 0px; z-index: 30;}
#nav{position: absolute; width: 100%; height: 0px; top:0; left: 0; background:#ae272d; overflow: hidden;}
body.active #nav{ height: 100%; overflow:auto;z-index: 1;}
#nav ul{width: 85%; max-width: 300px; margin: 0 auto;padding: 60px 0;}
#nav ul{width: 85%; max-width: 300px; margin: 0 auto;padding: 60px 0;}
#nav li {margin-left: 0;float: none; width: 100%;}
#nav li > a {line-height: 30px;}
#nav li a em {font-size: 32px;}
#nav li > a strong{opacity: .8;font-size: 15px;letter-spacing: 3px;line-height: 15px;}
#nav .subnav {display: block;}
#nav .subnav { margin-top: 15px;}
#nav .subnav a { font-size: 16px; line-height: 20px;max-width:100%;}
.nav-toggle{opacity: 1; top:10px;padding: 15px;height: 20px;}
#footer {margin-top: -90px;min-height: 90px;}
/*============main===============*/
/*.grid-large, .grid-middle, .grid-small, .grid-max, .grid-min, .grid{ width: 80%;}*/
h1,.title1 {font-size: 2.25em;}
.title2 {font-size: 1.875em;}
.title3 {font-size: 1.5em;}
.title6 {font-size: 1.25em;}
.text2 {font-size: 14px;line-height: 20px;}
.text-top { margin-top: 10px;}
.text-bottom { margin-bottom: 10px;}
.text-top2 {margin-top: 20px;}
.text-bottom2 {margin-bottom: 20px;}
.box-top{margin-top: 40px;}
.box-bottom{margin-bottom: 40px;}
.category-list a {padding-left:8px;padding-right: 8px;}
.category-list li { letter-spacing: 0.1em;font-size: 15px;}
.content-page-full .button-icon{margin-right: 60px;}
/*============other===============*/
#index #footer{margin-top: 0px;background: #545556; color:#ccc;}
#index #footer a{color:#ccc;}
.index-box {bottom: 60px;}
#index .owl-dots{bottom: 0px;}
#index .wrapper{min-height: inherit;}
.imgtext-box.full {margin-bottom: 70px;}
.imgtext-box.full .text-box{position: relative;float: none;bottom:auto;left:auto;right:auto !important;width:auto; margin:0 7.5%; margin-top: -30px;}
.imgtext-box.normal .text-box{ margin-top: 30px;}
.imgtext-box.normal {margin: 70px auto;}
.imgtext-box.normal:first-child{padding-top: 70px;}
#projects-content .img-bg-text { top: 80px;}
#projects-content .img-bg-text h1{font-size: 1.5em;}
#projects-content .img-bg-text p{font-size:14px;line-height: 20px;}
.content .infinite-next, .content #infscr-loading {bottom: -50px;}
}
@media screen and (max-width: 600px) {
.logo { width: 100px;height: auto;padding-top: 20px; padding-left: 20px;}
#header{min-height: 70px;}
#header:before{height: 70px;}
li.footer-button{display:block;}
.footer-button a{width: 30px; height: 30px;margin-top: 5px;}
#footer {margin-top: -125px;min-height: 125px;}
/*============main===============*/
.hide-w600{ display: none !important;}
.computer-img{ display:none; opacity: 0 !important;}
.mobile-img{ display:block; opacity: 1 !important;}	
.content {padding-top: 130px;margin-bottom: 200px;}
.content-small{ padding-top: 110px;}
.button-icon-ver{display: none;}
.page { margin-top: 20px;}
.page a { min-width: 35px; height: 35px;line-height: 35px;}
.justified-gallery > a > .caption.caption-visible{display: none;}
/*============other===============*/
.index-box.top{top: 100px;}
#about .full-box {margin-top: 130px;}
.section-footer .share-button { position:relative;right: auto;top: auto;}
.section-footer{ padding-right:0;}
.awards-list{width: 100%;}
.text-year {font-size: 16px;}
.history-list .text-year{margin-left: -10px; min-width: 20px;writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl;}
.history-list .text-box{ clear: both; width: 100%;}
.history-list .img-over-box{width: 60%; padding-bottom: 20px;}
.history-list .img-over-box { margin-top: 0;}
.history-list .grid-item:before{display: none;}
#news .content {width: 90%;}
.news-list{max-width: 400px; margin: 0 auto;}
.news-list .grid-item{width: 100%;margin-bottom: 20px;padding-top: 20px;}
.news-list .gutter-sizer{width: 0;}
}
@media screen and (max-width: 500px) {
/*============main===============*/
.hide-w500{ display: none !important;}
#footer {margin-top: -150px;min-height: 150px;}
.pswp-box{height: 350px;}
.page a {display: none;}
.page a.active, .page a.page-first, .page a.page-last, .page a.page-next, .page a.page-prev{ display: inline-block; }
/*==============other==================*/
h1,.title1 {font-size: 1.875em;}
.title4 {font-size: 1.125em;}
.title5 {font-size: 1.125em;letter-spacing: 0.2em;}
.title-en {font-size: 50px;line-height: 45px;margin-left: 0px;}
.index-box{left: 20px;}
.index-box.right{right: 20px;}
.index-box h2 { font-size:15px;line-height: 24px;}
.full-box-bottom, .full-box-top{margin-top: -60px;}
#about .grid-max p{white-space: inherit;}
#about .grid-max p br{display: none;}
#projects-content .img-bg-text {display: none;}
}
@media screen and (max-width: 400px) {
.hide-w400{ display: none !important;}
.awards-list .logo-box { height: 60px; top: -20px;}
#section-header .logo-box img{ height: 60px;}
.imgtext-box p br{display: none;}
.img-bg-text h1{font-size: 20px;}
.img-bg-text h2 {margin-top: 0;}
.content-date {float: none; padding-left: 0; margin-bottom: 20px;}
.content-date .text-year-small {ine-height: 20px;white-space:normal;}
.content-date .text-year-small br{display: none;}   
}
@media screen and (max-width: 340px) {
/*============nav===============*/
#nav ul { padding: 40px 0;}
#nav li > a {padding-top: 20px;}
#nav li a em {font-size: 28px;}
.title2 {font-size: 1.7em;}
.title-en {font-size: 40px;line-height: 35px;}
.content {padding-top: 100px;}
.content-small{ padding-top: 90px;}
#about .full-box {margin-top: 100px;}
.logo-box h1{font-size: 40px;}
.form-link {padding-left: 45px;}
#awards-content .img-bg-text{display: none;}
}
@media screen and (max-width: 310px) {
.hide-w310{ display: none !important;}
#footer {margin-top: -185px;min-height: 185px;}
.content-page-full .button-icon a:last-child{display: none;}
/*p, .text0, .text1{ font-size:15px;line-height: 24px;}*/
}
.horizontal { display: inherit; }
.vertical { display: none; }
@media screen and (orientation:portrait) {
.horizontal { display: none; }
.vertical { display: inherit; }
}
@media screen and (max-width: 800px) and (orientation:landscape) {
#index .full-height{height: 0 !important; padding-bottom: 56.25% !important;}
}