/* /var/www/html/assets/css/style.css */

/* ✅ FONT (Pretendard) */
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/pretendardvariable.css");

:root{
  --font-main: "Pretendard Variable", Pretendard, -apple-system, BlinkMacSystemFont,
    "Segoe UI", Roboto, "Noto Sans KR", "Apple SD Gothic Neo", "Malgun Gothic", Arial, sans-serif;
}

/* ===== Base ===== */
* { box-sizing: border-box; }
html, body { margin: 0; padding: 0; }
body{
  font-family: var(--font-main);
  background: #fff;
  color: #111;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
button, input, textarea, select{ font-family: var(--font-main); }

.count-num,
.blink-phone,
.footer__call,
.topbar__callText{
  font-variant-numeric: tabular-nums;
  font-feature-settings: "tnum";
}

a { color: inherit; text-decoration: none; }
img { width: 100%; height: auto; display: block; }

/* ===== Topbar ===== */
.topbar{
  position: fixed;
  top: 0; left: 0; right: 0;
  z-index: 90;
  background: transparent;
  transition: background 180ms ease, box-shadow 180ms ease, backdrop-filter 180ms ease;
}
.topbar.is-scrolled{
  background: rgba(255,255,255,0.82);
  box-shadow: 0 14px 40px rgba(0,0,0,0.10);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  border-bottom: 1px solid rgba(0,0,0,0.06);
}

/* ✅✅✅ 여기부터 핵심 수정 */
.topbar__inner{
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 28px 90px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: nowrap;
}

.topbar__left{
  display:flex;
  align-items:center;
  gap:14px;
  min-width:0;
  flex: 1 1 auto;
}

.topbar__logo{ width:350px; height:auto; object-fit:contain; }
.topbar__site{ display:grid; gap:2px; min-width:0; }

/* ✅ 현장명 */
.topbar__siteSub{
  font-size: 24px;
  font-weight: 1000;
  color:#fff;
  letter-spacing: -0.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 55vw;
  text-shadow: 0 10px 26px rgba(0,0,0,0.45);
}

.topbar__call{
  display:inline-flex;
  align-items:center;
  gap:10px;
  padding:0;
  background:transparent;
  border:0;

  color:#111;

  margin-left: auto;
  white-space: nowrap;
  flex: 0 0 auto;

  text-shadow: 0 10px 26px rgba(0,0,0,0.45);
}
/* ✅✅✅ 핵심 수정 끝 */

/* ✅ 아이콘/번호 (여기 매우 중요: img는 font-size 안 먹어서 width/height로 고정) */
.topbar__callIcon{
  width: 34px;
  height: 34px;
  object-fit: contain;
  flex: 0 0 auto;
}
.topbar__callText{ font-weight:1000; font-size:34px; letter-spacing:-0.02em; }

/* =========================================================
   ✅ 상단 전화번호 1초마다 색 변경 (검정 ↔ 네이비)
========================================================= */
@keyframes phoneBlink{
  0%,49% { color:#111; }
  50%,100% { color:#091f5b; }
}
.topbar__callText{
  animation: phoneBlink 1s infinite steps(1,end);
}

@keyframes blinkPhone{
  0%,49% { filter:none; transform: translateY(0); opacity:1; }
  50%,100% { filter: drop-shadow(0 0 10px rgba(255,0,0,0.35)); transform: translateY(-0.5px); opacity:0.85; }
}
.blink-phone{ display:inline-block; animation: blinkPhone 0.9s infinite ease-in-out; }

/* ===== Hero ===== */
.hero{
  position: relative;
  width: 100%;
  min-height: 100vh;
  height: 100dvh;
  overflow: hidden;
}
.hero__bg{
  position:absolute;
  inset:0;
  background: url("../images/hero.png") center/cover no-repeat;
  transform: scale(1.10);
  animation: heroZoomOut 8.5s ease-out infinite alternate;
  will-change: transform;
}
.hero::before{
  content:"";
  position:absolute;
  left:0; right:0; top:0;
  height: 180px;
  background: linear-gradient(to bottom, rgba(0,0,0,0.45), rgba(0,0,0,0));
  z-index:1;
  pointer-events:none;
}
@keyframes heroZoomOut { from{transform:scale(1.10);} to{transform:scale(1.00);} }
.hero__titleWrap{
  position:absolute;
  left:0; right:0;
  top:40%;
  transform: translateY(-50%);
  display:flex;
  justify-content:center;
  padding:0 16px;
  pointer-events:none;
  z-index:2;
}
.hero__titleImg{
  width: min(700px, 92vw);
  height:auto;
  filter: drop-shadow(0 8px 18px rgba(0,0,0,0.35));
}
.hero__scroll{
  position:absolute;
  left:50%;
  bottom:18px;
  transform: translateX(-50%);
  width:40px; height:40px;
  border-radius:999px;
  background: rgba(255,255,255,0.85);
  display:grid;
  place-items:center;
  color:#123b63;
  font-weight:900;
  border:1px solid rgba(0,0,0,0.08);
  z-index:2;
}

/* ===== Stack ===== */
.stack{ width:100%; }

/* ✅ 스크롤 등장 모션 기본값 */
.section-img{
  width:100%;
  height:auto;
  display:block;
  margin: 0 0 18px;
  opacity: 0;
  transform: translateY(18px);
  transition: opacity 520ms ease, transform 520ms ease;
  will-change: opacity, transform;
}
.section-img.is-inview{
  opacity: 1;
  transform: translateY(0);
}

#section01{ scroll-margin-top: 120px; }
@media (min-width: 901px){
  .section-img{
    width: min(1100px, 92vw);
    margin: 0 auto 18px;
    border-radius: 18px;
  }
}

/* ===== Inline Reservation ===== */
.inline-resv{
  background:#fff;
  padding: 26px 0 28px;
  border-top: 1px solid rgba(0,0,0,0.06);
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.inline-resv--first{ padding-top: 34px; }
.inline-resv__inner{
  max-width: 980px;
  margin: 0 auto;
  padding: 0 16px;
}
.inline-resv__title{
  margin: 0 0 14px;
  text-align:center;
  font-size: 30px;
  font-weight: 1000;
  color:#123b63;
  letter-spacing: -0.02em;
}

/* ===== Form ===== */
.form{ display:grid; gap:10px; }
.input, .textarea{
  width:100%;
  padding: 12px 12px;
  border: 1px solid #ddd;
  border-radius: 12px;
  font-size: 14px;
  outline:none;
}
.textarea{ min-height: 92px; resize: vertical; }
.grid2{ display:grid; grid-template-columns: 1fr 1fr; gap:10px; }
@media (max-width: 720px){ .grid2{ grid-template-columns: 1fr; } }

.checkbox-row{
  display:flex;
  gap:8px;
  align-items:center;
  font-size:13px;
  color:#333;
}
.agree-row{
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap:10px;
}
.linklike{
  border:0;
  background:transparent;
  color:#111;
  font-size:13px;
  font-weight:800;
  cursor:pointer;
  padding: 6px 8px;
  border-radius: 8px;
}
.linklike:hover{ background: rgba(0,0,0,0.05); }

.submit-btn{
  margin-top: 6px;
  height: 56px;
  border:0;
  border-radius: 999px;
  background:#123b63;
  color:#fff;
  font-size:16px;
  font-weight:1000;
  cursor:pointer;
}

/* ===== (추가) Media Section (Video) ===== */
.media-section{
  background:#fff;
  padding: 46px 0 54px;
  border-top: 1px solid rgba(0,0,0,0.06);
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.media-section__inner{
  max-width: 980px;
  margin: 0 auto;
  padding: 0 16px;
  text-align:center;
}
.media-section__title{
  margin:0 0 10px;
  font-size:28px;
  font-weight:1000;
  color:#123b63;
  letter-spacing: -0.02em;
}
.media-section__desc{
  margin:0 0 20px;
  font-size:14px;
  color:#666;
}
.media-video{
  width:100%;
  border-radius: 18px;
  overflow:hidden;
  box-shadow: 0 18px 55px rgba(0,0,0,0.16);
  background:#000;
}
.media-video video{
  width:100%;
  height:auto;
  display:block;
  background:#000;
}
.media-section__note{
  margin: 10px 0 0;
  font-size:12px;
  color:#888;
}

/* ===== PC right rail ===== */
.pc-rail{ display:block; }
.float-rail{
  position: fixed;
  right: 18px;
  top: 50%;
  transform: translateY(-50%);
  z-index:55;
  display:flex;
  flex-direction: column;
  gap:10px;
}
.float-btn{
  width: 70px;
  height: 70px;
  border-radius: 20px;
  display:grid;
  place-items:center;
  background:#123b63;
  color:#fff;
  font-size:13px;
  font-weight:900;
  border:0;
  cursor:pointer;
  box-shadow: 0 14px 40px rgba(0,0,0,0.18);
}

/* ===== Count balloon ===== */
.count-balloon{
  position: fixed;
  right: 105px;
  top: calc(50% - 120px);
  z-index:56;
  background:#fff;
  border-radius: 16px;
  padding: 14px 14px 14px 16px;
  box-shadow: 0 18px 60px rgba(0,0,0,0.18);
  display:flex;
  align-items:center;
  gap:10px;
  max-width: min(420px, calc(100vw - 150px));
}
.count-balloon.is-hidden{ display:none; }
.count-balloon__text{ font-size:14px; font-weight:800; color:#111; line-height:1.3; }
.count-num{ font-weight:1000; animation: blinkCount 0.8s infinite ease-in-out; }
@keyframes blinkCount{
  0%,49% { color:#ff0000; filter: drop-shadow(0 0 10px rgba(255,0,0,0.35)); }
  50%,100% { color:#111; filter:none; }
}
.count-balloon__close{
  width:30px; height:30px;
  border-radius:999px;
  border:0;
  background:#f1f1f1;
  cursor:pointer;
  font-size:16px;
  font-weight:900;
  display:grid;
  place-items:center;
}
.count-balloon__tail{
  position:absolute;
  right:-10px;
  top:22px;
  width:18px; height:18px;
  background:#fff;
  transform: rotate(45deg);
  box-shadow: 10px -10px 30px rgba(0,0,0,0.06);
}

/* ===== Mobile bottom bar ===== */
.m-bottombar{
  display:none;
  position: fixed;
  left:0; right:0; bottom:0;
  z-index:70;
  height:72px;
  background:#0b0f0e;
  border-top: 1px solid rgba(255,255,255,0.12);
}
.m-btn{
  width:33.33%;
  border:0;
  background:transparent;
  color:#fff;
  font-weight:900;
  font-size:13px;
  display:grid;
  place-items:center;
  gap:0px;
  cursor:pointer;
}
.m-btn--green{ background:#091f5b; }
.m-btn--dark{ background:#000000; }
.m-ico{ width:20px!important; height:20px!important; object-fit:contain; display:inline-block; }

.count-balloon--mobile{
  position:absolute;
  right:12px;
  bottom:86px;
  top:auto;
  max-width: min(420px, calc(100vw - 24px));
}
.count-balloon--mobile .count-balloon__tail{
  right:26px;
  top:auto;
  bottom:-8px;
  transform: rotate(45deg);
}

@media (max-width: 900px){
  .pc-rail{ display:none; }
  .m-bottombar{ display:flex; }
  body{ padding-bottom: 72px; }
  #section01{ scroll-margin-top: 98px; }

  .topbar__inner{ padding: 18px 14px 10px; }
  .topbar__logo{ width: 160px; }

  .topbar__siteSub{ font-size: 16px; max-width: 52vw; }

  /* 모바일 상단 전화 영역 */
  .topbar__callIcon{ width: 22px; height: 22px; }
  .topbar__callText{ font-size: 25px; }

  .hero::before{ height: 140px; }

  .media-section__title{ font-size:22px; }
}

/* 초소형 기기 안전망 */
@media (max-width: 420px){
  .topbar__inner{ padding: 14px 12px 8px; }
  .topbar__logo{ width: 140px; }
  .topbar__callText{ font-size: 22px; }
}

/* ===== Overlay + Modal ===== */
.overlay{
  position: fixed;
  inset:0;
  background: rgba(0,0,0,0.55);
  z-index:100;
  display:none;
}
.overlay.is-open{ display:block; }

.modal{
  position: fixed;
  right:24px;
  top:50%;
  transform: translateY(-50%);
  width: min(420px, calc(100vw - 48px));
  background:#fff;
  border-radius: 18px;
  z-index:110;
  display:none;
  box-shadow: 0 30px 80px rgba(0,0,0,0.35);
  overflow:hidden;
}
.modal.is-open{ display:block; }

.modal__head{
  padding: 18px 18px 12px;
  display:flex;
  align-items:center;
  justify-content: space-between;
  gap:10px;
}
.modal__title{
  margin:0;
  font-size:22px;
  font-weight:1000;
  color:#123b63;
}
.modal__close{
  width:34px; height:34px;
  border-radius: 10px;
  border:0;
  background:#f1f1f1;
  cursor:pointer;
  font-size:18px;
  font-weight:1000;
}
.modal__body{ padding: 0 18px 18px; }

.modal--privacy{ width: min(520px, calc(100vw - 48px)); }
.privacy-box{
  border: 1px solid #e7e7e7;
  background:#fafafa;
  border-radius: 14px;
  padding: 14px;
}
.privacy-p{
  margin: 0 0 10px;
  font-size:13px;
  line-height:1.6;
  color:#222;
}
.privacy-p:last-child{ margin-bottom: 0; }
@media (max-width: 720px){ .modal{ right: 12px; } }

/* ===== Footer ===== */
.footer{
  background:#f2f2f2;          /* 밝은 회색 배경 */
  color:#1f2f40;               /* 기본 글자 네이비 */
  padding: 140px 16px 130px;   /* PC용 넓은 여백 */
}
.footer__inner{
  max-width: 980px;
  margin: 0 auto;
  display:grid;
  justify-items:center;
  text-align:center;
  gap:24px;
}
.footer__logo{
  width: 420px;
  height:auto;
  object-fit: contain;
  filter: drop-shadow(0 10px 24px rgba(0,0,0,0.25));
}
.footer__meta{
  display:grid;
  gap:6px;
  font-size:22px;
  opacity:0.95;
  line-height:1.7;
}
.footer__row{
  display:flex;
  gap:10px;
  justify-content:center;
  flex-wrap:wrap;
}
.footer__row .k{ font-weight:900; }
.footer__row .v{ opacity:0.95; }
.footer__callTitle{
  margin-top: 8px;
  margin-bottom: 4px;
  font-weight:500;
  font-size:40px;
  color:#1a2d3f;
  opacity:0.95;
}
.footer__call{
  margin-top:0;
  font-size:54px;
  font-weight:1000;
  letter-spacing: -0.02em;
  color:#0f2b45;
}

/* ✅✅✅ 모바일에서 푸터 안 깨지게 “자동 축소” (가장 중요) */
@media (max-width: 900px){
  .footer{
    padding: 64px 16px 88px;      /* 모바일: 여백 줄이기 */
  }
  .footer__inner{
    gap: 16px;
  }
  .footer__logo{
    width: min(260px, 78vw);      /* 420px 고정 방지 */
    filter: none;
  }
  .footer__meta{
    font-size: 14px;              /* 22px → 14px */
    line-height: 1.65;
    gap: 8px;
  }
  .footer__row{
    gap: 6px;
  }
  .footer__callTitle{
    font-size: 22px;              /* 40px → 22px */
    margin-top: 6px;
    margin-bottom: 2px;
  }
  .footer__call{
    font-size: 34px;              /* 54px → 34px */
  }
}
@media (max-width: 420px){
  .footer__meta{ font-size: 13px; }
  .footer__call{ font-size: 30px; }
}

/* =========================
   스샷형 방문예약 폼
========================= */
.mh-resv{
  background:#efefef;
  padding: 28px 0 34px;
  border-top: 1px solid rgba(0,0,0,0.06);
  border-bottom: 1px solid rgba(0,0,0,0.06);
}
.mh-resv__inner{
  max-width: 980px;
  margin: 0 auto;
  padding: 0 16px;
}
.mh-resv__title{
  margin:0;
  text-align:center;
  font-size:34px;
  font-weight:1000;
  letter-spacing: -0.04em;
  color:#111;
}
.mh-resv__sub{
  margin: 10px 0 18px;
  text-align:center;
  font-size:14px;
  color:#666;
}
.mh-info{
  margin: 0 auto 18px;
  border: 1px solid rgba(0,0,0,0.08);
  background:#fff;
}
.mh-info__row{
  display:grid;
  grid-template-columns: 180px 1fr;
  border-top: 1px solid rgba(0,0,0,0.08);
}
.mh-info__row:first-child{ border-top:none; }
.mh-info__label{
  background:#123b63;
  color:#fff;
  font-weight:1000;
  display:flex;
  align-items:center;
  justify-content:center;
  padding: 18px 10px;
}
.mh-info__value{
  background:#f7f7f7;
  padding: 14px 18px;
}
.mh-info__main{ font-weight:1000; color:#111; margin-bottom: 6px; }
.mh-info__note{ font-size:12px; color:#444; }
.mh-bullets{
  margin:0;
  padding-left: 18px;
  color:#222;
  font-size:13px;
  line-height:1.55;
}

.mh-form{ margin: 0 auto; }
.mh-step{
  margin: 14px 0 10px;
  background:#123b63;
  color:#fff;
  font-weight:1000;
  text-align:center;
  padding: 12px 14px;
  font-size:13px;
  letter-spacing: -0.02em;
}
.mh-fields{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap:12px;
  background:#f7f7f7;
  border: 1px solid rgba(0,0,0,0.08);
  padding: 14px;
}
.mh-input{
  width:100%;
  height:46px;
  border: 1px solid rgba(0,0,0,0.12);
  background:#fff;
  padding: 0 12px;
  font-size:14px;
  border-radius: 12px;
  outline:none;
}
.mh-grid{
  display:grid;
  grid-template-columns: 1.1fr 0.9fr;
  gap:14px;
  background:#f7f7f7;
  border: 1px solid rgba(0,0,0,0.08);
  padding: 14px;
}
.mh-cal{
  background:#fff;
  border: 1px solid rgba(0,0,0,0.10);
}
.mh-cal__head{
  display:grid;
  grid-template-columns: 46px 1fr 46px;
  align-items:center;
  border-bottom: 1px solid rgba(0,0,0,0.10);
}
.mh-cal__nav{
  height:44px;
  border:0;
  background:transparent;
  font-size:18px;
  cursor:pointer;
}
.mh-cal__month{
  text-align:center;
  font-weight:1000;
  padding: 10px 0;
}
.mh-cal__wrap{ padding: 10px; }
.mh-cal__dow{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  font-weight:900;
  color:#333;
  text-align:center;
  font-size:12px;
  margin-bottom: 6px;
}
.mh-cal__days{
  display:grid;
  grid-template-columns: repeat(7, 1fr);
  border: 1px solid rgba(0,0,0,0.10);
  min-height: 252px;
}
.mh-day{
  height:42px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-right: 1px solid rgba(0,0,0,0.10);
  border-bottom: 1px solid rgba(0,0,0,0.10);
  font-size:13px;
  cursor:pointer;
  user-select:none;
  background:#fff;
}
.mh-day:nth-child(7n){ border-right:none; }
.mh-day.is-empty{ background:#fafafa; cursor: default; }
.mh-day.is-disabled{ color:#bbb; background:#f5f5f5; cursor:not-allowed; }
.mh-day.is-selected{ background:#7b1e2b; color:#fff; font-weight:1000; }

.mh-time{
  background:#fff;
  border: 1px solid rgba(0,0,0,0.10);
  padding: 12px;
}
.mh-time__title{ font-weight:1000; margin: 4px 0 10px; }
.mh-time__grid{
  display:grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px 12px;
}
.mh-radio{
  display:flex;
  align-items:center;
  gap:8px;
  font-size:13px;
  cursor:pointer;
  user-select:none;
}
.mh-submit{
  width:220px;
  height:54px;
  margin: 18px auto 0;
  display:block;
  border:0;
  background:#123b63;
  color:#fff;
  font-weight:1000;
  font-size:16px;
  cursor:pointer;
  border-radius: 999px;
}

@media (max-width: 900px){
  .mh-resv__title{ font-size: 28px; }
  .mh-info__row{ grid-template-columns: 1fr; }
  .mh-info__label{ justify-content:flex-start; padding: 14px 16px; }
  .mh-info__value{ padding: 12px 16px; }
  .mh-fields{ grid-template-columns: 1fr; }
  .mh-grid{ grid-template-columns: 1fr; }
  .mh-time__grid{ grid-template-columns: repeat(2, 1fr); }
}

/* ===== 모바일에서 현장명 숨김 ===== */
@media (max-width: 900px){
  .topbar__site{ display:none; }
}

/* =========================================================
   ✅ (완성) Unit Slider - 버튼 안 사라지게 최종 고정
========================================================= */
.unit-slider{
  background:#f4f7fb;
  padding: 48px 0 58px;
  border-top: 1px solid rgba(0,0,0,0.06);
}
.unit-slider__inner{
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 16px;
  text-align:center;
}
.unit-slider__title{
  margin:0 0 10px;
  font-size:28px;
  font-weight:1000;
  color:#123b63;
  letter-spacing:-0.02em;
}
.unit-slider__desc{
  margin:0 0 18px;
  font-size:14px;
  color:#666;
}

.unit-slider__shell{
  position: relative;
  max-width: 1100px;
  margin: 0 auto;
  overflow: visible;
  padding: 0 64px;
}

.unit-slider__wrap{
  overflow-x: auto;
  overflow-y: hidden;
  white-space: nowrap;
  scroll-snap-type: x mandatory;
  -webkit-overflow-scrolling: touch;
  scroll-behavior: smooth;
  padding: 10px 6px 14px;
  border-radius: 18px;
  position: relative;
  z-index: 1;
}
.unit-slider__wrap::-webkit-scrollbar{ display:none; }

.unit-slider__track{
  display:flex;
  gap:16px;
  align-items:stretch;
  padding: 2px;
  width: max-content;
}
.unit-slider__track img{
  flex: 0 0 85%;
  max-width: 85%;
  scroll-snap-align: center;
  border-radius: 18px;
  box-shadow: 0 16px 45px rgba(0,0,0,0.18);
  background:#fff;
  object-fit: contain;
  max-height: 52vh;
}

.unit-nav{
  position:absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 54px;
  height: 54px;
  border-radius: 999px;
  border: 1px solid rgba(0,0,0,0.10);
  background: rgba(255,255,255,0.95);
  box-shadow: 0 14px 40px rgba(0,0,0,0.22);
  cursor:pointer;

  font-size: 34px;
  font-weight: 900;
  line-height: 1;

  display:grid;
  place-items:center;

  z-index: 9999;
  user-select:none;
  -webkit-tap-highlight-color: transparent;
}

.unit-nav--prev{ left: 14px; }
.unit-nav--next{ right: 14px; }

.unit-nav.is-disabled{
  opacity: 0.35;
  pointer-events: none;
  filter: grayscale(1);
}

@media (max-width: 900px){
  .unit-slider__title{ font-size:22px; }

  .unit-slider__shell{
    padding: 0 52px;
  }
  .unit-nav{
    width: 46px;
    height: 46px;
    font-size: 30px;
  }
  .unit-nav--prev{ left: 10px; }
  .unit-nav--next{ right: 10px; }

  .unit-slider__wrap{ padding: 10px 0 14px; }

  .unit-slider__track img{
    flex: 0 0 78vw !important;
    max-width: 78vw !important;
    height: auto;
    max-height: 44vh;
  }
}

@media (min-width: 901px){
  .unit-slider__track img{
    flex: 0 0 420px;
    max-width: 420px;
  }
}

.unit-slider__note{
  margin: 10px 0 0;
  font-size:12px;
  color:#888;
}