/* font */
@font-face {
    font-family: 'Eulyoo1945';
    src: url('/font/Eulyoo1945-Regular.woff2') format('woff2'),
            url('/font/Eulyoo1945-Regular.woff') format('woff'),
            url('/font/Eulyoo1945-Regular.eot'); /* IE9 호환 */
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Eulyoo1945';
    src: url('/font/Eulyoo1945-SemiBold.woff2') format('woff2'),
            url('/font/Eulyoo1945-SemiBold.woff') format('woff'),
            url('/font/Eulyoo1945-SemiBold.eot');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}

/* 공통 */
:root {
    --font-euly : 'Eulyoo1945';
    --font-stix : "STIX Two Text", serif;
    --font-wix : "Wix Madefor Display", sans-serif;
    --font-pop : "Poppins";
    --color1 : #222;
    --color2 : #B18247;
    --background1 : #FAF7EF;
    --background2 : #F3EFE6;
}
body {background: var(--background1);}

p, dd{word-break:keep-all;}
.pc{display:block !important;}
.mob{display:none !important;}
.inner{max-width:1600px; margin:0 auto; width: 100%;}

.flex {display: flex; align-items: center;}
.flex-jb {display: flex; align-items: center; justify-content: space-between;}
.flex-jc {display: flex; align-items: center; justify-content: center;}

.ta-c {text-align: center;}

.mt40 {margin-top: 40px;}
.mt60 {margin-top: 60px;}
.mt80 {margin-top: 80px;}
.mt100 {margin-top: 100px;}

.w100 {width: 100%; overflow: hidden;}


