@charset "utf-8";

/* 메인 컨텐μΈ? */
.main_box {margin-bottom:32px; border:1px solid #d4d4d4; border-bottom:none}
.main_box .row {overflow:hidden}
.main_box .col {position:relative; float:left; width:264px; height:184px; padding:22px; border-left:1px solid #d4d4d4; border-bottom:1px solid #d4d4d4}
.main_box .col:first-child {border-left:0px solid #d4d4d4}
.main_box .col.wide {width:336px}
.main_box .col.high {height:228px}
.main_box .col.middle {height:193px}
.main_box .col.middle2 {height:202px}
.main_box .col.low {height:172px}
.main_box .col.no_pd {width:308px; padding:0}
.main_box .col.wide.no_pd {width:380px; padding:0}
.main_box .col h3 {margin-bottom:21px; font-size:18px; font-weight:bold;}
.main_box .btn_more {position:absolute; top:28px; right:22px}
.tab {overflow:hidden;}
.tab li {float:left; width:65px; height:24px; margin-left:1px}
.tab li:first-child {margin-left:0;}
.tab a {display:block; width:100%; height:100%; line-height:24px; text-align:center; background:#b1bec5; color:#fff}
.tab li.on a {background:#2185ba}
.tab.wide li {width:111px}
.tab.middle li {width:87px}
.main_tab {overflow:hidden; margin-bottom:20px}
.main_tab li {float:left; font-size:15px; padding:0 6px; border-left:1px solid #d3d3d3; font-weight:normal}
.main_tab li:first-child {padding:0 8px 0 0; border-left:none}
.main_tab li a { color:#a0a0a0}
.main_tab li.on a {color:#343434; font-style:normal;}

/* 2019-09-02μΆ”κ?? */
.main_box .col.reporter{width:645px;height:420px;}
.reporter .tab li{width:106.5px;}
.reporter .reporter_box{width:100%;float:left;margin:26px 0;}
/* .reporter .reporter_box ul{width:100%;} */
.reporter .reporter_box ul li{position:relative;float:left;width:205px;height: 147px;background: pink;overflow: hidden;margin-right: 14px;margin-bottom: 14px;}
.reporter .reporter_box ul li:nth-child(3), .reporter .reporter_box ul li:nth-child(6){margin-right:0;}
.reporter .reporter_box ul li a {display: block; width: 100%; height: 100%;color:#fff;}
.reporter .reporter_box ul li a > img{width:100%;height:100%;}
.reporter .reporter_box ul li a .re_box_shadow{display:inline-block;width:100%;height:100%;position: absolute;top:0;left:0;
/* Permalink - use to edit and share this gradient: https://colorzilla.com/gradient-editor/#000000+0,000000+100&0+42,0.65+100 */
background: -moz-linear-gradient(top,  rgba(0,0,0,0) 0%, rgba(0,0,0,0) 42%, rgba(0,0,0,0.65) 100%); /* FF3.6-15 */
background: -webkit-linear-gradient(top,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 42%,rgba(0,0,0,0.65) 100%); /* Chrome10-25,Safari5.1-6 */
background: linear-gradient(to bottom,  rgba(0,0,0,0) 0%,rgba(0,0,0,0) 42%,rgba(0,0,0,0.65) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#a6000000',GradientType=0 ); /* IE6-9 */
}
.reporter .reporter_box ul li > p{color:#fff;font-size:16px;line-height:1.5;position: absolute;bottom:10px;left:10px;word-break: keep-all;}
.reporter .reporter_box ul li .hover_box{color:#fff; background: rgba(0,0,0,.5);line-height:1.5; position: absolute; bottom:-85px; left:0; height:70px; width:191px; padding:7px; transition: all .5s; -webkit-transition: all .5s; -moz-transition: all .5s; -ms-transition: all .5s; -o-transition: all .5s; }
.reporter .reporter_box ul li .hover_box .rep_name{width:140px;font-weight:bold;float:left;font-size:13px;}
.reporter .reporter_box ul li .hover_box .rep_rink{width:50px;font-size:10px;float:left;padding-top:3px;}
.reporter .reporter_box ul li .hover_box .rep_rink a{color:#fff;}
.reporter .reporter_box ul li .hover_box .rep_text{width:190px;float:left;height:3.6em;max-height:3.6em;line-height:1.8em;margin-top:5px;overflow:hidden;text-overflow: ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient: vertical;}
/* .reporter .reporter_box ul li .hover_box .rep_text{width:190px;float:left;height:3.6em;max-height:3.6em;line-height:1.8em;margin-top:5px;overflow:hidden;} */
/* .reporter .reporter_box ul li .hover_box .rep_text::after{content:"???>>";background:#000;color:#fff;position: absolute;right:6px;bottom:11px;} */

.main_box .col.mento{height:420px;}
.main_box .col.mento strong{font-size:12px;color:#797878;margin:-10px 0 0;display:block}
.main_box .col.mento .paging{text-align: right;bottom:395px;width:92%;}
.main_box .col.mento .rolling_br_con{float:left;width:262px;height:361px;border:1px solid #e3e3e3;margin-top:20px;}
.main_box .col.mento .rolling_br_con img{width:100%;}
.main_box .col.mento .rolling_br_con div{display:none;}
.main_box .col.mento .rolling_br_con div:first-child{display:block;}
.main_box .col.mento .rolling_br_con table{width:100%;height:180px;padding:14px;font-size:14px;}
.main_box .col.mento .rolling_br_con table:first-child{border-bottom:1px solid #e3e3e3;}
.main_box .col.mento .rolling_br_con table tr:nth-child(3){text-align:right;}
.main_box .col.mento .rolling_br_con table tr td:nth-child(1){width:36px;}
.main_box .col.mento .rolling_br_con table tr td:nth-child(2){font-weight:bold;text-indent:10px;}
.main_box .col.mento .rolling_br_con table tr td:nth-child(3){width:41px;}
.main_box .col.mento .rolling_br_con table .mento_list{background:#f3f3f3;width:204px;height:45px;padding:15px;}
.main_box .col.mento .rolling_br_con table .mento_list li{height:22px;line-height:22px;text-overflow: ellipsis;white-space: nowrap;overflow: hidden;}

.main_box .btn_more_hacdelegate {position: absolute;  top: 28px;  right: 22px;}
.main_box .btn_more_text {position:absolute; bottom:23px; right:22px}

/* ?œ ?•™?‹œ?—˜ ?•™?Š΅?žλ£? */
.study_box {margin-top:10px}
.study_box ul {overflow:hidden;margin-left:-3px}
.study_box li {float:left; width:84px; height:74px; margin:0 0 3px 3px; border:1px solid #e3e3e3; text-align:center; background:url("https://image.gohackers.com/uhak/gohackers/package_ico.png") no-repeat -12px -29px}
.study_box li a {display:block; height:31px; padding-top:43px; font-style:normal; letter-spacing:-1px}
.study_box li.net {background-position:-12px -130px}
.study_box li.writing {background-position:-7px -230px}
.study_box li.free_board {background-position:-12px -330px}
.study_box li.ground {background-position:-12px -430px}
.study_box li.speaking {background-position:-8px -530px}
.study_box li.note {background-position:-248px -231px}
.study_box li.listen {background-position:-14px -729px}
.study_box li.sum {background-position:-7px -631px}
.study_box li.key {background-position:-250px -327px}
.study_box li.eng {background-position:-252px -27px}
.study_box li.usa {background-position:-252px -132px}
.study_box li.shadow {background-position:-254px -429px}
.study_box li.doctor {background-position:-247px -530px}
.study_box li.voca {background-position:-255px -629px}
.study_box li.sat {background-position:-250px -729px}
.study_box li:hover, .study_box li.on {width:82px; height:72px; border:2px solid #2185ba}
.study_box li:hover a, .study_box li.on a {padding-top:42px; color:#2185ba}
.study_box li.edit:hover, .study_box li.edit:focus, .study_box li.edit.on {background-position:-113px -30px}
.study_box li.net:hover, .study_box li.net:focus, .study_box li.net.on {background-position:-113px -131px}
.study_box li.writing:hover, .study_box li.writing:focus, .study_box li.writing.on {background-position:-108px -231px}
.study_box li.free_board:hover, .study_box li.free_board:focus, .study_box li.free_board.on {background-position:-113px -331px}
.study_box li.ground:hover, .study_box li.net:focus, .study_box li.net.on {background-position:-113px -431px}
.study_box li.speaking:hover, .study_box li.net:focus, .study_box li.net.on {background-position:-109px -531px}
.study_box li.note:hover, .study_box li.note.on {background-position:-349px -232px}
.study_box li.listen:hover, .study_box li.listen.on {background-position:-115px -730px}
.study_box li.sum:hover, .study_box li.sum.on {background-position:-108px -632px}
.study_box li.key:hover, .study_box li.key.on {background-position:-351px -328px}
.study_box li.eng:hover, .study_box li.eng.on {background-position:-353px -28px}
.study_box li.usa:hover, .study_box li.usa.on {background-position:-353px -133px}
.study_box li.shadow:hover, .study_box li.shadow.on {background-position:-355px -430px}
.study_box li.doctor:hover, .study_box li.doctor.on {background-position:-348px -531px}
.study_box li.voca:hover, .study_box li.voca.on {background-position:-356px -630px}
.study_box li.sat:hover, .study_box li.sat.on {background-position:-351px -730px}

/* ?…Œ?΄λΈ? */
.main_board {width:98%; margin-top:15px}
.main_board .date {width:77px; text-align:right}
.main_board td {height:30px}
.main_board td a {display:inline-block; width:255px; height:17px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; line-height:17px}
.main_board td a:hover {color:#000;}
.main_board td .new {margin-left:5px}
.main_board td.date {color:#a2a2a2} 

/* 무료?œ ?•™ μ€?λΉ„μžλ£? */
.main_box .col.bestseller h3 {margin-bottom:46px;}
.bestseller strong, .best_books strong {display:block; color:#797878; margin:-10px 0 15px}
.bestseller div {position:relative; width:131px; height:124px; padding-left:136px; background:url("//image.gohackers.com/img/main/package_free.png") no-repeat -40px -40px}
.bestseller div ul{position: absolute;top:-20px;}
.bestseller li {width:129px; height:25px; margin-bottom:5px; border:1px solid #a5a5a5; text-align:center; line-height:25px}
.bestseller li a {display:block; width:100%; height:100%; font-style:normal;}
.bestseller li.on {width:127px; height:23px; border:2px solid #2185ba; line-height:23px}
.bestseller li.on a {color:#2185ba}

/* best κ²Œμ‹œκΈ? */
.best_article .rolling_br_con p {float:left; width:150px; margin-right:15px; text-align:center}
.best_article .rolling_br_con p span {display:block; margin-top:9px}
.best_article ul {float:left}
.best_article li {line-height:28px}
.best_article li a {display:block; width:150px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.best_article li a:hover {color:#000;}
.best_article .paging{width:80%;left:60px;}

/* 곡λ??? „?ž΅ ?˜?ƒ */
/*.video div {margin-top:-7px}
.video li {height:40px; padding-left:50px; border-top:1px solid #e9e9e9; background:url("https://gscdn.hackers.co.kr/uhak/gohackers/package_lang.png") no-repeat -40px -32px; line-height:40px; font-weight:normal; font-family:'Nanum Gothic bold'; font-size:14px}
.video li:first-child {border-top:none}
.video li.toefl {background-position:-40px -32px;}
.video li.ielts {background-position:-40px -83px;}
.video li.gre {background-position:-40px -132px;}
.video li.sat {background-position:-40px -182px;}
.video li em {color:#2185ba}*/

/* 2016-12-19 곡λ??? „?ž΅ ?˜?ƒλΆ?λΆ„λ??κ²? */
.ml10{margin-left:10px;}
.mt10{margin-top:10px;}
.re_video .video_left{width:50%; text-align:center; float:left;}
.video_left ul{overflow:hidden;}
.video_left ul li{width:60px; height:33px; float:left; margin-top:10px;}
.video_left ul li a{display:block; background:url('https://image.gohackers.com/uhak/gohackers/main/btn_type.png') no-repeat 0 0; width:100%; height:100%;}
.video_left ul li a.video_btn1{background-position:0 0;}
.video_left ul li a.video_btn2{background-position:-60px 0;}
.video_left ul li a.video_btn3{background-position: 0 -33px;}
.video_left ul li a.video_btn4{background-position:-60px -33px;}
.video_left ul li a.video_btn5{background-position:0 -66px;}
.video_left ul li a.video_btn6{background-position:-60px -66px;}
.re_video .video_left span{font-size:13px; letter-spacing:-1px; color:#2185ba;}
.re_video .video_right{width:50%; text-align:center; float:right;}
.re_video .video_right span{font-size:13px; letter-spacing:-1px; color:#2185ba;}

/* ?•΄μ»€μŠ€ μ²΄ν—˜κΈ? */
.alum {padding-top:2px;}
.alum ul {overflow:hidden; margin-bottom:10px}
.alum li {float:left; margin-left:2px}
.alum li:first-child {margin-left:0}
.alum span {display:block; margin-bottom:5px; color:#e20000; font-size:13px}
.alum em {display:block; color:#595959; font-size:13px}

/* 무료 ?˜?–΄ 컨텐μΈ? */
.free_eng table{width:100%;display:none;}
.free_eng table td{padding:3px;}
.free_eng table td a{display:table-cell;width:132px;height:60px;vertical-align:middle;border:1px solid #e3e3e3;text-align:center;font-size:13px;line-height:16px;font-weight:normal;}
.free_eng table td a span{}
.free_eng table td a:hover,.free_eng table td a.on{width:130px;height:58px;color:#2185ba;border:2px solid #2185ba}
.free_eng table.on{display:block;}

.paging {position:absolute; width:100%; text-align:center; left:0; bottom:20px}
.paging a {display:inline-block; width:9px; height:9px; margin:0 1px; background:#dddcdb}
.paging a.on {background:#2185ba}
.paging a span {position:absolute; z-index:-1; visibility:hidden}

/* with ?•΄μ»€μŠ€ */
.anounce {overflow:hidden; margin-bottom:20px; width:264px; height:80px}
.anounce li {float:left; width:83px; height:78px; margin-left:4px; border:1px solid #e3e3e3; text-align:center}
.anounce li:first-child {margin-left:0}
/*.anounce ul.anounce_wrap {width:530px; border:0; margin-left:-267px}*/
.anounce a {display:block; width:100%; height:100%; line-height:15px}
.anounce i {font-style:normal}
.anounce strong {display:block; padding:10px 0 10px;letter-spacing:-1.5px;}
.anounce span {display:block; width:71px; height:19px; margin:0 auto;  line-height:19px; color:#fff}
.philosophy {width:201px; padding-left:62px; background:url("https://image.gohackers.com/uhak/gohackers/ico_hackers.png") no-repeat left}
.philosophy ul {overflow:hidden; margin-left:-7px}
.philosophy li {float:left; width:95px; height:20px; margin:0 0 7px 7px; border:1px solid #a5a5a5; text-align:center; line-height:20px}
.philosophy a {display:block; width:100%; height:100%; font-weight:normal; }
.box_red {background:#C20001}
.box_yellow {background:#b99a3f}
.box_orange {background:#e07c0c}
.box_gray {background:#7d7d7d}
.box_purple {background:#645279}
.box_green {background:#2e7ea8}
.box_green2{background-color:#01ae52;}
.box_blue{background-color:#308eff}
.txt_red {color:#C20001}
.txt_yellow {color:#b99a3f}
.txt_orange {color:#e07c0c}


.with_area .paging{text-align:right;bottom:198px;width:92%;}

/* 베슀?ŠΈ????Ÿ¬ ꡐ재 ?žλ£? */
.best_books div {padding-left:100px; background:url("https://upload.gohackers.com/srv/images/main/bg_head.png?w=74") no-repeat 6px;}
.best_books li {padding-left:8px; line-height:23px; font-weight:normal; background:url("//image.gohackers.com/images/common/bul_black.png") no-repeat left}
.best_books li:hover {background:url("//image.gohackers.com/images/common/bul_blue.png") no-repeat left}
.best_books li a:hover, .best_books.on li a {color:#2185ba; text-decoration:underline}
.best_books strong {margin:-10px 0 26px}

/* ?˜€?Š˜?˜ ?šŒ?™” ?•œλ§ˆλ”” */
.today_say strong {display:block; margin-bottom:5px; font-size:13px; font-weight:normal; line-height:18px;}
.today_say strong em {color:#2185ba}
.today_say p {width:232px; height:48px; padding:22px 16px 0; background:url("https://image.gohackers.com/uhak/gohackers/bg_say.png") no-repeat; color:#2185ba; line-height:18px; font-size:13px;}
 
/* ?•΄μ»€μŠ€ ?›”?“œ */
.world_view {margin-top:12px}
.world_view li {float:left; width:110px; margin-left:3px; text-align:center}
.world_view li:first-child {margin-left:0}
.world_view li span {display:block; margin-top:10px}
.world_view li a:hover {color:#000;}
.world_view.wide li {width:130px}

/* ?œ ?•™?ƒ?™œ ?•„?ˆ˜? •λ³? */
.col.flash {position:relative; width:308px; padding:0}
.col.flash h3 {margin-bottom:24px; padding:22px 0 0 22px}
.col.flash table {width:100%}
.chg_tab {position:absolute; left:0; bottom:0; width:100%; height:27px; padding-top:11px; background:#e0e5e8}
.chg_tab li {float:left; width:76px; text-align:center; border-left:1px solid #d1d8dc}
.chg_tab li:first-child {border-left:0}
.chg_tab span {display:inline-block; width:16px; height:16px; margin-right:2px; background:#b7c3ca; font-weight:bold; color:#fff; line-height:16px}
.chg_tab a {display:inline-block; width:100%; line-height:16px; color:#595959; font-weight:normal;}
.chg_tab a:hover span, .chg_tab li.on span {background:#2185ba}
.chg_tab a:hover, .chg_tab li.on a {color:#2185ba}
.meta_info {width:100%; height:21px; padding-top:7px; border-top:1px solid #e3e3e3}
.meta_info ul {float:left; margin-left:22px}
.meta_info li {float:left; padding:0 6px; border-left:1px solid #e3e3e3; font-weight:normal;}
.meta_info li:first-child {padding:0 6px 0 0; border-left:none}
.meta_info li.on a {color:#2185ba}
.meta_info span {float:right; margin-right:7px; font-size:11px}
.meta_info.type2 ul, .meta_info.type3 ul {margin:0;}
.meta_info.type2 li {padding:0 65px}
.meta_info.type3 li {width:29%; text-align:center}
.meta_info.type3 ul {width:100%}
.unit_board {width:100%; border-top:2px solid #2185ba}
.unit_board thead th {height:25px; border-bottom:1px solid #e3e3e3}
.unit_board tbody td, .unit_board tbody th {height:23px; border-bottom:1px solid #e3e3e3}
.unit_board tbody th.bdl {border-left:1px solid #e3e3e3}
.unit_board tbody th.bg_gray {background:#f6f7f8}
.unit_board tbody td {border-left:1px solid #e3e3e3; text-align:center}
.unit_board tbody td.bdn {border-left:none}
.unit_board tbody tr.high td {height:72px}
.unit_board tbody tr.high input {width:129px; height:23px}

/* κ΅?κ°?λ³? ?œ ?•™? •λ³? */
.tit_contry {position:absolute; top:22px; left:22px}

/* 2014-10-28 ?΄?˜œ?› μΆ”κ?? ?œ ?•™?ƒ?™œ?•„?ˆ˜? •λ³?// ?‹œκ³? */
.worldtime {width:100%;border-top:1px solid #e3e3e3}
/* .worldtime *{font-family:'Nanum Gothic bold'} */
.worldtime .time_tit{display:block;padding:15px 0 0 14px}
.worldtime th:first-child,.worldtime td:first-child{border-right:1px solid #e3e3e3}
.worldtime .timer{font-size:37px;text-align:center;letter-spacing:-2px;font-weight:bold;padding:18px 0}
.worldtime .date_zone{border-top:1px solid #e3e3e3;border-bottom:1px solid #e3e3e3;overflow:hidden;padding:7px 15px 8px}
.worldtime .date_zone * {line-height:1}
.worldtime .date_zone .f_l{float:left;color:#2185ba}
.worldtime .date_zone .f_r{float:right;color:#848484}

/* ?œ ?•™?ƒ?™œ?•„?ˆ˜? •λ³? 곡톡 */
.p_r{position:relative}
/*.time_tit span{vertical-align:middle;display:inline-block;*display:inline;*zoom:1;padding-left:7px;width:9px;height:6px;background:url("../../images/main/ico_time_tit.png") no-repeat right 0}
.time_tit.ov span{background-position:right -6px}*/
.small_layer{text-align:left;display:none;background:#fff;position:absolute;left:0;top:31px;border:1px solid #82868d;width:144px;height:85px;padding:4px 4px 3px}
.small_layer.type2 {left:155px}
.small_layer.type3 {top:0; width:298px; height:62px}
.small_layer.type3 .small_layer_list {height:50px}
.small_layer.type3 .small_layer_list li a {display:inline-block; float:left; width:47%;margin-left:1px}
.small_layer_tit{padding:0 5px 3px;display:block}
.small_layer_list{height:68px;overflow-x:hidden;overflow-y:auto}
.small_layer_list li{padding-top:1px}
.small_layer_list li:fisit-child{padding-top:0}
.small_layer_list li a{font-size:11px;padding:2px;font-family:'Nanum Gothic';color:#8994a3;display:block;width:90%}
.small_layer_list li a:hover,.small_layer_list li.on a{background:#ccccff;color:#6d76b5}
.small_layer_close{position:absolute;right:7px;top:5px}

/* ?œ ?•™?ƒ?™œ ?•„?ˆ˜? •λ³? ?‚¬?΄μ¦? */
.size_area {text-align:center}
.size_area * {display:inline-block; vertical-align:middle}
.size_area button {width:9px; height:11px; margin-right:10px; border:0; background:url("//image.gohackers.com/images/main/btn_left_arrow.png") no-repeat}
.size_area button.btn_size_next {margin:0 0 0 10px;background:url("//image.gohackers.com/images/main/btn_right_arrow.png") no-repeat}
.size_tit span {vertical-align:middle;display:inline-block;*display:inline;*zoom:1;padding-left:7px;width:9px;height:6px;background:url("//image.gohackers.com/images/main/btn_down_arrow.png") no-repeat right -1px}

/* 메인 ?™?˜?ƒ */
#main_video {position:absolute; top:524px; left:50%; width:398px; height:234px; margin-left:201px; background:silver; }

/* 메인 ?†Œλ°°λ„ˆ */
#small_bn {position:absolute; z-index:110; top:606px; left:50%; width:260px; height:90px; margin-left:-500px; text-align:right}
#small_bn a {display:block; width:100%; height:100%;}