/* BASIC css start */
@charset "utf-8";


/* =========================================================
   2026 TAVALON MOBILE
   BRAND
========================================================= */


/* =========================================================
   COMMON
========================================================= */

#contentWrapper{
    width:100%;
    padding:0;
}

#brandPage{
    width:100%;
    overflow:hidden;

    color:#111;

    font-family:'Noto Sans KR', sans-serif;

    word-break:keep-all;
}

#brandPage *{
    box-sizing:border-box;
}

#brandPage .section{
    position:relative;
    width:100%;
}

#brandPage img{
    display:block;
    width:100%;
    max-width:100%;

    -webkit-user-drag:none;
    user-select:none;
}

#brandPage .brand_inner{
    width:100%;
    margin:0;
}

#brandPage .brand_text_inner{
    width:100%;
    margin:0;
}


/* =========================================================
   TYPOGRAPHY
========================================================= */


/* TITLE */

#brandPage .title{
    margin:0 0 15px;

    font-family:'Montserrat', sans-serif;
    font-size:11px;
    line-height:1.4;
    font-weight:600;

    letter-spacing:1.8px;

    color:#777;
}


/* H1 / H2 */

#brandPage h1,
#brandPage h2{
    margin:0;

    font-family:'Montserrat', sans-serif;
    font-weight:400;

    color:#111;
}

#brandPage h1{
    font-size:32px;
    line-height:1.14;

    letter-spacing:-0.8px;
}

#brandPage h2{
    font-size:27px;
    line-height:1.25;

    letter-spacing:-0.5px;
}


/* LEAD */

#brandPage .lead{
    margin:26px 0 0;

    font-family:'Noto Sans KR', sans-serif;
    font-size:16px;
    line-height:1.75;
    font-weight:400;

    letter-spacing:-0.3px;

    color:#222;
}


/* DESC */

#brandPage .desc{
    margin:28px 0 0;

    font-family:'Noto Sans KR', sans-serif;
    font-size:14px;
    line-height:1.9;
    font-weight:400;

    letter-spacing:-0.25px;

    color:#555;
}

#brandPage .desc.last{
    margin-top:14px;
}


/* SIGNATURE */

#brandPage .signature{
    margin:32px 0 0;

    font-family:'Montserrat', 'Noto Sans KR', sans-serif;
    font-size:17px;
    line-height:1.65;
    font-weight:500;

    letter-spacing:-0.2px;

    color:#111;
}



/* =========================================================
   SEC1
   EVERYDAY ELEGANCE
========================================================= */

#brandPage #sec1{
    width:100%;

    background:#fff;
}


/* IMAGE */

#brandPage #sec1 .hero_visual{
    width:100%;
    overflow:hidden;
}

#brandPage #sec1 .hero_visual img{
    width:100%;
    height:auto;
}


/* TEXT */

#brandPage #sec1 .hero_txt{
    width:100%;

    padding:52px 5% 78px;

    text-align:left;
}

#brandPage #sec1 .hero_txt .title{
    color:#777;
}

#brandPage #sec1 .hero_txt .lead{
    margin-top:28px;

    font-size:17px;
    line-height:1.7;
}

#brandPage #sec1 .hero_txt .desc{
    margin-top:30px;
}

#brandPage #sec1 .hero_txt .signature{
    margin-top:34px;
}


/* BRAND INFO */

#brandPage #sec1 .brand_info{
    margin-top:30px;

    font-family:'Montserrat', sans-serif;
    font-size:10px;
    line-height:1.8;
    font-weight:400;

    letter-spacing:0;

    color:#999;
}


/* =========================================================
   SEC2 / SEC4 / SEC6
   IMAGE + TEXT
========================================================= */

#brandPage .brand_split{
    width:100%;
}

#brandPage #sec2,
#brandPage #sec6{
    background:#f7f7f7;
}

#brandPage #sec4{
    background:#fff;
}


/* IMAGE */

#brandPage .brand_split .split_visual{
    width:100%;
    overflow:hidden;
}

#brandPage .brand_split .split_visual img{
    display:block;

    width:100%;
    height:auto;
}


/* TEXT */

#brandPage .brand_split .split_txt{
    width:100%;

    padding:58px 5% 80px;

    text-align:left;
}

