.lib_detail {
  /* background: url(../../images/component/lib_detail_bg.jpg) no-repeat top center; */
  padding: 6.4rem 0;
  position: relative;
  overflow: hidden;
}
#container.container-lib-detail {
  background: transparent;
}
.lib_detail_bg {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  aspect-ratio: 7 / 2;
  z-index: 0;
  overflow: hidden;
  pointer-events: none;
  background: #F8FAFC;
  background: linear-gradient(180deg,rgba(248, 250, 252, 1) 80%, rgba(255, 255, 255, 1) 100%);
  }
  .lib_detail_bg::after {
    content: '';
    width: 100%;
    height: 10%;
    background: linear-gradient(180deg,rgba(248, 250, 252, 0) 85%, rgba(248, 250, 252, 1) 100%);
    position: absolute;
    left: 0;
    bottom: 0;
  }
  .lib_detail_bg img {
    width: 100%;
    object-fit: cover;
    /* aspect-ratio: 7 / 2; */
  }
.lib_detail > .inner {
  position: relative;
  z-index: 1;
}
.page-title-wrap {margin-bottom: var(--krds-gap-9);}
.page-title-wrap h1{
  text-align: center;
  font-weight: normal;
  font-family: 'HakgyoansimJiugaeR';
  font-size: var(--krds-font-size-display-large);
  text-shadow:
    -2px 0 #fff,
    2px 0 #fff,
    0 -2px #fff,
    0  2px #fff,
    -2px -2px #fff,
    2px -2px #fff,
    -2px  2px #fff,
    2px  2px #fff;
}
.lib_info_wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: var(--krds-gap-7);
}
.lib_guide, .lib_map, .lib_time {
  width: 100%;
  background-color: #ffffff;
  padding: var(--krds-padding-card-medium);
  border-radius: var(--krds-radius-xlarge1);
  border: 1px solid #D8E5FD;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
  height: 41rem;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  gap: var(--krds-gap-5);
}
.lib_info_wrap .sec-tit {
  display: flex;
  align-items: center;
  justify-content: start;
  gap: var(--krds-gap-2);
  }
  .lib_info_wrap .sec-tit img {
    width: var(--krds-icon--size-large);
    height: var(--krds-icon--size-large);
  }

/* 안내 */
.lib_guide .sec-tit {position: relative;}
.lib_guide .sec-tit button {
  position: absolute;
  top: 0;
  right: 0;
}
.lib_guide .lib_guide_list {
  display: flex;
  flex-wrap: wrap;
  gap: var(--krds-gap-5);
  height: calc(100% - 4.6rem);
  align-items: center;
  row-gap: var(--krds-gap-1);
}
.lib_guide .lib_guide_list div {
  width: calc(50% - 9px);
  display: flex;
  justify-content: start;
  align-items: center;
  gap: var(--krds-gap-5);
  height: fit-content;
}
.lib_guide .lib_guide_list div img {
  width: 3.2rem;
  height: 3.2rem;
  border-radius: var(--krds-radius-xlarge1);
  background-color: #F4F5F6;
  padding: 1rem;
}
.lib_guide .lib_guide_list div.lib_hompage {width: 100%;}
.lib_guide .lib_guide_list div p span {display: block;}

.lib_guide .lib_guide_list .lib_hompage p {width: calc(100% - 7rem);}
.lib_guide .lib_guide_list .lib_hompage a {
  display: flex;
  width: fit-content;
  max-width: 100%;
}
.lib_guide .lib_guide_list .lib_hompage a i {
  aspect-ratio: 1 / 1;
  margin-bottom: 1px !important;
}
.lib_guide .lib_guide_list .lib_hompage a span {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  width: calc(100% - 3rem);
  width: 100%;
}

/* 지도 */
.lib_map {gap: 0;}
.lib_map .kakaomap .root_daum_roughmap{
  width: 100%;
  height: 256px;
}
.lib_map .kakaomap .root_daum_roughmap .wrap_map {height: 100%;}
.lib_map .kakaomap .cont {display: none;} 

