@charset "utf-8";

/* ==========================================================
   고객지원 — mexus.kr 원본 doc.css / responsive.css 수치 기준
   ========================================================== */

/* ==========================================================
   서비스 Network (.service-network)
   ========================================================== */
.service-network{display:flex;flex-direction:column;gap:var(--sp-40);margin-bottom:var(--sp-150);}
.service-network__tit{
  font-family:var(--font-display);
  font-size:var(--fs-40);font-weight:700;color:var(--color-black);line-height:1;
}
.service-network__map-box{
  position:relative;display:flex;align-items:center;justify-content:center;
  padding:var(--sp-60);
  background-color:#fff;border:1px solid #ddd;border-radius:16px 24px 16px 16px;
}
.service-network__map{position:relative;width:505px;height:650px;margin:0;}
.service-network__svg{width:100%;height:100%;}
.service-network__svg svg{width:100%;height:100%;}
.service-network__overlay{
  position:absolute;inset:5.74% 14.03% 18.67% 14.39%;z-index:1;pointer-events:none;
  background:url("https://mexus.kr/images/sub/service-map-overlay.svg") center/contain no-repeat;
}

.service-network__popup{
  position:absolute;z-index:2;pointer-events:none;
  display:none;flex-direction:column;align-items:center;width:auto;
}
.service-network__popup--show{display:flex;}
.service-network__card{
  width:100%;margin-bottom:-6px;padding:var(--sp-10);
  background-color:#fff;border-radius:8px;box-shadow:2px 2px 5px rgba(0,0,0,.2);
}
.service-network__region{font-size:var(--fs-16);color:#878787;text-align:center;line-height:24px;}
.service-network__company{font-size:var(--fs-16);font-weight:700;color:var(--color-black);text-align:center;line-height:24px;}
.service-network__arrow{
  width:14px;height:14px;margin-bottom:-6px;transform:rotate(180deg);
  background:url("https://mexus.kr/images/sub/service-arrow.svg") center/contain no-repeat;
}

/* ==========================================================
   무상수리정책 (.warranty)
   ========================================================== */
.warranty{margin-bottom:var(--sp-150);}
.warranty__cards{display:flex;gap:var(--sp-20);}
.warranty__card{
  flex:1;min-width:0;
  padding:var(--sp-50) var(--sp-40);
  background-color:#fff;border:1px solid #ddd;border-radius:16px;
}
.warranty__tit{
  padding-bottom:var(--sp-15);
  font-size:var(--fs-24);font-weight:700;color:var(--color-black);line-height:1;
}
.warranty__line{width:30px;height:2px;background-color:var(--color-black);}
.warranty__card--primary{border-color:var(--color-primary);}
.warranty__card--primary .warranty__tit{color:var(--color-primary);}
.warranty__card--primary .warranty__line{background-color:var(--color-primary);}

.bullet-list{margin-top:var(--sp-25);display:grid;gap:var(--sp-15);}
.bullet-list__item{display:flex;align-items:flex-start;gap:var(--sp-10);}
.bullet-list__bullet{flex:0 0 5px;width:5px;height:5px;margin-top:7px;}
.bullet-list__bullet img{width:100%;height:100%;}
.bullet-list__txt{flex:1;min-width:0;line-height:1.5;}

/* ==========================================================
   출동 및 보증기간 연장 서비스 (.service-extension)
   ========================================================== */
.service-extension{margin-bottom:var(--sp-150);}
.service-extension__sec-tit{
  margin-bottom:var(--sp-30);
  font-family:var(--font-display);
  font-size:var(--fs-24);font-weight:700;color:var(--color-black);line-height:1;
}
.service-extension__sec1{margin-bottom:var(--sp-100);}
.service-extension__diagram{width:100%;margin:0 0 var(--sp-30);}
.service-extension__diagram img{width:100%;height:auto;}
.service-extension__cards{display:flex;gap:var(--sp-40);}
.service-extension__card{flex:1;min-width:0;}
.service-extension__level{
  margin-bottom:var(--sp-20);
  font-size:var(--fs-20);font-weight:700;line-height:1;
}
.service-extension__level--0{color:#34b9c8;}
.service-extension__level--1{color:#00aee6;}
.service-extension__level--2{color:var(--color-primary);}
.service-extension__level--3{color:#8534cc;}
.service-extension__card .bullet-list{margin-top:0;}
.service-extension__card .bullet-list__item:first-child .bullet-list__txt{
  color:var(--color-black);font-weight:600;
}

.arrival-table{width:100%;border-collapse:collapse;border-top:2px solid var(--color-black);}
.arrival-table thead th{
  padding:12px var(--sp-20);background-color:#f9f9f9;
  font-size:var(--fs-16);font-weight:600;color:var(--color-black);text-align:center;
  border-right:1px solid #ddd;border-bottom:1px solid #ddd;
}
.arrival-table thead th:last-child{border-right:none;}
.arrival-table tbody th{padding:12px var(--sp-20);border-bottom:1px solid #ddd;}
.arrival-table tbody td{
  padding:12px var(--sp-20);line-height:1.5;text-align:center;
  border-left:1px solid #ddd;border-bottom:1px solid #ddd;
}
.service-extension__note{
  margin-top:30px;display:grid;gap:10px;
  font-size:var(--fs-14);color:#878787;line-height:1.5;
}

/* ==========================================================
   설치서비스 (.install-info)
   ========================================================== */
.install-info{display:flex;gap:var(--sp-40);}
.install-info__card{
  position:relative;flex:1;min-width:0;height:400px;
  display:flex;align-items:flex-end;padding:var(--sp-40);
  border-radius:24px;overflow:hidden;
}
.install-info__bg{position:absolute;inset:0;z-index:0;}
.install-info__bg img{width:100%;height:100%;object-fit:cover;}
.install-info__cont{position:relative;z-index:1;display:grid;gap:var(--sp-20);color:#fff;}
.install-info__tit{font-size:var(--fs-24);font-weight:700;color:#fff;line-height:1;}
.install-info__txt{color:#fff;line-height:1.625;}

/* ==========================================================
   Contact Us (.contact-form)
   ========================================================== */
.contact-form{display:flex;align-items:flex-start;gap:var(--sp-100);}
.contact-form__left{width:28.572%;}
.contact-form__tit{font-size:var(--fs-20);font-weight:700;color:var(--color-black);line-height:1.6;}
.contact-form__lead{margin-top:10px;color:#878787;line-height:1.625;}
.contact-form__list{margin-top:var(--sp-40);display:grid;gap:var(--sp-10);max-width:350px;}
.info-card{padding:var(--sp-25);background-color:#f4f4f4;border-radius:8px;}
.info-card__tit{
  margin-bottom:10px;
  font-size:var(--fs-18);font-weight:600;color:var(--color-black);line-height:1.2;
}
.info-card__desc{font-size:var(--fs-14);line-height:1.571;}

.contact-form__right{flex:1;min-width:0;display:grid;gap:var(--sp-60);}
.form-area{display:flex;flex-direction:column;gap:var(--sp-40);}
.form-row{display:flex;margin:0 -20px;}
.form-row--wide .form-group{width:100%;}
.form-group{width:50%;padding:0 20px;}
.form-group__label-wrap{margin-bottom:10px;display:flex;align-items:flex-start;gap:5px;}
.form-group__label{font-size:var(--fs-18);font-weight:600;color:var(--color-black);line-height:1;}
.form-group__required{width:6px;height:6px;flex-shrink:0;}
.form-group__required img{width:100%;height:100%;}

.form-input{
  width:100%;height:60px;padding:0 var(--sp-20);
  border:1px solid #ddd;border-radius:8px;background:#fff;
  color:#505050;font-family:inherit;font-size:var(--fs-16);
}
.form-input::placeholder{color:#aaa;}
.form-input:focus{outline:none;border-color:var(--color-primary);}
textarea.form-input{height:250px;padding:var(--sp-20);line-height:1.6;resize:vertical;}

.file-wrap{display:flex;gap:5px;}
.file-wrap .form-input{flex:1;min-width:0;}
.file-input{display:none;}
.file-btn{
  width:100px;height:60px;flex:none;
  background-color:#505050;border:none;border-radius:8px;
  font-size:var(--fs-16);font-weight:600;color:#fff;cursor:pointer;
}
.file-btn:hover{opacity:.8;}
.captcha-wrap{display:flex;gap:5px;align-items:center;}
.captcha-wrap .form-input{flex:1;min-width:0;}

.form-agree__tit{margin-bottom:var(--sp-20);font-size:var(--fs-20);font-weight:600;color:var(--color-black);line-height:1;}
.form-agree__box{
  height:150px;padding:var(--sp-15);overflow-y:auto;
  background-color:#f4f4f4;border:1px solid #ddd;border-radius:8px;
  font-size:var(--fs-14);color:#505050;line-height:1.5;
}
.form-agree__check{
  margin-top:var(--sp-20);
  display:flex;align-items:center;gap:var(--sp-20);flex-wrap:wrap;
}
.form-agree__check label{cursor:pointer;}
.form-agree__check input{width:24px;height:24px;vertical-align:middle;margin-right:8px;}
.form-agree__more{color:var(--color-primary);text-decoration:underline;}

.form-buttons{margin-top:var(--sp-60);text-align:center;}
.form-buttons .btn-pack{
  min-width:clamp(130px, calc(162 / var(--inner) * 100vw), 162px);
  height:clamp(50px, calc(70 / var(--inner) * 100vw), 70px);
  padding:0 var(--sp-30);
  background:var(--color-black);border:1px solid var(--color-black);border-radius:8px;
  font-family:var(--font-display);
  font-size:var(--fs-18);font-weight:600;color:#fff;cursor:pointer;
}
.form-buttons .btn-pack:hover{opacity:.85;}
.form-notice{margin-top:var(--sp-15);font-size:var(--fs-14);color:#878787;}

/* ==========================================================
   찾아오시는 길 (.direction)
   ========================================================== */
.direction{display:flex;gap:var(--sp-20);margin-bottom:var(--sp-60);}
.direction__map-area{flex:1;min-width:0;border-radius:24px;overflow:hidden;}
.direction__map-area iframe{width:100%;height:100%;border:0;}
.root_daum_roughmap,
.root_daum_roughmap .wrap_map{
  border-radius:20px;overflow:hidden;
  height:clamp(250px, calc(440 / var(--inner) * 100vw), 440px) !important;
  width:100% !important;
}
.root_daum_roughmap .cont{display:none !important;}

.direction__info-panel{
  width:460px;flex-shrink:0;
  padding:var(--sp-50) var(--sp-40) var(--sp-40);
  background-color:#f4f4f4;border-radius:24px;
}
.direction__info-wrap{margin-top:var(--sp-50);}
.direction__address{margin-bottom:var(--sp-30);}
.direction__tit{
  margin-bottom:var(--sp-15);
  font-size:var(--fs-20);font-weight:700;color:var(--color-black);line-height:1.2;
}
.direction__list{display:grid;gap:6px;}
.direction__row{display:flex;align-items:center;gap:var(--sp-30);}
.direction__row dt{min-width:60px;}
.direction__row dd{font-size:var(--fs-16);font-weight:600;color:var(--color-black);}

.location-directions{border-top:1px solid var(--color-black);}
.location-direction__item{display:flex;border-bottom:1px solid #ddd;}
.location-direction__item:last-child{border-bottom:none;}
.location-direction__item:last-child .location-direction__content{padding-bottom:0;}
.location-direction__icon{
  flex:0 0 clamp(75px, calc(150 / var(--inner) * 100vw), 150px);
  display:flex;align-items:flex-start;justify-content:center;
}
.location-direction__icon img{
  width:clamp(75px, calc(150 / var(--inner) * 100vw), 150px);
  height:clamp(75px, calc(150 / var(--inner) * 100vw), 150px);
}
.location-direction__content{flex:1;min-width:0;padding:var(--sp-50) 0;}
.location-direction__title{
  margin:0 0 var(--sp-20);
  font-size:var(--fs-20);font-weight:700;color:var(--color-black);line-height:1em;
}
.location-direction__detail{line-height:2.125em;}
.location-bus{display:flex;align-items:center;gap:var(--sp-10);margin-bottom:var(--sp-15);flex-wrap:wrap;}
.location-bus:last-child{margin-bottom:0;}
.location-bus__badge{
  display:inline-flex;align-items:center;
  padding:5px var(--sp-10);border-radius:4px;
  font-size:12px;font-weight:500;line-height:1em;color:#fff;
}
.location-bus__badge--blue{background-color:#1E7BDB;}
.location-bus__badge--green{background-color:#59BE0A;}
.location-bus__badge--sky{background-color:#02A5E3;}
.location-bus__badge--line1{background-color:#0253A5;}
.location-bus__badge--line6{background-color:#CE7D31;}
.location-bus__badge--center{background-color:#78C5A4;}
.location-bus__number{font-weight:400;line-height:1em;color:#505050;}

/* ==========================================================
   Responsive — 원본 responsive.css (1024 / 640)
   ========================================================== */
@media (max-width:1024px){
  .direction{display:grid;}
  .direction__info-panel{width:100%;}
}

@media (max-width:640px){
  .service-network__map{width:100%;height:100%;}

  .warranty__cards{flex-direction:column;}
  .warranty__txt br{display:none;}

  .service-extension__cards{flex-direction:column;}
  .arrival-table tbody th,
  .arrival-table tbody td{padding:5px;}
  .service-extension__note{gap:5px;margin-top:20px;}
  .service-extension__note li{padding-left:8px;text-indent:-8px;}

  .install-info{flex-direction:column;}
  .install-info br{display:none;}
  .install-info__card{min-height:200px;height:auto;border-radius:15px;}

  .contact-form{display:block;}
  .contact-form__left{width:100%;margin-bottom:30px;}
  .contact-form__left br{display:none;}
  .contact-form__list{max-width:100%;grid-template-columns:repeat(2,1fr);}
  .form-group{width:100%;padding:0;}
  .form-row{margin:0;flex-direction:column;gap:var(--sp-40);}
  .form-input,
  .file-btn{height:44px;}
  textarea.form-input{height:200px;}
}