#comics{ position:relative; width:100%; }
#comics:after { content:""; clear: both; display: block; }

#comics .comics_bg {position:absolute; width: 100%; height:430px; opacity: 0.1; -webkit-filter: blur(10px); -webkit-opacity: 0.3; -moz-filter: blur(10px); -moz-opacity: 0.3; -o-filter: blur(10px); -o-opacity: 0.3; -ms-filter: blur(10px); -ms-opacity: 0.3; z-index: -1;}

#comics .comics_contents {position:relative; width:1200px; margin: 0 auto; overflow: hidden;}
#comics .comics_contents:after { content:""; clear: both; display: block; }
#comics .comics_contents img {float:left; width: 838px; height: 430px;}

#comics .comics_contents .comics_info {background-color:rgba(0,0,0,0.6); padding:20px; width:361px; float: left; height: 430px}
#comics .comics_contents .comics_info dl {position:relative; color:#fff; height: 351px;}
#comics .comics_contents .comics_info dl dt {border-top: 2px solid #fff;  padding:20px 0;}
#comics .comics_contents .comics_info dl dt h3 {text-align: left; padding-bottom:30px; color: #fff; font-weight: 800; font-size: 28px; line-height: 35px;}
#comics .comics_contents .comics_info dl dd{font-size:15px; font-weight: bold; text-align: right; line-height: 20px;}
#comics .comics_contents .comics_info dl dd.small{border-bottom:2px solid #fff; color: #FFB74D; padding-bottom:18px;}
#comics .comics_contents .comics_info dl dd.cm_somaery{height: 66px; margin-top: 20px; padding-right:4px; line-height: 21px; font-size: 14px; text-align: left;  overflow-y: auto; font-weight: 100;}
#comics .comics_contents .comics_info dl dd.small a { color: #FFB74D; }
#comics .comics_contents .comics_info dl dd a { color: #fff; }

#comics .comics_contents .comics_info ul {position:relative; right:4px; height: 40px; text-align: right;}
#comics .comics_contents .comics_info ul li { display: inline-block; }
#comics .comics_contents .comics_info ul li#myshare{display:none;}
#comics .comics_contents .comics_info ul li.currunt button{border:3px solid #FFB74D; color: #FFB74D;}
#comics .comics_contents .comics_info ul li.first button {padding:8px 15px; font-size: 15px;}
#comics .comics_contents .comics_info ul li.cont button {padding:8px 15px; font-size: 15px;}
#comics .comics_contents .comics_info ul li button { border-radius:20px; padding:7px 8px; font-size:19px; text-align: center; border:3px solid #fff; color:#fff; height: 40px; margin-left: 10px; letter-spacing: normal; display: inline-block; }
#comics .comics_contents .comics_info ul li button:hover {border:3px solid #FFB74D; color: #FFB74D;}

#comics .comics_episode{position:relative; background-color: #fff; width:100%; z-index: 2; overflow:hidden;}
#comics .comics_episode:after { content:""; clear: both; display: block; }
#comics .comics_episode .episode_bg{width:1200px; margin: 0 auto;}
#comics .comics_episode .episode_bg:after { content:""; clear: both; display: block; }

#comics .comics_episode .episode_left {float:left; padding:30px 0; width: 840px; }

#comics .comics_episode .episode_left .list_top{ position:relative; }
#comics .comics_episode .episode_left .list_top:after { content:""; clear: both; display: block; }
#comics .comics_episode .episode_left .list_top .list_day { float: left; padding:5px 0; margin-left: 15px; font-size: 16px; }
#comics .comics_episode .episode_left .list_top .list_day span { font-weight: bold; font-size: 15px; background-color: #00BCD4; border-radius: 50%; color: #fff; padding: 3px 5px;  }
#comics .comics_episode .episode_left .list_top ul{font-size:0; float:right;}
#comics .comics_episode .episode_left .list_top ul li {color:#ddd; font-size:20px; font-weight: bold; display: inline-block; border-right:1px solid #e0e0e0; padding:0 20px;}
#comics .comics_episode .episode_left .list_top ul li:nth-child(2) {border:none;}
#comics .comics_episode .episode_left .list_top ul li a {color:#ddd;}
#comics .comics_episode .episode_left .list_top ul li a:hover, .detail_list ul li a:active {color:#00BCD4;}
#comics .comics_episode .episode_left .list_top ul li.on a {color:#00BCD4;}
#comics .comics_episode .episode_left .list_top ul li span {font-size:16px; color:#444; line-height: 21px;}