/* 이용시간 */
.lib_time {
  max-width: 40rem;
}
.lib_time table th,
.lib_time table td {
  text-align: center;
}
.lib_time table tr:not(:last-child) th,
.lib_time table tr:not(:last-child) td {
  padding-bottom: var(--krds-gap-4);
}

@media (min-width: 1440px) {
  .lib_guide {max-width: 55rem;}
}

@media (max-width: 1439px) {
  .lib_info_wrap {
    flex-wrap: wrap;
  }
  .lib_guide {height: fit-content;}
  .lib_guide .lib_guide_list {
    row-gap: inherit;
    height: fit-content;
  }
  .lib_guide .lib_guide_list div {width: calc(33% - 9px);}
  .lib_guide .lib_guide_list div.lib_hompage {width: calc(60% - 9px);}
  .lib_map {width: calc(60% - 1.2rem);}
  .lib_time {
    width: calc(40% - 1.2rem);
    max-width: none;
  }
}
@media (max-width: 767px) {
  .lib_detail {padding: 4rem 0;}
  .page-title-wrap {margin-bottom: var(--krds-gap-7);}
  .page-title-wrap h1 {font-size: var(--krds-font-size-heading-xlarge);}
  .lib_guide .lib_guide_list div {
    /* width: calc(50% - 9px); */
    min-width: fit-content;
    width: 100%;
  }
  .lib_guide .lib_guide_list div.lib_hompage {
    width: 100%;
    min-width: auto;
  }
  .lib_guide .lib_guide_list div img {
    width: 2rem;
    height: 2rem;
  }
  .lib_guide .lib_guide_list div p {
    width: 100%;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
  }
  .lib_map, .lib_time {
    width: 100%;
    height: fit-content;
  }
  .lib_map { gap: var(--krds-gap-5);}
  .lib_guide .lib_guide_list .lib_hompage p {width: calc(100% - 5rem);}
  .lib_guide .lib_guide_list .lib_hompage p a {max-width: calc(100% - 8rem);}
}
@media (max-width: 424px) {
  .lib_guide .lib_guide_list .lib_hompage p a {max-width: 100%;}
}
@media (max-width: 374px) {
  .lib_guide .sec-tit {flex-wrap: wrap;}
  .lib_guide .sec-tit button {
    position: unset;
    margin-left: auto;
  }
}

/* 탭관련 */
.lib_detail .krds-tab-area {
  margin-top: var(--krds-gap-12);
}
.lib_detail .tab.line {
  position: relative;
  /* width: 90%;
  margin: 0 auto; */
}
.lib_detail .tab.line > ul {
  overflow: hidden;
}
.lib_detail .opinion-edit {
  width: 33%;
  margin: 0 auto;
  text-align: right;
  z-index: 10;
  position: absolute;
  top: -24px;
  left: 50%;
  transform: translateX(-50%);
}
.lib_detail .opinion-edit .krds-btn {
  display: inline-flex;
  border-radius: var(--krds-radius-max);
  position: relative;
  height: var(--krds-button--size-height-medium);
  align-items: center;
  justify-content: center;
}
.lib_detail .opinion-edit .krds-btn:before {
  content: '';
  background: url(../../images/component/bubble-tail.png);
  width: 26px;
  height: 13px;
  position: absolute;
  bottom: 0;
  left: 0;
  transition: var(--krds-transition-base);
  z-index: -1;
}
.lib_detail .opinion-edit .krds-btn:hover:before {background: url(../../images/component/bubble-tail-hover.png);}
.lib_detail .opinion-edit .krds-btn:focus:before {background: url(../../images/component/bubble-tail-focus.png);}

