/* 모집공고 */
    body {
  margin: 0;
  font-family: 'Noto Sans KR', sans-serif;
  background-color: #f5f2ed;
}

.container {
  display: flex;
  justify-content: center;
  align-items: center;
  max-width: 1200px;
  margin: 0 auto;
  text-align: center;
}

.image-section {
  flex: 1;
  max-width: 50%;
}

.image-section img {
  width: 100%;
  height: auto;
  display: block;
  margin: 0 auto;
}

.text-section {
  flex: 1;
  text-align: center;
  max-width: 50%;
}

.text-section h1 {
  font-size: 32px;
  line-height: 1.4;
  font-weight: 400;
  margin-bottom: 5px;
}

.sub {
  font-size: 15px;
  letter-spacing: 2px;
  color: #2780ec;
}

.main-title {
  font-size: 24px;
  line-height: 1.6;
  font-weight: 200;
  margin: 22px 0;
}

.btn-group {
  display: flex;
  flex-direction: column;
  gap: 12px;
  text-align: center;
}

.btn {
  display: inline-block;
  text-decoration: none;
  padding: 15px 20px;
  font-size: 20px;
  color: #fff;
  border-radius: 2px;
  transition: background 0.3s;
  width: 100%;
  max-width: 500px;
  text-align: center;
}

.btn.blue {
  background-color: #519af2;
}

.btn.blue:hover {
  background-color: #2780ec;
}

.btn.navy {
  background-color: #2d54ae;
}

.btn.navy:hover {
  background-color: #244184;
}

/* 📱 모바일 반응형 처리 */
@media screen and (max-width: 768px) {
  .container {
    flex-direction: column;
    height: auto;
  }

  .image-section,
  .text-section {
    max-width: 100%;
    flex: none;
    padding: 0;
  }

  .text-section {
    padding: 30px 20px;
    text-align: center;
  }

  .text-section h1 {
    font-size: 40px;
  }

  .main-title {
    font-size: 13px;
  }

  .btn {
    width: 100%;
    margin: 0 auto;
  }
}

.white-box {
  background-color: #ffffff;
  padding: 40px;
  border-radius: 8px;
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.05);
}


*{margin: 0; padding: 0; position: relative; box-sizing: border-box;}
li{list-style: none;}
a{text-decoration: none;}
b{font-weight: normal;}
i{font-style: normal;}
html{font-size: 14px;}
body{font-family: "Pretendard", "Spoqa Han Sans Neo", sans-serif; font-style: normal; letter-spacing: -.05rem;}
section{width: 100%; overflow: hidden;}
.inner{max-width: 1200px; margin: 0 auto; padding: 120px 0;}
.m_br{display: none;}
.m_img{display: none;}
.blind{position: absolute; font-size: 0; text-indent: -9999%;}