#comics .comics_episode .episode_left .all_buy { display: n1one; width: 100%; padding: 10px 15px 0 15px; position: relative; text-align: right; border-top: 1px solid #eee; }
#comics .comics_episode .episode_left .all_buy button{ background-color: #00BCD4;
    border-radius: 3px;
    color: #fff;
    font-size: 14px;
    font-weight: bold;
    padding: 10px 20px;
    border: none;
    text-align: center;
}

#comics .comics_episode .episode_left .detail_allby{ position: relative; display:none; width: 100%; padding: 10px 15px 0 15px; text-align: right; overflow:hidden;}
#comics .comics_episode .episode_left .detail_allby:after { content:""; clear: both; display: block; }

#comics .comics_episode .episode_left .d_a_chk { float: left; padding-top: 3px; }
#comics .comics_episode .episode_left .d_a_chk label.sin_allpay_btn { display: inline-block; margin:7px 20px 0 20px; font-size: 14px; vertical-align: middle; }
#comics .comics_episode .episode_left .d_a_chk .detail_chk {position: absolute; top: 18px; left: 5px; width:20px; z-index:2;}
#comics .comics_episode .episode_left .d_a_chk .detail_chk input[type="checkbox"] {visibility: hidden;}
#comics .comics_episode .episode_left .d_a_chk .detail_chk label {width: 20px; height: 20px; cursor: pointer;position: absolute; top: 0; left: 0; background:#fcfff4; background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); border-radius: 4px; box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);}
#comics .comics_episode .episode_left .d_a_chk .detail_chk label:after {
	content: '';
    width: 9px;
    height: 5px;
    position: absolute;
    top: 4px;
    left: 4px;
    border: 3px solid #00BCD4;
    border-top: none;
    border-right: none;
    background: transparent;
    opacity: 0;
    transform: rotate(-45deg);
    transition: opacity .2s;
}
#comics .comics_episode .episode_left .d_a_chk .detail_chk input[type="checkbox"]:checked + label:after {opacity: 1;}

#comics .comics_episode .episode_left .d_a_ok{ position: relative; display: inline-block; float: right;}
#comics .comics_episode .episode_left .d_a_ok button {background-color:#00BCD4; border-radius: 3px; color:#fff; font-size:14px; font-weight: bold; padding:10px 20px; border:none; text-align: center; margin-left: 5px;}

#comics .comics_episode .episode_left .d_a_cancel{ position: relative; display: inline-block; float: right;}
#comics .comics_episode .episode_left .d_a_cancel button {background-color: #9e9e9e; border-radius: 3px; color: #fff; font-size: 14px; font-weight: bold; padding: 10px 20px; border:none; text-align: center; }

#comics .comics_episode .episode_left .d_a_bonus{
	position: relative;
    float: right;
    text-align: right;
    margin-right: 10px;
    display: inline-block;
}
#comics .comics_episode .episode_left .d_a_bonus span{ font-size: 15px; }
#comics .comics_episode .episode_left .d_a_bonus span.d_a_b_1{ color: #00BCD4; font-weight: bold; }
#comics .comics_episode .episode_left .d_a_bonus span.d_a_b_2{ color: #ff9800; font-weight: bold; }

#comics .comics_episode .episode_left .episode_list{
    position: relative;
    border-top: 2px solid #4b4b4b;
    margin-top: 10px;
    overflow: hidden;
    width: 840px;
}
#comics .comics_episode .episode_left .episode_list ol li{ position: relative; padding: 10px 15px;
    display: block;
    border-bottom: 1px solid #e0e0e0;
    overflow: hidden; }
#comics .comics_episode .episode_left .episode_list ol li:hover {background-color:#f5f5f5;}
#comics .comics_episode .episode_left .episode_list ol li a{ display: block;}
#comics .comics_episode .episode_left .episode_list ol li a:after { content:""; clear: both; display: block; }


#comics .comics_episode .episode_left .episode_list ol li.allbuy_chk { background-color: #f5f5f5; }

