@charset "utf-8";

/* sub-showcase */
.sub-showcase { width: 100%; height: 56rem; color: #fff; text-align: center; padding: 0 !important;}
.sub-showcase .container { display: flex; align-items: center; justify-content: center; flex-direction: column; height: 100%; }
.sub-showcase h2 { font-family: 'Inter', sans-serif; font-weight: 800; font-size: 7rem; line-height: 7rem; }
.sub-showcase p { font-weight: 500; font-size: 3rem; line-height: 4.2rem; margin-top: 2.4rem; }
.sub-showcase.about-us { background: url(../images/sub/about_main.png) 50% 50% / cover no-repeat; }
.sub-showcase.portfolio {background: url(../images/sub/portfolio_main.png) 50% 50% / cover no-repeat;}
.sub-showcase.contact-us {background: url(../images/sub/contact_main.png) 50% 50% / cover no-repeat;}
.sub-showcase.recruit {background: url(../images/sub/recruit_main.png) 50% 50% / cover no-repeat;}
.sub-showcase.news {background: url(../images/sub/news_main.png) 50% 50% / cover no-repeat;}

/* sub-page */
.sub-page { font-size: 2.4rem; word-break: keep-all;} 
.sub-page h3 { font-weight: 900; font-size: 5.4rem; line-height: 5.4rem; color: var(--gray-01); text-align: center; display: block; }

.sub-content { padding-block: 12rem; } 
.sub-section + .sub-section { padding-top: 12rem; } 
.sub-title { position: relative; padding-bottom: 5rem; } 
.sub-title p { text-align: center; margin-top: 2rem; font-size: 2.4rem; line-height: 3.6rem; } 

.sub-page .sub-nav { border-bottom: 1px solid #E0E0E0; }
.sub-page .sub-nav-inner { max-width: 80rem; width: 100%; margin: 0 auto; display: flex; }
.sub-page .sub-nav a { flex: 1 0 50%; font-weight: 900; font-size: 2rem; line-height: 3.6rem; color: #909090; height: 8rem; display: flex; justify-content: center; align-items: center; }
.sub-page .sub-nav a.on { color: var(--blue-01); position: relative; }
.sub-page .sub-nav a.on::after { content: ""; position: absolute; bottom: 0; left: 50%; transform: translateX(-50%); border-bottom: 0.4rem solid var(--blue-01); width: 100%; }

.sub-page .pagination {display: flex; justify-content: center; align-items: center; margin-top: 6rem; gap: 0.4rem;}
.sub-page .pagination button {display: flex; justify-content: center; align-items: center; width: 3.2rem; height: 3.2rem; font-size: 1.6rem; line-height: 1.6rem; font-weight: 400; background: #fff; color: var(--gray-03); letter-spacing: -0.096rem;}
.sub-page .pagination button.on {background: var(--gray-03); border-radius: 0.4rem; color: #fff; font-weight: 800;}
.sub-page .pagination button.prev-group,
.sub-page .pagination button.prev,
.sub-page .pagination button.next-group,
.sub-page .pagination button.next {width: 2.4rem; height: 2.4rem;}
.sub-page .pagination button.prev-group {background: url(../images/sub/prev_group.svg) 50% 50% / cover no-repeat; margin-right: 0.4rem;}
.sub-page .pagination button.prev {background: url(../images/sub/prev.svg) 50% 50% / cover no-repeat; margin-right: 1rem;}
.sub-page .pagination button.next {background: url(../images/sub/next.svg) 50% 50% / cover no-repeat; margin-left: 1rem;}
.sub-page .pagination button.next-group {background: url(../images/sub/next_group.svg) 50% 50% / cover no-repeat; margin-left: 0.4rem;}

/* About us - 회사소개 */
.vision { padding-bottom: 13rem; }
.vision .sub-nav {margin-bottom: 13rem;}
.vision .text-uniess{margin-top: 7rem;}
.vision .text-uniess ul { display: flex; justify-content: space-between; }
.vision .text-uniess ul li { padding: 0 1rem; flex: 1; display: flex; flex-direction: column; justify-content: flex-start; align-items: center; }
.vision .text-uniess ul li .image { aspect-ratio: 1 / 1; max-width: 18rem; width: 100%; background: #F3F6FA; border-radius: 3.6rem; display: flex; justify-content: center; align-items: center; }
.vision .text-uniess ul li img { aspect-ratio: 1 / 1; object-fit: cover; padding: 27.7%; width: 100%; height: 100%; }
.vision .text-uniess ul li .text-box { text-align: center; }
.vision .text-uniess p { font-weight: 500; font-size: 2rem; line-height: 2.4rem; letter-spacing: 0.02em; color: var(--gray-01); margin-block: 2rem 2.4rem; }
.vision .text-uniess p span { font-family: 'Inter', sans-serif; display: block; margin-bottom: 0.2rem; }
.vision .text-uniess p span::first-letter { font-weight: 900; font-size: 3.6rem; line-height: 3.6rem; letter-spacing: 0.01em; color: var(--blue-01); margin-right: 0.2rem; }
.vision .text-uniess strong { font-weight: 800; font-size: 2.4rem; line-height: 2.4rem; color: var(--gray-01); }

.business .visual { background: url(../images/sub/business_0.png) 50% 50% / cover no-repeat; height: 50rem;}
.business .visual .container { padding-top: 12rem; height: 100%; display: flex; flex-direction: column; }
.business .visual h3 { margin-bottom: 3rem; color: #fff; text-align: left; }
.business .visual .bottom-area { display: flex; justify-content: space-between; align-items: flex-end; }
.business .visual p { font-weight: 400; font-size: 2.6rem; line-height: 3.8rem; color: #fff; }
.business .visual a { width: 23rem; height: 5.6rem; background: rgba(0, 0, 0, 0.4); border-radius: 5rem; font-weight: 800; font-size: 1.8rem; line-height: 2rem; color: #fff; display: flex; justify-content: center; align-items: center; gap: 0.6rem; }
.business .visual a::after { content: ""; display: block; width: 2.4rem; height: 2.4rem; background: url(../images/icon_file.svg) center / 100% 100% no-repeat; }

.business #cards .card { min-height: 64rem; padding: 10rem 0; height: 100%; display: flex; overflow: hidden; border-radius: 5rem 5rem 0 0; }
.business #cards .card:not(:first-child) { margin-top: -30rem; }
.business #cards .card-1 { background: #E5F2FF; margin-top: -12rem; }
.business #cards .card-2 { background: #fff; }
.business #cards .card-3 { background: #FFF6DE; }
.business #cards .card-4 { background: #FFEBB4; }
.business #cards .card-5 { background: #E5F2FF; }
.business #cards .container { display: flex; justify-content: space-between; }
.business #cards .card-content { display: flex; flex-direction: column; justify-content: center; width: 50%; }
.business #cards .card-content dl dt { font-weight: 900; font-size: 4.8rem; line-height: 5.2rem; color: var(--gray-01); }
.business #cards .card-content dl dd { font-weight: 400; font-size: 2rem; line-height: 3.6rem; color: var(--gray-03); margin: 1.6rem 0 4rem 0; }
.business #cards .card-tags { display: flex; flex-wrap: wrap; gap: 1rem; }
.business #cards .card-tags li { background: rgba(0, 0, 0, 0.06); border-radius: 5rem; color: var(--gray-02); font-weight: 400; font-size: 1.6rem; line-height: 2rem; padding: 1.4rem 2rem; }
.business #cards .card-image { width: 43.75%; border-radius: 2.6rem; overflow: hidden; }
.business #cards .card-image img { width: 100%; height: 100%; object-fit: cover; }

/* About us - 연혁 및 현황 */
.history {padding-bottom: 11rem;}
.history .sub-nav {margin-bottom: 13rem;}
.history .history-wrap {position: relative;}
.history .container {position: relative;}
.history .history-title {text-align: center; position: absolute; top: 6.6rem; left: 4rem;}
.history .history-title h3 {font-family: 'Poppins', sans-serif; font-size: 11.2rem; line-height: 10.6rem; color: #EBEEF3; display: inline-flex; flex-direction: column;}
.history .history-title h3 span {width: fit-content;}
.history .history-title h3 span + span {margin: 1.2rem 0 0 3.6rem;}
.history .history-item {position: relative; padding-bottom: 2rem;}
.history .history-item:last-of-type {padding-bottom:0;}
.history .history-item:last-of-type h4 {margin: 0;}
.history .history-item.left {margin-right: 50%; padding-right: 5.6rem; text-align: right;}
.history .history-item.right {margin-left: 50%; padding-left: 5.6rem; text-align: left;}
.history .history-item h4 {font-size: 4.6rem; line-height: 4.6rem; color: var(--gray-01); font-weight: 800; margin-bottom: 2rem; position: relative; transition: color 0.3s ease;}
.history .history-item.active h4 {color: var(--blue-01);}
.history .history-item h4::before,
.history .history-item h4::after {content: ""; border-radius: 50%; position: absolute; top: 50%; transform: translateY(-50%);}
.history .history-item h4::before {background: rgba(39, 71, 245, 0.2); width: 3.2rem; height: 3.2rem;}
.history .history-item h4::after {background: var(--blue-01); width: 1.28rem; height: 1.28rem; z-index: 10;}
.history .history-item.left h4::before {right: -7.2rem;}
.history .history-item.left h4::after {right: -6.25rem;}
.history .history-item.right h4::before {left: -7.2rem;}
.history .history-item.right h4::after {left: -6.25rem;}
.history .history-item ul li {font-weight: 400; font-size: 2rem; line-height: 3.6rem; color: var(--gray-03); display: flex; align-items: flex-start; gap: 0.6rem; letter-spacing: -0.01em;}
.history .history-item ul li::before {content: ""; min-width: 0.4rem; height: 0.4rem; background: var(--gray-03); border-radius: 50%; margin-top: 1.6rem;}
.history .history-item.left ul li {justify-content: flex-end;}
.history .history-item.left ul li::before {order: 2;}
.history .history-line {background: #D0D0D0; width: 1px; height: 98%; position: absolute; transform: translateX(-50%); left: 50%; top: 1.6rem; z-index: -1;}

/* portfolio */
.portfolio {padding: 12rem 0;}
.portfolio .filter-controls {position: relative; z-index: 10; display: flex; gap: 1rem;}
.portfolio .dropdown {width: 16rem; height: 5rem; position: relative; z-index: 1;}
.portfolio .dropdown-inner { z-index: 2; position: absolute; top: 0; left: 0; width: 100%; background: #fff; border: 1px solid #D9DDDD; border-radius: 1.4rem; transition: box-shadow 0.3s, border 0.3s;}
.portfolio .dropdown.active .dropdown-inner {border: 1px solid var(--gray-01); box-shadow: 0 0 1.5rem rgba(0, 0, 0, 0.25);}
.portfolio .dropdown.active .filter-toggle {padding: 1.4rem 2rem 2rem;}
.portfolio .dropdown.active .filter-toggle::after {transform: rotate(180deg);}
.portfolio .dropdown.active .filter-options {display: block;}
.portfolio .filter-toggle {padding: 1.4rem 2rem; font-weight: 500; font-size: 1.8rem; line-height: 2.2rem; color: var(--gray-01); display: flex; justify-content: space-between; align-items: center; width: 100%;}
.portfolio .filter-toggle::after {content: ""; background: url(../images/sub/arrow_bottom.svg) 50% 50% / cover no-repeat; width: 1rem; height: 0.6rem; transition: transform 0.3s;}
.portfolio .filter-options {display: none; padding: 0 2rem 1.4rem;}
.portfolio .filter-options li {display: flex; align-items: center; gap: 0.8rem;}
.portfolio .filter-options li + li {margin-top: 1rem;}
.portfolio .filter-options input[type="checkbox"] {border: 1px solid #D9DDDD; border-radius: 0.4rem; min-width: 2rem; height: 2rem; position: relative; cursor: pointer;}
.portfolio .filter-options input[type="checkbox"]:checked { background: var(--gray-01); border: 1px solid var(--gray-03); display: flex; justify-content: center; align-items: center;}
.portfolio .filter-options input[type="checkbox"]:checked::after {content: ""; background: url(../images/sub/icon_checked.svg) 50% 50% / cover no-repeat; width: 1rem; height: 0.7rem;}
.portfolio .filter-options label {font-weight: 500; font-size: 1.6rem; line-height: 2rem; color: var(--gray-03); width: 100%; cursor: pointer;}
.portfolio .submit {font-weight: 500; font-size: 1.8rem; line-height: 2rem; color: #fff; background: var(--gray-03); border-radius: 1.4rem; display: flex; justify-content: center; align-items: center; gap: 0.8rem; width: 9.4rem; height: 5rem;}
.portfolio .submit::after {content: ""; background: url(../images/sub/icon_search.svg) 50% 50% / cover no-repeat; width: 1.5rem; height: 1.5rem;} 
.portfolio .filter-tags {background: #F3F6FA; border-radius: 1.4rem; overflow: hidden; padding: 1.6rem 2.4rem; min-height: 6.6rem; display: flex; justify-content: space-between; margin-top: 1.8rem; gap: 9.4rem;}
.portfolio .tags {display: flex; flex-wrap: wrap; gap: 0 2.4rem;}
.portfolio .tags li { font-weight: 500; font-size: 1.6rem; line-height: 1.8rem; color: var(--gray-03); display: inline-flex; gap: 0.4rem; align-items: center; margin: 0.8rem 0;}
.portfolio .tag-remove {background: url(../images/sub/close_gray.svg) 50% 50% / cover no-repeat; min-width: 1.8rem; height: 1.8rem; border-radius: 50%; display: flex; justify-content: center; align-items: center;}
.portfolio .tags-clear {min-width:5.6rem; font-weight: 500; font-size: 1.6rem; line-height: 1.8rem; height: 100%; margin-top: 0.8rem; color: var(--gray-01); text-decoration: underline 0.1rem var(--gray-01); text-underline-offset: 0.3rem;}
.portfolio .project {position: relative; z-index: 1; margin: 4rem 0 8rem 0;}
.portfolio .project ul {display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8rem 0;}
.portfolio .project ul li{ width: calc((100% - 2.4rem) / 2);}
.portfolio .project a .project-image::before {content: ""; position: absolute; top: 0; left: 0; display: flex; flex-direction: column; justify-content: flex-end; width: 100%; height: 100%; overflow: hidden; opacity: 0; visibility: hidden; transition: all .8s; background: linear-gradient(180deg, rgba(39, 71, 245, 0) 0.31%, rgba(39, 71, 245, 0.5) 57.27%, var(--blue-01) 114.24%);}
.portfolio .project a:hover .project-image::before {opacity: 1; visibility: visible;}
.portfolio .project a .project-image::after {content: ""; background: url(../images/sub/more.svg) 50% 50% / cover no-repeat; width: 8rem; height: 8rem; overflow: hidden; opacity: 0; visibility: hidden; position: absolute; top: 100%; left: 50%; transform: translate(-50%, -50%); transition: all .7s;}
.portfolio .project a:hover .project-image::after {opacity: 1; visibility: visible; top: 50%;}
.portfolio .project-image {border: 1px solid #D9DDDD; border-radius: 3.6rem; overflow: hidden; max-width: 62.8rem; aspect-ratio: 628 / 440; box-sizing: border-box; position: relative;}
.portfolio .project-image img {width: 100%; height: 100%; object-fit: cover;}
.portfolio .project-desc h3 {font-weight: 800; font-size: 2.6rem; line-height: 3rem; text-align: left; padding-top: 3rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.portfolio .project-desc p {font-size: 2.2rem; line-height: 2.2rem; color: var(--gray-03); padding-top: 1.6rem;}

/* portfolio - 상세 */
.detail {min-height: 100vh; position: relative; overflow: hidden; display: flex; justify-content: center; align-items: center; word-break: keep-all;}
.detail .bg {position: absolute; inset: 0; width: 100%; height: 100%; background: rgba(0, 0, 0, 1); z-index: 0;}
.detail.none .bg {background: var(--gray-02);}
.detail.none .layer {height: auto;}
.detail .bg img { width: 100%; height: 100%; object-fit: cover; filter: blur(2rem); transform: scale(1.05); opacity: 0.4;}
.detail article {width: 100%; height: 100%;}
.detail .container {height: 100%; display: flex; justify-content: center; align-items: center;}
.detail .layer {background: #fff; border-radius: 3.6rem; max-height: 85vh; height: 100%; display: flex; justify-content: center; position: relative; padding: 8rem 0;}
.detail .layer-inner {overflow-y: auto; max-height: 64rem; padding: 0 7.2rem;}
.detail .layer-inner::-webkit-scrollbar {width: 0.8rem;}
.detail .layer-inner::-webkit-scrollbar-thumb {background-color: #D9DDDD; border-radius: 0.3rem;}
.detail .layer-inner::-webkit-scrollbar-track { margin: 0.5rem 0.3rem;}
.detail .layer .btn-link {background: url(../images/sub/close_black.svg) 50% 50% / cover no-repeat; width: 3.6rem; height: 3.6rem; position: absolute; top: 2rem; right: 2.4rem;}
.detail .layer-header p {font-weight: 500; font-size: 2.4rem; line-height: 2.6rem; color: var(--blue-01); margin-bottom: 1rem; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
.detail .layer-header h1 {font-weight: 800; font-size: 3.8rem; line-height: 5.2rem; color: var(--gray-01);}
.detail .layer-body {margin-top: 5rem; display: flex; gap: 4rem;}
.detail .layer-body .images {border: 1px solid #D9DDDD; filter: drop-shadow(0 0 30px rgba(0, 0, 0, 0.15)); border-radius: 1.8rem; overflow: hidden; flex: 1 0 46.3%; height: 100%; aspect-ratio: 526 / 380;}
.detail .layer-body .images img {width: 100%; height: 100%; object-fit: cover;}
.detail.none .layer-body .images {display: none;}
.detail .layer-body .info {flex: auto;}
.detail .layer-body .overview {font-weight: 400; font-size: 2rem; line-height: 3.2rem; color: var(--gray-03);}
.detail .layer-body .layer-tags {margin-top: 2rem;}
.detail .layer-body .years h2 {font-weight: 800; font-size: 2.2rem; line-height: 2.4rem; color: var(--gray-01); margin: 5rem 0 1.6rem 0;}
.detail .layer-body .layer-tags,
.detail .layer-body .years ul {display: flex; flex-wrap: wrap; gap: 0.8rem 1rem;}
.detail .layer-body .layer-tags li,
.detail .layer-body .years ul li {font-weight: 400; font-size: 1.4rem; line-height: 1.6rem; color: var(--gray-02); border-radius: 4.6rem;  padding: 1.2rem 1.6rem;}
.detail .layer-body .layer-tags li {background: #F3F6FA;}
.detail .layer-body .years ul li {border: 1px solid #D9DDDD; background: #FFF;}

/* contact us */
.contact-us .inquire{padding-bottom: 12rem;}
.contact-us .tab-area ul { display: flex; justify-content: center; gap: 1.2rem; } 
.contact-us .tab-area li { flex: 0 1 20rem; height: 5.2rem; } 
.contact-us .tab-area li input[type="checkbox"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; } 
.contact-us .tab-area li label { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: var(--gray-02); border: 1px solid #D9DDDD; border-radius: 99rem; font-size: 1.8rem; line-height: 2rem; cursor: pointer; transition: background 0.3s, border-color 0.3s;} 
.contact-us .tab-area li input[type="checkbox"]:checked + label { background: var(--blue-01); color: #fff; border-color: var(--blue-01); font-weight: 800; outline: none;} 
.contact-us .tab-area li input:focus-visible + label{outline: -webkit-focus-ring-color auto 1px;}

.form-wrap { width: 100%; margin-top: 6rem; position: relative;}  
.form-notice {position: absolute; right: 0; display: flex; justify-content: flex-end; font-size: 2rem; color: var(--gray-03); } 
.form-notice em{color: var(--blue-01); font-weight: 800; padding-right: 0.2rem;}
.form-item { margin-bottom: 3rem;} 
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 4rem; margin-bottom: 3rem; } 
.item-label { display: flex; font-weight: 800; line-height: 3.4rem; margin-bottom: 1.2rem; } 
.required-dot { color: var(--blue-01); margin-left: 0.5rem; } 
.item-input { width: 100%; height: 7rem; padding-inline: 3rem; font-size: 2.2rem; line-height: 1; font-weight: 500; color: var(--gray-01); border-radius: 1.4rem; border: 1px solid transparent; background-color: #F3F6FA; transition: all 0.2s ease; outline: none; } 
.item-input:focus { background-color: #fff; border-color: var(--blue-01); box-shadow: 0 0 0 1px var(--blue-01); } 
.item-input::placeholder { color: #C2C2C2; font-weight: 500;} 
.item-textarea { height: 14rem; resize: vertical; padding-block: 2.4rem; line-height: 3.2rem;} 
.item-textarea::-webkit-scrollbar {width: 1.6rem;}
.item-textarea::-webkit-scrollbar-track{background: transparent; border-radius: 0 3rem 3rem 0;}
.item-textarea::-webkit-scrollbar-thumb{background: var(--gray-04); border-radius: 3rem; border: 4px solid transparent; background-clip: padding-box;}
.upload-wrap { display: flex; gap: 1.6rem; } 
.btn-file input[type="file"]{position: absolute; clip: rect(0, 0, 0, 0); width: 1px; height: 1px; padding: 0; margin: -1px; border: 0;}
.btn-file input:focus + label{outline: -webkit-focus-ring-color auto 1px;}
.btn-file label{display: flex; align-items: center; justify-content: center; border-radius: 1.4rem; height: 7rem; padding-inline: 3rem; background: #fff; border: 1px solid var(--gray-03); color: var(--gray-03); font-size: 2.2rem; line-height: 2.4rem; font-weight: 500; cursor: pointer;}
.uploaded-file { display: flex; flex-grow: 1; gap: 1rem; justify-content: space-between; align-items: center; margin-bottom: 1.2rem; height: 7rem; background-color: #F3F6FA; border-radius: 1.4rem; padding-inline: 3rem; font-size: 2.2rem;} 
.uploaded-file.nofile{color: #C2C2C2;}
.uploaded-file .file-name{flex-grow: 1; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; color: var(--gray-03); font-weight: 500;}
.uploaded-file .btn-remove { width: 2.2rem; height: 2.2rem; flex-shrink: 0; background: url(../images/sub/close_gray.svg) 50% 50% / 100% 100% no-repeat; cursor: pointer; text-indent: -9999px; line-height: 1; } 
.guide-text { font-size: 1.8rem; line-height: 2rem; color: var(--gray-03); margin-top: 1.6rem; } 
.agree-wrap { margin-top: 6rem; } 
.agree-wrap .check{display: flex; align-items: center; gap: 1rem;}
.agree-wrap input[type="checkbox"] {display: flex; align-items: center; justify-content: center; text-align: center; border: 1px solid var(--gray-03); border-radius: 0.6rem; min-width: 2rem; height: 2rem; position: relative; cursor: pointer;}
.agree-wrap input[type="checkbox"]:checked { background: var(--gray-03);}
.agree-wrap input[type="checkbox"]:checked::after {content: ""; display: inline-block; background: url(../images/sub/icon_checked.svg) 50% 50% / cover no-repeat; width: 1.2rem; height: 0.9rem;}
.agree-wrap label {font-weight: 500; font-size: 2rem; line-height: 2.4rem; color: var(--gray-01); cursor: pointer;}
.agree-wrap .noti{margin-top: 1.4rem;}
.agree-wrap .noti li{font-size: 1.8rem; line-height: 2.8rem; color: var(--gray-03);}
.btn-submit { display: block; height: 8rem; padding-inline: 5.4rem; margin: 6rem auto 0; font-size: 2.4rem; line-height: 1; font-weight: 800; border-radius: 1.6rem; background-color: var(--gray-01); color: white;} 

.contact-us .location { border-top: 1px solid #D9DDDD;} 
.contact-us .location .wrap { display: flex; flex-direction: column; } 
.contact-us .location .tab { display: flex; justify-content: center; gap: 1rem; } 
.contact-us .location .tab button { display: flex; align-items: center; justify-content: center; width: 20rem; height: 5.2rem; padding-inline: 2rem; background: #fff; border: 1px solid #D9DDDD; border-radius: 99rem; color: var(--gray-02); font-size: 1.8rem; line-height: 2rem; transition: background 0.3s, border-color 0.3s;} 
.contact-us .location .tab button.on { color: #fff; font-weight: 800; background: var(--blue-01); border-color: var(--blue-01); } 
.contact-us .location .info { margin-top: 6rem; } 
.contact-us .location .info > div { display: none; } 
.contact-us .location .info ul { display: flex; flex-wrap: wrap; gap: 0 4rem; } 
.contact-us .location .info li { position: relative; padding-left: 4rem; margin-bottom: 1rem; font-size: 2.4rem; line-height: 3.4rem; } 
.contact-us .location .info li:first-child { width: 100%; } 
.contact-us .location .info li::before { content: ''; position: absolute; top: 0; left: 0; display: inline-block; width: 3.4rem; height: 3.4rem; background-repeat: no-repeat; background-position: 0 0; background-size: 100% 100%; } 
.contact-us .location .info .adrs::before { background-image: url(../images/icon_location.svg); } 
.contact-us .location .info .tel::before { background-image: url(../images/icon_tel.svg); } 
.contact-us .location .info .mail::before { background-image: url(../images/icon_mail.svg); } 
.contact-us .location .info li span + span { padding-left: 4rem; position: relative; } 
.contact-us .location .info li span + span::before { content: ''; position: absolute; top: 0.6rem; left: 1.8rem; display: inline-block; width: 1px; height: 1.8rem; background: var(--gray-04); } 
.contact-us .location .map { height: 40rem; margin-top: 4rem; } 
.contact-us .location .map > div { height: 100%; display: none; } 
.contact-us .location .map .pin { position: relative; display: flex; align-items: center; gap: 1.1rem; width: fit-content; height: 6.4rem; padding-inline: 3.4rem; color: #fff; background: var(--blue-01); border-radius: 99rem; font-size: 1.8rem; font-weight: 800; } 
.contact-us .location .map .pin img { width: 3.6rem; height: 3.6rem; margin-top: -0.6rem; } 
.contact-us .location .map .pin::after { content: ''; position: absolute; top: 100%; left: 50%; transform: translateX(-50%); display: inline-block; width: 2rem; height: 1rem; background: url(../images/location_bg.png) 0 0 / 100% 100% no-repeat; } 

/* recruit */
.recruiting{padding-bottom: 12rem;}
.recruiting .list {display: flex; flex-wrap: wrap; gap: 4rem 2.4rem;}
.recruiting .list > li {width: calc((100% - 2.4rem) / 2); height: 24.4rem;}
.recruiting .list > li > a {background: #FFF; border: 1px solid #D9DDDD; border-radius: 3.6rem; transition: box-shadow 0.3s; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 3rem 4rem; position: relative;}
.recruiting .list > li > a::after {content: ""; background: url(../images/sub/icon_link.svg) 50% 50% / cover no-repeat; width: 1rem; height: 1.7rem; position: absolute; top: 3rem; right: 4rem;}
.recruiting .list > li > a:hover {box-shadow: 0 0 2.2rem rgba(0, 0, 0, 0.1);}
.recruiting .badge {font-weight: 800; font-size: 2.2rem; line-height: 2.2rem; border-radius: 5rem; padding: 1rem 2rem; display: inline-block; margin-bottom: 1rem;}
.recruiting .badge.deadline {color: var(--blue-01); background: #E4E8FF;}
.recruiting .badge.always {color: #FF9500; background: #FFF2DA;}
.recruiting .badge.closed {color: #909090; background: #F3F6FA;}
.recruiting .conditions {display: flex; align-items: center;}
.recruiting .conditions li {color: var(--gray-03); font-weight: 400; font-size: 2.2rem; line-height: 2.2rem; display: flex; align-items: center;}
.recruiting .conditions li + li::before {content: ""; background: #909090; width: 1px; height: 1.6rem; margin: 0 1.4rem;}
.recruiting h4 {font-weight: 800; font-size: 2.6rem; line-height: 3.8rem; color: var(--gray-01); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis;}

.benefit {background: #445FF4; padding: 12rem 0;}
.benefit .container {max-width: 192rem;}
.benefit h3 {color: #fff;}
.benefit ul {display: flex; flex-wrap: wrap; gap: 2.4rem;}
.benefit ul li {width: calc((100% - 7.2rem) / 4); aspect-ratio: 442 / 214; height: 21.4rem; background: #FFF; border-radius: 3.6rem; padding: 2.174% 1.957% 1.631%; display: flex; flex-direction: column; justify-content: space-between;}
.benefit ul li .icon {display: flex; justify-content: flex-end;}
.benefit ul li .icon img {aspect-ratio: 1 / 1; width: clamp(4rem, 5vw, 7.6rem);}
.benefit h5 {font-weight: 700; font-size: clamp(2rem, 2.5vw, 2.8rem); line-height: 3.8rem; word-break: keep-all;}

.apply .sub-title{border-bottom: 1px solid #CDCDCD;}
.apply .form-notice{top: 3rem;}
.select-box {position: relative;width: calc((100% - 4rem) / 2); height: 7rem;}
.select-inner{position: absolute; top: 0; left: 0; width: 100%; border-radius: 1.4rem; border: 1px solid #F3F6FA}
.select-box.active .select-inner{border: 1px solid var(--gray-01);}
.select-trigger { width: 100%; text-align: left; display: flex; align-items: center; justify-content: space-between; cursor: pointer; background: #F3F6FA; padding-inline: 3rem; height: 7rem; border-radius: 1.4rem; transition: all .3s ease; }
.select-trigger::after { content: ''; width: 1.8rem; height: 1.2rem; background: url(../images/sub/recruit_arrow.svg) no-repeat center; background-size: contain; transition: transform .3s ease; }
.select-trigger span{font-size: 2.2rem; font-weight: 500; line-height: 1; color: var(--gray-03);}
.select-box.active .select-trigger{background: #fff;}
.select-box.active .select-trigger::after { transform: rotate(180deg); }
.select-options { width: 100%; background: #fff; border-radius: 1.4rem; padding-block: 1rem 1.9rem; display: none; }
.select-box.active .select-options { display: block; }
.select-options li { padding: 0.5rem 3rem; }
.select-options li button { width: 100%; text-align: left; padding: 2rem; border: none; background: none; font-size: 2.2rem; line-height: 1; color: var(--gray-04); border-radius: 1rem; cursor: pointer; transition: background .2s; }
.select-options li button:hover{ background-color: #F3F6FA;}
.type-file, .type-link { display: none;}
.type-file.active, .type-link.active { display: block;}
.label-side-wrap{display: flex; align-items: center; gap: 3.2rem;}
.radio-group { display: flex; gap: 1.6rem; align-items: center; margin-bottom: 1.2rem;}
.radio-group input[type="radio"] { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); border: 0; }
.radio-group label { position: relative; padding-left: 2.6rem; cursor: pointer; font-size: 2.2rem; color: #444; display: flex; align-items: center; line-height: 1;}
.radio-group label::before { content: ''; position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 2rem; height: 2rem; border: 1px solid var(--gray-03); background: #fff; border-radius: 50%; box-sizing: border-box; }
.radio-group label::after { content: ''; position: absolute; left: 0.6rem; top: 50%; transform: translateY(-50%); width: 0.8rem; height: 0.8rem; background: var(--gray-03); border-radius: 50%; display: none; }
.radio-group input[type="radio"]:checked + label::before { border-color: #222; }
.radio-group input[type="radio"]:checked + label::after { display: block; }

/* news */
.news .news-list { flex: 1; min-width: 0; } 
.news .news-list ul { border-top: 1px solid var(--gray-01); } 
.news .news-list ul li { border-bottom: 1px solid #CDCDCD; } 
.news .news-list ul li a { display: flex; align-items: center; justify-content: space-between; gap: 6.72%; height: 10.4rem; padding-inline: 3rem; font-size: 2.4rem; transition: background 0.3s;} 
.news .news-list ul li a:hover { background: #ECF0F6; } 
.news .news-list .title { width: calc(100% - 20.4rem); text-overflow: ellipsis; overflow: hidden; white-space: nowrap; line-height: 1; color: var(--gray-01); } 
.news .news-list .date { color: var(--gray-04); font-size: 2rem; line-height: 1; flex-shrink: 0; } 
.news .news-title { border-bottom: 1px solid #E0E0E0; padding-bottom: 4rem; } 
.news .news-title h3 { text-align: left; font-size: 4rem; line-height: 1.25; } 
.news .news-title .date { display: block; font-size: 2.4rem; color: var(--gray-04); margin-top: 3.3rem; } 
.news .news-content { padding: 6rem 4rem; font-size: 2rem; border-bottom: 1px solid #E0E0E0; } 
.news .news-content img { width: 100%; } 
.news .btn-list { display: block; height: 5.4rem; padding-inline: 5.6rem; margin: 4rem auto 0; font-size: 2rem; font-weight: 800; color: var(--gray-01); border-radius: 1.6rem; border: 1px solid var(--gray-01); } 

/* 개인정보처리방침 */
.policy{margin-top: 9rem; font-size: 2rem; line-height: 4rem;}
.policy h2{font-size: 4rem; line-height: 4.8rem; font-weight: 800; text-align: center; margin-bottom: 8rem; color: var(--gray-01);}
.policy h3{font-size: 2rem; text-align: left; margin-top: 4.8rem; color: var(--gray-02);}
.policy .contact-info{margin-block: 4.8rem;}
.policy .indent{padding-left: 2rem;}

.anchor-target {scroll-margin-top: 30vh;}

@media (max-width: 1279px) {
    .history .history-title h3 {font-size: 8.2rem; line-height: 7.8rem;}
}

@media (max-width: 1023px) {
    /* sub-showcase */
    .sub-showcase { height: 39rem; }
    .sub-showcase h2 { font-size: 3.2rem; line-height: 3.4rem; }
    .sub-showcase p { font-size: 1.8rem; line-height: 2.6rem; margin-top: 1rem;}
    .sub-showcase.about-us { background: url(../images/sub/about_main_m.png) 50% 50% / cover no-repeat; }
    .sub-showcase.portfolio {background: url(../images/sub/portfolio_main_m.png) 50% 50% / cover no-repeat;}
    .sub-showcase.contact-us {background: url(../images/sub/contact_main_m.png) 50% 50% / cover no-repeat;}
    .sub-showcase.recruit {background: url(../images/sub/recruit_main_m.png) 50% 50% / cover no-repeat;}
    .sub-showcase.news {background: url(../images/sub/news_main_m.png) 50% 50% / cover no-repeat;}

    /* sub-page */
    .sub-page{font-size: 1.6rem;}
    .sub-page h3 { font-size: 2.6rem; line-height: 3.2rem; }
    .sub-content { padding-block: 6rem; } 
    .sub-title { padding-bottom: 3rem; } 
    .sub-title p { font-size: 1.6rem; line-height: 2.4rem; margin-top: 1rem;} 
    .sub-section + .sub-section{padding-top: 6rem;}

    .sub-page .sub-nav-inner { max-width: none; padding: 0 2rem; }
    .sub-page .sub-nav a { font-size: 1.8rem; line-height: 2.6rem; height: 6rem; }
    .sub-page .sub-nav a.on::after { border-bottom: 0.3rem solid var(--blue-01); }
    .sub-page .pagination { margin-top: 4rem; } 
    .sub-page .pagination button.pc { display: none; } 

    /* About us - 회사소개 */
    .vision {padding-bottom: 6rem;}
    .vision .sub-nav {margin-bottom: 6rem;}
    .vision .text-uniess{margin-top: 3rem;}
    .vision .text-uniess ul { flex-direction: column; gap: 1.6rem; }
    .vision .text-uniess ul li { flex-direction: row; padding: 0; gap: 2rem; }
    .vision .text-uniess ul li .image { border-radius: 3rem; max-width: 10rem; }
    .vision .text-uniess ul li img { padding: 20%; }
    .vision .text-uniess ul li .text-box { text-align: left; }
    .vision .text-uniess p span::first-letter { font-size: 3rem; line-height: 2.6rem; margin-right: 0.4rem; }
    .vision .text-uniess strong { font-size: 2rem; line-height: 2.2rem; }
    .vision .text-uniess p { margin-block: 0 0.6rem; font-size: 1.4rem; line-height: 1.6rem; }
    .vision .text-uniess p span { display: inline-block; margin: 0; }

    .business .visual { background: url(../images/sub/business_0_m.png) 50% 50% / cover no-repeat; height: 32rem;}
    .business .visual .container {padding-top: 8rem;}
    .business .visual h3 {text-align: center; margin-bottom: 1rem;}
    .business .visual p {font-size: 1.6rem; line-height: 2.4rem; text-align: center; margin: 0 auto 2.6rem auto;}
    .business .visual .bottom-area { flex-direction: column; align-items: flex-start; }
    .business .visual a {width: 18rem; height: 4.6rem; border-radius: 5rem; font-size: 1.4rem; line-height: 1.6rem; gap: 0.5rem; margin: 0 auto;}
    .business .visual a::after {width: 1.8rem; height: 1.8rem;}

    .business #cards .container { flex-direction: column; justify-content: flex-start; }
    .business #cards .card-content,
    .business #cards .card-image { width: 100%; }
    .business #cards .card-image {height: 20rem; margin-top: 2rem; border-radius: 1.6rem;}
    .business #cards .card {border-radius: 3rem 3rem 0 0; padding: 5rem 0 3rem 0; min-height: 100%;}
    .business #cards .card-1 {margin-top: -3rem;}
    .business #cards .card-content dl dt {font-size: 2.4rem; line-height: 2.6rem;}
    .business #cards .card-content dl dd {margin: 1rem 0 2rem 0; font-size: 1.6rem; line-height: 2.6rem;}
    .business #cards .card-tags {gap: 0.6rem;}
    .business #cards .card-tags li {font-size: 1.2rem; line-height: 1.4rem; padding: 1rem 1.2rem;}

    /* About us - 연혁 및 현황 */
    .history {padding-bottom: 6.5rem;}
    .history .sub-nav {margin-bottom: 6rem;}
    .history .history-wrap {margin-top: 4rem;}
    .history .history-title {text-align: center; position: initial;}
    .history .history-title h3 { font-size: clamp(3rem, 16.79vw, 6.6rem); line-height: 1; letter-spacing: -0.01em;}
    .history .history-title h3 span + span {margin: 0.7rem 0 0 2.7rem;}
    .history .history-item {padding-bottom: 4rem;}
    .history .history-item.left,
    .history .history-item.right {margin: 0; text-align: left; padding-left: 3.2rem;}
    .history .history-item h4 {font-size: 2.4rem; line-height: 2.4rem; margin-bottom: 1.2rem;}
    .history .history-item h4::before {width: 2.2rem; height: 2.2rem;}
    .history .history-item h4::after {width: 0.88rem; height: 0.88rem;}
    .history .history-item.left h4::before,
    .history .history-item.right h4::before,
    .history .history-item.left h4::after,
    .history .history-item.right h4::after {right: auto; transform: none; top: 0;}
    .history .history-item.left h4::before,
    .history .history-item.right h4::before {left: -3.3rem;}
    .history .history-item.left h4::after,
    .history .history-item.right h4::after {left: -2.6rem; top: 0.66rem;}
    .history .history-item ul li {font-size: 1.4rem; line-height: 2.4rem; gap: 0.4rem;}
    .history .history-item ul li::before {min-width: 0.2rem; height: 0.2rem; margin-top: 1.1rem;}
    .history .history-item.left ul li {justify-content: flex-start;}
    .history .history-item.left ul li::before {order: initial;}
    .history .history-line {left: 1rem; transform: none; top: 1.5rem;}

    /* portfolio*/
    .portfolio {padding: 6rem 0;}
    .portfolio .filter-controls {flex-direction: column; align-items: flex-end;}
    .portfolio .dropdown {width: 100%;}
    .portfolio .dropdown.active {z-index: 5;}
    .portfolio .dropdown.active .filter-toggle {padding: 1.6rem 2rem 2rem;}
    .portfolio .dropdown-inner {border-radius: 1rem;}
    .portfolio .filter-toggle {font-size: 1.6rem; line-height: 1.4rem; padding: 1.6rem 2rem;}
    .portfolio .filter-options {padding: 0 2rem 1.6rem; max-height: 19rem; overflow-y: auto;}
    .portfolio .filter-options label {font-size: 1.4rem; line-height: 1.8rem;}
    .portfolio .filter-tags {margin: 3rem -2rem 0 -2rem; border-radius: 0; gap: 0; min-height: 6.2rem; padding: 2.2rem 2rem;}
    .portfolio .tags-wrap {max-width: calc(100% - 7rem); position: relative;}
    .portfolio .tags-wrap::after { content: ''; position: absolute; top: 0; right: 0; width: 28%; height: 100%; pointer-events: none; background: linear-gradient(90deg, rgba(243, 246, 250, 0) 0%, #F3F6FA 100% );}
    .portfolio .tags-wrap.is-end::after { opacity: 0; visibility: hidden; transition: opacity 0.3s;}
    .portfolio .tags {gap: 0 1.6rem; overflow-x: auto; overflow-y: hidden; white-space: nowrap; flex-wrap: nowrap; /* 1. Chrome, Safari, Edge, Opera (Webkit 엔진) */ &::-webkit-scrollbar { display: none; }/* 2. Firefox */ scrollbar-width: none; /* 3. IE & 옛날 Edge */ -ms-overflow-style: none;}
    .portfolio .tags li { margin: 0; font-size: 1.4rem; line-height: 1.6rem;}
    .portfolio .tags-clear {font-size: 1.4rem; line-height: 1.6rem; width: 5rem; margin: 0 0 0 2rem;}
    .portfolio .submit {width: 9rem; height: 4.6rem; font-size: 1.6rem; line-height: 1.8rem; border-radius: 1rem;}
    .portfolio .submit::after {width: 1.4rem; height: 1.4rem;}

    .portfolio .project {margin: 6rem 0 4rem 0;}
    .portfolio .project ul {flex-direction: column; gap: 4rem 0;}
    .portfolio .project ul li {width: 100%;}
    .portfolio .project-image {border-radius: 1.6rem; max-width: 100%; aspect-ratio: 628 / 420;}
    .portfolio .project a .project-image::before {display: none;}
    .portfolio .project a .project-image::after {display: none;}
    .portfolio .project-desc h3 {padding-top: 1.6rem; font-size: 1.8rem; line-height: 2.4rem; display: -webkit-box; text-overflow: ellipsis; white-space: normal; -webkit-line-clamp: 2; -webkit-box-orient: vertical; }
    .portfolio .project-desc p {font-size: 1.4rem; line-height: 1.6rem; padding-top: 0.8rem;}

    /* detail - 상세 */
    .detail {height: 100%;}
    .detail::before {transform: scale(1.2);}
    .detail article {padding: 4rem 0;}
    .detail .layer { overflow-y: initial; padding: 4rem 0; border-radius: 1.6rem; max-height: 100%; height: auto;}
    .detail .layer-inner {max-height: 100%; padding: 0 1.8rem;}
    .detail .layer-header p {font-size: 1.4rem; line-height: 1.6rem; margin-bottom: 0.4rem;}
    .detail .layer-header h1 {font-size: 2.4rem; line-height: 3.2rem;}
    .detail .layer .btn-link {width: 2.2rem; height: 2.2rem; top: 1rem; right: 1rem;}
    .detail .layer-body {flex-direction: column; margin-top: 0; gap: 0;}
    .detail .layer-body .images {width: 100%; margin: 1.8rem 0; filter: drop-shadow(0 0 17.68px rgba(0, 0, 0, 0.15)); border-radius: 1.6rem;}
    .detail .layer-body .overview {font-size: 1.6rem; line-height: 2.6rem;}
    .detail .layer-body .layer-tags {margin-top: 1.8rem;}
    .detail .layer-body .years h2 {margin: 4rem 0 1rem 0; font-size: 1.8rem; line-height: 2.4rem;}
    .detail .layer-body .layer-tags,
    .detail .layer-body .years ul {gap: 0.6rem;}
    .detail .layer-body .layer-tags li,
    .detail .layer-body .years ul li {font-size: 1.2rem; line-height: 1.4rem; padding: 1rem 1.2rem; border-radius: 5rem;}

    /* recruit */
    .recruiting {padding-bottom: 6rem;}
    .recruiting .list {flex-direction: column; gap: 1.4rem 0;}
    .recruiting .list > li {width: 100%; height: 13.6rem;}
    .recruiting .list > li > a {border-radius: 1.6rem; padding: 1.7rem 2rem;}
    .recruiting .list > li > a:hover {box-shadow: none;}
    .recruiting .list > li > a::after {width: 0.7rem; height: 1.2rem; top: 1.7rem; right: 2rem;}
    .recruiting h4 {font-size: 1.6rem; line-height: 2.2rem;}
    .recruiting .badge {font-size: 1.2rem; line-height: 1.2rem; padding: 0.7rem 1.2rem; margin-bottom: 0.6rem;}
    .recruiting .conditions li {font-size: 1.2rem; line-height: 1.2rem;}
    .recruiting .conditions li + li::before {margin-inline: 0.8rem; height: 0.8rem;}

    .benefit {padding: 6rem 0;}
    .benefit ul {gap: 1.4rem;}
    .benefit ul li {width: calc((100% - 1.4rem) / 2); aspect-ratio: auto; padding: 2rem 1.6rem; border-radius: 1.6rem; height: 15.4rem;}
    .benefit ul li .icon img {width: 100%; max-width: 4.6rem;}
    .benefit h5 {font-size: 1.6rem; line-height: 2.4rem; color: #000;}

    .apply .sub-title{padding-bottom: 2rem;}
    .apply .sub-title h3{text-align: left;}
    .apply .form-notice{top: 0.9rem;}

    .select-box{width: 100%; height: 6rem;}
    .select-inner{border-radius: 1rem;}
    .select-trigger{height: 6rem; padding-inline: 2rem; border-radius: 1rem;}
    .select-trigger::after{width: 1.2rem; height: 0.8rem;}
    .select-trigger span{font-size: 1.6rem;}
    .select-options{padding-block: 0 1.8rem;}
    .select-options li{padding: 0.5rem 2rem;}
    .select-options li button{padding: 1rem 0; font-size: 1.6rem;}
    .select-options li button:hover{background: #fff;}
    .label-side-wrap{gap: 1.6rem;}
    .radio-group{gap: 1.2rem;}
    .radio-group label{font-size: 1.6rem;}

    .form-wrap{position: relative; margin-top: 4rem;}
    .form-notice{position: absolute; top: 0.2rem; right: 0; font-size: 1.4rem; line-height: 1;}
    .form-row{grid-template-columns: 1fr; margin-bottom: 3rem;}
    .item-label{font-size: 1.8rem; line-height: 1;}
    .item-input{height: 6rem; padding-inline: 2rem; font-size: 1.6rem; border-radius: 1rem;}
    .item-textarea{height: 13rem; line-height: 2.2rem; padding: 2rem;}
    .uploaded-file{height: 6rem; font-size: 1.6rem; padding-inline: 2rem; border-radius: 1rem; line-height: 1.2;}
    .uploaded-file .btn-remove{width: 1.8rem; height: 1.8rem;}
    .btn-file label{height: 6rem; padding-inline: 2rem; font-size: 1.6rem; border-radius: 1rem;}
    .guide-text{font-size: 1.4rem; line-height: 1.6rem;}
    .upload-wrap{gap: 1rem;}
    .agree-wrap{margin-top: 4rem;}
    .agree-wrap label{font-size: 1.6rem; line-height: 1.2;}
    .agree-wrap .noti li{font-size: 1.4rem; line-height: 2rem;}
    .btn-submit{padding-inline: 3.2rem; height: 5.2rem; font-size: 1.6rem; border-radius: 1rem;}

    /* contact us */
    .contact-us .inquire{padding-bottom: 6rem;}
    .contact-us .tab-area ul { flex-wrap: wrap; justify-content: flex-start; gap: 1.4rem 1rem;} 
    .contact-us .tab-area li { flex: 0 0 calc((100% - 1rem) / 2); height: 4rem; } 
    .contact-us .tab-area li label { font-size: 1.4rem; line-height: 1.6rem; } 
    .contact-us .location .tab button { width: calc((100% - 1.2rem) / 2); height: 4rem; padding-inline: 1.2rem; font-size: 1.4rem; line-height: 1.6rem; } 
    .contact-us .location .info { order:3; width: 100%; max-width: 100%; margin-top: 3rem; } 
    .contact-us .location .info li { padding-left: 3rem; margin-bottom: 0.4rem; font-size: 1.4rem; line-height: 1.8rem; } 
    .contact-us .location .info li::before { width: 2.4rem; height: 2.4rem; top: -0.2rem; } 
    .contact-us .location .info li span + span { padding-left: 2rem; } 
    .contact-us .location .info li span + span::before { height: 1.2rem; left: 0.8rem; top: 0.2rem; } 
    .contact-us .location .map { position: static; width: 100%; height: auto; aspect-ratio: 350 / 234; margin-top: 3rem; } 
    .contact-us .location .map .pin { height: 3.7rem; gap: 0.6rem; font-size: 1rem; padding-inline: 2.1rem; } 
    .contact-us .location .map .pin img { width: 2.2rem; height: 2.2rem; margin-top: -0.2rem; } 
    .contact-us .location .map .pin::after { width: 1.2rem; height: 0.6rem; } 

    /* news */
    .news .news-list ul li a { flex-direction: column; align-items: baseline; height: auto; padding: 1.4rem 1rem; font-size: 1.6rem; } 
    .news .news-list ul li a:hover { background: none; } 
    .news .news-list .title { width: 100%; line-height: 1.3; margin-bottom: 1rem;} 
    .news .news-list .date { font-size: 1.2rem; } 
    .news .news-title { padding-bottom: 2rem; } 
    .news .news-title h3 { font-size: 2.4rem; } 
    .news .news-title .date { margin-top: 1rem; font-size: 1.4rem; line-height: 1.6rem; } 
    .news .news-content { padding: 3rem 0; font-size: 1.6rem; } 
    .news .btn-list { height: 5.2rem; padding-inline: 4rem; font-size: 2rem; margin-top: 3rem; border-radius: 1rem; } 

    /* 개인정보처리방침 */
    .policy{margin-top: 6rem; font-size: 1.6rem; line-height: 2.6rem;}
    .policy h2{font-size: 2.4rem; line-height: 3.4rem; margin-bottom: 3rem;}
    .policy h3{font-size: 2rem; text-align: left;}
    .policy h3{margin-top: 2.4rem; font-size: 1.6rem;}
    .policy .contact-info{margin-block: 2.4rem;}
    .policy .indent{padding-left: 1.6rem;}
}