/*
  ****************************** 공통 ******************************
*/

/*body 기본값*/
html {overflow-x:hidden;scroll-behavior:smooth;}
body {color:#23262a; font-family:'Pretendard', sans-serif; font-size:14px; line-height:1.2; overflow-x:hidden;}

/*공통 레이아웃*/
.pageOutWrap {position:relative; width:100%;overflow: hidden;}
.contentWrap {position: relative; width:100%; max-width:1360px; margin:0 auto; padding:0 20px;}
.fullContentWrap {position: relative; width:100%;}
.cl_sectionTitle {font-size: 50px;font-weight: 600;}
.cl_sectionSubTitle {font-size: 30px;}
.cl_txt {font-size: 24px;line-height: 1.6;}

/* 컬러 */
.c-b {color: #0e3055;}

/* 폰트 */
.notoSerif {font-family: 'Noto Serif', serif;}

/* 구분선 */
.cl_sectionSubTitle .divider {display:inline-block; width:2px; height:22px; background-color:currentColor; vertical-align:middle; margin:0 14px;}

/*접근성*/
.skipNav {position:absolute; left:-9999px; top:0; width:1px; height:1px; overflow:hidden;}
.skipNav:focus {left:0; width:auto; height:auto; overflow:visible; z-index:9999; padding:8px 16px; background:#000; color:#fff;}
.ir {position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}

/*
  ****************************** 헤더 ******************************
*/

/*헤더*/
.cl_header {position: fixed; top: 0; width:100%;background-color: #fff; z-index: 1000;}
.cl_header .headerInner {display:flex; justify-content:space-between; align-items:center; width:100%; max-width:1340px; height:96px; margin:0 auto; padding:0 10px;}
.cl_header .headerLogo a {display:block;font-size: 0;}
.cl_header .headerNav ul {display:flex; align-items:center;}
.cl_header .headerNav ul li {position:relative;padding:0 5px;}
.cl_header .headerNav ul li:first-child {padding-left:0;}
.cl_header .headerNav ul li:last-child {padding-right:0;}
.cl_header .headerNav ul li:not(:last-child)::after {content:''; position:absolute; right:0; top:50%; transform:translateY(-50%); width:1px; height:14px; background:#cccccc;} 
.cl_header .headerNav ul li a {font-size:16px; color:#333333;padding:15px;}

/*햄버거 버튼*/
.btnHamburger {display:none; flex-direction:column; justify-content:center; align-items:center; gap:6px; width:44px; height:44px; background:none; border:none; cursor:pointer; padding:0;}
.btnHamburger span {display:block; width:24px; height:2px; background:#333; border-radius:1px; transition:transform 0.3s, opacity 0.3s;}

/*모바일 nav 오버레이*/
.mobileNav {display:flex; flex-direction:column; justify-content:center; align-items:center; position:fixed; top:0; left:0; width:100%; height:100%; background:#000; z-index:9999; opacity:0; visibility:hidden; transition:opacity 0.35s, visibility 0.35s;}
.mobileNav.is-open {opacity:1; visibility:visible;}
.mobileNav ul {list-style:none; padding:0; margin:0; text-align:center;}
.mobileNav ul li + li {margin-top:44px;}
.mobileNav ul li a {font-size:22px; font-weight:500; color:#fff; text-decoration:none; letter-spacing:0.05em;}
.mobileNavClose {position:absolute; top:10px; right:5px; width:44px; height:44px; background:none; border:none; cursor:pointer; padding:0;}
.mobileNavClose span {display:block; width:24px; height:2px; background:#fff; border-radius:1px; position:absolute; top:50%; left:50%;}
.mobileNavClose span:first-child {transform:translate(-50%,-50%) rotate(45deg);}
.mobileNavClose span:last-child {transform:translate(-50%,-50%) rotate(-45deg);}


/*
  ****************************** 메인 ******************************
*/

/* 
  *** 메인비주얼 
*/
.main .mainVisual {position:relative; z-index:2; width:100%; overflow:hidden;padding-top:96px;}
.main .mainVisual .mainVisualVideo {display:block; width:100%; height:auto;}
.main .mainVisual.is-cover {height:100vh;}
.main .mainVisual.is-cover .mainVisualVideo {height:100%; object-fit:cover; object-position:center center;}
.sec-parallax {position:relative; overflow:hidden;}

/*
  *** sec01
*/
.main .sec01 {position:relative; z-index:1; width: 100%;display: flex;align-items: center;justify-content: center; background-color: #edeeee;}
.main .sec01 .parallax-bg {width:100%;}
.main .sec01 .sec01Bg {position: relative;left: 50%;transform: translateX(-50%); width:1920px;height: 1182px;}
.main .sec01 .topText {position: absolute;top: 150px;left: 50%;transform: translateX(-50%);text-align: center;width: 100%;}
.main .sec01 .topText .cl_sectionTitle { margin-bottom: 20px;}
.main .sec01 .bottomText {position: relative;top: -190px;text-align: center; color: #96989d;}
.main .sec01 .sec01-2 {position: relative;top: -130px;left: 50%;transform: translateX(-50%); width: 1024px;}
.main .sec01 .descBox {display: flex;justify-content: left;align-items: center; position: relative;top: -90px; left: 50%;transform: translateX(-50%); width: 100%; background-color: #fff;}
.main .sec01 .descBox .imgBox img {width:100%; height:auto;}
.main .sec01 .descBox .textBox {padding: 15px 80px; font-size: 30px;}
.main .sec01 .descBox .textBox p + p { margin-top: 40px; }

/*
  *** sec02
*/
.main .sec02 {height:740px;padding-top:200px; background-image: url('../img/section02_bg.png'); background-size: cover; background-position: center;}
.main .sec02 .fullContentWrap {height:100%;}
.main .sec02 .sec02Bg {width:100%; height:100%; object-fit:cover; object-position:bottom;}
.main .sec02 .cl_sectionTitle {color:#fff;margin-bottom: 95px;}
.main .sec02 .textBox p {font-size: 24px; color:#fff;line-height: 1.5;}
.main .sec02 .textBox p + p { margin-top: 40px; }

/*
  *** sec03
*/
.main .sec03 {padding:150px 0 100px;}
.main .sec03 .textBox {text-align:center; margin-bottom:80px;}
.main .sec03 .cl_sectionSubTitle {margin-bottom:70px;}
.main .sec03 .cl_sectionTitle {margin-bottom:50px;}
.main .sec03 .textBox .desc {color:#2c2f31;}
.main .sec03 .compareBox {display:flex;flex-direction:column;justify-content: center;align-items: center; width:100%;padding:50px 0 55px; background-color:#fafafa;}
.main .sec03 .compareHead {display:flex;justify-content:center;align-items:center;gap:1vw;width: 910px;padding-left:142px; margin-bottom:10px;}
.main .sec03 .compareHead .cl_txt {text-align:center;width:50%;}
.main .sec03 .compareRow {display:flex;justify-content:center;align-items:center;max-width:910px;}
.main .sec03 .compareRow img { width:100%;}

/*
  *** sec04
*/
.main .sec04 {padding:145px 0 100px; color:#fff; background-color:#0e3055;}
.main .sec04 .textBox {text-align:center; margin-bottom:70px;}
.main .sec04 .cl_sectionSubTitle {margin-bottom:30px;}
.main .sec04 .cl_sectionTitle {font-size:55px; margin-bottom:50px;}
.main .sec04 .textBox .desc {line-height:1.7;}
.main .sec04 .chartBox {width:100%; background-color:#e8eaed; padding:50px 0 70px; margin:0 auto;}
.main .sec04 .chartBox .chartTitle {font-size:43px; font-weight:700; color:#1a1a1a; margin-bottom:30px;text-align:center;}
.main .sec04 .chartBox .chartTitle span {font-size:25px; font-weight:400; color:#555;}
.main .sec04 .chartInner {width:837px; background-color:#fff; padding:30px; margin:0 auto;} /* TODO: 패딩 확인 필요 */
.main .sec04 .chartInner img {display:block; width:100%;}

/*
  *** sec05
*/
.main .sec05 {padding:150px 0 100px;}
.main .sec05 .textBox {text-align:center; margin-bottom:80px;}
.main .sec05 .cl_sectionSubTitle {margin-bottom:70px;}
.main .sec05 .cl_sectionTitle {font-size:55px; margin-bottom:50px;}
.main .sec05 .textBox .desc {color:#2c2f31;}
.main .sec05 .compareBox {background-color:#fafafa; padding:80px 10px 85px;}
.main .sec05 .compareTitle {font-size:43px; font-weight:700; color:#1a1a1a; text-align:center; margin-bottom:40px;}
.main .sec05 .compareImgRow {display:flex;justify-content: center; gap:7px; margin-bottom:60px;}
.main .sec05 .compareImgCell {flex:1;max-width:325px;}
.main .sec05 .compareImgCell img {display:block; width:100%;}
.main .sec05 .compareCaption {font-size:25px; color:#2c2f31; text-align:center; line-height:1.7;}

/*
  *** sec06
*/
.main .sec06 {position:relative; height:780px; overflow:hidden;background-color:#000;}
.main .sec06 .sec06Bg {display:block; width:80%; height:auto;margin:0 auto; will-change:transform;}
.main .sec06 .sec06Text {position:absolute; top:50%; left:calc(50% + 80px); transform:translateY(-50%); color:#fff;}
.main .sec06 .cl_sectionTitle {margin-bottom:50px; color:#fff;}
.main .sec06 .sec06Desc .cl_txt {color:#fff;}
.main .sec06 .sec06Desc .cl_txt + .cl_txt {margin-top:40px;}

/*
  *** sec07
*/
.main .sec07 {padding:140px 0 135px; background-color:#dae6ff;} 
.main .sec07 .sec07Head {text-align:center; margin-bottom:30px;}
.main .sec07 .cl_sectionTitle {margin-bottom:30px;}
.main .sec07 .sec07SubTxt {font-size:25px;color:#2c2f31; margin-bottom:20px;}
.main .sec07 .sec07Note {font-size:22px;}
.main .sec07 .sec07ImgRow {display:flex; justify-content:center; align-items:flex-end;gap:120px; width:930px; margin:0 auto;}
.main .sec07 .sec07ImgCell {position:relative; flex:1; cursor:pointer;}
.main .sec07 .sec07ImgCell img {display:block; width:100%; height:600px; object-fit:contain; object-position:bottom;} /* TODO: 높이 확인 필요 */

/*sec07 hover 버튼*/
.main .sec07 .sec07ViewBtn {position:absolute; top:50%; left:50%; transform:translate(-50%,-50%) scale(0.85); display:flex; flex-direction:column; align-items:center; justify-content:center; gap:10px; width:180px; height:180px;padding-top:20px; border-radius:50%; background:#fff; border:none; cursor:pointer; opacity:0; transition:opacity 0.3s, transform 0.3s; z-index:2; box-shadow:0 8px 30px rgba(0,0,0,0.18);}
.main .sec07 .sec07ImgCell:hover .sec07ViewBtn,
.main .sec07 .sec07ViewBtn:focus-visible {opacity:1; transform:translate(-50%,-50%) scale(1);}
.main .sec07 .sec07ViewLabel {font-family:'Noto Serif', serif; font-style:italic; font-size:26px; color:#0e3055; text-align:center; line-height:1.3;}
.main .sec07 .sec07ViewArrow {display:flex; align-items:center; justify-content:center; flex-shrink:0; width:34px; height:34px; border-radius:50%; background:#0e3055;}
.main .sec07 .sec07ViewArrow::after {content:''; display:block; width:9px; height:9px; border-right:2px solid #fff; border-bottom:2px solid #fff; transform:rotate(-45deg); margin-left:-3px;}

/*sec07 Modal*/
.sec07Modal {display:flex; justify-content:center; align-items:center; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,0.65); z-index:9998; opacity:0; visibility:hidden; transition:opacity 0.35s, visibility 0.35s;}
.sec07Modal.is-open {opacity:1; visibility:visible;}
.sec07ModalPanel {position:relative; display:flex; width:900px; max-width:90vw; max-height:88vh; background:#fff; overflow:hidden; box-shadow:0 20px 60px rgba(0,0,0,0.3);}
.sec07ModalClose {position:absolute; top:16px; right:16px; width:40px; height:40px; background:none; border:none; cursor:pointer; z-index:3; padding:0;}
.sec07ModalClose span {display:block; width:22px; height:2px; background:#fff; border-radius:1px; position:absolute; top:50%; left:50%;}
.sec07ModalClose span:first-child {transform:translate(-50%,-50%) rotate(45deg);}
.sec07ModalClose span:last-child {transform:translate(-50%,-50%) rotate(-45deg);}
.sec07ModalImg {flex:none; width:44%; background:#edf0f3; display:flex; align-items:center; justify-content:center; padding:50px 30px;}
.sec07ModalImg img {width:100%; max-width:260px; height:auto; object-fit:contain;}
.sec07ModalInfo {flex:1; display:flex; flex-direction:column; overflow-y:auto;}
.sec07ModalHd {background:#0e3055; padding:40px 36px 32px;}
.sec07ModalEn {font-size:13px; color:rgba(255,255,255,0.65); letter-spacing:0.12em; margin-bottom:8px;}
.sec07ModalName {font-size:30px; font-weight:700; color:#fff; margin-bottom:6px;}
.sec07ModalType {font-size:14px; color:rgba(255,255,255,0.75);}
.sec07ModalSpec {width:100%; border-collapse:collapse;}
.sec07ModalSpec tr {border-bottom:1px solid #eee;}
.sec07ModalSpec th {text-align:left; padding:14px 20px; font-size:14px; color:#666; font-weight:500; width:100px; white-space:nowrap; background:#fafafa; vertical-align:middle;}
.sec07ModalSpec td {padding:14px 20px; font-size:14px; color:#333; line-height:1.5; vertical-align:middle;}

/*
  *** secFaq
*/
.main .secFaq {padding:145px 0 100px;}
.main .secFaq .cl_sectionTitle {font-size:60px;}
.main .secFaq .faqTitle {text-align:center; margin-bottom:70px;}
.main .secFaq .faqItem {display:flex; align-items:flex-start; padding:40px 0 45px; border-bottom:1px solid #bfc0c1;}
.main .secFaq .faqItem:last-child {border-bottom:none;}
.main .secFaq .faqNum {flex:none; width:111px; font-size:43px; font-weight:600; color:#23262a;}
.main .secFaq .faqContent {flex:1;}
.main .secFaq .faqQ {font-size:43px; font-weight:600; color:#23262a; margin-bottom:25px;}
.main .secFaq .faqA {font-size:24px; color:#2c2f31; line-height:1.6;}

/*
  *** secContact
*/
.main .secContact {padding:110px 0 100px; background-color:#000;}
.main .secContact .contactInner {display:flex; align-items:center; gap:40px;}
.main .secContact .contactLeft {flex:1;}
.main .secContact .contactTitle {font-size:60px; font-weight:700; color:#fff; margin-bottom:40px;} 
.main .secContact .cl_txt {color:#fff;}
.main .secContact .contactForm {flex:1; max-width:672px; min-width:0;}
.main .secContact .formGroup {margin-bottom:35px;}
.main .secContact .formGroup label {display:block; font-size:24px; color:#fff; margin-bottom:13px;}
.main .secContact .formGroup input[type="text"],
.main .secContact .formGroup input[type="email"],
.main .secContact .formGroup input[type="tel"] {display:block; width:100%; height:60px; padding:0 15px; background-color:#141414; border:1px solid #333333; color:#fff; font-size:24px; font-family:inherit;} 
.main .secContact .formGroup input::placeholder {font-size: 24px; color:#666666;}
.main .secContact .phoneWrap {display:flex;}
.main .secContact .customSelect {position:relative; flex:none; width:90px;} /* TODO: 너비 확인 필요 */
.main .secContact .customSelectTrigger {display:flex; justify-content:space-between; align-items:center; width:100%; height:60px; padding:0 12px; background-color:#141414; border:1px solid #333333; color:#fff; font-size:24px; font-family:inherit; cursor:pointer;}
.main .secContact .customSelectArrow {flex:none; width:0; height:0; border-left:5px solid transparent; border-right:5px solid transparent; border-top:6px solid #fff; transition:transform 0.2s;}
.main .secContact .customSelect.is-open .customSelectArrow {transform:rotate(180deg);}
.main .secContact .customSelectList {display:none; position:absolute; top:100%; left:0; width:100%; background-color:#222222; border:1px solid #333333; border-top:none; z-index:100; list-style:none;}
.main .secContact .customSelect.is-open .customSelectList {display:block;}
.main .secContact .customSelectItem {padding:10px 12px; font-size:14px; color:#fff; cursor:pointer;}
.main .secContact .customSelectItem:hover {background-color:#333333;}
.main .secContact .customSelectItem.is-selected {color:#888888;}
.main .secContact .formGroup textarea {display:block; width:100%; height:130px; padding:14px 16px; background-color:#222222; border:1px solid #333333; color:#fff; font-size:24px; font-family:inherit; resize:none;}
.main .secContact .formGroup textarea::placeholder {color:#666666;}
.main .secContact .formAgree {display:flex; align-items:center; gap:10px; margin-bottom:24px;}
.main .secContact .formAgree input[type="checkbox"] {flex:none; width:24px; height:24px; -webkit-appearance:none; appearance:none; border:2px solid #ffffff;border-radius: 4px; background-color:transparent; cursor:pointer;}
.main .secContact .formAgree input[type="checkbox"]:checked {background-color:#ffffff; background-image:url('../img/icon_check.svg'); background-repeat:no-repeat; background-position:center; background-size:15px 12px;}
.main .secContact .formAgree label {font-size:24px; color:#fff; cursor:pointer;}
.main .secContact .btnSubmit {display:block; width:100%; height:60px; background-color:#000; color:#fff; font-size:24px; font-weight:600; font-family:inherit;border:2px solid #fff; cursor:pointer;}

/*
  ****************************** 푸터 ******************************
*/
.cl_footer {width:100%; height:215px; background-color:#fff;}
.cl_footer .footerInner {display:flex; align-items:center; width:100%; max-width:1320px; height:100%; margin:0 auto; padding-right:140px;}
.cl_footer .footerLogo {flex:none; margin-right:auto;}
.cl_footer .footerLogo a {display:block; font-size:0;}
.cl_footer .footerLogo img {width:150px;}
.cl_footer .footerInfo p {font-size:16px; color:#333; line-height:1.8;}
.cl_footer .footerInfo .copyright {margin-top:8px; font-size:14px; color:#999;}
.cl_footer .emptySpace { padding:0 20px;}

/* PC 화면 정의 (1920px 기준) */

@media(max-width:1200px) {

  .cl_sectionTitle {font-size: 36px;font-weight: 600;}
  .cl_sectionSubTitle {font-size: 20px;}
  .cl_txt {font-size: 18px;line-height: 1.6;}

  .main .sec01 .topText {top: 90px;}
  .main .sec01 .sec01Bg {width:1320px; height:auto;}
  .main .sec01 .bottomText { top: -125px;}
  .main .sec01 .sec01-2 { top:-100px; width:700px;}
  .main .sec01 .descBox {width: max-content;}
  .main .sec01 .descBox .textBox {padding: 36px 26px; font-size: 20px;}
  .main .sec02 {padding-top: 150px;}
  .main .sec03 {padding: 100px 0 33px;}
  .main .sec04 {padding: 100px 0 60px;}
  .main .sec04 .chartInner {width: 650px;}
  .main .sec04 .cl_sectionTitle { font-size: 38px; }
  .main .sec04 .chartBox .chartTitle { font-size: 28px;}
  .main .sec04 .chartBox .chartTitle span{ font-size: 16px;}
  .main .sec05 { padding: 100px 0 60px;}
  .main .sec05 .cl_sectionTitle { font-size: 38px; }
  .main .sec05 .compareTitle { font-size: 28px; }
  .main .sec05 .compareBox {padding: 60px 7px 45px;}
  .main .sec05 .compareCaption {font-size: 18px;}
  .main .sec06 .sec06Bg {position:relative; top:-30%;left:-20%;}
  .main .sec06 .sec06Bg.showBlockPc {display:none;}
    .main .secFaq {padding: 100px 0 60px;}
  .main .secFaq .faqTitle {font-size: 40px; margin-bottom: 40px;}
  .main .secFaq .faqQ {font-size: 28px;}
  .main .secFaq .faqNum {font-size: 28px;}
  .main .secFaq .faqA {font-size: 18px;}
  .main .secFaq .faqItem {padding: 20px 0 25px;}
  .main .secContact {padding: 80px 0 60px;}
  .main .secContact .contactTitle {font-size: 40px; margin-bottom: 20px;}
}/* tablet — 깨짐·겹침·잘림·스크롤 발생 구간만 */

@media(max-width:1000px) {
  .main .sec01 .descBox {width: 95%;}
  .main .sec02 {height: 616px;}
  .main .sec03 .cl_sectionSubTitle {margin-bottom: 40px;}
  .main .sec03 .textBox { margin-bottom: 40px;}
  .main .sec06 .sec06Text {left: calc(49% + 80px);}
  .main .sec07 .sec07ImgCell img {height: auto; }
  .main .sec07 .sec07ImgRow { width:90%;gap:10%}
  
}/* tablet (768~1000px 전 구간 대응) */

@media(max-width:768px) {
  .contentWrap {max-width:720px;padding:0 16px;}
  .cl_sectionTitle {font-size: 25px;font-weight: 600;}
  .cl_sectionSubTitle {font-size: 15px;}
  .cl_sectionSubTitle .divider {display:none;}
  .cl_txt {font-size: 12px;}
  .cl_header .headerInner {height: 55px;}
  .cl_header .headerLogo img {width:88px;}
  .cl_header .headerNav {display:none;}
  .btnHamburger {display:flex;}
  .main .contentWrap > .textBox p > span {font-size: 13px;}

  .main .mainVisual {padding-top:55px;}
  .main .sec01 .sec01Bg { width:100%; height:auto; background-color:#f6f6f6;}
  .main .sec01 .fullContentWrap {display:flex; flex-direction:column;}
  .main .sec01 .contentWrap {padding:0;}
  .main .sec01 .topText {top:3vw; padding:13.3vw 5.3vw 10.7vw; text-align:center;}
  .main .sec01 .topText .cl_sectionTitle {margin-bottom:3.2vw; letter-spacing:-0.09em;}
  .main .sec01 .bottomText {top:-29vw; text-align:center; padding:0; margin-bottom:0;}
  .main .sec01 .sec01-2 {top:-23.3vw; width:100%; margin:0 0 8vw;}
  .main .sec01 .descBox {top:0; flex-direction:column; width:100%;}
  .main .sec01 .descBox .imgBox {width:100%;margin-top:-25vw;}
  .main .sec01 .descBox .textBox {position:absolute; top:44vw; font-size:16px; padding:0 4.3vw; text-align:center; letter-spacing:-0.05em;}
  .main .sec02 {display:flex; flex-direction:column; justify-content:flex-end; width:100%; height:auto; min-height:550px; padding-bottom:50px; background-image:url('../img/section02_bg_m.png'); background-size:cover; background-repeat:no-repeat; text-align:center;}
  .main .sec02 .fullContentWrap {height:auto; width:100%;}
  .main .sec02 .cl_sectionTitle {margin-bottom:4vw;}
  .main .sec02 .textBox p {font-size: 12px;}
  .main .sec02 .textBox p + p {margin-top:1.9vw;}
  .main .sec03 {padding: 60px 0 40px;}
  .main .sec03 .textBox {margin-bottom:20px;}
  .main .sec03 .textBox p > span {font-size: 13px;}
  .main .sec03 .cl_sectionSubTitle {margin-bottom: 7px;}
  .main .sec03 .cl_sectionTitle {margin-bottom: 20px;}
  .main .sec03 .compareBox {padding: 20px 0;}
  .main .sec03 .compareHead {width:100%; padding-left:16vw;}
  .main .sec04 {padding: 60px 0 40px;}
  .main .sec04 .contentWrap {padding:0;}
  .main .sec04 .textBox {margin-bottom:25px;}
  .main .sec04 .textBox p > span {font-size: 13px;}
  .main .sec04 .cl_sectionTitle {font-size: 28px;}
  .main .sec04 .cl_sectionSubTitle {margin-bottom: 20px;}
  .main .sec04 .cl_sectionTitle {margin-bottom: 20px;}
  .main .sec04 .chartInner {width:100%; padding:0 16px;background-color:#f5f5f5;}
  .main .sec04 .chartBox { padding: 20px 0 24px;}
  .main .sec04 .chartBox .chartTitle {font-size: 17px;margin-bottom: 20px;}
  .main .sec04 .chartBox .chartTitle span {font-size: 12px;}
  .main .sec05 {padding: 60px 0 20px;background-color:#fafafa;}
  .main .sec05 .contentWrap {padding:0;}
  .main .sec05 .textBox {padding:0 16px; margin-bottom:20px;}
  .main .sec05 .cl_sectionSubTitle {margin-bottom: 7px; letter-spacing:-0.05em;}
  .main .sec05 .cl_sectionTitle {font-size: 25px; margin-bottom: 20px;}
  .main .sec05 .compareBox {padding: 20px 16px 24px;}
  .main .sec05 .compareTitle {font-size: 17px; margin-bottom: 15px;}
  .main .sec05 .compareImgRow {flex-direction:column; gap:10px; margin-bottom:20px;}
  .main .sec05 .compareImgCell {display: flex; justify-content: center; max-width:none;}
  .main .sec05 .compareImgCell img {display:block; width:70%;}
  .main .sec05 .compareCaption {font-size: 12px;letter-spacing:-0.06em;}
  .main .sec06 {height: auto;}
  .main .sec06 .cl_sectionTitle { margin-bottom:25px;}
  .main .sec06 .sec06Bg {position:static; top:auto; left:auto; width:100%; margin:0;}
  .main .sec06 .sec06Text{top:auto;bottom:100px; left:50%; transform:translateX(-50%);width:100%; text-align:center;}
  .main .sec06 .sec06Desc {color: #fff; opacity:0.8;}
  .main .sec06 .sec06Desc .cl_txt + .cl_txt { margin-top: 20px;}
  .main .sec07 {padding: 60px 0 70px;}
  .main .sec07 .sec07Head {margin-bottom:30px;}
  .main .sec07 .cl_sectionTitle {margin-bottom:15px;}
  .main .sec07 .sec07SubTxt {font-size: 12px; margin-bottom:10px;}
  .main .sec07 .sec07Note {font-size: 12px;}
  .main .sec07 .sec07ImgRow {flex-direction:column; width:250px; gap:50px;}
  .main .secFaq {padding: 60px 0 50px;}
  .main .secFaq .faqTitle {margin-bottom: 30px;}
  .main .secFaq .cl_sectionTitle {font-size: 30px;}
  .main .secFaq .faqItem {padding: 15px 0 20px;}
  .main .secFaq .faqNum {width: 45px; font-size: 18px;}
  .main .secFaq .faqQ {font-size: 18px; margin-bottom: 10px;}
  .main .secFaq .faqA {font-size: 12px;}
  .main .secContact {padding: 60px 0 50px;}
  .main .secContact .contactInner {flex-direction:column;align-items: normal; gap:25px;}
  .main .secContact .contactLeft {text-align:center; margin-bottom:25px;}
  .main .secContact .contactTitle {font-size:30px; margin-bottom:15px;}
  .main .secContact .formGroup {margin-bottom:20px;}
  .main .secContact .formGroup label {font-size:12px; margin-bottom:8px;}
  .main .secContact .formGroup input[type="text"],
  .main .secContact .formGroup input[type="email"],
  .main .secContact .formGroup input[type="tel"] {height:44px; font-size:12px;}
  .main .secContact .formGroup input::placeholder {font-size:12px;}
  .main .secContact .customSelectTrigger {height:44px; font-size:12px;}
  .main .secContact .formGroup textarea {height:80px; font-size:12px;padding:10px 12px;}
  .main .secContact .formAgree {margin-bottom:15px;}
  .main .secContact .formAgree input[type="checkbox"] {width:16px; height:16px;}
  .main .secContact .formAgree label {font-size:12px;}
  .main .secContact .btnSubmit {height:44px; font-size:14px;}
  .cl_footer {height:auto; padding:20px 20px 25px;}
  .cl_footer .footerInner {flex-direction:column; align-items:flex-start; padding-right:0; gap:12px;}
  .cl_footer .footerLogo {margin-right:0;}
  .cl_footer .footerLogo img {width:90px;}
  .cl_footer .footerInfo p {font-size:12px; line-height:1.7;}
  .cl_footer .footerInfo .copyright {margin-top:4px; font-size:12px;}

  
  /*sec07 Modal 모바일*/
  .main .sec07 .sec07ViewBtn {display:none;}
  .sec07ModalPanel {flex-direction:column; max-width:95vw; max-height:92vh; overflow-y:auto;}
  .sec07ModalImg {width:100%; max-height:200px; padding:24px 20px;}
  .sec07ModalImg img {max-width:120px;}
  .sec07ModalClose span {background:#0e3055;}
  .sec07ModalHd {padding:24px 20px 20px;}
  .sec07ModalName {font-size:22px;}
  .sec07ModalSpec th {padding:11px 14px; font-size:12px; width:80px;}
  .sec07ModalSpec td {padding:11px 14px; font-size:12px;}

}/* mobile (360~768px 전 구간 대응) */