/* 앤드성형외과 눈성형 카테고리 수정 (WR-20261015-0002) — TEST 전용 추가 css. 되돌리기: 이 파일 삭제 + 각 페이지 link 한 줄 삭제 */

/* ===== 1. 상단 배너: 새 디자인 이미지(글자 포함)로 교체 ===== */
.sub_head.eye1016 .sub_head_common,
.sub_head.eye1016 .sub_text{display:none;}
.sub_head.eye1016 .sub_title{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.sub_head.eye1016 .wrap::after{top:auto;bottom:0;right:50%;margin-right:-960px;width:1920px;height:602px;background-repeat:no-repeat;background-position:center top;background-size:1920px 602px;}
.sub_head.sub2010.eye1016 .wrap::after{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_1.jpg');}
.sub_head.sub2020.eye1016 .wrap::after{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_2.jpg');}
.sub_head.sub2030.eye1016 .wrap::after{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_3.png');}
.sub_head.sub2040.eye1016 .wrap::after{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_4.jpg');}
.sub_head.sub2050.eye1016 .wrap::after{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_5.jpg');}
.sub_head.sub2060.eye1016 .wrap::after{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_6.jpg');}
.sub_head.sub2070.eye1016 .wrap::after{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_7.jpg');}

/* PC(1001px 이상): 배너를 잘라내지 않고 가로 100%·비율대로 표시(글자 전체가 항상 보임), 1920 이상은 원본 크기 */
@media all and (min-width:1001px){
  .sub_head.eye1016{height:31.354vw;padding-top:0;background-color:#e6e5da;background-repeat:no-repeat;background-position:center top;background-size:100% 100%;}
  .sub_head.eye1016 .wrap::after{display:none;}
  .sub_head.eye1016 .ul.summary{position:absolute;left:0;bottom:-60px;margin-top:0;width:450px;height:150px;}
  .sub_head.eye1016 .ul.summary.wide{width:540px;}
  .sub_head.eye1016 .ul.summary .li{width:150px;height:150px;}
  .sub_head.eye1016 .ul.summary.wide .li:last-child{width:240px;}
  .sub_head.eye1016 .ul.summary .li img{margin:25px auto 15px auto;}
  .sub_head.eye1016 .ul.summary .li .desc{font-size:17px;}
  .sub_head.eye1016 .ul.summary .li .desc strong{font-size:19px;}
  .sub_head.sub2010.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_1.jpg');}
  .sub_head.sub2020.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_2.jpg');}
  .sub_head.sub2030.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_3.png');}
  .sub_head.sub2040.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_4.jpg');}
  .sub_head.sub2050.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_5.jpg');}
  .sub_head.sub2060.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_6.jpg');}
  .sub_head.sub2070.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_7.jpg');}
}
/* 1936px 이상(화면 실폭이 1920 초과): 가운데 원본 크기 + 양옆은 이미지 가장자리 색으로 채움 */
@media all and (min-width:1936px){
  .sub_head.eye1016{height:602px;background-repeat:no-repeat;}
  .sub_head.sub2010.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_1.jpg'),linear-gradient(to bottom,#f0e7e0,#e8e5da,#e1e2d6),linear-gradient(to bottom,#e6e4d8,#e0e2d5,#e0e2d5);background-size:1920px 602px,50% 100%,50% 100%;background-position:center top,left top,right top;}
  .sub_head.sub2020.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_2.jpg'),linear-gradient(to bottom,#eee5dd,#e7e3d8,#dfe0d4),linear-gradient(to bottom,#e4e2d6,#dee0d3,#dee0d3);background-size:1920px 602px,50% 100%,50% 100%;background-position:center top,left top,right top;}
  .sub_head.sub2030.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_3.png'),linear-gradient(to bottom,#eee6dd,#e6e3d8,#dfe1d4),linear-gradient(to bottom,#e4e2d7,#dee0d3,#dee0d3);background-size:1920px 602px,50% 100%,50% 100%;background-position:center top,left top,right top;}
  .sub_head.sub2040.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_4.jpg'),linear-gradient(to bottom,#f5ebe1,#f6e7e2,#f7e5e3),linear-gradient(to bottom,#f5ebe1,#f6e7e2,#f7e5e3);background-size:1920px 602px,50% 100%,50% 100%;background-position:center top,left top,right top;}
  .sub_head.sub2050.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_5.jpg'),linear-gradient(to bottom,#eee5dd,#e7e3d8,#dfe0d4),linear-gradient(to bottom,#e4e2d6,#dee0d3,#dee0d3);background-size:1920px 602px,50% 100%,50% 100%;background-position:center top,left top,right top;}
  .sub_head.sub2060.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_6.jpg'),linear-gradient(to bottom,#e7ded7,#d1cdc4,#bcbcb4),linear-gradient(to bottom,#cac7c0,#b8b9b1,#b8b9b1);background-size:1920px 602px,50% 100%,50% 100%;background-position:center top,left top,right top;}
  .sub_head.sub2070.eye1016{background-image:url('/theme/and/images/sub/eye1016/hero_sub2_7.jpg'),linear-gradient(to bottom,#f0e7e0,#e8e5da,#e1e2d6),linear-gradient(to bottom,#e6e4d8,#e0e2d5,#e0e2d5);background-size:1920px 602px,50% 100%,50% 100%;background-position:center top,left top,right top;}
}

/* 요약 박스 (수술시간·마취·실밥) 문구가 길어진 곳 */
.sub_head.eye1016 .ul.summary.wide{width:540px;}
.sub_head.eye1016 .ul.summary.wide .li:last-child{width:240px;}
.sub_head.eye1016 .ul.summary .nw{white-space:nowrap;}

/* ===== 2. 눈성형철학 > 앤드 맞춤 눈성형 (그림 한 장 + 카드별 연결) ===== */
.box.eye_custom{padding:0;background:#fff;}
.eye_custom .eye_sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;}
.eye_custom .eye_pc{position:relative;max-width:1920px;margin:0 auto;}
.eye_custom .eye_pc img{display:block;width:100%;height:auto;}
.eye_custom .eye_pc .hs{position:absolute;display:block;border-radius:40px;}
.eye_custom .eye_pc .hs:hover,.eye_custom .eye_pc .hs:focus{background:rgba(255,255,255,0.12);outline:2px solid rgba(141,143,130,0.55);}
.eye_custom .eye_m{display:none;}

/* ===== 3. 쌍꺼풀 라인 4종 ===== */
.eye_line4 .line4{display:flex;gap:26px;margin:0;padding:0;list-style:none;font-size:0;line-height:0;}
.eye_line4 .line4 li{flex:1 1 0;min-width:0;}
.eye_line4 .line4 li img{display:block;width:100%;height:auto;}
.eye_line4 .line4 li .txt{padding:30px 14px 34px;text-align:center;}
.eye_line4 .line4 li:nth-child(odd) .txt{background:#a2968e;color:#fff;}
.eye_line4 .line4 li:nth-child(even) .txt{background:#eeeae7;color:#222;}
.eye_line4 .line4 li .subject{margin:0 0 14px;font-size:26px;line-height:1.3;font-weight:700;}
.eye_line4 .line4 li .desc{margin:0;font-size:17px;line-height:1.6;word-break:keep-all;}
.eye_line4 .line4_note{margin:30px 0 0;text-align:center;font-size:16px;line-height:1.5;color:#8c8c8c;word-break:keep-all;}

/* ===== 4. 한눈에 보기 카드 / 자주 묻는 질문 (자연유착/매몰/절개) ===== */
.eye_glance{background:#efeeea;padding:110px 0 10px;}
.eye_glance .wrap{max-width:1000px;margin:0 auto;padding:0 20px;box-sizing:border-box;}
.glance_card{position:relative;padding:38px 44px 40px;background:#fff;border:1px solid #e3dfdd;border-radius:28px;text-align:left;}
.glance_tag{display:inline-block;padding:6px 16px;margin-bottom:16px;border-radius:30px;background:#8d8f82;color:#fff;font-size:16px;line-height:1.3;font-weight:600;letter-spacing:0;}
.glance_title{margin:0 0 14px;font-size:28px;line-height:1.35;font-weight:700;color:#222;word-break:keep-all;}
.glance_text{margin:0;font-size:18px;line-height:1.75;color:#444;word-break:keep-all;}
.eye_faq{background:#fff;}
.eye_faq .faq_list{max-width:1000px;margin:40px auto 0;padding:0;list-style:none;text-align:left;}
.eye_faq .faq_item{margin-bottom:20px;padding:28px 34px 30px;border:1px solid #e3dfdd;border-radius:22px;background:#faf9f7;}
.eye_faq .faq_q{display:flex;gap:14px;margin:0 0 14px;font-size:21px;line-height:1.5;font-weight:700;color:#222;word-break:keep-all;}
.eye_faq .faq_mark{flex:0 0 34px;height:34px;border-radius:50%;background:#a2968e;color:#fff;font-size:18px;line-height:34px;text-align:center;font-weight:600;}
.eye_faq .faq_qt{flex:1;}
.eye_faq .faq_a{margin:0 0 0 48px;font-size:17px;line-height:1.75;color:#444;word-break:keep-all;}

/* ===== 태블릿·휴대폰 ===== */
@media all and (max-width:1000px){
  .eye_glance{padding-top:60px;}
}
@media all and (max-width:768px){
  /* 맞춤 눈성형: 휴대폰은 카드 2열 */
  .eye_custom .eye_pc{display:none;}
  .eye_custom .eye_m{display:block;padding:44px 16px 50px;background:#fff;}
  .eye_custom .eye_m_head{width:100%;max-width:520px;margin:0 auto 24px;aspect-ratio:640/205;background:url('/theme/and/images/sub/eye1016/custom_eye.jpg') 50% 9.1% / 300% auto no-repeat;}
  .eye_custom .eye_m_grid{display:grid;grid-template-columns:1fr 1fr;gap:14px 12px;max-width:520px;margin:0 auto;padding:0;list-style:none;}
  .eye_custom .eye_m_grid li{margin:0;padding:0;}
  .eye_custom .eye_m_grid a{display:block;width:100%;aspect-ratio:360/400;background:url('/theme/and/images/sub/eye1016/custom_eye.jpg') no-repeat;background-size:533.333% auto;}
  /* 쌍꺼풀 라인 */
  .eye_line4 .line4{flex-wrap:wrap;gap:16px;}
  .eye_line4 .line4 li{flex:1 1 calc(50% - 8px);}
  .eye_line4 .line4 li .txt{padding:22px 12px 26px;}
  .eye_line4 .line4 li .subject{font-size:22px;margin-bottom:10px;}
  .eye_line4 .line4 li .desc{font-size:16px;}
  .eye_line4 .line4 li .desc br{display:none;}
  /* 한눈에 보기·FAQ */
  .eye_glance{padding:44px 0 0;}
  .glance_card{padding:26px 22px 28px;border-radius:22px;}
  .glance_title{font-size:23px;}
  .glance_text{font-size:16px;line-height:1.7;}
  .eye_faq .faq_item{padding:22px 20px 24px;}
  .eye_faq .faq_q{font-size:18px;gap:10px;}
  .eye_faq .faq_mark{flex-basis:30px;height:30px;font-size:16px;line-height:30px;}
  .eye_faq .faq_a{margin-left:0;font-size:16px;}
}


@media all and (max-width:480px){
  .eye_line4 .line4 li{flex:1 1 100%;}
  .eye_line4 .line4 li img{max-width:300px;margin:0 auto;}
  .eye_line4 .line4 li .txt{max-width:300px;margin:0 auto;}
}

/* ===== 눈성형철학 > 유형에 따른 수술 종류: 원 4개 같은 크기(350px)로 키워 글자가 원 안에 여유 있게 들어오게 (글자 크기는 그대로) ===== */
.sub2010 .box.list1 .ul-wrap{height:auto;padding-bottom:50px;}
.sub2010 .box.list1 .list.circle{margin-bottom:0;}
.sub2010 .box.list1 .list.circle .ul .li{display:inline-flex;flex-direction:column;justify-content:center;align-items:center;width:350px;height:350px;padding:0 26px;margin:0 20px 20px 0;box-sizing:border-box;}
.sub2010 .box.list1 .list.circle .ul .li:last-child{margin-right:0;}
.sub2010 .box.list1 .list.circle .ul .li .num{margin:0 0 12px 0;}
.sub2010 .box.list1 .list.circle .ul .li .desc{display:block;}
.sub2010 .box.list1 .list.circle .ul .li .desc br{display:inline;}
@media all and (min-width:1600px){
  .sub2010 .box.list1 .ul-wrap{width:1560px;margin-left:calc(50% - 780px);}
  .sub2010 .box.list1 .list.circle .ul{width:100%;margin:50px 0 0;}
}
@media all and (max-width:1599px){
  .sub2010 .box.list1 .list.circle .ul{width:760px;max-width:100%;margin:50px auto 0;}
  .sub2010 .box.list1 .list.circle .ul .li:nth-child(2n){margin-right:0;}
  .sub2010 .box.list1 .list.circle .ul .li:nth-child(2n+1){margin-right:20px;}
}
@media all and (max-width:760px){
  .sub2010 .box.list1 .list.circle .ul{width:auto;margin-top:30px;}
  .sub2010 .box.list1 .list.circle .ul .li,.sub2010 .box.list1 .list.circle .ul .li:nth-child(2n+1),.sub2010 .box.list1 .list.circle .ul .li:nth-child(2n){display:flex;width:310px;height:310px;padding:0 16px;margin:0 auto 16px auto;}
}

/* ===== 10/16 추가수정: 상단 요약 박스 3칸 같은 너비(실밥 제거 칸만 넓어지지 않게) ===== */
@media all and (min-width:1001px){
  .sub_head.eye1016 .ul.summary .li:last-child .desc{font-size:16px;letter-spacing:-0.03em;white-space:nowrap;}
}
/* ===== 10/16 추가수정: 쌍꺼풀 라인 — 진한 칸(인라인·세미아웃) 제목을 본문 글자색(흰색)에 맞춤 ===== */
.eye_line4 .line4 li:nth-child(odd) .txt .subject{color:#fff;}
.eye_line4 .line4 li:nth-child(even) .txt .subject{color:#222;}


/* 수정안3: sub3_2(sub3020) 원문과 같은 1920px ::after / contain 방식.
   wrap 및 글자·요약 배치는 운영 공통 CSS를 사용한다. 이미지별 위치만 보정. */
@media all and (max-width:1000px){
  .sub_head.eye1016{height:500px;padding-top:125px;}
  .sub_head.eye1016 .sub_head_common,.sub_head.eye1016 .sub_text{display:block;}
  .sub_head.eye1016 .sub_title{position:relative;width:auto;height:auto;margin:0;overflow:visible;clip:auto;white-space:normal;}
  .sub_head.eye1016 .wrap::after{position:absolute;top:auto;bottom:0;right:50%;margin-right:-960px;width:1920px;height:500px;content:'';background-repeat:no-repeat;background-size:contain;background-position:center center;}
  .sub_head.eye1016 .ul.summary.wide{width:390px;}
  .sub_head.eye1016 .ul.summary.wide .li:last-child{width:130px;}
}
@media all and (max-width:768px){
  .sub_head.eye1016{height:500px;margin-top:60px;padding-top:0;}
  .sub_head.eye1016 .wrap::after{bottom:auto;top:0;height:400px;background-position:left calc(50% + 20px) top;}
  .sub_head.eye1016 .ul.summary.wide{width:100%;}
  .sub_head.eye1016 .ul.summary.wide .li:last-child{width:33.3333%;}
}
@media all and (max-width:640px){
  .sub_head.eye1016{height:400px;}
  .sub_head.eye1016 .sub_title{width:260px;}
  .sub_head.eye1016 .wrap::after{height:300px;background-position:left calc(50% - 60px) top;}
}
@media all and (max-width:550px){
  .sub_head.eye1016 .sub_title{width:230px;}
}
@media all and (max-width:1000px){
  .sub_head.sub2010.eye1016 .wrap::after{background-position:left calc(50% - 240px) center;}
  .sub_head.sub2020.eye1016 .wrap::after{background-position:left calc(50% - 250px) center;}
  .sub_head.sub2030.eye1016 .wrap::after{background-position:left calc(50% - 230px) center;}
  .sub_head.sub2040.eye1016 .wrap::after{background-position:left calc(50% - 220px) center;}
  .sub_head.sub2050.eye1016 .wrap::after{background-position:left calc(50% - 250px) center;}
  .sub_head.sub2060.eye1016 .wrap::after{background-position:left calc(50% - 250px) center;}
  .sub_head.sub2070.eye1016 .wrap::after{background-position:left calc(50% - 240px) center;}
}
@media all and (max-width:768px){
  .sub_head.sub2010.eye1016 .wrap::after{background-position:left calc(50% - 160px) top;}
  .sub_head.sub2020.eye1016 .wrap::after{background-position:left calc(50% - 170px) top;}
  .sub_head.sub2030.eye1016 .wrap::after{background-position:left calc(50% - 150px) top;}
  .sub_head.sub2040.eye1016 .wrap::after{background-position:left calc(50% - 140px) top;}
  .sub_head.sub2050.eye1016 .wrap::after{background-position:left calc(50% - 170px) top;}
  .sub_head.sub2060.eye1016 .wrap::after{background-position:left calc(50% - 170px) top;}
  .sub_head.sub2070.eye1016 .wrap::after{background-position:left calc(50% - 160px) top;}
}
@media all and (max-width:640px){
  .sub_head.sub2010.eye1016 .wrap::after{background-position:left calc(50% - 120px) top;}
  .sub_head.sub2020.eye1016 .wrap::after{background-position:left calc(50% - 130px) top;}
  .sub_head.sub2030.eye1016 .wrap::after{background-position:left calc(50% - 110px) top;}
  .sub_head.sub2040.eye1016 .wrap::after{background-position:left calc(50% - 100px) top;}
  .sub_head.sub2050.eye1016 .wrap::after{background-position:left calc(50% - 130px) top;}
  .sub_head.sub2060.eye1016 .wrap::after{background-position:left calc(50% - 130px) top;}
  .sub_head.sub2070.eye1016 .wrap::after{background-position:left calc(50% - 120px) top;}
}

/* 2026-10-19 휴대폰 상단: 글자 없는 휴대폰용 사진 사용(다른 페이지와 같은 방식) */
@media (max-width:1000px){
  .sub_head.sub2010.eye1016 .wrap::after{background-image:url(../images/sub/eye1016/hero_sub2_1_m.jpg)!important}
  .sub_head.sub2020.eye1016 .wrap::after{background-image:url(../images/sub/eye1016/hero_sub2_2_m.jpg)!important}
  .sub_head.sub2030.eye1016 .wrap::after{background-image:url(../images/sub/eye1016/hero_sub2_3_m.jpg)!important}
  .sub_head.sub2040.eye1016 .wrap::after{background-image:url(../images/sub/eye1016/hero_sub2_4_m.jpg)!important}
  .sub_head.sub2050.eye1016 .wrap::after{background-image:url(../images/sub/eye1016/hero_sub2_5_m.jpg)!important}
  .sub_head.sub2060.eye1016 .wrap::after{background-image:url(../images/sub/eye1016/hero_sub2_6_m.jpg)!important}
  .sub_head.sub2070.eye1016 .wrap::after{background-image:url(../images/sub/eye1016/hero_sub2_7_m.jpg)!important}
}
@media (max-width:1000px){
  .sub_head.sub2020.eye1016 .wrap::after,.sub_head.sub2060.eye1016 .wrap::after{transform:translateX(45px)}
}

@media (max-width:1000px){.sub_head.sub2010.eye1016,.sub_head.sub2010.eye1016 .wrap{height:300px!important;min-height:0!important}}
