

.video_wrap{position: relative; width: 100%; max-height: 970px; overflow: hidden; background: url(/images/video_bg.jpg) no-repeat; background-size: cover;}
.video_wrap iframe{position: absolute; top: 0; left:0; width: 100%; height: 100%;}

#video01{position: relative; height: 0; padding-top:56.25%;}

/* =========================
   MAIN VIDEO CENTER TITLE
========================= */
#video01{
  position: relative;
}

#video01 .main1-title{
  position: absolute;

  /* ✅ 영상 기준 중앙 + PC 둥둥배너 회피 */
  top: 42%;
  left: 75%;
  transform: translate(-60%, -50%); /* ← 중앙보다 살짝 왼쪽 */

  z-index: 6;
  color: #ffffff;
  font-family: 'Nanum Myeongjo', serif;
  font-weight: 400;
  font-size: 35px;
  letter-spacing: 0.1em;
  white-space: nowrap;
  pointer-events: none;

  /* 자연스러운 그림자 */
  text-shadow:
    0 6px 20px rgba(0,0,0,0.45),
    0 2px 6px rgba(0,0,0,0.35);

  /* 애니메이션 초기 상태 */
  opacity: 0;
  animation: mainTitleSlideIn 1.6s ease-out forwards;
}

/* 왼 → 오른쪽으로 흐르듯 */
@keyframes mainTitleSlideIn{
  from{
    opacity: 0;
    transform: translate(-66%, -50%);
  }
  to{
    opacity: 1;
    transform: translate(-60%, -50%);
  }
}

/* 메인 타이틀 글자별 등장(번짐) */
#video01 .main1-title .m1-ch{
  display:inline-block;
  opacity:0;
  transform: translateX(-14px);
  filter: blur(14px);
  will-change: transform, filter, opacity;
}

#video01 .main1-title.play .m1-ch{
  animation: m1Bloom 0.9s cubic-bezier(.2,.8,.2,1) forwards;
  animation-delay: var(--d);
}

@keyframes m1Bloom{
  0%{
    opacity:0;
    transform: translateX(-14px);
    filter: blur(14px);
  }
  70%{
    opacity:1;
    transform: translateX(0);
    filter: blur(2px);
  }
  100%{
    opacity:1;
    transform: translateX(0);
    filter: blur(0);
  }
}


