/* Minification failed. Returning unminified contents.
(26,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(27,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(28,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(29,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(30,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(31,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(56,10): run-time error CSS1030: Expected identifier, found '.'
(56,27): run-time error CSS1031: Expected selector, found ')'
(56,27): run-time error CSS1025: Expected comma or open brace, found ')'
(60,10): run-time error CSS1030: Expected identifier, found '.'
(60,27): run-time error CSS1031: Expected selector, found ')'
(60,27): run-time error CSS1025: Expected comma or open brace, found ')'
(293,15): run-time error CSS1030: Expected identifier, found '.'
(293,28): run-time error CSS1031: Expected selector, found ')'
(293,28): run-time error CSS1025: Expected comma or open brace, found ')'
(320,26): run-time error CSS1039: Token not allowed after unary operator: '-countdown-bg'
(384,26): run-time error CSS1039: Token not allowed after unary operator: '-countdown-timer-bg'
(399,32): run-time error CSS1039: Token not allowed after unary operator: '-countdown-timer-border'
(409,15): run-time error CSS1039: Token not allowed after unary operator: '-countdown-num'
(477,19): run-time error CSS1030: Expected identifier, found '.'
(477,35): run-time error CSS1031: Expected selector, found ')'
(477,35): run-time error CSS1025: Expected comma or open brace, found ')'
(485,19): run-time error CSS1030: Expected identifier, found '.'
(485,35): run-time error CSS1031: Expected selector, found ')'
(485,35): run-time error CSS1025: Expected comma or open brace, found ')'
(994,8): run-time error CSS1030: Expected identifier, found '.'
(994,15): run-time error CSS1031: Expected selector, found ')'
(994,15): run-time error CSS1025: Expected comma or open brace, found ')'
(998,21): run-time error CSS1030: Expected identifier, found '.'
(998,28): run-time error CSS1031: Expected selector, found ')'
(998,28): run-time error CSS1025: Expected comma or open brace, found ')'
(1246,25): run-time error CSS1030: Expected identifier, found '.'
(1246,28): run-time error CSS1031: Expected selector, found ')'
(1246,28): run-time error CSS1025: Expected comma or open brace, found ')'
(1292,35): run-time error CSS1030: Expected identifier, found '.'
(1292,42): run-time error CSS1031: Expected selector, found ')'
(1292,42): run-time error CSS1025: Expected comma or open brace, found ')'
(1296,48): run-time error CSS1030: Expected identifier, found ','
(1297,55): run-time error CSS1031: Expected selector, found ')'
(1297,55): run-time error CSS1025: Expected comma or open brace, found ')'
(1309,17): run-time error CSS1030: Expected identifier, found '.'
(1309,24): run-time error CSS1031: Expected selector, found ')'
(1309,24): run-time error CSS1025: Expected comma or open brace, found ')'
(1412,22): run-time error CSS1039: Token not allowed after unary operator: '-hover-color'
(1413,26): run-time error CSS1039: Token not allowed after unary operator: '-hover-color'
(1857,10): run-time error CSS1030: Expected identifier, found '.'
(1857,25): run-time error CSS1031: Expected selector, found ')'
(1857,25): run-time error CSS1025: Expected comma or open brace, found ')'
(2293,63): run-time error CSS1030: Expected identifier, found '['
(2293,66): run-time error CSS1031: Expected selector, found '^='
(2293,66): run-time error CSS1025: Expected comma or open brace, found '^='
(2790,12): run-time error CSS1030: Expected identifier, found '.'
(2790,29): run-time error CSS1031: Expected selector, found ')'
(2790,29): run-time error CSS1025: Expected comma or open brace, found ')'
(2794,12): run-time error CSS1030: Expected identifier, found '.'
(2794,40): run-time error CSS1031: Expected selector, found ')'
(2794,40): run-time error CSS1025: Expected comma or open brace, found ')'
(3251,17): run-time error CSS1030: Expected identifier, found '.'
(3251,30): run-time error CSS1031: Expected selector, found ')'
(3251,30): run-time error CSS1025: Expected comma or open brace, found ')'
(3474,28): run-time error CSS1030: Expected identifier, found '.'
(3474,35): run-time error CSS1031: Expected selector, found ')'
(3474,35): run-time error CSS1025: Expected comma or open brace, found ')'
(3519,10): run-time error CSS1030: Expected identifier, found '.'
(3519,15): run-time error CSS1031: Expected selector, found ')'
(3519,15): run-time error CSS1025: Expected comma or open brace, found ')'
(3523,10): run-time error CSS1030: Expected identifier, found '.'
(3523,17): run-time error CSS1031: Expected selector, found ')'
(3523,17): run-time error CSS1025: Expected comma or open brace, found ')'
(3527,23): run-time error CSS1030: Expected identifier, found '.'
(3527,30): run-time error CSS1031: Expected selector, found ')'
(3527,30): run-time error CSS1025: Expected comma or open brace, found ')'
(3704,28): run-time error CSS1039: Token not allowed after unary operator: '-hover-color'
(3708,17): run-time error CSS1039: Token not allowed after unary operator: '-hover-color'
 */
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+TC:wght@100..900&family=Work+Sans:wght@100..900&display=swap');

