[v-cloak] {
    display: none; 
} 
@font-face {
    font-family: 'SpoqaHanSansNeo-Regular';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SpoqaHanSansNeo-Regular.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'SpoqaHanSansNeo-Bold';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SpoqaHanSansNeo-Bold.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'SpoqaHanSansNeo-Light';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SpoqaHanSansNeo-Light.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
@font-face {
    font-family: 'SpoqaHanSansNeo-Medium';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SpoqaHanSansNeo-Medium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}
.clearfix{*zoom:1;}
.clearfix:after{content: '';display:block;clear:both;}
#wrap_roulette{width:100%;height: 1663px;background-image: url(../images/roulette_bg.jpg);background-size: cover;background-position: center top;}
#wrap_roulette.doubles{background-image: url(../images/roulette_double_bg.png) !important;}
#wrap_roulette *{font-family: 'SpoqaHanSansNeo-Regular';}

.notice_btn{margin-bottom: 27px;display: inline-block;}
.roulcontainer{width:1100px;margin:0 auto;}
.title{text-align: left;position: relative;width:962px;margin: 0 auto;padding-top:100px;}
.title>a{position: absolute;right: 0;bottom:0;}
.title>p>img{position: relative;left:50%;transform: translateX(-50%);}
.notice_pop{position: absolute;left:50%;bottom:-210px;transform: translateX(-50%);z-index:400;display: none;}
.notice_pop>a.pop_close{position: absolute;right: 48px;top: 41px;}

.roultxt{padding:50px 0 0 0;width:445px;float: left;text-align: center;}
.howto{width:100%;height: 335px;background-image: url(../images/roul_gaevent_bg.png?v=3);background-repeat: no-repeat;padding: 17px 17px 20px 20px;box-sizing: border-box;position: relative;}
.howto.on{background-image: url(../images/roul_howto_bg.png);}
.howto .info {content:url(../images/btn_guerrilla_on.png);float:left;}
.howto .how {float:left;}
.howto.on .info {content:'';}
.howto.on .how {content:url(../images/btn_howto_on.png);}
.history{width:100%;height: 430px;background-image: url(../images/roul_history_bg.png);margin-top:25px;padding:88px 17px 20px 20px;box-sizing: border-box;position: relative;}

.not_login{text-align: center;}
.not_login>p{font-size: 22px;color:#fff;padding:90px 0 20px 0;}
.not_login>p>span{color:#79f6a8;}
.history>.his_list{width:378px;margin: 0 auto;}
.history>.his_list>table{border-collapse: separate;border-spacing: 0 5px;}
.history>.his_list>table tr{
    /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#50e4ff+0,ffffff+30,ffffff+100 */
   /* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#cdf7ff+0,ffffff+30,ffffff+100 */
background: #cdf7ff; /* Old browsers */
background: -moz-linear-gradient(left,  #cdf7ff 0%, #ffffff 30%, #ffffff 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(left,  #cdf7ff 0%,#ffffff 30%,#ffffff 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to right,  #cdf7ff 0%,#ffffff 30%,#ffffff 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#cdf7ff', endColorstr='#ffffff',GradientType=1 ); /* IE6-9 */
}
.history>.his_list>table tr:first-child{background:none;}
.history>.his_list>table th,.history>.his_list>table td{text-align: center;font-size: 18px;height: 38px;}
.history>.his_list>table th{color:#79f6a8;}
.history>.his_list>table td{color:#084d1f;}
.history>.his_list>table td:nth-child(1){border-top-left-radius: 5px;border-bottom-left-radius: 5px;}
.history>.his_list>table td:nth-child(3){border-top-right-radius: 5px;border-bottom-right-radius: 5px;}
.his_btn{text-align: center;position: absolute;left:0;bottom:25px;width:100%;}
.his_btn>a+a{margin-left: 50px;}

.roulette{position:relative;float: right;padding:144px 0 0 0;width:630px;height: 757px;}
.roulette canvas{position: absolute;top:144px;left:0;z-index: 200;box-shadow: 0px 0px 30px 15px rgb(10 29 111 / 45%);border-radius: 50%;transform: rotate(-23deg);}
.roulette:after{content: '';position: absolute;top:141px;left:-5px;width:641px;height: 641px;background-color: #703b11;border-radius: 50%;}
.roulette .bottombg{position: absolute;bottom:-82px;left:50%;transform: translateX(-50%);}
.top_cover{position: absolute;left:50%;transform: translateX(-50%);top:138px;z-index: 200;}
.pointer{position: absolute;left:50%;transform: translateX(-50%);top:110px;z-index: 300;}
.roulette>img+img{right: 0;}
.btn_area{width:637px;height: 646px;position: relative;}
.stbtn{position: absolute;left:50%;transform:translate(-50%, -50%);top:50%;letter-spacing: 1px;z-index: 300;outline:none;border:none;border-radius: 50%;}


.roulcont{position:absolute;right:-40px;top:40px;width:250px;height: 199px;background-image: url(../images/new_contimg.png);}
.roulcont>span{display: block;width:100%;text-align:center;padding:83px 0 0 0px;font-size: 40px;font-weight: 800;color:#ffd800;font-family: 'NanumSquare', sans-serif !important;box-sizing: border-box;}

/* 팝업 */
.gift_pop{position: absolute;z-index: 1000;}
.gift_pop>.pop_inner{width: 100%;height: 100%;left:50%;top:50%;transform: translate(-50%, -50%);position: fixed;}
.gift_pop>.pop_inner>.pop_cont{width:544px;height: 637px;left:50%;top:50%;transform: translate(-50%, -50%);position: fixed;background-image: url(../images/popup_bg.png);}
.gift_pop>.pop_inner>.pop_cont>ul{position: fixed;padding: 378px 0 0 195px;top: 0;}
.gift_pop>.pop_inner>.pop_cont>ul>li{font-size: 20px;color:#fff;height: 44px;width: 152px;line-height: 40px;text-align: center;font-weight: 600;}
.gift_pop>.pop_inner>.pop_cont>a{position: absolute;width:207px;height: 73px;bottom:54px;left:50%;transform: translateX(-50%);}
.ani_pop_back {position: fixed;width: 100%;height: 100%;}
.ani_pop_top {position: relative;top: -26px;left: 20px;width: 500px;}