/* BASIC css start */
/* =========================================================
   GUMZZI MOBILE FOOTER
   MASTER V1
   - 기존 기능 유지
   - FREE-SHIP / 기획특가 / G.MADE 배지 생성 코드 제거
   - ▲▼ 버튼은 배경 투명도만 적용
   - backdrop-filter / filter / blur 사용 안 함
========================================================= */

#footer{
    font-family:'Pretendard','Pretendard-Regular','Helvetica Neue',Helvetica,sans-serif;
    margin:70px auto 0;
    border-top:1px solid var(--line-color);
    padding:20px 4% 77px;
    box-sizing:border-box;
}

#footer dl{
    line-height:22px;
}

#footer dl dt{
    margin-bottom:14px;
    font-size:12px;
    font-weight:400;
    line-height:1.5;
}

#footer dl dd{
    font-size:12px;
}


/* 링크 */

#footer .ft_linkinfo{
    margin-bottom:30px;
    display:flex;
    justify-content:space-between;
    text-align:center;
    align-items:center;
}

#footer .ft_linkinfo a{
    display:inline-block;
    font-size:12px;
}

#footer .line{
    display:inline-block;
    width:1px;
    height:10px;
    background-color:var(--line-color);
}

#footer .ft_linkinfo a strong{
    color:var(--main-color);
    font-weight:700;
}


/* 고객센터 */

#footer .ft_cs_title{
    display:block;
    margin-bottom:10px;
    font-size:16px;
    font-weight:700;
}

#footer .ft_cs_time,
#footer .ft_cs_holiday{
    display:block;
    font-size:12px;
    font-weight:400;
    line-height:1.8;
}

#footer .ft_cs p.tel{
    margin-bottom:15px;
}

#footer .ft_cs p.tel a{
    font-size:18px;
    font-weight:800;
}

#footer .ft_cs span.shopcs:before{
    content:'';
    display:inline-block;
    width:1px;
    height:10px;
    background-color:var(--line-color);
}

#footer .ft_cs span.shopcs:first-child:before{
    content:'';
    width:0;
}


/* 회사정보 */

#footer .ft_shopInfo{
    margin:30px 0 20px;
}

#footer .ft_shopInfo dl dt{
    margin-bottom:14px;
}

#footer .ft_gumzzi_logo{
    display:inline-block;
    font-family:'Times New Roman',Times,serif;
    font-size:23px;
    font-weight:400;
    line-height:1;
    letter-spacing:1.1px;
    color:#111;
}

#footer .ft_shopInfo dl dd a{
    font-size:12px;
    color:var(--gray);
    padding:2px 7px;
    border:1px solid var(--line-color);
    border-radius:4px;
}

#footer .ft_shopInfo dl dd p .line{
    margin:0 10px;
}


/* 카피라이트 */

#footer .ft_copy{
    margin-bottom:20px;
    font-size:12px;
    font-weight:400;
    color:var(--gray);
    text-transform:uppercase;
}


/* =========================================================
   ▲ / ▼ SCROLL BUTTON

   중요:
   버튼 자체의 background rgba만 투명하게 한다.
   backdrop-filter / filter / blur는 사용하지 않는다.
   따라서 버튼 뒤 상품 이미지가 흐려지지 않는다.
========================================================= */

#scrolltotop{
    position:fixed;
    right:12px;
    bottom:calc(160px + env(safe-area-inset-bottom));
    z-index:1200;
    display:grid;
    gap:6px;

    /* 부모 자체에는 opacity를 주지 않는다. */
    opacity:1;
    filter:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;
}

#scrolltotop a{
    display:flex;
    align-items:center;
    justify-content:center;

    width:54px;
    height:54px;

    padding:0;
    border:1px solid rgba(0,0,0,.08);
    border-radius:50%;

    /*
      오직 배경색의 alpha만 사용.
      뒤쪽 상품/옷 이미지는 선명하게 그대로 보임.
    */
    background:rgba(255,255,255,.38);

    color:rgba(0,0,0,.38);
    font-size:22px;
    font-weight:400;
    line-height:1;

    box-shadow:none;

    opacity:1;
    filter:none;
    backdrop-filter:none;
    -webkit-backdrop-filter:none;

    -webkit-tap-highlight-color:transparent;
}

#scrolltotop a img{
    display:none!important;
}

#scrolltotop a.go_top::before{
    content:"△";
}

#scrolltotop a.go_bottom::before{
    content:"▽";
}

#scrolltotop a:active{
    background:rgba(255,255,255,.55);
}


/* 브라우저 기본 스크롤도 부드럽게 */
html{
    scroll-behavior:smooth;
}

/* BASIC css end */