article,aside,details,figcaption,figure,footer,header,hgroup,main,nav,section,summary{display:block;}audio,canvas,video{display:inline-block;}audio:not([controls]){display:none;height:0;}[hidden]{display:none;}html{font-family:sans-serif;-ms-text-size-adjust:100%;-webkit-text-size-adjust:100%;}body{margin:0;}a:focus{outline:thin dotted;}a:active,a:hover{outline:0;}h1{font-size:2em;margin:0.67em 0;}abbr[title]{border-bottom:1px dotted;}b,strong{font-weight:bold;}dfn{font-style:italic;}hr{-moz-box-sizing:content-box;box-sizing:content-box;height:0;}mark{background:#ff0;color:#000;}code,kbd,pre,samp{font-family:monospace,serif;font-size:1em;}pre{white-space:pre-wrap;}q{quotes:"\201C" "\201D" "\2018" "\2019";}small{font-size:80%;}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline;}sup{top:-0.5em;}sub{bottom:-0.25em;}img{border:0;}svg:not(:root){overflow:hidden;}figure{margin:0;}fieldset{border:1px solid #c0c0c0;margin:0 2px;padding:0.35em 0.625em 0.75em;}legend{border:0;padding:0;}button,input,select,textarea{font-family:inherit;font-size:100%;margin:0;}button,input{line-height:normal;}button,select{text-transform:none;}button,html input[type="button"],input[type="reset"],input[type="submit"]{-webkit-appearance:button;cursor:pointer;}button[disabled],html input[disabled]{cursor:default;}input[type="checkbox"],input[type="radio"]{box-sizing:border-box;padding:0;}input[type="search"]{-webkit-appearance:textfield;-moz-box-sizing:content-box;-webkit-box-sizing:content-box;box-sizing:content-box;}input[type="search"]::-webkit-search-cancel-button,input[type="search"]::-webkit-search-decoration{-webkit-appearance:none;}button::-moz-focus-inner,input::-moz-focus-inner{border:0;padding:0;}textarea{overflow:auto;vertical-align:top;}table{border-collapse:collapse;border-spacing:0;}

/**
 * Swiper 4.4.2
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * http://www.idangero.us/swiper/
 *
 * Copyright 2014-2018 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: November 1, 2018
 */
.swiper-container{margin:0 auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1}.swiper-container-no-flexbox .swiper-slide{float:left}.swiper-container-vertical>.swiper-wrapper{-webkit-box-orient:vertical;-webkit-box-direction:normal;-webkit-flex-direction:column;-ms-flex-direction:column;flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform;-webkit-box-sizing:content-box;box-sizing:content-box}.swiper-container-android .swiper-slide,.swiper-wrapper{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)}.swiper-container-multirow>.swiper-wrapper{-webkit-flex-wrap:wrap;-ms-flex-wrap:wrap;flex-wrap:wrap}.swiper-container-free-mode>.swiper-wrapper{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out;margin:0 auto}.swiper-slide{-webkit-flex-shrink:0;-ms-flex-negative:0;flex-shrink:0;width:100%;height:100%;position:relative;-webkit-transition-property:-webkit-transform;transition-property:-webkit-transform;-o-transition-property:transform;transition-property:transform;transition-property:transform,-webkit-transform}.swiper-slide-invisible-blank{visibility:hidden}.swiper-container-autoheight,.swiper-container-autoheight .swiper-slide{height:auto}.swiper-container-autoheight .swiper-wrapper{-webkit-box-align:start;-webkit-align-items:flex-start;-ms-flex-align:start;align-items:flex-start;-webkit-transition-property:height,-webkit-transform;transition-property:height,-webkit-transform;-o-transition-property:transform,height;transition-property:transform,height;transition-property:transform,height,-webkit-transform}.swiper-container-3d{-webkit-perspective:1200px;perspective:1200px}.swiper-container-3d .swiper-cube-shadow,.swiper-container-3d .swiper-slide,.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top,.swiper-container-3d .swiper-wrapper{-webkit-transform-style:preserve-3d;transform-style:preserve-3d}.swiper-container-3d .swiper-slide-shadow-bottom,.swiper-container-3d .swiper-slide-shadow-left,.swiper-container-3d .swiper-slide-shadow-right,.swiper-container-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-container-3d .swiper-slide-shadow-left{background-image:-webkit-gradient(linear,right top,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(right,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-right{background-image:-webkit-gradient(linear,left top,right top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(left,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-top{background-image:-webkit-gradient(linear,left bottom,left top,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(bottom,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-3d .swiper-slide-shadow-bottom{background-image:-webkit-gradient(linear,left top,left bottom,from(rgba(0,0,0,.5)),to(rgba(0,0,0,0)));background-image:-webkit-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:-o-linear-gradient(top,rgba(0,0,0,.5),rgba(0,0,0,0));background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-container-wp8-horizontal,.swiper-container-wp8-horizontal>.swiper-wrapper{-ms-touch-action:pan-y;touch-action:pan-y}.swiper-container-wp8-vertical,.swiper-container-wp8-vertical>.swiper-wrapper{-ms-touch-action:pan-x;touch-action:pan-x}.swiper-button-next,.swiper-button-prev{position:absolute;top:50%;width:27px;height:44px;margin-top:-22px;z-index:10;cursor:pointer;background-size:27px 44px;background-position:center;background-repeat:no-repeat}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-prev,.swiper-container-rtl .swiper-button-next{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");left:10px;right:auto}.swiper-button-next,.swiper-container-rtl .swiper-button-prev{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23007aff'%2F%3E%3C%2Fsvg%3E");right:10px;left:auto}.swiper-button-prev.swiper-button-white,.swiper-container-rtl .swiper-button-next.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-white,.swiper-container-rtl .swiper-button-prev.swiper-button-white{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23ffffff'%2F%3E%3C%2Fsvg%3E")}.swiper-button-prev.swiper-button-black,.swiper-container-rtl .swiper-button-next.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M0%2C22L22%2C0l2.1%2C2.1L4.2%2C22l19.9%2C19.9L22%2C44L0%2C22L0%2C22L0%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-next.swiper-button-black,.swiper-container-rtl .swiper-button-prev.swiper-button-black{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20viewBox%3D'0%200%2027%2044'%3E%3Cpath%20d%3D'M27%2C22L27%2C22L5%2C44l-2.1-2.1L22.8%2C22L2.9%2C2.1L5%2C0L27%2C22L27%2C22z'%20fill%3D'%23000000'%2F%3E%3C%2Fsvg%3E")}.swiper-button-lock{display:none}.swiper-pagination{position:absolute;text-align:center;-webkit-transition:.3s opacity;-o-transition:.3s opacity;transition:.3s opacity;-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-container-horizontal>.swiper-pagination-bullets,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:10px;left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{-webkit-transform:scale(1);-ms-transform:scale(1);transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{-webkit-transform:scale(.66);-ms-transform:scale(.66);transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{-webkit-transform:scale(.33);-ms-transform:scale(.33);transform:scale(.33)}.swiper-pagination-bullet{width:8px;height:8px;display:inline-block;border-radius:100%;background:#000;opacity:.2}button.swiper-pagination-bullet{border:none;margin:0;padding:0;-webkit-box-shadow:none;box-shadow:none;-webkit-appearance:none;-moz-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet-active{opacity:1;background:#007aff}.swiper-container-vertical>.swiper-pagination-bullets{right:10px;top:50%;-webkit-transform:translate3d(0,-50%,0);transform:translate3d(0,-50%,0)}.swiper-container-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:6px 0;display:block}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;-webkit-transform:translateY(-50%);-ms-transform:translateY(-50%);transform:translateY(-50%);width:8px}.swiper-container-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;-webkit-transition:.2s top,.2s -webkit-transform;transition:.2s top,.2s -webkit-transform;-o-transition:.2s transform,.2s top;transition:.2s transform,.2s top;transition:.2s transform,.2s top,.2s -webkit-transform}.swiper-container-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 4px}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;-webkit-transform:translateX(-50%);-ms-transform:translateX(-50%);transform:translateX(-50%);white-space:nowrap}.swiper-container-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s left,.2s -webkit-transform;transition:.2s left,.2s -webkit-transform;-o-transition:.2s transform,.2s left;transition:.2s transform,.2s left;transition:.2s transform,.2s left,.2s -webkit-transform}.swiper-container-horizontal.swiper-container-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{-webkit-transition:.2s right,.2s -webkit-transform;transition:.2s right,.2s -webkit-transform;-o-transition:.2s transform,.2s right;transition:.2s transform,.2s right;transition:.2s transform,.2s right,.2s -webkit-transform}.swiper-pagination-progressbar{background:rgba(0,0,0,.25);position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:#007aff;position:absolute;left:0;top:0;width:100%;height:100%;-webkit-transform:scale(0);-ms-transform:scale(0);transform:scale(0);-webkit-transform-origin:left top;-ms-transform-origin:left top;transform-origin:left top}.swiper-container-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{-webkit-transform-origin:right top;-ms-transform-origin:right top;transform-origin:right top}.swiper-container-horizontal>.swiper-pagination-progressbar,.swiper-container-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:4px;left:0;top:0}.swiper-container-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-container-vertical>.swiper-pagination-progressbar{width:4px;height:100%;left:0;top:0}.swiper-pagination-white .swiper-pagination-bullet-active{background:#fff}.swiper-pagination-progressbar.swiper-pagination-white{background:rgba(255,255,255,.25)}.swiper-pagination-progressbar.swiper-pagination-white .swiper-pagination-progressbar-fill{background:#fff}.swiper-pagination-black .swiper-pagination-bullet-active{background:#000}.swiper-pagination-progressbar.swiper-pagination-black{background:rgba(0,0,0,.25)}.swiper-pagination-progressbar.swiper-pagination-black .swiper-pagination-progressbar-fill{background:#000}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:10px;position:relative;-ms-touch-action:none;background:rgba(0,0,0,.1)}.swiper-container-horizontal>.swiper-scrollbar{position:absolute;left:1%;bottom:3px;z-index:50;height:5px;width:98%}.swiper-container-vertical>.swiper-scrollbar{position:absolute;right:3px;top:1%;z-index:50;width:5px;height:98%}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:rgba(0,0,0,.5);border-radius:10px;left:0;top:0}.swiper-scrollbar-cursor-drag{cursor:move}.swiper-scrollbar-lock{display:none}.swiper-zoom-container{width:100%;height:100%;display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;text-align:center}.swiper-zoom-container>canvas,.swiper-zoom-container>img,.swiper-zoom-container>svg{max-width:100%;max-height:100%;-o-object-fit:contain;object-fit:contain}.swiper-slide-zoomed{cursor:move}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;-webkit-transform-origin:50%;-ms-transform-origin:50%;transform-origin:50%;-webkit-animation:swiper-preloader-spin 1s steps(12,end) infinite;animation:swiper-preloader-spin 1s steps(12,end) infinite}.swiper-lazy-preloader:after{display:block;content:'';width:100%;height:100%;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%236c6c6c'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E");background-position:50%;background-size:100%;background-repeat:no-repeat}.swiper-lazy-preloader-white:after{background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg%20viewBox%3D'0%200%20120%20120'%20xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg'%20xmlns%3Axlink%3D'http%3A%2F%2Fwww.w3.org%2F1999%2Fxlink'%3E%3Cdefs%3E%3Cline%20id%3D'l'%20x1%3D'60'%20x2%3D'60'%20y1%3D'7'%20y2%3D'27'%20stroke%3D'%23fff'%20stroke-width%3D'11'%20stroke-linecap%3D'round'%2F%3E%3C%2Fdefs%3E%3Cg%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(30%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(60%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(90%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(120%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.27'%20transform%3D'rotate(150%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.37'%20transform%3D'rotate(180%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.46'%20transform%3D'rotate(210%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.56'%20transform%3D'rotate(240%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.66'%20transform%3D'rotate(270%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.75'%20transform%3D'rotate(300%2060%2C60)'%2F%3E%3Cuse%20xlink%3Ahref%3D'%23l'%20opacity%3D'.85'%20transform%3D'rotate(330%2060%2C60)'%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E")}@-webkit-keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}@keyframes swiper-preloader-spin{100%{-webkit-transform:rotate(360deg);transform:rotate(360deg)}}.swiper-container .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-container-fade.swiper-container-free-mode .swiper-slide{-webkit-transition-timing-function:ease-out;-o-transition-timing-function:ease-out;transition-timing-function:ease-out}.swiper-container-fade .swiper-slide{pointer-events:none;-webkit-transition-property:opacity;-o-transition-property:opacity;transition-property:opacity}.swiper-container-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-fade .swiper-slide-active,.swiper-container-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube{overflow:visible}.swiper-container-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;-webkit-transform-origin:0 0;-ms-transform-origin:0 0;transform-origin:0 0;width:100%;height:100%}.swiper-container-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-cube.swiper-container-rtl .swiper-slide{-webkit-transform-origin:100% 0;-ms-transform-origin:100% 0;transform-origin:100% 0}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-cube .swiper-slide-active,.swiper-container-cube .swiper-slide-next,.swiper-container-cube .swiper-slide-next+.swiper-slide,.swiper-container-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-container-cube .swiper-slide-shadow-bottom,.swiper-container-cube .swiper-slide-shadow-left,.swiper-container-cube .swiper-slide-shadow-right,.swiper-container-cube .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0;width:100%;height:100%;background:#000;opacity:.6;-webkit-filter:blur(50px);filter:blur(50px);z-index:0}.swiper-container-flip{overflow:visible}.swiper-container-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-container-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-container-flip .swiper-slide-active,.swiper-container-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-container-flip .swiper-slide-shadow-bottom,.swiper-container-flip .swiper-slide-shadow-left,.swiper-container-flip .swiper-slide-shadow-right,.swiper-container-flip .swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-container-coverflow .swiper-wrapper{-ms-perspective:1200px}

@font-face {
  font-display: block;
  font-family: "bootstrap-icons";
  src: url("../fonts/bootstrap-icons.woff2") format("woff2"),
url("../fonts/bootstrap-icons.woff") format("woff");
}

:root{
  --hover-color: #E60050;
  --countdown-bg: #0B203B;
  --countdown-num: #FFDA49;
  --countdown-timer-border: #1C73D8;
  --countdown-timer-bg: rgba(18, 21, 86, 0.40);
  --program-color: #6F5E9F;
  scroll-padding-top: 80px;
}

html{
  font-size: 16px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
}

html, body{
  padding: 0;
  margin: 0;
}

body{
  font-family: 'Noto Sans TC', 'Microsoft JhengHei', Arial, Helvetica, sans-serif;
  color: #111;
  font-weight: 500;
  line-height: 1.4;
  overflow-x: hidden;
  background-color: #EBEBE6;
}

body:has(.overlay_box.show), body:has(.overlay_box.show) header{
  padding-right: 17px;
}

body:has(.overlay_box.show){
  overflow: hidden;
}

@supports (-webkit-hyphens:none){

  body:has(.overlay_box.show), body:has(.overlay_box.show) header{
    padding-right: 0;
  }

}

*,
*::before,
*::after{
  box-sizing: border-box;
}

a{
  color: #111;
  text-decoration: none;
  outline: none;
  behavior: expression(this.onFocus=this.blur());
}

a:focus{
  text-decoration: none;
  outline: none;
  behavior: expression(this.onFocus=this.blur());
}

a:link, a:active, a:visited, a:hover{
  text-decoration: none;
}

button{
  padding: 0;
  margin: 0;
  border: none;
  text-decoration: none;
  background-color: transparent;
  outline: none;
  behavior: expression(this.onFocus=this.blur());
}

button:link, button:active, button:visited, button:hover, button:focus{
  text-decoration: none;
  outline: none;
  behavior: expression(this.onFocus=this.blur());
}

ul, li{
  list-style: none;
  margin: 0;
  padding: 0;
}

img{
  display: block;
  max-width: 100%;
}

header{
  position: sticky;
  top: -38px;
  left: 0;
  width: 100%;
  box-shadow: 0px 4px 10px 0px rgba(0,0,0,0.15);
  background-color: #fff;
  z-index: 2500;
}

header .top_nav{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 38px;
  display: flex;
  align-items: center;
  padding: 0 24px;
  border-bottom: 1px solid #D9D9D9;
  background-color: #fff;
}

header .top_nav .container{
  display: flex;
  align-items: center;
  height: 100%;
}

header .top_nav_logo{
  display: flex;
  align-items: center;
  width: 113px;
  height: 100%;
  background: url(../img/ebc_logo.svg) no-repeat center / contain;
}

header .top_nav_logo img{
  display: block;
  height: 15px;
}

header .top_nav_title{
  color: #A8A8A8;
  font-size: 13px;
}

header .top_nav_title span{
  padding-right: 5px;
}

header .top_nav_logo + .top_nav_title{
  padding-left: 12px;
  margin-left: 12px;
  border-left: 1px solid #A8A8A8;
}

header .navigation{
  position: relative;
  padding-top: 38px;
}

nav ul{
  display: flex;
  justify-content: center;
  height: 54px;
}

nav ul *{
  height: 100%;
}

nav ul li a{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #37524F;
  font-size: 16px;
  padding: 16px 32px;
}

nav ul li a:hover{
  color: #002823;
  background-color: #EFECEA;
}

nav ul li a.active{
  color: #D2E1D7;
  background-color: #006E3C;
  pointer-events: none;
}

nav ul li a.disable{
  color: #CACACA;
  pointer-events: none;
}

nav ul li ul{
  display: none;
  height: auto !important;
  border-bottom: 1px solid #D9D9D9;
  background-color: #fff;
}

nav ul li:hover ul{
  display: block;
}

nav ul li ul li a{
  display: block;
  text-align: center;
  padding: 10px;
  border-top: 1px solid #D9D9D9;
}

.mobile_nav_wrap{
  display: none;
}

.banner img{
  width: 100%;
}

.container{
  max-width: 1200px;
  width: calc(100% - 48px);
  margin: 0 auto;
}

.main_box{
  padding: 32px 32px 60px 32px;
  background-color: #FAFAFA;
}

.img_wrap{
  position: relative;
  display: block;
  padding-bottom: 56.25%;
  border-radius: 4px;
  overflow: hidden;
}

.img_wrap img, .item_img img{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

main > h1{
  display: none;
}

.countdown_wrap{
  /*display: flex;*/
  display: none;
  justify-content: center;
  margin-bottom: 36px;
}

.countdown_wrap.hide{
  display: none;
}

.countdown_wrap.countdown_up{
  margin-top: -190px;
}

.main_box:has(.countdown_up){
  margin-top: 190px;
}

.countdown_box{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 950px;
  width: 100%;
  padding: 40px 55px 45px 55px;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0px 0px 20px 0px rgba(0, 0, 0, 0.2);
  background: url(../img/countdown_bg.jpg) no-repeat center / cover;
}

.countdown_box::after{
  /*content: '';*/
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  opacity: 0.8;
  z-index: 1;
  background-color: var(--countdown-bg);
}

.countdown{
  font-family: 'Roboto', 'Noto Sans TC';
  position: relative;
  width: 100%;
  color: #FAFAFA;
  z-index: 2;
}

.countdown_main{
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 14px;
}

.countdown_title{
  font-weight: bold;
}

.countdown_title h1{
  position: relative;
  line-height: 1;
  padding: 32px 15px 3px 0;
  margin: 0;
}

.countdown_title h1 .year{
  position: absolute;
  top: 0;
  left: 0;
  font-size: 24px;
}

.countdown_title h1 span{
  display: block;
}

.countdown_title h1 .cn{
  font-size: 38px;
  font-weight: bold;
  margin-bottom: 5px;
}

.countdown_title h1 .cn span{
  display: inline;
  font-size: 42px;
}

.countdown_title h1 .en{
  font-size: 21px;
  letter-spacing: -0.2px;
}

.countdown_timer{
  display: flex;
  color: #fff;
  font-size: 36px;
  font-weight: 500;
  padding: 0 6px;
  border-radius: 6px;
  border: 1px solid transparent;
  background-color: var(--countdown-timer-bg);
}

.countdown_timer .col_box{
  position: relative;
  text-align: center;
  padding: 20px 24px;
}

.countdown_timer .col_box::after{
  content: '';
  position: absolute;
  top: 15%;
  right: 0;
  height: 70%;
  border-right: 1px solid var(--countdown-timer-border);
}

.countdown_timer .col_box:last-child::after{
  display: none;
}

.countdown_timer .col_box div:nth-child(1){
  min-width: 70px;
  min-height: 60px;
  color: var(--countdown-num);
  font-size: 60px;
  line-height: 1;
  font-weight: 900;
}

.countdown_timer .col_box div:nth-child(2){
  font-size: 12px;
  margin-top: 4px;
}

.countdown_placard{
  display: flex;
  width: 100%;
  color: #B8D9FF;
  font-size: 16px;
  justify-content: flex-end;
  align-items: center;
  line-height: 1;
}

.countdown_placard div{

}

/*.countdown_placard::before, .countdown_placard::after{
  content: '';
  flex-grow: 1;
  margin-top: 1px;
  border-bottom: 1px solid #DDDDDD;
}*/

.countdown_link{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3;
}

.main_content{
  display: grid;
  grid-template-columns: 300px minmax(0, auto);
  column-gap: 40px;
  padding-top: 14px;
}

.hero_slider_box{
  position: relative;
  width: 100%;
  margin-bottom: 40px;
  grid-column: 2 / 3;
  grid-row: 1 / 2;
}

.hero_slider_box .swiper-container{
  border-radius: 16px;
}

.sidebar{
  grid-column: 1 / 2;
}

.sidebar_sticky{
  position: sticky;
}

.main_content:has(.hero_slider_box) .sidebar{
  grid-row: 1 / 3;
}

.content{
  grid-column: 2 / 3;
}

.main_content:has(.hero_slider_box) .content{
  grid-row: 2 / 3;
}

@-moz-document url-prefix(){
  .sidebar{
    grid-row: 1 / 3;
  }
}

.swiper-container *:focus{
  text-decoration: none;
  outline: none; /* for Firefox Google Chrome  */
  behavior: expression(this.onFocus=this.blur()); /* for IE */
}

.swiper-pagination *:focus, .swiper-button-prev:focus, .swiper-button-next:focus{
  text-decoration: none;
  outline: none; /* for Firefox Google Chrome  */
  behavior: expression(this.onFocus=this.blur()); /* for IE */
}

.hero_slider{
  background-color: #ccc;
}

.hero_slider img{
  display: block;
}

.hero_slider .swiper-slide a{
  position: relative;
  display: block;
  padding-bottom: 56.25%;
}

.hero_slider .swiper-slide a::after{
  content: '';
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  box-sizing: border-box;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0) 60%);
  z-index: 2;
}

.hero_slider .swiper-slide a img{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
}

.hero_slider .hero_text{
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  padding: 32px;
  box-sizing: border-box;
  z-index: 3;
}

.hero_slider .hero_text .hero_label{
  position: relative;
  display: inline-block;
  color: #fff;
  font-size: 15px;
  padding: 6px 16px;
  margin-bottom: 10px;
}

.hero_slider .hero_text .hero_label::after{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 140%;
  height: 100%;
  background: linear-gradient(270deg, rgba(255, 204, 2, 0) 0%, rgba(255, 204, 2, 0) 30%, #ffcc02 100%);
  transform: skewX(-8deg);
  z-index: -1;
}

.hero_slider .hero_text .hero_title{
  position: relative;
  display: -webkit-box;
  box-sizing: border-box;
  color: #fff;
  font-size: 24px;
  font-weight: 700;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin: 0;
}

.swiper-button-next, .swiper-button-prev{
  display: flex;
  justify-content: center;
  align-items: center;
  top: 0;
  width: 50px;
  height: 100%;
  margin-top: 0;
  background: none;
}

.swiper-button-next{
  right: 0;
}

.swiper-button-prev{
  left: 0;
}

.swiper-button-next::before, .swiper-button-prev::before{
  color: #fff;
  font-size: 34px;
  text-shadow: 0 0 6px rgba(0,0,0,0.8);
}

.swiper-button-prev::before {
  font-family: 'bootstrap-icons';
  content: '\f284';
}

.swiper-button-next::before{
  font-family: 'bootstrap-icons';
  content: '\f285';
}

.hero_slider_box .swiper-pagination{
  bottom: -28px;
  width: 100%;
  text-align: center;
}

.hero_slider_box .swiper-pagination-bullet{
  width: 28px;
  height: 4px;
  margin: 0 4px;
  border-radius: 2px;
  opacity: 1;
  background-color: rgba(138, 149, 160, 0.3);
}

.hero_slider_box .swiper-pagination-bullet.swiper-pagination-bullet-active{
  pointer-events: none;
  background-color: #E60050;
}

.section{
  position: relative;
  margin-bottom: 32px;
}

.section.has_more_btn .btn_box{
  margin: 16px 0;
}

.section_title, .section_tab_list{
  color: #004B32;
  font-size: 22px;
  font-weight: 700;
  margin: 0 0 16px 0;
  border-bottom: 2px solid #EFECEA;
  -webkit-text-stroke: 0.1px;
}

.section_title span, .section_tab{
  display: inline-block;
  padding-bottom: 8px;
  margin-bottom: -2px;
  border-bottom: 2px solid #E60050;
}

.section_tab_list{
  display: flex;
  justify-content: center;
}

.section_tab_list.align_left{
  justify-content: flex-start;
}

.section_tab{
  color: #C1C3CC;
  font-weight: 700;
  margin: 0 12px -2px 12px;
  border-color: transparent;
}

.section_tab:hover{
  color: #111111;
}

.section_tab.active{
  color: #111111;
  border-color: #E60050;
}

.section_tab_list.align_left .section_tab{
  margin-left: 0;
}

.section_tab_content{
  display: none;
}

.section_tab_content.active{
  display: block;
}

.list{
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 26px 24px;
  margin-bottom: 32px;
}

.sidebar .list{
  display: block;
  border-radius: 16px;
  border: 1px solid #DBDEE8;
  overflow: hidden;
  background-color: #fff;
}

.item{
  background-color: #fff;
  cursor: pointer;
}

.item:hover{
  background-color: #F2F3F7;
}

.content .item{
  border-radius: 16px;
  border: 1px solid #E0E0E0;
  overflow: hidden;
  transition: box-shadow 0.16s;
}

.item, .item.col3{
  grid-column: auto / span 4;
}

.item.col1{
  grid-column: auto / span 12;
  display: flex;
}

.item.col2{
  grid-column: auto / span 6;
}

.item.col4{
  grid-column: auto / span 3;
}

.item.col1 .item_img{
  flex: 0 0 57%;
  padding-bottom: 32%;
  margin-bottom: 0;
}

.item.col1 .item_text{
  padding: 12px 16px;
}

.item_img{
  position: relative;
  display: block;
  padding-bottom: 56.25%;
  overflow: hidden;
  background-color: #545e6f;
}

.item.video .item_img::before{
  font-family: 'bootstrap-icons';
  content: '\f4f4';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 64px;
  height: 64px;
  display: flex;
  justify-content: center;
  align-items: center;
  color: #fff;
  font-size: 40px;
  padding-left: 4px;
  border: 2px solid #fff;
  border-radius: 50%;
  transform: translate(-50%, -50%);
  background-color: rgba(0,0,0,0.2);
  z-index: 10;
  transition: transform 0.26s, background-color 0.26s;
}

.item.video:hover .item_img::before{
  transform: translate(-50%, -55%);
  background-color: rgba(0,0,0,0.7);
}

.sidebar .item{
  position: relative;
  display: flex;
  flex-wrap: nowrap !important;
  padding: 12px !important;
  margin-bottom: 0;
  border-bottom: 1px solid #DBDEE8;
}

.sidebar .item:last-child{
  border-bottom: none;
}

.sidebar .item_img{
  flex: 0 0 72px !important;
  height: 72px;
  padding: 0 !important;
  border-radius: 8px;
}

.item_text{
  flex-grow: 1;
  padding: 8px 10px;
}

.sidebar .item_text{
  padding: 0;
  padding-left: 8px;
}

.item_title{
  display: -webkit-box;
  font-size: 16px;
  font-weight: 700;
  overflow: hidden;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin: 0 0 9px 0;
}

.sidebar .item_title{
  font-size: 15px;
}

.item:hover .item_title{
  color: #57606C;
}

.item.col1 .item_title{
  font-size: 20px;
  -webkit-line-clamp: 3;
}

.item.text_box .item_title{
  font-size: 15px;
  font-weight: 400;
  margin-bottom: 8px;
}

.item_preview{
  display: -webkit-box;
  color: #5D5D62;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.55;
  overflow: hidden;
  -webkit-line-clamp: 5;
  -webkit-box-orient: vertical;
  margin-bottom: 10px;
}

.item_date{
  display: flex;
  color: #A8A8A8;
  font-size: 13px;
  line-height: 1;
  align-items: center;
}

.item_date::before{
  font-family: 'bootstrap-icons';
  content: '\f293';
  margin: 2px 3px 0 0;
}

.item.text_box .item_date{
  text-align: left;
}

.row_wrap{
  position: relative;
  margin-bottom: 32px;
}

.row_wrap.border_bottom{
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 2px solid #EFECEA;
}

.table_box{
  overflow: hidden;
  border-radius: 12px 12px 0px 0px;
}

.row_title{
  color: #111;
  font-size: 18px;
  font-weight: 700;
  margin: 0 0 8px 0;
}

.location{
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 22px;
  font-size: 12px;
  font-weight: 500;
  padding: 4px 10px;
  gap: 10px;
  border-radius: 12px;
  background-color: #DDEDFF;
}

table{
  width: 100%;
  text-align: center;
  margin-bottom: 6px;
  background-color: #FAFAFA;
}

table tr{
  position: relative;
}

table td{
  padding: 12px 10px;
}

table thead{
  color: #fff;
  font-size: 14px;
  background-color: #003639;
}

table thead tr{
  border-top: none !important;
}

table thead th{
  padding: 10px;
}

table tbody tr{
  border-bottom: 1px solid #DBDEE8;
}

table tbody tr:nth-child(odd){
  background-color: #F2F4F7;
}

.row_wrap.qf table tbody tr:nth-child(2){
  border-bottom: 2px solid #003639;
}

.table_update{
  display: flex;
  justify-content: space-between;
  color: #A8A8A8;
  font-size: 13px;
  font-weight: 500;
}

.sidebar .table_update{
  justify-content: flex-end;
}

.table_update > span > span:first-child{
  margin-right: 16px;
}

.table_update .advance::before{
  position: static;
  display: inline-block;
  color: #A8A8A8;
  filter: grayscale(1) brightness(0.9);
}

.table_update a{
  color: #3691F9;
  text-decoration: underline;
}

td:has(.nation){
  width: 129px;
}

.row_wrap.qf td:has(.nation){
  width: 300px;
}

.row_wrap.qf td .nation{
  display: inline-block;
}

.flag{
  display: inline-flex;
  line-height: 1;
}

table .flag{
  transform: translateY(3px);
}

.row_wrap table .flag{
  width: 114px;
}

.row_wrap.tbd table .flag{
  display: block;
  transform: translateY(0);
}

.flag::before{
  content: '';
  display: block;
  width: 32px;
  height: 20px;
  margin-right: 6px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.row_wrap.tbd .flag::before{
  display: none;
}

.flag.usa::before{background-image: url(../img/flag_usa.svg);}
.flag.pur::before{background-image: url(../img/flag_pur.svg);}
.flag.ven::before{background-image: url(../img/flag_ven.svg);}
.flag.ned::before{background-image: url(../img/flag_ned.svg);}
.flag.mex::before{background-image: url(../img/flag_mex.svg);}
.flag.pan::before{background-image: url(../img/flag_pan.svg);}
.flag.tpe::before{background-image: url(../img/flag_tpe.svg);border: 1px solid #ccc;}
.flag.jpn::before{background-image: url(../img/flag_jpn.svg);border: 1px solid #ccc;}
.flag.kor::before{background-image: url(../img/flag_kor.svg);border: 1px solid #ccc;}
.flag.dom::before{background-image: url(../img/flag_dom.svg);}
.flag.cub::before{background-image: url(../img/flag_cub.svg);}
.flag.aus::before{background-image: url(../img/flag_aus.svg);}
.flag.cze::before{background-image: url(../img/flag_cze.svg);}
.flag.ita::before{background-image: url(../img/flag_ita.svg);}
.flag.nca::before{background-image: url(../img/flag_nca.png);}
.flag.esp::before{background-image: url(../img/flag_esp.png);}
.flag.rsa::before{background-image: url(../img/flag_rsa.png);}
.flag.ger::before{background-image: url(../img/flag_ger.png);}
.flag.bra::before{background-image: url(../img/flag_bra.png);}
.flag.col::before{background-image: url(../img/flag_col.png);}
.flag.chn::before{background-image: url(../img/flag_chn.png);}
.flag.phi::before{background-image: url(../img/flag_phi.png);}
.flag.hkg::before{background-image: url(../img/flag_hkg.png);}
.flag.sri::before{background-image: url(../img/flag_sri.png);}
.flag.pak::before{background-image: url(../img/flag_pak.png);}
.flag.tha::before{background-image: url(../img/flag_tha.png);}
.flag.can::before{background-image: url(../img/flag_can.png);}
.flag.gbr::before{background-image: url(../img/flag_gbr.png);}
.flag.isr::before{background-image: url(../img/flag_isr.png);}

.medal_table_update{
  position: absolute;
  top: 12px;
  right: 0;
  color: #A8A8A8;
  font-size: 13px;
}

.sidebar .medal_table_update.source{
  position: static;
  text-align: right;
}

.medal_table_update span{
  margin-left: 16px;
}

.medal{
  display: inline-block !important;
  line-height: 1;
  font-weight: 500;
  padding: 6px 16px;
  border-radius: 20px;
  background-color: #A8A8A8;
}

.medal.g{background-color: #FED766;}
.medal.s{background-color: #D3D4D6;}
.medal.b{background-color: #CEA07E;}

/*.rank{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 24px;
  height: 24px;
  color: #fff;
  font-size: 12px;
  line-height: 1;
  border-radius: 50%;
  margin-top: 2px;
  background-color: #111;
}*/

.rank{
  font-size: 16px;
}

.advance{
  position: relative;
}

.advance::before{
  content: '';
  position: absolute;
  top: 6px;
  left: -29px;
  width: 12px;
  height: 12px;
  background: url(../img/star.svg) no-repeat center / contain;
}

.nation{
  font-weight: bold;
}

table.schedule_data_th{
  color: #fff;
  margin-bottom: 0;
  background-color: #343d4c;
}

table.schedule_data_th tr{
  height: 56px;
  font-size: 16px;
}

table#schedule_data thead{
  color: #6C809A;
  font-size: 17px;
  background-color: #EFEFEF;
}

table#schedule_data thead th{
  height: 56px;
  font-weight: 500;
}

table#schedule_data thead th:nth-child(4){
  min-width: 110px;
}

@keyframes loading{
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

.loading::before{
  content: '';
  display: inline-block;
  width: 40px;
  height: 40px;
  background: url(../img/loading.svg) no-repeat center / cover;
  animation: loading 0.9s linear infinite;
}

table#schedule_data.loading::before{
  content: '';
  position: absolute;
  top: calc(45% - 20px);
  left: calc(50% - 20px);
  z-index: 3;
}

table#schedule_data.loading::after{
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: #343d4c;
  z-index: 2;
}

table#schedule_data tr:nth-child(even){
  /*background-color: #EFEFEF;*/
}

table#schedule_data td{
  position: relative;
  height: 60px;
  color: #fff;
  font-size: 16px;
}

table#schedule_data td:nth-child(1) br{
  display: none;
}

table.schedule_data_th td:nth-child(1), table#schedule_data td:nth-child(1){
  width: 22%;
}

table.schedule_data_th td:nth-child(2), table#schedule_data td:nth-child(2){
  width: 42%;
}

table.schedule_data_th td:nth-child(3), table#schedule_data td:nth-child(3){
  width: 22%;
}

table.schedule_data_th td:nth-child(4), table#schedule_data td:nth-child(4){
  width: 14%;
}

table#schedule_data tr.single_row{
  display: table-row !important;
  height: 360px;
}

table#schedule_data tr.single_row td{
  width: 100%;
  text-align: center;
  padding: 16px;
}

