/* 縮小失敗。正在傳回未縮小的內容。
(160,133): run-time error CSS1046: Expect comma, found '0'
(160,137): run-time error CSS1046: Expect comma, found '/'
(711,39): run-time error CSS1046: Expect comma, found '0'
(711,43): run-time error CSS1046: Expect comma, found '/'
(737,36): run-time error CSS1046: Expect comma, found '0'
(737,40): run-time error CSS1046: Expect comma, found '/'
(2566,41): run-time error CSS1046: Expect comma, found '0'
(2566,45): run-time error CSS1046: Expect comma, found '/'
(2584,41): run-time error CSS1046: Expect comma, found '0'
(2584,45): run-time error CSS1046: Expect comma, found '/'
(2625,26): run-time error CSS1039: Token not allowed after unary operator: '-bg-color-sub'
(2634,3): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(2635,31): run-time error CSS1039: Token not allowed after unary operator: '-tw-translate-x'
(2635,54): run-time error CSS1039: Token not allowed after unary operator: '-tw-translate-y'
(2635,84): run-time error CSS1039: Token not allowed after unary operator: '-tw-rotate'
(2635,108): run-time error CSS1039: Token not allowed after unary operator: '-tw-skew-x'
(2635,132): run-time error CSS1039: Token not allowed after unary operator: '-tw-skew-y'
(2635,157): run-time error CSS1039: Token not allowed after unary operator: '-tw-scale-x'
(2635,183): run-time error CSS1039: Token not allowed after unary operator: '-tw-scale-y'
(2643,14): run-time error CSS1039: Token not allowed after unary operator: '-main-color'
(3407,2314): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3407,2750): run-time error CSS1039: Token not allowed after unary operator: '-swiper-wrapper-transition-timing-function'
(3407,4558): run-time error CSS1039: Token not allowed after unary operator: '-swiper-centered-offset-before'
(3407,4703): run-time error CSS1039: Token not allowed after unary operator: '-swiper-centered-offset-after'
(3407,4849): run-time error CSS1039: Token not allowed after unary operator: '-swiper-centered-offset-before'
(3407,4991): run-time error CSS1039: Token not allowed after unary operator: '-swiper-centered-offset-after'
(3407,5976): run-time error CSS1039: Token not allowed after unary operator: '-swiper-preloader-color'
(3407,6005): run-time error CSS1039: Token not allowed after unary operator: '-swiper-theme-color'
(3407,6281): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3407,6340): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3407,6761): run-time error CSS1039: Token not allowed after unary operator: '-swiper-virtual-size'
(3407,6876): run-time error CSS1039: Token not allowed after unary operator: '-swiper-virtual-size'
(3407,6904): run-time error CSS1062: Expected semicolon or closing curly-brace, found '-'
(3407,7001): run-time error CSS1039: Token not allowed after unary operator: '-swiper-navigation-top-offset'
(3407,7052): run-time error CSS1039: Token not allowed after unary operator: '-swiper-navigation-size'
(3407,7099): run-time error CSS1039: Token not allowed after unary operator: '-swiper-navigation-size'
(3407,7152): run-time error CSS1039: Token not allowed after unary operator: '-swiper-navigation-size'
(3407,7274): run-time error CSS1039: Token not allowed after unary operator: '-swiper-navigation-color'
(3407,7304): run-time error CSS1039: Token not allowed after unary operator: '-swiper-theme-color'
(3407,7972): run-time error CSS1039: Token not allowed after unary operator: '-swiper-navigation-sides-offset'
(3407,8084): run-time error CSS1039: Token not allowed after unary operator: '-swiper-navigation-sides-offset'
(3407,8257): run-time error CSS1039: Token not allowed after unary operator: '-swiper-navigation-size'
(3407,8506): run-time error CSS1039: Token not allowed after unary operator: '-swiper-navigation-sides-offset'
(3407,9089): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-bottom'
(3407,9129): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-top'
(3407,9941): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-bullet-width'
(3407,9978): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-bullet-size'
(3407,10027): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-bullet-height'
(3407,10065): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-bullet-size'
(3407,10142): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-bullet-border-radius'
(3407,10203): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-bullet-inactive-color'
(3407,10263): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-bullet-inactive-opacity'
(3407,10606): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-bullet-opacity'
(3407,10660): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-color'
(3407,10690): run-time error CSS1039: Token not allowed after unary operator: '-swiper-theme-color'
(3407,10821): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-right'
(3407,10861): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-left'
(3407,11095): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-bullet-vertical-gap'
(3407,11806): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-bullet-horizontal-gap'
(3407,12498): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-fraction-color'
(3407,12588): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-progressbar-bg-color'
(3407,12746): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-color'
(3407,12776): run-time error CSS1039: Token not allowed after unary operator: '-swiper-theme-color'
(3407,13320): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-progressbar-size'
(3407,13679): run-time error CSS1039: Token not allowed after unary operator: '-swiper-pagination-progressbar-size'
(3407,13819): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-border-radius'
(3407,13909): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-bg-color'
(3407,14175): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-sides-offset'
(3407,14222): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-bottom'
(3407,14261): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-top'
(3407,14312): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-size'
(3407,14367): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-sides-offset'
(3407,14510): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-left'
(3407,14550): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-right'
(3407,14588): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-sides-offset'
(3407,14645): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-size'
(3407,14701): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-sides-offset'
(3407,14817): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-drag-bg-color'
(3407,14884): run-time error CSS1039: Token not allowed after unary operator: '-swiper-scrollbar-border-radius'
 */
/* http://meyerweb.com/eric/tools/css/reset/ 
   v2.0 | 20110126
   License: none (public domain)
*/

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, /*p,*/ blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, /*em,*/ img, ins, kbd, q, s, samp,
small, strike, /*strong,*/ /*sub, sup,*/ tt, var,
b, u, i, center,
dl, dt, dd, /*ol, ul, li,*/
fieldset, form, label, legend,
/*table, caption, tbody, tfoot, thead, tr, th, td,*/
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	font-size: 100%;
	font: inherit;
	vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
	display: block;
}
body {

}
/*ol, ul {
	list-style: none;
}*/
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/* -------------------------------- 

Primary style

-------------------------------- */
html * {
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

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

html, body {
  /* important for the full-width image to work */
  height: 100%;
}

body {
  font-size: 100%;
  font-family: "Ubuntu", sans-serif;
  /*background-color: #2e2d32;*/
/**/}

a {
  /*color: white;*/
  text-decoration: none;
}

/* -------------------------------- 

Modules - reusable parts of our design

-------------------------------- */
.cd-container {
  /* this class is used to give a max-width to the element it is applied to, and center it horizontally when it reaches that max-width */
  width: 90%;
  max-width: 768px;
  margin: 0 auto;
}
.cd-container::after {
  /* clearfix */
  content: '';
  display: table;
  clear: both;
}

/* -------------------------------- 

Main components 

-------------------------------- */
#cd-main-content {
  position: relative;
  height: 100%;
  overflow: hidden;
  background-color: #3a393f;
  /* slightly visible only when we resize this element */
  box-shadow: 0 0 40px rgba(0, 0, 0, 0.8);
  z-index: 1;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  transition-duration: 0.5s;
}
#cd-main-content.move-out {
  -webkit-transform: scale(0.6);
  -moz-transform: scale(0.6);
  -ms-transform: scale(0.6);
  -o-transform: scale(0.6);
  transform: scale(0.6);
}
.no-js #cd-main-content {
  height: auto;
  overflow-x: auto;
  overflow-y: auto;
}

#cd-intro {
  position: relative;
  height: 100%;
  background: url("../img/bg-img.jpg") no-repeat center center;
  background-size: cover;
}
#cd-intro h1 {
  position: absolute;
  width: 90%;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
  text-align: center;
  font-size: 18px;
  font-size: 1.125rem;
  font-weight: bold;
  color: white;
}
#menu_toplogo{position: absolute; background-color: white; width: 100%; margin: 0 auto;top: -60px;box-shadow: 0px 1px 1px 1px rgb(0 0 0 / 20%);}
@media only screen and (min-width: 768px) {
  #cd-intro h1 {
    font-size: 26px;
    font-size: 1.625rem;
  }
}
.no-js #cd-intro {
  height: 640px;
}

.cd-header {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50px;
  z-index: 2;
  background: rgba(58, 57, 63, 0.6);
  -webkit-transition: background 0.2s;
  -moz-transition: background 0.2s;
  transition: background 0.2s;
}
@media only screen and (min-width: 768px) {
  .cd-header {
    height: 80px;
  }
}

.cd-blurred-bg {
  /* we use jQuery to apply a mask to this element - CSS clip property */
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("../img/bg-img.jpg") no-repeat center center;
  background-size: cover;
  -webkit-filter: blur(4px);
  filter: blur(4px);
}
.no-js .cd-blurred-bg {
  display: none;
}

#cd-logo {
  position: absolute;
  left: 10px;
  top: 8px;
  width: 100px;
  height: 32px;
}
#cd-logo img {
  display: block;
}
@media only screen and (min-width: 768px) {
  #cd-logo {
    left: 20px;
    top: 24px;
  }
}
@media only screen and (min-width: 1170px) {
  #cd-logo {
    left: 60px;
  }
}

.cd-menu-trigger {
  display: inline-block;
  position: absolute;
  right: 0;
  top: 0;
  height: 50px;
  line-height: 50px;
  padding: 0 .8em;
  text-transform: uppercase;
  font-weight: bold;
  font-size: 14px;
  font-size: 0.875rem;
	z-index: 1;
}
.cd-menu-trigger span {
  /* hamburger icon */
  position: relative;
  display: inline-block;
  width: 18px;
  height: 2px;
  background-color: black;
  vertical-align: middle;
  margin-left: 10px;
  -webkit-transform: translateY(-2px);
  -moz-transform: translateY(-2px);
  -ms-transform: translateY(-2px);
  -o-transform: translateY(-2px);
  transform: translateY(-2px);
}
.cd-menu-trigger span::before, .cd-menu-trigger span::after {
  content: '';
  display: inline-block;
  position: absolute;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: inherit;
  -webkit-transition: all 0.2s;
  -moz-transition: all 0.2s;
  transition: all 0.2s;
}
.cd-menu-trigger span::before {
  top: -6px;
}
.cd-menu-trigger span::after {
  bottom: -6px;
}
/*.no-touch .cd-menu-trigger:hover span::before {
  top: -8px;
}
.no-touch .cd-menu-trigger:hover span::after {
  bottom: -8px;
}*/
@media only screen and (min-width: 768px) {
  .cd-menu-trigger {
    top: 16px;
    right: 10px;
    font-size: 16px;
    font-size: 1rem;
  }
}
@media only screen and (min-width: 1170px) {
  .cd-menu-trigger {
    right: 60px;
  }
}

#main-nav {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: white;
  /* Force Hardware Acceleration in WebKit */
  -webkit-transform: translateZ(0);
  -webkit-backface-visibility: hidden;
  /* we move this element off the canvas */
  -webkit-transform: translateY(-100%);
  -moz-transform: translateY(-100%);
  -ms-transform: translateY(-100%);
  -o-transform: translateY(-100%);
  transform: translateY(-100%);
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.5s;
  -moz-transition-duration: 0.5s;
  transition-duration: 0.5s;
  z-index: 20;
}
#main-nav ul {
  height: 100%;
}
#main-nav li {
  /*height: 8.4%;*/
  margin: 0;
  padding: 0;
}
#main-nav li a {
  position: relative;
  display: block;
  padding: 0 10%;
  height: 100%;
  border-bottom: 1px solid #dfdbec;
  color: #3a393f;
  font-size: 20px;
  font-size: 1.25rem;
  font-weight: bold;
	
  -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
