@charset "UTF-8";
/* CSS Document */

section, article, aside, footer, header, nav, h2 { display:block;}

body { padding:0; margin:0 auto; font:1em "Noto Sans TC", sans-serif, "微軟正黑體", Arial; background-color: #fbfaf6; display: block; position: relative;}
img { border:0;}

html, body { height: 100%;}

.clearfix:after { visibility: hidden; display: block; font-size: 0; content: " "; clear: both; height: 0;}
.clearfix { display: inline-block; }
* html .clearfix { height: 1%; }
.clearfix { display: block; }

ul.num { padding: 0; margin: 0 0 0 16px; list-style: decimal; display: block;}
ul.num li { padding: 0; margin: 0;}

#page-num { clear: both; width: 100%;}
#page-num ul.page { padding: 0; margin: 40px 0; list-style: none; display: flex; justify-content: center; flex-wrap: wrap;}
#page-num ul.page li { padding: 0; margin: 0 5px; font-size: 0.9em;}
#page-num ul.page li a { padding: 0 5px; color: #414141; border: 1px #414141 solid; border-radius: 6px; text-decoration: none; display: block;}
#page-num ul.page li a:hover { color: #414141; background-color: #eee;}
#page-num ul.page li a.sel { color: #414141; font-weight: bolder; background-color: #eee;}


@media screen and (min-width: 1440px) {
    
    
    /******** header for pc ********/
    
    header#mo { display: none;}
    
    header#pc { width: 100%;}
    
    header#pc .header-top-bar { width: 100%; display: flex; justify-content: flex-end; align-items: center; background-color: #5d686e;}
    
    header#pc .header-top-bar .title-bx { width: 260px;}
    header#pc .header-top-bar .title-bx ul { padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start;}
    header#pc .header-top-bar .title-bx ul li { padding: 0; margin: 0 10px;}
    header#pc .header-top-bar .title-bx ul li a { color: #fff; font-size: 0.8em; letter-spacing: 0.2em; text-decoration: none;}
    header#pc .header-top-bar .title-bx ul li a:hover { color: #fdd900;}
    
    header#pc .header-top-bar .search-bx { width: 270px; display: flex; justify-content: flex-start; align-items: center; background-color: #fff;}
    header#pc .header-top-bar .search-bx input[type=search] { width: calc(90% - 40px); padding: 10px; color: #000; font: 1em "Noto Sans TC", sans-serif, "微軟正黑體", Arial; box-sizing: border-box; border: 0; background-color: #fff;}
    header#pc .header-top-bar .search-bx input[type=button] { width: 40px; height: 31px; box-sizing: border-box; background-color: #fff; background-image: url("../images/search_icon.png"); background-repeat: no-repeat; border-top: 0; border-left: 0; border-bottom: 0; border-right: 2px #a1a5a6 solid; cursor: pointer;}
    
    header#pc .title-nav-bx { width: 1400px; height: 120px; margin: 0 auto;}
    
    header#pc .title-nav-bx .sub-title-bx { width: 330px; padding: 30px 0 0 0; float: left;}
    
    header#pc .title-nav-bx nav#pc { width: calc(100% - 330px); float: right;}
    header#pc .title-nav-bx nav#pc ul { padding: 0; margin: 35px 0 0 0; list-style: none; display: flex; justify-content: flex-end; align-items: flex-end;}
    header#pc .title-nav-bx nav#pc ul li { padding: 0; margin: 0 0 0 50px; line-height: 1.4em; text-align: center; position: relative;}
    header#pc .title-nav-bx nav#pc ul li a { color: #676664; text-decoration: none; cursor: pointer;}
    header#pc .title-nav-bx nav#pc ul li a font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    header#pc .title-nav-bx nav#pc ul li a font.en { font-size: 0.8em;}
    header#pc .title-nav-bx nav#pc ul li a .icon-home { width: 100%; height: 23px; margin: 0 auto 7px auto; background-image: url("../images/nav_icon_home.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-home { background-image: url("../images/nav_icon_home_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-home.sel { background-image: url("../images/nav_icon_home_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-about { width: 100%; height: 27px; margin: 0 auto 5px auto; background-image: url("../images/nav_icon_about.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-about { background-image: url("../images/nav_icon_about_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-about.sel { background-image: url("../images/nav_icon_about_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-infor { width: 100%; height: 24px; margin: 0 auto 7px auto; background-image: url("../images/nav_icon_infor.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-infor { background-image: url("../images/nav_icon_infor_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-infor.sel { background-image: url("../images/nav_icon_infor_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-regu { width: 100%; height: 28px; margin: 0 auto 5px auto; background-image: url("../images/nav_icon_regulation.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-regu { background-image: url("../images/nav_icon_regulation_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-regu.sel { background-image: url("../images/nav_icon_regulation_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-dw { width: 100%; height: 26px; margin: 0 auto 5px auto; background-image: url("../images/nav_icon_download.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-dw { background-image: url("../images/nav_icon_download_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-dw.sel { background-image: url("../images/nav_icon_download_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-manage { width: 100%; height: 23px; margin: 0 auto 7px auto; background-image: url("../images/nav_icon_mag_sys.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-manage { background-image: url("../images/nav_icon_mag_sys_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-manage.sel { background-image: url("../images/nav_icon_mag_sys_over.png");}
    header#pc .title-nav-bx nav#pc ul li ul.popup { width: 170px; padding: 0; margin: 0; list-style: none; display: block; position: absolute; top: 84px; left: 0; z-index: 999;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li { width: 100%; padding: 0; margin: 0; text-align: left; letter-spacing: 0.1em;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a { width: 100%; padding: 10px 20px; color: #fff; text-decoration: none; background-color: rgba(79,89,95,0.8); display: flex; justify-content: flex-start; align-items: center; box-sizing: border-box;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a:hover { background-color: rgba(79,89,95,1)}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a .checked { width: 25px;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a .text { width: calc(100% - 25px);}
        
    
    
    /******** banner ********/
    
    .banner-text-full { width: 100%; position: relative;}
    
    .banner-text-full .banner-bx { width: 100%; height: 26vw; overflow: hidden; position: relative;}
    .banner-text-full .banner-bx ul li a { text-decoration: none; display: block;}
    .banner-text-full .banner-bx ul li .pic { width: 100%; position: absolute; top: 0; left: 0; z-index: 5;}
    .banner-text-full .banner-bx ul li .pic img { width: 100%; height: auto;}
    .banner-text-full .banner-bx ul li .bg-sq { width: 41vw; text-align: right; position: absolute; top: -3.1vw; right: 0; z-index: 10;}
    .banner-text-full .banner-bx ul li .bg-sq img { width: 100%; height: auto;}
    
    .banner-text-full .banner-bx ul li .text-bx { display: none;}
    
    
    
    /******** section ********/
    
    section { width: 1400px; margin: 0 auto;}
    
    
    
    /******** aside ********/
    
    aside { width: 350px; padding: 0; margin: 0; float: right;}
    
    aside .menu-bx { width: 100%; height: 730px; padding: 25px 0 0 0; margin: 0; background-color: #fdd900;}
    aside .menu-bx .aside-icon { display: none;}
    aside .menu-bx dl#panel { width: 100%; padding: 0; margin: 0; border-top: 1px #fff solid;}
    aside .menu-bx dl#panel dt { width: 100%; padding: 20px 0 20px 30px; margin: 0; font-size: 1.1em; letter-spacing: 0.1em; display: flex; justify-content: flex-start; align-items: center; border-bottom: 1px #fff solid; box-sizing: border-box; cursor: pointer;}
    aside .menu-bx dl#panel dt:hover { background-color: #ffe35e;}
    aside .menu-bx dl#panel dt.sel { background-color: #ffe35e;}
    aside .menu-bx dl#panel dt .icon { width: 70px}
    aside .menu-bx dl#panel dt .text { width: calc(100% - 70px); color: #363531; font-size: 1.1em; line-height: 1em;}
    aside .menu-bx dl#panel dt .text font.en { font-size: 0.6em; letter-spacing: normal;}
    aside .menu-bx dl#panel dd { width: 100%; padding: 0; margin: 0; border-bottom: 1px #fff solid; box-sizing: border-box; display: none;}
    aside .menu-bx dl#panel dd ul { width: calc(100% - 30px); padding: 0; margin: 0; list-style: none; display: block; float: right;}
    aside .menu-bx dl#panel dd ul li { width: 100%; padding: 0; margin: 0;}
    aside .menu-bx dl#panel dd ul li a { width: 100%; padding: 10px 10px 10px 20px; margin: 0; color: #fff; font-size: 0.9em; text-decoration: none; border-bottom: 1px #fff solid; background-color: #6e756b; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: center;}
    aside .menu-bx dl#panel dd ul li a:hover { background-color: #50595c;}
    aside .menu-bx dl#panel dd ul li a .checked { width: 30px;}
    aside .menu-bx dl#panel dd ul li a .text { width: calc(100% - 30px);}
    aside .menu-bx dl#panel dd ul li:last-child a { border: 0;}
    
    aside .data-num-bx { width: 100%; padding: 20px 20px 0 20px; color: #585757; font-size: 0.8em; letter-spacing: 0.1em; box-sizing: border-box;}
    aside .data-num-bx font.num { font-size: 1.6em; font-weight: 500;}
    
    
    
    /******** content #hp ********/
    
    .main-content { width: calc(100% - 350px); padding: 30px 30px 30px 0; min-height: 880px; border-right: 1px #909a9f solid; box-sizing: border-box; float: left; position: relative;}
    
    .main-content .hp-menu { width: 100%; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start;}
    .main-content .hp-menu .icon { width: 50px;}
    .main-content .hp-menu .news-tabs-bx { width: calc(100% - 50px);}
    .main-content .hp-menu .news-tabs-bx ul { padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .hp-menu .news-tabs-bx ul li { padding: 0; margin: 0; line-height: 1em; text-align: center;}
    .main-content .hp-menu .news-tabs-bx ul li a { width: 115px; padding: 5px 0; color: #545e64; text-decoration: none; border-bottom: 5px #fbfaf6 solid; box-sizing: border-box; display: block;}
    .main-content .hp-menu .news-tabs-bx ul li a:hover { border-bottom: 5px #6a7277 solid; box-sizing: border-box;}
    .main-content .hp-menu .news-tabs-bx ul li a.sel { border-bottom: 5px #485157 solid; box-sizing: border-box;}
    .main-content .hp-menu .news-tabs-bx ul li a font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .hp-menu .news-tabs-bx ul li a font.en { font-size: 0.6em;}
    .main-content .news-list-bx { width: 100%; padding: 30px 20px; box-sizing: border-box;}
    .main-content .news-list-bx .list-bx { clear: both; width: 100%; padding: 0 0 15px 0;}
    .main-content .news-list-bx .list-bx .date { width: 100px; padding: 5px 0; margin: 0 20px 0 0; color: #485157; font-size: 0.8em; font-weight: 500; line-height: 1em; text-align: center; background-color: #ffd900; float: left;}
    .main-content .news-list-bx .list-bx .title { width: calc(100% - 120px); font-size: 0.9em; letter-spacing: 0.1em; float: left;}
    .main-content .news-list-bx .list-bx .title a { color: #485157; text-decoration: none;}
    .main-content .news-list-bx .list-bx .title a:hover { text-decoration: underline;}
    .main-content .news-list-bx .more { clear: both; width: 100%; padding: 20px 20px 0 0; box-sizing: border-box; text-align: right;}
    .main-content .news-list-bx .more a { color: #485157; font-size: 0.9em; text-decoration: none;}
    .main-content .news-list-bx .more a:hover { text-decoration: underline;}
    
    .main-content .hp-title { width: 100%; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start; position: relative;}
    .main-content .hp-title .icon { width: 50px;}
    .main-content .hp-title .title { width: calc(100% - 50px); padding: 10px 0 0 0; color: #545e64; font-size: 1.1em; line-height: 1em; letter-spacing: 0.1em;}
    .main-content .hp-title .more { width: 40px; font-size: 0.9em; text-align: right; position: absolute; top: 20px; right: 10px;}
    .main-content .hp-title .more a { color: #414141; text-decoration: none;}
    .main-content .hp-title .more a:hover { text-decoration: underline;}
    
    .main-content ul#spot-list-bx { clear: both; width: 100%; padding: 0; margin: 0 0 30px 0; list-style: none; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .main-content ul#spot-list-bx li { width: calc(100% / 3 - 20px); margin: 20px 10px; background-color: #fff; position: relative;}
    .main-content ul#spot-list-bx li:hover { -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5);}
    .main-content ul#spot-list-bx li a { width: 100%; text-decoration: none; display: block;}
    .main-content ul#spot-list-bx li .pic { width: 100%; height: 10vw; display: flex; justify-content: center; align-items: center; overflow: hidden;}
    .main-content ul#spot-list-bx li .pic img.v { width: 100%; height: auto;}
    .main-content ul#spot-list-bx li .pic img.h { width: auto; height: 100%;}
    .main-content ul#spot-list-bx li .text { width: 100%; padding: 15px; margin: 0 0 30px 0; line-height: 1.2em; box-sizing: border-box; background-color: #fff;}
    .main-content ul#spot-list-bx li .text font.sub-date { padding: 2px 10px; color: #555e60; font-size: 0.8em; background-color: #ffd900;}
    .main-content ul#spot-list-bx li .text .title { clear: both; width: 100%; margin: 15px 0 10px 0; color: #555e60; font-size: 1.1em; letter-spacing: 0.1em; font-weight: 500;}
    .main-content ul#spot-list-bx li .text .intro { width: 100%; color: #555e60; font-size: 0.8em; letter-spacing: 0.1em;}    
    .main-content ul#spot-list-bx li .more { clear: both; width: calc(100% - 15px); margin: 10px 0 0 0; color: #555e60; font-size: 0.8em; text-align: right; position: absolute; bottom: 15px; left: 0;}
    
    .main-content #spot-news { width: 1100px; border-radius: 10px; background-color: #fff; -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-sizing: border-box; position: absolute; top: 100px; left: 0; z-index: 9999; display: none;}
    .main-content #spot-news .close-bar { width: 100%; padding: 5px 20px; color: #475055; font-size: 2em; text-align: right; border-bottom: 1px #cdcfce solid; box-sizing: border-box;}
    .main-content #spot-news .close-bar .icon-colse { width: 50px; cursor: pointer; float: right;}
    .main-content #spot-news .content-bx { width: 100%; padding: 30px 50px; color: #3E3A39; letter-spacing: 0.1em; box-sizing: border-box;}
    .main-content #spot-news .content-bx .source-date { font-size: 0.8em; display: flex; justify-content: flex-start; align-items: center;}
    .main-content #spot-news .content-bx .source-date .date { padding: 2px 10px; color: #555e60; text-align: center; background-color: #ffd900;}
    .main-content #spot-news .content-bx .source-date .source { margin: 0 0 0 15px;}
    .main-content #spot-news .content-bx .title { clear: both; width: 100%; padding: 20px 0; font-size: 1.2em; font-size: 600;}
    .main-content #spot-news .content-bx .content { width: 100%; padding: 0 30px; font-size: 0.9em; line-height: 1.8em; box-sizing: border-box;}
    .main-content #spot-news .content-bx .content a { color: #3E3A39; border-bottom: 1px #666 dashed; text-decoration: none;}
    .main-content #spot-news .content-bx .content .photo-bx { width: calc(50% - 20px); margin: 0 10px 20px 10px; float: left;}
    .main-content #spot-news .content-bx .content .photo-bx:nth-child(odd) { clear: both;}
    .main-content #spot-news .content-bx .content .photo-bx .pic { width: 100%;}
    .main-content #spot-news .content-bx .content .photo-bx .pic img { width: 100%; height: auto;}
    .main-content #spot-news .content-bx .content .photo-bx .text { width: 100%; padding: 10px 0 0 0; font-size: 0.9em; line-height: 1.4em; text-align: center;}
    
    .main-content ul.qk-link-bx { width: 100%; padding: 0; margin: 20px 0; list-style: none; display: flex; justify-content: center; align-items: stretch;}
    .main-content ul.qk-link-bx li { width: 25%; padding: 0; margin: 0;}
    .main-content ul.qk-link-bx li .icon-bx { width: 85px; height: 85px; margin: 0 auto; border-radius: 100%; border: 2px #485157 solid; display: flex; justify-content: center; align-items: center;}
    .main-content ul.qk-link-bx li .text-1 { clear: both; width: 90%; margin: 5px auto; color: #485157; letter-spacing: 0.1em; font-weight: 500; line-height: 1em; text-align: center;}
    .main-content ul.qk-link-bx li .text-2 { clear: both; width: 90%; margin: 0 auto; color: #000; font-size: 0.8em; letter-spacing: 0.1em; line-height: 1.4em; text-align: center;}
    .main-content ul.qk-link-bx li .text-2 a { color: #485157; text-decoration: none;}
    .main-content ul.qk-link-bx li .text-2 a:hover { text-decoration: underline;}
    
    
    
    /******** content #news content ********/
    
    .main-content .breadcrumb-bx { width: 100%; margin: 0 0 30px 0; color: #231815; font-size: 0.9em; letter-spacing: 0.1em;}
    .main-content .breadcrumb-bx a { color: #231815; text-decoration: none;}
    .main-content .breadcrumb-bx a:hover { text-decoration: underline;}
    
    .main-content .news-content-bx { width: 100%; padding: 0 30px 30px 50px; word-break: break-all; box-sizing: border-box;}
    .main-content .news-content-bx .title { width: 100%; margin: 0 0 20px 0; color: #231815; font-size: 1.2em; font-weight: 600; letter-spacing: 0.1em;}
    .main-content .news-content-bx .content { width: 100%; color: #231815; font-size: 0.9em; line-height: 1.8em; letter-spacing: 0.1em;}
    .main-content .news-content-bx .content a { color: #231815; text-decoration: none;}
    .main-content .news-content-bx .content a:hover { text-decoration: underline;}
    
    ul.bignum { padding: 0 0 0 30px; margin: 0; box-sizing: border-box; list-style-type: cjk-ideographic; display: block;}
    ul.bignum li { padding: 0; margin: 0;}
    
    .main-content .gotop { clear: both; width: 60px; margin: 30px 0 0 0; color: #332c2a; float: right; cursor: pointer;}
    
    
    
    /******** content #member intro ********/
    
    .main-content .page-menu { width: 100%; margin: 0 0 30px 0; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start;}
    .main-content .page-menu .icon { width: 50px;}
    .main-content .page-menu .menu-tabs-bx { width: calc(100% - 50px);}
    .main-content .page-menu .menu-tabs-bx ul { padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .page-menu .menu-tabs-bx ul li { padding: 0; margin: 0; line-height: 1em; text-align: center;}
    .main-content .page-menu .menu-tabs-bx ul li a { width: 115px; padding: 5px 0; color: #545e64; text-decoration: none; border-bottom: 5px #fbfaf6 solid; box-sizing: border-box; display: block;}
    .main-content .page-menu .menu-tabs-bx ul li a:hover { border-bottom: 5px #6a7277 solid; box-sizing: border-box;}
    .main-content .page-menu .menu-tabs-bx ul li a.sel { border-bottom: 5px #485157 solid; box-sizing: border-box;}
    .main-content .page-menu .menu-tabs-bx ul li a font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .page-menu .menu-tabs-bx ul li a font.en { font-size: 0.6em;}
    
    .main-content .mem-list-bx { clear: both; width: 90%; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .main-content .mem-list-bx .mem-bx { width: calc(100% / 3 - 20px); margin: 10px 10px 60px 10px; position: relative;}
    .main-content .mem-list-bx .mem-bx .pic { width: 145px; height: 145px; margin: 0 auto; border-radius: 100%; border: 5px #fff solid; background-color: #efefef; box-sizing: border-box; display: flex; justify-content: center; align-items: center; overflow: hidden; -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); position: absolute; top: 0; left: calc(50% - 72px); z-index: 99;}
    .main-content .mem-list-bx .mem-bx .pic img { width: auto; height: 100%;}
    .main-content .mem-list-bx .mem-bx .box { width: 100%; height: 100%; padding: 140px 20px 0 20px; margin: 30px 0 0 0; border: 1px #e9e9e7 solid; background-color: #fff; box-sizing: border-box; z-index: 9;}
    .main-content .mem-list-bx .mem-bx .box .name { width: 100%; color: #485157; font-size: 0.9em; font-weight: 500; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .title-1 { width: 100%; color: #0081a3; font-size: 0.8em; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .title-2 { width: 100%; color: #342e2c; font-size: 0.8em; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .job { width: 100%; color: #342e2c; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .contact { width: 100%; color: #342e2c; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box hr { width: 100%; margin: 15px 0; border: 1px #d8d8d9 solid;}
    
    .main-content .title-line { clear: both; width: 90%; margin: 30px auto; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .title-line .title-1 { width: 80px; color: #545e64; font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .title-line .line-1 { width: calc(100% - 80px);}
    .main-content .title-line .title-2 { width: 220px; color: #545e64; font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .title-line .line-2 { width: calc(100% - 220px);}
    .main-content .title-line .title-3 { width: 120px; color: #545e64; font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .title-line .line-3 { width: calc(100% - 120px);}
    .main-content .title-line .line-1 hr, .line-2 hr, .line-3 hr { width: 100%; margin: 15px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #meeting list ********/
    
    .main-content .mt-list-bx { width: 100%; padding: 0 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .mt-list-bx .title-bx { width: 100%; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .mt-list-bx .title-bx .icon { width: 35px;}
    .main-content .mt-list-bx .title-bx .text { width: 160px; color: #798388; font-size: 1.1em; font-weight: 500; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .title-bx .year { width: calc(100% - 195px); color: #798388; font-size: 1em; text-align: right;}
    .main-content .mt-list-bx .title-bx .year a { color: #798388; text-decoration: none;}
    .main-content .mt-list-bx .title-bx .year a.sel { text-decoration: underline;}
    
    .main-content .mt-list-bx .list-bx { clear: both; width: 100%; margin: 30px 0;}
    .main-content .mt-list-bx .list-bx .caption { width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .mt-list-bx .list-bx .caption .cap-1 { width: calc(100% - 40px); color: #798388; font-size: 0.9em; font-weight: 600; letter-spacing: 0.1em; display: flex; align-items: center;}
    .main-content .mt-list-bx .list-bx .caption .cap-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .list-bx .column { clear: both; width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .mt-list-bx .list-bx .column .col-1 { width: calc(100% - 40px); display: flex; justify-content: flex-start; align-items: baseline;}
    .main-content .mt-list-bx .list-bx .column .col-1 .date { width: 100px; margin: 0 10px 0 0; color: #798388; font-size: 0.8em; text-align: center; letter-spacing: 0.1em; background-color: #ffd900;}
    .main-content .mt-list-bx .list-bx .column .col-1 .text { width: calc(100% - 110px); color: #798388; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .list-bx .column .col-1 .space { width: 100px; margin: 0 10px 0 0; font-size: 0.8em; display: block;}
    .main-content .mt-list-bx .list-bx .column .col-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .list-bx .column .col-2 a { color: #798388; text-decoration: none;}
    .main-content .mt-list-bx .list-bx hr { width: 100%; margin: 20px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #regulation list ********/
    
    .main-content .rg-list-bx { width: 100%; padding: 0 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .rg-list-bx .title-bx { width: 100%; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .rg-list-bx .title-bx .icon { width: 50px;}
    .main-content .rg-list-bx .title-bx .text { width: calc(100% - 50px); color: #798388; font-size: 1.1em; font-weight: 500; letter-spacing: 0.1em;}
    
    .main-content .rg-list-bx .list-bx { clear: both; width: 100%; margin: 30px 0;}
    .main-content .rg-list-bx .list-bx .caption { width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .rg-list-bx .list-bx .caption .cap-1 { width: calc(100% - 40px); color: #798388; font-size: 0.9em; font-weight: 600; letter-spacing: 0.1em; display: flex; align-items: center;}
    .main-content .rg-list-bx .list-bx .caption .cap-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .rg-list-bx .list-bx .column { clear: both; width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .rg-list-bx .list-bx .column .col-1 { width: calc(100% - 40px); display: flex; justify-content: flex-start; align-items: baseline;}
    .main-content .rg-list-bx .list-bx .column .col-1 .date { width: 100px; margin: 0 10px 0 0; color: #798388; font-size: 0.8em; text-align: center; letter-spacing: 0.1em; background-color: #ffd900;}
    .main-content .rg-list-bx .list-bx .column .col-1 .text { width: calc(100% - 110px); color: #798388; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .rg-list-bx .list-bx .column .col-1 .space { width: 100px; margin: 0 10px 0 0; font-size: 0.8em; display: block;}
    .main-content .rg-list-bx .list-bx .column .col-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .rg-list-bx .list-bx .column .col-2 a { color: #798388; text-decoration: none;}
    .main-content .rg-list-bx .list-bx hr { width: 100%; margin: 20px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #higher project intro ********/
    
    .main-content .higher-pj-content { width: 100%; padding: 0 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .higher-pj-content .pic { width: 90%; margin: 0 auto 30px auto; color: #3f3b3a; font-size: 0.9em; letter-spacing: 0.1em; text-align: center;}
    .main-content .higher-pj-content .pic img { width: 100%; height: auto;}
    
    .main-content .higher-pj-content .text { clear: both; width: 100%; color: #3f3b3a; font-size: 0.9em; line-height: 1.8em; letter-spacing: 0.1em;}
    .main-content .higher-pj-content .text font.title { font-size: 1.1em; font-weight: 600;}
    
    
    
    /******** content #higher project framework ********/
    
    .main-content .higher-fw-content { width: 100%; padding: 30px 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .higher-fw-content .content-full { width: 100%; margin: 0 0 30px 0; color: #3f3b3a; font-size: 0.9em; font-weight: normal; letter-spacing: 0.1em;}
    
    .main-content .higher-fw-content .content-img-full { width: 100%; text-align: center;}
    .main-content .higher-fw-content .content-img-full img { max-width: 100%; height: auto;}
    .main-content .higher-fw-content .content-img-text-full { width: 100%; margin: 15px 0 30px 0; color: #3f3b3a; font-size: 0.9em; font-weight: normal; text-align: center; letter-spacing: 0.1em;}
    
    
    
    /******** content #higher project result ********/
    
    .main-content .higher-rs-content { width: 100%; padding: 30px 30px 30px 50px; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    
    .main-content .higher-rs-content .higher-rs-ebook-bx { width: calc(100% / 3 - 30px); margin: 15px; background-color: #fff; -moz-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); -webkit-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); box-sizing: border-box; position: relative;}
    .main-content .higher-rs-content .higher-rs-ebook-bx a { width: 100%; padding: 30px 0; box-sizing: border-box; text-decoration: none; display: block;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-title { width: 100%; margin: 0 0 30px 0;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-title span { padding: 5px 15px; color: #414141; font-size: 0.9em; background-color: #ffd900;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-pic { clear: both; width: 100%; text-align: center;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-pic img.ebook { width: 80%; height: auto;}
    .main-content .higher-rs-content .over-mask { width: 100%; height: 100%; padding: 0 0 80px 0; color: #fff; font-size: 1.2em; font-weight: 500; background-color: rgba(0,0,0,0.4); box-sizing: border-box; display: none; justify-content: center; align-items: flex-end; position: absolute; top: 0; left: 0; z-index: 99;}
        
    .main-content #ebook-content { width: 1200px; border-radius: 10px; background-color: #fff; -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-sizing: border-box; position: absolute; top: 100px; left: 0; z-index: 9999; display: none;}
    .main-content #ebook-content .close-bar { width: 100%; padding: 5px 20px; color: #475055; font-size: 2em; text-align: right; border-bottom: 1px #cdcfce solid; box-sizing: border-box;}
    .main-content #ebook-content .close-bar .icon-colse { width: 50px; cursor: pointer; float: right;}
    .main-content #ebook-content .content-bx { width: 100%; padding: 30px 50px; color: #3E3A39; letter-spacing: 0.1em; box-sizing: border-box;}
    .main-content #ebook-content .content-bx .source-date { font-size: 0.8em;}
    .main-content #ebook-content .content-bx .source-date span { padding: 2px 10px; color: #555e60; text-align: center; background-color: #ffd900;}
    .main-content #ebook-content .content-bx .title { clear: both; width: 100%; padding: 20px 0; font-size: 1.2em; font-size: 600;}
    .main-content #ebook-content .content-bx .content { width: 100%; padding: 0 30px; font-size: 0.9em; line-height: 1.8em; box-sizing: border-box;}
    .main-content #ebook-content .content-bx .content img { width: 100%; height: auto;}    
    .main-content #ebook-content .content-bx .content iframe.iframe-ebook { width: 100%; height: 800px; border: 0;}
    
    
        
    /******** content #center strategic ********/
    
    .main-content .center-strategic-content { width: 100%; padding: 30px 30px 30px 50px; color: #3f3b3a; font-size: 0.9em; letter-spacing: 0.1em; box-sizing: border-box;}
    
    .main-content .center-strategic-content .text-1 { width: 100%; margin: 0 0 15px 0; font-size: 1.2em; font-weight: 600;}
    
    .main-content .center-strategic-content img { max-width: 100%; height: auto;}
    
    
    
    /******** error 404 ********/
    
    .error-bx { clear: both; width: 100%; padding: 50px 0; background-color: #ffd900; display: flex; justify-content: center; align-items: center;}
    .error-bx .pic { width: 600px;}
    .error-bx .pic img { width: 100%; height: auto;}
    .error-bx .text { width: 600px; padding: 0 0 0 40px; box-sizing: border-box;}
    .error-bx .text font.text1 { color: #3f3b3a; font-size: 3.4em; line-height: 1em; font-weight: 600;}
    .error-bx .text font.text2 { color: #004256; font-size: 3.4em; font-weight: 200;}
    .error-bx .text font.text3 { color: #004256; font-size: 1.6em; line-height: 1em; font-weight: 200;}
    .error-bx .text font.text4 { color: #004256; font-size: 2.4em; font-weight: 500;}
    .error-bx .text .goback-bt { width: 440px; height: 39px; margin: 30px 0 0 0; color: #fff; font-size: 0.9em; font-weight: 600; text-align: center; border-radius: 6px; background-image: url("../images/error_bt_bg.png"); background-repeat: repeat-x; overflow: hidden;}
    .error-bx .text .goback-bt a { width: 100%; padding: 8px 0 0 0; color: #fff; text-decoration: none; box-sizing: border-box; display: block;}
    
    .footer-error { width: 1400px; margin: 0 auto; display: flex; justify-content: flex-start; align-items: flex-start;}
    .footer-error .column-lt { width: calc(100% - 120px); padding: 30px 0 50px 0; color: #545e64; font-size: 0.8em; line-height: 2em; letter-spacing: 0.1em;}
    .footer-error .column-rt { width: 120px; padding: 30px 0 0 0; display: flex; justify-content: flex-end; align-items: center;}
    
    
    
    /******** site map ********/
    
    .sitemap-content { width: 100%; padding: 90px 60px; box-sizing: border-box;}
    
    .sitemap-content .title { width: 100%; margin: 0 0 40px 0; font-size: 1.2em; font-weight: 600; letter-spacing: 0.1em;}
    
    .sitemap-content .column-bx { width: 100%; padding: 0 0 0 100px; margin: 0; list-style: none; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .sitemap-content .column-bx .column { width: calc(100% / 3);}
    .sitemap-content .column-bx .column ul { width: 100%; padding: 0; margin: 0; list-style: none; display: block;}
    .sitemap-content .column-bx .column ul li { padding: 0; margin: 0 0 30px 0; font-size: 1em; font-weight: 600; letter-spacing: 0.1em;}
    .sitemap-content .column-bx .column ul li a { color: #000; text-decoration: none;}
    .sitemap-content .column-bx .column ul li a:hover { text-decoration: underline;}
    .sitemap-content .column-bx .column ul li ul.snd { width: 100%; padding: 0; margin: 10px 0 0 0; list-style: none; display: block;}
    .sitemap-content .column-bx .column ul li ul.snd li { padding: 0; margin: 0; color: #545e64; font-size: 0.9em; font-weight: normal; letter-spacing: 0.1em;}
    .sitemap-content .column-bx .column ul li ul.snd li a { color: #545e64; text-decoration: none;}
    .sitemap-content .column-bx .column ul li ul.snd li a:hover { text-decoration: underline;}
    
    
    
    /******** site map ********/
    
    .main-content .google-map { width: 100%; padding: 30px 30px 30px 50px; box-sizing: border-box;}
    .main-content .google-map iframe { width: 100%; height: 600px;}
    
            
        
    /******** footer ********/
    
    footer { clear: both; width: 100%; background-image: url("../images/footer_bg_pic.jpg"); background-position: bottom; background-repeat: no-repeat; background-size: cover; background-color: rgba(79,90,96,1); overflow: hidden; position: relative;}
    
    footer .footer-content { width: 100%; padding: 30px 0; margin: 0 auto; color: #fff; font-size: 0.8em; letter-spacing: 0.1em; background-color: rgba(79,90,96,0.9); display: flex; justify-content: center; align-items: stretch;}
    footer .footer-content .left-col { width: 1050px;}
    footer .footer-content .left-col .address { width: 100%;}
    footer .footer-content .left-col .footer-menu { width: 100%; margin: 40px 0 0 0;}
    footer .footer-content .left-col .footer-menu a { color: #fff; text-decoration: none;}
    footer .footer-content .left-col .footer-menu a:hover { text-decoration: underline;}
    footer .footer-content .right-col { width: 350px; display: flex; justify-content: flex-start; align-items: stretch;}
    footer .footer-content .right-col .footer-menu { width: 300px;}
    footer .footer-content .right-col .footer-menu ul { width: 100%; padding: 30px 0 0 25px; margin: 0; list-style: disc; display: block; box-sizing: border-box;}
    footer .footer-content .right-col .footer-menu ul li { padding: 0 0 0 10px; margin: 0 0 2px 0;}
    footer .footer-content .right-col .footer-menu ul li a { color: #fff; text-decoration: none;}
    footer .footer-content .right-col .footer-menu ul li a:hover { text-decoration: underline;}
    footer .footer-content .right-col .map-icon { width: 50px; padding: 0 0 10px 0; display: flex; justify-content: center; align-items: flex-end;}
    
    
    
}


@media screen and (min-width: 1024px) and (max-width: 1439px) {
    
    
    /******** header for pc ********/
    
    header#mo { display: none;}
    
    header#pc { width: 100%;}
    
    header#pc .header-top-bar { width: 100%; display: flex; justify-content: flex-end; align-items: center; background-color: #5d686e;}
    
    header#pc .header-top-bar .title-bx { width: 260px;}
    header#pc .header-top-bar .title-bx ul { padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start;}
    header#pc .header-top-bar .title-bx ul li { padding: 0; margin: 0 10px;}
    header#pc .header-top-bar .title-bx ul li a { color: #fff; font-size: 0.8em; letter-spacing: 0.2em; text-decoration: none;}
    header#pc .header-top-bar .title-bx ul li a:hover { color: #fdd900;}
    
    header#pc .header-top-bar .search-bx { width: 270px; display: flex; justify-content: flex-start; align-items: center; background-color: #fff;}
    header#pc .header-top-bar .search-bx input[type=search] { width: calc(90% - 40px); padding: 10px; color: #000; font: 1em "Noto Sans TC", sans-serif, "微軟正黑體", Arial; box-sizing: border-box; border: 0; background-color: #fff;}
    header#pc .header-top-bar .search-bx input[type=button] { width: 40px; height: 31px; box-sizing: border-box; background-color: #fff; background-image: url("../images/search_icon.png"); background-repeat: no-repeat; border-top: 0; border-left: 0; border-bottom: 0; border-right: 2px #a1a5a6 solid; cursor: pointer;}
    
    header#pc .title-nav-bx { width: 96%; margin: 20px auto 0 auto;}
    
    header#pc .title-nav-bx .sub-title-bx { width: 330px; padding: 0 0 15px 0; float: left;}
    
    header#pc .title-nav-bx nav#pc { clear: both; width: 100%; margin: 0 0 5px 0;}
    header#pc .title-nav-bx nav#pc ul { padding: 0; margin: 35px 0 0 0; list-style: none; display: flex; justify-content: center; align-items: flex-end;}
    header#pc .title-nav-bx nav#pc ul li { padding: 0; margin: 0 0 0 50px; line-height: 1.4em; text-align: center; position: relative;}
    header#pc .title-nav-bx nav#pc ul li a { color: #676664; text-decoration: none; cursor: pointer;}
    header#pc .title-nav-bx nav#pc ul li a font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    header#pc .title-nav-bx nav#pc ul li a font.en { font-size: 0.8em;}
    header#pc .title-nav-bx nav#pc ul li a .icon-home { width: 100%; height: 23px; margin: 0 auto 7px auto; background-image: url("../images/nav_icon_home.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-home { background-image: url("../images/nav_icon_home_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-home.sel { background-image: url("../images/nav_icon_home_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-about { width: 100%; height: 27px; margin: 0 auto 5px auto; background-image: url("../images/nav_icon_about.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-about { background-image: url("../images/nav_icon_about_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-about.sel { background-image: url("../images/nav_icon_about_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-infor { width: 100%; height: 24px; margin: 0 auto 7px auto; background-image: url("../images/nav_icon_infor.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-infor { background-image: url("../images/nav_icon_infor_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-infor.sel { background-image: url("../images/nav_icon_infor_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-regu { width: 100%; height: 28px; margin: 0 auto 5px auto; background-image: url("../images/nav_icon_regulation.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-regu { background-image: url("../images/nav_icon_regulation_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-regu.sel { background-image: url("../images/nav_icon_regulation_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-dw { width: 100%; height: 26px; margin: 0 auto 5px auto; background-image: url("../images/nav_icon_download.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-dw { background-image: url("../images/nav_icon_download_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-dw.sel { background-image: url("../images/nav_icon_download_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-manage { width: 100%; height: 23px; margin: 0 auto 7px auto; background-image: url("../images/nav_icon_mag_sys.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-manage { background-image: url("../images/nav_icon_mag_sys_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-manage.sel { background-image: url("../images/nav_icon_mag_sys_over.png");}
    header#pc .title-nav-bx nav#pc ul li ul.popup { width: 170px; padding: 0; margin: 0; list-style: none; display: block; position: absolute; top: 83px; left: 0; z-index: 999;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li { width: 100%; padding: 0; margin: 0; text-align: left; letter-spacing: 0.1em;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a { width: 100%; padding: 10px 20px; color: #fff; text-decoration: none; background-color: rgba(79,89,95,1); display: flex; justify-content: flex-start; align-items: center; box-sizing: border-box;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a:hover { background-color: rgba(79,89,95,1)}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a .checked { width: 25px;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a .text { width: calc(100% - 25px);}
        
    
    
    /******** banner ********/
    
    .banner-text-full { width: 100%; position: relative;}
    
    .banner-text-full .banner-bx { width: 100%; height: 26vw; overflow: hidden; position: relative;}
    .banner-text-full .banner-bx ul li a { text-decoration: none; display: block;}
    .banner-text-full .banner-bx ul li .pic { width: 100%; position: absolute; top: 0; left: 0; z-index: 5;}
    .banner-text-full .banner-bx ul li .pic img { width: 100%; height: auto;}
    .banner-text-full .banner-bx ul li .bg-sq { width: 41vw; text-align: right; position: absolute; top: -3.1vw; right: 0; z-index: 10;}
    .banner-text-full .banner-bx ul li .bg-sq img { width: 100%; height: auto;}
    
    .banner-text-full .banner-bx ul li .text-bx { display: none;}
    
    
    
    /******** section ********/
    
    section { width: 100%; margin: 0 auto;}
    
    
    
    /******** aside ********/
    
    aside { width: 250px; padding: 0; margin: 0; float: right;}
    
    aside .menu-bx { width: 100%; height: 730px; padding: 25px 0 0 0; margin: 0; background-color: #fdd900;}
    aside .menu-bx .aside-icon { display: none;}
    aside .menu-bx dl#panel { width: 100%; padding: 0; margin: 0; border-top: 1px #fff solid;}
    aside .menu-bx dl#panel dt { width: 100%; padding: 20px 0 20px 10px; margin: 0; font-size: 1.1em; letter-spacing: 0.1em; display: flex; justify-content: flex-start; align-items: center; border-bottom: 1px #fff solid; box-sizing: border-box; cursor: pointer;}
    aside .menu-bx dl#panel dt:hover { background-color: #ffe35e;}
    aside .menu-bx dl#panel dt.sel { background-color: #ffe35e;}
    aside .menu-bx dl#panel dt .icon { width: 60px}
    aside .menu-bx dl#panel dt .text { width: calc(100% - 60px); color: #363531; font-size: 1.1em; line-height: 1em;}
    aside .menu-bx dl#panel dt .text font.en { font-size: 0.6em; line-height: 1em; letter-spacing: normal;}
    aside .menu-bx dl#panel dd { width: 100%; padding: 0; margin: 0; border-bottom: 1px #fff solid; box-sizing: border-box; display: none;}
    aside .menu-bx dl#panel dd ul { width: calc(100% - 30px); padding: 0; margin: 0; list-style: none; display: block; float: right;}
    aside .menu-bx dl#panel dd ul li { width: 100%; padding: 0; margin: 0;}
    aside .menu-bx dl#panel dd ul li a { width: 100%; padding: 10px; margin: 0; color: #fff; font-size: 0.9em; text-decoration: none; border-bottom: 1px #fff solid; background-color: #6e756b; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: center;}
    aside .menu-bx dl#panel dd ul li a:hover { background-color: #50595c;}
    aside .menu-bx dl#panel dd ul li a .checked { width: 30px;}
    aside .menu-bx dl#panel dd ul li a .text { width: calc(100% - 30px);}
    aside .menu-bx dl#panel dd ul li:last-child a { border: 0;}
    
    aside .data-num-bx { width: 100%; padding: 20px 20px 0 20px; color: #585757; font-size: 0.8em; letter-spacing: 0.1em; box-sizing: border-box;}
    aside .data-num-bx font.num { font-size: 1.6em; font-weight: 500;}
    
    
    
    /******** content #hp ********/
    
    .main-content { width: calc(100% - 250px); padding: 30px 30px 30px 10px; min-height: 880px; border-right: 1px #909a9f solid; box-sizing: border-box; float: left; position: relative;}
    
    .main-content .hp-menu { width: 100%; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start;}
    .main-content .hp-menu .icon { width: 50px;}
    .main-content .hp-menu .news-tabs-bx { width: calc(100% - 50px);}
    .main-content .hp-menu .news-tabs-bx ul { padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .hp-menu .news-tabs-bx ul li { padding: 0; margin: 0; line-height: 1em; text-align: center;}
    .main-content .hp-menu .news-tabs-bx ul li a { width: 115px; padding: 5px 0; color: #545e64; text-decoration: none; border-bottom: 5px #fbfaf6 solid; box-sizing: border-box; display: block;}
    .main-content .hp-menu .news-tabs-bx ul li a:hover { border-bottom: 5px #6a7277 solid; box-sizing: border-box;}
    .main-content .hp-menu .news-tabs-bx ul li a.sel { border-bottom: 5px #485157 solid; box-sizing: border-box;}
    .main-content .hp-menu .news-tabs-bx ul li a font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .hp-menu .news-tabs-bx ul li a font.en { font-size: 0.6em;}
    .main-content .news-list-bx { width: 100%; padding: 30px 20px; box-sizing: border-box;}
    .main-content .news-list-bx .list-bx { clear: both; width: 100%; padding: 0 0 15px 0;}
    .main-content .news-list-bx .list-bx .date { width: 100px; padding: 5px 0; margin: 0 20px 0 0; color: #485157; font-size: 0.8em; font-weight: 500; line-height: 1em; text-align: center; background-color: #ffd900; float: left;}
    .main-content .news-list-bx .list-bx .title { width: calc(100% - 120px); font-size: 0.9em; letter-spacing: 0.1em; float: left;}
    .main-content .news-list-bx .list-bx .title a { color: #485157; text-decoration: none;}
    .main-content .news-list-bx .list-bx .title a:hover { text-decoration: underline;}
    .main-content .news-list-bx .more { clear: both; width: 100%; padding: 20px 20px 0 0; box-sizing: border-box; text-align: right;}
    .main-content .news-list-bx .more a { color: #485157; font-size: 0.9em; text-decoration: none;}
    .main-content .news-list-bx .more a:hover { text-decoration: underline;}
    
    .main-content .hp-title { width: 100%; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start; position: relative;}
    .main-content .hp-title .icon { width: 50px;}
    .main-content .hp-title .title { width: calc(100% - 50px); padding: 10px 0 0 0; color: #545e64; font-size: 1.1em; line-height: 1em; letter-spacing: 0.1em;}
    .main-content .hp-title .more { width: 40px; font-size: 0.9em; text-align: right; position: absolute; top: 20px; right: 10px;}
    .main-content .hp-title .more a { color: #414141; text-decoration: none;}
    .main-content .hp-title .more a:hover { text-decoration: underline;}
    
    .main-content ul#spot-list-bx { clear: both; width: 100%; padding: 0; margin: 0 0 30px 0; list-style: none; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .main-content ul#spot-list-bx li { width: calc(100% / 3 - 20px); margin: 20px 10px; background-color: #fff; position: relative;}
    .main-content ul#spot-list-bx li:hover { -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5);}
    .main-content ul#spot-list-bx li a { width: 100%; text-decoration: none; display: block;}
    .main-content ul#spot-list-bx li .pic { width: 100%; height: 14vw; display: flex; justify-content: center; align-items: center; overflow: hidden;}
    .main-content ul#spot-list-bx li .pic img.v { width: 100%; height: auto;}
    .main-content ul#spot-list-bx li .pic img.h { width: auto; height: 100%;}
    .main-content ul#spot-list-bx li .text { width: 100%; padding: 15px; margin: 0 0 30px 0; line-height: 1.2em; box-sizing: border-box; background-color: #fff;}
    .main-content ul#spot-list-bx li .text font.sub-date { padding: 2px 10px; color: #555e60; font-size: 0.8em; background-color: #ffd900;}
    .main-content ul#spot-list-bx li .text .title { clear: both; width: 100%; margin: 15px 0 10px 0; color: #555e60; font-size: 1.1em; letter-spacing: 0.1em; font-weight: 500;}
    .main-content ul#spot-list-bx li .text .intro { width: 100%; color: #555e60; font-size: 0.8em; letter-spacing: 0.1em;}    
    .main-content ul#spot-list-bx li .more { clear: both; width: calc(100% - 15px); margin: 10px 0 0 0; color: #555e60; font-size: 0.8em; text-align: right; position: absolute; bottom: 15px; left: 0;}
    
    .main-content #spot-news { width: 110%; border-radius: 10px; background-color: #fff; -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-sizing: border-box; position: absolute; top: 100px; left: 10px; z-index: 9999; display: none;}
    .main-content #spot-news .close-bar { width: 100%; padding: 5px 20px; color: #475055; font-size: 2em; text-align: right; border-bottom: 1px #cdcfce solid; box-sizing: border-box;}
    .main-content #spot-news .close-bar .icon-colse { width: 50px; cursor: pointer; float: right;}
    .main-content #spot-news .content-bx { width: 100%; padding: 30px 50px; color: #3E3A39; letter-spacing: 0.1em; box-sizing: border-box;}
    .main-content #spot-news .content-bx .source-date { font-size: 0.8em; display: flex; justify-content: flex-start; align-items: center;}
    .main-content #spot-news .content-bx .source-date .date { padding: 2px 10px; color: #555e60; text-align: center; background-color: #ffd900;}
    .main-content #spot-news .content-bx .source-date .source { margin: 0 0 0 15px;}
    .main-content #spot-news .content-bx .title { clear: both; width: 100%; padding: 20px 0; font-size: 1.2em; font-size: 600;}
    .main-content #spot-news .content-bx .content { width: 100%; padding: 0 30px; font-size: 0.9em; line-height: 1.8em; box-sizing: border-box;}
    .main-content #spot-news .content-bx .content a { color: #3E3A39; border-bottom: 1px #666 dashed; text-decoration: none;}
    .main-content #spot-news .content-bx .content .photo-bx { width: calc(50% - 20px); margin: 0 10px 20px 10px; float: left;}
    .main-content #spot-news .content-bx .content .photo-bx:nth-child(odd) { clear: both;}
    .main-content #spot-news .content-bx .content .photo-bx .pic { width: 100%;}
    .main-content #spot-news .content-bx .content .photo-bx .pic img { width: 100%; height: auto;}
    .main-content #spot-news .content-bx .content .photo-bx .text { width: 100%; padding: 10px 0 0 0; font-size: 0.9em; line-height: 1.4em; text-align: center;}
    
    .main-content ul.qk-link-bx { width: 100%; padding: 0; margin: 20px 0; list-style: none; display: flex; justify-content: center; align-items: stretch;}
    .main-content ul.qk-link-bx li { width: 25%; padding: 0; margin: 0;}
    .main-content ul.qk-link-bx li .icon-bx { width: 85px; height: 85px; margin: 0 auto; border-radius: 100%; border: 2px #485157 solid; display: flex; justify-content: center; align-items: center;}
    .main-content ul.qk-link-bx li .text-1 { clear: both; width: 90%; margin: 5px auto; color: #485157; letter-spacing: 0.1em; font-weight: 500; line-height: 1em; text-align: center;}
    .main-content ul.qk-link-bx li .text-2 { clear: both; width: 90%; margin: 0 auto; color: #000; font-size: 0.8em; letter-spacing: 0.1em; line-height: 1.4em; text-align: center;}
    .main-content ul.qk-link-bx li .text-2 a { color: #485157; text-decoration: none;}
    .main-content ul.qk-link-bx li .text-2 a:hover { text-decoration: underline;}
    
    
    
    /******** content #news content ********/
    
    .main-content .breadcrumb-bx { width: 100%; margin: 0 0 30px 0; color: #231815; font-size: 0.9em; letter-spacing: 0.1em;}
    .main-content .breadcrumb-bx a { color: #231815; text-decoration: none;}
    .main-content .breadcrumb-bx a:hover { text-decoration: underline;}
    
    .main-content .news-content-bx { width: 100%; padding: 30px 30px 30px 50px; word-break: break-all; box-sizing: border-box;}
    .main-content .news-content-bx .title { width: 100%; margin: 0 0 20px 0; color: #231815; font-size: 1.2em; font-weight: 600; letter-spacing: 0.1em;}
    .main-content .news-content-bx .content { width: 100%; color: #231815; font-size: 0.9em; line-height: 1.8em; letter-spacing: 0.1em;}
    .main-content .news-content-bx .content a { color: #231815; text-decoration: none;}
    .main-content .news-content-bx .content a:hover { text-decoration: underline;}
    
    ul.bignum { padding: 0 0 0 30px; margin: 0; box-sizing: border-box; list-style-type: cjk-ideographic; display: block;}
    ul.bignum li { padding: 0; margin: 0;}
    
    .main-content .gotop { clear: both; width: 60px; margin: 30px 0 0 0; color: #332c2a; float: right; cursor: pointer;}
    
    
    
    /******** content #member intro ********/
    
    .main-content .page-menu { width: 100%; margin: 0 0 30px 0; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start;}
    .main-content .page-menu .icon { width: 50px;}
    .main-content .page-menu .menu-tabs-bx { width: calc(100% - 50px);}
    .main-content .page-menu .menu-tabs-bx ul { padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .page-menu .menu-tabs-bx ul li { padding: 0; margin: 0; line-height: 1em; text-align: center;}
    .main-content .page-menu .menu-tabs-bx ul li a { width: 115px; padding: 5px 0; color: #545e64; text-decoration: none; border-bottom: 5px #fbfaf6 solid; box-sizing: border-box; display: block;}
    .main-content .page-menu .menu-tabs-bx ul li a:hover { border-bottom: 5px #6a7277 solid; box-sizing: border-box;}
    .main-content .page-menu .menu-tabs-bx ul li a.sel { border-bottom: 5px #485157 solid; box-sizing: border-box;}
    .main-content .page-menu .menu-tabs-bx ul li a font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .page-menu .menu-tabs-bx ul li a font.en { font-size: 0.6em;}
    
    .main-content .mem-list-bx { clear: both; width: 90%; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .main-content .mem-list-bx .mem-bx { width: calc(100% / 3 - 20px); margin: 10px 10px 60px 10px; position: relative;}
    .main-content .mem-list-bx .mem-bx .pic { width: 145px; height: 145px; margin: 0 auto; border-radius: 100%; border: 5px #fff solid; background-color: #efefef; box-sizing: border-box; display: flex; justify-content: center; align-items: center; overflow: hidden; -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); position: absolute; top: 0; left: calc(50% - 72px); z-index: 99;}
    .main-content .mem-list-bx .mem-bx .pic img { width: auto; height: 100%;}
    .main-content .mem-list-bx .mem-bx .box { width: 100%; height: 100%; padding: 140px 20px 0 20px; margin: 30px 0 0 0; border: 1px #e9e9e7 solid; background-color: #fff; box-sizing: border-box; z-index: 9;}
    .main-content .mem-list-bx .mem-bx .box .name { width: 100%; color: #485157; font-size: 0.9em; font-weight: 500; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .title-1 { width: 100%; color: #0081a3; font-size: 0.8em; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .title-2 { width: 100%; color: #342e2c; font-size: 0.8em; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .job { width: 100%; color: #342e2c; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .contact { width: 100%; color: #342e2c; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box hr { width: 100%; margin: 15px 0; border: 1px #d8d8d9 solid;}
    
    .main-content .title-line { clear: both; width: 90%; margin: 30px auto; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .title-line .title-1 { width: 80px; color: #545e64; font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .title-line .line-1 { width: calc(100% - 80px);}
    .main-content .title-line .title-2 { width: 220px; color: #545e64; font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .title-line .line-2 { width: calc(100% - 220px);}
    .main-content .title-line .line-1 hr, .line-2 hr { width: 100%; margin: 15px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #meeting list ********/
    
    .main-content .mt-list-bx { width: 100%; padding: 0 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .mt-list-bx .title-bx { width: 100%; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .mt-list-bx .title-bx .icon { width: 35px;}
    .main-content .mt-list-bx .title-bx .text { width: 160px; color: #798388; font-size: 1.1em; font-weight: 500; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .title-bx .year { width: calc(100% - 195px); color: #798388; font-size: 1em; text-align: right;}
    .main-content .mt-list-bx .title-bx .year a { color: #798388; text-decoration: none;}
    .main-content .mt-list-bx .title-bx .year a.sel { text-decoration: underline;}
    
    .main-content .mt-list-bx .list-bx { clear: both; width: 100%; margin: 30px 0;}
    .main-content .mt-list-bx .list-bx .caption { width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .mt-list-bx .list-bx .caption .cap-1 { width: calc(100% - 40px); color: #798388; font-size: 0.9em; font-weight: 600; letter-spacing: 0.1em; display: flex; align-items: center;}
    .main-content .mt-list-bx .list-bx .caption .cap-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .list-bx .column { clear: both; width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .mt-list-bx .list-bx .column .col-1 { width: calc(100% - 40px); display: flex; justify-content: flex-start; align-items: baseline;}
    .main-content .mt-list-bx .list-bx .column .col-1 .date { width: 100px; margin: 0 10px 0 0; color: #798388; font-size: 0.8em; text-align: center; letter-spacing: 0.1em; background-color: #ffd900;}
    .main-content .mt-list-bx .list-bx .column .col-1 .text { width: calc(100% - 110px); color: #798388; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .list-bx .column .col-1 .space { width: 100px; margin: 0 10px 0 0; font-size: 0.8em; display: block;}
    .main-content .mt-list-bx .list-bx .column .col-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .list-bx .column .col-2 a { color: #798388; text-decoration: none;}
    .main-content .mt-list-bx .list-bx hr { width: 100%; margin: 20px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #regulation list ********/
    
    .main-content .rg-list-bx { width: 100%; padding: 0 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .rg-list-bx .title-bx { width: 100%; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .rg-list-bx .title-bx .icon { width: 50px;}
    .main-content .rg-list-bx .title-bx .text { width: calc(100% - 50px); color: #798388; font-size: 1.1em; font-weight: 500; letter-spacing: 0.1em;}
    
    .main-content .rg-list-bx .list-bx { clear: both; width: 100%; margin: 30px 0;}
    .main-content .rg-list-bx .list-bx .caption { width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .rg-list-bx .list-bx .caption .cap-1 { width: calc(100% - 40px); color: #798388; font-size: 0.9em; font-weight: 600; letter-spacing: 0.1em; display: flex; align-items: center;}
    .main-content .rg-list-bx .list-bx .caption .cap-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .rg-list-bx .list-bx .column { clear: both; width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .rg-list-bx .list-bx .column .col-1 { width: calc(100% - 40px); display: flex; justify-content: flex-start; align-items: baseline;}
    .main-content .rg-list-bx .list-bx .column .col-1 .date { width: 100px; margin: 0 10px 0 0; color: #798388; font-size: 0.8em; text-align: center; letter-spacing: 0.1em; background-color: #ffd900;}
    .main-content .rg-list-bx .list-bx .column .col-1 .text { width: calc(100% - 110px); color: #798388; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .rg-list-bx .list-bx .column .col-1 .space { width: 100px; margin: 0 10px 0 0; font-size: 0.8em; display: block;}
    .main-content .rg-list-bx .list-bx .column .col-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .rg-list-bx .list-bx .column .col-2 a { color: #798388; text-decoration: none;}
    .main-content .rg-list-bx .list-bx hr { width: 100%; margin: 20px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #higher project intro ********/
    
    .main-content .higher-pj-content { width: 100%; padding: 0 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .higher-pj-content .pic { width: 90%; margin: 0 auto 30px auto; color: #3f3b3a; font-size: 0.9em; letter-spacing: 0.1em; text-align: center;}
    .main-content .higher-pj-content .pic img { width: 100%; height: auto;}
    
    .main-content .higher-pj-content .text { clear: both; width: 100%; color: #3f3b3a; font-size: 0.9em; line-height: 1.8em; letter-spacing: 0.1em;}
    .main-content .higher-pj-content .text font.title { font-size: 1.1em; font-weight: 600;}
    
    
    
    /******** content #higher project framework ********/
    
    .main-content .higher-fw-content { width: 100%; padding: 30px 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .higher-fw-content .content-full { width: 100%; margin: 0 0 30px 0; color: #3f3b3a; font-size: 0.9em; font-weight: normal; letter-spacing: 0.1em;}
    
    .main-content .higher-fw-content .content-img-full { width: 100%; text-align: center;}
    .main-content .higher-fw-content .content-img-full img { max-width: 100%; height: auto;}
    .main-content .higher-fw-content .content-img-text-full { width: 100%; margin: 15px 0 30px 0; color: #3f3b3a; font-size: 0.9em; font-weight: normal; text-align: center; letter-spacing: 0.1em;}
    
    
    
    /******** content #higher project result ********/
    
    .main-content .higher-rs-content { width: 100%; padding: 30px 30px 30px 50px; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    
    .main-content .higher-rs-content .higher-rs-ebook-bx { width: calc(100% / 3 - 30px); margin: 15px; background-color: #fff; -moz-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); -webkit-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); box-sizing: border-box; position: relative;}
    .main-content .higher-rs-content .higher-rs-ebook-bx a { width: 100%; padding: 30px 0; box-sizing: border-box; text-decoration: none; display: block;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-title { width: 100%; margin: 0 0 30px 0;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-title span { padding: 5px 15px; color: #414141; font-size: 0.8em; background-color: #ffd900;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-pic { clear: both; width: 100%; text-align: center;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-pic img.ebook { width: 80%; height: auto;}
    .main-content .higher-rs-content .over-mask { width: 100%; height: 100%; padding: 0 0 80px 0; color: #fff; font-size: 1.2em; font-weight: 500; background-color: rgba(0,0,0,0.4); box-sizing: border-box; display: none; justify-content: center; align-items: flex-end; position: absolute; top: 0; left: 0; z-index: 99;}
    
    .main-content #ebook-content {  width: 110%; border-radius: 10px; background-color: #fff; -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-sizing: border-box; position: absolute; top: 100px; left: 10px; z-index: 9999; display: none;}
    .main-content #ebook-content .close-bar { width: 100%; padding: 5px 20px; color: #475055; font-size: 2em; text-align: right; border-bottom: 1px #cdcfce solid; box-sizing: border-box;}
    .main-content #ebook-content .close-bar .icon-colse { width: 50px; cursor: pointer; float: right;}
    .main-content #ebook-content .content-bx { width: 100%; padding: 30px 50px; color: #3E3A39; letter-spacing: 0.1em; box-sizing: border-box;}
    .main-content #ebook-content .content-bx .source-date { font-size: 0.8em;}
    .main-content #ebook-content .content-bx .source-date span { padding: 2px 10px; color: #555e60; text-align: center; background-color: #ffd900;}
    .main-content #ebook-content .content-bx .title { clear: both; width: 100%; padding: 20px 0; font-size: 1.2em; font-size: 600;}
    .main-content #ebook-content .content-bx .content { width: 100%; padding: 0 30px; font-size: 0.9em; line-height: 1.8em; box-sizing: border-box;}
    .main-content #ebook-content .content-bx .content img { width: 100%; height: auto;}
    .main-content #ebook-content .content-bx .content iframe.iframe-ebook { width: 100%; height: 800px; border: 0;}
    
    
    
    /******** content #center strategic ********/
    
    .main-content .center-strategic-content { width: 100%; padding: 30px 30px 30px 50px; color: #3f3b3a; letter-spacing: 0.1em; box-sizing: border-box;}
    
    .main-content .center-strategic-content .text-1 { width: 100%; margin: 0 0 15px 0; font-size: 1.2em; font-weight: 600;}
    
    .main-content .center-strategic-content img { max-width: 100%; height: auto;}
    
    
    
    /******** error 404 ********/
    
    .error-bx { clear: both; width: 100%; padding: 50px 0; background-color: #ffd900; display: flex; justify-content: center; align-items: center;}
    .error-bx .pic { width: 45%;}
    .error-bx .pic img { width: 100%; height: auto;}
    .error-bx .text { width: 45%; padding: 0 0 0 40px; box-sizing: border-box;}
    .error-bx .text font.text1 { color: #3f3b3a; font-size: 3.4em; line-height: 1em; font-weight: 600;}
    .error-bx .text font.text2 { color: #004256; font-size: 3.4em; font-weight: 200;}
    .error-bx .text font.text3 { color: #004256; font-size: 1.6em; line-height: 1em; font-weight: 200;}
    .error-bx .text font.text4 { color: #004256; font-size: 2.4em; font-weight: 500;}
    .error-bx .text .goback-bt { width: 400px; height: 39px; margin: 30px 0 0 0; color: #fff; font-size: 0.9em; font-weight: 600; text-align: center; border-radius: 6px; background-image: url("../images/error_bt_bg.png"); background-repeat: repeat-x; overflow: hidden;}
    .error-bx .text .goback-bt a { width: 100%; padding: 8px 0 0 0; color: #fff; text-decoration: none; box-sizing: border-box; display: block;}
    
    .footer-error { width: 96%; margin: 0 auto; display: flex; justify-content: flex-start; align-items: flex-start;}
    .footer-error .column-lt { width: calc(100% - 120px); padding: 30px 0 50px 0; color: #545e64; font-size: 0.8em; line-height: 2em; letter-spacing: 0.1em;}
    .footer-error .column-rt { width: 120px; padding: 30px 0 0 0; display: flex; justify-content: flex-end; align-items: center;}
    
    
    
    /******** site map ********/
    
    .sitemap-content { width: 100%; padding: 90px 60px; box-sizing: border-box;}
    
    .sitemap-content .title { width: 100%; margin: 0 0 40px 0; font-size: 1.2em; font-weight: 600; letter-spacing: 0.1em;}
    
    .sitemap-content .column-bx { width: 100%; padding: 0 0 0 100px; margin: 0; list-style: none; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .sitemap-content .column-bx .column { width: calc(100% / 3);}
    .sitemap-content .column-bx .column ul { width: 100%; padding: 0; margin: 0; list-style: none; display: block;}
    .sitemap-content .column-bx .column ul li { padding: 0; margin: 0 0 30px 0; font-size: 1em; font-weight: 600; letter-spacing: 0.1em;}
    .sitemap-content .column-bx .column ul li a { color: #000; text-decoration: none;}
    .sitemap-content .column-bx .column ul li a:hover { text-decoration: underline;}
    .sitemap-content .column-bx .column ul li ul.snd { width: 100%; padding: 0; margin: 10px 0 0 0; list-style: none; display: block;}
    .sitemap-content .column-bx .column ul li ul.snd li { padding: 0; margin: 0; color: #545e64; font-size: 0.9em; font-weight: normal; letter-spacing: 0.1em;}
    .sitemap-content .column-bx .column ul li ul.snd li a { color: #545e64; text-decoration: none;}
    .sitemap-content .column-bx .column ul li ul.snd li a:hover { text-decoration: underline;}
    
    
    
    /******** site map ********/
    
    .main-content .google-map { width: 100%; padding: 30px 30px 30px 50px; box-sizing: border-box;}
    .main-content .google-map iframe { width: 100%; height: 600px;}
            
    
    
    /******** footer ********/
    
    footer { clear: both; width: 100%; background-image: url("../images/footer_bg_pic.jpg"); background-position: bottom; background-repeat: no-repeat; background-size: cover; background-color: rgba(79,90,96,1); overflow: hidden; position: relative;}
    
    footer .footer-content { width: 100%; padding: 30px 0; margin: 0 auto; color: #fff; font-size: 0.8em; letter-spacing: 0.1em; background-color: rgba(79,90,96,0.9); display: flex; justify-content: center; align-items: stretch;}
    footer .footer-content .left-col { width: calc(96% - 250px);}
    footer .footer-content .left-col .address { width: 100%;}
    footer .footer-content .left-col .footer-menu { width: 100%; margin: 40px 0 0 0;}
    footer .footer-content .left-col .footer-menu a { color: #fff; text-decoration: none;}
    footer .footer-content .left-col .footer-menu a:hover { text-decoration: underline;}
    footer .footer-content .right-col { width: 250px; display: flex; justify-content: flex-start; align-items: stretch;}
    footer .footer-content .right-col .footer-menu { width: 250px;}
    footer .footer-content .right-col .footer-menu ul { width: 100%; padding: 30px 0 0 25px; margin: 0; list-style: disc; display: block; box-sizing: border-box;}
    footer .footer-content .right-col .footer-menu ul li { padding: 0 0 0 10px; margin: 0 0 2px 0;}
    footer .footer-content .right-col .footer-menu ul li a { color: #fff; text-decoration: none;}
    footer .footer-content .right-col .footer-menu ul li a:hover { text-decoration: underline;}
    footer .footer-content .right-col .map-icon { width: 50px; padding: 0 0 10px 0; display: flex; justify-content: center; align-items: flex-end;}
    
    
}


@media screen and (min-width: 768px) and (max-width: 1023px) {
    
    
    /******** header for pc ********/
    
    header#mo { display: none;}
    
    header#pc { width: 100%;}
    
    header#pc .header-top-bar { width: 100%; display: flex; justify-content: flex-end; align-items: center; background-color: #5d686e;}
    
    header#pc .header-top-bar .title-bx { width: 260px;}
    header#pc .header-top-bar .title-bx ul { padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start;}
    header#pc .header-top-bar .title-bx ul li { padding: 0; margin: 0 10px;}
    header#pc .header-top-bar .title-bx ul li a { color: #fff; font-size: 0.8em; letter-spacing: 0.2em; text-decoration: none;}
    header#pc .header-top-bar .title-bx ul li a:hover { color: #fdd900;}
    
    header#pc .header-top-bar .search-bx { width: 270px; display: flex; justify-content: flex-start; align-items: center; background-color: #fff;}
    header#pc .header-top-bar .search-bx input[type=search] { width: calc(90% - 40px); padding: 10px; color: #000; font: 1em "Noto Sans TC", sans-serif, "微軟正黑體", Arial; box-sizing: border-box; border: 0; background-color: #fff;}
    header#pc .header-top-bar .search-bx input[type=button] { width: 40px; height: 31px; box-sizing: border-box; background-color: #fff; background-image: url("../images/search_icon.png"); background-repeat: no-repeat; border-top: 0; border-left: 0; border-bottom: 0; border-right: 2px #a1a5a6 solid; cursor: pointer;}
    
    header#pc .title-nav-bx { width: 96%; margin: 20px auto 0 auto;}
    
    header#pc .title-nav-bx .sub-title-bx { width: 330px; padding: 0 0 15px 0; float: left;}
    
    header#pc .title-nav-bx nav#pc { clear: both; width: 100%; margin: 0 0 5px 0;}
    header#pc .title-nav-bx nav#pc ul { padding: 0; margin: 35px 0 0 0; list-style: none; display: flex; justify-content: center; align-items: flex-end;}
    header#pc .title-nav-bx nav#pc ul li { padding: 0; margin: 0 0 0 30px; line-height: 1.4em; text-align: center; position: relative;}
    header#pc .title-nav-bx nav#pc ul li a { color: #676664; text-decoration: none; cursor: pointer;}
    header#pc .title-nav-bx nav#pc ul li a font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    header#pc .title-nav-bx nav#pc ul li a font.en { font-size: 0.8em;}
    header#pc .title-nav-bx nav#pc ul li a .icon-home { width: 100%; height: 23px; margin: 0 auto 7px auto; background-image: url("../images/nav_icon_home.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-home { background-image: url("../images/nav_icon_home_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-home.sel { background-image: url("../images/nav_icon_home_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-about { width: 100%; height: 27px; margin: 0 auto 5px auto; background-image: url("../images/nav_icon_about.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-about { background-image: url("../images/nav_icon_about_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-about.sel { background-image: url("../images/nav_icon_about_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-infor { width: 100%; height: 24px; margin: 0 auto 7px auto; background-image: url("../images/nav_icon_infor.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-infor { background-image: url("../images/nav_icon_infor_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-infor.sel { background-image: url("../images/nav_icon_infor_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-regu { width: 100%; height: 28px; margin: 0 auto 5px auto; background-image: url("../images/nav_icon_regulation.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-regu { background-image: url("../images/nav_icon_regulation_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-regu.sel { background-image: url("../images/nav_icon_regulation_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-dw { width: 100%; height: 26px; margin: 0 auto 5px auto; background-image: url("../images/nav_icon_download.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-dw { background-image: url("../images/nav_icon_download_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-dw.sel { background-image: url("../images/nav_icon_download_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-manage { width: 100%; height: 23px; margin: 0 auto 7px auto; background-image: url("../images/nav_icon_mag_sys.png"); background-position: center; background-repeat: no-repeat; display: block;}
    header#pc .title-nav-bx nav#pc ul li:hover > a .icon-manage { background-image: url("../images/nav_icon_mag_sys_over.png");}
    header#pc .title-nav-bx nav#pc ul li a .icon-manage.sel { background-image: url("../images/nav_icon_mag_sys_over.png");}
    header#pc .title-nav-bx nav#pc ul li ul.popup { width: 170px; padding: 0; margin: 0; list-style: none; display: block; position: absolute; top: 83px; left: 0; z-index: 999;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li { width: 100%; padding: 0; margin: 0; text-align: left; letter-spacing: 0.1em;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a { width: 100%; padding: 10px 20px; color: #fff; text-decoration: none; background-color: rgba(79,89,95,1); display: flex; justify-content: flex-start; align-items: center; box-sizing: border-box;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a:hover { background-color: rgba(79,89,95,1)}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a .checked { width: 25px;}
    header#pc .title-nav-bx nav#pc ul li ul.popup li a .text { width: calc(100% - 25px);}
        
    
    
    /******** banner ********/
    
    .banner-text-full { width: 100%; position: relative;}
    
    .banner-text-full .banner-bx { width: 100%; height: 26vw; overflow: hidden; position: relative;}
    .banner-text-full .banner-bx ul li a { text-decoration: none; display: block;}
    .banner-text-full .banner-bx ul li .pic { width: 100%; position: absolute; top: 0; left: 0; z-index: 5;}
    .banner-text-full .banner-bx ul li .pic img { width: 100%; height: auto;}
    .banner-text-full .banner-bx ul li .bg-sq { width: 41vw; text-align: right; position: absolute; top: -3.1vw; right: 0; z-index: 10;}
    .banner-text-full .banner-bx ul li .bg-sq img { width: 100%; height: auto;}
    
    .banner-text-full .banner-bx ul li .text-bx { display: none;}
    
    
    
    /******** section ********/
    
    section { width: 100%; margin: 0 auto;}
    
    
    
    /******** aside ********/
    
    aside { width: 100%; padding: 0; margin: 0; border-bottom: 2px #909a9f solid;}
    
    aside .menu-bx { width: 100%; padding: 25px 0 0 0; margin: 0; background-color: #fdd900;}
    aside .menu-bx .aside-icon { width: 100%; padding: 0 0 25px 0; display: flex; justify-content: center; align-items: center;}
    aside .menu-bx .aside-icon img { margin: 0 20px;}
    aside .menu-bx dl#panel { width: 100%; padding: 0 0 25px 0; border-top: 1px #fff solid; display: none;}
    aside .menu-bx dl#panel dt { width: 100%; padding: 20px 0 20px 30px; margin: 0; font-size: 1.1em; letter-spacing: 0.1em; display: flex; justify-content: flex-start; align-items: center; border-bottom: 1px #fff solid; box-sizing: border-box; cursor: pointer;}
    aside .menu-bx dl#panel dt:hover { background-color: #ffe35e;}
    aside .menu-bx dl#panel dt.sel { background-color: #ffe35e;}
    aside .menu-bx dl#panel dt .icon { width: 70px}
    aside .menu-bx dl#panel dt .text { width: calc(100% - 70px); color: #363531; font-size: 1.1em; line-height: 1em;}
    aside .menu-bx dl#panel dt .text font.en { font-size: 0.6em; line-height: 1em; letter-spacing: normal;}
    aside .menu-bx dl#panel dd { width: 100%; padding: 0; margin: 0; border-bottom: 1px #fff solid; box-sizing: border-box; display: none;}
    aside .menu-bx dl#panel dd ul { width: calc(100% - 30px); padding: 0; margin: 0; list-style: none; display: block; float: right;}
    aside .menu-bx dl#panel dd ul li { width: 100%; padding: 0; margin: 0;}
    aside .menu-bx dl#panel dd ul li a { width: 100%; padding: 10px; margin: 0; color: #fff; font-size: 0.9em; text-decoration: none; border-bottom: 1px #fff solid; background-color: #6e756b; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: center;}
    aside .menu-bx dl#panel dd ul li a:hover { background-color: #50595c;}
    aside .menu-bx dl#panel dd ul li a .checked { width: 30px;}
    aside .menu-bx dl#panel dd ul li a .text { width: calc(100% - 30px);}
    aside .menu-bx dl#panel dd ul li:last-child a { border: 0;}
    
    aside .data-num-bx { width: 100%; padding: 20px; color: #585757; font-size: 0.8em; letter-spacing: 0.1em; box-sizing: border-box;}
    aside .data-num-bx font.num { font-size: 1.6em; font-weight: 500;}
    
    
    
    /******** content #hp ********/
    
    .main-content { width: 96%; padding: 30px 0; margin: 0 auto; box-sizing: border-box; position: relative;}
    
    .main-content .hp-menu { width: 100%; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start;}
    .main-content .hp-menu .icon { width: 50px;}
    .main-content .hp-menu .news-tabs-bx { width: calc(100% - 50px);}
    .main-content .hp-menu .news-tabs-bx ul { padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .hp-menu .news-tabs-bx ul li { padding: 0; margin: 0; line-height: 1em; text-align: center;}
    .main-content .hp-menu .news-tabs-bx ul li a { width: 115px; padding: 5px 0; color: #545e64; text-decoration: none; border-bottom: 5px #fbfaf6 solid; box-sizing: border-box; display: block;}
    .main-content .hp-menu .news-tabs-bx ul li a:hover { border-bottom: 5px #6a7277 solid; box-sizing: border-box;}
    .main-content .hp-menu .news-tabs-bx ul li a.sel { border-bottom: 5px #485157 solid; box-sizing: border-box;}
    .main-content .hp-menu .news-tabs-bx ul li a font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .hp-menu .news-tabs-bx ul li a font.en { font-size: 0.6em;}
    .main-content .news-list-bx { width: 100%; padding: 30px 20px; box-sizing: border-box;}
    .main-content .news-list-bx .list-bx { clear: both; width: 100%; padding: 0 0 15px 0;}
    .main-content .news-list-bx .list-bx .date { width: 100px; padding: 5px 0; margin: 0 20px 0 0; color: #485157; font-size: 0.8em; font-weight: 500; line-height: 1em; text-align: center; background-color: #ffd900; float: left;}
    .main-content .news-list-bx .list-bx .title { width: calc(100% - 120px); font-size: 0.9em; letter-spacing: 0.1em; float: left;}
    .main-content .news-list-bx .list-bx .title a { color: #485157; text-decoration: none;}
    .main-content .news-list-bx .list-bx .title a:hover { text-decoration: underline;}
    .main-content .news-list-bx .more { clear: both; width: 100%; padding: 20px 20px 0 0; box-sizing: border-box; text-align: right;}
    .main-content .news-list-bx .more a { color: #485157; font-size: 0.9em; text-decoration: none;}
    .main-content .news-list-bx .more a:hover, a:active { text-decoration: underline;}
    
    .main-content .hp-title { width: 100%; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start; position: relative;}
    .main-content .hp-title .icon { width: 50px;}
    .main-content .hp-title .title { width: calc(100% - 50px); padding: 10px 0 0 0; color: #545e64; font-size: 1.1em; line-height: 1em; letter-spacing: 0.1em;}
    .main-content .hp-title .more { width: 40px; font-size: 0.9em; text-align: right; position: absolute; top: 20px; right: 10px;}
    .main-content .hp-title .more a { color: #414141; text-decoration: none;}
    .main-content .hp-title .more a:active { text-decoration: underline;}
    
    .main-content ul#spot-list-bx { clear: both; width: 100%; padding: 0; margin: 0 0 30px 0; list-style: none; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .main-content ul#spot-list-bx li { width: calc(100% / 3 - 20px); margin: 20px 10px; background-color: #fff; position: relative;}
    .main-content ul#spot-list-bx li:hover { -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5);}
    .main-content ul#spot-list-bx li a { width: 100%; text-decoration: none; display: block;}
    .main-content ul#spot-list-bx li .pic { width: 100%; height: 18vw; display: flex; justify-content: center; align-items: center; overflow: hidden;}
    .main-content ul#spot-list-bx li .pic img.v { width: 100%; height: auto;}
    .main-content ul#spot-list-bx li .pic img.h { width: auto; height: 100%;}
    .main-content ul#spot-list-bx li .text { width: 100%; padding: 15px; margin: 0 0 30px 0; line-height: 1.2em; box-sizing: border-box; background-color: #fff;}
    .main-content ul#spot-list-bx li .text font.sub-date { padding: 2px 10px; color: #555e60; font-size: 0.8em; background-color: #ffd900;}
    .main-content ul#spot-list-bx li .text .title { clear: both; width: 100%; margin: 15px 0 10px 0; color: #555e60; font-size: 1.1em; letter-spacing: 0.1em; font-weight: 500;}
    .main-content ul#spot-list-bx li .text .intro { width: 100%; color: #555e60; font-size: 0.8em; letter-spacing: 0.1em;}    
    .main-content ul#spot-list-bx li .more { clear: both; width: calc(100% - 15px); margin: 10px 0 0 0; color: #555e60; font-size: 0.8em; text-align: right; position: absolute; bottom: 15px; left: 0;}
    
    .main-content #spot-news { width: 96%; border-radius: 10px; background-color: #fff; -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-sizing: border-box; position: absolute; top: -200px; left: 10px; z-index: 9999; display: none;}
    .main-content #spot-news .close-bar { width: 100%; padding: 5px 20px; color: #475055; font-size: 2em; text-align: right; border-bottom: 1px #cdcfce solid; box-sizing: border-box;}
    .main-content #spot-news .close-bar .icon-colse { width: 50px; cursor: pointer; float: right;}
    .main-content #spot-news .content-bx { width: 100%; padding: 30px 50px; color: #3E3A39; letter-spacing: 0.1em; box-sizing: border-box;}    
    .main-content #spot-news .content-bx .source-date { font-size: 0.8em; display: flex; justify-content: flex-start; align-items: center;}
    .main-content #spot-news .content-bx .source-date .date { padding: 2px 10px; color: #555e60; text-align: center; background-color: #ffd900;}
    .main-content #spot-news .content-bx .source-date .source { margin: 0 0 0 15px;}
    .main-content #spot-news .content-bx .title { clear: both; width: 100%; padding: 20px 0; font-size: 1.2em; font-size: 600;}
    .main-content #spot-news .content-bx .content { width: 100%; padding: 0 30px; font-size: 0.9em; line-height: 1.8em; box-sizing: border-box;}
    .main-content #spot-news .content-bx .content a { color: #3E3A39; border-bottom: 1px #666 dashed; text-decoration: none;}
    .main-content #spot-news .content-bx .content .photo-bx { width: calc(50% - 20px); margin: 0 10px 20px 10px; float: left;}
    .main-content #spot-news .content-bx .content .photo-bx:nth-child(odd) { clear: both;}
    .main-content #spot-news .content-bx .content .photo-bx .pic { width: 100%;}
    .main-content #spot-news .content-bx .content .photo-bx .pic img { width: 100%; height: auto;}
    .main-content #spot-news .content-bx .content .photo-bx .text { width: 100%; padding: 10px 0 0 0; font-size: 0.9em; line-height: 1.4em; text-align: center;}
    
    .main-content ul.qk-link-bx { width: 100%; padding: 0; margin: 20px 0; list-style: none; display: flex; justify-content: center; align-items: stretch;}
    .main-content ul.qk-link-bx li { width: 25%; padding: 0; margin: 0;}
    .main-content ul.qk-link-bx li .icon-bx { width: 85px; height: 85px; margin: 0 auto; border-radius: 100%; border: 2px #485157 solid; display: flex; justify-content: center; align-items: center;}
    .main-content ul.qk-link-bx li .text-1 { clear: both; width: 90%; margin: 5px auto; color: #485157; letter-spacing: 0.1em; font-weight: 500; line-height: 1em; text-align: center;}
    .main-content ul.qk-link-bx li .text-2 { clear: both; width: 90%; margin: 0 auto; color: #000; font-size: 0.8em; letter-spacing: 0.1em; line-height: 2em; text-align: center;}
    .main-content ul.qk-link-bx li .text-2 a { color: #485157; text-decoration: none;}
    .main-content ul.qk-link-bx li .text-2 a:hover { text-decoration: underline;}
    
    
    
    /******** content #news content ********/
    
    .main-content .breadcrumb-bx { width: 100%; margin: 0 0 30px 0; color: #231815; font-size: 0.9em; letter-spacing: 0.1em;}
    .main-content .breadcrumb-bx a { color: #231815; text-decoration: none;}
    .main-content .breadcrumb-bx a:hover { text-decoration: underline;}
    
    .main-content .news-content-bx { width: 100%; padding: 30px 30px 30px 50px; word-break: break-all; box-sizing: border-box;}
    .main-content .news-content-bx .title { width: 100%; margin: 0 0 20px 0; color: #231815; font-size: 1.2em; font-weight: 600; letter-spacing: 0.1em;}
    .main-content .news-content-bx .content { width: 100%; color: #231815; font-size: 0.9em; line-height: 1.8em; letter-spacing: 0.1em;}
    .main-content .news-content-bx .content a { color: #231815; text-decoration: none;}
    .main-content .news-content-bx .content a:hover { text-decoration: underline;}
    
    ul.bignum { padding: 0 0 0 30px; margin: 0; box-sizing: border-box; list-style-type: cjk-ideographic; display: block;}
    ul.bignum li { padding: 0; margin: 0;}
    
    .main-content .gotop { clear: both; width: 60px; margin: 30px 0 0 0; color: #332c2a; float: right; cursor: pointer;}
    
    
    
    /******** content #member intro ********/
    
    .main-content .page-menu { width: 100%; margin: 0 0 30px 0; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start;}
    .main-content .page-menu .icon { width: 50px;}
    .main-content .page-menu .menu-tabs-bx { width: calc(100% - 50px);}
    .main-content .page-menu .menu-tabs-bx ul { padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .page-menu .menu-tabs-bx ul li { padding: 0; margin: 0; line-height: 1em; text-align: center;}
    .main-content .page-menu .menu-tabs-bx ul li a { width: 115px; padding: 5px 0; color: #545e64; text-decoration: none; border-bottom: 5px #fbfaf6 solid; box-sizing: border-box; display: block;}
    .main-content .page-menu .menu-tabs-bx ul li a:hover { border-bottom: 5px #6a7277 solid; box-sizing: border-box;}
    .main-content .page-menu .menu-tabs-bx ul li a.sel { border-bottom: 5px #485157 solid; box-sizing: border-box;}
    .main-content .page-menu .menu-tabs-bx ul li a font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .page-menu .menu-tabs-bx ul li a font.en { font-size: 0.6em;}
    
    .main-content .mem-list-bx { clear: both; width: 90%; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .main-content .mem-list-bx .mem-bx { width: calc(100% / 3 - 20px); margin: 10px 10px 60px 10px; position: relative;}
    .main-content .mem-list-bx .mem-bx .pic { width: 145px; height: 145px; margin: 0 auto; border-radius: 100%; border: 5px #fff solid; background-color: #efefef; box-sizing: border-box; display: flex; justify-content: center; align-items: center; overflow: hidden; -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); position: absolute; top: 0; left: calc(50% - 72px); z-index: 99;}
    .main-content .mem-list-bx .mem-bx .pic img { width: auto; height: 100%;}
    .main-content .mem-list-bx .mem-bx .box { width: 100%; height: 100%; padding: 140px 20px 0 20px; margin: 30px 0 0 0; border: 1px #e9e9e7 solid; background-color: #fff; box-sizing: border-box; z-index: 9;}
    .main-content .mem-list-bx .mem-bx .box .name { width: 100%; color: #485157; font-size: 0.9em; font-weight: 500; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .title-1 { width: 100%; color: #0081a3; font-size: 0.8em; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .title-2 { width: 100%; color: #342e2c; font-size: 0.8em; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .job { width: 100%; color: #342e2c; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .contact { width: 100%; color: #342e2c; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box hr { width: 100%; margin: 15px 0; border: 1px #d8d8d9 solid;}
    
    .main-content .title-line { clear: both; width: 90%; margin: 30px auto; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .title-line .title-1 { width: 80px; color: #545e64; font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .title-line .line-1 { width: calc(100% - 80px);}
    .main-content .title-line .title-2 { width: 220px; color: #545e64; font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .title-line .line-2 { width: calc(100% - 220px);}
    .main-content .title-line .line-1 hr, .line-2 hr { width: 100%; margin: 15px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #meeting list ********/
    
    .main-content .mt-list-bx { width: 100%; padding: 0 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .mt-list-bx .title-bx { width: 100%; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .mt-list-bx .title-bx .icon { width: 35px;}
    .main-content .mt-list-bx .title-bx .text { width: 160px; color: #798388; font-size: 1.1em; font-weight: 500; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .title-bx .year { width: calc(100% - 195px); color: #798388; font-size: 1em; text-align: right;}
    .main-content .mt-list-bx .title-bx .year a { color: #798388; text-decoration: none;}
    .main-content .mt-list-bx .title-bx .year a.sel { text-decoration: underline;}
    
    .main-content .mt-list-bx .list-bx { clear: both; width: 100%; margin: 30px 0;}
    .main-content .mt-list-bx .list-bx .caption { width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .mt-list-bx .list-bx .caption .cap-1 { width: calc(100% - 40px); color: #798388; font-size: 0.9em; font-weight: 600; letter-spacing: 0.1em; display: flex; align-items: center;}
    .main-content .mt-list-bx .list-bx .caption .cap-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .list-bx .column { clear: both; width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .mt-list-bx .list-bx .column .col-1 { width: calc(100% - 40px); display: flex; justify-content: flex-start; align-items: baseline;}
    .main-content .mt-list-bx .list-bx .column .col-1 .date { width: 100px; margin: 0 10px 0 0; color: #798388; font-size: 0.8em; text-align: center; letter-spacing: 0.1em; background-color: #ffd900;}
    .main-content .mt-list-bx .list-bx .column .col-1 .text { width: calc(100% - 110px); color: #798388; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .list-bx .column .col-1 .space { width: 100px; margin: 0 10px 0 0; font-size: 0.8em; display: block;}
    .main-content .mt-list-bx .list-bx .column .col-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .list-bx .column .col-2 a { color: #798388; text-decoration: none;}
    .main-content .mt-list-bx .list-bx hr { width: 100%; margin: 20px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #regulation list ********/
    
    .main-content .rg-list-bx { width: 100%; padding: 0 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .rg-list-bx .title-bx { width: 100%; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .rg-list-bx .title-bx .icon { width: 50px;}
    .main-content .rg-list-bx .title-bx .text { width: calc(100% - 50px); color: #798388; font-size: 1.1em; font-weight: 500; letter-spacing: 0.1em;}
    
    .main-content .rg-list-bx .list-bx { clear: both; width: 100%; margin: 30px 0;}
    .main-content .rg-list-bx .list-bx .caption { width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .rg-list-bx .list-bx .caption .cap-1 { width: calc(100% - 40px); color: #798388; font-size: 0.9em; font-weight: 600; letter-spacing: 0.1em; display: flex; align-items: center;}
    .main-content .rg-list-bx .list-bx .caption .cap-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .rg-list-bx .list-bx .column { clear: both; width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .rg-list-bx .list-bx .column .col-1 { width: calc(100% - 40px); display: flex; justify-content: flex-start; align-items: baseline;}
    .main-content .rg-list-bx .list-bx .column .col-1 .date { width: 100px; margin: 0 10px 0 0; color: #798388; font-size: 0.8em; text-align: center; letter-spacing: 0.1em; background-color: #ffd900;}
    .main-content .rg-list-bx .list-bx .column .col-1 .text { width: calc(100% - 110px); color: #798388; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .rg-list-bx .list-bx .column .col-1 .space { width: 100px; margin: 0 10px 0 0; font-size: 0.8em; display: block;}
    .main-content .rg-list-bx .list-bx .column .col-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .rg-list-bx .list-bx .column .col-2 a { color: #798388; text-decoration: none;}
    .main-content .rg-list-bx .list-bx hr { width: 100%; margin: 20px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #higher project intro ********/
    
    .main-content .higher-pj-content { width: 100%; padding: 0 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .higher-pj-content .pic { width: 90%; margin: 0 auto 30px auto; color: #3f3b3a; font-size: 0.9em; letter-spacing: 0.1em; text-align: center;}
    .main-content .higher-pj-content .pic img { width: 100%; height: auto;}
    
    .main-content .higher-pj-content .text { clear: both; width: 100%; color: #3f3b3a; font-size: 0.9em; line-height: 1.8em; letter-spacing: 0.1em;}
    .main-content .higher-pj-content .text font.title { font-size: 1.1em; font-weight: 600;}
    
    
    
    /******** content #higher project framework ********/
    
    .main-content .higher-fw-content { width: 100%; padding: 30px 30px 30px 50px; box-sizing: border-box;}
    
    .main-content .higher-fw-content .content-full { width: 100%; margin: 0 0 30px 0; color: #3f3b3a; font-size: 0.9em; font-weight: normal; letter-spacing: 0.1em;}
    
    .main-content .higher-fw-content .content-img-full { width: 100%; text-align: center;}
    .main-content .higher-fw-content .content-img-full img { max-width: 100%; height: auto;}
    .main-content .higher-fw-content .content-img-text-full { width: 100%; margin: 15px 0 30px 0; color: #3f3b3a; font-size: 0.9em; font-weight: normal; text-align: center; letter-spacing: 0.1em;}
    
    
    
    /******** content #higher project result ********/
    
    .main-content .higher-rs-content { width: 100%; padding: 30px 30px 30px 50px; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    
    .main-content .higher-rs-content .higher-rs-ebook-bx { width: calc(100% / 2 - 30px); margin: 15px; background-color: #fff; -moz-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); -webkit-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); box-sizing: border-box; position: relative;}
    .main-content .higher-rs-content .higher-rs-ebook-bx a { width: 100%; padding: 30px 0; box-sizing: border-box; text-decoration: none; display: block;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-title { width: 100%; margin: 0 0 30px 0;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-title span { padding: 5px 15px; color: #414141; font-size: 0.9em; background-color: #ffd900;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-pic { clear: both; width: 100%; text-align: center;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-pic img.ebook { width: 80%; height: auto;}
    .main-content .higher-rs-content .over-mask { width: 100%; height: 100%; padding: 0 0 80px 0; color: #fff; font-size: 1.2em; font-weight: 500; background-color: rgba(0,0,0,0.4); box-sizing: border-box; display: none; justify-content: center; align-items: flex-end; position: absolute; top: 0; left: 0; z-index: 99;}
    
    .main-content #ebook-content { width: 96%; border-radius: 10px; background-color: #fff; -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-sizing: border-box; position: absolute; top: -200px; left: 10px; z-index: 9999; display: none;}
    .main-content #ebook-content .close-bar { width: 100%; padding: 5px 20px; color: #475055; font-size: 2em; text-align: right; border-bottom: 1px #cdcfce solid; box-sizing: border-box;}
    .main-content #ebook-content .close-bar .icon-colse { width: 50px; cursor: pointer; float: right;}
    .main-content #ebook-content .content-bx { width: 100%; padding: 30px 50px; color: #3E3A39; letter-spacing: 0.1em; box-sizing: border-box;}
    .main-content #ebook-content .content-bx .source-date { font-size: 0.8em;}
    .main-content #ebook-content .content-bx .source-date span { padding: 2px 10px; color: #555e60; text-align: center; background-color: #ffd900;}
    .main-content #ebook-content .content-bx .title { clear: both; width: 100%; padding: 20px 0; font-size: 1.2em; font-size: 600;}
    .main-content #ebook-content .content-bx .content { width: 100%; padding: 0 30px; font-size: 0.9em; line-height: 1.8em; box-sizing: border-box;}
    .main-content #ebook-content .content-bx .content img { width: 100%; height: auto;}
    .main-content #ebook-content .content-bx .content iframe.iframe-ebook { width: 100%; height: 800px; border: 0;}
    
    
    
    /******** content #center strategic ********/
    
    .main-content .center-strategic-content { width: 100%; padding: 30px 30px 30px 50px; color: #3f3b3a; letter-spacing: 0.1em; box-sizing: border-box;}
    
    .main-content .center-strategic-content .text-1 { width: 100%; margin: 0 0 15px 0; font-size: 1.2em; font-weight: 600;}
    
    .main-content .center-strategic-content img { max-width: 100%; height: auto;}
    
    
    
    /******** error 404 ********/
    
    .error-bx { clear: both; width: 100%; padding: 50px 0; background-color: #ffd900; display: flex; justify-content: center; align-items: center;}
    .error-bx .pic { width: 45%;}
    .error-bx .pic img { width: 100%; height: auto;}
    .error-bx .text { width: 45%; padding: 0 0 0 40px; box-sizing: border-box;}
    .error-bx .text font.text1 { color: #3f3b3a; font-size: 3.4em; line-height: 1em; font-weight: 600;}
    .error-bx .text font.text2 { color: #004256; font-size: 3.4em; font-weight: 200;}
    .error-bx .text font.text3 { color: #004256; font-size: 1.6em; line-height: 1em; font-weight: 200;}
    .error-bx .text font.text4 { color: #004256; font-size: 2.4em; font-weight: 500;}
    .error-bx .text .goback-bt { clear: both; width: 80%; height: 39px; margin: 30px 0 0 0; color: #fff; font-size: 0.9em; font-weight: 600; text-align: center; border-radius: 6px; background-image: url("../images/error_bt_bg.png"); background-repeat: repeat-x; overflow: hidden;}
    .error-bx .text .goback-bt a { width: 100%; padding: 8px 0 0 0; color: #fff; text-decoration: none; box-sizing: border-box; display: block;}
    
    .footer-error { width: 96%; margin: 0 auto; display: flex; justify-content: flex-start; align-items: flex-start;}
    .footer-error .column-lt { width: calc(100% - 120px); padding: 30px 0 50px 0; color: #545e64; font-size: 0.8em; line-height: 2em; letter-spacing: 0.1em;}
    .footer-error .column-rt { width: 120px; padding: 30px 0 0 0; display: flex; justify-content: flex-end; align-items: center;}
    
    
    
    /******** site map ********/
    
    .sitemap-content { width: 100%; padding: 90px 60px; box-sizing: border-box;}
    
    .sitemap-content .title { width: 100%; margin: 0 0 40px 0; font-size: 1.2em; font-weight: 600; letter-spacing: 0.1em;}
    
    .sitemap-content .column-bx { width: 100%; padding: 0 0 0 50px; margin: 0; list-style: none; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .sitemap-content .column-bx .column { width: calc(100% / 3);}
    .sitemap-content .column-bx .column ul { width: 100%; padding: 0; margin: 0; list-style: none; display: block;}
    .sitemap-content .column-bx .column ul li { padding: 0; margin: 0 0 30px 0; font-size: 1em; font-weight: 600; letter-spacing: 0.1em;}
    .sitemap-content .column-bx .column ul li a { color: #000; text-decoration: none;}
    .sitemap-content .column-bx .column ul li a:hover { text-decoration: underline;}
    .sitemap-content .column-bx .column ul li ul.snd { width: 100%; padding: 0; margin: 10px 0 0 0; list-style: none; display: block;}
    .sitemap-content .column-bx .column ul li ul.snd li { padding: 0; margin: 0; color: #545e64; font-size: 0.9em; font-weight: normal; letter-spacing: 0.1em;}
    .sitemap-content .column-bx .column ul li ul.snd li a { color: #545e64; text-decoration: none;}
    .sitemap-content .column-bx .column ul li ul.snd li a:hover { text-decoration: underline;}
    
    
    
    /******** site map ********/
    
    .main-content .google-map { width: 100%; padding: 30px; box-sizing: border-box;}
    .main-content .google-map iframe { width: 100%; height: 400px;}
            
    
    
    /******** footer ********/
    
    footer { clear: both; width: 100%; background-image: url("../images/footer_bg_pic.jpg"); background-position: bottom; background-repeat: no-repeat; background-size: cover; background-color: rgba(79,90,96,1); overflow: hidden; position: relative;}
    
    footer .footer-content { width: 100%; padding: 30px 0; margin: 0 auto; color: #fff; font-size: 0.8em; letter-spacing: 0.1em; background-color: rgba(79,90,96,0.9); display: flex; justify-content: center; align-items: stretch;}
    footer .footer-content .left-col { width: calc(96% - 180px);}
    footer .footer-content .left-col .address { width: 100%;}
    footer .footer-content .left-col .footer-menu { width: 100%; margin: 40px 0 0 0;}
    footer .footer-content .left-col .footer-menu a { color: #fff; text-decoration: none;}
    footer .footer-content .left-col .footer-menu a:hover { text-decoration: underline;}
    footer .footer-content .right-col { width: 180px; display: flex; justify-content: flex-start; align-items: stretch;}
    footer .footer-content .right-col .footer-menu { width: 180px;}
    footer .footer-content .right-col .footer-menu ul { width: 100%; padding: 30px 0 0 25px; margin: 0; list-style: disc; display: block; box-sizing: border-box;}
    footer .footer-content .right-col .footer-menu ul li { padding: 0 0 0 10px; margin: 0 0 2px 0;}
    footer .footer-content .right-col .footer-menu ul li a { color: #fff; text-decoration: none;}
    footer .footer-content .right-col .footer-menu ul li a:hover { text-decoration: underline;}
    footer .footer-content .right-col .map-icon { width: 50px; padding: 0 0 10px 0; display: flex; justify-content: center; align-items: flex-end;}
    
    
}


@media screen and (max-width: 767px) {
    
    
    /******** header for mo ********/
    
    header#pc { display: none;}
    
    header#mo { width: 100%;}
        
    header#mo .header-top-bar { width: 100%; padding: 5px; background-color: #5d686e; box-sizing: border-box;}
    
    header#mo .header-top-bar .title-bx { width: 100%;}
    header#mo .header-top-bar .title-bx ul { padding: 0; margin: 0; list-style: none; display: flex; justify-content: center;}
    header#mo .header-top-bar .title-bx ul li { padding: 0; margin: 0 10px;}
    header#mo .header-top-bar .title-bx ul li a { color: #fff; font-size: 0.8em; letter-spacing: 0.2em; text-decoration: none;}
    header#mo .header-top-bar .title-bx ul li a:active { color: #fdd900;}
        
    header#mo .title-nav-bx { width: 100%; margin: 20px 0 0 0; position: relative;}
    
    header#mo .title-nav-bx .sub-title-bx { width: 330px; margin: 0 auto; text-align: center;}
    
    header#mo .title-nav-bx #nav-icon { clear: both; width: 50px; margin: 10px auto; color: #475055; font-size: 3em; cursor: pointer;}
    
    header#mo .title-nav-bx nav#mo { width: 100%; padding: 30px 0; border-top: 1px #909a9f solid; border-bottom: 1px #909a9f solid; background-color: #eee; position: absolute; top: 150px; left: 0; z-index: 999;}
    header#mo .title-nav-bx nav#mo ul { width: 100%; padding: 0; margin: 0; list-style: none; display: block;}
    header#mo .title-nav-bx nav#mo ul li { width: 100%; padding: 0 0 0 20px; margin: 30px 0; line-height: 1.4em; box-sizing: border-box; position: relative;}
    header#mo .title-nav-bx nav#mo ul li a { color: #676664; text-decoration: none; cursor: pointer; display: flex; justify-content: flex-start; align-items: center;}    
    header#mo .title-nav-bx nav#mo ul li a .text { width: calc(100% - 40px); line-height: 1em;}
    header#mo .title-nav-bx nav#mo ul li a .text font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    header#mo .title-nav-bx nav#mo ul li a .text font.en { font-size: 0.8em;}
    header#mo .title-nav-bx nav#mo ul li a .icon-home { width: 40px; height: 23px; background-image: url("../images/nav_icon_home.png"); background-position: left; background-repeat: no-repeat; display: block;}
    header#mo .title-nav-bx nav#mo ul li:active > a .icon-home { background-image: url("../images/nav_icon_home_over.png");}
    header#mo .title-nav-bx nav#mo ul li a .icon-home.sel { background-image: url("../images/nav_icon_home_over.png");}
    header#mo .title-nav-bx nav#mo ul li a .icon-about { width: 40px; height: 27px; background-image: url("../images/nav_icon_about.png"); background-position: left; background-repeat: no-repeat; display: block;}
    header#mo .title-nav-bx nav#mo ul li:active > a .icon-about { background-image: url("../images/nav_icon_about_over.png");}
    header#mo .title-nav-bx nav#mo ul li a .icon-about.sel { background-image: url("../images/nav_icon_about_over.png");}
    header#mo .title-nav-bx nav#mo ul li a .icon-infor { width: 40px; height: 24px; background-image: url("../images/nav_icon_infor.png"); background-position: left; background-repeat: no-repeat; display: block;}
    header#mo .title-nav-bx nav#mo ul li:active > a .icon-infor { background-image: url("../images/nav_icon_infor_over.png");}
    header#mo .title-nav-bx nav#mo ul li a .icon-infor.sel { background-image: url("../images/nav_icon_infor_over.png");}
    header#mo .title-nav-bx nav#mo ul li a .icon-regu { width: 40px; height: 28px; background-image: url("../images/nav_icon_regulation.png"); background-position: left; background-repeat: no-repeat; display: block;}
    header#mo .title-nav-bx nav#mo ul li:active > a .icon-regu { background-image: url("../images/nav_icon_regulation_over.png");}
    header#mo .title-nav-bx nav#mo ul li a .icon-regu.sel { background-image: url("../images/nav_icon_regulation_over.png");}
    header#mo .title-nav-bx nav#mo ul li a .icon-dw { width: 40px; height: 26px; background-image: url("../images/nav_icon_download.png"); background-position: left; background-repeat: no-repeat; display: block;}
    header#mo .title-nav-bx nav#mo ul li:active > a .icon-dw { background-image: url("../images/nav_icon_download_over.png");}
    header#mo .title-nav-bx nav#mo ul li a .icon-dw.sel { background-image: url("../images/nav_icon_download_over.png");}
    header#mo .title-nav-bx nav#mo ul li a .icon-manage { width: 40px; height: 23px; background-image: url("../images/nav_icon_mag_sys.png"); background-position: left; background-repeat: no-repeat; display: block;}
    header#mo .title-nav-bx nav#mo ul li:active > a .icon-manage { background-image: url("../images/nav_icon_mag_sys_over.png");}
    header#mo .title-nav-bx nav#mo ul li a .icon-manage.sel { background-image: url("../images/nav_icon_mag_sys_over.png");}    
    
    header#mo .title-nav-bx nav#mo ul li ul.popup { width: calc(100% - 20px); padding: 0; margin: 20px 0 0 0; list-style: none; display: block;}
    header#mo .title-nav-bx nav#mo ul li ul.popup li { width: 100%; padding: 0; margin: 0; text-align: left; letter-spacing: 0.1em;}
    header#mo .title-nav-bx nav#mo ul li ul.popup li a { width: 100%; padding: 20px; color: #fff; text-decoration: none; background-color: rgba(79,89,95,0.8); display: flex; justify-content: flex-start; align-items: center; box-sizing: border-box;}
    header#mo .title-nav-bx nav#mo ul li ul.popup li a:active { background-color: rgba(79,89,95,1)}
    header#mo .title-nav-bx nav#mo ul li ul.popup li a .checked { width: 25px;}
    header#mo .title-nav-bx nav#mo ul li ul.popup li a .text { width: calc(100% - 25px);}
    
    header#mo .title-nav-bx nav#mo .search-bx { width: 90%; margin: 40px auto 20px auto; display: flex; justify-content: flex-start; align-items: center; background-color: #eee;}
    header#mo .title-nav-bx nav#mo .search-bx input[type=search] { width: calc(100% - 50px); padding: 10px; color: #000; font: 1em "Noto Sans TC", sans-serif, "微軟正黑體", Arial; box-sizing: border-box; border: 1px #a1a5a6 solid; background-color: #fff;}
    header#mo .title-nav-bx nav#mo .search-bx input[type=button] { width: 50px; height: 31px; box-sizing: border-box; border: 0; background-color: #eee; background-image: url("../images/search_icon.png"); background-position: right; background-repeat: no-repeat; cursor: pointer;}
        
    
    
    /******** banner ********/
    
    .banner-text-full { width: 100%;}
    
    .banner-text-full .banner-bx { width: 100%; height: 26vw; overflow: hidden; position: relative;}
    .banner-text-full .banner-bx ul li a { text-decoration: none; display: block;}
    .banner-text-full .banner-bx ul li .pic { width: 100%; position: absolute; top: 0; left: 0; z-index: 5;}
    .banner-text-full .banner-bx ul li .pic img { width: 100%; height: auto;}
    .banner-text-full .banner-bx ul li .bg-sq { width: 41vw; text-align: right; position: absolute; top: -3.1vw; right: 0; z-index: 10;}
    .banner-text-full .banner-bx ul li .bg-sq img { width: 100%; height: auto;}    
    .banner-text-full .banner-bx ul li .text-bx { display: none;}
    
    
    
    /******** section ********/
    
    section { width: 100%; margin: 0 auto;}
    
    
    
    /******** aside ********/
    
    aside { clear: both; width: 100%; padding: 0; margin: 0; border-bottom: 2px #909a9f solid;}
        
    aside .menu-bx { width: 100%; padding: 25px 0 0 0; margin: 0; background-color: #fdd900;}
    aside .menu-bx .aside-icon { width: 100%; padding: 0 0 25px 0; display: flex; justify-content: center; align-items: center;}
    aside .menu-bx .aside-icon img { margin: 0 20px;}
    aside .menu-bx dl#panel { width: 100%; padding: 0 0 25px 0; border-top: 1px #fff solid; display: none;}
    aside .menu-bx dl#panel dt { width: 100%; padding: 20px 0 20px 30px; font-size: 1.1em; letter-spacing: 0.1em; display: flex; justify-content: flex-start; align-items: center; border-bottom: 1px #fff solid; box-sizing: border-box; cursor: pointer;}
    aside .menu-bx dl#panel dt:hover { background-color: #ffe35e;}
    aside .menu-bx dl#panel dt.sel { background-color: #ffe35e;}
    aside .menu-bx dl#panel dt .icon { width: 70px}
    aside .menu-bx dl#panel dt .text { width: calc(100% - 70px); color: #363531; font-size: 1.1em; line-height: 1em;}
    aside .menu-bx dl#panel dt .text font.en { font-size: 0.6em; line-height: 1em; letter-spacing: normal;}
    aside .menu-bx dl#panel dd { width: 100%; padding: 0; margin: 0; border-bottom: 1px #fff solid; box-sizing: border-box;}
    aside .menu-bx dl#panel dd ul { width: calc(100% - 30px); padding: 0; margin: 0; list-style: none; display: block; float: right;}
    aside .menu-bx dl#panel dd ul li { width: 100%; padding: 0; margin: 0;}
    aside .menu-bx dl#panel dd ul li a { width: 100%; padding: 10px; margin: 0; color: #fff; font-size: 0.9em; text-decoration: none; border-bottom: 1px #fff solid; background-color: #6e756b; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: center;}
    aside .menu-bx dl#panel dd ul li a:hover { background-color: #50595c;}
    aside .menu-bx dl#panel dd ul li a .checked { width: 30px;}
    aside .menu-bx dl#panel dd ul li a .text { width: calc(100% - 30px);}
    aside .menu-bx dl#panel dd ul li:last-child a { border: 0;}
    
    aside .data-num-bx { width: 100%; padding: 20px; color: #585757; font-size: 0.8em; letter-spacing: 0.1em; box-sizing: border-box;}
    aside .data-num-bx font.num { font-size: 1.6em; font-weight: 500;}
    
    
    
    /******** content #hp ********/
    
    .main-content { width: 96%; padding: 30px 0; margin: 0 auto; box-sizing: border-box; position: relative;}
    
    .main-content .hp-menu { width: 100%; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start;}
    .main-content .hp-menu .icon { width: 50px;}
    .main-content .hp-menu .news-tabs-bx { width: calc(100% - 50px);}
    .main-content .hp-menu .news-tabs-bx ul { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .main-content .hp-menu .news-tabs-bx ul li { width: calc(100% / 3 - 20px); padding: 0; margin: 5px 10px; line-height: 1em; text-align: center;}
    .main-content .hp-menu .news-tabs-bx ul li a { width: 100%; padding: 5px 0; color: #545e64; text-decoration: none; border-bottom: 5px #fbfaf6 solid; box-sizing: border-box; display: block;}
    .main-content .hp-menu .news-tabs-bx ul li a:hover { border-bottom: 5px #6a7277 solid; box-sizing: border-box;}
    .main-content .hp-menu .news-tabs-bx ul li a.sel { border-bottom: 5px #485157 solid; box-sizing: border-box;}
    .main-content .hp-menu .news-tabs-bx ul li a font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .hp-menu .news-tabs-bx ul li a font.en { font-size: 0.6em;}
    .main-content .news-list-bx { width: 100%; padding: 30px 20px; box-sizing: border-box;}
    .main-content .news-list-bx .list-bx { clear: both; width: 100%; padding: 0 0 15px 0;}
    .main-content .news-list-bx .list-bx .date { width: 100px; padding: 5px 0; margin: 0 20px 10px 0; color: #485157; font-size: 0.8em; font-weight: 500; line-height: 1em; text-align: center; background-color: #ffd900;}
    .main-content .news-list-bx .list-bx .title { width: 100%; font-size: 0.9em; letter-spacing: 0.1em;}
    .main-content .news-list-bx .list-bx .title a { color: #485157; text-decoration: none;}
    .main-content .news-list-bx .list-bx .title a:hover { text-decoration: underline;}
    .main-content .news-list-bx .more { clear: both; width: 100%; padding: 20px 20px 0 0; box-sizing: border-box; text-align: right;}
    .main-content .news-list-bx .more a { color: #485157; font-size: 0.9em; text-decoration: none;}
    .main-content .news-list-bx .more a:active { text-decoration: underline;}
    
    .main-content .hp-title { width: 100%; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start; position: relative;}
    .main-content .hp-title .icon { width: 50px;}
    .main-content .hp-title .title { width: calc(100% - 50px); padding: 10px 0 0 0; color: #545e64; font-size: 1.1em; line-height: 1em; letter-spacing: 0.1em;}
    .main-content .hp-title .more { width: 40px; font-size: 0.9em; text-align: right; position: absolute; top: 20px; right: 10px;}
    .main-content .hp-title .more a { color: #414141; text-decoration: none;}
    .main-content .hp-title .more a:active { text-decoration: underline;}
    
    .main-content ul#spot-list-bx { clear: both; width: 100%; padding: 0; margin: 0 0 30px 0; list-style: none; display: block;}
    .main-content ul#spot-list-bx li { width: calc(100% - 20px); margin: 20px 10px; background-color: #fff; position: relative;}
    .main-content ul#spot-list-bx li:hover { -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5);}
    .main-content ul#spot-list-bx li a { width: 100%; text-decoration: none; display: block;}
    .main-content ul#spot-list-bx li .pic { width: 100%;}
    .main-content ul#spot-list-bx li .pic img.v { width: 100%; height: auto;}
    .main-content ul#spot-list-bx li .pic img.h { width: 100%; height: auto;}
    .main-content ul#spot-list-bx li .text { width: 100%; padding: 15px; margin: 0 0 20px 0; line-height: 1.2em; box-sizing: border-box; background-color: #fff;}
    .main-content ul#spot-list-bx li .text font.sub-date { padding: 2px 10px; color: #555e60; font-size: 0.8em; background-color: #ffd900;}
    .main-content ul#spot-list-bx li .text .title { clear: both; width: 100%; margin: 15px 0 10px 0; color: #555e60; font-size: 1.1em; letter-spacing: 0.1em; font-weight: 500;}
    .main-content ul#spot-list-bx li .text .intro { width: 100%; color: #555e60; font-size: 0.8em; letter-spacing: 0.1em;}    
    .main-content ul#spot-list-bx li .more { clear: both; width: calc(100% - 30px); padding: 0 0 20px 0; color: #555e60; font-size: 0.8em; text-align: right;}
    
    .main-content #spot-news { width: 96%; border-radius: 10px; background-color: #fff; -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-sizing: border-box; position: absolute; top: -150px; left: 10px; z-index: 9999; display: none;}
    .main-content #spot-news .close-bar { width: 100%; padding: 5px 20px; color: #475055; font-size: 2em; text-align: right; border-bottom: 1px #cdcfce solid; box-sizing: border-box;}
    .main-content #spot-news .close-bar .icon-colse { width: 50px; cursor: pointer; float: right;}
    .main-content #spot-news .content-bx { width: 100%; padding: 10px 30px; color: #3E3A39; letter-spacing: 0.1em; box-sizing: border-box;}
    .main-content #spot-news .content-bx .source-date { width: 100%; font-size: 0.8em;}
    .main-content #spot-news .content-bx .source-date .date { padding: 2px 10px; color: #555e60; text-align: center; background-color: #ffd900;}
    .main-content #spot-news .content-bx .source-date .source { clear: both; width: 100%; margin: 10px 0 0 0;}
    .main-content #spot-news .content-bx .title { clear: both; width: 100%; padding: 20px 0; font-size: 1.2em; font-size: 600;}
    .main-content #spot-news .content-bx .content { width: 100%; font-size: 0.9em; line-height: 1.8em; box-sizing: border-box;}
    .main-content #spot-news .content-bx .content a { color: #3E3A39; border-bottom: 1px #666 dashed; text-decoration: none;}
    .main-content #spot-news .content-bx .content .photo-bx { width: calc(100% - 20px); margin: 0 10px 20px 10px;}
    .main-content #spot-news .content-bx .content .photo-bx .pic { width: 100%;}
    .main-content #spot-news .content-bx .content .photo-bx .pic img { width: 100%; height: auto;}
    .main-content #spot-news .content-bx .content .photo-bx .text { width: 100%; padding: 5px 0 20px 0; font-size: 0.9em; line-height: 1.4em; text-align: center;}
    
    .main-content ul.qk-link-bx { width: 96%; padding: 0; margin: 20px auto; list-style: none; display: flex; justify-content: center; align-items: stretch;}
    .main-content ul.qk-link-bx li { width: calc(100% / 3); padding: 0; margin: 0;}
    .main-content ul.qk-link-bx li .icon-bx { width: 85px; height: 85px; margin: 0 auto; border-radius: 100%; border: 2px #485157 solid; display: flex; justify-content: center; align-items: center;}
    .main-content ul.qk-link-bx li .text-1 { clear: both; width: 90%; margin: 5px auto; color: #485157; letter-spacing: 0.1em; font-weight: 500; line-height: 1em; text-align: center;}
    .main-content ul.qk-link-bx li .text-2 { clear: both; width: 90%; margin: 0 auto; color: #000; font-size: 0.8em; letter-spacing: 0.1em; line-height: 2em; text-align: center;}
    .main-content ul.qk-link-bx li .text-2 a { color: #485157; text-decoration: none;}
    .main-content ul.qk-link-bx li .text-2 a:hover { text-decoration: underline;}
    
    
    
    /******** content #news content ********/
    
    .main-content .breadcrumb-bx { width: 100%; margin: 0 0 30px 0; color: #231815; font-size: 0.9em; letter-spacing: 0.1em;}
    .main-content .breadcrumb-bx a { color: #231815; text-decoration: none;}
    .main-content .breadcrumb-bx a:hover { text-decoration: underline;}
    
    .main-content .news-content-bx { width: 100%; padding: 20px; word-break: break-all; box-sizing: border-box;}
    .main-content .news-content-bx .title { width: 100%; margin: 0 0 20px 0; color: #231815; font-size: 1.2em; font-weight: 600; letter-spacing: 0.1em;}
    .main-content .news-content-bx .content { width: 100%; color: #231815; font-size: 0.9em; line-height: 1.8em; letter-spacing: 0.1em;}
    .main-content .news-content-bx .content a { color: #231815; text-decoration: none;}
    .main-content .news-content-bx .content a:hover { text-decoration: underline;}
    
    ul.bignum { padding: 0 0 0 30px; margin: 0; box-sizing: border-box; list-style-type: cjk-ideographic; display: block;}
    ul.bignum li { padding: 0; margin: 0;}
    
    .main-content .gotop { clear: both; width: 60px; margin: 30px 0 0 0; color: #332c2a; float: right; cursor: pointer;}
    
    
    
    /******** content #member intro ********/
    
    .main-content .page-menu { width: 100%; margin: 0 0 30px 0; border-bottom: 1px #768186 solid; display: flex; justify-content: flex-start;}
    .main-content .page-menu .icon { width: 50px;}
    .main-content .page-menu .menu-tabs-bx { width: calc(100% - 50px);}
    .main-content .page-menu .menu-tabs-bx ul { width: 100%; padding: 0; margin: 0; list-style: none; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .main-content .page-menu .menu-tabs-bx ul li { width: 80px; padding: 0; margin: 0 10px; line-height: 1em; text-align: center;}
    .main-content .page-menu .menu-tabs-bx ul li a { width: 100%; padding: 5px 0; color: #545e64; text-decoration: none; border-bottom: 5px #fbfaf6 solid; box-sizing: border-box; display: block;}
    .main-content .page-menu .menu-tabs-bx ul li a:hover { border-bottom: 5px #6a7277 solid; box-sizing: border-box;}
    .main-content .page-menu .menu-tabs-bx ul li a.sel { border-bottom: 5px #485157 solid; box-sizing: border-box;}
    .main-content .page-menu .menu-tabs-bx ul li a font.ch { font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .page-menu .menu-tabs-bx ul li a font.en { font-size: 0.6em;}
    
    .main-content .mem-list-bx { clear: both; width: 90%; margin: 0 auto; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    .main-content .mem-list-bx .mem-bx { clear: both; width: calc(100% - 20px); margin: 10px; position: relative;}
    .main-content .mem-list-bx .mem-bx .pic { width: 145px; height: 145px; margin: 0 auto; border-radius: 100%; border: 5px #fff solid; background-color: #efefef; box-sizing: border-box; display: flex; justify-content: center; align-items: center; overflow: hidden; -moz-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); position: absolute; top: 0; left: calc(50% - 72px); z-index: 99;}
    .main-content .mem-list-bx .mem-bx .pic img { width: auto; height: 100%;}
    .main-content .mem-list-bx .mem-bx .box { width: 100%; padding: 140px 20px 20px 20px; margin: 30px 0 0 0; border: 1px #e9e9e7 solid; background-color: #fff; box-sizing: border-box; z-index: 9;}
    .main-content .mem-list-bx .mem-bx .box .name { width: 100%; color: #485157; font-size: 0.9em; font-weight: 500; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .title-1 { width: 100%; color: #0081a3; font-size: 0.8em; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .title-2 { width: 100%; color: #342e2c; font-size: 0.8em; text-align: center; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .job { width: 100%; color: #342e2c; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box .contact { width: 100%; color: #342e2c; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mem-list-bx .mem-bx .box hr { width: 100%; margin: 15px 0; border: 1px #d8d8d9 solid;}
    
    .main-content .title-line { clear: both; width: 90%; margin: 30px auto; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .title-line .title-1 { width: 80px; color: #545e64; font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .title-line .line-1 { width: calc(100% - 80px);}
    .main-content .title-line .title-2 { width: 220px; color: #545e64; font-size: 1.1em; letter-spacing: 0.1em;}
    .main-content .title-line .line-2 { width: calc(100% - 220px);}
    .main-content .title-line .line-1 hr, .line-2 hr { width: 100%; margin: 15px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #meeting list ********/
    
    .main-content .mt-list-bx { width: 100%; padding: 0 20px 30px 20px; box-sizing: border-box;}
    
    .main-content .mt-list-bx .title-bx { width: 100%;}
    .main-content .mt-list-bx .title-bx .icon { width: 35px; float: left;}
    .main-content .mt-list-bx .title-bx .text { width: 160px; color: #798388; font-size: 1.1em; font-weight: 500; letter-spacing: 0.1em; float: left;}
    .main-content .mt-list-bx .title-bx .year { clear: both; width: 100%; color: #798388; font-size: 1em; text-align: right;}
    .main-content .mt-list-bx .title-bx .year a { color: #798388; text-decoration: none;}
    .main-content .mt-list-bx .title-bx .year a.sel { text-decoration: underline;}
    
    .main-content .mt-list-bx .list-bx { clear: both; width: 100%; margin: 30px 0;}
    .main-content .mt-list-bx .list-bx .caption { width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .mt-list-bx .list-bx .caption .cap-1 { width: calc(100% - 40px); color: #798388; font-size: 0.9em; font-weight: 600; letter-spacing: 0.1em; display: flex; align-items: center;}
    .main-content .mt-list-bx .list-bx .caption .cap-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .list-bx .column { clear: both; width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .mt-list-bx .list-bx .column .col-1 { width: calc(100% - 40px);}
    .main-content .mt-list-bx .list-bx .column .col-1 .date { width: 100px; margin: 0 10px 0 0; color: #798388; font-size: 0.8em; text-align: center; letter-spacing: 0.1em; background-color: #ffd900;}
    .main-content .mt-list-bx .list-bx .column .col-1 .text { clear: both; width: 100%; color: #798388; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .mt-list-bx .list-bx .column .col-1 .space { width: 100px; margin: 0 10px 0 0; font-size: 0.8em; display: block;}
    .main-content .mt-list-bx .list-bx .column .col-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em; display: flex; justify-content: center; align-items: flex-end;}
    .main-content .mt-list-bx .list-bx .column .col-2 a { color: #798388; text-decoration: none;}
    .main-content .mt-list-bx .list-bx hr { width: 100%; margin: 20px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #regulation list ********/
    
    .main-content .rg-list-bx { width: 100%; padding: 0 20px 30px 20px; box-sizing: border-box;}
    
    .main-content .rg-list-bx .title-bx { width: 100%; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .rg-list-bx .title-bx .icon { width: 50px;}
    .main-content .rg-list-bx .title-bx .text { width: calc(100% - 50px); color: #798388; font-size: 1.1em; font-weight: 500; letter-spacing: 0.1em;}
    
    .main-content .rg-list-bx .list-bx { clear: both; width: 100%; margin: 30px 0;}
    .main-content .rg-list-bx .list-bx .caption { width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: center;}
    .main-content .rg-list-bx .list-bx .caption .cap-1 { width: calc(100% - 40px); color: #798388; font-size: 0.9em; font-weight: 600; letter-spacing: 0.1em; display: flex; align-items: center;}
    .main-content .rg-list-bx .list-bx .caption .cap-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em;}
    .main-content .rg-list-bx .list-bx .column { clear: both; width: 100%; margin: 0 0 15px 0; display: flex; justify-content: flex-start; align-items: stretch;}
    .main-content .rg-list-bx .list-bx .column .col-1 { width: calc(100% - 40px);}
    .main-content .rg-list-bx .list-bx .column .col-1 .date { width: 100px; margin: 0 10px 0 0; color: #798388; font-size: 0.8em; text-align: center; letter-spacing: 0.1em; background-color: #ffd900;}
    .main-content .rg-list-bx .list-bx .column .col-1 .text { clear: both; width: 100%; color: #798388; font-size: 0.8em; letter-spacing: 0.1em;}
    .main-content .rg-list-bx .list-bx .column .col-1 .space { width: 100px; margin: 0 10px 0 0; font-size: 0.8em; display: block;}
    .main-content .rg-list-bx .list-bx .column .col-2 { width: 40px; color: #798388; font-size: 0.9em; font-weight: 600; text-align: center; letter-spacing: 0.1em; display: flex; justify-content: center; align-items: flex-end;}
    .main-content .rg-list-bx .list-bx .column .col-2 a { color: #798388; text-decoration: none;}
    .main-content .rg-list-bx .list-bx hr { width: 100%; margin: 20px 0; border: 1px #d8d8d9 solid;}
    
    
    
    /******** content #higher project intro ********/
    
    .main-content .higher-pj-content { width: 100%; padding: 0 20px 30px 20px; box-sizing: border-box;}
    
    .main-content .higher-pj-content .pic { width: 100%; margin: 0 auto 30px auto; color: #3f3b3a; font-size: 0.9em; letter-spacing: 0.1em; text-align: center;}
    .main-content .higher-pj-content .pic img { width: 100%; height: auto;}
    
    .main-content .higher-pj-content .text { clear: both; width: 100%; color: #3f3b3a; font-size: 0.9em; line-height: 1.8em; letter-spacing: 0.1em;}
    .main-content .higher-pj-content .text font.title { font-size: 1.1em; font-weight: 600;}
    
    
    
    /******** content #higher project framework ********/
    
    .main-content .higher-fw-content { width: 100%; padding: 30px 20px 30px 20px; box-sizing: border-box;}
    
    .main-content .higher-fw-content .content-full { width: 100%; margin: 0 0 30px 0; color: #3f3b3a; font-size: 0.9em; font-weight: normal; letter-spacing: 0.1em;}
    
    .main-content .higher-fw-content .content-img-full { width: 100%; text-align: center;}
    .main-content .higher-fw-content .content-img-full img { max-width: 100%; height: auto;}
    .main-content .higher-fw-content .content-img-text-full { width: 100%; margin: 15px 0 30px 0; color: #3f3b3a; font-size: 0.9em; font-weight: normal; text-align: center; letter-spacing: 0.1em;}
    
    
    
    /******** content #higher project result ********/
    
    .main-content .higher-rs-content { width: 100%; padding: 30px 20px 30px 20px; box-sizing: border-box; display: flex; justify-content: flex-start; align-items: stretch; flex-wrap: wrap;}
    
    .main-content .higher-rs-content .higher-rs-ebook-bx { width: calc(100% - 30px); margin: 15px; background-color: #fff; -moz-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); -webkit-box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); box-shadow:4px 4px 3px rgba(20%,20%,40%,0.3); box-sizing: border-box; position: relative;}
    .main-content .higher-rs-content .higher-rs-ebook-bx a { width: 100%; padding: 30px 0; box-sizing: border-box; text-decoration: none; display: block;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-title { width: 100%; margin: 0 0 30px 0;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-title span { padding: 5px 15px; color: #414141; font-size: 0.9em; background-color: #ffd900;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-pic { clear: both; width: 100%; text-align: center;}
    .main-content .higher-rs-content .higher-rs-ebook-bx .ebook-pic img.ebook { width: 80%; height: auto;}
    .main-content .higher-rs-content .over-mask { width: 100%; height: 100%; padding: 0 0 80px 0; color: #fff; font-size: 1.2em; font-weight: 500; background-color: rgba(0,0,0,0.4); box-sizing: border-box; display: none; justify-content: center; align-items: flex-end; position: absolute; top: 0; left: 0; z-index: 99;}
    
    .main-content #ebook-content { width: 96%; border-radius: 10px; background-color: #fff; -webkit-box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-shadow:4px 4px 12px -2px rgba(20%,20%,40%,0.5); box-sizing: border-box; position: absolute; top: -150px; left: 10px; z-index: 9999; display: none;}
    .main-content #ebook-content .close-bar { width: 100%; padding: 5px 20px; color: #475055; font-size: 2em; text-align: right; border-bottom: 1px #cdcfce solid; box-sizing: border-box;}
    .main-content #ebook-content .close-bar .icon-colse { width: 50px; cursor: pointer; float: right;}
    .main-content #ebook-content .content-bx { width: 100%; padding: 30px 10px; color: #3E3A39; letter-spacing: 0.1em; box-sizing: border-box;}
    .main-content #ebook-content .content-bx .source-date { font-size: 0.8em;}
    .main-content #ebook-content .content-bx .source-date span { padding: 2px 10px; color: #555e60; text-align: center; background-color: #ffd900;}
    .main-content #ebook-content .content-bx .title { clear: both; width: 100%; padding: 20px 0; font-size: 1.2em; font-size: 600;}
    .main-content #ebook-content .content-bx .content { width: 100%; padding: 0; font-size: 0.9em; line-height: 1.8em; box-sizing: border-box;}
    .main-content #ebook-content .content-bx .content img { width: 100%; height: auto;}
    .main-content #ebook-content .content-bx .content iframe.iframe-ebook { width: 100%; height: 600px; border: 0;}
    
    
    
    /******** content #center strategic ********/
    
    .main-content .center-strategic-content { width: 100%; padding: 30px 20px 30px 20px; color: #3f3b3a; letter-spacing: 0.1em; box-sizing: border-box;}
    
    .main-content .center-strategic-content .text-1 { width: 100%; margin: 0 0 15px 0; font-size: 1.2em; font-weight: 600;}
    
    .main-content .center-strategic-content img { max-width: 100%; height: auto;}
    
    
    
    /******** error 404 ********/
    
    .error-bx { clear: both; width: 100%; padding: 50px 0; background-color: #ffd900;}
    .error-bx .pic { width: 90%; margin: 0 auto 30px auto;}
    .error-bx .pic img { width: 100%; height: auto;}
    .error-bx .text { clear: both; width: 80%; padding: 0; margin: 0 auto; box-sizing: border-box;}
    .error-bx .text font.text1 { color: #3f3b3a; font-size: 3.4em; line-height: 1em; font-weight: 600;}
    .error-bx .text font.text2 { color: #004256; font-size: 3.4em; font-weight: 200;}
    .error-bx .text font.text3 { color: #004256; font-size: 1.6em; line-height: 1em; font-weight: 200;}
    .error-bx .text font.text4 { color: #004256; font-size: 2.4em; font-weight: 500;}
    .error-bx .text .goback-bt { clear: both; width: 100%; height: 39px; margin: 30px 0 0 0; color: #fff; font-size: 0.9em; font-weight: 600; text-align: center; border-radius: 6px; background-image: url("../images/error_bt_bg.png"); background-repeat: repeat-x; overflow: hidden;}
    .error-bx .text .goback-bt a { width: 100%; padding: 8px 0 0 0; color: #fff; text-decoration: none; box-sizing: border-box; display: block;}
    
    .footer-error { width: 96%; padding: 30px 0 50px 0; margin: 0 auto;}
    .footer-error .column-lt { width: 100%; margin: 0 0 20px 0; color: #545e64; font-size: 0.8em; line-height: 2em; letter-spacing: 0.1em;}
    .footer-error .column-rt { width: 100%; text-align: center;}
    
    
    
    /******** site map ********/
    
    .sitemap-content { width: 100%; padding: 90px 40px; box-sizing: border-box;}
    
    .sitemap-content .title { width: 100%; margin: 0 0 40px 0; font-size: 1.2em; font-weight: 600; letter-spacing: 0.1em;}
    
    .sitemap-content .column-bx { width: 100%; padding: 0 0 0 30px; margin: 0; list-style: none; box-sizing: border-box;}
    .sitemap-content .column-bx .column { width: 100%;}
    .sitemap-content .column-bx .column ul { width: 100%; padding: 0; margin: 0; list-style: none; display: block;}
    .sitemap-content .column-bx .column ul li { padding: 0; margin: 0 0 30px 0; font-size: 1em; font-weight: 600; letter-spacing: 0.1em;}
    .sitemap-content .column-bx .column ul li a { color: #000; text-decoration: none;}
    .sitemap-content .column-bx .column ul li a:hover { text-decoration: underline;}
    .sitemap-content .column-bx .column ul li ul.snd { width: 100%; padding: 0; margin: 10px 0 0 0; list-style: none; display: block;}
    .sitemap-content .column-bx .column ul li ul.snd li { padding: 0; margin: 0; color: #545e64; font-size: 0.9em; font-weight: normal; letter-spacing: 0.1em;}
    .sitemap-content .column-bx .column ul li ul.snd li a { color: #545e64; text-decoration: none;}
    .sitemap-content .column-bx .column ul li ul.snd li a:hover { text-decoration: underline;}
    
    
    
    /******** site map ********/
    
    .main-content .google-map { width: 100%; padding: 20px; box-sizing: border-box;}
    .main-content .google-map iframe { width: 100%; height: 400px;}
            
    
    
    /******** footer ********/
    
    footer { clear: both; width: 100%; background-image: url("../images/footer_bg_pic.jpg"); background-position: bottom; background-repeat: no-repeat; background-size: cover; background-color: rgba(79,90,96,1); overflow: hidden; position: relative;}
    
    footer .footer-content { width: 100%; padding: 30px 0; margin: 0 auto; color: #fff; font-size: 0.8em; letter-spacing: 0.1em; background-color: rgba(79,90,96,0.9);}
    footer .footer-content .left-col { width: 96%; margin: 0 auto;}
    footer .footer-content .left-col .address { width: 100%;}
    footer .footer-content .left-col .footer-menu { width: 100%; margin: 40px 0 0 0; line-height: 2em;}
    footer .footer-content .left-col .footer-menu a { color: #fff; text-decoration: none;}
    footer .footer-content .left-col .footer-menu a:hover { text-decoration: underline;}
    footer .footer-content .right-col { width: 96%; margin: 0 auto; display: flex; justify-content: space-between; align-items: stretch;}
    footer .footer-content .right-col .footer-menu { width: 180px;}
    footer .footer-content .right-col .footer-menu ul { width: 100%; padding: 30px 0 0 30px; margin: 0; list-style: disc; display: block; box-sizing: border-box;}
    footer .footer-content .right-col .footer-menu ul li { padding: 0 0 0 10px; margin: 0 0 2px 0;}
    footer .footer-content .right-col .footer-menu ul li a { color: #fff; text-decoration: none;}
    footer .footer-content .right-col .footer-menu ul li a:hover { text-decoration: underline;}
    footer .footer-content .right-col .map-icon { width: 50px; padding: 0 0 10px 0; display: flex; justify-content: center; align-items: flex-end;}
       
    
}