.sidebar .table_box{
  margin-bottom: 8px;
  border-radius: 0 0 12px 12px;
  border: 1px solid #E0E0E0;
}

.sidebar .table_box:has(.s3){
  border-radius: 12px;
  border: 1px solid #d2d2d2;
}

.sidebar table{
  margin-bottom: 0;
}

.sidebar table thead{
  color: #111;
  font-size: 14px;
  background-color: #FAFAFA;
}

.sidebar table thead tr{
  height: auto;
}

.sidebar table thead tr th{
  width: 46px;
  font-weight: 400;
  padding: 8px 3px;
}

.sidebar table thead tr th.team{
  width: 60px;
}

.sidebar table tbody{
  font-size: 14px;
}

.sidebar table tr{
  border-top: 1px solid #DBDEE8;
  border-bottom: none;
}

.sidebar table tr.taiwan{
  background-color: #FCF4E1;
}

.sidebar table td{
  padding: 12px 3px;
}

.sidebar table.medal_table td:has(.nation){
  width: auto;
}

.sidebar table.medal_table tr:not(:nth-child(1), :nth-child(2), :nth-child(3),
  :nth-child(4), :nth-child(5), :nth-child(6), .taiwan){
  display: none;
}

.sidebar .medal{
  padding: 4px 12px;
}

