@charset "utf-8";
@import url("https://fonts.googleapis.com/css2?family=Cormorant:wght@600&family=Lato:wght@400;700&family=Noto+Sans+TC:wght@300;400;700&family=Noto+Serif+TC:wght@600&display=swap");
@import url("icofont/icofont.min.css");
@import url("dripicons/webfont.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;/* white-space: pre-line;*/}
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ""; content: none; }
abbr, acronym { border: 0; font-variant: normal; }
sup, sub { vertical-align: baseline; }
input, button, textarea, select, optgroup, option { font-family: inherit; font-size: inherit; font-style: inherit; font-weight: inherit; outline: 0; border: 0; }
/*img {image-rendering:-webkit-optimize-contrast; -webkit-backface-visibility: hidden; -ms-transform: translateZ(0);-webkit-transform: translateZ(0);transform: translateZ(0);}*//*fixd Chrome Img Blur*/
a[href=""]{pointer-events: none;}
/*============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, /*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, .html-button, .button-icon i, .landscape-list .text-box{ -webkit-transition: all 250ms ease-in; -o-transition: all 250ms ease-in; -moz-transition: all 250ms ease-in; transition: all 250ms ease-in; }
input, textarea, select{-webkit-transition: border 250ms ease-in; -o-transition: border 250ms ease-in; -moz-transition: border 250ms ease-in; transition: border 250ms ease-in;}
#nav .subnav div, .header-small:after, .img-box:before, .img-over-box:before, .swiper-container .swiper-slide .img-box, .other-list.swiper-container.button-outer .swiper-slide .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;}
.nav-toggle, .back-box,.full-box .img-box, #nav, #nav ul{ -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, .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, .computer .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);}
.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, #nav a: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 a:hover{-ms-transform: translate3d(0,-5px,0); -moz-transform: translate3d(0,-5px,0); -webkit-transform: translate3d(0,-5px,0); -o-transform: translate3d(0,-5px,0); transform: translate3d(0,-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.block 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 > span: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 > span: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 > span: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 > span: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 > span: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 > span: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 > span: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 > span: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 > span: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 > span: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 > span: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 > span:nth-child(12n+12) {-webkit-animation-delay: 2.4s;  animation-delay: 2.4s;}
.delay-long-list li:nth-child(6n+1) {-webkit-animation-delay: 0.1s;  animation-delay: 0.1s;}
.delay-long-list li:nth-child(6n+2) {-webkit-animation-delay: 0.5s;  animation-delay: 0.5s;}
.delay-long-list li:nth-child(6n+3) {-webkit-animation-delay: 1.0s;  animation-delay: 1.0s;}
.delay-long-list li:nth-child(6n+4) {-webkit-animation-delay: 1.5s;  animation-delay: 1.5s;}
.delay-long-list li:nth-child(6n+5) {-webkit-animation-delay: 2.0s;  animation-delay: 2.0s;}
.delay-long-list li: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%;}
.img-ratio66 .plyr__video-embed{aspect-ratio: 3 / 2 !important;}
.img-ratio100 .plyr__video-embed{aspect-ratio: 1 / 1 !important;}
/*==============text-ver==================*/
.text-ver{ writing-mode: tb-rl; -ms-writing-mode: tb-rl; -webkit-writing-mode: vertical-rl; -moz-writing-mode: vertical-rl; -ms-writing-mode: vertical-rl; writing-mode: vertical-rl; white-space: nowrap;}
.text-hor { writing-mode: lr-tb; -ms-writing-mode: lr-tb; -webkit-writing-mode: horizontal-tb; -moz-writing-mode: horizontal-tb; -ms-writing-mode: horizontal-tb; writing-mode: horizontal-tb; }
/*============grids===============*/
.grid-large, .grid-middle, .grid-small, .grid-max, .grid-min, .grid { width: 85%; margin: 0 auto; position: relative; }
.grid-full{max-width: 100%;}
.grid-max { max-width: 1540px;}
.grid-large { max-width: 1200px;}
.grid-middle { max-width: 1000px;}
.grid-small { max-width: 800px;}
.grid-min { max-width: 480px;}
.grid-max .grid-large, .grid-max .grid-middle{width: 100%;}
.grid-max-left, .grid-max-right{width: 92.5%; max-width: 1730px;}
.grid-max-right{margin-left: auto;}
.flex-max, .flex-large, .flex-middle, .flex-small, .flex-min{width: 100%;position: relative;}
.flex-max{max-width: 1280px;}
.flex-large{max-width: 700px;}
.flex-middle{max-width: 550px;}
.flex-small{max-width: 480px;}
.flex-min{max-width: 380px;}
.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: 6%;}
.grid-space-left{padding-left: 6%;}
.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{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, .flex-space-left, .flex-space-right-big, .flex-space-left-big{box-sizing: border-box;}
.flex-space-right{padding-right: 4%;}
.flex-space-left{padding-left: 4%;}
.flex-space-right-big{padding-right: 8%;}
.flex-space-left-big{padding-left: 8%;}
.flex-reverse, .flex-reverse-list .flex-center:nth-child(even){flex-direction:row-reverse;}
.flex-column{flex-direction: column;}
.flex-shrink0{flex-shrink:0;}
.flex-shrink1{flex-shrink:1;}

.img-1-2,.img-1-5,.img-4-5,.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: -4px;}
.img-margin+.img-margin{margin-top: 4px;}
.img-margin .img-1-2, .img-margin .img-1-5, .img-margin .img-4-5, .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:4px;}
.img-margin-bottom{margin-bottom:8px;}
.img-margin-top{margin-top:8px;}
.img-1-2{width: 50%;}
.img-1-5{/*width: 25%;*/width: 28%;}
.img-4-5{/*width: 75%;*/width: 72%;}
.img-1-3{/*width: 33.3%;*/width: 36%;}
.img-2-3{/*width: 66.6%;*/width: 64%;}
.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%;}
.img-group{display: flex; width: auto;}
.img-margin img, .img-group img{width: 100%;height: auto;}
/*============style===============*/
body{font-size: 1em; word-wrap: break-word; overflow-x: hidden; color: #333;}
body, body.computer .main{background:#fff url("../images/bg.jpg") center top repeat;}
body.computer, body.computer .main{background-attachment: fixed;}
body:before{display:none;}
p, .text0{ font-size: 1em; line-height:1.75em; letter-spacing: 0.1em; /*white-space: pre-line;*//*font-weight:300;*/ color:#333;}
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: #007b80; color: #fff;}
a { color: #000; }
a:hover { color: #007b80;}
p a{ color: #000; text-decoration:underline; }
p a:hover {background: #007b80; 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, .justified-gallery > a > .caption, h1+h2{ font-family: Lato, "Noto Sans TC", Arial, Helvetica, "微軟正黑體", "Microsoft JhengHei", "儷黑 Pro", "LiHei Pro", sans-serif; }
.text-font, h1, h2, .title3{ font-family:"Noto Serif TC", Times,"Times New Roman", "儷宋 Pro", "LiSong Pro Light", "宋体", SimSun, serif;font-weight: 600;}
.en-font, em{font-family: Cormorant, "Noto Serif TC", Times,"Times New Roman", "儷宋 Pro", "LiSong Pro Light", "宋体", SimSun, serif;font-weight:600;}
.en-font2, .text-number, .text-more:after{font-family: Lato, Arial, Helvetica, "微軟正黑體", "Microsoft JhengHei", "儷黑 Pro", "LiHei Pro", sans-serif;}
.title1,.title2,.title3,.title4{display: block;line-height: 1.3em;letter-spacing: 0.05em;/*white-space: pre-line;*/}
.title1{font-size: 3em;} 
.title2{font-size: 2.25em;}
.title3{font-size: 1.875em;}
.title4{font-size: 1.5em;}
.title5{font-size: 1.5em;letter-spacing: 0.4em;margin-right: -0.4em;line-height: 1.5em;}
.title6{font-size: 1.125em;display: block;line-height: 1.4em;letter-spacing: 1.4em;}
h1+h2, h2+h3{margin-top: 3px;}
.subtitle1, .subtitle2{font-size: 1em;line-height: 1.6em;margin-right: -0.2em;/*white-space: pre-line;*/font-weight: normal;}
.subtitle1{letter-spacing: 0.2em;}
.subtitle2{letter-spacing: 0.3em;}
.subtitle1:empty, .subtitle2:empty{margin: 0;}
.subtitle2 i{margin-left: 3px;}
.subtitle2 span:nth-of-type(2){margin-left: 15px;}
.subtitle2 span:nth-of-type(2):empty{margin-left: 0;}
.text1{font-size: 1em;line-height: 1.6em;letter-spacing: 0.1em;margin-right: -0.1em;/*font-weight: 300;*/}
.text-small{ font-size:0.9375em;line-height: 1.75em;}
.en-small{ font-size:.75em;line-height:1.5em;}
.en-small2{ font-size:.75em;line-height:1.16em;letter-spacing: 0.2em;display:inline-block;}
.title-en1 {display: block;font-size: 3.75em;letter-spacing: -0.05em; line-height: 1em;}
.text-box .title-en1{line-height: .9em;}
.text-line-height {line-height: 1.6em;}
.text-spacing-normal{letter-spacing:0em !important;}
.text-spacing-big{letter-spacing:0.2em !important;}
.text-block{display:block;}
.text-normal{font-weight: normal;}
.color-white { color: #ddd; }
.color-black {color: #000;}
.color-gray1 { color: #333;}
.color-gray2 { color: #666;}
.color-gray3 { color: #888;}
.color-gray4 { color: #aaa;}
.color1 { color: #007b80;}
.color-line{color:#007b80;}
.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; }
.nowrap, .grid-item .subtitle1, .grid-item .subtitle2, .swiper-slide .subtitle1, .swiper-slide .subtitle2, .portfolio-list h2, .news-small-list h2, .other-list h2{ white-space: nowrap; text-overflow: ellipsis; overflow: hidden; max-width: 100%;display: block; }
.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;}
.margin-top1{margin-top:10px;}
.margin-bottom1{margin-bottom:10px;}
.margin-top2{margin-top:20px;}
.margin-bottom2{margin-bottom:20px;}
.margin-top3{margin-top:30px;}
.margin-bottom3{ margin-bottom: 30px;}
.margin-top4{margin-top:40px;}
.margin-bottom4{ margin-bottom: 40px;}
.margin-top5{margin-top:50px;}
.margin-bottom5{ margin-bottom: 50px;}
.margin-top6{margin-top:60px;}
.margin-bottom6{ margin-bottom: 60px;}
.section-top{ margin-top: 70px;}
.section-bottom{ margin-bottom: 70px;}
.section-top2{ margin-top: 120px;}
.section-bottom2{ margin-bottom: 120px;}
.no-top{margin-top:0!important;}
.no-bottom{margin-bottom:0!important;}
.text-underline{text-decoration: underline; text-decoration-color: #007b80;color:#333;}
/*============base===============*/
body, html { height: 100%; }
.wrapper { min-height: 100%; width: 100%; position: relative; overflow: hidden; }
.main { position: relative; width: 100%;z-index:1;/*overflow: hidden;*/ }
#footer { position: relative; width: 100%; z-index: 9; min-height: 280px;}
.wrapper .main{ padding-bottom: 280px;}
.wrapper+#footer{ margin-top: -280px;}
/*============nav===============*/
.logo { position:fixed; display: block; width: 200px; height: auto;top: 30px; left:4%; z-index: 11;}
.logo:before{content: ""; position: relative;display: block; width: 100%;height: 0; padding-bottom: 29.1%; background-image:url("../images/logo.png"); background-position: center center;background-repeat: no-repeat; background-size: contain;image-rendering:-webkit-optimize-contrast;}
#nav{position: fixed; display: block; top: 0px; left: 0px; z-index: 10;width:100%;color:#fff; box-sizing: border-box;font-size: min(1em,20px);}
#nav ul{position: relative; box-sizing: border-box;padding: 50px 4% 25px 280px;display: flex; justify-content: flex-end;}
#nav li {position: relative; text-align: center;white-space: nowrap;max-width: 14.2%;}
#nav li > a{position: relative;display:inline-block;color: #fff;padding: 0 25px;border-radius: 20px;max-width: 100%;box-sizing: border-box; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
#nav li strong{ line-height: 40px;letter-spacing: 0.2em;font-weight: normal;}
#nav li > a:hover, #nav li.active > a{background: #fff;color:#000;}
#nav .subnav div{ position:absolute;height: 0px; width: 100%;display: flex; flex-direction: column; align-items: center;opacity: 0;}
#nav .subnav div a{position: relative;font-size: 0.9375em;line-height:37px;letter-spacing: 0.2em; height: 37px; display:block;white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
#nav .subnav div a, #nav .subnav div a:hover, #nav .subnav div a.active{color:#fff;}
#nav:hover ~ .wrapper .header-small:after{opacity: .4;}

.nav-toggle{position: fixed;display:none; right:4%; top:10px; width: 40px; height: 15px;padding: 50px 7px 10px 7px; z-index: 11; cursor:pointer; font-size: 12px;}
a.nav-toggle{color:#fff;}
.nav-toggle span ,.nav-toggle span:before ,.nav-toggle span:after{ display:block; width:100%; background:#fff; height:1px;}
.nav-toggle span{ position:relative; top:50%;}
.nav-toggle span:before ,.nav-toggle span:after{ content:''; position:absolute; }
.nav-toggle span:before{ top:-.5em; }
.nav-toggle small{position: absolute; top: 30px;font-size: 12px;letter-spacing: 0.1em;}
body.sticky-page .nav-toggle{ top:0;background: #000;}
body.active .nav-toggle{ z-index: 102;background: transparent;}
body.active .nav-toggle span{ background:none; transition:background .3s .6s;}
body.active .nav-toggle span:before{ top:0; transform:rotate(135deg); transition:top .2s .1s,transform .2s .6s;}
body.active .nav-toggle span:after{ bottom:0; transform:rotate(225deg);  transition:bottom .2s .1s,transform .2s .6s;}
body.active .nav-toggle small{opacity: 0;}
a.button-back{position: fixed;right: 1%;top:45px;color:#fff;z-index: 11;display:inline-block;height: 50px;width: 50px;line-height: 50px; text-align: center;overflow: hidden;border-radius: 50%;mix-blend-mode: screen;}
a.button-back i{font-size:28px;line-height:50px;}
a.button-back i:before{line-height: inherit;}
a.button-back:hover{background-color:#fff; color:#000;}
body.sticky-page a.button-back{top:20px;}
.content-page #nav ul{padding-right: 5%;}
.nav-dark .main:before{content:"";display: block;width: 100%;height: 120px;background-color: #b0997a;}

@media screen and (max-width: 1400px){
.logo {width: 180px;}   
}
/*@media screen and (max-width: 1400px) and (min-width: 1000px) {
#nav ul{font-size:0.95em;}
#nav li > a {padding: 0 20px;}
}*/
@media screen and (min-width: 1400px) {
body.sticky-page .logo{ top: 15px;}
body.sticky-page #nav ul{padding-top: 25px;}
body.sticky-page #nav ul, .nav-dark #nav ul{background-color: #b0997a;}
body.sticky-page #nav .subnav div, .nav-dark #nav .subnav div{background-color: #b0997a;border-radius: 0 0 5px 5px;}
body.sticky-page #nav li > a:hover, body.sticky-page #nav li.active > a, body.sticky-content #nav li > a:hover, body.sticky-content #nav li.active > a{color:#b0997a;}
.computer #nav ul:hover .subnav div{height: 0px; opacity: 0;}
.computer #nav ul .subnav:hover div, .computer #nav ul .subnav > a:hover div{height:auto;opacity: 1;z-index: 1;padding: 10px 0;/*padding:10px;left: -10px;*/}
}
@media screen and (max-width: 1400px) {
body.active{overflow: hidden;}
.nav-toggle{display:block;}
.logo { position:absolute; top: 25px;}
#nav{display: flex;justify-content: center; align-items: center;background: url("../images/menu-bg.jpg")center center no-repeat #000;background-size:cover;height: 100%;overflow:hidden;opacity: 0; z-index:-1;}
#nav ul{display:block; width: 100%; max-height: 100%;overflow: auto;padding: 50px 0;}
#nav li{max-width: inherit;}
#nav .subnav div{ position:relative;}
#nav .subnav.active div{height:auto;opacity: 1;padding: 10px 0;}
#nav .subnav div a, #nav .subnav div a.active{color:#999;}
body.active #nav{  opacity: 1;z-index:101;}
a.button-back {position:absolute; right: 4%;margin-right: 55px; top: 33px;}
.nav-dark .main:before{height: 100px;}
}
@media screen and (max-width: 1400px)  and (min-height: 500px){
#nav li{padding: 5px 0;}
}
@media screen and (max-width: 600px) {
.logo {width: 150px;}
.nav-toggle{top: 5px;}
a.button-back {top: 27px;}
.nav-dark .main:before{height: 90px;}
}
/*============footer===============*/
#footer{z-index:9;background: url("../images/footer-img1.png")left bottom no-repeat, url("../images/footer-img2.png")right bottom no-repeat;background-size: 32% auto,20% auto;}
.footer-grid{padding: 30px 0 60px 0;width:90%;margin: 0 auto;max-width: 1000px;display: flex;}
.footer-item{padding: 0 10px;max-width: 35%;box-sizing: border-box;}
.footer-grid small, .footer-grid b, .footer-grid em{display:block;}
.footer-grid em{margin-bottom: 15px;}
.footer-grid b{padding-bottom: 10px;}
.footer-grid b:empty{padding-bottom:0;}
.footer-logo a{position: relative;display: block;width: 113px;height: auto;}
.footer-logo a:before{content: ""; position: relative;display: block; width: 100%;height: 0; padding-bottom: 100%; background-image:url("../images/logo2.png"); background-position: center center;background-repeat: no-repeat; background-size: contain;image-rendering:-webkit-optimize-contrast;}
.footer-add b{font-size: 1.125em;letter-spacing: 0.1em;}
.footer-add small{padding-bottom: 10px;}
.footer-add small:empty{padding-bottom:0;}
.footer-tel b{font-size: 1.5em;}
b.footer-fax{font-size: 1em;font-weight: normal;}
.footer-copyright { font-size: 12px; line-height: 18px;  opacity: .6;}
.footer-copyright a:hover{text-decoration: underline;}
.footer-copyright span{display: inline-block; }
.footer-icon{ margin-bottom: 10px;}
.footer-icon a{position:relative;min-width:45px;height: 45px;line-height: 45px;float: left;display:block; text-align: center;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%; margin-top: -7px;}
.footer-icon i{font-size: 28px;line-height: 45px;}
.footer-icon a:first-of-type{margin-left: -7px;}
#footer .footer-icon a:hover{color:#fff;}
.footer-icon a.social-facebook:hover{ background-color:#3b5998;}
.footer-icon a.social-line:hover{background-color:#00b900;}
.footer-icon a.social-youtube:hover{background-color:#f70000;}
.footer-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-top{position:absolute; display:block;top:25px; right:3%; font-size: 12px;line-height: 20px;width: 50px; white-space: nowrap;text-align: center; z-index:1;opacity: 0;}
.button-top i{font-size: 24px;display: block;}
.button-top.active{z-index:2; opacity: 1;}
@media screen and (min-width: 1000px) {
.footer-logo{margin-right: 5%;}
.footer-tel{width: 22%;}
.footer-add{width: 33%;}
}
@media screen and (max-width: 1200px) {
#footer{background-size: 30% auto,18% auto;}
}
@media screen and (max-width: 1000px) {
#footer { min-height: 330px;}
.wrapper .main{ padding-bottom: 330px;}
.wrapper+#footer{ margin-top: -330px;}
#footer { background-size: 35% auto,32% auto;}
.footer-grid{max-width: 500px;flex-wrap: wrap;justify-content: space-between;padding-top: 10px;}
.footer-item{max-width: initial;margin-bottom: 30px;}
.footer-logo{margin-bottom: 50px;}
.footer-logo a{margin: 0 auto;}
.footer-br{width: 100%;}
}
@media screen and (max-width: 550px) {
.footer-grid{max-width: 340px;}
.footer-logo {margin-bottom: 40px;}
}
@media screen and (max-width: 450px) {
#footer { background-size: auto 50px,auto 80px;}
}
/*============html-edit===============*/
.html-edit {position: relative; line-height:1.75em; letter-spacing: 0.1em;/*font-size:16px;*/ /*text-align:justify;*/}
.html-edit a{ text-decoration:underline; color: #007b80; }
.html-edit a:hover { text-decoration:none;}
.html-edit img { max-width: 100%; height:auto !important; }
.html-edit ul, .html-edit ol{line-height: 1.875em;}
.html-edit li { list-style: outside; margin-left: 30px; }
.html-edit ul li { list-style-type: disc; }
.html-edit ol li { list-style-type: decimal; }
.html-edit 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;margin-bottom: 7px;font-weight: bold;letter-spacing: 0; line-height: 1.3em;}
.html-edit h2, .html-edit h3, .html-title2, .html-title3{line-height: 1.5em;}
.html-button a, a.html-button, .html-edit a .html-button{position: relative; display:inline-block; padding:10px 20px;background-color: #007b80; 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{-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); }
.html-edit p span, .html-edit h1 span, .html-edit h2 span, .html-edit h3 span, .html-edit li span {display: inline;}
.html-edit .inline-br{display: inline-block;}
.html-edit table{float: none;}
.html-edit small{letter-spacing: 0.05em;}
/*============googlemaps===============*/
.googlemaps{height:500px; position:relative;}
.googlemaps iframe{width: 100%; height: 100%;}
/*============load===============*/
.main{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 .main{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{content: "";position: absolute;z-index: 1;display: block;width: 100%;height: 100%; }
.loading-content .page, .loading-content .category-list{opacity: .7;}
.loading-icon:after{content:"";top:50%;left: 50%;width: 20px;height: 20px; position: absolute;background: url("../images/loader.gif") no-repeat center center; }
/*============main===============*/
.full-box { position: absolute; top: 0; left: 0; height: 100%; width: 100%; overflow: hidden; background-position: center center; background-size: cover; }
.img-bg{ position: absolute; top: 0; left: 0; height: 75vh; width: 100%; overflow: hidden; z-index: 0; background-position: center center; background-size: cover;background-repeat: no-repeat;}
body.computer .img-bg{ position: fixed;}
.sticky-content .img-bg{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;}
.img-fadein .img-box{opacity: 0;}
.header-box{position: relative; box-sizing: border-box;height: 100vh; width: 100%;overflow: hidden;background: #000;}
.header-small{height: 75vh;}
.header-small:after{content:"";position: absolute;top:0;left: 0; display: block;width: 100%;height: 100%;background-color: #000;opacity: .2;z-index: 1;}
.header-box:before{content: "";display: block;position: absolute;width: 100%;height:150px;left: 0;top:0;z-index: 2; 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)); pointer-events: none;}
@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-mobile+.img-box, .header-box .img-box-mobile+.img-box{display: none; background-image:none!important;} 
}
@media screen and (max-height: 500px) {
.header-small, .img-bg{height: 100vh;}
}
.grid-container{position: relative; box-sizing: border-box; padding: 150px 0;}
.grid-container-bottom{padding-bottom: 150px;}
.grid-container-top{padding-top: 150px;}
.grid-container-group .grid-container-bottom:first-of-type{padding-top: 150px;}
.grid-container-group .grid-container-top:last-of-type{padding-bottom: 150px;}
.content-page .header-small{height: 750px;}
.content-page .header-small+.main .grid-container{padding-top: 1px;}
.content-page .header-small+.main .grid-container .content-title{position: absolute;width: 100%;top:-650px;color:#fff;height: 650px; display: flex; flex-direction: column;justify-content: center;-moz-text-shadow:1px 1px 10px rgba(0,0,0,.5); -webkit-text-shadow:1px 1px 10px rgba(0,0,0,.5); text-shadow: 1px 1px 10px rgba(0,0,0,.5);}
.content-page .header-small+.main .grid-container .content-title a{color:#fff;}
@media screen and (max-width: 1300px) {
.content-page .header-small{height:56vw;}
.content-page .header-small+.main .grid-container .content-title{top:-46vw;height: 46vw; }
}
@media screen and (max-width: 600px)  {
.content-page .header-small{height: 350px;}
.content-page .header-small+.main .grid-container .content-title{top:-280px;height: 280px; }
}
.title-box{position:absolute;/* margin-bottom: 70px;*/text-align:left;display:block;width: 92%;left: 4%;bottom:3vw; color: #fff;-moz-text-shadow:1px 1px 10px rgba(0,0,0,.5); -webkit-text-shadow:1px 1px 10px rgba(0,0,0,.5); text-shadow: 1px 1px 10px rgba(0,0,0,.5);z-index:2;}
.title-en{font-size: 3.75em; line-height: 1em;/* margin-bottom:0.2em;*/display: flex;justify-content: space-between;text-transform: uppercase;}
.title-text{font-size: 1.5em;letter-spacing: 1em; line-height: 1.8em;margin-bottom: 0.6em;}
.content-title{text-align: center;}
.content-title h1+h2{margin-top: 5px;}
.content-title h1+h2:empty{margin-top:0;}
.text-line-left:before{content: "-"; padding: 0 5px;}
.text-line-left:empty:before{display: none;}

.text-box{ position:relative; box-sizing: border-box;}
.text-date{ display:block;font-size: 0.8em;line-height:1.2em;letter-spacing: 0.2em; white-space: pre-line;}
.text-date:empty{margin: 0;}
.text-year{position: relative; display:block;font-size: 3.75em;line-height:1em; padding-bottom: 0.2em;letter-spacing: -0.05em;text-align: center;color:#000;}
.text-year:after, .text-since:before{content:"YEAR";display: block;font-size:12px;line-height: 20px;letter-spacing: 0.2em;}
.text-since:after{display: none;}
.text-since:before{content:"SINCE";margin-top: 20px; margin-bottom: -10px;}
.text-number{display: block;font-size:2.5em;line-height: 1em; white-space: pre-line;text-align: center;}
.text-number small{display: block; font-size:12px;line-height: 12px;-ms-transform: scale3d(.9,.9,.9);-webkit-transform: scale3d(.9,.9,.9);-moz-transform: scale3d(.9,.9,.9);-o-transform: scale3d(.9,.9,.9);transform: scale3d(.9,.9,.9);}
a .text-more:after{content:"LEARN MORE";display: inline-block;font-size: min(.75em,13px);line-height: 1.6em; letter-spacing: 0.2em;color: #666; border-bottom: solid 1px rgba(102,102,102,.5);margin-top: 20px;}
a:hover .text-more:after{color: #007b80;border-bottom: solid 1px rgba(0,123,128,.5);}
.icon-new .text-box:before/*, .icon-hot .text-box:before*/{content: "NEW";position: absolute;top:-50px;left: 0; display:block; color:#fff; background:#007b80; font-size:12px;line-height: 17px;letter-spacing: 0.2em;padding: 0 3px 0 25px;-ms-transform: scale3d(.9,.9,.9);-webkit-transform: scale3d(.9,.9,.9);-moz-transform: scale3d(.9,.9,.9);-o-transform: scale3d(.9,.9,.9);transform: scale3d(.9,.9,.9); transform-origin:left center;}
/*.icon-hot .text-box:before{content: "HOT";background:#b92c2c;} */

.grid-item{ position:relative; box-sizing: border-box;}
.item-list, .item-small-list{position: relative; display: flex;flex-wrap: wrap;justify-content: flex-start;width: calc(100% + 40px);}
.item-list{margin-bottom: -90px;}
.item-small-list{margin-bottom: -50px;}
.item-list.swiper-container, .item-small-list.swiper-container{width:100%;margin-bottom:0;}
.item-list .grid-item, .item-small-list .grid-item{ box-sizing: border-box;padding-right:40px;padding-bottom: 40px; }
.item-list .grid-item a{position: relative; display:block;}
.item-list .grid-item a:hover, .other-list .swiper-slide{background: #fff;-moz-box-shadow: 0 0 10px rgba(0,0,0,.05); -webkit-box-shadow: 0 0 10px rgba(0,0,0,.05); box-shadow: 0 0 10px rgba(0,0,0,.05);}
.item-list-2 .grid-item{ width:50%; }
.item-list-3 .grid-item{ width:33.3%;}
.item-list-4 .grid-item{ width:25%;}
.item-list-5 .grid-item{ width:20%; }
.item-list .grid-item p, .item-list-1 .grid-item p{text-align: justify; letter-spacing: 0.05em;}
.item-list .grid-item p:empty, .item-list-1 .grid-item p:empty{margin-top: 0}
.item-list .img-box:before, .item-list .img-over-box:before{content:"";position: absolute;top:0;left: 0; display: block;width: 100%;height: 100%;background-color: #000;opacity: .05;z-index: 1;}
.item-list a:hover .img-box:before, .item-list a:hover .img-over-box:before{opacity: 0;}
.item-list .text-box{padding: 45px 20px 50px 20px;}
.item-small-list .text-box{ padding: 20px 0 10px 0;}
.item-list-1 .grid-item{margin-bottom: 120px;}
.item-list-1 .grid-item:last-child{margin-bottom: 0 !important;}
.item-list-1 .text-box{ width: 90%;max-width:400px;}
.item-list-1 .img-box+.text-box{margin-top: 40px;}
.dot-list li{position: relative;box-sizing: border-box; margin-bottom: 5px;padding-left: 1.3em;}
.dot-list li:before{content:"\f000";position: absolute;display: block; left: 0;top: 4px;}
.list-style-none:before{display: none;}

.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, .img-ratio56.img-box{padding-bottom:56.25%; }
.img-ratio66 .img-box, .img-ratio66.img-box{padding-bottom:66.66%; }
.img-ratio100 .img-box, .img-ratio100.img-box{padding-bottom:100%; }
.img-ratio150 .img-box, .img-ratio150.img-box{padding-bottom:150%; }
.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%;}
.img-cover .img-box img, .img-cover.img-box img { object-fit: cover;}
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;opacity: 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%);}
/*============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%; border-bottom: solid 1px;z-index: 1; }
.underline.left a:before, a.underline.left:before{ left: 0;}
.underline a:hover:before, .underline a.active:before, .underline li.active > a:before, a.underline:hover:before{width: 100%; left: 0%;opacity: .7;}
.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;}
a.button-icon, .button-icon a{position: relative; display:inline-block;height:3em;width:3em;line-height:3em;border-radius: 2em; text-align: center;overflow: hidden;background-color: #000;color:#fff;margin-right: 0.2em;}
a.button-icon:hover, .button-icon a:hover{background-color: #007b80; z-index: 1;}
.button-icon a:last-child{margin-right:0;}
a.button-icon i, .button-icon a i{font-size:1.2em;display: block;}
.button-icon a i:before{line-height: inherit;}
a.button-icon:hover i, .button-icon a:hover i{margin-top: -100%;}
.button-icon b{font-size:0.8em;line-height: 1.2em;display: block;padding-top:.7em;font-weight: normal;}
.button-icon a.active{width:auto;padding: 0 1.5em;}
.button-icon a.active:hover i{margin-top: 0;}
.button-icon a.active i, .button-icon a.active b{display: inline-block;}
.button-icon a.active b{font-size: 1.1em;line-height:3em;padding-top:0;padding-left: 0.4em;font-weight:bold;vertical-align: bottom;}

.button-icon-text{display: flex;flex-direction: column;align-items: flex-start; margin-bottom: -10px;}
a.button-icon-text, .button-icon-text a{position: relative; display:flex; align-items: flex-start; padding: 6px 0;box-sizing: border-box;letter-spacing: 0.05em;}
.button-icon-text i{margin-right: 8px;line-height: 1.6em;}
.button-icon-text b{line-height: 1.4em;}
.button-icon-text .dripicons-phone{margin-top: 0.4em;}
.button-icon-text .dripicons-phone+b{font-size: 1.3em;}
.button-icon-text.hor{flex-direction:row; justify-content: center; align-items: center; }
.button-icon-text.hor li{padding: 0 1.5%; box-sizing: border-box;}
.button-icon-text .flex-nowrap, .button-icon-text .flex-nowrap a{min-width: 0;}
.button-icon-text .flex-nowrap b { white-space: nowrap;text-overflow: ellipsis; overflow: hidden;}

.button-text a, a.button-text{position: relative; display:inline-block; padding:10px 20px; line-height: 25px;background-color: #007b80; border-radius: 3px;color: #fff;text-decoration: none;letter-spacing: 0.1em;}
.button-text a:hover ,a.button-text:hover{background-color:#947458;}
.button-text i{margin-right: 5px;}

.share-button{ margin-bottom: -10px;}
.share-button a{display: inline-block;width:50px;height: 50px;line-height: 50px;padding: 0;text-align:center; overflow:hidden;}
.share-button i{position: relative;left:auto;top:auto;line-height: inherit; font-size:30px;}
a.share-facebook:hover{color:#3b5998;}
a.share-line:hover{color:#00b900;}
.category-list{ display: block;text-align: center; font-size: 0;width: 110%;margin-left: -5%;}
.category-list li{position: relative; display:inline-block;font-size: 16px; line-height: 24px; letter-spacing: 0.2em; margin: 0 20px; }
.category-list a{display:inline-block;padding: 8px 0;}
.category-list li.active a{color:#007b80;}

/*============page===============*/
.page { display: flex;justify-content: center;clear: both;text-align: center; position: relative;left: 50%; -ms-transform: translateX(-50%); -moz-transform: translateX(-50%); -webkit-transform:translateX(-50%); -o-transform:translateX(-50%); transform: translateX(-50%);width: 115%;margin-top: 90px;}
.page a {position: relative; min-width:40px; height: 40px; line-height: 40px; display: inline-block;text-align: center;font-size: 0.8125em;font-weight: bold;vertical-align: middle;}
.page a.active{color:#007b80;}
.page i{font-size: 1.28em;vertical-align: text-top;}
a.page-prev, a.page-next{font-size: max(0.8125em,14px);}
a.page-prev{padding-right:10px;}
a.page-next{padding-left:10px; }
a.page-prev:before, a.page-next:before{display: none;}
.page a:hover:before, .page a.active:before{width: 50%;left: 25%;}
/*==============index==================*/
.index-box{z-index: 2;position: absolute;top:0;left: 0; width: 100%; height: 100%; display: flex;  flex-direction: column; justify-content: center;text-align: center;background-color: rgba(0,0,0,.4)}
.index-box em{display: block;font-size: 3.75em; line-height: 1em;}
.index-box h1{font-size: 1.5em; line-height: 1.5em;letter-spacing: 0.4em;margin-right: -0.4em;margin-bottom: 0.4em;}
.index-box .text-more:after{color: #fff; border-bottom: solid 1px rgba(255,255,255,.5);display: table; margin-left: auto;margin-right: auto;}
a:hover .index-box .text-more:after{color: #fff; border-bottom: solid 1px rgba(255,255,255,.5);}
.index-title{position: relative; padding:1px 0 1em 9em;background: url(../images/title-icon.png) left top no-repeat;background-size: 8em auto;box-sizing:border-box;}
.index-title a{position: absolute;right: 0;top:0;text-align: right;}
.index-title em{margin-top: -.2em;margin-right: 45px;white-space: nowrap;}
.news-small-list .grid-item{ width:33.3%;}
.index-news-container{display: flex;}
.index-news-grid1{width: 33.3%;min-width: 400px;padding-right: 40px; box-sizing: border-box;}
.index-news-grid1 .news-list{display: block;}
.index-news-grid2{width: 66.6%;}
/*==============about==================*/
.grid-max-left  .about-title-box, .grid-max-left > .text-box{margin-left: auto;max-width: 1540px;width: 91.9%;}
.grid-max-right .about-title-box, .grid-max-right > .text-box{margin-right: auto;max-width: 1540px;width: 91.9%;}
.about-title-box h1,.about-title-box em{white-space: nowrap;}
.about-text-box{box-sizing: border-box; width: 64%; margin-left: auto;padding-left: 4%;margin-top: 30px;}
.about .img-margin div:first-child{margin-top: 3%;}
.about .img-margin{min-height: 35vw;}
.team-list{margin-top: 60px;}
.team-list .swiper-container.button-outer{overflow: hidden;}
@media screen and (min-width: 700px){
.about-title-box{display: flex;}
.about-title-box.right{justify-content: flex-end;}
.about-title-box.left{justify-content: flex-start;}
.about-title-box div:first-child{padding-right: 4%;box-sizing: border-box;}
}
@media screen and (min-width: 1000px){
#about6 .about-title-box{width: 100%;max-width:inherit;}
.about-title-top{position: relative;top:30px;}
}
@media screen and (max-width: 700px){
.about-title-box div{width: 100%;}
.about-title-box div:first-child{margin-bottom: 25px;}
.about .grid-max .grid-small{width: 100%;}
.about .margin-bottom3{margin-bottom: 40px;}
.about .img-margin, .about .img-over-box{width: 110%;}
.about-text-box {width: 91.9%; padding-left: 0;margin-top: 40px;}
}
#about2{position: relative; height: 100vh; min-height:650px;max-height: 1080px; display:flex; align-items: center;}
#about2 .img-box{position: absolute;top:0;left: 0; width: 100%; height: 100%;background-image:url("../images/about/about2-img1.jpg");background-position: right center;background-repeat: no-repeat;background-size: cover;}
#about2 .text-box{max-width: 330px;margin-left: auto;margin-right: 5%;color:#fff;z-index: 1;}
#about2 .text-box p{color:#fff;}
@media screen and (orientation:portrait){ 
#about2{display: block;height:auto; min-height:inherit;max-height:inherit;}
#about2 .img-box{position: relative; height: 0;padding-bottom: 66%;background-image:url("../images/about/about2-img1.jpg");background-position: left center;}
#about2 .text-box{margin: auto;margin-left: 7.5%;max-width:900px;margin-top: -190px;}
#about2 .text-box h1{margin-bottom: 100px;}
#about2 .text-box p{color:#333;}
}
@media screen and (orientation:portrait) and (max-width: 700px){ 
#about2 .text-box {margin-top: 50px;color:#333;}
#about2 .text-box h1 {margin-bottom: 25px;}
}
/*==============news==================*/
/*.news-list .plyr__video-embed{aspect-ratio: 1 / 1 !important;}*/
/*==============progress==================*/
.progress-list [data-icon]{display: flex;}
.progress-list [data-icon]:before{display: none;}
.progress-list [href*="act.php"] [data-icon]:before{display: inline-block;order: 2; margin-left: 3px;line-height: inherit;}
/*==============landscape==================*/
.landscape-list { justify-content: center;}
.landscape-list .img-box{height: 25vw;}
.landscape-list p{max-width: 480px;}
.landscape-list .text-number{position: absolute;right: 0;bottom: 0; padding: 170px 30px 30px 170px; width: 50px;height: 50px;color:#fff;white-space: nowrap;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( -45deg, rgba(0,0,0,.3) 0, rgba(0,0,0,0) 50%); }
.landscape-list .grid-item-small{width: 33.3%;}
.landscape-list .grid-item-middle{width: 50%;}
.landscape-list .grid-item-large{width: 66.6%;}
/*==============project==================*/
.project-list .button-icon-text{display: block;}
.project-list a.button-icon-text, .project-list .button-icon-text a {clear: both;float: left;padding: 0;}
.project-list .button-icon-text b, .project-list .button-icon-text i {float: left;padding: 6px 0;}
.project-list .button-icon-text i{clear: both;}
@media screen and (min-width: 1001px){
.project-list .grid-item:nth-child(odd), .project-list .swiper-slide{flex-direction:row-reverse;}
.project-list .grid-item:nth-child(even) .flex-3-8{display: flex;justify-content: center;}
.project-list .grid-item:nth-child(even) .text-box{margin-left: 10%;}
}
@media screen and (max-width: 1200px) and (min-width: 1001px), (max-width: 400px){
.project-list .text-box p br{display: none;}
}
.project-content #result{ text-align: center;}
.project-section h1:empty+.html-edit{margin-top: 0;}
.project-section.full .text-box{max-width: 1200px;}
.project-section.full{flex-direction:column;}
.project-section.full .flex-6-12{width: 100%;}
@media screen and (max-width: 1400px) and (min-width: 1001px){
.project-section:nth-of-type(odd) .text-box{margin-left: 0;}
.project-section:nth-of-type(even) .text-box{margin-right: 0;}
.project-section.full .text-box{margin-left:auto;margin-right:auto;}
}
@media screen and (min-width: 1001px){
.project-section:nth-of-type(even) {flex-direction:row-reverse;}
.project-section:nth-of-type(even).full {flex-direction:column;}
.project-section.full div+.img-list{margin-top: 60px;}
}
.project-navbar{position: fixed;display:flex;bottom: -60px;right: 1.5%;z-index: 10;pointer-events:none;}
.sticky-page .project-navbar{bottom: 20px;opacity: 1; pointer-events:auto;}
@media screen and (max-width: 500px){
.project-navbar{width: 100%;right: 0;background-color:#000;justify-content: flex-end; }
.sticky-page .project-navbar{bottom: 0}
.project-navbar.button-icon a{border-radius: 0;margin-right: 0;border-left: solid 1px #333;}
.project-navbar.button-icon a.active {margin-right: auto;padding: 0 4%;flex: 1;text-align: left;}
}
@media screen and (max-height: 450px) and (orientation:landscape){
.project-navbar{display: none !important;}
}
/*==============portfolio==================*/
.portfolio-list .text-box{text-align: center;}
.portfolio-list .img-box+.text-box{margin-left: auto;margin-right: auto;}
.portfolio-list .flex-3-8 .img-box{width: 60%;padding-bottom: 60%;margin: 0 auto;}
.portfolio-list a{position: relative; width: 100%;}
@media screen and (min-width: 1001px){
.portfolio-list .grid-item:nth-child(odd), .portfolio-list .grid-item:nth-child(odd) > a, .portfolio-list .swiper-slide, .portfolio-list .swiper-slide > a{flex-direction:row-reverse;}
}
@media screen and (min-width: 1600px){
.portfolio-list .flex-3-8 .img-box{width: 300px;height: 300px; padding-bottom: 0;}
}
@media screen and (max-width: 1600px) and (min-width: 1001px){
.portfolio-list .title2 {font-size: 1.875em;}
}
.timeline-list{display: flex;flex-direction: column;}
.timeline-list .subtitle1, .timeline-list .subtitle2{margin-right: 0;}
.timeline-list .grid-item, .timeline-list .grid-item > a{display: flex;flex-direction: row;align-items: center;}
.timeline-list .grid-item > a{max-width: 100%;}
.timeline-list .grid-item{width: 50%;border-left: solid 1px #ccc; padding: 40px 0;}
.timeline-list .grid-item+.grid-item{padding-top: 0;}
/*.timeline-list .grid-item:last-of-type{padding-bottom: 90px;}*/
.timeline-list .img-box{width: 20vw; height: 20vw; margin-left: -1.5vw;max-width: 260px;max-height: 260px; flex-shrink: 0; -moz-box-shadow: 5px 5px 10px rgba(0,0,0,.25); -webkit-box-shadow: 5px 5px 10px rgba(0,0,0,.25); box-shadow: 5px 5px 10px rgba(0,0,0,.25); margin-bottom: 20px;}
.timeline-list .text-box{padding-left: 3.5vw; min-width: 0}
.timeline-list .text-box:first-child:before{content: "";position: absolute;left: 3px;top:50%; width: 2vw; border-top:solid 1px #ccc;}
.timeline-list .grid-item:nth-of-type(odd) .text-box:before{left: auto;right: 3px;}
.timeline-list .grid-item:nth-of-type(odd), .timeline-list .grid-item:nth-of-type(odd) > a{flex-direction:row-reverse;}
.timeline-list .grid-item:nth-of-type(odd){border-left:none;border-right: solid 1px #ccc;text-align: right;box-sizing: content-box;}
.timeline-list .grid-item:nth-of-type(even){margin-left: auto;}
.timeline-list .grid-item:nth-of-type(odd) .text-box{ padding-left:0;padding-right: 3.5vw;}
.timeline-list .grid-item:nth-of-type(odd) .img-box{margin-left: 0;margin-right: -1.5vw;}
@media screen and (min-width: 1000px){
.timeline-list .grid-item:nth-of-type(odd):nth-of-type(3n+2) .img-box{margin-left: 0;margin-right: -2vw;}
.timeline-list .grid-item:nth-of-type(even):nth-of-type(3n+2) .img-box{margin-left: -2vw;}
.timeline-list .grid-item:nth-of-type(3n+2) .img-box{max-width: 300px;max-height: 300px;}
/*.timeline-list .grid-item.grid-item-large .img-box{max-width: 360px;margin-left: -2vw !important;}
.timeline-list .grid-item:nth-of-type(odd).grid-item-large .img-box{margin-right: -2vw !important;}
.timeline-list .grid-item:nth-of-type(odd).grid-item-large .img-box + .text-box{position: absolute; left: 115%; max-width: 85%;text-align: left; padding-right:0;}
.timeline-list .grid-item:nth-of-type(even).grid-item-large .img-box + .text-box{position: absolute; right: 115%; max-width: 85%;text-align: right; padding-left:0;}*/
}
@media screen and (min-width: 500px){
.timeline-list .text-box:first-child h2{font-size: 1.5em;}
}
/*==============form==================*/
label, input, button, textarea, select{letter-spacing: 0.1em;}
form { position: relative; display: block;letter-spacing: 0.1em;}
.form-box form {display: flex;flex-wrap: wrap;margin-top: -25px;}
form .input-column,form .input-row{ position: relative; width:100%; box-sizing: border-box;font-size: 0;}
label { position: absolute; height: 40px; top: 8px;left: 0; line-height: 40px; display: block; white-space: nowrap;font-size:16px;}
input[type="checkbox"] + label, input[type="radio"] + label{position: relative; display:inline-block; margin-top: 0;height: 30px;line-height:30px; padding-left:22px;}
input[type="checkbox"] + label{ padding-left:18px;}
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; 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";}
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="checkbox"].error + label:before{;border:solid 2px #007b80;}
input[type="checkbox"].error ~ div, input[type="checkbox"].error ~ div a{color:#007b80;}
input[type="radio"] + label:before { content: ""; position: absolute; display:block;left: 1px;top:50%; margin-top: -8px;width:12px; height:12px;border:solid 2px; 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:#007b80; }
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{font-size:16px;line-height: 40px; padding: 8px 0 2px 95px; height: 50px; width: 100%; background-color:transparent; box-sizing: border-box;border-bottom: solid 1px rgba(153,153,153,.3);}
::-webkit-calendar-picker-indicator { opacity: 0.5;margin-left: 5px;}

textarea { height: 195px; line-height: 24px;padding-top: 16px;}
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:invalid{ color: #999;font-size: 12px;}
select, select option, select.active{color:#333;font-size: 16px;}
select option:checked, select option:active, select option:focus, select option:hover{background:#007b80; color:#fff;}
select.placeholder.empty{ color: #999;font-size: 12px;}
.input-box{height: auto; min-height: 50px;}
form small, .text-required{ display: inline-block;width: 13px;color: #007b80;vertical-align:middle; font-size: 20px;font-weight: bold;}
.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 1px rgba(0, 123, 128,.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 #007b80;}
img.rand-img { position: absolute; right: 0px; bottom: 1px; width:100px; height:48px;cursor: pointer;}
input[type="reset"], input[type="submit"], #submit, #reset, #submitBtn{-webkit-appearance: none; position: relative; display: inline-block;font-size:16px;letter-spacing: 0.2em; cursor: pointer; background-color:#000;color:#fff;line-height: 45px; width: 100%; white-space: nowrap;text-align: center;border-radius: 30px;}
input[type="reset"]+input[type="submit"], #reset+#submit, #reset+#submitBtn{width: 50%;}
input[type="reset"], #reset{margin-right: 1.5%;}
input[type="submit"]:hover, input[type="reset"]:hover, input[type="reset"]:focus, input[type="submit"]:focus, #submit:hover, #reset:hover, #submitBtn:hover{background-color:#007b80;}
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: #007b80;}
input[type="button"]:hover, input[type="file"]:hover{ text-decoration:none; }
.input-bottom{ position: relative; width: 100%;}
.input-button{display:inline-block;width:100%;margin-top:30px; max-width: 250px;}
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: #007b80 !important;}/*Change Chrome fill*/
.input-privacy{display: flex; min-height: 24px; line-height: 24px;font-size:16px; margin-top:25px;margin-right: 10px;}
.input-privacy input[type="checkbox"] + label{position: relative; top: auto; left: auto; vertical-align: bottom;}
input[type="checkbox"] + label{height: 24px;line-height: 24px;padding-right: 5px;margin-left: 3px;}
.input-privacy a{display: inline-block;}
.hide-box{text-align: justify; display: none;}
.form-link{ text-decoration: underline;}
.form-link:hover{ text-decoration: none;}
::placeholder,::-webkit-input-placeholder{ color:#aaa;font-size: 12px;}
:-ms-input-placeholder{color: #aaa; font-size: 12px;}
::-moz-placeholder{ color: #aaa; font-size: 12px;opacity: 1;}
select.select-category, .select-category select{display:inline-block; height: 50px; line-height: 50px; padding:0;text-align: center; color: #007b80; border-bottom:none;width:auto;background-image: none;cursor: pointer;}
select.select-category option, .select-category select option{ font-size: 16px; }

@media screen and (min-width: 700px) {
form .input-column{ width:50%;}
form .input-column:nth-child(even){padding-left: 2%;}
textarea.textarea-large{ height: 260px;}
}
@media screen and (min-width: 500px) {
label { top: 22px;}
input[type="text"], input[type="password"], input[type="tel"], input[type="email"], input[type="date"], select, textarea, .input-box{padding-top: 20px;height: 65px;}
textarea { padding-top: 30px;height: 195px;}
select{background-position: right 30px;}
.input-box{min-height: 65px;}
.input-button{width:40%;margin-left: auto;}
.input-bottom{ display:flex; justify-content: space-between;}
}
@media screen and (max-width: 350px){ 
label, input, button, textarea, select {letter-spacing: 0.05em;}
}
/*============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 {position: relative;overflow: hidden;}
.swiper-container-coverflow .swiper-slide-active{-ms-transform: translateZ(0)!important;-webkit-transform: translateZ(0)!important;transform: translateZ(0)!important;}
.swiper-lazy-preloader{z-index: 100;}
.swiper-pagination-bullet:focus, .swiper-button-next:active, .swiper-button-prev:active{border: none;}
.swiper-pagination{box-sizing: border-box;text-align:center; color: #fff;}
.swiper-pagination-bullet {position: relative;background:transparent;opacity: .5;width: 10px;height: 10px;padding: 20px 5px 10px 5px;margin: 0!important;}
.swiper-pagination-bullet-active {background: transparent;opacity: 1;}
.swiper-pagination-bullet:before{ content: "";display: block;width: 0;height: 0;border-style: solid;border-width: 0 4.5px 7.8px 4.5px;border-color: transparent transparent #000 transparent;}
.swiper-button-next, .swiper-button-prev{width: 50px;background-size: 22px 40px;}    
.swiper-button-next{right: -50px;opacity: 0;}
.swiper-button-prev{left: -50px;opacity: 0;}
.swiper-container:hover .swiper-button-next{right:0;opacity: 1;}
.swiper-container:hover .swiper-button-prev{left:0;opacity: 1;}
.swiper-button-next.swiper-button-disabled, .swiper-button-prev.swiper-button-disabled, .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-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);}

.swiper-container.button-outer .swiper-pagination{position: relative;bottom: auto;margin-top: 30px;margin-bottom: -10px;}
.swiper-container.button-outer .swiper-button-next, .swiper-container.button-outer .swiper-button-prev{top:0;height: 100%;width: 10%;}
.swiper-container.button-outer .swiper-button-next, .swiper-container.button-outer:hover .swiper-button-next{right:-10%;}
.swiper-container.button-outer .swiper-button-prev, .swiper-container.button-outer:hover .swiper-button-prev{left:-10%;}
.swiper-container.button-outer .swiper-button-prev { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E") !important;}/*000000*/
.swiper-container.button-outer .swiper-button-next { background-image: url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E") !important; }
.index-title + .swiper-container.button-outer .swiper-pagination{position: absolute;top: -100px;right: -5px;bottom: auto;left: auto;width: auto;margin:0;}
.swiper-container.button-full, .swiper-container.button-full a{color:#fff;}
.swiper-container.button-full .swiper-pagination {bottom: 10px;}
.swiper-container.button-full.header-box .swiper-pagination {bottom: 40px;}
.swiper-container.button-full .full-box+a, .swiper-container.button-full .inline-YTPlayer+a{position: absolute;left: 0;top:0;width: 100%;height: 100%;}
.swiper-container.button-full .swiper-pagination-bullet:before{border-color: transparent transparent #fff transparent;}

.swiper-container.button-outer{overflow: visible;}
.swiper-container.button-outer .swiper-slide .img-box{opacity:.3;}
.swiper-container.button-outer .swiper-slide .text-box{opacity: 0;}
.swiper-container.button-outer .swiper-slide-visible .img-box{opacity:1;}
.swiper-container.button-outer .swiper-slide-visible .text-box{opacity: 1;}
.swiper-container.button-outer.item-list-1 .swiper-slide-visible .img-box{opacity:.3;}
.swiper-container.button-outer.item-list-1 .swiper-slide-visible .text-box{opacity: 0;}
.swiper-container.button-outer.item-list-1 .swiper-slide-active .img-box{opacity: 1;}
.swiper-container.button-outer.item-list-1 .swiper-slide-active .text-box{opacity: 1;}
.item-list-1 .swiper-wrapper{height: auto !important;}
.item-list-1 .swiper-slide{overflow: visible;width: 100%; max-width:1540px;margin:0 5.5%;}
/*============mb.YTPlayer===============*/
.inline-YTPlayer{max-width:inherit!important;height: 100%;}
.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{ padding-bottom:0!important; height: 100% !important; width: 100%; background-attachment: inherit !important;}
.video-full.video-contain .mbYTP_wrapper iframe{width: 100% !important; height: 100% !important;margin-left: 0 !important;margin-top: 0 !important;}
.swiper-container .inlinePlayButton{/*right: 40px; bottom: 100px;*/ z-index: 10;}
/*.video-box{background-attachment: inherit!important;z-index: 1;padding-bottom: 56.25%;}*/
@media screen and (max-width: 800px) {
.inlinePlayButton{ width: 40px;height: 40px; line-height:40px;font-size: 20px;}
}
/*調音量功能衝突隱藏*/
.mb_YTPBar .simpleSlider{display: none !important;}
.mb_YTPBar span.mb_OnlyYT {left: 190px;}
/*============plyr===============*/
.plyr__control--overlaid{ background: rgba(0,123,128,.8) !important;}
.plyr__control--overlaid:focus,.plyr__control--overlaid:hover{background:#007b80 !important;}
.plyr--audio .plyr__control.plyr__tab-focus,.plyr--audio .plyr__control:hover,.plyr--audio .plyr__control[aria-expanded=true]{background:#007b80 !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:#007b80 !important;color:#fff}
.plyr__menu__container label.plyr__control input[type=radio]:checked+span{background:#007b80 !important;}
.plyr--full-ui input[type=range]{color: #007b80 !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===============*/
/*.justified-gallery > .entry-visible,*/ a[data-fancybox] .img-over-box, a[data-fancybox] .img-box, .icon-map:after, .icon-tel:after, .icon-link:after, input[type="checkbox"] + label:after, .dot-list li:before, .html-button a:before, a.html-button:before, a .html-button:before{ 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:#007b80;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;}
/*============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:before{content:"";opacity: 0;position: absolute;display: block;top:0;left: 0;bottom: 0;right: 0;margin: auto;width: 60px;height: 60px; background: url("../images/title-icon-w.png") no-repeat;background-size: contain;z-index: 2;}
.justified-gallery > a:after, .justified-gallery > a.video:after{ content: "ZOOM IN"; opacity: 0;position: absolute;top:0;left: 0;font-size: 12px;text-align: center;color:#fff;-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); z-index: 1; background:rgba(0,123,128,.5);width: 100%; height: 100%;display: flex;align-items: center; justify-content: center; padding-top: 20px;}
.computer .justified-gallery > a:hover:after, .computer .justified-gallery > a:hover:before{opacity: 1;}
.computer .justified-gallery .video:before{z-index: 2;top: -30px;}

a[data-fancybox] .img-over-box:after, a[data-fancybox] .img-box:after{ content: "\ec97"; opacity: 0;position: absolute;display: block;top:0;left: 0;bottom: 0;right: 0;margin: auto;font-size: 40px;height: 30px;text-align: center;color:#fff;-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); z-index: 1; }
/*.justified-gallery > a.video:after,*/ a[data-fancybox].video .img-over-box:after, a[data-fancybox].video .img-box:after{ content: "\eca6";}
 a[data-fancybox]:hover .img-over-box:after, a[data-fancybox]:hover .img-box:after{opacity: 1;font-size: 30px;}
/*============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:rgba(0,0,0,.9);}
.fancybox-slide--html {padding: 10px 0;}
.fancybox-content { padding: 80px 5%; border-radius: 5px;}  
.fancybox-caption{white-space: pre-line;}
.fancybox-blue .fancybox-bg {background:rgba(0,123,128,.95);}
@media screen and (max-width: 1400px) {
.fancybox-content {padding: 80px 7.5% 70px 7.5%;}
}
@media screen and (min-width: 800px) {
.fancybox-slide--html .fancybox-close-small {position: fixed;padding: 0;top:10px;right: 15px;color:#fff;}
}
@media screen and (max-width: 800px) {
.fancybox-content{ width: 95%;}
}
/*.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; }*/
/*============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;}
/*.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: 550px), (orientation:portrait) and (min-width: 900px){
.about .img-bg .img-box{background-image:url("../images/about-head.jpg"); }
.landscape .img-bg .img-box{background-image:url("../images/landscape-head.jpg"); }
.news .img-bg .img-box{background-image:url("../images/news-head.jpg"); }
.project .img-bg .img-box{background-image:url("../images/project-head.jpg"); }
.portfolio .img-bg .img-box{background-image:url("../images/portfolio-head.jpg");}
.contact .img-bg .img-box{background-image:url("../images/contact-head.jpg"); }
.progress .img-bg .img-box{background-image:url("../images/progress-head.jpg"); }
}
@media screen and (orientation:landscape) and (max-height: 550px){
.about .img-bg .img-box{background-image:url("../images/mobile/about-head.jpg"); }
.landscape .img-bg .img-box{background-image:url("../images/mobile/landscape-head.jpg"); }
.news .img-bg .img-box{background-image:url("../images/mobile/news-head.jpg"); }
.project .img-bg .img-box{background-image:url("../images/mobile/project-head.jpg"); }
.portfolio .img-bg .img-box{background-image:url("../images/mobile/portfolio-head.jpg");}
.contact .img-bg .img-box{background-image:url("../images/mobile/contact-head.jpg"); }
.progress .img-bg .img-box{background-image:url("../images/mobile/progress-head.jpg"); }
}
@media screen and (orientation:portrait) and (max-width: 900px){ 
.about .img-bg .img-box{background-image:url("../images/mobile/about-head-m.jpg"); }
.landscape .img-bg .img-box{background-image:url("../images/mobile/landscape-head-m.jpg"); }
.news .img-bg .img-box{background-image:url("../images/mobile/news-head-m.jpg"); }
.project .img-bg .img-box{background-image:url("../images/mobile/project-head-m.jpg"); }
.portfolio .img-bg .img-box{background-image:url("../images/mobile/portfolio-head-m.jpg");}
.contact .img-bg .img-box{background-image:url("../images/mobile/contact-head-m.jpg"); }
.progress .img-bg .img-box{background-image:url("../images/mobile/progress-head-m.jpg"); }
}
@media screen and (max-width: 1500px) {
.item-list-5 .grid-item{ width:25%;}
.title1 {font-size: 2.5em;}
}
@media screen and (max-width: 1400px) {
.item-list-4 .grid-item{ width:33.3%;}
}
@media screen and (max-width: 1600px) and (min-width: 1201px) {
.item-list-3 .title3, .other-list.news-list .title3{font-size: 1.6em;}
}
@media screen and (max-width: 1300px) {
.grid-container{ padding-top: 12%;padding-bottom: 12%; }
.grid-container-bottom{padding-bottom: 12%;}
.grid-container-top{padding-top: 12%;}
.grid-container-group .grid-container-bottom:first-of-type{padding-top: 12%;}
.grid-container-group .grid-container-top:last-of-type{padding-bottom: 12%;}
.item-list-1 .grid-item{margin-bottom: 11%;}
.title-box { font-size: 0.9em; width: 90%; left: 5%;bottom: 40px;}
.title-text {margin-bottom: 0.4em;}
}
@media screen and (max-width: 1300px) and (min-width: 1001px) {
.project-section .title2{font-size: 2.6vw;}
}
@media screen and (max-width: 1200px) { 
.item-list-3 .grid-item{ width:50%;}
.item-list .text-box{padding: 35px 15px 40px 15px;}
.item-small-list .text-box{padding-top: 15px;}
.item-list, .item-small-list{width: calc(100% + 30px);}
.item-list .grid-item, .item-small-list .grid-item{padding-right: 30px;  padding-bottom: 30px;}
.item-list{margin-bottom: -70px;}
.item-small-list{margin-bottom: -40px;}
.page {margin-top: 70px;}
.title1 {font-size: 2.25em;}
.title2 {font-size: 2em;}
.news-small-list .grid-item{ width:50%;}
.index-news-grid1{padding-right: 30px;}
}
@media screen and (max-width: 1200px) , (max-height: 800px) {    
/*============main===============*/
.margin-top1{margin-top:5px;}
.margin-bottom1{margin-bottom:5px;}
.margin-top2 {margin-top: 15px;}
.margin-bottom2 {margin-bottom: 15px;}
.margin-top3 {margin-top: 20px;}
.margin-bottom3 {margin-bottom: 20px;}
.margin-top4{margin-top:30px;}
.margin-bottom4{ margin-bottom: 30px;}
.margin-top5{margin-top:40px;}
.margin-bottom5{ margin-bottom: 40px;}
.margin-top6 { margin-top: 50px;}
.margin-bottom6 { margin-bottom: 50px;}
.section-top{ margin-top: 60px;}
.section-bottom{ margin-bottom: 60px;}
.section-top2{ margin-top: 80px;}
.section-bottom2{ margin-bottom: 80px;}
a .text-more:after {margin-top: 15px;}
.item-list-1 .img-box+.text-box {margin-top: 30px;}    
.swiper-button-next, .swiper-button-prev {background-size: 18px 28px;}
.swiper-container.button-outer .swiper-pagination { margin-top: 10px;}
}
@media screen and (max-width: 1100px) {  
.item-list-5 .grid-item{ width:33.3%; }  
}
@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:100%; }   
.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-space-right, .flex-space-right-big, .grid-space-right-small, .grid-space-right{padding-right: 0;}
.flex-space-left, .flex-space-left-big, .grid-space-right, .grid-space-left{padding-left: 0;}
.mobile-grid{ max-width: 700px; margin-right:auto; margin-left:auto;}
.mobile-top0{margin-top: 0 !important; padding-top:0 !important;}
.mobile-bottom0{margin-bottom: 0 !important; padding-bottom:0 !important;}
.mobile-top1{margin-top: 50px;}
.mobile-bottom1{margin-bottom: 50px;}
.mobile-top2{margin-top: 60px;}
.mobile-bottom2{margin-bottom: 60px;}  
.grid-container{ padding-top: 100px;padding-bottom: 100px;} 
.grid-container-bottom{padding-bottom: 100px;}
.grid-container-top{padding-top:100px;}
.grid-container-group .grid-container-bottom:first-of-type{padding-top: 100px;}
.grid-container-group .grid-container-top:last-of-type{padding-bottom: 100px;}
.item-list-1 .grid-item{margin-bottom: 80px;}
.item-list-1 .text-box{ width:100%; max-width: 500px;margin-left: auto;margin-right: auto;}
.category-list li{margin: 0 10px;letter-spacing: 0.1em;}
.swiper-container.button-outer .swiper-button-next,.swiper-container.button-outer .swiper-button-prev{display: none;}
/*.swiper-container.swiper-container-coverflow .swiper-slide{opacity:.3;}
.swiper-container.swiper-container-coverflow .swiper-slide-active{opacity:1;}*/
/*============other===============*/   
.index-news-grid1{min-width: 300px;}
.index-title{font-size: .85em; }
.index-title + .swiper-container.button-outer .swiper-pagination{top: -90px;}
.other-list .title3{font-size: 1.6em;}
.project-section div+.img-list{margin-top: 50px;}
.project-section .text-box{max-width: 1200px;}
.project-section .swiper-container{overflow:visible;}
.project-content .grid-max{max-width: 800px;}
.about .main p{text-align: justify;}
.about .main p br{display: none;}
.about .main p span{display:inline;}
.about .main p strong{display:block;text-align: left;}
.about .main p strong span{display:inline-block;}
.timeline-list .img-box{width: 30vw;height: 30vw;}
.timeline-list .grid-item:nth-of-type(odd) .img-box{margin-right: -60%;}
.timeline-list .grid-item:nth-of-type(even) .img-box{margin-left: -60%;}
}
@media screen and (max-width: 1000px) and (min-width: 701px){
#index-news .news-list h2{font-size: 1.5em;}
#index-news .news-small-list h2{font-size: 1.25em;}
}
@media screen and (max-width: 900px) {
.item-list-4 .grid-item{ width:50%;}
.item-list-2{ width: 100%;margin-left: auto;margin-right: auto;}
.item-list-2 .grid-item{ width: 100%;padding-right:0;} 
.landscape-list .img-box { height: 35vw;}
.landscape-list .grid-item-large{ width: 100%;}
.landscape-list .grid-item-small { width: 50%;}
}
@media screen and (max-width: 800px) {
.item-list-1 .swiper-slide{margin:0 5%;}
.page a { min-width: 35px; height: 35px;line-height: 35px;} 
}
@media screen and (max-width: 1000px) and (min-width: 701px) {
.item-list-3 .title3{font-size: 1.6em;}
}
@media screen and (max-width: 700px){ 
.hide-w700{ display: none !important;}
.item-list, .item-small-list{width: calc(100% + 20px);}
.item-list .grid-item, .item-small-list .grid-item{padding-right: 20px;  padding-bottom: 20px;}  
.item-list{margin-bottom: -60px;}
.item-small-list{margin-bottom: -30px;}
.page {margin-top: 60px;}
.item-list-3{ width: 100%;max-width: 480px;margin-left: auto;margin-right: auto;}
.item-list-3 .grid-item{ width: 100%;padding-right:0;} 
.item-list-5 .grid-item{ width:50%;}
.item-list-3.item-small-list{ width: 100%;max-width:inherit;}
.item-list-3.item-small-list .grid-item{ width: 50%;padding-right:40px;} 
.landscape-list .img-box { height: 60vw;}
.landscape-list .grid-item-small, .landscape-list .grid-item-middle, .landscape-list .grid-item-large{width: 100%;}
.button-icon-text.hor{flex-wrap: wrap;}
.button-icon-text.hor li{max-width:100%;padding: 0 10px; }
.title-en1{font-size: 3em;}
.title5 { font-size: 1.25em;}
.index-title{padding: 1px 0 0.5em 7em; background-size: 6.7em auto;}
.index-title h1{letter-spacing: .9em;}*
.index-title + .swiper-container.button-outer .swiper-pagination{top: -80px;}
 /*============other===============*/   
/*.portfolio .grid-max{width: 100%;}   */ 
.index-news-container{display:block;}
.index-news-grid1{width:100%;min-width:inherit;padding-right: 0;margin-bottom: 50px;}
.index-news-grid2{width:100%;}
.timeline-list .grid-item{padding: 30px 0;}
.timeline-list .text-box{font-size: 0.9em;}
.timeline-list h2{ font-size: 4.8vw;white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.timeline-list a .text-more:after{-ms-transform: scale3d(.9,.9,.9);-webkit-transform: scale3d(.9,.9,.9);-moz-transform: scale3d(.9,.9,.9);-o-transform: scale3d(.9,.9,.9);transform: scale3d(.9,.9,.9); transform-origin:left center;}
.timeline-list .grid-item:nth-of-type(odd) a .text-more:after{transform-origin:right center;}
/*.timeline-list .grid-item:last-of-type { padding-bottom: 70px;}*/
.timeline-list .img-box{width: 40vw;height: 40vw;}
.timeline-list .grid-item:nth-of-type(odd) .img-box{margin-right: -85%;}
.timeline-list .grid-item:nth-of-type(even) .img-box{margin-left: -85%;}
.timeline-list .text-box {padding-left: 5vw;}
.timeline-list .grid-item:nth-of-type(odd) .text-box { padding-right: 5vw;}
.timeline-list .text-box:before { width: 3vw;}
}
.show-w400, .show-w500, .show-w600{display: none;}
@media screen and (max-width: 600px){
/*============main===============*/    
.hide-w600{ display: none !important;}
.show-w600,.block-w600{display: block;}
.googlemaps {height: 400px;}
.img-margin{display: flex; width: auto;margin: -2px;}
.img-margin+.img-margin{margin-top: 2px;}
.img-margin .img-1-2, .img-margin .img-1-5, .img-margin .img-4-5, .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:2px;}
.img-margin-bottom{margin-bottom:4px;}
.img-margin-top{margin-top:4px;}
.margin-top6 { margin-top: 40px;}
.margin-bottom6 { margin-bottom: 40px;}
.section-top{margin-top: 50px;}
.section-bottom{margin-bottom: 50px;}
.section-top2{ margin-top: 60px;}
.section-bottom2{ margin-bottom: 60px;}
.mobile-top1{margin-top: 40px;}
.mobile-bottom1{margin-bottom: 40px;}
.mobile-top2{margin-top: 50px;}
.mobile-bottom2{margin-bottom: 50px;}    
.grid-container{padding-top: 80px;padding-bottom: 80px;}    
.grid-container-bottom{padding-bottom: 80px;}
.grid-container-top{padding-top:80px;}
.grid-container-group .grid-container-bottom:first-of-type{padding-top: 80px;}
.grid-container-group .grid-container-top:last-of-type{padding-bottom: 80px;}
.item-list-1 .grid-item { margin-bottom: 70px;}
.title-box { font-size: 0.75em;bottom: 30px;}
.category-list li{margin: 0 7px;}
.title2 {font-size: 1.875em;} 
.subtitle2 {letter-spacing: 0.2em;}   
.html-edit br{display:none;}
.html-edit h1, .html-title1{font-size: 1.25em;}
.html-edit h2, .html-title2{font-size: 1.125em;}
.html-edit h3, .html-title3{font-size: 1em;}    
.img-caption { bottom: 5px;font-size: 0.875em; padding: 0 10px;} 
/*============other===============*/  
.news-content .content-title .title1, .progress-content .content-title .title1{font-size: 1.6em;}  
.project-section .text-box { width: 100%;}
}
@media screen and (max-width: 500px) { 
/*============main===============*/
.hide-w500{ display: none !important;}
.show-w500,.block-w500{display: block;}
.item-list-4{ width: 100%;max-width:360px;margin-left: auto;margin-right: auto;}
.item-list-4 .grid-item{ width:100%;}
.text-number{font-size: 2.25em;}
.landscape-list .text-number{padding: 120px 15px 15px 120px;}
.title3{font-size: 1.5em;}
.title4{font-size: 1.125em;}
/*============other===============*/ 
.index-title{margin-left: -10px;}
.index-box em {font-size: 3em;}
.index-box h1 {font-size: 1.25em;}
.project-section .title2 {font-size: 6.5vw;} 
}
@media screen and (max-width: 400px){  
/*============main===============*/
.hide-w400{ display: none !important;}
.show-w400,.block-w400{display: block;}
.page-first+a, .page a:nth-child(6), .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, .page a:last-child, .page a:nth-last-child(2){ display: inline-block; }
p, .text0 {letter-spacing: 0.05em;}
/*============other===============*/
.index-title { font-size: .75em;}
.index-title h1{font-size: 15px;}
#index-portfolio .index-title em{letter-spacing: -0.15em;}
}
@media screen and (max-width: 350px){ 
.index-box h1 { letter-spacing: 0.2em;margin-right: -0.2em;}
}
.horizontal { display: inherit; }
.vertical { display: none; }
@media screen and (orientation:landscape){
}
@media screen and (orientation:portrait) {
.horizontal { display: none; }
.vertical { display: inherit; }
}
@media (min-resolution: 120dpi) {
body, body.computer .main{background-size: 960px auto; }
}