@charset "utf-8";

/* header -------------------------------------------------------------------------------------------------- */
.SubHeaderWrap {background:#5c96bb url(/image/company/header_bg.jpg) 50% 42% no-repeat;background-size:contain !important;}

/* 회사소개글 ----------------------------------------------------------------------------------------------------*/
.CompanyTxtWrap {max-width:994px;width:100%;margin:auto;}
.CompanyTxtWrap .AboutTitle {
    font-size:30px;font-family: sbfont;color:#8b8ba1;font-weight: 500;text-align:center;line-height:150%;
    word-wrap: break-word;word-break:keep-all;overflow-wrap:break-word;letter-spacing:-1px;margin-bottom:120px;
}
.CompanyTxtWrap .AboutTitle .other {color:#76ae28;}
.CompanyTxtWrap .AboutTitle strong {color:#33336e;font-weight: 600;}
.AboutLeap {display:flex;flex-wrap:wrap;gap:10px;}
.AboutLeap li {
    border-radius:20px;position:relative;flex:1 1 40%;padding:30px;text-align:center;word-wrap: break-word;word-break:keep-all;
    overflow-wrap:break-word;display:flex;min-height:387px;align-items:center;
}
.AboutLeap li h4 {font-size:25px;color:#7bb231;font-weight:600;margin-bottom:15px;align-items: center;}
.AboutLeap li div {font-size:18px;line-height:140%;color:#666;font-weight:400;}
.AboutLeap li div strong {color:#000;}
.AboutLeap li:nth-child(1) {background:url(/image/company/img_01.jpg) 50% 0 no-repeat;}
.AboutLeap li:nth-child(2) {background-color:#eff5e7;}
.AboutLeap li:nth-child(3) {background-color:#ddf0f8;}
.AboutLeap li:nth-child(3) h4 {color:#33336e;}
.AboutLeap li:nth-child(4) {background:url(/image/company/img_02.jpg) 50% 0 no-repeat;}
.AboutLeap li:nth-child(1)::before, .AboutLeap li:nth-child(4)::before {content:"";position:absolute;display:block;width:100%;left:0;}
.AboutLeap li:nth-child(1)::before {background:url(/image/company/img_01.png) 50% 100% no-repeat;height:104px;top:-103px;}
.AboutLeap li:nth-child(4)::before {background:url(/image/company/img_02.png) 50% 100% no-repeat;height:44px;top:-43px;}

/* 찾아오시는길 ----------------------------------------------------------------------------------------------------*/
.AddressInfo {padding-top:30px;}
.AddressInfo dl {display:flex;column-gap:40px;}
.AddressInfo dl dd {width:450px;flex-shrink:0;}
.AddressInfo dl dt {flex:1;}
.AddressInfo dl dt h4 {margin-bottom:15px;}
.AddressInfo dl li {padding:5px 0;font-size:18px;word-wrap: break-word;word-break:keep-all;overflow-wrap:break-word;line-height:130%;}
.AddressInfo dl li strong {color:#000;font-weight:600;margin-right:5px;}
#container.MapWrap {padding-bottom:451px;position:relative;}
#container.MapWrap .MapGroup {position:absolute;bottom:0;left:0;width:100%;}


/* 모바일 ------------------------------------------------------------------------------------------------------------------- */
@media screen and (max-width: 830px){
    /* 찾아오시는길 */
    .AddressInfo dl {flex-direction:column;align-items:center;}
    .AddressInfo dl dd {text-align:center;width:auto;}
    .AddressInfo dl dd img {margin:auto;}
}

@media screen and (max-width: 768px){
    /* 소개글 */
    .CompanyTxtWrap .AboutTitle {font-size: 28px;}
}

@media screen and (max-width: 720px){
    /* 소개글 */
    .CompanyTxtWrap .AboutTitle {margin-bottom:20%;}
    .AboutLeap {flex-direction:column;}
    .AboutLeap li:nth-child(1), .AboutLeap li:nth-child(1)::before, .AboutLeap li:nth-child(4), .AboutLeap li:nth-child(4)::before {background-size:100% auto;}
    .AboutLeap li:nth-child(1)::before {height:135px;top: -134px;}
    .AboutLeap li:nth-child(4)::before {height:60px;top: -59px;}
    .AboutLeap li:nth-child(2) {min-height:200px;margin-bottom:30px;}
}

@media screen and (max-width: 640px){
    /* 소개글 */
    .CompanyTxtWrap .AboutTitle {line-height: 140%;}
    .AboutLeap li h4 {font-size: 22px;}
    .AboutLeap li div {font-size: 17px}

    /* 찾아오시는길 */
    .AddressInfo dl li {font-size:16px;}
}

@media screen and (max-width: 540px){
    /* 소개글 */
    .AboutLeap li {min-height: 340px;}
}

@media screen and (max-width: 500px){
    /* 소개글 */
    .AboutLeap li {min-height: 280px;}
}

@media screen and (max-width: 480px){
    /* 소개글 */
    .CompanyTxtWrap .AboutTitle {font-size: 24px;}
    .AboutLeap li div {font-size: 16px;}
    .AboutLeap li h4 {font-size: 20px;}
}

@media screen and (max-width: 400px){
    /* 소개글 */
    .AboutLeap li {min-height: 210px;}
}

@media screen and (max-width: 320px){
    /* 소개글 */
    .CompanyTxtWrap .AboutTitle {line-height: 120%;font-size: 22px;}
}