@charset "UTF-8";
.sr-only {
  overflow: hidden;
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  border: 0;
  clip: rect(0, 0, 0, 0); /* 구형 브라우저를 위해 사용 */
  clip-path: polygon(0 0, 0 0, 0 0); /* inset(50%) 와 동일한 표현 */
}

button {
  cursor: pointer;
  border: 0;
  background: none;
}

.btn-wrap {
  display: flex;
  gap: 0.6rem;
  margin-top: 6rem;
}
.btn-wrap .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 12rem;
  height: 4rem;
  padding: 1rem 2.4rem;
  border-radius: 0.8rem;
  border: 1px solid #dadadf;
  background: #404040;
  color: #fff;
  box-sizing: border-box;
}
.btn-wrap .btn:hover {
  background: #111;
}
.btn-wrap .btn:disabled {
  background: #eaeaea;
  color: #929292;
}
.btn-wrap .btn-normal {
  border: 1px solid #dadadf;
  background-color: #fff;
  color: #222;
}
.btn-wrap .btn-normal:hover {
  background-color: #f4f4f4;
}
.btn-wrap .btn-normal:disabled {
  background-color: #eaeaea;
  color: #929292;
}
.btn-wrap .btn-etc {
  border: 0.1rem solid #222;
  background: #fff;
  color: #222;
}
.btn-wrap .btn-etc:hover {
  border: 0;
  background: #f5f5f5;
}
.btn-wrap .btn-etc:disabled {
  background: #eaeaea;
  color: #929292;
}
.btn-wrap .btn-cancel {
  border: 1px solid #dadadf;
  background: #fff;
  color: #eb3b26;
  font-weight: 600;
}
.btn-wrap .btn-cancel:hover {
  background: #4d4d4d;
  color: #fff;
  opacity: 0.4;
}
.btn-wrap .btn-large {
  min-width: 16rem;
  height: 5.2rem;
  font-size: 1.8rem;
  font-weight: 600;
  border-radius: 0.8rem;
  -webkit-border-radius: 0.8rem;
  -moz-border-radius: 0.8rem;
  -ms-border-radius: 0.8rem;
  -o-border-radius: 0.8rem;
}
.btn-wrap .btn-small {
  min-width: 0.9rem;
  height: 0.4rem;
  padding: 1rem;
  font-size: 1.5rem;
  font-weight: 500;
}
.btn-wrap .btn.secondary {
  background: #e60001;
}
.btn-wrap .btn.excel {
  border: 0.1rem solid #14874e;
  background: #fff;
  color: #14874e;
}
.btn-wrap .btn.excel:before {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  margin-right: 0.6rem;
  background: url("../../images/icon/icon_excel.png") no-repeat 0 0;
  background-size: cover;
}
.btn-wrap .btn.download:before {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  margin-right: 0.6rem;
  background: url("../../images/icon/icon_down_white.png") no-repeat 0 0;
  background-size: cover;
}
.btn-wrap .btn span {
  font-size: 1.8rem;
}
.btn-wrap.center {
  justify-content: center;
}
.btn-wrap.right {
  justify-content: flex-end;
}

.link-btn {
  display: flex;
  justify-content: center;
  margin-top: 4rem;
}
.link-btn a {
  display: flex;
  align-items: center;
  padding: 1rem 1.4rem;
  border: 0.1rem solid #dadadf;
  font-size: 1.8rem;
}
.link-btn a:before {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  margin-right: 0.6rem;
  background-size: cover;
}
.link-btn.download a::before {
  display: none;
}
.link-btn.download a::after {
  content: "";
  position: relative;
  display: inline-flex;
  width: 3rem;
  height: 3rem;
  background: url("../../images/icon/icon_download.png") no-repeat 0 0;
  background-size: 100%;
}
.link-btn.newwindow a::before {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  margin-right: 0.6rem;
  background: url("../../images/icon/icon_window.png") no-repeat 0 0;
  background-size: cover;
}
.link-btn.mt24 {
  margin-top: 2.4rem !important;
}
.link-btn.mb28 {
  margin-bottom: 2.8rem;
}

@media (max-width: 1024px) {
  .btn-wrap .btn.excel {
    display: none;
  }
  .btn-wrap .btn span {
    font-size: 1.6rem;
  }
  .link-btn a {
    font-size: 1.6rem;
  }
}
@media (max-width: 768px) {
  .btn-wrap {
    display: block;
  }
  .btn-wrap .btn + .btn {
    margin-top: 0.8rem;
  }
  .btn-wrap .btn-large {
    width: 100%;
    min-width: unset;
    font-size: 1.6rem;
  }
}
html,
body {
  display: block;
  height: 100%;
  width: 100%;
  line-height: 1;
  font-size: 10px;
  font-family: "Pretendard", "Malgun Gothic", sans-serif;
  letter-spacing: -0.05em;
  -ms-text-size-adjust: 100%;
  -webkit-text-size-adjust: 100%;
  -webkit-font-smoothing: antialiased;
}

body,
h1,
h2,
h3,
h4,
h5,
h6,
div,
p,
blockquote,
pre,
address,
ul,
ol,
li,
dl,
dt,
dd,
table,
caption,
th,
td,
form,
fieldset,
legend,
hr,
label,
button,
input,
label,
select,
textarea {
  margin: 0;
  padding: 0;
  font-size: 1.6rem;
  font-family: "Pretendard", "Malgun Gothic", sans-serif;
  color: #121212;
  font-weight: 400;
}

ul,
ol,
dl {
  list-style: none;
  font-size: 1.6rem;
}

table {
  width: 100%;
  margin: 0;
  padding: 0;
  border-spacing: 0;
  border: 0;
  border-collapse: collapse;
  font-size: 1.6rem;
}

img,
button,
fieldset,
abbr,
acronym {
  border: 0;
}

/* img {display: block;} 이미지 기본속성으로 사용 */
address,
caption,
cite,
code,
dfn,
em,
var {
  font-style: normal;
  font-size: 1.6rem;
}

q:before,
q:after {
  content: "";
}

a,
input,
select,
button,
img,
label,
span,
strong {
  vertical-align: middle;
  text-decoration: none;
  font-size: 1.6rem;
}

a {
  color: inherit;
}

a.skip {
  position: fixed;
  left: -9999px;
  top: -9999px;
  display: block;
  line-height: 3em;
  background: #40b2cd;
  color: #fff;
  text-align: center;
}

a.skip:hover,
a.skip:focus {
  position: static;
  left: 0;
  top: 0;
}

a.skip:focus {
  position: fixed;
  z-index: 100;
  right: 0;
  background-color: #000;
  color: #fff;
}

.error {
  color: #f74e37;
}

.succ {
  color: #14874e;
}

.info {
  color: #1a71ea;
}

.caut {
  color: #ffa600;
}

.root_daum_roughmap .cont {
  display: none !important;
}

body.hide, html.hide {
  overflow: hidden;
}

/* Chrome, Safari용 스크롤 바 */
::-webkit-scrollbar {
  width: 0.6rem;
  height: 0.6rem;
}

::-webkit-scrollbar-button:start:decrement,
::-webkit-scrollbar-button:end:increment {
  display: none;
  width: 1rem;
  height: 1rem;
  background: rgba(0, 0, 0, 0.05);
}

::-webkit-scrollbar-thumb {
  background: #404040;
}

::-webkit-scrollbar-track {
  background: #dadadf;
}

::-webkit-input-placeholder {
  color: #656565;
}

:-moz-placeholder {
  color: #656565;
}

::-moz-placeholder {
  color: #656565;
}

:-ms-input-placeholder {
  color: #656565;
}

::-webkit-input-placeholder {
  color: #656565;
}

:-moz-placeholder {
  color: #656565;
}

::-moz-placeholder {
  color: #656565;
}

:-ms-input-placeholder {
  color: #656565;
}

.readypage-area {
  width: 100%;
  min-height: 50rem;
}
.readypage-area .ready-page {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  flex-direction: column;
  height: 100%;
  max-height: 50rem;
}
.readypage-area .ready-page::before {
  content: "";
  display: inline-flex;
  width: 12rem;
  height: 12rem;
  background: url("../../images/icon/icon_error.svg") no-repeat;
  background-size: cover;
}
.readypage-area .ready-page .title {
  margin: 1.4rem 0;
  font-size: 3rem;
  font-weight: 700;
  color: #404040;
}
.readypage-area .ready-page p {
  color: #929292;
  line-height: 2.6rem;
  font-weight: 500;
}

.swiper-btn {
  display: flex;
  justify-content: center;
  gap: 0 1rem;
  margin-top: 4rem;
}
.swiper-btn .swiper-button-prev,
.swiper-btn .swiper-rtl .swiper-button-next,
.swiper-btn .swiper-button-next,
.swiper-btn .swiper-rtl .swiper-button-prev {
  position: static;
  width: 4rem;
  height: 4rem;
  margin-top: 0;
  border: 0.1rem solid #dadadf;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background: #fff;
}
.swiper-btn .swiper-button-prev:after,
.swiper-btn .swiper-rtl .swiper-button-next:after {
  content: "";
  width: 2rem;
  height: 2rem;
  font-family: initial;
  background: url("../../images/icon/icon_paging_prev.png") no-repeat 0 0;
  background-size: cover;
}
.swiper-btn .swiper-button-next:after,
.swiper-btn .swiper-rtl .swiper-button-prev:after {
  content: "";
  width: 2rem;
  height: 2rem;
  font-family: initial;
  background: url("../../images/icon/icon_paging_next.png") no-repeat 0 0;
  background-size: cover;
}
@media (max-width: 768px) {
  .swiper-btn .swiper-button-prev,
  .swiper-btn .swiper-rtl .swiper-button-next,
  .swiper-btn .swiper-button-next,
  .swiper-btn .swiper-rtl .swiper-button-prev {
    position: static;
    width: 2.4rem;
    height: 2.4rem;
  }
  .swiper-btn .swiper-button-prev:after,
  .swiper-btn .swiper-rtl .swiper-button-next:after {
    content: "";
    width: 1.2rem;
    height: 1.2rem;
    background-size: cover;
  }
  .swiper-btn .swiper-button-next:after,
  .swiper-btn .swiper-rtl .swiper-button-prev:after {
    content: "";
    width: 1.2rem;
    height: 1.2rem;
    background-size: cover;
  }
}

.terms-area {
  margin-top: 4rem;
  border-top: 0.2rem solid #555;
}
.terms-area .check {
  padding: 2rem 0;
  border-bottom: 0.1rem solid #dadadf;
}
.terms-area .check label {
  font-weight: 600;
  font-size: 1.8rem;
  color: #555;
}
.terms-area .check label .error {
  font-size: 1.8rem;
  vertical-align: baseline;
  color: #f74e37;
}
@media (max-width: 768px) {
  .terms-area .check label {
    font-size: 1.6rem;
    color: #555;
  }
  .terms-area .check label .error {
    font-size: 1.6rem;
  }
}

.gray-text-area {
  position: relative;
  width: 100%;
  /*height: 10.2rem;*/
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 2.1rem 4rem;
  background: #f4f4f4;
  border-radius: 2rem;
  box-sizing: border-box;
}
.gray-text-area p {
  max-width: 81.4rem;
  margin: 0 auto;
  line-height: 140%;
  color: #555;
  font-size: 2rem;
  padding-left: 1rem;
  text-indent: -1rem;
}
.gray-text-area p + p {
  margin-top: 0.8rem;
}
.gray-text-area p strong {
  display: inline-block;
  font-weight: 600;
  font-size: 2rem;
  margin-top: -0.4rem;
}
.gray-text-area p .info {
  color: #1a71ea;
  font-weight: 600;
}
.gray-text-area p .block {
  display: block;
}
.gray-text-area p .big {
  display: block;
  margin-bottom: 1.6rem;
  font-size: 2.4rem;
  color: #222;
  line-height: 100%;
  font-weight: 600;
  text-align: left;
}
.gray-text-area p.v2 {
  max-width: unset;
  padding: 0;
  text-indent: 0;
  text-align: left;
  margin: unset;
}
.gray-text-area.left {
  text-align: left;
}
.gray-text-area::after {
  content: "";
  right: 6rem;
  right: 2rem;
  top: 50%;
  display: inline-flex;
  width: 7rem;
  height: 7rem;
}
.gray-text-area.audio::after {
  background: url("../../images/icon/icon_audio.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.smart::after {
  background: url("../../images/icon/icon_gray-smart.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.trade::after {
  background: url("../../images/icon/icon_gray-trade.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.shipment::after {
  background: url("../../images/icon/icon_gray-shipment.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.hope::after {
  background: url("../../images/icon/icon_gray-hope.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.local::after {
  background: url("../../images/icon/icon_gray-local.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.chart::after {
  background: url("../../images/icon/icon_gray-chart.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.pie::after {
  background: url("../../images/icon/icon_gray-pie.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.rembook::after {
  background: url("../../images/icon/icon_gray-rembook.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.deal::after {
  background: url("../../images/icon/icon_gray-deal.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.friend::after {
  background: url("../../images/icon/icon_gray-friend.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.sdi::after {
  background: url("../../images/icon/icon_gray-sdi.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.achieve::after {
  background: url("../../images/icon/icon_gray-achieve.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.cafe::after {
  background: url("../../images/icon/icon_gray-cafe.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.fax::after {
  background: url("../../images/icon/icon_gray-fax.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.ask::after {
  background: url("../../images/icon/icon_gray-ask.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.talk::after {
  background: url("../../images/icon/icon_gray-talk.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.people-loan::after {
  background: url("../../images/icon/icon_gray-people.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.stand::after {
  background: url("../../images/icon/icon_gray-stand.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.notebook::after {
  background: url("../../images/icon/icon_gray-notebook.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.lost::after {
  background: url("../../images/icon/icon_gray-lost.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.serve::after {
  background: url("../../images/icon/icon_gray-serve.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.look::after {
  background: url("../../images/icon/icon_gray-look.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.program::after {
  background: url("../../images/icon/icon_gray-program.png") no-repeat 0 0;
  background-size: cover;
}
.gray-text-area.db::after {
  background: url("../../images/icon/icon_gray-db.png") no-repeat 0 0;
  background-size: cover;
}

.library {
  display: inline-block;
  padding: 0.5rem 0.6rem;
  text-align: center;
  border-radius: 0.2rem;
  font-size: 1.4rem;
  color: #fff;
  box-sizing: border-box;
  white-space: nowrap;
}
.library.com {
  background: #404040;
}
.library.jungang {
  background: #e60001;
}
.library.gangil {
  background: #0050cc;
}
.library.dunchun {
  background: #0f8448;
}
.library.seongnae {
  background: #917200;
}
.library.supsok {
  background: #5d8200;
}
.library.amsa {
  background: #da2b7d;
}
.library.cheonho {
  background: #6430a3;
}
.library.haegong {
  background: #c75300;
}
.library.small {
  background: #0079cf;
}
.library.bookcafe {
  background: #7b4420;
}

.nothing-content {
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: center;
  width: 100%;
  padding: 10rem 0;
  border-bottom: 0.1rem solid #dadadf;
}
.nothing-content p {
  margin-top: 1.4rem;
  color: #929292;
  font-weight: 400;
}
.nothing-content::before {
  content: "";
  display: inline-flex;
  justify-content: center;
  width: 8rem;
  height: 8rem;
  margin: 0 auto;
  background: url("../../images/icon/icon_nocontent.png") no-repeat 0 0;
  background-size: cover;
}

.personalauth-box {
  display: flex;
  align-items: center;
  padding: 2rem 4rem;
  margin-top: 1rem;
  background: #f4f4f4;
}
.personalauth-box > .title {
  width: 18rem;
  color: #1a71ea;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 140%;
}
.personalauth-box ul {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem 4rem;
  width: calc(100% - 18rem);
}
.personalauth-box ul li {
  flex: 0 0 calc(50% - 2rem);
  display: flex;
  align-items: center;
  gap: 2rem;
  line-height: 140%;
}
.personalauth-box ul li .title {
  width: 8rem;
  font-weight: 600;
  color: #222;
}
.personalauth-box ul li .text {
  width: calc(100% - 10rem);
  word-break: keep-all;
}
@media (max-width: 1024px) {
  .personalauth-box {
    padding: 2rem;
  }
  .personalauth-box ul {
    width: 100%;
  }
  .personalauth-box .title {
    width: 15rem;
  }
}
@media (max-width: 768px) {
  .personalauth-box {
    display: block;
  }
  .personalauth-box .title {
    display: block;
    width: 100%;
    text-align: center;
  }
  .personalauth-box ul {
    flex-direction: column;
    margin-top: 1rem;
    gap: 0.4rem 4rem;
  }
  .personalauth-box ul li {
    flex: 1;
    justify-content: flex-start;
    gap: 0.4rem;
  }
  .personalauth-box ul li > .title {
    width: 8rem;
    text-align: left;
  }
  .personalauth-box ul li .text {
    width: calc(100% - 8rem);
    word-break: break-all;
  }
}

.hope-area .search-area,
.favorite-area .search-area,
.facility-area .search-area,
.festival-area .search-area,
.library-area .search-area,
.myquestion-area .search-area,
.myprogram-list .search-area,
.archiving-area .search-area,
.layer-content .search-area,
.small-lib .search-area {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 1.6rem 2.4rem;
  background-color: #f4f4f4;
  gap: 0.6rem;
}
.hope-area .search-area .input-box .select,
.favorite-area .search-area .input-box .select,
.facility-area .search-area .input-box .select,
.festival-area .search-area .input-box .select,
.library-area .search-area .input-box .select,
.myquestion-area .search-area .input-box .select,
.myprogram-list .search-area .input-box .select,
.archiving-area .search-area .input-box .select,
.layer-content .search-area .input-box .select,
.small-lib .search-area .input-box .select {
  width: 100%;
  max-width: 22rem;
}
.hope-area .search-area .input-box .input,
.favorite-area .search-area .input-box .input,
.facility-area .search-area .input-box .input,
.festival-area .search-area .input-box .input,
.library-area .search-area .input-box .input,
.myquestion-area .search-area .input-box .input,
.myprogram-list .search-area .input-box .input,
.archiving-area .search-area .input-box .input,
.layer-content .search-area .input-box .input,
.small-lib .search-area .input-box .input {
  display: flex;
}
.hope-area .search-area .input-box .input input,
.favorite-area .search-area .input-box .input input,
.facility-area .search-area .input-box .input input,
.festival-area .search-area .input-box .input input,
.library-area .search-area .input-box .input input,
.myquestion-area .search-area .input-box .input input,
.myprogram-list .search-area .input-box .input input,
.archiving-area .search-area .input-box .input input,
.layer-content .search-area .input-box .input input,
.small-lib .search-area .input-box .input input {
  width: 34rem;
  padding: 0 2rem;
  border: 0.2rem solid #404040;
  border-radius: 0.2rem 0 0 0.2rem;
}
.hope-area .search-area .input-box .input.btn .btn,
.favorite-area .search-area .input-box .input.btn .btn,
.facility-area .search-area .input-box .input.btn .btn,
.festival-area .search-area .input-box .input.btn .btn,
.library-area .search-area .input-box .input.btn .btn,
.myquestion-area .search-area .input-box .input.btn .btn,
.myprogram-list .search-area .input-box .input.btn .btn,
.archiving-area .search-area .input-box .input.btn .btn,
.layer-content .search-area .input-box .input.btn .btn,
.small-lib .search-area .input-box .input.btn .btn {
  width: 12rem;
  height: 4rem;
  background-color: #404040;
  color: #fff;
}
.hope-area .search-area .input-box .input.btn .btn:hover,
.favorite-area .search-area .input-box .input.btn .btn:hover,
.facility-area .search-area .input-box .input.btn .btn:hover,
.festival-area .search-area .input-box .input.btn .btn:hover,
.library-area .search-area .input-box .input.btn .btn:hover,
.myquestion-area .search-area .input-box .input.btn .btn:hover,
.myprogram-list .search-area .input-box .input.btn .btn:hover,
.archiving-area .search-area .input-box .input.btn .btn:hover,
.layer-content .search-area .input-box .input.btn .btn:hover,
.small-lib .search-area .input-box .input.btn .btn:hover {
  background: #111;
}
.hope-area .search-area .input-box .input.btn .btn:disabled,
.favorite-area .search-area .input-box .input.btn .btn:disabled,
.facility-area .search-area .input-box .input.btn .btn:disabled,
.festival-area .search-area .input-box .input.btn .btn:disabled,
.library-area .search-area .input-box .input.btn .btn:disabled,
.myquestion-area .search-area .input-box .input.btn .btn:disabled,
.myprogram-list .search-area .input-box .input.btn .btn:disabled,
.archiving-area .search-area .input-box .input.btn .btn:disabled,
.layer-content .search-area .input-box .input.btn .btn:disabled,
.small-lib .search-area .input-box .input.btn .btn:disabled {
  opacity: 0.4;
}
.hope-area .search-area .btn-wrap,
.favorite-area .search-area .btn-wrap,
.facility-area .search-area .btn-wrap,
.festival-area .search-area .btn-wrap,
.library-area .search-area .btn-wrap,
.myquestion-area .search-area .btn-wrap,
.myprogram-list .search-area .btn-wrap,
.archiving-area .search-area .btn-wrap,
.layer-content .search-area .btn-wrap,
.small-lib .search-area .btn-wrap {
  margin-top: 0;
}
.hope-area #panel1 .date-filter,
.hope-area #panel2 .date-filter,
.hope-area #panel3 .date-filter,
.favorite-area #panel1 .date-filter,
.favorite-area #panel2 .date-filter,
.favorite-area #panel3 .date-filter,
.facility-area #panel1 .date-filter,
.facility-area #panel2 .date-filter,
.facility-area #panel3 .date-filter,
.festival-area #panel1 .date-filter,
.festival-area #panel2 .date-filter,
.festival-area #panel3 .date-filter,
.library-area #panel1 .date-filter,
.library-area #panel2 .date-filter,
.library-area #panel3 .date-filter,
.myquestion-area #panel1 .date-filter,
.myquestion-area #panel2 .date-filter,
.myquestion-area #panel3 .date-filter,
.myprogram-list #panel1 .date-filter,
.myprogram-list #panel2 .date-filter,
.myprogram-list #panel3 .date-filter,
.archiving-area #panel1 .date-filter,
.archiving-area #panel2 .date-filter,
.archiving-area #panel3 .date-filter,
.layer-content #panel1 .date-filter,
.layer-content #panel2 .date-filter,
.layer-content #panel3 .date-filter,
.small-lib #panel1 .date-filter,
.small-lib #panel2 .date-filter,
.small-lib #panel3 .date-filter {
  flex-direction: row;
  padding: 1.6rem 3rem;
}

figure {
  margin: 0 auto;
  aspect-ratio: 16/9;
}
figure img {
  width: 100%;
  height: auto;
  object-fit: cover;
}

.mobile-memeber {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  z-index: 9999;
}
.mobile-memeber .member-button {
  position: absolute;
  right: 2rem;
  top: 1.2rem;
}
.mobile-memeber .member-button .mobile-btn {
  content: "";
  display: inline-flex;
  width: 4rem;
  height: 4rem;
  background: url("../../images/icon/icon_menu_close.png") no-repeat 0 0;
  background-size: cover;
}
.mobile-memeber .content-area {
  display: flex;
  align-items: center;
  flex-direction: column;
  width: 100%;
  height: 100%;
  padding: 0 3rem;
  margin-top: 10.4rem;
  text-align: center;
  box-sizing: border-box;
}
.mobile-memeber .content-area::before {
  content: "";
  display: inline-flex;
  width: 24rem;
  height: 4rem;
  background: url("../../images/visual/logo_gangdong_v1.png") no-repeat 0 0;
  background-size: cover;
}
.mobile-memeber .content-area .title {
  margin-top: 2rem;
  color: #222;
  font-size: 3.6rem;
  font-weight: 600;
  letter-spacing: -0.072rem;
}
.mobile-memeber .content-area .bar-code {
  margin-top: 6rem;
}
.mobile-memeber .content-area .bar-code .name {
  width: 100%;
  color: #222;
  text-align: center;
  font-size: 2.4rem;
  font-weight: 600;
  letter-spacing: -0.048rem;
}
.mobile-memeber .content-area .bar-code .barcode-area {
  margin-top: 2rem;
}
.mobile-memeber .content-area .bar-code .barcode {
  display: block;
  margin-top: 2rem;
  color: #222;
  text-align: center;
  font-size: 2.4rem;
  font-weight: 600;
}
.mobile-memeber .content-area .btn-wrap .btn {
  width: 15.6rem;
  min-width: unset;
  height: 5.2rem;
  padding: 1rem 0;
  margin: 0 auto;
}
.mobile-memeber .content-area .btn-wrap .btn span {
  font-size: 1.8rem;
  font-weight: 600;
}
.mobile-memeber .content-area .btn-wrap .btn::before {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  margin-right: 0.6rem;
  background: url("../../images/icon/icon_change.png") no-repeat 0 0;
  background-size: cover;
}
.mobile-memeber .content-area .select-content {
  display: none;
  width: 100%;
}
.mobile-memeber .content-area .select-content ul {
  overflow: auto;
  max-height: 40rem;
  width: 100%;
  margin-top: 6rem;
}
.mobile-memeber .content-area .select-content ul li {
  padding: 2rem 0;
  border-radius: 0.4rem;
  border: 0.1rem solid #dadadf;
}
.mobile-memeber .content-area .select-content ul li button span {
  display: block;
  text-align: center;
  font-size: 2.4rem;
  font-weight: 600;
  line-height: normal;
  letter-spacing: -0.024rem;
}
.mobile-memeber .content-area .select-content ul li + li {
  margin-top: 1rem;
}
.mobile-memeber .content-area .select-content ul li.on {
  border: 0.1rem solid #e60001;
}

.content-area.terms .content {
  margin-top: 5rem;
}
.content-area.terms .content .privacy-area > .title {
  color: #222;
  font-size: 5.2rem;
  font-weight: 700;
  text-align: center;
}
.content-area.terms .content .privacy-area .top-area {
  margin-top: 6rem;
  padding-bottom: 6rem;
  border-bottom: 0.1rem solid #dadadf;
}
.content-area.terms .content .privacy-area .top-area > .title {
  color: #222;
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.024rem;
}
.content-area.terms .content .privacy-area .top-area p {
  color: #555;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.016rem;
}
.content-area.terms .content .privacy-area .top-area.center {
  margin-top: 1.4rem;
}
.content-area.terms .content .privacy-area .top-area.center p {
  text-align: center;
  line-height: 140%;
}
.content-area.terms .content .privacy-area .bottom-area {
  margin-top: 3.2rem;
}
.content-area.terms .content .privacy-area .bottom-area section ul li, .content-area.terms .content .privacy-area .bottom-area section ol li {
  color: #555;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 180%;
  letter-spacing: -0.028rem;
}
.content-area.terms .content .privacy-area .bottom-area section p {
  color: #555;
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 180%;
  letter-spacing: -0.028rem;
}
.content-area.terms .content .privacy-area .bottom-area section h2 {
  margin-bottom: 2rem;
}
.content-area.terms .content .privacy-area .bottom-area section h3 {
  margin-bottom: 1rem;
}
.content-area.terms .content .privacy-area .bottom-area section article + article {
  margin-top: 2.4rem;
}
.content-area.terms .content .privacy-area .bottom-area section + section {
  margin-top: 3rem;
}
.content-area.terms .content .privacy-area.email .top-area {
  padding-bottom: 0;
  border: 0;
}
.content-area.terms .content .privacy-area.email .bottom-area {
  margin-top: 6rem;
  border: 0;
}
.content-area.terms .content .privacy-area.email .bottom-area h2 {
  color: #222;
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.024rem;
}
.content-area.terms .content .privacy-area.email .bottom-area h3 {
  margin-bottom: 1.6rem;
}

.htitle {
  position: relative;
  margin: 40px 0 15px;
  font-weight: 500;
  font-size: 1.412em;
  line-height: 1.2;
  color: #222;
}

.policyCon .ntit {
  font-size: 1.059em;
  color: #222;
  margin: 15px 0;
  font-weight: 500;
}

.policy-list {
  line-height: 2.4rem;
}

.policyCon .policy-list > li strong {
  color: #222;
}

.policyCon .policy-list > li {
  margin-bottom: 15px;
  margin-left: 20px;
}

.tbl {
  position: relative;
  border-top: 2px solid #666;
  background-color: #fff;
}

.tbl.hasLibrary td {
  font-size: 0.941em;
}

.tbl col.left {
  width: 180px;
}

.tbl th, .tbl td {
  padding: 15px 5px;
  color: #444;
  text-align: center;
  border-bottom: 1px solid #e2e2e2;
  border-left: 1px solid #e2e2e2;
  empty-cells: show;
}

.tbl td {
  color: #555;
}

.tbl th {
  background-color: #f8f8f8;
  font-weight: normal;
}

.tbl thead + tbody th {
  background-color: #fff;
}

.tbl tbody td.ta_l {
  padding-left: 20px;
}

.tbl th:first-child, .tbl td:first-child {
  border-left: 0;
}

.tbl th.bdr, .tbl td.bdr {
  border-left: 1px solid #e2e2e2;
}

.tbl thead + tbody th[scope=row] + td {
  text-align: center;
}

.tbl tbody + tbody::before {
  content: "";
  display: block;
  padding-top: 20px;
}

.tbl tbody + tbody tr:first-child th, .tbl tbody + tbody tr:first-child td {
  border-top: 1px solid #999;
}

.tbl td li {
  margin: 0;
}

.tbl td li .btn, .tbl td li .tblBtn {
  vertical-align: inherit;
}

.tbl td.title {
  text-align: left;
}

.tbl td.title a:hover, .tbl td.title:focus {
  text-decoration: underline;
}

.tbl td.chkCell {
  padding: 5px 8px;
  background-color: #f4f4f4;
}

.ref-list > li, .ref {
  padding-left: 15px;
  margin-top: 1rem;
}

.mb20 {
  margin-bottom: 20px;
}

/* list style - dash */
.dot-list > li {
  padding-left: 10px;
}

.dot.stitle {
  font-size: 1.188em;
  color: #5d3a1e;
  display: inline-block;
}

.dot-list > li + li, .dash-list > li + li {
  margin-top: 3px;
}

.dot-list > li strong {
  color: #333;
}

/* list style - dash */
.dash-list > li, .dash {
  padding-left: 10px;
  background: url("/include/image/common/bul_dash.png") 0 13px no-repeat;
  color: #555 !important;
}

@media (max-width: 1024px) {
  .gray-text-area {
    padding: 2.4rem 1.6rem;
  }
  .gray-text-area::after {
    display: none;
  }
  .gray-text-area br {
    display: none;
  }
}
@media (max-width: 768px) {
  .hope-area .search-area,
  .favorite-area .search-area,
  .facility-area .search-area,
  .festival-area .search-area,
  .library-area .search-area,
  .myquestion-area .search-area,
  .myprogram-list .search-area,
  .archiving-area .search-area,
  .layer-content .search-area,
  .small-lib .search-area {
    display: block;
  }
  .hope-area .search-area .input-box,
  .favorite-area .search-area .input-box,
  .facility-area .search-area .input-box,
  .festival-area .search-area .input-box,
  .library-area .search-area .input-box,
  .myquestion-area .search-area .input-box,
  .myprogram-list .search-area .input-box,
  .archiving-area .search-area .input-box,
  .layer-content .search-area .input-box,
  .small-lib .search-area .input-box {
    margin-bottom: 0.5rem;
  }
  .hope-area .search-area .input-box .select,
  .favorite-area .search-area .input-box .select,
  .facility-area .search-area .input-box .select,
  .festival-area .search-area .input-box .select,
  .library-area .search-area .input-box .select,
  .myquestion-area .search-area .input-box .select,
  .myprogram-list .search-area .input-box .select,
  .archiving-area .search-area .input-box .select,
  .layer-content .search-area .input-box .select,
  .small-lib .search-area .input-box .select {
    max-width: unset;
  }
  .hope-area .search-area .input-box .input,
  .favorite-area .search-area .input-box .input,
  .facility-area .search-area .input-box .input,
  .festival-area .search-area .input-box .input,
  .library-area .search-area .input-box .input,
  .myquestion-area .search-area .input-box .input,
  .myprogram-list .search-area .input-box .input,
  .archiving-area .search-area .input-box .input,
  .layer-content .search-area .input-box .input,
  .small-lib .search-area .input-box .input {
    width: 100%;
  }
  .hope-area .search-area .input-box .input input,
  .favorite-area .search-area .input-box .input input,
  .facility-area .search-area .input-box .input input,
  .festival-area .search-area .input-box .input input,
  .library-area .search-area .input-box .input input,
  .myquestion-area .search-area .input-box .input input,
  .myprogram-list .search-area .input-box .input input,
  .archiving-area .search-area .input-box .input input,
  .layer-content .search-area .input-box .input input,
  .small-lib .search-area .input-box .input input {
    width: 100%;
  }
  .gray-text-area {
    padding: 2.4rem 1.4rem;
  }
  .gray-text-area p {
    font-size: 1.6rem;
  }
  .gray-text-area p.v2 {
    width: 100% !important;
    margin: 0 auto !important;
    text-align: left !important;
    word-break: keep-all;
  }
  .gray-text-area p strong {
    font-size: 1.8rem;
  }
  .gray-text-area p .big {
    display: inline-block;
    font-size: 2rem;
  }
}
@font-face {
  font-family: "Pretendard";
  font-weight: 900;
  font-display: swap;
  src: url("../../font/Pretendard-Black.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 800;
  font-display: swap;
  src: url("../../font/Pretendard-ExtraBold.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 700;
  font-display: swap;
  src: url("../../font/Pretendard-Bold.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 600;
  font-display: swap;
  src: url("../../font/Pretendard-SemiBold.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 500;
  font-display: swap;
  src: url("../../font/Pretendard-Medium.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 400;
  font-display: swap;
  src: url("../../font/Pretendard-Regular.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 300;
  font-display: swap;
  src: url("../../font/Pretendard-Light.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 200;
  font-display: swap;
  src: url("../../font/Pretendard-ExtraLight.woff") format("woff");
}
@font-face {
  font-family: "Pretendard";
  font-weight: 100;
  font-display: swap;
  src: url("../../font/Pretendard-Thin.woff") format("woff");
}
input[type=text],
input[type=password],
input[type=date],
select {
  width: 18rem;
  height: 4rem;
  padding: 0 1rem;
  border-radius: 0.2rem;
  border: 0.1rem solid #dadadf;
  box-sizing: border-box;
}
input[type=text]:disabled,
input[type=password]:disabled,
input[type=date]:disabled,
select:disabled {
  background: #f4f4f4;
}

input[type=text]:active,
input[type=password]:active,
select:active {
  border: 0.1rem solid #222;
}

select {
  padding-left: 1rem;
}

textarea {
  width: 100%;
  padding: 1rem;
  border-radius: 0.4rem;
  border: 0.1rem solid #dadadf;
}

.check input[type=checkbox] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
}
.check input[type=checkbox] + label {
  position: relative;
  display: inline-block;
  padding-left: 2.8rem;
  line-height: 1.4;
  font-size: 1.9rem;
  color: #4d4d4d;
  cursor: pointer;
}
.check input[type=checkbox] + label::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  width: 2rem;
  height: 2rem;
  border-radius: 0.2rem;
  background: url("../../images/icon/icon_chkbox_v2.png") no-repeat 0 0;
  background-size: cover;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
.check input[type=checkbox]:checked + label::before {
  background: url("../../images/icon/icon_chkbox_v2_active.png") no-repeat 0 0;
  background-size: cover;
}
.check input[type=checkbox]:disabled {
  background: url("../../images/icon/icon_chkbox_disabled.png") no-repeat 0 0;
}
.check.v2 input[type=checkbox] + label::before {
  background: url("../../images/icon/icon_chkbox_v2.png") no-repeat 0 0;
  background-size: cover;
}
.check.v2 input[type=checkbox]:checked + label::before {
  background: url("../../images/icon/icon_chkbox_v2_active.png") no-repeat 0 0;
  background-size: cover;
}
.check.v2 input[type=checkbox]:disabled {
  background: url("../../images/icon/icon_chkbox_v2_disabled.png") no-repeat 0 0;
}
.check:focus + label::before {
  outline: 0.1rem solid #555;
}

.radio input[type=radio], .raido input[type=radio] {
  position: absolute;
  opacity: 0;
  width: 1px;
  height: 1px;
  margin: 0;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
.radio input[type=radio] + label, .raido input[type=radio] + label {
  position: relative;
  display: inline-block;
  padding-left: 2.8rem;
  font-size: 1.9rem;
  line-height: 1.4;
  color: #4d4d4d;
}
.radio input[type=radio] + label::before, .raido input[type=radio] + label::before {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  left: 0;
  width: 2rem;
  height: 2rem;
  border-radius: 0.2rem;
  background: url("../../images/icon/icon_rdibox.png") no-repeat 0 0;
  background-size: cover;
}
.radio input[type=radio]:checked + label::before, .raido input[type=radio]:checked + label::before {
  background: url("../../images/icon/icon_rdibox_active.png") no-repeat 0 0;
  background-size: cover;
}
.radio input[type=radio]:disabled, .raido input[type=radio]:disabled {
  background: url("../../images/icon/icon_rdibox_disabled.png") no-repeat 0 0;
}
.radio input[type=radio]:focus + label::before, .raido input[type=radio]:focus + label::before {
  outline: 0.1rem solid #555;
}

.form-input {
  margin-top: 4rem;
}
.form-input > .title {
  color: #222;
  font-size: 2.7rem;
  font-weight: 600;
  line-height: 140%;
}
.form-input .align-right {
  text-align: right;
  color: #454545;
}
.form-input .align-right::before {
  content: "*";
  font-size: 1.5rem;
  color: #f4644d;
  font-weight: 400;
  line-height: 2.6rem;
  letter-spacing: -0.06rem;
}
.form-input .form-area {
  margin-top: 2rem;
  border-top: 0.2rem solid #222;
}
.form-input .form-area .join-btn {
  width: 12rem;
  height: 4rem;
  border-radius: 0.2rem;
  border: 0.1rem solid #222;
  font-weight: 500;
  color: #222;
}
.form-input .form-area .input-box {
  display: flex;
  align-items: center;
  padding: 1.5rem 0;
  border-bottom: 0.1rem solid #dadadf;
}
.form-input .form-area .input-box .title {
  width: 20rem;
  font-size: 1.9rem;
  line-height: 100%;
  color: #222;
  font-weight: 600;
}
.form-input .form-area .input-box .title.must::after {
  content: "*";
  color: #f4644d;
  margin-left: 0.6rem;
}
.form-input .form-area .input-box .title + div {
  width: calc(100% - 20rem);
  padding: 0 1.5rem;
}
.form-input .form-area .input-box .title + div.radio-area, .form-input .form-area .input-box .title + div.check-area {
  padding: 1.3rem 1.5rem;
}
.form-input .form-area .input-box .input span {
  display: inline-block;
}
.form-input .form-area .input-box .input input[type=text],
.form-input .form-area .input-box .input input[type=password] {
  width: 100%;
}
.form-input .form-area .input-box .input.btn {
  display: flex;
  flex-wrap: wrap;
  gap: 0 1rem;
}
.form-input .form-area .input-box .input.btn input {
  width: calc(100% - 13rem);
}
.form-input .form-area .input-box .input-select {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 0 0.4rem;
}
.form-input .form-area .input-box .input-select .select {
  width: 17%;
}
.form-input .form-area .input-box .input-select .select select {
  width: 100%;
}
.form-input .form-area .input-box .input-select .input {
  width: 39%;
}
.form-input .form-area .input-box .input-select .input input {
  width: 100%;
}
.form-input .form-area .input-box .input-select.email .input:first-child {
  width: 30%;
}
.form-input .form-area .input-box .input-select.email .input:nth-of-type(2) {
  width: 30%;
}
.form-input .form-area .input-box .input-select.email input[type=text] {
  width: 100%;
}
.form-input .form-area .input-box .input-select.email .select {
  width: 35.5%;
}
.form-input .form-area .input-box .input-select.email .select select {
  width: 100%;
  padding-left: 1rem;
}
.form-input .form-area .input-box .radio-area {
  display: flex;
  flex-wrap: wrap;
  gap: 0 2.4rem;
}
.form-input .form-area .input-box .address-area {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem;
}
.form-input .form-area .input-box .address-area .first-address {
  width: calc(100% - 13rem);
}
.form-input .form-area .input-box .address-area .w50 {
  width: 49.1%;
}
.form-input .form-area .input-box .address-area .w100 {
  width: 100%;
}
.form-input .form-area .input-box .input-two {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0 0.6rem;
}
.form-input .form-area .input-box .input-two input {
  width: 100%;
}
.form-input .form-area .input-box .input-two .title {
  padding: 1rem 0;
}
.form-input .form-area .input-box .file {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem;
}
.form-input .form-area .input-box .file input[type=file] {
  display: none;
}
.form-input .form-area .input-box .file .upload {
  max-width: 12rem;
}
.form-input .form-area .input-box .file .upload .file-button {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 12rem;
  height: 4rem;
  font-weight: 500;
  border: 1px solid #222;
  border-radius: 0.2rem;
  color: #222;
  cursor: pointer;
}
.form-input .form-area .input-box .file .file-info {
  position: relative;
  width: 100%;
  height: 4rem;
  border-radius: 0.4rem;
  display: none;
}
.form-input .form-area .input-box .file .file-info .upload-path {
  width: 100%;
  height: 100%;
  padding: 1.35rem 2rem 1.35rem 4.2rem;
  border: 0;
  background: #f4f4f4;
  color: #555;
  letter-spacing: -0.0016rem;
  font-weight: 500;
}
.form-input .form-area .input-box .file .file-info .file-cancel {
  display: none;
  position: absolute;
  right: 2.8rem;
  top: 50%;
  transform: translateY(-50%);
  width: 2.4rem;
  height: 2.4rem;
  background: url("../../images/icon/icon_close.png") no-repeat 0 0;
  background-size: cover;
}
.form-input .form-area .input-box .file .file-info.on:before {
  content: "";
  position: absolute;
  top: 50%;
  left: 2rem;
  transform: translateY(-50%);
  width: 1.6rem;
  height: 1.6rem;
  background: url("../../images/icon/icon_file.png") no-repeat 0 0;
  background-size: cover;
}
.form-input .form-area .input-box .cuation-text {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 1rem;
  color: #555;
}
.form-input .form-area .input-box .cuation-text span {
  display: block;
  width: 100%;
  line-height: 140%;
  font-weight: 500;
  letter-spacing: -0.016rem;
  color: #929292;
}
.form-input .form-area .input-box .cuation-text span.caution {
  color: #f4644d;
}
.form-input .form-area .input-box .cuation-text .check label {
  color: #2c2c2c;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 140%;
}
.form-input .form-area .input-box .cuation-text .check span {
  display: inline-block;
  color: #929292;
  font-weight: 400;
}
.form-input .form-area .input-box textarea {
  resize: none;
  padding: 1rem;
  box-sizing: border-box;
}
.form-input .form-area .input-box .stauts-area {
  display: flex;
  gap: 0 1rem;
}
.form-input .form-area .input-box .stauts-area span {
  min-width: 6.6rem;
  padding: 0.4rem 1rem;
  border-radius: 0.8rem;
  -webkit-border-radius: 0.8rem;
  -moz-border-radius: 0.8rem;
  -ms-border-radius: 0.8rem;
  -o-border-radius: 0.8rem;
  text-align: center;
  box-sizing: border-box;
}
.form-input .form-area .input-box .stauts-area span.blue {
  color: #fff;
  background: #1a71ea;
}
.form-input .form-area .input-box .stauts-area span.yellow {
  color: #9e6d12;
  background: rgba(158, 109, 18, 0.1);
}
.form-input .form-area .input-box .state {
  padding: 0.4rem 1rem;
  border-radius: 0.8rem;
}
.form-input .form-area .input-box .state.green {
  background: rgba(20, 135, 78, 0.1);
  color: #14874e;
}
.form-input .form-area .input-box .state.blue {
  background: rgba(26, 113, 234, 0.1);
  color: #1a71ea;
}
.form-input .form-area .input-box .state.red {
  background: rgba(219, 59, 38, 0.1);
  color: #db3b26;
}
.form-input .form-area .input-box .state.gray {
  background: rgba(53, 53, 53, 0.1);
  color: #555;
}
.form-input .form-area .input-box .state.yellow {
  background: rgba(158, 109, 18, 0.1);
  color: #9e6d12;
}
.form-input .etc {
  margin-top: 3rem;
  font-weight: 400;
  color: #555;
}
.form-input .title-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.form-input .title-area .title {
  font-size: 2.6rem;
  font-weight: 600;
  line-height: 140%;
  color: #222;
}
.form-input.only-text .form-area .input-box {
  padding: 3rem 0;
}

@media (max-width: 768px) {
  input[type=text],
  input[type=password],
  input[type=date],
  select {
    width: 100%;
  }
  .form-input .form-area .input-box {
    flex-wrap: wrap;
  }
  .form-input .form-area .input-box .title {
    display: block;
    width: 100%;
    padding: 1rem 0;
    font-size: 1.6rem;
  }
  .form-input .form-area .input-box .title + div {
    width: 100%;
    padding: 0;
  }
  .form-input .form-area .input-box .title + div.radio-area, .form-input .form-area .input-box .title + div.check-area {
    padding: 0;
  }
  .form-input .form-area .input-box .select select {
    width: 100%;
  }
  .form-input .form-area .input-box .input-select .select {
    width: 30%;
  }
  .form-input .form-area .input-box .input-select .input {
    width: 30.5%;
  }
  .form-input .form-area .input-box .input-select.email .input:first-child {
    width: 94%;
  }
  .form-input .form-area .input-box .input-select.email .input:nth-of-type(2) {
    width: 49%;
    margin-top: 1rem;
  }
  .form-input .form-area .input-box .input-select.email .select {
    width: 49%;
    margin-top: 1rem;
  }
  .form-input .form-area .input-box .address-area .w50 {
    width: 100%;
  }
  .form-input .form-area .input-box .cuation-text span {
    font-size: 1.5rem;
  }
  .form-input .form-area .input-box .file .file-info .upload-path {
    width: 100%;
  }
  .check input[type=checkbox] + label {
    font-size: 1.6rem;
  }
  .radio input[type=radio] + label {
    font-size: 1.6rem;
  }
}
.popup-wrap {
  position: fixed;
  top: 15rem;
  left: 10rem;
  width: 42rem;
  height: 42rem;
  z-index: 999;
}
.popup-wrap .content-img img {
  width: 100%;
}
.popup-wrap .button-area {
  display: flex;
  justify-content: center;
}
.popup-wrap .button-area button {
  flex: 1;
  padding: 1.6rem 0;
  color: #404040;
  font-size: 2rem;
  background: #f4f4f4;
  border-right: 0.1rem solid #dadadf;
}
.popup-wrap .button-area button:last-child {
  border: 0;
}

@media (max-width: 768px) {
  .popup-wrap {
    top: 1rem !important;
    left: 50% !important;
    transform: translateX(-50%) !important;
    width: 95% !important;
    z-index: 9999;
  }
}
.paging-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 3rem 0;
}
.paging-wrap div {
  display: flex;
  gap: 0 0.4rem;
}
.paging-wrap div button {
  width: 3.2rem;
  height: 3.2rem;
  border-radius: 50%;
  border: 0.1rem solid #dadadf;
  font-size: 0;
}
.paging-wrap div button::before {
  content: "";
  display: inline-flex;
  width: 1.2rem;
  height: 1.2rem;
}
.paging-wrap div button.first::before {
  background: url("../../images/icon/icon_paging_first.png") no-repeat;
  background-size: cover;
}
.paging-wrap div button.prev::before {
  background: url("../../images/icon/icon_paging_prev.png") no-repeat;
  background-size: cover;
}
.paging-wrap div button.next::before {
  background: url("../../images/icon/icon_paging_next.png") no-repeat;
  background-size: cover;
}
.paging-wrap div button.last::before {
  background: url("../../images/icon/icon_paging_last.png") no-repeat;
  background-size: cover;
}
.paging-wrap .main-paging {
  display: flex;
  justify-content: center;
  margin: 0 1.2rem;
}
.paging-wrap .main-paging li button {
  padding: 0 1.2rem;
  font-weight: 500;
  color: #555;
}
.paging-wrap .main-paging li.on button, .paging-wrap .main-paging li:hover button {
  color: #e60001;
}

@media (max-width: 768px) {
  .paging-wrap {
    padding: 1.5rem 0;
  }
  .paging-wrap div button {
    width: 3.2rem;
    height: 3.2rem;
  }
  .paging-wrap .main-paging {
    margin: 0 0.8rem;
  }
  .paging-wrap .main-paging li button {
    padding: 0 0.8rem;
  }
  .paging-wrap .main-paging li:nth-last-of-type(1), .paging-wrap .main-paging li:nth-last-of-type(2), .paging-wrap .main-paging li:nth-last-of-type(3), .paging-wrap .main-paging li:nth-last-of-type(4), .paging-wrap .main-paging li:nth-last-of-type(5) {
    display: none;
  }
}
.branch .paging-wrap {
  margin-top: 4rem;
}

.tab-wrap .tab-btn {
  overflow: hidden;
  display: flex;
  height: 5.2rem;
  border: 0.1rem solid #dadadf;
  border-radius: 0.8rem;
}
.tab-wrap .tab-btn button {
  flex: 1;
  border-left: 0.1rem solid #dadadf;
  font-size: 1.9rem;
  font-weight: 500;
  line-height: 140%;
}
.tab-wrap .tab-btn button:first-child {
  border-left: 0;
}
.tab-wrap .tab-btn button.on, .tab-wrap .tab-btn button:hover {
  background: #4d4d4d;
  color: #fff;
}
.tab-wrap .tab-btn.type02 {
  display: flex;
  flex-wrap: wrap;
  height: auto;
  border: 0;
}
.tab-wrap .tab-btn.type02 button {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  height: 4.6rem;
  padding: 0 1.6rem 0 1.2rem;
  border: 0;
  color: #222;
  font-weight: 500;
  font-size: 2rem;
}
.tab-wrap .tab-btn.type02 button::before {
  content: "";
  display: flex;
  width: 0.4rem;
  height: 0.4rem;
  margin: 1rem;
  border-radius: 50%;
  background-color: #000;
}
.tab-wrap .tab-btn.type02 button.on, .tab-wrap .tab-btn.type02 button:hover {
  border-radius: 0.4rem;
  background-color: #000;
  color: #fff;
  font-weight: 600;
}
.tab-wrap .tab-btn.type02 button.on::before, .tab-wrap .tab-btn.type02 button:hover::before {
  width: 2.4rem;
  height: 2.4rem;
  margin: 0;
  border-radius: 0;
  background: url("../../images/icon/icon_check.png") center/100% no-repeat;
}
.tab-wrap .tab-btn.type02 button:nth-child(1).on, .tab-wrap .tab-btn.type02 button:nth-child(1):hover {
  background: #4d4d4d;
}
.tab-wrap .tab-btn.type02 button:nth-child(2).on, .tab-wrap .tab-btn.type02 button:nth-child(2):hover {
  background: #e60001;
}
.tab-wrap .tab-btn.type02 button:nth-child(3).on, .tab-wrap .tab-btn.type02 button:nth-child(3):hover {
  background: #5d8200;
}
.tab-wrap .tab-btn.type02 button:nth-child(4).on, .tab-wrap .tab-btn.type02 button:nth-child(4):hover {
  background: #917200;
}
.tab-wrap .tab-btn.type02 button:nth-child(5).on, .tab-wrap .tab-btn.type02 button:nth-child(5):hover {
  background: #0050cc;
}
.tab-wrap .tab-btn.type02 button:nth-child(6).on, .tab-wrap .tab-btn.type02 button:nth-child(6):hover {
  background: #c75300;
}
.tab-wrap .tab-btn.type02 button:nth-child(7).on, .tab-wrap .tab-btn.type02 button:nth-child(7):hover {
  background: #da2b7d;
}
.tab-wrap .tab-btn.type02 button:nth-child(8).on, .tab-wrap .tab-btn.type02 button:nth-child(8):hover {
  background: #6430a3;
}
.tab-wrap .tab-btn.type02 button:nth-child(9).on, .tab-wrap .tab-btn.type02 button:nth-child(9):hover {
  background: #0f8448;
}
.tab-wrap .tab-btn.type02 button:nth-child(10).on, .tab-wrap .tab-btn.type02 button:nth-child(10):hover {
  background: #4d4d4d;
}
.tab-wrap .tab-btn.type03 button:nth-child(1).on .tab-wrap .tab-btn.type03 button:nth-child(1):hover {
  background: #e60001;
}
.tab-wrap .tab-btn.type03 button:nth-child(2).on .tab-wrap .tab-btn.type03 button:nth-child(2):hover {
  background: #5d8200;
}
.tab-wrap .tab-btn.type03 button:nth-child(3).on .tab-wrap .tab-btn.type03 button:nth-child(3):hover {
  background: #917200;
}
.tab-wrap .tab-btn.type03 button:nth-child(4).on .tab-wrap .tab-btn.type03 button:nth-child(4):hover {
  background: #0050cc;
}
.tab-wrap .tab-btn.type03 button:nth-child(5).on .tab-wrap .tab-btn.type03 button:nth-child(5):hover {
  background: #c75300;
}
.tab-wrap .tab-btn.type03 button:nth-child(6).on .tab-wrap .tab-btn.type03 button:nth-child(6):hover {
  background: #da2b7d;
}
.tab-wrap .tab-btn.type03 button:nth-child(7).on .tab-wrap .tab-btn.type03 button:nth-child(7):hover {
  background: #6430a3;
}
.tab-wrap .tab-btn.type03 button:nth-child(8).on .tab-wrap .tab-btn.type03 button:nth-child(8):hover {
  background: #0f8448;
}
.tab-wrap .view-area .view {
  display: none;
  margin-top: 3rem;
}
.tab-wrap .view-area .view.on {
  display: block;
}

.ja .tab-wrap .tab-btn button.on, .ja .tab-wrap .tab-btn button:hover {
  background: #e60001;
}

.ss .tab-wrap .tab-btn button.on, .ss .tab-wrap .tab-btn button:hover {
  background: #5d8200;
}

.sn .tab-wrap .tab-btn button.on, .sn .tab-wrap .tab-btn button:hover {
  background: #917200;
}

.gi .tab-wrap .tab-btn button.on, .gi .tab-wrap .tab-btn button:hover {
  background: #0050cc;
}

.hg .tab-wrap .tab-btn button.on, .hg .tab-wrap .tab-btn button:hover {
  background: #c75300;
}

.as .tab-wrap .tab-btn button.on, .as .tab-wrap .tab-btn button:hover {
  background: #da2b7d;
}

.ch .tab-wrap .tab-btn button.on, .ch .tab-wrap .tab-btn button:hover {
  background: #6430a3;
}

.dc .tab-wrap .tab-btn button.on, .dc .tab-wrap .tab-btn button:hover {
  background: #0f8448;
}

@media (max-width: 768px) {
  .tab-wrap .tab-btn {
    flex-wrap: wrap;
    height: auto;
    border-bottom: 0;
  }
  .tab-wrap .tab-btn button {
    flex: auto;
    width: 50%;
    padding: 1.1rem 0;
    border-bottom: 0.1rem solid #dadadf;
    font-size: 1.6rem;
  }
  .tab-wrap .tab-btn.type02 button {
    font-size: 1.6rem;
    justify-content: center;
  }
}
.branch .tab-wrap {
  margin-top: 4rem;
}

@media (max-width: 768px) {
  .tab-wrap .tab-btn button:nth-child(2n-1) {
    border-left: 0;
  }
  .tab-wrap .tab-btn.w100 button:first-child {
    width: 100%;
  }
  .tab-wrap .tab-btn.w100 button:nth-child(2n) {
    border-left: 0;
    border-right: 0.1rem solid #dadadf;
  }
  .tab-wrap .tab-btn.type02 button {
    width: 33.333%;
  }
  .tab-wrap .view-area .view {
    margin-top: 1rem;
  }
}
.floating-wrap {
  overflow: hidden;
  width: 8rem;
  border: 0.1rem solid #dadadf;
  border-radius: 1rem;
  box-shadow: 0 0.6rem 1rem 0 rgba(0, 0, 0, 0.05);
}
.floating-wrap .menu-list .title {
  color: #ff9fa5;
  font-size: 1.5rem;
  font-weight: 700;
  line-height: 110%;
  letter-spacing: -0.003rem;
}
.floating-wrap .menu-list .title::before {
  content: "";
  display: inline-flex;
}

.bradscrum-area {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  padding-bottom: 3.7rem;
  border-bottom: 0.1rem solid #dadadf;
}
.bradscrum-area > p {
  font-size: 3.6rem;
  font-weight: 700;
  color: #222;
}
.bradscrum-area .top-navi {
  display: flex;
  align-items: baseline;
}
.bradscrum-area .top-navi li {
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 1.8rem;
}
.bradscrum-area .top-navi li::after {
  content: "";
  display: inline-flex;
  width: 0.4rem;
  height: 0.8rem;
  margin: 0 1rem;
  background: url("../../images/icon/icon_left_arrow.png") no-repeat;
  background-size: 100%;
}
.bradscrum-area .top-navi li.home {
  font-size: 0;
  display: flex;
  align-items: center;
}
.bradscrum-area .top-navi li.home::before {
  content: "";
  display: inline-flex;
  width: 1.3rem;
  height: 1.4rem;
  background: url("../../images/icon/icon_home.png") no-repeat;
  background-size: 100%;
}
.bradscrum-area .top-navi li:last-child {
  font-weight: 700;
  color: #222;
}
.bradscrum-area .top-navi li:last-child::after {
  display: none;
}

@media (max-width: 1024px) {
  .bradscrum-area {
    display: none;
  }
}
.accordion-area .accordion-title {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 2rem 0;
  border-bottom: 0.1rem solid #dadadf;
  cursor: pointer;
}
.accordion-area .accordion-title span, .accordion-area .accordion-title label, .accordion-area .accordion-title button {
  font-weight: 600;
  font-size: 2rem;
  color: #555;
  vertical-align: baseline;
}
.accordion-area .accordion-title .red {
  color: #e60001;
}
.accordion-area .accordion-title .btn::after {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 1.1rem;
  background: url("../../images/icon/icon_down_arrow.png") no-repeat;
  background-size: cover;
}
.accordion-area .accordion-title.on .btn::after {
  transform: rotate(180deg);
}
.accordion-area .accordion-content {
  display: none;
  overflow: auto;
  height: 20rem;
  padding: 1.4rem;
  background: #f4f4f4;
}
.accordion-area .accordion-content p {
  line-height: 180%;
  letter-spacing: -0.028rem;
  font-size: 1.9rem;
  font-weight: 500;
  color: #555;
}
.accordion-area .accordion-content .title {
  font-weight: 600;
  text-align: left;
}
.accordion-area .accordion-content.on {
  display: block;
}
.accordion-area .accordion-content.auto-height {
  height: auto;
}
.accordion-area .accordion-content .table-area th, .accordion-area .accordion-content .table-area td {
  padding: 0.6rem 1rem;
  border-right: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  color: #222;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.016rem;
  font-size: 1.6rem;
}
.accordion-area .accordion-content .table-area th {
  background: #ccc;
}

@media (max-width: 768px) {
  .accordion-area .accordion-title span, .accordion-area .accordion-title label {
    font-size: 1.6rem;
  }
  .accordion-area .accordion-content p {
    font-size: 1.4rem;
  }
}
.quickbar-wrap {
  position: fixed;
  top: 40%;
  right: 8.55rem;
  display: flex;
  flex-direction: column;
  text-align: center;
  z-index: 999;
  transform: translateY(-50%);
}
.quickbar-wrap .menu-list {
  overflow: hidden;
  width: 9rem;
  border: 0.1rem solid #dadadf;
  box-shadow: 0 0.6rem 1rem 0 rgba(0, 0, 0, 0.05);
  border-top-left-radius: 1rem;
  border-top-right-radius: 1rem;
}
.quickbar-wrap .menu-list .title {
  display: flex;
  padding: 1.4rem 1.2rem;
  background: #404040;
  cursor: pointer;
  text-align: center;
}
.quickbar-wrap .menu-list .title span {
  display: inline-block;
  color: #ff9fa5;
  font-size: 1.7rem;
  font-weight: 600;
  line-height: 110%;
  letter-spacing: -0.034rem;
}
.quickbar-wrap .menu-list .title span > span {
  padding-left: 1rem;
  margin-bottom: 0.4rem;
}
.quickbar-wrap .menu-list .title:before {
  content: "";
  position: absolute;
  left: 1rem;
  top: 1rem;
  display: inline-flex;
  width: 2.8rem;
  height: 2.2rem;
  background: url("../../images/icon/icon_quick.png") no-repeat 0 0;
  background-size: cover;
}
.quickbar-wrap .menu-list ul li {
  overflow: hidden;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem 0.8rem;
  min-height: 6rem;
  box-sizing: border-box;
  text-align: center;
  border-bottom: 0.1rem solid #dadadf;
  line-height: 110%;
  background: #fff;
}
.quickbar-wrap .menu-list ul li:last-child {
  border-bottom: 0;
}
.quickbar-wrap .up {
  width: 4.8rem;
  height: 4.8rem;
  margin: 1.6rem auto 0;
  border-radius: 50%;
  background: #404040;
}
.quickbar-wrap .up:before {
  content: "";
  display: inline-flex;
  width: 2.4rem;
  height: 2.4rem;
  background: url("../../images/icon/icon_up_arrow.png") no-repeat 0 0;
  background-size: cover;
}
.quickbar-wrap:after {
  content: "";
  position: absolute;
  bottom: -11rem;
  left: 50%;
  transform: translateX(-50%);
  display: inline-flex;
  width: 10rem;
  height: 12rem;
  background: url("../../images/icon/chart-gd.gif") no-repeat 0 0;
  background-size: cover;
}
.quickbar-wrap .tooltip-area {
  position: absolute;
  bottom: -8rem;
  left: -42.5rem;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  width: 40rem;
  padding: 0.7rem 1.5rem;
  border-radius: 3rem;
  line-height: 140%;
  text-align: left;
  font-size: 1.2rem;
  letter-spacing: -0.0247rem;
  background: #FF7881;
  box-shadow: 0 4.624px 7.707px 0 rgba(0, 0, 0, 0.05);
  box-sizing: border-box;
}
.quickbar-wrap .tooltip-area span {
  display: inline-block;
  color: #fff;
}
.quickbar-wrap .tooltip-area .tooltip-close::before {
  content: "";
  display: inline-flex;
  width: 1.5rem;
  height: 1.5rem;
  margin-left: 0.6rem;
  background: url("../../images/icon/tooltip-close.png") no-repeat;
  background-size: cover;
}
.quickbar-wrap .tooltip-area::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -1.5rem;
  border-bottom: 1rem solid transparent;
  border-top: 1rem solid transparent;
  border-left: 1rem solid #FF7881;
  border-right: 1rem solid transparent;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}

@media (max-width: 1800px) {
  .quickbar-wrap {
    display: none;
  }
}
.layer-wrap {
  position: fixed;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 9999;
}
.layer-wrap .layer-area {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 96rem;
  transform: translate(-50%, -50%);
  background: #fff;
}
.layer-wrap .layer-area .title-area {
  display: flex;
  justify-content: space-between;
  padding: 1.4rem 1.6rem;
  background: #404040;
}
.layer-wrap .layer-area .title-area .title {
  color: #fff;
  font-size: 2.2rem;
  font-weight: 600;
  line-height: 140%;
}
.layer-wrap .layer-area .title-area .close:before {
  content: "";
  display: inline-flex;
  width: 2.2rem;
  height: 2.2rem;
  background: url(../../images/icon/icon_layer_close.png) no-repeat 0 0;
  background-size: cover;
}
.layer-wrap .layer-area .layer-content {
  padding: 2.4rem;
  box-sizing: border-box;
}
.layer-wrap .layer-area .layer-content .title {
  color: #222;
  font-size: 1.8rem;
  font-weight: 500;
  margin-bottom: 0.5rem;
}
.layer-wrap .layer-area .layer-content .table-wrap {
  margin-top: 0;
}
.layer-wrap .layer-area .layer-content .table-wrap ul li {
  line-height: 140%;
}
.layer-wrap .layer-area .layer-content > p {
  color: #222;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.016rem;
}
.layer-wrap .layer-area .layer-content > p > span {
  font-weight: 700;
}
.layer-wrap .layer-area .layer-content .etc-area {
  margin-top: 1rem;
}
.layer-wrap .layer-area .layer-content .etc-area .title {
  color: #222;
  font-weight: 600;
}
.layer-wrap .layer-area .layer-content .etc-area ul {
  margin-top: 0.5rem;
}
.layer-wrap .layer-area .layer-content .etc-area ul li {
  line-height: 140%;
  padding-left: 1rem;
}
.layer-wrap .layer-area .layer-content .etc-area ul li.point {
  color: #e60001;
}
.layer-wrap .layer-area .layer-content .common-table-wrap .table-content {
  overflow: auto;
  height: 50rem;
  margin-top: 2rem;
  border-bottom: 0.1rem solid #dadadf;
}
.layer-wrap .layer-area .layer-content .common-table-wrap .table-content .table-box {
  display: flex;
  padding: 1.5rem 2rem;
}
.layer-wrap .layer-area .layer-content .common-table-wrap .table-content .table-box .book-thumbnail {
  max-width: 8rem;
  max-height: 11.9rem;
}
.layer-wrap .layer-area .layer-content .common-table-wrap .table-content .table-box .book-thumbnail img {
  width: 100%;
  height: 100%;
}
.layer-wrap .layer-area .layer-content .common-table-wrap .table-content .table-box .info-wrap {
  margin-left: 2rem;
}
.layer-wrap .layer-area .layer-content .common-table-wrap .table-content .table-box:last-child {
  border-bottom: 0;
}
.layer-wrap .layer-area.small {
  width: 80rem;
}
.layer-wrap .layer-area.sp0 .layer-content {
  padding: 2rem;
}
.layer-wrap .layer-area.sp0 .layer-content .table-wrap table tbody tr td {
  padding: 0.5rem;
}
.layer-wrap .btn-wrap {
  margin-top: 2.4rem;
}
.layer-wrap .common-table-wrap .table-content .table-box {
  position: relative;
}
.layer-wrap .common-table-wrap .table-content .table-box .book-name {
  width: 100%;
}
.layer-wrap .common-table-wrap .table-content .table-box .btn-wrap .btn {
  top: 1rem;
  right: 2rem;
  transform: unset;
}
.layer-wrap .common-table-wrap .table-content .table-box .etc-info ul {
  gap: 0.5rem 1rem;
}
.layer-wrap .table-wrap {
  margin-top: 2.4rem;
}
.layer-wrap .table-wrap table {
  border-top: 0.1rem solid #dadadf;
}
.layer-wrap .table-wrap table tr {
  border-bottom: 0.1rem solid #dadadf;
}
.layer-wrap .table-wrap table thead {
  background: #f4f4f4;
}
.layer-wrap .table-wrap table thead th {
  padding: 0.6rem 0;
  color: #222;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.016rem;
}
.layer-wrap .table-wrap table tbody tr td {
  padding: 1.1rem 2rem;
}
.layer-wrap .table-wrap table tbody tr td:first-child {
  text-align: center;
  vertical-align: middle;
  border-right: 0.1rem solid #dadadf;
}
.layer-wrap .table-wrap table tbody tr td:nth-of-type(2) {
  padding-left: 1.4rem;
}
.layer-wrap .table-wrap table tbody tr td .select-overlay {
  padding: 1.4rem;
  margin-top: 1rem;
  border-radius: 0.4rem;
  border: 0.1rem solid #dadadf;
}
.layer-wrap .table-wrap table tbody tr td .select-overlay .overlay-title {
  padding-bottom: 1rem;
  border-bottom: 0.1rem solid #dadadf;
  color: #222;
  font-weight: 600;
  line-height: 100%;
  letter-spacing: -0.016rem;
}
.layer-wrap .table-wrap table tbody tr td .select-overlay ul li {
  color: #555;
  margin-top: 1rem;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 100%;
  letter-spacing: -0.015rem;
}
.layer-wrap .table-wrap table tbody tr td .info {
  margin-top: 1rem;
}
.layer-wrap .table-wrap .input {
  width: 100%;
}
.layer-wrap .table-wrap .input input {
  width: 100%;
}
.layer-wrap .table-wrap .tel-area {
  display: flex;
  align-items: center;
  gap: 0 0.6rem;
}
.layer-wrap .table-wrap .tel-area .select {
  width: 10rem;
}
.layer-wrap .table-wrap .tel-area .select select {
  max-width: 100%;
}
.layer-wrap .table-wrap .tel-area .input {
  width: 10rem;
}
.layer-wrap .table-wrap .tel-area .input select {
  max-width: 100%;
}
.layer-wrap .table-wrap .check-area {
  display: flex;
  align-items: center;
  gap: 0 1.6rem;
}
.layer-wrap .table-wrap .check-area .info {
  margin-top: 0;
}
.layer-wrap .table-wrap .check-area .input {
  width: calc(100% - 7rem);
}
.layer-wrap .table-wrap .check-area + .check-area {
  margin-top: 1rem;
}
.layer-wrap .table-wrap .date-select-area {
  display: flex;
  gap: 0 1rem;
}
.layer-wrap .table-wrap .date-select-area button {
  width: 6rem;
  padding: 1rem 0;
  border: 0.1rem solid #222;
  color: #222;
}
.layer-wrap .table-wrap .result-area .result-box {
  position: relative;
  padding: 1.1rem 2rem;
  margin-top: 1rem;
  background: #f4f4f4;
}
.layer-wrap .table-wrap .result-area .result-box button {
  position: absolute;
  width: 2.4rem;
  height: 2.4rem;
  right: 2rem;
  top: 50%;
}
.layer-wrap .table-wrap .result-area .result-box button::before {
  content: "";
  display: inline-flex;
  width: 2.4rem;
  height: 2.4rem;
  transform: translateY(-50%);
  background: url("../../images/icon/icon_close.png") no-repeat;
  background-size: cover;
}
.layer-wrap .table-wrap .result-area .result-box span {
  color: #555;
}
.layer-wrap .table-wrap textarea {
  resize: none;
}

@media (max-width: 1024px) {
  .layer-wrap .layer-area, .layer-wrap .layer-area.small {
    overflow: hidden;
    width: 95%;
  }
  .layer-wrap .layer-area .layer-content, .layer-wrap .layer-area.small .layer-content {
    overflow: auto;
    height: 50rem;
  }
  .layer-wrap table tbody tr td:first-child {
    width: 12rem;
  }
}
@media (max-width: 768px) {
  .layer-wrap .layer-area .layer-content .common-table-wrap .table-content .table-box {
    flex-wrap: wrap;
  }
  .layer-wrap .layer-area .layer-content .common-table-wrap .table-content .table-box .info-wrap {
    margin-left: 0;
  }
  .layer-wrap .layer-area .layer-content .common-table-wrap .table-content .table-box .book-thumbnail {
    margin: 0 auto;
  }
  .layer-wrap .layer-area .layer-content .common-table-wrap .btn-wrap {
    margin-top: 1rem;
  }
  .layer-wrap .layer-area .layer-content .common-table-wrap .btn-wrap .btn {
    min-width: unset;
    width: 100%;
  }
}
.footer-wrap {
  padding: 3rem 0;
  background: #333;
}
.footer-wrap footer .container {
  padding: 0 3rem;
  box-sizing: border-box;
}
.footer-wrap footer .container .top {
  display: flex;
  align-items: center;
  gap: 0 7.2rem;
}
.footer-wrap footer .container .top .logo {
  font-size: 0;
}
.footer-wrap footer .container .top .logo::before {
  content: "";
  display: inline-flex;
  width: 24.1rem;
  height: 4rem;
  background: url("../../images/visual/logo_gangdong_footer.png") center/cover no-repeat;
}
.footer-wrap footer .container .top .link-area {
  display: flex;
  gap: 0 4rem;
}
.footer-wrap footer .container .top .link-area a {
  font-size: 1.5rem;
  font-weight: 500;
  color: #fff;
}
.footer-wrap footer .container .top .link-area a.bold {
  font-weight: 700;
  color: #ffe1bd;
}
.footer-wrap footer .container .telnumber-wrap {
  margin-top: 5.1rem;
}
.footer-wrap footer .container .telnumber-wrap span {
  display: inline-block;
  font-size: 1.4rem;
  color: #9a9a9a;
  font-weight: 500;
}
.footer-wrap footer .container .telnumber-wrap span.name {
  width: 6.4rem;
  color: #fff;
  font-weight: 700;
}
.footer-wrap footer .container .telnumber-wrap span.title {
  padding-left: 1rem;
  width: 26rem;
}
.footer-wrap footer .container .telnumber-wrap span.tel {
  padding-left: 2rem;
}
.footer-wrap footer .container .telnumber-wrap p {
  display: flex;
  width: 100%;
}
.footer-wrap footer .container .telnumber-wrap p span.title {
  width: calc(100% - 10rem);
  margin-top: -0.5rem;
  line-height: 160%;
}
.footer-wrap footer .container .telnumber-wrap .sub-library {
  display: flex;
  justify-content: space-between;
}
.footer-wrap footer .container .telnumber-wrap .sub-library > ul {
  width: 48%;
}
.footer-wrap footer .container .telnumber-wrap .sub-library > ul li {
  display: flex;
  margin-top: 0.8rem;
}
.footer-wrap footer .container .copyright {
  margin-top: 3rem;
  color: #555;
  font-size: 1.3rem;
  font-weight: 400;
  line-height: 140%;
}
.footer-wrap footer .total-address {
  margin-top: 0.8rem;
}
.footer-wrap footer .total-address p {
  font-size: 1.4rem;
  color: #9a9a9a;
  font-weight: 500;
  line-height: 140%;
}
.footer-wrap footer .total-address p span {
  display: inline-block;
  font-size: 1.4rem;
}
.footer-wrap footer .total-address p.text {
  display: inline-block;
}

@media (max-width: 1024px) {
  .footer-wrap {
    padding: 4rem 2rem;
  }
  .footer-wrap footer .container {
    padding: 0;
  }
  .footer-wrap footer .container .telnumber-wrap span.name {
    width: 4rem;
  }
  .footer-wrap footer .container .telnumber-wrap .sub-library {
    justify-content: flex-start;
  }
  .footer-wrap footer .container .telnumber-wrap .sub-library > ul {
    width: 29rem;
  }
  .footer-wrap footer .container .telnumber-wrap .sub-library > ul li {
    flex-wrap: wrap;
  }
  .footer-wrap footer .container .telnumber-wrap .sub-library > ul li span {
    line-height: 140%;
  }
  .footer-wrap footer .container .telnumber-wrap .sub-library > ul li span.title {
    width: auto;
  }
  .footer-wrap footer .container .telnumber-wrap .sub-library > ul li span.name {
    width: 4rem;
  }
  .footer-wrap footer .container .telnumber-wrap .sub-library > ul li span.tel {
    width: 100%;
    padding-left: 5rem;
  }
  .footer-wrap footer .container .telnumber-wrap .sub-library > ul:first-child {
    margin-right: 19rem;
  }
}
@media (max-width: 768px) {
  .footer-wrap {
    padding: 3rem 2rem;
  }
  .footer-wrap footer .container .top {
    display: block;
  }
  .footer-wrap footer .container .top .link-area {
    margin-top: 2rem;
  }
  .footer-wrap footer .container .telnumber-wrap {
    margin-top: 3rem;
  }
  .footer-wrap footer .container .telnumber-wrap .sub-library {
    display: block;
  }
  .footer-wrap footer .total-address p text {
    display: block;
  }
}
.header-wrap {
  position: relative;
  box-shadow: 0 0.6rem 1rem 0 rgba(0, 0, 0, 0.05);
  z-index: 999;
}
.header-wrap .top-nav {
  height: 4.4rem;
  border-bottom: 0.1rem solid #dadadf;
  box-sizing: border-box;
}
.header-wrap .top-nav .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  box-sizing: border-box;
}
.header-wrap .top-nav .container .top-library-wrap {
  display: flex;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link {
  display: flex;
  align-items: center;
  justify-content: flex-start;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link li a {
  font-size: 2rem;
  padding: 0.9rem 1.75rem;
  color: #555;
  font-weight: 500;
  box-sizing: border-box;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link li.on a, .header-wrap .top-nav .container .top-library-wrap .lib-link li:hover a {
  background: #404040;
  color: #fff;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(2).on a, .header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(2):hover a {
  background: #e60001;
  color: #fff;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(3).on a, .header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(3):hover a {
  background: #5d8200;
  color: #fff;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(4).on a, .header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(4):hover a {
  background: #917200;
  color: #fff;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(5).on a, .header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(5):hover a {
  background: #0050cc;
  color: #fff;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(6).on a, .header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(6):hover a {
  background: #c75300;
  color: #fff;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(7).on a, .header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(7):hover a {
  background: #da2b7d;
  color: #fff;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link + .lib-link li:nth-child(1).on a, .header-wrap .top-nav .container .top-library-wrap .lib-link + .lib-link li:nth-child(1):hover a {
  background: #da2b7d;
  color: #fff;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(8).on a, .header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(8):hover a {
  background: #6430a3;
  color: #fff;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link + .lib-link li:nth-child(2).on a, .header-wrap .top-nav .container .top-library-wrap .lib-link + .lib-link li:nth-child(2):hover a {
  background: #6430a3;
  color: #fff;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(9).on a, .header-wrap .top-nav .container .top-library-wrap .lib-link:first-of-type li:nth-child(9):hover a {
  background: #0f8448;
  color: #fff;
}
.header-wrap .top-nav .container .top-library-wrap .lib-link + .lib-link li:nth-child(3).on a, .header-wrap .top-nav .container .top-library-wrap .lib-link + .lib-link li:nth-child(3):hover a {
  background: #0f8448;
  color: #fff;
}
.header-wrap .top-nav .container .sns-link {
  display: flex;
  align-items: center;
}
.header-wrap .top-nav .container .sns-link .flex-wrap {
  display: flex;
}
.header-wrap .top-nav .container .sns-link .flex-wrap > a {
  color: #222;
  font-size: 1.8rem;
  font-weight: 400;
  letter-spacing: -0.0021rem;
}
.header-wrap .top-nav .container .sns-link .flex-wrap .login-area {
  position: relative;
  display: flex;
  gap: 0 1.2rem;
  padding-left: 2.4rem;
}
.header-wrap .top-nav .container .sns-link .flex-wrap .login-area::before {
  content: "";
  position: absolute;
  left: 1.2rem;
  top: 50%;
  width: 0.1rem;
  height: 1rem;
  background: #dadadf;
  transform: translateY(-50%);
}
.header-wrap .top-nav .container .sns-link .flex-wrap .login-area > a {
  color: #555;
  font-size: 1.8rem;
  font-weight: 400;
  letter-spacing: -0.0021rem;
}
.header-wrap .top-nav .container .sns-link .sns-area {
  display: flex;
  gap: 0 0.4rem;
  align-items: center;
  margin-left: 1.2rem;
}
.header-wrap .top-nav .container .sns-link .sns-area a {
  font-size: 0;
}
.header-wrap .top-nav .container .sns-link .sns-area a::before {
  content: "";
  display: inline-flex;
  width: 2.4rem;
  height: 2.4rem;
}
.header-wrap .top-nav .container .sns-link .sns-area a.insta::before {
  background: url("../../images/icon/icon_insta.png") center/cover no-repeat;
}
.header-wrap .top-nav .container .sns-link .sns-area a.blog::before {
  background: url("../../images/icon/icon_blog.png") center/cover no-repeat;
}
.header-wrap .top-nav .container .sns-link .sns-area a.kakao::before {
  background: url("../../images/icon/icon_kakaoch.png") center/cover no-repeat;
}
.header-wrap header {
  position: relative;
  height: 7.6rem;
}
.header-wrap header .menu-wrap {
  height: 100%;
}
.header-wrap header .menu-wrap .container {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  box-sizing: border-box;
}
.header-wrap header .menu-wrap .container .logo a {
  font-size: 0;
}
.header-wrap header .menu-wrap .container .logo a::before {
  content: "";
  display: inline-flex;
  width: 28.9rem;
  height: 4.8rem;
  background: url("../../images/visual/logo_gangdong_v1.png") center/cover no-repeat;
}
.header-wrap header .menu-wrap .container .mobile-menu-wrap {
  display: none;
  position: absolute;
  right: 2rem;
  z-index: 99;
}
.header-wrap header .menu-wrap .container .mobile-menu-wrap .mobile-member {
  display: none;
  align-items: center;
  padding: 0.75rem 0.5rem;
  margin-right: 1rem;
  border: 0.1rem solid #dadadf;
  box-sizing: border-box;
}
.header-wrap header .menu-wrap .container .mobile-menu-wrap .mobile-member button {
  font-size: 1.4rem;
  color: #222;
  font-weight: 500;
}
.header-wrap header .menu-wrap .container .mobile-menu-wrap .mb-button .mobile-btn::before {
  content: "";
  display: inline-flex;
  width: 4rem;
  height: 4rem;
  background: url(../../images/icon/icon_hambarger.png) no-repeat 0 0;
  background-size: cover;
}
.header-wrap header .menu-wrap .container .menu-list {
  height: 100%;
}
.header-wrap header .menu-wrap .container .menu-list > ul {
  display: flex;
  height: 100%;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu {
  height: 100%;
  padding-left: 2.4rem;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu a {
  position: relative;
  display: flex;
  align-items: center;
  width: 100%;
  height: 100%;
  font-size: 2.3rem;
  font-weight: 600;
  color: #222;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu a::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 0;
  height: 4px;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu a:hover::after {
  left: 0;
  width: 100%;
  transition: 0.5s;
  background: #e60001;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap {
  display: none;
  position: absolute;
  right: 0;
  top: 7.6rem;
  width: 100%;
  height: 4.8rem;
  background: #f2f4f6;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap > ul {
  position: absolute;
  top: 0;
  left: 57.5%;
  transform: translateX(-50%);
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 102.5rem;
  height: 100%;
  width: 100%;
  margin: 0 auto;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap > ul > li {
  padding: 0 1.2rem;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap > ul > li > a {
  font-size: 1.7rem;
  font-weight: 400;
  color: #555;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap.right > ul {
  justify-content: flex-end;
  left: 59.5%;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap .mobile-menu {
  display: none;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu.on > a::after {
  left: -10%;
  width: 120%;
  background: #e60001;
  transition: none;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu.on .sub-menu-wrap, .header-wrap header .menu-wrap .container .menu-list > ul .title-menu:hover .sub-menu-wrap {
  display: block;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu.on .sub-menu-wrap > ul > li.on > a, .header-wrap header .menu-wrap .container .menu-list > ul .title-menu.on .sub-menu-wrap > ul > li:hover > a, .header-wrap header .menu-wrap .container .menu-list > ul .title-menu:hover .sub-menu-wrap > ul > li.on > a, .header-wrap header .menu-wrap .container .menu-list > ul .title-menu:hover .sub-menu-wrap > ul > li:hover > a {
  color: #404040;
}
.header-wrap header .menu-wrap .container .menu-list > ul .title-menu.on .sub-menu-wrap > ul > li.on > a::after, .header-wrap header .menu-wrap .container .menu-list > ul .title-menu.on .sub-menu-wrap > ul > li:hover > a::after, .header-wrap header .menu-wrap .container .menu-list > ul .title-menu:hover .sub-menu-wrap > ul > li.on > a::after, .header-wrap header .menu-wrap .container .menu-list > ul .title-menu:hover .sub-menu-wrap > ul > li:hover > a::after {
  display: none;
}
.header-wrap.on {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  background: #fff;
}

@media (max-width: 1300px) {
  .header-wrap .top-nav .container .top-library-wrap .lib-link li a {
    font-size: 1.8rem;
    padding: 1.1rem 1.2rem;
  }
  .header-wrap .top-nav .container .sns-link > a {
    font-size: 1.6rem;
  }
  .header-wrap .top-nav .container .sns-link .etc-area .login-area > a {
    font-size: 1.6rem;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu {
    padding: 0 1rem;
    margin: 0;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu a {
    font-size: 2rem;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap ul {
    left: 50%;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap.right ul {
    left: 50%;
  }
}
@media (max-width: 1024px) {
  .header-wrap {
    position: relative;
    z-index: 999;
  }
  .header-wrap .top-nav {
    height: 4.2rem;
  }
  .header-wrap .top-nav .container {
    display: block;
    width: 100%;
    padding: 0;
  }
  .header-wrap .top-nav .container .top-library-wrap {
    height: 100%;
  }
  .header-wrap .top-nav .container .top-library-wrap .lib-link {
    width: 100%;
    justify-content: space-between;
  }
  .header-wrap .top-nav .container .top-library-wrap .lib-link li {
    flex: 1;
    text-align: center;
  }
  .header-wrap .top-nav .container .top-library-wrap .lib-link li a {
    display: block;
    padding: 1.2rem 0;
  }
  .header-wrap .top-nav .container .sns-link {
    position: relative;
    align-items: center;
    width: 100%;
    height: 7rem;
    padding: 0 2rem;
    background: #f4f4f4;
    z-index: 10;
    box-sizing: border-box;
    display: none;
  }
  .header-wrap .top-nav .container .sns-link > a {
    display: inline-block;
    white-space: nowrap;
  }
  .header-wrap .top-nav .container .sns-link.on {
    display: flex;
    justify-content: space-between;
  }
  .header-wrap .top-nav .container .sns-link.on .flex-wrap {
    flex-wrap: wrap;
    flex-direction: column;
    justify-content: center;
  }
  .header-wrap .top-nav .container .sns-link.on .flex-wrap a {
    display: block;
    font-size: 1.4rem;
  }
  .header-wrap .top-nav .container .sns-link.on .flex-wrap .login-area {
    padding-left: 0;
    margin-top: 0.5rem;
  }
  .header-wrap .top-nav .container .sns-link.on .flex-wrap .login-area::before {
    display: none;
  }
  .header-wrap .top-nav .container .sns-link.on .flex-wrap .login-area a {
    font-size: 1.4rem;
  }
  .header-wrap .top-nav .container .sns-link.on .sns-area {
    position: relative;
    right: 5rem;
    margin-left: 0;
  }
  .header-wrap header {
    height: 7rem;
    padding: 1.5rem 0;
    box-sizing: border-box;
    border-bottom: 0.1rem solid #dadadf;
  }
  .header-wrap header .menu-wrap .container {
    position: relative;
  }
  .header-wrap header .menu-wrap .container .logo a::before {
    width: 24rem;
    height: 4rem;
  }
  .header-wrap header .menu-wrap .container .mobile-menu-wrap {
    display: flex;
  }
  .header-wrap header .menu-wrap .container .mobile-menu-wrap .mobile-member {
    display: none;
  }
  .header-wrap header .menu-wrap .container .mobile-menu-wrap .mb-button button.close::before {
    background: url(../../images/icon/icon_menu_close.png) no-repeat 0 0;
    background-size: cover;
  }
  .header-wrap header .menu-wrap .container .menu-list {
    display: none;
    position: fixed;
    top: 11rem;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100%;
    height: calc(100vh - 12rem);
    z-index: 100;
    background: #fff;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul {
    width: 50%;
    display: block;
    height: 100vh;
    background: #f4f4f4;
    border-right: 0.1rem solid #ccc;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu {
    display: flex;
    align-items: center;
    height: 6rem;
    border-bottom: 0.1rem solid #dadadf;
    margin: 0;
    padding: 0 2.5rem;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu a {
    display: block;
    width: auto;
    height: auto;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu a:hover::after, .header-wrap header .menu-wrap .container .menu-list > ul .title-menu a.on::after {
    display: none;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap {
    top: 0;
    left: auto;
    right: 0;
    width: 50%;
    max-width: unset;
    height: 100vh;
    padding: 1.6rem 0;
    background: #fff;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap > ul {
    display: block;
    margin-top: 1.6rem;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap > ul > li {
    position: relative;
    padding: 0;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap > ul > li > a {
    display: inline-block;
    padding: 1rem 2rem;
    font-size: 1.6rem;
    color: #222;
    font-weight: 500;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap > ul > li:hover::after {
    content: "";
    position: absolute;
    top: 0;
    right: 2rem;
    margin-top: 1rem;
    width: 0.8rem;
    height: 1.4rem;
    background: url("../../images/icon/icon_lnb_active.png") no-repeat 0 0;
    background-size: cover;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap .mobile-menu {
    display: none;
    margin-top: 1rem;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap .mobile-menu > ul > li a {
    padding: 0.8rem 0 0.8rem 2rem;
    font-size: 1.5rem;
    font-weight: 400;
    color: #555;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu .sub-menu-wrap .mobile-menu > ul > li a:hover {
    background: #f4f4f4;
    color: #e60001;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu:hover, .header-wrap header .menu-wrap .container .menu-list > ul .title-menu.on {
    border-right: 0;
    background: #fff;
    margin-bottom: -0.3rem;
    border-bottom: 0.3rem solid #e60001;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu:hover > a::after, .header-wrap header .menu-wrap .container .menu-list > ul .title-menu.on > a::after {
    display: none;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul::after {
    content: "";
    position: absolute;
    right: 0;
    top: 0;
    width: 0.1rem;
    height: 100vh;
    background: #dadadf;
  }
  .header-wrap header .menu-wrap .container .menu-list.on {
    display: block;
  }
  .header-wrap.on {
    height: 100vh;
    height: auto;
    box-shadow: none;
  }
}
@media (max-width: 768px) {
  .header-wrap .top-nav {
    height: 8.5rem;
  }
  .header-wrap .top-nav .container .top-library-wrap {
    display: block;
    height: 100%;
  }
  .header-wrap .top-nav .container .top-library-wrap .lib-link {
    flex-wrap: wrap;
  }
  .header-wrap .top-nav .container .top-library-wrap .lib-link:first-child {
    border-bottom: 0.1rem solid #dadadf;
  }
  .header-wrap .top-nav .container .etc-area {
    flex-wrap: wrap;
  }
  .header-wrap .top-nav .container .etc-area .sns-link {
    padding: 0 1rem;
  }
  .header-wrap .top-nav .container .etc-area .sns-link > a {
    white-space: nowrap;
  }
  .header-wrap header .menu-wrap .container .logo a::before {
    width: 14rem;
    height: 2rem;
  }
  .header-wrap header .menu-wrap .container .mobile-menu-wrap {
    right: 1rem;
  }
  .header-wrap header .menu-wrap .container .mobile-menu-wrap .mobile-member {
    display: flex;
    align-items: center;
  }
  .header-wrap header .menu-wrap .container .mobile-menu-wrap .mobile-member.off {
    display: none;
  }
  .header-wrap header .menu-wrap .container .menu-list {
    top: 15.3rem;
  }
  .header-wrap header .menu-wrap .container .menu-list > ul .title-menu a {
    font-size: 1.8rem;
  }
}
.wrap {
  position: relative;
  box-sizing: border-box;
}
.wrap.on .keyvisual-area {
  padding-top: 12rem;
}

.container {
  width: 100%;
  max-width: 144rem;
  padding: 0 2rem;
  margin: 0 auto;
}
@media (max-width: 1470px) {
  .container {
    max-width: 100%;
  }
}

.content-wrap {
  padding: 6rem 0 16rem;
  min-height: calc(100% - 38rem);
}
.content-wrap .container {
  display: flex;
  box-sizing: border-box;
}
.content-wrap .container .content-area {
  width: calc(100% - 29rem);
  margin-left: 5rem;
}
.content-wrap .container .content-area .content {
  padding-top: 4rem;
  /*  > div {
    padding-top: 3rem;
  }*/
}
.content-wrap .container .content-area.terms {
  width: 100%;
  margin-left: 0;
}

@media (max-width: 1024px) {
  .content-wrap .container {
    padding: 0 4rem;
  }
  .content-wrap .container .content-area {
    margin-left: auto;
    width: 100%;
  }
  .content-wrap .container .content-area .content {
    padding-top: 0;
  }
}
@media (max-width: 768px) {
  .content-wrap {
    padding: 4rem 0 8rem;
  }
  .content-wrap .container {
    padding: 0 2rem;
  }
}
.lnb-wrap {
  width: 24rem;
}
.lnb-wrap span {
  display: block;
}
.lnb-wrap span.lnb-title {
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 140%;
  color: #222;
}
.lnb-wrap .menu-area {
  margin-top: 2.8rem;
  border-top: 0.2rem solid #000;
  border-bottom: 0.1rem solid #000;
}
.lnb-wrap .menu-area .menu-title {
  border-bottom: 0.1rem solid #f2f4f6;
}
.lnb-wrap .menu-area .menu-title > a {
  display: block;
  width: 100%;
  padding: 1.6rem 0.4rem;
  font-size: 2rem;
  font-weight: 500;
  text-align: left;
  color: #656565;
}
.lnb-wrap .menu-area .menu-title ul.list-title {
  display: none;
}
.lnb-wrap .menu-area .menu-title ul.list-title > li {
  padding: 1.6rem;
  background: #fff;
}
.lnb-wrap .menu-area .menu-title ul.list-title > li a {
  display: block;
  font-size: 1.6rem;
  font-weight: 600;
  color: #000;
}
.lnb-wrap .menu-area .menu-title.on > a {
  background: url(../../images/icon/icon_lnb_active.png) no-repeat center right;
  background-size: 0.6rem 1.2rem;
  font-weight: 700;
  color: #000;
  box-sizing: border-box;
}
.lnb-wrap .menu-area .menu-title.on ul.list-title {
  display: block;
}
.lnb-wrap .menu-area .menu-title.on ul.list-title > li > a {
  color: #656565;
}
.lnb-wrap .menu-area .menu-title.on ul.list-title > li.on, .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover {
  background: #f2f4f6;
}
.lnb-wrap .menu-area .menu-title.on ul.list-title > li.on > a, .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover > a {
  color: #e60001;
}
.lnb-wrap .relation-wrap {
  margin-top: 6rem;
}
.lnb-wrap .relation-wrap .word-box {
  position: relative;
  padding-bottom: 2rem;
}
.lnb-wrap .relation-wrap .word-box .title {
  padding: 0.8rem 1.6rem;
  border: 0.1rem solid #dadadf;
  border-radius: 0.4em;
  background: #f4f4f4;
  font-weight: 500;
  font-size: 1.5rem;
  color: #222;
}
.lnb-wrap .relation-wrap .word-box ul {
  padding: 1rem 1.2rem 0;
}
.lnb-wrap .relation-wrap .word-box ul li {
  color: #555;
  line-height: 140%;
}
.lnb-wrap .relation-wrap .word-box ul li a {
  font-size: 1.6rem;
}
.lnb-wrap .relation-wrap .word-box ul li a.on, .lnb-wrap .relation-wrap .word-box ul li a:hover {
  color: #000;
  font-weight: 500;
  text-decoration: underline;
}
.lnb-wrap .relation-wrap .add-btn {
  display: flex;
  justify-content: flex-end;
  margin-top: 0.4rem;
}
.lnb-wrap .relation-wrap .add-btn .add {
  border: 0.1rem solid #dadadf;
}
.lnb-wrap .relation-wrap .add-btn .add::before {
  content: "";
  display: inline-flex;
  width: 2.4rem;
  height: 2.4rem;
  background: url("../../images/icon/icon_lnb_plus.png") no-repeat 0 0;
  background-size: cover;
}

.ja .lnb-wrap .menu-area .menu-title.on > a {
  color: #404040;
}
.ja .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on, .ja .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover {
  background: #f2f4f6;
}
.ja .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on > a, .ja .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover > a {
  color: #e60001;
}

.ss .lnb-wrap .menu-area .menu-title.on > a {
  color: #404040;
}
.ss .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on, .ss .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover {
  background: #f2f4f6;
}
.ss .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on > a, .ss .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover > a {
  color: #5d8200;
}

.sn .lnb-wrap .menu-area .menu-title.on > a {
  color: #404040;
}
.sn .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on, .sn .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover {
  background: #f2f4f6;
}
.sn .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on > a, .sn .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover > a {
  color: #917200;
}

.gi .lnb-wrap .menu-area .menu-title.on > a {
  color: #404040;
}
.gi .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on, .gi .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover {
  background: #f2f4f6;
}
.gi .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on > a, .gi .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover > a {
  color: #0050cc;
}

.hg .lnb-wrap .menu-area .menu-title.on > a {
  color: #404040;
}
.hg .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on, .hg .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover {
  background: #f2f4f6;
}
.hg .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on > a, .hg .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover > a {
  color: #c75300;
}

.as .lnb-wrap .menu-area .menu-title.on > a {
  color: #404040;
}
.as .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on, .as .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover {
  background: #f2f4f6;
}
.as .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on > a, .as .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover > a {
  color: #da2b7d;
}

.ch .lnb-wrap .menu-area .menu-title.on > a {
  color: #404040;
}
.ch .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on, .ch .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover {
  background: #f2f4f6;
}
.ch .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on > a, .ch .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover > a {
  color: #6430a3;
}

.dc .lnb-wrap .menu-area .menu-title.on > a {
  color: #404040;
}
.dc .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on, .dc .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover {
  background: #f2f4f6;
}
.dc .lnb-wrap .menu-area .menu-title.on ul.list-title > li.on > a, .dc .lnb-wrap .menu-area .menu-title.on ul.list-title > li:hover > a {
  color: #0f8448;
}

@media (max-width: 1024px) {
  .lnb-wrap {
    display: none;
  }
}
.info-libray .link-btn {
  display: flex;
  justify-content: flex-start;
  margin-top: 2.4rem;
}
.info-libray .link-btn a:before {
  background: url("../../images/icon/icon_window.png") no-repeat 0 0;
  background-size: cover;
}
.info-libray table .link-btn {
  justify-content: center;
  margin-top: 0;
}
.info-libray table .link-btn a::before {
  margin: 0;
}

.introduce-area .intro-area .title {
  text-align: center;
  color: #222;
  font-size: 5.2rem;
  font-weight: 700;
  line-height: 140%;
  /* 72.8px */
}
.introduce-area .intro-area .sub-title {
  display: block;
  margin-top: 1rem;
  color: #222;
  font-size: 2.8rem;
  text-align: center;
  font-weight: 400;
  line-height: 140%;
  /* 39.2px */
}
.introduce-area .intro-area .img-wrap {
  display: flex;
  justify-content: space-evenly;
  gap: 0 6rem;
  margin-top: 6rem;
}
.introduce-area .intro-area .img-wrap .img-area {
  width: 18rem;
  height: 18rem;
}
.introduce-area .intro-area .img-wrap .img-area img {
  width: 100%;
}
.introduce-area .intro-area .text-area {
  display: flex;
  flex-direction: column;
  text-align: center;
  gap: 0.8rem 0;
  margin-top: 6rem;
}
.introduce-area .intro-area .text-area p,
.introduce-area .intro-area .text-area strong {
  line-height: 160%;
  font-size: 2rem;
}
.introduce-area .intro-area .text-area strong {
  font-weight: 600;
  position: relative;
  top: -0.3rem;
}
.introduce-area .intro-area .text-area .last {
  margin-top: 4rem;
}
.introduce-area .intro-area .text-area.mt4 {
  margin-top: 4rem;
}
.introduce-area .intro-area + .intro-area {
  margin-top: 10rem;
}
.introduce-area .history-area {
  width: 100%;
  margin: 2rem auto 0;
  padding-bottom: 4rem;
  border-top: 0.2rem solid #222;
  border-bottom: 0.2rem solid #222;
}
.introduce-area .history-area .history-box {
  display: flex;
  align-items: baseline;
  margin-top: 2rem;
}
.introduce-area .history-area .history-box .year-text {
  position: relative;
  top: 0.8rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 14rem;
  padding-left: 2rem;
  color: #222;
  font-size: 4rem;
  font-weight: 700;
  line-height: 140%;
}
.introduce-area .history-area .history-box .year-text::after {
  content: "";
  position: absolute;
  right: -1.6rem;
  display: inline-flex;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  -webkit-border-radius: 50%;
  border-radius: 50%;
  background: #e60001;
}
.introduce-area .history-area .history-box .info-wrap {
  display: flex;
  flex-wrap: wrap;
  width: calc(100% - 4rem);
  margin-left: 4rem;
}
.introduce-area .history-area .history-box .info-wrap p {
  display: flex;
  width: 100%;
  margin-top: 1.2rem;
}
.introduce-area .history-area .history-box .info-wrap p span.date {
  width: 6rem;
  color: #929292;
  font-size: 2.2rem;
  font-weight: 600;
}
.introduce-area .history-area .history-box .info-wrap p span.text {
  width: calc(100% - 10rem);
  margin-left: 4rem;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 140%;
}
.introduce-area.branch .tab-wrap {
  margin-top: 0;
}

.oragizaion-area .img-area {
  width: 100%;
}
.oragizaion-area .img-area img {
  width: 100%;
}
.oragizaion-area .library-information {
  margin-top: 8rem;
}
.oragizaion-area .library-information .top {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
}
.oragizaion-area .library-information .top .text-info {
  position: relative;
  top: 1rem;
  display: flex;
  align-items: baseline;
}
.oragizaion-area .library-information .top .text-info .title {
  color: #222;
  font-size: 2.8rem;
  font-weight: 600;
  line-height: 140%;
}
.oragizaion-area .library-information .top .text-info .tel {
  margin-left: 1.8rem;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 140%;
  color: #555;
}
.oragizaion-area .library-information .table {
  margin-top: 1.8rem;
  border-top: 0.1rem solid #222;
}
.oragizaion-area .library-information .table th {
  background: #f4f4f4;
}
.oragizaion-area .library-information .table th.bdr {
  border-right: 0.1rem solid #dadadf;
}
.oragizaion-area .library-information .table tr,
.oragizaion-area .library-information .table td {
  height: 5.6rem;
  text-align: center;
  border-bottom: 0.1rem solid #dadadf;
  font-size: 1.9rem;
}
.oragizaion-area .library-information .table tr.bdr,
.oragizaion-area .library-information .table td.bdr {
  border-right: 0.1rem solid #dadadf;
}

.archiving-area .search-area {
  margin-top: 2.4rem;
}
.archiving-area .thumbnail-area {
  margin-top: 2.4rem;
  display: flex;
}
.archiving-area .thumbnail-area .box {
  display: flex;
  flex-direction: column;
  padding-right: 3.2rem;
  border-right: 0.1rem solid #dadadf;
}
.archiving-area .thumbnail-area .box .img-area {
  position: relative;
  background: #f4f4f4;
}
.archiving-area .thumbnail-area .box .img-area img {
  width: 100%;
}
.archiving-area .thumbnail-area .box .img-area:hover::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  z-index: 9;
}
.archiving-area .thumbnail-area .box .img-area:hover::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 7.7rem;
  height: 7.7rem;
  background: url("../../images/icon/icon_program_add.png") no-repeat 0 0;
  background-size: cover;
  z-index: 99;
}
.archiving-area .thumbnail-area .box .info-area {
  margin-top: 2.4rem;
}
.archiving-area .thumbnail-area .box .info-area .title {
  margin-top: 0.8rem;
  font-size: 2.4rem;
  font-weight: 700;
  line-height: 140%;
  letter-spacing: -0.024rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.archiving-area .thumbnail-area .box .info-area .text-content {
  margin-top: 1.6rem;
  font-size: 1.6rem;
  color: #555;
  font-weight: 400;
  letter-spacing: -0.064rem;
  line-height: 140%;
  display: -webkit-box;
  -webkit-line-clamp: 4;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.archiving-area .thumbnail-area .box .info-area .date {
  display: block;
  margin-top: 1rem;
  color: #929292;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.06rem;
}
.archiving-area .thumbnail-area .box:last-child {
  border-right: 0;
  padding-right: 0;
  padding-left: 3.2rem;
}
.archiving-area .thumbnail-area .box:hover .info-area .title {
  text-decoration: underline;
}
.archiving-area .rowlist-area {
  margin-top: 3.2rem;
}
.archiving-area .rowlist-area .row-box {
  display: flex;
  align-items: center;
  padding: 2.4rem 0;
  border-top: 0.1rem solid #dadadf;
}
.archiving-area .rowlist-area .row-box .library {
  margin-right: 0.8rem;
}
.archiving-area .rowlist-area .row-box .title {
  color: #222;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.018rem;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.archiving-area .rowlist-area .row-box .date {
  display: inline-block;
  margin-left: auto;
}
.archiving-area .rowlist-area .row-box:last-child {
  border-bottom: 0.1rem solid #dadadf;
}
.archiving-area .rowlist-area .row-box:hover .title {
  text-decoration: underline;
}
.archiving-area .program-list.photo .result-list .result-box .img-area {
  width: 33rem;
  height: 24.8rem;
}
.archiving-area .slide-area {
  position: relative;
}
.archiving-area .slide-area .title {
  color: #222;
  margin-top: 2.4rem;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 140%;
  /* 44.8px */
}
.archiving-area .slide-area .swiper {
  margin-top: 2rem;
  padding-bottom: 2rem;
}
.archiving-area .slide-area .swiper .swiper-slide .img-area {
  position: relative;
  height: 34rem;
}
.archiving-area .slide-area .swiper .swiper-slide .img-area img {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  max-width: 24rem;
  height: 100%;
  max-height: 34rem;
}
.archiving-area .slide-area .swiper .swiper-slide .img-area:hover::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  z-index: 9;
}
.archiving-area .slide-area .swiper .swiper-slide .img-area:hover::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 7.7rem;
  height: 7.7rem;
  background: url("../../images/icon/icon_program_add.png") no-repeat 0 0;
  background-size: cover;
  z-index: 99;
}
.archiving-area .slide-area .swiper .info-area {
  margin-top: 2rem;
}
.archiving-area .slide-area .swiper .info-area .library {
  padding: 0.3rem 0.6rem;
  line-height: 140%;
  font-size: 1.4rem;
  font-weight: 700;
}
.archiving-area .slide-area .swiper .info-area .date {
  display: block;
  margin-top: 1.6rem;
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.06rem;
  color: #929292;
}
.archiving-area .slide-area .swiper .info-area .name {
  margin-top: 1.6rem;
  font-size: 2rem;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.02rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.archiving-area .slide-area .swiper .btn-wrap {
  margin-top: 1.6rem;
}
.archiving-area .slide-area .swiper .btn-wrap .btn {
  display: inline-block;
  width: 100%;
  text-align: center;
}
.archiving-area .slide-area .swiper-btn {
  position: absolute;
  top: 0;
  right: 0;
  margin-top: 0;
}
.archiving-area .slide-area .swiper-horizontal > .swiper-pagination-progressbar,
.archiving-area .slide-area .swiper-pagination-progressbar.swiper-pagination-horizontal,
.archiving-area .slide-area .swiper-pagination-progressbar.swiper-pagination-vertical.swiper-pagination-progressbar-opposite,
.archiving-area .slide-area .swiper-vertical > .swiper-pagination-progressbar.swiper-pagination-progressbar-opposite {
  left: auto;
  top: auto;
  bottom: 0;
}
.archiving-area .slide-area .swiper-pagination-progressbar .swiper-pagination-progressbar-fill {
  background: #404040;
}
.archiving-area .slide-area + .slide-area {
  margin-top: 8rem;
}

.haegong .introduce-area .history-area .history-box .year-text::after {
  background: #c75300;
}
.haegong .introduce-area.branch .floor-area .floor-info .info-box .floor-number .floor {
  color: #c75300;
}

.gangil .introduce-area .history-area .history-box .year-text::after {
  background: #0050cc;
}
.gangil .introduce-area.branch .floor-area .floor-info .info-box .floor-number .floor {
  color: #0050cc;
}

.jungang .introduce-area .history-area .history-box .year-text::after {
  background: #e60001;
}
.jungang .introduce-area.branch .floor-area .floor-info .info-box .floor-number .floor {
  color: #e60001;
}

.supsok .introduce-area .history-area .history-box .year-text::after {
  background: #5d8200;
}
.supsok .introduce-area.branch .floor-area .floor-info .info-box .floor-number .floor {
  color: #5d8200;
}

.seongnae .introduce-area .history-area .history-box .year-text::after {
  background: #917200;
}
.seongnae .introduce-area.branch .floor-area .floor-info .info-box .floor-number .floor {
  color: #917200;
}

.amsa .introduce-area .history-area .history-box .year-text::after {
  background: #da2b7d;
}
.amsa .introduce-area.branch .floor-area .floor-info .info-box .floor-number .floor {
  color: #da2b7d;
}

.cheonho .introduce-area .history-area .history-box .year-text::after {
  background: #6430a3;
}
.cheonho .introduce-area.branch .floor-area .floor-info .info-box .floor-number .floor {
  color: #6430a3;
}

.dunchun .introduce-area .history-area .history-box .year-text::after {
  background: #0f8448;
}
.dunchun .introduce-area.branch .floor-area .floor-info .info-box .floor-number .floor {
  color: #0f8448;
}

.introduce-area.branch .intro-area .img-area {
  margin-top: 6rem;
  text-align: center;
}
.introduce-area.branch .intro-area .img-area img {
  width: 100%;
}
.introduce-area.branch .intro-area .text-area {
  margin-top: 6rem;
}
.introduce-area.branch .intro-area .text-area p {
  font-size: 2rem;
  font-weight: 400;
  color: #222;
  text-align: center;
  line-height: 160%;
  word-break: keep-all;
}
.introduce-area.branch .intro-area .text-area p + p {
  margin-top: 2rem;
}
.introduce-area.branch .intro-area .sub-title span {
  font-size: 2.8rem;
  line-height: 140%;
}
.introduce-area.branch .intro-area .sub-title span.info {
  color: #1a71ea;
}
.introduce-area.branch .intro-area .table-area {
  width: 100%;
  margin-top: 7.2rem;
  border-top: 0.1rem solid #929292;
}
.introduce-area.branch .intro-area .table-area th,
.introduce-area.branch .intro-area .table-area td {
  line-height: 140%;
  letter-spacing: -0.018rem;
  color: #222;
  font-size: 1.8rem;
  border-bottom: 0.1rem solid #dadadf;
  border-right: 0.1rem solid #dadadf;
  text-align: center;
}
.introduce-area.branch .intro-area .table-area th {
  padding: 1.4rem 0;
  background: #f4f4f4;
  text-align: center;
  font-weight: 600;
}
.introduce-area.branch .intro-area .table-area td {
  padding: 1.2rem 0;
}
.introduce-area.branch .intro-area .table-area td.bd0 {
  border-right: 0;
}
.introduce-area.branch .intro-area .table-area td.left {
  text-align: left;
  padding-left: 1.5rem;
}
.introduce-area.branch .intro-area .table-area.mt0 {
  margin-top: 0;
}
.introduce-area.branch .intro-area .table-list-area .table-area {
  border-top: 0;
}
.introduce-area.branch .intro-area .table-list-area .table-area .top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  border-bottom: 0.1rem solid #222;
  padding-bottom: 0.8rem;
}
.introduce-area.branch .intro-area .table-list-area .table-area .top .title {
  color: #222;
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 140%;
}
.introduce-area.branch .intro-area .table-list-area .table-area .top .close::before {
  content: "";
  display: inline-flex;
  width: 3rem;
  height: 3rem;
  background: url("../../images/icon/icon_table_arrow.png") no-repeat 0 0;
  background-size: cover;
}
.introduce-area.branch .intro-area .table-list-area .table-area .top .close.on::before {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
}
.introduce-area.branch .intro-area .table-list-area .table th,
.introduce-area.branch .intro-area .table-list-area .table td {
  padding: 0.8rem 0;
  font-size: 1.6rem;
}
.introduce-area.branch .intro-area .table-list-area .table th:last-child,
.introduce-area.branch .intro-area .table-list-area .table td:last-child {
  border-right: 0;
}
.introduce-area.branch .intro-area .table-list-area .table-desc {
  margin-top: 0.8rem;
  font-weight: 400;
  color: #555;
}
.introduce-area.branch .info-text {
  margin-top: 2.4rem;
}
.introduce-area.branch .info-text .title {
  color: #222;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 140%;
  text-align: left;
}
.introduce-area.branch .info-text ul li {
  display: flex;
  margin-top: 0.8rem;
}
.introduce-area.branch .info-text ul li span {
  color: #555;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 140%;
  /* 25.2px */
}
.introduce-area.branch .info-text ul li span.info-title {
  width: 7rem;
  margin-right: 2rem;
}
.introduce-area.branch .floor-area {
  padding-top: 6.4rem;
}
.introduce-area.branch .floor-area .floor-title .title {
  color: #222;
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 140%;
}
.introduce-area.branch .floor-area .floor-place {
  margin-top: 0.8rem;
  padding-top: 2.4rem;
  border-top: 0.2rem solid #222;
}
.introduce-area.branch .floor-area .floor-place .place-box {
  display: flex;
  justify-content: flex-end;
  flex-wrap: wrap;
  width: 100%;
  gap: 1.2rem 2.4rem;
}
.introduce-area.branch .floor-area .floor-place .place-box li:nth-child(1) span {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  color: #555;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 130%;
}
.introduce-area.branch .floor-area .floor-place .place-box li:nth-child(1) span::before {
  content: "";
  display: block;
  width: 2.4rem;
  height: 2.4rem;
  background: url("../../images/icon/icon_floor02.png") center/100% no-repeat;
}
.introduce-area.branch .floor-area .floor-place .place-box li:nth-child(2) span {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  color: #555;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 130%;
}
.introduce-area.branch .floor-area .floor-place .place-box li:nth-child(2) span::before {
  content: "";
  display: block;
  width: 2.4rem;
  height: 2.4rem;
  background: url("../../images/icon/icon_floor03.png") center/100% no-repeat;
}
.introduce-area.branch .floor-area .floor-place .place-box li:nth-child(3) span {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  color: #555;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 130%;
}
.introduce-area.branch .floor-area .floor-place .place-box li:nth-child(3) span::before {
  content: "";
  display: block;
  width: 2.4rem;
  height: 2.4rem;
  background: url("../../images/icon/icon_floor04.png") center/100% no-repeat;
}
.introduce-area.branch .floor-area .floor-place .place-box li:nth-child(4) span {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  color: #555;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 130%;
}
.introduce-area.branch .floor-area .floor-place .place-box li:nth-child(4) span::before {
  content: "";
  display: block;
  width: 2.4rem;
  height: 2.4rem;
  background: url("../../images/icon/icon_floor05.png") center/100% no-repeat;
}
.introduce-area.branch .floor-area .floor-place .place-box li:nth-child(5) span {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  color: #555;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 130%;
}
.introduce-area.branch .floor-area .floor-place .place-box li:nth-child(5) span::before {
  content: "";
  display: block;
  width: 2.4rem;
  height: 2.4rem;
  background: url("../../images/icon/icon_floor06.png") center/100% no-repeat;
}
.introduce-area.branch .floor-area .floor-place .place-box li {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.introduce-area.branch .floor-area .floor-place .place-box li:first-child::before {
  content: "";
  display: block;
  width: 2.4rem;
  height: 2.4rem;
  background: url("../../images/icon/icon_floor01.png") center/100% no-repeat;
}
.introduce-area.branch .floor-area .floor-info {
  display: flex;
  justify-content: space-between;
  min-height: 29rem;
  padding: 3rem 0;
  border-bottom: 0.1rem solid #dadadf;
}
.introduce-area.branch .floor-area .floor-info .info-box {
  display: flex;
  flex: 1;
  gap: 4rem;
}
.introduce-area.branch .floor-area .floor-info .info-box .floor-number {
  display: flex;
  max-width: 15.7rem;
  width: 100%;
}
.introduce-area.branch .floor-area .floor-info .info-box .floor-number .floor {
  color: #c75300;
  font-size: 9.6rem;
  font-weight: 500;
  line-height: 100%;
}
.introduce-area.branch .floor-area .floor-info .info-box .floor-list .list-box {
  display: flex;
  flex-direction: column;
  gap: 0.4rem 1.2rem;
}
.introduce-area.branch .floor-area .floor-info .info-box .floor-list .list-box span {
  color: #222;
  font-size: 2.2rem;
  font-weight: 400;
  line-height: 140%;
}
.introduce-area.branch .floor-area .floor-info .info-box.building-box .floor-number {
  position: relative;
}
.introduce-area.branch .floor-area .floor-info .info-box.building-box .floor-number .building {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-flex;
  width: auto;
  padding: 1.2rem 2rem;
  border: 0.1rem solid #dadadf;
  border-radius: 4rem;
  color: #222;
  font-size: 2.4rem;
  font-weight: 500;
  line-height: 140%;
}
.introduce-area.branch .floor-area .floor-info .info-box.building-box .floor-number .floor {
  padding-top: 6.5rem;
}
.introduce-area.branch .floor-area .floor-info .info-box.building-box .floor-list {
  padding-top: 6.5rem;
}
.introduce-area.branch .floor-area .floor-info .floor-picture {
  max-width: 68.8rem;
  width: calc(100% - 42rem);
  max-height: 25.8rem;
  height: 100%;
}
.introduce-area.branch .floor-area .floor-info .floor-picture img {
  width: 100%;
  height: 100%;
}
.introduce-area.branch .facility-area {
  display: flex;
  padding-top: 3rem;
}
.introduce-area.branch .facility-area .facility-list {
  display: flex;
  flex-wrap: wrap;
  gap: 2.4rem;
}
.introduce-area.branch .facility-area .facility-list li {
  display: flex;
  flex: 0 0 calc(33.333% - 1.6rem);
  flex-direction: column;
  gap: 1.2rem;
}
.introduce-area.branch .facility-area .facility-list li .facility-img {
  width: 100%;
  max-height: 22rem;
}
.introduce-area.branch .facility-area .facility-list li .facility-img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.introduce-area.branch .facility-area .facility-list li .facility-info {
  display: flex;
  flex-direction: column;
  gap: 0.2rem;
}
.introduce-area.branch .facility-area .facility-list li .facility-info dt {
  color: #222;
  font-size: 2.6rem;
  font-weight: 600;
  line-height: 140%;
}
.introduce-area.branch .facility-area .facility-list li .facility-info dd {
  color: #555;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 140%;
}
.introduce-area.branch .btn-wrap {
  margin-top: 13rem;
}
.introduce-area.branch .btn-wrap .btn {
  padding: 1.4rem 2.4rem;
}
.introduce-area.branch .location-area .map-area {
  max-width: 110rem;
}
.introduce-area.branch .location-area .map-area img {
  width: 100%;
}
.introduce-area.branch .location-area .map-info ul {
  margin-top: 1.6rem;
}
.introduce-area.branch .location-area .map-info ul > li {
  display: flex;
  gap: 0 2.2rem;
  margin-top: 0.6rem;
}
.introduce-area.branch .location-area .map-info ul > li span {
  display: inline-block;
  color: #222;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.036rem;
}
.introduce-area.branch .location-area .map-info ul > li span.name {
  width: 8rem;
  color: #555;
  font-weight: 500;
  line-height: 140%;
}
.introduce-area.branch .service-area {
  margin-top: 4rem;
}
.introduce-area.branch .service-area .method p:first-child {
  display: flex;
  align-items: center;
  padding-left: 2.5rem;
  color: #222;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 160%;
  letter-spacing: -0.027rem;
}
.introduce-area.branch .service-area .method p:first-child::before {
  content: "";
  display: inline-flex;
  top: 50%;
  transform: translateY(-50%);
  width: 2.2rem;
  height: 2.2rem;
  margin-right: 0.6rem;
}
.introduce-area.branch .service-area .method p:first-child.bus::before {
  background: url("../../images/icon/icon_bus.png") no-repeat 0 0;
  background-size: cover;
}
.introduce-area.branch .service-area .method p:first-child.subway::before {
  background: url("../../images/icon/icon_subway.png") no-repeat 0 0;
  background-size: cover;
}
.introduce-area.branch .service-area .method + .method {
  margin-top: 2.4rem;
}
.introduce-area .table-info {
  margin-top: 2rem;
}
.introduce-area .table-info p {
  font-size: 2rem;
}
.introduce-area .table-info ul {
  margin-top: 1rem;
}
.introduce-area .table-info ul li {
  line-height: 140%;
}

.small-lib .search-area .input-box {
  width: 40%;
}
.small-lib .search-area .input-box .select {
  width: 100%;
  max-width: unset;
}
.small-lib .search-area .input-box .select select {
  width: 100%;
}
.small-lib .search-area .input-box:last-child {
  width: 11.3%;
}
.small-lib .lib-info {
  display: flex;
  justify-content: space-between;
  gap: 0 4rem;
  margin-top: 5rem;
}
.small-lib .lib-info .img-area img {
  width: 100%;
  max-width: 48rem;
}
.small-lib .lib-info .small-lib-info {
  width: calc(100% - 48rem);
}
.small-lib .lib-info .small-lib-info > .title {
  color: #222;
  font-size: 3rem;
  font-weight: 700;
  line-height: 140%;
  letter-spacing: -0.06rem;
}
.small-lib .lib-info .small-lib-info ul {
  margin-top: 0.8rem;
}
.small-lib .lib-info .small-lib-info ul li {
  display: flex;
  margin-top: 0.6rem;
}
.small-lib .lib-info .small-lib-info ul li span {
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 140%;
}
.small-lib .lib-info .small-lib-info ul li span.title {
  width: 6.2rem;
  font-weight: 500;
  white-space: pre;
}
.small-lib .lib-info .small-lib-info ul li span.text {
  width: auto;
  margin-left: 2.3rem;
  font-weight: 400;
  letter-spacing: -0.036rem;
}
.small-lib .lib-info .small-lib-info .etc {
  margin-top: 2rem;
  color: #555;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.036rem;
}
.small-lib .table-area {
  width: 100%;
  margin-top: 4rem;
  border-top: 0.1rem solid #929292;
}
.small-lib .table-area th,
.small-lib .table-area td {
  line-height: 140%;
  letter-spacing: -0.018rem;
  color: #222;
  font-size: 1.6rem;
  border-bottom: 0.1rem solid #dadadf;
  border-right: 0.1rem solid #dadadf;
  text-align: center;
}
.small-lib .table-area th {
  padding: 0.6rem 0;
  background: #f4f4f4;
  text-align: center;
  font-weight: 600;
}
.small-lib .table-area th.bd0 {
  border-right: 0;
}
.small-lib .table-area td {
  padding: 0.6rem 0;
}
.small-lib .table-area td.bd0 {
  border-right: 0;
}
.small-lib .table-area td.left {
  text-align: left;
  padding-left: 1.5rem;
}
.small-lib .location-area {
  margin-top: 4.6rem;
}
.small-lib .location-area > .title {
  border-bottom: 0.2rem solid #222;
  color: #222;
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 140%;
}
.small-lib .location-area .map-area {
  width: 100%;
  margin-top: 1.6rem;
}
.small-lib .location-area .map-area img {
  width: 100%;
}

@media (max-width: 1024px) {
  .archiving-area .slide-area .swiper .swiper-slide .img-area {
    background: #f4f4f4;
  }
  .archiving-area .slide-area .swiper .swiper-slide .img-area img {
    margin: 0 auto;
  }
  .archiving-area .program-list.photo .result-list .result-box .img-area {
    width: auto;
  }
  .archiving-area .program-list.photo .result-list .result-box .info-area .btm-date {
    margin-top: 0;
  }
  .small-lib .lib-info {
    flex-wrap: wrap;
  }
  .small-lib .lib-info .img-area {
    margin: 0 auto;
  }
  .small-lib .lib-info .small-lib-info {
    width: 100%;
    margin-top: 2rem;
  }
  .small-lib .lib-info .small-lib-info > .title {
    font-size: 2.4rem;
  }
  .small-lib .lib-info .small-lib-info ul li span {
    font-size: 1.6rem;
  }
  .small-lib .lib-info .small-lib-info .etc {
    margin-top: 1rem;
    font-size: 1.6rem;
  }
  .small-lib .table-area {
    margin-top: 2.4rem;
  }
  .introduce-area.branch .intro-area .img-area {
    margin-top: 4rem;
  }
  .introduce-area.branch .intro-area .img-area img {
    width: 100%;
  }
  .introduce-area.branch .intro-area .text-area br {
    display: none;
  }
  .introduce-area.branch .intro-area .text-area p {
    font-size: 1.5rem;
    word-break: keep-all;
  }
  .introduce-area.branch .intro-area .table-area {
    overflow: auto;
    margin-top: 4rem;
  }
  .introduce-area.branch .intro-area .table-area table {
    width: 80rem;
  }
  .introduce-area.branch .intro-area .table-area th, .introduce-area.branch .intro-area .table-area td {
    font-size: 1.6rem;
  }
  .introduce-area.branch .intro-area .sub-title span {
    font-size: 1.8rem;
  }
  .introduce-area.branch .floor-area .floor-info {
    flex-direction: column;
    gap: 1.8rem;
    padding: 2.4rem 0;
  }
  .introduce-area.branch .floor-area .floor-info .info-box {
    flex-direction: column;
    gap: 1.6rem;
  }
  .introduce-area.branch .floor-area .floor-info .info-box .floor-number {
    flex-direction: column;
  }
  .introduce-area.branch .floor-area .floor-info .info-box .floor-number .floor {
    font-weight: 500;
    font-size: 5.6rem;
  }
  .introduce-area.branch .floor-area .floor-info .info-box .floor-list .list-box {
    flex-direction: row;
    flex-wrap: wrap;
  }
  .introduce-area.branch .floor-area .floor-info .info-box .floor-list .list-box span {
    font-size: 2rem;
  }
  .introduce-area.branch .floor-area .floor-info .info-box.building-box .floor-list {
    padding-top: 0;
  }
  .introduce-area.branch .floor-area .floor-info .floor-picture {
    max-width: 100%;
    width: 100%;
    max-height: 100%;
    height: 100%;
  }
  .introduce-area.branch .facility-area .facility-list li {
    flex: 0 0 calc(50% - 1.2rem);
  }
  .introduce-area.branch .facility-area .facility-list li .facility-info dt {
    font-size: 2.2rem;
  }
  .introduce-area.branch .facility-area .facility-list li .facility-info dd {
    font-size: 1.6rem;
  }
  .introduce-area.branch .location-area .map-area {
    max-width: unset;
  }
  .introduce-area.branch .location-area .map-info ul > li span {
    font-size: 1.6rem;
  }
  .introduce-area.branch .service-area .method {
    margin-left: 1rem;
  }
}
@media (max-width: 768px) {
  .introduce-area.branch .intro-area .title {
    font-size: 3.2rem;
  }
  .introduce-area.branch .intro-area .sub-title {
    font-size: 2rem;
  }
  .introduce-area.branch .intro-area .text-area p,
  .introduce-area.branch .intro-area .text-area strong {
    font-size: 1.8rem;
  }
  .introduce-area.branch .floor-area .floor-info {
    gap: 1.6rem;
  }
  .introduce-area.branch .floor-area .floor-info .info-box .floor-number .floor {
    font-size: 4.2rem;
  }
  .introduce-area.branch .floor-area .floor-info .info-box .floor-list .list-box span {
    font-size: 1.8rem;
  }
  .introduce-area.branch .facility-area .facility-list li {
    flex: 0 0 100%;
  }
  .introduce-area.branch .facility-area .facility-list li .facility-img {
    max-height: 24.7rem;
  }
  .introduce-area.branch .facility-area .facility-list li .facility-info dt {
    font-size: 2.2rem;
  }
  .introduce-area.branch .facility-area .facility-list li .facility-info dd {
    font-size: 1.6rem;
  }
  .introduce-area .history-area .history-box {
    flex-wrap: wrap;
  }
  .introduce-area .history-area .history-box .year-text {
    width: 100%;
    font-size: 2rem;
  }
  .introduce-area .history-area .history-box .year-text::after {
    display: none;
  }
  .introduce-area .history-area .history-box .info-wrap {
    width: 100%;
    margin-left: 2rem;
  }
  .introduce-area .history-area .history-box .info-wrap p {
    align-items: center;
  }
  .introduce-area .history-area .history-box .info-wrap p span.date {
    width: 7rem;
    font-size: 1.6rem;
  }
  .introduce-area .history-area .history-box .info-wrap p span.text {
    width: calc(100% - 7rem);
    margin-left: 0;
    font-size: 1.5rem;
  }
  .archiving-area .thumbnail-area {
    display: block;
  }
  .archiving-area .thumbnail-area .box {
    padding: 0;
    border: 0;
  }
  .archiving-area .thumbnail-area .box:last-child {
    padding: 0;
  }
  .archiving-area .thumbnail-area .box .info-area .title {
    font-size: 1.8rem;
  }
  .archiving-area .thumbnail-area .box .info-area .text-content {
    margin-top: 0.4rem;
  }
  .archiving-area .thumbnail-area .box + .box {
    margin-top: 3.2rem;
  }
  .archiving-area .rowlist-area .row-box {
    display: block;
    padding: 1.2rem 0 1.6rem;
  }
  .archiving-area .rowlist-area .row-box .title {
    margin-top: 0.8rem;
  }
  .archiving-area .rowlist-area .row-box .date {
    display: block;
    margin-top: 0.5rem;
    font-size: 1.5rem;
  }
  .archiving-area .program-list.photo .result-list .result-box .img-area {
    width: 100%;
  }
}
.join-wrap {
  /*padding: 3rem 13rem 0;*/
  max-width: 84rem;
  margin: 0 auto;
  box-sizing: border-box;
}
.join-wrap .step-area {
  position: relative;
}
.join-wrap .step-area ul {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 6rem;
}
.join-wrap .step-area ul li {
  position: relative;
}
.join-wrap .step-area ul li::before {
  content: "";
  display: inline-flex;
  width: 8rem;
  height: 8rem;
  border-radius: 50%;
  background: #f4f4f4;
}
.join-wrap .step-area ul li span {
  display: block;
  margin-top: 1rem;
  font-size: 1.8rem;
  font-weight: 500;
  text-align: center;
  letter-spacing: -0.018rem;
  color: #555;
}
.join-wrap .step-area ul li::after {
  content: "";
  position: absolute;
  top: 2.1rem;
  left: 50%;
  width: 3.6rem;
  height: 3.6rem;
  transform: translateX(-50%);
  background-size: cover;
  background-repeat: no-repeat;
}
.join-wrap .step-area ul li.on::before {
  background: #e60001;
}
.join-wrap .step-area ul li.on span {
  color: #e60001;
}
.join-wrap .step-area ul li:nth-child(1)::after {
  left: 45%;
}
.join-wrap .step-area ul li:nth-child(1)::after {
  background-image: url("../../images/icon/icon_join_01.png");
}
.join-wrap .step-area ul li:nth-child(1).on::after {
  background-image: url("../../images/icon/icon_join_01_on.png");
}
.join-wrap .step-area ul li:nth-child(2)::after {
  background-image: url("../../images/icon/icon_join_02.png");
}
.join-wrap .step-area ul li:nth-child(2).on::after {
  background-image: url("../../images/icon/icon_join_02_on.png");
}
.join-wrap .step-area ul li:nth-child(3)::after {
  background-image: url("../../images/icon/icon_join_03.png");
}
.join-wrap .step-area ul li:nth-child(3).on::after {
  background-image: url("../../images/icon/icon_join_03_on.png");
}
.join-wrap .step-area ul li:nth-child(4)::after {
  background-image: url("../../images/icon/icon_join_04.png");
}
.join-wrap .step-area ul li:nth-child(4).on::after {
  background-image: url("../../images/icon/icon_join_04_on.png");
}
.join-wrap .step-area::before {
  content: "";
  position: absolute;
  top: 4.4rem;
  left: 50%;
  width: 100%;
  max-width: 49rem;
  height: 0.2rem;
  background: #dadadf;
  transform: translateX(-50%);
}
.join-wrap .choice-area {
  display: flex;
  align-items: stretch;
  gap: 0 2rem;
  margin-top: 4rem;
}
.join-wrap .choice-area .choice-box {
  flex: 1;
  max-width: 40rem;
  width: 100%;
  min-height: 36rem;
  height: auto;
  padding: 6rem 3rem 4rem 3rem;
  border-radius: 0.4rem;
  border: 0.1rem solid #dadadf;
  box-sizing: border-box;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.join-wrap .choice-area .choice-box::before {
  content: "";
  display: inline-flex;
  justify-content: center;
  width: 10rem;
  height: 10rem;
  background: url("../../images/icon/icon_choice_01.png") no-repeat;
  background-size: cover;
}
.join-wrap .choice-area .choice-box .title {
  margin-top: 2rem;
  letter-spacing: -0.026rem;
  font-size: 2.6rem;
  font-weight: 600;
  color: #222;
  letter-spacing: -0.026rem;
}
.join-wrap .choice-area .choice-box span {
  display: block;
  margin-top: 1rem;
  font-size: 1.8rem;
  color: #555;
  letter-spacing: -0.036rem;
  font-weight: 400;
  line-height: 140%;
}
.join-wrap .choice-area .choice-box span + span {
  margin-top: 2rem;
  font-size: 1.6rem;
  line-height: 140%;
  letter-spacing: -0.032rem;
}
.join-wrap .choice-area .choice-box:last-child::before {
  background: url("../../images/icon/icon_choice_02.png") no-repeat;
  background-size: cover;
}
.join-wrap .choice-area .choice-box.on, .join-wrap .choice-area .choice-box:hover {
  cursor: pointer;
  box-shadow: inset 0 0 0 0.2rem #e60001;
  transition: 0.2s;
}
.join-wrap .choice-area + .sub-title {
  padding-top: 4rem;
}
.join-wrap .complete-area {
  max-width: 56rem;
  margin: 0 auto;
  padding: 6rem;
  border-radius: 0.4rem;
  border: 0.1rem solid #dadadf;
  text-align: center;
  box-sizing: border-box;
}
.join-wrap .complete-area::before {
  content: "";
  display: inline-flex;
  width: 10rem;
  height: 10rem;
  margin-bottom: 2rem;
  background: url("../../images/icon/icon-join-complete.png") no-repeat 0 0;
  background-size: cover;
}
.join-wrap .complete-area > .title {
  font-size: 3.6rem;
  font-weight: 700;
  color: #222;
}
.join-wrap .complete-area > span {
  display: block;
  margin-top: 1.4rem;
  font-weight: 400;
  color: #555;
  font-size: 1.8rem;
  line-height: 144%;
  letter-spacing: -0.018rem;
}
.join-wrap .complete-area > span + span {
  margin-top: 2rem;
}
.join-wrap .complete-area .text-area {
  margin-top: 2rem;
  padding: 1.4rem 2rem;
  text-align: left;
  background: #f4f4f4;
}
.join-wrap .complete-area .text-area .title {
  display: block;
  margin-bottom: 0.6rem;
  color: #1a71ea;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.018rem;
}
.join-wrap .complete-area .text-area ul li {
  line-height: 140%;
  color: #555;
  letter-spacing: -0.016rem;
}
.join-wrap .complete-area .btn-wrap {
  margin-top: 2rem;
}
.join-wrap .legal-area {
  text-align: center;
}
.join-wrap .legal-area .title-area > .title {
  margin-bottom: 1.4rem;
  color: #222;
  font-size: 3.6rem;
  font-weight: 700;
}
.join-wrap .legal-area .title-area p {
  color: #555;
  text-align: center;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.018rem;
}
.join-wrap .legal-area .ip-btn {
  margin-top: 4rem;
}
.join-wrap .legal-area .ip-btn .title {
  color: #555;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 140%;
  /* 25.2px */
  letter-spacing: -0.018rem;
}
.join-wrap .legal-area .ip-btn .btn-area {
  display: flex;
  justify-content: center;
  margin-top: 1rem;
  gap: 0.6rem;
}
.join-wrap .legal-area .ip-btn .btn-area button {
  height: 4rem;
  min-width: 12rem;
  padding: 1rem 1.4rem;
  border-radius: 0.2rem;
  border: 0.1rem solid #222;
}
.join-wrap .legal-area .choice-area {
  justify-content: center;
  gap: 0 4rem;
}
.join-wrap .legal-area .choice-area .choice-box {
  width: 40rem;
  height: 34rem;
  padding: 8rem 2rem;
  box-sizing: border-box;
}
.join-wrap .legal-area .choice-area .choice-box::before {
  background: url("../../images/icon/icon_join_mo.png") no-repeat 0 0;
  background-size: cover;
}
.join-wrap .legal-area .choice-area .choice-box:last-child::before {
  background: url("../../images/icon/icon_join_pc.png") no-repeat 0 0;
  background-size: cover;
}
.join-wrap .legal-area .caution_area {
  margin-top: 4rem;
  padding: 2rem;
  text-align: left;
  background: #f4f4f4;
}
.join-wrap .legal-area .caution_area ul > li {
  position: relative;
  padding-left: 1rem;
  color: #555;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 160%;
  letter-spacing: -0.016rem;
}
.join-wrap .legal-area .caution_area ul > li .point {
  display: block;
  color: #f74e37;
}
.join-wrap .legal-area .caution_area ul > li::before {
  content: "";
  position: absolute;
  top: 1rem;
  left: 0;
  width: 0.5rem;
  height: 0.5rem;
  background: #555;
  border-radius: 50%;
}
.join-wrap .terms-area .accordion-content .text-box p {
  margin: 2rem 0;
  line-height: 140%;
}
.join-wrap .terms-area .accordion-content .text-box p.title {
  margin-top: 0;
  margin-bottom: 2rem;
}
.join-wrap .terms-area .accordion-content .text-box + .text-box {
  margin-top: 2rem;
}
.join-wrap .terms-area .accordion-content .table-area table {
  border-top: 0.1rem solid #929292;
  text-align: center;
}
.join-wrap .terms-area .accordion-content .table-area table thead th {
  padding: 0.6rem 0;
  border-right: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  background: #f4f4f4;
  color: #222;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.016rem;
}
.join-wrap .terms-area .accordion-content .table-area table thead th:last-child {
  border-right: 0;
}
.join-wrap .terms-area .accordion-content .table-area table tbody td {
  padding: 0.6rem 1.4rem;
  border-right: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  font-weight: 400;
  line-height: 140%;
  color: #555;
  letter-spacing: -0.016rem;
  text-align: center;
}
.join-wrap .terms-area .accordion-content .table-area table tbody td:last-child {
  border-right: 0;
}
.join-wrap .terms-area .accordion-content .table-area.mt14 {
  margin-top: 1.4rem;
}

@media (max-width: 1024px) {
  .join-wrap {
    padding: 0;
  }
}
@media (max-width: 768px) {
  .join-wrap {
    padding: 0;
  }
  .join-wrap .step-area ul {
    gap: 0 3rem;
  }
  .join-wrap .step-area ul li span {
    font-size: 1.5rem;
  }
  .join-wrap .step-area ul li:before {
    width: 5rem;
    height: 5rem;
  }
  .join-wrap .step-area ul li:after {
    top: 1.5rem;
    width: 2.2rem;
    height: 2.2rem;
  }
  .join-wrap .step-area:before {
    top: 2.7rem;
    width: 28rem;
  }
  .join-wrap .choice-area {
    flex-direction: column;
  }
  .join-wrap .choice-area .choice-box {
    max-width: 100%;
    width: 100%;
    min-height: auto;
    height: auto;
    padding: 3rem 2rem;
  }
  .join-wrap .choice-area .choice-box .title {
    font-size: 2.4rem;
  }
  .join-wrap .choice-area .choice-box span {
    font-size: 1.6rem;
  }
  .join-wrap .choice-area .choice-box span + span {
    font-size: 1.5rem;
  }
  .join-wrap .choice-area .choice-box + .choice-box {
    margin-top: 2rem;
  }
  .join-wrap .choice-area .choice-box:before {
    width: 6rem;
    height: 6rem;
  }
  .join-wrap .complete-area {
    max-width: unset;
    padding: 0;
    border: 0;
  }
  .join-wrap .complete-area > .title {
    font-size: 2.8rem;
  }
  .join-wrap .complete-area > span {
    font-size: 1.6rem;
  }
  .join-wrap .complete-area > span + span {
    margin-top: 1rem;
  }
  .join-wrap .legal-area .title-area > .title {
    font-size: 2.6rem;
  }
  .join-wrap .legal-area .title-area p {
    font-size: 1.6rem;
  }
  .join-wrap .legal-area .ip-btn {
    margin-top: 3rem;
  }
  .join-wrap .legal-area .btn-area {
    flex-direction: column;
  }
  .join-wrap .legal-area .choice-area .choice-box {
    width: 100%;
    height: auto;
    padding: 5.8rem 2rem;
  }
}
.login-wrap {
  display: flex;
  justify-content: center;
  margin-top: 3rem;
}
.login-wrap .login-area {
  display: flex;
  flex-direction: column;
  min-width: 56rem;
  padding: 6rem;
  border: 1px solid #dadadf;
  box-sizing: border-box;
}
.login-wrap .login-area::before {
  content: "";
  display: inline-flex;
  width: 28.9rem;
  height: 4.8rem;
  margin: 0 auto;
  background: url("../../images/visual/logo_gangdong_v1.png") no-repeat center;
  background-size: cover;
}
.login-wrap .login-area .title {
  font-size: 3.6rem;
  font-weight: 700;
  color: #222;
}
.login-wrap .login-area .sub-title {
  margin-top: 1.4rem;
  color: #555;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.6rem;
  letter-spacing: -0.018rem;
}
.login-wrap .login-area .sub-title span {
  display: block;
}
.login-wrap .login-area .info-input {
  margin-top: 4rem;
}
.login-wrap .login-area .info-input .input {
  width: 100%;
}
.login-wrap .login-area .info-input .input input[type=text],
.login-wrap .login-area .info-input .input input[type=password] {
  width: 100%;
  max-width: unset;
  height: 5.4rem;
  border: 0;
  border-bottom: 1px solid #dadadf;
}
.login-wrap .login-area .info-input .input + .input {
  margin-top: 1.4rem;
}
.login-wrap .login-area .info-input .check {
  display: flex;
  align-items: center;
  margin-top: 1.6rem;
}
.login-wrap .login-area .info-input .check label {
  font-weight: 500;
}
.login-wrap .login-area .btn-wrap {
  margin-top: 3.4rem;
}
.login-wrap .login-area .btn-wrap button {
  width: 100%;
  height: 5.2rem;
  font-size: 1.8rem;
  font-weight: 600;
}
.login-wrap .login-area .find-area {
  display: flex;
  justify-content: center;
  margin-top: 3.4rem;
}
.login-wrap .login-area .find-area a {
  position: relative;
  color: #555;
  font-weight: 400;
}
.login-wrap .login-area .find-area a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -2.3rem;
  width: 0.2rem;
  height: 1.2rem;
  background: #dadadf;
  transform: translateY(-50%);
}
.login-wrap .login-area .find-area a:last-child::after {
  display: none;
}
.login-wrap .login-area .sns-login {
  margin-top: 5rem;
  text-align: center;
}
.login-wrap .login-area .sns-login .title {
  font-size: 2.4rem;
  font-weight: 600;
  letter-spacing: -0.048rem;
  color: #222;
}
.login-wrap .login-area .sns-login .notice {
  margin-top: 1rem;
  line-height: 140%;
  font-weight: 400;
}
.login-wrap .login-area .sns-login .notice .caution {
  color: #e60001;
}
.login-wrap .login-area .sns-login .btn-wrap {
  margin-top: 3rem;
}
.login-wrap .login-area .sns-login .btn-wrap button {
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 0.2rem;
}
.login-wrap .login-area .sns-login .btn-wrap button::before {
  content: "";
  display: inline-flex;
  width: 2.4rem;
  height: 2.4rem;
  margin-right: 0.6rem;
}
.login-wrap .login-area .sns-login .btn-wrap button.naver {
  background: #10b039;
  color: #fff;
}
.login-wrap .login-area .sns-login .btn-wrap button.naver::before {
  background: url("../../images/icon/icon_sns_naver.png") no-repeat;
  background-size: cover;
}
.login-wrap .login-area .sns-login .btn-wrap button.kakao {
  background: #f7dd11;
  color: #555;
}
.login-wrap .login-area .sns-login .btn-wrap button.kakao::before {
  background: url("../../images/icon/icon_sns_kakao.png") no-repeat;
  background-size: cover;
}
.login-wrap .login-area.find {
  text-align: center;
}
.login-wrap .login-area.find::before {
  display: none;
}
.login-wrap .login-area.find .btn-wrap .btn {
  max-width: 22rem;
  margin: 0 auto;
}
.login-wrap .login-area.complete {
  text-align: center;
}
.login-wrap .login-area.complete::before {
  background: none;
}
.login-wrap .login-area.complete .complete-area {
  margin-top: 2rem;
  padding: 5rem 0;
  background: #f2f4f6;
}
.login-wrap .login-area.complete .complete-area p {
  font-size: 2.4rem;
  color: #222;
  letter-spacing: -0.024rem;
  line-height: 140%;
}
.login-wrap .login-area.complete .complete-area p strong {
  display: inline-block;
  font-weight: 700;
  font-size: 2.4rem;
  vertical-align: middle;
}
.login-wrap .login-area.complete .complete-area p span {
  display: inline-block;
  font-size: 2.4rem;
  font-weight: 600;
  vertical-align: middle;
}
.login-wrap .login-area.complete .btn-wrap .btn {
  max-width: 22rem;
  margin: 0 auto;
}
.login-wrap .login-area.fail {
  text-align: center;
}
.login-wrap .login-area.fail::before {
  width: 10rem;
  height: 10rem;
  background: url("../../images/icon/icon_id_fail.png") no-repeat;
  background-size: cover;
}
.login-wrap .login-area.fail .complete-area {
  margin-top: 2rem;
  padding: 5rem 0;
  background: #f2f4f6;
}
.login-wrap .login-area.fail .complete-area p {
  font-size: 2.4rem;
  color: #222;
  letter-spacing: -0.024rem;
  line-height: 140%;
}
.login-wrap .login-area.fail .complete-area p strong {
  display: inline-block;
  font-weight: 700;
  font-size: 2.4rem;
  vertical-align: middle;
}
.login-wrap .login-area.fail .complete-area p span {
  display: inline-block;
  font-size: 2.4rem;
  font-weight: 600;
  vertical-align: middle;
}
.login-wrap .login-area.fail .btn-wrap .btn {
  max-width: 22rem;
  margin: 0 auto;
}
.login-wrap .find-area {
  display: flex;
  justify-content: center;
  gap: 4rem;
}
.login-wrap .find-area .find-box {
  flex: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 40rem;
  padding: 7rem 5.5rem;
  border: 0.1rem solid #dadadf;
  border-radius: 0.4rem;
  text-align: center;
  box-sizing: border-box;
}
.login-wrap .find-area .find-box::before {
  content: "";
  display: inline-flex;
  width: 10rem;
  height: 10rem;
  margin: 0 auto;
}
.login-wrap .find-area .find-box.history::before {
  background: url("../../images/icon/icon_find_01.png") no-repeat;
  background-size: cover;
}
.login-wrap .find-area .find-box.myself::before {
  background: url("../../images/icon/icon_find_02.png") no-repeat;
  background-size: cover;
}
.login-wrap .find-area .find-box .title {
  margin-top: 2rem;
  font-size: 2.4rem;
  line-height: 140%;
  font-weight: 600;
  letter-spacing: -0.0024rem;
  color: #222;
}
.login-wrap .find-area .find-box span {
  display: block;
  margin-top: 2rem;
  font-size: 1.8rem;
  line-height: 140%;
  letter-spacing: -0.0018rem;
  color: #555;
}
.login-wrap .find-area .find-box:hover {
  border: 0;
  margin: 0.1rem;
  box-shadow: inset 0 0 0 3px #e60001;
}
.login-wrap .authenticate-wrap {
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}
.login-wrap .authenticate-wrap > .title {
  font-size: 3.6rem;
  font-weight: 700;
}
.login-wrap .authenticate-wrap .sub-title {
  margin-top: 1.4rem;
}
.login-wrap .authenticate-wrap .sub-title span {
  display: block;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.0018rem;
}
.login-wrap .authenticate-wrap .receive-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  margin-top: 4rem;
}
.login-wrap .authenticate-wrap .receive-wrap .title {
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.0018rem;
}
.login-wrap .authenticate-wrap .receive-wrap .btn-wrap {
  display: flex;
  justify-content: center;
  gap: 0 1rem;
  margin-top: 1rem;
}
.login-wrap .authenticate-wrap .receive-wrap .btn-wrap button {
  padding: 1rem 1.5rem;
  border-radius: 0.2rem;
  border: 1px solid #222;
}
.login-wrap .authenticate-wrap .find-area {
  margin-top: 4rem;
}
.login-wrap .authenticate-wrap .find-area .find-box {
  padding: 7rem 5.25rem;
}
.login-wrap .authenticate-wrap .find-area .find-box.phone::before {
  background: url("../../images/icon/icon_find_03.png") no-repeat;
  background-size: cover;
}
.login-wrap .authenticate-wrap .find-area .find-box.ipin::before {
  background: url("../../images/icon/icon_find_04.png") no-repeat;
  background-size: cover;
}
.login-wrap .authenticate-wrap .notice-area {
  margin-top: 4rem;
  padding: 2rem;
  background: #f2f4f6;
}
.login-wrap .authenticate-wrap .notice-area ul li {
  padding-left: 1rem;
  text-indent: -1rem;
  text-align: left;
  line-height: 140%;
  letter-spacing: -0.0016rem;
  color: #555;
}
.login-wrap .authenticate-wrap .notice-area ul li::before {
  content: "";
  display: inline-flex;
  top: 50%;
  width: 0.4rem;
  height: 0.4rem;
  margin-right: 0.5rem;
  border-radius: 50%;
  background: #555;
  transform: translateY(-50%);
}
.login-wrap .authenticate-wrap .notice-area ul li span {
  display: block;
  padding-left: 1.2rem;
}

@media (max-width: 1024px) {
  .login-wrap {
    margin-top: 0;
  }
  .login-wrap .login-area {
    padding: 4rem 6rem;
  }
  .login-wrap .find-area {
    width: 100%;
  }
  .login-wrap .find-area .find-box {
    width: 40rem;
  }
  .login-wrap .authenticate-wrap {
    width: 100%;
  }
  .confirm-area > .title {
    word-break: keep-all;
  }
  .confirm-area > .title br {
    display: none;
  }
  .confirm-area .sub-text {
    word-break: keep-all;
  }
  .confirm-area .sub-text br {
    display: none;
  }
  .confirm-area .sub-text strong {
    font-size: inherit;
  }
}
@media (max-width: 768px) {
  .login-wrap .login-area {
    width: 100%;
    min-width: unset;
    padding: 0;
    border: 0;
  }
  .login-wrap .login-area .title {
    font-size: 2.8rem;
  }
  .login-wrap .login-area .sub-title {
    font-size: 1.6rem;
    letter-spacing: -0.08rem;
  }
  .login-wrap .login-area .info-input {
    margin-top: 3.4rem;
  }
  .login-wrap .login-area .btn-wrap {
    margin-top: 3.4rem;
  }
  .login-wrap .login-area .btn-wrap .btn {
    width: 100%;
    max-width: unset;
  }
  .login-wrap .login-area:before {
    width: 20rem;
    height: 4.5rem;
    background-size: 100%;
  }
  .login-wrap .login-area .find-area {
    margin-top: 2rem;
    flex-direction: row;
    flex-wrap: wrap;
  }
  .login-wrap .login-area .find-area a + a {
    margin-left: 2rem;
  }
  .login-wrap .login-area .sns-login {
    margin-top: 4rem;
  }
  .login-wrap .login-area .sns-login .title {
    font-size: 2rem;
  }
  .login-wrap .login-area .sns-login .btn-wrap {
    flex-direction: column;
  }
  .login-wrap .login-area.complete:before {
    display: none;
  }
  .login-wrap .login-area.complete .btn-wrap .btn {
    width: 100%;
    max-width: unset;
  }
  .login-wrap .login-area.fail .btn-wrap .btn {
    width: 100%;
    max-width: unset;
  }
  .login-wrap .find-area {
    flex-direction: column;
    align-items: center;
    gap: 2rem;
  }
  .login-wrap .find-area .find-box {
    width: 100%;
    padding: 4rem 0;
  }
  .login-wrap .find-area .find-box:before {
    width: 8rem;
    height: 8rem;
  }
  .login-wrap .find-area .find-box .title {
    font-size: 2rem;
  }
  .login-wrap .find-area .find-box span {
    margin-top: 1rem;
    font-size: 1.6rem;
  }
  .login-wrap .authenticate-wrap > .title {
    font-size: 2.8rem;
  }
  .login-wrap .authenticate-wrap .sub-title span {
    font-size: 1.6rem;
  }
  .login-wrap .authenticate-wrap .receive-wrap .btn-wrap {
    flex-direction: column;
  }
  .login-wrap .authenticate-wrap .receive-wrap .btn-wrap button + button {
    margin-top: 1rem;
  }
}
.confirm-area {
  max-width: 84rem;
  margin: 7rem auto 0;
  color: #555;
}
.confirm-area > .title {
  line-height: 120%;
  color: #222;
  font-size: 3.6rem;
  font-weight: 700;
  text-align: center;
}
.confirm-area .sub-text {
  font-size: 1.9rem;
  margin-top: 1.4rem;
  text-align: center;
  line-height: 160%;
}
.confirm-area .sub-text strong {
  vertical-align: baseline;
}
.confirm-area .red {
  margin-top: 3.2rem;
  color: #e60001;
  text-align: center;
  font-weight: 400;
  line-height: 120%;
}
.confirm-area .gray-text-area {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  margin-top: 3.2rem;
  padding: 2.4rem 2.4rem 3.2rem;
}
.confirm-area .gray-text-area::after {
  display: none;
}
.confirm-area .gray-text-area .title {
  max-width: 100%;
  margin: 0;
  padding: 0;
  color: #1a71ea;
  text-indent: 0;
}
.confirm-area .gray-text-area ul {
  margin-top: 1rem;
}
.confirm-area .gray-text-area ul li {
  position: relative;
  padding-left: 1.4rem;
  font-weight: 400;
  font-size: 1.9rem;
  line-height: 1.6;
  letter-spacing: -0.016rem;
}
.confirm-area .gray-text-area ul li::before {
  content: "";
  position: absolute;
  top: 1.2rem;
  left: 0;
  width: 0.6rem;
  height: 0.6rem;
  background: #555;
  border-radius: 50%;
}

.untact-area {
  max-width: 84rem;
  margin: 3rem auto 0;
}
.untact-area > .title {
  font-size: 3.6rem;
  font-weight: 700;
  text-align: center;
}
.untact-area > .sub-title {
  padding-top: 1.4rem;
  color: #555;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.6rem;
  letter-spacing: -0.018rem;
  text-align: center;
  word-break: keep-all;
}
.untact-area .choice-area {
  display: flex;
  justify-content: center;
  gap: 4rem;
  padding-top: 4rem;
}
.untact-area .choice-area .choice-box {
  flex: 0 0 calc(50% - 2rem);
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  max-width: 40rem;
  width: 100%;
  min-height: 40rem;
  padding: 4rem 2rem;
  border-radius: 0.4rem;
  border: 0.1rem solid #dadadf;
  text-align: center;
  box-sizing: border-box;
}
.untact-area .choice-area .choice-box .sub-title {
  padding-top: 1.2rem;
  color: #222;
  font-size: 2.4rem;
  font-weight: 600;
  letter-spacing: -0.024rem;
  text-align: center;
}
.untact-area .choice-area .choice-box p {
  padding-top: 1rem;
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 140%;
  letter-spacing: -0.064rem;
  text-align: center;
  word-break: keep-all;
}
.untact-area .choice-area .choice-box .btn-wrap {
  gap: 0.8rem;
  margin-top: 0;
  padding-top: 2.4rem;
}
.untact-area .choice-area .choice-box::before {
  content: "";
  display: inline-flex;
}
.untact-area .choice-area .choice-box:first-child::before {
  width: 10rem;
  height: 10rem;
  background: url("../../images/icon/icon_join_citizen.png") no-repeat 0 0;
  background-size: cover;
}
.untact-area .choice-area .choice-box:last-child::before {
  width: 20rem;
  height: 10rem;
  background: url("../../images/icon/icon_join_company.png") no-repeat 0 0;
  background-size: cover;
}
.untact-area .service-area {
  margin-top: 0;
  padding-top: 2rem;
}
.untact-area .service-area .service-list .service-item {
  gap: 1.4rem;
}
.untact-area .service-area .service-list .service-item .title {
  gap: 1rem;
  max-width: 21rem;
  width: 100%;
  margin-right: 0;
}
.untact-area .service-area .service-list .service-item .title::before {
  margin-right: 0;
}
.untact-area .service-area .service-list .service-item .title span {
  font-weight: 700;
  font-size: 2.7rem;
}
.untact-area .service-area .service-list .service-item .text-area {
  width: 100%;
}
.untact-area .service-area .service-list .service-item .text-area p + p {
  margin-top: 0;
  padding-top: 0.4rem;
}
.untact-area .service-area .service-list .service-item .text-area .message {
  color: #1a71ea;
}
.untact-area .service-area .service-list .service-item .text-area .table-area {
  margin-top: 0;
}
.untact-area .service-area .service-list .service-item .text-area .table-area table thead th {
  border-top: 0.1rem solid #929292;
  border-right: 0;
  border-bottom: 0;
  font-weight: 600;
  font-size: 1.9rem;
  line-height: 1.4;
}
.untact-area .service-area .service-list .service-item .text-area .table-area table tbody td {
  font-weight: 400;
  font-size: 1.9rem;
  line-height: 1.4;
  text-align: center;
  word-break: keep-all;
}
.untact-area .service-area .service-list .service-item .text-area .table-area table tbody td:first-child {
  border-left: 0;
}
.untact-area .service-area .service-list .service-item .text-area .table-area table tbody td:last-child {
  border-right: 0;
}
.untact-area .service-area .service-list .service-item .text-area .table-area + p {
  padding-top: 0.8rem;
}
.untact-area .service-area .service-list .service-item .text-area .table-area + p + p {
  padding-top: 0.8rem;
}
.untact-area .terms-area .accordion-area .accordion-title {
  padding: 1.4rem 0;
}
.untact-area .terms-area .accordion-area .accordion-title label {
  font-weight: 500;
  font-size: 2.4rem;
}
.untact-area .terms-area .accordion-area .accordion-title label .red {
  margin-left: 0.4rem;
  font-weight: 500;
  font-size: 2.4rem;
}
.untact-area .terms-area .accordion-area .accordion-title .btn::after {
  margin: 1.6rem 1.2rem;
}
.untact-area .terms-area .accordion-area .accordion-content {
  border-bottom: 0.1rem solid #dadadf;
}
.untact-area .terms-area .accordion-area .accordion-content .text-box p {
  font-weight: 400;
  font-size: 1.9rem;
  line-height: 140%;
}
.untact-area .terms-area .accordion-area .accordion-content .text-box p.title {
  margin-top: 0;
  font-weight: 700;
  font-size: 1.9rem;
  line-height: 1.4;
}
.untact-area .terms-area .accordion-area .accordion-content .text-box p.red {
  padding-top: 1rem;
  color: #DB3B26;
  font-weight: 400;
  font-size: 1.7rem;
}
.untact-area .terms-area .accordion-area .accordion-content .text-box + .text-box {
  margin-top: 2rem;
}
.untact-area .terms-area .accordion-area .accordion-content .text-box .dot-list {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.untact-area .terms-area .accordion-area .accordion-content .text-box .dot-list li {
  position: relative;
  padding-left: 1.4rem;
  color: #555;
  font-weight: 400;
  font-size: 1.9rem;
  line-height: 1.8;
}
.untact-area .terms-area .accordion-area .accordion-content .text-box .dot-list li::before {
  content: "";
  position: absolute;
  top: 1.4rem;
  left: 0;
  width: 0.6rem;
  height: 0.6rem;
  background: #555;
  border-radius: 50%;
}
.untact-area .terms-area .accordion-area .accordion-content .table-area table {
  border-top: 0.1rem solid #929292;
  text-align: center;
}
.untact-area .terms-area .accordion-area .accordion-content .table-area table thead th {
  padding: 0.6rem 0;
  border-right: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  color: #222;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.016rem;
}
.untact-area .terms-area .accordion-area .accordion-content .table-area table thead th:last-child {
  border-right: 0;
}
.untact-area .terms-area .accordion-area .accordion-content .table-area table tbody td {
  padding: 0.6rem 1.4rem;
  border-right: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  background-color: #fff;
  font-weight: 400;
  line-height: 140%;
  color: #555;
  letter-spacing: -0.016rem;
  text-align: center;
}
.untact-area .terms-area .accordion-area .accordion-content .table-area table tbody td:last-child {
  border-right: 0;
}
.untact-area .terms-area .accordion-area .accordion-content .table-area.mt14 {
  margin-top: 1.4rem;
}
.untact-area .member-input .form-input {
  margin-top: 0;
  padding-top: 5rem;
}
.untact-area .member-input .form-input .form-area {
  margin-top: 1rem;
}
.untact-area .member-input .form-input .form-area .input-box {
  gap: 1.5rem;
  min-height: 8rem;
  padding: 1.5rem 1.5rem 1.5rem 0;
  box-sizing: border-box;
}
.untact-area .member-input .form-input .form-area .input-box .title {
  max-width: 20rem;
  width: 100%;
}
.untact-area .member-input .form-input .form-area .input-box .title + div {
  width: 100%;
  padding: 0;
}
.untact-area .member-input .form-input .form-area .input-box .file .file-help {
  color: #929292;
  font-weight: 500;
  font-size: 1.6rem;
}
.untact-area .member-input .form-input .form-area .input-two {
  width: 100%;
  padding-left: 0;
}
.untact-area .member-input .form-input .etc {
  margin-top: 0;
  padding-top: 3rem;
  font-size: 1.6rem;
  line-height: 1.4;
  word-break: keep-all;
}
.untact-area + .btn-wrap {
  margin-top: 0;
  padding-top: 4rem;
}
.untact-area .untact-complete {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 56rem;
  padding: 6rem 7rem;
  margin: 0 auto;
  border-radius: 0.4rem;
  border: 0.1rem solid #dadadf;
  text-align: center;
  box-sizing: border-box;
}
.untact-area .untact-complete .title {
  color: #222;
  font-size: 3.6rem;
  font-weight: 700;
}
.untact-area .untact-complete .sub-title {
  margin-top: 1.4rem;
  color: #555;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.6rem;
  letter-spacing: -0.018rem;
}
.untact-area .untact-complete .complete-info {
  display: flex;
  flex-direction: column;
  padding: 2rem;
  margin-top: 2rem;
  border-radius: 0.4rem;
  background: #f4f4f4;
}
.untact-area .untact-complete .complete-info .info-title {
  color: #1a71ea;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 140%;
}
.untact-area .untact-complete .complete-info .info-content {
  display: flex;
  justify-content: center;
  margin-top: 2rem;
}
.untact-area .untact-complete .complete-info .info-content dl {
  display: flex;
}
.untact-area .untact-complete .complete-info .info-content dl dt {
  margin-right: 1rem;
  font-weight: 600;
}
.untact-area .untact-complete .complete-info .info-content dl dd {
  font-weight: 400;
}
.untact-area .untact-complete .complete-info .info-content dl:last-child {
  margin-left: 4rem;
}
.untact-area .untact-complete .caution-list {
  margin-top: 2rem;
  text-align: left;
}
.untact-area .untact-complete .caution-list li {
  color: #555;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.016rem;
  text-indent: -1rem;
  padding-left: 1rem;
}

.date-filter {
  display: flex;
  flex-direction: column;
  padding: 1.6rem 6rem;
  margin-bottom: 2rem;
  background: #f4f4f4;
  gap: 0.6rem;
}
.date-filter .select {
  width: 35%;
}
.date-filter .select select {
  width: 100%;
}

.date-select {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: calc(100% - 9rem);
}
.date-select .title {
  width: 9rem;
  font-size: 1.5rem;
  color: #222;
  line-height: 140%;
  font-weight: 500;
}
.date-select .button-area {
  display: flex;
  gap: 0 0.6rem;
}
.date-select .button-area button {
  height: 3.2rem;
  min-width: 7.2rem;
  padding: 0 1.4rem;
  border-radius: 0.2rem;
  border: 0.1rem solid #dadadf;
  background: #fff;
  font-size: 1.5rem;
  font-weight: 500;
  box-sizing: border-box;
}
.date-select .button-area button.on, .date-select .button-area button:hover {
  background: #4d4d4d;
  color: #fff;
}
.date-select .input {
  display: flex;
  align-items: center;
  gap: 0 0.4rem;
  width: 30%;
}
.date-select .input input[type=date] {
  width: 100%;
}
.date-select .btn-wrap {
  display: flex;
  margin-top: 0;
}
.date-select .btn-wrap .refresh {
  width: 4rem;
  height: 4rem;
  border: 0.1rem solid #dadadf;
  border-radius: 0.2rem;
  background: #fff;
}
.date-select .btn-wrap .refresh:before {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  background: url("../../images/icon/icon_refresh.png") no-repeat 0 0;
  background-size: cover;
}

.book-carrier .form-input {
  margin-top: 0;
  padding-top: 0;
}
.book-carrier .form-input .title-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.book-carrier .form-input .title-area p.title {
  font-size: 2.2rem;
  font-weight: 600;
  line-height: 140%;
  color: #222;
}

.favorite-area .search-area input[type=text],
.favorite-area .search-area input[type=password],
.favorite-area .search-area input[type=date],
.favorite-area .search-area select {
  width: 19rem;
}
.favorite-area .search-area .input-box .input input {
  width: 34rem;
}
.favorite-area .common-table-wrap .table-content .table-box {
  display: flex;
}
.favorite-area .common-table-wrap .table-content .table-box .book-thumbnail {
  max-width: 8rem;
  max-height: 11.9rem;
}
.favorite-area .common-table-wrap .table-content .table-box .book-thumbnail img {
  width: 100%;
  height: 100%;
}
.favorite-area .common-table-wrap .table-content .table-box .info-wrap {
  margin-left: 2rem;
}

.program-detail.myprogram .detail-area .top-area .info-area {
  position: relative;
}
.program-detail.myprogram .detail-area .top-area .info-area .btn-wrap {
  position: absolute;
  bottom: 0;
  right: 0;
  margin-top: 0;
}

.family-area .tab-wrap .view-area .view > .title {
  font-size: 3.9rem;
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
}
.family-area .tab-wrap .view-area .view > .sub-title {
  padding-top: 1.4rem;
  color: #555;
  font-size: 1.9rem;
  font-weight: 400;
  line-height: 1.6;
  letter-spacing: -0.016rem;
  text-align: center;
  word-break: keep-all;
}
.family-area .tab-wrap .view-area .view > .message {
  padding-top: 3.2rem;
  color: #1a71ea;
  font-size: 1.7rem;
  font-weight: 400;
  line-height: 1.4;
  text-align: center;
}
.family-area .tab-wrap .view-area .view .consent-info {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  padding: 2.4rem 2.4rem 3.2rem;
  margin-top: 3.2rem;
  border-radius: 0.4rem;
  background: #f4f4f4;
}
.family-area .tab-wrap .view-area .view .consent-info .info-title {
  color: #1a71ea;
  font-size: 1.9rem;
  font-weight: 600;
  line-height: 1.4;
  word-break: keep-all;
}
.family-area .tab-wrap .view-area .view .consent-info .info-content {
  display: flex;
}
.family-area .tab-wrap .view-area .view .consent-info .info-content .consent-list li span {
  color: #555;
  font-size: 1.9rem;
  font-weight: 400;
  line-height: 1.6;
  word-break: keep-all;
}
.family-area .tab-wrap .view-area .view .consent-info .info-content .consent-list li span::before {
  content: "";
  position: relative;
  top: -0.4rem;
  display: inline-flex;
  width: 0.6rem;
  height: 0.6rem;
  margin-right: 0.8rem;
  background: #555;
  border-radius: 50%;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-title {
  padding: 1.4rem 0;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-title label {
  font-weight: 500;
  font-size: 1.9rem;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-title label .red {
  margin-left: 0.4rem;
  font-weight: 500;
  font-size: 1.9rem;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-title .btn::after {
  margin: 1.6rem 1.2rem;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content {
  border-bottom: 0.1rem solid #dadadf;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content .text-box p {
  margin: 2rem 0;
  line-height: 140%;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content .text-box p.title {
  margin-top: 0;
  margin-bottom: 2rem;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content .text-box p.red {
  color: #DB3B26;
  font-weight: 400;
  font-size: 1.7rem;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content .text-box + .text-box {
  margin-top: 2rem;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content .table-area table {
  border-top: 0.1rem solid #929292;
  text-align: center;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content .table-area table thead th {
  padding: 0.6rem 0;
  border-right: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  color: #222;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.016rem;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content .table-area table thead th:last-child {
  border-right: 0;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content .table-area table tbody td {
  padding: 0.6rem 1.4rem;
  border-right: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  background-color: #fff;
  font-weight: 400;
  line-height: 140%;
  color: #555;
  letter-spacing: -0.016rem;
  text-align: center;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content .table-area table tbody td:last-child {
  border-right: 0;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content .table-area.mt14 {
  margin-top: 1.4rem;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content p {
  font-weight: 400;
}
.family-area .tab-wrap .view-area .view .terms-area .accordion-area .accordion-content .fw-600 {
  font-weight: 600;
  font-size: 1.9rem;
  line-height: 180%;
  letter-spacing: -0.028rem;
  vertical-align: baseline;
}
.family-area .tab-wrap .view-area .view .etc {
  padding-top: 4rem;
  color: #222;
  font-size: 1.7rem;
  font-weight: 400;
  line-height: 1.8;
  text-align: center;
}

.common-table-wrap .top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  margin-top: 3rem;
}
.common-table-wrap .top .count-area {
  font-size: 1.8rem;
  line-height: 140%;
  color: #222;
}
.common-table-wrap .top .count-area .point {
  margin: 0 0.4rem;
  font-size: 1.8rem;
  font-weight: 700;
  color: #e60001;
}
.common-table-wrap .top .select {
  width: 10rem;
}
.common-table-wrap .top .select select {
  width: 100%;
}
.common-table-wrap .table-content {
  margin-top: 1rem;
  border-top: 0.2rem solid #555;
}
.common-table-wrap .table-content .table-box {
  position: relative;
  display: block;
  padding: 2.4rem 0 3.2rem 3.4rem;
  border-bottom: 0.1rem solid #dadadf;
  box-sizing: border-box;
}
.common-table-wrap .table-content .table-box .info-box {
  display: flex;
  align-items: center;
  gap: 0 0.8rem;
  margin-bottom: 1.5rem;
}
.common-table-wrap .table-content .table-box .info-box .date {
  color: #555;
  font-size: 1.6rem;
  font-weight: 600;
  line-height: 110%;
  letter-spacing: -0.032rem;
}
.common-table-wrap .table-content .table-box .info-box .error {
  font-weight: 500;
}
.common-table-wrap .table-content .table-box .book-name {
  position: relative;
  left: -3.4rem;
  width: 80%;
}
.common-table-wrap .table-content .table-box .book-name .title {
  font-size: 2rem;
  line-height: 140%;
  color: #222;
  font-weight: 600;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.common-table-wrap .table-content .table-box .book-name .check label,
.common-table-wrap .table-content .table-box .book-name .check span {
  padding-left: 3.4rem;
  font-size: 2rem;
  line-height: 140%;
  color: #222;
  font-weight: 600;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.common-table-wrap .table-content .table-box .book-name .check input[type=checkbox] + label::before {
  top: 50%;
  transform: translateY(-50%);
}
.common-table-wrap .table-content .table-box .book-name > strong {
  font-weight: 600;
}
.common-table-wrap .table-content .table-box .book-name span {
  font-weight: 400;
}
.common-table-wrap .table-content .table-box .book-name strong,
.common-table-wrap .table-content .table-box .book-name span {
  font-size: 2rem;
}
.common-table-wrap .table-content .table-box .etc-info {
  margin-top: 0.8rem;
}
.common-table-wrap .table-content .table-box .etc-info ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 1rem 2.4rem;
}
.common-table-wrap .table-content .table-box .etc-info ul li {
  position: relative;
}
.common-table-wrap .table-content .table-box .etc-info ul li span {
  line-height: 140%;
  font-weight: 600;
}
.common-table-wrap .table-content .table-box .etc-info ul li span.info-title {
  margin-right: 1.2rem;
  font-weight: 400;
}
.common-table-wrap .table-content .table-box .etc-info ul li span.state {
  width: 8rem;
  padding: 0.4rem 1rem;
  color: #fff;
  font-weight: 700;
  letter-spacing: -0.064rem;
}
.common-table-wrap .table-content .table-box .etc-info ul li span.state.red {
  background: #f74e37;
}
.common-table-wrap .table-content .table-box .etc-info ul li span.state.green {
  background: #14874e;
}
.common-table-wrap .table-content .table-box .etc-info ul li span.state.gray {
  background: #555;
}
.common-table-wrap .table-content .table-box .etc-info ul li span.text {
  color: #555;
}
.common-table-wrap .table-content .table-box .etc-info ul li:after {
  content: "";
  position: absolute;
  top: 50%;
  right: -1.2rem;
  width: 0.1rem;
  height: 1rem;
  background: #eaeaef;
  transform: translateY(-50%);
}
.common-table-wrap .table-content .table-box .etc-info ul li:last-child:after {
  display: none;
}
.common-table-wrap .table-content .table-box .etc-info ul + ul {
  margin-top: 0.6rem;
}
.common-table-wrap .table-content .table-box .btn-wrap {
  position: absolute;
  right: 0;
  top: 50%;
  flex-direction: column;
  margin-top: 0;
  transform: translateY(-50%);
}
.common-table-wrap .table-content .table-box .btn-wrap .btn {
  height: 4rem;
}
.common-table-wrap .table-content .table-box:hover .book-name .check label, .common-table-wrap .table-content .table-box:focus .book-name .check label {
  text-decoration: underline;
}
.common-table-wrap .table-content.pd0 .table-box {
  padding: 2.4rem 0;
}
.common-table-wrap .table-content.pd0 .table-box .book-name {
  left: 0;
}
.common-table-wrap .table-content.pd0 .table-box .book-name span {
  padding-left: 0;
}
.common-table-wrap .info-box .status {
  display: inline-flex;
  min-width: 6.6rem;
  padding: 0.5rem 1rem;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  border-radius: 0.8rem;
  font-weight: 600;
  box-sizing: border-box;
}
.common-table-wrap .info-box .status.green {
  background: rgba(20, 135, 78, 0.1);
  color: #14874e;
}
.common-table-wrap .info-box .status.blue {
  background: rgba(26, 113, 234, 0.1);
  color: #1a71ea;
}
.common-table-wrap .info-box .status.red {
  background: rgba(219, 59, 38, 0.1);
  color: #db3b26;
}
.common-table-wrap .info-box .status.gray {
  background: rgba(53, 53, 53, 0.1);
  color: #555;
}
.common-table-wrap .info-box .status.yellow {
  background: rgba(158, 109, 18, 0.1);
  color: #9e6d12;
}

.profiledit-area {
  padding: 0 13rem;
}
.profiledit-area .edit-area {
  display: flex;
  flex-direction: column;
  justify-content: center;
  max-width: 44rem;
  margin: 4rem auto 0;
  padding: 6rem;
  border: 0.1rem solid #dadadf;
  text-align: center;
}
.profiledit-area .edit-area .title {
  color: #222;
  font-size: 3.6rem;
  font-weight: 700;
}
.profiledit-area .edit-area .sub-title {
  display: block;
  margin-top: 1.4rem;
  color: #555;
  font-size: 1.8rem;
  font-weight: 400;
  line-height: 2.6rem;
  letter-spacing: -0.018rem;
}
.profiledit-area .edit-area .input {
  width: 100%;
  margin-top: 2rem;
  border-bottom: 0.1rem solid #dadadf;
}
.profiledit-area .edit-area .input input[type=text],
.profiledit-area .edit-area .input input[type=password] {
  width: 100%;
  padding: 1.6rem 0;
  border: 0;
}
.profiledit-area .edit-area .input + .input {
  margin-top: 1.4rem;
}
.profiledit-area .edit-area .btn-wrap {
  margin-top: 3.4rem;
}
.profiledit-area .edit-info .list {
  padding: 3rem 4rem;
  border-radius: 0.4rem;
  background: #f4f4f4;
}
.profiledit-area .edit-info .list .main-title {
  display: block;
  width: 100%;
  color: #1a71ea;
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 140%;
}
.profiledit-area .edit-info .list ul {
  display: flex;
  flex-wrap: wrap;
  margin-top: 2rem;
}
.profiledit-area .edit-info .list ul li {
  width: 50%;
}
.profiledit-area .edit-info .list ul li .info-title {
  display: inline-block;
  width: 6rem;
  margin-right: 2rem;
  color: #222;
  font-weight: 600;
  line-height: 140%;
}
.profiledit-area .edit-info .list ul li .text {
  color: #222;
  font-weight: 400;
  line-height: 140%;
}
.profiledit-area .edit-info .list ul li.w100 {
  width: 100%;
}
.profiledit-area .edit-info .list ul li + li {
  margin-top: 1rem;
}
.profiledit-area .edit-info .list ul li:nth-of-type(2) {
  margin-top: 0;
}
.profiledit-area .notice-area {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
  padding: 6rem;
  border: 0.1rem solid #dadadf;
}
.profiledit-area .notice-area .title {
  color: #222;
  font-size: 3.6rem;
  font-weight: 700;
}
.profiledit-area .notice-area .sub-title {
  margin-top: 1.6rem;
  color: #555;
  font-weight: 400;
  line-height: 2.6rem;
  letter-spacing: -0.016rem;
}
.profiledit-area .notice-area .sub-title.line {
  padding-bottom: 2.4rem;
  border-bottom: 0.1rem solid #dadadf;
}
.profiledit-area .notice-area ul {
  margin-top: 3rem;
}
.profiledit-area .notice-area ul li {
  color: #555;
  font-weight: 400;
  line-height: 2.6rem;
  letter-spacing: -0.016rem;
}
.profiledit-area .notice-area .check {
  margin-top: 4rem;
}
.profiledit-area .notice-area.hangout {
  max-width: 100rem;
  margin: 0 auto;
}
.profiledit-area .notice-area.hangout ul {
  margin-top: 2.4rem;
}
.profiledit-area .notice-area.hangout ul > li {
  text-align: left;
}
.profiledit-area .notice-area.hangout .gray-text-area {
  flex-wrap: wrap;
  margin-top: 2.4rem;
  padding: 3rem 4rem;
}
.profiledit-area .notice-area.hangout .gray-text-area .blue {
  display: block;
  width: 100%;
  color: #1a71ea;
  text-align: left;
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 140%;
}
.profiledit-area .notice-area.hangout .gray-text-area ul {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.profiledit-area .notice-area.hangout .gray-text-area ul li {
  display: flex;
  gap: 0 2rem;
}
.profiledit-area .notice-area.hangout .gray-text-area ul li span {
  display: inline-block;
  line-height: 140%;
  color: #222;
}
.profiledit-area .notice-area.hangout .gray-text-area ul li .bold {
  width: 8rem;
  font-weight: 600;
}

@media (max-width: 1340px) {
  .hope-area .search-area .input-box .select,
  .favorite-area .search-area .input-box .select,
  .facility-area .search-area .input-box .select {
    width: 12rem;
  }
  .hope-area .search-area .input-box .select select,
  .favorite-area .search-area .input-box .select select,
  .facility-area .search-area .input-box .select select {
    width: 100%;
  }
  .hope-area .search-area .input-box .input input[type=text],
  .favorite-area .search-area .input-box .input input[type=text],
  .facility-area .search-area .input-box .input input[type=text] {
    width: 20rem;
  }
}
@media (max-width: 1024px) {
  .choice-area .choice-box {
    flex: 0 0 calc(50% - 2rem);
    max-width: 35rem;
  }
  .choice-area .choice-box .btn-wrap {
    flex-direction: column;
    width: 100%;
  }
  .profiledit-area {
    padding: 0;
  }
  .hope-area .search-area,
  .favorite-area .search-area,
  .facility-area .search-area,
  .myquestion-area .search-area {
    display: block;
    width: 100%;
    padding: 1.6rem;
    box-sizing: border-box;
  }
  .hope-area .search-area .input-box .select,
  .favorite-area .search-area .input-box .select,
  .facility-area .search-area .input-box .select,
  .myquestion-area .search-area .input-box .select {
    width: 100%;
    max-width: 100%;
    margin-top: 0.6rem;
  }
  .hope-area .search-area .input-box .select select,
  .favorite-area .search-area .input-box .select select,
  .facility-area .search-area .input-box .select select,
  .myquestion-area .search-area .input-box .select select {
    width: 100%;
  }
  .hope-area .search-area .input-box .input,
  .favorite-area .search-area .input-box .input,
  .facility-area .search-area .input-box .input,
  .myquestion-area .search-area .input-box .input {
    margin-top: 0.6rem;
  }
  .hope-area .search-area .input-box .input input[type=text],
  .favorite-area .search-area .input-box .input input[type=text],
  .facility-area .search-area .input-box .input input[type=text],
  .myquestion-area .search-area .input-box .input input[type=text] {
    width: calc(100% - 12rem);
  }
  .myprogram-list .search-area {
    display: block;
    width: 100%;
    padding: 1.6rem;
    box-sizing: border-box;
  }
  .myprogram-list .search-area .input-box {
    width: 100% !important;
  }
  .myprogram-list .search-area .input-box .select {
    width: 100%;
    max-width: 100%;
    margin-top: 0.6rem;
  }
  .myprogram-list .search-area .input-box .select select {
    width: 100%;
  }
  .myprogram-list .search-area .input-box .input {
    margin-top: 0.6rem;
  }
  .myprogram-list .search-area .input-box .input input[type=text] {
    width: calc(100% - 12rem);
  }
}
@media (max-width: 768px) {
  .untact-area {
    max-width: unset;
  }
  .untact-area > .title {
    font-size: 2.4rem;
    word-break: keep-all;
  }
  .untact-area > .sub-title {
    margin: 1rem 0 4rem;
    font-size: 1.6rem;
  }
  .untact-area .choice-area {
    flex-direction: column;
    align-items: center;
    gap: 2rem;
  }
  .untact-area .choice-area .choice-box {
    flex: 1;
    width: 100%;
    padding: 3rem 2rem;
  }
  .untact-area .choice-area .choice-box:first-child::before {
    width: 6rem;
    height: 6rem;
  }
  .untact-area .choice-area .choice-box:last-child::before {
    width: 12rem;
    height: 6rem;
  }
  .untact-area .choice-area .choice-box .sub-title {
    font-size: 2rem;
  }
  .untact-area .service-area .service-list .service-item {
    flex-direction: column;
  }
  .untact-area .untact-complete {
    width: 100%;
    max-width: unset;
    padding: 0;
    border: 0;
  }
  .untact-area .untact-complete .title {
    font-size: 2.4rem;
  }
  .untact-area .untact-complete .sub-title {
    font-size: 1.6rem;
  }
  .untact-area .untact-complete .complete-info .info-content {
    display: block;
    margin-top: 0;
  }
  .untact-area .untact-complete .complete-info .info-content dl {
    justify-content: center;
    margin-top: 1rem;
  }
  .untact-area .untact-complete .complete-info .info-content dl:last-child {
    margin: 0.4rem 0 0 0;
  }
  .btn-wrap {
    display: flex;
  }
  .btn-wrap .btn + .btn {
    margin-top: 0;
  }
  .profiledit-area {
    padding: 0;
    box-sizing: border-box;
  }
  .profiledit-area .edit-area {
    max-width: unset;
    border: 0;
    padding: 0;
  }
  .profiledit-area .edit-area .title {
    font-size: 2.4rem;
  }
  .profiledit-area .edit-area .sub-title {
    font-size: 1.6rem;
  }
  .profiledit-area .edit-info .list {
    padding: 3rem 2rem;
  }
  .profiledit-area .edit-info .list ul {
    display: block;
  }
  .profiledit-area .edit-info .list ul li {
    width: 100%;
  }
  .profiledit-area .edit-info .list ul li + li {
    margin-top: 0.8rem;
  }
  .profiledit-area .edit-info .list ul li:nth-of-type(2) {
    margin-top: 0.8rem;
  }
  .profiledit-area .edit-info .list ul li .info-title {
    width: 8rem;
    vertical-align: top;
  }
  .profiledit-area .edit-info .list ul li .text {
    display: inline-block;
    width: calc(100% - 11rem);
  }
  .profiledit-area .edit-info .list ul li.w100 {
    width: auto;
  }
  .profiledit-area .notice-area {
    border: 0;
    padding: 2rem 0;
  }
  .profiledit-area .notice-area .title {
    font-size: 2.4rem;
  }
  .profiledit-area .notice-area .sub-title {
    font-size: 1.6rem;
  }
  .profiledit-area .notice-area ul {
    margin-top: 2rem;
  }
  .profiledit-area .notice-area .gray-text-area ul {
    flex-direction: column;
    gap: 0.8rem;
  }
  .common-table-wrap .top .count-area {
    font-size: 1.6rem;
  }
  .common-table-wrap .top .count-area .point {
    font-size: 1.6rem;
  }
  .common-table-wrap .table-content .table-box .book-name {
    width: 100%;
  }
  .common-table-wrap .table-content .table-box .book-name strong,
  .common-table-wrap .table-content .table-box .book-name span {
    display: block;
    font-size: 1.6rem;
  }
  .common-table-wrap .table-content .table-box .book-name span {
    margin-top: 0.5rem;
  }
  .common-table-wrap .table-content .table-box .book-name .check label,
  .common-table-wrap .table-content .table-box .book-name .check span {
    font-size: 1.6rem;
  }
  .common-table-wrap .table-content .table-box .etc-info ul {
    display: block;
  }
  .common-table-wrap .table-content .table-box .etc-info ul li {
    width: 100%;
  }
  .common-table-wrap .table-content .table-box .etc-info ul li span {
    display: inline-block;
  }
  .common-table-wrap .table-content .table-box .etc-info ul li span.info-title {
    width: 8rem;
    font-size: 1.5rem;
  }
  .common-table-wrap .table-content .table-box .etc-info ul li span.text {
    width: calc(100% - 10rem);
    font-size: 1.5rem;
  }
  .common-table-wrap .table-content .table-box .etc-info ul li::after {
    display: none;
  }
  .common-table-wrap .table-content .table-box .etc-info ul + ul li {
    margin-top: 0.6rem;
  }
  .common-table-wrap .table-content .table-box .btn-wrap {
    position: static;
    margin-top: 1rem;
    transform: unset;
    -webkit-transform: unset;
    -moz-transform: unset;
    -ms-transform: unset;
    -o-transform: unset;
  }
  .common-table-wrap .table-content .table-box .info-box {
    margin-bottom: 1.2rem;
  }
  .common-table-wrap .table-content .table-box .info-box .date {
    font-size: 1.5rem;
  }
  .date-filter {
    padding: 1.6rem 2rem 0.4rem 2rem;
  }
  .date-filter .date-select {
    flex-wrap: wrap;
    width: 100%;
    margin-bottom: 1.2rem;
  }
  .date-filter .date-select .title {
    width: 100%;
  }
  .date-filter .date-select .button-area {
    flex-wrap: wrap;
    width: 100%;
  }
  .date-filter .date-select .button-area button {
    width: 31.7%;
    margin-top: 0.6rem;
  }
  .date-filter .date-select .input {
    flex-wrap: wrap;
    margin-top: 0.6rem;
    width: 100%;
  }
  .date-filter .date-select .input input[type=date] {
    flex: 1;
    width: 100%;
    margin-top: 0.4rem;
  }
  .date-filter .date-select .btn-wrap {
    justify-content: center;
    width: 100%;
    margin-top: 1rem;
  }
  .date-filter .date-select .btn-wrap .btn {
    width: calc(100% - 5rem);
  }
  .hope-area #panel1 .date-filter,
  .hope-area #panel2 .date-filter,
  .hope-area #panel3 .date-filter,
  .favorite-area #panel1 .date-filter,
  .favorite-area #panel2 .date-filter,
  .favorite-area #panel3 .date-filter,
  .facility-area #panel1 .date-filter,
  .facility-area #panel2 .date-filter,
  .facility-area #panel3 .date-filter {
    flex-direction: column;
    padding: 1.6rem 2rem 0.4rem 2rem;
  }
  .hope-area #panel1 .date-filter select,
  .hope-area #panel2 .date-filter select,
  .hope-area #panel3 .date-filter select,
  .favorite-area #panel1 .date-filter select,
  .favorite-area #panel2 .date-filter select,
  .favorite-area #panel3 .date-filter select,
  .facility-area #panel1 .date-filter select,
  .facility-area #panel2 .date-filter select,
  .facility-area #panel3 .date-filter select {
    width: 100%;
  }
  .hope-area #panel1 .date-filter .date-select .input,
  .hope-area #panel2 .date-filter .date-select .input,
  .hope-area #panel3 .date-filter .date-select .input,
  .favorite-area #panel1 .date-filter .date-select .input,
  .favorite-area #panel2 .date-filter .date-select .input,
  .favorite-area #panel3 .date-filter .date-select .input,
  .facility-area #panel1 .date-filter .date-select .input,
  .facility-area #panel2 .date-filter .date-select .input,
  .facility-area #panel3 .date-filter .date-select .input {
    width: 100%;
    margin-top: 0;
  }
  .hope-area #panel1 .date-filter .date-select .input input[type=date],
  .hope-area #panel2 .date-filter .date-select .input input[type=date],
  .hope-area #panel3 .date-filter .date-select .input input[type=date],
  .favorite-area #panel1 .date-filter .date-select .input input[type=date],
  .favorite-area #panel2 .date-filter .date-select .input input[type=date],
  .favorite-area #panel3 .date-filter .date-select .input input[type=date],
  .facility-area #panel1 .date-filter .date-select .input input[type=date],
  .facility-area #panel2 .date-filter .date-select .input input[type=date],
  .facility-area #panel3 .date-filter .date-select .input input[type=date] {
    width: 100%;
    margin-top: 0.5rem;
  }
  .hope-area #panel1 .date-filter .date-select .input .btn-wrap,
  .hope-area #panel2 .date-filter .date-select .input .btn-wrap,
  .hope-area #panel3 .date-filter .date-select .input .btn-wrap,
  .favorite-area #panel1 .date-filter .date-select .input .btn-wrap,
  .favorite-area #panel2 .date-filter .date-select .input .btn-wrap,
  .favorite-area #panel3 .date-filter .date-select .input .btn-wrap,
  .facility-area #panel1 .date-filter .date-select .input .btn-wrap,
  .facility-area #panel2 .date-filter .date-select .input .btn-wrap,
  .facility-area #panel3 .date-filter .date-select .input .btn-wrap {
    margin-top: 0.5rem;
  }
  .favorite-area .common-table-wrap .table-content .table-box {
    flex-wrap: wrap;
  }
  .favorite-area .common-table-wrap .table-content .table-box .info-wrap {
    width: calc(100% - 13rem);
  }
  .favorite-area .common-table-wrap .table-content .table-box .btn-wrap {
    width: 100%;
  }
  .date-filter .select {
    width: 100%;
  }
  .program-detail.myprogram .detail-area .top-area {
    flex-direction: column;
    align-items: center;
  }
  .program-detail.myprogram .detail-area .top-area .img-area {
    width: 24rem;
    height: 33.7rem;
  }
  .program-detail.myprogram .detail-area .top-area .img-area img {
    max-width: 24rem;
    width: 100%;
    height: 100%;
  }
  .program-detail.myprogram .detail-area .top-area .info-area {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100% !important;
    padding-top: 4rem;
  }
  .program-detail.myprogram .detail-area .top-area .info-area > .title {
    font-weight: 600;
    font-size: 2rem;
    text-align: center;
  }
  .program-detail.myprogram .detail-area .top-area .info-area .list {
    display: flex;
    flex-direction: column;
    gap: 1.4rem;
    width: 100%;
  }
  .program-detail.myprogram .detail-area .top-area .info-area .list li {
    flex-direction: column;
    gap: 0.8rem;
    margin-top: 0;
  }
  .program-detail.myprogram .detail-area .top-area .info-area .btn-wrap {
    position: relative;
    width: 100%;
    padding-top: 1.4rem;
  }
  .program-detail.myprogram .detail-area .top-area .info-area .btn-wrap .btn {
    width: 100%;
  }
}
.myquestion-area .common-table-wrap {
  padding-top: 2rem;
}
.myquestion-area .common-table-wrap .table-content.pd0 .table-box {
  padding: 2.4rem 2rem 3.2rem;
}
.myquestion-area .common-table-wrap + .common-table-wrap {
  margin-top: 5rem;
}
.myquestion-area .answer-area {
  padding: 4rem 2rem;
}
.myquestion-area .answer-area p {
  line-height: 140%;
}
.myquestion-area .waiting-area {
  padding: 3.2rem;
  border-top: 0.1rem solid #222;
  background: #f4f4f4;
}
.myquestion-area .waiting-area p {
  font-size: 2rem;
  font-weight: 400;
  line-height: 140%;
  color: #555;
}

.myprogram-list .search-area .input-box {
  width: 15%;
}
.myprogram-list .search-area .input-box .select {
  width: 100%;
  max-width: unset;
}
.myprogram-list .search-area .input-box .select select {
  width: 100%;
}
.myprogram-list .search-area .input-box:last-child {
  width: auto;
}

.quick-area .add-area {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0 1rem;
  margin-top: 4rem;
  padding: 2rem;
  border: 0.1rem solid #dadadf;
  border-radius: 0.4rem;
}
.quick-area .add-area .select-box {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 16rem;
  height: 5.2rem;
  padding: 1.6rem;
  border-radius: 0.4rem;
  border: 0.2rem dashed #ccc;
  box-sizing: border-box;
}
.quick-area .add-area .select-box.select {
  position: relative;
  border: 0.1rem solid #222;
  box-shadow: 0 0.6rem 1rem 0 rgba(0, 0, 0, 0.05);
}
.quick-area .add-area .select-box.select p {
  color: #222;
  font-weight: 600;
}
.quick-area .add-area .select-box.select .del {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
.quick-area .add-area .select-box.select .del::before {
  content: "";
  display: inline-flex;
  width: 3rem;
  height: 3rem;
  background: url("../../images/icon/icon_menu-del.png") no-repeat 0 0;
  background-size: cover;
}
.quick-area .add-area .select-box.select:hover .del {
  display: block;
}
.quick-area .add-area .select-box.select:hover::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  border-radius: 4px;
  background: rgba(0, 0, 0, 0.5);
}
.quick-area .add-area .btn-area {
  display: flex;
  gap: 0 1rem;
}
.quick-area .add-area .btn-area .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 15.6rem;
  padding: 1.56rem 0;
  border-radius: 0.2rem;
  border: 0.1rem solid #dadadf;
}
.quick-area .add-area .btn-area .btn span {
  font-size: 1.6rem;
  font-weight: 600;
  color: #222;
}
.quick-area .add-area .btn-area .btn.save {
  background: #404040;
}
.quick-area .add-area .btn-area .btn.save span {
  color: #fff;
}
.quick-area .menu-list {
  overflow: hidden;
  position: relative;
  height: 50rem;
  margin-top: 4rem;
  border-radius: 1rem;
  border: 1px solid #dadadf;
  background: #f4f4f4;
  box-shadow: 0 0.6rem 1rem 0 rgba(0, 0, 0, 0.05);
}
.quick-area .menu-list ul {
  position: relative;
}
.quick-area .menu-list ul .title-menu .btn {
  width: 33rem;
  padding: 1.9rem 2rem;
  font-weight: 600;
  color: #222;
  text-align: left;
  border-bottom: 0.1rem solid #dadadf;
}
.quick-area .menu-list ul .title-menu .btn.on, .quick-area .menu-list ul .title-menu .btn:hover {
  background: #fff;
  box-shadow: inset 0px -0.3rem 0px 0 #e60001;
}
.quick-area .menu-list ul .sub-menu-wrap {
  position: absolute;
  display: none;
  top: 0;
  left: 33rem;
  width: 37.5rem;
  height: 50rem;
  background: #fff;
  border: 0.1rem solid #dadadf;
  border-top: 0;
}
.quick-area .menu-list ul .sub-menu-wrap > ul > li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 1.35rem 1.8rem;
  border-bottom: 0.1rem solid #dadadf;
  box-sizing: border-box;
}
.quick-area .menu-list ul .sub-menu-wrap > ul > li > .sub-btn {
  width: calc(100% - 3rem);
  text-align: left;
  font-weight: 400;
  color: #555;
}
.quick-area .menu-list ul .sub-menu-wrap > ul > li > .sub-btn.on, .quick-area .menu-list ul .sub-menu-wrap > ul > li > .sub-btn:hover {
  color: #e60001;
  font-weight: 600;
}
.quick-area .menu-list ul .sub-menu-wrap > ul > li .menutoggle::after {
  content: "";
  display: inline-flex;
  width: 3rem;
  height: 3rem;
  background: url("../../images/icon/icon_menu_plus.png") no-repeat 0 0;
  background-size: cover;
}
.quick-area .menu-list ul .sub-menu-wrap > ul > li .menutoggle.on::after {
  background: url("../../images/icon/icon_menu-del.png") no-repeat 0 0;
  background-size: cover;
}
.quick-area .menu-list ul .sub-menu-wrap.on {
  display: block;
}
.quick-area .menu-list ul .last-menu {
  display: none;
  position: absolute;
  top: 0;
  left: 37.6rem;
  width: 38rem;
  background: #fff;
}
.quick-area .menu-list ul .last-menu ul > li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
  padding: 1.35rem 1.8rem;
  border-bottom: 0.1rem solid #dadadf;
  box-sizing: border-box;
}
.quick-area .menu-list ul .last-menu ul > li > button {
  width: calc(100% - 3rem);
  text-align: left;
  font-weight: 400;
  color: #555;
}
.quick-area .menu-list ul .last-menu ul > li > button.on, .quick-area .menu-list ul .last-menu ul > li > button:hover {
  color: #404040;
  font-weight: 600;
}
.quick-area .menu-list ul .last-menu ul > li > button.menutoggle {
  width: 3rem;
}
.quick-area .menu-list ul .last-menu.on {
  display: block;
}
.quick-area .menu-list .info-area {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 7rem;
  display: flex;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}
.quick-area .menu-list .info-area .no-select {
  display: none;
}
.quick-area .menu-list .info-area p {
  color: #929292;
  font-weight: 500;
  letter-spacing: -0.024rem;
}
.quick-area .menu-list .info-area span {
  display: block;
  margin-top: 1rem;
  font-size: 1.4rem;
}
.quick-area .menu-list .info-area .info {
  color: #1a71ea;
}

.program-list {
  margin-top: 7.6rem;
}
.program-list .top-area {
  position: relative;
  text-align: center;
}
.program-list .top-area .title {
  position: relative;
  display: inline-block;
  width: auto;
  font-size: 5.2rem;
  font-weight: 700;
  line-height: 120%;
  color: #222;
}
.program-list .top-area .title::before {
  content: "";
  position: absolute;
  left: -3rem;
  bottom: 0.5rem;
  width: 8rem;
  height: 8rem;
  border-radius: 50%;
  background: #ffeabd;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  z-index: -1;
}
.program-list .top-area .addpage {
  color: #2c2c2c;
  font-size: 2rem;
  font-weight: 600;
  line-height: 140%;
}
.program-list .top-area .link {
  position: absolute;
  top: 50%;
  right: 0;
  display: flex;
  align-items: center;
  gap: 0 0.6rem;
  padding: 1rem 1.4rem;
  margin-left: auto;
  border: 0.1rem solid #dadadf;
  color: #222;
  transform: translateY(-50%);
}
.program-list .top-area .link::before {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  background: url("../../images/icon/icon_window.png") no-repeat 0 0;
  background-size: cover;
}
.program-list .top-area.count {
  padding-bottom: 1.7rem;
  border-bottom: 0.1rem solid #222;
}
.program-list .top-area.count p {
  font-size: 1.8rem;
  color: #222;
  font-weight: 500;
  line-height: 140%;
  text-align: left;
}
.program-list .top-area.count p .point {
  color: #e60001;
  font-weight: 700;
}
.program-list .top-area.count + .program-list {
  margin-top: 4rem;
}
.program-list .result-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin-top: 6.5rem;
  gap: 9.2rem 1rem;
}
.program-list .result-list .result-box {
  width: 24%;
}
.program-list .result-list .result-box .img-area {
  position: relative;
  height: 35rem;
  background: #f4f4f4;
}
.program-list .result-list .result-box .img-area img {
  position: absolute;
  left: 0;
  top: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.program-list .result-list .result-box .img-area .status {
  position: absolute;
  right: 1rem;
  top: -0.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 7rem;
  height: 5.8rem;
  border-radius: 0 0 3.5rem 3.5rem;
  text-align: center;
  color: #fff;
  font-weight: 700;
  box-sizing: border-box;
  z-index: 9;
  letter-spacing: 0.02em;
}
.program-list .result-list .result-box .img-area .status.red {
  background: #eb3b26;
}
.program-list .result-list .result-box .img-area .status.black {
  background: #404040;
}
.program-list .result-list .result-box .img-area .status.green {
  background: #14874e;
}
.program-list .result-list .result-box .img-area.no-image img {
  top: 50%;
  left: 50%;
  right: auto;
  bottom: auto;
  width: 7.35rem;
  height: 8.35rem;
  transform: translate(-50%, -50%);
}
.program-list .result-list .result-box .info-area {
  margin-top: 2rem;
}
.program-list .result-list .result-box .info-area .library {
  padding: 0.3rem 0.6rem;
  line-height: 140%;
  font-size: 1.4rem;
  font-weight: 700;
}
.program-list .result-list .result-box .info-area .date {
  font-size: 1.5rem;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.06rem;
}
.program-list .result-list .result-box .info-area .name {
  margin-top: 0.6rem;
  font-size: 2rem;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.02rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.program-list .result-list .result-box .info-area ul {
  margin-top: 0.8rem;
}
.program-list .result-list .result-box .info-area ul li {
  display: flex;
  align-items: center;
  gap: 0 1rem;
  line-height: 140%;
}
.program-list .result-list .result-box .info-area ul li span {
  font-size: 1.9rem;
  letter-spacing: -0.06rem;
  color: #555;
}
.program-list .result-list .result-box .info-area ul li span.title {
  width: 3.2rem;
  font-weight: 400;
}
.program-list .result-list .result-box .info-area ul li span.text {
  width: calc(100% - 5.2rem);
  font-weight: 500;
}
.program-list .result-list .result-box .info-area ul li + li {
  margin-top: 0.4rem;
}
.program-list .result-list .result-box:hover .img-area::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.3);
  z-index: 9;
}
.program-list .result-list .result-box:hover .img-area::after {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 7.7rem;
  height: 7.7rem;
  background: url("../../images/icon/icon_program_add.png") no-repeat 0 0;
  background-size: cover;
  z-index: 99;
}
.program-list + .program-list {
  margin-top: 15rem;
}
.program-list.v2 .top-area .title::before {
  background: #d7ebff;
}
.program-list.v2 .result-list {
  display: flex;
  gap: 4.8rem 8rem;
}
.program-list.v2 .result-list .result-box {
  display: flex;
  width: 46%;
  max-width: unset;
  gap: 0 3.3rem;
}
.program-list.v2 .result-list .result-box .img-area {
  width: 25rem;
}
.program-list.v2 .result-list .result-box .img-area .status {
  right: auto;
  left: 1rem;
}
.program-list.v2 .result-list .result-box .info-area {
  width: calc(100% - 25rem);
}
.program-list.row {
  margin-top: 1rem;
  border-top: 0.2rem solid #222;
}
.program-list.row .result-list {
  display: block;
  width: 100%;
  margin-top: 0;
}
.program-list.row .result-list .result-box {
  position: relative;
  display: flex;
  justify-content: flex-start;
  gap: 0 2.4rem;
  width: 100%;
  max-width: 100%;
  padding: 2.4rem 0;
  margin-bottom: 0;
  border-bottom: 0.1rem solid #dadadf;
}
.program-list.row .result-list .result-box .img-area {
  width: 25rem;
}
.program-list.row .result-list .result-box .info-area {
  width: calc(100% - 25rem);
  margin-top: 0;
}
.program-list.row .result-list .result-box .info-area .name {
  width: 90%;
  margin-bottom: 0.6rem;
}
.program-list.row .result-list .result-box .info-area ul li {
  margin-top: 1.4rem;
}
.program-list.row .result-list .result-box .info-area ul li span.title {
  display: inline-block;
  width: 7rem;
}
.program-list.row .result-list .result-box .info-area.read {
  margin-top: 1.6rem;
}
.program-list.row .result-list .result-box:hover .info-area .name {
  text-decoration: underline;
}
.program-list.row .status-list {
  position: absolute;
  right: 0;
  top: 50%;
  width: 9rem;
  transform: translateY(-50%);
  z-index: 99;
}
.program-list.row .status-list p {
  color: #555;
  text-align: center;
}
.program-list.row .status-list p.count .point {
  color: #e60001;
}
.program-list.row .status-list p.waiting {
  margin-top: 0.6rem;
}
.program-list.row .status-list button {
  margin-top: 1rem;
  border: 0.1rem solid #222;
  padding: 1rem 1.6rem;
  color: #222;
  font-weight: 500;
}
.program-list.photo .result-list .result-box {
  width: auto;
  max-width: 32rem;
}
.program-list.photo .result-list .result-box .img-area {
  width: 100%;
  max-width: unset;
  height: 22rem;
}
.program-list.photo .result-list .result-box .img-area img {
  width: 100%;
}
.program-list.photo .result-list .result-box .info-area .btm-date {
  margin-top: 2.6rem;
  color: #555;
  line-height: 140%;
  font-size: 1.5rem;
}

.program-wrap .date-area {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 1.6rem;
  margin-top: 4rem;
  background: #f4f4f4;
  gap: 0 0.6rem;
}
.program-wrap .date-area p {
  font-size: 1.5rem;
}
.program-wrap .search-area {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 1.6rem 2.4rem;
  background-color: #f4f4f4;
  gap: 0.6rem;
}
.program-wrap .search-area .input-box .select {
  width: 100%;
  max-width: 22rem;
}
.program-wrap .search-area .input-box .input {
  display: flex;
}
.program-wrap .search-area .input-box .input input {
  width: 33rem;
  padding: 0 2rem;
  border: 0.2rem solid #404040;
  border-radius: 0.2rem 0 0 0.2rem;
}
.program-wrap .search-area .input-box .input.btn .btn {
  width: 12rem;
  height: 4rem;
  background-color: #404040;
  color: #fff;
}
.program-wrap .search-area .input-box .input.btn .btn:hover {
  background: #111;
}
.program-wrap .search-area .input-box .input.btn .btn:disabled {
  opacity: 0.4;
}
.program-wrap .search-area .btn-wrap {
  margin-top: 0;
}
.program-wrap .search-area.mt10 {
  margin-top: 2rem;
}
.program-wrap .tab-wrap {
  margin: 2rem 0;
}
.program-wrap.recom .program-list.row .result-list .result-box .img-area {
  max-width: 24rem;
  max-height: 20rem;
}
.program-wrap.recom .program-list.row .result-list .result-box .info-area {
  width: calc(100% - 23rem);
}
.program-wrap .gray-text-area {
  position: relative;
  border-radius: 2rem;
  -webkit-border-radius: 2rem;
  -moz-border-radius: 2rem;
  -ms-border-radius: 2rem;
  -o-border-radius: 2rem;
}
.program-wrap .gray-text-area p {
  width: calc(100% - 13rem);
  max-width: unset;
  margin: 0;
  padding: 0;
  text-align: left;
  text-indent: 0;
}
.program-wrap .gray-text-area.nobg p {
  width: 100%;
  text-align: center;
}
.program-wrap .gray-text-area.nobg::after {
  display: none;
}
.program-wrap .tab-wrap .tab-btn {
  position: relative;
  align-items: center;
}
.program-wrap .tab-wrap .tab-btn .select-box {
  margin-left: auto;
  border: 0.2rem solid #222;
}

.program-detail .detail-area .top-area {
  display: flex;
  gap: 0 3.2rem;
  padding: 4rem 0;
}
.program-detail .detail-area .top-area .img-area {
  width: 20rem;
}
.program-detail .detail-area .top-area .img-area img {
  width: 100%;
  max-width: 20rem;
}
.program-detail .detail-area .top-area .info-area {
  width: calc(100% - 24rem);
}
.program-detail .detail-area .top-area .info-area .library {
  padding: 0.3rem 0.6rem;
  font-weight: 700;
}
.program-detail .detail-area .top-area .info-area > .title {
  margin-top: 1.6rem;
  font-size: 2.8rem;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.032rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.program-detail .detail-area .top-area .info-area .list {
  margin-top: 0.4rem;
}
.program-detail .detail-area .top-area .info-area .list li {
  display: flex;
  gap: 0 1rem;
  margin-top: 1.6rem;
}
.program-detail .detail-area .top-area .info-area .list li span {
  display: inline-block;
  color: #555;
  font-size: 1.9rem;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.06rem;
  width: calc(100% - 10rem);
}
.program-detail .detail-area .top-area .info-area .list li span.title {
  width: 9rem;
  font-weight: 400;
}
.program-detail .detail-area .middle-area {
  border-top: 0.1rem solid #929292;
}
.program-detail .detail-area .middle-area .file-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 0 2rem;
  background: #f4f4f4;
}
.program-detail .detail-area .middle-area .file-area .text-area {
  display: flex;
}
.program-detail .detail-area .middle-area .file-area .text-area span {
  display: inline-block;
}
.program-detail .detail-area .middle-area .file-area .text-area span.file-name {
  display: flex;
  align-items: center;
  color: #555;
  font-weight: 500;
  letter-spacing: -0.016rem;
}
.program-detail .detail-area .middle-area .file-area .text-area span.file-name::before {
  content: "";
  display: inline-block;
  width: 1.6rem;
  height: 1.6rem;
  margin-right: 0.6rem;
  background: url("../../images/icon/icon_file.png") no-repeat 0 0;
  background-size: cover;
}
.program-detail .detail-area .middle-area .file-area .text-area span.capacity {
  display: flex;
  align-items: center;
  margin-left: 0.6rem;
  color: #929292;
  font-size: 1.4rem;
  font-weight: 500;
  letter-spacing: -0.014rem;
}
.program-detail .detail-area .middle-area .file-area .download {
  width: 4rem;
  height: 4rem;
}
.program-detail .detail-area .middle-area .file-area .download::before {
  content: "";
  display: inline-flex;
  width: 4rem;
  height: 4rem;
  background: url("../../images/icon/icon_download.png") no-repeat 0 0;
  background-size: 100%;
}
.program-detail .detail-area .content-text {
  padding: 4rem 0 8rem;
  border-bottom: 0.1rem solid #dadadf;
}
.program-detail .detail-area .recommend-list {
  margin-top: 4.3rem;
}
.program-detail .detail-area .recommend-list > p.title {
  color: #222;
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 140%;
}
.program-detail .detail-area .recommend-list .box-wrap {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1rem;
  margin-top: 1.3rem;
}
.program-detail .detail-area .recommend-list .box-wrap .box {
  position: relative;
  display: flex;
  flex: 0 45%;
  padding: 2rem;
  background: #f4f4f4;
}
.program-detail .detail-area .recommend-list .box-wrap .box .img-area {
  max-width: 8rem;
}
.program-detail .detail-area .recommend-list .box-wrap .box .img-area img {
  width: 100%;
  vertical-align: top;
}
.program-detail .detail-area .recommend-list .box-wrap .box .info-text {
  width: calc(100% - 2rem);
  margin-left: 2rem;
}
.program-detail .detail-area .recommend-list .box-wrap .box .info-text .title {
  width: 95%;
  color: #222;
  font-size: 2rem;
  font-weight: 700;
  line-height: 140%;
  /* 28px */
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.program-detail .detail-area .recommend-list .box-wrap .box .info-text ul {
  display: flex;
  flex-wrap: wrap;
  margin-top: 1rem;
  gap: 0 3.2rem;
}
.program-detail .detail-area .recommend-list .box-wrap .box .info-text ul li {
  position: relative;
  display: flex;
}
.program-detail .detail-area .recommend-list .box-wrap .box .info-text ul li span {
  color: #555;
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 500;
  line-height: 140%;
  margin-left: 1rem;
}
.program-detail .detail-area .recommend-list .box-wrap .box .info-text ul li span.text {
  width: 5rem;
  margin-left: 0;
}
.program-detail .detail-area .recommend-list .box-wrap .box .info-text ul li::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -1.6rem;
  width: 0.1rem;
  height: 1rem;
  background: #929292;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
.program-detail .detail-area .recommend-list .box-wrap .box .info-text ul li:last-child::after {
  display: none;
}
.program-detail .detail-area .recommend-list .box-wrap .box .info-text ul li:first-child span.text {
  width: 3rem;
}
.program-detail .detail-area .recommend-list .box-wrap .box .info-text .action-btn {
  top: 2rem;
  right: 2rem;
}
.program-detail .detail-area .recommend-list .box-wrap .box .info-text .action-btn .like::before {
  width: 2.4rem;
  height: 2.4rem;
}
.program-detail .detail-area .recommend-list .box-wrap .btn-wrap {
  justify-content: flex-end;
  margin-top: 1.2rem;
}
.program-detail .detail-area .recommend-list .box-wrap .btn-wrap button {
  min-width: 9.3rem;
  font-size: 1.5rem;
}
.program-detail .detail-area.form {
  max-width: 84rem;
  margin: 0 auto;
}
.program-detail .detail-area.form .top-area {
  padding: 3.2rem 2.4rem;
  border: 0.1rem solid #dadadf;
  border-radius: 1rem;
  box-shadow: 0 0.6rem 1rem 0 rgba(0, 0, 0, 0.04);
}
.program-detail .detail-area.form .form-area {
  margin-top: 1rem;
}
.program-detail .detail-area.form .check {
  width: 100%;
  margin-top: 4.2rem;
  text-align: center;
}
.program-detail .detail-area.form .check .point {
  position: relative;
  top: -0.1rem;
  color: #e60001;
}
.program-detail.myprogram .detail-area .top-area .img-area {
  width: 24rem;
}
.program-detail.myprogram .detail-area .top-area .img-area img {
  width: 100%;
}
.program-detail.myprogram .detail-area .top-area .info-area {
  width: calc(100% - 28rem);
}
.program-detail.myprogram .detail-area .form-input {
  margin-top: 0;
}
.program-detail.myprogram .detail-area .form-input + .form-input {
  margin-top: 4rem;
}

.service-area {
  margin-top: 3rem;
}
.service-area .title {
  font-size: 2rem;
}
.service-area .service-list {
  border-top: 0.2rem solid #222;
}
.service-area .service-list .service-item {
  display: flex;
  /*align-items: baseline;*/
  padding: 2.4rem 1rem;
  border-bottom: 0.1rem solid #dadadf;
}
.service-area .service-list .service-item .title {
  position: relative;
  display: flex;
  width: 21rem;
  margin-right: 2.4rem;
}
.service-area .service-list .service-item .title span {
  font-size: 2.6rem;
  color: #222;
  font-weight: 600;
  line-height: 120%;
}
.service-area .service-list .service-item .title span.sub {
  position: absolute;
  top: 4.2rem;
  left: 0;
  font-size: 1.6rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.016rem;
}
.service-area .service-list .service-item .title::before {
  content: "";
  display: inline-flex;
  width: 3.2rem;
  height: 3.2rem;
  margin-right: 1rem;
}
.service-area .service-list .service-item .title.people::before {
  background: url("../../images/icon/icon-table-people.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.caution::before {
  background: url("../../images/icon/icon-table-caution.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.loan::before {
  background: url("../../images/icon/icon-table_loan.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.hand::before {
  background: url("../../images/icon/icon-table_hand.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.method::before {
  background: url("../../images/icon/icon-table-method.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.date::before {
  background: url("../../images/icon/icon-table-date.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.cation_v2::before {
  background: url("../../images/icon/icon-table-caiton_v2.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.time::before {
  background: url("../../images/icon/icon-table-time.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.spot::before {
  background: url("../../images/icon/icon-table-spot.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.doc::before {
  background: url("../../images/icon/icon-table-doc.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.cash::before {
  background: url("../../images/icon/icon-table-cash.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.books::before {
  background: url("../../images/icon/icon-table-books.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.certicate::before {
  background: url("../../images/icon/icon-table-carticate.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.checklist::before {
  background: url("../../images/icon/icon-table-checklist.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.question::before {
  background: url("../../images/icon/icon-table-question.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.space::before {
  background: url("../../images/icon/icon-table-space.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.close::before {
  background: url("../../images/icon/icon-table-close.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.phone::before {
  background: url("../../images/icon/icon-table-phone.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.wifi::before {
  background: url("../../images/icon/icon-table-wifi.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.db::before {
  background: url("../../images/icon/icon-table-db.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.return::before {
  background: url("../../images/icon/icon-table-return.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.doc_v2::before {
  background: url("../../images/icon/icon-table-doc_v2.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .title.long {
  width: 37rem;
}
.service-area .service-list .service-item .title.long::before {
  display: none;
}
.service-area .service-list .service-item .text-area {
  width: calc(100% - 24rem);
}
.service-area .service-list .service-item .text-area p {
  position: relative;
  padding-left: 1.4rem;
  color: #555;
  font-weight: 400;
  line-height: 160%;
  font-size: 1.9rem;
  word-break: keep-all;
}
.service-area .service-list .service-item .text-area p + p {
  margin-top: 0.4rem;
}
.service-area .service-list .service-item .text-area p.bold {
  display: flex;
  align-items: center;
  font-weight: bold;
  color: #222;
  font-weight: 500;
  font-size: 1.8rem;
}
.service-area .service-list .service-item .text-area p.bold span {
  margin-top: 0;
  margin-left: 1rem;
}
.service-area .service-list .service-item .text-area p.info {
  color: #1a71ea;
  font-size: 1.9rem;
}
.service-area .service-list .service-item .text-area p.text-flex {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0 1.6rem;
}
.service-area .service-list .service-item .text-area p.text-flex strong,
.service-area .service-list .service-item .text-area p.text-flex span {
  font-size: 1.9rem;
}
.service-area .service-list .service-item .text-area p.text-flex strong {
  width: 8rem;
}
.service-area .service-list .service-item .text-area p.text-flex span {
  width: calc(100% - 8rem);
}
.service-area .service-list .service-item .text-area p.red {
  color: #db3b26;
}
.service-area .service-list .service-item .text-area p.left {
  text-align: left;
}
.service-area .service-list .service-item .text-area p.left::before {
  content: "";
  position: relative;
  top: -0.3rem;
  display: inline-flex;
  width: 0.6rem;
  height: 0.6rem;
  margin-right: 0.8rem;
  background: #555;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}
.service-area .service-list .service-item .text-area p::before {
  content: "";
  position: absolute;
  top: 1.2rem;
  left: 0;
  display: inline-flex;
  width: 0.6rem;
  height: 0.6rem;
  background: #555;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}
.service-area .service-list .service-item .text-area p.nodot {
  padding-left: 0;
}
.service-area .service-list .service-item .text-area p.nodot::before {
  display: none;
}
.service-area .service-list .service-item .text-area p .info {
  font-size: inherit;
  margin-top: -1rem;
}
.service-area .service-list .service-item .text-area p.mt10 {
  margin-top: 1rem;
}
.service-area .service-list .service-item .text-area .method-area > li {
  display: flex;
  align-items: center;
  padding: 2.4rem 1.6rem;
  border-bottom: 0.1rem solid #dadadf;
}
.service-area .service-list .service-item .text-area .method-area > li:first-child {
  padding: 0 1.6rem 2.4rem 1.6rem;
}
.service-area .service-list .service-item .text-area .method-area > li:last-child {
  padding: 2.4rem 1.6rem 0 1.6rem;
  border-bottom: 0;
}
.service-area .service-list .service-item .text-area .method-area > li ol > li {
  margin-top: 0.4rem;
  color: #555;
  font-weight: 400;
  line-height: 160%;
  letter-spacing: -0.024rem;
}
.service-area .service-list .service-item .text-area .method-area > li ol > li:first-child {
  display: flex;
  margin-bottom: 1.2rem;
  align-items: center;
}
.service-area .service-list .service-item .text-area .method-area > li ol > li:first-child span {
  color: #222;
  font-size: 2rem;
  font-weight: 600;
  line-height: 120%;
}
.service-area .service-list .service-item .text-area .method-area > li ol > li:first-child strong {
  margin-right: 1.6rem;
  font-size: 1.6rem;
  line-height: 140%;
  font-weight: 400;
  letter-spacing: -0.056rem;
  color: #555;
}
.service-area .service-list .service-item .text-area.row .method-area {
  display: flex;
}
.service-area .service-list .service-item .text-area.row .method-area > li {
  display: flex;
  flex-direction: column;
  padding: 0;
  width: 25%;
  border-bottom: 0;
}
.service-area .service-list .service-item .text-area.row .method-area > li:before {
  margin-right: 0;
}
.service-area .service-list .service-item .text-area.row .method-area > li ol li {
  text-align: center;
  justify-content: center;
  margin: 1rem 0;
}
.service-area .service-list .service-item .text-area.row .method-area > li ol li strong {
  margin: 0;
  text-align: center;
}
.service-area .service-list .service-item .text-area.row .method-area > li ol li:first-child {
  margin: 1rem 0;
}
.service-area .service-list .service-item .text-area.row .method-area > li:nth-of-type(2):before {
  background: url("../../images/icon/icon_service_06.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .text-area.row .method-area > li:nth-of-type(3):before {
  background: url("../../images/icon/icon_service_07.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .text-area.row .method-area > li:nth-of-type(4):before {
  background: url("../../images/icon/icon_service_08.png") no-repeat 0 0;
  background-size: cover;
}
.service-area .service-list .service-item .text-area .btn-wrap {
  margin-top: 1.4rem;
}
.service-area .service-list .service-item .text-area .btn-wrap span {
  color: #222;
  font-weight: 500;
}
.service-area .service-list .service-item .text-area.radio {
  display: flex;
  align-items: center;
}
.service-area .service-list .service-item .text-area.radio .radio-area {
  display: flex;
  gap: 0 4rem;
}
.service-area .form-input {
  max-width: 85rem;
  margin: 0 auto;
}
.service-area .form-input .accordion-area .accordion-content {
  height: 10.3rem;
}
.service-area .link-btn a:before {
  background: url("../../images/icon/icon_window.png") no-repeat 0 0;
  background-size: cover;
}

.branch .service-list .service-item .text-area p {
  font-size: 1.9rem;
  letter-spacing: -0.024rem;
}
.branch .service-list .service-item .text-area p.error {
  color: #db3b26;
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 120%;
  /* 25.2px */
  letter-spacing: -0.021rem;
}
.branch .service-list .service-item .text-area .method-area ul > li p {
  font-size: 1.9rem;
}
.branch .service-list .service-item .table-area {
  margin-top: 0;
}
.branch .service-list .service-item .table-area th {
  background: #f4f4f4;
  color: #222;
}
.branch .service-list .service-item .table-area td {
  color: #555;
  text-align: center;
}
.branch .service-list .service-item .table-area .table-text {
  margin-top: 2.4rem;
  font-size: 1.6rem;
}
.branch .service-list .info {
  color: #1a71ea;
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 180%;
  /* 25.2px */
  letter-spacing: -0.021rem;
}
.branch .service-list .error {
  color: #db3b26;
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 120%;
  /* 25.2px */
  letter-spacing: -0.021rem;
}
.branch .program-list {
  margin-top: 4rem;
}
.branch .program-list .result-list {
  margin-top: 4rem;
}
.branch .program-list .result-list .result-box {
  width: 33.33%;
  max-width: 34.6rem;
}
.branch .program-list .result-list .result-box .img-area {
  max-width: 34.6rem;
  height: 34.6rem;
}
.branch .program-list .result-list .result-box .img-area img {
  width: 100%;
}

@media (max-width: 1024px) {
  .program-wrap .gray-text-area p {
    width: 100%;
    text-align: left;
  }
  .program-wrap .search-area .input-box {
    width: 100%;
  }
  .program-wrap .search-area .input-box .select {
    width: 100%;
    max-width: unset;
  }
  .program-wrap .search-area .input-box .select select {
    width: 100%;
  }
  .program-wrap .search-area .input-box .input input {
    width: 100%;
  }
  .program-list .top-area {
    position: relative;
  }
  .program-list .top-area::after {
    display: block;
    clear: both;
    content: "";
  }
  .program-list .top-area .title {
    width: 100%;
    font-size: 2.8rem;
    text-align: left;
  }
  .program-list .top-area .title::before {
    width: 4rem;
    height: 4rem;
    left: 42.5%;
    transform: translateX(-50%);
  }
  .program-list .top-area .link {
    position: static;
    float: right;
    width: auto;
    transform: unset;
  }
  .program-list .top-area .addpage {
    white-space: nowrap;
  }
  .program-list .result-list {
    justify-content: space-between;
    gap: 5rem 0;
  }
  .program-list .result-list .result-box {
    width: 49.5%;
    max-width: unset;
  }
  .program-list .result-list .result-box .img-area {
    height: 32rem;
  }
  .program-list .result-list .result-box .img-area img {
    max-width: 24rem;
    max-height: 32rem;
    margin: 0 auto;
  }
  .program-list.photo .result-list .result-box {
    width: 48%;
    max-width: unset;
    height: 32rem;
  }
  .program-list.photo .result-list .result-box .img-area {
    margin: 0 auto;
  }
  .program-detail .detail-area .recommend-list .box-wrap .box {
    width: 100%;
    flex: unset;
  }
}
@media (max-width: 768px) {
  .program-list .result-list {
    margin-top: 2.2rem;
  }
  .program-list .result-list .result-box {
    width: 100%;
  }
  .program-list .result-list .result-box .info-area ul li span.text, .program-list .result-list .result-box .info-area ul li span.title {
    font-size: 1.5rem;
  }
  .program-list .result-list .result-box .img-area {
    width: 100%;
    height: 34rem;
  }
  .program-list .result-list .result-box .img-area img {
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
    height: 100%;
    max-width: 24rem;
    max-height: unset;
  }
  .program-list.photo .result-list .result-box {
    width: 100%;
    max-width: unset;
  }
  .program-list.photo .result-list .result-box .info-area .btm-date {
    margin-top: 0.5rem;
  }
  .program-list.row .result-list .result-box {
    display: block;
  }
  .program-list.row .result-list .result-box .info-area {
    margin-top: 2rem;
  }
  .program-list.row .result-list .result-box .info-area .name {
    width: 100%;
    font-size: 1.8rem;
  }
  .program-list.row .result-list .result-box .info-area ul li span {
    font-size: 1.5rem;
  }
  .program-list.row .result-list .result-box .info-area ul li span.title {
    width: 6.5rem;
  }
  .program-list.row .result-list .result-box .info-area ul li span.text {
    width: calc(100% - 8rem);
  }
  .program-list + .program-list {
    margin-top: 10rem;
  }
  .program-list.v2 .result-list .result-box {
    flex-wrap: wrap;
    width: 100%;
  }
  .program-list.v2 .result-list .result-box .img-area {
    width: 100%;
  }
  .program-list.v2 .result-list .result-box .info-area {
    width: 100%;
  }
  .program-list.row .result-list .result-box .img-area {
    width: 100%;
  }
  .program-list.row .result-list .result-box .info-area {
    width: 100%;
  }
  .program-list.row .result-list .result-box .status-list {
    position: static;
    width: 100%;
    transform: unset;
  }
  .program-list.row .result-list .result-box .status-list button {
    width: 100%;
  }
  .program-wrap .tab-wrap .tab-btn .select-box {
    display: block;
    width: 100%;
    margin-left: auto;
    margin-top: 1.5rem;
  }
  .program-wrap.recom .program-list.row .result-list .result-box .img-area {
    width: 100%;
    max-width: unset;
    max-height: unset;
  }
  .program-wrap.recom .program-list.row .result-list .result-box .img-area img {
    max-width: 25rem;
    max-height: 35rem;
  }
  .program-wrap.recom .program-list.row .result-list .result-box .info-area {
    width: 100%;
  }
  .program-detail .detail-area .top-area {
    flex-wrap: wrap;
  }
  .program-detail .detail-area .top-area .img-area {
    margin: 0 auto;
  }
  .program-detail .detail-area .top-area .info-area {
    width: 100%;
    margin-top: 2rem;
  }
  .program-detail .detail-area .top-area .info-area > .title {
    font-size: 1.8rem;
  }
  .program-detail .detail-area .top-area .info-area .list li {
    margin-top: 1rem;
  }
  .program-detail .detail-area .top-area .info-area .list li span {
    width: calc(100% - 3rem);
    font-size: 1.6rem;
  }
  .program-detail .detail-area .top-area .info-area .list li span.title {
    width: 6rem;
    white-space: nowrap;
  }
  .program-detail .detail-area .content-text img {
    width: 100%;
  }
  .program-detail .detail-area .recommend-list .box-wrap .box {
    flex-wrap: wrap;
  }
  .program-detail .detail-area .recommend-list .box-wrap .box .img-area {
    width: 100%;
    margin: 0 auto;
  }
  .program-detail .detail-area .recommend-list .box-wrap .box .info-text {
    width: 100%;
    margin-left: 0;
    margin-top: 2rem;
  }
  .program-detail .detail-area .recommend-list .box-wrap .box .info-text .title {
    font-size: 1.8rem;
  }
  .program-detail .detail-area .recommend-list .box-wrap .box .info-text ul {
    display: block;
  }
  .program-detail .detail-area .recommend-list .box-wrap .box .info-text ul li::after {
    display: none;
  }
  .program-detail .detail-area .recommend-list .box-wrap .btn-wrap {
    justify-content: center;
  }
  .program-detail .detail-area .recommend-list .box-wrap .btn-wrap button {
    width: 100%;
    min-width: unset;
  }
  .service-area {
    margin-top: 4rem;
  }
  .service-area .service-list .service-item {
    flex-wrap: wrap;
  }
  .service-area .service-list .service-item .title {
    width: 100%;
  }
  .service-area .service-list .service-item .title span {
    font-size: 2rem;
  }
  .service-area .service-list .service-item .title span br {
    display: none;
  }
  .service-area .service-list .service-item .title span.sub {
    position: relative;
    top: 0.3rem;
    margin-left: 1rem;
  }
  .service-area .service-list .service-item .title::before {
    width: 2.4rem;
    height: 2.4rem;
  }
  .service-area .service-list .service-item .text-area {
    width: 100%;
    margin-top: 1.6rem;
  }
  .service-area .service-list .service-item .text-area p {
    font-size: 1.6rem;
  }
  .service-area .service-list .service-item .text-area p::before {
    top: 0.9rem;
  }
  .service-area .service-list .service-item .text-area p.info {
    font-size: 1.6rem;
  }
  .service-area .service-list .service-item .text-area p.text-flex strong, .service-area .service-list .service-item .text-area p.text-flex span {
    width: 100%;
    font-size: 1.6rem;
  }
}
.map-wrap {
  margin-top: 6rem;
}
.map-wrap .title-area p {
  color: #222;
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 140%;
}
.map-wrap .map-area {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  max-width: 110rem;
  margin: 6rem auto 0;
  padding-bottom: 4rem;
}
.map-wrap .map-area .map {
  position: relative;
  width: 64rem;
  height: 62rem;
  margin-bottom: 4rem;
  background: url("../../images/visual/map.jpg") no-repeat center;
  background-size: 64rem;
}
.map-wrap .map-area .library {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  right: 0;
  width: 100%;
  height: 100%;
}
.map-wrap .map-area .library button {
  position: absolute;
  width: 1.8rem;
  height: 2.4rem;
  background: url("../../images/icon/icon_spot.png") no-repeat 0 0;
  background-size: cover;
}
.map-wrap .map-area .library.smart {
  background: none;
}
.map-wrap .map-area .library.smart button {
  position: absolute;
  background: url("../../images/icon/icon_spot_smart.png") no-repeat 0 0;
  background-size: cover;
}
.map-wrap .map-area .library.small {
  background: none;
}
.map-wrap .map-area .library.small button.on {
  background: url("../../images/icon/icon_spot_small.png") no-repeat 0 0;
  background-size: cover;
}
.map-wrap .map-area .library.seoul {
  background: none;
}
.map-wrap .map-area .library.seoul button.on {
  background: url("../../images/icon/icon_spot_seoul.png") no-repeat 0 0;
  background-size: cover;
}
.map-wrap .map-area .library.bookcafe {
  background: none;
}
.map-wrap .map-area .library.bookcafe button.on {
  background: url("../../images/icon/icon_spot_cafe.png") no-repeat 0 0;
  background-size: cover;
}
.map-wrap .map-area .map-content {
  width: 42rem;
  margin: 0 0 0 4rem;
}
.map-wrap .map-area .map-content .select-area {
  display: none;
}
.map-wrap .map-area .map-content .map-box {
  display: none;
}
.map-wrap .map-area .map-content .map-box .img-area img {
  width: 100%;
  max-width: 39.6rem;
  max-height: 28rem;
}
.map-wrap .map-area .map-content .map-box p.title {
  margin-top: 1.6rem;
  color: #222;
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 140%;
  letter-spacing: -0.056rem;
}
.map-wrap .map-area .map-content .map-box ul {
  margin-top: 0.8rem;
}
.map-wrap .map-area .map-content .map-box ul > li {
  display: flex;
  gap: 0 1.6rem;
}
.map-wrap .map-area .map-content .map-box ul > li span {
  width: calc(100% - 8.6rem);
  color: #222;
  font-size: 1.8rem;
  font-weight: 500;
  line-height: 140%;
}
.map-wrap .map-area .map-content .map-box ul > li span.title {
  display: inline-block;
  width: 7rem;
  color: #555;
  white-space: pre;
}
.map-wrap .map-area .map-content .map-box ul > li span.title::before {
  content: "";
  position: relative;
  top: -0.3rem;
  display: inline-flex;
  width: 0.6rem;
  height: 0.6rem;
  margin-right: 0.8rem;
  background: #555;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}
.map-wrap .map-area .map-content .map-box ul > li + li {
  margin-top: 0.6rem;
}
.map-wrap .map-area .map-content .map-box ul > li .hoilday-list {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  flex-wrap: wrap;
  width: calc(100% - 8.6rem);
  margin-top: 0;
}
.map-wrap .map-area .map-content .map-box ul > li .hoilday-list li {
  margin-top: 0;
}
.map-wrap .map-area .map-content .map-box ul > li .hoilday-list li span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 3.2rem;
  height: 3.2rem;
  border-radius: 50%;
  color: #fff;
  font-weight: 600;
  letter-spacing: -0.032rem;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
}
.map-wrap .map-area .map-content .map-box.on {
  display: block;
}
.map-wrap .map-area .map-content.seoul .map-box ul > li .hoilday-list li span {
  background: #4d4d4d;
}
.map-wrap .map-area .map-content.bookcafe .map-box ul > li .hoilday-list li span {
  background: #7b4420;
}
.map-wrap .map-area .library-info {
  width: 100%;
  margin-top: 6rem;
  border-top: 0.1rem solid #929292;
}
.map-wrap .map-area .library-info table {
  display: none;
  width: 100%;
}
.map-wrap .map-area .library-info table.on {
  display: table;
}
.map-wrap .map-area .library-info table thead th {
  padding: 1.5rem 0;
  background: #f4f4f4;
  color: #222;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.016rem;
  border-bottom: 0.1rem solid #dadadf;
  border-right: 0.1rem solid #dadadf;
}
.map-wrap .map-area .library-info table thead th:last-child {
  border-right: 0;
}
.map-wrap .map-area .library-info table tbody td, .map-wrap .map-area .library-info table tbody th {
  padding: 1.5rem 0;
  border-right: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  text-align: center;
}
.map-wrap .map-area .library-info table tbody td:last-child, .map-wrap .map-area .library-info table tbody th:last-child {
  border-right: 0;
}
.map-wrap .map-area.waiting {
  align-items: center;
  margin-top: 1rem;
  padding: 3rem 4rem;
  border: 0.1rem solid #dadadf;
  border-radius: 2rem;
  -webkit-border-radius: 2rem;
  -moz-border-radius: 2rem;
  -ms-border-radius: 2rem;
  -o-border-radius: 2rem;
  box-sizing: border-box;
  min-width: unset;
}
.map-wrap .map-area.waiting .map {
  position: relative;
  top: auto;
  width: 32rem;
  height: 35.5rem;
  margin-left: 14rem;
  background-size: cover;
  background: url("../../images/visual/map.png") no-repeat 0 0;
  background-size: cover;
}
.map-wrap .map-area.waiting .library button {
  width: 1.5rem;
  height: 2rem;
}
.map-wrap .map-area.waiting .map-content {
  width: calc(100% - 50rem);
  margin: 0;
  margin-left: 4rem;
}
.map-wrap .map-area.waiting .map-content .img-area {
  display: none;
}
.map-wrap .map-area.waiting .map-content .select-area {
  display: none;
}

.loan-service .service-area.join .service-list .text-area .method-area ul li .download.arrow a::after {
  background: url(../../images/icon/icon_black_arrow.png) no-repeat 0 0;
  background-size: cover;
}

.hope-service .form-input .form-area .input-box .title + div {
  border-bottom: 0;
}
.hope-service .form-input .form-area .input-box .title + div > span {
  margin-right: 1rem;
}

.local-area .info-text {
  margin-top: 6rem;
  padding: 2rem;
  background: #f4f4f4;
}
.local-area .info-text .title {
  color: #222;
  font-weight: 500;
  line-height: 160%;
  letter-spacing: -0.016rem;
}
.local-area .info-text .list {
  margin-top: 1rem;
}
.local-area .info-text .list .sub-title {
  color: #222;
  font-weight: 500;
  line-height: 160%;
  letter-spacing: -0.016rem;
}
.local-area .info-text .list .red {
  color: #e60001;
}
.local-area .info-text .list .block {
  display: block;
  width: 100%;
  padding-left: 1rem;
}
.local-area .info-text .list .blue {
  color: #1a71ea;
}
.local-area .info-text .list ul li {
  padding-left: 0.5rem;
  color: #555;
  font-weight: 400;
  line-height: 160%;
  letter-spacing: -0.016rem;
}
.local-area .form-input .form-area .input-box .title + div {
  width: calc(100% - 47rem);
  gap: 0 0.3rem;
}
.local-area .form-input .form-area .input-box .title + div.radio-area {
  gap: 0 2.4rem;
}
.local-area .form-input .form-area .input-box .input-select {
  flex-wrap: nowrap;
}
.local-area .form-input .form-area .input-box .input-select .select {
  width: 19%;
}
.local-area .form-input .form-area .input-box .input-select .input {
  width: 38.5%;
}
.local-area .form-input .wrap-btn {
  display: flex;
  align-items: center;
}
.local-area .form-input .wrap-btn .btn-wrap {
  margin-top: 0;
  margin-right: 1rem;
}
.local-area .common-table-wrap {
  margin-top: 6rem;
}
.local-area .common-table-wrap .title-area {
  display: flex;
  justify-content: space-between;
}
.local-area .common-table-wrap .title-area .point {
  color: #e60001;
  font-weight: 600;
  margin-left: 0.5rem;
}
.local-area .common-table-wrap .title-area p,
.local-area .common-table-wrap .title-area span {
  display: flex;
}
.local-area .common-table-wrap .table-content .table-box {
  display: flex;
  align-items: center;
  padding: 2.4rem 1.6rem;
}
.local-area .common-table-wrap .table-content .table-box .book-thumbnail {
  max-width: 8rem;
}
.local-area .common-table-wrap .table-content .table-box .book-thumbnail img {
  width: 100%;
}
.local-area .common-table-wrap .table-content .table-box .info-wrap {
  margin-left: 2rem;
}

.festival-area .program-list .result-list {
  margin-top: 2rem;
}
.festival-area .program-list .top-area {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.festival-area .program-list .title {
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 140%;
}
.festival-area .program-list .title::before {
  display: none;
}
.festival-area .main-img-area {
  max-width: 98rem;
  margin: 0 auto;
}
.festival-area .main-img-area img {
  width: 100%;
}
.festival-area .festival-notice {
  display: flex;
  flex-wrap: wrap;
  gap: 0 4rem;
  margin-top: 8rem;
}
.festival-area .festival-notice .title {
  width: 100%;
  margin-bottom: 2rem;
  color: #222;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 140%;
}
.festival-area .festival-notice .flex-wrap {
  display: flex;
}
.festival-area .festival-notice .flex-wrap .list-area {
  width: calc(100% - 44rem);
  margin-right: 4rem;
}
.festival-area .festival-notice .flex-wrap .list-area ul li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-top: 1.8rem;
}
.festival-area .festival-notice .flex-wrap .list-area ul li .list-title {
  width: 80%;
  color: #222;
  font-size: 2rem;
  font-weight: 600;
  line-height: 140%;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.festival-area .festival-notice .flex-wrap .list-area ul li .date {
  color: #555;
  font-weight: 400;
  font-size: 1.5rem;
}
.festival-area .festival-notice .flex-wrap .list-area ul li:first-child {
  margin-top: 0;
}
.festival-area .festival-notice .flex-wrap .list-area ul li:hover a {
  text-decoration: underline;
}
.festival-area .program-list {
  margin-top: 8rem;
}
.festival-area .program-list .date {
  color: #e60001;
}
.festival-area .program-list .result-list .result-box {
  margin-bottom: 0;
}
.festival-area .tab-wrap {
  margin-top: 4rem;
}
.festival-area .tab-wrap .program-list {
  margin-top: 0;
}
.festival-area .program-detail .detail-area .top-area {
  padding: 1rem 0 4rem;
}
.festival-area .tab-wrap {
  margin-top: 8rem;
}
.festival-area .tab-wrap .result-list {
  margin-top: 4rem;
}

.relation-gangdong .intro-raltaion img {
  width: 100%;
}
.relation-gangdong .intro-raltaion .mo {
  display: none;
}
.relation-gangdong .biz-area {
  margin-top: 8rem;
}
.relation-gangdong .biz-area .title {
  font-size: 5.2rem;
  font-weight: 700;
  line-height: 140%;
  text-align: center;
}
.relation-gangdong .biz-area ul {
  display: flex;
  justify-content: space-between;
  margin-top: 3rem;
}
.relation-gangdong .biz-area ul li {
  display: flex;
  flex-direction: column;
  justify-content: center;
  text-align: center;
}
.relation-gangdong .biz-area ul li .title {
  display: block;
  color: #222;
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 120%;
}
.relation-gangdong .biz-area ul li .text {
  display: block;
  margin-top: 1rem;
  color: #222;
  font-size: 2rem;
  line-height: 140%;
}
.relation-gangdong .biz-area ul li::before {
  content: "";
  display: inline-flex;
  justify-content: center;
  width: 8.6rem;
  height: 8.6rem;
  margin: 0 auto;
  margin-bottom: 2rem;
}
.relation-gangdong .biz-area ul li.ci::before {
  background: url("../../images/icon/icon_ci.png") no-repeat 0 0;
  background-size: cover;
}
.relation-gangdong .biz-area ul li.teamwork::before {
  background: url("../../images/icon/icon_people.png") no-repeat 0 0;
  background-size: cover;
}
.relation-gangdong .biz-area ul li.client::before {
  background: url("../../images/icon/icon_read.png") no-repeat 0 0;
  background-size: cover;
}
.relation-gangdong .purpose-area {
  margin-top: 14rem;
}
.relation-gangdong .purpose-area > .title {
  font-size: 5.2rem;
  font-weight: 700;
  line-height: 140%;
  text-align: center;
}
.relation-gangdong .purpose-area ul {
  margin-top: 3rem;
}
.relation-gangdong .purpose-area ul li {
  padding: 3.2rem 2rem;
  border: 0.1rem solid #dadadf;
  border-radius: 3.2rem;
  -webkit-border-radius: 3.2rem;
  -moz-border-radius: 3.2rem;
  -ms-border-radius: 3.2rem;
  -o-border-radius: 3.2rem;
}
.relation-gangdong .purpose-area ul li + li {
  margin-top: 1rem;
}
.relation-gangdong .purpose-area ul li .title {
  text-align: center;
  font-size: 2.4rem;
  color: #e60001;
  font-weight: 600;
  line-height: 140%;
}
.relation-gangdong .purpose-area ul li .para {
  margin-top: 1rem;
  color: #222;
  font-size: 2rem;
  font-weight: 400;
  line-height: 140%;
  /* 28px */
  text-align: center;
}
.relation-gangdong .biz-content {
  margin-top: 12rem;
}
.relation-gangdong .biz-content > .title {
  font-size: 5.2rem;
  font-weight: 700;
  line-height: 140%;
  text-align: center;
}
.relation-gangdong .biz-content ul {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 0.5rem;
  margin-top: 3rem;
}
.relation-gangdong .biz-content ul li {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  width: 24%;
  padding: 2.4rem 0 3.2rem;
  border: 0.1rem solid #dadadf;
  border-radius: 3.2rem;
}
.relation-gangdong .biz-content ul li .red {
  display: block;
  text-align: center;
  color: #e60001;
  font-size: 3rem;
  font-weight: 600;
  line-height: 140%;
}
.relation-gangdong .biz-content ul li p {
  font-size: 2rem;
  font-weight: 400;
  line-height: 140%;
  text-align: center;
}
.relation-gangdong .biz-content ul li:nth-child(2n-1) {
  background: #f4f4f4;
}
.relation-gangdong .biz-content ul li:nth-child(-n+3) {
  width: 32.4%;
}
.relation-gangdong .logo-meaning {
  margin-top: 12rem;
}
.relation-gangdong .logo-meaning > .title {
  font-size: 5.2rem;
  font-weight: 700;
  line-height: 140%;
  text-align: center;
}
.relation-gangdong .logo-meaning .para {
  margin-top: 2rem;
  text-align: center;
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 140%;
}
.relation-gangdong .logo-meaning .para .red {
  color: #e60001;
  font-weight: 600;
  font-size: 2.4rem;
}
.relation-gangdong .logo-meaning .img-area {
  margin-top: 4rem;
}
.relation-gangdong .festival-area .program-list .result-list {
  margin-top: 2rem;
}
.relation-gangdong .festival-area .program-list .result-list .result-box .info-area .date {
  display: block;
  margin-top: 2.6rem;
  color: #555;
  font-size: 1.5rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.06rem;
}
.relation-gangdong .festival-area .program-list.gallery .result-list .result-box .img-area {
  width: 32rem;
  max-width: 32rem;
  height: 22rem;
}
.relation-gangdong .festival-area .program-list.gallery .result-list .result-box .img-area img {
  width: 100%;
  height: 100%;
}
.relation-gangdong .table-list-area {
  margin-top: 10rem;
}
.relation-gangdong .table-list-area .table-area .top {
  display: flex;
  justify-content: space-between;
  padding-bottom: 0.8rem;
  border-bottom: 0.2rem solid #222;
}
.relation-gangdong .table-list-area .table-area .top .title {
  font-size: 2.4rem;
  font-weight: 600;
  line-height: 140%;
}
.relation-gangdong .table-list-area .table-area .top .close::before {
  content: "";
  display: inline-flex;
  width: 3rem;
  height: 3rem;
  background: url("../../images/icon/icon_table_arrow.png") no-repeat 0 0;
  background-size: cover;
}
.relation-gangdong .table-list-area .table-area .top .close.on::before {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
}
.relation-gangdong .table-list-area .table-area .table table {
  text-align: center;
  border-bottom: 0.1rem solid #dadadf;
}
.relation-gangdong .table-list-area .table-area .table table thead th {
  padding: 0.8rem;
  background: #f4f4f4;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.016rem;
  border-right: 0.1rem solid #dadadf;
}
.relation-gangdong .table-list-area .table-area .table table thead th:last-child {
  border-right: 0;
}
.relation-gangdong .table-list-area .table-area .table table tbody td {
  padding: 0.8rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.016rem;
  border-right: 0.1rem solid #dadadf;
  border-top: 0.1rem solid #dadadf;
}
.relation-gangdong .table-list-area .table-area .table table tbody td a {
  text-decoration: underline;
}
.relation-gangdong .table-list-area .table-area .table table tbody td:last-child {
  border-right: 0;
}
.relation-gangdong .table-list-area .table-area + .table-area {
  margin-top: 4rem;
}

.e-library .service-area > .title {
  position: relative;
  display: inline-block;
  margin-bottom: 0.8rem;
  color: #222;
  font-size: 2.8rem;
  font-weight: 700;
  line-height: 140%;
  z-index: -1;
}
.e-library .service-area > .title.circle::after {
  content: "";
  position: absolute;
  right: -2.4rem;
  bottom: 0.4rem;
  width: 5rem;
  height: 5rem;
  background: #ffeabd;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  z-index: -1;
}
.e-library .service-area + .service-area {
  margin-top: 4rem;
}
.e-library .service-area .service-list .service-item .text-area .link-btn.download a::after {
  width: 1.6rem;
  height: 1.6rem;
  background: url("../../images/icon/icon_black_download_big.png") no-repeat 0 0;
  background-size: cover;
}

@media (max-width: 1024px) {
  .local-area .form-input .form-area .input-box .input-select .select {
    width: 33%;
  }
  .local-area .common-table-wrap .table-content .table-box {
    padding: 1.9rem 1.6rem;
  }
}
@media (max-width: 768px) {
  .festival-area .festival-notice {
    margin-top: 2rem;
  }
  .festival-area .festival-notice .flex-wrap {
    flex-direction: column-reverse;
  }
  .festival-area .festival-notice .flex-wrap .img-area {
    width: 100%;
  }
  .festival-area .festival-notice .flex-wrap .img-area img {
    width: 100%;
  }
  .festival-area .festival-notice .flex-wrap .list-area {
    width: 100%;
    margin-top: 4rem;
  }
  .festival-area .festival-notice .flex-wrap .list-area li {
    display: block;
    margin-top: 2.4rem;
  }
  .festival-area .festival-notice .flex-wrap .list-area li .list-title {
    font-size: 1.8rem;
  }
  .festival-area .festival-notice .flex-wrap .list-area li .date {
    margin-top: 0.4rem;
  }
  .festival-area .program-list {
    margin-top: 2rem;
  }
  .festival-area .program-list .result-list .result-box .info-area .name {
    font-size: 1.8rem;
  }
  .festival-area .program-list .result-list .result-box .info-area ul li {
    align-items: center;
  }
  .festival-area .program-list .result-list .result-box .info-area ul li span {
    font-size: 1.5rem;
  }
  .festival-area .program-list .result-list .result-box .info-area ul li span.text {
    font-size: 1.5rem;
  }
  .festival-area .program-list .result-list .result-box:first-child {
    display: block;
  }
  .festival-area .tab-wrap {
    margin-top: 5rem;
  }
  .festival-area .tab-wrap .program-list {
    margin-top: 2rem;
  }
  .festival-area .tab-wrap .program-list .result-list {
    gap: 4rem 0;
  }
  .festival-area .tab-wrap .program-list .result-list .result-box {
    display: block;
  }
  .relation-gangdong .intro-area .pc {
    display: none;
  }
  .relation-gangdong .intro-area .mo {
    display: block;
  }
  .relation-gangdong .biz-area .title {
    font-size: 2.4rem;
  }
  .relation-gangdong .biz-area ul {
    display: block;
  }
  .relation-gangdong .biz-area ul li {
    flex-direction: row;
    justify-content: flex-start;
    padding: 1rem 0;
    margin-top: 3rem;
  }
  .relation-gangdong .biz-area ul li::before {
    width: 4.8rem;
    height: 4.8rem;
    margin: unset;
    margin-right: 2rem;
  }
  .relation-gangdong .biz-area ul li p {
    display: flex;
    flex-wrap: wrap;
  }
  .relation-gangdong .biz-area ul li p span {
    display: block;
    width: 100%;
    text-align: left;
  }
  .relation-gangdong .biz-area ul li p span.title {
    text-align: left;
    font-size: 1.8rem;
  }
  .relation-gangdong .biz-area ul li p span.text {
    margin-top: 0;
    font-size: 1.5rem;
  }
  .relation-gangdong .biz-area ul li p br {
    display: none;
  }
  .relation-gangdong .purpose-area {
    margin-top: 8rem;
  }
  .relation-gangdong .purpose-area > .title {
    font-size: 2.4rem;
  }
  .relation-gangdong .purpose-area ul li .title {
    font-size: 1.8rem;
  }
  .relation-gangdong .purpose-area ul li .para {
    font-size: 1.5rem;
  }
  .relation-gangdong .purpose-area ul li br {
    display: none;
  }
  .relation-gangdong .biz-content {
    margin-top: 8rem;
  }
  .relation-gangdong .biz-content > .title {
    font-size: 2.4rem;
  }
  .relation-gangdong .biz-content ul li {
    flex-direction: row;
    justify-content: flex-start;
    width: 100%;
    padding: 1.6rem 2rem;
    text-align: left;
  }
  .relation-gangdong .biz-content ul li:nth-child(-n+3) {
    width: 100%;
  }
  .relation-gangdong .biz-content ul li .red {
    margin-right: 1.6rem;
    font-size: 2.4rem;
  }
  .relation-gangdong .biz-content ul li br {
    display: none;
  }
  .relation-gangdong .biz-content ul li p {
    font-size: 1.5rem;
    text-align: left;
  }
  .relation-gangdong .logo-meaning {
    margin-top: 8rem;
  }
  .relation-gangdong .logo-meaning > .title {
    font-size: 2.4rem;
  }
  .relation-gangdong .logo-meaning .para {
    font-size: 1.5rem;
  }
  .relation-gangdong .logo-meaning .para .red {
    font-size: inherit;
  }
  .relation-gangdong .logo-meaning .para br {
    display: none;
  }
  .relation-gangdong .table-list-area .table-area {
    overflow: auto;
  }
  .relation-gangdong .table-list-area .table-area .table {
    width: 70rem;
  }
  .map-wrap {
    margin-top: 2rem;
  }
  .map-wrap .map-area {
    margin: 2rem auto 0;
  }
  .map-wrap .map-area .library-info {
    overflow: auto;
  }
  .map-wrap .map-area .library-info table {
    width: 70rem;
  }
  .map-wrap .map-area .map {
    display: none;
  }
  .map-wrap .map-area .map-content {
    width: 100%;
    margin-left: 0;
  }
  .map-wrap .map-area .map-content .img-area {
    text-align: center;
  }
  .map-wrap .map-area .map-content .select-area {
    display: block;
    margin-bottom: 3rem;
  }
  .map-wrap .map-area.waiting .map {
    display: none;
  }
  .map-wrap .map-area.waiting .map-content {
    width: 100%;
    margin-left: 0;
  }
  .map-wrap .map-area.waiting .map-content .select-area {
    display: block;
  }
  .local-area .form-input .form-area .input-box .title + div {
    width: 100%;
  }
  .local-area .form-input .wrap-btn {
    margin-top: 1rem;
  }
}
.service-list .service-item p .sub {
  display: block;
  color: #555;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.016rem;
}
.service-list .service-item p.only {
  margin-bottom: 1.2rem;
}
.service-list .service-item .text-area .method-area p.title {
  color: #222;
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 160%;
  letter-spacing: -0.027rem;
}
.service-list .service-item .text-area .method-area p.sub-title {
  margin-bottom: 1.4rem;
  color: #555;
  font-weight: 600;
  line-height: 160%;
  letter-spacing: -0.033rem;
  font-size: 2.2rem;
}
.service-list .service-item .text-area .method-area p.sub-title + .sub-title {
  margin-top: 4rem;
}
.service-list .service-item .text-area .method-area ul {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 1rem;
}
.service-list .service-item .text-area .method-area ul li {
  display: flex;
  flex-direction: column;
  width: 24%;
  padding: 1rem 1.6rem;
  background: #f4f4f4;
  text-align: center;
  box-sizing: border-box;
  border-radius: 0.6rem;
}
.service-list .service-item .text-area .method-area ul li:before {
  display: none !important;
  content: "";
  display: inline-flex;
  width: 8rem;
  height: 8rem;
  margin: 0 auto;
}
.service-list .service-item .text-area .method-area ul li.plus:before {
  background: url("../../images/icon/icon_user_plus.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.document:before {
  background: url("../../images/icon/icon_document.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.doc_plus:before {
  background: url("../../images/icon/icon_document_plus.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.check:before {
  background: url("../../images/icon/icon_user_check.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.stamp:before {
  background: url("../../images/icon/icon_stamp.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.file:before {
  background: url("../../images/icon/icon_file_clip.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.file_v2:before {
  background: url("../../images/icon/icon_circle_file.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.check_v2:before {
  background: url("../../images/icon/icon_circle_check.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.mobile:before {
  background: url("../../images/icon/icon_phone_check.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.membership:before {
  background: url("../../images/icon/icon_membership.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.card:before {
  background: url("../../images/icon/icon_member_plus.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.lock:before {
  background: url("../../images/icon/icon_lock.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.stamp:before {
  background: url("../../images/icon/icon_user_stamp.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.eye:before {
  background: url("../../images/icon/icon_eye.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.shipment:before {
  background: url("../../images/icon/icon_shipment.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.search:before {
  background: url("../../images/icon/icon_search.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.play:before {
  background: url("../../images/icon/icon_play.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.write:before {
  background: url("../../images/icon/icon_write.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.book:before {
  background: url("../../images/icon/icon_book.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.send:before {
  background: url("../../images/icon/icon_send.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.folder:before {
  background: url("../../images/icon/icon_foler_plus.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.payment:before {
  background: url("../../images/icon/icon_payment.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.trade:before {
  background: url("../../images/icon/icon_trade.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.lib:before {
  background: url("../../images/icon/icon_library.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.download:before {
  background: url("../../images/icon/icon_cloud_dowload.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.upload:before {
  background: url("../../images/icon/icon_cloud_upload.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.phone:before {
  background: url("../../images/icon/icon_service_07.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li.date:before {
  background: url("../../images/icon/icon_date.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li .download {
  margin-top: -1rem;
}
.service-list .service-item .text-area .method-area ul li .download a {
  border-bottom: 0.1rem solid #222;
  color: #222;
  font-weight: 500;
  font-size: 1.5rem;
}
.service-list .service-item .text-area .method-area ul li .download a:after {
  content: "";
  display: inline-flex;
  width: 1.6rem;
  height: 1.6rem;
  margin-left: 0.2rem;
  background: url("../../images/icon/icon_black_download.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul li strong {
  color: #555;
  text-align: center;
  font-weight: 400;
  line-height: 140%;
  text-indent: 0;
  /* 22.4px */
}
.service-list .service-item .text-area .method-area ul li p {
  padding-left: 0;
  margin-top: 0.8rem;
  color: #222;
  text-align: center;
  font-size: 1.9rem;
  font-weight: 600;
  line-height: 120%;
  text-indent: 0;
}
.service-list .service-item .text-area .method-area ul li p.only {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  margin: 0;
}
.service-list .service-item .text-area .method-area ul li p::before {
  display: none;
}
.service-list .service-item .text-area .method-area ul.full-height {
  align-items: unset;
}
.service-list .service-item .text-area .method-area ul.full-width {
  width: 100%;
}
.service-list .service-item .text-area .method-area ul.full-width li {
  flex: 1;
}
.service-list .service-item .text-area .method-area ul.column {
  flex-direction: column;
}
.service-list .service-item .text-area .method-area ul.column li {
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
  width: 100%;
  text-align: left;
  background: none;
  border-bottom: 0.1rem solid #dadadf;
  border-radius: 0;
}
.service-list .service-item .text-area .method-area ul.column li p {
  text-align: left;
  margin-top: 0;
  margin-left: 1.6rem;
  text-indent: 0;
}
.service-list .service-item .text-area .method-area ul.column li:last-child {
  border-bottom: 0;
}
.service-list .service-item .text-area .method-area ul.column li::before {
  content: "";
  display: block;
  display: inline-flex;
  width: 16rem;
  height: 4rem;
}
.service-list .service-item .text-area .method-area ul.column .gray-bg {
  position: relative;
  background: #f4f4f4;
  padding: 2.4rem;
  margin-top: 1.4rem;
  border-radius: 2rem;
}
.service-list .service-item .text-area .method-area ul.column .gray-bg .box {
  width: calc(100% - 20rem);
}
.service-list .service-item .text-area .method-area ul.column .gray-bg .box strong {
  padding-left: 1rem;
  color: #222;
  font-size: 2.2rem;
  font-weight: 600;
  line-height: 120%;
  letter-spacing: -0.044rem;
}
.service-list .service-item .text-area .method-area ul.column .gray-bg .box p {
  text-align: left;
  margin: 0;
  margin-top: 1.5rem;
  color: #222;
  font-size: 1.7rem;
  font-weight: 400;
  line-height: 160%;
  letter-spacing: -0.034rem;
}
.service-list .service-item .text-area .method-area ul.column .gray-bg .newwindow {
  position: absolute;
  top: 1.4rem;
  right: 2.4rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  border-radius: 0.2rem;
  border: 1px solid #dadadf;
  background: #fff;
  -webkit-border-radius: 0.2rem;
  -moz-border-radius: 0.2rem;
  -ms-border-radius: 0.2rem;
  -o-border-radius: 0.2rem;
}
.service-list .service-item .text-area .method-area ul.column .gray-bg .newwindow::before {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  background: url("../../images/icon/icon_window.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul.column .gray-bg .newwindow.w100 {
  position: static;
  top: 1.7rem;
  width: 100%;
  margin-top: 1rem;
  max-width: auto;
  height: 4rem;
}
.service-list .service-item .text-area .method-area ul.column .gray-bg .newwindow.w100::before {
  display: none;
}
.service-list .service-item .text-area .method-area ul.column .gray-bg .newwindow.w100::after {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  margin-left: 0.5rem;
  background: url("../../images/icon/icon_window.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul.column .gray-bg::before {
  content: "";
  display: inline-flex !important;
  width: 16rem;
  height: 4rem;
  background: green;
}
.service-list .service-item .text-area .method-area ul.column .gray-bg.egov::before {
  background: url("../../images/icon/icon_egov_db.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area ul.column .gray-bg.e-lib::before {
  background: url("../../images/icon/icon_e-libray.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .method-area .ect {
  margin-top: 2rem;
  color: #555;
  font-weight: 400;
  letter-spacing: -0.016rem;
}
.service-list .service-item .text-area .method-area + .method-area {
  margin-top: 4rem;
}
.service-list .service-item .text-area .method-area .step-list {
  margin-top: 2.4rem;
}
.service-list .service-item .text-area .method-area.w20 ul > li {
  width: 20rem;
}
.service-list .service-item .text-area .link-btn {
  margin-top: 1rem;
  justify-content: flex-start;
}
.service-list .service-item .text-area .link-btn a {
  border: 0;
  padding: 0;
  border-bottom: 0.1rem solid #222;
  font-size: 1.8rem;
  color: #222;
  font-weight: 500;
}
.service-list .service-item .text-area .link-btn a:before {
  display: none;
}
.service-list .service-item .text-area .link-btn a:after {
  content: "";
  display: inline-flex;
  width: 2.5rem;
  height: 2.5rem;
  margin-left: 0.4rem;
  background: url("../../images/icon/icon_black_arrow.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .link-btn a + a {
  margin-left: 1.6rem;
}
.service-list .service-item .text-area .link-btn.newwindow {
  display: inline-block;
  padding: 0.95rem 1.6rem;
  border-radius: 2rem;
  border: 0.1rem solid #ccc;
  -webkit-border-radius: 0.2rem;
  -moz-border-radius: 0.2rem;
  -ms-border-radius: 0.2rem;
  -o-border-radius: 0.2rem;
}
.service-list .service-item .text-area .link-btn.newwindow a {
  border: none;
}
.service-list .service-item .text-area .link-btn.newwindow a::after {
  width: 2rem;
  height: 2rem;
  background: url("../../images/icon/icon_window.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .link-btn.download {
  display: inline-block;
  padding: 0.95rem 1.6rem;
  border-radius: 2rem;
  border: 0.1rem solid #ccc;
  -webkit-border-radius: 0.2rem;
  -moz-border-radius: 0.2rem;
  -ms-border-radius: 0.2rem;
  -o-border-radius: 0.2rem;
}
.service-list .service-item .text-area .link-btn.download a {
  border: none;
}
.service-list .service-item .text-area .link-btn.download a::after {
  background: url("../../images/icon/icon_download.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .table-area {
  margin-top: 6rem;
}
.service-list .service-item .text-area .table-area p.title {
  display: flex;
  align-items: center;
  width: 100%;
  font-size: 1.8rem;
  color: #555;
  font-weight: 600;
  line-height: 160%;
  /* 25.6px */
  letter-spacing: -0.027rem;
}
.service-list .service-item .text-area .table-area table {
  border-top: 0.1rem solid #929292;
}
.service-list .service-item .text-area .table-area table thead th {
  padding: 0.6rem 0;
  border-right: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  background: #f4f4f4;
  color: #222;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.016rem;
  font-size: 1.9rem;
}
.service-list .service-item .text-area .table-area table thead th:last-child {
  border-right: 0;
}
.service-list .service-item .text-area .table-area table tbody tr.center td {
  text-align: center;
}
.service-list .service-item .text-area .table-area table tbody th {
  border-right: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  font-weight: 500;
  line-height: 140%;
  letter-spacing: -0.016rem;
  font-size: 1.9rem;
}
.service-list .service-item .text-area .table-area table tbody th:last-child {
  border-right: 0;
}
.service-list .service-item .text-area .table-area table tbody td {
  padding: 0.6rem 1.4rem;
  border-right: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  font-weight: 400;
  line-height: 140%;
  color: #555;
  letter-spacing: -0.016rem;
  font-size: 1.9rem;
  word-break: keep-all;
}
.service-list .service-item .text-area .table-area table tbody td:last-child {
  border-right: 0;
}
.service-list .service-item .text-area .table-area table tbody td.bdr {
  border-right: 0.1rem solid #dadadf;
}
.service-list .service-item .text-area .table-area table tbody td.th {
  color: #222;
  font-weight: 500;
}
.service-list .service-item .text-area .table-area table tbody td p {
  padding-left: 0;
  margin-top: 0;
}
.service-list .service-item .text-area .table-area table tbody td p.center {
  text-align: center;
}
.service-list .service-item .text-area .table-area table tbody td p.bold {
  font-weight: 500;
  text-align: center;
  justify-content: center;
}
.service-list .service-item .text-area .table-area table tbody td p::before {
  display: none;
}
.service-list .service-item .text-area .table-area table tbody td .next {
  display: block;
  margin: 0.6rem 0;
  font-size: 0;
  line-height: 1;
}
.service-list .service-item .text-area .table-area table tbody td .next::before {
  content: "";
  display: inline-block;
  gap: 0.6rem 0;
  width: 2.4rem;
  height: 2.45rem;
  background: url("../../images/icon/icon_join_step.png") no-repeat 0 0;
  background-size: cover;
}
.service-list .service-item .text-area .table-area table tbody td .sub-text {
  line-height: 120%;
}
.service-list .service-item .text-area .table-area table.center {
  text-align: center;
}
.service-list .service-item .text-area .table-area table.center tbody tr td.left {
  text-align: left;
}
.service-list .service-item .text-area .table-area.center th,
.service-list .service-item .text-area .table-area.center td {
  text-align: center;
}
.service-list .service-item .text-area .table-area.mt14 {
  margin-top: 1.4rem;
}
.service-list .service-item .text-area .table-area.mt14 td:last-child {
  border-left: 0.1rem solid #dadadf;
}
.service-list .service-item .text-area .table-area.mt0 {
  margin-top: 0;
}
.service-list .service-item .text-area .table-area.mt16 {
  margin-top: 1.6rem;
}
.service-list .service-item .text-area .table-area.mb12 {
  margin-bottom: 1.2rem;
}
.service-list .service-item .text-area .table-area + .table-area {
  margin-top: 2.4rem;
}
.service-list .service-item .text-area .table-area .sub-title {
  color: #222;
  font-size: 2.2rem;
  font-weight: 600;
  line-height: 160%;
  /* 35.2px */
  letter-spacing: -0.033rem;
}
.service-list .service-item .text-area ul {
  margin-top: 1.2rem;
}
.service-list .service-item .text-area ul > li {
  padding-left: 1rem;
  color: #555;
  font-weight: 400;
  line-height: 160%;
  letter-spacing: -0.024rem;
  text-indent: -1rem;
  font-size: 1.6rem;
}

.calendar-wrap {
  width: calc(100% - 44rem);
}
.calendar-wrap .calendar-info {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
}
.calendar-wrap .calendar-info .calendar-date .date {
  color: #222;
  font-weight: 600;
  font-size: 3.2rem;
}
.calendar-wrap .calendar-info .calendar-control {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption {
  display: flex;
  justify-content: flex-end;
  gap: 1.4rem;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span {
  display: flex;
  flex-flow: row wrap;
  justify-content: center;
  align-items: center;
  gap: 0.6rem;
  font-weight: 400;
  font-size: 1.6rem;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span::before {
  content: "";
  display: flex;
  justify-content: center;
  align-items: center;
  width: 1.8rem;
  height: 1.8rem;
  border-radius: 0.4rem;
  color: #fff;
  font-weight: 500;
  font-size: 1.4rem;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.holiday {
  color: #555;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.holiday::before {
  content: "A";
  background-color: #555;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.event {
  color: #ba6162;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.event::before {
  content: "E";
  background-color: #ba6162;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.program {
  color: #6164ba;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.program::before {
  content: "C";
  background-color: #6164ba;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.ect {
  color: #609945;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.ect::before {
  content: "R";
  background-color: #609945;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.possible {
  color: #555;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.possible::before {
  border: 0.1rem solid #dadadf;
  border-radius: 0;
  background-color: #fff;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.impossible {
  color: #555;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.impossible::before {
  border: 0.1rem solid #dadadf;
  border-radius: 0;
  background-color: #f4f4f4;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.choice {
  color: #555;
}
.calendar-wrap .calendar-info .calendar-control .calendar-caption span.choice::before {
  border: 0.1rem solid #dadadf;
  border-radius: 0;
  background-color: #fff3e0;
}
.calendar-wrap .calendar-info .calendar-btn {
  display: flex;
  gap: 0.4rem;
}
.calendar-wrap .calendar-info .calendar-btn .btn {
  padding: 0 1.4rem;
  height: 4rem;
  background-color: #f4f4f4;
  border-radius: 0.2rem;
  color: #222;
  font-weight: 600;
  font-size: 1.6rem;
}
.calendar-wrap .calendar-info .calendar-btn .btn:hover {
  background-color: #eaeaea;
}
.calendar-wrap .calendar-info .calendar-btn .btn.btn-prev {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 4rem;
  height: 4rem;
  padding: 0.4rem;
  border: 0.1rem solid #dadadf;
  border-radius: 0.4rem;
  background-color: #fff;
}
.calendar-wrap .calendar-info .calendar-btn .btn.btn-prev::before {
  content: "";
  display: flex;
  width: 0.8rem;
  height: 1.6rem;
  background: url("../../images/icon/icon_arrow.png") center/100% no-repeat;
}
.calendar-wrap .calendar-info .calendar-btn .btn.btn-prev:hover {
  background-color: #f4f4f4;
}
.calendar-wrap .calendar-info .calendar-btn .btn.btn-prev:disabled {
  background-color: #eaeaea;
  color: #929292;
}
.calendar-wrap .calendar-info .calendar-btn .btn.btn-next {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 4rem;
  height: 4rem;
  padding: 0.4rem;
  border: 0.1rem solid #dadadf;
  border-radius: 0.4rem;
  background-color: #fff;
}
.calendar-wrap .calendar-info .calendar-btn .btn.btn-next::before {
  content: "";
  display: flex;
  width: 0.8rem;
  height: 1.6rem;
  background: url("../../images/icon/icon_arrow.png") center/100% no-repeat;
  transform: rotate(180deg);
}
.calendar-wrap .calendar-info .calendar-btn .btn.btn-next:hover {
  background-color: #f4f4f4;
}
.calendar-wrap .calendar-info .calendar-btn .btn.btn-next:disabled {
  background-color: #eaeaea;
  color: #929292;
}
.calendar-wrap .table.calendar {
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  margin-top: 0.8rem;
  border: 0.1rem solid #dadadf;
  border-radius: 0.4rem;
}
.calendar-wrap .table.calendar thead tr th {
  width: 14.2857142857%;
  max-width: 14.2857142857%;
  height: 4.2rem;
  padding: 1rem;
  background-color: #fff;
  vertical-align: middle;
}
.calendar-wrap .table.calendar thead tr th:first-child {
  border-top-left-radius: 0.4rem;
}
.calendar-wrap .table.calendar thead tr th:last-child {
  border-top-right-radius: 0.4rem;
}
.calendar-wrap .table.calendar thead tr th span {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 2.2rem;
  color: #000;
  font-weight: 400;
  font-size: 1.6rem;
}
.calendar-wrap .table.calendar thead tr th span.sun {
  color: #c80012;
}
.calendar-wrap .table.calendar thead tr th span.sat {
  color: #338fc3;
}
.calendar-wrap .table.calendar tbody tr td {
  width: 14.2857142857%;
  max-width: 14.2857142857%;
  height: 10rem;
  padding: 0.4rem;
  border-top: 0.1rem solid #dadadf;
  border-left: 0.1rem solid #dadadf;
  background-color: #fff;
  vertical-align: top;
}
.calendar-wrap .table.calendar tbody tr td:nth-child(7n+1) {
  border-left: 0;
}
.calendar-wrap .table.calendar tbody tr td .day {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 2.2rem;
  color: #000;
  font-weight: 400;
  font-size: 1.6rem;
}
.calendar-wrap .table.calendar tbody tr td.sun > span {
  color: #c80012;
}
.calendar-wrap .table.calendar tbody tr td.sat > span {
  color: #338fc3;
}
.calendar-wrap .table.calendar tbody tr td.today {
  position: relative;
}
.calendar-wrap .table.calendar tbody tr td.today .today {
  position: absolute;
  bottom: 0.8rem;
  left: 50%;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  height: 2rem;
  padding: 0 0.4rem;
  color: #fff;
  font-weight: 600;
  font-size: 1.3rem;
  border-radius: 0.4rem;
  background-color: #ba8261;
  transform: translateX(-50%);
}
.calendar-wrap .table.calendar tbody tr td.choice {
  background-color: #fff3e0;
}
.calendar-wrap .table.calendar tbody tr td.noday .day {
  opacity: 0.3;
}
.calendar-wrap .table.calendar tbody tr td .list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.4rem;
}
.calendar-wrap .table.calendar tbody tr td .list li a {
  display: inline-flex;
  justify-content: center;
  align-items: center;
}
.calendar-wrap .table.calendar tbody tr td .list li a span {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
  color: #fff;
  font-weight: 500;
  font-size: 1.3rem;
  border-radius: 0.4rem;
}
.calendar-wrap .table.calendar tbody tr td .list li a.holiday span {
  background-color: #555;
}
.calendar-wrap .table.calendar tbody tr td .list li a.event span {
  background-color: #ba6162;
}
.calendar-wrap .table.calendar tbody tr td .list li a.program span {
  background-color: #6164ba;
}
.calendar-wrap .table.calendar tbody tr td .list li a.etc span {
  background-color: #609945;
}
.calendar-wrap .table.calendar tbody tr:last-child td:first-child {
  border-bottom-left-radius: 0.4rem;
}
.calendar-wrap .table.calendar tbody tr:last-child td:last-child {
  border-bottom-right-radius: 0.4rem;
}
.calendar-wrap .table.rental tbody tr td .day {
  align-items: flex-start;
  width: 100%;
  height: 100%;
}
.calendar-wrap .table.rental tbody tr td .day span {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 2.2rem;
  color: #000;
  font-weight: 400;
  font-size: 1.6rem;
}
.calendar-wrap .table.rental tbody tr td.sun .day span {
  color: #c80012;
}
.calendar-wrap .table.rental tbody tr td.sat .day span {
  color: #338fc3;
}
.calendar-wrap .table.rental tbody tr td.today {
  padding-bottom: 0;
  background-color: #fff;
}
.calendar-wrap .table.rental tbody tr td.impossible {
  background-color: #f4f4f4;
}
.calendar-wrap .table.rental tbody tr td.impossible button {
  cursor: default;
}
.calendar-wrap .table.rental tbody tr td.choice {
  background-color: #fff3e0;
}
@media (max-width: 768px) {
  .calendar-wrap .calendar-info {
    align-items: flex-start;
    gap: 1.4rem;
    position: relative;
  }
  .calendar-wrap .calendar-info .calendar-date .date {
    font-size: 2.8rem;
    line-height: 1.4;
  }
  .calendar-wrap .calendar-info .calendar-control {
    flex-direction: column;
  }
  .calendar-wrap .calendar-info .calendar-control .calendar-caption {
    justify-content: flex-start;
    width: 100%;
  }
  .calendar-wrap .calendar-info .calendar-control .calendar-btn {
    position: absolute;
    top: 0;
    right: 0;
  }
  .calendar-wrap .calendar-info .calendar-control .calendar-btn .btn-month {
    display: none;
  }
}

.con-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 4rem;
  padding-top: 3rem;
}
.con-wrap .calendar-wrap {
  width: calc(100% - 40rem);
}
.con-wrap .guide-wrap {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
  overflow-y: auto;
  max-width: 35rem;
  width: 100%;
  max-height: 60rem;
  margin-top: 8.8rem;
  padding: 0 1rem 2.4rem 0;
  border-top: 0.2rem solid #000;
  border-bottom: 0.1rem solid #dadadf;
}
.con-wrap .guide-wrap .guide-info {
  display: flex;
  align-items: center;
  gap: 1rem;
  padding: 2.4rem 0;
  border-bottom: 0.1rem solid #dadadf;
}
.con-wrap .guide-wrap .guide-info .tag {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 2.2rem;
  padding: 0 0.6rem;
  border-radius: 0.2rem;
  background-color: #222;
  color: #fff;
  font-weight: 700;
  font-size: 1.4rem;
  line-height: 1.4;
}
.con-wrap .guide-wrap .guide-info .title {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  width: calc(100% - 5rem);
  color: #222;
  font-weight: 600;
  font-size: 2rem;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.con-wrap .guide-wrap .guide-area {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}
.con-wrap .guide-wrap .guide-area .time-box {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.con-wrap .guide-wrap .guide-area .time-box .input-box {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.con-wrap .guide-wrap .guide-area .time-box .input-box label {
  color: #222;
  font-weight: 600;
  font-size: 2rem;
  line-height: 1.4;
}
.con-wrap .guide-wrap .guide-area .time-box .input-box .select {
  display: flex;
  align-items: center;
  gap: 0.8rem;
}
.con-wrap .guide-wrap .guide-area .time-box .input-box .select select {
  width: 100%;
}
.con-wrap .guide-wrap .guide-area .time-box .input-box .select .btn-wrap {
  margin-top: 0;
}
.con-wrap .guide-wrap .guide-area .detail-box {
  border: 0.1rem solid #dadadf;
  border-radius: 0.4rem;
  padding: 2rem 2.4rem;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box {
  display: flex;
  flex-direction: column;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box .detail-info {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box .detail-info .title {
  color: #222;
  font-weight: 600;
  font-size: 2rem;
  line-height: 1.4;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box .detail-info .info {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box .detail-info .info dl {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box .detail-info .info dl dt {
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.4;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box .detail-info .info dl dd {
  width: calc(100% - 4rem);
  color: #222;
  font-weight: 500;
  font-size: 1.6rem;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box .detail-notice {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
  margin-top: 2.4rem;
  padding-top: 2rem;
  border-top: 0.1rem solid #dadadf;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box .detail-notice .title {
  color: #1a71ea;
  font-weight: 600;
  font-size: 1.6rem;
  line-height: 1.6;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box .detail-notice ul {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box .detail-notice ul li {
  display: flex;
  align-items: center;
  gap: 0.8rem;
  position: relative;
  padding-left: 1.2rem;
  color: #555;
  font-weight: 400;
  font-size: 1.5rem;
  line-height: 1.4;
}
.con-wrap .guide-wrap .guide-area .detail-box .item-box .detail-notice ul li::before {
  content: "";
  position: absolute;
  top: 0.7rem;
  left: 0;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background-color: #555;
}
.con-wrap .guide-wrap .guide-area > .btn-wrap {
  margin-top: 0;
}
.con-wrap .guide-wrap .guide-area > .btn-wrap .btn {
  min-width: auto;
  width: 100%;
}

.notice-wrap {
  padding-top: 0 !important;
}
.notice-wrap .search-area {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem;
  padding: 1.6rem 2.4rem;
  background-color: #f4f4f4;
}
.notice-wrap .search-area .input-box .select {
  max-width: 22rem;
  width: 100%;
}
.notice-wrap .search-area .input-box .input {
  display: flex;
  height: 4rem;
  border: 0;
  box-sizing: border-box;
}
.notice-wrap .search-area .input-box .input input {
  width: 38rem;
  padding: 0 2rem;
  border: 0.2rem solid #404040;
  border-radius: 0.2rem 0 0 0.2rem;
}
.notice-wrap .search-area .input-box .input.btn .btn {
  width: 12rem;
  height: 4rem;
  border-radius: 0 0.2rem 0.2rem 0;
  background-color: #404040;
  color: #fff;
  box-sizing: border-box;
}
.notice-wrap .search-area .input-box .input.btn .btn:hover {
  background: #111;
}
.notice-wrap .search-area .input-box .input.btn .btn:disabled {
  opacity: 0.4;
}
.notice-wrap .result-area {
  padding-top: 1rem;
}
.notice-wrap .result-area .control-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1rem 0 0.8rem;
}
.notice-wrap .result-area .control-box .total-box .total {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  color: #222;
  font-weight: 500;
  font-size: 1.8rem;
}
.notice-wrap .result-area .control-box .total-box .total span {
  color: #e60001;
  font-weight: 700;
  font-size: 1.8rem;
}
.notice-wrap .result-area .control-box .input-box .select select {
  width: 10rem;
}
.notice-wrap .result-area .list-box {
  padding-bottom: 3rem;
  border-top: 0.2rem solid #555;
}
.notice-wrap .result-area .list-box ul li {
  border-bottom: 0.1rem solid #dadadf;
}
.notice-wrap .result-area .list-box ul li .list-item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 2.4rem 2rem;
}
.notice-wrap .result-area .list-box ul li .list-item.notice {
  background-color: #f4f4f4;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con {
  display: flex;
  align-items: center;
  gap: 1rem;
  width: 100%;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con .tag {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 2.2rem;
  padding: 0 0.6rem;
  border-radius: 0.2rem;
  background-color: #404040;
  color: #fff;
  font-weight: 700;
  font-size: 1.4rem;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con .tag.gangil {
  background: #0050cc;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con .tag.dunchon {
  background: #0f8448;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con .tag.bookcafe {
  background: #7b4420;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con .tag.seongnae {
  background: #917200;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con .tag.supsok {
  background: #5d8200;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con .tag.amsa {
  background: #da2b7d;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con .tag.small {
  background: #0079cf;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con .tag.jungang {
  background: #e60001;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con .tag.cheonho {
  background: #6430a3;
}
.notice-wrap .result-area .list-box ul li .list-item .item-con .tag.haegong {
  background: #c75300;
}
.notice-wrap .result-area .list-box ul li .list-item .item-meta .date {
  display: inline-block;
  width: 8.5rem;
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
}
.notice-wrap .result-area .list-box ul li .list-item:hover a {
  border-bottom: 0.1rem solid #222;
}
.notice-wrap .detail-area {
  border-top: 0.2rem solid #555;
}
.notice-wrap .detail-area .title-box {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 1rem;
  padding: 2.4rem 2rem;
}
.notice-wrap .detail-area .title-box .item-con {
  display: flex;
  align-items: center;
  gap: 1rem;
  width: 100%;
}
.notice-wrap .detail-area .title-box .item-con .tag {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 2.2rem;
  padding: 0 0.6rem;
  border-radius: 0.2rem;
  background-color: #404040;
  color: #fff;
  font-weight: 700;
  font-size: 1.4rem;
}
.notice-wrap .detail-area .title-box .item-con .tag.gangil {
  background: #0050cc;
}
.notice-wrap .detail-area .title-box .item-con .tag.dunchon {
  background: #0f8448;
}
.notice-wrap .detail-area .title-box .item-con .tag.bookcafe {
  background: #7b4420;
}
.notice-wrap .detail-area .title-box .item-con .tag.seongnae {
  background: #917200;
}
.notice-wrap .detail-area .title-box .item-con .tag.supsok {
  background: #5d8200;
}
.notice-wrap .detail-area .title-box .item-con .tag.amsa {
  background: #da2b7d;
}
.notice-wrap .detail-area .title-box .item-con .tag.small {
  background: #0079cf;
}
.notice-wrap .detail-area .title-box .item-con .tag.jungang {
  background: #e60001;
}
.notice-wrap .detail-area .title-box .item-con .tag.cheonho {
  background: #6430a3;
}
.notice-wrap .detail-area .title-box .item-con .tag.haegong {
  background: #c75300;
}
.notice-wrap .detail-area .title-box .item-con .text-box {
  display: flex;
  align-items: center;
  gap: 1rem;
  width: calc(100% - 4.7rem);
}
.notice-wrap .detail-area .title-box .item-con .text-box .title {
  display: inline-block;
  color: #222;
  font-weight: 500;
  font-size: 1.8rem;
}
.notice-wrap .detail-area .title-box .item-con .text-box .title span {
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.notice-wrap .detail-area .title-box .item-con .text-box .state {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.notice-wrap .detail-area .title-box .item-con .text-box .state .new {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2rem;
  height: 2rem;
}
.notice-wrap .detail-area .title-box .item-con .text-box .state .new::before {
  content: "";
  display: block;
  width: 2rem;
  height: 2rem;
  background: url("../../images/icon/icon_new.png") center/100% no-repeat;
}
.notice-wrap .detail-area .title-box .item-meta .date {
  white-space: nowrap;
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
}
.notice-wrap .detail-area .download-box {
  border-top: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
}
.notice-wrap .detail-area .download-box ul {
  display: flex;
  flex-direction: column;
}
.notice-wrap .detail-area .download-box ul li {
  border-bottom: 0.1rem solid #dadadf;
}
.notice-wrap .detail-area .download-box ul li .btn-download {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  width: calc(100% - 4rem);
  height: 4rem;
  padding: 0 2rem;
  background-color: #f4f4f4;
}
.notice-wrap .detail-area .download-box ul li .btn-download::before {
  content: "";
  display: flex;
  width: 1.6rem;
  height: 1.6rem;
  background: url("../../images/icon/icon_file.png") center/100% no-repeat;
}
.notice-wrap .detail-area .download-box ul li .btn-download::after {
  content: "";
  display: flex;
  width: 4rem;
  height: 4rem;
  margin-left: auto;
  background: url("../../images/icon/icon_download.png") center/100% no-repeat;
}
.notice-wrap .detail-area .download-box ul li .btn-download .title {
  max-width: calc(100% - 10rem);
  color: #555;
  font-weight: 500;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.notice-wrap .detail-area .download-box ul li .btn-download .byte {
  color: #929292;
  font-weight: 500;
  font-size: 1.4rem;
}
.notice-wrap .detail-area .download-box ul li:last-child {
  border-bottom: 0;
}
.notice-wrap .detail-area .con-box {
  padding: 4rem 2rem;
  min-height: 30rem;
}
.notice-wrap .detail-area .prevnext-box {
  display: flex;
}
.notice-wrap .detail-area .prevnext-box .btn-prevnext {
  flex: 1;
  display: inline-flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 0.4rem;
  padding: 2rem;
  border: 0.1rem solid #dadadf;
  background-color: #fff;
  box-sizing: border-box;
}
.notice-wrap .detail-area .prevnext-box .btn-prevnext + .btn-prevnext {
  border-left: 0;
}
.notice-wrap .detail-area .prevnext-box .btn-prevnext:hover {
  border: 0.2rem solid #e60001;
  padding: 1.9rem;
}
.notice-wrap .detail-area .prevnext-box .btn-prevnext:hover + .btn-prevnext {
  border-left: 0.2rem;
}
.notice-wrap .detail-area .prevnext-box .btn-prevnext:disabled {
  opacity: 0.4;
}
.notice-wrap .detail-area .prevnext-box .btn-prevnext .prevnext {
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
}
.notice-wrap .detail-area .prevnext-box .btn-prevnext .title {
  color: #222;
  font-weight: 500;
  font-size: 1.8rem;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.notice-wrap .detail-area .btn-wrap {
  display: flex;
  justify-content: center;
  margin-top: 0;
  padding-top: 4rem;
}
@media (max-width: 1024px) {
  .notice-wrap .search-area .input-box {
    display: flex;
    flex: 1;
  }
  .notice-wrap .search-area .input-box:last-child {
    flex: 1 1 100%;
  }
  .notice-wrap .search-area .input-box .select {
    max-width: 100%;
  }
  .notice-wrap .search-area .input-box .select select {
    width: 100%;
  }
  .notice-wrap .search-area .input-box .input {
    width: 100%;
  }
  .notice-wrap .search-area .input-box .input input {
    width: calc(100% - 12rem);
  }
}
@media (max-width: 768px) {
  .notice-wrap .search-area .input-box {
    flex: 1 1 100%;
  }
  .notice-wrap .search-area .input-box .input input {
    width: calc(100% - 6rem);
  }
  .notice-wrap .search-area .input-box .input.btn .btn {
    width: 6rem;
  }
  .notice-wrap .result-area .control-box {
    padding: 1rem 0;
  }
  .notice-wrap .result-area .control-box .total-box .total {
    font-size: 1.6rem;
  }
  .notice-wrap .result-area .list-box ul li .list-item {
    flex-direction: column;
    align-items: flex-start;
    padding: 1.6rem 1rem;
  }
  .notice-wrap .result-area .list-box ul li .list-item .item-con {
    flex-direction: column;
    align-items: flex-start;
  }
  .notice-wrap .result-area .list-box ul li .list-item .item-con .link-box {
    align-items: flex-start;
    width: 100%;
  }
  .notice-wrap .result-area .list-box ul li .list-item .item-con .link-box .btn-link span {
    font-size: 1.8rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
  }
  .notice-wrap .result-area .list-box ul li .list-item .item-meta .date {
    font-size: 1.4rem;
  }
  .notice-wrap .detail-area .title-box {
    flex-direction: column;
    align-items: flex-start;
    padding: 1.6rem 1rem;
  }
  .notice-wrap .detail-area .title-box .item-con {
    flex-direction: column;
    align-items: flex-start;
  }
  .notice-wrap .detail-area .title-box .item-con .text-box {
    align-items: flex-start;
    align-items: center;
    width: 100%;
  }
  .notice-wrap .detail-area .title-box .item-con .text-box .title span {
    font-size: 1.8rem;
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
  }
  .notice-wrap .detail-area .title-box .item-meta .date {
    font-size: 1.4rem;
  }
  .notice-wrap .detail-area .download-box ul li .btn-download {
    width: calc(100% - 2rem);
    padding: 0 1rem;
  }
  .notice-wrap .detail-area .prevnext-box {
    flex-direction: column;
  }
  .notice-wrap .detail-area .prevnext-box .btn-prevnext {
    padding: 2rem 0;
    border-left: 0;
    border-right: 0;
  }
  .notice-wrap .detail-area .prevnext-box .btn-prevnext + .btn-prevnext {
    border-top: 0;
  }
  .notice-wrap .detail-area .prevnext-box .btn-prevnext .prevnext {
    font-size: 1.4rem;
  }
  .notice-wrap .detail-area .prevnext-box .btn-prevnext .title {
    font-size: 1.6rem;
  }
}

.schedule-wrap .tab-wrap .tab-btn {
  display: flex;
  flex-wrap: wrap;
  height: auto;
  border: 0;
}
.schedule-wrap .tab-wrap .tab-btn button {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  height: 4.6rem;
  padding: 0 1.6rem 0 1.2rem;
  border: 0;
  color: #222;
  font-weight: 500;
  font-size: 1.8rem;
}
.schedule-wrap .tab-wrap .tab-btn button::before {
  content: "";
  display: flex;
  width: 0.4rem;
  height: 0.4rem;
  margin: 1rem;
  border-radius: 50%;
  background-color: #000;
}
.schedule-wrap .tab-wrap .tab-btn button.on, .schedule-wrap .tab-wrap .tab-btn button:hover {
  border-radius: 0.4rem;
  background-color: #000;
  color: #fff;
  font-weight: 600;
}
.schedule-wrap .tab-wrap .tab-btn button.on::before, .schedule-wrap .tab-wrap .tab-btn button:hover::before {
  width: 2.4rem;
  height: 2.4rem;
  margin: 0;
  border-radius: 0;
  background: url("../../images/icon/icon_check.png") center/100% no-repeat;
}
.schedule-wrap .tabpanel-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 4rem;
}
.schedule-wrap .tabpanel-wrap .guide-wrap {
  display: flex;
  flex-direction: column;
  gap: 2rem;
  max-width: 40rem;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .guide-info {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 2.4rem;
  padding-top: 0.8rem;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .guide-info .title {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  color: #222;
  font-weight: 600;
  font-size: 2.4rem;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .guide-info .title span {
  color: #222;
  font-weight: 600;
  font-size: 2.4rem;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .guide-info .message {
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area {
  display: flex;
  flex-direction: column;
  overflow-y: auto;
  height: 54rem;
  border-top: 0.2rem solid #000;
  border-bottom: 0.1rem solid #dadadf;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 2rem;
  padding: 3.2rem 0;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area li + li {
  border-top: 0.1rem solid #dadadf;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area li .info-box {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 100%;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area li .info-box .tag {
  color: #555;
  font-weight: 600;
  font-size: 1.5rem;
  line-height: 1.1;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area li .info-box .tag.event {
  color: #ba6162;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area li .info-box .tag.program {
  color: #6164ba;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area li .info-box .tag.etc {
  color: #609945;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area li .info-box .title {
  display: inline-flex;
  margin-top: 0.4rem;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area li .info-box .title span {
  color: #222;
  font-weight: 600;
  font-size: 1.7rem;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area li .info-box .date {
  color: #555;
  font-weight: 400;
  font-size: 1.5rem;
  line-height: 1.4;
}
.schedule-wrap .tabpanel-wrap .guide-wrap .list-area li .btn-wrap {
  margin-top: 0;
  margin-right: 1rem;
}
@media (max-width: 1024px) {
  .schedule-wrap .tabpanel-wrap .calendar-wrap {
    width: 100%;
  }
  .schedule-wrap .tabpanel-wrap .guide-wrap {
    max-width: 100%;
    width: 100%;
  }
}
@media (max-width: 768px) {
  .schedule-wrap .tab-wrap .tab-btn {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
  }
  .schedule-wrap .tab-wrap .tab-btn button {
    justify-content: space-between;
    max-width: 10.6rem;
  }
  .schedule-wrap .tabpanel-wrap .guide-wrap .guide-info {
    gap: 1.4rem;
    padding-top: 0;
  }
  .schedule-wrap .tabpanel-wrap .guide-wrap .list-area li {
    flex-direction: column;
    padding: 3.2rem 1rem 3.2rem 0;
  }
  .schedule-wrap .tabpanel-wrap .guide-wrap .list-area li .btn-wrap {
    width: 100%;
    margin-right: 0;
  }
  .schedule-wrap .tabpanel-wrap .guide-wrap .list-area li .btn-wrap .btn {
    flex: 1;
    width: 100%;
  }
}

.rental-wrap .tab-wrap .tab-btn.type02 {
  display: flex;
  flex-wrap: wrap;
  height: auto;
  border: 0;
  border-radius: 0;
}
.rental-wrap .tab-wrap .tab-btn.type02 button {
  flex: 0 0 auto;
  display: flex;
  align-items: center;
  gap: 0.4rem;
  height: 4.6rem;
  padding: 0 1.6rem 0 1.2rem;
  border: 0;
  color: #222;
  font-weight: 500;
  font-size: 1.8rem;
}
.rental-wrap .tab-wrap .tab-btn.type02 button::before {
  content: "";
  display: flex;
  width: 0.4rem;
  height: 0.4rem;
  margin: 1rem;
  border-radius: 50%;
  background-color: #000;
}
.rental-wrap .tab-wrap .tab-btn.type02 button.on, .rental-wrap .tab-wrap .tab-btn.type02 button:hover {
  border-radius: 0.4rem;
  background-color: #000;
  color: #fff;
  font-weight: 600;
}
.rental-wrap .tab-wrap .tab-btn.type02 button.on::before, .rental-wrap .tab-wrap .tab-btn.type02 button:hover::before {
  width: 2.4rem;
  height: 2.4rem;
  margin: 0;
  border-radius: 0;
  background: url("../../images/icon/icon_check.png") center/100% no-repeat;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap {
  border-top: 0.2rem solid #222;
  border-bottom: 0.1rem solid #dadadf;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap {
  display: flex;
  gap: 1.4rem;
  width: 100%;
  padding: 3.6rem 0;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap + .section-wrap {
  border-top: 0.1rem solid #dadadf;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .title {
  width: 15rem;
  color: #222;
  font-weight: 600;
  font-size: 2.4rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area {
  width: calc(100% - 16.4rem);
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .text {
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.6;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .table {
  table-layout: fixed;
  border-collapse: collapse;
  width: 100%;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .table thead tr {
  border-top: 0.1rem solid #222;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .table thead tr th {
  height: 3.4rem;
  padding: 0 1.4rem;
  background-color: #f4f4f4;
  color: #222;
  font-weight: 600;
  font-size: 1.6rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .table tbody tr td {
  height: 3.4rem;
  padding: 0 1.4rem;
  border: 0.1rem solid #dadadf;
  background-color: #fff;
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
  text-align: center;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .table tbody tr td:first-child {
  border-left: 0;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .table tbody tr td:last-child {
  border-right: 0;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .table + .list-box {
  padding-top: 1.4rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box {
  display: flex;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  padding: 0 1.4rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li::before {
  content: "";
  display: flex;
  justify-content: center;
  align-items: center;
  width: 8rem;
  height: 8rem;
  border-radius: 50%;
  background: #f4f4f4 url("../../images/icon/icon_step01.png") center/4rem 4rem no-repeat;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li:nth-child(1)::before {
  background: #f4f4f4 url("../../images/icon/icon_step01.png") center/4rem 4rem no-repeat;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li:nth-child(2)::before {
  background: #f4f4f4 url("../../images/icon/icon_step02.png") center/4rem 4rem no-repeat;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li:nth-child(3)::before {
  background: #f4f4f4 url("../../images/icon/icon_step03.png") center/4rem 4rem no-repeat;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li:nth-child(4)::before {
  background: #f4f4f4 url("../../images/icon/icon_step04.png") center/4rem 4rem no-repeat;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li:nth-child(5)::before {
  background: #f4f4f4 url("../../images/icon/icon_step05.png") center/4rem 4rem no-repeat;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li .box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li .box .step {
  color: #222;
  font-weight: 600;
  font-size: 1.4rem;
  line-height: 1.4;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li .box .text {
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.4;
  text-align: center;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .list-box li {
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.6;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .list-box li > ul li {
  position: relative;
  display: flex;
  align-items: center;
  padding-left: 2.8rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .list-box li > ul li::before {
  content: "";
  display: flex;
  position: absolute;
  top: 1rem;
  left: 1rem;
  width: 0.4rem;
  height: 0.4rem;
  border-radius: 50%;
  background-color: #555;
}
.rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .list-box + .message {
  color: #db3b26;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.8;
}
.rental-wrap .tab-wrap .tabpanel-wrap .search-area {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.6rem;
  padding: 1.6rem 2.4rem;
  background-color: #f4f4f4;
}
.rental-wrap .tab-wrap .tabpanel-wrap .search-area .input-box {
  display: flex;
  align-items: center;
  gap: 0.6rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .search-area .input-box label {
  width: 12rem;
  color: #222;
  font-weight: 500;
  font-size: 1.5rem;
  line-height: 1.4;
}
.rental-wrap .tab-wrap .tabpanel-wrap .search-area .input-box .select {
  max-width: 22rem;
  width: 100%;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area {
  padding-top: 2rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 6rem 3rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li {
  flex: 0 0 calc(33.333% - 2rem);
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con {
  display: flex;
  flex-direction: column;
  gap: 2.4rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con .link-box a {
  display: flex;
  position: relative;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con .link-box a .img-box {
  width: 100%;
  height: 20rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con .link-box a .img-box img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con .link-box a:hover::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 1;
  width: 8rem;
  height: 8rem;
  background: url("../../images/icon/icon_plus.png") center/100% no-repeat;
  transform: translate(-50%, -50%);
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con .link-box a:hover::after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.3);
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con .info-box {
  display: flex;
  flex-direction: column;
  gap: 2rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con .info-box .title {
  color: #222;
  font-weight: 600;
  font-size: 2rem;
  line-height: 1;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con .info-box .detail-box {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con .info-box .detail-box dl {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con .info-box .detail-box dl dt {
  width: 7rem;
  color: #555;
  font-weight: 400;
  font-size: 1.5rem;
  line-height: 1;
}
.rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li .item-con .info-box .detail-box dl dd {
  width: calc(100% - 8rem);
  color: #222;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.2;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.rental-wrap .untact-area {
  display: flex;
  flex-direction: column;
  padding: 0;
}
.rental-wrap .untact-area > .title {
  color: #222;
  font-weight: 600;
  font-size: 3.6rem;
}
.rental-wrap .untact-area .info-box {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  margin-top: 4.4rem;
  padding: 2rem 2.4rem;
  border: 0.1rem solid #dadadf;
  border-radius: 0.4rem;
  background-color: #fff;
  box-shadow: 0 0.6rem 1rem 0 rgba(0, 0, 0, 0.04);
}
.rental-wrap .untact-area .info-box .title {
  color: #222;
  font-weight: 600;
  font-size: 2rem;
  line-height: 1.4;
}
.rental-wrap .untact-area .info-box .detail-box {
  display: flex;
  flex-direction: column;
  gap: 0.6rem;
}
.rental-wrap .untact-area .info-box .detail-box dl {
  display: flex;
  align-items: center;
  gap: 1rem;
}
.rental-wrap .untact-area .info-box .detail-box dl dt {
  width: 13rem;
  color: #555;
  font-weight: 400;
  font-size: 1.5rem;
}
.rental-wrap .untact-area .info-box .detail-box dl dd {
  color: #222;
  font-weight: 500;
  font-size: 1.5rem;
}
.rental-wrap .untact-area .member-input .form-input {
  margin-top: 5rem;
}
.rental-wrap .untact-area .member-input .form-input .title-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.rental-wrap .untact-area .member-input .form-input .title-area .title {
  font-size: 2.2rem;
  font-weight: 600;
  line-height: 140%;
  color: #222;
}
.rental-wrap .untact-area .terms-box {
  margin-top: 3rem;
  padding: 3rem 4rem;
  border-radius: 0.4rem;
  background-color: #f4f4f4;
}
.rental-wrap .untact-area .terms-box p {
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.6;
}
.rental-wrap .untact-area .terms-area {
  margin-top: 3rem;
}
@media (max-width: 1024px) {
  .rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li {
    flex: 0 0 calc(50% - 1.5rem);
  }
  .rental-wrap > .con-wrap .calendar-wrap {
    width: 100%;
  }
  .rental-wrap > .con-wrap .guide-wrap {
    max-width: 100%;
    width: 100%;
    margin-top: 0;
  }
}
@media (max-width: 768px) {
  .rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap {
    flex-direction: column;
    gap: 2.4rem;
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .title {
    width: 100%;
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area {
    width: 100%;
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .table-wrap {
    overflow-x: auto;
    width: 100%;
    margin-top: 0;
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .table-wrap .table {
    width: 77.6rem;
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box {
    flex-direction: column;
    gap: 2rem;
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li {
    flex-direction: row;
    padding: 0;
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li .box {
    align-items: flex-start;
    gap: 0.8rem;
    width: calc(100% - 9rem);
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .con-wrap .section-wrap .item-area .step-box li .box .text {
    text-align: left;
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .table-wrap {
    overflow-x: auto;
    width: 100%;
    margin-top: 0;
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .table-wrap .table {
    width: 77.6rem;
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .search-area .input-box label {
    display: none;
  }
  .rental-wrap .tab-wrap .tabpanel-wrap .result-area .list-box ul li {
    flex: 0 0 100%;
  }
}

.document-wrap .box-wrap {
  display: flex;
  justify-content: center;
  padding: 3.2rem 2.4rem;
  border-radius: 0.4rem;
  background-color: #f4f4f4;
}
.document-wrap .box-wrap .text {
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.4;
  text-align: center;
}
.document-wrap .box-wrap .text strong {
  font-weight: 700;
}
.document-wrap .con-wrap {
  margin-top: 4rem;
  border-top: 0.2rem solid #222;
  border-bottom: 0.1rem solid #dadadf;
}
.document-wrap .con-wrap .section-wrap {
  display: flex;
  gap: 1.4rem;
  width: 100%;
  padding: 3.6rem 0;
}
.document-wrap .con-wrap .section-wrap + .section-wrap {
  border-top: 0.1rem solid #dadadf;
}
.document-wrap .con-wrap .section-wrap .title {
  width: 15rem;
  color: #222;
  font-weight: 600;
  font-size: 2.4rem;
}
.document-wrap .con-wrap .section-wrap .title-area {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  width: 15rem;
}
.document-wrap .con-wrap .section-wrap .title-area .sub {
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
}
.document-wrap .con-wrap .section-wrap .item-area {
  width: calc(100% - 16.4rem);
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
}
.document-wrap .con-wrap .section-wrap .item-area .table-wrap {
  margin-top: 0;
}
.document-wrap .con-wrap .section-wrap .item-area .table {
  table-layout: fixed;
  border-collapse: collapse;
  width: 100%;
}
.document-wrap .con-wrap .section-wrap .item-area .table thead tr {
  border-top: 0.1rem solid #222;
}
.document-wrap .con-wrap .section-wrap .item-area .table thead tr th {
  height: 3.4rem;
  padding: 0 1.4rem;
  background-color: #f4f4f4;
  color: #222;
  font-weight: 600;
  font-size: 1.6rem;
}
.document-wrap .con-wrap .section-wrap .item-area .table tbody tr td {
  padding: 0.6rem 1rem;
  border: 0.1rem solid #dadadf;
  background-color: #fff;
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
  text-align: center;
}
.document-wrap .con-wrap .section-wrap .item-area .table tbody tr td:first-child {
  border-left: 0;
}
.document-wrap .con-wrap .section-wrap .item-area .table tbody tr td:last-child {
  border-right: 0;
}
.document-wrap .con-wrap .section-wrap .item-area .list-box li {
  display: flex;
  flex-direction: column;
  color: #555;
  font-weight: 400;
  font-size: 1.6re m;
  line-height: 1.4;
}
.document-wrap .con-wrap .section-wrap .item-area .list-box li + li {
  padding-top: 0.4rem;
}
.document-wrap .con-wrap .section-wrap .item-area .list-box li .message {
  padding-left: 1rem;
  color: #1a71ea;
  font-weight: 400;
  font-size: 1.4rem;
  line-height: 1.4;
}
@media (max-width: 1024px) {
  .document-wrap .con-wrap .section-wrap {
    flex-direction: column;
    gap: 2.4rem;
  }
  .document-wrap .con-wrap .section-wrap .title {
    width: 100%;
  }
  .document-wrap .con-wrap .section-wrap .item-area {
    width: 100%;
  }
  .document-wrap .con-wrap .section-wrap .item-area .table-wrap {
    overflow-x: auto;
    width: 100%;
    margin-top: 0;
  }
  .document-wrap .con-wrap .section-wrap .item-area .table-wrap .table {
    width: 87.6rem;
  }
}

.librarian-wrap .box-wrap {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 1rem;
  padding: 3.2rem 2.4rem;
  border-radius: 0.4rem;
  background-color: #f4f4f4;
}
.librarian-wrap .box-wrap .text {
  max-width: 81.4rem;
  width: 100%;
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
  line-height: 1.4;
  text-align: left;
}
.librarian-wrap .box-wrap .text strong {
  font-weight: 700;
}
.librarian-wrap .con-wrap {
  margin-top: 4rem;
  border-top: 0.2rem solid #222;
  border-bottom: 0.1rem solid #dadadf;
}
.librarian-wrap .con-wrap .section-wrap {
  display: flex;
  gap: 1.4rem;
  width: 100%;
  padding: 3.6rem 0;
}
.librarian-wrap .con-wrap .section-wrap + .section-wrap {
  border-top: 0.1rem solid #dadadf;
}
.librarian-wrap .con-wrap .section-wrap .title {
  width: 15rem;
  color: #222;
  font-weight: 600;
  font-size: 2.4rem;
}
.librarian-wrap .con-wrap .section-wrap .item-area {
  width: calc(100% - 16.4rem);
  color: #555;
  font-weight: 400;
  font-size: 1.6rem;
}
.librarian-wrap .con-wrap .section-wrap .item-area .list-box li {
  display: flex;
  flex-direction: column;
  color: #555;
  font-weight: 400;
  font-size: 1.6re m;
  line-height: 1.4;
}
.librarian-wrap .con-wrap .section-wrap .item-area .list-box li + li {
  padding-top: 0.4rem;
}
.librarian-wrap .con-wrap .section-wrap .item-area .list-box li .message {
  padding-left: 1rem;
  color: #1a71ea;
  font-weight: 400;
  font-size: 1.4rem;
  line-height: 1.4;
}
@media (max-width: 1024px) {
  .librarian-wrap .con-wrap .section-wrap {
    flex-direction: column;
    gap: 2.4rem;
  }
  .librarian-wrap .con-wrap .section-wrap .title {
    width: 100%;
  }
  .librarian-wrap .con-wrap .section-wrap .item-area {
    width: 100%;
  }
}

.question-area .search-area {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 1.6rem 2.4rem;
  background-color: #f4f4f4;
  gap: 0.6rem;
}
.question-area .search-area .input-box .select {
  width: 100%;
  max-width: 22rem;
}
.question-area .search-area .input-box .input {
  display: flex;
}
.question-area .search-area .input-box .input input {
  width: 38rem;
  padding: 0 2rem;
  border: 0.2rem solid #404040;
  border-radius: 0.2rem 0 0 0.2rem;
}
.question-area .search-area .input-box .input.btn .btn {
  width: 12rem;
  height: 4rem;
  background-color: #404040;
  color: #fff;
}
.question-area .search-area .input-box .input.btn .btn:hover {
  background: #111;
}
.question-area .search-area .input-box .input.btn .btn:disabled {
  opacity: 0.4;
}
.question-area .accordion-area {
  margin-top: 2rem;
}
.question-area .accordion-area .accordion-box {
  padding: 2.4rem 3.2rem;
  border: 0.1rem solid #dadadf;
  box-sizing: border-box;
}
.question-area .accordion-area .accordion-box .accordion-title {
  padding: 0;
  border-bottom: 0;
}
.question-area .accordion-area .accordion-box .accordion-title button {
  width: 100%;
  text-align: left;
  font-size: 1.9rem;
  line-height: 120%;
  letter-spacing: -0.054rem;
}
.question-area .accordion-area .accordion-box .accordion-title button .point {
  margin-right: 0.6rem;
  color: #e60001;
}
.question-area .accordion-area .accordion-box .accordion-title button:before {
  content: "Q";
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 2.4rem;
  height: 2.4rem;
  margin-right: 2rem;
  background: #e60001;
  color: #fff;
}
.question-area .accordion-area .accordion-box .accordion-content {
  position: relative;
  height: auto;
  margin-top: 3.2rem;
  padding: 0 4rem 3.2rem 4rem;
  background: #fff;
  font-size: 1.7rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.051rem;
}
.question-area .accordion-area .accordion-box .accordion-content:before {
  content: "A";
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 2.4rem;
  height: 2.4rem;
  margin-right: 2rem;
  background: #404040;
  color: #fff;
}
.question-area .accordion-area .accordion-box + .accordion-box {
  margin-top: 0.4rem;
}

.branch .special-area .img-area {
  width: 100%;
}
.branch .special-area .img-area img {
  width: 100%;
}
.branch .special-area .cont-area {
  margin-top: 5rem;
}
.branch .special-area .cont-area > .title {
  position: relative;
  display: inline-block;
  color: #222;
  font-size: 4.2rem;
  font-weight: 700;
  line-height: 120%;
  /* 50.4px */
  letter-spacing: -0.063rem;
}
.branch .special-area .cont-area > .title::before {
  content: "";
  position: absolute;
  bottom: 0;
  width: 100%;
  height: 1.6rem;
  border-radius: 1.6rem;
  background: #c8efff;
  z-index: -1;
  -webkit-border-radius: 1.6rem;
  -moz-border-radius: 1.6rem;
  -ms-border-radius: 1.6rem;
  -o-border-radius: 1.6rem;
}
.branch .special-area .cont-area .box-wrap {
  display: flex;
  flex-wrap: wrap;
  gap: 4rem;
  margin-top: 2.8rem;
  justify-content: center;
}
.branch .special-area .cont-area .box-wrap .box {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex: 0 46%;
  padding: 6rem 0;
  border: 0.1rem solid #dadadf;
  border-radius: 2rem;
  -webkit-border-radius: 2rem;
  -moz-border-radius: 2rem;
  -ms-border-radius: 2rem;
  -o-border-radius: 2rem;
}
.branch .special-area .cont-area .box-wrap .box p {
  max-width: 30rem;
  color: #222;
  font-size: 2.4rem;
  font-weight: 400;
  line-height: 120%;
  letter-spacing: -0.052rem;
  text-align: center;
  word-break: keep-all;
}
.branch .special-area .cont-area .box-wrap .box p br {
  display: none;
}
.branch .special-area .cont-area .box-wrap .box p.title {
  margin-bottom: 1.6rem;
  color: #222;
  font-size: 4rem;
  font-weight: 600;
  line-height: 120%;
  letter-spacing: -0.076rem;
}
.branch .special-area .cont-area .box-wrap .box::before {
  content: "";
  display: inline-flex;
  width: 8.5rem;
  height: 8.5rem;
  margin-bottom: 3.2rem;
}
.branch .special-area .cont-area .box-wrap .box.one::before {
  background: url("../../images/icon/icon_music_01.png") no-repeat 0 0;
  background-size: cover;
}
.branch .special-area .cont-area .box-wrap .box.two::before {
  background: url("../../images/icon/icon_music_02.png") no-repeat 0 0;
  background-size: cover;
}
.branch .special-area .cont-area .box-wrap .box.three::before {
  background: url("../../images/icon/icon_music_03.png") no-repeat 0 0;
  background-size: cover;
}
.branch .special-area .cont-area .box-wrap .box.four::before {
  background: url("../../images/icon/icon_music_04.png") no-repeat 0 0;
  background-size: cover;
}
.branch .special-area .cont-area .circle-area {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0 4.3rem;
  margin-top: 3.6rem;
}
.branch .special-area .cont-area .circle-area .circle {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: 30rem;
  height: 30rem;
  border-radius: 50%;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  -ms-border-radius: 50%;
  -o-border-radius: 50%;
  background: #f4f4f4;
  text-align: center;
}
.branch .special-area .cont-area .circle-area .circle .step {
  margin-bottom: 2.4rem;
  color: #9a220d;
  font-size: 2.4rem;
  font-weight: 600;
  letter-spacing: -0.096rem;
  line-height: 120%;
}
.branch .special-area .cont-area .circle-area .circle span {
  display: block;
  font-size: 3.2rem;
  font-weight: 600;
  line-height: 120%;
  letter-spacing: -0.064rem;
}
.branch .special-area .cont-area .circle-area .dash::before {
  content: "";
  display: inline-flex;
  width: 1.7rem;
  height: 2.8rem;
  background: url("../../images/icon/icon_lnb_active.png") no-repeat 0 0;
  background-size: cover;
}
.branch .special-area.moya .cont-area .title::before {
  background: #ffebc8;
}
.branch .special-area.moya .cont-area .box-wrap .box {
  flex: 1;
  border: 0;
  text-align: center;
}
.branch .special-area.moya .cont-area .box-wrap .box::before {
  width: 16rem;
  height: 16rem;
}
.branch .special-area.moya .cont-area .box-wrap .box.one::before {
  background: url("../../images/icon/icon_moya_01.png") no-repeat 0 0;
  background-size: cover;
}
.branch .special-area.moya .cont-area .box-wrap .box.two::before {
  background: url("../../images/icon/icon_moya_02.png") no-repeat 0 0;
  background-size: cover;
}
.branch .special-area.moya .cont-area .box-wrap .box.three::before {
  background: url("../../images/icon/icon_moya_03.png") no-repeat 0 0;
  background-size: cover;
}
.branch .special-area.moya .moya-list {
  padding: 2.8rem 2.4rem;
  margin-top: 8rem;
  border: 0.1rem solid #dadadf;
  border-radius: 2rem;
  -webkit-border-radius: 2rem;
  -moz-border-radius: 2rem;
  -ms-border-radius: 2rem;
  -o-border-radius: 2rem;
}
.branch .special-area.moya .moya-list ul > li {
  display: flex;
  align-items: center;
}
.branch .special-area.moya .moya-list ul > li span {
  font-size: 2.2rem;
  line-height: 160%;
  letter-spacing: -0.033rem;
  font-weight: 400;
}
.branch .special-area.moya .moya-list ul > li::before {
  content: "";
  display: inline-flex;
  width: 2.4rem;
  height: 2.4rem;
  margin-right: 1.2rem;
  background: url("../../images/icon/icon_moya_mark.png") no-repeat 0 0;
  background-size: cover;
}

@media (max-width: 1024px) {
  .service-list .service-item .text-area .link-btn a {
    font-size: 1.6rem;
  }
  .con-wrap {
    flex-wrap: wrap;
  }
  .con-wrap .calendar-wrap {
    width: 100%;
  }
  .con-wrap .guide-wrap {
    margin-top: 4rem;
    max-width: unset;
  }
  .branch .special-area .cont-area > .title {
    font-size: 3.6rem;
  }
  .branch .special-area .cont-area .box-wrap .box {
    padding: 4.2rem 0;
  }
  .branch .special-area .cont-area .box-wrap .box p {
    font-size: 2rem;
  }
  .branch .special-area .cont-area .box-wrap .box p.title {
    font-size: 3rem;
  }
  .branch .special-area .cont-area .circle-area .circle {
    width: 20rem;
    height: 20rem;
  }
  .branch .special-area .cont-area .circle-area .circle span {
    font-size: 2.2rem;
  }
  .branch .special-area.moya .cont-area .box-wrap {
    gap: 0;
    margin-top: 0.4rem;
  }
  .branch .special-area.moya .cont-area .box-wrap .box {
    width: 100%;
    flex: unset;
    flex-direction: row;
    padding: 0;
    margin-top: 4rem;
  }
  .branch .special-area.moya .cont-area .box-wrap .box::before {
    width: 10rem;
    height: 10rem;
    margin-right: 3.2rem;
    margin-bottom: 0;
  }
  .branch .special-area.moya .cont-area .box-wrap .box p {
    max-width: unset;
    text-align: left;
    word-break: keep-all;
  }
  .branch .special-area.moya .cont-area .box-wrap .box p.title {
    font-size: 2.8rem;
  }
  .branch .special-area.moya .cont-area .box-wrap .box br {
    display: none;
  }
  .branch .special-area.moya .cont-area .box-wrap .box > div {
    width: calc(100% - 15rem);
  }
  .branch .special-area.moya .moya-list ul > li span {
    font-size: 2rem;
  }
}
@media (max-width: 768px) {
  .service-list .service-item .text-area .table-area {
    overflow: auto;
  }
  .service-list .service-item .text-area .table-area table {
    width: 80rem;
  }
  .service-list .service-item .text-area .table-area table thead th {
    font-size: 1.6rem;
  }
  .service-list .service-item .text-area .table-area table tbody td,
  .service-list .service-item .text-area .table-area table tbody th {
    font-size: 1.6rem;
  }
  .service-list .service-item .text-area .table-area.mt0 {
    margin-top: 0;
  }
  .service-list .service-item .text-area .method-area ul {
    flex-direction: column;
    margin-top: 0;
  }
  .service-list .service-item .text-area .method-area ul li {
    width: 100%;
    flex-direction: row;
    justify-content: flex-start;
    align-items: baseline;
    text-indent: 0;
  }
  .service-list .service-item .text-area .method-area ul li p {
    margin-top: 0;
    padding-left: 1.4rem;
    font-size: 1.7rem;
    text-align: left;
  }
  .service-list .service-item .text-area .method-area ul li p.only {
    padding-left: 0;
  }
  .service-list .service-item .text-area .method-area ul li p br {
    display: none;
  }
  .service-list .service-item .text-area .method-area ul li.twoline {
    flex-wrap: wrap;
  }
  .service-list .service-item .text-area .method-area ul li.twoline strong {
    display: block;
    width: 100%;
    text-align: left;
  }
  .service-list .service-item .text-area .method-area ul li.twoline p {
    padding-left: 0;
  }
  .service-list .service-item .text-area .method-area ul.column .gray-bg {
    flex-direction: column;
  }
  .service-list .service-item .text-area .method-area ul.column .gray-bg .box {
    width: 100%;
    margin-top: 1rem;
  }
  .service-list .service-item .text-area .method-area ul.column .gray-bg .box strong {
    font-size: 2rem;
  }
  .service-list .service-item .text-area .method-area ul.column .gray-bg .box p {
    font-size: 1.5rem;
  }
  .service-list .service-item .text-area .method-area + .link-btn {
    display: flex;
    justify-content: center;
    max-width: 15rem;
    margin: 2.4rem auto 0;
  }
  .service-list .service-item .text-area .method-area + .link-btn.download {
    display: inline-block;
    max-width: unset;
  }
  .service-list .service-item .text-area .method-area.w20 ul > li {
    width: 100%;
  }
  .service-list .service-item .text-area .method-area strong {
    display: block;
    white-space: nowrap;
  }
  .question-area .search-area .input-box {
    width: 100%;
  }
  .question-area .search-area .input-box .select {
    max-width: 100%;
  }
  .question-area .search-area .input-box .input input {
    width: 100%;
  }
  .question-area .accordion-area .accordion-box {
    padding: 2.4rem;
  }
  .question-area .accordion-area .accordion-box .accordion-title button {
    font-size: 1.6rem;
  }
  .question-area .accordion-area .accordion-box .accordion-content {
    padding: 0 4rem 0 4rem;
  }
  .branch .special-area .cont-area > .title {
    font-size: 2.4rem;
  }
  .branch .special-area .cont-area .box-wrap {
    gap: 2rem 0;
  }
  .branch .special-area .cont-area .box-wrap .box {
    width: 100%;
    padding: 1.6rem;
    flex: unset;
    flex-direction: row;
    align-items: center;
  }
  .branch .special-area .cont-area .box-wrap .box p {
    text-align: left;
    font-size: 1.5rem;
  }
  .branch .special-area .cont-area .box-wrap .box p.title {
    font-size: 2rem;
    margin-bottom: 1rem;
  }
  .branch .special-area .cont-area .box-wrap .box p br {
    display: none;
  }
  .branch .special-area .cont-area .box-wrap .box::before {
    width: 5rem;
    height: 5rem;
    margin-bottom: 0;
    margin-right: 1.7rem;
  }
  .branch .special-area .cont-area .circle-area {
    flex-direction: row;
    flex-wrap: wrap;
    margin-top: 0.8rem;
  }
  .branch .special-area .cont-area .circle-area .circle {
    width: 100%;
    align-items: center;
    height: auto;
    margin-top: 1.6rem;
    padding: 1.7rem 0;
    border-radius: 20rem;
  }
  .branch .special-area .cont-area .circle-area .circle br {
    display: none;
  }
  .branch .special-area .cont-area .circle-area .circle .step {
    font-size: 1.6rem;
    margin-bottom: 1rem;
  }
  .branch .special-area .cont-area .circle-area .circle span {
    font-size: 1.8rem;
  }
  .branch .special-area .cont-area .circle-area .dash {
    display: none;
  }
  .branch .special-area.moya .cont-area .box-wrap {
    margin-top: 0;
  }
  .branch .special-area.moya .cont-area .box-wrap .box {
    flex-direction: column;
    margin-top: 3.2rem;
  }
  .branch .special-area.moya .cont-area .box-wrap .box::before {
    margin-right: 0;
    margin-bottom: 1.6rem;
  }
  .branch .special-area.moya .cont-area .box-wrap .box p {
    text-align: center;
  }
  .branch .special-area.moya .cont-area .box-wrap .box p.title {
    font-size: 2rem;
    text-align: center;
  }
  .branch .special-area.moya .moya-list {
    margin-top: 6rem;
    padding: 1.6rem;
  }
  .branch .special-area.moya .moya-list ul > li {
    position: relative;
  }
  .branch .special-area.moya .moya-list ul > li span {
    display: inline-block;
    width: calc(100% - 1.6rem);
    padding-left: 2rem;
    font-size: 1.6rem;
  }
  .branch .special-area.moya .moya-list ul > li::before {
    position: absolute;
    top: 0.6rem;
    width: 1.4rem;
    height: 1.4rem;
  }
}
.savesearch-wrap .search-area {
  position: relative;
  display: flex;
  align-items: center;
  gap: 0 0.4rem;
  max-width: 59.2rem;
  margin: 0 auto;
  box-sizing: border-box;
}
.savesearch-wrap .search-area .input {
  display: flex;
  height: 3.8rem;
  border: 0.2rem solid #404040;
  border-radius: 0.4rem;
}
.savesearch-wrap .search-area .input input[type=text] {
  width: 36rem;
  height: 100%;
}
.savesearch-wrap .search-area .input .search {
  background: #404040;
  color: #fff;
  border-radius: 0;
  -webkit-border-radius: 0;
  -moz-border-radius: 0;
  -ms-border-radius: 0;
  -o-border-radius: 0;
}
.savesearch-wrap .search-area button {
  width: 12rem;
  height: 4rem;
  border-radius: 0.4rem;
  color: #404040;
  border: 0.1rem solid #404040;
}
.savesearch-wrap .search-area .search-button {
  display: flex;
  gap: 0 0.3rem;
}
.savesearch-wrap .search-area .search-button button {
  width: 12rem;
  height: 4rem;
  border-radius: 0.4rem;
  color: #222;
  border: 0.2rem solid #404040;
  font-weight: 500;
}
.savesearch-wrap .search-area.v2 {
  max-width: 74.8rem;
}
.savesearch-wrap .search-area .radio-area {
  display: flex;
  gap: 0 2.4rem;
  margin-right: 2.4rem;
}
.savesearch-wrap .search-area .link-btn {
  position: absolute;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  margin-top: 0;
}
.savesearch-wrap .search-area .link-btn a::before {
  display: none;
}
.savesearch-wrap .search-area .link-btn a::after {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  margin-left: 1rem;
  margin-right: 0.6rem;
  background: url(../../images/icon/icon_window.png) no-repeat 0 0;
  background-size: cover;
}
.savesearch-wrap .search-area.small {
  max-width: unset;
}
.savesearch-wrap .accordion-area {
  margin-top: 2rem;
  border: 0.1rem solid #dadadf;
  border-bottom: 0;
}
.savesearch-wrap .accordion-area .accordion-title {
  padding: 2rem 3rem;
}
.savesearch-wrap .accordion-area .accordion-content {
  padding: 2rem 3rem;
  height: auto;
}
.savesearch-wrap .accordion-area .check-area {
  display: flex;
  flex-wrap: wrap;
  gap: 1rem 0;
}
.savesearch-wrap .accordion-area .check-area .check {
  width: 25%;
}
.savesearch-wrap .search-table-area {
  margin-top: 2rem;
  border: 0.1rem solid #dadadf;
  border-bottom: 0;
}
.savesearch-wrap .search-table-area .filter-box {
  display: flex;
}
.savesearch-wrap .search-table-area .filter-box .title {
  display: flex;
  align-items: center;
  width: 12rem;
  padding: 2rem;
  border-bottom: 0.1rem solid #dadadf;
  font-size: 1.7rem;
  color: #4d4d4d;
  font-weight: 500;
  box-sizing: border-box;
}
.savesearch-wrap .search-table-area .filter-box .title + div {
  padding: 1rem 2rem;
  border-left: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  background: #f4f4f4;
  box-sizing: border-box;
}
.savesearch-wrap .search-table-area .filter-box .check-area {
  display: flex;
  width: calc(100% - 12rem);
  justify-content: space-between;
  align-items: center;
}
.savesearch-wrap .search-table-area .filter-box .check-area .check {
  width: 25%;
}
.savesearch-wrap .search-table-area .filter-box .input {
  width: calc(100% - 12rem);
}
.savesearch-wrap .search-table-area .filter-box .input input {
  width: 100%;
}
.savesearch-wrap .search-table-area .filter-box .box-wrap {
  display: flex;
  width: 50%;
}
.savesearch-wrap .search-table-area .filter-box .box-wrap .input {
  width: calc(100% - 12rem);
}
.savesearch-wrap .search-table-area .filter-box .calendar-area,
.savesearch-wrap .search-table-area .filter-box .select {
  width: calc(100% - 12rem);
}
.savesearch-wrap .search-table-area .filter-box .calendar-area .refrash {
  width: 4rem;
  height: 4rem;
  border: 0.1rem solid #dadadf;
  background: #fff;
}
.savesearch-wrap .search-table-area .filter-box .calendar-area .refrash::before {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  background: url("../../images/icon/icon_refresh.png") no-repeat 0 0;
  background-size: cover;
}
.savesearch-wrap .result-area {
  margin-top: 2rem;
}
.savesearch-wrap .result-area .top {
  display: flex;
  justify-content: space-between;
  padding: 1.6rem 0;
}
.savesearch-wrap .result-area .top .result-area {
  display: flex;
  align-items: center;
  gap: 0 0.4rem;
  margin-top: 0;
}
.savesearch-wrap .result-area .top .result-area .point {
  color: #e60001;
  font-weight: 600;
}
.savesearch-wrap .result-area .choice-area {
  display: flex;
  align-items: center;
  gap: 0 0.4rem;
}
.savesearch-wrap .result-area .choice-area .select select {
  width: 10rem;
  padding-left: 1rem;
}
.savesearch-wrap .result-box {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding: 2rem 0;
  border-bottom: 0.1rem solid #dadadf;
}
.savesearch-wrap .result-box > .img-area {
  width: 8rem;
  height: 12rem;
  cursor: pointer;
}
.savesearch-wrap .result-box > .img-area > img {
  width: 100%;
  height: 100%;
}
.savesearch-wrap .result-box .result-info {
  position: relative;
  margin-left: 2rem;
  width: calc(100% - 13rem);
}
.savesearch-wrap .result-box .result-info .stauts {
  display: inline-block;
  padding: 0.4rem 1rem;
  margin-bottom: 1.4rem;
  border-radius: 0.8rem;
  font-weight: 600;
  -webkit-border-radius: 0.8rem;
  -moz-border-radius: 0.8rem;
  -ms-border-radius: 0.8rem;
  -o-border-radius: 0.8rem;
}
.savesearch-wrap .result-box .result-info .stauts.blue {
  color: #1a71ea;
  background: rgba(26, 113, 234, 0.1);
}
.savesearch-wrap .result-box .result-info .stauts.gray {
  color: #555;
  background: rgba(53, 53, 53, 0.1);
}
.savesearch-wrap .result-box .result-info > .title {
  width: 90%;
  line-height: 140%;
  color: #222;
  font-size: 1.9rem;
  font-weight: 700;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
  cursor: pointer;
}
.savesearch-wrap .result-box .result-info > .title:hover {
  text-decoration: underline;
}
.savesearch-wrap .result-box .result-info > .title .point {
  padding: 0 0.2rem;
  font-size: inherit;
  color: #e60001;
  line-height: 140%;
  vertical-align: unset;
}
.savesearch-wrap .result-box .result-info .info-text {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  margin-top: 1rem;
  gap: 0 3.2rem;
}
.savesearch-wrap .result-box .result-info .info-text li {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  gap: 0 1.6rem;
}
.savesearch-wrap .result-box .result-info .info-text li > .title {
  font-size: 1.6rem;
  font-weight: 500;
  color: #222;
}
.savesearch-wrap .result-box .result-info .info-text li .text {
  color: #555;
  font-size: 1.6rem;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.savesearch-wrap .result-box .result-info .info-text li::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -1.6rem;
  width: 0.1rem;
  height: 1rem;
  background: #dadadf;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
.savesearch-wrap .result-box .result-info .info-text li:last-child::after {
  display: none;
}
.savesearch-wrap .result-box .button-area {
  width: 89%;
  margin: -5rem 0 0 auto;
  padding-right: 2rem;
  z-index: 99;
}
.savesearch-wrap .result-box .button-area .detail-btn-area {
  display: flex;
  justify-content: flex-end;
  margin-top: 1rem;
  gap: 0 0.4rem;
}
.savesearch-wrap .result-box .button-area .detail-btn-area button {
  padding: 0.7rem 1.4rem;
  border: 0.1rem solid #dadadf;
}
.savesearch-wrap .result-box .button-area .detail-btn-area button::after {
  content: "";
  display: inline-flex;
  width: 1rem;
  height: 1rem;
  background: url("../../images/icon/icon_tri_arrow.png") no-repeat 0 0;
  background-size: cover;
}
.savesearch-wrap .result-box .button-area .detail-btn-area button.on {
  background: #f4f4f4;
}
.savesearch-wrap .result-box .button-area .detail-btn-area button.on::after {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  background-position: 0 -0.2rem;
}
.savesearch-wrap .result-box .button-area .detail-btn-area .detail-btn {
  padding: 0.7rem 1.4rem;
  border: 0.1rem solid #dadadf;
}
.savesearch-wrap .result-box .button-area .list-area table tr:hover {
  background: #f4f4f4;
  cursor: pointer;
}
.savesearch-wrap .result-box .no-data-title {
  padding: 1rem 1rem 2rem 1rem;
}
.savesearch-wrap .result-box .no-data-title span {
  width: 100%;
  display: block;
  text-align: center;
}
.savesearch-wrap .result-box .btn-wrap {
  margin-top: 0.5rem;
  margin-left: auto;
}
.savesearch-wrap .data-area {
  display: flex;
}
.savesearch-wrap .data-area .img-area {
  max-width: 21.3rem;
  max-height: 32rem;
}
.savesearch-wrap .data-area .img-area img {
  width: 100%;
  height: 100%;
}
.savesearch-wrap .data-area .info-area {
  width: calc(100% - 21.3rem);
  margin-left: 3rem;
}
.savesearch-wrap .data-area .info-area .top {
  position: relative;
}
.savesearch-wrap .data-area .info-area .top .title {
  width: 90%;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
  color: #222;
  font-size: 3.2rem;
  font-weight: 700;
  line-height: 140%;
}
.savesearch-wrap .data-area .info-area .top ul {
  display: flex;
  margin-top: 1rem;
  gap: 0 3.2rem;
}
.savesearch-wrap .data-area .info-area .top ul li {
  position: relative;
}
.savesearch-wrap .data-area .info-area .top ul li .category-title {
  margin-right: 1.6rem;
  padding: 0.2rem 2rem;
  border-radius: 0.4rem;
  border: 0.1rem solid #dadadf;
  -webkit-border-radius: 0.4rem;
  -moz-border-radius: 0.4rem;
  -ms-border-radius: 0.4rem;
  -o-border-radius: 0.4rem;
}
.savesearch-wrap .data-area .info-area .top ul li .text {
  color: #555;
  font-weight: 500;
  font-size: 1.6rem;
}
.savesearch-wrap .data-area .info-area .top ul li::after {
  content: "";
  position: absolute;
  right: -1.6rem;
  top: 50%;
  width: 0.1rem;
  height: 1rem;
  background: #929292;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
.savesearch-wrap .data-area .info-area .top ul li:last-child::after {
  display: none;
}
.savesearch-wrap .data-area .info-area .middle {
  position: relative;
  margin-top: 3rem;
}
.savesearch-wrap .data-area .info-area .middle ul li {
  display: flex;
}
.savesearch-wrap .data-area .info-area .middle ul li span {
  font-size: 1.9rem;
  font-weight: 400;
  color: #555;
}
.savesearch-wrap .data-area .info-area .middle ul li span.title {
  width: 10rem;
  margin-right: 1.6rem;
  font-weight: 500;
}
.savesearch-wrap .data-area .info-area .middle ul li + li {
  margin-top: 1.6rem;
}
.savesearch-wrap .data-area .info-area .middle .katalk {
  position: absolute;
  bottom: -1.4rem;
  right: 0;
  display: flex;
  align-items: center;
  padding: 1rem 1.4rem;
  border: 0.1rem solid #dadadf;
  border-radius: 0.2rem;
  color: #222;
}
.savesearch-wrap .data-area .info-area .middle .katalk::before {
  content: "";
  display: inline-flex;
  width: 1.8rem;
  height: 1.8rem;
  margin-right: 0.6rem;
  background: url("../../images/icon/icon_kakao.png") no-repeat 0 0;
  background-size: cover;
}
.savesearch-wrap .explain-area {
  margin-top: 7rem;
}
.savesearch-wrap .explain-area .title {
  padding-bottom: 1rem;
  font-size: 2rem;
  font-weight: 700;
  color: #222;
  border-bottom: 0.1rem solid #dadadf;
}
.savesearch-wrap .explain-area .explain-text {
  margin-top: 2rem;
  font-size: 1.9rem;
  font-weight: 400;
  color: #555;
  line-height: 140%;
}
.savesearch-wrap .chart-area {
  margin-top: 7rem;
}
.savesearch-wrap .chart-area .title {
  padding-bottom: 1rem;
  font-size: 2rem;
  font-weight: 700;
  color: #222;
}
.savesearch-wrap .chart-area .chart-content {
  padding: 4rem;
  border: 0.1rem solid #dadadf;
  border-radius: 0.4rem;
}
.savesearch-wrap .chart-area .chart-content #chartdiv {
  width: 100%;
  height: 500px;
}
.savesearch-wrap .keyword-area {
  margin-top: 7rem;
}
.savesearch-wrap .keyword-area .title {
  padding-bottom: 1rem;
  font-size: 2rem;
  font-weight: 700;
  color: #222;
}
.savesearch-wrap .keyword-area .word-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.8rem;
  margin-top: 2rem;
}
.savesearch-wrap .keyword-area .word-list li span {
  display: inline-block;
  padding: 0.8rem 2rem;
  border-radius: 2.4rem;
  background: #eff7ff;
  font-weight: 500;
  color: #1a71ea;
}
.savesearch-wrap .relation-book-area {
  overflow: hidden;
  margin-top: 9rem;
  padding: 3rem 0 3rem 5rem;
  background: #f4f4f4;
  border-radius: 0.4rem;
}
.savesearch-wrap .relation-book-area .title {
  padding-bottom: 1rem;
  font-size: 2rem;
  font-weight: 700;
  color: #222;
}
.savesearch-wrap .relation-book-area .mySwiper {
  margin-top: 2rem;
}
.savesearch-wrap .relation-book-area .mySwiper .swiper-wrapper {
  height: auto;
}
.savesearch-wrap .relation-book-area .mySwiper .swiper-wrapper .swiper-slide {
  width: 16rem;
}
.savesearch-wrap .relation-book-area .mySwiper .swiper-wrapper .swiper-slide .img-area {
  text-align: center;
}
.savesearch-wrap .relation-book-area .mySwiper .swiper-wrapper .swiper-slide .img-area img {
  max-width: 16rem;
}
.savesearch-wrap .relation-book-area .mySwiper .swiper-wrapper .swiper-slide p {
  margin-top: 2rem;
  text-align: center;
  color: #222;
  font-weight: 600;
  line-height: 140%;
}
.savesearch-wrap .etc-text {
  margin-top: 9rem;
  font-size: 1.5rem;
  color: #1a71ea;
  line-height: 140%;
  padding-left: 1rem;
  text-indent: -1rem;
}
.savesearch-wrap .result-wrap .title-area {
  display: flex;
  justify-content: space-between;
  padding: 0.4rem 1.6rem;
  background: #f4f4f4;
}
.savesearch-wrap .result-wrap .title-area .title {
  font-size: 1.8rem;
  font-weight: 600;
  line-height: 140%;
  color: #222;
}
.savesearch-wrap .result-wrap .title-area button {
  color: #555;
  font-weight: 500;
  font-size: 1.4rem;
}
.savesearch-wrap .result-wrap + .result-wrap {
  margin-top: 6rem;
}

.action-btn {
  position: absolute;
  right: 0;
  top: 0;
}
.action-btn .like::before {
  content: "";
  display: inline-block;
  width: 2rem;
  height: 2rem;
  background: url("../../images/icon/icon_like.png") no-repeat 0 0;
  background-size: cover;
}
.action-btn.on .like::before {
  background: url("../../images/icon/icon_like_on.png") no-repeat 0 0;
  background-size: cover;
}

.like_btn {
  padding: 1rem 1.4rem;
  border-radius: 0.2rem;
  border: 0.1rem solid #dadadf;
  -webkit-border-radius: 0.2rem;
  -moz-border-radius: 0.2rem;
  -ms-border-radius: 0.2rem;
  -o-border-radius: 0.2rem;
}
.like_btn button {
  display: flex;
  align-items: center;
  gap: 0 0.6rem;
}
.like_btn button::before {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  background: url("../../images/icon/icon_like_on.png") no-repeat 0 0;
  background-size: cover;
}

.having-area {
  display: none;
  margin-top: 2rem;
}
.having-area .list-area .table-area table {
  width: 100%;
  border-top: 0.1rem solid #929292;
}
.having-area .list-area .table-area table th, .having-area .list-area .table-area table td {
  padding: 0.4rem 0;
  border-bottom: 0.1rem solid #dadadf;
  color: #222;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.016rem;
  font-size: 1.6rem;
  text-align: center;
}
.having-area .list-area .table-area table th:last-child, .having-area .list-area .table-area table td:last-child {
  border-right: 0;
}
.having-area .list-area .table-area table th {
  padding: 1rem 0;
  background: #f4f4f4;
}
.having-area .list-area .table-area .blue {
  color: #1a71ea;
}
.having-area .list-area .table-area .red {
  color: #f74e37;
}
.having-area .list-area .btn-wrap {
  justify-content: center;
}
.having-area .list-area .btn-wrap button {
  min-width: 8rem;
  padding: 1rem 1.4rem;
}
.having-area .list-area .btn-wrap button span {
  font-size: 1.6rem;
  white-space: nowrap;
}
.having-area .list-area .paging-wrap .main-paging li {
  border-bottom: 0;
}
.having-area > .title {
  margin-top: 9rem;
  padding-bottom: 1rem;
  font-size: 2rem;
  font-weight: 700;
  color: #222;
  border-bottom: 0.1rem solid #dadadf;
}
.having-area ul li {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  padding: 1.85rem 0;
  border-bottom: 0.1rem solid #dadadf;
}
.having-area ul li .info-box {
  display: flex;
  align-items: center;
}
.having-area ul li .info-box .status {
  display: inline-flex;
  min-width: 6.6rem;
  padding: 0.5rem 1rem;
  margin-right: 2rem;
  justify-content: center;
  align-items: center;
  gap: 0.4rem;
  border-radius: 0.8rem;
  font-weight: 600;
  box-sizing: border-box;
}
.having-area ul li .info-box .status.green {
  background: rgba(20, 135, 78, 0.1);
  color: #14874e;
}
.having-area ul li .info-box .status.blue {
  background: rgba(26, 113, 234, 0.1);
  color: #1a71ea;
}
.having-area ul li .info-box .status.red {
  background: rgba(219, 59, 38, 0.1);
  color: #db3b26;
}
.having-area ul li .info-box .status.gray {
  background: rgba(53, 53, 53, 0.1);
  color: #555;
}
.having-area ul li .info-box .status.yellow {
  background: rgba(158, 109, 18, 0.1);
  color: #9e6d12;
}
.having-area ul li .info-box .library {
  display: inline-block;
  padding: 0.4rem 0.6rem;
  text-align: center;
  border-radius: 0.2rem;
  font-size: 1.4rem;
  color: #fff;
  box-sizing: border-box;
}
.having-area ul li .info-box .library.com {
  background: #404040;
}
.having-area ul li .info-box .library.jungang {
  background: #e60001;
}
.having-area ul li .info-box .library.gangil {
  background: #0050cc;
}
.having-area ul li .info-box .library.dunchun {
  background: #0f8448;
}
.having-area ul li .info-box .library.seongnae {
  background: #917200;
}
.having-area ul li .info-box .library.supsok {
  background: #5d8200;
}
.having-area ul li .info-box .library.amsa {
  background: #da2b7d;
}
.having-area ul li .info-box .library.cheonho {
  background: #6430a3;
}
.having-area ul li .info-box .library.haegong {
  background: #c75300;
}
.having-area ul li .info-box .library.small {
  background: #0079cf;
}
.having-area ul li .info-box .library.bookcafe {
  background: #7b4420;
}
.having-area ul li .info-box p {
  position: relative;
  padding-left: 2.5rem;
}
.having-area ul li .info-box p span {
  font-size: 1.9rem;
  color: #555;
  font-weight: 400;
}
.having-area ul li .info-box p span.title {
  font-weight: 500;
  margin-right: 1.6rem;
}
.having-area ul li .info-box p::before {
  content: "";
  position: absolute;
  left: 1.2rem;
  top: 50%;
  width: 0.1rem;
  height: 1rem;
  background: #dadadf;
  transform: translateY(-50%);
  -webkit-transform: translateY(-50%);
  -moz-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  -o-transform: translateY(-50%);
}
.having-area ul li .btn-wrap {
  width: 100%;
  justify-content: flex-end;
  margin-top: 0.5rem;
}
.having-area ul li .btn-wrap .btn {
  min-width: 7.2rem;
}
.having-area.on {
  display: block;
}

.ai-area {
  display: none;
  margin-top: 2rem;
  padding: 2rem 3rem;
  background: #f4f4f4;
}
.ai-area .img-area {
  display: flex;
  justify-content: space-between;
  gap: 0 1rem;
}
.ai-area .img-area img {
  width: 24.5%;
}
.ai-area .ai-text {
  margin-top: 1.25rem;
}
.ai-area .ai-text .title {
  display: flex;
  align-items: center;
  color: #e60001;
  font-size: 1.8rem;
  font-weight: 700;
}
.ai-area .ai-text .title::before {
  content: "";
  display: inline-flex;
  width: 4rem;
  height: 3rem;
  margin-right: 0.6rem;
  background: url("../../images/icon/icon_aibot.png") no-repeat 0 0;
  background-size: cover;
}
.ai-area .ai-text p {
  margin-top: 0.6rem;
  color: #222;
  line-height: 140%;
  letter-spacing: -0.0016rem;
}

.library-area .search-area {
  width: 100%;
  justify-content: flex-start;
  box-sizing: border-box;
}
.library-area .search-area .input-box {
  flex: 1;
}
.library-area .search-area .input-box .select {
  max-width: unset;
}
.library-area .search-area .input-box .select select {
  width: 100%;
}
.library-area .search-area .input-box.w20 {
  width: 21.6%;
}
.library-area .search-area .input-box.w33 {
  width: 32.9%;
}
.library-area .search-area .input-box.w50 {
  width: 43.7%;
}
.library-area .search-area .date-select {
  width: 100%;
}
.library-area .search-area .date-select .input {
  width: 100%;
}
.library-area .check input[type=checkbox] + label::before {
  top: 0;
  transform: unset;
  -webkit-transform: unset;
  -moz-transform: unset;
  -ms-transform: unset;
  -o-transform: unset;
}
.library-area .savesearch-wrap .btn-wrap .btn {
  min-width: 7.2rem;
}
.library-area .savesearch-wrap .btn-wrap .btn span {
  font-size: 1.5rem;
}

.recom-area .program-detail .detail-area .top-area {
  padding: 0 0 4rem;
}
.recom-area .program-detail .detail-area .top-area .info-area {
  width: 100%;
}

.reading-type {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 2rem;
}
.reading-type .select-year {
  display: flex;
  width: 100%;
  margin: 4rem 0;
  justify-content: center;
  align-items: center;
}
.reading-type .select-year label {
  font-size: 2rem;
  font-weight: 500;
  line-height: 140%;
  margin-right: 1rem;
}
.reading-type .select-year select {
  height: 4.6rem;
  border: 0.1rem solid #000;
}
.reading-type .chart-area {
  width: 48rem;
  height: 35rem;
  margin: 0 auto;
  padding: 2.4rem 3rem;
  border: 0.1rem solid #dadadf;
  border-radius: 2rem;
}
.reading-type .chart-area .title {
  color: #222;
  font-size: 1.8rem;
  font-weight: 600;
  letter-spacing: -0.018rem;
}
.reading-type .chart-area .title::before {
  content: "";
  display: inline-flex;
  width: 1.5rem;
  height: 1.5rem;
  margin-right: 0.4rem;
  background: url("../../images/icon/icon_chart_dot.png") no-repeat 0 0;
  background-size: cover;
}
.reading-type .chart-area .chart {
  width: 100%;
}
.reading-type .chart-area .chart.tag-cloud {
  position: relative;
  width: 75%;
  height: 75%;
  margin: 4rem auto 0;
}
.reading-type .chart-area .chart.tag-cloud .tag {
  position: absolute;
  color: #9bb3e6;
  font-weight: 500;
  user-select: none;
  cursor: default;
  animation-name: scaleUpDown;
  animation-timing-function: ease-in-out;
  animation-iteration-count: infinite;
  animation-direction: alternate;
}
@keyframes scaleUpDown {
  0% {
    transform: scale(1);
    opacity: 0.7;
  }
  50% {
    transform: scale(1.5);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 0.7;
  }
}

.type-area {
  margin-top: 4rem;
}
.type-area .swiper-slide .img-area {
  max-width: 24rem;
}
.type-area .swiper-slide .img-area img {
  width: 100%;
}
.type-area .swiper-slide p {
  margin-top: 2rem;
  font-size: 1.8rem;
  text-align: center;
  font-weight: 600;
  line-height: 140%;
  letter-spacing: -0.054rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.type-area .swiper-slide span {
  display: block;
  margin-top: 0.4rem;
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 140%;
  letter-spacing: -0.056rem;
  text-align: center;
}

.keyword-area .gray-text-area {
  flex-wrap: wrap;
  padding: 3rem 4rem;
  text-align: left;
  margin-top: 4rem;
  margin-bottom: 2rem;
}
.keyword-area .gray-text-area::before {
  display: none;
}
.keyword-area .gray-text-area .info {
  font-size: 1.5rem;
}
.keyword-area .gray-text-area .input-area {
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 0 0.6rem;
  width: 100%;
}
.keyword-area .gray-text-area .input-area .title {
  width: 14rem;
  font-weight: 500;
  line-height: 140%;
  font-size: 1.5rem;
}
.keyword-area .gray-text-area .input-area .input {
  width: calc(100% - 15rem);
}
.keyword-area .gray-text-area .input-area .input input[type=text] {
  width: calc(100% - 13rem);
}
.keyword-area .gray-text-area .input-area .input button {
  width: 100%;
  max-width: 12rem;
  padding: 1rem 1.4rem;
  text-align: center;
  background: #404040;
  color: #fff;
}
.keyword-area .gray-text-area .input-area .keyword-list {
  display: flex;
  gap: 0 1rem;
}
.keyword-area .gray-text-area .input-area .keyword-list li {
  display: flex;
  align-items: center;
  padding: 0.8rem 1rem 0.8rem 2rem;
  border: 0.1rem solid #dadadf;
  border-radius: 4rem;
  background: #fff;
  -webkit-border-radius: 4rem;
  -moz-border-radius: 4rem;
  -ms-border-radius: 4rem;
  -o-border-radius: 4rem;
}
.keyword-area .gray-text-area .input-area .keyword-list li span {
  font-size: 1.4rem;
  font-weight: 500;
  line-height: 140%;
}
.keyword-area .gray-text-area .input-area .keyword-list li button::before {
  content: "";
  display: inline-flex;
  width: 1.8rem;
  height: 1.8rem;
  background: url("../../images/icon/icon_close.png") no-repeat 0 0;
  background-size: cover;
}
.keyword-area .gray-text-area .input-area .info {
  color: #1a71ea;
  max-width: unset;
  padding: 0;
  margin: 0;
  text-indent: 0;
}
.keyword-area .gray-text-area .input-area + .input-area {
  margin-top: 2rem;
}

@media (max-width: 1024px) {
  .reading-type .chart-area {
    width: 100%;
  }
  .savesearch-wrap .result-box .button-area {
    width: 87%;
  }
}
@media (max-width: 768px) {
  .savesearch-wrap .search-area {
    flex-wrap: wrap;
    max-width: 100%;
  }
  .savesearch-wrap .search-area .input {
    width: 100%;
  }
  .savesearch-wrap .search-area .input input[type=text] {
    width: 100%;
  }
  .savesearch-wrap .search-area.v2 {
    max-width: 100%;
    display: block;
  }
  .savesearch-wrap .search-area.v2 .input {
    margin-top: 2.4rem;
  }
  .savesearch-wrap .search-area .search-button {
    width: 100%;
  }
  .savesearch-wrap .search-area .search-button button {
    margin-top: 0.5rem;
    width: 100%;
  }
  .savesearch-wrap .search-area.small .link-btn {
    position: static;
    transform: unset;
    width: 100%;
    margin-top: 0.5rem;
  }
  .savesearch-wrap .search-area.small .link-btn a {
    width: 100%;
    justify-content: center;
  }
  .savesearch-wrap .result-box .result-info > .title {
    width: 89%;
    font-size: 1.6rem;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
  }
  .savesearch-wrap .result-box .result-info .info-text {
    flex-direction: column;
    flex-wrap: wrap;
    gap: 0.4rem 0;
    margin-top: 0.4rem;
  }
  .savesearch-wrap .result-box .result-info .info-text li {
    width: 100%;
    margin-bottom: 0.5rem;
  }
  .savesearch-wrap .result-box .result-info .info-text li span.title {
    width: 7rem;
    font-size: 1.5rem;
  }
  .savesearch-wrap .result-box .result-info .info-text li span.text {
    width: calc(100% - 9rem);
    font-size: 1.5rem;
  }
  .savesearch-wrap .result-box .result-info .info-text li::after {
    display: none;
  }
  .savesearch-wrap .result-box .btn-wrap.right {
    width: 100%;
    justify-content: center;
    margin: 0.5rem 0 0 0;
  }
  .savesearch-wrap .result-box .btn-wrap.right button {
    flex: 1;
    min-width: unset;
  }
  .savesearch-wrap .accordion-area .accordion-title, .savesearch-wrap .accordion-area .accordion-content {
    padding: 1.6rem;
  }
  .savesearch-wrap .accordion-area .accordion-content .check-area .check {
    width: 50%;
  }
  .savesearch-wrap .accordion-area .accordion-content .check-area .check input[type=checkbox] + label {
    font-size: 1.5rem;
  }
  .savesearch-wrap .search-table-area .filter-box .check-area, .savesearch-wrap .search-table-area .filter-box .input, .savesearch-wrap .search-table-area .filter-box .select, .savesearch-wrap .search-table-area .filter-box .calendar-area {
    width: calc(100% - 8rem);
  }
  .savesearch-wrap .search-table-area .filter-box .title {
    width: 8rem;
    padding: 2rem 1rem;
    font-size: 1.5rem;
    box-sizing: border-box;
  }
  .savesearch-wrap .search-table-area .filter-box .check-area {
    flex-wrap: wrap;
    gap: 1rem 0;
  }
  .savesearch-wrap .search-table-area .filter-box .check-area .check {
    width: 50%;
  }
  .savesearch-wrap .search-table-area .filter-box .box-wrap {
    width: 100%;
  }
  .savesearch-wrap .search-table-area .filter-box .box-wrap .input {
    width: calc(100% - 8rem);
  }
  .savesearch-wrap .search-table-area .filter-box.column {
    flex-direction: column;
  }
  .savesearch-wrap .search-table-area .filter-box .calendar-area {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 0.4rem;
  }
  .savesearch-wrap .search-table-area .filter-box .calendar-area input {
    display: inline-block;
    width: calc(100% - 5rem);
    margin-bottom: 0.5rem;
  }
  .savesearch-wrap .search-table-area .filter-box .calendar-area input#last {
    width: calc(100% - 5rem);
    margin-bottom: 0;
  }
  .savesearch-wrap .result-area .top {
    display: block;
  }
  .savesearch-wrap .result-area .top .choice-area {
    margin-top: 1.4rem;
  }
  .savesearch-wrap .result-area .top .choice-area .like_btn {
    flex: 1;
  }
  .savesearch-wrap .result-area .top .choice-area .like_btn button {
    width: 100%;
    justify-content: center;
  }
  .savesearch-wrap .result-area .button-area {
    width: 100%;
    margin: 0;
    padding-right: 0;
  }
  .savesearch-wrap .result-area .button-area .detail-btn-area {
    width: 100%;
    justify-content: center;
  }
  .savesearch-wrap .result-area .button-area .detail-btn-area button {
    flex: 1;
  }
  .savesearch-wrap .result-area .having-area .list-area {
    overflow: auto;
  }
  .savesearch-wrap .result-area .having-area .list-area .table-area {
    width: 70rem;
  }
  .savesearch-wrap .result-area .having-area .list-area .table-area table th, .savesearch-wrap .result-area .having-area .list-area .table-area table td, .savesearch-wrap .result-area .having-area .list-area .table-area table .blue, .savesearch-wrap .result-area .having-area .list-area .table-area table .red {
    font-size: 1.5rem;
  }
  .savesearch-wrap .result-area .having-area .list-area .table-area table button span {
    font-size: 1.5rem;
  }
  .savesearch-wrap .result-area .ai-area .ai-text p {
    font-size: 1.5rem;
  }
  .savesearch-wrap .having-area ul li .info-box {
    display: block;
  }
  .savesearch-wrap .having-area ul li .info-box .status {
    margin-right: 1rem;
  }
  .savesearch-wrap .having-area ul li .info-box .library {
    display: inline-block;
  }
  .savesearch-wrap .having-area ul li .info-box p {
    margin-top: 1rem;
    padding-left: 0;
  }
  .savesearch-wrap .having-area ul li .info-box p span {
    display: inline-block;
    font-size: 1.5rem;
  }
  .savesearch-wrap .having-area ul li .info-box p span.title {
    width: 7rem;
    margin-right: 0;
  }
  .savesearch-wrap .having-area ul li .info-box p::before {
    display: none;
  }
  .savesearch-wrap .having-area ul li .btn-wrap {
    justify-content: center;
    margin-top: 2rem;
  }
  .savesearch-wrap .having-area ul li .btn-wrap button {
    flex: 1;
    padding: 0;
  }
  .savesearch-wrap .data-area {
    flex-direction: column;
    align-items: center;
  }
  .savesearch-wrap .data-area .info-area {
    width: 100%;
    margin-left: 0;
    margin-top: 3rem;
  }
  .savesearch-wrap .data-area .info-area .middle .katalk {
    position: static;
    width: 100%;
    margin-top: 2rem;
    justify-content: center;
  }
  .savesearch-wrap .relation-book-area {
    margin-top: 8.6rem;
    padding: 1.6rem;
  }
  .savesearch-wrap .etc-text {
    margin-top: 3rem;
  }
  .library-area .search-area .input-box.w33, .library-area .search-area .input-box.w50, .library-area .search-area .input-box.w20 {
    width: 100%;
  }
  .library-area .search-area .date-select {
    margin-bottom: 0.5rem;
  }
  .library-area .search-area .date-select .btn-wrap {
    width: auto;
  }
  .library-area .btn-wrap {
    width: 100%;
  }
  .library-area .btn-wrap .btn {
    width: 100%;
    min-width: unset;
  }
  .type-area .swiper-slide .img-area {
    margin: 0 auto;
  }
  .keyword-area .gray-text-area {
    padding: 2.4rem 1.6rem;
  }
  .keyword-area .gray-text-area .input-area {
    flex-wrap: wrap;
  }
  .keyword-area .gray-text-area .input-area .title {
    width: 100%;
    margin-bottom: 0.5rem;
  }
  .keyword-area .gray-text-area .input-area .input {
    width: 100%;
  }
  .keyword-area .gray-text-area .input-area .keyword-list {
    width: 100%;
  }
  .keyword-area .gray-text-area .input-area .info {
    margin-top: 0.5rem;
  }
  .ai-area {
    padding: 1.6rem;
  }
  .ai-area .img-area {
    position: relative;
    display: block;
  }
  .ai-area .img-area::after {
    display: block;
    clear: both;
    content: "";
  }
  .ai-area .img-area img {
    float: left;
    width: 48%;
    margin-bottom: 1rem;
  }
  .ai-area .img-area img:nth-child(2n) {
    float: right;
  }
}
.main.content-wrap {
  padding: 0;
}
.main.content-wrap .container {
  display: block;
  max-width: 192rem;
  padding: 0;
}
.main section.bg {
  position: relative;
}
.main section.bg.gray {
  background: #edeff4;
}
.main section.bg.blue {
  background: #eff7ff;
}
.main section.bg.blue::before {
  content: "";
  position: absolute;
  top: 0;
  left: 12.8rem;
  width: 74rem;
  height: 58rem;
  background: url("../../images/icon/visual-background.png") no-repeat 0 0;
  background-size: cover;
}
.main section.bg.good {
  background: #fff5e0;
}
.main .keyvisual-area {
  overflow: hidden;
  position: relative;
  max-width: 192rem;
}
.main .keyvisual-area .key-text {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  transform: translate(-50%, -50%);
  text-align: center;
  color: #fff;
  text-shadow: 0 0.4rem 2rem rgba(0, 0, 0, 0.5);
  font-size: 5.6rem;
  font-weight: 300;
  line-height: 130%;
  z-index: 99;
}
.main .keyvisual-area .key-text strong {
  font-weight: 700;
  font-size: 5.6rem;
  vertical-align: unset;
}
.main .keyvisual-area .swiper-slide img {
  width: 100%;
}
.main .keyvisual-area .swiper-btn {
  position: absolute;
  bottom: 7rem;
  width: 100%;
  margin-top: 0;
  text-align: center;
  z-index: 99;
}
.main .keyvisual-area .swiper-btn .swiper-pagination.swiper-pagination-bullets {
  position: relative;
  top: auto;
  left: auto;
  bottom: auto;
  width: auto;
}
.main .keyvisual-area .swiper-btn .swiper-pagination.swiper-pagination-bullets span {
  width: 1rem;
  height: 1rem;
  margin: 0 0.5rem;
}
.main .keyvisual-area .swiper-btn .swiper-pagination.swiper-pagination-bullets span.swiper-pagination-bullet {
  background: #fff;
  opacity: 1;
}
.main .keyvisual-area .swiper-btn .swiper-pagination.swiper-pagination-bullets span.swiper-pagination-bullet-active {
  width: 4rem;
  transition: 0.5s;
  border-radius: 1rem;
}
.main .keyvisual-area .swiper-btn .control {
  position: relative;
  top: 0.3rem;
  cursor: pointer;
  width: 0.9rem;
  height: 1.1rem;
  margin: 0;
  background: url("../../images/icon/icon_swiper_parus_white.png") no-repeat 0 0;
  background-size: cover;
}
.main .keyvisual-area .swiper-btn .control.play {
  width: 0.9rem;
  height: 1.1rem;
  background: url("../../images/icon/icon_swiper_play_white.png") no-repeat 0 0;
  background-size: cover;
}
.main .main-layout {
  position: relative;
  max-width: 140rem;
  margin: 0 auto;
}
.main .main-layout .swiper-slide {
  width: 30rem !important;
  flex-shrink: 0;
}
.main .main-layout .new-book .swiper-slide {
  width: 24rem !important;
}
.main .main-layout .notice-slide .swiper-slide, .main .main-layout .notice-slide2 .swiper-slide {
  width: auto !important;
}
.main .main-search-bar {
  position: absolute;
  top: -4.8rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  max-width: 140rem;
  margin: 0 auto;
  padding: 2rem 0;
  box-sizing: border-box;
  background: #4d4d4d;
  z-index: 99;
  box-shadow: 0 0.4rem 1rem 0 rgba(0, 0, 0, 0.14);
}
.main .main-search-bar .radio-area {
  display: flex;
  gap: 0 2.4rem;
}
.main .main-search-bar .radio-area .radio input[type=radio] + label::before {
  top: 50%;
  transform: translateY(-50%);
}
.main .main-search-bar .radio-area .radio label {
  font-size: 2rem;
  font-weight: 600;
  line-height: 140%;
  color: #fff;
}
.main .main-search-bar .input-area {
  position: relative;
  display: flex;
  gap: 0 0.4rem;
  margin-left: 4rem;
}
.main .main-search-bar .input-area .input {
  position: relative;
}
.main .main-search-bar .input-area .input input[type=text] {
  width: 50rem;
  height: 5.4rem;
  padding-right: 4.7rem;
  border-radius: 0.4rem;
  background: #fff;
}
.main .main-search-bar .input-area .input .search {
  position: absolute;
  right: 0.7rem;
  top: 50%;
  transform: translateY(-50%);
  width: 4rem;
  height: 4rem;
  background: url("../../images/icon/main-search.png") no-repeat 0 0;
  background-size: cover;
}
.main .main-search-bar .input-area .btn-wrap {
  margin-top: 0;
  border-radius: 0.4rem;
  border: 0.1rem solid #fff;
}
.main .main-search-bar .input-area .btn-wrap span {
  padding: 0 2rem;
  font-size: 1.8rem;
  font-weight: 700;
  color: #fff;
}
.main .main-search-bar .small-link-btn {
  margin-left: 2rem;
  padding: 1.6rem 2rem;
  border: 0.1rem solid #fff;
  border-radius: 0.4rem;
}
.main .main-search-bar .small-link-btn a {
  display: flex;
  align-items: center;
  color: #fff;
  vertical-align: unset;
}
.main .main-search-bar .small-link-btn a::after {
  content: "";
  position: relative;
  top: -0.2rem;
  display: inline-flex;
  width: 2rem;
  height: 2rem;
  margin-left: 0.6rem;
  background: url("../../images/icon/icon_newwindow_white.png") no-repeat 0 0;
  background-size: cover;
}
.main .main-search-bar .small-link-btn a span {
  font-size: 1.8rem;
}
.main .live-search-word {
  display: flex;
  align-items: center;
  gap: 1rem;
  margin-left: 10rem;
}
.main .live-search-word ul {
  overflow: hidden;
  display: flex;
  flex-direction: column;
  height: 2.8rem;
}
.main .live-search-word ul a {
  display: flex;
  align-items: center;
  gap: 1rem;
  height: 2.8rem;
  transition: transform 0.5s ease-in-out;
}
.main .live-search-word ul a span.count {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 2.8rem;
  height: 2.8rem;
  font-size: 1.8rem;
  font-weight: 700;
  color: #4d4d4d;
  border-radius: 50%;
  background: #fff;
}
.main .live-search-word ul a span.name {
  width: 14rem;
  font-size: 1.8rem;
  color: #fff;
  font-weight: 700;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.main .live-search-word .updown-btn {
  display: flex;
  flex-direction: column;
  gap: 0.3rem;
}
.main .live-search-word .updown-btn button {
  width: 2.4rem;
  height: 2.4rem;
  cursor: pointer;
}
.main .live-search-word .updown-btn button.up {
  background: url("../../images/icon/icon-main-up.png") no-repeat 0 0;
  background-size: cover;
}
.main .live-search-word .updown-btn button.down {
  background: url("../../images/icon/icon-main-down.png") no-repeat 0 0;
  background-size: cover;
}
.main .live-search-word .updown-btn button:focus {
  outline-offset: 2px;
}
.main .quick-link-area {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8rem 0 5rem;
}
.main .quick-link-area a {
  display: block;
  flex: 1;
  text-align: center;
}
.main .quick-link-area a span {
  display: block;
  margin-top: 2rem;
  text-align: center;
  font-size: 1.9rem;
}
.main .quick-link-area a::before {
  content: "";
  display: inline-flex;
  width: 5.6rem;
  height: 5.6rem;
}
.main .quick-link-area a.smart::before {
  background: url("../../images/icon/icon_smart.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.ebook::before {
  background: url("../../images/icon/icon_ebook.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.local::before {
  background: url("../../images/icon/icon_local.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.trade::before {
  background: url("../../images/icon/icon_book_trade.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.space::before {
  background: url("../../images/icon/icon_rent.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.bookfa::before {
  background: url("../../images/icon/icon_bookfe.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.aibook::before {
  background: url("../../images/icon/icon_ainfo.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.font::before {
  background: url("../../images/icon/icon_font.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.mb_member::before {
  background: url("../../images/icon/icon_mobile_member.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.method::before {
  background: url("../../images/icon/icon_info.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.qna::before {
  background: url("../../images/icon/icon_qna.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.avable::before {
  background: url("../../images/icon/icon_avable.png") no-repeat 0 0;
  background-size: cover;
}
.main .quick-link-area a.program::before {
  background: url("../../images/icon/icon_program_v2.png") no-repeat 0 0;
  background-size: cover;
}
.main .tab-wrap .tab-btn {
  border: 0;
  height: auto;
}
.main .tab-wrap .tab-btn button {
  position: relative;
  color: #ccc;
  font-size: 4rem;
  font-weight: 700;
  line-height: 140%;
  border: 0;
  z-index: 9;
}
.main .tab-wrap .tab-btn button:hover, .main .tab-wrap .tab-btn button.on {
  color: #222;
  background: none;
}
.main .tab-wrap .tab-btn button:first-child::before {
  content: "";
  position: absolute;
  left: -6.6rem;
  top: 10%;
  transform: translateY(-50%);
  width: 12rem;
  height: 12rem;
  border-radius: 50%;
  background: #d7e8fa;
  z-index: -1;
}
.main .tab-wrap .tab-btn button::after {
  content: "/";
  margin: 0 1rem;
  color: #ccc;
}
.main .tab-wrap .tab-btn button:last-child::after {
  display: none;
}
.main .tab-wrap .view {
  display: none;
}
.main .tab-wrap .view.on {
  display: block;
}
.main .info-area {
  padding: 10rem 2rem;
}
.main .info-area .tab-btn {
  overflow: visible;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.main .info-area .add-btn {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background: #404040;
}
.main .info-area .add-btn::before {
  content: "";
  display: inline-block;
  width: 1.4rem;
  height: 1.4rem;
  background: url("../../images/icon/icon_plus_white.png") no-repeat 0 0;
  background-size: cover;
}
.main .info-area .add-btn > span {
  position: absolute;
  left: -6rem;
  width: auto;
  height: auto;
  font-size: 2rem;
  clip: unset;
  clip-path: unset;
}
.main .info-area .notice-slide, .main .info-area .notice-slide2 {
  position: relative;
  overflow: hidden;
  width: 42rem;
  height: 42rem;
}
.main .info-area .notice-slide .swiper-btn, .main .info-area .notice-slide2 .swiper-btn {
  position: absolute;
  top: auto;
  left: auto;
  right: 0;
  bottom: 0;
  gap: 0;
  justify-content: flex-end;
  width: 20rem;
  height: 4rem;
  background: rgba(255, 255, 255, 0.9);
}
.main .info-area .notice-slide .swiper-btn button, .main .info-area .notice-slide2 .swiper-btn button {
  border: 0;
  background: transparent;
}
.main .info-area .notice-slide .swiper-btn button.parse::before, .main .info-area .notice-slide2 .swiper-btn button.parse::before {
  width: 1.2rem;
  height: 2.4rem;
}
.main .info-area .notice-slide .swiper-pagination-fraction, .main .info-area .notice-slide2 .swiper-pagination-fraction {
  left: 2rem;
  top: 50%;
  width: auto;
  bottom: auto;
  transform: translateY(-50%);
}
.main .info-area .notice-slide .swiper-pagination-fraction .swiper-pagination-current, .main .info-area .notice-slide2 .swiper-pagination-fraction .swiper-pagination-current {
  font-weight: 700;
  font-size: 1.8rem;
}
.main .info-area .cont-area {
  display: flex;
  margin-top: 3rem;
}
.main .info-area .cont-area .img-area {
  position: relative;
}
.main .info-area .cont-area .img-area img {
  width: 100%;
}
.main .info-area .cont-area .img-area .waiting {
  position: absolute;
  top: 0;
  right: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 7rem;
  height: 5.8rem;
  padding: 0.8rem 1rem 1rem 1rem;
  text-align: center;
  padding: 0.4rem 0;
  border-radius: 0 0 3.5rem 3.5rem;
  background: #DB3B26;
  color: #fff;
  font-weight: 700;
  box-sizing: border-box;
}
.main .info-area .cont-area .img-area .waiting.end {
  background: #404040;
}
.main .info-area .cont-area .list-area {
  width: calc(100% - 47rem);
  margin-left: 4rem;
}
.main .info-area .cont-area .list-area .list-state {
  padding: 0.3rem 1rem;
  font-size: 1.4rem;
  border-radius: 9.9rem;
  white-space: nowrap;
  margin-right: 1rem;
}
.main .info-area .cont-area .list-area .list-state.red {
  color: #f74e37;
  border: 0.3rem solid #ECBFC3;
}
.main .info-area .cont-area .list-area .list-state.green {
  color: #14874e;
  border: 0.3rem solid rgba(20, 135, 78, 0.3);
}
.main .info-area .cont-area .list-area .list-state.black {
  color: #555;
  border: 0.3rem solid #C2C2C2;
}
.main .info-area .cont-area .list-area a {
  display: flex;
  align-items: center;
  width: 100%;
  margin-bottom: 2rem;
}
.main .info-area .cont-area .list-area a:last-child {
  margin-bottom: 0;
}
.main .info-area .cont-area .list-area a .library {
  margin-right: 1rem;
}
.main .info-area .cont-area .list-area a .title {
  width: calc(100% - 16rem);
  font-size: 2rem;
  font-weight: 700;
  line-height: 140%;
  /* 28px */
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.main .info-area .cont-area .list-area a .date {
  margin-left: auto;
}
.main .info-area .cont-area .list-area a:hover .title {
  text-decoration: underline;
}
.main .info-area .cont-area .slide-area {
  overflow: hidden;
}
.main .info-area .view-area.onlyslide {
  display: flex;
  margin-top: 3rem;
}
.main .info-area .view-area.onlyslide .view {
  margin-top: 0;
  width: calc(100% - 42rem);
}
.main .info-area .view-area.onlyslide .view .cont-area {
  margin-top: 0;
}
.main .info-area .view-area.onlyslide .view .cont-area .list-area {
  width: 100%;
}
.main .info-area .swiper-btn {
  position: absolute;
  top: 1.5%;
  right: 11rem;
  margin-top: 0;
  z-index: 9;
}
.main .info-area .swiper-btn .control {
  position: static;
  width: 4rem;
  height: 4rem;
  margin-top: 0;
  border: 0.1rem solid #dadadf;
  border-radius: 50%;
  background: #fff;
}
.main .info-area .swiper-btn .control::after {
  content: "";
  display: inline-flex;
  width: 0.6rem;
  height: 1.1rem;
  background: url("../../images/icon/icon_swiper_purse.png") no-repeat 0 0;
  background-size: cover;
}
.main .info-area .swiper-btn .control.play::after {
  width: 1.2rem;
  height: 1.4rem;
  background: url("../../images/icon/icon-play.png") no-repeat 0 0;
  background-size: cover;
}
.main .program-area {
  padding: 12rem 0;
}
.main .program-area .tab-wrap {
  position: relative;
}
.main .program-area .tab-wrap .tab-btn button:first-child::before {
  background: #ffeabd;
}
.main .program-area .tab-wrap .view-area {
  margin-top: 4rem;
}
.main .program-area .tab-wrap .view-area .img-area {
  width: 30rem;
  height: 40rem;
}
.main .program-area .tab-wrap .view-area .img-area img {
  width: 100%;
  height: 100%;
}
.main .program-area .info-text-area {
  margin-top: 3rem;
}
.main .program-area .info-text-area .waiting {
  display: inline-block;
  width: 11rem;
  text-align: center;
  padding: 0.4rem 0;
  background: #404040;
  color: #fff;
  font-size: 1.8rem;
  font-weight: 700;
  line-height: 120%;
  /* 21.6px */
}
.main .program-area .info-text-area .title {
  margin-top: 1rem;
  font-size: 2rem;
  font-weight: 700;
  line-height: 140%;
  display: -webkit-box;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.main .program-area .info-text-area .date {
  display: block;
  margin-top: 1rem;
  color: #555;
  font-weight: 400;
  line-height: 140%;
}
.main .new-book {
  display: flex;
}
.main .new-book .tab-wrap {
  position: relative;
  width: calc(100% - 34rem);
  margin-right: 5%;
}
.main .new-book .tab-wrap .tab-btn .button-area {
  position: relative;
}
.main .new-book .tab-wrap .tab-btn .button-area button:first-child::before {
  display: none;
}
.main .new-book .tab-wrap .tab-btn .button-area button .question {
  display: inline-block;
  width: 2.8rem;
  height: 2.8rem;
  background: url("../../images/icon/icon_helper.png") no-repeat 0 0;
  background-size: cover;
  text-indent: -9999px;
}
.main .new-book .tab-wrap .tab-btn .button-area button:nth-child(3) {
  position: relative;
}
.main .new-book .tab-wrap .tab-btn .button-area button:nth-child(3)::after {
  display: none;
}
.main .new-book .tab-wrap .tab-btn .button-area .question-area {
  position: absolute;
  top: -4rem;
  right: -37rem;
  width: 32rem;
  padding: 0.8rem 1.6rem;
  background: #1a71ea;
  z-index: 99;
}
.main .new-book .tab-wrap .tab-btn .button-area .question-area p {
  font-size: 1.8rem;
  color: #fff;
  font-weight: 600;
}
.main .new-book .tab-wrap .tab-btn .button-area .question-area span {
  display: block;
  margin-top: 0.4rem;
  color: #fff;
  font-weight: 400;
  line-height: 140%;
}
.main .new-book .tab-wrap .tab-btn .button-area .question-area::after {
  content: "";
  position: absolute;
  bottom: 1.2rem;
  left: -1.1rem;
  border-top: 50px solid transparent;
  border-bottom: 50px solid #1a71ea;
  border-right: 50px solid transparent;
  border-left: 50px solid transparent;
  z-index: -1;
}
.main .new-book .img-area {
  width: 24rem;
  height: 32rem;
  margin: 0 auto;
}
.main .new-book .img-area .title {
  word-break: keep-all;
}
.main .new-book .img-area img {
  width: 100%;
  height: 100%;
}
.main .new-book .info-area-text {
  margin-top: 2rem;
}
.main .new-book .info-area-text .title {
  font-size: 2rem;
  font-weight: 700;
  line-height: 140%;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  white-space: normal;
  text-overflow: ellipsis;
}
.main .new-book .slide-area {
  overflow: hidden;
}
.main .report-area {
  width: 28rem;
}
.main .report-area .top {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.main .report-area .top .title {
  color: #222;
  font-size: 4rem;
  font-weight: 700;
  line-height: 140%;
}
.main .report-area .top .date {
  color: #555;
  font-size: 2rem;
  font-weight: 500;
  line-height: 140%;
}
.main .report-area .data-area {
  margin-top: 3rem;
}
.main .report-area .data-area ul li {
  display: flex;
  align-items: center;
  border-bottom: 0.1rem solid #fff;
}
.main .report-area .data-area ul li p {
  width: calc(100% - 12rem);
  padding: 2.2rem 2rem;
  background: #fff;
  font-size: 1.8rem;
  font-weight: 500;
  color: #555;
  text-align: right;
}
.main .report-area .data-area ul li p.title {
  width: 12rem;
  background: #404040;
  text-align: left;
  color: #fff;
}
.main .report-area .data-area ul li p.red {
  color: #f74e37;
}
.main .report-area .data-area ul li p.green {
  color: #3C8760;
}
.main .map-wrap {
  margin: 0;
  padding: 10rem 0 16rem;
}
.main .map-wrap .title {
  position: relative;
  color: #222;
  font-size: 4rem;
  font-weight: 700;
  line-height: 140%;
}
.main .map-wrap .title::before {
  content: "";
  position: absolute;
  left: -6.6rem;
  top: 10%;
  transform: translateY(-50%);
  width: 12rem;
  height: 12rem;
  border-radius: 50%;
  background: #ffe9e0;
  z-index: -1;
}
.main .map-wrap .map-position-wrap {
  display: flex;
  justify-content: space-between;
  margin-top: 3rem;
}
.main .map-wrap .map-position-wrap .map-area {
  position: relative;
  margin: unset;
  display: unset;
  max-width: unset;
  width: 64rem;
  height: 62rem;
  padding-bottom: 0;
  background: url("../../images/visual/main-map.jpg") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area .area-spot button.dong {
  position: absolute;
  font-size: 1.9rem;
  font-weight: 700;
  letter-spacing: -0.019rem;
  color: #555;
}
.main .map-wrap .map-position-wrap .map-area .area-spot button.dong.amsa {
  top: 22.1rem;
  left: 16.6rem;
}
.main .map-wrap .map-position-wrap .map-area .area-spot button.dong.goduck {
  top: 15.5rem;
  left: 33.5rem;
}
.main .map-wrap .map-position-wrap .map-area .area-spot button.dong.gangil {
  top: 13.3rem;
  left: 50.1rem;
}
.main .map-wrap .map-position-wrap .map-area .area-spot button.dong.cheonho {
  top: 33rem;
  left: 7.9rem;
}
.main .map-wrap .map-position-wrap .map-area .area-spot button.dong.mengil {
  top: 28.3rem;
  left: 34.2rem;
}
.main .map-wrap .map-position-wrap .map-area .area-spot button.dong.sangil {
  top: 29.5rem;
  left: 43.7rem;
}
.main .map-wrap .map-position-wrap .map-area .area-spot button.dong.gil {
  top: 37.2rem;
  left: 31.1rem;
}
.main .map-wrap .map-position-wrap .map-area .area-spot button.dong.seongnae {
  top: 47.9rem;
  left: 15.1rem;
}
.main .map-wrap .map-position-wrap .map-area .area-spot button.dong.dunchun {
  top: 52rem;
  left: 27.3rem;
}
.main .map-wrap .map-position-wrap .map-area .library {
  position: static;
  width: auto;
  height: auto;
}
.main .map-wrap .map-position-wrap .map-area .library button {
  position: absolute;
  pointer-events: none;
}
.main .map-wrap .map-position-wrap .map-area .library.seoul button {
  background: url("../../images/icon/icon_spot_seoul.png") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area .library.small button {
  background: url("../../images/icon/icon_main_samll-spot.png") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area .library.bookcafe button {
  background: url("../../images/icon/icon_spot_cafe.png") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area.gangil {
  background: url("../../images/visual/map-gangil.jpg") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area.amsa {
  background: url("../../images/visual/map-amsa.jpg") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area.cheonho {
  background: url("../../images/visual/map-cheonho.jpg") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area.mengil {
  background: url("../../images/visual/map-mengil.jpg") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area.sangil {
  background: url("../../images/visual/map-sangil.jpg") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area.gil {
  background: url("../../images/visual/map-gil.jpg") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area.seongnae {
  background: url("../../images/visual/map-seongnae.jpg") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area.dunchun {
  background: url("../../images/visual/map-dunchun.jpg") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area.goduck {
  background: url("../../images/visual/map-goduck.jpg") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .map-area::before {
  content: "";
  position: absolute;
  right: 0;
  bottom: 0;
  width: 12rem;
  height: 12.2rem;
  background: url("../../images/visual/visual-map-name.png") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .content-tab-wrap {
  overflow: hidden;
  position: relative;
  top: -9rem;
  width: 64rem;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .select-area {
  display: none;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn {
  width: 100%;
  height: 5.5rem;
  border-top: 0.1rem solid #dadadf;
  border-bottom: 0.1rem solid #dadadf;
  border-radius: 0;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button {
  font-size: 2.2rem;
  font-weight: 600;
  letter-spacing: -0.033rem;
  height: 100%;
  border-left: 0.1rem solid #dadadf;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button::before {
  display: none;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button::after {
  display: none;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button:hover, .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button.on {
  color: #fff;
  background: #404040;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button:hover.seoul, .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button.on.seoul {
  background: #E60001;
  color: #fff;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button:hover.bookcafe, .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button.on.bookcafe {
  background: #7B4420;
  color: #fff;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button:hover.smart, .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button.on.smart {
  background: #0F8448;
  color: #fff;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button:last-child {
  border-right: 0.1rem solid #dadadf;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area {
  overflow: auto;
  height: 62.4rem;
  margin-top: 3rem;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box {
  border-bottom: 0.1rem solid #fff;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
  padding: 2rem 3rem;
  background: #f4f4f4;
  box-sizing: border-box;
  cursor: pointer;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info p {
  font-size: 2.2rem;
  font-weight: 600;
  letter-spacing: -0.033rem;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info p::after {
  content: "";
  display: inline-flex;
  width: 1.6rem;
  height: 1.8rem;
  margin: 0 1rem;
  background: url("../../images/icon/icon-play.png") no-repeat 0 0;
  background-size: cover;
  transform: rotate(90deg);
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info p.on::after {
  transform: rotate(270deg);
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info .hoilday {
  display: inline-block;
  padding: 0.4rem 1rem;
  border: 0.2rem solid #ef5757;
  color: #ef5757;
  font-weight: 600;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info .link-btn {
  margin: 0;
  margin-left: auto;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info .link-btn a {
  padding: 1.2rem 0 1.2rem;
  border: 0;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info .link-btn a::before {
  content: "";
  display: inline-flex;
  width: 2.4rem;
  height: 2.4rem;
  margin: 0;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info .link-btn a.spot {
  padding-right: 1.2rem;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info .link-btn a.spot::before {
  background: url("../../images/icon/icon_main_home.png") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info .link-btn a.map::before {
  width: 2.4rem;
  height: 2.2rem;
  background: url("../../images/icon/icon_map_v2.png") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info .link-btn a.homelink::before {
  background: url("../../images/icon/icon_map_spot.png") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .add-area {
  display: none;
  padding: 3rem;
  background: #fff;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .add-area .name {
  font-size: 2.2rem;
  font-weight: 400;
  letter-spacing: -0.033rem;
  color: #222;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .add-area ul {
  margin-top: 2rem;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .add-area ul li {
  display: flex;
  align-items: center;
  color: #555;
  font-size: 2rem;
  font-weight: 400;
  letter-spacing: -0.03rem;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .add-area ul li::before {
  content: "";
  display: inline-flex;
  width: 2.4rem;
  height: 2.4rem;
  margin-right: 0.6rem;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .add-area ul li.tel::before {
  background: url("../../images/icon/icon-tel.png") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .add-area ul li.clock::before {
  background: url("../../images/icon/icon-clock.png") no-repeat 0 0;
  background-size: cover;
}
.main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .add-area ul li + li {
  margin-top: 1rem;
}
.main.v2 .keyvisual-area {
  position: relative;
  height: 56rem;
}
.main.v2 .keyvisual-area .swiper-slide {
  width: 100%;
  height: 56rem;
}
.main.v2 .keyvisual-area .swiper-slide img {
  position: absolute;
  left: 50%;
  top: 0;
  bottom: 0;
  transform: translateX(-50%);
  min-width: 100%;
  height: 100%;
  object-fit: cover;
}
.main.v2 .main-layout .new-book .swiper-slide {
  width: 22rem !important;
}
.main.v2 .new-book {
  gap: 0 5rem;
}
.main.v2 .new-book .tab-wrap {
  margin-right: 0;
}
.main.v2 .info-area {
  display: flex;
}
.main.v2 .info-area .tab-wrap {
  width: 84rem;
}
.main.v2 .info-area .tab-wrap.w100 {
  position: relative;
  width: 100%;
}
.main.v2 .info-area .tab-wrap.w100 .book-program {
  width: 100%;
  position: static;
}
.main.v2 .info-area .calendar-wrap {
  width: 50rem;
  margin-left: 6rem;
}
.main.v2 .info-area .calendar-wrap .top {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 100%;
}
.main.v2 .info-area .calendar-wrap .top > .title {
  color: #222;
  font-size: 4rem;
  font-weight: 700;
  line-height: 140%;
}
.main.v2 .info-area .calendar-wrap .top .select {
  width: 24rem;
}
.main.v2 .info-area .calendar-wrap .top .select select {
  width: 100%;
}
.main.v2 .info-area .calendar-wrap .calendar {
  width: 100%;
  background: #fff;
  margin-top: 3rem;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-header {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0.7rem 0;
  border-bottom: 0.1rem solid #dadadf;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-header .year-month {
  font-weight: bold;
  font-size: 2.4rem;
  line-height: 140%;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-header button {
  background: none;
  border: none;
  margin: 0 2rem;
  font-size: 2rem;
  cursor: pointer;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-header button::before {
  content: "";
  display: inline-flex;
  width: 2rem;
  height: 2rem;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-header button:focus {
  outline: 0.2rem solid #000;
  outline-offset: 0.2rem;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-header button.prev-month::before {
  background: url("../../images/icon/icon_paging_prev.png") no-repeat 0 0;
  background-size: cover;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-header button.next-month::before {
  background: url("../../images/icon/icon_paging_next.png") no-repeat 0 0;
  background-size: cover;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-table {
  width: 100%;
  border-collapse: collapse;
  text-align: center;
  padding: 1rem 1.6rem;
  box-sizing: border-box;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-table th {
  padding: 0.6rem 0;
  font-weight: normal;
  color: #666;
  box-sizing: border-box;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-table td {
  padding: 0.6rem 0;
  box-sizing: border-box;
  text-align: center;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-table td button {
  position: relative;
  width: 3.2rem;
  height: 3.2rem;
  line-height: 3.2rem;
  border: none;
  background: none;
  cursor: pointer;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-table td button:focus {
  outline: 0.2rem solid #000;
  outline-offset: 0.2rem;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.today {
  background: #fde4dc;
  color: #000;
  border-radius: 0.4rem;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.program {
  background: #333;
  color: #fff;
  border-radius: 50%;
}
.main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.closed {
  background: #999;
  color: #fff;
  border-radius: 0.6rem;
}
.main.v2 .info-area .calendar-wrap .legend {
  display: flex;
  justify-content: flex-end;
  gap: 0 4rem;
  margin-top: 1rem;
  font-size: 1.2rem;
  color: #555;
}
.main.v2 .info-area .calendar-wrap .legend span {
  display: flex;
  align-items: center;
  gap: 4px;
}
.main.v2 .info-area .calendar-wrap .legend .dot {
  width: 1.2rem;
  height: 1.2rem;
  display: inline-block;
}
.main.v2 .info-area .calendar-wrap .legend .dot.today {
  background: #fde4dc;
  border-radius: 0.4rem;
}
.main.v2 .info-area .calendar-wrap .legend .dot.program {
  background: #333;
  border-radius: 50%;
}
.main.v2 .info-area .calendar-wrap .legend .dot.closed {
  background: #999;
  border-radius: 0.4rem;
}
.main.v2 .main-layout .program-area {
  padding: 8rem 0;
  min-height: 76.8rem;
}
.main.v2 .main-layout .program-area .top {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.main.v2 .main-layout .program-area .top .title {
  position: relative;
  color: #222;
  font-size: 4rem;
  font-weight: 700;
  line-height: 140%;
  border: 0;
  z-index: 9;
}
.main.v2 .main-layout .program-area .top .add-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 4rem;
  height: 4rem;
  border-radius: 50%;
  background: #404040;
}
.main.v2 .main-layout .program-area .top .add-btn::before {
  content: "";
  display: inline-block;
  width: 1.4rem;
  height: 1.4rem;
  background: url("../../images/icon/icon_plus_white.png") no-repeat 0 0;
  background-size: cover;
}
.main.v2 .main-layout .program-area .book-program {
  overflow: hidden;
  position: relative;
  width: 51rem;
}
.main.v2 .main-layout .program-area .book-program .cont-area .img-area {
  max-width: 24rem;
}
.main.v2 .main-layout .program-area .new-book {
  overflow: hidden;
  position: relative;
  display: block;
  width: 78rem;
  margin-left: 11.5rem;
}
.main.v2 .map-wrap .title::before {
  background: #d7e8fa;
}
.main.v2 .map-wrap .map-area::before {
  display: none;
}
.main.v2 .map-wrap .map-position-wrap .content-tab-wrap {
  top: 0;
}
.main.v2 .map-wrap .map-position-wrap .content-tab-wrap .explain-area {
  margin-top: 0;
}
.main.v2 .branch-title {
  position: relative;
  display: inline-block;
  vertical-align: middle;
  color: #222;
  font-size: 4rem;
  font-weight: 700;
  line-height: 140%;
  z-index: 1;
}
.main.v2 .branch-title::before {
  content: "";
  position: absolute;
  left: -6.6rem;
  top: 10%;
  transform: translateY(-50%);
  width: 12rem;
  height: 12rem;
  border-radius: 50%;
  z-index: -1;
}
.main.v2 .week .branch-title::before {
  background: #ffeAbd;
}
.main.v2 .good .new-book {
  position: relative;
  display: block;
  width: 100%;
}
.main.v2 .good .new-book .top {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
}
.main.v2 .good .new-book .top .branch-title {
  display: block;
}
.main.v2 .good .new-book .top .branch-title::before {
  background: #fff;
}
.main.v2 .tab-wrap.v2 {
  width: 106rem;
}
.main.v2 .tab-wrap.v2 .tab-btn {
  display: inline-flex;
  width: 67%;
  margin-left: 2rem;
}
.main.v2 .tab-wrap.v2 .tab-btn button {
  width: 10rem;
  padding: 1rem 0;
  line-height: 1;
  font-size: 1.8rem;
  border: 0.1rem solid #dadadf;
  border-radius: 9.9rem;
}
.main.v2 .tab-wrap.v2 .tab-btn button::after {
  display: none;
}
.main.v2 .tab-wrap.v2 .tab-btn button.on {
  background: #404040;
  color: #fff;
}
.main.v2 .report-area .data-area ul li p:last-child {
  background: #f4f4f4;
}
.main.v2 .program-area .tab-wrap .view-area .img-area {
  max-width: 30rem;
  max-height: 40rem;
}
.main.v2 .program-area .tab-wrap .view-area .img-area img {
  width: 100%;
  height: 100%;
}
.main.v2 .report-area .data-area ul li p {
  width: 35%;
}
.main.v2 .report-area .data-area ul li p.title {
  width: 35%;
}
.main.v2 .cont-area .list-area {
  width: 100%;
  margin-left: 0;
}
.main.v2 .cont-area .list-area .img-area {
  width: auto;
}

.hg .main-search-bar {
  background: #c75300;
}
.hg .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.today {
  background: #FFEDE0;
}
.hg .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.program {
  background: #C75300;
}
.hg .main.v2 .info-area .calendar-wrap .legend .dot.today {
  background: #FFEDE0;
}
.hg .main.v2 .info-area .calendar-wrap .legend .dot.program {
  background: #C75300;
}
.hg section.bg .tab-wrap .tab-btn button:first-child::before {
  background: #FFEDE0;
}
.hg section.branch {
  position: relative;
  background: #FFd8c6;
}
.hg section.branch .program-area .tab-wrap .tab-btn button:first-child::before {
  display: none;
}
.hg section.branch::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42.2rem;
  height: 43.65rem;
  background: url("../../images/icon/icon_top_heagong.png") no-repeat 0 0;
  background-size: cover;
}
.hg section.branch::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 76.8rem;
  height: 44rem;
  background: url("../../images/icon/icon_bottom_heagong.png") no-repeat 0 0;
  background-size: cover;
}
@media (max-width: 1024px) {
  .hg section.branch::after {
    display: none;
  }
  .hg section.branch::before {
    display: none;
  }
}

.ja .main-search-bar {
  background: #DF2324;
}
.ja .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.today {
  background: #FFD8C8;
}
.ja .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.program {
  background: #DF2324;
}
.ja .main.v2 .info-area .calendar-wrap .legend .dot.today {
  background: #FFD8C8;
}
.ja .main.v2 .info-area .calendar-wrap .legend .dot.program {
  background: #DF2324;
}
.ja section.bg .tab-wrap .tab-btn button:first-child::before {
  background: #FFD8C8;
}
.ja section.branch {
  position: relative;
  background: #FFE9E0;
}
.ja section.branch .program-area .tab-wrap .tab-btn button:first-child::before {
  display: none;
}
.ja section.branch::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42.2rem;
  height: 43.65rem;
  background: url("../../images/icon/icon_top_jungang.png") no-repeat 0 0;
  background-size: cover;
}
.ja section.branch::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 76.8rem;
  height: 44rem;
  background: url("../../images/icon/icon_bottom_jungang.png") no-repeat 0 0;
  background-size: cover;
}
@media (max-width: 1024px) {
  .ja section.branch::after {
    display: none;
  }
  .ja section.branch::before {
    display: none;
  }
}

.ss .main-search-bar {
  background: #5D8200;
}
.ss .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.today {
  background: #F0F7E3;
}
.ss .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.program {
  background: #5D8200;
}
.ss .main.v2 .info-area .calendar-wrap .legend .dot.today {
  background: #F0F7E3;
}
.ss .main.v2 .info-area .calendar-wrap .legend .dot.program {
  background: #5D8200;
}
.ss section.bg .tab-wrap .tab-btn button:first-child::before {
  background: #F0F7E3;
}
.ss section.branch {
  position: relative;
  background: #F0F7E3;
}
.ss section.branch .program-area .tab-wrap .tab-btn button:first-child::before {
  display: none;
}
.ss section.branch::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42.2rem;
  height: 43.65rem;
  background: url("../../images/icon/icon_top_supsok.png") no-repeat 0 0;
  background-size: cover;
}
.ss section.branch::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 76.8rem;
  height: 44rem;
  background: url("../../images/icon/icon_bottom_supsok.png") no-repeat 0 0;
  background-size: cover;
}
@media (max-width: 1024px) {
  .ss section.branch::after {
    display: none;
  }
  .ss section.branch::before {
    display: none;
  }
}

.sn .main-search-bar {
  background: #917200;
}
.sn .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.today {
  background: #FAEBD4;
}
.sn .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.program {
  background: #917200;
}
.sn .main.v2 .info-area .calendar-wrap .legend .dot.today {
  background: #FAEBD4;
}
.sn .main.v2 .info-area .calendar-wrap .legend .dot.program {
  background: #917200;
}
.sn section.bg .tab-wrap .tab-btn button:first-child::before {
  background: #FAEBD4;
}
.sn section.branch {
  position: relative;
  background: #FAEBD4;
}
.sn section.branch .program-area .tab-wrap .tab-btn button:first-child::before {
  display: none;
}
.sn section.branch::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42.2rem;
  height: 43.65rem;
  background: url("../../images/icon/icon_top_seoungnea.png") no-repeat 0 0;
  background-size: cover;
}
.sn section.branch::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 76.8rem;
  height: 44rem;
  background: url("../../images/icon/icon_bottom_seoungnea.png") no-repeat 0 0;
  background-size: cover;
}
@media (max-width: 1024px) {
  .sn section.branch::after {
    display: none;
  }
  .sn section.branch::before {
    display: none;
  }
}

.gi .main-search-bar {
  background: #0050CC;
}
.gi .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.today {
  background: #EBEDF7;
}
.gi .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.program {
  background: #0050CC;
}
.gi .main.v2 .info-area .calendar-wrap .legend .dot.today {
  background: #EBEDF7;
}
.gi .main.v2 .info-area .calendar-wrap .legend .dot.program {
  background: #0050CC;
}
.gi section.bg .tab-wrap .tab-btn button:first-child::before {
  background: #EBEDF7;
}
.gi section.branch {
  position: relative;
  background: #EBEDF7;
}
.gi section.branch .program-area .tab-wrap .tab-btn button:first-child::before {
  display: none;
}
.gi section.branch::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42.2rem;
  height: 43.65rem;
  background: url("../../images/icon/icon_top_gangil.png") no-repeat 0 0;
  background-size: cover;
}
.gi section.branch::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 76.8rem;
  height: 44rem;
  background: url("../../images/icon/icon_bottom_gangil.png") no-repeat 0 0;
  background-size: cover;
}
@media (max-width: 1024px) {
  .gi section.branch::after {
    display: none;
  }
  .gi section.branch::before {
    display: none;
  }
}

.as .main-search-bar {
  background: #DA2B7D;
}
.as .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.today {
  background: #F8EDF3;
}
.as .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.program {
  background: #DA2B7D;
}
.as .main.v2 .info-area .calendar-wrap .legend .dot.today {
  background: #F8EDF3;
}
.as .main.v2 .info-area .calendar-wrap .legend .dot.program {
  background: #DA2B7D;
}
.as section.bg .tab-wrap .tab-btn button:first-child::before {
  background: #F8EDF3;
}
.as section.branch {
  position: relative;
  background: #F8EDF3;
}
.as section.branch .program-area .tab-wrap .tab-btn button:first-child::before {
  display: none;
}
.as section.branch::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42.2rem;
  height: 43.65rem;
  background: url("../../images/icon/icon_top_amsa.png") no-repeat 0 0;
  background-size: cover;
}
.as section.branch::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 76.8rem;
  height: 44rem;
  background: url("../../images/icon/icon_bottom_amsa.png") no-repeat 0 0;
  background-size: cover;
}
@media (max-width: 1024px) {
  .as section.branch::after {
    display: none;
  }
  .as section.branch::before {
    display: none;
  }
}

.ch .main-search-bar {
  background: #6430A3;
}
.ch .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.today {
  background: #EFE2FF;
}
.ch .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.program {
  background: #6430A3;
}
.ch .main.v2 .info-area .calendar-wrap .legend .dot.today {
  background: #EFE2FF;
}
.ch .main.v2 .info-area .calendar-wrap .legend .dot.program {
  background: #6430A3;
}
.ch section.bg .tab-wrap .tab-btn button:first-child::before {
  background: #EFE2FF;
}
.ch section.branch {
  position: relative;
  background: #F4EFFA;
}
.ch section.branch .program-area .tab-wrap .tab-btn button:first-child::before {
  display: none;
}
.ch section.branch::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42.2rem;
  height: 43.65rem;
  background: url("../../images/icon/icon_top_cheonho.png") no-repeat 0 0;
  background-size: cover;
}
.ch section.branch::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 76.8rem;
  height: 44rem;
  background: url("../../images/icon/icon_bottom_cheonho.png") no-repeat 0 0;
  background-size: cover;
}
@media (max-width: 1024px) {
  .ch section.branch::after {
    display: none;
  }
  .ch section.branch::before {
    display: none;
  }
}

.dc .main-search-bar {
  background: #0F8448;
}
.dc .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.today {
  background: #E3F5EC;
}
.dc .main.v2 .info-area .calendar-wrap .calendar .calendar-table td button.program {
  background: #0F8448;
}
.dc .main.v2 .info-area .calendar-wrap .legend .dot.today {
  background: #E3F5EC;
}
.dc .main.v2 .info-area .calendar-wrap .legend .dot.program {
  background: #0F8448;
}
.dc section.bg .tab-wrap .tab-btn button:first-child::before {
  background: #E3F5EC;
}
.dc section.branch {
  position: relative;
  background: #E3F5EC;
}
.dc section.branch .program-area .tab-wrap .tab-btn button:first-child::before {
  display: none;
}
.dc section.branch::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 42.2rem;
  height: 43.65rem;
  background: url("../../images/icon/icon_top_dunchun.png") no-repeat 0 0;
  background-size: cover;
}
.dc section.branch::after {
  content: "";
  position: absolute;
  bottom: 0;
  right: 0;
  width: 76.8rem;
  height: 44rem;
  background: url("../../images/icon/icon_bottom_dunchun.png") no-repeat 0 0;
  background-size: cover;
}
@media (max-width: 1024px) {
  .dc section.branch::after {
    display: none;
  }
  .dc section.branch::before {
    display: none;
  }
}

.main .keyvisual-area .swiper-slide-active.animate-zoomin {
  animation: zoomin 7s ease-in forwards;
  transition: transform 7s ease-in;
  will-change: transform;
}

@keyframes zoomin {
  0% {
    transform: scale(1);
  }
  100% {
    transform: scale(1.1);
  }
}
@media (max-width: 1400px) {
  .main.v2 .tab-wrap.v2 {
    width: 91rem;
  }
  .main.v2 .tab-wrap.v2 .tab-btn {
    width: 61%;
  }
  .main.v2 .tab-wrap.v2 .swiper-btn {
    top: 2%;
    right: 6rem;
  }
}
@media (max-width: 1300px) {
  .main .tab-wrap .tab-btn button:first-child::before {
    display: none;
  }
  .main section.bg::before {
    display: none;
  }
  .main .keyvisual-area .swiper-btn {
    bottom: 4rem;
  }
  .main .main-search-bar {
    top: -2.8rem;
    left: 50%;
    width: 96%;
    transform: translateX(-50%);
    justify-content: center;
    padding: 1.6rem 0;
  }
  .main .main-search-bar .radio-area {
    flex-wrap: wrap;
    flex-direction: column;
  }
  .main .main-search-bar .radio-area .radio label {
    font-size: 1.6rem;
  }
  .main .main-search-bar .input-area {
    margin-left: 2rem;
  }
  .main .main-search-bar .input-area .input input[type=text] {
    width: 28rem;
    height: 4.4rem;
  }
  .main .main-search-bar .input-area .input .search {
    width: 2.4rem;
    height: 2.4rem;
  }
  .main .main-search-bar .input-area .btn-wrap span {
    font-size: 1.6rem;
  }
  .main .live-search-word {
    margin-left: 2rem;
  }
  .main .live-search-word ul li a span.count {
    width: 2rem;
    height: 2rem;
    font-size: 1.5rem;
  }
  .main .live-search-word ul li a span.name {
    width: 14rem;
    font-size: 1.6rem;
  }
  .main .quick-link-area {
    padding: 8rem 2rem 4rem;
  }
  .main .quick-link-area a::before {
    width: 4.8rem;
    height: 4.8rem;
  }
  .main .quick-link-area a span {
    margin-top: 1.3rem;
    font-size: 1.6rem;
  }
  .main .info-area {
    padding: 10rem 4rem;
  }
  .main .info-area .add-btn > span {
    overflow: hidden;
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    clip: rect(0, 0, 0, 0);
    clip-path: polygon(0 0, 0 0, 0 0);
  }
  .main .map-wrap {
    padding: 10rem 2rem 16rem;
  }
  .main .map-wrap .title::before {
    display: none;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap {
    width: 40%;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info {
    padding: 2rem;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info .link-btn a.spot {
    padding-right: 0.5rem;
  }
  .main.v2 .new-book {
    flex-wrap: wrap;
  }
  .main.v2 .new-book .swiper-btn {
    right: 5rem;
  }
  .main.v2 .tab-wrap.v2 {
    position: relative;
    width: 100%;
  }
  .main.v2 .tab-wrap.v2 .tab-btn {
    width: auto;
  }
  .main.v2 .tab-wrap.v2 .add-btn {
    position: absolute;
    right: 4rem;
  }
  .main.v2 .tab-wrap.v2 .swiper-btn {
    top: 1%;
    right: 9rem;
  }
  .main.v2 .tab-wrap .cont-area .list-area {
    padding-right: 4rem;
  }
  .main.v2 .info-area {
    flex-wrap: wrap;
    box-sizing: border-box;
    padding: 10rem 0 10rem 4rem;
  }
  .main.v2 .info-area .swiper-btn {
    right: 10rem;
  }
  .main.v2 .info-area .tab-btn {
    padding-right: 4rem;
  }
  .main.v2 .info-area .tab-wrap {
    width: 100%;
    padding-right: 0;
  }
  .main.v2 .info-area .calendar-wrap {
    width: 100%;
    margin-top: 5rem;
    margin-left: 0;
    padding-right: 4rem;
  }
  .main.v2 .info-area .calendar-wrap .calendar {
    margin-top: 1rem;
  }
  .main.v2 .report-area {
    width: 100%;
    margin-top: 6rem;
    padding-right: 4rem;
  }
  .main.v2 .report-area .data-area {
    margin-top: 1rem;
  }
  .main.v2 .report-area .data-area ul {
    display: flex;
  }
  .main.v2 .report-area .data-area ul li {
    display: flex;
    flex-direction: column;
    width: 25%;
  }
  .main.v2 .report-area .data-area ul li p {
    width: 100%;
    box-sizing: border-box;
    text-align: right;
  }
  .main.v2 .report-area .data-area ul li p.title {
    width: 100%;
    text-align: center;
  }
  .main.v2 .main-layout .program-area {
    padding: 8rem 0 8rem 4rem;
  }
  .main.v2 .main-layout .program-area.small {
    display: block;
  }
  .main.v2 .main-layout .program-area.small .book-program {
    position: relative;
    width: 100%;
  }
  .main.v2 .main-layout .program-area.small .book-program .cont-area .img-area {
    max-width: unset;
  }
  .main.v2 .main-layout .program-area.small .new-book {
    width: 100%;
    margin-left: 0;
    margin-top: 5rem;
  }
  .main.v2 .main-layout .program-area.small .new-book .swiper-slide {
    width: auto !important;
  }
  .main.v2 .main-layout .program-area.small .new-book .img-area {
    width: 31rem;
    height: 42rem;
  }
  .main.v2 .main-layout.week .info-area {
    display: block;
    padding: 10rem 0 10rem 4rem;
  }
  .main.v2 .bg.good .new-book .top {
    padding-right: 4rem;
    box-sizing: border-box;
  }
  .main.v2 .bg.good .new-book .swiper-btn {
    right: 9rem;
  }
  .main.v2 .main-layout .program-area .top {
    padding-right: 4rem;
    box-sizing: border-box;
  }
}
@media (max-width: 1024px) {
  .main .tab-wrap .tab-btn {
    padding-right: 4rem;
    box-sizing: border-box;
  }
  .main .tab-wrap .tab-btn button {
    font-size: 3.6rem;
  }
  .main .tab-wrap .tab-btn button::after {
    margin: 0 0.3rem;
  }
  .main .info-area {
    padding: 6rem 0 6rem 4rem;
  }
  .main .info-area .cont-area {
    margin-top: 2rem;
  }
  .main .info-area .cont-area .list-area {
    width: calc(100% - 51rem);
  }
  .main .info-area .cont-area .img-area {
    max-width: 44rem;
  }
  .main .info-area .cont-area .img-area .waiting {
    height: 4rem;
  }
  .main .info-area .cont-area .list-area {
    margin-left: 3rem;
  }
  .main .info-area .cont-area .list-area a .title {
    font-size: 1.8rem;
  }
  .main .info-area .cont-area .list-area a .date {
    font-size: 1.5rem;
  }
  .main .info-area .notice-slide {
    margin: 0 auto;
  }
  .main .info-area .view-area.onlyslide {
    flex-wrap: wrap;
  }
  .main .info-area .view-area.onlyslide .view {
    width: 100%;
    margin-top: 3rem;
  }
  .main .info-area .view-area.onlyslide .view .cont-area {
    margin-top: 0;
  }
  .main .info-area .view-area.onlyslide .view .cont-area .list-area {
    width: 100%;
    margin-left: 0;
    padding-right: 4rem;
  }
  .main .live-search-word ul li a span.name {
    width: 8rem;
  }
  .main .program-area .tab-wrap .view-area {
    margin-top: 3rem;
  }
  .main .program-area .tab-wrap .view-area .img-area {
    width: 22rem;
    height: 30rem;
  }
  .main .program-area .tab-wrap .view-area .info-text-area {
    margin-top: 2rem;
  }
  .main .program-area .tab-wrap .view-area .info-text-area .title {
    margin-top: 0;
    font-size: 1.8rem;
  }
  .main .program-area .tab-wrap .view-area .info-text-area .date {
    margin-top: 1rem;
    font-size: 1.5rem;
  }
  .main .program-area .tab-wrap .swiper-btn {
    right: 9rem;
  }
  .main .new-book {
    flex-wrap: wrap;
  }
  .main .new-book .tab-wrap {
    width: 100%;
    margin-right: 0;
  }
  .main .new-book .img-area {
    width: 22rem;
    height: 30rem;
    text-align: center;
    margin: 0 auto;
  }
  .main .new-book .info-area-text .title {
    font-size: 1.8rem;
  }
  .main .new-book .swiper-btn {
    right: 9rem;
  }
  .main .report-area {
    width: 100%;
    margin-top: 6rem;
    padding-right: 4rem;
    box-sizing: border-box;
  }
  .main .report-area .top .title {
    font-size: 3.6rem;
  }
  .main .report-area .top .date {
    font-size: 1.6rem;
  }
  .main .report-area .data-area {
    width: 100%;
    margin-top: 1rem;
  }
  .main .report-area .data-area ul {
    display: flex;
    width: 100%;
  }
  .main .report-area .data-area ul li {
    display: flex;
    flex-direction: column;
    width: 20%;
    border-right: 0.1rem solid #fff;
  }
  .main .report-area .data-area ul li p {
    width: 100%;
    padding: 1.3rem 0;
    box-sizing: border-box;
  }
  .main .report-area .data-area ul li p.title {
    width: 100%;
    text-align: center;
    font-size: 1.6rem;
  }
  .main .report-area .data-area ul li p:last-child {
    padding-right: 2rem;
    font-size: 1.8rem;
  }
  .main .map-wrap {
    padding: 6rem 4rem;
  }
  .main .map-wrap .title {
    font-size: 3.6rem;
  }
  .main .map-wrap .map-position-wrap {
    flex-wrap: wrap;
    justify-content: center;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap {
    top: auto;
    width: 100%;
    margin-top: 9rem;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn {
    padding-right: 0;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button {
    font-size: 1.8rem;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .explain-area {
    height: 46rem;
    margin-top: 0;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info {
    padding: 0.8rem 3rem;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .explain-area .explain-box .explain-info p {
    font-size: 1.8rem;
  }
  .main.v2 .info-area {
    padding: 6rem 0 6rem 4rem;
  }
  .main.v2 .info-area .calendar-wrap .top > .title {
    font-size: 3.6rem;
  }
  .main.v2 .info-area .tab-wrap {
    margin-top: 0;
  }
  .main.v2 .main-layout .program-area {
    padding: 6rem 0 6rem 4rem;
    min-height: auto;
  }
  .main.v2 .main-layout.week .info-area {
    padding: 6rem 0 6rem 4rem;
  }
  .main.v2 .branch-title {
    font-size: 3.6rem;
  }
  .main.v2 .branch-title::before {
    display: none;
  }
  .main.v2 .keyvisual-area {
    height: 44.8rem;
  }
  .main.v2 .keyvisual-area .key-text {
    font-size: 4.6rem;
  }
  .main.v2 .keyvisual-area .key-text strong {
    font-size: 4.6rem;
  }
  .main.v2 .main-search-bar .small-link-btn {
    margin-left: 1rem;
    padding: 1rem 1.5rem;
  }
  .main.v2 .main-search-bar .small-link-btn a span {
    font-size: 1.6rem;
  }
  .main .keyvisual-area .key-text {
    font-size: 4.6rem;
  }
  .main .keyvisual-area .key-text strong {
    font-size: 4.6rem;
  }
}
@media (max-width: 768px) {
  .main .tab-wrap .tab-btn {
    flex-wrap: wrap;
    width: 100%;
    padding-right: 2rem;
  }
  .main .tab-wrap .tab-btn .button-area {
    display: flex;
    justify-content: flex-start;
  }
  .main .tab-wrap .tab-btn .button-area button {
    width: 100%;
    padding: 0;
    font-size: 1.8rem;
    white-space: nowrap;
  }
  .main .keyvisual-area .swiper-btn {
    display: none;
    bottom: 0.6rem;
  }
  .main .main-search-bar {
    position: static;
    transform: unset;
    flex-wrap: wrap;
    width: 100%;
    padding: 1.6rem 2rem;
  }
  .main .main-search-bar .radio-area {
    display: flex;
    width: 100%;
    flex-direction: row;
  }
  .main .main-search-bar .input-area {
    width: 100%;
    margin-left: 0;
    margin-top: 1rem;
  }
  .main .main-search-bar .live-search-word {
    display: none;
  }
  .main .main-search-bar .input-area .input {
    width: 100%;
  }
  .main .main-search-bar .input-area .input input[type=text] {
    width: 100%;
  }
  .main .main-search-bar .input-area .btn-wrap {
    width: 8rem;
    justify-content: center;
  }
  .main .main-search-bar .input-area .btn-wrap button {
    text-align: center;
  }
  .main .main-search-bar .input-area .btn-wrap button span {
    padding: 0;
  }
  .main .quick-link-area {
    display: flex;
    flex-wrap: wrap;
    padding: 2.2rem 2rem;
    gap: 2.4rem 0;
  }
  .main .quick-link-area a {
    flex: unset;
    width: 50%;
    display: flex;
    align-items: center;
  }
  .main .quick-link-area a span {
    margin-top: 0;
  }
  .main .quick-link-area a::before {
    width: 2.4rem;
    height: 2.4rem;
    margin-right: 0.6rem;
  }
  .main .info-area {
    padding: 2rem 0 2rem 2rem;
  }
  .main .info-area .notice-slide {
    overflow: hidden;
    width: 32rem;
    height: 32rem;
    padding-right: 2rem;
    box-sizing: border-box;
  }
  .main .info-area .notice-slide .img-area {
    width: 32rem;
    height: 32rem;
    margin: 0 auto;
  }
  .main .info-area .notice-slide .img-area img {
    width: 100%;
  }
  .main .info-area .view-area.onlyslide .view .cont-area {
    padding-top: 0;
  }
  .main .info-area .view-area.onlyslide .view .cont-area .list-area {
    margin-top: 0;
    padding-right: 0;
  }
  .main .info-area .cont-area {
    position: relative;
    padding-top: 3rem;
    margin-top: 0;
  }
  .main .info-area .add-btn {
    width: 2.4rem;
    height: 2.4rem;
  }
  .main .info-area .add-btn::before {
    width: 1rem;
    height: 1rem;
  }
  .main .info-area .swiper-btn {
    top: 0;
    left: 50%;
    transform: translateX(-50%);
    gap: 0 0.5rem;
  }
  .main .info-area .swiper-btn .control {
    width: 2.4rem;
    height: 2.4rem;
  }
  .main .info-area .notice-slide .swiper-btn {
    width: 18rem;
    transform: unset;
  }
  .main .info-area .notice-slide .swiper-btn .swiper-button-prev,
  .main .info-area .notice-slide .swiper-btn .swiper-rtl .swiper-button-next,
  .main .info-area .notice-slide .swiper-btn .swiper-button-next,
  .main .info-area .notice-slide .swiper-btn .swiper-rtl .swiper-button-prev {
    width: 4rem;
    height: 4rem;
  }
  .main .info-area .notice-slide .swiper-btn .control {
    width: 4rem;
    height: 4rem;
  }
  .main .info-area .cont-area {
    flex-wrap: wrap;
    width: 100%;
    margin-left: 0;
    padding-right: 2rem;
    box-sizing: border-box;
  }
  .main .info-area .cont-area .img-area {
    max-width: 32rem;
    width: 100%;
    margin: 0 auto;
  }
  .main .info-area .cont-area .list-area {
    width: 100%;
    margin-top: 3rem;
    margin-left: 0;
  }
  .main .info-area .cont-area .list-area a {
    flex-wrap: wrap;
    margin-bottom: 1.7rem;
  }
  .main .info-area .cont-area .list-area a .title {
    width: calc(100% - 5rem);
    font-size: 1.6rem;
  }
  .main .info-area .cont-area .list-area a .date {
    display: block;
    margin-top: 1rem;
    margin-left: 5rem;
    width: 100%;
  }
  .main .info-area .cont-area .list-area.state a .title {
    width: calc(100% - 13rem);
  }
  .main .program-area .tab-wrap .view-area {
    margin-top: 1rem;
  }
  .main .program-area .tab-wrap .view-area .info-text-area {
    margin-top: 1rem;
  }
  .main .program-area .tab-wrap .view-area .info-text-area .title {
    font-size: 1.6rem;
  }
  .main .program-area .tab-wrap .view-area .info-text-area .date {
    margin-top: 0;
  }
  .main .report-area {
    padding-right: 2rem;
  }
  .main .report-area .top .title {
    font-size: 1.8rem;
  }
  .main .report-area .data-area {
    width: 100%;
  }
  .main .report-area .data-area ul {
    display: block;
  }
  .main .report-area .data-area ul li {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100%;
    border-bottom: 0.1rem solid #fff;
  }
  .main .report-area .data-area ul li p:last-child {
    font-size: 1.6rem;
  }
  .main .new-book-area,
  .main .recommend-book-area,
  .main .arboar-area {
    position: relative;
    padding-top: 3rem;
  }
  .main .map-wrap {
    padding: 2rem;
  }
  .main .map-wrap .title {
    font-size: 1.8rem;
  }
  .main .map-wrap .map-position-wrap {
    margin-top: 0;
  }
  .main .map-wrap .map-position-wrap .map-area {
    display: none;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap {
    margin-top: 2rem;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .select-area {
    display: block;
    margin: 2rem 0;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn {
    flex-wrap: wrap;
    height: auto;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button {
    padding: 0.8rem 0;
    font-size: 1.6rem;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button:nth-child(1), .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button:nth-child(2), .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button:nth-child(3) {
    width: 33.333%;
    border-bottom: 0.1rem solid #dadadf;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .tab-btn button:nth-child(3) {
    border-right: 0.1rem solid #dadadf;
  }
  .main .map-wrap .map-position-wrap .content-tab-wrap .tab-wrap .veiw-area {
    margin-top: 2rem;
  }
  .main .new-book .tab-wrap .tab-btn .button-area button .question {
    width: 1.5rem;
    height: 1.5rem;
  }
  .main .new-book .tab-wrap .tab-btn .button-area .question-area {
    top: -5rem;
    right: auto;
    left: 27rem;
    width: 27rem;
  }
  .main .new-book .tab-wrap .tab-btn .button-area .question-area p {
    font-size: 1.6rem;
  }
  .main .new-book .tab-wrap .tab-btn .button-area .question-area span {
    font-size: 1.4rem;
  }
  .main .keyvisual-area .key-text {
    font-size: 2rem;
  }
  .main .keyvisual-area .key-text strong {
    display: block;
    font-size: 2.2rem;
  }
  .main.v2 .keyvisual-area {
    position: relative;
    height: 33.6rem;
  }
  .main.v2 .main-search-bar .small-link-btn {
    margin: 0;
    margin-top: 1rem;
    width: 100%;
  }
  .main.v2 .main-search-bar .small-link-btn a {
    justify-content: center;
  }
  .main.v2 .main-search-bar .small-link-btn a span {
    font-size: 1.6rem;
  }
  .main.v2 .tab-wrap.v2 .tab-btn {
    width: 100%;
    margin-left: 0;
  }
  .main.v2 .tab-wrap.v2 .tab-btn button {
    width: 8rem;
    font-size: 1.4rem;
  }
  .main.v2 .tab-wrap.v2 .swiper-btn {
    top: 0;
    right: auto;
  }
  .main.v2 .tab-wrap.v2 .add-btn {
    position: static;
  }
  .main.v2 .branch-title {
    font-size: 1.8rem;
  }
  .main.v2 .info-area {
    padding: 2rem 0 2rem 2rem;
  }
  .main.v2 .info-area .calendar-wrap {
    margin-top: 3rem;
    padding-right: 2rem;
  }
  .main.v2 .info-area .calendar-wrap .top > .title {
    font-size: 1.8rem;
  }
  .main.v2 .info-area .calendar-wrap .legend {
    gap: 0 1rem;
  }
  .main.v2 .info-area .tab-wrap.w100 .book-program {
    position: relative;
  }
  .main.v2 .tab-wrap .cont-area .list-area {
    margin-top: 0;
    padding-right: 2rem;
  }
  .main.v2 .main-layout .program-area {
    padding: 2rem 0 2rem 2rem;
  }
  .main.v2 .main-layout.week .info-area {
    padding: 2rem 0 2rem 2rem;
  }
  .main.v2 .report-area {
    margin-top: 4rem;
    padding-right: 2rem;
  }
  .main.v2 .report-area .data-area {
    width: 100%;
  }
  .main.v2 .report-area .data-area ul {
    display: block;
  }
  .main.v2 .report-area .data-area ul li {
    flex-direction: row;
    width: 100%;
  }
  .main.v2 .main-layout .program-area .top .title {
    font-size: 1.8rem;
  }
}

/*# sourceMappingURL=style.css.map */