.main2 {
    position: relative;  /* 아이콘 위치 기준 */
}
.main2>img{position: absolute; top: 220px; right: 150px; z-index: 999; opacity: .4;}
.main2 .main2_slider{width: 100%; height: 100%;}
.main2 .main2_slider .swiper-wrapper > div{background: #091F5B;}

/* 공통 슬라이드 이미지 영역 */
.main2 .main2_slider .swiper-slide .slide-image {
    width: 100%;
    height: 550px;               /* PC 기준 슬라이드 높이 */
    background-position: center bottom;
    background-repeat: no-repeat;
    background-size: cover;
    transition: 3s;
}

/* 슬라이드별 백그라운드 이미지 */
.main2 .main2_slider1 .slide-image {
    background-image: url(../images/slider_1.jpg);
}
.main2 .main2_slider2 .slide-image {
    background-image: url(../images/slider_2.jpg);
}
.main2 .main2_slider3 .slide-image {
    background-image: url(../images/slider_3.jpg);
}

/*.main2 .main2_slider .swiper-wrapper > div >div:nth-of-type(2){width: 100%; height: 550px; background-position-y: 80%; transition: 3s;}*/
/*.main2 .main2_slider .swiper-slide.swiper-slide-visible.swiper-slide-active >div:nth-of-type(2){background-position-y: 80%;}*/
.main2 .swiper-pagination{bottom: auto; top: 165px !important; width: auto !important; left: auto !important; right: 460px !important;}
.main2 .swiper-pagination span{display: block; margin-top: 20px !important;}
.main2 .swiper-pagination .swiper-pagination-bullet{
  background: rgba(255,255,255,0.4); /* 예: 연한 흰색 */
  opacity: 1;                        /* Swiper 기본 opacity 제거 */
}
.main2 .swiper-pagination .swiper-pagination-bullet-active{
  background: #E4BB35;   /* 활성 색 */
}

/*.main2 .main2_slider .main2_slider1 >div:nth-of-type(2){background: url(../images/slider_1.jpg) center / cover no-repeat;}
.main2 .main2_slider .main2_slider2 >div:nth-of-type(2){background: url(../images/slider_2.jpg) center / cover no-repeat;}
.main2 .main2_slider .main2_slider3 >div:nth-of-type(2){background: url(../images/slider_3.jpg) center / cover no-repeat;}*/
.main2 .main2_slider .swiper-slide>div:nth-of-type(1){
    margin: 0 auto;
    margin-top: 120px;
    margin-bottom: 120px;
    width: 1400px;

    /* ✅ 여기부터 추가 (슬라이드마다 높이 동일하게) */
    min-height: 220px;              /* 필요하면 200~260 사이로 숫자만 조절 */
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.main2 .main2_slider .swiper-slide div > p{color: #fff; font-size: 2.5rem; font-weight: 300; letter-spacing: -0.02em;; word-spacing: 0.05rem; line-height: 1.3;}            
.main2 .main2_slider .swiper-slide div > p:nth-of-type(1){font-weight: 700; color: #D4BD9D;}
.main2 .main2_slider .main2_slider2 div > p:nth-of-type(1){color: #D4BD9D;}
.main2 .main2_slider .main2_slider3 div > p:nth-of-type(1){color: #D4BD9D;}
.main2 .main2_slider .swiper-slide div > p:nth-of-type(3){font-size: 1.2rem; font-weight: 300; margin-top: 50px;word-spacing: 0; letter-spacing: -.01rem; color: #fff;}
.prev_next{opacity: 1; width: 100%; position: absolute; top: 50%; z-index: 1;}
.prev_next img{cursor: pointer; position: absolute;}
.prev_next img:nth-child(1){left: 50px;}
.prev_next img:nth-child(2){right: 50px;}

/* 슬라이드 한 장 안에서 "이미지 + 강아지" 묶음 */
.main2 .main2_slider .swiper-slide .slide-visual {
  position: relative;   /* 아이콘의 기준이 되는 상자 */
  width: 100%;
}

/* 기존 이미지 영역 그대로 사용 */
.main2 .main2_slider .swiper-slide .slide-image {
  width: 100%;
  height: 550px;               /* PC 기준 높이 */
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
  transition: 3s;
}

/* 라인 강아지 아이콘 – 항상 이미지 바로 위에 붙기 */
.msg-slide-icon {
  position: absolute;
  right: 10%;
  bottom: 100%;               /* ✅ slide-visual의 윗선에 딱 붙음 */
  transform: translateY(2px);/* 살짝 내려서 이미지랑 겹치게 (값은 취향대로 20~40px 조절) */
  width: 204px;
  height: auto;
  z-index: 5;
  pointer-events: none;
}

.msg-slide-icon img {
  width: 100%;
  height: auto;
  display: block;
}

/* =========================
   THEME VARS
========================= */
:root{
  --c-gold:#E4BB35;
  --c-dark:#171717;
  --c-navy:#091F5B;
  --c-white:#ffffff;
  --c-icon-bg:#EFF2F7;

  --font-title:'Nanum Myeongjo', serif;
  --font-body:'Pretendard', sans-serif;
}

/* 공통 폰트 (원래 common.css는 Noto Serif KR이라 우선 덮어쓰기) */
body{
  font-family: var(--font-body);
}

/* =========================
   MAIN2 (슬라이드 타이포 + 크기)
   - text box: width/margin/min-height 조절 포인트
   - image height 조절 포인트
========================= */

/* 슬라이드 텍스트 박스 폭/여백: 여기만 건드리면 “사진+텍스트 덩어리 크기”가 잡힘 */
.main2 .main2_slider .swiper-slide > div:nth-of-type(1){
  width: min(1400px, 92%);
  margin-top: clamp(3rem, 6vw, 7.5rem);
  margin-bottom: clamp(3rem, 6vw, 7.5rem);
  min-height: clamp(8rem, 12vw, 14rem);
}

/* 슬라이드 타이틀(요청: 나눔명조 bold, 60pt≈5rem, gold) */
.main2 .main2_slider .swiper-slide div > p:nth-of-type(1),
.main2 .main2_slider .swiper-slide div > p:nth-of-type(2){
  font-family: var(--font-title);
  font-weight: 800;
  color: var(--c-gold);
  font-size: clamp(2.4rem, 3.8vw, 4rem);
  letter-spacing: -0.02em;
  line-height: 1.15;
}

/* 슬라이드 설명(요청: Pretendard regular, 35pt≈2.92rem, white) */
.main2 .main2_slider .swiper-slide div > p:nth-of-type(3){
  font-family: var(--font-body);
  font-weight: 400;
  color: var(--c-white);
  font-size: clamp(1.2rem, 1.8vw, 2.0rem);
  margin-top: clamp(1rem, 2vw, 2.5rem);
  letter-spacing: -0.01em;
}

/* 슬라이드 이미지 높이(PC): 여기 숫자만 바꾸면 됨 */
.main2 .main2_slider .swiper-slide .slide-image{
  height: clamp(320px, 32vw, 560px);
}

/* 스크롤파트 이미지 3개 */

/* 섹션 전체 */
.scroll-section{
  background:#000; /* 이미지 로딩 전 fallback */
}

/* 한 장(한 섹션) = 풀 화면 이미지 */
.scroll-item{
  min-height: 100vh;
  position: relative;
  display: flex;
  align-items: center;        /* 세로 가운데 */
  justify-content: center;    /* 가로 가운데 */
  background-size: cover;
  background-position: contain; 
  background-repeat: no-repeat;
  padding: 0;
}

/* 글자 가독성용 어두운 오버레이(필수 추천) */
.scroll-item .overlay{
  position:absolute;
  inset:0;
  background: linear-gradient(
    to bottom,
    rgba(0,0,0,.15),
    rgba(0,0,0,.35),
    rgba(0,0,0,.35)
  );
  z-index: 1;
}

/* 텍스트: 박스 제거하고 그냥 올리기 */
.scroll-item .text-box{
  position: relative;
  z-index: 2;                 /* overlay 위 */
  width: min(1200px, 90%);
  color: #fff;
  text-align: center;         /* 원하면 left로 */
}


/* Fade up (기존 그대로) */
.fade{
  opacity:0;
  transform: translateY(40px);
  transition: opacity .8s ease, transform .8s ease;
}
.fade.show{
  opacity:1;
  transform: translateY(0);
}
.delay-1{ transition-delay:.1s }
.delay-2{ transition-delay:.3s }

/* scatter-reveal은 문장 전체가 올라오는 효과를 끄고(=transform 제거)
   글자 단위(sr-ch) 애니메이션만 보이게 */
.fade.scatter-reveal{
  transform: none !important;
}
.fade.scatter-reveal.show{
  transform: none !important;
}

/* =========================
   MAIN SCROLL TEXT STYLE
   delay-1 / delay-2 전용 타이포
========================= */

/* 제목 : Perfect Premium Life */
.scroll-item .delay-1{
  font-family: "Nanum Myeongjo", serif;
  font-size: 45px;
  font-weight: 400;
  line-height: 1.2;
  color:#FFE180;
}

/* 부제 : 라포르 미아 더 퍼스트 */
.scroll-item .delay-2{
  font-family: "Pretendard", "Pretendard Variable", sans-serif;
  font-size: 20px;
  font-weight: 200;
  line-height: 1.2;
  color: #fff;
  margin-top: 30px;   /* 제목과 간격 */
}

.scatter-reveal .sr-ch {
  display: inline-block;
  opacity: 0;
  transform: translate(var(--sx, 0px), var(--sy, 0px)) rotate(var(--sr, 0deg));
  filter: blur(var(--sb, 10px));
}

.scatter-reveal.play .sr-ch {
  animation: srIn .75s cubic-bezier(.2,.8,.2,1) forwards;
  animation-delay: var(--sd, 0ms);
}

/* 제목(delay-1)은 산발값을 살짝 얌전하게 보이도록 */
.scatter-reveal.is-title .sr-ch{
  filter: blur(var(--sb, 8px));
}

@keyframes srIn {
  to {
    opacity: 1;
    transform: translate(0,0) rotate(0deg);
    filter: blur(0);
  }
}


/* =========================
   PREMIUM 01~05 (Hover Expand)
   배경: #171717 / #091F5B 반복
========================= */
.main-premium-list{
  background: var(--c-dark);
}

.premium-list{
  width: 100%;
}

.premium-item{
  display: flex;
  gap: clamp(1rem, 2vw, 2.2rem);
  padding: clamp(1.6rem, 2.5vw, 2.8rem) clamp(1rem, 2.5vw, 2.4rem);
  cursor: pointer;
}

/* 배경 반복 */
.premium-item:nth-child(odd){ background: var(--c-dark); }
.premium-item:nth-child(even){ background: var(--c-navy); }

/* 왼쪽 PREMIUM + 숫자 */
.premium-left{
  display: flex;
  flex-direction: column;
  min-width: clamp(6.5rem, 10vw, 9rem);
}
.premium-en{
  font-family: var(--font-body);
  font-weight: 400;
  font-size: clamp(1.2rem, 1.6vw, 1.2rem); 
  color: var(--c-gold);
  opacity: .95;
}
.premium-num{
  font-family: var(--font-body);
  font-weight: 400;
  font-size: clamp(2.8rem, 4.5vw, 3.5rem); 
  color: var(--c-gold);
  line-height: 1.0;
}

/* 오른쪽 제목/설명 */
.premium-right{
  flex: 1;
  padding-top: .2rem;
}

.premium-title{
  font-family: var(--font-title);
  font-weight: 700;
  color: var(--c-white);
  font-size: clamp(2.1rem, 3.2vw, 2.9rem); 
  line-height: 1;
  margin: 0;
}

.premium-desc{
  font-family: var(--font-body);
  font-weight: 400;
  color: var(--c-white);
  font-size: clamp(1.4rem, 2.2vw, 1.8rem); /* 35pt≈2.92rem */
  line-height: 1;
  margin-top: clamp(.8rem, 1.2vw, 1.6rem);

  /* 기본: 숨김 */
  max-height: 0;
  opacity: 0;
  overflow: hidden;
  transform: translateY(-6px);
  transition: max-height .35s ease, opacity .25s ease, transform .35s ease;
}

/* hover 시 노출 */
.premium-item:hover .premium-desc{
  max-height: 200px;
  opacity: 1;
  transform: translateY(0);
}

/* 모바일 탭(클릭)으로 열리게 */
.premium-item.is-open .premium-desc{
  max-height: 200px;
  opacity: 1;
  transform: translateY(0);
}

/* =========================
   PREMIUM: 교차색 유지 + 배경만 풀블리드
   (기존 .premium-item odd/even 배경 유지한 채, 그 색을 100vw로 확장)
========================= */

/* 가로 스크롤 방지 */
html, body { overflow-x: hidden; }

/* li 기준 잡기 */
.premium-item{
  position: relative;
  z-index: 0;
}

/* 배경을 화면 끝까지 확장 (색은 li 배경색을 그대로 상속) */
.premium-item::before{
  content:"";
  position:absolute;
  inset: 0;                    /* top/right/bottom/left:0 */
  left: 50%;
  transform: translateX(-50%);
  width: 100vw;                /* ✅ 화면 끝까지 */
  background: inherit;         /* ✅ odd/even 색을 그대로 따라감 */
  z-index: -1;
}

/* PREMIUM 섹션에서만 inner 공통 패딩 제거 */
.main-premium-list > .inner{
  padding-top: 0 !important;
  padding-bottom: 0 !important;
}


/* =========================
   PREMIUM 6 ICONS
   배경 #EFF2F7 / 중앙정렬 / 원형 6개
========================= */
.main-premium-icons{
  background: var(--c-icon-bg);
}

.icons-title{
  text-align: center;
  margin-bottom: clamp(1.2rem, 2vw, 2.2rem);
}

.icons-sub{
  font-family: var(--font-body);
  font-weight: 400;
  color: var(--c-dark);
  font-size: clamp(1.4rem, 2.2vw, 1.8rem); 
  margin: 0 0 .6rem 0;
}

.icons-main{
  font-family: var(--font-title);
  font-weight: 800;
  color: var(--c-navy);
  font-size: clamp(2.4rem, 3.8vw, 3.5rem); 
  margin: 0;
  line-height: 1.15;
}

.icons-grid{
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: clamp(.8rem, 1.8vw, 1.6rem);
  align-items: start;
  margin-top: clamp(1.2rem, 2vw, 2.4rem);
}



.icon-item{
  text-align: center;
  padding: clamp(.8rem, 1.5vw, 1.2rem);
}

.icon-circle{
  width: clamp(56px, 6vw, 84px);
  height: clamp(56px, 6vw, 84px);
  border-radius: 999px;
  margin: 0 auto clamp(.8rem, 1.2vw, 1rem);
  display: grid;
  place-items: center;
  background: #091F5B;
  box-shadow: rgba(0,0,0,0.06) 0 6px 18px;
}

.icon-circle img{
  width: 30%;
  height: auto;
  display: block;
}

.icon-title{
  font-family: var(--font-title);
  font-weight: 800;
  color: var(--c-navy);
  font-size: clamp(1.2rem, 1.8vw, 1.8rem); 
  margin: 0 0 .4rem 0;
}

.icon-desc{
  font-family: var(--font-body);
  font-weight: 400;
  color: var(--c-dark);
  font-size: clamp(1rem, 1.4vw, 1.2rem); 
  line-height: 1.35;
  margin: 0;
}


/* =========================
   MAIN4 (Registration) - Responsive Rebuild
   목표:
   1) 기존 main4 구조(배경 + 박스 + 입력2개 + 우측 버튼 + 하단 동의문구) 유지
   2) 타이틀은 중앙
   3) 작은 글자 Pretendard, 큰 글자 Nanum Myeongjo Bold
   4) 라운드 전부 제거
========================= */

/* 섹션(배경은 기존 이미지 유지: main4_bg.jpg) */
#main4.main4_regist{
  width: 100%;
  min-width: 0 !important;     /* 기존 min-width:1300 무력화 */
  height: auto !important;     /* 기존 height:800 무력화 */
  padding: clamp(60px, 6vw, 90px) 0;
  background: url(/images/register_bg.png) no-repeat center/cover;
  overflow: hidden;
  position: relative;
}

/* 내부 컨테이너(기존 1200폭 느낌) */
#main4.main4_regist > form{
  width: min(1200px, calc(100% - 40px));
  margin: 0 auto;
}

/* 폼 박스 */
#main4.main4_regist .regist{
  position: relative;
  left: auto !important;
  top: auto !important;
  opacity: 1 !important;

  width: 100%;
  padding: clamp(26px, 3vw, 44px);

  /* 라운드 제거 */
  border-radius: 0 !important;
}

/* 타이틀: 가운데 정렬 */
#main4.main4_regist .regist .tx{
  position: relative !important;
  top: auto !important;
  left: auto !important;
  width: 100% !important;
  text-align: center !important;
  margin-bottom: clamp(18px, 2.2vw, 30px);
  letter-spacing: 0;
}

/* 작은 글자: Pretendard Regular */
#main4.main4_regist .regist .tx h4{
  font-family: var(--font-body);
  font-weight: 400;
  font-size: clamp(16px, 1.3vw, 20px);
  text-transform: uppercase;
  margin: 0 0 8px 0;
  color: #FFE180;
  opacity: .85;
}

/* 큰 글자: Nanum Myeongjo Bold */
#main4.main4_regist .regist .tx p{
  font-family: var(--font-title);
  font-weight: 500;
  font-size: clamp(26px, 2.8vw, 37px);
  margin: 0;
  color: #fff;
}

/* ===== 입력 2개 + 우측 버튼 “기존 구조”를 반응형 그리드로 재현 =====
   기존: 라벨(150) / 입력(410) / 버튼(150x140) 느낌 :contentReference[oaicite:3]{index=3}
*/
#main4.main4_regist .reg-fields{
  display: grid;
  grid-template-columns: 150px 1fr 150px; /* 라벨 / 입력 / 버튼 */
  column-gap: 20px;
  row-gap: 12px;
  align-items: center;
  position: relative;
}

