/* html{background-color: #efefef; height: 100%; overflow-x: hidden; width:100%; font-size: 2.6666666667vw;}
body{color:#121212; margin-left:auto; margin-right:auto; background-color: #fff; font-size: 1.1em; height: 100%; line-height: 1.4;} */


/* 스와이퍼 */

.swiper {
    width: 100%;
    height: 100%;
  }

  .swiper-slide {
    text-align: center;
    font-size: 18px;
    background: #fff;
    /* display: flex;
    justify-content: center;
    align-items: center; */
  }

  .swiper-slide img {
    display: block;
    width: 100%;
  }


/* -------- 인트로 -------- */



/* -------- 하단 내비 -------- */
.bt_nav {padding: 10px 0; background-color: #fff; border-top: 1px solid #eee; position: fixed; bottom: 0; left: 0; width: 100%; z-index: 100;}
.bt_nav ul {display: grid; grid-template-columns: 1fr 1fr 1fr 1fr;}
.bt_nav .nav_con {display: flex; flex-direction: column; align-items: center; gap: 8px;}
.bt_nav .nav_con .nav_icon {display: block; width: 25px; height: 25px;}
.bt_nav .nav_con.home .nav_icon {background: url(../img/nav1.png) no-repeat center/contain;}
.bt_nav  li.on .nav_con.home .nav_icon {background: url(../img/nav1_on.png) no-repeat center/contain;}
.bt_nav .nav_con.self .nav_icon {background: url(../img/nav2.png) no-repeat center/contain;}
.bt_nav li.on .nav_con.self .nav_icon {background: url(../img/nav2_on.png) no-repeat center/contain;}
.bt_nav .nav_con.mycon .nav_icon {background: url(../img/nav3.png) no-repeat center/contain;}
.bt_nav li.on .nav_con.mycon .nav_icon {background: url(../img/nav3_on.png) no-repeat center/contain;}
.bt_nav .nav_con.my .nav_icon {background: url(../img/nav4.png) no-repeat center/contain;}
.bt_nav li.on .nav_con.my .nav_icon {background: url(../img/nav4_on.png) no-repeat center/contain;}

.bt_nav li span {color: #aaa; font-size: 14px;}
.bt_nav li.on span {color: #356EFF; font-weight: 700  ;}


/* -------- 탑바 -------- */

.header {width: 100%; height: 60px; position: fixed; top: 0; left: 0; padding: 0 16px; display: flex; align-items: center; background-color: #fff; border-bottom: 1px solid #eee; z-index: 12;}
.header .logo {width: 135px;}

.header.main-hd {border-bottom: none;}

.header.defalt {display: flex; align-items: center; justify-content: center;}
.header.defalt .back {position: absolute; top: 50%; left: 16px; transform: translateY(-50%); font-size: 20px;}
.header.defalt h1 {font-size: 16px; font-weight: 600;}
.header.defalt .logout {position: absolute; color: #8b8b8b; top: 50%; right: 16px; transform: translateY(-50%);}

@media (max-width:310px){
  /* .bt_nav li span {font-size: 13px;} */
}