@charset "utf-8";
@import url(/amlib/_guide/css/contents.css);

@font-face {
	font-family: 'yg-jalnan';
	src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_four@1.2/JalnanOTF00.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

div::-webkit-scrollbar { width:4px;}
div::-webkit-scrollbar-track { background:#e7e7e7; }
div::-webkit-scrollbar-thumb {background: #000;  }
div::-webkit-scrollbar-thumb:hover {background: #004bd5;}

select {
	appearance: none; /* 기본 화살표 제거 */
	-webkit-appearance: none;
	-moz-appearance: none;
	background:#fff url('/amlib/portal/img/common/arrow-down-s-line.svg') no-repeat right 1rem center!important;
	background-size:20px 20px!important;
	padding-right: 3rem!important; /* 화살표 공간 확보 */
	border-radius: 1rem;
	border: 1px solid #dedede;
}
select::-ms-expand {
	display: none;
}


.graybox {padding:4rem; background:#f8f9fb url('/amlib/portal/img/contents/grayboxbg.png') no-repeat right bottom; border-radius:2rem;}
.graybox p {font-size:1.6rem;}
.graybox p.tit {font-weight:700; color:#333; font-size:2rem; margin-bottom:0.5rem;}
.graybox.icon {display:flex; flex-wrap:wrap; justify-content: space-between; align-items:center;}
.graybox.icon:before {content:''; width:12.2rem; height:11.4rem;}
.graybox.icon.g01:before {background:url('/amlib/portal/img/common/g01.png') no-repeat 0 0 / contain; }
.graybox.icon.g02:before {background:url('/amlib/portal/img/common/g02.png') no-repeat 0 0 / contain; }
.graybox.icon.g03:before {background:url('/amlib/portal/img/common/g03.png') no-repeat 0 0 / contain; }
.graybox.icon.g04:before {background:url('/amlib/portal/img/common/g04.png') no-repeat 0 0 / contain; }
.graybox.icon.g05:before {background:url('/amlib/portal/img/common/g05.png') no-repeat 0 0 / contain; }
.graybox.icon > div {width:calc(100% - 15rem)}

.subsear-top > p {font-family: 'yg-jalnan'; font-size:2.8rem; color:#000; text-align:center;}
.subsear-top > p span {color:#0c817a;}

.searw {display:flex; flex-wrap:wrap; justify-content:space-between; width:90%; margin:5rem auto 0;}
.s-wrap {padding:2px; border-radius:5rem; width:calc(100% - 25rem); height:6.5rem; display:flex;  position:relative; margin-left:4rem;
background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #171877), color-stop(1, #019549));
	background: -moz-linear-gradient(to top, #171877 0%, #019549 100%);
	background: -webkit-linear-gradient(to top,  #171877 0%, #019549 100%);
	background: -o-linear-gradient(to top,  #171877 0%, #019549 100%);
	background: -ms-linear-gradient(to top,  #171877 0%, #019549 100%);
	background: linear-gradient(to top,  #171877 0%, #019549 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#171877', endColorstr='#019549', gradientType=0);
}
.ssear {background:#fff; border:0; border-radius:5rem; width:100%; height:100%; padding: 0 3rem 0 10rem; display:flex; align-items:center; justify-content: space-between ;flex-wrap:wrap;}
.ssear:before {content:''; display:block; width:12.2rem; height:12.2rem; background:url(/amlib/portal/img/main/mt-searchimg.png) no-repeat 50% bottom / contain; position:absolute; bottom:0; left:-4rem;}

.ssear .sser-select { width:12rem; position:relative;}
.ssear .sser-select .scurrent {color:#000; display:flex; justify-content: space-between;}
.ssear .sser-select .scurrent:after {content:'\ea4e'; display:flex; width:2.4rem; height:2.4rem; background:#000; align-items: center; justify-content: center; color:#fff; font-family: remixicon !important; font-style: normal; -webkit-font-smoothing: antialiased; border-radius:50%; font-size:1.6rem; line-height:1em;}
.ssear .sser-select ul {display:none; position:absolute; top:3rem; left:0; background:#333; border-radius:0.4rem; width:100%; padding:1rem;}
.ssear .sser-select ul li a {font-size:1.5rem; color:#fff;}

.ssear input[type="text"] {width:calc(100% - 13rem); border:0; }
.ssear input[type="submit"] {width:6.5rem; height:6.5rem; position:absolute; top:0; right:-4rem; border:0; border-radius:50%; background:url(/amlib/portal/img/main/mt-searchbtn.jpg) no-repeat 50% 50%; overflow:hidden; text-indent:-9999px; box-shadow: 0.3rem 0.3rem 0.5rem rgba(0,0,0,0.2);}

.detailsear {background:#000; color:#fff; width:15rem; display:flex; align-items:center; justify-content: center; border-radius:5rem;}
.detailsear * {color:#fff;}

@media (max-width:1280px) {
	.searw {width:100%}
}
@media (max-width:1024px) {
	.graybox {padding:3rem 2rem;}	
}
@media (max-width:768px) {
	.searw { margin:2rem auto;}
	.s-wrap { width:calc(100% - 15rem); }
	.detailsear { width:6.5rem;}
	.detailsear span {display:none;}
	.ssear { padding: 0 3rem 0 3rem;}
	.ssear:before {width:8rem; height:8rem; left:-5rem;}
	.ssear .sser-select {display:none;}
	.ssear input[type="text"] {width:100%;}
}

.detailcon {border-top:2px dotted #dedede; padding-top:4rem; display:none; margin-top:5rem;}
.whitebox {background:#fff; padding:4rem; border-radius:1rem;} 

.ds-wrap {display:flex; flex-wrap:wrap;}
.sitem {width:50%; display:flex; flex-wrap:wrap; align-items:center; justify-content: space-between; border-top:1px solid #dedede; padding:1rem 2rem;}
.sitem:nth-child(1){border-top:0;}
.sitem > strong {width:8rem;}
.sitem > strong:before {content:''; display:inline-block; width:0.8rem; height:0.8rem; background:#e61e76; border-radius:50%; margin-right:0.5rem; transform: translateY(-0.3rem);}
.sitem > div {width:calc(100% - 10rem);  display:flex; align-items: center;}
.sitem > div p {margin-top:0; margin-right:2rem;}
.sitem > div p:last-child {margin-right:0;}
.sitem > div select,
.sitem > div input[type="text"] {border-radius:1rem;}

@media (max-width:768px){
	.detailcon {padding-top:2rem;}
	.whitebox {padding:2rem 2rem;}
	.sitem {width:100%;}
	.sitem > strong {width:8rem;}
	.sitem > div {width:calc(100% - 10rem); font-size:0.9em;}
}
@media (max-width:480px){
	.sitem {padding:1rem 0;}
	.sitem > strong {width:100%; margin-bottom:0.5rem;}
	.sitem > div {width:100%;}
}

.booklist-wrap {position:relative; margin-top:5rem;}
.booklist-top {display:flex; align-items:center; justify-content: space-between; margin-bottom:1rem;}
.booklist-top .result {color:#241216;}
.booklist-top .result span:nth-child(1) {color:#0468d7; font-weight:700;}
.booklist-top .result span:nth-child(2) {color:#e72b72; font-weight:700;}

.booklist-top .pageinfo {color:#241216;}
.booklist-top .pageinfo span:nth-child(1) {color:#e72b72; font-weight:700;}

.booklist-list {position:relative; border-top:2px solid #333; border-bottom:1px solid #dedede;}
.booklist-list > ul > li {padding:3rem; border-top:1px solid #dedede}
.booklist-list > ul > li > a {display:flex; justify-content:flex-start; color:#333; position:relative;}
.booklist-list > ul > li > a .book-thum {margin-right:3rem; width:17%;}
.booklist-list > ul > li > a .book-thum img {vertical-align:top; width:100%; border-radius:1rem; border:1px solid #e6e6e6;}
.booklist-list > ul > li > a .book-con {width:calc(100% - 3rem); display:flex; flex-direction: column; justify-content: space-between;}
.booklist-list .book-con .book-title {font-weight:600; color:#000; font-size:2.4rem; line-height:1.2em; }
.booklist-list .book-con .book-title span {color:#fff;  border-radius:0.5rem;  font-size:1.3rem; display:inline-block; min-width:8rem; text-align:center; transform: translateY(-0.5rem); margin-right:1rem;}
.booklist-list .book-con .book-title span.t1 {background:#004bd5;}
.booklist-list .book-con .book-title span.t2 {background:#1ca082;}
.booklist-list .book-con .book-title span.t3 {background:#fc8a1a;}

.booklist-list .book-con ul { font-size:1.6rem;}
.booklist-list .book-con ul li {display:flex; flex-wrap:wrap; margin:0.5rem 0;}
.booklist-list .book-con ul li strong {width:5.5em;}
.booklist-list .book-con ul li strong:before {content:''; display:inline-block; width:0.8rem; height:0.8rem; border-radius:50%; background:#e72b72; transform: translateY(-0.3rem); margin-right:0.5rem;}
.booklist-list .book-con ul li span {width:calc(100% - 6em);}
.booklist-list .book-con ul li span:before {content:''; display:inline-block; width:1px; height:0.8rem; background:#ddd; transform: translateY(-0.3rem); margin-right:1em;}
.booklist-list .book-con ul li p.bookcon {width:100%; background:#f8f9fb; border-radius:1rem; padding:3rem; margin-top:1rem;}
.booklist-list .book-con p.state {width:100%; text-align:center; background:#f7f7f7; border-radius:1rem; padding:1rem;}
.booklist-list .book-con p.state.possibility {color:#033161;} 
.booklist-list .book-con p.state.impossibility {color:#999;} 

.booklist-list > ul > li > a:hover .book-thum img{box-shadow: 0.5rem 0.5rem 0.5rem rgba(0,0,0,0.2); }
.booklist-list > ul > li > a:hover:after {content:''; display:block; width:6rem; height:6rem; background:url(/amlib/portal/img/contents/book-hover.png) no-repeat 50% 50% / contain; position:absolute; top:3rem; right:0;}
@media (max-width:1024px) {
	.booklist-list > ul > li > a:hover:after {display:none;}
}
@media (max-width:768px) {
	.booklist-list > ul > li {padding:2rem;}
	.booklist-list > ul > li > a .book-thum{width:25%;}
}
@media (max-width:480px) {
	.booklist-list > ul > li {padding:2rem 0;}
	.booklist-list > ul > li > a .book-thum {margin-right:2rem; width:30%;}
	.booklist-top .pageinfo {display:none;}
}
.bookTopsear {background:#f8f9fb; padding:5rem 1rem; text-align:Center; border-radius:3rem;}
.bookTopsear > select {margin:0.3rem;}
.bookTopsear > input[type="submit"] {background:#295bb5; color:#fff; border-radius: 1rem; font-size: .9444em; padding: 0.882em 2rem; border:0; margin:0.3rem;}

@media (max-width:480px) {
	.bookTopsear {padding:1rem 1rem;}
	.bookTopsear > select {width:100%;}
	.bookTopsear > input[type="submit"] {width:100%;}
}

.bookview {position:relative;}
.bookview-top {position:relative; padding:5rem 4rem; border-radius:1rem; border:1px solid #e7e7e7; display:flex; margin-bottom:3rem;}
.bookview-top .book-thum {margin-right:3rem; width:20%;}
.bookview-top .book-thum img {vertical-align:top; width:100%; border-radius:1rem; border:1px solid #e6e6e6;}
.bookview-top .book-con {width:100%; display:flex; flex-direction: column; justify-content:center;}
.bookview-top .book-con .book-title {font-weight:600; color:#000; font-size:2.4rem; line-height:1.2em; margin-bottom:2rem;}

.bookview-top .book-con .book-title span {color:#fff;  border-radius:0.5rem;  font-size:1.3rem; display:inline-block; min-width:8rem; text-align:center; transform: translateY(-0.4rem); margin-right:1rem;}
.bookview-top .book-con .book-title span.t1 {background:#004bd5;}
.bookview-top .book-con .book-title span.t2 {background:#1ca082;}
.bookview-top .book-con .book-title span.t3 {background:#fc8a1a;}
.bookview-top .book-con ul li p.bookcon {width:100%; background:#f8f9fb; border-radius:1rem; padding:3rem; margin-top:1rem;}

.bookview-top .book-con ul { font-size:1.6rem; display:flex; flex-wrap:wrap; justify-content: space-between;}
.bookview-top .book-con ul li {display:flex; flex-wrap:wrap; margin:0.5rem 0; }
.bookview-top .book-con ul li:nth-child(odd) {width:calc(43% - 1rem);}
.bookview-top .book-con ul li:nth-child(even) {width:calc(57% - 1rem);}
.bookview-top .book-con ul li.last100 {width:100%;}

.bookview-top .book-con ul li strong {width:5.5em;}
.bookview-top .book-con ul li strong:before {content:''; display:inline-block; width:0.8rem; height:0.8rem; border-radius:50%; background:#e72b72; transform: translateY(-0.3rem); margin-right:0.5rem;}
.bookview-top .book-con ul li span {width:calc(100% - 6em); padding-left:1em; position:relative;}
.bookview-top .book-con ul li span:before {content:''; display:inline-block; width:1px; height:0.8rem; background:#ddd; position:absolute; top:0.7rem; left:0;}

@media (max-width:1280px) {
	.bookview-top .book-con ul li {width:100%!important;}
}
@media (max-width:768px) {
	.bookview-top {padding:2rem;}
	.bookview-top .book-thum{width:25%;}
}
@media (max-width:480px) {
	.bookview-top {flex-wrap:wrap;}
	.bookview-top .book-thum{width:100%; margin-right:0;}
	.bookview-top .book-con {margin-top:2rem;}
}

.calendarHead { color:#fff; text-align:center; padding:2rem; display:flex; justify-content: space-between; font-weight:700; align-items:center;
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #3aa7b8), color-stop(1, #0165d8));
	background: -moz-linear-gradient(to top, #3aa7b8 0%, #0165d8 100%);
	background: -webkit-linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	background: -o-linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	background: -ms-linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	background: linear-gradient(to top,  #3aa7b8 0%, #0165d8 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#3aa7b8', endColorstr='#0165d8', gradientType=0);}
.calendarHead a {color:#fff;}
.calendarHead a span {text-indent:-9999px; display:inline-block;}
.calendarHead a i {font-size:3rem; font-weight:400;}

.calendarHead #thisYearMonth {font-size:2.2rem; letter-spacing:0.2rem;}
.calendarHead #thisYearMonth em {font-size:2.8rem; color:#fff;}
.calendarHead #thisYearMonth i {font-size:3rem; font-weight:400; margin-right:1rem;}

.calendar {position:relative;}
.calendar table {width:100%; font-size:1.6rem;}
.calendar table th,
.calendar table td {border-bottom:1px solid #dedede; text-align:center; padding:1rem 1rem; position:relative;}
.calendar table tbody {border-top:3px solid #333;}
.calendar table td {height:15rem;}
.calendar table th {font-weight:600; padding:2rem 1rem;}
.calendar table td p:first-child {font-size:1.4rem; color:#202020; font-weight:700; line-height:3rem;  text-align:center; width:100%;}
/* .calendar table td {vertical-align: ;} */

.calendar table td.close p {color:#ccc;}
.calendar table td:nth-child(1) > p,
.calendar table th:nth-child(1) {color:#cc0000;}
.calendar table td:last-child > p,
.calendar table th:last-child {color:#0468d7;}

.calendar table td ul {text-align:left; font-size:1.3rem; line-height:1.2em; height:calc(100% - 3rem); display:flex; flex-direction:column; justify-content:center;}
.calendar table td ul li { position:relative; margin:0.2rem 0;  }
/* .calendar table td ul li:before {content:''; display:inline-block; width:0.8rem; height:0.8rem; border-radius:50%; background:#0468d7; position:absolute; top:0.3rem; left:0;} */

.calendar table td ul li a {display:flex; align-items:flex-start; justify-content: space-between; flex-wrap:wrap; }
.calendar table td ul li a:hover {color:#666;}
.calendar table td ul li a:hover {color:#0468d7; text-decoration: underline;}
.calendar table td.close span {width:100%; height:calc(100% - 3rem); display:flex; background:url(/amlib/portal/img/contents/closebg.gif); align-items:center; justify-content: center; border-radius:1rem; font-size:1.4rem; }
.calendar table td ul li em {border-radius:0.5rem; padding:0.2rem 0 0 0; text-align:Center; display:inline-block; color:#fff; width:3.6rem;}
.calendar table td ul li em.et01 {background:#0165d8; }
.calendar table td ul li em.et02 {background:#019549; }
.calendar table td ul li span {width:calc(100% - 4.2rem); display:inline-block; word-break: break-all;  }

.calendar table td p.trip {display:block; height:calc(100% - 3rem); align-content:center;}
.calendar table td p.trip button,
.calendar table td p.trip span {  padding:1rem; border-radius:0.5rem; font-size:1.4rem!important; display:inline-block;line-height:1.2em;}
.calendar table td p.trip button {background:#004bd5; color:#fff;}
.calendar table td p.trip span {background:#9c9c9c; color:#fff;}
.calendar table td p.trip button em,
.calendar table td p.trip span em {color:#fff;}

.layor-wrap {display:flex; width:100%; height:100%; background:rgba(0,0,0,0.8); position:fixed; left:0; top:0; z-index:999;align-items:center; justify-content: center; display:none;}
.layor-wrap .popsch {width:90%; max-width:80rem;}
.layor-wrap .popsch .title { background:#0468d7; color:#fff; position:relative; padding:2rem; font-size:3.2rem; font-weight:700; border-radius:3rem 3rem 0 0; line-height:1.2em; display:flex;}
.layor-wrap .popsch .title i {font-weight:400; /* transform: translateY(-0.2rem);  */display:inline-block; margin-right:1rem;}
.layor-wrap .popsch .title span {max-width:90%; display:inline-block; }
.layor-wrap .popsch .title .layor-close {position:absolute; top:2.5rem; right:2rem;}
.layor-wrap .popsch .title .layor-close span {text-indent:-9999px; display:inline-block; width:0; height:0; position:absolute; top:0; right:0}
.layor-wrap .popsch .title .layor-close:after {content:'X'; width:3rem; height:3rem; display:flex; align-items:center; justify-content: center; font-weight:200; transform: scaleY(80%);}

.layor-wrap .popsch .popcon { background:#fff; padding:3rem; font-size:1.6rem; border-radius:0 0 3rem 3rem ;}
.layor-wrap .popsch .popcon ul li {display:flex; margin:1rem 0; flex-wrap:wrap;}
.layor-wrap .popsch .popcon ul li strong {width:4.5em;}
.layor-wrap .popsch .popcon ul li strong:before {content:''; display:inline-block; width:0.8rem; height:0.8rem; border-radius:50%; background:#e72b72; transform: translateY(-0.3rem); margin-right:0.5rem;}
.layor-wrap .popsch .popcon ul li span {width:calc(100% - 6em); padding-left:1em; position:relative;}

.layor-wrap .popsch .popcon ul li div {width:100%; background:#fafafa; padding:2rem;border-radius:1rem; margin-top:1rem; max-height:30rem; overflow-y:auto;}

@media (max-width:800px) {
	.layor-wrap .popsch .title {padding-top:3rem;}
	.layor-wrap .popsch .title .layor-close {position:absolute; top:-2rem; right:calc(50% - 2rem);}
	.layor-wrap .popsch .title .layor-close:after { background:#000; border-radius:50%; transform: scaleY(100%); font-size:2rem; width:4rem; height:4rem;}
	.calendar table th, .calendar table td {padding:1rem 0.5rem;}
	.calendar table td {padding:0.5rem; height:10rem;}
	.calendar table td ul li a span{display:none;}
	.calendar table td ul li a em {display:flex; width:100%; align-items:center; justify-content: center; flex-wrap:wrap;}
	.calendar table td ul li a em:before {content:'\eb24'; text-indent:0; display:block; font-family: remixicon !important; font-style: normal;  padding:1rem 0.5rem; border-radius:0.5rem; -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; font-size:2rem; text-align:center; color:#fff;  line-height:1em;}

	.layor-wrap .popsch .title span {max-width:100%;}
	
	.calendar table td p.trip button,
.calendar table td p.trip span {  padding:1rem 0.5rem;}
	/*.calendar table td p.trip button em,
	.calendar table td p.trip span em {display:none;}*/

}
@media (max-width:480px) {
	.calendar table td ul li a em:before{display:none;}
	.calendar table td ul li a em {padding:0.5rem;}
}



/* 공통 board */
.board-wrap .booklist-top {padding-bottom:2rem; border-bottom:1px solid #dedede; margin-bottom:5rem;}

.board-wrap {position:relative;}
.board-wrap table {width:100%; text-align:center; font-size:1.6rem;  border-top:2px solid #0468d7;}
.board-wrap table thead th {background:#fafbff; border-bottom:1px solid #dedede; padding:2rem 0; font-weight:700;}
.board-wrap table tbody td{border-bottom:1px solid #dedede; padding:1.5rem 1rem; vertical-align:middle;} 
.bod_wrap p.pB10 {font-size:1.4rem;}
@media (max-width:768px) {
	.board-wrap table thead {display:none;}
	.board-wrap table tbody tr {display:flex; flex-wrap:wrap; border-bottom:1px solid #dedede; position:relative; padding:1rem;}
	.board-wrap table tbody td { padding:0.2rem; border:0; width:100%; text-align:left; }
}

/* 작은도서관리스트 */
.smallmap {border:1px solid #0468d7; margin-bottom:5rem;}
table.smalllib tbody td a {background:#fff; color:#fff; padding:0.7rem 1rem; border-radius:0.5rem; font-size:1.3rem; border:1px solid #0165d8; color:#0165d8; display:inline-block;}
table.smalllib tbody td a:hover {text-decoration: underline; color:#fff; background:#0165d8;}
@media (max-width:768px) {
	table.smalllib colgroup {display:none;}
	table.smalllib tbody tr {padding:1rem 7rem 1rem 5rem; }
	table.smalllib tbody td:nth-of-type(1) {position:absolute; top:calc(50% - 2rem); left:0; }
	table.smalllib tbody td:nth-of-type(1) span {background:#0165d8; color:#fff; display:flex; align-items: center; justify-content: center; width:4rem; height:4rem; border-radius:50%;}
	table.smalllib tbody td:nth-of-type(2) span {font-weight:700; font-size:1.2em;}
	table.smalllib tbody td:nth-of-type(5) {position:absolute; top:calc(50% - 2rem); right:0; width:auto;} 
}

/* 강좌리스트 */
table.lecture-list tbody td strong {display:none;}
table.lecture-list tbody td:last-child span {  color:#fff; display:inline-block; text-align:center; padding:1rem; border-radius:0.5rem; width:8rem;}
table.lecture-list tbody td:last-child span.end {background:#000; opacity:0.2;}
table.lecture-list tbody td:last-child span.ready {background:#019549;}
table.lecture-list tbody td:last-child span.doing {background:#0166d8;}
table.lecture-list tbody td:last-child span.watingReady {background:#1db895;}
@media (max-width:768px) {
	table.lecture-list colgroup{display:none;}
	table.lecture-list tbody td {width:50%; }
	table.lecture-list tbody td strong {display:inline-block; position:relative; margin-right:2rem;}
	table.lecture-list tbody td strong:before {content:''; display:inline-block; width:4px; height:4px; background:#0165d8; transform: translateY(-0.3rem); margin-right:0.5rem; }
	table.lecture-list tbody td:nth-of-type(1) {width:100%; margin-bottom:1rem;}
	table.lecture-list tbody td:nth-of-type(1) span {font-weight:700; font-size:1.2em;}
	table.lecture-list tbody td:last-child {width:100%; margin-top:1rem;}
	table.lecture-list tbody td:last-child span {width:100%;}
}
@media (max-width:580px) {
	table.lecture-list tbody td {width:100%; }
}

.perbox {border-radius:2rem; border:1px solid #dedede; overflow:hidden;}
.perbox div.percon {overflow-y:auto; min-height:20rem; max-height:30rem; padding:2rem; margin:2rem; }
.perbox .percheck {border-top:1px solid #dedede; padding:2rem; text-align: center;}

.lecture-write .bod_write { }
.lecture-write dl { width:100%;  }
.lecture-write dl dt {width:10em; height:100%; align-content: center; text-align:Center;}
.lecture-write dl dd {width:calc(100% - 10em); height:100%;  align-content: center; }

.lecture-write dl dd input[type="password"],
.lecture-write dl dd input[type="text"],
.lecture-write dl dd select {max-width:100%; border-radius:0.5rem!important;}
.lecture-write dl dd p.exm {font-size:1.4rem; margin-top:0.5rem;}
.lecture-write dl dd label {margin-right:2rem;}
.lecture-write dl dd label:last-child {margin-left:0;}
.lecture-write .tel_wrap dd {display:flex; flex-wrap:wrap; justify-content: space-between; align-items: center;}
.lecture-write .tel_wrap dd input[type="text"],
.lecture-write .tel_wrap dd select {width:30%;}
.lecture-write .tel_wrap dd span {width:5%; text-align:center;}
@media (max-width:1420px) {
	.lecture-write dl { width:100%!important;}
	.lecture-write dl dd input[type="password"],
	.lecture-write dl dd input[type="text"],
	.lecture-write dl dd select {width:auto; max-width:32rem; }
}
@media (max-width:640px) {
	.lecture-write dl {flex-wrap:wrap;}
	.lecture-write dl > dt {width:100%; height:auto; text-align:left; font-size:1.8rem;}
	.lecture-write dl > dd {width:100%; height:auto;}
}

.lecture-view table {position:relative;  }
.lecture-view table td a {border:1px solid #dedede; padding:1rem; display:inline-block; border-radius:0.5rem; margin:0.5rem 0.5rem; position:relative;}
.lecture-view table td a:before {content:'\ec53'; display:inline-block; font-family: remixicon !important; font-style: normal; -webkit-font-smoothing: antialiased;}
.lecture-view table td a:hover {background:#fafafa;}
@media (max-width:768px) {
	.lecture-view table colgroup{display:none;}
	.lecture-view table tr {width:100%; display:flex; flex-wrap:wrap;}
	.lecture-view table tr th{width:100%; height:auto; font-weight:700; color:#000; border-bottom:0; text-align:left; font-size:1.8rem; padding-bottom:0; background:none;}
	.lecture-view table tr th:before {content:''; display:inline-block; width:0.6rem; height:1.6rem; background:#004bd5; margin-right:0.5rem; border-radius:3rem;}
	.lecture-view table tr td{width:100%; height:auto;}
}

.history {position:relative; font-weight:700; margin-left:2rem;}
.history dt {font-size:2.8rem; padding-left:4rem; position:relative; line-height:1em; padding:5rem 0 3rem 4rem;}
.history dt:before {content:''; display:block; width:1.6rem; height:1.6rem; background:#ddd; position:absolute; top:calc(60% - 0.8rem); left:0; border-radius:50%; z-index:1;}
.history dt:after {content:''; display:block; width:1px; height:100%; background:#dedede; position:absolute; bottom:0; left:0.8rem; z-index:0;}
.history dd { padding:1rem 0 1rem 4rem; position:relative;}
.history dd:before {content:''; display:block; width:0.7rem; height:0.7rem; background:#ddd; position:absolute; top:2rem; left:0.5rem; border-radius:50%;  z-index:1;}
.history dd:after {content:''; display:block; width:1px; height:100%; background:#dedede; position:absolute; top:0; left:0.8rem; z-index:0;}
.history dd { padding:1rem 0 1rem 4rem; position:relative; display:flex; flex-wrap:wrap; justify-content: space-between;}
.history dd strong {width:4rem; text-align:right; }
.history dd span {width:calc(100% - 6rem);}

.history dl:first-child dt:after {height:calc(100% - 6rem); }
.history dl:last-child dd:last-child:after {height:calc(100% - 2rem); }

.history dl:first-child dt:before {background:#004bd5; outline:1rem solid rgba(0,75,213,0.2)}
.history dl:first-child dt:after  {background:#004bd5;}
.history dl:first-child dd:before {background:#004bd5; }
.history dl:first-child dd:after  {background:#004bd5;}

.history dl:first-child dd:nth-child(even) {color:#004bd5;}

.directions {position:relative; border-radius:1rem; overflow:hidden;}
.directions .root_daum_roughmap {width:100%!important;}
.directions .map_border {display:none;}
.directions .cont {display:none;}
.directions-bottom{background:#ff000020; padding:3rem; display:flex; justify-content: space-between; align-items:center; color:#fff; flex-wrap:wrap;
background: -webkit-gradient(linear, left top, right top, color-stop(0, #1e62b5), color-stop(1, #b82a57));
	background: -moz-linear-gradient(to left, #1e62b5 0%, #b82a57 100%);
	background: -webkit-linear-gradient(to left,  #1e62b5 0%, #b82a57 100%);
	background: -o-linear-gradient(to left,  #1e62b5 0%, #b82a57 100%);
	background: -ms-linear-gradient(to left,  #1e62b5 0%, #b82a57 100%);
	background: linear-gradient(to left,  #1e62b5 0%, #b82a57 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1e62b5', endColorstr='#b82a57', gradientType=1);
} 
.directions-bottom div {display:flex;}
.directions-bottom div p {display:flex; align-items:center; margin-right:3rem;}
.directions-bottom div p strong{margin-right:2rem;}
.directions-bottom div p span {font-weight:300;}
.directions-bottom div p:before {content:''; display:inline-block; width:3.4rem; height:3.4rem; margin-right:0.5rem;}
.directions-bottom div p:nth-of-type(1):before{background:url(/amlib/portal/img/contents/directions_i01.png) no-repeat 50% 50% / contain;}
.directions-bottom div p:nth-of-type(2):before{background:url(/amlib/portal/img/contents/directions_i02.png) no-repeat 50% 50% / contain;}

.directions-bottom a {border-radius: 1rem; border:1px solid rgba(255,255,255,0.5); padding:0.7rem 2rem 0.7rem 1rem; transition:all .2s;}
.directions-bottom a span {display:flex; align-items:center; justify-content: center;}
.directions-bottom a span:before {content:''; display:inline-block; width:3.4rem; height:3.4rem; background:url(/amlib/portal/img/contents/directions_i03.png) no-repeat 50% 50% / contain;}
.directions-bottom a:hover {background:rgba(255,255,255,0.2);}

.transportation {border-top:2px solid #004bd5;}
.transportation dl {display:flex; flex-wrap:wrap; justify-content: space-between; align-items: center; padding:2rem; border-bottom:1px solid #dedede;}
.transportation dl dt {width:20rem; text-align:Center;}
.transportation dl dt span {color:#000; font-weight:700; font-size:2rem;}
.transportation dl dt span:before {content:''; display:block; width:5.8rem; height:5rem; background:url(/amlib/portal/img/contents/bus.png) no-repeat 50% 50% / contain; margin:0 auto 1rem;}
.transportation dl dd {width:calc(100% - 22rem);}
.transportation dl dd {font-weight:400; color:#555;}
.transportation dl dd li p.tit{font-weight:600; color:#000; margin-top:2rem;}
.transportation dl dd li:first-child p.tit {margin-top:0;}

@media (max-width:768px) {
	.directions-bottom {flex-direction: column; align-items: center; padding:2rem 0.5rem;}
	.directions-bottom > div{flex-direction: column; align-items: center;}
	.directions-bottom > div p{margin:0.5rem 0;}
	.directions-bottom div p {margin-right:0;}
	.directions-bottom div p strong{margin-right:1rem;}

	.transportation dl {padding:2rem 0;}
	.transportation dl dt {width:10rem;}
	.transportation dl dd {width:calc(100% - 12rem);}
}

.mybook {padding:8rem; background:url(/amlib/portal/img/contents/mybg.gif); border-radius:4rem; position:relative; overflow:hidden;}
.mybook:before {content:''; display:block; width:31.2rem; height:28.6rem; background:url(/amlib/portal/img/contents/dreambg.png) no-repeat right bottom / contain; position:absolute; bottom:calc(50% - 15.6rem); right:3rem;}
.mybook p.tit {margin-bottom:3rem;}
.mybook p.copy {font-size:1.8rem; color:#333;}
.mybook ul {margin-top:5rem; width:65%; display:flex; flex-wrap:wrap; justify-content: space-between;}
.mybook ul li {width:calc(50% - 0.5rem); margin-bottom:1rem;}
.mybook ul li a {padding:1rem; display:block; padding:3px; background:#dedede; position:relative; border-radius:1rem;}
.mybook ul li a > * {position:relative; z-index:1;}
.mybook ul li a:before {content:''; display:block; width:calc(100% - 6px); height:calc(100% - 6px); background:#fff; position:absolute; top:3px; left:3px; z-index:0;border-radius:0.7rem;}
.mybook ul li a span {display:flex; padding:2rem; position:relative; align-items:center; justify-content: space-between;}
.mybook ul li a span em {color:#000; display:flex; align-items:center; }
.mybook ul li a span em:before {content:''; display:inline-block; width:3.2rem; height:3.2rem;  margin-right:0.2rem;}
.mybook ul li:nth-of-type(1) a span em:before {background:url(/amlib/portal/img/contents/dream-icon01.png) no-repeat 50% 50% / contain;}
.mybook ul li:nth-of-type(2) a span em:before {background:url(/amlib/portal/img/contents/dream-icon02.png) no-repeat 50% 50% / contain;}
.mybook ul li:nth-of-type(3) a span em:before {background:url(/amlib/portal/img/contents/dream-icon03.png) no-repeat 50% 50% / contain;}
.mybook ul li:nth-of-type(4) a span em:before {background:url(/amlib/portal/img/contents/dream-icon04.png) no-repeat 50% 50% / contain;}
.mybook ul li a[target="_blank"] span:after {content:''; display:inline-block; width:1.6rem; height:1.6rem; margin-left:0.2rem; background:url(/amlib/portal/img/common/blank.png) no-repeat 50% 50% / contain;}
.mybook ul li a:hover {background: -webkit-gradient(linear, left top, left bottom, color-stop(0, #d42534), color-stop(1, #116cb1));
	background: -moz-linear-gradient(to top, #d42534 0%, #116cb1 100%);
	background: -webkit-linear-gradient(to top,  #d42534 0%, #116cb1 100%);
	background: -o-linear-gradient(to top,  #d42534 0%, #116cb1 100%);
	background: -ms-linear-gradient(to top,  #d42534 0%, #116cb1 100%);
	background: linear-gradient(to top,  #d42534 0%, #116cb1 100%);
	filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#d42534', endColorstr='#116cb1', gradientType=0);}
.mybook ul li a:hover em {font-weight:700;}

@media (max-width:1024px) {
	.mybook {padding:5rem 3rem;}
}
@media (max-width:768px) {
	.mybook {padding:5rem 3rem; padding-bottom:30rem; text-align:center;}
	.mybook:before { right:50%; transform: translateX(50%); width:30rem; height:30rem; bottom:3rem;}
	.mybook ul {width:100%; margin-top:2rem;}
	.mybook ul li {width:100%;}
	.mybook ul li a span {padding:1rem;}
}