@charset "utf-8";

#atc01{padding:30px 30px 0;background-color:var(--bg-color)}
#atc01 .atc_inner{display:flex;gap:20px;max-width:var(--main-width);width:100%;margin:0 auto}
#atc01 .atc_inner .item{position:relative;flex:1;padding:50px 60px;border-radius:20px}
#atc01 .atc_inner .item .tag{display:inline-block;padding:8px 10px 5px;margin-bottom:28px;font-family:var(--font-recipekr);font-size:15px;text-transform:uppercase;border-radius:5px}
#atc01 .atc_inner .item .tit{margin-bottom:28px}
/* application */
#atc01 .atc_inner .item.l_box{background-color:var(--brand-color)}
#atc01 .atc_inner .item.l_box .tag{background-color:#302728;color:#fff;font-style:italic}
#atc01 .atc_inner .item.l_box .tit{position:relative;display:flex;flex-direction:column;gap:10px;font-family:var(--font-recipekr);font-weight:300;color:#fff}
#atc01 .atc_inner .item.l_box .tit span{font-size:23px}
#atc01 .atc_inner .item.l_box .tit strong{font-size:38px}
#atc01 .atc_inner .item.l_box .tit .app-bg{position:absolute;top:-20px;left:400px}
#atc01 .atc_inner .item.l_box .btn_wrap{display:flex;gap:20px}
#atc01 .atc_inner .item.l_box .btn_wrap .link-download{display:flex;align-items:center;gap:20px;flex:1;padding:15px 30px;border-radius:10px;background-color:#fff}
#atc01 .atc_inner .item.l_box .btn_wrap .link-download .btn-name{display:flex;flex-direction:column;gap:3px;color:#888}
#atc01 .atc_inner .item.l_box .btn_wrap .link-download .btn-name strong{font-size:18px;color:var(--font-maindark)}
/* 매장찾기 */
#atc01 .atc_inner .item.r_box{background-color:#302728}
#atc01 .atc_inner .item.r_box .cont{position:relative;z-index:1}
#atc01 .atc_inner .item.r_box .tag{background-color:#fff;color:var(--brand-color)}
#atc01 .atc_inner .item.r_box span{white-space:pre-line}
#atc01 .atc_inner .item.r_box .tit{font-family:var(--font-recipekr);font-size:30px;line-height:45px;font-weight:300;color:#fff}
#atc01 .atc_inner .item.r_box form{display:flex;align-items:center;justify-content:space-between;gap:10px;max-width:500px;height:70px;padding:0 30px;background-color:#fff;border-radius:10px}
#atc01 .atc_inner .item.r_box input{all:unset;width:100%;font-size:16px}
#atc01 .atc_inner .item.r_box input[type=text]:focus{border:none !important}
#atc01 .atc_inner .item.r_box .btn-search{all:unset;display:flex;justify-content:center;align-items:center;width:36px;height:36px;cursor:pointer}
#atc01 .atc_inner .item.r_box .store-bg{position:absolute;bottom:0;right:0}

/* 반응형 [s] */
@media (max-width:1440px){
#atc01 .atc_inner .item.l_box .btn_wrap .link-download .btn-name strong{font-size:16px;word-break:keep-all}
#atc01 .atc_inner .item.r_box{overflow:hidden}
#atc01 .atc_inner .item.r_box .store-bg{bottom:-15px}
#atc01 .atc_inner .item.l_box .btn_wrap{flex-wrap:wrap}
}
@media (max-width:1230px){
#atc01 .atc_inner .item.l_box .tit strong{font-size:30px}
#atc01 .atc_inner .item.l_box .tit .app-bg{left:320px}
}
@media (max-width:1024px){
#atc01 .atc_inner .item{padding:30px}
#atc01 .atc_inner .item .tit{margin-bottom:26px}
#atc01 .atc_inner .item.l_box .tit{gap:8px}
#atc01 .atc_inner .item.l_box .tit span{font-size:21px}
#atc01 .atc_inner .item.l_box .tit strong{font-size:27px}
#atc01 .atc_inner .item.l_box .tit .app-bg{top:-40px;left:170px}
#atc01 .atc_inner .item.l_box .btn_wrap .link-download{flex-direction:column;gap:10px;text-align:center}
#atc01 .atc_inner .item.r_box .tit{font-size:27px}
#atc01 .atc_inner .item.r_box span{white-space:normal;word-break:keep-all}
#atc01 .atc_inner .item.r_box .store-bg img{width:300px}
}

@media (max-width:768px){
#atc01{padding:30px 15px 0}
#atc01 .atc_inner{flex-direction:column}
#atc01 .atc_inner .cont .text-box{display:flex;flex-direction:column;align-items:center}
#atc01 .atc_inner .item .tag{font-size:14px}
#atc01 .atc_inner .item.l_box .tit{align-items:center}
#atc01 .atc_inner .item.l_box .tit .app-bg{top:-42px;left:226px}
#atc01 .atc_inner .item.l_box .btn_wrap .link-download{flex-direction:row}
#atc01 .atc_inner .item.l_box .btn_wrap .link-download .btn-name{text-align:left}
#atc01 .atc_inner .item.r_box .tit{font-size:28px;line-height:42px}
#atc01 .atc_inner .item.r_box span{white-space:pre-line}
}

@media (max-width:480px){
#atc01 .atc_inner .item{padding:30px}
#atc01 .atc_inner .item .tag{font-size:13px}
#atc01 .atc_inner .item.l_box .tit span{font-size:15px;text-align:center}
#atc01 .atc_inner .item.l_box .tit strong{font-size:26px}
#atc01 .atc_inner .item.r_box .tit{max-width:310px;font-size:22px;line-height:1.5}
#atc01 .atc_inner .item.r_box .tit br{display:none}
#atc01 .atc_inner .item.l_box .tit .app-bg{top:-36px;left:195px}
#atc01 .atc_inner .item.l_box .app-bg img{width:55px}
#atc01 .atc_inner .item.l_box .btn_wrap .link-download img{width:26px}
#atc01 .atc_inner .item.r_box input{font-size:15px}
#atc01 .atc_inner .item.r_box span{white-space:normal}
}

@media (max-width:390px){
#atc01 .atc_inner .item .tag{font-size:clamp(5px, 3.59vw, 14px)}
#atc01 .atc_inner .item.l_box .tit strong{font-size:clamp(22px, 6.67vw, 26px);text-align:center}
#atc01 .atc_inner .item.l_box .btn_wrap .link-download{flex-wrap:wrap;justify-content:center;text-align:center;padding:15px}
#atc01 .atc_inner .item.l_box .btn_wrap .link-download .btn-name{text-align:center}
#atc01 .atc_inner .item.l_box .btn_wrap .link-download .btn-name strong{font-size:clamp(12px,4.10vw,16px)}
#atc01 .atc_inner .item.l_box .app-bg img{display:none}
#atc01 .atc_inner .item.r_box .tit{font-size:clamp(22px, 6.67vw, 26px);line-height:1.4;word-break:normal}
#atc01 .atc_inner .item.r_box form{height:60px;padding:0 15px}
#atc01 .atc_inner .item.r_box input{font-size:14px}
}
/* 반응형 [e] */