@charset "utf-8";

/* 컨텐츠 타이틀 */
.sub_container .tit{display: flex; align-items: center; padding: 0 0 17px;}
.sub_container .tit h4{flex: 0 0 auto; font-size: 1.625rem; font-weight: var(--fwsb);}
.sub_container .tit h4.necessary{position: relative;}
.sub_container .tit h4.necessary:before{content: "필수입력항목"; position: absolute; top: 13px; right: -16px; display: block; width: 8px; height: 8px; border-radius: 50%; background-color: var(--theme); font-size: 0;}
.sub_container .tit h4 .point_font{font-size: 2.5rem; font-weight: var(--fwb);}
.sub_container .tit h4 .info.txt{font-size: 16px; font-weight: var(--fwm); color: var(--main);}
.sub_container .tit h4 .info.txt:after{content: none;}
.sub_container .tit h4 > label{line-height: inherit;;}
.sub_container .tit .more{margin-left: auto; margin-right: 8px; font-size: 14px; font-weight: var(--fwm); color: var(--sub_dim); align-self: flex-end;}
.sub_container .tit .more span{display: inline-flex; align-items: center;}
.sub_container .tit .more span:after{content: ""; display: inline-block; width: 6px; height: 6px; border-top: 2px solid var(--sub_bold); border-right: 2px solid var(--sub_bold); transform: rotate(45deg); margin: 0 0 0 7px;}

.sub_container .tit h4 + .tit_info{position: relative; display: inline-block; vertical-align: middle; margin: 8px 0 0 7px;}
.sub_container .tit h4 + .tit_info .info{position: relative; display: inline-flex; align-items: center; gap: 2px; font-size: 14px; font-weight: var(--fwm); color: var(--sub_bold); white-space: initial; text-align: left;}
.sub_container .tit h4 + .tit_info .info:after{content: "!"; display: inline-block; vertical-align: middle; margin: 0 0 0; width: 18px; height: 18px; background: url("/assets/site/img/common/tit_info.svg") no-repeat; background-size: contain; font-size: 0;}

.sub_container h5.hasBullet{position: relative; padding: 0 0 0 22px; margin-bottom: 16px; font-size: 26px; font-weight: var(--fwsb);}
.sub_container h5.hasBullet:before{content: ""; position: absolute; top: 9px; left: 0; display: block; width: 14px; height: 14px; border: 4px solid var(--main);}
.sub_container h5.hasBullet .point_font{font-size: 40px; line-height: 0;}
@media (max-width: 860px){
    .sub_container .tit{position: relative; /* 상품안내 레이어 위치 조정용도 */}
    .sub_container .tit h4 + .tit_info{position: static; /* 상품안내 레이어 위치 조정용도 */}
}
@media (max-width: 700px){
    .sub_container h5.hasBullet{font-size: 22px; padding: 0 0 0 18px; margin-bottom: 10px;}
    .sub_container h5.hasBullet:before{width: 12px; height: 12px; border-width: 3px; top: 7px;}
}
@media (max-width: 640px){
    .sub_container .tit{padding: 0 0 16px;}
    .sub_container .tit h4{font-size: 22px;}
    .sub_container .tit h4.necessary:before{top: 10px;}
    .sub_container .tit h4 .point_font{font-size: 36px;}
    .sub_container .tit h4 .info.txt{display: none;}

    .sub_container .tit h4 + .tit_info .info{font-size: 13px;}
    .sub_container .tit h4 + .tit_info .info:after{width: 15px; height: 15px; margin: 0 0 0 1px;}
}


/* 컨텐츠 스몰 타이틀 */
.sub_container .tit_s{display: flex; flex-wrap: wrap; font-size: 16px; font-weight: var(--fwsb); line-height: 150%; padding: 0 0 11px;}
.sub_container .tit_s .link{margin-left: auto; color: var(--dotted); text-decoration: underline; font-size: 14px;}


/* 컨텐츠 섹션 */
.sub_contents .sec{margin-top: 40px;}
.sub_contents .sec .grid_col3{display: grid !important; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(auto-fill, minmax(50px, auto)); grid-row-gap: var(--gap_s); grid-column-gap: 15px;}
.sub_contents .sec .grid_col4{display: grid !important; grid-template-columns: repeat(4, 1fr); grid-template-rows: repeat(auto-fill, minmax(50px, auto)); grid-row-gap: var(--gap_s); grid-column-gap: 15px;}
@media (max-width: 1024px){
    .sub_contents .sec .grid_xm_col3{display: grid !important; grid-template-columns: repeat(3, 1fr); grid-template-rows: repeat(auto-fill, minmax(50px, auto)); grid-row-gap: var(--gap_s); grid-column-gap: 15px;}
}
@media (max-width: 640px){
    .sub_contents .sec .grid_m_col1{display: grid !important; grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(auto-fill, minmax(50px, auto)); grid-row-gap: var(--gap_s); grid-column-gap: 15px;}
}


