

.view_top {line-height:60px; background:#1f1f1f; position:fixed; width:100%; height:60px;}
.view_top a {display:inline-block; vertical-align:top;}
.view_top span {display:inline-block; vertical-align:top; padding-left:7px; font-size:13px; color:#fff; font-weight:600;} 
.btn_prev {margin-top:9px; margin-left:10px;}

#viewerNew .btn_ctrl_top .left_area{float:left; height:60px; display:inline-block; width:calc(100% - 242px);}
#viewerNew .btn_ctrl_top .left_area > a{display:flex; align-items:center; width: fit-content; max-width:100%; height:100%; overflow: hidden;}
#viewerNew .btn_ctrl_top .left_area > a > .icon_back{height:20px; margin:0 10px; float:left; display: inline-block;}
#viewerNew .btn_ctrl_top .left_area p.episode_title{display:inline-block; color:#fff; vertical-align:top; line-height:60px; width: 100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; letter-spacing:-0.3px}
#viewerNew .btn_ctrl_top .left_area p.episode_title > strong{margin-right:4px; font-weight:600}
#viewerNew .btn_ctrl_top .right_area{float:right; height:60px}
#viewerNew .btn_ctrl_top .right_area > a{display:inline-block; float:left; height:100%; width:60px; vertical-align:top; position:relative; border-left:1px solid #000}
#viewerNew .btn_ctrl_top .right_area > a > span{display:inline-block; vertical-align:top; image-rendering:-webkit-optimize-contrast;}
#viewerNew .btn_ctrl_top .right_area > a > .icon_home_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_home.png) no-repeat center center; background-size:25px;
text-indent:-9999px;}
#viewerNew .btn_ctrl_top .right_area > a > .icon_giftbox_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_giftbox.png) no-repeat center center; background-size:25px; text-indent:-9999px;}
#viewerNew .btn_ctrl_top .right_area > a > .icon_scroll_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_scroll.png) no-repeat center center; background-size:24px; text-indent:-9999px}
#viewerNew .btn_ctrl_top .right_area > a > .icon_eplist_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_list.png) no-repeat center center; background-size:25px; text-indent:-9999px}


#viewerNew .btn_ctrl_top .right_area > a > .num_gift{position:absolute; top:14px; right:9px}

@media (min-width:768px) and (max-width:1023px){
	#viewerNew .btn_ctrl_top .left_area{float:left; height:60px; display:inline-block; width:calc(100% - 242px);}
	#viewerNew .btn_ctrl_top .left_area > a{display:flex; align-items:center; width: fit-content; max-width:100%; height:100%; overflow: hidden;}
	#viewerNew .btn_ctrl_top .left_area > a > .icon_back{height:20px; margin:0 10px; float:left; display: inline-block;}
	#viewerNew .btn_ctrl_top .left_area p.episode_title{display:inline-block; color:#fff; vertical-align:top; line-height:60px; width: 100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; letter-spacing:-0.3px}
	#viewerNew .btn_ctrl_top .left_area p.episode_title > strong{margin-right:4px; font-weight:600}
	#viewerNew .btn_ctrl_top .right_area{float:right; height:60px}
	#viewerNew .btn_ctrl_top .right_area > a{display:inline-block; float:left; height:100%; width:60px; vertical-align:top; position:relative; border-left:1px solid #000}
	#viewerNew .btn_ctrl_top .right_area > a > span{display:inline-block; vertical-align:top; image-rendering:-webkit-optimize-contrast;}
	#viewerNew .btn_ctrl_top .right_area > a > .icon_home_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_home.png) no-repeat center center; background-size:25px;text-indent:-9999px;}
	#viewerNew .btn_ctrl_top .right_area > a > .icon_giftbox_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_giftbox.png) no-repeat center center; background-size:25px; text-indent:-9999px;}
	#viewerNew .btn_ctrl_top .right_area > a > .icon_scroll_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_scroll.png) no-repeat center center; background-size:24px; text-indent:-9999px}
	#viewerNew .btn_ctrl_top .right_area > a > .icon_eplist_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_list.png) no-repeat center center; background-size:25px; text-indent:-9999px}
	#viewerNew .btn_ctrl_top .right_area > a > .num_gift{position:absolute; top:14px; right:9px}
}


/* ************************************** *
 * MOBILE VER
 * ************************************** */

@media (min-width:0) and (max-width:767px){
	#viewerNew .btn_ctrl_top .left_area{float:left; height:60px; display:inline-block; width:calc(100% - 242px);}
	#viewerNew .btn_ctrl_top .left_area > a{display:flex; align-items:center; width: fit-content; max-width:100%; height:100%; overflow: hidden;}
	#viewerNew .btn_ctrl_top .left_area > a > .icon_back{height:20px; margin:0 10px; float:left; display: inline-block;}
	#viewerNew .btn_ctrl_top .left_area p.episode_title{display:inline-block; color:#fff; vertical-align:top; line-height:60px; width: 100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15px; letter-spacing:-0.3px}
	#viewerNew .btn_ctrl_top .left_area p.episode_title > strong{margin-right:4px; font-weight:600}
	#viewerNew .btn_ctrl_top .right_area{float:right; height:60px}
	#viewerNew .btn_ctrl_top .right_area > a{display:inline-block; float:left; height:100%; width:60px; vertical-align:top; position:relative; border-left:1px solid #000}
	#viewerNew .btn_ctrl_top .right_area > a > span{display:inline-block; vertical-align:top; image-rendering:-webkit-optimize-contrast;}
	#viewerNew .btn_ctrl_top .right_area > a > .icon_home_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_home.png) no-repeat center center; background-size:25px;text-indent:-9999px;}
	#viewerNew .btn_ctrl_top .right_area > a > .icon_giftbox_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_giftbox.png) no-repeat center center; background-size:25px; text-indent:-9999px;}
	#viewerNew .btn_ctrl_top .right_area > a > .icon_scroll_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_scroll.png) no-repeat center center; background-size:24px; text-indent:-9999px}
	#viewerNew .btn_ctrl_top .right_area > a > .icon_eplist_menu{width:100%; height:100%; background:url(/assets/img/icon_viewer_list.png) no-repeat center center; background-size:25px; text-indent:-9999px}
	#viewerNew .btn_ctrl_top .right_area > a > .num_gift{position:absolute; top:14px; right:9px}
}

.alert_message{width:100%; height:55px; background:#fff2cd; display:flex; align-items:center; justify-content:flex-start; padding:0 30px}
.alert_message .btn_close{position:absolute; right:8px; top:8px; color:transparent; z-index:1; cursor:pointer; display:inline-block; width:20px; height:20px;}
.alert_message .btn_close:before{content:""; position:absolute; left:50%; top:0; width:1px; height:100%; background:#333; transform:rotate(45deg);}
.alert_message .btn_close:after{content:""; position:absolute; right:45%; top:0; width:1px; height:100%; background:#333; transform:rotate(-45deg);}
.alert_message .txt{display:flex; align-items:center; font-size:15px; color:#333; flex:none;}
.alert_message .txt > a{font-weight:500; color:#2f7cd7; text-decoration:underline; background:transparent; cursor:pointer}
.alert_message .txt > .ico_ex{display:inline-block; background:#f2b028; border-radius:50px; margin-right:5px; margin-top:1px}
#viewerNew .btn_ctrl_top .right_area > a > .icon_prev{width:100%; height:100%; background:url(/assets/img/icon_viewer_prev_.png) no-repeat center center; background-size:25px; text-indent:-9999px}
#viewerNew .btn_ctrl_top .right_area > a > .icon_next{width:100%; height:100%; background:url(/assets/img/icon_viewer_next_.png) no-repeat center center; background-size:25px; text-indent:-9999px}
#viewerNew .btn_ctrl_top .right_area > a > .icon_top{width:100%; height:100%; background:url(/assets/img/icon_viewer_top_.png) no-repeat center center; background-size:25px; text-indent:-9999px}
#viewerNew .btn_ctrl_top .right_area > a > .icon_bottom{width:100%; height:100%; background:url(/assets/img/icon_viewer_bottom_.png) no-repeat center center; background-size:25px; text-indent:-9999px}
#viewerNew .btn_ctrl_bottom2{height:50px; position:fixed; bottom:0; left:0; right:0; z-index:4}
.btn_vw_floating > a.btn_area span.icon_comment{background:url(/assets/img/icon_toptop.png) no-repeat center center; background-size:24px; width:24px; height:24px;
vertical-align:top; display:block;}

#viewerNew .btn_ctrl_top .right_area > a > .icon_prev_end{width:100%; height:100%; background:url(/assets/img/icon_viewer_prev_.png) no-repeat center center; opacity: 0.3; background-size:25px; text-indent:-9999px}

#viewerNew .btn_ctrl_top .right_area > a > .icon_next_end{width:100%; height:100%; background:url(/assets/img/icon_viewer_next_.png) no-repeat center center; background-size:25px; opacity: 0.3; text-indent:-9999px}


#viewerNew .btn_ctrl_bottom {
    background: #252525;
    height: 50px;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 4
}

#viewerNew .btn_ctrl_bottom .center_area {
    width: 100%;
    max-width: 720px;
    margin: 0 auto;
    height: 100%
}

#viewerNew .btn_ctrl_bottom .center_area > a {
    line-height: 49px;
    color: #fff;
    width: 25%;
    display: inline-block;
    float: left;
    text-align: center;
    font-size: .825rem;
    letter-spacing: -0.3px
}

#viewerNew .btn_ctrl_bottom .center_area > a:first-child:nth-last-child(3),#viewerNew .btn_ctrl_bottom .center_area > a:first-child:nth-last-child(3) ~ a {
    width: 33.3333%;
}

#viewerNew .btn_ctrl_bottom .center_area > a.active {
    color: #e62a3c
}

#viewerNew .btn_ctrl_bottom .center_area > a + a {
    border-left: 1px solid #4a4a4a
}

#viewerNew .btn_ctrl_bottom .center_area > a > span {
    display: inline-block;
    vertical-align: middle
}

