@charset 'utf-8';
body{
    font: normal 18px/100% Arial, Helvetica, '微軟正黑體';
    margin: 0;
    padding: 0;
    color: #172341;
    background-color: #fff;
}

html, body{
    height: 100%;
}

a{
    text-decoration: none;
    color: #176181;
}

:hover{
    -webkit-transition: all 0.3s;
       -moz-transition: all 0.3s;
            transition: all 0.3s;
}

img:hover{
    opacity: 0.8;
    filter: alpha(opacity=80);
    -moz-opacity: 0.8;
    -khtml-opacity: 0.8;
}

div, p, span, ul, ol, li, h1, h2, h3, h4, h5, h6, input, table, td, th, img{
    margin: 0;
    padding: 0;
    border: none;
}

img{
    border: none;
}

ul, li{
    list-style: none;
}

.fL{
    float: left;
}

.fR{
    float: right;
}

.tL{
    text-align: left;
}

.tR{
    text-align: right;
}

.tC{
    text-align: center;
}

.clr{
    clear: both;
}

h3{
    font-size: 1.1em;
    line-height: 30px;
}

h4{
    font-size: 1em;
    line-height: 1.5em;
}

h5{
    font-size: 0.89em;
    line-height: 1.5em;
}

h4 .small{
    font-size: 0.7em;
}

.clearfix{
    *zoom: 1;
}

.clearfix:before, .clearfix:after{
    line-height: 0;
    display: table;
    content: '';
}

.clearfix:after{
    clear: both;
}

p{
    line-height: 1.5rem;
}


/*form元素設定*/

input[type='text'], input[type='password'], textarea, select{
    font: 18px/40px Arial, '微軟正黑體';
    line-height: inherit;
    width: 100%;
    margin: 0.5em auto;
    color: #636363;
}

select{
    padding: 0 5px;
    border: none;
    border: none;
    background: url(../images/icon_select_allow.png) right center no-repeat;
    background-image: none \9;
    -webkit-appearance: none;
    /*Chrome ios*/
       -moz-appearance: none;
    /*FF*/
            appearance: none;
    /*CSS3 ios*/
}

::-webkit-input-placeholder, :-moz-placeholder, ::-moz-placeholder, :-ms-input-placeholder{
    color: #7d7d7d;
}


/*radio*/

.inRadio{
    position: relative;
    display: block;
}

.radio{
    display: none;
}

.radio.search{
    display: inline-block;
    transform: translate(26px, 0px);
    width: 25px;
    height: 25px;
    background-color: transparent;
    appearance: none;
}


/*txt_input*/

.radioInput, .checkboxInput{
    line-height: 1;
    display: inline-block;
    width: 24px;
    height: 24px;
    margin: 0 10px 0 0;
    vertical-align: middle;
    border: 1px solid #cdcdcd;
    border-radius: 100%;
    background-color: #fff;
}

.radio:checked + .radioInput:after{
    display: inline-block;
    width: 10px;
    height: 10px;
    margin: 7px;
    content: '';
    border-radius: 100%;
    background-color: #53b7e4;
}

.radioInput.searchFilter{
    min-width: 24px;
    position: relative;
    cursor: pointer;
}

.checkbox.radioInput, .radio:checked + .checkbox.radioInput:after{
    border-radius: 0;
}

.inRadio .radioInput{
    position: absolute;
    top: 3px;
    left: 0;
}

.inRadio .raBox{
    position: absolute;
    top: 5px;
    left: 0;
}

.inRadio{
    padding: 5px 0 0 35px;
}


/*wrapper*/

.block{
    padding: 15px;
}

.block.sitemap{
    padding: 20px 40px;
}

.block.sitemap .desc{
    line-height: 1.5rem;
}

.block.sitemap .desc p span{
    color: #3386c5;
}

.block.sitemap .map{
    line-height: 1.5rem;
}

.block.sitemap .map .part{
    margin: 20px 0;
}

.block.sitemap .map .part a{
    color: #cae7f5;
}

