@charset "UTF-8";

.no_data {padding:.8em; text-align:center; border-bottom:1px solid #DFE4EF;}


/* 대출/반납/예약자료 조회 */

.book-inquiry{padding:4em 1.5em 2.5em; background: #FBF9F4;  border-radius: .89em;}
.book-inquiry .book-inquiry-user {font-size: 2em; display:flex; align-items:center; margin-bottom: 1em; }
.book-inquiry .book-inquiry-user em{font-weight: 900;color: #9d4a26; margin-right: .2em;}
.book-inquiry .book-inquiry-user span{background: #fff;font-size: .5em;color: #222; margin-left: .7em; padding: .3em .75em;border-radius: .4em;}

.book-inquiry ul{display:flex; flex-wrap:nowrap;}
.book-inquiry ul li{padding: .5em; width:calc(100% / 6); box-sizing:border-box;}
.book-inquiry ul li a{position:relative;  display:block; box-sizing:border-box; padding: 1em; background:#fff; text-align:center ;border-radius: .5em;}
.book-inquiry ul li a p {position:relative; padding-top:6em; background-repeat:no-repeat; background-position:center top; background-size:5.555556em auto;}
.book-inquiry ul li a em {display:inline-block; font-size: 2em; font-weight:700;color: #9d4a26;}

.book-inquiry ul li:nth-child(1) a p {background-image:url(../img/sub/07/ico01.svg);}
.book-inquiry ul li:nth-child(2) a p {background-image:url(../img/sub/07/ico02.svg);}
.book-inquiry ul li:nth-child(3) a p {background-image:url(../img/sub/07/ico03.svg);}
.book-inquiry ul li:nth-child(4) a p {background-image:url(../img/sub/07/ico04.svg);}
.book-inquiry ul li:nth-child(5) a p {background-image:url(../img/sub/07/ico05.svg);}
.book-inquiry ul li:nth-child(6) a p {background-image:url(../img/sub/07/ico06.svg);}

.book-inquiry ul.user-info{margin-bottom:25px;}
.book-inquiry ul.user-info li em{position:relative; display:inline-block; width:65px; font-style:normal;}
.book-inquiry ul.user-info li em::before{position:absolute; display:inline-block; content:''; width:4px; height:15px; background:#d97a58; border-radius:4px; left:-15px; top:4px;}

@media(max-width:1024px){
	.book-inquiry ul {flex-wrap:wrap;}
	.book-inquiry ul li {width:calc(100% / 3);}
}


@media(max-width:640px){
	.book-inquiry {padding:2em 1em 1.5em;}
	.book-inquiry .book-inquiry-user {display:block; font-size:1.5em; text-align:center;}
	.book-inquiry .book-inquiry-user span {font-size:.75em;}
	.book-inquiry ul li {width:calc(100% / 2); padding:.25em;}
	.book-inquiry ul li a p {padding-top:4em; background-size:3.333334em auto;}
	.book-inquiry ul li a em {font-size:1.5em;}
}


/*   나의 꾸러미    */
.tab-box { background:#f8f8f8; padding:1em 2em; border-radius:.5em;}
.tab-box ul {display:flex; flex-wrap:nowrap;}
.tab-box ul li {width: calc(100% / 3); padding:0 .25em;}
.tab-box .tabs li a {position:relative; display:block;  background:#fff; border-radius:.5em; border:1px solid #ddd; padding:.75em 3.5em .75em 1.5em;}
.tab-box .tabs li a.on {background:#362a25; border-color:#362a25; color:#fff; font-weight:700;}
.tab-box .tabs li a:after {content:''; position:absolute; top:50%; right:.75em; transform:translateY(-50%); width:1.222223em; height:1.222223em; border-radius:1em; background:#F6F2EA url(../img/sub/03/tab_arrow.svg) no-repeat center center; background-size:100% auto;}
.tab-box .tabs li a.on:after {background-color:#fff;}
.tab-box .sub-tabs {margin:.5em .25em 0; padding:.5em; background:#fff; border-radius:.5em;}
.tab-box .sub-tabs li {padding:.5em;}
.tab-box .sub-tabs li a {display:block; padding:.5em 1em; background:#fff; border-radius:2em; border:1px solid #ddd; color:#222;}
.tab-box .sub-tabs li a.on {border-color:#9D4A26; color:#9D4A26; font-weight:700; text-decoration:underline;}

.kku-box {position:relative; display:block; border-radius:1.222223em; overflow:hidden; margin-top:1em;}
.kku-box .tit-box {position:relative; padding:4em 6em; }
.kku-box .tit-box p {position:relative; z-index:2;}
.kku-box .tit-box:after {content:''; position:absolute; top:4em; right:0; width:37.777778em; height:24.444444em; background-repeat:no-repeat; background-position:top right; background-size:contain; z-index:1;}
.kku-box .con-box {position:relative; padding:2em 3em;}
.kku-box .con-box .name {color:#fff; font-size:2em; margin-bottom:.25em;}
.kku-box .con-box .name strong {font-weight:900;}
.kku-box .con-box ol li {position:relative; width:calc(10% - 1em); float:left; margin:.5em; background:#DFF4FF; border:1px solid #a0cde4; border-radius:3em; overflow:hidden; }
.kku-box .con-box ol li:before {content:''; display:block; padding-top:100%;}
.kku-box .con-box ol li span {position:absolute; top:50%; left:50%; transform:translate(-50%, -50%); font-weight:900; font-size:1.5em; color:#3E6288; z-index:1;}
.kku-box .con-box ol li.on span {width:100%; height:100%; background: #DFF4FF url(../img/sub/07/ico_kku_check.svg) no-repeat center center; background-size:auto 100%; text-indent:-9999px;}

.kku-box.type01 {background:#BECFE0;}
.kku-box.type01 .tit-box:after {background-image:url(../img/sub/07/kku_obj01.svg);}
.kku-box.type01 .con-box {background:#93B0CE;}

.kku-box.type02 {background:#3794C3;}
.kku-box.type02 .tit-box:after {background-image:url(../img/sub/07/kku_obj02.svg);}
.kku-box.type02 .con-box {background:#1E7CAC;}

.kku-box.type03 {background:#7786C5;}
.kku-box.type03 .tit-box:after {background-image:url(../img/sub/07/kku_obj03.svg);}
.kku-box.type03 .con-box {background:#586599;}

#read-survey.modal-pop .modal {width:50em;}
#read-survey.modal-pop .modal .box-txt h4 {font-size:1.333334em;}
#read-survey.modal-pop .modal .con > div  {height:70vh; overflow:auto;}
#read-survey.modal-pop .modal .list-q dl {padding:1.5em 0;}
#read-survey.modal-pop .modal .list-q dl + dl {border-top:1px dashed #ddd; margin-top:0;}
#read-survey.modal-pop .modal .list-q dt {font-size:1.111112em; color:#9D4A26;}
#read-survey.modal-pop .modal .list-q dd input[type="text"],
#read-survey.modal-pop .modal .list-q dd textarea {width:100%; margin:.1em 0;}
#read-survey.modal-pop .modal .list-q dd * + .radio-wrap { display:inline-block; margin-left:1em}


@media all and (max-width:1024px){
	.kku-box .tit-box {padding:3em 3em;}
	.kku-box .tit-box p img {height:10em;}
	.kku-box .tit-box:after {top:2em; height:18em;}
	
	.kku-box .con-box {padding:2em;}
	.kku-box .con-box ol li {width:calc(10% - .5em); margin:.25em;}
	
	#read-survey.modal-pop .modal {width:90%;}
	
}

@media all and (max-width:768px){
	.tab-box {padding:1em;}
	.kku-box .tit-box {padding:3em 2em;}
	.kku-box .tit-box p img {height:8em;}
	.kku-box .tit-box:after {right:-2em; height:15em;}
	
	.kku-box .con-box .name {font-size:1.75em;}
	.kku-box .con-box ol li span {font-size:1.25em;}
}

@media all and (max-width:640px){
	.tab-box ul {display:block;}
	.tab-box ul li {width:100%; padding:.1em;}
	.tab-box .sub-tabs li {padding:.1em;}
	
	.kku-box .tit-box {height:15em;}
	.kku-box .tit-box p img {height:8em;}
	.kku-box .tit-box:after {top:auto; bottom:-3em; right:-2em; height:12em;}
	
	.kku-box .con-box {padding:1.5em 1em;}
	.kku-box .con-box .name {font-size:1.5em;}
	.kku-box .con-box ol li {width:calc(20% - 1em); margin:.5em;}
	#read-survey.modal-pop .modal .title {padding-right:3em;}
	#read-survey.modal-pop .modal .close-pop {right:1em;}
}

@media all and (max-width:420px){
	.kku-box .tit-box p img {height:6em;}
	.kku-box .tit-box:after {height:10em;}
}