/* HEADER */
.header {position: fixed; top: 0; left: 0; width: 100%; height: 80px; z-index: 100; transition: all .3s; border-bottom: 1px solid #B1824733; background: #FAF7EF4D;}
.fp-scroll-mac:not(.fp-viewing-sec01) .header,
.header.scroll {background: #FAF7EFCC;}
.header * {color: var(--color1); font-size: 16px; font-weight: 600; letter-spacing: -.8px;}
.header .inner {height: 100%;}
.header h1 a {font-size: 28px; font-weight: 400; font-family: var(--font-euly); letter-spacing: -2px;}
.header .gnb a {position: relative; transition: all .3s;}
.header .gnb a::after {content: ""; width: 5px; height: 5px; border-radius: 100%; background: var(--color2); position: absolute; left: 50%; transform: translateX(-50%); top: -11.5px; opacity: 0; transition: all .3s;}
.header .gnb {gap: 50px;}
.header .gnb a:hover {color: var(--color2); font-weight: 600;}
.header .gnb a:hover::after {opacity: 1;}

/* FOOTER */
.footer {border-top: 1px solid #B1824733; padding: 30px 0 35px; height: 110px !important;}
.footer .left {display: flex; gap: 73px;}
.footer h1 a {font-size: 28px; font-weight: 400; color: var(--color1); letter-spacing: -2px; font-family: var(--font-euly);}
.footer .info p {display: flex; align-items: center; gap: 20px; font-size: 14px;}
.footer .info p span {display: inline-flex; align-items: center; gap: 14px; font-weight: 400; letter-spacing: -.4px; color: #6D6D6D;}
.footer .info p strong {font-weight: 600; color: var(--color1);}
.footer .info p + p {margin-top: 5px;}
.footer .use {display: flex; align-items: center; justify-content: flex-end; gap: 15px;}
.footer .use * {font-size: 14px; color: #000; opacity: .5; letter-spacing: -.5px; font-weight: 400; cursor: pointer;}
.footer .use strong {font-weight: 600;}
.footer .copy {margin-top: 4px; font-size: 14px; font-weight: 400; letter-spacing: -.5px; color: #000; opacity: .5;}

/* SIDE QUICK */
.quickSide {position: fixed; right: 32px; bottom: 50px; z-index: 99; display: flex; flex-direction: column; align-items: center;}
.quickSide > ul > li {display: block; box-shadow: 0px 8px 24px 0px #959DA533; border-radius: 100%; width: 60px; height: 60px; border-radius: 100%; background: var(--color1);}
.quickSide > ul > li + li {margin-top: 10px;}
.quickSide > ul > li a {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%;}
.quickSide > ul li a img {width: 23px;}
.quickSide > ul li.top_btn a img {width: 15px;}


/********** main **********/
/***** common *****/
/* menu */
#menu{position:fixed; top: 50%; transform: translateY(-50%); left:40px; z-index: 99;}
#menu ul li + li {margin-top: 20px;}
#menu ul li span {display: block; width: 8px; height: 8px; border-radius: 100%; border: 1px solid var(--color1); transition: all .3s;}
#menu ul li a {display: inline-flex; align-items: center; gap: 10px;}
#menu ul li .txt {font-size: 14px; visibility: hidden; font-weight: 500; color: var(--color1); letter-spacing: -.6px; line-height: 1.4; transition: opacity .3s; opacity: 0;}
#menu ul li:hover .txt,
#menu ul li.active .txt {visibility: visible; opacity: 1;}
#menu ul li:hover span,
#menu ul li.active span {background: var(--color1);}
.fp-watermark {display: none;}
.fp-table,
.fp-overflow {height: 100%;}
.fp-overflow {display: flex; align-items: center;}
/* sub_tit */
.sub_tit {text-align: center;}
.sub_tit em {font-size: 16px; font-weight: 700; color: var(--color1); letter-spacing: -.6px; font-family: var(--font-wix);}
.sub_tit h2 {margin-top: 15px; font-size: 40px; font-weight: 300; color: var(--color1); letter-spacing: -2px;}
.sub_tit h2 strong {font-weight: 600;}
.sub_tit p {margin-top: 15px; font-size: 20px; font-weight: 400; color: #6D6D6D; letter-spacing: -1px;}
/* animation */
[ani="up"] {opacity: 0; transform: translateY(40px); transition: all 1s 0.5s;}
.section.active [ani="up"] {opacity: 1; transform: translateY(0);}

[ani="right"] {opacity: 0; transform: translateX(-50%); transition-property: opacity ,transform; transition-timing-function: cubic-bezier(0.01, 0.08, 0.49, 0.95); transition-duration: 1s;}
.section.active [ani="right"] {opacity: 1; transform: translateX(0);}

.section [ani-delay="1000"] {transition-delay: 1000ms;}
.section [ani-delay="1500"] {transition-delay: 1500ms;}

/* visual */
.visual {position: relative; height: 100%; overflow: hidden;}
.visual .wrapper,
.visual .slick-list,
.visual .slick-track {height: 100%;}
.visual .item {width: 100%; height: 100%; overflow: hidden; position: relative;}
.visual .item img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
.visual .item .txt {position: absolute; bottom: 204px; left: 50%; transform: translateX(-50%);}
.visual .item .txt em {font-size: 16px; font-weight: 700; letter-spacing: -0.6px; font-family: var(--font-wix); line-height: 1; color: var(--color1);}
.visual .item .txt h2 {margin-top: 15px; font-size: 55px; font-weight: 200; letter-spacing: -2px; line-height: 1.2; color: var(--color1);}
.visual .item .txt h2 b {font-weight: 600;}
.visual .item .txt p {margin-top: 15px; font-size: 20px; font-weight: 400; color: #6D6D6D; letter-spacing: -1px; line-height: 1.3;}
.visual .bot {position: absolute; left: 50%; transform: translateX(-50%); bottom: 115px; z-index: 1; display: flex; align-items: center; gap: 0 15px;}
.visual .bot .arrow_cont {display: flex; align-items: center; gap: 0 15px;}
.visual .bot .arrow_cont .arrow {position: relative; top: auto; right: auto; bottom: auto; left: auto; margin: 0; cursor: pointer;}
.visual .bot .arrow_cont .arrow::after {display: none;}
.visual .bot .arrow_cont .arrow img {width: 16px;}
.visual .bot .pause img {cursor: pointer; width: 25px;}
.visual .progress_box {width: 182px; height: 2px; display: flex; align-items: center; justify-content: center; position: relative;}
.visual .slide-progress {position: relative; width: 100px; height: 2px; background-color: rgba(0, 0, 0, 0.3);}
.visual .slide-progress .progress-fill {position: absolute; top: 0; left: 0; width: 0; height: 100%; background-color: #000;}
.visual .slide-count {position: absolute; top: 0; left: 0; width: 100%; height: 100%; display: flex; align-items: center; justify-content: space-between; font-size: 0;}
.visual .slide-count span {font-size: 14px; font-weight: 700; color: #000; letter-spacing: -.8px;}

/* section01 */
.section01 {position: relative;}
.section01::after {content: ""; background: url('/img/main/sec01_bgTxt.png') no-repeat center/contain; width: 100%; height: 138px; position: absolute; left: 0; bottom: 0;}
.section01 .cont {display: flex;}
.section01 .cont > div {width: 50%;}
.section01 .txt h3 {font-size: 32px; font-weight: 600; color: var(--color1); font-family: var(--font-wix); letter-spacing: -1.4px;}
.section01 .info {margin-top: 50px; padding-top: 60px; border-top: 1px solid var(--color1); display: flex; gap: 120px;}
.section01 .flex {display: flex; align-items: flex-end; gap: 10px; font-size: 16px; font-weight: 400; letter-spacing: -.4px; color: #444;}
.section01 .flex strong {font-size: 40px; font-weight: 600; color: var(--color1);}
.section01 .name p {margin-top: 10px; font-size: 14px; font-weight: 700; color: #444; letter-spacing: -.4px; line-height: 1.4;}
.section01 .his > strong {display: block; font-size: 18px; font-weight: 600; color: var(--color1); letter-spacing: -.8px; line-height: 1.3; font-family: var(--font-wix);}
.section01 .his ul {margin-top: 20px;}
.section01 .his li {font-size: 16px; font-weight: 400; color: #444; letter-spacing: -.5px; line-height: 1.3; padding-left: 10px; text-indent: -10px;}
.section01 .his li + li {margin-top: 5px;}
.section01 .his li span {color: #999;}
.section01 .his li strong {font-weight: 600;}
.section01 .img {padding-left: 32px;}
.section01 .img img {width: 100%;}
/* section02 */
.section02 {background: url('/img/main/sec02_bg.jpg') no-repeat center/cover;}
.section02 .txt {display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 40px; width: 100%; text-align: center;}
.section02 .line {display: block; width: 1px; height: 35px; background: var(--color1); transform: rotate(30deg);}
.section02 p {font-size: 20px; font-weight: 400; color: #6D6D6D; letter-spacing: -1px;}
.section02 p + p {margin-top: 50px;}
/* section03 */
.section03 {position: relative; background: var(--background2);}
.section03::after {content: ""; background: url('/img/main/sec01_bgTxt.png') no-repeat center/contain; width: 100%; height: 138px; position: absolute; left: 0; bottom: 0;}
.section03 ul {display: flex; align-items: center; justify-content: center; overflow: hidden;}
.section03 ul li {width: 400px; height: 392px; display: flex; align-items: center; justify-content: center; flex-direction: column; position: relative;}
.section03 ul li + li {margin-left: -20px;}
.section03 ul li:nth-child(2) {transition-delay: 1s;}
.section03 ul li:nth-child(3) {transition-delay: 1.2s;}
.section03 ul li:nth-child(4) {transition-delay: 1.4s;}
.section03 ul li svg {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 100%; height: 100%;}
.section03 ul li svg.hover {transform: translate(-50%,-50%) scale(0); transition: all .6s;}
.section03 ul li .img {display: flex; align-items: center; justify-content: center; height: 80px; position: relative;}
.section03 ul li .img img {height: 100%; width: auto; transition: all .5s;}
.section03 ul li .img img.hover {opacity: 0;}
.section03 ul li .img img.hover,
.section03 ul li .img img.basic {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%);}
.section03 ul li {font-weight: 400; letter-spacing: -.6px; color: var(--color1);}
.section03 ul li div {text-align: center; position: relative; z-index: 1;}
.section03 ul li p {margin-top: 30px; font-size: 32px; transition: all .3s;}
.section03 ul li em {margin-top: 10px; font-size: 18px; font-family: var(--font-wix); transition: all .3s;}
.section03 ul li:hover svg.hover {transform: translate(-50%,-50%) scale(1);}
.section03 ul li:hover p,
.section03 ul li:hover em {color: #fff;}
.section03 ul li:hover .img img.hover {opacity: 1;}
.section03 ul li:hover .img img.basic {opacity: 0;}
/* section04 */
#cursor_div{position: fixed; left: 0; top: 0; pointer-events: none; z-index:1000;}
.cursor{display:flex; justify-content:center; align-items:center; gap: 4px; width: 0px; height: 0px; border-radius:50%; background:#fff; transition:all 0.3s; transform: translate(-50%, -50%);}
.cursor span{font-size: 0; font-weight: 500; letter-spacing: -0.8px; color:#000; transition:all 0.3s; font-family: var(--font-pop);}
.cursor img{width:0; transition:all 0.3s;}
.cursor.on{width: 130px; height: 130px;}
.cursor.on span{font-size: 18px;}
.cursor.on img{width:16px;}
.section04 .cont {width: 100%; overflow: hidden;}
.section04 .inner {position: relative;}
.section04 .arrowBox {display: flex; align-items: center; gap: 10px; justify-content: flex-end; margin-top: -40px;}
.section04 .arrowBox .arrow {position: relative; top: auto; right: auto; bottom: auto; left: auto; margin: 0; display: flex; align-items: center; justify-content: center; width: 55px; height: 55px; border-radius: 100%; border: 1px solid var(--color1);  transition: all .3s;}
.section04 .arrowBox .arrow::after {display: none;}
.section04 .arrowBox .arrow img {width: 20px; transition: all .3s;}
.section04 .arrowBox .arrow:hover {background: var(--color1);}
.section04 .arrowBox .arrow:hover img {filter: brightness(0) invert(1); transition: all .5s;}
.section04 .swiper {margin-top: 40px;}
.section04 .swiper-slide {position: relative; width: 440px;; margin-right: 30px;}
.section04 .swiper-slide img {width: 100%; filter: grayscale(1);}
.section04 .swiper-slide .txt {position: absolute; left: 0; padding: 0 40px; bottom: 17px; color: #fff; z-index: 1;}
.section04 .swiper-slide strong {margin-bottom: 15px; font-size: 28px; font-weight: 600; letter-spacing: -2px; display: block;}
.section04 .swiper-slide p {font-size: 18px; font-weight: 300; letter-spacing: -0.8px; line-height: 1.22; overflow: hidden; max-height: 0; margin-top: 0; transition: max-height .6s ease; transition: margin-bottom .3s ease;}
.section04 .swiper-slide:hover img {filter: none;}
.section04 .swiper-slide:hover p {max-height: 200px; margin-bottom: 13px;}
/* section05 */
.section05 {background: #F3EFE6 url('/img/main/sec05_bg.png') no-repeat center/cover; overflow-y: auto !important; height: 100vh; position: relative }
.section05 .inner {overflow: hidden;}
.section05 .cont {position: relative; display: flex; justify-content: space-between; height: 430px;}
.section05 .cont .titBox {position: relative; z-index: 1; padding-top: 64px; padding-left: 155px;}
.section05 .cont .titBox * {transition: all 1s 0.2s; transform: translateX(-40px); opacity: 0;}
.section05 .cont .num {font-size: 70px; font-family: var(--font-euly); font-weight: 600; letter-spacing: -2px; color: var(--color1);}
.section05 .cont .tit {font-size: 40px; font-weight: 700; letter-spacing: -3px; color: var(--color1);}
.section05 .cont .img {width: 700px; height: 430px; border-radius: 300px; overflow: hidden; position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); /* opacity: 0; transition: all 1s 0.2s; */}
.section05 .cont .img span {display: block; width: 100%; height: 100%; clip-path: polygon(0 0, 100% 0, 100% 0%, 0 0%); transition: all 1s 0.2s;}
.section05 .cont .img img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
.section05 .cont .info {transition: all 1s 0.2s; transform: translateX(40px); opacity: 0; display: flex; align-items: flex-end; padding-bottom: 88px; padding-left: 50px; width: calc(50% - 350px); font-size: 20px; font-weight: 400; letter-spacing: -1px;}
.section05 .swiper-slide.swiper-slide-active .titBox * {transform: translateX(0);}
.section05 .swiper-slide.swiper-slide-active .num {opacity: .1;}
.section05 .swiper-slide.swiper-slide-active .tit {transition-delay: .5s; opacity: 1;}
.section05 .swiper-slide.swiper-slide-active .info {transform: translateX(0); opacity: 1;}
.section05 .swiper-slide.swiper-slide-active .img span {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
/* section06 */
.section06 {position: relative;}
.section06::after {content: "MIPLANTE MEDICAL · MIPLANTE MEDICAL · MIPLANTE MEDICAL · MIPLANTE MEDICAL · MIPLANTE MEDICAL"; font-size: 40px; font-weight: 500; font-family: var(--font-wix); letter-spacing: -.6px; color: #D5CEC6; width: 100%; height: 50px; position: absolute; left: 50%; transform: translateX(-50%); bottom: 35px; white-space: nowrap;}
.section06 .swiper {position: relative; margin-top: 140px;}
.section06 .swiper::before {content: ""; background: url('/img/main/sec06_bgTxt.png') no-repeat center/contain; width: 100%; height: 145px; position: absolute; left: 0; top: -80px;}
.section06 .swiper-slide {width: 700px; height: 285px; margin: 0 15px; overflow: hidden; display: flex;}
.section06 .swiper-slide div {width: 50%; position: relative;}
.section06 .swiper-slide img {width: 100%; height: 100%; object-fit: cover; object-position: center; /* filter: grayscale(1) brightness(1.4); transition: all .3s; */}
.section06 .swiper-slide span {position: absolute; bottom: 0; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 600; letter-spacing: -.6px; font-family: var(--font-wix); width: 94px; height: 32px;}
.section06 .swiper-slide div:first-child span {right: 0; background: #fff; color: #6D6D6D;}
.section06 .swiper-slide div:last-child span {left: 0; background: #C7AF8E; color: #fff;}
/* .section06 .swiper-slide:hover img {filter: none;} */
.section06 .arrowBox {display: flex; align-items: center; gap: 10px; justify-content: center; margin-top: 40px;}
.section06 .arrowBox .arrow {position: relative; top: auto; right: auto; bottom: auto; left: auto; margin: 0; display: flex; align-items: center; justify-content: center; width: 55px; height: 55px; border-radius: 100%; border: 1px solid var(--color1);  transition: all .3s;}
.section06 .arrowBox .arrow::after {display: none;}
.section06 .arrowBox .arrow img {width: 20px; transition: all .3s;}
.section06 .arrowBox .arrow:hover {background: var(--color1);}
.section06 .arrowBox .arrow:hover img {filter: brightness(0) invert(1); transition: all .5s;}
.no_data {margin-top: 40px !important; text-align: center; padding: 194px 0 178px; border-top: 2px solid #000; border-bottom: 1px solid #000;}
.no_data img {width: 38px;}
.no_data p {font-size: 20px; font-weight: 500; margin-top: 28px;}
/* section07 */
.section07 {position: relative; background: var(--background2);}
.section07::before {content: ""; background: url(/img/main/sec07_bgTxt.svg) no-repeat center / contain; width: 100%; height: 145px; position: absolute; left: 0; top: 45%;}
.section07 .top {align-items: flex-start;}
.section07 .sub_tit {text-align: left;}
.section07 .tab {padding-top: 20px; display: flex; align-items: center;}
.section07 .tab li {font-size: 18px; font-weight: 500; color: #8E8E8E; letter-spacing: -1px; display: flex; align-items: center; justify-content: center; cursor: pointer; width: 160px; height: 58px; border-bottom: 1px solid #ACACAC4D;}
.section07 .tab li.on {color: #000; border-bottom: 2px solid #000;}
.section07 .tabCont {margin-top: 20px;}
.section07 .cont {display: none;}
.section07 .cont.on {display: flex; align-items: flex-end; justify-content: space-between;}
.section07 .contTit h2 {font-size: 36px; font-weight: 400; color: var(--color1); letter-spacing: -2px;}
.section07 .contTit p {margin-top: 12px; font-size: 16px; font-weight: 700; color: #6D6D6D; letter-spacing: -0.6px; font-family: var(--font-wix);}
.section07 .arrowBox {display: flex; align-items: center; gap: 10px; margin-top: 40px;}
.section07 .arrowBox .arrow {position: relative; top: auto; right: auto; bottom: auto; left: auto; margin: 0; display: flex; align-items: center; justify-content: center; width: 55px; height: 55px; border-radius: 100%; border: 1px solid var(--color1);  transition: all .3s;}
.section07 .arrowBox .arrow::after {display: none;}
.section07 .arrowBox .arrow img {width: 20px; transition: all .3s;}
.section07 .arrowBox .arrow:hover {background: var(--color1);}
.section07 .arrowBox .arrow:hover img {filter: brightness(0) invert(1); transition: all .5s;}
.section07 .swiper {width: 1200px; height: 550px; overflow: hidden;}
.section07 .swiper-slide div {height: 100%;}
.section07 .swiper img {width: 100%; height: 100%; object-fit: cover; object-position: center;}
/* section08 */
.section08 .cont {margin-top: 60px; display: flex; align-items: center; gap: 59px;}
.root_daum_roughmap .map_border,
.root_daum_roughmap .wrap_controllers,
.section08 .root_daum_roughmap .cont .section.lst {display: none;}
.section08 .mapCont {width: 860px; height: 480px;}
.section08 .root_daum_roughmap_landing {width: 100% !important;}
.section08 .root_daum_roughmap_landing,
.section08 .root_daum_roughmap .wrap_map {height: 100% !important;}
.section08 .info {width: calc(100% - 860px - 59px);}
.section08 .info .box {padding: 40px 0;}
.section08 .info .box:first-child {padding-top: 0;}
.section08 .info .box:last-child {padding-bottom: 0;}
.section08 .info .box + .box {border-top: 1px solid #E3E3E3;}
.section08 .info .tit {font-size: 18px; font-weight: 500; color: var(--color1); letter-spacing: -.8px;}
.section08 .addr p {margin-top: 24px; font-size: 20px; font-weight: 500; color: var(--color1); letter-spacing: -1px; line-height: 1.4;}
.section08 .addr .btn {margin-top: 30px; display: flex; align-items: center; gap: 15px; height: auto; line-height: normal; padding: 0;}
.section08 .addr .btn * {display: flex; align-items: center; justify-content: center;}
.section08 .addr .btn a {width: 147px; height: 46px; font-size: 16px; font-weight: 700; letter-spacing: -1px; gap: 10px; border-radius: 50px;}
.section08 .addr .btn a img {width: 15px;}
.section08 .addr .btn a.kakao {background: var(--color1); color: #fff; border: 1px solid var(--color1);}
.section08 .addr .btn a.naver {color: #1C1C1C; border: 1px solid #6D6D6D;}
.section08 .addr .btn .copy {width: 46px; height: 46px; border-radius: 100%; border: 1px solid #6D6D6D; cursor: pointer;}
.section08 .addr .btn .copy img {width: 22px;}
.section08 .box:not(.addr) {display: flex; align-items: baseline; gap: 100px;}
.section08 .tell {align-items: center !important;}
.section08 .tell h4 {font-size: 28px; font-weight: 700; letter-spacing: -.6px; color: var(--color1); font-family: var(--font-wix); line-height: 1.2;}
.section08 .time p {display: flex; align-items: center; gap: 30px;}
.section08 .time p + p {margin-top: 10px;}
.section08 .time span {display: block; width: 130px; font-size: 16px; font-weight: 400; letter-spacing: -.6px; color: var(--color1);}
.section08 .time em {font-size: 14px;}
.section08 .time strong {font-size: 18px; font-weight: 700; letter-spacing: -0.8px; color: var(--color1); font-family: var(--font-wix);}
.section08 .time ul {margin-top: 10px; font-size: 16px; font-weight: 400; letter-spacing: -.6px; color: #6D6D6D;}

/* use popup */
.use_pop {position: fixed; top: 0; left: 0; width: 100%; height: 100vh; z-index: 100; display: none;}
.use_pop .pop_bg {width: 100%; height: 100%; background: rgba(0, 0, 0, 0.60);}
.use_pop .pop_inner {position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: 550px; height: 440px; background: var(--background1); padding: 50px 30px 40px 35px;}
.use_pop .pop_tit {text-align: center; padding-bottom: 21px; width: calc(100% - 23px); border-bottom: 1px solid #000;}
.use_pop .pop_tit > div {position: relative;}
.use_pop .pop_tit .tit {font-size: 20px; font-weight: 500; color: var(--color1); line-height: 1.2;}
.use_pop .pop_close {position: absolute; top: 50%; transform: translateY(-50%); right: 0;}
.use_pop .pop_close img {cursor: pointer; width: 20px;}
.use_pop .pop_cont {height: 80%;}
.use_pop .use_wrap {overflow: hidden; overflow-y: auto; height: 100%; padding-right: 23px; margin-top: 25px;}
.use_pop .use_wrap::-webkit-scrollbar {width: 2px;}
.use_pop .use_wrap::-webkit-scrollbar-thumb {background: #888; border-radius: 10px;}
.use_pop .use_wrap::-webkit-scrollbar-track {background: #DDD;}
.use_pop .use_wrap .headline {margin-bottom: 10px;}
.use_pop .use_wrap .tag-box p,
.use_pop .use_wrap .headline h5 {font-size: 14px; font-weight: 700; color: var(--color1);}
.use_pop .use_wrap ol {padding: 0; margin: 0;}
.use_pop .use_wrap ol * {font-size: 13px; font-weight: 400; color: #8E8E8E; letter-spacing: -.3px; line-height: 1.3;}
.use_pop .use_wrap .margin-top-30 {margin-top: 30px;}


@media screen and (max-width:1640px){
    /* 공통 */
    .inner{max-width: 92.12vw;}

    .mt40 {margin-top: 2.44vw;}
    .mt60 {margin-top: 3.66vw;}
    .mt80 {margin-top: 4.88vw;}
    .mt100 {margin-top: 6.10vw;}

    /* HEADER */
    .header {height: 4.88vw;}
    .header * {font-size: 0.98vw; letter-spacing: -0.05vw;}
    .header h1 a {font-size: 1.71vw; letter-spacing: -0.12vw;}
    .header .gnb a::after {width: 0.30vw; height: 0.30vw; top: -0.70vw;}
    .header .gnb {gap: 3.05vw;}

    /* FOOTER */
    .footer {padding: 1.83vw 0 2.13vw; height: 6.71vw !important;}
    .footer .left {gap: 4.45vw;}
    .footer h1 a {font-size: 1.71vw; letter-spacing: -0.12vw;}
    .footer .info p {gap: 1.22vw; font-size: 0.85vw;}
    .footer .info p span {gap: 0.85vw; letter-spacing: -0.02vw;}
    .footer .info p + p {margin-top: 0.30vw;}
    .footer .use {gap: 0.91vw;}
    .footer .use * {font-size: 0.85vw; letter-spacing: -0.03vw;}
    .footer .copy {margin-top: 0.24vw; font-size: 0.85vw; letter-spacing: -0.03vw;}

    /* SIDE QUICK */
    .quickSide {right: 1.95vw; bottom: 8.05vw;}
    .quickSide > ul > li {box-shadow: 0.00vw 0.49vw 1.46vw 0.00vw #959DA533; width: 3.66vw; height: 3.66vw;}
    .quickSide > ul > li + li {margin-top: 0.61vw;}
    .quickSide > ul li a img {width: 1.40vw;}
    .quickSide > ul li.top_btn a img {width: 0.91vw;}


    /********** main **********/
    /***** common *****/
    /* menu */
    #menu {left:1.3vw;}
    #menu ul li + li {margin-top: 1.22vw;}
    #menu ul li span {width: 0.49vw; height: 0.49vw;}
    #menu ul li a {gap: 0.61vw;}
    #menu ul li .txt {font-size: 0.85vw; letter-spacing: -0.04vw;}
    /* sub_tit */
    .sub_tit em {font-size: 0.98vw; letter-spacing: -0.04vw;}
    .sub_tit h2 {margin-top: 0.91vw; font-size: 2.44vw; letter-spacing: -0.12vw;}
    .sub_tit p {margin-top: 0.91vw; font-size: 1.22vw; letter-spacing: -0.06vw;}
    /* animation */
    [ani="up"] {transform: translateY(2.44vw);}



    /* visual */
    .visual .item .txt {bottom: 12.44vw;}
    .visual .item .txt em {font-size: 0.98vw; letter-spacing: -0.04vw;}
    .visual .item .txt h2 {margin-top: 0.91vw; font-size: 3.35vw; letter-spacing: -0.12vw;}
    .visual .item .txt p {margin-top: 0.91vw; font-size: 1.22vw; letter-spacing: -0.06vw;}
    .visual .bot { bottom: 7.01vw; gap: 0 0.91vw;}
    .visual .bot .arrow_cont {gap: 0 0.91vw;}
    .visual .bot .arrow_cont .arrow img {width: 0.98vw;}
    .visual .bot .pause img {width: 1.52vw;}
    .visual .progress_box {width: 11.10vw; height: 0.12vw;}
    .visual .slide-progress {width: 6.10vw; height: 0.12vw;}
    .visual .slide-count span {font-size: 0.85vw; letter-spacing: -0.05vw;}

    /* section01 */
    .section01::after {height: 8.41vw;}
    .section01 .txt h3 {font-size: 1.95vw; letter-spacing: -0.09vw;}
    .section01 .info {margin-top: 3.05vw; padding-top: 3.66vw; gap: 7.32vw;}
    .section01 .flex {gap: 0.61vw; font-size: 0.98vw; letter-spacing: -0.02vw;}
    .section01 .flex strong {font-size: 2.44vw;}
    .section01 .name p {margin-top: 0.61vw; font-size: 0.85vw; letter-spacing: -0.02vw;}
    .section01 .his > strong {font-size: 1.10vw; letter-spacing: -0.05vw;}
    .section01 .his ul {margin-top: 1.22vw;}
    .section01 .his li {font-size: 0.98vw; letter-spacing: -0.03vw; padding-left: 0.61vw; text-indent: -0.61vw;}
    .section01 .his li + li {margin-top: 0.30vw;}
    .section01 .img {padding-left: 1.95vw;}
    /* section02 */
    .section02 .txt { gap: 2.44vw;}
    .section02 .line {width: 0.06vw; height: 2.13vw;}
    .section02 p {font-size: 1.22vw; letter-spacing: -0.06vw;}
    .section02 p + p {margin-top: 3.05vw;}
    /* section03 */
    .section03::after { height: 8.41vw;}
    .section03 ul li {width: 24.39vw; height: 23.90vw;}
    .section03 ul li + li {margin-left: -1.22vw;}
    .section03 ul li:nth-child(2) {transition-delay: 1s;}
    .section03 ul li:nth-child(3) {transition-delay: 1.2s;}
    .section03 ul li:nth-child(4) {transition-delay: 1.4s;}
    .section03 ul li .img {height: 4.88vw;}
    .section03 ul li {letter-spacing: -0.04vw;}
    .section03 ul li p {margin-top: 1.83vw; font-size: 1.95vw;}
    .section03 ul li em {margin-top: 0.61vw; font-size: 1.10vw;}
    /* section04 */
    .cursor span{ letter-spacing: -0.05vw;}
    .cursor.on{width: 7.93vw; height: 7.93vw;}
    .cursor.on span{font-size: 1.10vw;}
    .cursor.on img{width:0.98vw;}
    .section04 .arrowBox {gap: 0.61vw; margin-top: -2.44vw;}
    .section04 .arrowBox .arrow { width: 3.35vw; height: 3.35vw;}
    .section04 .arrowBox .arrow img {width: 1.22vw;}
    .section04 .swiper {margin-top: 2.44vw;}
    .section04 .swiper-slide {width: 26.83vw;; margin-right: 1.83vw;}
    .section04 .swiper-slide .txt {padding: 0 2.44vw; bottom: 1.04vw;}
    .section04 .swiper-slide strong {margin-bottom: 0.91vw; font-size: 1.71vw; letter-spacing: -0.12vw;}
    .section04 .swiper-slide p {font-size: 1.10vw; letter-spacing: -0.05vw;}
    .section04 .swiper-slide:hover p {max-height: 12.20vw; margin-bottom: 0.79vw;}
    /* section05 */
    .section05 .cont {height: 26.22vw;}
    .section05 .cont .titBox {padding-top: 3.90vw; padding-left: 9.45vw;}
    .section05 .cont .titBox * {transform: translateX(-2.44vw);}
    .section05 .cont .num {font-size: 4.27vw; letter-spacing: -0.12vw;}
    .section05 .cont .tit {font-size: 2.44vw; letter-spacing: -0.18vw;}
    .section05 .cont .img {width: 42.68vw; height: 26.22vw; border-radius: 18.29vw;}
    .section05 .cont .info {transform: translateX(2.44vw); padding-bottom: 5.37vw; padding-left: 3.05vw; width: calc(50% - 21.34vw); font-size: 1.22vw; letter-spacing: -0.06vw;}
    /* section06 */
    .section06::after {font-size: 2.44vw; letter-spacing: -0.04vw; height: 3.05vw; bottom: 2.13vw;}
    .section06 .swiper {margin-top: 8.54vw;}
    .section06 .swiper::before {height: 8.84vw; top: -4.88vw;}
    .section06 .swiper-slide {width: 42.68vw; height: 17.38vw; margin: 0 0.91vw;}
    .section06 .swiper-slide span {font-size: 0.85vw; letter-spacing: -0.04vw; width: 5.73vw; height: 1.95vw;}
    .section06 .arrowBox {gap: 0.61vw; margin-top: 2.44vw;}
    .section06 .arrowBox .arrow { width: 3.35vw; height: 3.35vw;}
    .section06 .arrowBox .arrow img {width: 1.22vw;}
    .no_data {margin-top: 2.44vw !important; padding: 11.83vw 0 10.85vw;}
    .no_data img {width: 2.32vw;}
    .no_data p {font-size: 1.22vw; margin-top: 1.71vw;}
    /* section07 */
    .section07::before {height: 8.84vw;}
    .section07 .tab {padding-top: 1.22vw;}
    .section07 .tab li {font-size: 1.10vw; letter-spacing: -0.06vw; width: 9.76vw; height: 3.54vw;}
    .section07 .tabCont {margin-top: 1.22vw;}
    .section07 .contTit h2 {font-size: 2.20vw; letter-spacing: -0.12vw;}
    .section07 .contTit p {margin-top: 0.73vw; font-size: 0.98vw; letter-spacing: -0.04vw;}
    .section07 .arrowBox {gap: 0.61vw; margin-top: 2.44vw;}
    .section07 .arrowBox .arrow { width: 3.35vw; height: 3.35vw;}
    .section07 .arrowBox .arrow img {width: 1.22vw;}
    .section07 .swiper {width: 73.17vw; height: 33.54vw;}
    /* section08 */
    .section08 .cont {margin-top: 3.66vw; gap: 3.60vw;}
    .section08 .mapCont {width: 52.44vw; height: 29.27vw;}
    .section08 .info {width: calc(100% - 52.44vw - 3.60vw);}
    .section08 .info .box {padding: 2.44vw 0;}
    .section08 .info .tit {font-size: 1.10vw; letter-spacing: -0.05vw;}
    .section08 .addr p {margin-top: 1.46vw; font-size: 1.22vw; letter-spacing: -0.06vw;}
    .section08 .addr .btn {margin-top: 1.83vw; gap: 0.91vw;}
    .section08 .addr .btn a {width: 8.96vw; height: 2.80vw; font-size: 0.98vw; letter-spacing: -0.06vw; gap: 0.61vw; border-radius: 3.05vw;}
    .section08 .addr .btn a img {width: 0.91vw;}
    .section08 .addr .btn .copy {width: 2.80vw; height: 2.80vw;}
    .section08 .addr .btn .copy img {width: 1.34vw;}
    .section08 .box:not(.addr) {gap: 6.10vw;}
    .section08 .tell h4 {font-size: 1.71vw; letter-spacing: -0.04vw;}
    .section08 .time p {gap: 1.83vw;}
    .section08 .time p + p {margin-top: 0.61vw;}
    .section08 .time span {width: 7.93vw; font-size: 0.98vw; letter-spacing: -0.04vw;}
    .section08 .time em {font-size: 0.85vw;}
    .section08 .time strong {font-size: 1.10vw; letter-spacing: -0.05vw;}
    .section08 .time ul {margin-top: 0.61vw; font-size: 0.98vw; letter-spacing: -0.04vw;}

    /* use popup */
    .use_pop .pop_inner { width: 33.54vw; height: 26.83vw; padding: 3.05vw 1.83vw 2.44vw 2.13vw;}
    .use_pop .pop_tit {padding-bottom: 1.28vw; width: calc(100% - 1.40vw);}
    .use_pop .pop_tit .tit {font-size: 1.22vw;}
    .use_pop .pop_close img {width: 1.22vw;}
    .use_pop .use_wrap { padding-right: 1.40vw; margin-top: 1.52vw;}
    .use_pop .use_wrap::-webkit-scrollbar {width: 0.12vw;}
    .use_pop .use_wrap::-webkit-scrollbar-thumb {border-radius: 0.61vw;}
    .use_pop .use_wrap .headline {margin-bottom: 0.61vw;}
    .use_pop .use_wrap .tag-box p,
    .use_pop .use_wrap .headline h5 {font-size: 0.85vw;}
    .use_pop .use_wrap ol {padding: 0; margin: 0;}
    .use_pop .use_wrap ol * {font-size: 0.79vw; letter-spacing: -0.02vw;}
    .use_pop .use_wrap .margin-top-30 {margin-top: 1.83vw;}
}

@media screen and (max-width:1280px){
    /* 공통 */
    .inner{max-width: 92.75vw;}

    .mt40 {margin-top: 2.42vw;}
    .mt60 {margin-top: 3.67vw;}
    .mt80 {margin-top: 4.84vw;}
    .mt100 {margin-top: 6.09vw;}

    /* HEADER */
    .header {height: 4.84vw;}
    .header * {font-size: 1.02vw; letter-spacing: -0.08vw;}
    .header h1 a {font-size: 1.72vw; letter-spacing: -0.16vw;}
    .header .gnb a::after {width: 0.31vw; height: 0.31vw; top: -0.70vw;}
    .header .gnb {gap: 3.05vw;}

    /* FOOTER */
    .footer {padding: 1.80vw 0 2.11vw; height: 6.72vw !important;}
    .footer .left {gap: 4.45vw;}
    .footer h1 a {font-size: 1.72vw; letter-spacing: -0.16vw;}
    .footer .info p {gap: 1.25vw; font-size: 0.86vw;}
    .footer .info p span {gap: 0.86vw; letter-spacing: -0.00vw;}
    .footer .info p + p {margin-top: 0.31vw;}
    .footer .use {gap: 0.94vw;}
    .footer .use * {font-size: 0.86vw; letter-spacing: -0.00vw;}
    .footer .copy {margin-top: 0.23vw; font-size: 0.86vw; letter-spacing: -0.00vw;}

    /* SIDE QUICK */
    .quickSide {right: 1.95vw; bottom: 9.05vw;}
    .quickSide > ul > li {box-shadow: 0.00vw 0.47vw 1.48vw 0.00vw #959DA533; width: 3.67vw; height: 3.67vw;}
    .quickSide > ul > li + li {margin-top: 0.63vw;}
    .quickSide > ul li a img {width: 1.41vw;}
    .quickSide > ul li.top_btn a img {width: 0.94vw;}


    /********** main **********/
    /***** common *****/
    /* menu */
    #menu {left:1.33vw;}
    #menu ul li + li {margin-top: 1.25vw;}
    #menu ul li span {width: 0.47vw; height: 0.47vw;}
    #menu ul li a {gap: 0.63vw;}
    #menu ul li .txt {font-size: 1vw; letter-spacing: -0.08vw;}
    /* sub_tit */
    .sub_tit em {font-size: 1.02vw; letter-spacing: -0.08vw;}
    .sub_tit h2 {margin-top: 0.94vw; font-size: 2.42vw; letter-spacing: -0.16vw;}
    .sub_tit p {margin-top: 0.94vw; font-size: 1.25vw; letter-spacing: -0.08vw;}
    /* animation */
    [ani="up"] {transform: translateY(2.42vw);}



    /* visual */
    .visual .item .txt {bottom: 12.42vw;}
    .visual .item .txt em {font-size: 1.02vw; letter-spacing: -0.08vw;}
    .visual .item .txt h2 {margin-top: 0.94vw; font-size: 3.36vw; letter-spacing: -0.16vw;}
    .visual .item .txt p {margin-top: 0.94vw; font-size: 1.25vw; letter-spacing: -0.08vw;}
    .visual .bot { bottom: 7.03vw; gap: 0 0.94vw;}
    .visual .bot .arrow_cont {gap: 0 0.94vw;}
    .visual .bot .arrow_cont .arrow img {width: 1.02vw;}
    .visual .bot .pause img {width: 1.48vw;}
    .visual .progress_box {width: 11.09vw; height: 0.16vw;}
    .visual .slide-progress {width: 6.09vw; height: 0.16vw;}
    .visual .slide-count span {font-size: 0.86vw; letter-spacing: -0.08vw;}

    /* section01 */
    .section01::after {height: 8.44vw;}
    .section01 .txt h3 {font-size: 1.95vw; letter-spacing: -0.08vw;}
    .section01 .info {margin-top: 3.05vw; padding-top: 3.67vw; gap: 7.34vw;}
    .section01 .flex {gap: 0.63vw; font-size: 1.02vw; letter-spacing: -0.00vw;}
    .section01 .flex strong {font-size: 2.42vw;}
    .section01 .name p {margin-top: 0.63vw; font-size: 0.86vw; letter-spacing: -0.00vw;}
    .section01 .his > strong {font-size: 1.09vw; letter-spacing: -0.08vw;}
    .section01 .his ul {margin-top: 1.25vw;}
    .section01 .his li {font-size: 1.02vw; letter-spacing: -0.00vw; padding-left: 0.63vw; text-indent: -0.63vw;}
    .section01 .his li + li {margin-top: 0.31vw;}
    .section01 .img {padding-left: 1.95vw;}
    /* section02 */
    .section02 .txt { gap: 2.42vw;}
    .section02 .line {width: 0.08vw; height: 2.11vw;}
    .section02 p {font-size: 1.25vw; letter-spacing: -0.08vw;}
    .section02 p + p {margin-top: 3.05vw;}
    /* section03 */
    .section03::after { height: 8.44vw;}
    .section03 ul li {width: 24.38vw; height: 23.91vw;}
    .section03 ul li + li {margin-left: -1.25vw;}
    .section03 ul li:nth-child(2) {transition-delay: 1s;}
    .section03 ul li:nth-child(3) {transition-delay: 1.2s;}
    .section03 ul li:nth-child(4) {transition-delay: 1.4s;}
    .section03 ul li .img {height: 4.84vw;}
    .section03 ul li {letter-spacing: -0.08vw;}
    .section03 ul li p {margin-top: 1.80vw; font-size: 1.95vw;}
    .section03 ul li em {margin-top: 0.63vw; font-size: 1.09vw;}
    /* section04 */
    .cursor span{ letter-spacing: -0.08vw;}
    .cursor.on{width: 7.97vw; height: 7.97vw;}
    .cursor.on span{font-size: 1.09vw;}
    .cursor.on img{width:1.02vw;}
    .section04 .arrowBox {gap: 0.63vw; margin-top: -2.42vw;}
    .section04 .arrowBox .arrow { width: 3.36vw; height: 3.36vw;}
    .section04 .arrowBox .arrow img {width: 1.25vw;}
    .section04 .swiper {margin-top: 2.42vw;}
    .section04 .swiper-slide {width: 26.80vw;; margin-right: 1.80vw;}
    .section04 .swiper-slide .txt {padding: 0 2.42vw; bottom: 1.02vw;}
    .section04 .swiper-slide strong {margin-bottom: 0.94vw; font-size: 1.72vw; letter-spacing: -0.16vw;}
    .section04 .swiper-slide p {font-size: 1.09vw; letter-spacing: -0.08vw;}
    .section04 .swiper-slide:hover p {max-height: 12.19vw; margin-bottom: 0.78vw;}
    /* section05 */
    .section05 .cont {height: 26.25vw;}
    .section05 .cont .titBox {padding-top: 3.91vw; padding-left: 9.45vw;}
    .section05 .cont .titBox * {transform: translateX(-2.42vw);}
    .section05 .cont .num {font-size: 4.30vw; letter-spacing: -0.16vw;}
    .section05 .cont .tit {font-size: 2.42vw; letter-spacing: -0.16vw;}
    .section05 .cont .img {width: 42.66vw; height: 26.25vw; border-radius: 18.28vw;}
    .section05 .cont .info {transform: translateX(2.42vw); padding-bottom: 5.39vw; padding-left: 3.05vw; width: calc(50% - 21.33vw); font-size: 1.25vw; letter-spacing: -0.08vw;}
    /* section06 */
    .section06::after {font-size: 2.42vw; letter-spacing: -0.08vw; height: 3.05vw; bottom: 2.11vw;}
    .section06 .swiper {margin-top: 8.52vw;}
    .section06 .swiper::before {height: 8.83vw; top: -4.84vw;}
    .section06 .swiper-slide {width: 42.66vw; height: 17.34vw; margin: 0 0.94vw;}
    .section06 .swiper-slide span {font-size: 0.86vw; letter-spacing: -0.08vw; width: 5.70vw; height: 1.95vw;}
    .section06 .arrowBox {gap: 0.63vw; margin-top: 2.42vw;}
    .section06 .arrowBox .arrow { width: 3.36vw; height: 3.36vw;}
    .section06 .arrowBox .arrow img {width: 1.25vw;}
    .no_data {margin-top: 2.42vw !important; padding: 11.80vw 0 10.86vw;}
    .no_data img {width: 2.34vw;}
    .no_data p {font-size: 1.25vw; margin-top: 1.72vw;}
    /* section07 */
    .section07::before {height: 8.83vw;}
    .section07 .tab {padding-top: 1.25vw;}
    .section07 .tab li {font-size: 1.09vw; letter-spacing: -0.08vw; width: 9.77vw; height: 3.52vw;}
    .section07 .tabCont {margin-top: 1.25vw;}
    .section07 .contTit h2 {font-size: 2.19vw; letter-spacing: -0.16vw;}
    .section07 .contTit p {margin-top: 0.70vw; font-size: 1.02vw; letter-spacing: -0.08vw;}
    .section07 .arrowBox {gap: 0.63vw; margin-top: 2.42vw;}
    .section07 .arrowBox .arrow { width: 3.36vw; height: 3.36vw;}
    .section07 .arrowBox .arrow img {width: 1.25vw;}
    .section07 .swiper {width: 73.20vw; height: 33.52vw;}
    /* section08 */
    .section08 .cont {margin-top: 3.67vw; gap: 3.59vw;}
    .section08 .mapCont {width: 52.42vw; height: 29.30vw;}
    .section08 .info {width: calc(100% - 52.42vw - 3.59vw);}
    .section08 .info .box {padding: 2.42vw 0;}
    .section08 .info .tit {font-size: 1.09vw; letter-spacing: -0.08vw;}
    .section08 .addr p {margin-top: 1.48vw; font-size: 1.25vw; letter-spacing: -0.08vw;}
    .section08 .addr .btn {margin-top: 1.80vw; gap: 0.94vw;}
    .section08 .addr .btn a {width: 8.98vw; height: 2.81vw; font-size: 1.02vw; letter-spacing: -0.08vw; gap: 0.63vw; border-radius: 3.05vw;}
    .section08 .addr .btn a img {width: 0.94vw;}
    .section08 .addr .btn .copy {width: 2.81vw; height: 2.81vw;}
    .section08 .addr .btn .copy img {width: 1.33vw;}
    .section08 .box:not(.addr) {gap: 6.09vw;}
    .section08 .tell h4 {font-size: 1.72vw; letter-spacing: -0.08vw;}
    .section08 .time p {gap: 1.80vw;}
    .section08 .time p + p {margin-top: 0.63vw;}
    .section08 .time span {width: 7.97vw; font-size: 1.02vw; letter-spacing: -0.08vw;}
    .section08 .time em {font-size: 0.86vw;}
    .section08 .time strong {font-size: 1.09vw; letter-spacing: -0.08vw;}
    .section08 .time ul {margin-top: 0.63vw; font-size: 1.02vw; letter-spacing: -0.08vw;}

    /* use popup */
    .use_pop .pop_inner { width: 50.52vw; height: 40.8vw; padding: 3.05vw 1.80vw 2.42vw 2.11vw;}
    .use_pop .pop_tit {padding-bottom: 1.8vw; width: calc(100% - 1.41vw);}
    .use_pop .pop_tit .tit {font-size: 1.72vw;}
    .use_pop .pop_close img {width: 1.7vw;}
    .use_pop .use_wrap { padding-right: 1.41vw; margin-top: 1.8vw;}
    .use_pop .use_wrap::-webkit-scrollbar {width: 0.16vw;}
    .use_pop .use_wrap::-webkit-scrollbar-thumb {border-radius: 0.63vw;}
    .use_pop .use_wrap .headline {margin-bottom: 0.63vw;}
    .use_pop .use_wrap .tag-box p,
    .use_pop .use_wrap .headline h5 {font-size: 1.09vw;}
    .use_pop .use_wrap ol {padding: 0; margin: 0;}
    .use_pop .use_wrap ol * {font-size: 1.02vw; letter-spacing: -0.08vw;}
    .use_pop .use_wrap .margin-top-30 {margin-top: 1.80vw;}
}

@media screen and (max-width:768px){
    /* 공통 */
    .inner{max-width: calc(100% - 10.42vw);}

    .pc{display:none !important;}
    .mob{display:block !important;}

    .mt40 {margin-top: 5.21vw;}
    .mt60 {margin-top: 7.81vw;}
    .mt80 {margin-top: 10.42vw;}
    .mt100 {margin-top: 10.42vw;}

    /* HEADER */
    .header {height: 15.63vw;}
    .header h1 a {font-size: 5.21vw; letter-spacing: -0.52vw;}
    .header .head_mob_btn {position: relative; z-index: 100000;}
    .header .head_mob_btn img {width: 8.33vw;}
    .header .head_mob_btn img.close {display: none;}
    .header .gnb_wrap {background: #E8E3D9; height: 13.02vw; opacity: 0; transform: translateY(-100%); transition: all .5s;}
    .header .gnb {gap: 3.91vw; justify-content: center; max-width: 100%; padding: 0 3.26vw;}
    .header .gnb a {font-size: 3.65vw; letter-spacing: -0.10vw;}
    .header .gnb a::after {display: none;}
    .header.active .head_mob_btn img.open {display: none;}
    .header.active .head_mob_btn img.close {display: block;}
    .header.active .gnb_wrap {opacity: 1; transform: translateY(0);}
    
    /* FOOTER */
    .footer {padding: 10.42vw 0 11.98vw !important; height: auto !important;}
    .footer .inner {flex-direction: column; gap: 8.46vw; align-items: flex-start;}
    .footer .left {gap: 6.51vw; flex-direction: column;}
    .footer h1 a {font-size: 6.25vw; letter-spacing: -0.52vw;}
    .footer .info p {gap: 1.30vw; font-size: 3.65vw; flex-wrap: wrap;}
    .footer .info p span {gap: 1.30vw; letter-spacing: -0.10vw;}
    .footer .info p.mob {display: flex !important;}
    .footer .info p + p {margin-top: 1.30vw;}
    .footer .use {gap: 3.91vw; justify-content: flex-start;}
    .footer .use * {font-size: 3.65vw; letter-spacing: -0.13vw;}
    .footer .copy {margin-top: 1.17vw; font-size: 3.65vw; letter-spacing: -0.13vw;}

    /* SIDE QUICK */
    .quickSide {right: 2.86vw; bottom: 8.07vw;}
    .quickSide > ul > li {box-shadow: 0.00vw 1.82vw 5.73vw 0.00vw #959DA533; width: 10.42vw; height: 10.42vw;}
    .quickSide > ul > li + li {margin-top: 1.74vw;}
    .quickSide > ul li a img {width: 3.99vw;}
    .quickSide > ul li.top_btn a img {width: 2.60vw;}

    #menu {display: none;}


    /********** main **********/
    /***** common *****/
    /* sub_tit */
    .sub_tit em {font-size: 3.39vw; letter-spacing: -0.16vw;}
    .sub_tit h2 {margin-top: 2.60vw; font-size: 7.03vw; letter-spacing: -0.55vw;}
    .sub_tit p {margin-top: 2.60vw; font-size: 3.65vw; letter-spacing: -0.10vw;}
    /* animation */
    [ani="up"] {transform: translateY(9.51vw);}


    /* visual */
    .section[data-anchor="sec01"] {padding: 0 !important;}
    .visual {height: 169.27vw; padding: 0;}
    .visual .item .txt {bottom: 40.76vw;}
    .visual .item .txt em {font-size: 3.39vw; letter-spacing: -0.16vw;}
    .visual .item .txt h2 {margin-top: 3.91vw; font-size: 9.11vw; letter-spacing: -0.52vw;}
    .visual .item .txt p {margin-top: 3.91vw; font-size: 3.65vw; letter-spacing: -0.10vw;}
    .visual .bot { bottom: 11.33vw; gap: 0 3.91vw;}
    .visual .bot .arrow_cont {gap: 0 3.91vw;}
    .visual .bot .arrow_cont .arrow img {width: 4.17vw;}
    .visual .bot .pause img {width: 6.51vw;}
    .visual .progress_box {width: 47.14vw; height: 0.52vw;}
    .visual .slide-progress {width: 26.04vw; height: 0.52vw;}
    .visual .slide-count span {font-size: 3.65vw; letter-spacing: -0.21vw;}

    .section {padding: 18.23vw 0;}
    /* section01 */
    .section01::after {display: none;}
    .section01 .cont {flex-direction: column-reverse; gap: 10.42vw;}
    .section01 .cont > div {width: 100%;}
    .section01 .txt h3 {display: none;}
    .section01 .info {margin-top: 0; padding-top: 0; gap: 0; border: 0; gap: 5.21vw; flex-direction: column;}
    .section01 .flex {font-size: 3.65vw; letter-spacing: -0.10vw; gap: 2.60vw;}
    .section01 .flex strong {font-size: 6.25vw;}
    .section01 .name p {margin-top: 1.30vw; font-size: 3.65vw; letter-spacing: -0.10vw;}
    .section01 .his > strong {font-size: 4.17vw; letter-spacing: -0.21vw;}
    .section01 .his ul {margin-top: 3.91vw;}
    .section01 .his li {font-size: 3.65vw; letter-spacing: -0.10vw; padding-left: 2.47vw; text-indent: -2.47vw;}
    .section01 .his li + li {margin-top: 1.17vw;}
    .section01 .img {padding-left: 0;}
    /* section02 */
    .section02 {height: 169.27vw; padding: 0; background: url('/img/main/m_sec02_bg.jpg') no-repeat center/cover;}
    .section02 .txt { gap: 7.81vw; height: 100%;}
    .section02 .line {width: 0.26vw; height: 5.21vw;}
    .section02 p {font-size: 3.65vw; letter-spacing: -0.10vw;}
    .section02 p + p {margin-top: 7.81vw;}
    /* section03 */
    .section03::after {display: none;}
    .section03 ul {flex-wrap: wrap; margin-top: 10.42vw;}
    .section03 ul li {width: 45.57vw; height: 45.57vw;}
    .section03 ul li + li {margin-left: -5.21vw;}
    .section03 ul li:nth-child(2) {transition-delay: 1s;}
    .section03 ul li:nth-child(3) {transition-delay: 1.2s; margin-left: 0;}
    .section03 ul li:nth-child(4) {transition-delay: 1.4s;}
    .section03 ul li .img {height: 9.04vw;}
    .section03 ul li {letter-spacing: -0.07vw;}
    .section03 ul li p {margin-top: 3.42vw; font-size: 4.17vw;}
    .section03 ul li em {margin-top: 1.17vw; font-size: 2.86vw;}
    /* section04 */
    #cursor_div {display: none;}
    .section04 .arrowBox {gap: 1.89vw; margin-top: 7.81vw; justify-content: center; padding-bottom: 1px;}
    .section04 .arrowBox .arrow { width: 10.42vw; height: 10.42vw;}
    .section04 .arrowBox .arrow img {width: 3.79vw;}
    .section04 .swiper {margin-top: 10.42vw;}
    .section04 .swiper-slide {width: 80.73vw;; margin-right: 5.21vw;}
    .section04 .swiper-slide .txt {padding: 0 7.29vw; bottom: 13.02vw;}
    .section04 .swiper-slide strong {margin-bottom: 1.95vw; font-size: 5.21vw; letter-spacing: -0.26vw;}
    .section04 .swiper-slide p {font-size: 3.39vw; letter-spacing: -0.10vw;}
    .section04 .swiper-slide:hover p {max-height: 19.53vw; margin-bottom: 0;}
    /* section05 */
    .section05 {background: #F3EFE6 url('/img/main/m_sec05_bg.png') no-repeat center/cover; height: auto; overflow: hidden;}
    .section05 .sec5_swiper {transform: translateY(0) !important; opacity: 1 !important;}
    .section05 .cont {height: auto; display: block;}
    .section05 .cont .titBox {padding-top: 0; padding-left: 0;}
    .section05 .cont .titBox * {transform: translateX(-9.51vw);}
    .section05 .cont .num {font-size: 10.42vw; letter-spacing: -0.52vw;}
    .section05 .cont .tit {font-size: 6.25vw; letter-spacing: -0.52vw;}
    .section05 .cont .img {width: 89.58vw; height: 55.03vw; border-radius: 78.13vw; margin-top: -5.08vw; position: relative; top: auto; left: auto; transform: none;}
    .section05 .cont .info {transform: translateX(9.51vw); margin-top: 7.81vw; padding-bottom: 0; padding-left: 0; width: 100%; font-size: 3.65vw; letter-spacing: -0.26vw;}
    /* section06 */
    .section06::after {display: none;}
    .section06 .swiper {margin-top: 10.42vw;}
    .section06 .swiper::before {display: none;}
    .section06 .swiper-slide {width: 100%; height: 40.71vw; margin: 0;}
    .section06 .swiper-slide span {font-size: 2.86vw; letter-spacing: -0.09vw; width: auto; padding: 0 2.86vw; height: 5.47vw; line-height: 1;}
    .section06 .arrowBox {gap: 1.95vw; margin-top: 7.81vw;}
    .section06 .arrowBox .arrow { width: 10.42vw; height: 10.42vw;}
    .section06 .arrowBox .arrow img {width: 3.79vw;}
    .no_data {margin-top: 10.42vw !important; padding: 15.63vw 0;}
    .no_data img {width: 5.21vw;}
    .no_data p {font-size: 3.39vw; margin-top: 2.60vw;}
    /* section07 */
    .section07::before {display: none;}
    .section07 .top {display: block;}
    .section07 .sub_tit {text-align: center;}
    .section07 .tab {padding-top: 0; margin-top: 10.42vw;}
    .section07 .tab li {font-size: 4.17vw; letter-spacing: -0.26vw; width: calc(100%/3); height: 10.94vw;}
    .section07 .tabCont {margin-top: 7.81vw;}
    .section07 .cont {flex-direction: column; gap: 7.81vw;}
    .section07 .cont > div {width: 100%;}
    .section07 .contTit {display: flex; align-items: center; justify-content: space-between;}
    .section07 .contTit h2 {font-size: 4.69vw; letter-spacing: -0.21vw;}
    .section07 .contTit p {margin-top: 1.30vw; font-size: 3.13vw; letter-spacing: -0.05vw;}
    .section07 .arrowBox {gap: 1.69vw; margin-top: 0;}
    .section07 .arrowBox .arrow { width: 9.11vw; height: 9.11vw;}
    .section07 .arrowBox .arrow img {width: 3.31vw;}
    .section07 .swiper {width: 100%; height: 62.50vw;}
    /* section08 */
    .section08 .cont {margin-top: 10.42vw; gap: 9.64vw; flex-direction: column;}
    .section08 .mapCont {width: 100%; height: 59.90vw;}
    .section08 .info {width: 100%;}
    .section08 .info .box {padding: 6.51vw 0;}
    .section08 .info .tit {font-size: 3.65vw; letter-spacing: -0.21vw;}
    .section08 .addr p {margin-top: 2.60vw; font-size: 4.17vw; letter-spacing: -0.16vw;}
    .section08 .addr .btn {margin-top: 7.81vw; gap: 2.60vw;}
    .section08 .addr .btn a {width: auto; padding: 0 6.25vw; height: 9.90vw; font-size: 3.65vw; letter-spacing: -0.26vw; gap: 2.60vw; border-radius: 13.02vw;}
    .section08 .addr .btn a img {width: 3.91vw;}
    .section08 .addr .btn .copy {width: 9.90vw; height: 9.90vw;}
    .section08 .addr .btn .copy img {width: 5.73vw;}
    .section08 .box:not(.addr) {gap: 26.04vw;}
    .section08 .tell h4 {font-size: 7.29vw; letter-spacing: -0.16vw;}
    .section08 .time {flex-direction: column; gap: 2.60vw !important;}
    .section08 .time p {gap: 5.21vw;}
    .section08 .time p + p {margin-top: 2.60vw;}
    .section08 .time span {width: 33.85vw; font-size: 3.39vw; letter-spacing: -0.16vw;}
    .section08 .time em {font-size: 3.13vw;}
    .section08 .time strong {font-size: 4.69vw; letter-spacing: -0.21vw;}
    .section08 .time ul {margin-top: 2.60vw; font-size: 3.65vw; letter-spacing: -0.10vw;}

    /* use popup */
    .use_pop .pop_inner { width: calc(100% - 10.42vw); height: 70vh; padding: 6.51vw 2.60vw 6.51vw 5.21vw;}
    .use_pop .pop_tit {padding-bottom: 5.21vw; width: calc(100% - 2.60vw);}
    .use_pop .pop_tit .tit {font-size: 5.21vw;}
    .use_pop .pop_close img {width: 5.21vw;}
    .use_pop .use_wrap { padding-right: 2.60vw; margin-top: 7.03vw;}
    .use_pop .use_wrap::-webkit-scrollbar {width: 0.52vw;}
    .use_pop .use_wrap::-webkit-scrollbar-thumb {border-radius: 2.47vw;}
    .use_pop .use_wrap .headline {margin-bottom: 2.60vw;}
    .use_pop .use_wrap .tag-box p,
    .use_pop .use_wrap .headline h5 {font-size: 4.17vw;}
    .use_pop .use_wrap ol {padding: 0; margin: 0;}
    .use_pop .use_wrap ol * {font-size: 3.65vw; letter-spacing: -0.10vw;}
    .use_pop .use_wrap .margin-top-30 {margin-top: 5.21vw;}
}

@media screen and (max-width:384px){
    .header.active .head_mob_btn img.close {width: 6.33vw;}
}