/* -------- 인트로 -------- */
.wrap.intro {background-color: #fff; height: 100vh; width: 100%; position: relative;}
.wrap.intro .logo {width: 170px; height: auto; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);}
.wrap.intro .logo > img {width: 100%; display: block; object-fit: cover;}


/* -------- 페이지헤더 -------- */
.page_hd {width: 100%; position: absolute; top: 0; left: 50%; transform: translateX(-50%); border-bottom: 1px solid #eee; background-color: #fff; height: 56px;}
.page_hd .prev {position: absolute; top: 50%; left: 1.2em; transform: translateY(-50%); width: 30px; height: 30px; background: url(../img/page_header_prev.png) no-repeat center/contain;}
.page_hd .pg_tit {position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); font-size: 16px; font-weight: 500;}
.page_hd .btn_right {position: absolute; top: 50%; right: 1.2em; transform: translateY(-50%); width: 30px; height: 30px; background-color: pink;}

.page_hd.color {background-color: #5834E8;}
.page_hd.color .pg_tit {color: #fff;}

/* .page_hd .btn_left.prev {background: url(../img/page_header_prev.png) no-repeat center/contain;} */
/* .page_hd.color .btn_left.prev {background: url(../img/page_header_prev_wh.png) no-repeat center/contain;} */
.page_hd.color .prev {background: url(../img/page_header_prev_wh.png) no-repeat center/contain;}
.page_hd .btn_right.close {background: url(../img/page_header_close.png) no-repeat center/contain;}
.page_hd.color .btn_right.close {background: url(../img/page_header_close_wh.png) no-repeat center/contain;}

.main_slide .swiper-pagination {
    position: absolute;
    width: 60px !important;
    bottom: 10PX !important;
    right: 10px !important;
    left: auto !important;
    background-color: rgba(0, 0, 0, 0.3);
    border-radius: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: rgba(255, 255, 255, .6);
    padding: 5px 0;
    gap: 5px;
}


/* -------- 바텀내비 -------- */
.bottom_nav {position: fixed; width: 100%; bottom: 0; left: 0; border-radius: 20px 20px 0 0; box-shadow: 0 -4px 10px 6px rgba(0, 0, 0, .04); background-color: #fff; z-index: 10;}
.bottom_nav .bd {display: flex; padding: 18px 10px 25px;}
.bottom_nav .nav_con {width: calc(100% / 4); display: flex; flex-direction: column; align-items: center; gap: 8px;}
.bottom_nav .nav_con span {font-size: 13px; font-weight: 600; color: #999;}
.bottom_nav .nav_con .icon {display: block; width: 22px; height: 22px;}
.bottom_nav .nav_con.maincon .icon {background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/ESTP/169127292948011.png) no-repeat center/contain;}
.bottom_nav .nav_con.maincon.on .icon {background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/ESTP/169127293447158.png) no-repeat center/contain;}
.bottom_nav .nav_con.maincon.on span {color: #111;}
.bottom_nav .nav_con.skincon .icon {background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/ESTP/169127293821573.png) no-repeat center/contain;}
.bottom_nav .nav_con.skincon.on .icon {background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/ESTP/169127294358383.png) no-repeat center/contain;}
.bottom_nav .nav_con.skincon.on span {color: #111;}
.bottom_nav .nav_con.shopcon .icon {background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/ESTP/169127294734340.png) no-repeat center/contain;}
.bottom_nav .nav_con.shopcon.on .icon {background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/ESTP/169127295147541.png) no-repeat center/contain;}
.bottom_nav .nav_con.shopcon.on span {color: #111;}
.bottom_nav .nav_con.my .icon {background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/ESTP/169127295640649.png) no-repeat center/contain;}
.bottom_nav .nav_con.my.on .icon {background: url(https://s3.ap-northeast-2.amazonaws.com/lbcontents/images/ESTP/169127296090122.png) no-repeat center/contain;}
.bottom_nav .nav_con.my.on span {color: #111;}
.bottom_nav .home {width: 90px; margin-top: -45px; height: 90px;}
.bottom_nav .home img {width: 100%; height: 100%; display: block; object-fit: contain;}

/* 푸터 */

footer {background: #f9f9f9; padding: 20px;}
footer > ul > li {font-size: 12px;}
footer > .fo-menu{ width: 100%;}
footer > .fo-menu > li {font-size: 13px;  margin-right: 10px; text-align: left; color: #333;}
footer > .fo-info{ width: 100%;}
footer > .fo-info > li { width: 100%; padding: 7px 0;}
footer > .fo-info > li:first-child {padding: 14px 0 0;}
footer > .fo-info > li > div > b {color: #C0A34F; font-size: 13px; font-weight: 500;}
footer > .fo-info > li > div > p {display: flex; flex-wrap: wrap; margin-top: 5px; color: #666;}
footer > .fo-info > li > div > p > span {position: relative; color: #666;}
footer > .fo-info > li > div > p > span:nth-child(2) {margin-left: 10px;}
footer > .fo-info > li > div > p > span:nth-child(1):after {content: ''; width: 1px; height: 11px; right: -6px;  background-color: #ddd; position: absolute;}
footer > .fo-info > li > div > p > span:nth-child(2)::after{display: none;}