/* dl을 “라벨+입력” 2열로 깔끔히 */
#main4.main4_regist .reg-fields dl{
  display: contents; /* dt/dd를 그리드 셀로 사용 */
  margin: 0;
}

/* 라벨 */
#main4.main4_regist .reg-fields dt{
  text-align: right;
  margin: 0;
}
#main4.main4_regist .reg-fields dt span{
  font-family: var(--font-body);
  font-weight: 400;

  font-size: 15px;
  letter-spacing: 0.1em;
  color: rgba(255,255,255,0.7);

  position: relative;
  display: inline-block;
}

/* 기존 * 표시 유지(구조만 동일하게) */
#main4.main4_regist .reg-fields dt span:before{
  content: "•";
  color: #E4BB35;
  display: inline-block;
  margin-right: 6px;
}

/* 입력 */
#main4.main4_regist .reg-fields dd{
  margin: 0;
}
#main4.main4_regist .reg-fields input[type="text"],
#main4.main4_regist .reg-fields input[type="tel"]{
  width: 100%;
  height: 62px;              /* ✔ 기존 유지 */
  padding: 0 18px;           /* ✔ 살짝 여유 */
  box-sizing: border-box;

  background: rgba(255,255,255,0.98);
  border: 1px solid rgba(0,0,0,0.18);
  border-radius: 8px;        /* ❗ 0 제거 → 카드화 핵심 */
  box-shadow: 0 10px 22px rgba(0,0,0,0.10);

  font-family: var(--font-body);
  font-weight: 400;
  font-size: 18px;
  color: #000;

  transition: box-shadow .25s ease, transform .25s ease, border-color .25s ease;
}
#main4.main4_regist .reg-fields input:focus{
  outline: none;
  border-color: rgba(201,188,169,0.8); /* 브랜드 골드 */
  box-shadow: 0 16px 32px rgba(0,0,0,0.16);
}


