/* 縮小失敗。正在傳回未縮小的內容。
(37,68): run-time error CSS1038: Expected hex color, found '#ffff'
 */
@charset "UTF-8";
/* CSS Document */
*{ margin:0; padding:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
html{ width:100%; height:100%; font-family:Arial, Helvetica,"微軟正黑體",sans-serif; text-size-adjust:none; font-size:16px;}
ul{ margin: 0; padding: 0; list-style: none;}
img{ display: block;}

/* == 桌機版優先 ============================================================================= */

/* 主要內容外層 */
main{ margin-bottom: 50px; padding: 0 calc((100% - 1280px)/2);}

/* 麵包屑 */
main .bread_list{ display: block; margin: 20px 0 40px; width: 100%;}
main .bread_list ol{ display: flex; list-style: none; flex-wrap: wrap;}
main .bread_list ol li{ color: #333333; font-size: 15px;}
main .bread_list ol li a{ color: #009590; text-decoration: none; }
main .bread_list ol li::after{ content: '\f054'; font-family:"Font Awesome 5 Free"; font-weight: 900; margin: 0 10px; color: #cccccc;}
main .bread_list ol li:last-child::after{ display: none;}

/* 單元標題 */
.page-title{ margin-bottom: 20px; font-size: 1.5em; line-height: 1; border-left: 5px solid #FA8C16; padding-left: 8px;}

/* 單元說明 */
.page-info{ padding: 20px 0; color: #333333; line-height: 1.6; border-top: 1px dashed #999999; border-bottom: 1px dashed #999999;}
.page-info a{ color: #333333;}

/* 單元副標題 */
.page-subtitle{ margin: 30px 0 0;}
.page-subtitle h3{ font-size: 1.1em; color: #333333;}
.page-subtitle h3 span{ color: #FA8C16;}
.page-subtitle p{ padding-top: 15px; color: #333333;}
.page-subtitle p span{ color: #FC0202;}

/* 會員名稱 等級狀態 */
.member-title{ margin: 30px 0; width: 100%; display: flex; justify-content: flex-start; align-items: center;}
.member-title .level{ padding: 5px 20px; font-weight: bold; color: #ffff; background-color: #FA8C16; border-radius: 50px;}
.member-title p{ margin-left: 20px; font-size: 1.5em; color: #000000;}

/* 會員點數福利 */
.point-wrap{ margin-bottom: 25px; display: flex; justify-content: space-between;}
.point-wrap>div{ width: 49%; border: 1px solid #02B3AB; text-align: center; border-radius: 15px;}
.point-wrap>div .point{ padding: 25px 0; border-bottom: 1px dashed #02B3AB;}
.point-wrap>div .point strong{ font-size: 2em; color: #FC0202}
.point-wrap>div .point p{ font-size: 17px; line-height: 1.6;}
.point-wrap>div .limit{ padding: 15px 0;}

/* 會員資料服務 */
.datalist-wrap{ margin-bottom: 50px; display: flex; justify-content: space-between;}
.datalist-wrap .data-list{ width: 32%; border: 1px solid #02B3AB; border-radius: 15px;}
.datalist-wrap .data-list h3{ display: block; padding: 15px 20px; font-size: 1.1em; color: #009590; background-color: #EEF6F3; border-radius: 15px 15px 0 0;}
.datalist-wrap .data-list ul{ padding: 20px;}
.datalist-wrap .data-list ul li a{ line-height: 1.8; text-decoration: none; color: #333333;}
.datalist-wrap .data-list ul li a:hover{ font-weight: bold;}

/* 會員任務提醒區 */
.mission{ padding: 20px 30px; display: flex; justify-content: flex-start; align-items: center; border: 1px solid #DDDDDD; border-radius: 15px;}
.mission img{ max-width: 100%;}
.mission>div{ padding-left: 20px;}
.mission>div p{ font-size: 17px; color: #000000; line-height: 1.6; padding: 5px 0; display: flex;}
.mission>div p i{ padding-top: 4px; padding-right: 5px; color: #FA8C16;}

/* 會員表單區 */
.form-wrapper>p{ font-size: 1.1em; font-weight: bold; color: #333333;}
.form-wrapper>p span{ color: #FA8C16;}
.form-wrapper table{ margin: 10px 0; width: 100%; border-collapse:collapse;}
.form-wrapper table td{ border: 1px solid #02B3AB; padding: 10px;}
.form-wrapper table td p{ padding: 4px 0; font-size: 15px;}
.form-wrapper table td p i{ color: #FA8C16;}
.form-wrapper table td p a{ color: #333333; font-weight: bold;}
.form-wrapper table td:nth-child(1){ width: 12%; background-color: #EEF6F3; color: #02B3AB; font-weight: bold; text-align: right;}
.form-wrapper table td:nth-child(1) span{ color: #FC0202;}
.form-wrapper table td:nth-child(2){ width: 88%; color: #333333;}
.form-wrapper table input,.form-wrapper table button,.form-wrapper table select{ padding: 8px; font-size: 1em; color: #333333; border: 1px solid #d2d2d2; border-radius: 5px;}
.form-wrapper table button{ margin-left: 5px; padding: 5px 10px; font-size: 15px;}
.form-wrapper table button:hover{ background-color: #E9E9E9;}
.form-wrapper table select{ display: inline-block; width: 20%; margin-right: 5px;}

/* 驗證成功 */
.verifyok{ margin-top: 50px; text-align: center;}
.verifyok img{ max-width: 100%; margin: 0 auto;}
.verifyok h3{ padding: 10px 0; font-size: 2em; font-weight: normal; color: #333333;}
.verifyok p{ font-size: 1.5em; color: #666666;}
.verifyok a{ display: block; margin: 15px auto 0; padding: 10px 0; width: 200px; color: #ffffff; background-color: #FA8C16; border-radius: 50px; text-decoration: none;}

/* 綁定帳號管理 */
.sns-settings{ padding-top: 20px;}
.sns-settings ul{ display: flex; justify-content: space-between;}
.sns-settings ul li{ width: 32%; padding: 50px 0; text-align: center; border: 1px solid #02B3AB; border-radius: 15px;}
.sns-settings ul li p{ font-size: 18px; font-weight: bold; color: #333333;}
.sns-settings ul li p span{ font-weight: normal;}
.sns-settings button{ margin: 10px auto 0; width: 180px; height: 50px; border-radius: 50px; border: 0px; font-size: 18px; cursor: pointer; display: flex; justify-content: center; align-items: center;}
.sns-settings button img{ margin-right: 5px; width: 24px; height: auto;}
.sns-settings .LineBtn{ background-color: #00C300; color: #ffffff;}
.sns-settings .GoogleBtn{ background-color: #F5F5F5; color: #666666; border: 1px solid #999999;}
.sns-settings .FbBtn{ background-color: #1877F2; color: #ffffff;}

/* 訂閱管理 */
.subscribe{ padding-top: 10px;}
.subscribe table{ width: 100%; border-collapse:collapse;}
.subscribe table th{ border: 1px solid #02B3AB; padding: 10px; background-color: #EEF6F3; color: #02B3AB; font-weight: bold;}
.subscribe table th:nth-child(1){ width: 10%;}
.subscribe table th:nth-child(2){ width: 90%;}
.subscribe table td{ border: 1px solid #02B3AB; padding: 10px; text-align: center; color: #333333;}
.subscribe table td:nth-child(2){ text-align: left;}
.subscribe table td h4{ padding-bottom: 5px; font-size: 1.1em;}
.subscribe table td p{ color: #666666; line-height: 1.5;}

/* 隱私權說明條文 */
.userterms{ width: 100%; padding: 15px 40px; border: 1px solid #DDDDDD;}
.userterms h3{ margin:0; padding:20px 0 5px; font-size: 1.2em; color:#02B3AB; line-height: 1.6;}
.userterms h4{ margin:0; padding:10px 0 10px 0; font-size: 15px; font-weight: normal; line-height: 1.6;}
.userterms p{ margin:0; padding:0 0 10px; font-size: 15px; color: #333333; line-height: 1.6;}
.userterms span{ color: #FA8C16;}

/* 表單區-按鈕樣式01 */
form .btn-sty01{ margin-top:50px; text-align: center;}
form .btn-sty01 button{ width:250px; height: 45px; border: 0; border-radius: 50px; font-size: 1em; color: #ffffff; font-weight: bold; background-color: #FA8C16; cursor: pointer;}

/* 表單區-按鈕樣式02 */
form .btn-sty02{ margin-top: 40px; text-align: center; }
form .btn-sty02>div{ display: flex; justify-content: center;}
form .btn-sty02 button{ margin: 0 5px; width:150px; height: 45px; border: 0px; border-radius: 50px; font-size: 1em; font-weight: bold; border: 1px solid #FA8C16; cursor: pointer;}
form .btn-sty02 .send{ color: #FA8C16; background-color: #ffffff;}
form .btn-sty02 .goback{ color: #ffffff; background-color: #FA8C16;}
form .btn-sty02 p{ padding-top:20px; color: #003945;}
form .btn-sty02 p a{ font-weight: bold; color: #003945;}


/* ===== other ====================================================================================== */
@media(max-width:1279px){

  main{ margin-bottom: 50px; padding: 0 1%;}

}

/* ===== phone ========================================================================================= */
@media(max-width:820px){

  main{ margin-bottom: 50px; padding: 0 2%;}

  /* 會員表單區 */
  .form-wrapper table td:nth-child(1){ width: 20%;}
  .form-wrapper table td:nth-child(2){ width: 85%; color: #333333;}
  .form-wrapper table select{ display: inline-block; width: 30%; margin-right: 5px;}


}
@media(max-width:640px){

  main{ margin-bottom: 25px; padding: 0 2%;}
  /* 麵包屑 */
  main .bread_list{ margin: 15px 0;}

  /* 單元標題 */
  .page-title{ margin:28px 0 15px ; font-size: 1.4em;}

  /* 單元說明 */
  .page-info{ padding: 15px 0; line-height: 1.5; font-size: 15px;}

  /* 單元副標題 */
  .page-subtitle{ margin: 20px 0 0;}
  .page-subtitle h3{ font-size: 17px;}
  .page-subtitle p{ padding-top: 10px; font-size: 15px;}

  /* 會員名稱 等級狀態 */
  .member-title{ margin: 20px 0;}
  .member-title p{ margin-left: 10px; font-size: 1.4em;}

  /* 會員點數福利 */
  .point-wrap{ margin-bottom: 10px;}
  .point-wrap>div{ width: 49%;}
  .point-wrap>div .point strong{ font-size: 1.5em;}
  .point-wrap>div .point p{ font-size: 15px;}
  .point-wrap>div .limit{ font-size: 15px;}

  /* 會員資料服務 */
  .datalist-wrap{ margin-bottom: 30px; display: flex; flex-wrap: wrap; justify-content: center;}
  .datalist-wrap .data-list{ width: 100%; margin-bottom: 10px;}
  .datalist-wrap .data-list h3{ padding: 15px 20px; font-size: 17px;}
  .datalist-wrap .data-list ul{ padding: 20px;}
  .datalist-wrap .data-list ul li a{ font-size: 15px; line-height: 1.6;}

  /* 會員任務提醒區 */
  .mission{ padding: 20px 25px; display: flex; flex-wrap: wrap; justify-content: center;}
  .mission img{ padding: 10px 0; max-width: 100%;}
  .mission>div{ width: 100%; padding-left: 0;}
  .mission>div p{ font-size: 1em;}

  /* 會員表單區 */
  .form-wrapper>p{ font-size: 1em;}
  .form-wrapper table td p{ font-size: 14px;}
  .form-wrapper table td:nth-child(1){ width: 30%; font-size: 14px; padding-left: 0;}
  .form-wrapper table td:nth-child(2){ width: 70%; font-size: 15px;}
  .form-wrapper table input{ width: 100%;}
  .form-wrapper table button{ display: block; margin: 5px 0;}
  .form-wrapper table select{ display: block; width: 100%; margin: 5px 0;}

  /* 驗證成功 */
  .verifyok{ margin-top: 50px;}
  .verifyok img{ max-width: 80%;}
  .verifyok h3{ padding: 10px 0; font-size: 1.5em;}
  .verifyok p{ font-size: 1em;}

  /* 綁定帳號管理 */
  .sns-settings{ padding-top: 0;}
  .sns-settings ul{ display: flex; flex-wrap: wrap; justify-content: center;}
  .sns-settings ul li{ margin: 5px 0; width: 90%; padding: 40px 0;}
  .sns-settings ul li p{ font-size: 17px;}
  .sns-settings button{ width: 180px; height: 45px; font-size: 17px;}

  /* 訂閱管理 */
  .subscribe table th{ padding: 5px;}
  .subscribe table th:nth-child(1){ width: 9%;}
  .subscribe table td{ padding: 10px 5px;}
  .subscribe table td h4{ font-size: 1em;}
  .subscribe table td p{ font-size: 15px; line-height: 1.5;}

  /* 隱私權說明條文 */
  .userterms{ width: 100%; padding:0 20px;}
  
  /* 表單區-按鈕樣式01 */
  form .btn-sty01{ margin-top:30px; }
  form .btn-sty01 button{ width:250px; height: 45px; font-size: 1em;}

}
@charset "UTF-8";
/* CSS Document */
*{ margin:0; padding:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
html{ width:100%; height:100%; font-family:Arial, Helvetica,"微軟正黑體",sans-serif; text-size-adjust:none; font-size:16px;}
ul{ margin: 0; padding: 0; list-style: none;}
img{ display: block;}

/* == 桌機版優先 ============================================================================= */

header .top{ width: 100%; padding:0 calc((100% - 1280px)/2); display: flex; justify-content: flex-start; align-items: center; height: 150px;}
header .top .logo{ width: 28%; text-align: center;}
header .top .logo img{ max-width: 100%; margin: 0 auto;}

/* 搜尋bar */
header .top .search{ width: 42%;}
header .top .search .search_wrap{ border: 1px solid #23D9BD; display: flex; justify-content: flex-start; border-radius: 50px;}
header .top .search .search_wrap input,
header .top .search .search_wrap button{ outline:none; border: 0; font-size: 1em;}
.top .search .search_wrap input{ width:88%; padding:12px 15px; color: #333; border-radius: 50px 0 0 50px;}
.top .search .search_wrap button{ width:12%; border-radius: 0 50px 50px 0; background-color: #23D9BD; color: #fff; cursor: pointer;}
.top .search .search_wrap button i{ font-size: 1.5em;}

/* 線上客服 */
header .top .user-serve{ width: 30%; display: flex;}
header .top .user-serve>div{ display: flex; align-items: center; margin-left: 25px; padding: 5px 0;}
header .top .user-serve>div span{ margin-right: 5px; width: 32px; height: 32px; color: #fff; background-color: #23D9BD; border-radius: 50%; display: flex; flex-shrink: 0; justify-content: center; align-items: center;}
header .top .user-serve>div a{ text-decoration: none; color: #666;}
/* 會員登入 */
header .top .user-serve .login{ position: relative;}
header .top .user-serve .login ul{ display: none; position: absolute; top: 100%; z-index: 91; width: 100%; border: 1px solid #999; font-size:0.95em; border-radius: 5px; background-color: #fff;}
header .top .user-serve .login ul li a{ display: block; padding: 6px 10px; border-bottom: 1px dashed #999;}
header .top .user-serve .login ul li a:hover{ background-color: #23D9BD;}
header .top .user-serve .login ul li:last-child a{ border-bottom: 0px; color: #009590;}
header .top .user-serve .login ul li:last-child a:hover{ color: #fff;}
header .top .user-serve .login ul li:first-child{ padding: 6px 10px; border-bottom: 1px dashed #999; color: #FA8C16;}

/* 行動版TOP選單區 */
.mobile-top, .m-allexam-wrapper{ display: none;}

/* 線上LINE客服燈箱展開頁面 */
.lightWrap{ display: none;}
.lightWrap .lightContent{ padding: 50px 30px; width: 60%; background-color: #003945; position: relative; display: inline-block;}
.lightWrap .oplightCon{ display: inline-block;}
.wrapbkg::after{ content:''; display: block; position: fixed; top: 0; left: 0; z-index: 99; height: 100%; width: 100%; background:#000; opacity: 0.3;}
.wrapbkg .lightWrap{ position:fixed; top: 0; left: 0; z-index:9999; height: 100%; width: 100%; justify-content: center; align-items: center; display: flex;}
.wrapbkg .closeLight{ position: absolute; top:20px; right:20px; width: 30px; height: 30px; background: #fff; border-radius: 50%; font-weight: bold; 
  text-decoration: none; display: flex; justify-content: center; align-items: center; color: #003945;}
.addLine .public-box{ display: flex; justify-content: center; align-items: center;}
.addLine .public-box .pic{ flex-shrink: 0;}
.addLine .public-box .pic img{ margin: 0 auto; max-width: 100%;}
.addLine .public-box .text{ margin-left: 20px; font-size: 1.8em; line-height: 1.8; color: #23D9BD;}
.addLine .public-box .text a{ display: inline-block; text-decoration: none; margin-left: 10px; padding: 0 20px; color: #003945; font-size: 24px; background-color: #23D9BD; border-radius: 50px;}
.addLine .public-box .text a:hover{ background-color: #fff;}
.addLine .class-box{ margin: 30px 0 0; text-align: center;}
.addLine .class-box h3{ padding-bottom: 15px; font-size: 1.4em; color: #23D9BD;}
.addLine .class-box div{ display:flex; flex-wrap: wrap; justify-content: center;}
.addLine .class-box div a{ display: inline-block; margin:2px; padding: 5px 20px; font-size: 1.1em; color: #fff; text-decoration: none; border: 1px solid #fff; border-radius: 5px;}
.addLine .class-box div.ck a:hover{ background-color: #00858C;}
.addLine .class-box div.pcsr a:hover{ background-color: #0B408C;}
.addLine .class-box .pcsr a:last-child:hover{ background-color: #F7B029;}
.addLine .class-box div.books a:hover{ background-color: #B12028;}
.addLine .class-box div.cek a:hover{ background-color: #F7B029;}

/* 主要資訊選單 */
nav .nav-wrap{ width:1280px; position: relative;z-index: 90;margin: 0 auto;}
nav .menu-wrap{ display: flex;}
nav .menu-allexam{ width: 17%; background-color: #009590; border-radius: 15px 0 0 0;overflow: hidden;}
nav .menu-allexam>a{ padding: 0 20px; display: block; height: 50px; font-size: 17px; color: #fff; display: flex; justify-content:flex-start; align-items: center; text-decoration: none;}
nav .menu-allexam>a i{ margin-right: 5px;}
nav .menu-allexam>a:hover{ background-color: #00B3AD;}

nav .menu-bar{ width: 83%; border-radius: 0 15px 0 0; background-color: #009590; position: relative;}
nav .menu-bar a{ text-decoration: none;}
nav .menu-bar>ul{ display: flex;border-radius: 15px 15px 0 0; background-color: #009590;}
nav .menu-bar>ul>li{ width: 15%; border-left: 1px solid #fff; text-align: center; position: relative;}
nav .menu-bar>ul>li>a{ display: block; height: 50px; font-size: 17px; color: #fff; display: flex; justify-content: center; align-items: center;}
nav .menu-bar>ul>li>a:hover{ background-color: #00B3AD;}
nav .menu-bar>ul>li>a i{ font-size: 20px; padding-left: 12px;}
nav .menu-bar>ul>li>ul.active {background: '#00b0aa';display: block;}
nav .menu-bar .menu-bar-subtitle{ display: none; position: absolute; top: 100%; width: 100%; background-color: #00b0aa; z-index: 10;}
nav .menu-bar .menu-bar-subtitle li a{ display: block; padding: 10px 0; color: #fff;}
nav .menu-bar .menu-bar-subtitle li a:hover{ background-color: #009590;}

/* 考試介紹大選單 */
nav .allexam-subtitle.active {display: flex;}
nav .allexam-subtitle{display: none; width: 100%; align-items: stretch;}
nav .allexam-subtitle>ul{ width:17%; background-color: #23D9BD;top: 0; left: 0;}
nav .allexam-subtitle>ul>li{ border-bottom: 1px solid #fff;}
nav .allexam-subtitle>ul>li>a{ display: block; padding: 10px 15px; text-decoration: none; font-size: 1em; color: #000; position: relative;}
nav .allexam-subtitle>ul>li>a::after{ content: "\f0da"; font-family: "Font Awesome 5 Free"; font-weight: 900; color: #fff; position: absolute; right: 15px;}
nav .allexam-subtitle>ul>li>a:hover{ background-color: #FA8C16;}

nav .allexam-subtitle{position: absolute;width: 100%;}
nav .allexam-subtitle>div{ padding: 15px; width: 83%; background-color: #EEF6F3; display: flex; flex-wrap: wrap;}
nav .allexam-subtitle .examItemList>div{width: 100%;display: none;flex-wrap: wrap;}
nav .allexam-subtitle .examItemList .active {display: flex;}
nav .allexam-subtitle .allexam-box{ width: 22%; margin:15px;}
nav .allexam-subtitle .allexam-box h3{ margin-bottom: 5px; padding-bottom: 10px; font-size: 17px; font-weight: 700; color: #333; border-bottom: 1px dashed #999;}
nav .allexam-subtitle .allexam-box ul li{ padding: 5px 0;}
nav .allexam-subtitle .allexam-box ul li a{ text-decoration: none; color: #333; font-size: 1em; position: relative;}
nav .allexam-subtitle .allexam-box ul li a::after{ content: ""; width: 0; height: 1px; background-color: #333; position: absolute; bottom: -2px; left: 1px; transition: all .3s linear;}
nav .allexam-subtitle .allexam-box ul li a:hover::after{ width: 100%; height: 1px;}

/* 考情文字訊息輪播 */
.hotnews{ padding:0 calc((100% - 1280px)/2);}
.hotnews>div{ padding: 15px 0; background-color: #F5F5F5; display: flex;}
.hotnews .text{ width: 88%; padding-left: 15px;}
.hotnews .text a{ color: #333; text-decoration: none;}
.hotnews .text a:hover{ text-decoration: underline;}
.hotnews .control{ padding: 0 15px; width: 15%; display: flex; align-items: baseline;}
.hotnews .control-title{ visibility: hidden;}
.hotnews .control-bar{ display: flex; align-items: baseline;}
.hotnews .control-bar p{ margin-right: 10px; color: #666;}
.hotnews .control-bar button{ padding: 2px; width: 45px; font-size: 1.1em; color: #868686; background-color: #fff; border: 1px solid #868686; cursor: pointer;}
.hotnews .control-bar button.up{ border-radius: 50px 0 0 50px; border-right: 0px;}
.hotnews .control-bar button.down{ border-radius: 0 50px 50px 0;}
.hotnews .slick-next,.hotnews .slick-prev{ display: none;}

/* 社群媒體 */
footer .social_links{ padding: 30px 0; text-align: center; display: flex; justify-content: center;}
footer .social_links a{ text-decoration: none; margin: 0 5px;}
footer .social_links a img{ max-width: 100%;}

/* footer */
footer .site_links{ padding: 40px calc((100% - 1200px)/2); background-color: #003945;}
footer .site_links>div{ display: flex; justify-content: space-between;}
footer .site_links>div .box{ width: 15%;}
footer .site_links>div .box .type-title{ padding-bottom: 10px; font-size: 1.1em; color: #23D9BD; font-weight: 700;}
footer .site_links>div .box ul li a{ display: block; margin: 6px 0; text-decoration: none; color: #fff;}
footer .site_links>div .box ul li a:hover{ text-decoration: underline;}
footer .copyright{ padding: 15px 5%; text-align: center; background-color: #00303A; font-size: 14px; color: #fff;}

/* ===== other ====================================================================================== */
@media(max-width:1279px){

  header .top{ padding:0; display: none;}
  nav .nav-wrap{ padding:0; display: none;}

  /* 行動版TOP選單區 */
  .mobile-top{ display: block; width: 100%;}
  .mobile-top .mobile-nav{ width: 100%; height: 60px; display: flex; justify-content: space-between; align-items: center; background-color: #fff; position: relative;}
  /* 行動版TOP選單區-考試總覽+其他選單 */
  .mobile-top .mobile-nav .m-menu-allexam{ padding: 0 15px; width: 24%;}
  .mobile-top .mobile-nav .m-menu-allexam a{ font-size: 1.5em; color: #00858C;}
  .hc-offcanvas-nav .nav-container, .hc-offcanvas-nav .nav-wrapper, .hc-offcanvas-nav ul { background: #00858C;}
  .hc-offcanvas-nav .nav-content>h2 {color: #fff;}
  .hc-offcanvas-nav .nav-wrapper>.nav-content>ul:first-of-type>li:first-child:not(.nav-back):not(.nav-close)>.nav-item-wrapper>.nav-item-link,.hc-offcanvas-nav .nav-item-link, .hc-offcanvas-nav a.nav-next{border-color:#fff}
  /* .hc-offcanvas-nav a.nav-next */
  .hc-offcanvas-nav.nav-levels-none li.level-open,
  .hc-offcanvas-nav .nav-back a,  .hc-offcanvas-nav .nav-back a:hover{ background: #006d73; border-color: #fff;}
  .hc-offcanvas-nav .nav-item-link{font-size: 16px;}

  /* 行動版TOP選單區-公職王LOGO */
  .mobile-top .mobile-nav .m-logo{ display: flex; align-items: center;}
  .mobile-top .mobile-nav .m-logo img{ margin: 0 auto; max-height: 50px;}
  /* 行動版TOP選單區-線上客服+會員登入 */
  .mobile-top .mobile-nav .m-user-serve{ width: 24%; display: flex; justify-content:flex-end; align-items: center;}
  .mobile-top .mobile-nav .m-user-serve>a{ margin: 0 5px; width: 32px; height: 32px; color: #fff; background-color: #23D9BD; border-radius: 50%; display: flex; flex-shrink: 0; justify-content: center; align-items: center; text-decoration: none;}
  .mobile-top .mobile-nav .m-user-serve .muser-main{ display: none; position: absolute; top: 60px; left: 0; width: 100%; background-color: #fff; z-index: 20;
  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.3);/* x偏移量 | y偏移量 | 陰影模糊半徑 | 陰影擴散半徑 | 阴影颜色 */}
  .mobile-top .mobile-nav .m-user-serve .muser-main li{ font-size: 15px;}
  .mobile-top .mobile-nav .m-user-serve .muser-main li:first-child{ padding: 8px 10px; color: #FA8C16;}
  .mobile-top .mobile-nav .m-user-serve .muser-main li:nth-child(even){ background-color: #f1f1f1;}
  .mobile-top .mobile-nav .m-user-serve .muser-main li a{ display: block; padding: 8px 10px; text-decoration: none; color: #333; }
  .mobile-top .mobile-nav .m-user-serve .muser-main li:last-child a{ color: #009590;}
  /* 行動版TOP選單區-搜尋 */
  .mobile-top .m-search{ width: 100%; padding: 10px; display: flex; background: #21c4a9; background: -moz-linear-gradient(top,  #21c4a9 0%, #23d9bd 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  #21c4a9 0%,#23d9bd 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  #21c4a9 0%,#23d9bd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */}
  .mobile-top .m-search input,button{ outline:none; border: 0; font-size:15px;}
  .mobile-top input{ width:89%; padding:10px 15px; border-radius: 50px 0 0 50px; color: #333;}
  .mobile-top button{ width:11%; border-radius: 0 50px 50px 0; background-color: #fff; color: #23D9BD; cursor: pointer;}
  .mobile-top button i{ font-size: 1.1em;}

  /* 考情文字訊息輪播 */
  .hotnews{ padding:0;}

  /* footer */
  footer .site_links{ padding: 40px 5%;}
}

/* ===== phone ========================================================================================= */
@media(max-width:820px){

  header .top{ padding:0; display: none;}
  nav .nav-wrap{ padding:0; display: none;}

  /* 行動版TOP選單區 */
  .mobile-top{ display: block; width: 100%;}
  .mobile-top .mobile-nav{ width: 100%; height: 60px; display: flex; justify-content: space-between; align-items: center; background-color: #fff; position: relative;}
  /* 行動版TOP選單區-考試總覽+其他選單 */
  .mobile-top .mobile-nav .m-menu-allexam{ padding: 0 15px; width: 24%;}
  .mobile-top .mobile-nav .m-menu-allexam a{ font-size: 1.5em; color: #00858C;}

  /* 行動版TOP選單區-公職王LOGO */
  .mobile-top .mobile-nav .m-logo{ display: flex; align-items: center;}
  .mobile-top .mobile-nav .m-logo img{ margin: 0 auto; max-height: 50px;}
  /* 行動版TOP選單區-線上客服+會員登入 */
  .mobile-top .mobile-nav .m-user-serve{ width: 24%; display: flex; justify-content:flex-end; align-items: center;}
  .mobile-top .mobile-nav .m-user-serve>a{ margin: 0 5px; width: 32px; height: 32px; color: #fff; background-color: #23D9BD; border-radius: 50%; display: flex; flex-shrink: 0; justify-content: center; align-items: center;}
  .mobile-top .mobile-nav .m-user-serve .muser-main{ display: none; position: absolute; top: 60px; left: 0; width: 100%; background-color: #fff; z-index: 20; 
  box-shadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.3);/* x偏移量 | y偏移量 | 陰影模糊半徑 | 陰影擴散半徑 | 阴影颜色 */}
  .mobile-top .mobile-nav .m-user-serve .muser-main li{ font-size: 15px;}
  .mobile-top .mobile-nav .m-user-serve .muser-main li:first-child{ padding: 8px 10px; color: #FA8C16;}
  .mobile-top .mobile-nav .m-user-serve .muser-main li:nth-child(even){ background-color: #f1f1f1;}
  .mobile-top .mobile-nav .m-user-serve .muser-main li a{ display: block; padding: 8px 10px; text-decoration: none; color: #333; }
  .mobile-top .mobile-nav .m-user-serve .muser-main li:last-child a{ color: #009590;}
  /* 行動版TOP選單區-搜尋 */
  .mobile-top .m-search{ width: 100%; padding: 10px; display: flex; background: #21c4a9; background: -moz-linear-gradient(top,  #21c4a9 0%, #23d9bd 100%); /* FF3.6-15 */
  background: -webkit-linear-gradient(top,  #21c4a9 0%,#23d9bd 100%); /* Chrome10-25,Safari5.1-6 */
  background: linear-gradient(to bottom,  #21c4a9 0%,#23d9bd 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */}
  .mobile-top .m-search input,button{ outline:none; border: 0; font-size:15px;}
  .mobile-top input{ width:89%; padding:10px 15px; border-radius: 50px 0 0 50px; color: #333;}
  .mobile-top button{ width:11%; border-radius: 0 50px 50px 0; background-color: #fff; color: #23D9BD; cursor: pointer;}
  .mobile-top button i{ font-size: 1.1em;}

  /* 線上LINE客服燈箱展開頁面 */
  .lightWrap{ display: none;}
  .lightWrap .lightContent{ padding: 30px 15px; width: 100%;}
  .wrapbkg .lightWrap{ position:fixed; top: 0; left: 0; z-index:9999; height: 100%; width: 100%; justify-content: center; align-items:flex-start; display: flex;}
  .wrapbkg .closeLight{ position: absolute; top:15px; right:15px; width: 30px; height: 30px;}
  .addLine .public-box{ flex-wrap: wrap; justify-content: center;}
  .addLine .public-box .pic{ width: 100%;}
  .addLine .public-box .text{ margin-left: 0; font-size: 1.2em; line-height: 1.6;}
  .addLine .public-box .text a{ font-size: 17px;}
  .addLine .class-box{ margin: 15px 0 0;}
  .addLine .class-box h3{ padding-bottom: 5px; font-size: 1em;}
  .addLine .class-box div a{ margin: 5px 2px; padding: 5px 8px; font-size: 15px;}

  /* 考情文字訊息輪播 */
  .hotnews>div{ padding: 10px 0; display: flex; flex-wrap: wrap;}
  .hotnews .text{ padding:0 8px; width: 100%; order: 2;}
  .hotnews .text a{ line-height: 1.5;}
  .hotnews .control{ padding: 0 8px 5px; width: 100%; font-size: 15px; justify-content:space-between; order: 1;}
  .hotnews .control-title{ visibility:visible; color: #fff; padding: 2px 10px 2px 5px; background-color: #FA8C16; font-size: 12px; border-radius: 0 10px 10px 0;}
  .hotnews .control-bar{ display: flex; align-items: baseline;}
  .hotnews .control-bar button{ padding: 2px; width: 35px; font-size: 1em;}

  /* footer */
  footer .site_links{ padding: 30px 6%;}
  footer .site_links>div{ flex-wrap: wrap;}
  footer .site_links>div .box{ width: 100%;}
  footer .site_links>div .box .type-title{ padding: 10px 0 5px; font-size: 17px;}
  footer .site_links>div .box ul{ display: flex; flex-wrap: wrap;}
  footer .site_links>div .box ul li{ width: 33%;}
  footer .site_links>div .box ul li a{ margin: 4px 0; font-size: 15px; }
  footer .copyright{ font-size: 13px; line-height: 1.5;}

}
@media(max-width:600px){

  /* 考情文字訊息輪播 */
  .hotnews .text{ font-size: 15px;}
  .hotnews .control{ font-size: 14px;}
  .hotnews .control button{ font-size: 14px;}

}