@charset "UTF-8";

/*popup*/
.layer-wrap{display:none;position:fixed;top:0;left:0;width:100%;height:100%;z-index:100;}
.layer-wrap .bg{position:fixed;top:0;left:0;width:100%;height:100%;background-color:#000;z-index:1;opacity:.8;filter:alpha(opacity=80);}
.layer-wrap .close { position: absolute; top: 13px; right: 13px; width: 19px; height: 19px; background: url("//gscdn.hackers.co.kr/hackersbook/img/popup/pop_cls.png") no-repeat 0 0/19px; font-size: 0; text-indent: -9999px; } 
.layer-wrap .layer-box{position:fixed;top:50%;left:50%;transform: translate(-50%, -50%);z-index:54;}
.layer-wrap .layer-box h2{height:80px;line-height:80px;padding-left:27px;background:#2bbea4;color:#fff;}
.layer-wrap .layer-box .cont{background:#fff;}
.layer-wrap .layer-box .layer-cont { padding: 0 4% 4%; letter-spacing: -.05em; } 
.layer-wrap .layer-box .layer-cont p { padding: 12% 0; border-bottom: 1.1px solid #e6e6e6; margin-bottom: 4%; color: #575757; font-size: 16px; } 
.layer-wrap .layer-box .btn-confirm { display: inline-block; padding: 1.7% 17%; border: 1px solid #1fb99e; border-radius: 50px; color: #1fb99e; font-size: 14px; font-weight: bold; } 


/*total 공통*/
.total{text-align: center;background: #f0fafa;}


/*회원 동의 팝업*/
.layer-wrap.member-pop .close{position:absolute;top:27px;right:27px;display:inline-block;width:26px;height:26px;background:url("//gscdn.hackers.co.kr/hackersbook/img/popup/pop_cls_black.png") no-repeat;font-size:0;text-indent:-999999em;}
.layer-wrap.member-pop .layer-box{background:#fff;border-radius:18px;}
.layer-wrap.member-pop .layer-box h2{padding-left:20px;    font-size: 3.5vw;color:#000;background:transparent;border-bottom:2px solid #2bbea4;}
.layer-wrap.member-pop .layer-box .cont .custom-scroll{height:475px;padding:5% 3%;font-size:16px;color:#555;}
.layer-wrap.member-pop .layer-box .cont .agree-box.blur{position:relative;}
.layer-wrap.member-pop .layer-box .cont .agree-btn{display:block;width:90%;height:65px;line-height:65px;margin:10px auto 50px;text-align:center;border:1px solid #888;border-radius:8px;}
.layer-wrap.member-pop .layer-box .cont .agree-btn.on{background:#f0fafa;border-color:#d2dcdc;}
.layer-wrap.member-pop .layer-box .cont .input-sp{font-size:18px;color:#333;}
.layer-wrap.member-pop .layer-box .cont .input-sp i{margin-right:5px;}
.layer-wrap.member-pop .layer-box .cont .board-wrap{margin-bottom:15px;}

/*스마트검색 팝업*/
.layer-wrap .smart-search-pop { position: relative; top: 0; left: 0; height: 100%; transform: none; background: #fff } 
.layer-wrap .smart-search-pop h2 { height: 45px; line-height: 45px; color: #fff; font-size: 16px; vertical-align: middle; background: linear-gradient(90deg, #06bb9b, #0ab8d2); padding: 0 4%; } 
.layer-wrap .smart-search-pop h2:before { content: ''; display: inline-block; width: 30px; height: 30px; vertical-align: -8px; background-size: 375px auto; background-position: 0 -120px; margin-right: 4px; } 
.layer-wrap .smart-search-pop .cont {padding-bottom: 4%;}
/* .layer-wrap .smart-search-pop .step-wrap{background: #fff; float:left;} */
.layer-wrap .smart-search-pop .step-wrap dl dt{background:#f9f9f9 !important;color:#0f9580 !important;}
.layer-wrap .smart-search-pop .step-wrap dl dd{height:380px !important;}
.layer-wrap .smart-search-pop .step-wrap dl.step-03 ul{overflow:hidden;padding:20px 20px 0;}
.layer-wrap .smart-search-pop .step-wrap dl.step-03 ul li{float:left;width:33.333%;padding:0 0 30px;text-align:center;}
.layer-wrap .smart-search-pop .step-wrap dl.step-03 ul li a:hover img{border:2px solid #000;}
.layer-wrap .smart-search-pop .step-wrap dl.step-03:after{content:'';width:96%;position:absolute;bottom:0;right:0;box-shadow:0 0 20px 20px rgba(255,255,255,0.9);}
.layer-wrap .smart-search-pop .btn-reset { display: flex; justify-content: center; align-items: center; position: relative; width: 13%; height: 40px; line-height: 40px; border: 1px solid #e4e4e4; border-radius: 0; background: #fff; } 
.layer-wrap .smart-search-pop .btn-search { display: block; width: 92%; height: 50px; line-height: 50px; border-radius: 6px; margin: 4% auto 0; background: #555; color: #fff; font-size: 18px; text-align: center; } 


/*만족도 설문 팝업*/
.satisfaction-pop h2{border-radius:18px 18px 0 0;}
.satisfaction-pop .cont{padding:40px;height:600px;overflow-y:auto;}
.satisfaction-pop .cont .tit{padding-bottom:20px;font-size:16px;color:#888;letter-spacing:-1px;border-bottom:1px solid #dcdcdc;}
.satisfaction-pop .cont .tit strong{display:block;font-size:20px;color:#000;}
.satisfaction-pop .cont table th{padding-top:30px;text-align:left;font-size:18px;color:#333;}
.satisfaction-pop .cont table td{padding-top:24px;}
.satisfaction-pop .cont table td label .input-txt{padding-left:3px;font-size:16px;color:#555;}
.satisfaction-pop .cont table td textarea{width:100%;resize:none;padding:20px;font-size:16px;background:#f8f8f8;border:1px solid #e8e8e8;border-radius:8px;}
.satisfaction-pop .cont table td textarea.placeholder{color:#aaa;}
.satisfaction-pop .cont .head-tit{font-size:24px;color:#0ca78c;font-weight:bold;}
.satisfaction-pop .cont .btn-wrap{margin-top:30px;text-align:center;}
.satisfaction-pop .cont .btn-wrap a{width:160px;}
.satisfaction-pop .cont .btn-wrap a:first-child{margin-right:5px;}

/*구매하기 레이어*/
.book-buy-layer{display:none;position:absolute;top:-85px;left:50% !important;transform:translateX(-50%)!important;width:100%;padding: 2.5% 0;background:rgba(0,0,0,0.5);border-radius:13px;z-index:2;box-shadow:0 8px 10px rgba(0,0,0,0.15);}
.book-list-area > ul > li> .book-bottom .book-buy-layer ul li a{border:0}
.book-buy-layer:after{content:"";position:absolute;bottom:-10px;left:63%;border-top:10px solid rgba(0,0,0,0.5);border-left:10px solid transparent;border-right:10px solid transparent;border-bottom:0 solid transparent;}
.book-buy-layer ul{overflow:hidden;max-width: 100%;display: flex;justify-content: space-evenly;align-items: center;}
.book-buy-layer ul li{/*margin-right: 2%;*/width: 17%;}
.book-buy-layer ul li:last-child,
.book-buy-layer ul li:nth-child(5n+0){margin-right:0 !important;}
.book-buy-layer ul li a{display: block;}
.book-buy-layer ul li a img{width:100%}

/*찜 레이어,url 복사 레이어 */
.pick-box,
.pick-discard-box,
.book-summary-cont .link-layer
{display:none;position:fixed;top:50%;left:50%; transform: translate(-50%, -50%);width:280px;height:280px;color:#fff;font-size:14px;background:rgba(23,172,146,.75);border-radius:50%;text-align:center;z-index:1;}
.pick-box i,
.pick-discard-box i,
.book-summary-cont .link-layer i{display:block;width:50px;height:50px;margin:58px auto 12px;background:url("//gscdn.hackers.co.kr/hackersbook/img/common/sp_btn.png") no-repeat;background-position:0 -106px;vertical-align:middle;font-size:0;text-indent:-999999em;    background-size: 300px;}
.pick-discard-box i{opacity:0.3;}
.pick-box h3,
.pick-discard-box h3{margin-bottom:10px;font-size:24px;}
.pick-box strong{display:block;}

/*url 복사 레이어*/
.book-summary-cont .link-layer {}
.book-summary-cont .link-layer i{width: 47px;height: 61px;background:url("//gscdn.hackers.co.kr/hackersbook_m/sub/clip_wh-icon.png") no-repeat 0 0/100%;}


/*단어시험 출제하기 팝업-출제범위 */
.test-paper{ height: 100%;overflow-y: scroll; overflow-x: hidden;position: fixed;z-index: 100; top:0; background: #fff; }
.test-paper h2 { height: 45px; line-height: 45px; padding-left: 3%; font-size: 18px; letter-spacing: -1px; color: #fff; background: linear-gradient(90deg, #06bb9b, #0ab8d2); } 
.test-paper h2 span{font-size: 12px;font-weight: 300;}
.test-paper .close { position: absolute;top: 0;right: 1%;transform: translateY(50%); display: inline-block; width: 26px; height: 26px;background: url(//gscdn.hackers.co.kr/hackersbook/img/popup/pop_cls.png) no-repeat; font-size: 0; text-indent: -999999em; background-size: 70%;}
.test-paper .cont{background: #fff;}
.test-paper .cont.cont04{padding: 8% 4% 4%;}
.test-paper .layer-wrap .voca_test_pop .voca-select-wrap .title {position: relative;}
.test-paper .voca-select-wrap h3{height: 75px; text-align: center; padding: 3.5% 0;font-size: 16px;}
.test-paper .voca-select-wrap h3 p{font-weight: 300;font-size: 14px; color: #666; letter-spacing: -1px;}
.test-paper .voca-select-wrap .title{position: relative;}
.test-paper .voca-select-wrap .title a{position: absolute;width: 10%;top: 50%;transform: translate(-50%,-50%);margin: 0;display: inline-block;text-align: center;}
.test-paper .voca-select-wrap .title a.prev-btn{left:5%;}
.test-paper .voca-select-wrap .title a.next-btn{right:-5%;}
.test-paper .voca-select-wrap .title a img{width:40%}
.test-paper .voca-select-wrap {height: auto;padding-bottom: 50px;}
.test-paper .voca-select-wrap .select-area .tit{background: #444;color: #fff;padding: 0 4%;}
.test-paper .voca-select-wrap .select-area .tit span.tit_wrap{display: inline-block;width: 100%;}
.test-paper .voca-select-wrap .select-area .tit span.tit_wrap.w1{width: 92%;}
.test-paper .voca-select-wrap .select-area .tit.hg50{display: flex;justify-content: space-between; align-items: center;}
.test-paper .voca-select-wrap .select-area .tit.hg50 span.tit_wrap.w1{width: 75%;}
.test-paper .voca-select-wrap .select-area .tit h3{display: inline-block; font-size: 1rem;padding:0;height:auto}
.test-paper .voca-select-wrap .select-area .tit h3:before{}
.test-paper .voca-select-wrap .select-area .tit h3 span{padding-left: 0.1rem; font-size: 12px; color:#aaa;letter-spacing: -0.07rem;font-weight: normal}
.test-paper .voca-select-wrap .select-area .tit h3 + span{padding-left: 0.1rem; font-size: 12px; color:#aaa;letter-spacing: -0.07rem;font-weight: normal}
.test-paper .voca-select-wrap .select-area .tit .input-sp {font-size: 16px;color: #fff;display: flex;justify-content: center;align-items: center;}
.test-paper .voca-select-wrap .select-area .tit b{background: url('//gscdn.hackers.co.kr/hackersbook/img/common/lnb_ico2.png') no-repeat 0 0/100%;width: 3.5vw;height: 3.5vw;margin-right: 3%;transform: translateY(25%) rotateX(0);display: inline-block;}
.test-paper .voca-select-wrap .select-area .tit.on b{transform: translateY(-10%) rotateX(180deg);}
.test-paper .voca-select-wrap .select-area .input-sp .input-txt{font-size: 12px; color:#fff;letter-spacing: -0.07rem;font-weight: normal;margin-right: 10px;}

.test-paper .voca-select-wrap .board-wrap.v2{box-shadow: 0 5px 4px rgb(0 0 0 / 10%);padding: 0;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1{width: 100%;display: inline-block;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 thead,.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 tbody{width: 100%;display: inline-block;padding: 0 3.5%;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 thead{background: #f9f9f9;border-bottom: 1px solid #e6e6e6;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 tbody{height: 100vw;overflow: auto;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 tr{width: 100%;display: inline-flex;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 th{padding: 4% 0 ;color: #2c2c2c;font-weight: 700;border: 0;display: inline-flex;align-items: center;justify-content: center;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1.board-table1 th:nth-child(1),
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1.board-table1 td:nth-child(1){width:25%;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 th:nth-child(2),
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 td:nth-child(2){width:25%;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 th:nth-child(3),
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 td:nth-child(3){width:15%;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 th:nth-child(4),
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 td:nth-child(4){width:20%;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 th:nth-child(5),
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 td:nth-child(5){width:15%;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 th p{font-size: 0.8rem;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 td{border-bottom: 0;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 td.star-hard{display: flex;align-items: center;justify-content: center;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 i.ico_ud{width: 12px;height: 6.5px;margin: 6% 5%;position: relative;top: 50%;transform: translateY(25%);}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 i.ico-up{background: url('//gscdn.hackers.co.kr/hackersbook_m/sub/ico_up.png') no-repeat 0 0/100%;background-position: 100% 0;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 i.ico-down{background: url('//gscdn.hackers.co.kr/hackersbook_m/sub/ico_down.png') no-repeat 0 0/100%;background-position: 0% 0;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 i.ico-up.on{background-position-y: 100%;}
.test-paper .voca-select-wrap .board-wrap.v2 table.board-table1 i.ico-down.on{background-position-y: 100%;}



.voca-select-wrap .select-area .selectBtn{display:inline-block;width:21px;height:21px;line-height:20px;text-align:center;border-radius:3px;border:1px solid #e0e0e0;background:#e0e0e0;color:#fff;cursor:pointer;}
.voca-select-wrap .select-area .selectBtn.on.kor{border-color:#11a321;background:#1bb52c;}
.voca-select-wrap .select-area .selectBtn.on.eng{border-color:#129ce2;background:#17acf8;}

.voca-select-wrap .test_paper_btm_sys{width: 100%;padding: 4%;display: flex;justify-content: space-between;align-items: center;box-sizing: border-box;}
.voca-select-wrap .test_paper_btm_sys li{display: flex;}
.voca-select-wrap .test_paper_btm_sys span{font-size: 0.7rem;letter-spacing: -0.05rem;flex-flow: nowrap row;display: -webkit-box;white-space: nowrap;}
.voca-select-wrap .test_paper_btm_sys .selectBtn{display:inline-block;width:15px;height:15px;line-height: 13px;text-align: center;border-radius: 3px;border: 1px solid #e0e0e0;background: #e0e0e0;font-size: 10px;margin-right: 6px;color: #fff;}
.voca-select-wrap .test_paper_btm_sys .selectBtn.on.kor{border-color:#11a321;background:#1bb52c;}
.voca-select-wrap .test_paper_btm_sys .selectBtn.on.eng{border-color:#129ce2;background:#17acf8;}

.voca-select-wrap .select-area ul li.has-sub{background: #f9f9f9;}
.voca-select-wrap .select-area ul li.has-sub label{height:40px; line-height:40px;letter-spacing: -1px;color: #333;}
.voca-select-wrap .select-area ul li.has-sub label.stit_wrap{display: inline-block;width: 92%;padding-left: 30px;margin: 0 !important;color:#666;font-weight: bold;}
.voca-select-wrap .select-area ul li.has-sub label b{margin: 0 3%;}
.voca-select-wrap .select-area ul li.has-sub ul li{border-bottom:0;}
.voca-select-wrap .select-area ul li.has-sub ul li .input-sp{top:3px;right:0;text-align: right;padding-right: 4%;}
/* .voca-select-wrap .select-area ul li.has-sub ul{display: none;height:300px;overflow-y: scroll;} */
.voca-select-wrap .select-area ul li.has-sub::before{ background: url(//gscdn.hackers.co.kr/hackersbook_m/common/lnb_ico.png) no-repeat; background-size: 200px auto;display: inline-block; position: absolute;top: 14px;left: 3%;content: '';width: 20px;height: 12.5px; background-position: 2px -24px}
.voca-select-wrap .select-area ul li.has-sub.on::before{background-position: -20px -24px;}
.cont01 .voca-select-wrap .select-area ul li.has-sub::before{ background: url('//gscdn.hackers.co.kr/hackersbook/img/common/sp_select2.png') no-repeat;background-size: 100% auto;display: inline-block;position: absolute;top: 16px;left: 4%;content: '';width: 15px;height: 11.5px;background-position: 0 !important;}
.cont01 .voca-select-wrap .select-area ul li.has-sub.on::before{transform: rotate(180deg);}
.voca-select-wrap .select-area ul li.has-sub .input-sp{position: absolute; right: 4%; top: 0;}

.voca-select-wrap .select-area ul li {width: 100%; margin: 0 auto;position: relative;background: #fff;border-bottom: 1px solid #e6e6e6;font-weight: 300;}
.voca-select-wrap .select-area ul>li> div{line-height: 50px;display: flex;align-items: center;}
.voca-select-wrap .select-area ul>li> div > span{width: 10%;text-align: center;display: block;max-width: 60px;position: relative;color:#a0a0a0;}
.voca-select-wrap .select-area ul>li> div > span::after{content: "";height: 30%;width: 1px; background: #EBEBEB; position: absolute;right: 20%;top: 50%; transform: translateY(-50%);}
.voca-select-wrap .select-area ul>li> div> label:nth-child(2){width:80%; color: #555;}
.voca-select-wrap .select-area ul>li> div> label:nth-child(3){width:10%;}
.voca-select-wrap .select-area ul>li ul{display: none;width: 100%;height: 30%;overflow-y: auto;background: #fff;}
.voca-select-wrap .select-area ul>li.on ul{display: block;}

.select-area .num-box{padding:3%;width:100%;display: inline-block; box-shadow: inset 0 -5px 4px rgb(0 0 0 / 10%);padding: 6%  3% 3%;}
.select-area .num-box .total{padding: 5%; font-size: 18px; font-weight: 600;}
.select-area .num-box ul li {display: inline-block;width: 50%;font-size: 14px;color: #666;letter-spacing: -2px;border:0;float: left; height:30px;}
.select-area .num-btn-area{padding: 4%;width: 100%;background: #fff;position: fixed;bottom: 0;z-index: 999;box-shadow: inset 0 5px 4px rgb(0 0 0 / 11%);}
.select-area .num-btn{width: 100%;background: #2bbea4; display: inline-block; margin: 0 auto;box-sizing: border-box;padding: 3.5% 5%;border-radius: 6px;color: #fff; text-align: center;font-size: 18px; letter-spacing: -0.05rem;font-weight: 600;}

/*단어시험 출제하기 팝업-출제 문제수 */
.count-box .ico-arr-right-small{width: 5vw; height: 5vw;background: url('//gscdn.hackers.co.kr/hackersbook/img/common/sp_ico_v3.png') no-repeat;background-position: 0;background-size: 4vw;margin-left: 2%;}
.count-box .count-sub em{display: inline-block; width: 18px;height: 18px; line-height: 18px; text-align: center;border-radius: 3px; border: 1px solid #11a321; background: #1bb52c; color: #fff; font-size: 12px;}
.count-box .count-sub em.kor + strong{color: #1bb52c;margin-left: 5px;}
.count-box .count-sub em.eng + strong{color: #17acf8;margin-left: 5px;}
.count-box .count-sub em.eng{border-color: #129ce2;background: #17acf8;}
.count-box .count-sub dt{display: flex;background: #f9f9f9;border-bottom: 1px solid #d7d7d7;padding-right: 3%;}
.count-box .count-sub dd{display: flex;padding: 0 3%;}
.voca-select-wrap .select-area .count-box dl dt .info{width:78%;line-height: 40px;height: 40px;position:relative;padding-left: 11%;font-weight: 700;}
.voca-select-wrap .select-area .count-box dl dt .info::before{background: url('//gscdn.hackers.co.kr/hackersbook_m/common/lnb_ico.png') no-repeat; background-size: 200px auto;display: inline-block;position: absolute;top: 14px; left: 0;content: '';width: 20px; height: 12.5px;background-position: -20px -24px;}
.voca-select-wrap .select-area .count-box dl.on dt .info::before{background-position: 2px -24px;}
.cont01 .voca-select-wrap .select-area .count-box dl dt .info::before{background: url('//gscdn.hackers.co.kr/hackersbook/img/common/sp_select2.png') no-repeat;background-size: 100% auto;display: inline-block;position: absolute;top: 14px;left: 5.5%;content: '';width: 15px;height: 11.5px;background-position: 0 !important;}
.cont01 .voca-select-wrap .select-area .count-box dl.on dt .info::before{transform: rotate(180deg);}
.voca-select-wrap .select-area .count-box .counting{width:30%;line-height: 40px;height: 40px;display: flex;align-items: center;}
.voca-select-wrap .select-area .count-box .count-sub .counting a{width: 25%;display: inline-flex;height: 60%;border-radius: 3px;border: 1px solid #e6e6e6;background: #e6e6e6;color: #000;justify-content: center;align-items: center;font-weight: 700;font-size: 1rem;}
.voca-select-wrap .select-area .count-box .count-sub .counting input{width:60%;border: 0;background: transparent; line-height: 40px;height: 40px;text-align: center;text-indent: 0;}
.voca-select-wrap .select-area .count-box{width:100%;/*padding: 0 3%;*/}
.count-box .count-sub dd span{width:75%;line-height: 10vw;text-indent: 10%;color: #666;}
.count-box .count-sub dd span::before{content: '└'; margin-right: 5px; font-family: 'NanumGothic';}
.count-box .count-sub dd .counting{width:25%}
.count-box .count-sub dd .counting a::before{background:none}

.select-area.v2 .tit{display: flex;align-items: center;}
.select-area.v2 .tit h3{width:auto;}
.select-area.v2 .tit span{width:55%;}
.select-area.v2 .tit select{width:25%;font-size: 0.75rem;border:0;color:#fff;background: url('//gscdn.hackers.co.kr/hackersbook/img/common/sp_select_wh.png') no-repeat 95% 50%;background-size: 3.3vw;}

.test-paper .voca-select-wrap .select-area.v3 .tit{position: relative;padding:4% 3.5%}
.test-paper .voca-select-wrap .select-area.v3 .tit .reset{position: absolute; right: 3%;display: inline-flex;justify-content: space-between;align-items: center;color: #fff;}
.test-paper .voca-select-wrap .select-area.v3 .tit .reset span{display: inline-block;position: relative;top: 1px;font-size: 0.8rem;}
.test-paper .voca-select-wrap .select-area.v3 .search-box{display: flex;margin-top:10px;justify-content: space-between;}
.test-paper .voca-select-wrap .select-area.v3 .search-box input[type="text"] {width: 77%;height: 35px;text-indent: 5px !important;}
.test-paper .voca-select-wrap .select-area.v3 .search-box a{width: 20%; /*margin-left: 5%;*/ background: linear-gradient(90deg, #06bb9b, #0ab8d2); border-radius: 6px; color: #fff; font-weight: 600; text-align: center; line-height: 9.5vw;}
.test-paper .voca-select-wrap .select-area.v3 .ico-refresh.v3{margin-left: 5px;}

/*단어시험 출제단어선택- 출제리스트 */
.test-paper .voca-select-wrap .select-area.v3 .tab-type2-cont.on .board-wrap{padding: 0;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2{width: 100%;display: inline-block;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 thead,.test-paper .voca-select-wrap .select-area.v3 table.board-table2 tbody{width: 100%;display: inline-block;padding: 0 3%;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 thead{background: #f9f9f9;border-bottom: 1px solid #e6e6e6;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 tbody{height: 100vw;overflow: auto;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 tr{width: 100%;display: inline-flex;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 th{padding: 4% 0;color: #2c2c2c;font-weight: 700;border: 0;display: inline-flex;align-items: center;justify-content: center;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 th:nth-child(1),
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 td:nth-child(1){width:30%}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 th:nth-child(2),
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 td:nth-child(2){width:30%}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 th:nth-child(3),
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 td:nth-child(3){width:25%}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 th:nth-child(4),
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 td:nth-child(4){width:15%}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 th p{font-size: 0.8rem;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 td{border-bottom: 0;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 i.ico_ud{width: 12px;height: 6.5px;margin: 6% 5%;position: relative;top: 50%;transform: translateY(25%);}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 i.ico-up{background: url('//gscdn.hackers.co.kr/hackersbook_m/sub/ico_up.png') no-repeat 0 0/100%;background-position: 100% 0;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 i.ico-down{background: url('//gscdn.hackers.co.kr/hackersbook_m/sub/ico_down.png') no-repeat 0 0/100%;background-position: 0% 0;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 i.ico-up.on{background-position-y: 100%;}
.test-paper .voca-select-wrap .select-area.v3 table.board-table2 i.ico-down.on{background-position-y: 100%;}

.test-paper .voca-select-wrap .select-area.v3 .tab-type2{width:100%;margin-bottom: 0;}
.test-paper .voca-select-wrap .select-area.v3 .tab-type2 li{width:33.33%;/*height:60px;*/padding:2% 0;float:left;border-bottom:0;background:#e0f6f3;border-right: 1px solid #d1dfdf;}
.test-paper .voca-select-wrap .select-area.v3 .tab-type2 li:last-child{border: 0;border-radius: unset;}
.test-paper .voca-select-wrap .select-area.v3 .tab-type2 li a{color:#666;width: 100%;}
.test-paper .voca-select-wrap .select-area.v3 .tab-type2 li a span{font-size: 12px;}
.test-paper .voca-select-wrap .select-area.v3 .tab-type2 li.on{background:#06bb9b}
.test-paper .voca-select-wrap .select-area.v3 .tab-type2 li.on a{color:#fff;font-weight: 600;}
/*단어시험 출제단어선택- 출제리스트- 영단어 첫글자 보여주기*/
.test-paper .voca-select-wrap .select-area.v3 .first-eng{border-bottom: 1px solid #666;display: flex;justify-content: space-between;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng .switch {position: relative;display: inline-block; width: 26px;height: 16px;vertical-align:middle;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng .switch input {display:none;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng .switch .slider {position: absolute;cursor: pointer;  top: 0;left: 0;right: 0; bottom: 0;background-color: #999;-webkit-transition: .4s;transition: .4s;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng .switch .slider:before {position: absolute;content: ""; height: 10px;width: 10px;left: 3px;bottom: 3px;background-color: white;-webkit-transition: .4s;transition: .4s;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng .switch input:checked + .slider {background-color: #06bb9b;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng .switch input:focus + .slider {box-shadow: 0 0 1px #06bb9b;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng .switch input:checked + .slider:before { -webkit-transform: translateX(10px);-ms-transform: translateX(10px);transform: translateX(10px);}
.test-paper .voca-select-wrap .select-area.v3 .first-eng .switch .slider.round { border-radius: 34px;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng .switch .slider.round:before {border-radius: 50%;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng p {margin:0px;display:inline-block;font-size:13px;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng span.area2{display: flex;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng a{color:#2bbea4;font-size:0.83rem;text-align: end;opacity: 0.6;margin-left: 5px;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng a.on{opacity: 1;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng a.quest:before{content:'';display:inline-block;width: 22px;height: 13px;background: url('//gscdn.hackers.co.kr/hackersbook_m/common/sp_layout2.png') no-repeat; background-size: 380px auto;background-position: -136px -124px;}
.test-paper .voca-select-wrap .select-area.v3 .first-eng a.arrang:before{content:'';display:inline-block;width: 17px;height: 12px;background: url('//gscdn.hackers.co.kr/hackersbook_m/common/arrang-icon.png') no-repeat 0 0/100%;position: relative;right: 3px;}

/*단어시험 출제하기- 저장 및 다운로드*/
.select-area.v3 .info{padding: 3%;text-align: center;display: flex; align-items: center;justify-content: center;}
.select-area.v3 .ico-arr-right-small{width: 14px; height: 13px;background: url('//gscdn.hackers.co.kr/hackersbook/img/common/sp_ico_v2.png') no-repeat;background-position: 0 -11px;}
.select-area.v3 em{display: inline-block; width: 18px;height: 18px; line-height: 18px;font-size: 12px;text-align: center;border-radius: 3px; border: 1px solid #11a321; background: #1bb52c; color: #fff;}
.select-area.v3 em.kor + strong{color: #1bb52c;margin-left:5px}
.select-area.v3 em.eng + strong{color: #17acf8;margin-left:5px}
.select-area.v3 em.eng{border-color: #129ce2;background: #17acf8;}
.select-area.v3 .total{padding:3%; margin:3%}
.select-area.v3 .total p{font-size: 18px;}
.select-area.v3 .total span{display: inline-block; margin-top: 10px; font-size: 13px; }
.select-area.v3 .edit-box{margin: 30px 0; padding: 0 4%;}
.select-area.v3 .edit-box .tit2{position: relative;}
.select-area.v3 .edit-box .tit2 span{position: absolute; right: 0; top: 0; font-size: 12px; font-weight: 300;color:#888}
.select-area.v3 .edit-box .tit2 span input[type="checkbox"]{display: none;}
.select-area.v3 .edit-box .tit2 span input[type="checkbox"] + label {color: #333;font-size: 14px;}
.select-area.v3 .edit-box .tit2 span input[type="checkbox"] + label:after { content: ""; display: inline-block; width: 18px; height: 18px; background: url(//gscdn.hackers.co.kr/hackersbook_m/popup/icon_chkbox.png)no-repeat 0 0/200%; vertical-align: text-top; margin-left: 6px; } 
.select-area.v3 .edit-box .tit2 span input[type="checkbox"]:checked + label:after {background-position-x: 100%;}
.select-area.v3 .edit-box ul li input[type="text"]{width:100%;height: 36px;background-color: #fff; border-radius: 5px;}
.select-area.v3 .edit-box span.date_pick input { padding-left: 30px; box-sizing: border-box; background: #fff url(//gscdn.hackers.co.kr/hackersbook_m/popup/ico_date.png)no-repeat 10px center; background-size: 20px auto; color: #0ca78c; } 
.select-area.v3 .edit-box ul li{height:auto;border-bottom:0;margin-bottom:20px;}
.select-area.v3 .edit-box ul li span{display: inline-block;}
.select-area.v3 .edit-box ul li p{margin-bottom: 5px;font-weight: 600;font-size: 14px;}
.select-area.v3 .edit-box .tit2 .filetype{position:relative;align-items: center;width:100%;display: flex;}
.select-area.v3 .edit-box .tit2 .filetype .file-select { position: relative; display: inline-block; width: 76px; height: 36px; line-height: 36px; margin-left: 5px; text-align: center; border: 1px solid #15bfa1; border-radius: 5px; } 
.select-area.v3 .edit-box .tit2 .filetype .file-select .file-btn { width: 100%; height: 100%; font-size: 14px; letter-spacing: -.05em; color: #15bfa1; z-index: 1; } 
.select-area.v3 .edit-box .tit2 .filetype .file-select .input-file{position:absolute;top:0;left:0;width:100%;height:100%;filter:alpha(opacity=0);opacity:0;cursor:pointer}
.select-area.v3 .edit-box .tit2 .filetype label{flex-grow: 1;margin-right: 1.6%;}
.select-area.v3 .edit-box .tit2 .filetype .file-text { position: relative; width: 100%; padding-right: 50px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; display: inline-block; height: 36px; line-height: 36px; z-index: 10; text-align: left; text-indent: 8px; color: #aaa; border: 1px solid #e8e8e8; border-radius: 5px; vertical-align: middle; box-sizing: border-box; font-size: 13px; text-indent: 10px; } 
.select-area.v3 .edit-box .tit2 .filetype .file-text .file-remove{position:absolute;display:inline-block;width:20px;height:20px;position:absolute;top:50%;margin-top:-10px;right:10px;background:url("//gscdn.hackers.co.kr/hackersbook/img/common/sp_ico.png") no-repeat -111px -74px;}
.select-area.v3 .edit-box .logo p{display: inline-block;}
.select-area.v3 .edit-box .logo .switch {position: relative;display: inline-block; width:74px;height: 26px;vertical-align:middle;}
.select-area.v3 .edit-box .logo .switch input {display:none;}
.select-area.v3 .edit-box .logo .switch .slider {position: absolute;cursor: pointer;  top: 0;left: 0;right: 0; bottom: 0;background-color: #999;-webkit-transition: .4s;transition: .4s;}
.select-area.v3 .edit-box .logo .switch .slider:before {position: absolute;content: ""; height: 17px;width: 17px;left: 6px;bottom: 5px;background-color: white;-webkit-transition: .4s;transition: .4s;}
.select-area.v3 .edit-box .logo .switch input:checked + .slider {background-color: #06bb9b;}
.select-area.v3 .edit-box .logo .switch input:focus + .slider {box-shadow: 0 0 1px #06bb9b;}
.select-area.v3 .edit-box .logo .switch input:checked + .slider:before { -webkit-transform: translateX(45px);-ms-transform: translateX(45px);transform: translateX(45px);}
.select-area.v3 .edit-box .logo .switch .slider.round { border-radius: 34px;}
.select-area.v3 .edit-box .logo .switch .slider.round:before {border-radius: 50%;}
.select-area.v3 .edit-box .logo .on_off {position: absolute;left: 34px; color: #fff; font-size: 14px; line-height: 26px; font-weight: 700; font-weight: normal; }
.select-area.v3 .edit-box .line{height:41px;}
.select-area.v3 .edit-box .line p{line-height:41px;}

.select-area.v3 .edit-box .line .change_line{position: absolute;right: 0;top: 3px;}
.select-area.v3 .edit-box .line .change_line input{display: none;}
.select-area.v3 .edit-box .line .change_line input+label{display: inline-block;width: 36px !important;height: 36px;background: #fff url("//gscdn.hackers.co.kr/hackersbook_m/popup/line_icon.png")no-repeat 0px center;background-size: auto 36px;margin-left: 10px;}
.select-area.v3 .edit-box .line .change_line .line1 input:checked+label{background-position:-94.5px;}
.select-area.v3 .edit-box .line .change_line .line2 input+label{background-position: -47px;}
.select-area.v3 .edit-box .line .change_line .line2 input:checked+label{background-position: -142px;}

.select-area.v3 .edit-box .layout p{display: inline-block; line-height: 36px;}
.select-area.v3 .edit-box .layout a { border: 1px solid #2bbea4; text-align: center; border-radius: 5px; height: 36px; line-height: 36px; float: right; color: #2bbea4; font-size: 14px; width: 76px; } 

.select-area.v3 .btn-wrap.down{width:100%;padding:3%;text-align:center;}
.select-area.v3 .btn-wrap.down a{display:inline-block;width:30%;margin-right:4%;}
.select-area.v3 .btn-wrap.down a:last-child{margin-right: 0;}
.select-area.v3 .btn-wrap.down a img{width:100%;}

/* 팝업-공통*/
.alert_pop { width: 90%; height: auto; margin: 0 auto; text-align: center; background: #fff; border-radius: 8px; word-break: keep-all;} 
.alert_pop h3 { background: #2bbea4; height: 46px; text-align: left; line-height: 46px; padding: 0 4.2%; color: #fff; border-radius: 8px 8px 0 0; font-size: 17px;margin: 0; }
.alert_pop span{width: 90%;margin: 0 auto;display: block;padding: 10% 0% 9%;font-size: 1rem;color: #5a5a5a;letter-spacing: -0.05rem;border-bottom: 1px solid #ebebeb;}
.alert_pop .close-submit{display: inline-block;padding: 5%;text-align: center;width: 100%;}
.alert_pop .close-submit span{padding: 1.5% 15%;border: 1px solid #1fb99e;border-radius: 35px;font-weight: 600;color: #1fb99e;display: inline-block;width: auto;}
.alert_pop .close-submit.w50{width: 50%;float: left;text-align: right;padding: 5% 2%;}
.alert_pop .close-submit.w50 span{padding: 1.5% 25%;}

/* QNA 팝업 */

/*고객센터 팝업*/
.alert_pop .close-cancel{display: inline-block;padding: 5%;text-align: center;/*margin-left:10px;*/width: 100%;}
.alert_pop .close-cancel span{padding:1.5% 15%; border: 1px solid #888; border-radius: 35px; font-weight: 600;color:#888;display: inline-block;width: auto;}
.alert_pop .close-cancel.w50{width: 50%;text-align: left;padding: 5% 2%;}
.alert_pop .close-cancel.w50 span{padding: 1.5% 25%;}

/* 다운로드할 시험지 유형 선택 팝업 */
#alert_pop17 ul > li a .book-ico-down {margin-left: 5px;}

/*이벤트 페이지 공유하기 팝업*/
.share_pop{width: 90%; height: auto; margin: 0 auto;text-align: center; background: #fff;border-radius: 10px;}
.share_pop h3{background: #2bbea4; height: 46px; text-align: left; line-height: 46px; padding-left: 10px;color: #fff;border-radius: 10px 10px 0 0;font-size: 17px;margin: 0;}
.share_pop> div{display:inline-block;padding:7% 3% 2%;border-bottom: 1px solid #ebebeb;}
.share_pop ul li{float: left;width:33.33%;margin-bottom:15px}
.share_pop ul li:nth-child(3n){margin-right: 0;}
.share_pop ul li a{display: inline-block;padding: 5%;text-align: center;width: 100%;}
.share_pop ul li a span{display: block; margin-top:10px;}
.share_pop .close-submit{display: inline-block;padding: 5%;text-align: center;width: 100%;}
.share_pop .close-submit span{padding: 2% 19%;border: 1px solid #1fb99e;border-radius: 35px;font-size: 0.9rem;font-weight: 600;color: #1fb99e;display: inline-block;}

[class^='share-ico-']{display:inline-block;width: 72px;height: 72px;background:url("//gscdn.hackers.co.kr/hackersbook_m/popup/share-pop-ico.png") no-repeat;background-size: 240px auto;vertical-align:middle;font-size:0;text-indent:-999999em;}
.share-ico-kakao {background-position: 0 0}
.share-ico-kakao_story{background-position: -72px 0}
.share-ico-band {background-position: -144px 0}
.share-ico-twitter {background-position: 0 -72px}
.share-ico-facebook{background-position: -72px -72px}
.share-ico-line{background-position: -144px -72px}
.share-ico-naver {background-position: 0 -144px}
.share-ico-bookmark {background-position: -72px -144px}
.share-ico-url{background-position: -144px -144px}

/*선생님 수업 연구자료 팝업*/
.nottoday{padding: 3% 0;display: flex;width:94%;margin:0 auto}
.nottoday>span{padding: 0; width:50%; position: relative;border-bottom: 0;font-size: 0.9rem;display: inline-flex;justify-content: center;}
.nottoday>span input[type="checkbox"]{position: relative;margin-right: 1%;}

/*시험지. 답안지 다운로드 팝업*/
.alert_pop ul{padding: 20px 4.2%;}
.alert_pop ul li{border: 1px solid #2bbea4;margin: 10px 0;padding:10px;border-radius: 6px;}
.alert_pop ul li a{color: #1fb99e;letter-spacing: -1px;font-size: 14px;font-weight: bold;}

/*레이아웃 설정 팝업*/
.layout { display: inline-block;width: 100%; border-bottom: 1px solid #ccc; box-sizing: border-box; } 
.layout ul { display: flex; justify-content: space-between; } 
.layout ul li { width: 45.5%; margin-bottom: 30px; background: #f2f2f4; padding: 6% 0 4%; text-align: center; position: relative; border: 3px solid #f2f2f4; border-radius: 5px; } 
.layout ul li a { display: inline-block; width: 53px; height: 66px; background: url(//gscdn.hackers.co.kr/hackersbook_m/popup/layout.png); margin-bottom: 9px; background-size: 200%; } 
.layout ul li:last-child a { background-position: 100% 0; } 
.layout ul li p { color: #666; } 
.layout ul li.on { border: 3px solid #36c1ae } 
.layout ul li.on a { background-position-y: 100%; } 
.layout ul li.on p { color: #1fb99e; font-weight: 600; margin-top: -1px; } 

.layout .layout-chk{position: absolute;top:10px;left:10px;}
.layout .layout-chk .input-sp input[type='radio']+i{width: 26px;height: 26px;background: #fff;border-radius: 50%;}
.layout .layout-chk .input-sp input[type='radio']:checked+i{background-color: #06bb9c; position: relative;}
.layout .layout-chk .input-sp input[type='radio']:checked+i::before{content: "";position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);background: url(//gscdn.hackers.co.kr/hackersbook_m/common/ico_check.png) no-repeat 0 0/contain;height: 12px;z-index: 1;width: 17px;}

/* 미리보기 슬라이드 */
.test-paper .preview{padding: 6% 0; overflow: hidden;}
.test-paper .preview h3 {float:left; font-size: 16px;margin-bottom: 10px;}
.test-paper .preview .swiper {clear: both; background: #fafafa;}
.test-paper .preview .swiper-wrapper {height: auto;}
.test-paper .preview .swiper-pagination {width: auto;font-size: 14px;color: #ccc;}
.test-paper .preview .swiper-pagination span {padding: 0 5px;}
.test-paper .preview .swiper-pagination span.swiper-pagination-current {color: #333; font-weight: bold;}
.test-paper .preview .swiper-controls-box {float:right; display: flex; justify-content: flex-end;align-items: center;}
.test-paper .preview .swiper-controls-box > * { position: static;}
.test-paper .preview .swiper-controls-box [class^="swiper-button"] {margin: 0; transform: rotate(180deg); height: auto;display: flex !important;}
.test-paper .preview .swiper-controls-box [class^="swiper-button"]::after {font-size: 16px; font-weight: bold;}
.test-paper .preview .swiper-controls-box [class^="swiper-pagination"] {display: flex !important;}
.test-paper .preview .swiper-controls-box .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {color:#afafaf;}
.test-paper .preview .swiper-controls-box .swiper-button-prev:after, .swiper-rtl .swiper-button-next:after {color:#333;}

.test-paper .preview ul li img{width:100%;border-radius: 10px;}

.test-paper#alert_pop18 .bx-wrapper .bx-controls-direction a.bx-prev:hover,
.test-paper#alert_pop18 .bx-wrapper .bx-controls-direction a.bx-next:hover {border: 1px solid rgba(0,0,0,0);}
.test-paper#alert_pop18 .top-info {top: -27px;}
.test-paper#alert_pop18 ul.bxslider li { border: 0; }

.layout-btn{ width: 94%;background: #555555;display: inline-block; margin: 0 3%;box-sizing: border-box;padding: 5%;border-radius: 6px;color: #fff;text-align: center; font-size: 15px;font-weight: 600;}

.search_bg{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.5);z-index:200;display: none}
.search_popup{position: absolute;top: 30%;left:4%;width: 92%;background-color: #fff;border-radius: 10px;overflow: hidden;}
.search_popup h5{background:#2bbea4;color:#fff;font-size:17px;padding:7px 10px;}
.search_popup p{text-align: center;padding:25px;border-bottom:1px solid #ddd;width:90%;margin:0 auto;font-size:14px;}
.search_popup .close{color:#fff;position: absolute;top:10px;right: 12px;font-size:20px;width:20px;height:20px;}
.search_popup .input_box{width:40%;margin: 15px auto;}
.search_popup .input_box a{height: 35px;border: 1px solid #1fb99e;line-height: 35px;display: block;border-radius: 55px;text-align: center;margin-left: 1%;font-weight: bold;color:#1fb99e;font-size:14px;}


/* 출제범위 선택 */
.test-control{display: flex;justify-content: space-between;align-items: center;padding:10px;}
.test-control input[type="text"]{background: #fff;width: 78%;height: 37px;}
.test-control a{border:1px solid #06bb9b;color:#06bb9b;border-radius: 5px;display: flex;justify-content: center;align-items: center;height: 35px;max-width: 150px;width: 20%;}

.pop_wrap{position: fixed;left: 50%;top: 50%; transform: translate(-50%,-50%);z-index: 2;border-radius: 10px;box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);background: #fff;border: 1px solid #222;display: none;width: 90%; max-width: 350px;z-index: 102;overflow: hidden;}
.pop_wrap .pop_inner{padding:20px;}
.pop_wrap .tit{background: #06bb9b;color:#fff;font-size: 20px;font-weight: bold;padding:10px 0;text-align: center;}
.pop_wrap h4{font-size: 16px;}
.pop_wrap dl{font-size: 14px;color:#222;}
.pop_wrap a{width: 65px;display: flex;justify-content: center;align-items: center;margin:0 auto;border:1px solid #222;border-radius: 5px;padding:5px 0;margin-top: 10px;}