#main4.main4_regist .reg-fields input[type="text"],
#main4.main4_regist .reg-fields input[type="tel"]{
  box-shadow:
    0 6px 18px rgba(0,0,0,0.10),
    0 1px 0 rgba(255,255,255,0.35) inset; /* 윗면 하이라이트 */
}
#main4.main4_regist .reg-fields input:focus{
  box-shadow:
    0 10px 26px rgba(0,0,0,0.14),
    0 1px 0 rgba(255,255,255,0.45) inset;
}

/* 우측 버튼: 세로로 큰 버튼(고급스러운 카드 톤) */
#main4.main4_regist .bt-regist{
  grid-column: 3;
  grid-row: 1 / span 2;                 /* 두 줄(이름/연락처)을 세로로 덮음 */
  width: 150px;
  height: 100%;
  min-height: calc(62px * 2 + 12px);    /* 입력2개 + gap */
  text-decoration: none;

  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;

  /* ✅ 고급감 포인트 */
  background: linear-gradient(135deg, #091F5B 0%, #0E2A7A 100%);
  border: 1px solid rgba(255,255,255,0.12);
  border-radius: 8px;                  /* ✅ 라운드 적용 */
  box-shadow: 0 18px 34px rgba(9,31,91,0.35);
  position: relative;
  overflow: hidden;

  transition: transform .25s ease, box-shadow .25s ease, filter .25s ease;
}

