@charset "utf-8";

/*초기화*/
html, body{min-width:100%;min-height:100%;}
html{position:relative;left:0;height:100%;overflow-y:scroll;overflow-x:hidden;}
body{height:100%;background:#000;}
html, body, div, p, h1, h2, h3, h4, h5, h6,
ul, ol, li, dl, dt, dd, table, th, td, pre, blockquote, thead, tfoot,
form, fieldset, legend, input, textarea, button, select{margin:0;padding:0;}
body, div, table, th, td, pre, blockquote, thead, tfoot,
input, button, textarea, ol, li, ul, dl, dt, dd{font-family:'나눔고딕','Nanum Gothic','맑은고딕','Malgun Gothic','gulim','arial','Dotum','AppleGothic',sans-serif;font-weight:400;letter-spacing:-0.05em;word-break:break-word;}
body, div, table, th, td, pre, blockquote, em{font-weight:normal;font-style:normal;color:#454545;}
body, div, table, th, td, pre, blockquote{font-size:13px;}
h1, h2, h3, h4, h5, h6{font-size:1em;font-weight:600;}
b, strong{font-weight:600;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section{display:block;}
img, table, thead, tfoot, fieldset, legend, iframe{border:none;}
label, input, button, textarea, select, img{vertical-align:middle;}
textarea{display:block;width:100%;height:100px;}
input, textarea{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;-webkit-appearance:none;-webkit-border-radius:0;border-radius:0;background:none;}
button{background-color:transparent;cursor:pointer;border:0;}
legend{position:absolute;width:0;height:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden;}
hr{display:none;}
select{font-size:12px;height:23px;padding:1px;border:1px solid #ccc;background:#fff;}
ol, li, ul, dl, dt, dd{list-style-type:none;list-style:none;text-align:left;position:static;overflow:hidden;}
a:link, a:visited{color:#454545;text-decoration:none;}
a:hover, a:focus, a:active{color:#454545;text-decoration:underline;}

i.draw_icon_close{display:inline-block;position:relative;width:16px;height:16px;transform:rotate(45deg);}
i.draw_icon_close:before{content:'';display:block;position:absolute;top:50%;left:50%;width:1px;height:20px;background:#666;transform:translateY(-50%);}
i.draw_icon_close:after{content:'';display:block;position:absolute;top:50%;left:50%;width:20px;height:1px;background:#666;transform:translateX(-50%);}


/* 아라쇼 : 라이브중 */
.liveStream_wrap{overflow:hidden;position:relative;height:100%;}
.liveStream_wrap .blind{overflow:hidden;position:absolute;top:-9999px;left:-9999px;width:0;height:0;font-size:0;}
.liveStream_wrap .live_bg_img{position:relative;width:100%;height:100%;}
.liveStream_wrap .live_bg_img:after{content:'';position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.55);}
.liveStream_wrap .live_bg_img img{position:absolute;top:0;left:50%;height:100%;transform:translateX(-50%);}
.liveStream_wrap .liveStream_area{position:absolute;top:0;left:0;width:100%;height:100%; background:#ddd;}

.liveStream_wrap .liveStream_area .liveStream_header{position:absolute;top:0;left:0;width:100%;height:55px;background:#fff;z-index:11;}

.liveStream_wrap .liveStream_header h1{position:absolute;top:17px;left:10px;width:50px;}
.liveStream_wrap .liveStream_header h1 img{width:100%;}
.liveStream_wrap .liveStream_header h1 span{display:block;position:absolute;top:calc(50% - 11px);left:60px;width:160px;color:#444;font-size:19px;}
.liveStream_wrap .liveStream_header .live_title{overflow:hidden;position:absolute;bottom:-37px;left:10px;width:calc(100% - 20px);color:#fff;font-size:16px;line-height:1;text-overflow:ellipsis;white-space:nowrap;}
.liveStream_wrap .liveStream_header .live_viewCount{position:absolute;bottom:-58px;left:15px;}
.liveStream_wrap .liveStream_header .live_viewCount em{color:#fff;font-size:12px;}

.liveStream_wrap .liveStream_area .btn_unmute_front{display:block;position:absolute;/*top:130px;*/top:105px;left:10px;height:45px;padding:0 15px;border:1px solid #222;border-radius:45px;background:rgba(0,0,0,0.7);z-index:11;}
.liveStream_wrap .liveStream_area .btn_unmute_front.on{display:none !important;}
.liveStream_wrap .btn_unmute_front span{color:#fff;font-size:14px;}

.liveStream_wrap .liveStream_area .utilButton_wrap{position:absolute;top:17px;right:10px;font-size:0;z-index:11;}
.liveStream_wrap .utilButton_wrap button{display:inline-block;position:relative;width:24px;height:24px;margin:0 0 0 12px;}
.liveStream_wrap .utilButton_wrap button:first-child{margin:0;}

.liveStream_wrap .utilButton_wrap button.btn_utilMute,
.liveStream_wrap .utilButton_wrap button.btn_utilUnmute{display:none;}
.liveStream_wrap .utilButton_wrap.on button.btn_utilShare{display:none;}
.liveStream_wrap .utilButton_wrap.on button.btn_utilMute,
.liveStream_wrap .utilButton_wrap.on button.btn_utilUnmute{display:inline-block;}
.liveStream_wrap .utilButton_wrap button i{display:inline-block;background:url(./img/img_live.png) no-repeat;vertical-align:middle;}
.liveStream_wrap .utilButton_wrap button.btn_utilMute i{width:24px;height:21px;background-position:0 -26px;}
.liveStream_wrap .utilButton_wrap button.btn_utilMute.isMute i{background-position:0 0;}
.liveStream_wrap .utilButton_wrap button.btn_utilShare i{width:22px;height:24px;background-position:-60px -1px;}
.liveStream_wrap .utilButton_wrap button.btn_utilLiveOut i{background:none;}
.liveStream_wrap .utilButton_wrap button.btn_utilLiveOut i:before{height:26px;}
.liveStream_wrap .utilButton_wrap button.btn_utilLiveOut i:after{width:26px;}

.liveStream_wrap .liveStream_area .player_wrap{position:absolute;top:0;left:0;width:100%;height:100%;}
.liveStream_wrap .liveStream_area .player_wrap:before{position:absolute;top:0;right:0;left:0;z-index:10;height:140px;background-image:-webkit-gradient(linear,left top,left bottom,color-stop(0,rgba(0,0,0,0.5)),to(rgba(0,0,0,0)));background-image:linear-gradient(to bottom,rgba(0,0,0,0.5) 0,rgba(0,0,0,0) 100%);content:'';}
.liveStream_wrap .liveStream_area .player_wrap:after{position:absolute;right:0;bottom:0;left:0;height:50vh;background-image:-webkit-gradient(linear,left bottom,left top,color-stop(0,rgba(0,0,0,0.2)),to(rgba(0,0,0,0)));background-image:linear-gradient(to top, rgba(0,0,0,0.2) 0, rgba(0,0,0,0) 100%);content:'';}
.liveStream_wrap .liveStream_area .player_wrap.on:before,
.liveStream_wrap .liveStream_area .player_wrap.on:after{display:none;}
.liveStream_wrap .liveStream_area .player_wrap .player{display:none;}
.liveStream_wrap .liveStream_area .player_wrap iframe{width:100%;height:100%;}
.liveStream_wrap .liveStream_area .player_wrap .player_cover{position:absolute;top:0;left:0;right:0;bottom:0;}

.liveStream_wrap .liveStream_area .btn_liveControl{display:none;position:absolute;top:50%;left:50%;width:75px;height:75px;border-radius:50%;background:#444;transform:translate(-50%,-66%);}
.liveStream_wrap .liveStream_area .btn_liveControl i{display:inline-block;width:21px;height:31px;margin:2px 0 0;background:url(./img/img_live.png) no-repeat -33px -33px;}
.liveStream_wrap .liveStream_area .btn_liveControl.isPause i{width:20px;height:27px;background-position:-33px 0;}

.liveStream_wrap .liveStream_area .liveGoods_wrap{position:absolute;bottom:55px;right:10px;width:52px;height:52px;z-index:3;}
.liveStream_wrap .liveStream_area .liveGoods_wrap.live_end{bottom:15px;}
.liveStream_wrap .liveStream_area .liveGoods_wrap.on{top:0;left:0;right:0;bottom:0;width:100%;height:100%;z-index:11;}
.liveStream_wrap .liveGoods_wrap .liveGoods_signature{display:block;position:absolute;bottom:62px;width:52px;height:52px;}
.liveStream_wrap .liveGoods_wrap .liveGoods_signature .signature_thumb{display:block;position:absolute;top:0;left:0;width:52px;height:52px;background:#ddd;}
.liveStream_wrap .liveGoods_wrap .liveGoods_signature .signature_thumb img{width:100%;}
.liveStream_wrap .liveGoods_wrap .liveGoods_signature .signature_title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0 0 2px;color:#222;font-size:14px;}
.liveStream_wrap .liveGoods_wrap .liveGoods_signature .signature_price{display:block;position:absolute;bottom:0;left:0;width:100%;padding:3px 0;background:rgba(255,255,255,0.7);color:#222;font-size:10px;font-weight:bold;line-height:1;text-align:center;}
.liveStream_wrap .liveGoods_wrap .liveGoods_signature .signature_price:after{content:'';display:none;width:1px;height:13px;margin:0 6px 0 8px;background:#ddd;vertical-align:middle;}
.liveStream_wrap .liveGoods_wrap .liveGoods_signature .signature_pv{display:inline-block;vertical-align:middle;color:#00a8e2;font-size:13px;font-weight:bold;}

.liveStream_wrap .liveGoods_wrap .btn_liveGoods_list{display:block;position:absolute;top:0;right:0;width:52px;height:52px;background:#00a8e2;color:#fff;font-size:13px;animation:blinking_bg_01 3s infinite;}
.liveStream_wrap .liveGoods_wrap .btn_liveGoods_list span{display:block;margin:3px 0 0;}
.liveStream_wrap .liveGoods_wrap .btn_liveGoods_list span:first-child{margin:0;font-weight:600;}

.liveStream_wrap .liveGoods_wrap .liveGoods_list_wrap{display:none;position:absolute;bottom:-15px;left:0;width:100%;border-bottom:1px solid #ddd;}
.liveStream_wrap .liveGoods_wrap.on .liveGoods_list_wrap{bottom:0;}
.liveStream_wrap .liveGoods_wrap .liveGoods_list_wrap .liveGoods_list_title_area{height:45px;border-bottom:1px solid #ddd;background:#fff;}
.liveStream_wrap .liveGoods_list_title_area .liveGoods_list_title{display:block;height:45px;padding:0 0 0 15px;color:#222;line-height:45px;font-size:15px;}

.liveStream_wrap .liveGoods_list_title_area .btn_liveGoods_list_close{display:block;position:absolute;top:0;right:3px;width:45px;height:45px;}
.liveStream_wrap .liveGoods_list_title_area .btn_liveGoods_list_close i{margin:3px 0 0;}

.liveStream_wrap .liveGoods_wrap .liveGoods_list_back{display:none;position:absolute;top:0;left:0;right:0;bottom:0;background:rgba(0,0,0,0.5);}
.liveStream_wrap .liveGoods_wrap.on .liveGoods_list_back{display:block;}
.liveStream_wrap .liveGoods_wrap .liveGoods_list_wrap .liveGoods_list{overflow-y:auto;height:240px;padding:7.5px 15px;background:#fff;}
.liveStream_wrap .liveGoods_list .liveGoods_item{position:relative;padding:7.5px 0;}
.liveStream_wrap .liveGoods_list .liveGoods_item .liveGoods_item_link{display:block;position:relative;width:calc(100% - 77px);height:44px;padding:8px 15px 0 62px;background:#fff;}
.liveStream_wrap .liveGoods_item .liveGoods_item_link .liveGoods_item_thumb{display:block;position:absolute;top:0;left:0;width:52px;height:52px;background:#ddd;}
.liveStream_wrap .liveGoods_item .liveGoods_item_link .liveGoods_item_thumb img{width:100%;}
.liveStream_wrap .liveGoods_item .liveGoods_item_link .liveGoods_item_title{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin:0 0 2px;color:#222;font-size:14px;}
.liveStream_wrap .liveGoods_item .liveGoods_item_link .liveGoods_item_price{display:inline-block;vertical-align:middle;color:#222;font-size:14px;font-weight:bold;}
.liveStream_wrap .liveGoods_item .liveGoods_item_link .liveGoods_item_price:after{content:'';display:inline-block;width:1px;height:13px;margin:0 6px 0 8px;background:#ddd;vertical-align:middle;}
.liveStream_wrap .liveGoods_item .liveGoods_item_link .liveGoods_item_pv{display:inline-block;vertical-align:middle;color:#00a8e2;font-size:14px;font-weight:bold;}
.liveStream_wrap .liveGoods_item .btn_liveGoods_item_fav{position:absolute;top:7px;right:0;width:30px;height:30px;}
.liveStream_wrap .liveGoods_item .btn_liveGoods_item_fav span{top:0;right:0;}

.liveStream_wrap .liveStream_area .liveChat_list{position:absolute;bottom:0;left:0;width:100%;height:41%;max-height:298px;z-index:2;}
.liveStream_wrap .liveStream_area .liveChat_list iframe{position:absolute;bottom:0;left:0;width:100%;height:100%;}

.liveStream_wrap .liveEnd_area{display:none;position:absolute;top:50%;left:50%;width:calc(100% - 30px);transform:translate(-50%,-50%);text-align:center;}
.liveStream_wrap .liveEnd_area .liveEnd_notice{display:block;color:#fff;}
.liveStream_wrap .liveEnd_area .liveEnd_notice b{display:block;font-size:19px;line-height:1.3;word-break:keep-all;}
.liveStream_wrap .liveEnd_area .liveEnd_notice span{display:block;margin:5px 0 0;font-size:16px;font-weight:normal;}
.liveStream_wrap .liveEnd_area button{display:block;height:35px;padding:0 20px;margin:20px auto 0;border-radius:35px;color:#fff;font-size:15px;}
.liveStream_wrap .liveEnd_area .btn_live_list{margin-top:10px;}

@keyframes blinking_bg_01{
    0%{background:#00a8e2;}
    50%{background: #ff5d54;}
    100%{background:#00a8e2;}
}

@media (min-width:520px){
    .liveStream_wrap .liveStream_area .player_wrap .player_cover:after{content:'';display:block;position:absolute;bottom:-43px;left:0;width:100%;height:36px;}
}

@media (min-width:420px){
    .liveStream_wrap{background:#000;}
    .liveStream_wrap .liveStream_area{overflow:hidden;left:50%;max-width:469px;transform:translateX(-50%);}
}