#main-nav li a span {
  position: absolute;
  left: 50%;
  top: 50%;
  bottom: auto;
  right: auto;
  -webkit-transform: translateX(-50%) translateY(-50%);
  -moz-transform: translateX(-50%) translateY(-50%);
  -ms-transform: translateX(-50%) translateY(-50%);
  -o-transform: translateX(-50%) translateY(-50%);
  transform: translateX(-50%) translateY(-50%);
}
.no-touch #main-nav li a:hover {
  background-color: #f5d83c;
}
#main-nav li:last-child a {
  border-bottom: none;
}
#main-nav .cd-close-menu {
  position: absolute;
  top: -47px;
  right: 0px;
  display: inline-block;
  width: 40px;
  height: 40px;
  /*background-color: #d26c64;*/
  /* image replacement */
  overflow: hidden;
  text-indent: 100%;
  white-space: nowrap;
}
#main-nav .cd-close-menu::before, #main-nav .cd-close-menu::after {
  content: '';
  display: inline-block;
  position: absolute;
  top: 18px;
  left: 10px;
  width: 20px;
  height: 3px;
  background-color: black;
  -webkit-transition-property: -webkit-transform;
  -moz-transition-property: -moz-transform;
  transition-property: transform;
  -webkit-transition-duration: 0.3s;
  -moz-transition-duration: 0.3s;
  transition-duration: 0.3s;
}
#main-nav .cd-close-menu::before {
  -webkit-transform: rotate(45deg);
  -moz-transform: rotate(45deg);
  -ms-transform: rotate(45deg);
  -o-transform: rotate(45deg);
  transform: rotate(45deg);
}
#main-nav .cd-close-menu::after {
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -ms-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}
.no-touch #main-nav .cd-close-menu:hover::before {
  -webkit-transform: rotate(225deg);
  -moz-transform: rotate(225deg);
  -ms-transform: rotate(225deg);
  -o-transform: rotate(225deg);
  transform: rotate(225deg);
}
.no-touch #main-nav .cd-close-menu:hover::after {
  -webkit-transform: rotate(315deg);
  -moz-transform: rotate(315deg);
  -ms-transform: rotate(315deg);
  -o-transform: rotate(315deg);
  transform: rotate(315deg);
}
#main-nav.is-visible {
  box-shadow: 0 0 20px rgba(0, 0, 0, 0.4);
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
  margin-top: 60px;
}
.no-js #main-nav {
  position: static;
  -webkit-transform: translateY(0);
  -moz-transform: translateY(0);
  -ms-transform: translateY(0);
  -o-transform: translateY(0);
  transform: translateY(0);
}
.no-js #main-nav .cd-close-menu {
  display: none;
}

.cd-shadow-layer {
  position: fixed;
  top: 0;
  left: 0;
  height: 100%;
  width: 100%;
  background: rgba(0, 0, 0, 0.4);
  z-index: 2;
  opacity: 0;
  visibility: hidden;
  -webkit-transition: visibility 0s 0.5s, opacity 0.5s 0s;
  -moz-transition: visibility 0s 0.5s, opacity 0.5s 0s;
  transition: visibility 0s 0.5s, opacity 0.5s 0s;
}
.cd-shadow-layer.is-visible {
  opacity: 1;
  visibility: visible;
  -webkit-transition-delay: 0s;
  -moz-transition-delay: 0s;
  transition-delay: 0s;
}

@media screen and (min-width: 320px) {
 .cd-menu-trigger {
    top: 9px;
}
    #main-nav li {
        height: 9.4%;
    }	
}
@media screen and (min-width: 768px) {
 #main-nav .cd-close-menu {
    right: 200px;
}
}
@media screen and (min-width: 1002px) {
 .cd-menu-trigger {
    /*top: 15px;*/
}	
 #main-nav .cd-close-menu {
    right: 300px;
}
 #main-nav li {
  height: 8.4%;
}
}

@media screen and (min-width: 1200px) {
 #main-nav .cd-close-menu {
    right: 400px;
}
}
@media screen and (min-width: 1400px) {
 #main-nav .cd-close-menu {
    right: 480px;
}
}
@media screen and (min-width: 1920px) {
 #main-nav .cd-close-menu {
    right: 700px;
}
 .cd-menu-trigger {
    right: 250px;
 }
}

@charset "utf-8";


/* outline-off */

a {
    cursor: pointer;
    color: #000000;
}

    a:link {
        text-decoration: none;
    }

    a:visited {
        text-decoration: none;
    }

    a:hover {
        text-decoration: none;
    }

    a:active {
        text-decoration: none;
    }


.clear {
    display: block;
    clear: both;
}

/*这行代码对于大多数嵌入网页的图片+视频有效，所以可以写成*/
img, object {
    max-width: 100%;
    border: 0;
}

/*老版本的IE不支持max-width，所以只好写成*/
img {
    width: 100%;
    border: 0;
}

img {
    -ms-interpolation-mode: bicubic;
    border: 0;
}

.left {
    float: left;
}

.right {
    float: right;
}

body {
    font-family: "微軟正黑體修正", "微軟正黑體", "Microsoft JhengHei", "STHeiti", "PMingLiU", "新細明體", "MingLiU","DFKai-sb", Arial, Helvetica, FreeSans, sans-serif;
    margin: 0 auto;
    font-size: 1em;
    overflow-x: hidden;
    line-height: 1.8em;
}

    body img {
        border: 0px;
    }


#wrap {
    width: 100%;
    margin: 0 auto;
    display: block;
    position: relative;
    word-wrap: break-word;
    word-break: break-all;
    text-align: justify; /*中文左右齊行*/
    text-justify: inter-ideograph; /*中文左右齊行*/
}



#header {
    margin: 0 auto;
    text-align: center;
}

    #header img {
        width: auto;
    }


#pageheading-inner {
    width: 100%;
    margin: 0 auto;
    display: block;
    position: relative;
    background-color: #eeeeee;
    margin-bottom: 30px;
}

#pageheading {
    width: 90%;
    margin: 0 auto;
    /*padding: 25px 5%;*/
}
.mobile_box {margin: 0 auto;overflow: hidden;}
.youarehere,.youarehere2 {
    border-left: solid 5px #f5d83c;
    padding-left: 0px;
    font-size: 1.25em;
    letter-spacing: 4px;
    float: left;
}
.youarehere2 {
    border-left: solid 5px #f5d83c;
    padding-left: 20px;
    font-size: 1.25em;
    letter-spacing: 2px;
}
.choice {
    padding-top: 30px;
}

.searchdiv {
    padding-top: 5px;
}


#main-inner {
    width: 100%;
    margin: 0 auto;
    display: block;
    position: relative;

}


#main {
    width: 100%;
    margin: 0 auto;
    /*padding: 30px 5%;*/
}
/*EBCMAIN主要內容*/

#ebcmain-inner {
    width: 100%;
    margin: 0 auto;
    position: relative;
    /*margin-bottom: 30px;*/
    letter-spacing: 1px;
}

#ebcmain {
    width: 90%;
    margin: 0 auto;
    padding: 30px 5%;
}

#ebcmain-left {
    margin-top: 10px;
}

#ebcmain-right {
    display: none;
    margin-top: 10px;
}

/*RIGHT BANNER*/
.banner {
    width: 300px;
    margin: 0 auto;
    margin-bottom: 20px;
    position: relative;
}
/*黑底pc-header*/
#pc-header-inner {
    margin: 0 auto;
    background-color: black;
    color: white;
    height: 43px;
    padding-left: 10px;
    padding-right: 10px;
    padding-top: 15px;
    letter-spacing: 2px;
    display: none;
}

    #pc-header-inner a {
        color: white;
    }

    #pc-header-inner img {
        width: auto;
    }

.right-search {
    padding-left: 10px;
    padding-bottom: 20px;
    display: block;
    clear: both;
}


/*灰白漸層底pc-logo*/
#pc-logo-inner {
    margin: 0 auto;
    box-shadow: 0px 1px 1px 1px rgb(0 0 0 / 20%);
    display: none;
}

    #pc-logo-inner img {
        width: auto;
		height: 62.5px;
    }




/*mobile-LOGO*/
#mobile-logo-inner {
    margin: 0 auto;
    background: #e91306;
    background: -moz-linear-gradient(top, #fff 0%, #eee 100%);
    background: -webkit-linear-gradient(top, #fff 0%,#eee 100%);
    background: linear-gradient(to bottom, #fff 0%,#eee 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#fff', endColorstr='#eee',GradientType=0 );
    text-align: center;
    /*padding: 5px 0;*/
    /*position: fixed;*/
    top: 0;
    z-index: 5;
    width: 100%;
	box-shadow: 0px 1px 1px 1px rgb(0 0 0 / 20%);
}

#mobile-logo-inner-margin {
    /*height: 75px;*/
}

#mobile-logo-inner img {
    width: auto;
}

.logo-ss {
    display: inline-block;
    /*width: 65%;*/
    margin: 0 auto;
    /*padding: 4px 0;*/
}

/*黃底pc-NAV*/
#pc-nav-inner {
    margin: 0 auto;
    background: #f5d83c;
    padding-left: 40px;
    padding-right: 10px;
    letter-spacing: 1px;
    font-weight: bolder;
    width: auto;
    /*overflow:hidden;*/
    /*height:60px;*/
    position: relative;
    margin-top: -10px;
    padding-top: 1px;
    display: none; /*手機板取消左右滑動->不顯示*/
}

    #pc-nav-inner img {
        width: auto;
    }

#pc-nav ul {
    padding: 0;
    margin-top: 0;
}

    #pc-nav ul li {
        float: left;
        list-style: none;
        padding: 0px 5px 20px 0;
    }

        #pc-nav ul li::after {
            content: " ｜";
        }

        #pc-nav ul li:last-child::after {
            content: " ";
        }



/*東森各頻道*/
.ebc-channels {
    margin-bottom: 90px;
}

    .ebc-channels .list {
        clear: both;
        padding-top: 20px;
    }
        /*.ebc-channels .list a{
	display:block;
	float:left;
	padding:auto;
	padding-top:15px;
	padding-bottom:15px;
	width:47%;
	margin:1%;
	border:1px #aaaaaa solid;
	text-align:center;
}*/
        .ebc-channels .list a {
            display: block;
            /*float:left;*/
            padding: 15px;
            border: 1px #ffffff solid;
            margin-bottom: 20px;
        }

            .ebc-channels .list a:hover {
                border: 1px #f6d83a solid;
            }

            .ebc-channels .list a .box .title {
                background-color: #f3efe6;
                padding: 8px 12px;
                font-size: 1.125em;
                font-weight: bold;
                margin-top: -10px;
            }

            .ebc-channels .list a img {
                width: auto;
            }

.videobox {
    padding-top: 30px;
}

.ebc-introduction {
    margin-bottom: 90px;
    position: relative;
}

    .ebc-introduction .ver {
        /*display:inline-block;
	top:-5px;
	margin-left:130px;
	z-index:2;
	position:absolute;*/
        background-color: #fcf7ec;
        padding: 20px 10px 10px 10px;
        text-align: right;
    }

        .ebc-introduction .ver ul, .ebc-introduction .ver ul li {
            padding: 0;
            margin: 0;
        }

            .ebc-introduction .ver ul li {
                display: inline-block;
                border: 1px #aaaaaa solid;
                padding: 5px;
                cursor: pointer;
                margin-right: 5px;
            }

.yellowdot {
    background: url("../images/bgicon.png") left top no-repeat;
    padding-left: 40px;
    border-bottom: 1px solid #cecbc5;
    margin-bottom: 20px;
}

.ebc-introduction h3 {
    font-weight: bold;
    font-size: 1.1em;
    background-color: #0aa8fa;
    color: #FFFFFF;
    padding: 3px 10px;
}

