/* BASIC css start */
@font-face {font-family: 'Noto Sans';font-style: normal;font-weight: 100;src: url(/images/web-font/NotoSans-Thin.woff2) format('woff2'),url(/images/web-font/NotoSans-Thin.woff) format('woff'),url(/images/web-font/NotoSans-Thin.otf) format('opentype');}
@font-face {font-family: 'Noto Sans';font-style: normal;font-weight: 300;src: url(/images/web-font/NotoSans-Light.woff2) format('woff2'),url(/images/web-font/NotoSans-Light.woff) format('woff'),url(/images/web-font/NotoSans-Light.otf) format('opentype');}
@font-face {font-family: 'Noto Sans';font-style: normal;font-weight: 400;src: url(/images/web-font/NotoSans-Regular.woff2) format('woff2'),url(/images/web-font/NotoSans-Regular.woff) format('woff'),url(/images/web-font/NotoSans-Regular.otf) format('opentype');}
@font-face {font-family: 'Noto Sans';font-style: normal;font-weight: 500;src: url(/images/web-font/NotoSans-Medium.woff2) format('woff2'),url(/images/web-font/NotoSans-Medium.woff) format('woff'),url(/images/web-font/NotoSans-Medium.otf) format('opentype');}
@font-face {font-family: 'Noto Sans';font-style: normal;font-weight: 700;src: url(/images/web-font/NotoSans-Bold.woff2) format('woff2'),url(/images/web-font/NotoSans-Bold.woff) format('woff'),url(/images/web-font/NotoSans-Bold.otf) format('opentype');}
@font-face {font-family: 'Noto Sans';font-style: normal;font-weight: 900;src: url(/images/web-font/NotoSans-Black.woff2) format('woff2'),url(/images/web-font/NotoSans-Black.woff) format('woff'),url(/images/web-font/NotoSans-Black.otf) format('opentype');}

#R_roulette_event_wrap * {font-family: 'Noto Sans', sans-serif;}
#R_roulette_event_wrap {position:relative; max-width:900px; margin:0 auto;}
/* #R_roulette_event_wrap .R_cont-wrap {height:892px; background:url(/images/common/img_roulette_bg.jpg) left top no-repeat;}
#R_roulette_event_wrap .R_cont-wrap .R_title {text-align:center;} */
#R_roulette_event_wrap .R_cont-wrap .R_title h3 {padding-top:70px; font-size:60px; color:#403b33; font-weight:900; letter-spacing:-1px;}
#R_roulette_event_wrap .R_cont-wrap .R_title p {position:relative; width:375px; margin:0 auto; padding-top:25px; font-size:22px; color:#534d42; font-weight:700;}
#R_roulette_event_wrap .R_cont-wrap .R_title p:before {position:absolute; left:0; top:38px; width:40px; border-bottom:7px double #f49b95; content:'';}
#R_roulette_event_wrap .R_cont-wrap .R_title p:after {position:absolute; right:0; top:38px; width:40px; border-bottom:7px double #f49b95; content:'';}

#R_roulette_event_wrap .R_cont-wrap .R_roulette-wrap {
    /* width: 550px; 
    margin: 45px auto 65px; */
    /* 250114 add */
    position: relative;
}

#R_roulette_event_wrap .R_notice {display:table; width:100%; background:#f2f5f6; padding:40px 0;}
#R_roulette_event_wrap .R_notice dt,
#R_roulette_event_wrap .R_notice dd {letter-spacing:-1px;}
#R_roulette_event_wrap .R_notice dt {display:table-cell; width:30%; padding-left:190px; font-size:20px; font-weight:700; vertical-align:middle;}
#R_roulette_event_wrap .R_notice dd {position:relative; width:70%; padding:0 190px 0 15px; line-height:24px; font-size:15px; color:#777;}   
#R_roulette_event_wrap .R_notice dd:before {position:absolute; left:0; top:0; content:'·';}

