@charset "utf-8";

.point { padding:10px; border1px solid pink; }

/************* sub-tab02  **************/
.sub-tab02 { text-align:center; font-size:0; }
.sub-tab02 div { display:inline; }
.sub-tab02 div a { width:100%; font-size:24px; font-weight:700; padding:26px 40px; border-bottom:5px solid #ddd; position:relative; }
.sub-tab02 div a:hover,
.sub-tab02 div.curr a { color:#005baa; border-bottom:5px solid #005baa; }
.sub-tab02 div a:after { width:5px; height:5px; top:40px; left:0px; background:#ccc; border-radius:100%; content:""; display:block; position:absolute; }
.sub-tab02 div:first-child a:after { width:0; }

.page-tit .tab-area { margin-top:50px; }

@media (max-width:1140px) {
  .sub-tab02 div a { font-size:22px; padding:22px 30px; border-bottom:3px solid #ddd; }
  .sub-tab02 div a:hover,
  .sub-tab02 div.curr a { border-bottom:3px solid #005baa; }
  .sub-tab02 div a:after { top:30px; }
}

@media (max-width:860px) {
  .sub-tab02 div a { font-size:20px; }
}

@media (max-width:640px) {
  .sub-tab02 div a { font-size:18px; padding:16px 20px; border-bottom:2px solid #ddd; }
  .sub-tab02 div a:hover,
  .sub-tab02 div.curr a { border-bottom:2px solid #005baa; }
  .sub-tab02 div a:after { width:3px; height:3px; top:24px; }
  .page-tit .tab-area { margin-top:30px; }
}

/* 모바일에서 2줄(3개씩) 배치 */
@media (max-width:479px) {
  .sub-tab02 { display:flex; flex-wrap:wrap; justify-content:center; gap:0; margin:0 20px; }
  .sub-tab02 div { display:block; flex:0 0 33.3333%; }
  .sub-tab02 div a { display:block; box-sizing:border-box; -width:90%; font-size:16px; padding:10px; border-bottom:1px solid #ddd; }
  .sub-tab02 div a:after { top:19px; left:-2px; }
  sub-tab02 div a:after { display:none; }
  .sub-tab02 div.dottNone a:after { width:0; }
}
/************* sub-tab02  끝  **************/

.service01-section { background:#f6fcff; padding:100px 0; }
.service01-section .service01-top { width:80%; margin:0 auto; height:480px; }
.service01-section .service01-top:after { clear:both; display:block; content:""; }
.service01-section .service01-top .img { width:57%; height:100%; float:left; background:url("../img/service_img01.jpg") no-repeat center; background-size:cover; }
.service01-section .service01-top .txt { width:43%; height:100%; float:left; background:#2c72d0; color:#fff; position:relative; text-align:center; }
.service01-section .service01-top .txt div { width:100%; top:50%; -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transform:translateY(-50%); position:absolute; }
.service01-section .service01-top .txt div h1 { font-size:36px; font-weight:800; }
.service01-section .service01-top .txt div p { font-size:20px; margin-top:30px; }

/**********************************/
/* 모바일: 이미지 위, 텍스트 아래 */
@media (max-width:479px) {
  .service01-section { padding:20px 0; }
  .service01-section .service01-top { width:92%; height:auto; margin:0 auto; }
  .service01-section .service01-top .img,
  .service01-section .service01-top .txt { float:none; width:100%; height:auto; }
  .service01-section .service01-top .img { min-height:220px; background-position:center; background-size:cover; }
  .service01-section .service01-top .txt { text-align:center; padding:24px 16px; position:relative; color:#fff; background:#2c72d0; }
  .service01-section .service01-top .txt div { position:static; top:auto; transform:none; -ms-transform:none; -webkit-transform:none; -moz-transform:none; width:100%; }
  .service01-section .service01-top .txt div h1 { font-size:24px; font-weight:800; line-height:1.25; }
  .service01-section .service01-top .txt div p { font-size:16px; margin-top:12px; line-height:1.6; }
}
/*************  end  **************/

.service01-section .process {}
.service01-section .process:after { clear:both; display:block; content:""; }
.service01-section .process li { float:left; width:27%; height:360px; margin-bottom:30px; }
.service01-section .process li.arrow { width:6%; position:relative; }
.service01-section .process li.arrow i { width:100%; top:50%; -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); -moz-transform:translateY(-50%); transform:translateY(-50%); position:absolute; text-align:center; font-size:28px; color:#525252; }
.service01-section .process li .box { height:360px; border:1px solid #2c72d0; border-radius:20px; background:#fff; padding:40px; position:relative; box-shadow:rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; }
.service01-section .process li .box h3 { color:#2c72d0; font-size:20px; font-weight:900; border-bottom:1px solid #dedede; padding-bottom:20px; }
.service01-section .process li .box h1 { font-size:24px; font-weight:800; margin:30px 0 20px; }
.service01-section .process li .box p { font-size:18px; }
.service01-section .process li .box span { position:absolute; right:40px; bottom:40px; }
.service01-section .process li .box span img { height:60px; }

/**********************************/
@media (max-width:860px) {
  .service01-section .process { display:flex; flex-wrap:wrap; gap:16px; }
  .service01-section .process li { float:none; height:auto; flex:0 0 calc((100% - 16px)/2); margin:0; }
  .service01-section .process li.arrow { display:none; }
}
@media (max-width:640px) {
}
@media (max-width:479px) {
  .service01-section .process li { flex:0 0 calc((100% - 16px)/1); float:none; width:100%; height:auto; margin-bottom:16px; }
  .service01-section .process li.arrow { display:none; }
  .service01-section .process li .box { height:auto; padding:24px 20px; border-radius:16px; }
  .service01-section .process li .box h3 { font-size:18px; padding-bottom:14px; }
  .service01-section .process li .box h1 { font-size:20px; margin:18px 0 12px; }
  .service01-section .process li .box p { font-size:15px; line-height:1.6; }
  .service01-section .process li .box span { position:static; display:block; margin-top:16px; text-align:right; }
  .service01-section .process li .box span img { height:48px; }
}
/*************  End  **************/


/***********Y셔츠 찌든 때 다림질 힘드시죠?...부터 아래 끝까지 ***********/
/* ========== Base (모바일) : 이미지 위, 텍스트 아래 ========== */
.service-section { padding:40px 0 80px; }
.service-section.service-bg { background:#f8f8f8; }
.service-section .service-area { position:relative; display:flex; flex-direction:column; gap:20px; height:auto; }
.service-section .service-area:after { content:""; display:block; clear:both; }
.service-section .service-area .img { width:100%; height:240px; float:none; border-radius:16px; background-position:center; background-size:cover; }
.service-section .cont-area { overflow:hidden; }
.service-section .service-area .txt { width:100%; height:auto; float:none; position:static; padding:4px 4px; display:flex; align-items:center; }
.service-section .service-area .txt .txt-area { position:static; top:auto; transform:none; width:100%; }
.service-section .service-area .txt .txt-area h1 { font-size:clamp(22px, 5vw, 40px); line-height:1.2; }
.service-section .service-area .txt .txt-area h1 span { color:#2c72d0; font-weight:800; }
.service-section .service-area .txt .txt-area ul { margin-top:20px; }
.service-section .service-area .txt .txt-area ul li { font-size:clamp(15px, 3.8vw, 22px); margin:10px 0; position:relative; padding-left:14px; line-height:1.6; }
.service-section.service03 .service-area .txt .txt-area ul li { width:600px; }
.service-section.service05 .service-area .txt .txt-area ul li { width:600px; }
.service-section .service-area .txt .txt-area ul li:after { content:""; position:absolute; left:0; top:0.9em; width:4px; height:4px; background:#666; border-radius:50%; }
.service-section.service02 .img { background:url("../img/service_img02.png") no-repeat center / cover; }
.service-section.service03 .img { background:url("../img/service_img03.png") no-repeat center / cover; }
.service-section.service04 .img { background:url("../img/service_img04.png") no-repeat center / cover; }
.service-section.service05 .img { background:url("../img/service_img05.png") no-repeat center / cover; }
.service-section.service06 .img { background:url("../img/service_img06.png") no-repeat center / cover; }

/* ========== Tablet (≥768px): 여백·높이 확장 ========== */
@media (min-width:768px) {
  .service-section { padding:60px 0 90px; }
  .service-section .service-area .img { height:320px; border-radius:24px; }
}

/* ========== Desktop (≥1024px): 좌우 2단 레이아웃 ========== */
@media (min-width:1024px) {
  .service-section { padding:0 0 100px; }
  .service-section .service-area { flex-direction:row; align-items:stretch; gap:0; min-height:500px; }
  .service-section .service-area .img { width:52%; height:auto; border-radius:0 300px 300px 0; }
  .service-section .service-area .txt { width:42%; padding:0 40px; }
  .service-section.service-bg .service-area { flex-direction:row-reverse; }
  .service-section.service-bg .service-area .img { border-radius:300px 0 0 300px; }
  .service-section .service-area .txt .txt-area h1 { font-size:40px; }
  .service-section .service-area .txt .txt-area ul { margin-top:40px; }
  .service-section .service-area .txt .txt-area ul li { font-size:22px; margin:14px 0; }
  .service-section .service-area .txt .txt-area ul li { font-size:22px; margin:14px 0; }
}
/*************  End (Y셔츠 찌든 때 다림질 힘드시죠?...부터 아래 끝까지)  **************/


/*************  플러스 크리닝 시작  **************/
.plus01 .sub-page-tit p {margin-top:15px;}
.plus01 .cont-area p {font-size:24px; color:#393939; margin-top:10px;}


.plus01 .img { background:url("../img/plus_img01.png?v") no-repeat center / cover; }
.plus02 .img { background:url("../img/plus_img02.png?v") no-repeat center / cover; }
.plus03 .img { background:url("../img/plus_img03.png?v") no-repeat center / cover; }
.plus04 .img { background:url("../img/plus_img04.png?v") no-repeat center / cover; }
.plus05 .img { background:url("../img/plus_img05.png?v") no-repeat center / cover; }
/*************  플러스 크리닝 End **************/


/*************  이런 세탁물은 하드엔드 케어에 맡겨주세요!  **************/
.highend01-section { padding:30px 0 80px; }
.highend01-section .service01-top { width:min(95%, 1200px); margin:0 auto; display:flex; flex-direction:column; gap:20px; min-height:auto; }
.highend01-section .service01-top:after { content:""; display:block; clear:both; }
.highend01-section .service01-top .img { width:100%; min-height:240px; background:url("../img/highend_img01.jpg?v") no-repeat center / cover; float:none; border-radius:10px; }
.highend01-section .service01-top .txt { width:100%; color:#fff; background:#7333bb; text-align:left; float:none; position:static; padding:24px 20px; display:flex; align-items:center; }
.highend01-section .service01-top .txt div { position:static; top:auto; transform:none; width:100%; max-width:760px; }
.highend01-section .service01-top .txt div h1 { font-size:clamp(22px, 5vw, 36px); font-weight:800; line-height:1.2; }
.highend01-section .service01-top .txt div ul { margin-top:16px; }
.highend01-section .service01-top .txt div ul li { font-size:clamp(14px, 3.8vw, 20px); margin:10px 0; position:relative; padding-left:15px; letter-spacing:-0.05em; line-height:1.6; }
.highend01-section .service01-top .txt div ul li:after { content:""; display:block; position:absolute; left:0; top:0.9em; width:4px; height:4px; background:#fff; border-radius:50%; }

.highend01-section .service01-section {padding-top:30px;}
.highend01-section .service01-section li.wide {width:93%; margin-bottom:0; height:250px;}
.highend01-section .service01-section li.wide .box {height:auto;}
.highend01-section .service01-section li.wide .box p {padding-bottom:10px;}


@media (max-width:860px) {
  .highend01-section .service01-section li.wide .box p {padding-bottom:80px;}
}
@media (max-width:480px) {
  .highend01-section .service01-section li.wide .box p {padding-bottom:0;}
}
/* ========== ≥480px: 여백/높이 살짝 키우기 ========== */
@media (min-width:480px) {
  .highend01-section { padding:50px 0 90px; }
  .highend01-section .service01-top .img { min-height:300px; border-radius:16px; }
}

@media (min-width:768px) {
  .highend01-section .service01-top .txt { padding:32px 28px; }
  .highend01-section .service01-top .txt div ul { margin-top:22px; }
}

@media (min-width:1024px) {
  .highend01-section { padding:0 0 100px; }
  .highend01-section .service01-top { flex-direction:row; align-items:stretch; gap:0; min-height:540px; width:80%; }
  .highend01-section .service01-top .img { width:57%; min-height:auto; border-radius:0; }
  .highend01-section .service01-top .txt { width:43%; padding:0 40px 0 50px; }
  .highend01-section .service01-top .txt div ul { margin-top:30px; }
}
/*************  End (이런 세탁물은 하드엔드 케어에 맡겨주세요!)  **************/

/*************  케어센터 (삭제)  **************
.highend02-section { background:url("../img/highend02_bg.jpg?v") no-repeat center; background-size:cover; padding:50px 0 100px; }
.highend02-section .sub-page-tit { color:#fff; margin-bottom:20px; }
.highend02-section .sub-page-tit h1 span { font-weight:500; }
.highend02-section .highend02-area { text-align:center; }
.highend02-section .highend02-area h1 img { width:70%; }
.highend02-section .highend02-area p { margin-top:100px; }

/* 모바일 *
@media (max-width:576px) {
  .highend02-section .highend02-area h1 img { width:100%; }
}
/*************  End (케어센터)  **************/

/*************  하이엔드 케어의 꼼꼼 세탁 프로세스  **************
.highend03-section { padding:40px 0 80px; }
.highend03-section .cont-area { overflow:hidden; }
.highend03-section .process-area { position:relative; display:flex; flex-direction:column; gap:20px; min-height:auto; margin-bottom:40px; }
.highend03-section .process-area:after { content:""; display:block; clear:both; }
.highend03-section .process-area .img { width:100%; min-height:260px; background-position:center; background-size:cover; float:none; border-radius:14px; }
.highend03-section .process-area .txt { width:100%; height:auto; float:none; position:static; padding:0 16px; display:flex; align-items:center; }
.highend03-section .process-area .txt .txt-area { position:static; top:auto; transform:none; width:100%; max-width:820px; margin:0 auto; }
.highend03-section .process-area .txt .txt-area h1 { font-size:clamp(22px, 5.2vw, 36px); font-weight:800; line-height:1.2; }
.highend03-section .process-area .txt .txt-area p { margin-top:16px; font-size:clamp(15px, 3.8vw, 22px); line-height:1.7; color:#666; }
.highend03-section .process01 .img { background:url("../img/highend03_img01.jpg") no-repeat center / cover; }
.highend03-section .process02 .img { background:url("../img/highend03_img02.jpg") no-repeat center / cover; }
.highend03-section .process03 .img { background:url("../img/highend03_img03.jpg") no-repeat center / cover; }
.highend03-section .process04 .img { background:url("../img/highend03_img04.jpg") no-repeat center / cover; }
.highend03-section .process05 .img { background:url("../img/highend03_img05.jpg") no-repeat center / cover; }
.highend03-section .process06 .img { background:url("../img/highend03_img06.jpg") no-repeat center / cover; }
.highend03-section .process07 .img { background:url("../img/highend03_img07.jpg") no-repeat center / cover; }

/* ===== ≥480px : 여백/높이 보강 ===== *
@media (min-width:480px) {
  .highend03-section .process-area { margin-bottom:50px; }
  .highend03-section .process-area .img { min-height:320px; border-radius:18px; }
}

/* ===== ≥768px : 타이포/여백 확장 ===== *
@media (min-width:768px) {
  .highend03-section .process-area .txt { padding:0 24px; }
  .highend03-section .process-area .txt .txt-area p { margin-top:22px; }
}

/* ===== ≥1024px : 좌우 2단(52:42), 라운드 방향 반영 ===== *
@media (min-width:1024px) {
  .highend03-section { padding:0 0 100px; }
  .highend03-section .process-area { flex-direction:row; align-items:stretch; gap:0; min-height:400px; margin-bottom:60px; }
  .highend03-section .process-area .img { width:52%; min-height:auto; border-radius:0 300px 300px 0; }
  .highend03-section .process-area .txt { width:42%; padding:0 40px; }
  .highend03-section .process-area.img-r { flex-direction:row-reverse; }
  .highend03-section .process-area.img-r .img { border-radius:300px 0 0 300px; }
}

/* ===== ≤860px : 카드형 스타일(요청 반영) ===== *
@media (max-width:860px) {
  .highend03-section .process-area { background:#fff; border-radius:16px; box-shadow:rgba(0, 0, 0, 0.08) 0 6px 18px; padding:16px 12px 20px; margin-bottom:28px; overflow:hidden; }
  .highend03-section .process-area .img { min-height:240px; border-radius:12px; }
  .highend03-section .process-area .txt { padding:0 8px; }
}

/* ===== ≥1440px : 타이포 상한 확대(요청 반영) ===== *
@media (min-width:1440px) {
  .highend03-section .process-area { min-height:460px; }
  .highend03-section .process-area .txt .txt-area h1 { font-size:42px; }
  .highend03-section .process-area .txt .txt-area p { font-size:24px; margin-top:34px; }
}
/*************  End (하이엔드 케어의 꼼꼼 세탁 프로세스)  **************/

/*************  세탁물 보관방법  **************/
.highend04-section { background:#140821; padding:0 0 100px; }
.highend04-section .sub-page-tit { color:#fff; }
.highend04-section .sub-page-tit ul { width:80%; margin:40px auto; }
.highend04-section .sub-page-tit ul li { font-size:24px; margin:10px 0; }
.highend04-section .sub-page-tit ul li i { margin-right:7px; font-weight:900; }
.highend04-section .photo-area { padding:0 50px 50px 50px; background:#140821; }
.highend04-section .photo-area .img { background:#140821; text-align:center; }
.highend04-section .photo-area .img li {margin:30px 0;}

@media (max-width:768px){
	.highend04-section .photo-area { padding:0 20px 40px 20px; }
	.highend04-section .photo-area .img { max-width:80%; margin:0 auto; }
	.highend04-section .sub-page-tit ul li { font-size:18px; }
}
@media (max-width:480px) {
  .highend04-section .sub-page-tit ul { width:100%; }
  .highend04-section .sub-page-tit ul li { font-size:18px; }
  .highend04-section .photo-area { padding:10px; }
  .highend04-section .photo-area .img { max-width:90%;}
}
/*************  End (세탁물 보관방법)  **************/

/*************  브랜드  **************/
.highend05-section { padding:50px 0 100px; background:#f8f8f8; }
.highend05-section ul {}
.highend05-section ul:after { clear:both; display:block; content:""; }
.highend05-section ul li { width:20%; float:left; padding:10px; }

@media (max-width:480px) {
  .highend05-section { padding:50px 0 70px; }
  .highend05-section ul li { width:33.3333%; padding:5px; }
}
/*************  End (브랜드)  **************/

/*************  이런 신발은 하이엔드케어!  **************/
.highend06-section { padding:0 0 100px; }
.highend06-section .img img { border-radius:20px; }
.highend06-section ul { margin-top:40px; }
.highend06-section ul li { padding:20px 0; }
.highend06-section ul li .box { border:1px solid #dedede; border-radius:20px; background:#f8f8f8; text-align:center; box-shadow:rgba(99, 99, 99, 0.2) 0px 2px 8px 0px; padding:50px; }
.highend06-section ul li .box h1 { font-size:28px; font-weight:800; color:#7333bb; margin-bottom:30px; }
.highend06-section ul li .box p { font-size:20px; color:#525252; margin:10px 0; }

@media (max-width:480px) {
  .highend06-section ul li .box h1 { font-size:clamp(20px, 5vw, 28px); margin-bottom:16px; line-height:1.25; }
  .highend06-section ul li .box p { font-size:clamp(14px, 3.8vw, 20px); margin:8px 0; line-height:1.7; }
}
/*************  End (이런 신발은 하이엔드케어!)  **************/