.more-btn {
    display: inline-block;
    padding: 3px 30px;
    border: 1px #000 solid;
    text-align: center;
}

.ebc-originaldrama {
    margin-bottom: 90px;
}

    .ebc-originaldrama .slidepic {
        position: relative;
        width: 100%;
        clear: both;
        margin-top: 20px;
    }

.hot {
    position: absolute;
    top: 0;
    z-index: 3;
    right: 0;
}

    .hot img, .arrow-left img {
        width: auto;
    }

.arrow-left {
    position: absolute;
    top: 40%;
    z-index: 3;
    left: 10px;
}

.arrow-right {
    position: absolute;
    top: 40%;
    z-index: 3;
    right: 10px;
}

.originaldrama-logo {
    background-color: #f4f4f4;
    text-align: center;
    margin-top: -10px;
}

    .originaldrama-logo img {
        width: auto;
    }
/*東森歷史沿革*/
.ebc-history {
    margin-bottom: 90px;
}

    .ebc-history .history {
        clear: both;
        padding-top: 20px;
    }

.history .one {
    padding-bottom: 30px;
    padding-top: 10px;
    padding-left: 15px;
}

.history-img {
}

    .history-img img {
        width: auto;
        margin: 10px 10px 0 0;
        border: 1px solid #9E9E9E;
        padding: 2px;
    }

.yearyear {
    display: inline-block;
    background-color: #f5d83c;
    padding: 5px 20px;
    text-align: left;
    cursor: pointer;
}

.history .year {
    background: url(../images/yellow_02.jpg) repeat-y left bottom;
    margin-bottom: 30px;
}

.history .one .date {
    display: inline-block;
    /*background-color:#f5d83c;*/
    padding: 5px 20px;
    text-align: left;
    border: 2px #f5d83c solid;
}

.history .one ul {
}

    .history .one ul li .event {
        display: block;
        font-weight: bold;
        background-color: #4fc3f7;
        color: white;
        padding: 0 10px;
        font-size: 1.1em;
    }

    .history .one ul li ul {
        background-image: none;
    }

.history ul {
    margin: 0;
    padding: 0;
    padding-bottom: 5px;
}

    .history ul li {
        /* padding-left: 30px;
        background: url(../images/yellow_01.jpg) no-repeat left top; */
        /*padding-top: 10px;*/
    }
/*廣告*/
.ad_300250 {
    clear: both;
    width: 300px;
    height: 250px;
    margin-bottom: 20px;
    padding-bottom: 20px;
}
/*APPS*/
.apps-inner {
    width: 100%;
    margin: 0 auto;
    display: block;
    position: relative;
    margin-bottom: 30px;
}

.apps-main {
    width: 90%;
    margin: 0 auto;
    padding: 30px 5%;
    text-align: justify;
    word-wrap: break-word;
    word-break: break-all;
}

.apps-box {
    margin: 20px 0;
    clear: both;
}

.apps-info img {
    width: auto;
}

.apps-info ul {
    padding: 0;
    margin: 0;
    padding-top: 40px;
    padding-bottom: 40px;
}

    .apps-info ul li {
        padding: 2px 0;
        margin: 0;
        list-style: none;
    }

.qr img {
    width: 45%;
}


/*自律諮詢委員會*/
.meeting-record {
    /*border: solid 1px #aaa;*/
    /*padding: 20px;*/
}

    .meeting-record h3 {
        padding-bottom: 20px;
        font-size: 1em;
    }

    .meeting-record p {
        padding: 5px 0;
    }

    

    .meeting-record img {
        width: auto;
    }
/*最新公告*/
.nnews-box {
    border: solid 1px #aaa;
    margin-bottom: 30px;
}

.nnews-date {
    background-color: #eeeeee;
    border-left: solid 5px #f5d83c;
    float: left;
    width: 105px;
    padding: 10px 0 10px 15px;
}

.nnews-sticky {
    float: right;
    width: 30px;
    text-align: right;
    height: 30px;
    padding-right: 20px;
}

    .nnews-sticky img {
        width: auto;
    }

.nnews-content {
    padding: 20px;
    display: block;
}

    .nnews-content p {
        padding: 5px 0;
    }

    .nnews-content a {
        text-decoration: underline;
        color: #0066cc;
    }

.nnews-box:last-child {
    margin-bottom: 0;
}

/*留言板*/
.message_btn {
    width: 64px;
    margin-top: 20px;
    color: #000;
    border: 0;
    font-family: Arial, Helvetica, sans-serif, "微軟正黑體", "新細明體", "標楷體";
    font-size: 1em;
    padding: 0px 38px;
    display: block;
    text-decoration: none;
    cursor: pointer;
    background-color: #f5d83c;
    text-align: center;
}

    .message_btn:active, .message_btn:hover {
        background-color: #f5bf3c;
    }

.message-box {
    border: solid 1px #aaa;
    margin-bottom: 30px;
}

.gray-bg {
    background-color: #cccccc;
}

.message-name {
    background-color: #fff;
    border-left: solid 5px #f5d83c;
    float: left;
    width: auto;
    padding: 10px 15px 10px 15px;
}

.message-time {
    clear: both;
    text-align: right;
    height: 30px;
    padding: 10px 20px 10px 15px;
}

.message-content {
    padding: 20px;
    display: block;
}

    .message-content p {
        padding: 5px 0;
    }

.message-reply {
    background-color: #eeeeee;
    padding: 20px;
    margin: 20px;
    margin-top: 0;
}

.message-replytime {
    text-align: right;
}

.message-box:last-child {
    margin-bottom: 0;
}

/*頻道快訊*/
.marquee {
    margin-bottom: 60px;
}

.marquee-text {
    margin: 20px 0;
    clear: both;
}
/*觀眾處理機制*/
.mechanism {
    margin-bottom: 60px;
}

.mechanism-text {
    margin: 20px 0;
    clear: both;
}

    .mechanism-text a {
        text-decoration: underline;
        color: #0066cc;
    }

.situation {
    margin-bottom: 60px;
}

.situation-text {
    margin: 20px 0;
    clear: both;
}

    .situation-text img {
        width: auto;
    }

    .situation-text .login {
        text-align: center;
    }
/*節目表*/
#tv-explain {
    padding-top: 15px;
}

    #tv-explain img {
        width: auto;
        vertical-align: middle;
    }

    #tv-explain li {
        width: 45%;
        display: inline-block;
        padding: 3px 0;
    }

.tvschedule {
}

/* table */
.table {
    /*display: table; 
  border-collapse: collapse; */
    width: 100%;
}

.table-slide {
    /*display: table; 
  width:100%;*/
}

/* tr */
/*.row{
	display: table-row; 
}*/

/* td , th */

.cell0, .cell4 {
    display: none;
}

.slidee {
    float: left;
    width: 100%;
}

/*手機版的cell由套件自動控制*/
/*.cell1 {  
  display: none; 
  

}  
  
.cell2 {  
  display: table-cell; 
  padding: 0px;
  width:100%;
  
}  
.cell3 {  
  display: none; 

}*/
/*今日節目表顯示邊界*/
.today .border {
    border: 1px solid #aaaaaa;
}
/*非今日節目表不顯示邊界*/
.border {
    border: 0px;
}
/*.cell-slide{display: table-cell; }  */
.tv-date {
    font-size: 1.25em;
    text-align: center;
    padding-top: 20px;
    padding-bottom: 20px;
    background: #eee;
}

.today .tv-date {
    background: #f5d83c;
}

.tv-list {
    background: #fff;
    padding: 20px;
    font-size: 1.25em;
}

    .tv-list ul li {
        margin: 0;
        border: 0;
        padding: 10px 0;
        list-style: none;
    }

    .tv-list img {
        vertical-align: middle;
        margin-left: 5px;
    }

.nowplaying {
    background: #f5d83c;
}

.gray-line {
    background: #eee;
    height: 3px;
}

.cell0 img, .cell1 img, .cell2 img, .cell3 img, .cell4 img, .cell img {
    width: auto;
}
/*招標公告*/
/*.purchase .one .title img { width:auto; padding-right:10px;}*/

.purchase .one .title {
    background: url(../images/icon_11.png) no-repeat left 2px;
    padding-left: 30px;
}
/*聯絡我們*/
.contactus .customer_service1 {
    background: url(../images/contact_01.jpg) no-repeat left top;
    padding-left: 90px;
    padding-top: 5px;
    margin-bottom: 30px;
}

    .contactus .customer_service1 a {
        color: #3366CC;
        text-decoration: underline;
    }

.contactus .customer_service2 {
    background: url(../images/contact_02.jpg) no-repeat left top;
    padding-left: 90px;
    padding-top: 5px;
    margin-bottom: 30px;
}

.contactus .customer_service3 {
    background: url(../images/contact_03.jpg) no-repeat left top;
    padding-left: 90px;
    padding-top: 5px;
    margin-bottom: 30px;
}

    .contactus .customer_service1 h3, .contactus .customer_service2 h3, .contactus .customer_service3 h3 {
        font-weight: bold;
    }
/*員工福利*/
.employeewelfare .employeewelfare1 {
    background: url(../images/employeewelfare_01.jpg) no-repeat left 90px;
    padding-left: 90px;
    padding-top: 5px;
    margin-bottom: 30px;
}

    .employeewelfare .employeewelfare1 h3, .employeewelfare .employeewelfare2 h3 {
        font-weight: bold;
    }

.employeewelfare ul {
    padding: 0;
    margin: 0;
}

    .employeewelfare ul li {
        padding-left: 30px;
        background: url(../images/yellow_01.jpg) no-repeat left 2px;
    }

.employeewelfare .employeewelfare2 {
    background: url(../images/employeewelfare_02.jpg) no-repeat left top;
    padding-left: 90px;
    padding-top: 5px;
    margin-bottom: 30px;
}
/*會員中心*/
.mmmember,.mmmember2 {
    margin-bottom: 30px;
}

    .mmmember a {
        display: block;
        float: left;
        width: 47%;
        margin: 1% 1.5%;
    }
/*新會員註冊*/
.newmember {
    margin-bottom: 30px;
}

    .newmember label {
        display: block;
    }

.rulebox {
    width: 95%;
    border: 1px solid #aaa;
    padding: 1%;
    margin: 10px 0;
}
/*FOOTER*/
#footer-inner {
    width: 100%;
    margin: 0 auto;
    display: block;
    position: absolute;
    background-color: #eeeeee;
    /*margin-top:40px;*/
}
#footer-inner2 {
    width: 100%;
    margin: 0 auto;
    display: block;
    position: relative;;
    background-color: #eeeeee;
    /*margin-top:40px;*/
}
#footer-inner {
    /*bottom: 0;*/
}
#footer {
    width: 90%;
    margin: 0 auto;
    padding: 30px 5%;
	text-align: center;
}

#menu {
    line-height: 1.875em;
    margin-bottom: 30px;
}

    #menu ul {
        padding-left: 0;
    }

    #menu li {
        width: 45%;
        float: left;
        list-style: none;
    }

    #menu a:hover {
        text-decoration: underline;
    }

#visitors, #info {
    font-size: 0.875em;
    color: #666;
    margin-bottom: 20px;
    line-height: 1.5em;
}

    #visitors .today, #visitors .total {
        width: 90%;
        display: inline-block;
    }