.lib_detail .card-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: start;
  gap: var(--krds-gap-7);
}
.lib_detail .card-list .card-list-item {
  float: left;
  width: calc(25% - 18px);
  border: 1px solid var(--krds-light-color-border-gray);
  border-radius: var(--krds-radius-xlarge1);
}
.lib_detail .card-list .card-list-item a {
  width: 100%;
  height: 100%;
  display: block;
  padding: var(--krds-padding-card-medium);
}
.lib_detail .card-list .card-list-item h3 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}
.lib_detail .card-list .card-list-item .text-less p {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 5;
  color: var(--krds-high-contrast-color-text-subtle-inverse);
}
.lib_detail .card-list .card-list-item .thumb .thumb-inner {
  width: 100%;
  height: 20rem;
  border-radius: var(--krds-radius-xlarge1);
}

/* krds 구조 */
.lib_detail .krds-structured-list {grid-template-columns: 1fr 1fr 1fr 1fr;}
.lib_detail .krds-structured-list .card-body .c-text .c-txt {-webkit-line-clamp: 7;}
.lib_detail .krds-structured-list .card-body .c-img{
  aspect-ratio: 3 / 1.8;
  overflow: hidden;
  border-radius: var(--krds-radius-medium3);
}
.lib_detail .krds-structured-list .card-btm {justify-content: space-between;}
.krds-structured-list .structured-item .in {height: 100%;}
.krds-structured-list .card-btm {margin-top: auto;}

@media (max-width: 1439px) {
  .lib_detail .krds-tab-area {margin-top: var(--krds-gap-9);}
  .lib_detail .opinion-edit {
    position: unset;
    width: 100%;
    transform: unset;
    text-align: center;
  }
  .lib_detail .opinion-edit .krds-btn:before {
    display: inline-block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 16px 16px 0px 16px;
    border-color: #256ef4 transparent transparent transparent;
    background: unset;
    left: 50%;
    transform: translateX(-50%);
    bottom: -9px;
    z-index: 1;
  }
  .lib_detail .opinion-edit .krds-btn:hover:before {
    background: unset;
    border-color: #0b50d0 transparent transparent transparent;
  }
  .lib_detail .opinion-edit .krds-btn:focus:before {
    background: unset;
    border-color: #083891 transparent transparent transparent;
  }

  .lib_detail .krds-structured-list {grid-template-columns: 1fr 1fr 1fr;}
}
@media (max-width: 1023px) {
  .lib_detail .krds-structured-list {grid-template-columns: 1fr 1fr;}
  .lib_detail .krds-structured-list .card-body .c-text .c-txt {-webkit-line-clamp: 5;}
}
@media (max-width: 767px) {
  .lib_detail .krds-structured-list {grid-template-columns: 1fr;}
  .lib_detail .krds-structured-list .card-body .c-text .c-txt {-webkit-line-clamp: 3;}
  .lib_detail .krds-structured-list .card-body .c-img {
    max-height: 18rem;
    width: fit-content;
  }
}
@media (max-width: 424px) {
  .lib_detail .krds-structured-list .card-body .c-img {
    max-height: 18rem;
    width: 100%;
  }

  .lib_detail .tab.full > ul > li {flex: auto;}
  .lib_detail .tab.full .btn-tab {font-size: 1.7rem;}
  .lib_detail .opinion-edit {transform: translateX(-30px);}
  .lib_detail .opinion-edit .krds-btn:before {bottom: -7px;}
}
@media (max-width: 374px) {
}

.krds-structured-list .card-body .c-text .c-tit::after {display: none;}

.lib_guide .guide-actions {
  margin-top: auto;
}

.lib_guide .guide-actions .krds-btn {
  width: 100%;
}

.lib_detail .no-data {
  padding: 4rem 2rem;
  text-align: center;
  border: 1px solid var(--krds-light-color-border-gray);
  border-radius: var(--krds-radius-xlarge1);
  background: #fff;
  color: var(--krds-light-color-text-subtle);
  font-size: var(--krds-font-size-body-medium);
}
