@charset "utf-8";
@import url("../fonts/font.css");

.town-container {
    width: 100%;
    max-width: 1480px;
    margin: 0 auto;
    padding: 0 15px;
    box-sizing: border-box;
}

/* 1024px 미만에서만 여백 적용 */
@media (max-width: 1023px) {
    .town-container {
        padding-left: 14px;
        padding-right: 14px;
    }
}
/* 레이아웃 */
body { 
    margin-bottom:212px;
}
.hp-layout__town {
    position: relative;
    max-width: 100%;
    width: 100%;
    margin: 0 auto;
    background: #fff;
    padding:0;
}
.fix-header-container {
    max-width:1480px;
}
.sub-content__town {
    padding: 0;
}
/* 타이틀 hero 시작*/
.townpage-hero__inner {
    padding: clamp(20px, 8vw, 80px) 0;
    display: flex;
    flex-direction: column;
    justify-items: center;
    align-items: center;
}

.townpage-hero__title {
    font-family: 'OneStoreMobileGothicTitleFont';
    font-size: clamp(24px, 5vw, 52px);
    letter-spacing: -2.9px;
    color: #181818;
}

.townpage-hero__desc {
    font-size: clamp(15px, 2.2vw, 24px);
    font-family: 'Pretendard', sans-serif;
    font-weight: 500;
    line-height: 1.2;
    letter-spacing: -1.4px;
    margin-top: clamp(6px, 1vw, 20px);
    color: #414141;

}

/* 컨텐츠 */

.page-hero__inner {
    flex-direction: row;
    display: flex;
    justify-content: space-between;
    width: 100%;
    align-items: center;
    margin: clamp(24px, 4vw, 40px) 0 clamp(40px, 6vw, 80px);
}



.page-hero__titleWrap {
    display: flex;
    align-items: center;
}

.page-hero__iconWrap {
    width: clamp(28px, 3vw, 44px);
    display: flex;
}

.page-hero__iconWrap img {
    width: 100%;
    height: 100%;
    display: block;
}

.page-hero__title {
    font-family: 'Pretendard', sans-serif;
    font-weight: 700;
    color: #181818;
    font-size: clamp(20px, 2.5vw, 32px);
    letter-spacing: -1.4px;
    margin-left: 4px;
}

.page-hero__desc {
    font-family: 'Pretendard', sans-serif;
    font-weight: 400;
    color: #2F2F2F;
    letter-spacing: -1.2px;
    margin-top: 3px;
    line-height: 1.4;
    font-size: clamp(16px, 1.8vw, 24px);

}
@media (max-width: 1200px) {
    body {
        margin-bottom: 0;
    }

    .movein-section__title {
        width: 28%;
    }

    .movein-section__inquirytitle {
        width: 28%;
    }
}
@media (max-width: 768px) {
    .page-hero__inner{
        flex-direction: column;
        align-items: flex-start;
        width: 100%;
    }
}