.p_r { position: relative; } 
.btn-more-wrap { text-align:center; padding: 4% 0; } 
.btn-more-wrap a { font-size: 16px; color:#888 } 
.btn-more-wrap .btn-ico-arrow { width: 20px; height: 13px; background-position: 0 0; margin-right:3%; display:inline-block; background: url("//gscdn.hackers.co.kr/hackersbook_m/common/cs_center_ico.png") no-repeat; background-size: 150px auto; } 
::-webkit-scrollbar { display: none; } 

/*HEADER*/
#header { position: relative; width: 100%; z-index: 10; } 
#header .header-box { position: relative; display: flex; align-items: center; text-align: center; padding: 10px 15px; background: #fff; font-size: 0; } 
#header .header-box h1 { flex-grow: 1; } 
#header .header-box h1 a { width: 180px; height: 80px; } 
#header .header-box h1 a img { width: 100%; max-width: 133px; } 
#header .gnb { width: auto; overflow-x: scroll; padding:3%; background:#fff; text-align:left; } 
#header .gnb ul { display: flex; align-items: center; overflow-x: scroll; } 
#header .gnb li { text-align: center; position: relative; display: inline-block; flex-shrink: 0; padding: 0 4%; } 
#header .gnb li a { font-size: 1.18rem; color: #000; font-weight: 600; padding: 5% 0; } 
#header .gnb li:first-child{width:38%;}
#header .gnb li:first-child a{padding:5% 0 0 5%}
#header .gnb li a.on:after { content: ''; position: absolute; top:3px; right:8px; width:8px; height:8px; border-radius: 50%; background:#39d6ba } 
#gnb.fixed { position: fixed; left: 0; top: 0; width: 100%; z-index: 1; text-align:center; overflow-x: auto; white-space: nowrap; -ms-overflow-style: none; scrollbar-width: none; } 
#header .gnb li a.book_all, #header .gnb li a.teacher_material { color: #1055a0; } 
#header .gnb li a.book_all::before { content: ''; display: inline-block; width: 1.2rem; height: 1.2rem; background: url('https://cdn.hackers.co.kr/hackersbook/img/main/m/all_icon.png') 0 0 no-repeat; background-size: 100% 100%; position: absolute; left: 0; top: 50%; transform: translateY(-50%); } 
#header .gnb li a.book_all::after { content: ''; display: inline-block; width: 2px; height: 60%; background-color: #1055a0; opacity: 0.2; position: absolute; right: 0%; top: 50%; transform: translateY(-50%); } 
#header .gnb li a.teacher_material { display: flex; align-items: center; justify-content: center; gap: 2%; width: 110%; } 
#header .gnb li a.teacher_material.on::after { display: none; } 
#header .gnb li a.teacher_material i { display: block; width: 4.5vw; height: 4.5vw; background: url('//cdn.hackersbook.com/common/icon/t_icon.png') no-repeat 0 0/100%; vertical-align: middle; } 
#gnb.fixed::-webkit-scrollbar { display: none; } 
#gnb.fixed li { white-space: nowrap; } 

/*HEADER-search-box*/
#header .search-box { display: flex; justify-content: space-between; align-items: center; padding: 0 15px; } 
#header .search-box input[type="text"] { border: 0; width: 100%; text-indent: 10px; height: 37px; color: #00cba7; background: #f3fffd; } 
#header .search-box input[type="text"]::placeholder { color: #00cba7; } 
#header .search-box button { width: 40px; height: 40px; margin-right: 4%; background: url('//cdn.hackersbook.com/common/icon/smert_icon.png') no-repeat 0 0/contain; overflow: inherit; box-shadow: 0 1px 5px 0 rgb(0 0 0 / 20%); border-radius: 8px; } 
#header .search-box .search-ipt { flex-grow: 1; position: relative; background: #f3fffd; border: 1px solid #00cba7; border-radius: 8px; } 
#header .search-box .search-ipt .btn-search { width: 20px; height: 20px; position: absolute; top: 50%; display: block; right: 9px; transform: translateY(-50%); background: url('//cdn.hackersbook.com/common/icon/seach_icon.png') no-repeat 0 0; background-size:100%; } 

#container { overflow: hidden; } 

.guide-banner-cont { display: flex; justify-content: space-between; align-items: center; width: 90%; margin: 5% auto 0; } 
.guide-banner-cont li { width: 32%; } 
.guide-banner-cont li a { display: block; width: 100%; } 
.guide-banner-cont li a img { width: 100%; } 
/*퀵버튼*/
.back-to-top { display: none; position: fixed; bottom: 7%; right: 5%; width:50px; height:50px; z-index: 100; } 
.back-to-top img { width:100%; height:100% } 

/* book_all_pop */
.book_all_pop { position: absolute; left: 0; top: 19%; z-index: 10; background-color: #1055a0; width: 100vw; max-height: 90vh; overflow-y: auto; padding: 8% 9%; display: none; } 
.book_all_pop.on { display: block; } 
.book_all_pop.fixed { position: fixed; } 
.book_all_pop dl { margin-bottom: 5%; } 
.book_all_pop dl dt { font-size: 1.3rem; color: #fff; padding-bottom: 1.5vw; margin-bottom: 1.5vw; border-bottom: 2px solid rgba(184, 204, 227, 0.7); } 
.book_all_pop dl dt::before { content: ''; display: inline-block; width: 4px; height: 3vw; background-color: #fff; margin-right: 1vw; border-radius: 1vw; vertical-align: middle; margin-bottom: 0.5vw; } 
.book_all_pop dl dd ul { display: flex; flex-wrap: wrap; } 
.book_all_pop dl dd ul li { width: 50%; border-bottom: 1px solid rgba(255, 255, 255, 0.05); } 
.book_all_pop dl dd ul li:nth-last-of-type(1),
.book_all_pop dl:nth-of-type(1) dd ul li:nth-last-of-type(2), .book_all_pop dl:nth-of-type(2) dd ul li:nth-last-of-type(2) { border-bottom: none; } 
.book_all_pop dl dd ul li a { color: rgba(222, 228, 238, 0.8); font-size: 1.1rem; display: block; width: 80%; padding: 2vw; } 
.book_all_pop a.close_btn { display: block; width: 35%; margin: 0 auto; text-align: center; padding: 2%; font-size: 1rem; color: #fff; font-weight: bold; background: rgba(255, 255, 255, 0.1); border-radius: 2rem; } 


/*FOOTER*/
.footer-top { background:#2bbea4; color:#fff; padding: 5% 3%; } 
.footer-top .inner-box { overflow:hidden; } 
.footer-top h2 small { font-weight: normal } 
.footer-top h2 { position:relative; font-size: 5vw; text-align: center; letter-spacing:-1px; } 
.footer-top h2:before { content:''; display:inline-block; width:22px; height:22px; position:absolute; top:7%; left:4%; background-size: 375px auto; background-position: -150px -78px; } 
.footer-top h2 a.tel_color { margin-left:6px; color:#fff !important; } 
.footer-top h2 span { color:rgba(255,255,255,0.5); vertical-align:top; font-weight:normal; font-size:3.8vw } 
.footer-top .right-btn { float:right; margin-top:12px; } 
.footer-top .right-btn a { display:inline-block; height:46px; line-height:46px; padding:0 40px; text-align:center; background:#16a58f; border-radius:30px; color:#fff; font-size:18px; } 
.footer-bottom { min-height: 250px; margin:0 auto; padding:2% 3% 8%; background:#454d55; color:#fff; } 
.footer-bottom ul { overflow:hidden; display:inline-block; padding:10px 0; text-align: center; width:100%; } 
.footer-bottom ul li { font-size:4vw; position: relative; display: inline-block; padding: 0 2%; } 
.footer-bottom ul li:after { display: inline-block; content: ''; position: absolute; top: 7px; left: 0; width: 1px; height: 8px; background: #6a7077; } 
.footer-bottom ul li:first-child:after { content:none; } 
.footer-bottom ul li a { color:#fff; font-size: 3.5vw; letter-spacing: -1px; } 
.footer-bottom ul li a > b { color: #fff; } 
.footer-bottom ul.fm2 { padding: 0 0 20px; border-bottom: 1px solid #6a7077; } 
.footer-bottom img { width: 100%; margin: 20px 0; max-width: 118px; } 
.footer-bottom .biz_info { float: right; margin: 30px 0; font-size: 3.5vw; letter-spacing: -1px; color: #fff; } 
.footer-bottom .biz_info:after { margin-left:10px; background: url(//gscdn.hackers.co.kr/hackersbook_m/common/lnb_ico.png) no-repeat; background-size: 200px auto; display: inline-block; content: ''; width: 20px; height: 12.5px; background-position: -39px -24px; vertical-align: middle; } 
.footer-bottom .biz_info.on:after { background-position: -57px -24px; } 
.footer-bottom .address { font-size:3.5vw; letter-spacing: -1px; color:#8e8e8e; line-height:2; } 
.footer-bottom .address strong { margin-right:3px; } 
.footer-bottom .address a.tel_color { color:#8e8e8e !important; } 
.address span { color:#fff; } 

/*LNB*/

.menu-wrap { position: relative; min-height: 100vh; min-height: 100dvh; display: flex; flex-direction: column; } 
.menu-wrap .menu-list { background-color: #f1f3f5; flex: 1; } 
.menu-wrap .user-area .txt-welcome .main:before,
.menu-wrap .user-area .txt-welcome em:before,
.menu-wrap .user-area .txt-welcome .top-login:before,
.menu-wrap .menu-list>ul>li.has-sub>a:after,
.menu-wrap .btn-menu-close { background: url("//gscdn.hackers.co.kr/hackersbook_m/common/lnb_ico.png") no-repeat; background-size: 200px auto; } 
.menu-wrap .btn-menu-close { position: absolute; top: 20px; right: 3%; width: 22px; height: 22px; background-position: -65px 0; } 

/*로그인 전/후 공통*/
.menu-wrap .user-area .txt-welcome { padding:17.2px 4%; font-size: 4vw; color: #000; border-bottom: 2px solid #2bbea4; } 
.menu-wrap .user-area .txt-welcome .main { width: 13%; display: inline-block; } 
.menu-wrap .user-area .txt-welcome .main:before { content: ''; display: inline-block; width: 22px; height: 24px; margin: 0 auto; background-position: 0 0; vertical-align: middle; margin-right: 7px; } 
.menu-wrap .user-area .txt-welcome .main:after { content: '|'; display: inline-block; color: #ebebeb; font-weight: 500; padding-left: 10%; } 
.menu-wrap .user-area .txt-welcome .top-login { font-size: 1rem; } 
.menu-wrap .my-study { background:#f0fafb; padding:6% 3%; border-bottom: 1px solid #eaeceb; overflow: hidden; } 
.menu-wrap .my-study h3 { position: relative; font-size: 1rem; } 
.menu-wrap .after-login .my-study h3::after { content: ""; position: absolute; right: 0; top: 50%; transform: translateY(-50%); width: 15px; height: 15px; background: url(//gscdn.hackers.co.kr/hackersbook_m/common/ico_plus.png) no-repeat 0 0/100%; vertical-align: middle; margin-left: 4px; } 
.menu-wrap .my-study h3 a { float:right; font-size: 24px; margin-top: -2.5%; } 

/*로그인 전*/
.menu-wrap .user-area .before-login .txt-welcome .top-login:before { content: ''; display: inline-block; width: 22px; height: 24px; margin: 0 auto; background-position: -22px 0; vertical-align: middle; margin-right: 7px; } 
.menu-wrap .user-area .before-login .my-study p { padding: 6.5% 0 5%; text-align: center; color: #8f9595; font-size: 1rem; letter-spacing: -0.05rem; } 
.menu-wrap .user-area .before-login .my-study .login_btn { text-align:center; padding-bottom:6.5% } 
.menu-wrap .user-area .before-login .my-study .login_btn a { padding:2% 25%; background:#2bbea4; color:#fff; border-radius: 5px; font-size: 0.95rem; } 

/*로그인 lnb_wrap후*/
.menu-wrap .user-area .after-login .txt-welcome .top-logout { vertical-align: middle; } 
.menu-wrap .user-area .after-login .txt-welcome .top-logout::before { content:""; display: inline-block; width: 1px; height: 14px; background: #333; margin: 0 12px; } 
.menu-wrap .user-area .after-login .txt-welcome .top-logout::after { content: ""; display: inline-block; width: 8px; height: 15px; background: url(//gscdn.hackers.co.kr/hackersbook_m/common/ico_arrow_next.png) no-repeat 0 0/100%; vertical-align: middle; margin-left: 4px; } 
.menu-wrap .user-area .after-login .txt-welcome.on em { color:#06bb9b; font-weight: 600; } 
.menu-wrap .user-area .after-login .txt-welcome.on em:before { content: ''; display: inline-block; width: 22px; height: 24px; margin: 0 auto; background-position: -44px 0; vertical-align: middle; margin-right: 7px; } 

/*로그인-나의서재 있을시*/
.menu-wrap .after-login .my-study .swiper-wrapper { padding:5% 0 0; } 
.menu-wrap .after-login .my-study .swiper-wrapper li { text-align: left; } 
.menu-wrap .after-login .my-study .swiper-wrapper li a p { text-align: center; } 
.menu-wrap .after-login .my-study .swiper-wrapper li a p.sub-txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; width: 95%; margin: 8.5% 0; } 
.menu-wrap .after-login .my-study .swiper-wrapper li img { width: 77%; height: 36vw; } 

/*로그인-나의서재 없을시*/

/*lnb메뉴*/
.menu-wrap .menu-list>ul>li { width: 100%; margin: 0 auto; position: relative; background: #fff; border-bottom: 1px solid #e6e6e6; font-weight: 700; } 
.menu-wrap .menu-list>ul>li>a { font-size: 1rem; color: #303030; padding: 3% 4%; display: block; } 
.menu-wrap .menu-list>ul>li>.menu_teacher { font-size: 1rem; color: #303030; padding: 3% 4%; display: block; } 
.menu-wrap .menu-list>ul>li.has-sub { font-weight: 700; border-top: 1px solid #fff; } 
.menu-wrap .menu-list>ul>li.on>a { border-bottom:0 } 
.menu-wrap .menu-list>ul>li.has-sub>a:after { display: inline-block; position: absolute; top: 18px; right: 5%; content: ''; width: 20px; height: 12.5px; background-position: 2px -24px; } 
.menu-wrap .menu-list>ul>li.on ul { display: block; background: #f1f3f5; padding: 0 4%; } 
.menu-wrap .menu-list>ul>li.on ul.sub_menu_list { display: flex; flex-wrap: nowrap; justify-content: space-between; align-items: center; background: #fff; border-bottom: 8px solid #eee; padding: 3%; } 
.menu-wrap .menu-list>ul>li.on ul.sub_menu_list li { width: 24%; } 
.menu-wrap .menu-list>ul>li.on ul.sub_menu_list li a { display: flex; flex-direction: column; align-items: center; justify-content: start; background: #f0fafb; height: 90px; border-radius: 10px; padding: 17% 0; } 
.menu-wrap .menu-list>ul>li.on ul.sub_menu_list li a::before { display: none; } 
.menu-wrap .menu-list>ul>li.on ul.sub_menu_list li a i { display: block; width: 30px; height: 30px; background: url('//cdn.hackersbook.com/common/icon/menu_icon01.png') no-repeat 0 0/100%; vertical-align: middle; } 
.menu-wrap .menu-list>ul>li.on ul.sub_menu_list li a.questionBank i { background: url('//cdn.hackersbook.com/common/icon/menu_icon03.png') no-repeat 0 0/100%; } 
.menu-wrap .menu-list>ul>li.on ul.sub_menu_list li a.testProgram i { background: url('//cdn.hackersbook.com/common/icon/menu_icon02.png') no-repeat 0 0/100%; } 
.menu-wrap .menu-list>ul>li.on ul.sub_menu_list li a.bookProduct i { background: url('//cdn.hackersbook.com/common/icon/menu_icon04.png') no-repeat 0 0/100%; } 
.menu-wrap .menu-list>ul>li.on ul.sub_menu_list li a span { font-size: 1rem; color: #749b95; letter-spacing: 0; display: flex; font-weight: 500; line-height: 1.3rem; text-align: center; margin-top: 5%; height: 6vw; justify-content: center; align-items: center; } 
.menu-wrap .menu-list>ul>li ul { display: none; font-size: 0; } 
.menu-wrap .menu-list>ul>li ul li { display: inline-block; width: 50%; line-height: 45px; } 
.menu-wrap .menu-list>ul>li ul li a { font-size: 0.9rem; color: #222; letter-spacing: -0.07rem; display: block; font-weight: 500; } 
.menu-wrap .menu-list>ul>li ul li a:before { content: ''; display: inline-block; width: 5px; height: 5px; margin-right: 5px; background: #2bbea4; vertical-align: middle; border-radius: 100%; } 

/*lnb 하단*/
.menu-wrap .bottom-menu { padding: 4% 2%; font-size: 3.5vw; background:#454d55; } 
.menu-wrap .bottom-menu ul { width: 100%; display: table; table-layout: fixed; } 
.menu-wrap .bottom-menu ul li { display: table-cell; width: 33.3%; } 
.menu-wrap .bottom-menu ul li a { display: block; width: 100%; text-align: center; font-size: 0.9rem; color: #d3d4d6; border-left: 1px solid rgba(255,255,255,.2); } 
.menu-wrap .bottom-menu ul li:first-child a { border-left: 0; } 

.top_menu_wrap { border-bottom: 8px solid #eee; } 
.top_menu { display: flex; justify-content: space-between; align-items: center; background: #fff; border-bottom:1px solid #e6e6e6; border-top:1px solid #e6e6e6; padding: 0 4%; } 
.top_menu li { width: 33.333%; } 
.top_menu li a { display: flex; justify-content: center; align-items: center; font-size:3.7vw; padding: 15px 0; color: #749b95; position: relative; white-space: nowrap; } 
.top_menu li a i { display: block; width: 18px; height: 18px; background: url('//cdn.hackersbook.com/common/icon/top_icon01.png') no-repeat 0 0/100%; vertical-align: middle; margin-right:2%; } 
.top_menu li:nth-of-type(2) a i { background: url('//cdn.hackersbook.com/common/icon/top_icon02.png') no-repeat 0 0/100%; } 
.top_menu li:nth-of-type(3) a i { background: url('//cdn.hackersbook.com/common/icon/top_icon03.png') no-repeat 0 0/100%; } 

@media (max-width: 480px){
 .top_menu li a { font-size: 3.3vw; } 
 }
@media (max-width: 360px){
 .top_menu li a { font-size: 3.0vw; } 
 }

.top_menu li:nth-of-type(3) a::after { content: ''; display: block; width: 12px; height: 10px; background: url('//cdn.hackersbook.com/common/icon/top_icon03_1.png') no-repeat 0 0 / 100%; position: relative; left: 0; top:-1px } 
@media (max-width:750px) and (min-width:320px){
 .top_menu li a::after { width: 2.2vw; height: 1.8vw; } 
 }
/*고객센터*/
.lnb { width: 100%; overflow: hidden; } 
.lnb.book_product_lnb { background: #1055a0; } 
.lnb.book_product_lnb > li > a { color: #fff !important; } 
.lnb.book_product_lnb > li.on > a { background: #003269 !important; } 
.lnb > li { float:left; width:50%; background:#2bbea4; } 
.lnb > li a:after { content: ''; height: 3px; position: absolute; left: 0; right: 0; bottom: 10px; opacity: 1; width: 0; background-color: #2bbea4; display: block; margin: 0 auto; } 
.lnb > li.on > a { background:#2bbea4; color:#fff; } 
.lnb > li.on a:after { content: ''; display:block; height: 3px; background: #fff; width:100% } 
.lnb > li > a { display:block; height:45px; line-height:45px; text-align:center; color:#fff; position: relative; font-size: 14px; } 

.lnb_scroll { text-align: center; background: #2bbea4; width: 100%; overflow-x: auto; white-space: nowrap; -ms-overflow-style: none; scrollbar-width: none; } 
.lnb_scroll ul { width: 91%; margin: 0 auto; } 
.lnb_scroll ul li { display: inline-flex; width: 25%; text-align: center; white-space: nowrap; position: relative; justify-content: center; align-items: center; height: 6%; } 
.lnb_scroll ul li:nth-child(1) { justify-content: flex-start; } 
.lnb_scroll ul li a { color: #fff; font-size: 1rem; position: relative; } 
.lnb_scroll ul li a:after { position: absolute; left:0; right:0; bottom:-5px; background:#2bbea4; } 
.lnb_scroll ul li.on a { font-weight: 600; } 
.lnb_scroll ul li.on a:after { content: ''; display:block; height: 3px; background: #fff; width:100% } 

.lnb.col3 > li { width:33.333%; } 
.lnb.col4 > li { width:25%; } 
.lnb.col5 > li { width:20%; } 
.lnb.v3 { background:#2bbea4; } 
.lnb.v3 > li { width: auto; padding:0 3.5% } 

.cs-center .lnb_scroll ul li { height: 50px; } 
.cs-center .search-box { display: flex; margin:15px 0; justify-content: space-between; } 
.cs-center .search-box input[type="text"] { width: 77%; height: 37px; padding: 0; } 
.cs-center .search-box .btn-search { width:20%; background:#2bbea4; border-radius: 8px; text-align: center; line-height: 37px; } 
.cs-center .search-box .btn-search a { color:#fff } 

/*고객센터-faq/ 고객센터-qna*/
.cs-center .faq-wrap,
.cs-center .qna-wrap { margin: 30px auto 10px; padding: 0 4%; } 
.cs-center .board-wrap .faq_item,
.cs-center .board-wrap .qna_item { font-size:14px; border-bottom:1px solid #e6e6e6; margin-top:5px; padding: 15px 0; } 
.cs-center .board-wrap .faq_item:first-child,
.cs-center .board-wrap .qna_item:first-child { border-top: 1px solid #000; } 
.cs-center .board-wrap .faq_item a .tag-txt,
.cs-center .board-wrap .qna_item a .tag-txt { color:#00c3ad; font-weight: 600; font-size: 13px; } 
.cs-center .board-wrap .faq_item a .faq-tit,
.cs-center .board-wrap .qna_item a .faq-tit { width:100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-top:5px; } 

/*고객센터-공지사항*/
.cs-center [class^='btn-ico'],
.cs-center .board-detail-wrap .view-area .download:before,
.pick-list-area ul li .down-box p a:before { display:inline-block; background: url("//gscdn.hackers.co.kr/hackersbook_m/common/cs_center_ico.png") no-repeat; background-size: 150px auto; } 
.cs-center .notice-wrap { margin: 6.5% auto; padding: 0 4%; } 
.cs-center .board-wrap { padding: 0 4%; } 
.cs-center [class^='board-wrap'] table .tag-txt { padding:0; border:0; margin-right:10px; } 
.cs-center [class^='board-wrap'] table .tl { padding-left:0 !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } 
[class^='board-wrap'] table td a:hover { text-decoration: none; color:#010101 } 
.cs-center .back_list { text-align: center; border-top: 1px solid #e6e6e6; width: 100%; width: 92%; padding-top: 4%; margin: 0 auto 4%; } 
.cs-center .back_list a { display: block; color: #fff; background: #2bbea4; border-radius: 6px; height: 50px; line-height: 50px; font-size: 17px; } 

/*고객센터-qna*/
.cs-center .board-wrap .qna_item { height: auto; padding: 15px 0; } 
.cs-center .board-wrap .qna_item .qna-tit { width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } 
.cs-center .board-wrap .qna_item .qna_info { font-size: 13px; color:#999 } 
.cs-center .board-wrap .qna_item .qna_info .qna_date,
.cs-center .board-wrap .qna_item .qna_info .qna_answer { display: inline-block; padding-right:5px; padding-top: 10px; } 
.cs-center .board-wrap .qna_item .qna_info .qna_answer { padding-left:5px; } 
.cs-center .board-wrap .qna_item .qna_info .qna_answer span { color:#1dc7b2; } 
.cs-center .qna-ft-wrap { margin-top: 30px; display: flex; } 
.cs-center .qna-ft-wrap div { width: 48%; text-align: center; padding: 10px 0; border-radius: 6px; } 
.cs-center .qna-ft-wrap div a { color:#fff; display: block; font-weight: 600; font-size: 15px; } 
.cs-center .qna-ft-wrap .qna_list { margin-right: 4%; background: #555; } 
.cs-center .qna-ft-wrap .qna_write { background: #2bbea4; } 

/*고객센터-qna 문의하기*/
.cs-center .board-form-wrap { margin:0 4%; padding: 20px 0; } 

/*고객센터-qna 문의글 없을 시*/
.cs-center .no-data .qna-ft-wrap .qna_write { width:100% } 
.cs-center .no-data .qna_item { padding: 70px 0; } 
.cs-center .board-form-wrap input[type="text"] { width: 100%; margin-bottom: 20px; background: #fff; height: 37px; box-sizing: border-box; border-radius: 5px; text-indent: 5px; } 
.cs-center .board-form-wrap h3 { margin-bottom:10px; } 
.cs-center .board-form-wrap .qna-sp .input-sp { width: 49.5%; padding: 4px 0; font-size: 14px; } 
.cs-center .board-form-wrap .editor textarea { width: 100%; height: 210px; padding: 7px 5px; background: #ffff; border: 1px solid #e8e8e8; border-radius: 5px; color: #aaa; text-indent: 5px; } 
.cs-center .board-form-wrap .btn-wrap .btn-qna { width:47.5%; padding: 0 20px; height: 44px; line-height: 44px; background:#2bbea4; color:#fff; font-size: 16px; display: inline-block; border-radius: 7px; text-align: center; border: 1px solid; letter-spacing: -1px; vertical-align: middle; } 
.cs-center .board-form-wrap .btn-wrap .btn-qna:first-child { margin-right:4%; background:#555; } 

/*고객센터-교재정오표*/
.cs-center .schedule-wrap .side { margin-top: 0 !important; } 
.cs-center .schedule-wrap { margin: 30px auto 0; padding: 0 4%; } 
.cs-center .schedule-wrap + .board-wrap { margin-top: 0; } 
.cs-center .board-detail-wrap .view-area .download { display: flex; background: #f7f7f7; height: 35px; line-height: 35px; align-items: center; padding: 0 10px; margin-bottom: 30px; } 
.cs-center .board-detail-wrap .view-area .download:before { content: ''; display: inline-block; width: 15px; height: 24px; background-position: -20px -31px; margin-right: 8px; } 
.cs-center .board-detail-wrap .view-area .download span { padding-bottom: 2px; width: 90%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; text-decoration: underline; } 
.cs-center .btn-ico-down { width: 20px; height: 20px; background-position: 0 -32px; margin-left:2%; } 


/*my page*/
.my-page .qna-wrap h2 { border-bottom:1px solid #000; } 
.pick-list-area ul li .down-box p { width: 108px; border: 1px solid #6cd1c0; border-radius: 15px; padding: 1.5px 0; text-align: center; margin: 6px auto 0; letter-spacing: -.05em; } 
.pick-list-area ul li .down-box p a { color:#1fb99e } 
.pick-list-area ul li .down-box p a:before { content: ''; display: inline-block; width: 12px; height: 12px; background-position: 0 -32px; vertical-align: middle; background-size: 130px; margin-right: 2px; } 

/*my page-나의서재*/
.my-page .pick-list-area .library li { width: 47.5%; float: left; margin-bottom: 30px; } 
.my-page .pick-list-area .library li .img-box { display: block; background: #f2f2f4; border-radius: 8px; text-align: center; padding: 11% 0; margin-bottom: 14px; } 
.my-page .pick-list-area .library li .book-name { text-align: center; } 
.my-page .pick-list-area .library li:nth-child(2n-1) { margin-right:4.5% } 
.my-page .pick-list-area .library li img { width: auto; height: 34vw; } 

/*my page-나의 수업연구*/
.my-page .book-info-area .tab-type2 { padding-bottom: 0; } 
.book-info-area .tab-type2 li a span { color:#749b95; display: block; height: 45px; line-height: 1.2; margin-bottom: 20%; display: flex; justify-content: center; align-items: center; font-size:13px; } 
.book-info-area .tab-type2 li.on a span { color:#1fb99e; font-weight: 700; } 
.book-info-area { padding:0 4% } 
.book-info-area .material-top { display: flex; align-items: center;  height: auto; padding: 3% 0; border-bottom: 1px solid #e6e6e6; justify-content: space-between; } 
.book-info-area .material-top .material-total { width: 20%; font-size: 0.9rem; color: #000; } 
.book-info-area .material-top .select_wrap_group{width: 80%; display: flex; justify-content: end; gap:2%; align-items: center; } 
.book-info-area .material-top .select-wrap { width:40%; margin-top:0; } 
.book-info-area .material-top .select-wrap.v2 { width:30%; margin-top:0; } 
.book-info-area .material-top .select-wrap select { width: 100%; color: #aaa; padding:6%; background: url('//gscdn.hackers.co.kr/hackersbook/img/common/sp_select.png') no-repeat 95% 50%; border: 1px solid #aaa; text-align: left; } 
.book-info-area .material-top .select-wrap.v2 select {padding: 8%;} 
.book-info-area .class_mateial_item { display: flex; position: relative; padding: 6.5% 0; border-bottom: 1px solid #e6e6e6; } 
.book-info-area .class_mateial_item .thum_img { width:30%; margin-right:2%; text-align: center; } 
.book-info-area .class_mateial_item .thum_img img { width:78%; height: 30vw; } 
.book-info-area .class_mateial_item .thum_info { width:60%; position: relative; } 
.book-info-area .class_mateial_item .thum_info strong,
/* .book-info-area .class_mateial_item .thum_info p { font-size: 1rem; } */
.book-info-area .class_mateial_item .thum_info p { color: #666; display: block; margin-bottom: 2%; font-size: 0.8rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; white-space: break-word; overflow: hidden; line-height: 1.4; } 
.book-info-area .class_mateial_item .thum_info strong { color:#222; font-size: 16px; font-weight: 600; } 
.book-info-area .class_mateial_item .thum_info .btn_area { position: absolute; bottom:0; display: inline-flex; align-items: center; width: 100%; } 
.book-info-area .class_mateial_item .thum_info .btn_area a { margin-right: 3%; } 
.book-info-area .class_mateial_item .thum_info .btn_area a:last-child { margin-right: 0; } 
.book-info-area .class_mateial_item .thum_info .btn_area a.btn-pick { width: 8.5vw; height: 25px; display: inline-flex; align-items: center; border-right: 1px solid #f4f4f4; margin-right: 5.5%; } 
.book-info-area .class_mateial_item .thum_info .btn_area a.btn-pick i { width: 20px; height: 18px; background: url('//gscdn.hackers.co.kr/hackersbook_m/sub/btn-pick2.png') no-repeat; background-size: 200%; background-position-x: 0; } 
.book-info-area .class_mateial_item .thum_info .btn_area a.btn-pick.on i { background-position-x: 100%; } 

.book-info-area [class^='btn-ico'] { display:inline-block; background: url("//gscdn.hackers.co.kr/hackersbook_m/common/cs_center_ico.png") no-repeat; background-size: 150px auto; } 

.book-info-area.no-data { padding:0 4% } 

.book-info-area .tab-type2.col4 { width: 100%; display: inline-block; padding-bottom: 3.5%; } 
.book-info-area .tab-type2.col4 > li { width: 20%; margin-right: 6.6%; } 
.book-info-area .tab-type2.col4 > li:last-child { margin-right: 0; } 
.book-info-area .tab-type2.col4 > li a span { margin-bottom: 12%; } 

/*해커스에 바란다*/
.cs-center .select-wrap { text-align:left; margin-top:0 } 
.cs-center .select-wrap select { width: 100%; height: 37px; font-size: 13px; background-color: #fff; border: 1px solid #e8e8e8; border-radius: 5px; color: #aaa; text-indent: 5px; padding: 7px 5px; } 
.cs-center .scroll-wrap { margin:0 4%; } 
.cs-center .scroll-box.custom-scroll { height: 230px; border: 1px solid #d4d4d4; padding: 10px 10px; border-radius: 5px; font-size: 13px; letter-spacing: -.05em; margin-top: 10px; color: #888; } 
.cs-center .agree-box .input-sp input[type='checkbox']+i { width: 18px; height: 18px; background: none; border: 1px solid #ccc; border-radius: 50%; vertical-align: -5px; margin-right: 2px; vertical-align: middle; } 
.cs-center .agree-box .input-sp input[type='checkbox']:checked+i { position: relative; border-color: #2bbea4; } 
.cs-center .agree-box .input-sp input[type='checkbox']:checked+i::after { content: ""; width: 8px; height: 8px; text-align: center; border-radius: 50%; background: #2bbea4; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); } 
.cs-center .agree-box .input-sp .input-txt { color: #555; } 
.file-wrap { position:relative } 
.file-wrap .filebox { display: flex; } 
.file-wrap .filebox input[type="text"] { flex-grow: 1; height: 37px; background-color: #fff; border: 1px solid #e8e8e8; border-radius: 5px; margin-bottom: 0; color: #aaa; font-size: 13px; text-indent: 5px; } 
.file-wrap .filebox label { min-width: 75px; height: 37px; line-height: 35px; background-color: #fff; padding: 0; border: 1px solid #06bb9b; border-radius: 5px; margin-left: 3%; color: #06bb9b; font-size: 14px; text-align: center; } 

/*이용약관*/
#terms-sel { display: block; width: 92%; height: 35px; padding: 0 10px; margin: 20px auto; border-radius: 5px; border: 1px solid #aaa; color: #666; font-size: 14px; letter-spacing: -.05em; box-sizing: border-box; } 
.terms-list { padding:0 3%; } 
.terms-list h2:before { width:18px; height:16px; content:''; display:inline-block; background: url("//gscdn.hackers.co.kr/hackersbook_m/common/lnb_ico.png") no-repeat; background-size: 200px auto; background-position:0 -34px; margin-right: 2px; } 
.terms-list strong { color:#0ca78c } 

/*이벤트*/
.event.list-sort { display: flex; justify-content: space-between; align-items: center; height: 43px; margin: 4%; width:auto; } 
.event.list-sort .event-total { width: 35%; margin-right:35%; font-size: 14px; } 
.event.list-sort .select-wrap { width:25%; margin-top:0; } 
.event.list-sort .select-wrap select { width: 100%; border: 0; padding: 0; color: #000; padding-left: 10%; text-align: end; background: url(//gscdn.hackers.co.kr/hackersbook_m/common/sp_select_bk.png) no-repeat 35% 50%; background-size: 8%; } 
.event-list-area ul li .txt-box a { width: 25px; height: 20px; display:inline-block; background: url("//gscdn.hackers.co.kr/hackersbook_m/common/lnb_ico.png") no-repeat; background-size: 200px auto; background-position: 5px -50px; } 

/*교재통합검색*/
.search-result span { color:#1fb99e; font-weight: 600; } 
.book-list .btn-more-wrap { width: 100%; background-color:#fff; } 
.book-list-area .txt-box dd ul li { margin-right: 2%; text-align: center; border: 1px solid #1fb99e; border-radius: 15px; font-size: 12px; padding: 1% 0; margin-bottom: 2%; color: #1fb99e; float: left; width: 108px; } 
.book-list-area .txt-box dd ul li:last-child { margin-right: 0; } 

.book-list-area > ul > li> .book-bottom .btn_area { display: flex; width:100%; justify-content: space-between; } 
.book-list-area > ul > li> .book-bottom .btn_area a { border: 1px solid #ccc; padding: 2%; text-align: center; border-radius: 6px; color:ccc; } 
.book-list-area > ul > li> .book-bottom .btn_area a.on { border-color: #ff6666; color: #ff6666; } 
.book-list-area > ul > li> .book-bottom .btn_area .btn-pick { width: 30%; } 
.book-list-area > ul > li> .book-bottom .btn_area .btn-buy { width:66.5%; border: 1px solid #2bbea4; background:#2bbea4; color:#fff; font-weight: 600; } 

/*스마트검색*/
.layer-wrap .smart-search-pop .step-03 { display: block; width: 92%; overflow-y: auto; position: relative; margin: 0 auto; padding: 4% 0 0; border-bottom: 1px solid #e6e6e6; letter-spacing: -.05em; } 
.layer-wrap .smart-search-pop .step-03 ul { width:100% } 
.layer-wrap .smart-search-pop .step-03 ul li { width:47.5%; float:left; margin-bottom: 20px; } 
.layer-wrap .smart-search-pop .step-03 ul li:nth-child(2n-1) { margin-right: 4.5%; } 
.layer-wrap .smart-search-pop .step-03 ul li a { display: block; position: relative; } 
.layer-wrap .smart-search-pop .step-03 ul li a img { height:47vw; background: #f2f2f4; padding: 12% 18%; border-radius: 8px; border: 3px solid #f2f2f4; margin-bottom: 5px; } 
.layer-wrap .smart-search-pop .step-03 ul li h3 { font-weight: 300; overflow: hidden; font-size: 14px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } 
.layer-wrap .smart-search-pop .step-03 ul li.on a img { border-color: #00b48f; } 
.layer-wrap .smart-search-pop .step-03 ul li.on a h3 { color: #00b48f; font-weight: bold; } 
.layer-wrap .smart-search-pop .step-03 ul li a .smrt-sch { position: absolute; top: 10px; left:10px; } 
.layer-wrap .smart-search-pop .step-03 ul li a .smrt-sch .input-sp input[type="checkbox"]+i { width: 25px; height: 25px; border-radius: 50%; background: #fcfcfe; } 
.layer-wrap .smart-search-pop .step-03 ul li a .smrt-sch .input-sp input[type="checkbox"]:checked+i { background: #06bb9b url(//gscdn.hackers.co.kr/hackersbook_m/common/ico_check.png) no-repeat center/15px !important; } 

/*중등/고등추천교재 리스트*/
.book_info { padding: 5% 0 8%; background:#e0f6f3; border-bottom:1px solid #1fb99e; } 
.book_info h2 { text-align: center; } 
.book_info .swiper-pagination { top:0; bottom: auto; } 
.book_info .swiper-pagination-current { color:#1fb99e; font-weight: 700; } 
.book_info .swiper-wrapper { margin-top:9%; height: auto !important; } 
.book_info .swiper-wrapper li { text-align: center; height: auto; } 
.book_info .swiper-wrapper li img { box-shadow: 8px 8px 5px rgb(0 0 0 / 10%); width:60%; opacity: 0.5; } 
.book_info .swiper-wrapper li.swiper-slide-active img { opacity: 1; } 
.book_info .swiper-wrapper li .txt-box { opacity: 0; margin-top:5%; padding:0 3%; } 
.book_info .swiper-wrapper li.swiper-slide-active .txt-box { opacity: 1; } 
.book_info .swiper-wrapper li .txt-box dt h3 { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; margin-bottom: 3%; } 
.book_info .swiper-wrapper li .txt-box dt span { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow:ellipsis; white-space:break-word; overflow:hidden; width: 100%; height: 10%; } 
.book_info .swiper-wrapper li .txt-box dd { margin: 7% 0 0; } 
.book_info .swiper-wrapper li .txt-box dd ul { display: flex; width:140%; margin-left: -20%; align-items: center; justify-content: center; } 
.book_info .swiper-wrapper li .txt-box dd li { width:auto; border:1px solid #1fb99e; border-radius: 20px; margin:0 1.5%; padding: 0.5% 3.5%; font-size: 0.8rem; } 
.book_info .swiper-wrapper li .txt-box dd li a { color:#1fb99e; } 
.book_info .swiper-wrapper li .txt-box dd li a em { font-weight: 600; } 
.list-sort .bottom-wrap { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #f3f3f3; } 
.list-sort .bottom-wrap .select-wrap { width:70%; margin-top: 0; border-right: 1px solid #f3f3f3; } 
.list-sort .bottom-wrap .select-wrap select { width:100%; border-radius:0; border:0; color:#666; background: url("//gscdn.hackers.co.kr/hackersbook/img/common/sp_select2.png") no-repeat 95% 50%; background-size: 5.5%; } 
.list-sort .bottom-wrap .list-form { width:30%; height: 10vw; margin-top:0; display: inline-flex; } 
.list-sort .bottom-wrap .list-form li { width: 50%; height: inherit; border-right: 1px solid #f3f3f3; display: inline-flex; justify-content: center; align-items: center; } 
.list-sort .bottom-wrap .list-form li:last-child { border: 0; } 
.book-list-area > ul > li> .book-bottom .btn_area .btn-buy.v2 { width:31.5%; border: 1px solid #2bbea4; background:#2bbea4; color:#fff } 
.book-list-area > ul > li> .book-bottom .btn_area .btn-buy.v2.gray { border-color: #444; background:#444; } 
.book_info .swiper-button-prev { color:#1fb99e; top: 50%; transform: translateY(-50%); } 
.book_info .swiper-button-next { color:#1fb99e; top: 50%; transform: translateY(-50%); } 

/*중등/고등 교재 상세페이지*/
.book-summary-cont .txt-box .txt-box-top { display: flex; } 
.book-summary-cont .txt-box dt .txt-box-top em { width:80%; } 
.book-summary-cont .txt-box dt .txt-box-top a { width:10%; font-size: 0; } 
.book-info-area.v2 .book-info-lnb { background: #2bbea4; width: 100%; position:sticky; } 
.book-info-area.v2 .book-info-lnb ul { margin: 0 auto; height: 50px; line-height: 50px; overflow-x: auto; white-space: nowrap; -ms-overflow-style: none; scrollbar-width: none; } 
.book-info-area.v2 .book-info-lnb ul::-webkit-scrollbar { display: none; } 
.book-info-area.v2 .book-info-lnb li { display: inline-block; padding: 0 10px; text-align: center; white-space: nowrap; float: none; height: 100%; position: relative; top: -30%; } 
.book-info-area.v2 .book-info-lnb li a { font-size: 1rem; color:#fff !important; position: relative; top: 30%; border: 0; } 
.book-info-area.v2 .book-info-lnb li.on a { border-bottom: 0.2rem solid #fff; font-weight:bold } 


/*중등/고등 교재 상세페이지- 교재정보*/
.book-info.v2 { padding:6% 4% 8%; } 
.book-info.v2 h3 { border-bottom: 1px solid #000; font-size: 19.2px; letter-spacing: -0.1rem; padding-bottom: 1.5% !important; color: #333; margin-bottom: 0; } 
.book-info.v2 table { text-align: left; width: 100%; display: inline-block; } 
.book-info.v2 table tbody { width: 100%; display: inline-block; } 
.book-info.v2 table tr { height: 41.5px; border-bottom: 1px solid #e6e6e6; display: inline-flex; width: 100%; align-items: center; } 
.book-info.v2 table th { width: 30%; height: 100%; background: #f9f9f9; color: #888; display: flex; align-items: center; padding-left: 3%; font-size: 15.2px; } 
.book-info.v2 table td { padding: 0 3%; width: 70%; font-size: 15.2px; } 

/*중등/고등 교재 상세페이지- 교재소개*/
.book-intro h3 { border-bottom: 1px solid #000; font-size: 1.25rem; color: #333; letter-spacing: -0.1rem; padding-bottom: 1.5% !important; margin-bottom: 4% !important; } 
.book-intro b { margin-bottom: 1.5%; color: #000; letter-spacing: -0.05rem; display: inline-block; } 
.book-intro p { margin-bottom: 1.5%; letter-spacing: -0.05rem; } 

/*중등/고등 교재 상세페이지- 교재학습자료*/
.book-material { padding:0 4%; margin-top: 8.5%; } 
.book-material h3 { font-size: 1.2rem; letter-spacing: -0.05rem; } 
.book-material .title-txt { margin: 1% 0 5% !important; } 
.book-material .tab-type2 { border-bottom:0; } 
.book-material .tab-type2-cont .board-wrap ul li { display: flex; height: 53px; /*padding: 3.5% 0; */justify-content: center; align-items: center; border-bottom:1px solid #e6e6e6 } 
.book-material .tab-type2-cont .board-wrap ul li:first-child { border-top:1px solid #000 } 
.book-material .tab-type2-cont .board-wrap ul li .btn-pick { font-size: 0; width:9% } 
.book-material .tab-type2-cont .board-wrap ul li .tit { width:55%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.95rem; line-height: 1; color: #666; } 
.book-material .tab-type2-cont .board-wrap ul li .tit.btn4 { width: 46%; } 
.book-material .tab-type2-cont .board-wrap ul li .btn-pick i { width: 20px; height: 18px; background: url('//gscdn.hackers.co.kr/hackersbook_m/sub/btn-pick2.png') no-repeat; background-size: 200%; background-position-x: 0; } 
.book-material .tab-type2-cont .board-wrap ul li .btn-pick.on i { background-position-x: 100%; } 
.book-material .tab-type2-cont .board-wrap ul li .btn_area { width:36%; display: flex; justify-content: end; } 
.book-material .tab-type2-cont .board-wrap ul li .btn_area.btn4 { width: 45%; } 
.book-material .tab-type2-cont .board-wrap ul li .btn_area a { margin-left: 5%; } 
.book-material .tab-type2-cont .board-wrap ul li .btn_area a:first-child { margin-left: 0; } 

/*중등/고등 교재 상세페이지- 수업자료*/
.lec-material { padding:0 4%; margin-top: 14%; } 
.lec-material .tab-type2 { border-bottom:0; overflow-x: auto; } 
.lec-material .tab-type2-cont .board-wrap ul li { display: flex; height: 53px; /*padding: 3.5% 0; */justify-content: center; align-items: center; border-bottom:1px solid #e6e6e6 } 
.lec-material .tab-type2-cont .board-wrap ul li:first-child { border-top:1px solid #000 } 
.lec-material .tab-type2-cont .board-wrap ul li .btn-pick { font-size: 0; width:9% } 
.lec-material .tab-type2-cont .board-wrap ul li .tit { width:55%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 0.95rem; line-height: 1; color: #666; } 
.lec-material .tab-type2-cont .board-wrap ul li .tit.btn4 { width: 46%; } 
.lec-material .tab-type2-cont .board-wrap ul li .btn-pick i { width: 20px; height: 18px; background: url('//gscdn.hackers.co.kr/hackersbook_m/sub/btn-pick2.png') no-repeat; background-size: 200%; background-position-x: 0; } 
.lec-material .tab-type2-cont .board-wrap ul li .btn-pick.on i { background-position-x: 100%; } 
.lec-material .tab-type2-cont .board-wrap ul li .btn_area { width:36%; display: flex; justify-content: end; } 
.lec-material .tab-type2-cont .board-wrap ul li .btn_area.btn4 { width: 45%; } 
.lec-material .tab-type2-cont .board-wrap ul li .btn_area a { margin-left: 5%; } 
.lec-material .tab-type2-cont .board-wrap ul li .btn_area a:first-child { margin-left: 0; } 

/*중등/고등 교재 상세페이지- 동영상강의*/
.lec-mov { padding:0 4%; margin-top: 12%; } 
.lec-mov .title-txt { border-bottom: 1px solid; padding-bottom: 2%; } 
.lec-mov .board-wrap { margin-top: 5.5%; padding: 0; } 
.lec-mov .board-wrap ul li { display: flex; height: 52px; justify-content: center; align-items: center; border-bottom:1px solid #e6e6e6 } 
.lec-mov .board-wrap ul li:first-child { border-top:1px solid #e6e6e6 } 
.lec-mov .board-wrap ul li .tit { width: 90%; font-size: 15.2px; color: #666; } 
.lec-mov .board-wrap ul li a { width:10%; } 

/*중등/고등 교재 상세페이지- 추천교재*/
.book-recommend { padding:0 3%; margin-top: 12%; } 
.book-recommend .title-txt { border-bottom:1px solid #000; font-size: 13px; } 
.book-recommend .swiper-wrapper li { text-align: left; } 
.book-recommend .swiper-wrapper li a { display: block; text-align: center; } 
.book-recommend .swiper-wrapper li img { width:75.5% !important; height: 37vw !important; } 
.book-recommend .swiper-wrapper li .txt-box { width: 95%; margin: 20% auto 0; padding-left: 3%; text-align: left; } 
.book-recommend .swiper-wrapper li .txt-box dt h3 { font-size: 1rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } 
.book-recommend .swiper-wrapper li .txt-box dd { margin: 11% 0 0; color: #666; line-height: 1.2; font-size: 0.8rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } 

/*중등/고등 교재 상세페이지- 하단배너*/
.bottom-bnr { padding-bottom: 13%; /*padding:0 3% 50px; */ position: relative; } 
.bottom-bnr .swiper { margin-left: 4%; } 
.bottom-bnr .swiper-wrapper li { text-align: left; } 
.bottom-bnr .swiper-wrapper li a { display: block; text-align: center; } 
.bottom-bnr .swiper-wrapper li a img { width: 100%; height: 40vw; box-shadow: 8px 8px 5px rgb(0 0 0 / 10%); } 
.bottom-bnr .bx-wrapper li { width:100%; } 
.bottom-bnr .bx-wrapper li img { width:100%; } 
.bottom-bnr .bx-pager { position: absolute; bottom: 10px; left: 50%; transform: translateX(-50%); } 

/*중등/고등 교재 상세페이지- 자료다운 이용안내*/
.material-down { background:#e6e6e6; padding:10% 3% } 
.material-down h3 { color:#666; margin-bottom:15px; } 
.material-down a { width: 100%; border: 1px solid #666; display: block; padding: 6px; border-radius: 6px; text-align: center; color:#666 } 
.material-down a:before { content: ''; width: 22px; height: 25px; margin: 0 auto; background-position: -68px -147px; vertical-align: middle; margin-right: 7px; background-size:450px; } 

/*모든자료보기 공통*/
.side { color:#000; width: 100%; display: block; text-align: center; border: 1px solid #aaa; font-size: 13px; color: #888; border-radius: 6px; background: #fff; } 
.side.side_btn { margin-top: 5.5% !important; height: 30px; line-height: 29px; padding: 0; } 
.side b { font-size: 0.7rem; position: relative; top: -0.35vw; } 
.notice-wrap .side { margin-top: 0 !important; } 

/*교재학습자료- 맞춤검색*/
.book-info-area .tab_section .tab-type2.col6 { width: 105%; display: inline-block; overflow-x: auto; white-space: nowrap; border-bottom: 0; padding: 2.5% 0; -ms-overflow-style: none; scrollbar-width: none; } 
.book-info-area .tab_section .tab-type2.col6::-webkit-scrollbar { display: none; } 
.book-info-area .tab_section .tab-type2.col6 li { display: inline-flex; /*padding:0 5px; */margin-right: 1%; width: 20%; text-align: center; white-space: nowrap; float: none; flex-flow: nowrap column; } 
.book-info-area .tab_section .tab-type2.col6 li span { margin-bottom: 0; } 
/* .book-info-area .tab_section .tab-type2.col6 li.mp3 { position: relative; top: -2.2vw; } */
.book-info-area .tab_section .tab-type2.col6 li i { height: 16vw; } 
.book-info-area .tab_section .tab-type2.col6 li.on i { background-position-y: -3% !important; } 

/*선생님 수업연구교재*/
.lnb.v2 { width: 100%; padding: 9px 3%; white-space: nowrap; overflow-x: auto; text-align: center; } 
.lnb.v2::-webkit-scrollbar { display: none; } 
.lnb.v2 li { display: inline-block; text-align: center; white-space: nowrap; float: none; width: auto; background: none; } 
.lnb.v2 li a { padding: 0 13px; border-radius: 30px; letter-spacing: -1px; background: none; font-size: 14px; color: #888; height: 30px; line-height: 30px; display: inline-block; } 
.lnb.v2 li.on a { background:#f2f5fa; color:#000; font-weight: normal; } 
.lnb.v2 > li.on:after { content: ''; display: block; height:0; } 
.lnb.v2 > li.on a:after { content: ''; display: block; height:0; } 

/*단어시험지 제작 프로그램*/
.inner-box .step-03 { display:inline-block; padding: 10% 3%; width: 100%; } 
.inner-box .step-03 ul { width:100% } 
.inner-box .step-03 ul li { width:48%; float:left; margin-bottom: 20px; } 
.inner-box .step-03 ul li.on img { outline: 3px solid #06bb9b; } 
.inner-box .step-03 ul li.on h3 { color:#1fb99e; font-weight: 600; } 
.inner-box .step-03 ul li:nth-child(2n-1) { margin-right: 4%; } 
.inner-box .step-03 ul li a { display: block; position: relative; letter-spacing: -0.1em; } 
.inner-box .step-03 ul li a img { width:100%; background: #f2f2f4; padding: 12% 18%; border-radius: 6px; margin-bottom: 5px; } 
.inner-box .step-03 ul li h3 { font-weight: 300; font-size:14px; letter-spacing: -1px; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; text-overflow: ellipsis; white-space: break-word; overflow: hidden; } 
.inner-box .step-03 ul li a .smrt-sch { position: absolute; top: 3%; left: 5%; } 
.inner-box .step-03 ul li a .smrt-sch .input-sp input[type="checkbox"]+i { width: 25px; height: 25px; border-radius: 50%; background: #fcfcfe; } 
.inner-box .step-03 ul li a .smrt-sch .input-sp input[type="checkbox"]:checked+i { background: #06bb9b url(//gscdn.hackers.co.kr/hackersbook_m/common/ico_check.png) no-repeat center/15px !important; } 

/* 플로팅*/
.bt_ban { position:fixed; bottom:0; left:50%; transform: translateX(-50%); width:100%; max-width: 750px; z-index: 99; } 
.bt_ban ul li { height:45px; line-height: 45px; background: #555; width:50%; float:left; } 
.bt_ban ul li:last-child { background: #36cbb1; } 
.bt_ban a { display: block; font-size: 19px; text-align: center; color: #fff; font-weight: 600; } 
.bt_ban.v2 ul { display: flex; } 
.bt_ban ul>li.floating-btn { border-top: 1px solid #e6e6e6; } 
.bt_ban.v2 ul>li.floating-btn:first-child { width:20%; background: #fff; } 
.bt_ban.v2 ul >li.floating-btn:last-child { width:80%; } 
.bt_ban.v2 ul >li.floating-btn ul li { background:transparent; height:auto } 
.bt_ban.v3 ul { display: flex; } 
.bt_ban.v3 ul>li.floating-btn:first-child { width:20%; background: #fff; } 
.bt_ban.v3 ul >li.floating-btn { width:40%; } 
.bt_ban.v3 ul >li.floating-btn ul li { background:transparent; height:auto } 

/*나의 단어 시험지 답안지-로그인 전*/
.board-wrap .bf-login { text-align: center; color: #888; padding:15% 0; } 
.board-wrap .bf-login .login_btn a { padding: 2% 25%; background: #2bbea4; color: #fff; border-radius: 5px; font-size: 1rem; } 
.tpaper-wrap .bf-login .txt { font-size: 0.95rem; letter-spacing: -0.05rem; margin-bottom: 4%; } 

/*나의 단어 시험지 답안지*/
.tpaper-wrap { margin-top: 0; padding: 0 4%; } 
.tpaper-wrap table { border-color: #737373; } 
.tpaper-wrap table th { padding: 2.5% 0; border-bottom: 0; } 
.tpaper-wrap table td:first-child { color: #101010; padding: 2.5% 0 2.5% 1.5%; font-size: 0.9rem; text-align: left; } 
.tpaper-wrap table.no-data { width: 100%; } 
.tpaper-wrap table.no-data td { text-align: center; padding: 15% 0; font-size: 1rem; color: #8b8b8b; } 
.go-direct { border: 1px solid #2bbea4; padding: 5.5% 0; width: 75%; border-radius: 6px; display: inline-block; } 
.delete { content: ''; display: inline-block; width: 18px; height: 20px; margin: 0 auto; background: url('//gscdn.hackers.co.kr/hackersbook_m/common/sp_layout1.png') no-repeat; background-size: 400px auto; background-position: -79px -130px; vertical-align: middle; } 

.side-btn { display: flex; justify-content: center; gap: 0.75rem; align-items: center; } 
.side-btn .cart { background: url('http://cdn.hackersbook.com/common/icon/cart.png')0 0 no-repeat; background-size: 100%; display: block; width: 2rem; height: 2rem; position: relative; } 
.side-btn .cart span { background: #21b399; color: #fff; font-size: 0.8rem; border-radius: 50%; padding: 0.1rem 0.4rem; position: absolute; top: -0.4rem; right: -0.5rem; } 

/* 주문/배송 */
.payment .icon { display: inline-block; background-size: 100%; } 
.payment .arrow_back { display: block; background: url('http://cdn.hackersbook.com/common/icon/arrow_back.png')0 0 no-repeat; background-size: 100%; } 
.payment .arrow_o { display: block; background: url('http://cdn.hackersbook.com/common/icon/arrow_o.png')0 0 no-repeat; background-size: 100%; } 
.payment .home { display: block; background: url('http://cdn.hackersbook.com/common/icon/home.png')0 0 no-repeat; background-size: 100%; } 
.payment .ico_calendar { display: block; background: url('http://cdn.hackersbook.com/common/icon/c_icon.png')0 0 no-repeat; background-size: 100%; } 
.payment .ico_delete { display: block; background: url('http://cdn.hackersbook.com/common/icon/del_icon_w.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_arrow_w { display: block; background: url('http://cdn.hackersbook.com/common/icon/arrow_w.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_arrow_m { display: block; background: url('http://cdn.hackersbook.com/common/icon/arrow_m.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_arrow_sell { display: block; background: url('http://cdn.hackersbook.com/common/icon/sell_go.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_arrow_g { display: block; background: url('http://cdn.hackersbook.com/common/icon/arrow_g.png')0 0 no-repeat !important; background-size: 100% !important; } 
.payment .ico_copy { display: block; background: url('http://cdn.hackersbook.com/common/icon/copy_icon.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_check { display: block; background: url('http://cdn.hackersbook.com/common/icon/icon_check.png')0 0 no-repeat; background-size: 100%; } 
.payment .ico_coupon { display: block; background: url('http://cdn.hackersbook.com/common/icon/cupon_icon.png')0 0 no-repeat; background-size: 100%; } 
.payment .ico_coupon_m { display: block; background: url('http://cdn.hackersbook.com/common/icon/coupon_m.png')0 0 no-repeat; background-size: 100%; } 
.payment .ico_coupon_down { display: block; background: url('http://cdn.hackersbook.com/common/icon/coupon_down.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_info_g { display: block; background: url('http://cdn.hackersbook.com/common/icon/info_g_icon.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_cart { display: block; background: url('http://cdn.hackersbook.com/common/icon/cart_icon.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_coupon_m { display: block; background: url('http://cdn.hackersbook.com/common/icon/coupon_m.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_order_check { display: block; background: url('http://cdn.hackersbook.com/common/icon/check_order.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_coupon_g { display: block; background: url('http://cdn.hackersbook.com/common/icon/coupon_g.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_close { display: block; background: url('http://cdn.hackersbook.com/common/icon/close_m.png')0 0 no-repeat; background-size: 100%; } 
.payment .icon_none { display: block; background: url('http://cdn.hackersbook.com/common/icon/none.png')0 0 no-repeat; background-size: 100%; } 

.payment .btn_type1 { display: block; font-size: 20px; color: #1ab398; border: 1px solid #1ab398; border-radius: 50px; padding: 15px 45px; width: 200px; text-align: center; } 
.payment .sub_title { font-size: 1.45rem; font-weight: 700; color: #222; margin: 5% auto; width: 90%; padding-bottom: 3%; border-bottom: 1px solid #222; display: flex; align-items: center; justify-content: left; } 
.payment .sub_title.refund_apply_title { display: flex; justify-content: center; align-items: center; position: relative; margin: 0 auto; border-color: #eee; width: 100%; padding: 3% 5% } 
.payment .sub_title.refund_apply_title a { display: block; position: absolute; top:50%; right: 5%; transform: translateY(-50%); width: 1.6rem; height: 1.6rem; } 
.payment .sub_title.refund_apply_title a::after,.payment .sub_title.refund_apply_title a::before { content:''; display:block; width:90%; height:1px; background:#333; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%) rotate(45deg); } 
.payment .sub_title.refund_apply_title a::after { transform: translate(-50%,-50%) rotate(-45deg); } 
.payment .detail_tit { font-size: 1.45rem; font-weight: 700; text-align: center; border-top: 1px solid #eee; position: relative; padding: 3% 0; } 
.payment .detail_tit a { display: block; position:absolute; top:50%; transform: translateY(-50%); right: 5%; width: 1.75rem; height: 1.65rem; } 
.payment .detail_tit a::after, .payment .detail_tit a::before { content:''; display:block; width:90%; height:1px; background:#999; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%) rotate(45deg); } 
.payment .detail_tit a::before { transform: translate(-50%,-50%) rotate(-45deg); } 
.payment .search_wrap { display: flex; align-items: center; justify-content: space-between; width: 90%; margin: 0 auto 2%; } 
.payment .search_wrap.refund_search_wrap { width: 100%; margin: 0 auto 5%; } 
.payment .search_wrap > span { color: #aaa; font-size:1.25rem; } 
.payment .search_wrap .date_wrap { display: flex; align-items: center; justify-content: space-between; width: 46%; border: 1px solid #ccc; border-radius: 0.35rem; height: 3rem; padding: 0 3%; } 
.payment .search_wrap .date_wrap a { display: block; width: 1.75rem; height: 1.75rem; } 
.payment .search_wrap .date_wrap input { border: none; padding: 0; height: 100%; width: 100%; background: #fff; border-radius: 0; text-indent: 2%; color: #333; } 
.payment .search_wrap > a { display: block; text-align: center; font-size: 1.15rem; color: #fff; font-weight: 600; border-radius: 0.75rem; padding: 2.7% 0; width: 20%; } 
.payment .search_wrap .search { background: #1ab398; color: #fff; font-weight: 500; } 

.payment .apply_btn_wrap { margin: 0 auto 100px; display: flex; justify-content: center; align-items: center; gap:10px } 
.payment .apply_btn_wrap a { display: block; padding:15px 0; width: 200px; text-align: center; border: 1px solid #888; border-radius: 180px; font-size: 20px; } 
.payment .apply_btn_wrap a.submit { border-color: #1ab398; color: #1ab398; } 

.payment .none_wrap { display: flex; flex-direction: column; justify-content: center; gap:2rem; align-items: center; margin: 150px auto; } 
.payment .none_wrap span { width: 7rem; height: 7rem; display: block; background: url('http://cdn.hackersbook.com/common/icon/none_icon.png')0 0 no-repeat; background-size: 100%; } 
.payment .none_wrap p { text-align: center; font-size:1.35rem; font-weight: 500; color:#ccc } 

.payment .list_title { background: #555; display: flex; align-items: center; justify-content: left; padding: 3% 5%; } 
.payment .list_title > p { display: flex; align-items: center; justify-content: left; gap:1rem; font-size: 1rem; font-weight: 700; color: #fff; width: 100%; } 
.payment .list_title > p.refund_detail_title { justify-content: space-between; } 
.payment .status { font-size: 1rem; color:#aaa !important; } 
.payment .status.status_complete { color: #21b399 !important; } 
.payment .status.status_cancel { color: #ff786a !important; } 
.payment .list_title > p > a { font-size: 1rem; color:#fff; font-weight: 500; display: flex; align-items:normal; gap:.25rem; margin-left: auto; } 
.payment .list_title > p > a.receipt { } 
.payment .list_title > p > a span { display: block; width: 1.25rem; height: 1.25rem; } 

/* 마이페이지 - 주문 결제 */

.payment .order_list_wrap { padding:3% 5%; } 
.payment .list_header { display: flex; align-items: center; justify-content: space-between; margin:0; } 
.payment .list_header p { display:flex; align-items: center; justify-content: left; font-size: 1.25rem; color:#555; } 
.payment .list_header .select_wrap { margin-left: auto; width: 30%; display: flex; align-items: baseline; justify-content: end; gap:3% } 
.payment .list_header .select_wrap span { display: block; width: 1rem; height: 1rem; pointer-events: none; } 
.payment .list_header .select_wrap select { border: none; background: none; padding: 0; text-align:center } 
.payment .order_list_wrap .order_list .order_item { border:1px solid #aaa; border-radius: 1rem; padding: 5%; margin: 3% auto 5%; } 
.payment .order_list_wrap .order_list .order_item > p { font-size: 1.15rem; margin-bottom: 3%; } 
.payment .order_list_wrap .order_list .order_item > a { font-size: 1.25rem; font-weight: 700; border-radius: 0.75rem; border: 1px solid #d5e9e6; background:#f1fcfb; color: #1ab398; display: block; padding: 3% 0; text-align: center; width: 100%; } 
.payment .order_list_wrap .order_list .order_item .bank_info { background: #f9f9f9; border-radius: 0.75rem; padding: 5%; margin-bottom: 5%; } 
.payment .order_list_wrap .order_list .order_item .bank_info p { margin-bottom: 2%; display: flex; justify-content: left; align-items: center; font-size: 1.05rem; } 
.payment .order_list_wrap .order_list .order_item .bank_info p.order_info_text { font-size: 1.15rem; font-weight: 700; display: block; width: 100%; text-align: center; padding-top: 5%; margin-top: 5%; color: #1ab398; border-top: 1px solid #ddd; } 
.payment .order_list_wrap .order_list .order_item .bank_info p span { font-size: 1.05rem; font-weight: 700; display: block; width: 30%; } 
.payment .order_list_wrap .order_list .order_item .bank_info p a.ico_copy { display: block; margin-left: 2%; width: 1.2rem; height: 1.2rem; } 
.payment .order_list_wrap .order_list .order_item .order_info { padding: 5% 0; border-top: 1px solid #ddd; } 
.payment .order_list_wrap .order_list .order_item .order_info .order_title { font-size: 1rem; color: #1ab398; border: 1px solid #1ab398; border-radius: 0.75rem; text-align: left; padding: 1% 5%; display: inline-block; margin-bottom: 2%; } 
.payment .order_list_wrap .order_list .order_item .order_info .order_text { font-size: 1.15rem; color: #333; font-weight: 700; width: 70%; line-height: 1.75rem; margin: 2% auto 3%; display: inline-block; width: 100%; } 
.payment .order_list_wrap .order_list .order_item .order_info .order_status { display: flex; justify-content: space-between; } 
.payment .order_list_wrap .order_list .order_item .order_info .order_status span:nth-last-of-type(1) { font-size: 1.35rem; font-weight: 700; color:#333; } 
.payment .order_more { display: flex; align-items: center; justify-content: center; font-size: 1.25rem; color: #aaa; font-weight: 500; margin: 0 auto 0; border-top: 1px solid #aaa; padding:4% 0; } 
.payment .order_more.refund { border: 1px solid #ddd; border-radius: 0.5rem; padding: 3% 0; margin: 4% auto; background-color: #fff; } 
.payment .order_more span { display: block; width: 1.5rem; height: 1.35rem; background: url('http://cdn.hackersbook.com/common/icon/arrow_g_v2.png')0 0 no-repeat; background-size: 100%; margin-right: 1%; } 

.payment .notice_wrap { background: #fafafa; padding: 5%; border-radius: 0; margin-bottom: 0; border-top: 8px solid #f2f2f2; border-bottom: 8px solid #f2f2f2 } 
.payment .notice_wrap.refund_notice_wrap { position: relative; width: 110%; left: -5%; } 

.payment .notice_wrap.refund_notice_wrap.apply_notice { padding: 5%; width: 100%; transform: translateX(0); position: relative; left: 0; } 
.payment .notice_wrap.coupon_notice { border: none; margin: 5% 0; } 
.payment .notice_wrap.payment_notice { border:none } 
.payment .notice_wrap b { font-size: 1.1rem; font-weight: 700; color: #222; margin-bottom: 3%; } 
.payment .notice_wrap p { font-size: 1rem; color: #aaa; margin-bottom:2%; position: relative; padding-left: 15px; } 
.payment .notice_wrap.refund_notice_wrap b { color: #788b9b; } 
.payment .notice_wrap.refund_notice_wrap p { color: #788b9b; } 
.payment .notice_wrap.coupon_notice p { color:#788b9b; } 
.payment .notice_wrap p::before { content: ''; display: inline-block; width: 4px; height: 4px; border-radius: 50%; background: #aaa; position: absolute; top: 50%; left: 0; transform: translateY(-50%); } 
.payment .notice_wrap.coupon_notice p::before { background: #788b9b; } 
.payment .notice_wrap.refund_notice_wrap p::before { background: #788b9b; } 
.payment .notice_wrap p:nth-last-of-type(1) { margin-bottom: 0; } 



/* 환불문의 */

.payment .refund_list_wrap { padding: 0 5% 3%; } 
.payment .refund_list_wrap >a.refund_btn { background:#2bbea4; color: #fff; display: block; padding: 3% 0; text-align: center; font-size: 1.15rem; font-weight: 700; border-radius: 0.75rem; } 
.payment .refund_tab_group { overflow-x: auto; margin: 5% auto 8%; width: 100%; } 
.payment .refund_tab_group::-webkit-scrollbar { display: none; } 
.payment .refund_tab_group .refund_tab_btn { display: flex; justify-content: left; align-items: center; gap:3%; width: 120%; } 
.payment .refund_tab_group .refund_tab_btn li a { border: 1px solid #ccc; background: #fff; display: block; padding: 9% 0%; font-size: 1.15rem; text-align: center; color: #ccc; border-radius: 2rem; width: 7rem; } 
.payment .refund_tab_group .refund_tab_btn li a.active { border: 1px solid #d5e9e6; background: #f1fcfb; color: #2bbea4; } 
.payment .refund_list_wrap .tab_content .list_wrap { margin-top: 5%; } 
.payment .refund_list_wrap .tab_content .list_item { padding: 5%; border: 1px solid #aaa; border-radius: 0.75rem; margin-bottom: 5%; } 
.payment .refund_list_wrap .tab_content .list_item .list_item_header { display: flex; justify-content: space-between; align-items: center; padding-bottom: 3%; margin-bottom:3%; border-bottom: 1px solid #aaa; } 
.payment .refund_list_wrap .tab_content .list_item .list_item_header p.status { font-size: 1.15rem; font-weight: 700; } 
.payment .refund_list_wrap .tab_content .list_item .list_item_header a { font-size: 1.15rem; color: #888; display: flex; justify-content: end; align-items: center; gap:2%; width: 40%; } 
.payment .refund_list_wrap .tab_content .list_item .list_item_header a span { width: 1.05rem; height: 1.25rem;; } 
.payment .refund_list_wrap .tab_content .list_item dl dt { display: flex; justify-content: left; align-items: center; gap:5%; font-size: 1.1rem; } 
.payment .refund_list_wrap .tab_content .list_item dl dt span { display: block; } 
.payment .refund_list_wrap .tab_content .list_item dl dd.title { font-size: 1.25rem; color: #333; margin: 3% 0; } 
.payment .refund_list_wrap .tab_content .list_item dl dd.refund_amount { color: #2bbea4; display: flex; justify-content: left; gap:3%; margin-bottom: 3%; font-size: 1.15rem; } 
.payment .refund_list_wrap .tab_content .list_item dl dd.refund_amount span { color: #2bbea4; font-weight: 700; } 
.payment .refund_list_wrap .tab_content .list_item dl dd.date { color: #aaa; font-size: 1rem; } 

.payment .refund_info { padding: 5%; } 
.payment .refund_info > a { display: block; background: #2bbea4; color: #fff; display: block; padding: 3% 0; text-align: center; font-size: 1.15rem; font-weight: 500; border-radius: 0.75rem; } 
.payment .refund_info ul { padding: 5% 0; border-bottom: 1px solid #ddd; } 
.payment .refund_info ul:nth-last-of-type(1) { border: none; } 
.payment .refund_info ul li { display: flex; align-items:flex-start; justify-content: left; margin-bottom: 20px; } 
.payment .refund_info ul li:nth-last-of-type(1) { margin-bottom: 0; } 
.payment .refund_info ul li > b { display: block; width: 30%; font-size: 1.15rem; text-align: left; font-weight: 500; color:#555; } 
.payment .refund_info ul li span { display: block; width: 70%; font-size: 1.15rem; text-align: left; font-weight: 500; color:#555; } 
.payment .refund_info ul li span.refund_amount { font-size: 1.15rem; text-align: left; font-weight: 700; color:#555; } 

.payment .refund_tab_area .tab_content { display: none; } 
.payment .refund_tab_area .tab_content.active { display: block; } 
.payment .refund_wait { padding: 5%; border-top: 8px solid #f2f2f2; } 
.payment .refund_wait p { font-size: 1.25rem; font-weight: 500; color: #888; background: #f8f8f8; padding: 7% 0; border-radius: 0.75rem; text-align: center; } 
.payment .refund_content { background: #fff; border-top: 8px solid #f2f2f2; } 
.payment .refund_content dl dt { font-size: 1rem; font-weight: 500; color: #aaa; margin-bottom: 3%; padding: 3%; } 
.payment .refund_content dl dd { font-size: 1.15rem; font-weight: 500; color: #555; line-height: 1.75rem; padding: 3%; } 
.payment .refund_content.user { background: #f8f8f8; } 
.payment .refund_content.user dt input[type="radio"] { display: none; } 
.payment .refund_content.user dt { display: flex; justify-content: space-between; align-items: center; width: 100%; } 
.payment .refund_content.user dt label { display: block; width: 49%; border: 1px solid #888888; border-radius: 0.75rem; padding: 3% 0; text-align: center; background: #fff; color: #888888; margin-bottom: 3%; } 
.payment .refund_content.user dt input[type="radio"]:checked+label { font-weight: 700; color:#fff; background:#333; border-color: #333; } 
.payment .refund_content.user dd { text-align: center; font-size: 1.15rem; color: #1ab398; } 
.payment .refund_content.user dd#detailUserComment { text-align: left; color: #555; } 
.payment .refund_content.user dd textarea { width: 100%; border: 1px solid #ddd; border-radius: 0.75rem; padding: 3% 5%; background: #fff; margin-bottom: 5%; } 
.payment .refund_content.user dd textarea::placeholder { font-size: 1rem; color:#ddd; } 
.payment .refund_content.user dd a { display: block; background: #2bbea4; color: #fff; display: block; padding: 3% 0; text-align: center; font-size: 1.15rem; font-weight: 500; border-radius: 0.75rem; } 

#adminCommentList dl + dl { border-top: 1px solid #eee; }
.payment .refund_content.admin .refund_complete_message { padding: 5%; text-align: center; } 
.payment .refund_content.admin .refund_complete_message p { font-size: 1.25rem; font-weight: 700; color: #1ab398; margin-bottom: 2%; } 
.payment .refund_content.admin .refund_complete_message p.sub_text { font-size: 1.05rem; font-weight: 400; color: #888; margin-bottom: 0; } 

.payment .refund_content.complete div p { text-align: center; font-size: 1rem; color: #aaa; } 
.payment .refund_content.complete div p.state { font-size: 1.15rem; margin-bottom: 3%; color: #1ab398; border-top: 1px solid #ccc; padding-top: 3%; }
.payment .refund_content.complete div { width: 90%; margin: 0 auto; border-top:1px solid #ddd; padding: 5% 0; } 
.payment .refund_content.complete div ul { background: #fff; padding: 5%; margin-top: 5%; border-radius: 0.75rem; } 
.payment .refund_content.complete div ul li { display: flex; justify-content: space-between; align-items: center; margin-bottom: 3%; } 
.payment .refund_content.complete div ul li:nth-last-of-type(1) { margin-bottom: 0; } 
.payment .refund_content.complete div ul li b { font-size: 1.05rem; color: #888; } 
.payment .refund_content.complete div ul li p { font-size: 1.05rem; color: #555; } 
.payment .refund_content.complete div ul li p >span { font-size: 1.15rem; color:#222; font-weight: 700; } 
.payment .refund_apply_wrap .apply_tit { width: 100%; display: flex; justify-content: left; align-items: end; padding: 3% 5%; gap: 3%; border-bottom: 1px solid #eee; background: #fafafa; } 
.payment .refund_apply_wrap .apply_tit h5 { font-size: 1.35rem; color: #333; } 
.payment .refund_apply_wrap .apply_tit .info_text { display: none; font-size: 1rem; color: #ff4b38; } 
.payment .refund_apply_wrap .apply_tit .info_text.active { display: block; } 
.payment .refund_apply_wrap .apply_tit .status_btn { margin-left: auto; color: #2bbea4; display: flex; justify-content: end; align-items: center; gap:5%; width: 17%; } 
.payment .refund_apply_wrap .apply_tit .status_btn span { display: block; width: 0.65rem; height: 1.2rem; background-size: 100%; } 
.payment .refund_apply_wrap .user_info { padding: 5% 5% 10%; width: 100%; margin: 0 auto; border-bottom: 8px solid #f2f2f2; } 
.payment .refund_apply_wrap .user_info li { margin-bottom: 5%; } 
.payment .refund_apply_wrap .user_info li:nth-last-of-type(1) { margin-bottom: 0; } 
.payment .refund_apply_wrap .user_info li label { font-size: 1.25rem; color: #333; font-weight: 700; width: 100%; display: block; margin-bottom: 1%; } 
.payment .refund_apply_wrap .user_info li input { width: 100%; border: 1px solid #ddd; border-radius: 0.55rem; padding: 3% 5%; background: #fff; } 
.payment .refund_apply_wrap .user_info li.not_entrd label { color: #ff4b38; } 
.payment .refund_apply_wrap .user_info li.not_entrd input { border-color: #ff4b38; } 
.payment .refund_apply_wrap .refund_product_btn.error { border-color: #ff4b38 !important; } 
.payment .refund_apply_wrap .bank_info .select_wrap.error select { border-color: #ff4b38 !important; } 
.payment .refund_apply_wrap .bank_info input.error { border-color: #ff4b38 !important; } 
.payment .refund_apply_wrap .agree_wrap.error { border: 1px solid #ff4b38; border-radius: 0.75rem; } 
.payment .refund_apply_wrap .check_wrap.error { border: 1px solid #ff4b38; border-radius: 0.75rem; } 
.payment .refund_apply_wrap .reason_textarea.error { border-color: #ff4b38 !important; } 
.payment .refund_apply_wrap .bank_info_wrap { border-bottom: 8px solid #f2f2f2; padding-bottom: 7%; } 
.payment .refund_apply_wrap .order_info { padding: 5%; border-bottom: 8px solid #f2f2f2; } 
.payment .refund_apply_wrap .order_info li { display: flex; justify-content: space-between; align-items: start; margin-bottom: 5%; } 
.payment .refund_apply_wrap .order_info li:nth-last-of-type(1) { margin-bottom: 0; padding-top: 5%; border-top: 1px solid #eee; } 
.payment .refund_apply_wrap .order_info li span { display: block; font-size: 1.1rem; width: 25%; } 
.payment .refund_apply_wrap .order_info li span:nth-of-type(2) { width: 75%; } 
.payment .refund_apply_wrap .order_info li b { font-size: 1.2rem; } 
.payment .refund_apply_wrap .bank_info { margin:0 auto; padding: 5%; } 
.payment .refund_apply_wrap .bank_info .select_wrap { width: 100%; margin-bottom: 5%; } 
.payment .refund_apply_wrap .bank_info .select_wrap select { width: 100%; border-color: #ccc; padding: 3% 5%; border-radius: .75rem; } 
.payment .refund_apply_wrap .bank_info input { background: #fff; border: 1px solid #ddd; border-radius:0.75rem; padding: 3% 5%; height: auto; width: 100%; font-size: 1rem; color: #333; margin-bottom: 5%; } 
.payment .refund_apply_wrap .bank_info input::placeholder { font-size: 1rem; color:#ddd; } 
.payment .refund_apply_wrap .bank_info input.user_name { background: #fff; border-color: #ddd; width:100%; } 
.payment .refund_apply_wrap a.bank_check { display: block; color: #1ab398; background: #f1fcfb; text-align: center; font-size: 1.15rem; padding: 3% 0; border-radius: 0.75rem; border: 1px solid #d5e9e6; width: 90%; margin: 0 auto; } 
.payment .refund_apply_wrap .bank_check_done { padding: 3% 5%; justify-content: left; align-items: center; gap:2%; display: none; color: #1ab398; font-size: 1.25rem; margin-bottom: 5%; } 
.payment .refund_apply_wrap .bank_check_done.active { display: flex; } 
.payment .refund_apply_wrap .bank_check_done span { width: 1.35rem; height: 1.35rem; } 
.payment .refund_apply_wrap .agree_wrap { padding: 0 5%; margin-bottom: 5%; } 
.payment .refund_apply_wrap .agree_wrap li:nth-of-type(1) { margin-bottom: 5%; padding-bottom: 5%; border-bottom: 1px solid #eee; } 
.payment .refund_apply_wrap .agree_wrap li p { display: flex; justify-content: left; align-items: center; } 
.payment .refund_apply_wrap .agree_wrap li p input { display: none; } 
.payment .refund_apply_wrap .agree_wrap li p label { font-size: 1.15rem; color: #aaa; display: flex; justify-content: left; align-items: center; gap: 3%; width: 80%; } 
.payment .refund_apply_wrap .agree_wrap li p label::before { content: ''; display: block; width: 1.75rem; height: 1.75rem; background: url('http://cdn.hackersbook.com/common/icon/check_off.png')0 0 no-repeat; background-size: 100%; } 
.payment .refund_apply_wrap .agree_wrap li p input[type="checkbox"]:checked+label::before { content: ''; display: block; width: 1.75rem; height: 1.75rem; background: url('http://cdn.hackersbook.com/common/icon/check_on.png')0 0 no-repeat; background-size: 100%; } 
.payment .refund_apply_wrap .agree_wrap li p a { margin-left: auto; width: 1.5rem; height: 1.5rem; display: block; background: url('http://cdn.hackersbook.com/common/icon/open_arrow.png') 0 0 no-repeat; background-size: 100%; } 
.payment .refund_apply_wrap .agree_wrap li p a.active { transform: rotate(180deg); } 
.payment .refund_apply_wrap .agree_wrap .detail_wrap { background: #f9f9f9; height: 10rem; padding: 5%; overflow-y: scroll; margin-top: 5%; display: none; border-radius: 0.75rem; } 
.payment .refund_apply_wrap .agree_wrap .detail_wrap.active { display: block; } 
.payment .refund_apply_wrap .agree_wrap .detail_wrap b { font-size: 1.15rem; margin-bottom: 3%; display: block } 
.payment .refund_apply_wrap .agree_wrap .detail_wrap p { display: block; } 
.payment .refund_apply_wrap .agree_wrap .detail_wrap::-webkit-scrollbar { width: 5px; } 
.payment .refund_apply_wrap .agree_wrap .detail_wrap::-webkit-scrollbar-track { width: 5px; border-radius: 10px; background: rgba(0, 0, 0, 0.55); } 
.payment .refund_apply_wrap .agree_wrap .detail_wrap::-webkit-scrollbar-thumb { width: 5px; border-radius: 10px; background: #f4f4f4; } 
.payment .refund_apply_wrap .check_wrap { padding: 5% 5% 0; } 
.payment .refund_apply_wrap .check_wrap dl { margin-bottom: 10%; } 
.payment .refund_apply_wrap .check_wrap dl:nth-last-of-type(1) { margin-bottom: 0; } 
.payment .refund_apply_wrap .check_wrap dl dt { font-size: 1.15rem; font-weight: bold; text-align: left; color: #555; margin-bottom:5%; } 
.payment .refund_apply_wrap .check_wrap dl dd { padding: 3% 0; } 
.payment .refund_apply_wrap .check_wrap dl dd span { margin-bottom: 5%; display: block; } 
.payment .refund_apply_wrap .check_wrap dl dd span:nth-last-of-type(1) { margin-bottom: 0 } 
.payment .refund_apply_wrap .check_wrap dl dd span input { display: none; } 
.payment .refund_apply_wrap .check_wrap dl dd span label { display: flex; justify-content: left; gap:5%; align-items: center; font-size: 1.15rem; font-weight: normal; position: relative; text-align: left; color: #888; } 
.payment .refund_apply_wrap .check_wrap dl dd span label::before { content: ''; display: block; width: 1.75rem; height: 1.75rem; border-radius: 50%; border:1px solid #ddd; } 
.payment .refund_apply_wrap .check_wrap dl dd span input[type="radio"]:checked+label::after { content: ''; display: block; width: 1rem; height: 1rem; background: #1ab398; border-radius: 50%; position: absolute; top: 20.2%; transform: translateX(-50%); left: 3.3%; } 
.payment .refund_apply_wrap .check_wrap dl dd span input[type="radio"]:checked+label::before { border-color: #1ab398; } 
.payment .refund_apply_wrap .refund_notice { font-size: 1.15rem; color: #1ab398; margin: 3% 0 5%; display: flex; justify-content: left; align-items: center; padding: 0 5%; border-bottom: 8px solid #f2f2f2; } 
.payment .refund_apply_wrap .apply_notice .refund_notice { border-bottom: none; padding: 0; } 
.payment .refund_apply_wrap .apply_notice .refund_notice::before { display: none; } 
.payment .refund_apply_wrap .refund_notice span { width: 1.45rem; height: 1.45rem; margin-right: 2%; background: url('http://cdn.hackersbook.com/common/icon/notice_m.png') 0 0 no-repeat; background-size: 100%; } 
.payment a.refund_apply_btn { display: block; width: 100%; color: #fff; background: #ccc; padding: 5% 0; text-align: center; font-size: 1.25rem; } 
.payment a.refund_apply_btn.active { background:#1ab398; } 
.payment .reason_textarea { display: block; width: 100%; padding: 5%; border-radius: 0.75rem; border: 1px solid #ddd; font-size: 1.15rem; height: 8rem } 

.payment .coupon_register_btn_wrap { display: flex; width:90%; margin: 0 auto; justify-content: space-between; align-items: center; } 
.payment .coupon_register_btn_wrap a { display: flex; justify-content: center; align-items: center; gap:3.5%; width: 48%; padding: 3% 0; text-align: center; font-weight: 700; color: #21b399; font-size: 1.25rem; border: 1px solid #21b399; border-radius: 0.75rem; } 
.payment .coupon_register_btn_wrap a span { display: block; width: 1.5rem; height: 1.5rem; } 

.payment .coupon_tab_wrap { width: 90%; margin: 7% auto 5%; } 
.payment .coupon_tab_wrap .tab_btn { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #2bbea4; } 
.payment .coupon_tab_wrap .tab_btn li { width: 50%; } 
.payment .coupon_tab_wrap .tab_btn li a { display: block; padding: 7% 0; text-align: center; color: #8b95a5; border-radius: 1rem 1rem 0 0; font-size: 1.15rem; background: #f2f5fa; } 
.payment .coupon_tab_wrap .tab_btn li a.active { background: #2bbea4; color: #fff; font-weight: 700; } 
.payment .coupon_list_content { display: none; padding: 5% 0 0; } 
.payment .coupon_list_content.active { display: block; } 
.payment .coupon_list_content .list_wrap { width: 100%; margin: 5% 0 0; } 
.payment .coupon_list_content .list_wrap::-webkit-scrollbar { display: none; } 
.payment .coupon_list_content .list_wrap li { width: 100%; margin-bottom: 4%; border-radius: 0.75rem; border: 1px solid #aaaaaa; padding: 5% } 
.payment .coupon_list_content .list_wrap.done li { border:1px solid #f8f8f8; background: #f8f8f8; color: #aaa !important; } 
.payment .coupon_list_content .list_wrap.done li dl dt { display: flex; justify-content: space-between; align-items: center; } 
.payment .coupon_list_content .list_wrap.done li dl dt span { color: #aaa; font-size: 1rem; font-family: 700; } 
.payment .coupon_list_content .list_wrap li dl dt b { font-size: 2.2rem; display: block; color:#1ab398; font-weight: 700; } 
.payment .coupon_list_content .list_wrap.done li dl dt b { color: #aaa; } 
.payment .coupon_list_content .list_wrap li dl dd p { font-size: 1.05rem; color: #333; } 
.payment .coupon_list_content .list_wrap.done li dl dd p { color: #aaa; } 
.payment .coupon_list_content .list_wrap li dl dd.coupon_date { color: #aaa; margin-top: 3%; } 


.payment { width:100%; margin: 0 auto; } 
.payment .payment_cart_header { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 2.5% 5%; border-bottom: 1px solid #f2f2f2; border-top: 1px solid #f2f2f2; } 
.payment .payment_cart_header a { display: block; width: 2rem; height: 2rem; } 
.payment .payment_cart_header h2 { font-size: 1.75rem; font-weight: 700; } 
.payment .payment_cart_wrap .payment_cart_list { width: 100%; } 
.payment .payment_cart_wrap .payment_cart_list .list_none_wrap { padding: 15% 0; display: flex; justify-content: center; align-items: center; flex-direction: column; } 
.payment .payment_cart_wrap .payment_cart_list .list_none_wrap span { width: 7rem; height: 7rem; } 
.payment .payment_cart_wrap .payment_cart_list .list_none_wrap p { font-size: 1.55rem; color:#ccc; margin: 7% auto 15%; } 
.payment .payment_cart_wrap .payment_cart_list > ul { display: flex; justify-content: space-between; align-items: center; border-bottom: 8px solid #f2f2f2; padding:3% 5%; } 
.payment .payment_cart_wrap .payment_cart_list > ul > li:nth-of-type(1) { display: flex; justify-content: left; align-items: center; gap: 3%; width: 50%; } 
.payment .payment_cart_wrap .payment_cart_list > ul > li:nth-of-type(1) p { font-size: 1.15rem; color: #555; } 
.payment .payment_cart_wrap .payment_cart_list > ul > li:nth-of-type(1) p span { font-weight: 700; } 
.payment .payment_cart_wrap .payment_cart_list > ul > li:nth-of-type(1) p span em { font-style: normal; color: #1ab398; font-weight: 700; } 
.payment .payment_cart_wrap .payment_cart_list > ul li > a { display: block; border-radius: 6px; border: 1px solid #c5c5c5; color: #888; padding: 0.4rem 1.25rem; text-align: center; font-size: 1.1rem; width: 100%; } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table { width: 100%; } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table .cart_product { width: 100%; padding: 5%; display: flex; justify-content: left; gap: 5%; } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table .cart_product p { color: #1ab398; border: 1px solid #1ab398; border-radius: 0.65rem; padding: 1% 1.9%; display: inline-block; font-size: 1.05rem; text-align: center; min-width: 140px; } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table .cart_product a { width: 2rem; height: 2rem; position: relative; margin-left: auto; } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table td { padding: 3% 0; border-bottom: 1px solid #eeeeee; } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table tr:nth-last-of-type(1) { border:none } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table td > p { width: 69.5%; font-size: 1.15rem; color: #333; font-weight: 700; line-height: 1.75rem; margin: 2% auto 3%; display: block; } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table td > a { background: #2bbea4; color: #fff; display: block; padding: 3% 0; text-align: center; font-size: 1.15rem; font-weight: 700; border-radius: 0.75rem; width: 69.5%; margin: 3% auto; } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table td > a.sold_out { background: #c5c5c5; color: #888; } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table td .price { display: flex; justify-content: space-between; width: 69.5%; margin: 0 auto; padding-top: 3%; border-top: 1px solid #eee; } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table td .price span { font-size: 1.3rem; } 
.payment .payment_cart_wrap .payment_cart_list .payment_cart_table td .price p { font-size: 1.35rem; font-weight: 700; color: #333; } 
.payment_cart_table .cart_product a::after,.payment_cart_table .cart_product a::before { content:''; display:block; width:90%; height:1px; background:#333; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%) rotate(45deg); } 
.payment_cart_table .cart_product a::before { transform: translate(-50%,-50%) rotate(-45deg); } 
.payment .payment_cart_wrap .payment_cart_list input[type="checkbox"] { display: none; } 
.payment .payment_cart_wrap .payment_cart_list input[type="checkbox"]+label { display: block; width: 1.85rem; height: 1.85rem; background: url('http://cdn.hackersbook.com/common/icon/checkbox_off.png')0 0 no-repeat; background-size: 100%; } 
.payment .payment_cart_wrap .payment_cart_list input[type="checkbox"]:checked+label { background: url('http://cdn.hackersbook.com/common/icon/checkbox_on.png')0 0 no-repeat; background-size: 100%; } 


.payment .payment_cart_wrap .payment_cart_info { width: 100%; background: #f8fefd; position: fixed; left: 0; bottom: 0; z-index: 99; box-shadow: 0 0 25px rgba(0,0,0,0.1); } 
.payment .payment_cart_wrap .payment_cart_info.checkout_wrap { position: relative; box-shadow: none; background: #fff; } 
.payment .payment_cart_wrap .payment_cart_info.checkout_wrap > p { display: flex; justify-content: space-between; align-items: center; padding: 3% 5%; font-size: 1.25rem; } 
.payment .payment_cart_wrap .payment_cart_info.checkout_wrap > p:nth-last-of-type(1) { border-bottom: 1px solid #aaa; width: 90%; margin: 0 auto; padding: 3% 0; flex-wrap: wrap; } 
.payment .payment_cart_wrap .payment_cart_info .delivery_fee { font-size: 1rem; color: #c5c5c5; width: 100%; display: block; } 
.payment .payment_cart_wrap .payment_cart_info.none { background: #fcfcfc; border:1px solid #f4f4f4; } 
.payment .payment_cart_wrap .payment_cart_info .total_price { padding: 3% 5%; display: flex; align-items: center; justify-content: space-between; border-bottom: 8px solid #f2f2f2; } 
.payment .payment_cart_wrap .payment_cart_info .total_price p { font-weight: 700; font-size: 1.45rem; width: 50%; color: #333; } 
.payment .payment_cart_wrap .payment_cart_info.none .total_price p { color: #c5c5c5; } 
.payment .payment_cart_wrap .payment_cart_info .total_price .price { color: #ff4b38; color: #ff4b38; width: 50%; display: flex; justify-content: end; font-size: 1.55rem; } 
.payment .payment_cart_wrap .payment_cart_info.none .total_price .price { color: #c5c5c5; } 
.payment .payment_cart_wrap .payment_cart_info .total_price .price span { color: #ff4b38; font-size:1.55rem; font-weight: 700; } 
.payment .payment_cart_wrap .payment_cart_info.none .total_price .price span { color:#c5c5c5 } 

.payment a.next_btn { display: flex; gap:5%; align-items: center; justify-content: center; background: #2bbea4; color:#fff; font-weight: 700; font-size: 1.55rem; padding: 5% 0; text-align: center; } 
.payment a.next_btn.disabled { background: #c5c5c5; } 
.payment a.next_btn.cancel_btn { background: #000; } 
.payment .payment_cart_wrap .payment_cart_info.none a { background: #c5c5c5; } 
.payment .payment_cart_wrap .payment_cart_info a span { display: block; font-size: 1.55rem; opacity: 0.7; } 


.payment .checkout_wrap .sub_tit { font-size: 1.25rem; font-weight: 700; display: flex; align-items: center; justify-content: left; padding: 2.8% 5%; background: #fafafa; gap: 3%; border-bottom: 1px solid #eee; } 
.payment .payment_cart_info .sub_tit { border-top: 8px solid #f2f2f2; } 
.payment .checkout_wrap .sub_tit.type1 { border-top: 8px solid #f2f2f2; margin-top: 8%; } 
.payment .checkout_wrap .sub_tit span { color: #1ab398; } 
.payment .checkout_wrap .sub_tit a { font-size: 13px; color:#888; padding: 5px 15px; text-align: center; font-weight: 500; border-radius: 6px; border:1px solid #888; display: inline-block; margin-left: auto; } 
.payment .checkout_wrap.delivery_info .sub_tit a.delivery_edit_btn { background: none; border: none; color: #1ab398; display: flex; align-items: center; justify-content: end; gap: 7%; padding: 0; width: 16%; font-size: 1.2rem; } 
.payment .checkout_wrap.delivery_info .sub_tit a.delivery_edit_btn span { display: block; width: 0.6rem; height: 1.2rem; } 
.payment .checkout_wrap .order_list { padding:5%; border-bottom:1px solid #eee; width: 100%; margin: 0 auto; } 
.payment .checkout_wrap .order_list:nth-last-of-type(1) { border-bottom: 8px solid #f2f2f2; } 
.payment .checkout_wrap .order_list li { margin-bottom: 1rem; display: flex; justify-content: space-between; align-items: center; } 
.payment .checkout_wrap .order_list li.order_item { display: block; padding: 0; } 
.payment .checkout_wrap .order_list li.order_item:nth-of-type(1) { border-top: none; } 
.payment .checkout_wrap .order_list li p { color: #555; font-size: 16px; line-height: 1.55rem; } 
.payment .checkout_wrap .order_list li p:nth-of-type(1) { text-align: left; font-size:1.55rem; } 
.payment .checkout_wrap .order_list li.order_item p:nth-of-type(1) { color: #1ab398; border: 1px solid #1ab398; border-radius: 0.65rem; padding: 1% 1.9%; display: inline-block; font-size: 1.05rem; text-align: center; min-width: 140px; } 
.payment .checkout_wrap .order_list li.order_item p:nth-of-type(2) { width: 100%; margin: 3% 0 5%; font-size: 1.25rem; font-weight: 700; line-height: 1.75rem; color: #333; } 
.payment .checkout_wrap .order_list li.order_item p:nth-of-type(3) { font-size: 1.25rem; color: #888; justify-content: left; gap:5%; display: flex; align-items: center; margin: 3% 0 5%; } 
.payment .checkout_wrap .order_list li.order_item p:nth-of-type(3) span { font-weight: 700; } 
.payment .checkout_wrap .order_list li:nth-last-of-type(1) p:nth-last-of-type(1) { width:50%; text-align: right; font-size: 1.55rem; } 
.payment .checkout_wrap .order_list li:nth-last-of-type(1) p span { font-size:1.55rem; font-weight: 700; } 
.payment .checkout_wrap .order_list li a.coupon { display: flex; align-items: center; justify-content: left; width: 100%; font-size: 1.15rem; padding: 3% 3%; border-radius: 6px; border: 1px solid #ddd; color: #aaa; margin: 3% 0 } 
.payment .checkout_wrap .order_list li a.coupon >span { margin-left: auto; white-space: nowrap; } 
.payment .checkout_wrap .order_list li a.coupon > span.icon { width: 0.8rem; height: 1.6rem; margin-left: auto; } 
.payment .checkout_wrap .order_list li a.coupon p { font-weight: 500; font-size: 1rem; width: 120%; margin-left: 3%; } 
.payment .checkout_wrap .order_list li a.coupon p b { color: #16a58f; } 
.payment .checkout_wrap .order_list li a.coupon .select { color: #1ab398; font-size: 1rem; font-weight: 500; display: inline; } 
.payment .checkout_wrap .order_list li a.coupon.coupon_none { border:1px solid #f8f8f8; background: #f8f8f8; color:#ccc } 
.payment .checkout_wrap .order_list li a.coupon.coupon_none span { opacity: 0.5; } 
.payment .checkout_wrap .order_list li a.coupon.coupon_none p { color: #ccc; font-size: 1.15rem; text-align: center; width: 100%; } 
.payment .checkout_wrap .order_list li a.coupon.coupon_select { border:1px solid #e0f2ef; background: #f5fcfb; color: #1ab398; } 
.payment .checkout_wrap .order_list li a.coupon.coupon_select p { font-weight: 500; font-size: 1.15rem; color: #1ab398; } 
.payment .checkout_wrap .order_list li a.coupon.coupon_select b { font-size: 1.3rem; text-align:left; width: 30%; } 
.payment .checkout_wrap .order_list li a.coupon.coupon_select.order p { font-weight: 700; } 
.payment .checkout_wrap .order_list li a.coupon.coupon_select.order b { text-align: right; } 
.payment .checkout_wrap .order_list li a.coupon.coupon_select .icon_coupon_m { display: block; width: 1.5rem; height: 1.5rem; } 
.payment .checkout_wrap .order_list li a.coupon.coupon_select .icon_close { display: block; width: 1.5rem; height: 1.5rem; margin-left: auto; } 
.payment .checkout_wrap .payment_list { display: flex; align-items: center; justify-content: left; flex-wrap: wrap; gap:2%; width: 90%; margin: 5% auto 0; } 
.payment .checkout_wrap .payment_list li { width: 49%; margin-bottom: 3%; } 
.payment .checkout_wrap .payment_list li input { display: none; } 
.payment .checkout_wrap .payment_list li label { display: flex; justify-content: center; align-items: center; flex-direction: column; padding: 2.2%; font-size: 1.25rem; border-radius: 0.75rem; border: 1px solid #ccc; background: #fff; color: #888; height: 5.3rem; } 
.payment .checkout_wrap .payment_list li input[type="radio"]:checked+label { color: #1ab398; background: #f5fcfb; border-color: #1ab398; } 
.payment .checkout_wrap .payment_list li label span { width: 5rem; height: 2rem; } 
.payment .checkout_wrap .payment_list li label.payco span { background: url('http://cdn.hackersbook.com/common/icon/payco_off.png') 0 0 no-repeat; background-size: 100%; width: 8rem; height: 1.6rem; } 
.payment .checkout_wrap .payment_list li label.tos span { background: url('http://cdn.hackersbook.com/common/icon/toss_on.png') 0 0 no-repeat; background-size: 100%; opacity: 0.5; width: 8rem; height: 1.6rem; } 
.payment .checkout_wrap .payment_list li input[type="radio"]:checked+label.payco span { background: url('http://cdn.hackersbook.com/common/icon/payco_on.png') 0 0 no-repeat; background-size: 100%; } 
.payment .checkout_wrap .payment_list li input[type="radio"]:checked+label.tos span { background: url('http://cdn.hackersbook.com/common/icon/toss_on.png') 0 0 no-repeat; background-size: 100%; opacity: 1; } 
.payment .checkout_wrap a.info_pop_btn { display: flex; align-items: center; justify-content: space-between; color:#888; font-size: 13px; border-bottom: 1px solid #888; padding-bottom: 3px; width: 100px; } 
.payment .checkout_wrap a.info_pop_btn span { width: 8px; height: 16px; } 
.payment .checkout_wrap .refund_wrap { background: #f8f8f8; padding: 20px; border-radius: 10px; height: 200px; overflow-y: scroll; margin: 30px auto 50px; color: #aaaaaa; } 
.payment .checkout_wrap .refund_wrap p { margin: 10px 0; font-weight: 700; color: #aaaaaa; } 
.payment .checkout_wrap .notice_wrap { border: 8px solid #f2f2f2; } 
.payment .checkout_wrap.payment_info { border-top: 8px solid #f2f2f2; border-bottom: 8px solid #f2f2f2; } 
.payment .checkout_wrap.payment_info .payment_info_list { padding:5%; width: 100%; margin: 0 auto; border-top: 1px solid #eee; } 
.payment .checkout_wrap.payment_info .payment_info_list li { display: flex; justify-content: space-between; align-items: center; margin-bottom: 3%; padding: 3% 0; } 
.payment .checkout_wrap.payment_info .payment_info_list li:nth-of-type(1) { align-items: flex-start; } 
.payment .checkout_wrap.payment_info .payment_info_list li.total_price_wrap { border: none; margin: 0; } 
.payment .checkout_wrap.payment_info .payment_info_list li.price_wrap { border-top: 1px solid #ddd; border-bottom: 1px solid #aaa; padding: 7% 0; flex-wrap: wrap; } 
.payment .checkout_wrap.payment_info .payment_info_list li span { display: block; width: 50%; font-weight: 500; font-size: 1.25rem } 
.payment .checkout_wrap.payment_info .payment_info_list li span:nth-of-type(1) { width: 30%; } 
.payment .checkout_wrap.payment_info .payment_info_list li span:nth-of-type(2) { width: 70%; } 
.payment .checkout_wrap.payment_info .payment_info_list li span.price { color:#333; font-weight: 700; text-align: right;; } 
.payment .checkout_wrap.payment_info .payment_info_list li span.price:nth-last-of-type(1) { margin-top: 3%; } 
.payment .checkout_wrap.payment_info .payment_info_list li span:nth-of-type(2) { text-align: right; } 
.payment .checkout_wrap.payment_info .payment_info_list.orderer_info_list li span:nth-of-type(2),
.payment .checkout_wrap.payment_info .payment_info_list.delivery_info_list li span:nth-of-type(2) { text-align: left; } 
.payment .checkout_wrap.payment_info .payment_info_list li p { width: 50%; font-weight: 700; font-size: 1.35rem; color: #333; } 
.payment .checkout_wrap.payment_info .payment_info_list li p.price { color:#ff4b38; text-align: right; justify-content: end; font-size: 1.55rem; } 
.payment .checkout_wrap.discover_info { border-bottom: 8px solid #f2f2f2; } 
.payment .checkout_wrap.discover_info .discover_wrap { padding: 5% } 
.payment .checkout_wrap.discover_info .discover_wrap .select_wrap { margin-left: auto; width:100%; display: flex; align-items: baseline; justify-content: end; gap:3%; border-radius: 0.75rem; border: 1px solid #ccc; padding: 3% 5%; color:#666; font-size: 1.25rem; } 
.payment .checkout_wrap.discover_info .discover_wrap .select_wrap span { display: block; width: 1rem; height: 1rem; } 
.payment .checkout_wrap.discover_info .discover_wrap .select_wrap select { border: none; background: none; padding: 0; text-align:left; color:#666; font-size: 1.15rem; width: 100%; } 
.payment .checkout_wrap.discover_info .discover_input { display: block; margin: 3% auto 0; width: 100%; border: 1px solid #ccc; border-radius: .75rem; padding: 3%; resize: none; } 
.payment .checkout_wrap.delivery_info { border-top: 8px solid #f2f2f2; border-bottom: 8px solid #f2f2f2; } 
.payment .checkout_wrap .order_info_table { margin: 5% auto; width: 98%; } 
.payment .checkout_wrap .order_info_table th, 
.payment .checkout_wrap .order_info_table td { padding: 4% 0 4% 5%; font-size: 1.15rem; color: #666; text-align: left; } 
.payment .info_wrap { border-bottom:1px solid #f2f2f2; width: 90%; margin: 0 auto; } 
.payment .info_wrap a { display: flex; justify-content: space-between; align-items: center; font-size: 1.25rem; padding: 3% 0; } 
.payment .info_wrap a input { display: none; } 
.payment .info_wrap a label { display: flex; justify-content: left; align-items: center; font-size: 1.25rem; gap: .5rem; width: 100%; } 
.payment .info_wrap a label::before { content: ''; display: block; width: 20px; height: 20px; transition: .3s; transform: rotate(0); background: url('http://cdn.hackersbook.com/common/icon/check_off.png') 0 0 no-repeat; background-size: 100%; } 
.payment .info_wrap a input:checked + label::before { display: block; width: 20px; height: 20px; transition: .3s; transform: rotate(0); background: url('http://cdn.hackersbook.com/common/icon/check_on.png') 0 0 no-repeat; background-size: 100%; } 
.payment .info_wrap a label em { font-style: normal; font-size: 1rem; color: #1ab398; border: 1px solid #1ab398; border-radius: 1rem; padding: 1% 1.9%; display: inline-block; } 
.payment .info_wrap a span { display: block; width: 20px; height: 20px; transition: .3s; transform: rotate(0); background: url('http://cdn.hackersbook.com/common/icon/open_arrow.png') 0 0 no-repeat; background-size: 100%; } 
.payment .info_wrap a.active span { transform: rotate(180deg); } 
.payment .notice_wrap.system { border: none; width: 100%; margin: 3% auto 5%; height: 40vw; border-radius: 0.75rem; overflow-y: scroll; display: none; } 
.payment .notice_wrap.system.active { display: block; } 
.payment .notice_wrap.system::-webkit-scrollbar { width: 5px; } 
.payment .notice_wrap.system::-webkit-scrollbar-track { background: rgba(0,0,0,0.0); border-radius: 5px; } 
.payment .notice_wrap.system::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.3); border-radius: 5px; } 
.payment .order_btn_wrap { display: block; position: fixed; left: 0; width: 100%; bottom: 0; z-index: 99; padding: 0; box-shadow: 0 0 25px rgba(0,0,0,0.1); background: #fff; } 
.payment .order_btn_wrap.relative { position: relative; margin-bottom: 5%; } 
.payment .order_btn_wrap input { display: none; } 
.payment .order_btn_wrap label { display: flex; justify-content: left; align-items: center; font-size: 1.25rem; padding: 5%; color: #1ab398; gap: 0.5rem; } 
.payment .order_btn_wrap label span { display: block; width: 1.35rem; height: 1.35rem; background: url('http://cdn.hackersbook.com/common/icon/notice_m.png') 0 0 no-repeat; background-size: 100%; } 
.payment .order_btn_wrap a { display: block; width: 100%; background: #1ab398; color: #fff; font-size: 1.5rem; padding: 4% 0; text-align: center; font-weight: 700; } 
.payment .order_btn_wrap a.disabled { background: #ccc; color: #fff; } 

.payment .order_check_wrap { padding: 10% 0; display: flex; flex-direction: column; justify-content: center; align-items: center; } 
.payment .order_check_wrap span { width: 6.5rem; height:6.5rem; display: block; } 
.payment .order_check_wrap h3 { font-size:1.85rem; color:#000; margin: 3% auto 2%; text-align: center; } 
.payment .order_check_wrap p { font-size: 1.05rem; color: #555555; text-align: center; } 
.payment .order_detail_wrap.done_wrap { padding: 0 5%; background: #f5fcfb; padding: 5%; border-radius: 0.75rem; width: 90%; margin: 5% auto;; } 

.payment .order_detail_wrap li { display: flex; justify-content: left; align-items: center; margin-bottom: 3%; } 
.payment .order_detail_wrap li:nth-last-of-type(1) { margin-bottom: 0; color: #1ab398; gap: 3%; font-size: 1.15rem; } 
.payment .order_detail_wrap li:nth-last-of-type(1) span { display: block; width: 1.45rem; height: 1.45rem; position: relative; background: url('http://cdn.hackersbook.com/common/icon/notice_m.png') 0 0 no-repeat; background-size: 100%; } 
.payment .order_detail_wrap li p { font-size: 1.25rem; } 
.payment .order_detail_wrap .order_list li.payment_status { border-top:none; padding-top:0; margin-top: 0; } 
.payment .order_detail_wrap .order_list li.payment_status p { font-size: 1.15rem; font-weight: 500; display: flex; justify-content: left; align-items: center; width: 50%; } 
.payment .order_detail_wrap .order_list li.payment_status p:nth-last-of-type(1) { width: 50%; justify-content: end; font-weight: 700; font-size: 1.35rem; } 
.payment .order_detail_wrap .order_list li.payment_status p a.detail_btn { display: flex; margin-left: 3%; align-items: center; gap:3%; color:#888; width: 50%; } 
.payment .order_detail_wrap .order_list li.payment_status p a.detail_btn span { width: 0.6rem; height: 1.5rem; } 
.payment .order_detail_wrap li p:nth-of-type(1) { width: 30%; font-weight: 700; } 
.payment .order_detail_wrap li p:nth-of-type(2) { display: flex; justify-content: left; align-items: center; width: 70%; gap:3% } 
.payment .order_detail_wrap li p:nth-of-type(2) a { display: block; width: 1.55rem; height: 1.55rem; position: relative; background: url('http://cdn.hackersbook.com/common/icon/copy_icon.png') 0 0 no-repeat; background-size: 100%; } 
.refund_none_text { padding: 5% 0; display: flex; justify-content: center; align-items: center; font-size: 1.15rem; color: #aaa; width: 100%; } 

.payment_pop_wrap { display: none; width: 100vw; height: 100vh; position: fixed; left: 0; top: 0; z-index: 9999; } 
.payment_pop_wrap.active { display: block; } 
.payment_pop_wrap .bg { width: 100%; height: 100%; position: fixed; left: 0; top:0; background: rgba(0,0,0,0.7); } 
.payment_pop_wrap .pop_inner { width: 100%; background: #fff; border-radius: 1rem 1rem 0 0; position: fixed; left: 50%; bottom:0; transform: translateX(-50%); max-height: 86vh; margin-bottom: env(safe-area-inset-bottom); } 
.payment_pop_wrap .pop_inner .pop_header { display: flex; justify-content: space-between; align-items: center; padding: 5% 0; width: 90%; margin: 0 auto; border-bottom: 1px solid #333; } 
.payment_pop_wrap .pop_inner .pop_header p { font-size: 1.55rem; font-weight: 700; color:#333; } 
.payment_pop_wrap .pop_inner .pop_header a { display: block; width: 1.75rem; height: 1.75rem; position: relative; margin-left: auto; } 
.payment_pop_wrap .pop_inner .pop_header a::after,
.payment_pop_wrap .pop_inner .pop_header a::before { content:''; display:block; width:90%; height:1px; background:#999; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%) rotate(45deg); } 
.payment_pop_wrap .pop_inner .pop_header a::before { transform: translate(-50%,-50%) rotate(-45deg); } 

.payment_pop_wrap .pop_content { min-height: 60vh; max-height: 80vh; overflow-y: scroll; } 
.payment_pop_wrap.refund_product_wrap .pop_content { min-height: 60vh; max-height: 80vh; overflow-y: scroll; } 
.payment_pop_wrap.refund_product_wrap .pop_content .product_search_wrap { display: flex; justify-content: space-between; align-items: center; width: 90%; margin: 5% auto; } 
.payment_pop_wrap.refund_product_wrap .pop_content .product_list_wrap { width: 100%; margin: 0 auto; border-bottom: 8px solid #f2f2f2; border-top: 8px solid #f2f2f2; padding: 5%; height: 68vh; overflow-y: scroll; } 
.payment_pop_wrap.refund_product_wrap .pop_content .product_list_wrap > p { font-size: 1rem; font-weight: 700; color:#aaa; width: 100%; margin-bottom: 5%; } 
.payment_pop_wrap.refund_product_wrap .pop_content input:checked + label { border-color: #2bbea4; background: #f1fcfb; } 
.payment_pop_wrap.refund_product_wrap .pop_content .product_item_wrap { width: 100%;; } 
.payment_pop_wrap.refund_product_wrap .pop_content .product_item { width: 100%; border: 1px solid #aaa; border-radius: 1rem; padding: 5%; display: block; } 
.payment_pop_wrap.refund_product_wrap .pop_content .product_item_wrap input { display: none !important; } 
.payment_pop_wrap.refund_product_wrap .pop_content .product_item >span { font-size: 1rem; font-weight: 700; color:#aaa; width: 100%; margin-bottom: 2%; display: block; } 
.payment_pop_wrap.refund_product_wrap .pop_content .product_item .product_name { font-size: 1rem; color: #1ab398; border: 1px solid #1ab398; border-radius: 0.75rem; text-align: left; padding: 1% 5%; display: inline-block; margin-bottom: 2%; } 
.payment_pop_wrap.refund_product_wrap .pop_content .product_item .product_desc { font-size: 1.15rem; color: #333; font-weight: 700; line-height: 1.75rem; margin: 2% auto 3%; } 
.payment_pop_wrap.refund_product_wrap .pop_content .product_item .product_price { font-size: 1rem; color: #aaa !important; display: flex; justify-content: space-between; align-items: center; width: 100%; } 
.payment_pop_wrap.refund_product_wrap .pop_content .product_item .product_price span { font-size: 1.35rem; font-weight: 700; color: #333; } 
.payment_pop_wrap.refund_product_wrap .pop_content input { display: block; width: 75%; border: 1px solid #cccccc; background: #fff; border-radius: 0.75rem; padding: 3% 5%; font-size: 1.15rem; } 
.payment_pop_wrap.refund_product_wrap .pop_content a { display: block; text-align: center; font-size: 1.15rem; color: #fff; background: #21b399; font-weight: 500; border-radius: 0.75rem; padding: 2.7% 0; width: 23%; } 
.payment_pop_wrap.coupon_register_wrap .pop_content { min-height: 90vh; max-height: 90vh; overflow-y: scroll; padding: 5%; } 
.payment_pop_wrap.coupon_register_wrap .pop_content input { display: block; width: 100%; border: 1px solid #cccccc; border-radius: 0.75rem; padding: 3% 5%; font-size: 1.15rem; background: #fff; } 
.payment_pop_wrap.coupon_register_wrap .pop_content input::placeholder { color: #cccccc; font-size: 1.15rem; } 
.payment_pop_wrap.receipt_wrap .pop_content::-webkit-scrollbar { display: none; } 
.payment_pop_wrap.payment_coupon .pop_content { padding:0; height: 100%; max-height: 80vh; overflow-y: scroll; display: flex; flex-direction: column; } 
.payment_pop_wrap.payment_coupon .pop_content .registered_wrap { border-bottom: 8px solid #f2f2f2; display: flex; align-items: center; justify-content: space-between; flex-shrink: 0; padding: 3% 5%; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list { display: block; width: 100%; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list::-webkit-scrollbar { width: 5px; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list::-webkit-scrollbar-track { background: rgba(0,0,0,0.0); border-radius: 5px; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.3); border-radius: 5px; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_tit { display: flex; justify-content: left; align-items: center; gap: 0; font-size: 1.55rem; font-weight: 700; color: #333; margin: 3% auto 0; width: 90%; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_tit span { color: #1ab398; font-weight: 700; margin-left: 3%; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_tit::before { content: ''; display: block; background: #1ab398; width: 5px; height: 1.5rem; margin-right: 2%; border-radius: 5px; } 
.payment_pop_wrap.payment_coupon .pop_content .registered_wrap input { width: 72%; background: #fff; border:1px solid #dddddd; padding: 5% 3%; } 
.payment_pop_wrap.payment_coupon .pop_content .registered_wrap input::placeholder { color: #ddd; font-size: 1.15rem; } 
.payment_pop_wrap.payment_coupon .pop_content .registered_wrap a { width: 24%; display: block; background: #2bbea4; color: #fff; font-size: 1.25rem; padding: 2.7% 0; text-align: center; border-radius: 0.75rem } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list { display: block; overflow: visible; border-radius: 0; margin: 3% auto; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list::-webkit-scrollbar { width: 5px;; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list::-webkit-scrollbar-track { background: rgba(0,0,0,0.0); border-radius: 5px; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list.table_wrap::-webkit-scrollbar-thumb { background: rgba(0,0,0,0.3); border-radius: 5px; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li { width: 90%; margin: 0 auto 0.75rem; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li:nth-last-of-type(1) { margin: 0 auto; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li input { display: none; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label { border: 1px solid #ddd; display: flex; align-items: center; justify-content: space-between; border-radius: 0.75rem; overflow: hidden; width: 100%; position: relative; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li input:checked + label { border-color: #2bbea4; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label .coupon_info { width: 70%; padding:5%; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label .coupon_info b { font-size: 1.75rem; color:#333; font-weight: 700; margin-bottom: 5%; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label .coupon_info span { color: #333; font-size: 1.25rem; display: block; margin-bottom: 5%; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label .coupon_info p { color: #888888; font-size: 1.05rem; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label .coupon_btn { width: 30%; min-height: 10.2rem; display: flex; align-items: center; justify-content: center; background: #f9f9f9; border-left: 1px solid #ccc; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label .coupon_btn span { display: block; width: 3rem; height: 3rem; background: url('http://cdn.hackersbook.com/common/icon/check_on_v2.png') 0 0 no-repeat; background-size: 100%; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li input:checked + label .coupon_btn { background: #f5fcfb } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li input:checked + label .coupon_btn span { background: url('http://cdn.hackersbook.com/common/icon/check_on.png') 0 0 no-repeat; background-size: 100%; } 

.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label.disabled { background: #fff; border-color: #f2f2f2; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label.disabled > .coupon_info b { color: #aaaaaa; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label.disabled > .coupon_info span { color: #aaa; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label.disabled > .coupon_btn { border-color: #f2f2f2; background: #f8f8f8; } 
.payment_pop_wrap.payment_coupon .pop_content .coupon_list li label.disabled > .coupon_btn span { opacity: 0.5; } 
.payment_pop_wrap.payment_coupon .pop_content .notice_wrap { margin:0 auto 40%; padding: 3% 5%; background: #f9f9f9; border-radius: 0.75rem; width: 90%; } 
.payment_pop_wrap.payment_coupon .pop_content .notice_wrap p { color: #aaa; display: flex; justify-content: left; gap: 3%; align-items: center; } 
.payment_pop_wrap.payment_coupon .pop_content .notice_wrap p::before { content: ''; display: block; width: 3px; height: 3px; background: #aaa; border-radius: 50%; } 
.payment_pop_wrap.payment_coupon .pop_content .info_wrap { display: block; margin-bottom: 0; background: #f5fcfb; padding: 5% 0; text-align: center; font-size: 1.25rem; border-top: 8px solid #f2f2f2; } 
.payment_pop_wrap.payment_coupon .pop_content .info_wrap span { color: #ff4b38; display: inline-block; margin-right: 1%; font-weight: 700; font-size: 1.25rem; } 
.payment_pop_wrap .pop_inner .pop_content ul { display: flex; flex-direction: column; justify-content: space-between; align-items: baseline; border-radius: 10px; overflow: hidden; margin: 30px auto; } 
.payment_pop_wrap .pop_inner .pop_content ul li { width: 100%; margin-bottom: 10px; } 
.payment_pop_wrap .pop_inner .pop_content ul li a { display: block; width: 100%; padding: 20px 0; text-align: center; color: #fff; font-weight: 700; font-size: 18px; background: #2bbea4; border-right: 1px solid #fff; } 
.payment_pop_wrap .pop_inner .pop_content ul li:nth-last-of-type(1) a { border-right: none; background: #555; } 
.payment_pop_wrap .pop_inner .pop_content > .coupon_info_wrap { display: block; width: 100%; position: fixed; bottom: 0; left: 0; z-index: 1000; margin-bottom: env(safe-area-inset-bottom); } 
.payment_pop_wrap .pop_inner .pop_content > .coupon_info_wrap a { display: block; width: 100%; padding: 5% 0; text-align: center; color: #fff; font-weight: 700; font-size: 1.25rem; background: #2bbea4; border-radius: 0; margin: 0; border: none; position: relative; } 
.payment_pop_wrap .pop_inner .pop_content > .coupon_info_wrap a.disabled { background: #ccc; } 
.payment_pop_wrap .pop_inner .pop_content > a { display: block; width: 100%; padding: 5% 0; text-align: center; color: #fff; font-weight: 700; font-size: 1.25rem; background: #ccc; border-radius: 0; margin: 0; border: none; position: fixed; bottom: 0; left: 0; z-index: 1000; margin-bottom: env(safe-area-inset-bottom); cursor: not-allowed; opacity: 0.6; transition: background 0.3s ease; } 
.payment_pop_wrap .pop_inner .pop_content > a.active { background: #2bbea4; cursor: pointer; opacity: 1; } 
.payment_pop_wrap .pop_inner .pop_content > a:disabled { background: #ccc; cursor: not-allowed; opacity: 0.6; } 
.payment_pop_wrap .pop_inner .pop_content a.coupon_register { display: block; width: 100%; padding: 5% 0; text-align: center; color: #fff; font-weight: 700; font-size: 1.25rem; background: #2bbea4; border-radius: 0; } 
.payment_pop_wrap.coupon_register_wrap .pop_content a.coupon_register { padding: 4% 0; border-radius: .75rem; font-size: 1.15rem; } 
.payment_pop_wrap .coupon_register_wrap .register_info { padding: 5%; } 
.payment_pop_wrap .coupon_register_wrap .register_info p { font-size: 1rem; margin-bottom: 2%; color:#788b9b; display: flex; justify-content: left; align-items: center; } 
.payment_pop_wrap .coupon_register_wrap .register_info p::before { content: ''; display: block; width:5px; height: 5px; background: #788b9b; border-radius: 50%; margin-right: 10px; } 

.address_pop_wrap { display: none; width: 100vw; height: 100vh; position: fixed; left: 0; top: 0; z-index: 9999; } 
.address_pop_wrap.active { display: block; } 
.address_pop_wrap .pop_inner { width: 100%; height: 100%; position: fixed; left: 0; top: 0; background: #fff; } 
.address_pop_wrap .pop_inner .pop_header { border-bottom: 1px solid #f2f2f2; border-top: 1px solid #f2f2f2; padding: 3% 0; position: relative; } 
.address_pop_wrap .pop_inner .pop_header h4 { font-size: 1.45rem; font-weight: 700; color:#333; text-align: center; } 
.address_pop_wrap .pop_inner .pop_header a { display: block; width: 1.75rem; height: 1.75rem; position: absolute; top:50%; right: 5%; transform: translateY(-50%); } 
.address_pop_wrap .pop_inner .pop_header a::after,
.address_pop_wrap .pop_inner .pop_header a::before { content:''; display:block; width:90%; height:1px; background:#999; position: absolute; top:50%; left:50%; transform: translate(-50%,-50%) rotate(45deg); } 
.address_pop_wrap .pop_inner .pop_header a::before { transform: translate(-50%,-50%) rotate(-45deg); } 
.address_pop_wrap .pop_inner .pop_content { padding: 5%; height: 90vh; overflow-y: scroll; } 
.address_pop_wrap .pop_inner .pop_content::-webkit-scrollbar { display: none; } 
.address_pop_wrap ul.radio_group { display: flex; align-items: center; justify-content: space-between; gap: 5px; }
.address_pop_wrap ul.radio_group li { flex: 1; } 
.address_pop_wrap ul.radio_group li input { display: none; } 
.address_pop_wrap ul.radio_group li label { display: flex; align-items: center; justify-content: center; font-size: 1.05rem; color: #333; width: 100%; border-radius: 0.5rem; padding: 0; height: 2.75rem; border: 1px solid #ccc; opacity: 0.4; } 
.address_pop_wrap ul.radio_group li input:checked + label { border-color: #d5e9e6; color: #2bbea4; background: #f1fcfb; opacity: 1; } 

.address_pop_wrap ul.address_input_wrap { margin: 5% auto; } 
.address_pop_wrap ul.address_input_wrap li { margin-bottom: 5%; } 
.address_pop_wrap ul.address_input_wrap > li:nth-last-of-type(1) { margin-bottom: 0; } 
.address_pop_wrap ul.address_input_wrap li label { color: #000; display: block; width: 100%; font-size: 1.15rem; margin-bottom: 2.3%; font-weight: 700; } 
.address_pop_wrap ul.address_input_wrap li .notice_txt { color: #ef523f; font-size: 0.85rem; margin: 1% auto 2%; display: none; } 
.address_pop_wrap ul.address_input_wrap li .notice_txt.required { display: block; } 
.address_pop_wrap ul.address_input_wrap li input[type="text"] { display: block; font-size: 1.05rem; width: 100%; border-radius: 0.55rem; padding: 3% 5%; border: 1px solid #ccc; background: none; width: 100%; height: auto; color: #333; }
.address_pop_wrap ul.address_input_wrap li input[type="text"].required { border-color: #ef523f; } 
.address_pop_wrap ul.address_input_wrap li textarea { display: block; font-size: 1.05rem; width: 100%; border-radius: 0.55rem; padding: 3%; border: 1px solid #ccc; background: none; width: 100%; height: auto; color: #333; } 
.address_pop_wrap ul.address_input_wrap li input[type="text"]::placeholder { color: #adadad; } 
.address_pop_wrap ul.address_input_wrap li.address > input[type="text"] { margin-bottom: 3%; } 
.address_pop_wrap ul.address_input_wrap li .address_input { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 3%; } 
.address_pop_wrap ul.address_input_wrap li .address_input a { width: 28%; font-size: 1.25rem; } 
.address_pop_wrap ul.address_input_wrap li .address_input input { flex: 1; min-width: 0; } 
.address_pop_wrap ul.address_input_wrap li .select_wrap { margin-left: auto; width: 100%; display: flex; align-items: baseline; justify-content: left; gap: 3%; border: 1px solid #ccc; border-radius: .55rem; margin-bottom: 3%; padding: 3%; position: relative; } 
.address_pop_wrap ul.address_input_wrap li .select_wrap span { display: block; width: 1.2rem; height: 1.2rem; background: url('http://cdn.hackersbook.com/common/icon/arrow_o.png') 0 0 no-repeat; background-size: 100%; opacity: 0.5; position: absolute; top:50%; transform: translateY(-50%); right: 5% } 
.address_pop_wrap ul.address_input_wrap li .select_wrap select { border: none; background: none; padding: 0; text-align:left; color: #adadad; font-size: 1.05rem; width: 100%; } 
.address_pop_wrap ul.delivery_summary { background: #f2fcfb; border-radius: .55rem; padding: 5%; margin-bottom: 5%; }
.address_pop_wrap ul.delivery_summary li { display: flex; justify-content: left; align-items: center; margin-bottom: 2%; }
.address_pop_wrap ul.delivery_summary li:last-child { margin-bottom: 0; }
.address_pop_wrap ul.delivery_summary span { color: #333; font-size: 1.15rem; }
.address_pop_wrap ul.delivery_summary .tit { font-weight: 700; margin-right: 3%; display: block; width: 25%; }
.address_pop_wrap .table_wrap th,
.address_pop_wrap .table_wrap td { text-align: center; padding: 3.2% 0; color: #333; font-size: 1.15rem; } 
.address_pop_wrap .table_wrap th { background: #fafafa; font-weight: 700; } 
.address_pop_wrap .table_wrap td { border-bottom: 1px solid #fafafa; } 
.address_pop_wrap .table_wrap td.none_data { text-align: center; padding: 5% 0; color: #aaa; font-size: 1.15rem; }
.address_pop_wrap .table_wrap td.none_data p { display: flex; justify-content: center; align-items: center; flex-direction: column; gap: 3%; font-size: 1.25rem; }
.address_pop_wrap .table_wrap td.none_data p .none_icon { display: block; width: 4rem; height: 4rem; background: url('http://cdn.hackersbook.com/common/icon/none_icon.png') 0 0 no-repeat; background-size: 100%; margin-bottom: 5%; }
.address_pop_wrap .table_wrap td.none_data p .none_txt { display: block; font-size: 1.15rem; color: #aaa; }

.address_pop_wrap .pop_inner .pop_content a { background: #2bbea4; color: #fff; font-weight: 700; text-align: center; padding: 3% 0; border-radius: .55rem; }
.address_pop_wrap .pop_inner .pop_content a.address_save_btn { display: block; width: 100%; font-size: 1.25rem; }
.address_pop_wrap ul.address_input_wrap li .address_input a.addr_search_btn { background: #2bbea4; color: #fff; border: none; font-size: 1.05rem; padding: 0; width: 6.69rem; height: 2.75rem; text-align: center; border-radius: 0.5rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; }

.delivery_btn_wrap { display: flex; gap:1%; align-items: center; justify-content: left; margin: 5% auto; width: 90%; } 
.delivery_btn_wrap li { width: 32%; } 
.delivery_btn_wrap li a { display: block; width: 100%; padding: 2% 5%; font-size: 1rem; text-align: center; border-radius: 5px; border: 1px solid #00b48f; color: #00b48f; } 

/* 달력 */
.calendar_wrapper { width: 100%; max-width: 400px; margin: 1rem auto 0; padding: 1rem 0; height: auto; } 
 .quick_buttons { display: flex; justify-content: space-between; margin-bottom: 5%; } 
 .quick_buttons button,
 .submit_btn { padding: 3.9% 0; flex: 1; margin: 0 0.25rem; border-radius: 0.75rem; border: 1px solid #aaa; background: #fff; cursor: pointer; color: #aaa; font-size: 1.25rem; text-align: center; } 
 .quick_buttons button.active { background: #f5fcfb; color: #2dccb5; border-color: #2dccb5; } 
 .submit_btn.active { background: #2dccb5; color: #fff; border-color: #2dccb5; } 
 .selected_dates { text-align: center; margin-bottom: 1.75rem; font-weight: bold; display: flex; justify-content:space-between; align-items: center; gap: 0.5rem; } 
 .selected_dates > span { font-size: 1.25rem; color: #333; } 
 .selected_dates .date_wrap { display: flex; align-items: center; justify-content: space-between; width: 45%; border: 1px solid #ccc; border-radius: 0.35rem; padding: 3%; } 
.selected_dates .date_wrap span { display: block; width: 1.75rem; height: 1.75rem; background: url('http://cdn.hackersbook.com/common/icon/c_icon.png')0 0 no-repeat; background-size: 100%; } 
.selected_dates .date_wrap input { border: none; padding: 0 3%; height: 100%; width: 100%; background: #fff; border-radius: 0; text-indent: 2%; color: #333; font-size: 1.25rem; } 
 .calendar_area { width: 100%; background: #f9f9f9; border-radius: 1rem; padding: 5%; margin-bottom: 30%; } 
 .calendar_header { width: 100%; display: flex; justify-content: center; gap: 0.5rem; margin-bottom: 1rem; } 
 .calendar_header select { padding: 3% 6%; font-size: 1.35rem; border-radius: 0.75rem; appearance: none; } 

 .calendar { width: 100%; border-collapse: collapse; text-align: center; margin-bottom: 1rem; } 
 .calendar tr { margin-bottom: 0.75rem; } 
 .calendar th { padding: 1rem; font-size: 1.35rem; } 
 .calendar th.red { color: #ff4b38; } 
 .calendar td { padding: 1.05rem 0.75rem; cursor: pointer; border-radius: 50%; font-size: 1.25rem; } 
.calendar td.selected { background: #2bbea4 !important; color: #fff; } 
 .calendar td.in_range { background: #a1e7dc; } 

/*header*/
@media all and (max-width: 350px){
 #header .gnb li { padding:3px 4px; } 
 }

#container .step-03 li.book_none { width: 100%; } 
#container .step-03 li.noSearch { width: 100%; } 

@media all and (max-width:580px) { html { font-size: 14px; } 
.footer-bottom ul li { padding: 0 3%; } 
.book_all_pop a.close_btn { width: 40%; } 
 }
@media all and (max-width:450px) { html { font-size: 13px; } 
#header .gnb li { padding: 0 4.5%; } 
.footer-bottom ul li a { font-size: 1.1rem; } 
.footer-top h2 { font-size: 1.7rem; } 
.book_all_pop dl dt::before { height: 3.5vw; margin-right: 1.5vw; } 
 }
@media all and (max-width:380px) { html { font-size: 12px; } 
#header .gnb li { padding: 0 5.5%; } 
.footer-bottom ul li a { font-size: 1rem; } 
.book_all_pop dl { margin-bottom: 8%; } 
.book_all_pop dl dt::before { margin-right: 2.3vw; height: 3.8vw; width: 3px; } 
.book_all_pop dl dd ul li a { padding: 3vw; font-size: 1.2rem; } 
.book_all_pop a.close_btn { font-size: 1.2rem; width: 50%; padding: 2vw; } 
 }

/* 주문 상세 팝업 */
.order_detail_popup { display: none; position: fixed; top: 0; left: 0; right: 0; bottom: 0; z-index: 9999; } 
.order_detail_popup .popup_bg { position: absolute; top: 0; left: 0; right: 0; bottom: 0; background: rgba(0, 0, 0, 0.5); } 
.order_detail_popup .popup_inner { position: relative; width: 100%; height: 100%; max-width: 750px; margin: 0 auto; background: #fff; overflow-y: auto; z-index: 10000; } 

/* 팝업 헤더 */
.order_detail_popup .popup_header { display: flex; align-items: center; justify-content: center; height: 50px; border-bottom: 1px solid #f2f2f2; position: relative; background: #fff; } 
.order_detail_popup .popup_title { font-size: 1.2rem; font-weight: 600; color: #000; text-align: center; } 
.order_detail_popup .btn_close { position: absolute; right: 15px; top: 50%; transform: translateY(-50%); width: 24px; height: 24px; background: transparent; border: none; cursor: pointer; } 
.order_detail_popup .btn_close::before, .order_detail_popup .btn_close::after { content: ''; position: absolute; top: 50%; left: 50%; width: 16px; height: 2px; background: #000; } 
.order_detail_popup .btn_close::before { transform: translate(-50%, -50%) rotate(45deg); } 
.order_detail_popup .btn_close::after { transform: translate(-50%, -50%) rotate(-45deg); } 

/* 주문 정보 바 */
.order_detail_popup .order_info_bar { display: flex; align-items: center; justify-content: space-between; padding: 15px; background: #555; } 
.order_detail_popup .order_date { font-size: 0.95rem; color: #fff; } 
.order_detail_popup .btn_delete { display: flex; align-items: center; gap: 5px; background: transparent; border: none; cursor: pointer; } 
.order_detail_popup .btn_delete .delete_icon { width: 18px; height: 18px; background: url('http://cdn.hackersbook.com/common/icon/del_icon_w.png') 0 0 no-repeat; background-size: 100%; } 
.order_detail_popup .btn_delete .delete_text { font-size: 0.9rem; color: #fff; } 

/* 무통장입금 정보 섹션 */
.order_detail_popup .bank_account_section { padding: 15px; } 
.order_detail_popup .account_card { background: #f1fcfb; border-radius: 10px; padding: 20px; } 
.order_detail_popup .account_info_list { display: flex; flex-direction: column; gap: 15px; } 
.order_detail_popup .account_item { display: flex; align-items: center; } 
.order_detail_popup .account_item .label { font-size: 0.95rem; font-weight: 700; color: #333; width: 80px; flex-shrink: 0; } 
.order_detail_popup .account_item .value { font-size: 0.95rem; color: #333; } 
.order_detail_popup .account_item .value.account_number { font-weight: 700; } 
.order_detail_popup .account_item .btn_copy { width: 20px; height: 20px; margin-left: 8px; background: url('http://cdn.hackersbook.com/common/icon/copy_icon.png') 0 0 no-repeat; background-size: 100%; border: none; cursor: pointer; } 
.order_detail_popup .account_notice { display: flex; align-items: center; gap: 5px; margin-top: 15px; padding-top: 15px; border-top: 1px solid #ddd; } 
.order_detail_popup .notice_icon { width: 18px; height: 18px; background: #2bbea4; border-radius: 50%; display: flex; align-items: center; justify-content: center; position: relative; flex-shrink: 0; } 
.order_detail_popup .notice_icon::before { content: 'i'; font-size: 12px; font-weight: 700; color: #fff; } 
.order_detail_popup .notice_text { font-size: 0.9rem; color: #1ab398; } 

/* 주문 섹션 공통 */
.order_detail_popup .order_section, .order_detail_popup .payment_section { background: #fff; } 
.order_detail_popup .section_header { display: flex; align-items: center; justify-content: space-between; padding: 15px; background: #fafafa; border-top: 8px solid #f0f0f0; border-bottom: 1px solid #eee; } 
.order_detail_popup .section_title { font-size: 1.1rem; font-weight: 700; color: #000; } 
.order_detail_popup .item_count { font-size: 1.1rem; font-weight: 700; color: #1ab398; } 
.order_detail_popup .section_content { padding: 20px 15px; } 

/* 상품 아이템 */
.order_detail_popup .product_item { padding: 15px 0; border-bottom: 1px solid #eee; } 
.order_detail_popup .product_item:last-child { border-bottom: none; } 
.order_detail_popup .product_badge { display: inline-block; padding: 5px 12px; border: 1px solid rgba(43, 190, 164, 0.7); border-radius: 20px; font-size: 0.85rem; color: #1ab398; margin-bottom: 10px; } 
.order_detail_popup .product_name { font-size: 1.05rem; font-weight: 700; color: #000; line-height: 1.5; margin-bottom: 15px; } 
.order_detail_popup .product_price_row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 10px; } 
.order_detail_popup .product_price_row .price_label { font-size: 0.95rem; color: #888; } 
.order_detail_popup .product_price_row .price_value { font-size: 0.95rem; font-weight: 700; color: #888; } 

/* 쿠폰 박스 */
.order_detail_popup .coupon_box { display: flex; align-items: center; gap: 10px; padding: 12px 15px; background: #f1fcfb; border: 1px solid #d5e9e6; border-radius: 10px; margin-bottom: 15px; } 
.order_detail_popup .coupon_icon { width: 24px; height: 24px; background: url('http://cdn.hackersbook.com/common/icon/coupon_m.png') 0 0 no-repeat; background-size: 100%; flex-shrink: 0; } 
.order_detail_popup .coupon_name { flex: 1; font-size: 0.95rem; font-weight: 700; color: #1ab398; } 
.order_detail_popup .coupon_discount { display: flex; align-items: baseline; } 
.order_detail_popup .coupon_discount .discount_amount { font-size: 1.05rem; font-weight: 700; color: #1ab398; } 
.order_detail_popup .coupon_discount .currency { font-size: 0.95rem; font-weight: 700; color: #1ab398; margin-left: 2px; } 

/* 상품 상태 행 */
.order_detail_popup .product_status_row { display: flex; justify-content: space-between; align-items: center; padding-top: 15px; } 
.order_detail_popup .status_left { display: flex; align-items: center; gap: 15px; } 
.order_detail_popup .status_label { font-size: 0.95rem; color: #888; } 
.order_detail_popup .product_status_row.complete .status_label { color: #1ab398; } 
.order_detail_popup .product_status_row.refund .status_label { color: #ff4b38; } 
.order_detail_popup .product_status_row.cancel .status_label { color: #ff4b38; } 
.order_detail_popup .product_status_row.waiting .status_label { color: #888; } 
.order_detail_popup .btn_refund_detail { display: flex; align-items: center; gap: 5px; background: transparent; border: none; cursor: pointer; padding: 0; } 
.order_detail_popup .btn_refund_detail .detail_text { font-size: 0.95rem; color: #888; } 
.order_detail_popup .btn_refund_detail .arrow_icon { width: 15px; height: 15px; background: url('http://cdn.hackersbook.com/common/icon/arrow_g.png') 0 0 no-repeat; background-size: 100%; } 
.order_detail_popup .status_amount { display: flex; align-items: baseline; } 
.order_detail_popup .status_amount .amount_value { font-size: 1.2rem; font-weight: 700; color: #333; } 
.order_detail_popup .status_amount .amount_currency { font-size: 1rem; font-weight: 700; color: #333; margin-left: 2px; } 

/* 결제내역 섹션 */
.order_detail_popup .payment_details { display: flex; flex-direction: column; gap: 20px; margin-bottom: 20px; } 
.order_detail_popup .payment_row { display: flex; justify-content: space-between; align-items: flex-start; } 
.order_detail_popup .payment_label { font-size: 0.95rem; color: #333; } 
.order_detail_popup .payment_value { font-size: 0.95rem; color: #333; text-align: right; max-width: 60%; } 

/* 가격 요약 */
.order_detail_popup .price_summary .divider_gray { height: 1px; background: #eee; margin-bottom: 20px; } 
.order_detail_popup .price_summary .divider_dark { height: 2px; background: #aaa; margin: 20px 0; } 
.order_detail_popup .price_row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; } 
.order_detail_popup .price_row .price_label { font-size: 0.95rem; color: #333; } 
.order_detail_popup .price_row .price_value { font-size: 0.95rem; font-weight: 700; color: #333; } 
.order_detail_popup .price_row .price_value.discount { color: #ff4b38; } 
.order_detail_popup .total_row { display: flex; justify-content: space-between; align-items: center; } 
.order_detail_popup .total_label { font-size: 1rem; font-weight: 700; color: #333; } 
.order_detail_popup .total_amount { display: flex; align-items: baseline; } 
.order_detail_popup .total_value { font-size: 1.4rem; font-weight: 700; color: #ff4b38; } 
.order_detail_popup .total_unit { font-size: 1rem; font-weight: 700; color: #ff4b38; margin-left: 2px; } 

/* 가격 요약 */
.order_detail_popup .price_summary .divider_gray { height: 1px; background: #eee; margin-bottom: 20px; } 
.order_detail_popup .price_summary .divider_dark { height: 2px; background: #aaa; margin: 20px 0; } 
.order_detail_popup .price_row { display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px; } 
.order_detail_popup .price_row .price_label { font-size: 0.95rem; color: #333; } 
.order_detail_popup .price_row .price_value { font-size: 0.95rem; font-weight: 700; color: #333; } 
.order_detail_popup .price_row .price_value.discount { color: #ff4b38; } 
.order_detail_popup .total_row { display: flex; justify-content: space-between; align-items: center; } 
.order_detail_popup .total_label { font-size: 1rem; font-weight: 700; color: #333; } 
.order_detail_popup .total_amount { display: flex; align-items: baseline; } 
.order_detail_popup .total_value { font-size: 1.4rem; font-weight: 700; color: #ff4b38; } 
.order_detail_popup .total_unit { font-size: 1rem; font-weight: 700; color: #ff4b38; margin-left: 2px; } 

/* 하단 버튼 영역 */
.order_detail_popup .bottom_button_area { border-top: 8px solid #f0f0f0; display: flex; gap: 10px; } 
.order_detail_popup .btn_receipt, .order_detail_popup .btn_cancel_order { flex: 1; height: 50px; border: none; font-size: 1.1rem; font-weight: 700; cursor: pointer; } 
.order_detail_popup .btn_receipt { width: 100%; background: #2bbea4; color: #fff; } 
.order_detail_popup .btn_cancel_order { width: 100%; background: #000; color: #fff; } 

/* ====================================== */
/* 배송정보 변경 팝업 스타일 */
/* ====================================== */
.payment_pop_wrap.shipping_change_wrap .pop_content { padding: 0; min-height: 50vh; max-height: calc(86vh - 80px); overflow-y: auto; padding-bottom: 5%; } 
.payment_pop_wrap.shipping_change_wrap .shipping_tab { display: flex; width: 100%; gap: 5px; padding: 4% 5% 0; } 
.payment_pop_wrap.shipping_change_wrap .shipping_tab .tab_btn { flex: 1; height: 3.75rem; font-size: 1.05rem; color: #333; background: #fff; border: 1px solid #ccc; border-radius: 0.5rem; cursor: pointer; opacity: 0.4; } 
.payment_pop_wrap.shipping_change_wrap .shipping_tab .tab_btn.active { color: #2bbea4; background: #f1fcfb; border-color: #d5e9e6; opacity: 1; font-weight: 400; } 
.payment_pop_wrap.shipping_change_wrap .shipping_form { padding: 5%; } 
.payment_pop_wrap.shipping_change_wrap .form_item { margin-bottom: 5%; } 
.payment_pop_wrap.shipping_change_wrap .form_label { display: block; font-size: 1.1rem; font-weight: 700; color: #333; margin-bottom: 2%; } 
.payment_pop_wrap.shipping_change_wrap .form_input { display: block; width: 100%; padding: 3.5%; border: 1px solid #ddd; border-radius: 0.5rem; font-size: 1.05rem; box-sizing: border-box; background: #fff; } 
.payment_pop_wrap.shipping_change_wrap .form_input::placeholder { color: #aaa; } 
.payment_pop_wrap.shipping_change_wrap .form_input:focus { border-color: #2bbea4; outline: none; } 
.payment_pop_wrap.shipping_change_wrap .form_input.error { border-color: #ff4b38; } 
.payment_pop_wrap.shipping_change_wrap .form_error { display: block; font-size: 0.9rem; color: #ff4b38; margin-top: 1.5%; } 
.payment_pop_wrap.shipping_change_wrap .address_field { display: flex; flex-direction: column; gap: 2.5%; } 
.payment_pop_wrap.shipping_change_wrap .address_row { display: flex; gap: 8px; margin-bottom: 2.5%; } 
.payment_pop_wrap.shipping_change_wrap .zipcode_input { flex: 1; min-width: 0; } 
.payment_pop_wrap.shipping_change_wrap .address_search_btn { width: 6.69rem; padding: 0; background: #2bbea4; color: #fff; border: none; border-radius: 0.5rem; font-size: 1.05rem; font-weight: 600; cursor: pointer; flex-shrink: 0; } 
.payment_pop_wrap.shipping_change_wrap .select_wrap { position: relative; } 
.payment_pop_wrap.shipping_change_wrap .form_select { display: block; width: 100%; padding: 3.5%; border: 1px solid #ddd; border-radius: 0.5rem; font-size: 1.05rem; background: #fff url('data:image/svg+xml; utf8,<svg xmlns="http://www.w3.org/2000/svg" width="12" height="8"><path fill="%23666" d="M6 8L0 0h12z"/></svg>') no-repeat right 15px center; -webkit-appearance: none; appearance: none; } 
.payment_pop_wrap.shipping_change_wrap .form_textarea { display: block; width: 100%; padding: 3.5%; border: 1px solid #ddd; border-radius: 0.5rem; font-size: 1.05rem; resize: none; height: 100px; margin-top: 3%; box-sizing: border-box; } 
.payment_pop_wrap.shipping_change_wrap .form_textarea::placeholder { color: #aaa; } 
.payment_pop_wrap.shipping_change_wrap .submit_btn { display: block; width: 100%; padding: 4% 0; background: #2bbea4; color: #fff; border: none; border-radius: 0.5rem; font-size: 1.15rem; font-weight: 700; cursor: pointer; margin-top: 5%; margin-bottom: 3%; } 
.payment_pop_wrap.shipping_change_wrap .submit_btn:disabled { background: #ccc; } 

/* ====================================== */
/* 배송조회 팝업 스타일 */
/* ====================================== */
.payment_pop_wrap.tracking_wrap .pop_content { padding: 0; min-height: 50vh; max-height: 80vh; overflow-y: auto; }
.payment_pop_wrap.tracking_wrap .tracking_info { padding: 5%; background: #f1fcfb; border-radius: 0.5rem; margin: 5%; }
.payment_pop_wrap.tracking_wrap .tracking_info .info_row { display: flex; align-items: center; margin-bottom: 3%; }
.payment_pop_wrap.tracking_wrap .tracking_info .info_row:last-child { margin-bottom: 0; }
.payment_pop_wrap.tracking_wrap .tracking_info .info_label { font-size: 1rem; font-weight: 700; color: #333; width: 6rem; flex-shrink: 0; }
.payment_pop_wrap.tracking_wrap .tracking_info .info_value { font-size: 1rem; font-weight: 400; color: #333; }
.payment_pop_wrap.tracking_wrap .tracking_table { margin: 0 5% 5%; }
.payment_pop_wrap.tracking_wrap .table_header { display: flex; align-items: center; height: 2.75rem; background: #fafafa; }
.payment_pop_wrap.tracking_wrap .header_cell { font-size: 0.875rem; font-weight: 700; color: #333; text-align: center; }
.payment_pop_wrap.tracking_wrap .header_cell.time { width: 37%; }
.payment_pop_wrap.tracking_wrap .header_cell.location { width: 37%; }
.payment_pop_wrap.tracking_wrap .header_cell.status { width: 26%; }
.payment_pop_wrap.tracking_wrap .table_body { max-height: 50vh; overflow-y: auto; }
.payment_pop_wrap.tracking_wrap .table_row { display: flex; align-items: center; min-height: 3.5rem; border-bottom: 1px solid #eeeeee; }
.payment_pop_wrap.tracking_wrap .table_row:last-child { border-bottom: none; }
.payment_pop_wrap.tracking_wrap .table_cell { font-size: 0.875rem; color: #333; text-align: center; }
.payment_pop_wrap.tracking_wrap .table_cell.time { width: 37%; line-height: 1.4; }
.payment_pop_wrap.tracking_wrap .table_cell.location { width: 37%; }
.payment_pop_wrap.tracking_wrap .table_cell.status { width: 26%; }
.payment_pop_wrap.tracking_wrap .loading { text-align: center; padding: 10% 0; color: #666; font-size: 1rem; }
.payment_pop_wrap.tracking_wrap #noTrackingMessage { display: flex; flex-direction: column; align-items: center; padding: 15% 0 5%; }
.payment_pop_wrap.tracking_wrap #noTrackingMessage .empty_icon { width: 5rem; height: 5rem; border-radius: 50%; background: #eeeeee; display: flex; align-items: center; justify-content: center; margin-bottom: 1rem; }
.payment_pop_wrap.tracking_wrap #noTrackingMessage .empty_icon span { font-size: 2.5rem; font-weight: 700; color: #fff; line-height: 1; }
.payment_pop_wrap.tracking_wrap #noTrackingMessage .empty_text { font-size: 1rem; color: #aaa; text-align: center; }

/* ====================================== */
/* 배송 정보 섹션 스타일 */
/* ====================================== */
.checkout_wrap.delivery_info .sub_tit { display: flex; justify-content: space-between; align-items: center; } 
.checkout_wrap.delivery_info .sub_tit .change_btn { font-size: 1rem; color: #2bbea4; font-weight: 600; padding: 2% 4%; border: 1px solid #2bbea4; border-radius: 0.5rem; } 
.checkout_wrap.delivery_info .delivery_status { display: flex; align-items: center; gap: 3%; } 
.checkout_wrap.delivery_info .tracking_btn { font-size: 0.95rem; color: #2bbea4; font-weight: 600; text-decoration: underline; }