/* checkbox in list */
#comics .comics_episode .episode_left .episode_list ol li .detail_chk_on .list_chk { display: inline-block; }
#comics .comics_episode .episode_left .episode_list ol li .detail_chk { position: relative; display: none; float: left; top: 33px; width: 40px; height: 87px; padding-top: 10px; }
/*
#comics .comics_episode .episode_left .episode_list ol li .list_chk > .detail_chk { position: absolute; top: 33px; left: 5px; width:20px; z-index:2; }
 */
#comics .comics_episode .episode_left .episode_list ol li .detail_chk input[type="checkbox"] {visibility: hidden;}
#comics .comics_episode .episode_left .episode_list ol li .detail_chk label {width: 20px; height: 20px; cursor: pointer;position: absolute; top: 0; left: 0; background:#fcfff4; background: linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); border-radius: 4px; box-shadow: inset 0px 1px 1px white, 0px 1px 3px rgba(0,0,0,0.5);}
#comics .comics_episode .episode_left .episode_list ol li .detail_chk label:after {
	content: '';
    width: 9px;
    height: 5px;
    position: absolute;
    top: 4px;
    left: 4px;
    border: 3px solid #00BCD4;
    border-top: none;
    border-right: none;
    background: transparent;
    opacity: 0;
    transform: rotate(-45deg);
    transition: opacity .2s;
}
#comics .comics_episode .episode_left .episode_list ol li .detail_chk input[type="checkbox"]:checked + label:after {opacity: 1;}
#comics .comics_episode .episode_left .episode_list ol li .detail_thumb{
	position:relative;
	display: inline-block;
	width:173px;
	height: 87px;
	display: inline-block;
	background-size:cover;
	float:left;
}

#comics .comics_episode .episode_left .episode_list ol li .text{position:absolute; top:50%; left: 50%; transform:translate(-50%, -50%); font-size:14px; font-weight: bold; color:#fff; text-shadow:1px 1px #333; text-align:center; width:100%; height: 87px; background-color: rgba(0,0,0,.6);}
#comics .comics_episode .episode_left .episode_list ol li .text span{font-size:40px;}
#comics .comics_episode .episode_left .episode_list ol li .up .icon_update{display: block;}
#comics .comics_episode .episode_left .episode_list ol li .bookmark .icon_bookmark {display: block;}
#comics .comics_episode .episode_left .episode_list ol li .icon_update {display: none; position: absolute; top: 0; left: 0; z-index:2;}
#comics .comics_episode .episode_left .episode_list ol li .icon_bookmark {display: none; position: absolute; top:0; right: -26px;}
#comics .comics_episode .episode_left .episode_list ol li .detail_num {width:120px; font-size:35px; font-weight: 800; color: #bdbdbd; vertical-align: middle; display: inline-block; line-height: 86px; text-align: center;}

#comics .comics_episode .episode_left .episode_list ol li .list_contents {display: inline-block; color: #bdbdbd; font-size: 14px; font-weight: bold; vertical-align: middle; max-width: 360px;}
#comics .comics_episode .episode_left .episode_list ol li span.detail_etc {color: #F57C00;}
#comics .comics_episode .episode_left .episode_list ol li span.detail_title {font-size:18px; color:#333; line-height: 26px; font-weight: bold;}

#comics .comics_episode .episode_left .episode_list ol li .buy{float:right; font-size: 14px;}
#comics .comics_episode .episode_left .episode_list ol li .buy button{ display:inline-block; background-color:#fff; border:1px solid #00BCD4; font-weight: bold; color: #00BCD4; width: 100px; text-align: center; padding: 10px 0; border-radius: 3px; margin-top: 24px;}
#comics .comics_episode .episode_left .episode_list ol li .buy button.event{ border-color: #ef5350; color: #ef5350; } /* 181024 */
#comics .comics_episode .episode_left .episode_list ol li:hover .buy button {background-color:#00BCD4; color: #fff;}

#comics .comics_episode .episode_left .episode_list ol li .buy span.purchased {display: inline-block; font-weight: bold; color:#D32F2F; width: 100px; text-align: center; padding: 10px 0; margin-top:24px;}
#comics .comics_episode .episode_left .episode_list ol li .buy span {display: inline-block; font-weight: bold; color: #666; width: 100px; text-align: center; padding: 10px 0;  margin-top: 24px;}
#comics .comics_episode .episode_left .episode_list ol li .buy span.event{ border-color: #ef5350; color: #ef5350; }/* 181024 */

#comics .comics_episode .episode_banner {float:right; width: 360px; padding:30px 0;}