/* ✅ 버튼 윗면 하이라이트(은은하게) */
#main4.main4_regist .bt-regist::before{
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(
    to bottom,
    rgba(255,255,255,0.18),
    rgba(255,255,255,0.00) 55%
  );
  pointer-events: none;
  opacity: 0.9;
}

/* ✅ 호버(PC) */
@media (hover:hover){
  #main4.main4_regist .bt-regist:hover{
    transform: translateY(-2px);
    box-shadow: 0 26px 52px rgba(9,31,91,0.45);
    filter: brightness(1.02);
  }
}

/* ✅ 클릭/탭(활성) */
#main4.main4_regist .bt-regist:active{
  transform: translateY(0px);
  box-shadow: 0 14px 30px rgba(9,31,91,0.35);
}

/* ✅ 텍스트 */
#main4.main4_regist .bt-regist span{
  position: relative;  /* ::before 위로 나오게 */
  z-index: 1;

  font-family: var(--font-body);
  font-weight: 500;    /* 400보다 살짝 단단하게 */
  font-size: 18px;     /* 20 → 18 추천(고급스럽게 덜 과함) */
  line-height: 1.25;
  letter-spacing: 0.02em;
  color: #fff;
}

/* 동의/안내: 폼 아래 자연스럽게 */
#main4.main4_regist .agree-box{
  margin-top: 18px;
  padding-top: 16px;
}

