@charset "UTF-8";

.container {
  width: 1200px;
}

#container.subpage>.section {
  min-height: 932px;
}

#header {
  box-sizing: border-box;
}

.gnb>ul {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
}

.gnb>ul>li {
  width: 157px;
  height: 100px;
  position: relative;
  text-align: center;
}

.gnb>ul>li:last-child {
  margin-right: 0;
}

.gnb>ul a {
  display: block;
}

.gnb>ul a span {
  display: inline-block;
  position: relative;
}

.gnb>ul a span:before {
  height: 4px;
  display: block;
  content: "";
  width: 0;
  background-color: #01ab9d;
  transition: all 0.15s ease 0s;
  position: absolute;
  bottom: -1px;
  transform: translateX(-50%);
  left: 50%;
}

.gnb>ul>.active>a,
.gnb>ul a:hover {
  color: #01ab9d;
}

.gnb>ul>.active>a span:before,
.gnb>ul a:hover span:before {
  width: 100%;
}

.gnb>ul>li>a {
  line-height: 100px;
  font-size: 22px;
  font-weight: 700;
}

.gnb>ul>li:first-child ul {
  border-left: #ededed solid 1px;
}

.gnb>ul>li.on>a span {
  color: #01ab9d;
}

.gnb>ul>li.on>a span:before {
  width: 100%;
}

.gnb>ul>li.on ul {
  background-color: #f7fbfa;
}

.gnb ul ul {
  border-right: #ededed solid 1px;
  background: #fff;
  height: 0;
  overflow: hidden;
  opacity: 0;
  transition: all 0.15s ease 0s;
}

.gnb ul ul a {
  padding: 0;
  transition: all 0.15s ease 0s;
}

.gnb ul ul a span {
  padding: 0;
  transition: all 0.15s ease 0s;
}

.gnb ul ul a span:before {
  height: 0;
}

.gnb ul ul li:first-child a {
  padding-top: 0;
}

.gnb ul ul li:last-child a {
  padding-bottom: 0;
}

.hover_bg {
  background: #000;
  position: fixed;
  left: 0;
  width: 0;
  bottom: 0;
  top: 0;
  z-index: 110;
  opacity: 0;
  transition: opacity 0.15s ease 0s;
}

.close_btn {
  display: none;
  font-size: 0;
}

.nav_bg {
  position: absolute;
  left: 0;
  top: 101px;
  right: 0;
  background: #fff;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  height: 0;
  transition: all 0.15s ease 0s;
}

/*
#header.on .gnb ul ul {
  opacity: 1;
}
#header.on .gnb ul ul a {
  padding: 4px 0;
}
#header.on .gnb ul ul a span {
  padding: 8px 0;
}
#header.on .gnb ul ul a span:before {
  height: 2px;
}
#header.on .gnb ul ul li:first-child a {
  padding-top: 22px;
}
#header.on .gnb ul ul li:last-child a {
  padding-bottom: 22px;
}
#header.on.gnb5 .gnb ul ul, #header.on.gnb5 .nav_bg {
  height: 232px;
}
#header.on.gnb6 .gnb ul ul, #header.on.gnb6 .nav_bg {
  height: 272px;
}
#header.on.gnb7 .gnb ul ul, #header.on.gnb7 .nav_bg {
  height: 312px;
}
#header.on.gnb8 .gnb ul ul, #header.on.gnb8 .nav_bg {
  height: 352px;
}
#header.on.gnb9 .gnb ul ul, #header.on.gnb9 .nav_bg {
  height: 392px;
}
#header.on.gnb10 .gnb ul ul, #header.on.gnb1 .nav_bg {
  height: 432px;
}
#header.on.gnb11 .gnb ul ul, #header.on.gnb1 .nav_bg {
  height: 472px;
}
#header.on.gnb12 .gnb ul ul, #header.on.gnb1 .nav_bg {
  height: 512px;
}
#header.on + .hover_bg {
  opacity: 0.25;
  width: 100%;
}

.snb li.on a:hover {
  color: #01ab9d;
}
.snb li.on a:hover span:before {
  width: 100%;
}
*/
/* body class로 메뉴 활성화 */
body.a00 .gnb li.a00>a>span,
body.b00 .gnb li.b00>a>span,
body.c00 .gnb li.c00>a>span,
body.d00 .gnb li.d00>a>span,
body.e00 .gnb li.e00>a>span,
body.f00 .gnb li.f00>a>span,
body.i00 .gnb li.i00>a>span {
  color: #01ab9d;
}

body.a00 .gnb li.a00>a>span:before,
body.b00 .gnb li.b00>a>span:before,
body.c00 .gnb li.c00>a>span:before,
body.d00 .gnb li.d00>a>span:before,
body.e00 .gnb li.e00>a>span:before,
body.f00 .gnb li.f00>a>span:before,
body.i00 .gnb li.i00>a>span:before {
  width: 100%;
}

body.a10 .snb .sub_10 a,
body.a20 .snb .sub_20 a,
body.a30 .snb .sub_30 a,
body.a40 .snb .sub_40 a,
body.a50 .snb .sub_50 a,
body.b10 .snb .sub_10 a,
body.b20 .snb .sub_20 a,
body.b30 .snb .sub_30 a,
body.c10 .snb .sub_10 a,
body.c20 .snb .sub_20 a,
body.c30 .snb .sub_30 a,
body.d10 .snb .sub_10 a,
body.d20 .snb .sub_20 a,
body.d30 .snb .sub_30 a,
body.d40 .snb .sub_40 a,
body.d50 .snb .sub_50 a,
body.e10 .snb .sub_10 a,
body.f10 .snb .sub_10 a,
body.f20 .snb .sub_20 a,
body.f30 .snb .sub_30 a,
body.f40 .snb .sub_40 a,
body.f50 .snb .sub_50 a,
body.f60 .snb .sub_60 a,
body.f70 .snb .sub_70 a,
body.f80 .snb .sub_80 a,
body.i10 .snb .sub_10 a,
body.i20 .snb .sub_20 a,
body.i30 .snb .sub_30 a,
body.i40 .snb .sub_40 a,
body.i50 .snb .sub_50 a {
  background: linear-gradient(100.51deg, #01AB82 28.67%, #01AB9D 87.37%);
  color: #fff;
}

body.a10 .snb .sub_10 a:before,
body.a20 .snb .sub_20 a:before,
body.a30 .snb .sub_30 a:before,
body.a40 .snb .sub_40 a:before,
body.a50 .snb .sub_50 a:before,
body.b10 .snb .sub_10 a:before,
body.b20 .snb .sub_20 a:before,
body.b30 .snb .sub_30 a:before,
body.c10 .snb .sub_10 a:before,
body.c20 .snb .sub_20 a:before,
body.c30 .snb .sub_30 a:before,
body.d10 .snb .sub_10 a:before,
body.d20 .snb .sub_20 a:before,
body.d30 .snb .sub_30 a:before,
body.d40 .snb .sub_40 a:before,
body.d50 .snb .sub_50 a:before,
body.e10 .snb .sub_10 a:before,
body.f10 .snb .sub_10 a:before,
body.f20 .snb .sub_20 a:before,
body.f30 .snb .sub_30 a:before,
body.f40 .snb .sub_40 a:before,
body.f50 .snb .sub_50 a:before,
body.f60 .snb .sub_60 a:before,
body.f70 .snb .sub_70 a:before,
body.f80 .snb .sub_80 a:before,
body.i10 .snb .sub_10 a:before,
body.i20 .snb .sub_20 a:before,
body.i30 .snb .sub_30 a:before,
body.i40 .snb .sub_40 a:before,
body.i50 .snb .sub_50 a:before {
  display: block;
  content: "";
  width: 10px;
  height: 3px;
  position: absolute;
  right: 16px;
  top: 22px;
  background: #fff;
}

body.a10 .gnb li.a00 .sub_10 a span,
body.a20 .gnb li.a00 .sub_20 a span,
body.a30 .gnb li.a00 .sub_30 a span,
body.a40 .gnb li.a00 .sub_40 a span,
body.a50 .gnb li.a00 .sub_50 a span,
body.b10 .gnb li.b00 .sub_10 a span,
body.b20 .gnb li.b00 .sub_20 a span,
body.b30 .gnb li.b00 .sub_30 a span,
body.c10 .gnb li.c00 .sub_10 a span,
body.c20 .gnb li.c00 .sub_20 a span,
body.c30 .gnb li.c00 .sub_30 a span,
body.d10 .gnb li.d00 .sub_10 a span,
body.d20 .gnb li.d00 .sub_20 a span,
body.d30 .gnb li.d00 .sub_30 a span,
body.d40 .gnb li.d00 .sub_40 a span,
body.d50 .gnb li.d00 .sub_50 a span,
body.e10 .gnb li.e00 .sub_10 a span,
body.f10 .gnb li.f00 .sub_10 a span,
body.f20 .gnb li.f00 .sub_20 a span,
body.f30 .gnb li.f00 .sub_30 a span,
body.f40 .gnb li.f00 .sub_40 a span,
body.f50 .gnb li.f00 .sub_50 a span,
body.f60 .gnb li.f00 .sub_60 a span,
body.f70 .gnb li.f00 .sub_70 a span,
body.f80 .gnb li.f00 .sub_80 a span,
body.i10 .gnb li.i00 .sub_10 a span,
body.i20 .gnb li.i00 .sub_20 a span,
body.i30 .gnb li.i00 .sub_30 a span,
body.i40 .gnb li.i00 .sub_40 a span,
body.i50 .gnb li.i00 .sub_50 a span,
body.i60 .gnb li.i00 .sub_60 a span,
body.i70 .gnb li.i00 .sub_70 a span,
body.i80 .gnb li.i00 .sub_80 a span {
  color: #01ab9d;
}

body.a10 .gnb li.a00 .sub_10 a span:before,
body.a20 .gnb li.a00 .sub_20 a span:before,
body.a30 .gnb li.a00 .sub_30 a span:before,
body.a40 .gnb li.a00 .sub_40 a span:before,
body.a50 .gnb li.a00 .sub_50 a span:before,
body.b10 .gnb li.b00 .sub_10 a span:before,
body.b20 .gnb li.b00 .sub_20 a span:before,
body.b30 .gnb li.b00 .sub_30 a span:before,
body.c10 .gnb li.c00 .sub_10 a span:before,
body.c20 .gnb li.c00 .sub_20 a span:before,
body.c30 .gnb li.c00 .sub_30 a span:before,
body.d10 .gnb li.d00 .sub_10 a span:before,
body.d20 .gnb li.d00 .sub_20 a span:before,
body.d30 .gnb li.d00 .sub_30 a span:before,
body.d40 .gnb li.d00 .sub_40 a span:before,
body.d50 .gnb li.d00 .sub_50 a span:before,
body.e10 .gnb li.e00 .sub_10 a span:before,
body.f10 .gnb li.f00 .sub_10 a span:before,
body.f20 .gnb li.f00 .sub_20 a span:before,
body.f30 .gnb li.f00 .sub_30 a span:before,
body.f40 .gnb li.f00 .sub_40 a span:before,
body.f50 .gnb li.f00 .sub_50 a span:before,
body.f60 .gnb li.f00 .sub_60 a span:before,
body.f70 .gnb li.f00 .sub_70 a span:before,
body.f80 .gnb li.f00 .sub_80 a span:before,
body.i10 .gnb li.i00 .sub_10 a span:before,
body.i20 .gnb li.i00 .sub_20 a span:before,
body.i30 .gnb li.i00 .sub_30 a span:before,
body.i40 .gnb li.i00 .sub_40 a span:before,
body.i50 .gnb li.i00 .sub_50 a span:before,
body.i60 .gnb li.i00 .sub_60 a span:before,
body.i70 .gnb li.i00 .sub_70 a span:before,
body.i80 .gnb li.i00 .sub_80 a span:before {
  width: 100%;
}

#gnb li.a00 .sub_50,
body.a00 nav.snb .sub_50 {
  display: none;
}

.main .footer_bottom {
  /* height: 300px; */
}

.footer_bottom {
  padding: 30px 0 0 280px;
  box-sizing: border-box;
  height: 200px;
}

.footer_bottom h2 {
  position: absolute;
  left: 0;
  top: 40px;
  opacity: 0.5;
}

.footer_bottom address {
  font-style: normal;
  color: #fff;
  opacity: 0.65;
  display: inline-block;
  font-weight: 300;
  padding: 5px 0;
}

.footer_bottom dl {
  display: inline-block;
  padding: 0 0 0 10px;
}

.footer_bottom dl dt,
.footer_bottom dl dd {
  display: inline-block;
  color: #fff;
  opacity: 0.65;
  font-weight: 300;
}

.footer_bottom dl dt:before {
  display: inline-block;
  content: "";
  width: 1px;
  height: 12px;
  margin: 0 15px 0 10px;
  background: rgba(255, 255, 255, 0.4);
}

.footer_bottom .copyright {
  opacity: 0.4;
  color: #fff;
  font-size: 14px;
  font-weight: 300;
  padding: 10px 0 20px 0;
  letter-spacing: 0.05em;
}

.bottom_nav {
  padding: 16px 0;
}

.bottom_nav a {
  color: #ddd;
  opacity: 0.8;
  transition: all 0.15s ease 0s;
  display: inline-block;
  padding: 5px 20px;
}

.bottom_nav a:hover {
  opacity: 1;
}

.bottom_nav a:first-child {
  padding-left: 0;
}

.section_wrap {
  padding: 50px 0;
  min-height: 1000px;
}

.snb {
  width: 200px;
  float: left;
}

.snb h2 {
  padding: 45px 0 45px 20px;
  color: #fff;
  font-size: 24px;
  background: linear-gradient(100.51deg, #01AB82 28.67%, #01AB9D 87.37%) no-repeat right 0;
  position: relative;
  border-radius: 10px;
}

.snb h2:after {
  display: block;
  content: "";
  width: 100%;
  height: 110px;
  background: url(/resources/homepage/yblib/img/h2_bg.png) no-repeat right 0;
  position: absolute;
  right: 0;
  top: 0;
}

.snb ul {
  margin: 8px 0;
  /* 
  a span{ display: block;padding: 16px;color: #777;font-weight: 700; background: #fff; @include transition_015; border-radius: 5px;}
  a:hover span{ background: #01AB82; color: #fff;} 
  */
}

.snb ul a {
  display: block;
  padding: 16px;
  color: #777;
  font-weight: 700;
  background: #fff;
  transition: all 0.15s ease 0s;
  border-radius: 5px;
  position: relative;
}

.snb ul a:hover {
  background: #f6f6f6;
  color: #000;
}

.snb ul .active>a {
  background: linear-gradient(100.51deg, #01AB82 28.67%, #01AB9D 87.37%);
  color: #fff;
}

.snb ul .active>a::before {
  display: block;
  content: "";
  width: 10px;
  height: 3px;
  position: absolute;
  right: 16px;
  top: 22px;
  background: #fff;
}

.lnb h2 {
  padding: 45px 0 45px 20px;
  color: #fff;
  font-size: 24px;
  background: linear-gradient(100.51deg, #01AB82 28.67%, #01AB9D 87.37%) no-repeat right 0;
  position: relative;
  border-radius: 10px;
}

.lnb h2:after {
  display: block;
  content: "";
  width: 100%;
  height: 110px;
  background: url(/resources/homepage/yblib/img/h2_bg.png) no-repeat right 0;
  position: absolute;
  right: 0;
  top: 0;
}

.lnb ul {
  margin: 8px 0;
  /* 
  a span{ display: block;padding: 16px;color: #777;font-weight: 700; background: #fff; @include transition_015; border-radius: 5px;}
  a:hover span{ background: #01AB82; color: #fff;} 
  */
}

.lnb ul a {
  display: block;
  padding: 16px;
  color: #777;
  font-weight: 700;
  background: #fff;
  transition: all 0.15s ease 0s;
  border-radius: 5px;
  position: relative;
}

.lnb ul a:hover {
  background: #f6f6f6;
  color: #000;
}

.lnb ul .active>a {
  background: linear-gradient(100.51deg, #01AB82 28.67%, #01AB9D 87.37%);
  color: #fff;
}

.lnb ul .active>a::before {
  display: block;
  content: "";
  width: 10px;
  height: 3px;
  position: absolute;
  right: 16px;
  top: 22px;
  background: #fff;
}

.section::after {
  display: block;
  content: '';
  clear: both;
}

section.section {
  float: right;
  width: 960px;
}

.section_header {
  padding: 42px 0;
  border-bottom: solid 1px #ddd;
}

.section_header:after {
  display: block;
  content: "";
  clear: both;
}

.section_header h3 {
  font-size: 31px;
  color: #333;
  font-weight: 900;
  float: left;
}

.section_header h3:before {
  display: inline-block;
  content: "";
  width: 16px;
  height: 16px;
  border-radius: 50%;
  margin: 0 10px 0 0;
  vertical-align: middle;
  background: #01AB9D;
}

.section_header ol {
  float: right;
  padding-top: 8px;
}

.section_header ol li {
  display: inline-block;
  padding-left: 18px;
  height: 18px;
  vertical-align: middle;
  color: #777;
  background: no-repeat 0 center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M13.1714 12.0007L8.22168 7.05093L9.63589 5.63672L15.9999 12.0007L9.63589 18.3646L8.22168 16.9504L13.1714 12.0007Z' fill='rgba(173,184,194,1)'%3E%3C/path%3E%3C/svg%3E");
}

.section_header ol .page_loc_home {
  font-size: 0;
  background: no-repeat 0 center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M19 21.0001H5C4.44772 21.0001 4 20.5524 4 20.0001V11.0001L1 11.0001L11.3273 1.61162C11.7087 1.26488 12.2913 1.26488 12.6727 1.61162L23 11.0001L20 11.0001V20.0001C20 20.5524 19.5523 21.0001 19 21.0001ZM13 19.0001H18V9.15757L12 3.70302L6 9.15757V19.0001H11V13.0001H13V19.0001Z' fill='rgba(0,0,0,.4)'%3E%3C/path%3E%3C/svg%3E");
}

/* 자료검색 */
.search_condition_wrap:after {
  display: block;
  content: "";
  clear: both;
}

.h4+.search_condition {
  margin: 0;
}

.d00 .search_condition {
  text-align: center;
}

.search_condition {
  padding: 16px 20px;
  margin: 24px 0 0 0;
  border: #ddd solid 1px;
  background: #f9f9f9;
  border-radius: 6px;
}

.search_condition+.table_wrap {
  margin-top: 16px;
}

input[type=radio] {
  vertical-align: middle;
}

.search_condition input[type=text],
.search_condition input[type=password],
.search_condition select {
  height: 36px;
  vertical-align: middle;
}

input[type=text].ui-calendar {
  background: #fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z' fill='rgba(117,117,117,1)'%3E%3C/path%3E%3C/svg%3E") no-repeat right 10% center;
}

table.class_table input[type=text].ui-calendar {
  width: 206px;
}

.search_condition .btn,
.btn {
  height: 36px;
  line-height: 1.8em;
  padding-top: 4px;
  text-align: center;
  min-width: 76px;
  border-color: #01ab9d;
  color: #333;
  margin: 2px 0;
  vertical-align: middle;
}

.btn.findPostCode {
  background-color: #f9f9f9;
  color: #454545;
  border: 1px solid #bcbcbc;
  height: 40px;
  padding-top: 6px;
  font-size: 16px;
  font-weight: 500;
}

.btn.findPostCode:hover {
  background-color: #dbdbdb;
  border-color: #999;
  color: #454545;
}

.search_condition .btn.pri {
  background-color: #444;
  color: #fff;
  border-color: #333;
  height: 36px;
  line-height: 1.8em;
  padding-top: 4px;
}

.btn-group a.btn {
  height: 40px;
  padding-top: 6px;
}

.search_condition .btn.pri:hover {
  background-color: #000;
  border-color: #000;
}

.search_condition .btn_wrap {
  float: right;
}

.search_condition input[type=checkbox],
.search_condition input[type=radio],
.search_condition .checkbox_wrap,
.search_condition .radio_wrap {
  vertical-align: middle;
}

.btn_area .btn {
  padding: 0 10px;
  height: 36px;
  line-height: 1.8em;
  padding-top: 4px;
  min-width: 80px;
  margin: 0;
}

.condition_div {
  display: inline-block;
  margin-right: 16px;
}

.condition_div strong {
  font-weight: 600;
  color: #222;
  padding-right: 6px;
}

.serach_range_1 {
  padding: 12px 0 16px 0;
}

.serach_range_1 strong {
  vertical-align: middle;
  margin-right: 10px;
  color: #252525;
  font-size: 17px;
}

.serach_range_1:after {
  display: block;
  content: "";
  clear: both;
}

.serach_range_1+.serach_range_2 {
  border-top: dotted #ddd 1px;
}

.serach_range_2 {
  padding: 10px 0;
}

.serach_range_2::after {
  display: block;
  content: "";
  clear: both;
}

.serach_range_2 .float_l {
  display: block;
  width: calc(100% - 132px);
}

.serach_range_2 select {
  width: 120px;
}

.serach_range_2 input[type=text] {
  /* width: calc(100% - 140px);*/
  width: 100%;
}

.search_btn_area {
  text-align: center;
  border-top: solid 1px #ddd;
  padding-top: 12px;
}

.search_result_wrap {
  padding: 16px 0;
}

.search_result_wrap:after {
  display: block;
  content: "";
  clear: both;
}

.search_result_wrap h4 {
  border-bottom: solid 1px #ddd;
}

.search_result_wrap h4 span {
  float: right;
  font-size: 18px;
  color: #777;
  font-weight: 700;
}

.search_result_wrap h4::after {
  display: block;
  content: "";
  clear: both;
}

.search_result_head {
  padding: 20px 0;
}

.search_result_head:after {
  display: block;
  content: "";
  clear: both;
}

.search_result_head .select_check {
  display: inline-block;
  font-weight: 700;
  margin-right: 16px;
}

.search_result_head input[type=checkbox] {
  margin: 0 4px 0 0;
  vertical-align: middle;
}

.search_result_head .btn_view_type {
  float: right;
  text-align: right;
  font-size: 0;
  border-radius: 5px;
  margin-bottom: 0px;
}

.search_result_head .btn_view_type button {
  font-size: 0;
  width: 35px;
  height: 35px;
  background: #fff no-repeat center center;
  border: solid 1px #ddd;
  margin-right: -1px;
  transition: all 0.15s ease 0s;
}

.search_result_head .btn_view_type button:first-child {
  border-radius: 5px 0 0 5px;
}

.search_result_head .btn_view_type button:last-child {
  border-radius: 0 5px 5px 0;
}

.search_result_head .btn_view_type .btn_view_thum {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='17' height='17'%3E%3Cpath d='M3 3H11V11H3V3ZM3 13H11V21H3V13ZM13 3H21V11H13V3ZM13 13H21V21H13V13Z' fill='rgba(0,0,0,0.3)'%3E%3C/path%3E%3C/svg%3E");
}

.search_result_head .btn_view_type .btn_view_thum:hover,
.search_result_head .btn_view_type .btn_view_thum.on {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='17' height='17'%3E%3Cpath d='M3 3H11V11H3V3ZM3 13H11V21H3V13ZM13 3H21V11H13V3ZM13 13H21V21H13V13Z' fill='rgba(12,172,172,1)'%3E%3C/path%3E%3C/svg%3E");
}

.search_result_head .btn_view_type .btn_view_list {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M3 4H21V6H3V4ZM3 11H21V13H3V11ZM3 18H21V20H3V18Z' fill='rgba(0,0,0,0.3)'%3E%3C/path%3E%3C/svg%3E");
}

.search_result_head .btn_view_type .btn_view_list:hover,
.search_result_head .btn_view_type .btn_view_list.on {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M3 4H21V6H3V4ZM3 11H21V13H3V11ZM3 18H21V20H3V18Z' fill='rgba(12,172,172,1)'%3E%3C/path%3E%3C/svg%3E");
}

.search_result>article {
  border: solid 1px #ddd;
  border-radius: 4px;
  padding: 24px;
  box-sizing: border-box;
  margin-bottom: 10px;
  position: relative;
}

.search_result>article .bookCover {
  width: 160px;
  height: 220px;
  background: #f9f9f9 no-repeat center top;
  background-size: cover;
  border: 1px solid #e1e1e0;
  border-radius: 5px;
}

.search_result>article .loan_status_x,
.search_result>article .loan_status_o {
  display: inline-block;
  padding: 16px 0;
  color: #017edf;
  font-weight: 700;
}

.search_result>article .loan_status_x:before,
.search_result>article .loan_status_o:before {
  display: inline-block;
  content: "";
  vertical-align: middle;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M10.0007 15.1709L19.1931 5.97852L20.6073 7.39273L10.0007 17.9993L3.63672 11.6354L5.05093 10.2212L10.0007 15.1709Z' fill='rgba(1,126,223,1)'%3E%3C/path%3E%3C/svg%3E") no-repeat 0 center;
}

.search_result>article .loan_status_x {
  color: #e92f4d;
}

.search_result>article .loan_status_x:before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M12.0007 10.5865L16.9504 5.63672L18.3646 7.05093L13.4149 12.0007L18.3646 16.9504L16.9504 18.3646L12.0007 13.4149L7.05093 18.3646L5.63672 16.9504L10.5865 12.0007L5.63672 7.05093L7.05093 5.63672L12.0007 10.5865Z' fill='rgba(233,47,77,1)'%3E%3C/path%3E%3C/svg%3E");
}

.search_result>article h5 {
  color: #333;
  font-size: 20px;
  padding: 8px 0 8px;
  overflow: visible;
  white-space: initial;
}

.search_result>article h5 a {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
}

.search_result dl span {
  font-size: 0;
}

.search_result dl>span {
  display: block;
  padding: 6px 0;
}

.search_result dl>span::after {
  display: block;
  content: "";
  clear: both;
}

.search_result dl>span:first-child {
  padding: 10px 0;
  text-align: left;
}

.search_result dl dt,
.search_result dl dd {
  display: inline-block;
  float: left;
  color: #666;
  font-weight: 700;
}

.search_result dl dt {
  font-size: 15px;
  color: #777;
  font-weight: 500;
}

.search_result dl dt.b_writer,
.search_result dl dt.b_publisher,
.search_result dl dt.b_pub_yy {
  font-size: 0;
}

.search_result dl dd.b_writer,
.search_result dl dd.b_publisher,
.search_result dl dd.b_pub_yy {
  font-weight: 700;
}

.search_result dl dd.b_publisher,
.search_result dl dd.b_pub_yy {
  padding-left: 12px;
  background: linear-gradient(0deg, #fff 5%, #ccc 6%, #ccc 95%, #fff 96%) no-repeat 2px center;
  background-size: 1px;
}

.search_result .btn_area {
  padding: 0;
}

.view_thum .search_result {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}

.view_thum .btn_view_type .btn_view_thum {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='17' height='17'%3E%3Cpath d='M3 3H11V11H3V3ZM3 13H11V21H3V13ZM13 3H21V11H13V3ZM13 13H21V21H13V13Z' fill='rgba(12,172,172,1)'%3E%3C/path%3E%3C/svg%3E");
}

.view_thum .search_result>article {
  height: auto;
  min-height: 580px;
  width: 49%;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
}

.view_thum .search_result>article .loan_status_x,
.view_thum .search_result>article .loan_status_o {
  display: block;
}

.view_thum .search_result>article label {
  position: absolute;
  left: 24px;
  top: 24px;
}

.view_thum .search_result>article .bookCover {
  margin: 0 auto 20px auto;
  box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.15);
  position: relative;
}

.view_thum .search_result>article .bookCover::before {
  display: block;
  content: "";
  width: 1px;
  height: 100%;
  background: rgba(0, 0, 0, 0.15);
  position: absolute;
  left: 3%;
  top: 0;
}

.view_thum .search_result>article:nth-child(odd) {
  margin-left: 0;
}

.view_thum .search_result>article h5 {
  padding: 0 0 10px 0;
  width: 100%;
}

.view_thum .search_result dl dt {
  padding-left: 0px;
}

.view_thum .search_result dl>span:not(:first-child)>dt,
.view_thum .search_result dl>span>span:first-child dd {
  padding-left: 0;
}

.view_thum .search_result dl>span:not(:first-child)>dt {
  width: 65px;
  text-align: left;
}

.view_thum .search_result dl dd {
  padding-right: 10px;
}

.view_thum .search_result dl span:first-child span {
  display: inline-block;
}

.view_thum .search_result .btn_area {
  width: 100%;
  margin-top: auto;
  text-align: center;
  position: initial;
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  gap: 4px 0;
}

.view_thum .search_result .btn_area a:nth-child(1),
.view_thum .search_result .btn_area a:nth-child(2) {
  width: 49.5%;
}

.view_thum .search_result .btn_area a:nth-child(3) {
  width: 100%;
}

.view_list .btn_view_type .btn_view_list {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M3 4H21V6H3V4ZM3 11H21V13H3V11ZM3 18H21V20H3V18Z' fill='rgba(12,172,172,1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NR .view_list .btn_view_type .btn_view_list {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M3 4H21V6H3V4ZM3 11H21V13H3V11ZM3 18H21V20H3V18Z' fill='rgba(38,52,178,1)'%3E%3C/path%3E%3C/svg%3E");
}

.view_list .search_result>article {
  padding-left: 216px;
  padding-top: 20px;
  min-height: 270px;
}

.view_list .search_result.result_chk>article {
  margin-left: 30px;
}

.view_list .search_result>article label {
  position: absolute;
  left: -35px;
  top: -4px;
}

.view_list .search_result>article .bookCover {
  position: absolute;
  left: 26px;
  top: 24px;
  box-shadow: 4px 4px 0 0 rgba(0, 0, 0, 0.15);
}

.view_list .search_result>article .bookCover::before {
  display: block;
  content: "";
  width: 1px;
  height: 100%;
  background: rgba(0, 0, 0, 0.15);
  position: absolute;
  left: 3%;
  top: 0;
}

.view_list .search_result dl span :first-child,
.view_list .search_result dl .b_writer {
  padding-left: 0;
}

.view_list .search_result dl dt {
  padding-left: 12px;
  width: 60px;
}

.view_list .search_result dl dd {
  padding-left: 16px;
  padding-right: 12px;
}

.view_list .search_result dl dt.b_writer,
.view_list .search_result dl dt.b_publisher,
.view_list .search_result dl dt.b_pub_yy {
  width: 0;
}

.view_list .btn_area {
  margin-left: 30px;
}

.btn.btn_reserve1,
.btn.btn_reserve2 {
  color: #fff;
  background: #01AB9D;
  border: 0 none;
  height: 36px;
  /*padding: 0 24px;*/
}

.btn2.btn_reserve1,
.btn2.btn_reserve2 {
  color: #fff;
  background: #01AB9D;
  border: 0 none;
  height: 36px;
  line-height: 1.8em;
  padding-top: 4px;
  padding: 4px 24px 0;
}

.btn.btn_reserve2 {
  background: #FF7A7B;
}

.btn2.btn_reserve2 {
  background: #FF7A7B;
}

.btn.btn_reserve1[disabled],
.btn.btn_reserve2[disabled] {
  background-color: #757575;
}

.btn.btn_reserve1.disabled,
.btn.btn_reserve2.disabled {
  background-color: #757575;
  color: #eeeeee;
}

.btn2.btn_reserve1.disabled,
.btn2.btn_reserve2.disabled {
  background-color: #757575;
  color: #eeeeee;
}

.btn.btn_add_basket {
  padding-left: 42px;
  background-position: 16px center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M20 22H4C3.44772 22 3 21.5523 3 21V3C3 2.44772 3.44772 2 4 2H20C20.5523 2 21 2.44772 21 3V21C21 21.5523 20.5523 22 20 22ZM7 4H5V20H19V4H14V13L10.5 11L7 13V4Z' fill='rgba(12,172,172,1)'%3E%3C/path%3E%3C/svg%3E");
}

.btn.btn_basket_list {
  padding-left: 42px;
  background-position: 16px center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M2 3.9934C2 3.44476 2.45531 3 2.9918 3H21.0082C21.556 3 22 3.44495 22 3.9934V20.0066C22 20.5552 21.5447 21 21.0082 21H2.9918C2.44405 21 2 20.5551 2 20.0066V3.9934ZM11 5H4V19H11V5ZM13 5V19H20V5H13ZM14 7H19V9H14V7ZM14 10H19V12H14V10Z' fill='rgba(12,172,172,1)'%3E%3C/path%3E%3C/svg%3E");
}

.btn.btn_xls_dn::before {
  display: inline-block;
  content: "";
  width: 18px;
  height: 18px;
  background-position: center center;
  vertical-align: middle;
  background-repeat: no-repeat;
  margin-right: 5px;
}

body.lib_YB .btn.btn_xls_dn::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M2.85858 2.87756L15.4293 1.08175C15.7027 1.0427 15.9559 1.23265 15.995 1.50601C15.9983 1.52943 16 1.55306 16 1.57672V22.4237C16 22.6999 15.7761 22.9237 15.5 22.9237C15.4763 22.9237 15.4527 22.922 15.4293 22.9187L2.85858 21.1229C2.36593 21.0525 2 20.6306 2 20.1329V3.86751C2 3.36986 2.36593 2.94794 2.85858 2.87756ZM4 4.73481V19.2656L14 20.6942V3.30624L4 4.73481ZM17 19.0002H20V5.00022H17V3.00022H21C21.5523 3.00022 22 3.44793 22 4.00022V20.0002C22 20.5525 21.5523 21.0002 21 21.0002H17V19.0002ZM10.2 12.0002L13 16.0002H10.6L9 13.7145L7.39999 16.0002H5L7.8 12.0002L5 8.00022H7.39999L9 10.2859L10.6 8.00022H13L10.2 12.0002Z' fill='rgba(12,172,172,1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_SS .btn.btn_xls_dn::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M2.85858 2.87756L15.4293 1.08175C15.7027 1.0427 15.9559 1.23265 15.995 1.50601C15.9983 1.52943 16 1.55306 16 1.57672V22.4237C16 22.6999 15.7761 22.9237 15.5 22.9237C15.4763 22.9237 15.4527 22.922 15.4293 22.9187L2.85858 21.1229C2.36593 21.0525 2 20.6306 2 20.1329V3.86751C2 3.36986 2.36593 2.94794 2.85858 2.87756ZM4 4.73481V19.2656L14 20.6942V3.30624L4 4.73481ZM17 19.0002H20V5.00022H17V3.00022H21C21.5523 3.00022 22 3.44793 22 4.00022V20.0002C22 20.5525 21.5523 21.0002 21 21.0002H17V19.0002ZM10.2 12.0002L13 16.0002H10.6L9 13.7145L7.39999 16.0002H5L7.8 12.0002L5 8.00022H7.39999L9 10.2859L10.6 8.00022H13L10.2 12.0002Z' fill='rgba(55, 164, 233, 1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NA .btn.btn_xls_dn::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M2.85858 2.87756L15.4293 1.08175C15.7027 1.0427 15.9559 1.23265 15.995 1.50601C15.9983 1.52943 16 1.55306 16 1.57672V22.4237C16 22.6999 15.7761 22.9237 15.5 22.9237C15.4763 22.9237 15.4527 22.922 15.4293 22.9187L2.85858 21.1229C2.36593 21.0525 2 20.6306 2 20.1329V3.86751C2 3.36986 2.36593 2.94794 2.85858 2.87756ZM4 4.73481V19.2656L14 20.6942V3.30624L4 4.73481ZM17 19.0002H20V5.00022H17V3.00022H21C21.5523 3.00022 22 3.44793 22 4.00022V20.0002C22 20.5525 21.5523 21.0002 21 21.0002H17V19.0002ZM10.2 12.0002L13 16.0002H10.6L9 13.7145L7.39999 16.0002H5L7.8 12.0002L5 8.00022H7.39999L9 10.2859L10.6 8.00022H13L10.2 12.0002Z' fill='rgb(159, 0, 186, 1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NE .btn.btn_xls_dn::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M2.85858 2.87756L15.4293 1.08175C15.7027 1.0427 15.9559 1.23265 15.995 1.50601C15.9983 1.52943 16 1.55306 16 1.57672V22.4237C16 22.6999 15.7761 22.9237 15.5 22.9237C15.4763 22.9237 15.4527 22.922 15.4293 22.9187L2.85858 21.1229C2.36593 21.0525 2 20.6306 2 20.1329V3.86751C2 3.36986 2.36593 2.94794 2.85858 2.87756ZM4 4.73481V19.2656L14 20.6942V3.30624L4 4.73481ZM17 19.0002H20V5.00022H17V3.00022H21C21.5523 3.00022 22 3.44793 22 4.00022V20.0002C22 20.5525 21.5523 21.0002 21 21.0002H17V19.0002ZM10.2 12.0002L13 16.0002H10.6L9 13.7145L7.39999 16.0002H5L7.8 12.0002L5 8.00022H7.39999L9 10.2859L10.6 8.00022H13L10.2 12.0002Z' fill='rgb(255, 145, 20, 1)'%3E%3C/path%3E%3C/svg%3E");
}

.btn.btn_search2 {
  padding: 4px 10px 0;
  background-image: none;
}

.btn.btn_search2::before {
  display: inline-block;
  content: '';
  width: 18px;
  height: 18px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
  vertical-align: -4px;
  margin-right: 5px;
}

.btn.btn_multi_lang {
  height: 40px;
  line-height: 1.8em;
  padding: 5px 10px 0;
}

.btn.btn_multi_lang::before {
  display: inline-block;
  content: "";
  width: 20px;
  height: 20px;
  background-position: center center;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-right: 8px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M4 5V19H20V5H4ZM3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM6 7H8V9H6V7ZM6 11H8V13H6V11ZM6 15H18V17H6V15ZM11 11H13V13H11V11ZM11 7H13V9H11V7ZM16 7H18V9H16V7ZM16 11H18V13H16V11Z' fill='rgba(1,171,157,1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_SS .btn.btn_multi_lang::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M4 5V19H20V5H4ZM3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM6 7H8V9H6V7ZM6 11H8V13H6V11ZM6 15H18V17H6V15ZM11 11H13V13H11V11ZM11 7H13V9H11V7ZM16 7H18V9H16V7ZM16 11H18V13H16V11Z' fill='rgba(55,164,233,1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NA .btn.btn_multi_lang::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M4 5V19H20V5H4ZM3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM6 7H8V9H6V7ZM6 11H8V13H6V11ZM6 15H18V17H6V15ZM11 11H13V13H11V11ZM11 7H13V9H11V7ZM16 7H18V9H16V7ZM16 11H18V13H16V11Z' fill='rgba(159,0,186,1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NE .btn.btn_multi_lang::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M4 5V19H20V5H4ZM3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM6 7H8V9H6V7ZM6 11H8V13H6V11ZM6 15H18V17H6V15ZM11 11H13V13H11V11ZM11 7H13V9H11V7ZM16 7H18V9H16V7ZM16 11H18V13H16V11Z' fill='rgba(255,145,20,1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_CH .btn.btn_multi_lang::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M4 5V19H20V5H4ZM3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM6 7H8V9H6V7ZM6 11H8V13H6V11ZM6 15H18V17H6V15ZM11 11H13V13H11V11ZM11 7H13V9H11V7ZM16 7H18V9H16V7ZM16 11H18V13H16V11Z' fill='rgba(31, 88, 167, 1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NR .btn.btn_multi_lang::before {
  display: inline-block;
  content: "";
  width: 20px;
  height: 20px;
  background-position: center center;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-right: 8px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M4 5V19H20V5H4ZM3 3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3ZM6 7H8V9H6V7ZM6 11H8V13H6V11ZM6 15H18V17H6V15ZM11 11H13V13H11V11ZM11 7H13V9H11V7ZM16 7H18V9H16V7ZM16 11H18V13H16V11Z' fill='rgba(38,52,178,1)'%3E%3C/path%3E%3C/svg%3E");
}

.btn.btn_reload {
  font-size: 0;
  min-width: inherit;
  width: 40px;
  background-position: center center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M18.5374 19.5674C16.7844 21.0831 14.4993 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 14.1361 21.3302 16.1158 20.1892 17.7406L17 12H20C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C14.1502 20 16.1022 19.1517 17.5398 17.7716L18.5374 19.5674Z' fill='rgba(1,171,157,1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NR .btn.btn_reload {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M18.5374 19.5674C16.7844 21.0831 14.4993 22 12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 14.1361 21.3302 16.1158 20.1892 17.7406L17 12H20C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20C14.1502 20 16.1022 19.1517 17.5398 17.7716L18.5374 19.5674Z' fill='rgba(38,52,178,1)'%3E%3C/path%3E%3C/svg%3E")
}

.book_info_detail_1 {
  border: solid 1px #ebebeb;
  border-radius: 5px;
  padding: 32px 32px 32px 300px;
  position: relative;
  min-height: 300px;
  margin-bottom: 24px;
}

.book_info_detail_1 .book_cover_img {
  width: 220px;
  height: 305px;
  position: absolute;
  left: 32px;
  top: 32px;
  background: no-repeat center center;
  background-size: cover;
  border: solid 1px rgba(0, 0, 0, 0.1);
  border-radius: 5px;
  box-shadow: 4px 4px 0px 0 rgba(0, 0, 0, 0.2);
}

.book_info_detail_1 .book_cover_img::after {
  display: block;
  content: '';
  position: absolute;
  left: 4%;
  top: 0;
  width: 1px;
  height: 100%;
  background: rgba(0, 0, 0, 0.15);
}

.book_info_detail_1 dl {
  padding: 16px 0;
}

.book_info_detail_1 dl:after {
  display: block;
  content: "";
  clear: both;
}

.book_info_detail_1 dl dt,
.book_info_detail_1 dl dd {
  float: left;
  width: 80px;
  padding: 6px 0;
}

.book_info_detail_1 dl dt {
  color: #999;
  font-weight: 700;
}

.book_info_detail_1 dl dd {
  width: calc(100% - 80px);
  color: #333;
  font-size: 17px;
}

.book_info_detail_1 dl dd.b_writer {
  font-weight: 700;
  color: #000;
}

.book_info_detail_1 .h4 {
  padding-top: 0;
  color: #252525;
  font-size: 26px;
  font-weight: 600;
  line-height: 1.2em;
}

.book_info_detail_1 .btn.btn_marcview {
  border-color: #01ab9d;
  color: #01ab9d;
  padding: 0 24px;
  line-height: 1;
  font-size: 15px;
  height: 30px;
}

.call_number div+div {
  padding-top: 4px;
}

.book_status_o {
  color: #01ab9d;
}

.book_status_x {
  color: #e92f4d;
}

td .book_status_o,
td .book_status_x {
  display: block;
}

td.booking button,
td.booking button.btn {
  min-width: 160px;
  display: block;
  margin: 0 auto;
  padding: 0;
}

td.booking a,
td.booking a.btn {
  min-width: 160px;
  display: block;
  margin: 4px auto;
  padding: 3px 0 0;
  line-height: 1.8em;
}

td.booking button.btn+button.btn {
  margin-top: 4px;
}

.table+.btn_area {
  margin-top: 30px;
}

/*  베스트 대출자료 */
.select_period {
  vertical-align: middle;
  font-size: 0;
}

.select_period button {
  height: 40px;
  padding: 0 16px;
  background-color: #fff;
  border: solid 1px rgba(0, 0, 0, 0.14);
  margin-right: -1px;
  transition: all 0.15s ease 0s;
}

.select_period button:hover {
  background-color: #ededed;
}

.select_period button:first-child {
  border-radius: 5px 0 0 5px;
}

.select_period button:last-child {
  border-radius: 0 5px 5px 0;
}

.select_period button.on {
  background-color: #01ab9d;
  color: #fff;
  padding-left: 8px;
}

.select_period button.on::before {
  display: inline-block;
  content: "";
  width: 20px;
  height: 20px;
  margin-right: 4px;
  vertical-align: middle;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M10.0007 15.1709L19.1931 5.97852L20.6073 7.39273L10.0007 17.9993L3.63672 11.6354L5.05093 10.2212L10.0007 15.1709Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E") no-repeat center center;
}

/* 희망도서 신청 */
.want_book_header {
  border-radius: 5px;
  border: solid 1pX #dbdbdb;
  background: #f9f9f9 url(/resources/homepage/yblib/img/want_book_8.png) no-repeat 50px center;
  padding: 40px 50px 40px 250px;
  line-height: 1.6em;
  color: #333;
  font-weight: 700;
  font-size: 18px;
  position: relative;
}

.want_book_header p {
  line-height: 1.3em;
  font-size: 18px;
  padding: 0px 0 8px;
}

.want_book_header p:not(:first-child) {
  padding: 0;
}

.want_book_header strong {
  color: #01ab9d;
}

.want_book_header .btn.pri {
  font-size: 17px;
  /*position: absolute; right: 50px; top: 50%; transform: translateY(-50%);*/
  width: 100%;
  height: 40px;
  line-height: 40px;
  padding-top: 6px;
  font-size: 17px;
  padding: 0px 20px;
  margin-top: 20px;
}

.want_book_header .rgt_btn::before {
  width: 22px;
  height: 22px;
  background-size: 22px 22px;
  margin-right: 8px;
}

.want_book_00 {
  border-radius: 5px;
  border: solid 1pX #dbdbdb;
  padding: 16px 40px;
  margin: 24px 0;
}

.want_book_00 article {
  padding: 24px 0 24px 140px;
  position: relative;
}

.want_book_00 article:before {
  display: inline-block;
  content: "";
  width: 100px;
  height: 100px;
  border-radius: 50%;
  border: solid 1px #e7e7e7;
  background: #f8f8f8 no-repeat center center;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.want_book_00 article.want_book_1:before {
  background-image: url(/resources/homepage/yblib/img/want_book_1.png);
}

.want_book_00 article.want_book_2:before {
  background-image: url(/resources/homepage/yblib/img/want_book_2.png);
}

.want_book_00 article.want_book_3:before {
  background-image: url(/resources/homepage/yblib/img/want_book_3.png);
}

.want_book_00 article.want_book_4:before {
  background-image: url(/resources/homepage/yblib/img/want_book_4.png);
}

.want_book_00 article.want_book_5:before {
  background-image: url(/resources/homepage/yblib/img/want_book_5.png);
}

.want_book_00 article.want_book_6:before {
  background-image: url(/resources/homepage/yblib/img/want_book_6.png);
}

.want_book_00 article.want_book_7:before {
  background-image: url(/resources/homepage/yblib/img/want_book_7.png);
}

.want_book_00 article+article {
  border-top: solid 1px #ddd;
}

.want_book_00 ol.loan_process {
  margin-top: 18px;
}

/* .want_book_00 ol.loan_process li {padding: 0 10px; border: 0 none;}
.want_book_00 ol.loan_process li::after {width: 18px; height: 18px; background-color: transparent; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M13.1714 12.0007L8.22168 7.05093L9.63589 5.63672L15.9999 12.0007L9.63589 18.3646L8.22168 16.9504L13.1714 12.0007Z' fill='rgba(117,117,117,1)'%3E%3C/path%3E%3C/svg%3E");} */
.want_book_00 h4 {
  font-size: 21px;
  padding: 16px 0 8px 0;
  color: #333;
  font-weight: 900;
}

.want_book_00 ul {
  padding: 10px 0;
}

.want_book_00 li {
  padding: 5px 0;
  font-size: 17px;
  font-weight: 700;
}

.want_book_00 li:before {
  display: inline-block;
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #333;
  margin: 0 6px 0 4px;
  vertical-align: middle;
}

.want_book_20 {
  padding: 20px 0;
}

dl.dl_table {
  border-radius: 5px;
  border: solid 1pX #dbdbdb;
  margin: 16px 0;
  overflow: hidden;
}

dl.dl_table dt {
  background: #f1f1f1;
  color: #333;
  font-weight: 700;
  text-align: center;
}

dl.dl_table dt,
dl.dl_table dd {
  float: left;
  width: 100px;
  padding: 20px 20px 0 20px;
  height: 36px;
  border-top: #ddd solid 1px;
}

dl.dl_table dt:first-of-type,
dl.dl_table dd:first-of-type {
  border: 0 none;
}

dl.dl_table dd {
  width: calc(100% - 180px);
}

.want_book_30 {
  padding: 20px 0;
}

.want_book_30 ul {
  margin: 16px 0;
  border: solid 1px #dbdbdb;
  border-radius: 5px;
}

.want_book_30 li {
  padding: 16px 0 16px 40px;
  font-weight: 700;
  border-top: solid 1px #dbdbdb;
  line-height: 1.5em;
  text-indent: -14px;
}

.want_book_30 li:first-child {
  border: 0 none;
}

.want_book_30 li:before {
  display: inline-block;
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background-color: #333;
  margin: 0 6px 0 4px;
  vertical-align: middle;
}

.btn-wrap {
  text-align: center;
  padding: 20px 0 0;
}

/* 이용약관 */
.policy_wrap {
  line-height: 1.3em;
}

.policy_wrap h2 {
  font-size: 24px;
  color: #333;
}

.policy_wrap h3 {
  font-size: 24px;
  padding: 54px 0 8px 0;
  font-weight: 500;
  color: #000;
}

.policy_wrap h4 {
  font-size: 18px;
  padding: 20px 0 8px 0;
  color: #000;
  font-weight: 900;
}

.policy_wrap p {
  line-height: 1.4em;
  padding: 4px 0 8px 0;
}

.policy_wrap li {
  font-weight: 500;
  line-height: 1.3em;
  padding: 3px 0 3px 22px;
  text-indent: -18px;
}

.policy_wrap li ul {
  padding: 8px 0 16px 0;
}

.policy_wrap li li {
  font-size: 15px;
}

/* 개인정보처리방침 */
body.i20 .policy_wrap p {
  margin: 4px 0 16px 0;
  padding: 20px 24px;
  border: solid 1px #ddd;
  background-color: #f9f9f9;
}

body.i20 .policy_wrap .line {
  display: block;
  padding-top: 10px;
}

.dec_list {
  padding-left: 18px;
}

.dec_list>li {
  list-style: decimal;
  text-indent: 0;
  padding: 0;
  margin: 6px 0;
}

.con02>li {
  padding-left: 12px;
  position: relative;
  text-indent: 0;
}

.con02>li:before {
  display: block;
  content: "";
  background: #666;
  width: 4px;
  height: 4px;
  position: absolute;
  left: 0;
  top: 10px;
}

.con02 .con04>li:before {
  width: 5px;
  height: 1px;
  border-radius: 0;
}

.con04>li {
  padding-left: 12px;
  position: relative;
  text-indent: 0;
}

.con04>li:before {
  display: block;
  content: "";
  background: #999;
  width: 4px;
  height: 4px;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 10px;
}

.cctv_policy_wrap {
  font-size: 18px;
  font-weight: 500;
  line-height: 1.6;
  text-align: center;
}

.email_policy_wrap {
  background: url(/resources/homepage/yblib/img/bg_email_policy.jpg) no-repeat center 0;
  text-align: center;
  padding-top: 440px;
  font-size: 18px;
  font-weight: 500;
  line-height: 1.6;
}

/* sitemap */
.sitemap_wrap>ul {
  display: flex;
  flex-flow: row wrap;
}

.sitemap_wrap>ul:after {
  display: block;
  content: "";
  clear: both;
}

.sitemap_wrap>ul>li {
  width: 23.65%;
  margin: 0 1.5% 16px 0;
  float: left;
  border: solid 1px rgba(0, 0, 0, 0.15);
  height: 100%;
  border-radius: 5px;
}

.sitemap_wrap>ul>li:nth-child(4n) {
  margin-right: 0;
}

.sitemap_wrap>ul>li>a {
  background-color: #01ab9d;
  color: #fff;
  border-radius: 5px 5px 0 0;
}

.sitemap_wrap>ul a {
  display: block;
  text-align: center;
  font-size: 18px;
  padding: 20px 0;
}

.sitemap_wrap>ul ul li>a {
  font-size: 16px;
  padding: 12px 0;
  font-weight: 500;
  border-top: 0 none;
  border-bottom: dotted 1px #ddd;
  transition: all 0.15s ease 0s;
}

.sitemap_wrap>ul ul li:first-child a {
  border-top: 0 none;
}

.sitemap_wrap>ul>ul>li:last-child a,
.sitemap_wrap ul.SubMenu>li:last-child a {
  border-bottom: 0 none;
}

.sitemap_wrap>ul ul li a:hover {
  background-color: #f5fdfd;
}

/*
.sitemap_wrap > ul ul li:first-child a {
  border-top: solid 1px #ddd;
}
*/
/* 내 서재 */
.my_info {
  position: relative;
  padding: 50px 40px 40px 220px;
  border: solid 2px #333;
  border-radius: 5px;
  margin-bottom: 24px;
}

.my_info p {
  font-size: 18px;
  font-weight: 700;
  padding: 6px 0;
}

.my_info dl {
  padding: 30px 0 0 0;
}

.my_info dl:after {
  display: block;
  content: "";
  clear: both;
}

.my_info dl dt,
.my_info dl dd {
  float: left;
  width: 120px;
  min-height: 26px;
}

.my_info dl dd {
  width: calc(100% - 120px);
  font-weight: 700;
}

.my_name {
  font-size: 20px;
  font-weight: 500;
}

.my_name span {
  position: absolute;
  left: 46px;
  top: 46px;
  display: block;
  width: 128px;
  height: 128px;
  border-radius: 50%;
  background: #f6f6f6;
  margin-bottom: 20px;
}

.my_name strong {
  font-weight: 900;
  font-size: 22px;
  margin-right: 4px;
}

.my_name button,
.my_name input[type=file] {
  width: 30px;
  height: 30px;
  font-size: 0;
  text-indent: -500px;
  border-radius: 50%;
  position: absolute;
  right: 0px;
  top: 90px;
  cursor: pointer;
  background: #888 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M9.82843 5L7.82843 7H4V19H20V7H16.1716L14.1716 5H9.82843ZM9 3H15L17 5H21C21.5523 5 22 5.44772 22 6V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V6C2 5.44772 2.44772 5 3 5H7L9 3ZM12 18C8.96243 18 6.5 15.5376 6.5 12.5C6.5 9.46243 8.96243 7 12 7C15.0376 7 17.5 9.46243 17.5 12.5C17.5 15.5376 15.0376 18 12 18ZM12 16C13.933 16 15.5 14.433 15.5 12.5C15.5 10.567 13.933 9 12 9C10.067 9 8.5 10.567 8.5 12.5C8.5 14.433 10.067 16 12 16Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E") no-repeat center center;
  transition: all 0.15s ease 0s;
}

.my_name button:hover,
.my_name input[type=file]:hover {
  background-color: #333;
}

.in_search_condition {
  text-align: right;
  margin: 50px 0 -46px 0;
}

.in_search_condition input.datepicker {
  width: 114px;
}

/* common */
@keyframes bounce {

  0%,
  100% {
    transform: translateY(0);
    opacity: 1;
  }

  50% {
    transform: translateY(-15px);
    opacity: 0.5;
  }
}

span.mouse {
  width: 25px;
  height: 45px;
  border: 3px solid #fff;
  border-radius: 13px;
  position: fixed;
  right: 3.5%;
  bottom: 12%;
  -webkit-animation: bounce;
  animation: bounce 1.5s ease-in-out reverse infinite;
  z-index: 10;
  transition: all 0.2s ease;
}

span.mouse>.wheel {
  display: block;
  width: 3px;
  height: 13px;
  background: #fff;
  margin: 8px auto 0px;
}

span.mouse::after {
  display: block;
  content: "스크롤";
  font-size: 17px;
  color: #fff;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -31px;
}

span.mouse>.wheel::after {
  display: block;
  content: '';
  width: 17px;
  height: 15px;
  background: url("/resources/common/img/arrow.svg") no-repeat;
  background-size: cover;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  bottom: -125%;
}

body.fp-viewing-1 span.mouse,
body.fp-viewing-2 span.mouse {
  border-color: #01ab9d;
}

body.fp-viewing-1 span.mouse::after,
body.fp-viewing-2 span.mouse::after {
  color: #01ab9d;
}

body.fp-viewing-1 span.mouse>.wheel,
body.fp-viewing-2 span.mouse>.wheel {
  background: #01ab9d;
}

body.fp-viewing-1 span.mouse>.wheel::after,
body.fp-viewing-2 span.mouse>.wheel::after {
  background: url("/resources/common/img/arrow_green.svg") no-repeat;
  background-size: cover;
}

body.lib_SS.fp-viewing-1 span.mouse,
body.lib_SS.fp-viewing-2 span.mouse {
  border-color: #37a4e9;
}

body.lib_SS.fp-viewing-1 span.mouse::after,
body.lib_SS.fp-viewing-2 span.mouse::after {
  color: #37a4e9;
}

body.lib_SS.fp-viewing-1 span.mouse>.wheel,
body.lib_SS.fp-viewing-2 span.mouse>.wheel {
  background: #37a4e9;
}

body.lib_SS.fp-viewing-1 span.mouse>.wheel::after,
body.lib_SS.fp-viewing-2 span.mouse>.wheel::after {
  background: url("/resources/common/img/arrow_blue.svg") no-repeat;
  background-size: cover;
}


body.lib_NA.fp-viewing-1 span.mouse,
body.lib_NA.fp-viewing-2 span.mouse {
  border-color: #9f00ba;
}

body.lib_NA.fp-viewing-1 span.mouse::after,
body.lib_NA.fp-viewing-2 span.mouse::after {
  color: #9f00ba;
}

body.lib_NA.fp-viewing-1 span.mouse>.wheel,
body.lib_NA.fp-viewing-2 span.mouse>.wheel {
  background: #9f00ba;
}

body.lib_NA.fp-viewing-1 span.mouse>.wheel::after,
body.lib_NA.fp-viewing-2 span.mouse>.wheel::after {
  background: url("/resources/common/img/arrow_purple.svg") no-repeat;
  background-size: cover;
}


body.lib_NE.fp-viewing-1 span.mouse,
body.lib_NE.fp-viewing-2 span.mouse {
  border-color: #ff9114;
}

body.lib_NE.fp-viewing-1 span.mouse::after,
body.lib_NE.fp-viewing-2 span.mouse::after {
  color: #ff9114;
}

body.lib_NE.fp-viewing-1 span.mouse>.wheel,
body.lib_NE.fp-viewing-2 span.mouse>.wheel {
  background: #ff9114;
}

body.lib_NE.fp-viewing-1 span.mouse>.wheel::after,
body.lib_NE.fp-viewing-2 span.mouse>.wheel::after {
  background: url("/resources/common/img/arrow_orange.svg") no-repeat;
  background-size: cover;
}

body.lib_CH.fp-viewing-1 span.mouse,
body.lib_CH.fp-viewing-2 span.mouse {
  border-color: #1F58A7;
}

body.lib_CH.fp-viewing-1 span.mouse::after,
body.lib_CH.fp-viewing-2 span.mouse::after {
  color: #1F58A7;
}

body.lib_CH.fp-viewing-1 span.mouse>.wheel,
body.lib_CH.fp-viewing-2 span.mouse>.wheel {
  background: #1F58A7;
}

body.lib_CH.fp-viewing-1 span.mouse>.wheel::after,
body.lib_CH.fp-viewing-2 span.mouse>.wheel::after {
  background: url("/resources/common/img/arrow_navy.svg") no-repeat;
  background-size: cover;
}


.text_box {
  padding: 20px 26px;
  box-sizing: border-box;
  border: 1px solid #dbdbdb;
  background: #f9f9f9;
  margin-bottom: 20px;
  border-radius: 5px;
}

.text_box p {
  font-size: 19px;
  font-weight: 700;
  color: #333;
  letter-spacing: 0.02em;
  display: inline-block;
  padding-left: 25px;
  position: relative;
  line-height: 1.3em;
}

.text_box p::before {
  display: inline-block;
  content: "";
  width: 13px;
  height: 13px;
  background: transparent;
  vertical-align: middle;
  border: 3px solid #01AB9D;
  border-radius: 50%;
  box-sizing: border-box;
  position: absolute;
  left: 0;
  top: 5px;
}

.text_box.loan_bottom {
  display: none;
  margin: 0;
}

body.lib_NR .text_box.loan_bottom {
  display: block;
}

.text_box .explain {
  color: #777;
  font-size: 16px;
  font-weight: 400;
  display: block;
}

body.lib_SS .text_box p::before {
  border-color: #54bfff;
}

body.lib_NA .text_box p::before {
  border-color: #9f00ba;
}

body.lib_NE .text_box p::before {
  border-color: #ff9114;
}

body.lib_CH .text_box p::before {
  border-color: #1F58A7;
}

body.lib_NR .text_box p::before {
  border-color: #2634B2;
}

.h4 {
  font-weight: 700;
  font-size: 23px;
  padding: 36px 0 12px 0;
  color: #333;
}

.h4 strong {
  font-weight: 900;
}

.h5 {
  font-size: 19px;
  padding: 24px 0 12px 0;
  font-weight: 700;
}

.caption {
  font-weight: 700;
  padding: 20px 0 10px 0;
}

input.datepicker {
  width: 128px;
}

.ui-datepicker-trigger {
  margin: 0 6px 0 -30px;
  vertical-align: middle;
}

.label_border_wrap {
  display: inline-block;
  border: solid 1px #ddd;
  margin: 0 2px;
  border-radius: 4px;
  padding: 0 4px 0 0;
}

.label_border_wrap select,
.label_border_wrap input[type=text] {
  border: 0 none;
  margin: 0;
}

.label_border_wrap span {
  padding: 0 10px;
}

.label_border_wrap span.hidden {
  padding: 0;
}

.label_border_wrap input[placeholder=서명] {
  width: 120px;
}

.hidden {
  position: fixed;
  left: -99999px;
  top: -99999px;
}

.page_nav button {
  border-radius: 3px;
}

.page_nav button[disabled],
.page_nav button[disabled]:hover,
.page_nav button[disabled]:focus {
  color: #fff;
  background-color: #01ab9d;
}

.btn_area .float_l {
  float: left;
}

.float_l {
  float: left;
}

.float_r {
  float: right;
}

.btn+.btn {
  margin-left: 5px;
}

.btn.drk {
  background-color: #444;
  color: #fff;
  border-color: #333 !important;
  padding-top: 4px;
  line-height: 1.8em;
}

.btn.drk:hover {
  background-color: #222;
  border-color: #111;
}

.btn.pri,
.btn.pri.btn_search {
  background-color: #01ab9d;
  border-color: #01a698;
  height: 36px;
  line-height: 1.8em;
  padding-top: 3px;
}

.search .search_btn {
  height: 40px;
  line-height: 40px;
}

.btn.pri:hover,
.btn.pri:focus,
.btn.pri.btn_search:hover,
.btn.pri.btn_search:focus {
  background-color: #019c8f;
  border-color: #019c8f;
}

.btn.scd {
  background-color: #fff;
  color: #01ab9d;
  border-color: #01ab9d;
}

.btn.scd:hover,
.btn.scd:focus {
  background-color: #f5fdfd;
  border-color: #00989a;
  color: #00989a;
}

.btn2.scd {
  background-color: #fff;
  color: #01ab9d;
  border-color: #01ab9d;
}

.btn2.scd:hover,
.btn2.scd:focus {
  background-color: #f5fdfd;
  border-color: #00989a;
  color: #00989a;
}

.table_paging_no {
  font-size: 15px;
  color: #777;
  padding: 16px 0 0 0;
  margin-bottom: -16px;
  float: left;
}

.table_paging_no+.btn_area {
  padding-top: 0;
}

.table+.btn_area {
  margin-top: 8px;
}

.note {
  padding: 16px 0;
}

.note.pri {
  color: #01ab9d;
}

.note01 {
  padding: 4px 0;
  line-height: 1.3em;
}

/* style.css */
.main_visual2 {
  background: #e8f0ff url(/resources/homepage/yblib/img/mainVisual_02.png) no-repeat center center;
}

#section1 .section_bottom>.bottom_left>form>button {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z' fill='rgba(1,171,157,1)'%3E%3C/path%3E%3C/svg%3E");
}

.class_btn a+a {
  border-left: 0 none;
}

.e00 .class_btn {
  margin-bottom: 0;
}

.h_right>.toggle:before,
.h_right>.toggle:after {
  display: block;
  content: "";
  background: #fff;
  width: 27px;
  height: 3px;
  position: absolute;
  transform: rotate(0);
  transition: all 0.15s ease 0s;
}

.h_right>.toggle>span {
  transition: all 0.15s ease 0s;
  opacity: 1;
}

#header.on .h_right>.toggle span {
  width: 0;
  margin: 0;
  opacity: 0;
}

#header.on .h_right>.toggle:before,
#header.on .h_right>.toggle:after {
  transform: rotate(45deg);
  width: 38px;
}

#header.on .h_right>.toggle:after {
  transform: rotate(-45deg);
}

/* 
#header.on {
	.toggle1 {transform: rotate(45deg); margin-bottom: -4px; width: 35px;}
	.toggle2 {width: 0;}
	.toggle3 {transform: rotate(-45deg);margin-top: -10px; width: 35px;}
}
 */


/*2023.08.12. 추가*/
.search_condition dl {
  display: flex;
  align-items: center;
  width: 100%;
  height: auto;
  ;
  margin: 0;
  gap: 15px;
  padding: 0;
}

.search_condition dl dt {
  width: auto;
  color: #000;
  font-weight: bold;
  height: auto;
  line-height: 1;
}

.search_condition dl dd {
  margin-left: 0px;
  display: flex;
  gap: 15px;
}

.search_condition dl dd label.title {
  position: absolute;
  top: 8px;
  left: 10px;
  color: #666;
  cursor: text;
}

.search_condition dl dd input.text-area {
  display: block;
  width: 96%;
  height: 38px;
  line-height: 38px;
  padding: 0 2%;
  color: #333;
  font-size: 18px;
  border: 1px solid #bfbfbf;
  cursor: text;
}

.search_condition dl dd input.text-area2 {
  display: inline-block;
  height: 38px;
  line-height: 38px;
  padding: 0 2%;
  color: #333;
  font-size: 18px;
  border: 1px solid #bfbfbf;
  cursor: text;
  width: 45%;
}

.search_condition dl dd select {
  -webkit-appearance: none;
  /* 네이티브 외형 감추기 */
  -moz-appearance: none;
  appearance none;
  height: 40px;
  line-height: 40px;
  font-size: 15px;
  border: 1px solid #bfbfbf;
  padding-left: 10px;
  box-sizing: border-box;
  background: #fff url('/resources/common/img/arrow_b.png') no-repeat 97% center;
  width: 96%;
}

.search_condition dl dd select::-ms-expand {
  display: none;
}

.btn.btn_reload {
  font-size: 0;
  height: 36px;
  width: 40px;
}

.search_condition .btn.btn_reload {
  font-size: 0;
}

/* --- 2023. 09.25 ---*/
/* table.culture_table td.td6 a.reg_end { background: #777;border-color: #777;} 
table.culture_table td.td6 a.reg_end span {color: #fff; } */


.ym_btns {
  text-align: center;
  margin: 20px 0;
}

.ym_btns a.btn {
  border: 0 none;
  padding: 0;
  min-width: auto;
}

.ym_btns a.btn:hover {
  background: transparent;
  color: #00989a;
  transition: all 0.2s ease 0s;
}

.ym_btns a.btn.prev {
  margin-right: 20px;
}

.ym_btns a.btn.next {
  margin-left: 20px;
}

.ym_btns a.btn i {
  font-size: 34px;
}

.ym_btns select {
  border: 0 none;
  font-size: 24px;
  font-weight: 600;
}

.section .class_btn .class_on {
  display: none;
}

.ym_btns #monthSelect {
  padding: 4px 15px 0;
}

.ym_btns #monthSelect:hover {
  background: #01ab9d;
  color: #252525;
  transition: all 0.2s ease 0s;
}

.search select.selectmenu {
  width: 100px;
}

.search a.btn {
  padding: 0;
  height: 40px;
  line-height: 40px;
}

.search input.text.ui-calendar {
  min-width: 120px;
}

#board .btn-group.inline {
  display: block;
  width: 100%;
  text-align: right;
  padding: 0;
  float: none;
}

#board .btn-group.inline .bbs-result {
  float: left;
  padding-top: 10px;
}

#board .btn-group.inline select.selectmenu {
  margin: 0;
}

.subpage #calendar .date-type {
  text-align: left;
  float: none;
  width: auto;
}

/* .rolling_box img {border: 1px solid #e1e1e0; box-sizing: border-box;} */

table.bbs td.dataEmpty,
table td.dataEmpty {
  border-top: 0 none;
  border-bottom: 0 none;
}

table.class_table thead th {
  background: #f2f2f2;
}

.file_ico {
  font-size: 0;
  display: block;
  vertical-align: middle;
  width: 20px;
  height: 20px;
  margin: 0 auto;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M5 5V19H19V7.82843L16.1716 5H5ZM4 3H17L20.7071 6.70711C20.8946 6.89464 21 7.149 21 7.41421V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3ZM12 18C10.3431 18 9 16.6569 9 15C9 13.3431 10.3431 12 12 12C13.6569 12 15 13.3431 15 15C15 16.6569 13.6569 18 12 18ZM6 6H15V10H6V6Z' fill='rgba(117,117,117,1)'%3E%3C/path%3E%3C/svg%3E");
  background-position: center center;
  background-repeat: no-repeat;
}

/* --- 로그인 ---*/
input[type=checkbox] {
  vertical-align: middle;
}

.login-box {
  width: 62%;
  padding: 40px;
  box-sizing: border-box;
}

.login-body .login fieldset {
  padding: 0;
}

.login-body .tab dd {
  padding: 0;
}

.login-box>strong {
  display: block;
  font-size: 28px;
  line-height: 1;
  text-align: center;
  margin-bottom: 10px;
}

.login-box>strong>span {
  display: inline-block;
  font-size: 34px;
  color: #252525;
}

.login-box>strong>span::before {
  display: inline-block;
  content: '';
  width: 50px;
  height: 50px;
  background: url('/resources/common/img/logo.svg') no-repeat center center;
  background-size: contain;
  vertical-align: middle;
  margin-right: 6px;
}

body.lib_CH .login-box>strong>span::before {
  height: 45px;
  background-image: url('/resources/homepage/children/img/children_symbol.svg');
  margin-right: 10px;
}

.login-body .login {
  width: 100%;
}

.login-body .login .form-box {
  width: 100%;
  float: none;
}

.login-body .login .form-box span {
  position: relative;
}

.login-body .login .form-box .id_wrap::before {
  display: inline-block;
  content: '';
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath d='M4 22C4 17.5817 7.58172 14 12 14C16.4183 14 20 17.5817 20 22H18C18 18.6863 15.3137 16 12 16C8.68629 16 6 18.6863 6 22H4ZM12 13C8.685 13 6 10.315 6 7C6 3.685 8.685 1 12 1C15.315 1 18 3.685 18 7C18 10.315 15.315 13 12 13ZM12 11C14.21 11 16 9.21 16 7C16 4.79 14.21 3 12 3C9.79 3 8 4.79 8 7C8 9.21 9.79 11 12 11Z' fill='rgba(204,204,204,1)'%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
}

.login-body .login .form-box .pw_wrap::before {
  display: inline-block;
  content: '';
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath d='M10.7577 11.8279L18.6066 3.979L20.0208 5.39322L18.6066 6.80743L21.0815 9.28231L19.6673 10.6965L17.1924 8.22164L15.7782 9.63586L17.8995 11.7572L16.4853 13.1714L14.364 11.0501L12.1719 13.2421C13.4581 15.1835 13.246 17.8249 11.5355 19.5354C9.58291 21.488 6.41709 21.488 4.46447 19.5354C2.51184 17.5827 2.51184 14.4169 4.46447 12.4643C6.17493 10.7538 8.81633 10.5417 10.7577 11.8279ZM10.1213 18.1211C11.2929 16.9496 11.2929 15.0501 10.1213 13.8785C8.94975 12.7069 7.05025 12.7069 5.87868 13.8785C4.70711 15.0501 4.70711 16.9496 5.87868 18.1211C7.05025 19.2927 8.94975 19.2927 10.1213 18.1211Z' fill='rgba(204,204,204,1)'%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
  left: 15px;
  top: 50%;
  transform: translateY(-50%);
}

.login-body .save_id {
  text-align: right;
  margin: 10px 0 15px;
}

.login-body .login .form-box input.txt {
  width: 100%;
  margin: 0 0 5px;
  height: 50px;
  padding-left: 50px;
}

.login-body .save_btn {
  margin: 5px 0 15px;
}

.login-body .login button {
  width: 100%;
  height: 50px;
  float: none;
}

.login_btns {
  text-align: center;
  margin-top: 25px;
}

.login_btns .idpw_find a {
  display: inline-block;
  padding-right: 15px;
  border-right: 1px solid #e1e1e0;
  color: #757575;
}

.login_btns .idpw_find a:last-of-type {
  border-right: 0 none;
  padding-right: 0;
}

.login_btns .idpw_find a+a {
  margin-left: 15px;
}

.sns_login {
  margin-top: 60px;
}

.sns_login>strong {
  display: block;
  line-height: 1;
  text-align: center;
  margin: 10px 0 20px;
  font-size: 18px;
  font-weight: 500;
  position: relative;
}

.sns_login>strong::before {
  display: inline-block;
  content: "";
  width: 37%;
  height: 1px;
  background: #ddd;
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.sns_login>strong::after {
  display: inline-block;
  content: "";
  width: 37%;
  height: 1px;
  background: #ddd;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
}

.sns_login a {
  display: block;
  height: 50px;
  text-align: center;
  margin: 5px 0;
  line-height: 50px;
  font-size: 17px;
  font-weight: 600;
  border-radius: 3px;
  transition: all 0.2s ease 0s;
}

.sns_login a.naver_login {
  color: #fff;
  background-color: #01c73c;
  background-image: url('/resources/common/img/naver_login.png');
  background-repeat: no-repeat;
  background-position: left 20px center;
  background-size: 20px auto;
}

.sns_login a.naver_login:hover {
  background-color: #03BC3A;
}

.sns_login a.kakao_login {
  color: #452a0f;
  background: #fddc3f;
  background-image: url('/resources/common/img/kakao_login.png');
  background-repeat: no-repeat;
  background-position: left 20px center;
  background-size: 20px auto;
}

.sns_login a.kakao_login:hover {
  background-color: #F4D53F;
}

/* sns로그인 연동*/
.sns_login_info {
  margin: 20px 0 0px;
  /*background: #f9f9f9; border: 1px solid #dbdbdb; border-radius: 5px;*/
  padding: 14px 0;
}

.sns_login_info p {
  text-align: center;
  line-height: 1.3em;
  font-size: 18px;
  color: #1F64B9;
  font-weight: 600;
}

.login-body .login_btns button+button {
  margin-top: 5px;
}

.login-body .login_btns button.sns_join_btn {
  background: #777;
  color: #fff;
  border-color: #777;
  transition: all 0.2s ease 0s;
}

.login-body .login_btns button.sns_join_btn:hover,
body.lib_SS .login-body .login_btns button.sns_join_btn:hover,
body.lib_NA .login-body .login_btns button.sns_join_btn:hover,
body.lib_NE .login-body .login_btns button.sns_join_btn:hover {
  background-color: #555;
}

body.lib_SS .login-body .login_btns button.sns_join_btn {
  background: #777;
  color: #fff;
  border-color: #777;
}

body.lib_NA .login-body .login_btns button.sns_join_btn {
  background: #777;
  color: #fff;
  border-color: #777;
}

body.lib_NE .login-body .login_btns button.sns_join_btn {
  background: #777;
  color: #fff;
  border-color: #777;
}

/* --- 회원가입 --- */
.join_step {
  display: flex;
  justify-content: space-between;
}

.join_step li {
  flex: 1;
  padding: 16px 0px;
  box-sizing: border-box;
  background: #f9f9f9;
  text-align: center;
  font-size: 17px;
  font-weight: 500;
  border-radius: 32px;
  border: 1px solid #dbdbdb;
  position: relative;
  margin-right: 15px;
}

.join_step li.on {
  background: #01ab9d;
  color: #fff;
  font-weight: 600;
}

.join_step li:last-child {
  margin-right: 0;
}

.join_step li+li::before {
  display: inline-block;
  content: '';
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M13.1714 12.0007L8.22168 7.05093L9.63589 5.63672L15.9999 12.0007L9.63589 18.3646L8.22168 16.9504L13.1714 12.0007Z' fill='rgba(204,204,204,1)'%3E%3C/path%3E%3C/svg%3E");
  background: no-repeat cetner center;
  position: absolute;
  left: -18px;
  top: 50%;
  transform: translateY(-50%);
}

.join-wrap {
  padding: 30px 0 15px;
}

.doc-body .join-wrap ul.con2 {
  padding-left: 0;
}

.doc-body .join-wrap ul.con2 li {
  line-height: 1.3em;
}

.btn.btn_reserve1,
.btn.btn_reserve2 {
  height: auto;
  padding: 12px 14px;
  line-height: 1;
  font-size: 17px;
}

.join-wrap .title {
  margin-bottom: 10px;
}

.join-wrap .info {
  width: 100%;
  padding: 30px 0 15px;
}

.agree_codes {
  margin: 15px 0 20px;
}

.agree_codes.right {
  text-align: right;
}

.agree_codes strong {
  color: #252525;
}

.all_agree {
  margin-top: 40px;
}

.all_agree label {
  font-size: 18px;
  font-weight: 600;
}

.join-wrap .identi_select {
  display: flex;
}

.join-wrap .identi_select .identy_a,
.join-wrap .identi_select .identy_b {
  float: none;
  flex: 1;
}

.join-wrap .identi_select p a {
  border: 1px solid #ccc;
  border-right-style: dashed;
  background: #f9f9f9;
  padding: 58px 0;
  transition: all 0.2s ease 0s;
}

.join-wrap .identi_select p+p a {
  border-right-style: solid;
  border-left-style: dashed;
}

.join-wrap .identi_select a::before {
  display: block;
  content: '';
  width: 180px;
  height: 180px;
  margin: 0 auto;
  border-radius: 50%;
  background: #fff url(/resources/common/img/reg_phone.png) no-repeat center center;
}

.join-wrap .identi_select p.identy_b a::before {
  background: #fff url("/resources/common/img/reg_ipin.png") no-repeat center center;
}

.join-wrap .identi_select p a span {
  display: block;
  margin-top: 30px;
  color: #757575;
  font-size: 22px;
  font-weight: 600;
}

.join-wrap .identi_select p a span::after {
  display: block;
  content: '본인 명의의 휴대폰으로 인증을 진행해주세요';
  font-size: 17px;
  margin-top: 20px;
}

.join-wrap .identi_select p.identy_b a span::after {
  display: block;
  content: '본인 명의의 아이핀으로 인증을 진행해주세요';
}

.join-wrap .identi_select p a:hover {
  background: #f2f2f2;
}

.join-wrap .identi_select p a:hover span {
  color: #454545;
}

.join-wrap .identi_select .success a,
.join-wrap .identi_select .success a:hover {
  font-weight: 800;
  background: #01ab9d;
  color: #fff;
  cursor: default;
  border-color: #01ab9d
}

.join-wrap .identi_select .success a span,
.join-wrap .identi_select .success a .fa,
.join-wrap .identi_select .success a:hover span,
.join-wrap .identi_select .success a:hover .fa {
  color: #fff;
}

.join-wrap .yearSelect {
  display: flex;
}

.join-wrap .yearSelect a {
  display: block;
  padding: 60px 0;
  transition: all 0.2s ease 0s;
  background: #f9f9f9;
  flex: 1;
  text-align: center;
  border: 1px solid #ccc;
  border-right-style: dashed;
}

.join-wrap .yearSelect a+a {
  border-left-style: dashed;
  border-right-style: solid;
}

.join-wrap .yearSelect a::before {
  display: block;
  content: '';
  width: 180px;
  height: 180px;
  margin: 0 auto;
  background: #fff url("/resources/common/img/over_14.svg") no-repeat center center;
  opacity: 0.5;
  border: 1px solid #dbdbdb;
  background-size: 50%;
  border-radius: 50%;
  margin-bottom: 30px;
  transition: all 0.2s ease 0s;
}

.join-wrap .yearSelect a:last-child::before {
  background: #fff url("/resources/common/img/under_14.svg") no-repeat center center;
  background-size: 55%;
}

.join-wrap .yearSelect a span {
  color: #757575;
  color: #757575;
  transition: all 0.2s ease 0s;
}

.join-wrap .yearSelect a span.joinText1 {
  font-size: 24px;
  font-weight: 600;
}

.join-wrap .yearSelect a span.joinText2 {
  display: block;
  font-size: 18px;
  margin-top: 8px;
  font-weight: 600;
}

.join-wrap .yearSelect a:hover {
  background: #f2f2f2;
}

.join-wrap .yearSelect a:hover span {
  color: #454545;
}

.join-wrap .yearSelect a:hover::before {
  opacity: 1;
}

.join-wrap table .btn {
  height: 40px;
  padding-top: 6px;
  background: #f2f2f2;
  border: 1px solid #ccc;
  color: #454545;
  font-weight: 500;
  font-size: 16px;
  transition: all 0.2s ease 0s;
}

.join-wrap table .btn:hover,
body.lib_SS .join-wrap table .btn:hover,
body.lib_NA .join-wrap table .btn:hover,
body.lib_NE .join-wrap table .btn:hover,
body.lib_NR .join-wrap table .btn:hover,
body.lib_CH .join-wrap table .btn:hover {
  background: #ededed;
  border: 1px solid #ccc;
  color: #454545;
}

.join-wrap .ex_text {
  margin-top: 8px;
}

.join-wrap .ex_text span {
  color: #757575;
}

.join-wrap table tbody th,
.join-wrap table tbody td {
  padding: 12px 15px;
}

.join-wrap table tbody th {
  font-weight: 500;
  color: #454545;
}

#memberForm tbody tr td input#address1,
#memberForm tbody tr td input#address2 {
  width: 100%;
}

.phone_input_wrap {
  display: block;
  width: 300px;
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
}

.phone_input_wrap input {
  width: 32%;
  flex: 1;
}


/* --- 아이디/비밀번호 찾기 --- */
.idpwSection .btn {
  background: #01ab9d;
  color: #fff;
}

.must_wrap {
  text-align: right;
  margin-bottom: 8px;
}

.h4_deco .must_wrap {
  float: right;
  font-size: 16px;
  color: #757575;
  font-weight: 500;
  margin-bottom: 0;
}

.must_ico {
  display: inline-block;
  font-size: 0;
  vertical-align: text-top;
  line-height: 1;
}

.must_ico::before {
  display: block;
  content: '*';
  color: #DF0043;
  font-size: 22px;
}

.find_pw_id {
  display: block;
  text-align: center;
  border: 2px solid #01ab9d;
  border-radius: 5px;
  padding: 16px 0;
}

.find_pw_id span {
  font-size: 20px;
  color: #454545;
  font-weight: 600;
  margin-right: 10px;
}

.find_pw_id input {
  width: 240px;
}

/* --- 회원정보수정 --- */
.pw_check_wrap {
  text-align: center;
  padding: 20px 0;
  border: 2px solid #01AB9D;
  border-radius: 5px;
}

.pw_check_wrap span {
  font-size: 20px;
  font-weight: 600;
  display: inline-block;
  margin-right: 10px;
}

.pw_check_wrap span::before {
  display: inline-block;
  content: '';
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 ' width='24' height='24'%3E%3Cpath d='M18 8H20C20.5523 8 21 8.44772 21 9V21C21 21.5523 20.5523 22 20 22H4C3.44772 22 3 21.5523 3 21V9C3 8.44772 3.44772 8 4 8H6V7C6 3.68629 8.68629 1 12 1C15.3137 1 18 3.68629 18 7V8ZM16 8V7C16 4.79086 14.2091 3 12 3C9.79086 3 8 4.79086 8 7V8H16ZM11 14V16H13V14H11ZM7 14V16H9V14H7ZM15 14V16H17V14H15Z' fill='rgba(37,37,37,1)'%3E%3C/path%3E%3C/svg%3E");
  vertical-align: middle;
  margin-right: 5px;
}

.pw_check_wrap input[type=password] {
  width: 240px;
}

.change_num {
  display: inline-block;
  margin-left: 10px;
}

span.block {
  display: block;
}

#new_password_area1,
#new_password_area2,
#new_card_password_area1 {
  height: 0;
  overflow: hidden;
  opacity: 0;
  transition: all 0.15s ease 0s;
  padding: 0;
}

#new_password_area1.on,
#new_password_area2.on,
#new_card_password_area1.on {
  height: 100%;
  opacity: 1;
}

#new_password_area1.on #pwdcheck,
#new_card_password_area1.on #cardcheck {
  padding: 10px 0;
  margin: 14px 0 0 0;
}

#new_password_area1 label,
#new_password_area2 label,
#new_card_password_area1 label {
  display: inline-block;
}

#new_password_area1 label span,
#new_password_area2 label span,
#new_card_password_area1 label span {
  display: inline-block;
  width: 140px;
}

#pwdcheck,
#cardcheck,
p.ex_text {
  font-size: 15px;
  color: #0081d1;
  padding: 0;
  margin: 0;
  transition: all 0.15s ease 0s;
}

.sms_service_yn_check {
  padding: 12px 0 0 0;
}

#memberForm caption {
  position: static;
  font-size: 20px;
  width: inherit;
  height: inherit;
  overflow: hidden;
  font-size: inherit;
  line-height: inherit;
  text-indent: inherit;
  text-align: left;
  padding: 20px 0 10px 0;
}

#memberForm caption strong {
  font-size: 20px;
  margin-right: 4px;
}

/* --- 희망도서신청현황 ---*/
.book-list {
  border-top: 0 none;
  margin-bottom: 30px;
}

.book-list .row {
  background: #fff;
  padding: 0;
}

/* --- 퀵메뉴 설정 ---*/
.quick_menu ul li.quick_btn {
  display: none;
}

.quick_menu .top_move_btn {
  display: block;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  background-color: #01ab9d;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='40' height='40' fill='rgba(255,255,255,1)'%3E%3Cpath d='M11.9999 10.8284L7.0502 15.7782L5.63599 14.364L11.9999 8L18.3639 14.364L16.9497 15.7782L11.9999 10.8284Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center center;
  margin: 20px auto 0;
  font-size: 0;
  box-shadow: 1px 1px 10px 0px rgba(112, 127, 151, 0.3);
}

body.lib_SS .quick_menu .top_move_btn {
  background-color: #37a4e9;
}

body.lib_NA .quick_menu .top_move_btn {
  background-color: #9f00ba;
}

body.lib_NE .quick_menu .top_move_btn {
  background-color: #ff9114;
}

body.lib_CH .quick_menu .top_move_btn {
  background-color: #1F58A7;
}

/* --- 내서재 --- */
.wrapper-bbs {
  padding: 0;
}

.doc-body .txt-box {
  background: #f5f5f5;
}

.doc-body .txt-box #txt_box_wrap02 ul li {
  line-height: 1.4em;
}

.btn_wrap_right {
  text-align: right;
  padding: 15px 0;
}

.btn.excel {
  padding-left: 36px;
  background: url("/resources/common/img/excel_icon.svg") no-repeat left 10px center;
  background-size: 18%;
}

table tbody td.title {
  text-align: left;
}

table tbody td.t_date {
  text-align: left;
}

#contents-title {
  display: none;
}

.book-list {
  border-radius: 5px;
  border: 1px solid #dbdbdb;
  overflow: hidden;
}

.book-list table {
  border-top: 0 none;
  border-bottom: 0 none;
}

.book-list table thead th {
  border-bottom: 1px solid #dbdbdb;
  border-top: 0 none;
}

.book-list table th,
.book-list table td {
  border-color: #e1e1e0;
  border-left: 0 none;
}

.book-list table tr:hover th {
  background: #f2f2f2;
}

.book-list table tr:hover td {
  background: #fff;
}

.book-list table th:last-child,
.book-list table td:last-child {
  border-right: 0 none;
}

.book-list table tbody tr:last-child td {
  border-bottom: 0 none;
}

.book-list table thead th {
  background: #f2f2f2;
  padding: 14px 10px;
  font-size: 16px;
  color: #252525;
  font-weight: 600;
}

.book-list table td {
  padding: 15px;
  font-size: 16px;
  border-top: 0 none;
}

.condition_wrap {
  display: inline-block;
}

.loan_table td.first,
.loan_history_table td.first {
  text-align: left;
}

.loan_table td.first {
  font-size: 16px;
  font-weight: 400;
}

table.loan_table td .loan_title {
  font-size: 16px;
  color: #252525;
  font-weight: 600;
  margin-bottom: 8px;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 1;
}

table.loan_table td .loan_author {
  font-size: 16px;
  font-weight: 400;
  color: #757575;
}

.book-list+.btn_wrap_right {
  padding-top: 0;
}

/* --- 희망도서신청현황 --- */
.hope_list {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}

.hope_item {
  margin-bottom: 18px;
  padding: 24px 26px;
  box-sizing: border-box;
  border: 1px solid
    /*#01ab9d*/
    #e1e1e0;
  border-radius: 5px;
  width: 49%;
}

.hope_item .bif {
  margin-bottom: 10px;
  display: flex;
  flex-flow: column nowrap;
  gap: 8px;
  border-bottom: 1px dashed #ddd;
  padding-bottom: 15px;
}

.hope_item h4 {
  padding: 0px;
  color: #252525;
  font-size: 20px;
  font-weight: 700;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

.hope_item .info span {
  color: #757575;
}

.hope_item table th,
.hope_item table td {
  padding: 8px 0;
  border: 0 none;
  /*border-bottom: 1px solid #e5e8eb;*/
}

.hope_item table th {
  color: #757575;
  font-weight: 600;
  text-align: left;
  width: 18%;
  padding-left: 0;
  background: #fff;
}

.hope_item table td {
  color: #252525;
  font-weight: 500;
  word-break: break-all;
  padding-left: 24px;
}

/* --- 수강신청현황 ---*/
.bbs-notice.search_condition {
  margin-bottom: 20px;
}

.condition_div span.sort {
  border-right: 1px solid #ccc;
  padding-right: 8px;
  margin-right: 8px;
}

.content .search_condition .class_condition label {
  font-size: 16px;
}

/* --- 나의 관심도서 ---*/
.search_condition.center {
  text-align: center;
  margin-bottom: 20px;
}

table.bbs tbody tr:hover td {
  background: #fff;
}

.sort_wrap {
  display: inline-block;
  border-left: 1px solid #dbdbdb;
  padding-left: 20px;
  margin-left: 20px;
}

.book-list table.basket_table td.td2 {
  text-align: left;
}

.book-list table.basket_table td.td2 a {
  font-weight: 600;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 1;
}

/* --- 조직 및 업무 --- */
table.class_table tr:first-child td.w_place {
  border-top: 0 none;
  margin-top: 15px;
}

/* --- paging ---*/
.dataTables_paginate {
  padding: 15px 0 0;
}

/* .dataTables_paginate > span {display: flex; align-items: center; justify-content: center;} */
.dataTables_paginate .paginate_button.current,
.dataTables_paginate .paginate_button.current:hover {
  background: #01AB9D;
  color: #fff;
  border-color: #01AB9D;
  border-radius: 3px;
}

.dataTables_paginate a.paginate_button {
  border: 0 none;
  background: #fff;
  font-size: 15px;
  padding: 0;
  min-width: 28px;
  height: 28px;
  margin: 0 1px;
  line-height: 27px;
  border-radius: 3px;
}

.dataTables_paginate a.paginate_button.next,
.dataTables_paginate a.paginate_button.previous,
.dataTables_paginate a.paginate_button.disabled.previous,
.dataTables_paginate a.paginate_button.disabled.next {
  padding: 0;
  border: 1px solid #ddd;
  border-radius: 3px;
}

.dataTables_paginate a.paginate_button.previous,
.dataTables_paginate a.paginate_button.next {
  font-size: 0;
  background: url("/resources/homepage/yblib/img/page_nav.gif") no-repeat -49px center;
}

.dataTables_paginate a.paginate_button.previous {
  background-position: -23px center;
}

.dataTables_paginate a.paginate_button.previous:first-child {
  background-position: 3px center;
}

.dataTables_paginate a.paginate_button.next:last-child {
  background-position: -76px center;
}

/*
.dataTables_paginate a.paginate_button.previous {font-size: 0; background: url("/resources/homepage/yblib/img/page_nav.gif") no-repeat -23px center;}
.dataTables_paginate a.paginate_button.previous:last-child {background-position: 2px center;}
*/
/* --- nodata --- */
.nodata {
  text-align: center;
  font-size: 18px;
}

.nodata p {
  text-align: center;
}

.book-list .nodata {
  border: 0 none;
}



/*---- style.css 복붙 시작 ----*/


.main {
  background: #fff;
}

/* 가로 고정 - 반응형에서 가로 1260 됐을떄 %로 전환 필요*/
.main-section {
  position: relative;
  max-width: 1260px;
  margin: 0 auto;
}

#header {
  width: 100%;
  height: 100px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
  background: #fff;
  position: relative;
  z-index: 120;
}

body.main #header {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
}

.h_logo {
  padding-left: 60px;
  box-sizing: border-box;
}

.h_logo>a {
  display: inline-block;
  font-size: 24px;
  font-weight: 900
}

.h_logo>a::before {
  display: inline-block;
  content: "";
  width: 46px;
  height: 36px;
  background: url("/resources/common/img/logo.svg") no-repeat left center;
  background-size: contain;
  vertical-align: middle;
  margin-right: 5px;
}

.lib_NR .h_logo>a {
  font-size: 0;
  width: 210px;
  height: 46px;
  background: url("/resources/homepage/naru/img/naru_logo.svg") no-repeat center center;
}

.lib_NR .h_logo>a::before {
  display: none;
}

.lib_CH .h_logo>a {
  font-size: 0;
  width: 210px;
  height: 48px;
  background: url("/resources/homepage/children/img/children_logo.svg") no-repeat center center;
}

.lib_CH .h_logo>a::before {
  display: none;
}

.h_right {
  display: flex;
  align-items: center;
}

.h_right>.tnb {
  display: flex;
  margin-right: 8px;
}

.h_right>.tnb>a {
  display: block;
  width: 50px;
  height: 50px;
  font-size: 0;
  opacity: 0.5;
  transition: all 0.15s ease 0s;
}

.h_right>.tnb>a.mobile_card {
  display: none;
}

.h_right>.tnb>a:hover {
  opacity: 1;
}

.h_right>.tnb>a.login {
  background: url("/resources/homepage/yblib/img/login_icon.svg") no-repeat center center;
}

.h_right>.tnb>a.search {
  background: url("/resources/homepage/yblib/img/serach_icon.svg") no-repeat center center;
  border: 0;
  padding: 0;
  margin: 0;
}

.h_right>.tnb>a.logout {
  font-size: 17px;
  align-items: center;
  display: flex;
  font-weight: 600;
  padding: 0 0 0 36px;
  margin-right: 8px;
  width: auto;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='28' height='28'%3E%3Cpath d='M6.26489 3.80698L7.41191 5.44558C5.34875 6.89247 4 9.28873 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 9.28873 18.6512 6.89247 16.5881 5.44558L17.7351 3.80698C20.3141 5.61559 22 8.61091 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 8.61091 3.68594 5.61559 6.26489 3.80698ZM11 12V2H13V12H11Z'%3E%3C/path%3E%3C/svg%3E") no-repeat 5px center;
}

.h_right>.toggle {
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  width: 100px;
  height: 100px;
  background: #01ab9d;
  font-size: 0;
  line-height: 0;
}

.h_right>.toggle>span {
  display: block;
  width: 27px;
  height: 3px;
  background: #fff;
  margin-bottom: 8px;
}

.h_right>.toggle>span:last-child {
  margin-bottom: 0;
}



/* -- header -- */
/* .content { width: 1200px; } 

.gnb > ul { display: flex; flex-flow: row nowrap; justify-content: space-between; } 
.gnb > ul > li { width: 157px; height: 100px; position: relative; text-align: center; } 
.gnb > ul > li:last-child { margin-right: 0; } 
.gnb > ul a { display: block; } 
.gnb > ul a span { display: inline-block; position: relative; } 
.gnb > ul a span:before { height: 4px; display: block; content: ""; width: 0; background-color: #01ab9d; transition: all 0.15s ease 0s; position: absolute; bottom: -1px; transform: translateX(-50%); left: 50%; } 
.gnb > ul > .active > a,
.gnb > ul a:hover { color: #01ab9d; } 
.gnb > ul > .active > a span:before,
.gnb > ul a:hover span:before { width: 100%; } 
.gnb > ul > li > a { line-height: 100px; font-size: 22px; font-weight: 700; } 
.gnb > ul > li:first-child ul { border-left: #ededed solid 1px; } 
.gnb > ul > li.on > a span { color: #01ab9d; } 
.gnb > ul > li.on > a span:before { width: 100%; } 
.gnb > ul > li.on ul { background-color: #f7fbfa; } 

.gnb ul ul { border-right: #ededed solid 1px; border-top: solid 1px #d0d0d0; background: #fff; height: 0; overflow: hidden; opacity: 0; transition: all 0.15s ease 0s; } 
.gnb ul ul a { padding: 0; transition: all 0.15s ease 0s; } 
.gnb ul ul a span { padding: 0; transition: all 0.15s ease 0s; } 
.gnb ul ul a span:before { height: 0; } 
.gnb ul ul li:first-child a { padding-top: 0; } 
.gnb ul ul li:last-child a { padding-bottom: 0; }  */

/* 2023.08.12. 추가*/
.gnb .gnb-menu>li>.SubMenu>li>ul {
  display: none;
}

.hover_bg {
  background: #000;
  position: fixed;
  left: 0;
  width: 0;
  bottom: 0;
  top: 0;
  z-index: 110;
  opacity: 0;
  transition: opacity 0.15s ease 0s;
}

.nav_bg {
  position: absolute;
  left: 0;
  top: 100px;
  right: 0;
  background: #fff;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.2);
  height: 0;
  transition: all 0.15s ease 0s;
}

#header.on .gnb ul ul {
  opacity: 1;
}

#header.on .gnb ul ul a {
  padding: 4px 0;
}

#header.on .gnb ul ul a span {
  padding: 8px 0;
}

#header.on .gnb ul ul a span:before {
  height: 2px;
}

#header.on .gnb ul ul li:first-child a {
  padding-top: 22px;
}

#header.on .gnb ul ul li:last-child a {
  padding-bottom: 22px;
}

#header.on.gnb5 .gnb ul ul,
#header.on.gnb5 .nav_bg {
  height: 232px;
  box-sizing: border-box;
}

#header.on.gnb6 .gnb ul ul,
#header.on.gnb6 .nav_bg {
  height: 272px;
  box-sizing: border-box;
}

#header.on.gnb7 .gnb ul ul,
#header.on.gnb7 .nav_bg {
  height: 312px;
  box-sizing: border-box;
}

#header.on.gnb8 .gnb ul ul,
#header.on.gnb8 .nav_bg {
  height: 352px;
  box-sizing: border-box;
}

#header.on.gnb9 .gnb ul ul,
#header.on.gnb9 .nav_bg {
  height: 392px;
  box-sizing: border-box;
}

#header.on.gnb10 .gnb ul ul,
#header.on.gnb1 .nav_bg {
  height: 432px;
  box-sizing: border-box;
}

#header.on.gnb11 .gnb ul ul,
#header.on.gnb1 .nav_bg {
  height: 472px;
  box-sizing: border-box;
}

#header.on.gnb12 .gnb ul ul,
#header.on.gnb1 .nav_bg {
  height: 512px;
  box-sizing: border-box;
}

#header.on+.hover_bg {
  opacity: 0.25;
  width: 100%;
}

.snb li.on a:hover {
  color: #01ab9d;
}

.snb li.on a:hover span:before {
  width: 100%;
}

.lnb li.on a:hover {
  color: #01ab9d;
}

.lnb li.on a:hover span:before {
  width: 100%;
}

/* .main .footer_bottom { height: 300px; }  */

.footer_bottom {
  padding: 30px 0 0 280px;
  box-sizing: border-box;
  height: 200px;
}

.footer_bottom h2 {
  position: absolute;
  left: 0;
  top: 40px;
  opacity: 0.5;
}

body.lib_CH .footer_bottom h2 {
  font-size: 0;
  width: 180px;
  height: 42px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-image: url('/resources/homepage/children/img/children_footer_logo.svg');
}

body.lib_CH .footer_bottom h2::before {
  width: 180px;
  height: 42px;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-image: url('/resources/homepage/children/img/children_footer_logo.svg');
}

.footer_bottom address {
  font-style: normal;
  color: #fff;
  opacity: 0.65;
  display: inline-block;
  font-weight: 300;
  padding: 5px 0;
}

.footer_bottom dl {
  display: inline-block;
  padding: 0 0 0 10px;
}

.footer_bottom dl dt,
.footer_bottom dl dd {
  display: inline-block;
  color: #fff;
  opacity: 0.65;
  font-weight: 300;
}

.footer_bottom dl dt:before {
  display: inline-block;
  content: "";
  width: 1px;
  height: 12px;
  margin: 0 15px 0 10px;
  background: rgba(255, 255, 255, 0.4);
}

.footer_bottom .copyright {
  opacity: 0.4;
  color: #fff;
  font-size: 14px;
  font-weight: 300;
  padding: 10px 0 20px 0;
  letter-spacing: 0.05em;
}

.bottom_nav {
  padding: 16px 0;
}

.bottom_nav a {
  color: #ddd;
  opacity: 0.8;
  transition: all 0.15s ease 0s;
  display: inline-block;
  padding: 5px 20px;
}

.bottom_nav a strong {
  color: #fff;
  opacity: 1;
}

body.lib_SS .bottom_nav a strong {
  color: #fff;
}

body.lib_NA .bottom_nav a strong {
  color: #fff;
}

body.lib_NE .bottom_nav a strong {
  color: #fff;
}

body.lib_NR .bottom_nav a strong {
  color: #fff;
}

/* .bottom_nav a strong { color: #01AB9D; }  */
.bottom_nav a:first-child {
  padding-left: 0;
}

.section_wrap {
  padding: 50px 0;
  /*outline: red solid 1px;*/
}

.snb {
  width: 200px;
  float: left;
}

.snb h2 {
  padding: 45px 0 45px 20px;
  color: #fff;
  font-size: 24px;
  background: linear-gradient(100.51deg, #01AB82 28.67%, #01AB9D 87.37%) no-repeat right 0;
  position: relative;
  border-radius: 10px;
}

.snb h2:after {
  display: block;
  content: "";
  width: 100%;
  height: 110px;
  background: url("/resources/homepage/yblib/img/h2_bg.png") no-repeat right 0;
  position: absolute;
  right: 0;
  top: 0;
}

.snb ul {
  margin: 8px 0;
}

.snb ul a {
  display: block;
  padding: 16px;
  color: #777;
  font-weight: 700;
  background: #fff;
  transition: all 0.15s ease 0s;
  border-radius: 5px;
  position: relative;
}

.snb ul a:hover {
  background: #f6f6f6;
  color: #000;
}

.snb ul .active>a {
  background: linear-gradient(100.51deg, #01AB82 28.67%, #01AB9D 87.37%);
  color: #fff;
}

.snb ul .active>a::before {
  display: block;
  content: "";
  width: 10px;
  height: 3px;
  position: absolute;
  right: 16px;
  top: 22px;
  background: #fff;
}

.lnb {
  width: 200px;
  float: left;
}

.lnb h2 {
  padding: 45px 0 45px 20px;
  color: #fff;
  font-size: 24px;
  background: linear-gradient(100.51deg, #01AB82 28.67%, #01AB9D 87.37%) no-repeat right 0;
  position: relative;
  border-radius: 10px;
}

.lnb h2:after {
  display: block;
  content: "";
  width: 100%;
  height: 110px;
  background: url("/resources/homepage/yblib/img/h2_bg.png") no-repeat right 0;
  position: absolute;
  right: 0;
  top: 0;
}

.lnb ul {
  margin: 8px 0;
}

.lnb ul a {
  display: block;
  padding: 16px;
  color: #777;
  font-weight: 700;
  background: #fff;
  transition: all 0.15s ease 0s;
  border-radius: 5px;
  position: relative;
}

.lnb ul a:hover {
  background: #f6f6f6;
  color: #000;
}

.lnb ul .active>a {
  background: linear-gradient(100.51deg, #01AB82 28.67%, #01AB9D 87.37%);
  color: #fff;
}

.lnb ul .active>a::before {
  display: block;
  content: "";
  width: 10px;
  height: 3px;
  position: absolute;
  right: 16px;
  top: 22px;
  background: #fff;
}

.lnb ul>li>ul>li>a {
  background: transparent;
  color: #777;
}

.lnb ul>li>ul>li>a span {
  color: #777;
}

.lnb ul>li>ul>li>a:hover {
  background: transparent;
}

.lnb ul .active>ul>li>a {
  background: transparent;
  color: #000;
}

.lnb ul .active>ul>li>a:hover {}

.lnb ul .active>ul>li.active>a span {
  color: #000;
}

.lnb ul>li>ul>li {
  background: transparent url('/resources/homepage/yblib/img/sub_nav.svg') no-repeat left 20px center;
}

.lnb ul>li>ul>li.active {
  background: url('/resources/homepage/yblib/img/sub_navA.svg') no-repeat left 20px center;
}

.lnb ul li ul {
  margin: 0 0 6px;
}

.lnb ul li ul li a {
  padding: 12px 0 12px 38px;
}

/*--- 북스타트 신청 ---*/
body.b20 .snb .sub_20 .sub_snb {
  background: #f9f9f9;
  border-radius: 5px;
}

body.b20 .snb .sub_20 .sub_snb li {
  padding-left: 16px;
  background: url('../images/sub_nav.svg') no-repeat left 15px top 18px;
}

body.b20 .snb .sub_20 .sub_snb a {
  background: none;
  color: #525252;
  font-weight: 400;
}

body.b20 .snb .sub_20 .sub_snb li.active {
  background: url('../images/sub_navA.svg') no-repeat left 15px top 18px;
}

body.b20 .snb .sub_20 .sub_snb li.active a {
  font-weight: 600;
}

.quick_menu {
  width: 110px;
  position: fixed;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  z-index: 500;
}

.quick_menu h3 {
  position: relative;
  width: 110px;
  height: 70px;
  display: block;
  text-align: center;
  padding-top: 16px;
  box-sizing: border-box;
  color: #fff;
  font-weight: 700;
  top: 9px;
  border-radius: 10px 10px 0 0;
  background: #01ab9d;
}

.quick_menu h3::after {
  display: block;
  content: '';
  bottom: 0;
  position: absolute;
  left: 50%;
  width: 0;
  height: 0;
  border: 8px solid transparent;
  border-bottom: 0;
  margin-left: -8px;
  margin-bottom: -6px;
  border-top-color: #01ab9d;
}

.quick_menu ul {
  width: 110px;
  background: #fff;
  box-shadow: 1px 1px 10px 0px rgba(112, 127, 151, 0.3);
  border-radius: 0px 0px 10px 10px;
  padding-top: 30px;
  box-sizing: border-box;
}

.quick_menu ul>li {
  text-align: center;
  margin-bottom: 15px;
}

.quick_menu ul>li>a {
  margin: 0 auto;
  width: 80px;
  display: block;
  padding-bottom: 15px;
  border-bottom: 1px solid #dbdbdb;
  font-weight: 500;
}

.quick_menu ul>li:last-child {
  margin-bottom: 0;
}

.quick_menu ul>li:last-child>a {
  border-bottom: none;
}

.fix_top {
  display: block;
  width: 50px;
  height: 50px;
  border: 1px solid #dbdbdb;
  border-radius: 50%;
  text-align: center;
  padding-top: 23px;
  box-sizing: border-box;
  font-size: 15px;
  background: #fff url("/resources/homepage/yblib/img/top_icon.png") no-repeat center top 11px;
  position: fixed;
  right: 129px;
  bottom: 5%;
  z-index: 1000;
}

body.lib_NR .quick_menu h3::after {
  border-top-color: #2634B2;
}

body.lib_YB .quick_menu .lib_YB,
body.lib_SS .quick_menu .lib_SS,
body.lib_NA .quick_menu .lib_NA,
body.lib_NE .quick_menu .lib_NE,
body.lib_CH .quick_menu .lib_CH {
  display: none;
}

#section1 {
  width: 100%;
  height: 100vh;
  position: relative;
}

#section1 .section1_wrapper {
  width: 100%;
  box-sizing: border-box;
  height: auto;
  height: 100%;
  position: relative;
}

#section1 .main_visual_wrapper {
  display: flex;
  width: 100%;
  height: 720px;
  height: 100%;
  justify-content: center;
  position: relative;
}

#section1 .main_visual_container li {
  background: no-repeat center center;
  background-size: cover;
}

#section1 .main_visual_wrapper li.main_visual1 {
  /* background-image: url('/resources/homepage/yblib/img/main_banner01.jpg'); */
  background-color: #6B839B;
}

#section1 .main_visual_wrapper li.main_visual2 {
  /* background-image: url('/resources/homepage/yblib/img/main_banner02.jpg'); */
  background-color: #FFF0BB;
}

#section1 .main_visual_wrapper li.main_visual3 {
  /* background-image: url('/resources/homepage/yblib/img/main_banner03.jpg'); */
  background-color: #E8F0FF;
}

#section1 .main_visual_wrapper .swiper-slide img {
  width: 100%;
  height: auto;
}

#section1 .main_visual_arrow {
  display: flex;
  gap: 20px;
  margin: 0px 15px;
}

#section1 .main_visual_arrow>a {
  display: block;
  width: 9px;
  height: 14px;
  text-indent: -99999px;
}

#section1 .main_visual_arrow>.prev {
  background: url("/resources/homepage/yblib/img/sec3_prev.svg") no-repeat;
  background-size: contain;
}

#section1 .main_visual_arrow>.next {
  background: url("/resources/homepage/yblib/img/sec3_next.svg") no-repeat;
  background-size: contain;
}

#section1 .pagination_wrap {
  position: absolute;
  left: calc(50% - 600px);
  bottom: 25%;
  display: flex;
  z-index: 100;
  padding: 16px;
  background-color: rgba(255, 255, 255, 0.75);
  border-radius: 25px;
}

#section1 .swiper-pagination {
  color: #777;
  width: 220px;
  position: static;
  display: flex;
  justify-content: space-between;
}

#section1 .swiper-pagination .swiper-pagination-current {
  font-weight: 700;
  color: #000;
}

#section1 .swiper-pagination-progressbar.swiper-pagination-horizontal {
  width: 150px;
  height: 1px;
  position: absolute;
  left: 52px;
  top: 50%;
  transform: translateY(-50%);
}

#section1 .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: #222;
  height: 3px;
  top: -1px;
}

/* 메인 swiper 텍스트 추가 */
.main_swiper1,
.main_swiper2,
.main_swiper3,
.main_swiper4 {
  color: #000;
  line-height: 1.3;
  position: absolute;
  left: calc(50% - 600px);
  top: 50%;
  opacity: 0;
  transition: all 0.15s ease 0.15s;
  text-shadow: 1px 1px 5px rgba(255, 255, 255, 0.7);
}


.main_swiper1 {
  font-size: 26px;
  top: calc(50% - 180px);
  transition: all 1s ease 0s;
  font-weight: 800;
}

.main_swiper2 {
  font-size: 56px;
  top: calc(50% - 140px);
  transition: all 1s ease 0.25s;
  font-weight: 800;
  color: #000;
}

.main_swiper3 {
  font-size: 18px;
  top: calc(50% - 36px);
  transition: all 1s ease 0.5s;
}

.main_swiper4 {
  font-size: 15px;
  top: calc(50% + 40px);
  transition: all 1s ease 0.9s;
}

.main_swiper_link {
  font-size: 14px;
  color: #fff;
  background: #000;
  border-radius: 4px;
  padding: 10px 22px 10px;
  left: calc(50% - 600px);
  top: calc(50% + 90px);
  position: absolute;
  opacity: 0;
  transition: all 1s ease 1.2s
}

.main_swiper_link:hover {
  color: #fff;
}

.main_swiper_link:after {
  display: inline-block;
  content: '';
  width: 24px;
  height: 10px;
  background-image: url('/resources/common/img/arrowRW.gif');
  background-position: right center;
  background-repeat: no-repeat;
  margin: 0 0 0 8px;
  transition: all 0.15s ease 0s
}

.main_swiper_link:hover:after {
  margin: 0 0 0 16px;
}

/* 메인 VIDEO  */
.has_introMovie {
  background-color: #000;
}

/* .has_introMovie .intro_movie{ opacity: 0.4; } */
.intro_movie {
  width: 100%;
  height: 100vh;
  object-fit: cover;
  position: absolute;
  left: 0;
  top: 0;
}

.has_introMovie .main_swiper1,
.has_introMovie .main_swiper2,
.has_introMovie .main_swiper3,
.has_introMovie .main_swiper4,
.dark .main_swiper1,
.dark .main_swiper2,
.dark .main_swiper3,
.dark .main_swiper4 {
  color: #fff;
  text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.8);
}


.swiper-slide-active .main_swiper1 {
  top: calc(50% - 230px);
  opacity: 1;
}

.swiper-slide-active .main_swiper2 {
  top: calc(50% - 190px);
  opacity: 1;
}

.swiper-slide-active .main_swiper3 {
  top: calc(50% - 86px);
  opacity: 1;
}

.swiper-slide-active .main_swiper4 {
  top: calc(50% - 10px);
  opacity: 1;
}

.swiper-slide-active .main_swiper_link {
  top: calc(50% + 50px);
  opacity: 0.8;
}

/* 메인 bx-slider 텍스트 추가 */
.bx-viewport .main_swiper1,
.bx-viewport .main_swiper2,
.bx-viewport .main_swiper3,
.bx-viewport .main_swiper4 {
  color: #000;
  line-height: 1.3;
  position: absolute;
  left: calc(50% - 600px);
  top: 50%;
  opacity: 0;
  transition: all 0.15s ease 0.15s;
}

.bx-viewport li.has_introMovie .main_swiper1,
.bx-viewport li.has_introMovie .main_swiper2,
.bx-viewport li.has_introMovie .main_swiper3,
.bx-viewport li.has_introMovie .main_swiper4 {
  color: #fff;
}

.bx-viewport .main_swiper1 {
  font-size: 26px;
  top: calc(50% - 180px);
  transition: all 1s ease 0s;
  font-weight: 800;
}

.bx-viewport .main_swiper2 {
  font-size: 56px;
  top: calc(50% - 140px);
  transition: all 1s ease 0.25s;
  font-weight: 800;
  color: #000;
}

.bx-viewport .main_swiper3 {
  font-size: 18px;
  top: calc(50% - 36px);
  transition: all 1s ease 0.5s;
}

.bx-viewport .main_swiper4 {
  font-size: 15px;
  top: calc(50% + 40px);
  transition: all 1s ease 0.9s;
}

.bx-viewport .main_swiper_link {
  font-size: 14px;
  color: #fff;
  /*background: #000 url(/resources/common/img/arrowRW.gif) no-repeat calc( 100% - 18px ) center;*/
  border-radius: 4px;
  padding: 10px 22px 10px 22px;
  left: calc(50% - 600px);
  top: calc(50% + 90px);
  position: absolute;
  opacity: 0;
  transition: all 1s ease 1.2s
}

.bx-viewport .swiper-slide-active .main_swiper_link:hover {
  color: #fff;
  background-position-x: calc(100% - 10px);
  opacity: 1;
  transition: opacity 0.15s ease 0s, background-position 0.15s ease 0s;
}

.bx-viewport .active .main_swiper1 {
  top: calc(50% - 230px);
  opacity: 1;
}

.bx-viewport .active .main_swiper2 {
  top: calc(50% - 190px);
  opacity: 1;
}

.bx-viewport .active .main_swiper3 {
  top: calc(50% - 86px);
  opacity: 1;
}

.bx-viewport .active .main_swiper4 {
  top: calc(50% - 10px);
  opacity: 1;
}

.bx-viewport .active .main_swiper_link {
  top: calc(50% + 50px);
  opacity: 0.8;
}

/* #section1 .popZone .bx-controls {position:absolute;width:140px;height:14px;bottom:180px;left:345px;z-index:150000000;} */
/* #section1 .popZone .bx-controls { display: flex; position: absolute;bottom: 25%; left:calc( 50% - 600px );width: auto; padding: 16px;border-radius: 25px; background-color: rgba(255,255,255,.75); outline: red solid 1px;}
#section1 .popZone .bx-prev, 
#section1 .popZone .bx-next, 
#section1 .popZone .bx-start,
#section1 .popZone .bx-stop {position:absolute;width:9px;height:14px;font-size:0;background-image:url("/resources/homepage/yblib/img/sec_btn_img.png");background-repeat: no-repeat; background-position:0 0;background-size:cover;}
#section1 .popZone .bx-start {width:10px;height:14px;}
#section1 .popZone .bx-pager {position:absolute;text-align:center;left:0;width:70px;height:14px;line-height:14px;background:transparent;color:#2f2f2f;}
#section1 .popZone .bx-prev { left:80px; }
#section1 .popZone .bx-next { left:118px; background-position:-9px 0; }
#section1 .popZone .bx-start { left:150px; background-position:-28px 0; }
#section1 .popZone .bx-stop { left:150px; background-position:-18px 0;}
 */
.popZone .bx-controls {
  position: absolute;
  bottom: 25%;
  left: calc(50% - 600px);
  width: auto;
  padding: 16px 30px 14px 40px;
  border-radius: 30px;
  background-color: rgba(255, 255, 255, .75);
  border: solid 1px rgba(0, 0, 0, 0.08);
  font-size: 0;
  display: flex;
  align-items: center;
  vertical-align: middle;
  box-shadow: 0 3px 4px rgba(0, 0, 0, .08);
}

.popZone .bx-controls>div {
  display: flex;
}

.bx-pager.bx-default-pager {
  font-size: 18px;
  margin-right: 30px;
}

.popZone .bx-prev,
.popZone .bx-next,
.popZone .bx-stop,
.popZone .bx-start {
  font-size: 0;
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath d='M10.8284 12.0007L15.7782 16.9504L14.364 18.3646L8 12.0007L14.364 5.63672L15.7782 7.05093L10.8284 12.0007Z' fill='rgba(0,0,0,1)'%3E%3C/path%3E%3C/svg%3E") no-repeat center center;
  opacity: 0.7;
  transition: all 0.15s ease 0s;
}

.popZone .bx-next {
  transform: rotate(180deg);
}

.popZone .bx-stop {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='26' height='26'%3E%3Cpath d='M6 5H8V19H6V5ZM16 5H18V19H16V5Z' fill='rgba(0,0,0,1)'%3E%3C/path%3E%3C/svg%3E");
}

.popZone .bx-start {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='26' height='26'%3E%3Cpath d='M19.376 12.4158L8.77735 19.4816C8.54759 19.6348 8.23715 19.5727 8.08397 19.3429C8.02922 19.2608 8 19.1643 8 19.0656V4.93408C8 4.65794 8.22386 4.43408 8.5 4.43408C8.59871 4.43408 8.69522 4.4633 8.77735 4.51806L19.376 11.5838C19.6057 11.737 19.6678 12.0474 19.5146 12.2772C19.478 12.3321 19.4309 12.3792 19.376 12.4158Z' fill='rgba(0,0,0,1)'%3E%3C/path%3E%3C/svg%3E");
}

.popZone .bx-prev:hover,
.popZone .bx-next:hover {
  opacity: 1;
}

.popZone .bx-controls-auto-item {
  font-size: 0
}

#section1 .main_btn {
  font-size: 0px;
  width: 10px;
  height: 16px;
  background: transparent url("/resources/homepage/yblib/imgs/pause.svg") no-repeat center center;
  background-size: contain;
}

#section1 .main_btn.on {
  background: url("/resources/homepage/yblib/img/play.svg") no-repeat center center;
  background-size: contain
}

.swiper-slide {
  -webkit-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
}

.popZone .swiper-slide {
  background-size: cover;
  background-position: center center;
}

#section1 .section_bottom {
  max-width: 1200px;
  width: 100%;
  margin: 0 auto;
  height: 123px;
  padding: 0px 20px;
  position: absolute;
  left: 50%;
  bottom: 6%;
  transform: translateX(-50%);
  background: #fff;
  border-radius: 10px;
  box-shadow: 0px 1px 10px rgba(0, 0, 0, 0.15);
  z-index: 5;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

#section1 .section_bottom>.bottom_left {
  width: 44%;
  display: flex;
  border: 1px solid #ccc;
  padding: 14px 20px;
  box-sizing: border-box;
  border-radius: 10px;
  align-items: center;
}

#section1 .section_bottom>.bottom_left>form,
#section1 .section_bottom>.bottom_left>form>.search_box {
  display: flex;
  flex-flow: row nowrap;
  align-items: center;
  flex: 1;
}

#section1 .section_bottom>.bottom_left>form>.search_box>select {
  width: 70px;
  border: 0;
  font-size: 20px;
  font-weight: 300;
  padding-right: 20px;
  box-sizing: border-box;
  color: #01ab9d;
  position: relative;
  -webkit-appearance: none;
  /* for chrome */

  -moz-appearance: none;
  /*for firefox*/

  appearance: none;
  background: url("/resources/homepage/yblib/img/serach_arrow.png") no-repeat right center;
}

#section1 .section_bottom>.bottom_left>form>.search_box>select:focus {
  outline: none;
}

#section1 .section_bottom>.bottom_left>form>.search_box>select::-ms-expand {
  display: none;
  /*for IE10,11*/
}

#section1 .section_bottom>.bottom_left>form>.search_box>input {
  border: 0;
  font-size: 20px;
  padding-left: 20px;
  box-sizing: border-box;
  font-weight: 500;
  vertical-align: -2px;
  height: 40px;
  border-left: 1px solid #dbdbdb;
  margin-left: 18px;
  flex: 1;
}

#section1 .section_bottom>.bottom_left>form>.search_box>input:focus {
  outline: none;
}

#section1 .section_bottom>.bottom_left>form>button {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z' fill='rgba(1,171,157,1)'%3E%3C/path%3E%3C/svg%3E");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: contain;
  margin-left: auto;
  background-color: transparent;
  font-size: 20px;
  color: #777;
  cursor: pointer;
  text-indent: -99999px;
  width: 29px;
  height: 29px;
  display: block;
}

#section1 .section_bottom>.bottom_right {
  width: 54.5%;
  height: 110px;
}

#section1 .section_bottom>.bottom_right>ul {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
}

#section1 .section_bottom>.bottom_right>ul>li {
  flex-basis: 100px;
}

#section1 .section_bottom>.bottom_right>ul>li:last-child {
  border-right: 0;
}

#section1 .section_bottom>.bottom_right>ul>li>a {
  display: flex;
  font-size: 16px;
  font-weight: 500;
  text-align: center;
  flex-flow: column nowrap;
  justify-content: space-between;
  align-items: center;
  padding-top: 80px;
  box-sizing: border-box;
  background: url('/resources/homepage/yblib/img/home_icon01.png') no-repeat center top 16px;
}

#section1 .section_bottom>.bottom_right>ul>li:nth-child(2)>a {
  background: url('/resources/homepage/yblib/img/home_icon02.png') no-repeat center top 16px;
}

#section1 .section_bottom>.bottom_right>ul>li:nth-child(3)>a {
  background: url('/resources/homepage/yblib/img/home_icon03.png') no-repeat center top 16px;
}

#section1 .section_bottom>.bottom_right>ul>li:nth-child(4)>a {
  background: url('/resources/homepage/yblib/img/home_icon04.png') no-repeat center top 16px;
}

#section1 .section_bottom>.bottom_right>ul>li:nth-child(5)>a {
  background: url('/resources/homepage/yblib/img/home_icon05.png') no-repeat center top 16px;
}

#section1 .section_bottom>.bottom_right>ul>li:nth-child(6)>a {
  background: url('/resources/homepage/yblib/img/home_icon06.png') no-repeat center top 16px;
}

.bx-viewport ul li a img {
  display: block;
  margin: 0 auto;
}

#section1 .swiper-pagination .slash {
  display: none;
}

#section1 .main_btn {
  font-size: 0px;
  width: 10px;
  height: 16px;
  background: transparent url('/resources/common/img/pause.svg') no-repeat center center;
  background-size: contain;
}

#section1 .main_btn.on {
  background: url('/resources/common/img/play.svg') no-repeat center center;
  background-size: contain
}

.swiper-slide {
  -webkit-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
}

/* -- section1 -- */

#section2>.fp-tableCell {
  width: 100%;
  height: 100vh;
  background-color: #F5F6F8;
  position: relative;
  z-index: 100;
  overflow: hidden;
}

#section2 .section2_wrapper {
  max-width: 1280px;
  padding: 0px 40px;
  box-sizing: border-box;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
}

#section2 .section2_wrapper>.section2_left {
  width: 48%;
}

#section2 .section2_wrapper>.section2_left>.left_title {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  margin-bottom: 13px;
}

/*#section2 .section2_wrapper > .section2_left > .left_title > h2:before { display: block; content: ''; width: 282px; height: 282px; position: absolute; left: -130%; top: -200%; background: url("/resources/homepage/yblib/img/left_circle.png"); z-index: -1; } */
#section2 .section2_wrapper>.section2_left>.left_title>h2 {
  font-size: 30px;
  position: relative;
}

#section2 .section2_wrapper>.section2_left>.left_title>a {
  display: block;
  width: 40px;
  height: 40px;
  text-indent: -99999px;
  background: url("/resources/homepage/yblib/img/more_icon.svg") no-repeat;
}

#section2 .section2_wrapper>.section2_left>ul {
  width: 100%;
  height: 374px;
  padding: 34px 35px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #dbdbdb;
  border-radius: 10px;
}

#section2 .section2_wrapper>.section2_left>ul::before {
  display: block;
  content: '';
  width: 353px;
  height: 226px;
  background: url("/resources/homepage/yblib/img/sect_bg_right.png");
  position: absolute;
  right: 0;
  top: 0;
}

/*
#section2 .section2_wrapper > .section2_left > ul::after { display: block; content:''; width: 353px; height: 226px; background: url("/resources/homepage/yblib/img/sect_bg_left.png"); position: absolute; left: 0; bottom: 0; }
*/
#section2 .section2_wrapper>.section2_left>ul>li {
  padding-bottom: 20px;
  border-bottom: 1px solid #dbdbdb;
  margin-bottom: 20px;
  display: flex;
  align-items: center;
}

#section2 .section2_wrapper>.section2_left>ul>li::before {
  display: inline-block;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #01ab9d;
  margin-right: 10px;
}

#section2 .section2_wrapper>.section2_left>ul>li:last-child {
  border-bottom: 0px none;
}

#section2 .section2_wrapper>.section2_left>ul>li>a {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: 1;
}

#section2 .section2_wrapper>.section2_left>ul>li>strong {
  font-size: 0;
}

#section2 .section2_wrapper>.section2_left>ul>li>strong::before {
  display: inline-block;
  content: 'NEW';
  font-size: 16px;
  color: #01AB9D;
  font-weight: 600;
  margin-right: 20px;
  vertical-align: middle;
}

#section2 .section2_wrapper>.section2_left>ul>li>span {
  float: right;
  font-size: 14px;
  color: #777;
  margin-left: 10px;
}

#section2 .section2_wrapper>.section2_right {
  width: 48%;
}

#section2 .section2_wrapper>.section2_right>.right_title {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  margin-bottom: 13px;
}

#section2 .section2_wrapper>.section2_right>.right_title>h2 {
  font-size: 30px;
}

#section2 .section2_wrapper>.section2_right>.right_title>a {
  display: block;
  width: 40px;
  height: 40px;
  text-indent: -99999px;
  background: url("/resources/homepage/yblib/img/more_icon.svg") no-repeat;
}

#section2 .section2_wrapper>.section2_right>ul {
  width: 100%;
  height: 374px;
  padding: 34px 35px;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #dbdbdb;
  border-radius: 10px;
}

#section2 .section2_wrapper>.section2_right>ul>li {
  height: 37px;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  padding-bottom: 20px;
  border-bottom: 1px solid #dbdbdb;
  margin-bottom: 20px;
  position: relative;
}

#section2 .section2_wrapper>.section2_right>ul>li>a {
  display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  flex: 1;
}

#section2 .section2_wrapper>.section2_right>ul>li::before {
  display: inline-block;
  content: "";
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #01ab9d;
  margin-right: 10px;
}

#section2 .section2_wrapper>.section2_right>ul>li:last-child {
  border-bottom: 0px none;
}

#section2 .section2_wrapper>.section2_right>ul>li strong {
  margin-right: 20px;
  font-weight: 600;
  font-size: 16px;
  color: #01AB9D;
}

#section2 .section2_wrapper>.section2_right>ul>li span {
  display: inline-block;
  width: 60px;
  padding: 0 10px;
  height: 30px;
  text-align: center;
  border-radius: 4px;
  line-height: 30px;
  border: 1px solid #dbdbdb;
  font-weight: 600;
  color: #777;
  margin-left: 10px;
}

#section2 .section2_wrapper>.section2_right>ul>li span {
  background: #01ab9d;
  color: #fff;
}

#section2 .section2_wrapper>.section2_right>ul>li span.class_end {
  background: #999;
  color: #fff;
}

body.lib_SS #section2 .section2_wrapper>.section2_right>ul>li span.class_end {
  background: #999;
  color: #fff;
}

body.lib_NA #section2 .section2_wrapper>.section2_right>ul>li span.class_end {
  background: #999;
  color: #fff;
}

body.lib_NE #section2 .section2_wrapper>.section2_right>ul>li span.class_end {
  background: #999;
  color: #fff;
}

/*
#section2 .section2_wrapper > .section2_right > ul > li:nth-child(2) span,
#section2 .section2_wrapper > .section2_right > ul > li:nth-child(3) span { background: #01AB9D; color: #fff; } 
*/
#section2 .section2_wrapper>.section2_left h2:before {
  display: block;
  content: '';
  width: 282px;
  height: 282px;
  position: absolute;
  left: -140px;
  top: -100px;
  background: url("/resources/homepage/yblib/img/left_circle.png");
  z-index: -1;
}

#section2>.fp-tableCell::before {
  display: block;
  content: '';
  width: 353px;
  height: 226px;
  background: url("/resources/homepage/yblib/img/sect_bg_right.png");
  position: absolute;
  right: 0;
  top: 0;
  z-index: -1;
}

#section2>.fp-tableCell::after {
  display: block;
  content: '';
  width: 353px;
  height: 226px;
  background: url("/resources/homepage/yblib/img/sect_bg_left.png");
  position: absolute;
  left: 0;
  bottom: 0;
  z-index: -1;
}

#section2 .section2_wrapper::after {
  display: block;
  content: '';
  width: 553px;
  height: 553px;
  position: absolute;
  right: -50px;
  bottom: -10%;
  z-index: -1;
  background: url("/resources/homepage/yblib/img/right_circle.png") no-repeat;
}

#section3 {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  position: relative;
}

#section3 .section3_wrapper {
  max-width: 1280px;
  padding: 0px 40px;
  box-sizing: border-box;
  margin: 0 auto;
  margin-top: -330px;
  display: flex;
  align-items: center;
  position: relative;
}

/*
#section3::before { display: block; content: ''; width: 289px; height: 289px; background: url("/resources/homepage/yblib/img/sec3_dot2.png") no-repeat; position: absolute; left: 10%; bottom: 0; } 
#section3::after { display: block; content: ''; width: 452px; height: 394px; background: url("/resources/homepage/yblib/img/sec3_dotcircle.svg") no-repeat; position: absolute; right: -35px; top: -210px; z-index: -4; } 
*/
#section3 .section3_wrapper>.pick_title>h2 {
  font-size: 30px;
  margin-right: 36px;
  font-weight: 400;
  letter-spacing: 2px;
}

#section3 .section3_wrapper>.pick_menu>ul {
  display: flex;
  gap: 20px;
}

#section3 .section3_wrapper>.pick_menu>ul>li>a::before {
  display: inline-block;
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #01ab9d;
  vertical-align: middle;
  margin-right: 5px;
}

.lib_SS #section3 .section3_wrapper>.pick_menu>ul>li>a::before {
  background: #37A4E9;
}

.lib_NA #section3 .section3_wrapper>.pick_menu>ul>li>a::before {
  background: #9F00BA;
}

.lib_NE #section3 .section3_wrapper>.pick_menu>ul>li>a::before {
  background: #FF9114;
}

.lib_NR #section3 .section3_wrapper>.pick_menu>ul>li>a::before {
  background: #2634B2;
}

.lib_CH #section3 .section3_wrapper>.pick_menu>ul>li>a::before {
  background: #1f58a7;
}

#section3 .section3_wrapper>.pick_menu>ul>li>a {
  display: inline-block;
  font-size: 20px;
  vertical-align: middle;
  opacity: 0.3;
  line-height: 1;
}

#section3 .section3_wrapper>.pick_menu>ul>li>a.active {
  opacity: 1;
  font-weight: 600;
}

#section3 .commend_wrapper {
  position: absolute;
  left: 0;
  top: 50px;
  max-width: 1280px;
  padding: 0px 40px;
  box-sizing: border-box;
  height: 500px;
  background: #ccc;
  display: flex;
}

.gallery-thumb-box p.story {
  display: none;
}

/* -- section3 -- */

#footer {
  border-top: 1px solid #dbdbdb;
  background: #333;
}

.footer_wrap {
  background: #333;
}


.rolling_box {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100px;
}



#fp-nav {
  left: 70px;
  width: 100px;
  top: 55%;
}

#fp-nav ul {
  width: 10px;
  position: relative !important;
}

#fp-nav ul::after {
  display: block;
  content: '';
  height: 100%;
  width: 1px;
  background: #CCEEEB;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
}

.lib_SS #fp-nav ul::after {
  background: #D2E4F0;
}

.lib_NA #fp-nav ul::after {
  background: #E3C6E8;
}

.lib_NE #fp-nav ul::after {
  background: #F4DEC6;
}

.lib_NR #fp-nav ul::after {
  background: #DCDEF2;
}

.lib_CH #fp-nav ul::after {
  background: #D8E8FF;
}

#fp-nav ul li,
.fp-slidesNav ul li {
  width: 10px;
  height: 10px;
  margin: 0;
  margin-bottom: 40px;
  cursor: pointer;
}

#fp-nav ul li:last-child,
.fp-slidesNav ul li:last-child {
  margin-bottom: 0;
}

#fp-nav ul li a span,
.fp-slidesNav ul li a {
  margin: 0;
  cursor: pointer;
}

#fp-nav ul li a span,
.fp-slidesNav ul li a span {
  width: 10px;
  height: 10px;
  background: #CCEEEB;
  box-sizing: border-box;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  cursor: pointer;
  box-shadow: none;
}


#fp-nav ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span {
  width: 12px;
  height: 12px;
  margin: 0;
  background: #01AB9D;
  box-shadow: none;
}


#fp-nav ul li:hover a span,
.fp-slidesNav ul li:hover a span {
  width: 12px;
  height: 12px;
  margin: 0;
  background: #01AB9D;
  box-shadow: none;
}

#fp-nav ul li .fp-tooltip.right {
  opacity: 1;
  width: 120px;
  right: -135px;
  top: -4px;
  color: #ababab;
  font-size: 18px;
  font-weight: 600;
  font-family: "Pretendard";
}

#fp-nav ul li a.active+.fp-tooltip.right {
  color: #fff;
  font-weight: 500;
}

body.fp-viewing-1 #fp-nav ul li a.active+.fp-tooltip.right {
  color: #01ab9d;
}

body.lib_SS.fp-viewing-1 #fp-nav ul li a.active+.fp-tooltip.right {
  color: #37a4e9;
}

body.lib_NA.fp-viewing-1 #fp-nav ul li a.active+.fp-tooltip.right {
  color: #9f00ba;
}

body.lib_NE.fp-viewing-1 #fp-nav ul li a.active+.fp-tooltip.right {
  color: #ff9114;
}

body.lib_NR.fp-viewing-1 #fp-nav ul li a.active+.fp-tooltip.right {
  color: #2634B2;
}

body.lib_CH.fp-viewing-1 #fp-nav ul li a.active+.fp-tooltip.right {
  color: #1f58a7;
}

body.fp-viewing-2 #fp-nav ul li a.active span,
body.lib_SS.fp-viewing-2 #fp-nav ul li a.active span,
body.lib_NA.fp-viewing-2 #fp-nav ul li a.active span,
body.lib_NE.fp-viewing-2 #fp-nav ul li a.active span,
body.lib_NR.fp-viewing-2 #fp-nav ul li a.active span,
body.lib_CH.fp-viewing-2 #fp-nav ul li a.active span {
  background: #fff;
}

#fp-nav ul li:last-child {
  display: none;
}

/**/
#fp-nav.active ul li a span,
.fp-slidesNav ul li a span {
  width: 10px;
  height: 10px;
  background: #CCEEEB;
  box-sizing: border-box;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  cursor: pointer;
  box-shadow: none;
}


#fp-nav.active ul li a.active span,
.fp-slidesNav ul li a.active span,
#fp-nav ul li:hover a.active span,
.fp-slidesNav ul li:hover a.active span {
  width: 12px;
  height: 12px;
  margin: 0;
  box-shadow: none;
}


#fp-nav.active ul li:hover a span,
.fp-slidesNav ul li:hover a span {
  width: 12px;
  height: 12px;
  margin: 0;
  background: #01AB9D;
  box-shadow: none;
}

#fp-nav.active ul li:hover a span {
  background: #fff;
}

#fp-nav.active ul li a.active span {
  background: #fff;
}

#fp-nav.active ul li .fp-tooltip.right {
  opacity: 0.6;
  width: 120px;
  right: -135px;
  top: -10px;
  color: #fff;
  font-size: 22px;
  font-weight: 600;
  font-family: "Pretendard";
}

#fp-nav.active ul li a.active+.fp-tooltip.right {
  color: #fff;
  font-weight: 700;
  opacity: 1;
}

.fp-viewing-3rdPage #fp-nav ul li a span {
  background: #fff;
}

/* -- page navigation --*/



.gallery-box {
  max-width: 1280px;
  width: 100%;
  padding: 0px 40px;
  box-sizing: border-box;
  height: 370px;
  margin: 0 auto;
  display: flex;
  align-items: center;
  position: absolute;
  left: 0;
  top: 70px;
}

.gallery-box .gallery-main-box::before {
  display: block;
  content: '';
  width: 10000px;
  height: 394px;
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  background: linear-gradient(241.44deg, #01AB78 0%, #01AB9D 10%);
  border-radius: 0px 20px 20px 0px;
}

.gallery-box .gallery-main-box::after {
  display: block;
  content: '';
  width: 684px;
  height: 354px;
  position: absolute;
  right: -85%;
  top: 50%;
  transform: translateY(-38%);
  background: #fff;
  border: 1px solid #dbdbdb;
  box-sizing: border-box;
  border-radius: 20px;
  z-index: -1;
}

.gallery-box .gallery-main-box {
  width: 49%;
  padding-right: 60px;
  position: relative;
}

.gallery-box .gallery-main-box .swiper-slide .info-img {
  min-width: 210px;
  height: 320px;
  background: no-repeat center center;
  background-size: cover;
  margin-right: 30px;
  border-radius: 5px;
  overflow: hidden;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  position: relative;
}

/* error 이미지 대체 */
.gallery-box .gallery-main-box .swiper-slide .info-img::before {
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  background-image: url('/resources/common/img/noImg.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
}

.gallery-box .gallery-main-box .swiper-slide .detail_box {
  display: none;
}

.gallery-box .gallery-main-box .swiper-slide .title_box {
  margin-bottom: 40px;
}

.gallery-box .gallery-main-box .swiper-slide .title_box h3 {
  margin-bottom: 10px;
  color: #fff;
}

.gallery-box .gallery-main-box .swiper-slide .title_box h3>a {
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  line-height: 125%;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.gallery-box .gallery-main-box .swiper-slide .title_box p {
  font-size: 18px;
  color: #fff;
}

.gallery-box .gallery-main-box .swiper-slide .story_con strong {
  display: block;
  background: url("/resources/homepage/yblib/img/story_icon.png") no-repeat left center;
  font-size: 18px;
  margin-bottom: 20px;
  padding: 2px 0px 2px 28px;
  color: #fff;
}

.gallery-box .gallery-main-box .swiper-slide .story_con p {
  line-height: 1.8em;
  color: #fff;
  font-weight: 500;
}

.gallery-box .gallery-main-box .swiper-slide.swiper-slide-active .detail_box {
  display: block;
  width: 350px;
}

.slide_wrap {
  width: 100%;
  height: auto;
  display: flex;
  align-items: flex-start;
}

.gallery-box .gallery-thumb-box .swiper-wrapper .gallery-box .control-wrap>div:hover {
  background-color: #000;
}

.gallery-box .gallery-thumb-box .swiper-wrapper {
  left: 24px;
}

.gallery-box .gallery-thumb-box {
  width: 45%;
  overflow: hidden;
  padding-top: 80px;
  box-sizing: border-box;
}

.gallery-box .gallery-thumb-box .swiper-slide {
  width: 150px
}

.gallery-box .gallery-thumb-box .swiper-slide a {
  display: block;
  border-radius: 5px;
  border: 1px solid #d5d5d5;
  background: no-repeat center center;
  background-size: cover;
  width: 150px;
  height: 226px;
  position: relative;
  overflow: hidden;
}

/* error 이미지 대체 */
.gallery-box .gallery-thumb-box .swiper-slide a::before {
  display: block;
  content: '';
  width: 100%;
  height: 100%;
  background-image: url('/resources/common/img/noImg.jpg');
  background-repeat: no-repeat;
  background-position: center center;
  background-size: cover;
  position: absolute;
  left: 0;
  top: 0;
  z-index: -1;
}

.gallery-box .gallery-thumb-box .swiper-slide .title_box {
  width: 150px;
}

.gallery-box .gallery-thumb-box h3 {
  width: 150px;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  font-weight: 700;
  font-size: 15px;
  margin-top: 15px;
  margin-bottom: 7px;
}

.gallery-box .gallery-thumb-box p {
  font-size: 14px;
  color: #252525;
  opacity: 70;
  display: -webkit-box;
  text-overflow: ellipsis;
  overflow: hidden;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
}

.object-fit img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.gallery-box .control-wrap {
  position: absolute;
  right: 40px;
  top: -5%;
  width: 140px;
  display: flex;
  justify-content: space-between;
}

.gallery-box .control-wrap>a {
  display: block;
  width: 40px;
  height: 40px;
  text-indent: -99999px;
  cursor: pointer;
}

.gallery-box .control-wrap .swiper-gallery-prev {
  background: url("/resources/homepage/yblib/img/pick_prev.png") no-repeat;
  background-size: contain;
}

.gallery-box .control-wrap .swiper-gallery-next {
  background: url("/resources/homepage/yblib/img/pick_next.png") no-repeat;
  background-size: contain;
}

.gallery-box .control-wrap .swiper-gallery-more {
  background: url("/resources/homepage/yblib/img/more_icon.svg") no-repeat;
  background-size: contain;
}

.gallery-box .control-wrap2 {
  position: absolute;
  right: 40px;
  top: -5%;
  width: 140px;
  display: flex;
  justify-content: space-between;
}

.gallery-box .control-wrap2>a {
  display: block;
  width: 40px;
  height: 40px;
  text-indent: -99999px;
  cursor: pointer;
}

.gallery-box .control-wrap2 .swiper-gallery-prev2 {
  background: url("/resources/homepage/yblib/img/pick_prev.png") no-repeat;
  background-size: contain;
}

.gallery-box .control-wrap2 .swiper-gallery-next2 {
  background: url("/resources/homepage/yblib/img/pick_next.png") no-repeat;
  background-size: contain;
}

.gallery-box .control-wrap2 .swiper-gallery-more2 {
  background: url("/resources/homepage/yblib/img/more_icon.svg") no-repeat;
  background-size: contain;
}


.gallery-box .control-wrap3 {
  position: absolute;
  right: 40px;
  top: -5%;
  width: 140px;
  display: flex;
  justify-content: space-between;
}

.gallery-box .control-wrap3>a {
  display: block;
  width: 40px;
  height: 40px;
  text-indent: -99999px;
  cursor: pointer;
}

.gallery-box .control-wrap3 .swiper-gallery-prev3 {
  background: url("/resources/homepage/yblib/img/pick_prev.png") no-repeat;
  background-size: contain;
}

.gallery-box .control-wrap3 .swiper-gallery-next3 {
  background: url("/resources/homepage/yblib/img/pick_next.png") no-repeat;
  background-size: contain;
}

.gallery-box .control-wrap3 .swiper-gallery-more3 {
  background: url("/resources/homepage/yblib/img/more_icon.svg") no-repeat;
  background-size: contain;
}

#section3 .category1 .gallery-box {
  display: flex;
}

#section3 .category2 .gallery-box {
  display: none;
}

#section3 .category3 .gallery-box {
  display: none;
}

.gallery-main-box .swiper-slide-active img {
  box-shadow: 0px 0px 20px 0px rgba(42, 241, 224, 0.2);
}

/* 신착도서 목록 */
.section_header {
  padding: 42px 0;
  border-bottom: solid 1px #ddd;
  margin-bottom: 20px;
}

.section_header:after {
  display: block;
  content: "";
  clear: both;
}

.section_header h3 {
  font-size: 31px;
  color: #333;
  font-weight: 900;
  float: left;
}

.section_header h3:before {
  display: inline-block;
  content: "";
  width: 16px;
  height: 16px;
  border-radius: 50%;
  margin: 0 10px 0 0;
  vertical-align: middle;
  background: #01AB9D;
}

.section_header ol {
  float: right;
  padding-top: 8px;
}

.section_header ol li {
  display: inline-block;
  padding-left: 18px;
  height: 18px;
  vertical-align: middle;
  color: #777;
  background: no-repeat 0 center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M13.1714 12.0007L8.22168 7.05093L9.63589 5.63672L15.9999 12.0007L9.63589 18.3646L8.22168 16.9504L13.1714 12.0007Z' fill='rgba(173,184,194,1)'%3E%3C/path%3E%3C/svg%3E");
}

.section_header ol .page_loc_home {
  font-size: 0;
  background: no-repeat 0 center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M19 21.0001H5C4.44772 21.0001 4 20.5524 4 20.0001V11.0001L1 11.0001L11.3273 1.61162C11.7087 1.26488 12.2913 1.26488 12.6727 1.61162L23 11.0001L20 11.0001V20.0001C20 20.5524 19.5523 21.0001 19 21.0001ZM13 19.0001H18V9.15757L12 3.70302L6 9.15757V19.0001H11V13.0001H13V19.0001Z' fill='rgba(0,0,0,.4)'%3E%3C/path%3E%3C/svg%3E");
}

.search_condition_wrap:after {
  display: block;
  content: "";
  clear: both;
}


section.section {
  float: right;
  width: 960px;
}

/* .class_btn {margin-bottom: 60px;}
.class_btn::after {display: block; content: ''; clear: both;} */
.class_btn {
  margin-bottom: 60px;
  display: flex;
  align-items: center;
}

.class_btn a {
  display: block;
  width: 50%;
  padding: 16px 10px;
  box-sizing: border-box;
  border: 1px solid #dbdbdb;
  background: #f5f5f5;
  border-bottom: 1px solid #484848;
  border-radius: 5px 5px 0px 0px;
  color: #777;
  font-weight: 500;
  float: left;
  text-align: center;
}

.class_btn a.on {
  background: #fff;
  border: 1px solid #484848;
  border-bottom: 1px solid #fff;
  color: #252525;
  font-weight: 600;
}

.class_mid {
  display: flex;
  flex-flow: row nowrap;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.class_mid article {
  height: 40px;
}

.class_mid .time_area {
  padding: 0px 20px;
  padding-top: 6px;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
}

.class_mid .time_area strong {
  font-weight: 600;
}

.class_mid .time_area .time {
  font-weight: 600;
  margin-left: 5px;
  color: #01ab9d;
}

.class_mid .count {
  color: #01ab9d;
  font-weight: 500;
  margin-right: 5px;
}

.class_mid .page_count {
  color: #01AB9D;
  font-weight: 500;
}

.class_mid .c_search_area input {
  width: 300px;
  height: 40px;
  padding: 0px 15px;
  border: 1px solid #dbdbdb;
  color: #757575;
  font-weight: 500;
  vertical-align: middle;
}

.class_mid .c_search_area button {
  width: 38px;
  height: 40px;
  padding: 0px 16px;
  background: #01ab9d url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath fill='none' d='M0 0h24v24H0z'/%3E%3Cpath d='M18.031 16.617l4.283 4.282-1.415 1.415-4.282-4.283A8.96 8.96 0 0 1 11 20c-4.968 0-9-4.032-9-9s4.032-9 9-9 9 4.032 9 9a8.96 8.96 0 0 1-1.969 5.617zm-2.006-.742A6.977 6.977 0 0 0 18 11c0-3.868-3.133-7-7-7-3.868 0-7 3.132-7 7 0 3.867 3.132 7 7 7a6.977 6.977 0 0 0 4.875-1.975l.15-.15z' fill='rgba(255,255,255,1)'/%3E%3C/svg%3E") no-repeat center center;
  font-size: 0;
  border-radius: 5px;
  box-sizing: initial;
}

.class_mid select {
  height: 40px;
  border: 1px solid #dbdbdb;
  vertical-align: middle;
  box-sizing: border-box;
  color: #757575;
}

.must .table_wrap {
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  /*overflow: hidden;*/
  margin-bottom: 34px;
}

.table_wrap+.table_top {
  margin: -20px 0 0 0;
}

.table_wrap+.table_top+.page_nav {
  padding-top: 0;
}

table.class_table {
  border-radius: 5px;
}

table.class_table thead th {
  padding: 14px 10px;
  color: #252525;
  font-weight: 600;
  box-sizing: border-box;
  border: 1px solid #dbdbdb;
  border-top: 0px none;
}

table.class_table thead th.name {
  width: 200px;
}

table.class_table thead th.target {
  width: 150px;
}

table.class_table td {
  padding: 15px 10px;
  color: #252525;
}

table td.num {
  font-size: 16px;
}

/* table.class_table thead th span,table.class_table tbody td span {display: block} */

/*table.class_table tbody tr:last-child td {border-bottom: 0px none;}*/
table.class_table tr> :first-child {
  /*border-right: 0px none;*/
  border-left: 0 none;
}

.page_nav button {
  border-radius: 3px;
}

.page_nav button[disabled],
.page_nav button[disabled]:hover,
.page_nav button[disabled]:focus {
  color: #fff;
  background-color: #01ab9d;
}

/* --- 문화강좌 디테일 --- */

.culture_area {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin-bottom: 50px;
}

.culture_img {
  width: 50%;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  overflow: hidden;
  font-size: 0;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.15);
}

.culture_img .cover_img {
  display: block;
  height: 450px;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.culture_intro {
  width: 100%;
  margin-left: 50px;
}

.culture_intro h4 {
  font-size: 30px;
  margin-bottom: 24px;
  color: #252525;
}

.culture_intro li {
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: 500;
  color: #454545;
}

.culture_intro li span.con {
  width: auto;
  color: #454545;
  font-weight: 500;
}

.culture_intro li span.day {
  width: auto;
  font-weight: 500;
  color: #454545;
}

.culture_intro li span.red {
  color: #ff0000;
  font-weight: 600;
}

.culture_intro li:last-child {
  margin-bottom: 40px;
  color: #ff0000;
  font-weight: 500;
}

.culture_intro li span.sub_title {
  display: inline-block;
  width: 135px;
  font-size: 18px;
  font-weight: 600;
  color: #252525;
}

.culture_intro li.file_list span.file_ico {
  display: inline-block;
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M5 5V19H19V7.82843L16.1716 5H5ZM4 3H17L20.7071 6.70711C20.8946 6.89464 21 7.149 21 7.41421V20C21 20.5523 20.5523 21 20 21H4C3.44772 21 3 20.5523 3 20V4C3 3.44772 3.44772 3 4 3ZM12 18C10.3431 18 9 16.6569 9 15C9 13.3431 10.3431 12 12 12C13.6569 12 15 13.3431 15 15C15 16.6569 13.6569 18 12 18ZM6 6H15V10H6V6Z' fill='rgba(30,50,228,1)'%3E%3C/path%3E%3C/svg%3E");
}

.culture_intro li.file_list span.con a {
  color: #1E32E4;
  font-weight: 600;
}

.culture_intro .culture_table {
  border: 1px solid #dbdbdb;
}

.culture_intro .culture_table th {
  font-weight: 600;
  border-bottom: 1px solid #e1e1e0;
  background: #f2f2f2;
}

.culture_intro .culture_table td {
  text-align: center;
  padding: 14px 10px;
}

.culture_info {
  padding: 36px 30px;
  background: #f9f9f9;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
}

.culture_info .h4 {
  font-size: 22px;
  margin-bottom: 20px;
  color: #252525;
}

.culture_info .h4:before {
  display: inline-block;
  content: 'i';
  font-size: 16px;
  color: #01AB9D;
  border: 2px solid #01AB9D;
  padding: 0px 9px 0px;
  margin-right: 10px;
  border-radius: 50%;
  font-weight: 700;
  vertical-align: middle;
}

.culture_info .h4:last-of-type:before {
  transform: rotate(180deg);
}

.culture_info .h4:last-of-type {
  margin-top: 30px;
  margin-bottom: 20px;
}

.culture_info strong {
  display: block;
  margin-bottom: 15px;
  font-size: 18px;
  color: #ff0000;
}

.culture_info p {
  padding: 5px 0px;
  line-height: 1.2em;
  color: #757575;
}

.culture_info p:last-of-type {
  font-weight: 600;
  font-size: 17px;
}

.culture_info p:last-of-type:before {
  display: inline-block;
  content: '';
  width: 5px;
  height: 5px;
  background: #757575;
  border-radius: 50%;
  vertical-align: middle;
  margin-right: 10px;
}

/* --- 행사일정 ---*/
.calandar_wrap .top {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 20px;
}

.date {
  position: relative;
  padding: 0px 45px;
  width: 255px;
  box-sizing: border-box;
}

.date .h4 {
  font-size: 26px;
  font-weight: 900;
  padding: 0;
  color: #252525;
  padding-right: 33px;
  background: url('/resources/homepage/yblib/img/calendar.svg') no-repeat right top;
}

.date button {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  font-size: 0;
  background-color: transparent;
  width: 8px;
  height: 15px;
}

.date button.prev_month {
  left: 0;
  background: url('/resources/homepage/yblib/img/prev_month.svg') no-repeat center center;
  background-size: contain;
}

.date button.next_month {
  right: 0;
  background: url('/resources/homepage/yblib/img/next_month.svg') no-repeat center center;
  background-size: contain;
}

.calandar_wrap .top .what_day strong {
  display: inline-block;
  width: 100px;
  height: 35px;
  text-align: center;
  line-height: 35px;
  border-radius: 5px;
  box-sizing: border-box;
}

.calandar_wrap .top .what_day {
  display: flex;
  flex-flow: row nowrap;
  gap: 5px;
}

.calandar_wrap .top .what_day strong.today {
  background: #fff;
  color: #01AB9D;
  border: 2px solid #01AB9D;
  line-height: 33px;
}

.calandar_wrap .top .what_day strong.holiday {
  background: #0277BD url('/resources/homepage/yblib/img/line_1.svg') no-repeat center center;
  background-size: contain;
  color: #ffffff;
}

.calandar_wrap .top .what_day strong.classday {
  background: #AD1457 url('/resources/homepage/yblib/img/line_2.svg') no-repeat center center;
  background-size: contain;
  color: #ffffff;
}

.calandar_wrap .top .what_day strong.festival {
  background: #00695C url('/resources/homepage/yblib/img/line_3.svg') no-repeat center center;
  background-size: contain;
  color: #ffffff;
}

.calandar_wrap .table {
  border: 0px none;
}

.calandar_wrap .table thead th,
.calandar_wrap .table tbody td {
  background: #fff;
  border: 0px none;
  border-right: 1px solid #dbdbdb;
}

.calandar_wrap .table tr {
  border-bottom: 1px solid #dbdbdb;
}

.calandar_wrap .table tr th:last-of-type,
.calandar_wrap .table tr td:last-of-type {
  border-right: 0px none;
}

.calandar_wrap .table tbody tr:last-of-type,
.calandar_wrap .table tbody tr:last-child td {
  border-bottom: 0px none;
}

.calandar_wrap .table thead th {
  color: #252525;
  font-size: 18px;
  font-weight: 600;
}

.calandar_wrap .table tbody td {
  height: 150px;
  vertical-align: top;
  padding: 14px;
  box-sizing: border-box;
  color: #777;
  position: relative;
}

.calandar_wrap .table tbody td.gray {
  background: #ededed;
}

.calandar_wrap .table tbody td.today {
  box-shadow: 0px 0px 0px 3px #01AB9D inset;
}

.calandar_wrap .table tbody td span {
  display: block;
  position: absolute;
  width: 100%;
  left: 0px;
  box-sizing: border-box;
  color: #fff;
  padding: 5px 0px 5px 14px;
  border-radius: 2px;
  margin-top: 5px;
}

.calandar_wrap .table tbody td span.holiday {
  background: #0277BD url('/resources/homepage/yblib/img/line_1.svg') no-repeat center center;
  background-size: cover;
}

.calandar_wrap .table tbody td span.classday {
  background: #AD1457 url('/resources/homepage/yblib/img/line_2.svg') no-repeat center center;
  background-size: cover;
}

.calandar_wrap .table tbody td span.festival {
  background: #00695C url('/resources/homepage/yblib/img/line_3.svg') no-repeat center center;
  background-size: cover;
  margin-top: 40px;
}

.calandar_wrap .table tbody td span.classday:last-of-type {
  width: 960px;
  z-index: 1;
  background: #AD1457 url('/resources/homepage/yblib/img/line_4.svg') no-repeat left 14px center;
  background-size: contain;
}

.h4_deco {
  font-size: 22px;
  font-weight: 700;
  color: #252525;
  margin-bottom: 20px;
  padding-top: 10px;
  padding-left: 20px;
  position: relative;
}

.h4_deco:before {
  display: inline-block;
  content: '';
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #01AB9D;
  position: absolute;
  left: 0;
  top: 13px;
}

.today_sche .sche_table {
  border-top: 0px none;
}

.today_sche .sche_table thead th {
  color: #252525;
  font-weight: 600;
  background: #f1f1f1;
}

.today_sche .sche_table tbody td {
  text-align: center;
  color: #252525;
  padding: 18px 14px;
  font-weight: 500;
}

.today_sche .sche_table tbody td:first-child {
  font-weight: 600;
}

.today_sche .sche_table tbody tr:last-child td {
  border-bottom: 0px none;
}

.table_wrap+.h4_deco {
  margin-top: 32px;
}

.dl_table+.h4_deco {
  margin-top: 32px;
}

table.event_cal {
  border-top: 1px solid #e5e8eb;
}

.subpage #calendar table.event_cal td div {
  padding: 14px 6px 0;
  font-weight: 600;
  font-size: 17px;
}

.subpage #calendar table.event_cal td ul {
  padding: 4px 6px;
}

.subpage #calendar table.event_cal td ul li a {
  font-size: 14px;
  font-weight: 400;
  color: #757575;
  line-height: 1.1em;
}

#calendar table.cal-tbl th.sat,
#calendar table.cal-tbl td.sat div {
  color: #1E32E4;
}

#calendar table.cal-tbl th.sun,
#calendar table.cal-tbl td.sun div {
  color: #DF0043;
}



/* --- 행사일정 list --- */
.subpage #calendar table.cal-tbl thead th {
  background: #f2f2f2;
  font-weight: 600;
}

#calendarListTable th,
.subpage #calendar table.event_list tbody td {
  padding: 14px 10px;
}

.subpage #calendar table.cal-tbl tbody th {
  background: #fff;
  font-weight: 600;
  width: 7%;
}

.subpage #calendar table.cal-tbl tbody th.sun_day {
  color: #DF0043;
}

.subpage #calendar table.cal-tbl tbody th.sat_day {
  color: #1E32E4;
}

.subpage #calendar table.event_cal td li {
  padding: 6px 0;
}

.subpage #calendar table.event_lis td li {
  padding: 3px 0;
}

/* --- 도서관 갤러리 --- */
.gallery_container {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  gap: 12px 0px;
  margin-bottom: 34px;
}

.gallery_container .gallery_box {
  width: 24%;
  padding: 14px;
  box-sizing: border-box;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  transition: all 0.2s;
}

.gallery_container .gallery_box a span {
  display: block;
  height: 160px;
  font-size: 0;
  margin-bottom: 16px;
  border: 1px solid #dbdbdb;
  border-radius: 3px;
  background: no-repeat center center;
}


.gallery_container .gallery_box h4 {
  font-size: 18px;
  color: #252525;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  margin-bottom: 12px
}

.gallery_container .gallery_box p {
  color: #757575;
  font-weight: 400;
}

.gallery_container .gallery_box p:first-of-type {
  margin-bottom: 10px;
}

.gallery_container .gallery_box:hover {
  border: 1px solid #01AB78;
}

/* --- 도서관 갤러리 View --- */
.board_wrap {
  margin-bottom: 40px;
}

.board_wrap .h4 {
  font-size: 18px;
  color: #252525;
  padding: 25px;
  background: #f9f9f9;
  border-radius: 5px 5px 0px 0px;
  border-bottom: 1px solid #dbdbdb;
}

.board_wrap .write_info {
  padding: 25px;
  border-bottom: 1px solid #dbdbdb;
  margin-bottom: 40px;
}

.board_wrap .write_info dt,
.board_wrap dl dd {
  display: inline-block;
  color: #484848;
}

.board_wrap .write_info dt {
  padding-right: 10px;
  border-right: 1px solid #dbdbdb;
  margin-right: 5px;
}

.board_wrap .write_info dd {
  margin-right: 20px;
}

.board_wrap .write_info dd:last-of-type {
  margin-right: 0px;
}

.board_wrap .board_content {
  border-bottom: 1px solid #dbdbdb;
  padding: 0px 25px 40px;
}

.board_wrap .board_content p {
  text-align: center;
}

.board_wrap .board_updown::after {
  display: block;
  content: '';
  clear: both;
}

.board_wrap .board_updown dt,
.board_wrap .board_updown dd {
  padding: 20px 25px;
  color: #252525;
  float: left;
  box-sizing: border-box;
  border-bottom: 1px solid #dbdbdb;
}

.board_wrap .board_updown dt {
  width: 100px;
  background: url('/resources/homepage/yblib/img/board_next.svg') no-repeat right 10px center;
}

.board_wrap .board_updown dd+dt {
  background: url('/resources/homepage/yblib/img/board_prev.svg') no-repeat right 10px center;
}

.board_wrap .board_updown dd {
  width: calc(100% - 100px);
}

.go_btn {
  text-align: right;
  margin-top: 15px;
}

.go_btn a {
  display: inline-block;
  min-width: 100px;
  height: 40px;
  border-radius: 5px;
  background: #aeaeae;
  color: #fff;
  font-weight: 500;
  text-align: center;
  line-height: 39px;
  padding: 0px 10px;
}

.go_btn a.go_modify {
  background: #01AB9D;
}

.go_btn button.go_del {
  background: #252525;
  color: #fff;
  width: 100px;
  height: 40px;
  border-radius: 5px;
  margin: 0;
  vertical-align: top;
  text-align: center;
}


/* 공지게시판 d10_notice_view */

.notice_view_content_wrap {
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  margin-bottom: 20px;
}

.board_wrap h4,
.notice_view_content_wrap h4 {
  height: 60px;
  background: #f9f9f9;
  color: #252525;
  font-size: 18px;
  font-weight: 800;
  border-radius: 5px 5px 0px 0px;
  line-height: 60px;
  padding-left: 25px;
}

.notice_detail_wrap {
  height: 55px;
  border-bottom: 1px solid #dbdbdb;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.notice_detail_wrap .notice_detail {
  padding: 0 25px;
}

.notice_detail_wrap .notice_detail div {
  font-size: 16px;
  color: #484848;
  display: flex;
}

.notice_detail_wrap .notice_detail div p:nth-child(1) {
  display: flex;
  align-items: center;
  font-weight: 700;
}

.notice_detail_wrap .notice_detail div p:nth-child(1)::after {
  content: "";
  display: block;
  background: #dbdbdb;
  width: 1px;
  height: 10px;
  margin: 0 10px;
}

.notice_detail_wrap .notice_detail div a {
  font-size: 16px;
  color: #484848;
}

.notice_detail_wrap .notice_detail_right {
  display: flex;
}

.notice_detail_wrap .notice_detail_right div:nth-child(2) {
  padding: 0 30px;
}

.notice_detail_content {
  padding: 50px 25px;
}

.notice_detail_content .notice_view_content {
  width: 540px;
  height: 540px;
  margin-bottom: 20px;
}

.notice_detail_content p {
  color: #252525;
  font-size: 18px;
  line-height: 1.6;
}

.view_list_wrap {
  border: 1px solid #dbdbdb;
  border-radius: 5px;
}

.view_list_wrap .view_list_prev {
  border-bottom: 1px solid #dbdbdb;
}

.view_list_wrap .view_list_btn {
  height: 55px;
  padding-left: 25px;
  display: flex;
  align-items: center;
}

.view_list_wrap .view_list_btn a {
  display: flex;
}

.view_list_wrap .view_list_btn a p {
  font-size: 16px;
}

.view_list_wrap .view_list_btn a p:nth-child(1) {
  margin-right: 20px;
  font-weight: 600;
  display: flex;
  align-items: center;
}

.view_list_wrap .view_list_prev a p:nth-child(1)::after {
  content: "";
  display: block;
  height: 12px;
  width: 15px;
  background: url("/resources/homepage/yblib/img/top_icon.png")no-repeat center center;
  margin-left: 8px;
}

.view_list_wrap .view_list_next a p:nth-child(1)::after {
  content: "";
  display: block;
  height: 12px;
  width: 15px;
  background: url("/resources/homepage/yblib/img/bottom_icon.png")no-repeat center center;
  margin-left: 8px;
}

.section .d10_list_btn_wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 50px 0 110px;
}

.section .d10_list_btn_wrap .d10_list_btn {
  background: #01AB9D;
  color: #fff;
  font-weight: 700;
  font-size: 17px;
  padding: 16px 26px;
  border-radius: 5px;
  display: inline-block;
}



.d_writer {
  width: 60px;
}

.d_view {
  width: 50px;
}

.d_time {
  width: 100px;
}

.d_addfile {
  width: 50px;
}

.no {
  width: 40px;
}

/* .no {color: #252525; font-weight: 600; width: 80px;} */
.answer_icon {
  width: 8px;
  height: 8px;
  background: url("/resources/homepage/yblib/img/message_line.svg")no-repeat center center;
  background-size: cover;
  margin-right: 8px;
  display: inline-block;
  font-size: 0;
}

.lock_icon {
  width: 15px;
  height: 15px;
  background: url("/resources/homepage/yblib/img/lock_line.svg")no-repeat center center;
  margin-left: 4px;
  display: inline-block;
  font-size: 0;
  transform: translateY(-20%);
}

.class_search {
  width: 360px;
}

.attached_file {
  width: 20px;
  height: 20px;
  display: block;
  margin: 0 auto;
  background: url("/resources/homepage/yblib/img/attached_file_icon.gif")no-repeat center center;
  background-size: cover;
}


/*--- 사서 추천 도서 --- */
.lib_wrap {
  position: relative;
  margin-bottom: 36px;
}

.top_wrap {
  margin-bottom: 40px;
  position: relative;
}

.top_wrap .date {
  margin: 0 auto;
}

.top_wrap .total {
  position: absolute;
  right: 0px;
  top: 50%;
  transform: translateY(-50%);
  color: #252525;
  font-weight: 600;
}

.lib_list {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  gap: 15px 0px;
  margin-bottom: 50px;
}

.lib_list>article {
  width: 49%;
  padding: 28px;
  box-sizing: border-box;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  display: flex;
  flex-flow: column;
  justify-content: space-between;
}

.lib_list>article .top {
  position: relative;
  padding-left: 160px;
  margin-bottom: 10px;
}

.lib_list>article a>span {
  display: inline-block;
  width: 134px;
  height: 187px;
  border: 1px solid #ebebeb;
  border-radius: 5px;
  background-size: cover;
  position: absolute;
  left: 0px;
  top: 0px;
}

.lib_list>article h5 {
  font-size: 18px;
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin-bottom: 20px;
  line-height: 1.3em;
  color: #252525;
  font-weight: 600;
}

.lib_list>article dl::after {
  display: block;
  content: '';
  clear: both;
}

.lib_list>article dl span {
  display: block;
  margin-bottom: 10px;
}

.lib_list>article dl span:last-child {
  margin-bottom: 0;
}

.lib_list>article dl dt,
.lib_list>article dl dd {
  display: inline-block;
  line-height: 1.1em;
}

.lib_list>article dl dd {
  width: calc(100% - 74px);
  color: #252525;
  /*display: -webkit-inline-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;*/
}

.lib_list>article dl dt {
  width: 70px;
  color: #777777;
  vertical-align: top;
}

/* .lib_list > article dl span:nth-child(2) dd:first-of-type {border-right: 1px solid #dbdbdb; margin-right: 7px; padding-right: 10px;}*/
.lib_list>article .review {
  padding: 15px 20px;
  background: #f6f6f6;
  border-radius: 5px;
}

.lib_list>article .review>p {
  color: #252525;
  line-height: 1.4em;
  font-size: 15px;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
}

/* --- 사서 추천 도서 View --- */
.story_box {
  padding: 30px 30px;
  box-sizing: border-box;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  background: #fff;
  margin-bottom: 30px;
  line-height: 1.4em;
}

.story_box p {
  margin-bottom: 38px;
  line-height: 1.4em;
}

.story_box p:last-of-type {
  margin-bottom: 0;
}

.story_box p span {
  display: block;
}

.go_list {
  display: block;
  width: 110px;
  height: 50px;
  line-height: 50px;
  background: #01AB9D;
  border-radius: 5px;
  color: #fff;
  text-align: center;
  font-size: 18px;
  margin: 0 auto;
}

.apc_wrap .down_wrap {
  padding: 36px 30px;
  background: #f9f9f9;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  position: relative;
  margin-bottom: 40px;
  box-sizing: border-box;
}

.apc_wrap .down_wrap p {
  color: #252525;
  font-size: 18px;
  line-height: 1.5em;
}

.apc_wrap .down_wrap .down_btn {
  position: absolute;
  right: 36px;
  top: 50%;
  transform: translateY(-50%);
  background: #01ab9d;
  border-radius: 5px;
  color: #fff;
  padding: 15px;
}

.apc_wrap .down_wrap .down_btn::before {
  display: inline-block;
  content: '';
  width: 18px;
  height: 18px;
  margin-right: 10px;
  background-image: url('/resources/homepage/yblib/img/download.svg');
  background-repeat: no-repeat;
  background-position: center center;
  vertical-align: middle;
}

.apc_wrap .h4_deco {
  margin-bottom: 10px;
}

.apc_wrap article p.info {
  color: #777;
  margin-bottom: 20px;
}

.apc_wrap article span.content {
  display: block;
  width: 100%;
  height: 1000px;
  background: no-repeat center top;
  background-size: contain;
  margin-top: 40px;
}

/* --- 북스타트 선정도서 --- */

body.b20 .class_btn {
  margin-bottom: 40px;
}

body.b20 .class_btn a {
  width: 20%;
}

body.b20 .lib_list {
  margin-bottom: 36px;
}

/*--- 나의 추천 도서 --- */
body.b30 .search_condition {
  text-align: center;
  /* margin-bottom: 40px; */
}

body.b30 table th,
body.b30 table td {
  text-align: center;
}

.table_top {
  display: flex;
  justify-content: space-between;
  margin-bottom: 15px;
  align-items: flex-end;
}

.table_top span.total {
  /* font-size: 18px; font-weight: 600;  */
  position: static;
  font-size: 15px;
  color: #777;
}

.write_btn {
  background: #01ab9d;
  color: #fff;
  border-radius: 5px;
}

/*--- 나의 추천 도서 (등록 도서X)--- */
.table_wrap .table tbody td[colspan] {
  padding: 50px;
  font-size: 18px;
  color: #777;
}

.inline_text {
  display: inline-block;
}

.table.mybook_table {
  border-top: 1px solid #222;
}

.table.mybook_table th,
.table.mybook_table td {
  padding: 12px 14px;
}

table.mybook_table .btn {
  margin: 0;
  padding-top: 4px;
}

table.mybook_table .plus_btn {
  margin-right: 10px;
}

table.mybook_table .inline_text {
  color: #777;
}

table.mybook_table td input {
  width: 100%;
}

/* --- 나의 추천 도서 View --- */
body.b30 .board_wrap .board_content p {
  text-align: left;
  margin-bottom: 30px;
  color: #252525;
}

.delete_wrap {
  position: fixed;
  left: 0;
  bottom: 0;
  width: 100vw;
  height: 100%;
  background: rgba(0, 0, 0, 0.4);
  z-index: 1000;
  display: none;
}

.delete_wrap.on {
  display: block;
}

.delete_wrap .delete_box {
  width: 260px;
  height: 180px;
  background: #fff;
  border-radius: 5px;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  text-align: center;
}

.delete_wrap .delete_box h5 {
  text-align: center;
  margin-top: 50px;
  font-size: 18px;
  font-weight: 600;
  color: #252525;
  margin-bottom: 40px;
}

.delete_wrap .delete_box button {
  width: 100px;
  height: 40px;
  color: #fff;
  border-radius: 5px;
  text-align: center;
}

.delete_wrap .delete_box button.cancel {
  background: #01ab9d;
}

.delete_wrap .delete_box button.delete {
  background: #252525;
}

body.xyhidden {
  overflow: hidden;
}

/* --- 나의 추천 도서 글쓰기 --- */
.point {
  margin-bottom: 17px;
  text-align: right;
}

.point strong {
  padding-left: 15px;
  background: url('/resources/homepage/yblib/img/write_icon.svg') no-repeat left center;
}

.write_wrap {
  margin-bottom: 20px;
  /*padding: 25px; background: #f9f9f9; border: 1px solid #dbdbdb; border-radius: 5px;*/
}

.write_wrap li {
  position: relative;
  margin-bottom: 15px;
}

.write_wrap li:last-child {
  margin-bottom: 0;
}

.write_wrap label {
  padding-left: 15px;
  background: url('/resources/homepage/yblib/img/write_icon.svg') no-repeat left center;
  color: #252525;
  font-weight: 600;
  display: block;
  margin-bottom: 10px;
}

.write_wrap li:nth-child(3) label {
  background: none;
  padding-left: 0;
}

.write_wrap input,
.write_wrap textarea {
  width: 100%;
  border-color: #dbdbdb;
}

.write_wrap textarea {
  resize: none;
  height: 400px;
  overflow-y: auto;
  font-size: 16px;
}

.reg_btn {
  width: 100px;
  height: 40px;
  background: #252525;
  color: #fff;
  border-radius: 5px;
  float: right;
}

.reg_btn::after {
  display: block;
  content: '';
  clear: both;
}


/* d20 freeboard view */


.d20_password {
  background: #f9f9f9;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  text-align: center;
  padding: 100px 0;
}

.d20_password label {
  color: #252525;
  font-size: 18px;
  margin-right: 10px;
}

.d20_password_input {
  width: 300px;
  height: 80px;
}

.d20_password_btn {
  background: #444;
  height: 32px;
  width: 70px;
  border-radius: 5px;
  color: #fff;
}

.d20_password_btn:hover {
  background: #000;
}

.d20_list_btn {
  margin-bottom: 100px;
}

.board_wrap .board_content_d20 p {
  text-align: left;
  margin-bottom: 10px;
}

.board_wrap .board_content_d20 p:last-child {
  margin-bottom: 0;
}

.d20_out_link {
  color: #e70000;
  font-weight: 600;
}

.d20_out_link:hover {
  color: #ca0000;
}

/* d40 volunteer */

.volunteer_info {
  padding: 30px 25px;
  background: #f9f9f9;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  margin-bottom: 30px;
}

.volunteer_info p {
  line-height: 1.5;
  color: #252525;
  font-size: 17px;
}

.dl_table .d40_last_dt {
  padding: 40px 20px 43px;
  line-height: 1.3;
}

.dl_table .d40_last_dt span {
  display: block;
}

.dl_table .d40_last_dd {
  line-height: 1.5;
}

.d40_guide_wrap p {
  font-size: 16px;
  color: #252525;
  margin-bottom: 10px;
}

.d40_guide_wrap p:last-child {
  margin-bottom: 0;
}

.d40_guide_wrap p strong {
  color: rgb(230, 0, 0);
}

.d40_guide_wrap p strong a {
  color: rgb(230, 0, 0);
}

.d40_guide_wrap01 {
  margin: 40px 0;
}

.d40_guide_wrap01 p:last-child {
  margin-left: 10px;
}

.d40_guide_wrap02 {
  margin-bottom: 60px;
}



/* d50 */
.d_start,
.d_end {
  width: 100px;
}

.d_result,
.d_answer {
  width: 80px;
}

.answer_btn {
  font-size: 15px;
  background: #01ab9d;
  padding: 8px 12px;
  border-radius: 5px;
  color: #fff;
}

.answer_btn_off {
  background: #777;
}

.result_btn {
  font-size: 15px;
  background: #01ab9d;
  padding: 8px 12px;
  border-radius: 5px;
  color: #fff;
}

.result_btn_off {
  background: #777;
}

.result_btn_on:hover {
  color: #fff;
  background: #008075;
}

exclamation markpo .result_btn_on:focus {
  color: #fff;
  background: #008075;
}

.d50_tip {
  font-size: 15px;
  padding: 5px 9px;
  border-radius: 5px;
  margin-left: 10px;
  background: #777;
  color: #fff;
}

.d50_tip01 {
  background: #01ab9d;
}



/* d50_view */

.questions_wrap {
  margin-bottom: 35px;
}

.h5_deco {
  font-size: 17px;
  color: #252525;
  margin-bottom: 10px;
  font-weight: 700;
}

.h5_deco span {
  font-weight: 800;
  margin-right: 4px;
  color: #01AB9D;
}

.questions_wrap input {
  transform: translateY(30%);
}

.questions_wrap label {
  margin-right: 15px;
}

.questions_wrap textarea {
  resize: none;
}

.questions_wrap09 {
  text-align: center;
}

.questions_wrap09 .h5_deco {
  font-size: 18px;
  font-weight: 700;
}

.questions_wrap label:last-child {
  margin-right: 0;
}

.btn_area_d50 button:first-child {
  background-color: #777;
  border-color: #777;
}

.btn_area_d50 button:first-child:focus {
  background-color: #555;
  border-color: #555;
}

.btn_area_d50 button:first-child:hover {
  background-color: #555;
  border-color: #555;
}

.d50_last_info_icon {
  background: url("/resources/homepage/yblib/img/approved.svg")no-repeat center center;
  background-size: contain;
  width: 60px;
  height: 60px;
  margin: 0 auto 15px;
}

.d50_h4 {
  color: #252525;
  font-weight: 800;
  font-size: 24px;
  margin-bottom: 20px;
}

.d50_last_info {
  background: #ffffff;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  text-align: center;
  padding: 70px 0;
}

.d50_last_info p {
  color: #555;
  font-size: 17px;
  font-weight: 600;
  line-height: 1.4;
}

/*--- 자주 묻는 질문 ---*/
.fnq_wrap {
  margin-bottom: 36px;
}

.fnq_wrap>li {
  border-top: 1px solid #dbdbdb;
}

.fnq_wrap>li a {
  display: block;
  font-weight: 600;
  font-size: 18px;
  padding: 20px 20px 20px 60px;
  background: url('/resources/homepage/yblib/img/q_icon.png') no-repeat left 20px center;
}

.fnq_wrap>li:last-child {
  border-bottom: 1px solid #dbdbdb;
}

.fnq_wrap li:first-child .answer {
  display: block;
}

.fnq_wrap>li .answer {
  background: #f9f9f9 url('/resources/homepage/yblib/img/a_icon.png') no-repeat left 20px top 20px;
  overflow: hidden;
  height: 0;
  transition: all 0.2s;
  padding: 0px 20px 0px 70px;
}

.fnq_wrap>li.on .answer {
  height: auto;
  padding: 20px 20px 30px 70px;
  overflow: visible;
}

.fnq_wrap .answer p {
  margin-bottom: 10px;
  color: #757575;
}

.fnq_wrap .answer p span {
  color: #fd6b3e;
}

.fnq_wrap .answer p:last-child {
  margin-bottom: 0;
}

.fnq_wrap .answer p.pt {
  margin-top: 40px;
}

.fnq_wrap .answer ul li {
  margin-bottom: 10px;
}

/*--- 도서관 이용 안내 ---*/
.holiday_box {
  padding: 50px 50px 50px 120px;
  background: #f9f9f9 url("/resources/homepage/yblib/img/wait.svg") no-repeat left 30px center;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  margin-bottom: 15px;
}

.holiday_box p {
  line-height: 1.4em;
  color: #252525;
  font-size: 18px;
  font-weight: 600;
}

.holiday_box p span {
  color: #01ab9d;
}

.guide_wrap .content {
  margin-bottom: 30px;
  width: 100%;
}

.guide_wrap .content::after {
  display: block;
  content: "";
  clear: both;
}

/* .guide_wrap .content:nth-of-type(1) > li {margin-bottom: 3px; line-height: 1.5em;} */
.guide_wrap .content>li {
  padding: 0 0 14px 14px;
  color: #252525;
  font-weight: 500;
  line-height: 1.3em;
  position: relative;
}

.guide_wrap .content>li:before {
  display: block;
  content: "";
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #333;
  position: absolute;
  left: 2px;
  top: 8px;
}

.guide_wrap .content>li:last-child {
  margin-bottom: 0;
}

.guide_wrap .content .sub {
  margin-top: 10px;
}

.guide_wrap .content .sub li {
  font-weight: 400;
  line-height: 1.3em;
  padding: 0 0 8px 20px;
  color: #757575;
  position: relative;
  font-size: 15.5px;
}

.guide_wrap .content .sub li:before {
  display: block;
  content: "";
  width: 7px;
  height: 2px;
  background: #999;
  position: absolute;
  left: 4px;
  top: 8px;
}

.guide_wrap .content .sub li:last-child {
  margin-bottom: 0;
}

/*--- 도서관 시설 안내 ---*/
.fac_list {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  gap: 30px 0px;
  margin-top: 40px;
}

.fac_list figure {
  width: 49%;
  padding: 20px;
  background: #f5f5f5;
  border-radius: 5px;
  box-sizing: border-box;
  position: relative;
}

.fac_list figure span {
  display: block;
  width: 100%;
  height: 286px;
  border-radius: 5px;
  border: 1px solid #dbdbdb;
  box-sizing: border-box;
  background-position: center center;
}

.fac_list figure figcaption {
  padding: 12px 18px;
  background: url("/resources/homepage/yblib/img/postit.svg") no-repeat center center;
  background-size: cover;
  color: #fff;
  display: inline-block;
  position: absolute;
  left: 0px;
  top: 10px;
  font-size: 18px;
  transform: rotate(-20deg);
}

/* --- 도서관 시설 안내 메뉴 안나옴 수정 --- */
body.f00 nav.snb .sub_50 {
  display: block;
}

/* --- 도서관 현황 ---*/
body.f40 table th {
  background: #edf9f2;
}

body.f40 table td:first-child,
body.f40 table td:last-child {
  background: #f9f9f9;
  font-weight: 600;
}

body.f40 .table_wrap:first-of-type td {
  padding: 15px 10px;
}

body.f40 .table_wrap:last-of-type th {
  width: 33%;
}

/* --- 조직 및 업무 --- */
body.lib_YB .group_wrap,
body.lib_NE .group_wrap,
body.lib_NA .group_wrap,
body.lib_SS .group_wrap,
body.lib_NR .group_wrap {
  margin: 30px 0 50px;
}

.group_wrap ol {
  position: relative;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  gap: 20px;
}

/*.group_wrap ol::before {display: block; content: ''; width: 1px; height: 335px; background: #ccc; position: absolute; left: 50%; top: 0; transform: translateX(-50%); z-index: -1;}*/
.group_wrap li {
  width: 100%;
  height: 60px;
  text-align: center;
  font-size: 17px;
  color: #fff;
  font-weight: 500;
}

.group_wrap ol>li {
  position: relative;
}

.group_wrap ol>li::before {
  display: block;
  content: "";
  width: 1px;
  height: 20px;
  background: #d6d6d6;
  position: absolute;
  left: 50%;
  bottom: -20px;
  transform: translateX(-50%);
}

.group_wrap li span.box {
  height: 60px;
  display: flex;
  flex-flow: column nowrap;
  justify-content: center;
  align-items: center;
  gap: 5px;
}

.group_wrap ol>li>span.box {
  width: 200px;
  margin: 0 auto;
  background: url('/resources/homepage/yblib/img/tape_01.png') no-repeat center top;
  background-size: cover;
}

.group_wrap ul {
  margin-top: 43px;
  display: flex;
  justify-content: center;
  gap: 20px;
  position: relative;
  /*position: absolute;  left: 50%; transform: translateX(-50%);*/
}

/*.group_wrap ol li ul::after {display: block; content: ''; width: calc(100% - 230px); height: 1px; background: #ccc; position:absolute; top: -30px; }*/
.group_wrap ul>li {
  display: flex;
  justify-content: center;
  align-items: center;
  width: auto;
  flex: 1;
  height: auto;
  background: url('/resources/homepage/yblib/img/tape_02.png') no-repeat center top;
  background-size: cover;
  position: relative;
}

.group_wrap ul>li::before {
  display: block;
  content: "";
  height: 1px;
  position: absolute;
  left: -12px;
  right: -10px;
  top: -24px;
  background: #d6d6d6;
}

.group_wrap ul>li:first-child::before {
  left: calc(50% - 1px);
}

.group_wrap ul>li:last-child::before {
  right: calc(50% - 1px);
}

.group_wrap ul>li::after {
  display: block;
  content: "";
  width: 1px;
  height: 24px;
  position: absolute;
  left: 50%;
  top: -24px;
  transform: translateX(-50%);
  background: #d6d6d6;
}

.group_wrap ul>li>span.box {
  height: auto;
}

/*.group_wrap ol li ul > li::before {display: block; content: ''; width: 1px; height: 50px; background: #ccc; position: absolute; left: 50%; top: -30px; transform: translateX(-50%); z-index: -1; }*/

table.class_table td.w_place {
  border-right: 1px solid #dbdbdb;
}

table td.w_place,
table td.number {
  border-top: 1px solid #dbdbdb;
}

table.class_table tr td.w_place {
  font-weight: 600;
  background: #f9f9f9;
  border-bottom: 0 none;
}

table th {
  background: #edf9f2;
}

table td.work {
  text-align: left;
}

table td.work li {
  line-height: 1.4em;
  margin-bottom: 5px
}

table td.work li::before {
  display: inline-block;
  content: "";
  width: 5px;
  height: 1px;
  margin-right: 7px;
  background: #555;
  vertical-align: 5px;
}

table td.work li:last-child {
  margin-bottom: 0;
}

.book-list table.group_table tbody tr td:last-child {
  border-bottom: 0 none;
}

body.lib_YB .group_wrap ul>li,
body.lib_SS .group_wrap ul>li,
body.lib_NA .group_wrap ul>li,
body.lib_NE .group_wrap ul>li,
body.lib_NR .group_wrap ul>li,
body.lib_CH .group_wrap ul>li {
  border-radius: 40px;
  padding: 16px 10px;
}

/*
body.f30 table.class_table td.w_place {border-right: 1px solid #dbdbdb;}
body.f30 table td.w_place, body.f30 table td.number {border-bottom: 0px none; border-top: 1px solid #dbdbdb;}
body.f30 table.class_table tr td.w_place { font-weight: 600; background: #f9f9f9;}
body.f30 table th {background: #edf9f2;}
body.f30 table td.work {text-align: left;}
body.f30 table td.work li {line-height: 1.4em; margin-bottom: 5px}
body.f30 table td.work li::before {display: inline-block; content: ""; width: 5px; height: 1px; margin-right: 7px; background: #555; vertical-align: 5px;}
body.f30 table td.work li:last-child {margin-bottom: 0;}
*/

/* --- 오시는 길 ---*/
.map_wrap {
  display: block;
  height: 480px;
  margin-bottom: 20px;
  border: 1px solid #dbdbdb;
  box-sizing: border-box;
}

img.map {
  box-sizing: border-box;
}

.add_wrap {
  padding-top: 35px;
  /* padding: 20px 30px; margin-top: 30px; background: #f9f9f9; border: 1px solid #dbdbdb; border-radius: 5px; */
}

.add_wrap li,
body.lib_YB .add_wrap li,
body.lib_NE .add_wrap li,
body.lib_NA .add_wrap li,
body.lib_SS .add_wrap li {
  font-size: 17px;
  background: none;
  padding-left: 0;
  line-height: 1.35em;
  padding: 7px 0 7px 18px;
  position: relative;
}

.add_wrap li:before,
body.lib_YB .add_wrap li:before,
body.lib_NE .add_wrap li:before,
body.lib_NA .add_wrap li:before,
body.lib_SS .add_wrap li:before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 4px;
  position: absolute;
  left: 2px;
  top: 15px;
}

body.lib_CH .root_daum_roughmap_landing {
  width: 100%;
}

/* 
.add_wrap li:nth-child(1) {background: url('/resources/homepage/yblib/img/loc_icon.svg') no-repeat left center;}
.add_wrap li:nth-child(2) {background: url('/resources/homepage/yblib/img/tel_icon.svg') no-repeat left center;}
.add_wrap li:nth-child(3) {background: url('/resources/homepage/yblib/img/fax_icon.svg') no-repeat left center; margin-bottom: 0;} */

/* --- 인사말 --- */
body.f10 .section_wrap {
  background: url('/resources/homepage/yblib/img/intro_bg.png') no-repeat right bottom;
}

.intro_wrap {
  margin: 30px 0;
}

.intro_wrap .s_title {
  display: block;
  font-size: 20px;
  margin-bottom: 15px;
  color: #FFA809;
}

.intro_wrap h4 {
  font-size: 36px;
  line-height: 1.3em;
  margin-bottom: 40px;
}

.intro_wrap h4 .block {
  display: block;
}

.intro_wrap h4 .deco {
  font-size: 40px;
  font-weight: 900;
}

.intro_wrap p {
  color: #454545;
  line-height: 1.6em;
}

.intro_wrap .t1 {
  display: block;
  margin-bottom: 30px;
  font-size: 18px;
}

.intro_wrap .t2,
.intro_wrap .t3 {
  margin-bottom: 30px;
}

.intro_wrap .t4 {
  color: #252525;
  font-weight: 700;
  font-size: 18px;
}

.intro_wrap p span {
  display: block;
}

/* --- 연혁 --- */

.history_wrap .title_box {
  width: 100%;
  height: 230px;
  box-sizing: border-box;
  background: url('/resources/homepage/yblib/img/history_bg.jpg') no-repeat center center;
  background-size: cover;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  position: relative;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: center;
  gap: 20px;
  margin-bottom: 30px;
}

body.lib_SS .history_wrap .title_box {
  background: url("/resources/common/img/lib_ss_bg_01.JPG") no-repeat center center;
  background-size: cover;
}

body.lib_NA .history_wrap .title_box {
  background: url("/resources/common/img/lib_na_bg_04.jpg") no-repeat center top 20%;
  background-size: cover;
}

body.lib_NA .history_wrap .title_box::after {
  background: rgba(0, 0, 0, 0.1);
}

body.lib_NE .history_wrap .title_box {
  background: url("/resources/common/img/lib_nae_bg_01.JPG") no-repeat center center;
  background-size: cover;
}

body.lib_NR .history_wrap .title_box {
  background: url("/resources/common/img/naru.jpg") no-repeat center center;
  background-size: cover;
}

body.lib_CH .history_wrap .title_box {
  background: url("/resources/common/img/event01.jpg?version=20240320") no-repeat center center;
  background-size: cover;
}

.history_wrap .title_box::after {
  display: block;
  content: '';
  width: 100%;
  height: 230px;
  background: rgba(0, 0, 0, 0.2);
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 5px;
  z-index: 2;
}

.history_wrap .title_box strong {
  color: #fff;
  position: relative;
  z-index: 100;
  font-size: 30px;
  text-shadow: 4px 4px 7px rgba(0, 0, 0, 0.3);
}

.history_wrap .title_box h4 {
  color: #fff;
  position: relative;
  z-index: 3;
  font-size: 50px;
  text-shadow: 4px 4px 10px rgba(0, 0, 0, 0.2);
}

.history_wrap dl+dl {
  margin-top: 50px;
}

.history_wrap dl dd li {
  font-size: 20px;
  font-weight: 600;
}

.history_wrap dl dd li+li {
  margin-top: 20px;
}

.history_wrap dl dd li span {
  display: inline-block;
  width: 80px;
  height: 80px;
  background: transparent;
  border: 2px dashed #01AB9D;
  border-radius: 50%;
  color: #fff;
  text-align: center;
  line-height: 80px;
  font-size: 18px;
  font-weight: 700;
  margin-right: 20px;
  position: relative;
}

.history_wrap dl dd li span::before {
  display: block;
  content: '';
  width: 70px;
  height: 70px;
  background: #01AB9D;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  z-index: -1;
}

body.lib_SS .history_wrap dl dd li span {
  border-color: #37a4e9;
}

body.lib_SS .history_wrap dl dd li span::before {
  background-color: #37a4e9;
}

body.lib_NA .history_wrap dl dd li span {
  border-color: #9f00ba;
}

body.lib_NA .history_wrap dl dd li span::before {
  background-color: #9f00ba;
}

body.lib_NE .history_wrap dl dd li span {
  border-color: #ff9114;
}

body.lib_NE .history_wrap dl dd li span::before {
  background-color: #ff9114;
}

body.lib_NR .history_wrap dl dd li span {
  border-color: #2634B2;
}

body.lib_NR .history_wrap dl dd li span::before {
  background-color: #2634B2;
}


/* ---- style.css 복붙 끝 ---- */


/* --- 공지사항  --- */
.table tbody th,
.table tbody td {
  line-height: 1;
}

.notice_table span.new {
  font-size: 0;
  display: inline-flex;
  vertical-align: middle;
}

.notice_table span.new::before {
  display: flex;
  justify-content: center;
  align-items: center;
  content: "NEW";
  font-size: 12px;
  font-weight: 600;
  color: #01AB9D;
  border-radius: 50%;
  text-align: center;
  margin-left: 10px;
}

/* --- 공지사항 view --- */
.prev_next_remote .td3,
.prev_next_remote .td4 {
  display: none;
}

table.prev_next_remote td {
  padding: 15px;
  border-right: 0 none;
}

table.prev_next_remote td.td1 {
  width: 15%;
  text-align: center;
}

table.prev_next_remote tr.board-prev td.td1 {
  background: url('/resources/common/img/board_next.svg') no-repeat right 20px center;
}

table.prev_next_remote tr.board-next td.td1 {
  background: url('/resources/common/img/board_prev.svg') no-repeat right 20px center;
}

table.prev_next_remote td.td2 a {
  display: -webkit-inline-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  line-height: 1;
  overflow: hidden;
}

table.bbs-edit,
.bbs_webzine,
.bbs_gallery,
.bbs-view {
  border-top: 0 none;
}

.bbs-view-header .board_title {
  padding: 25px;
  font-size: 20px;
  font-weight: 700;
  color: #252525;
  background: #f9f9f9;
  border-radius: 5px 5px 0 0;
  border-bottom: 1px solid #dbdbdb;
}

.bbs-view .bbs-view-header .board_info {
  padding: 25px;
  border-bottom: 1px solid #dbdbdb;
}

.bbs-view .bbs-view-header .board_info dt,
.bbs-view .bbs-view-header .board_info dd {
  font-size: 16px;
  padding: 0;
  display: inline-block;
}

.bbs-view .bbs-view-header .board_info dt {
  font-weight: 500;
  margin-right: 8px;
  padding-right: 8px;
  border-right: 1px solid #ddd;
  color: #454545;
}

.bbs-view .bbs-view-header .board_info .info_box {
  margin-right: 20px;
}

.bbs-view .bbs-view-header .board_info .info_box:last-of-type {
  margin-right: 0px;
}

.bbs-view .bbs-view-header .board_info dd {
  color: #757575;
}

.bbs-view .bbs-view-header .board_info dd {
  border-bottom: 0 none;
}

.bbs-view .bbs-view-header dd.file ul li {
  margin: 6px 0;
}

.bbs-view .bbs-view-header dd.file ul li a {
  color: #1B0FAE;
}

.bbs-view-file {
  padding: 10px 15px;
  background: #fff;
  border-bottom: 1px solid #ddd;
}

.bbs-view-file li {
  margin: 8px 0;
}

.bbs-view-file li a,
.bbs-view .bbs-view-header dd.file i {
  color: #1B0FAE;
}

.bbs-view-file li a i {
  margin-right: 8px;
}

/* --- 도서관 갤러리 --- */
.bbs_gallery {
  display: flex;
  flex-flow: row wrap;
  border-bottom: 0 none;
  margin-bottom: 0px;
  gap: 15px 0;
}

.bbs_gallery li {
  float: none;
  width: 24%;
  margin-right: 1.3333%;
  height: 322px;
  padding: 14px;
  box-sizing: border-box;
  border: 1px solid #dbdbdb;
  border-radius: 5px;
}

.bbs_gallery li:nth-child(4n) {
  margin-right: 0;
}

.bbs_gallery li .thumb {
  padding: 0;
  max-height: none;
  height: 150px;
  border: 1px solid #dbdbdb;
  border-radius: 3px;
  margin-bottom: 16px;
}

.bbs_gallery li .thumb a {
  display: block;
  height: 100%;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
}

.bbs_gallery li .info {
  padding: 0;
  overflow: visible;
  text-overflow: initial;
  white-space: initial;
}

.bbs_gallery li .info a {
  font-size: 17px;
  font-weight: 500;
  color: #252525;
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-inline-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  margin-bottom: 6px;
  line-height: 1.1em;
}

.bbs_gallery li .info .meta {
  padding: 10px 0 0;
  border-top: 1px solid #ededed;
}

.bbs_gallery li .info .meta p {
  font-size: 16px;
  color: #757575;
  margin-bottom: 7px;
  font-weight: 400;
}

.bbs_gallery li .info .meta p:last-child {
  margin-bottom: 0;
}

.bbs_gallery li .info .meta p>span {
  margin-right: 3px;
}

.bbs_gallery li>div {
  max-height: none;
}

ul.list {
  padding: 20px;
  border: 1px solid #ddd;
  border-radius: 5px;
  margin: 0 20px;
}

ul.list li {
  padding: 0 0 6px 14px;
  color: #757575;
  font-weight: 500;
  line-height: 1.3em;
  position: relative;
}

ul.list li:last-child {
  padding-bottom: 0;
}

ul.list li::before {
  display: block;
  content: "";
  width: 4px;
  height: 4px;
  background: #333;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 8px;
}

.bbs-edit .file_attach {
  padding-bottom: 20px;
}

/* --- 문화강좌 --- */
.table_wrap.culture_wrap {
  border: 0 none;
  border-radius: 0;
}

table.culture_table thead {
  position: fixed;
  left: -99999px;
  top: -99999px;
}

table.culture_table,
table.culture_table tr,
table.culture_table td,
table.culture_table tbody {
  display: block;
}

table.culture_table tbody {
  width: 100%;
}

table.culture_table tr {
  width: 100%;
  border: 1px solid #e1e1e0;
  box-sizing: border-box;
  padding: 20px 20px 20px 190px;
  position: relative;
  border-radius: 6px;
}

table.culture_table tr+tr {
  margin-top: 15px;
}

table.culture_table td {
  border: 0 none;
  text-align: left;
  padding: 8px 0;
}

table.culture_table td .file_ico {
  display: inline-block;
}

table.culture_table td .cover {
  display: block;
  width: 144px;
  height: 194px;
  border-radius: 5px;
  border: 1px solid #ddd;
  box-sizing: border-box;
  background-size: cover;
  background-position: center center;
  background-repeat: no-repeat;
  position: absolute;
  left: 20px;
  top: 20px;
}

table.culture_table td.sort {
  color: #01ab9d;
  font-weight: 600;
  padding: 0 0 8px;
}

body.lib_SS table.culture_table td.sort {
  color: #37a4e9;
}

body.lib_NA table.culture_table td.sort {
  color: #9f00ba;
}

body.lib_NE table.culture_table td.sort {
  color: #ff9114;
}


table.culture_table td.title {
  margin-bottom: 16px;
  padding: 0;
}

table.culture_table td.title a {
  font-size: 20px;
  color: #252525;
  font-weight: 800;
}

table.culture_table td:not(.title, .sort, .state) {
  padding: 2px 0;
  display: flex;
  align-items: center;
}

table.culture_table td::before {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 94px;
  height: 30px;
  box-sizing: border-box;
  margin-right: 10px;
  background: #EBFBE4;
  font-weight: 600;
  border-radius: 5px;
  color: #444;
  font-size: 15px;
}

body.lib_SS table.culture_table td::before {
  background: #e4f5ff;
}

body.lib_NA table.culture_table td::before {
  background: #FCEDFF;
}

body.lib_NE table.culture_table td::before {
  background: #FFF3E4;
}

table.culture_table td.r_date::before {
  content: "접수기간";
}

table.culture_table td.t_date::before {
  content: "강의기간";
}

table.culture_table td.target::before {
  content: "강의대상";
}

table.culture_table td.person::before {
  content: "접수현황";
}

table.culture_table td.state {
  position: absolute;
  right: 20px;
  top: 50%;
  transform: translateY(-50%);
}


table.class_table tbody td span.end,
table.class_table tbody td span.class_end {
  background: #aaa;
  color: #f2f2f2;
}

table.class_table tbody td a.c_check {
  background: #01ab9d;
  border-left: 1px solid #000;
  border-left: 0px none;
}


table.culture_table td.state>a,
table.culture_table td.state>span {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 5px;
  width: 100px;
  height: 46px;
  font-size: 17px;
}

table.culture_table td.state .reg_com {
  background-color: #01AB9D;
}

table.culture_table td span.red {
  color: #da380b;
}

.nonmember_btn {
  text-align: right;
  margin-bottom: 10px;
}

table.culture_table td.state .reg {
  background-color: #01ab9d;
  color: #fff;
  transition: all 0.2s ease 0s;
}

table.culture_table td.state .reg:hover {
  background-color: #009085;
}

table.culture_table td.state .reg_wait {
  color: #01ab9d;
  background: #BDE4DF;
  font-weight: 600;
}

body.lib_SS table.culture_table td.state .reg {
  background-color: #37a4e9;
  color: #fff;
  transition: all 0.2s ease 0s;
}

body.lib_SS table.culture_table td.state .reg:hover {
  background-color: #2575A8;
}

body.lib_SS table.culture_table td.state .reg_wait {
  color: #2575A8;
  background: #93CFF5;
  font-weight: 600;
}

body.lib_NA table.culture_table td.state .reg {
  background-color: #9f00ba;
  color: #fff;
  transition: all 0.2s ease 0s;
}

body.lib_NA table.culture_table td.state .reg:hover {
  background-color: #79008D;
}

body.lib_NA table.culture_table td.state .reg_wait {
  color: #79008D;
  background: #DD98E9;
  font-weight: 600;
}

body.lib_NE table.culture_table td.state .reg {
  background-color: #ff9114;
  color: #fff;
  transition: all 0.2s ease 0s;
}

body.lib_NE table.culture_table td.state .reg:hover {
  background-color: #D17D1E;
}

body.lib_NE table.culture_table td.state .reg_wait {
  color: #D46600;
  background: #FFC27C;
  font-weight: 600;
}


body.lib_CH table.culture_table td.state .reg {
  background-color: #1F58A7;
  color: #fff;
  transition: all 0.2s ease 0s;
}

body.lib_CH table.culture_table td.state .reg:hover {
  background-color: #153f79;
}

body.lib_CH table.culture_table td.state .reg_wait {
  color: #153f79;
  background: #83A1EC;
  font-weight: 600;
}

/* table.culture_table tr.reg_end {background: #f6f6f6; color: #999;}
table.culture_table tr.reg_end td, body.lib_SS table.culture_table tr.reg_end td, body.lib_NA table.culture_table tr.reg_end td, body.lib_NE table.culture_table tr.reg_end td {background: #f6f6f6; color: #999;}
table.culture_table tr.reg_end td * {color: #999;}
table.culture_table tr.reg_end td::before {background: #aaa; color: #ddd;} */

/* --- 문화강좌 view --- */
.culture_view_table td {
  text-align: center;
}

/* --- 희망도서신청 --- */
.btn_view_type .basket_btn {
  margin: 0;
  margin-left: 5px;
  font-size: 16px;
}

.plus_btn::before {
  display: inline-block;
  content: '';
  width: 20px;
  height: 20px;
  vertical-align: -5px;
  margin-right: 4px;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M11 11V5H13V11H19V13H13V19H11V13H5V11H11Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
}

.basket_btn::before {
  display: inline-block;
  content: '';
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
  background-repeat: no-repeat;
  background-position: center center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M21 4H7C5.89543 4 5 4.89543 5 6C5 7.10457 5.89543 8 7 8H21V21C21 21.5523 20.5523 22 20 22H7C4.79086 22 3 20.2091 3 18V6C3 3.79086 4.79086 2 7 2H20C20.5523 2 21 2.44772 21 3V4ZM5 18C5 19.1046 5.89543 20 7 20H19V10H7C6.27143 10 5.58835 9.80521 5 9.46487V18ZM20 7H7C6.44772 7 6 6.55228 6 6C6 5.44772 6.44772 5 7 5H20V7Z' fill='rgba(1,171,157,1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_SS .basket_btn::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M21 4H7C5.89543 4 5 4.89543 5 6C5 7.10457 5.89543 8 7 8H21V21C21 21.5523 20.5523 22 20 22H7C4.79086 22 3 20.2091 3 18V6C3 3.79086 4.79086 2 7 2H20C20.5523 2 21 2.44772 21 3V4ZM5 18C5 19.1046 5.89543 20 7 20H19V10H7C6.27143 10 5.58835 9.80521 5 9.46487V18ZM20 7H7C6.44772 7 6 6.55228 6 6C6 5.44772 6.44772 5 7 5H20V7Z' fill='rgba(55,164,233,1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NA .basket_btn::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M21 4H7C5.89543 4 5 4.89543 5 6C5 7.10457 5.89543 8 7 8H21V21C21 21.5523 20.5523 22 20 22H7C4.79086 22 3 20.2091 3 18V6C3 3.79086 4.79086 2 7 2H20C20.5523 2 21 2.44772 21 3V4ZM5 18C5 19.1046 5.89543 20 7 20H19V10H7C6.27143 10 5.58835 9.80521 5 9.46487V18ZM20 7H7C6.44772 7 6 6.55228 6 6C6 5.44772 6.44772 5 7 5H20V7Z' fill='rgba(159,0,186,1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NE .basket_btn::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M21 4H7C5.89543 4 5 4.89543 5 6C5 7.10457 5.89543 8 7 8H21V21C21 21.5523 20.5523 22 20 22H7C4.79086 22 3 20.2091 3 18V6C3 3.79086 4.79086 2 7 2H20C20.5523 2 21 2.44772 21 3V4ZM5 18C5 19.1046 5.89543 20 7 20H19V10H7C6.27143 10 5.58835 9.80521 5 9.46487V18ZM20 7H7C6.44772 7 6 6.55228 6 6C6 5.44772 6.44772 5 7 5H20V7Z' fill='rgba(255,145,20,1)'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NR .basket_btn::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M21 4H7C5.89543 4 5 4.89543 5 6C5 7.10457 5.89543 8 7 8H21V21C21 21.5523 20.5523 22 20 22H7C4.79086 22 3 20.2091 3 18V6C3 3.79086 4.79086 2 7 2H20C20.5523 2 21 2.44772 21 3V4ZM5 18C5 19.1046 5.89543 20 7 20H19V10H7C6.27143 10 5.58835 9.80521 5 9.46487V18ZM20 7H7C6.44772 7 6 6.55228 6 6C6 5.44772 6.44772 5 7 5H20V7Z' fill='rgba(38,52,178,1)'%3E%3C/path%3E%3C/svg%3E");
}

.search_btn::before {
  display: inline-block;
  content: '';
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M18.031 16.6168L22.3137 20.8995L20.8995 22.3137L16.6168 18.031C15.0769 19.263 13.124 20 11 20C6.032 20 2 15.968 2 11C2 6.032 6.032 2 11 2C15.968 2 20 6.032 20 11C20 13.124 19.263 15.0769 18.031 16.6168ZM16.0247 15.8748C17.2475 14.6146 18 12.8956 18 11C18 7.1325 14.8675 4 11 4C7.1325 4 4 7.1325 4 11C4 14.8675 7.1325 18 11 18C12.8956 18 14.6146 17.2475 15.8748 16.0247L16.0247 15.8748Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
}

.member_btn::before {
  display: inline-block;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M14 14.252V16.3414C13.3744 16.1203 12.7013 16 12 16C8.68629 16 6 18.6863 6 22H4C4 17.5817 7.58172 14 12 14C12.6906 14 13.3608 14.0875 14 14.252ZM12 13C8.685 13 6 10.315 6 7C6 3.685 8.685 1 12 1C15.315 1 18 3.685 18 7C18 10.315 15.315 13 12 13ZM12 11C14.21 11 16 9.21 16 7C16 4.79 14.21 3 12 3C9.79 3 8 4.79 8 7C8 9.21 9.79 11 12 11ZM19 17.5858L21.1213 15.4645L22.5355 16.8787L20.4142 19L22.5355 21.1213L21.1213 22.5355L19 20.4142L16.8787 22.5355L15.4645 21.1213L17.5858 19L15.4645 16.8787L16.8787 15.4645L19 17.5858Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
}

.cal_btn::before {
  display: inline-block;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18'%3E%3Cpath d='M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
}

.prt_btn::before {
  display: inline-block;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M17 2C17.5523 2 18 2.44772 18 3V7H21C21.5523 7 22 7.44772 22 8V18C22 18.5523 21.5523 19 21 19H18V21C18 21.5523 17.5523 22 17 22H7C6.44772 22 6 21.5523 6 21V19H3C2.44772 19 2 18.5523 2 18V8C2 7.44772 2.44772 7 3 7H6V3C6 2.44772 6.44772 2 7 2H17ZM16 17H8V20H16V17ZM20 9H4V17H6V16C6 15.4477 6.44772 15 7 15H17C17.5523 15 18 15.4477 18 16V17H20V9ZM8 10V12H5V10H8ZM16 4H8V7H16V4Z' fill='rgba(1,171,157,1)'%3E%3C/path%3E%3C/svg%3E");
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
}

body.lib_NR .prt_btn::before {
  display: inline-block;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M17 2C17.5523 2 18 2.44772 18 3V7H21C21.5523 7 22 7.44772 22 8V18C22 18.5523 21.5523 19 21 19H18V21C18 21.5523 17.5523 22 17 22H7C6.44772 22 6 21.5523 6 21V19H3C2.44772 19 2 18.5523 2 18V8C2 7.44772 2.44772 7 3 7H6V3C6 2.44772 6.44772 2 7 2H17ZM16 17H8V20H16V17ZM20 9H4V17H6V16C6 15.4477 6.44772 15 7 15H17C17.5523 15 18 15.4477 18 16V17H20V9ZM8 10V12H5V10H8ZM16 4H8V7H16V4Z' fill='rgba(38,52,178,1)'%3E%3C/path%3E%3C/svg%3E");
}

.mod_btn::before {
  display: inline-block;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M16.7574 2.99666L14.7574 4.99666H5V18.9967H19V9.2393L21 7.2393V19.9967C21 20.5489 20.5523 20.9967 20 20.9967H4C3.44772 20.9967 3 20.5489 3 19.9967V3.99666C3 3.44438 3.44772 2.99666 4 2.99666H16.7574ZM20.4853 2.09717L21.8995 3.51138L12.7071 12.7038L11.2954 12.7062L11.2929 11.2896L20.4853 2.09717Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
}

.pri.list_btn::before {
  display: inline-block;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M8 4H21V6H8V4ZM3 3.5H6V6.5H3V3.5ZM3 10.5H6V13.5H3V10.5ZM3 17.5H6V20.5H3V17.5ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
}

.list_btn::before {
  display: inline-block;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M8 4H21V6H8V4ZM4.5 6.5C3.67157 6.5 3 5.82843 3 5C3 4.17157 3.67157 3.5 4.5 3.5C5.32843 3.5 6 4.17157 6 5C6 5.82843 5.32843 6.5 4.5 6.5ZM4.5 13.5C3.67157 13.5 3 12.8284 3 12C3 11.1716 3.67157 10.5 4.5 10.5C5.32843 10.5 6 11.1716 6 12C6 12.8284 5.32843 13.5 4.5 13.5ZM4.5 20.4C3.67157 20.4 3 19.7284 3 18.9C3 18.0716 3.67157 17.4 4.5 17.4C5.32843 17.4 6 18.0716 6 18.9C6 19.7284 5.32843 20.4 4.5 20.4ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z' fill='rgba(1,171,157,1)'%3E%3C/path%3E%3C/svg%3E");
  width: 20px;
  height: 20px;
  vertical-align: -5px;
  margin-right: 6px;
}

body.lib_NR .list_btn::before {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M8 4H21V6H8V4ZM4.5 6.5C3.67157 6.5 3 5.82843 3 5C3 4.17157 3.67157 3.5 4.5 3.5C5.32843 3.5 6 4.17157 6 5C6 5.82843 5.32843 6.5 4.5 6.5ZM4.5 13.5C3.67157 13.5 3 12.8284 3 12C3 11.1716 3.67157 10.5 4.5 10.5C5.32843 10.5 6 11.1716 6 12C6 12.8284 5.32843 13.5 4.5 13.5ZM4.5 20.4C3.67157 20.4 3 19.7284 3 18.9C3 18.0716 3.67157 17.4 4.5 17.4C5.32843 17.4 6 18.0716 6 18.9C6 19.7284 5.32843 20.4 4.5 20.4ZM8 11H21V13H8V11ZM8 18H21V20H8V18Z' fill='rgba(38,52,178,1)'%3E%3C/path%3E%3C/svg%3E");
}

.del_btn::before {
  display: inline-block;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M7 4V2H17V4H22V6H20V21C20 21.5523 19.5523 22 19 22H5C4.44772 22 4 21.5523 4 21V6H2V4H7ZM6 6V20H18V6H6ZM9 9H11V17H9V9ZM13 9H15V17H13V9Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
}

.wrt_btn::before {
  display: inline-block;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M5 18.89H6.41421L15.7279 9.57629L14.3137 8.16207L5 17.4758V18.89ZM21 20.89H3V16.6474L16.435 3.21233C16.8256 2.8218 17.4587 2.8218 17.8492 3.21233L20.6777 6.04075C21.0682 6.43128 21.0682 7.06444 20.6777 7.45497L9.24264 18.89H21V20.89ZM15.7279 6.74786L17.1421 8.16207L18.5563 6.74786L17.1421 5.33365L15.7279 6.74786Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
}

.rgt_btn::before {
  display: inline-block;
  content: '';
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M17 2V4H20.0066C20.5552 4 21 4.44495 21 4.9934V21.0066C21 21.5552 20.5551 22 20.0066 22H3.9934C3.44476 22 3 21.5551 3 21.0066V4.9934C3 4.44476 3.44495 4 3.9934 4H7V2H17ZM7 6H5V20H19V6H17V8H7V6ZM9 16V18H7V16H9ZM9 13V15H7V13H9ZM9 10V12H7V10H9ZM15 4H9V6H15V4Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
  width: 20px;
  height: 20px;
  background-position: center center;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin-right: 6px;
}

.reg_check_btn::before {
  display: inline-block;
  content: "";
  width: 20px;
  height: 20px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M10.0007 15.1709L19.1931 5.97852L20.6073 7.39273L10.0007 17.9993L3.63672 11.6354L5.05093 10.2212L10.0007 15.1709Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
  vertical-align: middle;
  margin-right: 6px;
}

.reg_yes_btn::before {
  display: inline-block;
  content: '';
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
}

.reg_no_btn::before {
  display: inline-block;
  content: '';
  width: 20px;
  height: 20px;
  vertical-align: middle;
  margin-right: 6px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='20' height='20'%3E%3Cpath d='M12.0007 10.5865L16.9504 5.63672L18.3646 7.05093L13.4149 12.0007L18.3646 16.9504L16.9504 18.3646L12.0007 13.4149L7.05093 18.3646L5.63672 16.9504L10.5865 12.0007L5.63672 7.05093L7.05093 5.63672L12.0007 10.5865Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
}

.hope_reg_wrap {
  background: #fafafa;
}

table.hope_reg_table tbody th,
table.hope_reg_table tbody td {
  padding: 15px;
  background: #fafafa;
}

table.hope_reg_table tbody th {
  font-weight: 600;
  width: 20%;
}

table.hope_reg_table tbody td {
  border-left: 0 none;
  background: #fff;
}

table.hope_reg_table tbody td select,
table.hope_reg_table tbody td input {
  width: 100%;
}

table.hope_reg_table tbody td input[type=checkbox] {
  width: 18px;
  height: 18px;
}

table.hope_reg_table tbody td input[type=checkbox]+label {
  margin-left: 5px;
}

table.hope_reg_table tbody td .write_box {
  width: 100%;
  height: 200px;
}

table.hope_reg_table tbody tr:last-child {
  border-bottom: 0 none;
}

.btn.reg_check_btn {
  background: #01AB9D;
  color: #fff;
  transition: all 0.2s ease 0s;
}

.btn.reg_check_btn:hover {
  border-color: #008075;
  background: #008075;
}

.search-form.hope_form .box {
  border: 0;
  border-radius: 0;
  margin-bottom: 16px;
  padding: 20px;
  background: #f9f9f9;
  border: 1px solid #ddd;
  border-radius: 6px;
}

.search-form.hope_form .box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
}

.search-form.hope_form input.text {
  width: 100%;
  height: 40px;
  border: 1px solid #ddd;
  padding: 0 10px;
}

.search-form.hope_form .b1 {
  padding: 0;
  flex: 1;
}

.search-form.hope_form .b2 {
  position: initial;
  width: auto;
}

.search-form.hope_form .b2 button {
  font-size: 16px;
  height: 40px;
  padding-top: 3px;
}

.hope_title {
  margin-bottom: 16px;
  font-size: 22px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(1,171,157,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 7H13V9H11V7ZM11 11H13V17H11V11Z'%3E%3C/path%3E%3C/svg%3E");
  background-position: left center;
  background-repeat: no-repeat;
  padding-left: 30px;
}

.hope_title strong {
  color: #252525;
}

body.lib_SS .hope_title {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(55,164,233,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 7H13V9H11V7ZM11 11H13V17H11V11Z'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NA .hope_title {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(159,0,186,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 7H13V9H11V7ZM11 11H13V17H11V11Z'%3E%3C/path%3E%3C/svg%3E");
}

body.lib_NE .hope_title {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(255,145,20,1)'%3E%3Cpath d='M12 22C6.47715 22 2 17.5228 2 12C2 6.47715 6.47715 2 12 2C17.5228 2 22 6.47715 22 12C22 17.5228 17.5228 22 12 22ZM12 20C16.4183 20 20 16.4183 20 12C20 7.58172 16.4183 4 12 4C7.58172 4 4 7.58172 4 12C4 16.4183 7.58172 20 12 20ZM11 7H13V9H11V7ZM11 11H13V17H11V11Z'%3E%3C/path%3E%3C/svg%3E");
}

.hope_call {
  margin-bottom: 70px;
  padding-left: 14px;
  /*background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(1,166,152,1)'%3E%3Cpath d='M4.99989 13.9999L4.99976 5L6.99976 4.99997L6.99986 11.9999L17.1717 12L13.222 8.05024L14.6362 6.63603L21.0001 13L14.6362 19.364L13.222 17.9497L17.1717 14L4.99989 13.9999Z'%3E%3C/path%3E%3C/svg%3E"); background-position: left top -3px; background-repeat: no-repeat;*/
  color: #999;
  font-size: 17px;
  font-weight: 500;
  position: relative;
}

.hope_call::before {
  display: block;
  content: "";
  width: 4px;
  height: 4px;
  background: #333;
  border-radius: 50%;
  position: absolute;
  left: 0;
  top: 4px;
}

body:not(.lib_YB) .hope_call {
  display: none;
}

/* --- 자주하는질문 --- */
.wrapper-bbs .faqArea {
  border-top: 0 none;
  border-bottom: 0 none;
}

.wrapper-bbs .faqArea .q {
  border-top: 0 none;
}

.faqArea .faq li {
  border-bottom: 1px solid #dbdbdb;
}

.faqArea .faq .q.blue a.trigger:hover,
.faqArea .faq .q.blue a.trigger:active,
.faqArea .faq .q.blue a.trigger:focus {
  color: #252525;
}

.faqArea .faq .q a.trigger:hover {
  background: #fafafa;
}

.faqArea .faq .q a.trigger .faq_text {
  font-size: 18px;
  font-weight: 500;
  color: #252525;
  transition: all 0.2s ease 0s;
}

.faqArea .faq li.show .q a.trigger .faq_text {
  font-weight: 600;
}

.faqArea .faq .hidden .q a.trigger {
  font-size: 18px;
}

.faqArea .faq .q.blue span.icon {
  font-size: 0;
  display: inline-block;
  width: 30px;
  height: 30px;
  vertical-align: middle;
}

.faqArea .faq .q.blue span.icon::before {
  display: flex;
  align-items: center;
  justify-content: center;
  content: "Q";
  font-size: 18px;
  background: #01ab9d;
  color: #fff;
  border-radius: 50%;
  width: 30px;
  height: 30px;
}

.faqArea .faq .a {
  background: #f4fbf9;
  padding: 20px 0;
  border-top: 0 none;
}

body.lib_SS .faqArea .faq .a {
  background: #f3f8ff;
}

body.lib_NA .faqArea .faq .a {
  background: #faf2ff;
}

body.lib_NE .faqArea .faq .a {
  background: #fff5eb;
}

.faqArea .faq .a .aContent {
  margin-left: 0;
  padding-left: 60px;
}

.faqArea .faq .a .aContent p {
  padding-left: 0;
  font-size: 16px !important;
  color: #252525 !important;
  font-weight: 500 !important;
  background-color: transparent !important;
  font-weight: 500 !important;
  font-family: 'NanumSquareAc', sans-serif !important;
}

.faqArea .faq .a .aContent p span {
  font-size: 16px !important;
  color: #252525 !important;
  font-weight: 500 !important;
  background-color: transparent !important;
  font-weight: 500 !important;
  font-family: 'NanumSquareAc', sans-serif !important;
}

.faqArea .faq .a .tit {
  font-size: 0;
  display: inline-block;
  width: 30px;
  height: 30px;
  top: 20px;
  box-sizing: border-box;
}

.faqArea .faq .a .tit::before {
  display: flex;
  align-items: center;
  justify-content: center;
  content: "A";
  font-size: 18px;
  background: #01ab9d;
  color: #fff;
  border-radius: 50%;
  width: 30px;
  height: 30px;
  box-sizing: border-box;
}

.faqArea .faq .a .aContent p {
  line-height: 1.4em !important;
}

/* --- 책 view --- */
.doc-body .table caption.h4_deco {
  position: initial;
  font-size: 22px;
  width: auto;
  height: auto;
  text-indent: initial;
  overflow: visible;
  line-height: 1;
  color: #252525;
  margin-bottom: 12px;
  font-weight: 600;
}

.doc-body table.table thead th {
  background: #f2f2f2;
  color: #454545;
  font-weight: 600;
  border-bottom: 1px solid #e1e1e0;
}

/* --- 스마트도서 추천 --- */
.view_list .search_result.recom_wrap {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
}

.view_list .search_result>article.recom_book {
  margin-left: 0;
  width: 49%;
  padding-left: 212px;
  margin-bottom: 20px;
}

.search_result>article.recom_book dl dt.b_publisher,
.search_result>article.recom_book dl dt.b_pub_yy {
  width: 60px;
  font-size: 16px;
}

/*.search_result > article.recom_book dl dd.b_publisher, .search_result dl dd.b_pub_yy {background: none; background-size: initial; }*/

/* --- 자유게시판 글작성 --- */
.fileUploader a {
  padding: 0 10px;
}

.table_wrap.edit_wrap {
  padding: 20px 30px;
  margin-bottom: 18px;
  background: #f6f6f6;
  border: 1px solid #dbdbdb;
  box-sizing: border-box;
  border-radius: 5px;
}

table.write_table {
  margin-bottom: 0;
  border: 1px solid #dddd;
}

table.write_table tbody th,
table.write_table tbody td {
  background: transparent;
  padding: 12px 20px;
  border: 0 none;
  box-sizing: border-box;
  font-size: 17px;
  background: #f9f9f9;
}

table.write_table tbody th {
  width: 10%;
  font-weight: 600;
  text-align: left;
}

table.write_table td input[type=text] {
  margin: 0;
}

table.write_table tbody tr.first td,
table.write_table tbody tr.first th {
  padding: 30px 20px 12px;
}

table.write_table tbody tr.first td {
  display: flex;
  flex-flow: row-reverse nowrap;
  justify-content: flex-end;
  align-items: baseline;
  gap: 15px;
}

table.write_table tbody td .bbs-textarea {
  padding: 0 20px;
}

.edit_wrap .text_area {
  margin: 20px 0 0;
}

.edit_wrap textarea {
  margin: 0;
  resize: vertical;
  height: 220px;
}

table.write_table tbody tr:last-child th {
  border-bottom: 0 none;
}

.fileUploader {
  border: 0 none;
  padding: 15px 20px;
}

.fileUploader .file_attach_info p {
  font-size: 15px;
}

.file_area {
  margin-top: 30px;
}

.file_area .fileUploader {
  padding: 0;
  background: transparent;
  border: 0 none;
}

.fileUploader .fileListArea {
  background: #fff;
}

.fileUploader .fileListArea select {
  width: 99.7%;
}

.fileinput-button {
  display: inline-block;
  vertical-align: middle;
}

.fileUploader .fileListArea select {
  background: transparent;
  z-index: 12;
}

/* --- 희망도서선정 - 신청 --- */
.hope_item_wrap .search_result {
  display: flex;
  flex-flow: row wrap;
  justify-content: space-between;
  margin-top: 30px;
}

.hope_item_wrap .hope_reg_item {
  width: 49%;
  height: 320px;
  position: relative;
}

.hope_item_wrap .search_result dl dd.b_publisher,
.hope_item_wrap .search_result dl dd.b_pub_yy {
  background: none;
  background-size: initial;
}

.hope_item_wrap .search_result>article .bookCover {
  position: absolute;
  left: 24px;
  top: 24px;
}

.hope_item_wrap .search_result>article dl,
.hope_item_wrap .search_result>article h5 {
  padding-left: 180px;
}

.hope_item_wrap .search_result>article dl dt {
  width: 75px;
}

.hope_item_wrap .search_result>article .btn_area {
  position: absolute;
  left: 0;
  bottom: 20px;
  width: 100%;
  padding: 0 24px;
  box-sizing: border-box;
}

.hope_item_wrap .search_result>article .btn_area>* {
  width: 100%;
}

.hope_item_wrap .search_result>article .btn_area .hope_no {
  display: inline-block;
  text-align: center;
  min-width: 80px;
  padding: 0 10px;
  box-sizing: border-box;
  height: 36px;
  line-height: 1.8em;
  padding-top: 4px;
  background: #DF0043;
  color: #fff;
  border-radius: 4px;
}

/* 상세검색 */
.detail_search_box {
  display: flex;
  flex-flow: row wrap;
  gap: 6px 0;
  padding: 10px 0 20px;
}

.detail_search_box>dl {
  width: 50%;
}

.detail_search_box>dl>dt {
  width: 60px;
}

.detail_search_box>dl>dt label {
  color: #252525;
}

.detail_search_box>dl>dd {
  width: 78%;
}

/* 문화행사 신청 */
.doc-body h3.appli_title {
  margin-top: 40px;
  margin-bottom: 6px;
}

table.appli_form tbody th {
  width: 25%;
  color: #454545;
}

table.appli_form tbody th,
table.appli_form tbody td {
  padding: 14px;
}

.ui-state-error.appli_ex {
  border: 0 none;
  background: transparent;
  color: #DF0043;
  font-weight: 500;
  margin-top: 15px;
}

table.appli_form tbody td input.post_input {
  width: 70%;
}

/* 예약현황 */
.mobile_table td span.b_title {
  color: #252525;
  margin-bottom: 8px;
  font-weight: 600;
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  line-height: 1;
  word-break: break-all;
}

.mobile_table td span.author {
  color: #757575;
  font-weight: 400;
}

/* table_wrap */
.table_wrap {
  border: 1px solid #dbdbdb;
  border-radius: 5px;
  overflow: hidden;
}

.table_wrap table {
  border-top: 0 none;
}

.table_wrap table tbody tr:last-child th,
.table_wrap table tbody tr:last-child td {
  border-bottom: 0 none;
}

/* 스마트도서관이용안내 */
table.row_table th,
table.row_table td {
  padding: 20px 20px;
}

table.row_table th {
  color: #252525;
  font-weight: 600;
}

.re_block {
  display: block;
  color: #DB0505;
  margin-top: 5px;
  font-size: 15px;
}

.content.smart_content {
  float: left;
  width: 56%;
}

.img_box {
  width: 100%;
  height: auto;
  margin-bottom: 40px;
}

.img_box::after {
  display: block;
  content: "";
  clear: both;
}

.img_box img {
  display: block;
  width: 40%;
  height: auto;
  float: right;
}

.banner-wrap .banner-t4 .control a.prev,
.banner-wrap .banner-t4 .control a.next {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0;
  border: 1px solid #e1e1e0;
}

.banner-wrap .banner-t4 .control a.prev::before {
  display: block;
  content: "";
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='30' height='30' fill='rgba(221,221,221,1)'%3E%3Cpath d='M10.8284 12.0007L15.7782 16.9504L14.364 18.3646L8 12.0007L14.364 5.63672L15.7782 7.05093L10.8284 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}

.banner-wrap .banner-t4 .control a.next::before {
  display: block;
  content: "";
  width: 30px;
  height: 30px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='30' height='30' fill='rgba(221,221,221,1)'%3E%3Cpath d='M13.1717 12.0007L8.22192 7.05093L9.63614 5.63672L16.0001 12.0007L9.63614 18.3646L8.22192 16.9504L13.1717 12.0007Z'%3E%3C/path%3E%3C/svg%3E");
}

.banner-wrap .banner-t4 .control a.next img,
.banner-wrap .banner-t4 .control a.prev img {
  border: 0 none;
  width: 50%;
  display: none;
}

/* ---- 반응형 시작 ---- */
@media (max-width: 1500px) {
  .section_wrap .container {
    margin: 0 0 0 5%;
  }
}

@media (max-width: 1430px) {
  .section_wrap .container {
    margin: 0 0 0 2%;
  }

  .h_logo {
    padding-left: 2%;
  }
}

@media screen and (max-width: 1475px) {

  html,
  body {
    min-width: 100%;
  }

  .mouse {
    display: none;
  }

  .container {
    width: 100%;
  }

  #header {
    position: relative;
    transform: none;
    left: 0;
    border-bottom-color: #ededed;
  }

  body.main #header {
    position: relative;
    transform: none;
    left: 0;
  }

  .h_right>.tnb {
    position: absolute;
    right: 20px;
    top: -41px;
    margin-right: 0;
    gap: 25px;
  }

  .h_right>.tnb>a {
    width: 24px;
    height: 24px;
  }

  .h_right>.tnb>a.search,
  .h_right>.tnb>a.login,
  .h_right>.tnb>a.logout {
    background-size: contain;
  }

  .h_right>.tnb>a.logout {
    padding: 0 0 0 33px;
    margin-right: 0;
  }

  .h_right>.toggle {
    display: none;
  }

  .gnb {
    margin-left: auto;
  }

  .gnb>ul>li {
    width: 120px;
  }

  .gnb>ul>li>a {
    font-size: 18px;
  }

  #container.subpage>.section {
    padding: 50px 20px;
    box-sizing: border-box;
  }

  .lnb {
    width: 18%;
  }

  div.content {
    width: 75%;
    padding-left: 0;
    margin-right: 0;
  }

  .search_condition {
    position: relative;
  }

  /*.search_condition .btn_wrap {position: absolute; right: 20px; top: 50%; transform: translateY(-50%);}*/
  .gnb-menu>li:before {
    width: 100%;
    height: 100px;
  }

  #header .gnb ul ul a {
    padding: 4px 8px;
  }

  #header .gnb ul ul a span {
    word-break: break-all;
    font-size: 16px;
  }

  #section1 .section_bottom {
    max-width: calc(100% - 40px);
  }

  #section1 .pagination_wrap,
  #section2 .section2_wrapper,
  #section3 .section3_wrapper {
    padding: 14px 20px;
    left: 20px;
    box-sizing: border-box;
  }

  .gallery-box {
    padding: 0 0 0 20px;
  }

  #section1 {
    padding-bottom: 150px;
  }

  #section1 .swiper-pagination-progressbar.swiper-pagination-horizontal {
    left: 16%;
  }

  #section1 .section_bottom>.bottom_left {
    padding: 10px;
  }

  #section1 .section_bottom>.bottom_left>form>.search_box>select,
  #section1 .section_bottom>.bottom_left>form>.search_box>input {
    font-size: 17px;
  }

  #section2 .section2_wrapper>.section2_left>ul>li>strong::before,
  #section2 .section2_wrapper>.section2_right>ul>li>strong::before {
    margin-right: 12px;
  }

  #section1 .section_bottom>.bottom_right>ul>li>a {
    font-size: 15px;
    letter-spacing: -0.05em;
  }

  #section2 .section2_wrapper>.section2_left>ul>li>span {
    display: none;
  }

  #section2 .section2_wrapper>.section2_left>ul>li>a {
    max-width: 82%;
  }

  .banner-wrap>.banner-box4 {
    padding: 20px;
    box-sizing: border-box;
  }

  .banner-wrap .banner-t4 .control a.prev {
    left: 10px;
  }

  .banner-wrap .banner-t4 .control a.next {
    right: 10px;
  }

  .banner-wrap .banner-box4>div {
    margin-left: 30px !important;
    margin-right: 30px !important;
  }

  .main_swiper1,
  .main_swiper2,
  .main_swiper3,
  .main_swiper4,
  .main_swiper_link,
  .popZone .bx-controls {
    left: 20px;
  }

  .bx-viewport li.has_introMovie .main_swiper1,
  .bx-viewport li.has_introMovie .main_swiper2,
  .bx-viewport li.has_introMovie .main_swiper3,
  .bx-viewport li.has_introMovie .main_swiper4 {
    left: 20px;
  }

  .bx-viewport .main_swiper_link,
  .bx-viewport .active .main_swiper_link {
    left: 20px;
  }

  .login-box {
    width: 80%;
  }

  .footer_wrap {
    padding: 0px;
    box-sizing: border-box;
  }

  .footer_bottom {
    height: auto;
    padding: 30px 20px 30px 280px;
  }

  .footer_bottom h2 {
    padding-left: 20px;
  }

  .footer_bottom address {
    margin-bottom: 10px;
  }

  .footer_bottom dl {
    padding: 0;
  }

  .footer_bottom dl dt:before {
    display: none;
  }

  .footer_bottom .copyright {
    margin-top: 15px;
  }

  /* --- 퀵메뉴 수정 ---*/
  .quick_menu {
    position: initial;
    transform: none;
    width: 100%;
    padding: 16px 20px;
    border-bottom: 1px solid #dbdbdb;
    box-sizing: border-box;
  }

  .quick_menu h3 {
    display: none;
  }

  .quick_menu ul {
    border-radius: 0;
    box-shadow: none;
    padding-top: 0;
    width: 100%;
  }

  .quick_menu ul li {
    display: inline-block;
    margin-bottom: 0;
    width: auto;
    border-right: 1px solid #ededed;
    margin-right: 14px;
  }

  .quick_menu ul li:last-child {
    margin-right: 0;
    border-right: 0;
  }

  .quick_menu ul>li>a {
    border-bottom: 0 none;
    width: auto;
    padding-bottom: 0;
    padding: 5px 14px 5px 0px;
    font-size: 16px;
    color: #757575;
    font-weight: 600;
  }

  body.lib_NE .quick_menu ul>li:nth-of-type(1)>a,
  body.lib_NA .quick_menu ul>li:nth-of-type(1)>a,
  body.lib_SS .quick_menu ul>li:nth-of-type(1)>a {
    padding-top: 5px;
  }



  #header.on+.hover_bg {
    display: none;
  }

  body.lib_SS .quick_menu ul,
  body.lib_NA .quick_menu ul,
  body.lib_NE .quick_menu ul {
    padding-top: 0;
  }

  .group_wrap ol li ul::after {
    width: 77%;
  }

  .apc_wrap .down_wrap .down_btn {
    position: initial;
    transform: initial;
    display: inline-block;
    margin-top: 15px;
  }


  .gallery-box {
    top: 90px;
  }

  .condition_div {
    /*margin: 8px 0;*/
    display: block;
  }

  .condition_div+.condition_div {
    margin-top: 12px;
  }

  .search_condition.center .condition_div {
    display: inline-block;
  }

  .search_condition {
    position: relative;
  }

  .search_condition .btn_wrap {
    position: absolute;
    right: 20px;
    top: 50%;
    transform: translateY(-50%);
  }

  /* --- 문화강좌 view ---*/


  /* --- 테블릿 헤더? --- */
  .h_logo {
    padding-left: 0;
    width: 100%;
    padding: 20px 0;
    text-align: center;
    border-bottom: 1px solid #ededed;
  }

  #header {
    flex-flow: column nowrap;
    height: auto;
  }

  .gnb {
    margin-left: initial;
    width: 100%;
  }

  .gnb>ul>li {
    width: calc(100% / 6);
    height: 70px;
  }

  .gnb>ul>li>a {
    line-height: 70px;
  }

  .gnb>ul>li>ul {
    border-top: 1px solid #ededed;
  }

  #header.on.gnb8 .nav_bg {
    top: 147px;
    box-shadow: 0 10px 10px 0 rgba(217, 217, 217, 0.3);
  }

  .h_right>.tnb {
    top: 26px;
    z-index: 100;
  }

  .quick_menu {
    position: absolute;
    left: 20px;
    right: initial;
    top: 24px;
    width: auto;
    border-bottom: 0 none;
    padding: 0;
  }

  .quick_menu ul>li>a {
    font-size: 0;
    line-height: 1;
  }

  .quick_menu ul>li.lib_YB>a::before {
    display: inline-block;
    content: "연봉";
    font-size: 17px;
  }

  .quick_menu ul>li.lib_SS>a::before {
    display: inline-block;
    content: "서석";
    font-size: 17px;
  }

  .quick_menu ul>li.lib_NA>a::before {
    display: inline-block;
    content: "남면";
    font-size: 17px;
  }

  .quick_menu ul>li.lib_NE>a::before {
    display: inline-block;
    content: "내면";
    font-size: 17px;
  }

  .quick_menu ul>li.lib_NR>a::before {
    display: inline-block;
    content: "별빛나루";
    font-size: 17px;
  }

  .quick_menu ul>li.lib_CH>a::before {
    display: inline-block;
    content: "어린이";
    font-size: 17px;
  }

  .quick_menu ul>li.lib_In>a::before {
    display: inline-block;
    content: "Intro";
    font-size: 17px;
  }

  .quick_menu .top_move_btn {
    width: 50px;
    height: 50px;
    position: fixed;
    right: 1%;
    bottom: 2%;
    transform: initial;
    background-size: 36px 36px;
  }

  #section2 .section2_wrapper::after {
    width: 300px;
    height: 300px;
  }
}

@media screen and (max-width: 1366px) {

  .gnb-menu>li:before {
    content: "";
    display: block;
    background-color: rgba(255, 255, 255, 0);
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 130;
  }
}

@media screen and (max-width: 1023px) {

  html,
  body {
    min-width: 100%;
    overflow-x: hidden !important;
  }

  body {
    overflow-x: hidden;
  }

  .h_right>.toggle {
    display: flex;
  }

  .doc {
    padding: 0;
  }

  #header {
    flex-flow: row nowrap;
    height: 58px;
    border-bottom: 0px none;
    position: relative;
    box-shadow: 0px 0px 5px 0px rgba(0, 0, 0, 0.15)
  }

  body.main #header {
    position: relative;
  }

  #header .h_logo {
    width: 166px;
    height: 30px;
    padding: 0 0 0 20px;
    border-bottom: 0 none;
    text-align: left;
  }

  .h_logo a {
    width: 166px;
    height: 30px;
    font-size: 20px;
  }

  .lib_NR #header .h_logo {
    width: auto;
    height: auto;
  }

  .lib_NR .h_logo a {
    width: 165px;
    height: 30px;
    font-size: 0;
  }

  .h_logo>a::before {
    width: 34px;
    height: 28px;
    background-size: cover;
  }

  .h_right>.toggle {
    width: 58px;
    height: 58px;
    position: relative;
  }

  #wrap #header .h_right>.toggle:before {
    display: block;
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: transparent;
  }

  .h_right>.toggle>span {
    width: 20px;
    margin-bottom: 6px;
  }

  #header .h_right>.toggle:before,
  #header .h_right>.toggle:after {
    width: 20px;
  }

  .gnb,
  .h_right .tnb,
  .quick_menu {
    right: -100%;
  }

  #header+.hover_bg {
    display: none;
  }

  .nav_bg.on {
    display: block;
  }

  .gnb {
    position: fixed;
    top: 108px;
    width: 100%;
    height: 100vh;
    background: linear-gradient(90deg, #f5f5f5 120px, #ffffff 121px);
    border-top: 1px solid #dbdbdb;
    transition: all 0.2s;
    z-index: 10;
  }

  #header .gnb ul ul * {
    transition: none;
  }

  #header .gnb>ul {
    display: block;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #f5f5f5 120px, #ffffff 121px);
    justify-content: initial;
    border-right: 1px solid #dbdbdb;
    box-sizing: border-box;
    position: relative;
  }

  #header .gnb>ul>li {
    width: 120px;
    height: 70px;
    line-height: 70px;
    background: transparent;
    box-sizing: border-box;
    position: relative;
  }

  #header .gnb>ul>li>a {
    font-size: 0;
    line-height: 70px;
    color: #777;
    font-weight: 900;
  }

  #header .gnb>ul>li>a span {
    font-size: 18px;
  }

  #header .gnb>ul>li.on>a span {
    color: #757575;
  }

  #header .gnb>ul>li.on {
    background: #fff;
    border-right: 1px solid #fff;
  }

  #header .gnb>ul>li.on>a {
    padding-top: 0;
  }

  #header .gnb>ul>li.on>a span {
    color: #01ab9d;
  }

  #header .gnb>ul>li.on ul {
    background: #fff;
  }

  #header .gnb>ul a span:before {
    display: none;
  }


  /* --- gnb --- */
  #header .gnb .gnb-menu>li>.SubMenu>li>ul {
    display: block;
  }

  .h_right .tnb {
    width: 100%;
    height: 58px;
    position: fixed;
    top: 0;
    margin-right: 0;
    z-index: 100;
    background: linear-gradient(87.47deg, #01ab9d 28.67%, #01ab64 87.37%);
    padding: 0 20px;
    box-sizing: border-box;
    transition: all 0.2s;
    align-items: center;
    gap: 20px;
  }

  .h_right .tnb>a.search {
    display: none;
  }

  .h_right>.tnb>a.login {
    width: auto;
    height: 100%;
    background: none;
    font-size: 20px;
    line-height: 58px;
    color: #fff;
    padding-right: 20px;
    background: url("/resources/common/img/m_login_arrow.svg") no-repeat right center;
    opacity: 1;
  }

  .h_right>.tnb>a.mobile_card {
    display: flex;
    align-items: center;
    width: auto;
    font-size: 18px;
    color: #fff;
    opacity: 1;
    font-weight: 600;
    padding: 0 0 0 30px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='24' height='24' fill='rgba(255,255,255,1)'%3E%3Cpath d='M7 4V20H17V4H7ZM6 2H18C18.5523 2 19 2.44772 19 3V21C19 21.5523 18.5523 22 18 22H6C5.44772 22 5 21.5523 5 21V3C5 2.44772 5.44772 2 6 2ZM12 17C12.5523 17 13 17.4477 13 18C13 18.5523 12.5523 19 12 19C11.4477 19 11 18.5523 11 18C11 17.4477 11.4477 17 12 17Z'%3E%3C/path%3E%3C/svg%3E") no-repeat left center;
  }

  button.close_btn {
    display: block;
    background: transparent;
    width: 20px;
    height: 20px;
    font-size: 0;
    margin-top: -3px;
    margin-left: auto;
  }

  button.close_btn::before,
  button.close_btn::after {
    display: block;
    content: '';
    width: 23px;
    height: 3px;
    background: #fff;
    position: absolute;
  }

  button.close_btn::before {
    transform: rotate(45deg);
  }

  button.close_btn::after {
    transform: rotate(-45deg);
  }

  .quick_menu {
    position: fixed;
    top: 58px;
    left: initial;
    width: 100%;
    height: 56px;
    transform: initial;
    z-index: 150;
    transition: all 0.2s;
    padding: 0;
  }

  .quick_menu>h3 {
    display: none;
  }

  .quick_menu ul {
    width: 100%;
    display: flex;
    height: 50px;
    padding-top: 0;
    box-shadow: none;
    border-radius: 0px;
  }

  .quick_menu ul>li {
    flex: 1;
    margin-bottom: 0;
    height: 50px;
    line-height: 50px;
    margin-right: 0;
  }

  .quick_menu ul>li>a {
    background: #fff;
    width: 100%;
    height: 100%;
    line-height: 50px;
    padding: 0;
    font-size: 0;
    border-right: 1px solid #dbdbdb;
    font-weight: 500;
  }

  .quick_menu ul>li:last-child>a {
    border-right: 0 none;
  }

  #header+.hover_bg+.quick_menu {
    right: -100%;
  }

  #header .nav_bg {
    background: #000;
    opacity: 0.7;
    width: 100%;
    height: 100vh;
    position: fixed;
    top: 0;
    display: none;
    transition: none;
    z-index: 1;
  }



  /*body.a00 #header .gnb > ul li.a00 ul, body.b00 #header .gnb > ul li.b00 ul, body.c00 #header .gnb > ul li.c00 ul body.d00 #header .gnb > ul li.d00 ul, body.e00 #header .gnb > ul li.e00 ul, body.f00 #header .gnb > ul li.f00 ul {display: block;}*/

  /* --- header addClass on --- */
  body.main #header.on {
    position: fixed;
  }

  header#header.on .h_right>.toggle:before,
  header#header.on .h_right>.toggle:after {
    width: 25px;
    position: absolute;
    z-index: 150;
    display: none;
  }

  #header.on nav.gnb {
    overflow-y: auto;
  }

  #header.on .gnb,
  #header.on .tnb {
    right: 0;
  }

  #header.on .gnb ul li ul a span {
    padding: 0;
  }

  #header.on .gnb ul ul.SubMenu,
  #header.on .nav_bg {
    height: 100vh;
  }

  #header.on .gnb ul li.on ul.SubMenu {
    display: block;
  }

  #header.on .gnb ul ul.SubMenu li ul {
    border: 0 none;
    padding-left: 10px;
    height: auto;
    margin-bottom: 20px;
  }

  #header.on .gnb ul ul.SubMenu li ul li {
    background: transparent url("/resources/homepage//yblib/img/sub_nav.svg") no-repeat left top 3px;
    padding-left: 12px;
  }

  #header.on .gnb ul ul.SubMenu li ul li:last-child a {
    margin-bottom: 0;
  }

  #header.on .gnb ul ul.SubMenu li ul a {
    font-size: 16px;
    margin-bottom: 10px;
    padding-top: 0;
    padding-bottom: 10px;
    border-bottom: 0 none;
    color: #757575;
  }

  header#header.on.gnb8 .nav_bg {
    height: 100vh;
    display: block;
  }

  #header.on+.hover_bg+.quick_menu {
    right: 0;
  }

  #header.on .gnb ul ul.SubMenu {
    opacity: 1;
    overflow: visible;
    height: 100vh;
    left: 120px;
    top: 116px;
    right: 0;
    bottom: 0;
    position: fixed;
    display: none;
    border: 0px none;
    padding: 40px 20px 0px;
    box-sizing: border-box;
    transition: none;
  }

  #header.on .gnb ul ul.SubMenu>li {
    text-align: left;
  }

  #header.on .gnb ul ul.SubMenu>li>a {
    font-size: 17px;
    letter-spacing: initial;
    color: #252525;
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 1px solid #ededed;
    font-weight: 700;
  }

  #header.on .gnb ul ul.SubMenu>li:first-child a {
    padding-top: 0;
  }

  body.lib_NE .quick_menu ul>li:nth-of-type(1)>a,
  body.lib_NA .quick_menu ul>li:nth-of-type(1)>a,
  body.lib_SS .quick_menu ul>li:nth-of-type(1)>a {
    padding-top: 0;
  }

  .quick_menu.m_on {
    right: 0;
  }

  .quick_menu .top_move_btn {
    width: 40px;
    height: 40px;
    right: 2%;
    background-size: 32px 32px;
  }

  /* mobile_section1 */

  .content {
    width: 100%;
  }

  #section1 {
    padding-bottom: 30px;
  }

  #section1,
  #section1 .fp-tableCell {
    vertical-align: top;
    height: auto !important;
  }

  #section1 .section1_wrapper {
    margin-top: 0;
    height: auto;
  }

  #section1 .main_visual_wrapper {
    height: 480px;
  }

  #section1 .section_bottom {
    width: 100%;
    height: auto;
    padding: 0px 20px;
    flex-flow: column nowrap;
    border: 0 none;
    box-shadow: none;
    border-radius: 0;
    position: initial;
    gap: 30px;
    margin: 30px auto 0;
    transform: initial;
    max-width: 100%;
  }

  #section1 .section_bottom>.bottom_left {
    display: flex;
    width: 100%;
    height: 50px;
    box-sizing: border-box;
    padding: 0px;
    border: 1px solid #dbdbdb;
    border-radius: 5px;
    justify-content: space-between;
  }

  #section1 .search_box {
    display: flex;
    width: 100%;
  }

  #section1 .section_bottom>.bottom_right {
    width: 100%;
    height: auto;
  }

  #section1 .section_bottom>.bottom_right ul {
    height: 240px;
    flex-flow: row wrap;
    border: 1px solid #dbdbdb;
    border-radius: 5px;
    overflow: hidden;
  }

  #section1 .section_bottom>.bottom_right ul li {
    flex-basis: 33.33%;
    border-right: 1px solid #dbdbdb;
    border-bottom: 1px solid #dbdbdb;
    box-sizing: border-box;
  }

  #section1 .section_bottom>.bottom_right ul li a {
    padding-top: 88px;
    background-position: center top 25px;
  }

  #section1 .section_bottom>.bottom_right>ul>li:nth-child(2)>a,
  #section1 .section_bottom>.bottom_right>ul>li:nth-child(3)>a,
  #section1 .section_bottom>.bottom_right>ul>li:nth-child(4)>a,
  #section1 .section_bottom>.bottom_right>ul>li:nth-child(5)>a,
  #section1 .section_bottom>.bottom_right>ul>li:nth-child(6)>a {
    background-position: center top 25px;
  }

  #section1 .section_bottom>.bottom_right ul li:nth-child(4),
  #section1 .section_bottom>.bottom_right ul li:nth-child(5),
  #section1 .section_bottom>.bottom_right ul li:nth-child(6) {
    border-bottom: 0 none;
  }

  #section1 .section_bottom>.bottom_right ul li:nth-child(3),
  #section1 .section_bottom>.bottom_right ul li:nth-child(6) {
    border-right: 0 none;
  }

  #section1 .section_bottom>.bottom_left>form>.search_box>select {
    width: 50px;
    padding-left: 6px;
    padding-right: 0;
    font-size: 15px;
    background-size: 7px 4px;
  }

  #section1 .section_bottom>.bottom_left>form>.search_box>input {
    height: 35px;
    margin-left: 8px;
    padding-left: 8px;
    font-size: 15px;
    width: 100%;
  }

  #fullpage #section1 .section_bottom>.bottom_left>form>button {
    display: inline-block;
    width: 40px;
    height: 50px;
    border-radius: 0px 5px 5px 0px;
    background: #01ab9d url('/resources/homepage/yblib/img/main_search.svg') no-repeat center center;
    background-size: 18px 18px;
    font-size: 0;
    margin-left: 0;
  }

  #section1 .swiper-pagination-progressbar.swiper-pagination-horizontal {
    display: none;
  }

  .main #section1 .pagination_wrap {
    gap: 10px;
    padding: 10px 20px;
    left: 20px;
    bottom: 10%;
    transform: initial;
  }

  .main #section1 .pagination_wrap .swiper-pagination {
    width: auto;
    gap: 5px;
  }

  #section1 .main_visual_arrow {
    gap: 10px;
    margin: 0;
  }

  #section1 .swiper-pagination .swiper-pagination-current {
    font-size: 18px;
    font-weight: 800;
  }

  #section1 .swiper-pagination .slash {
    display: inline-block;
  }

  .bx-wrapper,
  .intro_movie {
    height: 480px;
  }

  /* mobile_section2 */
  #section2 {
    height: auto !important;
  }

  #section2>.fp-tableCell {
    height: auto !important;
    padding: 50px 0;
  }

  #section2 .section2_wrapper {
    flex-flow: column nowrap;
    margin-top: 0;
    gap: 50px;
  }

  #section2 .section2_wrapper {
    width: 100%;
    padding: 0px 20px;
  }

  #section2 .section2_wrapper>.section2_left>.left_title>h2,
  #section2 .section2_wrapper>.section2_right>.right_title>h2 {
    font-size: 24px;
    color: #252525;
    font-weight: 900;
  }

  #section2 .section2_wrapper>.section2_left>ul,
  #section2 .section2_wrapper>.section2_right>ul {
    width: 100%;
    height: auto;
    background: #fff;
    padding: 25px 20px;
  }

  #section2 .section2_wrapper>.section2_left,
  #section2 .section2_wrapper>.section2_right {
    width: 100%;
  }

  #section2 .section2_wrapper>.section2_left>ul>li,
  #section2 .section2_wrapper>.section2_right>ul>li {
    background-size: 6px 6px;
  }

  #section2 .section2_wrapper>.section2_left>ul>li,
  #section2 .section2_wrapper>.section2_right>ul>li {
    padding-bottom: 12px;
  }

  #section2 .section2_wrapper ul>li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
  }

  #section2 .section2_wrapper>.section2_left>ul>li strong::before {
    content: "N";
    margin-right: 10px;
  }

  #section2 .section2_wrapper>.section2_left>ul>li a {
    max-width: 85%;
  }

  #section2 .section2_wrapper>.section2_left>ul>li span {
    display: none;
  }

  #section2 .section2_wrapper ul>li a {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 16px;
  }

  #section2 .section2_wrapper>.section2_right>ul>li {
    background-position: left top 12px;
  }

  #section2 .section2_wrapper>.section2_left>ul>li::before,
  #section2 .section2_wrapper>.section2_right>ul>li::before {
    width: 8px;
    height: 8px;
    margin-right: 8px;
  }

  #section2 .section2_wrapper>.section2_right>ul>li a {
    display: inline-block;
  }

  #section2 .section2_wrapper>.section2_right>ul>li strong {
    margin-right: 8px;
  }

  #section2 .section2_wrapper>.section2_left>.left_title>a,
  #section2 .section2_wrapper>.section2_right>.right_title>a {
    width: 30px;
    height: 30px;
    background-size: contain
  }

  #section2 .section2_wrapper>.section2_left>ul::before,
  #section2 .section2_wrapper>.section2_left>ul::after,
  #section2 .section2_wrapper>.section2_left>.left_title>h2:before,
  #section2 .section2_wrapper>.section2_left h2:before,
  #section2>.fp-tableCell::before,
  #section2>.fp-tableCell::after,
  #section2 .section2_wrapper::after {
    display: none;
  }

  #section2 .section2_wrapper>.section2_right>ul>li span {
    font-size: 14px;
    font-weight: 400;
    width: auto;
    padding: 0 6px;
    letter-spacing: -0.03em;
  }

  /* mobile_section3 */
  #section3 {
    height: 600px !important;
    position: relative;
  }

  #section3::before,
  #section3::after {
    display: none;
  }

  #section3 .fp-tableCell {
    height: auto !important;
    vertical-align: top;
  }

  #section3 .section3_wrapper {
    width: 100%;
    flex-flow: column nowrap;
    align-items: flex-start;
    gap: 24px;
    margin-top: 46px;
    padding: 0px 20px;
    left: 0;
  }

  #section3 .section3_wrapper>.pick_title>h2 {
    font-size: 24px;
    color: #252525;
    font-weight: 900;
  }

  #section3 .section3_wrapper>.pick_menu>ul>li>a {
    font-size: 18px;
  }

  .gallery-box {
    width: 100%;
    padding: 0;
    top: 105px;
    height: auto;
  }

  .gallery-box .gallery-thumb-box {
    width: 100%;
    overflow-x: hidden;
    overflow: visible;
    padding-top: 0;
  }

  .gallery-box .gallery-main-box {
    position: fixed;
    left: -99999px;
  }

  .gallery-box .gallery-thumb-box .swiper-wrapper {
    left: 0px;
    height: 226px;
  }

  .gallery-box p.story {
    display: block;
  }

  #section3 .fp-tableCell::after {
    display: block;
    content: '';
    width: 100%;
    height: 350px;
    position: absolute;
    left: 0;
    bottom: 0;
    background: linear-gradient(241.44deg, #01AB78 0%, #01AB9D 100%);
    z-index: -1;
  }

  .gallery-box .control-wrap,
  .gallery-box .control-wrap2,
  .gallery-box .control-wrap3 {
    width: 90px;
    height: 30px;
    right: 20px;
    top: -106px;
  }

  .gallery-box .control-wrap a:not(:last-child),
  .gallery-box .control-wrap2 a:not(:last-child),
  .gallery-box .control-wrap3 a:not(:last-child),
  .gallery-box .control-wrap .swiper-gallery-more,
  .gallery-box .control-wrap2 .swiper-gallery-more2,
  .gallery-box .control-wrap3 .swiper-gallery-more3 {
    width: 28px;
    height: 28px;
  }

  .gallery-box .gallery-thumb-box .swiper-slide {
    position: relative;
    width: 170px;
    text-align: center;
  }

  .gallery-box .gallery-thumb-box .swiper-slide a {
    width: 100px;
    height: 150px;
    margin: 35px auto 0;
    border: 0 none;
    box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.3);
  }

  .gallery-box .gallery-thumb-box .swiper-slide.swiper-slide-active a {
    width: 150px;
    height: 226px;
    margin-top: 0;
  }

  #section3 .gallery-box .gallery-thumb-box .swiper-slide .title_box {
    position: relative;
    width: 300px;
    left: 50%;
    transform: translateX(-50%);
  }

  .gallery-box .gallery-thumb-box h3 {
    font-size: 18px;
    width: auto;
    color: #fff;
    text-align: center;
    display: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .gallery-box .gallery-thumb-box p.writer {
    font-size: 16px;
    color: #fff;
    text-align: center;
    display: none;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .gallery-box .gallery-thumb-box p.story {
    position: absolute;
    width: 340px;
    color: #fff;
    font-size: 16px;
    padding: 0px 10px;
    box-sizing: border-box;
    left: 50%;
    top: 58px;
    transform: translateX(-50%);
    z-index: 100;
    line-height: 1.4em;
    display: none;
  }

  .gallery-box .swiper-slide-active h3,
  .gallery-box .swiper-slide-active p.writer {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    ;
  }

  .gallery-box .swiper-slide-active p.story {
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }

  .gallery-box .gallery-thumb-box .swiper-slide .info-img img {
    border: 0 none;
    box-shadow: 0px 0px 8px 0px rgba(144, 144, 144, 0.4);
  }


  /* mobile_footer */
  #footer {
    border-top: 0 none;
  }

  .main #footer .footer_bottom {
    height: auto;
  }

  .footer_bottom h2 {
    display: none;
  }

  footer#footer .footer_bottom.container {
    width: 100%;
    height: auto;
    padding: 0 0 20px;
    text-align: center;
  }

  .rolling_box {
    display: none;
  }

  footer .bottom_nav {
    display: flex;
    flex-flow: row wrap;
    padding: 0;
    height: auto;
    margin-bottom: 20px;
  }

  footer .bottom_nav a {
    flex-basis: 50%;
    padding: 15px;
    text-align: center;
    padding: 20px 0;
    border-bottom: 1px solid #757575;
    border-right: 1px solid #757575;
    box-sizing: border-box;
  }

  footer .bottom_nav a:nth-child(2),
  footer .bottom_nav a:nth-child(4) {
    border-right: 0 none;
  }

  .bottom_nav a:last-child {
    flex-basis: 100%;
    border-right: 0 none;
  }

  footer .footer_bottom address {
    margin-bottom: 5px;
    width: 100%;
    padding: 0px 20px;
    text-align: center;
    box-sizing: border-box;
    line-height: 1.3em;
    margin-bottom: 16px;
  }

  footer .footer_bottom dl {
    padding: 0px 20px;
    width: 100%;
    box-sizing: border-box;
  }

  footer .footer_bottom dl dt:first-child::before {
    display: none;
  }

  footer .footer_bottom .copyright {
    font-size: 14px;
    margin-top: 30px;
    padding: 0px 20px;
  }


  /* --- 신착도서 목록 ---*/
  .doc-body {
    margin-top: 30px;
  }

  .doc-title.section_header ol li a {
    font-size: 14px;
  }

  #container.subpage>.section {
    padding: 0 20px;
    min-height: 550px;
  }

  div.content {
    width: 100%;
    float: none;
    padding: 0px 0px;
    box-sizing: border-box;
    margin-bottom: 20px;
  }

  div.section_wrap {
    padding: 0px;
    width: 100%;
    box-sizing: border-box;
  }

  div.section_wrap .content {
    width: 100%;
    margin: 0;
    display: flex;
    flex-flow: column nowrap;
  }

  .content .snb {
    width: 100%;
    padding: 20px;
    box-sizing: border-box;
    display: none;
  }

  .content .section_header {
    margin-bottom: 0px;
    padding: 40px 0 10px;
    border-bottom: 0 none;
    display: flex;
    flex-flow: column nowrap;
    align-items: center;
  }

  .content .section_header h3 {
    width: 100%;
    font-size: 26px;
    padding-right: 0;
    text-align: center;
    padding-top: 0;
  }

  .content .section_header h3::before {
    display: none;
  }

  .section_header ol {
    padding-top: 15px;
  }

  .content .h4 {
    padding: 20px 0 12px 0;
  }

  .nonmember_btn {
    margin: 30px 0 0;
  }

  .content .condition_div {
    margin-right: 0;
  }

  body.a10 .content .condition_div strong {
    display: none;
  }

  body.a10 .content .condition_div:nth-of-type(2) {
    margin-bottom: 20px;
  }

  body.a10 .content .condition_div:nth-of-type(2) strong {
    display: inline-block;
    color: #252525;
    font-weight: 600;
    margin-right: 10px;
  }

  .content .search_condition {
    padding: 8px 16px 12px;
    margin-top: 15px;
  }

  .content .search_condition .btn_wrap {
    /*position: relative; top: -44px;*/
    float: none;
    display: block;
    text-align: center;
    margin-top: 15px;
    position: initial;
    transform: none;
  }

  .content .search_condition .btn_wrap a {
    width: 100%;
  }

  .content .search_condition .condition_div,
  .content .search_condition .condition_div .select_period {
    display: flex;
    align-items: center;
    width: 100%;
  }

  .content .search_condition .condition_div {
    flex-flow: row wrap;
  }

  .content .search_condition .condition_div input,
  .content .search_condition .condition_div select,
  .select_period button {
    flex: 1;
    width: 100%;
  }

  .content .search_condition .condition_div input,
  .content .search_condition .condition_div select {
    margin: 3px 0px;
    margin-right: 3px;
  }

  .content .search_condition .condition_div select {
    width: 100%;
    flex: none;
    margin-right: 0;
  }

  .content .search_condition .condition_div input:last-of-type,
  .content .search_condition .condition_div select:last-child {
    margin-right: 0;
  }

  .content .search_condition .condition_div input:last-of-type {
    margin-left: 3px;
  }

  .condition_div .select_period {
    margin: 3px 0px;
  }

  .content .search_condition .condition_div .select_period input {
    flex: none;
    width: auto;
    margin-right: 4px;
  }

  .content .search_condition .condition_div .select_period label+input {
    margin-left: 15px;
  }

  .condition_div .select_period button.on::before {
    display: none
  }

  .content .search_condition .condition_div img {
    width: 24px;
    height: 24px;
  }

  .content .search_result_head {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    padding: 20px 0 10px;
  }

  .content .search_result_head .select_check {
    margin-right: 0;
    display: block;
    width: 100%;
    text-align: right;
    margin-bottom: 15px;
  }

  .content .search_result_head .label_border_wrap {
    margin: 0 0 0 2%;
    width: 32%;
    box-sizing: border-box;
  }

  .content .search_result_head .label_border_wrap:nth-of-type(2) {
    margin: 0;
  }

  .content .search_result_head .label_border_wrap select {
    width: 100%;
  }

  .search_result {
    display: flex;
    flex-flow: row wrap;
  }

  .content .search_result_head .btn_view_type {
    display: none
  }

  .content .search_result>article {
    padding: 20px 12px;
    width: 100%;
    margin-left: 0;
    height: auto;
    min-height: initial;
  }

  .view_list .search_result.result_chk>article {
    margin-left: 0;
  }

  .content .search_result>article .bookCover {
    position: absolute;
    left: 16px;
    top: 20px;
    width: 100px;
    height: 160px;
    box-sizing: border-box;
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.4);
    margin-bottom: 0;
  }

  .content .search_result>article h5 {
    overflow: visible;
    white-space: initial;
    text-align: left;
    box-sizing: border-box;
    font-size: 18px;
    padding: 0px 0px 10px 120px;
  }

  .content .search_result>article h5 a {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    width: calc(100% - 28px);
  }

  .content .search_result dl {
    margin-bottom: 14px;
  }

  .content .search_result dl>span {
    padding: 5px 0px 5px 120px;
    text-align: left;
  }

  .content .search_result dl>span:first-child {
    text-align: left;
    padding: 5px 0px 12px 120px;
    display: flex;
    flex-flow: row wrap;
    gap: 6px 8px;
  }

  .content .search_result dl>span:first-child>span {
    padding-right: 8px;
    border-right: 1px solid #ddd;
  }

  .content .search_result dl>span:first-child>span:last-child {
    padding-right: 0;
    border-right: 0 none;
  }

  .content .search_result dl>span:first-child dd {
    font-weight: 400;
    font-size: 14px;
  }

  .content .search_result dl>span:first-child span:first-child dd {
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    word-break: keep-all;
  }

  .content .search_result dl>span>span {
    display: inline-block;
  }

  /*.content .search_result dl > span > span:first-child {width: 100%;}*/
  .content .search_result dl span>span:first-child dt,
  .content .search_result dl span span:first-of-type dd,
  .content .search_result dl>span>dt {
    padding-left: 0;
  }

  .content .search_result dl>span>dt,
  .view_thum .search_result dl>span:not(:first-child)>dt {
    width: 65px;
    vertical-align: top;
  }

  .content .search_result dl>span>dd {
    width: calc(100% - 65px);
    word-break: break-all;
    padding-right: 0;
  }

  .content .search_result dl>span>span dd {
    padding-left: 0;
    padding-right: 0;
  }

  .content .search_result dl dd {
    background: none;
    padding-left: 0;
  }

  .content .view_thum .search_result dl dt {
    padding-left: 0;
  }

  .content .view_list .search_result dl dd {
    padding-right: 0;
    font-size: 15px;
  }


  .content .search_result>article label {
    width: 18px;
    height: 18px;
    position: absolute;
    left: initial;
    right: 16px;
    top: 20px;
  }

  .content .search_result>article label input {
    margin: 0;
  }

  .view_list .search_result>article {
    position: relative;
  }


  .search_result>article .loan_status_x,
  .search_result>article .loan_status_o {
    width: 100%;
    box-sizing: border-box;
    text-align: center;
    margin: 3px 0;
    padding: 10px 0;
    border: 1px solid;
    border-radius: 5px;
  }

  .content .search_result .btn_area {
    position: initial;
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
    margin-top: 0;
  }

  .content .search_result .btn_area a {
    flex: 1;
    padding: 4px;
    height: auto;
    min-height: 30px;
    line-height: 30px;
    box-sizing: border-box;
    font-size: 16px;
    text-align: center;
  }

  .content .search_result .btn_area a.basket_btn {
    flex-basis: 100%;
    margin-bottom: 8px;
  }

  .content .search_result .btn_area a:not(.basket_btn) {
    display: flex;
    line-height: 1;
    padding: 8px 4px;
    flex-flow: column nowrap;
    justify-content: center;
    align-items: center;
  }

  .content .search_result .btn_area a:last-child {
    margin-left: 3px;
  }

  .content .search_result+.btn_area {
    display: flex;
    flex-flow: column nowrap;
  }

  .content .search_result+.btn_area span {
    display: flex;
    flex-flow: column nowrap;
    gap: 4px;
  }

  .content .search_result+.btn_area span:first-child {
    margin-bottom: 16px;
    padding-bottom: 16px;
    border-bottom: 1px dotted #dbdbdb;
  }

  .content .view_list .btn_area {
    margin-left: 0;
  }

  .search_result_wrap h4 {
    font-size: 19px;
  }

  .search_result_wrap h4 span {
    font-size: 15px;
  }

  /*--- 자료검색 ---*/
  .section .search_condition {
    padding: 20px 16px;
    position: relative;
  }

  .section .search_condition input {
    margin: 0;
  }

  body.a20 .serach_range_1 {
    padding-bottom: 0;
  }

  .serach_range_1 span strong {
    display: block;
    width: 100%;
    margin-bottom: 8px;
  }

  .serach_range_1 .float_l,
  .serach_range_1 .float_r {
    float: none;
    display: flex;
    flex-flow: row wrap;
  }

  .serach_range_1 .float_l {
    justify-content: space-between;
    margin-bottom: 00px;
  }

  .serach_range_1 .float_l .select_lib {
    display: inline-block;
    width: 50%;
    margin-bottom: 10px;
  }

  .serach_range_1 .float_l .select_lib:last-of-type {
    margin-bottom: 0;
  }

  .serach_range_1 .float_l .select_lib input {
    margin-right: 10px;
  }

  .serach_range_1 .float_l strong {
    display: none;
  }

  .serach_range_1 .float_r {
    margin-bottom: 0
  }

  body.a20 .serach_range_1 .float_r {
    gap: 8px;
    align-items: center;
    position: absolute;
    right: 20px;
    bottom: 84px;
  }

  body.a20 .serach_range_1 .float_r strong {
    display: inline-block;
    width: auto;
    margin-bottom: 0;
  }

  .serach_range_2 .float_l,
  .serach_range_2 .float_r {
    float: none;
    display: block;
    margin-top: 3px;
  }

  .search-wrap .serach_range_2 .float_r {
    text-align: right;
  }

  .serach_range_2 .float_r.multi_lang {
    text-align: right;
    margin-top: 3px;
  }

  .serach_range_2 .float_l>* {
    margin: 0;
  }

  body.a20 .serach_range_1+.serach_range_2 {
    border: 0 none;
  }

  .search_condition .serach_range_2 .float_l {
    width: 100%;
    margin-bottom: 2px;
  }

  .search_condition .serach_range_2 input[type=text] {
    width: 100%;
    height: 38px;
    box-sizing: border-box;
  }

  .search-wrap .search_condition .detail_search_box {
    display: flex;
    flex-flow: column nowrap;
    gap: 17px;
    padding-bottom: 20px;
    margin-top: 0px;
  }

  .search-wrap .search_condition dl {
    margin: 0;
    display: flex;
    flex: 1;
    width: 100%;
  }

  .search-wrap .search_condition dl dt {
    width: 100%;
    font-size: 17px;
  }

  .search-wrap .search_condition dl dd {
    margin-left: 0;
    width: calc(100% - 80px);
  }

  .search-wrap .search_condition .detail_search_box dl {
    flex-flow: column nowrap;
    gap: 6px;
    padding-bottom: 0;
  }

  .search-wrap .search_condition .detail_search_box dl dt {
    height: auto;
    line-height: 1;
    color: #565656;
  }

  .search-wrap .search_condition .detail_search_box dl dd {
    width: 100%;
    gap: 13px;
  }

  .search-wrap .search_condition .detail_search_box dl dd input {
    margin-right: 3px;
  }

  .search-wrap .search_condition dl dd input.text-area {
    width: 100%;
  }

  .search-wrap .search_condition dl dd .box {
    display: flex;
    align-items: center;
  }

  .search-wrap .search_condition dl dd .box>* {
    flex: 1 1 auto;
  }

  .search-wrap .search_condition dl dd select {
    margin: 0;
    width: 100%;
  }

  .search-wrap .search_condition .serach_range_2 select {
    width: 90px;
    box-sizing: border-box;
  }

  .serach_range_2 .float_r button {
    width: 100%;
  }

  .search_condition .search_btn_area {
    text-align: center;
  }

  body.a20 .search_btn_area {
    border: 0 none;
    text-align: center
  }

  body.a20 .search_btn_area label {
    display: block;
    width: 100%;
    text-align: left;
    margin-bottom: 20px;
  }

  body.a20 .content .h4 {
    font-size: 18px;
  }

  /* --- 베스트 대출자료 ---*/
  body.a30 .condition_div strong {
    display: none;
  }

  body.a30 .condition_div:nth-of-type(2) {
    margin-bottom: 20px;
  }

  body.a30 .condition_div:nth-of-type(2) strong {
    display: inline-block;
    color: #252525;
    font-weight: 600;
    margin-right: 10px;
  }

  body.a30 .condition_div .select_period {
    width: auto;
    flex: 1;
  }

  body.a30 .condition_div .select_period button.on {
    padding-left: 16px;
  }

  /* --- 희망도서신청 ---*/
  .section .want_book_header {
    padding: 180px 24px 16px;
    background-position: center top 34px;
    font-size: 16px;
  }

  .want_book_header p:not(:first-child) {
    display: inline-block;
  }

  .section .want_book_00 {
    padding: 6px 24px;
  }

  .want_book_header .btn.pri {
    display: block;
    width: 100%;
    height: 40px;
    position: initial;
    margin-top: 30px;
  }

  .h4_deco_text {
    line-height: 1.2em;
  }

  /*
	.section .want_book_00 article {padding: 150px 0px 0px;}
	.section .want_book_00 article:before {left: 50%; transform: translateX(-50%); top: 30px;}
	.section .want_book_00 h4 {text-align: center;}
	.section .want_book_00 li {line-height: 1.3em; font-size: 16px;}
	*/
  .section .want_book_00 article {
    padding: 24px 0 24px 100px;
  }

  .section .want_book_00 article:before {
    width: 70px;
    height: 70px;
    background-size: 60%;
  }

  .section .want_book_00 h4 {
    font-size: 18px;
  }

  .section .want_book_00 li {
    line-height: 1.3em;
    font-size: 16px;
  }

  .section dl.dl_table {
    display: flex;
    flex-flow: column nowrap;
  }

  .section dl.dl_table dt,
  .section dl.dl_table dd {
    height: auto;
    padding: 12px 16px;
    text-align: left;
    box-sizing: border-box;
  }

  .section dl.dl_table dt {
    display: flex;
    /*flex-flow: column; justify-content: center;*/
    font-size: 16px;
    width: 100%;
    font-size: 16px;
  }

  .section dl.dl_table dd {
    width: 100%;
    line-height: 1.3em;
    padding: 16px;
    border-top: 0 none;
  }

  .section .want_book_30 ul {
    margin-bottom: 0;
  }

  .section .want_book_30 li {
    padding: 16px 16px 16px 34px;
  }


  /* --- 사서 추천 도서 ---*/
  .top_wrap {
    margin-bottom: 10px;
  }

  .top_wrap .date {
    margin-bottom: 10px;
    width: 236px;
  }

  .top_wrap .date h4 {
    background-position: right center;
    font-size: 22px;
  }

  .top_wrap .total {
    position: initial;
  }

  .lib_wrap {
    margin-bottom: 20px;
  }

  .lib_list {
    gap: 10px 0;
    margin-bottom: 0px;
  }

  .section .lib_list>article {
    width: 100%;
    padding: 16px;
  }

  .lib_list>article a>span {
    width: 100px;
    height: 140px;
    box-shadow: 0px 0px 6px 0px rgba(0, 0, 0, 0.4);
    font-size: 0;
    border: 0 none;
    border-radius: 3px;
  }

  .lib_list>article .top {
    padding-left: 120px;
  }

  .lib_list>article h5 {
    margin-bottom: 10px;
  }

  .lib_list>article dl span {
    margin: 8px 0;
  }

  .lib_list>article dl dd {
    word-break: break-all;
    overflow: hidden;
    display: -webkit-inline-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  /* --- 나의 추천 도서 --- */

  .section .search_condition>select {
    width: 90px;
    margin: 0;
    box-sizing: border-box;
  }

  .section .search_condition>input {
    width: calc(100% - 94px);
    margin: 0;
    box-sizing: border-box;
  }

  .section .search_condition>button.btn.pri.btn_search {
    display: block;
    width: 100%;
    margin-top: 5px;
  }

  .infodesk+.table_wrap {
    border-top: 0 none;
    margin-top: 30px;
  }

  #board .btn-group.inline select.selectmenu,
  #board .btn-group.inline a.btn1 {
    margin: 2px 0;
  }

  #board .btn-group.inline a.btn1 {
    width: 100%;
    height: 36px;
    line-height: 1.8em;
    padding-top: 4px;
  }

  .table_wrap {
    border: 0 none;
    margin-top: 8px;
    margin-bottom: 0;
    border-radius: 0;
    overflow: visible;
  }

  table.table {
    border-top: 0 none;
  }

  .table thead {
    position: fixed;
    left: -9999px;
    top: -9999px;
  }

  .table tbody tr {
    border-bottom: 1px solid #dbdbdb;
  }

  .table tbody td {
    border: 0 none;
    padding: 6px 0 12px 0
  }

  .table.rcd_table td {
    font-size: 14px !important;
    color: #757575;
    padding: 6px 8px 8px 0px;
  }

  .table.rcd_table td.td1 {
    display: none;
  }

  .table.rcd_table tr {
    position: relative;
    display: flex;
    flex-flow: row wrap;
  }

  .table.rcd_table td.title {
    width: 100%;
    padding-bottom: 4px;
  }

  .table.rcd_table td.title a {
    font-size: 16.5px;
    color: #252525;
    font-weight: 700;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  .table.rcd_table td.mmm1 {
    display: inline-block !important;
  }

  /* --- 북스타트 신청 ---*/
  body.b20 .header_nav {
    position: absolute;
    left: 0;
    top: 20px;
    width: 100%;
  }

  body.b20 .header_nav a {
    border-radius: 0;
    font-size: 17px;
  }

  body.b20 .header_nav a.active {
    border-left: 0 none;
  }

  body.b20 .header_nav a.active+a {
    border-bottom: 1px solid #01AB9D;
  }

  body.b20 .header_nav a+a.active {
    border-right: 0 none;
  }

  body.b20 .header_nav+.section_header {
    margin-top: 90px;
  }

  .apc_wrap .down_wrap {
    padding: 24px;
  }

  .apc_wrap .down_wrap p {
    font-size: 16px;
    word-break: break-all;
  }

  .apc_wrap .down_wrap .down_btn {
    position: initial;
    display: block;
    box-sizing: border-box;
    text-align: center;
    transform: none;
    margin-top: 12px;
    width: 100%;
    padding: 15px;
  }

  .apc_wrap article span.content {
    width: 100%;
    height: 500px;
    background: no-repeat center top;
    background-size: contain;
  }

  .apc_wrap article p.info {
    line-height: 1.3em;
  }


  /* --- 전자책 --- */
  .ebook_titleWrap {
    border: 1px solid red;
  }




  /* --- 자유게시판 --- */
  .answer_icon {
    display: inline-block;
  }

  .lock_icon {
    transform: none;
    margin-left: 6px;
  }

  body.d20 .table td.title {
    display: flex;
    align-items: center;
  }

  /* --- 자원봉사 신청안내 ---*/
  .d40_guide_wrap p {
    line-height: 1.3em;
  }

  .d40_guide_wrap01 p:last-child {
    margin-left: 0;
  }


  /* --- 문화강좌 --- */

  .class_btn {
    margin-bottom: 30px;
  }

  .class_mid {
    display: block;
  }

  .class_mid .time_area {
    margin-bottom: 5px;
    text-align: center;
  }

  .class_mid .c_search_area {
    padding: 20px 16px;
    margin-bottom: 30px;
    border: 1px solid #ddd;
    background: #f9f9f9;
    border-radius: 6px;
  }

  .class_mid .c_search_area input {
    width: calc(100% - 50px);
    display: inline-block;
  }

  .class_mid .c_search_area button {
    width: 38px;
    box-sizing: border-box;
    display: inline-block;
  }

  table.culture_table colgroup {
    display: none;
  }

  table.culture_table {
    margin-top: 15px;
  }

  table.culture_table tr {
    display: block;
    position: relative;
    margin-bottom: 36px;
    border-bottom: 0 none;
  }

  table.class_tablee tbody tr:last-child {
    border-bottom: 1px solid #dbdbdb;
  }

  table.culture_table td {
    width: 100%;
    display: block;
    padding: 0;
    position: relative;
    box-sizing: border-box;
    display: flex;
    align-items: center;
    border-bottom: 1px solid #dbdbdb;
  }

  table.culture_table td.list_cate_group,
  table.culture_table td.title {
    border-bottom: 0 none;
  }

  table.culture_table td.visit {
    border-top: 1px solid #dbdbdb;
  }

  table.culture_table td>span {
    display: inline-block;
  }

  table.culture_table td.title {
    width: 100%;
    display: block;
    padding-bottom: 10px;
    margin-bottom: 6px;
  }

  table.culture_table td.title a {
    display: block;
    font-weight: 600;
    font-size: 20px;
    overflow: visible;
    -webkit-line-clamp: initial;
    padding-bottom: 14px;
    border-bottom: 1px dashed #e1e1e0;
  }

  table.culture_table td.title span {
    display: none;
    font-size: 16px;
  }

  table.culture_table td.visit {
    width: 100%;
    text-align: left !important;
  }

  table.culture_table td.visit>span {
    display: inline-block;
  }

  .book-list table.mobile_table.culture_table td.visit .sub_title {
    display: inline-block;
  }

  .book-list table.mobile_table.culture_table td>span {
    font-size: 15px;
  }

  .book-list table.mobile_table.culture_table td.title a {
    margin-bottom: 0px;
    font-size: 20px;
  }

  .book-list table.mobile_table.culture_table td.list_cate_group {
    text-align: left;
    color: #757575;
    padding: 0 20px 6px;
  }

  .book-list table.mobile_table.culture_table td.td1 {
    border-bottom: 0 none;
    margin-bottom: 0;
    font-size: 16px;
  }

  .book-list table.mobile_table.culture_table td.td2 {
    padding: 0 20px 8px;
    border-top: 0 none;
    min-height: initial;
  }

  /* .book-list table.mobile_table.culture_table tr.reg_end, .book-list table.mobile_table.culture_table tr.reg_end td.td1, .book-list table.mobile_table.culture_table tr.reg_end td.td2 {background: #f6f6f6;} */
  .book-list table.mobile_table.culture_table td.last {
    position: relative;
    right: initial;
    top: initial;
    transform: none;
  }

  .book-list table.mobile_table.culture_table td.td6 a {
    width: 100%;
    height: 34px;
    font-size: 15px;
  }

  .book-list table.mobile_table.culture_table td.td2::before {
    display: none;
    padding-left: 0;
    border-top: 0 none;
  }

  .book-list table.mobile_table.culture_table td.td3::before {
    content: '접수기간';
  }

  .book-list table.mobile_table.culture_table td.td4::before {
    content: '행사기간';
  }

  .book-list table.mobile_table.culture_table td.td5::before {
    content: '접수현황';
  }

  .book-list table.mobile_table.culture_table td.target::before {
    content: '접수대상';
  }

  .book-list table.mobile_table.culture_table td.last::before {
    content: '접수상태';
  }

  table.culture_table td.state>a,
  table.culture_table td.state>span {
    width: 100%;
    height: 34px;
  }


  /* --- 도서관 갤러리 ---*/
  .gallery_container .gallery_box {
    width: 49%;
  }

  .bbs_gallery li .info .meta {
    padding-top: 5px;
    border-top: 0 none;
  }

  /* --- 설문조사 --- */
  body.d50 .h4_deco {
    display: none;
  }

  body.c20 .table_wrap,
  body.d50 .table_wrap {
    border: 0 none;
  }

  body.d50 .table tbody tr {
    width: 100%;
    display: block;
    box-sizing: border-box;
    margin-bottom: 30px;
  }

  body.d50 .table tbody tr:last-child {
    border-bottom: 1px solid #dbdbdb;
  }

  body.d50 table.class_table td {
    width: 100%;
    padding: 16px 12px 12px;
    box-sizing: border-box;
    display: inline-block;
  }

  body.d50 table.class_table td.no {
    display: none;
  }

  body.d50 table.class_table td:last-child {
    border-bottom: 0 none;
  }

  body.d50 table.class_table td.title {
    width: 100%;
    flex: none;
    border-right: 0 none;
    border-bottom: 1px dashed #dbdbdb;
    position: relative;
  }

  body.d50 table.class_table td.title a {
    font-weight: 600;
    font-size: 17px;
    padding-left: 66px;
    overflow: visible;
    -webkit-line-clamp: initial;
  }

  body.d50 table.class_table td.title span {
    display: inline-block;
    width: 60px;
    text-align: center;
    box-sizing: border-box;
    position: absolute;
    left: 0;
    top: 10px
  }

  body.d50 table.class_table td.d_start,
  body.d00 table.class_table td.d_end {
    width: 50%;
    padding-bottom: 0;
    float: left;
    text-align: left;
  }

  body.d50 table.class_table td.d_start::before {
    display: inline-block;
    content: '시작일';
    margin-right: 10px;
    color: #1B0FAE;
    font-weight: 700;
  }

  body.d50 table.class_table td.d_end::before {
    display: inline-block;
    content: '종료일';
    margin-right: 10px;
    color: #DC1313;
    font-weight: 700;
  }

  body.d50 table.class_table td.d_answer {
    margin-left: auto;
  }

  body.d50 table.class_table td.d_answer>* {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }

  body.d50 .d50_tip02 {
    background: #DC1313;
  }

  /* --- 내 서재 --- */
  .section .my_info {
    padding: 20px 24px;
  }

  .section .my_name {
    line-height: 1.3em;
    text-align: center;
  }

  .section .my_name span {
    position: relative;
    left: 50%;
    top: 0;
    transform: translateX(-50%);
    margin-bottom: 30px;
  }

  .section .my_info dl {
    padding-top: 20px;
  }

  .section .my_info dl dt {
    width: 100px;
    margin-bottom: 6px;
  }

  .section .my_info dl dd {
    width: calc(100% - 100px);
    margin-bottom: 6px;
  }

  /* --- 내 서재 수정사항 --- */
  .section .class_btn {
    flex-flow: column nowrap;
    width: 100%;
  }

  .section .class_btn a {
    width: 100%;
    height: 0;
    padding: 0 10px 0 24px;
    border-radius: 0;
    border: 0 none;
    border-color: #dbdbdb;
    flex: none;
    overflow: hidden;
    transition: all 0.12s;
    text-align: left;
  }

  .section .class_btn a.on {
    background: #f5f5f5;
    color: #777;
    font-weight: 500;
  }

  .section .class_btn.on a:first-of-type {
    border-top: 1px solid #dbdbdb
  }

  .section .class_btn.on a.on {
    height: auto;
    padding: 16px 10px 16px 24px;
    border: 1px solid #dbdbdb;
    border-radius: 0;
    border-bottom: 0 none;
  }

  .section .class_btn.on a {
    height: auto;
    overflow: visible;
    padding: 16px 10px 16px 25px;
    border: 1px solid #dbdbdb;
    flex: 1;
    border-radius: 0;
    border-bottom: 0 none;
  }

  .section .class_btn.on a:last-child.on {
    border-bottom: 1px solid #dbdbdb;
    border-radius: 0 0 5px 5px;
  }

  .section .class_btn.on a:not(.on):last-child {
    border-bottom: 1px solid #dbdbdb;
    border-radius: 0 0 5px 5px;
  }

  .section .class_btn .class_on {
    display: block;
    width: 100%;
    padding: 16px 10px 16px 24px;
    color: #252525;
    font-weight: 600;
    text-align: left;
    border: 1px solid #dbdbdb;
    border-radius: 6px;
    background: #fff url("/resources/homepage/yblib/img/b_arrow.svg") no-repeat right 20px center;
  }

  .section .class_btn.on a:first-of-type {
    border-top: 0 none
  }

  .section .class_btn.on .class_on {
    background: #fff url("/resources/homepage/yblib/img/t_arrow.svg") no-repeat right 20px center;
    border-radius: 6px 6px 0 0;
  }

  /* --- 내 서재 대출현황 --- */
  .section .in_search_condition {
    margin: 20px 0;
    text-align: center;
    padding: 16px 24px;
    background: #f9f9f9;
    border: 1px solid #dbdbdb;
    border-radius: 6px;
  }

  .label_border_wrap span.hidden {
    position: fixed;
    left: -99999px;
  }

  body.e11 .section .label_border_wrap select,
  body.e15 .section .label_border_wrap select {
    width: 100%;
  }

  .section .table_paging_no {
    float: none;
    margin-bottom: 20px;
  }

  /* --- 내서재 이전 대출 / 예약(데스크) / 예약(무인기) ---*/
  body.e10 .in_search_condition {
    text-align: left;
  }

  body.e10 .label_border_wrap {
    width: 100%;
    margin: 0 0 5px;
    padding: 0;
    text-align: left;
    box-sizing: border-box;
    background: #fff;
  }

  body.e10 .label_border_wrap:first-child select {
    display: block;
    width: 100%;
  }

  body.e10 .label_border_wrap:nth-of-type(2) {
    display: flex;
    flex-flow: row wrap;
    align-items: center;
  }

  body.e10 .label_border_wrap:nth-of-type(2) span {
    font-size: 0;
    padding: 0;
  }

  body.e10 .label_border_wrap:nth-of-type(2) select {
    width: 100%;
    border-radius: 3px 3px 0 0;
    border-bottom: 1px dotted #dbdbdb;
  }

  body.e10 .label_border_wrap:nth-of-type(2) input[type="text"] {
    flex: 1;
    margin-right: 3px;
  }

  body.e10 .label_border_wrap:nth-of-type(2) input[type="text"]:last-of-type {
    margin-left: 3px;
    margin-right: 0;
  }

  body.e10 .label_border_wrap:last-of-type {
    width: calc(100% - 42px);
    margin-bottom: 0;
  }

  body.e10 .label_border_wrap:last-of-type input {
    width: 100%;
  }

  body.e10 .btn.pri.btn_search {
    width: 38px;
    float: right;
    margin-top: 1px;
  }

  /* --- 도서 정보 --- */
  .section .book_info_detail_1 {
    padding: 0;
    text-align: left;
    border: 0 none;
    margin-bottom: 40px;
  }

  .section .book_info_detail_1 .book_cover_img {
    position: relative;
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    width: 250px;
    height: 370px;
    margin: 0 0 20px;
  }

  .section .book_info_detail_1 h4 {
    color: #252525;
    font-size: 19px;
    line-height: 1.2em;
    text-align: left;
    padding: 15px 0 0;
    margin-bottom: 12px;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
  }

  .section .book_info_detail_1 dl {
    padding-top: 12px;
    border-top: 1px solid #dbdbdb;
    padding-bottom: 12px;
    border-bottom: 1px solid #dbdbdb;
    margin-bottom: 12px;
  }

  .section .book_info_detail_1 dl dt,
  .section .book_info_detail_1 dl dd {
    text-align: left;
    font-size: 16px;
  }

  .section .book_info_detail_1 dl dt {
    color: #252525;
  }

  .book_info_detail_1 dl dd.b_writer {
    color: #333;
    font-weight: 500;
  }

  .section .book_info_detail_1 .btn.btn_marcview {
    width: 100%;
  }

  .section .note.pri {
    text-align: center;
  }

  /* --- 도서 정보 -> 소장정보 --- */
  body.view div.table,
  body.view table.table {
    border-top: 0 none;
  }

  body.view .table td {
    display: block;
    border-bottom: 1px solid #ddd;
  }

  body.view .table td:last-child {
    border-bottom: 0 none;
    display: flex;
    gap: 5px;
  }

  body.view .table td:last-child>* {
    flex: 1;
    min-width: initial;
    padding: 8px 10px;
    height: auto;
  }

  body.view td.booking button.btn+button.btn {
    margin-top: 0;
  }

  body.view .table tr {
    position: relative;
    display: block;
    margin-bottom: 20px;
    border-top: 1px solid #515151;
  }

  body.view .table td.check_td {
    position: absolute;
    left: 6px;
    top: 6px;
    z-index: 1;
    border-bottom: 0 none;
    background: transparent;
    padding: 0;
  }

  body.view td.call_number>div {
    margin-bottom: 3px;
  }

  body.view td.call_number>div:last-child {
    margin-bottom: 0px;
  }

  body.view .call_number div+div {
    padding: 0;
  }

  body.view td .book_status_o,
  body.view td .book_status_x {
    display: inline-block;
  }

  body.view .table td:not(.check_td) {
    text-align: left;
    position: relative;
    padding-left: 106px;
  }

  body.view .table td:not(.check_td).booking {
    padding: 8px 10px;
  }

  body.view .table td:not(.check_td)::before {
    width: 90px;
    height: 100%;
    display: flex;
    align-items: center;
    color: #757575;
    position: absolute;
    left: 0px;
    top: 0;
    padding: 8px 0 8px 10px;
    box-sizing: border-box;
    background: #f9f9f9;
    border-right: 1px solid #ddd;
  }

  body.view .table td.hav_div::before {
    content: '구분';
    text-indent: 25px;
  }

  body.view .table td.a_volume::before {
    content: '낱권정보';
  }

  body.view .table td.call_number::before {
    content: '자료실/청구기호';
  }

  body.view .table td.book_status::before {
    content: '자료상태';
  }

  body.view .table td.date_yymmdd::before {
    content: '반납예정일';
  }

  /* --- 인사말 --- */
  .intro_wrap .s_title {
    font-size: 18px;
    line-height: 1.2em;
  }

  .intro_wrap h4 {
    font-size: 24px;
    line-height: 1.4em;
    margin-bottom: 26px;
  }

  .intro_wrap h4 .deco {
    font-size: 32px;
  }

  .intro_wrap h4 .block {
    display: inline-block;
  }

  .intro_wrap .t1 {
    line-height: 1.2em;
  }

  .intro_wrap p {
    line-height: 1.4em;
  }

  /* --- 조직 및 업무 ---*/
  .group_wrap {
    margin-bottom: 30px;
  }

  .group_wrap ul {
    gap: 0
  }

  .group_wrap ul>li {
    flex: 1;
    margin-right: 2%;
    padding: 10px 10px;
    box-sizing: border-box;
    font-size: 15px;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
  }

  .group_wrap ul>li:last-child {
    margin-right: 0;
  }

  .group_wrap ul>li span {
    word-break: break-all;
  }

  .group_wrap ul::after {
    width: 78.5%;
  }

  body.f30 .table_wrap {
    border-radius: 0;
  }

  body.f30 table {
    border-radius: 0;
  }

  body.f30 .table tbody tr {
    display: flex;
    flex-flow: column nowrap;
    border: 0 none;
  }

  body.f30 .table tbody tr:last-child {
    border-bottom: 0;
  }

  body.f30 .table tbody tr td {
    border: 1px solid #e1e1e1;
    border-top: 0 none;
    border-bottom: 1px solid #dbdbdb;
  }

  body.f30 .table tbody tr td.w_place {
    margin-top: 30px;
    border: 1px solid #01AB9D;
    margin-bottom: 10px;
    background: #01AB9D;
    color: #fff;
    font-size: 18px;
    border-radius: 5px;
  }

  body.f30 .table tbody tr td.name {
    border-top: 1px solid #dbdbdb;
    background: #f5f5f5;
    color: #757575;
    font-weight: 600;
  }

  body.f30 .table tbody tr td.number {
    margin-bottom: 8px;
  }

  body.f30 .table tbody tr td.number::before {
    display: inline-block;
    content: 'T.';
    margin-right: 5px;
  }

  body.lib_YB .group_wrap ul>li,
  body.lib_SS .group_wrap ul>li,
  body.lib_NA .group_wrap ul>li,
  body.lib_NE .group_wrap ul>li {
    border-radius: 10px;
  }

  /* --- 도서관 현황 --- */
  body.f40 .table_wrap {
    border: 1px solid #dbdbdb;
  }

  body.f40 .table tbody tr {
    border: 0 none;
  }

  body.f40 .table thead {
    display: table-header-group;
  }

  body.f40 .table tr> :first-child {
    border-left: 0 none;
  }

  body.f40 .table tbody th,
  body.f40 .table tbody td {
    border: 1px solid #dbdbdb;
  }

  body.f40 .table tr> :last-child {
    border-right: 0 none;
  }

  /* --- 도서관 시설 안내 ---*/
  .fac_list figure {
    width: 100%;
  }

  body.lib_YB .fac_list figure,
  body.lib_NE .fac_list figure,
  body.lib_NA .fac_list figure,
  body.lib_SS .fac_list figure {
    width: 100%;
  }


  /* --- 사이트 맵 --- */
  .i50 .sitemap_wrap>ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
  }

  .i50 .sitemap_wrap>ul>li {
    width: 48%;
    margin: 0;
    margin-bottom: 10px;
  }

  .i50 .sitemap_wrap>ul>li:last-child {
    width: 100%;
  }

  .field.place_group {
    display: block;
    width: 100%;
  }

  .condition_div strong {
    display: none;
  }

  .condition_div .radio_box {
    display: flex;
    align-items: center;
    gap: 5px;
    margin-right: 20px;
    margin-top: 10px;
  }


  /* --------------------------------------------------------------*/


  .ym_btns select {
    border: 0 none;
    font-size: 20px;
    font-weight: 600;
  }

  .ym_btns a.btn i {
    font-size: 30px;
  }

  .ym_btns a.btn.prev {
    float: left;
  }

  .ym_btns a.btn.next {
    float: right;
  }

  .ym_btns #monthSelect {
    font-size: 16px;
  }


  .login-box {
    width: 100%;
    padding: 0 0 30px;
    margin: 20px auto 0px;
  }

  .login-body .tab dd {
    margin: 0 !important;
  }

  .login-box>strong {
    font-size: 24px;
    line-height: 1.4em;
    margin-bottom: 0;
  }

  .login-box>strong>span {
    font-size: 28px;
    display: block;
  }

  .login-box>strong>span::before {
    display: block;
    width: 80px;
    height: 80px;
    margin: 0 auto 10px;
  }

  .login_btns .idpw_find a {
    font-size: 15px;
    padding-right: 10px;
  }

  .login_btns .idpw_find a+a {
    margin-left: 10px;
  }

  .sns_login {
    margin: 50px 0 0;
  }

  .sns_login a {
    font-size: 16px;
    height: 46px;
    line-height: 46px;
  }

  .sns_login a.naver_login,
  .sns_login a.kakao_login {
    background-size: 16px auto;
  }

  .sns_login>strong::before,
  .sns_login>strong::after {
    width: 28%;
  }

  .login-body .login .form-box input.txt,
  .login-body .login button {
    height: 42px;
  }

  .login-body .login button {
    font-size: 17px;
    font-weight: 500;
  }

  .login-body .login button span {
    line-height: 1;
  }

  /* sns로그인 연동 */
  .sns_login_info {
    margin: 20px 0 6px;
    padding: 10px 0;
  }

  .sns_login_info p {
    font-size: 16px;
  }

  /*.sns_login_info p + p {margin-top: 5px;}*/
  .login_btns {
    margin-top: 15px;
  }

  /* --- 모바일 게시판 ---*/
  table.notice_table {
    width: calc(100% + 40px);
    margin: 0 -20px;
  }

  #board table.notice_table colgroup {
    display: none;
  }

  #board table.notice_table,
  #board table.notice_table tbody,
  #board table.notice_table tbody tr {
    display: block;
  }

  #board table.notice_table tbody td {
    display: inline-block;
    padding: 10px 4px 8px 0;
    font-size: 14px;
  }

  #board table.notice_table tbody tr {
    margin-bottom: 7px;
    display: block;
    padding: 0 20px;
  }

  #board table.notice_table tbody td.td1 {
    display: none;
  }

  #board table.notice_table tbody td.title {
    display: flex;
    padding-bottom: 0;
  }

  #board table.notice_table tbody td.username,
  #board table.notice_table tbody td.state {
    display: inline-block !important;
    color: #757575;
  }

  #board table.notice_table tbody td.title a {
    display: block;
    font-size: 15.5px;
    font-weight: 500;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }

  #board table.notice_table tbody td.mmm1.file {
    display: inline-block !important;
  }

  #board table.notice_table tbody td.adddate {
    color: #757575;
  }

  .notice_table span.new::before {
    margin-left: 5px;
    content: 'N';
    font-size: 11px;
  }

  /* --- 회원가입 --- */
  .join-wrap {
    padding: 0;
  }

  .join-wrap table {
    margin: 0 -20px;
    width: calc(100% + 40px);
  }

  .body .join-wrap h2.title {
    padding: 4px 0;
    margin-bottom: 7px;
    font-size: 18px;
  }

  .join-wrap .agree_codes+h2 {
    margin-top: 40px;
  }

  .join-wrap .Box {
    padding: 15px;
  }

  .join-wrap .Box p {
    font-size: 15px;
  }

  .join-wrap .agree_codes>div {
    padding-left: 80px;
  }

  .join-wrap .agree_codes label {
    font-size: 15px;
  }

  .join-wrap .agree_codes label,
  .join-wrap .agree_codes input {
    margin-right: 0;
  }

  .join_step {
    display: none;
  }

  .join-wrap .info {
    padding: 15px 0;
    display: none;
  }

  .join-wrap .yearSelect a::before {
    width: 100px;
    height: 100px;
  }

  .join-wrap .yearSelect a {
    padding: 40px 0;
  }

  .join-wrap .yearSelect a span.joinText1 {
    font-size: 20px;
    font-weight: 500;
  }

  .join-wrap .yearSelect a span.joinText2 {
    font-size: 16px;
    font-weight: 500;
  }

  .join-wrap table .btn {
    height: 36px;
  }

  .join-wrap .identi_select p a {
    padding: 40px 10px;
    min-height: 300px;
    box-sizing: border-box;
  }

  .join-wrap .identi_select p.identy_a a {
    border-right: 0 none;
  }

  .join-wrap .identi_select a::before {
    width: 100px;
    height: 100px;
    background-size: 85%;
  }

  .join-wrap .identi_select p.identy_b a::before {
    background-size: 85%;
  }

  .join-wrap .identi_select .identy_b,
  .join-wrap .year_select a.year_b {
    margin-top: 0;
  }

  .join-wrap .identi_select p a span {
    font-size: 18px;
    font-weight: 500;
  }

  .join-wrap .identi_select p a span::after {
    font-size: 15px;
    font-weight: 500;
    line-height: 1.2em;
  }

  #memberForm tbody tr {
    display: flex;
    flex-flow: column nowrap;
  }

  #memberForm tbody tr th,
  #memberForm tbody tr td {
    width: 100%;
    box-sizing: border-box;
    border-top: 0 none;
    padding: 15px;
  }

  #memberForm tbody tr:first-child th {
    border-top: 1px solid #e5e8eb;
  }

  #memberForm tbody tr th {
    border-left: 1px solid #e5e8eb;
    font-size: 16px;
    font-weight: 600;
    text-align: left;
    background: #f5f5f5;
  }

  #memberForm tbody tr td {
    border-right: 1px solid #e5e8eb;
    font-size: 16px;
  }

  #memberForm tbody tr td .id_input_wrap {
    display: flex;
  }

  #memberForm tbody tr td .phone_num {
    font-size: 16px;
  }

  #memberForm tbody tr td .sns_agree {
    display: block;
    margin: 8px 0;
  }

  .join-wrap .ex_text {
    margin-top: 5px;
  }

  #memberForm tbody tr td .email_input_wrap {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 0 3px;
  }

  #memberForm tbody tr td .email_input_wrap input {
    margin-left: 0;
    margin-right: 0;
  }

  #memberForm tbody tr td .email_select {
    width: 100%;
    margin-bottom: 12px;
    margin-left: 0;
    margin-right: 0;
  }

  #memberForm tbody tr td input[type="text"],
  #memberForm tbody tr td input[type="password"] {
    width: 100%;
  }

  #memberForm tbody tr td input[type="text"]#member_id {
    width: 74%;
  }

  .phone_input_wrap {
    width: auto;
  }

  .phone_input_wrap input {
    margin-left: 0;
    margin-right: 0;
  }

  #memberForm caption {
    font-size: 15px;
    color: #757575;
    position: initial;
    width: 100%;
    padding: 20px 10px 10px;
    box-sizing: border-box;
    word-break: break-all;
  }

  #memberForm caption strong {
    color: #252525;
  }

  /* --- 회원정보 수정 --- */
  .pw_check_wrap span {
    margin-bottom: 10px;
    margin-right: 0;
  }

  #new_password_area1 label span,
  #new_password_area2 label span,
  #new_card_password_area1 label span {
    margin: 10px 0 3px;
  }

  /* --- 내서재 --- */
  .book-list {
    border: 0 none;
    border-radius: 0;
    overflow: visible;
    /* padding-top: 30px; padding-bottom: 30px; border-top: 1px solid #ccc;  border-bottom: 1px solid #ccc;*/
    margin-bottom: 0px;
  }

  .book-list table th,
  .book-list table td {
    border-right: 0 none;
    border-top: 0 none;
  }

  .book-list table thead {
    position: fixed;
    left: -99999px;
    top: -99999px;
  }

  .book-list table tr,
  .book-list table td {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }

  .book-list table tr {
    margin-bottom: 20px;
    border-radius: 0px;
    overflow: hidden;
    border-top: 1px solid #e1e1e0;
    border-bottom: 1px solid #e1e1e0;
    background: #fff;
    padding: 26px 20px;
  }

  .book-list table tr:last-child {
    margin-bottom: 0;
  }

  .book-list table tbody tr:last-child td {
    border-bottom: 1px solid #dbdbdb;
  }

  /* --- 내서재 (대출중도서) --- */
  .op_wrap {
    overflow: visible;
  }

  .book-list table.mobile_table tr {
    padding: 26px 0;
  }

  .mobile_table {
    margin: 0 -20px;
    width: calc(100% + 40px);
    background: #f5f5f5;
  }

  .book-list table.mobile_table td {
    text-align: left;
    padding: 0 16px;
  }

  .book-list table.mobile_table td.first {
    font-size: 18px;
    font-weight: 600;
    color: #252525;
    border-bottom: 0 none;
    background: #fff;
    line-height: 1.2em;
    padding: 0 20px;
    margin-bottom: 10px;
    display: -webkit-box;
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  table.loan_table td .loan_title {
    line-height: 1.2em;
    font-size: 18px;
  }

  .book-list table.mobile_table td:not(.first) {
    color: #252525;
    position: relative;
    padding: 5px 20px 5px 90px;
    border: 0 none;
    box-sizing: border-box;
    border-bottom: 0 none;
    font-size: 15px;
  }

  .book-list table.mobile_table td:not(.first)::before {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    width: 70px;
    height: 100%;
    font-weight: 600;
    font-size: 15px;
    background-color: transparent;
    position: absolute;
    left: 20px;
    top: 0;
    padding: 0;
    box-sizing: border-box;
    color: #777;
  }

  .book-list table.mobile_table td.td2::before {
    content: "도서관명";
  }

  .book-list table.mobile_table td.td3::before {
    content: "청구기호";
  }

  .book-list table.mobile_table td.td4::before {
    content: "대출일";
  }

  .book-list table.mobile_table td.td5::before {
    content: "반납일";
  }

  .book-list table.mobile_table td.td6::before {
    content: "반납연기";
  }

  .book-list table.mobile_table td.td6>a {
    width: 100%;
  }

  /* --- 내서재 (대출이력) --- */
  .search_condition.center label {
    font-size: 0;
  }

  .condition_wrap {
    display: flex;
    flex-flow: row nowrap;
    align-items: center;
    margin-bottom: 10px;
  }

  .condition_wrap .wave {
    margin: 0 3px;
  }

  .condition_wrap input {
    flex: 1 1 auto;
  }

  .search_condition>.btn {
    width: 100%;
    padding-left: 10px;
  }

  .book-list table.loan_history_table td {
    text-align: left;
  }

  .book-list table.loan_history_table td.first {
    font-size: 18px;
    font-weight: 600;
    border-bottom: 1px solid #dbdbdb;
    background: #f2f2f2;
    line-height: 1.3em;
  }

  .book-list table.loan_history_table td:not(.first) {
    padding: 10px 15px;
    color: #757575;
  }

  .book-list table.loan_history_table td.td2::before {
    display: inline-block;
    width: 80px;
    font-weight: 600;
    color: #252525;
    content: "도서관명";
    font-size: 16px;
  }

  .book-list table.loan_history_table td.td3::before {
    display: inline-block;
    width: 80px;
    font-weight: 600;
    color: #252525;
    content: "청구기호";
    font-size: 16px;
  }

  .book-list table.loan_history_table td.td4::before {
    display: inline-block;
    width: 80px;
    font-weight: 600;
    color: #252525;
    content: "대출일";
    font-size: 16px;
  }

  .book-list table.loan_history_table td.td5::before {
    display: inline-block;
    width: 80px;
    font-weight: 600;
    color: #252525;
    content: "반납일";
    font-size: 16px;
  }

  /* --- 내서재 (수강신청현황) --- */
  .content .search_condition.center {
    text-align: left !important;
  }

  .content .search_condition .class_condition {
    margin: 4px 0 6px;
    gap: 15px;
  }

  .content .search_condition .class_condition span.sort {
    padding-right: 0;
    border-right: 0 none;
    margin-right: 0;
  }

  .content .search_condition .class_condition span input {
    width: 18px;
    flex: none;
  }

  .content .search_condition .class_condition span input+label {
    margin-left: 5px;
  }

  /* --- 내서재 (나의관심도서) --- */
  .sort_wrap {
    display: flex;
    margin-top: 15px;
    padding-top: 15px;
    margin-left: 0;
    padding-left: 0;
    border-left: 0 none;
    border-top: 1px dashed #dbdbdb;
  }

  .sort_wrap select {
    flex: 1px;
  }

  .book-list table.basket_table td.first {
    position: fixed;
    left: 9999px;
    top: -9999px;
  }

  .book-list table.basket_table td.td2 {
    padding: 0 20px 10px;
    min-height: initial;
    border-top: 0 none;
  }

  .book-list table.basket_table td.td2 a {
    font-size: 18px;
    font-weight: 600;
    line-height: 1.2em;
  }

  .book-list table.basket_table td:not(.td2) {
    padding: 8px 20px 8px 106px;
  }

  .book-list table.basket_table td.td2::before {
    display: none;
  }

  .book-list table.basket_table td.td3::before {
    content: "청구기호";
  }

  .book-list table.basket_table td.td4::before {
    content: "ISBN";
  }

  .book-list table.basket_table td.td5::before {
    content: "소장도서관";
  }

  .book-list table.basket_table td.td6::before {
    content: "등록일";
  }

  .book-list table.basket_table td.td7::before {
    content: "삭제";
  }

  .book-list table.basket_table td.td7>a {
    width: 100%;
  }

  .search select.selectmenu {
    width: 60px;
    margin-right: 0;
    margin-left: 0;
    padding: 6px 0 6px 2px;
    vertical-align: middle;
  }

  .wrapper-bbs .search input {
    width: 55%;
    margin-left: 0;
    margin-right: 0;
  }

  .search a.btn {
    height: 35px;
    line-height: 35px;
    min-width: initial;
    padding: 0 10px;
  }

  /* --- 내서재 (희망도서신청현황) --- */
  .hope_list {
    /*padding-top: 30px; border-top: 1px solid #ccc;*/
    flex-flow: column nowrap;
    width: calc(100% + 40px);
    margin: 0 -20px;
    background: #f5f5f5;
  }

  .hope_item {
    padding: 26px 20px;
    width: 100%;
    margin-bottom: 20px;
    background: #fff;
    border-left: 0 none;
    border-right: 0 none;
    border-radius: 0;
    /*box-shadow: 0 4px 4px 0 rgba(150,150,150,0.1);*/
  }

  .hope_item:last-child {
    margin-bottom: 0;
    /*box-shadow: none;*/
  }

  .hope_item .bif {
    margin-bottom: 10px;
    flex-flow: column nowrap;
    align-items: flex-start;
    gap: 8px;
  }

  .hope_item h4 {
    font-size: 18px;
  }

  .hope_item table th,
  .hope_item table td {
    padding: 8px 0;
    font-size: 15px;
  }

  .hope_item table th {
    text-align: left;
    font-weight: 600;
    color: #777;
    padding-left: 0;
  }

  .hope_item table td {
    color: #252525;
    padding-left: 20px;
  }

  .hope_item .info span {
    font-size: 15px;
    font-weight: 400;
  }

  .book-list+.btn_wrap_right {
    margin-top: 15px;
  }

  /* --- 인사말 --- */
  #wrap div#container.subpage {
    background-size: contain;
    padding-bottom: 30px;
  }

  .body .intro_wrap {
    margin: 30px 0 0;
  }

  .history_wrap .title_box {
    gap: 10px;
    background-position: left center;
    height: 180px;
    border-radius: 0;
    width: calc(100% + 42px);
    margin: 0 -21px 30px;
  }

  .history_wrap .title_box::after {
    height: 100%;
  }

  .history_wrap .title_box strong {
    font-size: 24px;
  }

  .history_wrap .title_box h4 {
    font-size: 34px;
    padding: 0;
  }

  /* --- 조직 및 업무 --- */
  .group_wrap ol li ul::after {
    width: 78.3%;
  }

  .group_wrap ul>li span.box {
    height: auto;
  }

  .group_table tbody tr {
    display: block;
    margin-bottom: 10px;
    border-bottom: 0 none;
  }

  .group_table tbody tr td {
    display: block;
    text-align: center;
    padding: 12px;
    border: 1px solid #dbdbdb;
    border-top: 0 none;
  }

  .group_table tbody tr td.name {
    background: #f5f5f5;
    color: #757575;
    font-weight: 600;
    border-top: 1px solid #dbdbdb;
    border-radius: 5px 5px 0 0;
  }

  table.group_table tr> :first-child {
    border-left: 1px solid #dbdbdb;
    border-right: 1px solid #dbdbdb;
  }

  table.group_table td:last-child {
    border-right: 1px solid #dbdbdb;
  }

  .table_wrap table.group_table tr:last-child td {
    border-bottom: 1px solid #dbdbdb;
  }

  .group_table tbody tr td.work {
    text-align: left;
  }

  .group_table tbody tr td.number {
    border-right: 1px solid #dbdbdb;
  }

  .group_table tbody tr td.number::before {
    display: inline-block;
    content: "T. ";
    margin-right: 5px;
  }

  .group_table tbody tr td.w_place {
    padding: 15px 12px;
    border: 1px solid #01ab9d;
    margin-bottom: 10px;
    background: linear-gradient(87.47deg, #01ab64 6.09%, #01ab9d 98.15%);
    color: #fff;
    font-size: 18px;
    border-radius: 5px;
    font-weight: 600;
    margin-top: 40px;
  }

  body.lib_NE .group_table tbody tr td.w_place {
    background: linear-gradient(100.51deg, #ffab40 28.67%, #fb8016 87.37%);
  }

  body.lib_SS .group_table tbody tr td.w_place {
    background: linear-gradient(100.51deg, #54bfff 28.67%, #37a4e9 87.37%);
  }

  body.lib_NA .group_table tbody tr td.w_place {
    background: linear-gradient(100.51deg, #c100cb 28.67%, #9700b1 87.37%);
  }

  body.lib_CH .group_table tbody tr td.w_place {
    background: linear-gradient(100.51deg, #1f58a7 28.67%, #598CD3 87.37%);
  }

  .book-list table.group_table tbody tr td:last-child {
    border-radius: 0 0 5px 5px;
    border-bottom: 1px solid #dbdbdb;
  }

  /* 도서관현황 */
  .auto_table {
    overflow-x: auto;
  }

  .fac_table thead {
    display: table-header-group;
  }

  table.fac_table thead th,
  .fac_table tbody td {
    padding: 12px;
  }

  table.fac_table thead th {
    border-top: 1px solid #dbdbdb;
  }

  .fac_table tbody td {
    border: 1px solid #dbdbdb;
  }

  table.fac_table tr> :first-child {
    border-left: 1px solid #dbdbdb;
  }

  .fac_table tbody tr:first-child td {
    border-top: 0 none;
  }

  table.fac_table tr> :first-child {
    border-right: 1px solid #dbdbdb;
  }

  .fac_table tr> :last-child {
    border-right: 1px solid #dbdbdb;
  }


  /* --- 도서관 시설 안내 ---*/
  .fac_list figure {
    padding: 12px;
  }

  /* --- 게시판 view --- */
  .bbs-view {
    margin: 0 -20px;
  }

  .bbs-view-header .board_title {
    padding: 16px 20px;
    font-size: 17px;
    border-top: 1px solid #dbdbdb;
    border-radius: 0;
  }

  .bbs-view .bbs-view-header .board_info {
    padding: 12px 20px;
    display: flex;
    flex-flow: row wrap;
    gap: 10px 15px;
  }

  .bbs-view .bbs-view-header .board_info .info_box {
    display: block;
    margin-right: 0;
  }

  .bbs-view .bbs-view-header .board_info .info_box:last-child {
    margin-bottom: 0;
  }

  .bbs-view .bbs-view-header .board_info .info_box dt,
  .bbs-view .bbs-view-header .board_info .info_box dd {
    font-size: 15px;
  }

  .bbs-view .bbs-view-body {
    padding: 20px;
  }

  .bbs-view .bbs-view-header .board_info .info_box dt {
    width: 16px;
    border-right: 0;
    font-size: 0;
    padding-right: 0px;
    margin-right: 5px;
  }

  .bbs-view .bbs-view-header .board_info .info_box dt::before {
    display: inline-block;
    content: '';
    width: 15px;
    height: 15px;
    background-size: 15px 15px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath d='M20 22H18V20C18 18.3431 16.6569 17 15 17H9C7.34315 17 6 18.3431 6 20V22H4V20C4 17.2386 6.23858 15 9 15H15C17.7614 15 20 17.2386 20 20V22ZM12 13C8.68629 13 6 10.3137 6 7C6 3.68629 8.68629 1 12 1C15.3137 1 18 3.68629 18 7C18 10.3137 15.3137 13 12 13ZM12 11C14.2091 11 16 9.20914 16 7C16 4.79086 14.2091 3 12 3C9.79086 3 8 4.79086 8 7C8 9.20914 9.79086 11 12 11Z' fill='rgba(117,117,117,1)'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
  }

  .bbs-view .bbs-view-header .board_info .info_box:nth-of-type(2) dt::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath d='M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z' fill='rgba(117,117,117,1)'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
  }

  .bbs-view .bbs-view-header .board_info .info_box:nth-of-type(3) dt::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath d='M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z' fill='rgba(117,117,117,1)'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
  }

  .bbs-view .bbs-view-header .board_info .info_box:nth-of-type(4) dt::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath d='M6.45455 19L2 22.5V4C2 3.44772 2.44772 3 3 3H21C21.5523 3 22 3.44772 22 4V18C22 18.5523 21.5523 19 21 19H6.45455ZM5.76282 17H20V5H4V18.3851L5.76282 17ZM11 10H13V12H11V10ZM7 10H9V12H7V10ZM15 10H17V12H15V10Z' fill='rgba(117,117,117,1)'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
  }

  .bbs-view .bbs-view-header .board_info .info_box:nth-of-type(5) dt::before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath d='M12.0003 3C17.3924 3 21.8784 6.87976 22.8189 12C21.8784 17.1202 17.3924 21 12.0003 21C6.60812 21 2.12215 17.1202 1.18164 12C2.12215 6.87976 6.60812 3 12.0003 3ZM12.0003 19C16.2359 19 19.8603 16.052 20.7777 12C19.8603 7.94803 16.2359 5 12.0003 5C7.7646 5 4.14022 7.94803 3.22278 12C4.14022 16.052 7.7646 19 12.0003 19ZM12.0003 16.5C9.51498 16.5 7.50026 14.4853 7.50026 12C7.50026 9.51472 9.51498 7.5 12.0003 7.5C14.4855 7.5 16.5003 9.51472 16.5003 12C16.5003 14.4853 14.4855 16.5 12.0003 16.5ZM12.0003 14.5C13.381 14.5 14.5003 13.3807 14.5003 12C14.5003 10.6193 13.381 9.5 12.0003 9.5C10.6196 9.5 9.50026 10.6193 9.50026 12C9.50026 13.3807 10.6196 14.5 12.0003 14.5Z' fill='rgba(117,117,117,1)'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
  }

  .bbs-view-file {
    padding: 10px 20px;
  }

  .prev_next_remote {
    margin: 0 -20px;
    width: calc(100% + 40px);
  }

  /* --- 도서관 갤러리 --- */

  .bbs_gallery li {
    width: 100%;
    height: 306px;
    padding: 16px;
  }

  .bbs_gallery li .thumb {
    padding: 0;
    max-height: none;
    height: 185px;
    border: 1px solid #dbdbdb;
    border-radius: 3px;
    margin-bottom: 20px;
  }

  .bbs_gallery li .info a {
    font-size: 17px;
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding-bottom: 12px;
    margin-bottom: 12px;
    border-bottom: 1px solid #f2f2f2;
  }

  .bbs_gallery li .info .meta p {
    font-size: 16px;
    display: inline-block;
    margin-bottom: 0;
  }

  .bbs_gallery li .info .meta p+p {
    margin-left: 15px;
  }

  .bbs_gallery li .info .meta p span {
    display: inline-block;
    font-size: 0;
    margin-right: 6px;
  }

  .bbs_gallery li .info .meta p span::before {
    display: inline-block;
    content: '';
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath d='M20 22H18V20C18 18.3431 16.6569 17 15 17H9C7.34315 17 6 18.3431 6 20V22H4V20C4 17.2386 6.23858 15 9 15H15C17.7614 15 20 17.2386 20 20V22ZM12 13C8.68629 13 6 10.3137 6 7C6 3.68629 8.68629 1 12 1C15.3137 1 18 3.68629 18 7C18 10.3137 15.3137 13 12 13ZM12 11C14.2091 11 16 9.20914 16 7C16 4.79086 14.2091 3 12 3C9.79086 3 8 4.79086 8 7C8 9.20914 9.79086 11 12 11Z' fill='rgba(117,117,117,1)'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
    vertical-align: middle;
  }

  .bbs_gallery li .info .meta p:nth-child(2) span::before {
    display: inline-block;
    content: '';
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath d='M9 1V3H15V1H17V3H21C21.5523 3 22 3.44772 22 4V20C22 20.5523 21.5523 21 21 21H3C2.44772 21 2 20.5523 2 20V4C2 3.44772 2.44772 3 3 3H7V1H9ZM20 11H4V19H20V11ZM8 13V15H6V13H8ZM13 13V15H11V13H13ZM18 13V15H16V13H18ZM7 5H4V9H20V5H17V7H15V5H9V7H7V5Z' fill='rgba(117,117,117,1)'%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: center center;
    vertical-align: middle;
  }

  .bbs_gallery li .info .meta p:nth-child(3) span::before {
    display: inline-block;
    content: '';
    width: 16px;
    height: 16px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath d='M12.0003 3C17.3924 3 21.8784 6.87976 22.8189 12C21.8784 17.1202 17.3924 21 12.0003 21C6.60812 21 2.12215 17.1202 1.18164 12C2.12215 6.87976 6.60812 3 12.0003 3ZM12.0003 19C16.2359 19 19.8603 16.052 20.7777 12C19.8603 7.94803 16.2359 5 12.0003 5C7.7646 5 4.14022 7.94803 3.22278 12C4.14022 16.052 7.7646 19 12.0003 19ZM12.0003 16.5C9.51498 16.5 7.50026 14.4853 7.50026 12C7.50026 9.51472 9.51498 7.5 12.0003 7.5C14.4855 7.5 16.5003 9.51472 16.5003 12C16.5003 14.4853 14.4855 16.5 12.0003 16.5ZM12.0003 14.5C13.381 14.5 14.5003 13.3807 14.5003 12C14.5003 10.6193 13.381 9.5 12.0003 9.5C10.6196 9.5 9.50026 10.6193 9.50026 12C9.50026 13.3807 10.6196 14.5 12.0003 14.5Z' fill='rgba(117,117,117,1)'%3E%3C/path%3E%3C/svg%3E");
    background-position: center center;
    vertical-align: middle;
  }

  .bbs-view .bbs-view-header dd.file {
    margin-bottom: 10px;
  }

  .bbs-view .bbs-view-header dd.file ul li {
    margin: 4px 0;
  }

  .bbs-view .bbs-view-header dd.file ul li a {
    font-size: 15px;
  }

  ul.list {
    margin: 0;
  }

  /* --- 희망도서신청 --- */
  .hope_reg_wrap {
    padding: 0;
    border: 1px solid #dbdbdb;
    margin: 0 -20px;
    width: calc(100% + 40px);
  }

  table.hope_reg_table tbody th,
  table.hope_reg_table tbody td {
    display: block;
    box-sizing: border-box;
    width: 100%;
    border-bottom: 0 none;
    text-align: left;
  }

  table.hope_reg_table tbody th {
    padding: 16px 20px 4px;
  }

  table.hope_reg_table tbody td {
    padding: 0px 20px 16px;
    background: #fafafa;
  }

  table.hope_reg_table tbody td input,
  table.hope_reg_table tbody td select {
    margin: 0;
    width: 100%;
  }


  .search-form.hope_form input.text,
  .search-form.hope_form .b2 button {
    height: 40px;
  }

  .content .hope_item_wrap .search_result dl>span:first-child {
    gap: 0;
  }

  .search-form.hope_form .box {
    padding: 16px;
    gap: 5px;
    margin-bottom: 16px;
  }

  .content .hope_item_wrap .search_result>article h5 {
    padding-left: 115px;
  }

  .hope_item_wrap .search_result>article dl,
  .hope_item_wrap .search_result>article h5 {
    padding-left: 0;
  }

  .hope_item_wrap .search_result>article .btn_area {
    padding: 0;
    position: initial;
    margin-top: 15px;
  }

  .content .hope_item_wrap .search_result .btn_area a:first-child {
    margin-left: 0;
  }

  .hope_item_wrap .search_result>article .btn_area>* {
    height: 30px;
    line-height: 30px;
    padding: 0;
  }

  .hope_item_wrap .search_result>article .btn_area .reg_yes_btn {
    flex-flow: row nowrap;
  }

  .hope_item_wrap .search_result>article .btn_area .hope_no {
    display: flex;
    height: 30px;
    line-height: 1;
    padding: 8px 4px;
    flex-flow: row nowrap;
    justify-content: center;
    align-items: center;
  }

  .hope_item_wrap .search_result>article .btn_area a+span {
    width: 0;
    overflow: hidden;
  }

  /* --- 자주하는질문 --- */
  ul.faq {
    width: calc(100% + 40px);
    margin: 0 -20px;
  }

  .faqArea .faq .q a.trigger {
    padding: 15px 10px 10px;
    box-sizing: border-box;
  }

  .faqArea .faq .q.blue span.icon {
    vertical-align: top;
    width: 24px;
    height: 24px;
  }

  .faqArea .faq .q.blue span.icon::before {
    width: 24px;
    height: 24px;
    font-size: 16px;
  }

  .faqArea .faq .a .tit {
    width: 24px;
    height: 24px;
    top: 20px;
    left: 10px;
  }

  .faqArea .faq .a .tit::before {
    width: 24px;
    height: 24px;
    font-size: 16px;
    box-sizing: border-box;
  }

  .faqArea .faq .q a.trigger .faq_text {
    display: inline-block;
    width: calc(100% - 34px);
    margin-right: 0;
    font-size: 16px;
    line-height: 1.2em;
  }

  .faqArea .faq .a {
    padding: 10px 0;
  }

  .faqArea .faq .a .aContent {
    padding-left: 45px;
    padding-right: 20px;
  }

  .faqArea .faq .a .aContent p span {
    font-size: 15px !important;
  }

  .faqArea .faq .q a.trigger:hover {
    background: #fff;
  }

  /* 오시는 길 */
  .add_wrap {
    padding-top: 20px;
  }

  /* --- 사이트맵 --- */
  .sitemap_wrap .gnb-menu>li:before {
    display: none;
  }

  .sitemap_wrap>ul {
    display: flex;
    flex-flow: row wrap;
    justify-content: space-between;
  }

  .sitemap_wrap>ul>li {
    width: 48%;
    margin-right: 0;
  }

  /* --- 문화강좌 view --- */
  .culture_area {
    flex-flow: column nowrap;
    margin-bottom: 30px;
  }

  .culture_intro {
    margin-left: 0;
    margin-top: 30px;
  }

  .culture_img {
    width: 100%;
    text-align: center;
  }

  .culture_img .cover_img {
    height: 481px;
  }

  .culture_intro h4 {
    margin-bottom: 14px;
    font-size: 24px;
  }

  .culture_intro ul {
    padding: 20px 0;
    border-top: 1px solid #dbdbdb;
    border-bottom: 1px solid #dbdbdb;
    margin-bottom: 30px;
  }

  .culture_intro li {
    margin-bottom: 16px;
  }

  .culture_intro li span.sub_title {
    font-size: 16px;
    width: 120px;
    vertical-align: top;
  }

  .culture_intro li span.con {
    display: inline-block;
    width: calc(100% - 124px);
    font-size: 16px;
  }

  .culture_intro li span {
    font-size: 16px;
  }

  .culture_intro li {
    font-size: 16px;
  }

  .culture_intro li:last-child {
    margin-bottom: 0;
  }

  .culture_intro .culture_view_table caption {
    position: initial;
    font-size: 18px;
    width: auto;
    height: auto;
    text-indent: initial;
    overflow: visible;
    line-height: 1;
    color: #252525;
    margin-bottom: 12px;
    font-weight: 600;
  }

  .culture_intro .culture_view_table caption::before {
    display: inline-block;
    content: "";
    border-radius: 50%;
    width: 10px;
    height: 10px;
    background: #01AB9D;
    margin-right: 8px;
  }

  .culture_intro .culture_view_table td {
    padding: 0;
    border-bottom: 1px solid #dbdbdb;
    display: flex;
    align-items: center;
  }

  .culture_intro .culture_view_table td:last-child {
    border-bottom: 0 none;
  }

  .culture_intro li.file_list span.file_ico {
    margin-right: 4px;
  }

  .culture_intro .culture_view_table td::before {
    display: block;
    padding: 14px 0;
    background: #f2f2f2;
    font-weight: 600;
    font-size: 15px;
    min-width: 165px;
    margin-right: 20px;
  }

  .culture_intro .culture_view_table td.first::before {
    content: "현재 참여/모집";
  }

  .culture_intro .culture_view_table td.online::before {
    content: "현재 오프라인/오프라인";
  }

  .culture_intro .culture_view_table td.wait_num::before {
    content: "현재 대기자/대기자";
  }

  .culture_intro table.culture_view_table tr {
    margin-bottom: 0;
    border: 1px solid #e1e1e0;
  }

  .culture_info {
    padding: 20px;
  }

  .culture_info .h4 {
    padding: 0;
    margin-bottom: 14px;
    font-size: 18px;
  }

  .culture_info .h4:before {
    padding: 0 7px 0;
  }

  .culture_info .h4:last-of-type {
    margin-top: 20px;
    margin-bottom: 14px;
  }

  .culture_info p:last-of-type {
    font-size: 16px;
  }

  /* --- 책 view --- */

  .doc-body .mng_table caption.h4_deco {
    font-size: 20px;
  }

  .h4_deco:before {
    width: 7px;
    height: 7px;
    margin-right: 6px;
  }

  table.mng_table {
    border-top: 0 none;
  }

  .mng_table tbody tr:first-child td {
    border-left: 1px solid #e1e1e0;
  }

  .mng_table tbody tr:last-child {
    margin-bottom: 0;
  }

  .mng_table tbody tr {
    display: block;
    margin-bottom: 30px;
  }

  .mng_table tbody td {
    border: 1px solid #e1e1e0;
    border-top: 0 none;
    text-align: left;
  }

  .mng_table tbody tr td.first {
    border-top: 1px solid #e1e1e0;
  }

  .mng_table tbody td:last-child {
    border-bottom: 0 none;
  }

  .mng_table tbody td.last {
    display: flex;
    flex-flow: column nowrap;
    gap: 3px;
    border-right: 1px solid #e1e1e0;
    box-sizing: border-box;
  }

  .mng_table tbody td.last>* {
    padding: 0;
    flex: 1;
  }

  .mng_table tbody td.last a {
    min-width: initial;
    width: 100%;
    min-height: 32px;
    font-size: 15px;
    margin: 0;
    padding: 2px 10px 0;
    box-sizing: border-box;
    text-align: center;
  }

  .mng_table tbody td {
    display: flex;
    align-items: center;
    padding: 12px 16px 12px 106px;
    position: relative;
    min-height: 46px;
    box-sizing: border-box;
    font-size: 15px;
  }

  .mng_table tbody td::before {
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
    height: 100%;
    width: 90px;
    font-size: 15px;
    font-weight: 500;
    background: #f2f2f2;
    position: absolute;
    left: 0;
    top: 0;
    border-right: 1px solid #e1e1e0;
  }

  .mng_table tbody td.first::before {
    content: '등록번호';
  }

  .mng_table tbody td.td2::before {
    content: '편/권차';
  }

  .mng_table tbody td.td3::before {
    content: '자료실/청구기호';
  }

  .mng_table tbody td.td4::before {
    content: '자료상태';
  }

  .mng_table tbody td.td5::before {
    content: '반납예정일';
  }

  .mng_table tbody td.td5::before {
    content: '반납예정일';
  }

  .mng_table tbody td.last::before {
    content: '예약';
  }

  /* --- 페이징 --- */
  .dataTables_paginate {
    padding: 30px 0 0;
  }

  /* --- 버튼 --- */

  .search_condition .btn_multi_lang {
    height: 36px;
    padding: 4px 10px 0;
  }

  .search_condition .btn,
  .btn {
    font-size: 15px;
  }

  input[type="text"],
  input[type="password"],
  select,
  .input {
    height: 35px;
  }

  .btn.pri,
  .btn.pri.btn_search,
  .btn,
  .btn_area .btn {
    height: 36px;
    line-height: 1.8em;
    padding-top: 4px;
    min-width: 35px;
    padding: 4px 6px 0;
  }

  .btn.btn_reload {
    width: 35px;
    height: 35px;
  }

  /*.btn::before {width: 17px; height: 17px; margin-right: 4px; background-size: 17px 17px; background-repeat: no-repeat; background-position: center center;}*/

  /* --- 스마트도서 추천 --- */
  .view_list .search_result>article.recom_book {
    width: 100%;
    padding: 20px 16px;
  }

  .view_list .search_result>article.recom_book h5 {
    padding: 0px 0px 6px 115px;
  }

  .search_result>article.recom_book dl dt.b_publisher,
  .search_result>article.recom_book dl dt.b_pub_yy {
    width: 65px;
    font-size: 16px;
  }

  .search_result>article.recom_book dl dd.b_publisher,
  .search_result dl dd.b_pub_yy {
    background: none;
    background-size: initial;
    width: calc(100% - 65px);
  }

  /* --- main_visual remote --- */
  .popZone .bx-controls {
    left: 20px;
    padding: 6px 20px;
    bottom: 10%;
  }

  .bx-pager.bx-default-pager {
    margin-right: 10px;
  }

  .bx-viewport .main_swiper1,
  .bx-viewport .main_swiper2,
  .bx-viewport .main_swiper3,
  .bx-viewport .main_swiper4 {
    left: 20px;
    padding-right: 20px;
  }

  .main_swiper1,
  .main_swiper2,
  .main_swiper3,
  .main_swiper4,
  .main_swiper_link {
    left: 20px;
    padding-right: 20px;
  }

  .main_swiper1,
  .bx-viewport .main_swiper1 {
    font-size: 20px;
    top: calc(50% - 100px);
  }

  .swiper-slide-active .main_swiper1,
  .bx-viewport .active .main_swiper1 {
    top: calc(50% - 150px);
  }

  .main_swiper2,
  .bx-viewport .main_swiper2 {
    font-size: 32px;
    top: calc(50% - 70px);
  }

  .swiper-slide-active .main_swiper2,
  .bx-viewport .active .main_swiper2 {
    top: calc(50% - 120px);
  }

  .main_swiper3,
  .bx-viewport .main_swiper3 {
    font-size: 16px;
    top: calc(50% - 10px);
  }

  .swiper-slide-active .main_swiper3,
  .bx-viewport .active .main_swiper3 {
    top: calc(50% - 60px);
  }

  .main_swiper4,
  .bx-viewport .main_swiper4 {
    font-size: 16px;
    top: calc(50% + 50px);
  }

  .swiper-slide-active .main_swiper4,
  .bx-viewport .active .main_swiper4 {
    top: calc(50% - 0px);
  }

  .h_right>.tnb>a.logout {
    color: #fff;
    width: auto;
    opacity: 1;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='22' height='22'%3E%3Cpath d='M6.26489 3.80698L7.41191 5.44558C5.34875 6.89247 4 9.28873 4 12C4 16.4183 7.58172 20 12 20C16.4183 20 20 16.4183 20 12C20 9.28873 18.6512 6.89247 16.5881 5.44558L17.7351 3.80698C20.3141 5.61559 22 8.61091 22 12C22 17.5228 17.5228 22 12 22C6.47715 22 2 17.5228 2 12C2 8.61091 3.68594 5.61559 6.26489 3.80698ZM11 12V2H13V12H11Z' fill='rgba(255,255,255,1)'%3E%3C/path%3E%3C/svg%3E");
    font-size: 18px;
    padding: 0 0 0 35px;
  }

  /* --- 자유게시판 글작성 --- */
  table.write_table {
    margin: 0 -20px 20px;
    display: block;
    width: calc(100% + 40px);
    padding: 20px;
    box-sizing: border-box;
    background-color: #f9f9f9;
    border-top: 1px solid #ddd;
    border-bottom: 1px solid #ddd;
  }

  table.write_table tbody tr {
    display: block;
    padding: 6px 0 8px;
  }

  table.write_table tbody th,
  table.write_table tbody td {
    display: block;
    font-size: 16px;
    padding: 0;
    margin-bottom: 8px;
    box-sizing: border-box;
  }

  table.write_table tbody tr.first td,
  table.write_table tbody tr.first th {
    padding: 0;
  }

  table.write_table tbody th {
    width: 100%;
  }

  table.write_table tbody tr.first td {
    flex-flow: row wrap;
    justify-content: flex-start;
    gap: 7px;
  }

  table.write_table tbody td .bbs-textarea {
    padding: 0;
  }

  table.bbs-edit .checkbox-original {
    order: 4;
  }

  table.bbs-edit .checkbox-original {
    width: 100%;
  }

  table.write_table tbody tr:not(.first) td input[type=text] {
    width: 100%;
  }

  .fileUploader .preview {
    float: none;
    margin-right: 0;
    margin-bottom: 10px;
  }

  .fileUploader .preview span#previewFile {
    margin: 0 auto;
  }

  .fileUploader .file_attach_info {
    padding: 0 0 10px;
  }

  .fileUploader .file_info {
    margin-right: 0;
  }

  .fileUploader .fileListArea {
    margin-right: 0;
  }

  table.write_table td.file_attach.mmm1 {
    display: table-cell !important;
  }

  .fileUploader {
    padding: 0;
  }

  /* --- 이전글/다음글 --- */

  table.prev_next_remote td {
    box-sizing: border-box;
  }

  table.prev_next_remote tr.board-next td.td1,
  table.prev_next_remote tr.board-prev td.td1 {
    background-position: center center;
    width: 15%;
    font-size: 0;
  }

  table.prev_next_remote td.td2 {
    border-left: 0 none;
  }

  table.prev_next_remote td.td2 a {
    line-height: 1.1em;
  }

  /* --- 목록형 --- */
  .event_list tbody th {
    width: 8%;
  }

  /* --- nodata --- */
  .nodata {
    padding: 60px 15px;
  }

  /* --- 행사일정 --- */
  .ym_btns {
    margin: 30px 0 10px;
  }

  /*.cal-tbl {margin: 0 -10px; width: calc(100% + 20px);}*/
  .subpage #calendar table.cal-tbl td div {
    padding: 6px 4px 0 4px;
    font-size: 16px;
  }

  .subpage #calendar .date-type {
    text-align: right;
  }

  /* --- 행사일정 - 달력 --- */
  table.event_cal thead {
    display: none;
  }

  .subpage #calendar table.cal-tbl {
    width: calc(100% + 40px);
    margin: 0 -20px;
  }

  .subpage #calendar table.cal-tbl tbody td {
    display: flex;
    width: 100%;
    align-items: center;
    border-top: 0 none;
  }

  .subpage #calendar table.cal-tbl tbody tr:first-child td:first-child {
    border-top: 1px solid #e5e8eb;
  }

  .subpage #calendar table.cal-tbl tbody td,
  .subpage #calendar table.cal-tbl tbody td.data1,
  .subpage #calendar table.cal-tbl tbody td.data2,
  .subpage #calendar table.cal-tbl tbody td.data3 {
    padding-bottom: 0;
  }

  .subpage #calendar table.cal-tbl tbody td {
    min-height: 55px;
    position: relative;
  }

  .subpage #calendar table.cal-tbl tbody td.no_day {
    display: none;
  }

  .subpage #calendar table.cal-tbl td div {
    min-width: 74px;
    box-sizing: border-box;
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0;
    background: #f5f5f5;
    position: absolute;
    left: 0;
    top: 0;
    height: 100%;
    border-right: 1px solid #e5e8eb;
  }

  .subpage #calendar table.cal-tbl td.today div {
    background: #fcf8e3;
  }

  .subpage #calendar table.cal-tbl td div>span {
    display: inline-block;
    padding: 20px 26px;
  }

  .subpage #calendar table.event_cal td ul {
    padding: 8px 16px 8px 90px;
    flex: 1;
  }

  .subpage #calendar table.event_cal td li {
    padding: 4px 0;
    font-size: 15px;
  }

  .subpage #calendar table.event_cal td ul li a {
    font-size: 15px;
  }

  .doc-body .cal-func {
    padding: 6px 0;
  }

  #calendar .go_btn {
    display: none;
  }

  /* --- 무인대출 --- */
  .must_wrap {
    margin-bottom: 0;
  }

  .reg_table_wrap {
    border-top: 0;
    padding-top: 0;
  }

  .reg_table {
    margin-top: 8px;
    margin: 0 -20px;
    width: calc(100% + 40px);
  }

  .reg_table tbody th,
  .reg_table tbody td {
    border-top: 1px solid #dbdbdb;
    padding: 15px 12px;
    box-sizing: border-box;
  }

  .reg_table tbody td select {
    width: 100%;
  }

  /* --- 연혁 --- */
  body.lib_YB .history_wrap dl,
  body.lib_SS .history_wrap dl,
  body.lib_NE .history_wrap dl,
  body.lib_NA .history_wrap dl {
    flex-flow: column nowrap;
    align-items: flex-start;
    gap: 15px;
    margin: 30px 0 0;
  }

  /* --- 도서관 이용안내 --- */
  .guide_wrap .holiday_box {
    padding: 140px 20px 20px;
    background-position: center top 35px;
    word-break: break-all;
  }

  .guide_wrap .holiday_box p+p {
    margin-top: 10px;
  }


  /* 회원정보수정 */
  .h4_deco .must_wrap {
    font-size: 15px;
  }

  table.appli_form {
    width: calc(100% + 40px);
    margin: 0 -20px;
    border-bottom: 1px solid #e5e8eb;
  }

  table.appli_form tbody tr {
    display: flex;
    flex-flow: column nowrap;
    border-bottom: 0 none;
  }

  table.appli_form tbody th,
  table.appli_form tbody td {
    width: 100%;
    box-sizing: border-box;
    text-align: left;
    padding: 14px 20px;
  }

  table.appli_form tbody th {
    border-right: 0 none;
    border-top: 1px solid #e5e8eb;
    background: #f5f5f5;
  }

  .btn.findPostCode {
    height: 36px;
    line-height: 1.8em;
    padding-top: 4px;
  }

  table.appli_form tbody td input.post_input {
    width: 100%;
  }

  .ui-state-error.appli_ex {
    font-size: 15px;
    line-height: 1.1em;
  }

  /* 예약현황 */
  table.mobile_table.reserve_table tbody tr {
    display: flex;
    flex-flow: column nowrap;
  }

  table.mobile_table.reserve_table tbody tr td.rsv_rank {
    order: 2;
    position: relative;
    min-height: 40px;
    padding: 14px 16px 14px 116px;
    box-sizing: border-box;
    font-weight: 400;
    font-size: 16px;
    border-top: 1px solid #e1e1e0;
    margin-bottom: 0;
  }

  table.mobile_table.reserve_table tbody tr td.rsv_book {
    order: 1;
    padding: 0 0 10px 0;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.2em;
    border-top: 0 none;
  }

  .mobile_table td span.author,
  table.loan_table td .loan_author {
    font-size: 15px;
  }

  table.mobile_table.reserve_table tbody tr td.lib_name {
    order: 3;
  }

  table.mobile_table.reserve_table tbody tr td.rsv_day {
    order: 4;
  }

  table.mobile_table.reserve_table tbody tr td.rsv_end {
    order: 5;
  }

  table.mobile_table.reserve_table tbody tr td.rsv_cancel {
    order: 6;
  }

  table.mobile_table.reserve_table td.rsv_rank::before {
    display: flex;
    align-items: center;
    content: "예약순위";
    width: 100px;
    height: 100%;
    font-weight: 600;
    font-size: 16px;
    background-color: #f9f9f9;
    margin-right: 10px;
    position: absolute;
    left: 0;
    top: 0;
    border-right: 1px solid #e1e1e0;
    padding: 0 10px;
    box-sizing: border-box;
    color: #777;
  }

  table.mobile_table.reserve_table tbody tr td.rsv_book::before {
    display: none;
  }

  table.mobile_table.reserve_table tbody tr td.lib_name::before {
    content: "도서관명";
  }

  table.mobile_table.reserve_table tbody tr td.rsv_day::before {
    content: "예약일";
  }

  table.mobile_table.reserve_table tbody tr td.rsv_end::before {
    content: "예약만기일";
  }

  table.mobile_table.reserve_table tbody tr td.rsv_cancel::before {
    content: "예약취소";
  }

  /* 인사말 */
  .intro_text_title_wrap>p {
    text-align: left;
  }

  /* 나의 추천 도서 - 글쓰기*/
  .table.mybook_table,
  .table.mybook_table th,
  .table.mybook_table td {
    display: block;
  }

  .table.mybook_table th,
  .table.mybook_table td {
    border-left: 0 none;
    border-right: 0 none;
  }

  .table.mybook_table {
    margin: 0 -20px;
    width: calc(100% + 40px);
  }

  .table.mybook_table td+th {
    border-top: 1px solid #ccc;
  }

  .table.mybook_table tr {
    border-bottom: 1px solid #ccc;
  }

  .table.mybook_table th {
    text-align: left;
    color: #252525;
    border-bottom: 0 none;
  }

  .table.mybook_table td input {
    width: 100%;
  }

  .table.mybook_table td .bbs-textarea {
    padding: 0px 20px;
  }

  .table.mybook_table td a.btn.plus_btn {
    width: 100%;
    margin-right: 0;
    margin-bottom: 10px;
  }

  /* 비밀번호 찾기*/
  .doc-body .txt-box {
    padding: 14px 16px;
  }

  .must_wrap+.find_pw_id {
    margin-top: 6px;
  }

  .find_pw_id span {
    display: block;
    margin-right: 0;
    margin-bottom: 10px;
    line-height: 1;
    font-size: 18px;
  }

  .text_box p {
    font-size: 18px;
    word-break: break-all;
  }

  /* 스마트도서관 이용 안내 */
  .content.smart_content {
    width: 100%;
    float: none;
    margin-bottom: 0px
  }

  .img_box {
    width: 100%;
    margin-bottom: 40px;
  }

  .img_box img {
    width: 60%;
    float: none;
    margin: 0 auto;
  }

  .table_wrap.smart_table_wrap {
    border: 1px solid #dbdbdb;
    border-radius: 5px;
    overflow: hidden;
  }

  .table_wrap.smart_table_wrap tr:last-child {
    border-bottom: 0 none;
  }

  .table_wrap.smart_table_wrap tr td {
    padding: 20px 20px;
    line-height: 1.2em;
  }

  .mouse {
    display: none;
  }
}

@media screen and (max-width: 543px) {
  .text_box p {
    line-height: 1.2em;
  }

  .text_box p::before {
    transform: initial;
    top: 3px;
  }

  .img_box img {
    width: 100%;
  }

  .hope_title {
    background-position: left top;
    margin-bottom: 16px;
  }

  .hope_call {
    font-size: 16px;
    line-height: 1.1em;
    margin-bottom: 60px;
  }
}

/* btn color */
body.lib_YB .faqArea .faq .a .tit::before {
  border-color: #01AB9D
}

body.lib_NE .join-wrap table .btn,
body.lib_SS .join-wrap table .btn,
body.lib_NA .join-wrap table .btn,
body.lib_CH .join-wrap table .btn {
  color: #454545;
  border: 1px solid #ccc;
  background: #f2f2f2;
}

body.lib_NE .dataTables_pagiNEte .pagiNEte_button.current,
body.lib_NE .search_condition .btn,
body.lib_NE .btn.pri,
body.lib_NE .btn.btn1.disabled:hover,
body.lib_NE .btn.scd,
body.lib_NE .culture_info .h4:before,
body.lib_NE .find_pw_id,
body.lib_NE .btn.btn1,
body.lib_NE .btn,
body.lib_NE .history_wrap dl dd li span,
body.lib_NE .pw_check_wrap,
body.lib_NE .faqArea .faq .a .tit::before,
body.lib_NE .login-body .login button,
body.lib_NE input[type="text"]:hover,
body.lib_NE input[type="password"]:hover,
body.lib_NE select:hover,
body.lib_NE .input:hover,
body.lib_NE input[type="text"]:focus,
body.lib_NE input[type="password"]:focus,
body.lib_NE select:focus,
body.lib_NE .input:focus {
  border-color: #ff9114;
}

body.lib_NA .dataTables_paginate .paginate_button.current,
body.lib_NA .search_condition .btn,
body.lib_NA .btn.pri,
body.lib_NA .btn.btn1.disabled:hover,
body.lib_NA .btn.scd,
body.lib_NA .culture_info .h4:before,
body.lib_NA .find_pw_id,
body.lib_NA .btn.btn1,
body.lib_NA .btn,
body.lib_NA .history_wrap dl dd li span,
body.lib_NA .pw_check_wrap,
body.lib_NA .faqArea .faq .a .tit::before,
body.lib_NA .login-body .login button,
body.lib_NA input[type="text"]:hover,
body.lib_NA input[type="password"]:hover,
body.lib_NA select:hover,
body.lib_NA .input:hover,
body.lib_NA input[type="text"]:focus,
body.lib_NA input[type="password"]:focus,
body.lib_NA select:focus,
body.lib_NA .input:focus {
  border-color: #9f00ba;
}

body.lib_SS .dataTables_paginate .paginate_button.current,
body.lib_SS .search_condition .btn,
body.lib_SS .btn.pri,
body.lib_SS .btn.btn1.disabled:hover,
body.lib_SS .btn.scd,
body.lib_SS .culture_info .h4:before,
body.lib_SS .find_pw_id,
body.lib_SS .btn.btn1,
body.lib_SS .btn,
body.lib_SS .history_wrap dl dd li span,
body.lib_SS .pw_check_wrap,
body.lib_SS .faqArea .faq .a .tit::before,
body.lib_SS .login-body .login button,
body.lib_SS input[type="text"]:hover,
body.lib_SS input[type="password"]:hover,
body.lib_SS select:hover,
body.lib_SS .input:hover,
body.lib_SS input[type="text"]:focus,
body.lib_SS input[type="password"]:focus,
body.lib_SS select:focus,
body.lib_SS .input:focus {
  border-color: #37a4e9;
}


body.lib_CH .dataTables_paginate .paginate_button.current,
body.lib_CH .search_condition .btn,
body.lib_CH .btn.pri,
body.lib_CH .btn.btn1.disabled:hover,
body.lib_CH .btn.scd,
body.lib_CH .culture_info .h4:before,
body.lib_CH .find_pw_id,
body.lib_CH .btn.btn1,
body.lib_CH .btn,
body.lib_CH .history_wrap dl dd li span,
body.lib_CH .pw_check_wrap,
body.lib_CH .faqArea .faq .a .tit::before,
body.lib_CH .login-body .login button,
body.lib_CH input[type="text"]:hover,
body.lib_CH input[type="password"]:hover,
body.lib_CH select:hover,
body.lib_CH .input:hover,
body.lib_CH input[type="text"]:focus,
body.lib_CH input[type="password"]:focus,
body.lib_SS select:focus,
body.lib_SS .input:focus {
  border-color: #1F58A7;
}


body.lib_YB .btn.delay-btn,
body.lib_SS .btn.delay-btn,
body.lib_NA .btn.delay-btn,
body.lib_NE .btn.delay-btn {
  border-color: #ccc;
  background: #f5f5f5;
}

body.lib_YB .btn.delay-btn:hover,
body.lib_SS .btn.delay-btn:hover,
body.lib_NA .btn.delay-btn:hover,
body.lib_NE .btn.delay-btn:hover {
  background: #dfdfdf;
}

/* color 변경 */
body.lib_NE .h_right>.toggle,
body.lib_NE #section2 .section2_wrapper>.section2_right>ul>li span,
body.lib_NE #section2 .section2_wrapper>.section2_left>ul>li::before,
body.lib_NE #section2 .section2_wrapper>.section2_right>ul>li::before,
body.lib_NE .section_header h3:before,
body.lib_NE .dataTables_paginate .paginate_button.current,
body.lib_NE .h4_deco:before,
body.lib_NE #fp-nav ul li a.active span,
body.lib_NE .btn2.btn_reserve1,
body.lib_NE .join_step li.on,
body.lib_NE .faqArea .faq .q.blue span.icon::before,
body.lib_NE .btn.btn_reserve1,
body.lib_NE #section3 .section3_wrapper>.pick_menu>ul>li::before,
body.lib_NE .btn.reg_check_btn,
body.lib_NE .quick_menu h3,
body.lib_NE .group_wrap ol>li>span.box,
body.lib_NE .sitemap_wrap>ul>li>a {
  background: #ff9114;
}

body.lib_NA .h_right>.toggle,
body.lib_NA #section2 .section2_wrapper>.section2_right>ul>li span,
body.lib_NA #section2 .section2_wrapper>.section2_left>ul>li::before,
body.lib_NA #section2 .section2_wrapper>.section2_right>ul>li::before,
body.lib_NA .section_header h3:before,
body.lib_NA .dataTables_paginate .paginate_button.current,
body.lib_NA .h4_deco:before,
body.lib_NA #fp-nav ul li a.active span,
body.lib_NA .btn2.btn_reserve1,
body.lib_NA .join_step li.on,
body.lib_NA .faqArea .faq .q.blue span.icon::before,
body.lib_NA .btn.btn_reserve1,
body.lib_NA #section3 .section3_wrapper>.pick_menu>ul>li::before,
body.lib_NA .btn.reg_check_btn,
body.lib_NA .quick_menu h3,
body.lib_NA .group_wrap ol>li>span.box,
body.lib_NA .sitemap_wrap>ul>li>a {
  background: #9f00ba;
}

body.lib_SS .h_right>.toggle,
body.lib_SS #section2 .section2_wrapper>.section2_right>ul>li span,
body.lib_SS #section2 .section2_wrapper>.section2_left>ul>li::before,
body.lib_SS #section2 .section2_wrapper>.section2_right>ul>li::before,
body.lib_SS .section_header h3:before,
body.lib_SS .dataTables_paginate .paginate_button.current,
body.lib_SS .h4_deco:before,
body.lib_SS #fp-nav ul li a.active span,
body.lib_SS .btn2.btn_reserve1,
body.lib_SS .join_step li.on,
body.lib_SS .faqArea .faq .q.blue span.icon::before,
body.lib_SS .btn.btn_reserve1,
body.lib_SS #section3 .section3_wrapper>.pick_menu>ul>li::before,
body.lib_SS .btn.reg_check_btn,
body.lib_SS .quick_menu h3,
body.lib_SS .group_wrap ol>li>span.box,
body.lib_SS .sitemap_wrap>ul>li>a {
  background: #37a4e9;
}

body.lib_NR .h_right>.toggle,
body.lib_NR #section2 .section2_wrapper>.section2_right>ul>li span,
body.lib_NR #section2 .section2_wrapper>.section2_left>ul>li::before,
body.lib_NR #section2 .section2_wrapper>.section2_right>ul>li::before,
body.lib_NR .section_header h3:before,
body.lib_NR .dataTables_paginate .paginate_button.current,
body.lib_NR .h4_deco:before,
body.lib_NR #fp-nav ul li a.active span,
body.lib_NR .btn2.btn_reserve1,
body.lib_NR .join_step li.on,
body.lib_NR .faqArea .faq .q.blue span.icon::before,
body.lib_NR .btn.btn_reserve1,
body.lib_NR #section3 .section3_wrapper>.pick_menu>ul>li::before,
body.lib_NR .btn.reg_check_btn,
body.lib_NR .quick_menu h3,
body.lib_NR .group_wrap ol>li>span.box,
body.lib_NR .sitemap_wrap>ul>li>a {
  background: #2634B2;
}


body.lib_CH .h_right>.toggle,
body.lib_CH #section2 .section2_wrapper>.section2_right>ul>li span,
body.lib_CH #section2 .section2_wrapper>.section2_left>ul>li::before,
body.lib_CH #section2 .section2_wrapper>.section2_right>ul>li::before,
body.lib_CH .section_header h3:before,
body.lib_CH .dataTables_paginate .paginate_button.current,
body.lib_CH .h4_deco:before,
body.lib_CH #fp-nav ul li a.active span,
body.lib_CH .btn2.btn_reserve1,
body.lib_CH .join_step li.on,
body.lib_CH .faqArea .faq .q.blue span.icon::before,
body.lib_CH .btn.btn_reserve1,
body.lib_CH #section3 .section3_wrapper>.pick_menu>ul>li::before,
body.lib_CH .btn.reg_check_btn,
body.lib_CH .quick_menu h3,
body.lib_CH .group_wrap ol>li>span.box,
body.lib_CH .sitemap_wrap>ul>li>a {
  background: #1f58a7;
}


#section2 .section2_wrapper>.section2_right>ul>li span.end,
body.lib_SS #section2 .section2_wrapper>.section2_right>ul>li span.end,
body.lib_NA #section2 .section2_wrapper>.section2_right>ul>li span.end,
body.lib_NE #section2 .section2_wrapper>.section2_right>ul>li span.end {
  background: #999;
  color: #fff;
}

/* -- section2 -- */

body.lib_YB #section2 .section2_wrapper>.section2_right>ul>li span.reg_wait {
  color: #01ab9d;
  background: #BDE4DF;
  font-weight: 600;
}

body.lib_SS #section2 .section2_wrapper>.section2_right>ul>li span.reg_wait {
  color: #2575A8;
  background: #93CFF5;
  font-weight: 600;
}

body.lib_NA #section2 .section2_wrapper>.section2_right>ul>li span.reg_wait {
  color: #9f00ba;
  background: #DD98E9;
  font-weight: 600;
}

body.lib_NE #section2 .section2_wrapper>.section2_right>ul>li span.reg_wait {
  color: #D46600;
  background: #FFC27C;
  font-weight: 600;
}

body.lib_NR #section2 .section2_wrapper>.section2_right>ul>li span.reg_wait {
  color: #D46600;
  background: #FFC27C;
  font-weight: 600;
}

body.lib_YB #section1 .section_bottom>.bottom_left>form>.search_box>select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(1,171,157,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right center;
}

body.lib_SS #section1 .section_bottom>.bottom_left>form>.search_box>select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(55,164,233,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right center;
}

body.lib_NA #section1 .section_bottom>.bottom_left>form>.search_box>select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(159,0,186,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right center;
}

body.lib_NE #section1 .section_bottom>.bottom_left>form>.search_box>select {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(255,145,20,1)'%3E%3Cpath d='M11.9999 13.1714L16.9497 8.22168L18.3639 9.63589L11.9999 15.9999L5.63599 9.63589L7.0502 8.22168L11.9999 13.1714Z'%3E%3C/path%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: right center;
}

/* 댓글 start */
.prev_next_remote {
  margin-top: 40px;
}

.bbs-comment {
  margin-top: 40px;
}

.comment_write_wrap {
  display: flex;
}

.comment_write_wrap .textarea_box {
  flex: 1;
  font-size: 0;
}

.comment_write_wrap .textarea_box textarea {
  width: 100%;
  height: 90px;
  resize: none;
  border: 1px solid #dbdbdb;
  border-right: 0 none;
  box-sizing: border-box;
  border-radius: 4px 0 0 4px;
  margin: 0;
  font-size: 16px;
}

.comment_write_wrap button {
  width: 90px;
  height: 90px;
  border-radius: 0 4px 4px 0;
  font-weight: 600;
  color: #fff;
  background-color: #01ab9d;
}

body.lib_SS .comment_write_wrap button {
  background-color: #37a4e9;
}

body.lib_NA .comment_write_wrap button {
  background-color: #9f00ba;
}

body.lib_NE .comment_write_wrap button {
  background-color: #ff9114;
}

body.lib_NR .comment_write_wrap button {
  background-color: #2634B2;
}

body.lib_CH .comment_write_wrap button {
  background-color: #1F58A7;
}

.comment_write_wrap.modify {
  margin-top: 20px;
}

.comment_write_wrap.recomment {
  margin-top: 20px;
  padding-left: 30px;
  box-sizing: border-box;
  position: relative;
}

.comment_write_wrap.recomment::before {
  display: block;
  content: "";
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(119,119,119,1)'%3E%3Cpath d='M4.99989 13.9999L4.99976 5L6.99976 4.99997L6.99986 11.9999L17.1717 12L13.222 8.05024L14.6362 6.63603L21.0001 13L14.6362 19.364L13.222 17.9497L17.1717 14L4.99989 13.9999Z'%3E%3C/path%3E%3C/svg%3E");
  position: absolute;
  left: 0;
  top: 50%;
  transform: translateY(-50%);
}

.comment_wrap {
  display: flex;
  flex-flow: column nowrap;
  align-items: flex-end;
  margin-top: 20px;
  padding: 30px 30px;
  border: 1px solid #dbdbdb;
  border-radius: 4px;
  box-sizing: border-box;
  background-color: #fafafa;
}

.comment_wrap li {
  width: 100%;
  padding-bottom: 20px;
  border-bottom: 1px solid #dbdbdb;
  position: relative;
  box-sizing: border-box;
}

.comment_wrap li:last-of-type {
  border-bottom: 0 none;
  padding-bottom: 0;
}

.comment_wrap li+li {
  margin-top: 20px;
}

.comment_header {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}

.comment_header .name {
  display: flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  color: #252525;
}

/* .comment_header .name::before {display: block; content: ""; width: 16px; height: 16px; background-repeat: no-repeat; background-position: center; background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(119,119,119,1)'%3E%3Cpath d='M4 22C4 17.5817 7.58172 14 12 14C16.4183 14 20 17.5817 20 22H4ZM13 16.083V20H17.6586C16.9423 17.9735 15.1684 16.4467 13 16.083ZM11 20V16.083C8.83165 16.4467 7.05766 17.9735 6.34141 20H11ZM12 13C8.685 13 6 10.315 6 7C6 3.685 8.685 1 12 1C15.315 1 18 3.685 18 7C18 10.315 15.315 13 12 13ZM12 11C14.2104 11 16 9.21043 16 7C16 4.78957 14.2104 3 12 3C9.78957 3 8 4.78957 8 7C8 9.21043 9.78957 11 12 11Z'%3E%3C/path%3E%3C/svg%3E");} */
.comment_header .published {
  color: #777;
  font-size: 15px;
  line-height: 1;
}

.comment_content {
  padding-top: 20px;
}

.comment_btn_wrap {
  display: flex;
  align-items: center;
  gap: 15px;
  position: absolute;
  right: 0;
  top: 0;
}

.comment_btn_wrap>* {
  position: relative;
  background-color: transparent;
  color: #555;
  font-weight: 500;
}

.comment_btn_wrap>*+*::before {
  display: block;
  content: "";
  width: 1px;
  height: 12px;
  background-color: #dbdbdb;
  position: absolute;
  left: -8px;
  top: 50%;
  transform: translateY(-50%);
}

.comment_wrap li.reply {
  display: flex;
  align-items: flex-start;
  gap: 10px;
}

.comment_wrap li.reply::before {
  display: block;
  content: "";
  width: 18px;
  height: 18px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='18' height='18' fill='rgba(119,119,119,1)'%3E%3Cpath d='M4.99989 13.9999L4.99976 5L6.99976 4.99997L6.99986 11.9999L17.1717 12L13.222 8.05024L14.6362 6.63603L21.0001 13L14.6362 19.364L13.222 17.9497L17.1717 14L4.99989 13.9999Z'%3E%3C/path%3E%3C/svg%3E");
  margin-top: -2px;
}

/* .comment_wrap li.reply .btn-init {display: none;} */
/* 댓글 end */