.sidebar .rank{
  font-size: 14px;
}

.sidebar td:has(.nation){
  width: 100px;
}

.sidebar .nation .flag{
  width: 89px;
  align-items: center;
}

.sidebar .nation .flag::before{
  width: 24px;
  height: 15px;
}

.tab_list{
  display: flex;
  gap: 4px;
  margin-bottom: -1px;
}

.tab_box.s2 .tab_list{
  gap: 0;
}

.tab{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 113px;
  color: #111;
  font-size: 14px;
  padding: 10px;
  border-radius: 8px 8px 0px 0px;
  border: 1px solid #DBDEE8;
  border-bottom-color: #E0E0E0;
  background-color: #DBDEE8;
}

.tab.active{
  border: 1px solid #E0E0E0;
  border-bottom-color: #FAFAFA;
  background-color: #FAFAFA;
}

.tab_content{
  display: none;
}

.tab_content.active{
  display: block;
}

.event_banner{
  display: flex;
  position: relative;
  padding-bottom: 38.2%;
  margin-bottom: 48px;
  background-color: #A8A8A8;
}

.demo_text{
  position: absolute;
  top: 50%;
  left: 50%;
  color: #fff;
  transform: translate(-50%, -50%);
}

.event_filter_banner{
  position: relative;
  padding-bottom: 38.2%;
  background: url(../img/event_filter_banner.jpg) no-repeat center / cover;
}

.event_filter_banner .btn{
  position: absolute;
}

.btn_box{
  text-align: center;
  margin: 24px 0;
}

table + .btn_box{
  margin-top: 16px;
}

.btn{
  display: inline-block;
  color: #fff;
  font-size: 15px;
  text-align: center;
  padding: 10px 30px;
  border-radius: 6px;
  background-color: #002391;
}

.btn:hover{
  background-color: #002bb3;
}

.btn.active{
  color: #343d4c !important;
  border-color: var(--hover-color);
  background-color: var(--hover-color);
}

.btn.more{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 250px;
  height: 50px;
  line-height: 1;
}

.btn.more::after{
  font-family: 'bootstrap-icons';
  content: '\f285';
  margin: 2.5px 0 0 4px;
}

.btn.more.complete_table{
  color: #111;
  background-color: transparent;
}

.btn.more.complete_table:hover{
  color: rgba(10, 9, 28, 0.80);
}

.btn.btn_date{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
  width: calc(20% - 6px);
  height: 42px;
  margin: 0 3px;
}

.btn.btn_date:first-child{
  width: 20%;
  margin-left: 0;
}

.btn.btn_date:last-child{
  margin-right: 0;
}

.btn.btn_date .sdow{
  font-size: 12px;
  margin-left: 3px;
}

.btn.btn_date.active{
  pointer-events: none;
}

.btn.btn_date.disabled{
  opacity: 0.3;
  pointer-events: none;
}

.event_filter_banner .btn{
  position: absolute;
  bottom: 32px;
  left: 75px;
  display: flex;
  color: #29EDCA !important;
  font-size: 18px;
  padding: 10px 60px 10px 40px;
  border: 1px solid #29EDCA !important;
  background-color: rgba(26, 26, 26, 0.4);
  transition: padding 0.26s, background-color 0.26s;
}

