/*
V1.0, Sam Wong, PDEV-1256
V1.1, Sam Wong, PDEV-1266
V1.2, Sam Wong, MS Font Fix
V1.3, Sam Hui, PDEV-1287
V1.4, Sam Wong, PDEV-1344
V1.5, Jacky, PDEV-1569
*/

@font-face {
    font-family: '微軟正黑體修正';
    unicode-range: U+7db0, U+78A7, U+7B75; /* ASCII (碧筵綰) */
    font-style: normal;
    font-weight: normal;
    src: local(微軟正黑體);
}
@font-face {
    font-family: '微軟正黑體修正2';
    unicode-range: U+7db0, U+78A7, U+7B75; /* ASCII (碧筵綰) */
    font-style: normal;
    font-weight: bold;
    src: local(Yu Gothic), local(MS Gothic);
}
html * {max-height:1000000px;}
body { font-family: 微軟正黑體修正,微軟正黑體修正2,微軟正黑體,'Microsoft JhengHei',Arial; font-size:12px; background:#222223; margin:0px; padding:0px; color:#fff; }

.pos { color:#34b15a !important; }
.neg { color:#d25e4f !important; }
.unc { color:#8d8d8d !important; }
.font-num { font-family:Arial !important; }
.clear { clear:both; }
.pointer { cursor:pointer; }
::placeholder { 
    color: #bdbdbd;
    opacity: 1; /* Firefox */
}

:-ms-input-placeholder { /* Internet Explorer 10-11 */
    color: #bdbdbd;
}

::-ms-input-placeholder { /* Microsoft Edge */
    color: #bdbdbd;
}
::-ms-clear {
    display: none;
}

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

.fcolor1 { color:#b0b0b0 !important; }
.fcolor2 { color:#fff !important; }
.fcolor3 { color:#f8f8f8 !important; }
input[type="button"], input[type="submit"], input[type="reset"] { background:#585b5c; color:#fff; font-size: 32px; height:100px; line-height:100px; border-radius:3px; outline:0; border:none; width:100%; }
input[type="button"]:hover, input[type="submit"]:hover, input[type="reset"]:hover { background:#898B8C; }
input[type="button"].blue, input[type="submit"].blue { background:#4aa7c2; }
input[type="button"].blue:hover, input[type="submit"].blue:hover { background:#4BC2D5; }
input::-webkit-outer-spin-button, input::-webkit-inner-spin-button, input[type='button'], input[type='submit'], input[type='reset'], select { -webkit-appearance: none; }
/*table tbody::-webkit-scrollbar, div::-webkit-scrollbar, iframe::-webkit-scrollbar, ul::-webkit-scrollbar { height: 8px; width: 8px; background: #fff; }
table tbody::-webkit-scrollbar-thumb, div::-webkit-scrollbar-thumb, iframe::-webkit-scrollbar-thumb, ul::-webkit-scrollbar-thumb  { background: #ccc; -webkit-border-radius: 1ex; -webkit-box-shadow: 0px 1px 2px rgba(200, 200, 200, 0.75); }
table tbody::-webkit-scrollbar-corner, div::-webkit-scrollbar-corner, iframe::-webkit-scrollbar-corner, ul::-webkit-scrollbar-corner  { background: #fff; }*/
.icon-video-end { 
    margin:0 auto;
  width: 80px;
  height: 50px;
  text-align: center; 
  border-radius:5px;
}
.icon-video-end:hover {
    background:#00A9C5;
}
.icon-video-end:before {
    font-family: VideoJS;
  font-weight: normal;
  font-style: normal;
  content: "\f116";
  font-size:45px;
  line-height:53px;
}
.vjs-like-button { background-repeat:no-repeat !important; background-position:-5px -150px !important; width:36px; height:36px; cursor:pointer; }
.datediff { color:#808080; font-size:14px; height:15px; line-height:15px; padding-top:8px; }

.icon_map_m.icon-menu { background-repeat:no-repeat !important; background-position:-403px -20px !important; width:32px; height:26px; display:inline-block; }
.icon_map_m.icon-close { background-repeat:no-repeat !important; background-position:-407px -205px !important; width:24px; height:24px; display:inline-block; }
.icon_map_m.icon-search { background-repeat:no-repeat !important; background-position:-502px -17px !important; width:34px; height:34px; display:inline-block; }
.icon_map_m.icon-latest { background-repeat:no-repeat !important; background-position:-102px -103px !important; width:35px; height:31px; display:inline-block; }
.icon_map_m.icon-catg { background-repeat:no-repeat !important; background-position:-302px -104px !important; width:36px; height:30px; display:inline-block; }
.icon_map_m.icon-hot { background-repeat:no-repeat !important; background-position:-502px -104px !important; width:35px; height:33px; display:inline-block; }
.icon_map_m.icon-top-bg { background-repeat:no-repeat !important; background-position:0px -444px !important; width:353px; height:13px; }
.icon_map_m.icon-top-cardline { background-repeat:no-repeat !important; background-position:0px -410px !important; width:448px; height:14px; }
.icon_map_m.icon-sep { background-repeat:no-repeat !important; background-position:0px -473px !important; width:232px; height:14px; }
.icon_map_m.icon-arrowdown { background-repeat:no-repeat !important; background-position:-592px -101px !important; width:40px; height:40px; }
.icon_map_m.icon-arrowup { background-repeat:no-repeat !important; background-position:-693px -101px !important; width:40px; height:40px; }
.icon_map_m.icon-share { background-repeat:no-repeat !important; background-position:-501px -202px !important; width:42px; height:36px; display: inline-block; }
.icon_map_m.icon-arrowdown2 { background-repeat:no-repeat !important; background-position:-2px -201px !important; width:25px; height:25px; }
.icon_map_m.icon-arrowup2 { background-repeat:no-repeat !important; background-position:-102px -201px !important; width:25px; height:25px; }
.icon_map_m.icon-arrowdown3 { background-repeat:no-repeat !important; background-position:-205px -201px !important; width:25px; height:25px; }
.icon_map_m.icon-arrowup3 { background-repeat:no-repeat !important; background-position:-305px -201px !important; width:25px; height:25px; }
.icon_map_m.icon-backToTop { background-repeat:no-repeat !important; background-position:-696px -289px !important; width:104px; height:104px; }
.icon_map_m.icon-switchaudio { background-repeat: no-repeat !important; background-position: -590px -202px !important; width: 47px; height: 38px; display: inline-block;}
.icon_map_m.icon-audiotick {background-repeat: no-repeat !important; background-position: -690px -198px !important; width: 47px; height: 40px; opacity: 1 !important; top: 28px; position: absolute; right: -100px;}

body > div.mask { position:fixed; top:0px; left:0px; width:100%; height:100vh; background:#000; opacity:0.5; z-index:1010; }

#header { position:fixed; border-top-width: 0px; top: 0px; left: 0px; width: 100%; height:98px; background:#0e0e0e; color:#fff; text-align:center; clear:both; z-index: 1010; }
#header div.leftPanel { position: absolute; top: 0px; left: 0px; height: 100%; padding-left: 34px; }
#header div.leftPanel .icon-menu { position:relative; top:36px; }
#header div.middlePanel { display: inline-block; margin: 0px auto; height: 100%; }
#header div.middlePanel .icon-logo { position:relative; top:19px; display: inline-block; }
#header div.middlePanel .icon-logo > img { height: 60px; }
#header div.rightPanel { position: absolute; top: 0px; right: 0px; height: 100%; padding-right: 34px; }
#header div.rightPanel .icon-search { position:relative; top:32px; }

#header2 { position: fixed; top: 0px; left: 0px; width: 100%; height: 76px; background-color: #222223; border-bottom: 2px solid #303030; z-index: 1000; padding-top: 98px; }
#header2 > ul { display:inline-block; width: 100%; padding: 0; margin: 0; }
#header2 > ul > li { display: inline-block; list-style:none; font-size: 30px; line-height: 35px; color: #ffffff; text-align: center; margin: 0 auto; }
#header2 > ul > li a { color: #b0b0b0; text-decoration: none; line-height: 78px; display: inline-block; height: 74px; padding: 0px 15px; }
#header2 > ul > li a .icon_map_m { margin-right: 15px; }
#header2 > ul > li a .icon_map_m.icon-latest { position: relative; top: 22px; }
#header2 > ul > li a .icon_map_m.icon-catg { position: relative; top: 23px; }
#header2 > ul > li a .icon_map_m.icon-hot { position: relative; top: 21px; }
#header2 > ul > li.sel a { color: #ffffff; border-bottom: 4px solid #00a9c5; }
#header2 > ul > li.sel a .icon_map_m.icon-latest { background-position:-3px -103px !important; }
#header2 > ul > li.sel a .icon_map_m.icon-catg { background-position:-202px -104px !important; }
#header2 > ul > li.sel a .icon_map_m.icon-hot { background-position:-402px -104px !important; }
#header2 > ul > li.item1 { width: calc(23% - 20px); float: left; padding-left: 20px; }
#header2 > ul > li.item2 { width: 24%; float: left; }
#header2 > ul > li.item3 { width: 23%; float: left; }
#header2 > ul > li.item4 { width: calc(30% - 20px) ; float: right; padding-right: 20px; }

#footer { height:141px; background:#292929; text-align:center; line-height:40px; }
#footer div.middlePanel { display: inline-block; margin: 0px auto; }
#footer div.middlePanel .disclaimer { color: #808080; font-size: 28px; margin-top: 30px; }

#back_to_top_wrapper { display: none; position: fixed; bottom: 0px; right: 0px; padding: 32px; margin-bottom: 46px; z-index: 1998; }
#back_to_top_checker { width: 100%; height: 0px; margin: 0; padding: 0; background: transparent; border: 0; visibility: hidden; }

#content { width: 100% !important; overflow-x: hidden; }
#content { position:relative; background-color:#222223; width: 100%; min-height: calc(100vh - 141px - 98px); padding-top: 98px; }
#header2 + #content { min-height: calc(100vh - 98px - 141px - 78px); padding-top: 176px; }

#menuPanel { position:fixed; top:0; left:0; width: 100%; height: 100vh; z-index: 1050; display: none; }
#menuPanel > .menu-content { width: 66.6%; height: 100%; background-color: #292929; position: relative; }
#menuPanel > .menu-content .icon-close { position: absolute; right: 34px; top: 40px; margin-top: 5px; }
#menuPanel > .menu-content .menu-item { overflow-y: auto; height: calc(100vh - 160px); }
#menuPanel > .menu-content .menu-item ul { display:inline-block; margin:0px; padding:0px; height: 100%; width: 100%; }
#menuPanel > .menu-content .menu-item ul > li { list-style:none; font-size: 31px; line-height: 31px; color: #ffffff; padding-left: 40px; margin-bottom: 4px;}
#menuPanel > .menu-content .menu-item ul > li a { color: #ffffff; text-decoration: none; display: block; width: 100%; padding: 40px 0px; }
#menuPanel > .menu-content .menu-item ul > li a .icon_map_m { margin-right: 15px; }
#menuPanel > .menu-content .menu-item ul > li.divider { padding: 0px; width: 100%; height: 0px; border-bottom: 2px solid #303030; }
#menuPanel > .menu-content .lang-link { display: block; padding: 40px 0px 52px 0px; }
#menuPanel > .menu-content .lang-link a { color: #808080; text-decoration: none; font-size: 35px; line-height: 35px; margin-left: 40px; }
#menuPanel > .menu-content .lang-link a:not([href]) { color: #ffffff; border-bottom: 4px solid #00a9c5; padding-bottom: 20px; }

#searchPanel { position:fixed; width:100%; height: 100vh; top:0px; left:0; z-index:1999; display:none; background: rgba(34,34,35,0.95); overflow: hidden; }
#searchPanel font.key { color: #00a9c5; }
#searchPanel > .search-bar { position:relative; width:100%; height:98px; line-height:98px; background:#2b2b2b; }
#searchPanel > .search-bar > .icon-close { position:absolute; right:34px; top:40px; }
#searchPanel > .search-bar > input { position:absolute; top:0px; height:98px; border:none; width:80%; line-height:98px; padding:0px; margin:0px; left:34px; font-size:34px; color:#fff; background:transparent; }
#searchPanel > .search-bar > input:focus { outline:0; }
#searchPanel > .search-result { width:100%; background:transparent; }
#searchPanel > .search-result > div.title { color:#808080; height:25px; line-height:25px; padding-left:10px; }
#searchPanel > .search-result > ul { display:flex; flex-direction: column; flex-wrap: wrap; margin:0px; padding:0px; }
#searchPanel > .search-result > ul > li { list-style:none; font-size: 34px; height: 104px; line-height: 104px; color:#ffffff; padding-left:34px; cursor:pointer; overflow: hidden; }


#sharePanel { position:fixed; width:566px; height:806px; top:calc((100vh - 806px) / 2); right:calc((100vw - 566px) / 2); background:#292929; z-index:1999; border-radius:5px; display:none; }
#sharePanel > .title { color:#fff; font-size:28px; position:absolute; top:30px; width:100%; text-align:center; }
#sharePanel > table { width:410px; border-collapse:collapse; position:absolute; top:120px; left:71px; }
#sharePanel > table td { width:106px; text-align:center; font-size:28px; }
#sharePanel > table tr:nth-child(2n+1) td { padding:15px 30px;  }
#sharePanel > table.tbCopyComplete { display:none; width:65px; left:211.5px; top:300px; }
#sharePanel > table.tbCopyComplete td { font-size:28px; }
#sharePanel > div.btnClose { position:absolute; top:35px; right:30px; }

#audioPanel {display: none;position: fixed;width: 500px;height: 380px;top: calc((100vh - 380px) / 2);right: calc((100vw - 500px) / 2);background: #292929;z-index: 1999;border-radius: 10px;}
#audioPanel > .title { color:#fff; font-size:28px; position:absolute; top:30px; width:100%; text-align:center; }
#audioPanel > table { width: 100%;border-collapse: collapse;position: absolute;top: 120px;}
#audioPanel > table td { text-align:center; font-size:38px;line-height: 100px;}
#audioPanel > table td div{color: #fff; opacity:0.35;display: inline-block;}
#audioPanel > table td div.sel {color:#1fa9c3; opacity:1; position:relative;}
#audioPanel > div.btnClose { position:absolute; top:35px; right:30px; }

.icon-fb { background-repeat:no-repeat !important; background-position:-5px -302px !important; width:83px; height:83px; cursor:pointer; display:inline-block; }
.icon-whatsapp { background-repeat:no-repeat !important; background-position:-805px -302px !important; width:83px; height:83px; cursor:pointer; display:inline-block; }
.icon-twitter { background-repeat:no-repeat !important; background-position:-106px -302px !important; width:83px; height:83px; cursor:pointer; display:inline-block; }
.icon-weibo { background-repeat:no-repeat !important; background-position:-207px -302px !important; width:83px; height:83px; cursor:pointer; display:inline-block; }
.icon-weChat { background-repeat:no-repeat !important; background-position:-306px -302px !important; width:83px; height:83px; cursor:pointer; display:inline-block; }
.icon-email { background-repeat:no-repeat !important; background-position:-407px -302px !important; width:83px; height:83px; cursor:pointer; display:inline-block; }
.icon-link { background-repeat:no-repeat !important; background-position:-507px -302px !important; width:83px ; height:83px; cursor:pointer; display:inline-block; }
.icon-copyComplete { background-repeat:no-repeat !important; background-position:-606px -303px !important; width:83px; height:83px; display:inline-block; }

.content-icon-new { position:absolute; top:8px; right:8px; width:66px; height:34px; font-size:22px; line-height:34px; color:#FFFFFF; background-color:#4cb992; text-align:center; opacity:0.85; border-radius:5px; z-index:10; }