/* CSS Document */ /* ============================= Copryright 2015 TOPCOMICS. written for - http://toptoon.com *Color Sample -basic font:#666; -strong font:#333; -red.orange font:#f54a3d; -gray line:#e1e1e1; -gray bg:#f6f6f6; ============================= */ /*reset*/ article,aside,canvas,details,figcaption,figure, footer,header,hgroup,menu,nav,section,summary{display:block;} body{margin:0px; padding:0px; background:#fff; font-size:12px; line-height:16px; letter-spacing:-1px; font-family:'맑은 고딕', 'Malgun Gothic', Dotum, AppleGothic, sans-serif; /* font-family:'나눔 고딕', 'NanumGothic', '맑은 고딕', 'Malgun Gothic', Dotum, AppleGothic, sans-serif; */} img{border:none; outline:none; vertical-align:middle;} a, a:active{outline:none; border:none;} input, select{border:1px #ccc solid; font-size:11px; color:#4d4d4d; font-family: '나눔 고딕', 'NanumGothic', '맑은 고딕', 'Malgun Gothic', Dotum, AppleGothic, sans-serif; outline:none; margin:0; vertical-align:middle;} button{outline:none; border:none; cursor:pointer; font-family: '나눔 고딕', 'NanumGothic', '맑은 고딕', 'Malgun Gothic', Dotum, AppleGothic, sans-serif;} a{text-decoration:none; color:#666;} a:hover{text-decoration:none;} table{border-collapse:collapse; padding:0; border-spacing:0;} /*common*/ .clear{clear:both;} .clearfix:after{content:"."; visibility:hidden; display:block; height:0;clear:both} .float_right{float:right;} .float_left{float:left;} .align_top{vertical-align:text-top;} .align_center{text-align:center;} .align_left{text-align:left;} .align_right{text-align:right;} .border_none{border:none;} .tc-orange{color:#f54a3d;} .blind {display:none;} .frontAboveAll {z-index: 99999999 !important;} /*버튼아이콘*/ .btn_type1{background:#f54a3d; border-radius:50px; color:#fff; font-size:11px; font-weight:bold; text-align:center; padding:1px 8px 0px; border:2px solid #f54a3d;}/*첫회보기, 최신작*/ .btn_type1:active{border:2px solid #f54a3d;} .btn_type2{background:#fff; border-radius:50px; color:#f54a3d; font-size:11px; font-weight:bold; text-align:center; padding:1px 8px 0px; border:2px solid #f54a3d;}/*정주행*/ .btn_type2:active{border:2px solid #f54a3d;} .btn_type3{width:130px; height:40px; border-radius:50px; color:#f54a3d; font-size:14px; font-weight:bold; text-align:center; border:1px solid #f54a3d; background:#fff; line-height:30px;}/*바로보기*/ .btn_type4{width:130px; height:40px; background:#f54a3d; border-radius:50px; color:#fff; font-size:14px; font-weight:bold; text-align:center; border:1px solid #f54a3d;}/*소장중*/ .btn_type5{width:130px; height:40px; background:#fff; border-radius:50px; color:#333; font-size:13px; font-weight:bold; text-align:center; border:1px solid #d1d1d1;}/*무료가입 후 보기*/ .btn_type6{background:#f54a3d; color:#fff; font-size:14px; font-weight:bold; text-align:center; padding:12px 85px;}/*알림창*/ .btn_type7{background:#262b30; color:#fff; font-size:14px; font-weight:bold; text-align:center; padding:12px 46px; margin: 4px;}/*알림창 쿠폰 btn*/ .btn_type8{background:#f54a3d; color:#fff; font-size:14px; font-weight:bold; text-align:center; padding:12px 46px;}/*알림창 해피머니 btn*/ .btn_episode_coin{width:130px; height:40px; font-size:14px; font-weight:bold; text-align:center; line-height:30px; background:url(/assets/img/www/icon_episode_coin.png) no-repeat 32px center transparent; text-indent:20px; background-size:15px;} .btn_episode_free{width:130px; height:40px; font-size:14px; font-weight:bold; text-align:center; line-height:30px; background:url(/assets/img/www/common/icon_episode_free.png) no-repeat 32px center transparent; text-indent:20px; background-size:15px;} .btn_episode_freejoinview{width:130px; height:40px; font-size:14px; font-weight:bold; text-align:center; line-height:30px; background:url(/assets/img/www/common/icon_episode_free.png) no-repeat 6px center transparent; text-indent:20px; background-size:15px;} .btn_episode_19icon{width:150px; height:40px; background:transparent; color:#333; font-size:13px; font-weight:bold; text-align:center; background:url(/assets/img/www/common/icon_episode_19.png) no-repeat 6px center transparent; text-indent:20px; background-size:15px;} .btn_episode_own{width:130px; height:40px; background:transparent; color:#f54a3d; font-size:14px; font-weight:bold; text-align:center;} .btn_episode_discountfree{width:130px; height:40px; font-size:14px; font-weight:bold; text-align:center; background:url(/assets/img/www/icon_episode_coin.png) no-repeat 5px center transparent; background-size:15px; color:#f54a3d;} .btn_episode_discountfree span.discount{text-decoration:line-through; margin-right:10px; color:#ccc;} /*에피소드 뷰어 롤오버*/ A.roll img {display:inline; border:1px #333644 solid;} A.roll img.over{display:none;border:1px #dc1f26 solid;} A.roll:hover{border:0;} A.roll:hover img{display:none;} A.roll:hover img.over{display:inline;} /*textarea:focus, input:focus {background-color:#FFF5F5; border:1px #dc1f26 solid;}*/ input, select, textarea{color:#000;} /*네비게이션*/ header{width:100%; height:120px; position:fixed; top:0; z-index:100; margin:0; padding:0; background:#fff; border-bottom:1px solid #ddd;} header ul{padding:0; margin:0;} header li{list-style:none; padding:0; margin:0;} header .gnb_warp{width:100%; height:30px; background:#333; text-align:center;} header .gnb_warp .gnb{width:1200px; height:30px; margin:auto; position:relative;} header .gnb_warp .gnb a{text-decoration:none; color:#fff;} header .gnb_warp .gnb a:hover{text-decoration:underline;} header .gnb_warp .gnb ul.left_smenu{position:absolute; top:0; left:0px; text-align:left;} header .gnb_warp .gnb ul.left_smenu li{height:30px; line-height:30px; display:inline-block;} header .gnb_warp .gnb ul.left_smenu li span.new{width:14px; height:14px; display:inline-block; background:#fd4243; font-size:10px; z-index:2; line-height:14px; margin-left:3px; border-radius:50%; color:#fff; vertical-align:middle; text-indent:2px;} header .gnb_warp .gnb ul.left_smenu li:after{content:'|'; margin:0 6px; color:#666;} header .gnb_warp .gnb ul.left_smenu li:last-child:after{content:''; margin:0;} header .gnb_warp .gnb ul.menu{width:162px; height:30px; margin:auto; text-align:center; border-right:1px solid #0f0f0f; border-left:1px solid #0f0f0f;} header .gnb_warp .gnb ul.menu li{width:80px; height:30px; line-height:30px; float:left; text-align:center;} header .gnb_warp .gnb ul.menu li.on{background:#fff; border-bottom:1px solid #fff;} header .gnb_warp .gnb ul.menu li a{display:block; text-decoration:none; font-size:13px; font-weight:bold;} header .gnb_warp .gnb ul.menu li.on a{color:#f54a3d;} header .gnb_warp .gnb ul.right_smenu{position:absolute; top:0; right:0px; text-align:right;} header .gnb_warp .gnb ul.right_smenu li{height:28px; line-height:29px; display:inline-block; position:relative;} header .gnb_warp .gnb ul.right_smenu li:after{content:'|'; margin:0 6px; color:#666;} header .gnb_warp .gnb ul.right_smenu li:last-child:after, header .gnb_warp .gnb ul.right_smenu li:first-child:after{} header .gnb_warp .gnb ul.right_smenu .switch_adult_on{width:43px; height:20px; display:inline-block; background:url(/assets/img/www/switch_adult.png) no-repeat; background-size:42px 39px; background-position:0 0; position:absolute; top:5px; right:8px; cursor:pointer;} header .gnb_warp .gnb ul.right_smenu .switch_adult_off{width:43px; height:20px; display:inline-block; background:url(/assets/img/www/switch_adult.png) no-repeat; background-size:42px 39px; background-position:0 -19px; position:absolute; top:5px; right:8px; cursor:pointer;} /*완전판/전연령/성인 구분 버튼 추가*/ header .gnb_warp .gnb ul.mode_list{width:270px; height:28px; line-height:28px; position:absolute; top:0; left:50%; margin-left:-135px; border-left:1px solid #000;} header .gnb_warp .gnb ul.mode_list li{width:88px; border-left:1px solid #373737; border-right:1px solid #000; float:left; background:#222; border-bottom:2px solid; font-size:14px;} header .gnb_warp .gnb ul.mode_list li a{display:block;} header .gnb_warp .gnb ul.mode_list li a:hover{text-decoration:none;} header .gnb_warp .gnb ul.mode_list li.active{background:#191818; border-bottom-color:#eb0009; box-shadow:inset 0px 2px 5px #000; border-left-color:#000;} header .gnb_warp .gnb ul.mode_list li.active a{color:#fd4243; font-weight:bold;} header .gnb_warp .gnb ul.mode_list li span.icon_on{width:18px; height:18px; background:url(/assets/img/www/common/btn_mode_icon_on.png); display:none;} header .gnb_warp .gnb ul.mode_list li.active span.icon_on{display:inline-block; vertical-align:middle; margin:0 5px 0 0;} /* kypark */ header .gnb_warp .gnb ul.right_smenu #smenu_myinfo li.list_menu a {color:#000; letter-spacing:0;} /*내정보*/ header .gnb_warp .gnb #my_info{position:absolute; border:1px #e1e1e1 solid; list-style:none; z-index:5; background:#fff; top:30px; right:100px; text-align:left; font-size:12px; display:none;} header .gnb_warp .gnb #my_info li{width:200px; height:40px; line-height:40px; border-bottom:1px solid #e1e1e1; padding:0 10px;} header .gnb_warp .gnb #my_info li a{color:#333; font-size:12px;} header .gnb_warp .gnb #my_info li .right{float:right;} header .gnb_warp .gnb #my_info li .number{color:#f54a3d;} header .gnb_warp .gnb #my_info li.list_menu{background-color:#FFFFFF;} header .gnb_warp .gnb #my_info li:last-child{border-bottom:0;} header .gnb_warp .gnb #my_info li a{display:block;} header .gnb_warp .gnb #my_info li a:hover{color:#f54a3d; text-decoration: none;} header .gnb_warp .gnb ul.right_smenu li.message {display:inline-block; width:20px; background:url(/assets/img/icon_messeage.png) no-repeat 0 9px; cursor:pointer;} header .gnb_warp .gnb ul.right_smenu li.message:after{color:#333;} header .gnb_warp .gnb ul.right_smenu li.message a{display:block; width:20px; height:30px; position:absolute;} header .gnb_warp .gnb ul.right_smenu span.message_ea{position:absolute; top:6px; width: 14px; height: 14px; left:10px; font-size: 10px; color: #fff; background: #f54a3d; line-height: 14px; border-radius: 50%; text-align: center;} /*LNB*/ header .lnb{width:1200px; height:90px; margin:auto; position:relative;} header .lnb a.logo{width:160px; height:90px; display:inline-block; background:url(/assets/img/www/index_renewal/logo_toptoon.png) no-repeat left center; position:absolute; z-index:3;} header .lnb a.logo_815{width:287px; height:90px; display:inline-block; background:url(/assets/img/www/index_renewal/logo_toptoon3.png) no-repeat left center; position:absolute; z-index:3;} header .lnb ul.lnb_menu{width:auto; height:90px; text-align:center; position:absolute; left:238px;} header .lnb ul.lnb_menu li{display:inline-block; line-height:90px; padding:0 15px; position:relative;} header .lnb ul.lnb_menu li a{font-size:18px; font-weight:bold; letter-spacing:-1px; color:#333; position:relative;} header .lnb ul.lnb_menu li a:hover, header .lnb ul.lnb_menu li.on a, header .lnb ul.lnb_right_menu li a:hover{color:#f54a3d;} header .lnb ul.lnb_menu li span.dayfree{width:40px; height:17px; line-height:17px; background:#f54a3d; color:#fff; text-align:center; position:absolute; top:18px; right:0; font-size:11px; border-radius:40px; font-weight:bold; letter-spacing:-1px;} header .lnb ul.lnb_menu li span.construction{width:40px; height:17px; line-height:17px; background:#f54a3d; color:#fff; text-align:center; position:absolute; top:18px; right:0; font-size:11px; border-radius:40px; font-weight:bold; letter-spacing:-1px;} header .lnb ul.lnb_menu li span.crown{display:block; width:16px; height:12px; position:absolute; top:-10px; right:2px; background:url(/assets/img/www/icon_crown.png) no-repeat;} header .lnb ul.lnb_menu li span.adult{ font-size: 11px; border: 2px solid #f54a3d; border-radius: 24px; display: inline-block; position: relative; top: 38px; margin:0; margin-right: 2px; width: 16px; height: 16px; text-align: center; line-height: 16px; float: left; color:#333 !important; } header .lnb ul.lnb_right_menu{height:90px; position:absolute; right:0; z-index:3;} header .lnb ul.lnb_right_menu li{float:left; line-height:90px; font-size:13px; font-weight:bold; padding-left:10px;} header .lnb ul.lnb_right_menu li a{color:#333;} /*검색*/ .search{width:130px; height:30px; position:absolute; top:30px; right:160px; padding-left:10px; border-radius:20px; border:1px solid #ddd} .search .box #comic_search{width:125px; height:28px; line-height:28px; background:url(/assets/img/www/index_renewal/icon_search_on.png) 100px 5px no-repeat; background-size:20px; color:#333; border-radius:20px; border:0;} /*.search .box #comic_search{width:100px; height:28px; line-height:28px; position:absolute; top:0; left:0; background:#fff; border-radius:20px; border:0; margin-left:8px;color:#333;}*/ /* .search .box #comic_search:focus{background:url(/assets/img/www/index_renewal/icon_search_on.png) 100px 5px no-repeat #fff; background-size:20px;}*/ .search .autobox #search_result_comic, .search .autobox #search_result_author{padding:0px; margin:0px;} /*검색결과*/ .search .autobox{width:320px; background:#fff; z-index:10; position:absolute; top:30px; left:0; border-left:1px solid #dfdfdf; border-right:1px solid #dfdfdf; padding:0;} .search .autobox h1.ser_tit { border-top: 1px solid #EFEFEF; margin: 0; font-size: 1.3em; height: 35px; line-height: 35px; background: #F9F9F9; } .search .autobox h1.ser_tit a { color: #333; padding-left: 12px;} .search .autobox ul li{width:300px; height:85px; list-style:none; border-bottom:1px #dfdfdf solid; cursor:pointer;} .search .autobox ul li:first-child{border-top:1px solid #dfdfdf;} .search .autobox ul li.active{background-color:#f6f6f6; overflow:hidden;} .search .autobox .img{width:110px; height:65px; border:1px #dfdfdf solid; float:left; padding:0; margin:10px 8px 0 0;} .search .autobox .text{width:180px; height:65px; margin:10px 0 0 0; padding:0; line-height:12px; font-size:12px; font-weight:normal; float:left; vertical-align:text-top; color:#666;} .search .autobox span{width:180px; font-size:14px; font-weight:bold; color:#e41800; display:block; padding:0 0 5px 0; line-height:18px;} /*검색결과 RENEWAL - theRok */ .search_renewal .autobox h1.ser_tit { border-top: 1px solid #EFEFEF; margin: 0; font-size: 1.3em; height: 35px; line-height: 35px; background: #F9F9F9; } .search_renewal .autobox h1.ser_tit a { color: #333; padding-left: 12px;} .search_renewal .autobox ul li{width:300px; height:85px; list-style:none; border-bottom:1px #dfdfdf solid; cursor:pointer;background-color:#fff;} .search_renewal .autobox ul li:first-child{border-top:1px solid #dfdfdf;} .search_renewal .autobox ul li.active{background-color:#f6f6f6; overflow:hidden;} .search_renewal .autobox .img{width:110px; height:65px; border:1px #dfdfdf solid; float:left; padding:0; margin:10px 8px 0 0;} .search_renewal .autobox .text{width:180px; height:65px; margin:10px 0 0 0; padding:0; line-height:12px; font-size:12px; font-weight:normal; float:left; vertical-align:text-top; color:#666;} .search_renewal .autobox span{width:180px; font-size:14px; font-weight:bold; color:#e41800; display:block; padding:0 0 5px 0; line-height:18px;} /*블로그 공지*/ ul.rss_notice{width:450px; height:30px; overflow:hidden; background:url(/assets/img/www/index_renewal/icon_news.jpg) no-repeat left center; padding:0; margin:0; margin-bottom:5px !important;} ul.rss_notice li{float:none; line-height:30px; text-indent:20px; list-style:none; padding:0; margin:0;width:100%} ul.rss_notice li a{display:block; color:#666; text-decoration:none;} ul.rss_notice li a:hover{text-decoration:underline;} /*요일별웹툰(열흘만화-오늘) 요일탭*/ .index_new{width:1200px; margin:0px auto 0; position:relative;} .index_new p{padding:0; margin:0;} .index_new ul{margin:0; padding:0;} .index_new ul li{margin:0; padding:0; list-style:none; float:left;} header ul.week_menu, .index_new ul.week_menu{width:100%; height:40px; background:url(/assets/img/www/index_renewal/bg_tab_new.gif) repeat-x 0 100%;} header ul.week_menu li, .index_new ul.week_menu li{width:152px; float:left; background:#f9f9f9;} .index_new ul.week_menu li:first-child{width:136px;} header ul.week_menu li a, .index_new ul.week_menu li a{display:block; position:relative; margin-left:-1px; padding:9px 0; border:1px solid #c4c4c4; border-bottom:0 none; font-size:13px; line-height:19px; color:#747474; text-align:center; text-decoration:none; list-style:none; cursor:pointer;} header ul.genre_menu li, .index_new ul.genre_menu li{width:205px; float:left; background:#f9f9f9;} .index_new ul.genre_menu li.li9{width:128px; float:left; background:#f9f9f9;} .index_new ul.genre_menu li.li10{width:114px; float:left; background:#f9f9f9;} .index_new ul.genre_menu li.li11{width:102px; float:left; background:#f9f9f9;} .index_new ul.genre_menu li:first-child{width:174px;} .index_new ul.genre_menu li.li11:first-child{width:179px;} header ul.ranking_menu li, .index_new ul.ranking_menu li{width:171px; float:left; background:#f9f9f9;} .index_new ul.ranking_menu li.li9{width:128px; float:left; background:#f9f9f9;} .index_new ul.ranking_menu li:first-child{width:174px;} .index_new ul.ranking_menu li.li10{width:171px; float:left; background:#f9f9f9;} .index_new ul.ranking_menu li.li10:first-child{width:174px; float:left; background:#f9f9f9;} .index_new ul.ranking_menu li.li11{width:109px; float:left; background:#f9f9f9;} .index_new ul.ranking_menu li.li11:first-child{width:110px; float:left; background:#f9f9f9;} header ul.fixcharge_genre_menu li, .index_new ul.fixcharge_genre_menu li{width:171px; float:left; background:#f9f9f9;} .index_new ul.fixcharge_genre_menu li:first-child{width:174px;} header ul.menu3ea li, .index_new ul.menu3ea li{width:400px; float:left; background:#f9f9f9;} .index_new ul.menu3ea li:first-child{width:400px;} header ul.week_menu li.on a, .index_new ul.week_menu li.on a{z-index:9; margin-bottom:-1px;padding:9px 0 10px; border-width:2px; border-color:#6d9add; background:#fff; font-weight:bold; font-size:14px; color:#fff; background: #6d9add;} header ul.week_menu{display:none;margin:0px auto;} header ul.week_menu.on{display:block;} ul.week_menu li a span.today_on{position:absolute; top:-12px; left:50%; display:block; width:30px; height:20px; background:#f54a3d; color:#fff; font-size: 11px; margin-left:-15px; border-radius:15px;} .today_on{position:absolute; top:-12px; text-align:center; padding-top:2px; display:block; width:30px; height:20px; background:#f54a3d; color:#fff; font-size: 11px; margin-left:-15px; border-radius:15px; z-index:11;} .today_on.mon {left:85px;} /* 180308 수정 */ .today_on.tue {left:255px;} /* 180308 수정 */ .today_on.wed {left:425px;} /* 180308 수정 */ .today_on.thu {left:596px;} /* 180308 수정 */ .today_on.fri {left:765px;} /* 180308 수정 */ .today_on.sat {left:935px;} /* 180308 수정 */ .today_on.sun {left:1106px;} /* 180308 수정 */ ul.week_menu li a span.week_up{width:20px; height:20px; display:block; border-radius:30px; color:#fff; background:#f54a3d; position:absolute; top:-13px; left:50%; line-height:20px; font-size:10px; font-family:tahoma, arial, sans-serif; text-transform:uppercase;} /* 장르별 정렬 메뉴 */ header ul.sort_menu,.index_new ul.sort_menu{width:1200px; height:30px; margin:-18px auto 20px;background: #fff} header ul.sort_menu li,.index_new ul.sort_menu li{width:25%; height:30px; line-height:30px; text-align:center;float:left;position: relative;} header ul.sort_menu li a,.index_new ul.sort_menu li a{color:#333; font-weight:bold;position: relative;} header ul.sort_menu li.on a, header ul.sort_menu li:hover a, .index_new ul.sort_menu li:hover a, .index_new ul.sort_menu li.on a{color: #f54a3d;} header ul.sort_menu li.on a:after, header ul.sort_menu li:hover a:after, .index_new ul.sort_menu li.on a:after, .index_new ul.sort_menu li:hover a:after{ content: ''; border-bottom: 2px solid #f54a3d; position: absolute; width: 130%; bottom: -4px; left: -15%; } header ul.sort_menu{margin:0px auto;display:none} header ul.sort_menu.on{display:block} .index_new ul.thumb li:hover .thumb_img:after{opacity:1;} .index_new ul.thumb li .thumb_img img{width:auto; height:137px; position:absolute; top:0px; left:-5px; /* -webkit-transform: translate3d(0,0,0); transform: translate3d(0,0,0); -webkit-transform: rotate(.000001deg); transition : all .5s */ } /* .index_new ul.thumb li .thumb_img:hover img{ -webkit-transform: scale(1.1); transform: scale(1.1); opacity : 1; } */ /*큰 썸네일 리스트*/ .index_new ul.thumb{width:1200px;} .index_new ul.thumb li{border:2px solid #ebebeb; width:221px; height:236px; margin:0 0 20px 18px; position:relative;} .index_new ul.thumb li.first{margin-left:0; margin-right:2px;} .index_new ul.thumb li a{display:block;position: relative;} .index_new ul.thumb li .thumb_img{width:100%; height:137px; overflow:hidden; position:relative;} .index_new ul.thumb li .thumb_img:after{content: '';display:block; width: 100%;height: 137px; background: rgba(0,0,0,.66); position: absolute;top: 0;left: 0;opacity: 0;transition:all .2s;z-index: 3;} .index_new ul.thumb li:hover .thumb_img:after{opacity:1;} .index_new ul.thumb li .thumb_img img{width:auto; height:137px; position:absolute; top:0px; left:-5px; } .index_new ul.thumb li .thumb_info{font-size:12px; line-height:16px; color:#666; padding:10px 10px 15px; position:relative; background: #fff; text-overflow:ellipsis; white-space:nowrap; overflow:hidden;} .index_new ul.thumb li .thumb_info p.title{width:165px; font-size:16px; font-weight:bold; color:#333; padding-bottom:5px; line-height:17px; overflow: hidden; text-overflow: ellipsis; white-space:nowrap;} .index_new ul.thumb li .thumb_info p.icon{position:absolute; top:8px; right:10px;} .index_new ul.thumb li .thumb_info p.writer{color:#999; padding-top:20px; font-size:11px;} .index_new ul.thumb li .thumb_info > .starpoint {position: absolute; bottom: 12px; float: right;} .index_new ul.thumb li .thumb_info > .starpoint > .starpointwrap{background-color:#fff; color:#A1A1A1;font-weight:600; float: right; } .index_new ul.thumb li .thumb_info > .starpoint > .starpointwrap > img{ background-color:#fff; width: 17px; padding-right: 2px;} .index_new ul.thumb li .thumb_info > .starpoint .review {background-color:#fff; color:#A1A1A1;font-weight:600; float:left;} .index_new ul.thumb li .thumb_info > .starpoint .review > img{ background-color:#fff; width: 14px; padding-right: 3px; } .index_new ul.thumb li .thumb_info_limit{width:200px; height:40px; font-size:12px; line-height:16px; color:#666; padding:10px 10px 15px; position:relative; background: #fff} .index_new ul.thumb li .thumb_info_limit p.title{width:165px; font-size:16px; font-weight:bold; color:#333; padding-bottom:5px; line-height:16px; overflow: hidden; text-overflow: ellipsis; white-space:nowrap;} .index_new ul.thumb li .thumb_info_limit p.icon{position:absolute; top:8px; right:10px;} .index_new ul.thumb li .thumb_info_limit p.writer{color:#999; padding-top:10px; font-size:11px;} .index_new ul.thumb li .thumb_info_limit > .starpoint {position: absolute; bottom: 12px; left: 92px;} .index_new ul.thumb li .thumb_info_limit > .starpoint > .starpointwrap{background-color:#fff; color:#A1A1A1;font-weight:600; float: right; } .index_new ul.thumb li .thumb_info_limit > .starpoint > .starpointwrap > img{ background-color:#fff; width: 17px; padding-right: 2px;} .index_new ul.thumb li .thumb_info_limit > .starpoint .review {background-color:#fff; color:#A1A1A1;font-weight:600; float:left;} .index_new ul.thumb li .thumb_info_limit > .starpoint .review > img{ background-color:#fff; width: 14px; padding-right: 3px; } .thumb_info .ep_count{float:left; width:160px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .thumb_info .ep_point{float:right;margin-right:1px;} .thumb_info .ep_point span.epicon_starpoint{width:10px; height:10px; background:url(/assets/img/www/main/renewal1711_icon_star.png) no-repeat center; display:inline-block;} .index_new ul.thumb li .thumb_desc{position: absolute;top: 0;left: 0;color: #fff;margin: 32px 16px;display:none;height:82px;overflow:hidden;text-overflow: ellipsis;-webkit-line-clamp: 5;-webkit-box-orient: vertical;z-index: 4;} .index_new ul.thumb li:hover .thumb_desc{display: -webkit-box; display:block;} /*댓글아이콘 추가 150919_jy*/ .index_new ul.thumb .thumb_info .community{position:absolute; bottom:8px; right:10px;} .index_new ul.thumb .thumb_info .community span{display:block; float:right; text-align:right;} .index_new ul.thumb .thumb_info .community span.community_view{margin-left:10px;} .index_new ul.thumb .icon_community{position:absolute; top:70px; right:5px; background:rgba(0,0,0,0.8); color:#fff; width:40px; height:40px; border-radius:50%; z-index:2; font-size:10px; text-align:center; background:url(/assets/img/www/icon_community.png);} /*작은 썸네일 리스트*/ .index_new ul.mini_thumb{width:1200px; margin-top:20px;} .index_new ul.mini_thumb li{width:120px; position:relative; margin:0 0 30px 34px;} .index_new ul.mini_thumb li.first{margin:0 2px 0 0;} .index_new ul.mini_thumb li a{display:block;position: relative;} .index_new ul.mini_thumb li a .mini_thumb_wrap{} .index_new ul.mini_thumb li a .mini_thumb_wrap:after{content: '';display:block;width: 100%;height: 145px; background: rgba(0,0,0,.66); /* background: -moz-linear-gradient(top, rgba(0,0,0,0.33) 0%, rgba(0,0,0,0.66) 50%, rgba(0,0,0,0.33) 100%); background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.33)), color-stop(50%,rgba(0,0,0,0.66)), color-stop(100%,rgba(0,0,0,0.33))); background: -webkit-linear-gradient(top, rgba(0,0,0,0.33) 0%,rgba(0,0,0,0.66) 50%,rgba(0,0,0,0.33) 100%); background: -o-linear-gradient(top, rgba(0,0,0,0.33) 0%,rgba(0,0,0,0.66) 50%,rgba(0,0,0,0.33) 100%); background: -ms-linear-gradient(top, rgba(0,0,0,0.33) 0%,rgba(0,0,0,0.66) 50%,rgba(0,0,0,0.33) 100%); background: linear-gradient(to bottom, rgba(0,0,0,0.33) 0%,rgba(0,0,0,0.66) 50%,rgba(0,0,0,0.33) 100%); */ position: absolute;top: 0;left: 0;opacity: 0;transition:all .2s} .index_new ul.mini_thumb li a:hover .mini_thumb_wrap:after{opacity:1;} .index_new ul.mini_thumb li a .mini_thumb_desc{position: absolute;top: 0;left: 0;color: #fff;margin: 32px 16px;display:none;height:82px;overflow:hidden;text-overflow: ellipsis;-webkit-line-clamp: 5;-webkit-box-orient: vertical;} .index_new ul.mini_thumb li a:hover .mini_thumb_desc{display: -webkit-box;} /* .index_new ul.mini_thumb li a img:after{display:block;content:'';width:100%;height:100;} */ /* .index_new ul.mini_thumb li a:hover img{opacity:.7;} */ .index_new ul.mini_thumb li a img{width:120px; height:145px;} .index_new ul.mini_thumb .mini_thumb_info{width:120px; height:43px; position:relative;} .index_new ul.mini_thumb .mini_thumb_info p.title{width:85px; font-weight:bold; font-size:14px; color:#333; padding:10px 0 5px; overflow: hidden; text-overflow: ellipsis; white-space:nowrap;} .index_new ul.mini_thumb .mini_thumb_info p.icon{position:absolute; top:10px; right:0;} .index_new ul.mini_thumb .mini_thumb_info p.writer{color:#999;} /*부분리뉴얼 - 메인배너 */ .bnr_new_wrap{width:100%; height:270px; position:absolute;left:0;transition:all .5s;margin-top:120px; top:0;} .bnr_new_wrap:after{width:100%; height:270px; background:url(/assets/img/www/index_renewal/bnr_ptnover.png) repeat-x; position:absolute; top:0; left:0;content:"";pointer-events:none;transition:all .5s;} .bnr_new_wrap:hover:after{background:rgba(255,255,255,.05);} .bnr_new_wrap .main_bnr_new{width:1200px; margin:0 auto;padding:0; position:relative;} .bnr_new_wrap .main_bnr_new .main_bnr_img{padding:0;} .bnr_new_wrap .main_bnr_new .main_bnr_img li{margin:0; padding:0; list-style:none;display:none;} .bnr_new_wrap .main_bnr_new .main_bnr_img li img{display:block;height:270px} .bnr_new_wrap .main_bnr_new .bnr_info{width:500px; height:224px; overflow:hidden; position:absolute; z-index:3; top:0px; left:0px;pointer-events:none;padding-left:32px; font-weight:bold; -webkit-transform:rotate(.000001deg);-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0);text-shadow: 0px 0px 8px rgba(255,255,255,.97);} .bnr_new_wrap .main_bnr_new .bnr_info.white{text-shadow: 0px 0px 8px rgba(0,0,0,.97);} .bnr_new_wrap .main_bnr_new .bnr_info p{padding:0; margin:0;} .bnr_new_wrap .main_bnr_new .bnr_info p.category{color:#f54a3d; font-size:18px; line-height:18px; padding:30px 0 8px 0; letter-spacing:-1px; font-weight:bold;} .bnr_new_wrap .main_bnr_new .bnr_info p.title{font-size:48px; line-height:48px; letter-spacing:-4px;color:#333; padding-bottom:8px; font-weight:bold; text-indent:-1px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .bnr_new_wrap .main_bnr_new .bnr_info p.synop{color:#333; font-size:18px; line-height:22px; padding-bottom:18px; font-weight:bold; letter-spacing:-1px; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } .bnr_new_wrap .main_bnr_new .bnr_info p.writer{font-size:14px; color:#666;} .bnr_new_wrap .main_bnr_new .bnr_info.white p.title{color:#fff;} .bnr_new_wrap .main_bnr_new .bnr_info.white p.synop{color:#fff;} .bnr_new_wrap .main_bnr_new .bnr_info.white p.writer{color:#eee;} .bnr_new_wrap_dummy{padding-top:400px; top:0;} #sliderFrame,#sliderFrame div{box-sizing:content-box} #sliderFrame{position:relative;margin:0 auto;width:1200px;height:270px} #slider,#slider div.sliderInner{width:1200px;height:270px} #slider{position:relative;margin:0 auto;transform:translate3d(0,0,0)} #slider div.navBulletsWrapper{width:340px;height:12px;position:absolute;bottom:20px;left:32px;z-index:4;padding:0;margin:0;list-style-type:none} #slider div.navBulletsWrapper div{width:12px;height:12px;display:inline-block;margin-right:5px;background:#ccc;cursor:pointer;border-radius:50px;float:left;text-indent:-9999;color:transparent;transition:all .5s} #slider div.navBulletsWrapper div.active{width:45px;background:#f54a3d} #slider a>b,#slider img,#slider>b{position:absolute;border:none;} #slider div.sliderInner{overflow:hidden;-webkit-transform:rotate(.000001deg);position:absolute;top:0;left:0;cursor:pointer}#slider div{-webkit-transform:translate3d(0,0,0);transform:translate3d(0,0,0)} /*앱설치*/ .index_footer_bnr_wrap{width:100%; height:380px; background:#fff; display:block; border-top:1px solid #ddd; text-align:center; } .index_footer_bnr_wrap .index_footer_bnr{width:1200px; height:380px; margin:auto; background:url(/assets/img/www/index_renewal/bnr_app.png) repeat; position:relative;} .index_footer_bnr_wrap .index_footer_bnr p.title{font-size:56px; font-weight:bold; position:absolute; top:45px; left:69px; letter-spacing:-7px; line-height:56px; color:#333;} .index_footer_bnr_wrap .index_footer_bnr p.text{font-size:24px; font-weight:bold; position:absolute; top:45px; left:73px; letter-spacing:-2px; line-height:24px;} .index_footer_bnr_wrap .index_footer_bnr p.text2{font-size:18px; font-weight:bold; position:absolute; top:160px; left:73px; letter-spacing:-1px; line-height:24px;} .index_footer_bnr_wrap .index_footer_bnr p.text3{font-size:18px; font-weight:bold; position:absolute; top:190px; left:73px; letter-spacing:-1px; line-height:20px; font-weight:normal; font-size:14px;} .index_footer_bnr_wrap .index_footer_bnr span{color:#dc1f26;} /*풋터*/ .footer_wrap{width:100%; min-width:1200px; background-color:#262626; background-repeat:repeat;} .footer_wrap .footer{width:1200px; height:180px; background:#262626; margin:auto; padding:30px 0 60px; color:#999;} .footer_wrap .footer a{color:#dbdbdb; text-decoration:none;} .footer_wrap .footer a:hover{text-decoration:underline;} .footer_wrap .footer table td{vertical-align:text-top; line-height:18px;} .footer_wrap .footer a.companylogo{width:120px; height:55px; display:block; float:left; background:url(/assets/img/common/logo_topco.png) no-repeat; margin-right:70px;} .footer_wrap .footer ul.footer_menu{width:640px; height:40px; margin:0; padding:0; float:left;} .footer_wrap .footer ul.footer_menu li{list-style:none; display:inline-block; margin:0; padding:0 0 15px 0; font-size:13px; font-weight:bold; line-height:13px;} .footer_wrap .footer ul.footer_menu li:after{content:"l"; margin:0 10px;} .footer_wrap .footer ul.footer_menu li:last-child:after{content:" ";} .footer_wrap .footer .copyright{width:720px; float:left;} .footer_wrap .footer ul.footer_snsmenu{float:right; text-align:right; width:240px; height:40px; margin:0; padding:0;} .footer_wrap .footer ul.footer_snsmenu li{width:40px; height:40px; list-style:none; display:block; text-align:right; float:left; margin-right:10px;} /*서브페이지 공용*/ .sub_type1{width:1200px; margin:15px auto 0;} .sub_type2{width:100%; text-align:center; margin:120px auto 0; position:relative;} /*회차리스트*/ .episode_bnr{width:1200px; height:270px; margin:0 auto; position:relative;} .episode_bnr img{width:auto; height:270px; z-index:-1;} .episode_bnr .bnr_info{width:400px; height:270px; z-index:3; position:absolute; top:0; right:0; text-align:left;} .episode_bnr .bnr_info_bg{width:100%; height:270px; z-index:1; position:absolute; top:0; left:200px; text-align:left; background:url(/assets/img/www/episode_bnr_gradation.png) no-repeat right center; opacity:0.7;} .episode_bnr .bnr_info p{padding:0; margin:0;} .episode_bnr .bnr_info p.category{color:#fff; font-size:12px; line-height:14px; padding:35px 0 3px 0;} .episode_bnr .bnr_info p.category span.ra_genre{border-radius:3px; color:#fff; background:#f54a3d; width:36px; height:18px; line-height:18px; text-align:center; margin-right:5px; display:inline-block; font-weight:normal; font-size:10px;} .episode_bnr .bnr_info .title{font-size:36px; line-height:42px; letter-spacing:-4px; color:#fff; margin-bottom:12px; font-weight:bold; text-indent:-1px; color:#fff; overflow: hidden; text-overflow: ellipsis; white-space:nowrap;} .episode_bnr .bnr_info p.synop{color:#fff; font-size:14px; line-height:20px; margin-bottom:20px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical;overflow:hidden; text-overflow:ellipsis; height:60px; width:100%;} /* .episode_bnr .bnr_info p.writer{font-size:12px;} */ .episode_bnr .bnr_info p.writer{font-size:12px; height:18px; margin-bottom:3px; position:absolute; bottom:77px} /*190218수정*/ .episode_bnr .bnr_info p.writer a{font-size:12px; color:#acfff6;} .episode_bnr .bnr_info .btn_area{width:100%; z-index:3; position:absolute; bottom:40px}/*190218수정*/ .episode_bnr .bnr_info .btn_area a{display:inline-block; border-radius:3px; color:#fff; padding:0 15px; height:28px; line-height:28px; text-align:center; cursor:pointer; min-width:90px;} .episode_bnr .bnr_info .btn_area a span{/* vertical-align:middle; *//* margin-right:5px; */display:inline-block;} .episode_bnr .bnr_info .btn_area .bubblebox{border:2px solid #000; width:120px; height:32px; padding:10px; background:#fff; border-radius:5px; position:absolute; top:35px; left:112px; line-height:16px; letter-spacing:0; font-size:12px;} .episode_bnr .bnr_info .btn_area .bubblebox a.close_bubble{display:block; width:18px; height:18px; position:absolute; top:5px; right:5px; background:url(/assets/img/www/common/bubble_close.png) no-repeat; padding:0; margin:0; min-width:18px;} .episode_bnr .bnr_info .btn_area .bubblebox span.triangle{width:9px; height:7px; background:url(/assets/img/www/common/bubble_triangle2.png) no-repeat; display:block; position:absolute; bottom:52px; left:50%; margin-left:-4px;} .episode_list{width:100%; border:none; padding:0; border-collapse:collapse; border-spacing:0; margin-bottom:30px;} /*.episode_list th{height:34px; line-height:34px; background:#333; color:#fff;} .episode_list th.pub_week{text-align:left; text-indent:5px; font-weight:normal; font-size:13px;} .episode_list th.pub_week span{color:#f54a3d; font-weight:bold;}*/ .episode_list th{height:34px; line-height:34px; background:#f6f6f6; color:#000; border-top:1px solid #ddd; border-bottom:1px solid #ddd; position:relative;font-size: 12px;} .episode_list th.pub_week{text-align:left; text-indent:5px; font-weight:normal; font-size:13px;} .episode_list th.pub_week span{color:#f54a3d; font-weight:bold;} .episode_list th.pub_notice{text-align:left; text-indent:5px; font-weight:normal; font-size:13px;} .episode_list th.pub_notice .icon_notice{display:inline-block; margin-right:5px;} .episode_list th.pub_notice .point{color:#ef3f3b;} .episode_list th.pub_notice span{font-weight:bold; vertical-align: middle;} .episode_list th.eplist_order{text-align:right; padding-right:9px;} /* .episode_list td{border-bottom:1px solid #e1e1e1;} */ .episode_list tr.visited{cursor:pointer; background-color:#ebebeb;} .episode_list tr:hover{cursor:pointer; background-color:#efefef;} .episode_list td{border-bottom:1px #dedede solid; height:48px; line-height:48px;} .episode_list .toon_title{font-size:14px; font-weight:bold; padding-left:20px;} .episode_list .toon_date{font-size:11px; text-align:center;} .episode_list a.btn_list_type{border-radius:5px; padding:0 15px; height:28px; line-height:26px; display:block; float:right;} a.epbtn_bookmark{background:#161616;} a.epbtn_bookmark span.icon_heart{width:14px; height:12px; background:url(/assets/img/www/eplist/bookmark_heart.png) no-repeat center center;} a.epbtn_red{background: #e63640;color: #fff;margin-right: 10px;} a.epbtn_bookmark.active span.icon_heart{background-image:url(/assets/img/www/eplist/bookmark_heart_on.png);} a.opinion_link{background-color:#161616;} a.opinion_link span.icon_mail{width:18px; height:12px; background:url(/assets/img/www/eplist/icon_opinion_mail.png) no-repeat center center;} a.epbtn_order1{background:url(/assets/img/www/eplist/order_off.png) no-repeat left center; display:inline-block; height:34px; color:#000; text-indent:20px; font-weight:normal; margin-left:15px; font-size:13px;} a.epbtn_order2{background:url(/assets/img/www/eplist/order_on.png) no-repeat left center; display:inline-block; height:34px; color:#000; text-indent:20px; font-weight:normal; margin-left:15px; font-size:13px;} /* a.epbtn_bookmark_renewal{background:#fff; display:block; border-radius:50%; border:1px solid #ddd; width:40px; height:40px; position:absolute; top:15px; right:15px; background:url(/assets/img/www/common/ep_like_normal.png) no-repeat center center; cursor:pointer;} a.epbtn_bookmark_renewal.active{background-image:url(/assets/img/www/common/ep_like_active.png); border-color:#e63640;} */ a.epbtn_bookmark_renewal{background:#fff; display:block; border-radius:50%; border:1px solid #ddd; width:40px; height:40px; position:absolute; top:15px; right:15px; background:url(/assets/img/www/common/ep_alert_normal.png) no-repeat center center; cursor:pointer;} a.epbtn_bookmark_renewal.active{background-image:url(/assets/img/www/common/ep_alert_active.png); border-color:#e63640;} /*전체구매*/ .episode_list a.btn_orderchange{ color:#333; background: #ececec; /* Old browsers */ background: -moz-linear-gradient(top, #ffffff 1%, #ececec 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #ffffff 1%,#ececec 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #ffffff 1%,#ececec 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ececec',GradientType=0 ); /* IE6-9 */ border:1px solid #b3b3b3; border-top:1px solid #b7b7b7; box-shadow:1px 1px 1px #ddd; margin-left:8px; } .episode_list a.btn_allbuy{ color:#fff; background: #e82a17; /* Old browsers */ background: -moz-linear-gradient(top, #e82a17 0%, #ae1e0f 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #e82a17 0%,#ae1e0f 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #e82a17 0%,#ae1e0f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e82a17', endColorstr='#ae1e0f',GradientType=0 ); /* IE6-9 */ border:1px solid #9b150a; border-top:1px solid #9a1510; box-shadow:1px 1px 1px #ddd; } .episode_list a.btn_allbuy span{display:inline-block; width:18px; height:18px; vertical-align:middle; background:url(/assets/img/www/eplist/icon_allbuy.png) no-repeat center center; margin:-3px 5px 0 0;} .episode_list a.btn_allbuy_event{ color:#fff; background: #e82a17; /* Old browsers */ background: -moz-linear-gradient(top, #e82a17 0%, #ae1e0f 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #e82a17 0%,#ae1e0f 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #e82a17 0%,#ae1e0f 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e82a17', endColorstr='#ae1e0f',GradientType=0 ); /* IE6-9 */ border:1px solid #9b150a; border-top:1px solid #9a1510; box-shadow:1px 1px 1px #ddd; } .episode_list a.btn_allbuy_event span{display:inline-block; width:18px; height:18px; vertical-align:middle; background:url(/assets/img/www/eplist/icon_allbuy.png) no-repeat center center; margin:-3px 5px 0 0;} .episode_list a.btn_orderchange span{display:inline-block; width:12px; height:18px; vertical-align:middle;} .episode_list a.btn_orderchange span.icon_order_up{background:url(/assets/img/www/eplist/icon_order_up.png) no-repeat center center;} .episode_list a.btn_orderchange span.icon_order_down{background:url(/assets/img/www/eplist/icon_order_down.png) no-repeat center center;} .episode_list .allbuy_layer{width:890px; height:34px; background:#f6f6f6; position:absolute; top:0; right:0; text-align:left; padding:4px 20px; line-height:28px;} input[type=checkbox].buy_select_ck{display:none; margin:0; padding:0;} input[type=checkbox].buy_select_ck+label{width:20px; height:20px; background:url(/assets/img/mobile/common/allbuy_checkbox.png) no-repeat left center; background-size:auto 100%; padding-left:25px; margin:0;} input[type=checkbox].buy_select_ck:checked+label {background-image:url(/assets/img/mobile/common/allbuy_checkbox_checked.png);} label.select_all{font-size:14px; color:#000; cursor:pointer;} label.select_all span{color:#fd4243;} .episode_list .allbuy_layer p.ep_ea{display:inline-block; float:right; margin-right:10px; letter-spacing:0; font-size:14px;} .episode_list .allbuy_layer p.ep_ea span{color:#ff1200;} .all_buy_wp .all_buy_layer a{display:block; border-radius:5px; height:30px; line-height:30px; float:right; font-size:12px;} .all_buy_wp .all_buy_layer a.all_buy{background:#fd4243; color:#fff; padding:0 25px;} .all_buy_wp .all_buy_layer a.cancel_x{background:#ddd; color:#000; padding:0 10px; margin-left:5px;} .ep_check{position:absolute; top:0px; left:0; width:22px; height:22px;} /*회차리스트 우측컨텐츠*/ /* .eplist_right_con{width:396px; height:100%; float:right; padding:0;} */ .eplist_right_con{width:270px; height:100%; float:right; padding:0;} /*190214 수정*/ .eplist_right_con p.con_tt{font-size:14px; font-weight:bold; margin-bottom:9px;} .eplist_right_con p.con_tt span{color:#f54a3d;} .eplist_right_con p.con_tt:before{content:''; display:block; width:5px; height:5px; background:#f54a3d; border-radius:50%; float:left; margin:7px 5px 0 0;} /* .eplist_right_con .episode_eventbnr{display:block; width:100%; height:45px; border-radius:5px; background-size:cover; background-position:center center; background-repeat:no-repeat;} */ .eplist_right_con .episode_eventbnr{display:block; width:100%; height:50px; border-radius:5px; background-size:cover; background-position:center center; background-repeat:no-repeat; border:1px solid rgba(0,0,0,0.1)}/*190214 수정*/ .eplist_right_con .genre_list{width:100%; border-top:2px solid #333; padding:0; margin:0;} .eplist_right_con .genre_list li{border-bottom:1px solid #ddd; height:60px; padding:10px 5px;} .eplist_right_con .genre_list li.toon_area{display:block; width:100%;} .eplist_right_con .genre_list a{display:block;} .eplist_right_con .genre_list .thumb_box{float:left; width:60px; height:60px; overflow:hidden; border:1px solid #ddd; margin:0 5px 0 0; position:relative;} .eplist_right_con .genre_list .thumb_box img{width:60px; position:absolute; top:-7px; left:0; z-index:1;} .eplist_right_con .genre_list .thumb_box .new_ribbon{width:37px; height:37px; position:absolute; top:22px; left:22px; background:url(/assets/img/www/ribbon_new.png) no-repeat; z-index:2;} .eplist_right_con .genre_list .thumb_box .right_ribbon{position:absolute; width:15px; height:15px; line-height:15px; background:rgba(0,0,0,0.6); color:#fff; font-size:10px; z-index:2; top:40px; left:5px; border-radius:50%; text-align:center;} .eplist_right_con .genre_list p.title{font-size:14px; font-weight:bold; color:#333; margin-bottom:3px;} .eplist_right_con .genre_list p.writer{font-size:11px; color:#999;} .eplist_right_con .genre_list p.synop{font-size:12px; color:#666; width:230px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; margin-top:5px;} /*찜하기*/ .episode_bnr .episode_bookmark{width:1200px; margin:auto; position:relative;} .episode_bnr .episode_bookmark a{cursor:pointer; width:48px; height:48px; display:block; border:2px solid #f54a3d; z-index:4; position:absolute; top:0; right:0; font-size:11px; text-align:center; line-height:75px; font-weight:bold; letter-spacing:-1px;} /* .episode_bnr .episode_bookmark a.like{color:#f54a3d; background:url(/assets/img/www/icon_like_web.png) no-repeat center 5px #fff;} .episode_bnr .episode_bookmark a.like.active{color:#fff; background:url(/assets/img/www/icon_like_webon.png) no-repeat center 5px #f54a3d;} */ .episode_bnr .episode_bookmark a.like{color:#f54a3d; background:url(/assets/img/www/common/ep_alert_normal.png) no-repeat center 5px #fff;} .episode_bnr .episode_bookmark a.like.active{color:#fff; background:url(/assets/img/www/common/ep_alert_active.png) no-repeat center 5px #f54a3d;} /*회원가입 레이어*/ .joinLayer{width:570px; height:660px; font-size:16px; line-height:22px; margin:auto; position:relative; background:#fff; letter-spacing:-1px; position:relative;} .joinLayer h1{width:100%; height:45px; line-height:45px; text-align:center; color:#f54a3d; font-weight:bold; font-size:16px; padding:0; margin:0; border-bottom:1px solid #f54a3d; position:relative;} .joinLayer h1 a.joinLayer_close{width:15px; height:15px; display:block; position:absolute; top:15px; right:15px; background:url(/assets/img/www/close_red.png) no-repeat;} .joinLayer .event_bnr{width:100%; height:80px;} .joinLayer .login_switch{width:252px; height:40px; line-height:40px; text-align:center; background:#f6f6f6; border:1px solid #f54a3d; margin:25px auto; font-size:14px; font-weight:bold; border-radius:100px; overflow:hidden;} .joinLayer .login_switch a{width:126px; display:block; float:left; cursor:pointer; text-decoration:none; color:#f54a3d;} .joinLayer .login_switch a.on{background:#f54a3d; color:#fff;} .joinLayer ul.joinform{width:100%; margin:0; padding:0; border-top:1px solid #d1d1d1;} .joinLayer ul.joinform li{list-style:none; height:50px; line-height:50px; border-bottom:1px solid #d1d1d1; position:relative;} .joinLayer ul.joinform li label{width:130px; padding-left:40px; float:left; font-weight:bold;} .joinLayer ul.joinform li input{width:300px; border:none;} .joinLayer ul.joinform li input:focus{border:none; background:#fff;} .joinLayer ul#domain{position:absolute; right:100px; top:15px; background:#fff; margin:0; padding:0; width:150px; border:1px #ccc solid; font-family:'NanumGothic', '나눔고딕', '맑은 고딕', 'Malgun Gothic', Dotum, AppleGothic, sans-serif; font-size:16px; color:#ccc; line-height:25px; z-index:99; display:none;} .joinLayer ul#domain li{display:block; clear:both; padding-left:10px;} .joinLayer ul#domain li.active{background-color:#ececec;} .joinLayer .save_info{width:100%; height:40px; line-height:22px; text-align:center; font-size:12px; margin-top:0px;} .joinLayer .save_info input[type="checkbox"]{margin:-2px 3px 0 10px;} .joinLayer .save_info input, .joinLayer .save_info label{cursor:pointer;} .joinLayer .save_info a.fide_pw{color:#f54a3d; border:1px solid #e1e1e1; padding:4px 8px; margin:0 0 0 10px; letter-spacing:-2px; font-weight:bold;} .joinLayer .join_agree{width:100%; height:22px; line-height:22px; text-align:center; font-size:12px; margin-top:10px;} .joinLayer .join_agree input[type="checkbox"]{margin:-3px 3px 0 10px;} .joinLayer .join_agree input, .joinLayer .join_agree label{cursor:pointer;} .joinLayer .notice_box{position: absolute; top: 200px; left: 50%; width: 260px; height: 24px; margin-left: -130px; font-size: 11px; color: #fff; background: #fd4243; text-align: center; line-height: 24px; border-radius: 3px; letter-spacing: -1px;} .joinLayer .notice_box span.arrow{position: absolute; width: 10px; height: 6px; background: url(/assets/img/mobile/common/bubble_arrow.png); top: 24px; left: 50%; margin-left: -5px; background-size: 10px;} .joinLayer ul.button_area{width:100%; margin:25px 0; padding:0;} .joinLayer ul.button_area li{list-style:none; padding:0;} .joinLayer ul.button_area li input.joinlogin{display:block; width:262px; height:47px; background:#f54a3d; color:#fff; text-align:center; border:0; margin:0 auto 7px; font-size:14px; font-weight:bold; cursor:pointer;transition: all .5s} .joinLayer ul.button_area li a{display:block; width:260px; height:45px; line-height:45px; border:1px solid #e1e1e1; margin:0 auto 7px; cursor:pointer; font-weight:bold; font-size:14px;} .joinLayer ul.button_area li a.sns_naver{border-color:#35b21e; background:url(/assets/img/www/icon_sns_naver.jpg) no-repeat; background-position:15px center;} .joinLayer ul.button_area li a.sns_naver span{height:45px; border-left:1px solid #35b21e; display:block; margin-left:65px; padding-left:15px; color:#35b21e;} .joinLayer ul.button_area li a.sns_google{border-color:#e24636; background:url(/assets/img/www/icon_sns_google.jpg) no-repeat; background-position:15px center;} .joinLayer ul.button_area li a.sns_google span{height:45px; border-left:1px solid #e24636; display:block; margin-left:65px; padding-left:15px; color:#e24636;} .joinLayer ul.button_area li a.sns_facebook{border-color:#416199; background:url(/assets/img/www/icon_sns_facebook.jpg) no-repeat; background-position:15px center;} .joinLayer ul.button_area li a.sns_facebook span{height:45px; border-left:1px solid #416199; display:block; margin-left:65px; padding-left:15px; color:#416199;} .joinLayer ul.footer{width:100%; height:45px; line-height:45px; background:#f7f7f7; position:absolute; bottom:0; left:0; margin:0; padding:0; text-align:center;} .joinLayer ul.footer li{list-style:none; display:inline-block; text-align:center; font-size:11px;} .joinLayer ul.footer li a.terms{display:inline-block; background:#fff; color:#333; border:1px solid #e1e1e1; line-height:20px; padding:1px 8px 0px 8px; font-weight:bold;} .joinLayer ul.footer li a.privacy{display:inline-block; background:#fff; color:#f54a3d; border:1px solid #f54a3d; line-height:20px; padding:1px 8px 0px 8px; font-weight:bold;} .joinLayer ul.footer li a{text-decoration:none; letter-spacing:0;} .joinLayer ul.footer li a.mail:hover{text-decoration:underline;} /* alert info 팝업*/ .alert_popup{width:300px; background:#fff;} .alert_popup h1{width:100%; height:34px; line-height:34px; text-align:center; font-size:14px; font-weight:bold; position:relative; border-bottom:1px solid #f33c3a; color:#f33c3a; padding:0; margin:0;} .alert_popup h1 a{position:absolute; top:10px; right:15px;} /*.info_popup{background:#fff; width:100%; text-align:center; padding:15px 0 30px;}*/ .info_popup{background:#fff; width:100%; text-align:center; padding:0 0 30px;} .info_popup p{font-size:14px; line-height:18px;} .info_popup label{width:100%; display:block; text-align:center; padding:0; margin:0 auto 20px;} .info_popup > .btn_confirm {display:inline-block; width:300px;} .info_popup > .btn_type10 { margin-right: 4px; -moz-box-shadow:inset 0px 1px 0px 0px #f5978e; -webkit-box-shadow:inset 0px 1px 0px 0px #f5978e; box-shadow:inset 0px 1px 0px 0px #f5978e; background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f24537), color-stop(1, #c62d1f)); background:-moz-linear-gradient(top, #f24537 5%, #c62d1f 100%); background:-webkit-linear-gradient(top, #f24537 5%, #c62d1f 100%); background:-o-linear-gradient(top, #f24537 5%, #c62d1f 100%); background:-ms-linear-gradient(top, #f24537 5%, #c62d1f 100%); background:linear-gradient(to bottom, #f24537 5%, #c62d1f 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f24537', endColorstr='#c62d1f',GradientType=0); background-color:#f24537; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; border:1px solid #d02718; display:inline-block; cursor:pointer; color:#ffffff; font-family:Arial; font-size:12px; font-weight:bold; padding: 12px 10px; text-decoration:none; } .info_popup > .btn_type10:hover { background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #c62d1f), color-stop(1, #f24537)); background:-moz-linear-gradient(top, #c62d1f 5%, #f24537 100%); background:-webkit-linear-gradient(top, #c62d1f 5%, #f24537 100%); background:-o-linear-gradient(top, #c62d1f 5%, #f24537 100%); background:-ms-linear-gradient(top, #c62d1f 5%, #f24537 100%); background:linear-gradient(to bottom, #c62d1f 5%, #f24537 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c62d1f', endColorstr='#f24537',GradientType=0); background-color:#c62d1f; } .info_popup > .btn_type10:active { position:relative; top:1px; } .info_popup > .btn_type11 { -moz-box-shadow:inset 0px 1px 0px 0px #728394; -webkit-box-shadow:inset 0px 1px 0px 0px #728394; box-shadow:inset 0px 1px 0px 0px #728394; background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #42494f), color-stop(1, #262b30)); background:-moz-linear-gradient(top, #42494f 5%, #262b30 100%); background:-webkit-linear-gradient(top, #42494f 5%, #262b30 100%); background:-o-linear-gradient(top, #42494f 5%, #262b30 100%); background:-ms-linear-gradient(top, #42494f 5%, #262b30 100%); background:linear-gradient(to bottom, #42494f 5%, #262b30 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#42494f', endColorstr='#262b30',GradientType=0); background-color:#42494f; -moz-border-radius:4px; -webkit-border-radius:4px; border-radius:4px; border:1px solid #23272b; display:inline-block; cursor:pointer; color:#ffffff; font-family:Arial; font-size:12px; font-weight:bold; padding: 12px 10px; text-decoration:none; } .info_popup > .btn_type11:hover { background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #262b30), color-stop(1, #42494f)); background:-moz-linear-gradient(top, #262b30 5%, #42494f 100%); background:-webkit-linear-gradient(top, #262b30 5%, #42494f 100%); background:-o-linear-gradient(top, #262b30 5%, #42494f 100%); background:-ms-linear-gradient(top, #262b30 5%, #42494f 100%); background:linear-gradient(to bottom, #262b30 5%, #42494f 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#262b30', endColorstr='#42494f',GradientType=0); background-color:#262b30; } .info_popup > .btn_type11:active { position:relative; top:1px; } /* .info_popup .btn_join { width:230px; height:44px; position:absolute;left:35px; top:280px; z-index:6;} .info_popup .btn_login { width:130px; height:44px; position:absolute;left:274px; top:280px; z-index:6;} .info_popup .btn_close { width:41px; height:42px; position:absolute;left:626px; top:15px; z-index:6;} */ .alert_btn { -moz-box-shadow:inset 0px 1px 0px 0px #ffffff; -webkit-box-shadow:inset 0px 1px 0px 0px #ffffff; box-shadow:inset 0px 1px 0px 0px #ffffff; background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #ededed), color-stop(1, #dfdfdf) ); background:-moz-linear-gradient( center top, #ededed 5%, #dfdfdf 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#ededed', endColorstr='#dfdfdf'); background-color:#ededed; -webkit-border-top-left-radius:6px; -moz-border-radius-topleft:6px; border-top-left-radius:6px; -webkit-border-top-right-radius:6px; -moz-border-radius-topright:6px; border-top-right-radius:6px; -webkit-border-bottom-right-radius:6px; -moz-border-radius-bottomright:6px; border-bottom-right-radius:6px; -webkit-border-bottom-left-radius:6px; -moz-border-radius-bottomleft:6px; border-bottom-left-radius:6px; text-indent:0; border:1px solid #dcdcdc; display:inline-block; color:#777777; font-family:arial; font-size:15px; font-weight:bold; font-style:normal; height:35px; line-height:35px; width:110px; text-decoration:none; text-align:center; text-shadow:1px 1px 0px #ffffff; } .alert_btn:hover { background:-webkit-gradient( linear, left top, left bottom, color-stop(0.05, #dfdfdf), color-stop(1, #ededed) ); background:-moz-linear-gradient( center top, #dfdfdf 5%, #ededed 100% ); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#dfdfdf', endColorstr='#ededed'); background-color:#dfdfdf; }.alert_btn:active { position:relative; top:1px; } /* =======================================================================================*/ .font {font-size:15px; color:#666;} .font a:hover{font-size:13px; color:#da0000;} .bnr .bnr_bg {width:1000px; margin:auto; position:relative; z-index:1;} .bnr .bnr_bg .control_icon {position:absolute; top:0; right:0; z-index:9999; padding:15px 15px 0 0; text-align:right;} .bnr .bnr_bg #view_ep_first{cursor:pointer;} .bnr .ribbon {width:82px; height:82px; position:absolute; top:0; left:0px;} .bnr .discount {width:217px; height:111px; position:absolute; top:150px; left:160px; z-index:9;} .bnr .discount2 {width:217px; height:111px; position:absolute; top:150px; left:560px; z-index:9;} .bnr .viewfirst {width:153px; height:51px; position:absolute; top:190px; left:390px; z-index:9;} .bnr .buy_view {width:330px; height:49px; position:absolute; top:190px; left:370px; z-index:9;} .bnr .zem_num {width:28px; height:35px; position:absolute; top:187px; left:360px; background:url(/assets/img/www/icon_zemnum.png); z-index:11; color:#fff; font-size:18px; font-weight:bold; text-shadow: 1px 1px 1px black; padding:25px 0 0 50px; } .bnr .main_bnr_arrow {position:absolute; bottom:20px; right:20px; z-index:3; cursor:pointer;} .bnr .bnr_button {height:51px; position:absolute; top:190px; left:770px; z-index:9;} .bnr_subm .box_ad {width:241px; height:258px; position:relative; z-index:2; overflow:hidden;} .bnr_left {width: 245px;float: left;margin-top: 18px;} .bnr_left .recommand_title {font-size: 42px;letter-spacing: -4px;padding: 18px;font-weight: 600;padding-left:3px;} .bnr_left .recommand_content{font-size: 14px;font-weight: 600;letter-spacing: -1px;padding-top: 2px;padding-left:6px;} .bnr_left .red{color : #d72e2b;} .bnr .box_ad {height: 173px;position: absolute;margin-top: 40px;z-index: 2;left: -54px;} .box_ad .arrow {position:absolute; bottom:20px; right:20px; z-index:3; cursor:pointer;} .box_ad ul.ad_banner_s{margin:0px; padding:0px; list-style:none;} .box_ad ul.ad_banner_s li:hover{opacity: 0.8} .box_ad ul.ad_banner_s li.active{z-index:1;} .bnr .bnr_19icon {width:80x; height:80px; position:absolute; top:20px; left:850px; z-index:9;} .bnr #co_icon_list {height:80px; position:absolute; top:10px; right:20px; z-index:9; list-style:none;} .bnr #co_icon_list li{display:inline; float:right; padding-left:10px;} .main_bnr_pagination{height: 16px;float: right;margin-right: 24px;margin-top: 8px;} .main_bnr_pagination span{float : left;background-color: #ccc;width: 8px;height: 8px;border-radius: 8px;margin-left: 4px;} .main_bnr_pagination .active{background-color: #ff4637;} .box_ad_pagination{height: 16px;margin-left: 212px;margin-top: 25px;width: 100%;} .box_ad_pagination span{float: left;background-color: #ccc;width: 8px;height: 8px;border-radius: 8px;margin-left: 4px;} .box_ad_pagination .active{background-color: #ff4637;} .slideOn {width:10px; height:10px; background-color:#da0000; float:left;} .slideOff {width:10px; height:10px; background-color:#ccc; float:left; margin-left:10px;} /*뉴*/ .topsmenu{ border-width: 1px; border-color: rgb( 228, 228, 228 ); border-style: solid; background-image: -moz-linear-gradient( 90deg, rgb(242,242,242) 0%, rgb(255,255,255) 100%); background-image: -webkit-linear-gradient( 90deg, rgb(242,242,242) 0%, rgb(255,255,255) 100%); background-image: -ms-linear-gradient( 90deg, rgb(242,242,242) 0%, rgb(255,255,255) 100%); width: 999px; height: 61px; } /*인덱스 이미지보더*/ .imgBoder {border:1px #efefef solid;} .imgBoder img:hover{border:1px #D355E5 solid;} /*수정구간*/ .week {width:1000px; margin:0 auto 100px; font-size:11px;} .week .title {font-weight:600; display:block; font-size:12px; margin:0px 0 5px;} .week .weekbox {width:111px; float:left; margin-bottom:50px;} .week .weekbox .title {margin-bottom:8px;text-align:center;width:115px;height:30px;line-height:30px;background-color:#ebebeb;} .week .weekbox .select {background-color: #f54a3d;color: #fff;} .week .weekbox .misc {color : #f54a3d;} .premium {width:100%; clear:both;} .premium .premium_div {width:1000px; margin:auto; padding-bottom:20px;} .title_label {line-height: 48px} .title_label a {float:left;font-size: 18px;color : #333;font-weight:600;} .title_label a:hover {color : #333;} .title_label .morebtn { width: auto; float: left; display: block; line-height: 16px; font-size: 10px; letter-spacing: -1px; text-align: center; border-radius: 20px; background-color: #ff4637; color: #fff; font-weight: 400; padding: 2px 8px; margin-left: 8px; margin-top: 13px; } .toon_area{cursor:pointer; display:inline-block; width:108px;} .toon_box_normal {width:111px; height:150px; margin:0 0px 0px; padding-top:5px; float:left;border:0px #bbbbbb solid; position:relative;-moz-box-shadow: 0 0 1px 1px rgba(0,0,0,0.1);} .no_box_normal {width:111px; height:150px; margin:0 0px 0px; padding-top:5px; float:left;border:0px #bbbbbb solid; position:relative;} .rank_ribbon {position:absolute; width:37px; height:40px; top:5px; left:16px; z-index:99;} .new_ribbon {position:absolute; width:37px; height:40px; top:66px; right:14px; z-index:2;} .novel_area .new_ribbon {top:69px;} .new_ribbon_recommand {position:absolute; width:37px; height:40px; bottom:-4px; right:0px; z-index:2;} .right_ribbon { position: absolute; width: 25px; height: 12px; top: 126px; left: 72px; z-index: 99; text-align: right; background-image: url(/assets/img/www/19_icon_n.png); } .right_ribbon_recommand { position: absolute; width: 25px; height: 12px; top: 5px; right: 5px; z-index: 99; text-align: right; background-image: url(/assets/img/testaspw/19_icon_n.png); } .toon_update {color: #ff6a1d;border: 2px solid #ff6a1d;padding: 0px 3px;border-radius: 12px;font-size: 10px;font-weight: bold;line-height: 12px;height: 12px;position: absolute;right: 18px;z-index: 3;text-align: center;background-color: #fff;margin: 4px 0px;} .toon_box_normal .box_normal {width: 80px;height: 150px;position: absolute;overflow-y: hidden;top: 5px;left: 16px;text-align: left;z-index: 1;line-height: 20px;bottom: 5px;} .toon_box_normal .box_normal img {width:80px;} .toon_box_normal .box_normal img:hover { opacity:0.6} .no_box_normal .box_normal {width: 80px;height: 150px;position: absolute;overflow-y: hidden;top: 5px;left: 16px;text-align: left;z-index: 1;line-height: 20px;bottom: 5px;} .no_box_normal .box_normal img {width:80px;height:100px;} .no_box_normal .box_normal img:hover { opacity:0.6} /*선택시*/ .toon_box_select {width:111px; height:150px; background-color:#efefef; margin:0px 0px 0px; padding-top:5px; float:left;position:relative;} .toon_box_select .box_select {width:80px; height:150px; position:absolute; top:5px; left:16px; text-align:left; z-index:1; line-height:20px;} .toon_box_select .box_select img {width:80px;} .toon_box_select .box_select img:hover { opacity:0.6;} .no_box_select {width:111px; height:150px; background-color:#efefef; margin:0px 0px 0px; padding-top:5px; float:left;position:relative;} .no_box_select .box_select {width:80px; height:150px; position:absolute; top:5px; left:16px; text-align:left; z-index:1; line-height:20px;} .no_box_select .box_select img {width:80px;height:100px;} .no_box_select .box_select img:hover { opacity:0.6;} .bottom {width:980px; height:135px; margin:auto; padding-top:25px; clear:both;} .bottom img {float:left;} .bottom .text {width:770px; height:125px; float:left; margin-left:50px; font-size:0.8em;} .bottom .text ul {list-style:none; width:750px; height:18px; margin:0; padding:5px 10px; background-color:#fbfbfb; border-top:1px #f0f0f0 solid; border-bottom:1px #f0f0f0 solid;} .bottom .text ul li {color:#2e2e2e; float:left;} .bottom .text ul li.bar {padding:0 5px;} .bottom .text p {padding-left:10px;} .bottom .text p span {font-size:14px; font-weight:bold; line-height:22px;} .bottom .qr {float:right; width:100px; height:100px;} .botttomline {width:980px; margin:auto; height:1px; background-color:#ebebeb; clear:both;} .bottom_freecharge{ width:980px; margin:auto; } .bottom_freecharge img {float:left;margin-top:15px;margin-bottom:25px;} /*sub*/ /*서브추가*/ .subBanner {position:relative; float:left; padding-top:22px; font-size:13px; color:#ccc;} .subBanner img {border : 1px solid #c7c7c7;} .subBanner2 {float: left;padding-top: 10px;font-size: 13px;color: #ccc;padding-left: 12px;height: 190px;width: 250px;} .subBanner2 .genre{font-size : 16px;letter-spacing: -1px;color : #ff4637;line-height:20px;margin-top:16px;margin-left: 4px;} .subBanner2 .title{font-size : 28px;font-weight : 600;letter-spacing: -1px;color : #000;line-height:32px;margin-left: 4px;} .subBanner2 span:hover{background-color: inherit;color:inherit;font-weight: inherit;} .subBanner2 .title .rnd_btn{background-color: #fff} .subBanner2 .title .rnd_btn img{width:18px;} .subBanner2 .title .rnd_btn:hover{background-color: #fff} .subBanner2 .title .rnd_btn.active{background-color: #ff4637;color:#fff;font-weight:400;border-color: #ff4637} .subBanner2 .title .rnd_btn.active:hover{background-color: #ff4637} .subBanner2 .author{font-size: 13px;color: #666;line-height: 28px;margin-left: 4px;} .subBanner2 .desc{font-size: 13px;color : #000;line-height:24px;margin-top : 4px;} .subBanner_no {position:relative; float:left; padding-top:12px; font-size:13px; color:#ccc;} .subBanner_no img {border : 1px solid #c7c7c7;} .subBanner2_no {float: left;padding-top: 10px;font-size: 13px;color: #ccc;padding-left: 12px;height: 190px;width: 450px;} .subBanner2_no .genre{font-size : 16px;letter-spacing: -1px;color : #ff4637;line-height:20px;margin-top:16px;margin-left: 4px;} .subBanner2_no .title{font-size : 28px;font-weight : 600;letter-spacing: -1px;color : #000;line-height:32px;margin-left: 4px;} .subBanner2_no span:hover{background-color: inherit;color:inherit;font-weight: inherit;} .subBanner2_no .title .rnd_btn{background-color: #fff} .subBanner2_no .title .rnd_btn img{width:18px;} .subBanner2_no .title .rnd_btn:hover{background-color: #fff} .subBanner2_no .title .rnd_btn.active{background-color: #ff4637;color:#fff;font-weight:400;border-color: #ff4637} .subBanner2_no .title .rnd_btn.active:hover{background-color: #ff4637} .subBanner2_no .author{font-size: 13px;color: #666;line-height: 28px;margin-left: 4px;} .subBanner2_no .desc{font-size: 13px;color : #000;line-height:24px;margin-top : 4px;} .subBanner #co_icon_list img {border:0px; opacity:1;} .subBanner #co_icon_list img:hover {border:0px; opacity:1;} .bnr_ctrl {float:left;padding-left: 12px;width: 250px;} /*서브베너*/ .sub_pt_body {width:100%; padding-bottom:20px;} .sub_body_default {width:1000px; margin:auto;} /*.sub_body_default img {width:83px;}*/ .sub_body{width:1200px; margin:90px auto 0; padding-top:30px;} .sub_title { padding-left:20px; width:150px; float:left; color:#da0000; font-size:16px; font-weight:bold; height:30px;} .sub_contents {float:left; padding-bottom:60px; color:#333;} .sub_contents ul#domain {position:absolute; background-color:#FFF; margin:0; padding:0; width:150px; border:1px #ccc solid; font-family:'NanumGothic', '나눔고딕','nng', '맑은 고딕', 'Malgun Gothic', Dotum, AppleGothic, sans-serif; font-size:18px; color:#ccc; line-height:25px; float:right; right:72px; top:50px; z-index:1; display:none;} .sub_contents ul#domain li {display:block; clear:both; padding-left:10px;} .sub_contents ul#domain li.active {background-color: #ececec;} .sub_contents .form_label {font-size:14px; text-align:right; padding-right:35px;} .sub_contents form .input_text {width:300px; height:38px; border:1px #ccc solid; font-family:'NanumGothic', '나눔고딕','nng', '맑은 고딕', 'Malgun Gothic', Dotum, AppleGothic, sans-serif; font-size:14px; color:#ccc; line-height:18px; padding-left:10px;} .sub_weekmenu {width:969px; height:34px; margin:0 auto;} .sub_body_pt {width:100%;} .sub_body2 {width:1200px; margin:130px auto 0; position:relative;} .sub_body2 .toon_list {margin-bottom:38px; background-color:#fff;} .sub_body2 .toon_list tr.visited {cursor:pointer; background-color:#ebebeb;} .sub_body2 .toon_list tr:hover {cursor:pointer; background-color:#efefef;} .sub_body2 .toon_list td {border-bottom:1px #dedede solid;height:48px;line-height:48px;} .sub_body2 .ep_head {padding:0px;height:40px;line-height:40px;font-size:13px;font-weight:bold;} .sub_body2 .toon_list .toon_title {font-size:14px; font-weight:bold; padding-left:15px;} .sub_body2 .toon_list .toon_date {font-size:11px; text-align:center;} /* 구매안한거 흑백으로 */ .toon_thumb .gray img { /* filter:url('data:image/svg+xml;utf8,#grayscale'); /* Firefox 3.5+, IE10 */ /* filter:gray; /* IE6-9 */ /*-webkit-filter: grayscale(100%); /* Chrome 19+ & Safari 6+ */ /*-webkit-transition: all .6s ease; /* Fade to color for Chrome and Safari */ /*-webkit-backface-visibility: hidden; /* Fix for transition flickering */ } /* 오버시 컬러로 */ .toon_thumb .gray img:hover {width:160px;height: 80px;overflow: hidden;filter: none;-webkit-filter: grayscale(0%);} .toon_thumb {width:160px; position:relative;height: 80px;overflow: hidden;margin: 8px 0} .toon_thumb .thumb_img {width:160px;height: 80px;overflow: hidden;} .toon_thumb .thumb_ribbon{width:24px; height:24px; position:absolute; top:0; left:0; z-index:2; background:url(/assets/img/www/common/icon_eplock.png) no-repeat center center #f54a3d;} .toon_thumb .thumb_dday{width:90px; height:24px; position:absolute; top:0px; left:0px; z-index:3; text-align:center; color:#fff; font-size:12px; background-color:#fa1b00; padding:0; margin:0; line-height:24px} .toon_thumb span.epicon_lock{width:10px; height:12px; background:url(/assets/img/www/common/icon_eplock.png) no-repeat center center; vertical-align:middle; display:inline-block; margin-right:3px; } /*충전소 추가 */ .charge_top { width:100%; min-width:980px; height:285px; background-image:url(/assets/img/www/charge_bg.jpg);} .charge_top .main{ width:980px; height:285px; margin:auto;} .charge_line { width:100%; min-width:980px; height:55px; background-color:#57070A;} .charge_line .main{ width:980px; height:55px; margin:auto; font-size:16px; color:#FFB4BE; } .myButton { background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #c62d1f), color-stop(1, #f24437)); background:-moz-linear-gradient(top, #c62d1f 5%, #f24437 100%); background:-webkit-linear-gradient(top, #c62d1f 5%, #f24437 100%); background:-o-linear-gradient(top, #c62d1f 5%, #f24437 100%); background:-ms-linear-gradient(top, #c62d1f 5%, #f24437 100%); background:linear-gradient(to bottom, #c62d1f 5%, #f24437 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#c62d1f', endColorstr='#f24437',GradientType=0); background-color:#c62d1f; border:2px solid #d02718; display:inline-block; cursor:pointer; color:#ffffff; font-family:arial; font-size:17px; padding:10px 29px; text-decoration:none; text-shadow:0px 1px 0px #810e05; } .myButton:hover { background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #f24437), color-stop(1, #c62d1f)); background:-moz-linear-gradient(top, #f24437 5%, #c62d1f 100%); background:-webkit-linear-gradient(top, #f24437 5%, #c62d1f 100%); background:-o-linear-gradient(top, #f24437 5%, #c62d1f 100%); background:-ms-linear-gradient(top, #f24437 5%, #c62d1f 100%); background:linear-gradient(to bottom, #f24437 5%, #c62d1f 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#f24437', endColorstr='#c62d1f',GradientType=0); background-color:#f24437; } .myButton:active { position:relative; top:1px; } .charge_table {background-color:#fff;} .charge_table tr{cursor:pointer;} .charge_table tr.active{background-color:#ffb4be;} .charge_table tr td { border-bottom:1px #d8d8d8 solid; position:relative;} .charge_table tr td table tr td {border-bottom:0px;} .charge_td_red {background-color:#57080a; font-size:18px; color:#ffce7d; padding-left:25px;} .charge_td_money {font-size:14px; text-align:center;} .charge_td_zem {text-align:left; padding-left:15px;} .charge_td_popul {position:absolute; width:75px; height:40px; top:13px; left:-35px;} .buylist_table {border-top:1px #ed1c24 solid; background-color:#FFF; margin-top:20px;} .buylist_table td {height:96px; border-bottom:1px #d8d8d8 dotted; font-size:12px;} .buylist_table th {background-color:#efefef; color:#444; font-size:12px; height:30px; border-bottom:0px #ed1c24 solid;} .buylist_table .buytitle {padding-left:15px;} .buylist_table .buytitle a {padding-left:15px; color:#444;} .buylist_table tr {cursor:pointer;} .buylist_table tr:hover {cursor:pointer; background-color:#efefef;} .buylist_table .episode {text-align:center; word-break:break-all; line-height:22px;} .buylist_table .episode a {color:#444; text-decoration:none; margin:0 3px;} .buylist_table .episode a:hover {color:#444; text-decoration:underline;} .buylist_table .episode a.buy {color:#fa1b00; text-decoration:underline;} .buylist_table .episode a.buy:hover {color:#fa1b00; text-decoration:underline;} .table_number {font-size:12px; text-align:center;} .table_number a {color:#444; text-decoration:none; margin:0 3px; padding:3px 10px;} .table_number a:hover {color:#da0000; text-decoration:none;} .table_number a.select:link {color:#fa1b00; text-decoration:none;} .sub_view_top {min-width:740px;width:100%; height:58px; background-color:#333644; border-bottom:1px #e1e1e1 solid; background-color:#262626; position:fixed;z-index:10;} .sub_view_top .sub_pg_title {width:1000px; margin:auto; font-size:20px; font-weight:bold; padding-top:15px; color:#fff;} .sub_view_top .logo_title {float:left; height:58px; margin-left:15px; color:#fff;} .sub_view_top .logo_title td {height:58px; vertical-align:middle; font-weight:bold; font-size:18px; color:#797979;} .sub_view_top .logo_title td .view_toon_title {font-size:19px; color:#fff; display:inline-block; margin-right:5px;} .sub_view_top .logo_title td .view_toon_titles {font-size:13px; color:#fff; display:inline-block; margin-right:10px;} .sub_no_view_top {min-width:740px;position:fixed;top:0;width:100%; height:48px; background-color:rgba(255,255,255,0.9); border-bottom:1px #e1e1e1 solid; z-index:10;line-height: 48px;} .sub_no_view_top .sub_pg_title {width:1000px; margin:auto; font-size:20px; font-weight:bold; color:#fff;} .sub_no_view_top td {height:48px; vertical-align:middle; font-weight:normal; font-size:16px; color:#797979;} .sub_no_view_top td .view_toon_title {font-size:16px; color:#000; display:inline-block; margin-right:5px;font-weight:bold;} .sub_no_view_top td .view_toon_titles {font-size:13px; color:#fff; display:inline-block; margin-right:10px;} .sub_no_view_top a {display:block;height:48px;} .sub_no_view_top a:hover {color : #ff4637;} .sub_no_view_top td .btn {cursor: pointer;line-height: 32px;height: 32px;width: 32px;text-align: center;font-size: 14px;display: block;float: left;margin-right: 6px;font-weight: bold;color: #333;border: 1px solid #efefef;} .sub_no_view_top td .btn:hover {color : #ff4637;} /*0317수정*/ .sub_view_top .control_btn {float:right; height:50px; margin:6px 20px; position:relative;} .sub_view_top .control_btn ul {list-style:none;} .sub_view_top .control_btn ul li {float:left; text-align:right; margin:13px 0 0 15px;} .sub_view_top .control_btn ul li a {color:#444; text-decoration:none; font-size:14px; font-weight:bold;} .sub_view_top .control_btn ul li a:hover {color:#444; text-decoration:underline;} .sub_view_toon {width:100%; position:relative; margin:auto; text-align:center; padding:60px 0 30px;} .sub_view_toon .remocon_box {width:150px; height:150px; position:fixed;z-index: 4; top:45%; right:5%;} .sub_view_toon .view_bottom_btn {margin:30px auto; text-align:center;} .sub_view_top .control_btn img, .sub_view_toon .view_bottom_btn img {margin:0 5px;} /*0309친추이벤트*/ .ad_view_top {width:100%; min-width:980px; height:75px; background-image:url(/assets/img/www/bg_topad.jpg); background-color:#333645; display:none;} .ad_view_top .main {width:980px; height:80px; margin:auto;} .ad_view_main {width:100%; background-color:#d5322e;} .ad_view_main .main {width:1000px; margin:auto;} .ad_view_mid {width:100%; min-width:980px; margin:auto; height:86px; background-image:url(/assets/img/www/pattern_event.jpg);} .ad_view_mid .wrap {width:770px; margin:0 auto; height:86px; margin:auto; font-size:16px; color:#ffffff; } .ad_view_mid .main {width:980px; height:86px; margin:auto;} .input_event {width:400px; height:40px; border:1px #B0A9C6 solid; margin:auto; font-size:20px; color:#FF4F90;} .sns { width:980px; height:325px; margin:auto;} .ad_view_foot {width:100%; min-width:980px; margin:auto; height:355px; background-image:url(/assets/img/www/pattern_bg.gif);} .ad_view_foot .main {width:980px; height:300px; margin:auto;} .ad_view_mid #copy_url{background: url(/assets/img/www/btn_event.jpg) no-repeat; border: none; width:137px; height:53px;} /*생년월일 선택 폼*/ .select_form { width: 100px; height: 56px; float:left; overflow: hidden; background: url(/assets/img/www/select_arrow.gif) no-repeat right #fff; border: 1px #ccc solid; z-index:2; } .select_text {float:left; margin:15px 20px 0 5px;} .select_form select { background: transparent; width: 125px; height:55px; font-family:'NanumGothic', '나눔고딕','nng', '맑은 고딕', 'Malgun Gothic', Dotum, AppleGothic, sans-serif; font-size:20px; font-weight:bold; padding: 3px 5px 2px 5px; border: 0; border-radius: 0; -webkit-appearance: none; outline:none; z-index:1; } /*font*/ .bold {font-weight:bold;} .fs12 {font-size:12px; line-height:16px;} .fs16 {font-size:16px; line-height:20px;} .fs20 {font-size:22px; line-height:28px;} /*link*/ .top a, .bottom a, .a_mail {color:#2e2e2e; text-decoration:none;} .top a:hover, .bottom a:hover, .a_mail:hover {text-decoration:underline;} /*text icon, button*/ .rnd_btn{float: left;display: block;height: 22px;line-height: 22px;font-size: 13px;letter-spacing: -1px;width: 72px;text-align: center;border: 2px solid #b7b7b7;border-radius: 20px;background-color: #fff;color:#333;font-weight:600;margin-right:4px;} .rnd_btn:hover{background-color: #f54a3d;color : #fff;border: 2px solid #f54a3d;font-weight: 400;} .red_bg{background-color: #f54a3d;color : #fff;border: 2px solid #f54a3d;font-weight: 400;} .red_border{background-color: #fff;color : #f54a3d;border: 2px solid #f54a3d;font-weight: 600;} .text_icon {width:33px; height:15px; font-size:12px; text-align:center; display:inline-block; margin-right:5px; float:left;} .text_btn { display:inline-block; text-align:center; font-size:12px; margin-right:6px; padding:3px 3px; text-decoration:none; vertical-align:middle;} .ti_red {border: 1px #fb4b32 solid;color: #fff;background-color: #fb4b32;font-size: 12px;font-weight: bold;letter-spacing: -1px;font-weight: 400;padding: 4px 12px;text-shadow: 0 1px 1px rgba(0,0,0,.3);box-shadow: 0 1px 2px rgba(0,0,0,.2);} .ti_red:hover {color:#fff; background-color:#F66;cursor:pointer} .ti_red1 {color:#fff; background-color:#da0000; padding:5px 10px 5px 10px; } .ti_red1:hover {color:#fff; background-color:#F66; } .ti_white {border: 1px #fb4b32 solid;color: #fb4b32;background-color: #fff;font-size: 12px;letter-spacing: -1px;font-weight: 400;padding: 4px 12px;text-shadow: 0 1px 1px rgba(0,0,0,.3);box-shadow: 0 1px 2px rgba(0,0,0,.2);} /* .ti_white:hover {color:#666; background-color:#FFDCDC; border:1px #fa1b00 solid;} */ .all_red {font-size:14px; font-weight:bold; color:#fff; background-color:#ed1c24; width:73px; height:26px; margin-top:-10px;} .buylist_btn {display:inline-block; text-align:center; font-size:18px; font-weight:bold; margin:0 12px; padding:6px 17px; text-decoration:none; vertical-align:middle;} .all_red2 {background-color:#fa1b00; color:#fff;} .text_icon_new {width:13px; height:13px; font-size:9px; font-weight:bold; background-color:#c30a00; margin:0; padding:0; text-align:center; color:#fff; line-height:13px; display:inline-block; letter-spacing:1px;} /*button*/ .button_yellow {width:150px; height:50px; background-color:#FF0004; border:1px #BC0003 solid; color:#fff; font-size:16px; font-weight:bold; text-align:center; margin:0;} .button_yellow:hover{width:150px; height:50px; background-color:#FF5255; border:1px #ED0000 solid; color:#fff; font-size:16x; font-weight:bold; text-align:center; margin:0;} .button_red {width:150px; height:50px; background-color:#C4C4C4; border:1px #939393 solid; color:#fff; font-size:16px; font-weight:bold; text-align:center;margin:0;} .button_red:hover {width:150px; height:50px; background-color:#ccc; border:1px #939393 solid; color:#fff; font-size:16px; font-weight:bold; text-align:center; margin:0;} .button_free {width:130px; height:40px; border:1px #cccccc solid; font-size:14px; font-weight:bold; text-align:center; background:url(/assets/img/www/icon_view.png) #fff no-repeat 15px center; padding-left:30px; color:#f84914;} .button_join {width:130px; height:40px; border:1px #cccccc solid; font-size:11px; font-weight:bold; text-align:center; background-color:#fff;} .button_zem {width:130px; height:40px; border:1px #dedede solid; font-size:1.1em; font-weight:bold; background-image:url(/assets/img/www/icon_coin.png); background-color:#fff; background-repeat:no-repeat; padding-left:20px;} .button_coin {width:130px; height:40px; border:1px #dedede solid; font-size:14px; font-weight:bold; background-image:url(/assets/img/www/icon_point.png); background-color:#fff; background-repeat:no-repeat; padding-left:40px;} .button_charge {width:138px; height:52px; border:1px #cccccc solid; font-size:14px; font-weight:bold; text-align:center; background-color:#fff; color:#ff0000;} .button_pay {width:190px; height:72px; margin:5px 6px 5px 0; border:1px #cccccc solid; font-size:14px; font-weight:bold; text-align:center; background-color:#fff; color:#7e7e7e; float:left;} .button_pay img {margin-right:5px;} .modal {position:fixed; top:0px; left:0px; width:100%; height:100%; display: none; background-color: rgb(0, 0, 0); filter:alpha(opacity=50); opacity:0.6; background-position: initial initial; background-repeat: initial initial; z-index:999;} .modal.white {background-color: rgb(255, 255, 255); filter:alpha(opacity=100); opacity:1;} .alert_layer {position:fixed; display: none; z-index:1000;} .alert_layer2 {position:fixed; display: none; z-index:1001;} .hidden {display:none;} /* 이벤트 팝업 */ .event_popup { width:684px; height:350px; position:relative; background-image:url(/assets/img/www/event_popup.jpg);} .event_popup .btn_join { width:230px; height:44px; position:absolute;left:35px; top:280px; z-index:6;} .event_popup .btn_login { width:130px; height:44px; position:absolute;left:274px; top:280px; z-index:6;} .event_popup .btn_close { width:41px; height:42px; position:absolute;left:626px; top:15px; z-index:6;} .inline-b{display:inline-block;float:left;} .inline-tc{display:table-cell;float:left;} /*충전샵 뽀디스크*/ .charge_body_bbo { width:100%; background-image:url(/assets/img/www/payment/charge_bg.gif); background-repeat:repeat;} .charge_top_bbo { width:981px; height:340px; margin:auto;} .charge_bbo_mid { width:982px; height:546px; margin:auto; margin-top:30px;} .charge_bbo_mid a{margin:0px;padding:0px;float:left;} .charge_bbo_result { width:980px; height:502px; margin:auto; margin-top:30px; background-image:url(/assets/img/www/event/coupon/bbo/result_bbo.jpg); position:relative;} .search_btn { width: 420px; height: 80px; margin: auto; margin-top: 30px; position: absolute; z-index: 100; top: 230px; left: 276px; } .input_result { border:2px #3D3642 solid; width:220px; height:30px; font-size:18px; color:#E85353; text-align:center; } .charge_bbo_topline { border-bottom:2px #3D3642 solid; } .charge_bbo_topline img { margin-right:10px;} .charge_bbo_midline { background-color:#f9f9f9; border-bottom:2px #e1e1e1 solid; } .charge_bbo_midline img { margin-right:10px; } .Rounded_Rectangle_6 { border-width: 15px; border-color: rgb( 61, 54, 66 ); border-style: solid; border-radius: 30px; background-color: rgb( 255, 255, 255 ); position: absolute; left: 0px; top: 0px; width: 970px; height: 220px; z-index: 135; } .Rounded_Rectangle_6 .sub_body2 {margin:0 20px;} /*베스트웹툰 */ .top_bg{ width:100%; height:85px; border-bottom:2px #da0000 solid; color:#666; font-size:0.9em;} .top_bg a{color:#444; text-decoration:none;} .top_bg a:hover{color:#FF0004; text-decoration:none;} .top_bg .smenu {width:500px; height:20px; margin-top:5px; margin:auto; padding-top:5px;} .top_bg .smenu>ul {float:right; text-align:right; padding:0; margin:0;} .top_bg .smenu>ul>li {list-style:none; padding:0; margin:0 0 0 5px; float:left; text-align:right; line-height:20px; position:relative;} .top_bg .smenu #my_info{display:none; width:200px; position:absolute; border:1px #e1e1e1 solid; list-style:none; padding:2px 0px 0px 0px; z-index:2; background-color:#FFF; font-weight:bold;} .top_bg .smenu #my_info li {border-bottom:1px #e1e1e1 solid; text-align:left; margin:0; padding:10px 20px 10px 10px;} .top_bg .smenu #my_info li .right{float:right;} .top_bg .smenu #my_info li .number{color:#FF0000;} .top_bg .smenu #my_info li.center{text-align:center; background-color:#EEE;} .top_bg .smenu #my_info li a:hover{color:#FF0000; text-decoration: none;} .top_bg .smenu #my_info li a:link{color:#FF0000; text-decoration: none;} .best_bnr {width:991px !important; position:relative; padding:3px;} .best_bnr .bnr{padding:8px 0px 0px; position:relative; float:left;} .best .title {font-weight:bold; display:block; font-size:14px; margin:15px 0 10px;} .best .weekbox {width:140px; float:left; margin-bottom:50px;} .best .weekbox .title {margin-bottom:20px;} .best_ {width:100%; background-image:url(/assets/img/www/background.jpg); background-repeat:repeat; clear:both;} .best_ .premium_div {width:980px; margin:auto; padding-bottom:20px;} /* 0310 */ /*캐쉬충전*/ .cash_box1{width:98%; height:20px; margin:0 auto; padding:5px 0 0 0; } .cash_box2{width:98%; margin:0 auto; border:solid 1px #CCC; } .cash_box2_1{width:100%; height:24px; line-height:24px; font-size:0.8em; color:#333; border-bottom:solid 1px #F3F3F3; background:#F6F6F6;} .cash_box2_2{width:100%; height:24px; line-height:24px; font-size:0.8em; color:#666;} .cash_txt1{padding-left:5px;font-size:0.9em; font-weight:bold;} .cash_txt2{color:#666;font-size:0.87em;} .cash_txt3{color:#F60;font-size:0.87em;} .cash_txt4{text-align:right; font-size:0.87em; color:#666;} .cash_txt5{color:#999;font-size:0.87em;} .cash_btn_box{width:98%; height:45px; margin:0 auto;} .cashinfo_box1{width:90%; padding:8px; margin:0 auto; font-size:0.8em; border: solid 1px #CCC; color:#666;-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;} .cashinfo_box2{width:90%; padding:8px; margin:0 auto; font-size:0.8em; border: solid 1px #CCC; color:#999;-webkit-border-radius: 6px; -moz-border-radius: 6px; border-radius: 6px;} .cash_td_top{height:24px; line-height:24px; font-size:0.8em; color:#666; text-align:center; border-top:solid 1px #CCC; border-bottom:solid 1px #CCC; background:#F3F3F3;} .cash_td1{height:24px; line-height:24px; font-size:0.8em; color:#666; text-align:center; border-bottom:solid 1px #EFEFEF;} .cash_td2{height:24px; line-height:24px; font-size:0.8em; color:#666; text-align:center; border-bottom:solid 1px #EFEFEF;} .cash_td3{height:24px; line-height:24px; font-size:0.8em; color:#666; text-align:center; border-bottom:solid 1px #EFEFEF; background:#F6F6F6;} .cash_fc_00{color:#666; /*text-decoration: line-through;*/} .cash_fc_01{color:#F60;} .cash_fc_02{color:#96C;} .cash_fc_03{color:#666;} .cash_fc_04{color:#F00; font-weight:bold;} .cash_fc_05{color:#390;} .cash_fc_06{ color:#999; text-decoration:line-through;} .cash_fc_tt01{color:#000; font-weight:bold;} /*로그인*/ .subtt_box1{width:98%; height:30px; margin:0 auto; padding:5px 0 0 0;} .subtt_box2{width:100%; height:30px; margin:0 auto; padding:5px 0 0 0; border-bottom:solid 1px #CCC;} .subtt_txt1{padding-left:5px;font-size:1em; font-weight:bold;} .subtt_txt2{font-size:0.8em; color:#666;} .subtt_txt3{color:#F60;font-size:0.9em;} .subtt_txt4{text-align:right; font-size:0.9em; color:#666;} /*### 포인트 충전소 테이블### 150210*/ .mcharg_table {width:1000px; margin:0 auto; margin-bottom:10px; border-top:solid 2px #777777; background:#FFF; margin-bottom:5px;} .mcharg_table th, .mcharg_table td {height:38px; line-height:38px; vertical-align: middle; padding-bottom:2px;} .mcharg_table th {background-color:#f7f7f7; border-bottom:1px solid #ccc; border-right:1px solid #ccc; font-weight:bold; text-align:center; font-size:14px;} .mcharg_table th:last-child {border-right:none;} .mcharg_table td {background:url(/assets/img/www/payment_dotline1.png) no-repeat; border-bottom:1px solid #ccc; padding-left:25px; font-size:12px; font-weight:bold;} .mcharg_table td:first-child {background:none;} .mcharg_table td img {margin:0 3px; vertical-align:middle;} .mcharg_table tr:hover {cursor:pointer;} .mcharg_table span.dc {background-color:#fb4b32; text-align:center; border-radius:20px; -webkit-border-radius:20px; -moz-border-radius:20px; color:#fff; font-size:11px; font-weight:bold; padding:2px 7px; margin:5px; letter-spacing:-1px;} .mcharg_table td.payment_info {text-align:center;background-color: #fefdef; font-size:14px;} /*### 로그인 테이블###*/ .login_table { width:900px; margin:0 auto; margin-bottom:10px; border:solid 3px #f00; background:#FFF;/*cursor:pointer;*/ -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px;margin-bottom:5px; padding:2px; } .login_table td { height:20px;line-height:20px; vertical-align:middle; border-bottom:#ccc 1px dotted; } .login_table .rig_Line { border-right:#CCC 1px dotted;} .login_table tr:hover {background-color:#f7f7f7;} .login_table .tr_title1 { height:20px;line-height:20px;background:#f6f6f6; text-align:center;color:#666; font-size:11px; } .mcharg_table .tr_title1 td{ border-bottom:#ccc 1px solid;} .td_rig10{ text-align:center; padding-right:10px;} .td_rig5{ text-align:left; padding-left:10px;} .td_le10 { text-align:left; padding-right:10px;} /*폰트 공통*/ .font_decoline { text-decoration:line-through} .font18em { font-size:1.8em;} .font16em { font-size:1.6em;} .font13em { font-size:1.3em;} .font14em { font-size:1.4em;} .font12em { font-size:1.2em;} .font11em { font-size:1.1em;} .font10em { font-size:1em;} .font09em { font-size:0.9em;} .font08em { font-size:0.8em;} .font07em { font-size:0.7em;} .bold { font-weight:bold;} .font_white {color:#ffffff;} .font_red {color:#ed1d37;} .font_blue {color:#1786cd;} .font_black {color:#000000;} .font_silver {color:#666666;} .font_navy {color:#1D5E90;} .font_blackb {color:#000000; font-weight:bold;} /*포인트 결제버튼*/ .mcharg_table_btn { clear:both; width:100%; margin:0 auto 50px; text-align:center;} .mcharg_table_left { width:48%; float:left; margin:0 auto; text-align:center; } .mcharg_table_right { width:48%; float:right; margin:0 auto;} .mcharg_table_btn_s { margin:0 auto; padding:0} .mcharg_table_btn_s li { display:block; margin-bottom:10px;} .mcharg_title1{ height:15px;line-height:15px; margin-left:5px;} .mcharg_title2{ height:30px;line-height:25px; margin-left:5px;} /*버튼추가*/ .cbtn { -moz-box-shadow:rgb(204, 204, 204) 0px 1px 2px; -webkit-box-shadow:rgb(204, 204, 204) 0px 1px 2px; box-shadow:rgb(204, 204, 204) 0px 1px 2px; background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #fff), color-stop(1, #f2f2f2)); background:-moz-linear-gradient(top, #fff 5%, #f2f2f2 100%); background:-webkit-linear-gradient(top, #fff 5%, #f2f2f2 100%); background:-o-linear-gradient(top, #fff 5%, #f2f2f2 100%); background:-ms-linear-gradient(top, #fff 5%, #f2f2f2 100%); background:linear-gradient(to bottom, #fff 5%, #f2f2f2 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#fff', endColorstr='#f2f2f2',GradientType=0); background-color:#f2f2f2; -moz-border-radius:5px; -webkit-border-radius:5px; border-radius:5px; border:1px solid #6283e3; border-bottom-color: #5572c6; display:inline-block; cursor:pointer; color:#2b53c6; font-size:15px; padding:15px 15px; text-decoration:none; /*text-shadow:0px 1px 0px #263666;*/ } .cbtn:hover {/* background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #415989), color-stop(1, #2e466e)); background:-moz-linear-gradient(top, #415989 5%, #2e466e 100%); background:-webkit-linear-gradient(top, #415989 5%, #2e466e 100%); background:-o-linear-gradient(top, #415989 5%, #2e466e 100%); background:-ms-linear-gradient(top, #415989 5%, #2e466e 100%); background:linear-gradient(to bottom, #00D6FF 5%, #2e466e 100%); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr='#415989', endColorstr='#2e466e',GradientType=0);*/ background:#fff; } .cbtn :active { position:relative; top:1px; } /*하단버튼*/ .payset_page { width:860px; margin:0 auto; margin-bottm:40px;} .payset_page1 {margin:0 auto; text-align:center; } .payset_page1_s {list-style:none;float:left;margin:0;padding:0;} .payset_page1_s li {float:left;width:110px; margin-right:6px; margin-bottom:10px;} .payset_page1_s li a span {display:none;} .payset_page1_s li a { background:url('http://vegadisk.com/images/charge/chargeok_btn_set1_new.gif') no-repeat} .payset_page1_s li a {height:41px;width:120px;display:block;} .payset_page1 .m1 a {width:151px; background-position: 0px 0px} .payset_page1 .m1 a:hover {width:151px; background-position: 0px -42px} .payset_page1 .m2 a {width:151px; background-position:-157px 0px} .payset_page1 .m2 a:hover {width:151px; background-position: -157px -42px} .payset_page1 .m3 a {width:151px; background-position:-314px 0px} .payset_page1 .m3 a:hover {width:151px; background-position: -314px -42px} .payset_page1 .m4 a {width:151px; background-position:-471px 0px} .payset_page1 .m4 a:hover {width:151px; background-position: -471px -42px} .payset_page1 .m5 a {width:151px; background-position:-628px 0px} .payset_page1 .m5 a:hover {width:151px; background-position:-628px -42px} .payset_page2 {overflow:hidden; margin:0 auto; text-align:center; } .payset_page2_s {overflow:hidden;list-style:none;float:left;margin:0;padding:0;} .payset_page2_s li {float:left;width:151px; margin-right:6px;} .payset_page2_s li a span {display:none;} .payset_page2_s li a { background:url('http://vegadisk.com/images/charge/chargeok_btn_set2_new.gif') no-repeat} .payset_page2_s li a {height:41px;width:151px;display:block;} .payset_page2 .m1 a {width:151px; background-position: 0px 0px} .payset_page2 .m1 a:hover {width:151px; background-position: 0px -42px} .payset_page2 .m2 a {width:151px; background-position:-157px 0px} .payset_page2 .m2 a:hover {width:151px; background-position: -157px -42px} .payset_page2 .m3 a {width:151px; background-position:-314px 0px} .payset_page2 .m3 a:hover {width:151px; background-position: -314px -42px} .payset_page2 .m4 a {width:151px; background-position:-471px 0px} .payset_page2 .m4 a:hover {width:151px; background-position: -471px -42px} .payset_page2 .m5 a {width:151px; background-position:-628px 0px} .payset_page2 .m5 a:hover {width:151px; background-position:-628px -42px} .payset_page3 {margin:0 auto; } .payset_page3_s {list-style:none;float:left;margin:0;padding:0;} .payset_page3_s li {float:left; width:140px; text-align:center; margin-right:8px; margin-bottom:10px; padding:15px;} /* .payset_page3_s li:nth-child(6n) {margin-right:0px;} */ .payset_page3_s li a span {display:none;} .payset_page3_s li a { background:url('http://vegadisk.com/images/charge/chargeok_btn_set4_new.gif') no-repeat} .payset_page3_s li a {height:41px;width:151px;display:block;} .payset_page3 .m1 a {width:151px; background-position: 0px 0px} .payset_page3 .m1 a:hover {width:151px; background-position: 0px -42px} .payset_page3 .m2 a {width:151px; background-position:-157px 0px} .payset_page3 .m2 a:hover {width:151px; background-position: -157px -42px} .payset_page3 .m3 a {width:151px; background-position:-314px 0px} .payset_page3 .m3 a:hover {width:151px; background-position: -314px -42px} .payset_page3 .m4 a {width:151px; background-position:-471px 0px} .payset_page3 .m4 a:hover {width:151px; background-position: -471px -42px} .payset_page3 .m5 a {width:151px; background-position:-628px 0px} .payset_page3 .m5 a:hover {width:151px; background-position:-628px -42px} /*로그인 리뉴얼*/ .login_top {width:100%; height:5px; background-color:#222423; } .login1_table { background-image: url(/assets/img/www/loginbg.gif); background-repeat: repeat; width: 900px; margin: 0 auto; margin-bottom: 10px; border: solid 3px #c0c0c0; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 15px; margin-bottom: 5px; padding: 2px; text-align: center; } .login1_table img { margin-right: 5px; text-align: right; } .input_txt { width:150px; height:20px; border:1px #CCCCCC solid; margin:3px; font-size:1em; color:#ccc; } /*두쪽보기 하단*/ .comic_menu {width:712px; height:106px; text-align:center; position: absolute; margin-left:50%; left:-340px; bottom:10px; z-index:99;} .view_bottom_btn_2p {width:712px; height:106px; background-color:#000; opacity:0.7; text-align:center; position: absolute; top:0px;} .view_bottom_btn_2pup{width:680px; padding:30px 15px 30px 15px; text-align:center; position: absolute; } .view {width:100%; height:auto; margin:auto; position:relative; text-align:center;} /*프로그래스*/ .prograss {width:100px; height:8px;margin:auto; background-color:#ccc; } .Rectangle_46 { border-width: 2px; border-color: rgb( 241, 11, 41 ); border-style: solid; background-color: rgb( 255, 255, 255 ); position: absolute; left: 927px; top: 930px; width: 91px; height: 31px; z-index: 3; } /*두장보기*/ #img_wrap_btn {position:fixed; z-index:1; top:0; margin:0 auto; cursor:pointer;} #img_wrap_btn .btn_left{float:left; width:35%; height:100%; background: #FFF; opacity:0.0; filter: alpha(opacity = 0);} #img_wrap_btn .btn_center{float:left; width:30%; height:100%; background: #FFF; opacity:0.0; filter: alpha(opacity = 0);} #img_wrap_btn .btn_right{float:left; width:35%; height:100%; background: #FFF; opacity:0.0; filter: alpha(opacity = 0);} #img_wrap {position:absolute; z-index:0; top:0; margin:0 auto;} .view2p {height:80%;position:relative; text-align:center;} .view2p img{ max-width:35%;} /*3월24일 출판만화 */ .comics_book {width:100%; background-color:#efefef; clear:both;} .comics_book .comics_div {width:1200px; margin:auto; padding-bottom:20px;} /*4월9일 레이어팝업*/ .layer_popup {width:100%; position:absolute; top:189px; z-index:999; display:none;} .layer_popup_content {width:1000px; height:498px; position:relative; margin:auto;} .layer_popup_content .btn_close { width:41px; height:42px; position:absolute;left:925px; top:15px; cursor:pointer;} .layer_popup_content .icon { width:600px; height:42px; position:absolute; left:200px; top:320px;} /*4월10일 고객센터 */ .ctable_h { font-size: 2em;font-weight: bold; color: #333;} .ctable_h a{color: #CE0000; text-decoration:none;} .ctable_h a:hover{color:#CE0000;} .ctable_h_e {font-size: 2em;font-weight: bold;color: #333;} .ctable_h_e a{color: #333; text-decoration:none;} .ctable_h_e a:hover{color:#CE0000;} .faq_table .ctable { background:#f6f6f6;border-bottom:1px #e1e1e1 solid; display:none;} .faq_table .rtable{border-bottom:1px #ccc solid; font-size:1.1em; font-weight:bold; cursor:pointer;} .cselect { width:250px; height:20px; border:1px #e1e1e1 solid; } .cinput { width:98%; height:20px; border:1px #ccc solid; background:#fafafa;} .cinput_box { width:98%; height:300px; border:1px #ccc solid; background:#fafafa;} .qna_table {width:940px;} .qna_table td{ border-bottom:1px #e1e1e1 solid;} .alink {color:#CE0000} /*메인 로그인 배너*/ .banner { width:993px; height:420px; margin:auto; position:absolute;right:3px; padding-top:30px; z-index:3;} .banner .close { top:30px; right:0px; width:20px; height:20px; position:absolute; cursor:pointer;} .banner .check { top:35px; right:15px; position:absolute;} .banner .check img{ border:none; opacity:1;} .banner .check img:hover{ border:none; opacity:1;} /*회차 리스트 정렬*/ .list_arrow {width:1000px; margin:10px auto 0; text-align:right;} .auth_wrap {margin: 24px 0; height: 115px; background:url(/assets/img/www/adult_auth/phoneconfirm_banner.png) no-repeat 247px;} .auth_wrap p.auth_b {color:#ee2e1e; font-weight:800; font-size:17px; letter-spacing: -1px; padding-bottom: 3px; margin: auto; width: 210px; border-bottom: 1px solid #f54a3d;} .auth_wrap p.auth_s {color:#989898; font-weight:400; font-size:12px; padding: 6px 0 10px; letter-spacing: -1px; padding: 59px 2px 0px 272px; width: 250px;} .auth_wrap > span {margin-left: 471px;} /*쿠폰*/ .coupon_con {position:relative;} .coupon_con .coupon .coupon_input {position:absolute; top:333px; right:31px;} .coupon_con .coupon .coupon_input #coupon_number {width:300px; height:45px;} /*별점*/ .i_star_point {background-image:url(/assets/img/mobile/star2.png); margin-top:-2px;} .i_star_point[data-val='0'] {width:80px; height:15px; background-position: -0px -0px; display:inline-block;} .i_star_point[data-val='1'] {width:80px; height:15px; background-position: -0px -15px; display:inline-block;} .i_star_point[data-val='2'] {width:80px; height:15px; background-position: -0px -30px; display:inline-block;} .i_star_point[data-val='3'] {width:80px; height:15px; background-position: -0px -45px; display:inline-block;} .i_star_point[data-val='4'] {width:80px; height:15px; background-position: -0px -60px; display:inline-block;} .i_star_point[data-val='5'] {width:80px; height:15px; background-position: -0px -75px; display:inline-block;} .i_star_point[data-val='6'] {width:80px; height:15px; background-position: -0px -90px; display:inline-block;} .i_star_point[data-val='7'] {width:80px; height:15px; background-position: -0px -105px; display:inline-block;} .i_star_point[data-val='8'] {width:80px; height:15px; background-position: -0px -120px; display:inline-block;} .i_star_point[data-val='9'] {width:80px; height:15px; background-position: -0px -135px; display:inline-block;} .i_star_point[data-val='10'] {width:80px; height:15px; background-position: -0px -150px; display:inline-block;} .i_star_point_num {margin-right:50px;} .orange{color : #ff4637;} /*웹소설 뷰어 css*/ .content{width : 640px;border: 1px solid #ddd;padding-left : 48px; padding-right : 48px;margin : 48px auto;background-color: #fff;min-height:1000px;} .content_col{padding : 48px 48px;} .content p{clear: left;font-size : 14px;white-space: pre-wrap;word-wrap: break-word;line-height: 25px;} .content div{clear: left;font-size: 14px;white-space: normal;word-wrap: break-word;line-height: 130%;margin: 24px 0;} .content img{margin: auto;max-width : 100%;} .content h1,h2,h3,h4,h5,h6{font-weight: 800;border-bottom: 1px solid #ccc;padding-bottom: 24px;margin-bottom: 24px;} .content .txt_head{font-size: 20px;font-weight: 800;border-bottom: 1px solid #ccc;padding-bottom: 24px;margin-bottom: 24px;} /* input type text */ .input_text {width:240px; height:35px; font-family:'NanumGothic', '나눔고딕','nng', '맑은 고딕', 'Malgun Gothic', Dotum, AppleGothic, sans-serif; font-size:14px; color:#333; line-height:18px; padding-left:10px;} /*사이즈*/ .content .txt_large{font-size:24px;} .content .txt_normal{font-size:14px;} .content .txt_small{font-size:8px;} /*색상*/ .content .txt_green{color:#1abc9c;} .content .txt_orange{color:#e67e22;} .content .txt_red{color:#e74c3c;} .content .txt_blue{color:#3498db;} .content .txt_purple{color:#9b59b6;} .content .txt_gray{color:#7f8c8d;} /*두께*/ .content .txt_bold{font-weight:800;} .content .txt_medium{font-weight:400;} .content .txt_light{font-weight:100;} /*말풍선*/ .content .txt_bubble,.content .talk{float: left;clear: left;position: relative;border: 1px solid #ccc;display: inline-block;vertical-align: middle;padding: 8px;word-break: break-all;box-shadow: 0px 0px 4px 0px rgba(12, 12, 12, 0.1);} .content .txt_bubble:before,.content .talk:before{top: 10px;bottom: auto;left: -13px;border-width: 6px 12px 6px 0;border-color: transparent #ccc;content: "";position: absolute;border-style: solid;display: block;width: 0;} .content .txt_bubble:after,.content .talk:after{top: 10px;bottom: auto;left: -11px;border-width: 6px 12px 6px 0;border-color: transparent #fff;content: "";position: absolute;border-style: solid;display: block;width: 0;} .content .txt_bubble img,.content .talk img{position: absolute;left: -50px;top: 6px;border-radius: 24px;width : 36px;height : 36px;} /*정렬*/ .content .txt_left{text-align:left;} .content .txt_right{text-align:right;} .content .txt_center{text-align:center;} /*이미지*/ .content .pic{box-shadow: 0px 0px 4px 0px rgba(12, 12, 12, 0.1); max-width : 100%; padding: 8px;border: 1px solid #ddd;white-space: normal;display : inline-block; } .ch_list {position: fixed;display: none;z-index: 9;list-style-type: none;overflow-y: auto;border: 1px solid #ddd;padding: 0;margin: auto;max-height: 480px;background-color: rgba(255,255,255,0.98);min-width: 300px;left: 50%;margin-top: -2px;} .ch_list li{position: relative;margin: auto;font-size: 14px;padding: 8px 16px;border-top: 1px solid #eee;line-height: 24px;height: 24px;text-align: left;} .ch_list li:first-child{border:none;} .ch_list li:hover{background-color: #ff4637;} .ch_list li a{display:block;} .ch_list li:hover a{color : #fff;} .ch_list li a:hover{color : #fff;} .ch_list ul{list-style-type: none;padding-left:24px;} .ch_list ul li{padding : 8px;font-size:12px;border:none;line-height:18px;height:18px;} .ch_list li .ico_lock {width: 37px;height: 37px;background-image: url(/assets/img/mobile/image.png);background-position: -0px -186px;position: absolute;top: 0;right: 0;z-index: 99;-moz-transform: scaleX(-1);-o-transform: scaleX(-1);-webkit-transform: scaleX(-1);transform: scaleX(-1);filter: FlipH;-ms-filter: "FlipH";} .bottom_ctrl{position: fixed;bottom: 0px;width: 100%;margin: auto;text-align: center;padding: 8px;background-color: rgba(255,255,255,0.98);border-top: 1px #e1e1e1 solid;} .right_ctrl{position: fixed;bottom: 20%;right: 0px;background: white;padding: 8px;background-color: rgba(255,255,255,0.95);box-shadow: 0 0 12px 0 rgba(0,0,0,0.3);border-radius: 8px 0 0 8px;} .right_ctrl .btn {cursor: pointer;line-height: 32px;height: 32px;width: 32px;text-align: center;font-size: 14px;display: block;float: left;margin-right: 6px;font-weight: bold;color: #333;border: 1px solid #ddd;} .right_ctrl .btn:hover {color : #ff4637;} .navbtn{width: 32px;height: 32px;display: block;cursor: pointer;position: fixed;top : 50%;} .progress_bar_area{background-color: #fff;margin : auto;box-shadow: 0px 0px 4px 0px rgba(12, 12, 12, 0.3);} .progress_per{margin-top : 8px;font-size: 14px;} /*장르*/ .view-genre .clear {clear:both;margin-bottom:16px} .view-genre {width:1000px;margin:auto;min-height: 800px;margin-top:130px} .view-genre .genre_row{background-color:#fff;margin-bottom:16px;overflow:hidden;} .view-genre .sub-title {width:1000px; border-bottom:2px solid #e1e1e1; color:#333; font-weight:900; font-size:18px; line-height:36px;} .view-genre .sub-title .title-bar {width:1px; height:13px; background-color:#ccc; display:inline-block; margin:2px 6px 0;} .view-genre .sub-title .sub-stitle {font-size:12px; color:#666;} .view-genre .thumb-box {width:306px; height:146px; border:1px solid #ccc; border-radius:5px; float:left; margin:10px 5px 0 5px; padding:7px;} .view-genre .thumb-box:hover{color:inherit;opacity: 0.8} .view-genre .box-last {margin-right:0; float:right;} .view-genre .thumb-box .thumb-img {width:120px; height:145px; float:left; position:relative;} .view-genre .thumb-box .thumb-img .icon-new {width:36px; height:36px; position:absolute; bottom:0; right:0; background-image:url(icon_new.png); z-index:2;} .view-genre .thumb-box .thumb-img img {width:120px; height:145px; position:absolute; top:0; left:0; z-index:1;} .view-genre .thumb-box .thumb-img .icon-up {color:#ff6a1d; font-weight:900; font-size:10px; z-index:2; background-color:#fff; position:absolute; top:10px; right:10px; outline:none; border:1px solid #ff6a1d; padding:0px 5px; border-radius:15px;} .view-genre .thumb-box .txt-box {width:160px; float:left; margin-left:25px; line-height:18px; position:relative;} .view-genre .thumb-box .txt-box .txt-title {font-size:14px; font-weight:900; color:#333; line-height:28px; padding:0; margin:0;white-space: nowrap;text-overflow: ellipsis;overflow: hidden;} .view-genre .thumb-box .txt-box span{display: block;height: 64px;overflow: hidden;text-overflow: ellipsis;} .view-genre .thumb-box .txt-box .txt-desc div{font-size: 11px !important;line-height: 16px !important} .view-genre .thumb-box .txt-box .icon-adult {color:#ffbd76; font-weight:900; font-size:11px; z-index:2; background-color:#fff;outline:none; border:1px solid #ffbd76; padding:0px 3px; border-radius:12px; letter-spacing:-1px; margin-left:2px;position: relative;top: -1px;line-height: 15px} .view-genre .thumb-box .txt-box .icon-star {margin:3px 0;} .view-genre .thumb-box .txt-box .i_star_point {margin-top:4px;} .view-genre .thumb-box .txt-box button.all-view {position:absolute; top:120px; left:0; z-index:3; border-radius:5px; border:1px solid #ccc; color:#666; padding:3px 10px; background-color:#fff;} .view-genre .thumb-box .txt-box button.all-view {font-family:"Nanum Gothic", sans-serif; outline:none; letter-spacing:-1px; font-weight:900; cursor:pointer;} .view-genre .genre-list{color: #333;font-weight: 400;font-size: 13px;line-height: 36px;margin-top: -38px;float: left;margin-left: 242px;} .view-genre .genre-list span{padding:4px 0;cursor:pointer;z-index:2;} .view-genre .genre-list span:after {content:'';width:1px; height:13px; background-color:#ccc; display:inline-block; margin:2px 6px 0;} .view-genre .genre-list span:last-child:after{display:none;} .view-genre .genre-list span.on{color:#f54a3d;} .view-genre .sort-ctrl{float: right;margin-top: -28px;font-size: 14px;width:307px;text-align: right} .view-genre .sort-ctrl span{padding:4px 12px;cursor:pointer;z-index:2;} .view-genre .sort-ctrl span.on{color:#fff;background-color: #f54a3d;border-radius: 16px;} /* 소셜 로그인 */ .sns_login a{height: 45px;line-height: 45px;width: 256px;display: block;position: relative;margin-bottom: 12px;box-shadow: 0 1px 2px rgba(0,0,0,.4);opacity:0.85;} .sns_login a:after{} .sns_login a:hover{opacity:0.6} .sns_login a.facebook{background-color: rgba(59,89,152,1);} .sns_login a.naver{background-color: #1ec800;} .sns_login a.google{background-color: rgba(217,62,44,1);} .sns_login a img{width: 45px;height: 45px;position: absolute;left: 0;} .sns_login a span.sns-content{text-shadow: 1px 1px rgba(0,0,0,.2), -1px -1px rgba(0,0,0,.2);font-weight: 400;font-size: 16px;color: #fff;position: absolute;left: 58px;} .sns_login a span.sns-content:before{content: "";width: 1px;height: 32px;display: block;position: absolute;background-color: rgba(255,255,255,.6);top: 8px;left: -8px;} /*이벤트*/ .event_top{width:1200px; height:70px; border-bottom:3px solid #f54a3d; position:relative;} .event_top h1{position:absolute; top:5px; left:0; padding:0; margin:0;} .event_top ul.tabs{position:absolute; bottom:0; right:0; padding:0; margin:0;} .event_top .tabs li{width:110px; height:40px; line-height:40px; list-style:none; float:left; text-align:center; padding:0; margin:0; background:#353746; font-size:14px; font-weight:bold; border-right:1px solid #252734; border-left:1px solid #484a56;} .event_top .tabs li:last-child{border-right:1px solid #353746;} .event_top .tabs li a{display:block; color:#b9bdd4; text-decoration:none;} .event_top .tabs li.on{background:#f54a3d; border-color:#f54a3d;} .event_top .tabs li.on a{color:#fff;} .event-content{padding:0; margin:0;} .event-content li{list-style:none; padding:0; margin:0; border-bottom:1px solid #ccc;} .event-content li span.event_thumb{top:0; left:0; width:250px; height:125px; background-size:100%; float:left; margin:15px 0;} .event-content li ul.list_contents{width:600px; height:125px; line-height:30px; float:left; padding:0; margin:15px 0 0 30px; font-size:14px;} .event-content li ul.list_contents li{border-bottom:0;} .event-content li ul.list_contents span.name-tag{background:#aaa; font-weight:bold; color:#fff; padding:2px 10px; border-radius:3px; margin-right:10px;} .event-content li a.btn_view_event{float:right; display:block; border-radius:3px; padding:10px 40px; background:#f54a3d; color:#fff; font-weight:bold; font-size:16px; letter-spacing:-1px; margin-top:55px;} /*탑툰마일리지결제 팝업*/ .pop_mileage {width:100%; height:240px;} /*SIZE*/ .pop_mileage .pop_header {width:100%; padding:7px 20px; background-color:#f54a3d; color:#fff; font-weight: bold; font-size:14px;} .pop_mileage .pop_content {width:100%; padding:10px 20px; text-align:center;} .pop_mileage .pop_content table {width:90%; border-top: 2px solid #f54a3d; border-collapse: collapse; padding:0;} .pop_mileage .pop_content table td, .pop_mileage .pop_content table th {border-bottom:1px solid #ccc; font-size:12px; text-align:left; padding:6px 0px 6px 10px;} .pop_mileage .pop_content table td.select_td {color:#f54a3d; font-weight:bold;} .pop_mileage .pop_content table th {background-color:#ebebeb; width:120px;} .pop_mileage .pop_content button {width:auto; padding:5px 20px; text-align:center; border:none; font-size:12px; font-weight: bold; background-color:#ff4637; color:#fff; margin-top:15px; border-radius:20px; cursor:pointer;} .pop_mileage .pop_content ul.discription {font-size:12px; text-align:left; line-height:16px; margin-top:10px;} /* 추가버튼 150209 */ .btn_qna_write {background-color:#f54a3d; color:#fff; font-weight: bold; padding:13px 20px; margin-top:15px; border-radius:3px; -webkit-border-radius:3px; -moz-border-radius:3px;} .btn_qna_write_cancle {background-color:#ccc; color:#444;} /*150121 고객센터 리뉴얼*/ .cs_top{width:940px; height:165px; position:relative; margin:60px 0 45px; background:url(/assets/img/www/cs_top.png) no-repeat;} .cs_faq_search{width:365px; height:46px; position:absolute; bottom:5px; right:50px; background:#e1e1e1; line-height:50px; padding-left:10px; color:#888; font-size:14px; border:1px solid #f2f2f2; } .cs_faq_btn{width:50px; height:50px; position:absolute; bottom:5px; right:0px; background:url(/assets/img/www/cs_icon_search.jpg) no-repeat center center #f84914;} ul.cs_tab {width:940px; height:45px; border:1px solid #ddd; list-style:none; padding:0; margin-bottom:30px;} ul.cs_tab li{float:left; width:312px; height:45px; line-height:45px; border-left:1px solid #ddd;} ul.cs_tab li:first-child{border-left:0;} ul.cs_tab li a{display:block; color:#000; font-size:14px; text-align: center; font-weight:bold; letter-spacing: -1px; cursor:pointer;} ul.cs_tab li a.on{background-color:#fe330b; color:#fff;} ul.faq_category{width:910px; background:#f6f6f6; padding:0; margin-top:-30px; margin-bottom:30px; border:1px solid #ddd; border-top:0; text-align:left; padding:0 20px 0 10px;} ul.faq_category li{display:inline-block; height:45px; line-height:45px;} ul.faq_category li a{display:block; padding:0 10px; cursor:pointer;} ul.faq_category li a.on{color:#fe330b; text-decoration:underline; font-weight:bold;} .cs_top #recom_list {position:absolute;bottom:-28px;right:0;width:420px;height:28px;text-align:left;padding:0;margin:0;overflow:hidden;} .cs_top #recom_list li {margin:0;padding:0;width:100%;height:28px;line-height:28px;font-size:1.1em;font-weight:bold;overflow:hidden;cursor:pointer;} /*150123 고객센터 나의문의내역*/ .myqna_list {width:940px; padding-bottom:30px;} .myqna_list .qna_list_table {width:940px; border-top:1px solid #e1e1e1; border-bottom:1px solid #e1e1e1; border-collapse:collapse; border-spacing:0; padding:0;} .myqna_list .qna_list_table th {background:#eee; font-size:12px; font-weight: bold; padding:10px 0; } .myqna_list .qna_list_table th, .myqna_list .qna_list_table td {border-bottom:1px solid #e1e1e1; text-align:center;} .myqna_list .qna_list_table td{padding:15px 0;} .myqna_list .qna_list_table .qna_list_title {text-align:left;} .myqna_list .qna_list_table .qna_view_table {width:1000px;} .myqna_list .qna_list_table .ctable { display:none;} .myqna_list .qna_list_table .rtable{ cursor:pointer;} .myqna_list .qna_answer {text-align:left; background-color:#f7f7f7; padding:15px 0px;} .myqna_list .qna_answer .my_q {background:url(/assets/img/www/qna_q.jpg) no-repeat 100px 0px; padding:0 100px 10px 130px;} .myqna_list .qna_answer .qna_line {width:100%; height:1px; background-color:#e1e1e1;} .myqna_list .qna_answer .cs_a {background:url(/assets/img/www/qna_a.jpg) no-repeat 100px 20px; padding:20px 100px 0px 130px;} .myqna_list .qna_answer .cs_a span.evaluation {width:100%; padding-top:20px; display:block;} .myqna_list .qna_complete, .myqna_list .qna_open {color:#f54a3d; font-weight: bold;;} .myqna_list .btn_qna_write {background-color:#f84914; color:#fff; font-weight: bold; float:right; padding:8px 15px; margin-top:15px;} .myqna_list .qna_list_table .qna_del {text-align:center; margin:auto; cursor:pointer; display:block; width:13px; height:13px; background:url(/assets/img/www/qna_delete.jpg) no-repeat;} /*charge renewal 150304*/ .charge_bookbg{width:1000px; height:200px; font-weight:bold; font-family:arial, tahoma, sans-serif; font-size:54px; color:#fb4b32; letter-spacing:-4px; background:url(/assets/img/www/charge_book2.jpg) no-repeat;} .charge_bookbg img{vertical-align:middle; margin:0 0 7px 5px;} .charge_bookbg p.user_coin_info{width:400px; float:left; text-align:left; padding: 56px 0 0 59px; margin:0;} .charge_bookbg p.user_dc{width:300px; float:right; text-align:left; padding:70px 0px 0 200px; margin:0;} /*충전소 테이블 150304*/ .charge_wrap_re{background:#fff;} .charge_wrap_re span.t_orange{color:#fb4b32;} .charge_wrap_re span.t_black{color:#828282;} .charge_wrap_re .charg_table{width:860px; border-collapse:collapse; padding:0; margin:0 auto; background:#FFF;} .charge_wrap_re .charg_table tr.select_line{background:#fff6f5;} .charge_wrap_re .charg_table td{height:60px; line-height:60px; vertical-align:middle; border-bottom:1px solid #e5e5e5; padding:0; text-align:right; cursor:pointer; font-weight:bold;font-size:16px} .charge_wrap_re .charg_table td.old_price{color:#d5d5d5; text-decoration:line-through;} .charge_wrap_re .charg_table td.price1{padding-right:30px;} .charge_wrap_re .charg_table td.coin{text-align:left;} .charge_wrap_re .charg_table td.coin img{margin-right:10px;} .charge_wrap_re .charg_table span.dc{background-color:#fb4b32; text-align:center; border-radius:25px; color:#fff; font-size:12px; font-weight:bold; padding:3px 8px; margin:5px; letter-spacing:-1px;} .charge_wrap_re .charg_table td.payment_info{text-align:center;background:#fefdef; font-size:18px; border-bottom:none;} .charge_wrap_re .charg_table td.payment_info img{margin:0 6px 3px;} .step_2 .charg_table td{height:60px; line-height:60px; vertical-align:middle; border-bottom:1px solid #e5e5e5; padding:0; text-align:right; cursor:pointer; font-weight:bold;font-size:16px} .step_2 .charg_table td.payment_info{text-align:center;background:#fefdef; font-size:18px; border-bottom:none;} .step_2 .charg_table td.payment_info img{margin:0 6px 3px;} a.help_mileage{float:right; color:#000; font-size:14px; text-decoration:none; margin:10px 20px 0 0; font-weight:bold;} button.charge_re2{margin:auto; padding:20px 90px; border:none; background:#363a48; font-size:18px; font-weight:bold; color:#fff; border-radius:5px;} button.charge_re2:hover{opacity:.9;} .user_mileage_per{width:830px; height:35px; line-height:35px; margin:auto; background:#f7f7f7; border-bottom:1px solid #e5e5e5; padding-left:30px; text-align:left; font-size:14px; font-weight:bold;} /*연재제안 팝업*/ .propose{width:450px; padding:10px 20px 10px; background:#fff; border:1px solid #ddd; box-shadow:0px 3px 5px -1px rgba(0,0,0,0.3); position:fixed; top:50%; left:50%; border-radius:5px; margin:-200px 0 0 -245px; text-align:center; z-index:999; display:none;} .propose h1{font-size:20px; line-height:24px; font-weight:bold; color:#333; text-align:left;} .propose .pop_contents{font-size:14px; line-height:22px; text-align:left;} .propose .pop_contents a.propose_mail{color:#f54a3d; text-decoration:none; font-weight:bold;} .propose .pop_contents a.propose_mail{text-decoration:underline;} .propose .btn_area{width:100%; margin:auto; text-align:center;} .propose .btn_area a{display:inline-block; width:90px; text-align:center; border-radius:5px; padding:5px 15px; margin:20px 5px; cursor:pointer; font-weight:bold;} .propose .btn_area a.btn{border:1px solid #ccc; background:#fff; color:#333;} /* 연재제안 팝업 2015-05-12*/ .alert_popup02{width:500px; height:230px; background:#fff; border-radius:7px;} .alert_popup02 h1{width:100%; height:34px; text-align:center; font-size:14px; font-weight:bold; position:relative; border-bottom:1px solid #f33c3a; color:#f33c3a; padding:0; margin:0;} .alert_popup02 h1 span{line-height:34px;} .alert_popup02 h1 a{position:absolute; top:10px; right:15px;} .alert_popup02 .info_popup{background:#fff; width:100%; text-align:center; padding:15px 0 30px; border-bottom-left-radius:7px; border-bottom-right-radius:7px;} .alert_popup02 .info_popup p{font-size:14px; line-height:21px; margin-bottom: 38px;} .alert_popup02 .info_popup p a.propose_mail{color:#f54a3d; text-decoration:none; font-weight:bold;} .alert_popup02 .info_popup p a.propose_mail{text-decoration:underline;} .alert_popup02 .info_popup label{width:100%; display:block; text-align:center; padding:0; margin:0 auto 20px;} /* /*마이페이지 150317*/ .top_mypage{width:1200px; height:70px; border-bottom:3px solid #f54a3d; position:relative; margin:auto;} .top_mypage h1{position:absolute; top:5px; left:0; padding:0; margin:0;} .top_mypage ul.mypage_tab{position:absolute; bottom:0; right:0; padding:0; margin:0;} .top_mypage ul.mypage_tab li{width:110px; height:40px; line-height:40px; list-style:none; float:left; text-align:center; padding:0; margin:0; background:#353746; font-size:14px; font-weight:bold; border-right:1px solid #252734; border-left:1px solid #484a56;} .top_mypage ul.mypage_tab li:last-child{border-right:1px solid #353746;} .top_mypage ul.mypage_tab li.on{background:#f54a3d; border-color:#f54a3d;} .top_mypage ul.mypage_tab li.on a{color:#fff;} .top_mypage ul.mypage_tab li a{display:block; color:#b9bdd4; text-decoration:none;} .myinfo{width:1200px; background:#fff;} /*마이페이지 15-12-09 이벤트코인 기간만료 알림*/ .myinfo ul.use_list{width:1200px; margin:0; padding:0;border-bottom: 1px solid #ccc;} .myinfo ul.use_list li{display:block; list-style:none; width:299px; height:100px; float:left; border-right:1px dashed #ccc; font-size:14px; color:#353746; text-align:center; margin:20px 0; position:relative;} .myinfo ul.use_list li+li+li+li{width:300px; border-right:0;} .myinfo ul.use_list p{padding:0; margin:0;} .myinfo ul.use_list p.use_list_title{font-size:16px; font-weight:bold; margin-bottom:15px;} .myinfo ul.use_list p.use_list_title img{display:inline-block; margin-right:5px;} .myinfo ul.use_list p.coin{color:#f54a3d; font-size:12px;} .myinfo ul.use_list p.coin span.num{font-family:tahoma, arial, sans-serif; font-size:24px; font-weight:bold;} .myinfo ul.use_list a.use_list_btn{display:block; border:1px solid #ddd; border-radius:3px; height:22px; line-height:22px; font-size:11px; width:60px; position:absolute; bottom:0; left:50%; margin-left:-30px;} .myinfo ul.use_list .event_coin_day{height:22px; line-height:22px; font-size:11px; text-align:center; position:relative;} .myinfo ul.use_list .event_coin_day p{display:inline-block; margin-top:18px;} .myinfo ul.use_list .event_coin_day span, .myinfo ul.use_list .event_coin_day a{display:block; float:left;} .myinfo ul.use_list .event_coin_day span.dday{color:#fff; border-radius:15px; padding:15px; background:#f54a3d; height:18px; line-height:18px; padding:0 7px; font-size:10px; text-align:center; margin:1px 0 0 3px;} .myinfo ul.use_list .event_coin_day a.btn_helpicon{width:17px; height:17px; line-height:17px; border-radius:50%; border:1px solid #f54a3d; color:#f54a3d; font-size:10px; cursor:pointer; margin:1px 0 0 3px;} .myinfo ul.use_list .event_coin_day .bonuscoin_info_alert{position:absolute; top:45px; left:48px; border:2px solid #f54a3d; background:#fff; width:180px; text-align:left; padding:0 10px 10px; line-height:16px; display:none; z-index:10;} .myinfo ul.use_list .event_coin_day .bonuscoin_info_alert strong{line-height:30px; color:#333; border-bottom:1px solid #333;} .myinfo ul.use_list .event_coin_day .bonuscoin_info_alert a.help_close{width:20px; height:20px; display:block; position:absolute; top:0px; right:0px; background:url(/assets/img/www/mypage/layer_close_x.png) no-repeat center center; cursor:pointer; text-align:center;} .btn_autopay_helpicon{width:17px; height:17px; line-height:17px; border-radius:50%; border:1px solid #fd4243; color:#fd4243; font-size:10px; cursor:pointer; margin:1px 0 0 3px; display:block;position: relative;float: left;text-align: center;} .autopay_info_alert{font-size: 11px;position:absolute; top:650px; left:320px; border:2px solid #fd4243; background:#fff; width:180px; text-align:left; padding:0 10px 10px; line-height:16px; display:none;} .autopay_info_alert strong{line-height:30px; color:#333; border-bottom:1px solid #333;} .autopay_info_alert a.help_close{width:20px; height:20px; display:block; position:absolute; top:0px; right:0px; background:url(/assets/img/www/mypage/layer_close_x.png) no-repeat center center; cursor:pointer; text-align:center;} .autopay_info_alert_renewal {font-size: 11px;position:absolute; top:0; left:120px; border:2px solid #fd4243; background:#fff; width:180px; text-align:left; padding:0 10px 10px; line-height:16px; display:none;z-index:1;} .autopay_info_alert_renewal strong{line-height:30px; color:#333; border-bottom:1px solid #333;} .autopay_info_alert_renewal a.help_close{width:20px; height:20px; display:block; position:absolute; top:0px; right:0px; background:url(/assets/img/www/mypage/layer_close_x.png) no-repeat center center; cursor:pointer; text-align:center;} .myinfo table.account{width:1200px; border:0; border-collapse:collapse; padding:0; border-top:1px solid #ccc; font-size:12px; background:#fff;} .myinfo table.account input{border:1px solid #dadada; width:150px; height:23px; line-height:23px; padding:0 5px; margin-right:10px;} .myinfo table.account th{width:140px; background:#eee;} .myinfo table.account th, .myinfo table.account td{border-bottom:1px solid #ccc; height:40px; line-height:40px; padding-left:20px;} .myinfo table.account td{background:#fafafa;} .txt_point{color:#f54a3d; font-weight:bold;} .myinfo .btn{display:inline-block; cursor:pointer; letter-spacing:-1px; font-weight:bold; border-radius:3px; margin:0 2px;} .myinfo .btn_bluegray{border:1px solid #7b7f87; background:#999baa; color:#fff; font-size:11px; padding:2px 7px; line-height:16px; font-weight:normal;} .myinfo .btn_red{background:#fe4824; color:#fff; border:1px solid #fe4824; padding:0px 10px; height:22px; line-height:21px;} .myinfo .btn_white{border:1px solid #dadada; background:#fff; color:#333; padding:0px 10px; height:22px; line-height:21px;} .mypage_board{width:100%; margin-top:35px; position:relative;} .mypage_board h2{margin:0 0 15px 0; padding:0; border:0;} .mypage_board table{width:100%; border-collapse:collapse; padding:0; border:0; border-top:1px solid #ccc; font-size:12px;} .mypage_board table .qna_del, .mypage_board table .idea_del {text-align:center; margin:auto; cursor:pointer; display:block; width:13px; height:13px; background:url(/assets/img/www/qna_delete.jpg) no-repeat;} .mypage_board table .message_del {text-align:center; margin:auto; cursor:pointer; display:block; width:13px; height:13px; background:url(/assets/img/www/message_delete.jpg) no-repeat;} .mypage_board table .log_coin_point_del {text-align:center; margin:auto; cursor:pointer; display:block; width:13px; height:13px; background:url(/assets/img/www/qna_delete.jpg) no-repeat;} .mypage_board table th{background:#eee; text-align:center; font-weight:bold;} .mypage_board table th, .mypage_board table td{height:35px; line-height:35px; border-bottom:1px solid #ccc; text-align:center;} .mypage_board table td a{display:block;} .mypage_board table td.title{text-align:left; padding-left:20px;} .mypage_board .btn_cs{position:absolute; bottom:-2px; right:0; width:110px; height:30px; background:#ccc; background:#fe4824; color:#fff; padding:0px 10px; line-height:30px; border-radius:3px; text-align:center; font-weight:bold; font-size:14px; cursor:pointer;} .mypage_board .qna_answer {text-align:left; background-color:#f7f7f7; padding:0px; line-height:18px;} .mypage_board .qna_answer .my_q {background:url(/assets/img/www/qna_q.jpg) no-repeat 140px 10px; padding:7px 100px 10px 170px;} .mypage_board .qna_answer .qna_line {width:100%; height:1px; background-color:#e1e1e1;} .mypage_board .qna_answer .cs_a {background:url(/assets/img/www/qna_a.jpg) no-repeat 140px 10px; padding:7px 100px 10px 170px;} .paging{width:1060px; height:25px; text-align:center; margin:20px auto 50px;} a.page_num{display:inline-block; width:25px; height:25px; line-height:25px; text-align:center; font-family:tahoma, arial, sans-serif; font-weight:bold; color:#333; font-size:12px; margin:0 1px;} a.page_num.on{background:#f54a3d; color:#fff;} a.page_num.arrow{background:#ccc; color:#fff; font-size:11px;} /*마이페이지 게시판 탭 150318*/ .board_subtab{width:1000px; height:34px; padding-top:30px; position:relative;} .board_subtab ul.bigmenu{position:absolute; bottom:-1px; right:0; padding:0; margin:0;} .board_subtab ul.bigmenu li{width:110px; height:34px; line-height:32px; list-style:none; float:left; margin:0; padding:0; text-align:center; border:1px solid #ccc; font-size:14px; font-weight:bold;} .board_subtab ul.bigmenu li+li{border-left:0;} .board_subtab ul.bigmenu li a{width:108px; height:33px; display:block; border-top:1px solid #fff; border-left:1px solid #fff; border-right:1px solid #fff; color:#626262;} .board_subtab ul.bigmenu li a.on{color:#f54a3d; background:#f7f7f7; border-bottom:1px solid #f7f7f7;} /*마이페이지 마일리지 풍선 150319*/ .mypage_alert_mileage{width:125px; height:68px; background:url(/assets/img/www/mypage/alert_mileage.png) no-repeat; position:absolute; top: -80px; right: 410px; z-index:2; color:#fff; text-align:center; font-size:12px; line-height:20px; padding:20px 0px 0 0; letter-spacing:-1px;} .mypage_alert_mileage span{font-family:arial, sans-serif; font-size:20px; font-weight:400; color:#f8ff2b; letter-spacing:0px;} /*썸네일 아이콘*/ .index_new .rank_best{width:38px; height:35px; position:absolute; top:0; left:0; color:#fff; font-weight:bold; z-index:3; background:#f54a3d; text-align:center; font-size:10px; padding-top:3px;} .index_new .rank_best .rank_num{font-size:18px; font-family:arial, tahoma, sans-serif; padding:0; margin:0;} .index_new .new{display:inline-block; padding:0 5px 0; height:15px; line-height:14px; font-size:10px; font-weight:bold; color:#fff; border:2px solid #f54a3d; text-transform:uppercase; border-radius:15px; float:right; background:#f54a3d;} .index_new .update{display:inline-block; padding:0 5px 2px; height:12px; line-height:16px; font-size:10px; font-weight:bold; color:#f54a3d; border:2px solid #f54a3d; text-transform:uppercase; border-radius:15px; background:#fff; margin-left:5px;} .index_new .thumb_float{position:absolute; z-index:4; top:100px; right:0px;} .index_new .recommend_md{width:60px; height:60px; background:url(/assets/img/www/index_renewal/icon_recommend_md.png) no-repeat; position:absolute; top:77px; left:0; z-index:2; color:#ffffff; background-size:100%; } .index_new .recommend_md span.recommend_md01{font-size:11px; font-weight:bold; line-height:12px; padding:32px 0 0 5px; display:block;} /*MD추천 작은썸네일용*/ .recommend_md3{width:60px; height:60px; background:url(/assets/img/www/index_renewal/icon_recommend_md.png) no-repeat; position:absolute; bottom:43px; left:0; z-index:2; color:#ffffff; background-size:100%;} .recommend_md3 span.recommend_md01{font-size:11px; font-weight:bold; line-height:12px; padding:32px 0 0 5px; display:block;} .index_new .adult{width:20px; height:20px; background:#f54a3d; color:#fff; font-weight:bold; font-family:arial, tahoma, sans-serif; position:absolute; top:10px; right:10px; border-radius:20px; text-align:center; line-height:20px; letter-spacing:-1px; z-index:3;} .index_new .adult_mini{top:10px; right:10px;} .index_new .starpoint{position:absolute; bottom:12px; right:10px;} /*충전소 상단배너*/ .payment_bnr{width:1000px; margin:auto; position:relative;} .payment_bnr .payment_close_white{width:40px; height:40px; display:block; background:url(/assets/img/www/payment/payment_close_white.png); position:absolute; top:50%; right:50px; margin-top:-20px; cursor:pointer;} /*충전소 결제안내*/ .payment_notice{width:938px; margin:0 auto 30px; text-align:left; line-height:22px; background:#efefef; border-radius:10px; font-size:14px; padding:25px 30px; color:#363a48; border:1px solid #e5e5e5;} .payment_notice p{font-weight:bold; font-size:18px; font-weight:bold; padding:0 0 15px 0; margin:0; lin-height:32px;} /* 이벤트 페이지 */ .event {width: 1000px;margin: 0 auto;min-height: 640px;position: relative;top:12px;} .event ul {list-style-type: none;position: relative;padding : 0px;margin:0px;} .event .tabs {width: 100%;list-style: none;margin: 0;padding: 0;border-bottom: 2px solid #ef4234;height: 42px;} .event .tabs li {margin: 0;padding: 0;float: right;} .event .tabs li:first-child a {margin-right: 64px} .event .tabs li a{font-size: 14px;padding: 12px 24px;line-height: 42px;font-weight:700;} .event .tabs li.on a{color:#ef4234;border: 2px solid #ef4234;border-bottom: 3px solid #fff;} .event .event-content {clear:both} .event .event-content > li {position: relative;height : 164px;border-bottom: 1px solid #efefef;} .event .event-content > li > span {display : inline-block;width : 256px;height : 128px;margin : 18px;background-position: center center;background-repeat: no-repeat;background-size: cover;-webkit-box-shadow: 0px 0px 8px 0px rgba(12, 12, 12, 0.8);-moz-box-shadow: 0px 0px 8px 0px rgba(12, 12, 12, 0.8);box-shadow: 0px 0px 8px 0px rgba(12, 12, 12, 0.8);} .event .event-content > li > ul {position: absolute;top: 0;left: 274px;margin: 18px;line-height: 32px;font-size: 14px;} .event .event-content > li > ul li .name-tag {letter-spacing: 0px;color : #fff;padding : 4px;background-color: #ccc;margin-right : 8px;border-radius: 4px;text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);} .event .event-content > li > a {position: absolute;top: 50%;right: 0;color: #fff;padding: 12px 32px;margin-top: -26px;border-radius: 4px;background-color: #ef4234;font-size: 16px;letter-spacing: 0px;text-shadow: 0 -1px 0 rgba(0, 0, 0, .2);} /* 쿠폰등록 팝업 2015-05-22*/ .alert_popup03_wrap {width:535px; height:410px; position:relative; background:#fff; border:3px solid #150806; border-radius:3px;} .alert_popup03_wrap .alert_popup03 { padding:20px; } .alert_popup03_wrap .alert_popup03 .img00{position:absolute; top:38px; left:-91px; display:block; width:88px; height:105px; } .alert_popup03_wrap .alert_popup03 h1 {font-size:16px; font-weight:bold; color:#020303;} .alert_popup03_wrap .alert_popup03 h1 span {font-size:12px; color:#828181; } .alert_popup03_wrap a.btn img {position:absolute; top:16px; right:16px; } .alert_popup03_wrap .alert_popup03 h2 {display:block; color:#313339; font-size:24px; letter-spacing:-2px; font-weight: bold; border-bottom: none; padding: 0; margin:0;} .alert_popup03_wrap .alert_popup03 .coupon_num {background-color:#f7f7f7; border-top:1px solid #e3e4e8; position:relative; padding: 20px 0 15px 15px; margin-bottom: 20px;} .alert_popup03_wrap .alert_popup03 .coupon_num p {font-size:12px; color:#828181; letter-spacing:-2px; margin: 10px 0;} .alert_popup03_wrap .alert_popup03 .coupon_num a.btn_type8{ position:absolute; background:#f7f7f7; border:1px solid #313339; color:#313339; font-size:13px; text-align:center; text-decoration:none; top:71px; right:20px; width: 90px; height: 39px; display: block; line-height: 39px; padding: 0; margin:0;} .alert_popup03_wrap .alert_popup03 .coupon_num .coupon_input01 input, .alert_popup03_wrap .alert_popup03 .coupon_num .coupon_input01 a {vertical-align:middle;} .alert_popup03_wrap .alert_popup03 .coupon_num .coupon_input01 a.btn_type9 {background:#363a48; color:#fff; font-size:13px; font-weight:bold; text-align:center; padding:11px 12px 13px;} .alert_popup03_wrap .alert_popup03 .happy_num {background-color:#f7f7f7; position:relative; padding: 20px 0 15px 15px; } .alert_popup03_wrap .alert_popup03 .happy_num h2 { color:#f43232;} .alert_popup03_wrap .alert_popup03 .happy_num p { font-size:12px; color:#828181; letter-spacing:-2px; margin:10px 0; } .alert_popup03_wrap .alert_popup03 .happy_num a.btn_type8{ position:absolute; background:#f7f7f7; border:1px solid #313339; color:#313339; font-size:13px; text-align:center; text-decoration:none; top:71px; right:20px; width: 90px; height: 39px; display: block; line-height: 39px; padding: 0; margin:0; z-index:5;} .alert_popup03_wrap .alert_popup03 .happy_num img{ position:absolute; bottom:-3px; right:0px;} .alert_popup03_wrap .alert_popup03 .happy_num .happy_coupon_wrap {position:relative;} .alert_popup03_wrap .alert_popup03 .happy_num .happy_coupon01_wrap p {border:1px solid #ccc; background:#fff; width:255px; padding:5px 0; margin:0 0 4px;} .alert_popup03_wrap .alert_popup03 .happy_num .happy_coupon01_wrap p .tit {display:inline-block; width:50px;} .alert_popup03_wrap .alert_popup03 .happy_num .happy_coupon01_wrap p input[type=text] {border:none; height:26px; line-height:26px; margin:0 0 0 5px;} .alert_popup03_wrap .alert_popup03 .happy_num .happy_coupon01_wrap p span{text-align:left; color:#f43232; font-size:12px; line-height:12px; padding-left:15px;} .alert_popup03_wrap .alert_popup03 .happy_num .happy_coupon01_wrap a.btn_type9 {position:absolute; top:72px; left:275px; background:#363a48; color:#fff; font-size:13px; font-weight:bold; text-align:center; padding:12px 12px; text-decoration:none;} /* 의견제시하기 팝업 2015-06-05 */ .alert_comment_wrap {width:441px; height:280px; margin:0 auto; position:relative; overflow:hidden; background: #fff; border-radius:7px;} .alert_comment_wrap h3.comment {font-size:16px; letter-spacing:-1px;font-weight:bold; color:#f33c3a; text-align:center; height:3px; padding: 15px 0px 20px 0px; line-height:15px; border-bottom:1px solid #f33c3a;} .alert_comment_wrap p.txtarea {text-align:center;} .alert_comment_wrap textarea.suggest {font-size: 13px; width:349px; margin: 7px 0 5px 0; color:#8C8C8C; border:1px solid #CFCFCF; overflow:hidden; line-height:20px; padding: 15px; } .alert_comment_wrap .btn_ok_area {text-align:center; } .alert_comment_wrap .btn_ok_area a {cursor:pointer; text-decoration:none;} .alert_comment_wrap .btn_ok_area a.btn_cancel {display:inline-block; font-weight:bold; font-size:14px; color:#fff; background-color:#B2B2B2; width:100px; height:40px; line-height:40px; text-align:center;} .alert_comment_wrap .btn_ok_area a.btn_ok {display:inline-block; font-weight:bold; font-size:14px; color:#fff; background-color:#f33c3a; width:115px; height:44px; line-height:44px; text-align:center;} .alert_comment_wrap .btn_close {position:absolute; top:10px; right:15px;} /* 찜목록에 추가하기 2015-06-10*/ .alert_popup06{width:423px; background:#fff; position:relative; border-radius: 5px;} /*.alert_popup06 .close a{position:absolute; top:-11px; right:-5px; width:30px; height:30px; z-index: 5;text-align: center; background: #1a1a1a; border-radius: 100px;} .alert_popup06 .close img{width:47%; padding-top: 8px;}*/ .alert_popup06 .close a{ display: block; width: 30px; height: 30px; background: url(/assets/img/www/freecharge_bnr/freecharge_layer_close.png) no-repeat center center #e34949; position: absolute; top: 0px; right: 0px; background-size: 16px; cursor: pointer; z-index:100;} .info_popup03 .top_banner{width:100%; position:relative;} .info_popup03 .top_banner > span {text-shadow: 0 0 3px #0D0D0D; text-align:right; padding-right: 20px; width: 403px; display:block; height:48px; line-height:48px; font-size: 25px; color:#fff; font-weight:800; position:absolute; bottom:0; right:0; display:block; background: -moz-linear-gradient(top, rgba(0,0,0,0) 0%, rgba(0,0,0,0.65) 100%); /* FF3.6+ */ background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0)), color-stop(100%,rgba(0,0,0,0.65))); /* Chrome,Safari4+ */ background: -webkit-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Chrome10+,Safari5.1+ */ background: -o-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* Opera 11.10+ */ background: -ms-linear-gradient(top, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* IE10+ */ background: linear-gradient(to bottom, rgba(0,0,0,0) 0%,rgba(0,0,0,0.65) 100%); /* W3C */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */} .info_popup03 .top_banner img{width:100%; border-radius: 5px;} .info_popup03 p{font-size:14px; line-height:24px; text-align:center; margin: 4px 0; padding-top: 27px; font-weight: 600; color:#666666;;} .info_popup03 > p > span{color: #4668a4; font-weight: bold;} .info_popup03 label{float:left; text-align:left; padding-left:32px; color: #7C7C7C; padding-top: 20px;} .info_popup03 .btn_type9 {padding-bottom: 6px; margin:0 auto; background:none; width: 297px; padding:0;} .info_popup03 .btn_type9 a {width:47%; float:left; display: block;} .info_popup03 .btn_type9 a > img {width:100%;} /* T걸 팝업 2015-07-02*/ .alert_popup07{width:408px; height:209px; background:#fff;} .alert_popup07 h3.comment {margin-bottom: 0; font-size:14px; letter-spacing:-1px;font-weight:bold; color:#f33c3a; text-align:center; height:34px; padding:0px; line-height:34px; border-bottom:1px solid #f33c3a;} .alert_popup07 .info_popup07{background:#fff; width:100%; text-align:center; padding:15px 0 30px;} .alert_popup07 .info_popup07 p{font-weight: 500; font-size:13px; color:#2A2A2A;; letter-spacing: -1px; line-height:20px;} .alert_popup07 .info_popup07 .btn a.btn_ok {margin-top: 35px; display:inline-block; font-weight:bold; font-size:14px; color:#fff; background-color:#f33c3a; width:115px; height:44px; line-height:44px; text-align:center;} .alert_popup07 .btn_close {position:absolute; top:25px; right:15px;} /*fixed adult 2015-07-10*/ a.closeX{width:18px; height:18px; background:url(/assets/img/www/icon_alertbnr_close.png) no-repeat; position:absolute; top:15px; right:15px; display:block; z-index:5; cursor:pointer;} .alert_fixed_adult{width:350px; border:2px #292c35 solid; position:relative; margin:0 auto; background-color:#3a4555; z-index:4; border-radius:8px; font-size:14px; overflow:hidden;} .alert_fixed_adult .boxbg{position:absolute; top:0px; left:0; width:20%;} .alert_fixed_adult .boxbg img{width:100%;} .alert_fixed_adult .alert_title{color:#e9e8eb; font-weight:bold; display:block; margin-bottom:10px;} .alert_fixed_adult .alert_title span{color:#39a3fa;} .alert_fixed_adult .alert_content{width:95%; margin:20px auto 15px; text-align:center; line-height:20px;} .alert_fixed_adult .alert_content p.alert_txt{display:block; margin-bottom:15px; color:#e9e8eb;} .alert_fixed_adult .alert_content .alert_txt span.point{color:#f54a3d; text-decoration:underline; font-weight:900;} .alert_fixed_adult .alert_content a.alert_check{display:block; line-height:25px; height:25px; margin:auto; text-align:left; background-image:url(/assets/img/mobile/check02.png); background-position: -0px -25px; background-repeat:no-repeat; text-indent:27px; font-size:12px; color:#39a3fa;} .alert_fixed_adult .alert_content a.alert_check.on{background-position: -0px -0px;} .alert_fixed_adult .alert_content .btn_switch_bg{border-radius:20px; background:#292c35; width:130px; height:32px; margin:0 auto 20px;} .alert_fixed_adult .alert_content .btn_switch_bg a.switch{width:60px; height:26px; line-height:26px; color:#b2b7ca; display:inline-block; margin-top:3px; border-radius:20px; font-weight:bold;} .alert_fixed_adult .alert_content .btn_switch_bg a.switch.on{background:#000; color:#f54a3d; font-weight:900; background:-webkit-gradient(linear, left top, left bottom, color-stop(0.05, #4f6387), color-stop(1, #3e4d65)); background:-webkit-linear-gradient(top, #4f6387 5%, #3e4d65 100%); background:linear-gradient(to bottom, #4f6387 5%, #3e4d65 100%); } /* T걸 팝업 2015-07-15*/ .alert_popup08{ width: 713px; height: 615px; background: #fff; border-radius: 8px; overflow: auto; } .alert_popup08 h3.comment {margin-bottom: 0; font-size:14px; letter-spacing:-1px;font-weight:bold; color:#f33c3a; text-align:center; height:34px; padding:0px; line-height:34px; } .alert_popup08 .info_popup08{background:#fff; width:100%; text-align:center; padding:15px 0 30px; } .alert_popup08 .info_popup08 p{font-weight: 500; font-size:13px; color:#2A2A2A;; letter-spacing: -1px; line-height:20px;} .alert_popup08 .info_popup08 .btn a.btn_ok {margin-top: 0; display:inline-block; font-weight:bold; font-size:14px; color:#fff; background-color:#f33c3a; width:115px; height:44px; line-height:44px; text-align:center;} .alert_popup08 .btn_close {position:absolute; top:15px; right:15px;} /*s2contents 팝업 2015-10-12*/ .s2contents_popup {width:550px; height:550px; position:relative; margin: 0px auto; background:#e6e7e9; border-radius:12px;} .s2contents_popup > a.close { display:block; position: absolute; top:15px; right:17px; background: url(/assets/img/mobile/free/freeclose_icon.png) no-repeat; width:20px; height:20px; z-index:10;} /* 무료충전소 팝업 2015-09-02*/ .freecharge2_popup {width:986px; height:520px; position:relative; margin: 0px auto; background:#e6e7e9; border-radius:8px;} .freecharge2_popup > h1.txt {margin: 0 auto; padding-top: 130px; text-align:center; color:#333333; font-size:58px; letter-spacing:-1px; background:url(/assets/img/www/free/free_tit.png) no-repeat 50% 36px;} .freecharge2_popup > h1.txt > span {color:#035795; font-weight:800; } .freecharge2_popup ul.freecharge2_list { padding-left: 0; text-align:center; padding-top: 35px; list-style:none;} .freecharge2_popup .freecharge2_list > li {line-height: 30px; float:left; border-right: 1px solid #b8b9bb; width: 328px;} .freecharge2_popup .freecharge2_list li.fl_right{border:none;} .freecharge2_popup .freecharge2_list > li > a.free00 { display: block; color:#333333; font-size:25px; font-weight:800; letter-spacing:-2px; } .freecharge2_popup .freecharge2_list > li > a.free00 > span {color:#777779; font-weight:600; font-size:21px; display:block; margin-bottom: -27px;} .freecharge2_popup .freecharge2_list > li > a.free00 > img {margin-top: 16px;} .freecharge2_popup .freecharge2_list > li > a.free00 .btn_go {margin: 8px auto; display:block; color:#035795; font-weight:800; font-size:15px; line-height:15px; border-bottom:1px solid #035795; width:42px; letter-spacing: -1px; } .freecharge2_popup .freecharge2_list > li > a.free00:hover .btn_go {color:#F15A23; border-bottom:1px solid #F15A23; } .freecharge2_popup > a.close { display:block; position: absolute; top:30px; right:34px; background: url(/assets/img/www/free/freeclose_icon.png) no-repeat; width:20px; height:20px; z-index:10;} /* 찜목록 팝업 2015-09-18*/ .alert_popup09 {width:394px; height:217px; background:#fff; border-radius:8px;} .alert_popup09 .choise_txt {margin: 0 auto;} .alert_popup09 .choise_txt .choise_title{height:38px; line-height:38px; margin:0; padding:0; color:#000; text-align:center; font-size:16px; font-weight:bold; border-bottom:1px solid #b2b2b2;} .alert_popup09 .choise_txt > p{width:100%; text-align:center; font-size:14px; font-weight:bold; position:relative; color:#636363; padding: 35px 0 0px; margin:0; line-height:27px; letter-spacing:-1px;} .alert_popup09 .choise_txt > p > span.point { font-size:19px; font-weight:bold; color:#f54a3d; } .alert_popup09 .choise_txt > p > span.point2 { font-size:14px; font-weight:bold; color:#4898e5; } .alert_popup09 .choise_txt > p > span.cont { font-size:19px; font-weight:bold; color:#1a1717; } .alert_popup09 .choise_txt p.btnArea {font-size:14px; line-height:40px; margin-bottom: 30px; text-align: center; padding-top:22px;} .alert_popup09 .choise_txt .btnArea a.apply {display: inline-block; background: #f54a3d; color: #fff; font-size: 14px; font-weight: bold; text-align: center; width: 178px; height: 40px; border-radius:30px;} .alert_popup09 .choise_txt .btnArea a.cancel_btn {display: inline-block; background-color: #363a48; color: #fff; font-size: 14px; font-weight: bold; text-align: center; width: 178px; height: 40px; display:none;} .alert_popup09 a.close09 {position:absolute; top:7px; right:-1px; width:32px; height:23px; z-index: 5;} .alert_popup09 a.close09 > img{width: 72%;} /* /*151019 충전소 무제한*/ .unlimit_line{background:#feefef;} .unlimit_line{text-align:center; position:relative;} .unlimit_line span.unlimit_new{display:block; width:30px; height:14px; line-height:14px; border-radius:3px; background:#f54a3d; color:#fff; margin:auto; font-size:10px; font-family:tahoma; text-align:center;} .unlimit_line td.freeticket{text-align:left;} .unlimit_line a.btn_unlimit_buy{display:block; width:80px; height:30px; line-height:30px; border-radius:3px; background:#f54a3d; color:#fff; margin:auto; font-size:14px; font-weight:bold; text-align:center; margin-right:30px;} .unlimit_open{display:none;} .unlimit_list{width:780px; height:180px; border:1px solid #ddd; border-radius:5px; box-shadow:0px 0px 3px rgba(0,0,0,0.1); float:right; margin-right:30px;} .unlimit_list .unlimit_item{width:125px; height:180px; background: url(/assets/img/charge/ptn_goldbg.png) repeat #f54a3d; color:#fff; border: 1px solid #ed3233; border-radius:5px 0 0 5px; margin:-1px 0 0 -1px; text-align:center; float:left;} .unlimit_list .unlimit_item p{line-height:20px; margin-top:60px;} .unlimit_list .unlimit_item p span{font-size:13px; display:block; font-weight:normal;} .unlimit_list .auto{border-bottom:1px solid #ddd; height:109px; line-height:109px;} .unlimit_list .day{height:70px; line-height:70px; line-height:70px;} .unlimit_list td{position:relative;} .unlimit_list td.item_name{color:#333; width:190px; text-align:left; text-indent:15px;} .unlimit_list td.old_price{color:#ccc; text-decoration:line-through;} .unlimit_list td.discount{color:#f54a3d;} .unlimit_list td.price{color:#f54a3d; margin-left:20px; width:90px; text-align:right;} .unlimit_list a.btn_item_buy{display:inline-block; float:right; width:100px; height:50px; line-height:50px; border:1px solid #ddd; border-radius:3px; color:#333; background:#fff; text-align:center; font-size:13px; margin-right:15px;} .unlimit_list a.btn_item_buy_red{display:inline-block; float:right; width:100px; height:50px; line-height:50px; border:1px solid #f54a3d; border-radius:3px; color:#fff; background:#f54a3d; text-align:center; font-size:13px; margin-right:15px;} .unlimit_list a.btn_item_buy2{display:inline-block; float:right; width:100px; height:35px; line-height:35px; border:1px solid #ddd; border-radius:3px; color:#333; background:#fff; text-align:center; font-size:13px; margin-right:15px;} .unlimit_list a.btn_item_buy2_red{display:inline-block; float:right; width:100px; height:35px; line-height:35px; border:1px solid #f54a3d; border-radius:3px; color:#fff; background:#f54a3d; text-align:center; font-size:13px; margin-right:15px;} .unlimit_list span.icon_recommend{width:34px; height:36px; background:url(/assets/img/www/unlimit/icon_recommend.png) no-repeat; position:absolute; top:-5px; left:15px;} /* vip pop*/ .vip_popup {width: 450px; height: 480px; position: relative; margin: 0px auto; background: #000000; border-radius: 8px;} .vip_popup > a.close { display:block; position: absolute; top:20px; right:24px; background: url(/assets/img/www/free/freeclose_icon.png) no-repeat; width:20px; height:20px; z-index:10;} /* 2015-12-04 new_pop*/ .alert_newpopup {width: 462px;} .alert_newpopup .pop_tit {border:0;} .alert_newpopup .pop_tit h1 {} .alert_newpopup .pop_tit h1 span.p_r {color:#fc4243;} .alert_newpopup .pop_tit a.btn_vip{width:105px; border-radius: 4px; border: 1px solid #fc4243; display: inline-block; cursor: pointer; color: #ffffff; font-size: 14px; font-weight: bold; padding: 13px 18px; text-decoration: none; background-color:#fc4243; margin-right: 9px; text-align:center;} .alert_newpopup .pop_tit a.btn_view{width: 105px; border-radius: 4px; border: 1px solid #23272b; display: inline-block; cursor: pointer; color: #ffffff; font-size: 14px; font-weight: bold; padding: 12px 10px; text-decoration: none; background-color:#23272b; text-align:center;} .alert_newpopup .info_newpopup img {padding-top:15px;} .alert_newpopup .info_newpopup label {text-align: left;} .alert_newpopup .info_newpopup .closeteb{width:100%; line-height: 37px; height: 37px; background-color: #1B1B1B;} /*coin_alert*/ .alert_coin_bnr{width:450px; margin:auto; background:#fff; position:relative; border-radius:7px;} .alert_coin_bnr a{cursor:pointer;} .alert_coin_bnr a.alert_coin_bnr_close{display:block; width:29px; height:29px; background:url(/assets/img/www/close_btn.png) no-repeat; position:absolute; top:12px; right:10px;} .alert_coin_bnr .close_line{height:40px; line-height:40px; background:#000; color:#fff; padding:0 25px; position:relative; border-bottom-left-radius: 7px; border-bottom-right-radius:7px;} .alert_coin_bnr .close_line input[type=checkbox]{display:none;} .alert_coin_bnr .close_line label{height:18px; line-height:18px; background:url(/assets/img/www/alert/checkbox_check.png) no-repeat left center; background-size:18px 18px; padding-left:25px; cursor:pointer; display:block; position:absolute; top:11px; left:25px;} .alert_coin_bnr .close_line label.on{background-image:url(/assets/img/www/alert/checkbox_check_on.png);} .alert_coin_bnr .close_line a.btn_close{width:35px; height:20px; line-height:20px; color:#fff; background:#222; text-align:center; display:block; border-radius:3px; float:right; font-weight:bold; margin-top:9px;}/* 181121 수정 */ .alert_coin_bnr .contents_area{text-align:center; font-size:15px; padding:20px 0; line-height:22px; padding:35px 0 15px;} .alert_coin_bnr .contents_area .btn_area{width:400px; text-align:center; margin:20px auto 0;} .alert_coin_bnr .contents_area .btn_area a{display:inline-block; width:150px; height:40px; line-height:39px; color:#fff; font-size:14px; margin:0 5px; border-radius:100px;} .alert_coin_bnr .contents_area .btn_area a.btn_red{background:#f54a3d;} .alert_coin_bnr .contents_area .btn_area a.btn_blueblack{background:#2c2d3a;} .alert_coin_bnr .contents_area span.point{color:#f54a3d; font-weight:bold;} .alert_coin_bnr .bnr_area_pop ul, li{padding:0; margin:0;} .alert_coin_bnr .bnr_area_pop{width:400px; margin:auto; background:#fff; padding:8px 0 20px;} .alert_coin_bnr .bnr_area_pop p.bnr_title{text-align:center;} .alert_coin_bnr .bnr_area_pop li{margin-top:5px;} .alert_coin_bnr .bnr_area_pop li a{display:block; width:100%; height:90px; background-size:cover; background-repeat:no-repeat;} /* 181121 추가 */ .alert_coin_bnr .layer_tt{border-bottom:1px solid #ddd; position:relative; text-align: center; height:46px; line-height: 44px; color: #000} .alert_coin_bnr .layer_tt span{display:inline-block; vertical-align:middle;} .alert_coin_bnr .layer_tt span.icon{width:24px; margin-right:9px;} .alert_coin_bnr .layer_tt span.tt_txt{font-size:16px; font-weight:bold;} /*151120 뷰어리뉴얼*/ .new_viewer{width:100%; height:auto; background:#fff; position:relative; text-align:center;} .new_viewer a{display:block; cursor:pointer;} .new_viewer ul, li, p{list-style:none; padding:0; margin:0;} .new_viewer .comic_img img{z-index:1;} /*뷰어상단*/ .new_viewer .new_viewer_top{width:100%; height:70px; border-bottom:1px solid #1e1e1e; position:fixed; top:0; left:0; z-index:2; background-color:#fff; background:rgba(50,50,50,0.95); filter: alpha(opacity=95);} .new_viewer .new_viewer_top a.logo{width:160px; height:70px; background:url(/assets/img/www/viewer/viewer_logo.png) no-repeat center center #2c2c2c; float:left;} .new_viewer .new_viewer_top a.comic_info{height:70px; line-height:70px; float:left;} .new_viewer .new_viewer_top a.comic_info span.comic_title{background:url(/assets/img/www/viewer/icon_list.png) no-repeat 0 center; text-indent:25px; font-size:16px; color:#fff; margin-left:15px; float:left; font-weight:bold;} .new_viewer .new_viewer_top a.comic_info span.episode_title{display:block; float:left; height:70px; line-height:70px; float:left; background:url(/assets/img/www/viewer/icon_arrow_right_red.png) no-repeat 0 center; text-indent:25px; font-size:14px; color:#ccc; margin-left:15px;} .new_viewer .new_viewer_top a.comic_info:hover span.comic_title{color:#eb0009; background:url(/assets/img/www/viewer/icon_list2.png) no-repeat 0 center;} .new_viewer .new_viewer_top a.comic_info:hover span.episode_title{color:#eb0009;} .new_viewer .new_viewer_top a.comic_info:hover span.episode_subtitle{color:#eb0009;} .new_viewer .new_viewer_top .func_menu{position:absolute; top:0; right:0;} .new_viewer .new_viewer_top .func_menu li{float:left; width:70px; height:70px; border-left:1px solid #1e1e1e; position: relative;} .new_viewer .new_viewer_top .func_menu li a{display:block; width:70px; height:70px; line-height:110px; color:#fff;} .new_viewer .new_viewer_top .func_menu a.music_off{background:url(/assets/img/mobile/music/mobile_viewer_bgm_off2.png) no-repeat center 15px #2c2c2c; background-size:25px;} .new_viewer .new_viewer_top .func_menu a.music_on{background:url(/assets/img/mobile/music/mobile_viewer_bgm_on.png) no-repeat center 15px #2c2c2c; background-size:25px;} .new_viewer .new_viewer_top .func_menu a.comment{background:url(/assets/img/www/viewer/icon_comment.png) no-repeat center 15px #2c2c2c;} .new_viewer .new_viewer_top .func_menu a.free_charge{background:url(/assets/img/www/viewer/icon_freecharge.png) no-repeat center 15px #2c2c2c;} .new_viewer .new_viewer_top .func_menu a.starpoint{background:url(/assets/img/www/viewer/icon_starpoint.png) no-repeat center 15px #2c2c2c;} .new_viewer .new_viewer_top .func_menu a.like{background:url(/assets/img/www/viewer//ep_alert_white2.png) no-repeat center 15px #2c2c2c;} /*기존클래쓰에서 이미지변경 및 위치조절*/ .new_viewer .new_viewer_top .func_menu a.nonstop {background: url(/assets/img/www/viewer//ep_nonstop.png) no-repeat center 16px #2c2c2c;} .new_viewer .new_viewer_top .func_menu a.autoscroll {background: url(/assets/img/www/viewer//ep_autoscroll.png) no-repeat center 17px #2c2c2c;} .new_viewer .new_viewer_top .func_menu a.like:hover, .new_viewer .new_viewer_top .func_menu a.like.active{background:url(/assets/img/www/viewer//ep_alert_white2_on.png) no-repeat center 15px #2c2c2c; color:#eb0009;} /*기존클래쓰에서 이미지변경 및 위치조절*/ .new_viewer .new_viewer_top .func_menu a.nonstop:hover, .new_viewer .new_viewer_top .func_menu a.nonstop.active{background:url(/assets/img/www/viewer//ep_nonstop_on.png) no-repeat center 16px #2c2c2c; color:#eb0009;} .new_viewer .new_viewer_top .func_menu a.autoscroll:hover, .new_viewer .new_viewer_top .func_menu a.autoscroll.active{background:url(/assets/img/www/viewer//ep_autoscroll_on.png) no-repeat center 17px #2c2c2c; color:#eb0009;} .new_viewer .new_viewer_top .func_menu a.fullscreen{background:url(/assets/img/www/viewer/icon_fullscreen.png) no-repeat center 15px #2c2c2c;} .new_viewer .new_viewer_top .func_menu a.help{background:url(/assets/img/www/viewer/icon_help.png) no-repeat center 15px #2c2c2c;} .new_viewer .new_viewer_top .func_menu a.comment:hover{background:url(/assets/img/www/viewer/icon_comment_on.png) no-repeat center 15px #2c2c2c; color:#eb0009;} .new_viewer .new_viewer_top .func_menu a.free_charge:hover{background:url(/assets/img/www/viewer/icon_freecharge_on.png) no-repeat center 15px #2c2c2c; color:#eb0009;} .new_viewer .new_viewer_top .func_menu a.starpoint:hover, .new_viewer .new_viewer_top .func_menu a.starpoint.active{background:url(/assets/img/www/viewer/icon_starpoint_on.png) no-repeat center 15px #2c2c2c; color:#eb0009;} .new_viewer .new_viewer_top .func_menu a.fullscreen:hover, .new_viewer .new_viewer_top .func_menu a.fullscreen.active{background:url(/assets/img/www/viewer/icon_fullscreen_on.png) no-repeat center 15px #2c2c2c; color:#eb0009;} .new_viewer .new_viewer_top .func_menu a.help:hover{background:url(/assets/img/www/viewer/icon_help_on.png) no-repeat center 15px #2c2c2c; color:#eb0009;} .new_viewer .new_viewer_top .func_menu a.giftbox{background: url(/assets/img/www/viewer/ep_giftbox.png) no-repeat center 16px #2c2c2c;} .new_viewer .new_viewer_top .func_menu a.giftbox:hover, .new_viewer .new_viewer_top .func_menu a.giftbox.active{background:url(/assets/img/www/viewer/ep_giftbox_on.png) no-repeat center 16px #2c2c2c; color:#eb0009;} .new_viewer .new_viewer_top .func_menu a.giftbox .gift_cnt_span{background:#e63740; position: absolute; top:9px; right:13px; font-size:10px; color:#fff; height:15px; line-height:14px; border-radius:50px; display: inline-block; text-align:center; padding:0px 3px; min-width:8px; z-index:10} /*별점주기*/ .new_viewer .new_viewer_top .starpoint_layer{position:absolute; top:70px; right:212px; width:280px; height:50px; background:#fff; border:1px solid #1e1e1e; padding-top:25px; text-align:center; display:none;} .new_viewer .new_viewer_top .starpoint_layer .center_wrap{display:inline-block; *display:inline-block;} .new_viewer .new_viewer_top .starpoint_layer .layer_active_line{width:70px; height:1px; background:#1c1c1c; position:absolute; top:-1px; right:0;} .new_viewer .new_viewer_top .starpoint_layer a, .new_viewer .new_viewer_top .starpoint_layer span, .new_viewer .new_viewer_top{display:block; float:left;} .starpoint_layer .i_star_point{float:left; margin:3px 10px 0;} .new_viewer .new_viewer_top .starpoint_layer a{border:2px solid #1e1e1e; height:20px; line-height:20px; border-radius:3px; border:2px solid #000;} .new_viewer .new_viewer_top .starpoint_layer a.btn_plus{width:20px; background:url(/assets/img/www/viewer/icon_plus.png) no-repeat center center;} .new_viewer .new_viewer_top .starpoint_layer a.btn_minus{width:20px; background:url(/assets/img/www/viewer/icon_minus.png) no-repeat center center;} .new_viewer .new_viewer_top .starpoint_layer a.btn_give{font-size:11px; color:#000; width:60px; margin-left:10px;} /*찜하기 알림*/ .new_viewer .new_viewer_top .like_layer{position:absolute; top:70px; right:70px; width:212px; height:46px; background:#fff; border:1px solid #1e1e1e; padding-top:29px; text-align:center; display:none;} .new_viewer .new_viewer_top .like_layer .center_wrap{display:inline-block;} .new_viewer .new_viewer_top .like_layer .layer_active_line{width:70px; height:1px; background:#1c1c1c; position:absolute; top:-1px; right:0;} .new_viewer .new_viewer_top .like_layer a.btn_like{font-size:11px; color:#eb0009; font-weight:bold; font-size:1.3em; cursor:default; display:none;} .new_viewer .new_viewer_top .like_layer a.btn_unlike{font-size:11px; color:#eb0009; font-weight:bold; font-size:1.3em; cursor:default; display:none;} /*뷰어하단*/ .new_viewer .new_viewer_bottom{width:100%; height:70px; border-top:1px solid #1e1e1e; position:fixed; bottom:0; left:0; z-index:2; background-color:#fff; background:rgba(50,50,50,0.95); filter: alpha(opacity=95); text-align:center;} .page_menu{display:inline-block; margin:auto; text-align:center; display:inline-block; margin:auto;} .new_viewer .new_viewer_bottom a{display:block; float:left;} .new_viewer .new_viewer_bottom a span{display:block; font-size:11px; padding-top:46px;} .new_viewer .new_viewer_bottom a.prev{width:85px; height:70px; background:url(/assets/img/www/viewer/icon_prev.png) no-repeat center 10px;} .new_viewer .new_viewer_bottom a.prev span{color:#fff;} .new_viewer .new_viewer_bottom a.prev_disable{width:85px; height:70px; background:url(/assets/img/www/viewer/icon_prev_disable.png) no-repeat center 10px;} .new_viewer .new_viewer_bottom a.prev_disable span{color:#666;} .new_viewer .new_viewer_bottom a.episode_list{width:85px; background: url(/assets/img/www/viewer/icon_episode_new.png) no-repeat center 10px; line-height:105px; font-size:14px; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap} .new_viewer .new_viewer_bottom a.next{width:85px; height:70px; background:url(/assets/img/www/viewer/icon_next.png) no-repeat center 10px;} .new_viewer .new_viewer_bottom a.next span{color:#fff;} .new_viewer .new_viewer_bottom a.next_disable{width:70px; height:70px; background:url(/assets/img/www/viewer/icon_next_disable.png) no-repeat center 10px;} .new_viewer .new_viewer_bottom a.next_disable span{color:#666;} .new_viewer .new_viewer_bottom a.prev:hover{background-image:url(/assets/img/www/viewer/icon_prev_on.png);} .new_viewer .new_viewer_bottom a.prev:hover span{color:#eb0009;} .new_viewer .new_viewer_bottom a.episode_list:hover{background-image:url(/assets/img/www/viewer/icon_episode_on.png); color:#eb0009;} .new_viewer .new_viewer_bottom a.next:hover{background-image:url(/assets/img/www/viewer/icon_next_on.png);} .new_viewer .new_viewer_bottom a.lock:hover{background-image:url(/assets/img/www/viewer/icon_lock_on.png);} .new_viewer .new_viewer_bottom a.next:hover span{color:#eb0009;} .new_viewer .new_viewer_bottom a.lock:hover span{color:#eb0009;} /*하단 에피소드 리스트*/ .new_viewer .new_viewer_bottom .viewer_episode_list{position:absolute; bottom:71px; left:0; width:100%; height:150px; padding-top:30px; border-top:1px solid #1e1e1e; z-index:1; background-color:#fff; background:rgba(50,50,50,0.95); filter: alpha(opacity=95);} .new_viewer .new_viewer_bottom .viewer_episode_list .list_box{width:1050px; margin:auto;} .new_viewer .new_viewer_bottom .viewer_episode_list a.slide_arrow_left{display:block; width:50px; height:120px; background:url(/assets/img/www/viewer/slide_arrow_left.png) no-repeat center center;} .new_viewer .new_viewer_bottom .viewer_episode_list a.slide_arrow_left:hover{background-image:url(/assets/img/www/viewer/slide_arrow_left_on.png);} .new_viewer .new_viewer_bottom .viewer_episode_list a.slide_arrow_right{display:block; width:50px; height:120px; background:url(/assets/img/www/viewer/slide_arrow_right.png) no-repeat center center; float:right;} .new_viewer .new_viewer_bottom .viewer_episode_list a.slide_arrow_right:hover{background-image:url(/assets/img/www/viewer/slide_arrow_right_on.png);} .new_viewer .new_viewer_bottom .viewer_episode_list ul{width:900px; margin:auto; display: inline-block;} .new_viewer .new_viewer_bottom .viewer_episode_list ul li{width:160px; height:134px; float:left;} .new_viewer .new_viewer_bottom .viewer_episode_list ul li+li{margin-left:25px;} .new_viewer .new_viewer_bottom .viewer_episode_list ul li:hover .episode_thumb, .new_viewer .new_viewer_bottom .viewer_episode_list ul li.active .episode_thumb{border-color:#eb0009; font-weight:bold;} .new_viewer .new_viewer_bottom .viewer_episode_list ul li:hover p.episode_title, .new_viewer .new_viewer_bottom .viewer_episode_list ul li.active p.episode_title{color:#eb0009; font-weight:bold;} .new_viewer .new_viewer_bottom .viewer_episode_list .episode_thumb{width:156px; height:100px; border:2px solid #666; background-size:cover; background-repeat:no-repeat; background-position:center center;} .new_viewer .new_viewer_bottom .viewer_episode_list p.episode_title{width:160px; height:30px; line-height:30px; text-align:center; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; display:block; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; color:#ddd;} /*하단 에피소드 리스트 190403추가*/ .new_viewer .new_viewer_bottom a.scroll_top{width:85px; height:70px; background:url(/assets/img/www/viewer/icon_top.png) no-repeat center 10px;} .new_viewer .new_viewer_bottom a.scroll_top:hover{background-image:url(/assets/img/www/viewer/icon_top_on.png);} .new_viewer .new_viewer_bottom a.scroll_top span{color:#fff;} .new_viewer .new_viewer_bottom a.scroll_top:hover span{color:#eb0009;} .new_viewer .new_viewer_bottom a.scroll_bottom{width:85px; height:70px; background:url(/assets/img/www/viewer/icon_bottom.png) no-repeat center 10px;} .new_viewer .new_viewer_bottom a.scroll_bottom:hover{background-image:url(/assets/img/www/viewer/icon_bottom_on.png);} .new_viewer .new_viewer_bottom a.scroll_bottom span{color:#fff;} .new_viewer .new_viewer_bottom a.scroll_bottom:hover span{color:#eb0009;} /*하단_정주행 추가 190405*/ .new_viewer .new_viewer_top .func_menu a.episode_list{background: url(/assets/img/www/viewer/ep_list2.png) no-repeat center 16px #2c2c2c;} .new_viewer .new_viewer_top .func_menu a.episode_list:hover{background:url(/assets/img/www/viewer/ep_list2_on.png) no-repeat center 16px #2c2c2c; color:#eb0009;} .new_viewer .new_viewer_bottom a.episode_nonstop{width:85px; background:url(/assets/img/www/viewer/ep_nonstop2.png) no-repeat center 11px; line-height:106px; font-size:12px; color:#fff; overflow: hidden; text-overflow:ellipsis; white-space:nowrap;} .new_viewer .new_viewer_bottom a.episode_nonstop:hover, .new_viewer .new_viewer_bottom a.episode_nonstop.active{background-image:url(/assets/img/www/viewer/ep_nonstop2_on.png); color:#eb0009} /*출판 컨트롤*/ .new_viewer .comic_control{position:fixed; width:850px; height:50px; bottom:110px; left:50%; margin-left:-425px; background-color:#000; background:rgba(0,0,0,0.7); filter: alpha(opacity=70); color:#fff; z-index:3; border-radius:30px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control{width:160px; height:50px; line-height:50px; float:left;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a{display:block; width:28px; height:28px; float:left;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_first{background-image:url(/assets/img/www/viewer/icon_first.png); margin:11px 0px 0 15px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_first:hover{background-image:url(/assets/img/www/viewer/icon_first_on.png);} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_first_disable{background-image:url(/assets/img/www/viewer/icon_first_disable.png); margin:11px 0px 0 15px; cursor:default;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_left2{background-image:url(/assets/img/www/viewer/icon_left.png); margin:11px 0px 0 15px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_left2:hover{background-image:url(/assets/img/www/viewer/icon_left_on.png); margin:11px 0px 0 15px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_right2{background-image:url(/assets/img/www/viewer/icon_right.png); margin:11px 0px 0 0px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_right2:hover{background-image:url(/assets/img/www/viewer/icon_right_on.png); margin:11px 0px 0 0px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control p.page_num{color:#fff; float:left; width:88px; font-size:14px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control p.page_num span.page_point{color:#eb0009;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_last{background-image:url(/assets/img/www/viewer/icon_last.png); margin:11px 0px 0 0px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_last:hover{background-image:url(/assets/img/www/viewer/icon_last_on.png);} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_last_disable{background-image:url(/assets/img/www/viewer/icon_last_disable.png); margin:11px 0px 0 0px; cursor:default;} .new_viewer .comic_control .view_bottom_btn_2pup_new .viewtype_control{width:160px; height:50px; line-height:50px; float:right;} .new_viewer .comic_control .view_bottom_btn_2pup_new .viewtype_control a.viewtype_comic{display:block; width:71px; height:50px; line-height:50px; float:left; text-indent:27px; color:#fff; font-size:11px; background:url(/assets/img/www/viewer/icon_comicview.png) no-repeat left center;} /**/ .new_viewer .comic_control .view_bottom_btn_2pup_new .viewtype_control a.viewtype_webtoon{display:block; width:65px; height:50px; line-height:50px; float:left; text-indent:17px; color:#fff; font-size:11px; margin-left:10px; background:url(/assets/img/www/viewer/icon_webtoonview.png) no-repeat left center;} /**/ .new_viewer .comic_control .view_bottom_btn_2pup_new .viewtype_control a.viewtype_comic.active{background-image:url(/assets/img/www/viewer/icon_comicview_on.png); color:#eb0009;} .new_viewer .comic_control .view_bottom_btn_2pup_new .viewtype_control a.viewtype_webtoon.active{background-image:url(/assets/img/www/viewer/icon_webtoonview_on.png); color:#eb0009;} .new_viewer .comic_control .view_bottom_btn_2pup_new .progressbar{width:450px; height:50px; float:left; margin:17px 40px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .progressbar .bar_bg{width:100%; height:8px; background:#121212; border-radius:10px; margin-top:21px; cursor:pointer; position:relative;} .new_viewer .comic_control .view_bottom_btn_2pup_new .progressbar .overlay{background:#eb0009; height:8px; border-radius:10px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .progressbar .scroll_point{width:50px; height:28px; position:absolute; top:-10px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .progressbar .scroll_point.left{background-image:url(/assets/img/www/viewer/icon_scrollbar_left.png); background-repeat:no-repeat;} .new_viewer .comic_control .view_bottom_btn_2pup_new .progressbar .scroll_point.right{background-image:url(/assets/img/www/viewer/icon_scrollbar_right.png); background-repeat:no-repeat;} /*도움말가이드*/ .viewer_help_guide{width:100%; height:100%; position:fixed; background:url(/assets/img/www/viewer/bg_black.png) repeat; top:0; left:0; z-index:9; display:none;} .viewer_help_guide .guide_title{position:absolute; top:0; left:-4px; width:454px; height:118px;} .viewer_help_guide .guide_funcbtn{position:absolute; top:0; right:4px; width:684px; height:143px;} .viewer_help_guide .guide_comic_ctrl{position:absolute; bottom:102px; left:50%; width:1200px; height:370px; margin-left:-600px;} .viewer_help_guide .guide_episode_ctrl{position:absolute; bottom:0; left:50%; width:600px; height:98px; margin-left:-300px;} .viewer_help_guide .guide_menu{position:absolute; margin-top: -140px; top: 50%; left:50%; width:118px; height:132px; margin-left:-60px;} .viewer_help_guide a.help_guide_close{width:79px; height:110px; position:absolute; top:50%; left:50%; margin-left:-40px; margin-top:-295px; background-image:url(/assets/img/www/viewer/help_guide_close.png); cursor:pointer;} /*출판 컨트롤 추가*/ .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a{display:block; width:28px; height:28px; float:left;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_to_left{background-image:url(/assets/img/www/viewer/icon_first.png); margin:11px 0px 0 15px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_to_left:hover{background-image:url(/assets/img/www/viewer/icon_first_on.png);} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_to_left_disable{background-image:url(/assets/img/www/viewer/icon_first_disable.png); margin:11px 0px 0 15px; cursor:default;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_to_right{background-image:url(/assets/img/www/viewer/icon_last.png); margin:11px 0px 0 0px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_to_right:hover{background-image:url(/assets/img/www/viewer/icon_last_on.png);} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_to_right_disable{background-image:url(/assets/img/www/viewer/icon_last_disable.png); margin:11px 0px 0 0px; cursor:default;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_to_left2{background-image:url(/assets/img/www/viewer/icon_left.png); margin:11px 0px 0 15px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_to_left2:hover{background-image:url(/assets/img/www/viewer/icon_left_on.png); margin:11px 0px 0 15px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_to_right2{background-image:url(/assets/img/www/viewer/icon_right.png); margin:11px 0px 0 0px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .page_control a.btn_to_right2:hover{background-image:url(/assets/img/www/viewer/icon_right_on.png); margin:11px 0px 0 0px;} .new_viewer .comic_control .view_bottom_btn_2pup_new .viewtype_control a.viewtype_twopage{display:block; width:71px; height:50px; line-height:50px; float:left; text-indent:27px; color:#fff; font-size:11px; background:url(/assets/img/www/viewer/icon_comicview.png) no-repeat left center;} /**/ .new_viewer .comic_control .view_bottom_btn_2pup_new .viewtype_control a.viewtype_onepage{display:block; width:65px; height:50px; line-height:50px; float:left; text-indent:17px; color:#fff; font-size:11px; margin-left:10px; background:url(/assets/img/www/viewer/icon_webtoonview.png) no-repeat left center;} /**/ .new_viewer .comic_control .view_bottom_btn_2pup_new .viewtype_control a.viewtype_twopage.active{background-image:url(/assets/img/www/viewer/icon_comicview_on.png); color:#eb0009;} .new_viewer .comic_control .view_bottom_btn_2pup_new .viewtype_control a.viewtype_onepage.active{background-image:url(/assets/img/www/viewer/icon_webtoonview_on.png); color:#eb0009;} /* 190320 자동스크롤 배속추가 */ .new_viewer .new_viewer_top .dh_lyr{position:absolute; top:71px; right:212px; z-index:50; border-width: 1px; border-style: solid; border-color: #d9d9d9 #bfbfbf #b6b6b6 #d5d5d5; background: #fff; box-shadow:rgba(0,0,0,.1) 0 3px 5px 0; display: none;} .new_viewer .new_viewer_top .dh_lyr .selector{width:70px;} .new_viewer .new_viewer_top .dh_lyr .selector > li{height:42px; line-height:42px; border-bottom:1px solid #ddd; overflow:hidden} .new_viewer .new_viewer_top .dh_lyr .selector > li:last-child{border-bottom:0;} .new_viewer .new_viewer_top .dh_lyr .selector > li > a{font-size:13px; font-weight:500; color:#000; letter-spacing:-0.5px; display:block; -webkit-tap-highlight-color:rgba(0,0,0,.1); cursor:pointer; height:100%; width:100%; text-align:center} #click_area_wrap {position:fixed; z-index:1; top:0; margin:0 auto; cursor:pointer;} #click_area_wrap .click_area_left{float:left; width:35%; height:100%; background: #FFF; opacity:0.0; filter: alpha(opacity = 0);} #click_area_wrap .click_area_center{float:left; width:30%; height:100%; background: #FFF; opacity:0.0; filter: alpha(opacity = 0);} #click_area_wrap .click_area_right{float:left; width:35%; height:100%; background: #FFF; opacity:0.0; filter: alpha(opacity = 0);} /*최근 본 웹툰*/ .recent_view_wrap .toggle_overay{display:block;} a.recentview_open{width:65px; height:26px; line-height:24px; border-radius:15px; border:1px solid #ddd; text-align:center; display:block; background:url(/assets/img/www/index_renewal/icon_clock_mini.png) no-repeat 7px center #fff; color:#222; text-indent:13px; cursor:pointer;} a.recentview_open:hover, a.recentview_open_on{width:65px; height:26px; line-height:24px; border-radius:15px; border:1px solid #222; text-align:center; display:block; background:url(/assets/img/www/index_renewal/icon_clock_mini_w.png) no-repeat 7px center #222; color:#fff !important; text-indent:13px; cursor:pointer;} .recentview_overay{width:100%; height:100%; position:fixed; background:rgba(255,255,255,0.9); z-index:1; display:none;} .recent_view{width:100%; height:270px; background:#fff; text-align:center; border-bottom:4px solid #333; z-index:2; position:absolute; display:none;} .recent_view .viewed_wrap{width:1100px; height:270px; padding-top:40px; margin:auto; position:relative;} .recent_view .viewed_wrap a.recent_view_close{width:100px; height:20px; border-radius:5px; position:absolute; bottom:36px; left:50%; margin-left:-50px; background:url(/assets/img/www/index_renewal/btn_recent_up.png) no-repeat center center #222; background-size:12px 6px; cursor:pointer;} .recent_view .viewed_wrap .recent_title{margin:0 auto 20px; font-size:16px; font-weight:bold; text-align: left;} .recent_view .viewed_wrap .recent_title span{color:#f54a3d;} .recent_view .viewed_wrap ul.recentry_list li{display:inline-block; margin:0 30px;} .recent_view .viewed_wrap ul.recentry_list li.default_thumb .recent_thumb{background:url(/assets/img/www/index_renewal/default_thumb_add.png) no-repeat center center #ededed; background-size:52px;} .recent_view .viewed_wrap ul.recentry_list li.default_thumb p.thumb_title{margin-bottom:15px;} .recent_view .viewed_wrap ul.recentry_list li.default_thumb p.thumb_episodeinfo{display:none;} .recent_view .viewed_wrap ul.recentry_list li .recent_thumb{width:100px; height:100px; background-size:cover; background-repeat:no-repeat; background-position:center center; position:relative; border-radius:50%; margin:auto;} .recent_view .viewed_wrap ul.recentry_list li .recent_thumb button.recent_delete{width:20px; height:20px; background:url(/assets/img/www/index_renewal/squre_close_red.png) no-repeat center center #333; position:absolute; top:0; right:0; display:block; cursor:pointer; background-size:20px;} .recent_view .viewed_wrap ul.recentry_list li a{display:block;} .recent_view .viewed_wrap ul.recentry_list li p.thumb_title{width:150px; color:#333; font-weight:bold; font-size:14px; line-height:30px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .recent_view .viewed_wrap ul.recentry_list li p.thumb_episodeinfo{width:150px; color:#999; font-size:12px; line-height:15px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} /*인덱스 실시간 웹툰 순위 160127*/ p.sub_title_new{color:#000; font-size:15px; font-weight:bold; margin-bottom:15px;} p.sub_title_new:before{content:''; width:5px; height:5px; border-radius:50%; background:#f54a3d; float:left; margin:7px 5px 0 0;} p.sub_title_new span{color:#f54a3d;} .index_rank_list{width:1200px; margin-bottom:30px;} .index_rank_list .rank_box{width:380px; float:left; margin-right:30px; position:relative;} .index_rank_list .rank_box a.moreview{width:65px; height:26px; line-height:24px; display:block; position:absolute; top:-3px; right:0; border-radius:3px; border:1px solid #ddd; text-align:center; font-weight:bold; color:#222;} .index_rank_list .rank_box:last-child{margin:0;} .index_rank_list .rank_box ul{border:1px solid #ddd; border-top:2px solid #222; border-bottom:0;} /*랭킹2~5위 스타일*/ .index_rank_list .rank_box ul li{border-bottom:1px solid #ddd; float:none; height:90px; padding-right:10px;} .index_rank_list .rank_box ul li .ranking_num{width:50px; float:left; text-align:center; color:#222; font-size:18px; font-weight:bold; line-height:90px;} .index_rank_list .rank_box ul li .rank_comic_thumb{width:75px; height:75px; border:1px solid #ddd; float:left; margin:7px 15px 0 0; background-size:cover; background-position:center center; background-repeat:no-repeat;} .index_rank_list .rank_box ul li .rank_comic_info{font-size:12px; color:#555;} .index_rank_list .rank_box ul li .rank_comic_info p.rank_list_comic_tt{color:#222; font-size:14px; font-weight:bold; line-height:20px; padding-top:6px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} .index_rank_list .rank_box ul li .rank_comic_info p.rank_list_comic_wt{color:#999; font-size:11px; padding-bottom:5px;} .index_rank_list .rank_box ul li .rank_comic_info p.rank_list_comic_snp{line-height:16px; height:32px; display:-webkit-box; overflow:hidden; text-overflow:ellipsis; -webkit-line-clamp:2; -webkit-box-orient: vertical; } /*랭킹1위 스타일*/ .index_rank_list .rank_box ul li.rank1{height:120px;} .index_rank_list .rank_box ul li.rank1 .ranking_num{color:#f54a3d; font-size:22px; line-height:120px;} .index_rank_list .rank_box ul li.rank1 .rank_comic_thumb{border:0; border-radius:50%; width:100px; height:100px; margin:10px 0 0 10px; float:right;} .index_rank_list .rank_box ul li.rank1 .rank_comic_info{padding-top:15px;} /*정렬메뉴추가*/ ul.ordermenu_new{width:1200px; height:35px; border-bottom:1px solid #ddd; margin-bottom:15px; padding:8px 0 0 0;} ul.ordermenu_new li{float:left; background:#fff;} ul.ordermenu_new li a{display:block; width:95px; height:24px; line-height:22px; border:1px solid #ddd; margin-left:-1px; text-align:center; font-size:11px;} ul.ordermenu_new li.on a{background:#3e4858; color:#fff; border-color:#3e4858; font-weight:bold;} /*탭메뉴에 NEW아이콘 및 장르/무료 아이콘*/ .tabmenu_ico{display:inline-block; vertical-align:middle; margin:-1px 3px; background-repeat:no-repeat;} .newico_new{width:12px; height:12px; background-image:url(/assets/img/www/index_renewal/newico_new.png);} .newico_action{width:16px; height:12px; background-image:url(/assets/img/www/index_renewal/newico_action.png);} .newico_all{width:15px; height:15px; background-image:url(/assets/img/www/index_renewal/newico_all.png);} .newico_chi{width:16px; height:15px; background-image:url(/assets/img/www/index_renewal/newico_chi.png);} .newico_comic{width:14px; height:13px; background-image:url(/assets/img/www/index_renewal/newico_comic.png);} .newico_fixcharge{width:17px; height:15px; background-image:url(/assets/img/www/index_renewal/newico_fixcharge.png); padding-bottom:2px;} .newico_complete{width:14px; height:17px; background-image:url(/assets/img/www/index_renewal/newico_finish.png);} .newico_drama{width:16px; height:14px; background-image:url(/assets/img/www/index_renewal/newico_drama.png);} .newico_sports{width:16px; height:15px; background-image:url(/assets/img/www/index_renewal/newico_sports.png);} .newico_ssul{width:15px; height:14px; background-image:url(/assets/img/www/index_renewal/newico_ssul.png);} .newico_todayfree{width:15px; height:15px; background-image:url(/assets/img/www/index_renewal/newico_todayfree.png);} .newico_waitfree{width:16px; height:15px; background-image:url(/assets/img/www/index_renewal/newico_waitfree.png);} .newico_morefree{width:17px; height:5px; background-image:url(/assets/img/www/index_renewal/newico_morefree.png);} .newico_webtoon{width:16px; height:13px; background-image:url(/assets/img/www/index_renewal/newico_webtoon.png);} .newico_bl{width:16px; height:16px; background-image:url(/assets/img/www/index_renewal/newico_bl.png);} .newico_fantasy{width:16px; height:15px; background-image:url(/assets/img/www/index_renewal/newico_fantasy.png);} .newico_horror{width:16px; height:17px; background-image:url(/assets/img/www/index_renewal/newico_horror.png);} .newico_omnibus{width:14px; height:13px; background-image:url(/assets/img/www/index_renewal/newico_omnibus.png);} .newico_romance{width:16px; height:13px; background-image:url(/assets/img/www/index_renewal/newico_romance.png);} .newico_newone{width:16px; height:17px; background-image:url(/assets/img/www/index_renewal/newico_newone.png);} .newico_popularity{width:16px; height:17px; background-image:url(/assets/img/www/index_renewal/newico_popularity.png);} /*탭 on상태*/ li.on .newico_action{background-image:url(/assets/img/www/index_renewal/newico_action_on.png);} li.on .newico_all{background-image:url(/assets/img/www/index_renewal/newico_all_on.png);} li.on .newico_chi{background-image:url(/assets/img/www/index_renewal/newico_chi_on.png);} li.on .newico_comic{background-image:url(/assets/img/www/index_renewal/newico_comic_on.png);} li.on .newico_complete{background-image:url(/assets/img/www/index_renewal/newico_finish_on.png);} li.on .newico_drama{background-image:url(/assets/img/www/index_renewal/newico_drama_on.png);} li.on .newico_sports{background-image:url(/assets/img/www/index_renewal/newico_sports_on.png);} li.on .newico_ssul{background-image:url(/assets/img/www/index_renewal/newico_ssul_on.png);} li.on .newico_todayfree{width:15px; height:15px; background-image:url(/assets/img/www/index_renewal/newico_todayfree_on.png);} li.on .newico_waitfree{width:16px; height:15px; background-image:url(/assets/img/www/index_renewal/newico_waitfree_on.png);} li.on .newico_morefree{width:17px; height:5px; background-image:url(/assets/img/www/index_renewal/newico_morefree_on.png);} li.on .newico_webtoon{width:16px; height:13px; background-image:url(/assets/img/www/index_renewal/newico_webtoon_on.png);} li.on .newico_bl{width:16px; height:16px; background-image:url(/assets/img/www/index_renewal/newico_bl_on.png);} li.on .newico_fantasy{width:16px; height:15px; background-image:url(/assets/img/www/index_renewal/newico_fantasy_on.png);} li.on .newico_horror{width:16px; height:17px; background-image:url(/assets/img/www/index_renewal/newico_horror_on.png);} li.on .newico_omnibus{width:14px; height:13px; background-image:url(/assets/img/www/index_renewal/newico_omnibus_on.png);} li.on .newico_romance{width:16px; height:13px; background-image:url(/assets/img/www/index_renewal/newico_romance_on.png);} li.on .newico_newone{width:16px; height:17px; background-image:url(/assets/img/www/index_renewal/newico_newone_on.png);} li.on .newico_popularity{width:16px; height:17px; background-image:url(/assets/img/www/index_renewal/newico_popularity_on.png);} /*인덱스에 기획관 노출*/ .index_theme_list .theme_list_subject{width:100%; height:80px; margin-bottom:15px; border-bottom:1px solid #ddd; position:relative;} .index_theme_list .theme_list_subject a.moreview{width:80px; height:26px; line-height:24px; display:block; position:absolute; bottom:15px; right:0; border-radius:3px; border:1px solid #ddd; text-align:center; font-weight:bold; color:#222;} .index_theme_list .theme_list_subject .theme_list_thumb{width:65px; height:65px; border:1px solid #ddd; background-repeat:no-repeat; background-size:cover; background-position:center center; float:left; margin-right:15px;} .index_theme_list .theme_list_subject .theme_list_info p.themelist_tt{color:#222; font-weight:bold; font-size:18px; line-height:34px;} .index_theme_list .theme_list_subject .theme_list_info p.themelist_txt{font-size:14px; color:#666;} /*인덱스 배너 리뉴얼*/ .index_bnr_new_wp{width:100%; height:320px; background:#333; position:relative; margin:120px 0 10px; border-bottom:1px solid #000;} /*인덱스 배너 버튼*/ .index_bnr_new_wp a.btn_arrow{position:absolute; width:36px; height:36px; top:50%; display:block; background-size:11px; margin-top:-18px; border-radius:50%; border:2px solid #000; opacity:0; transition:all .2s; z-index:10;} .index_bnr_new_wp a.btn_arrow.left{left:15px; background:url(/assets/img/www/banner/arrow_left.png) no-repeat; background-position:9px center;} .index_bnr_new_wp a.btn_arrow.right{right:15px; background:url(/assets/img/www/banner/arrow_right.png) no-repeat; background-position:11px center;} .index_bnr_new_wp a.btn_arrow.left.move{opacity:0.4; left:25px; transition:all .2s; background-color:#000;} .index_bnr_new_wp a.btn_arrow.right.move{opacity:0.4; right:25px; transition:all .2s; background-color:#000;} /*인덱스 하단 텍스트 버튼 :: float 속성*/ .index_bnr_new_wp .txt_btn{z-index:9; position: absolute; bottom:20px; left:50%; z-index:10; margin-left:-255px;} .index_bnr_new_wp .txt_btn ul{margin:auto; display:inline-block; *display:inline; zoom:1;} .index_bnr_new_wp .txt_btn ul li{width:170px; height:30px; line-height:26px; border:1px solid #000; background:rgba(0,0,0,0.7); text-align:center; float:left; margin-left:-1px;} .index_bnr_new_wp .txt_btn ul li a{color:#fff; display:block; font-size:14px;} .index_bnr_new_wp .txt_btn ul li.active{border-color:#fb330b; background:rgba(254,51,11,0.8);} .index_bnr_new_wp .txt_btn ul li.active a{font-weight:bold;} /*인덱스 배너 리스트 :: float 속성*/ .index_bnr_new_wp{overflow:hidden;} .index_bnr_new_wp .bnr_list ul{width:1800px; padding:0; position:absolute; top:0px; left:50%; padding:0; margin:0 0 0 -900px;} .index_bnr_new_wp .bnr_list ul li{width:300px; height:320px; position:absolute; z-index:1; transition:all .2s;} .index_bnr_new_wp .bnr_list ul li.list01{top:0; left:0;} .index_bnr_new_wp .bnr_list ul li.list02{top:0; left:300px;} .index_bnr_new_wp .bnr_list ul li.list04{top:0; right:300px;} .index_bnr_new_wp .bnr_list ul li.list05{top:0; right:0;} .index_bnr_new_wp .bnr_list ul li a{display:block; width:300px; height:320px;} .index_bnr_new_wp .bnr_list ul li.active{width:600px; height:320px; top:0; left:600px; z-index:3;} .index_bnr_new_wp .bnr_list ul li.active a{display:block; width:600px; height:320px;} /*인덱스 배너 그라데이션*/ .index_bnr_new_wp .gra_left{width:435px; height:320px; position:absolute; top:0; left:0; background:url(/assets/img/www/banner/bnr_gradient_left.png); z-index:1;} .index_bnr_new_wp .gra_right{width:435px; height:320px; position:absolute; top:0; right:0; background:url(/assets/img/www/banner/bnr_gradient_right.png); z-index:1;} /*정렬메뉴 재수정*/ .real_tabmenu{position:relative;} ul.real_ordermenu{width:500px; height:43px; line-height:43px; position:absolute; top:40px; right:0;} ul.real_ordermenu li{float:right; height:43px; text-align:right; margin-left:20px;} ul.real_ordermenu li a{display:block;} ul.real_ordermenu li a span.order_radio{background:url(/assets/img/www/common/order_radio.png) no-repeat 0 center; width:18px; height:18px; vertical-align:middle; margin-right:5px; display:inline-block;} ul.real_ordermenu li.on a{color:#ef3d43; font-weight:bold;} ul.real_ordermenu li.on a span.order_radio{background-image:url(/assets/img/www/common/order_radio_on.png);} span.tab_update_txt{height: 14px;background: #ef3d43; color: #fff;line-height: 12px;padding: 0 3px;font-size: 10px;font-weight: bold; margin-left: 3px;} /*MAIN BNR*/ .main_bnr{width:100%; height:320px; margin:120px 0 10px; position:relative; background-repeat: no-repeat; background-position: center center; background-color: #333; overflow:hidden; text-align:center; z-index:1;transition: all .5s;} .main_bnr:after{content:""; width:100%; height:320px; position:absolute; top:0; left:0; z-index:2; } .main_bnr .bnr_left_gra{width:435px; height:320px; background:url(/assets/img/www/banner/bnr_gradient_left.png); position:absolute; top:0; left:0;} .main_bnr .bnr_right_gra{width:435px; height:320px; background:url(/assets/img/www/banner/bnr_gradient_right.png); position:absolute; top:0; right:0;} .main_bnr_2{width:100%; height:2300px; margin:0px 0 0px; position:relative; background-repeat: no-repeat; background-position: center center; background-color: #333; overflow:hidden; text-align:center; z-index:1;transition: all .5s;} .main_bnr_2:after{content:""; width:100%; height:230px; position:absolute; top:0; left:0; z-index:2; } .main_bnr_2 .bnr_left_gra{width:435px; height:230px; background:url(/assets/img/www/banner/bnr_gradient_left.png); position:absolute; top:0; left:0;} .main_bnr_2 .bnr_right_gra{width:435px; height:230px; background:url(/assets/img/www/banner/bnr_gradient_right.png); position:absolute; top:0; right:0;} .bnr_area{ position: absolute; width: 1800px; height: 320px; margin: 0px auto; z-index: 3; overflow: hidden; padding-bottom: 78px; left: 50%; margin-left: -900px; } .bnr_area ul.bnr_list{width:1800px; padding:0; display:inline-block; *display:inline; zoom:1; text-align:center; position:absolute; top:0; left:50%; margin:0 0 0 -900px; overflow: hidden;height: 320px;} .bnr_area ul.bnr_list li{float:left; width:300px; height:320px; background:transparent; border-radius:5px; margin:0 0px !important; overflow:hidden; position:relative;} .bnr_area ul.bnr_list li .category{width:40px; height:40px; line-height:38px; color:#fff; text-align:center; border-radius:50%; position:absolute; top:10px; left:10px; z-index:2; font-size:14px; font-weight:bold;} .bnr_area ul.bnr_list li .category.recommend{background-color:#fe330b;} .bnr_area ul.bnr_list li .category.comics{background-color:#f43d8b;} .bnr_area ul.bnr_list li .category.new{background-color:#25ccd6;} /* .bnr_area ul.bnr_list li:first-child{margin-left:0px;} */ /*.bnr_area ul.bnr_list li:nth-child(5n){margin-right:0px;}*/ .bnr_area ul.bnr_list li a{display:block; overflow:hidden; position:relative; height:320px;} .bnr_area ul.bnr_list li a .bnr_info{ position:absolute; bottom:0; left:0; height:130px; width:250px; padding:5px 15px 0; text-align:left; background:rgba(255,255,255,0.7); filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#70ffffff,endColorstr=#70ffffff); } .bnr_area ul.bnr_list li a .bnr_info p.title{width:100%; height:34px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; font-size:18px; font-weight:bold; letter-spacing:-2px; line-height:34px;} .bnr_area ul.bnr_list li a .bnr_info p.writer{font-weight:bold; margin-bottom:12px; font-size:12px;} .bnr_area ul.bnr_list li:nth-child(3){border:2px solid #ffd10c;} .bnr_area ul.bnr_list li:nth-child(1){opacity:.5 !important;} .bnr_area ul.bnr_list li:nth-child(2){opacity:.8 !important;} .bnr_area ul.bnr_list li:nth-child(3){opacity: 0 !important; width:590px; } .bnr_area ul.bnr_list li:nth-child(4){opacity:.8 !important;} .bnr_area ul.bnr_list li:nth-child(5){opacity:.5 !important;} .bnr_area ul.bnr_list li:nth-child(6){opacity:.3 !important;} .bnr_area ul.bnr_list li:nth-child(7){opacity:.1 !important;} .bnr_area ul.bnr_list li:hover{opacity:1 !important;} .bnr_area .bnr_center{z-index:16; border:none;} .bnr_area .bnr_center .list_center {position:absolute; top:0; left:50%; padding:0; text-align:center; margin:0 0 0 -300px;} /*BANNER DOT*/ .main_bnr .dot_area{text-align: center; width: 300px; height: 15px; position: absolute; bottom: 28px; left: 50%; margin-left: -150px; z-index: 4;} .main_bnr ul.dot{margin:auto; display:inline-block; *display:inline; zoom:1;} .main_bnr ul.dot li{width:15px; height:15px; margin:0 2px; float:left;cursor:pointer;} .main_bnr ul.dot li{display:block; width:15px; height:15px; background:url(/assets/img/www/common/icon_rollingdot.png) no-repeat 15px 15px; background-position:0 0px;} .main_bnr ul.dot li.active{background:url(/assets/img/www/common/icon_rollingdot.png) no-repeat 15px 15px; background-position:-15px 0px;} /*BANNER TEXT BUTTON*/ .main_bnr ul.txt_button{position:relative; height:25px; line-height:25px; top:88%; margin:auto ; z-index:10;padding:0;} .main_bnr ul.txt_button li{width:140px; float:left; text-align:center; border:1px solid #000; background:rgba(0,0,0,0.7); margin-left:-1px;} .main_bnr ul.txt_button li:first-child{margin-left:0;} .main_bnr ul.txt_button li a{color:#fff; display:block; font-size:13px;} .main_bnr ul.txt_button li.active{border-color:#fb330b; background:rgba(254,51,11,0.8);} .main_bnr ul.txt_button li.active a{font-weight:bold;} /*BANNER ARROW .main_bnr .bnr_button{max-width:1700px; position:relative; margin:auto; z-index:5;} .main_bnr .bnr_button a{width:60px; height:58px; background:url(/assets/img/www/common/bnr_arrow.png) no-repeat 120px 116px;} .main_bnr .bnr_button a.prev{position:absolute; display:block; top:151px; left:20px; width:60px; height:58px; background-position:0 0px;} .main_bnr .bnr_button a.prev:hover{background-position:-60px 0px;} .main_bnr .bnr_button a.next{position:absolute; display:block; top:151px; right:60px; width:60px; height:58px; background-position:0 -58px;} .main_bnr .bnr_button a.next:hover{background-position:-60px -58px;} */ /*인덱스 배너 버튼*/ .main_bnr .bnr_button a.btn_arrow{position:absolute; width:36px; height:36px; top:160px; display:block; background-size:11px; border-radius:50%; border:2px solid #000; opacity:0; transition:all .2s; z-index:10;} .main_bnr .bnr_button a.btn_arrow.left{left:15px; background:url(/assets/img/www/banner/arrow_left.png) no-repeat; background-position:9px center;} .main_bnr .bnr_button a.btn_arrow.right{right:15px; background:url(/assets/img/www/banner/arrow_right.png) no-repeat; background-position:13px center;} .main_bnr .bnr_button a.btn_arrow.left.move{opacity:0.4; left:25px; transition:all .2s; background-color:#fd4243;} .main_bnr .bnr_button a.btn_arrow.right.move{opacity:0.4; right:25px; transition:all .2s; background-color:#fd4243;} .main_bnr .bnr_button a.btn_arrow.left.move:hover{opacity:1;} .main_bnr .bnr_button a.btn_arrow.right.move:hover{opacity:1;} /*new회원가입 인증선택*/ .joinform_step01 {width: 370px; margin: auto;} .joinform_step01 li {float:left; border-radius:5px;} .joinform_step01 li a {color:#fff; font-size:12px; font-weight:bold; display:block; text-align:center; width:163px; height:93px; } .joinform_step01 li:first-child {background:#fd4243; margin-right: 5px;} .joinform_step01 li:first-child span {background:url(/assets/img/login/icon_mail.png) no-repeat left 21px; padding-top: 24px; width:42px; height:33px; display: block; margin:auto;} .joinform_step01 li:last-child {background:#292a2c;} .joinform_step01 li:last-child span {background:url(/assets/img/login/icon_phone.png) no-repeat left 16px; padding-top: 19px; width:33px; height:39px; display: block; margin:auto;} /*회원가입 메일인증 버튼*/ .joinform a { width: 57px; height:29px; line-height: 27px; display:inline-block; vertical-align: middle; } .joinform a .join_mail_check{display: block; width: 57px; float: right; background-color: #F54A3D; font-size: 11px; color: #FFFFFF; text-align: center; border-radius: 3px;} .joinform a .join_back {box-sizing:border-box; display: block; width: 57px; float: right; background-color: #fff; border:1px solid #ababab; font-size: 11px; color: #313131; height: 26px; text-align: center; border-radius: 3px;} /*회원가입 메일인증 후 확인 버튼*/ .joinform .join_mail_check_ok{display:block; float:right; background-color:#fd4243; font-size:12px; color:#fff; width:80px; height:40px; line-height:40px; text-align:center; margin:4px 5px 0 0; border:1px solid #fd4243;} /*마이페이지 작품노출 설정*/ .comiclist_setting{margin:15px 0 50px 0;} .comiclist_setting a{display:block; margin-left:-1px; width:55px; height:30px; line-height:30px; border:1px solid #ddd; text-align:center; font-size:12px; float:left;color:#000; background: #ffffff; /* Old browsers */ background: -moz-linear-gradient(top, #ffffff 0%, #eeeeee 100%); /* FF3.6-15 */ background: -webkit-linear-gradient(top, #ffffff 0%,#eeeeee 100%); /* Chrome10-25,Safari5.1-6 */ background: linear-gradient(to bottom, #ffffff 0%,#eeeeee 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */ filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#eeeeee',GradientType=0 ); /* IE6-9 */ } .comiclist_setting a.complete{border-radius:5px 0 0 5px; margin-left:10px;} .comiclist_setting a.adult{} .comiclist_setting a.allage{border-radius:0 5px 5px 0;} .comiclist_setting a.active{background:#999baa; color:#fff; box-shadow:inset 2px 2px 5px #767783; border-color:#7b7f87;} .comiclist_setting table{width: 1200px; border: 0; border-collapse: collapse; padding: 0; border-top: 1px solid #ccc; font-size: 12px; background: #fff;} .comiclist_setting table td{border-bottom: 1px solid #ccc; height: 40px; line-height: 40px; padding-left: 20px;} .comiclist_setting table th{width: 140px;background: #eee; border-bottom: 1px solid #ccc;} /*Alert_list*/ .alert_coin_bnr ul.alert_allbuy_list{border-top:2px solid #333; text-align:left; width:80%; margin:0 auto; padding:0;} .alert_coin_bnr ul.alert_allbuy_list label{position: relative; display:block; border-bottom:1px solid #ddd; cursor:pointer; height:40px; line-height:40px;} .alert_coin_bnr ul.alert_allbuy_list span.ep_radio{position: absolute;top:0px;left: 0px;width:40px; display:inline-block; text-align:center;} .alert_coin_bnr ul.alert_allbuy_list span.ep_radio input{height: 40px;} .alert_coin_bnr ul.alert_allbuy_list span.ep_name{padding-left: 40px;} .alert_coin_bnr ul.alert_allbuy_list span.ep_price{float:right; color:#777; font-weight:bold; text-align:right; margin-right:20px;} .alert_coin_bnr p.alert_title{width:80%; margin:0 auto 10px; text-align:left; color:#000; font-weight:bold; font-size:16px;} /*모드변경 말풍선 가이드 팁*/ .gnb .mode_guide{width: 370px; height: 70px; background: url(/assets/img/www/common/web_modeguide.png) no-repeat; position: absolute; top: 32px; left: 50%; margin-left: -185px; z-index: 5;} .gnb .mode_guide a.guide_close{display: block; background: url(/assets/img/www/common/guide_close_x_w.png); width: 17px; height: 17px; position: absolute; top: 10px; right: 5px; cursor: pointer;} /*충전소 말풍선 가이드*/ .bubblebox_toss{text-align: left; width: 123px; height: 35px; font-size: 11px; padding: 5px 10px; z-index: 2; top: 385px; left:510px; line-height: 15px; background: #fff; border-radius: 5px; position: absolute; color: #000; border: 2px solid #000;} .bubblebox_toss a.close_bubble_toss{display:block; width:18px; height:18px; position:absolute; top:5px; right:5px; background:url(/assets/img/www/common/bubble_close.png) no-repeat; padding:0; margin:0; min-width:18px;} .bubblebox_toss span.triangle_toss{width: 9px; height: 7px; background: url(/assets/img/www/common/bubble_triangle2.png) no-repeat; display: block; position: absolute; bottom: 45px; left: 62px;} /*PC웹상단배너*/ .close_bnr{position: absolute; top: 0; right: 15px; text-align: right; color: #fff;} .close_bnr label.close_check{position: absolute; top: 43px; right: 30px; width: 120px; cursor:pointer;} .close_bnr label.close_check .checkbox_check{display: inline-block;float: left;vertical-align: middle;margin-right: 5px;} .close_bnr .close_check img{float: left;} .close_bnra a.main_event_slide_close{right: 0px;top:35px;position:absolute;cursor:pointer;} /*충전소 리뉴얼*/ .payment_new{width:1200px; margin:50px auto; border:1px solid #ddd; /*border-top:0;*/ font-size:14px; color:#000; letter-spacing:0;} .payment_new p.payment_title{font-size:18px; font-weight:bold; color:#000; margin-bottom:15px; letter-spacing:-1px;} .payment_new ul, li{margin:0; padding:0; list-style:none;} .payment_new span.payment_ico{display:inline-block; vertical-align:middle;} .payment_new .member_info{width:900px; margin:20px auto 0; background:#f6f6f6; border:1px solid #ddd; padding:15px 20px; line-height:20px;} .payment_new .member_info span{color:#f93232; font-weight:bold; text-decoration:underline;} .payment_new .payment_top{border-bottom:1px solid #ddd;} .payment_new .payment_top .user_assets{width:599px; float:left; border-right:1px solid #ddd;} .payment_new .payment_top .user_assets li{width:199px; height:128px; border-left:1px solid #ddd; float:left; text-align:center; padding-top:22px; position:relative;} .payment_new .payment_top .user_assets li:first-child{border-left:0;} .payment_new .payment_top .user_assets li span{display:block;} .payment_new .payment_top .user_assets li span.txt{color:#000; font-size:14px; font-weight:bold; margin:5px 0 20px;} .payment_new .payment_top .user_assets li span.num_value{font-size:24px; color:#d93d32;} .payment_new .payment_top .user_assets li a.btn_level_info{width:20px; height:20px; position:absolute; top:-1px; right:-1px; border:1px solid #ddd; display:block;} .payment_new .payment_top .user_assets span.leveltype_eng{font-size:16px; text-transform:uppercase; font-weight:bold; margin:-6px 0 0 0;} .payment_new .payment_top .user_assets span.leveltype_kor{font-size:16px;} .payment_new .payment_top .user_assets span.level01{color:#589407;} .payment_new .payment_top .user_assets span.level02{color:#7c5f22;} .payment_new .payment_top .user_assets span.level03{color:#858a99;} .payment_new .payment_top .user_assets span.level04{color:#fc9708;} .payment_new .payment_top .user_assets span.level05{color:#7d0c25;} .payment_new .payment_top .user_assets span.level06{color:#000;} .payment_new .payment_top .payment_bnr{width:600px; height:150px; float:right;} .payment_new .payment_contents{padding:20px 130px 40px; position:relative;} .payment_new .payment_contents label{display:block; cursor:pointer;} .payment_new .payment_contents input{vertical-align:middle;} .payment_new .payment_contents .product_list{margin-bottom:30px;} .payment_new .payment_contents .product_list ul{width:100%; border-top:2px solid #333;} .payment_new .payment_contents .product_list ul li{height:55px; line-height:55px; border-bottom:1px solid #bbb; color:#000; font-size:15px;} .payment_new .payment_contents .product_list label{padding:0 25px;} .payment_new .payment_contents .product_list input{margin-right:5px;} .payment_new .payment_contents .product_list ul li.active label{background:#eff2f9;} .payment_new .payment_contents .product_list ul li span{display:inline-block;} .payment_new .payment_contents .product_list span.product_name{font-weight:bold;} .payment_new .payment_contents .product_list span.product_detail{} .payment_new .payment_contents .product_list span.product_discount{text-decoration:line-through; color:#bbb; float:right; text-align:right;} .payment_new .payment_contents .product_list span.product_discount.secret{color:#5f7fa3;} .payment_new .payment_contents .product_list span.product_price{float:right; width:80px!important; margin-left:15px; text-align:right;} .payment_new .payment_contents .product_list span.pay_red{color:#e63740;} .payment_new .payment_contents .product_list span.pay_blue{color:#2b7cb5;} .payment_new .payment_contents .product_list span.txticon{vertical-align:middle;} .payment_new .payment_contents .product_list span.txticon.ico_discount{width:22px; height:12px; background:url(/assets/img/www/payment/txtcon_discount.png); margin-left:5px;} .payment_new .payment_contents .product_list span.txticon.ico_onlyyou{width:51px; height:12px; background:url(/assets/img/www/payment/txtcon_onlyyou.png); margin-left:5px;} .payment_new .payment_contents .product_list span.txticon.ico_benefit{width:30px; height:16px; background:url(/assets/img/www/common/txticon_benefit.png); margin-left:5px;} .payment_new .payment_contents .product_list span.txticon.ico_pay_0{width:73px; height:19px; background:url(/assets/img/event/pay_comic_event/w_pay_0.jpg); margin-left:5px;} .payment_new .payment_contents .product_list span.txticon.ico_pay_1{width:73px; height:19px; background:url(/assets/img/event/pay_comic_event/w_pay_1.jpg); margin-left:5px;} .payment_new .payment_contents .product_list span.txticon.ico_pay_2{width:73px; height:19px; background:url(/assets/img/event/pay_comic_event/w_pay_2.jpg); margin-left:5px;} .payment_new .payment_contents .product_list span.txticon.ico_recommend{width:22px; height:12px; background:url(/assets/img/www/payment/txtcon_recommend.png); margin-right:5px;} .payment_new .payment_contents .product_list span.event_coin img{vertical-align:middle; margin:0 3px;} .payment_new .payment_contents .product_list span.event_coin{color:#e63740;} .payment_new .payment_contents .product_list p.secret_title{/*background:#ff5546; height:45px; line-height:50px; color:#fff; font-size:16px; font-weight:bold; letter-spacing:-1px; padding-left:10px;*/} .payment_new .payment_contents .product_list p.secret_title span.user_icon_onlyyou{display:block; width:31px; height:30px; background:url(/assets/img/www/payment/event_onlyyou.png) no-repeat; margin-right:5px; vertical-align:middle; margin:7px 5px 0 30px; float:left;} .payment_new .payment_contents .product_list p.secret_title span.font_strong{color:#fff601;} .payment_new .payment_contents .product_list ul.user_secret_item {width:936px; border:2px solid #132b47; border-top-color:#132b47; margin:30px auto;} .payment_new .payment_contents .product_list ul.user_secret_item li{border-bottom:1px solid #486e9b; background:#f5f8fc;} .payment_new .payment_contents .product_list ul.user_secret_item li:last-child{border-bottom:0;} .payment_new .payment_contents .product_list ul.user_secret_item1 {width:936px; border:2px solid #3e699b; border-top-color:#3e699b; margin:30px auto;} .payment_new .payment_contents .product_list ul.user_secret_item1 li{border-bottom:1px solid #486e9b; background:#f5f8fc;} .payment_new .payment_contents .product_list ul.user_secret_item1 li:last-child{border-bottom:0;} .payment_new .payment_method{background:#f7f8fb; border:1px solid #d0d3dd; border-top:2px solid #333;} .payment_new .payment_method .payment_total_info{background:#eaedf4; border-bottom:1px solid #d0d3dd; height:70px; line-height:70px;} .payment_new .payment_method .payment_total_info p.coin_total_txt{float:left;} .payment_new .payment_method .payment_total_info p.coin_total{float:left;} .payment_new .payment_method .payment_total_info p.mileage_total{} .payment_new .payment_method ul.pay_method_select{margin-bottom:30px;} .payment_new .payment_method ul.pay_method_select li{width:165px; height:50px; border:1px solid #ddd; border-radius:5px; color:#000; font-size:14px; font-weight:bold; line-height:50px; display:inline-block; margin:0 5px 10px 0; background:#fff;} .payment_new .payment_method ul.pay_method_select li.active{color:#2b7cb5; border-color:#2b7cb5;} .payment_new .payment_method ul.pay_method_select label{display:block; padding:0 10px;} .payment_new .payment_method ul.pay_method_select input{margin-right:5px;} .payment_new .method_type{padding:0 30px;} .payment_new button.btn_go_charge{display:block; margin:20px auto 30px; width:240px; height:60px; line-height:60px; color:#fff; text-align:center; background:#363a48; border-radius:5px; font-weight:bold; font-size:18px; clear:both;} .payment_new .payment_contents .select_coin_info{background:#eaedf4; border:2px solid #333; margin-top:15px;} .payment_new .payment_contents .select_total{height:70px; line-height:70px;} .payment_new .payment_contents .select_total .coin_total{float:left; padding:0 30px; font-size:16px; font-weight:bold; border-right:1px solid #d0d3dd;} .payment_new .payment_contents .select_total .coin_detail{float:left; line-height:70px; background:url(/assets/img/www/payment_new/payment_icon_equal.png) no-repeat left center; margin-left:-13px; padding-left:43px;} .payment_new .payment_contents .select_total .coin_detail span.num{font-family:tahoma, sans-serif; font-size:22px; font-weight:bold;} .payment_new .payment_contents .select_total .coin_detail span.txt{font-weight:bold} .payment_new .payment_contents .event_txt{padding:15px 30px; font-size:12px; line-height:18px; clear:both; border-top:1px solid #d0d3dd; background:#f7f8fb;} .payment_new .payment_contents .bronze_txt{padding:15px 30px; font-size:12px; line-height:18px; clear:both; border-top:1px solid #d0d3dd; background:#f7f8fb;display:none;} .payment_new .payment_contents .total_buy{width:940px; margin:auto; border:1px solid #d0d3dd; border-top:2px solid #333; background:#f7f8fb;} .payment_new .payment_contents .total_buy .payment_way_list{padding:20px 30px;} .payment_new .payment_contents .total_buy .way_category{margin-bottom:15px;} .payment_new .payment_contents .total_buy .payment_way_list p.payway_title{font-size:16px; font-weight:bold; margin-bottom:10px;} .payment_new p.payway_title span.payment_icon{display:inline-block; vertical-align:middle; margin-right:5px;} .payment_new span.ico_plus{width:27px; height:27px; background:url(/assets/img/www/payment/payment_icon_plus.png); margin-top:-2px; display:inline-block; vertical-align:middle;} .payment_new p.payway_title span.ctg_mobile{width:14px; height:18px; background:url(/assets/img/www/payment/icon_mobile.png); margin-top:-2px;} .payment_new p.payway_title span.ctg_creditcard{width:20px; height:14px; background:url(/assets/img/www/payment/icon_creditcard.png); margin-top:-2px;} .payment_new p.payway_title span.ctg_giftcard{width:20px; height:14px; background:url(/assets/img/www/payment/icon_voucher.png); margin-top:-3px;} .payment_new p.payway_title span.ctg_mileage{width:20px; height:20px; background:url(/assets/img/www/payment/icon_mileage.png);} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list li{display:inline-block; margin:0 6px 10px 0; width:165px; height:50px;} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list label{display:block; line-height:50px; background:#fff; font-weight:bold; border:1px solid #ddd; border-radius:5px; padding-left:10px; cursor:pointer;} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list label.select{background:#eaedf4; border-color:#2b7cb5; color:#2b7cb5;} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list input[type="radio"]{vertical-align:middle; display:inline-block; margin-right:5px;} .payment_new .payment_contents .total_buy a.newpay_btn_charge{display:inline-block; margin:0 auto 30px; background:#363a48; color:#fff; font-weight:bold; font-size:16px; text-align:center; border-radius:5px; width:200px; height:55px; line-height:55px;} .payment_new .payment_contents .total_buy a.payco_btn{display:none; margin:0 auto 30px; background:#f21313;; color:#fff; font-weight:bold; font-size:16px; text-align:center; border-radius:5px; width:200px; height:55px; line-height:55px;} .payment_new .payment_contents .total_buy .payment_way_list ul{margin-bottom:20px;} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list2 li{width:165px; height:50px; display:inline-block; border-radius:3px; border:1px solid #ddd; background:#fff; line-height:50px; text-align:center; position:relative;} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list2 li a{display:block; color:#000; font-weight:bold;} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list2 li:hover{border-color:#2b7cb5;} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list2 li a:hover{color:#2b7cb5;} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list2 li .pay_alert{position:absolute; top:56px; left:3px; width:160px; height:66px; background:url(/assets/img/www/common/pay_alert_tmoney.png) no-repeat;} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list2 li .pay_alert20{position:absolute; top:56px; left:3px; width:160px; height:66px; background:url(/assets/img/www/common/pay_alert_tmoney_20.png) no-repeat;} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list2 li .pay_alert a.alert_close_x{width:15px; height:15px; display:block; background:url(/assets/img/www/common/pay_alert_x.png) no-repeat center center; position:absolute; top:10px; right:5px;} .payment_new .payment_contents .total_buy .payment_way_list ul.waybtn_list2 li .pay_alert20 a.alert_close_x{width:15px; height:15px; display:block; background:url(/assets/img/www/common/pay_alert_x.png) no-repeat center center; position:absolute; top:10px; right:5px;} /* .payment_new .payway_wp{position:absolute; top:0; left:0; background:#fff; width:1200px; min-height:600px;} */ .payment_new .payway_wp{background:#fff;min-height:600px;} /*결제유의사항*/ .payment_new .payment_contents .new_payment_notice{border:1px solid #ddd; background:#f6f6f6; padding:15px 30px; font-size:12px; line-height:20px;} /*TXTICON*/ .payment_new span.txtcon{display:inline-block; vertical-align:middle; font-size:0; margin:0 5px;} .payment_new span.txtcon.tico_discount{background-image:url(/assets/img/www/payment_new/txtcon_discount.png); width:22px; height:12px;} .payment_new span.txtcon.tico_recommend{background-image:url(/assets/img/www/payment_new/txtcon_recommend.png); width:22px; height:12px;} .payment_new span.txtcon.tico_hot{background-image:url(/assets/img/www/payment_new/txtcon_hot.png); width:22px; height:12px;} .payment_new span.txtcon.tico_new{background-image:url(/assets/img/www/payment_new/txtcon_new.png); width:22px; height:12px;} .payment_new span.txtcon.tico_onlyyou{background-image:url(/assets/img/www/payment_new/txtcon_onlyyou.png); width:51px; height:12px;} /*FONT*/ .payment_new .fc_black{color:#000 !important;} .payment_new .fc_coin{color:#f93232;} .payment_new .fc_mileage{color:#2b7cb5;} /*TITLE*/ .payment_new p.payment_txt_tt{font-size:18px; line-height:30px; font-weight:bold; margin-bottom:15px;} /*BUTTON*/ a.btn_what_mileage{font-size:0; width:105px; height:25px; display:block; background:url(/assets/img/www/payment_new/btn_what_topmileage.png); float:right; margin-top:15px;} a.btn_fixcharge_benefit{font-size:0; width:79px; height:21px; display:inline-block; vertical-align:middle; background:url(/assets/img/www/payment_new/btn_fixcharfge_benefit.png);} a.btn_ico_what_mileage{font-size:0; width:16px; height:16px; display:inline-block; vertical-align:middle; background:url(/assets/img/www/payment_new/ico_question.png);} /*회원등급표*/ .member_level_info{border:1px solid #f54a3d; background:#fff; width:700px; padding:40px 20px 20px; letter-spacing:0;} .member_level_info a.help_close{width:15px; height:16px; display:block; position:absolute; top:10px; right:10px; background:url(/assets/img/www/mypage/layer_close_x.png) no-repeat; cursor:pointer;} .member_level_info .level_cont{background:#f9f9f9; padding:15px 10px; margin-bottom:20px;} .member_level_info .level_cont .level_txt{float:left; padding-top: 18px; text-align:center; width:270px; font-size:14px; font-weight:bold; color:#000; line-height:19px;} .member_level_info .level_cont .level_txt > p {font-size: 15px;} .member_level_info .level_cont .level_txt .level_b_img{width:61px; height:49px; margin:0 auto 10px;} .member_level_info .level_cont .level_txt .level_info{color: #757575; font-size:12px;} .member_level_info .level_cont .level_type01 strong{color:#477706;} .member_level_info .level_cont .level_type01 .level_b_img{background-image:url(http://www.toptoon.com/assets/img/www/mypage/iconLevel01_big.png);} .member_level_info .level_cont .level_type02 strong{color:#858a99;} .member_level_info .level_cont .level_type02 .level_b_img{background-image:url(http://www.toptoon.com/assets/img/www/mypage/iconLevel02_big.png);} .member_level_info .level_cont .level_type03 strong{color:#fc9708;} .member_level_info .level_cont .level_type03 .level_b_img{background-image:url(http://www.toptoon.com/assets/img/www/mypage/iconLevel03_big.png);} .member_level_info .level_cont .level_type04 strong{color:#b3161a;} .member_level_info .level_cont .level_type04 .level_b_img{background-image:url(http://www.toptoon.com/assets/img/www/mypage/iconLevel04_big.png);} .member_level_info .level_cont .level_type05 strong{color:#567b97;} .member_level_info .level_cont .level_type05 .level_b_img{background-image:url(http://www.toptoon.com/assets/img/www/mypage/iconLevel05_big.png);} .member_level_info .level_cont .level_type06 strong{color:#84246e;} .member_level_info .level_cont .level_type06 .level_b_img{background-image:url(http://www.toptoon.com/assets/img/www/mypage/iconLevel06_big.png);} .member_level_info .level_cont .level_type07 strong{color:#9e2f48;} .member_level_info .level_cont .level_type07 .level_b_img{background-image:url(http://www.toptoon.com/assets/img/www/mypage/iconLevel07_big.png);} .member_level_info .level_cont .level_type08 strong{color:#000;} .member_level_info .level_cont .level_type08 .level_b_img{background-image:url(http://www.toptoon.com/assets/img/www/mypage/iconLevel08_big.png);} .member_level_info .level_cont .level_standard{padding-left:15px; border-left: 1px dashed #ccc; float:left; font-size:12px; text-align:left; color:#000;} .member_level_info .level_cont .level_standard p.condition_score{ padding-bottom:7px; background:url(/assets/img/www/mypage/condition_arrow.png) no-repeat 0 8px; padding-left:10px;font-size:14px; font-weight:bold; color:#000; line-height:24px;} .member_level_info .level_cont .level_standard p.condition_score strong {color:#f50002;} .member_level_info .level_cont .level_standard p.condition_score span {color:#888; font-size:12px; display:block; line-height: 15px;} .member_level_info .level_cont .level_standard p.condition_score span > strong {font-weight:800; color:#2d2d2d; font-size:12px; } .member_level_info .level_cont .level_standard p.my_score{padding: 7px; font-size:11px; color: #888; border-radius: 2px;} .member_level_info .level_cont .level_standard p.my_score strong {display:block; color: #717171; margin-bottom: 6px; font-size:12px; background:url(http://www.toptoon.com/assets/img/www/mypage/ico_info_l.gif) no-repeat left center; padding-left: 14px;} .member_level_info span.txt_gray{text-align:right; color:#888; font-size:11px; display: block; padding-top:5px} .member_level_info caption{font-size:14px; background: url(/assets/img/www/mypage/condition_arrow.png) no-repeat 0 6px; padding-left: 10px; font-weight:bold; text-align:left; color:#000; margin-bottom:10px;} .member_level table{width:100%; text-align:center; font-size:12px; border:1px solid #ddd; border-bottom:0; color:#000;} .member_level table caption { font-size: 14px; background: url(/assets/img/www/mypage/condition_arrow.png) no-repeat 0 6px; padding-left: 10px; font-weight: bold; text-align: left; color: #000; margin-bottom: 10px;} .member_level table tr:nth-child(3) {font-weight: 800;} .member_level table tr.rd > td {font-weight: 800; color: #f54a3d !important;} .member_level table td, .member_level table th{border-bottom:1px solid #ddd; border-right:1px solid #ddd; padding:10px 0; } .member_level table td{width:102px;} .member_level table th{background:#f9f9f9;width: 14%;} .member_level table td img{margin:0 auto 2px; display:block;} .member_level table td span{display:block;} .member_level table td span.eng_type{font-weight:bold; font-size:14px;} .member_level table td.bg {background:#f7fbff;} .member_level table td.table_level01 strong{color:#477706; font-weight:bold;} .member_level table td.table_level02 strong{color:#858a99; font-weight:bold;} .member_level table td.table_level03 strong{color:#fc9708; font-weight:bold;} .member_level table td.table_level04 strong{color:#b3161a; font-weight:bold;} .member_level table td.table_level05 strong{color:#567b97; font-weight:bold;} .member_level table td.table_level06 strong{color:#84246e; font-weight:bold;} .member_level table td.table_level07 strong{color:#9e2f48; font-weight:bold;} .member_level table td.table_level08 strong{color:#000; font-weight:bold;} .btn_nickanme { margin-right: 1px; display: inline-block; background: linear-gradient(to bottom, #fdfdfd 1%,#f1f1f1 60%,#efefef 100%); color: #404040; padding: 2px 4px; border-radius: 2px; font-size: 11px; border: 1px solid #bebebe;} /*회차리스트 기다리면 무료*/ .preview_area a.btn_wait_free{background:#f2f2f2; background:linear-gradient(to bottom, #ffffff 0%,#f2f2f2 100%); display:block; width:96%; height:35px; line-height:35px; text-align:center; color:#000; border:1px solid #ddd; border-radius:5px; font-size:0; clear:both; margin:10px auto; letter-spacing:-1px;} .preview_area a.btn_wait_free span{vertical-align:middle; font-size:12px; display:inline-block;} .preview_area a.btn_wait_free span.icon_wait{width:13px; height:15px; background:url(/assets/img/mobile/eplist/icon_preview_counter.png) no-repeat center center; background-size:100%; margin-right:5px;} .preview_area a.btn_wait_free span.day_timer{font-size:11px; background:#333; color:#fff; height:20px; line-height:20px; padding:0 5px; border-radius:3px; margin-left:7px;} .preview_area span.epicon{display:inline-block; vertical-align:middle; color:#000;} .preview_area span.epicon.ico_arrow_down_black{width:10px; height:6px; background:url(/assets/img/mobile/eplist/select_info_arrow_down_black.png) no-repeat center center; background-size:100%; margin-left:15px;} .preview_area span.epicon.ico_arrow_up_black{width:10px; height:6px; background:url(/assets/img/mobile/eplist/select_info_arrow_up_black.png) no-repeat center center; background-size:100%;} /* 최근 본 회차 */ .icon_last_episode {margin-left:2px;padding:0px 3px 1px 3px;border-radius:12px;border:1px #ff6a1d solid;color:#ff6a1d;line-height:14px;font-size:11px;font-weight:bold;letter-spacing:-1px;} .icon_update_episode{position:absolute;bottom:0;left:0;width:100%;height:20px;line-height:20px;text-align:center;color:#F54A3D;font-weight:bold;background-color:rgba(0,0,0,0.7);letter-spacing:-1px;} .icon_update_episode_mark{margin-left: 3px;border-radius: 12px; border: 1px #ff6a1d solid; color: #ff6a1d; font-size: 11px; font-weight: bold; letter-spacing: -1px; height: 16px; line-height: 15px; text-align: center; width: 26px; display: inline-block;} .icon_dday_mark{display:inline-block; vertical-align:middle; border-radius:12px; border: 1px #ff6a1d solid; color: #ff6a1d; line-height: 14px; font-size: 11px; font-weight: bold; letter-spacing: -1px; display: inline-block; vertical-align: middle; width:30px; text-align: center; margin-right:10px; height: 16px; line-height: 15px;} .icon_dday_mark span{display:inline-block; vertical-align:middle;} .icon_dday_mark span.dday_lock{width:10px; height:12px; background:url(/assets/img/www/eplist/icon_dday_lock.png) no-repeat; margin-top:1px;} .icon_freeticket {display:inline-block;vertical-align:middle;width:30px;height:18px;background:url(/assets/img/www/eplist/icon_wait_free.png) center no-repeat;background-color:#000;;border-radius:12px;margin-right:10px;} /* 전체구매하기 에피소드 리스트 */ #alert_layer #btn_buy_all_episode_list {margin:0 auto;padding:8px 0;width:80%;text-align:center;color:#999;cursor:pointer;} #alert_layer #buy_all_episode_list {margin:0 auto;padding:10px 0;width:80%;max-height:95px;text-align:left;color:#999;overflow-y:auto;display:none;} #alert_layer #buy_all_episode_list li {margin:3px 0;width:50%;display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;word-wrap:break-word;} hr.gray {width:80%;margin:0 auto;padding:0;border:0;border-top:1px #ddd solid;} /*쿠폰함*/ .mycoupon_list ul, .mycoupon_list li{padding:0; margin:0;} .coupon_tab{position:relative; margin:0; height:45px; background:none;} .coupon_tab ul{height:30px; overflow:hidden; *zoom:1; background:url("/assets/img/www/mypage/web_tab_bg.gif") repeat-x left bottom;} .coupon_tab ul li{float:left; width:200px;} .coupon_tab ul li a{display:block; width:198px; height:19px; border:1px solid #b9b9b9; border-bottom:none; text-align:center; padding-top:8px; color:#666; text-decoration:none !important; background:#f8f8f8;} .coupon_tab ul li.on a{width:196px; height:20px; border:2px solid #666; border-bottom:none; color:#000; font-weight:bold; background:#fff;} .mycoupon_list .coupon_notice{margin:0 15px 15px; color:#999; text-align:left; line-height:20px;} .mycoupon_list .coupon_notice ul{color:#666; font-size:11px;} .mycoupon_list .coupon_notice li:before{content:''; display:block; float:left; width:2px; height:2px; background:#666; margin:8px 3px 0 0;} .mycoupon_list .coupon_tt{font-weight:bold; color:#000; text-align:left; line-height:16px; text-indent:30px;} .mycoupon_list .coupon_date span.date{display:block; color:#999; line-height:14px;} .mycoupon_list .coupon_date span.expiry{display:block; font-weight:bold; color:#dc1e25; line-height:14px; margin-top:5px;} .mycoupon_list .use_pd span{display:inline-block; font-size:10px; width:50px; height:20px; line-height:20px; margin:0 2px; text-align:center;} .mycoupon_list span.pc_coupon{border:1px solid #1e98cb; color:#1e98cb;} .mycoupon_list span.app_coupon{border:1px solid #3ebaa4; color:#3ebaa4;} .mycoupon_list span.mw_coupon{border:1px solid #694; color:#694;} .mycoupon_list a.btn_use{display:block; width:60px; height:25px; line-height:25px; text-align:center; color:#fff; font-weight:bold; border:1px solid #bd0a10; background:#dc1e25; margin:auto;} .mycoupon_list a.btn_end{display:block; width:60px; height:25px; line-height:25px; text-align:center; color:#999; font-weight:bold; border:1px solid #ccc; background:#f1f1f1; margin:auto;} /*무료관개선161230*/ .free_webtoon{width:100%; background:url(/assets/img/event/free_webtoon/bg_pattern.gif) repeat; margin-top:120px; border-bottom:1px solid #000;} .free_webtoon .free_contents{width:1198px; height:390px; margin:auto; position:relative; border:1px solid #000;} .free_webtoon .free_contents .main_rolling{width:1198px; height:270px; background-position:left top;} .free_webtoon .free_contents .main_rolling a.left_btn{width:55px; height:55px; display:block; position:absolute; top:105px; left:-1px; cursor:pointer; background:url(/assets/img/event/free_webtoon/left_btn.jpg); border:1px solid #000;} .free_webtoon .free_contents .main_rolling a.right_btn{width:55px; height:55px; display:block; position:absolute; top:105px; right:-1px; cursor:pointer; background:url(/assets/img/event/free_webtoon/right_btn.jpg); border:1px solid #000;} .free_webtoon .free_contents .main_rolling .badge{position:absolute; top:0px; right:0; width:81px; height:82px; background:url(/assets/img/event/free_webtoon/today_badge.jpg) no-repeat; text-align:center; font-size:19px; font-weight:bold; line-height:22px; color:#fff; padding-top:18px;} .free_webtoon .free_contents .main_rolling .main_text{width:400px; height:230px; float:right; background:url(/assets/img/www/free_bnr_gradation.png) repeat-y left top; padding-top:40px; padding-left:300px; } .free_webtoon .free_contents .main_rolling .main_text p.main_sub{font-size:23px; line-height:22px; color:#fff; margin-bottom:22px; display:-webkit-box; text-overflow:ellipsis; -webkit-box-orient:vertical; text-shadow: 1px 1px 1px #555;} .free_webtoon .free_contents .main_rolling .main_text p.main_title{font-size:35px; font-weight:bold; color:#fff; margin-bottom:45px; display:-webkit-box; text-overflow:ellipsis; letter-spacing:-4px; text-shadow: 1px 1px 1px #555;} .free_webtoon .free_contents .main_rolling .main_text p.main_b{font-size:23px; font-weight:bold; color:#ec460a; margin-bottom:18px; display:-webkit-box; text-overflow:ellipsis; letter-spacing:-3px;} .free_webtoon .free_contents .main_rolling .main_text p.main_b_sub{font-size:14px; color:#fff; margin-bottom:70px; display:-webkit-box; text-overflow:ellipsis; letter-spacing:-2px; width:300px;} .free_webtoon .free_contents .free_banner{width:1198px; height:118px; border-top:1px solid #000; border-right:1px solid #000;} .free_webtoon .free_contents .free_banner li{display:block; width:279px; height:95px; border-left:1px solid #000; float:left; position:relative; background-color: #3c3c3c; cursor:pointer; padding-top:25px; padding-left:20px;} .free_webtoon .free_contents .free_banner li:hover, .free_webtoon .free_contents .free_banner li.active{color:#f4c3b2;} .free_webtoon .free_contents .free_banner li:first-child{border-left:0; width:278px;} .free_webtoon .free_contents .free_banner li.free_list_01{background:url(/assets/img/event/free_webtoon/free_list_01.png) no-repeat right center #3c3c3c;} .free_webtoon .free_contents .free_banner li.free_list_01:hover, .free_webtoon .free_contents .free_banner li.free_list_01.active{background:url(/assets/img/event/free_webtoon/free_list_01_over.png) no-repeat right center #ec460a;} .free_webtoon .free_contents .free_banner li.free_list_02{background:url(/assets/img/event/free_webtoon/free_list_02.png) no-repeat right center #3c3c3c;} .free_webtoon .free_contents .free_banner li.free_list_02:hover, .free_webtoon .free_contents .free_banner li.free_list_02.active{background:url(/assets/img/event/free_webtoon/free_list_02_over.png) no-repeat right center #ec460a;} .free_webtoon .free_contents .free_banner li.free_list_03{background:url(/assets/img/event/free_webtoon/free_list_03.png) no-repeat right center #3c3c3c;} .free_webtoon .free_contents .free_banner li.free_list_03:hover, .free_webtoon .free_contents .free_banner li.free_list_03.active{background:url(/assets/img/event/free_webtoon/free_list_03_over.png) no-repeat right center #ec460a;} .free_webtoon .free_contents .free_banner li.free_list_04{background:url(/assets/img/event/free_webtoon/free_list_04.png) no-repeat right center #3c3c3c;} .free_webtoon .free_contents .free_banner li.free_list_04:hover, .free_webtoon .free_contents .free_banner li.free_list_04.active{background:url(/assets/img/event/free_webtoon/free_list_04_over.png) no-repeat right center #ec460a;} .free_webtoon .free_contents .free_banner li p.w_title{font-size:18px; font-weight:bold; color:#fff; margin-bottom:5px;} .free_webtoon .free_contents .free_banner li p.w_sub{font-size:12px; color:#878787; margin-bottom:13px;} .free_webtoon .free_contents .free_banner li:hover p.w_sub, .free_webtoon .free_contents .free_banner li.active p.w_sub{color:#f4c3b2;} .free_webtoon .free_contents .free_banner li a.more_view{color:#878787; display:block; width:60px; height:20px; line-height:20px; border-radius:10px; border:1px solid #878787; text-align:center;} .free_webtoon .free_contents .free_banner li:hover a.more_view, .free_webtoon .free_contents .free_banner li.active a.more_view{color:#f4c3b2; border-color:#f4c3b2;} /*코인소진창::170103*/ .notice_popup{width:450px; margin:auto; background:#fff; position:relative;} .notice_popup a{cursor:pointer; z-index: 2;} .notice_popup .notice_top_com a.notice_popup_close{display:block; width:43px; height:43px; background:url(/assets/img/www/notice_pop/notice_pop_close.png) no-repeat; position:absolute; top:0px; right:0px; background-size:100%;} .notice_popup .close_line{height:40px; line-height:40px; background:#d5d5d5; color:#303134; padding:0 25px; position:relative;} .notice_popup .close_line input[type=checkbox]{display:none;} .notice_popup .close_line label{height:18px; line-height:18px; background:url(/assets/img/www/alert/checkbox_check.png) no-repeat left center; background-size:18px 18px; padding-left:25px; cursor:pointer; display:block; position:absolute; top:11px; left:25px;} .notice_popup .close_line label.on{background-image:url(/assets/img/www/alert/checkbox_check_on.png);} .notice_popup .close_line a.btn_close{width:35px; height:20px; line-height:20px; color:#fff; background:#303134; text-align:center; display:block; border-radius:3px; float:right; font-weight:bold; margin-top:9px;} .notice_popup .notice_top_com{width:100%; height: 43px; margin:0; padding:auto; position:absolute; background:url(/assets/img/www/notice_pop/notice_top.png) no-repeat 15px center #343e5b;} .notice_popup .contents_area{text-align:center; font-size:15px; padding:20px 0; line-height:22px; padding:80px 0 15px;} .notice_popup .contents_area .btn_area{width:400px; text-align:center; margin:13px auto 0;} .notice_popup .contents_area .btn_area a{display:inline-block; width:150px; height:40px; line-height:40px; font-weight:bold; color:#fff; border-radius:50px; font-size:12px; margin:12px 5px;} .notice_popup .contents_area .btn_area a.btn_red{background:#ef3e2c;} .notice_popup .notice_contents{text-align:center; width:80%; margin:0 auto; padding-top:10px; font-size:12px; color:#838383; line-height:18px; letter-spacing:-1px;} .notice_popup p.notice_title{width:80%; margin:0 auto; padding-bottom:15px; text-align:center; letter-spacing:-2px; color:#25304f; font-weight:bold; font-size:26px; border-bottom:1px solid #25304f;} .payment_new img.pay_help{display:inline-block; margin:-2px 0 0 3px; vertical-align:middle;cursor:pointer;} /*170210 무료관 디자인 개선*/ .free_renewal{width:100%; margin:120px auto 0;} .free_renewal .free_sale{width:100%; background-color:#313340;} .free_renewal .free_sale .free_contents{width:1200px; height:364px; margin:0 auto; position:relative;} .free_renewal .free_sale .free_contents .main_rolling{width:100%; height:363px; background-position:left top; background-size:cover; background-repeat:no-repeat;} .free_renewal .free_sale .free_contents .button{position:absolute; right:64px; bottom:156px;} .free_renewal .free_sale .free_contents a.left_btn{width:41px; height:21px; display:block; position:absolute; left:-47px; top:105px; cursor:pointer; background:url(/assets/img/event/free_renewal/prev_btn.png) center center no-repeat; border-right:1px solid #545454;} .free_renewal .free_sale .free_contents a.right_btn{width:30px; height:21px; display:block; position:absolute; top:105px; cursor:pointer; background:url(/assets/img/event/free_renewal/next_btn.png) center center no-repeat;} .free_renewal .free_sale .free_contents .free_banner{position:absolute;top:0;right:0;width:242px; height:362px; float:right; border:1px solid #262626;} .free_renewal .free_sale .free_contents .free_banner ul{margin:0; padding:0; list-style:none;} .free_renewal .free_sale .free_contents .free_banner li{display:block; width:120px; height:120px; float:left; border-left: 1px solid #262626; border-bottom: 1px solid #262626; background-color: #3c3c3c; color:#fff; cursor:pointer; text-align:center; position:relative; } .free_renewal .free_sale .free_contents .free_banner .free_list_01{background:url(/assets/img/event/free_renewal/free_list_01.png) no-repeat center 14px #3c3c3c;} .free_renewal .free_sale .free_contents .free_banner .free_list_01:hover, .free_renewal .free_sale .free_contents .free_banner .free_list_01.active{background:url(/assets/img/event/free_renewal/free_list_01_over.png) no-repeat center 14px #ec460a;} .free_renewal .free_sale .free_contents .free_banner .free_list_02{background:url(/assets/img/event/free_renewal/free_list_02.png) no-repeat center 15px #3c3c3c;} .free_renewal .free_sale .free_contents .free_banner .free_list_02:hover, .free_renewal .free_sale .free_contents .free_banner .free_list_02.active{background:url(/assets/img/event/free_renewal/free_list_02_over.png) no-repeat center 15px #ec460a;} .free_renewal .free_sale .free_contents .free_banner .free_list_03{background:url(/assets/img/event/free_renewal/free_list_03.png) no-repeat center 14px #3c3c3c;} .free_renewal .free_sale .free_contents .free_banner .free_list_03:hover, .free_renewal .free_sale .free_contents .free_banner .free_list_03.active{background:url(/assets/img/event/free_renewal/free_list_03_over.png) no-repeat center 14px #ec460a;} .free_renewal .free_sale .free_contents .free_banner .free_list_04{background:url(/assets/img/event/free_renewal/free_list_04.png) no-repeat center 14px #3c3c3c;} .free_renewal .free_sale .free_contents .free_banner .free_list_04:hover, .free_renewal .free_sale .free_contents .free_banner .free_list_04.active{background:url(/assets/img/event/free_renewal/free_list_04_over.png) no-repeat center 14px #ec460a;} .free_renewal .free_sale .free_contents .free_banner .free_list_05{background:url(/assets/img/event/free_renewal/free_list_05.png) no-repeat center 14px #3c3c3c;} .free_renewal .free_sale .free_contents .free_banner .free_list_05:hover, .free_renewal .free_sale .free_contents .free_banner .free_list_05.active{background:url(/assets/img/event/free_renewal/free_list_05_over.png) no-repeat center 14px #ec460a;} .free_renewal .free_sale .free_contents .free_banner .free_list_06{background:url(/assets/img/event/free_renewal/free_list_06.png) no-repeat center 12px #3c3c3c;} .free_renewal .free_sale .free_contents .free_banner .free_list_06:hover, .free_renewal .free_sale .free_contents .free_banner .free_list_06.active{background:url(/assets/img/event/free_renewal/free_list_06_over.png) no-repeat center 12px #ec460a;} .free_renewal .free_sale .free_contents .free_banner li p.w_title{font-size:12px; font-weight:bold; letter-spacing:-1px; color:#fff; position:absolute; bottom:18px; display:block; text-align:center; width:100%;} /*.free_renewal .free_sale .free_contents .main_rolling .main_text {width:350px; height:263px; float:right; padding-top:98px; padding-left:200px; background:url(/assets/img/event/free_renewal/gradation.png) repeat-x center center;}*/ .free_renewal .free_sale .free_contents .main_rolling .main_text {width:350px; height:263px; float:right; padding-top:98px; padding-left:200px;} .free_renewal .free_sale .free_contents .main_rolling .recommend_badge {position:absolute; width:80px; height:80px; background:url(/assets/img/event/free_renewal/badge_bg.jpg); background-size:100%; font-size:13px; font-weight:bold; letter-spacing:-1px; top:0; left:0; text-align:center; color:#fff; line-height:18px; padding-top:20px; z-index:2; box-sizing:border-box;} .free_renewal .free_sale .free_contents .main_rolling .main_text p.main_title{width:80%; font-size:34px; font-weight:bold; color:#fff; margin-bottom:16px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; letter-spacing:-5px; text-shadow: 1px 1px 1px #000; line-height:36px;} .free_renewal .free_sale .free_contents .main_rolling .main_text p.main_b{width:85%; font-size:21px; font-weight:bold; color:#fd5a20;overflow:hidden; text-overflow:ellipsis; white-space:nowrap; letter-spacing:-3px; text-shadow: 1px 1px 1px #000; line-height:35px;} .free_renewal .free_sale .free_contents .main_rolling .main_text p.main_b_sub{width:85%; font-size:15px; color:#fff; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; letter-spacing:-2px; width:300px; text-shadow: 1px 1px 1px #000; line-height:22px; max-height:62px;word-wrap:break-word;} .free_renewal .free_sale .free_contents .main_rolling .main_text a.more_btn{width:80px; color:#fff; display:block; height:24px; line-height:24px; border-radius:20px; border:2px solid #fff; text-align:center; letter-spacing:-2px; margin-top:33px; font-size:14px; text-shadow: 1px 1px 1px #000;} .free_renewal .free_sale_contents{width:100%; background-color:#f2f1f6; padding-bottom:30px;} .free_renewal .free_sale_contents .free_sale_list{width:1200px; background:#f2f1f6; margin:0 auto;} .free_renewal .free_sale_contents .free_sale_list .list_title{font-size:22px; font-weight:bold; color:#333333; letter-spacing:-2px; text-align:center; padding-top:10px; padding-bottom:5px;} .free_renewal .free_sale_contents .free_sale_list .list_title span{vertical-align: middle;} .free_renewal .free_sale_contents .free_sale_list .list_comment{font-size:14px; color:#797979; text-align:center; margin-bottom:30px; letter-spacing: -2px;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon{width:1200px;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon ul{margin: 0; padding: 0;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon ul li{float:left; border: 1px solid #cecdd1; border-radius:9px; margin-left:26px; margin-bottom:30px;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon ul li a{display:block; cursor:pointer;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon .webtoon_list .thumb{width:217px; height:210px; background-size:cover; background-position:center center; background-repeat:no-repeat; border-top-left-radius:9px; border-top-right-radius:9px; } .free_renewal .free_sale_contents .free_sale_list .sale_webtoon .webtoon_list .info{width:217px; height:105px; padding:10px; position:relative; background:#fff; box-sizing: border-box; border-bottom-right-radius:9px; border-bottom-left-radius:9px;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon .webtoon_list .info .free_badge{position:absolute; width:45px; height:45px; top:-22px; right:8px; border-radius:50%; background-color:#ec460a; color:#fff; font-family:tahoma; font-size:13px; font-weight:bold; text-align:center; line-height:45px; border:2px solid #fff; letter-spacing:0;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon .webtoon_list .info .sale_badge{position:absolute; width:45px; height:45px; top:-22px; right:8px; border-radius:50%; background-color:#4d8dcc; color:#fff; font-family:tahoma; font-size:13px; font-weight:bold; text-align:center; line-height:45px; border:2px solid #fff; letter-spacing:0;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon .webtoon_list .info p.w_title{width:80%; font-size:16px; line-height:22px; font-weight:bold; color:#000; margin-bottom:7px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon .webtoon_list .info p.webtoon_synopsis{width:85%; font-size:12px; font-weight:bold; color:#797b7c; margin:4px 0 10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon .webtoon_list .info p.w_coin{font-size:13px; color:#5b96cf; position:relative; margin-bottom:10px; border-top:1px solid #cecdd1; padding: 9px 0 0; font-weight:bold; letter-spacing:-1px;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon .webtoon_list .info p.w_coin span.coin_bf{color:#797b7c; font-size:12px; text-decoration: line-through; margin-right:3px;} .free_renewal .free_sale_contents .free_sale_list .sale_webtoon .webtoon_list .info p.w_coin span.coin_af{color:#ec460a; font-size:13px;} /*172014 luckybox*/ .luckybox{width:400px; max-width:400px; margin:50px auto; background:#f6f6f6; position:relative; text-align:center; border-radius:7px;} .luckybox a{cursor:pointer;} .luckybox .luckybox_title{font-size:19px; letter-spacing:-1px; height:55px; line-height:53px; color:#1a1717; font-weight: bold; border-bottom: 1px solid #b2b2b2;} .luckybox .luckybox_title span{vertical-align:middle;} .luckybox .luckybox_title span.luckybox_icon{display:inline-block; padding-right:7px;} .luckybox .contents_area .contents_title{font-size: 23px; color:#1a1717; font-weight: bold; letter-spacing:-2px; line-height:42px; margin: 18px auto 0;} .luckybox .contents_area .contents_text{font-size: 14px; line-height:23px; color:#797b7c; letter-spacing:-2px; margin: -3px auto 7px;} .luckybox .contents_area .contents_gift{font-size: 15px; color:#000; font-weight:bold; letter-spacing:-2px; margin: 10px auto 10px;} .luckybox .contents_area .contents_gift .point{color:#f1560c;} .luckybox .contents_area .contents_img{margin: 0 auto;} .luckybox .contents_area .random_confirm{width:210px; height:44px; line-height:44px; background-color: #f1560c; border-radius:30px; margin:0 auto;} .luckybox .contents_area .random_confirm a{display:block; cursor: pointer;} .luckybox .contents_area .random_confirm a.confirm_btn{color:#fff; font-weight: bold; font-size:17px; letter-spacing:-1px;} .luckybox .contents_area .lucky_time{width:240px; height:44px; line-height:42px; background-color: #4f4f4f; color:#fff; font-weight: bold; font-size:17px; letter-spacing:-1px; border-radius:30px; margin:0 auto;} .luckybox .contents_area .lucky_time .time_icon{margin-left:5px; margin-right:7px; display:inline-block;} .luckybox .contents_area .contents_app span{display:inline-block; vertical-align:middle;} .luckybox .contents_area .contents_app a{display:block; cursor: pointer;} .luckybox .contents_area .contents_app .onestore{width:90px;} .luckybox .contents_area .contents_app .appstore{width:90px;} .luckybox .contents_area .contents_app .googlestore{width:90px;} .luckybox .close_line{height:44px; line-height:44px; background-color: #080404; margin-top:30px; border-bottom-left-radius: 7px; border-bottom-right-radius: 7px;} .luckybox .close_line a.btn_close{display: block; cursor:pointer; color:#fff; font-weight: bold; font-size:15px; letter-spacing:-1px;} /*172014 매일 1회차 무료이용권 지급*/ .free_everyday{width:400px; max-width:400px; margin:50px auto; background:#f6f6f6; position:relative; text-align:center; border-radius:7px;} .free_everyday a{cursor:pointer;} .free_everyday .everyday_title{font-size:19px; letter-spacing:-1px; height:55px; line-height:53px; color:#1a1717; font-weight: bold; border-bottom: 1px solid #b2b2b2;} .free_everyday .everyday_title span{vertical-align: middle; line-height:53px;} .free_everyday .everyday_title span.everyday_icon{display:inline-block;} .free_everyday .everyday_title span.title{display:inline-block; height:55px; line-height:53px;} .free_everyday .contents_area .contents_title{font-size: 21px; color:#1a1717; font-weight: bold; letter-spacing:-2px; line-height:41px; margin:15px auto 0;} .free_everyday .contents_area .contents_text{font-size: 13px; color:#797b7c; letter-spacing:-1px; margin: 6px auto; line-height:21px;} .free_everyday .contents_area .contents_text .point{color:#f1560c; font-weight:bold;} .free_everyday .contents_area .contents_tip{font-size: 13px; color:#000; font-weight:bold; letter-spacing:-1px; margin:18px auto 5px; width:93%; line-height:21px;} .free_everyday .contents_area .contents_tip .point{color:#2f84f8;} .free_everyday .contents_area .contents_img{width:154x; margin: 0 auto;} .free_everyday .contents_area .contents_app span{display:inline-block; vertical-align:middle;} .free_everyday .contents_area .contents_app a{display:block; cursor: pointer;} .free_everyday .contents_area .contents_app .onestore{width:90px;} .free_everyday .contents_area .contents_app .appstore{width:90px;} .free_everyday .contents_area .contents_app .googlestore{width:90px;} .free_everyday .close_line{height:44px; line-height:44px; background-color: #080404; margin-top:30px; border-bottom-left-radius: 7px; border-bottom-right-radius: 7px;} .free_everyday .close_line a.btn_close{display: block; cursor:pointer; color:#fff; font-weight: bold; font-size:15px; letter-spacing:-1px;} /* 170228 무료선물함 */ .giftbox_free{width:100%; margin:35px auto 0;} .giftbox_free .gift_contents{width:1200px; height:364px; position:relative; margin:0 auto;} .giftbox_free .gift_contents h2{margin:0 0 15px 0; padding:0; border:0;} .giftbox_free .gift_contents .gift_webtoon{width:1200px; margin: 25px 0 0;} .giftbox_free .gift_contents .gift_webtoon ul{margin: 0; padding: 0;} .giftbox_free .gift_contents .gift_webtoon ul li{float:left; border: 2px solid #ebebeb; margin-left:23px; margin-bottom:30px;} .giftbox_free .gift_contents .gift_webtoon ul li a{display:block; cursor:pointer;} .giftbox_free .gift_contents .gift_webtoon .webtoon_list .thumb{width:217px; height:137px; background-size:cover; background-position:center center; background-repeat:no-repeat; } .giftbox_free .gift_contents .gift_webtoon .webtoon_list .info{width:217px; height:95px; padding:10px; position:relative; background:#fff; box-sizing: border-box;} .giftbox_free .gift_contents .gift_webtoon .webtoon_list .info a{display:block; cursor:pointer;} .giftbox_free .gift_contents .gift_webtoon .webtoon_list .info p.w_title{width:80%; font-size:16px; line-height:21px; font-weight:bold; color:#000; margin-bottom:5px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .giftbox_free .gift_contents .gift_webtoon .webtoon_list .info p.webtoon_synopsis{width:85%; font-size:12px; font-weight:bold; color:#797b7c; margin:4px 0 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .giftbox_free .gift_contents .gift_webtoon .webtoon_list .info p.rent{font-size:12px; color:#1a1717; margin-bottom:10px; padding: 9px 0 0; font-weight:bold; letter-spacing:-1px;} .giftbox_free .gift_contents .gift_webtoon .webtoon_list .info p.rent span{vertical-align:middle;} .giftbox_free .gift_contents .gift_webtoon .webtoon_list .info p.rent span.num{color:#519bff;} .giftbox_free .gift_contents .gift_webtoon .webtoon_list .info .gift_complete{font-size:12px; font-weight:bold; color:#797b7c; margin:0; width:56px; height:25px; float:right; margin:5px 3px; border: 1px solid #9d9e9f; line-height: 25px; text-align:center; background-color: #ebebeb; border-radius:3px; z-index:10;} .giftbox_free .gift_contents .gift_webtoon .webtoon_list .info .gift_btn{font-size:12px; font-weight:bold; color:#dc1e25; margin:0; width:56px; height:25px; float:right; margin:5px 3px; border: 1px solid #dc1e25; line-height: 25px; text-align:center; background-color: #fff; border-radius:3px; z-index:10;} /*170302 무료선물함 팝업*/ .giftbox_popup{width:400px; max-width:400px; margin:115px auto; background:#f6f6f6; position:relative; text-align:center; border-radius:7px;} .giftbox_popup a{cursor:pointer;} .giftbox_popup .notice_title{font-size:18px; letter-spacing:-1px; height:51px; line-height:47px; color:#1a1717; font-weight: bold; border-bottom: 1px solid #b2b2b2;} .giftbox_popup .notice_title span{vertical-align:middle;} .giftbox_popup .notice_title span.notice_icon{display:inline-block; width:27px; padding-right:5px;} .giftbox_popup .contents_area .contents_title{font-size: 23px; color:#1a1717; font-weight: bold; letter-spacing:-2px; line-height:42px; margin: 18px auto 5px;} .giftbox_popup .contents_area .contents_title2{font-size: 16px; color:#1a1717; letter-spacing:-1px; line-height:41px; margin: 18px auto 5px;} .giftbox_popup .contents_area .contents_text{font-size: 14px; line-height:23px; color:#797b7c; letter-spacing:-2px; margin: -3px auto 7px;} .giftbox_popup .contents_area .contents_gift{font-size: 15px; color:#000; font-weight:bold; letter-spacing:-2px; margin:10px auto 7px;} .giftbox_popup .contents_area .contents_gift .point{color:#f1560c;} .giftbox_popup .contents_area .random_confirm{width:210px; height:44px; line-height:44px; background-color: #5373be; border-radius:30px; margin:0 auto;} .giftbox_popup .contents_area .random_confirm a{display:block; cursor: pointer;} .giftbox_popup .contents_area .random_confirm a.confirm_btn{color:#fff; font-weight: bold; font-size:15px; letter-spacing:-1px;} .giftbox_popup .contents_area .contents_app span{display:inline-block; vertical-align:middle;} .giftbox_popup .contents_area .contents_app a{display:block; cursor: pointer;} .giftbox_popup .contents_area .contents_app .onestore{width:90px;} .giftbox_popup .contents_area .contents_app .appstore{width:90px;} .giftbox_popup .contents_area .contents_app .googlestore{width:90px;} .giftbox_popup .close_line{height:44px; line-height:44px; background-color: #080404; margin-top:30px; border-bottom-left-radius: 7px; border-bottom-right-radius: 7px;} .giftbox_popup .close_line a.btn_close{display: block; cursor:pointer; color:#fff; font-weight: bold; font-size:15px; letter-spacing:-1px;} /*170315 무료관 2개 메뉴 삭제*/ .free_renewal .free_sale .free_contents .free_banner2{position:absolute; top:0; right:0; width:242px; height:362px; float:right; border:1px solid #262626;} .free_renewal .free_sale .free_contents .free_banner2 ul{margin:0; padding:0; list-style:none;} .free_renewal .free_sale .free_contents .free_banner2 li{width:242px; height:90px; border-bottom:1px solid #262626; background-color:#3c3c3c; color:#fff; cursor:pointer; text-align:center; position:relative;} .free_renewal .free_sale .free_contents .free_banner2 .free_list_01{background:url(/assets/img/event/free_renewal/free_list_01.png) no-repeat 25px center #3c3c3c;} .free_renewal .free_sale .free_contents .free_banner2 .free_list_01:hover, .free_renewal .free_sale .free_contents .free_banner2 .free_list_01.active{background:url(/assets/img/event/free_renewal/free_list_01_over.png) no-repeat 25px center #ec460a;} .free_renewal .free_sale .free_contents .free_banner2 .free_list_03{background:url(/assets/img/event/free_renewal/free_list_03.png) no-repeat 28px center #3c3c3c;} .free_renewal .free_sale .free_contents .free_banner2 .free_list_03:hover, .free_renewal .free_sale .free_contents .free_banner2 .free_list_03.active{background:url(/assets/img/event/free_renewal/free_list_03_over.png) no-repeat 28px center #ec460a;} .free_renewal .free_sale .free_contents .free_banner2 .free_list_05{background:url(/assets/img/event/free_renewal/free_list_05.png) no-repeat 25px center #3c3c3c;} .free_renewal .free_sale .free_contents .free_banner2 .free_list_05:hover, .free_renewal .free_sale .free_contents .free_banner2 .free_list_05.active{background:url(/assets/img/event/free_renewal/free_list_05_over.png) no-repeat 25px center #ec460a;} .free_renewal .free_sale .free_contents .free_banner2 .free_list_06{background:url(/assets/img/event/free_renewal/free_list_06.png) no-repeat 25px center #3c3c3c; border-bottom:0; height:89px;} .free_renewal .free_sale .free_contents .free_banner2 .free_list_06:hover, .free_renewal .free_sale .free_contents .free_banner2 .free_list_06.active{background:url(/assets/img/event/free_renewal/free_list_06_over.png) no-repeat 25px center #ec460a;} .free_renewal .free_sale .free_contents .free_banner2 li p.w_title{font-size:14px; font-weight:bold; letter-spacing:-1px; color:#fff; text-align:left; text-indent:115px; height:90px; line-height:90px;} /*170310 무료관 디자인 개선*/ .absolutely_free_renew{width:100%; margin:0 auto;} .absolutely_free_renew .free_list{width:100%; padding-bottom:30px;} .absolutely_free_renew .free_list .new_free_toon{width:1200px; margin:0 auto;} .absolutely_free_renew .free_list .new_free_toon .list_title{width:1200px; height:36px; font-size:22px; font-weight:bold; color:#333333; letter-spacing:-2px; text-align:center; padding-bottom:5px; position: relative; display:inline-block; margin-top:35px;} .absolutely_free_renew .free_list .new_free_toon .list_title a.btn_more{display:block; width:100px; height:26px; line-height:24px; border:1px solid #ddd; border-radius:3px; text-align:center; color:#222; font-size:12px; font-weight:bold; right:0; position:absolute;} .absolutely_free_renew .free_list .new_free_toon .list_comment{width:1200px; height:14px; font-size:14px; color:#797979; text-align:center; margin-bottom:30px; letter-spacing: -2px; display:inline-block;} .absolutely_free_renew .free_list .new_free_toon .free_toon{width:1200px;} .absolutely_free_renew .free_list .new_free_toon .free_toon ul{margin: 0; padding: 0;} .absolutely_free_renew .free_list .new_free_toon .free_toon ul li{float:left; border: 1px solid #cecdd1; border-radius:9px; margin-left:26px; margin-bottom:25px;} .absolutely_free_renew .free_list .new_free_toon .free_toon ul li:nth-child(5n + 1) {margin-left:0;} .absolutely_free_renew .free_list .new_free_toon .free_toon ul li a{display:block; cursor:pointer;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .thumb{width:217px; height:200px; background-size:cover; background-position:center center; background-repeat:no-repeat; border-top-left-radius:9px; border-top-right-radius:9px; position:relative;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .thumb .wait_free{width:36px; height:36px; position:absolute; left:0; background:rgba(0, 0, 0, 0.6) url(/assets/img/event/free_renewal/icon_wait_free.png) no-repeat center center; border-top-left-radius:6px;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .thumb .nineteen_badge{width:20px; height:20px; background:#f54a3d; font-size:11px; font-weight:bold; border-radius:25px; position:absolute; top:6px; right:6px; color:#fff; text-align:center; line-height:20px;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .info{width:217px; height:105px; padding:10px; position:relative; background:#fff; box-sizing: border-box; border-bottom-right-radius:9px; border-bottom-left-radius:9px;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .info .free_badge{position:absolute; width:45px; height:45px; top:-22px; right:8px; border-radius:50%; background-color:#ec460a; color:#fff; font-family:tahoma; font-size:13px; font-weight:bold; text-align:center; line-height:45px; border:2px solid #fff; letter-spacing:0;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .info .sale_badge{position:absolute; width:45px; height:45px; top:-22px; right:8px; border-radius:50%; background-color:#4d8dcc; color:#fff; font-family:tahoma; font-size:13px; font-weight:bold; text-align:center; line-height:45px; border:2px solid #fff; letter-spacing:0;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .info p.w_title{width:80%; font-size:16px; line-height:22px; font-weight:bold; color:#000; margin-bottom:7px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .info p.w_coin{width:85%; font-size:13px; font-weight:bold; color:#666666; margin:4px 0 10px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .info .webtoon_synopsis{font-size:12px; color:#999999; position:relative; margin-bottom:10px; border-top:1px solid #cecdd1; padding: 9px 0 0; font-weight:bold; letter-spacing:-1px;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .info .webtoon_synopsis span.epi{width:90%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block;} .badge_like{right:0; top:7px; width:110px; height:17px; position:absolute;} p.badge_area{margin-top:7px; margin-left:-2px;} p.badge_area span{float:left !important;} span.upicon_new17{display:block; padding:0 8px; height:15px; line-height:14px; font-size:10px; font-weight:bold; color:#fff; border:1px solid #e63740; text-transform:uppercase; border-radius:15px; position:absolute; background:#e63740; top:10px; right:10px;} span.free_new_badge{display:inline-block; float:right; margin-left:3px; width:28px; height:16px; background: #73b40c; border: 1px solid #598e06; border-radius:2px; font-size:11px; color:#fff; text-align:center; vertical-align:top;} span.free_comment_badge{display:inline-block; float:right; margin-left:3px; width:28px; height:16px; background:#9e3df0; border:1px solid #6d0ac1; border-radius:2px; font-size:11px; color:#fff; text-align:center; vertical-align:top;} span.free_recommend_badge{display:inline-block; float:right; margin-left:3px; width:28px; height:16px; background:#519bff; border:1px solid #1466d4; border-radius:2px; font-size:11px; color:#fff; text-align:center; vertical-align:top;} span.free_complete_badge{display:inline-block; float:right; margin-left:3px; width:28px; height:16px; background:#f03e3d; border:1px solid #bb0302; border-radius:2px; font-size:11px; color:#fff; text-align:center; vertical-align:top;} span.free_rest_badge{display:inline-block; float:right; margin-left:3px; width:28px; height:16px; background:#989898; border:1px solid #747474; border-radius:2px; font-size:11px; color:#fff; text-align:center; vertical-align:top;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .info p.w_coin span.coin_bf{color:#797b7c; font-size:12px; text-decoration: line-through; margin-right:3px;} .absolutely_free_renew .free_list .new_free_toon .free_toon .webtoon_list .info p.w_coin span.coin_af{color:#ec460a; font-size:13px;} /*레이어팝업 UI통일*/ .newlayer_wp{width:380px; margin:auto; border-radius:7px; overflow:hidden; position:relative; background:#fff;} .newlayer_wp .layer_tt{border-bottom:1px solid #ddd; position:relative; text-align:center; height:48px; line-height:44px; color:#000; background:#fff;} .newlayer_wp .layer_tt a.layer_close{display:block; position:absolute; top:10px; right:15px; width:22px; height:22px; background:url(/assets/img/mobile/close_btn_m.png); background-size:22px;} .newlayer_wp .layer_tt span{display:inline-block; vertical-align:middle;} .newlayer_wp .layer_tt span.icon{width:24px; margin-right:9px;} .newlayer_wp .layer_tt span.tt_txt{font-size:16px; font-weight:bold;} .newlayer_wp .layer_tt span.txtpoint{color:#fa2828;} .newlayer_wp .layder_body{font-size:12px; padding:30px 15px 15px; text-align:center; color:#333; line-height:23px; background:#fff;}/*기본텍스트팝업일경우*/ .newlayer_wp .layder_body span.st_point{font-size:16px; font-weight:bold; margin-bottom:10px; color:#000;}/*기본텍스트팝업일경우*/ .newlayer_wp .layder_body_img{padding:0; text-align:center; background:#fff;}/*이미지팝업일경우*/ .newlayer_wp .layder_body_img img{width:100%;}/*이미지팝업일경우*/ .newlayer_wp .btn_area{text-align:center; margin:10px auto 0;} .newlayer_wp .btn_area a{border-radius:100px; display:block; height:35px; line-height:35px; font-weight:bold; color:#fff; font-size:12px; width:50%; margin:15px auto 0;} .newlayer_wp .btn_area button{border-radius:5px; display:block; height:45px; line-height:45px; font-weight:bold; color:#fff; font-size:12px; width:100%;} .newlayer_wp .btn_area.n2 .btn_confirm{width:49%; display:inline-block;} .newlayer_wp .btn_area.n2 .btn_confirm:last-child{margin-right:0;} .newlayer_wp .btn_area.n2 .btn_library{width:47%; margin-right:5px; display:inline-block;} .newlayer_wp .btn_area.n2 .btn_library:last-child{margin-right:0;} .newlayer_wp .btn_area:after{content:""; visibility:hidden; display:block; height:0; clear:both;} .newlayer_wp .btn_area .btn_gray{background:#333;} .newlayer_wp .btn_area .btn_red{background:#fd4243;} .newlayer_wp .close_line{width:100%; height:40px; line-height:40px; background:#000; color:#fff; position:relative;} .newlayer_wp .close_line input[type=checkbox]{display:none;} .newlayer_wp .close_line label{height:18px; line-height:18px; background:url(/assets/img/www/alert/checkbox_check.png) no-repeat left center; background-size:18px 18px; padding-left:25px; cursor:pointer; display:block; position:absolute; top:11px; left:15px; font-size:12px;} .newlayer_wp .close_line label.on{background-image:url(/assets/img/www/alert/checkbox_check_on.png);} .newlayer_wp .close_line a.btn_close{height:24px; line-height:24px; color:#fff; background:#222; text-align:center; display:block; border-radius:3px; font-weight:bold; position:absolute; top:9px; right:15px; font-size:12px; padding:0 7px;} .newlayer_wp .close_line .close_check{width:50%; height:40px; float:left; background:#333; text-align:center;} .newlayer_wp .close_line .close_btn{width:50%; height:40px; float:right;} .newlayer_wp .close_line .close_btn a.btn_close_full{width:100%; text-align:center; color:#fff; display:block; cursor:pointer;} .newlayer_wp .btn_never_show {color:#fff;font-size:12px;cursor:pointer;} /*H메이트 동거 풀사이즈 레이어 배너*/ .fulllayer_hcoha{width:100%; height:320px; background:url(/assets/img/www/event/theme_hcoha/main_bnr_pcweb_hcoha.jpg) no-repeat center center; background-size:auto 320px;} .fulllayer_hcoha .hmate{width:50%; height:320px; float:left;} .fulllayer_hcoha .cohabit{width:50%; height:320px; float:right; position:relative;} .fulllayer_hcoha .cohabit a.close_fulllayer{display:block; width:35px; height:35px; background:url(/assets/img/www/event/theme_hcoha/close_fulllayer.png); position:absolute; top:15px; left:560px;} .fulllayer_hcoha a.hmate_link, .fulllayer_hcoha a.cohabit_link{display:block; height:320px;} /*기다리면무료 팝업 안내*/ .pop_waitfree_info{width:400px !important; margin:auto; background:transparent;} .pop_waitfree_info .free_thumbbox{width:260px; margin:0 auto 20px; background:#fff;} .pop_waitfree_info .free_thumbbox .mobile_free{width:72px; height:85px; background:url(/assets/img/common/icon_mobile_free.png) no-repeat center; background-size:72px; float:left;} .pop_waitfree_info .free_thumbbox .free_thumb{width:85px; height:85px; border-radius:50%; background-size:cover; background-position:center; float:left; margin:0 10px; border:1px solid #ddd;} .pop_waitfree_info .free_thumbbox .pc_free{width:72px; height:85px; background:url(/assets/img/common/icon_pc_free.png) no-repeat center; background-size:72px; float:left;} .pop_waitfree_info p.s_dics{font-size:12px; color:#333; line-height:16px; margin-bottom:8px;} .pop_waitfree_info p.m_tit{font-size:17px; font-weight:bold; color:#fa2828; margin-bottom:12px;} .pop_waitfree_info p.wait_date{color:#fff; background:#fa2828; border-radius:30px; display:inline-block; text-align:center; padding:0 15px; height:24px; line-height:24px; margin-bottom:25px;} .pop_waitfree_info .info_box{width:340px; padding:15px; background:#f0f0f0; background-size:30px; text-align:left; font-size:11px; line-height:16px; margin-bottom:20px;} .pop_waitfree_info .info_box span.icon_tip{width:23px; height:12px; background:url(/assets/img/common/ico_tip.png) no-repeat center; background-size:23px; margin-right:5px;} .pop_waitfree_info .info_box p.tip{color:#ff7b7b;} .pop_waitfree_info .info_box p.tip span{display:inline-block; vertical-align:middle; font-size:11px;} .pop_waitfree_info .btn_area2nd{width:100; margin:auto;} .pop_waitfree_info .btn_area2nd a{display:inline-block; width:48%; color:#fff; border-radius:3px; height:45px; line-height:45px; text-align:center; cursor:pointer;} .pop_waitfree_info .btn_area2nd a.btn_viewapp{float:left; background:#444;} .pop_waitfree_info .btn_area2nd a.btn_adult_cer{float:right; background:#fa2828;} .pop_waitfree_info a.btn_full_close{background:#000; color:#fff; height:45px; line-height:45px; text-align:center; display:block; border:1px solid #000; font-size:15px; font-weight:bold; cursor:pointer;} /*선물함 팝업 안내*/ .pop_gift_info{width:380px !important; margin:auto; background:transparent;} .pop_gift_info .free_thumbbox{width:260px; margin:0 auto 20px; background:#fff;} .pop_gift_info .free_thumbbox .mobile_free{width:72px; height:85px; background:url(/assets/img/common/icon_mobile_free2.png) no-repeat center; background-size:72px; float:left;} .pop_gift_info .free_thumbbox .free_thumb{width:85px; height:85px; border-radius:50%; background-size:cover; background-position:center; float:left; margin:0 10px; border:1px solid #ddd; position:relative;} .pop_gift_info .free_thumbbox .free_thumb .gift_badge{position:absolute; width:27px; height:27px; right:0; top:-2px; background:url(/assets/img/common/icon_gift_badge.png) no-repeat center; background-size:25px;} .pop_gift_info .free_thumbbox .pc_free{width:72px; height:85px; background:url(/assets/img/common/icon_pc_free2.png) no-repeat center; background-size:72px; float:left;} .pop_gift_info p.s_dics{font-size:16px; color:#333; line-height:16px; margin-bottom:12px; font-weight:bold;} .pop_gift_info p.s_dics .txtpoint{color:#fa2828;} .pop_gift_info p.m_date{font-size:15px; font-weight:bold; color:#8b8d8d; margin-bottom:12px; letter-spacing:-0.5px;} .pop_gift_info p.m_date2{font-size:15px; font-weight:bold; color:#fa2828; margin-bottom:22px; letter-spacing:-0.5px;} .pop_gift_info p.gift_btn{font-size:15px; letter-spacing:-0.5px; color:#fff; background:#fa2828; border-radius:30px; display:inline-block; text-align:center; padding:0 15px; height:34px; line-height:34px; margin-bottom:25px;} .pop_gift_info p.gift_btn2{font-size:15px; letter-spacing:-0.5px; color:#fff; background:#bbb; border-radius:30px; display:inline-block; text-align:center; padding:0 15px; height:34px; line-height:34px; margin-bottom:25px;} .pop_gift_info p.wait_date{color: #fff; background: #fa2828; border-radius: 30px; display: inline-block; text-align: center; padding: 0 15px; height: 34px; line-height: 34px; margin-bottom: 25px; font-size: 14px;} .pop_gift_info .info_box{width:320px; padding:15px 15px 10px 15px; background:#f0f0f0; display:inline-block; letter-spacing:-0.5px; border-radius:3px;} .pop_gift_info .info_box .gift_go{width:110px; height:35px; line-height:35px; border-radius:5px; border:1px solid #fa2828; background:#fff; font-size:12px; font-weight:500; margin:10px auto;} .pop_gift_info .info_box .gift_go a{display:block; color:#fa2828;} .pop_gift_info .info_box .info_txt{text-align:left; line-height:18px;} .pop_gift_info .info_box .info_txt2{width:100%; text-align:left; line-height:18px; float:left;} .pop_gift_info .info_box .info_txt span.icon_tip,.info_txt2 span.icon_tip{width: 25px; height: 15px; background: url(/assets/img/common/ico_tip.png) no-repeat center; background-size: 25px; margin-right: 5px;} .pop_gift_info .info_box .info_txt p.tip,.info_txt2 p.tip{color:#ff7b7b;} .pop_gift_info .info_box .info_txt p.tip span,.info_txt2 p.tip span{display:inline-block; vertical-align:middle; font-size:11px;} .pop_gift_info .btn_area2nd{width:100; margin:5px auto 0;} .pop_gift_info .btn_area2nd a{display:inline-block; width:48%; color:#fff; border-radius:3px; height:45px; line-height:45px; text-align:center; cursor:pointer;} .pop_gift_info .btn_area2nd a.btn_viewapp{float:left; background:#444;} .pop_gift_info .btn_area2nd a.btn_adult_cer{float:right; background:#fa2828;} .pop_gift_info a.btn_full_close{background:#000; color:#fff; height:45px; line-height:45px; text-align:center; display:block; border:1px solid #000; font-size:15px; font-weight:bold; cursor:pointer;} /* ============================= INDEX RENEWAL 2017.05 *Color Sample ★★★point color red:#e63740; -background color:#e8ecf0; -gray bg color:#f6f6f6; -line color:#ddd; -basic font :#666; -strong font:#000; -gray font :#999; ============================= */ /*공통아이콘*/ span.iconew{display:inline-block;} span.iconew.ico_mobile{width:11px; height:14px; background:url(/assets/img/www/common/ico_plusapp.png) no-repeat; vertical-align:middle; padding-top:3px; margin-right:5px;} span.iconew.ico_new{width:16px; height:16px; background:url(/assets/img/www/common/renewal17_ico_new.png) no-repeat; vertical-align:middle; padding-top:2px; margin-left:2px;} span.iconew.ico_gift{width:17px; height:16px; background:url(/assets/img/www/common/renewal17_ico_gift.png) no-repeat; vertical-align:middle; padding-top:5px;} span.iconew.ico_fullmoreview_arrow{width:10px; height:6px; background:url(/assets/img/www/common/ico_fullmoreview_arrowdown.png) no-repeat; vertical-align:middle; padding-top:3px; margin-left:5px;} span.iconew.ico_fullmoreview_arrowclose{width:10px; height:6px; background:url(/assets/img/www/common/ico_fullmoreview_arrowup.png) no-repeat; vertical-align:middle; padding-top:3px; margin-left:5px;} /*아이디앞 아이콘*/ span.idicon{display:inline-block; vertical-align:middle;} span.idicon.member_welcome{width:26px; height:26px; background:url(/assets/img/www/common/idicon_welcome.png) no-repeat; margin-right:3px;} span.idicon.member_silver{width:26px; height:26px; background:url(/assets/img/www/common/idicon_silver.png) no-repeat; margin-right:3px;} span.idicon.member_gold{width:26px; height:26px; background:url(/assets/img/www/common/idicon_gold.png) no-repeat; margin-right:3px;} span.idicon.member_vip{width:26px; height:26px; background:url(/assets/img/www/common/idicon_vip.png) no-repeat; margin-right:3px;} span.idicon.sns_naver{width:26px; height:26px; background:url(/assets/img/www/login/joinIcon_n.png) no-repeat center; background-size:19px; padding-top:5px; margin-right:2px;} span.idicon.sns_facebook{width:26px; height:26px; background:url(/assets/img/www/login/joinIcon_f.png) no-repeat center; background-size:19px; padding-top:5px; margin-right:2px;} span.idicon.sns_google{width:26px; height:26px; background:url(/assets/img/www/login/joinIcon_g.png) no-repeat center; background-size:19px; padding-top:5px; margin-right:2px;} span.idicon.sns_kakao{width:26px; height:26px; background:url(/assets/img/www/login/joinIcon_k.png) no-repeat center; background-size:19px; padding-top:5px; margin-right:2px;} span.idicon.sns_nv{width:26px; height:26px; background:url(/assets/img/www/login/joinIcon_n.png) no-repeat center; background-size:19px; padding-top:5px; margin-right:2px;} span.idicon.sns_fb{width:26px; height:26px; background:url(/assets/img/www/login/joinIcon_f.png) no-repeat center; background-size:19px; padding-top:5px; margin-right:2px;} span.idicon.sns_gg{width:26px; height:26px; background:url(/assets/img/www/login/joinIcon_g.png) no-repeat center; background-size:19px; padding-top:5px; margin-right:2px;} span.idicon.sns_kk{width:26px; height:26px; background:url(/assets/img/www/login/joinIcon_k.png) no-repeat center; background-size:19px; padding-top:5px; margin-right:2px;} /*리뉴얼INDEX*/ /*HEADER*/ .renewal17_header{width:100%; height:60px;} .renewal17_header ul{margin:0; padding:0;} .renewal17_header .gnb_top_wp{width:100%; height:30px; background:#000;} .renewal17_header .gnb_top_wp .gnb_top{width:1200px; height:30px; margin:auto;} .renewal17_header .gnb_top_wp .gnb_top li.bar{width:1px; height:8px; background:#444; margin:0 3px;} .renewal17_header .gnb_top_wp .gnb_top li{display:inline-block; line-height:30px;} .renewal17_header .gnb_top_wp .left_menu{float:left;} .renewal17_header .gnb_top_wp .right_menu{float:right;} .renewal17_header .gnb_top_wp .gnb_top a{color:#bbb; font-size:11px; display:block;} .renewal17_header .gnb_top_wp .gnb_top a:hover{text-decoration:underline;} .renewal17_header .main_menu_wp{width:100%; height:60px; background:#fff; border-bottom:1px solid #ddd;} .renewal17_header .main_menu{width:1200px; margin:auto; line-height:60px;} .renewal17_header .main_menu a.renewal17_logo{float:left; width:106px; height:60px; background:url(/assets/img/www/common/renewal17_logo.png) no-repeat center; margin-right:15px;} .renewal17_header .main_menu .select_mode{float:left; margin-right:40px; width:110px; height:19px; position:relative; margin-top:20px;} .renewal17_header .main_menu .select_mode a{display:block;} .renewal17_header .main_menu .select_mode a.mode_all{width:36px; height:19px; position:absolute; top:0; left:0; z-index:1; background:url(/assets/img/www/common/new_mode_all.png) no-repeat center;} .renewal17_header .main_menu .select_mode a.mode_complete{width:40px; height:19px; position:absolute; top:0; left:35px; z-index:1; background:url(/assets/img/www/common/new_mode_complete.png) no-repeat center;} .renewal17_header .main_menu .select_mode a.mode_adult{width:36px; height:19px; position:absolute; top:0; left:74px; z-index:1; background:url(/assets/img/www/common/new_mode_adult.png) no-repeat center;} .renewal17_header .main_menu .select_mode a.mode_all.active{width:36px; height:19px; position:absolute; top:0; left:0; z-index:2; background:url(/assets/img/www/common/new_mode_all_on.png) no-repeat center;} .renewal17_header .main_menu .select_mode a.mode_complete.active{width:40px; height:19px; position:absolute; top:0; left:35px; z-index:2; background:url(/assets/img/www/common/new_mode_complete_on.png) no-repeat center;} .renewal17_header .main_menu .select_mode a.mode_adult.active{width:36px; height:19px; position:absolute; top:0; left:74px; z-index:2; background:url(/assets/img/www/common/new_mode_adult_on.png) no-repeat center;} /*.renewal17_header .main_menu .menu_list{width:485px; float:left;}*/ .renewal17_header .main_menu li{display:inline-block;} /*.renewal17_header .main_menu .menu_list li a{display:block; color:#000; font-size:16px; letter-spacing:0; padding:0 10px;}*/ .renewal17_header .main_menu .menu_list li.active a{color:#e63740;} .renewal17_header .main_menu .menu_right_menu{float:right; width:400px; position:relative;} .renewal17_header .main_menu .menu_right_menu .search_layer{width:300px; height:61px; line-height:60px; position:absolute; top:0; right:60px; z-index:2; background:url(/assets/img/www/common/renewal17_ico_search_b.png) no-repeat 255px center #f6f6f6; display:none;} .renewal17_header .main_menu .menu_right_menu .search_layer input{width:100%; background:transparent; height:58px; line-height:58px; text-indent:20px; border:none; outline:none; font-size:16px; color:#000; display:block;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer{width:300px; position:absolute; top:61px; right:0; background:#fff; z-index:15; letter-spacing:0;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer .my_assets{background:#363c42; color:#fff;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer .my_assets p.my_id{border-bottom:1px solid #4d5155; height:45px; line-height:45px; padding:0 10px;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer .my_assets p.my_id a.btn_logout{display:block; float:right; border-radius:30px; border:2px solid #4d5155; color:#fff; font-size:11px; text-align:center; background:#222427; width:60px; height:20px; line-height:20px; margin-top:12px;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer .my_assets ul.assets_menu li{height:45px; line-height:45px; padding:0 10px;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer .my_assets ul.assets_menu li a{display:block; color:#fff;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer .my_assets ul.assets_menu li span{float:right; text-align:right; color:#ff6068;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer .my_assets ul.assets_menu li.coin{float:left; width:129px; border-right:1px solid #4d5155; border-bottom:1px solid #4d5155;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer .my_assets ul.assets_menu li.bcoin{float:right; width:130px; border-bottom:1px solid #4d5155;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer .my_assets ul.assets_menu li.fixcharge{float:left; width:129px; border-right:1px solid #4d5155;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer .my_assets ul.assets_menu li.gift{float:right; width:130px;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer ul.service_menu{border:1px solid #ddd;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer ul.service_menu li{display:block; height:46px; line-height:46px; padding:0 10px; border-bottom:1px solid #ddd;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer ul.service_menu li:last-child{border-bottom:0;} .renewal17_header .main_menu .menu_right_menu .mymenu_layer ul.service_menu li a{display:block; font-size:14px; color:#000;} .renewal17_header .main_menu .menu_right_menu .icon_menu li{float:right;} .renewal17_header .main_menu .menu_right_menu .icon_menu .icon_menu_search{width:60px; height:61px; background:url(/assets/img/www/common/renewal17_ico_search_w.png) no-repeat center #e63740;} .renewal17_header .main_menu .menu_right_menu .icon_menu .icon_menu_mymenu{width:60px; height:61px; background:url(/assets/img/www/common/renewal17_ico_mymenu_w.png) no-repeat center #363c42;} .renewal17_header .main_menu .menu_right_menu .icon_menu a{display:block;} .renewal17_header .main_menu .menu_right_menu .txt_menu{float:right; margin-right:20px;} .renewal17_header .main_menu .menu_right_menu .txt_menu a{color:#000; display:block; margin-left:10px;} .renewal17_header .main_menu .menu_right_menu .txt_menu a.txtm_charge{color:#e63740;} .renewal17_header .main_menu .menu_right_menu .txt_menu .gift_cnt_span {background:#ff3838; text-align: center; border-radius: 10px; margin-left: 3px; color: #fff; font-weight: bold; width: 18px; height: 18px; display: inline-block; vertical-align: middle; margin-top: -3px; line-height: 18px;} #fix_header {width:100%;margin:0;padding:0;} #fix_header.fixed {position:fixed;top:0px;left:0;z-index:999;} /*메인배너 이미지등록 1920x420*/ .renewal17_main_bnr{width:100%; height:380px; position:relative;} .renewal17_main_bnr ul{margin:0; padding:0;} .renewal17_main_bnr li{float:left; width:100%; height:380px;} .renewal17_main_bnr li a{display:block; height:380px; background-position:center; background-repeat:no-repeat;} .renewal17_main_bnr a.main_bnr_arrow_left{width:70px; height:70px; position:absolute; top:153px; left:16%; display:block; background:url(/assets/img/www/common/bnr_arrow_left.png) no-repeat 20px center #fff; opacity:0.4; border-radius:50%;} .renewal17_main_bnr a.main_bnr_arrow_right{width:70px; height:70px; position:absolute; top:153px; right:16%; display:block; background:url(/assets/img/www/common/bnr_arrow_right.png) no-repeat 27px center #fff; opacity:0.4; border-radius:50%;} .renewal17_main_bnr a.main_bnr_arrow_left:hover, .renewal17_main_bnr a.main_bnr_arrow_right:hover{opacity:0.7;} .renewal17_main_bnr .h_page {display: block; width:50px; height:30px; line-height:30px; background: rgba(0,0,0,0.8); position: absolute; bottom:0; left:50%; margin-left:434px; color:#666; font-size:12px; text-align: center; bottom: -1px;} .renewal17_main_bnr .h_page .page {display:inline-block; letter-spacing:1.5px;} .renewal17_main_bnr .h_page .page .pag{font-weight:600; color:#fff;} .renewal17_main_bnr .h_allview {display: block; width:95px; height:30px; line-height:30px; background: rgba(0,0,0,0.8); position: absolute; bottom:0; left:50%; margin-left:485px;color:#666; font-size:12px; text-align: center; bottom: -1px;} .renewal17_main_bnr .h_allview a.btn_allview {display:inline-block; color:#fff; letter-spacing:-0.3px; padding-bottom: 0; margin-left:2px; vertical-align: top;} .renewal17_main_bnr .h_allview a.btn_allview span{vertical-align:top;} .renewal17_main_bnr .h_allview a.btn_allview span.btn_allview_plus{display:inline-block; z-index: 100; width: 27px; height: 29px; background: url(/assets/img/www/free/btn_allview_plus.png) no-repeat center center; background-size: 75%;} .renewal17_main_bnr .dot_area{width:300px; height:15px; position:absolute; bottom:20px; left:50%; margin-left:-150px; text-align:center;} .renewal17_main_bnr .dot_area span{display:inline-block; width:10px; height:10px; background:rgba(255,255,255,0.5); border-radius:50%; margin:0 3px;} .renewal17_main_bnr .dot_area span.active{background:#e63740;} p.renewal17_indextit{width:100%; text-align:center; margin:auto; padding:45px 0 35px; font-size:25px; color:#000; letter-spacing:-2px;} p.renewal17_indextit span.stxt{font-size:13px; color:#666; display:block; margin-bottom:12px; letter-spacing:-1px;} .renewal17_ranking{width:1200px; margin:auto; padding:0 0 30px;} .renewal17_ranking ul{width:318px; height:518px; border:1px solid #ddd; float:left; margin:0; padding:30px 30px 0; margin-left:30px;} .renewal17_ranking ul .box_tit{font-size:18px; color:#000; margin-bottom:20px;} .renewal17_ranking ul .box_tit span{color:#e63740;} .renewal17_ranking ul .box_tit a.rank_moreview{display:block; width:48px; height:14px; line-height:14px; color:#999; font-size:12px; float:right; background:url(/assets/img/www/common/moreview_bg_plus.png) no-repeat right center;} .renewal17_ranking ul li{height:80px; margin-bottom:10px;} .renewal17_ranking ul li:before{content:''; visibility:hidden; display:block; height:0; clear:both;} .renewal17_ranking ul .rank_new_thumb{position:relative; width:80px; height:80px; background-position:center; background-size:cover; float:left; margin-right:18px;} .renewal17_ranking ul .rank_new_thumb .rank_numbox{width:20px; height:20px; position:absolute; top:0; left:0; text-align:center; font-size:10px; line-height:20px; color:#e63740; background:#000;} .renewal17_ranking ul .rank_new_thumb_info{padding:10px 0 0 0; float:left;} .renewal17_ranking ul .rank_new_thumb_info p.c_genre{color:#5b96cf; font-size:11px; margin-bottom:5px;} .renewal17_ranking ul .rank_new_thumb_info p.c_tit{color:#000; font-size:15px; font-weight:600; margin-bottom:5px; white-space:nowrap; text-overflow:ellipsis; overflow:hidden; width:220px;} .renewal17_ranking ul .rank_new_thumb_info p.c_wrt{color:#666; font-size:11px;} .renewal17_full_indexbnr{width:100%; height:210px; position:relative; margin-bottom:-20px;} .renewal17_full_indexbnr .bgline{width:100%; height:150px; position:absolute; top:23px; left:0; z-index:1;} .renewal17_full_indexbnr .bnr_img{width:1200px; height:210px; position:absolute; top:0; left:50%; margin-left:-600px; z-index:2;} .renewal17_indextab{width:1198px; height:48px; line-height:48px; margin:auto; border:1px solid #ddd; text-align:center; margin-bottom:25px; background:#fff;} .renewal17_indextab ul{margin:0; padding:0;} .renewal17_indextab li{display:inline-block; padding:0 25px;} .renewal17_indextab li a{display:block; width:30px; font-size:16px; color:#333; position:relative;} .renewal17_indextab li a span.today{display:block; width:5px; height:5px; background:#e63740; border-radius:50%; position:absolute; top:8px; right:0;} .renewal17_indextab li.active a{border-bottom:1px solid #e63740; color:#e63740;} .renewal17_theme{width:100%; background:#e8ecf0; padding-bottom:20px;} a.renewal17_list_moreview{display:block; width:1200px; height:60px; line-height:60px; margin:auto; border-top:1px solid #ddd; text-align:center; color:#999; font-size:14px;} a.renewal17_list_moreview2{display:block; width:1200px; height:60px; line-height:60px; margin:auto; border-top:1px solid #4e5563; text-align:center; color:#999; font-size:14px;} .renewal17_bltl_basiclist{padding-top:0px;} /*INDEX 리스트타입 공용*/ .renewal17_idxlist{width:1200px; margin:auto;} .renewal17_idxlist ul{margin:0; padding:0;} .renewal17_idxlist li{width:218px; height:305px; border-radius:10px; border:1px solid #ddd; float:left; margin-left:25px; background:#fff; margin-bottom:25px;} .renewal17_idxlist li:first-child{margin-left:0;} .renewal17_idxlist li .list_thumb{width:218px; height:212px; background-size:cover; background-position:center; position:relative; overflow:hidden; border-radius:5px 5px 0 0;} .renewal17_idxlist li .list_thumb .thumb_gra{width: 100%; height: 137px; background: url(/assets/img/www/common/gra_bg.png) center center no-repeat; position: absolute; bottom: 0; opacity: 0.9;} .renewal17_idxlist li .list_thumb .hashtag{position: absolute; bottom: 5px; left: 8px; font-size: 11px; font-weight: 600; letter-spacing: -0.8px;} .renewal17_idxlist li .list_thumb .hashtag span.tag01{color:#5facff;} .renewal17_idxlist li .list_thumb .hashtag span.tag02{color:#ff5f6a;} .renewal17_idxlist li .list_thumb .wait_free{width:36px; height:36px; left:0; background:rgba(0, 0, 0, 0.6) url(/assets/img/event/free_renewal/icon_wait_free.png) no-repeat center center;border-top-left-radius:6px;} .renewal17_idxlist li .list_thumb .new_rank_num{width:40px; height:40px; left:0; background:#748393; color:#fff; border:1px solid #526375; text-align:center; letter-spacing:0;} .renewal17_idxlist li .list_thumb .new_rank_num.rank123{background:#e63740; border-color:#d62932;} .renewal17_idxlist li .list_thumb .new_rank_num span{display:block;} .renewal17_idxlist li .list_thumb .new_rank_num span.best_txt{font-size:10px; opacity:0.8; margin-top:3px;} .renewal17_idxlist li .list_thumb .new_rank_num span.ranking_number{font-family:roboto, sans-serif; font-weight:600; font-size:16px;} .renewal17_idxlist li .list_info{padding:10px 10px 0; position:relative;} .renewal17_idxlist li .list_info p.comic_tit{font-size:15px; font-weight:600; color:#000; margin-bottom:5px; width:170px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; position:relative;} .renewal17_idxlist li .list_info p.comic_wrt{font-size:11px; color:#666; width:198px; overflow:hidden; white-space:nowrap; text-overflow:ellipsis;} .renewal17_plusapp_footerbnr{width:100%; background:#fff;} .renewal17_plusapp_footerbnr img{display:block; margin:auto;} /*무료리뉴얼 170717*/ .renewal17_idxlist .todays_free_half {display:inline-block; zoom:1;} .renewal17_idxlist .todays_free_half li .renewal17_indextit .point{color:#e63740;} .renewal17_idxlist .todays_free_half li{width:578px; height:inherit; border-radius:0; border:0; position: relative;} .renewal17_idxlist .todays_free_half li .gradation {background: url(/assets/img/www/free/gradation_bg.png) no-repeat center; width:100%; height:300px; position:absolute;} .renewal17_idxlist .todays_free_half li .list_thumb2 {width:578px; height: 300px; background-size: cover; background-position: center; overflow: hidden;} .renewal17_idxlist .todays_free_half li .todays_badge {position: absolute; left:0; z-index:5; width:50px; height:41px; padding-top: 9px; background:#e63740; color:#fff; text-align:center;} .renewal17_idxlist .todays_free_half li .list_info2 {position: absolute; left:30px; bottom:30px; z-index:5; width:512px;} .renewal17_idxlist .todays_free_half li .list_info2 .todays_main_tit {font-size: 25px; color: #fff; letter-spacing: -2px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding: 10px 0; text-shadow: 1px 1px 1px #000;} .renewal17_idxlist .todays_free_half li .list_info2 .todays_sub_tit {font-size: 15px; color: #fff; letter-spacing: -1.5px; text-shadow: 1px 1px 1px #000;} .renewal17_idxlist .todays_free_half li .list_info2 .todays_sub_tit .point{color: #fff000;} p.renewal17_indextit .bg_plus {background: url(/assets/img/www/free/icon_honor.png) no-repeat center; background-size:100%; display: inline-block; width: 27px; height: 29px; margin-bottom: -5px; margin-right: 4px;} .renewal17_idxlist li .list_info .comic_tit.free_sale_tit{width:160px;} .renewal17_idxlist li .list_info .free_badge {position: absolute; width: 45px; height: 45px; top: -24px; right:5px; border-radius: 50%; background-color: #ec460a; color: #fff; font-family: tahoma; font-size: 13px; font-weight: bold; text-align: center; line-height: 45px; border: 2px solid #fff; letter-spacing: 0;} .renewal17_idxlist li .list_info .sale_badge {position: absolute; width: 45px; height: 45px; top: -24px; right:5px; border-radius: 50%; background-color: #4d8dcc; color: #fff; font-family: tahoma; font-size: 13px; font-weight: bold; text-align: center; line-height: 45px; border: 2px solid #fff; letter-spacing: 0;} .renewal17_idxlist li .list_info .epi_info{margin:7px 0; height: 17px;} .renewal17_idxlist li .list_info .epi_info .epi_through {color:#999; text-decoration:line-through; font-size:11px; font-weight:500; margin-right:2px;} .renewal17_idxlist li .list_info .epi_info .epi_free {color:#ec460a; font-size:13px; font-weight:600;} .renewal17_idxlist li .list_info .epi_info .epi_sale {color:#4d8dcc; font-size:13px; font-weight:600;} .renewal17_idxlist li .list_info .webtoon_synopsis {font-size: 11px; color: #999999; position: relative; margin-bottom: 10px; border-top: 1px solid #cecdd1; padding:8px 0 0; font-weight:500; letter-spacing: -1px;} .renewal17_idxlist li .list_info .webtoon_synopsis .author{overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width:90%; display: block;} .renewal17_idxlist li .list_info p.comic_txt2 {font-size: 11px; color: #666; width: 198px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; height:17px; margin:7px 0;} .renewal17_idxlist li .list_thumb .wait_free {width: 36px; height: 36px; position: absolute; left: 0; background: rgba(0, 0, 0, 0.6) url(/assets/img/event/free_renewal/icon_wait_free.png) no-repeat center center; border-top-left-radius: 6px;} /* 명예의 전당 new */ .honor_indextit{width:1200px; height:132px; margin: auto; padding:0; background:url(/assets/img/www/free/honor_tit.jpg) 0 0 no-repeat;} .honor_idxlist{width:1200px; margin:auto;} .honor_idxlist ul{margin:0; padding:0;} .honor_idxlist li{width:275px; border-radius:0; float:left; margin-left:30px; margin-bottom:35px; position:relative; background:url(/assets/img/www/free/thumb_shadow.png) no-repeat 0 -8px;} .honor_idxlist li:first-child{margin-left:0;} .honor_idxlist li .honer_badge{position: absolute; width:51px; right:12px; bottom:0; z-index:5;} .honor_idxlist li .list_thumb{width:275px; height:275px; background-size:auto; background-position:top; overflow:hidden; border-radius:0; position:relative;} .honor_idxlist li .list_thumb:after{position:absolute; bottom:0; left:0; content:''; background:url(/assets/img/www/common/new_comic_list_gra.png) repeat-x center bottom; background-size:auto 100%; width:100%; height:65%; z-index:2;} .honor_idxlist li .list_thumb .tag{position:absolute; width:100%; bottom:0; left:0; padding:10px; font-size:11px; z-index:3;} .honor_idxlist li .list_thumb .tag span{display:inline-block; margin-right:8px;} .honor_idxlist li .list_thumb .tag span.blue{color:#5b96cf;} .honor_idxlist li .list_thumb .tag span.red{color:#e63740;} .honor_idxlist li .comic_info{padding:4px 0; margin-top:22px;} .honor_idxlist li .comic_info span{display:inline-block;} .honor_idxlist li .comic_info span.tit_comic{font-size:16px; font-weight:600; color: #fff; max-width:70%; height:17px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: -1px;} .honor_idxlist li .comic_info span.write_comic{font-size: 11px; color: #999; max-width:30%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;} .honor_idxlist li .sale_free_info{padding:4px 0;} .honor_idxlist li .sale_free_info span{vertical-align:middle;} .honor_idxlist li .sale_free_info .free_list_badge2 {display: inline-block; width:31px; height:19px; float: left; margin-top:-1px; margin-right: 5px; background:url(/assets/img/www/free/free_list_badge.png) no-repeat center center; background-size:100%;} .honor_idxlist li .sale_free_info .sale_list_badge2 {display: inline-block; width:31px; height:19px; float: left; margin-top:-1px; margin-right: 5px; background:url(/assets/img/www/free/sale_list_badge.png) no-repeat center center; background-size:100%;} .honor_idxlist li .sale_free_info .thumb_info_s {font-size: 11px;} .honor_idxlist li .sale_free_info span.free_info_coin_org {color: #999; text-decoration: line-through; margin-right: 5px;} .honor_idxlist li .sale_free_info span.free_info_coin {color: #e63740;} .honor_idxlist li .sale_free_info span.sale_info_coin {color: #4d8dcc;} /*무료관 전체보기 클릭시 나오는 기획전 팝업*/ .rank_free_btn{display: block;z-index: 100; width:29px; height:29px; background: url(/assets/img/www/close_btn.png) no-repeat center center;position: absolute; top:9px; right: 8px; background-size: 100%;} .newlayer_wp .exhib_list{width:520px; max-height:665px; margin:25px 30px; position: relative; white-space:nowrap; overflow-x: hidden; -webkit-overflow-scrolling: touch;} .newlayer_wp .exhib_list ul{width:100%; padding:0; margin:0;} .newlayer_wp .exhib_list ul li{margin:5px auto;} /*bltl top50탭*/ .top50_tap_wrap{width:1200px; margin:0 auto; position:relative;} .top50_tap_wrap .top50_tap{position:absolute; right:0; top:-40px;} .top50_tap_wrap .top50_tap > span a{display: inline-block; width:55px; height: 22px; line-height: 22px; text-align: center; margin-left: 3px; color: #000; font-size:12px; border-radius: 20px;} .top50_tap_wrap .top50_tap > span.active a{color: #fff; background: #e63740;} /*공용 영역틀*/ .top_menu_re{width:100%; height:125px; background:#f4f5f6;} .top_menu_re, .sub_body_re, .sub_footer19 ul{padding:0; margin:0; list-style: none;} .sub_body_re{width:100%; background:#eff1f6;} /*보관함 타이틀 및 메뉴 공용*/ .sub_body_re .sub_header{ width:1200px; margin:0 auto; overflow:hidden;} .sub_body_re .sub_header .tit_topsub{font-size:27px; font-weight:600; display:inline-block; zoom:1; line-height:24px; margin-top:32px;} .sub_body_re .sub_header .menu_n{float:right; padding:0; margin-bottom:0;} .sub_body_re .sub_header .menu_n li{float:left; overflow:hidden;} .sub_body_re .sub_header .menu_n li a{padding:20px; font-size:16px; font-weight:500; display:block;} .sub_body_re .sub_header .menu_n li.active a{border-bottom:3px solid #e63640; color: #e63640;} /*서브 컨텐츠 제목 및 탭 공용*/ .sub_body_re .sub_contents2{width:1200px; border:1px solid #e5e5e5; background:#fff; margin:0 auto 40px; padding-bottom:50px;} .sub_body_re .sub_contents2 .sub_title2{border-bottom:1px solid #1a1717; width: 1060px; margin:30px auto 0; position:relative;} .sub_body_re .sub_contents2 .sub_title2 .point{color: #e63640;} .sub_body_re .sub_contents2 .sub_title2 > p{font-size:19px; display:inline-block; zoom:1; font-weight:600; margin-top:30px; padding-bottom:15px;float:left;} .sub_body_re .sub_contents2 .sub_title2 .tap_menu{position:absolute; right:0; top:8px;} .sub_body_re .sub_contents2 .sub_title2 .tap_menu li{float:left; border-top:1px solid #cbccce; border-left:1px solid #cbccce; border-right:1px solid #cbccce; border-bottom:1px solid #1a1717; background:#f4f5f6;} .sub_body_re .sub_contents2 .sub_title2 .tap_menu li + li{border-left:none;} .sub_body_re .sub_contents2 .sub_title2 .tap_menu li.active{border-bottom:1px solid #fff; border-top:1px solid #1a1717; border-right:1px solid #1a1717; border-left:1px solid #1a1717; background:#fff;} .sub_body_re .sub_contents2 .sub_title2 .tap_menu li.active a{color:#1a1717; font-weight:600;} .sub_body_re .sub_contents2 .sub_title2 .tap_menu li > a{width:150px; height:40px; line-height:40px; display:block; text-align:center; font-size:15px; font-weight:500;} .sub_body_re .sub_contents2 .sub_title2 .view_btn{background: #79a7d7; color: #fff; width:100px; height:25px; line-height: 25px; float:left; text-align:center; border-radius: 2px; margin-top: 25px; margin-left: 12px;} .sub_body_re .sub_contents2 .sub_title2 > a{display:inline-block; height: 100%;} /*서브 컨텐츠 드롭메뉴 및 편집버튼*/ .sub_body_re .sub_contents2 .sub_drop_edit{overflow:hidden; width:940px; margin:25px auto 10px;} .sub_body_re .sub_contents2 .sub_drop_edit .sub_dropmenu2{float:left;} .sub_body_re .sub_contents2 .sub_drop_edit .sub_dropmenu2 select{width:124px; height:36px; float:left; font-size: 12px; padding-left: 5px;} .sub_body_re .sub_contents2 .sub_drop_edit .sub_dropmenu2 select + select{border-left:none;} .sub_body_re .sub_contents2 .sub_drop_edit .sub_look_edit{float:right; vertical-align:middle;} .sub_body_re .sub_contents2 .sub_drop_edit .sub_look_edit .look{border-top:1px solid #cbccce; border-right:1px solid #cbccce; border-bottom:1px solid #cbccce; display:inline-block; zoom:1; width:36px; height:27px; padding-top:7px; text-align:center;} .sub_body_re .sub_contents2 .sub_drop_edit .sub_look_edit .search_bar{display:inline-block; zoom:1; float:left;} .sub_body_re .sub_contents2 .sub_drop_edit .sub_look_edit .search_bar_area{border:1px solid #cbccce; width:142px; height:32px;} .sub_body_re .sub_contents2 .sub_drop_edit .sub_look_edit .edit{background:#6c94c2; display:inline-block; zoom:1; width:60px; height:36px; line-height:36px; color:#fff; vertical-align:top; text-align:center; font-size:14px;} /*다음페이지 이동 넘버 리스트 공용*/ .page_number2{display:inline-block; text-align: center; position: relative; overflow: hidden; background: #fff; min-width:330px; max-width:575px; margin:0 auto;} .page_number2 .arrow_prev {background: url(/assets/img/www/library/icon_arrow_prev.png) no-repeat 10px 9px; background-size:5px; display: inline-block; width:30px; height:30px; overflow: hidden; vertical-align: middle; border: 1px solid #e5e5e5; font-size: 0; -webkit-appearance: none; background-color: #fff; cursor: pointer; float: left;} .page_number2 .arrow_next {background: url(/assets/img/www/library/icon_arrow_next.png) no-repeat 13px 9px; background-size:5px; display: inline-block; width:30px; height:30px; overflow: hidden; vertical-align: middle; border: 1px solid #e5e5e5; font-size: 0; -webkit-appearance: none; background-color: #fff; cursor: pointer; float: right;} .page_number2 .list_page {text-align: center; margin: 0 auto; display: inline-block; zoom: 1;} .page_number2 .list_page a {width:30px; height:30px; line-height:30px; display: inline-block; font-size: 15px; margin:0 10px;} .page_number2 .list_page a.active {display: inline-block; font-size: 15px; background:#a6adbd; color:#fff;} /*서브in 리스트타입 공용*/ .sub_body_re .sub_contents2 .sub_list2{width:940px; margin:13px auto 15px;} .sub_body_re .sub_contents2 .sub_list2 a {display:block;} .sub_body_re .sub_contents2 .sub_list2 a.qna_del, .sub_body_re .sub_contents2 .sub_list2 a.idea_del {margin:0 auto;width:13px;height:13px;background:url(/assets/img/www/qna_delete.jpg) center no-repeat;} .sub_body_re .sub_contents2 .sub_list2 a.page_num {display:inline-block;} .sub_body_re .sub_contents2 .sub_list2 ul{margin:0; padding:0;} .sub_body_re .sub_contents2 .sub_list2 li {width:120px; text-align:center; position:relative; display:inline-block; zoom:1; float:left; margin-left:44px; margin-bottom:25px;} .sub_body_re .sub_contents2 .sub_list2 li .thumbbox {width:120px; height:145px; background-repeat: no-repeat; background-position: center center; background-size:cover; cursor: pointer; position: relative;} .sub_body_re .sub_contents2 .sub_list2 li p {height: 24px; line-height: 24px; } .sub_body_re .sub_contents2 .sub_list2 li p.tit_thumb_c {font-size:15px; font-weight: 600; color: #000; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; text-align:left; line-height:24px; height:24px; margin-top:10px; width: 85%;} .sub_body_re .sub_contents2 .sub_list2 li p.thumb_info_s {color: #5b96cf; font-size: 12px; text-align:left; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;} .sub_body_re .sub_contents2 .sub_list2 li p.tit_thumb_c span.comic_up{display: block; width:22px; height:22px; background: url(/assets/img/www/library/icon_upnew.png) no-repeat center; background-size:22px; position: absolute; top:155px; right: 0;} .ico_wait_free {width:30px; height:30px; background: url(/assets/img/www/library/icon_free_time.png) no-repeat 4px center rgba(0,0,0,0.6); background-size:21px; z-index: 2; position: absolute; top:0; left:0;} /* 보관함_내서재*/ .library_list .thumbbox .my_percent {display: block; position: absolute; bottom: 0; font-size: 12px; color: #fff; background: rgba(26,23,23,0.8); width: 100%; text-align: center; font-weight:500;} .library_list .thumbbox .check_box {position: absolute; top: 2px; right: 2px; background: url(/assets/img/www/library/check_box_off.png) no-repeat 0 center; display: inline-block; width:24px; height: 22px; background-size: 25px;} .library_list .thumbbox .check_box.active {position: absolute; top: 2px; right: 2px; background: url(/assets/img/www/library/check_box_on.png) no-repeat 0 center; display: inline-block; width:24px; height: 22px; background-size: 25px;} /* 보관함_내서재 회차리스트*/ .sub_body_re .sub_contents2 .sub_list2 .library_in{margin:50px auto 0; display:inline-block; zoom:1;} .sub_body_re .sub_contents2 .sub_list2 li.lib_none .thumbbox {width:120px; height:120px; background-repeat: no-repeat; background-position: center center; background-size:cover; cursor: pointer; position: relative;} .sub_body_re .sub_contents2 .sub_list2 li.lib_none{margin-left:41px; margin-bottom:36px;} .library_list li.lib_none {border: 1px dashed #ddd;} .library_list li.lib_none .thumbbox {position: relative; margin-bottom: 0;} .library_list li.lib_none .thumbbox .epsode_have_tt {position: absolute; text-align: center; width: 100%; top: 30%;} .library_list li.lib_none .thumbbox .epsode_have {color: #929292; font-size: 13px;} .library_list li.lib_none .thumbbox .coin_buy {color: #5b96cf; border: 1px solid #cbccce; background: #fff; font-size: 12px; font-weight: 600; line-height: 23px; width: 62px; border-radius: 50px; display: inline-block; zoom: 1; text-align: center; margin-top: 3px;} .library_list li.lib_none .thumbbox .epsode_num {display: block; position: absolute; bottom: 0; font-size: 12px; color: #fff; background: rgba(26,23,23,0.8); width: 100%; text-align: center; font-weight: 500;} /* 보관함_가로리스트타입 공용*/ .sub_list_hor {width: 940px; margin: 13px auto 15px;} .sub_list_hor .list_hor {margin: 50px auto 0; padding: 0;} .sub_list_hor a{display:inline-block; zoom:1; width: 100%;} .sub_list_hor li{width: 100%; overflow: hidden; position: relative; padding:13px 0; border-bottom: 1px solid #ddd;} .sub_list_hor li .thumbbox {width: 185px; height:110px; background-size:cover; background-repeat: no-repeat; float: left; margin-right: 29px; position: relative;} .sub_list_hor li:last-child{margin-bottom:20px;} .sub_list_hor li .tit_thumb_c {font-size: 17px; color: #000; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding: 0 0 3px 0; width: 74%; padding-top:4px;} .sub_list_hor li .tit_thumb_c span{vertical-align:middle;} .sub_list_hor li .tit_thumb_c span.comic_up {display: block; width: 22px; height: 22px; background: url(/assets/img/www/library/icon_upnew.png) no-repeat center; background-size: 22px; display: inline-block; zoom: 1; margin-left: 4px;} .sub_list_hor li .thumb_info_a {color: #929292; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 77%; line-height:24px;} .sub_list_hor li .thumb_info_p {color: #333; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 77%; line-height:24px;} .sub_list_hor li .thumb_info_r {color: #1a1717; font-size: 14px; margin-top: 15px; font-weight:600;} .sub_list_hor li .thumb_info_r .date{color: #929292; font-size: 14px; letter-spacing:-0.4px; font-weight:normal;} .sub_list_hor li .thumb_info_r .blue {color: #6c94c2;} /* 보관함_선물함*/ .sub_list_hor.present_list li{padding: 0 0 13px; overflow:inherit;}/* 180205 수정 */ .sub_list_hor li button.present_btn {display: inline-block; zoom:1; min-height:48px; text-align: center; border-radius: 0px; font-size: 13px; letter-spacing: -1px; top: 36px; position: absolute; right: 0; border: 0; background: #a7aeb4; color: #fff; font-weight:600; padding: 8px 16px;} .sub_list_hor li button.present_btn.active {color: #e7383f; background: #fff; border: 1px solid #e7383f; font-weight:600;} .payment-required button { color: #a3a3a3 !important; border: 1px solid #a3a3a3 !important; background-color: #fff !important;} .sub_list_hor.present_list li .shadow{background:rgba(0, 0, 0,0.6); height: 100%; position:absolute; width: 100%; z-index: 5; top: 0; letter-spacing:-0.6px; text-align: center; color:#fff;} .sub_list_hor.present_list li .shadow .badge_red{float: left; background:#e73940; z-index:6; font-size:13px; font-weight:bold; padding:4px 10px;} .sub_list_hor.present_list li .shadow .freepass{margin-top:49px;} .sub_list_hor.present_list li .shadow .freepass .freepass_tit{font-size:17px; font-weight:600;} .sub_list_hor.present_list li .shadow .freepass .freepass_time{font-size:13px; margin-top:6px;} /*나만의 작품, 삭제 고정메뉴*/ .drow_menu_ed{width: 100%; position: fixed; bottom: 0px; z-index: 1000; background:rgba(0,0,0,0.94); } .drow_menu_ed .drop_box_area.close{margin-bottom: -16px;} .drow_menu_ed .drop_box_area.close .btn_door:before{background-image: url(/assets/img/www/library/drop_up_btn.png);} .drow_menu_ed .drop_box_area .btn_door .blind {display: none; text-align:-9999;} .drow_menu_ed .drop_box_area .btn_door {display:inline-block; zoom:1; width:100%; position: relative; background:rgba(0,0,0,0.0);} .drow_menu_ed .drop_box_area .btn_door:before {content: ""; display: inline-block; width:74px; height:18px; background-image: url(/assets/img/www/library/drop_down_btn.png); background-repeat: no-repeat; background-size:74px; background-position: top center; position:absolute; left: 50%; top:-18px; margin-left:-32px;} .drow_menu_ed .total_comic{width:115px; height:50px; line-height:50px; display:inline-block; color:#fff; font-size:16px; font-weight:500; text-align:right; margin-right:10px;} .drow_menu_ed .total_comic .point{color:#df3744; font-weight:500; letter-spacing:1px;} .drow_menu_ed .btn_area{width: 100%; overflow: hidden; margin:15px -60px 20px; text-align:center;} .drow_menu_ed .btn_area.one_btn{margin-left:-50px;} .drow_menu_ed .btn_area .icon{display: inline-block; width:17px; margin-right:8px;} .drow_menu_ed .btn_area > button{width:218px; height: 50px; line-height:46px; text-align: center; display:inline-block; color: #fff; font-weight:500; font-size:15px; letter-spacing:-0.4px;} .drow_menu_ed .btn_area .my_comic{background: #98a0a7;} .drow_menu_ed .btn_area .cancel_btn{background: #98a0a7;} .drow_menu_ed .btn_area .delete_btn{background: #e7383f;} .drow_menu_ed .btn_area .delete_btn.my{width:100%; height: 48px; line-height:48px; text-align: center; display:inline-block; color: #fff; font-weight:500; font-size:15px; float:left; letter-spacing:-0.4px; background: #e7383f;} /*마이페이지_내정보*/ .sub_body_re .sub_contents2 .sub_title2.my_title{border:none;} .sub_body_re .sub_contents2 .mypage_renew{width:1060px; height:172px; margin:0 auto; background:#f8f8f8;} .sub_body_re .sub_contents2 .mypage_renew ul{padding:0; margin:0;} .sub_body_re .sub_contents2 .mypage_renew .my_info { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; border-top: 1px solid #e8e8e8; border-bottom: 1px solid #e8e8e8; overflow:hidden; } .sub_body_re .sub_contents2 .mypage_renew .my_info li { height: 154px; text-align: center; padding-top: 17px; flex-grow: 1; flex-shrink: 1; flex-basis: 0; clear: both; } .sub_body_re .sub_contents2 .mypage_renew .my_info li a {color: #000;} .sub_body_re .sub_contents2 .mypage_renew .my_info li + li{background: url(/assets/img/www/mypage/my_info_line.gif) left center no-repeat;} .sub_body_re .sub_contents2 .mypage_renew .my_info li span{display:block;} .sub_body_re .sub_contents2 .mypage_renew .my_info .level_img{margin:26px auto 10px;} .sub_body_re .sub_contents2 .mypage_renew .my_info .level{color:#fff; font-size:19px; font-weight:500;} /*.sub_body_re .sub_contents2 .mypage_renew .my_info li:first-child{background:#363c42;}*/ .sub_body_re .sub_contents2 .mypage_renew .my_info .txt{font-size: 15px; font-weight:600; margin:10px auto 5px;} .sub_body_re .sub_contents2 .mypage_renew .my_info .num_value{font-size:34px; font-weight:500; color:#e63640; line-height:35px; margin:0 auto 10px;} .sub_body_re .sub_contents2 .mypage_renew .my_info .num_value2{font-size:21px; font-weight:500; color:#666; line-height:35px; margin:0 auto 10px; letter-spacing:-2px;} .sub_body_re .sub_contents2 .my_list{width: 1060px; margin:50px auto 15px;} .sub_body_re .my_list .point {color: #e7383f;} .sub_body_re .my_list .black {color: #000;} .sub_body_re .my_list .txt_gray {color:#666; margin-top:5px;} .sub_body_re .my_list .tit_main{font-size: 19px; display: inline-block; zoom: 1; font-weight: 600; padding-bottom: 15px; text-align:left;} .sub_body_re .my_list .level_board .stand_area{overflow:hidden;} .sub_body_re .my_list .level_board .stand_area .level_tb{border-top: 1px solid #2f2c2c; border-bottom: 1px solid #ddd; color: #666666; letter-spacing: -0.3px; table-layout: fixed; width:705px; float:left;} .sub_body_re .my_list .level_board .stand_area table th {border: 1px solid #ddd; text-align: center; margin: 0 auto; font-weight: 600; color: #000; background: #f8f8f8; font-size: 14px; letter-spacing:-1px;} .sub_body_re .my_list .level_board .stand_area table td {border: 1px solid #ddd; text-align: center; margin: 0 auto; font-weight:600; font-size: 13px; letter-spacing:-0.5px; text-align: center; height:55px;} .sub_body_re .my_list .level_board .stand_area .level_tb .welcome {color: #3ca504; font-weight: 600; margin-top:7px;} .sub_body_re .my_list .level_board .stand_area .level_tb .silver {color: #9d9d9d; font-weight: 600; margin-top:7px;} .sub_body_re .my_list .level_board .stand_area .level_tb .gold {color: #f88d02; font-weight: 600; margin-top:7px;} .sub_body_re .my_list .level_board .stand_area .level_tb .vip {color: #b78149; font-weight: 600; margin-top:7px;} .sub_body_re .my_list .level_board .stand_area .level_tb .level_height {height:112px;} .sub_body_re .my_list .level_board .comment{float: right; width:324px;} .sub_body_re .my_list .level_board .comment > p{font-size:14px; letter-spacing:-0.9px; font-weight:600; line-height:20px; text-align:left;} .sub_body_re .my_list .level_board .comment > a{display:block; width:275px; height:46px; line-height:46px; text-align:center; background:#a5acbc; color:#fff; font-size:15px; margin:15px auto 15px 0;} .sub_body_re .my_list .level_board .comment .my_score{font-size: 11px; color: #888; font-weight:normal; line-height:17px;} .sub_body_re .my_list .level_board .comment .my_score > strong{color: #717171; font-size: 12px; background: url(http://www.toptoon.com/assets/img/www/mypage/ico_info_l.gif) no-repeat left center; padding-left: 14px; margin-bottom:5px; display:inline-block; zoom:1;} .page_number2 .list_page a.ad{width: 30px; height: 30px; line-height: 30px; display: inline-block; font-size: 15px; margin: 0 10px;} .sub_body_re .my_list .table_board{margin:50px auto;} .sub_body_re .my_list .table_board:last-child{margin:50px auto 0;} .sub_body_re .my_list .table_board .stand_area {position:relative; display:inline-block; zoom:1;} .sub_body_re .my_list .table_board .stand_area .board_btn{display: inline-block; zoom:1; width:100px; height:34px; line-height:33px; text-align:center; color:#fff; font-size:13px; font-weight:500; position: absolute; right:0; bottom:42px; background:#6c94c2;} .sub_body_re .my_list .table_board .stand_area table {border-top: 1px solid #2f2c2c; border-bottom: 1px solid #ddd; color: #666666; letter-spacing: -0.3px; table-layout: fixed; width:1060px; margin-bottom:7px;} .sub_body_re .my_list .table_board .stand_area table th {border-bottom: 1px solid #ddd; height:40px; text-align: center; margin: 0 auto; font-weight: 600; color: #000; background: #f8f8f8; font-size: 14px; letter-spacing:-1px;} .sub_body_re .my_list .table_board .stand_area table td {text-align:center; margin: 0 auto; height:40px; font-size: 12px; letter-spacing:-0.5px;} .sub_body_re .my_list .table_board .stand_area table .my_txt {overflow: hidden; text-overflow: ellipsis; -webkit-box-orient: vertical; padding:0 5px; white-space: nowrap;} .sub_body_re .my_list .table_board .stand_area table .log_coin_point_del {text-align: center; margin: auto; cursor: pointer; display: block; width: 13px; height: 13px; background:url(/assets/img/www/qna_delete.jpg) no-repeat;} .sub_body_re .my_list .table_board .stand_area button.btn_cs{display: inline-block; zoom: 1; width: 100px; height: 34px; line-height: 33px; text-align: center; color: #fff; font-size: 13px; font-weight: 500; position: absolute; right: 0; background: #6c94c2; bottom: 46px;} /*마이페이지_메세지*/ .sub_body_re .my_list .table_board.tb_height{margin-top:-50px;} /*마이페이지_정보수정*/ .sub_body_re .my_list .table_board.tb_height2{margin:30px auto 0;} .sub_body_re .my_list .table_board .stand_area.st table td {text-align:left; margin: 0 auto; height: 40px; font-size: 12px; letter-spacing: -0.5px; padding-left: 20px; border-bottom: 1px solid #ddd;} .sub_body_re .my_list .table_board .stand_area.st table td .sms_st{width:16px; margin-right:4px; border-radius:12px;} .sub_body_re .my_list .table_board .stand_area.st table td .pw_btn{display:inline-block; zoom:1; width:90px; height:28px; line-height:28px; text-align:center; background:#2d2d2d; color:#fff; float: inherit; border:none; margin-left:5px;} .sub_body_re .my_list .table_board .stand_area.st table input{height:24px; line-height:24px; vertical-align:top;} .sub_body_re .my_list .table_board .stand_area.st table td .confirm{display:inline-block; zoom:1; width:45px; height:28px; line-height:28px; text-align:center; background:#6c94c2; color:#fff; float: inherit; border:none; margin-left:5px; } .sub_body_re .my_list .table_board .stand_area.st table td .cancel{display:inline-block; zoom:1; width:45px; height:26px; line-height:26px; text-align:center; background:#fff; color:#797979; float: inherit; border:1px solid #c2c2c2; margin-left:1px;} .sub_body_re .my_list .table_board .stand_area.st a{display:inline-block; zoom:1; width:60px; height:28px; line-height:27px; text-align:center; background: #fff; color:#797979; border: 1px solid #c2c2c2; float:left; margin-left:1px;} .sub_body_re .my_list .table_board .stand_area.st a.active {color: #fff; background: #6c94c2; border: 1px solid #6c94c2;} .sub_body_re .my_list .table_board .stand_area.st .help_close{width:20px; height:20px; display:block; position:absolute; top:0px; right:0px; background:url(/assets/img/www/mypage/layer_close_x.png) no-repeat center center; cursor:pointer; text-align:center;} /*고객센터_자주묻는질문*/ .sub_body_re .sub_contents2 .sub_title2 .tap_menu.area li > a {width: 100px; height: 40px; line-height: 40px; display: block; text-align: center; font-size: 15px; font-weight:500;} .sub_body_re .sub_contents2 .sub_title2 .tap_menu.area li.active a {color: #1a1717; font-weight: 600;} .customer_list .search_bg {margin: 63px auto 0; background:#969ea3; height:110px;} .customer_list .search_bg .search_area{padding:25px 50px;} .customer_list .search_bg .search_area .title{width:230px; height:58px; float:left; font-size:16px; color:#fff;} .customer_list .search_bg .search_area .title > img{margin-right:5px;} .customer_list .search_bg .search_area .search_frm > a{display:inline-block; zoom:1; width:85px; height:32px; line-height:32px; background:#434648; color:#fff; text-align:center;} .customer_list .search_bg .search_area .search_frm > input{width:315px; height: 28px; line-height: 28px; border: 1px solid #fff; vertical-align: top;} .customer_list .search_bg .search_area .search_frm > select{width:188px; height: 32px; line-height: 32px; border: 1px solid #fff; vertical-align: top;} .customer_list .search_bg .search_area .comment{color:#fff; margin-top:10px;} .customer_list .search_bg .search_area .comment > span{letter-spacing:0px;} .customer_list .table_board {margin:50px auto 0;} .customer_list .table_board .stand_area {position: relative; display: inline-block; zoom: 1;} .customer_list .table_board .stand_area .faq_table {color: #666666; width: 940px; margin-bottom: 7px; border-top:1px solid #1a1717;} .customer_list .table_board .stand_area .faq_table .r_table {border-bottom: 1px #ccc solid; font-size: 1.1em; font-weight: bold; cursor: pointer; height:46px; line-height:46px;} .customer_list .table_board .stand_area .faq_table .c_table {background: #f6f6f6; border-bottom: 1px #e1e1e1 solid; padding:12px 16px; line-height:24px;} .customer_list .table_board .stand_area .faq_table .q{display:inline-block; zoom:1; border-radius:80px; color:#fff; background:#1a1717; text-align:center; width: 20px; height: 20px; line-height: 20px; margin:auto 15px;} .customer_list .table_board .stand_area .faq_table .a{display:inline-block; zoom:1; border-radius:80px; color:#fff; background:#e63640; text-align:center; width: 20px; height: 20px; line-height: 20px; margin-right:10px;} /*고객센터_테이블 공통*/ .customer_list .table_board .stand_area .counsel_table {border-top: 1px solid #2f2c2c; border-bottom: 1px solid #ddd; color: #666666; letter-spacing: -0.3px; table-layout: fixed; width:940px; margin:13px auto 7px;} .customer_list .table_board .stand_area .counsel_table td{height:40px; text-align:center;} .customer_list .table_board .stand_area .counsel_table th {border-bottom: 1px solid #ddd; height: 48px; text-align: center; margin: 0 auto; font-weight: 600; color: #000; background: #f8f8f8; font-size: 14px; letter-spacing: -1px;} .customer_list .table_board .stand_area .board_btn {display: inline-block; zoom: 1; width: 100px; height: 34px; line-height: 33px; text-align: center; color: #fff; font-size: 13px; font-weight: 500; position: absolute; right: 0; bottom:-49px; background: #6c94c2;} .customer_list .table_board .stand_area .counsel_table .log_coin_point_del {text-align: center; margin: auto; cursor: pointer; display: block; width: 13px; height: 13px; background: url(/assets/img/www/qna_delete.jpg) no-repeat;} .customer_list .table_board .stand_area .counsel_table .th_st {height: 40px; text-align: center; margin: 0 auto; font-weight: 600; color: #000; background: #f8f8f8; font-size: 14px; letter-spacing: -1px;} .customer_list .table_board .stand_area .counsel_table .td_st{margin: 0 auto; height: 40px; font-size: 12px; letter-spacing: -0.5px; text-align: center; border-top:1px solid #ddd;} .customer_list .table_board .stand_area .counsel_table .q {display: inline-block; zoom: 1; border-radius: 80px; color: #fff; background: #1a1717; text-align: center; width: 20px; height: 20px; line-height: 20px; margin: auto 15px; float:left;} .customer_list .table_board .stand_area .counsel_table .a {display: inline-block; zoom: 1; border-radius: 80px; color: #fff; background: #e63640; text-align: center; width: 20px; height: 20px; line-height: 20px; margin: auto 15px; float:left;} .customer_list .table_board .stand_area .counsel_table .td_st2 {margin: 0 auto; font-size: 12px; letter-spacing: -0.5px; background:#f6f6f6; padding:0;} .customer_list .table_board .stand_area .counsel_table .td_st2 .question, .answer{padding: 11px; border-top:1px solid #ddd;} .customer_list .table_board .stand_area .counsel_table .td_st2 .question, .answer > p{line-height:19px; overflow:hidden; text-align:left;} .customer_list .table_board .stand_area .counsel_table .td_st2 .answer a {display: inline-block !important;background-color: #ff3838;padding: 4px 8px;color: #fff;} /* 쓰기게시판 */ .customer_list .table_board .stand_area .write td {text-align:left; margin: 0 auto; height: 40px; font-size: 12px; letter-spacing: -0.5px; border-bottom:1px solid #ddd; padding-left:15px;} .customer_list .table_board .stand_area .write td > select{width: 152px; height: 30px; line-height: 30px; border: 1px solid #ccc;} .customer_list .table_board .stand_area .write td > input{width: 732px; height: 24px; line-height: 24px; border: 1px solid #ccc;} .customer_list .table_board .stand_area .write td > textarea{width: 730px; height: 400px; border: 1px solid #ccc; margin:10px auto;} .customer_list .table_board .stand_area .write td > .confirm{display:inline-block; zoom:1; width:150px; height:38px; line-height:38px; text-align:center; background:#6c94c2; color:#fff; float: inherit; border:none; margin:13px auto; font-size:14px;} .customer_list .table_board .stand_area .write td > .cancel{display:inline-block; zoom:1; width:150px; height:38px; line-height:38px; text-align:center; background:#a5acbc; color:#fff; float: inherit; border:none; margin:13px auto 10px 5px; font-size:14px;} .customer_list .notice_txt{border:1px solid #cccdcf; background:#f8f8f8; overflow:hidden;} .customer_list .notice_txt .title{width: 200px; float:left;} .customer_list .notice_txt .title > span{color: #717171; font-size:12px; background: url(//toptoon.com/assets/img/www/mypage/ico_info_l.gif) no-repeat left center; padding-left: 17px; display: inline-block; zoom: 1; margin-top:19px; margin-left: 40px;} .customer_list .notice_txt .txt{overflow: hidden; font-size: 12px; line-height:19px; margin: 19px auto; color: #666;} .customer_list .notice_txt .txt .blue{color: #6c94c2;} .customer_list .notice_txt .email{letter-spacing:-0.3px;} .customer_list .notice_txt.leave{margin-top:10px;} .customer_list .notice_txt.leave .title{width:150px; float:left;} .customer_list .notice_txt2 .title{} .customer_list .notice_txt2 .leave_option{text-align:left; margin:10px auto; line-height:23px; font-size:11px;} .customer_list .notice_txt2 .leave_option label{display:block; margin-right: 12px; background: url(//toptoon.com/assets/img/login/checkbox_off.png) no-repeat 0 center; background-size: 20px 20px; text-indent:22px;} .customer_list .notice_txt2 .leave_option label.leave_agree{line-height: 23px; font-size: 13px; font-weight:600; color: #000;} .customer_list .notice_txt2 .leave_option label.active{background: url(//toptoon.com/assets/img/login/checkbox_on.png) no-repeat 0 center; background-size: 20px 20px;} /*이벤트*/ .sub_list_hor li .event_thumb {width:310px; height: 165px; background-size:cover; background-position:center; background-repeat: no-repeat; float: left; margin-right: 29px; position: relative; border:1px solid rgba(0,0,0,0.2);} .sub_list_hor li .event_tit{font-size: 17px; color: #000; font-weight: 600; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; padding:15px 0 3px 0; width:54%;} .sub_list_hor li .event_txt{color: #666; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 35px; margin-bottom:5px; width:54%;} .sub_list_hor li .event_date{color: #666; font-size: 14px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 24px; margin:-3px 5px 5px 0;} .sub_list_hor li .event_date span{vertical-align:middle;} .sub_list_hor li .tag{display:inline-block; zoom:1; width: 30px; height:18px; line-height:18px; font-size: 12px; border:1px solid #6c94c2; color: #6c94c2; border-radius:2px; font-weight:600; text-align:center; margin-right:6px;} .sub_list_hor li button.event_btn {display: inline-block; zoom: 1; width: 65px; height: 65px; text-align: center; border-radius: 80px; font-size: 12px; letter-spacing: -1px; top: 60px; position: absolute; right: 0; border: 0; background: #bbb; color: #fff; font-weight: 600;} .sub_list_hor li button.event_btn.active {color: #e7383f; background: #fff; border: 1px solid #e7383f; font-weight: 600;} /* 3댑스 tab */ .set_tab {position: absolute; right: 0; top:6px;} .set_tab:before {display:block; position:absolute; right:0; top:0; width:1px; height:42px; background-color:#ccc; content:""; z-index:1;} .set_tab:after {display:block; clear:both; content:"";} .set_tab > li {float:left; width:50%;} .set_tab li .tab_menu {display:block; text-align:center;border-bottom:1px solid #151515;} .set_tab li .tab_menu>span {position:relative; display:block; padding:13px 5px 13px; background-color:#f4f4f4; border-top:1px solid #ccc; color:#595959; font-size:15px; white-space:nowrap;} .set_tab li .tab_menu>span:after {position:absolute; right:0; top:50%; width:1px; height:16px; margin-top:-8px; background-color:#ccc; content:"";} .set_tab li:first-child .tab_menu>span {border-left:1px solid #ccc;} .set_tab li.active .tab_menu {border-bottom:none;} .set_tab li.active .tab_menu>span {margin-left:-1px; padding:14px 5px 13px;background-color:#fff; border:1px solid #222; border-bottom:none; color:#151515; font-size:16px; z-index:2; font-weight:600;} .set_tab li.active .tab_menu>span:after {content:none;} .set_tab.menu_1 > li {width:100px;} .set_tab.menu_2 > li {width:150px;} /*제안페이지*/ .sub_body_re .sub_header .tit_topsub2 {font-size: 27px; font-weight: 600; display: inline-block; zoom: 1; line-height: 24px; margin-top: 32px; padding-bottom:15px;} .sub_body_re .suggest_area {width: 1060px; margin:63px auto 0; background: #f8f8f8; border-bottom:1px solid #ddd; border-top:1px solid #1a1717;} .sub_body_re .suggest_area .suggest_txt{padding:30px 50px;} .sub_body_re .suggest_area .suggest_txt .title{font-size:28px; font-weight:500; float:left; height:70px; position:relative; padding-top: 15px;} .sub_body_re .suggest_area .suggest_txt .title:after{width: 1px; height: 68px; margin-top: -25px; background-color: #ddd; content: ""; display: block; right:-56px; position: absolute; margin: -25px 15px;} .sub_body_re .suggest_area .suggest_txt .slogan{overflow: hidden; padding-left:76px; font-size:15px; line-height:24px;} .sub_body_re .suggest_area .suggest_txt .slogan > span{color:#e63640;} .sub_body_re .suggest_list {width: 1060px; margin:0 auto;} .sub_body_re .suggest_list .tit_main {font-size: 19px; font-weight: 600; padding-bottom: 15px; text-align: left; margin-top: 50px;} .sub_body_re .suggest_list .table_board {overflow: hidden;} .sub_body_re .suggest_list .table_board .icon{display: inline-block; zoom: 1; background:#eff1f6; width:75px; height:56px; text-align: center; line-height: 75px; border-radius:90px; float: left; margin-right:34px; padding-top: 18px;} .sub_body_re .suggest_list .table_board .map{width: 1058px; height:362px; border:1px solid #ddd;} .sub_body_re .suggest_list .table_board .txt{position:relative;} .sub_body_re .suggest_list .table_board .txt .form{position:absolute; right: 0; top: 15px; width: 141px; height: 35px; color: #fff; background: #434648; text-align: center; line-height: 35px; font-size: 14px;} .sub_body_re .suggest_list .table_board .txt .tit_txt{font-size: 17px; font-weight: 600;} .sub_body_re .suggest_list .table_board .txt .sb_txt{color:#666; margin:12px auto 25px;} .sub_body_re .suggest_list .table_board .txt .charge{color:#666; background:#f8f8f8; border:1px solid #eaeaea; width:922px; height:50px; line-height:50px; float:right; padding-left:25px;} .sub_body_re .suggest_list .table_board .txt .charge > span{padding-left: 12px; padding-right:5px;} /*연재_요일별보기*/ .weekly_new17{width:1193px; margin:0px auto 50px; position:relative;} .weekly_new17 .weekly_tap17{position:absolute; padding:0; right: 0; top: -20px;} .weekly_new17 .weekly_tap17 li{float:left;} .weekly_new17 .weekly_tap17 li > a{display: block; width: 95px; height: 24px; line-height: 22px; border: 1px solid #ddd; margin-left: -1px; text-align: center; font-size: 11px;} .weekly_new17 .weekly_tap17 li.active a{background: #3e4858; color: #fff; border-color: #3e4858; font-weight: bold;} .index_new .weekly_tap17{position:absolute; padding:0; right: 0; top: -6px;} .index_new .weekly_tap17 li{float:left;} .index_new .weekly_tap17 li > a{display: block; width: 95px; height: 24px; line-height: 22px; border: 1px solid #ddd; margin-left: -1px; text-align: center; font-size: 11px;} .index_new .weekly_tap17 li.active a{background: #3e4858; color: #fff; border-color: #3e4858; font-weight: bold;} .weekly_new17 .webtoonlist_all {overflow: hidden; border-bottom: 1px solid #ddd; background: url(/assets/img/www/common/bg_line03.png) repeat-y 0 0; zoom: 1;} /* 180308 수정 */ .weekly_new17 .webtoonlist_all .col_selected {position: relative; border: 2px solid #6d9add; background-color: #fff; box-sizing: border-box;} /*180308 수정 */ .weekly_new17 .webtoonlist_all .col {float: left; width:171px; margin-right: -1px;} /*180308 수정 */ .weekly_new17 .webtoonlist_all .col_inner {padding:0 7px; /* border-top: 1px solid #f4f4f4;*/} .weekly_new17 .webtoonlist_all .col.last {width: 173px;} /* 180308 수정 */ .weekly_new17 .webtoonlist_all .col_inner.last{padding: 0 7px; /* border-top: 1px solid #f4f4f4;*/} .weekly_new17 .webtoonlist_all .sub_title_weekly {text-align:center; font-size:13px; color:#666; padding: 12px; background:#f9f9f9; border: 1px solid #ddd;} .weekly_new17 .webtoonlist_all .col_selected .sub_title_weekly.active {color:#fff; background-color: #6d9add; font-size:14px; font-weight:bold; z-index:10; border: 1px solid #6d9add;} /* 180308 수정 */ .weekly_new17 .webtoonlist_all .sub_title_weekly .new{height: 14px; background: #ef3d43; color: #fff; line-height: 12px; padding: 0 3px; font-size: 10px; font-weight: bold; margin-left: 3px;} .weekly_new17 .webtoonlist_all ul {padding:0;margin-top:20px;} .weekly_new17 .webtoonlist_all li {position:relative;margin-bottom:12px;} /* .weekly_new17 .webtoonlist_all li:first-child {padding-top:10px;} */ .weekly_new17 .webtoonlist_all li:last-child {padding-bottom:25px;} .weekly_new17 .webtoonlist_all li .thumb_img{width:155px; height: 93px; background-position: center; background-size: cover; background-size: 100%; background-repeat: no-repeat; position:relative;} /*180308 수정 */ .weekly_new17 .webtoonlist_all li .adult{width: 18px; height: 18px; font-size:11px; background: #f54a3d; color: #fff; font-weight: bold; font-family: arial, tahoma, sans-serif; position: absolute; top: 3px; right: 3px; border-radius: 20px; text-align: center; line-height: 20px; letter-spacing: -1px; z-index: 3;} .weekly_new17 .webtoonlist_all li .icon_dday{width: 23px; height: 23px; background: rgba(0, 0, 0, 0.8) url(/assets/img/www/common/icon_dday.png) no-repeat center center; position: absolute; left: 0; top: 0px; background-size: 15px;} .weekly_new17 .webtoonlist_all li .thumb_gra2 {width:100%; height:129px; background:url(/assets/img/www/common/gra_bg2.png) center center no-repeat; position:absolute;} .weekly_new17 .webtoonlist_all li .hashtag {position:absolute; bottom:5px; left:8px; font-size:11px; font-weight:600; letter-spacing:-0.8px} .weekly_new17 .webtoonlist_all li .hashtag span.tag01 {color: #5facff;} .weekly_new17 .webtoonlist_all li .thumb_float {position: absolute; z-index: 4; top: 72px; right: -6px;} .weekly_new17 .webtoonlist_all li .thumb_float > img{width:78px;} .weekly_new17 .webtoonlist_all li .tit_thumb_c{font-size: 14px; font-weight: 600; color: #000; line-height: 24px; height:24px; margin:3px auto 2px 0; display:flex; flex-direction:row; flex-wrap:nowrap; justify-content:space-between; align-items:stretch;} .weekly_new17 .webtoonlist_all li .tit_thumb_c.active{color: #000;} /* 180308 수정 */ .weekly_new17 .webtoonlist_all li .tit_thumb_c span.tit_in_tit{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display:block; max-width:85%;} /* 180308 수정 */ .weekly_new17 .webtoonlist_all li .tit_thumb_e .ep_count{float:left; width:96px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} .weekly_new17 .webtoonlist_all li .tit_thumb_e .ep_point{float:right;margin-right:1px;} .weekly_new17 .webtoonlist_all li .tit_thumb_e .ep_point span.epicon_starpoint{width:10px; height:10px; background:url(/assets/img/www/main/renewal1711_icon_star.png) no-repeat center; display:inline-block;} .weekly_new17 .webtoonlist_all li .badge_area{position:inherit; width:100%; height:20px; overflow: hidden;} .weekly_new17 .webtoonlist_all li .badge_area span.weekly_new_badge{width: 28px; height: 16px; background: #73b40c; border: 1px solid #598e06; border-radius: 2px; font-size: 11px; color: #fff; text-align: center; vertical-align: top; display: inline-block; zoom: 1;} .weekly_new17 .webtoonlist_all li .badge_area span.weekly_recommend_badge{width: 28px; height: 16px; background: #519bff; border: 1px solid #1466d4; border-radius: 2px; font-size: 11px; color: #fff; text-align: center; vertical-align: top; display: inline-block; zoom: 1;} .weekly_new17 .webtoonlist_all li .badge_area span.weekly_up_badge{width: 28px; height: 16px; background: #f03e3d; border: 1px solid #bb0302; border-radius: 2px; font-size: 11px; color: #fff; text-align: center; vertical-align: top; display: inline-block; zoom: 1; letter-spacing:0.5px;} .weekly_new17 .webtoonlist_all li .badge_area span.weekly_rest_badge{width: 28px; height: 16px; background:#989898; border:1px solid #747474; border-radius: 2px; font-size: 11px; color: #fff; text-align: center; vertical-align: top; display: inline-block; zoom: 1;} /*190626 footer*/ .sub_footer19{width:100%; margin:0 auto; bottom:0; border-top:1px solid #e5e5e5;} .sub_footer19 .footer_app{width:100%; text-align:center;} .sub_footer19 .footer_wrap{width:100%; background:#eaecee; color:#7c8084; letter-spacing:-1.2px} .sub_footer19 .footer_wrap a{color:#7c8084;} .sub_footer19 .footer_wrap .menu_wrap{width:100%; border-bottom:1px solid #d5d9dc;} .sub_footer19 .footer_wrap .menu_wrap .menu{width:1200px; margin:0 auto; overflow:hidden;} .sub_footer19 .footer_wrap .menu .left{float:left; padding-left:0; margin:0} .sub_footer19 .footer_wrap .menu .left > li{float:left; background:url(/assets/img/www/index_renewal/footer_line01.gif) right center no-repeat;} .sub_footer19 .footer_wrap .menu .left > li:last-child{background:none;} .sub_footer19 .footer_wrap .menu .left > li > a{display:block; padding:15px;} .sub_footer19 .footer_wrap .menu .left > li > a.first{padding-left:0;} .sub_footer19 .footer_wrap .menu .point{color:#fff;} .sub_footer19 .footer_wrap .menu .red{color:#ff4a54;} .sub_footer19 .footer_wrap .menu .right{float:right; margin:0} .sub_footer19 .footer_wrap .menu .right > li{float:left;} .sub_footer19 .footer_wrap .menu .right > li + li{background:url(https://toptoon.com/assets/img/www/index_renewal/footer_line.gif) left center no-repeat;} .sub_footer19 .footer_wrap .menu .right > li > a{display:block; padding:15px;} .sub_footer19 .footer_wrap .menu .right > li > a.last{padding-right:0} .sub_footer19 .footer_wrap .menu .right .icon_news{display:inline-block; background:url(/assets/img/www/index_renewal/icon_news.png) center center no-repeat; background-size:100%; width:16px; height:14px; vertical-align:middle; margin-top:-2px; margin-right:4px} .sub_footer19 .footer_wrap .info_wrap{width:100%; border-bottom:1px solid #d5d9dc;} .sub_footer19 .footer_wrap .info_wrap .info {width:1200px; margin:0 auto; padding:20px 0; overflow:hidden} .sub_footer19 .footer_wrap .info_wrap .info > span.logo{display:block; width:150px; float:left} .sub_footer19 .footer_wrap .info_wrap .info .copyright{width:860px; float:left; line-height:21px;} .sub_footer19 .footer_wrap .info_wrap .info .copyright > p {color:#000; font-size:12px} .sub_footer19 .footer_wrap .info_wrap .info .copyright > span.point1{letter-spacing:0; color:#fff;} .sub_footer19 .footer_wrap .info_wrap .info .copyright > span.point2{color:#8da5d3; font-weight:600;} .sub_footer19 .footer_wrap .info_wrap .info .sns_menu{float:right; margin-top:0; padding-left:0;} .sub_footer19 .footer_wrap .info_wrap .info .sns_menu ul{padding:0;} .sub_footer19 .footer_wrap .info_wrap .info .sns_menu > li{float:left; padding:0 3px;} .sub_footer19 .footer_wrap .site_wrap{width:100%; width:1200px; margin:0 auto; padding:15px 0 18px 0; overflow:hidden} .sub_footer19 .footer_wrap .site_wrap ul{margin:0; padding:0} .sub_footer19 .footer_wrap .site_wrap ul li{display:inline-block; border-radius:3px; font-size:12px; text-indent:19px; padding:5px 7px} .sub_footer19 .footer_wrap .site_wrap ul li.site_01{background:url(https://toptoon.com/assets/img/mobile/footer/logo_kisa.png) no-repeat 0 4px; background-size:20px; text-indent:16px; margin-left:150px} .sub_footer19 .footer_wrap .site_wrap ul li.site_02{background:url(https://toptoon.com/assets/img/mobile/footer/logo_ok_copyright.png) no-repeat 3px 4px; background-size:25px; text-indent:22px} .sub_footer19 .footer_wrap .site_wrap ul li.site_03{background:url(https://toptoon.com/assets/img/mobile/footer/logo_clean.png) no-repeat 3px center; background-size:20px} .sub_footer19 .footer_wrap .site_wrap ul li.site_04{background:url(https://toptoon.com/assets/img/mobile/footer/logo_innobiz.png) no-repeat 5px center; background-size:38px; text-indent:38px} .sub_footer19 .footer_wrap .site_wrap ul li.site_05{background:url(https://toptoon.com/assets/img/mobile/footer/logo_happy.png) no-repeat 3px center; background-size:19px} .sub_footer19 .footer_wrap .site_wrap ul li.site_07{background:url(https://toptoon.com/assets/img/responsive/common/footer/logo_ok_copyright_new.png) no-repeat 0px 5px; background-size:29px; text-indent:25px;} .relative {position:relative;} .newlayer_wp span.desc {display:block;line-height:25px;font-size:14px;} .alert_layer span.desc {display:block;line-height:25px;font-size:14px;} /*회차리스트 공유버튼 추가*/ .webtoon_button{position:absolute; bottom:0; right:410px; width:340px; height:40px; padding:10px; text-align:right; z-index:500;} .webtoon_button a{display:inline-block; width:40px; height:40px; border-radius:50%; background-color:rgba(0,0,0,0.6); margin-left:5px; background-position:center;} .webtoon_button a.btn_share_facebook{display:inline-block; background-image:url(/assets/img/www/eplist/ep_sns_ico_fb.png);} .webtoon_button a.btn_share_twitter{display:inline-block; background-image:url(/assets/img/www/eplist/ep_sns_ico_twitter.png);} .webtoon_button a.btn_share_facebook{display:inline-block; background-image:url(/assets/img/www/eplist/ep_sns_ico_fb.png);} .webtoon_button a.btn_share_kakao{display:inline-block; background-image:url(/assets/img/www/eplist/ep_sns_ico_kakao.png);} .webtoon_button a.btn_share_kakaostory{display:inline-block; background-image:url(/assets/img/www/eplist/ep_sns_ico_kakaostory.png);} .webtoon_button a.btn_share_naver{display:inline-block; background-image:url(/assets/img/www/eplist/ep_sns_ico_nv.png);} .webtoon_button a.btn_share_fbgood{display:inline-block; background-image:url(/assets/img/www/eplist/ep_sns_ico_fb_like.png);} /*이 회차 볼 차례*/ .comic_next_ep{position:absolute; bottom:0; width:768px; height:70px; padding:10px; text-align:left; background-color:rgba(255,255,255,0.9); border:1px solid #ddd;} .comic_next_ep a{display:block; height:100%;} .comic_next_ep .comic_next_thumb{float:left; overflow: hidden; margin-right:15px;} .comic_next_ep .comic_next_thumb img{height:inherit; width: 142px;} .comic_next_ep .comic_next_info{padding: 15px 0;} .comic_next_ep .comic_next_info .comic_next_tit{font-size:15px; color:#000; font-weight:bold;} .comic_next_ep .comic_next_info .comic_next_num{font-size:13px; color:#5b96cf; margin-top: 7px; font-weight: bold;} /*결제수단2개팝업 다른결제수단 추가*/ .pay_methods a.other_payment{width:82%; height:40px; line-height:40px; background:#000; color:#fff; border-color:#000;} /*BL관 NEW 아이콘*/ span.new_icon_common{width:15px; height:15px; background:url(/assets/img/www/common/newicon_new.png) no-repeat center; display:inline-block; vertical-align:middle; margin:-2px 2px 0 0;} span.bl_banana_icon_common{width:18px; height:17px; background:url(/assets/img/www/common/bl_ico_w_banana.png) no-repeat center; display:inline-block; vertical-align:middle; margin:-2px 2px 0 0;} /* 17823 작품리스트 개선 */ .renewal17_toon_list{width:100%;} .renewal17_toon{width:1200px; margin:0 auto;} .renewal17_toon ul{padding:0; margin: 0;} .renewal17_toon li {width: 218px; height:232px; border: 1px solid #ddd; float: left; margin-left: 25px !important; background: #fff; margin-bottom: 25px !important; position: relative;} .renewal17_toon li:nth-child(5n+1) {margin-left:0 !important;} .renewal17_toon li .thumb_img {width:100%; height:137px; background-size: cover; background-position: center; position: relative;} /* overflow: hidden; */ .renewal17_toon li .thumb_gra {width:100%; height:137px; background:url(/assets/img/www/common/gra_bg.png) center center no-repeat; position:absolute;} .renewal17_toon li .icon_dday {width:32px; height:32px; background: rgba(0, 0, 0, 0.8) url(/assets/img/www/common/icon_dday.png) no-repeat center center; position:absolute; left:0; top:0;} .renewal17_toon li .adult {width:18px; height:18px; background: #f54a3d; color: #fff; font-weight: bold; font-family: arial, tahoma, sans-serif; position: absolute; top:6px; right:6px; border-radius: 20px; text-align: center; line-height:18px; letter-spacing: -1px; z-index:3; font-size:11px;} .renewal17_toon li .thumb_float {position: absolute; z-index: 4; top: 100px; right:-5px;} .renewal17_toon li .hashtag {position:absolute; bottom:5px; left:8px; font-size:11px; font-weight:600; letter-spacing:-0.8px} .renewal17_toon li .hashtag span.tag01{color:#5facff;} .renewal17_toon li .hashtag span.tag02{color:#ff5f6a;} .renewal17_toon li .thumb_info {font-size: 12px; line-height: 16px; color:#666; padding:12px 14px; position: relative; background: #fff; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} .renewal17_toon li .thumb_info .tit_area{margin-bottom:3px;} .renewal17_toon li .thumb_info .tit_area .title {font-size: 16px; font-weight: 600; color: #000; max-width:84%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: -1px; display: inline-block; margin-right:5px; vertical-align:middle; height: 20px;} .renewal17_toon li .thumb_info .ep {overflow:hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; height: 16px;} .renewal17_toon li .webtoon_synopsis {font-size: 11px; color: #999999; position: relative; border-top: 1px solid #ddd; padding:8px 14px; font-weight: 500; letter-spacing: -1px;} .renewal17_toon li .webtoon_synopsis .author {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 90%; display: block;} .renewal17_toon li .badge_pack{font-size: 0; width:150px; height: 17px; float:right; position:absolute; top:8px; right:10px; text-align: right;} .badge_pack.all{font-size: 0; position: inherit; width: 100%; height: 18px; overflow: hidden;} .badge_pack.all span{display: inline-block; margin-right:2px; margin-left:0; width: 28px; height: 16px; border-radius: 2px; font-size: 11px; color: #fff; text-align: center; vertical-align: top;} .badge_pack span{display: inline-block; margin-left: 3px; width: 28px; height: 16px; border-radius: 2px; font-size: 11px; color: #fff; text-align: center; vertical-align: top;} .badge_pack span.complete_badge{background: #f03e3d; border: 1px solid #bb0302;} .badge_pack span.new_badge {background: #73b40c; border: 1px solid #598e06;} .badge_pack span.comment_badge{background: #9e3df0; border: 1px solid #6d0ac1;} .badge_pack span.rest_badge{background: #989898; border: 1px solid #747474;} .badge_pack span.waiting_badge{background: #989898; border: 1px solid #747474;width:37px !important;} .badge_pack span.recommend_badge{background: #519bff; border: 1px solid #1466d4;} .badge_pack span.up_badge{background: #f03e3d; border: 1px solid #bb0302;} /* bl관 탭추가 */ .view_tap{width:1200px; margin:auto; text-align:right; height:24px; margin-bottom:12px;} .view_tap .weekly_tap17{float:right; padding:0; margin:0;} .view_tap .weekly_tap17 li{float:left;} .view_tap .weekly_tap17 li a{display: block; width: 95px; height: 24px; line-height: 22px; border: 1px solid #ddd; background:#fff; margin-left: -1px; text-align: center; font-size: 11px;} .view_tap .weekly_tap17 li.active a{background: #3e4858; color: #fff; border-color: #3e4858; font-weight: bold;} .fixed {position:fixed;} /*선물함 코인 리워드 아이콘*/ .ico_gift_coinreward{width:120px; height:120px; position:absolute; top:0; left:0; background:url(/assets/img/mobile/payment/coin_img_item01.png)no-repeat center center #f6f6f6; background-size:54px;} /*충전소 테이블 1709*/ .payment_new .payment_contents table.payment_item_list{width:100%;} .payment_new .payment_contents table.payment_item_list th{background:#f6f6f6; height:40px; line-height:40px; border-top:2px solid #e63740; border-left:1px solid #ddd;} .payment_new .payment_contents table.payment_item_list th:first-child{border-left:0;} .payment_new .payment_contents table.payment_item_list td{height:55px; padding-left:15px; cursor:pointer;} .payment_new .payment_contents table.payment_item_list td:first-child{border-left:0;} .payment_new .payment_contents table.payment_item_list th, .payment_new .payment_contents table.payment_item_list td{border-bottom:1px solid #ddd; border-left:1px solid #ddd;} .payment_new .payment_contents table.payment_item_list p.select_area{display:inline-block; vertical-align:middle; margin:0 20px 0 10px;} .payment_new .payment_contents table.payment_item_list p.price_area{display:inline-block; vertical-align:middle;} .payment_new .payment_contents table.payment_item_list span.item_select{width:20px; height:55px; background:url(/assets/img/www/payment/payment_select_radio_off.png) no-repeat center; margin:auto; display:inline-block; vertical-align:middle;} .payment_new .payment_contents table.payment_item_list span.item_select.active{background:url(/assets/img/www/payment/payment_select_radio_on.png) no-repeat center;} .payment_new .payment_contents table.payment_item_list span.coin_item_img{width:30px; height:30px; background:url(/assets/img/www/payment/payment_coinimg.png) no-repeat center; margin:auto; display:inline-block; vertical-align:middle; margin-right:5px; margin-top:1px; float:left;} .payment_new .payment_contents table.payment_item_list span.total_coin{height:30px; line-height:30px; display:inline-block; font-weight:bold;} .payment_new .payment_contents table.payment_item_list span.icon_benefit{display:inline-block; width:40px; height:18px; background:url(/assets/img/www/payment/txticon_discount.png) no-repeat center; vertical-align:middle; margin-right:5px;} .payment_new .payment_contents table.payment_item_list span.item_cost{color:#999; text-decoration:line-through; margin:-2px 10px 5px 0;} .payment_new .payment_contents table.payment_item_list span.item_price{font-weight:bold;} span.td_chargebtn{display:block; float:right; width:90px; height:26px; line-height:26px; text-align:center; color:#fff; background:url(/assets/img/www/common/charge_btncharge_arrow_df.png) no-repeat 65px center #363a48; border-radius:50px; margin-right:25px; font-size:12px; text-indent:-17px;} span.td_chargebtn.active{background:url(/assets/img/www/common/charge_btncharge_arrow_red.png) no-repeat 65px center #e63740;} /*충전소 리뉴얼 + 미니결제창 201709*/ .new_payment1709{width:100%; background:#e8ecf0;} .new_payment1709.minipay_wp{background:#fff;} .new_payment1709 .new_paylist{padding:5px 5px 10px 5px;} .new_payment1709 .new_paylist .payment_item_list {width:100%;} .new_payment1709 .new_paylist table.payment_item_list{border:1px solid #ddd;} .new_payment1709 .new_paylist table.payment_item_list{border-collapse:separate; border-top:0; border-bottom:0;} .new_payment1709 .new_paylist table.payment_item_list tr.active td{background:#fff2f2;} .new_payment1709 .new_paylist table.payment_item_list th{background:#f6f6f6; border-top:2px solid #e63740; height:40px; color:#000; font-weight:bold; font-size:12px;} .new_payment1709 .new_paylist table.payment_item_list th, .new_payment1709 .new_paylist table.payment_item_list td{border-bottom:1px solid #ddd; border-left:1px solid #ddd; padding-right:10px;} .new_payment1709 .new_paylist table.payment_item_list th:first-child, .new_payment1709 .new_paylist table.payment_item_list td:first-child{border-left:0;} .new_payment1709 .new_paylist table.payment_item_list td{height:48px; background:#fff; font-size:12px; padding-left:10px;} .new_payment1709 .new_paylist table.payment_item_list td.price_cell{text-align:center; position:relative;} .new_payment1709 .new_paylist table.payment_item_list td.info_cell{padding-left:10px;} .new_payment1709 .new_paylist table tbody tr {cursor:pointer;} .new_payment1709 .new_paylist p.dft_price{color:#999; text-decoration:line-through; font-size:11px; display:block; margin-right:5px;} .new_payment1709 .new_paylist p.selling_price{font-size:12px; color:#000; font-weight:bold; display:block;} .new_payment1709 .new_paylist p.selling_price.oneline{margin-top:10px;} .new_payment1709 .new_paylist p.item_select{width:20px; height:20px; background:url(/assets/img/mobile/payment/payment_select_radio_off.png) no-repeat center; background-size:100%; position:absolute; top:14px; left:10px;} .new_payment1709 .new_paylist p.item_select.active{width:20px; height:20px; background:url(/assets/img/mobile/payment/payment_select_radio_on.png) no-repeat center; background-size:100%;} .new_payment1709 .new_paylist .coin_ea{float:left;} .new_payment1709 .new_paylist .coin_ea p.coin_item_img{width:25px; height:25px; background:url(/assets/img/mobile/common/coin_img01.png) no-repeat center; background-size:100%; float:left; margin-right:5px; margin-top:0px;} .new_payment1709 .new_paylist .coin_ea p.ticket_item_img{width:25px; height:25px; background:url(/img/mobile/payment/list_coin_item07.png) no-repeat center; background-size:100%; float:left; margin-right:5px; margin-top:6px;} .new_payment1709 .new_paylist .coin_ea p.coin_info{float:left; padding-top:0px;} .new_payment1709 .new_paylist .coin_ea span.total_coin{font-size:12px; font-weight:bold; color:#000; display:block;} .new_payment1709 .new_paylist .coin_ea span.unit_price{display:inline-block; background:#fff3b7; color:#e63740; font-size:10px; padding:0 3px;} .new_payment1709 .new_paylist .payment_benefit{float:left; color:#e63740; height:20px; line-height:20px;} .new_payment1709 .new_paylist .payment_benefit.oneline{margin-top:10px;} .new_payment1709 .new_paylist .payment_benefit span{display:block;} .new_payment1709 .new_paylist .payment_benefit span.payco_event{color:#e63740;} .new_payment1709 .new_paylist .payment_benefit span.payco_logo_in{display:inline-block; margin-right:3px; width:35px; height:8px; background:url(/assets/img/mobile/payment/payment_logo_payco_in.png) no-repeat center; background-size:100%;} .new_payment1709 .new_paylist .event_icon{float:right; width:30px; height:30px; margin:3px 10px 0 0;} .new_payment1709 .new_paylist .event_icon img{width:100%;} .new_payment1709 .new_paylist span.txticon_benefit{display:inline-block; width:25px; height:15px; background:url(/assets/img/mobile/payment/icon_benefit.png) no-repeat center top; background-size:25px; margin-right:5px; vertical-align:middle;} .btn_shape_charge{padding:0 8px; background:#363a48; float:right; color:#fff; border-radius:50px; height:20px; line-height:20px; margin-left:5px;} .btn_shape_charge.active{background:#e63740;} @media (max-width:320px){ .new_payment1709 .new_paylist table td{font-size:10px !important; padding-left:5px !important;} .new_payment1709.minipay_wp table.payment_item_list th{height:30px;} .new_payment1709.minipay_wp table.payment_item_list td{height:50px;} .new_payment1709 .new_paylist .coin_ea p.coin_item_img{width:20px;} } /*결제수단 타이틀 우측 뒤로가기 버튼*/ p.payment_title a.title_btn_back{display:block; float:right; background:#363a48; color:#fff; font-weight:bold; font-size:14px; text-align:center; border-radius:5px; width:120px; height:40px; line-height:40px; margin-top:-10px; cursor:pointer;} /*코인부족 결제창 VAT별도*/ .price_vat_info{font-size:11px; color:#999; text-align:right;} /*top19 버튼*/ a.switch_19mode{display:block; width:48px; height:20px; background:url(/assets/img/www/common/switch_19off.png) no-repeat center;} a.switch_19mode.active{background:url(/assets/img/www/common/switch_19on.png) no-repeat center;} /*마이페이지19스위치*/ .my_19switch a{display:block; border-radius:3px 0 0 3px; width:35px !important; line-height:26px; border:1px solid #cbccce; background:#f1f2f4; color:#666;} .my_19switch a.mode_on{border-radius:3px 0 0 3px; background:#e63740 !important; color:#fff !important; border-color:#e63740 !important;} .my_19switch.off19 a.mode_on{background:#999 !important; border-color:#999!important;} .my_19switch a + a{margin-left:-1px !important; border-radius:0 3px 3px 0 !important; background:#e63740;} span.span_badge {position: absolute; margin-left: -3px;} span.renewal1711_txtbadge{display:inline-block; vertical-align:middle;} /* 180308 수정 */ span.renewal1711_txtbadge.viewcomic{width:44px; height:18px; background:url(/assets/img/www/common/txtbadge_viewcomic2.png) no-repeat center;} span.renewal1711_txtbadge.freeticket{width:55px; height:18px; background:url(/assets/img/www/common/txtbadge_freeticket.png) no-repeat center;} span.renewal1711_txtbadge.freeticket2{width:35px; height:18px; background:url(/assets/img/www/common/txtbadge_freeticket2.png) no-repeat center;} span.renewal1711_txtbadge.free{width:28px; height:18px; background:url(/assets/img/www/common/txtbadge_free.png) no-repeat center;} span.renewal1711_txtbadge.newnew{width:28px; height:18px; background:url(/assets/img/www/common/txtbadge_new.png) no-repeat center;} /* span.renewal1711_txtbadge.recommend{width:28px; height:18px; background:url(/assets/img/www/common/txtbadge_recommend.png) no-repeat center;} */ span.renewal1711_txtbadge.recommend{width:28px; height:18px; background:url(/assets/img/www/common/txtbadge_bigzzam.png) no-repeat center;} span.renewal1711_txtbadge.top10{width:39px; height:18px; background:url(/assets/img/www/common/txtbadge_top10_new.png) no-repeat center;} /* span.renewal1711_txtbadge.discount{width:28px; height:18px; background:url(/assets/img/www/common/txtbadge_discount.png) no-repeat center;} */ span.renewal1711_txtbadge.up{width:26px; height:16px; background:url(/assets/img/www/common/txtbadge_up.png) no-repeat center;} span.renewal1711_txtbadge.up2{display:block; float:left; margin-top:3px; width:26px; height:16px; background:url(/assets/img/www/common/txtbadge_up.png) no-repeat center;} span.renewal1711_txtbadge.up_round_thumb{display:block !important; width:28px; height:28px; background:url(/assets/img/www/common/new1711_badge_allview_up2.png) no-repeat center right; margin-left:2px;} /* 180308 수정 */ span.renewal1711_txtbadge.up_round_thumb2{display:block !important; width:30px !important; height:20px; background:url(/assets/img/www/common/new1711_badge_allview_up2.png) no-repeat center; float:left; margin-left:2px;} span.renewal1711_icon_adult19_sthumb{width:15px; height:15px; background:url(/assets/img/www/common/sidebar_icon_adult19_sthumb.png) no-repeat center #f54a3d; background-size:9px; position:absolute; bottom:3px; right:3px; border-radius:50%;} span.renewal1711_icon_waitfree{width:30px; height:30px; background:url(/assets/img/www/common/icon_wait_free2.png) no-repeat center rgba(0,0,0,0.5); background-size:20px; position:absolute; top:5px; left:5px; border-radius:50%;} span.renewal1711_icon_starpoint{width:10px; height:10px; background:url(/assets/img/www/common/renewal1711_icon_star.png) no-repeat center; margin-right:3px;} span.starpoint_txt{font-size:11px; color:#000; margin-right:7px;} /*이벤트 뱃지 추가*/ span.renewal1711_txtbadge.ico_zzz{display:block !important; width:20px; height:20px; background:url(/assets/img/www/common/txtbadge_zzzz.png) no-repeat center; float:left;} span.renewal1711_txtbadge.ico_end{width:28px; height:18px; background:url(/assets/img/www/common/txtbadge_end.png) no-repeat center;} span.renewal1711_txtbadge.latestend{width:44px; height:18px; background:url(/assets/img/www/common/txtbadge_latestend.png) no-repeat center;} /* 최신 완결 */ span.renewal1711_txtbadge.sectionfree{width:45px; height:18px; background:url(/assets/img/www/common/txtbadge_free_section.png) no-repeat center;} span.renewal1711_txtbadge.badge_oneplus { width: 60px; height: 18px; background-repeat: no-repeat; background-position: center; } span.renewal1711_txtbadge.txtbadge_bigfree{width:48px; height:18px; background: url(/assets/img/www/common/txtbadge_freeticket_w.png) no-repeat center;} /*팝업공통*/ .newpop17_common{width:400px; max-width:400px; margin:115px auto; background:#f6f6f6; position:relative; text-align:center; border-radius:7px;} .newpop17_common .newpop17_title{font-size:16px; height:45px; line-height:45px; border-bottom:1px solid #ddd; font-weight:bold; color:#000;} .newpop17_common .contents_area{padding:30px 20px; font-size:14px; color:#000; line-height:22px;} .newpop17_common .contents_area .contents_title{font-size:20px; color:#000; font-weight:bold; margin-bottom:10px;} .newpop17_common .contents_area a.btn_allbuy{display:block; border-radius:20px; background:#e63740; color:#fff; text-align:center; width:50%; margin:auto; height:40px; line-height:40px; font-size:15px; font-weight:bold;} .newpop17_common .comic_thumb{width:70%; padding-bottom:35%; background-size:cover; background-repeat:no-repeat; background-position:center; margin:0 auto 15px;} .newpop17_common .contents_text{margin-bottom:20px;} .newpop17_common span.txt_point{color:#e63740;} .newpop17_common span.txt_point2{color:#e63740; background:#ffdbda; display:inline-block; padding:0 5px;} .newpop17_common span.txt_cancel{color:#999; text-decoration:line-through;} .newpop17_common .close_line{height:44px; line-height:44px; background:#000; border-radius:0 0 7px 7px;} .newpop17_common .close_line a.btn_close{display:block; cursor:pointer; color:#fff; font-weight:bold; font-size:15px; letter-spacing:-1px;} /*전체구매시 코인 할인*/ .allbuy_discount{background:#f3f3f8; height:100px !important;} .allbuy_discount span.ep_name{width:50% !important;} .allbuy_discount span.ep_ea{color:#4c5694;} .allbuy_discount span.org_coin{color:#999; text-decoration:line-through; margin-right:10px; font-weight:normal;} .allbuy_discount span.disc_coin{color:#e63740;} .allbuy_discount_bnr{width:80%; margin:auto; background:#fff; height:40px; line-height:40px; border:1px solid #d6d6e5; color:#000; text-align:center; margin:auto; color:#000; font-size:13px;} .allbuy_discount_bnr span{display:inline-block; vertical-align:middle;} .allbuy_discount_bnr span.point_txt{color:#e63740;} .allbuy_discount_bnr span.icon_allbuy_sale{width:32px; height:32px; background:url(/assets/img/www/common/icon_allbuy_sale.png) no-repeat center; margin-right:5px;} /*171205::전체소장 할인혜택:회차리스트UI*/ th.allbuy_event_only{border-bottom:1px solid #e4d8b4; background:#fffbd4; text-align:left; padding:0 15px;} /*180817 수정*/ span.eplist_event_ico_notice{display:block !important; width:26px; height:20px; background:url(/assets/img/www/common/w_ico_allbuy_event_notice.png) no-repeat center; float:left; margin:13px 5px 0 0;} span.eplist_event_ico_sale{display:block; width:26px; height:20px; background:url(/assets/img/www/common/w_ico_allbuy_event_sale.png) no-repeat center; margin:13px 5px 0 0; float:left;} .eplist_table_btn_area{float:right; margin-top:8px;} span.renewal1711_txtbadge.free{width:28px; height:18px; background:url(/assets/img/www/common/txtbadge_free.png) no-repeat center;} span.renewal1711_txtbadge.discount{width:28px; height:18px; background:url(/assets/img/www/common/txtbadge_discount2.png) no-repeat center;} span.starpoint_txt{font-size:11px; color:#000; margin-right:7px;} /*180817 전체소장 총회차추가*/ .episode_list .txt_point2{color:#4a7dff;} .episode_list .buy_ep_count{display:inline-block;} .episode_list .buy_ep_count > span{vertical-align:top; font-size:12px; display:inline-block;} .episode_list .buy_ep_count .line{background:#e0d2a9; width: 1px; height: 15px; margin: 0 6px; vertical-align: sub;} .episode_list .buy_ep_count .ep_count{color:#000; margin-right:3px;} .episode_list .buy_ep_count .org_coin{color:#999; text-decoration: line-through;} .episode_list .buy_ep_count .buy_coin{color:#ff4a4a;} /*171208::전체소장시 하단 구매정보 및 버튼 :회차리스트UI*/ .buyall_info_wp{width:100%; height:80px; border-top:1px solid #000; background:rgba(255,255,255,0.9); position:fixed; bottom:0; z-index:10; display:none;} /*180817 수정*/ .buyall_info_wp .buyall_buy_infobox{width:1150px; height:80px; line-height:80px; margin:auto; padding:0 25px; font-size:15px;} .buyall_info_wp .buyall_buy_infobox span.txt_point{margin:0 3px;} .buyall_info_wp .buyall_buy_infobox span.txt_point2{color:#4a7dff; font-weight:600;} /*180817 추가*/ .buyall_info_wp .buyall_buy_infobox p.buy_ep_count{float:right;} /*180817 수정*/ .buyall_info_wp .buyall_buy_infobox .buy_btn_area{float:right; text-align:right; margin-left:15px;} /*180817 수정*/ .buyall_info_wp .buyall_buy_infobox .buy_btn_area a{display:inline-block; padding:0 15px; height:40px; line-height:40px; text-align:center; min-width:115px; font-size:14px; font-weight:bold;} /*180817 수정*/ .buyall_info_wp .buyall_buy_infobox .buy_btn_area a.btn_buyall{background:#e63740; color:#fff;} .buyall_info_wp .buyall_buy_infobox .buy_btn_area a.btn_buyall span.org_price{color:#ffaaae; text-decoration:line-through; font-weight:normal; margin-right:3px;} .buyall_info_wp .buyall_buy_infobox .buy_btn_area a.btn_buyall_cancel{background:#e5e5e5; color:#000;} /*180817 수정*/ .buyall_info_wp .buyall_buy_infobox p.discount_info{float:left; padding-right:15px;} /*180817 수정*/ /*180817::전체소장 하단 구매정보추가*/ .buyall_info_wp .buyall_buy_infobox p.buy_ep_count > span{vertical-align:top; display:inline-block; font-weight:bold;} .buyall_info_wp .buyall_buy_infobox p.buy_ep_count .ep_count{color:#000; margin-right:8px;} .buyall_info_wp .buyall_buy_infobox p.buy_ep_count .org_coin{color:#999; text-decoration:line-through; font-weight:normal;} .buyall_info_wp .buyall_buy_infobox p.buy_ep_count .buy_coin{color:#ff4a4a;} /*171212최종화/시즌최종화 뱃지*/ /* span.badge_lastep{min-width:30px; height:16px; line-height:16px; color:#fff; background:#3ba4d7; border:1px solid #1f7fad; display:inline-block; text-align:center; border-radius:20px; font-size:11px; vertical-align:middle; padding:0 5px;} */ span.badge_lastep {min-width: 30px; height: 16px; line-height: 16px; color: #fff; background: #3ba4d7; border: 1px solid #1f7fad;display: inline-block; text-align: center; border-radius: 20px; font-size: 11px; vertical-align: middle; padding: 0 5px; margin-left: 2px;} .episode_subtitle span{display:inline-block; vertical-align:middle; margin-right:5px;} /*171227::회차리스트 무료충전,이용권지급,이용권보유 알림*/ span.eplist_event_ico_card{display:block !important; width:26px; height:20px; background:url(/assets/img/www/common/w_ico_allbuy_event_card.png) no-repeat center; float:left; margin:14px 5px 0 0;} span.eplist_event_ico_notice2{display:block !important; width:21px; height:23px; background:url(/assets/img/www/common/w_ico_allbuy_event_notice2.png) no-repeat center; float:left; margin:11px 5px 0 0;} span.eplist_event_ico_voucher{display:block !important; width:21px; height:17px; background:url(/assets/img/www/common/w_ico_allbuy_event_voucher.png) no-repeat center; float:left; margin:16px 5px 0 0;} span.eplist_event_ico_gift{display:block !important; width:19px; height:18px; background:url(/assets/img/www/common/w_ico_allbuy_event_gift.png) no-repeat center; float:left; margin:15px 5px 0 0;} /* .ep_mycoupon.voucher{width: 758px; border: 1px solid #d4cdae; padding: 0 15px; height: 48px; line-height: 48px; margin-bottom: 13px; background: #ebe8db;} */ .ep_mycoupon.voucher{width:738px; border: 1px solid #d4cdae; padding: 0 15px; height: 48px; line-height: 48px; margin:13px 0; background: #ebe8db;}/* 190214 수정 */ .ep_mycoupon .point{color:#e63740; font-weight:bold;} .ep_mycoupon .btn_free_charge{float:right; margin-top: 10px;} .ep_mycoupon .btn_free_charge > a{background:#8f95b4; color:#fff; padding: 0 18px; height: 28px; line-height: 26px; border-radius: 2px; display: block; font-weight:bold;} .ep_mycoupon .btn_voucher_receive{float:right; margin-top: 10px;} .ep_mycoupon .btn_voucher_receive > a{background:#e0bc24; color:#fff; padding: 0 18px; height: 28px; line-height: 26px; border-radius: 2px; display: block; font-weight:bold;} /* .ep_mycoupon.gift{width: 758px; border: 1px solid #aabbcc; padding: 0 15px; height: 48px; line-height: 48px; margin-bottom: 13px; background: #dbdeea;} */ .ep_mycoupon.gift{width:738px; border: 1px solid #aabbcc; padding: 0 15px; height: 48px; line-height: 48px; margin:11px 0; background: #dbdeea;}/* 190214 수정 */ .ep_mycoupon .btn_voucher_gift{float:right; margin-top: 10px;} .ep_mycoupon .btn_voucher_gift > a{background:#5b96d2; color:#fff; padding: 0 18px; height: 28px; line-height: 26px; border-radius: 2px; display: block; font-weight:bold;} /*171227::회차리스트 작품정보 수정*/ .episode_bnr .bnr_info p.synop2{font-size:12px; line-height:19px; margin-bottom:3px; overflow:hidden; text-overflow:ellipsis; display: -webkit-box; -webkit-line-clamp:5; -webkit-box-orient: vertical; word-break: break-all; word-wrap:break-word; max-height:100px; min-height:58px; color:#666; letter-spacing:-0.5px;} .episode_bnr .bnr_info .btn_area .btn_update{display:inline-block; height: 36px; line-height: 36px; text-align: center; cursor: pointer; float: left; width: 173px; border: 1px solid #000; padding: 0; color:#000; margin-right: 5px;} .episode_bnr .bnr_info .btn_area .btn_update.on{display:inline-block; height: 36px; line-height: 36px; text-align: center; cursor: pointer; float: left; width: 173px; border: 1px solid #009eae; padding: 0; color:#009eae; margin-right: 5px;} .episode_bnr .bnr_info .btn_area .btn_update img{width:15px; height:15px; margin-top:-2px; margin-right:2px;} .episode_bnr .bnr_info .btn_area .btn_continue{display:inline-block; height: 36px; line-height: 36px; text-align: center; cursor: pointer; float: left; width: 173px; border: 1px solid #e63640; padding: 0; color:#e63640;} .episode_bnr .bnr_info .btn_area #view_ep_first{display:inline-block; height: 36px; line-height: 36px; text-align: center; cursor: pointer; float: left; width: 173px; border: 1px solid #e63640; padding: 0; color:#e63640;} /* .episode_bnr .bnr_info .hashtag_renew17{overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; height: 25px; width: 100%; margin:8px 0 15px 0;} */ .episode_bnr .bnr_info .hashtag_renew17{overflow: hidden; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; height:50px; width: 100%; margin:8px 0 15px 0;} /*190214 수정*/ .episode_bnr .bnr_info .hashtag_renew17 .hashtag_list{padding:0; margin:0; overflow:hidden;} /* .episode_bnr .bnr_info .hashtag_renew17 .hashtag_list li{float:left; margin-right:2px; line-height: 24px;} */ .episode_bnr .bnr_info .hashtag_renew17 .hashtag_list li{float:left; margin-right:4px; line-height: 22px;} /*190214 수정*/ .episode_bnr .bnr_info .hashtag_renew17 .hashtag_list li a{background:#fff; color:#e63740; padding:2px 5px; border-radius:3px; cursor:pointer;} .episode_bnr .bnr_info p.comic_viewcount span{vertical-align: middle;} .episode_bnr .bnr_info p.comic_viewcount > img{width:10px; height:10px;} .episode_bnr .bnr_info p.comic_viewcount .member_score{font-weight:bold; letter-spacing:-0.3px;} .episode_bnr .bnr_info p.comic_viewcount .new_ep_scorebar{display:inline-block; width:1px; height:10px; margin:0 4px; background: #ccc;} .episode_bnr .bnr_info p.comic_viewcount .subscribe .number{color:#5b96d2; letter-spacing:-0.3px; vertical-align: baseline;} .episode_bnr .bnr_info p.comic_viewcount .comic_day{font-weight:bold;} .episode_bnr .bnr_info p.comic_viewcount .comic_day .point{border:1px solid #e63740; border-radius:50%; color:#e63740; width:17px; height:17px; line-height:15px; text-align:center; vertical-align:baseline; display:inline-block; padding-right:2px; box-sizing:border-box;} top_new_a /* 180110 탑메뉴 우측메뉴 아이콘추가 */ span.iconew.ico_charge{width:17px; height:17px; background:url(/assets/img/www/common/new18_ico_charge.png) no-repeat; vertical-align:middle; padding-top:5px; margin-right:3px;} span.iconew.ico_library{width:14px; height:15px; background:url(/assets/img/www/common/new18_ico_library.png) no-repeat; vertical-align:middle; padding-top:5px; margin-right:3px;} span.iconew.ico_search{width:16px; height:16px; background:url(/assets/img/www/common/new18_ico_search.png) no-repeat; vertical-align:middle; padding-top:5px; margin-right:2px;} span.iconew.ico_charge{width:17px; height:17px; background:url(/assets/img/www/common/new18_ico_charge.png) no-repeat; vertical-align:middle; padding-top:5px; margin-right:3px;} /*190708 충전소아이콘(아이스크림)*/ span.iconew.ico_icecream{width:17px; height:21px; background:url(/assets/img/www/common/new19_ico_icecream.png) no-repeat; vertical-align:middle; padding-top:5px; margin-right:3px;} /*190719 충전소아이콘(치킨)*/ span.iconew.ico_chicken{width:20px; height:20px; background:url(/assets/img/www/common/new20_ico_chicken.png) no-repeat; vertical-align:middle; padding-top:4px; margin-right:3px;} /*190830 충전소아이콘(커피&케이크)*/ span.iconew.ico_dessert{width:18px; height:25px; background:url(/assets/img/www/common/new20_ico_dessert.png) no-repeat; vertical-align:middle; padding-top:4px; margin-right:3px;} /*190926 충전소아이콘(탑툰상품권)*/ span.iconew.ico_giftcard{width:26px; height:17px; background: url(/assets/img/www/common/new20_ico_giftcard.png) no-repeat; vertical-align:middle; padding-top:4px; margin-right:3px;} .sub_body_re .sub_contents2 .sub_title2 .btn_edit{line-height: 12px; margin-left:5px;} .sub_body_re .sub_contents2 .sub_title2 .btn_edit > a{font-size:14px; font-weight:bold; color:#5b96cf;} .sub_list_hor.my_history li:first-child{padding-top:0;} .sub_list_hor.my_history li .tit_thumb_c{padding-top:11px;} .sub_list_hor.my_history li .tit_thumb_c span.comic_up{margin-left:0;} .sub_list_hor.my_history li .thumb_info_c span{vertical-align:bottom;} .sub_list_hor.my_history li .thumb_info_a {font-size: 12px; font-weight:normal;} .sub_list_hor.my_history li .thumb_info_d {color: #5b96cf; font-size: 12px; margin:4px 0 0; display: inline-block;} .sub_list_hor.my_history li .badge_myrecent{display:inline-block; margin-left:5px;} .sub_list_hor.my_history li .hash_tag18 {margin-top:15px;} .sub_list_hor.my_history li button.comic_next_re {display: inline-block; width:140px; text-align:center; font-size:12px; top:54px; position: absolute; right: 0; border: 1px solid #e63740; background: #ffffff; color: #e63740; letter-spacing: -0.5px; padding: 6px 15px; font-weight: bold;} .sub_list_hor.my_history .thumbbox .check_box {position: absolute; top: 2px; right: 2px; background: url(/assets/img/www/library/check_box_off2.png) no-repeat 0 center; display: inline-block; width:24px; height: 22px; background-size: 25px;} .sub_list_hor.my_history .thumbbox .check_box.active {position: absolute; top: 2px; right: 2px; background: url(/assets/img/www/library/check_box_on2.png) no-repeat 0 center; display: inline-block; width:24px; height: 22px; background-size: 25px;} .paging.ver02 {margin: 20px auto 0;} .paging.ver02 a.page_num.on {background: #5b96cf; color: #fff;} /* 토스트 메세지 스타일 - theRok - 2018-01-18 */ .toast {position: fixed; z-index: 100; max-width:90%; min-width:275px; border-radius:8px; padding:15px 10px; margin:0 auto; text-align:center; letter-spacing: -0.5px; bottom:-100%; right:13%;transform: translateX(50%);background:#5192f2; border:1px solid #3a7fe6; line-height:20px;} .toast { -webkit-transition: all 400ms cubic-bezier(0.250, 0.460, 0.450, 0.940); -moz-transition: all 400ms cubic-bezier(0.250, 0.460, 0.450, 0.940); -o-transition: all 400ms cubic-bezier(0.250, 0.460, 0.450, 0.940); transition: all 400ms cubic-bezier(0.250, 0.460, 0.450, 0.940); /* easeOutQuad */ -webkit-transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940); -moz-transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940); -o-transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940); transition-timing-function: cubic-bezier(0.250, 0.460, 0.450, 0.940); /* easeOutQuad */ } .toast.active {bottom:6%;} .toast .close_btn{position:absolute; right: -5px; top: -5px;} .toast .close_btn img{width:23px;} .toast .close_btn > a{display:block;} .toast .tit{font-size:16px; color:#fff; font-weight:600;} .toast .tit .point{color:#fffc00;} .toast .text{font-size:12px; color:#fff; font-weight:600;} .toast .text .point{color:#fffc00;} /* 토스트 신규 디자인 oringszero */ .floating_banner_m{z-index:100; display: inline-block; position:fixed; right:88px; bottom:10%; display:none;} .floating_banner_m .btn_close{position:absolute; top:30px; right:0; background:#fff; border-radius:50%; border:2px solid #aaa;} .floating_banner_m a{display:block} .toast_wm{z-index:100; width:230px; background: linear-gradient(270deg, #3dc2f3 0%, #2d9df7 99.94%); border:1px solid #2d9df7; border-radius:100px; padding:12px 10px 10px 10px; margin:0 auto; text-align:center; letter-spacing: -0.5px; box-shadow:3px 4px 2px -2px rgba(0,0,0,.2); position:fixed; right:5%; bottom:9%; display:none;} .toast_wm .btn_close{position:absolute; top:-5px; right:0; background:#fff; border-radius:50%; border:2px solid #39b8f4;} .toast_wm .tit{font-size:15px; font-weight:bold; margin-bottom:1px; color:#fff} .toast_wm .point{color:#fcff00} .toast_wm .text{font-size:12px; color:#fff; font-weight:normal} /* 180131 리스트타입 flex로 수정 */ .renewal17_toon li .thumb_info .tit_area {margin-bottom: 3px; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch;} .renewal17_toon li .thumb_info .tit_area .title {font-size: 16px; font-weight: 600; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: -1px; display: inline-block; margin-right: 0; vertical-align: middle; height: 20px; max-width: 100%;} .renewal17_toon li .webtoon_synopsis18{font-size: 11px; border-top: 1px solid #ddd; padding: 6px 14px; overflow: hidden; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch;} .renewal17_toon li .webtoon_synopsis18 > p{display:inline-block;} .renewal17_toon li .webtoon_synopsis18 .author18{color:#999999; float:left; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; flex: initial;} .renewal17_toon li .webtoon_synopsis18 .badge18{float: right; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch;} .renewal17_toon li .webtoon_synopsis18 .badge18 > span{margin-right:0; margin-left:3px;} /* 보너스 코인 표시 관련 수정 - theRok - 2018.02.19 */ .renewal17_header .my_assets ul.flexbox { display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: space-between; align-items: stretch; } .renewal17_header .my_assets ul.flexbox li { flex-grow: 1; flex-shrink: 1; flex-basis: 0; height: 44px; line-height: 44px; padding: 10px 0 0 0; text-align: center; border-right: 1px solid #4d5155; border-bottom: 1px solid #4d5155; } .renewal17_header .my_assets ul.flexbox li .tit{line-height: normal; text-align: center; color:#fff;} .renewal17_header .my_assets ul.flexbox li .num{line-height: normal; text-align: center; color:#ff6068; margin-top:2px;} /* 180503 연재리스트 변경(common_1.css 맨하단에 추가주세요) */ .renewal18_toon_list{width:100%;} .renewal18_toon{width:1200px; margin:0 auto;} .renewal18_toon ul{padding:0; margin: 0;} .renewal18_toon li {background-color: #fff; position: relative; margin-left:14px; margin-bottom:15px; width: 188px; float: left; border-radius: 10px; cursor: pointer; box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.1); transition: all 0.3s ease-in-out; height:375px;} .renewal18_toon li:hover {box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.3); border-radius:10px;} .renewal18_toon li:nth-of-type(6n+1) {margin-left:0 !important;} .renewal18_toon li .thumb_img_area {overflow: hidden; border-radius: 10px 10px 0 0;} .renewal18_toon li .thumb_img {width:100%; height: 280px; background-size: cover; background-position: center center; border-radius:0px;} .renewal18_toon li .thumb_img.comic_cell {background-color:#e1e1e1;overflow: hidden; transform: scale(1); -webkit-transform: scale(1); -moz-transform: scale(1); -ms-transform: scale(1); -o-transform: scale(1); transition: all 0.3s ease-in-out;} .renewal18_toon li .thumb_img.comic_cell:hover {border-radius:10px 10px 0px 0px; overflow:hidden; transform: scale(1.07); -webkit-transform: scale(1.07); -moz-transform: scale(1.07); -ms-transform: scale(1.07); -o-transform: scale(1.07);} .renewal18_toon li .adult {width:18px; height:18px; background: #f54a3d; color: #fff; font-weight: bold; font-family: arial, tahoma, sans-serif; position: absolute; top:6px; right:6px; border-radius: 20px; text-align: center; line-height:18px; letter-spacing: -1px; z-index:3; font-size:11px;} .renewal18_toon li .thumb_info {font-size: 12px; line-height: 16px; color:#666; padding:12px 14px; position: relative; background: #fff; text-overflow: ellipsis; white-space: nowrap; overflow: hidden;} .renewal18_toon li .thumb_info .tit_area {margin-bottom: 3px; display: flex; flex-direction: row; flex-wrap: nowrap; justify-content: flex-start; align-items: stretch;} .renewal18_toon li .thumb_info .tit_area .title {font-size: 15px; font-weight: 600; color: #000; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; letter-spacing: -1px; display: inline-block; margin-right: 0; vertical-align: middle; height: 20px;} .renewal18_toon li .thumb_info .tit_area > span {vertical-align:middle;} .renewal18_toon li .webtoon_synopsis18{ padding: 0 13px 12px;} .renewal18_toon li .webtoon_synopsis18 .badge18{height:18px; overflow:hidden;} .renewal18_toon li .webtoon_synopsis18 .badge18 > span{vertical-align: top; float: left; margin-right: 3px;} .renewal18_toon li .thumb_info .ep {overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 100%; height: 16px;} .renewal18_toon li .thumb_info .ep_count{width: 120px;} /* 독점, 기무뱃지 위치조정 */ span.renewal1711_txtbadge.area {z-index:10;} .thumb_img_area .renewal1711_txtbadge:nth-child(1) {bottom: 108px;} .thumb_img_area .renewal1711_txtbadge:nth-child(2) {bottom: 135px;} .thumb_img_area .renewal1711_txtbadge:nth-child(3) {bottom: 163px;} /* 180503 연재리스트 변경(common_1.css 맨하단에 추가주세요) */ #comic_item_list .tagUp {margin-left:3px; width: 20px; min-width:20px; height: 20px; margin-top: -2px;} #comic_item_list .tagDelayed {margin-left:3px; width: 20px; min-width:20px; height: 20px; margin-top: -2px;} #comic_item_list .tagCancelled {margin-left:3px; width: 20px; min-width:20px; height: 20px; margin-top: -2px;} /* 내서재 리스트 수정 */ .sub_list_hor.my_history{margin:40px auto 0;} .sub_list_hor.my_history li:last-child{border-bottom:none;} .sub_list_hor.my_history li button.btn_next{display: inline-block; width: 95px; text-align: left; font-size: 12px; top: 54px; position: absolute; right: 0; border: 1px solid #ddd; background:url(/assets/img/www/mypage/icon_next_myrecent.png) 73px center no-repeat #ffffff; color: #666; letter-spacing:-0.5px; padding: 6px 15px;} .sub_list_hor.my_history li button.btn_bookmark{display: inline-block; width:80px; text-align: left; font-size: 12px; top: 54px; position: absolute; right: 0; border: 1px solid #ddd; background:url(/assets/img/www/mypage/icon_bell_mybookmark.png) 45px center no-repeat #ffffff; color: #666; letter-spacing:-0.5px; padding: 6px 20px;} .sub_list_hor.my_history li button.btn_bookmark.active{display: inline-block; width:80px; text-align: left; font-size: 12px; top: 54px; position: absolute; right: 0; border: 1px solid #e53944; background:url(/assets/img/www/mypage/icon_bell_mybookmark_active.png) 45px center no-repeat #ffffff; color: #e53944; letter-spacing:-0.5px; padding: 6px 20px;} .sub_list_hor.my_history li .thumb_info_e{color:#929292; font-size:12px; margin:4px 0 0;} .sub_list_hor.my_history li .thumb_info_d.mt22{margin-top:22px;} .sub_list_hor.my_history li .ep_point.mt22{margin-top:22px;} .sub_list_hor.my_history li .ep_point span.epicon_starpoint{width:10px; height:10px; background:url(/assets/img/www/main/renewal1711_icon_star.png) no-repeat center; display:inline-block;} /* 내서재(탭메뉴) 위치수정 */ .sub_body_re .sub_contents2 .sub_title2 .tap_menu.r106{right:106px;} /* 내서재(검색&편집메뉴) 수정 */ .sub_body_re .sub_contents2 .look_edit_area{position:absolute; right:0; bottom:-1px;} .sub_body_re .sub_contents2 .look_edit_area .search_area{float:left; border:1px solid #5b96cf; background:#fff; height:42px; width:460px; position: relative; overflow: hidden; box-sizing:border-box;} .sub_body_re .sub_contents2 .look_edit_area .search_area > input{width:390px; display: inline-block; margin: 0 15px; font-size:14px; font-weight:normal; color:#000; border: transparent;} .sub_body_re .sub_contents2 .look_edit_area .search_area > input::-webkit-input-placeholder{color:#aaa;} .sub_body_re .sub_contents2 .look_edit_area .search_area > input::-ms-input-placeholder{color:#aaa;} .sub_body_re .sub_contents2 .look_edit_area .search_area .sch_del {background: url(/assets/img/mobile/common/icon_sch_close.png) no-repeat center center; width: 20px; height: 100%; background-size: 100%; vertical-align: middle;} .sub_body_re .sub_contents2 .look_edit_area .btn_search{display:inline-block; float:left; text-align: center; width: 52px; height:42px; padding-top:11px; box-sizing:border-box; background:#5b96cf; border-bottom: 1px solid #000;} .sub_body_re .sub_contents2 .look_edit_area .btn_edit{display:inline-block; float:left; text-align: center; width: 52px; height:42px; padding-top:14px; box-sizing:border-box; background:#959da1; border-bottom: 1px solid #000; color:#fff; margin-left:1px; font-size:14px;} /* 내서재(드롭메뉴) 수정 */ .drow_menu_ed .btn_area .btn_notice {background:#98a0a7;} .drow_menu_ed .btn_area .btn_notice .icon_notice {background:url(/assets/img/www/mypage/icon_drowmenu.png) no-repeat; background-position:0 0; width:18px; height:19px; display:inline-block; vertical-align: text-top; margin-right:3px;} .drow_menu_ed .btn_area .btn_interest {background:#5b96cf; color:#fff;} .drow_menu_ed .btn_area .btn_interest .icon_interest {background:url(/assets/img/www/mypage/icon_drowmenu.png) no-repeat; background-position:-19px 0; width:20px; height:19px; display:inline-block; vertical-align: text-top; margin-right:4px; margin-top: -1px;} .drow_menu_ed .btn_area .btn_delete {background:#e7383f;} .drow_menu_ed .btn_area .btn_delete .icon_delete {background:url(/assets/img/www/mypage/icon_drowmenu.png) no-repeat; background-position: -40px 0; width:16px; height:19px; display:inline-block; vertical-align: text-top; margin-right:4px; margin-top: -1px;} /* .alertLayerCss {left:50%; top:50%; transform:translate(-50%, -50%) scale(1.0, 1.0); -webkit-transform:translate(-50%, -50%) scale(1.0, 1.0); max-height:80%; overflow-y:auto; position:fixed; max-width:95%; border-radius:7px;} */ span.starpoint_txt {font-size: 12px; color: #000; margin-right: 7px; letter-spacing: initial;} span.renewal1711_icon_starpoint {width: 10px; height: 10px; background: url(/assets/img/www/main/renewal1711_icon_star.png) no-repeat center; margin-right:0;} span.renewal1711_txtbadge.new {width: 28px; height: 18px; background: url(/assets/img/www/main/txtbadge_new.png) no-repeat center;} .popular_comic_list li .new1711_rank_info p.title_area span.ranking_comic_tit_up{max-width:230px;} span.renewal1711_txtbadge.up { width: 26px; height: 16px; background: url(/assets/img/www/main/txtbadge_up.png) no-repeat center; } /*안내사항 및 다음버튼(공통)*/ .find_idpw .notice_area{text-align:center; color:#aaa; font-size:12px; line-height:19px; letter-spacing:-0.7px} .find_idpw .notice_area .txt{text-align:left} .find_idpw .notice_area .btn_confirm{display:inline-block; width:230px; height:48px; line-height:46px; background:#f43142; color:#fff; border:1px solid #f43142; position: relative; overflow: hidden; text-align:center; font-size:19px; letter-spacing:-0.4px; cursor:pointer; margin:20px auto 0;} .find_idpw .notice_area .btn_confirm > a{display:block; color:#fff} .find_idpw .notice_area .btn_confirm.ver_02{width:200px;} /*191022 추가*/ /*190214 추가*/ .episode_bnr.renew{width:1050px; height:340px; margin:0 auto; position:relative} .episode_bnr.renew .Topimg_area{height:340px; width:638px} .episode_bnr.renew .Topimg_area > img{height:340px; width:638px} .episode_bnr.renew .bnr_info{width:352px; height:340px; z-index:3; position:absolute; top:0; right:0; text-align:left;} .sub_type1.renew{width:1050px; margin:11px auto 0} /*190311 내가보던::단독일때*/ span.renewal1711_txtbadge.viewcomic30{width:47px; height:18px; background:url(/assets/img/www/common/txtbadge20_viewcomic.png) no-repeat center} span.renewal1711_txtbadge.viewcomic50{width:97px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic50.png) no-repeat center} span.renewal1711_txtbadge.viewcomic55{width:96px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic55.png) no-repeat center} span.renewal1711_txtbadge.viewcomic60{width:97px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic60.png) no-repeat center} span.renewal1711_txtbadge.viewcomic65{width:95px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic65.png) no-repeat center} span.renewal1711_txtbadge.viewcomic70{width:97px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic70.png) no-repeat center} span.renewal1711_txtbadge.viewcomic75{width:97px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic75.png) no-repeat center} span.renewal1711_txtbadge.viewcomic80{width:97px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic80.png) no-repeat center} span.renewal1711_txtbadge.viewcomic85{width:97px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic85.png) no-repeat center} span.renewal1711_txtbadge.viewcomic90{width:97px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic90.png) no-repeat center} span.renewal1711_txtbadge.viewcomic95{width:97px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic95.png) no-repeat center} span.renewal1711_txtbadge.viewcomic100{width:103px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic100.png) no-repeat center} /*190311 내가보던::이용권+내가보던*/ span.renewal1711_txtbadge.viewcomic50_v2{width:52px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic50_v2.png) no-repeat center} span.renewal1711_txtbadge.viewcomic55_v2{width:50px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic55_v2.png) no-repeat center} span.renewal1711_txtbadge.viewcomic60_v2{width:53px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic60_v2.png) no-repeat center} span.renewal1711_txtbadge.viewcomic65_v2{width:51px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic65_v2.png) no-repeat center} span.renewal1711_txtbadge.viewcomic70_v2{width:50px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic70_v2.png) no-repeat center} span.renewal1711_txtbadge.viewcomic75_v2{width:50px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic75_v2.png) no-repeat center} span.renewal1711_txtbadge.viewcomic80_v2{width:50px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic80_v2.png) no-repeat center} span.renewal1711_txtbadge.viewcomic85_v2{width:50px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic85_v2.png) no-repeat center} span.renewal1711_txtbadge.viewcomic90_v2{width:50px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic90_v2.png) no-repeat center} span.renewal1711_txtbadge.viewcomic95_v2{width:50px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic95_v2.png) no-repeat center} span.renewal1711_txtbadge.viewcomic100_v2{width:55px; height:18px; background:url(/assets/img/www/common/txtbadge19_viewcomic100_v2.png) no-repeat center} /* 190416 내서재::소장률 */ span.renewal1711_txtbadge.myrecent5{width:53px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent05.png) no-repeat center} span.renewal1711_txtbadge.myrecent10{width:58px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent10.png) no-repeat center} span.renewal1711_txtbadge.myrecent15{width:57px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent15.png) no-repeat center} span.renewal1711_txtbadge.myrecent20{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent20.png) no-repeat center} span.renewal1711_txtbadge.myrecent25{width:58px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent25.png) no-repeat center} span.renewal1711_txtbadge.myrecent30{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent30.png) no-repeat center} span.renewal1711_txtbadge.myrecent35{width:58px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent35.png) no-repeat center} span.renewal1711_txtbadge.myrecent40{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent40.png) no-repeat center} span.renewal1711_txtbadge.myrecent45{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent45.png) no-repeat center} span.renewal1711_txtbadge.myrecent50{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent50.png) no-repeat center} span.renewal1711_txtbadge.myrecent55{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent55.png) no-repeat center} span.renewal1711_txtbadge.myrecent60{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent60.png) no-repeat center} span.renewal1711_txtbadge.myrecent65{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent65.png) no-repeat center} span.renewal1711_txtbadge.myrecent70{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent70.png) no-repeat center} span.renewal1711_txtbadge.myrecent75{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent75.png) no-repeat center} span.renewal1711_txtbadge.myrecent80{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent80.png) no-repeat center} span.renewal1711_txtbadge.myrecent85{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent85.png) no-repeat center} span.renewal1711_txtbadge.myrecent90{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent90.png) no-repeat center} span.renewal1711_txtbadge.myrecent95{width:59px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent95.png) no-repeat center} span.renewal1711_txtbadge.myrecent100{width:63px; height:18px; background:url(/assets/img/www/common/txtbadge19_myrecent100.png) no-repeat center} /* 리본 개선 시작 */ span.renewal1711_txtbadge.weektop10{width:54px; height:34px; background:url(/assets/img/www/common/new19badge_weektop10_w.png) no-repeat center;} span.renewal1711_txtbadge.exclusive{width:54px; height:25px; background:url(/assets/img/www/common/new17badge_exclusive_w3.png) no-repeat center;} span.renewal1711_txtbadge.plusone1 {width:54px; height:33px; background:url(/assets/img/www/common/new17badge_exclusive_w1+1.png) no-repeat center;} span.renewal1711_txtbadge.plusone2 {width:54px; height:33px; background:url(/assets/img/www/common/new17badge_exclusive_w1+1.png) no-repeat center;} span.renewal1711_txtbadge.plusone3 {width:54px; height:33px; background:url(/assets/img/www/common/new17badge_exclusive_w1+1.png) no-repeat center;} span.renewal1711_txtbadge.discount_ribbon{width:54px; height:25px; background:url(/assets/img/www/common/new19badge_discount2_w.png) no-repeat center;} span.renewal1711_txtbadge.free_ribbon{width:54px; height:25px; background:url(/assets/img/www/common/new19badge_freefree_w.png) no-repeat center;} span.renewal1711_txtbadge.event_badge{width:54px; height:25px; background:url(/assets/img/www/common/new18badge_event3.png) no-repeat center;} span.renewal1711_txtbadge.waitfree{width:66px; height:25px; background:url(/assets/img/www/common/new19badge_waitfree01.png) no-repeat center;} span.renewal1711_txtbadge.bigfree{width:54px; height:34px; background: url(/assets/img/www/common/new20badge_bigfree_w.png) no-repeat center;} .jsRibbonWrap { position: absolute; bottom: 102px; left: -19px; display: flex; flex-direction: column-reverse; flex-wrap: wrap-reverse; align-items: start; } .jsRibbonWrap span + span { margin-bottom: 3px; } /* 리본 개선 끝 */ /* PC(common_1.css에 자유이용권 아이콘추가) */ .new_payment1709 .new_paylist .coin_ea p.icon_seasonpass {width:27px; height:18px; background: url(/assets/img/www/common/icon_seasonpass_w.png) no-repeat center; background-size:100%; float:left; margin-right:5px; margin-top:3px} /* 디버깅용 윈도우 */ .console-window { font-family: sans-serif; position: fixed; right: 48px;bottom: 48px;min-width: 240px;min-height: 120px;background-color: rgba(255,255,255,.99);z-index: 999;border: 1px solid #eee; padding: 16px; } .console-window-header { font-size: 16px; padding-bottom: 16px; border-bottom: 1px solid #ccc; margin-bottom: 16px; position: relative; } .console-window-header button { background-color: #999; padding: 6px; position: absolute; right: 0px; color: #fff; top: -6px; } .console-window-content { word-break: break-all; letter-spacing: 0px; line-height: 18px; font-size: 12px; max-height: 320px; overflow-y: auto; } .console-window .string { color: green; } .console-window .number { color: darkorange; } .console-window .boolean { color: blue; } .console-window .null { color: magenta; } .console-window .key { color: red; } /*치킨당첨 토스트*/ .toast_chicken{background:#fffced; border-radius:8px; border:2px solid #74530e; margin: 0 auto; text-align: center; overflow:hidden; letter-spacing:-0.5px; position:fixed; box-shadow: 3px 4px 2px -2px rgba(0,0,0,.2); bottom:45px; width:280px; left:50%; margin-left:-140px} .toast_chicken .bg_left{display:inline-block; position:absolute; bottom:0; left:0; background:url(/assets/img/event/chicken/bg_left_fire.png) no-repeat; width:30px; height:100px; background-size:30px; background-position:left bottom} .toast_chicken .bg_right{display:inline-block; position:absolute; bottom:0; right:0; background:url(/assets/img/event/chicken/bg_right_fire.png) no-repeat; width:30px; height:100px; background-size:30px; background-position:right bottom} .toast_chicken .btn_close{position:absolute; top:3px; right:3px} .toast_chicken .tit{margin-bottom:1px; background:#fff06f; height:40px; padding-top:10px; box-sizing:border-box} .toast_chicken .txt_area{padding:10px 15px} .toast_chicken .txt_area .txt{font-size:15px; color:#FF0606; font-weight:bold; line-height:21px}/*190605 수정*/ .toast_chicken .txt_area .txt .email{color:#000; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:80%; letter-spacing:-0.1px; display:inline-block; vertical-align:bottom} .toast_chicken .txt_area .txt .icon_social{width:19px; height:18px; background-image:url(/assets/img/event/chicken/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:0 0; display:inline-block; vertical-align:middle; margin-right:3px}/*190527 추가*/ .toast_chicken .txt_area .txt .icon_social.naver{background-image:url(/assets/img/event/chicken/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-18px 0}/*190527 추가*/ .toast_chicken .txt_area .txt .icon_social.kakao{background-image:url(/assets/img/event/chicken/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-38px 0}/*190527 추가*/ .toast_chicken .txt_area .txt .icon_social.facebook{background-image:url(/assets/img/event/chicken/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-56px 0}/*190527 추가*/ .toast_chicken .txt_area .txt .icon_social.google{background-image:url(/assets/img/event/chicken/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-75px 0}/*190527 추가*/ .toast_chicken .txt_area .txt .th{font-size:18px; color:#2624FB; text-overflow:ellipsis; white-space:nowrap; max-width:40%; letter-spacing:-0.1px; display:inline-block; vertical-align:baseline}/*190605 추가*/ /*아이스크림당첨 토스트*/ .toast_icecream{background:#fffced; border-radius:8px; border:2px solid #026594; margin: 0 auto; text-align: center; overflow:hidden; letter-spacing:-0.5px; position:fixed; box-shadow: 3px 4px 2px -2px rgba(0,0,0,.2); bottom:45px; width:280px; left:50%; margin-left:-140px} .toast_icecream .bg_left{display:inline-block; position:absolute; bottom:0; left:0; background:url(/assets/img/event/iceCream/bg_left_fire.png) no-repeat; width:30px; height:100px; background-size:30px; background-position:left bottom} .toast_icecream .bg_right{display:inline-block; position:absolute; bottom:0; right:0; background:url(/assets/img/event/iceCream/bg_right_fire.png) no-repeat; width:30px; height:100px; background-size:30px; background-position:right bottom} .toast_icecream .btn_close{position:absolute; top:3px; right:3px} .toast_icecream .tit{margin-bottom:1px; background:#fff06f; height:40px; padding-top:10px; box-sizing:border-box} .toast_icecream .txt_area{padding:10px 15px} .toast_icecream .txt_area .txt{font-size:15px; color:#FF0606; font-weight:bold; line-height:21px} .toast_icecream .txt_area .txt .email{color:#000; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:80%; letter-spacing:-0.1px; display:inline-block; vertical-align:bottom} .toast_icecream .txt_area .txt .icon_social{width:19px; height:18px; background-image:url(/assets/img/event/iceCream/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:0 0; display:inline-block; vertical-align:middle; margin-right:3px} .toast_icecream .txt_area .txt .icon_social.naver{background-image:url(/assets/img/event/iceCream/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-18px 0} .toast_icecream .txt_area .txt .icon_social.kakao{background-image:url(/assets/img/event/iceCream/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-38px 0} .toast_icecream .txt_area .txt .icon_social.facebook{background-image:url(/assets/img/event/iceCream/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-56px 0} .toast_icecream .txt_area .txt .icon_social.google{background-image:url(/assets/img/event/iceCream/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-75px 0} .toast_icecream .txt_area .txt .th{font-size:18px; color:#2624FB; text-overflow:ellipsis; white-space:nowrap; max-width:40%; letter-spacing:-0.1px; display:inline-block; vertical-align:baseline} /* 스타벅스 당첨 토스트 */ .toast_dessert{background:#fffced; border-radius:8px; border:2px solid #6c333a; margin: 0 auto; text-align: center; overflow:hidden; letter-spacing:-0.5px; position:fixed; box-shadow: 3px 4px 2px -2px rgba(0,0,0,.2); bottom:45px; width:280px; left:50%; margin-left:-140px} .toast_dessert .bg_left{display:inline-block; position:absolute; bottom:0; left:0; background:url(/assets/img/event/starbucks/bg_left_fire.png) no-repeat; width:30px; height:100px; background-size:30px; background-position:left bottom}/*190829 이미지변경*/ .toast_dessert .bg_right{display:inline-block; position:absolute; bottom:0; right:0; background:url(/assets/img/event/starbucks/bg_right_fire.png) no-repeat; width:30px; height:100px; background-size:30px; background-position:right bottom}/*190829 이미지변경*/ .toast_dessert .btn_close{position:absolute; top:3px; right:3px} .toast_dessert .tit{margin-bottom:1px; background:#fff06f; height:40px; padding-top:10px; box-sizing:border-box} .toast_dessert .txt_area{padding:10px 15px} .toast_dessert .txt_area .txt{font-size:15px; color:#FF0606; font-weight:bold; line-height:21px}/*190605 수정*/ .toast_dessert .txt_area .txt .email{color:#000; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:80%; letter-spacing:-0.1px; display:inline-block; vertical-align:bottom} .toast_dessert .txt_area .txt .icon_social{width:19px; height:18px; background-image:url(/assets/img/event/starbucks/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:0 0; display:inline-block; vertical-align:middle; margin-right:3px}/*190829 이미지변경*/ .toast_dessert .txt_area .txt .icon_social.naver{background-image:url(/assets/img/event/starbucks/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-18px 0}/*190829 이미지변경*/ .toast_dessert .txt_area .txt .icon_social.kakao{background-image:url(/assets/img/event/starbucks/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-38px 0}/*190829 이미지변경*/ .toast_dessert .txt_area .txt .icon_social.facebook{background-image:url(/assets/img/event/starbucks/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-56px 0}/*190829 이미지변경*/ .toast_dessert .txt_area .txt .icon_social.google{background-image:url(/assets/img/event/starbucks/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-75px 0}/*190829 이미지변경*/ .toast_dessert .txt_area .txt .th{font-size:18px; color:#2624FB; text-overflow:ellipsis; white-space:nowrap; max-width:40%; letter-spacing:-0.1px; display:inline-block; vertical-align:baseline}/*190829 이미지변경*/ /* 상품권 당첨 토스트 */ .toast_giftcard{background:#fffced; border-radius:8px; border:2px solid #1b3462; margin: 0 auto; text-align: center; overflow:hidden; letter-spacing:-0.5px; position:fixed; box-shadow: 3px 4px 2px -2px rgba(0,0,0,.2); bottom:45px; width:280px; left:50%; margin-left:-140px}/*190926 수정*/ .toast_giftcard .bg_left{display:inline-block; position:absolute; bottom:0; left:0; background:url(/assets/img/event/giftcard/bg_left_fire.png) no-repeat; width:30px; height:100px; background-size:30px; background-position:left bottom}/*190926 이미지변경*/ .toast_giftcard .bg_right{display:inline-block; position:absolute; bottom:0; right:0; background:url(/assets/img/event/giftcard/bg_right_fire.png) no-repeat; width:30px; height:100px; background-size:30px; background-position:right bottom}/*190926 이미지변경*/ .toast_giftcard .btn_close{position:absolute; top:3px; right:3px} .toast_giftcard .tit{margin-bottom:1px; background:#fff06f; height:40px; padding-top:10px; box-sizing:border-box} .toast_giftcard .txt_area{padding:10px 15px} .toast_giftcard .txt_area .txt{font-size:15px; color:#FF0606; font-weight:bold; line-height:21px} .toast_giftcard .txt_area .txt .email{color:#000; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:80%; letter-spacing:-0.1px; display:inline-block; vertical-align:bottom} .toast_giftcard .txt_area .txt .icon_social{width:19px; height:18px; background-image:url(/assets/img/event/giftcard/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:0 0; display:inline-block; vertical-align:middle; margin-right:3px} .toast_giftcard .txt_area .txt .icon_social.naver{background-image:url(/assets/img/event/giftcard/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-18px 0} .toast_giftcard .txt_area .txt .icon_social.kakao{background-image:url(/assets/img/event/giftcard/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-38px 0} .toast_giftcard .txt_area .txt .icon_social.facebook{background-image:url(/assets/img/event/giftcard/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-56px 0} .toast_giftcard .txt_area .txt .icon_social.google{background-image:url(/assets/img/event/giftcard/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-75px 0} .toast_giftcard .txt_area .txt .th{font-size:18px; color:#2624FB; text-overflow:ellipsis; white-space:nowrap; max-width:40%; letter-spacing:-0.1px; display:inline-block; vertical-align:baseline} /* 20200331치킨당첨 토스트 */ .chicken_toast20{background:#fffced; border-radius:8px; border:2px solid #23519f; margin: 0 auto; text-align:center; overflow:hidden; letter-spacing:-0.5px; position:fixed; box-shadow: 3px 4px 2px -2px rgba(0,0,0,.2); bottom:45px; width:280px; left:50%; margin-left:-140px; box-sizing: border-box;} .chicken_toast20 .toast_wp{position:relative} .chicken_toast20 .toast_wp .btn_close{position:absolute; right:1px; top:2px; color:transparent; z-index:2; cursor:pointer} .chicken_toast20 .toast_wp .btn_close > span{display:inline-block; width:20px; height:20px; position:relative; margin:8px} .chicken_toast20 .toast_wp .btn_close > span:before{content:""; position:absolute; left:50%; top:0; width:1px; height:100%; background:#23519f; transform:rotate(45deg);} .chicken_toast20 .toast_wp .btn_close > span:after{content:""; position:absolute; right:45%; top:0; width:1px; height:100%; background:#23519f; transform:rotate(-45deg);} .chicken_toast20 .toast_wp .bg_left{display:inline-block; position:absolute; bottom:0; left:0; background:url(/assets/img/responsive/event/chickenEvent/toast/bg_left_fire.png) no-repeat; width:30px; height:100px; background-size:30px; background-position:left bottom} .chicken_toast20 .toast_wp .bg_right{display:inline-block; position:absolute; bottom:0; right:0; background:url(/assets/img/responsive/event/chickenEvent/toast/bg_right_fire.png) no-repeat; width:30px; height:100px; background-size:30px; background-position:right bottom} .chicken_toast20 .toast_wp .img_tt{font-size:16px; font-weight:600; margin-bottom:1px; background:#fff06f; height:40px; padding-top:10px; box-sizing:border-box} .chicken_toast20 .toast_wp .img_tt > img{height:20px; margin:0 auto;} .chicken_toast20 .toast_wp .win_tt{padding:10px 15px} .chicken_toast20 .toast_wp .win_tt .tt{font-size:15px; color:#FF0606; font-weight:bold; line-height:21px;} .chicken_toast20 .toast_wp .win_tt .tt .email{color:#000; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; max-width:80%; letter-spacing:-0.1px; display:inline-block; vertical-align:bottom} .chicken_toast20 .toast_wp .win_tt .tt .icon_social{width:19px; height:18px; background-image:url(/assets/img/responsive/event/chickenEvent/toast/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:0 0; display:inline-block; vertical-align:middle; margin-right:3px} .chicken_toast20 .toast_wp .win_tt .tt .icon_social.naver{background-image:url(/assets/img/responsive/event/chickenEvent/toast/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-18px 0} .chicken_toast20 .toast_wp .win_tt .tt .icon_social.kakao{background-image:url(/assets/img/responsive/event/chickenEvent/toast/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-38px 0} .chicken_toast20 .toast_wp .win_tt .tt .icon_social.facebook{background-image:url(/assets/img/responsive/event/chickenEvent/toast/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-56px 0} .chicken_toast20 .toast_wp .win_tt .tt .icon_social.google{background-image:url(/assets/img/responsive/event/chickenEvent/toast/icon_social.png); background-repeat:no-repeat; background-size:230px 50px; background-position:-75px 0} .chicken_toast20 .toast_wp .win_tt .tt .th{font-size:18px; color:#2624FB; text-overflow:ellipsis; white-space:nowrap; max-width:40%; letter-spacing:-0.1px; display:inline-block; vertical-align:baseline}