.block.sitemap .map .part a:hover{
    color: #fff;
}

.block.sitemap .map .part .primary{
    background-color: #2b6783;
    padding: 15px 10px;
    font-weight: bold;
}



.block.sitemap .map .part .secondary{
    padding: 15px 10px;
}

.block.sitemap .map .part .secondary a{
    line-height: 2.5rem;
    color: #313131;
}

.block.sitemap .map .part .secondary a:hover{
    font-weight: bold;
    color: #172341;
}

.block.sitemap .map .part .secondary a::before{
    content: " ";
    border-right: 10px solid #888888;
    line-height: 2.5rem;
    margin-right: 10px;
    color: #313131;
}

/*header*/

.header{
    position: relative;
    height: 120px;
    background-color: #8baabe;
}

.logoBox{
    width: 280px;
    height: 98px;
    padding: 22px 0 0;
    text-align: center;
    background-color: #172341;
}

.logoBox a{
    display: inline-block;
}

.logoBox h1{
    font-size: 0.89em;
    padding: 60px 0 0;
    color: #fff;
    background: url(../images/logo.png) center 0 no-repeat;
}

.topNav{
    position: absolute;
    top: 0;
    right: 0;
    left: 280px;
    height: 120px;
    background: url(../images/bg_top.png) 0 0 no-repeat;
}

.topNav .sitemap{
    position: absolute;
    bottom: 10px;
    right: 10px;
    display: flex;
    align-items: center;
}

.topNav .sitemap .hotlink{
    margin-right: 10px;
}

.topNav .sitemap div:last-child a{
    color: black;
    font-weight: bold;
}

.topNav .sitemap div:last-child a:hover{
    color: #fff;
}

.topNav ul{
    position: absolute;
    top: 40px;
    right: 40px;
    display: none;
}

.topNav li{
    float: left;
    margin: 0 0 0 20px;
}

.topNav li a{
    display: block;
    width: 44px;
    height: 44px;
    border-radius: 30px;
}

.topNav li a.link1{
    background: #353a40 url(../images/icon_link_1.png) center center no-repeat;
}

.topNav li a.link2{
    background: #353a40 url(../images/icon_link_2.png) center center no-repeat;
}

.topNav li a.link1:hover{
    background: #1777a1 url(../images/icon_link_1.png) center center no-repeat;
}

.topNav li a.link2:hover{
    background: #1777a1 url(../images/icon_link_2.png) center center no-repeat;
}

/* mobile mode hambuger */
.topNav .hambuger{
    position: fixed;
    z-index: 10;
    right: 20px;
    top: 20px;
    padding: 10px 15px;
    border: 1px solid black;
    border-radius: 5px;
    cursor: pointer;
    display: none;
}

.topNav .hambuger:hover{
    background-color: black;
    border: 1px solid #fff;
}

.topNav .hambuger:hover .line{
    border: 3px solid #fff;
    background-color: #fff;
}

.topNav .hambuger:hover span{
    color: #fff;
}

.topNav .hambuger.opened .top{
    transform: translate(0, 11px) rotate(405deg);
}

.topNav .hambuger.opened .middle{
    opacity: 0;
}

.topNav .hambuger.opened .bottom{
    transform: translate(0, -11px) rotate(-405deg);
}

.topNav .hambuger .line{
    width: 30px;
    border: 3px solid black;
    background-color: black;
    border-radius: 5px;
    margin: 5px auto;
    transition: 0.5s linear;
}

/* mobile mode menu */
.mobileMenuWrapper{
    position: fixed;
    top:0;
    z-index: 8;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.575);
    display: none;
}

.mobileMenuWrapper.active{
    display: block;
}

.mobileMenuWrapper .mobileMenu{
    position: fixed;
    top: 0;
    right: 0;
    z-index: 9;
    width: 400px;
    height: 860px;
    background-color: #fff;
    border: 1px solid gray;
    display: none;
}

.mobileMenuWrapper .mobileMenu.active{
    display: block;
}