/* select */
.shSelect {
    font-family: Arial, Helvetica, sans-serif, "微軟正黑體", "新細明體", "標楷體";
    width: 200px;
    font-size: 15px;
    padding: 4px 6px;
    color: #555555;
    vertical-align: middle;
    margin: 5px 15px 5px 0;
    height: 30px;
    /* In IE7, the height of the select element cannot be changed by height, only font-size */
    *margin-top: 4px;
    /* For IE7, add top margin to align select with labels */
    line-height: 30px;
    /* select 邊框拿掉 */
    border: 1px solid #cccccc;
    background-color: #ffffff;
    /* 圓框 */
    -webkit-border-top-right-radius: 4px;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -webkit-border-top-left-radius: 0;
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    border-radius: 4px;
    background-clip: padding-box;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    -moz-border-radius-topleft: 0;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
}
/* textarea */
textarea {
    font-family: Arial, Helvetica, sans-serif, "微軟正黑體", "新細明體", "標楷體";
    height: 100px;
    width: 95%;
    padding: 4px 6px;
    margin: 5px 15px 5px 0;
    border: solid 1px #ccc;
    font-size: 15px;
    /* 圓框 */
    -webkit-border-top-right-radius: 4px;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -webkit-border-top-left-radius: 0;
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    border-radius: 4px;
    background-clip: padding-box;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    -moz-border-radius-topleft: 0;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
}
/* textbox */
.shText {
    font-family: Arial, Helvetica, sans-serif, "微軟正黑體", "新細明體", "標楷體";
    height: 26px;
    width: 250px;
    font-size: 0.9em;
    padding: 1px 5px;
    margin: 20px 10px;
    border: 1px solid #ccc;
    vertical-align: middle;
    /*color: #ccc;*/
    background-color: #fff;
    background-image: none;
    /* 圓框 */
    -webkit-border-top-right-radius: 4px;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -webkit-border-top-left-radius: 0;
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    border-radius: 4px;
    background-clip: padding-box;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    -moz-border-radius-topleft: 0;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
}

.top-search {
    height: 26px;
    padding: 1px 5px;
    color: #ccc;
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    font-size: 0.9em;
    border-radius: 4px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
    margin-right: 0;
    vertical-align: middle;
}

.top-search-button {
    height: 30px;
    width: 30px;
    border: 1px solid #ccc;
    border-radius: 4px;
    border-top-left-radius: 0;
    border-bottom-left-radius: 0;
    margin-left: -7px;
    background-image: url("../images/search.png");
    background-repeat: no-repeat;
    background-position: center;
    vertical-align: middle;
    cursor: pointer;
    margin-right: 10px;
    background-color: #CCC;
}
/*checkbox*/
.squaredFour {
    margin: 5px 15px 5px 0;
    position: relative;
    font-size: 1.2em;
    height: 1.5em;
    width: 75%;
    /* 圓框 */
    -webkit-border-top-right-radius: 4px;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -webkit-border-top-left-radius: 0;
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    border-radius: 4px;
    background-clip: padding-box;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    -moz-border-radius-topleft: 0;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
}

/*radio */
.rradio input[type="radio"] {
    display: none;
}

    .rradio input[type="radio"] + label {
        display: inline-block;
        background-color: #ddd;
        cursor: pointer;
        padding: 5px 10px;
        margin: 5px 5px 5px 0;
    }

    .rradio input[type="radio"]:checked + label {
        background-color: #f5d83c;
    }
/*checkboxx*/
.checkboxx input[type="checkbox"] {
    display: none;
}

    .checkboxx input[type="checkbox"] + label {
        display: inline-block;
        background-color: #ddd;
        cursor: pointer;
        padding: 5px 10px;
        margin: 5px 5px 5px 0;
    }

    .checkboxx input[type="checkbox"]:checked + label {
        background-color: #f5d83c;
    }
/*Smooth Page Scroll to Top */
.scrollup {
    width: 40px;
    height: 50px;
    text-indent: -9999px;
    opacity: 0.85;
    position: fixed;
    bottom: 0px;
    right: 5%;
    display: none;
    background: url(../images/icon_top.png) no-repeat center top #000;
    z-index: 2;
    -webkit-border-top-left-radius: 5px;
    -webkit-border-top-right-radius: 5px;
    -moz-border-radius-topleft: 5px;
    -moz-border-radius-topright: 5px;
    border-top-left-radius: 5px;
    border-top-right-radius: 5px;
}
/*************overlay***************/

/* Overlay style */
.overlay {
    position: fixed;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(25,25,25,.95);
    z-index: 100;
}

    /* Overlay closing cross */
    .overlay .overlay-close {
        width: 40px;
        height: 40px;
        position: absolute;
        right: 15px;
        top: 15px;
        overflow: hidden;
        border: none;
        background: url(../images/cross.png) no-repeat center center;
        -moz-background-size: 100% 100%; /* 老版本的 Firefox */
        background-size: 100% 100%;
        text-indent: 200%;
        color: transparent;
        outline: none;
        z-index: 100;
        cursor: pointer;
    }

    .overlay .overlay-logo {
        width: 240px;
        height: 24px;
        position: absolute;
        left: 15px;
        top: 25px;
        overflow: hidden;
        border: none;
        background: url(../images/0412001.png) no-repeat center center;
        -moz-background-size: 100% 100%; /* 老版本的 Firefox */
        background-size: 100% 100%;
        text-indent: 200%;
        color: transparent;
        outline: none;
        z-index: 100;
        cursor: pointer;
    }

    .overlay .overlay-content {
        color: #fff;
        position: relative;
        top: 55%;
        height: 85%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        width: 90%;
        margin: 0 auto;
        padding: 2%;
        overflow: scroll;
        overflow-x: hidden;
        overflow-y: auto;
    }


        .overlay .overlay-content a {
            text-decoration: underline;
            color: #f5d83c;
        }

.login_message .win textarea {
    overflow: auto;
    height: 200px;
}

.final-top {
    margin-bottom: 20px;
}

.final-top-member {
    padding-bottom: 20px;
    border-bottom: #FFFFFF 1px solid;
    margin-bottom: 20px;
}

.final-top .cate {
    border-left: solid 5px #f5d83c;
    padding-left: 20px;
    font-size: 1.25em;
    letter-spacing: 4px;
}

.final-bottom2 .box-title {
    background-position: left 5px;
    padding-top: 0px;
    font-size: 1.125em;
}

.final-bottom2 .text {
    font-size: 0.875em;
    line-height: 1.5em;
}


.overlay .overlay-content img {
    width: auto;
    margin: 2px;
}

.overlay .overlay-content .product_text {
    margin: 0 auto;
    text-align: left;
}

.overlay .overlay-content .login_message {
    margin: 0 auto;
    text-align: left;
}

.overlay .overlay-content .employe {
    margin: 0 auto;
    text-align: left;
    padding-bottom: 50px;
}

.checknumber {
    display: block;
    font-size: 0.9em;
}

.message_btn2 {
    margin: 0 auto;
    margin-top: 20px;
    color: #000;
    border: 0;
    font-family: Arial, Helvetica, sans-serif, "微軟正黑體", "新細明體", "標楷體";
    font-size: 1em;
    padding: 8px 38px;
    display: block;
    text-decoration: none;
    cursor: pointer;
    background-color: #f5d83c;
    text-align: center;
    border-radius: 5px;
    width: 260px;
}

    .message_btn2:active, .message_btn2:hover {
        background-color: #f5bf3c;
    }
/* Effects */
.overlay-scale {
    visibility: hidden;
    opacity: 0;
    -webkit-transform: scale(0.9);
    transform: scale(0.9);
    -webkit-transition: -webkit-transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
    transition: transform 0.2s, opacity 0.2s, visibility 0s 0.2s;
}

    .overlay-scale.open {
        visibility: visible;
        opacity: 1;
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transition: -webkit-transform 0.4s, opacity 0.4s;
        transition: transform 0.4s, opacity 0.4s;
    }


/*活動專區*/

.fncnews-list-area {
    margin: 0 auto;
    position: relative;
    margin-bottom: 20px;
}

.gray-box {
    background-color: #f6f6f6;
}

.yellow-box {
    background-color: #f5d83c;
}

.white-box {
    background-color: #ffffff;
}

.yellow-boder-box {
    border: 1px solid #f5d83c;
}

.deepgray-box {
    background-color: #dddddd;
}

.active-list-box {
    position: relative;
    padding: 0px 10px 10px 10px;
    font-size: 1.15em;
}

    .active-list-box .box {
        margin-bottom: 10px;
        position: relative;
    }

        .active-list-box .box .text {
            padding: 5px;
            font-size: 0.875em;
            line-height: 1.4em;
        }

            .active-list-box .box .text .title {
                font-weight: bold;
                font-size: 1.2em;
            }

            .active-list-box .box .text .time {
                color: #ff9000;
            }

            .active-list-box .box .text .summary {
                font-size: 0.9em;
            }

            .active-list-box .box .text .btn div {
                font-size: 0.9em;
                display: inline-block;
                padding: 5px 10px;
                margin: 5px 5px 5px 0;
            }

            .active-list-box .box .text .replytime {
                font-size: 0.9em;
                color: #3e6d18;
            }

    .active-list-box .rade .pic {
        opacity: 0.7; /*透明度設為 0.7*/
        filter: alpha(opacity=70); /*IE8 與更早的版本*/
    }

    /*.active-list-box .rade .text .time {
        color: #999;
    }

    .active-list-box .rade .text .replytime {
        color: #999;
    }*/

    .active-list-box .box .pic {
        position: relative;
    }

        .active-list-box .box .pic .infotext {
            position: absolute;
            font-size: 0.8em;
            top: 45%;
            left: 40%;
            z-index: 3;
            font-weight: bold;
            color: #FFFFFF;
        }

.active-channel {
    background-color: #0aa8fa;
    color: #FFF;
    font-size: 0.9em;
    text-align: center;
}

.read {
    position: absolute;
    top: 0;
    z-index: 3;
    right: 0;
}

    .read img {
        width: auto;
    }

.target-img { /*控制圖片顯示比例16:9*/
    width: 100%;
    height: 0;
    padding-bottom: 56.25%;
    overflow: hidden;
}

    .target-img img {
        width: 100%;
    }

.box-title {
    padding: 20px;
    letter-spacing: 2px;
    font-weight: bolder;
    background-image: url("../images/yellow-left.png");
    background-repeat: no-repeat;
    background-position: center left;
}
/*旅遊美食*/
.travelfood-area img {
    width: auto;
}

.travelfood-list-box {
    padding: 10px;
}

.travelfood-one {
    padding: 10px;
    margin-bottom: 20px;
}

    .travelfood-one .summary {
        font-weight: bolder;
    }

    .travelfood-one .tel, .travelfood-one .add, .travelfood-one .recommend {
        line-height: 1.5em;
    }

.travelfood-theme {
    margin-bottom: 10px;
}

    .travelfood-theme p {
        padding: 0 20px 20px 20px;
    }


.travelfood-one .pic {
    width: 100%;
    position: relative;
    margin-bottom: 10px;
}

.moremore_showintro {
    border-top: 1px #ccc solid;
    font-size: 0.875em;
    margin-top: 10px;
    padding: 5px 5px 0 5px;
    text-align: right;
}

    .moremore_showintro a {
        color: #000983;
    }

.ad_336280 {
    width: 336px;
    height: 280px;
    margin: 20px auto;
}
/*頁數*/
.page-area {
    padding: 20px 10px;
    margin: 0 auto;
    text-align: center;
    margin-bottom: 20px;
}

    .page-area a {
        display: inline-block;
        margin: 0 5px;
    }

.white-btn {
    background-color: #fff;
    font-weight: bolder;
    padding: 3px 10px;
    letter-spacing: 2px;
}
/*上傳照片*/
.fncnews-content {
    margin: 0 auto;
    position: relative;
    padding: 10px;
    padding-bottom: 50px;
    margin-bottom: 20px;
}

    .fncnews-content img {
        width: auto;
    }

.news-cover {
    position: relative;
    margin-bottom: 30px;
}

    .news-cover .play-icon {
        top: 29%;
        left: 38%;
    }

        .news-cover .play-icon img {
            width: auto;
        }

.mobile-share {
    padding: 10px 0% 15px 0%;
}

    .mobile-share a {
        display: inline-block;
        width: 17%;
        margin: 0 1px;
        text-align: center;
    }