#viewerNew .btn_ctrl_bottom .center_area > a > .icon_top {
    background: url(/assets/img/icon_viewer_top.png) no-repeat center center;
    background-size: 15px;
    width: 15px;
    height: 15px;
    margin-right: 5px;
    margin-top: -1px
}

#viewerNew .btn_ctrl_bottom .center_area > a > .icon_prev {
    background: url(/assets/img/icon_viewer_prev.png) no-repeat center center;
    background-size: 8px;
    width: 11px;
    height: 19px;
    margin-right: 3px;
    margin-top: -2px
}

#viewerNew .btn_ctrl_bottom .center_area > a > .icon_nonstop {
    background: url(/assets/img/icon_viewer_nonstop.png) no-repeat center center;
    background-size: 18px;
    width: 18px;
    height: 18px;
    margin-right: 2px;
    margin-top: 0
}

#viewerNew .btn_ctrl_bottom .center_area > a.active > .icon_nonstop {
    background: url(/assets/img/icon_viewer_nonstop_active.png) no-repeat center center;
    background-size: 18px
}

#viewerNew .btn_ctrl_bottom .center_area > a > .icon_next {
    background: url(/assets/img/icon_viewer_next.png) no-repeat center center;
    background-size: 8px;
    width: 11px;
    height: 19px;
    margin-left: 3px;
    margin-top: -2px
}

#viewerNew .btn_ctrl_bottom .center_area > a > .icon_bottom {
    background: url(/assets/img/icon_viewer_bottom.png) no-repeat center center;
    background-size: 15px;
    width: 15px;
    height: 15px;
    margin-right: 5px;
    margin-top: 0
}

