@charset "utf-8";

/* CSS Document */
* { -webkit-text-size-adjust: none;}
/*general style*/


body{  background-color: #333; font-family: 'Lato','Noto Sans TC','PingFang TC',"SF Pro TC",'Helvetica Neue','Helvetica','arial','Microsoft JhengHei',sans-serif
}
.worldcup-page{  overflow: hidden; min-height: 100vh;
background-repeat: no-repeat no-repeat;
background-position: right top;
background-color: #1b237c}

html {
  scroll-behavior: smooth;
}

textarea, input.text, input[type="text"], input[type="button"], input[type="submit"], input::-webkit-outer-spin-button, input::-webkit-inner-spin-button, select, button, input, .input-checkbox {
-webkit-appearance: none; outline: none; -moz-appearance: none;appearance: none;-webkit-font-smoothing: antialiased;
border-radius: 0;margin: 0
}
input:focus{outline: none }

::placeholder { font-family: "微軟正黑體"; color: #ccc; text-decoration: none; font-size: 14px}
/*for everything else*/
input::selection {background:#e7ddec;}

.text-12{ font-size: 12px}
.text-14{font-size: 14px}
.text-underline{ text-decoration: underline}
.text-white{ color: white}
.text-white50{ color: rgba(255,255,255,.5)}
.arrow-left{ display: inline-block; margin: 1px auto; width: 8px; height:8px; border-top: 1px solid #072063; border-left: 1px solid #072063; transform: rotate(315deg);}
.arrow-right{ display: inline-block; margin: 1px auto; width: 10px; height:10px; border-top: 1px solid #fff; border-left: 1px solid #fff; transform: rotate(135deg);}
.arrow-right.small{  width: 6px; height: 6px}
.arrow-right.x-small{  width: 4px; height: 4px}

.icon-boradcost.now{background-image: url("data:image/svg+xml,%0A%3Csvg width='26px' height='15px' viewBox='0 0 26 15' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Mobile' transform='translate(-1571.000000, -1180.000000)'%3E%3Cg id='Group' transform='translate(1571.000000, 1180.000000)'%3E%3Cpath d='M25.1444444,12.5722229 C25.1444444,13.6922697 24.2365481,14.6 23.1166695,14.6 C21.9966136,14.6 21.0888889,13.6922683 21.0888889,12.5722229 C21.0888889,11.4523479 21.9966136,10.5444444 23.1166695,10.5444444 C24.2365453,10.5444444 25.1444444,11.4523479 25.1444444,12.5722229' id='path32' fill='%23FFFFFF'%3E%3C/path%3E%3Cpath d='M9.31538397,0 L10.3122255,0 L10.3122255,3.04594487 L9.31538397,3.04594487 L9.31538397,0 L9.31538397,0 Z M9.31538397,11.5536644 L10.3122255,11.5536644 L10.3122255,14.6 L9.31538397,14.6 L9.31538397,11.5536644 L9.31538397,11.5536644 Z M9.81368394,8.65593043 C10.5634744,8.65593043 11.1711112,8.04261269 11.1711112,7.28580132 C11.1711112,6.52843417 10.5634744,5.91511795 9.81368394,5.91511795 C9.06426705,5.91511795 8.45625365,6.52843417 8.45625365,7.28580132 C8.45625365,8.0426142 9.06426555,8.65593043 9.81368394,8.65593043 Z M2.395654,4.44370812 C2.87182254,3.98410295 3.57435398,3.72079428 4.2058071,3.72079428 C6.02383847,3.72079428 6.51069689,4.81606164 6.63391183,5.73301104 C7.20553762,4.54290961 8.41461938,3.72079428 9.81368244,3.72079428 C10.7980877,3.72079428 11.6885375,4.12815387 12.3291786,4.78387382 L12.0576182,3.90535295 L14.5134791,3.90535295 L15.4166787,7.22352761 L16.2928738,3.90535295 L18.4638573,3.90535295 L19.3376069,7.21349797 L20.2438102,3.90535295 L22.7111111,3.90535295 L20.620208,10.6650927 L18.2350593,10.6650927 L17.3890614,7.33483493 L16.5331223,10.6650927 L14.1479692,10.6650927 L13.2924021,7.89930381 C13.0043365,9.57477278 11.5572672,10.8492834 9.81368844,10.8492834 C8.44594485,10.8492834 7.25899453,10.0648576 6.67348914,8.9169524 L6.67348914,10.6650927 L4.21687807,10.6650927 L4.21687807,7.38992298 C4.21687807,6.69954376 4.36503606,5.8322095 3.37912601,5.8322095 C2.76230265,5.8322095 2.45642053,6.34406026 2.45642053,6.99712099 L2.45642053,10.6650927 L0,10.6650927 L0,3.90535295 L2.395657,3.90535295 L2.395657,4.44370812' id='path34' fill='%23F7931D'%3E%3C/path%3E%3Cpath d='M21.0888889,12.1666555 C21.0888889,13.5105516 22.1790174,14.6 23.5220222,14.6 C24.8674276,14.6 25.9555556,13.5105516 25.9555556,12.1666555 C25.9555556,10.8231706 24.8674276,9.73333333 23.5220222,9.73333333 C22.1790174,9.73333333 21.0888889,10.8231722 21.0888889,12.1666555 Z M22.2708435,13.3261144 L22.2708435,11.7477653 L21.6556613,11.7477653 L21.6556613,11.2038476 L24.022373,11.2038476 L24.3696776,12.4905329 L24.7181858,11.2038476 L25.3899851,11.2038476 L24.7267868,13.3261144 L23.9955681,13.3261144 L23.5246277,11.7477653 L22.9246469,11.7477653 L22.9246469,13.3261144 L22.2708515,13.3261144' id='path36' fill='%23231F20'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
background-repeat: no-repeat no-repeat;
background-size: contain; width: 40px}
.icon-boradcost.nowe{background-image: url("data:image/svg+xml,%0A%3Csvg width='34px' height='15px' viewBox='0 0 34 15' version='1.1' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink'%3E%3Cg id='Page-1' stroke='none' stroke-width='1' fill='none' fill-rule='evenodd'%3E%3Cg id='Mobile' transform='translate(-1605.000000, -1180.000000)' fill='%23390193' fill-rule='nonzero'%3E%3Cg id='Group' transform='translate(1605.611111, 1180.000000)'%3E%3Cpath d='M28.4788519,12.045 C25.8445777,12.045 23.7018543,9.91643681 23.7018543,7.30000001 C23.7018543,4.6834756 25.8445777,2.55500001 28.4788519,2.55500001 C31.1128322,2.55500001 33.2555556,4.6834756 33.2555556,7.30000001 C33.2555556,9.91643681 31.1128617,12.045 28.4788519,12.045 Z M28.4788519,3.55994721 C26.4026799,3.55994721 24.7135284,5.2379836 24.7135284,7.30000001 C24.7135284,9.3621916 26.4026799,11.0400528 28.4788519,11.0400528 C30.55473,11.0400528 32.2438813,9.3621916 32.2438813,7.30000001 C32.2438813,5.2379836 30.55473,3.55994721 28.4788519,3.55994721 Z M2.43315051,4.4442108 C2.91799925,3.98419401 3.6320444,3.72121881 4.27330638,3.72121881 C6.12119325,3.72121881 6.61541914,4.81674439 6.74102596,5.73289441 C7.32061625,4.542644 8.55034598,3.72121881 9.97120499,3.72121881 C10.9725908,3.72121881 11.8776476,4.1277996 12.5278164,4.7840988 L12.2520576,3.90512041 L14.7471738,3.90512041 L15.665194,7.22393399 L16.5555531,3.90512041 L18.7610064,3.90512041 L19.6492491,7.213276 L20.5700913,3.90512041 L23.0776124,3.90512041 L20.9527027,10.6657088 L18.5295759,10.6657088 L17.6694648,7.33588681 L16.7992122,10.6657088 L14.3759091,10.6657088 L13.5066853,7.8985416 C13.2144062,9.575556 11.7426049,10.850136 9.97120499,10.850136 C8.5820343,10.850136 7.37682039,10.0643056 6.78100378,8.91630761 L6.78100378,10.6656796 L4.28403572,10.6656796 L4.28403572,7.39002361 C4.28403572,6.699502 4.43577509,5.8330212 3.43438932,5.8330212 C2.80673743,5.8330212 2.4960274,6.344138 2.4960274,6.99696241 L2.4960274,10.6656796 L0,10.6656796 L0,3.9051496 L2.43315051,3.9051496 L2.43315051,4.4442108 Z M9.97120499,8.6560772 C10.7335469,8.6560772 11.3518804,8.0421472 11.3518804,7.2851664 C11.3518804,6.52984999 10.7335469,5.91469361 9.97120499,5.91469361 C9.21059744,5.91469361 8.59202875,6.5298208 8.59202875,7.2851664 C8.59202875,8.0421472 9.21059744,8.6560772 9.97120499,8.6560772 Z M9.46480939,11.5548196 L10.477336,11.5548196 L10.477336,14.6 L9.46480939,14.6 L9.46480939,11.5548196 Z M9.46480939,0 L10.477336,0 L10.477336,3.04541401 L9.46480939,3.04541401 L9.46480939,0 Z M27.8638988,5.5347724 L29.9547099,5.5347724 L29.9547099,4.5398116 L27.8638988,4.5398116 C26.9562553,4.5398116 26.2203987,5.2861928 26.2203987,6.18780119 C26.2203987,6.62495441 26.3937142,7.0106572 26.675411,7.2923788 C26.3937437,7.5891092 26.2203987,7.98941201 26.2203987,8.42662361 C26.2203987,9.3281736 26.9562553,10.0124464 27.8638988,10.0124464 L29.9547099,10.0124464 L29.9547099,9.0173688 L27.8638988,9.0173688 C27.5147689,9.0173688 27.2318377,8.74577961 27.2318377,8.3991464 C27.2318377,8.0523964 27.5147689,7.773624 27.8638988,7.773624 L29.9547099,7.773624 L29.9547099,6.77860481 L27.8638988,6.77860481 C27.5147689,6.77860481 27.2318377,6.50701561 27.2318377,6.160324 C27.2318377,5.81354481 27.5147689,5.5347724 27.8638988,5.5347724 Z' id='Shape'%3E%3C/path%3E%3C/g%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
background-repeat: no-repeat no-repeat;
background-size: contain; width: 40px}
.icon-boradcost.viutv{background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="UTF-8"%3F><svg id="Layer_1" xmlns="http://www.w3.org/2000/svg" version="1.1" viewBox="0 0 45.3 27.6"><!-- Generator: Adobe Illustrator 29.8.7, SVG Export Plug-In . SVG Version: 2.1.1 Build 1) --><defs><style> .st0 { fill: %23fff; } .st1 { fill: %230a7deb; } </style></defs><g id="Page-1"><g id="Mobile"><g id="Group"><path id="Path" class="st1" d="M45.2,17.7h-.8c-.1,0-.2,0-.2.2l-1,2.4c0,0-.1.1-.2.1h0c0,0-.2,0-.2-.1l-1-2.4c0,0-.1-.2-.2-.2h-4.1c0,0-.1,0-.1.1v.7c0,0,0,.1.1.1h1.3v2.7c0,0,0,.1.1.1h.7c0,0,.1,0,.1-.1v-2.7h1.3l1,2.2c.2.4.6.6,1,.6h0c.4,0,.8-.3,1-.6l1.4-3s0,0,0,0c0,0,0-.1-.1-.1"/><path id="Path1" data-name="Path" class="st1" d="M9.6,21.3h0c0-.7-.4-1.2-.9-1.5l-4.4-2s0,0,0,0c-.1,0-.2,0-.2.2v1.2c0,.2,0,.3.2.4l3.6,1.5c.1,0,.2.2.2.3h0c0,.1,0,.3-.2.3l-3.6,1.5c-.1,0-.2.2-.2.4v1.2c0,.1,0,.2.2.2s0,0,0,0l4.4-2c.5-.3.9-.9.9-1.5h0Z"/><path id="Shape" class="st1" d="M12.2,21.3c0,3.4-2.7,6.1-6.1,6.1S0,24.6,0,21.3s2.7-6.1,6.1-6.1,6.1,2.7,6.1,6.1M6.2,16.2c-2.8,0-5.1,2.3-5.1,5s2.3,5,5.1,5,5.1-2.3,5.1-5-2.3-5-5.1-5"/><path id="Path2" data-name="Path" class="st1" d="M25,24.8c-.1,0-.3-.1-.3-.3v-6.6c0-.1.1-.3.3-.3h1.5c.1,0,.3.1.3.3v6.6c0,.1-.1.3-.3.3h-1.5Z"/><path id="Path3" data-name="Path" class="st1" d="M18.7,24.8h0c.8,0,1.5-.5,1.9-1.2l2.5-5.5s0,0,0-.1c0-.1-.1-.3-.3-.3h-1.5c-.2,0-.4.1-.4.3l-1.9,4.5c0,.2-.2.3-.4.3h0c-.2,0-.3-.1-.4-.3l-1.9-4.5c0-.2-.2-.3-.4-.3h-1.5c-.1,0-.3.1-.3.3s0,0,0,.1l2.5,5.5c.4.7,1.1,1.2,1.9,1.2h0Z"/><path id="Path4" data-name="Path" class="st1" d="M26.9,15c0,.7-.5,1.2-1.2,1.2s-1.2-.5-1.2-1.2.5-1.2,1.2-1.2,1.2.5,1.2,1.2"/><path id="Path5" data-name="Path" class="st1" d="M32.3,24.8c2.1,0,3.8-1.3,3.8-3v-3.8c0-.1-.1-.3-.3-.3h-1.5c-.1,0-.3.1-.3.3v3.5c0,.7-.8,1.3-1.7,1.3s-1.7-.6-1.7-1.3v-3.5c0-.1-.1-.3-.3-.3h-1.5c-.1,0-.3.1-.3.3v3.8c0,1.7,1.6,3,3.8,3"/></g></g></g><rect class="st1" x="0" y=".2" width="44.3" height="11.9" rx="2.9" ry="2.9"/><g><path class="st0" d="M10.2,8.4c0,0-.2,0-.2-.1,0,.4,0,.6,0,.8,0,.2,0,.3-.1.4,0,0-.2,0-.3,0h-1.2c-.2,0-.3,0-.4,0,0,0,0-.1,0-.3v-1.9h2.2v-2.9h-2.6s0,0,0,0c.2-.2.3-.4.5-.7s.3-.4.4-.6l-.6-.4h-.1s-.2,0-.2,0h-1.9c.1-.2.2-.3.3-.5l-.9-.2c-.2.3-.4.6-.6,1-.3.3-.5.7-.9,1-.3.3-.7.6-1.1.9,0,0,.1.1.2.2,0,0,.2.2.2.2,0,0,.1.2.2.2.1-.1.3-.2.4-.3v2.1h2.4c-.1.3-.3.7-.6,1-.3.3-.6.6-1.1.8s-1,.4-1.7.6c0,0,.2.2.3.3s.2.3.2.4c.7-.2,1.3-.4,1.8-.7.5-.3.9-.6,1.2-.9.3-.4.5-.7.7-1.2,0-.1,0-.2.1-.3h.3v1.9c0,.3,0,.5.1.7,0,.2.2.3.4.3.2,0,.4.1.8.1h1.4c.3,0,.5,0,.7-.1.2,0,.3-.3.4-.5,0-.2.1-.6.2-1,0,0-.2,0-.3,0,0,0-.2,0-.3-.1ZM5,3.4h2.1c-.1.2-.2.4-.4.6-.1.1-.2.3-.3.4h-2.2c.3-.3.6-.6.8-.9ZM4.2,5.1h1.9c0,.3,0,.7-.1,1,0,.1,0,.3,0,.4h-1.8v-1.4ZM6.9,6.3c0-.4.1-.8.1-1.2h2.1v1.4h-2.3c0,0,0-.1,0-.2Z"/><path class="st0" d="M19.2,9.2c-.2,0-.4-.1-.5-.2h1.3v-3.2h.2c0,0,.2,0,.3,0s.2,0,.2-.1c0,0,.1-.2.2-.3,0-.2,0-.4,0-.6,0,0,0-.1,0-.2h-2.6v-.5h2v-1.5h-2v-.5h-.8v.5h-1.2v-.5h-.8v.5h-2.2v.5h2.2v.4h-1.8c0,.3,0,.5-.1.8,0,.3,0,.5-.1.8h1.5c-.2.1-.4.3-.7.4-.4.1-.8.3-1.4.4,0,0,0,.1.2.2,0,0,.1.2.1.2,0,0,0,.2.1.2.3,0,.5-.1.8-.2v2.8h1.4c-.2,0-.4.2-.6.3-.3.1-.6.2-.9.3-.3,0-.7.2-1,.2,0,0,.1.1.2.2,0,0,.2.2.2.2,0,0,.1.1.2.2.3,0,.6-.2,1-.3s.7-.2,1-.4c.3-.1.6-.3.9-.4l-.7-.3h2.4l-.3.3c.3.1.7.2,1,.3.3.1.6.2.9.4.3.1.5.2.7.3l.6-.5c-.2,0-.5-.2-.8-.3s-.6-.2-1-.3ZM19.1,7.6h-4.3v-.5h4.3v.5ZM19.1,6.6h-4.3v-.5h4.3v.5ZM17.6,4.5h-1.3c0-.2,0-.3,0-.5h1.3v.5ZM19.6,3v.4h-1.2v-.4h1.2ZM16.3,3h1.2v.4h-1.2v-.4ZM14.4,4.3c0,0,0-.2,0-.3h1.1c0,.1,0,.3,0,.4,0,0,0,0,0,0h-1.1c0,0,0-.1,0-.2ZM17.6,5v.6h.8v-.6h1.7s0,0,0,0c0,.1,0,.2,0,.2,0,0,0,0,0,0,0,0,0,0-.1,0,0,0-.1,0-.2,0-.1,0-.2,0-.3,0,0,0,0,.2.1.3,0,0,0,0,0,0h-3.8c.1,0,.2-.2.3-.2.1-.1.2-.2.3-.4h1.5ZM14.8,8.1h4.3v.5h-4.3v-.5Z"/><path class="st0" d="M30.3,4.1h-2.9c0,0,0-.2,0-.3,0-.1,0-.2,0-.4h3.7v-.8h-3.5c0-.2,0-.4.1-.7h-1c0,.1,0,.4,0,.7h-3.3v.8h3.2c0,0,0,.1,0,.2,0,.2,0,.3,0,.4h-2.1v5.3h-1.3v.8h8.3v-.8h-1.2v-5.3ZM25.2,7.4h4.1v.7h-4.1v-.7ZM29.4,6.7h-4.1v-.6h4.1v.6ZM29.4,4.8v.6h-4.1v-.6h4.1ZM25.2,8.7h4.1v.7h-4.1v-.7Z"/><path class="st0" d="M38.1,4.2c0-.1-.1-.3-.2-.5s-.2-.4-.3-.5l-.7.2c0,.2.2.3.3.6s.2.4.2.5l.7-.2Z"/><path class="st0" d="M42,6.5c-.2-.2-.4-.4-.7-.6-.3-.2-.6-.4-.9-.6-.1,0-.2-.1-.3-.2h1.8v-.7h-1.2c0-.1.1-.2.2-.4.1-.3.3-.6.4-.8l-.7-.2c0,.2,0,.3-.2.5,0,.2-.1.4-.2.6,0,.1-.1.2-.2.4h-.5v-1.5c.4,0,.7,0,1.1-.1.4,0,.8-.1,1.1-.2l-.5-.6c-.3,0-.6.1-1,.2-.4,0-.8,0-1.2.1-.4,0-.9,0-1.3.1-.4,0-.9,0-1.3,0,0,0,0,.2.1.3,0,.1,0,.2,0,.3.4,0,.9,0,1.3,0,.3,0,.5,0,.8,0v1.4h-2.3v-.7h-.9v-1.8h-.8v1.8h-1.1v.8h1.1v1.8c-.5.2-.9.3-1.2.4l.2.8c.3-.1.7-.2,1-.4v2.3c0,0,0,.1,0,.1,0,0,0,0-.1,0,0,0-.2,0-.3,0s-.3,0-.5,0c0,.1.1.3.2.4,0,.2,0,.3,0,.4.3,0,.5,0,.7,0,.2,0,.3,0,.5-.1.1,0,.2-.2.3-.3,0-.1,0-.3,0-.5v-2.6c.2,0,.4-.1.6-.2,0,0,.1.1.2.2.1.1.2.2.2.3,0,0,.2,0,.3-.1v3.4h.8v-.4h3.1v.3h.8v-3.4s0,0,.1.1l.5-.5ZM36.2,6.4v-.6c-.4,0-.6.2-.9.3v-1.5h.9v.5h1.7c-.1.1-.2.3-.4.4-.2.2-.5.4-.8.6-.2.1-.3.2-.5.3ZM40.6,8.1h-1.3v-.7h1.3v.7ZM38.6,8.1h-1.2v-.7h1.2v.7ZM37.4,8.7h1.2v.7h-1.2v-.7ZM39.3,9.5v-.7h1.3v.7h-1.3ZM37.2,6.8c0,0,.1,0,.2-.1.3-.2.6-.5.9-.8.2-.2.3-.3.4-.5v1.2h.8v-1.2c.2.1.4.2.6.4.3.2.6.4.9.7.1.1.3.2.4.3h-4.1Z"/></g></svg>');
background-repeat: no-repeat no-repeat; 
}

/*.icon-boradcost.viutv:before{ content: "免費直播"; font-size: 12px; color: #0A7DEB; margin-left: 3px;}*/


 .animated {padding-top:-15px; -webkit-animation-duration: 3s;animation-duration: 3s;-webkit-animation-fill-mode: both;animation-fill-mode: both; }
 .animated-late {padding-top:-15px; -webkit-animation-duration: 2s;animation-duration: 2s;-webkit-animation-fill-mode: both;animation-fill-mode: both; animation-delay: 0.1s }
         
@-webkit-keyframes fadeInDown {
            0% {
               opacity: 0;
               -webkit-transform: translateY(-15px);
            }
            100% {
               opacity: 1;
               -webkit-transform: translateY(0);
            }
         }
         
 @keyframes fadeInDown {
            0% {
               opacity: 0;
               transform: translateY(-15px);
            }
            100% {
               opacity: 1;
               transform: translateY(0);
            }
         }
         
         .fadeInDown {
            -webkit-animation-name: fadeInDown;
            animation-name: fadeInDown;
         }





.hket-worldcup-body-container{ margin: 15px 15px 50px 15px; }
.hket-worldcup-body-region{ padding-bottom: 60px}
.hket-worldcup-body-region.margin-210{margin-bottom: 210px}
.hket-worldcup-body-region .small-text{ font-size: 12px}
.hket-worldcup-body-region .text-right{ text-align: right}

.hket-worldcup-news-container-15{ margin-top: -15px}

.hket-worldcup-news-container-15 .container{background: #FFFFFF;
    border-radius: 10px;
    padding: 7px 15px;
    margin: 20px 0px 10px;
    width: auto;}
		  .hket-worldcup-news-container-15 .container .text-news{ display: flex; position: relative; align-items: baseline; border-bottom: 1px solid #ccc}
		  .hket-worldcup-news-container-15 .container .text-news:last-child{ border: none}
		  .hket-worldcup-news-container-15 .container .text-news a{ position: absolute; width: 100%; height: 100%; }
.hket-worldcup-news-container-15 .container .text-news a:hover{  background: rgba(209,209,209,0.29)}
		  .hket-worldcup-news-container-15 .container .text-news span{  color: #FFF; background: #000; font-size: 12px; display: block; border-radius: 20px; white-space: nowrap; padding:3px 10px}
		  .hket-worldcup-news-container-15 .container .text-news p{ margin: 12px; max-height: 60px}


.hket-worldcup-update-time { position: absolute;  right: 10px }
.hket-worldcup-update-time span{ font-size: 12px; color: #FFF; display: block; text-align: right; -webkit-text-size-adjust:none; -webkit-transform : scale(0.90);}

.hket-worldcup-title{display: flex; align-items: center; position: relative;}
.hket-worldcup-title a{ position: absolute; right: 5px; color: #fff; font-size: 12px}
.hket-worldcup-title h3{font-size: 20px; color: #FFF; font-weight: normal;font-family: 'Lato','Noto Sans TC','PingFang TC',"SF Pro TC",'Helvetica Neue','Helvetica','arial','Microsoft JhengHei',sans-serif; margin: 5px 0px}
/*.hket-worldcup-title:before{ content: "";  display: inline-block; width: 8px; height: 15px; transform: skew(25deg); background: #FFC000; margin: 0px 10px 0px 10px}*/

.hket-worldcup-sub-title{display: flex; align-items: center; position: relative; }
.hket-worldcup-sub-title a{ position: absolute; right: 5px; color: #fff;font-size: 12px}
.hket-worldcup-sub-title h3{font-size: 20px; color: #ffbe00; font-weight: normal;font-family: 'Lato','Noto Sans TC','PingFang TC',"SF Pro TC",'Helvetica Neue','Helvetica','arial','Microsoft JhengHei',sans-serif; margin:5px 0px }
.hket-worldcup-game-date p{ text-align: center; color: white; font-size: 15px; margin: 0px 0px 5px}

.header-top-region{ position: relative; height: 170px; background-color: #000}

.header-top-region .cover-hket-logo{ position: absolute; z-index: 1; left: 20px; width: 70px; height: auto; top: 10px}
.header-top-region .cover-image{ background-image: url("../images/bg-image.png"); background-position: center top; position: absolute; width: 100%;  z-index: 0; height: 170px; top: 0px; background-size:cover}

.header-top-region .cover-title{ position: relative; margin: auto; z-index: 2; height: 100%  }
.header-top-region .cover-title .cover-title-text{ margin:60px 20px 0px 20px; }
.header-top-region .cover-title .cover-title-text img{width: 160px; height: auto}
.header-top-region .cover-title .cover-logo img{ width: 70px; height: auto}


.header-top-region.inside{height: 167px;}
.header-top-region.inside .cover-football-bg{ background-image:url("../images/bg-image-inside.png"); background-position: center top; position: absolute; width: 100%;  z-index: 0; height: 167px; top: 0px; background-size:cover}

.header-top-region.inside .cover-title .cover-sub-title-text{ color: #FFF; height: 100%; width: 100%; display: flex; align-items: center;}
.header-top-region.inside .cover-title .cover-sub-title-text h5{ margin: 0px; position: absolute;  font-size: 24px; width: 100%; text-align: center; margin-left: -45px}



/*menu style*/
.hket-worldcup-menu-region{ width: 100%; }
.hket-worldcup-menu-region .hket-worldcup-menu-widget{position: fixed; bottom: -1px; width: 100%;  max-width: 720px;   margin: 0 auto; background: #1b237c; z-index: 9999;}
.hket-worldcup-menu-region ul{ display: flex;align-items: stretch; height: 100%; margin-top: 3px }
.hket-worldcup-menu-region ul li { flex:1 1; text-align: center; display: block; position: relative;}
.hket-worldcup-menu-region ul li:after{ content: ""; border-left: 1px solid rgba(255,255,255,.2); display: block; position:  absolute; right: 0px ; height: 30px ; top: 10px}
.hket-worldcup-menu-region ul li:last-child:after{ content: none}
.hket-worldcup-menu-region ul li.active span, .hket-worldcup-menu-region ul li.active a{  color: #FFF ;opacity:1 }
.hket-worldcup-menu-region ul li:hover span, .hket-worldcup-menu-region ul li:hover a{ opacity:1 }
.hket-worldcup-menu-region ul li a{ color: white; font-size: 11px;  display: block; height: 100%; padding: 3px 0px 17px; -webkit-text-size-adjust:none; -webkit-transform : scale(0.92); opacity: 0.4}
.hket-worldcup-menu-region ul li span{ display: block; font-size: 25px; margin-bottom: 5px }



.worldcup-news-widget{ position: relative; margin: 20px 0px}
.worldcup-news-widget:after{ content: ""; border-top: 1px solid rgba(255,255,255,0.3); width: 100%; height: 1px;   left: 0px; position: absolute; bottom: -12px}
.worldcup-news-widget a{ display: block; width: 100%; height: 100%;  position: absolute; z-index: 1}
.worldcup-news-widget .worldcup-news-container{ display: flex; position: relative}
.worldcup-news-widget .worldcup-news-container .worldcup-news-photo{ flex: 0 40%; max-width: 150px}
.worldcup-news-widget .worldcup-news-container .worldcup-news-content{ flex: 1; padding: 0px 8px 0px 10px}
.worldcup-news-widget .worldcup-news-container .worldcup-news-photo img{ display: block; width: 100%; height: auto}
.worldcup-news-widget .worldcup-news-container .worldcup-news-date{ color: #ccc; font-size: 12px; font-family:'arial'; position: absolute; bottom: 0px}
.worldcup-news-widget .worldcup-news-container .worldcup-news-date span{ margin-right: 5px}
.worldcup-news-widget .worldcup-news-container .worldcup-news-title {  max-height: 60px; color: #F5FBFC}

.hket-worldcup-body-container .tomorrow, .hket-worldcup-body-container .today{scroll-margin-top:100px;}
.hket-worldcup-block-region{ margin-bottom: 20px; scroll-margin-top:100px;}
.hket-worldcup-contest-widget{ position: relative}
.hket-worldcup-contest-widget .container{background: #FFFFFF; border-radius: 10px; padding: 7px 15px; display: flex; margin-bottom: 10px; width: auto}
.hket-worldcup-contest-widget .container p{  margin: 4px 0px}
.hket-worldcup-contest-widget .container p strong{ display: block}
.hket-worldcup-contest-widget .container p span.icon-boradcost{  height: 15px; display: inline-block; }
.hket-worldcup-contest-widget .container p span.icon-boradcost.viutv{ height: 23px; display: flex; align-items: center; width: 48px}
.hket-worldcup-contest-widget .container p.boradcost-container{ display: flex; align-items: flex-end} 
.hket-worldcup-contest-widget .container .contest-vs{ font-family: arial }
.hket-worldcup-contest-widget .container .contest-info{ flex: 0 0 100px; }
.hket-worldcup-contest-widget .container .contest-team{ display: flex; flex: 1 1; justify-content: space-between; align-items: center; max-width: 400px; margin: auto; position: relative}
.hket-worldcup-contest-widget .container .contest-team .contest-country span{ border: 1px solid #ccc; width: 40px; height: 30px}
.hket-worldcup-contest-widget .container .contest-team .contest-country p{ font-size: 14px; white-space: nowrap}
.hket-worldcup-contest-widget .container .contest-team .contest-country { text-align: center; flex: 0 0 70px}
.hket-worldcup-contest-widget .container .contest-team .contest-vs{font-size: 27px; font-weight: bold; text-align: center}
.hket-worldcup-contest-widget .container .contest-team .contest-vs dl{ display: block; font-size: 14px; color: red; font-weight: 400;  margin: 0px}
.hket-worldcup-contest-widget .container .contest-team .contest-vs b{ display: block; font-size: 20px}
.hket-worldcup-contest-widget .container .contest-team .contest-final-result{ position: absolute; color: red; font-size: 14px; text-align: center; width: 100%; bottom: -16px}


.hket-worldcup-group-widget table{ width: 100%; position: relative; color: #FFF; font-size: 14px; margin-bottom: 20px}
.hket-worldcup-group-widget table tr th{ color: #FFC000; font-size: 12px; font-weight: normal}
.hket-worldcup-group-widget table tr th:first-child{ font-size: 20px; }
.hket-worldcup-group-widget table tr{ border-bottom: 1px solid rgba(255,255,255,0.3);   display: flex; align-items: center; }
.hket-worldcup-group-widget table tr.active{ background-color: rgba(255,255,255,0.20)}
.hket-worldcup-group-widget table tr td:first-child, .hket-worldcup-group-widget table tr th:first-child{ flex: 0 129px; text-align: left}
.hket-worldcup-group-widget table tr td, .hket-worldcup-group-widget table tr th{  flex: 1 1 ; text-align: center; align-items: stretch; margin: 5px 0px}
.hket-worldcup-group-widget table tr td span{ margin:0px 5px; border: 1px solid #999}

.hket-worldcup-statis-widget table{ width: 100%; position: relative; color: #FFF; font-size: 14px; margin-bottom: 20px}
.hket-worldcup-statis-widget table tr th{ color: #FFC000; font-size: 12px; font-weight: normal}
.hket-worldcup-statis-widget table tr{  display: flex; align-items: center; }
.hket-worldcup-statis-widget table tr.active{ background: #92455E}
.hket-worldcup-statis-widget table tr td:first-child, .hket-worldcup-statis-widget table tr th:first-child{ flex: 0 30px; text-align: left; padding-left: 5px}
.hket-worldcup-statis-widget table tr td:last-child, .hket-worldcup-statis-widget table tr th:last-child{ flex: 0 30px; text-align: right; margin-right: 5px}
.hket-worldcup-statis-widget table tr td, .hket-worldcup-statis-widget table tr th{  flex: 1 1 ; text-align: left; align-items: stretch; margin: 5px 0px}
.hket-worldcup-statis-widget table tr td span{ margin:0px 5px 0px 0px; border: 1px solid #999}

.hket-worldcup-statis02-widget table{ width: 100%; position: relative; color: #FFF; font-size: 14px; margin-bottom: 20px}
.hket-worldcup-statis02-widget h5{ display: block;
    color: #FFF;
    margin: 0px;
    background: #000;
    padding: 5px 10px;
    font-weight: 300;}
.hket-worldcup-statis02-widget table tr th{ color: #FFC000; font-size: 12px; font-weight: normal}
.hket-worldcup-statis02-widget table tr{ border-bottom: 1px solid rgba(255,255,255,.3);   display: flex; align-items: center; }
.hket-worldcup-statis02-widget table tr.active{ background: #92455E}
.hket-worldcup-statis02-widget table tr td:first-child, .hket-worldcup-statis02-widget table tr th:first-child{ flex: 1; text-align: left}
.hket-worldcup-statis02-widget table tr td, .hket-worldcup-statis02-widget table tr th{  flex: 1 1 ; text-align: center; align-items: stretch; margin: 5px}
.hket-worldcup-statis02-widget table tr td:last-child, .hket-worldcup-statis02-widget table tr th:last-child{ flex: 0 30px; text-align: right; margin-right: 5px; white-space: nowrap}
.hket-worldcup-statis02-widget table tr td p{ display: block; margin: 0px}
.hket-worldcup-statis02-widget table tr td p:lang(en){ font-size: 12px}



/* tnc container */
.tnc-container{left:0; bottom:10px; width:100%; padding:0 10px; font-size:12px; color:rgba(119,119,119,1); letter-spacing:-0.03em;  margin-top: 30px; position: relative; }

.tnc-container p:first-child{margin-bottom:0; line-height:1;}
.tnc-container a{border-bottom:1px solid #555; color:#555;}
.tnc-container a:hover{color:#000;}
.tnc-container .tnc-item{display:-webkit-box; display:-webkit-flex; display:-ms-flexbox; display:inline; margin-bottom:0;}
.tnc-container .copyright{ text-align: center}

@media(min-width:375px){
/* tnc container */
.tnc-container{letter-spacing:0.06em;}
}

.hket-worldcup-date-slick-widget{ position: relative; height: 80px}
.hket-worldcup-date-slick-widget a{ display: block; border: 1px solid #FFF; color: #FFF; text-align: center; line-height: 16px; padding: 3px 10px; border-radius: 5px; margin: 0px 2px; }
.hket-worldcup-date-slick-widget a small{ display: block; font-size: 12px}
.hket-worldcup-date-slick-widget a span{ font-size: 18px;}
.hket-worldcup-date-slick-widget a b{ display: block; font-size: 11px; font-weight: normal}
.hket-worldcup-date-slick-widget .hket-worldcup-date-slick-container .flickity-slider div.is-clicked a{  background: #FFF; color: #000}
.hket-worldcup-date-slick-widget .hket-worldcup-date.fixed{ position: fixed ; z-index: 10; left: 15px;  width: 93%;  max-width: 690px; top: 0px; padding: 5px 0px; background: #1a237c; box-shadow: 0px 10px 19px -13px rgba(0,0,0,0.82);}
.hket-worldcup-date-slick-widget .hket-worldcup-date.fixed .hket-worldcup-date-slick-container { }

@media(min-width:720px){
    .hket-worldcup-date-slick-widget .hket-worldcup-date.fixed{ left: auto; position: fixed ;}
    .hket-worldcup-date-slick-widget .hket-worldcup-date-slick-container{ margin: 0px}
}

.schedule16 span, .schedule32 span { 
    display: block; 
    position: absolute; 
    color: #FFF;
    top: -30px; 
    right: 0px;  
    font-size: 13px; 
    background-image: url('data:image/svg+xml,<%3Fxml version="1.0" encoding="utf-8"%3F><svg width="800px" height="800px" viewBox="0 0 24 24" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M10 17C13.866 17 17 13.866 17 10C17 6.13401 13.866 3 10 3C6.13401 3 3 6.13401 3 10C3 13.866 6.13401 17 10 17Z" stroke="%23FFFFFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path d="M20.9992 21L14.9492 14.95" stroke="%23FFFFFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path d="M6 10H14" stroke="%23FFFFFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/><path d="M10 6V14" stroke="%23FFFFFF" stroke-width="1.5" stroke-linecap="round" stroke-linejoin="round"/></svg>'); 
background-repeat: no-repeat;
    width: 63px;
    background-size: 17%;
    height: 20px;
    padding-left: 30px;
    white-space: nowrap;
    background-position: 10px 2px;
    border: 1px solid #999;
    border-radius: 10px;
}
.schedule16 span:before, .schedule32 span:before{}
.schedule16, .schedule32{ position: relative}