.active-box .text {
    padding: 0 20px;
    font-size: 1.05em;
}

.active-name .text {
    font-weight: bold;
    font-size: 1.25em;
    color: #2196F3
}

.active-time .text {
    color: #ff9000;
    font-size: 1.2em;
}

.playinput {
    font-size: 1.1em;
    height: 1.3em;
    width: 75%;
}

.ok a {
    color: #3366CC;
    text-decoration: underline;
}

.yellow_btn {
    display: inline-block;
    margin-top: 10px;
    padding: 10px 20px;
    color: #000;
    font-size: 1.2em;
    border: 2px #FFF solid;
    background: rgba(245,216,60,1.0);
    border: 2px solid #e7e7e6;
    -webkit-border-radius: 50px;
    -moz-border-radius: 50px;
    border-radius: 50px;
    font-weight: bold;
}

    .yellow_btn:hover {
        background: rgba(245,216,60,0.8);
        color: #000;
        text-decoration: none;
    }

    .yellow_btn:active {
        color: #FFF;
        text-decoration: none;
    }

.module-multiple { /*選擇題*/
    padding-bottom: 10px;
}

    .module-multiple .a .box {
        float: left;
        border: 1px solid #6c7079;
        padding: 1%;
        width: 45%;
        margin: 1%;
        text-justify: none; /*取消齊行*/
        text-align: left; /*取消齊行*/
    }

        .module-multiple .a .box .text {
            display: block;
            padding: 0;
            min-height: 50px;
            font-size: 0.9em;
            line-height: 1.5em;
            margin-top: 3px;
        }

    .module-multiple .q {
        font-weight: bold;
    }

.module-description { /*簡答題*/
    padding-bottom: 10px;
}

    .module-description .q {
        font-weight: bold;
    }

    .module-description .a textarea {
        overflow: auto;
    }

.module-download { /*下載*/
    padding-bottom: 10px;
}

    .module-download .a .box {
        float: left;
        border: 1px solid #6c7079;
        padding: 1%;
        width: 97%;
        /*margin:1%;*/
        text-justify: none; /*取消齊行*/
        text-align: left; /*取消齊行*/
        margin-bottom: 10px;
    }

        .module-download .a .box .pic {
            cursor: pointer;
        }

        .module-download .a .box .text {
            display: block;
            padding: 0;
            line-height: 1.5em;
        }

        .module-download .a .box .btn img {
            width: 60%;
            margin-top: 10px;
        }

.download-popup-pic {
    width: 100%;
    margin: 0 auto;
    display: block;
    position: relative;
    text-align: center;
}

.module-upload { /*上傳*/
    padding-bottom: 10px;
}

    .module-upload .a .box {
        float: left;
        border: 1px solid #6c7079;
        padding: 1%;
        width: 45%;
        margin: 1%;
        text-justify: none; /*取消齊行*/
        text-align: left; /*取消齊行*/
    }

        .module-upload .a .box .text {
            display: block;
            padding: 0;
            min-height: 50px;
            font-size: 0.9em;
            line-height: 1.5em;
            margin-top: 3px;
        }
/*確認個資是否正確*/

.infocheck {
    padding: 10px 20px;
    border: 1px solid #e7e7e6;
    margin-bottom: 30px;
}

    .infocheck label {
        display: block;
    }

/* Flexible iFrame */

.Flexible-container {
    position: relative;
    padding-bottom: 56.25%;
    padding-top: 30px;
    height: 0;
    overflow: hidden;
}

    .Flexible-container iframe,
    .Flexible-container object,
    .Flexible-container embed {
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
    }

/*載入更多*/
.load-more {
    margin: 20px auto;
    position: relative;
    text-align: center;
    height: 70px;
}

.load-more-btn {
    background-color: #FFFFFF;
    padding: 20px 80px;
    letter-spacing: 2px;
    border: 1px solid #eee;
}

/* textarea */
.textarea {
    font-family: Arial, Helvetica, sans-serif, "微軟正黑體", "新細明體", "標楷體";
    height: 100px;
    width: 95%;
    padding: 4px 6px;
    margin: 5px 15px 5px 0;
    border: solid 1px #ccc;
    font-size: 15px;
    /* 圓框 */
    -webkit-border-top-right-radius: 4px;
    -webkit-border-bottom-right-radius: 0;
    -webkit-border-bottom-left-radius: 0;
    -webkit-border-top-left-radius: 0;
    -webkit-border-radius: 4px;
    -webkit-background-clip: padding-box;
    border-top-right-radius: 4px;
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    border-radius: 4px;
    background-clip: padding-box;
    -moz-border-radius-topright: 4px;
    -moz-border-radius-bottomright: 0;
    -moz-border-radius-bottomleft: 0;
    -moz-border-radius-topleft: 0;
    -moz-border-radius: 4px;
    -moz-background-clip: padding;
}

/*Apple ID登入按鈕*/
#appleid-signin > div {
    margin: 0 auto;
    margin-top: 20px;
    cursor: pointer;
    max-width:288px;
}

    #appleid-signin > div > div > svg {
        height: 40px;
    } 

/*電子文件管理系統*/
#pdf_content {position: relative;margin-top: 30px;}

.list_box {position: relative;/*margin-bottom: 80px;*/}
.list_title {
	font-weight: bold;
	font-size: 1.1em;
	text-align: left;
	letter-spacing: 0.4px;
	margin-left: 25px; 
	text-decoration:underline solid #f5d83c 2px;
	text-underline-offset: 8px;
}
.login_right {float:right;/*margin-top: 25px;*/}
.title_y {color: #f5d83c; font-size:1.3em;}
.pull-right {
    /*float: right !important;*/
	margin: 0;
}


.navbar {
  overflow: hidden;
  /*background-color: #333;*/
  font-family: Arial, Helvetica, sans-serif;
}

.navbar a {
  float: left;
  font-size: 16px;
  color: white;
  text-align: center;
  padding: 14px 16px;
  text-decoration: none;
}

.dropdown {
  float: left;
  overflow: hidden;
}

.dropdown .dropbtn {
  cursor: pointer;
  font-size: 16px;  
  border: none;
  outline: none;
  color: #585454;
  /*padding: 14px 46px;*/
  background-color: inherit;
  font-family: inherit;
  margin: 0;
}

.dropdown .dropbtn img {
	vertical-align: sub;
    align-items: center;
    padding: 0 5px 0 0;
}
.navbar a:hover, .dropdown:hover .dropbtn, .dropbtn:focus {
  /*background-color: red;*/
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  /*min-width: 160px;*/
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  border-radius: 10px;	
  border: 1px solid #b5abab;
}

.dropdown-content img {
    width: 20px;
    vertical-align: sub;
    align-items: center;
    padding: 0 5px 0 0;	
}

.dropdown-content a {
  float: none;
  color: black;
  padding: 6px 16px;
  text-decoration: none;
  display: block;
  text-align: center;
  /*width:146px!important;*/
  border-radius: 10px;
}

.dropdown-content a:hover {
  background-color: #ddd;
}

.show {
  display: block;
}

.caret {
    display: inline-block;
    width: 0;
    height: 0;
    margin-left: 6px;
    vertical-align: middle;
    border-top: 4px dashed;
    border-top: 4px solid\9;
    border-right: 4px solid transparent;
    border-left: 4px solid transparent;
}
.lchecking {
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#fceabb+0,fccd4d+50,f8b500+51,fbdf93+100;Orange+3D+%235 */
    background: linear-gradient(to bottom,  #fceabb 0%,#fccd4d 50%,#f8b500 51%,#fbdf93 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

	border-radius: 4px;
	border:1px solid #555; 
	padding:5px 10px;

}

.checking {
	/*background-color: #727070;*/
	color: black;
	padding: 15px 20px;
	font-size: 1.2em;
	text-align: center;
	cursor: pointer;
	margin: 0 auto;
	width: 130px;
	margin-top: 50px;
	border-radius: 15px;
	/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#ffc578+0,fb9d23+100;Orange+3D+%233 */
background: linear-gradient(to bottom,  #ffc578 0%,#fb9d23 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */

	-webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;

}

.checking:hover {
	color: white;
}

.unread {
	/*background-color: #727070;*/
	color: #656464;
	padding: 20px;
	font-size: 1.2em;
	text-align: center;
	margin: 0 auto;
	width: 130px;
	margin-top: 50px;
	border-radius: 15px;
    background-color: #c3bebe;

}
.purple_link a{
	text-decoration: solid underline #0c3891 1px;
    text-underline-offset: 3px;
	color: #0c3891!important;
}








/* From Uiverse.io by PaolaMarai */ 
.error {
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,
    Oxygen, Ubuntu, Cantarell, "Open Sans", "Helvetica Neue", sans-serif;
  /*width: 320px;*/
  padding: 12px;
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: start;
  border-radius: 50px;
  background: -webkit-linear-gradient(to right, #f45c43, #eb3349);
  background: linear-gradient(to right, #f45c43, #eb3349);
  box-shadow: 0 0px 10px #de1c3280;
  position: fixed;
  /*right:20px;*/
  top:110px;
}

.error__icon {
  width: 20px;
  height: 20px;
  transform: translateY(-2px);
  margin-right: 8px;
  filter: drop-shadow(2px 1px 2px rgb(0 0 0 / 0.4));
}

.error__icon path {
  fill: #fff;
}

.error__title {
  font-weight: 500;
  font-size: 1em;
  color: #fff;
}

.error__close {
  width: 20px;
  height: 20px;
  cursor: pointer;
  margin-left: auto;
  filter: drop-shadow(2px 1px 2px rgb(0 0 0 / 0.4));
}

.error__close path {
  fill: #fff;
}

/**/
#business_title {
	text-align: center;
	padding: 20px 20px 0 20px;
	/*width: 300px;*/
    margin: 0 auto;
}

#numberpage {
	/*font-size: 1em;
	letter-spacing: 0.2em;
    position: absolute;*/
}

.schedule_box {position: relative;}

.schedule {
	padding: 0;
    list-style: none;
    display: flex
;
    justify-content: center;
    margin: 0;
}

/*.schedule_box ul.schedule li {
    padding: 0 50px;
}*/
.button a{display: flex;/*cursor: pointer;*/}
.schedule_box ul.schedule li {display: flex;/*margin: 0 10px;*/}
.button_icon {
  position: relative;
  height: 100%;
  width: 30px;
  background-color: var(--bg-color-sub);
  display: flex;
  align-items: center;
  justify-content: center;
}
.button_icon2 {
  position: relative;
  height: 100%;
  width: 20px;
  --tw-translate-x: 0.25rem;
    transform: translate(var(--tw-translate-x), var(--tw-translate-y)) rotate(var(--tw-rotate)) skewX(var(--tw-skew-x)) skewY(var(--tw-skew-y)) scaleX(var(--tw-scale-x)) scaleY(var(--tw-scale-y));
  display: flex;
  align-items: center;
  justify-content: center;
  margin-right: 5px;
}
.button .svg {
  width: 20px;
  fill: var(--main-color);
}


/*句式只在viewport 寬度不小於320px才生效*/
@media screen and (min-width: 320px) {
/*電子文件管理系統*/
   .dropdown {
      /*margin-top: 10px;*/
    }
	.login_right {
		margin-top: 18px;
        z-index: 9;
        display: block;
        position: absolute;
        right: 0;
        width: 160px;
    }
	.logo-ss {
    /*width: 160px;*/
    margin-left: 10px;
	float: left;
}
	#pdf_content {height: 380px;}
	.error__title {font-size: 0.9em;}
	.error{padding: 5px 12px;}
	
	.youarehere,.youarehere2 {
    /*margin-left: 15px;*/
    margin-top: 20px;
    }
	.mobile_box {width: 291px;}
	#numberpage {
		text-align: right;
		/*font-size: 0.09em;*/
        letter-spacing: 0.1em;
		position: relative;
        top: -25px;
        float: right;
		right: 10px;
	}
	.htmleaf-container {position: relative;top: -20px;}
	
	
	.button a span {letter-spacing: -0.1em;}
	#business_title {font-size: 1.1em;width: 130px;}
	.schedule_box { margin-top: 5px; margin-bottom: 10px;}
	.schedule_box ul.schedule li { margin: 0 20px;}
}

/*句式只在viewport 寬度不小於360px才生效*/
@media screen and (min-width: 360px) {
/*電子文件管理系統*/
   .dropdown {
      margin-top: 0px;
    }
	.login_right {
		margin-top: 22px;
    }
	
	.youarehere,.youarehere2 {
        margin-left: 10px;
		padding-left: 10px;
    }
	.button a{margin: 0 10px;}
}

/*句式只在viewport 寬度不小於400px才生效*/
@media screen and (min-width: 400px) {
    .logo-ss {
        padding: 0;
    }

    #mobile-logo-inner {
        /*width: 96%;
        padding: 5px 2%;*/
    }

    #visitors .today, #visitors .total {
        margin-right: 35px;
        width: auto;
        display: inline-block;
    }

    #tv-explain li {
        width: auto;
    }

    .qr img {
        width: auto;
    }
    /*上傳照片*/
    .news-cover .play-icon {
        top: 31%;
        left: 38%;
    }
}



