@charset "utf-8"; /* ===================================================== */
/* 콘텐츠 공통 */
.sec-tit { margin-bottom: 1.6em; font-weight: 700; font-size: var(--font-32); line-height: 1.2; color: #222; } 
.sec-tit::after { display: inline-block; margin-left: 0.1em; content: '_'; color: var(--color-main); transform: translateY(-0.05em); } 

@media (hover: hover) and (pointer: fine) { } 
@media (max-width: 1280px) { } 
@media (max-width: 1024px) { } 
@media (max-width: 768px) { } 
@media (max-width: 576px) { } 
@media (max-width: 480px) { } 
/* 콘텐츠 공통 */
/* ===================================================== */


/* ===================================================== */
/* 기업정보 _ 회사소개 */
.company { margin-bottom: 180px; } 
.company .intro-box { background: linear-gradient(to right, rgb(34, 34, 34, .9), rgb(34, 34, 34, 0) 70%), url(../images/sub/company_bg.png) no-repeat; background-size: cover; border-radius: 15px; height: 550px; padding: 50px 50px 50px 100px; display: flex; align-items: center; } 
.company .intro-box .txt { color: #fff; } 
.company .intro-box .txt h4 { font-size: 60px; font-weight: 800; padding-bottom: 30px; margin-bottom: 30px; border-bottom: 1px solid rgb(255, 255, 255, .3); } 
.company .intro-box .txt h4 b { color: var(--color-blue); } 
.company .intro-box .txt p { font-size: 26px; font-weight: 300; color: rgb(255, 255, 255, .95); } 
.company .intro-box .txt p b { font-weight: 700; color: #fff; } 

@media (max-width: 1024px){
 .company .intro-box .txt h4 { font-size: 48px; } 
 .company .intro-box .txt p { font-size: 22px; } 
 .company .intro-box { background: linear-gradient(to right, rgb(34, 34, 34, .9), rgb(34, 34, 34, 0) 100%), url(../images/sub/company_bg.png) 70% 50% no-repeat; } 
 }
@media (max-width: 768px){
 .company .intro-box { background: linear-gradient(to right, rgb(34, 34, 34, .6), rgb(34, 34, 34, .6) 100%), url(../images/sub/company_bg.png) 100% 50% no-repeat; padding: 50px; justify-content: center; height: 400px; } 
 .company .intro-box .txt { text-align: center; } 
 .company .intro-box .txt h4 { font-size: 42px; } 
 .company .intro-box .txt p { font-size: 18px; } 
 }
@media (max-width: 576px){
 .company .intro-box { background: linear-gradient(to right, rgb(34, 34, 34, .6), rgb(34, 34, 34, .6) 100%), url(../images/sub/company_bg.png) 95% 50% no-repeat; height: 350px; } 
 .company .intro-box .txt h4 { font-size: 36px; } 
 .company .intro-box .txt p { font-size: 15px; } 
 }
@media (max-width: 480px){
 .company .intro-box { background: linear-gradient(to right, rgb(34, 34, 34, .6), rgb(34, 34, 34, .6) 100%), url(../images/sub/company_bg.png) 90% 50% no-repeat; height: 350px; padding: 20px; } 
 .company .intro-box .txt h4 { font-size: 32px; } 
 .company .intro-box .txt p { font-size: 14px; } 
 }
/* 기업정보 _ 회사소개 */
/* ===================================================== */


/* ===================================================== */
/* 기업정보 _ 연혁 */
.history { position: relative; margin-bottom: 25rem; } 
.history::before { opacity: 0.15; position: absolute; inset: 0; background-color: #ddd; mask: url(../images/common/symbol_optimized.svg) no-repeat center/55%; -webkit-mask: url(../images/common/symbol_optimized.svg) no-repeat center/55%; content: ''; } 
.history .year { display: flex; align-items: center; column-gap: 7%; position: relative; margin-bottom: 15rem; font-size: 9rem; } 
.history .year:where(:nth-child(odd)) { flex-direction: row-reverse; } 
/* 왼쪽이미지 */
.history .img-area { flex-shrink: 0; width: 60%; } 
.history .img-wrap { position: relative; filter: drop-shadow( var(--box-shadow-3)); } 
/* 오른쪽 텍스트 */
.history .txt-area { flex-grow: 1; padding-bottom: 0.2em; } 
.history .year-num { width: fit-content; margin-bottom: 0.3em; background: #eee var(--gradient-blue) text; background-clip: text; -webkit-background-clip: text; font-weight: 700; font-family: var(--font-montserrat); line-height: 1; color: transparent; white-space: nowrap; -webkit-text-fill-color: transparent; } 
.history .year-cont::before { display: block; opacity: 0.3; padding-top: 5px; margin-bottom: 0.25em; border: solid var(--color-main); border-width: 3px 0; content: ''; } 
.history .month { display: flex; align-items: baseline; padding-top: 0.9em; font-size: var(--font-18); } 
.history .month-num { flex-shrink: 0; width: 2em; font-weight: 600; font-size: calc(1em + 2px); color: #222; white-space: nowrap; transform: translateY(1px); } 
/* .history .month-num::after { content: '. '; } */
.history .month-desc { font-weight: 500; line-height: 1.35; margin-left: 20px; } 

@media (max-width: 1024px){
 .history .year { align-items: start; column-gap: 5%; font-size: 8rem; } 
 .history .img-area { width: 50%; } 
 .history .img-wrap img { object-fit: cover; aspect-ratio: 5 / 3; } 
 }
@media (max-width: 768px){
 .history .img-wrap img { aspect-ratio: 3 / 2; } 
 }
@media (max-width: 640px){
 .history::before { mask-size: 80%; -webkit-mask-size: 80%; } 
 .history .year { flex-direction: column-reverse; font-size: 7rem; } 
 .history .img-area { width: 100%; } 
 .history .img-wrap img { width: 100%; height: 5em; clip-path: polygon(0 0, 100% 0, 100% 100%, calc(100% - 2em) 100%, calc(100% - 2em) calc(100% - 1.8em), 0 calc(100% - 1.8em)); aspect-ratio: auto; } 
 .history .txt-area { width: 100%; margin-top: calc(-1.3em - 8px); } 
 .history .year-cont::before { padding-top: 4px; border-width: 2px 0; } 
 .history .month { font-size: var(--font-20); } 
 }
@media (max-width: 480px){
 .history .img-wrap img { height: auto; clip-path: none; aspect-ratio: 2 / 1; } 
 .history .txt-area { margin-top: 0.45em; } 
 }
/* 기업정보 _ 연혁 */
/* ===================================================== */

/* ===================================================== */
/* 기업정보 _ 오시는 길 */
.location { margin-bottom: 20rem; } 
.location .sec { position: relative; margin-bottom: 9rem; } 
.location .info { display: flex; align-items: center; position: absolute; border-top-right-radius: 0.8em; background-color: var(--color-main); font-size: var(--font-23); color: #fff; bottom: 0;} 
.location .sec:nth-child(even) .info { background-color: var(--color-mint); } 
.location .info dt { background: linear-gradient(var(--color-white-a4), var(--color-white-a4)) no-repeat right/1px 1.1em; font-weight: 600; } 
.location .info dt span { font-size: 1.2em; } 
.location .info :where(dt, dd) { padding: 0.8em 1.2em; } 
.location .api { height: calc(150px + 35rem); } 

@media (max-width: 1024px){
 .location .info { font-size: var(--font-20); } 
 }
@media (max-width: 576px){
 .location .info { position: relative; border-bottom-right-radius: 0; } 
 }
@media (max-width: 480px){
 .location .info { font-size: 16px; } 
 }
@media (max-width: 360px){
 .location .info { font-size: 15px; } 
 }
/* 기업정보 _ 오시는 길 */
/* ===================================================== */


/* ===================================================== */
/* 서비스 _ 주요기술 */
.tech { margin-bottom: 180px; } 
.tech-wrap { display: flex; column-gap: 120px; } 
.tech-wrap .diagram { flex-shrink: 0; position: sticky; top: 150px; align-self: start; align-content: start; } 
.tech-wrap .diagram img { -webkit-user-drag: none; } 
.tech-wrap .desc-wrap { flex-grow: 1; } 
.tech-wrap .desc { padding-bottom: 60px; border-bottom: 1px solid #ddd; } 
.tech-wrap .desc:nth-child(2) { margin: 60px 0; } 
.tech-wrap .desc:last-child { padding-bottom: 0; border-bottom: none; } 
.tech-wrap .desc h4 { font-size: 32px; color: #222; font-weight: 800; margin-bottom: 30px; position: relative; padding-left: 38px; } 
.tech-wrap .desc h4:before { position: absolute; top: 50%; left: 0; transform: translateY(-50%); content: ""; width: 28px; height: 28px; background: url(../images/sub/business_check_tech.png) no-repeat; } 
.tech-wrap .desc li:last-child { margin-top: 20px; } 
.tech-wrap .desc li em { color: #333; font-size: 24px; font-weight: 600; margin-bottom: 10px; display: inline-block; } 
.tech-wrap .desc:last-child h4 { margin-bottom: 20px; } 
.tech-wrap .desc li p { color: #666; font-size: 18px; line-height: 1.75; } 

@media (max-width: 1024px) {
    .tech-wrap { display: flex; column-gap: 60px; } 
    .tech-wrap .diagram { flex-shrink: unset; width: 100em; } 
    .tech-wrap .desc h4 { font-size: 24px; padding-left: 32px;} 
    .tech-wrap .desc h4:before {width: 24px; height: 24px; background-size: contain;} 
    .tech-wrap .desc li em { font-size: 20px; } 
    .tech-wrap .desc li p { font-size: 16px; } 
}
@media (max-width: 768px) {
    .tech-wrap .desc h4 { font-size: 22px; padding-left: 26px;} 
    .tech-wrap .desc h4:before {width: 20px; height: 20px;} 
    .tech-wrap .desc li em { font-size: 16px; } 
    .tech-wrap .desc li p { font-size: 14px; } 
}
@media (max-width: 574px) {
    .tech-wrap { flex-direction: column; row-gap: 60px; } 
    .tech-wrap .diagram { flex-shrink: unset; position: relative; top: 0; align-self: start; align-content: start; width: 100%;} 
    .tech-wrap .desc { padding-bottom: 40px;} 
    .tech-wrap .desc:nth-child(2) { margin: 40px 0; } 
}
/* 서비스 _ 주요기술 */
/* ===================================================== */


/* ===================================================== */
/* 고객센터 _ 영업담당자 */
.contact { margin-bottom: 180px; } 
.contact .info-area { background: url(../images/sub/contact_visual.png) 50% 50% no-repeat; background-size: cover; padding: 70px 40px; min-height: 450px; display: flex; align-items: center; position: relative; column-gap: 100px; justify-content: center; } 
.contact .info-area:after { position: absolute; content: ""; width: 200px; height: 116px; right: 0; bottom: 0; background: url(../images/sub/contact_logo.svg) no-repeat; background-size: contain; } 
.contact .info-area ul li { font-size: 24px; color: #fff; display: flex; padding: 20px; border-bottom: 1px solid rgb(255, 255, 255, .3); position: relative; } 
.contact .info-area .manager h4 { color: #fff; font-size: 26px; font-weight: 700; margin-bottom: 10px; } 
.contact .info-area ul li:before { content: ""; width: 4px; height: 17px; position: absolute; left: 0; top: 50%; transform: translateY(-50%); background-color: #fff; } 
.contact .info-area ul li em { margin-right: 70px; } 
.contact .info-area ul li a { transition: .3s; } 
.contact .info-area ul li a:hover { color: #28D0FF; } 
@media (max-width:1919px){
 .contact .info-area ul li em { margin-right: 30px; } 
 .contact .info-area { column-gap: 50px; } 
 }
@media (max-width:1024px){
 .contact .info-area .manager h4 { font-size: 22px; } 
 .contact .info-area ul li { font-size: 18px; } 
 .contact .info-area { min-height: 350px; } 
 }
@media (max-width: 850px){
 .contact .info-area { flex-direction: column; align-items: unset; row-gap: 50px; } 
 }
@media (max-width: 768px){
 .contact .info-area { justify-content: center; padding: 35px; } 
 .contact .info-area .manager h4 { font-size: 20px; } 
 }
@media (max-width: 574px){
 .contact .info-area ul li { justify-content: space-between; column-gap: 50px; font-size: 16px; } 
 .contact .info-area ul li em { width: auto; margin-right: unset; } 
 }
@media (max-width: 480px){
 .contact .info-area .manager h4 { font-size: 18px; } 

 .contact .info-area ul { width: 100%; } 
 .contact .info-area ul li { flex-direction: column; padding-left: 0; } 
 .contact .info-area ul li::before { display: none; } 
 .contact .info-area ul li em { margin-bottom: 5px; } 
 }
/* 고객센터 _ 영업담당자 */
/* ===================================================== */



/* ===================================================== */
/* 이메일무단수집거부 */
.refusal-mail { padding: 10rem 0 20rem; text-align: center; .refusal-mail-wrap { padding: 6rem 5% 7rem; border: 1px solid #eee; } 
 .refusal-mail-img { display: flex; justify-content: center; height: 18rem; margin-bottom: 4rem; & svg { width: 100%; height: 100%; } 
 }
 .refusal-mail-tit { margin-bottom: 1rem; font-weight: 700; font-size: 2.8rem; color: #222; } 
 .refusal-mail-subtit { display: block; margin-bottom: 1.5rem; font-weight: 500; font-size: 2rem; color: #444; & b { font-weight: 700; color: var(--color-main); } 
 }
 .refusal-mail-desc { font-size: 18px; } 
 @media (max-width: 1280px){
 .refusal-mail-desc { font-size: 16px; } 
 }
 @media (max-width: 1024px){
 .refusal-mail-desc br { display: none; } 
 }
 @media (max-width: 768px){
 .refusal-mail-subtit { font-size: 17px; } 
 .refusal-mail-desc { font-size: 15px; } 
 } 
 }
/* 이메일무단수집거부 */
/* ===================================================== */