.mobileMenuWrapper .mobileMenu .title{
    margin-top: 11px;
    height: 70px;
    font-size: 2.5rem;
    line-height: 78px;
    padding-left: 25px;
}

.mobileMenuWrapper .mobileMenu .map{
    position: relative;
    padding: 1.8rem;
    max-height: calc(100vh - 149px);
    overflow-y: auto;
}

.mobileMenuWrapper .mobileMenu .map .part{
    line-height: 2rem;
}

.mobileMenuWrapper .mobileMenu .map .part .primary{
    margin-top: 30px;
    border-bottom: 1px solid lightgray;
}

.mobileMenuWrapper .mobileMenu .map .part:nth-of-type(1) .primary{
    margin-top: 0px;
}

.mobileMenuWrapper .mobileMenu .map .part:nth-of-type(8) .primary{
    margin-bottom: 20px;
}

.mobileMenuWrapper .mobileMenu .map .part .primary::before{
    content: ' ';
    margin-right: 10px;
    border-right: 10px solid rgb(56, 56, 56);
}

.mobileMenuWrapper .mobileMenu .map .part .secondary{
    padding-left: 2rem;
}

.mobileMenuWrapper .mobileMenu .map .part .primary a:hover,
.mobileMenuWrapper .mobileMenu .map .part .secondary a:hover{
    font-weight: bold;
}



