/*!**********************************************************************************************************************************************************************************************************************************************************!*\
  !*** css ./node_modules/css-loader/dist/cjs.js??ruleSet[1].rules[0].use[1]!./node_modules/postcss-loader/dist/cjs.js??ruleSet[1].rules[0].use[2]!./node_modules/sass-loader/dist/cjs.js??ruleSet[1].rules[0].use[3]!./resources/src/css/home/audio.scss ***!
  \**********************************************************************************************************************************************************************************************************************************************************/
@charset "UTF-8";
.col_list {
  -webkit-column-count: 4;
     -moz-column-count: 4;
          column-count: 4;
  -webkit-column-gap: 1.875rem;
     -moz-column-gap: 1.875rem;
          column-gap: 1.875rem; }
  @media screen and (max-width: 820px) {
    .col_list {
      -webkit-column-count: 2;
         -moz-column-count: 2;
              column-count: 2;
      -webkit-column-gap: 1.125rem;
         -moz-column-gap: 1.125rem;
              column-gap: 1.125rem; } }
  .col_list.layout_row {
    -webkit-column-count: 3;
       -moz-column-count: 3;
            column-count: 3;
    -webkit-column-gap: 2rem;
       -moz-column-gap: 2rem;
            column-gap: 2rem;
    padding-top: 0.9375rem; }
    @media screen and (max-width: 820px) {
      .col_list.layout_row {
        -webkit-column-count: 1;
           -moz-column-count: 1;
                column-count: 1;
        -webkit-column-gap: 0;
           -moz-column-gap: 0;
                column-gap: 0; } }
    .col_list.layout_row .col_li {
      padding: 0; }
    .col_list.layout_row .col_link {
      text-align: center;
      padding-top: 0.5625rem;
      padding-bottom: 0.5rem;
      border-top: 0.0625rem solid #e2f4f9; }
      @media screen and (max-width: 820px) {
        .col_list.layout_row .col_link {
          padding-top: 1.25rem;
          padding-bottom: 1.125rem; } }
    .col_list.layout_row .col_pic {
      display: none; }
    .col_list.layout_row .col_caption,
    .col_list.layout_row .col_title {
      padding: 0; }

.col_li {
  page-break-inside: avoid;
  -webkit-column-break-inside: avoid;
     -moz-column-break-inside: avoid;
          break-inside: avoid;
  padding-top: 0.9375rem;
  padding-bottom: 1.25rem; }
  @media screen and (max-width: 820px) {
    .col_li {
      padding-bottom: 1.875rem; } }

.col_link {
  -webkit-transition: opacity .1s ease-out;
  transition: opacity .1s ease-out; }
  @media screen and (min-width: 951px) {
    .col_link:after {
      content: "";
      width: calc(100% + 4px);
      height: calc(100% + 4px);
      border: 2px dotted #fff;
      border-radius: 0.1875rem;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      position: absolute;
      top: -2px;
      left: -2px;
      z-index: 5;
      opacity: 0;
      -webkit-transition: opacity 0.1s ease-out;
      transition: opacity 0.1s ease-out; }
    .col_link:focus:after {
      opacity: 1; } }
  .col_link:hover {
    opacity: .5; }

.col_caption {
  padding-top: 0.6875rem; }

.tw .col_caption {
  padding-top: 0.8125rem; }

.tw .col_title {
  line-height: 1.17; }

.col_title {
  font-size: 2.875rem;
  letter-spacing: -0.125rem;
  font-weight: normal;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  padding-bottom: 0.0625em; }
  @media screen and (max-width: 820px) {
    .col_title {
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis; } }

.col_title_tw {
  font-size: 2.5625rem;
  font-weight: bold;
  letter-spacing: -0.125rem;
  line-height: 1.17;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis; }

.button,
.btn_link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border: 0.125rem solid #f2e0e8;
  border-radius: 2.125rem;
  font-size: 1.625rem;
  letter-spacing: 0;
  color: #f2e0e8;
  white-space: nowrap;
  background: transparent;
  padding: 0.4375rem 1.5625rem 0.1875rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }
  @media screen and (max-width: 820px) {
    .button,
    .btn_link {
      font-size: 2.75rem;
      letter-spacing: 0;
      padding-top: 1rem;
      padding-bottom: 0.25rem; } }
  .button.active, .button:hover,
  .btn_link.active,
  .btn_link:hover {
    color: #000;
    background: #f2e0e8; }

.button {
  font-family: "NewEdge666-Regular", "Noto Serif TC", "微軟正黑體", "蘋果儷黑體", Arial, sans-serif, Verdana;
  line-height: 1;
  padding: 0.4375rem 0.5625rem 0.1875rem;
  border-radius: 0;
  -webkit-transition: all .1s ease-out;
  transition: all .1s ease-out;
  cursor: pointer; }
  @media screen and (max-width: 820px) {
    .button {
      padding-top: 1rem;
      padding-bottom: 0.25rem; } }

.more_btn_link, .bottom_links_col .btn_link {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  border: 0.125rem solid #f2e0e8;
  color: #f2e0e8;
  font-size: 6.625rem;
  font-weight: normal;
  font-family: "NewEdge666-RegularRounded", "GenWanMin-SB", "NewEdge666-Regular", "Noto Serif TC", "微軟正黑體", "蘋果儷黑體", Arial, sans-serif, Verdana;
  letter-spacing: -0.3125rem;
  padding-top: 1.8125rem;
  padding-bottom: 0.3125rem;
  border-radius: 6.25rem;
  position: relative; }
  @media screen and (min-width: 951px) {
    .more_btn_link:after, .bottom_links_col .btn_link:after {
      content: "";
      width: calc(100% + 4px);
      height: calc(100% + 4px);
      border: 2px dotted #fff;
      border-radius: 0.1875rem;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      position: absolute;
      top: -2px;
      left: -2px;
      z-index: 5;
      opacity: 0;
      -webkit-transition: opacity 0.1s ease-out;
      transition: opacity 0.1s ease-out; }
    .more_btn_link:focus:after, .bottom_links_col .btn_link:focus:after {
      opacity: 1; } }
  @media screen and (max-width: 820px) {
    .more_btn_link, .bottom_links_col .btn_link {
      font-size: 2.75rem;
      letter-spacing: 0;
      padding-top: 1rem;
      padding-bottom: 0.25rem; } }
  .more_btn_link:hover, .bottom_links_col .btn_link:hover {
    color: #000;
    background: #f2e0e8; }
  .more_btn_link .mobile_show, .bottom_links_col .btn_link .mobile_show {
    display: none; }
    @media screen and (max-width: 820px) {
      .more_btn_link .mobile_show, .bottom_links_col .btn_link .mobile_show {
        display: inline; } }

.tw .more_btn_link, .tw .bottom_links_col .btn_link, .bottom_links_col .tw .btn_link {
  font-size: 5.5625rem;
  letter-spacing: -0.1875rem;
  padding-top: 2.3125rem;
  padding-bottom: 0.875rem; }
  @media screen and (max-width: 820px) {
    .tw .more_btn_link, .tw .bottom_links_col .btn_link, .bottom_links_col .tw .btn_link {
      font-size: 2.75rem;
      letter-spacing: 0;
      padding-top: 1rem;
      padding-bottom: 0.25rem; } }

.musicroom_btn {
  width: 23.5rem; }
  @media screen and (max-width: 820px) {
    .musicroom_btn {
      width: 33.75rem; } }

.smallworldjournal_btn {
  width: 26rem; }
  @media screen and (max-width: 820px) {
    .smallworldjournal_btn {
      width: 33.75rem; } }

.tab_row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center; }
  @media screen and (max-width: 820px) {
    .tab_row {
      -ms-flex-wrap: wrap;
          flex-wrap: wrap;
      margin-left: -0.5rem;
      margin-right: -0.5rem; } }

.tab_col {
  padding: 0.5625rem;
  -webkit-box-sizing: border-box;
          box-sizing: border-box; }
  @media screen and (max-width: 820px) {
    .tab_col {
      padding: 0.5rem;
      -webkit-box-flex: 1;
          -ms-flex: 1;
              flex: 1; } }
  .tab_col .btn_link {
    min-width: 7.875rem;
    text-transform: uppercase; }
    @media screen and (min-width: 951px) {
      .tab_col .btn_link:after {
        content: "";
        width: calc(100% + 4px);
        height: calc(100% + 4px);
        border: 2px dotted #fff;
        border-radius: 0.1875rem;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        position: absolute;
        top: -2px;
        left: -2px;
        z-index: 5;
        opacity: 0;
        -webkit-transition: opacity 0.1s ease-out;
        transition: opacity 0.1s ease-out; }
      .tab_col .btn_link:focus:after {
        opacity: 1; } }

.bottom_links_row {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  margin-left: -0.5rem;
  margin-right: -0.5rem; }

.bottom_links_col {
  padding: 0.6875rem 0.5rem 0.75rem; }
  @media screen and (max-width: 820px) {
    .bottom_links_col {
      -webkit-box-flex: 0;
          -ms-flex: 0 0 100%;
              flex: 0 0 100%; }
      .bottom_links_col:nth-child(1), .bottom_links_col:nth-child(2), .bottom_links_col:nth-child(3), .bottom_links_col:nth-child(4) {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 50%;
                flex: 0 0 50%;
        -webkit-box-sizing: border-box;
                box-sizing: border-box; }
      .bottom_links_col.w_auto {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 auto;
                flex: 0 0 auto; }
      .bottom_links_col.w_fill {
        -webkit-box-flex: 0;
            -ms-flex: 0 0 100%;
                flex: 0 0 100%; }
      .bottom_links_col .musicroom_btn {
        width: 100%; } }
  .bottom_links_col .btn_link {
    padding-left: 4.875rem;
    padding-right: 4.875rem; }
    @media screen and (max-width: 820px) {
      .bottom_links_col .btn_link {
        padding-left: 1.25rem;
        padding-right: 1.25rem; } }

.breadcrumb {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -ms-flex-wrap: wrap;
      flex-wrap: wrap;
  margin-left: -0.875rem;
  margin-right: -0.875rem;
  margin-bottom: 0.625rem; }
  .breadcrumb ul {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: wrap;
        flex-wrap: wrap; }
  .breadcrumb li {
    font-size: 1rem;
    line-height: 1.5;
    padding: 0 0.875rem;
    position: relative; }
    .breadcrumb li::after {
      content: '>';
      position: absolute;
      top: 50%;
      right: 0;
      -webkit-transform: translate(50%, -53%);
          -ms-transform: translate(50%, -53%);
              transform: translate(50%, -53%); }
    .breadcrumb li:last-child::after {
      display: none; }
  @media screen and (min-width: 951px) {
    .breadcrumb a:after {
      content: "";
      width: calc(100% + 4px);
      height: calc(100% + 4px);
      border: 2px dotted #fff;
      border-radius: 0.1875rem;
      -webkit-box-sizing: border-box;
              box-sizing: border-box;
      position: absolute;
      top: -2px;
      left: -2px;
      z-index: 5;
      opacity: 0;
      -webkit-transition: opacity 0.1s ease-out;
      transition: opacity 0.1s ease-out; }
    .breadcrumb a:focus:after {
      opacity: 1; } }
  .breadcrumb a::before {
    content: '';
    width: 100%;
    height: 1px;
    background: #000;
    position: absolute;
    bottom: 0;
    left: 0;
    -webkit-transform: scale(0);
        -ms-transform: scale(0);
            transform: scale(0);
    -webkit-transition: -webkit-transform .2s ease-out;
    transition: -webkit-transform .2s ease-out;
    transition: transform .2s ease-out;
    transition: transform .2s ease-out, -webkit-transform .2s ease-out; }
  .breadcrumb a:focus::before, .breadcrumb a:hover::before {
    -webkit-transform: scale(1);
        -ms-transform: scale(1);
            transform: scale(1); }
  .breadcrumb .fa-magnifying-glass {
    display: none; }

@media screen and (max-width: 820px) {
  .list_col_sec {
    padding-top: 12.5rem; } }

@media screen and (max-width: 480px) {
  .col_list {
    -webkit-column-count: 1;
       -moz-column-count: 1;
            column-count: 1;
    -webkit-column-gap: 0;
       -moz-column-gap: 0;
            column-gap: 0; } }

.col_item {
  text-align: center;
  padding: 2.5rem 0;
  border-bottom: 1px solid #e2f4f9;
  position: relative; }

.col_txt {
  font-size: 1.6875rem;
  line-height: 1.15;
  margin-top: 1rem; }

.col_hover {
  width: 100%;
  height: 100%;
  background: #000;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  font-size: 1.5rem;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  opacity: 0;
  display: none; }
  .col_hover .col_close_btn {
    width: 1.875rem;
    height: 1.875rem;
    position: absolute;
    top: 0rem;
    right: 0rem; }
    .col_hover .col_close_btn:before, .col_hover .col_close_btn:after {
      content: "";
      display: block;
      width: 100%;
      height: 0.125rem;
      border-radius: 0.1875rem;
      position: absolute;
      left: 0;
      top: 50%;
      margin-top: -0.0625rem;
      background: #e2f4f9;
      -webkit-transition: all 0.4s ease-out;
      transition: all 0.4s ease-out; }
    .col_hover .col_close_btn:before {
      -webkit-transform: rotate(-45deg);
          -ms-transform: rotate(-45deg);
              transform: rotate(-45deg); }
    .col_hover .col_close_btn:after {
      -webkit-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
              transform: rotate(45deg); }
    .col_hover .col_close_btn:hover:before {
      -webkit-transform: rotate(45deg);
          -ms-transform: rotate(45deg);
              transform: rotate(45deg); }
    .col_hover .col_close_btn:hover:after {
      -webkit-transform: rotate(-45deg);
          -ms-transform: rotate(-45deg);
              transform: rotate(-45deg); }
  .col_hover .col_close_btn_inner {
    height: 100%;
    position: relative; }
    @media screen and (min-width: 951px) {
      .col_hover .col_close_btn_inner:after {
        content: "";
        width: calc(100% + 4px);
        height: calc(100% + 4px);
        border: 2px dotted #fff;
        border-radius: 0.1875rem;
        -webkit-box-sizing: border-box;
                box-sizing: border-box;
        position: absolute;
        top: -2px;
        left: -2px;
        z-index: 5;
        opacity: 0;
        -webkit-transition: opacity 0.1s ease-out;
        transition: opacity 0.1s ease-out; }
      .col_hover .col_close_btn_inner:focus:after {
        opacity: 1; } }

.col_link:focus, .col_link:hover {
  opacity: 1; }

.tab_row {
  margin-bottom: 0.0625rem; }
  @media screen and (max-width: 820px) {
    .tab_row {
      margin-bottom: 4.375rem; } }

.more_btn {
  margin-top: 4.0625rem; }
  @media screen and (max-width: 820px) {
    .more_btn {
      margin-top: 1.25rem; } }

.bottom_links_row {
  padding: 5rem 0; }

.loading_icon {
  width: 50px;
  margin: 0 auto;
  -webkit-animation: loading_icon 1s infinite steps(8);
          animation: loading_icon 1s infinite steps(8); }

@-webkit-keyframes loading_icon {
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }

@keyframes loading_icon {
  100% {
    -webkit-transform: rotate(0deg);
            transform: rotate(0deg); }
  100% {
    -webkit-transform: rotate(360deg);
            transform: rotate(360deg); } }


/*# sourceMappingURL=audio.min.css.map*/