/* 동의줄: Pretendard */
#main4.main4_regist .agree-line{
  margin: 0 0 10px 0;
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 18px;  /* 기존 동의 문구 크기 유지 :contentReference[oaicite:6]{index=6} */
  color: #fff;
  line-height: 1.4;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
}

/* 체크박스는 기본형 사용(구조 안정) */
#main4.main4_regist .agree-line input[type="checkbox"]{
  width: 16px;
  height: 16px;
  display: inline-block !important;
}

#main4.main4_regist .agree-line .privacy{
  color: #fff;
  text-decoration: none;
  border-bottom: 1px solid rgba(0,0,0,0.35);
  padding-bottom: 2px;
}

/* 안내 문구 */
#main4.main4_regist .agree-box ul{
  margin: 0;
  padding-left: 16px;
}
#main4.main4_regist .agree-box ul li{
  font-family: var(--font-body);
  font-weight: 400;
  font-size: 12px; /* 기존 유지 :contentReference[oaicite:7]{index=7} */
  color: #fff;
  opacity: .7;
  letter-spacing: -0.02em;
  line-height: 1.55;
}

/* =========================
   MAIN4 - 개인정보 동의 라인
========================= */

#main4 .agree-box{
  margin-top: 28px;
}

/* 체크라인 전체 */
#main4 .agree-line{
  display: flex;
  align-items: center;
  gap: 10px;
  cursor: pointer;
}

