@charset "utf-8";





/* Font-Face
============= */

@font-face {
  font-family:'db_helvethaica_x';
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_v3.2-webfont.eot');
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_v3.2-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_v3.2-webfont.woff2') format('woff2'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_v3.2-webfont.woff') format('woff'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_v3.2-webfont.ttf') format('truetype');
  font-weight:normal;
  font-style:normal;
}
@font-face {
  font-family:'db_helvethaica_x-italic';
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_it_v3.2-webfont.eot');
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_it_v3.2-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_it_v3.2-webfont.woff2') format('woff2'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_it_v3.2-webfont.woff') format('woff'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_it_v3.2-webfont.ttf') format('truetype');
  font-weight:normal;
  font-style:normal;
}
@font-face {
  font-family:'db_helvethaica_x-medium';
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_med_v3.2-webfont.eot');
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_med_v3.2-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_med_v3.2-webfont.woff2') format('woff2'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_med_v3.2-webfont.woff') format('woff'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_med_v3.2-webfont.ttf') format('truetype');
  font-weight:normal;
  font-style:normal;
}
@font-face {
  font-family:'db_helvethaica_x-medium-italic';
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_med_it_v3.2-webfont.eot');
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_med_it_v3.2-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_med_it_v3.2-webfont.woff2') format('woff2'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_med_it_v3.2-webfont.woff') format('woff'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_med_it_v3.2-webfont.ttf') format('truetype');
  font-weight:normal;
  font-style:normal;
}
@font-face {
  font-family:'db_helvethaica_x-bold';
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_bd_v3.2-webfont.eot');
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_bd_v3.2-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_bd_v3.2-webfont.woff2') format('woff2'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_bd_v3.2-webfont.woff') format('woff'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_bd_v3.2-webfont.ttf') format('truetype');
  font-weight:normal;
  font-style:normal;
}
@font-face {
  font-family:'db_helvethaica_x-bold-italic';
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_bd_it_v3.2-webfont.eot');
  src:url('fonts/db_helvethaica_x/db_helvethaica_x_bd_it_v3.2-webfont.eot?#iefix') format('embedded-opentype'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_bd_it_v3.2-webfont.woff2') format('woff2'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_bd_it_v3.2-webfont.woff') format('woff'),
       url('fonts/db_helvethaica_x/db_helvethaica_x_bd_it_v3.2-webfont.ttf') format('truetype');
  font-weight:normal;
  font-style:normal;
}

/* End Font-Face ------------- */





* {-webkit-tap-highlight-color:transparent; text-rendering:optimizeLegibility; outline:none; }

html {font-size:62.5%; }

