@charset "UTF-8";
/*-------------------------------------------------------------------------------*/
/*    $Main                                                                                     */
/*-------------------------------------------------------------------------------*/
.contents_wrap::after,
.contents_inner::after,
.main_content::after,
.main_body::after {
  content: "";
  display: table;
  clear: both; }
#aSkip{
 text-indent: 100%;
white-space: nowrap;
overflow: hidden;
}
@media (min-width: 576px) {
 .contents_wrap {
    background-image: url(../../images/main_bg/content-background.png);
    background-repeat: no-repeat;
    background-position: top center; }
   .contents_wrap_v1 {
    background-image: url(../../images/main_bg/content-background_v1.png);
    background-repeat: no-repeat;
    background-position: top center; } 
  .contents_wrap_v2 {
    background-image: url(../../images/main_bg/content-background_v2.png);
    background-repeat: no-repeat;
    background-position: top center; }
     .contents_wrap_v3 {
    background-image: url(../../images/main_bg/content-background_v3.png);
    background-repeat: no-repeat;
    background-position: top center; } 
     .contents_wrap_v4 {
    background-image: url(../../images/main_bg/content-background_v4.png);
    background-repeat: no-repeat;
    background-position: top center; } 
      .contents_wrap_v5 {
    background-image: url(../../images/main_bg/content-background_v5.png);
    background-repeat: no-repeat;
    background-position: top center; }  
  }

@media (min-width: 768px) {
 .contents_wrap {
    background-image: url(../../images/main_bg/content-background.png); }
  .contents_wrap_v1 {
  background-image: url(../../images/main_bg/content-background_v1.png); } 
 .contents_wrap_v2 {
    background-image: url(../../images/main_bg/content-background_v2.png); }
     .contents_wrap_v3 {
  background-image: url(../../images/main_bg/content-background_v3.png); } 
 .contents_wrap_v4 {
    background-image: url(../../images/main_bg/content-background_v4.png); }
    .contents_wrap_v5 {
    background-image: url(../../images/main_bg/content-background_v5.png); }
     }


.contents_inner,.contents-inner-full {
  margin: 0 -10px; }

  @media (min-width: 576px) {
    .contents_inner,.contents-inner-full {
      padding-top: 8rem; } 

    }
  @media (min-width: 1024px) {
    .contents_inner,.contents-inner-full {
      margin: 0;
      padding-top: 9.375rem;
      padding-bottom: 3rem; } 
    }

.contents_inner_full {
  margin: 0 -10px; }
  .contents_inner_full .side_tit {
    display: none; }
  @media (min-width: 576px) {
    .contents_inner_full {
      padding-top: 8rem; } }
  @media (min-width: 768px) {
    .contents_inner_full {
      padding: 3.4375rem .625rem 3rem; }
      .contents_inner_full .side_tit {
        display: block; } }


/*-----主體區-----*/
.main_wrap {
  display: block;
  overflow: hidden; }
  @media (min-width: 1024px) {
    .main_wrap {
      padding-top: 54px;
      /*padding-left: 1rem;*/ } }

.main_tit {
  position: relative;
  padding: 1rem;
  font-size: 1.5rem; }
  .main_tit:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -1px;
    display: block;
    width: 30px;
    height: 1px; }

