@charset "UTF-8";
@import url(https://fonts.googleapis.com/earlyaccess/notosanstc.css);
@import url(https://fonts.googleapis.com/css?family=Open+Sans:400,700&display=swap);
/*-------------------------------------------*\
  iehack.scss
	
  Use
  @include hack($IE-ver),目前使用IE10以上
\*-------------------------------------------*/
/*-------------------------------------------------------------------------------*/
/*    $Main                                                                                     */
/*-------------------------------------------------------------------------------*/
.contents_wrap::after,
.main_content::after,
.main_body::after {
  content: "";
  display: table;
  clear: both; }

@media (min-width: 813px) {
  .contents_wrap {
    padding: 4rem 0; } }

.main_top {
  margin-bottom: 1rem; }
  @media (min-width: 813px) {
    .main_top {
      display: flex;
      justify-content: space-between; } }

.main_tit {
  padding: 0 0 .5em;
  font-family: sans-serif, "Noto Sans TC";
  font-size: 2.125em;
  font-weight: 600;
  line-height: 1;
  color: #080404; }
  @media (max-width: 991px) {
    .main_tit {
      text-align: center;
      padding: .5em 0; } }

.main_body, .center_body {
  min-height: 30rem; }

/*-------------------------------------------*\
	Switcher.scss
	
	Index
	- 1.breadcrumbs
\*-------------------------------------------*/
.social_skip {
  position: absolute;
  top: -1rem;
  left: calc(50% - 7rem);
  text-align: center; }
  @media (min-width: 813px) {
    .social_skip {
      top: .5rem;
      left: -14.5rem; } }
  .social_skip a {
    display: block;
    width: 1px;
    height: 1px;
    color: #757575;
    white-space: nowrap;
    opacity: 0; }
    .social_skip a:focus {
      width: auto;
      height: auto;
      padding: .25rem;
      opacity: 1;
      transition: all 0.3s ease-in-out; }

.contents_function {
  text-align: center; }
  .contents_function_inner {
    position: relative;
    display: flex;
    width: calc((40px + 1rem) * 3);
    margin: 0 auto; }
    @media (min-width: 576px) {
      .contents_function_inner {
        width: calc((48px + 1rem) * 3); } }
  @media (min-width: 813px) {
    .contents_function {
      margin-left: auto; } }

.circle_style, .switcher, .social_links a {
  display: block;
  width: 40px;
  height: 40px;
  line-height: 40px;
  border-radius: 50%;
  margin: .5rem;
  color: rgba(255, 255, 255, 0);
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.25); }
  .circle_style:focus, .switcher:focus, .social_links a:focus {
    outline: 2px dotted #bfa6ff; }

.switcher {
  background-position: center;
  background-repeat: no-repeat;
  transition: all 0.3s ease-in-out; }
  @media (min-width: 576px) {
    .switcher {
      width: 48px;
      height: 48px;
      line-height: 48px; } }

.sc_font {
  background-color: rgba(125, 0, 0, 0.85);
  background-image: url(../../images/tc_font_change_btn.svg); }
  .sc_font_change {
    background-image: url(../../images/tc_font_change_btn_.svg); }
  .sc_font_bigger {
    font-size: 120%;
    transition: all 0.3s ease-in-out; }

.sc_print {
  background-color: rgba(175, 120, 45, 0.85);
  background-image: url(../../images/tc_print_btn.svg); }

.sc_social {
  background-color: rgba(175, 120, 45, 0.85);
  background-image: url(../../images/tc_social_btn.svg); }

.social_links {
  position: absolute;
  z-index: 10;
  top: calc(40px + 1rem);
  right: 0;
  display: flex;
  flex-direction: column;
  visibility: hidden;
  height: 0;
  opacity: 0;
  transition: all 0.3s ease-in-out; }
  .social_links::after {
    content: "";
    display: table;
    clear: both; }
  @media (min-width: 576px) {
    .social_links a {
      width: 48px;
      height: 48px;
      line-height: 48px; } }

.sc_social-open + .social_links {
  visibility: visible;
  height: auto;
  opacity: 1; }

.social_links1 {
  background: url(../../images/social_links1.svg) no-repeat center center #3e65b7; }

.social_links2 {
  background: url(../../images/social_links2.svg) no-repeat center center #db5635; }

.social_links3 {
  background: url(../../images/social_links3.svg) no-repeat center center #55acee; }

.social_links4 {
  background: url(../../images/social_links4.svg) no-repeat center center #db6320; }

.social_links5 {
  background: url(../../images/social_links5.svg) no-repeat center center #50c900; }

.no-js .main_top {
  flex-direction: column; }

.no-js .contents_function noscript {
  display: block;
  width: 70%;
  margin-left: auto;
  line-height: 1.5;
  text-align: left;
  font-size: 0.875em; }
  .no-js .contents_function noscript a {
    display: inline-block;
    padding: .125rem .75rem;
    color: white;
    background-color: #7d0000; }

.no-js .contents_function_inner {
  margin: 0;
  margin-left: auto; }

/*-------------------------------------------*\
	Breadcrumbs.scss
	
	Index
	- 1.breadcrumbs
\*-------------------------------------------*/
.breadcrumbs {
  position: relative; }

.breadcrumbs_u {
  padding: 1rem 0; }
  .breadcrumbs_u li {
    display: inline-block;
    margin: .5rem 0;
    font-size: 0.875em;
    letter-spacing: .15rem;
    color: #757575; }
    .breadcrumbs_u li:not(:last-child):after {
      content: "/";
      margin: 0 .25rem; }
    .breadcrumbs_u li a {
      display: inline-block;
      color: #757575; }
      .breadcrumbs_u li a:hover {
        text-decoration: underline; }
    .breadcrumbs_u li:last-child a {
      color: #af782d; }