.event_filter_banner .btn:hover{
  padding: 10px 70px 10px 40px;
  background-color: rgba(45, 92, 84, 1);
}

.event_filter_banner .btn .btn_arrow{
  position: absolute;
  top: 50%;
  right: 38px;
  width: 16px;
  height: 26px;
  overflow: hidden;
  transform: translateY(-50%);
  transition: width 0.26s;
}

.event_filter_banner .btn:hover .btn_arrow{
  width: 26px;
}

.event_filter_banner .btn .btn_arrow svg{
  position: absolute;
  top: 0;
  right: 0;
  width: 26px;
  height: 26px;
}

.event_filter_banner .btn .btn_arrow svg path{
  stroke: #29EDCA;
}

.broadcast_schedule{
  margin-top: -12px;
}

.schedule_header{
  /*position: sticky;*/
  top: 65px;
  z-index: 10;
}

.date_selection .date_list{
  display: flex;
  padding: 13px 0 10px 0;
}

.tv_channels .channels_list{
  /*display: flex;*/
  display: none;
  padding: 10px 0;
  border-bottom: 2px solid #DDDDDD;
  background-color: #21262e;
}

.tv_channels .channels_list .channel, .tv_channels .channels_list::before{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-grow: 1;
  width: calc(20% - 6px);
  height: 42px;
  color: #fff;
  padding: 6px;
  margin: 0 3px;
  pointer-events: none;
}

.tv_channels .channels_list::before{
  content: '';
  opacity: 0;
  flex-grow: 0;
  width: 20%;
  margin: 0 3px 0 0;
}

.tv_channels .channels_list .channel:last-child{
  margin-right: 0;
}

.channel_num{
  display: inline-block;
  width: 20px;
  height: 20px;
  color: #fff;
  font-size: 12px;
  line-height: 1;
  text-align: center;
  padding-top: 4px;
  margin-left: 3px;
  border-radius: 4px;
  background-color: #6C809A;
}

.dropdown{
  display: none;
}

.schedule_body{
  position: relative;
}

.schedule_box{
  position: relative;
  min-height: 360px;
}

.program_label{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 48px;
  height: 24px;
  color: #fff;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
  padding: 0 8px;
  margin-top: 8px;
  border-radius: 4px;
  border: 1px solid #E92A2A;
}

.program_label.live{
  background-color: #E92A2A;
}

.program_label.replay{
  color: #818181;
  border-color: #E0E0E0;
}

.schedule_row_box{
  margin: 32px 0;
}

.schedule_date{
  color: #0072BC;
  font-size: 24px;
  font-weight: bold;
  margin-bottom: 10px;
}

.schedule_date span{
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 26px;
  height: 26px;
  font-size: 15px;
  line-height: 26px;
  text-align: center;
  margin-left: 8px;
  border-radius: 50%;
  border: 1px solid #0072BC;
  transform: translateY(-2px);
}

.schedule_row_box table thead{
  color: #111;
  border-bottom: 1px solid #DBDEE8;
  background-color: transparent;
}

.schedule_row_box table thead th{
  height: 56px;
  font-size: 16px;
}

.schedule_row_box table td:nth-child(1) br, .schedule_row_box table td:nth-child(2) br{
  display: none;
}

.schedule_row_box table td:nth-child(2){
  width: 33%;
}

.schedule_row_box table tbody td{
  height: 60px;
}

.schedule_note{
  color: #939393;
  font-size: 15px;
}

.schedule_note a{
  color: #505050;
}

.schedule_note a:hover{
  text-decoration: underline;
}

.scoreboard_box{
  background-color: #F2F4F7;
}

.scoreboard{
  display: flex;
  justify-content: center;
  padding: 12px;
}

.scoreboard > div{
  display: flex;
  align-items: center;
}

.scoreboard .nation{
  display: flex;
  width: 133px;
  font-size: 20px;
}

.scoreboard .sb_left .nation{
  justify-content: flex-end;
}

.scoreboard .sb_right .nation{
  justify-content: flex-start;
}

.scoreboard .flag{
  display: flex;
  align-items: center;
  width: 100%;
}

.scoreboard .sb_left .flag{
  justify-content: flex-end;
}

.scoreboard .sb_right .flag{
  justify-content: flex-start;
}

.scoreboard .flag::before{
  flex-shrink: 0;
  width: 45px;
  height: 30px;
}

.scoreboard .score{
  font-family: 'Work Sans';
  display: flex;
  justify-content: center;
  align-items: center;
  width: 60px;
  height: 56px;
  color: #111;
  font-size: 40px;
  font-weight: 700;
  border-radius: 12px;
  border: 1px solid #E0E0E0;
  background: #FFF;
}

.scoreboard .sb_left .score{
  margin-left: 24px;
}

.scoreboard .sb_right .score{
  margin-right: 24px;
}

.scoreboard .delimiter{
  font-family: 'Work Sans';
  font-size: 40px;
  font-weight: 700;
}

.scoreboard_time{
  display: flex;
  justify-content: center;
  color: #111;
  padding: 4px;
  background-color: #FFC700;
}

.scoreboard_time > span{
  margin: 0 7px;
}

.scoreboard_time .channel{
  display: inline-flex;
  align-items: center;
}

.scoreboard_time .channel_num{
  margin-left: 4px;
  background-color: #111;
}

.scoreboard_box.finals .scoreboard{
  align-items: flex-end;
  transform: translateY(-40px);
  padding: 16px 12px;
  margin-bottom: -40px;
}

.scoreboard_box.finals .scoreboard > div{
  margin-bottom: 10px;
}

.scoreboard_box.finals .scoreboard .nation{
  width: 90px;
  font-size: 22px;
}

.scoreboard_box.finals .scoreboard .flag{
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
}

.scoreboard_box.finals .scoreboard .flag::before{
  width: 75px;
  height: 50px;
  margin: 0 auto 8px auto;
}

.scoreboard_box.finals .scoreboard .score{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
  color: #111;
  font-size: 56px;
  font-weight: 700;
  border-radius: 12px;
  border: 1px solid #E0E0E0;
  background: #FFF;
}

.scoreboard_box.finals .scoreboard .trophy{
  display: block;
  width: 124px;
  margin: 0 32px;
}

.message{
  text-align: center;
  padding: 120px 0;
}

.message img{
  display: inline-block;
  width: 68px;
}

.message_text{
  font-family: 'Work Sans';
  color: #111;
  font-size: 28px;
  font-weight: 700;
  margin-bottom: 20px;
}

.message .btn.more{
  min-width: 176px;
}

.scoreboard_row_box{
  display: block;
  width: 100%;
  height: 108px;
  border: none;
}

body:has(.scoreboard_row){
  overflow-y: clip;
}

.scoreboard_row{
  position: relative;
  padding: 0 48px;
  border-top: 1px solid #E0E0E0;
  border-bottom: 1px solid #E0E0E0;
  background-color: #F2F2F2;
}

.scoreboard_block{
  max-width: 500px;
  padding: 0 !important;
  margin: 0 auto;
  border: none;
  background-color: transparent;
}

.scoreboard_block_tit{
  font-size: 20px;
  text-align: center;
  font-weight: bold;
  margin-bottom: 16px;
}

.scoreboard_block_con{
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}

.scoreboard_block_link{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.sb_list{
  display: flex;
  padding: 0 4px;
  overflow-x: auto;
  overflow-y: clip;
}

.sb_list::-webkit-scrollbar{
  display: none;
}

.sb_item{
  flex-shrink: 0;
  width: 176px;
  height: 90px;
  margin: 8px 4px;
  border-radius: 12px;
  border: 1px solid #E0E0E0;
  background: #FFF;
}

.scoreboard_block_con .sb_item{
  width: calc(50% - 6px);
  min-width: auto;
  margin: 0;
}

.sbi_head{
  display: flex;
  justify-content: space-between;
  align-items: center;
  color: #666;
  font-size: 11px;
  padding: 6px 8px;
  border-bottom: 1px solid #E0E0E0;
}

.sbi_head > div:last-child{
  margin-left: 4px;
}

.sbi_head .time{
  color: #fff;
  font-weight: bold;
  padding: 0 2px;
  margin-left: 3px;
  background-color: #E92A2A;
}

.sbi_body{
  padding: 4px 12px 0 12px;
}

.nation_row{
  display: flex;
  justify-content: space-between;
  margin: 3px 0;
}

.scoreboard_row .flag{
  font-size: 14px;
  font-weight: 500;
}

.scoreboard_row .flag::before{
  width: 24px;
  height: 15px;
}

.scoreboard_row .score{
  font-size: 15px;
}

.sb_next_btn, .sb_prev_btn{
  position: absolute;
  top: 0;
  width: 48px;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #fff;
}

.sb_next_btn::before, .sb_prev_btn::before{
  content: '';
  display: block;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: contain;
}

.sb_next_btn{
  right: 0;
  border-left: 1px solid #E0E0E0;
}

.sb_next_btn::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M6.96967 2.96967C7.26256 2.67678 7.73744 2.67678 8.03033 2.96967L17.0303 11.9697C17.3232 12.2626 17.3232 12.7374 17.0303 13.0303L8.03033 22.0303C7.73744 22.3232 7.26256 22.3232 6.96967 22.0303C6.67678 21.7374 6.67678 21.2626 6.96967 20.9697L15.4393 12.5L6.96967 4.03033C6.67678 3.73744 6.67678 3.26256 6.96967 2.96967Z' fill='%231550C9'/%3E%3C/svg%3E");
}

.sb_prev_btn{
  left: 0;
  border-right: 1px solid #E0E0E0;
}

.sb_prev_btn::before{
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='24' height='25' viewBox='0 0 24 25' fill='none'%3E%3Cpath fill-rule='evenodd' clip-rule='evenodd' d='M17.0303 2.96967C17.3232 3.26256 17.3232 3.73744 17.0303 4.03033L8.56066 12.5L17.0303 20.9697C17.3232 21.2626 17.3232 21.7374 17.0303 22.0303C16.7374 22.3232 16.2626 22.3232 15.9697 22.0303L6.96967 13.0303C6.67678 12.7374 6.67678 12.2626 6.96967 11.9697L15.9697 2.96967C16.2626 2.67678 16.7374 2.67678 17.0303 2.96967Z' fill='%231550C9'/%3E%3C/svg%3E");
}

.sb_next_btn:hover, .sb_prev_btn:hover{
  background-color: #ccc;
}

.sb_next_btn.disable, .sb_prev_btn.disable{
  pointer-events: none;
}

.sb_next_btn.disable::before, .sb_prev_btn.disable::before{
  opacity: 0.4;
  filter: grayscale(1);
}

.overlay_box{
  position: fixed;
  display: none;
  justify-content: center;
  align-items: center;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 3000;
}

.overlay_box.show{
  display: flex;
}

.overlay{
  position: relative;
  width: 100%;
  max-width: 720px;
  height: calc(100% - 100px);
  color: #fff;
  background-color: #000;
  z-index: 2;
}

.overlay_box.video .overlay{
  height: auto;
}

.overlay_box.video .overlay{
  background-color: transparent;
}

.overlay_inner{
  display: flex;
  flex-direction: column;
  height: 100%;
  border: 1px solid #E30000;
}

.overlay_box.video .overlay_inner{
  border: none;
}

.overlay_close{
  position: absolute;
  top: 0;
  right: 0;
  width: 32px;
  height: 32px;
  z-index: 3;
}

