:root {
    --white:#fff;
    --darkblue:#0b3878;
    --sky:#0078bc;
    --teal:#008aad;
    --danger:#b3261e;
    --warning: #e79330;
    --success: #c9e09e;
}
.bg_gr {background: url('../images/1310055_bg_gr.jpg') no-repeat bottom center / 100% auto;}
.bg_linear_sky {background: linear-gradient(0deg ,#daeef8,#edf6fa);}
.bg_linear_teal {background: linear-gradient(90deg, #039adb, #c9e09e);}
/* header */
.header_nvbar .container {padding: 2rem 0 0;}
.header_nvbar .icongroup > a, .icongroup .menu_btn {text-align: center;filter: drop-shadow(3px 3px 8px #0000005a);}
.header_nvbar .icongroup > a:hover, .icongroup .menu_btn:hover {filter: drop-shadow(1px 2px 5px #0000002a);}
.header_nvbar .logo_brand {font-size: 3.25rem;font-weight: bold;color:var(--darkblue);position: relative;padding: 0 3rem .3rem 1rem;margin: .5rem auto;border-radius: 0 5rem 5rem 0;background: linear-gradient(0deg, #dbdbdb, #ffffff);text-shadow: unset;}
.header_nvbar .logo_brand a {color:var(--darkblue);}
.header_nvbar .logo_brand small {font-size: 3rem;color: transparent;background: linear-gradient(0deg, #3f95af 10%, #e79330 60%);-webkit-background-clip: text;background-clip: text;}
.header_nvbar .logo {padding: 0 0 0 16.75rem;margin: auto;}
.header_nvbar .logo img {width: 100px;}
.header_nvbar .channelsocial {margin: 1.5rem 0 auto auto;}
.header_nvbar .icongroup > a, .icongroup .menu_btn {color: var(--darkblue);background: linear-gradient(0deg, #dbdbdb, #ffffff);}
/*公職 研究所*/
.main_bg {background: url('../images/1310055_bg.jpg') no-repeat top center / 100% auto;}
.main_bg h1 {font-size: 4.8rem;padding: 1.8rem 0 0;margin: auto;}
.main_bg h1 span {padding: 0 2.5rem .35rem;margin: 0 1rem;font-weight: 800;color: #fff;text-shadow: 2px 2px 6px #0000006a;background: linear-gradient(0deg ,#c9e09e 0%,#0097d8 60%);border-radius: 50rem;}
.selected {font-size: 3.25rem;padding: .6rem 15rem 1rem;color: var(--sky);font-weight: bold;border-bottom: 2px dashed var(--darkblue);width: fit-content;margin:0 auto 1.25rem;position: relative;text-shadow: 1px 0 3px var(--white), -1px 0 3px var(--white), 0 1px 3px var(--white), 0 -1px 3px var(--white), 0 0 8px var(--white), 6px 0 6px var(--white), -6px 0 6px var(--white), 0 6px 6px var(--white), 0 -6px 6px var(--white), 0 0 3px var(--white), 0 0 6px var(--white), 0 0 12px var(--white);}
.selected strong {font-size: 4.25rem;color: var(--darkblue);}
.selected::before {content: '';width: 10px;height: 10px;background: var(--darkblue);border-radius: 50rem;position: absolute;left: 0;bottom: -5.5px;}
.selected::after {content: '';width: 10px;height: 10px;background: var(--darkblue);border-radius: 50rem;position: absolute;right: 0;bottom: -5.5px;}
/*選書*/
.asidemenu {position: fixed;right: 0;top: 25%;background: linear-gradient(-15deg, #dddddd 0%, #ffffff 55%);padding: 1rem 1.1rem;border-radius: 1rem 0 0 1rem;border-bottom: 1px solid #fff;border-left: 1px solid #fff;box-shadow: 0 3px 8px #0000005a;z-index: 3;}
.asidemenu dt i {padding: 0 0 0 0.25rem;font-size: .9rem;}
.asidemenu dd {font-size: .95rem;padding: .35rem 0 0;margin: .35rem auto;line-height: 1.4rem;border-top: 1px #aaa dotted;}
.asidemenu dd a {text-decoration: none;}
.asidemenu dd strong {display: block;font-size: 1.25rem;color: var(--teal);}
.asidemenu dd strong:hover {color: var(--danger);}
/*重點整理 解題書*/
.series {padding: 0 0 6rem;}
.series dl {width: calc(100%/2);padding: 1rem 0;text-align: center;}
.series dl dt {font-size: 2rem;width: fit-content;padding: 0 1rem .2rem;border-radius: 2rem;margin: auto;color: #fff;background: #ba0007;}
.series dl dd {font-size: 1.5rem;padding: .5rem 0 0;}
.series dl dd a {width: calc(100% / 4);}
.series dl dd img {padding:.5rem ;filter: drop-shadow(2px 2px 5px #0000003a);}
.series .books {display: flex;flex-wrap: wrap;justify-content: center;align-items: center;padding:1% 3%;}
/*高普特考資訊處理‧統計*/
.bookcase {position: relative;padding: 6.5rem 1rem 2rem;}
.field_tab {text-align: center;background-color: white;padding: 2rem 0;width: fit-content;border-radius: 2rem;box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;position: absolute;top: -5rem;left: 0;right: 0;margin: auto;}
.field_tab a {cursor: pointer;font-size: 1.65rem;padding: 0 4rem;text-decoration: none;color: #333333;}
.field_tab a:first-of-type {border-right: 1px solid #bbbbbb;padding: 0 5.5rem;}
.field_tab a i {color: var(--gray);font-size: 3rem;display: block;}
.field_tab a.active i {color: transparent;background: linear-gradient(90deg, #039adb 20%, #c9e09e 90%);-webkit-background-clip: text;background-clip: text;filter: saturate(150%) contrast(80%) brightness(95%);}
.field_tab a.active {color: var(--darkblue);}
.field_tab small {display: block;font-size: 1.05rem;}
.category {width: 100%;padding: 1rem 0;}
.category table {width: calc(100%/2 - 1.5rem);margin: 0 auto auto;}
.category .collection { border: unset;background-color: unset;font-size: 1.2rem;color: var(--sky);padding: .25rem;}
.category td {font-size: 1.05rem;padding: 0.25rem 1rem;border: 1px dotted #0b38785a;background: #ffffff80;}
.tag {font-size: 1.55rem;width: 100%;color: var(--darkblue);font-weight: bold;}
.category .tag {padding: .25rem;}
.category .tag1 {padding: .25rem 1.25rem;}
.category .product  td, .category .commodity td {background: unset;}
.category .product , .category .commodity {font-size: 1rem;color: #ffffff;text-align: center;letter-spacing: .5em;background: linear-gradient(90deg,#0097d8,#c9e09e);}
.sort {width: calc(100%/2 - 1.5rem);margin: 0 auto auto;}
.sort table {width: 100%;margin: 0 auto auto auto;}
.unique table {margin: 0 auto 2rem 1rem;width: calc(100% - 1.5rem);} 
/*上榜高手推薦*/
.recommend {padding: 2rem 1rem;}
.recommend h1 {font-size: 2rem;color: #fff;font-weight: bold;padding: .25rem 1rem;filter: drop-shadow(1px 2px 5px #0000005f);}
.post {width: calc(100%/3 - 1.5rem);margin: 0.5rem auto;border-radius: 2rem;background: linear-gradient(-15deg, #dddddd 0%, #ffffff 55%);filter: drop-shadow(1px 2px 3px #0000003a);padding: 1rem;}
.post .rank {width: fit-content;font-size: 1.2rem;font-weight: bold;padding:0 .25rem;}
.post .rank mark {color: var(--danger); border-radius: 50rem;padding: 0 .55rem .125rem;background:#faf7cb;border: 1px dotted;}
.post p {font-size: 1.05rem;padding: 0.5rem 0;}
.post p a {color: var(--teal);}
.post .name {font-size: 1.2rem;border-bottom: 2px dotted #0b38785a;color: var(--darkblue);padding: .25rem 0 .5rem;}
.ps {font-size: .95rem;padding: 1rem 0;}
.announce .askclick {background: var(--teal);box-shadow: 0 3px 8px #0000005a;}
.announce .askclick:hover {background: var(--danger);}
#back_top a {color: var(--teal);}
@media screen and (max-width: 1280px) {   
    .header_nvbar .logo {padding: 0 0 0 13rem;}
    .category table {width: 100%;}
    .unique table {margin: 0 auto 2rem;}
    .sort {width: 100%;}    
    .post {width: calc(100%/2 - 1rem);}
    .category .sort:last-of-type {padding: 2rem 0 0;}
}
@media screen and (max-width: 1280px) {
    .bg_gr {background: url('../images/1310055_bg_gr_m.jpg') no-repeat bottom center / 100%;}
    .main_bg {background: url('../images/1310055_bg.jpg') no-repeat top right / cover;}
    .header_nvbar .logo {padding: 0 0 0 10rem;}
    .header_nvbar .logo img {width: 80px;}
    .header_nvbar .logo_brand {font-size: 2.6rem;padding: 0 2rem .25rem 1rem;}
    .header_nvbar .logo_brand small {font-size: 2.5rem;}
    .header_nvbar .channelsocial {margin: 1.6rem 2rem auto auto;}
    .selected {padding: .6rem 6.5rem 1rem;}
    .series {flex-direction: column;}
    .series dl {width: 90%;margin: auto;}
    .category table {width: 100%;}
    .category .tag1 {padding: .25rem;}
    .unique table {margin: 0 auto 2rem;}
    .sort {width: 100%;}    
    .post {width: calc(100%/2 - 1rem);}
    .post .rank {font-size: 1.1em;}
}
@media screen and (max-width: 1023px) {
    .header_nvbar .logo {padding: 0;}
    .main_bg h1 {font-size: 3.8rem;padding: 1.5rem 0 0;}
    .selected {font-size: 3rem;padding: .6rem 5rem 1rem;}
    .selected strong {font-size: 3.5rem;}
    .asidemenu {bottom: 0;left: 0;top: auto;margin: 0;border-radius: 1rem 1rem 0 0;border-top: 1px solid #fff;background: linear-gradient(-1deg, #dbdbdb 0%, #ffffff 60%);border-bottom: 0;border-left: 0;padding: .5rem .5rem 1rem;}
    .asidemenu dl {width: 100%;border-top: 0px ;border-left: 0;display: flex;flex-wrap: wrap;justify-content: center;align-items: flex-end;padding: 0;}
    .asidemenu dd {padding: 0 0 0 .5rem;margin: .5rem 0 auto 1rem;border-top: 0px;border-left: 1px #aaa dotted;}
    .asidemenu dd strong {display: inline-block;padding: 0 .25rem;}
    #back_top {bottom: 8%;}
    #BodyFooter .footer_inline ul {padding: 1rem 1rem 5rem;}
}
@media screen and (max-width: 820px) {
    .selected {font-size: 3.2rem;padding: .6rem 1rem 1rem;}
}
@media screen and (max-width: 767px) {   
    .main_bg {background: url('../images/1310055_bg_m.jpg') no-repeat top center / 100%;}
    .header_nvbar .container {padding: 1.5rem 0 0;}
    .header_nvbar .icongroup > a, .icongroup .menu_btn {filter: drop-shadow(2px 2px 3px #0000005a);}
    .header_nvbar .channelsocial {margin: .8rem auto auto;}
    .header_nvbar .logo_brand {font-size: 2rem;padding: 0 1.25rem .2rem .8rem;}
    .header_nvbar .logo img {width: 65px;}
    .header_nvbar .logo_brand small {font-size: 1.8rem;}
    .main_bg h1 {font-size: 2.5rem;padding: .5rem 0 0;}
    .main_bg h1 span {padding: 0 1.6rem .25rem;margin: 0 0.25rem;}    
    .selected {width: 94%;font-size: 2rem;margin: 0 auto .5rem;}
    .selected strong {font-size: 2.25rem;line-height: 2.6rem;padding: .5rem 0 0;display: block;}
    .series .books {padding: 1% 5%;}
    .series dl {width: 94%;}
    .series dl dt {font-size: 1.4rem;padding: 0 1rem .05rem;}
    .series dl dd {font-size: 1.1rem;}
    .series dl dd img {padding: .5rem 0;}
    .field_tab a {font-size: 1.55rem;padding: 0 0.5rem;}
    .field_tab a:first-of-type {padding: 0 1.5rem;}
    .field_tab small {font-size: 0.85rem;}
    .tag {font-size: 1.3rem;}
    .category td {font-size: 1rem;padding: 0.25rem;}
    .post {width: 100%;}
    .post p {font-size: 1rem;}
    .asidemenu {padding: .15rem .5rem .75rem;}
    .asidemenu dd strong {font-size: 1.125rem;}
    #back_top {bottom: 15%;}
    .announce  .askclick {bottom: 23%;}
    #BodyFooter .footer_inline ul {padding: 1rem 1rem 6.5rem;}
}