@charset "utf-8";

@import "../initial";
.svg-inline--fa {
    width: 1em;
}
@media screen and (max-width: 767px) {
    .photo-bx {
        width: calc(100% - 20px);
        margin: 0 10px 20px 10px;
    }
}
@media screen and (min-width: 768px) and (max-width: 1023px) {
    .photo-bx {
        width: calc(50% - 20px);
        margin: 0 10px 20px 10px;
        float: left;
    }
}
@media screen and (min-width: 1440px) {
    .photo-bx {
        width: calc(50% - 20px);
        margin: 0 10px 20px 10px;
        float: left;
    }
}
section, article, aside, footer, header, nav, h2 {
    display: block;
}


img {
    border: 0;
}


.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 {
        max-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 .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;
    }

    .photo-bx {
        width: calc(50% - 20px);
        margin: 0 10px 20px 10px;
        float: left;
    }

    .photo-bx:nth-child(odd) {
        clear: both;
    }

    .photo-bx .pic {
        width: 100%;
    }

    .photo-bx .pic img {
        width: 100%;
        height: auto;
    }

    .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: url(/assets/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 .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;
    }

    .photo-bx {
        width: calc(50% - 20px);
        margin: 0 10px 20px 10px;
        float: left;
    }

    .photo-bx:nth-child(odd) {
        clear: both;
    }

    .photo-bx .pic {
        width: 100%;
    }

    .photo-bx .pic img {
        width: 100%;
        height: auto;
    }

    .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: url(/assets/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;
    }

    .photo-bx {
        width: calc(50% - 20px);
        margin: 0 10px 20px 10px;
        float: left;
    }

    .photo-bx:nth-child(odd) {
        clear: both;
    }

    .photo-bx .pic {
        width: 100%;
    }

    .photo-bx .pic img {
        width: 100%;
        height: auto;
    }

    .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: url(/assets/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;
    }

    .photo-bx {
        width: calc(100% - 20px);
        margin: 0 10px 20px 10px;
    }

    .photo-bx .pic {
        width: 100%;
    }

    .photo-bx .pic img {
        width: 100%;
        height: auto;
    }

    .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: url(/assets/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;
    }
}