.overlay_close::before{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 24px;
  height: 3px;
  border-radius: 2px;
  background-color: #fff;
  transform: translate(-50%, -50%) rotate(45deg);
}

.overlay_close::after{
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  width: 24px;
  height: 3px;
  border-radius: 2px;
  background-color: #fff;
  transform: translate(-50%, -50%) rotate(-45deg);
}

.overlay_bg{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.8);
  z-index: 1;
}

.overlay_box.video .overlay_bg{
  background-color: rgba(0, 0, 0, 0.95);
}

.overlay_header{
  text-align: center;
  padding: 32px 32px 16px 32px;
}

.overlay_header img{
  display: inline-block;
  max-height: 94px;
}

.overlay_header_text{
  color: #C5C5C5;
  font-size: 13px;
}

.overlay_body{
  flex-grow: 1;
  overflow-x: clip;
  overflow-y: auto;
  -ms-scroll-chaining: none;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}

.ov_video_box{
  padding: 46px 0 70px 0;
}

.ov_video{
  aspect-ratio: 16 / 9;
  margin-bottom: 12px;
  background-color: #000;
}

.ov_video iframe{
  display: block;
  width: 100%;
  height: 100%;
}

.ov_video_title{
  line-height: 1.4;
}

.ad_box{
  position: relative;
  text-align: center;
  margin: 32px 0;
}

.content .ad_box{
  overflow: hidden;
}

.ad_box img{
  display: inline;
}

.ad_box img, .ad_box iframe{
  vertical-align: top;
}

.ad_box span{
  position: absolute;
  top: 0;
  left: 50%;
  width: 100%;
  height: 100%;
  color: #fff;
  font-size: 17px;
  display: flex;
  justify-content: center;
  align-items: center;
  transform: translateX(-50%);
  background-color: rgba(0,0,0,0.7);
}

.sidebar .ad_box span, .ad_box.mobile_visible span{
  width: 300px;
}

.dfp_ad > div, .dfp_ad iframe{
  vertical-align: top;
}

.sky_ad img{
  display: block;
  width: 100%;
}

.sky_ad_large{
  display: block;
}

.sky_ad_small{
  display: none;
}

.sky_ad.collapse .sky_ad_large{
  display: none;
}

.sky_ad.collapse .sky_ad_small{
  display: block;
}

.sky_ad .sky_ad_switch{
  position: absolute;
  display: flex;
  align-items: center;
  top: 16px;
  right: 16px;
  color: #fff;
  font-size: 16px;
  line-height: 1.4;
  padding: 8px 18px;
  border-radius: 6px;
  background-color: rgba(29, 30, 32, 0.5);
  cursor: pointer;
  z-index: 3;
}

.sky_ad .sky_ad_switch:hover{
  background-color: rgba(29, 30, 32, 0.7);
}

.sky_ad .sky_ad_switch::after{
  font-family: 'bootstrap-icons';
  content: '\f282';
  margin: 3px -3px 0 2px;
}

.sky_ad.collapse .sky_ad_switch::after{
  content: '\f286';
}

.bottom_fixbox{
  position: sticky;
  bottom: 0;
  left: 0;
  width: 100%;
  pointer-events: none;
  z-index: 2000;
}

.bottom_fixbox .bottom_fixbox_inner{
  pointer-events: auto;
}

.bottom_widget_box, .bottom_ad, .bottom_warning{
  position: relative;
}

.bottom_widget_box{
  z-index: 1;
}

.bottom_ad{
  padding-top: 8px;
  z-index: 2;
}

.bottom_ad.hide{
  display: none !important;
}

.bottom_fixbox .footer_ad{
  position: relative;
  display: none;
  justify-content: center;
  width: 100vw;
  margin: 0;
}

.bottom_fixbox .footer_ad:has(iframe){
  display: flex;
}

.bottom_fixbox .footer_ad.hide, .bottom_fixbox .footer_ad:has([id^="div-onead-"]){
  display: none !important;
}

.btn_close{
  display: flex;
  justify-content: center;
  align-items: center;
  width: 38px;
  height: 38px;
  color: #0A0A0A;
  font-size: 24px;
  cursor: pointer;
  border-radius: 50%;
  background-color: #EBEBEB;
}

.btn_close::before{
  font-family: 'bootstrap-icons';
  content: '\f62a';
  line-height: 1;
}

.bottom_fixbox .footer_ad .btn_close{
  position: absolute;
  top: -31px;
  right: 8px;
  display: flex;
  width: 23px;
  height: 23px;
  color: #fff;
  font-size: 22px;
  background-color: #0A0A0A;
}

.game_schedule, .finals_box{
  padding-bottom: 40px;
  margin-bottom: 40px;
  border-bottom: 2px solid #EFECEA;
}

.finals_box{
  padding-bottom: 8px;
}

.finals_box:last-child{
  padding-bottom: 0;
  margin-bottom: 0;
  border-bottom: none;
}

.tab_box.s2 .tab_list_box{
  display: flex;
  font-size: 18px;
  font-weight: 700;
  margin-bottom: 12px;
}

.tab_box.s2 .tab_list div{
  color: #111;
}

.tab_box.s2 .tab_list button{
  position: relative;
  width: auto;
  color: #c1c3cc;
  font-size: 18px;
  font-weight: 700;
  padding: 0 12px;
  border: none;
  background-color: transparent;
}

.tab_box.s2 .tab_list button.active{
  color: #111;
}

.tab_box.s2 .tab_list button:after{
  content: '';
  position: absolute;
  top: 4px;
  right: 0;
  height: 20px;
  border-right: 1px solid #E0E3ED;
}

.tab_box.s2 .tab_list button:last-child:after{
  display: none;
}

table.gs_table{
  font-size: 15px;
  line-height: 1.36;
  table-layout: fixed;
  border: 1px solid #DBDEE8;
  background-color: #FAFAFA;
}

table.gs_table tbody tr:nth-child(odd){
  background-color: #FAFAFA;
}

table.gs_table tbody tr:nth-child(1), table.gs_table tbody tr td:nth-child(1){
  font-size: 16px;
  background-color: #F2F4F7;
}

table.gs_table tbody tr:nth-child(1) td:nth-child(1){
  background-color: #FAFAFA;
}

table.gs_table td{
  height: 60px;
  padding: 4px 7px;
  border: 1px solid #DBDEE8;
  cursor: default;
}

table.gs_table td.slash{
  background: url(../img/slash.png) no-repeat 0 0 / 100% 100%;
}

table.gs_table td.end div:first-child{
  color: #FF4949;
  font-size: 17px;
  font-weight: bold;
}

table.gs_table td.end div:last-child{
  color: #808080;
  font-size: 14px;
  font-weight: normal;
}

.preview .row_wrap{
  max-width: 600px;
  margin: 22px auto 32px auto;
}

table.s3 tr{
  border-bottom: 1px solid #DBDEE8;
}

table.s3 tr.bdb{
  border-bottom: 2px solid #c6c9d5;
}

table.s3 td{
  color: #555;
  border-right: 1px solid #DBDEE8;
  border-left: 1px solid #DBDEE8;
  background-color: #F2F4F7;
}

table.s3 td.bg_y{
  color: #111;
  background-color: #fffcec;
}

table.s3 td.bg_y2{
  color: #111;
  background-color: #ffefa1;
}

table.s4 tr{
  border-bottom: 1px solid #caceda;
  background-color: transparent !important;
}

table.s4 td{
  border-right: 1px solid #caceda;
  border-left: 1px solid #caceda;
  background-color: transparent;
}

.preview .row_wrap table thead tr{
  border-bottom: none;
}

.preview .row_wrap table thead th:nth-child(1){
  width: 31%;
}

.preview .row_wrap:first-child h3{
  font-size: 21px;
  margin-bottom: 10px;
}

.preview .row_wrap:first-child h3 br{
  display: none;
}

.preview .row_wrap:first-child .location{
  top: 6px;
}

@media screen and (min-width: 1031px){

  .bottom_fixbox .bottom_fixbox_inner .desktop_visible{
    width: 100%;
  }

  .bottom_fixbox .bottom_fixbox_inner .desktop_visible .footer_ad{
    align-items: center;
    width: 100%;
    height: 114px;
    padding: 12px;
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.16);
    background-color: #fff;
  }

  .bottom_fixbox .bottom_fixbox_inner .desktop_visible .footer_ad .btn_close{
    top: -28px;
    right: 0;
    width: 28px;
    height: 28px;
    color: #0A0A0A;
    font-size: 26px;
    border: none;
    border-radius: 4px 0 0 0;
    box-shadow: -1px -1px 2px rgba(0, 0, 0, 0.16);
    background-color: #fff;
  }

}

.sidebar .preview .row_wrap{
  margin-top: 0;
}

.sidebar table.s3 tr:last-child{
  border-bottom: none;
}

.sidebar table.s3 td{
  color: #111;
  border-left: none;
  background-color: #fffcec;
}

.sidebar table.s3 td:last-child{
  width: 43%;
  border-right: none;
}

.sidebar table.s3 thead{
  background-color: #F2F4F7;
}

.sidebar table.s3 thead tr th{
  border-right: 1px solid #DBDEE8;
}

.sidebar table.s3 thead tr th:last-child{
  border-right: none;
}

.bottom_warning{
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  height: 10vh;
  pointer-events: auto;
  background-color: #1a1a1a;
}

.bottom_warning img{
  display: inline-block;
  max-width: 100%;
  max-height: 100%;
}

.text_ac{
  text-align: center;
}

.desktop_visible, .mobile_hidden{
  display: block !important;
}

.desktop_hidden, .mobile_visible{
  display: none !important;
}

.tablet_visible, .phone_visible{
  display: none !important;
}

footer{
  color: #fff;
  line-height: 1.5;
  padding: 47px 0;
  background-color: #111;
}

footer a{
  color: #fff;
}

footer ul{
  display: flex;
  line-height: 1.2;
  margin-bottom: 30px;
}

footer ul li{
  display: flex;
}

footer ul li:last-child::after{
  display: none;
}

footer ul li::after{
  content: '';
  padding-right: 14px;
  margin-right: 14px;
  border-right: 1px solid rgba(255,255,255,0.7);
}

footer ul li a{
  font-size: 14px;
}

footer ul li a:hover{
  color: #ffd300;
}

footer .info_box{
  display: flex;
  justify-content: space-between;
}

footer .info_box .info{
  font-size: 12px;
  font-weight: 300;
}

footer .info_box .info div{
  display: flex;
  margin-bottom: 10px;
}

footer .info_box .info div span{
  display: flex;
}

footer .info_box .info div span::after{
  font-family: 'Microsoft JhengHei';
  content: '|';
  margin: -1px 12px 0 12px;
}

footer .info_box .info div span:last-child::after{
  display: none;
}

footer .info_box .footer_logo{
  width: 112px;
}

footer .info_box .footer_logo img{
  width: 100%;
}

@media screen and (max-width: 1500px){

  .sky_ad .sky_ad_switch{
    top: 10px;
    right: 10px;
    font-size: 15px;
    padding: 7px 16px;
  }

}

@media screen and (max-width: 1400px){

  .scoreboard_row{
    padding: 0 40px;
  }

  .sb_item{
    margin: 8px 3px;
  }

  .sb_next_btn, .sb_prev_btn{
    width: 40px;
  }

}

@media screen and (max-width: 1300px){

  .main_content{
    grid-template-columns: 270px minmax(0, auto);
    column-gap: 30px;
  }

  .sidebar .medal{
    padding: 4px 8px;
  }
  
  .btn.btn_date{
    max-width: none;
  }

  .countdown_timer .col_box{
    padding: 20px;
  }

}