/* 기존 체크박스 숨김 */
#main4 .agree-line input{
  position: absolute;
  opacity: 0;
}

/* 커스텀 체크박스 */
#main4 .agree-line .chk{
  width: 18px;
  height: 18px;
  border: 1px solid #fff;
  position: relative;
  flex-shrink: 0;
}

/* 체크 표시 */
#main4 .agree-line input:checked + .chk::after{
  content: "";
  position: absolute;
  left: 4px;
  top: 1px;
  width: 6px;
  height: 10px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: rotate(45deg);
}

/* 동의 문구(“~에 동의합니다.”) 글자 키우기 */
#main4 .agree-text{
  font-size: 18px;   /* 원하는 만큼 키우기 */
  color:#fff;
}

/* '개인정보 취급방침' 밑줄을 흰색으로 */
#main4 .agree-text a.privacy{
  color:#fff !important;
  text-decoration: underline !important;
  text-decoration-color:#fff !important;  /* ✅ 밑줄 흰색 */
  text-underline-offset: 3px;
  text-decoration-thickness: 1px;
  border-bottom: 0 !important; /* 기존 border-bottom 방식 있으면 제거 */
}

/* 오버레이 배경 */
.pu_bg{
  display:none;
  position: fixed;
  left:0; top:0; right:0; bottom:0;
  background: rgba(0,0,0,.65);
  z-index: 9998;
}

/* 팝업 */
.pop-privacy{
  display:none;
  position: fixed;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  width: min(900px, calc(100% - 40px));
  max-height: min(80vh, 720px);
  background: #fff;
  z-index: 9999;
  border-radius: 0; /* 라운드 제거 */
  overflow: hidden;
}

/* 내부 스크롤 영역 */
.pop-privacy .pu_txt_area{
  padding: 30px;
  overflow: auto;
  max-height: calc(80vh - 60px);
}

/* 닫기 버튼 */
.pop-privacy .bt_close{
  position:absolute;
  right: 16px;
  top: 14px;
  color:#000;
  text-decoration:none;
  font-size: 18px;
}

