@charset "utf-8";

.container {width: 100%; max-width: 992px; margin: 0 auto; padding: 0 2rem;}

.container-btmbtn {position: relative;}

/*============================================================*/
/* 메인 페이지 레이아웃 */
/*============================================================*/
.main-container {position: relative; height: calc(100dvh - var(--ft-height)); padding-bottom: 4.2rem; overflow: hidden auto;}

/* 메인 버튼*/
.main-btm {position: fixed; bottom: 0; left: 0; right: 0; display: flex; justify-content: center; align-items: center; height: var(--ft-height); background: var(--col-wt);}
.main-btm a {flex: 1 0 0; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: .8rem; color: #B7B7B7; font-size: 1.2rem; transition: var(--trans-25);}
.main-btm a.on {color: #111;}
.main-btm a.on .svg-fill {fill: #111;}
.main-btm a.on .svg-stroke {stroke: #111;}
@media (hover: hover) and (pointer: fine) {
    .main-btm a:hover {color: #111;}
    .main-btm a:hover .svg-fill {fill: #111; transition: var(--trans-25);}
    .main-btm a:hover .svg-stroke {stroke: #111; transition: var(--trans-25);}
}

/* 서브 페이지 상단 제목 */
.top-title {display: flex; align-items: center; height: var(--hd-height);}
.top-title h2 {font-size: 2rem; font-family: 'NanumSquareRoundExtraBold'; font-weight: 600;}


/*============================================================*/
/* 서브 페이지 레이아웃 */
/*============================================================*/
.sub-container {position: relative; top: var(--hd-height); height: calc(100dvh - var(--hd-height)); overflow: hidden auto;}
.sub-container.btm {height: calc(100dvh - var(--hd-height) - var(--ft-height));}

/* 서브 타이틀 */
.subtitle {position: fixed; top: 0; left: 0; right: 0; display: flex; align-items: center; height: var(--hd-height);}
.btn_back {height: 100%; aspect-ratio: 1; background: url("/img/arr_left_bk.svg") center/auto 1rem no-repeat;}
.subtitle h2 {font-family: 'NanumSquareRoundExtraBold'; font-weight: 700; line-height: 1;}

/* 서브 버튼 */
.btm-btn {position: fixed; bottom: 0; left: 0; right: 0; display: flex; justify-content: center; align-items: center; height: var(--ft-height);}