@media screen and (max-width: 1030px){

  /* Safari 9+ */
  @supports (-webkit-hyphens:none){

    /*ios safari使用內建字體 start*/
    body{
      font-family: Arial, sans-serif;
    }

    .countdown_title h1 .main_title,
    .countdown_timer .col_box div:nth-child(2),
    .countdown_placard,
    .hero_slider .hero_text .hero_title,
    .hero_slider .hero_text .hero_label,
    .section_title,
    .item_title,
    .item_preview,
    .btn.more,
    table thead,
    .nation,
    .dropdown_switch,
    .tv_channels .channel,
    .broadcast_schedule{
      font-weight: bold;
    }

    .countdown_title h1 .main_title,
    .section_title{
      -webkit-text-stroke: 0.4px;
    }

    .hero_slider .hero_text .hero_title{
      -webkit-text-stroke: 0.4px;
    }

    .item_title,
    .item_title, .item_date{
      -webkit-text-stroke: 0.2px;
    }

    .item_date::before,
    .btn.more::after{
      font-weight: normal;
    }

    .item_preview{
      color: #9d9d9d;
    }

    .item_date::before{
      margin-top: 0;
    }

    table th, table td{
      -webkit-text-stroke: 0.1px;
    }

    .rank{
      line-height: 26px;
      padding-top: 0;
      margin-top: 0;
    }

    .channel_num{
      margin-top: 0 !important;
    }

    .btn.more{
      padding: 16px;
    }

    .btn.more::after{
      font-weight: bold;
      margin-top: 0;
    }
    /*ios safari使用內建字體 end*/
  }

  body{
    background-color: #FAFAFA;
  }

  body:has(.overlay_box.show), body:has(.overlay_box.show) header{
    padding-right: 0;
  }

  body:has(.header_box.open_mobile_menu){
    overflow: hidden;
  }

  header{
    top: 0;
    box-shadow: none;
    border-bottom: 2px solid rgba(221, 221, 221, 1);
  }

  header .navigation{
    height: 56px;
    padding-top: 0;
  }

  header .navigation .container{
    width: 100%;
    height: 100%;
  }

  header .nav_box{
    position: absolute;
    top: 56px;
    left: 0;
    display: block;
    width: 100%;
    height: calc(100vh - 56px);
    padding: 0;
    margin: 0;
    overflow-y: overlay;
    -ms-scroll-chaining: none;
    overscroll-behavior: contain;
    -webkit-overflow-scrolling: touch;
    opacity: 0;
    visibility: hidden;
    background-color: #fff;
    z-index: 100;
  }

  header.open_mobile_nav .nav_box{
    border-top: 1px solid rgba(221, 221, 221, 1);
    opacity: 1;
    visibility: visible;
  }

  header .top_nav{
    position: static;
    flex-wrap: wrap;
    justify-content: center;
    height: auto;
    padding: 24px 0 60px 0;
    border-bottom: none;
    background-color: transparent;
  }

  header .top_nav .container{
    flex-wrap: wrap;
    justify-content: center;
  }

  header .top_nav_logo{
    order: 2;
    width: 57px;
    height: 18px;
    background-image: url(../img/ebc_logo_s.svg);
  }

  header .top_nav_title{
    order: 1;
    color: #666;
    width: 100%;
    line-height: 1.35;
    font-weight: bold;
    text-align: center;
    padding: 0 !important;
    margin: 0 0 10px 0 !important;
    border: none !important;
  }

  header .top_nav_title span{
    display: block;
    padding: 0;
  }

  header .mobile_nav_wrap{
    position: relative;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 100%;
    padding: 0 16px;
    z-index: 120;
  }

  header .mobile_logo{
    position: relative;
    width: 150px;
    height: 20px;
  }

  header .mobile_logo img{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }

  header .mobile_logo .m_logo{
    display: block;
  }

  header .mobile_logo .m_logo_w{
    display: none;
  }

  header .mobile_nav_switch{
    display: flex;
    justify-content: center;
    align-items: center;
    width: 38px;
    height: 38px;
    color: #2B2B2B;
    border-radius: 50%;
    border: 1px solid #D3D4D6;
  }

  header .mobile_nav_switch::before{
    font-family: 'bootstrap-icons';
    content: '\f479';
    font-size: 23px;
  }

  header.open_mobile_nav .mobile_nav_switch::before{
    content: '\f659';
    font-size: 19px;
  }

  nav{
    padding: 10px 0 20px 0;
  }

  nav > ul{
    flex-wrap: wrap;
    width: 90%;
    height: auto;
    margin: 0 auto;
  }

  nav ul li{
    width: 100%;
  }

  nav ul li a{
    font-size: 24px;
    font-weight: bold;
    -webkit-text-stroke: 0.2px;
    padding: 10px;
    margin: 8px auto;
    border-radius: 6px;
    background-color: transparent !important;
  }

  nav > ul > li:nth-child(2) > a{
    margin: 4px auto;
  }

  nav ul li a::after{
    display: none;
  }

  /*nav ul li a:hover{
    color: #fff;
    background-color: #006E3C !important;
  }*/

  nav ul li a.active{
    color: #006E3C;
  }

  nav ul li ul{
    display: flex !important;
    padding-bottom: 18px;
    border-bottom: none;
  }

  nav ul li ul li{
    width: auto;
    border-bottom: none;
  }

  nav ul li ul li a{
    width: auto;
    font-size: 18px;
    padding: 2px 14px;
    margin: 0 6px;
    border: 1px solid #D9D9D9;
  }

  nav ul li ul li a:hover{
    color: #111;
    background-color: transparent !important;
  }

  .countdown_box{
    padding: 32px 24px 40px 24px;
    background-image: url(../img/countdown_bg_t.jpg);
  }

  .countdown{
    max-width: 610px;
  }

  .countdown_timer .col_box{
    padding: 14px 18px;
  }

  .countdown_timer .col_box div:nth-child(1){
    min-width: 46px;
    min-height: 40px;
    font-size: 40px;
  }

  .countdown_title h1{
    padding: 32px 20px 0 0;
  }

  .countdown_title h1 .year{
    font-size: 24px;
  }

  .countdown_title h1 .cn{
    font-size: 29px;
  }

  .countdown_title h1 .cn span{
    font-size: 32px;
  }

  .countdown_title h1 .en{
    font-size: 15px;
    letter-spacing: 0.4px;
  }

  .countdown_placard{
    font-size: 14px;
  }

  .main_box{
    padding: 24px 0;
  }

  .main_content{
    display: flex;
    flex-wrap: wrap;
    column-gap: 0;
    padding-top: 0;
  }

  .hero_slider .hero_text{
    padding: 20px 24px;
  }

  .hero_slider .hero_text .hero_title{
    font-size: 28px;
  }

  .sidebar, .content{
    width: 100%;
  }

  main .ad_box{
    margin: 6px auto 32px auto;
  }

  .sidebar{
    display: none;
  }

  .sidebar_sticky{
    position: static;
  }

  main.index .sidebar{
    display: block;
  }

  .sidebar .list{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 6px 30px;
    flex-wrap: wrap;
  }

  .sidebar .list .item.text_box{
    grid-column: auto / span 1;
  }

  .item{
    box-shadow: none !important;
  }

  .item.text_box .item_title{
    -webkit-line-clamp: 2;
  }

  .item.text_box .item_title{
    font-size: 16px;
    margin-bottom: 8px;
  }

  table tr{
    border-bottom-width: 1px;
  }

  table td{
    padding: 12px 6px;
  }

  .sidebar table td{
    font-size: 16px;
  }

  .schedule_header{
    top: 56px;
  }

  .schedule_date span{
    margin-top: 0;
  }

  table.schedule_data_th tr{
    height: 40px;
    font-size: 15px;
  }

  .flag{
    align-items: center;
  }

  .sidebar .rank{
    font-size: 16px;
  }

  .sidebar .nation .flag{
    width: 96px;
  }

  .scoreboard_row{
    padding: 0;
  }

  .sb_list{
    padding: 0 8px 0 4px;
  }

  .sb_item{
    margin: 8px 4px;
  }

  .sb_next_btn, .sb_prev_btn{
    display: none;
  }

  .sky_ad .sky_ad_large{
    display: block !important;
  }

  .sky_ad .sky_ad_small, .sky_ad .sky_ad_switch{
    display: none !important;
  }

  .desktop_visible, .mobile_hidden{
    display: none !important;
  }

  .desktop_hidden, .mobile_visible{
    display: block !important;
  }

  .tablet_visible{
    display: block !important;
  }

  .phone_visible{
    display: none !important;
  }

  .bottom_fixbox .mobile_visible{
    display: flex !important;
  }

  footer{
    padding: 32px 0 24vw 0;
  }

  footer ul{
    display: none;
  }

  footer .info_box{
    flex-wrap: wrap;
    justify-content: center;
  }

  footer .info_box .info{
    width: 100%;
    margin-bottom: 22px;
  }

  footer .info_box .info div{
    flex-wrap: wrap;
    justify-content: center;
    width: 100%;
  }

  footer .info_box .info div .hide_m{
    display: none;
  }

  footer .info_box .info div .privacy a{
    text-decoration: underline;
  }

  footer .info_box .info div .cs_hotline{
    order: 2;
  }

  footer .info_box .info div .cs_hotline::after{
    display: none;
  }

  footer .info_box .info div .cs_mail{
    order: 1;
  }

  footer .info_box .info div .cs_mail::after{
    display: block !important;
    margin: 0 8px;
  }

  footer .info_box .info div .cs_mail a{
    text-decoration: underline;
  }

}

