@charset "utf-8";
.real-cont {padding:120px 0 180px;}
.sub_tit {padding-bottom: 120px; border-bottom: 1px solid rgba(255,255,255, .1);}
.sub_tit h5 {font-family: 'Artega'; font-size: 18px; color: #fff;  font-weight: 500; line-height: 2; letter-spacing: -.9px; text-align: center;}
.sub_tit img {display: block; max-width: 100%; margin: 26px auto;}
.sub_tit p {font-size: 20px; color: rgba(255,255,255, .6); line-height: 1.6; letter-spacing: -.6px; text-align: center; font-weight: 400;}

.page-header {position: relative; width: 100%; height: 100dvh; background: url() 50% 50% no-repeat; background-size: cover;}
.page-header.type1 {background-image: url(../images/sub/s-visual01.jpg);}
.page-header.bg-list {background-image: url(../images/sub/s-visual02.jpg);}
.page-header.bg-view {background-image: url(../images/sub/s-visual03.jpg);}
.page-header.type3 {display: none;}

.scroll {position: absolute; z-index: 1; bottom: 45px; left: 50%; transform: translateX(-50%); width: 70px; height: 70px; border-radius: 50%; background-color: rgba(255,255,255, .1); display: flex; align-items: center; justify-content: center;} 
.scroll::before {position: absolute; content: ''; width: 100%; height: 100%; border-radius: 50%; background: url(../images/sub/scroll.png) 50% 50% no-repeat; background-size: auto; top: 0; right: 0; animation: roll 10s linear infinite;}
.scroll img {display: block; max-width: 100%; margin: 0 auto;}

@keyframes roll {
    0% {
      transform: rotate(0);
    }
    100% {
      transform: rotate(360deg);
    }
}

/* s1 */
.s1 {padding: 170px 0 45px;}
.s1 h3 {font-size: 48px; font-weight: 500; color: #fff; text-align: center; line-height: 1.25; letter-spacing: -2.88px; font-family: 'Artega';}
.s1 h3 > img {display: block; max-width: 100%; margin: 10px auto 0;}
.s1 p {margin-top: 80px; font-size: 20px; font-weight: 400; color: rgba(255,255,255, .6); text-align: center; line-height: 1.6; letter-spacing: -.6px;}
.s1 p ~ p {margin-top: 32px;}
.s1 .banner {margin-top: 180px; height: 340px; width: 100%; overflow: hidden; background: url(../images/sub/bg_s1.jpg) 50% 50% no-repeat; background-size: cover; background-attachment: fixed;}

/* s3 */
.s3 {padding: 96px 0 180px;}
.s3 .map {width: 100%; height: 460px;}
.root_daum_roughmap {width: 100% !important; height: 100% !important;}
.root_daum_roughmap .wrap_map {height: 100% !important;}
.root_daum_roughmap .map_border {display: none;}
.s3 .info {margin-top: 60px;}
.s3 .info p {font-size: 20px; color: rgba(255,255,255, .6); font-weight: 400; line-height: 1.8; letter-spacing: -.6px; text-align: center;}
.s3 .info p a {display: inline-block; color: inherit; font-weight: 400;}
.s3 .info .btn-area {display: flex; justify-content: center; gap: 10px; margin-top: 50px;}
.s3 .info .btn-area a {display: flex; width: 60px; height: 60px; border-radius: 50%; justify-content: center; align-items: center; transition: all .2s linear; background-color: rgba(255,255,255, .2);}
.s3 .info .btn-area a.print {background-color: #5F03CA;}
.s3 .info .btn-area a:hover {opacity: .7;}