@charset "utf-8"; /* table - common */
[class^='tbl'] { width:100%; table-layout:fixed; margin-bottom: 40px; } 
[class^='tbl'] th { background-color:#f5f5f5 } 
[class^='tbl'] th,
[class^='tbl'] td { border-bottom:1px solid #e7e7e7 } 
[class^='tbl'] td { line-height:22px } 
/* 일반테이블유형 */
[class^='tbl-col'] td { padding:14px 20px } 
[class^='tbl-row'] th { padding:14px 0 } 
[class^='tbl-row'] td { padding:14px 0 14px 28px } 
/* 강의리스트타입 */
[class^='tbl'] td.sbj { padding-right:15px; text-align:left } 
[class^='tbl'] td.sbj a:hover { text-decoration:underline } 
[class^='tbl'] .tit { display:block; color:#333; font-size:18px } 
.tbl-row-c td { padding:20px 0; text-align:center } 
.tbl-row-c [class^='btn'] { min-width:auto } 
.d_block { display: block; } 
.hide { display: none; } 

.sub_txt { font-size: 0.85em; color:#f00; line-height: 1.5; } 
.pos-r { position: relative; } 
/* order */
.tbl-col .input-area { padding:20px; background-color:#f5f5f5 } 
.tbl-col .input-chk-box { padding-top:20px; margin-top:20px; border-top:1px solid #e7e7e7 } 
.tbl-col .input-chk-box2 { margin-top:5px } 
.tbl-col ol li { line-height:1.6; } 
.tbl-col ol li strong { font-size:16px; font-weight:bold; text-decoration:underline; } 

/* table - bbs */
.tbl-bbs th { padding:13px 0 } 
.tbl-bbs td { text-align:center } 
.tbl-bbs tr.bbs-sbj td a { display:block; padding:15px 0 15px 10px; text-align:left } 
.tbl-bbs tr.bbs-con { display:none } 
.tbl-bbs tr.bbs-con .txt { padding:18px 2% 18px 6%; border-width:0 1px 1px 1px; border-style:solid; border-color:#019c98; background:#f2fefd; text-align:left } 
.tbl-bbs tr.on.bbs-sbj td { border-width:1px 0 0 0; border-style:solid; border-color:#019c98 } 
.tbl-bbs tr.on.bbs-sbj td:first-child { border-width:1px 0 0 1px; border-style:solid; border-color:#019c98 } 
.tbl-bbs tr.on.bbs-sbj td.last { border-width:1px 1px 0 0; border-style:solid; border-color:#019c98 } 
.tbl-bbs tr.on.bbs-con { display:table-row } 
.ie7 .tbl-bbs tr.on.bbs-con { display:block } 

/*해커스 바란다 개인정보수집동의*/
.user_desc { padding:10px; font-size:12px; } 
.user_desc ul li { padding-bottom:5px; } 
.user_desc p { padding:15px 0; } 
.user_desc .big_font { font-weight:bold; font-size:14px; } 

/* table - bbs2 */
.tbl-bbs-skin td,
.tbl-bbs-skin th { padding:15px 0; text-align:center } 
.bbs-content img { max-width:750px; height:auto } 
#kcaptcha_image { vertical-align:middle } 

/**/
.tbl-layout { border:0 } 
.tbl-layout th,.tbl-layout td { padding:0; background:none; border:0; text-align:left; font-weight:700; color:#019a99 } 

/* graph */
.star-rating, 
.star-rating .star-inner { display:inline-block; overflow:hidden; height:14px; background:transparent url("https://cdn.hackershrd.com/hrd/html/images/star.png") no-repeat; text-align:left } 
.star-rating { width:83px; vertical-align:middle } 
.star-rating .star-inner { background-position:0 -15px; vertical-align:top } 
.bar-graph,
.bar-graph [class^='graph-inner'] { display:inline-block; height:30px; text-align:left; vertical-align:middle } 
.bar-graph { width:216px; margin:0 5px; background:#fff; } 
.bar-graph [class^='graph-inner'] { background-color:#ffc939 } 
.bar-graph .graph-inner-brand { background-color:#019a99; border-radius: 20px; } 
.bar-graph .graph-inner-gray { background-color:#ccc } 
.bar-graph .graph-inner-dark { background-color:#888 } 
[class^='tbl'] .bar-graph { width:98px; border:1px solid #e7e7e7 } 
[class^='tbl'] .bar-graph,
[class^='tbl'] .bar-graph .graph-inner { height:20px } 

/* tab - list */
.tab-list { margin-bottom:20px; border-top:1px solid #e7e7e7; border-left:1px solid #e7e7e7; border-bottom:1px solid #019a99 } 
.ie7 .tab-list { zoom:1 } 
.tab-list:after { content:''; display:block; clear:both } 
.tab-list li { float:left; width:50% } 
.tab-list li a { display:block; height:45px; border-right:1px solid #e7e7e7; border-bottom:1px solid #e7e7e7; background:#fff; line-height:45px; font-weight:700; text-align:center } 
.tab-list li.on a { background:#019a99; border-color:#019a99; color:#fff } 
.tab-list.tab1 li { width:100% } 
.tab-list.tab3 li { width:33.333% } 
.tab-list.tab4 li { width:25% } 
.tab-list.tab5 li { width:20% } 
.tab-list.tab6 li { width:16.666% } 
.tab-list.tab7 li { width:14.285% } 
.tab-list.tab8 li { width:12.5% } 
.section-content .tit-box-h4 { margin-top: 40px; } 
/* left-menu */
.nav-left-tit { width:180px; height:130px; background:url('//cdn.hackershrd.com/img_hrd/sub/bg_nav_left.gif'); border-bottom:1px solid #e7e7e7; text-align:center } 
.ie7 .nav-left-tit { zoom:1; line-height:130px } 
.nav-left-tit span { display:inline-block; vertical-align:middle; font-size:24px; letter-spacing:-2px; color:#fff; font-weight:500 } 
.ie7 .nav-left-tit span { line-height:30px } 
.nav-left-tit:after { content:""; overflow:hidden; display:inline-block; width:0px; height:100%; vertical-align:middle; font-size:0px } 
.nav-left-lst li { display:flex; position:relative; width:100%; border-bottom:1px solid #e7e7e7; flex-direction: column; } 
.nav-left-lst li a { display:flex; height:50px; padding:0 10px 0 15px; font-size:15px; color:#333; vertical-align:middle; word-wrap:break-word; word-break:keep-all; align-items:center; position: relative; } 
.nav-left-lst li a::after { content: ""; width: 15px; height: 15px; position: absolute; top: 50%; transform: translateY(-50%); right: 10px; background:url('//cdn.hackershrd.com/img_hrd/common/sp_list.png') 5px -18px no-repeat; } 
.nav-left-lst li a.on::after { transform: translateY(-50%) rotate(90deg); background-position-y:-68px; } 
.nav-left-lst li.on a,
.nav-left-lst li a:hover { color:#019a99; font-weight:700 } 
.nav-left-lst li a:hover::after { background-position-y:-68px; } 
.nav-left-lst li a.arrow_hidden::after { display: none; } 


.nav-left-lst ul { display: none; border-top:1px solid #e7e7e7; } 
.nav-left-lst ul> .sub_li { display: block; border: none; } 
.nav-left-lst ul> .sub_li>a { display: flex; background: none; flex: 1; } 
.nav-left-lst ul> .sub_li>a>span { width: 3px; height: 3px; display: inline-block; background: #333; margin-right: 5px; border-radius: 50%; } 
/* sub-depth */
.sub-depth > span { padding-right:16px; background:url('//cdn.hackershrd.com/img_hrd/common/sp_list.png') 100% -99px no-repeat } 

/* section */
.section-content { margin-bottom:40px } 

/* lecture - list */
.search-box { display: none; border:1px solid #dcdcdc } 
.search-top { position:relative; padding:13px 20px; border-bottom:1px solid #e7e7e7; background:#f5f5f5; color:#333; font-weight:600 } 
.search-refresh { position:absolute; top:0; right:0; width:126px; height:43px; line-height:43px } 
.search-refresh .icon-refresh { margin-left:5px } 
.lst-search { padding:0 20px } 
.ie7 .lst-search { zoom:1 } 
.lst-search:after { display:block; content:''; clear:both } 
.ie7 .lst-search li { zoom:1 } 
.lst-search li:after { display:block; content:''; clear:both } 
.lst-search > li { padding:10px 0; border-top:1px solid #e7e7e7 } 
.lst-search > li:first-child { border-top:0 } 
.search-tit { float:left; width:135px; margin:5px 0 } 
.lst-search-chk { float:left; width:603px } 
.ie7 .lst-search-chk { zoom:1 } 
.lst-search-chk:after { display:block; content:''; clear:both } 
.lst-search-chk li { float:left; width:25%; padding:5px 0 } 
.lst-search-chk .input-control { margin-right:3px } 
.ie7 .lst-search-chk .input-control { margin-right:7px } 
.search-info { margin: 40px 0 50px; text-align: center; } 
.search-info span { color: #cc0000; } 
.search-form label { margin-right:10px } 
.search-form label input { margin-left:8px } 
.tbl-lecture-list td { padding:30px 0 } 
.sample-lecture { display:block; position:relative; width:144px; height:126px; border:1px solid #bbb } 
.sample-lecture span { display:block; text-align:center; line-height:24px; font-size:12px } 
.txt-align.all-price { padding-top:10px; margin-top:10px; border-top:1px solid #e7e7e7; color:#019a99 } 

/* 국비지원/일반 탭 메뉴 */
.js-tab-type1 { margin-top: -23px; display: flex; position: relative; } 
.js-tab-type1::after { content: ''; width: 70.8%; height: 1px; position: absolute; bottom: 0; right: 10px; background: #7f7f7f; } 
.js-tab-type1 li { width: 15%; height: 55px; text-align: center; border: 1px solid #c4c4c4; border-bottom: 1px solid #7f7f7f; border-radius: 10px 10px 0 0; position: relative; } 
.js-tab-type1 li:last-child { margin-left: -1px; } 
.js-tab-type1 li a { display: block; height: 100%; line-height: 55px; font-size: 16px; font-weight: bold; color: #b2b2b2 } 
.js-tab-type1 li.on { border: 1px solid #7f7f7f; border-bottom: 0; z-index: 1; } 
.js-tab-type1 li.on::after { content:''; width: 50%; height: 4px; background: #41b5ae; position: absolute; top: 0; left: 50%; transform: translateX(-50%) } 
.js-tab-type1 li.on a { color: #333; }; .js-tab-type1.info-tab { margin-top: 0 !important; display:block !important; } 
.js-tab-type1.info-tab::after { display: none; } 
.js-tab-type1.info-tab li { float: left; width: 159px; border: 1px solid #29a8a5; border-radius: 0; height: auto; } 
.js-tab-type1.info-tab li:first-child { border-left: 1px solid #29a8a5; } 
.js-tab-type1.info-tab li:last-child { margin-left:0; } 
.js-tab-type1.info-tab li a { display: block; height: 32px; color: #29a8a5; font-size: 16px; text-align: center; line-height: 28px; font-weight: 500; } 
.js-tab-type1.info-tab li.on::after { display: none; } 
.js-tab-type1.info-tab li.on a, .js-tab-type1.info-tab li a:hover { color: #fff; background: #29a8a5; } 

/* 해커스역사 버튼 */
.js-tab-type1.info-tab li.history_btn { background: none; border: none; } 
.js-tab-type1.info-tab li.history_btn a::before { content: ''; display: block; width: 2px; height: 20px; background-color: #c2e5e4; position: absolute; left: 28px; top: 4px; } 
.js-tab-type1.info-tab li.history_btn a::after { content: ''; display: block; width: 2px; height: 20px; background-color: #c2e5e4; position: absolute; right: 25px; top: 4px; } 
.js-tab-type1.info-tab li.history_btn.on a, .js-tab-type1.info-tab li.history_btn a:hover { background: none; color: #29a8a5; } 


/* 강의리스트 */
.sd_box { margin-top: 10px; } 
.sd_box .bx-wrapper { max-width: 1160px !important; } 
.sd_box li { width: 224px; } 
.sd_box li a { width: 224px; display: block; position: relative; } 
.sd_box li .img-box { width: 99%; height: 145px; border-radius: 5px; overflow: hidden; margin-bottom: 10px; position: relative; } 
.sd_box li .img-box:hover .lec_info { display: flex } 
.sd_box li .img-box img { width: 100%; } 
.sd_box li .lec_info { display: none; width: 100%; height: 100%; position: absolute; top: 0; flex-direction: column; justify-content: space-between; background: rgba(0, 0, 0, 0.8); } 
.sd_box li .lec_info .info_txt { width: 85%; height: 50px; line-height: 17px; margin: 15px auto; color: #fff; white-space: normal; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } 
.sd_box li .lec_info .lec_count { width: 85%; margin: 0 auto; color: #01e0e0; } 
.sd_box li .lec_info .like_btn { text-align: right; } 
.sd_box li .lec_info .like_btn img { width: auto; padding: 10px; } 
.sd_box li .lec_tit { height: 40px; font-size: 1rem; color:#333; line-height: 1.35rem; font-weight: 700; margin-bottom: 10px; } 
.sd_box li .price-box { height: 90px; padding: 5px 15px; border: 1px solid #dedede; border-radius: 5px; background: #eeeeee; display: flex; flex-direction: column; justify-content: space-between; } 
.sd_box li .price-box dd:first-child { font-weight: normal; } 
.sd_box .lst_all .bx-controls-direction a { width: 18px; height: 42px; font-size: 0; margin-top: -65px; overflow: hidden; background: url('http://gscdn.hackers.co.kr/hrd/img/index/arrow.png') no-repeat 0 0; } 
.sd_box .bxslider-default .bx-controls-direction a.bx-prev { left: -70px; transform: scaleX(-1); } 
.sd_box .bxslider-default .bx-controls-direction a.bx-next { right: -70px; } 
.sd_box .bx-wrapper .bx-controls-direction a.disabled { display: block; } 

.view_more { display: block; text-align: right; text-decoration: underline; } 

/* 전체보기 페이지 */
.view_order { display: inline-block; margin: 20px 0 10px; } 
.view_order .selected { width: 100px; height: 30px; display: flex; justify-content: space-around; align-items: center; border: 2px solid #e4e4e4; border-radius: 5px; cursor: default; } 
.view_order .select_box { display: none; width: 100px; margin-top: -4px; position: absolute; border: 2px solid #e4e4e4; border-top: none; border-radius: 0 0 5px 5px; background: #fff; z-index: 1; } 
.view_order .select_box.on { display: block; } 
.view_order .select_box li { height: 30px; line-height: 30px; padding-left: 10px; cursor: pointer; } 
.view_order .select_box li:hover { background: #e9e8e8; } 

.lst_all li { width: calc((100% - 5%) / 5); margin: 0; } 
.lst_all.lst_allv2 { margin-top: 20px; display: flex; flex-wrap: wrap; justify-content: flex-start; } 
.lst_all.lst_allv2 li { width: calc((100% - 5%) / 5); margin: 1% 1% 1% 0; } 
.bx-wrapper { margin: 0 !important; } 
.lst_all li a { width: 100%; display: block; } 
.lst_all li .img-box { width: 100%; height: 145px; border-radius: 5px; overflow: hidden; margin-bottom: 10px; position: relative; } 
.lst_all li .img-box:hover .lec_info { display: flex } 
.lst_all li .img-box img { width: 100%; } 
.lst_all li .lec_info { display: none; width: 100%; height: 100%; position: absolute; top: 0; flex-direction: column; justify-content: space-between; background: rgba(0, 0, 0, 0.8); } 
.lst_all li .lec_info .info_txt { width: 85%; height: 57px; line-height: 18px; letter-spacing: 1px; margin: 15px auto 10px; font-size: 13px; color: #fff; white-space: normal; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; } 
.lst_all li .lec_info .lec_count { width: 85%; margin: 0 auto; color: #01e0e0; letter-spacing: 1px; font-size: 13px; } 
.lst_all li .lec_info .like_btn { text-align: right; width: 30%; margin-left: auto; cursor: pointer; } 
.lst_all li .lec_info .like_btn img { width: auto; padding: 10px; } 
.lst_all li .lec_tit { height: 40px;font-size: 1rem;color: #333;line-height: 1.35rem;font-weight: 700;margin-bottom: 10px;overflow: hidden;text-overflow: ellipsis;-webkit-line-clamp: 2;-webkit-box-orient: vertical;display: -webkit-box;} 
.lst_all li .price-box.nomal { height: 60px; padding: 5px 15px; border: 1px solid #dedede; border-radius: 5px; background: #eeeeee; display: flex; flex-direction: column; justify-content: space-between; position: relative; margin-bottom: 40px; } 
.lst_all li .price-box.nomal.event { height: 80px; } 
.lst_all li .price-box.nomal .event_day { display: flex; justify-content: space-between; width: 100%; align-items: center; } 
.lst_all li .price-box.nomal .event_day .dday { background: #019c98; color: #FFF; padding: 3px 5px; border-radius: 3px; font-size: 12px; font-weight: 500; width: 26.8%; margin-left: 9%; text-align: center; } 
.lst_all li .price-box.nomal .event_day .event_end { color: #666; font-weight: 500; } 
.lecture-info .event_day .dday { background: #019c98; color: #FFF; padding: 3px 10px; border-radius: 10px; letter-spacing: 1px; } 
.lecture-info .event_day { display: flex; justify-content: left; gap: 3%; width: 100%; align-items: center; font-size: 14px; position: relative; left: -75px; font-weight: 700;; } 
.lecture-info .event_day .event_end { color: #666; font-weight: 500; } 
.lst_all li .price-box.nomal .event_day b { background: #019c98; color: #FFF; padding: 3px 7px; border-radius: 7px; } 
.lst_all li .price-box.nomal .event_day span { color: #666; } 
.lst_all li .price-box dd:first-child { font-weight: normal; } 
.lect_lst .bxslider-default .bx-controls .bx-controls-direction a { width: 50px; height: 80px; font-size: 0; margin-top: -65px; overflow: hidden; background: url('http://gscdn.hackers.co.kr/hrd/img/index/arrow.png') no-repeat 0 0; } 
.lect_lst .bxslider-default .bx-controls .bx-controls-direction a.bx-prev { left: -70px; transform: scaleX(-1); } 
.lect_lst .bxslider-default .bx-controls .bx-controls-direction a.bx-next { right: -70px; } 

/* lecture - summary */
.lecture-summary { padding-bottom:20px; border-bottom:1px solid #ccc } 
.lecture-summary:after { display:block; content:''; clear:both } 
.ie7 .lecture-summary { zoom:1 } 
.lecture-img { float:left; width:235px; height: 152px; border:1px solid #bbb } 
.lecture-img img { width: 100%; height: 100%; } 
.lecture-info { float:right; width:500px } 
.tbl-row-lecture { border:0 } 
.tbl-row-lecture th { background:#fff } 
.tbl-row-lecture th,
.tbl-row-lecture td { padding:14px 0; border:0; border-top:1px solid #e7e7e7; vertical-align:top; text-align:left; line-height:21px } 
.tbl-inner { border:0 } 
.tbl-inner th { background:#fff; color:#888; font-weight:normal } 
.tbl-inner th,
.tbl-inner td { padding:0 0 4px 0; border:0; text-align:left } 
.lecture-btn a { width:110px; font-size:15px } 
.lecture-btn a:first-child { margin-left:0; } 
.lecture-btn .btn-m { height:48px; line-height:48px } 
.lecture-btn .btn-m-line { height:48px; line-height:48px; margin-left:4px; } 
.icon-dot { width:3px; height:3px; margin-right:6px; background-position:-199px 0 } 
.icon-favorites { width:18px; height:20px; margin-right:3px; background-position:-176px 0 } 
.icon-movie { width:18px; height:18px; margin-right:3px; background-position:-48px 0 } 
.icon-course { width:18px; height:18px; margin-right:3px; background-position:-30px 0 } 
.lecture-detail { padding-top:60px } 
.user-notice { margin-bottom:20px } 
.user-notice > strong { color:#333 } 
.lecture-info .user-notice { padding:18px; background:#f5f5f5 } 
.lecture-summary .lecture_ncs_txt { text-align:right; padding-bottom:10px; } 


/* list-dot */
.list-guide { } 
.list-guide li { background:url('//cdn.hackershrd.com/img_hrd/common/sp_list.png') 0 -140px no-repeat; padding-left:10px; font-size:13px; line-height:24px } 

/* paging */
.box-paging { margin-top:30px; text-align:center } 
.box-paging a,
.box-paging em { display:inline-block; width:28px; height:28px; margin:0 2px; line-height:27px; vertical-align:top } 
.box-paging .active { background-color:#555; color:#fff } 
.icon-first { width:28px; height:28px; background-position:0 -24px } 
.icon-prev { width:28px; height:28px; background-position:-30px -24px } 
.icon-next { width:28px; height:28px; background-position:-60px -24px } 
.icon-last { width:28px; height:28px; background-position:-90px -24px } 

/* order */
.order-depth:after { display:block; content:''; clear:both } 
.order-depth li { float:left; margin-left:14px; padding-right:20px; background:url('//cdn.hackershrd.com/img_hrd/common/sp_list.png') 100% -119px no-repeat; font-size:16px } 
.order-depth li.last { padding-right:0; background:none } 
.order-depth [class^='icon'] { margin-right:9px } 
.icon-choice { width:28px; height:27px; background-position:0 -98px } 
.icon-order { width:28px; height:27px; background-position:-30px -98px } 
.icon-finish { width:28px; height:27px; background-position:-60px -98px } 
.order-depth li.on { color:#019a99; font-weight:700 } 
.order-depth li.on [class^='icon'] { background-position-y:-127px } 
.graphic-order { width:92px; height:80px; background-position:-244px 0 } 
.icon-receipt2 { width:22px; height:21px; background-position:-84px 0 } 
.icon-question-mark { width:15px; height:14px; background-position:-67px 0 } 
.list-input:after { display:block; content:''; clear:both } 
.list-input { width:800px; margin-left:30px; margin-top:5px } 
.list-input li { float:left; width:20% } 
thead .line-box { border:2px solid #019a99; border-bottom:0 } 
tbody .line-box { border:2px solid #019a99; border-top:0 } 

/* guide-box */
.guide-box { padding:60px 0; background:#f5f5f5; border:1px solid #e7e7e7; text-align:center } 
.guide-box .big-title { margin-top:20px; font-size:28px } 
.guide-box p { line-height:1.5 } 
.guide-box-sub { position:relative; padding:30px 0 30px 200px; background:#f5f5f5; border:1px solid #e7e7e7 } 
.graphic-password { position:absolute; top:20px; left:60px; width:76px; height:70px; background-position:-338px 0 } 

/* join */
.join-step-bar { margin-bottom:40px } 
.ie7 .join-step-bar ul { zoom:1 } 
.join-step-bar ul { border:1px solid #e7e7e7 } 
.join-step-bar ul:after { display:block; content:''; clear:both } 
.join-step-bar li { float:left; position:relative; z-index:2; width:332px; height:68px; border-left:1px solid #e7e7e7; background-color:#f5f5f5; text-align:center; line-height:68px; font-size:16px } 
.join-step-bar li:first-child { border-left:0 } 
.join-step-bar li.on { z-index:3; background-color:#019a99; font-weight:700; color:#fff } 
.join-step-bar li.on:before { content:''; display:block; position:absolute; top:28px; right:-8px; width:8px; height:12px; background:url('//cdn.hackershrd.com/img_hrd/sub/join_step_arr.png') no-repeat } 
.join-step-bar li.on.last:before { display:none } 
.join-step-bar li.on:after { content:'' } 
.join-step-bar li.on [class^='icon'] { background-position-y:-127px } 
.icon-join-agree { width:32px; height:27px; background-position:-90px -98px } 
.icon-join-chk { width:32px; height:27px; background-position:-124px -98px } 
.icon-join-inp { width:32px; height:27px; background-position:-158px -98px } 
.agree-box-txt { overflow:hidden; overflow-y:scroll; height:193px; padding:20px 18px; border:1px solid #e7e7e7; border-bottom:0; line-height:22px; font-size:13px; } 
.agree-box-txt.t2 { padding:0 18px; white-space:pre-wrap; } 
.ie7 .agree-box-txt { white-space:pre } 
.agree-box-txt.on { overflow:hidden; height:auto } 
.agree-box button { display:block; width:100%; height:38px; background:#f5f5f5; border:1px solid #e7e7e7; text-align:center; line-height:38px } 
.graphic-join { width:120px; height:105px; background-position:0 0 } 
.all-agree-box { margin-top:43px; padding-top:30px; border-top:1px solid #e7e7e7; text-align:center; font-size:16px; font-weight:700 } 
.all-agree-box label { width:430px; margin:0 auto } 
.all-agree-box a { margin-top:40px } 

.agree-box-txt table.info-table { width:100%; table-layout:fixed; border:1px solid #555; border-collapse:collapse; border-spacing:0; white-space:normal; font-size:13px; } 
.agree-box-txt table.info-table caption.blind { overflow:hidden; position:absolute; top:0; left:0; width:1px; height:1px; font-size:0; line-height:0 } 
.agree-box-txt table.info-table th { padding:5px; } 
.agree-box-txt table.info-table tbody th,.agree-box-txt table.info-table tbody td { padding:5px; border:1px solid #555; text-align:center; } 



/* join-step2 */
.identify-box { float:left; position:relative; width:49%; height:161px; padding-top:39px; border:1px solid #e7e7e7 } 
.identify-box.fst { border-right:0 } 
.identify-inner { margin-left:170px } 
.identify-inner > strong { font-size:18px } 
.identify-inner > p { margin-top:18px; font-size:13px; line-height:20px } 
.identify-inner .box-btn { margin-top:18px } 

.content .identify-box { padding-bottom:50px } 
.content .identify-inner > p { height:90px } 
.content .identify-inner .box-btn { text-align:left } 

.identify-box [class^='graphic-'] { position:absolute; top:38px; left:30px; width:110px; height:110px } 
.graphic-phon { background-position:0 -108px } 
.graphic-ipin { background-position:-112px -108px } 
/* join-step3 */
.tbl-col-join th { padding-left:20px; text-align:left; color:#333 } 
.tbl-col-join .icons { display:inline-block; width:10px; color:#019a99; vertical-align:middle } 
.ie7 .tbl-col-join .box-input { zoom:1 } 
.tbl-col-join .box-input:after { display:block; content:''; clear:both } 
.tbl-col-join .box-input { margin-bottom:15px } 
.tbl-col-join .box-input label { float:left; width:200px } 
.tbl-col-join .btn-s-tin { min-width:55px; background:#888; border:1px solid #888 } 

/* tbl-bbs-view */
.tbl-bbs-view { margin-bottom:40px } 
.tbl-bbs-view th,
.tbl-bbs-view td { text-align:left } 
.tbl-bbs-view th { padding:14px 20px } 
.tbl-bbs-view td { padding:20px 20px 30px } 
.tbl-bbs-view .user-id { text-align:right; color:#888; font-weight:normal } 
.box-rating { text-align:right } 
.box-rating .tit_rating { display:inline-block; margin-right:2px; color:#888; vertical-align:middle } 
.editor-wrap { margin-top:10px } 
.ie7 .list-rating-choice { zoom:1 } 
.list-rating-choice:after { display:block; content:''; clear:both } 
.list-rating-choice li { float:left; width:20%; } 

/* layer-reportCard */
.box-print-area { border:3px solid #555; border-top:0 } 
.box-print-in { min-height:80px; padding:20px } 
.box-print-in > p { padding:30px 0; font-size:18px; text-align:center } 
.box-print .layer-wrap-h4 { height:50px; margin:0; background:#555; color:#fff; font-size:24px; line-height:47px; font-weight:400; text-align:center } 
.box-print dl { font-weight:700; color:#019a99; line-height:22px } 
.box-print dt,
.box-print dd { display:inline-block } 
.ie7 .box-print dt,
.ie7 .box-print dd { display:inline; zoom:1 } 
.layer-footer { position:relative; padding:25px 0 20px 195px; background:#f5f5f5; font-size:12px } 
.layer-footer .logo-footer { position:absolute; top:19px; left:15px } 
.box-certificate { position:relative; padding-top:20px; text-align:center; line-height:22px } 
.box-certificate > p { position:relative; z-index:1 } 
.box-certificate .mark { position:absolute; top:12px; right:97px; z-index:0 } 

/* popup-수료증 */
.popup-certificate { position:relative; width:800px; height:812px; padding-top:173px; text-align:center; color:#333; font-weight:700 } 
.popup-certificate .bg { position:absolute; top:0; left:0; z-index:1 } 
.popup-certificate-inner { position:relative; z-index:2 } 
.popup-certificate-inner h1 { margin-bottom:72px } 
.popup-certificate-inner .num { position:absolute; top:-80px; left:122px; font-size:17px } 
.popup-certificate-inner dl { width:462px; margin:0 auto; text-align:left; font-size:19px; line-height:36px } 
.popup-certificate-inner dt,
.popup-certificate-inner dd { display:inline-block } 
.ie7 .popup-certificate-inner dt,
.ie7 .popup-certificate-inner dd { display:inline; zoom:1 } 
.popup-certificate-inner > p { margin-top:60px; font-size:25px; line-height:48px; letter-spacing:-2px } 
.popup-certificate-inner > div { margin-top:56px; letter-spacing:-2px } 
.popup-certificate-inner > div > p { position:relative; z-index:1 } 
.popup-certificate-inner > div span { display:block; font-size:19px } 
.popup-certificate-inner > div strong { display:block; font-size:28px } 
.popup-certificate-inner .mark { position:absolute; bottom:0; right:240px; z-index:0 } 

/* classroom */
.mint { color: #019a99; } 
.tc { text-align: center; margin: 10px 0; } 
.ps-txt { padding-bottom:15px; } 
.ps-txt p { font-size:13px; } 
.ps-txt p span { color:#019a99; } 
.classroom-box { margin:15px auto; padding:30px 0; background:#f5f5f5; display: flex; justify-content: center; } 
.classroom-box > .f-l { padding:0 30px; width: calc(100%/3); border-right: 1px solid #e7e7e7; } 
.classroom-box > .f-m { padding:0 30px; width: calc(100%/3); border-right: 1px solid #e7e7e7; } 
.classroom-box > .f-r { padding:0 30px; width: calc(100%/3); } 
.classroom-box dl { margin-top:10px } 
.classroom-box .bar-graph { border-radius: 20px; width: 261px; } 
.classroom-box .bar-graph>.dash { width: 1px; height: 30px; border-right: 1px dashed #ddd; position: absolute; top: 0; left: 80%; transform: translateX(-50%); } 
.classroom-box dt,
.classroom-box dd { display:inline-block; } 
.user-progress .percent { color: #000; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } 
.f-l .std { position: absolute; top: 108%; left: 80%; display: flex; justify-content: center; flex-wrap: wrap; width: 83px; transform: translateX(-50%); } 
.f-l .std>p:nth-of-type(2) { text-align: center; } 
.ie7 .classroom-box dt,
.ie7 .classroom-box dd { display:inline; zoom:1 } 
.classroom-top { margin-bottom:12px; line-height:23px; display: flex; justify-content: space-between; border-bottom: 1px solid #090909; } 
.classroom-top > .lect_term { font-size: 14px; } 
.classroom-box > .f-m .nt { text-align: center; padding: 35px 0; } 
.classroom-top strong,
.classroom-top span { display:inline-block } 
.classroom-box > .f-r .progress_p { background: #fff; text-align: center; line-height: 30px; border-radius: 5px; position: absolute; left: 50%; transform: translateX(-50%); display: flex; align-items: center; margin-top: 10px; } 
.classroom-box > .f-r .progress_p > .p_per, .classroom-box > .f-r .progress_p > .p_sco { display: flex; justify-content: center; padding: 10px 20px; } 
.classroom-box > .f-r .progress_p > .p_per p:nth-of-type(1), .classroom-box > .f-r .progress_p > .p_sco p:nth-of-type(1) { margin-right: 5px; } 
.classroom-box > .f-r .progress_p > .p_per p:nth-of-type(2), .classroom-box > .f-r .progress_p > .p_sco p:nth-of-type(2) { font-weight: 800; } 
.classroom-box > .f-r .progress_p >span { width: 1px; height: 20px; background: #e7e7e7; } 
.classroom-box_bt { height: 40px; } 
.classroom-box_bt .bt_wrap>a { background: #019a99; color: #fff; padding: 5px 10px; text-align: center; } 
.graphic-slow { width:134px; height:125px; background-position:-134px -262px } 
.graphic-right { width:134px; height:125px; background-position:0 -262px } 
.graphic-document { width:40px; height:40px; background-position:0 -220px } 
.graphic-qna { width:40px; height:40px; background-position:-42px -220px } 
.graphic-lecture { width:40px; height:40px; background-position:-84px -220px } 
.list-test li>span { width: 4px; height: 4px; border-radius: 50%; background: #000; } 
.list-test li:nth-of-type(1) { padding: 0 0 10px; } 
.list-test li { display: flex; justify-content: space-evenly; align-items: center; padding: 10px 0; border-bottom: 1.5px solid #dddddd; } 
.list-test li:nth-last-of-type(1) { border: none; } 
.list-test li>a { background: transparent; padding: 5px 15px; border-radius: 15px; color: #019a99; border: 1px solid #019a99; } 
.list-test li>a:hover { background: #019a99; color: #fff; } 
.list-test li:nth-of-type(3) .midt_s { padding-left: 25px; } 
.list-test li > p:nth-of-type(2) { font-weight: 800; } 
.ie7 .list-schedule { zoom:1 } 
.list-schedule:after { display:block; content:''; clear:both } 
.list-schedule { width:100% } 
.list-schedule { background:#fff; border:1px solid #e7e7e7; border-radius:6px; margin:12px 0; } 
.list-schedule li { float:left; width:33.333% } 
.list-schedule a { display:block; padding:12px 0; border-left:1px solid #e7e7e7; color:#888; text-align:center } 
.list-schedule li:first-child a { border-left:0 } 
.list-schedule span,
.list-schedule .d-day { display:inline-block; vertical-align:middle } 
.list-schedule .d-day { margin-left:5px; font-size:24px; letter-spacing:-2px } 
.list-schedule li.on a,
.list-schedule li a:hover { background:#ffc939; color:#000; padding:12px 0; } 
.list-schedule .schedule { display:none } 
.list-schedule li.on a .schedule,
.list-schedule li a:hover .schedule { display:inline-block } 
.list-schedule li.on a .d-day,
.list-schedule li a:hover .d-day { display:none } 
.list-schedule li.on a .str,
.list-schedule li a:hover .str { display:none } 

.ie7 .list-detail { zoom:1 } 
.list-detail:after { display:block; content:''; clear:both } 
.list-detail { margin-top:20px } 
.list-detail li { float:left; width:33.333% } 
.list-detail a { display:block; font-size:13px; font-weight:700 } 
.list-detail i { margin-right:8px } 

/* ID/PW-find */
.find-box { position:relative; margin-top:10px; padding:30px 45px; background:#f5f5f5; border:1px solid #e7e7e7 } 
.find-box dt,
.find-box dd { display:inline-block; vertical-align:middle } 
.ie7 .find-box dt,
.ie7 .find-box dd { display:inline; zoom:1 } 
.find-box dt { padding-right:45px; margin-right:25px; border-right:1px solid #ccc; font-size:18px } 
.find-box dd .input-sp { position:absolute; top:20px; right:80px } 
/* input */
.big.input-sp,
.big.input-sp input,
.big.input-sp span { height: 40px } 
.big.input-sp input,
.big.input-sp.ico { width:40px } 
.big.input-sp span,
.big.input-sp.ico span { padding-left:40px } 
.big.input-sp span { line-height:40px } 
.big.input-sp input[type=radio] + span { background-position:0 -88px } 
.big.input-sp input[type=radio]:checked + span { background-position: 0 -130px } 
.ie7 .big.input-sp.on input[type=radio] + span,
.ie8 .big.input-sp.on input[type=radio] + span { background-position: 0 -130px } 

.box-btn-tbl { } 
.box-btn-tbl a { margin-top:4px } 
.box-btn-tbl a:first-child { margin-top:0 } 

/* pw */
.pw-find { width:400px; margin:80px auto 0; padding:50px 0; background:#f5f5f5; border:1px solid #e7e7e7; text-align:center } 

/* bbs-cmt */
.bbs-cmt-box { margin-top:30px; padding:10px 20px 20px; background:#f5f5f5; border:1px solid #e7e7e7; font-size:12px } 
.bbs-cmt-input label { margin-right:10px } 
.bbs-cmt-txt { margin-top:10px } 
.bbs-cmt-txt textarea { width:642px } 
.bbs-cmt-txt button { display:inline-block; width:90px; height:82px; background:#bbb; line-height:82px; font-size:16px; color:#fff; font-weight:700 } 

/* bbs-order */
.order-open { color:#019a99; text-decoration:underline; font-weight:bold } 
.order-list tr.on td { border-bottom:0 } 
.order-list tr .order-open .arr-on { display:none } 
.order-list tr.on .order-open .arr-on { display:inline-block } 
.order-list tr.on .order-open .arr-off { display:none } 
.tbl-order { display:table; width:90%; margin:0 auto; border:1px solid #e7e7e7 } 
.tbl-order th,
.tbl-order td { padding:14px 0; border:0 } 
.order-info { display:none } 
.order-info.on { display:table-row } 
.ie7 .order-info.on { display:block } 
.order-list .order-info.on > td { border-bottom:1px solid #e7e7e7 } 
.order-info > td { padding:0 10px 15px; border:0 } 

/* 평가설문지 */
.pop_board { overflow:hidden; width:845px; padding:20px } 
.pop_board.renew { padding: 0; margin: 0 auto; } 
.pop_board .sub_tit_h4 { padding: 10px 0 10px 10px; margin-bottom:10px; background: linear-gradient(90deg, rgba(8,177,173,1) 0%, rgba(35,199,198,1) 20%, rgba(8,177,173,1) 50%, rgba(35,199,198,1) 80%, rgba(8,177,173,1) 100%); color: #fff; font-size: 20px; } 
.pop_board input[type="radio"] { -webkit-appearance:radio; -moz-appearance: radio; appearance:radio } 
.horiz { border-collapse:collapse; border-spacing:0; border-top:1px solid #c3c5c9; border-right:1px solid #ededed; border-bottom:1px solid #c3c5c9; border-left:1px solid #ededed; } 
.horiz caption { display:none; } 
.horiz th { background:#fafafa; outline:none; border-top:1px solid #ededed; border-right:1px solid #ededed; padding:10px 0 10px 9px; text-align:left; font-size:12px; font-weight:normal; letter-spacing:-1px; vertical-align:top; line-height:20px; } 
.horiz td { border-top:1px solid #ededed; padding:10px 0 10px 10px; font-size:12px; color:#333; vertical-align:top; height:20px; line-height:20px; } 
.horiz .first th,
.horiz .first td { border-top-color:#c3c5c9; } 
.horiz .line th,
.horiz .line td { border-top-color:#c3c5c9; } 
.horiz th.relay { border-left:1px solid #ededed; } 
.horiz th.item_title { font-weight:bold; background:#fff; } 
.horiz td a { color:#547eec; font-size:12px; letter-spacing:-1px; } 
.horiz td a.txt_point { letter-spacing:0; font-weight:bold; } 
.board_write { background: url("../img/hd_bg.gif") no-repeat scroll 0 -100px #FFFFFF; } 
.write_header { width:100%; background: url("../img/hd_bg.gif") no-repeat scroll right -100px transparent; position: relative; } 
.write_header h1 { color: #4A4A4A; font-size: 13px; line-height: 33px; margin: 0 0 0 15px; overflow: hidden; white-space: nowrap; } 
.write_header h1 a { color: #4A4A4A; text-decoration: none; } 
.write_header h1 .category { border-right: 1px solid #7E7E7E; font-weight: normal; margin: 0 5px 0 0; padding: 0 10px 0 0; } 
.write_header .time { color: #BFBFBF; font-size: 12px; margin: 0; position: absolute; right: 12px; top: 11px; } 
.write_body { background: none repeat scroll 0 0 #FFFFFF; padding: 0 5px 25px 5px; } 
.head_css { display: flex; justify-content: space-between; align-items: center; margin: 10px 0; } 
.head_css .txt_xss.submit { color: #019a99; background: none; font-size: 16px; margin: 0; } 
.head_css .txt_xss.submit::before { display: inline-block; width: 4px; height: 16px; background: #019a99; content: ""; margin-right: 3px; border-radius: 20px; vertical-align: middle; } 
.horiz.submit th { background: #f5f5f5; color: #000; font-weight: bold; } 
.horiz.submit tr { border-bottom: 1px solid #f5f5f5; } 
.horiz.submit td { border-top:none; } 
.horiz.submit td textarea { background: #fff; border: 1px solid #aaaaaa; border-radius: 2px; } 
.horiz.submit input[type=file]::file-selector-button { background: #888888; color: #fff; border-radius: 5px; cursor: pointer; border: none; padding: 5px 10px; } 

.grayF { color: #aaaaaa; font-weight: 400; } 
.pSubmit { color: #fe4444; margin: 10px 0; } 
.buttonset.submit { float: right; } 
.buttonset.submit .btn25, .buttonset.submit .btn25 a, .buttonset.submit .btn25 button, .buttonset.submit .btn25 input { background: none; } 
.buttonset.submit [class^='btn'] { border: none; background: none; } 
.buttonset.submit .btn25 #btn_list , .buttonset.submit .btn25.red input, .buttonset.submit .btn25.blue input { width: 100px; line-height: 25px; height: 25px; box-sizing: border-box; } 
.buttonset.submit .btn25 #btn_list { background: #fff; color: #019a99; border: 1px solid #019a99; } 
.buttonset.submit .btn25.red input { background: #bbbbbb; color: #fff; border: none; } 
.buttonset.submit .btn25.blue input { background: #019a99; color: #fff; } 
.btn25.submit { background: none; height:12px; line-height: 12px; padding: 0 12px; display: inline; border: none; } 
.btn25.submit a { background: none; padding: 0; color: #fff; } 
.btnArea.submit { float: right; } 
.read_body .read_content { border: 1px solid #cccccc; } 

/* content */
.step-list { padding-bottom:5px; margin:30px 0; border-bottom:1px solid #bfbfbf } 
.ie7 .step-list { zoom:1 } 
.step-list:after { display:block; content:''; clear:both } 
.step-list li { float:left; border-right:1px dashed #bfbfbf } 
.step-list li:first-child { border-left:1px dashed #bfbfbf } 
.step-list li a { display:block; padding:4px 8px; font-size:15px; color:#999 } 
.step-list li.on a,
.step-list li a:hover { color:#000; font-weight:700 } 

/* event_list */
.event-list { overflow:hidden; margin-left:-20px; } 
.event-list li { float:left; margin-left:20px; margin-bottom:20px; width:380px; height:225px; } 
.event-list li a,.event-list li a * { display:block; } 
.event-list li a { border:1px solid #ccc; } 
.event-list li a span { border-top:1px solid #ccc; background:#ebebeb; text-align:center; padding:7px 0 10px; } 
.event-list li a span strong { color:#333; font-size:16px; margin-bottom:5px; } 
.event-list li a span em { color:#666; font-size:14px; } 

.medal-img { position:absolute; top:-10px; left:-15px } 

/*quick*/
.quick-wrap { top:220px } 

/*inner-table*/
.inner-table { width:100% } 
.inner-table,
.inner-table th,
.inner-table td { border:none; padding:4px 0; text-align:left } 

/* 휴면 아이디 해제 신청 안내 */
.dormancy-wrap { width:780px; margin:0 auto; } 
.dormancy-wrap h3 { margin:100px 0 45px; font-size:36px; color:#29a8a5; font-weight:normal; } 
.dormancy-wrap h3:before { display:inline-block; width:8px; height:39px; margin-right:10px; content:''; background:url('//cdn.hackershrd.com/img_hrd/sub/icon_dormancy.png') no-repeat 0 0; vertical-align:middle; } 
.dormancy-wrap p { font-weight:bold; line-height:1.5; color:#000; } 
.dormancy-wrap button { width:227px; padding:5px 0 7px; margin-top:50px; background:#000; border:3px solid #ccc; color:#fefefe; font-size:15px; text-align:center; border-radius:3px; line-height:1; } 
.dormancy-wrap button:after { display:inline-block; margin-left:10px; content:'>'; color:#2bc4c0; font-size:17px; font-weight:bold; } 

.dormancy-wrap.final { width:377px; margin:0 auto; } 
.dormancy-wrap.final h3 { margin:50px 0 17px; padding-bottom:7px; font-size:20px; color:#000; border-bottom:1px solid #d1d1d1; } 
.dormancy-wrap.final h3:before { width:4px; height:22px; background-size:8px 39px; } 
.dormancy-wrap.final table { width:100%; } 
.dormancy-wrap.final table,.dormancy-wrap.final th,.dormancy-wrap.final td { border-collapse:separate; border-spacing:5px; } 
.dormancy-wrap.final table caption { overflow:hidden; position:absolute; top:0; left:0; width:1px; height:1px; font-size:0; line-height:0; } 
.dormancy-wrap.final table th { position:relative; padding:6px 0; margin-right:5px; background:#25a2a0; color:#fff; font-size:16px; font-weight:normal; letter-spacing:-1.5px; } 
.dormancy-wrap.final table th:after { display:block; position:absolute; top:0; left:0; content:''; width:10px; height:10px; background:url('//cdn.hackershrd.com/img_hrd/sub/icon_dormancy.png') no-repeat -10px 0; } 
.dormancy-wrap.final table input[type='text'] { width:100%; height:100%; padding:6px 0; border:1px solid #b0b0b0; box-sizing:border-box; text-indent:10px; } 
.dormancy-wrap.final button { position:relative; width:140px; margin-top:30px; padding:8px 0 10px; background:#d6d6d6; border:1px solid #b2b2b2; color:#525252; border-bottom-right-radius:0; } 
.dormancy-wrap.final button:after { position:absolute; right:0; bottom:0; width:10px; height:10px; content:''; background:url('//cdn.hackershrd.com/img_hrd/sub/icon_dormancy.png') no-repeat -10px -13px; } 

/*결제단 추가 190402*/
.new-list-input { float:none; display:inline-block; vertical-align:middle; } 
.ref-box { margin-top:25px; } 
.ref-box ul li { line-height:1.6; font-size:0.9em; } 
.new-tbl thead th { padding:15px 0; border-left:1px solid #e7e7e7; } 
.new-tbl thead th:first-child { border-left:0; } 
.new-tbl tbody td { border-left:1px solid #e7e7e7; } 

/*주문완료단 추가 190402*/
.big-title strong { color:#333; } 
.new-guide-box { padding:30px 0; } 
.new-guide-box .nor-p { line-height:1.8; } 
.txt-r { text-align:right; } 
.p-ps { color:#999; font-size:14px; padding-top:15px; } 
.new-btn { width:127px; height:34px; padding:0; line-height:34px; text-align:center; font-size:13.64px; } 
.new-btn.t2 { background-color:#fff; color:#019a99; } 
[class^='tbl-row'] th { font-weight:bold; color:#333; } 
.select-t1 { height:28px; line-height:28px; padding:0 15px; } 
/*확인 팝업*/

.pop-submit { position:absolute; left:50%; top:50%; width:150px; height:100px; margin-left:-150px; margin-top:-150px; background-color:#e7e7e7; } 
.pop-submit .in { position:relative; } 

.pop-submit .close { width:15px; height:15px; text-indent:-99999px; background: url(//cdn.hackershrd.com/img_hrd/common/sp_icon.png) no-repeat; background-position:-125px -29px; } 

.refund_guide { line-height: 1.5; background: #f5f5f5; box-sizing: border-box; padding:15px; } 
.refund_guide h3 { margin-bottom: 5px; } 

/*단어장*/
.list-detail li { width:50%; margin-bottom:10px; } 
.list-detail li i.graphic-word { width:40px; height:40px; background:url('//gscdn.hackers.co.kr//hrd/img/myclass/ico_word.png')no-repeat 0 0; background-size:cover; } 


/* 개인정보처리 동의 */

.agree_area * { font-family: noto,sans-serif; color:#222; line-height: 1.5; } 
.agree_area h3 { font-size: 20px; } 
.agree_area .agree_txt { border: 1px solid #aaa; box-sizing: border-box; padding:30px 80px } 
.agree_area table { border-top: 1px solid #000; border-left: 1px solid #000; width: 100%; } 
.agree_area table th { background: #d9d9d9; color:#222 } 
.agree_area table th,
.agree_area table td { text-align: center; box-sizing: border-box; padding:5px 10px; font-size: 16px; word-break: keep-all; border-bottom: 1px solid #000; border-right: 1px solid #000; } 
.section-content table td .birthday { display: inline-block; height: 30px; box-sizing: border-box; padding-left: 10px; } 

.agree_area .agree_box { padding-left: 80px; font-size: 18px; height: 25px; line-height: 25px; margin:15px 0 } 
.agree_area .agree_box p { display: inline-block; margin-right: 50px; } 
.agree_area input[type="radio"] { height: 20px; padding-left: 26px; background: url("//cdn.hackershrd.com/img_hrd/common/sp_input.png") 0 0 no-repeat; display: inline-block; margin-top: -5px; } 
.agree_area input[type="radio"]:checked { background-position: 0 -22px; } 
.agree_area input[type="radio"] + label { display: inline-block; margin-right: 10px; } 

/* 익스팝업창 */
.ie_notice_layer { position:fixed; _position:absolute; top:0; left:0; width:100%; height:100%; z-index:100000; } 
.ie_notice_layer .bg { position:fixed; top:0; left:0; width:100%; height:100%; background-color:#000; z-index:99970; opacity:.8; filter:alpha(opacity=80); display: block } 
.ie_notice_layer .wrap { position:fixed; top:50%; left:50%; z-index:99980; text-align:center; transform: translate(-50%, -50%); width:700px; min-width:700px !important; } 
.ie_notice_layer .head { background: #29add6; text-align: left; padding: 18px 30px; } 
.ie_notice_layer .layer_close { position: absolute; display: block; top: 15px; right: 10px; } 
.ie_notice_layer .cont_txt { background: #fff; padding: 40px 50px; text-align: left; } 
.ie_notice_layer .cont_txt h3 { font-size: 36px; color: #000; line-height: 45px; font-weight: normal; border-bottom: 1px solid #ddd; padding-bottom: 25px; margin-bottom:25px; } 
.ie_notice_layer .cont_txt .fc_blue { color: #3bb2d9; } 
.ie_notice_layer .cont_txt>p { font-size:17px; line-height: 25px; color:#000; margin-bottom:40px; } 
.ie_notice_layer .cont_txt h5 { font-size:18px; color:#000; position:relative; padding-left:10px; } 
.ie_notice_layer .cont_txt h5::before { display: block; content: ""; position: absolute; top: 5px; left: 0; width: 4px; height: 16px; background: #3bb2d9; } 

.ie_notice_layer .browsers { width: 100%; background: #fafafa; padding: 25px 0; margin-top: 10px; } 
.ie_notice_layer .browsers p { padding-left:30px; line-height: 30px; font-size:15px; color:#000; } 
.ie_notice_layer .browsers a { color:#437aff; text-decoration: underline; margin-left:10px; } 

.ie_notice_layer .bx_close { height: 51px; padding-left: 20px; line-height: 51px; text-align: right; } 
.ie_notice_layer .bx_close label { display:inline-block; margin-right:18px; font-size:15px; color:#fff } 
.ie_notice_layer .bx_close label input { vertical-align: middle; } 
.ie_notice_layer .bx_close button { display:inline-block; width:78px; height:25px } 
.ie_notice_layer .bx_bnr { width:100%; height:auto } 
.ie_notice_layer_close { position:absolute; bottom:5px; right:0; } 
.ie_notice_layer .bx_close button.lypop_close { background:none; position:absolute; right:0; top:0 } 

/* hrd결제 팝업 */
.apply_pop { position: absolute; right: 310px; top: 60%; z-index: 250; width: 650px; display: none; } 
.apply_pop.active { display: block; } 
.apply_pop img { width: 100% } 
.apply_pop a { position: absolute; display: block; width: 245px; height: 55px; bottom: 29px; left: 12%; } 
.apply_pop a:nth-last-of-type(1) { left: 51%; } 
.apply_pop a.close { left: 92%; top:-50px; width: 50px; height:50px; } 
.apply_pop a.close::after, .apply_pop a.close::before { content: ''; display: block; background:#333; width: 1px; height: 50px; left: 50%; top:0; transform: rotate(45deg); position: absolute; } 
.apply_pop a.close::after { transform: rotate(-45deg); } 



.packageTitle.active td:nth-of-type(1) { border-bottom: none } 
.packageTitle .tit, .packageList .tit { font-size: 1.15rem; text-align: left; line-height: 1.45rem; margin-bottom: 10px; } 
.packageTitle span.term, .packageList span.term { text-align: left; color:#888; display: block; } 
.packageTitle .pkg_icon { display: inline-block; padding: 0px 8px; font-size: 0.9rem; color: #29a8a5; border: 1px solid #29a8a5; border-radius: 15px; } 
.packageTitle .list_btn { background: #fff; color:#019a99; transition: 0.5s all; } 
.packageTitle .list_btn:hover { background: #019a99; color:#fff; } 
.packageList td:nth-of-type(1) { position: relative; border-bottom: none } 
.packageList.endList td:nth-of-type(1) { border-bottom: 1px solid #ccc; } 
.packageList { display: none; } 
.packageList.active { display: table-row; } 
.packageList .list_icon { position: absolute; left:50%; top:50%; transform: translate(-50%, -50%); display: block; width: 8px; height: 8px; z-index: 9; border-radius: 50%; background: #bbb; border:3px solid #ddd } 
.packageList .list_icon::after { content: ''; position: absolute; width: 1px; border-left: 1px dashed #ddd; height: 70px; left: 41.8%; top: -80px; z-index: -1; } 

.select_package { } 
.select_package .select_option { display: flex; justify-content: space-between; align-items: center; margin: 10px auto; } 
.select_package .select_option p { font-size: 0.85rem; } 
.select_package .select_option p:nth-of-type(1) { color: #29a8a5; font-size: 0.85rem; font-weight: 700; letter-spacing: 0.05rem; } 
.select_package .select_option p:nth-of-type(2) { letter-spacing: 0.1rem; } 
.select_package .select_option p:nth-of-type(2) span { font-weight: 700; } 
.select_package .select_option p:nth-of-type(2) span em { color:#29a8a5; font-style: normal; } 
.select_package table { width: 100%; border-spacing:0; margin-bottom: 40px; } 
.select_package table th { background: #f5f5f5; border-top: 1px solid #333; padding:10px 0; border-bottom: 1px solid #ccc; } 
.select_package table th:nth-of-type(1),.select_package table td:nth-of-type(1) { border-right: 1px solid #ccc; } 
.select_package table td { padding: 12px 16px; border-bottom: 1px solid #ccc; position: relative; } 
.select_package table td.num { text-align: center; font-weight: 700; } 
.select_package table td input { position: absolute; left:50%; top:50%; transform: translate(-50%,-50%); display: block; width: 15px; height: 15px; z-index: 99; opacity: 0; } 
.select_package table td label { font-weight: 700; position: relative; } 
.select_package table td span { position: relative; display: block; margin: 0 auto; width: 20px; height: 20px; } 
.select_package table td span::before { content: ''; width: 15px; height: 15px; border-radius: 50%; border: 1px solid #999; position: absolute; top: 0; left:0; } 
.select_package table td span::after { content: ''; width: 9px; height: 9px; border-radius: 50%; background: #29a8a5; position: absolute; top: 20%; left: 20%; opacity: 0; } 
.select_package table td input[type="checkbox"]:checked + span::after { opacity: 1; } 


/* 강의 세부 리스트 */
.tit-box-h4 { position: relative; } 
.view_all_btn { display: block; width: 150px; height: 30px; position: absolute; left: 95px; top: 60%; transform: translateY(-50%); } 
.view_all_btn img { width: 100%; } 

.lect_table { display: flex; } 
.lect_table li { width: 50%; } 
.lect_table li table { width: 100%; } 
.lect_table .lect_tit { display: block; position: relative; } 
.lect_table .lect_tit span { display: inline-block; } 
.lect_table .lect_tit span:nth-of-type(1) { width: 15%; } 
.lect_table .lect_tit span:nth-of-type(2) { width: 85%; } 
.lect_table .lect_tit i { display: block; width: 15px; height: 8px; background: url('https://cdn.hackershrd.com/hrd/images/common/arrow_detail_btn.png') 0 0 no-repeat; background-size: 100% 100%; position: absolute; right: 3px; top: 50%; transform: translateY(-50%) rotate(180deg); } 
.lect_table .lect_tit:hover i { background: url('https://cdn.hackershrd.com/hrd/images/common/arrow_detail_btn2.png') 0 0 no-repeat; background-size: 100% 100%; } 
.lect_table .lect_tit.active i { transform: rotate(0deg); } 
.lect_table thead tr th:nth-of-type(1) { padding: 14px 14px; } 
.lect_table thead tr th:nth-of-type(2) { padding: 14px 0; text-align: center; } 
.lect_table td { padding: 0; border-bottom: none; } 
.lect_table td > div { border: 1px solid #e7e7e7; border-radius: 10px; padding: 10px 14px; margin: 5px 5px 5px 0; box-sizing: border-box; } 
.lect_table table:nth-last-of-type(1) td > div { margin: 5px 5px 0 5px; } 
.lect_table td:nth-last-of-type(1) { margin: 5px 5px 0 5px; } 
.lect_table td .detail_list { width: 100%; padding-top: 10px; margin-top: 10px; border-top: 1px solid #e7e7e7; display: none; } 
.lect_table td .detail_list.active { display: block; } 
.lect_table td .detail_list li { color: #999999; } 
.lect_table td .detail_list li::before { content: '·'; display: inline; margin-right: 5px; } 

/* 추천 강의 */
.lecture-recommend { padding-top: 60px; } 
.lecture-recommend .bx-wrapper .bx-viewport .bxslider li { width: 188px !important; } 
.lecture-recommend .bx-wrapper .bx-viewport .bxslider li a { display: block; width: 100%; } 
.lecture-recommend .bx-wrapper .bx-viewport .bxslider li a .lect_img { display: block; width: 100%; height: 122px; border-radius: 10px; overflow: hidden; margin-bottom: 8px; } 
.lecture-recommend .bx-wrapper .bx-viewport .bxslider li a .lect_img img { width: 100%; } 
.lecture-recommend .bx-wrapper .bx-viewport .bxslider li a .lect_tit { color: #222; font-weight: bold; } 
.lecture-recommend .bx-wrapper .bx-controls-direction a { width: 19px; height: 42px; background: url('https://cdn.hackershrd.com/img_hrd/common/sd_prev.png') 0 0 no-repeat; background-size: 100% 100%; margin-top: -20px; } 
.lecture-recommend .bx-wrapper .bx-prev { left: -40px; } 
.lecture-recommend .bx-wrapper .bx-next { transform: scale(-1); right: -40px; } 


/* 쿠폰 리스트 */
.coupon_wrap * { font-family: noto,sans-serif; color:#333; line-height: 1.75rem; } 
.coupon_wrap .tit-box-h4 h3 { display: inline-block; font-size: 23px; color: #333; font-weight: 700; margin: 20px 0; } 
.coupon_wrap .notice_txt { } 
.coupon_wrap .notice_txt li { margin-bottom: 5px; position: relative; padding-left: 15px; list-style: none; } 
.coupon_wrap .notice_txt li::before { content: ''; display: inline-block; width: 3px; height: 3px; border-radius: 50%; background: #333; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } 
.coupon_wrap .notice_txt li:nth-of-type(1):before { top:23% } 
.coupon_wrap .notice_txt li:last-of-type { margin-bottom: 0; } 
.text_hidden { position: absolute; clip: rect(0, 0, 0, 0); clip-path: inset(50%); width: 1px; height: 1px; overflow: hidden; white-space: nowrap; } 
.coupon_search { display: flex; justify-content: center; align-items: center; gap: 10px; width: 100%; margin: 15px auto; background: #f5f5f5; padding: 20px 0; border-radius: 15px; } 
.coupon_search label { display: block; width: 100px; font-size: 16px; font-weight: 700; } 
.coupon_search input { width: 300px; padding: 5px 15px; border: 1px solid #ddd; border-radius: 10px; font-size: 16px; font-weight: 700; } 
.coupon_search a { display: flex; justify-content: center; align-items: center; width: 100px; padding: 5px 15px; background: #4d4d4d; border-radius: 10px; font-size: 16px; font-weight: 700; text-align: center; color:#fff; } 
.coupon_search a span { display: inline-block; width: 13px; height: 13px; background: url('https://cdn.hackershrd.com/hrd/images/common/icon/arrow_w.png') 0 0 no-repeat; background-size: 100% 100%; margin-left: 5px; } 

.coupon_list_wrap .coupon_list_tab { width: 96%; margin: 15px 0; display: flex; align-items: center; } 
.coupon_list_wrap .coupon_list_tab li { width: 50%; } 
.coupon_list_wrap .coupon_list_tab a { width: 100%; display: block; text-align: center; border: 1px solid #999; padding: 15px; font-size: 16px; font-weight: 700; border-bottom: 2px solid #29a8a5; } 
.coupon_list_wrap .coupon_list_tab a.active { background: #29a8a5; color:#fff; border: 1px solid #29a8a5; border-bottom: 2px solid #29a8a5; } 

.coupon_list_content { display: none; } 
.coupon_list_content.active { display: block; } 
.coupon_list_content table { width: 100%; border-spacing: 0; border-collapse: collapse; } 
.coupon_list_content table thead th { background: #f5f5f5; border-bottom: 1px solid #ddd; padding:15px 0;; font-size: 16px; } 
.coupon_list_content table tbody td { background: #fff; text-align: center; border-bottom: 1px solid #ddd; padding:20px 0; color:#555; } 
.coupon_list_content table tbody td .coupon_use { display: flex; justify-content: center; align-items: center; gap: 2px; font-weight: 500; background: #29a8a5; color:#fff; padding: 4px 15px; border-radius: 10px; font-size: 14px; width: 65%; margin: 5px auto 0; } 
.coupon_list_content table tbody td .coupon_use .arrow { display: inline-block; width: 13px; height: 13px; background: url('https://cdn.hackershrd.com/hrd/images/common/icon/arrow_w.png') 0 0 no-repeat; background-size: 100% 100%; margin-left: 5px; } 
.coupon_list_content table tbody td .coupon_copy { display: flex; justify-content: center; align-items: center; gap: 5px; font-weight: 700; color: #333; font-size: 14px; margin-top: 5px; transition: 0.5s all; } 
.coupon_list_content table tbody td .coupon_copy:hover { color: #29a8a5; } 
.coupon_list_content table tbody td .coupon_copy span { display: block; width: 15px; height: 15px; background: url('https://cdn.hackershrd.com/hrd/images/common/icon/copy_icon.png') 0 0 no-repeat; background-size: 100%; transition: 0.5s all; } 
.coupon_list_content table tbody td .coupon_copy:hover span { background: url('https://cdn.hackershrd.com/hrd/images/common/icon/copy_icon02.png') 0 0 no-repeat; background-size: 100%; } 
.coupon_list_content table tbody td.coupon_use_wrap span { font-size: 15px; font-weight: 700; } 
.coupon_list_content table tbody td.coupon_use_wrap span.coupon_use_y { color: #29a8a5; } 
.coupon_list_content table tbody td .notice { color: #29a8a5; font-size: 14px; margin-top: 5px; display: block; } 
.coupon_list_content table tbody td .coupon_use_check { display: flex; justify-content: center; align-items: center; gap: 5px; } 
.coupon_list_content table tbody td .coupon_use_check li { display: flex; justify-content: center; align-items: center; gap: 5px; font-size: 16px; font-weight: 700; color:#333; } 
.coupon_list_content table tbody td .coupon_use_check li label { position: relative; padding-right: 25px; display: flex; justify-content: center; align-items: center; gap: 5px; font-size: 16px; font-weight: 700; color:#333; cursor: pointer; } 
.coupon_list_content table tbody td .coupon_use_check li input { position: absolute; opacity: 0; cursor: pointer; } 
.coupon_list_content table tbody td .coupon_use_check li label::before { content: ''; display: inline-block; width: 15px; height: 15px; border-radius: 50%; border: 1px solid #666; position: absolute; right: 0; top: 50%; transform: translateY(-50%); box-sizing: border-box; /* 추가 */ transition: all 0.2s; /* 추가 */ } 
.coupon_list_content table tbody td .coupon_use_check li label::after { content: ''; display: inline-block; width: 10px; height: 10px; border-radius: 50%; background: #29a8a5; position: absolute; right: 3px; top: 50%; transform: translateY(-50%); opacity: 0; transition: all 0.2s; /* 추가 */ } 
.coupon_list_content table tbody td .coupon_use_check li input:checked + label::after { opacity: 1; } 
.coupon_list_content table tbody td .coupon_use_check li input:checked + label::before { border-color: #29a8a5; /* 체크시 테두리 색상 변경 */ } 
.coupon_list_content table tbody td .coupon_use_check li input:checked + label span { color: #29a8a5; } 

.coupon_notice_toggle_btn { display: flex; justify-content: center; align-items: center; width: 150px; padding: 7px 15px; background: #29a8a5; color:#fff; font-size: 16px; font-weight: 700; text-align: center; border-radius: 10px; margin: 20px 0 0; cursor: pointer; position: relative; z-index: 9; } 
.coupon_notice_toggle_btn span { display: inline-block; width: 13px; height: 13px; background: url('https://cdn.hackershrd.com/hrd/images/common/icon/arrow_w.png') 0 0 no-repeat; background-size: 100% 100%; margin-left: 5px; } 

.coupon_wrap .more_txt { display: none; padding: 30px 20px 20px; border: 1px solid #29a8a5; border-radius: 20px; position: relative; top:-15px } 
.coupon_wrap .more_txt.active { display: block; }