/*句式只在viewport 寬度不小於500px才生效*/
@media screen and (min-width: 500px) {
    .message-time {
        clear: none;
    }

    .openness-date {
        display: inline-block;
    }

    .apps-box-left img {
        width: auto;
    }
    /*上傳照片*/
    .news-cover .play-icon {
        top: 33%;
        left: 43%;
    }
    /*美食*/
    .travelfood-one .pic {
        width: 220px;
        margin-bottom: 0px;
        padding-top: 5px;
    }

    .travelfood-one .text {
        padding-left: 5px;
        margin-left: 225px;
    }
}
/*句式只在viewport 寬度不小於640px才生效*/
@media screen and (min-width: 640px) {
    #index-mobile-only {
        display: none;
    }

    /*活動*/
    .active-list-box .box .pic {
        width: 320px;
        position: relative;
        float: left;
    }

        .active-list-box .box .pic .infotext {
            top: 42%;
            left: 36%;
        }


    .active-list-box .box .text {
        padding: 5px;
        margin-left: 325px;
        font-size: 0.875em;
        line-height: 1.4em;
    }
    /*旅遊美食*/
    .travelfood-btn .yellow-btn {
        font-size: 1em;
        margin: 0 5px;
    }

    .travelfood-list-box {
        padding: 20px;
    }
    /*活動*/
    .module-multiple .a .box .text {
        min-height: 30px;
        font-size: 1em;
        line-height: 1.5em;
    }

    .module-download .a .box {
        width: 45%;
        margin: 1%;
    }

        .module-download .a .box .btn img {
            width: auto;
        }

        .module-download .a .box .text {
            font-size: 1em;
            line-height: 1.5em;
        }

    .module-upload .a .box .text {
        min-height: 30px;
        font-size: 1em;
        line-height: 1.5em;
    }
    /*頁數*/

    .page-area a {
        margin: 0 10px;
    }
    /*上傳照片*/
    .news-cover .play-icon {
        top: 40%;
        left: 43%;
    }
}
/*句式只在viewport 寬度不小於680px才生效*/
@media screen and (min-width: 680px) {

    .nnews-content img {
        width: auto;
        float: left;
        margin-right: 15px;
    }
    /*東森各頻道*/

    .ebc-channels .list a {
        float: left;
        width: 41%;
        margin: 1%;
    }

    .arrow-left, .arrow-right {
        top: 45%;
    }
    /*東森歷史沿革*/
    /*.history .one .event{
	display:inline-block;
	padding-left:20px;
}*/
    /*************overlay***************/
    .overlay .overlay-content .login_message {
        text-align: center;
    }

    .checknumber {
        display: inline-block;
    }
    /*會員中心*/
    .mmmember a {
        width: 30%;
    }
}
/*句式只在viewport 寬度不小於768px才生效*/
@media screen and (min-width: 768px) {
	/*電子文件管理系統*/
	.error {width: 520px; right:0;}
	
	#business_title {
	   padding: 20px;
       width: 300px;
	   margin-top: 20px;
	   font-size: 1.3em;
}   
	#numberpage {
       top: 25px;
       right: 95px;
	   position: absolute;
	   font-size: 0.9em;	
}
	.schedule_box ul.schedule li {
    padding: 0 50px;
}
	.htmleaf-container {top: 0px;}
	.schedule_box {
        margin-top: 25px;
    }
	
	.container {
		width: 580px;
		max-width: 100%;
		margin: 0 auto;
	}
}
/*句式只在viewport 寬度不小於800px才生效*/
@media screen and (min-width: 800px) {

    #pc-header-inner {
        display: block;
    }
    #mobile-logo-inner-margin {
        display: none;
    }

    #mobile-logo-inner {
        position: relative;
    }

    /*上傳照片*/
    .fncnews-content {
        padding: 20px;
        margin-bottom: 20px;
        padding-bottom: 50px;
    }

    .searchdiv {
        display: inline-block;
    }
}

/*句式只在viewport 寬度不小於1002px才生效*/
@media screen and (min-width: 1002px) {
    #pc-logo-inner {
        display: block;
    }

    #mobile-logo-inner {
        display: none;
    }

    #pc-nav-inner {
        display: block;
        padding-left: 10px;
    }

    .videobox {
        padding-top: 60px;
    }

    #menu li {
        margin-right: 35px;
        width: auto;
    }

    .message_btn {
        margin-top: 2px;
        display: inline-block;
    }

    #tv-explain ul {
        display: inline-block;
    }

    .slidee {
        width: 90%;
    }


    #ebcmain-inner { /*width:98%;*/
        padding: 0 10px 10px 10px;
    }

    #ebcmain-left {
        float: left;
        width: 100%;
    }



    #contentb { /*真正的“main-left”变成了contentb，他的宽度跟以前的main-left一样，是100%-320.*/
        /*margin-left: 320px;*/
    }

    #ebcmain-right {
        display: block;
        float: right;
        width: 300px;
    }


    /*電腦版的cell1 cell2 cell3統一成cell*/
    /*.cell1, .cell2, .cell3{
	display:block;
	float:left;
}*/
    .cell {
        display: block;
        float: left;
        /*margin:0 0.5%;*/ /*間距由套件控制*/
    }
    /*電腦版一律顯示邊界*/
    .border {
        border: 1px solid #aaaaaa;
    }

    .cell0, .cell4 {
        /*display: table-cell; */
        display: block;
        background-color: #f5d83c;
        cursor: pointer;
        text-align: center;
        width: 5%;
    }

    .cell0 {
        /*background-image:url(../images/pre.png);
    background-repeat:no-repeat;
	background-position:center top;*/
        float: left;
    }

    .cell4 {
        /*background-image:url(../images/next.png);
    background-repeat:no-repeat;
	background-position:center top;*/
        float: right;
    }
    /*電腦版的cell1 cell2 cell3統一成cell，寬度由套件控制，邊界移到.border*/
    /*.cell1 {  
  display: table-cell; 
  border: 1px solid #aaaaaa;
  
  width:32%;
  margin:0 0.5%;
}*/

    /*.cell2 {  
  display: table-cell; 
  width:32%;
   margin:0 0.5%;
}*/

    /*.cell3 {  
  display: table-cell; 
  border: 1px solid #aaaaaa;
  
  width:32%;
   margin:0 0.5%;
}*/

    .apps-box-left {
        float: left;
        width: 440px;
    }

    .apps-box-right {
        margin-left: -470px;
        float: right;
        width: 100%;
    }

    .apps-info {
        margin-left: 470px;
    }
    /*************overlay***************/
    .overlay .overlay-close {
        width: 50px;
        height: 50px;
    }

    .overlay .overlay-content {
        top: 60%;
        width: 936px;
    }

    .final-top {
        margin-left: -356px;
        float: left;
        width: 100%;
    }

    .final-bottom {
        float: right;
        width: 336px;
    }

    .contentb2 {
        margin-left: 356px;
    }

    /*活動*/
    .active-list-box {
        font-size: 1em;
    }
    /*下載*/
    .download-popup-pic {
        width: 80%;
    }
    /*得獎回覆*/
    .login_message .win textarea {
        width: 70%;
    }
    .overlay-login .final-bottom {
        float: none;
        width: auto;
    }
    .final-bottom2 {
        float: right;
        width: 336px;
    }
	/*電子文件管理系統*/
	#pdf_content {height: 768px;}
	.left {
        margin-left: 50px;		
    }
	.login_right {
        margin-top: 25px;
        right: 15px;
    }
	.error__title {
        font-size: 1em;
    }
	
	.youarehere {
        /*margin-top: 25px;*/
    }
	
	#numberpage {right: 210px;}
	#business_title {font-size: 1.45em;}
	.button a span {font-size: 1.2em;}
	
}




/*句式只在viewport 寬度不小於1200px才生效*/
@media screen and (min-width: 1200px) {
    #pc-header, #pc-logo, #pc-nav {
        margin: 0 auto;
        width: 1024px;
    }
    /*東森各頻道*/

    /*會員中心*/
    .mmmember a {
        width: 22%;
    }
    /*活動*/
    .module-multiple .a .box {
        width: 20%;
        text-justify: none; /*取消齊行*/
        text-align: left; /*取消齊行*/
    }

        .module-multiple .a .box .text {
            min-height: 60px;
        }

    .module-upload .a .box {
        width: 20%;
        text-justify: none; /*取消齊行*/
        text-align: left; /*取消齊行*/
    }

        .module-upload .a .box .text {
            min-height: 60px;
        }
	/*電子文件管理系統*/
	.login_right {
        right: 35px;
    }
	#pc-logo{
		margin: 0 auto;
        width: 1200px;
	}
	
	#numberpage {right: 310px;}
}
/*句式只在viewport 寬度不小於1366px才生效*/
@media screen and (min-width: 1366px) {
	#numberpage {
        right: 395px;
    }
}
/*句式只在viewport 寬度不小於1400px才生效*/
@media screen and (min-width: 1400px) {
    .errorr {
        text-align: center;
    }

        .errorr img {
            width: auto;
        }

    /*會員中心*/
    .mmmember a {
        width: 17%;
    }

    #header {
        width: 1380px;
        text-align: left;
    }

    #pageheading {
        /*width: 1380px;
        padding: 30px 0;*/
    }

    .youarehere {
		border-left: solid 5px #f5d83c;
        padding-left: 20px;
        font-size: 1.25em;
        letter-spacing: 4px;
	    width: 18%;
        float: left;
        margin-left: 20px;
    }
	.youarehere2 {
		border-left: solid 5px #f5d83c;
        padding-left: 20px;
        font-size: 1.25em;
        letter-spacing: 4px;
	    
        float: left;
        margin-left: 20px;
    }

    .choice {
        width: 80%;
        float: right;
        text-align: right;
        padding-top: 0;
    }

    #main {
        width: 1380px;
        padding: 30px 0;
    }

    #ebcmain {
        width: 1380px;
        padding: 30px 0;
    }

    #pc-header, #pc-logo, #pc-nav {
        width: 1380px;
    }
        #pc-nav ul li a {
            padding: 20px 10px 20px 10px;
        }

    .apps-main {
        width: 1380px;
        padding: 30px 0;
    }

    .marquee-text {
        margin: 50px 0 30px 25px;
    }

    .mechanism-text {
        margin: 0px 0 30px 25px;
        padding-top: 20px;
    }

    .apps-box {
        margin: 0px 0 30px 25px;
        padding-top: 20px;
    }

    .situation-text {
        margin: 0px 0 30px 0px;
        padding-top: 20px;
    }

    #tv-explain {
        padding-top: 0px;
        display: inline-block;
    }

    #footer {
        width: 1380px;
        padding: 30px 0;
    }

    #menu {
        font-size: 0.875em;
    }

    #visitors, #info {
        font-size: 0.75em;
    }

    #info {
        margin-bottom: 0px;
    }

    /*東森各頻道*/
    .ebc-channels .list a {
        width: 28%;
    }

    .arrow-left, .arrow-right {
        top: 48%;
    }

    .ebc-introduction .ver {
    }

    .contactus .customer_service1, .contactus .customer_service2, .contactus .customer_service3 {
        float: left;
        width: 33%;
    }
    /*活動*/

    .active-list-box {
        font-size: 1.15em;
    }

        .active-list-box .box .text {
            padding: 10px;
        }
    /*上傳照片*/
    .news-cover .play-icon {
        top: 45%;
        left: 45%;
    }
    /*************overlay***************/

    .overlay .overlay-content {
        top: 60%;
        width: 1236px;
    }

    .final-top {
        margin-left: -356px;
        float: left;
        width: 100%;
    }

    .final-bottom {
        float: right;
        width: 336px;
    }

    .contentb2 {
        margin-left: 356px;
    }
	/*電子文件管理系統*/
	.left {
        margin-left: 0px;
    }
	.login_right {
        right: 235px;
    }
	#pc-logo{
		margin: 0 auto;
	}
	.error {
        width: 540px;
        right: 10px;
    }
	
	#numberpage {right: 335px;top:55px;}
	#business_title {margin-top: 0px;font-size: 1.55em;}
	
	.container {
        width: 780px;
    }
	
}
/*句式只在viewport 寬度不小於1920px才生效*/
@media screen and (min-width: 1920px) {
    #numberpage {
	right: 560px;
    width: 150px;
}
}	
/*句式只在viewport 寬度不小於2560px才生效*/
@media screen and (min-width: 2560px) {
    #numberpage {
	right: 900px;

}
}
/**
 * Swiper 11.2.6
 * Most modern mobile touch slider and framework with hardware accelerated transitions
 * https://swiperjs.com
 *
 * Copyright 2014-2025 Vladimir Kharlampidi
 *
 * Released under the MIT License
 *
 * Released on: March 19, 2025
 */