@media screen and (max-width: 767px){

  .container{
    width: 100%;
  }

  .main_box{
    padding: 0 0 16px 0;
  }

  .main_box:has(.countdown_up){
    margin-top: 0;
  }

  .main_content{
    padding-top: 24px;
  }

  .countdown_wrap{
    margin-bottom: 0 !important;
  }

  .countdown_wrap.countdown_up{
    margin-top: 0;
  }

  .countdown_box{
    padding: 6vw 2vw;
    border-radius: 0;
    background-image: url(../img/countdown_bg_m.jpg);
  }

  .countdown_main{
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 5vw;
  }

  .countdown_title{
    width: 100%;
  }

  .countdown_title h1{
    text-align: center;
    padding: 0;
    margin-bottom: 4.5vw;
  }

  .countdown_title h1 .main_title{
    white-space: nowrap;
    margin-bottom: 2.2vw;
    letter-spacing: 0.8px;
  }

  .countdown_title h1 .main_title span{
    display: inline;
  }

  .countdown_title h1 .year{
    position: static;
  }

  .countdown_title h1 .year, .countdown_title h1 .cn{
    font-size: 6.4vw;
  }

  .countdown_title h1 .cn span{
    font-size: 7vw;
  }

  .countdown_title h1 .en{
    font-size: 3.6vw;
    letter-spacing: 0.6px;
  }

  .countdown_timer{
    padding: 0 2px;
  }

  .countdown_timer .col_box{
    min-width: 20vw;
    padding: 4vw 1vw;
  }

  .countdown_timer .col_box div:nth-child(1){
    min-width: auto;
    min-height: 10vw;
    font-size: 10vw;
  }

  .countdown_timer .col_box div:nth-child(2){
    font-size: 3.2vw;
  }

  .countdown_placard{
    justify-content: center;
  }

  .countdown_placard div{
    font-size: 3.7vw;
    padding: 0 2.8vw;
  }

  .sidebar .table_box{
    border-top-right-radius: 0;
  }

  .tab{
    width: 50%;
  }

  .swiper-button-next, .swiper-button-prev{
    display: none;
  }

  .hero_slider_box{
    width: calc(100% - 32px);
    margin: -4px auto 18px auto;
  }

  .hero_slider_box .swiper-container{
    border-radius: 8px;
  }

  .hero_slider .hero_text{
    padding: 16px;
  }

  .hero_slider .hero_text .hero_title{
    font-size: 18px;
  }

  .hero_slider_box .swiper-pagination{
    position: static;
    min-height: 22px;
  }

  .sidebar, .content{
    padding: 0 16px;
  }

  .section_tab_list{
    font-size: 18px;
  }

  .section_tab{
    flex-grow: 1;
    text-align: center;
    padding: 8px 4px;
    margin: 0 0 -2px 0;
  }

  .section_tab_list.align_left .section_tab{
    flex-grow: 0;
  }

  .sidebar .list{
    display: block;
  }

  .list{
    display: block;
    margin-bottom: 16px;
  }

  .item{
    display: flex;
    margin-bottom: 16px;
  }

  .content .item{
    border-radius: 8px;
  }

  .item.col1, .item:first-child{
    flex-wrap: wrap;
  }

  .item:last-child{
    padding-bottom: 0;
    margin-bottom: 0;
  }

  .item.text_box::after{
    right: 6px;
  }

  .item_img{
    flex: 0 0 37%;
    padding-bottom: 28%;
    margin-bottom: 0;
  }

  .item.col1 .item_img, .item:first-child .item_img{
    flex: 0 0 100%;
    padding-bottom: 56.25%;
  }

  .item.video .item_img::before{
    width: 46px;
    height: 46px;
    font-size: 32px;
  }

  .item_text{
    padding: 8px 12px;
  }

  .item_title{
    font-size: 16px;
  }

  table thead{
    font-size: 13px;
    line-height: 1.2;
  }

  table tbody{
    font-size: 15px;
  }

  table thead tr{
    height: auto;
  }

  table thead th, table td{
    padding: 8px 3px;
  }

  .row_wrap table thead th:nth-child(1){
    width: 37px;
  }

  table.medal_table td:has(.nation){
    max-width: 100px;
  }

  table.schedule_data_th{
    display: none;
  }

  table#schedule_data thead{
    display: none;
  }

  table#schedule_data td{
    padding: 16px 6px;
  }

  table#schedule_data td:nth-child(1){
    width: 25%;
    font-size: 17px;
    text-align: left;
    padding-left: 26px;
  }

  table#schedule_data td:nth-child(1) br{
    display: inline;
  }

  table#schedule_data td:nth-child(2){
    width: 52%;
  }

  table#schedule_data th:nth-child(3), table#schedule_data td:nth-child(3){
    display: none;
  }

  table#schedule_data td:nth-child(4){
    width: 23%;
    text-align: right;
    padding-right: 26px;
  }

  table#schedule_data tr.single_row{
    height: 260px;
  }

  td:has(.rank){
    width: 60px;
  }

  td:has(.nation){
    width: 102px;
  }

  .row_wrap.qf td:has(.nation){
    width: 150px;

  }

  .row_wrap table .flag{
    width: 104px;
    font-size: 14px;
  }

  .table_update{
    display: block;
  }

  .table_update > span{
    display: block;
  }

  .table_update > span:first-child{
    margin-bottom: 4px;
  }

  .table_update > span > span:first-child{
    margin-right: 6px;
  }

  .medal_table_update{
    top: 0;
    max-width: calc((100vw - 32px) / 2);
    text-align: right;
  }

  .sidebar .medal_table_update.source{
    max-width: none;
  }

  .medal_table_update span{
    display: block;
    margin-left: 0;
  }

  .medal{
    padding: 4px 12px;
  }

  .rank{
    font-size: 14px;
  }

  .advance::before{
    top: 3px;
    left: -16px;
    width: 10px;
    height: 10px;
  }

  .event_banner{
    padding-bottom: 133%;
  }

  .broadcast_schedule{
    width: 100vw;
    margin-left: -16px;
  }

  .broadcast_schedule{
    margin-top: -20px;
  }

  .schedule_header{
    position: sticky;
    display: flex;
    padding: 12px 10px 12px 10px;
    border-bottom: 3px solid #21262E;
    background-color: #343d4c;
  }

  .date_selection, .tv_channels{
    display: inline-block;
    width: 50%;
  }

  .dropdown_wrap{
    padding: 0 6px;
  }

  .dropdown_box{
    position: relative;
  }

  .date_selection .dropdown_box{
    font-size: 18px;
  }

  .date_selection .dropdown_box .dropdown_switch{
    font-weight: bold;
  }

  .dropdown{
    display: block;
  }

  .dropdown_switch{
    position: relative;
    display: flex;
    align-items: center;
    width: 100%;
    color: #fff;
    height: 44px;
    padding: 6px 14px;
    border-radius: 4px;
    background-color: #21262E;
  }

  .dropdown_switch::after{
    font-family: 'bootstrap-icons';
    content: '\f229';
    position: absolute;
    top: 14px;
    right: 10px;
    color: rgba(255,255,255,0.5);
    line-height: 1;
  }

  .dropdown_box.open_dropdown_list .dropdown_switch::after{
    top: 13px;
    content: '\f235';
  }

  .date_selection .dropdown_switch .sdow, .btn.btn_date .sdow{
    font-size: 13px;
    font-weight: bold;
    margin: 2px 0 0 4px;
  }

  .channel_num{
    margin-top: 2px;
  }

  .dropdown_list{
    display: none !important;
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    padding: 6px !important;
    margin: 0 !important;
    border-radius: 4px;
    border: 1px solid #3c4758 !important;
    background-color: #21262e;
  }

  .dropdown_box.open_dropdown_list .dropdown_list{
    display: block !important;
  }

  .dropdown_list button{
    display: flex !important;
    justify-content: flex-start !important;
    align-items: center !important;
    width: 100% !important;
    height: auto !important;
    text-align: left;
    padding: 14px !important;
    margin: 0 !important;
    border: none;
    border-radius: 0;
    pointer-events: auto !important;
  }

  .dropdown_list button:hover{
    color: #6C809A !important;
    border-color: #6C809A;
  }

  .dropdown_list button:active{
    color: #fff !important;
    background-color: var(--hover-color) !important;
  }

  .dropdown_list button:active .channel_num{
    color: var(--hover-color) !important;
    background-color: #fff !important;
  }

  .dropdown_list button.btn.active{
    color: #fff !important;
    background-color: #21262E;
  }

  .dropdown_list button.btn.active:active{
    color: #fff !important;
  }

  .btn.btn_date.disabled{
    display: none !important;
  }

  .tv_channels .channels_list::before{
    display: none;
  }

  .tv_channels .channels_list .channel{
    width: 100%;
  }

  .schedule_box{
    min-height: 260px;
  }

  .schedule_box, .schedule{
    position: static;
  }

  .schedule{
    display: block;
  }

  .schedule .schedule_channel_col{
    display: block;
  }

  .schedule .program{
    display: flex;
    flex-wrap: nowrap;
    justify-content: space-around;
    color: #6C809A;
    padding: 18px;
    border-bottom: 1px solid #DDDDDD;
    background-color: #fff;
  }

  .schedule .program:nth-child(even){
    background-color: #EFEFEF;
  }

  .schedule .program .program_time_m{
    display: block;
    width: 17%;
    font-size: 20px;
  }

  .schedule .program .program_title{
    width: 50%;
    font-size: 16px;
  }

  .schedule .program .program_label{
    position: static !important;
    width: 16%;
    font-size: 16px !important;
    padding: 7px 8px !important;
    margin-top: 0;
  }

  .schedule_bg{
    display: none;
  }

  .schedule_row_box table th, .schedule_row_box table td{
    padding: 6px;
  }

  .schedule_row_box table th:first-child, .schedule_row_box table td:first-child{
    padding-left: 0;
  }

  .schedule_row_box table td:nth-child(3){
    width: 110px;
  }

  .schedule_row_box table th:last-child, .schedule_row_box table td:last-child{
    padding-right: 0;
  }

  .schedule_row_box table thead th{
    height: 40px;
    padding: 0;
  }

  .schedule_row_box table td:nth-child(1) br, .schedule_row_box table td:nth-child(2) br{
    display: inline;
  }

  .program_label{
    width: 40px;
    padding: 0 6px;
    margin-top: 0;
  }

  .scoreboard_box{
    width: 100vw;
    margin-left: -16px;
  }

  .scoreboard{
    padding: 20px 10px;
  }

  .scoreboard .nation{
    width: 62px;
  }

  .scoreboard .sb_left .score{
    margin-left: 16px;
  }

  .scoreboard .sb_right .score{
    margin-right: 16px;
  }

  .scoreboard .flag::before{
    width: 100%;
    height: 40px;
    margin: 0 0 6px 0;
  }

  .scoreboard .flag{
    flex-wrap: wrap;
    justify-content: center !important;
    font-size: 15px;
  }

  .scoreboard .delimiter{
    font-size: 32px;
  }

  .scoreboard_time{
    display: block;
    text-align: center;
  }

  .scoreboard_time > span{
    margin: 0 2px;
  }

  .scoreboard_box.finals .scoreboard{
    align-items: center;
    margin-bottom: 0;
    transform: translateY(0);
  }

  .scoreboard_box.finals .scoreboard > div{
    width: 90px;
    flex-wrap: wrap;
    justify-content: center;
    margin-bottom: 0;
  }

  .scoreboard_box.finals .scoreboard .nation{
    margin-bottom: 14px;
  }

  .scoreboard_box.finals .scoreboard .flag{
    font-size: 17px;
  }

  .scoreboard_box.finals .scoreboard .score{
    width: 90px;
    height: 90px;
    margin: 0;
  }

  .scoreboard_box.finals .scoreboard .trophy{
    width: 100px;
    margin: 0 16px;
  }

  .scoreboard_box.finals .scoreboard .sb_right .score{
    order: 2;
  }

  .scoreboard_box.finals .scoreboard .sb_right .nation{
    order: 1;
  }

  .sb_item{
    width: auto;
    min-width: 43vw;
  }

  .scoreboard_block, .scoreboard_row.scoreboard_block .flag{
    font-weight: bold;
  }

  .message{
    padding: 40px 0 100px 0;
  }

  .message_text{
    font-size: 36px;
  }

  .ov_video_box{
    padding-bottom: 90px;
  }

  .ov_video_title{
    padding: 0 20px;
  }

  .overlay_close{
    right: 12px;
  }

  table.gs_table tbody tr:nth-child(1), table.gs_table tbody tr td:nth-child(1){
    font-size: 15px;
  }

  table.gs_table td.end div:last-child{
    font-size: 11px;
    font-weight: bold;
  }

  .preview .row_wrap:first-child h3 br{
    display: inline;
  }

  .preview .row_wrap:first-child .location{
    top: 35px;
  }

  .tablet_visible{
    display: none !important;
  }

  .phone_visible{
    display: block !important;
  }

  .phone_hidden{
    display: none !important;
  }

}

@media screen and (max-width: 400px){

  .scoreboard_block_con{
    gap: 6px;
  }

  .scoreboard_block_con .sb_item{
    width: calc(50% - 3px);
  }

  .scoreboard_block_con .sbi_head{
    padding: 6px 4px;
  }

}

@media screen and (max-width: 369px){

  .section_tab_list{
    font-size: 15px;
  }

}

@media screen and (max-width: 326px){

  .scoreboard_block_con .sbi_head{
    font-size: 3.2vw;
  }

}