.main_body {
  min-height: 30rem;
      background-color: #fff; }

/*-------------------------------------------------------------------------------*/
/*    $SideMenu                                                                             */
/*-------------------------------------------------------------------------------*/
.side_wrap {
  display: none; }
  @media (min-width: 1024px) {
    .side_wrap {
      display: block;
      position: relative;
      float: left;
      width: 23%;
      min-width: 200px; } }
   

/*----- 側邊標題-----*/
.side_tit {
  display: block;
  padding: 14px 15px 38px 15px;
  line-height: 1.2;
  font-size: 2rem;
  font-weight: bold;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap; 
text-shadow: 0px 1px 10px #0f0a20, 0px 1px 20px #0f0a20;}

/*----- Base-----*/
.sidenav_u1 {
  display: block; }
  .sidenav_u1:first-child li a {
    border-bottom: none; }
  .sidenav_u1 a {
    position: relative;
    display: block;
    padding: 1.2rem 1rem 1.2rem 2.35rem;
    line-height: 1.2;
    word-wrap: break-word;
    word-break: break-all; }
    .sidenav_u1 a:before {
      content: '';
      position: absolute;
      top: 1.5rem;
      width: 5px;
      height: 8px;
      background-image: url(../../images/sideNav-icon.png);
      background-repeat: no-repeat; }
    .sidenav_u1 a:hover {
      transition: .25s; }

/*----- 第一層-----*/
.sidenav_u1 > li > a:before {
  left: 1.5rem;
  background-position: left top; }

.sidenav_u1 > li > a:hover:before, .sidenav_u1 > li > a.active:before {
  background-position: 0 bottom; }

.sidenav_u1 > li:first-child > a {
  padding-top: 22px;
  border-top: 1px solid transparent; }

  .sidenav_u1 > li:first-child a:before {
    top: calc(1.25rem + 4px); }
  .sidenav_u1 > li:first-child > a:before {
    top: calc(1.25rem + 8px); }
/*.sidenav_u1 > li:first-child > a:hover {
-webkit-border-top-left-radius: 6px;
-webkit-border-top-right-radius: 6px;
-moz-border-radius-topleft: 6px;
-moz-border-radius-topright: 6px;
border-top-left-radius: 6px;
border-top-right-radius: 6px; }*/
/*----- 第二層-----*/
.sidenav_u2 > li > a {
  padding-left: 3.35rem; }
  .sidenav_u2 > li > a:before {
    left: 2.5rem;
    background-position: -10px top; }
  .sidenav_u2 > li > a:hover:before, .sidenav_u2 > li > a.active:before {
    background-position: -10px bottom; }

/*----- 第三層-----*/
.sidenav_u3 > li > a {
  padding-left: 4.35rem; }
  .sidenav_u3 > li > a:before {
    left: 3.65rem;
    background-position: -20px top; }
  .sidenav_u3 > li > a:hover:before, .sidenav_u3 > li > a.active:before {
    background-position: -20px bottom; }
.sidenav_u1 li  a:focus{
  outline:#fff dotted 1px;
}
/*-------------------------------------------------------------------------------*/
/*    $Switcher                                                                              */
/*-------------------------------------------------------------------------------*/
.social_wrap::after {
  content: "";
  display: table;
  clear: both; }

.social_inner::after {
  content: "";
  display: table;
  clear: both; }

.social_inner > a {
  display: block;
  float: left;
  width: calc(100% / 5);
  height: 46px;
  text-align: center; }
  .social_inner > a.switcher {
    display: none; }
.social_inner a:focus{
  outline:#fff dotted 1px;
  text-decoration:underline;

}

@media (min-width: 576px) {
  .social_inner {
    position: relative; }
    .social_inner a {
      width: 12.5%;
      height: 40px;
      line-height: 40px; }
      .social_inner a.switcher {
        display: block; }
      .social_inner a.switcher_print {
        display: none; }
      .social_inner a:nth-child(-n+4) {
        font-size: 0.875rem; } }

@media (min-width: 1024px) {
  .social_inner {
    float: right;
    margin-bottom: 10px; }
    .social_inner a {
      width: 50px;
      height: 26px;
      line-height: 26px; }
      .social_inner a.switcher_print {
        display: block; } }

/*@media (min-width: 992px) {
  .social_inner a {
    width: 60px; } }*/

/*----- social_links-----*/
.social_links, .switcher_print {
  position: relative;
  font: 0/0 a;
  color: white;
  text-shadow: none;
  background-color: transparent;
  border: 0; }
  .social_links:focus, .switcher_print:focus, .social_links:hover, .switcher_print:hover {
    transition: all 0.3s ease; }
  .social_links:before, .switcher_print:before {
    content: "";
    position: absolute;
    top: calc(50% - 10px);
    left: calc(50% - 20px);
    display: block;
    width: 40px;
    height: 20px;
    background-repeat: no-repeat;
    background-position: center center; }

/*----- social icon -----*/
.social_icon1 {
  background-color: #00a2e5; }
  .social_icon1:focus, .social_icon1:hover {
    background-color: #007eb2; }
  .social_icon1:before {
    background-image: url("../../images/social_icon1.svg"); }

.social_icon2 {
  background-color: #1a49ad; }
  .social_icon2:focus, .social_icon2:hover {
    background-color: #10378c; }
  .social_icon2:before {
    background-image: url("../../images/social_icon2.svg"); }

.social_icon3 {
  background-color: #e61500; }
  .social_icon3:focus, .social_icon3:hover {
    background-color: #bd1100; }
  .social_icon3:before {
    background-image: url("../../images/social_icon3.svg"); }

.social_icon4 {
  background-color: #0066ff; }
  .social_icon4:focus, .social_icon4:hover {
    background-color: #0050c9; }
  .social_icon4:before {
    background-image: url("../../images/social_icon4.svg"); }

.social_icon5 {
  background-color: #d63c00; }
  .social_icon5:focus, .social_icon5:hover {
    background-color: #b53300; }
  .social_icon5:before {
    background-image: url("../../images/social_icon5.svg"); }

.social_icon6 {
  background-color: #338200; }
  .social_icon6:focus, .social_icon6:hover {
    background-color: #1f4e00; }
  .social_icon6:before {
    background-image: url("../../images/social_icon6.svg"); }

/*----- print icon -----*/
.switcher_print:before {
  background-image: url("../../images/social_print.svg"); }

/*------skip-------*/
.social_skip {
  position: absolute;
  top: -1rem; }
  .social_skip a {
    display: block;
    width: 1rem;
    height: 1rem;
    color: rgba(255, 255, 255, 0); }
    .social_skip a:focus {
      outline: 1px solid #bfa6ff; }

/*========no-js ========*/
.no-js .social_wrap + noscript {
  position: relative;
  display: block;
  padding: 1rem;
  padding: 1rem;
  line-height: 1.5;
  margin: 0;
  z-index: 2; }
  .no-js .social_wrap + noscript a {
    color: white; }
    .no-js .social_wrap + noscript a:after {
      content: "│";
      color: white; }
    .no-js .social_wrap + noscript a:hover {
      color: #e6e6e6; }

/*-------------------------------------------------------------------------------*/
/*    $Breadcrumbs                                                                      */
/*-------------------------------------------------------------------------------*/
.breadcrumbs {
  position: relative;
  background-image: url(../../images/Breadcrumbs-bg1.png);
  background-repeat: no-repeat;
  background-position: left top;
  background-size: contain; }

.breadcrumbs_u {
  padding: 1.4rem 1rem; }
  .breadcrumbs_u li {
    display: inline;
    font-size: 0.875rem;
    letter-spacing: .15rem; }
    .breadcrumbs_u li:last-child a {
      pointer-events: none; }
    .breadcrumbs_u li:before {
      content: ">"; }
    .breadcrumbs_u li:first-child:before {
      content: ""; }
  @media (min-width: 576px) {
    .breadcrumbs_u {
      padding: 1.4em 2em; } }
  @media (min-width: 768px) {
    .breadcrumbs_u a:hover {
      text-decoration: underline; } }
/*Breadcrumbs  no-js*/
.no-js .breadcrumbs{
  background-image: none;
}
.no-js .breadcrumbs_u{
  padding: 1.4rem 1rem;
}
/*-------------------------------------------------------------------------------*/
/*    $MainFoot                                                                              */
/*-------------------------------------------------------------------------------*/
.mfoot_btn_warp{
  display: none;
}
.mfoot {
  padding: 0rem;
  font-size: 0.875rem; }
  .mfoot::after {
    content: "";
    display: table;
    clear: both; }
  .mfoot_inner {
    margin: 0 auto;
    padding: 1rem;
    text-align: left;
    line-height: 1.2; }
    .mfoot_inner span {
      display: block; }
  .mfoot_btn {
    display: none; }

@media (min-width: 576px) {
  .mfoot {
  padding: 1rem;
}
  .mfoot_inner {
    float: left; }
    .mfoot_inner span {
      display: inline; }
  .mfoot_time:after {
    content: "│";
    padding: 0 .25rem; }
  .mfoot_btn {
    float: right;
    display: block;
    width: 140px;
    line-height: 1.2;
    padding: 1rem .5rem;
    text-align: center; } 
    .mfoot_btn_warp{
      display: block;
      float: right;
     width: 100%;
     /*padding: 0 1rem 1rem;*/
    }

  }

@media (min-width: 1024px) {
  .mfoot {
    /*padding-top: 1rem;*/
    padding: 1rem 0 0; } }
@media (min-width: 976px) {
   .mfoot_btn_warp{
    width: inherit;
    padding: 0;
   }
}

/*-------------------------------------------------------------------------------*/
/*    $Theme_Main                                                                        */
/*-------------------------------------------------------------------------------*/
.tc_contents_wrap, .tc_main_content {
  position: relative;
  background-color: #fff;
}

.tc_main_tit {
  color: rgba(0, 0, 0, 0.85);
  background-color: #fff;
  border-bottom: 1px solid rgba(2, 36, 77, 0.3); }
  .tc_main_tit:before {
    border-bottom: 1px solid #c30032; }

/*-------------------------------------------------------------------------------*/
/*    $Theme_sidemenu                                                               */
/*-------------------------------------------------------------------------------*/
@keyframes sidefocusbg {
  from {
    background-color: #93939e; }
  to {
    background-color: rgba(147, 147, 158, 0); } }

.tc_side_tit {
  color: white; }

.tc_sidenav {
/*  -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;*/
 /*background-image: -webkit-radial-gradient(99% -50% ellipse, #BD47F2 10%, #0062FF 120%);
background-image: radial-gradient(ellipse at 99% -30%, rgba(189, 71, 242, 0.95) 20%, rgba(0, 98, 255, 0.85) 120%);*/
/*box-shadow: 1px -5px 26px rgba(16, 122, 194, 0.15);
-webkit-box-shadow: 1px -5px 26px rgba(16, 122, 194, 0.15);
-moz-box-shadow: 1px -5px 26px rgba(16, 122, 194, 0.15);*/
background-color: #f8f9fa;

}
  .tc_sidenav a {
    color: #1b1b1b;
    border-top: 1px solid rgba(185, 185, 185, 0.2);
 }
    .tc_sidenav a:hover, .tc_sidenav a.active {
      color: black;
background: linear-gradient(to left, #efbb20, #f59d2c) ;
 }
    .tc_sidenav a:focus {
      outline: none;
      -webkit-animation-name: sidefocusbg;
      animation-name: sidefocusbg;
      -webkit-animation-duration: 1s;
      animation-duration: 1s; }

/*-------------------------------------------------------------------------------*/
/*    $Theme_Switcher                                                                 */
/*-------------------------------------------------------------------------------*/
/*------fontlevel-----*/
.tc_fontlevel, .tc_print {
  color: white; }

.tc_fontlevel {
  background-color: rgba(0, 48, 85, 0.7) }
  .tc_fontlevel:focus, .tc_fontlevel:hover {
    background-color:#0069eb }

.tc_print {
  background-color: #d6204e; }
  .tc_print:focus, .tc_print:hover {
    background-color: #c60032; }

/*------active-----*/
.tc_fontlevel.active {
  background-color: #0069eb; }

/*-------------------------------------------------------------------------------*/
/*    $Theme_Breadcrumbs                                                         */
/*-------------------------------------------------------------------------------*/
.tc_breadcrumbs {
  background-color: rgba(2, 36, 77, 1); 
}
  .tc_breadcrumbs_u li a, .tc_breadcrumbs_u li:before {
    color: rgba(255, 255, 255, 0.65); }
  .tc_breadcrumbs_u li a:hover {
    color: rgba(255, 255, 255, 0.85); }
  .tc_breadcrumbs_u li:last-child a {
    color: white; }
  @media (min-width: 576px) {
.tc_breadcrumbs {
  background-color: rgba(2, 36, 77, 0.86); 
}
}
  @media (min-width: 1024px) {
    .tc_breadcrumbs { 
/*-webkit-border-top-left-radius: 6px;
-webkit-border-top-right-radius: 6px;
-moz-border-radius-topleft: 6px;
-moz-border-radius-topright: 6px;
border-top-left-radius: 6px;
border-top-right-radius: 6px;*/
}
  }
/*-------------------------------------------------------------------------------*/
/*    $Theme_Mainfoot                                                                  */
/*-------------------------------------------------------------------------------*/

.tc_mfoot {
  color: rgba(0, 0, 0, 0.65);
  background-color: #f1f3f5;
} 
  @media (min-width: 1024px) {
    .tc_mfoot {
      border-top: 1px solid #adb5bd;
      background: none; } }

.tc_mfoot_btn {
  color: rgba(255, 255, 255, 1);
  background-color: #c30032; 
  -webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px; }
  .tc_mfoot_btn:focus, .tc_mfoot_btn:hover {
    background-color: #c51c47; }
  .tc_mfoot_btn:hover {
    color: #fff;}

.mfoot_fb{
 color: #fff;
  background-color: #4867aa;
display: inline-block;
  padding-left: 32px;
  background:#4867aa url(../../images/mfoot_fb.svg) no-repeat 8px  center;
  -webkit-border-radius: 4px;
-moz-border-radius: 4px;
border-radius: 4px;
margin: 0 auto;
    float: initial;
} 
.mfoot_fb:focus,.mfoot_fb:hover{
  background-color: #395484;
}
.mfoot_fb:focus{
  outline:#02244d dotted 1px;
  text-decoration:underline;
}
  @media (min-width: 1024px) {
    .mfoot_fb{
      margin: initial;
    float: right;
    }
  }