body {background-color:#eff0f4; margin:0; padding:0; font:normal 1.8rem/1em 'db_helvethaica_x', Arial, Helvetica, sans-serif; color:#000; -webkit-font-smoothing:antialiased; -moz-osx-font-smoothing:grayscale; }

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





/* Paragraph Style
============= */
h1, h2, h3, h4, h5, h6 {margin:0; font-weight:normal; line-height:1em; font-family:'db_helvethaica_x-medium'; }

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

blockquote {margin:0 0 18px 18px; color:#666; font-style:italic; }

strong {font-weight:normal; font-family:'db_helvethaica_x-bold'; }
em {font-style:italic; }

p {margin:0; }
p + p {margin-top:15px; }

a {transition:color 250ms ease; }
a:link, a:visited {color:inherit; text-decoration:none; }
.desktop a:hover, a:active {color:inherit; }

label,
button {cursor:pointer; }

/* End Paragraph Style ------------- */





/* Standard Style
============= */
img {max-width:100%; display:block; margin:0 auto; }

.img-left {float:left; margin:20px 20px 20px 0; }
.img-right {float:right; margin:20px 0 20px 20px; }

.align-right {text-align:right; }
.align-left {text-align:left; }
.align-center {text-align:center; }
.align-justify {text-align:justify; }

.hide {display:none; }
.block {display:block !important; }
.inline {display:inline !important; }

.clear {height:0px; display:block; padding:0; margin:0; line-height:0; clear:both; overflow:hidden; visibility:hidden; }

.clear-float::after {content:''; height:0px; display:block; padding:0; margin:0; line-height:0; clear:both; overflow:hidden; visibility:hidden; }

/* End Standard Style ------------- */





/* Standard Layout
============= */

.page-center {width:1170px; max-width:calc(100% - 30px); height:100%; position:relative; margin:0 auto; }

/* End Standard Layout ------------- */





/* Main Elements
============= */

#wrapper {min-height:100vh; height:100%; position:relative; margin:0 auto; overflow:hidden; opacity:0; }

#header,
#container,
#footer {width:100%; position:relative; padding:0; margin:0; overflow:hidden; }

#container {min-height:800px; }

/* Main Elements ------------- */





/* Share
============= */

/* Header */
#header {height:100px; background-color:#f6f7fb; position:relative; z-index:1313; overflow:visible; }

#header .btn-back {width:162px; height:52px; display:block; background-color:#d9dde9; border-radius:5px; position:absolute; left:34px; top:28px; padding-left:58px; font:normal 2.4rem/52px 'db_helvethaica_x-medium'; color:#5f6060; }
#header .btn-back::before {content:''; width:40px; height:100%; display:block; background-color:#c6ccdc; border-top-left-radius:5px; border-bottom-left-radius:5px; position:absolute; left:0; top:0; }
#header .btn-back::after {content:''; width:10px; height:16px; display:block; background:url('../img/icons/arrow-left-gray.png') no-repeat; position:absolute; left:14px; top:18px; transition:200ms ease; }
.desktop #header .btn-back:hover::after {left:9px; }

#header .group-btn {position:absolute; left:50%; top:14px; transform:translateX(-50%); }
#header .group-btn a {text-indent:-9999px; }

#header .logo-ptt {width:91px; height:42px; display:block; background:url('../img/share/logo-ptt.svg') 0 0/100% no-repeat; float:left; margin-top:2px; }

#header .logo-spirit {width:130px; height:70px; display:block; background:url('../img/share/logo-spirit.png') 0 0/100% no-repeat; float:left; }

#header .game-status {position:absolute; right:45px; top:30px; transition:250ms ease; }
.before-start #header .game-status {filter:grayscale(100%); opacity:0.2; }
#header .game-status > div {position:relative; float:left; padding-left:32px; margin-left:32px; font:normal 5rem/1em 'db_helvethaica_x-medium'; }
#header .game-status > div::before {content:''; width:2px; height:45px; display:block; background-color:#a5acbd; position:absolute; left:0; top:0; }
#header .game-status > div:first-child {padding-left:0; margin-left:0; }
#header .game-status > div:first-child::before {display:none; }
#header .game-status p {position:relative; line-height:0.8em; }
#header .game-status p small {display:block; margin-top:-15px; font-size:0.36em; color:#515151; }
#header .game-status .score p {padding-left:56px; color:#00abe9; }
#header .game-status .score p::before {content:''; width:40px; height:40px; display:block; background:url('../img/icons/goal.png') no-repeat; position:absolute; left:0; top:5px; }

#header .game-status .time p {padding-left:50px; color:#f39054; }
#header .game-status .time p::before {content:''; width:38px; height:38px; display:block; background:url('../img/icons/clock.png') no-repeat; position:absolute; left:0; top:5px; }
#header .game-status .time p small {color:#6a6d7b; }
/* End Header */





/* Toolkit */
html .btn-style {display:inline-block; background:linear-gradient(to bottom,#4dc1ed 0%,#00abe9 10%,#00abe9 85%,#00a2dd 100%); border:none; border-bottom:1px solid #fff; border-radius:8px; box-shadow:0 2px 3px rgba(127,127,127,0.7); padding:24px 98px; margin:0 auto; font-size:4.8rem; color:#fff; transition:250ms ease; cursor:pointer; }
html .btn-style.-gambler {background:url('../img/icons/gambler.png') 16px 50% no-repeat, linear-gradient(to bottom,#4dc1ed 0%,#00abe9 10%,#00abe9 85%,#00a2dd 100%); text-indent:20px; }
html.desktop .btn-style:hover {color:#fff; }
/* End Toolkit */





/* Set Class for Responsive */
.desktop-style {display:block !important; }
.mobile-style {display:none !important; }
/* End Set Class for Responsive */

/* End Share ------------- */





/* All Page
============= */

.box-loading {width:100vw; height:100vh; background:#eff0f4 url('../img/game/bg-quiz.jpg') 50% 0 no-repeat; position:fixed; left:0; top:0; z-index:131313; }
.box-loading .box-ball {position:absolute; left:50%; top:50%; -webkit-transform:translate(-50%,-50%); -ms-transform:translate(-50%,-50%); -o-transform:translate(-50%,-50%); transform:translate(-50%,-50%); text-align:center; }
.box-loading .box-ball p {width:100%; margin-bottom:50px; font:normal 3.6rem/1em 'db_helvethaica_x-medium'; color:#1b1464; }
.box-loading .box-ball > div {width:15px; height:15px; display:inline-block; border-radius:50%; position:relative; animation:bouncedelay 3.0s infinite cubic-bezier(.62, .28, .23, .99) both; margin:0 8px; }
.box-loading .box-ball .ball-01 {animation-delay:-.16s; }
.box-loading .box-ball .ball-02 {animation-delay:-.08s; }

@keyframes bouncedelay {
  0% {bottom:0; background-color:#03a9f4; }
  16.66% {bottom:40px; background-color:#fb6542; }
  33.33% {bottom:0px; background-color:#fb6542; }
  50% {bottom:40px; background-color:#ffbb00; }
  66.66% {bottom:0px; background-color:#ffbb00; }
  83.33% {bottom:40px; background-color:#03a9f4; }
  100% {bottom:0; background-color:#03a9f4; }
}



/* Game */
.game-page.-quiz {background:#f6f7fb url('../img/game/bg-quiz.jpg') 50% 0 no-repeat; }

.game-page.-quiz .title {width:380px; max-width:calc(100% - 30px); position:relative; margin:30px auto 0; text-align:center; transition:250ms ease; }
.game-page.-quiz .title::before {content:''; width:100%; height:2px; display:block; background-color:#191860; position:absolute; left:0; top:50%; margin-top:-1px; }
.game-page.-quiz .title h2 {display:inline-block; background-color:#f6f7fb; position:relative; padding:0 30px; font-size:5rem; color:#191860; transition:250ms ease; }
.game-page.-quiz .title span {color:#00abe9; }

.before-start .game-page.-quiz .title {width:844px; max-width:calc(100% - 30px); margin-top:70px; margin-bottom:50px; }
.before-start .game-page.-quiz .title h2 {font-size:8.3rem; }


.intro {width:980px; max-width:calc(100% - 30px); display:none; padding-bottom:20px; margin:0 auto; text-align:center; }
.intro .items {overflow:hidden; }
.intro .item {width:33.33%; float:left; }
.intro .item p {margin-top:25px; font-size:2.6rem; line-height:1em; color:#515151; }
.intro .remark {margin-top:20px; font-size:3.4rem; color:#fc4e7b; }
.intro .btn-style {margin-top:30px; clear:both; }


.question {width:1038px; max-width:calc(100% - 30px); display:block; background-color:#fff; border:10px solid #a5acbd; border-radius:10px; position:relative; padding:0; margin:10px auto 0; }
.question::before {content:''; width:calc(100% - 64px); height:14px; display:block; background-color:#999faf; border-bottom-right-radius:10px; border-bottom-left-radius:10px; position:absolute; left:50%; bottom:-24px; -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); transform:translateX(-50%); }
.question::after {content:''; width:calc(100% - 120px); height:14px; display:block; background-color:#9298a7; border-bottom-right-radius:10px; border-bottom-left-radius:10px; position:absolute; left:50%; bottom:-38px; -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); transform:translateX(-50%); box-shadow:0 9px 9px rgba(14,47,96,0.24); }
.question .question-info {margin-top:58px; font-size:3.6rem; color:#c7c7c7; text-align:center; }
.question .btn-hint {position:absolute; right:26px; top:26px; font:normal 2.4rem/1em 'db_helvethaica_x-bold'; color:#dc3832 !important; }
.question .btn-hint::after {content:''; width:100%; height:1px; display:block; background-color:#dc3832; position:absolute; left:0; bottom:0; }
.question .bottom {background-color:#f7f7f7; border-top:2px solid #f1f1f1; border-bottom:2px solid #f1f1f1; padding:26px; text-align:center; }
.question .bottom .btn-style.disabled {background:#999faf; }

.before-start .intro {display:block; }
.before-start .question {display:none; }

.question .section {display:none; padding:30px; margin-top:10px; }
.question .section.active {display:block; }

.question .section p {line-height:1.1em; }

.question .section .spirit {position:absolute; left:12px; top:-26px; }

.question .section .box-question {font-size:5rem; color:#191860; text-align:center; }

.question .section .group-btn {margin-top:30px; text-align:center; }
.question .section .group-btn a {width:calc(33.33% - 40px); display:inline-block; border:1px solid #e1e4ed; border-radius:8px; padding:24px ; margin:18px 15px 0; font-size:3.6rem; line-height:0.8em; color:#515151; transition:none; }
.question .section .group-btn a.active {background:linear-gradient(to bottom,#48478c 0%,#2a2979 10%,#2a2979 85%,#282773 100%); border-color:transparent; color:#fff; box-shadow:0 2px 4px rgba(0,0,0,0.6); }

.question .section .video,
.question .section .img {width:470px; max-width:100%; height:250px; margin:20px auto 0; }
.question .section .img {width:100%; height:auto; }

.question .section.layout-01 .group-btn a {width:calc(50% - 40px); text-align:left; }
.question .section.layout-02 .group-btn a {font-size:3.2rem; text-align:left; }

.question .section.layout-03 .group-btn a {padding-top:6px; padding-bottom:6px; }
.question .section.layout-03 .group-btn a.active {background:#fff; border:3px solid #2a2978; }
/* End Game */

/* End All Page ------------- */





/* Popup
============= */

.popup {width:430px; max-width:calc(100vw - 40px); background-color:#fff; border:10px solid #a5acbd; border-radius:8px; margin:20px 0; }
.popup * {box-sizing:border-box; }

.popup .inner {padding:50px 20px; text-align:center; }
.popup .inner::after {content:''; height:0px; display:block; padding:0; margin:0; line-height:0; clear:both; overflow:hidden; visibility:hidden; }
.popup .inner .icon {width:67px; height:90px; position:relative; margin:0 auto 36px; }
.popup .inner .icon .shadow {content:''; width:100%; height:12px; background-color:#000; border-radius:50%; position:absolute; left:0; bottom:0; }
.popup .inner p {font-size:6.2rem; line-height:0.7em; }
.popup .inner p small {display:block; font-size:0.775em; }
.popup .inner .btn-style {width:80%; padding-right:0; padding-left:0; margin-top:36px; font-size:4rem; transition:none; cursor:pointer; }

.popup.-hint {width:800px; }
.popup.-hint .inner {padding:50px 30px; }
.popup.-hint .inner h2 {font:normal 6.5rem/0.8em 'db_helvethaica_x-bold'; color:#dc3832; }
.popup.-hint .inner .items {margin-top:30px; }
.popup.-hint .inner .items::after {content:''; height:0px; display:block; padding:0; margin:0; line-height:0; clear:both; overflow:hidden; visibility:hidden; }
.popup.-hint .inner .items .item {width:50%; float:left; margin-top:20px; }
.popup.-hint .inner .items .item:nth-of-type(2n) {float:right; }
.popup.-hint .inner .items .item:nth-of-type(2n+1) {clear:both; }
.popup.-hint .inner .items .item .img {float:left; }
.popup.-hint .inner .items .item .text {width:calc(100% - 130px); float:right; text-align:left; }
.popup.-hint .inner .items .item p {font-size:2.2rem; line-height:0.9em; color:#898989; }

.popup.-correct .inner .icon .shadow {background-color:#d6eddb; }
.popup.-correct .inner .icon .shadow {background-color:#d6eddb; }
.popup.-correct .inner p {color:#208739; }

.popup.-wrong .inner .icon .shadow {background-color:#f1cdcd; }
.popup.-wrong .inner p {color:#bd2b29; }

.popup.-timeout .inner {padding-bottom:30px; }
.popup.-timeout .inner .icon {margin-bottom:10px; }
.popup.-timeout .inner .icon .shadow {background-color:#cceefb; }
.popup.-timeout .inner h2 {margin-bottom:5px; font:normal 6.2rem/1em 'db_helvethaica_x'; color:#191860; }
.popup.-timeout .inner p {font-size:3rem; color:#515151; }
.popup.-timeout .inner p.score {margin:20px 0; font-size:5rem; font-family:'db_helvethaica_x-medium'; color:#191860; }
.popup.-timeout .inner .btn-style {width:48%; display:inline-block; font-size:3rem; }
.popup.-timeout .inner .btn-style + .btn-style {background:linear-gradient(to bottom,#48478c 0%,#2a2979 10%,#2a2979 85%,#282773 100%); margin-left:10px; }

.popup.-timeout-congrat .inner {padding-bottom:30px; }
.popup.-timeout-congrat .inner .icon {margin-bottom:10px; }
.popup.-timeout-congrat .inner .icon .shadow {background-color:#cceefb; }
.popup.-timeout-congrat .inner h2 {margin-bottom:5px; font:normal 6.2rem/1em 'db_helvethaica_x'; color:#191860; }
.popup.-timeout-congrat .inner p {font-size:3rem; color:#515151; }
.popup.-timeout-congrat .inner p.score {margin:20px 0; font-size:5rem; font-family:'db_helvethaica_x-medium'; color:#191860; }

.popup.-complete .inner {padding-bottom:30px; }
.popup.-complete .inner .icon {margin-bottom:10px; }
.popup.-complete .inner .icon .shadow {background-color:#cceefb; }
.popup.-complete .inner h2 {margin-bottom:5px; font:normal 6.2rem/1em 'db_helvethaica_x'; color:#191860; }
.popup.-complete .inner p {font-size:3rem; color:#515151; }
.popup.-complete .inner p.score {margin:20px 0; font-size:5rem; font-family:'db_helvethaica_x-medium'; color:#191860; }
.popup.-complete .inner .btn-style {width:48%; display:inline-block; font-size:3rem; }
.popup.-complete .inner .btn-style + .btn-style {background:linear-gradient(to bottom,#48478c 0%,#2a2979 10%,#2a2979 85%,#282773 100%); margin-left:10px; }

.popup.-congrat .inner {padding-bottom:30px; }
.popup.-congrat .inner .icon {margin-bottom:10px; }
.popup.-congrat .inner .icon .shadow {background-color:#cceefb; }
.popup.-congrat .inner h2 {margin-bottom:5px; font:normal 6.2rem/1em 'db_helvethaica_x'; color:#191860; }
.popup.-congrat .inner p {font-size:3rem; color:#515151; }
.popup.-congrat .inner p.score {margin:20px 0; font-size:5rem; font-family:'db_helvethaica_x-medium'; color:#191860; }


.popup-wheel {max-width:100vw; margin:40px 0; position:relative; }
.popup-wheel .description {background-color:rgba(0,83,152,0.8); border-radius:8px; padding:30px 50px; margin-top:14px; font:normal 3.6rem/0.8em 'db_helvethaica_x-medium'; color:#fff; text-align:center; }
.wheel {width:565px; height:572px; background:url('../img/game/wheel-outer.png') no-repeat; position:relative; }

.wheel [class^="light-"] {position:absolute; top:7px; z-index:13; }

.wheel .light-01 {left:353px; }
.wheel .light-02 {left:433px; top:63px; }
.wheel .light-03 {left:496px; top:147px; }
.wheel .light-04 {left:513px; top:248px; }
.wheel .light-05 {left:495px; top:349px; }
.wheel .light-06 {left:437px; top:435px; }
.wheel .light-07 {left:356px; top:493px; }
.wheel .light-08 {left:242px; top:515px; }
.wheel .light-09 {left:142px; top:493px; }
.wheel .light-10 {left:58px; top:433px; }
.wheel .light-11 {left:-2px; top:348px; }
.wheel .light-12 {left:-20px; top:246px; }
.wheel .light-13 {left:0; top:147px; }
.wheel .light-14 {left:58px; top:63px; }
.wheel .light-15 {left:144px; }

.wheel .wheel-inner {width:509px; height:509px; background:url('../img/game/wheel-inner.png'); position:absolute; left:29px; top:32px; }
.wheel .wheel-inner [class^="reward-"] {width:194px; height:156px; text-shadow:0 3px 3px rgba(0,0,0,0.5);  position:absolute; left:0; top:0; font:normal 6rem/0.8em 'db_helvethaica_x-medium'; color:#fff; text-align:center; }
.wheel .wheel-inner [class^="reward-"] span {display:block; margin-top:40px; }
.wheel .wheel-inner [class^="reward-"] small {display:block; margin-top:-15px; font-size:0.66em; }
.wheel .wheel-inner [class^="reward-"] img {margin-top:35px; }

.wheel .wheel-inner [class^="reward-"].multiply {font-size:8.6rem; }
.wheel .wheel-inner [class^="reward-"].multiply span {margin-top:25px; }
.wheel .wheel-inner [class^="reward-"].multiply small {margin-top:-20px; font-size:0.36em; }

.wheel .wheel-inner .reward-01 {left:158px; top:0; }
.wheel .wheel-inner .reward-02 {left:28px; top:47px; -webkit-transform:rotate(-45deg); -ms-transform:rotate(-45deg); -o-transform:rotate(-45deg); transform:rotate(-45deg); }
.wheel .wheel-inner .reward-03 {left:-19px; top:177px; -webkit-transform:rotate(-90deg); -ms-transform:rotate(-90deg); -o-transform:rotate(-90deg); transform:rotate(-90deg); }
.wheel .wheel-inner .reward-04 {left:36px; top:300px; -webkit-transform:rotate(-135deg); -ms-transform:rotate(-135deg); -o-transform:rotate(-135deg); transform:rotate(-135deg); }
.wheel .wheel-inner .reward-05 {left:157px; top:353px; -webkit-transform:rotate(-180deg); -ms-transform:rotate(-180deg); -o-transform:rotate(-180deg); transform:rotate(-180deg); }
.wheel .wheel-inner .reward-06 {left:278px; top:300px; -webkit-transform:rotate(-225deg); -ms-transform:rotate(-225deg); -o-transform:rotate(-225deg); transform:rotate(-225deg); }
.wheel .wheel-inner .reward-07 {left:334px; top:177px; -webkit-transform:rotate(-270deg); -ms-transform:rotate(-270deg); -o-transform:rotate(-270deg); transform:rotate(-270deg); }
.wheel .wheel-inner .reward-08 {left:287px; top:47px; -webkit-transform:rotate(-315deg); -ms-transform:rotate(-315deg); -o-transform:rotate(-315deg); transform:rotate(-315deg); }

.wheel .arrow {position:absolute; left:50%; top:-10px; -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); transform:translateX(-50%); }
.wheel .btn-wheel {width:201px; height:201px; display:block; background:url('../img/game/btn-wheel.png') no-repeat; position:absolute; left:50%; top:50%; margin:-100px 0 0 -100px; /* -webkit-transform:translate(-50%,calc(-50% - 7px)); -ms-transform:translate(-50%,calc(-50% - 7px)); -o-transform:translate(-50%,calc(-50% - 7px)); transform:translate(-50%,calc(-50% - 7px)); */ }
.wheel .btn-wheel::before {content:''; width:183px; height:185px; display:block; background:url('../img/game/btn-wheel-inner.png') no-repeat; position:absolute; left:9px; top:8px; }
/* .wheel .btn-wheel.animated::before {animation:btnWheel 2000ms ease infinite; } */

.wheel .btn-wheel::after {content:''; width:100%; height:100%; display:none; background-color:#fff; border-radius:50%; position:absolute; left:0; top:0; -webkit-filter:blur(10px); -o-filter:blur(10px); filter:blur(10px); }
.wheel .btn-wheel.animated::after {display:block; animation:btnWheel 1800ms ease-in-out infinite; }

@keyframes btnWheel {
  0%, 100% {opacity:0.35; }
  50% {opacity:0; }
}

.popup-wheel .popup {display:none; position:absolute; left:50%; top:0; -webkit-transform:translateX(-50%); -ms-transform:translateX(-50%); -o-transform:translateX(-50%); transform:translateX(-50%); z-index:1313; }
.popup-wheel .popup h2 {font-size:6.2rem; font-family:'db_helvethaica_x'; color:#191860; }
.popup-wheel .popup p {font-size:3.2rem; color:#515151; }
.popup-wheel .popup .reward {background:url('../img/game/popup-wheel-bg-rewrad.png') 50% 50% no-repeat; margin-bottom:40px; }
.popup-wheel .popup .reward p {width:133px; height:133px; background-color:#effbff; border-radius:50%; margin:24px auto; font:normal 8.6rem/133px 'db_helvethaica_x-medium'; color:#00abe9; }
.popup-wheel .popup.-multiply .reward p {line-height:115px; }
.popup-wheel .popup.-multiply .reward p small {margin-top:-30px; font-size:0.3em; line-height:1em; color:#191860; }
.popup-wheel .popup .row {display:block; margin:0 20px; }
.popup-wheel .popup .row + .row {margin-top:24px; }
.popup-wheel .popup .row p {float:left; margin:0; font-size:3.4rem; color:#191860; }
.popup-wheel .popup .row p + p {float:right; }
.popup-wheel .popup .row p span {color:#00abe9; }
.popup-wheel .popup .total {border-top:2px solid #00abe9; border-bottom:2px solid #00abe9; padding:20px 0; }
.popup-wheel .popup .total strong {font-size:1.2em; font-family:'db_helvethaica_x-medium'; color:#fc4e7b; }


.popup-wheel .popup.-fail h2 {color:#fc4e7b; }
.popup-wheel .popup.-fail .reward {background:none; margin:10px 0 20px; }
.popup-wheel .popup.-fail .btn-style {width:48%; display:inline-block; font-size:3rem; }
.popup-wheel .popup.-fail .btn-style + .btn-style {background:linear-gradient(to bottom,#48478c 0%,#2a2979 10%,#2a2979 85%,#282773 100%); margin-left:10px; }

/* End Popup ------------- */





/* Plugin
============= */

/* Fancybox */
html .fancybox-wrap {z-index:13131313; }
html .fancybox-overlay {background:rgba(0,0,0,0.5); z-index:131313; }
html .fancybox-skin {background:none; border-radius:0; }
html .fancybox-inner {overflow:visible !important; }
html .fancybox-close {width:40px; height:40px; background:url('../img/icons/btn-close.png') no-repeat; right:20px; top:20px; }
/* End Fancybox */

/* End Plugin ------------- */