/*footer*/
.footer{ background-color:#e4e0e0; padding:20px 0px; color:#313131; font-size:0.7em; line-height:18px;}
.footer .content{display: flex; flex-wrap: wrap; justify-content: space-around; align-items: center; max-width: 1000px; margin: 0 auto;}
.footer .zone{ width: 40%;}
.footer .zone.left{ min-width: 350px;}
.footer .zone.right{ min-width: 230px;}
.footer .zone .subZone{  display: flex; align-items: center; justify-content: center; margin-bottom: 15px; border-bottom: 1px solid #313131;}
.footer .zone .subZone .footerLogo{ 
    background: url("../images/icon_1.png"); 
    width: 46px; 
    height: 46px; 
    background-repeat: no-repeat; 
    background-position: center; 
    background-size: contain; 
    background-origin: content-box; 
    border: 7px solid #313131; 
    padding: 6px; 
    border-radius: 50%; 
    position: relative; 
    left: 20px;
    transform: scale(0.6);
}
.footer .zone .subZone .accessibility { display: flex; justify-content: center; align-items: center;  margin-left: 2.3rem; }
.footer .zone .subZone .accessibility #accessibility-badge img{ display: block; }
.footer .zone .subZone .hotlink a { color: #313131; }
.footer .zone .tit{ font-size: 3.1rem; margin: 0 1rem 0 0.5rem; line-height: 2.4rem; color:#313131; }
.footer .zone .subTit{ color:#313131; }
.footer .zone.right{ line-height: 1.9rem;}
.footer .zone .items::before{ content: " "; border-right: 8px solid #313131; margin-right: 0.5rem; }
.footMenu{ text-align:center; }
.footMenu li{ display:inline-block; }
.footMenu li a{ color:#313131; border-left:1px solid #313131; padding:0 10px; display:block;text-decoration:none; }
.footMenu li a:hover{ color:#1777a1; }
.footMenu li:first-child a{ border:none; }


/*container*/

.container{
    display: flex;
    flex-wrap: wrap;
    min-height: 700px;
    background-color: #fff;
}

.container .sideBlock{
    width: 280px;
    background-color: #172341;
}

.container .sideBlock a{
    color: #979797;
}

.container .contentBlock{
    width: calc(100% - 280px);
}

/*dropMenu-側邊選單*/

.dropMenu{
    border-top: 1px solid #fff;
    padding-top: 1rem;
}

.dropMenu li{
    padding: 0px 10px;
}

.dropMenu .hotlink{
    margin-left: 0.2rem;
    margin-bottom: 16px;
}

.dropMenu li.hotlink a{
    padding: 0;
    border: 0;
    line-height: 1rem;
}

.dropMenu li.hotlink a:hover{
    color: #313131;
    border-left: 0;
}

.dropMenu li a{
    font-weight: bold;
    line-height: 30px;
    display: block;
    padding: 5px 20px 5px 20px;
    color: #172341;
    border: 1px solid rgba(211, 211, 211, 0.389);
    margin-bottom: 5px;
}

.dropMenu li.on a{
    color: #fff;
    border-left: 8px solid #3386c5;
}

.dropMenu li a:hover{
    color: #fff;
    border-left: 8px solid #3386c5;
}

li.arr{
    background: url(../images/icon_arr.png) right 13px no-repeat;
}

li.arr.on{
    background: url(../images/icon_arr_on.png) right 13px no-repeat;
}

.dropMenu li.on .hideBox a{
    color: #979797;
}

.dropMenu li.on .hideBox a:hover{
    color: #fff;
}

.dropMenu li.on .hideBox li.active a{
    color: #fff;
    padding: 5px 0 5px 20px;
}

.hideBox{
    display: none;
}

.on .hideBox{
    display: block;
    margin-top: -5px;
    margin-bottom: 5px;
    border: 1px solid rgba(211, 211, 211, 0.389);
    border-top: 0;
    background-color: #0c1220;
}

.hideBox li{
    padding: 0 0 0 20px;
}

.hideBox li a{
    font-size: 0.89em;
    font-weight: normal;
    padding: 5px 0 5px 17px;
    border: none;
}

.hideBox li a:hover{
    padding: 5px 0 5px 20px;
}

.dropMenu li.on .hideBox li.on2 a{
    color: #fff;
    background: url(../images/icon_dot_on.png) 0 10px no-repeat;
}

.dropMenu li.on .hideBox a{
    border-left: none;
}


/*title-標題*/

.title{
    line-height: 30px;
    padding: 10px;
    background-color: #e4e0e0;
}

.title .ticon{
    display: inline-block;
    width: 30px;
    height: 30px;
    vertical-align: middle;
    background: url(../images/icon_txt.png) 0 0 no-repeat;
}

.title .breadcrumbLink{
    color: #333;
}

.title .breadcrumbLink:hover{
    color:#1777a1;
}


h2.tit{
    font-size: 1.3rem;
    padding: 10px 0;
    margin-bottom: 10px;
    letter-spacing: 2px;
    color: #1777a1;
    border-bottom: 1px solid #1777a1;
}

h2.pageTitle{
    font-size: 1.5rem;
    padding: 10px 0;
    margin-bottom: 10px;

}

h3.tit{
    margin: 0 0 20px;
    padding: 0 0 10px;
    letter-spacing: 2px;
    color: #1777a1;
    border-bottom: 1px solid #1777a1;
}


/*nav-麵包屑*/

.nav{
    overflow: hidden;
    padding: 10px;
}

.nav li{
    float: left;
}

.nav a{
    font-size: 0.7em;
    padding: 0 15px 0 5px;
    color: #a5a5a5;
    background: url(../images/icon_nav.png) right center no-repeat;
}

.nav a:hover{
    color: #1777a1;
}

.nav li:last-child a{
    background: none;
}



/*txtList-文字列表*/

.txtList{
    width: 95%;
    margin: 0 auto;
    padding: 0 0 20px;
}

.txtList li{
    line-height: 24px;
    padding: 0 0 20px 20px;
    text-align: justify;
    background: url(../images/icon_list.png) 0 2px no-repeat;
}

.txtList li a:hover{
    border-bottom: 1px solid #1f82ac;
}

.subList li{
    font-size: 0.89em;
    padding: 5px 0 0 20px;
    background: url(../images/icon_list_arr.png) 0 6px no-repeat;
}

.subList2 li{
    font-size: 0.89em;
    position: relative;
    padding: 5px 0 0 25px;
    background: none;
}

.subList2 .num{
    font-size: 0.89em;
    line-height: 20px;
    position: absolute;
    top: 7px;
    left: 0;
    display: inline-block;
    width: 20px;
    text-align: center;
    color: #fff;
    border-radius: 20px;
    background-color: #1777a1;
}


/*btnSet-按鈕*/

.btnSet{
    text-align: center;
}

.btnSet a{
    line-height: 40px;
    display: inline-block;
    min-width: 100px;
    margin: 0 5px 20px 5px;
    padding: 0 10px;
    color: #fff;
    border-radius: 4px;
    background-color: #1777a1;
}

.btnSet .search-btn{
    line-height: 60px;
    display: inline-block;
    min-width: 300px;
    margin: 50px 5px 20px 5px;
    padding: 0 10px;
    color: #fff;
    border-radius: 4px;
    background-color: #1777a1;
}

.btnSet .del{
    background-color: #b6b6b6;
}

.btnSet a:hover{
    background-color: #0c3d52;
}


/*表單元素*/

.inputBox{
    overflow: hidden;
    padding: 0 5px;
    border-radius: 4px;
    background-color: #fff;
}


/*search-搜尋區域*/

.search .btnSet a{
    margin: 0;
}

.search{
    position: relative;
    padding: 10px;
    background-color: #e4f0f3;
}

.search.keywordBar{
    margin: 20px 0 50px 0;
}

.search h3{
    text-align: center;
}

.search.type2 h3{
    margin-right: -140px;
}

.search.type2{
    padding: 10px 140px 10px 10px;
}

.search.type2 .btnSet{
    position: absolute;
    right: 10px;
    bottom: 10px;
}


/*search-搜尋下方勾選列表*/
.search-step{
    margin-bottom: 20px;
}

.search-step p::before{
    content: "";
    border-right: 8px solid #353a40;
    margin-right: 5px;
}

.searchList{
    min-width: 347px;
    margin: 50px 0 50px 0;
    padding: 10px 0;
    border-bottom: 1px solid #eee;
}

.searchList li{
    display: inline-block;
    margin: 0 10px 20px 0;
}

.searchList li.full{
    display: block;
    margin: 0 0 20px;
}


.searchList li label{
    display: flex;
    align-items: center;
}


/*table*/

.tbBlock{
    position: relative;
    margin-bottom: 4rem;
}

.tbBlock h3.tC{
    padding: 10px 0;
    border-bottom: 1px solid #eee;
}

.tbStyle{
    margin: 0 0 20px;
    border-bottom: 1px solid #eee;
}

.tbStyle .statistics{
    padding: 20px;   
}

.tbStyle .statistics li{
    line-height: 2.5rem;
}

.tbStyle .statistics li::before{
    content:"";
    border-right: 8px solid #353a40;
    margin-right: 5px;

}

.tbStyle th{
    font-weight: normal;
    line-height: 40px;
    text-align: left;
	width: 150px;
}

.tbStyle th, .tbStyle td{
    padding: 0px 10px;
}

.tbStyle .inputBox{
    border: 1px solid #dfdfdf;
}

.bg{
    background-color: #f6f6f6;
}

.tips{
    font-size: 0.89em;
    padding: 10px 0 0;
    color: #949494;
}

.space{
    padding: 15px 0 0;
}


/*OIDBlock*/

.OIDBlock{
    margin: 0 auto 20px auto;
    padding: 20px 80px 0;
}

.OIDBlock .CTcode{
    width: 200px;
    height: 150px;
    margin: 0 auto;

    text-align: center;
}

.OIDBlock .CTcodeBox{
    display: block;
    width: 120px;
    height: 120px;
    margin: 0 auto 10px auto;
    border: 1px solid #e4e0e0;
    border-radius: 50%;
    background: #f1f1f1 url(../images/icon_1.png) center center no-repeat;
    background-size: 70px auto;
}

.OIDitem{
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    padding: 20px 0 0;
    text-align: center;
    border-bottom: none;
}

.OIDitem p{
    width: 100%;
    margin: 10px 0;
}

.OIDitem ul{
    position: relative;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    max-width: 880px;
    padding-bottom: 20px;
    border-top: 10px solid #e4e0e0;
    border-bottom: 10px solid #e4e0e0;
}

.OIDitem li{
    width: 190px;
    margin: 20px 10px 0 0;
    text-align: center;
    border-left: 4px solid #7db343;
    background-color: #dae2e5;
}

.OIDitem li .tit{
    font-weight: normal;
    padding: 12px 0;
    background-color: #eee;
}

.OIDitem li p{
    padding: 5px 0;
}

.OIDitem li.type2{
    border-color: #ffb200;
}

.OIDitem li.type3{
    border-color: #00acc2;
}

.OIDitem li.type4{
    border-color: #546f7a;
}

.OIDitem li.type5{
    border-color: #ff7143;
}

.OIDitem li.type6{
    border-color: #fb7b8a;
}

.OIDitem li.type7{
    border-color: #448aca;
}

.OIDitem li.type8{
    border-color: #8957a1;
}

.OIDitem li.type9{
    border-color: #b28850;
}

.OIDitem li.type10{
    border-color: #094;
}

.OIDBlock .lineBG{
    height: 40px;
    background: url(../images/bg_line.jpg) center 0 repeat-y;
}


/*tipBox*/
.tipBox{
    max-width: 800px;
    width: 70%;
    margin: 4rem auto;
}

.tipBox p{
    display: flex;
    font-size: 0.89em;
    margin: 0 0 10px;
    letter-spacing: 1px;
    line-height: 1.3rem;
    color: #626262;
}

.tipBox p .tit::before{
    content: " ";
    border-right: 7px solid #353a40;
    margin-right: 10px;
}

.renewDate{
    position: absolute;
    top: 0.6em;
    right: 0;
    color: #666;
}


/*switcherGroup*/

.switcherGroup{
    border: solid 1px #57bbe4;
    border-radius: 1px;
}

.switcherItem{
    font-weight: bold;
    width: 33%;
    color: #1777a1;
    border: solid 1px #57bbe4;
    border-top: none;
    border-right: none;
    border-bottom: none;
}
.switcherItem a{
    display: inline-block;
    width: 100%;
    padding: 0.67em 0;
}

.switcherOn{
    background-color: #57bbe4;
}

.switcherOn a{
    color: #fff;
}

.sectionGroupOverview{
    padding: 22px 0;
    border-bottom: solid 1px #e8e8e8;
}

.CTcode{
    font-weight: bold;
    width: 110px;
}

.CTcodeBoxOrganization, .CTcodeBoxUnit, .CTcodeBoxAssociation, .CTcodeBoxFoundation{
    display: block;
    width: 100px;
    height: 100px;
    margin: 0 auto 10px auto;
    border: 1px solid #e4e0e0;
    border-radius: 100px;
    background-size: 50px auto;
}

.CTcodeBoxOrganization{
    background: #f1f1f1 url(../images/icon_1.png) center center no-repeat;
}

.CTcodeBoxUnit{
    background: #f1f1f1 url(../images/icon_2.png) center center no-repeat;
}

.CTcodeBoxAssociation{
    background: #f1f1f1 url(../images/icon_b_corp.png) center center no-repeat;
}

.CTcodeBoxFoundation{
    background: #f1f1f1 url(../images/icon_4.png) center center no-repeat;
}

.sectionGroupOverviewItemAll{
    float: left;
    width: 84%;
}

.sectionGroupOverviewItem{
    line-height: 2em;
    display: inline-block;
    width: 42%;
    padding-left: 1em;
}

.sectionGroupOverviewItem:nth-child(odd){
    border-right: dotted 2px #d0d0d0;
}

.sectionGroupOverviewAside{
    font-size: 0.89em;
    padding: 15px 0;
    color: #464646;
}

.sectionGroupOverviewAside img{
    vertical-align: bottom;
}


/*無障礙tab時提示邊框*/
@keyframes accessible-hint {
	0%{
		outline: 3px dotted red;
	}
	50%{
		outline: 3px dotted transparent;
	}
}

a:focus, button:focus, input:focus, select:focus{ 
	outline: 3px dotted red;
	animation-name: accessible-hint;
	animation-duration: 1.8s;
	animation-iteration-count: infinite;
	animation-timing-function: linear;
}


/* 不支援JavaScript時, <noscript>內容之css */
.not-support-javascript{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 200;
	height: 100%;
	width: 100%;
	background-color: black;
	opacity: 0.8;
}

.not-support-javascript p{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 70%;
	text-align: center;
	color: #fff;
	font-size: medium;
	line-height: 30px;
}

/*無障礙導盲:::*/
.sr-only {position: absolute; z-index: 1000000; margin: 0.4rem; text-decoration: none; color: black; background-color: #ffffffad; border: 0; width: 0; height:0; overflow: hidden; font-weight: bold;}
.sr-only:active, .sr-only:focus {position: absolute; padding: 0.4rem; width: auto; height: auto; overflow: visible;}

.hotlink{ display: inline-block; }
.hotlink a { text-decoration: none; font-weight: bold; color: #333; }




/* RWD */
@media screen and (max-width: 576px) {
    /* header */
    .logoBox{
        position: fixed;
        top: 0;
        z-index: 8;
        width: 100%;
    }
        
    /* 網站導覽：隱藏 */
    .topNav .sitemap .hotlink{
        display: none;
    }
    
    .topNav .sitemap div:last-child a{
        display: none;
    }

    /* 左側選單區隱藏 */
    .container .sideBlock{
        display: none;
    }

    /* 主要內容區：調整寬度 */
    .container .contentBlock{
        width: 100%;
    }

    .OIDitem li{ 
        margin: 20px 0 0 0;
    }

    /* 漢堡選單：開啟 */
    .topNav .hambuger{
        display: block;
    }

    /* footer右側內容 */
    .footer .zone.right{
        margin-top: 2rem;
    }
}

@media screen and (min-width: 577px) and (max-width: 768px) {
    /* header */
    .logoBox{
        position: fixed;
        top: 0;
        z-index: 8;
        width: 100%;
    }

    /* 網站導覽：隱藏 */
    .topNav .sitemap .hotlink{
        display: none;
    }
    
    .topNav .sitemap div:last-child a{
        display: none;
    }

    /* 左側選單區隱藏 */
    .container .sideBlock{
        display: none;
    }

    /* 主要內容區：調整寬度 */
    .container .contentBlock{
        width: 100%;
    }

    /* 漢堡選單：開啟 */
    .topNav .hambuger{
        display: block;
    }

    /* footer右側內容 */
    .footer .zone.right{
        margin: 2rem 2rem 0 2rem;
    }
}

@media screen and (min-width: 769px) and (max-width: 992px) {
    /* header */
    .logoBox{
        position: fixed;
        top: 0;
        z-index: 8;
        width: 100%;
    }

    /* 網站導覽：隱藏 */
    .topNav .sitemap .hotlink{
        display: none;
    }
    
    .topNav .sitemap div:last-child a{
        display: none;
    }

    /* 左側選單區隱藏 */
    .container .sideBlock{
        display: none;
    }

    /* 主要內容區：調整寬度 */
    .container .contentBlock{
        width: 100%;
    }

    /* 漢堡選單：開啟 */
    .topNav .hambuger{
        display: block;
    }
}

@media screen and (min-width: 993px) and (max-width: 1200px) {
    /* 網站導覽：隱藏 */
    .topNav .sitemap .hotlink{
        display: none;
    }
    
    .topNav .sitemap div:last-child a{
        display: none;
    }

    /* 左側選單區隱藏 */
    .container .sideBlock{
        display: none;
    }

    /* 主要內容區：調整寬度 */
    .container .contentBlock{
        width: 100%;
    }

    /* 漢堡選單：開啟 */
    .topNav .hambuger{
        display: block;
    }
}