@font-face{font-family:swiper-icons;src:url('data:application/font-woff;charset=utf-8;base64, d09GRgABAAAAAAZgABAAAAAADAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABGRlRNAAAGRAAAABoAAAAci6qHkUdERUYAAAWgAAAAIwAAACQAYABXR1BPUwAABhQAAAAuAAAANuAY7+xHU1VCAAAFxAAAAFAAAABm2fPczU9TLzIAAAHcAAAASgAAAGBP9V5RY21hcAAAAkQAAACIAAABYt6F0cBjdnQgAAACzAAAAAQAAAAEABEBRGdhc3AAAAWYAAAACAAAAAj//wADZ2x5ZgAAAywAAADMAAAD2MHtryVoZWFkAAABbAAAADAAAAA2E2+eoWhoZWEAAAGcAAAAHwAAACQC9gDzaG10eAAAAigAAAAZAAAArgJkABFsb2NhAAAC0AAAAFoAAABaFQAUGG1heHAAAAG8AAAAHwAAACAAcABAbmFtZQAAA/gAAAE5AAACXvFdBwlwb3N0AAAFNAAAAGIAAACE5s74hXjaY2BkYGAAYpf5Hu/j+W2+MnAzMYDAzaX6QjD6/4//Bxj5GA8AuRwMYGkAPywL13jaY2BkYGA88P8Agx4j+/8fQDYfA1AEBWgDAIB2BOoAeNpjYGRgYNBh4GdgYgABEMnIABJzYNADCQAACWgAsQB42mNgYfzCOIGBlYGB0YcxjYGBwR1Kf2WQZGhhYGBiYGVmgAFGBiQQkOaawtDAoMBQxXjg/wEGPcYDDA4wNUA2CCgwsAAAO4EL6gAAeNpj2M0gyAACqxgGNWBkZ2D4/wMA+xkDdgAAAHjaY2BgYGaAYBkGRgYQiAHyGMF8FgYHIM3DwMHABGQrMOgyWDLEM1T9/w8UBfEMgLzE////P/5//f/V/xv+r4eaAAeMbAxwIUYmIMHEgKYAYjUcsDAwsLKxc3BycfPw8jEQA/gZBASFhEVExcQlJKWkZWTl5BUUlZRVVNXUNTQZBgMAAMR+E+gAEQFEAAAAKgAqACoANAA+AEgAUgBcAGYAcAB6AIQAjgCYAKIArAC2AMAAygDUAN4A6ADyAPwBBgEQARoBJAEuATgBQgFMAVYBYAFqAXQBfgGIAZIBnAGmAbIBzgHsAAB42u2NMQ6CUAyGW568x9AneYYgm4MJbhKFaExIOAVX8ApewSt4Bic4AfeAid3VOBixDxfPYEza5O+Xfi04YADggiUIULCuEJK8VhO4bSvpdnktHI5QCYtdi2sl8ZnXaHlqUrNKzdKcT8cjlq+rwZSvIVczNiezsfnP/uznmfPFBNODM2K7MTQ45YEAZqGP81AmGGcF3iPqOop0r1SPTaTbVkfUe4HXj97wYE+yNwWYxwWu4v1ugWHgo3S1XdZEVqWM7ET0cfnLGxWfkgR42o2PvWrDMBSFj/IHLaF0zKjRgdiVMwScNRAoWUoH78Y2icB/yIY09An6AH2Bdu/UB+yxopYshQiEvnvu0dURgDt8QeC8PDw7Fpji3fEA4z/PEJ6YOB5hKh4dj3EvXhxPqH/SKUY3rJ7srZ4FZnh1PMAtPhwP6fl2PMJMPDgeQ4rY8YT6Gzao0eAEA409DuggmTnFnOcSCiEiLMgxCiTI6Cq5DZUd3Qmp10vO0LaLTd2cjN4fOumlc7lUYbSQcZFkutRG7g6JKZKy0RmdLY680CDnEJ+UMkpFFe1RN7nxdVpXrC4aTtnaurOnYercZg2YVmLN/d/gczfEimrE/fs/bOuq29Zmn8tloORaXgZgGa78yO9/cnXm2BpaGvq25Dv9S4E9+5SIc9PqupJKhYFSSl47+Qcr1mYNAAAAeNptw0cKwkAAAMDZJA8Q7OUJvkLsPfZ6zFVERPy8qHh2YER+3i/BP83vIBLLySsoKimrqKqpa2hp6+jq6RsYGhmbmJqZSy0sraxtbO3sHRydnEMU4uR6yx7JJXveP7WrDycAAAAAAAH//wACeNpjYGRgYOABYhkgZgJCZgZNBkYGLQZtIJsFLMYAAAw3ALgAeNolizEKgDAQBCchRbC2sFER0YD6qVQiBCv/H9ezGI6Z5XBAw8CBK/m5iQQVauVbXLnOrMZv2oLdKFa8Pjuru2hJzGabmOSLzNMzvutpB3N42mNgZGBg4GKQYzBhYMxJLMlj4GBgAYow/P/PAJJhLM6sSoWKfWCAAwDAjgbRAAB42mNgYGBkAIIbCZo5IPrmUn0hGA0AO8EFTQAA');font-weight:400;font-style:normal}:root{--swiper-theme-color:#007aff}:host{position:relative;display:block;margin-left:auto;margin-right:auto;z-index:1}.swiper{margin-left:auto;margin-right:auto;position:relative;overflow:hidden;list-style:none;padding:0;z-index:1;display:block}.swiper-vertical>.swiper-wrapper{flex-direction:column}.swiper-wrapper{position:relative;width:100%;height:100%;z-index:1;display:flex;transition-property:transform;transition-timing-function:var(--swiper-wrapper-transition-timing-function,initial);box-sizing:content-box}.swiper-android .swiper-slide,.swiper-ios .swiper-slide,.swiper-wrapper{transform:translate3d(0px,0,0)}.swiper-horizontal{touch-action:pan-y}.swiper-vertical{touch-action:pan-x}.swiper-slide{flex-shrink:0;width:100%;height:100%;position:relative;transition-property:transform;display:block}.swiper-slide-invisible-blank{visibility:hidden}.swiper-autoheight,.swiper-autoheight .swiper-slide{height:auto}.swiper-autoheight .swiper-wrapper{align-items:flex-start;transition-property:transform,height}.swiper-backface-hidden .swiper-slide{transform:translateZ(0);-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-3d.swiper-css-mode .swiper-wrapper{perspective:1200px}.swiper-3d .swiper-wrapper{transform-style:preserve-3d}.swiper-3d{perspective:1200px}.swiper-3d .swiper-cube-shadow,.swiper-3d .swiper-slide{transform-style:preserve-3d}.swiper-css-mode>.swiper-wrapper{overflow:auto;scrollbar-width:none;-ms-overflow-style:none}.swiper-css-mode>.swiper-wrapper::-webkit-scrollbar{display:none}.swiper-css-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:start start}.swiper-css-mode.swiper-horizontal>.swiper-wrapper{scroll-snap-type:x mandatory}.swiper-css-mode.swiper-vertical>.swiper-wrapper{scroll-snap-type:y mandatory}.swiper-css-mode.swiper-free-mode>.swiper-wrapper{scroll-snap-type:none}.swiper-css-mode.swiper-free-mode>.swiper-wrapper>.swiper-slide{scroll-snap-align:none}.swiper-css-mode.swiper-centered>.swiper-wrapper::before{content:'';flex-shrink:0;order:9999}.swiper-css-mode.swiper-centered>.swiper-wrapper>.swiper-slide{scroll-snap-align:center center;scroll-snap-stop:always}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper>.swiper-slide:first-child{margin-inline-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-horizontal>.swiper-wrapper::before{height:100%;min-height:1px;width:var(--swiper-centered-offset-after)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper>.swiper-slide:first-child{margin-block-start:var(--swiper-centered-offset-before)}.swiper-css-mode.swiper-centered.swiper-vertical>.swiper-wrapper::before{width:100%;min-width:1px;height:var(--swiper-centered-offset-after)}.swiper-3d .swiper-slide-shadow,.swiper-3d .swiper-slide-shadow-bottom,.swiper-3d .swiper-slide-shadow-left,.swiper-3d .swiper-slide-shadow-right,.swiper-3d .swiper-slide-shadow-top{position:absolute;left:0;top:0;width:100%;height:100%;pointer-events:none;z-index:10}.swiper-3d .swiper-slide-shadow{background:rgba(0,0,0,.15)}.swiper-3d .swiper-slide-shadow-left{background-image:linear-gradient(to left,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-right{background-image:linear-gradient(to right,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-top{background-image:linear-gradient(to top,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-3d .swiper-slide-shadow-bottom{background-image:linear-gradient(to bottom,rgba(0,0,0,.5),rgba(0,0,0,0))}.swiper-lazy-preloader{width:42px;height:42px;position:absolute;left:50%;top:50%;margin-left:-21px;margin-top:-21px;z-index:10;transform-origin:50%;box-sizing:border-box;border:4px solid var(--swiper-preloader-color,var(--swiper-theme-color));border-radius:50%;border-top-color:transparent}.swiper-watch-progress .swiper-slide-visible .swiper-lazy-preloader,.swiper:not(.swiper-watch-progress) .swiper-lazy-preloader{animation:swiper-preloader-spin 1s infinite linear}.swiper-lazy-preloader-white{--swiper-preloader-color:#fff}.swiper-lazy-preloader-black{--swiper-preloader-color:#000}@keyframes swiper-preloader-spin{0%{transform:rotate(0deg)}100%{transform:rotate(360deg)}}.swiper-virtual .swiper-slide{-webkit-backface-visibility:hidden;transform:translateZ(0)}.swiper-virtual.swiper-css-mode .swiper-wrapper::after{content:'';position:absolute;left:0;top:0;pointer-events:none}.swiper-virtual.swiper-css-mode.swiper-horizontal .swiper-wrapper::after{height:1px;width:var(--swiper-virtual-size)}.swiper-virtual.swiper-css-mode.swiper-vertical .swiper-wrapper::after{width:1px;height:var(--swiper-virtual-size)}:root{--swiper-navigation-size:44px}.swiper-button-next,.swiper-button-prev{position:absolute;top:var(--swiper-navigation-top-offset,50%);width:calc(var(--swiper-navigation-size)/ 44 * 27);height:var(--swiper-navigation-size);margin-top:calc(0px - (var(--swiper-navigation-size)/ 2));z-index:10;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--swiper-navigation-color,var(--swiper-theme-color))}.swiper-button-next.swiper-button-disabled,.swiper-button-prev.swiper-button-disabled{opacity:.35;cursor:auto;pointer-events:none}.swiper-button-next.swiper-button-hidden,.swiper-button-prev.swiper-button-hidden{opacity:0;cursor:auto;pointer-events:none}.swiper-navigation-disabled .swiper-button-next,.swiper-navigation-disabled .swiper-button-prev{display:none!important}.swiper-button-next svg,.swiper-button-prev svg{width:100%;height:100%;object-fit:contain;transform-origin:center}.swiper-rtl .swiper-button-next svg,.swiper-rtl .swiper-button-prev svg{transform:rotate(180deg)}.swiper-button-prev,.swiper-rtl .swiper-button-next{left:var(--swiper-navigation-sides-offset,10px);right:auto}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-lock{display:none}.swiper-button-next:after,.swiper-button-prev:after{font-family:swiper-icons;font-size:var(--swiper-navigation-size);text-transform:none!important;letter-spacing:0;font-variant:initial;line-height:1}.swiper-button-prev:after,.swiper-rtl .swiper-button-next:after{content:'prev'}.swiper-button-next,.swiper-rtl .swiper-button-prev{right:var(--swiper-navigation-sides-offset,10px);left:auto}.swiper-button-next:after,.swiper-rtl .swiper-button-prev:after{content:'next'}.swiper-pagination{position:absolute;text-align:center;transition:.3s opacity;transform:translate3d(0,0,0);z-index:10}.swiper-pagination.swiper-pagination-hidden{opacity:0}.swiper-pagination-disabled>.swiper-pagination,.swiper-pagination.swiper-pagination-disabled{display:none!important}.swiper-horizontal>.swiper-pagination-bullets,.swiper-pagination-bullets.swiper-pagination-horizontal,.swiper-pagination-custom,.swiper-pagination-fraction{bottom:var(--swiper-pagination-bottom,8px);top:var(--swiper-pagination-top,auto);left:0;width:100%}.swiper-pagination-bullets-dynamic{overflow:hidden;font-size:0}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transform:scale(.33);position:relative}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-main{transform:scale(1)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-prev-prev{transform:scale(.33)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next{transform:scale(.66)}.swiper-pagination-bullets-dynamic .swiper-pagination-bullet-active-next-next{transform:scale(.33)}.swiper-pagination-bullet{width:var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,8px));height:var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,8px));display:inline-block;border-radius:var(--swiper-pagination-bullet-border-radius,50%);background:var(--swiper-pagination-bullet-inactive-color,#000);opacity:var(--swiper-pagination-bullet-inactive-opacity, .2)}button.swiper-pagination-bullet{border:none;margin:0;padding:0;box-shadow:none;-webkit-appearance:none;appearance:none}.swiper-pagination-clickable .swiper-pagination-bullet{cursor:pointer}.swiper-pagination-bullet:only-child{display:none!important}.swiper-pagination-bullet-active{opacity:var(--swiper-pagination-bullet-opacity, 1);background:var(--swiper-pagination-color,var(--swiper-theme-color))}.swiper-pagination-vertical.swiper-pagination-bullets,.swiper-vertical>.swiper-pagination-bullets{right:var(--swiper-pagination-right,8px);left:var(--swiper-pagination-left,auto);top:50%;transform:translate3d(0px,-50%,0)}.swiper-pagination-vertical.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets .swiper-pagination-bullet{margin:var(--swiper-pagination-bullet-vertical-gap,6px) 0;display:block}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{top:50%;transform:translateY(-50%);width:8px}.swiper-pagination-vertical.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-vertical>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{display:inline-block;transition:.2s transform,.2s top}.swiper-horizontal>.swiper-pagination-bullets .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet{margin:0 var(--swiper-pagination-bullet-horizontal-gap,4px)}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic{left:50%;transform:translateX(-50%);white-space:nowrap}.swiper-horizontal>.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet,.swiper-pagination-horizontal.swiper-pagination-bullets.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s left}.swiper-horizontal.swiper-rtl>.swiper-pagination-bullets-dynamic .swiper-pagination-bullet{transition:.2s transform,.2s right}.swiper-pagination-fraction{color:var(--swiper-pagination-fraction-color,inherit)}.swiper-pagination-progressbar{background:var(--swiper-pagination-progressbar-bg-color,rgba(0,0,0,.25));position:absolute}.swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background:var(--swiper-pagination-color,var(--swiper-theme-color));position:absolute;left:0;top:0;width:100%;height:100%;transform:scale(0);transform-origin:left top}.swiper-rtl .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{transform-origin:right top}.swiper-horizontal>.swiper-pagination-progressbar,.swiper-pagination-progressbar.swiper-pagination-horizontal,.swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,.swiper-vertical>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite{width:100%;height:var(--swiper-pagination-progressbar-size,4px);left:0;top:0}.swiper-horizontal>.swiper-pagination-progressbar.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-horizontal.swiper-pagination-progressbar-opposite,.swiper-pagination-progressbar.swiper-pagination-vertical,.swiper-vertical>.swiper-pagination-progressbar{width:var(--swiper-pagination-progressbar-size,4px);height:100%;left:0;top:0}.swiper-pagination-lock{display:none}.swiper-scrollbar{border-radius:var(--swiper-scrollbar-border-radius,10px);position:relative;touch-action:none;background:var(--swiper-scrollbar-bg-color,rgba(0,0,0,.1))}.swiper-scrollbar-disabled>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-disabled{display:none!important}.swiper-horizontal>.swiper-scrollbar,.swiper-scrollbar.swiper-scrollbar-horizontal{position:absolute;left:var(--swiper-scrollbar-sides-offset,1%);bottom:var(--swiper-scrollbar-bottom,4px);top:var(--swiper-scrollbar-top,auto);z-index:50;height:var(--swiper-scrollbar-size,4px);width:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar.swiper-scrollbar-vertical,.swiper-vertical>.swiper-scrollbar{position:absolute;left:var(--swiper-scrollbar-left,auto);right:var(--swiper-scrollbar-right,4px);top:var(--swiper-scrollbar-sides-offset,1%);z-index:50;width:var(--swiper-scrollbar-size,4px);height:calc(100% - 2 * var(--swiper-scrollbar-sides-offset,1%))}.swiper-scrollbar-drag{height:100%;width:100%;position:relative;background:var(--swiper-scrollbar-drag-bg-color,rgba(0,0,0,.5));border-radius:var(--swiper-scrollbar-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:flex;justify-content: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%;object-fit:contain}.swiper-slide-zoomed{cursor:move;touch-action:none}.swiper .swiper-notification{position:absolute;left:0;top:0;pointer-events:none;opacity:0;z-index:-1000}.swiper-free-mode>.swiper-wrapper{transition-timing-function:ease-out;margin:0 auto}.swiper-grid>.swiper-wrapper{flex-wrap:wrap}.swiper-grid-column>.swiper-wrapper{flex-wrap:wrap;flex-direction:column}.swiper-fade.swiper-free-mode .swiper-slide{transition-timing-function:ease-out}.swiper-fade .swiper-slide{pointer-events:none;transition-property:opacity}.swiper-fade .swiper-slide .swiper-slide{pointer-events:none}.swiper-fade .swiper-slide-active{pointer-events:auto}.swiper-fade .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper.swiper-cube{overflow:visible}.swiper-cube .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1;visibility:hidden;transform-origin:0 0;width:100%;height:100%}.swiper-cube .swiper-slide .swiper-slide{pointer-events:none}.swiper-cube.swiper-rtl .swiper-slide{transform-origin:100% 0}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-cube .swiper-slide-active,.swiper-cube .swiper-slide-next,.swiper-cube .swiper-slide-prev{pointer-events:auto;visibility:visible}.swiper-cube .swiper-cube-shadow{position:absolute;left:0;bottom:0px;width:100%;height:100%;opacity:.6;z-index:0}.swiper-cube .swiper-cube-shadow:before{content:'';background:#000;position:absolute;left:0;top:0;bottom:0;right:0;filter:blur(50px)}.swiper-cube .swiper-slide-next+.swiper-slide{pointer-events:auto;visibility:visible}.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-bottom,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-left,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-right,.swiper-cube .swiper-slide-shadow-cube.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper.swiper-flip{overflow:visible}.swiper-flip .swiper-slide{pointer-events:none;-webkit-backface-visibility:hidden;backface-visibility:hidden;z-index:1}.swiper-flip .swiper-slide .swiper-slide{pointer-events:none}.swiper-flip .swiper-slide-active,.swiper-flip .swiper-slide-active .swiper-slide-active{pointer-events:auto}.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-bottom,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-left,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-right,.swiper-flip .swiper-slide-shadow-flip.swiper-slide-shadow-top{z-index:0;-webkit-backface-visibility:hidden;backface-visibility:hidden}.swiper-creative .swiper-slide{-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden;transition-property:transform,opacity,height}.swiper.swiper-cards{overflow:visible}.swiper-cards .swiper-slide{transform-origin:center bottom;-webkit-backface-visibility:hidden;backface-visibility:hidden;overflow:hidden}
/* ============================== */
/* ICON �I���϶�˦�             */
/* ============================== */

/* �~�h�e���]��Ϥ��A���Ѭ۹�w���� */
.icon-image-wrapper {
    position: relative;
    display: inline-block;
}

/* �|�[�e���G��m icon �I���϶� */
.icon-overlay {
    position: absolute;
    top: 0;
    left: 0;
}

/* �I���϶�]�i�л\��� icon �ϰ�^ */
.icon-overlay-dot {
    position: absolute;
    background-color: transparent; /* �p�ݽոեi�]�� rgba(255,0,0,0.3) */
    border: none;
    z-index: 1000;
    cursor: pointer;
    pointer-events: auto;
}



/* ============================== */
/* Swiper ���k�b�Y�˦��u��         */
/* ============================== */

.swiper-button-prev,
.swiper-button-next {
    background-color: rgba(255, 255, 255, 0.05); /* �A��H�@�I */
    border-radius: 50%;
    width: 36px;
    height: 36px;
    color: black;
    box-shadow: 0 0 4px rgba(0, 0, 0, 0.15);
    transition: background-color 0.2s ease;
}

    .swiper-button-prev:hover,
    .swiper-button-next:hover {
        background-color: rgba(255, 255, 255, 0.2);
    }

    /* �b�Y icon ��� */
    .swiper-button-prev::after,
    .swiper-button-next::after {
        font-size: 20px;
        line-height: 36px;
        width: 100%;
        text-align: center;
    }