@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 > section:not(:nth-child(3)) { margin-bottom: 13rem; } 

/* sec1 - introduction ---------- */
.company-intro { display: flex; } 
.company-intro .txt { flex-grow: 1; position: relative; padding: 8.5rem 12% 8.5rem var(--inner-padding); margin-right: -8%; margin-bottom: 8.5rem; border-radius: 0 1.5rem 1.5rem 0; background-color: #f9f9f9; box-shadow: var(--box-shadow-3); animation: fade-left .8s both paused; } 
.company-intro .txt h4 { z-index: 5; position: absolute; top: 11.5rem; left: var(--inner-padding); font-weight: 600; font-size: var(--font-16); font-family: var(--font-montserrat); letter-spacing: 0.075em; color: #aaa; writing-mode: vertical-rl; } 
.company-intro .txt p { position: relative; width: fit-content; margin: auto; font-size: var(--font-25); } 
.company-intro .txt::before { position: absolute; left: var(--inner-padding); width: 7.8rem; height: 5.2rem; background: url(../images/common/ico_quote.svg) no-repeat center/contain; content: ''; } 
.company-intro .txt p span { font-weight: 800; color: var(--color-main); } 
.company-intro .txt p strong { font-weight: 700; color: #222; } 
.company-intro .img { flex-shrink: 0; position: relative; width: 47%; margin-top: 8.5rem; margin-left: auto; animation: fade-in 1.6s .5s both paused; } 
.company-intro .img img { position: absolute; width: 100%; height: 100%; border-radius: 1.5rem 0 0 1.5rem; box-shadow: var(--box-shadow-3); object-fit: cover; } 

.company-intro.aos-animate :is(.txt, .img) { animation-play-state: running; } 

/* sec2 - VISION ---------- */
.company-vision { font-size: 10px; } 
.company-vision .desc { margin-bottom: 2em; font-weight: 800; font-size: 4.5rem; text-align: center; color: #222; } 
.company-vision .desc .year { display: inline-block; } 
.company-vision .desc em { display: block; font-weight: 700; font-size: 0.8em; } 
.company-vision .desc em b { color: var(--color-main); } 
.company-vision .desc em b:nth-of-type(2) { color: var(--color-blue); } 
.company-vision .desc .char { animation: fade-in .6s ease-in-out both calc( 0.6s + var(--char-index) * 0.025s ) paused; } 
.company-vision .desc.aos-animate .char { animation-play-state: running; } 
/* list */
.company-vision .list { display: flex; justify-content: space-between; align-items: center; font-weight: 700; text-align: center; color: #fff; } 
.company-vision .item { position: relative; width: 25%; max-width: 37rem; } 
.company-vision .item::before { display: block; width: 100%; padding-top: 100%; border: 2px dashed #ddd; border-radius: 50%; content: ''; } 
.company-vision .item-txt { display: grid; place-content: center center; position: absolute; inset: 2.5em; border-radius: 50%; background: var(--bg) no-repeat center/cover; outline: 2px solid transparent; outline-offset: -2.5em; transition: inset .3s, outline-color .3s; } 
.company-vision .item-txt::before { position: absolute; top: 50%; left: 50%; width: 3.2em; height: 3.2em; background: linear-gradient(#fff, #fff) no-repeat center/100% 2px, linear-gradient(#fff, #fff) no-repeat center/2px 100%; content: ''; transform: translate(-50%, -50%); transition: transform .3s, opacity .2s; } 
.company-vision .item-num { position: absolute; inset: auto 0 15%; font-size: var(--font-20); transition: .3s; } 
.company-vision .item-desc { opacity: 0; font-size: 2.3em; transition: opacity .3s; } 
.company-vision .item-1 { --bg: url(../images/sub/company_vision_bg01.jpg); } 
.company-vision .item-2 { --bg: url(../images/sub/company_vision_bg02.jpg); } 
.company-vision .item-3 { --bg: url(../images/sub/company_vision_bg03.jpg); } 
/* line */
.company-vision .line { flex-grow: 1; position: relative; margin: 0 -1px; border-top: 2px dashed #ddd; } 
.company-vision .line::before, 
.company-vision .line::after { z-index: 2; position: absolute; top: 50%; width: 12px; height: 12px; border: 2px solid #ddd; border-radius: 50%; background-color: #fff; content: ''; } 
.company-vision .line::before { left: 0; transform: translate(-50%, -50%); } 
.company-vision .line::after { right: 0; transform: translate(50%, -50%); } 

/* sec3 - 목표 ---------- */
.company-goal { overflow: hidden; padding: 12rem 0; background-color: #f9f9f9; } 
.company-goal .list { counter-reset: company-goal; font-size: 3.6rem; } 
.company-goal .item { display: flex; min-height: 11em; counter-increment: company-goal; } 
.company-goal .img { position: relative; width: 50%; } 
.company-goal .img img { position: absolute; width: 100%; height: 100%; border-radius: 1.5rem 0 0 1.5rem; object-fit: cover; animation: blur-zoom-in 0.9s cubic-bezier(0, 0, 0.26, 0.95) both paused, fade-in 1.1s both paused; } 

.company-goal .item.aos-animate :is(.img img, .desc) { animation-play-state: running; } 
.company-goal .desc { display: grid; align-content: center; position: relative; width: 50%; padding: 0.6em 8%; animation: fade-in 1.1s both 0.6s paused; } 
.company-goal .desc::before { opacity: 0.2; position: absolute; top: 50%; right: 0; content: counter(company-goal, decimal-leading-zero); font-weight: 800; font-size: calc(2em + 30px); font-family: var(--font-montserrat); color: var(--color-main); transform: translateY(-50%); } 
.company-goal .desc dt { margin-bottom: 0.6em; font-weight: 700; color: #222; } 
.company-goal .desc .mark-hyphen { font-weight: 500; font-size: var(--font-23); } 
/* 짝수 */
.company-goal .item:where(:nth-child(even)) { flex-direction: row-reverse; text-align: right; } 
.company-goal .item:where(:nth-child(even)) .img img { border-radius: 0 1.5rem 1.5rem 0; } 
.company-goal .item:where(:nth-child(even)) .desc::before { right: auto; left: 0; } 
.company-goal .item:where(:nth-child(even)) .desc .mark-hyphen { justify-content: end; } 

/* sec4 - 원칙 ---------- */
.company-rule { padding: 12rem 0 18rem; margin-bottom: 0 !important; background: url(../images/sub/company_rule_bg.jpg) no-repeat center/cover; color: #fff; } 
.company-rule .sec-tit { color: inherit; } 
.company-rule .sec-tit::after { color: var(--color-ice); } 
.company-rule .cont { display: flex; column-gap: 4%; padding-top: 1em; font-size: var(--font-25); } 
.company-rule .cont-wrap { flex: 1; position: relative; padding: 3em 2%; border: 1px solid var(--color-white-a6); border-radius: 2rem; background-color: var(--color-white-a2); box-shadow: var(--box-shadow-3); backdrop-filter: blur(1rem); } 
.company-rule .cont-tit { position: absolute; top: 0; left: 50%; width: 8em; padding: 0.55em 0; border-radius: 5em; background-image: var(--gradient-blue); box-shadow: var(--box-shadow-3); font-weight: 600; letter-spacing: normal; text-align: center; transform: translate(-50%, -50%); } 
.company-rule .cont-list { width: fit-content; margin: auto; font-size: var(--font-16); } 
.company-rule .cont-item { display: flex; align-items: center; column-gap: 1em; padding: 0.375em; padding-right: 2em; margin-top: 1.25em; border: 1px solid #fff; border-radius: 5rem; } 
.company-rule .cont-item span { flex-shrink: 0; width: 4.2em; padding: 0.35em 0.75em; border-radius: 5em; } 
.company-rule .cont-item p { font-weight: 500; font-size: calc(1em + 1px); line-height: 1.2; } 
.company-rule .cont-wrap:nth-child(2) .cont-tit { background-image: var(--gradient-mint); } 
.company-rule .cont-wrap:nth-child(2) .txt-bg { background-color: var(--color-mint); } 

@media (max-width: 1280px) { /* sec1 - introduction ---------- */
 .company-intro .txt { padding-right: 6%; margin-right: -6%; } 
 /* sec2 - VISION ---------- */
 .company-vision { font-size: 0.78125vw; } 
 .company-vision .item { width: 27%; max-width: none; } 
 /* sec5 - 원칙 ---------- */
 .company-rule .cont { column-gap: 2%; } 
 }
@media (max-width: 1024px) { /* sec1 - introduction ---------- */
 .company-intro .txt { overflow: hidden; padding-bottom: 9.5rem; } 
 .company-intro .txt h4 { top: auto; bottom: -0.26em; font-size: 5vw; color: #eee; writing-mode: horizontal-tb; } 
 .company-intro .txt p { margin-left: 1em; font-size: var(--font-20); } 
 .company-intro .txt::before { opacity: 0.75; top: 6.25rem; } 
 /* sec2 - VISION ---------- */
 .company-vision .item { width: 30%; } 
 .company-vision .item::before { border-width: 1px; } 
 .company-vision .item-txt { outline-width: 1px; } 
 .company-vision .item-desc { font-size: calc(1.5em + 10px); } 
 .company-vision .line { margin: 0; border-width: 1px; } 
 .company-vision .line::before, 
 .company-vision .line::after { width: 8px; height: 8px; border-width: 1px; } 
 /* sec3 - 목표 ---------- */
 .company-goal .list { font-size: var(--font-25); } 
 .company-goal .desc { padding: 1.5rem 6%; } 
 .company-goal .desc .mark-hyphen { font-size: var(--font-18); } 
 /* sec5 - 원칙 ---------- */
 .company-rule .cont-wrap { padding: 2.6em 2%; } 
 .company-rule .cont-list { width: 100%; margin: auto; } 
 }
@media (max-width: 768px) { /* sec1 - introduction ---------- */
 .company-intro { flex-direction: column-reverse; } 
 .company-intro .txt { max-width: 670px; padding: 14.5rem var(--inner-padding) calc(4rem + 9vw); margin: -6rem var(--inner-padding) 0 0; } 
 .company-intro .txt::before { top: 11.25rem; } 
 .company-intro .txt h4 { font-size: 9vw; } 
 .company-intro .txt p { margin: 0 1em; } 
 .company-intro .txt br { display: none; } 
 .company-intro .img { width: 70%; margin-top: 0; aspect-ratio: 12 / 7; } 
 /* sec5 - 원칙 ---------- */
 .company-rule .cont { flex-direction: column; row-gap: 10rem; } 
 .company-rule .cont-wrap { padding: 2.3em 4% 2.5em; } 
 .company-rule .cont-list { max-width: 520px; font-size: var(--font-18); } 
 .company-rule .cont-item { column-gap: 0.75em; } 
 .company-rule .cont-item p { font-size: inherit; } 
 }
@media (min-width: 641px) { /* sec2 - VISION ---------- */
 .company-vision .item.on .item-txt { inset: 0; outline-color: #fff; } 
 .company-vision .item.on .item-txt::before { opacity: 0; transform: translate(-50%, -150%); } 
 .company-vision .item.on .item-desc { opacity: 1; } 
 .company-vision .item.on .item-num { opacity: 0; } 
 }
@media (max-width: 640px) { /* sec1 - introduction ---------- */
 .company-intro .img { width: 80%; } 
 /* sec2 - VISION ---------- */
 .company-vision { font-size: calc(0.45vw + 4px); } 
 .company-vision .desc { font-size: 4em; } 
 .company-vision .list { flex-direction: column; } 
 .company-vision .item { width: 100%; max-width: 60em; } 
 .company-vision .item::before { display: none; } 
 .company-vision .item-txt { position: relative; inset: auto; padding: 7.5em 0; border-radius: 5em; background-color: var(--color-black-a4); background-blend-mode: overlay; outline-color: var(--color-white-a4); outline-offset: -2em; } 
 .company-vision .item-txt::before { opacity: 0.8; position: relative; top: auto; margin: 2.4em 0 2em; transform: translateX(-50%); } 
 .company-vision .item-desc { opacity: 1; font-size: 3.4em; } 
 .company-vision .item-desc .br1024 { display: none; } 
 .company-vision .item-num { order: -5; position: relative; inset: auto; font-size: 3.8em; } 
 .company-vision .line { width: 2px; height: 10em; border-top: 0; background-color: #ddd; } 
 .company-vision .line::before { top: 0; left: 50%; transform: translate(-50%, -50%); } 
 .company-vision .line::after { top: 100%; right: 50%; transform: translate(50%, -50%); } 
 /* sec3 - 목표 ---------- */
 .company-goal .item { flex-direction: column; text-align: left; } 
 .company-goal .item .img { width: 100%; } 
 .company-goal .item .img img { position: relative; border-radius: 3rem 3rem 0 0; aspect-ratio: 5 / 2; } 
 .company-goal .item .desc { width: 100%; padding: 3rem 3vw 6rem; } 
 .company-goal .item:last-child .desc { padding-bottom: 2rem; } 
 .company-goal .item .desc::before { opacity: 1; top: 0; right: 3vw; left: auto; font-size: 20vw; color: #f9f9f9; transform: translateY(-77%); } 
 .company-goal .item .desc .mark-hyphen { justify-content: start; font-size: var(--font-20); } 
 }
@media (max-width: 375px) { /* sec1 - introduction ---------- */
 .company-intro .txt p { font-size: 15px; } 
 }
/* 기업정보 _ 회사소개 */
/* ===================================================== */


/* ===================================================== */
/* 기업정보 _ 연혁 */
.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; } 
 }
/* 기업정보 _ 연혁 */
/* ===================================================== */


/* ===================================================== */
/* 기업정보 _ CI 소개 */
.ci { margin-bottom: 18rem; } 

/* 소개글 */
.ci-intro { display: grid; container-type: inline-size; } 
.ci-intro .sec-header { z-index: 1; position: relative; padding: 8cqw 0 11cqw; text-align: center; } 
.ci-intro .sec-header.aos-animate mark { background-size: 100% 50%; } 
.ci-intro .sec-tit { margin-bottom: 0.9em; content: '_'; } 
.ci-intro .sec-desc { font-size: var(--font-25); } 
.ci-intro .sec-desc mark { padding: 0.1em; background: linear-gradient(rgba(0, 168, 255, 0.25), rgba(0, 168, 255, 0.25)) no-repeat left bottom/0 50%; font-weight: 700; color: #222; transition: .75s .3s; } 
.ci-intro .sec-desc strong { font-weight: 800; color: var(--color-main); } 
/* 다이어그램 */
.ci-intro .diagram { position: relative; aspect-ratio: 3 / 2; } 
.ci-intro .list { display: grid; grid-template-areas: 
 "desc1 term desc3"
 "..... desc2 ....."; grid-template-rows: repeat(2, 1fr); place-items: center center; position: absolute; inset: 0; } 
/* 원형 장식 */
.ci-intro .list::before, 
.ci-intro .list::after { grid-area: term; position: absolute; border-radius: 50%; content: ''; pointer-events: none; } 
.ci-intro .list::before { inset: -2cqw; background-color: #f9f9f9; background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='100%' ry='100%' stroke='%23CCCCCCCC' stroke-width='3' stroke-dasharray='6%2c 14' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e"); outline: 2px dashed #eee; outline-offset: 7.5cqw; } 
.ci-intro .list::after { width: 100cqw; height: 100cqw; outline: 1px solid #f2f2f2; outline-offset: calc(-5.8cqw - 1px); } 

/* 항목 */
.ci-intro .item { z-index: 1; position: relative; animation: var(--an) 0.8s var(--ad) both paused; } 
.ci-intro .diagram.aos-animate .item { animation-play-state: running; } 
.ci-intro .item::before { display: block; padding-top: 100%; border-radius: 50%; content: ''; } 
.ci-intro .item-inner { display: flex; justify-content: center; align-items: center; position: absolute; inset: 0; } 
/* 중앙 로고 */
.ci-intro .term { grid-area: term; width: 75%; max-width: 35rem; border-radius: 50%; outline: 22.5cqw solid rgba(0, 0, 0, 0.015); } 
.ci-intro .term::before { background-color: #fff; outline: 1px solid #ccc; } 
.ci-intro .term img { width: 62%; } 
/* 설명 */
.ci-intro .desc { width: 65%; max-width: 30rem; font: 700 2.85714285cqw/1.15 var(--font-montserrat); text-align: center; color: #fff; } 
.ci-intro .desc::before { background-image: var(--bg); } 
.ci-intro .desc b { color: var(--color-main); } 
.ci-intro .desc1 { --bg: linear-gradient(125deg, var(--color-blue) 30%, var(--color-main) 70%); --an: fade-right; --ad: .3s; grid-area: desc1; } 
.ci-intro .desc2 { --bg: linear-gradient(125deg, var(--color-mint) 30%, var(--color-blue) 70%); --an: fade-down; --ad: .6s; grid-area: desc2; } 
.ci-intro .desc3 { --bg: linear-gradient(125deg, var(--color-blue) 30%, var(--color-main) 70%); --an: fade-left; --ad: .9s; grid-area: desc3; } 

@media (max-width: 1024px){
 .ci-intro .sec-header { padding-bottom: 13cqw; } 
 }
@media (max-width: 768px){
 .ci-intro .sec-desc { font-size: 3.1cqw; } 
 .ci-intro .sec-header { padding-bottom: 22cqw; } 
 }
@media (max-width: 640px){
 .ci-intro .list::before { inset: -15cqw; outline-width: 0; } 
 .ci-intro .list::after { outline-offset: -1px; } 
 .ci-intro .term { width: 100%; max-width: none; outline-width: 25.5cqw; } 
 .ci-intro .term img { width: 65%; } 
 .ci-intro .desc { width: 85%; max-width: none; font-size: 3.6cqw; } 
 .ci-intro .desc1 { justify-self: start; } 
 .ci-intro .desc2 { align-self: end; } 
 .ci-intro .desc3 { justify-self: end; } 
 }
@media (max-width: 576px){
 .ci-intro .sec-desc { font-size: 16px; } 
 .ci-intro .sec-desc br { display: none; } 
 .ci-intro .diagram { position: relative; aspect-ratio: 3 / 2; } 
 }
@media (max-width: 480px){
 .ci-intro .diagram { aspect-ratio: 3 / 4; } 
 .ci-intro .list { grid-template-areas: 
 "..... term ....."
 "..... deco ....."
 "desc1 deco desc3"
 "..... desc2 ....."; grid-template-rows: repeat(4, 1fr); } 
 .ci-intro .list::before { inset: -18cqw; background-image: none; outline-width: 1px; outline-color: #ddd; outline-offset: 0; } 
 .ci-intro .term { z-index: 5; position: absolute; width: 120%; outline-width: 0; } 
 .ci-intro .desc { --an: fade-zoom-out; position: absolute; width: 100%; width: 110%; font-size: 5cqw; } 
 .ci-intro .desc::after { --cdh: 37cqw; position: absolute; bottom: 95%; width: 1px; height: 0; background: linear-gradient(to bottom, #ddd 4px, transparent 4px) repeat-y left / 100% 8px; content: ''; transform-origin: bottom; animation: ci-dash 0.8s calc(var(--ad) + .2s) both paused; } 
 .ci-intro .desc1::after { right: 25%; transform: rotate(22deg); } 
 .ci-intro .desc2::after { --cdh: 60cqw; bottom: 100%; left: calc(50% - 1px); animation-duration: .6s; } 
 .ci-intro .desc3::after { left: 25%; transform: rotate(-22deg); animation-delay: 1s; } 
 .ci-intro .diagram.aos-animate .desc::after { animation-play-state: running; } 
 @keyframes ci-dash { to { height: var(--cdh); } 
 } 
 } 
/* 기업정보 _ CI 소개 */
/* ===================================================== */


/* ===================================================== */
/* 기업정보 _ 오시는 길 */
.location { margin-bottom: 20rem; } 
.location .sec { position: relative; margin-bottom: 9rem; } 
.location .info { display: flex; align-items: center; position: absolute; border-bottom-right-radius: 0.8em; background-color: var(--color-main); font-size: var(--font-23); color: #fff; } 
.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; } 
 }
/* 기업정보 _ 오시는 길 */
/* ===================================================== */


/* ===================================================== */
/* 서비스 _ 품질인증 */

/* sec1 - 품질관리시스템 */
.quality { overflow: hidden; } 
.quality-system { margin-bottom: 12rem; } 
.quality-system .sec-header { margin-bottom: 6.5rem; text-align: center; } 
.quality-system .sec-header h4 { margin-bottom: 0.2em; font-weight: 800; font-size: 6.4rem; letter-spacing: 0.05em; color: var(--color-main); } 
.quality-system .sec-header p { font-weight: 600; font-size: var(--font-25); letter-spacing: 0.5em; white-space: nowrap; transform: translateX(0.25em); } 
.quality-system .sec-header p b { font-weight: 800; color: var(--color-main); } 

/* 다이어그램 */
.quality-system .diagram .arrow { height: 26rem; margin: -6.5rem 0 5.5rem; background: url(../images/common/arrow_grad.svg) no-repeat center/contain; } 

/* 다이어그램 상, 하단 */
.quality-system .diagram .list { z-index: 5; display: flex; column-gap: 3%; position: relative; padding: 1.8em 3%; border: 3px dashed var(--color-mint); border-radius: 2rem; font-size: var(--font-25); } 
.quality-system .diagram .list li { display: flex; overflow: hidden; flex: 1; border-radius: 1rem; outline: 1px solid var(--color-main); outline-offset: -1px; } 
.quality-system .diagram .list li::before { flex-shrink: 0; width: 6em; background: var(--color-main) var(--ico, url(../images/sub/quality_system_ico01.svg)) no-repeat center/7.2rem; content: ''; } 
.quality-system .diagram .list li span { display: flex; flex-grow: 1; justify-content: center; align-items: center; min-height: 6em; padding: 0.5em 0.8em; font-weight: 700; text-align: center; color: #222; } 
.quality-system .diagram .list.top li:nth-child(1) { --ico: url(../images/sub/quality_system_ico01.svg); } 
.quality-system .diagram .list.top li:nth-child(2) { --ico: url(../images/sub/quality_system_ico02.svg); } 
.quality-system .diagram .list.top li:nth-child(3) { --ico: url(../images/sub/quality_system_ico03.svg); } 
.quality-system .diagram .list.bottom li:nth-child(1) { --ico: url(../images/sub/quality_system_ico04.svg); } 
.quality-system .diagram .list.bottom li:nth-child(2) { --ico: url(../images/sub/quality_system_ico05.svg); } 
.quality-system .diagram .list.bottom li:nth-child(3) { --ico: url(../images/sub/quality_system_ico06.svg); } 

/* 다이어그램 중단 원형 */
.quality-system .diagram .cycle { display: grid; grid-template-areas: 
 "..... item2 ....."
 "item5 item1 item3"
 "..... item4 ....."; grid-template-columns: auto 1fr auto; grid-template-rows: auto 1fr auto; place-items: center; width: 100%; max-width: 1000px; margin: auto; letter-spacing: normal; text-align: center; container-type: inline-size; aspect-ratio: 1 / 1; } 
.quality-system .diagram .cycle::before,
.quality-system .diagram .cycle::after { grid-area: item1; position: absolute; background: no-repeat center/contain; content: ''; pointer-events: none; aspect-ratio: 1 / 1; } 
.quality-system .diagram .cycle::before { width: 72cqw; border-radius: 50%; background-image: url(../images/sub/quality_system_circle_ring.svg); outline: 2px dashed #eee; outline-offset: 4.5cqw; transform: rotate(-45deg); } 
.quality-system .diagram .cycle::after { width: 83cqw; background-image: url(../images/sub/quality_system_circle_arrow.svg); animation: spin 10s linear infinite, fade-in 1.6s 1.3s both paused; } 
@keyframes spin { to { transform: rotate(360deg); } 
 }
.quality-system .diagram .cycle.aos-animate::after,
.quality-system .diagram .cycle.aos-animate li { animation-play-state: running; } 
.quality-system .diagram .cycle li { z-index: 1; width: 30cqw; animation: var(--an) 1s var(--ad) both paused; aspect-ratio: 1 / 1; } 
.quality-system .diagram .cycle h5 { display: grid; place-content: center; row-gap: 0.6cqw; height: 100%; border: 3px solid var(--color-blue); border-radius: 50%; background-color: #fff; } 
.quality-system .diagram .cycle h5::before { height: 5.2cqw; margin-bottom: 1cqw; background: var(--ico) no-repeat center/contain; content: ''; } 
.quality-system .diagram .cycle h5 b { font-weight: 700; font-size: 3.2cqw; color: var(--color-blue); } 
.quality-system .diagram .cycle h5 span { font-weight: 600; font-size: 1.8cqw; font-family: var(--font-montserrat); color: #444; } 
/* 리더쉽 항목 */
.quality-system .diagram .cycle li:nth-child(1) { --an: fade-zoom-out; --ad: 0s; grid-area: item1; width: 35cqw; animation-duration: .8s; } 
.quality-system .diagram .cycle li:nth-child(1) h5 { border: none; background-color: var(--color-main); } 
.quality-system .diagram .cycle li:nth-child(1) h5::before { display: none; } 
.quality-system .diagram .cycle li:nth-child(1) h5 b { font-size: 4.8cqw; color: #fff; } 
.quality-system .diagram .cycle li:nth-child(1) h5 span { font-size: 2.4cqw; color: var(--color-white-a8); } 
/* 기타 항목 */
.quality-system .diagram .cycle li:nth-child(2) { --ico: url(../images/sub/quality_system_circle_ico01.svg); --an: fade-up; --ad: .3s; grid-area: item2; } 
.quality-system .diagram .cycle li:nth-child(3) { --ico: url(../images/sub/quality_system_circle_ico02.svg); --an: fade-left; --ad: .5s; grid-area: item3; } 
.quality-system .diagram .cycle li:nth-child(4) { --ico: url(../images/sub/quality_system_circle_ico03.svg); --an: fade-down; --ad: .65s; grid-area: item4; } 
.quality-system .diagram .cycle li:nth-child(5) { --ico: url(../images/sub/quality_system_circle_ico04.svg); --an: fade-right; --ad: .75s; grid-area: item5; } 


/* sec2 - 장비목록 */
.quality-equipment { padding: 13.5rem 0 18rem; background-color: #f9f9f9; text-align: center; } 
.quality-equipment .inner { border-radius: 2.5rem; background-color: #fff; box-shadow: var(--box-shadow-3); } 
.quality-equipment .tit { position: absolute; top: 0; left: 50%; width: 17.5625em; padding: 0.55em 0.7em; border-radius: 5em; background-color: var(--color-blue); font-weight: 600; font-size: var(--font-32); line-height: 1.1; letter-spacing: normal; color: #fff; transform: translate(-50%, -50%); } 

.quality-equipment .list { display: grid; grid-template-columns: repeat(5, 1fr); column-gap: 3.5%; padding: 9rem 5.5%; } 
.quality-equipment .item { display: flex; flex-direction: column; } 
.quality-equipment .item-img { display: flex; flex-direction: column-reverse; justify-content: center; } 
.quality-equipment .item-img img { border-radius: 1rem; } 
.quality-equipment .item-name { margin-bottom: 0.9em; font-weight: 800; font-size: var(--font-23); color: #222; } 
.quality-equipment .item-desc { display: flex; flex-grow: 1; justify-content: center; align-items: center; padding: 1.05em 0; border-bottom: 1px solid #eee; font-weight: 600; font-size: var(--font-18); line-height: 1.2; } 
.quality-equipment .item-maker { padding-top: 1.15em; color: var(--color-main); } 
.quality-equipment .item-maker b { font-weight: 700; font-size: var(--font-16); } 

@media (max-width: 1280px){
 .quality-system .diagram .list li::before { width: 5em; } 
 .quality-system .diagram .list li span { min-height: 5.5em; } 
 /* sec2 - 장비목록 */
 .quality-equipment .list { column-gap: 3%; padding: 9rem 4%; } 
 }
@media (max-width: 1024px){
 .quality-system .diagram .arrow { height: calc(75px + 15vw); } 
 .quality-system .diagram .list { font-size: var(--font-20); } 
 .quality-system .diagram .cycle h5 { border-width: 2px; } 
 .quality-system .diagram .cycle h5::before { height: calc(26px + 2.6cqw); } 
 .quality-system .diagram .cycle h5 b { font-size: calc(8px + 2.4cqw); } 
 .quality-system .diagram .cycle h5 span { font-size: calc(9px + 0.9cqw); } 
 .quality-system .diagram .cycle li:nth-child(1) h5 b { font-size: calc(12px + 3.6cqw); } 
 .quality-system .diagram .cycle li:nth-child(1) h5 span { font-size: calc(12px + 1.2cqw); } 
 /* sec2 - 장비목록 */
 .quality-equipment .tit { width: calc(100% - 4rem); max-width: 16em; font-size: var(--font-25); } 
 .quality-equipment .list { grid-template-columns: repeat(3, 1fr); gap: 6rem 5%; padding: 9rem 6%; } 
 .quality-equipment .item-maker { padding-top: 1em; } 
 }
@media (max-width: 768px){
 .quality-system .sec-header p { font-size: var(--font-23); letter-spacing: 1vw; transform: translateX(0.5vw); } 
 .quality-system .diagram .list { border-width: 2px; font-size: 2.3rem; } 
 .quality-system .diagram .list li { flex-direction: column; } 
 .quality-system .diagram .list li::before { width: 100%; height: 9rem; background-size: 6.4rem; } 
 }
@media (max-width: 640px){
 .quality-system .diagram .list { font-size: 2.1rem; } 
 }
@media (max-width: 576px){
 .quality-system .sec-header p { font-size: 4vw; letter-spacing: 0.2em; } 
 .quality-system .diagram .list { flex-direction: column; row-gap: 4vw; padding: 4vw; } 
 .quality-system .diagram .list li { flex-direction: row; } 
 .quality-system .diagram .list li::before { width: 25%; min-width: 10rem; height: auto; background-size: 6.4rem; } 
 .quality-system .diagram .list li span { min-height: 10rem; font-size: var(--font-20); } 
 /* 다이어그램 중단 원형 */
 .quality-system .diagram .cycle { grid-template-areas: 
 "item2 ..... item3"
 "..... item1 ....."
 "item5 ..... item4"; } 
 .quality-system .diagram .cycle::before { width: 89cqw; outline-width: 1px; outline-offset: 4.5cqw; transform: none; } 
 .quality-system .diagram .cycle::after { width: 100cqw; } 
 .quality-system .diagram .cycle li { width: 35cqw; } 
 .quality-system .diagram .cycle li:nth-child(1) { position: absolute; width: 42cqw; } 
 /* sec2 - 장비목록 */
 .quality-equipment .list { grid-template-columns: repeat(2, 1fr); column-gap: 7%; padding: 9rem 7%; } 
 }
@media (max-width: 480px){
 .quality-system .diagram .cycle li { width: 37cqw; } 
 .quality-system .diagram .cycle h5::before { height: calc(24px + 2.4cqw); } 
 .quality-system .diagram .cycle h5 b { font-size: calc(7.5px + 2.25cqw); } 
 .quality-system .diagram .cycle h5 span { font-size: calc(4px + 2cqw); line-height: 1.1; letter-spacing: -0.025em; } 
 .quality-system .diagram .cycle li:nth-child(1) h5 b { font-size: calc(10px + 3.8cqw); } 
 .quality-system .diagram .cycle li:nth-child(1) h5 span { font-size: calc(10px + 1.4cqw); } 
 }
@media (max-width: 375px) { /* sec2 - 장비목록 */
 .quality-equipment .tit { font-size: var(--font-23); } 
 .quality-equipment .list { grid-template-columns: auto; padding: 9rem 10%; } 
 .quality-equipment .item-img img { border-radius: 2rem; } 
 .quality-equipment .item-name { font-size: var(--font-25); } 
 .quality-equipment .item-desc { padding: 0.9em; font-size: var(--font-20); } 
 .quality-equipment .item-maker b { font-size: var(--font-18); } 
 }
/* 서비스 _ 품질인증 */
/* ===================================================== */


/* ===================================================== */
/* 주요제품 _ Cap Assembly */
.product-intro { display: grid; justify-items: center; margin-bottom: 8rem; text-align: center; } 
.product-intro h4 { width: fit-content; padding: 0.3em 0; margin-bottom: 0.8em; border: solid var(--color-main); border-width: 3px 0; font-weight: 800; font-size: 4rem; color: var(--color-main); } 
.product-intro p { font-weight: 500; font-size: var(--font-23); } 
.product-intro p em { font-weight: 800; color: #222; } 

/* @ sec1 */
.cap-sec-1 { margin-bottom: 12rem; container-type: inline-size; margin-top: 12rem;} 
.cap-sec-1 ol { display: flex; justify-content: space-between; gap: 4.5cqw; flex-wrap: wrap; } 
.cap-sec-1 li { width: 20%; flex-grow: 1; position: relative; min-height: 22cqw; } 
.cap-sec-1 li:not(:last-child)::after { position: absolute; top: 0; left: 100%; width: 4.5cqw; height: 100%; background: url(../images/sub/product_chevron.svg) no-repeat center/33%; content: ''; } 
.cap-sec-1 figure { display: flex; flex-direction: column; height: 100%; padding: 1rem; border: 2px solid #eee; border-radius: 1.5rem; } 
.cap-sec-1 .img-wrap { display: flex; flex-grow: 1; padding: 1cqw; } 
.cap-sec-1 .img-wrap img { margin: auto; object-fit: contain; } 
.cap-sec-1 figcaption { display: block; padding: 1em; margin-top: auto; border-radius: 0.75rem; font-weight: 700; font-size: var(--font-18); text-align: center; } 

/* @ sec2 */
.cap-sec-2 { padding: 12rem 0 18rem; background-color: #f9f9f9; } 
.cap-sec-2 ol { margin-bottom: 10rem; } 
.cap-sec-2 li:not(:first-child)::before { display: block; width: 16.6rem; height: 16rem; margin: -2rem auto 2rem; background: url(../images/sub/product_arrow_grad.svg) no-repeat center/contain; content: ''; } 
.cap-sec-2 .img-area { display: flex; align-items: center; padding: 8rem 6%; border-radius: 1.5rem; background-color: #fff; box-shadow: var(--box-shadow-3); column-gap: 4%; } 
.cap-sec-2 .arrow-area::before { width: 9.5rem; height: 13.5rem; background: url(../images/sub/product_arrow.svg) no-repeat center/contain; content: ''; } 
.cap-sec-2 .arrow-area figure:first-child { order: -5; } 
.cap-sec-2 figure { display: grid; flex-grow: 1; justify-items: center; place-content: center; } 
.cap-sec-2 figcaption { padding: 0.45em 1.3em; margin-top: 3.5rem; border-radius: 0.5rem; font-weight: 700; font-size: 2.8rem; text-align: center; white-space: nowrap; } 
.cap-sec-2 figure:only-child { min-height: 30rem; } 

.cap-ess { font-weight: 700; font-family: var(--font-montserrat); display: flex; font-size: var(--font-32); border-radius: 5em; border: 2px dashed var(--color-blue); padding: 0.9em; column-gap: 3%; align-items: center; } 
.cap-ess::after { content: ''; width: 4.7rem; mask: url(../images/common/arrow_w47.svg) no-repeat center/contain; -webkit-mask: url(../images/common/arrow_w47.svg) no-repeat center/contain; background-color: var(--color-main); height: 2.7rem; } 
.cap-ess dt { color: var(--color-main); flex: 1; text-align: right; } 
.cap-ess dd { order: 5; color: var(--color-blue); flex: 1; } 

@media (max-width: 1280px){
 .cap-ess { flex-direction: column; row-gap: 1em; border-radius: 2rem; padding: 1.5em 1em; text-align: center; } 
 .cap-ess::after { transform: rotate(90deg); width: 1.8em; } 
 }
@media (max-width: 1024px){
 .cap-sec-1 ol { gap: 3.5cqw; } 
 .cap-sec-1 li { min-height: 0; } 
 .cap-sec-1 li:not(:last-child)::after { width: 3.5cqw; background-size: 50%; } 
 .cap-sec-1 figure { padding: 1cqw; } 
 .cap-sec-1 figcaption { font-size: var(--font-16); } 
 .cap-ess { font-size: calc(8px + 2.2vw); } 
 }
@media (max-width: 768px) and (min-width: 577px){
 .cap-sec-1 ol { gap: 5cqw; } 
 .cap-sec-1 li { width: 40%; } 
 .cap-sec-1 li:not(:last-child)::after { width: 5cqw; } 
 .cap-sec-1 li:nth-child(2)::after { width: 5cqw; left: 50%; top: 100%; height: 5cqw; background-size: auto 90%; transform: translateX(-50%) rotate(90deg); } 
 .cap-sec-1 li:nth-child(3) { order: 5; } 
 .cap-sec-1 li:nth-child(3)::after { left: auto; right: 100%; transform: scaleX(-1); } 
 }
@media (max-width: 640px) and (min-width: 577px){
 .cap-sec-2 figcaption { font-size: 2.4rem; } 
 }
@media (max-width: 576px){
 .product-intro p { font-size: var(--font-20); } 
 .cap-sec-1 ol { gap: 6cqw; } 
 .cap-sec-1 li { width: 100%; } 
 .cap-sec-1 li:not(:last-child)::after { width: 6cqw; top: 100%; left: 50%; transform: translateX(-50%) rotate(90deg); height: 6cqw; } 
 .cap-sec-1 .img-wrap { padding: 8cqw 4cqw; } 
 .cap-sec-1 figcaption { font-size: var(--font-20); } 
 .cap-sec-2 .img-area { flex-direction: column; row-gap: 6rem; } 
 .cap-sec-2 .arrow-area::before { transform: rotate(90deg); height: 12rem; } 
 }
@media (max-width: 480px){
 .product-intro p br { display: none; } 
 }
/* 주요제품 _ Cap Assembly */
/* ===================================================== */


/* ===================================================== */
/* 채용 _ 인재상 */
.talent { margin-bottom: 18rem; } 
.talent-core .sec-tit { text-align: center; } 
.talent-core .list { display: flex; font-size: var(--font-23); } 
.talent-core .item { display: flex; flex: 1; flex-direction: column; align-items: center; padding: 1em 5%; text-align: center; transition-delay: calc(var(--item-index) * 0.3s); } 
.talent-core .item:not(:last-child) { background: linear-gradient(to bottom, #ddd 4px, transparent 4px) repeat-y right/1px 8px; } 
.talent-core .item-tit { padding: 0.325em 0.925em; margin-bottom: 1.2em; border-radius: 5em; white-space: nowrap; } 
.talent-core .item-img { order: -5; width: 13rem; margin-bottom: 0.8em; } 
.talent-core .item-desc { font-weight: 600; font-size: var(--font-18); color: #222; } 
.talent-core .item-desc b { white-space: nowrap; } 
@media (max-width: 768px){
 .talent-core .list { font-size: var(--font-20); } 
 .talent-core .item { padding: 1em 3%; } 
 }
@media (max-width: 640px){
 .talent-core .list { flex-direction: column; } 
 .talent-core .item:not(:last-child) { background: linear-gradient(to right, #ddd 4px, transparent 4px) repeat-x bottom/8px 1px; } 
 .talent-core .item { padding: 2em 0; } 
 .talent-core .item:first-child { padding-top: 0; } 
 .talent-core .item:last-child { padding-bottom: 1em; } 
 }
/* 채용 _ 인재상 */
/* ===================================================== */


/* ===================================================== */
/* 주요제품 _ 엔지니어링 사업영역 */
.business-visual { margin-bottom: 120px; } 
.business-visual .inner { background: url(../images/sub/business_visual.png) 50% 60% no-repeat; background-size: cover; min-height: 450px; padding: 50px 120px; display: flex; align-items: center; border-radius: 15px; } 
.business-visual .inner h4 { color: #fff; font-size: 48px; } 
.business-visual .inner h4 span { color: #28D0FF; font-weight: 700; } 
.business-area { background-color: #f9f9f9; position: relative; } 
.business-area .inner { display: flex; flex-direction: column; align-items: center; } 
.business-area h5 { background-color: #3C50C8; text-align: center; display: inline-block; color: #fff; font-size: 32px; padding: 15px 50px; border-radius: 50px; position: absolute; top: -30px; } 
.business-area .inner .arw { padding-bottom: 100px; margin-top: 100px; display: flex; flex-direction: column; align-items: center; } 
.business-area .inner .arw h6 { font-size: 28px; color: #666; margin-bottom: 20px; } 
.business-area .inner .arw h6 span { color: #222; font-weight: 700; } 
.business-area .inner .arw img { position: relative; z-index: 1000; } 
.business-area .inner .arw .list { padding: 70px 90px; background-color: #fff; box-shadow: 0 0 30px 0 rgb(34, 34, 34, .12); border-radius: 15px; position: relative; top: -20px; } 
.business-area .inner .arw .list header { font-size: 28px; font-weight: 600; color: #222; padding-bottom: 20px; border-bottom: 1px solid rgb(221, 221, 221, .5); text-align: center; } 
.business-area .inner .arw .list header span { color: var(--color-main); font-weight: 700; } 
.business-area .inner .arw .list ul { margin-top: 20px; font-size: 24px; } 
.business-area .inner .arw .list ul li { margin-bottom: 15px; position: relative; padding-left: 36px; } 
.business-area .inner .arw .list ul li:before { position: absolute; content: ""; width: 25px; height: 25px; background: url(../images/sub/business_check.svg) no-repeat; left: 0; top: 50%; transform: translateY(-50%); } 
@media (max-width:1024px){
 .business-visual .inner h4 { font-size: 42px; } 
.business-area h5 { font-size: 28px; } 
.business-area .inner .arw h6,
.business-area .inner .arw .list header { font-size: 24px; } 
.business-area .inner .arw .list ul { font-size: 20px; } 
.business-area .inner .arw .list ul li { padding-left: 30px; } 
.business-area .inner .arw .list ul li:before { width: 20px; height: 20px; background-size: contain; } 
 }
@media (max-width:768px){
 .business-visual .inner { min-height: 300px; padding: 50px; } 
 .business-visual .inner h4 { font-size: 36px; text-align: center; } 
.business-area .inner .arw .list ul { font-size: 16px; } 
.business-area .inner .arw .list ul li { padding-left: 25px; } 
.business-area .inner .arw .list ul li:before { width: 16px; height: 16px; background-size: contain; } 
 }
@media (max-width: 574px){
 .business-area .inner .arw h6 { text-align: center; } 
 .business-area .inner .arw .list { padding: 70px 30px; } 
 }
@media (max-width:480px){
 .business-visual .inner { min-height: 250px; } 
 .business-visual .inner h4 { font-size: 28px; text-align: center; } 
.business-area h5 { font-size: 24px; } 
 }
/* 주요제품 _ 엔지니어링 사업영역 */
/* ===================================================== */

/* ===================================================== */
/* 고객센터 _ 컨택 */
.contact { margin-bottom: 180px; } 
.contact .info-area { background: url(../images/sub/contact_visual.png) 50% 50% no-repeat; background-size: cover; padding: 70px; min-height: 350px; display: flex; align-items: center; position: relative; } 
.contact .info-area:after { position: absolute; content: ""; width: 355px; height: 206px; right: 0; bottom: 0; background: url(../images/sub/contact_logo.svg) no-repeat; } 
.contact .info-area ul li { font-size: 28px; color: #fff; display: flex; padding: 20px 50px 20px 20px; border-bottom: 1px solid rgb(255, 255, 255, .3); position: relative; } 
.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 { width: 100px; margin-right: 100px; } 
.contact .info-area ul li a { transition: .3s; } 
.contact .info-area ul li a:hover { color: #28D0FF; } 
@media (max-width: 768px){
 .contact .info-area { justify-content: center; min-height: 250px; padding: 35px; } 
.contact .info-area:after { width: 200px; height: 156px; background-size: contain; bottom: -40px; } 
.contact .info-area ul li { font-size: 24px; } 
 }
@media (max-width: 574px){
 .contact .info-area ul li { font-size: 20px; justify-content: space-between; column-gap: 50px; } 
 .contact .info-area ul li em { width: auto; margin-right: unset; } 
 }
@media (max-width: 480px){
 .contact .info-area ul { width: 100%; } 
 .contact .info-area ul li { flex-direction: column; } 
 .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; } 
 } 
 }
/* 이메일무단수집거부 */
/* ===================================================== */