.top-wrap{position: fixed; min-width: 1600px; top: 0; left: 125px; width: calc(100% - 125px); display: flex; align-items: center; justify-content: space-between;  background: transparent; z-index: 99; overflow: hidden; color: #ffffff; border-bottom: 1px solid #ffffffb7; text-align: center; transition: background .5s,  padding .5s, color .3s;}
.top-wrap::after{position: absolute; top: 0; left: 0; width: 1px; height: 400px; content: ""; background: linear-gradient(to bottom, transparent 0 105px, #ffffff 0 225px);}
.top-wrap.active::after, .top-wrap.on::after{background: linear-gradient(to bottom, var(--pt01) 0 105px, #ffffff 0 225px);}
.top-wrap .call{display: flex; align-items: center; font-size: 24px; font-weight: 700; color: #ffffff; margin-right: 5%; text-wrap: nowrap; direction: rtl;}
.top-wrap .call::after{display: block; content: ""; position: relative; width: 48px; height: 48px; background: url(../images/call_w.png) no-repeat;}
.top-wrap .call p{margin-left: 10px;}
.top-wrap .call a{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.top-wrap .call .small-text {font-size: 20px; /* 작은 글씨 */ top: -1px; left: -265px;  color: #fff; font-weight: 400;}
.top-wrap.active .call .small-text, .top-wrap.on .call .small-text{color: #000;}
.top-wrap .call .part{font-size: 1.3rem;}
.top-wrap .call .pr5{margin-right: 5px;}
.top-wrap .call .cspan{font-size: 1.3rem; font-weight: 400;}
.top-wrap .menu{width: 55%; height: 105px; transition: height .5s;}
.top-wrap .menu>ul{top: 0; height: 100%; display: flex; justify-content: center; align-items: center; font-size: 20px;}
.top-wrap .menu>ul>li{height: 100%; display: flex; align-items: center; justify-content: center;  white-space: nowrap; margin: 0 30px;}
.top-wrap .menu>ul>li p:hover{font-weight: 700;}
.top-wrap .menu>ul li a{position: absolute; width: 100%; height: 100%; top: 0; left: 0;}
.top-wrap .menu>ul>li ul{position: absolute; display: flex; flex-direction: column; top: 125px; font-size: 16px; color: #ffffff;}
.top-wrap .menu>ul>li ul li{margin: 7px 17px;}
.top-wrap .menu-m{display: none;}
.top-wrap .logo{font-size: 0; margin-left: 5%;}
.top-wrap .logo a{display: block; width: 242px; height: 28px; background: url(../images/logo_w.png) center / cover no-repeat;}

.top-wrap.on{background: #ffffff;color: #000000; border-bottom: 1px solid var(--pt01);}
.top-wrap.on .logo a{background: url(../images/logo.png) center / cover no-repeat;}
.top-wrap.on .call {color: #000000;}
.top-wrap.on .call::after{background: url(../images/call.png) center / cover no-repeat;}
.top-wrap.on .call p{background: #ffffff;color: #000000; border-bottom: 1px solid var(--pt01);}

.left-nav{position: fixed; top: 0; left: 0; display: flex; flex-direction: column; justify-content: space-between; width: 125px; height: 100%; min-height: 720px; background: var(--pt01); z-index: 999;}
.left-nav .left-logo{background: #ffffff; width: 100%; height: 105px; display: flex; align-items: center; justify-content: center;}
.left-nav .left-logo a{position: absolute; left: 0; top: 0; width: 100%; height: 100%;}
.left-nav .quick-icon{padding-left: 27px;}
.left-nav .quick-icon ul li{display: flex; align-items: center; cursor: pointer; width: 63px; height: 63px; border-radius: 100px; padding-left: 20px; margin-bottom: 20px; background: #d2d2d2; transition: width .5s; overflow: hidden;}
.left-nav .quick-icon ul li::after{display: block; content: ""; position: absolute; right: 20px; width: 10px; height: 16px; background: url(../images/quickicon3.png) center / cover no-repeat; opacity: 0; transition: .3s .3s;}
.left-nav .quick-icon ul li:hover{width: 200px;}
.left-nav .quick-icon ul li:hover::after{opacity: 1;}
.left-nav .quick-icon ul li p{text-wrap: nowrap; display: flex; font-size: 15px; font-weight: 600; color: #1f49a5; margin-left: 18px;}
.left-nav .quick-icon ul li a{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}
.left-nav .swiper-pagination{position: relative; width: auto !important; margin: 70px auto 0 auto; height: 330px;}
.left-nav .swiper-pagination .swiper-pagination-bullet{content: ""; position: relative; display: block; width: 1px; height: 110px; margin-bottom: 55px !important; background: #d2d2d2; opacity: 1;}
.left-nav .swiper-pagination .swiper-pagination-bullet span{position: absolute; top: -40px; left: -10px; font-size: 18px; font-weight: 700; color: #ffffff; opacity: .3;}
.left-nav .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active span{opacity: 1;}
.left-nav .swiper-pagination > div:last-child{height: 0;}
.left-nav .pagination{height: 398px;}
.left-nav .top-button{margin: 0 auto 20px auto; cursor: pointer;}

.tit{font-weight: 300; font-style: normal; font-size: 4rem; text-align: center; margin-bottom: 70px; letter-spacing: -.2rem; line-height: 1.4;}
.tits{font-weight: 500; font-style: normal; font-size: 1.5rem; text-align: center; opacity: .15; letter-spacing: .2rem;}

/* popup */
.divpop_yb{position:absolute; top: 10vw; right: 15%; opacity: 0; animation: fadeInD2 1s ease-in-out both; z-index: 9999; font-size: 0;}
@keyframes fadeInD2 {
  from {opacity: 0; margin-top: -60px;}
  to {opacity: 1; margin-top: 0;}
} 
.close_yb{position: absolute; display: block; width: 50px; height: 50px; top:-50px; right:0; background:#000000c7; cursor: pointer;}
.close_yb span{position: absolute; width: 40px; height:2px; background: #fff; display: block; left: 50%; top: 50%;}
.close_yb span:nth-of-type(1){transform: translate(-50%, -50%) rotate(135deg);}
.close_yb span:nth-of-type(2){transform: translate(-50%, -50%) rotate(-135deg);}


.quick{position: fixed; right: 95px; top: 20%; z-index: 999; cursor: pointer; transition: top 1s;}
.quick.on{top: 70%;}
.quick.main{top: 25%;}
.quick .quick-pc:nth-of-type(1){top: 105%; position: absolute; }
.quick ul li a{position: absolute; width: 100%; height: 100%; left: 0; top: 0;}
.quick-pc div{position:absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); text-align: center; font-size: 18px; font-weight: 500;}
.quick-pc div p{font-weight: 800;}
.quick-pc img{animation: quick-rotate 5s linear infinite;}
@keyframes quick-rotate{
    0%{transform: rotate(0deg);}
    100%{transform: rotate(360deg);}
}
.quick-m{display: none;}


.sub-top{min-width: 1600px; display: flex; align-items: center; justify-content: center; flex-direction: column; text-align: center; width: calc(100% - 125px); margin-left: auto; height: 379px; background: url(../images/info_bg.jpg) center / cover no-repeat; color: #ffffff;}
.sub-top h2{font-size: 38px; font-weight: 700; line-height: 1.6; letter-spacing: 5px; margin-top: 80px;}
.sub-top h2::before{content: "WONDERAUM THE HILL"; display: block; font-weight: 400; font-size: 16px; letter-spacing: 10px;}

.guide-tx{text-align: left; font-size: 14px; color: #999999; line-height: 1.5; margin-top: 10px;}
.sub-cont.schedule.layout .inner .guide-tx{font-size: 17px;}
.schedule b {
    font-size: 30px;
    font-weight: bold;
    color:#2d54ae; letter-spacing: 0;}
.s-tx{font-size: 14px; color: #999999;}
.nn{font-size: 28px; color: #b5b5b5; text-align: center; padding: 420px 0; background: #f4f2ef; font-weight: 700;}
.img-tx{position: absolute; right: 10px; bottom: 10px; color: #ffffff; font-size: 12px; opacity: 1; letter-spacing: 0;}

.sub-tit{margin-bottom: 100px; color: #2d54ae; letter-spacing: 0;}
.sub-tit p{font-size: 30px; line-height: 1.4;}
.sub-tit b{font-weight: 700;}

.sub-cont{width: calc(100% - 125px); margin-left: auto; min-width: 1600px;}
.sub-cont .inner{padding: 120px 0 300px 0; text-align: center;}
.sub-table table{border-spacing: 0; font-size: 19px; text-align: left;}
.sub-cont .info-table{display: flex; justify-content: space-between; margin-top: 120px; color: #191919;}
.sub-cont .info-table table{width: 48%;}
.sub-cont .info-table table th, .sub-cont .info-table table td{padding-left: 15px;}
.sub-cont .info-table table th{width: 154px; height: 74px; border-top: 2px solid #191919;}
.sub-cont .info-table table td{border-top: 1px solid #9f9f9f;}
.sub-cont .info-table table tr:last-child th{border-bottom: 2px solid #191919;}
.sub-cont .info-table table tr:last-child td{border-bottom: 1px solid #9f9f9f;}

.sub-cont.info .inner > img:nth-of-type(3){margin-top: 30px;}

.sub-cont.brand .inner > div{display: flex; flex-direction: column; align-items: center; justify-content: center; background: #f4f2ef; padding: 100px 0 120px 0; text-align: center;}
.sub-cont.brand .inner > div > img:nth-of-type(1){left: -17px;}
.sub-cont.brand .inner > div img:nth-of-type(2){margin: 40px 0 85px 0;}
.sub-cont.brand .inner > div div p{font-size: 21px; color: #5b5b5b; line-height: 1.7;}
.sub-cont.brand .inner > div div span{display: block; width: 1px; height: 45px; background: #5b5b5b; left: 50%; margin: 50px 0;}


.environment .inner ul{margin-top: 60px; display: flex; flex-wrap: wrap; justify-content: space-between;}
.environment .inner ul li{width: 49%; margin-bottom: 20px;}
.environment .inner ul li:nth-of-type(n+3){margin-bottom: 0;}
.environment .inner ul li b{display: block; font-weight: 700; font-size: 22px; color: var(--pt01); margin: 15px 0 10px 0;}
.environment .inner ul li p{font-weight: 400; font-size: 17px; letter-spacing: 0; color: #555; line-height: 1.3;}
.environment .inner ul li div{width: 100%; height: 200px; background: #999;}
.environment .inner > img:nth-of-type(1){margin-bottom: 40px;}

.sub-cont.premium .inner ul{margin-top: 100px; display: flex; flex-wrap: wrap; justify-content: space-between;}
.sub-cont.premium .inner ul li{width: 48%; margin-bottom: 50px; text-align: left;}
.sub-cont.premium .inner ul li:nth-of-type(n+5){margin: 0;}
.sub-cont.premium .inner ul li b{display: block; font-weight: 700; font-size: 24px; color: var(--pt01); margin: 20px 0 10px 0;}
.sub-cont.premium .inner ul li p{font-weight: 400; font-size: 17px; letter-spacing: 0; color: #555; line-height: 1.3;}
.sub-cont.premium .inner ul li div{width: 100%; border-radius: 10px; overflow: hidden; font-size: 0;}
.sub-cont.premium .inner ul li i{font-size: 80px; font-weight: 600; position: absolute; bottom: 5px; left: 20px; color: #ffffff; opacity: .6;}

.location .map_wrap{display: flex; justify-content: space-between;}
.location .main7_map{width:45%; margin: 0 auto;}
.location .main7_map .map_1{width:100%; height:400px; border: 1px rgb(223, 223, 223) solid; overflow: hidden;}
.location .main7_map .tx{text-align: center; line-height: 1.5;}
.location .main7_map .tx b{color: var(--pt01); font-size: 22px; letter-spacing:-0.05em; display: block; line-height: 10px; font-weight: 700;}
.location .main7_map .tx p{color: #7a7a7a; font-size: 17px; letter-spacing:-0.05em;}
.location .main7_map .tx li{color: var(--pt01); font-size: 22px; letter-spacing:-0.05em; display: block; line-height: 3em; font-weight: 700;margin-top : 20px;}
.location .main7_map .tx > div{width:185px;height:2px; border-bottom: var(--pt01) 2px solid; display: inline-block; }
.btn_wrap{display: flex; justify-content: space-between; align-items: flex-end; margin-bottom: 20px;}
.root_daum_roughmap{width: auto !important;}

.layout-table{display: flex; flex-wrap: wrap; justify-content: space-between;}
.layout-table > p{width: 100%; text-align: center; margin:50px 0 30px 0; font-size: 32px; font-weight: 600;}
.layout-table table td{width: 125px; height: 66px; padding-left: 15px; border-top: 1px solid #9f9f9f;}
.layout-table table td.type{width: 130px; border-top: 2px solid #191919; font-weight: 700;}
.layout-table table tr:nth-of-type(1) td:nth-of-type(1){background: var(--pt01);color: #ffffff; padding:0; text-align: center; vertical-align: top; padding-top: 20px; font-weight: 500;}
.layout-table table tr:nth-of-type(1) td{border-top: 0; border-right: 10px solid #ffffff;}

.layout .layout_img{display: flex; flex-wrap: wrap; margin: 100px 0 -145px 0;}
.layout .layout_img li{width: 100%; display: flex; text-align: left;}
.layout .layout_img li:nth-of-type(odd) .layout_tx{margin-left: 30px;}
.layout .layout_img li b{font-size: 26px; font-weight: 700;}
.layout .layout_img li p{font-size: 20px; margin-top: 10px; letter-spacing: 0;}
.layout .layout_img li:nth-of-type(even){justify-content: flex-end; align-items: flex-end; text-align: right; top: -145px;}
.layout .layout_img li:nth-of-type(even) .layout_tx{margin-right: 30px;}

.schedule .inner img{width: 100%;}
.schedule .inner img.m-img{display: none;}


.community .inner > ul{display: flex; flex-wrap: wrap; justify-content: space-between; margin-top: 50px;}
.community .inner > ul li{width: 32%; text-align: left;}
.community .inner > ul li > div{width: 100%; border-radius: 10px; overflow: hidden;}
.community .inner > ul li > div img{width: 100%;}
.community .inner ul li b{display: block; font-weight: 700; font-size: 24px; color: var(--pt01); margin: 20px 0 10px 0;}
.community .inner ul li p{font-weight: 400; font-size: 17px; letter-spacing: 0; color: #555; line-height: 1.3;}



.schedule-table{margin-top: 50px;}
.schedule-table table{width: 100%; border-spacing: 7px;}
.schedule-table table th, .schedule-table table td{padding-left: 15px;}
.schedule-table table th{border-bottom: 2px solid #191919; height: 55px; width: 206px;}
.schedule-table table td{border-bottom: 1px solid #9f9f9f;}


.sub-cont.unit{overflow: visible;}
.unit .unit-slide .swiper-slide{background: #ffffff;}
.unit .unit-slide .swiper-slide ul{width: 100%; display: flex; flex-wrap: wrap; justify-content: space-between; margin: 50px 0 80px 0;}
.unit .unit-slide .swiper-slide ul li{width: 32%; height: 60px; display: flex; align-items: center; font-size: 19px; text-align: left; margin: 0 auto;}
.unit .unit-slide .swiper-slide ul li p{padding: 20px 0px 20px 10px;}
.unit .unit-slide .swiper-slide ul li p:nth-of-type(1){border-bottom: 2px solid #000000; width: 40%; font-weight: 700;}
.unit .unit-slide .swiper-slide ul li p:nth-of-type(2){border-bottom: 1px solid #000000; width: 60%;}
.unit .unit-slide .swiper-slide img{margin-top: 50px;}
.unit .swiper-pagination3{position: sticky; top: 106px !important; width: 100%; height: 110px; padding-top: 40px; background: #ffffff; top: 0; display: flex; justify-content: space-between; z-index: 2;}
.unit .swiper-pagination-bullet{width:calc(100% / 3); opacity:1;  margin: 0 8px 0 0!important; height: 100%; border-radius: 0; background: #ffffff; border-block: 2px solid #212121;}
.unit .swiper-pagination-bullet span{display: flex; justify-content: center; align-items: center; height: 100%; background: var(--backs); color: #212121; font-weight: 700; font-size: 24px; text-align: center; line-height: 1.2;}
.unit .swiper-pagination-bullet-active{border: 0;}
.unit .swiper-pagination-bullet-active span{background: var(--pt01); color: #ffffff;}
.unit .swiper-pagination-bullet:last-child{margin-right: 0 !important;}

.unit .unit_btn{position: absolute; top: 350px; right: 0; width: 140px; background: #a1a1a1; color: #ffffff; text-align: center;}
.unit .unit_btn p{padding: 15px 0; font-weight: 700; font-size: 15px;}
.unit .unit_btn a{position: absolute; top: 0; left: 0; width: 100%; height: 100%;}

.vr_view iframe{width: 100%; height: 700px;}

.qna .inner > img:first-child, .qna .inner > img:nth-of-type(2){margin-bottom: 80px;}
.qna .inner ul{margin: 50px 0; display: flex; flex-wrap: wrap; justify-content: space-between;}
.qna .inner ul li{margin-bottom: 20px;}
.qna .qna-table table{width: 100%; margin: 0 auto;}
.qna .qna-table table th{height: 72px; background: #0184c8; color: #ffffff; text-align: center;}
.qna .qna-table table td{height: 72px; border-bottom: 1px solid #9f9f9f; padding-left: 15px;}
.qna .qna-table table td:first-child{font-weight: 700; border-bottom: 2px solid #000000;}
.qna .qna-table table .table-space{background: #ffffff; width:6px; border: 0; padding: 0;}
.qna .qna-table table tr:first-child th:last-child{background: #999999;}
.qna .qna-table table td:nth-of-type(3){background: #edfbff;}
.qna .qna-table table td:last-child{background: #f7f7f7;}

.register .inner{text-align: left;}
.register .input_s{display: flex; justify-content: space-between; flex-wrap: wrap; width: 1000px; margin: 0 auto;}
.register .input_s > div{width: 49%;}
.register .input_s > .agree{width: 100%;}
.register .input_s > div > p{font-size: 1.3rem; font-weight: 400; margin-bottom: 10px;}
.register .input_s > div > p:after{position: relative; left: 2px; top: -2px; content: "*"; color: var(--pt02); font-size: 1.2rem;}
.register .input_s > div > .pn:after{content: "";}
.register .input_s input{width: 100%; height: 80px; background: transparent; border: solid 1px #0000001a; border-radius: 5px; font-size: 1.2rem; padding: 20px; font-weight: 300; margin-bottom: 20px;}
.register .input_s .agree{height: 250px; border: solid 1px #0000001a; border-radius: 5px; padding: 20px; padding-right: 15px; overflow-y: scroll; color: #5c5c5c; line-height: 1.3;}
.register .input_s .contact{width: 100%;}
.register .input_s .contact .checkbox label{display: flex; align-items: center; padding-left: 25px; left: 5px; top: 5px; font-size: 1.2rem; line-height: 1.1; margin-top: 10px;}
.register .input_s .contact .checkbox input{display: none;}
.register .input_s .contact .checkbox input:checked + label:before{border: 2px solid var(--pt01);}
.register .input_s .contact .checkbox input:checked + label:after{background: var(--pt01);}
.register .input_s .contact .checkbox input + label:before{content: ""; display: block; width: 15px; height: 15px; position: absolute; left: 0; border: 2px solid #ddd; border-radius: 50%;}
.register .input_s .contact .checkbox input + label:after{content: ""; display: block; width: 7px; height: 7px; position: absolute; left: 6px; background: #fff; border-radius: 50%;}
.register .contact_btn{width: 350px; height: 60px; line-height: 58px; background: var(--pt01); border-radius: 20px; color: #fff; font-weight: 500; font-size: 1.4rem; text-align: center; cursor:pointer; margin: 30px auto 0 auto; margin-top: 60px;}
.register .contact_btn a{position: absolute; width: 100%; height: 100%; top: 0; left: 0;}



.footer{background: #888181; color: #ffffff; font-size: 16px; line-height: 2; padding-left: 125px; min-width: 1600px;}
.footer .inner{padding: 60px 0;}
.footer .footer-logo{display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #ffffff; letter-spacing: 0; padding-bottom: 20px; margin-bottom: 20px;}
.footer .footer-logo ul{display: flex;}
.footer .footer-logo ul li{margin-right: 50px; display: flex; align-items: center;}
.footer .footer-logo ul li p{margin-right: 20px;}
.footer .footer-logo ul li b{font-size: 22px; font-weight: 700;}
.footer .footer-logo ul li:last-child{margin-right: 0;}
.footer .footer-logo img{max-width: 242px;}
.footer .footer-yourbiz{margin-bottom: 10px;}
.footer .footer-yourbiz a{color: #fff;}
.footer .footer-tx{font-size: 14px;}



::-moz-selection{background-color:var(--back02);color:#fff;}
::-webkit-selection{background-color:var(--back02);color:#fff;}
::selection{background-color:var(--back02);color:#fff;}
::-webkit-scrollbar {width: 7px;}
::-webkit-scrollbar-track {background-color:#e0e0e0;}
::-webkit-scrollbar-thumb { background-color: var(--back00);}
:root{
--back00:#dddddd;
--back02:#0e1d60;
--pt01:#2d54ae;
--pt02:#ff2600;
    }

    [data-aos=scale]{transform: translate3d(0px, 50px, 0px) scale(1.5); opacity: 0;}
    [data-aos=scale].aos-animate{transform: translate3d(0px, 0px, 0px) scale(1); opacity: 1;}

    @media(max-width:1600px){
        html{font-size: 13px;}
        .inner{width: 90%;}
        
    }

    @media(min-width:1025px){
        .top-wrap.active{background-image: linear-gradient(to bottom, #ffffff 0 105px, var(--pt01) 0 225px); background: #ffffff;  padding-bottom: 225px; border-color: #ffffff; color: #191919; border-bottom: 0;}
        .top-wrap.active::before{content: ""; position: absolute; background: var(--pt01);width: 100%; top: 105px; height: 225px;}
        .top-wrap .menu>ul>li::before{content: ""; position: absolute; width: 0; height: 2px; background: var(--pt01); bottom: 20px; transition: width .5s; z-index: 1;}
        .top-wrap .menu>ul>li:hover > p{font-weight: 700;}
        .top-wrap .menu>ul>li:hover::before{width: 87px;}
        
        .top-wrap.active .logo a{background: url(../images/logo.png) center / cover no-repeat; transition: background .3s;}
        .top-wrap.active .call{color: #000;}
        .top-wrap.active .call::after{background: url(../images/call.png) no-repeat;}
    }
    
    @media(max-width:1200px){

    }

    


    @media(max-width:1024px){
        *{-webkit-tap-highlight-color:transparent;}
        html{font-size: 12px;}
        .m_br{display: block;}
        .pc_br{display: none;}
        .pc_img{display: none;}
        .m_img{display: block;}
        .inner{max-width: 570px;}
        .left-nav{display: none;}
        .guide-tx{font-size: 12px;}
        .nn{padding: 150px 0; font-size: 22px;}
        .sub-tit{margin-bottom: 80px;}
        .sub-tit p{font-size: 22px;}
        .sub-cont{width: 100%; min-width: auto;}
        .sub-cont .inner{padding: 80px 0 120px 0;}
        .sub-top{width: 100%; height: 240px; min-width: auto;}
        .sub-top h2{font-size: 24px; line-height: 2;}
        .sub-top h2::before{font-size: 10px;}
        .top-wrap .logo a{width: 182px; height: 21px;}
        .top-wrap .logo a.on{background: url(../images/logo.png) center / cover no-repeat;}
        .top-wrap::before, .top-wrap::after{display: none;}
        .top-wrap{width: 100%; left: 50%; transform: translateX(-50%); height: 70px; min-width: auto; overflow: visible; color: #000000;}
        .top-wrap.on .menu{height: 80px;}
        .top-wrap.on .menu-m>div span{background: #000000;}
        .top-wrap .menu{position: absolute; top: 0; left: 0; width: 100%; height: 70px;}
        .top-wrap .menu>ul{position: absolute; display: flex; justify-content: flex-start; align-items: center; flex-direction: column; padding: 120px 0; top: 0; right: 0; width: 0; height: 100vh; background: #ffffff; transition: width .5s; font-size: 22px;}
        .top-wrap .menu>ul>li{width: 81%; height: auto; display: block; border-bottom: 1px solid #afafaf42; padding: 2.5vh 0; opacity: 0; transition: opacity .5s; cursor: pointer;}
        .top-wrap .menu>ul>li.on >p{color: var(--back02); font-weight: 700;}
        .top-wrap .menu>ul>li:first-child{margin-top: -2vh;}
        .top-wrap .menu>ul>li:last-child{border: 0;}
        .top-wrap .menu>ul>li p::before{display: block; position: absolute; top: 50%; transform: translateY(-50%); left: -10px; content: ""; width: 3px; height: 3px; background: var(--pt01);}
        .top-wrap .menu>ul>li p{margin-left: 20px; text-wrap: nowrap; text-align: left;}
        .top-wrap .menu>ul>li>a:not(.top-wrap .menu>ul>li:last-child>a){display: none;}
        .top-wrap .menu>ul.on{width: 100%; overflow-y: scroll;}
        .top-wrap .menu>ul::-webkit-scrollbar{display: none;}
        .top-wrap .menu>ul.on li{opacity: 1;}
        .top-wrap .menu>ul>li ul{position: relative; opacity: 1; top: 10px; font-size: 17px; display: none; color: #000000; text-align: left; padding-left: 20px;}

        .top-wrap .menu>ul>li ul li{margin: 2vh 0;}
        .top-wrap .menu-m>div{cursor: pointer; z-index: 1;}
        .top-wrap .menu-m>div.on span{width: 40px; left: 5px; background: var(--pt01);}
        .top-wrap .menu-m>div.on span:nth-of-type(1){transform: rotate(135deg); top: 7px;}
        .top-wrap .menu-m>div.on span:nth-of-type(2){display: none;}
        .top-wrap .menu-m>div.on span:nth-of-type(3){transform: rotate(-135deg);}
        .top-wrap .menu-m{display: flex; flex-direction: column; justify-content: center; align-items: flex-end; width: 95%; height: 70px; transition: height .5s;}
        .top-wrap .menu-m>div span{display: block; width: 30px; height: 2px; margin: 6px 0; background: #ffffff; transition: transform .5s;}
        .top-wrap .call{display: none;}
        .top-wrap .logo{z-index: 1; margin-left: 5%;}
        .top-wrap .logo img{width: 150px;}
        .top-wrap.on .menu{height: 70px;}
        .top-wrap.on .menu-m{height: 70px;}
        .top-wrap.on .menu ul{top: 0;} 
        .top-wrap.on .menu>ul>li ul{top: 10px;}

        .sub-cont .inner > img{width: 100%;}
        .sub-table table{font-size: 16px;}
        .sub-cont .info-table{flex-direction: column; margin-top: 80px;}
        .sub-cont .info-table table{width: 100%;}
        .sub-cont .info-table table th{width: 100px; height: 65px;}
        .sub-cont .info-table table:nth-of-type(2) tr:first-child th, .sub-cont .info-table table:nth-of-type(2) tr:first-child td{border: 0;}
        .sub-cont .info-table table th, .sub-cont .info-table table td{padding-left: 5px;}
        .sub-cont .info-table table td{padding-left: 20px;}


        .layout-table > p{font-size: 25px;}
        .sub-cont.layout table{width: 100%; margin-bottom: 20px;}
        .sub-cont.layout table:last-child{margin-bottom: 0;}
        
        .layout .layout_img{margin: 100px 0 0 0;}
        .layout .layout_img li{flex-direction: column; margin-top: 50px;}
        .layout .layout_img li img{width: 100%;}
        .layout .layout_img li:first-child{margin-top: 0;}
        .layout .layout_img li .layout_tx{margin-top: 15px;}
        .layout .layout_img li:nth-of-type(even){flex-direction: column-reverse; align-items: normal; top: 0;}
        .layout .layout_img li:nth-of-type(odd) .layout_tx{margin-left: 0;}
        .layout .layout_img li:nth-of-type(even) .layout_tx{margin-right: 0;}
        .layout .layout_img li b{font-size: 22px;}
        .layout .layout_img li p{font-size: 16px; margin-top: 5px;}


        .schedule .inner img.pc-img{display: none;}
        .schedule .inner img.m-img{display:block; width: 100%;}

        .environment .inner ul{flex-direction: column;}
        .environment .inner ul li{width: 100%; transition-delay: 0s !important;}
        .environment .inner ul li img{width: 100%;}
        .environment .inner ul li:nth-of-type(n+3){margin-bottom: 20px;}
        .environment .inner ul li:last-child{margin-bottom: 0;}

        .sub-cont.premium .inner ul{margin-top: 50px;}
        .sub-cont.premium .inner ul li{width: 100%; transition-delay: 0s !important;}
        .sub-cont.premium .inner ul li:nth-of-type(n+5){margin-bottom: 50px;}
        .sub-cont.premium .inner ul li:last-child{margin-bottom: 0;}
        .sub-cont.premium .inner ul li img{width: 100%;}
        .sub-cont.premium .inner ul li b{font-size: 22px;}
        .sub-cont.premium .inner ul li p{font-size: 16px;}

        .community .inner > div{height: 200px;}
        .community .inner > ul li{width: 100%; margin-bottom: 50px;}
        .community .inner > ul li:last-child{margin-bottom: 0;}
        .community .inner ul li b{font-size: 22px;}
        .community .inner ul li p{font-size: 16px;}


        
        .unit .unit-slide .swiper-slide img{width: 100%;}
        .unit .unit-slide .swiper-slide ul{margin: 50px 0;}
        .unit .unit-slide .swiper-slide ul li{width: 100%;}
        .unit .unit_btn{top: 490px; width: 110px;}
        .unit .unit_btn p{padding: 10px 0; font-size: 13px;}
        .unit .unit-slide .swiper-slide ul li{font-size: 16px;}
        .unit .swiper-pagination3{top: 70px !important; padding-top: 30px; height: 100px;}

        .unit .swiper-pagination-bullet span{font-size: 22px;}
        .unit .unit-slide .swiper-slide ul li p:nth-of-type(1){width: 31%;}
        .unit .unit-slide .swiper-slide ul li p:nth-of-type(2){width: 69%; padding-left: 30px;}

        .vr_view iframe{height: 400px;}

        .schedule-table table th{width: 100px;}
        .schedule-table table th, .schedule-table table td{padding-left: 0;}

        .qna .inner ul li{width: 100%;}
        .qna .inner ul li img{width: 100%;}
        .qna .qna-table table td{padding-left: 6px;}


        .location .map_wrap{flex-direction: column;}
        .location .main7_map{width: 100%;}
        .btn_wrap{flex-direction: column; align-items: flex-start;}
        .location .main7_map .tx{margin-bottom: 10px;}
        .location .main7_map .map_1{height: 250px;}
        .location .map_wrap > div:nth-of-type(2){margin-top: 70px;}

        .register .input_s{width: 100%; flex-direction: column;}
        .register .input_s > div{width: 100%; margin-bottom: 0;}
        .register .input_s input{height: 70px; margin-bottom: 10px;}
        .register .input_s .agree{height: 150px;}
        .register .contact_btn{width: 100%;}

        .quick{width: 100%; left: 50%; transform: translateX(-50%); right: 0; top: auto; bottom: 0;}
        .quick.on{top: auto;}
        .quick-pc{display: none;}
        .quick-m{display: flex; width: 100%; height: 80px; background: var(--pt01); font-size: 1.2rem; z-index: 999;}
        .quick-m li{display: flex; flex-direction: column; align-items: center; justify-content: center; width: calc(100% / 3); text-align: center; border-left: 1px solid #ffffff3f; color: #ffffff; font-weight: 400; font-size: 14px;}
        .quick-m li:first-child{border-left: 0;}
        .quick-m li img{width: 23px; margin-bottom: 8px;}
        .quick-m li:nth-of-type(2) img{width: 35px;}
        .quick-m li:nth-of-type(3) img{width: 26px;}

        /* popup */
        .divpop_yb{position:fixed; top: 250px; right: auto; width: 95%;  left: 50%; transform: translateX(-50%); top: 130px; opacity: 0; animation: fadeInD2 1s ease-in-out both; z-index: 990; font-size: 0;}

        .divpop_yb>img{width: 100%;}
        @keyframes fadeInD2 {
          from {opacity: 0; margin-top: -60px;}
          to {opacity: 1; margin-top: 0;}
        } 
        .close_yb{position: absolute; display: block; width: 50px; height: 50px; top:-50px; right:0; background:#000000c7; cursor: pointer;}
        .close_yb span{position: absolute; width: 40px; height:2px; background: #fff; display: block; left: 50%; top: 50%;}
        .close_yb span:nth-of-type(1){transform: translate(-50%, -50%) rotate(135deg);}
        .close_yb span:nth-of-type(2){transform: translate(-50%, -50%) rotate(-135deg);}
        /* popup */


        .footer{padding-left: 0; font-size: 11px; line-height: 1.7; padding-bottom: 80px; height: 560px; min-width: auto;}
        .footer .inner{display: flex; flex-direction: column; text-wrap: nowrap;}
        .footer .inner::before{content: ""; width: 100%; height: 50px; margin-bottom: 25px; background: url(../images/logo_w.png) 0 0 / 160px no-repeat; border-bottom: 1px solid #ffffff;}
        .footer .footer-yourbiz{order: 1;}
        .footer .footer-yourbiz i{display: block; padding-left: 50px; line-height: 0;}
        .footer .footer-yourbiz i:nth-of-type(1){margin-top: 11px;}
        .footer .footer-tx{order: 2; font-size: 11px; margin-top: 10px;}
        .footer .footer-tx div{height: 40px;}
        .footer .footer-tx div:last-child{height: auto;}
        .footer .footer-tx i{display: block; padding-left: 9px;}
        .footer .footer-copy{order: 3;}
        .footer .footer-logo{flex-direction: column; align-items: flex-start; font-size: 14px; order: 4; border: 0; margin-top: 10px;}
        .footer .footer-logo > img{display: none;}
        .footer .footer-logo ul li{margin-right: 20px;}
        .footer .footer-logo ul li b{font-size: 17px;}
        .footer .footer-logo ul li p{margin-right: 10px;}
        

    }
    
    @media(max-width:800px){
        
        html{font-size: 11px;}
        .inner{max-width: 420px;}
        
        .tit{margin-bottom: 50px;}

        
        #top-slide .swiper-wrapper{flex-direction: column;}

        .sub-cont.brand .inner > div > img:nth-of-type(1){max-width: 210px; left: -11px;}
        .sub-cont.brand .inner > div > img:nth-of-type(2){width: 70%;}
        .sub-cont.brand .inner > div{padding: 35px 0 50px 0;}
        .sub-cont.brand .inner > div img:last-child{max-width: 170px;}
        .sub-cont.brand .inner > div div p{font-size: 16px;}


        

    }