@charset "utf-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Serif+TC:wght@400;500;600;700&family=Lato:wght@400;700&display=swap");
@import url("icofont/icofont.min.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, construction, section, source, video, main { 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; border-radius: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, input, textarea, select, a i, a b, b:before, strong:before, .justified-gallery > a > .caption, .justified-gallery > a > .caption.caption-visible, .img-over-box:after, .img-box:after, .img-gray .img-box, .swiper-button-next, .swiper-button-prev,.swiper-pagination-bullet, .swiper-pagination-bullet:before, .subnav, .subnav div,.nav-toggle span ,.nav-toggle span:before ,.nav-toggle span:after, .content-navbar, .html-button, #nav li, a .text-more:after, .index-title a p:after{ -webkit-transition: all 250ms ease-in; -o-transition: all 250ms ease-in; -moz-transition: all 250ms ease-in; transition: all 250ms ease-in; }
.img-bg:after,.share-button, .bg-caption, .text-inside .text-box{ -webkit-transition: opacity 200ms ease-in; -o-transition: opacity 200ms ease-in; -moz-transition: opacity 200ms ease-in; transition: opacity 200ms ease-in; }
.transition-1s, .img-box img, .img-over-box img, .justified-gallery img, .img-list 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;}
img.img-hover{ -webkit-transition: all 500ms ease-in !important; -o-transition: all 500ms ease-in !important; -moz-transition: all 500ms ease-in !important; transition: all 500ms ease-in !important; }
.nav-toggle, .back-box,.full-box .img-box, #nav, .img-fadein .img-box{ -webkit-transition: all 500ms ease-in; -o-transition: all 500ms ease-in; -moz-transition: all 500ms ease-in; transition: all 500ms ease-in;}
.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;}
.computer .hover-zoom a:hover, .button-icon-text a:hover,.computer a:hover .img-box img, .computer .img-box a:hover img, .computer a:hover .img-over-box img, .computer .justified-gallery a:hover img, .computer .img-list a:hover img{-ms-transform: scale3d(1.1,1.1,1);-webkit-transform: scale3d(1.1,1.1,1);-moz-transform: scale3d(1.1,1.1,1);-o-transform: scale3d(1.1,1.1,1);transform: scale3d(1.1,1.1,1);}
.computer .hover-zoom2 a:hover, .back-button:hover{-ms-transform: scale3d(1.05,1.05,1);-webkit-transform: scale3d(1.05,1.05,1);-moz-transform: scale3d(1.05,1.05,1);-o-transform: scale3d(1.05,1.05,1);transform: scale3d(1.05,1.05,1);}
a.button-icon2:hover i, .button-icon2 a:hover i{-ms-transform: scale3d(1.3,1.3,1);-webkit-transform: scale3d(1.3,1.3,1);-moz-transform: scale3d(1.3,1.3,1);-o-transform: scale3d(1.3,1.3,1);transform: scale3d(1.3,1.3,1);}
.page a:hover, #submit:hover, #submitBtn:hover, #reset:hover, .hover-move a:hover, a.hover-move:hover, /*.underline a:hover,*/ .button-text a:hover , a.button-text:hover, .category-list a:hover{-ms-transform: translate3d(2px,2px,0); -moz-transform: translate3d(2px,2px,0); -webkit-transform: translate3d(2px,2px,0); -o-transform: translate3d(2px,2px,0); transform: translate3d(2px,2px,0);}
.item-list-4 .grid-item a:hover, .item-list-3 .grid-item a:hover{-ms-transform: translate3d(0px,-5px,0); -moz-transform: translate3d(0px,-5px,0); -webkit-transform: translate3d(0px,-5px,0); -o-transform: translate3d(0px,-5px,0); transform: translate3d(0px,-5px,0);}
.hover-move a, a.hover-move/*, .underline a*/{display: inline-block;max-width: 100%;}
.hover-move.block a, a.hover-move.block, .computer .hover-zoom a, .computer .hover-zoom2 a{display: block;}
.hidden { opacity: 0;opacity:1\9\0;}
.visible { opacity: 1; }
.fade { display: none; }
.pause{-ms-animation-play-state: paused; -moz-animation-play-state: paused; -webkit-animation-play-state: paused; -o-animation-play-state: paused; animation-play-state: paused;}
.running{-ms-animation-play-state:running; -moz-animation-play-state:running; -webkit-animation-play-state:running; -o-animation-play-state:running; animation-play-state:running;}
.notransition, .notransition:after { -webkit-transition: none !important; -moz-transition: none !important; -o-transition: none !important; transition: none !important;}
.delay-1 { -webkit-animation-delay: .3s; -moz-animation-delay: .3s; animation-delay: .3s; }
.delay-2 { -webkit-animation-delay: .6s; -moz-animation-delay: .6s; animation-delay: .6s; }
.delay-3 { -webkit-animation-delay: .9s; -moz-animation-delay: .9s; animation-delay: .9s; }
.delay-4 { -webkit-animation-delay: 1.2s; -moz-animation-delay: 1.2s; animation-delay: 1.2s; }
.delay-5 { -webkit-animation-delay: 1.5s; -moz-animation-delay: 1.5s; animation-delay: 1.5s; }
/*.delay-list li{ opacity: 0;opacity:1\9\0; -webkit-animation: fadeInUp 0.9s 1;  animation: fadeInUp 0.9s 1;  -webkit-animation-fill-mode: forwards;  animation-fill-mode: forwards;}
.delay-long-list li{ opacity: 0;opacity:1\9\0; -webkit-animation: fadeInUp 1.5s 1;  animation: fadeInUp 1.5s 1;  -webkit-animation-fill-mode: forwards;  animation-fill-mode: forwards;}*/
.delay-list > li:nth-child(12n+1), .delay-list > div:nth-child(12n+1), .delay-list > a:nth-child(12n+1) {-webkit-animation-delay: 0.2s;  animation-delay: 0.2s;}
.delay-list > li:nth-child(12n+2), .delay-list > div:nth-child(12n+2), .delay-list > a:nth-child(12n+2) {-webkit-animation-delay: 0.4s;  animation-delay: 0.4s;}
.delay-list > li:nth-child(12n+3), .delay-list > div:nth-child(12n+3), .delay-list > a:nth-child(12n+3) {-webkit-animation-delay: 0.6s;  animation-delay: 0.6s;}
.delay-list > li:nth-child(12n+4), .delay-list > div:nth-child(12n+4), .delay-list > a:nth-child(12n+4) {-webkit-animation-delay: 0.8s;  animation-delay: 0.8s;}
.delay-list > li:nth-child(12n+5), .delay-list > div:nth-child(12n+5), .delay-list > a:nth-child(12n+5) {-webkit-animation-delay: 1.0s;  animation-delay: 1.0s;}
.delay-list > li:nth-child(12n+6), .delay-list > div:nth-child(12n+6), .delay-list > a:nth-child(12n+6) {-webkit-animation-delay: 1.2s;  animation-delay: 1.2s;}
.delay-list > li:nth-child(12n+7), .delay-list > div:nth-child(12n+7), .delay-list > a:nth-child(12n+7) {-webkit-animation-delay: 1.4s;  animation-delay: 1.4s;}
.delay-list > li:nth-child(12n+8), .delay-list > div:nth-child(12n+8), .delay-list > a:nth-child(12n+8) {-webkit-animation-delay: 1.6s;  animation-delay: 1.6s;}
.delay-list > li:nth-child(12n+9), .delay-list > div:nth-child(12n+9), .delay-list > a:nth-child(12n+9) {-webkit-animation-delay: 1.8s;  animation-delay: 1.8s;}
.delay-list > li:nth-child(12n+10), .delay-list > div:nth-child(12n+10), .delay-list > a:nth-child(12n+10) {-webkit-animation-delay: 2.0s;  animation-delay: 2.0s;}
.delay-list > li:nth-child(12n+11), .delay-list > div:nth-child(12n+11), .delay-list > a:nth-child(12n+11) {-webkit-animation-delay: 2.2s;  animation-delay: 2.2s;}
.delay-list > li:nth-child(12n+12), .delay-list > div:nth-child(12n+12), .delay-list > a:nth-child(12n+12) {-webkit-animation-delay: 2.4s;  animation-delay: 2.4s;}
.delay-long-list > li:nth-child(6n+1), .delay-long-list > div:nth-child(6n+1) {-webkit-animation-delay: 0.1s;  animation-delay: 0.1s;}
.delay-long-list > li:nth-child(6n+2), .delay-long-list > div:nth-child(6n+2) {-webkit-animation-delay: 0.5s;  animation-delay: 0.5s;}
.delay-long-list > li:nth-child(6n+3), .delay-long-list > div:nth-child(6n+3) {-webkit-animation-delay: 1.0s;  animation-delay: 1.0s;}
.delay-long-list > li:nth-child(6n+4), .delay-long-list > div:nth-child(6n+4) {-webkit-animation-delay: 1.5s;  animation-delay: 1.5s;}
.delay-long-list > li:nth-child(6n+5), .delay-long-list > div:nth-child(6n+5) {-webkit-animation-delay: 2.0s;  animation-delay: 2.0s;}
.delay-long-list > li:nth-child(6n+6), .delay-long-list > div:nth-child(6n+6) {-webkit-animation-delay: 2.5s;  animation-delay: 2.5s;}
.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%;}
.animation-group{position:relative;}
.animation-group img{position: absolute; width: 100%; height: 0;top:0;left: 0;}
.animation-group img:first-child{position: relative;}
.animation-group.img-box img:first-child{position: absolute;}
.particles { position: absolute; width: 100%; height: 100%; top:0; left: 0; 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{ position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
/*==============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: 87.5%; margin: 0 auto; position: relative; }
.grid-full{width: 96%; margin: 0 auto; position: relative;}
.grid-max { max-width: 1680px;}
.grid-large { max-width: 1440px;}
.grid-middle { max-width: 1200px;}
.grid-small { max-width: 800px;}
.grid-min { max-width: 320px;}
.flex-max, .flex-large, .flex-middle, .flex-small, .flex-min{width: 100%;position: relative;}
.flex-max{max-width: 1280px;}
.flex-large{max-width: 800px;}
.flex-middle{max-width: 640px;}
.flex-small{max-width: 480px;}
.flex-min{max-width: 320px;}
.flex-max p, .flex-large p, .flex-middle p, .flex-small p, .flex-min p{text-align: justify;}
.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,.grid-1-5,.grid-4-5,.grid-3-10,.grid-6-10 { float: left; display: block; position: relative; }
.grid-1-12, .flex-1-12 { width: 8.3%; }
.grid-2-12, .flex-2-12 { width: 16.6%; }
.grid-3-12, .flex-3-12 { width: 25%; }
.grid-4-12, .flex-4-12 { width: 33.3%; }
.grid-5-12, .flex-5-12 { width: 41.6%; }
.grid-6-12, .flex-6-12 { width: 50%; }
.grid-7-12, .flex-7-12 { width: 58.3%; }
.grid-8-12, .flex-8-12 { width: 66.6%; }
.grid-9-12, .flex-9-12 { width: 75%; }
.grid-10-12, .flex-10-12 { width: 83.3%; }
.grid-11-12, .flex-11-12 { width: 91.6%; }
.grid-3-8, .flex-3-8 { width: 38%; }
.grid-5-8, .flex-5-8 { width: 62%; }
.grid-1-5, .flex-1-5 { width: 20%; }
.grid-4-5, .flex-4-5 { width: 80%; }
.grid-1-2, .flex-1-2 { width: 47%; }
.grid-3-10, .flex-3-10 { width: 30%; }
.grid-6-10, .flex-6-10 { width: 60%; }
.grid-space-right,.grid-space-left,.grid-space-right-small,.grid-space-left-small{ box-sizing: border-box;}
.grid-space-right-small{padding-right: 3%;}
.grid-space-left-small{padding-left: 3%;}
.grid-space-right{padding-right: 5%;}
.grid-space-left{padding-left: 5%;}
.grid-right{ float: right;}
.flex-container, .flex-top, .flex-bottom, .flex-center, .flex-stretch, .flex-left, .flex-right, .flex-center-justify, .flex-between, .flex-around, .flex-evenly, .flex-wrap{display: flex;}
.flex-top{ align-items: flex-start;}
.flex-bottom{ align-items: flex-end;}
.flex-center{ align-items: center;}
.flex-stretch{ align-items: stretch;}
.flex-left{ justify-content: flex-start;}
.flex-right{ justify-content: flex-end;}
.flex-center-justify{ justify-content: center;}
.flex-between{justify-content: space-between;}
.flex-around{justify-content: space-around;}
/*.flex-evenly{justify-content: space-evenly;}*//*IE11X*/
.flex-wrap{flex-wrap:wrap;}
.flex-space-right{padding-right: 8.3%;}
.flex-space-left{padding-left: 8.3%;}
.flex-space-right-big{padding-right: 16.6%;}
.flex-space-left-big{padding-left: 16.6%;}
.flex-reverse, .flex-reverse-list .flex-center:nth-child(even){flex-direction:row-reverse;}
.flex-column{flex-direction: column;}
.img-1-2,.img-1-3,.img-2-3,.img-2-5,.img-3-5,.img-3-7,.img-4-7{position:relative;/* box-sizing: border-box;*/}
.img-margin{display: flex; width: auto;margin: -10px;}
.img-margin+.img-margin{margin-top: 10px;}
.img-margin .img-1-2, .img-margin .img-1-3, .img-margin .img-2-3, .img-margin .img-2-5, .img-margin .img-3-5, .img-margin .img-3-7, .img-margin .img-4-7{ padding:10px;}
.img-margin-bottom{margin-bottom:20px;}
.img-margin-top{margin-top:20px;}
.img-1-2{width: 50%;}
.img-1-3{width: 33.3%;}
.img-2-3{width: 66.6%;}
.img-2-5{width: 40%;}
.img-3-5{width: 60%;}
.img-3-7{width: 43%;}
.img-4-7{width: 57%;}
.img-margin .img-box{height: 100%;}
/*============style===============*/
body{font-size: 1em; word-wrap: break-word; word-break: break-word; overflow-x: hidden; color: #333;background-color:#343f30;}
body.style-layout2{background-color:#fff;}
body.computer{background-attachment: fixed;}
p, .text0, .html-edit{ font-size: 1em; line-height:2em; letter-spacing: 0.1em; color:#666;font-weight: 500;}
.bg-dark p, .bg-dark .text0, .bg-dark .html-edit{color:#fff;}
p span, h1 span, h2 span, h3 span, li span, b span, em span, .inline-br, .text-break span, .text0 span{ display: inline-block;max-width: 100%; }
.text-break span{margin-right: 0.2em;}
::selection { background: #475941; color: #fff;}
a { color: #333; }
a:hover {color: #000;}
p a{ text-decoration:underline; }
p a:hover {/*background: #475941; 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,h2,h3,h4, h5, h6 { font-size: 1em;}
body, .body-font{ font-family:"Noto Serif TC", Times,"Times New Roman", "儷宋 Pro", "LiSong Pro Light", "宋体", SimSun, serif;}
.text-font, .justified-gallery > a > .caption, .page, .text-date, .nav-toggle, .text-en1, .text-en2, #nav li em, .footer-nav em, .footer-copyright, .subtitle-en, .text-small, .text-category, .button-icon2, .text-year:after, .header-box .text-box:after, .title-more h2:after, .index-title a p:after, a .text-more:after, .info-list dt, .img-text-list a:after{ font-family:"Lato",Arial, Helvetica, "微軟正黑體", "Microsoft JhengHei", "儷黑 Pro", "LiHei Pro", sans-serif; }
.en-font{font-weight:bold;}
h1,h2,strong { font-weight: 600;}
.title1,.title2,.title3,.title4,.title5,.title6{display: block;line-height: 1.3em;}
.title7{display: block;line-height: 1.45em;}
.title1{font-size: 3em;} 
.title2{font-size: 2.5em;} 
.title3{font-size: 2.25em;} 
.title4{font-size: 1.875em;}
.title5{font-size: 1.5em;}
.title6{font-size: 1.36em;}
.title7{font-size: 1.125em;}
.title8{font-size: 1.5em;line-height: 1.66em;letter-spacing:0.5em;margin-right: -0.5em;}
.title9{font-size: 1.5em;line-height: 1.45em;letter-spacing:0.05em;margin-right: -0.05em;}
.title8+.text-en2{display: block;margin-top: -3px;}
.subtitle1, .subtitle2{line-height: 1.5em;letter-spacing:0.2em;margin-right: -0.2em;margin-top: 0.2em;font-weight: 500;}
.subtitle1:empty, .subtitle2:empty{margin-top: 0;}
.subtitle1{font-size: 1.125em;}
.subtitle2{font-size: 1em;}
.subtitle2 span{display: inline-block;margin-right: 10px;}
.subtitle2 span:empty{margin-right: 0px;}
.text1,.text2{font-size: 1em;letter-spacing: 0.1em;margin-right: -0.1em;font-weight: 500;}
.text1 {line-height: 1.875em;}
.text2 {line-height: 1.6em;}
.text-small{ font-size:0.9375em;line-height: 1.6em;letter-spacing: 0.05em;}
.text-small2{ font-size:0.75em;line-height: 1.5em;letter-spacing: 0;}
.title-en1,.title-en2,.title-en3{display: block;font-weight: bold;letter-spacing: 0;}
.title-en1 {font-size: 1.5em;}
.title-en2 {font-size: 1.25em;line-height: 1.2em;}
.title-en3 {font-size: 1.125em;}
.title-en4 {font-size: 1.0625em;font-weight: bold;letter-spacing: 0;}
.title-en5 {display: block;font-size: 1.25em;line-height: 1.2em;margin-top: 15px;letter-spacing: 0;color: #ccc;}
.title-en5:empty{display: none;}
.text-en1{font-size:12px;line-height: 1.5em;letter-spacing: 0.2em;}
.text-en2, #nav li em, .footer-nav em, .text-year:after, .header-box .text-box:after, .title-more h2:after, .index-title a p:after, a .text-more:after, .img-text-list a:after{display: inline-block;font-size:12px;line-height: 1.8em;letter-spacing: 0.4em;-ms-transform: scale3d(.8,.8,.8);-webkit-transform: scale3d(.8,.8,.8);-moz-transform: scale3d(.8,.8,.8);-o-transform: scale3d(.8,.8,.8);transform: scale3d(.8,.8,.8); transform-origin: left center; }
.text-center .text-en2{transform-origin: center center;}
.text-en3{display: block;font-size:0.8em;line-height: 1.2em;font-weight: bold;letter-spacing: 0;margin-top: 0.2em;}
/*.text-line-height {line-height: 1.6em;}*/
.text-spacing0{letter-spacing:0em !important;}
.text-spacing1{letter-spacing:0.05em !important;}
.text-spacing2{letter-spacing:0.1em !important;}
.text-spacing3{letter-spacing:0.2em !important;}
.text-block{display:block;}
.text-normal{font-weight: normal;}
.color-white { color: #fff; }
.color-black {color: #000;}
.color-gray1 { color: #333;}
.color-gray2 { color: #666;}
.color-gray3 { color: #999;}
.color-gray4 { color: #ccc;}
.color1 { color: #475941;}
.color2 { color: #607f56;}
.color3 { color: #a40000;}
.line-spacing p{margin-bottom: 20px;}
.paragraph p,.paragraph ul,.paragraph ol{margin-bottom: 10px;}
.list-disc li { list-style-type: disc; }
.list-decimal li { list-style-type: decimal; }
.list-decimal li, .list-disc li { margin-left: 25px; }
.text-ellipsis, .footer-nav li a, .breadcrumb-box a, .text-category, .grid-item .subtitle2{ white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 100%;display: block; }
.text-nowrap{ white-space: nowrap;}
.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;}
.text-justify,.line-spacing p{text-align:justify;}
.align-left{ float: left;}
.align-right{ float: right;}
.align-center{ margin: 0 auto;}
.text-bold{ font-weight: bold;}
.text-left{ text-align: left;}
.text-right{ text-align: right;}
.text-center{ text-align:center;}
.text-top{margin-top:10px;}
.text-bottom{margin-bottom:10px;}
.text-top2{margin-top:25px;}
.text-bottom2{margin-bottom:25px;}
.text-top3{margin-top:30px;}
.text-bottom3{ margin-bottom: 30px;}
.box-top{margin-top:40px;}
.box-bottom{ margin-bottom: 40px;}
.box-top2{margin-top:50px;}
.box-bottom2{ margin-bottom: 50px;}
.box-top3{margin-top:60px;}
.box-bottom3{ margin-bottom: 60px;}
.section-top{ margin-top: 80px;}
.section-bottom{ margin-bottom: 80px;}
.section-top2{ margin-top: 110px;}
.section-bottom2{ margin-bottom: 110px;}
.section-top3{ margin-top: 140px;}
.section-bottom3{ margin-bottom: 140px;}
.no-top{margin-top:0!important;}
.no-bottom{margin-bottom:0!important;}
.text-underline{text-decoration: underline; text-decoration-color: #607f56;color:#333;}
.title-underline span{display: inline-block;line-height: 1.1em;border-bottom: solid 1px #607f56;}
.text-line-right span{display: inline-block;position: relative; margin-right: 10px;padding-right: 10px;}
.text-line-right span:after {content: "";display: block;position: absolute;right: 0; top: 50%; margin-top: -0.5em;width: 1px;height: 1em;background: #ccc;}
.text-line-horizontal{position: relative; display: inline-block;}
.text-line-horizontal:after {content: "";display: block;position: absolute;left: 100%; top: 50%;width: 1500px;height:1px;background: #ccc;margin-left: 8px;}
/*============base===============*/
body, html { height: 100%; }
.wrapper { min-height: 100%; width: 100%; position: relative; overflow: hidden; }
.main { position: relative; width: 100%;z-index:2;/*overflow: hidden;*/ }
#footer { position: relative; width: 100%; z-index: 2; min-height: 500px;}
.wrapper .main{ padding-bottom: 500px;}
.wrapper+#footer{ margin-top: -500px;}
/*============nav===============*/
.logo { position:absolute; display: block; width: auto; height:40px;top: 40px; right:2%;margin-right: 80px; z-index: 11;}
.logo:before{content: ""; position: relative;display: block; width:190px;height: 100%; background-image:url("../images/logo.png"); background-position: center center;background-repeat: no-repeat; background-size: contain;image-rendering:-webkit-optimize-contrast;}
.style-layout2 .logo:before{width: 295px; background-image:url("../images/foundation-logo.png");}
#nav{position: fixed; z-index:-1;box-sizing: border-box;font-size: 0; width: 100%;height: 100%; top: 0; left: 0;display: flex;align-items: center;overflow: auto; background-image:url("../images/nav-bg.jpg");background-position: center center;background-repeat: no-repeat; background-size: cover; opacity: 0;}
body.active #nav{ opacity: 1;z-index:101;}
.nav-grid{display:block;margin-left: 10%;}
#nav li > a{position: relative; color: #ccc;}
#nav li {position: relative; display: block;  padding-bottom: 25px;}
#nav li > a{ display:inline-block;}
#nav li strong{position: relative; display: block; font-size: 24px;letter-spacing: 0.05em; line-height: 30px;}
#nav li strong:before{content: "";position: absolute;display: block;left: 100%;top:50%;margin-top: -12px;margin-left: 3px; width: 24px;height: 24px;background:url("../images/ginkgo-w.png") no-repeat center center; background-size: contain; opacity: 0;image-rendering:-webkit-optimize-contrast; }
#nav li.active > a strong:before{ opacity: 1;}
#nav li em{color: #999999;}
#nav li > a:hover, #nav li.active > a{ color: #fff;}
#nav .subnav div{ position:relative; display:block;overflow: hidden;height: 0;}
#nav li.active.subnav div{height:40px;}
#nav .subnav div a{ display:inline-block;font-size: 16px;letter-spacing: 0.15em; line-height:40px;color: #fff;margin-right: 15px;}
#nav .subnav div a:before{background-color: #bbd0aa;bottom: 5px;}
#nav .subnav div a.active, #nav .subnav div a:hover{color: #bbd0aa;}
body.active{overflow: hidden;}

.nav-toggle{position:fixed;display:block; right:2%; top:25px; width: 50px; height: 40px;padding: 15px 10px; z-index:100; cursor:pointer; color:#fff;border-radius: 50%;}
.nav-toggle em{ position: absolute;display: block;font-size: 12px;letter-spacing: 0.1em; bottom:15px;-ms-transform: scale3d(.8,.8,.8);-webkit-transform: scale3d(.8,.8,.8);-moz-transform: scale3d(.8,.8,.8);-o-transform: scale3d(.8,.8,.8);transform: scale3d(.8,.8,.8); transform-origin: left center;}
.nav-toggle:hover{color:#fff;}
.nav-toggle span ,.nav-toggle span:before ,.nav-toggle span:after{ display:block;}
.nav-toggle span{ position:relative; top:50%; background:#fff; height:1px; width:100%;}
.nav-toggle span:before ,.nav-toggle span:after{ content:""; position:absolute; background:#fff; height:1px;right: 0;}
.nav-toggle span:before{ top:-.5em; width: 75%;}
.nav-toggle span:after{ bottom:-.6em; width: 25%; }
body.active .nav-toggle em{opacity: 0;}
body.active .nav-toggle span{ background:none !important; transition:background .2s;}
body.active .nav-toggle span:before{ top:0; transform:rotate(135deg); transition:top .2s .1s,transform .2s .6s; width: 100%;}
body.active .nav-toggle span:after{ bottom:0; transform:rotate(225deg);  transition:bottom .2s .1s,transform .2s .6s; width: 100%;}
body.sticky-page .nav-toggle{background: #343f30;top:15px;}
body.active .nav-toggle{background:none;z-index: 102;}
.header-icon{display: inline-block;}

@media screen and (max-width: 1200px) , (max-height: 700px){
.logo {top: 15px;}
.nav-toggle {top: 0px;}
body.sticky-page .nav-toggle{top:5px;}
}
@media screen and (max-height: 700px), (max-width: 700px) {
#nav{display:block;}
.nav-grid{padding: 65px 0;}
}
@media screen and (max-width: 700px) {
#nav{text-align: center;}
.nav-grid { margin-left: 0;}
#nav li em{transform-origin: center center;margin-bottom: 5px;}
#nav li strong { font-size: 22px;}
#nav li strong:before{display: none;}
#nav li.active.subnav div {height: auto;}
#nav .subnav div{ display: flex; flex-direction: column; align-items: center;}
#nav .subnav div a{margin-right: 0;}
}
@media screen and (max-width: 600px) {
.nav-toggle {width: 45px; height: 35px;}
.nav-toggle span:before {top: -0.4em;}
.nav-toggle span:after { bottom: -0.5em;}
.logo { margin-right: 70px;height: 35px;}
.logo:before {width: 140px;}
.style-layout2 .logo:before {width: 230px;}
}
/*============footer===============*/
#footer{background:url("../images/bg-pattern1.jpg") repeat center center; color:#fff;}
.footer-grid a{color:#fff;}
.footer-grid{padding: 80px 0 40px 0;width: 87.5%;max-width: 1680px; margin: 0 auto;/*overflow: hidden;*/}
.footer-nav{position: relative;display: flex;flex-direction:row;flex-wrap:wrap;justify-content:center;align-items:stretch;align-content:stretch;text-align: center;width: 55%;float: right;}
.footer-nav > li{display: inline-block;width: 16.6%;max-width: 180px; margin-bottom: 40px;vertical-align: text-top;}
/*.footer-nav > li:first-child{margin-left: -4%;}*/
.footer-nav strong{position: relative; display: block; font-size: 20px; line-height: 24px;letter-spacing: 0.05em;}
.footer-nav em{ display: block;transform-origin: center center;margin-bottom:15px;}
.footer-nav li > a{display: block;}
.footer-nav li div{display: flex;flex-direction: column; align-items: center;}
.footer-nav li div a{position: relative; display:inline-block;float: left; clear: left;font-size: 16px;line-height: 40px; letter-spacing: 0.2em;margin-right: -0.2em;color:#ccc;}
.footer-logo, .footer-logo2{display: block; margin-bottom: 20px;height: 40px;}
.footer-logo{width: 180px; background:url("../images/logo2.png") left center no-repeat; background-size: contain;image-rendering:-webkit-optimize-contrast;}
.footer-logo2{width: 340px; max-width: 100%; background:url("../images/foundation-logo.png") left center no-repeat; background-size: contain;image-rendering:-webkit-optimize-contrast;}
.footer-info{max-width: 20%;min-width: 250px; display: inline-block; margin-right:2.5%;margin-bottom: 50px;text-align: left;float: left;}
.footer-info li{position: relative; display:block;}
.footer-info b{display:block; line-height: 25px;padding: 5px 0;letter-spacing: 0.05em;}
.footer-info .text-tel{font-size: 1.25em;letter-spacing:0;}
#google_translate_element{float: left; width: 45%;}
.footer-copyright {position: absolute;right:20px;bottom: 15px; font-size: 12px; line-height: 22px; color: #868b84; text-align: right;}
.footer-copyright a{ color: #868b84!important;display: inline-block;}
.footer-copyright a:hover{text-decoration: underline;color:#fff!important;}
li.footer-icon{ margin-top: 10px;}
.header-icon, .footer-icon{margin-left: -5px;}
.header-icon a, .footer-icon a{position:relative;min-width:40px;height: 40px;line-height: 40px;margin-right: 5px; float: left;display:block; text-align: center;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%; color:#fff;}
.header-icon a:hover, .footer-icon a:hover{background-color:#fff;color:#343f30;}
.header-icon i, .footer-icon i{font-size: 27px;line-height: 40px;}

.button-top{position:absolute; display:block;bottom:100%; right:2%; font-size: 12px;line-height: 25px;width: 55px;padding-bottom: 20px; white-space: nowrap;text-align: center; z-index:-1;opacity: 0;}
.button-top:before{content: "";position:relative;display: block; bottom:0;left: 0;width: 100%;padding-bottom: 120%; background-image:url("../images/icon-top.png"); background-position: center center; background-repeat:no-repeat; background-size: contain;image-rendering:-webkit-optimize-contrast;}
.button-top:hover{padding-bottom: 25px;}
.button-top.active{z-index:2; opacity: 1;}
.bg-dark .button-top:before{background-image:url("../images/icon-top-w.png"); }
/*============html-edit===============*/
.html-edit {position: relative;}
.html-edit a{ text-decoration:underline;}
.html-edit a:hover { text-decoration:none;color:#607f56;}
.html-edit img { max-width: 100%; height:auto !important; }
.html-edit ul, .html-edit ol{line-height: 1.7em;}
.html-edit li { list-style: outside; margin-left: 25px; margin-bottom: 0.5em;}
.html-edit ul li { list-style-type: disc; }
.html-edit ol li { list-style-type: decimal; }
.html-edit iframe{ width: 100%; max-width: 100%;}
.html-edit h1, .html-title1{font-size: 1.5em;}
.html-edit h2, .html-title2{font-size: 1.25em;}
.html-edit h3, .html-title3{font-size: 1.125em;}
.html-edit h1, .html-edit h2, .html-edit h3, .html-title1, .html-title2, .html-title3{display: block; color: #333;font-weight: 600;line-height: 1.5em;margin-bottom: 0.2em;}
.html-edit strong{color: #475941;}
.html-button a, a.html-button, .html-edit a .html-button{position: relative; display:inline-block; padding:10px 20px;background-color: #475941; border-radius: 3px;color: #fff;text-decoration: none;margin: 5px 0;}
.html-button a:hover ,a.html-button:hover, .html-edit a:hover .html-button{background-color:#607f56;color: #fff;-ms-transform: translate3d(2px,2px,0); -moz-transform: translate3d(2px,2px,0); -webkit-transform: translate3d(2px,2px,0); -o-transform: translate3d(2px,2px,0); transform: translate3d(2px,2px,0);}
.html-edit p span, .html-edit h1 span, .html-edit h2 span, .html-edit h3 span, .html-edit li span {display: inline;}
.bg-dark .html-edit h1, .bg-dark .html-edit h2, .bg-dark .html-edit h3, .bg-dark .html-edit span, .bg-dark .html-edit strong, .bg-dark .html-edit a:hover {color:#fff;}
.html-edit table{float: none;}
.html-edit small{letter-spacing: 0.05em;}
/*============googlemaps===============*/
.googlemaps{/*width:100%; */height:500px; position:relative;}
.googlemaps iframe{width: 100%; height: 100%;}
/*============load===============*/
.wrapper/*.main, .header-box*/{opacity: 0;opacity:1\9\0;-webkit-transition: opacity 500ms ease-in; -o-transition: opacity 500ms ease-in; -moz-transition: opacity 500ms ease-in; transition: opacity 500ms ease-in; }
body.loading-complete .wrapper/*.main, body.loading-complete .header-box*/{opacity: 1;}
.loading-content:before{content: "";position: absolute;z-index: 1;display: block;width: 100%;height: 50px;top:200px;left: 0;background: url("../images/loader.gif") no-repeat center center;}
.loading-content .page:before, .loading-content .title-box:before{content: "";position: absolute;z-index: 1;display: block;width: 100%;height: 100%; }
.loading-icon:after{content:"";top:50%;left: 50%;width: 20px;height: 20px; position: absolute;background: url("../images/loader.gif") no-repeat center center; }
/*============button===============*/
.underline a, a.underline{position: relative;display:inline-block;}
.underline a:before, a.underline:before{ position: absolute; content: ""; display: block; height: 1px; width: 0px; bottom: 5px; left: 50%; background-color:#475941; z-index: 1; }
.underline a:hover, .underline a.active{color:#475941;}
.underline.left a:before, a.underline.left:before{ left: 0;}
.underline a:hover:before, .underline a.active:before, a.underline:hover:before{width: 100%; left: 0%;}
.bg-dark .underline a:before, .bg-dark a.underline:before, .underline.white a:before, a.underline.white:before{background-color:#fff;}
.bg-dark .underline a:hover, .bg-dark .underline a.active, .underline.white a:hover, .underline.white a.active, a.underline.white:hover{color:#fff;}
.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: 2px; top:2px;}
.border-line a:after, .border-line a:hover:after{right: 2px; bottom: 2px;}
.border-line a:hover:before, .border-line a:hover:after{ width: calc(100% - 6px); height:calc(100% - 6px);}
.border-line a:hover:before{ border-top: solid 1px #fff; border-left: solid 1px #fff;}
.border-line a:hover:after{ border-bottom: solid 1px #fff; border-right: solid 1px #fff;}

.button-icon{position: relative;font-size: 0;line-height: 0;}
a.button-icon, .button-icon a{position: relative; display:inline-block;height: 50px;width: 45px;line-height: 50px; text-align: center;}
a.button-icon i, .button-icon a i{font-size:30px;line-height:50px;display: block;}
.button-icon a.social-facebook:hover{ color:#3b5998;}
.button-icon a.social-line:hover{color:#00b900;}
.button-icon a.social-youtube:hover{color:#ff0000;}
.button-icon a.social-instagram:hover{color:#ae2352;}
/*.button-icon a.social-instagram:hover{background: #f09433; 
background: -moz-linear-gradient(45deg, #f09433 0%, #e6683c 25%, #dc2743 50%, #cc2366 75%, #bc1888 100%); 
background: -webkit-linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); 
background: linear-gradient(45deg, #f09433 0%,#e6683c 25%,#dc2743 50%,#cc2366 75%,#bc1888 100%); }*/

.button-icon2{position: relative;display: block; font-size: 0;line-height: 0;/*margin-left:-10px;margin-right:-10px;*/}
a.button-icon2, .button-icon2 a{position: relative; display:inline-block;/* height: 50px;*/text-align: center; font-size:14px;line-height:1.3em;padding: 0 10px;color:#475941;}
a.button-icon2 i, .button-icon2 a i{font-size:32px;line-height: 32px;display: block;margin-bottom: 3px;}
a.button-icon2:hover, .button-icon2 a:hover{color:#607f56;}
a.button-icon2 b, .button-icon2 a b{font-weight:normal;}
.button-icon2 .pe-7s-angle-left, .button-icon2 .pe-7s-angle-right{font-size: 48px;margin-left: -5px;margin-right: -5px;}
.bg-dark a.button-icon2, .bg-dark .button-icon2 a{color:#fff;}
.button-icon2.big a{font-size: 15px;margin: 0 5px;}
.button-icon2.big a i{font-size:32px;line-height: 32px;}

.button-icon-text{display: flex;justify-content: center;}
.button-icon-text .grid-item{display: inline-block;font-size: 16px; border-top: solid 1px rgba(153,153,153,.4);border-bottom: solid 1px rgba(153,153,153,.4);}
.button-icon-text .grid-item:before{content: "";position: absolute;right: 0; top:15%;width: 1px; height: 70%;background-color:rgba(153,153,153,.4); }
.button-icon-text .grid-item:last-child:before{display: none;}
a.button-icon-text, .button-icon-text a{position: relative; display:inline-block; padding: 8px 15px 8px 75px;box-sizing: border-box;color: #475941;letter-spacing: 0.1em;line-height: 1.4em;}
.button-icon-text i{font-size:16px;margin-right: 5px;}
.button-icon-text em{font-size:14px;line-height: 14px;letter-spacing: 0;display: block;float: left;margin-left: -65px; margin-top: 3px;}
.button-icon-text .text-back h3{white-space: nowrap;}

.button-text a, a.button-text{position: relative; display:inline-block;font-size:1.125em; letter-spacing: 0.1em; padding: 0.6em 1.2em;line-height: 1.8em;background-color: #475941; border-radius: 5px;color: #fff;text-decoration: none;min-width: 150px; text-align: center;box-sizing: border-box;}
.button-text a{margin-right: 5px;}
.button-text a:hover ,a.button-text:hover{background-color:#607f56;}
.button-text i{margin-right: 5px;}

.share-button{position: absolute;left: 50%; top: 100%; margin-top: 15px;display: inline-block;opacity: 0;pointer-events:none;margin-left: -60px;}
.share-button.active{opacity: 1;pointer-events:auto;}
.share-button a{display: inline-block;width:50px;height: 50px;line-height: 50px;padding: 0 !important;color: #fff!important;text-align:center; overflow:hidden;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;margin: 0 5px;}
.share-button a i{position: relative;left:auto;top:auto;line-height: 50px !important; font-size:30px !important;}
a.share-facebook{background:#3b5998;}
a.share-line{background:#00b900;}
.category-list{ display: inline-block;text-align: center; font-size: 0;}
.category-list li{position: relative; display:inline-block;font-size: 16px; line-height: 20px; letter-spacing: 0.1em; }
.category-list li:before { content: ""; position: absolute; width: 1px; height: 18px; right: -1px; top: 50%; margin-top: -9px; background-color:rgba(153,153,153,.4);}
.category-list li:last-of-type:before{display: none;}
.category-list a{display:inline-block; color:#475941;padding: 7px 20px;}
.category-list li.active a{color: #000;}
.loading-content .page, .loading-content .category-list, .loading-content .select-category{opacity: .7;}
/*============page===============*/
.page {display: inline-block;clear: both;text-align: center; font-size: 0; margin-top: 90px;position: relative;left: 50%; -ms-transform: translateX(-50%); -moz-transform: translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); transform: translateX(-50%);}
.page:empty{display: none;}
.page a {position: relative; min-width:40px; height: 40px; line-height: 40px; display: inline-block;text-align: center;font-size: 16px;color:#475941;border:solid 1px transparent; border-radius: 50%;}
.page a:hover, .page a.active{color:#607f56;}
.page a.active{border:solid 1px rgba(96,127,86,.5);}
.page i{font-size: 18px;vertical-align: text-bottom;}
a.page-prev, a.page-next{font-size: 14px;}
a.page-prev{padding-right:15px;}
a.page-next{padding-left:15px; }
.bg-dark .page a{color:#ccc;}
.bg-dark .page a:hover, .bg-dark .page a.active{color:#fff;}
/*============main===============*/
.main img{width: 100%; height: auto;}
.html-edit img { width: auto;}
.full-box { position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; background-position: center center; background-size: cover; }
.full-box.img-bg:after{z-index: -1;}
.sticky-content .full-box.img-bg:after{z-index: 1;}
.sticky-content .full-box .video-full{opacity: 0;}
.img-bg .img-box, .header-box .img-box, .header-box .img-box-mobile, .full-box .img-box, .full-box .img-box-mobile{ position: relative; top: 0; left: 0; height: 100%; width: 100%; background-position: center center; background-size: cover; image-rendering:-webkit-optimize-contrast;}
.header-ratio .full-box .img-box-mobile{height: 0;padding-bottom: 56.25%;}
.img-fadein .img-box{opacity: 0;}
.header-box, .style-layout2 .wrapper::before{position: relative; box-sizing: border-box;height: 100vh; width: 100%;overflow: hidden;background:url("../images/bg-pattern1.jpg") repeat center center;  color:#fff;}
.bg-dark .header-box:before, .header-box.bg-dark:before{content:"";position: absolute;left: 0;top:0; width: 100%;height: 150px;background-image: -webkit-linear-gradient(rgba(0,0,0,.3), rgba(0,0,0,0)); background-image: -moz-linear-gradient(rgba(0,0,0,.3), rgba(0,0,0,0)); background-image: -o-linear-gradient(rgba(0,0,0,.3), rgba(0,0,0,0));  background-image: linear-gradient(rgba(0,0,0,.3), rgba(0,0,0,0));z-index: 2;}
.header-box .img-box:before, .img-mask-left .img-box:before{content:"";position: absolute;left: 0;top:0; width: 50%;height: 100%;background-image: -webkit-linear-gradient(to right, rgba(0,0,0,.4), rgba(0,0,0,0)); background-image: -moz-linear-gradient(to right, rgba(0,0,0,.4), rgba(0,0,0,0)); background-image: -o-linear-gradient(to right, rgba(0,0,0,.4), rgba(0,0,0,0));  background-image: linear-gradient(to right, rgba(0,0,0,.4), rgba(0,0,0,0));}
.swiper-container.header-box .img-box:before, .content-page .header-box .img-box:before{display: none;}
.img-bg{ position: fixed; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden;}
.img-bg+.main{min-height: 100vh;}

.header-container{position: relative; display: block; box-sizing: border-box; min-height: 100vh;}
@media screen and (orientation:landscape){ 
.full-box .img-box-mobile, .header-box .img-box-mobile{display: none;background-image: none !important;}
}
@media screen and (orientation:portrait){ 
.full-box .img-box, .header-box .img-box-mobile+.img-box{display: none; background-image:none!important;} 
.header-ratio .img-bg{position: absolute;}
.header-ratio .header-container{min-height:auto;padding-bottom:56.25%;margin-top: 80px;overflow: hidden;}
.header-ratio .header-container ~ .wrapper .content-main{padding-top: 0;}
}

.breadcrumb-box{position: absolute;left: 2%;top:45px;padding-left: 65px; color:#fff;z-index: 3;line-height: 40px;font-size: 1.06em;letter-spacing: 0.1em;font-weight: 600;}
.breadcrumb-box:before{content: "";position: absolute;left: 0;top:-15px; width: 55px;height: 55px;background: url("../images/breadcrumb-illustration1.png") no-repeat center center;background-size: contain; image-rendering:-webkit-optimize-contrast;}
.breadcrumb-box a{position: relative; color:#fff;display: inline-block; padding-right: 25px;max-width: 250px;}
.breadcrumb-box a:after{content:"\eaca";display: inline-block;position: absolute;right:0;top: 50%;margin-top: -8px;}
.breadcrumb-box a:last-child{padding-right: 0;}
.breadcrumb-box a:last-child:after{display: none;}
.breadcrumb-box a:hover:before{width: calc(100% - 25px);}
.breadcrumb-box a:last-child:hover:before{width:100%;}

.title-box{position: relative; padding-bottom: 120px;color:#fff;-moz-text-shadow:0 0 15px rgba(0,0,0,1); -webkit-text-shadow:0 0 15px rgba(0,0,0,1); text-shadow: 0 0 15px rgba(0,0,0,1);}
.header-box .title-box{position: absolute; bottom: 0; left: 6%;max-width: 90%;}
.title-text{position: relative; display: inline-block; font-size:2.25em; line-height: 1.33em;letter-spacing: 0.1em;}
.title-box em{position: relative;top: 0.2em;margin-left: 0.4em;margin-right: -1.1em;min-width: 7.3em;}
.title-text2{/*vertical-align:text-top;*/font-size: 0.51em;line-height: 1.7em;display: block;}
.title-text+ul{margin-top: 30px;}
.subtitle-box{position: relative;display: flex;align-items: center;flex-wrap: wrap;white-space: nowrap;margin-bottom: 80px;}
.subtitle-box.small{margin-bottom: 12px;}
.subtitle-box a{position: relative; display: inline-block;font-size: 17px;letter-spacing: 0.2em;height: 45px; line-height: 45px;padding: 0 25px;border-right: solid 1px rgba(153,153,153,.4);}
.subtitle-box a:nth-child(1){border-left: solid 1px rgba(153,153,153,.4);}
.subtitle-box a:hover, .subtitle-box a.active{padding: 0 15px 0 35px;}
.subtitle-box a:before{content: "";position: absolute;left:15px;top:50%;margin-top: -6px; display: block;width: 16px;height: 16px;background-image:url("../images/ginkgo.png"); background-position:center center;background-repeat: no-repeat; background-size: contain; image-rendering:-webkit-optimize-contrast;opacity: 0;}
.subtitle-box a:hover:before, .subtitle-box a.active:before{opacity: 1;}
.subtitle-text{ display: inline-block; font-size: 2.5em;line-height:1em;margin-right: 0.3em;}
.subtitle-en{ display: inline-block; font-size:0.75em; line-height: 1.5em;letter-spacing: 0.2em; margin-right: 2em;}
.subtitle-button{display: flex;flex-wrap: wrap;font-weight: 500;}
.style-layout2 .subtitle-box, .style-layout2 .subtitle-box a{color:#475941;}
.style-layout2 .subtitle-box a:hover, .style-layout2 .subtitle-box a.active{color:#607f56;}
.bg-dark .subtitle-box a:before{background-image:url("../images/ginkgo-w.png");}
.style-layout2 .grid-max>.subtitle-box{margin-top: -45px;}

.bg-dark .header-box .text-box{ background-image: -webkit-linear-gradient( rgba(53,64,49,.8), rgba(53,64,49,1)); background-image: -moz-linear-gradient( rgba(53,64,49,.8), rgba(53,64,49,1)); background-image: -o-linear-gradient( rgba(53,64,49,.8), rgba(53,64,49,1));  background-image: linear-gradient( rgba(53,64,49,.8), rgba(53,64,49,1));}
.bg-dark .header-box .text-box{position: absolute;left: 0; bottom: 0; padding: 2.5%;padding-right: 100px; margin-bottom:-20px;max-width: 100%;/* align-items: stretch; display: flex;*/}
.bg-dark .header-box .text-box div{/*display: inline-block; */float: left; display:block; max-width: 650px; margin-bottom:20px;padding-right:30px;}
.bg-dark .header-box a .text-box:after{content: "READ\aMORE";position: absolute;right: 0; top:20%;height: 60%;width: 120px;white-space: pre-line;text-align: center;border-left:solid 1px rgba(153,153,153,.4);transform-origin: right center;display: flex;align-items: center;justify-content: center;}

.header-border+.main:before{content:""; position:relative; display: block; left: 0; width: 100%; height: 140px; background-image:url("../images/ginkgo-mask1.png");background-size: auto 100%; background-position: left top;z-index: -1; image-rendering:-webkit-optimize-contrast;}
.header-border{overflow:visible;}
.header-border .img-box{position: fixed;}
.header-border .title-box:before{content:""; position:absolute; display: block;left: 0; bottom: 0; width: 70px;height: 75px; background-image:url("../images/ginkgo-head.png"); background-position: left top; background-repeat: no-repeat; background-size: contain;image-rendering:-webkit-optimize-contrast;}
.header-mask .img-box:after, .header-mask2 .img-box:after, .header-mask3 .img-box:after{content:""; position:absolute; display: block;left: 0; bottom: 0; width:100%;height: 600px; background-image:url("../images/header-mask1.png"); background-position: left bottom; background-repeat: no-repeat; background-size: contain;}
.header-mask2 .img-box:after{background-image:url("../images/header-mask2.png");}
.header-mask3 .img-box:after{background-image:url("../images/header-mask3.png");}

.grid-container{position: relative; box-sizing: border-box; padding: 140px 0 140px 0;}
.grid-container-small{position: relative; box-sizing: border-box; padding: 110px 0 110px 0;}
.grid-container-bottom{position: relative; padding-bottom: 140px;}
.grid-container-small-bottom{position: relative; padding-bottom: 110px;}
.grid-container-min-top{position: relative; padding-top: 40px;}
.img-bg+.main .grid-container{padding-top: 180px;}
.style-layout2 .grid-container{padding-top: 110px;}
.style-layout2 .wrapper:after{content:"";position: absolute;top: 99px;left: 3.5%; display: block;width: 65px;height: 75px;background:url("../images/breadcrumb-illustration2.png") no-repeat center center; background-size: contain;image-rendering:-webkit-optimize-contrast;}
.style-layout2 .wrapper:before{content: "";height: 100px;display: block;}
.style-layout2 .header-box{height:auto; width: 87.5%;}

.content-button{text-align: center;margin-bottom: -20px;}
.content-button .button-text, .content-button .button-icon2{display: inline-block;vertical-align: top;margin-bottom: 20px;}
.content-button .button-text a{white-space: nowrap;}
.style-layout2 .content-title{position: relative; width: 100%;justify-content: space-between; display: flex;flex-direction: row-reverse;}
.content-category{position: relative; text-align: right; padding-top: 1.8em; font-size:1.125em; margin-left: 15px;}
.content-category:before{content:"";position: absolute;top:0;right: 0; display: block;width:4.5em;height:1.3em;background-image:url("../images/icon-foundation-red.png") ;background-position: center top; background-repeat: no-repeat; background-size:contain; image-rendering:-webkit-optimize-contrast;}
.content-category strong{display: block; white-space: nowrap;}
.content-category em{ white-space: nowrap;}
.content-title .grid-middle{display: flex;}
.bg-dark .content-category{ margin-right: 1.8em;margin-top: 0.5em; margin-left: 0;}
.bg-dark .content-category:before{background-image:url("../images/ginkgo-more.png") ;}
.bg-dark.content-page .header-box+.main .content-title{position: absolute;bottom: 100%;left: 0; width: 100%;padding-top: 50px;box-sizing: border-box; background-image: -webkit-linear-gradient( rgba(53,64,49,.8) 0%, rgba(53,64,49,1) 100%); background-image: -moz-linear-gradient( rgba(53,64,49,.8) 0%, rgba(53,64,49,1) 100%); background-image: -o-linear-gradient(rgba(53,64,49,.8) 0%, rgba(53,64,49,1) 100%); background-image: linear-gradient( rgba(53,64,49,.8) 0%, rgba(53,64,49,1) 100%);}
.bg-dark.content-page .header-box+.main > .grid-container:first-child{padding-top:1px;margin-top: -40px;}

.text-box{ position:relative; box-sizing: border-box;}
.text-box p{text-align: justify;}
.text-date{ display:inline-block;font-size:0.86em;letter-spacing: 0;text-transform: uppercase; }
.text-date-group{ display: block;letter-spacing: 0;line-height:1.4em;white-space: nowrap;}
.text-date-group li{position: relative; display: inline-block;font-size: 1.66em;font-weight: bold;}
.text-date-group small{display: block; font-size: 0.55em; margin-right: 0.2em;}
.text-date-group li:nth-child(2){margin-left: 26px;}
.text-date-group li:nth-child(2):before{content:""; position: absolute;display: block;right:100%; bottom:25%; width: 20px;height: 1px;margin-right: 4px; background: #999;}
.text-year-group{ display: block;}
.text-year-group span{position: relative; display: inline-block;letter-spacing: 0;font-size: 1.875em;line-height:1em;font-weight: bold;}
.text-year-group span:first-child{margin-right: 67px;}
.text-year-group span:first-child:before{content:""; position: absolute;display: block;left:100%; bottom:50%; width: 50px;height: 1px;margin-left: 7px; background: #999;}
.bg-dark .text-year-group span:first-child:before{background: #fff;}
.text-year{font-size: 1.875em;line-height: 1em; display: block;font-weight: bold;}
.text-year:after{content: "YEAR";display: block;letter-spacing: 0.2em;}

.title-more a h2:after{content:"MORE";letter-spacing: 0.2em; display: inline-block;background: url("../images/ginkgo-w.png") no-repeat;background-size: contain;image-rendering:-webkit-optimize-contrast; height: 20px; padding-top: 15px; padding-left: 35px; margin-left: 8px;vertical-align: bottom;}
.text-more, .index-title a p{position: relative;padding-bottom: 30px;}
a .text-more:after, .index-title a p:after{content:"MORE";display: inline-block; position: absolute; left: 0;bottom:0;padding: 0 7px 0 12px; line-height: 20px; border-radius: 10px; background: #303b2c;color:#fff; opacity: .6;}
a:hover .text-more:after, .index-title a:hover p:after{opacity: 1;bottom:-4px;}
.bg-dark a .text-more:after, .bg-dark .index-title a p:after{background: #fff;color:#303b2c;}
.bg-light a .text-more:after, .bg-light .index-title a p:after{background: #303b2c;color:#fff;}
.text-number{display: block;font-size:2em;line-height: 1em; white-space: pre-line;}
.text-number.small{font-size:1.5em;}
.text-number.big{font-size:2.8em;}

.dialog{position: relative;display: inline-block;font-weight: 600;}
.dialog:before, .dialog:after{position: absolute; font-size: 1.5em;line-height: 1em;}
.dialog:before{content:"“"; right: 100%;top: 0.1em;margin-right: 0.3em;}
.dialog:after{content:"”"; left: 100%;bottom: -0.2em;margin-left: 0.3em;}
.dialog-inside, .dialog-outside {position: relative;}
.dialog-inside .dialog, .dialog-outside .dialog{position: absolute;left: 8%;bottom: 5%; color: #fff;text-align: left;}
.dialog-outside .dialog {left: -4%;-moz-text-shadow:0 0 15px rgba(0,0,0,1); -webkit-text-shadow:0 0 15px rgba(0,0,0,1); text-shadow: 0 0 15px rgba(0,0,0,1);}

.grid-item{ position:relative; box-sizing: border-box;}
.grid-item p{ text-align: justify;}
.item-list, .item-list-2, .item-list-3, .item-list-4, .item-list-5{position: relative;overflow: hidden;}
/*.item-list{margin-bottom: 140px;}*/
.item-list .grid-item{margin-bottom: 110px;}
.item-list .grid-item:last-child{margin-bottom: 0;}
.item-list-2 .grid-item, .item-list-3 .grid-item, .item-list-4 .grid-item, .item-list-5 .grid-item{ float:left;display: block; box-sizing: border-box;}
.item-list-4 .grid-item a, .item-list-3 .grid-item a{position: relative; display:block;}
.item-list-2{width:106%; margin-bottom: -5%;}
.item-list-2 .grid-item{ width:44%; margin-right: 6%;margin-bottom: 5%;}
.item-list-3{width:105%; margin-bottom: -4%;}
.item-list-3 .grid-item{ width:28.3%; margin-right: 5%;margin-bottom: 4%;}
.item-list-4{width:104%; margin-bottom: -3%;}
.item-list-4 .grid-item{ width:21%; margin-right: 4%;margin-bottom: 3%;}
.item-list-5{width:103%; margin-bottom: -3%;}
.item-list-5 .grid-item{ width:17%; margin-right: 3%;margin-bottom: 3%; }
.item-list-2 .img-box+.text-box, .item-list-2 .plyr+a .text-box, .item-list-3 .img-box+.text-box, .item-list-3 .plyr+a .text-box, .item-list-4 .img-box+.text-box, .item-list-4 .plyr+a .text-box, .item-list-5 .img-box+.text-box, .item-list-5 .plyr+a .text-box{margin-top: 25px;}
.style-layout2 .item-list-3 .img-box, .style-layout2 .item-list-4 .img-box, .style-layout2 .other-list .img-box{-moz-box-shadow:0px 0px 10px rgba(0,0,0,.15); -webkit-box-shadow:0px 0px 10px rgba(0,0,0,.15);box-shadow: 0px 0px 10px rgba(0,0,0,.15); background-color: #ddd;}
.img-list{margin-left: -25px;margin-right: -25px;margin-bottom: -50px;}
.img-list a{display: block;float: left; box-sizing: border-box;padding:0 25px;width: 33.3%;margin-bottom: 50px;}
.img-list a p{margin-top: 15px;}
.img-list a p:empty{display: none;}
.img-text-list{width: 100%;}
.img-text-list .grid-item{ border-top: solid 1px #ddd; border-bottom: solid 1px #ddd;margin-top: -1px;}
.img-text-list .grid-item a{display: flex; align-items: center;background-color: transparent;padding-right: 60px;}
.img-text-list .grid-item a:hover{background-color: #eee;}
.img-text-list .img-box{width: 200px;height: 112px;}
.img-text-list .text-box{display: inline-block;padding-left: 4%;}
.img-text-list .text-box:first-of-type{width: 45%;}
.img-text-list .text-box:nth-of-type(2){width: 35%;}
.img-text-list a:after{content: "READ\aMORE";position: absolute;right: 0; top:0;height: 100%;padding: 0 5px; white-space: pre-line;text-align: center;transform-origin: right center;display: flex;align-items: center;justify-content: center; color: #475941;}

.icon-new strong:before, .icon-hot strong:before, .activity-type1 strong:before, .activity-type2 strong:before, .activity-type3 strong:before{ display: inline-block; color:#fff; line-height: 20px;height: 20px;letter-spacing: 0; margin-right:8px;padding: 0 8px; border-radius: 3px;vertical-align: text-bottom;}
.icon-new strong:before, .icon-hot strong:before{ font-size:12px;}
.icon-new strong:before{content: "NEW";background:#607f56;}
.icon-hot strong:before{content: "HOT";background:#a40000;} 
.bg-dark .icon-new strong:before, .bg-dark .icon-hot strong:before{color: #ddd;}

.text-category{color:#999;font-weight: normal;display: block;margin-top: 15px;font-size: 15px;line-height: 1.75em;letter-spacing: 0.05em;}
.text-category span:nth-of-type(2):before, .content-title h2 span:nth-of-type(2):before{content: "";display: inline-block;vertical-align: text-bottom;height:1.05em;width:1.7em; background:url("../images/ginkgo-s.png") no-repeat center center; background-size: contain;image-rendering:-webkit-optimize-contrast;}
.text-category span:nth-of-type(2):empty:before{display: none;}
.bg-dark .text-category{color:#bbb;}

.info-list{position: relative;/*display: block;*/text-align: left;border-top: solid 1px #ddd;border-bottom: solid 1px #ddd; display: flex; align-items: stretch;flex-wrap: wrap;}
.info-list:empty{display: none;}
.info-list a:hover{color:#607f56;}
.info-list > div{position: relative;box-sizing: border-box;display:flex;align-items: center;padding: 25px 0 25px 90px;min-height: 105px;width: 33.3%;border-top: solid 1px #ddd;border-bottom: solid 1px #ddd;margin-bottom: -1px;}
.info-list dd{display: block;width: 100%;box-sizing: border-box;line-height:1.7em; font-weight: 500;}
.info-list dt{position:absolute; top: 50%; margin-top: -27px;left: 0;width: 85px; font-size:15px;line-height:15px;letter-spacing: 0; color:#607f56;text-align: center;white-space: nowrap;}
.info-list dt i{font-size:32px;line-height: 32px;display: block;margin-bottom: 5px;}
.info-list div strong{display: block;font-size:24px;font-weight: bold;line-height: 1.2em;margin-bottom:0.2em;}
.info-list div em{font-size:18px;font-weight: bold;}
.info-list div.info-style1 dd{line-height: 1.5em;}
.info-list div.info-style2{font-size:17px;}
.info-list div.info-style3{width: 100%;}
.info-list div.info-style3 dd{letter-spacing: 0.1em;}
.info-list div.info-style3 dt{top:27px; margin-top:0;}
.info-list > div:nth-of-type(1), .info-list > div:nth-of-type(2), .info-list > div:nth-of-type(3){border-top: solid 1px transparent;}
.info-list div.info-style3{border-top: solid 1px #ddd;}
.info-list div.info-style3:first-child{border-top: solid 1px transparent;}
.info-list.width-auto{border: none;}
.info-list.width-auto > div{width:auto;margin-right: 35px;border: none;padding-top: 10px;padding-bottom: 10px; min-height: 80px;}
.bg-dark .info-list dt{color:#fff;}
.bg-dark .info-list a:hover{color:#fff;}

.dot-list li{position: relative;box-sizing: border-box;padding-left: 1.2em; line-height:2em;}
.dot-list li:before{content:"";position: absolute;display: block; left: 0.4em; top: 0.8em;width: 4px;height: 4px;border-radius: 50%;background-color: #666;}
.list-style-none:before{display: none;}
.text-list li{margin-bottom: 10px;display: flex;}
.text-list strong{display: inline-block;letter-spacing: 0.05em; color:#000; margin-right: 13px; white-space: nowrap;}
.text-list p{display: inline-block;}

.bg-line1, .bg-line2{background-color:#fff ; background-position: top center;}
.bg-line1{background-image: url("../images/bg-line1.png");}
.bg-line2{background-image: url("../images/bg-line2.png");}
.bg-dark{background-color:#343f30; background-image: url("../images/bg-pattern1.jpg");background-size: auto;}
.bg-dark, .bg-dark a, .bg-dark2 a{color: #fff;}
.bg-dark.bg-line1{background-image: url("../images/bg-line1-b.png"), url("../images/bg-pattern1.jpg");}
.bg-dark.bg-line2{background-image: url("../images/bg-line2-b.png"), url("../images/bg-pattern1.jpg");}
.bg-dark2{background-color:#2b3228;color: #fff; background-image: url("../images/bg-pattern2.jpg");background-size: auto;}
.bg-light{background-color:#eee; background-image: url("../images/bg-pattern3.jpg");}
.bg-light, .bg-light a, .bg-light p{color: #343f30;}
.bg-white{background-color:#fff;}

.img-caption{ position:absolute; display:block; bottom:15px; font-size: 0.9375em; line-height: 1.4em; color:#fff; z-index:1; left:0; padding: 0 15px; width: 100%; box-sizing: border-box; text-align:right;-moz-text-shadow:1px 1px 10px rgba(0,0,0,.6); -webkit-text-shadow:1px 1px 10px rgba(0,0,0,.6); text-shadow: 1px 1px 10px rgba(0,0,0,.6); }
.img-box,.img-over-box{ position:relative; display: block; overflow:hidden; }
.img-box{background-position: center center; background-repeat: no-repeat; background-size:cover; }
.img-ratio56 .img-box{padding-bottom:56.25%; }
.img-ratio66 .img-box{padding-bottom:66.66%; }
.img-ratio150 .img-box{padding-bottom:150%; }
.img-ratio100 .img-box{padding-bottom:100%; }
.img-over-box img{ width:100%; height:auto;}
.img-box img{ position: absolute; top: 0; right: 0; bottom: 0; left: 0; margin: auto; width:100%; height:100%;}
a .img-hover{opacity: 0;}
a:hover .img-hover{opacity: 1;}
.img-box.height img{ width:auto; height:100%; }
/*a.video .img-box:before, a.video .img-over-box:before, .justified-gallery .video:before,.swiper-slide a.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:rgba(45,103,45,.5);padding: 10% 7%; box-sizing: border-box;}
a:hover .back-box, .back-box.active{ color: #fff; filter: alpha(opacity=100); opacity: 1;}
.img-gray .img-box{;-webkit-filter: grayscale(50%); -moz-filter: grayscale(50%); -ms-filter: grayscale(50%); -o-filter: grayscale(50%); filter: grayscale(50%); filter: gray;}
.img-gray a:hover .img-box{webkit-filter: grayscale(0%);-moz-filter: grayscale(0%);-ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%);filter: none;}
.img-mask-bottom .img-box:before{content: "";display: block;position: absolute;width:100%;height: 100%;right: 0;bottom:0;z-index: 1; background-image: -webkit-linear-gradient( to top, rgba(0,0,0,.3) 0%, rgba(0,0,0,0) 50%); background-image: -moz-linear-gradient( to top, rgba(0,0,0,.3) 0%, rgba(0,0,0,0) 50%); background-image: -o-linear-gradient( to top, rgba(0,0,0,.3) 0%, rgba(0,0,0,0) 50%); background-image: linear-gradient( to top, rgba(0,0,0,.3) 0%, rgba(0,0,0,0) 50%);}
img.img-height{height: 100%;}
.text-inside .text-box{position: absolute;left: 0;top:0;width: 100%;height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; background-color:rgba(0,0,0,.5) ; opacity: 0; color:#fff;z-index: 1;line-height: 1.6em;}
.text-inside .text-box:empty{display: none;}
.text-inside a:hover .text-box{opacity: 1;}
.text-inside .text-box:after{content: "";display:block;margin: 0 auto; margin-top: 10px; width: 20px; height: 25px; background: url("../images/ginkgo-w.png") no-repeat center center;background-size: cover;image-rendering:-webkit-optimize-contrast;}
.text-inside a .img-over-box:after, .text-inside a .img-box:after{display: none !important;}
.about-illustration2, .art-illustration1, .service-illustration1, .service-illustration2{position: absolute;image-rendering:-webkit-optimize-contrast;background-position: left top;background-repeat: no-repeat;background-size:contain;}
.about-illustration2{width: 6.5em; height: 8em;}
.about-illustration2 div{ position: absolute;display: block;width: 100%;height: 100%; background-size:contain;background-repeat: no-repeat; image-rendering:-webkit-optimize-contrast;}
.about-illustration2 div:nth-child(1){background-image: url("../images/about-illustration2-1.png");}
.about-illustration2 div:nth-child(2){background-image: url("../images/about-illustration2-2.png");}
.about-illustration2 div:nth-child(3){background-image: url("../images/about-illustration2-3.png");}
.about-illustration2.small{width: 5.3em;height: 6.8em;}
.about-illustration2.small div{background-size: 122% auto;}
.art-illustration1{background-image:url("../images/art-illustration1.png");width: 3em;height: 2.3em;}
.service-illustration1{background-image:url("../images/service-illustration1.png");width: 2em;height: 3.5em;}
.service-illustration2{background-image:url("../images/service-illustration2.png");width: 2.6em;height: 1.5em;}
/*==============index==================*/
.index .header-box{z-index: 3;}
.index .button-top:before{background-image:url("../images/icon-top.png");}
.index .button-top{color:#475941;}
.index-box{position: absolute;z-index: 1;top: 0; left: 0; width: 100%; height: 100%;display: flex;align-items: center;justify-content: center; color: #fff;text-align: center; background-color: rgba(0,0,0,.2);}
a .index-box{color: #fff;}
.index-box div{max-width: 100%;}
.index-box img{width: 100%; max-width: 500px;height: auto;}
.index-box h1{letter-spacing: 0.1em;line-height: 1.875em;-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);}
.index .grid-container-bottom, .index .grid-container{min-height: 450px;box-sizing: border-box;}
.index .grid-container{position: relative; padding: 9% 0 9% 0;}
.index .grid-container-bottom{position: relative; padding-bottom: 9%;}
.index .grid-container-bottom:first-child{padding-top: 9%;}
.index-title{display: inline-block;}
.index-title h1{position: relative; font-size: 3em;letter-spacing: 0.2em;line-height: 1.2em;margin-bottom: 0.5em;}
.index-title p{white-space: nowrap;}
.index-title h1:before{content: ""; position: absolute;display: block; background-repeat: no-repeat;background-position: center center;background-size: contain;image-rendering:-webkit-optimize-contrast;}
#index-about .index-title h1:before{width: 1.6em; height: 1.3em; top: 1.4em; left: 0.2em; background-image: url("../images/about-illustration1.png");}
#index-project .index-title h1:before{width: 2.7em;height: 3.4em; bottom: 0.1em;left: 1.1em; background-image: url("../images/project-illustration1.png");}
#index-portfolio .index-title h1:before{width: 1.3em;height: 2em;top: 0.1em;left: 1.2em; background-image: url("../images/portfolio-illustration1.png");}
#index-news .index-title h1:before{width: 3em; height: 1em;top: 1.4em;left: 1.6em; background-image: url("../images/news-illustration1.png");}
#index-exhibition .index-title h1:before{width: 8.4em;height: 9.2em; max-width: 401px;top: 0em;right: 0.4em; background-image: url("../images/exhibition-illustration1.png");}
#index-activity .index-title h1:before{width: 2.3em;height: 3.2em;bottom: 0.05em;left: 1em; background-image: url("../images/activity-illustration1.png");}
#index-news:before{content:"";position: absolute; display: block;left: 0;bottom: 100%; width: 100%; height: 1725px; margin-bottom: -150px; background: url("../images/bg-dark-line1.png") no-repeat left center;image-rendering:-webkit-optimize-contrast;z-index: -1;}
#index-about{background: url("../images/bg-dark-line2.png") no-repeat right top;image-rendering:-webkit-optimize-contrast;}
#index-about .grid-max{box-sizing: border-box; padding-right: 25%;}
#index-about .index-title{position: absolute;right:0;bottom: 50px;width: 24%;}
#index-project .grid-max{box-sizing: border-box; padding-left: 20%;}
#index-project .index-title, #index-news .index-title, #index-activity .index-title{position: absolute;left: 0;top: 0;}
#index-project .index-title:before, #index-project .index-title:after{content:"";position: absolute; display: block;background-size: contain;}
#index-project .index-title:before{left: 2em;top: 100%; margin-top: 6em;width: 5em;height: 3em;background-image: url("../images/project-illustration2.png");}
#index-project .index-title:after{left: 10em;top: 100%;margin-top: 13em; width: 3.9em; height: 4.05em;background-image: url("../images/project-illustration3.png");}
.index .project-list .text-box{position: relative;padding: 0;left: auto; right: -1px; background-color:#343f30; background-image: url("../images/bg-pattern1.jpg");}
.index .project-text h1, .index .project-list .button-icon2, .index .project-list .project-info {border-left: none; padding-right: 0;}
.index .project-list .text-box>div>div:last-child{margin-right:0;}
#index-portfolio .index-title p{margin-top: -8em;margin-left: 7.6em;}
#index-portfolio .index-title{padding-top:6em;padding-bottom: 5em;}
.portfolio-illustration{ position: absolute;display: block;top:-2em;left: 17em; width: 13.5em; height: 8.9em;}
.portfolio-illustration div{ position: absolute;display: block;width: 100%;height: 100%; background-size:contain;background-repeat: no-repeat;image-rendering:-webkit-optimize-contrast;}
.portfolio-illustration div:nth-child(1){background-image: url("../images/portfolio-illustration2-1.png");}
.portfolio-illustration div:nth-child(2){background-image: url("../images/portfolio-illustration2-2.png");}
.portfolio-illustration div:nth-child(3){background-image: url("../images/portfolio-illustration2-3.png");}
#index-news .grid-large{box-sizing: border-box; padding-left: 350px;padding-top: 130px;}
#index-exhibition .grid-max{text-align: right;}
#index-exhibition .index-title{padding-bottom: 11.5em;text-align: left;}
#index-exhibition .index-title h1{display: inline-block;}
#index-exhibition .index-title p{margin-top: -5em;margin-left: 8em;}
#index-activity .grid-large{box-sizing: border-box; padding-left: 300px;}

/*==============about==================*/
.about .about-illustration2{left: 1.5em;top: -2.6em;}
.about .header-border+.main:before{height: 0;padding-bottom: 27.6%; background-size: auto 100%; background-image:url("../images/ginkgo-mask2.png"); background-position: center top;}
.about .header-border .title-box:before{display: none;}
.about .flex-6-12{margin-top: -20%;}
.about-img2{max-width: 680px;margin-left: -355px;}
#about1 p{white-space: nowrap;}
#about2{min-height: 800px;}
#about2 .art-illustration1{top: 0.2em;left: 4.5em;}
.about .button-top{color:#fff; }
.about .button-top:before{background-image:url("../images/icon-top-w.png"); }
/*==============feature==================*/
.feature .about-illustration2{left: 1.5em;top: -4.1em;}
.feature .main p{white-space: nowrap;}
/*==============history==================*/
.history .about-illustration2{ top: -2.8em; left: -2em;}
.history .main{background-color: rgba(0,0,0,.3);}
.history .title-text{margin-top: 2em;margin-bottom: 1.8em; margin-left: 1em;}
.history-list .grid-item{margin-bottom: 50px;}
.history-list .grid-item:last-of-type{margin-bottom: 0;}
.history-list .text-box{display: inline-block;vertical-align: top;margin-right:1.5em;margin-bottom:1em;max-width: 100%;}
.history-list p{display: inline-block;vertical-align: top; max-width: 100%;}
/*==============team==================*/
.team .about-illustration2{ top: -1.4em;left: 1.5em;}
.team-list{display: flex; justify-content: space-between;flex-wrap: wrap; padding-top: 5%;margin-bottom: -50px;}
.team-list .grid-item{width: 22%;max-width: 340px;text-align: center;margin-bottom: 50px;}
.team-list img{height: 130px; width: auto;}
.team-list em{transform-origin: center center;}
/*.team-list p{text-align: left;}*/
.team-img-list .img-over-box img{height: 300px;width: auto;}
.team-img-list .swiper-slide{width: auto;}
/*==============foundation==================*/
.foundation .header-box{height: calc(100vh - 250px);}
.foundation .header-box .img-box{height:100%;}
.foundation .header-box .text-box{position: absolute; left: 3%;top: 7%;-moz-text-shadow:0 0 15px rgba(0,0,0,.7); -webkit-text-shadow:0 0 15px rgba(0,0,0,.7); text-shadow: 0 0 15px rgba(0,0,0,.7);}
.foundation .header-box .text-box small{display: inline-block;max-width: 300px;}
#foundation2{position: relative; }
#foundation2 .text-box{position: absolute; left: 6.25%;top:0; z-index: 1; }
img.foundation-logo1{width: 135px;margin-right: 45px;}
img.foundation-logo2{display: none;}
.foundation-list{position: relative;text-align: center;}
.foundation-list .grid-item img{width: 100px; height: auto;margin-left: 30px; margin-right: 30px;}
.foundation-list .foundation-icon2 img{width: 110px;margin-left: 20px; margin-right: 20px;}
.foundation-list .grid-item{display: flex;align-items: center;margin-bottom: 50px;}
.foundation-list .grid-item:last-child{margin-bottom: 0;}
/*.foundation-list p{text-align: left;}*/
.foundation-list em{transform-origin: center center;}

@media screen and (min-width: 1201px){
img.foundation-logo2{position: absolute;display: block; width: 15%;left: 50%;margin-left: -9%;top: 10%;}
.foundation-list .grid-item{width: 41%;}
.foundation-icon1{position: absolute; left:57%;top:20%;}
.foundation-icon2, .foundation-icon3{flex-direction:row-reverse;}
.foundation-icon1 p{max-width: 480px;}
.foundation-icon2 p, .foundation-icon3 p{max-width: 400px;}
.foundation-icon3 {margin-left: 3%;}
}
/*==============activity==================*/
.activity-type1 strong:before, .activity-type2 strong:before, .activity-type3 strong:before{font-size:15px;}
.activity-type1 strong:before{content: "活動報名";background:#a40000;}
.activity-type2 strong:before{content: "住戶限定";background:#607f56;}
.activity-type3 strong:before{content: "報名額滿";background:#666666;}
.info-box{text-align: right;}
.content-page .info-box{position: relative;font-size: 1.125em; margin-left: 15px;}
.activity-type1 .info-box, .activity-type2 .info-box, .activity-type3 .info-box, .exhibition-type1 .info-box, .exhibition-type2 .info-box, .exhibition-type3 .info-box{ padding-right: 3.5em;}
.activity-type1 .info-box:before, .activity-type2 .info-box:before, .activity-type3 .info-box:before, .exhibition-type1 .info-box:before, .exhibition-type2 .info-box:before, .exhibition-type3 .info-box:before{position: absolute;top:0;right: 0; display: block;padding-bottom: 0.8em; white-space: pre-line; font-size: 1.35em; line-height:1.25em;font-weight: 600;background-position: center bottom; background-repeat: no-repeat; background-size: 95% auto;image-rendering:-webkit-optimize-contrast;}
.activity-type1 .info-box:before{content: "活動\a報名";color:#607f56;background-image:url("../images/icon-foundation.png");}
.activity-type2 .info-box:before{content: "住戶\a限定";color:#607f56;background-image:url("../images/icon-foundation.png");}
.activity-type3 .info-box:before{content: "報名\a額滿";color:#607f56;background-image:url("../images/icon-foundation.png");}
/*.activity-type1 .info-box:before{content: "活動\a報名";color:#a40000;background-image:url("../images/icon-foundation-red.png");}
.activity-type2 .info-box:before{content: "住戶\a限定";color:#607f56;background-image:url("../images/icon-foundation-green.png");}
.activity-type3 .info-box:before{content: "報名\a額滿";color:#a40000;background-image:url("../images/icon-foundation-red.png");}*/
.activity-full{display: block; letter-spacing: 0.1em; margin-bottom: 40px; margin-top: -30px;text-align: center;}
/*==============exhibition==================*/
.exhibition-head-list+.exhibition-list {margin-top: 140px;}
.exhibition-head-list .flex-4-12{position: relative;}
.exhibition-head-list .info-box{position: absolute; top: 4%;right: 0;font-size: 1.125em;max-width: 70%;}
.exhibition-head-list .text-box{width: 100%; margin-bottom: 4%;}
.exhibition-list .info-box{ color:#999;margin-top: 10px;}
.exhibition-list .text-date-group{font-size: 0.9em;}
.exhibition-list .text-date-group li:nth-child(2):before{background: #ccc;}
.exhibition-type1 .info-box:before{content: "當期\a展覽";color:#607f56;background-image:url("../images/icon-foundation.png");}
.exhibition-type2 .info-box:before{content: "預告\a展覽";color:#607f56;background-image:url("../images/icon-foundation.png");}
.exhibition-type3 .info-box:before{content: "經典\a展覽";color:#607f56;background-image:url("../images/icon-foundation.png");}
/*.exhibition-type1 .info-box:before{content: "當期\a展覽";color:#a40000;background-image:url("../images/icon-foundation-red.png");}
.exhibition-type2 .info-box:before{content: "預告\a展覽";color:#607f56;background-image:url("../images/icon-foundation-green.png");}
.exhibition-type3 .info-box:before{content: "經典\a展覽";color:#607f56;background-image:url("../images/icon-foundation-green.png");}*/
/*==============visit==================*/
.header-img{position: relative; display: block;background-position: center center;background-size: cover; color:#fff;}
.header-img img{width: 100%; height: auto;}
.header-img .text-box{position: absolute;-moz-text-shadow:0 0 15px rgba(0,0,0,.7); -webkit-text-shadow:0 0 15px rgba(0,0,0,.7); text-shadow: 0 0 15px rgba(0,0,0,.7);}
.visit .header-img{width: 100%;height: 430px;}
.visit .content-title{flex-direction: row;}
/*==============foundation-contact==================*/
.foundation-contact .flex-7-12{min-height: 650px;background-image:url("../images/foundation-contact-head.jpg");background-size: cover; background-position: center bottom;}
.foundation-contact .flex-4-12>div{width: 100%;}
.foundation-contact .flex-4-12{min-width: 500px;}
/*==============news==================*/
.bg-dark .other-list h3{color:#ccc;}
@media screen and (min-width: 701px){
.news-list .text-box{position:relative; width: 100%;margin-top: 0 !important ;padding-left: 5%;padding-right: 5%;padding-top: 8%;padding-bottom: 15%;}
}
@media screen and (min-width: 1401px){
.news-list .grid-item:nth-child(3n+2) .text-box{padding-top: 15%;padding-bottom: 8%;}
.news-list .grid-item:nth-child(3n+2), .news-list .grid-item:nth-child(3n+2) a {display: flex; flex-direction: column-reverse; justify-content: flex-start;}
}
@media screen and (max-width: 1400px) and (min-width: 701px){
.news-list .grid-item:nth-child(even) .text-box{padding-top: 15%;padding-bottom: 8%;}
.news-list .grid-item:nth-child(even), .news-list .grid-item:nth-child(even) a {display: flex; flex-direction: column-reverse; justify-content: flex-start;}
}
/*==============project==================*/
.project-list .text-box{position: absolute;z-index: 1; bottom: 0; left: 0;background-color:rgba(53,64,49,.92);padding: 0 2.5%;}
.project-list .text-box>div{overflow: hidden;display: flex;flex-wrap: wrap;margin-bottom: -20px;padding: 3% 0;}
.project-list .text-box h1{line-height: 1em;}
.project-text, .project-list .button-icon2{margin-left: -25px;}
.project-text{display: flex;flex-wrap: wrap;margin-right: 25px;}
.project-list .text-box>div>div:last-child{margin-right: -25px;}
.project-list h1, .project-list .button-icon2, .project-list .project-info{padding: 0 25px;border-left: solid 1px rgba(153,153,153,.4);margin-bottom: 20px;}
.project-list .button-icon2{padding: 0 18px;}
.computer .project-info a{display: inline-block;}
.project-info b{display: block;}
.project-info .text-add{padding-top: 0.1em;font-weight:600;font-size: 1.125em;}
.project-info .text-tel{font-size: 1.5em;line-height: 1em;}
.project-list .button-icon{position: absolute;right: 0;top: 15px; z-index: 1;display: none;}
.project-list .text-box.active .button-icon{-ms-transform: rotate(180deg); -moz-transform: rotate(180deg); -webkit-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg);}
/*.project-list .text-box, .project-text, .project-text a, .project-info{max-width: 100%;}*/
/*==============portfolio==================*/
.portfolio .header-box:after{content:"";position: absolute;left: 0;top:0; width: 100%;height: 100%;background: url("../images/bg-mask.png") repeat;z-index: 2;}
.portfolio .select-category{ margin-left: 65px;float: left;}
.portfolio-list{width: 40%; max-width: 600px;float: right;}
.portfolio-list .grid-item{padding:20px 0 20px 9%;border-left: solid 1px rgba(255,255,255,.5);}
.portfolio-list .text-year{margin-left: -15px;padding: 10px 0;}
.portfolio-list a:hover, .portfolio-list a.active{color:#bbd0aa;}
.portfolio-list.title-more a:hover h2:after, .portfolio-list.title-more a.active h2:after{background: url(../images/ginkgo-g.png) no-repeat;background-size: contain;}
/*==============service==================*/
/*.service .header-box{height: 0;padding-bottom: 66.66%;}*/
.service .service-illustration1{left: 100%; top: 0;}
.service .service-illustration2{left: -0.6em; bottom: -0.1em;}
/*==============lohas==================*/
.lohas .service-illustration1{bottom: 0;left: 100%;}
/*==============art==================*/
.art .art-illustration1{top: 2em; left: 5.6em;}
#art1 p{ max-width:600px;}
#art2 p{text-align: center;}
#art3 h2{text-align: right;}
/*==============life==================*/
.life .service-illustration1{left: 2.2em; top: -2.3em;}
.life .service-illustration2{left: -0.6em; bottom: -0.1em;}
/*==============thoughtful==================*/
.thoughtful .service-illustration2{left: -0.6em; top: 1.3em;}
.thoughtful .title-text2{text-align: right;}
#thoughtful1 .flex-6-12:last-child{text-align: center;}
#thoughtful1 .flex-6-12:last-child img{max-width: 600px;}
/*==============gardening==================*/
.gardening .service-illustration1{bottom: 0;left: 1.4em;}
.gardening .title-text2{text-align: right;}
/*==============contact==================*/
.contact .header-box .img-box:before{display: none;}
.contact .text-box{width: 60%; max-width: 600px;float: right;}
.contact .info-list{ width: 40%;max-width: 380px;float: right;}
.bg-dark form .subtitle-box em{color:#fff;}
.contact .info-list > div { width: 100%;}
/*==============form==================*/
#form-content{display: none;max-width: 800px;}
.message_form h3{font-weight: bold;}
input, button, textarea, select{color: #333;}
form { position: relative; display: block;letter-spacing: 0.05em;text-align: left; font-weight: 500;}
form .input-column,form .input-row{ position: relative; display: block; line-height:0; margin:0; width:100%;min-height:40px; box-sizing: border-box;}
form .input-column{float:left; width:50%;}
form .input-column:nth-child(odd){width:48%; margin-right: 2%;}
label { position: absolute; height: 40px;font-size: 16px;top: 10px;left: 0; line-height: 40px; display: block; white-space: nowrap;}
input[type="checkbox"] + label, input[type="radio"] + label{position: relative; display:inline-block; margin-top: 0;height: 28px;line-height:28px; padding-left:22px;font-weight: 600;}
input[type="checkbox"], input[type="radio"] { display:none;}
input[type="checkbox"] + label:before { content: ""; position: absolute; display:block;left: 1px;top:50%; margin-top: -7px;width:10px; height:10px;border:solid 2px #607f56; border-radius:3px;}
input[type="checkbox"] + label:after{content: "";position: absolute; display:block;left: 0;top:50%;margin-top: -9px; width:18px; height:18px;font-size: 18px;}
input[type="checkbox"]:checked + label:before{ border:solid 2px transparent;}
input[type="checkbox"]:checked + label:after{content: "\eed9";color:#607f56;}
input[type="checkbox"]:disabled + label, input[type="radio"]:disabled + label{opacity: .5;}
input[type="checkbox"]:disabled + label:before{border:solid 2px rgba(136,136,136,.7);}
input[type="checkbox"]:disabled:checked + label:after{color:#888;opacity:.7;}
input[type="radio"] + label:before { content: ""; position: absolute; display:block;left: 1px;top:50%; margin-top: -8px;width:12px; height:12px;border:solid 2px #607f56; border-radius:50%;}
input[type="radio"] + label:after{content: "";position: absolute; display:block;left:5px;top:50%;margin-top: -4px; width:8px; height:8px;border-radius:50%;}
input[type="radio"]:checked + label:after{background-color:#607f56; }
input[type="radio"]:disabled + label:before{border:solid 2px rgba(136,136,136,.7);}
input[type="radio"]:disabled:checked + label:after{background-color:#888;opacity:.7;}
input[type="text"], input[type="password"], input[type="tel"], input[type="email"], input[type="date"], select, textarea, .input-box{line-height: 40px; padding: 10px 0 10px 100px; height: 60px; width: 100%; background-color:transparent; box-sizing: border-box;border-bottom: solid 1px rgba(153,153,153,.4);}
::-webkit-calendar-picker-indicator { opacity: 0.5;margin-left: 5px;}
textarea { height: 120px; line-height: 24px;padding-top: 18px;}
select {position: relative; -webkit-appearance: none;-moz-appearance: none;appearance:none; padding-right:30px; background-image: url(../images/icon-select.png);background-repeat: no-repeat; background-position:right center;background-size:auto 20px; padding-right: 0 \9; background-image: none \9; image-rendering:-webkit-optimize-contrast; }
select.full{padding-left: 13px;}
*::-ms-backdrop, select{ padding-right: 0!important;background-image:none!important; }/*IE11*/
/*select{ color: #333;}*/
select option, select.active { color:#333; }
select option:checked, select option:active, select option:focus, select option:hover{background:#607f56; color:#fff;}
.input-box{height: auto; min-height: 60px;}
.input-box label{position: relative; display:inline-block;top:auto; white-space: normal;}
.input-box.full {padding-top: 0; padding-bottom: 0;}
.input-box select{width: auto; padding-left: 12px;margin-bottom: -1px;}
.input-box input{padding-left: 0;width: auto;}
.input-box select:nth-child(2)+label{ margin-left:15px;}
form small { display: inline-block;width: 13px;color: #607f56;vertical-align:middle;}
form em { display: inline-block;font-size: 12px;color: #607f56;margin-left: 4px;letter-spacing: 0;vertical-align:top;}
.ime-disabled{ime-mode: disabled;}
input[type="text"]:focus, input[type="password"]:focus, input[type="tel"]:focus, input[type="email"]:focus, input[type="date"]:focus, textarea:focus, select:focus { border-bottom: solid 2px rgba(96,127,86,.7); }
input[type="text"].error, input[type="password"].error, input[type="tel"].error, input[type="email"].error, input[type="date"].error, textarea.error, select.error,.input-box.error { border-bottom:dotted 2px rgba(164,0,0,.7);}
img.rand-img { position: absolute; right: 0px; bottom: 2px; width:120px; height:58px;cursor: pointer;}
input[type="reset"], input[type="submit"], #submit, #reset, #submitBtn{-webkit-appearance: none; position: relative; height: 50px; display: inline-block;width:200px; text-align:center;font-size: 18px;letter-spacing: 0.1em; font-weight: 600; line-height:50px; color: #fff; cursor: pointer; -webkit-border-radius:3px; -moz-border-radius:3px; border-radius:3px; background-color:#475941; text-decoration: none;}
#submit i, #reset i, #submitBtn i{margin-right: 5px;}
input[type="reset"]+input[type="submit"], #reset+#submit, #reset+#submitBtn{width: 50%;}
input[type="reset"], #reset{background-color: #555555;width: 48%;margin-right: 1.5%;}
#submit span, #reset span, #submitBtn span{display: inline-block;margin-left: 7px;}
input[type="submit"]:hover, input[type="reset"]:hover, input[type="reset"]:focus, input[type="submit"]:focus, #submit:hover, #reset:hover, #submitBtn:hover{}
input[type="button"], input[type="file"], input[type="button"]:focus, input[type="file"]:focus{ background:transparent; cursor: pointer; padding-right:5px;text-decoration: underline; color: #475941;}
input[type="button"]:hover, input[type="file"]:hover{ text-decoration:none; }
.input-button{ margin-top: 30px;font-size: 0;float: right;}
input:-webkit-autofill,input:-webkit-autofill:hover, input:-webkit-autofill:focus, input:-webkit-autofill:active  {/*-webkit-box-shadow: 0 0 0 40px #333 inset !important;*/transition: background-color 5000s ease-in-out 0s;}
input:-webkit-autofill {-webkit-text-fill-color: #475941 !important;}/*Change Chrome fill*/
.input-text{ position: relative; display: block; min-height: 25px; line-height: 25px; padding-top:20px;float: left;color:#666;}
.input-text a{ display:inline-block;color:#666;}
.hide-box{ font-size: 15px;line-height: 24px;letter-spacing: 0.05em;text-align: justify;font-weight: normal; padding-top: 20px; color:#666;}
.form-link{ text-decoration: underline; display: inline-block;}
.form-link:hover{ text-decoration: none;}
::placeholder,::-webkit-input-placeholder{ color:#aaa;}
:-ms-input-placeholder{color: #aaa;}
::-moz-placeholder{ color: #aaa; opacity: 1;}
.form-caption{position: absolute;right: 0; top:0;}
input[type="text"].input-household{padding-left: 0;width: 40%;float: left;}
select.input-know{width: 60%;}

.bg-dark input, .bg-dark button, .bg-dark textarea, .bg-dark select{color: #fff;}
.bg-dark select { background-image: url(../images/icon-select-w.png);}
.bg-dark .input-text, .bg-dark .input-text a, .bg-dark .hide-box{color:#fff;}
.bg-dark form small {color: #9fbc7a;}
.bg-dark input:-webkit-autofill {-webkit-text-fill-color: #fff !important;}
/*.bg-dark ::placeholder,::-webkit-input-placeholder{ color:#aaa;}
.bg-dark :-ms-input-placeholder{color: #aaa;}
.bg-dark ::-moz-placeholder{ color: #aaa; opacity: 1;}*/

select.select-category, .select-category select, .select-category input{display:inline-block; height: 45px; line-height: 45px; font-size: 17px;letter-spacing: 0.1em;padding:0 50px 0 25px;border-bottom:none;width:auto;min-width: 180px;background-position: right 20px center;}
.select-category input{letter-spacing: 0.05em;}
select.select-category.border-white, .select-category.border-white select{border: solid 1px rgba(255,255,255,.5);padding: 0 40px 0 15px;background-position: right 10px center;}
.subtitle-box select{border-right: solid 1px rgba(153,153,153,.4);}
.subtitle-box select:first-of-type{border-left: solid 1px rgba(153,153,153,.4);}
.style-layout2 .subtitle-box select{color: #475941;background-image: url(../images/icon-select-g.png);}

/*select.select-category:focus, .select-category select:focus{border-width:1px;}*/
/*.select-category option { }*/
/**::-ms-backdrop, .select-category{ padding-right: 0;background-image:none; }*/
/*============swiper===============*/
.swiper-wrapper-center .swiper-wrapper{justify-content: center; }
.swiper-wrapper-center .swiper-slide:last-of-type{margin-right: 0!important;}
.swiper-container.button-full { width: 100%; height: 100%;}
.swiper-slide {overflow: hidden;}
/*.swiper-slide-active{-ms-transform: translateZ(0)!important;-webkit-transform: translateZ(0)!important;transform: translateZ(0)!important;}//parallax.no fade*/
/*.swiper-lazy-preloader{z-index: 100;}*/
/*.swiper-pagination-bullet:focus, .swiper-button-next:active, .swiper-button-prev:active{border: none;}*/
.swiper-pagination-bullet { width: 11px; height: 11px;margin: 0!important;padding:4px; background:transparent; opacity: .7;}
.swiper-pagination-bullet:hover{ opacity: 1;}
.swiper-pagination-bullet-active{ width: 13px; height: 13px;opacity: 1;}
.swiper-pagination-bullet:before{ content: "";display: block; width: 100%;background: #fff;height: 11px;border-radius: 50%;}
.swiper-pagination-bullet-active:before{ height: 13px;}
.swiper-button-next, .swiper-button-prev{width: 50px;background-size: 20px 30px;} 
.swiper-button-next{right:0;opacity: 0;}
.swiper-button-prev{left:0;opacity: 0;}
.swiper-container:hover .swiper-button-next{right:5px;opacity: 1;}
.swiper-container:hover .swiper-button-prev{left:5px;opacity: 1;}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled{opacity: 0;}
.swiper-container:hover .swiper-button-next.swiper-button-disabled, .swiper-container:hover .swiper-button-prev.swiper-button-disabled {opacity: 0;}
.swiper-lazy{opacity: 0;-webkit-transition: opacity 500ms ease-in; -o-transition: opacity 500ms ease-in; -moz-transition: opacity 500ms ease-in; transition: opacity 500ms ease-in;}
.swiper-lazy-loaded{opacity: 1;}
.swiper-slide img{width: 100%; height: auto;}
.swiper-container.button-outer .swiper-pagination{position: relative;margin-top: 40px;margin-bottom: -10px;}
.swiper-container.button-outer .swiper-pagination-bullet:before{ background: #ccc;}
.swiper-container.button-full .swiper-pagination {bottom: 50px;}
.swiper-container-fade .swiper-slide .full-box div{transition:transform 1s linear 2s;transform:scale(1.1,1.1);}
.swiper-container-fade .swiper-slide-active .full-box div, .swiper-container-fade .swiper-slide-duplicate-active .full-box div{transition:transform 6s linear;transform:scale(1,1);}
/*============mb.YTPlayer===============*/
.inline-YTPlayer{max-width:inherit!important;height: 100%;}
/*.mbYTP_wrapper{ padding: 160px 0!important; margin: -160px 0!important; }*//*YTtitle Hide XX未滿版設定的橫式會裁切*/
.inlinePlayButton{ width: 50px;height: 50px; line-height: 50px;font-size: 26px;transform: scale(1);/*left: auto;right: 25px; top: auto;bottom: 80px;*/}
.mb_YTPlayer:hover .inlinePlayButton, .inlinePlayButton:hover { transform: scale(1.1) !important;}
.mb_YTPBar{z-index: 9!important;}
.video-box{background-attachment: inherit!important;}
.video-full, .video-bg{ padding-bottom:0!important; height: 100% !important; width: 100%; background-attachment: inherit !important;}
.video-full .mbYTP_wrapper iframe{width: 100% !important; height: 100% !important;margin-left: 0 !important;margin-top: 0 !important;}
/*.video-full .mbYTP_wrapper iframe{width: 100% !important; height: 56.25% !important;margin-left: 0 !important;margin-top: 0 !important;}*/
.swiper-container .inlinePlayButton{/*right: 40px; bottom: 100px;*/ z-index: 10;}
@media screen and (max-width: 800px) {
.inlinePlayButton{ width: 40px;height: 40px; line-height:40px;font-size: 20px;}
}
/*============plyr===============*/
.plyr__control--overlaid{ background: rgba(96,127,86,.8) !important;}
.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{background:#607f56 !important;}
.plyr--audio .plyr__control.plyr__tab-focus,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#607f56 !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:#607f56 !important;color:#fff}
.plyr__menu__container label.plyr__control input[type=radio]:checked+span{background:#607f56 !important;}
.plyr--full-ui input[type=range]{color: #607f56 !important;}
.plyr__control--overlaid{z-index: 3!important;}
.box-dark .plyr button{color: #fff;}
/*============lazy===============*/
img.lazy,picture.lazy img{background-image: url("../images/loader.gif"); background-repeat: no-repeat; background-position: 50% 50%; }
img.lazy.lazy-loaded, picture.lazy.lazy-loaded img{background-image:none;}
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;}
/*============IcoFont===============*/
.icon-map:after, .icon-tel:after, .icon-link:after, input[type="checkbox"] + label:after, .html-button a:before, a.html-button:before, a .html-button:before, .breadcrumb-box a:after, .img-fadein:after{ font-family: IcoFont;speak: none;font-style: normal;font-weight: 400;font-variant: normal; text-transform: none;white-space: nowrap; word-wrap: normal;direction: ltr; line-height: 1; -webkit-font-feature-settings: "liga"; -webkit-font-smoothing: antialiased;}
/*.icon-map:after, .icon-tel:after, .icon-link:after{display: inline-block;width: 22px;height: 22px;line-height: 22px;text-align: center; background:#475941;color:#fff; -webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}*/
.icon-map:after{content: "\ef79";margin-left: 3px;}
.icon-tel:after{content: "\efbb";margin-left: 3px;}
.icon-link:after{content: "\ef71";margin-left: 3px;}
.html-button a:before, a.html-button:before, a .html-button:before{content: "\ef71";margin-right: 3px;}
/*============pe-icon-7-stroke===============*/
.justified-gallery > .entry-visible, a[data-fancybox] .img-over-box, a[data-fancybox] .img-box, a.video .img-box:before, a.video .img-over-box:before, .justified-gallery .video:before,.swiper-slide a.video:before{font-family: 'Pe-icon-7-stroke'; speak: none;font-style: normal; font-weight: normal; font-variant: normal; text-transform: none; line-height: 1; -webkit-font-smoothing: antialiased;}
a.video .img-box:before, a.video .img-over-box:before, .justified-gallery .video:before,.swiper-slide a.video:before{ content:"\e624"; position:absolute; height:100%; width:100%; z-index:1;font-size: 48px; display: flex; align-items: center; justify-content: center;color:#fff;}
/*============justifiedGallery===============*/
.justified-gallery > a > .caption{ display: block; opacity: 0;padding:10px;font-size: 15px;letter-spacing: 0.1em;background-color:rgba(139,110,99,.85);z-index: 1;}
.justified-gallery > a > .caption.caption-visible{ opacity: 1;}
.justified-gallery > a:after, a[data-fancybox] .img-over-box:after, a[data-fancybox] .img-box:after{content:"\e63e"; position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; background-color: rgba(0,0,0,.5); opacity: 0;color:#fff;}
.justified-gallery > a.video:after, a[data-fancybox].video .img-over-box:after, a[data-fancybox].video .img-box:after{ content: "\e624";}
.computer .justified-gallery > a:hover:after,  a[data-fancybox]:hover .img-over-box:after, a[data-fancybox]:hover .img-box:after{opacity: 1;font-size: 48px;}
/*============fancybox===============*/
.fancybox-button {background: transparent;}
.fancybox-thumbs{/*background: rgba(0,0,0,.5);*/background: #000;}
.fancybox-thumbs__list a:before {border: 4px solid rgba(255,255,255,.8);}
.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-track{background:#222;}
.fancybox-thumbs-y .fancybox-thumbs__list::-webkit-scrollbar-thumb{background:#555;}
.fancybox-construction {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-is-open .fancybox-bg {opacity: .97;}*/
.fancybox-bg {background: #000;}
.fancybox-slide--html {padding: 0;}
.fancybox-slide--html .fancybox-close-small {position: fixed;padding: 0;top:10px;right: 15px;color:#fff;}
.fancybox-content { padding: 70px 80px; border-radius: 5px;}  
.bg-dark .fancybox-content{background: #343f30;}
/*.fancybox-caption{white-space: pre-line;}*/
.fancybox-green .fancybox-bg {background: #121b0f;}
/*.fancybox-thumbs {top: auto; width: auto; bottom: 0; left: 0; right : 0; height: 95px; padding: 10px 10px 5px 10px; box-sizing: border-box; background: rgba(0, 0, 0, 0.3);}
.fancybox-show-thumbs .fancybox-inner {right: 0; bottom: 95px; }*/
/*============datetimepicker===============*/
.xdsoft_datetimepicker{width: 84%; max-width: 320px;padding:0;}
.xdsoft_datetimepicker{ z-index: 99999;}
.xdsoft_datetimepicker .xdsoft_datepicker {margin-left: 0;width: 100%;}
.xdsoft_datetimepicker .xdsoft_calendar td, .xdsoft_datetimepicker .xdsoft_calendar th{height: 35px;font-size: 15px;font-weight: bold;}
.xdsoft_datetimepicker .xdsoft_label { line-height: 25px; font-size: 15px;}
.xdsoft_datetimepicker .xdsoft_year {width: 60px;}
.xdsoft_datetimepicker .xdsoft_next, .xdsoft_datetimepicker .xdsoft_prev, .xdsoft_datetimepicker .xdsoft_today_button {height: 35px;width: 25px;}
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_today { color: #607f56;}
.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option.xdsoft_current {background:#475941;}
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_default, .xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current, .xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div.xdsoft_current { background: #475941 ; box-shadow: #343f30 0 1px 3px 0 inset ; color:#fff;}
.xdsoft_datetimepicker .xdsoft_calendar td.xdsoft_current.xdsoft_disabled:hover,
.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box>div>div.xdsoft_current.xdsoft_disabled:hover {background: #a40000 !important;box-shadow: #6e0000 0 1px 3px 0 inset !important;}
.xdsoft_datetimepicker .xdsoft_label > .xdsoft_select > div > .xdsoft_option:hover {background: #a40000 !important;}
.xdsoft_datetimepicker .xdsoft_calendar td:hover,.xdsoft_datetimepicker .xdsoft_timepicker .xdsoft_time_box >div >div:hover {background: #a40000 !important;}
@media screen and (max-height: 600px) {
.xdsoft_datetimepicker{top: 10px !important; bottom: auto !important;}
}
@media screen and (max-width: 600px) {
.xdsoft_datetimepicker{left: 8% !important; max-width: none;}    
}
/*============fullpage===============*/
.fp-section{overflow: hidden;}
.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;}
/*#fp-nav ul li, .fp-slidesNav ul li { width: 20px; height: 20px; margin: 0;}
#fp-nav ul li a.active span, #fp-nav ul li:hover a.active span{height: 10px;width: 10px;margin-left: -5px;border-radius: 0;}
#fp-nav ul li a span,#fp-nav ul li:hover a span{ height: 1px; width: 10px;margin-left: -5px; border-radius: 0;background: #fff; border-bottom:solid 2px #ddd;}
#fp-nav ul li:hover a span{height: 10px;}*/
#fp-nav ul li a span,#fp-nav ul li:hover a span{background: #fff; /*border-bottom:solid 2px #ddd;*/}
.section #footer{ margin-top:0!important;}
/*============ie/lightbox===============*/
.ie, .lightbox-container { position: fixed; -webkit-transform: translateZ(0); transform: translateZ(0); display: block; top: 0; left: 0; z-index: 200; height: 100%; width: 100%; background: rgba(0,0,0,.9); 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;}
a.ie-close { position:fixed; -webkit-transform: translateZ(0); transform: translateZ(0); display: block; width: 50px; height: 35px; right: 0; top: 0; text-align: center; padding-top: 15px; color:#fff;}
a.lightbox-close {position:fixed;top: 10px; right: 10px; z-index: 1;}
body.lightbox{overflow:hidden !important;}
.lightbox-container, .lightbox-item{ display: none;}
.lightbox-container.active{display: block;}
.lightbox-item.active{ display: block;}
.lightbox-bg{ position: fixed; -webkit-transform: translateZ(0); transform: translateZ(0); 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; margin-top: 5%;}
.lightbox-item{ position: relative; margin: 0 auto; width: 85%; padding: 10% 0;}
.lightbox-item .hidden {opacity: 1;}

@media screen and (orientation:landscape) and (min-height: 551px) {
.about .header-box .img-box{background-image:url("../images/about-head.jpg");}
#about2 .img-box{background-image:url("../images/about-head2.jpg");}
.feature .header-box .img-box{background-image:url("../images/feature-head.jpg"); background-position: center top;}
.contact .header-box .img-box{background-image:url("../images/contact-head.jpg"); background-position: center top;}
.team .header-box .img-box{background-image:url("../images/team-head.jpg"); background-position: center top;}
.foundation .header-box .img-box{background-image:url("../images/foundation-head.jpg");background-position: center bottom;}
.service .header-box .img-box{background-image:url("../images/service-head2.jpg"); background-position: center top;}
.art .header-box .img-box{background-image:url("../images/art-head.jpg");}
.lohas .header-box .img-box{background-image:url("../images/lohas-head2.jpg"); background-position: right center;}
.life .header-box .img-box{background-image:url("../images/life-head.jpg");}
.thoughtful .header-box .img-box{background-image:url("../images/thoughtful-head.jpg"); background-position: left bottom;}
.gardening .header-box .img-box{background-image:url("../images/gardening-head.jpg"); background-position: center bottom;}
.store .header-box .img-box{background-image:url("../images/store-head.jpg");}
}
@media screen and (orientation:landscape) and (max-height: 550px){
.about .header-box .img-box{background-image:url("../images/mobile/about-head.jpg");}
#about2 .img-box{background-image:url("../images/mobile/about-head2.jpg");}
.feature .header-box .img-box{background-image:url("../images/mobile/feature-head.jpg"); background-position: center top;}
.contact .header-box .img-box{background-image:url("../images/mobile/contact-head.jpg"); background-position: center top;}
.team .header-box .img-box{background-image:url("../images/mobile/team-head.jpg"); background-position: center top;}
.foundation .header-box .img-box{background-image:url("../images/mobile/foundation-head.jpg");background-position: center bottom;}
.service .header-box .img-box{background-image:url("../images/mobile/service-head2.jpg"); background-position: center top;}
.art .header-box .img-box{background-image:url("../images/mobile/art-head.jpg");}
.lohas .header-box .img-box{background-image:url("../images/mobile/lohas-head2.jpg"); background-position: right center;}
.life .header-box .img-box{background-image:url("../images/mobile/life-head.jpg");}
.thoughtful .header-box .img-box{background-image:url("../images/mobile/thoughtful-head.jpg"); background-position: left bottom;}
.gardening .header-box .img-box{background-image:url("../images/mobile/gardening-head.jpg"); background-position: center bottom;}
.store .header-box .img-box{background-image:url("../images/mobile/store-head.jpg");}
}
@media screen and (orientation:portrait){ 
.about .header-box .img-box{background-image:url("../images/mobile/about-head-m.jpg");}
#about2 .img-box{background-image:url("../images/mobile/about-head2-m.jpg");}
.feature .header-box .img-box{background-image:url("../images/mobile/feature-head-m.jpg"); background-position: right top;}
.contact .header-box .img-box{background-image:url("../images/mobile/contact-head-m.jpg"); background-position: center bottom;}
.team .header-box .img-box{background-image:url("../images/mobile/team-head-m.jpg"); background-position: center bottom;}
.foundation .header-box .img-box{background-image:url("../images/mobile/foundation-head-m.jpg");background-position: center bottom;}
.service .header-box .img-box{background-image:url("../images/mobile/service-head-m2.jpg"); background-position: center top;}
.art .header-box .img-box{background-image:url("../images/mobile/art-head-m.jpg");}
.lohas .header-box .img-box{background-image:url("../images/mobile/lohas-head-m2.jpg"); background-position: center bottom;}
.life .header-box .img-box{background-image:url("../images/mobile/life-head-m.jpg");}
.thoughtful .header-box .img-box{background-image:url("../images/mobile/thoughtful-head-m.jpg"); background-position: center bottom;}
.gardening .header-box .img-box{background-image:url("../images/mobile/gardening-head-m.jpg"); background-position: center bottom;}
.store .header-box .img-box{background-image:url("../images/mobile/store-head-m.jpg"); background-position: center bottom;}
}
@media screen and (min-width: 1001px){
.history-list .grid-item:nth-child(4n+1){left: 6%;}
.history-list .grid-item:nth-child(4n+3){left: 4%;}
.history-list .grid-item:nth-child(4n+4){left: 2%;}
#art3 h3{margin-top: 33%;}
#art3 .flex-4-12:last-child{margin-top:-5%;}
}
@media screen and (max-width: 1600px){
#footer{ min-height: 650px;}
.wrapper .main{ padding-bottom: 650px;}
.wrapper+#footer{ margin-top: -650px;}
.footer-nav {width: 72%;}
.footer-info{float: none;max-width: 25.5%;}
#google_translate_element{float: none; width:auto;}
/*============main===============*/
.item-list-5{width:104%;}
.item-list-5 .grid-item{ width:21%; margin-right: 4%;}
.item-list-4{ width:105%; margin-bottom: -4%;}
.item-list-4 .grid-item{ width:28.3%; margin-right: 5%; margin-bottom: 4%;}  
}
@media screen and (max-width: 1600px) and (min-width: 1401px) {
}

@media screen and (max-width: 1500px) { 
.text-top{margin-top:5px;}
.text-bottom{margin-bottom:5px;}
.text-top2 {margin-top: 15px;}
.text-bottom2 {margin-bottom: 15px;}
.text-top3 {margin-top: 20px;}
.text-bottom3 {margin-bottom: 20px;}
.box-top{margin-top:30px;}
.box-bottom{ margin-bottom: 30px;}
.box-top2{margin-top:40px;}
.box-bottom2{ margin-bottom: 40px;}
.box-top3 { margin-top: 50px;}
.box-bottom3 { margin-bottom: 50px;}
.section-top{margin-top: 60px;}
.section-bottom{margin-bottom: 60px;}
/*============other===============*/ 
#foundation2 .text-box{position: relative;margin-bottom: -8%;}
.index-title{font-size: 0.9375em;}
#index-about{background-size: 1200px auto;}
#index-news:before {background-size: 1200px auto;}
#index-news .grid-large { padding-left: 290px;}
#index-activity .grid-large {padding-left: 230px;}
.project-list .text-box{font-size: 0.875em;}
.project-text, .project-list .button-icon2{margin-left: -15px;}
.project-text{margin-right: 15px;}
.project-list .text-box>div>div:last-child{margin-right: -15px;}
.project-text h1, .project-list .button-icon2, .project-list .project-info{padding: 0 15px;}
.project-list .text-box>div {padding: 25px 0;}
a.button-icon2, .button-icon2 a{font-size: 13px; padding: 0 7px;}
a.button-icon2 i, .button-icon2 a i{margin-bottom: 1px;font-size: 26px;line-height: 26px;}
.bg-dark .header-box .text-box{ padding-top:25px; padding-bottom:25px;}
}

@media screen and (max-width: 1600px) and (min-width: 1001px) {
#feature1 p{white-space:normal;}
#feature1 p br{display: none;}
}
@media screen and (max-width: 1400px) { 
/*============main===============*/
.hide-w1400{ display: none !important;} 
.item-list-3{ width: 105%;margin-bottom: -5%;}
.item-list-3 .grid-item{ width: 44%;margin-right: 6%;margin-bottom: 5%;}
.info-list > div{width: 50%;}
.img-margin{margin: -5px;}
.img-margin+.img-margin{margin-top: 5px;}
.img-margin .img-1-2, .img-margin .img-1-3, .img-margin .img-2-3, .img-margin .img-2-5, .img-margin .img-3-5, .img-margin .img-3-7, .img-margin .img-4-7{padding:5px;}
.img-margin-bottom{margin-bottom:10px;}
.img-margin-top{margin-top:10px;}
/*============other===============*/
.about-img2{margin-left: -340px;}
.exhibition-head-list .info-box{font-size: 1em;top: 0;}
.exhibition-head-list .text-box { margin-bottom: 0;}
#index-news .grid-item:nth-child(3){display: none;}
#index-project .index-title:after{display: none;}
}
@media screen and (max-width: 1400px) and (min-width: 1001px){
.exhibition-head-list .text-box p { display: -webkit-box;-webkit-box-orient: vertical; -webkit-line-clamp: 4;overflow: hidden; max-height: 120px;}
}
@media screen and (max-width: 1200px) {
#footer{ min-height: 750px;}
.wrapper .main{ padding-bottom: 750px;}
.wrapper+#footer{ margin-top: -750px;}
.footer-grid{width: 85%; max-width: 800px;display: flex; flex-wrap: wrap; /*justify-content: center;*/}
.footer-nav {width: 110%;float: none;margin-bottom: 30px;margin-left: -5%;}
#google_translate_element{position: absolute; left: 20px; bottom: 20px;}
.title2{font-size: 2.25em;} 
.title3{font-size: 3vw;} 
/*============other===============*/
.index-title {font-size: 0.875em;}
#index-about .index-title {width: 260px;}
#index-about .grid-max { padding-right: 300px;}   
#index-project .grid-max {padding-left: 210px;}
#index-activity .grid-large {padding-left: 200px;}
#index-news .grid-large { padding-left: 200px; padding-top: 60px;}
#index-news .index-title p span{display: block;}
.team-list{max-width: 750px;}
.team-list .grid-item {width: 46%;}
.foundation-list { max-width: 700px; margin-left: auto; margin-right: auto;}
.img-text-list .title5, .img-text-list .title-en1 {font-size: 1.25em;}
}
@media screen and (max-width: 1200px) , (max-height: 700px) {
/*============main===============*/
.section-top2{ margin-top: 80px;}
.section-bottom2{ margin-bottom: 80px;}
.section-top3{ margin-top: 100px;}
.section-bottom3{ margin-bottom: 100px;}    
.grid-container{padding: 110px 0 110px 0;}
.grid-container-small{padding: 80px 0 80px 0;}
.grid-container-bottom{padding-bottom: 110px;}
.grid-container-small-bottom{padding-bottom: 80px;}
.img-bg+.main .grid-container{padding-top: 140px;}
.style-layout2 .grid-container{padding-top: 80px;}
.style-layout2 .wrapper:after{top: 69px;height: 60px;}
.style-layout2 .wrapper:before{height: 70px;}
.breadcrumb-box {top: 25px;}
.subtitle-box {margin-bottom: 60px;}
.style-layout2 .grid-max>.subtitle-box { margin-top: -20px;}
.header-border+.main:before { height: 100px;}
.button-top{line-height: 20px;width: 40px;padding-bottom: 10px;}
.button-top:hover{padding-bottom: 15px;}
.title-box{padding-bottom: 100px;}
.title-text+ul { margin-top: 20px;}
.title-text { font-size: 2em;}
.title-box em{margin-right:-2em;-ms-transform: scale3d(.7,.7,.7); -webkit-transform: scale3d(.7,.7,.7);-moz-transform: scale3d(.7,.7,.7); -o-transform: scale3d(.7,.7,.7); transform: scale3d(.7,.7,.7);}
p, .text0, .html-edit { line-height: 1.875em;}
.title4{font-size: 1.5em;}
.title6{font-size: 1.25em;}
.dialog{ font-size: 1.25em;}
.subtitle-box{font-size: 0.875em;}    
select.select-category, .select-category select, .select-category input { height: 40px; line-height: 40px; font-size: 16px; padding: 0 40px 0 20px; background-position: right 15px center; }
.subtitle-box a{font-size: 16px;letter-spacing: 0.1em;padding: 0 20px; height: 40px;line-height: 40px;}
.subtitle-box a:hover, .subtitle-box a.active{padding: 0 10px 0 30px;}
.subtitle-box a:before { left: 10px;}
.page {margin-top: 50px;}  
.item-list-5{ width:105%;}
.item-list-5 .grid-item{ width:28.3%; margin-right: 5%;}
.item-list-4{ width: 106%;}
.item-list-4 .grid-item{ width: 44%;margin-right: 6%;}
.item-list-2, .item-list-3, .item-list-4, .item-list-5 {margin-bottom: -50px;}
.item-list-2 .grid-item, .item-list-3 .grid-item, .item-list-4 .grid-item, .item-list-5 .grid-item{ margin-bottom: 50px;}
.item-list .grid-item{margin-bottom: 70px;}  
.swiper-button-next, .swiper-button-prev {background-size: 15px 25px;}
.swiper-button-next{right:-5px;}
.swiper-button-prev{left:-5px;}
.swiper-container:hover .swiper-button-next{right:0;}
.swiper-container:hover .swiper-button-prev{left:0;}
.swiper-container.button-outer .swiper-pagination { margin-top: 30px;}
/*============other===============*/
#lohas2 .grid-min{max-width: 300px;}
.team-img-list .img-over-box img {height: 200px;}
.foundation .header-box {height: calc(100vh - 190px);}
.portfolio-list .grid-item { padding: 15px 0 15px 30px;}
.contact .info-list {clear: both;width: 60%;max-width: 600px;margin-top: 50px;}
.contact .info-list > div { margin-right: 0;} 
.exhibition-head-list+.exhibition-list {margin-top: 70px;}
}
@media screen and (max-width: 1200px) and (min-width: 1001px) {
#gardening4 h2 span{ display:block;}
}
@media screen and (max-width: 1000px){ 
/*============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,.grid-1-5,.grid-4-5,.grid-3-10,.grid-6-10,.grid-right{ /*float: none;*/ width: 100%;clear: both;}
.grid-space-right, .grid-space-left, .grid-space-right-small, .grid-space-left-small{ padding-right: 0;padding-left: 0;}
.flex-1-12, .flex-2-12, .flex-3-12, .flex-4-12, .flex-5-12, .flex-6-12, .flex-7-12, .flex-8-12, .flex-9-12, .flex-10-12, .flex-11-12, .flex-3-8, .flex-5-8, .flex-1-2,.flex-1-5,.flex-4-5,.flex-3-10,.flex-6-10{ width:auto; }   
.flex-container, .flex-top, .flex-bottom, .flex-center, .flex-stretch, .flex-left, .flex-right, .flex-center-justify, .flex-between, .flex-around, .flex-evenly{flex-direction: column;}
.flex-content .text-box {max-width: 100%; margin-top: 25px;}
.flex-content {padding: 0;}
.mobile-grid{ width:83.4%; margin-right:auto; margin-left:auto;}
.mobile-flex-center{align-items: center;}
.mobile-top0{margin-top: 0 !important; padding-top:0 !important;}
.mobile-bottom0{margin-bottom: 0 !important; padding-bottom:0 !important;}
.mobile-top1{margin-top: 60px;}
.mobile-bottom1{margin-bottom: 60px;}
.mobile-top2{ margin-top: 80px;}
.mobile-bottom2{ margin-bottom: 80px;}
.mobile-top3{ margin-top: 100px;}
.mobile-bottom3{ margin-bottom: 100px;}
.grid-full{width: 87.5%;}
.breadcrumb-box a, .breadcrumb-box:before{display: none;}
.style-layout2 .breadcrumb-box:before{display: block;}  
.mobile-bg-dark:after {content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 100%; background: url(../images/bg-mask.png) repeat; z-index: 2;opacity: 0;}  
.sticky-page .mobile-bg-dark:after{opacity: 1;}
.mobile-bg-dark + .main{ margin-top: 60vh;}    
.subtitle-box.select-category{margin-bottom: 45px;}
.subtitle-box.select-category .subtitle-text, .subtitle-box.select-category .subtitle-en, .subtitle-box.select-category select,  .subtitle-box.select-category a{margin-bottom: 15px;}
.subtitle-box.select-category select{min-width:auto;}
.subtitle-en {margin-right: 1.5em;}
select.select-category, .select-category select, .select-category input{padding: 0 35px 0 15px;background-position: right 10px center;}
.subtitle-box a{padding: 0 15px; }
.subtitle-box a:hover, .subtitle-box a.active{padding: 0 7px 0 23px;}
.subtitle-box a:before { left: 5px;}
.button-icon2.big a{ font-size: 14px;}
.button-text a, a.button-text{ font-size: 1em;min-width: 110px;}
.button-text a{margin-right: 2px;margin-bottom: 5px;}
.img-list {margin-left: -3%; margin-right: -3%; margin-bottom: -6%;}
.img-list a {padding: 0 3%;width: 50%;margin-bottom: 6%;}
.category-list a{padding-left:10px; padding-right: 10px; }
.content-page .info-box, .content-category{ font-size: 1em;}
.title2{font-size: 2em;} 
.subtitle1 { font-size: 1em;}
.title-en5 { font-size: 1em;}
.fancybox-slide--html .fancybox-close-small{position:absolute;color: #333;}
.bg-dark .fancybox-slide--html .fancybox-close-small {color: #fff;}
.fancybox-content {padding-left:8%;padding-right: 8%;}
/*============other===============*/
.index .grid-container{position: relative; padding: 90px 0 90px 0;}
.index .grid-container-bottom{position: relative; padding-bottom: 90px;}
.index .grid-container-bottom:first-child{padding-top: 90px;}
#index-about .index-title {bottom: auto;}
.about-img2 { margin-left: 0;}
.about .flex-6-12 {margin-top: -40px;padding-left: 8.3%;}
.about .header-border+.main:before { height: 350px;padding-bottom: 0; background-position: left top;}
.history-list .text-box{font-size: 0.9em;}    
.exhibition-head-list .info-box { position: relative;margin-top: 15px;max-width: 100%;}
.exhibition-head-list .text-box{margin-top: 25px;}
.exhibition-head-list .img-box {-moz-box-shadow: 0px 0px 10px rgba(0,0,0,.15); -webkit-box-shadow: 0px 0px 10px rgb(0 0 0 / 15%); box-shadow: 0px 0px 10px rgb(0 0 0 / 15%);background-color: #ddd;}
.foundation-contact .flex-4-12 { min-width: auto;padding-right:0;}
.foundation-contact .flex-7-12{ min-height: auto;padding-bottom: 80%;}
.visit .header-img{height: 0; padding-bottom: 50%;}
.project-list .text-box {padding: 0 4%;}
.bg-dark .header-box .text-box{ padding-left:4%;}
.portfolio .select-category {margin-left: 0;float: none;}    
.portfolio-list { width: auto;float: none;max-width: 400px;}
.portfolio-list .text-year { margin-left: -5px;}
.contact .text-box { width: 100%; margin-left: auto; margin-right: auto;float: none;}
.contact .info-list { width: 100%; margin-left: auto; margin-right: auto;float: none;}
.bg-dark.content-page .header-box+.main .content-title{padding-top: 40px;}
.bg-dark.content-page .header-box+.main > .grid-container:first-child {margin-top: -30px;}
.img-text-list .grid-item a {display: block; height: 180px;padding-right: 0;}
.img-text-list .text-box{width: auto !important; display: block;}
.img-text-list .img-box {width: 300px; height: 180px;float: left;margin-right: 4%;}
.img-text-list .text-box:first-of-type { padding-top:4%;}
.img-text-list a:after{ display:none;}
}
@media screen and (max-width: 1000px) and (min-width: 800px) {
#index-news .text-box,#index-activity .text-box { font-size: 0.9em;}
}
@media screen and (max-width: 900px) {
.footer-nav > li{width: 33.3%;}
.footer-grid { max-width: 450px;}
.footer-info {width:100%;min-width:0;max-width: none;margin-right:0;}
#google_translate_element {position:relative;  left:auto;  bottom:auto; text-align: left;margin-bottom: 50px;}
.info-list > div {width: 100%;}
}
@media screen and (max-width: 800px) {
.category-list a { padding-left: 7px; padding-right: 7px;letter-spacing: 0;}
.style-layout2 .content-title{display: block;}
.content-page .info-box, .style-layout2 .content-category{ margin-top: -10px; margin-bottom: 30px;}
.title3{font-size: 1.4em;}
.flex-middle {max-width:none;}
.fancybox-content { border-radius: 0;}    
.index .item-list-2, .index .item-list-3{width: 100%;max-width: 400px;}
.index .item-list-2 .grid-item, .index .item-list-3 .grid-item{width: 100%; margin-right: 0;}
#index-news .grid-item:nth-child(3){display:block;}
#index-news .grid-large {padding-top: 0;}
#index-about .grid-max { padding-right: 0;}
#index-project .grid-max { padding-left: 0;}
#index-about .index-title, #index-project .index-title {position: relative; margin-bottom: 40px; right: auto;}
#index-project .index-title:before {left: 17em; margin-top: -3em;}
.bg-dark .header-box .text-box div{max-width: 100%;}
}
@media screen and (max-width: 800px) and (min-width: 600px) {
.style-layout2.content-page .title3{ font-size: 4vw;}
}
@media screen and (max-width: 800px){
.page a { min-width: 35px; height: 35px;line-height: 35px;}
a.page-prev {padding-right: 5px;}
a.page-next {padding-left: 5px;}     
}
@media screen and (max-width: 800px) and (min-width: 701px) {
.item-list-3 .title5{font-size: 1.25em;}
.item-list-3 .title6, .item-list-4 .title6{font-size: 1.125em;}
}
@media screen and (max-width: 700px){    
.item-list-4, .item-list-3, .item-list-2{ width: 100%;}
.item-list-4 .grid-item, .item-list-3 .grid-item, .item-list-2 .grid-item{ width: 100%;margin-right: 0;}
.item-list .grid-item { margin-bottom: 50px;}
.item-list-5{ width: 106%;}
.item-list-5 .grid-item{ width: 44%;margin-right: 6%;}
.index-portfolio-list .swiper-slide { width: 85%;}
.other-list{max-width: 400px;}
.img-text-list { max-width: 400px; margin-left: auto; margin-right: auto;}
.img-text-list .grid-item{ padding-bottom:40px;border:none;}
.img-text-list .grid-item:last-child{padding-bottom:0;}
.img-text-list .grid-item a {height: auto;}
.img-text-list .grid-item a:hover{background-color: transparent;}
.img-text-list .img-box { width: 100%;height: 0;padding-bottom: 56.25%;float: none; margin-right: 0;}
.img-text-list .text-box {padding-left: 0;}
.img-text-list .text-box:first-of-type { padding-top: 20px;}
.exhibition-head-list+.exhibition-list {margin-top: 50px;}
}
.show-w400, .show-w500, .show-w600{display: none;}
@media screen and (max-width: 600px), (max-height: 600px){
/*============main===============*/ 
.googlemaps {height: 400px;}
.mobile-grid{ width:87.5%;}
.flex-space-right{padding-right: 6.25%;}
.flex-space-left{padding-left: 6.25%;}
.flex-space-right-big{padding-right: 12.5%;}
.flex-space-left-big{padding-left: 12.5%;}
.section-top, .mobile-top1{margin-top: 40px;}
.section-bottom, .mobile-bottom1{margin-bottom: 40px;}
.section-top2, .mobile-top2{ margin-top: 60px;}
.section-bottom2, .mobile-bottom2{ margin-bottom: 60px;}
.section-top3, .mobile-top3{ margin-top: 70px;}
.section-bottom3, .mobile-bottom3{ margin-bottom: 70px;}
.grid-container{padding: 70px 0 70px 0;}
.grid-container-small{padding: 60px 0 60px 0;}
.grid-container-bottom{padding-bottom: 70px;}
.grid-container-small-bottom{padding-bottom: 60px;}
.main > .grid-container:last-child, .main > .grid-container-bottom:last-child, .main .bg-line1 > .grid-container-bottom:last-child{padding-bottom: 90px;}
.style-layout2 .grid-container{padding-top: 70px;}
.style-layout2 .wrapper:after{top: 59px;height: 50px;}
.style-layout2 .wrapper:before{height: 60px;}
.style-layout2.content-page .header-box{ width: 100%; margin-top: 0;}
.breadcrumb-box:before {height: 45px;}
.header-box .animated-list{max-width: 400px;text-align: justify;}
.header-box .animated-list li, .header-box .animated-list li span{display: inline;}
.header-box .title-box { left: 8.3%; max-width: 84%;}
.title-box{padding-bottom: 70px;}
.header-border .title-box:before{height: 55px;}
.header-border+.main:before { height: 80px;} 
.subtitle-box{margin-bottom: 50px;}
.subtitle-box.select-category { margin-bottom: 35px;}   
.item-list-2, .item-list-3, .item-list-4, .item-list-5 {margin-bottom: -40px;}
.item-list-2 .grid-item, .item-list-3 .grid-item, .item-list-4 .grid-item, .item-list-5 .grid-item{ margin-bottom: 40px;}
.item-list-2 .img-box+.text-box, .item-list-2 .plyr+a .text-box, .item-list-3 .img-box+.text-box, .item-list-3 .plyr+a .text-box, .item-list-4 .img-box+.text-box, .item-list-4 .plyr+a .text-box, .item-list-5 .img-box+.text-box, .item-list-5 .plyr+a .text-box {margin-top: 20px;}
.text-category {margin-top: 10px;}
.img-caption { bottom: 5px;font-size: 0.875em; padding: 0 10px;}
.button-text a, a.button-text{min-width:auto; }
.subtitle-box { font-size: 0.75em;}
.bg-dark .header-box a .text-box:after{ display:none;}
.bg-dark .header-box .text-box{padding-right: 4%;}
.bg-dark .header-box p{display: -webkit-box; -webkit-box-orient: vertical;-webkit-line-clamp: 2; overflow: hidden;}
.bg-dark .header-box .text-box div{padding-right: 0;}
/*============other===============*/
.index .grid-container{position: relative; padding: 70px 0 70px 0;}
.index .grid-container-bottom{position: relative; padding-bottom: 70px;}
.index .grid-container-bottom:first-child{padding-top: 70px;}
.about #section-header .title-box{padding-bottom: 100px;}
.history .title-box { padding-bottom: 80px;}
.foundation .header-box {height: calc(100vh - 150px);}
.activity .subtitle-box select:last-child { max-width: 50%;}
.project-text{font-size: 0.9em;}
.project-list .button-icon2{margin-top: -3px;}
.project-text, .project-list .button-icon2{margin-left: -7px;}
.project-text{margin-right: 7px;}
.project-list .text-box>div>div:last-child{margin-right: -7px;}
.project-text h1, .project-list .button-icon2, .project-list .project-info{padding: 0 7px;border:none;}
.index .project-text h1, .index .project-list .button-icon2, .index .project-list .project-info { margin-bottom: 15px;}
}
@media screen and (max-width: 600px){
.hide-w600{ display: none !important;}
.show-w600,.block-w600{display: block;}
/*.grid-large, .grid-middle, .grid-small, .grid-max, .grid-min, .grid { width: 83.4%;}*/
/*.html-edit br{display:none;}*/
.mobile-content br{display:none;}
.mobile-content span{display: inline;}
.flex-small { max-width:none;}	
.title2 { font-size: 1.7em;}
.info-list dt{width: 60px;}
.info-list > div{padding: 15px 0 15px 75px; min-height: 85px;} 
.info-list.width-auto > div { width: 100%;margin-right:0;}   
form .input-column{ width: 100%;}
form .input-column:nth-child(odd){width: 100%; margin-right: 0;}
label { height: 30px; line-height: 30px;}
input[type="text"], input[type="password"], input[type="tel"], input[type="email"], input[type="date"], select{line-height: 30px;height: 50px; padding-left:90px;}
.input-box{line-height: 30px; min-height: 50px; padding-left:90px;}
textarea {padding-top: 12px; padding-left:90px;}
img.rand-img { width:100px; height:48px;}   
.img-list{margin-left: -2%;margin-right: -2%;margin-bottom: -4%;}
.img-list a{ padding: 0 2%; margin-bottom: 4%;}
.img-list a p{font-size: 0.875em;}
/*============other===============*/ 
#about1 p, .feature .main p{white-space:normal;}
#about1 p br, .feature .main p br{display: none;} 
#index-portfolio .index-title {padding-top: 5em;padding-bottom: 40px;}
.index .project-list .button-icon2{display: none;}
.portfolio-illustration { left: 13em;}
#index-news .index-title, #index-activity .index-title{position: relative;margin-bottom: 40px;}
#index-news .grid-large, #index-activity .grid-large{ padding-left: 0;max-width: 400px;}
#index-news .index-title p span {display: inline-block;}
#index-exhibition .index-title h1:before {width: 5.9em;height: 6.5em;top: 0.7em;right: 0.7em;}
#index-exhibition .index-title {padding-bottom: 6em;}
.team-list{max-width: 340px;}
.team-list .grid-item {width: 100%;}
#foundation2 .text-box{width: 87.5%;margin-bottom:0;}
#foundation2 .text-box br{display: none;}
#foundation4 p br{display: none;}
.foundation-list { margin-left: -10px;}
.foundation-list .grid-item{margin-bottom: 40px;}
.foundation-list .grid-item img {width: 80px;margin-left: 15px;margin-right: 15px;}
.foundation-list .foundation-icon2 img { width: 90px; margin-left: 10px;margin-right: 10px;}
}
@media screen and (max-width: 500px) { 
/*============main===============*/
.hide-w500{ display: none !important;}
.show-w500,.block-w500{display: block;}
.inline-w500{ display: inline !important;}    
.page { margin-top: 40px;}
.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; }
/*.page-first+a, .page a:nth-child(7){display: none;}
.page a.active, .page a.page-first, .page a.page-last, .page a.page-next, .page a.page-prev, .page a.active+a{ display: inline-block; }*/
.dialog {font-size: 1.125em !important;}
/*============other===============*/ 
.history-list p {display: block;}
/*.exhibition-type1~.content-button .button-text a, .exhibition-type2~.content-button .button-text a {width: 48%;}*/
input[type="text"].input-household{width: 100%;float: none;}
select.input-know{width: 100%;padding-left: 0;}
.content-title .grid-middle { display: block;}
.bg-dark .content-category {text-align: left; display: inline-block; margin-bottom: 20px;}
.bg-dark.content-page .header-box+.main .content-title .content-category {position: absolute;margin-bottom: 50px; bottom: 100%;-moz-text-shadow:0 0 15px rgba(0,0,0,1); -webkit-text-shadow:0 0 15px rgba(0,0,0,1); text-shadow: 0 0 15px rgba(0,0,0,1);}
.bg-dark.content-page .header-box+.main .content-title { padding-top: 30px;}
.bg-dark.content-page .header-box+.main > .grid-container:first-child {margin-top: -20px;}
#art2 .dialog { left: -2%;bottom: -15%;}
}
@media screen and (max-width: 400px){ 
.footer-nav > li{width: 49.5%;}
/*============main===============*/
.hide-w400{ display: none !important;}
.show-w400,.block-w400{display: block;}
.title1{font-size: 2.5em;}
.title3{font-size: 1.25em;} 
.flex-min { max-width: none;}
.style-layout2 .breadcrumb-box:before {display: none;}    
.style-layout2 .wrapper:after {display: none;}  
.category-list li:last-of-type:before{display:block;}
.item-list-5 .grid-item {margin-bottom: 30px;}
.title-text { font-size: 1.8em;}
.title-box em{margin-right: -2.4em;}
/*.content-page .info-box, .content-category {font-size: 0.875em;}*/
#form-content .subtitle-en{display: none;}
.header-box .text-box h2{font-size: 1.25em;}
/*============other===============*/ 
#index-exhibition .index-title p span {display: block;}
#index-exhibition .index-title {padding-bottom: 2.5em;}
.history .title-box .animated-list li{display: inline;}
.input-box select:nth-child(2)+label{ margin-left:5px;}
.input-box select{padding-left: 5px;padding-right: 20px;}
.foundation .header-box h1{font-size: 1.25em;}
}
@media screen and (max-width: 350px){
.title5, .exhibition-head-list .title4{font-size: 1.25em;}
.title6{font-size: 1.125em;}
.about .img-caption{display: none;}
.img-list a p{display: none;}
}
@media screen and (max-width: 800px) and (orientation:portrait) {
#index-news .grid-small { width: 85%;}
}
@media screen and (max-width: 550px) and (max-height: 400px) {
.project-list .text-box{height: 80px;width: 100%;overflow: hidden;}
.project-list .text-box.active{height:auto;}
.project-list .button-icon{display: block;}
.index .project-list .text-box{height:auto;}
.index .project-list .button-icon{display: none;}
}
.horizontal { display: inherit; }
.vertical { display: none; }
@media screen and (orientation:landscape){
}
@media screen and (orientation:portrait) {
.horizontal { display: none; }
.vertical { display: inherit; }
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) {  /* IE10+ hack*/  
}
/*_:-ms-fullscreen, :root {}ie11 hack*/