@charset "UTF-8";

/* CSS reset */
body{margin:0;padding:0;}html, body, div, span, applet, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre,a, abbr, acronym, address, big, cite, code,del, dfn, em, font, img, ins, kbd, q, s, samp,small, strike, strong, sub, sup, tt, var,b, u, i, center,dl, dt, dd, ol, ul, li,fieldset, form, label, legend,table, caption, tbody, tfoot, thead, tr, th, td, input, button,textarea{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline;}ol, ul{list-style:none;}a{text-decoration:none;}hr,br{clear:both;}blockquote, q{quotes:none;}blockquote:before, blockquote:after,q:before, q:after{content:'';content:none;}:focus{outline:0;}ins{text-decoration:none;}del{text-decoration:line-through;}table{border-collapse:collapse;border-spacing:0;}input, button, textarea, select{*font-size:100%;}body{line-height:180%;}ol, ul, li{list-style:none;}:link,:visited , ins{text-decoration:none;}blockquote:before, blockquote:after,q:before, q:after{content:'';content:none;} section, article, aside, footer, header, nav, main{display:block;}*,*::before,*::after{-moz-box-sizing:border-box;box-sizing:border-box;}
body{font-family:"Arial","Microsoft Jhenghei", "微軟正黑體",sans-serif;line-height: 1.5;color: #7c7c7c;background-color: #f3f3f3;position: relative;}
/*default*/
.clear{clear: both;}.clear:before, .clear:after {content:""; display:table; clear:both;} 
.al-c{text-align: center;}
.al-r{text-align: right;}
.al-l{text-align: left;}
.al-m{position: absolute;top: 50%;transform: translate(-50%, -50%);left: 50%;}
.fl-r{float: right}
.margin-c{display: block;margin: 0 auto;}
.mobile-show{display: none;}
.mobile-visible{visibility: hidden;}
a:hover,*{transition: all 0.3s ease-in-out 0s;}
.fit-img{object-fit: cover;display: block;height: 100%;width: 100%;}
img{max-width: 100%;}
.hover-line a:hover,a.hover-line:hover{text-decoration: underline;}
.hover-opa:hover{opacity: .6;}
.ellipsis{overflow: hidden;display: block;position: relative; line-height: 1.2em;text-align: justify;  margin-right: -0.8em;padding-right: 0.8em;max-height:44px;width: 99.9%;}
.ellipsis+.ellipsis{margin-top:10px;}
.ellipsis:before {content: '...';font-size: 14px;position: absolute;right: 0;bottom: 0;}
.ellipsis:after {content: '';position: absolute;right: 0;width: 0.8em;height: 0.8em;margin-top: 0.2em;background: white;}
/*theme*/
h1,h2,h3,h4{font-weight: 600;}
h1{font-size: 44px;
   line-height: 1.2; }
h2{font-size: 30px;}
h3{font-size: 24px;}
h4{font-size: 18px;}
h5{font-size: 14px;}
.theme,.theme-header{color: #00979c;}
.sub{color: #61c1be;}
.exsub{color: #417384;}
.exnr{color: #124775;}
.dark{color: #304050; }
.black{color: #383838;}
.nr{color: #7c7c7c;}
.f-w{color: #fff;}
.f-light{color: #ffffff;}
.highlight{color: #f1786f;}
.f-point{color: #ff7c6e;}
.f-shadow{text-shadow: 5px 5px 5px rgba(0,0,0,.5);}
.f-xxlg{font-size: 36px; }
.f-xlg{font-size: 24px; }
.f-lg{font-size: 20px;}
.f-md,p{font-size: 20px;line-height: 1.6;color: #4c4c4c;}
.f-nr{font-size: 14px;}
.f-mx{font-size: 13px;}
.f-xs{font-size: 12px;}
.bg-sub{background-color: #61c1be;}
.bg-w{background-color: #fff;}
/*theme-header*/
.theme-header{position: relative;display: inline-block;white-space:nowrap;margin-bottom: 20px;}
.theme-header:after{content: '';position: absolute;background-color: rgba(97,193,191,.2);width: calc(100% + 20px);left: 0;top: 50%;height: 27px;z-index: -1;}
.theme-header-sub:after{background-color: rgba(55,202,119,.15);}
.theme-header-sub{color: #4a9eac}
.section-header{margin-bottom: 50px;}
.page-section-header{border-bottom: 4px solid #00979c;}
.page-section-header-fix{padding-top: 30px;}
.page-section-header .theme-header{margin-bottom: 15px;}
.inner-section-header{margin-bottom: 10px;}
.page-header{position: relative;}
.page-header h1{position: absolute;text-shadow: 5px 5px 5px rgba(0,0,0,.5);padding: 10% 0 0 5%;z-index: 3;}
.nr-header{position: relative;}
.nr-header:before,.nr-header:after{content: '';position: absolute;width: 30%;height: 1px;background-color: #00979c;left: 0;top: 50%;}
.nr-header:after{left: auto;right: 0;}
.post-author-cover,.post-author-cover:before,.round-cover,.round-cover:before{border-radius: 100%;width: 220px;height: 220px;display: inline-block;position: relative;}
.post-author-cover:before,.round-cover:before{content: '';position: absolute;background-color: rgba(97,193,191,.2);left: -10px;z-index: 1;}
.post-author-cover img,.round-cover img{overflow: hidden;border-radius: 100%;position: relative;z-index: 2;}
.theme-blockquote{background-color: #fff;border: 1px solid #c3c3c3;border-left: 8px solid #61c1be;padding: 20px 20px;width: 90%;margin: 50px auto;}
.theme-blockquote-inner{border-left: 5px solid #61c1be;padding: 0 10px;margin: 0 30px ;}
.theme-blockquote-inner p{margin-bottom: 0!important;}
.theme-blockquote-sp{position: relative;padding: 0 60px;}
.theme-blockquote-sp:before,.theme-blockquote-sp:after{content: ' “ ';color: #ff7c6e;font-size: 150px;position: absolute;left: 0;top: 60px;line-height: 0;}
.theme-blockquote-sp:after{content: ' ” ';left: auto;right: 0;top: auto;bottom: 0;}
.theme-accordion > *{background-color: #fff;border-left: 5px solid transparent;}
.theme-accordion .ui-accordion-header{border-bottom: 3px solid #e5e6e6;border-radius: 3px;margin-bottom: 20px;position: relative;padding-right: 50px;transition:none!important;}
.theme-accordion .ui-accordion-content{border-left: 5px solid #61c1be; transition:none!important;}
.theme-accordion .ui-accordion-header-active{border-left: 5px solid #61c1be;border-top: 1px solid #dedede; border-right: 1px solid #dedede; margin-bottom: 0;border-bottom: 0; -webkit-border-bottom-right-radius: 0;-webkit-border-bottom-left-radius: 0;-moz-border-radius-bottomright: 0;-moz-border-radius-bottomleft: 0;border-bottom-right-radius: 0;border-bottom-left-radius: 0;}
.theme-accordion .ui-accordion-content-active{border-bottom: 1px solid #dedede;border-right: 1px solid #dedede;-webkit-border-bottom-right-radius: 3px;-webkit-border-bottom-left-radius: 3px;-moz-border-radius-bottomright: 3px;-moz-border-radius-bottomleft: 3px;border-bottom-right-radius: 3px;border-bottom-left-radius: 3px;}
.theme-accordion .ui-accordion-header:before{content: '＋';position: absolute;right: 20px;width: 20px;height: 20px;background-color: #4a9eac;color: #fff;font-size: 15px;text-align: center;border-radius: 100%;line-height: 20px;font-weight: 300;}
.theme-accordion .ui-accordion-header-active:before{content: '–';}
.theme-accordion h3 span.nr{font-weight: 300;padding-left: 20px;}
.img-gallery{display: flex; justify-content: space-between;align-items: center;}
.img-gallery > *{margin: 0 20px 20px 0;width: 23%;height: auto;display: block;}
.nr-list{margin-bottom: 20px;padding-left: 20px;}
.bubble-header{margin-bottom: 20px;position: relative;}
.bubble-header:after{position: absolute;left: 50%;top: -30%;transform: translate(-50%,-50%);height: 90%;}
.bubble-header-a:after{content: url(../img/common/bg-bubble_1.png);}
.bubble-header-b:after{content: url(../img/common/bg-bubble_3.png);}
.bubble-header-c:after{content: url(../img/common/bg-bubble_2.png);}
/*form*/
button{cursor: pointer;}
input,button{background: transparent;border:0;}
.site-form{position: relative;}
.site-form input{padding: 10px;border: 0;}
.subscribe-form{border: 1px solid #ddd;}
.subscribe-form input{width: calc(100% - 165px);padding: 13px 15px;}
.site-form label.error{position: absolute;left: 0;top: 100%;color: #ff7c6e;}
/*message-box*/
.box-overlay{position:fixed;top:0;left:0;width:100%;height:100%;background-color: rgba(0,0,0,.9);z-index: 98;display: none;}
.subscribe-ok-box{padding: 20px;border-radius: 5px;text-align: center;}
.subscribe-ok-box .ui-dialog-title{margin-bottom: ;font-size: 24px;color: #00979c;float: none;}
.subscribe-ok-box .ui-dialog-titlebar-close{display: none;}
.message-box .ui-button{background-color: #00979c;color: #fff;padding: 10px 30px;font-size: 14px;margin: 0!important;}
.message-box .ui-dialog-buttonpane .ui-dialog-buttonset{float: none;text-align: center;padding: 0!important;}
.message-box-content{display: none;}


/*section-subscribe*/
.page.subscribe-box{display: none;}
.index-section-subscribe{border: 1px solid #ddd;background-color: #fff;padding:20px 30px;}
.index-section-subscribe > *{display: inline-block;vertical-align: top;}
.index-section-subscribe .site-label{position: absolute;left: -60px;transform: rotate(-90deg);top: 40%;}
.index-section-subscribe .subscribe-header{width: calc(35% + 170px);padding: 0 10px 0 170px;}
.index-section-subscribe .subscribe-form{width: calc(65% - 180px);margin-top: 50px;}
.subscribe-aside{position: absolute;top: -15px;}
.subscribe-box.open{position: fixed;top: 50%;transform: translateY(-50%);width: 90%;left: 0;right: 0;z-index: 99;}
.subscribe-box .close{position: absolute;right: 20px;top: 10px;cursor: pointer;display: none;}
.open.box-overlay,.open.subscribe-box .close,.subscribe-box.open{display: block;}
a.disable,.disable{pointer-events: none;cursor: auto;}


/*btn*/
.site-btn,.ui-button{line-height: 1;text-align: center;color: #fff;cursor: pointer;}
.site-btn:hover{opacity: .8;}
.btn-w{background-color: #fff;}
.btn-main,.btn-sub:hover{background-color: #ff7c6e;position: relative;transition: all 0.3s ease-in-out 0s;}
.btn-sub{background-color: #61c1be;border-bottom: 3px solid #00979c;  }
.btn-blue{background-color: #4cadd2;}
.btn-disable{background-color: #383838;}
.btn-round{border-radius: 3px;}
.btn-nr{color: #00979c;border-radius: 3px;border: 2px solid #00979c;}
.btn-nr:hover{background-color:  #00979c;color: #fff;}
.btn-main:hover,.btn-sub:hover{opacity: 1;-webkit-box-shadow: 0 20px 30px -11px rgba(255,7,95,.2);box-shadow: 0 20px 30px -11px rgba(255,7,95,.2);-webkit-transform: translate(0px, -5px);transform: translate(0px, -5px);}
.btn-sub:hover{border-bottom-color: transparent;position: relative;top: 3px;transition: all 0.3s ease-in-out 0s;}
.btn-xs{font-size: 14px;padding: 8px 10px;}
.btn-md,.btn-ms{font-size: 20px;padding: 25px;min-width: 250px;}
.btn-mx{font-size: 16px;padding: 10px 30px;}
.btn-ms{padding: 15px 30px;min-width: 0;}
.btn-wrapper > *{display: inline-block;}
.play-video-wrapper{background-color: rgba(0,0,0,.6);position: absolute;width: 100%;height: 100%;left: 0;top:0;z-index: 9;}
.play-video-wrapper:before{left: 50%;top: 50%;transform: translate(-50%,-50%);font-size: 100px;color: #fff;content: "\e907";font-family: 'ys';position: absolute;opacity: .5}
.play-video-wrapper:hover:before{opacity: 1;}
.load-more{padding: 0 0 50px;}
.img-gallery-video .play-video-wrapper{background-color: transparent;}
/*index-section-record*/
.site-data-list{text-align: center;}
.data-digi{color: #509eac;font-size: 48px;font-weight: 600;padding: 0 0 20px;}
.data-aside{font-size: 24px;font-weight: 300;padding-left: 5px;}
.site-data-list{display: flex;justify-content:space-between;}
.site-data-list li{width: 23%;}
.site-data-list-grid-4 li{width: 24%;}
.data-list-content{line-height: 1;}
.data-list-content h2{text-align: center;position: relative;min-height: 75px;padding: 10px;}
.data-list-content h2 span{width: 100%;}
/*site-card*/
.site-card > *,.theme-card{border: 1px solid #c3c3c3;border-bottom: 5px solid #61c1bf;background-color: #fff;padding: 20px 0 10px;}
.theme-card-sub-content{display: flex; align-items:center;justify-content: space-between;}
.theme-card-sub-content img{width: 40%;  }.theme-card-sub-content > div{width: 55%;}
.theme-card-sub-content .site-btn{position: absolute;right: 0;bottom: -20px;}
/*.theme-flip-card li{perspective: 1000px;}*/
.flip-card-content{padding: 20px 20px 0;}
.card-content-fix{margin-top: -50px;}
.card-content-fix p{margin-bottom: 0 !important;}
.flip-card-content .site-label{margin-bottom: 20px;}
.flip-card-inner {min-height: 900px; padding-top: 0;position: relative;width: 100%;/*height: 500px; transition: transform 0.6s;-webkit-transform-style: preserve-3d;transform-style: preserve-3d;*/}
/*.theme-flip-card li:hover .flip-card-inner {-webkit-transform: rotateY(180deg);transform: rotateY(180deg);}*/
/*.flip-card-front, .flip-card-back {position: absolute;width: 100%;/*height: 100%;-webkit-backface-visibility: hidden;backface-visibility: hidden;-webkit-transform-style: preserve-3d;transform-style: preserve-3d;}*/
/*.flip-card-front {background-color: #fff;z-index: 2;-webkit-transform: rotateY(0deg);transform: rotateY(0deg);}
.flip-card-back {background-color: #fff;;-webkit-transform: rotateY(-180deg);transform: rotateY(-180deg);}*/
.location-card li{float: left;width: 48%;margin-right: 4%;}
.location-card li:nth-child(2n){margin-right: 0;}
/*.theme-flip-card li:hover .flip-card-inner .flip-card-front {-webkit-transform: rotateY(180deg);transform: rotateY(180deg);}
.theme-flip-card li:hover .flip-card-inner .flip-card-back {-webkit-transform: rotateY(0deg);transform: rotateY(0deg);}*/


/*site-label*/
.site-label{color: #fff;display: inline-block;text-align: center;}
.label-theme,.category-list li > *.current,.category-list li > *:hover{background-color: #00979c;color: #fff;cursor: pointer;} 
.label-main{background-color: #61c1be;}
.label-sub,.category-list li > *{color: #4a9eac;border-bottom: 3px solid #4a9eac;}
.label-nr,.category-list li > *{font-size: 16px;padding: 3px 5px 5px;line-height: 1;}
.label-ms{font-size: 14px;}
.label-md{font-size: 14px;padding: 10px;min-width: 150px;}
.category-list li a{color: #1d1d1d;}
.category-list li{display: inline-block;}
/*post*/
.post-info{letter-spacing: 0.05em;display: flex;}
.post-info-full,.post-info-full > *{display: block!important;}
.post-info-full > *{margin-bottom: 10px;}.post-info-full > *:last-child{margin-bottom: 0;}
.post-info > *{margin-right: 20px;margin-left: 20px;}
.post-info > *:last-child{margin-right: 0;}
.post-info i{font-size: 16px;}
.video-frame {min-height: 350px;max-height: 550px;position: relative;padding-bottom: 36.25%;padding-top: 30px;height: 0;overflow: hidden;}
.video-frame iframe, .video-frame object, .video-frame embed {position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
.post-info .post-author{height: 38px;overflow: hidden;}
/*post-grid*/
.post-grid{display: flex;justify-content: space-between;}
.main-content .post-grid > *{margin-bottom: 30px;}
.main-content .post-grid{margin-bottom: 50px;}
.grid_3 > *{width: 33.3%;}
.grid_2 > *{width: 50%;}
.grid-w-gap{justify-content: space-between;flex-wrap: wrap;}
.grid_3.grid-w-gap > *{width: 31.5%;}
.grid_2.grid-w-gap > *{width: 49%;}
.post-grid .post-grid-feature{width: 100%;}
.post-grid-content{padding: 10px;line-height: 1.2;position: relative;z-index: 9;}
.post-grid-header{font-size: 20px;}
.post-grid-header:hover,.post-grid-header:hover a{color: #f18302;}
.post-grid-header.disable:hover,.post-grid-header.disable:hover a{color: #383838;text-decoration: none;}
.post-grid-w-label .post-grid-header{padding: 5px 0;}
.post-excerpt{margin-bottom: 10px;}
.post-grid-content .post-info{padding-top: 10px;}
.post-grid .post-grid-cover{position: relative;padding-top: 50%;width: 100%;display: block;}
.post-grid .post-grid-cover img,.post-cover img{position: absolute;top: 50%;transform: translate(-50%, -50%);left: 50%;}
.post-grid .post-grid-feature .post-grid-cover{padding-top: 45%;}
.post-grid-type-a .post-grid-content{/*cursor: pointer;*/width: 90%;margin: -60px auto 0;max-height: 160px; /*min-height: 150px;*/}
.video-grid > *:hover,.post-grid > *:hover .post-grid-content{box-shadow: 8px 8px 10px rgba(0,0,0,.4);}
.post-grid-type-a .post-grid-content .post-info,.video-grid .post-grid-content .post-info,.video-list .post-info{display: flex;justify-content: space-between;border-top: 1px solid transparent;}
.post-grid-type-b .post-grid-cover{padding-top: 100%;width: 70%;margin: 0 auto;}.post-grid-type-b .post-grid-cover img{object-fit: contain;}
.post-grid-type-b > *:hover .post-grid-content{box-shadow: none;}
.post-grid.post-grid-type-b > *{border-bottom: 5px solid #d5dade;border-radius: 10px;margin-bottom: 80px;}
.post-grid-type-b > * .post-grid-content{padding-bottom: 30px;padding-top: 0; margin-bottom: -50px;}
.post-grid-type-b > * .post-grid-header a{text-align: center ;margin: 10px 0;}
.post-grid-type-b .post-grid-content .post-grid-header a.ellipsis{max-height: 25px; }
.post-grid-type-a .post-grid-content .post-grid-header a.ellipsis{max-height: 48px; }
.post-grid-type-a .post-grid-content .site-btn{position: absolute;bottom: -20px;right: 20px;}
.post-grid-type-a .post-grid-content .site-btn:hover{top: auto;bottom: -15px;}
/*.special-list li,.special-list li .post-grid-content .post-info,.special-list .ellipsis{text-align: center;justify-content: center;}*/
.special-list .post-grid-header{ overflow: hidden;margin-bottom: 10px;}
.load-more-list li{display: none;}.publication-list li{background-color: #fff;padding-top: 20px;}
.post-grid.post-grid-type-nr{margin-bottom: 0;}
.post-grid-type-nr > *{text-align: center;padding: 50px 10px;background-color: rgba(255,255,255,.9);}
.post-grid-type-nr > * p{min-height: 120px;}
.post-grid-type-nr-w-frame > *{border: 1px solid #ececec;}
.post-grid-p-left > li p{text-align: left;padding-left: 8px;}
.post-grid-type-a .post-grid-header{height: 50px;}
/*video-grid*/
.video-grid > *{width: calc(30% - 10px);float: left;padding: 10px 10px 0;}
.video-grid > *:first-child{width: 70%;margin-right: 10px;padding: 0;}
.video-grid > *:nth-child(2){margin-bottom: 10px;}
.video-grid .post-grid-content{padding: 0 10px 20px;}
.video-grid .post-grid-content .post-grid-header{padding-bottom: 0;}
.video-grid .video-grid-cover,.video-grid .video-grid-feature{position: relative;padding-top: 66%;width: 100%;}
.video-grid .video-grid-cover img,.video-grid .video-grid-feature img{position: absolute;top: 0;left: 0;bottom: 0;right: 0;}
.video-grid .play-video-wrapper,.video-list .play-video-wrapper{display: none;background-color: transparent;}
.video-grid > * :hover .play-video-wrapper,.video-list > * :hover .play-video-wrapper{display: block;}
.video-grid .post-grid-content .post-grid-header a.ellipsis{max-height: 24px;}
.video-grid .post-grid-content .post-author.ellipsis{max-height:20px;}
.video-grid .post-grid-content{padding: 15px 20px;}
/*pagination*/
.pagination{text-align: center;}
.pagination li{display: inline-block;margin-bottom: 8px;}
.pagination li a{display: block;padding: 10px 15px;color: #fff;background-color: #d5dade;line-height: 1;font-size: 14px;}
.pagination li.current a,.pagination li:hover a{background-color: #27ba9c;}
/*index-section-story*/
.category-list{display: table; margin: 0 auto;}
.category-list li{margin-left: 10px;}
.category-list li:first-child{margin-left: 0;}
.section-category-list{margin-bottom: 30px;}
/*layout*/
.content-area{padding-bottom: 50px;padding-top: 109px;}
.main-content{padding: 20px 0;}
.content-area-w-n-header > *:first-child{margin-top: 60px;}
.content-area-w-n-header .main-content{padding-top: 0;}
.wrapper{width: 1200px;margin: 0 auto;position: relative;}
.page-header-w-img{min-height: 350px;background-color: #00979c;}
/*header*/
.site-header{/*position: relative;*/border-top: 6px solid #00979c;border-bottom: 4px solid #61c1be;padding-top: 10px;z-index: 88;position: fixed;width: 100%;background-color: #fff;}
.header-logo,.header-nav{float: left;width: 30%;}
.header-logo img{display: block;padding-bottom: 10px;width: 180px;}
.header-tool,.header-search{float: right;}
.header-tool{padding: 0 0 15px;}
.header-tool .social-tool {font-size: 24px;}
.header-tool > h5{position: relative;top: -2px;}
.header-nav{width: 65%;}
.header-search{width: 5%;margin-top: -5px;position: relative;}
.header-search .search-toggle{float: right;}
.header-search .search-toggle i{margin: 0;}
.header-search .site-search{display: none;}
.site-nav > li{display: inline-block;position: relative;padding: 0 3.2%;cursor: pointer;}
.site-nav > li > *{font-size: 20px; color: #7c7c7c;}
.site-nav > li > a,.site-nav > li > div{position: relative;}
.site-nav li.current > div,.site-nav li.current > a,.site-nav > li:hover > a,.site-nav > li:hover > div{border-bottom: 3px solid #00979c;}
.site-nav > li > ul{display: none;position: absolute;}
.site-nav > li:hover > ul{display: block;}
.site-nav .sub-nav{min-width: 200px;text-align: left;left: 15%;top: 100%;background-color: #fff;padding: 15px 5px 0;border-bottom: 2px solid #61c1be;box-shadow: 3px 3px 8px rgba(0,0,0,.55); }
.site-nav .sub-nav li{border-bottom: 1px dashed #c3c3c3;}
.site-nav .sub-nav li:last-child{border-bottom: 0;}
.site-nav .sub-nav li a{ font-size: 16px;padding: 5px 25px;position: relative;left: 0;display: block;color: #417384;}
.site-nav .sub-nav li a:hover{left: 3px;}
.hamburger-menu-button{display: none;}


/*footer*/
.foot-location{background-color: #eeeee4;padding-top: 40px;}
.foot-location-wrapper > img{max-width: 110px;position: absolute;bottom: 0;left: 0;}
.foot-location-wrapper > *,.foot-location-list li > *,.foot-location-list dl dt,.foot-location-list li{float: left;}
.foot-location-list{width: 100%;padding: 0 0 20px 12%;}
.foot-location-list > li > img{display: block;width: 52px;}
.foot-location-list li{width: 35%;}
.foot-location-list li:last-child{width: 30%;}
.foot-location-list dl{width: 80%;padding-left: 2%;white-space:nowrap;}
.foot-location-list dl h4{margin-bottom: 15px;}
.foot-location-list dl h4,.foot-location-list dl h4 a{color: #2e384f;}
.foot-info{background-color: #00979c;padding: 10px 0;}
.foot-info > .wrapper,.foot-cpr > .wrapper,.foot-nav,.foot-nav-about{display: flex;}
.foot-info > .wrapper .foot-main-info{ width: 35%;}
.foot-info > .wrapper nav{ width: 65%;padding-top: 30px;}
.foot-info a,.foot-cpr a{color: #fff;}
.foot-contact-info{padding-top: 10px;}
.foot-contact-info dt{float: left;}
.foot-nav li > h5,.foot-nav li > h5 a{color: #005e62;margin-bottom: 15px;font-weight: 500;}
.foot-nav > li{ width: 20%;}
.foot-nav .sub-nav{padding-left: 8px;}
.foot-nav .sub-nav,.foot-nav .sub-nav li{font-size: 13px;}
.foot-nav .sub-nav li{margin-bottom: 5px;}
.foot-nav .sub-nav li:before{content: "\e909";font-family: 'ys';font-size: 12px;transform: scale(0.8);display: inline-block;}
.foot-nav .sub-nav li:hover{opacity: .8;}
.foot-cpr{background-color: #0a9b9f;padding: 15px 0;line-height: 1;}
.foot-cpr > .wrapper{justify-content:  space-between;}
.foot-cpr > .wrapper > *{width: 33.3%;}
.foot-nav-about,.foot-cpr-text{justify-content:center;padding-top: 5px;}
.foot-nav-about li{text-align: center;padding: 0 10px;border-right: 1px solid #fff;}
.foot-nav-about li:first-child{content: '';border-left: 1px solid #fff;}
.foot-tool{text-align: right;}

/*search*/
.search-toggle{background-color: #61c1be;width: 36px;height: 36px;color: #fff;text-align: center;line-height: 36px;border-radius: 100px;font-size: 18px;cursor: pointer;}
.site-search{transition: none; background-color: #61c1be;position: absolute;right: 0;top: 120%;width: 1200px;padding: 20px 0;}
.site-search > input{width: calc(100% - 120px);color: #fff;padding-left: 30px;font-size: 20px;}
.site-search > ::placeholder { /* Chrome, Firefox, Opera, Safari 10.1+ */color: #fff;opacity: 1; /* Firefox */}
.site-search > :-ms-input-placeholder,.site-search > ::-ms-input-placeholder { /* Microsoft Edge */color: #fff;opacity: 1; /* Firefox */}
.site-search > button{ color: #61c1be;}
.site-search > input:focus { background-color: transparent;}

/*social-tool*/
.social-tool > *{display: inline-block;padding: 0 2px;}
.social-tool > li a:hover{opacity: .8;}



@media screen and (max-width: 1200px) {
/*header*/
.header-logo{width: 20%;max-width: 200px;}
.header-tool{padding: 0 0 20px;}
.header-nav{width: 75%;padding-left: 8%;}
.site-nav > li > *{font-size: 16px;}
.header-search{margin-top: -9px;}

/*footer*/
.foot-location-wrapper > img{display: none;}
.foot-location-list{padding: 0 0 20px;}
.foot-location-list dl{white-space:normal;}
/*search*/
.site-search{top: 145%;width: 100vw;min-width: 100vw;right: -20px;}
/*video-grid*/
.video-grid > *:first-child,.video-grid > *{width: calc(33.3% - 6.66px);margin-right: 10px;padding: 10px 10px 0;}
.video-grid > *:last-child{margin-right: 0;}
/*layout*/
.wrapper{width: 100%;padding-left:20px;padding-right: 20px;}
/*.content-area{padding-top: 120px;}*/
.content-area-w-n-header > *:first-child{margin-top: 0;}
.theme-card-sub-content{padding: 0 20px 0 0;}
.theme-card-sub-content .site-btn{bottom: auto;top: 90%;right: 20px;}
.page-header-w-img,.page-header-w-img img{min-height: 250px;}
/*.flip-card-inner{height: 550px;}*/
}


@media screen and (max-width: 900px) {
/*layout*/
.mobile-hide,.foot-nav,.header-tool.social-tool{display: none;}
.content-area{padding-top: 75px;padding-bottom: 30px;}
.content-area.content-area-w-n-header{padding-top: 105px;}
.main-content{padding-top: 30px;padding-bottom: 30px;}
/*theme*/
h1{line-height: 1.2;}
.theme-header,.section-header{margin-bottom: 10px;}
.nr-header:before,.nr-header:after{width: 20%;}
/*index-section-story*/
.category-list{margin-top: 20px!important;float: none;text-align: center;margin-bottom: 10px;}
.section-category-list li{margin-bottom: 20px;}
/*post-grid*/
.post-grid > *:last-child{margin-bottom: 0!important;}
.post-grid.publication-list > *{width: 45% ;}
.theme-accordion .img-gallery{flex-wrap: wrap;}
.theme-accordion .img-gallery > *{width: 100%;margin: 0 1% 10px;}
.theme-card-sub-content{flex-direction:column;padding: 0;}
.theme-card-sub-content img,.theme-card-sub-content > div {width: 100%;}
.theme-card-sub-content > div{padding: 20px 20px 40px;}
.theme-card-sub-content .site-btn{top: 95%;}
/*header*/
.site-header{border-top-width: 4px;border-bottom-width: 3px;padding-top: 10px;background-color: #fff;}
.site-header .wrapper{padding: 0;}
.header-logo{float: none;margin: 0 auto;position: relative;z-index: 9;width: 100%;text-align: center;}
.header-logo img{height: 60px;width: auto;margin: 0 auto;}
.hamburger-menu-button,.header-search{position:absolute;}
.header-search{float: none;right: 20px;top: 20px;}
.header-nav{ width: 100%;float: none;/*position: absolute;*/top: calc(100% + 3px);transition: max-height 0.3s ease-in-out 0s;left: 0;padding-left: 0;max-height: 0;overflow: hidden;}
.header-nav.on{ max-height: 999px;z-index: 9;height: auto;background: #fff;}
.site-nav{background-color: #fff;padding-top: 10px;border-top: 3px solid #61c1be;}
.site-nav > li{margin-bottom: 10px;border-bottom: 1px solid #61c1be;}
.site-nav > li > a, .site-nav > li > div,.site-nav > li > a{padding: 5px 0;color: #00979c;display: block;font-size: 20px;}
.site-nav li{display: block;text-align: center;padding: 0!important;}
.site-nav > li > ul.sub-nav{ opacity: 0;border-bottom: 0;box-shadow: none; position: absolute;padding: 0;display: block;width: 100%;left: 0;transition: max-height 0.2s ease-in-out 0s;max-height: 0;overflow: hidden;z-index: -1;}
.site-nav > li.open > ul.sub-nav{position: static;left: 0;max-height: 999px; border-bottom: 0;opacity: 1;background-color: #00979c;}
.site-nav .sub-nav li a{color: #fff;}
.site-nav .sub-nav li{border-bottom-color:#fff; }
.sub-nav li a:hover{left: 0;}.site-nav > li.open{border-bottom: 0;}
.site-nav li.current > div,.site-nav li.current > a,.site-nav > li:hover > a,.site-nav > li:hover > div,.site-nav > li:last-child{border-bottom: 0;}
.hamburger-menu-button{  width:46px;height:46px;display:block;z-index:100;box-sizing:content-box;white-space:nowrap;cursor:pointer;overflow:hidden;font-size:24px;color:#7accc8;cursor:pointer;top:3px;left:0;background-color: transparent;}
.hamburger-menu-button-open{top:50%;margin-top:-1px;left:50%;margin-left:-12px;text-indent: -999px;}
.hamburger-menu-button-open, .hamburger-menu-button-open::before, .hamburger-menu-button-open::after{background: #00979c;position:absolute;width:46px;height:4px;border-radius:1px;-webkit-transition:all 0.3s;transition:all 0.3s;}
.hamburger-menu-button-open::before, .hamburger-menu-button-open::after{left:0;content:"";background: #00979c;}
.hamburger-menu-button-open::before{top:10px;}
.hamburger-menu-button-open::after{bottom:10px;}
.fixed .hamburger-menu-button-close,.hamburger-menu-button-close,
.header-fixed .hamburger-menu-button-close{background:transparent;-webkit-transform:rotate(180deg);transform:rotate(180deg);}
.hamburger-menu-button-close::before{-webkit-transform:translateY(-10px) rotate(45deg);transform:translateY(-10px) rotate(45deg);left: 5px;}
.hamburger-menu-button-close::after{-webkit-transform:translateY(10px) rotate(-45deg);transform:translateY(10px) rotate(-45deg);left: 5px;}
.header-search .site-search{right: -20px;top: 50px;}
.header-tool.social-tool{position: absolute;bottom: 0;left: 0; width: 100%;text-align: center;}
.on .header-tool.social-tool{display: block; border-top: 1px solid #61c1be;z-index: 99;background: #fff;bottom: -70px;}
.on .social-tool ul.social-tool{padding: 20px 0 0;}
/*video-grid*/
.video-grid > *{width: 100%!important;margin-bottom: 20px;}
.video-grid .ellipsis{height: auto;}
.video-grid  .play-video-wrapper{display: block;}
.video-grid  .play-video-wrapper::before {opacity: 1;}
/*index-section-subscribe*/
.index-section-subscribe{padding: 0 20px 20px;}
.index-section-subscribe .site-label{position: relative;left:auto;transform: rotate(0);top: 0;margin-top: -10px;}
.index-section-subscribe .subscribe-header,.index-section-subscribe .subscribe-form{width: 100%;}
.index-section-subscribe .subscribe-header{padding: 0;}
.index-section-subscribe .subscribe-form{margin-top: 10px;}
.subscribe-aside{right: 20px;width: 80px;top: -20px;}
.open .subscribe-aside{display: none;}
/*footer*/
.foot-location{padding: 20px 0;}
.foot-location-list li,.foot-location-list li:last-child{float: none;width: 100%;clear: both;padding-top: 20px;}
.foot-location-list dl h4{margin-bottom:0;}
.foot-info > .wrapper,.foot-cpr > .wrapper,.foot-nav{flex-wrap: wrap;}
.foot-info > .wrapper .foot-main-info,.foot-info > .wrapper nav,.foot-cpr > .wrapper > *{width: 100%;}
.foot-cpr-text{margin-bottom: 20px;}
.foot-cpr > .wrapper nav,.foot-cpr > .wrapper .foot-tool{width: 50%}
.foot-nav-about, .foot-cpr-text{justify-content: flex-start;}
.site-data-list{flex-wrap: wrap;justify-content:space-around;}
.site-data-list li{width: 32%;margin-bottom: 10px;}
.site-data-list-grid-4 li{width: 48%;}
.post-grid.post-grid-type-nr > * > img{width: 70%;}
.flip-card-inner{min-height: auto;padding-bottom: 20px;}
}


@media screen and (max-width: 768px) {
.mobile-show{display: block;}
.mobile-visible{visibility: visible;}
/*字體theme*/
.f-xxlg{font-size: 24px;}
.f-xlg{font-size: 18px;}
.data-list-content h2,.page-section-header .theme-header{font-size: 24px;}
.post-grid.post-grid-type-nr > *{width: 100%;}
.post-grid.post-grid-type-nr > *{padding: 30px 10px 20px;}
.post-grid.post-grid-type-nr > * > img{width: auto;}
.post-grid-type-nr > * p{min-height: 0;}
/*btn*/
.btn-md, .btn-ms{padding: 15px;}
/*.flip-card-inner{height: 700px;}*//*
.flip-card-content h2 span{display: block;}*/
.theme-flip-card li:hover .flip-card-inner {transform: none;}
.flip-card-inner .flip-card-front,.flip-card-inner .flip-card-back{position: relative;}/*
.flip-card-inner.flip .flip-card-front,.flip-card-inner .flip-card-back{display: none; }*/
.flip-card-inner.flip .flip-card-back{transform: rotateY(0);display: block; }
.post-inner iframe{width: 100%!important;}
}


@media screen and (max-width: 640px) {
.content-area{padding-top: 65px;}
/*theme*/
.nr-header{padding-left: 25%;padding-right: 25%;}
/*header*/
.header-logo img{height: 50px;}
.page-header h1{padding: 100px 0 0;text-align: center;width: 100%;left: 0;font-size: 48px;}
.header-search .site-search{top: 45px;padding: 10px 0;}
.site-search > button{ padding: 10px 15px;}
.site-search > input {width: calc(100% - 90px);}
.theme-blockquote-sp{padding: 50px 0;}
/*footer*/
.foot-nav > li{ width: 32%; margin-bottom: 20px;}
/*index-section-record*/
.site-data-list li{width: 48%;}
.site-data-cover{width: 100%;}
/*post-grid*/
.grid_2 > *{width: 100%!important;}
.post-grid .post-grid-feature .post-grid-cover{padding-top: 75%;}
/*.post-grid-type-a .post-grid-content{min-height: auto;}*/
.location-card li{width: 100%;margin-right: 0;margin-bottom: 20px;}
.flip-card-inner{height: 1030px;}
.flip-card-content h2 span{display: inline;}
.post-grid-type-a .post-grid-header{height: auto;}
}
@media screen and (max-width: 480px) {
.subscribe-form > * {width: 100%!important;}
.post-grid.publication-list > * {width: 100%;}
.flip-card-content h2 span{display: block;}
.theme-accordion h3 span.nr{display: block;margin-left: -15px;}
.category-filter{text-align: left;}
.category-filter li{width: calc(33.3% - 10px);margin-left: 0;margin-right: 10px;text-align: center;}
.category-filter li:nth-child(3n){margin-right: 0;}
/*footer*/
.foot-nav > li{ width: 48%; }
.foot-cpr-text,.foot-cpr > .wrapper nav,.foot-cpr > .wrapper .foot-nav-about,.foot-cpr > .wrapper .foot-tool{width: 100%;text-align: center;justify-content: center;}
.foot-cpr > .wrapper .foot-tool{order:-1;}
.foot-cpr-text{order: 3;margin-bottom: 0;}
.foot-cpr > .wrapper > *{margin-bottom: 10px;}
}


@media screen and (max-width: 360px) {

/*index-section-record*/
.site-data-list li {width: 100%;}
.post-grid-type-b .post-grid-content .post-grid-header a.ellipsis{max-height: 999px; }
/*.flip-card-inner{height: 700px;}*/


}

/*20190710新增*/
.foot-location-list dl h4 a:hover{color: #f18302;}
@media screen and (max-width: 900px) {
.header-logo a{display: inline-block;height: 50px;overflow: hidden;margin-bottom: 10px;}
.header-logo a img{height: 70px;width: auto;}
}