/* layout */
header {position: relative; background: #fff; padding: 11px 0; font-size: 12px; height: 99px; box-sizing: border-box;}
nav {position: absolute; top: 37px; left: 0; z-index: 1000; width: 100%; background: #fff; border-bottom: 1px solid #e9e9e9;}

#wrapper {width: 100%; position: relative;  min-width: 1220px;}
#container {width: 100%; height: 100%; box-sizing: border-box;}

.content {position: relative; width: 1100px; margin: 0 auto; min-height: 700px; padding-bottom: 120px;}
.inner {width: 1100px; margin: 0 auto; position: relative;}
.about{margin-top: 60px;}
.section{background: #f7f7f7; padding: 20px 35px; font-size: 13px; line-height: 1.7;}
.section strong{font-size:14px;}

/* top */
.top{max-width: 1100px; margin: 0 auto; text-align: right; overflow: hidden;}
.top li {display: inline-flex; border-right: 1px solid rgba(0,0,0,0.2); padding: 0px 9px 2px; height: 8px;}
.top li:last-child {border-right: 0; padding-right: 0;}
.top a {color: #777; margin-top: -5px;}

/* GNB */
#gnb {z-index: 100; padding-bottom: 61px;}
#gnb:hover .line-top {display: block;}
#gnb .logo {float: left; width: 15%;  margin-top: -7px;}

.line-top {display: none; width: 100%; border-bottom: 1px solid #e9e9e9; position: absolute; top: 61px;}
.navi {float: left; width: 68%; display: inline-table;}
.navi:hover .sub-menu {display: block; opacity: 1; z-index: 55;}
.main-menu {display: grid; grid-template-columns: 20% 20% 20% 20% 20%; -webkit-display: grid; -webkit-grid-template-columns: 20% 20% 20% 20% 20%; padding: 16px 0 0 8px;}
.main-menu > li {position: relative; float: left; line-height: 1.2; text-align: center; /* 익스 추가 */width: 20%; min-width: -webkit-fill-available;}
.main-menu > li:first-child {margin-left: 0;}
.main-menu > li > a {font-size: 19px; padding-bottom: 30px; color: #222;}
.main-menu > li:hover {background: #f7f7f7; cursor: pointer;}
.main-menu > li:hover div {background: #fff;}
.main-menu > li:hover ul {margin-top: 13px;}
.main-menu > li:hover > div,
.main-menu > li.active > div,
.main-menu > li.active > div:focus {border-bottom: 2px solid #00b5c0; color: #00b5c0; font-weight: 500;}

.main-menu > li > div p{display: none; z-index: 2;}
.main-menu > li:hover > div p,
.main-menu > li.active > div p,
.main-menu > li.active > div:focus p{position: absolute; top: -5px; left: 125px; width: 10px; height: 10px; background: #00b5c0; border-radius: 50%; opacity: 0.8; display: block; -webkit-animation:scale-up-center .4s cubic-bezier(.39,.575,.565,1.000) both;animation:scale-up-center .4s cubic-bezier(.39,.575,.565,1.000) both}

.main-menu > li:first-child:hover > div p,
.main-menu > li:first-child.active > div p{left: 135px;}

.main-menu > li div {font-size: 19px; padding-bottom: 20px;}
.main-menu:after {clear: both; display: block; content: ''}
.main-menu > li:hover ul.sub-menu {opacity: 1; visibility: visible;}
.main-menu > li.active:hover ul.sub-menu{margin-top: 15px;} /* active 흔들림 수정 추가 */
.sub-menu {margin-top: 15px; display: none; padding: 10px 0 30px; height: 240px;}
.main-menu > li.active > .sub-menu{padding: 8px 0 30px !important}
.sub-menu li {transition: all 0.3s; text-align: center; padding: 6px 0;}
.sub-menu li a {display: block; font-size: 14px;}
.sub-menu li a:hover {color: #00b5c0; font-weight: 500;}

 @-webkit-keyframes scale-up-center{0%{-webkit-transform:scale(.1);transform:scale(.1)}100%{-webkit-transform:scale(1);transform:scale(1)}}@keyframes scale-up-center{0%{-webkit-transform:scale(.1);transform:scale(.1)}100%{-webkit-transform:scale(1);transform:scale(1)}}

/* r_floating */
.r_floating{position: fixed; right: 60px; bottom: 50px; z-index: 10;}
.r_floating .pop{display: none; position: absolute; top: -10px; left: -35px; background: #00c73c; color: #fff; width: 140px; padding: 10px 0 12px; text-align: center; 
font-size: 12px; font-weight: 500; border-radius: 50px; animation:slide-top .3s cubic-bezier(.25,.46,.45,.94) both}
.r_floating .pop:after { top: 100%; left: 50%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none; border-top-color: #00c73c; border-width: 5px; margin-left: -5px;}
.r_floating .f_wp:hover .pop{display: block;}
@keyframes slide-top{0%{transform:translateY(0); opacity: 0;} 100%{ transform:translateY(-50px)}}

/* footer */
footer {background: #333; padding: 35px 0; font-size: 13px;}
footer ul {text-align: center;}
footer ul li {padding: 3px 0; color: #777;}
footer ul li.menu {font-size: 14px; padding-bottom: 12px;}
footer select {padding: 5px 10px; border: 1px solid #777; background: none; color: #777; cursor: pointer; font-size: 12px;}
footer select option {background: #333; color: #777;}
footer ul li a div {color: #ddd; padding-right: 15px; line-height: 0.8; border-left: 1px solid #555;}
footer ul li a div strong {color: #fff;}
footer ul li a:first-child div {border-left: 0;}
footer ul li div {padding-left: 15px; color: #777; display: inline-flex;}
footer ul li:last-child {margin-top: 15px; display: inline-flex; align-items: center;}
footer ul li:last-child img {padding-right: 5px;}
footer ul li:last-child div {display: block;}

/* gnb search */
.search {float: right; padding-top: 15px;}
.search input[type='text'] {border-bottom: 2px solid #000; padding: 0px 5px 5px; color: #a9a9a9; font-weight: 300; width:150px;}
#gnb button {background: none;}
.search button img {margin-bottom: -5px;}

/* gnb search modal */
.modal {box-shadow: 0px 2px 7px rgba(0,0,0,0.18); font-size: 13px; width: 12%; position: absolute; top: 195px; left: 50%; margin-left: 300px; opacity: 0; visibility: hidden; border-radius: 5px; border: 1px solid #e9e9e9; background: #fff; padding: 20px; z-index:1000;}
.modal ul {padding-bottom: 10px;}
.modal .tit {font-weight: 600; color: #000; padding-bottom: 10px;}
.modal li {color: #ccc; line-height: 20px;}
.show-modal {opacity: 1; visibility: visible; transform: scale(1.0); transition: visibility 0s linear 0s, opacity 0.25s 0s, transform 0.25s; z-index:3;}
.modal div {border-top: 1px solid #e9e9e9; margin-top: 10px; padding: 10px 0 0;}
.close-button {float: right; width: 1.5rem; line-height: 0.8rem; font-size: 1.5rem; text-align: center; cursor: pointer; border-radius: 0.25rem; background: #fff;}
.close-button:hover {color: #ccc;}

/* swiper slide */
.swiper-container {width: 100%; overflow: hidden; position: relative; padding-top: 109px;}
.swiper-slide {text-align: center; font-size: 18px; /* Center slide text vertically */ display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; flex-shrink: 0; width: 100%; height: 100%; position: relative; transition-property: transform;}
.swiper-container-vertical > .swiper-pagination-bullets {top: unset; bottom: 10px; left: 0; width: 100%;}
.swiper-container-vertical > .swiper-pagination-bullets .swiper-pagination-bullet {display: inline-block; margin: 6px 2px;}
:root {--swiper-theme-color: #007aff;}
 
.swiper {position: relative; overflow: hidden; list-style: none; padding: 0; z-index: 1;}
.swiper-wrapper {position: relative; width: 100%; height: 100%; z-index: 1; display: flex; transition-property: transform; box-sizing: content-box;} 

.swiper-arrow-next,
.swiper-arrow-prev {position: absolute; top: 50%; margin-top: 0; z-index: 1; cursor: pointer; display: flex; align-items: center; justify-content: center;}
.swiper-arrow-next,
.swiper-rtl .swiper-arrow-prev {right: 10px; left: auto;}
.swiper-button-lock {display: none;}
.swiper-pagination {position: absolute; text-align: center; transition: .3s opacity; transform: translate3d(0,0,0); z-index: 1;}
.swiper-horizontal > .swiper-pagination-bullets,
.swiper-pagination-bullets.swiper-pagination-horizontal,
.swiper-pagination-custom,
.swiper-pagination-fraction {bottom: 30px; left: 0; width: 100%;}
.swiper-pagination-bullet {width: var(--swiper-pagination-bullet-width,var(--swiper-pagination-bullet-size,12px)); height: var(--swiper-pagination-bullet-height,var(--swiper-pagination-bullet-size,12px)); display: inline-block; border-radius: 50%; background: var(--swiper-pagination-bullet-inactive-color,#000); opacity: var(--swiper-pagination-bullet-inactive-opacity,.2)}button.swiper-pagination-bullet {border: none; margin: 0; padding: 0; box-shadow: none; -webkit-appearance: none; appearance: none;}
.swiper-pagination-clickable .swiper-pagination-bullet {cursor: pointer;}
.swiper-pagination-bullet:only-child {display: none !important;}
.swiper-pagination-bullet-active {opacity: var(--swiper-pagination-bullet-opacity,1); background: var(--swiper-pagination-color,var(--swiper-theme-color));}
.swiper-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet,
.swiper-pagination-horizontal.swiper-pagination-bullets .swiper-pagination-bullet {margin: 0 var(--swiper-pagination-bullet-horizontal-gap,4px);}

/* arrow style */
.arrow-more {position: relative; width: 30px; height: 30px;}
.arrow-more::after {position: absolute; left: 2px; top: 4px; content: ''; width: 6px; height: 6px;  border-top: 2px solid #aaa; border-right: 2px solid #aaa; transform: rotate(45deg);}
.arrow-more.red::after {position: absolute; left: 2px; top: 6px; content: ''; width: 6px; height: 6px; border-top: 2px solid #f20945; border-right: 2px solid #f20945; transform: rotate(45deg);}

/* form */
.writeForm{border-top: 1px solid #000; width: 100%; margin-top: 20px;}
.writeForm td {padding: 15px 20px 17px; border-bottom: 1px solid #eee; margin: 0; position: relative;}
.writeForm th {text-align: left; padding-left: 15px; font-weight: 400; border-bottom: 1px solid #eee; position: relative;}
.writeForm textarea {width: 97%; height: 19em; min-height: auto; border-radius: 0.5em; padding: 1em;}
.writeForm textarea.short{height:5em;}
.writeForm span {margin-right: 12px; font-size: 13px; color: #a7a7a7;}
.writeForm span.req {vertical-align: text-top; color: #ff4151f8; padding-left: 5px;}
.writeForm label{margin-right:20px;}

.writeForm input.tit {width: 97%;}
.writeForm input.middle {width: 35%;}

.writeForm input{border: 1px solid #eaeaea; padding: 9px;}

.writeForm .director {width: 97%; height: auto;}
.writeForm select:focus {box-shadow: 0; border: 1px solid #333;}
.writeForm label.check {display: inline-flex;}
.writeForm input,
.writeForm select,
.writeForm select option {border-radius: 3px;}
.writeForm input:focus {border: 1px solid #333;}
.writeForm input[type='email'] {width: 320px;}
.writeForm input[type='file']{width:200px; background: none; border:0; padding: 0;}
.writeForm input[type='tel'] {width:60px;}
.writeForm select#book_code{width: 380px;}
.writeForm input#subject{width: 395px;}

.help tr:nth-last-child(4) th,
.help tr:nth-last-child(4) td,
.help tr:nth-last-child(3) th,
.help tr:nth-last-child(3) td,
.qna tr:nth-last-child(2) th,
.qna tr:nth-last-child(2) td{border-bottom: 0; padding-bottom:0;}

/* reply */
div.board.view > .reply  { background: #f7f7f7; width: 90%; margin: 0 auto 50px; padding: 35px 50px 50px; border-radius: 5px;}
div.board.view > .reply > .complet_tit > strong {position: absolute; top: 0; right: 0px; font-size: 14px; color: #00b5c0;}
.complet_tit {position: relative; padding-bottom: 20px; border-bottom: 1px dashed #d7d7d7;}

.complet_tit .qna_complet {overflow: hidden;}
.complet_tit .qna_complet li {float: left; font-size: 15px;}
.complet_tit .qna_complet li:first-child {width: 85%;}
.complet_tit .qna_complet li:last-child {text-align: right; font-family: 'Plus Jakarta Sans','Noto Sans KR',sans-serif; font-size: 12px; color: #aaa; padding-top: 7px}
.qna_complet i{font-weight: 700; font-size: 15px; color: #00b5c0; padding-right: 5px;}
.qna_complet strong{padding-right: 8px;}

.reply .complet {padding-top: 20px; font-size: 15px; line-height: 30px;}
div.board.view > .reply > .file {padding: 20px 0 0; border-bottom: 0;}
.reply .complet_data {font-size: 13px; color: #a7a7a7; border-top: 1px dashed #d7d7d7; padding-top: 20px;}

/* input */
input[type='checkbox'], input[type='radio']{vertical-align: sub;}
input:read-only:focus{border: 1px solid #eaeaea !important}
.search input{border:0;}
input.tit {width: 97%;}
input[type='radio'].check {width: 1px; height: 1px; display: none;}

/* sub, board search */
.search-sub {position: absolute; top: 60px; right: 0; z-index: 2;}
.search-sub ul  {overflow: hidden;}
.search-sub ul li {float: left;}
.search-sub select {padding: 5px 20px; margin-right: 10px; border: 1px solid #e9e9e9;}
.search-sub button {background: #333; font-size: 12px; padding: 9px 22px 8px; color: #fff; margin-left: 5px;}
div.search-sub input[type='text'] {border: 1px solid #e9e9e9; padding: 6px 10px;}

/* board */
div.board {position: relative;}
.board-top{position: relative; display: flex; align-items: center; padding-top: 10px; height: 20px;}
.board-top i{padding: 6px 0 0 5px; font-weight: 500;}
.board-top .search-sub{top: 5px;}
.ham{width: 12px; height: 2px; background: rgb(0 0 0 / 0.3); box-shadow: 0 4px 0 rgb(0 0 0 / 0.3), 0 8px 0 rgb(0 0 0 / 0.3);}

div.board > ul {padding: 10px 5px 0;}
div.board > ul > li {overflow: hidden; padding: 5px;}
div.board > ul > li > div {float: left;}
div.board > ul > li > div:first-child {width: 83%;}
div.board > ul > li > div.data {width: 16%; text-align: right; color: #a9a9a9; font-size: 13px; font-variant-numeric: tabular-nums;}

div.board table {width: 100%; border-top: 1px solid #000; margin-top: 16px;}
div.board table tr th {border-bottom: 1px solid #aaa; padding: 10px 10px 12px; font-size: 14px; letter-spacing: -.5px; text-align: center;}
div.board table tr td {text-align: center;font-size: 12px;padding: 12px 10px;border-bottom: 1px solid #eee;font-variant-numeric: tabular-nums;}
div.board table tr td a {letter-spacing: -0.5px;font-size: 14.5px;}
div.board table.file tr td:nth-child(3) a {color: #3975a2;font-size: 13px;line-height: 1;letter-spacing: -1px;}
div.board table.file tr.best td:nth-child(3) {font-weight: 400;}
div.board table.file tr.best td:nth-child(4) {font-weight: 500;}
div.info_conts.board table.file tr td:nth-child(3) a{color: #000; font-size: 15px;}
div.board table tr td:first-child,
div.board table.noti tr td:nth-child(4),
div.board table.file tr td:nth-child(5) {color: #a9a9a9;}
div.board table tr:hover,
div.board table tr.best:hover td {background: #f9f9f9;}
div.board table tr:first-child:hover {background: none;}
div.board table tr.best td {background: #edf4f4;}
div.board table tr.best td:first-child {color: #ee346c;}
div.board table tr.best td:nth-child(3) {font-weight: 500;}

div.board table.pr tr th {background: #edf4f4;}
div.board table.pr tr td {text-align: center; font-size: 15px;}
div.board table.file tr td:nth-child(3),
div.board table.file tr td:nth-child(4) {font-size: 15px;text-align: left;}
div.board table.noti tr td:nth-child(3) {text-align: left; padding: 0 50px;}
div.info_conts.board table.file tr td:nth-child(4) {font-size: 13px;}

div.board.view {border-bottom: 1px solid #000;}
div.board.view strong {color: #333;}
div.board.view ul.header {background: #edf4f4; margin-top: 20px; padding: 15px 0 15px 40px; border-top: 1px solid #000; overflow: hidden;}
div.board.view ul.header li {float: left; font-size: 15px;}
div.board.view ul.header li:first-child {width: 96%;}
div.board.view ul.header li:last-child {text-align: right; font-family: 'Plus Jakarta Sans','Noto Sans KR',sans-serif; font-size: 12px; color: #aaa; padding-top: 7px}
div.board.view ul.header i {margin-right: 8px;}
div.board.view ul.header strong {margin: 0 6px 0 2px;}
div.board.view .file {padding: 15px 0 15px 50px; border-bottom: 1px solid #e9e9e9; font-family: 'Plus Jakarta Sans','Noto Sans KR',sans-serif; font-size: 13px; color: #aaa;}
div.board.view .file a{word-spacing: 2px; letter-spacing: -0.5px;}
div.board.view .file a:hover{text-decoration: underline;}
div.board.view .file strong {margin-left: 5px;}
div.board.view .mr {margin: 0 15px 0 9px;}
div.board.view .cont {font-size: 15px; line-height: 30px; letter-spacing: -0.5px; padding: 35px 50px 50px;}
div.board.view .cont em,
div.board.view .cont i{font-style: italic !important;}

/* file borad */
div.board table.file col:nth-child(1){width: 5%;}
div.board table.file col:nth-child(2){width: 9%;}
div.board table.file col:nth-child(3){width: 29%;}
div.board table.file col:nth-child(4){width: 41%;}
div.board table.file col:nth-child(5){width: 8%;}

/* notice borad */
div.board table.noti col:nth-child(1){width: 10%;}
div.board table.noti col:nth-child(2){width: 12%;}
div.board table.noti col:nth-child(3){width: 58%;}
div.board table.noti col:nth-child(4){width: 10%;}


/*  search result */
.search-result{margin-top: 16px; border-top: 1px solid #000; border-bottom: 1px solid #eee; padding: 50px; text-align: center; font-size: 16px; line-height: 35px;}
.search-result strong{font-size: 20px; line-height: 45px;}

/* board sort */
.sort {border-radius: 30px; color: #fff; padding: 3px 15px 5px; font-size: 13px;}
.sort.st {background: #64c8cc;} /* 자료 다운로드 전체 */
.sort.ert {background: #ff9584 ;} /* 도서 정오표 - 정오표 */
.sort.er {background: #8375c9;} /* 도서 정오표 - 오류공지 */
.sort.er_etc{background:#64c8cc;} /* 도서 정오표 - 기타 */
.sort.noti {background: #81c8be;} /* 공지사항 */
.sort.evt {background: #8b9acb;} /* 이벤트 */
.sort.recruit {background: #a18bcb;} /* 채용공고 */
.sort.etc{background: #688aa4;} /* 기타 */
.sort.book {background: #70dad1;} /* 도서 */
.sort.line {border: 1px solid #ddd; color: #777;} /* 1:1 문의 - 게시판 */
.sort.qna {background: #00b5c0;}/* 1:1 문의 - 글 */

/* book sort */
.sort.b_new {background: #80ca7e;}
.sort.best {background: #ff806a;}
.sort.good {background: #85c5d4;}

span.new {color: #ee346c; font: 13px 'Plus Jakarta Sans','Noto Sans KR',sans-serif; margin-left: 10px;}

/* paging */
.paging{overflow: hidden; text-align: center;}
.paging li{display: inline-block; vertical-align: middle; width: auto;}
.paging li a{color: #aaa; padding: 2px; margin: 0 5px; font-size: 13px;}
.btn_arrow{position: relative; width: 28px; height: 28px; border: 1px solid #ccc; border-radius: 50%; padding: 0; margin:0; background: transparent;}
.paging a:hover{font-weight: 900; color: #64c4c4;}
.paging a.on{font-weight: 900; color: #64c4c4; border-bottom: 1px solid #64c4c4;}
.btn_arrow.prev::after{position: absolute; right: 8px; top: 9px; content: ''; width: 5px; height: 5px; border-bottom: 2px solid #ccc; border-left: 2px solid #ccc; transform: rotate(45deg);}
.btn_arrow.first::before{position: absolute; right: 6px; top: 9px; content: ''; width: 5px; height: 5px; border-bottom: 2px solid #ccc; border-left: 2px solid #ccc; transform: rotate(45deg);}
.btn_arrow.first::after{position: absolute; right: 11px; top: 9px; content: ''; width: 5px; height: 5px; border-bottom: 2px solid #ccc; border-left: 2px solid #ccc; transform: rotate(45deg);}
.btn_arrow.next::after{position: absolute; left: 8px; top: 9px; content: ''; width: 5px; height: 5px; border-top: 2px solid #ccc; border-right: 2px solid #ccc; transform: rotate(45deg);}
.btn_arrow.last::before{position: absolute; left: 6px; top: 9px; content: ''; width: 5px; height: 5px; border-top: 2px solid #ccc; border-right: 2px solid #ccc; transform: rotate(45deg);}
.btn_arrow.last::after{position: absolute; left: 11px; top: 9px; content: ''; width: 5px; height: 5px; border-top: 2px solid #ccc; border-right: 2px solid #ccc; transform: rotate(45deg);}
    
.btn_arrow:hover{background: #00b8b8; border-color: #00b8b8;}
.btn_arrow.prev:hover::after,
.btn_arrow.first:hover::after,
.btn_arrow.first:hover::before,
.btn_arrow.next:hover::after,
.btn_arrow.last:hover::before,
.btn_arrow.last:hover::after{border-color: #fff; }

/* button */   
.btn-wrap{text-align: center; overflow: hidden; padding:30px 0 20px; margin-top:30px;}
.btn-wrap button{display: inline-block;}
.btn{font-size: 18px; text-align: center; padding: 20px 70px 18px; margin: 20px 10px; border-radius: 5px; }
.submit{background: #09aab3; color: #fff; border: 1px solid #09aab3; margin: 0 auto; width: fit-content;}
.ok{background: #333; color: #fff; border: 1px solid #333; }
.add{border: 1px solid #09aab3; color: #09aab3;}
.btn.line{background: #fff; border: 1px solid #aaa; color: #333;}
.btn.full{width: -webkit-fill-available; margin: 0;}
.ok:hover{background: #3f3f3f; border: 1px solid #3f3f3f;}
.submit:hover{background: #00b5c0; border: 1px solid #00b5c0;}
.add:hover, 
.btn.line:hover{border: 1px solid #333;}

.btnA{border-radius: 15px; padding:5px 10px 7px; font-size:11px;}
.btnB{border-radius: 3px; vertical-align: bottom; padding: 8px 10px 11px; font-size: 12px;}


/* center */
.box_center {margin-top: 20px; position: relative;}
.box_center ul {overflow: hidden;}
.box_center ul li {float: left;}
.box_center ul li img {padding-right: 25px;}
.box_center .btn_write {position: absolute; right: 20px; bottom: 15px; background: #fff; padding: 9px 30px 7px; border-radius: 30px; font-size: 13px;}
.box_center .btn_write img {padding-right: 5px; padding-top: 1px;}

ul.center-wrap {border: 1px solid #e1e1e1; border-bottom: 0;}
ul.center-wrap > li {padding: 50px;}
ul.center-wrap > li:first-child {background: #f7f7f7; width: 607px; position: relative;}

.center-wrap pre {background: #fff; border-radius: 10px; position: absolute; top: 30px; right: 50px; padding: 20px 30px; box-shadow: 0px 2px 7px rgba(0,0,0,0.18);     font-variant-numeric: tabular-nums; letter-spacing: 0;}
.center-wrap pre span {font-size: 14px; color: #999; padding-top: 15px;}

div.center-conts > ul > li:nth-child(2) > div:first-child {font-weight: 700; font-size: 17px; padding-bottom: 8px;} 
.center-wrap > li:nth-child(2) > .center-conts div:nth-child(2) {user-select : all} 

.center-bar {background: #333; color: #fff; text-align: center; white-space: pre; padding: 20px 0; font-size: 17px;}
.center_no {font-size: 35px;}

/* element */
.bg_gr {background: #f7f7f7;}

.ml_05{margin-left: 5px !important}
.mt_10{margin-top:10px;}
.mt_30{margin-top:30px !important}
.mf_10{margin-bottom: 10px;}

.pd_30{padding: 30px 0 !important;}
.pd_50{padding: 50px 0 !important;}

.pt_07{padding-top:7px;}
.pt_10{padding-top:10px;}
.pt_20{padding-top:20px;}
.pt_40{padding-top: 40px !important;}
.pt_70{padding-top:70px;}

.pl_10{padding-left: 10px !important;}

.pb_20{padding-bottom:20px;}
.pb_70{padding-bottom:70px;}

.under{text-decoration: underline;}
.red{color: #f20945 !important;}
.yellow{color: #eaff00}
.green{color: #72ff00}

span.q {color: #00b5c0; margin-left: 10px;}
.mint{color: #00b5c0 !important;}
.small{font-size:15px;}

.more {position: absolute; top: 68px; right: 12px; font-size: 13px; color: #aaa; letter-spacing: normal; z-index: 1;}
.bar {font-size: 13px; color: #a9a9a9;}
span.down {background: #dfebee; border-radius: 50%; padding: 9px 7px;}
span.down img {width: 22px;}
span.down:hover {background: #c8e9d5;}


.file_wp{overflow: hidden; display: flex; align-items: center; height: 50px;}
.file_wp li{display: inline-flex;}
.file_wp input[type='file']{width: 90px;}
.fileNanme p{display: flex; padding-left: 5px;}
.btn_del{position: relative; width: 15px; height: 24px; border-radius: 50%; border: 1px solid #aaa; padding: 2px 11px 3px 10px; background: none; margin-left: 5px;}
.btn_del::before,
.btn_del::after{position: absolute; left: 10px; top: 5px; content: ''; width: 1px; height: 12px; background: #aaa;}
.btn_del::before { transform: rotate(45deg);}
.btn_del::after { transform: rotate(-45deg);}

/* book depth */
.depth_top {width:100%; background: #fff; height: calc(160px -25px); padding-top:35px;}
.depth_fix {width:100%; position: fixed; top:0; left:0; padding:10px 0 15px; box-shadow: 2px 3px 9px 1px rgb(0 0 0 / 0.05); /* transform: translate(83%,0%); height: calc(100% - 250px); */ z-index:2;}

.depth {overflow: hidden; text-align: center; background: #fefefe; width:1100px; margin:0 auto;}
.depth li {float: left;  text-align: center; cursor: pointer; border: 1px solid #efefef; margin:0 5px 5px 0; width: 213px; height: 50px; border-radius: 3px; background: #f7f7f7; display: inline-grid;  align-items: center;} 

/* 
.depth_top {width:100%; background: #fff; height: calc(160px -25px); padding-top:25px;}
.depth {overflow: hidden; text-align: left; background: #fefefe; width:1100px; margin:0 auto;}
.depth li {text-align: center; cursor: pointer; border: 1px solid #efefef; margin:0 5px 5px 0; width: 213px; height: 50px; border-radius: 3px; background: #f7f7f7; display: inline-grid;  align-items: center;} 
*/

.depth li.active {background: #555; color: #fff; border: 1px solid #555;}
.depth li:hover {background: #555; color: #fff; border: 1px solid #555;}

/* book */
.book-main,
.book_list {position: relative;}
.book_list {border-bottom: 1px solid #efefef;}
.book_list h3 {border-bottom: 1px solid #333; padding-bottom: 16px;}
.book_list > ul {margin-top: 30px; border-bottom: 1px solid #ccc; padding-bottom: 25px; overflow: hidden; display: flex; align-items: center; height: 278px;}
.book_list > ul:last-child{border-bottom: 0;}
.book_list > ul li {float: left; position: relative;}
.book_list > ul.no_register li{clear: both; width: 100%; text-align: center;}
.book_cont {margin-left: 20px;}
.book_list_img {/* width: 15%; */ width: 160px; height: 235px; padding: 12px 20px 0;}
.book_out{position: absolute; top: 12px; left: 20px; width: 160px; height: 235px; background: rgba(0,0,0,0.7); color: #fff; font-size: 20px; text-align: center; display: grid; align-items: center;}
.book_list_img img {width: 100%; height: 100%; box-shadow: 2px 3px 9px 1px rgb(0 0 0 / 0.2);}
.book_cont {width: 50%;}
.book_cont .label {padding-bottom: 11px;}
.book_cont .label span {font-size: 11px;}
.book_cont i {font-size: 22px; font-weight: 600; line-height: 1.2; letter-spacing: -1px;}
.book_info {background: #efefef; padding: 16px 30px 17px; height:110px;}
.book_info div {padding-bottom: 5px; font-size: 15px;}
.book_info strong {padding-left: 0 !important;}
.book_info span {color: #acacac; margin-right: 5px; line-height: 20px;}
.btn_list_wp {position: absolute; right: 20px; bottom: 18px;}

.btn_book {border-radius: 3px; text-align: center; padding: 12px 38px 15px; margin-top: 5px;}
.btn_book a {color: #fff;}
.cart {background: #555;}
.buy {background: #00b5c0; box-shadow: 0px 1px 6px 3px rgb(0 0 0 / 0.15);}

.store {border: 1px solid #555; color: #555;}
.store p {padding-bottom: 8px;}
.store:hover {cursor: pointer;}

.store_pop {visibility: hidden;} 
.btn_book.store .show{visibility: visible; -webkit-animation: fadeIn .5s; animation: fadeIn .5s;}

@-webkit-keyframes fadeIn {from {opacity: 0;} to {opacity: 1;}}
@keyframes fadeIn {from {opacity: 0;}to {opacity:1 ;}}

.store_pop {/* visibility: hidden; */ position: absolute; top: 0; right: 167px; border-radius: 0.2em; background: #fff; width: 300px; height: 110px; z-index: 1; box-shadow: 0px 2px 7px rgba(0,0,0,0.2); text-align: left;}
.store_pop:after,.store_pop:before  {left: 100%; top: 50%; border: solid transparent; content: ""; height: 0; width: 0; position: absolute; pointer-events: none;}
.store_pop:after  {border-width: 8px; margin-top: -35px;}
.store_pop:before  {border-left-color: #fff; border-width: 8px; margin-top: -35px;}
.store_pop > ul {overflow: hidden; padding: 10px;}
.store_pop > ul > li {font-size: 13px; float: left; padding: 9px 0 0 10px; width: 80px;}
.store_pop > ul > li > div{display: grid; align-items: center; text-align: center; height: 75px; width: 263px;}
.store_pop > ul > li a{color: #333;}
.store_pop > ul > li a:hover{text-decoration: underline;}

.price  {display: flex; padding-top: 10px;}
.price > strong  {font-size: 20px; letter-spacing: -1.5px; font-weight: 600; margin-top: -5px; padding: 0 5px;}
.price > span.sale {font-size: 15px; color: #f20945;}
.price > s{font-size: 12px; padding-top:3px; color: #aaa;}
.book_info > .price > s{font-size: 15px; padding-right: 5px;}
.book_info > .price {display: list-item;}

ul.mark-down{overflow: hidden; padding-top: 10px;}
ul.mark-down li{float: left;}
ul.mark-down li label{padding: 15px;}
ul.mark-down li:first-child{border-right: 0;}
ul.mark-down li:last-child label{padding-right: 0;} 

ul.mark-down li > span{color: #ccc; font-size: 12px; font-weight: 100;}
input[type='radio'].check{width: 1px; height: 1px; display: none;}
input[type='radio'].check:checked+span{font-weight: 700; color: #00b8b8;}    

input[type='radio'].check:checked+span.apply_check:before{color: #00b8b8;}
span.apply_check{font-weight: 300; color: #555; list-style-type: none;font-size: 1em;}
span.apply_check:before{content: '\2713'; display: inline-block; color: #555; padding: 0 6px 0 0; }

/* reading-book */
.reading_quick {width: 300px; background: #fff; position: absolute; top: 130px; left: 50%; height: calc(100% - 250px); transform: translate(83%,0%);}
.reading_fix {position: fixed; top: 22px; left: 50%; transform: translate(83%,0%); height: calc(100% - 250px);}
.reading_list {padding: 0 20px;}
.reading_box{width: 240px; margin: 0 auto; background: #fff; padding: 10px 20px; border: 1px solid #efefef; text-align: center;}
.reading_box .book_tit {font-weight: 900; font-size: 20px; line-height: 45px; color: #00b5c0; border-bottom: 1px solid #5e5e5e;}
.reading_box ul {overflow: hidden; border-bottom: 1px solid #eee !important; padding: 13px 0 !important; margin: 0; height: 102px; display: flex; align-items: center;}
.reading_box a:last-child ul {border-bottom: 0 !important;}
.reading_box ul li:first-child {float: left; width: 40%; height: 70%; border-radius: 5px; background: #f5f5f5; padding: 15px 0; margin-top: 5px;}
.reading_box ul li:last-child {float: right; width: 55%; padding-left: 10px; text-align: left; font-size: 15px;}
.reading_box ul li img {width: 50%; margin: 0 auto; box-shadow: 0px 2px 7px rgba(0,0,0,0.2);}
.reading_box ul li div strong {font-size: 15px; color: #000; line-height: 17px;}
.reading_box ul li div:first-child {padding-bottom: 6px;}
.reading_box ul li div {font-size: 14px; color: #a7a7a7; line-height: 16px;}
.reading_box div strong:hover {text-decoration: underline;}
.reading_box li div:last-child,
.reading_box li div:last-child strong {font-size:12px;}

/* sns login */
.member_sns {overflow: hidden; margin: 0 auto; width: auto; text-align: center; display: inline-flex; padding:30px 0;}
.member_sns li {display: inline-flex; }
.member_sns li:first-child {width: 260px; text-align: left; margin-left: 0; }
.member_sns i {font-size: 15px; font-weight: 600; padding: 8px 0 12px;}
.member_sns small {font-size: 13px; color: #7e7e7e; font-weight: 500;}
.member_sns figure {margin-left: 23px;}
.member_sns figure img {border-radius: 50%; border: 1px solid #e0e0e0; background: #fff;}
.member_sns figcaption {/* font-size: 12px; */ font-size: 0.7em; color: #999;}
.member_sns em{font-size:18px;}

/* my page */
.myBox {position: relative; width: -webkit-fill-available; margin-top: 16px; border-top: 1px solid #000;  text-align: center;}
.my_info{border-bottom: 1px solid #eee; overflow: hidden;}
.my_info li {float: left; width: 49%; padding: 55px 0;}
.my_info li:last-child {border-left: 1px solid #eee;}
.my_info figcaption {color: #57b7c0; font-size: 25px; font-weight: 700;}
.my_info figure img {border-radius: 50%; background: #f5f5f5; margin:16px 0;}
.my_info a{padding:10px 50px; display: inline-block; font-size:16px;}
.my_info em{color: #7e7e7e; font-size: 15px; font-weight: 500; display: block;}
.myBox > i{font-weight: 900; font-size: 33px; margin-bottom:25px;}
.myBox > small{color: #7e7e7e; font-size: 15px; font-weight: 500;}
.myBox i{display:block;}

/* mypage confirm */
.myBox .confirm{padding:30px 0 50px; border-bottom: 1px solid #efefef;}
.myBox .confirm input{border: 1px solid #eaeaea; padding: 10px; width:450px;}
.btn_confirm{background: #333; color:#fff; padding: 12px 25px 11px; font-size:12px;}
.my_sns{width:550px; margin:0 auto;}

/* login join id pw form */
.inbox {width: 520px; margin: 0 auto; text-align:center; padding:25px 0 25px; position:relative;}
.inbox h3{letter-spacing: -1px}
.inbox > i {padding: 12px 0 5px; font-size: 18px; color: #333; font-weight :400; display: block;}
.inbox > small{font-size: 14px;  color: #aaa; margin-bottom:20px; display: block;}
.inbox_conts{width: auto; margin: 7px auto 0;}
.inbox_conts pre{margin-top:20px; padding-top: 40px; border-top: 1px solid #efefef; text-align: left;  font-size: 18px; color:#555; font-weight:600;}
.inbox_conts.join pre{border-top:0; padding-top:0;}

.inbox_form{padding:10px 0 16px;}
.inbox_form input{width: -webkit-fill-available; background: #efefef; color: #9f9f9f; padding: 25px 27px; margin-top: 8px; font-size: 18px; border-radius: 5px; border: 1px solid #efefef;}
.inbox_conts .btn {width: -webkit-fill-available; margin: 0; padding: 22px 80px 18px; font-size: 22px; line-height: 20px; margin-bottom:17px;}

.inbox_menu {text-align: right;}
.inbox_menu a{display: inline-flex; border-left: 1px solid rgba(0,0,0,0.2); margin: 0px 5px; height: 12px; padding-left: 8px; align-items: center; color:#999; font-size: 13px; font-weight:300;}
.inbox_menu a:first-child {border-left: 0;}

.noti_txt{text-align: center; font-size:16px; color:#999; font-weight: 300; border-top: 1px solid #efefef; margin-top: 25px; padding-top: 25px;}
.noti_txt strong{color: #000;}

/* login */
.inbox_hyphen {overflow: hidden; padding-bottom: 10px;}
.inbox_hyphen li:first-child {float: left; margin-top: -10px; width: 50%; font-size: 13px; color: #999;  text-align: left;}
.inbox_hyphen li:last-child {text-align: right;}
input[type="checkbox"]:checked {background: #ccc;}
.inbox_hyphen input[type='checkbox'] {width: 23px; height: 23px; margin-right: 7px; margin: 10px 7px 15px 0; vertical-align: middle;}

/* login sns */
.inbox ul.member_sns{border-top: 1px solid #ececec; margin-top: 28px; padding: 40px 0 20px;}

/* login google 검수에 따른 수정 */
.login-sns{color: #777; padding: 15px 0; border-top: 1px solid #eee; margin-top: 20px;}

/* 이미 회원 로그인 바로가기 */
.sub_box{padding: 20px 30px; background: #efefef; border-radius: 5px; margin-top: 20px;}
.sub_box li:first-child{color:#373737; font-size: 16px; text-align: left; float: left; padding-top: 3px;}
.sub_box li .login{border: 1px solid #000 !important; padding: 8px 30px 10px; border-radius: 5px; font-size: 12px; font-weight: 500;}
.sub_box li a{color: #333;}
.sns .sub_box{font-size:18px; letter-spacing:0;}
.sub_txtBox{font-size: 15px; text-align: left; margin-top:0; line-height: 25px;}

/* id 찾기 */
.inbox_conts.find{border-top: 1px solid #efefef; margin-top:10px;}
.sub_box.big{font-size: 23px; font-weight:700; color: #555; padding: 35px 0; margin: 30px 0;} 
.sub_box.big span{color :#9f9f9f; font-weight:300;}

/* join */
.inbox_conts small{font-size: 18px; color:#333; font-weight:300; text-align: left; display: block; padding: 7px 0 25px;}
.sub_box.finish{text-align: left; margin-bottom: 22px; padding: 35px 80px; font-weight: 500; font-size: 17px;}

.join .btn-wrap{margin-top:0;}

.mailForm{padding-top: 20px;}
.mailForm input,
.mailForm select {border-radius:5px;}

.mailForm input{margin:0 5px;  padding: 14px 20px;}
.mailForm input:first-child{margin-left:0;}
.mailForm select {vertical-align: bottom; padding: 14px 0 14px 10px;}
.mailForm input:focus,
.mailForm select:focus{border: 1px solid #00b5c0;}
.mailForm input:-internal-autofill-selected{border: 1px solid #eaeaea;}

.memberForm{margin-top: 20px; text-align: left; width: -webkit-fill-available;}
.memberForm li{position:relative; padding:5px 0;}
.memberForm li:first-child{padding-top:0;}

.memberForm input{border: 1px solid #eaeaea; padding: 14px; font-size:15px; border-radius:5px; width:-webkit-fill-available; height: 20px;}
.memberForm input:focus,
.memberForm select:focus{border: 1px solid #00b5c0}
.memberForm input:focus{padding: 12px 14px 0; height: 36px;}
.memberForm input[type='tel']:focus{padding: 14px; height: 20px;}
.memberForm .intxt{position: absolute; top: 8px; left: 15px; font-size: 11px; color: #00b5c0;}
.memberForm li:first-child .intxt{top: 3px;}
.memberForm .intxt.pw{top: 58px;}
.memberForm input[type='email']:focus{padding: 14px; height: 20px;}
.memberForm input[type='radio'].check+span{border:1px solid #efefef; padding:14px 38px;}
.memberForm input[type='radio'].check:checked+span {font-weight: 700; color: #fff; background: #00b8b8;}
.memberForm li:last-child div{position: absolute; top: 17px; right:0;}
.memberForm input[type='radio']:checked+span{border:1px solid #00b8b8;}

.memberForm div label:nth-child(1) input[type='radio'].check+span{border-top-left-radius: 10px; border-bottom-left-radius: 10px;}
.memberForm div label:nth-child(2) input[type='radio'].check+span{border-top-right-radius: 10px; border-bottom-right-radius: 10px;}

.memberForm input[type='checkbox'], 
.memberForm input[type='radio']{width:20px;}

.memberForm > li > small,
.agree > small,
.writeForm small{font-size: 12px; font-weight: 500; padding:2px 5px 5px; color: #f20945;}

.memberForm select{padding-left: 60px; height: 50px; width: 30.5%; border-radius: 5px;  margin-right: 1%;}
.memberForm input[type='tel']{width: 24%; margin: 0 1%; text-align: center;}
.memberForm input[type='tel']:first-child{margin-left:0;}
.memberForm input[type='tel']:last-child{margin-right:0;}
.memberForm input.half{width:50%; margin-right: 10px;}
.memberForm input.short{width:60%;}
.memberForm .btn{margin-left: 15px; padding: 15px 52px; font-size: 15px; vertical-align: text-top;}
.memberForm:last-child li:last-child input[type='text']{font-size: 14px; padding: 7px 9px 9px;  margin-left: -42px; width: 72%;}
.memberForm:last-child li:last-child label{display: inline-block;width: 24.65%; margin: 10px 0;}
.hr{margin:15px 0; padding: 10px 0; border-bottom:1px solid #eaeaea; position: relative !important; top:0 !important;}

.inbox_conts details{position: relative; border-top: 1px solid #eaeaea; margin-top: 30px;}
.inbox_conts details .memberForm li:nth-child(3){padding: 5px 0 !important;}
.inbox_conts details .memberForm input:focus{padding: 14px; height: 20px;}

.inbox_conts details summary:first-of-type{list-style:none}
.inbox_conts details summary{cursor: pointer; font-size: 18px; color: #555; font-weight: 600; text-align: left; height: 25px; padding-top: 30px;}
.agree details[open] {height: auto;}
.inbox_conts details[open] .arrow{width: 0; height: 0;}
.inbox_conts details[open] .arrow::after {position: absolute; top:30px; right:10px; content: ''; width: 8px; height: 8px; /* 사이즈 */ border-top: 2px solid #333; border-right: 2px solid #333; /* 선 굵기 */ transform: rotate(135deg); /* 각도 */}
.inbox_conts details .arrow{width: 30px; height: 30px;}
.inbox_conts details .arrow::after {position: absolute; top: 40px; right: 10px;content: ''; width: 8px; height: 8px; /* 사이즈 */ border-top: 2px solid #333; border-right: 2px solid #333; /* 선 굵기 */ transform: rotate(-45deg); /* 각도 */}

.detail_view{position: absolute; right: 32px; top: 20px; font-size: 13px; font-weight: 400; color: #555;}
.detail_view .arrow{width: 30px; height: 30px;}
.detail_view .arrow::after {position: absolute; top: 5px; right: -20px; content: ''; width: 8px; height: 8px; /* 사이즈 */ border-top: 2px solid #333; border-right: 2px solid #333; /* 선 굵기 */ transform: rotate(45deg); /* 각도 */}

.agree{text-align:left;}
.agree pre{border-top: 1px solid #333 !important; padding: 20px 0 !important; border-bottom: 1px solid #eaeaea;}
.agree li{position: relative; border-bottom: 1px solid #eaeaea; font-size: 16px;}
.agree li label{display: block; padding: 15px 0; width:fit-content;}
.agree details{border-top: 0; margin-top: 0;}
.agree details div{padding: 20px 30px; border-top: 1px dashed #e9e9e9; font-size: 14px; background:#f9f9f9; max-height: 200px;
 overflow-y: auto;}
.agree details summary{font-size: 13px; font-weight: 400; border-bottom: 0; position: absolute; top: -66px; right:30px;}
.agree details summary .arrow::after{ position: absolute; top: 32px; left: 70px;  content: ''; width: 8px; height: 8px; /* 사이즈 */ border-top: 2px solid #333; border-right: 2px solid #333; /* 선 굵기 */ transform: rotate(135deg); /* 각도 */}
.agree details[open] summary .arrow::after{position: absolute; top: 39px; left: 70px; content: ''; width: 8px; height: 8px; /* 사이즈 */ border-top: 2px solid #333; border-right: 2px solid #333; /* 선 굵기 */ transform: rotate(-45deg); /* 각도 */}
.inbox_conts .resultat{font-size: 20px;}

/* join step */
.join_step{margin: 70px 0 30px; padding-bottom:40px; border-bottom:1px solid #000;}
.step-back{ height: 1px; background:#efefef;}
.step_box{overflow: hidden; text-align: center; margin-top:-50px;}
.step_box li{display: inline-block; font-size:14px; margin-right:80px; color:#888;}
.step_box li:last-child{margin-right:0;}
.step_box i{display: block; color: #00b5c0; font-size:13px;}
.step_box em{display: block; font-weight:800; font-size:20px;}
.step_box span{display: block; margin-top:10px;}
.step_box li div{display: inline-block;}
.step_box .step{border-radius: 50%; border:1px solid #efefef; background:#fff; width: 50px; height: 50px; padding: 20px 15px 10px;}
.step_box .now .step{border:3px solid #00b5c0;}
.step_box .now span{color:#00b5c0; font-weight:600;}

button.arrow {background: #555; border-radius: 50%; padding: 16px; position: relative;}
button.arrow .arrow-up,
button.arrow .arrow-down{left: 10px;}
button.arrow .arrow-up {top: 10px;}
.arrow-up,
.arrow-down {position: relative; width: 30px; height: 30px; position: absolute; left: 5px;}
.arrow-up {top: 5px;}
.arrow-down {top: 2px;}
.arrow-up::after {position: absolute; left: 2px; top: 4px; content: ''; width: 6px; height: 6px; /* 사이즈 */ border-top: 2px solid #fff; border-left: 2px solid #fff; /* 선 굵기 */ transform: rotate(45deg); /* 각도 */}
.arrow-down::after {position: absolute; left: 2px; top: 4px; content: ''; width: 6px; height: 6px; /* 사이즈 */ border-right: 2px solid #fff; border-bottom: 2px solid #fff; /* 선 굵기 */ transform: rotate(45deg); /* 각도 */}

/* 개인정보처리방침,이용약관 */
body.agree {width: 100%; min-width: 100%;}
.policy {max-width: 90%; margin: 0 auto; position: relative; color: #555; font-size: 13px; font-weight: 300; padding-bottom: 50px; letter-spacing: 0;}
.policy > em {padding: 20px 0 16px; display: block; color:#000; font-size: 23px; font-weight: 600;}
.policy small {color: #555; font-size: 13px;}
.policy > i{display: block; font-weight: 300; padding: 26px 0 16px;}
.policy > .box_subtxt {width: inherit; font-size: 13px; white-space: normal; overflow: hidden; padding: 25px 10px 20px; border-radius: 5px; background: #f7f7f7; color: #777;}
.conts > em {padding-top: 20px; display: block; color:#000; font-size: 23px; font-weight: 600;}
.policy > .box_subtxt li {display: inline-block; padding: 0 30px; width: 275px; /* height: 25px; */ border-bottom:0; font-size: 13px; vertical-align: top;}
.policy.info > .box_subtxt li{width: 325px;}
.policy > .box_subtxt li div{padding: 2px 0;}
.policy > .box_subtxt a {color: #555;}
.policy > .box_subtxt a:hover {text-decoration: underline;}
.policy > .conts {width: inherit;}
.policy > .conts > i {font-size: 15px; letter-spacing: -0.5; margin-top: 30px; font-weight: 700; display: block;}
.policy > .conts > sub {font-size: 13px; display: block; padding-top: 15px;}

.policy table {width: 100%; margin-top: 15px;}
.policy table th,
.policy table td {padding: 15px; font-size: 13px; color: #777;}
.policy table td {border-left: 1px solid #eee;}
.policy table td:first-child {border-left: 0;}
.policy table td:last-child {border-right: 0;}
.policy table thead th {background: #f7f7f7; padding: 10px 0;}
.policy table thead th {border-left: 1px solid #eee;}
.policy table thead th:first-child {border-left: 0;}
.policy table thead td {text-align: center; border-bottom: 1px solid #eee;}
.policy table tbody th {text-align: left; vertical-align: text-top; font-weight: 300; border-bottom: 1px solid #eee;}
.policy table tbody td {border-bottom: 1px solid #eee; line-height: 21px;}

.policy table.inherit {width: 97%; margin: 16px auto 0;}
.policy table.inherit td:nth-child(2),
.policy table.inherit td:nth-child(4),
.policy table.inherit td:nth-child(5),
.policy table.inherit td:nth-child(6),
.policy table.inherit td:nth-child(8) {text-align: center;}

.policy .txt {line-height: 23px; padding-top: 15px;}
.policy .txt p {position: relative; padding-left: 8px;}
.policy .txt span{position: absolute; left: 0;}


.policy .left > p {margin-left: 12px;}
.policy .txt span.k {left: -12px;}

.policy table td{position: relative;}
.policy table td p span {position: absolute; left: 16px;}
.policy table td p {margin-left: 12px;}

.policy .no {margin-left: 7px;}
.policy .no span {left: -6px;}
.no > .no > p  {margin-left: 14px;}
.no > .no > p > span {left: -12px !important;}

.top_btn {position: fixed; right: 2%; bottom: 3%; z-index: 2;}
.b_left {border-left: 1px solid #eee !important;}

/* 오류 발생 */
.hc{display: flex; align-items: center;}
.er-wrap{width: 70%; margin: 0 auto; text-align: center;}
.er-wrap .tit{font-size: 24px; font-weight: 800; color: #000;}
.er-wrap .tit img{padding-bottom: 20px;}
.er-wrap .tit li{padding: 2px 0 4px;}
.er-wrap .txt{font-size: 16px; color: #373737; padding: 30px 0 10px;}
.er-wrap .btn{font-weight: 600; background: #57c9ba; color: #fff; display: inline-block;} 
.er-wrap .logo{padding-top: 30px;}

/* 로딩 */
.rotate{width: 96px; height: 96px; margin: 0 auto; animation:rotate-in-center 1.2s cubic-bezier(.25,.46,.45,.94) infinite;}
@-webkit-keyframes rotate-in-center{
    0%{-webkit-transform:rotate(-360deg);transform:rotate(-360deg);opacity:0.2}100%{-webkit-transform:rotate(0);transform:rotate(0);opacity:1}
}
@keyframes rotate-in-center{
    0%{-webkit-transform:rotate(-360deg);transform:rotate(-360deg);opacity:0.2}100%{-webkit-transform:rotate(0);transform:rotate(0);opacity:1}
}