#brandPage .brand_split .split_txt .lead{
    margin-top:25px;
}

#brandPage .brand_split .split_txt .desc{
    margin-top:27px;
}



/* =========================================================
   SEC3
   OUR PHILOSOPHY
========================================================= */

#brandPage #sec3{
    width:100%;

    padding:92px 7% 96px;

    background:#111;

    color:#fff;

    text-align:center;
}

#brandPage #sec3 .brand_text_inner{
    width:100%;
}

#brandPage #sec3 .title{
    color:#999;
}

#brandPage #sec3 h2{
    color:#fff;
}

#brandPage #sec3 .desc{
    margin-top:42px;

    color:#c5c5c5;
}

#brandPage #sec3 .highlight{
    margin:42px 0 0;

    font-family:'Noto Sans KR', sans-serif;
    font-size:15px;
    line-height:1.85;
    font-weight:400;

    letter-spacing:-0.25px;

    color:#fff;
}

#brandPage #sec3 .signature{
    margin-top:34px;

    font-size:19px;
    line-height:1.65;
    font-weight:500;

    color:#fff;
}



/* =========================================================
   SEC5
   TAVALON EXPERIENCE
========================================================= */

#brandPage #sec5{
    width:100%;

    background:#fff;
}


/* IMAGE */

#brandPage #sec5 .experience_visual{
    width:100%;
    overflow:hidden;
}

#brandPage #sec5 .experience_visual img{
    width:100%;
    height:auto;
}


/* TEXT */

#brandPage #sec5 .brand_text_inner{
    width:100%;

    padding:58px 5% 82px;

    text-align:left;
}

#brandPage #sec5 .lead{
    margin-top:26px;

    font-size:15px;
    line-height:1.85;
}

#brandPage #sec5 .desc{
    margin-top:28px;
}



/* =========================================================
   SEC6
   BEYOND TEA
========================================================= */

#brandPage #sec6 .beyond_list{
    display:flex;
    flex-wrap:wrap;

    gap:10px 20px;

    margin-top:29px;
}

#brandPage #sec6 .beyond_list span{
    position:relative;

    font-family:'Montserrat', sans-serif;
    font-size:13px;
    line-height:1.5;
    font-weight:500;

    color:#111;
}

#brandPage #sec6 .beyond_list span:not(:last-child)::after{
    position:absolute;

    top:50%;
    right:-11px;

    width:2px;
    height:2px;

    margin-top:-1px;

    border-radius:50%;

    background:#999;

    content:'';
}



/* =========================================================
   SEC7
   EVERYDAY ELEGANCE
========================================================= */

#brandPage #sec7{
    width:100%;

    padding:98px 7% 110px;

    background:#fff;

    text-align:center;
}

#brandPage #sec7 .brand_text_inner{
    width:100%;
}

#brandPage #sec7 .desc{
    margin-top:40px;

    color:#555;
}


/* CLOSING MESSAGE */

#brandPage #sec7 .closing_message{
    margin:58px 0 0;

    font-family:'Noto Sans KR', sans-serif;
    font-size:21px;
    line-height:1.65;
    font-weight:500;

    letter-spacing:-0.5px;

    color:#111;
}


/* BRAND LOCKUP */

#brandPage #sec7 .brand_lockup{
    margin-top:78px;
}

#brandPage #sec7 .brand_name{
    margin:0;

    font-family:'Montserrat', sans-serif;
    font-size:22px;
    line-height:1;
    font-weight:500;

    letter-spacing:6px;

    color:#111;
}

#brandPage #sec7 .brand_slogan{
    margin:15px 0 0;

    font-family:'Montserrat', sans-serif;
    font-size:9px;
    line-height:1;
    font-weight:500;

    letter-spacing:4px;

    color:#777;
}



/* =========================================================
   SMALL MOBILE
========================================================= */

@media screen and (max-width:360px){

    #brandPage h1{
        font-size:29px;
    }

    #brandPage h2{
        font-size:25px;
    }

    #brandPage .lead{
        font-size:15px;
    }

    #brandPage .desc{
        font-size:13px;
    }

    #brandPage .signature{
        font-size:16px;
    }

    #brandPage #sec7 .closing_message{
        font-size:19px;
    }

}
/* BASIC css end */