/* 인재정보 리스트 */
@media (max-width: 768px){
    .sub_contents .sec.tophuman > .con{display: grid !important; grid-template-columns: repeat(2, 1fr); grid-template-rows: repeat(auto-fill, minmax(50px, auto)); grid-row-gap: var(--gap_s); grid-column-gap: 15px;}
}
@media (max-width: 640px){
    .sub_contents .sec.tophuman > .con{display: grid !important; grid-template-columns: repeat(1, 1fr); grid-template-rows: repeat(auto-fill, minmax(50px, auto)); grid-row-gap: var(--gap_s); grid-column-gap: 15px;}
}


/* 회사소개 */
.company .top .title{font-size: 36px; font-weight: var(--fwb); line-height: 120%; padding: 13px 0 17px;}
.company .top .title span{display: inline-flex; align-items: center; gap: 10px;}
.company .top .title span:after{content: ""; display: inline-block; vertical-align: middle; margin: 0 0 0 12px; width: 72px; height: 2px; background-color: var(--main);}


.company .img{border-radius: 12px; overflow: hidden; margin: 2rem auto;}
.company .img img{width: 100%; height: auto;}

.company .txt {}
.company .txt .sign {margin-top: 40px; display: flex; justify-content: flex-end; font-weight: var(--fwb); gap: 10px; align-items: center;}
.company .txt .sign span {font-family: 'InkLipquid'; font-size: 38px; font-weight: normal;}

@media (max-width: 640px){
    .company .top .title{font-size: 26px;}
    .company .top .title span:after{width: 30px;}

    .company .img{/* aspect-ratio: 1 / 0.33; */}
    .company .img img{/* height: 100%; object-fit: cover; */}

    .company .txt .sign {flex-direction: column; gap: 2px; align-items: end;}
    .company .txt .sign span {display: block; font-size: 28px; line-height: 1;}

}
@media (max-width: 460px) {
    .company .top .title span {flex-direction: column; align-items: flex-start; gap: 3px;}
    .company .top .title span:after{content: none;}

    .company .txt .sub br:nth-of-type(5),
    .company .txt .sub br:nth-of-type(6),
    .company .txt .sub br:nth-of-type(9),
    .company .txt .sub br:nth-of-type(10),
    .company .txt .sub br:nth-of-type(13)  {
        display: none;
    }

}


/* 대표소개 */
.ceo {display: flex; margin-top: 40px !important;}
.ceo .txt {flex: 1;}
.ceo .txt .title {}
.ceo .txt .title p {color: var(--theme); font-weight: var(--fwb);}
.ceo .txt .title h5 {font-size: 34px; margin-top: 30px; position: relative;}
.ceo .txt .title h5::after {content: ''; display: block; width: 53px; height: 48px; background: url('/assets/site/img/contents/ceo_bg.png'); position: absolute; top: -10px; right: 35px;}

.ceo .txt .carrer {margin-top: 60px; display: flex; flex-direction: column; gap: 10px;}
.ceo .txt .carrer dl {display: flex; gap: 10px;}
.ceo .txt .carrer dl dt {width: 90px; font-weight: var(--fwb);}
.ceo .txt .carrer dl dd {}

.ceo .img {width: 453px;}
.ceo .img .sign {margin-top: 20px; display: flex; flex-direction: row; gap: 10px; align-items: center; justify-content: end; font-weight: var(--fwb);}
.ceo .img .sign span {font-family: 'InkLipquid'; font-size: 38px; font-weight: normal;}

@media (max-width: 1024px){
    .ceo .txt .title h5 {font-size: 30px; margin-top: 20px;}
    .ceo .txt .title h5::after {right: 80px;}
    .ceo .img {width: 350px;}
    .ceo .txt .carrer {margin-top: 40px;}

}
@media (max-width: 860px){
    .ceo .txt .title h5 {font-size: 24px; margin-top: 10px;}
    .ceo .img {width: 250px;}
    .ceo .txt .carrer dl dt {width: 80px;}


}
@media (max-width: 640px){
    .ceo {flex-direction: column; margin: 0 !important;}
    .ceo .txt {order: 2; margin-top: 20px;}
    .ceo .txt .title h5 {margin-top: 5px; font-size: 22px;}
    .ceo .txt .title h5::after {right: 0; width: 40px; height: 36px; background-size: cover;}

    .ceo .txt .carrer {margin-top: 20px;}
    .ceo .txt .carrer dl {flex-direction: column; gap: 5px;}
    .ceo .txt .carrer dl dt {width: 100%; border-bottom: 1px solid #dbdbdb;}

    .ceo .img {order: 1; width: 100%; text-align: center;}
    .ceo .img .sign {display: none;}

}