/* 개인정보 취급방침 팝업 우선순위 정리 */
.pu_bg{
  z-index: 9998;
}

.pop-privacy{
  z-index: 9999;
}

.pop-privacy .bt_close{
  position: absolute;
  right: 16px;
  top: 16px;
  z-index: 10000;   /* ✅ 제일 위로 */
  cursor: pointer;
}

/* ===== 이용약관(개인정보 이용약관) 페이지 스타일 ===== */
.tbox{
  width: min(980px, calc(100% - 80px));
  margin: 0 auto;
  padding: 80px 0 90px;
  box-sizing: border-box;
  color: #111;
}

/* 제목 위 작은 브랜드 */
.term-brand{
  margin: 0 0 14px;
  text-align: center;
  font-size: 13px;
  letter-spacing: .18em;
  opacity: .55;
  text-transform: uppercase;
}

/* 메인 제목 */
.tbox h1{
  margin: 0 0 22px;
  text-align: center;
  font-size: 44px;
  line-height: 1.1;
  font-weight: 800;
}

/* 서문 */
.tbox > p{
  margin: 0 0 26px;
  font-size: 14px;
  line-height: 1.8;
}

/* 섹션 제목(dt) */
.tbox dl dt{
  margin: 26px 0 10px;
  font-size: 20px;
  font-weight: 800;
  color: #091F5B; /* 캡처처럼 포인트 톤(원하면 수정) */
}

/* 내용(dd) */
.tbox dl dd{
  margin: 0;
  font-size: 14px;
  line-height: 1.9;
}

/* dd 안 p (예: [정보관리 책임자]) */
.tbox dl dd p{
  margin: 10px 0 10px;
  font-weight: 700;
}

/* 목록 */
.tbox dl dd ul{
  margin: 10px 0 0;
  padding-left: 18px;
}
.tbox dl dd ul li{
  margin: 6px 0;
}

/* pt10/pb10 클래스가 기존에 쓰이고 있으니 안전하게 유지 */
.pt10{ padding-top: 10px; }
.pb10{ padding-bottom: 10px; }

/* 이용약관 닫기 버튼 크게 */
.pop-privacy .bt_close{
  font-size: 28px;        /* ← X 크기 (24~32 추천) */
  font-weight: 400;
  width: 44px;            /* ← 클릭 영역 */
  height: 44px;
  line-height: 44px;
  text-align: center;
  cursor: pointer;
}

/* ================================
   Floating Register Button
================================ */

.floating-register {
  position: fixed;
  right: 40px;
  top: 50%;
  transform: translateY(-50%);
  width: 150px;
  height: 150px;
  z-index: 9999;
  text-decoration: none;
}

/* 회전 텍스트 */
.floating-register .rotate-text {
  position: absolute;
  inset: 0;
  border-radius: 50%;
  font-size: 14px;
  letter-spacing: 2px;
  color: #ffffff;
  animation: spin 6s linear infinite;
}

/* 중앙 원 */
.floating-register .center-btn {
  position: absolute;
  inset: 18px;
  border-radius: 50%;
  background: radial-gradient(circle, #0b2a66 0%, #071b3f 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  color: #fff;
  text-align: center;
}

/* 아이콘 */
.center-btn .icon {
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 6px;
}

.center-btn .icon img {
  width: 22px;
  height: auto;
  display: block;
}

/* 텍스트 */
.center-btn .text {
  font-size: 14px;
  line-height: 1.2;
  font-weight: 500;
}

/* 회전 애니메이션 */
@keyframes spin {
  from { transform: rotate(0deg); }
  to   { transform: rotate(360deg); }
}

/* 회전 텍스트 컨테이너 고정 */
.floating-register .rotate-text{
  position: absolute;
  inset: 0;
  pointer-events: none;
  transform: translateZ(0); /* 렌더링 흔들림 방지 */
}

/* 회전 글자 공통 스타일 고정(겹침/뭉침 방지) */
.floating-register .rotate-text span{
  font-size: 11px;     /* 너무 크면 겹침 증가 */
  line-height: 1;
  letter-spacing: 0.12em;
  white-space: pre;
  -webkit-font-smoothing: antialiased;
  transform-style: preserve-3d;
}