#R_roulette_event_wrap .R_comment-wrap {
    padding: 0 0 50px;
    background: #031f13;
}
#R_roulette_event_wrap .R_comment-wrap .inner {width:726px; margin:0 auto;}
#R_roulette_event_wrap .R_comment-wrap .input-text {width:576px; height:46px; line-height:46px; padding:0 15px; border:1px solid #000; border-radius:8px; font-size:18px; color:#000;}
#R_roulette_event_wrap .R_comment-wrap .btn-apply {
    display: inline-block; 
    height: 48px; 
    line-height: 48px; 
    margin-left: 10px; 
    padding: 0 35px; 
    background: #7a5bd0; 
    color:#fff; 
    font-size:20px; 
    letter-spacing:-1px; 
    border-radius:8px;
}
#R_roulette_event_wrap .R_comment-wrap .comment-table-list {background:#fff; border:1px solid #000; border-radius:8px; margin-top:15px; padding:30px; letter-spacing:-1px;}
#R_roulette_event_wrap .R_comment-wrap .comment-table-list td { font-size: 15px; padding-bottom: 30px; color:#000; }
#R_roulette_event_wrap .R_comment-wrap .comment-table-list td .name {color:#000}
#R_roulette_event_wrap .R_comment-wrap .comment-table-list td .date {color:#b8b8b8}
#R_roulette_event_wrap .R_comment-wrap .comment-table-list td .content { line-height: 1.1; word-wrap: break-word; word-break: break-all; }
#R_roulette_event_wrap .R_comment-wrap .comment-table-list td .content img {display:inline-block; margin-left:10px;}
#R_roulette_event_wrap .R_comment-wrap .comment-table-list td .benefit {color:#ef6a61}
#R_roulette_event_wrap .R_comment-wrap .comment-table-list .no-data {text-align:center; font-size:15px; margin:10px auto;}
#R_roulette_event_wrap .R_comment-wrap .paging a { font-size: 12px; color: #999; border: 1px solid #ddd; }
.paging a:hover, .paging a.now, .paging .now { background-color: #7a5bd0; border: 1px solid #ddd; color: #fff !important; }
.paging { margin-top: 30px !important; }

/* 추천상품 리스트 */
#R_roulette_event_wrap .item-wrap .item-cont .item-list {padding:10px; float:left;width: 16.7%;text-align:center; margin:0 13px 10px 0; border:1px solid #eee;}
#R_roulette_event_wrap .item-wrap .item-cont .item-list .thumb {width: 100%; height:180px;overflow:hidden;}
#R_roulette_event_wrap .item-wrap .item-cont .item-list .thumb img {width: 100%; height:100%;}

canvas#eventWheel { z-index: 1; position: absolute; top: 40%; left: 50%; transform: translateX(-50%); }
.event-wheel-start { 
    display: none; 
    z-index: 11; 
    position: absolute; 
    background-color: #534d42; 
    text-align: center; 
    color:#fff; 
    font-size: 28px; 
    font-weight: 900; 
    outline: 0; 
    width: 126px; height: 126px; 
    line-height: 126px; 
    -webkit-border-radius: 50%; 
    -moz-border-radius: 50%; 
    border-radius: 50%; 
    /* add */
    top: 60% !important; left: 50% !important;
    transform: translateX(-50%);
}
.event-wheel-pointer { 
    z-index: 10; 
    position: absolute; 
    /* modify
    left: 523px; 
    top: 235px; 
    */
    top: 41%; left: 50%;
    transform: translate(-50%, -50%);
}
.dummy-canvas { position: relative; width: 50%; min-height: 550px; margin: 0 auto; }


/* 레이어 팝업 */
.R_pop-roulette-layer * {font-family: 'Noto Sans', sans-serif;}
.R_pop-roulette-layer {position:fixed; left:0; top:0; width:100%; height:100%; background-color:rgba( 0, 0, 0, 0.7 ); z-index:999;}
.R_pop-roulette-layer .R_pop-layer {position:absolute; left:50%; top:50%; right:0; width:363px; min-height:357px; padding:0 30px 30px; background:#fff; text-align:center; letter-spacing:-1px; -webkit-transform: translate3d(-50%, -50%, 0); -moz-transform: translate3d(-50%, -50%, 0); transform: translate3d(-50%, -50%, 0);}
.R_pop-roulette-layer .R_pop-layer .btn-close {position:absolute; top:16px; right:16px;}
.R_pop-roulette-layer .R_pop-layer .R_title {color:#000; padding:40px 0 27px;}
.R_pop-roulette-layer .R_pop-layer .R_title span {font-size:22px; font-weight:500;}
.R_pop-roulette-layer .R_pop-layer .R_title p {font-size:29px; font-weight:900;}
.R_pop-roulette-layer .R_pop-layer .R_pop-benefit {margin:0 40px; padding:10px 0; border:2px solid #000; border-radius:26px; font-size:22px; color:#000; font-weight:700; font-family: "Malgun Gothic";}
.R_pop-roulette-layer .R_pop-layer .R_txt {padding:28px 0 15px; font-size:15px; font-weight:700; color:#000; font-family: "Malgun Gothic";}
.R_pop-roulette-layer .R_pop-layer textarea {width:88%; padding:20px; border:1px solid #c0bbba; border-radius:6px; color:#000; font-family: "Malgun Gothic"; font-size:13px; letter-spacing: -1px; resize: none;}
.R_pop-roulette-layer .R_pop-layer textarea::placeholder {color:#a1a1a1;}
.R_pop-roulette-layer .R_pop-layer .btn-write {display:block; margin-top:10px; padding:17px; background:#000; color:#fff; border-radius:6px; font-size:18px; font-weight:700; font-family: "Malgun Gothic";}

/* CUSTOM CSS */
#overlay_layer { display: none !important; }
#contentWrap { max-width: 900px; }

/* reset */
.event__container { 
    max-width: 900px; 
    margin: 0 auto 200px; 
    padding: 0; 
    box-sizing: border-box; 
}
.event__container section, 
.event__container div { position: relative; }
.event__container .img_box { width: 100%; display: block; }
.event__container div { line-height: 0; }
.event__container ul,
.event__container li { list-style: none; margin: 0; padding: 0; }
.event__container a { 
    text-decoration: none; 
    cursor: pointer; 
}
/* BASIC css end */