@charset "UTF-8";

@font-face {
  font-family: 'NanumSquareNeo';
  src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_11-01@1.0/NanumSquareNeo-Variable.woff2') format('woff2');
  font-weight: normal;
  font-style: normal;
}

/*common*/
#hd_wrap {}
#container section:last-child {padding-bottom: 150px;}

@keyframes fadeInUp {
  0% {
      opacity: 0;
      -webkit-transform: translateY(30px);
      -ms-transform: translateY(30px);
      transform: translateY(30px);
  }

  100% {
      opacity: 1;
      -webkit-transform: translateY(0);
      -ms-transform: translateY(0);
      transform: translateY(0);
  }
}

/*sect banner*/
.sect-banner {position: relative;}
.banner-slide {}
.banner-slide .slide-img {position: relative; width: 100%; height: calc((var(--vh, 1vh) * 100)); background-repeat: no-repeat; background-size: cover; background-position: center;}
.banner-slide .slide-img::before {content: '';position: absolute;top: 0;left: 0;width: 100%;height: 100%;background: linear-gradient(104deg, rgba(116, 116, 116, 0.08) 0%, rgba(0, 0, 0, 0.24) 100%);}
.banner-slide .slide-img img {width: 100%; height: 100%; object-fit: cover;}
.banner-slide > ul > li {position: relative; height: calc((var(--vh, 1vh) * 100));}
.banner-slide > ul > li .banner-txt {position: absolute; top: calc(50% - 20px); left: 50%; transform: translate(-50%, -50%); color: #fff; text-align: center; width: 100%;}
.banner-slide > ul > li .banner-txt .banner-top {font-size: 62px; font-weight: 600; color: #fff;}
.banner-slide > ul > li .banner-txt .banner-tit {font-size: 1.125rem; font-weight: 500; color: #fff; margin-top: 32px;}

.banner-slide .swiper-control {position: absolute; top: calc(100% - 260px); left: 50%; transform: translateX(-50%); display: flex; align-items: center; grid-column-gap: 30px; z-index: 1;}
.banner-slide .swiper-control .swiper-btn {width: 42px; height: 42px; background-repeat: no-repeat; background-size: cover; cursor: pointer; flex: none;}
.banner-slide .swiper-control .swiper-button-disabled {opacity: 0.5;}
.banner-slide .swiper-control .swiper-prev {background-image: url("../../../assets/images/main/swiper-prev.svg");}
.banner-slide .swiper-control .swiper-next {background-image: url("../../../assets/images/main/swiper-next.svg");}
.banner-slide .swiper-control .swiper-pagination {position: relative; top: unset; left: unset; bottom: unset; width: fit-content; height: 4px; border-radius: 1px; background: rgba(255, 255, 255, 0.30); backdrop-filter: blur(2px); display: flex; align-items: center;}
.banner-slide .swiper-control .swiper-pagination .swiper-pagination-bullet {margin: 0; width: 50px; background: rgba(255, 255, 255, 0.2); transition: .2s;}
.banner-slide .swiper-control .swiper-pagination .swiper-pagination-bullet:first-child {border-radius: 1px 0 0 1px;}
.banner-slide .swiper-control .swiper-pagination .swiper-pagination-bullet:last-child {border-radius: 0 1px 1px 0;}
.banner-slide .swiper-control .swiper-pagination .swiper-pagination-bullet-active {width: 50px; height: 3px; background: var(--orange); margin: 0; border-radius: 0;}

.mouse-scroll { position: absolute; top: calc(100% - 100px); left: 50%; transform: translateX(-50%);  opacity: 1; transition: opacity .35s, transform .35s; z-index: 2;} 
.lottie--mouse_scroll { max-width: 22px; margin: 0 auto; position: fixed; bottom: 25px; width: 100%; left: 50%; transform: translateX(-50%); z-index: 99;} 
.mouse-scroll span{ color:#fff; text-align: center; font-size: 0.875rem; font-weight: 500;}
.mouse-scroll.active { opacity: 0; z-index: 1; pointer-events: none; transform: translateX(-50%) translateY(60px); transition: opacity .35s .15s, transform .35s; } 
.mouse-scroll .img01{animation: scrollUpDown 3s infinite;}
.mouse-scroll .img02{ position: absolute; top: 6px; left: 50%; transform: translateX(-50%); width: 2px; height: 2px; background: #fff; animation: upDown 3s infinite;}
@keyframes upDown { 
    0%{ transform: translate(-50%, 6px); height: 2px; } 
    25% {transform: translate(-50%, 6px); height:7px;}
    50% { transform: translate(-50%, 6px); height:2px; } 
    75% {transform: translate(-50%, 6px); height:7px;}
    100% {transform: translate(-50%, 3px); height: 2px;}
}
@keyframes scrollUpDown { 
    0%,100% { transform: translateY(3px); } 
    50% { transform: translateY(-3px); } 
    
}

/*sect1*/
.sect1 {padding: 180px 0 150px; background-image: url("../../../assets/images/main/sect1-bg.png"); background-repeat: no-repeat; background-size: cover; display: flex; justify-content: space-between;}
.sect1 .inner {display: flex; justify-content: space-between; grid-column-gap: 40px; width: 100%;}
.sect1 .inner > div {width: 100%; max-width: 680px;}

/*sect2*/
.sect2 {padding: 320px 0 60px; background-image: url("../../../assets/images/main/sect2-bg.png"); background-repeat: no-repeat; background-size: cover; position: relative;}
.sect2::before {content: '';width: 100%;height: 100%;position: absolute;top: 0;left: 0;background: linear-gradient(98deg, rgba(108, 76, 48, 0.00) 24.84%, rgba(50, 40, 30, 0.60) 95.98%);}
.sect2 .inner {display: flex; flex-direction: column; align-items: end; justify-content: right; text-align: right; position: relative; z-index: 1;}
.sect2 .sect2-tit {font-size: 40px; font-weight: 700; color: #fff; line-height: 1.4;}
.sect2 .sect2-txt {font-size: 22px; font-weight: 500; color: #fff; line-height: 1.5; margin-top: 14px;}
.sect2 .more-btn {border-radius: 15px; border: 1px solid var(--orange); box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15); padding: 20px; width: 100%; max-width: 234px; display: flex; align-items: center; justify-content: center; font-size: 28px; font-weight: 600; color: var(--orange); margin-top: 50px; transition: .2s;}
.sect2 .more-btn:hover {background: rgba(243, 148, 60, 0.8); color: #fff;}

/*sect3*/
.sect3 {padding: 150px 0;}
.location-info {border-radius: 15px; border: 1px solid var(--gray); padding: 60px 50px 50px; position: relative;}
.location-info .tit {font-size: 34px; font-weight: 700;}
.location-info .info_list {display: flex; width: 100%; margin-top: 20px; padding-bottom: 25px; border-bottom: 1px solid #E4E4E4;}
.location-info .info_list ul {display: flex; grid-column-gap: 30px;}
.location-info .info_list ul li {display: flex; align-items: center;}
.location-info .info_list ul li .th {font-size: 1.125rem; margin-right: 10px; font-weight: 700; flex: none;}
.location-info .info_list ul li .td {font-size: 1.125rem;}
.location-info .main-map > ul > li {position: relative; display: flex; align-items: center;}
.location-info .main-map > ul > li.on {padding: 30px 0; border-top: 2px solid #707070; border-bottom: 2px solid #707070;}
.location-info .dir_btn {outline: 0; display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; max-width: 170px; height: 60px; background: #fff; border-radius: 10px; border: 1px solid var(--orange); position: absolute; top: 45px; right: 50px; z-index: 2;}
.location-info .dir_btn .ico_direction {position: relative; margin-right: 5px; background-image: url("../../../assets/images/ico/ico-direction.svg"); background-position: 50%; background-repeat: no-repeat; background-size: contain; width: 40px; height: 40px;}
.location-info .dir_btn span {font-size: 20px; font-weight: 700; color: var(--orange);}
.location-map {width: 100%; height: 100%; position: relative; margin-top: 30px;}
.location-map .root_daum_roughmap {width: 100% !important; border-radius: 15px;}
.root_daum_roughmap {}
.root_daum_roughmap .wrap_controllers {display: none;}
.root_daum_roughmap .border1, .root_daum_roughmap .border2, .root_daum_roughmap .border3, .root_daum_roughmap .border4 {display: none !important;}

.location-info .way_list {display: flex; width: 100%; margin-top: 25px;}
.location-info .way_list ul li {display: flex; align-items: center;}
.location-info .way_list ul li:not(:last-child) {margin-bottom: 24px;}
.location-info .way_list ul li .way_wrap .th {font-size: 1rem; font-weight: 600; margin-bottom: 8px;}
.location-info .way_list ul li .way_wrap .td {font-size: 1rem; line-height: 1.8; word-break: keep-all;}
.location-info .way_list ul li .ico_bus {display: inline-block; position: relative; margin-right: 20px; background-image: url("../../../assets/images/ico/ico-bus.svg"); background-position: 50%; background-repeat: no-repeat; background-size: contain; width: 86px; height: 86px; flex: none;}
.location-info .way_list ul li .ico_car {display: inline-block; position: relative; margin-right: 20px; background-image: url("../../../assets/images/ico/ico-car.svg"); background-position: 50%; background-repeat: no-repeat; background-size: contain; width: 86px; height: 86px; flex: none;}

/*sect4*/
.sect4 {padding: 0 0 150px; background-image: url("../../../assets/images/main/sect4-bg.png"); background-repeat: no-repeat; background-size: cover;}
.main-contact {display: flex; grid-column-gap: 30px;}
.main-contact .contact-bg {padding: 40px 30px; border-radius: 15px; background-image: url("../../../assets/images/main/contact-bg.png"); background-repeat: no-repeat; background-size: cover; display: flex; flex-direction: column; justify-content: end; width: 100%; max-width: 570px; position: relative;}
.main-contact .contact-bg::before {content: ''; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) 21.23%, #000 112.24%); border-radius: 15px;}
.main-contact .contact-bg .txt {font-size: 22px; font-weight: 500; color: #fff; line-height: 1.5; z-index: 1;}
.main-contact .contact-bg p {font-size: 26px; font-weight: 700; color: #fff; line-height: 1.3; z-index: 1; margin-top: 14px;}
.main-contact .contact-wrap {padding: 50px 40px 30px; border-radius: 15px; border: 1px solid var(--gray); width: 100%; background: #fff;}
.main-contact .contact-wrap .contact-tit {font-size: 52px; font-weight: 700; color: #424242;}
.main-contact .contact-wrap .contact-box {margin-top: 40px;}
.main-contact .contact-wrap .contact-box .write_div label {font-size: 20px; font-weight: 700; color: #292929;}
.main-contact .contact-wrap .contact-box .write_div input {border-radius: 10px; border: 1px solid #D9D9D9; height: 56px; font-size: 1.125rem; padding: 0 20px; margin-top: 14px;}
.main-contact .contact-wrap .contact-box .write_div textarea {border-radius: 10px; border: 1px solid #D9D9D9; min-height: 170px; font-size: 1.125rem; padding: 12px 20px; margin-top: 15px;}
.main-contact .contact-wrap .contact-box .write_div + .write_div {margin-top: 30px;}
.main-contact .contact-wrap label .required::after {content: "*"; color: #F00; margin-left: 5px; font-size: 1.125rem;}
.main-contact .contact-wrap .input-wrap .agree-label {margin-top: 16px; font-size: 1rem; width: fit-content;}
.main-contact .contact-wrap .input-wrap .agree-label span {font-weight: 700; margin-right: 5px;}
.main-contact .contact-wrap .input-wrap .agree-label a {font-weight: 600;}

input.check-style-02 {display: none;}
input.check-style-02 ~ label::before {content: ""; margin-right: 10px; display: inline-block; width: 20px; height: 20px; border: solid 1px #BABABA; border-radius: 5px; background-image: url("../../../assets/images/cmn/ico_check_02.svg"); background-position: 50%; background-repeat: no-repeat; background-size: contain; background-size: auto; cursor: pointer;}
input[type="checkbox"]:checked + label::before {background-color: var(--orange); border: 1px solid var(--orange); background-image: url("../../../assets/images/cmn/ico_check_02_check.svg");}
/* 개인정보처리방침 버튼 */
.privacy-box {
  display: none;
  background: #ffffff;
  border: 1px solid var(--gray);
  box-sizing: border-box;
  position: relative;
  border-radius: 5px;
  font-size: 0.875rem;
  font-weight: 400;
  background: #F7F7F7;
  color: #000;
  padding-top: 20px;
  padding-bottom: 20px;
  margin-top: 20px;
}
.privacy-box .privacy-cont {
  overflow-y: scroll;
  padding: 0 20px;
  max-height: 250px;
  margin-right: 8px;
  cursor: text;
  line-height: 1.5;
}
.privacy-box .privacy-cont::-webkit-scrollbar { width:5px; height:5px; background: transparent;}
.privacy-box .privacy-cont::-webkit-scrollbar-thumb { background:#a7a7a7; }


@media screen and (min-width: 1921px) {
  .sect1 .inner {grid-column-gap: 90px;}
  .sect1 .inner > div {max-width: 100%;}
}

@media screen and (max-width: 1600px) {
 
}

@media screen and (max-width: 1280px) {
  /* common */
  #hd_wrap.active {box-shadow: 0px 0px 10px rgba(0,0,0,0.1);}

  /* sect banner */
  .banner-slide > ul > li .banner-txt .banner-top {font-size: 52px;}

  /* sect1 */
  .sect1 {padding: 150px 0;}
  .sect1 .inner {flex-direction: column; grid-row-gap: 80px;}
  .sect1 .inner > div {max-width: 100%;}
  
  /* sect2 */
  .sect2 {padding: 220px 0 50px;}
  .sect2 .sect2-tit {font-size: 2rem;}
  .sect2 .sect2-txt {font-size: 1.125rem;}
  .sect2 .more-btn {max-width: 194px; height: 60px; font-size: 22px; margin-top: 30px;}


  /* sect3 */
  .location-info {padding: 50px 40px 40px;}
  .location-info .tit {font-size: 30px;}
  .location-info .info_list ul {flex-direction: column; grid-row-gap: 10px;}
  .location-info .dir_btn {max-width: 150px; height: 52px; top: 40px; right: 40px;}
  .location-info .dir_btn span {font-size: 1.125rem;}
  .location-info .way_list ul li {align-items: flex-start;}
  .location-info .way_list ul li .ico_bus, .location-info .way_list ul li .ico_car {width: 74px; height: 74px;}

  /* sect4 */
  .main-contact {flex-direction: column; grid-row-gap: 30px;}
  .main-contact .contact-bg {background-image: url("../../../assets/images/main/contact-bg-pad.png"); max-width: 100%; height: 300px; padding: 30px;}
  .main-contact .contact-bg .txt {font-size: 1.125rem;}
  .main-contact .contact-bg p {font-size: 22px; margin-top: 10px;}
  .main-contact .contact-wrap {padding: 50px 30px 30px;}
  .main-contact .contact-wrap .contact-tit {font-size: 40px;}
}

@media screen and (max-width: 768px) {
  /* common */
  #container section:last-child {padding-bottom: 100px;}

  /*sect banner*/
  .banner-slide .slide-img {background-position: center top;}
  .banner-slide > ul > li .banner-txt {display: flex; flex-direction: column; justify-content: space-between; padding-top: 130px; height: 70%; top: 0; transform: translateX(-50%);}
  .banner-slide > ul > li .banner-txt .banner-top {font-size: 34px; padding: 0 20px;}
  .banner-slide > ul > li .banner-txt .banner-tit {font-size: 0.875rem; line-height: 1.5; word-break: keep-all; padding: 0 20px;}
  .banner-slide .swiper-control {top: 74%; grid-column-gap: 20px;}
  .banner-slide .swiper-control .swiper-btn {width: 36px; height: 36px;}
  .banner-slide .swiper-control .swiper-pagination .swiper-pagination-bullet, .banner-slide .swiper-control .swiper-pagination .swiper-pagination-bullet-active {width: 40px;}
  .lottie--mouse_scroll {max-width: 17px; bottom: 20px;}
  .mouse-scroll {top: 92%;}
  .mouse-scroll .img01, .mouse-scroll .img01 img {width: 17px; height: 24px;}
  .mouse-scroll .img02 {top: 4px;}
  .mouse-scroll span {font-size: 10px;}

  /* sect1 */
  .sect1 {padding: 80px 0;}
  .sect1 .inner {grid-row-gap: 60px;}

  /* sect2 */
  .sect2 {padding: 180px 0 40px; background-position: 20% 100%;}
  .sect2::before {background: linear-gradient(155deg, rgba(0, 0, 0, 0.00) -1.24%, rgba(0, 0, 0, 0.70) 57.77%);}
  .sect2 .sect2-tit {font-size: 24px;}
  .sect2 .sect2-txt {font-size: 1rem; margin-top: 10px;}
  .sect2 .sect2-txt br {display: none;}
  .sect2 .sect2-txt br.mo-ver {display: block;}
  .sect2 .more-btn {max-width: 148px; height: 50px; font-size: 1.125rem; margin-top: 20px;}

  /* sect3 */
  .sect3 {padding: 80px 0;}
  .location-info {padding: 40px 20px 30px;}
  .location-info .tit {font-size: 24px;}
  .location-info .info_list {margin-top: 26px;}
  .location-info .info_list ul li {align-items: flex-start;}
  .location-info .info_list ul li .th, .location-info .info_list ul li .td {font-size: 1rem; line-height: 1.3; word-break: keep-all; min-width: 56px;}
  .location-info .dir_btn {max-width: 116px; height: 42px; font-size: 1rem; top: 30px; right: 20px;}
  .location-info .dir_btn .ico_direction {width: 30px; height: 30px;}
  .location-info .dir_btn span {font-size: 1rem;}
  .location-info .way_list ul li:not(:last-child) {margin-bottom: 20px;}
  .location-info .way_list ul li .ico_bus, .location-info .way_list ul li .ico_car {width: 60px; height: 60px; margin-right: 15px;}
  .location-info .way_list ul li .way_wrap .th, .location-info .way_list ul li .way_wrap .td {font-size: 0.875rem;}
  .location-map {margin-top: 20px;}
  .root_daum_roughmap .wrap_map {height: 450px !important;}

  /* sect4 */
  .sect4 {padding: 0 0 100px;}
  .main-contact {grid-row-gap: 20px;}
  .main-contact .contact-bg {height: 250px;}
  .main-contact .contact-bg::before {background: linear-gradient(180deg, rgba(0, 0, 0, 0.00) -13.6%, #000 109.2%);}
  .main-contact .contact-bg .txt {font-size: 0.875rem; word-break: keep-all;}
  .main-contact .contact-bg p {font-size: 20px;}
  .main-contact .contact-wrap {padding: 30px 20px 30px;}
  .main-contact .contact-wrap .contact-tit {font-size: 26px;}
  .main-contact .contact-wrap .contact-box {margin-top: 26px;}
  .main-contact .contact-wrap .contact-box .write_div label {font-size: 1rem;}
  .main-contact .contact-wrap .contact-box .write_div input {height: 50px; padding: 0 15px;}
  .main-contact .contact-wrap .contact-box .write_div textarea {padding: 15px;}
  .main-contact .contact-wrap .contact-box .write_div input, .main-contact .contact-wrap .contact-box .write_div textarea {font-size: 1rem; margin-top: 10px;}
  .main-contact .contact-wrap .contact-box .write_div + .write_div {margin-top: 20px;}
  .btn_confirm button {font-size: 1.125rem;}
}

@media screen and (max-width: 360px) {
  /* sect banner */
  .banner-slide > ul > li .banner-txt .banner-top {font-size: 1.75rem; padding: 0 12px;}

  /* sect2 */
  .sect2 .sect2-tit {font-size: 20px;}
  .sect2 .sect2-txt {font-size: 0.875rem;}
  .root_daum_roughmap .wrap_map {height: 400px !important;}

  /* sect3 */
  .main-contact .contact-bg {padding: 20px;}
  .main-contact .contact-bg .txt br {display: none;}
  .main-contact .contact-bg p {font-size: 1.125rem;}

  /* sect4 */
  .main-contact .contact-wrap .input-wrap .agree-label {font-size: 0.75rem;}
}