@charset "utf-8";

#shopAbout .inner{display:flex;align-items:end;column-gap:100px;width:100%;max-width:var(--mainsize);margin:0 auto;padding:164px 0 180px;border-left:1px solid #e1e1e1}

#shopAbout .l_box{padding-left:120px;font-weight:700;color:#111}
#shopAbout .l_box .s_tit{font-weight:700;color:var(--primary)}
#shopAbout .l_box .mean_img{position:relative;margin-top:50px}
#shopAbout .l_box .mean_img:before{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);content:'';z-index:-1;width:431px;height:217px;background:url('./bg_img.png') no-repeat center}
#shopAbout .l_box .mean_txt{display:flex;align-items:center;column-gap:20px;line-height:1}
#shopAbout .l_box .mean_txt span{font-size:55px}
#shopAbout .l_box .mean_txt img{width:250px}
#shopAbout .l_box .mean_txt.trade img{margin-left:auto}
#shopAbout .l_box .and{margin:20px 0;font-size:35px;line-height:1;text-align:center}

#shopAbout .r_box p{white-space:pre-line}
#shopAbout .r_box p span{display:block;margin-bottom:26px;font-size:16px;font-weight:700;text-decoration:underline;color:#111}
#shopAbout .r_box .go_btn{display:block;position:relative;width:118px;margin-top:64px;padding-bottom:14px;font-size:14px;font-weight:500;border-bottom:3px solid #e1e1e1;transition:all .3s}
#shopAbout .r_box .go_btn svg{position:absolute;right:-6px;top:2px;height:18px;transition:all .3s}
#shopAbout .r_box .go_btn svg.on{right:10px;top:21px;opacity:0;color:var(--primary)}

/* 모바일 호버 X */
@media (hover: hover) {
#shopAbout .r_box .go_btn:hover{border-bottom:3px solid var(--primary)}
#shopAbout .r_box .go_btn:hover svg{opacity:0;right:-12px;top:0px}
#shopAbout .r_box .go_btn:hover svg.on{right:-6px;top:2px;opacity:1}
}

/* 반응형 [s] */
@media (max-width:1530px){
#shopAbout .inner{max-width:none;border-left:none}
}
@media (max-width:1460px){
#shopAbout .inner{justify-content:center;column-gap:70px;width:calc(100% - 80px);margin:0;padding:164px 50px 180px}
#shopAbout .l_box{padding-left:0}
#shopAbout .l_box .mean_txt span{font-size:50px}
}
@media (max-width:1230px){
#shopAbout .inner{justify-content:flex-start;column-gap:0;width:calc(100% - 60px);padding:144px 30px 160px}
#shopAbout .l_box{width:495px}
#shopAbout .r_box{width:calc(100% - 495px);padding-left:70px}
#shopAbout .r_box p{white-space:normal;word-break:keep-all}
}
@media (max-width:1024px){
#shopAbout .inner{align-items:flex-start;width:100%;padding:114px 30px 130px}
#shopAbout .l_box{width:417px}
#shopAbout .l_box .mean_img:before{width:375px;height:100%;background-size:contain}
#shopAbout .l_box .mean_txt{column-gap:15px}
#shopAbout .l_box .mean_txt span{font-size:45px}
#shopAbout .l_box .mean_txt img{width:200px}
#shopAbout .l_box .and{margin:15px 0;font-size:30px}
#shopAbout .r_box{width:calc(100% - 417px);padding:70px 0 0 50px}
}
@media (max-width:768px){
#shopAbout .inner{display:block;padding:84px 15px 100px}
#shopAbout .l_box .mean_img{margin-top:35px}
#shopAbout .r_box{width:100%;padding:70px 0 0 0}
#shopAbout .r_box p span{font-size:15px}
}
@media (max-width:480px){
#shopAbout .inner{padding:67px 15px 70px}
#shopAbout .l_box{width:100%}
#shopAbout .l_box .mean_img{width:351px;margin-top:33px}
#shopAbout .l_box .mean_img:before{width:268px}
#shopAbout .l_box .s_tit{font-size:13px}
#shopAbout .l_box .mean_txt span{font-size:37px}
#shopAbout .l_box .mean_txt img{width:170px}
#shopAbout .l_box .and{font-size:20px}
#shopAbout .r_box{padding-top:55px}
#shopAbout .r_box p span{margin-bottom:20px}
#shopAbout .r_box .go_btn{width:100px;margin:40px 0 0 auto;padding-bottom:8px;border-bottom:2px solid #e1e1e1;font-size:13px}
#shopAbout .r_box .go_btn svg{height:17px}
}
@media (max-width:380px){
#shopAbout .inner{padding:57px 15px 60px}
#shopAbout .l_box .mean_img{width:290px}
#shopAbout .l_box .mean_img:before{width:225px}
#shopAbout .l_box .mean_txt span{font-size:30px}
#shopAbout .l_box .mean_txt img{width:140px}
#shopAbout .l_box .and{margin:10px 0;font-size:18px}
}
/* 반응형 [e] */