/* ===== extracted style block 1 ===== */

html, body {
      font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
      -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale;
      line-height: 1.45;background: #ffaa00 !important;
    }
    
    .blog-title .count,
    .section-title .count,
    .kw-head .count { font-variant-numeric: tabular-nums; }



/* ===== extracted style block 2 ===== */

/* === Coupang 3-up Horizontal Strip (upgrade) === */
.coupang-strip-wrap{
  position:relative;
  background:#fff; border:1px solid #e5e7eb; border-radius:12px;
  padding:16px 12px 12px; margin:24px 0;
  box-shadow:0 4px 14px rgba(0,0,0,.06);
}

/* Header */
.coupang-strip-head{
  display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px;
  position:relative; z-index:3; /* ▲ 컨텐츠 앞으로 */
}
.coupang-strip-title{font-weight:700; letter-spacing:-.2px; font-size:1.02rem}

/* Nav buttons */
.coupang-nav{display:flex; gap:8px}
.coupang-nav button{
  border:1px solid #e5e7eb; background:#fff; border-radius:10px;
  padding:6px 10px; cursor:pointer; line-height:1; min-width:40px;
  transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
}
.coupang-nav button:hover{ transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.06) }
.coupang-nav button:disabled{
  opacity:.45; cursor:not-allowed; transform:none; box-shadow:none; filter:grayscale(.3);
}
.coupang-nav button:focus-visible{ outline:2px solid #2563eb; outline-offset:2px; border-radius:10px }

/* Scroller */
.coupang-strip{
  display:flex; gap:12px; padding-bottom:4px;
  overflow-x:auto; -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory; scroll-padding:12px;
  position:relative; z-index:2; /* ▲ 컨텐츠 앞으로 */
}
/* Hide horizontal scrollbar */
.coupang-strip{ -ms-overflow-style:none; scrollbar-width:none; }
.coupang-strip::-webkit-scrollbar{ display:none; }

/* Groups (1 page = 1 group) */
.coupang-group{
  flex:0 0 100%;
  display:grid; grid-template-columns:repeat(3,1fr); gap:12px;
  scroll-snap-align:start;
}

/* Cards */
.coupang-card{
  background:#fff; border:1px solid #eef0f3; border-radius:12px;
  display:flex; flex-direction:column; overflow:hidden;
  transition:box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}
.coupang-card:hover{ box-shadow:0 10px 24px rgba(0,0,0,.06); transform:translateY(-2px); border-color:#e2e8f0 }
.coupang-card a{ color:inherit; text-decoration:none; display:block }
.coupang-card img{
  width:100%; height:auto; display:block; aspect-ratio:1/1; object-fit:cover; background:#f3f4f6;
}
.coupang-card .t{ padding:10px 12px 6px; font-size:.95rem; line-height:1.35 }

/* Price row */
.coupang-price{
  display:flex; align-items:baseline; gap:8px; padding:0 12px 10px;
}
.coupang-price strong{ font-size:1.05rem; color:#111; font-weight:700; } /* ▲ 더 선명하게 */
.coupang-price .rp{ text-decoration:line-through; color:#9ca3af; font-size:.9rem }
.coupang-price .off{
  font-size:.78rem; background:#fee2e2; color:#b91c1c;
  border:1px solid #fecaca; border-radius:999px; padding:2px 6px;
}

/* Tags */
.coupang-tags{ display:flex; flex-wrap:wrap; gap:6px; padding:0 12px 12px }
.coupang-tag{
  font-size:.75rem; color:#374151; background:#f3f4f6;
  border:1px solid #e5e7eb; border-radius:999px; padding:3px 8px;
}

/* Edge fade hint (behind content) */
.coupang-strip-wrap::before,
.coupang-strip-wrap::after{
  content:""; position:absolute; top:48px; bottom:12px; width:28px; pointer-events:none;
  background:linear-gradient(to right, #fff, rgba(255,255,255,0));
  z-index:1; /* ▼ 오버레이를 뒤로 */
}
.coupang-strip-wrap::before{ left:12px; }
.coupang-strip-wrap::after{ right:12px; transform:scaleX(-1); }

/* Responsive */
@media (max-width:900px){
  .coupang-group{ grid-template-columns:repeat(2,1fr); }
}
@media (max-width:560px){
    .coupang-group{ grid-template-columns:repeat(2,1fr); } /* ← 1 → 2열 */
  .coupang-strip-wrap{ padding:14px 10px 10px; }
}

/* (선택) 페이드를 완전히 끄고 싶다면 아래 한 줄 추가 */
/*
.coupang-strip-wrap::before, .coupang-strip-wrap::after{ display:none !important; }
*/
  .blog-title{
    display:flex; align-items:center; gap:.6rem;
    font-weight:600; letter-spacing:-.2px;
  }
  .blog-title .count{
    font-variant-numeric: tabular-nums;   /* 숫자 고정폭 */
    font-weight:600; color:#444;          /* 메인 텍스트보다 살짝 옅게 */
    line-height:1;
    position:relative;
  }
  .blog-title .count::before,
  .blog-title .count::after{
    color:#9aa0a6;                        /* 브라켓은 더 연하게 */
    font-weight:400;
  }
  .blog-title .count::before{ content:"["; margin-right:.35rem; }
  .blog-title .count::after { content:"]"; margin-left:.35rem; }
   .section-title{
    display:flex; align-items:center; gap:.6rem;
    font-weight:600; letter-spacing:-.2px;
  }
  .section-title .count{
    font-variant-numeric: tabular-nums;
    font-weight:600; color:#444;
    line-height:1;
    position:relative;
  }
  .section-title .count::before,
  .section-title .count::after{
    color:#9aa0a6;
    font-weight:400;
  }
  .section-title .count::before{ content:"["; margin-right:.35rem; }
  .section-title .count::after { content:"]"; margin-left:.35rem; }   
    
    
 li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0;
  font-size: 0.92rem;
  line-height: 1.4;
}

li .date {
  font-style: italic;
  font-size: 0.83rem;
  color: #888;
  min-width: 48px;
  flex-shrink: 0;
}
    span.date {
  font-style: italic;
  font-size: 0.8rem;
  color: #888;
  min-width: 50px;
}
  :root {
    --main-bg: linear-gradient(135deg, #f8f8f8, #eaeaea);
    --text-color: #222;
    --link-color: #111;
    --link-hover: #6B8E23;
    --container-bg: #ffffff;
  }

  * {
    box-sizing: border-box;
  }

  body {
    font-family: 'Pretendard', sans-serif;
    margin: 0;
    background: var(--main-bg);
    background-size: 400% 400%;
    color: var(--text-color);
    font-size: 16px;
    line-height: 1.6;
  }

  a {
    color: var(--link-color);
    text-decoration: none;
  }
  a:hover {
    color: var(--link-hover);
  }
.video-wrapper.is-shorts {
  aspect-ratio: 9 / 16;
  width: 480px;              /* ★ 고정 */
  max-width: none;           /* ★ 혹시 기존 max-width 무력화 */
  margin-left: auto;
  margin-right: auto;
}

  .topbar {
    background: #ffffff;
    padding: 0.75rem 1rem;
    border-bottom: 1px solid #ddd;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: 0.5rem;
  }

  .topbar a {
    font-size: 0.95rem;
    color: #333;
    white-space: nowrap;
  }

  .admin-bar {
    background: #f1f1f1;
    padding: 0.5rem 1rem;
    text-align: right;
    border-bottom: 1px solid #ddd;
  }

  .container {
  display:grid;
  grid-template-columns:
    minmax(240px, 3fr)   /* left: 최소 240px */
    minmax(0,   5fr)     /* center: 콘텐츠가 커져도 0~트랙 안에만 */
    minmax(320px, 2fr);  /* right: 최소 320px 유지 → 더 이상 눌리지 않음 */
  align-items:start;   /* ✅ 왼쪽 30%, 중간 50%, 오른쪽 20% */
    gap: 0rem;
    max-width: 100%;
    margin: 0 auto;
    padding: 0rem 0rem;
    background: var(--container-bg);
  }

  .left, .right {
    padding: 1rem;
  }
    .left img {
  max-width: 100%;
  height: auto;
  display: block;
}
    .center img {
  max-width: 100%;
  height: auto;
  display: block;
}
  .left { background: #f4f4f4; }
  .right { background: #f4f4f4; }

  .center {
    padding: 1rem;
  }

  .news-card {
    background: #ffffff;
    padding: 1.75rem;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    margin-bottom: 2.5rem;
    color: #222;
    transition: box-shadow 0.3s ease;
        max-width: 100%;
  }

  .news-card h2 {
    font-weight: 600;
    font-size: 1.4rem;
    margin-bottom: 0.5rem;
  }

  .news-card p {
    opacity: 0.9;
    margin-top: 0.3rem;
        word-break: break-word;     /* ✅ 단어 중간이라도 강제 줄바꿈 */
  overflow-wrap: break-word;  /* ✅ 안전한 줄바꿈 (fallback) */
  }

  .admin-form-actions {
    display: flex;
    justify-content: flex-start;
    gap: 0.5rem;
    margin-top: 1rem;
  }

  .admin-form-actions form {
    display: inline-block;
  }

  .admin-form-actions button,
  .admin-form-actions a {
    display: inline-block;
    font-size: 0.85rem;
    padding: 0.35rem 1rem;
    border: 1px solid #ccc;
    background-color: #eee;
    color: #333;
    border-radius: 4px;
    cursor: pointer;
    text-align: center;
    transition: background-color 0.2s, color 0.2s;
    text-decoration: none;
  }

  .admin-form-actions button:hover,
  .admin-form-actions a:hover {
    background-color: #6B8E23;
    color: #fff;
    border-color: #6B8E23;
  }

  .filter-tabs {
    display: flex;
    flex-wrap: nowrap;
    gap: 0.5rem;
    margin: 1rem 0;
  }

  .filter-tabs button {
    padding: 0.4rem 1rem;
    font-size: 0.85rem;
    border: none;
    background: #444;
    color: white;
    border-radius: 4px;
    cursor: pointer;
    white-space: nowrap;
  }

  .filter-tabs .active {
    background-color: #6B8E23;
  }

  .topbar-search {
    display: none;
  }

  .full-width-banner {
    padding: 0;
    margin: 0;
  }

  .full-width-banner img {
    width: 100%;
    max-width: 100vw;
    height: auto;
    border-radius: 0;
    display: block;
  }
    .left {
  min-width: 0;
  width: auto;
}

.left input[type="text"] {
  width: 100%;
  box-sizing: border-box;
}

.left a {
  display: block;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.left li {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.4rem 0;
  font-size: 0.92rem;
  line-height: 1.4;
}

.left img {
  height: auto;
  max-width: 100%;
  display: block;
}
    .article-item.fade-in {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeInUp 0.6s ease-out forwards;
}

@keyframes fadeInUp {
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 로고 이미지는 정확히 기존 크기 유지 */
.left h3 img {
  height: 1.25em !important;
  width: auto !important;
}
    
    .admin-bar {
  padding: 0 !important;
  margin: 0 !important;
  border: none !important; /* 필요 시 */
}
      .rgi img {
    width: 100%;
    height: 400px;
    object-fit: cover;
    margin-bottom: 1.5rem; /* ✅ 이미지 간격 */
    border-radius: 4px;     /* 선택사항: 둥근 모서리 */
    display: block;
  }

  .rgi img:last-child {
    margin-bottom: 0; /* ✅ 마지막 이미지 아래 여백 제거 */
  }
    
    .left-banner img {
  width: 100%;
  height: 400px;
  object-fit: cover;
  margin-bottom: 1.5rem;
  display: block;
  border-radius: 4px; /* ✅ 둥근 모서리 */
}
.left-banner img:last-child {
  margin-bottom: 0;
}
    .card-banner-link {
  /* display: none; */
        
}
    .card-banner {
        width:100%;
            text-align:center;
            
    }
.card-banner img {
  width: 100%;
  height: auto;
  object-fit: cover;
  border-radius: 6px;
  margin: 2rem 0;
    max-width: 100%;       /* ✅ 화면 너비 넘어가지 않도록 제한 */
    
}
        .filter-tabs {
        margin-top:0px;
    }
.video-wrapper {
  overflow: hidden;
  border-radius: 6px;
  margin: 0rem auto;
  max-width: 100%;   /* 🎯 여기서 줄이는 것 */
  width: 100%;
 aspect-ratio:16 / 9;
}
        .desktop-only {
    display: none !important;
  }

  @media (max-width: 1024px) {
  .container {
    display: block !important;
    padding: 1rem;
  }

  .left,
  .right {
    display: none !important;
  }

  .center {
    width: 100% !important;
    padding: 1rem !important;
  }
}
  @media (max-width: 768px) {
        .video-wrapper {
    max-width: 100%;         /* ✅ 모바일에서는 꽉차게 */
  }
        .video-wrapper { max-width: 100%; }
  .video-wrapper.is-shorts{ width: 100%; }
    .container {
      display: block;
      padding: 1rem;
    }

    .left, .right {
      display: none !important;
    }

    .center {
      display: block !important;
      padding: 1rem;
    }

    .topbar {
      flex-direction: row;
      justify-content: space-between;
      align-items: center;
      flex-wrap: wrap;
    }

    .topbar a {
      font-size: 0.85rem;
      padding: 0.25rem 0.5rem;
    }

    .topbar-search {
      display: inline-block !important;
      margin-left: auto;
      margin-top: 0.25rem;
    }

    .topbar-search input[type="text"] {
      font-size: 0.8rem;
      padding: 0.25rem 0.5rem;
      border: 1px solid #ccc;
      border-radius: 4px;
      max-width: 100px;
    }

    .full-width-banner img {
      width: 100% !important;
      max-width: 100vw !important;
      height: auto;
    }
        .filter-tabs {
    justify-content: center !important;   /* ✅ 모바일에서도 중앙 정렬 유지 */
    padding-left: 0 !important;
    margin-left: 0 !important;
    margin-top:0 !important;
    margin-bottom:40px !important;
  }
  .full-width-banner {
    height: 200px;
    overflow: hidden;
  }

  .full-width-banner img {
    width: 90%;
    height: 100%;
    object-fit: cover;
    object-position: left 60%;  /* ✅ 아래쪽 90% 지점 보여주기 */
    display: block;
  }
        .desktop-only {
    display: none !important;
  }
          .topbar-search {
      display: none !important;
    }
        .card-banner-link {
    display: block;
  }
        .mobile-search-bar {
    display: block !important;
  }
      .news-card {
  overflow: hidden;
}
      

      
  }
    
@media (min-width: 769px) {
  .mobile-search-bar {
    display: none !important;
  }
}
   .card-image {
    width: 100%;
    height: auto;
    max-height: 540px;
    object-fit: contain;
    border-radius: 6px;
    display: block;
  }
    .center img {
  max-width: 100%;
  height: auto;
  max-height: 540px !important;
  object-fit: contain !important;
  border-radius: 6px;
  display: block;
}
    .visually-hidden{
  position:absolute!important;clip:rect(1px,1px,1px,1px);clip-path:inset(50%);
  width:1px;height:1px;overflow:hidden;white-space:nowrap;border:0;padding:0;margin:-1px;
}
/* ===================== CHIHO Hub 고객사 스트립 (clients-strip) ===================== */
/* 사진 위 오버레이 리본(혹시 남아있다면) 숨김 */
#clients-strip .client-badge{ display:none !important; }

/* 카드 이미지: 기본(데스크탑)도 더 크게 */
#clients-strip .coupang-card img{
  aspect-ratio: 3 / 4;     /* ▲ 데스크탑에서 더 세로로 큼 */
  object-fit: cover;
  background:#f3f4f6;
}

/* 사진 아래 ‘거래고객사’ 라벨 */
#clients-strip .client-label{
  display:inline-block;
  margin:8px 12px 0;
  padding:4px 8px;
  font-size:.78rem;
  line-height:1;
  background:#111;
  color:#fff;
  border-radius:999px;
}

/* 태그 라인(사진 밑) 간격/정렬 보정 */
#clients-strip .coupang-tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  padding:6px 12px 12px;   /* ▲ 위로 살짝 붙이고 아래 간격 유지 */
}
#clients-strip .coupang-tag{
  font-size:.75rem;
  color:#374151;
  background:#f3f4f6;
  border:1px solid #e5e7eb;
  border-radius:999px;
  padding:3px 8px;
}

/* figure 포지셔닝(필요시 뱃지/레이어에 사용) */
.client-fig{ position:relative; }

/* ===== 반응형: 모바일에서 더 크게 ===== */
@media (max-width: 900px){
  #clients-strip .coupang-card img{
    aspect-ratio: 2.8 / 4; /* 중간 브레이크포인트에서 조금 더 큼 */
  }
}
@media (max-width: 560px){
  #clients-strip .coupang-group{ grid-template-columns: repeat(2, 1fr); } /* 모바일 2열 유지 */
  #clients-strip .coupang-card img{
    aspect-ratio: 2 / 3;   /* 모바일에서 가장 크게 */
  }
}
    /* === Hub 스트립: 카드/이미지 더 세로로, 사진 더 큼 === */

/* 데스크탑(≥901px): 이미지 4:5 */
#clients-strip .coupang-card img{
  aspect-ratio: 4 / 5;
  object-fit: cover;
  object-position: center;
}

/* 태그/제목 간격 살짝 줄여 이미지 비중↑ */
#clients-strip .coupang-card .t{
  font-size: .98rem;
  padding: 8px 12px 4px;   /* 기존 10px 12px 6px → 위아래 여백 축소 */
}

/* 모바일 ~ 태블릿(≤900px): 3:4 로 더 세로 */
@media (max-width: 900px){
  #clients-strip .coupang-card img{
    aspect-ratio: 3 / 4;
  }
}

/* 모바일(≤560px): 3:5 로 가장 세로 (사진 최대) */
@media (max-width: 560px){
  #clients-strip .coupang-group{
    grid-template-columns: repeat(2, 1fr); /* 2열 유지 */
  }
  #clients-strip .coupang-card img{
    aspect-ratio: 3 / 5;   /* ▲ 가장 세로로 */
  }
  #clients-strip .client-label{
    margin: 6px 12px 0;     /* 라벨 간격 조금 줄임 */
    font-size: .76rem;
  }
  #clients-strip .coupang-tags{
    gap: 5px;
    padding: 6px 12px 10px;
  }
}

    /* ----- SHOP strip (광고 카드) ----- */
.shop-strip-wrap{
  border:1px solid #e5e7eb; border-radius:12px;
  padding:16px; margin:32px 0; background:#fff;
}

/* 헤더 */
.shop-strip-head{
  display:flex; align-items:center; justify-content:space-between;
  gap:12px; margin-bottom:12px;
}
.shop-strip-title{margin:0; font-size:1.05rem; font-weight:800; letter-spacing:-.2px}

/* 필터(공종/세부공정/새로고침) */
.shop-strip-actions{
  display:flex; gap:8px; align-items:center; flex-wrap:nowrap;
}
.shop-strip-actions select,
.shop-strip-actions button{
  border:1px solid #e5e7eb; border-radius:10px;
  padding:6px 10px; background:#fff; cursor:pointer; line-height:1;
  white-space:nowrap;
}

/* 모바일: 헤더 2행 고정(공종 1행 / 세부공정+새로고침 1행) */
@media (max-width: 560px){
  .shop-strip-head{ flex-direction:column; align-items:stretch; gap:8px }
  .shop-strip-actions{
    display:grid; grid-template-columns:1fr auto; grid-template-rows:auto auto;
    gap:8px; overflow:visible; padding-bottom:0;
  }
  #shopWorkType{ grid-column:1 / -1; } /* 공종 1행 전체폭 */
  #shopSubwork{ grid-column:1 / 2; }   /* 세부공정 */
  #shopRefresh{ grid-column:2 / 3; white-space:nowrap; } /* 새로고침 */
  .shop-strip-actions select{ width:100%; }
}

/* ====== 카드 래퍼 + 캐러셀 내비게이션 ====== */
.shop-cards-wrap{ position:relative }

/* 화살표: 데스크탑/모바일 모두 표시 */
.shop-nav{
  position:absolute; top:50%; transform:translateY(-50%);
  width:36px; height:36px; border:1px solid #e5e7eb; border-radius:999px;
  background:#fff; cursor:pointer; z-index:2;
  box-shadow:0 6px 18px rgba(0,0,0,.08);
  display:flex; align-items:center; justify-content:center;
  font-size:20px; line-height:1;
}
.shop-nav--left{ left:4px }
.shop-nav--right{ right:4px }

/* ====== SHOP strip: '페이지(.shop-page) 단위' 캐러셀로 교체 ====== */

/* 스크롤 컨테이너는 page만 가로로 나열 */
.shop-cards{
  display:flex !important;
  gap:14px;
  overflow-x:auto;
  -webkit-overflow-scrolling:touch;

  /* ✅ 스냅은 페이지 단위 */
  scroll-snap-type: x mandatory;
  scroll-padding: 8px;

  /* 스크롤바 숨김 */
  -ms-overflow-style:none;
  scrollbar-width:none;
}
.shop-cards::-webkit-scrollbar{ display:none; }

/* 카드 단위 스냅 제거(중요) */
.shop-card{
  scroll-snap-align: unset !important;
}

/* 각 페이지는 100% 폭을 점유 */
.shop-page{
  flex: 0 0 100%;
  scroll-snap-align: start;   /* ✅ '페이지 시작점'으로 스냅 */
  display:grid;
  gap:14px;
}

/* 데스크탑(≥561px): 2행 × 4열 = 8개/페이지 */
@media (min-width: 561px){
  .shop-page{
    grid-template-columns: repeat(4, 1fr);
    grid-template-rows: repeat(2, auto);
  }
}

/* 모바일(≤560px): 3행 × 2열 = 6개/페이지 */
@media (max-width: 560px){
  .shop-page{
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(3, auto);
    gap:12px;
    padding: 0 8px; /* 기존 모바일 패딩 유지 */
  }
  .shop-nav{ width:32px; height:32px; font-size:18px; }
}

/* ====== 카드 비주얼 ====== */
.shop-card{
  border:1px solid #eef0f2; border-radius:12px; overflow:hidden; background:#fff;
  display:flex; flex-direction:column; cursor:pointer;
  transition:transform .12s ease, box-shadow .12s ease;
}
.shop-card:hover{ transform:translateY(-2px); box-shadow:0 10px 24px rgba(0,0,0,.08) }
.shop-card__img{ aspect-ratio:4/3; object-fit:cover; width:100%; background:#f7f7f8 }
.shop-card__body{ padding:10px 12px }
.shop-card__title{ font-weight:700; font-size:.98rem; line-height:1.25; margin:0 0 6px }
.shop-card__meta{ display:flex; justify-content:space-between; align-items:center; font-size:.86rem; color:#555; gap:8px }
.shop-card__price{ font-weight:800; color:#1f2937 }
.shop-card__badge{ font-size:.75rem; background:#f1f5f9; color:#475569; padding:2px 8px; border-radius:999px; white-space:nowrap }

/* ----- modal (미사용시 유지해도 무해) ----- */
.shop-modal{ position:fixed; inset:0; display:none; z-index:1000 }
.shop-modal[aria-hidden="false"]{ display:block }
.shop-modal__backdrop{ position:absolute; inset:0; background:rgba(0,0,0,.5) }
.shop-modal__panel{ position:absolute; inset:5% 4% auto 4%; bottom:5%; background:#fff; border-radius:14px; overflow:auto; box-shadow:0 24px 60px rgba(0,0,0,.35) }
.shop-modal__close{ position:sticky; top:0; display:block; margin-left:auto; font-size:28px; line-height:1; background:#fff; border:0; border-bottom:1px solid #eee; width:44px; height:44px; cursor:pointer }
.shop-modal__body{ padding:16px }
/* ▼ 모아보기/스트립/카드 전부 그림자 제거 */
.pf-wrap,
.coupang-strip-wrap,
.shop-strip-wrap,
.news-card,
.ad-card,
.pf-card,
.coupang-card,
.shop-card { box-shadow: none !important; }

/* hover 때 올라가며 생기는 느낌도 제거 */
.coupang-card:hover,
.shop-card:hover { box-shadow: none !important; transform: none !important; }

/* 좌우 모서리 뿌연 페이드(그라디언트)도 제거 */
.pf-wrap.coupang-strip-wrap::before,
.pf-wrap.coupang-strip-wrap::after { content: none !important; display: none !important; }



/* ===== extracted style block 3 ===== */

/* ===== 모바일: 제목 → 탭(필터1) → 셀렉트+화살표(필터2) 3줄 배치 ===== */
@media (max-width:860px){

  /* 헤더를 1열 3행 그리드로 */
  .pf-head{
    display:grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "pf-title"
      "pf-tabs"
      "pf-actions";
    row-gap:8px;
    align-items:stretch;
  }

  /* 1행: 제목 */
  .pf-title{
    grid-area: pf-title;
    font-size:1.05rem;
    line-height:1.3;
  }

  /* 2행: 탭(블로그 태그 / 뉴스 날짜별) – 반반 꽉 차게 */
  .pf-tabs{
    grid-area: pf-tabs;
    display:grid !important;
    grid-template-columns: 1fr 1fr;
    gap:8px;
      margin-top:12px;
      margin-bottom:12px;
      
  }
  .pf-tabs button{
    width:100%;
    padding:8px 10px;
    line-height:1;
    border-radius:10px;
    white-space:nowrap;
  }

  /* 3행: 셀렉트 + ◀ ▶ */
  .pf-actions{
    grid-area: pf-actions;
    display:grid !important;
    grid-template-columns: 1fr auto auto; /* 셀렉트 넓게, 버튼 2개 */
    gap:8px;
    
  }
  #pfSelect{
    width:100%;
    min-height:36px;
    -webkit-appearance:none;  /* iOS 높이 튐 방지 */
    appearance:none;
  }
  #pfPrev,#pfNext{
    width:44px;
    height:36px;
    padding:0;
    line-height:1;
  }

  /* 카드 그림자/엣지 페이드 제거 유지 */
  .pf-wrap, .pf-card{ box-shadow:none !important; }
  .pf-wrap.coupang-strip-wrap::before,
  .pf-wrap.coupang-strip-wrap::after{ content:none !important; display:none !important; }
}
        
        
        
        
/* ==== 인기 검색어 트리 ==== */
.kw-head{margin-bottom:1rem;border-bottom:1px solid #555;padding-bottom:.4rem;font-weight:700}
.kw-controls{display:grid;gap:.5rem;margin-bottom:.7rem}
.kw-controls input{width:100%;padding:.45rem .6rem;border:1px solid #d1d5db;border-radius:8px;font-size:.9rem}
.kw-ctrl-btns{display:flex;gap:.4rem}
.kw-ctrl-btns button{border:1px solid #ddd;background:#fff;border-radius:8px;padding:.3rem .6rem;cursor:pointer}
.kw-ctrl-btns button:hover{background:#111;color:#fff;border-color:#111}

.kw-discover{border:1px dashed #ccc;background:#fafafa;border-radius:10px;padding:.6rem .7rem;
margin-bottom:.6rem;display:flex;justify-content:space-between;align-items:center}
.kw-discover a{font-weight:700;color:#111;text-decoration:none}
.kw-discover .kw-mini{font-size:.8rem;color:#666}

.kw-tree{border:1px solid #eee;background:#fff;border-radius:10px;padding:.4rem .4rem;max-height:725px;overflow:auto}
.kw-node{padding:.2rem .25rem .2rem .75rem;position:relative}
.kw-node::before{content:"";position:absolute;left:.35rem;top:0;bottom:0;width:1px;background:#eee}
.kw-item{display:flex;align-items:center;gap:.3rem;padding:.25rem .3rem;border-radius:6px}
.kw-item:hover{background:#f7f7f8}
.kw-toggle{width:18px;height:18px;border:1px solid #ccc;border-radius:6px;
display:flex;align-items:center;justify-content:center;font-size:.75rem;background:#fff;cursor:pointer}
.kw-name{font-size:.9rem;text-decoration:none;color:#111}
.kw-count{font-size:.75rem;color:#999;margin-left:auto}
.kw-children{margin-left:1rem;border-left:1px dotted #ddd;padding-left:.4rem}
.kw-hidden{display:none!important}

.kw-chips{margin-top:.7rem;display:flex;flex-wrap:wrap;gap:.4rem}
.kw-chip{border:1px solid #ddd;background:#fff;border-radius:999px;padding:.25rem .6rem;font-size:.82rem;
color:#111;text-decoration:none}
.kw-chip:hover{background:#111;color:#fff}    
        /* 랜덤추천 버튼 강조 */


@keyframes kwGlow{
  0%   { box-shadow:0 0 0 0 rgba(34,197,94,.45); }
  70%  { box-shadow:0 0 0 12px rgba(34,197,94,0); }
  100% { box-shadow:0 0 0 0 rgba(34,197,94,0); }
}
        
        
/* === News 카드 비주얼 복원 (데스크탑+모바일) === */
.center .news-card,
.center .ad-card{
  background:#fff !important;
  border:1px solid #e5e7eb;
  border-radius:12px;
  padding:2.55rem 1.25rem 1.25rem;
  box-shadow:0 6px 20px rgba(0,0,0,.08) !important; /* 전역 none !important 덮어쓰기 */
  transition:box-shadow .15s ease, transform .15s ease, border-color .15s ease;
}
.center .news-card:hover{ 
  box-shadow:0 12px 28px rgba(0,0,0,.10) !important;
  transform:translateY(-1px);
  border-color:#e2e8f0;
}
        
/* 카드 간격 */
.center .news-card,
.center .ad-card{ margin-bottom: 3.5rem;margin-top: 3.5rem; }

/* 이미지 둥근모서리 유지 */
.center .news-card .card-image{ border-radius:8px; }

/* 모바일 여백/곡률 살짝 축소 */
@media (max-width:768px){
  .center .news-card,
  .center .ad-card{
    padding:1rem;
    border-radius:10px;
    margin-bottom:2.5rem;
  }
}
@keyframes greenGlow { 0%,100%{text-shadow:0 0 0 rgba(34,197,94,0)} 60%{text-shadow:0 0 14px rgba(34,197,94,.65), 0 0 28px rgba(34,197,94,.35);} }
@keyframes greenBack { 0%,100%{opacity:0; transform: translate(-50%,-50%) scale(.98)} 60%{opacity:.9; transform: translate(-50%,-50%) scale(1.03);} }

/* 1) 블로그·뉴스 모아보기 제목 */
.pf-wrap .pf-title{
      background: linear-gradient(90deg, #16a34a 0%, #3b82f6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
    font-size:19px;
    font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: #16a34a; /* 폴백: 배경 미지원 브라우저용 */
  position: relative;
  animation: greenGlow 2.6s ease-in-out infinite;
  will-change: filter;
}
.pf-wrap .pf-title::after{
  content:"";
  position:absolute; left:50%; top:50%;
  transform: translate(-50%,-50%);
  width:115%; height:140%;
  background: radial-gradient(closest-side, rgba(34,197,94,.22), rgba(34,197,94,0));
  filter: blur(12px);
  pointer-events:none;
  animation: greenBack 2.6s ease-in-out infinite;
}

/* 2) 공정별 자재주문 · 시공의뢰하기 제목 */
#shop-strip .shop-strip-title{
      background: linear-gradient(90deg, #16a34a 0%, #3b82f6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
    font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size:19px;
  color: #16a34a; /* 폴백: 배경 미지원 브라우저용 */
  position: relative;
  animation: greenGlow 2.6s ease-in-out infinite;
  will-change: filter;
}
#shop-strip .shop-strip-title::after{
  content:"";
  position:absolute; left:50%; top:50%;
  transform: translate(-50%,-50%);
  width:115%; height:140%;
  background: radial-gradient(closest-side, rgba(34,197,94,.22), rgba(34,197,94,0));
  filter: blur(12px);
  pointer-events:none;
  animation: greenBack 2.6s ease-in-out infinite;
}

/* 3) 거래고객社 [B2B] 제목 */
#clients-strip .coupang-strip-title{
      background: linear-gradient(90deg, #16a34a 0%, #3b82f6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
    font-size:19px;
    font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: #16a34a; /* 폴백: 배경 미지원 브라우저용 */
  position: relative;
  animation: greenGlow 2.6s ease-in-out infinite;
  will-change: filter;
}
#clients-strip .coupang-strip-title::after{
  content:"";
  position:absolute; left:50%; top:50%;
  transform: translate(-50%,-50%);
  width:115%; height:140%;
  background: radial-gradient(closest-side, rgba(34,197,94,.22), rgba(34,197,94,0));
  filter: blur(12px);
  pointer-events:none;
  animation: greenBack 2.6s ease-in-out infinite;
}
/* 외부 스트립 / 거래고객사 두 타이틀 모두 글로우 적용 */
#clients-strip .coupang-strip-title,
#coupang-strip .coupang-strip-title{
      background: linear-gradient(90deg, #16a34a 0%, #3b82f6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
    font-size:19px;
    font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  color: #16a34a; /* 폴백: 배경 미지원 브라우저용 */
  position: relative;
  animation: greenGlow 2.6s ease-in-out infinite;
  will-change: filter;
}
#clients-strip .coupang-strip-title::after,
#coupang-strip .coupang-strip-title::after{
  content:"";
  position:absolute; left:50%; top:50%;
  transform: translate(-50%,-50%);
  width:115%; height:140%;
  background: radial-gradient(closest-side, rgba(34,197,94,.22), rgba(34,197,94,0));
  filter: blur(12px);
  pointer-events:none;
  animation: greenBack 2.6s ease-in-out infinite;
}
/* (선택) 모바일에서 살짝 절제하고 싶다면 */
@media (max-width:560px){
  .pf-wrap .pf-title::after,
  #shop-strip .shop-strip-title::after,
  #clients-strip .coupang-strip-title::after{
    filter: blur(10px);
    opacity: .75;
  }
}
        :root{
  --chiho-green: #16a34a;
  --chiho-black: #111111;
}

/* 컨테이너 유지 */
.filter-tabs{ display:flex; gap:.5rem; flex-wrap:wrap; align-items:center; }
.filter-tabs a{ text-decoration:none }

/* 기본 상태: 검정 바탕, 흰 글자, 라운드 8px */
.filter-tabs button{
  appearance:none;
  border:1px solid var(--chiho-black);
  background:var(--chiho-black);
  color:#fff;
  padding:.50rem .95rem;
  border-radius:8px;                  /* ← pill(999px) → 8px 로 축소 */
  font-weight:600;
  letter-spacing:-.2px;
  cursor:pointer;
  transition:
    background .15s ease,
    border-color .15s ease,
    color .15s ease,
    box-shadow .20s ease,
    transform .15s ease;
  box-shadow:0 1px 0 rgba(0,0,0,.04);
}

/* hover: 초록으로 */
.filter-tabs button:hover{
  background:var(--chiho-green);
  border-color:var(--chiho-green);
  color:#fff;
  box-shadow:0 0 0 8px rgba(22,163,74,.12);
  transform:translateY(-1px);
}

/* active(현재 정렬): 초록 고정 */
.filter-tabs button.active{
  background:var(--chiho-green);
  border-color:var(--chiho-green);
  color:#fff;
  box-shadow:0 0 0 6px rgba(22,163,74,.10);
}

/* active + hover도 초록 유지(살짝 더 강조) */
.filter-tabs button.active:hover{
  background:#18b14f;                /* 살짝 밝은 초록 */
  border-color:#18b14f;
  box-shadow:0 0 0 10px rgba(22,163,74,.14);
}

/* 포커스 접근성 */
.filter-tabs button:focus-visible{
  outline:none;
  box-shadow:0 0 0 3px rgba(22,163,74,.35);
}

/* 모바일 미세 튜닝 */
@media (max-width:560px){
  .filter-tabs{ gap:.4rem; justify-content:center }
  .filter-tabs button{ padding:.45rem .9rem; border-radius:8px }
}
/* === [숫자] 카운트 표기 통일 === */
.blog-title .count,
.section-title .count,
.kw-head .count{
  display:inline-block;
  font-variant-numeric: tabular-nums; /* 숫자 고정폭 */
  font-weight:600;
  color:#ff0000;
  line-height:1;
  margin-left:.35rem;  /* 제목과 살짝 띄움 */
}

/* 대괄호는 모두 CSS로 */
.blog-title .count::before,
.section-title .count::before,
.kw-head .count::before{
  content:"[";
  color:#9aa0a6;       /* 브라켓은 연하게 */
  font-weight:400;
  margin-right:.35rem;
}
.blog-title .count::after,
.section-title .count::after,
.kw-head .count::after{
  content:"]";
  color:#9aa0a6;
  font-weight:400;
  margin-left:.35rem;
}
        /* 기본은 접어두기(보이지 않음) */
.center .ad-card{
  padding:0 !important;
  border:0 !important;
  box-shadow:none !important;
  margin:0 !important;
  overflow:hidden;
}

/* 광고가 실제로 채워졌을 때만 카드 모양 부여 */
.center .ad-card.ad-filled{
  background:#fff !important;
  border:1px solid #e5e7eb !important;
  border-radius:12px !important;
  padding:2.55rem 1.25rem 1.25rem !important; /* top | right/left | bottom */
  box-shadow:0 6px 20px rgba(0,0,0,.08) !important;
  margin:3.5rem 0 !important;
}

/* (선택) 실패한 슬롯을 자국 없이 감추기 */
.center .ad-card.ad-failed{ display:none !important; }
        
        
        
body {
  background:
    repeating-linear-gradient(45deg, #f9f9f7 0, #f9f9f7 2px, #f6f6f4 2px, #f6f6f4 4px);
}
.center, .left, .right {
  background-color: #fffdfa;
  box-shadow: inset 0 0 30px rgba(0,0,0,0.03);
}
        .topbar {
  background: rgba(255,255,255,0.85);
  backdrop-filter: blur(6px);
}
        /* ===== 로그인(관리자) 표시줄 색상 통일 ===== */
.admin-bar {
  background: rgba(255, 253, 250, 0.85);   /* body와 유사한 톤 */
  backdrop-filter: blur(6px);
  border-bottom: 1px solid rgba(0,0,0,0.05);
  box-shadow: 0 1px 4px rgba(0,0,0,0.05);
}

/* 로그인 영역 안의 텍스트 가독성 개선 */
.admin-bar a, 
.admin-bar span, 
.admin-bar strong {
  color: #222 !important;
}

/* hover 시 약간의 강조 */
.admin-bar a:hover {
  color: #16a34a !important;
}

/* 관리자 바가 .topbar와 시각적으로 이어지도록 */
.topbar + .admin-bar {
  margin-top: -1px; /* 이음매 제거 */
}
        
/* 데스크탑은 그대로 두고 */
.shop-card__meta{
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:8px;
}

/* 모바일: 금액 1줄, 배지 1줄(세로 배치) */
@media (max-width: 800px){
  .shop-card__meta{
    flex-direction: column;
    align-items: flex-start;
    gap: 6px;
           font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  }
  .shop-card__price{
    white-space: nowrap;      /* ₩21,000이 줄 안에서 끊기지 않게 */
    font-size: 1rem;
    line-height: 1.2;
           font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  }
  .shop-card__badge{
    margin-left: 0;           /* 왼쪽 정렬 */
    flex: 0 0 auto;           /* 줄바꿈 안정화 */
  }
}

.shop-card__title {
  display: inline;
  background: linear-gradient(to top, rgba(155,155,155,0.25) 40%, transparent 40%);
  box-decoration-break: clone;
  font-weight: 700;
}
        
/* ===== 뉴스 카드 제목: 초록 → 파랑 그라디언트 텍스트 ===== */
.center .news-card h2 a {
  position: relative;
  display: inline-block;
  font-weight: 800;
  background: linear-gradient(90deg, #16a34a 0%, #3b82f6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #16a34a; /* 폴백: 배경 미지원 브라우저용 */
     font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  text-shadow: 0 0 6px rgba(22,163,74,0.2);
  transition: transform .25s ease, filter .25s ease;
}

/* hover 시 진한 색감 + 살짝 빛나는 효과 */
.center .news-card h2 a:hover {

  filter: brightness(1.15) saturate(1.3);
  text-shadow:
    0 0 10px rgba(59,130,246,0.45),
    0 0 20px rgba(22,163,74,0.35);
}
        
/* === 전역 폰트/숫자 일관화 (최상단 html 기준) === */
html {
  font-family: 'Pretendard Variable', Pretendard, 'Apple SD Gothic Neo',
               'Noto Sans KR', -apple-system, BlinkMacSystemFont,
               'Segoe UI', Roboto, 'Helvetica Neue', Arial,
               'Apple Color Emoji','Segoe UI Emoji', sans-serif !important;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* 가변폰트 합성으로 인한 굵기/기울임 왜곡 방지 */
  font-synthesis-weight: none;
  font-synthesis-style: none;
}

/* 본문·링크 기본값도 html 상속 유지 */
body, a, p, li, input, button, select, textarea, small, span {
  font-family: inherit !important;
}

/* 제목/카운터 숫자 고정폭(정렬 이슈 방지) */
h1, h2, h3, h4, .blog-title .count, .section-title .count, .kw-head .count,
.filter-tabs button, .shop-card__price, .coupang-price strong, .coupang-price .rp {
  font-variant-numeric: tabular-nums;
}

/* 유튜브 쇼츠 고정폭에서 한글/영문 혼용시 강제 Pretendard 유지 */
.video-wrapper, .video-wrapper * {
  font-family: inherit !important;
}        
        /* ① Grid 컬럼이 콘텐츠에 끌려 넘치지 않도록: minmax(0, fr) */
/* ===== 설계 및 상담하기 전용 타이틀 ===== */
.consult-title {
  
  margin-bottom: 1rem;
  display: inline-block;
  font-size: 1.45rem;
  font-family: 'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Noto Sans KR', sans-serif;
  font-weight: 800;                             /* 🔹 가변폰트 적용 */
  font-variation-settings: "wght" 800;
  font-synthesis: none;                         /* 🔹 브라우저 보간 방지 */
  letter-spacing: -0.3px;
  line-height: 1.1;
  background: linear-gradient(90deg, #16a34a 0%, #3b82f6 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: #16a34a; /* 폴백 */
  text-shadow: 0 0 8px rgba(22,163,74,.25);
  position: relative;
  animation: consultGlow 2.6s ease-in-out infinite;
  will-change: filter;
  
}

.consult-title::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 55%;
  transform: translate(-50%, -50%);
  width: 120%;                /* 🔹 기존보다 줄여서 텍스트보다 약간만 넓게 */
  max-width: 280px;           /* 🔹 너무 퍼지지 않도록 한계폭 지정 */
  height: 100%;
  background: radial-gradient(
    circle at center,
    rgba(34,197,94,0.25) 0%,
    rgba(34,197,94,0.05) 60%,
    transparent 100%
  );
  filter: blur(4px);          /* 🔹 번짐 줄임 */
  opacity: 0.5;
  pointer-events: none;
}
@keyframes consultGlow {
  0%, 100% { text-shadow: 0 0 0 rgba(34,197,94,0); }
  50% { text-shadow: 0 0 10px rgba(34,197,94,.4), 0 0 16px rgba(59,130,246,.25); }
}
@keyframes consultBack {
  0%, 100% { opacity: 0.55; transform: translate(-50%,-50%) scale(0.97); }
  50% { opacity: 0.9; transform: translate(-50%,-50%) scale(1.03); }
}

/* 모바일에서는 효과 완화 */
@media (max-width:560px) {
  .consult-title {
    font-size: 1.25rem;
    animation: none;
  }}
  .consult-title::after { opacity: .4; filter: blur(6px); }
  /* ===== 상담요청 작성 버튼 hover 효과 ===== */
.btn-cta {
  display: inline-block;
  padding: 0.6rem 1rem;
  border-radius: 10px;
  background: #111;
  color: #fff;
  border: 1px solid #111;
  text-decoration: none;
  font-weight: 600;
  letter-spacing: -0.2px;
  transition: all 0.2s ease;
}

/* hover 시 뉴스룸 필터탭(active) 스타일과 동일한 초록 강조 */
.btn-cta:hover {
  background: #16a34a;                 /* ✅ 초록 */
  border-color: #16a34a;
  color: #fff;
  box-shadow: 0 0 0 6px rgba(22,163,74,0.12);  /* 부드러운 초록 빛 */
  transform: translateY(-1px);
}
.consult-title {
  display: flex;
  align-items: center;
  gap: .4rem;           /* 로고와 텍스트 사이 여백 */
  margin-top: 0.5rem;
  margin-bottom: 1rem;
}



.consult-logo {
  
  width: 32px;          /* ✅ 폭 24px로 축소 */
  height: auto;         /* 세로 비율 자동 유지 */
  display: inline-block;
  vertical-align: middle;
  filter: drop-shadow(0 0 3px rgba(0,0,0,0.2)); /* 약한 그림자 */
}

/* 모바일에서 더 작게 (선택사항) */
@media (max-width:560px){
  .consult-logo { width: 32px; }
}








  /* 1) 상단 제목 패딩/여백 줄이기 */
  #consult-cta{ padding: 1rem 1.25rem 1.1rem !important; }
  #consult-cta .consult-title{ margin: .2rem 0 .8rem !important; }

  /* 2) 이미지 중앙 정렬(쏠림 방지, figure 기본 여백 제거) */
  #consult-cta .cta-fig{ margin:0 !important; line-height:0 !important; overflow:hidden; }
  #consult-cta .cta-fig img{
    display:block !important; width:100% !important; height:auto !important;
    aspect-ratio:4/3; object-fit:cover; object-position:center center !important;
  }

  /* 3) 가로 스크롤은 동작하되 “보이지 않게” */
  #consult-cta .cta-cards{
    overflow-x:auto !important; -webkit-overflow-scrolling:touch;
    /* 스크롤바 숨김(모든 브라우저) */
    -ms-overflow-style:none; scrollbar-width:none;
  }
  #consult-cta .cta-cards::-webkit-scrollbar{ display:none; }

  /* 4) 버튼 스타일을 기존 리스트 스트립(=coupang-strip) 느낌으로 통일 */
  #consult-cta .cta-nav{
    width:40px; height:34px; border-radius:10px !important;
    border:1px solid #e5e7eb; background:#fff;
    box-shadow:none !important; font-size:18px; line-height:1;
    display:flex; align-items:center; justify-content:center;
  }
  #consult-cta .cta-nav:hover{ transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.06); }
  #consult-cta .cta-nav:disabled{
    opacity:.45; cursor:not-allowed; transform:none; box-shadow:none; filter:grayscale(.3);
  }

  /* 버튼 위치는 “양 옆” 그대로(이전 방식 고수) */
  #consult-cta .cta-cards-wrap{ position:relative; }
  #consult-cta .cta-nav{ position:absolute; top:50%; transform:translateY(-50%); }
  #consult-cta .cta-nav--left{ left:4px; }
  #consult-cta .cta-nav--right{ right:4px; }

  /* 5) 반응형 미세 조정 그대로 유지 */
  @media (max-width:900px){
    #consult-cta .cta-cards{ grid-auto-columns: calc((100% - 12px)/2) !important; }
  }
  @media (max-width:560px){
    #consult-cta .cta-cards{ grid-auto-columns: 100% !important; }
    #consult-cta .cta-nav{ width:36px; height:32px; font-size:16px; }
  }



/* ===== extracted style block 4 ===== */

/* 상자 패딩: 상단 확 줄이기 */
  #consult-cta{ padding: .75rem 1.1rem 1.1rem !important; }

  /* 제목 위아래 여백 최소화 */
  #consult-cta .consult-title{
    margin: .05rem 0 .5rem !important;
  }

  /* 헤더(제목+네비)와 그리드 간 간격 확보 */
  #consult-cta .cta-head{ margin-bottom: .6rem !important; }

  /* 이미지 중앙 고정(쏠림 방지) */
  #consult-cta .cta-fig{ margin:0 !important; line-height:0 !important; overflow:hidden; }
  #consult-cta .cta-fig img{
    display:block !important; width:100% !important; height:auto !important;
    aspect-ratio:4/3; object-fit:cover; object-position:center !important;
  }

  /* 카드 목록: 가로 스크롤 보이진 않게 */
  #consult-cta .cta-cards{
    display:grid; gap:12px;
    grid-auto-flow:column;
    grid-auto-columns: calc((100% - 24px)/3);
    padding:0 8px;
    margin-top:.2rem;                /* ← 버튼/제목과 붙던 문제 해결 */
    overflow-x:auto !important; -webkit-overflow-scrolling:touch;
    -ms-overflow-style:none; scrollbar-width:none;
    scroll-snap-type:x mandatory; scroll-padding:8px;
  }
  #consult-cta .cta-cards::-webkit-scrollbar{ display:none; }

  /* 카드 룩앤필 기존 유지 */
  #consult-cta .cta-item{
    scroll-snap-align:center;
    display:flex; flex-direction:column; gap:8px;
    border:1px solid #eef0f2; border-radius:10px; overflow:hidden; background:#fff; text-decoration:none; color:#111;
  }
  #consult-cta .cta-item:hover{ transform:translateY(-2px); box-shadow:0 10px 22px rgba(0,0,0,.08); border-color:#e2e8f0; }
  #consult-cta .cta-t{
    padding:9px 10px 10px; font-size:.95rem; line-height:1.35;
    display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
  }

  /* 헤더 우측 네비 버튼(아이콘만) — coupang-strip 톤 */
  #consult-cta .cta-head-actions{ display:flex; align-items:center; gap:8px; }
  #consult-cta .cta-head-btn{
    border:1px solid #e5e7eb; background:#fff; border-radius:10px;
    padding:6px; width:40px; height:34px; cursor:pointer; line-height:0;
    transition:transform .12s ease, box-shadow .12s ease, border-color .12s ease;
  }
  #consult-cta .cta-head-btn:hover{ transform:translateY(-1px); box-shadow:0 6px 16px rgba(0,0,0,.06); }
  #consult-cta .cta-head-btn:disabled{ opacity:.45; cursor:not-allowed; transform:none; box-shadow:none; filter:grayscale(.3); }

  /* 반응형 폭 */
  @media (max-width:900px){ #consult-cta .cta-cards{ grid-auto-columns: calc((100% - 12px)/2); } }
  @media (max-width:560px){ #consult-cta .cta-cards{ grid-auto-columns: 100%; } }



/* === 상담의뢰 카드: 얇은 초록빛 테두리 (after로만 구현, 클릭 방해 없음) === */
#consult-cta {
  position: relative;
  z-index: 0; /* 기준 레이어 */
}

#consult-cta::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;     /* 기존 곡선 그대로 */
  padding: 1px;               /* 얇은 테두리 두께 */
  pointer-events: none;       /* 내부 클릭 절대 방해 안 함 */

  /* 초록빛 그라디언트 */
  background: linear-gradient(
    90deg,
    #16a34a,
    #22c55e,
    #4ade80,
    #22c55e,
    #16a34a
  );
  -webkit-mask:
    linear-gradient(#fff 0 0) content-box,
    linear-gradient(#fff 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude;

  /* 부드럽게 흐르는 효과 */
  animation: greenBorderFlow 6s linear infinite;
  background-size: 300% 100%;
  opacity: 0.9;
}

/* 빛이 좌→우로 흐르는 애니메이션 */
@keyframes greenBorderFlow {
  0%   { background-position: 0% 50%; }
  100% { background-position: 100% 50%; }
}

/* hover 시 살짝 더 밝게 */
#consult-cta:hover::after {
  filter: brightness(1.15);
}

.consult-title {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
}

.consult-title {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
}

.consult-title {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
}

/* 제목 영역은 기준점만 */
.consult-title{
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: .4rem;
}





/* ▷ 1) 흩날리는 입자 레이어(뒤쪽) */
.consult-title::before{
  content:"";
  position:absolute;
  right:-58px;            /* 제목 오른쪽 바깥 */
  top:50%;
  transform: translateY(-70%);
  width:52px; height:38px;/* 가로로 살짝 넓게 → 흩날림 공간 */
  pointer-events:none;
  border-radius: 50%;
  /* 작은 점 무리: 두 겹을 서로 다른 크기/속도로 움직이게 */
  background:
    radial-gradient(2px 2px at 22px 10px, rgba(52,211,153,.9)  0 70%, transparent 71%),
    radial-gradient(2.2px 2.2px at 34px 4px, rgba(16,185,129,.9) 0 70%, transparent 71%),
    radial-gradient(1.8px 1.8px at 12px 18px, rgba(74,222,128,.85) 0 70%, transparent 71%),
    radial-gradient(1.8px 1.8px at 28px 20px, rgba(34,197,94,.85)  0 70%, transparent 71%),
    radial-gradient(2.2px 2.2px at 44px 12px, rgba(22,163,74,.8)  0 70%, transparent 71%);

  mix-blend-mode: screen;
  filter: drop-shadow(0 0 10px rgba(74,222,128,.35));
  z-index: 1;  /* after(메인) 뒤쪽 */
  animation:
    driftXY 5.5s ease-in-out infinite alternate,
    twinkle 2.6s ease-in-out infinite alternate;
}


/* ── 애니메이션 정의 ─────────────────────────────── */
/* 입자 전체가 살짝 떠다니는 xy 드리프트 */
@keyframes driftXY{
  0%   { transform: translate(2px, -60%) scale(1) rotate(-2deg); }
  100% { transform: translate(-3px, -40%) scale(1.02) rotate(3deg); }
}
/* 미세한 반짝임(밝기/투명) */
@keyframes twinkle{
  0%,100%{ opacity:.75; filter: drop-shadow(0 0 8px rgba(74,222,128,.32)); }
  50%    { opacity:1;   filter: drop-shadow(0 0 12px rgba(74,222,128,.6)); }
}
/* 메인 클러스터의 부드러운 호흡 */
@keyframes clusterFloat{
  0%   { transform: translateY(-50%) rotate(18deg) scale(1); }
  100% { transform: translateY(-50%) rotate(22deg) scale(1.04); }
}

/* 사용자 선호 모션 최소화 */
@media (prefers-reduced-motion: reduce){
  .consult-title::before,
  .consult-title::after{ animation: none; }
}

/* ⬇️ 센터 광고 카드 정렬/폭 보정 */
.center .ad-card { 
  /* 카드 자체는 좌우 대칭 패딩 + 중앙 정렬 */
  text-align: center;               /* 내부 inline 요소 중앙 */
  padding: 2.0rem 1.25rem 1.25rem !important;
  box-sizing: border-box;
}

/* adsbygoogle 슬롯을 ‘가운데’ 잡기 */
.center .ad-card .adsbygoogle {
  display: block !important;
  /* ads가 고정폭(320/468/728 등)일 때도 가운데 오도록 */
  margin: 0 auto !important;
  /* 레이아웃 깨짐 방지 */
  max-width: 100% !important;
  box-sizing: border-box;
}

/* 실제 삽입되는 iframe도 가운데 정렬 + 부모폭 넘치지 않게 */
.center .ad-card .adsbygoogle > iframe {
  display: block !important;
  margin: 0 auto !important;   /* 고정폭 iframe 중앙 정렬의 핵심 */
  max-width: 100% !important;  /* 작은 화면에서 넘침 방지 */
  height: auto;                /* 반응형 높이 */
}

/* 광고가 채워지기 전(기본 ad-card)은 여백/테두리 없이 숨김 유지 */
.center .ad-card:not(.ad-filled) {
  padding: 0 !important;
  border: 0 !important;
  box-shadow: none !important;
}

/* 혹시 가로 스크롤로 인한 시각적 ‘치우침’이 보이면 */
.center { overflow-x: hidden; }

/* 센터 광고 슬롯: 카드가 아니라 얇은 컨테이너 */
.center .ad-slot{
  margin: 3.5rem 0;         /* 카드와 비슷한 위아래 간격만 */
  text-align: center;       /* 내부 iframe 가운데 */
}

/* 슬롯 안의 adsbygoogle/iframe 가운데 정렬 + 넘침 방지 */
.center .ad-slot .adsbygoogle{
  display:block !important;
  margin:0 auto !important;
  max-width:100% !important;
  box-sizing:border-box;
  padding:0;
}
.center .ad-slot .adsbygoogle > iframe{
  display:block !important;
  margin:0 auto !important;
  max-width:100% !important;
    padding:0;
}




@media (max-width: 768px) {
  /* 컨테이너는 패딩 제거 */
  .container {
    padding: 0 !important;
  }

  /* 센터 본문은 기존대로 패딩 1rem 유지 */
  .center {
    padding: 1rem !important;
    overflow-x: visible !important;  /* 광고가 살짝 튀어나와도 잘리지 않게 */
  }

  /* 🔥 광고 슬롯만 좌우 패딩을 상쇄해서 화면 100%로 */
  .center .ad-slot {
    margin-left: -1rem !important;   /* .center padding-left 상쇄 */
    margin-right: -1rem !important;  /* .center padding-right 상쇄 */
  }

  /* 혹시 ad-card 형태로 래핑된 경우도 같은 처리 */
  .center .ad-card,
  .center .ad-card.ad-filled {
    padding: 0 !important;
    margin: 2rem -1rem !important;   /* 좌우 -1rem 해서 전체 폭으로 */
    border: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
  }

  .center .ad-card .adsbygoogle,
  .center .ad-card .adsbygoogle > iframe,
  .center .ad-slot .adsbygoogle,
  .center .ad-slot .adsbygoogle > iframe {
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    margin: 0 auto !important;
  }
}
/* ========= CHIHO Topbar 고급 호버 스타일 ========= */

.topbar a {
  position: relative;
  padding: 0.4rem 0.9rem;
  font-weight: 500;
  letter-spacing: -0.2px;
  transition: color .22s ease;
}

/* 밑줄: 처음엔 0 → hover 시 부드럽게 100% */
.topbar a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -2px;    /* 글자 바로 아래 */
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, #16a34a 0%, #3b82f6 100%);
  transform: scaleX(0);
  transform-origin: left center;
  transition: transform .25s ease;
}

/* hover 효과 */
.topbar a:hover {
  color: #111; /* 또는 white로 바꿔도 됨 */
}

.topbar a:hover::after {
  transform: scaleX(1);
}

.topbar .label-desktop {
  display: none;
}
.topbar .label-mobile {
  display: inline;
}

/* 데스크탑(769px 이상)에서는 데스크탑 라벨만 보이게 */
@media (min-width: 1024px) {
  .topbar .label-mobile {
    display: none;
  }
  .topbar .label-desktop {
    display: inline;
  }
}





.chiho-product-title{
    font-size: 1.35rem;
    font-weight: 800;
    margin: 2.5rem 0 1.2rem;
    background: linear-gradient(90deg,#16a34a,#3b82f6);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}

.chiho-product-grid-inner{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 16px;
}

.chiho-product-card{
    background:#fff;
    border:1px solid #eee;
    border-radius:12px;
    overflow:hidden;
    padding:0;
}

.chiho-product-card img{
    width:100%;
    aspect-ratio:4/3;
    object-fit:cover;
}

.chiho-product-card .t1{
    font-size: .75rem;
    color:#666;
    padding:6px 10px 0;
}

.chiho-product-card .t2{
    font-size:.95rem;
    font-weight:600;
    padding:2px 10px;
    color:#111;
}

.chiho-product-card .t3{
    font-size:.9rem;
    font-weight:700;
    padding:4px 10px 10px;
    color:#111;
}

@media (max-width:560px){
    .chiho-product-grid-inner{
        grid-template-columns:1fr;
    }
}
@media (max-width:860px){
  #chiho-product-strip .pf-head,
  #chiho-collection-strip .pf-head {
    display:flex !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:space-between !important;
    grid-template-columns:none !important;
    grid-template-areas:none !important;
  }
}
.pf-wrap,
#coupang-strip,
#clients-strip,
#shop-strip,
#consult-cta,
.container,
.center,
.left,
.right {
  max-width: 100%;
  box-sizing: border-box;
}
html, body {
  overflow-x: hidden;   /* 🔥 어떤 놈이 삐져나와도 화면 가로 흔들림 막기 */
}

/* =========================================================
   Tablet Landscape Preset
   - 대상: iPad / Tablet 가로 보기
   - 목적: 레이아웃 유지 + 밀도·가독성 최적화
   - 적용 위치: CSS 맨 마지막
   ========================================================= */

@media (min-width: 1025px) and (max-width: 1280px) and (orientation: landscape) {

  /* ─────────────────────────────────
     1. 전역 타이포 스케일
  ───────────────────────────────── */
  html {
    font-size: 14px;              /* 기본 16px → 15px */
  }

  body {
    line-height: 1.55;
  }

  /* ─────────────────────────────────
     2. 컨테이너 / 컬럼 여백
  ───────────────────────────────── */
  .container {
    gap: 0.5rem;
    padding: 0.75rem 0.75rem;
  }

  .left,
  .center,
  .right {
    padding: 0.75rem;
  }

  /* ─────────────────────────────────
     3. 뉴스 / 콘텐츠 카드
  ───────────────────────────────── */
  .center .news-card,
  .center .ad-card {
    padding: 1.6rem 1.1rem 1.1rem;
    margin: 2.2rem 0;
  }

  .center .news-card h2 {
    font-size: 1.15rem;
    line-height: 1.35;
  }

  .center .news-card p {
    font-size: 0.9rem;
    line-height: 1.55;
  }

  /* ─────────────────────────────────
     4. 이미지 / 영상 비중 조절
  ───────────────────────────────── */
  .card-image {
    max-height: 420px;
    object-fit: contain;
  }

  .video-wrapper {
    max-width: 92%;
  }

  .video-wrapper.is-shorts {
    width: 360px;
  }

  /* ─────────────────────────────────
     5. 좌 / 우 컬럼 텍스트 밀도
  ───────────────────────────────── */
  .left h3,
  .right h3 {
    font-size: 1rem;
    margin-bottom: 0.8rem;
  }

  .left li,
  .right p,
  .right a {
    font-size: 0.85rem;
    line-height: 1.4;
  }

  /* ─────────────────────────────────
     6. 스트립 / 카드 모듈 (외부상품·컬렉션·샵)
  ───────────────────────────────── */
  .coupang-strip-title,
  .pf-title,
  .shop-strip-title {
    font-size: 1.05rem;
  }

  .coupang-card .t,
  .pf-card .t,
  .shop-card__title {
    font-size: 0.9rem;
  }

  .coupang-price strong {
    font-size: 0.95rem;
  }

  /* ─────────────────────────────────
     7. 버튼 / 필터 탭
  ───────────────────────────────── */
  .filter-tabs button {
    padding: 0.4rem 0.85rem;
    font-size: 0.85rem;
  }

  .admin-form-actions button,
  .admin-form-actions a {
    font-size: 0.8rem;
    padding: 0.3rem 0.8rem;
  }

}
/* =========================================================
   Tablet Landscape: 공정 내역서 & 시공 계획 헤더 2행 분리
   ========================================================= */

@media (min-width: 860px) and (max-width: 1280px) and (orientation: landscape) {

  /* 헤더를 2행(grid)으로 분리 */
  #shop-strip .shop-strip-head {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-rows: auto auto;
    row-gap: 0.6rem;
    align-items: stretch;
  }

  /* 1행: 제목 */
  #shop-strip .shop-strip-title {
    font-size: 1.05rem;
    line-height: 1.25;
    white-space: normal;   /* 줄바꿈 허용 */
  }

  /* 2행: 필터 영역 */
  #shop-strip .shop-strip-actions {
    display: grid;
    grid-template-columns: 1fr 1fr auto; /* 공종 | 세부공정 | 새로고침 */
    gap: 0.5rem;
    align-items: center;
  }

  #shop-strip .shop-strip-actions select {
    width: 100%;
    min-height: 36px;
  }

  #shop-strip .shop-strip-actions button {
    min-height: 36px;
    padding: 0 0.75rem;
    white-space: nowrap;
  }
}
/* =========================================================
   Tablet Landscape: 블로그 | 뉴스 모아보기 ONLY
   ========================================================= */

@media (min-width: 860px) and (max-width: 1280px) and (orientation: landscape) {

  /* 🎯 오직 '블로그 | 뉴스 모아보기' 카드만 */
  .pf-wrap:not(#chiho-collection-strip):not(#chiho-product-strip) .pf-head {
    display: grid !important;
    grid-template-columns: 1fr !important;
    grid-template-areas:
      "pf-title"
      "pf-tabs"
      "pf-actions";
    row-gap: 0.6rem;
    align-items: stretch;
  }

  .pf-wrap:not(#chiho-collection-strip):not(#chiho-product-strip) .pf-title {
    grid-area: pf-title;
    font-size: 1.05rem;
    line-height: 1.25;
    white-space: normal;
  }

  .pf-wrap:not(#chiho-collection-strip):not(#chiho-product-strip) .pf-tabs {
    grid-area: pf-tabs;
    display: grid !important;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.5rem;
  }

  .pf-wrap:not(#chiho-collection-strip):not(#chiho-product-strip) .pf-tabs button {
    width: 100%;
    min-height: 34px;
    font-size: 0.85rem;
    white-space: nowrap;
  }

  .pf-wrap:not(#chiho-collection-strip):not(#chiho-product-strip) .pf-actions {
    grid-area: pf-actions;
    display: grid !important;
    grid-template-columns: 1fr auto auto;
    gap: 0.5rem;
    align-items: center;
  }

  .pf-wrap:not(#chiho-collection-strip):not(#chiho-product-strip) .pf-actions select {
    width: 100%;
    min-height: 36px;
  }

  .pf-wrap:not(#chiho-collection-strip):not(#chiho-product-strip) .pf-navbtn {
    width: 44px;
    height: 36px;
    padding: 0;
    line-height: 1;
  }
}
/* =========================================================
   Tablet Portrait (iPad 세로)
   CHIHO · Objects Collections → 3행 × 2열 (6개 고정)
   JS는 그대로, 보이는 개수만 제한
   ========================================================= */

@media (min-width: 561px) and (max-width: 1024px) and (orientation: portrait) {

  /* 2열 그리드 */
  #chiho-collection-strip .pf-group {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px;
  }

  /* 🔥 7번째 카드부터 숨김 → 6개 고정 */
  #chiho-collection-strip .pf-group > .pf-card:nth-child(n+7) {
    display: none !important;
  }

  /* 텍스트 밀도 */
  #chiho-collection-strip .pf-card .t {
    font-size: 0.9rem;
    line-height: 1.35;
  }
}
/* =========================================================
   Tablet Portrait (iPad 세로)
   CHIHO · 거래고객社 [B2B] → 1행 × 2열
   ========================================================= */

@media (min-width: 561px) and (max-width: 860px) and (orientation: portrait) {

  /* 그룹을 2열 그리드로 */
  #clients-strip .coupang-group {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px;
  }

  /* 🔥 3번째 카드부터 숨김 → 2개만 보이게 */
  #clients-strip .coupang-group > .coupang-card:nth-child(n+3) {
    display: none !important;
  }

}
/* =========================================================
   Tablet Portrait (iPad 세로)
   CHIHO · Objects (주문 제작) → 2열 × 2행 (4개)
   ========================================================= */

@media (min-width: 561px) and (max-width: 860px) and (orientation: portrait) {

  /* 2열 그리드 */
  #chiho-product-strip .pf-group {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px;
  }

  /* 🔥 5번째 카드부터 숨김 → 4개 고정 */
  #chiho-product-strip .pf-group > .pf-card:nth-child(n+5) {
    display: none !important;
  }

  /* 텍스트 밀도 모바일 톤 */
  #chiho-product-strip .pf-card .t {
    font-size: 0.9rem;
    line-height: 1.35;
  }
}
/* =========================================================
   Tablet Portrait (iPad 세로)
   외부 상품 스트립 → 1행 × 2열 (2개)
   ========================================================= */

@media (min-width: 561px) and (max-width: 860px) and (orientation: portrait) {

  /* 그룹을 2열로 */
  #coupang-strip .coupang-group {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr) !important;
    gap: 12px;
  }

  /* 🔥 3번째 카드부터 숨김 → 2개 고정 */
  #coupang-strip .coupang-group > .coupang-card:nth-child(n+3) {
    display: none !important;
  }
}
/* =========================
   NEWSROOM 펼쳐보기 카드 (details/summary)
   - 카드 클릭 = 펼쳐보기
   - "자세히 보기" 버튼만 이동
   ========================= */

/* 기존 .center .news-card padding(!important) 덮어쓰기 */
.center details.news-card.news-expand{
  padding:0 !important;
}

/* summary는 카드 상단(프리뷰) */
.center details.news-card.news-expand > summary.news-summary{
  list-style:none;
  cursor:pointer;
  padding:2.55rem 1.25rem 1.25rem;
  outline:none;
}
.center details.news-card.news-expand > summary.news-summary::-webkit-details-marker{ display:none; }

.center details.news-card.news-expand[open] > summary.news-summary{
  padding-bottom:1rem;
  border-bottom:1px solid rgba(0,0,0,0.06);
}

/* 프리뷰 미디어 */
.center details.news-card.news-expand .summary-media{ margin-bottom:1rem; }
/* ✅ 일반 이미지(기사 썸네일)만 height:auto */
.center details.news-card.news-expand .summary-media > img.card-image{
  width:100%;
  height:auto;
  border-radius:8px;
  display:block;
}

/* ✅ 쇼츠/유튜브 썸네일은 래퍼를 꽉 채우도록 */
.center details.news-card.news-expand .summary-media .video-wrapper.is-shorts{
  aspect-ratio: 9 / 16 !important;
  width: min(500px, 100%) !important;
  margin: 0 auto !important;
  overflow: hidden !important;
  border-radius: 8px;
  background:#000;
}

.center details.news-card.news-expand .summary-media .video-wrapper.is-shorts .yt-lite{
  width:100% !important;
  height:100% !important;
}

.center details.news-card.news-expand .summary-media .video-wrapper.is-shorts .yt-lite img{
  width:100% !important;
  height:100% !important;
  object-fit: cover !important;
  display:block !important;
}
/* 프리뷰 요약문 */
.center details.news-card.news-expand .news-excerpt{
  white-space:normal;
  overflow:hidden;
  text-overflow:ellipsis;
  font-size:0.95rem;
  color:#444;
  margin-top:0.5rem;
}

/* 펼쳐보기 힌트(열리면 숨김) */
.center details.news-card.news-expand .expand-hint{
  margin-top:0.9rem;
  font-size:0.82rem;
  color:#64748b;
  display:flex;
  justify-content:flex-end;
  gap:6px;
}


/* 펼쳐진 본문 영역 */
.center details.news-card.news-expand .news-expanded{
  padding:1.1rem 1.25rem 1.25rem;
}
.center details.news-card.news-expand .news-full{
  overflow:visible;
}
.center details.news-card.news-expand .news-full *{
  max-width:100%;
}
.center details.news-card.news-expand .news-full p{
  opacity:0.95;
  white-space:normal;
  overflow:visible;
  text-overflow:clip;
}

/* 하단 액션 */
.center details.news-card.news-expand .news-actions{
  margin-top:1rem;
  padding-top:1rem;
  border-top:1px dashed rgba(0,0,0,0.18);
  display:flex;
  justify-content:flex-end;
  gap:10px;
}
.center details.news-card.news-expand .btn-detail{
  display:inline-block;
  padding:0.6rem 1rem;
  border-radius:10px;
  background:#111;
  color:#fff;
  border:1px solid #111;
  font-weight:600;
}
.center details.news-card.news-expand .btn-detail:hover{
  background:#16a34a;
  border-color:#16a34a;
}

/* 모바일 패딩 축소 */
@media (max-width:768px){
  .center details.news-card.news-expand > summary.news-summary{ padding:1rem; }
  .center details.news-card.news-expand .news-expanded{ padding:1rem; }
}
/* === YouTube Lite (thumb → iframe 교체) === */
.yt-lite{
  position:relative;
  width:100%;
  height:100%;
  cursor:pointer;
  background:#000;
}
.yt-lite img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* 가운데 재생 버튼 */
.yt-lite::after{
  content:"▶";
  position:absolute;
  left:50%; top:50%;
  transform:translate(-50%,-50%);
  width:64px; height:64px;
  border-radius:999px;
  background:rgba(0,0,0,.55);
  color:#fff;
  font-size:28px;
  display:flex;
  align-items:center;
  justify-content:center;
  pointer-events:none;
}
.yt-lite[data-activated="1"]::after{ display:none; }

.yt-lite iframe{
  position:absolute;
  inset:0;
  width:100%;
  height:100%;
  border:0;
}
/* 🔐 로그인/관리자 영역은 무조건 한 줄 */
.left .admin-inline {
  display: inline-flex !important;
  align-items: center;
  gap: .5rem;
  white-space: nowrap;
}

.left .admin-inline a {
  display: inline !important;     /* ← 핵심 */
  white-space: nowrap;
}
#headline-strip{
  border-radius: 0 !important;
}
/* 펼쳐보기 카드 닫기 버튼 */
.news-actions{
  display:flex;
  justify-content:flex-end;
  gap:10px;
}

.news-actions .btn-close{
  padding:0.6rem 1rem;
  border-radius:10px;
  background:#f1f5f9;
  color:#111;
  border:1px solid #e5e7eb;
  font-weight:600;
  cursor:pointer;
  transition:all .15s ease;
}

.news-actions .btn-close:hover{
  background:#e5e7eb;
}
/* ✅ lazy-banner 박스 자체에 간격 부여 (로딩중/로드후 모두 동일) */
.left-banner .lazy-banner { margin-bottom: 1.5rem !important; }
.left-banner .lazy-banner:last-child { margin-bottom: 0 !important; }
.left-banner a.article-item { display:block; margin-bottom: 1.5rem; }
.left-banner a.article-item:last-of-type { margin-bottom: 0; }
.left-banner a.article-item img { margin-bottom: 0 !important; } /* 중복 마진 제거 */


/* ✅ 썸네일/영상은 무조건 가로 100% 꽉 차게 */
.center .summary-media,
.center .video-wrapper,
.center .video-wrapper.is-shorts{
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
}

/* ✅ 내부 썸네일도 박스에 꽉 차게 */
.center .yt-lite,
.center .yt-lite img{
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
}
/* ✅ 쇼츠: 세로(9:16) 유지 + 폭을 "폰 화면" 정도로 제한(가운데 정렬) */
/* 쇼츠 컨테이너: 9:16 + 폭 500(센터) */
.center .video-wrapper.is-shorts{
  aspect-ratio: 9 / 16 !important;
  width: min(500px, 100%) !important;
  margin: 0 auto !important;
  overflow: hidden !important;
  border-radius: 8px;
  background: #000;
}

/* ✅ 핵심: 내부를 높이 100%로 채우기 */
.center .video-wrapper.is-shorts .yt-lite{
  width: 100% !important;
  height: 100% !important;
}

/* ✅ 핵심: img도 height 100% + cover */
.center .video-wrapper.is-shorts .yt-lite img{
  width: 100% !important;
  height: 100% !important;
  display: block !important;
  object-fit: cover !important;
}
/* ✅ 로그인/회원가입은 한 줄로 */
.left .auth-inline { 
  display: inline-flex !important;
  align-items: center;
  gap: .6rem;
  white-space: nowrap;
}

.left .auth-inline a{
  display: inline !important;   /* .left a{display:block} 덮어씀 */
  white-space: nowrap;
}
/* ✅ 카드 제목: 노멀/호버 모두 "무광" (글로우 0) */
.center details.news-card.news-expand > summary.news-summary h2 span,
.center .news-card h2 a{
  position:relative !important;
  display:inline-block !important;
  font-weight:800 !important;
  letter-spacing:-0.2px !important;

  /* 기본은 거의 검정(가독성), 색은 살짝만 */
  color:#111 !important;
  -webkit-text-fill-color: initial !important;
  background:none !important;
  text-shadow:none !important;

  transition: transform .14s ease, color .14s ease, opacity .14s ease !important;
}

/* ✅ 밑줄(평소엔 0, 호버 시만 나타남) */
.center details.news-card.news-expand > summary.news-summary h2 span::after,
.center .news-card h2 a::after{
  content:"" !important;
  position:absolute !important;
  left:0 !important;
  right:0 !important;
  bottom:-6px !important;
  height:2px !important;

  background:linear-gradient(90deg,#16a34a 0%, #3b82f6 100%) !important;
  transform:scaleX(0) !important;
  transform-origin:left center !important;
  opacity:.0 !important;

  border-radius:999px !important;
  transition: transform .16s ease, opacity .16s ease !important;
}

/* ✅ hover: 1px만 살짝 + 색만 미세하게 + 밑줄만 */
.center details.news-card.news-expand > summary.news-summary:hover h2 span,
.center .news-card:hover h2 a{
  transform:translateY(-1px) !important;
  color:#0f172a !important;       /* 아주 미세하게 더 진하게 */
}

.center details.news-card.news-expand > summary.news-summary:hover h2 span::after,
.center .news-card:hover h2 a::after{
  transform:scaleX(1) !important;
  opacity:.85 !important;
}

/* =========================
   ✅ SSR 쇼츠(처음 10개) 썸네일 잘림/검정하부 해결
   - 전역 width:100% / margin:0 덮어쓰기 무력화
   ========================= */

/* 쇼츠 래퍼: 폰폭 + 중앙정렬 복원 */
.center details.news-card.news-expand .video-wrapper.is-shorts{
  width: min(500px, 100%) !important;
  max-width: 500px !important;
  margin: 0.75rem auto 0.25rem !important;
  aspect-ratio: 9 / 16 !important;
  background:#000 !important;
  overflow:hidden !important;
  border-radius: 8px !important;
}

/* 내부 썸네일 박스는 래퍼 높이를 정확히 물려받게 */
.center details.news-card.news-expand .video-wrapper.is-shorts .yt-lite{
  position:relative !important;
  width:100% !important;
  height:100% !important;
}

/* ✅ 핵심: SSR 쇼츠 썸네일은 contain(전체가 보이게) */
.center details.news-card.news-expand .video-wrapper.is-shorts .yt-lite img{
  position:absolute !important;
  inset:0 !important;
  width:100% !important;
  height:100% !important;
  object-fit: contain !important;     /* ✅ 잘림 방지 */
  object-position: center !important;
  background:#000 !important;
}
/* =========================
   ✅ 펼쳐보기 본문: 테이블/표가 잘리거나 안 보이는 문제 해결
   ========================= */

/* 열려 있을 때는 카드 자체 overflow 숨김을 해제 */
.center details.news-card.news-expand[open]{
  overflow: visible !important;
}
.center details.news-card.news-expand[open] .news-expanded{
  overflow: visible !important;
}

/* 본문 영역은 테이블이 넘치면 가로 스크롤 */
.center details.news-card.news-expand .news-full{
  overflow-x: auto !important;
  -webkit-overflow-scrolling: touch;
}

/* 테이블 기본 스타일(안 보이는 문제 대부분 해결) */
.center details.news-card.news-expand .news-full table{
  width: 100% !important;
  border-collapse: collapse !important;
  border-spacing: 0 !important;
  background: #fff !important;
}

/* 셀 테두리/패딩 */
.center details.news-card.news-expand .news-full th,
.center details.news-card.news-expand .news-full td{
  border: 1px solid #e5e7eb !important;
  padding: 10px 12px !important;
  vertical-align: top;
  font-size: 0.95rem;
  line-height: 1.45;
}

/* 헤더 강조 */
.center details.news-card.news-expand .news-full th{
  background: #f8fafc !important;
  font-weight: 700;
}

/* 표 안의 이미지도 깨지지 않게 */
.center details.news-card.news-expand .news-full table img{
  max-width: 100% !important;
  height: auto !important;
}







/* ===== C안: Paper + Typography ===== */
:root{ --bg:#fbfaf7; --card:#fffdfa; --border:rgba(0,0,0,.06); --ink:#1f2937; }

body{ background: var(--bg) !important; }

.center,.left,.right{ background: transparent !important; box-shadow:none !important; }

.center .news-card,
.pf-wrap,
.coupang-strip-wrap,
.shop-strip-wrap{
  background: var(--card) !important;
  border:1px solid var(--border) !important;
  box-shadow:none !important;
  border-radius:10px !important;
}

.pf-wrap .pf-title,
#shop-strip .shop-strip-title,
#clients-strip .coupang-strip-title,
#coupang-strip .coupang-strip-title,
.consult-title{
  background:none !important;
  -webkit-text-fill-color:initial !important;
  color: var(--ink) !important;
  text-shadow:none !important;
  animation:none !important;
}
.pf-wrap .pf-title::after,
#shop-strip .shop-strip-title::after,
#clients-strip .coupang-strip-title::after,
#coupang-strip .coupang-strip-title::after,
.consult-title::after,
.consult-title::before{ display:none !important; }



/* ✅ 핵심 키워드 섹션 숨김 */
.right .kw-head,
.right .kw-controls,
.right #kwDiscover,
.right #kwTree,
.right #kwChips {
  display: none !important;
}

/* 키워드 섹션이 차지하던 위 여백도 정리 */
.right .kw-head { margin: 0 !important; padding: 0 !important; border: 0 !important; }












/* =========================================================
   CHIHO 모아보기 (TOP) : #headline-strip CSS FULL REPLACE
   - 모바일 사진 크기 고정(16:9) + 탭 전환해도 동일
   - 이미지/카드 모서리: 둥글게 X (각지게)
   - 데스크탑 2열, 모바일 1열 유지
   ========================================================= */

/* 0) 모듈 범위 안전장치 */
#headline-strip,
#headline-strip *{
  box-sizing: border-box;
}

/* 1) strip 자체: 최상단 플랫 */
#headline-strip{
  margin: 0 !important;
  border-radius: 0 !important;
  border-left: 0 !important;
  border-right: 0 !important;
  border-top: 0 !important;
  width: 100%;
  max-width: 100%;
}

/* 2) 헤더(제목 + 네비) */
#headline-strip .pf-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  padding: 12px 12px 8px;
}

#headline-strip .pf-title{
  font-weight: 800;
  letter-spacing: -0.2px;
  line-height: 1.2;
}

/* 네비 버튼(모바일에서도 동일 UX) */
#headline-strip .pf-actions{
  display:flex;
  align-items:center;
  gap:8px;
}
#headline-strip .pf-actions .pf-navbtn{
  width: 36px;
  height: 36px;
  padding: 0;
  border:1px solid rgba(0,0,0,.10);
  background:#fff;
  border-radius: 10px;
  cursor:pointer;
  line-height:1;
  display:flex;
  align-items:center;
  justify-content:center;
}
#headline-strip .pf-actions .pf-navbtn:disabled{
  opacity:.45;
  cursor:not-allowed;
}

/* 3) 태그 칩 바(가로 스크롤) */
#headline-strip .headline-tagbar{
  display:flex;
  gap:8px;
  padding: 0 12px 10px;
  overflow-x:auto;
   flex-wrap: wrap !important;         /* ✅ 줄바꿈 허용 */
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
#headline-strip .headline-tagbar::-webkit-scrollbar{ display:none; }

#headline-strip .tag-chip{
  border:1px solid rgba(0,0,0,.10);
  background:#fff;
  border-radius:999px; /* 칩은 기존대로 pill 유지 */
  padding: 6px 10px;
  font-size:.85rem;
  cursor:pointer;
  white-space:nowrap;
}
#headline-strip .tag-chip.active{
  background:#111;
  color:#fff;
  border-color:#111;
}

/* 4) 스크롤러(슬라이드) */
#headline-strip #headlineScroller.pf-scroller{
  display:flex;
  gap:12px;
  padding: 0 12px 12px;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
  scroll-snap-type:x mandatory;
  scroll-padding:12px;
  scrollbar-width:none;
  width: 100%;
  max-width: 100%;
}

#headline-strip .headline-tagbar .tag-chip{
  white-space: nowrap !important;     /* 칩 내부 텍스트는 한줄 유지 */
}
#headline-strip #headlineScroller::-webkit-scrollbar{ display:none; }

#headline-strip .headline-slide{
  flex: 0 0 100%;
  min-width: 100%;
  scroll-snap-align: start;
}

/* 5) 패널: 데스크탑 2열 / 모바일 1열 */
#headline-strip .tag-panel{
  display:grid;
  grid-template-columns: 1.05fr 0.95fr;
  gap:12px;
  width:100%;
  max-width:100%;
}
@media (max-width: 860px){
  #headline-strip .tag-panel{
    grid-template-columns: 1fr;
  }
}

/* 6) Featured 카드(왼쪽) */
#headline-strip .tag-panel__left,
#headline-strip .tag-panel__right{
  min-width:0;
}

/* 카드: 둥글게 X (각) */
#headline-strip .feat-card{
  display:block;
  border:1px solid rgba(0,0,0,.06);
  border-radius: 0 !important;      /* ✅ 각지게 */
  overflow:hidden;
  background:#fff;
}

/* ✅ 핵심: 이미지 크기/비율 완전 고정(탭/태그 바뀌어도 동일) */
#headline-strip .feat-card img{
  width:100% !important;
  height:auto !important;
  aspect-ratio: 16 / 9 !important;  /* ✅ 항상 동일 높이 */
  object-fit: cover !important;
  object-position: center !important;
  display:block;
  background:#f3f4f6;
  border-radius: 0 !important;      /* ✅ 각지게 */
}

/* 혹시 다른 이미지가 strip 안에 들어와도 전부 각지게 */
#headline-strip img{
  border-radius: 0 !important;
}

/* 텍스트 영역 */
#headline-strip .feat-body{
  padding: 10px 21px 21px;
}
#headline-strip .feat-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:6px;
}
#headline-strip .feat-date{
  font-size:.82rem;
  color:#777;
  white-space:nowrap;
}
#headline-strip .feat-title{
  font-weight:900;
  letter-spacing:-.2px;
  line-height:1.25;
  font-size:1.02rem;
  color:#111;
}

/* featured empty */
#headline-strip .feat-empty{
  border:1px dashed rgba(0,0,0,.18);
  border-radius: 0 !important; /* ✅ 각지게 */
  padding:14px;
  background:#fff;
}
#headline-strip .feat-empty__title{ font-weight:900; margin-bottom:6px; }
#headline-strip .feat-empty__link{ color:#16a34a; font-weight:800; }

/* 7) 오른쪽 리스트 */
#headline-strip .tag-panel__head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:8px;
}
#headline-strip .tag-panel__tag{
  font-weight:900;
  letter-spacing:-.2px;
}
#headline-strip .tag-panel__more{
  font-size:.85rem;
  color:#16a34a;
  font-weight:800;
  padding:0;
}

#headline-strip .tag-list{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid rgba(0,0,0,.06);
}
#headline-strip .tag-li{
  display:flex;
  align-items:center;
  gap:8px;
  padding:9px 0;
  border-bottom:1px solid rgba(0,0,0,.06);
}
#headline-strip .tag-date{
  font-size:.82rem;
  color:#777;
  white-space:nowrap;
  min-width:72px;
}
#headline-strip .tag-link{
  flex:1;
  min-width:0;
  overflow:hidden;
  white-space:nowrap;
  text-overflow:ellipsis;
  text-align:left;
  padding:0;
}

/* 배지 */
#headline-strip .badge{
  font-size:.72rem;
  border-radius:999px; /* 배지는 pill 유지 */
  padding:2px 8px;
  white-space:nowrap;
  border:1px solid rgba(0,0,0,.10);
  background:#f3f4f6;
  color:#111;
}
#headline-strip .badge-blog{ background:#111; color:#fff; border-color:#111; }
#headline-strip .badge-news{ background:#eef2ff; color:#1e3a8a; border-color:#c7d2fe; }
#headline-strip .badge-side{ background:#ecfeff; color:#155e75; border-color:#a5f3fc; }

/* 8) 모바일 미세 튜닝 */
@media (max-width: 560px){
  #headline-strip .pf-head{ padding: 12px 10px 8px; }
  #headline-strip .headline-tagbar{ padding: 0 10px 10px; }
  #headline-strip #headlineScroller.pf-scroller{ padding: 0 10px 12px; }

  /* 모바일에서 네비 버튼 조금 작게 */
  #headline-strip .pf-actions .pf-navbtn{
    width:34px;
    height:34px;
    border-radius:10px;
  }

  /* 리스트 날짜 폭 조금 축소 */
  #headline-strip .tag-date{ min-width:64px; }
}
/* (선택) 이미지 로딩 중에도 높이 고정 → 레이아웃 점프 방지 */
#headline-strip .feat-card img{
  min-height: 1px;               /* 일부 브라우저 깜빡임 방지 */
}

/* (선택) 왼쪽 featured 카드가 너무 길어질 때도 안정 */
#headline-strip .feat-card{
  contain: layout paint;         /* 레이아웃 영향 최소화 */
}
/* 모바일에서는 모아보기 리스트를 8개만 노출 */
@media (max-width: 880px){
  #headline-strip .tag-list .tag-li:nth-child(n+9){
    display: none !important;
  }
}
@media (max-width: 768px){
  #headline-strip .headline-tagbar{
    flex-wrap: nowrap !important;     /* ✅ 1행 고정 */
    overflow-x: auto !important;      /* ✅ 가로 스크롤 */
    overflow-y: hidden !important;
    -webkit-overflow-scrolling: touch;
  }
}

/* ✅ 모아보기 리스트 관리자 버튼(관리자만) */
#headline-strip .tag-li{ align-items:center; }
#headline-strip .tag-admin{
  display:inline-flex;
  gap:6px;
  margin-left:8px;
  flex: 0 0 auto;
}
#headline-strip .tag-edit,
#headline-strip .tag-del{
  font-size:.78rem;
  padding:4px 8px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:8px;
  background:#fff;
  color:#111;
  line-height:1;
  cursor:pointer;
}
#headline-strip .tag-del-form{ display:inline; margin:0; }


/* ================================
   모아보기 오른쪽 리스트 노출 개수
   - 모바일/태블릿: 8개
   - 노트북(<=1366): 9개
   - 데스크탑(>1366): 14개(제한 없음)
   ================================ */
/* 
@media (max-width: 3000px){
  #headline-strip .tag-list .tag-li:nth-child(n+1){
    display: none !important;
  }
}


@media (max-width: 880px){
  #headline-strip .tag-list .tag-li:nth-child(n+9){
    display: none !important;
  }
}


@media (min-width: 881px) and (max-width: 1366px){
  #headline-strip .tag-list .tag-li:nth-child(n+10){
    display: none !important;
  }
}
*/
/* 모아보기 오른쪽 리스트 상단: 페이지 표시 */
#headline-strip .tag-panel__head-right{
  display:flex;
  align-items:center;
  gap:10px;
}

#headline-strip .tag-panel__page{
  font-size:.82rem;
  color:#666;
  font-variant-numeric: tabular-nums;
  border:1px solid rgba(0,0,0,.10);
  background:#fff;
  padding:4px 8px;
  border-radius:999px;
  line-height:1;
  white-space:nowrap;
}


/* ✅ 태그별 리스트 페이징용 */
#headline-strip .tag-li.is-hidden{ display:none !important; }

#headline-strip .tag-list-pager{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:8px;
  margin: 0 0 8px;
}

#headline-strip .tag-page-info{
  font-size:.82rem;
  color:#666;
  border:1px solid rgba(0,0,0,.10);
  background:#fff;
  padding:4px 8px;
  border-radius:999px;
  font-variant-numeric: tabular-nums;
  white-space:nowrap;
}

#headline-strip .tag-page-btn{
  font-size:.82rem;
  padding:4px 8px;
  border:1px solid rgba(0,0,0,.12);
  border-radius:8px;
  background:#fff;
  cursor:pointer;
  line-height:1;
}
#headline-strip .tag-page-btn.active{
  background:#111;
  color:#fff;
  border-color:#111;
}
#headline-strip .tag-page-btn:disabled{
  opacity:.45;
  cursor:not-allowed;
}
/* ✅ headline-strip: 기존 nth-child 강제숨김 무력화 + 페이징용 클래스만 사용 */
#headline-strip .tag-list .tag-li:not(.is-hidden){
  display:flex !important;           /* nth-child보다 우선되도록 :not()로 특이성 올림 */
}
#headline-strip .tag-list .tag-li.is-hidden{
  display:none !important;
}

/* 헤더: 왼쪽 태그 / 오른쪽 페이저 한 줄 */
#headline-strip .tag-panel__head{
  display:flex !important;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  flex-wrap:nowrap;
}

#headline-strip .tag-panel__tag{
  font-weight:900;
  letter-spacing:-.2px;
  white-space:nowrap;
}

#headline-strip .tag-panel__tag.is-tag{ color:#16a34a; }  /* ✅ 태그는 초록 */
#headline-strip .tag-panel__tag.is-all{ color:#16a34a; }     /* 전체보기는 검정(원하면 초록으로 바꿔도 됨) */

#headline-strip .tag-panel__head-right{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:nowrap;
  white-space:nowrap;
}

/* 페이저가 들어갈 자리 */
#headline-strip .tag-head-pager{
  display:flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
}
#headline-strip .tag-page-numbers{
  display:flex;
  align-items:center;
  gap:6px;
  flex-wrap:nowrap;   /* ✅ 줄바꿈 금지 */
}
#headline-strip .tag-page-ellipsis{
  color:#9aa0a6;
  padding:0 2px;
  user-select:none;
}
#headline-strip .tag-panel__more{
  white-space:nowrap;
}
/* ==============================
   1행 카드 8개 (가로 스크롤)
   ============================== */
#naver-row8{
  display:flex !important;
  gap:10px !important;
  padding:10px 12px !important;

  overflow-x:auto !important;
  overflow-y:hidden !important;
  -webkit-overflow-scrolling:touch;

  white-space:nowrap;
  scroll-snap-type:x mandatory;
  scrollbar-width:none;             /* Firefox */
}
#naver-row8::-webkit-scrollbar{ display:none; }  /* Chrome */

/* 카드 */
#naver-row8 .ncard{
  flex:0 0 auto !important;
  width:160px;                      /* ✅ 작게 */
  border:1px solid rgba(0,0,0,.08);
  background:#fff;
  text-decoration:none;
  color:#111;
  scroll-snap-align:start;
  overflow:hidden;
}

/* 썸네일: 작고 고정 비율 */
#naver-row8 .thumb{
  aspect-ratio: 16 / 9;
  background:#f3f4f6;
}
#naver-row8 .thumb img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* 제목: 2줄만 */
#naver-row8 .t{
  padding:7px 8px;
  font-size:12px;
  line-height:1.25;
  font-weight:700;

  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
  overflow:hidden;
}
/* ✅ summary 우측 상단 닫기 버튼(열렸을 때만) */
.center details.news-card.news-expand .expand-hint{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:10px;
}

/* 닫기 버튼(상단) */
.center details.news-card.news-expand .btn-close-top{
  display:none;               /* 기본 숨김 */
  padding:0.45rem 0.8rem;
  border-radius:10px;
  background:#f1f5f9;
  color:#111;
  border:1px solid #e5e7eb;
  font-weight:600;
  cursor:pointer;
  transition:all .15s ease;
}
.center details.news-card.news-expand .btn-close-top:hover{
  background:#e5e7eb;
}

/* ✅ 열렸을 때만 상단 닫기 표시 */
.center details.news-card.news-expand[open] .btn-close-top{
  display:inline-flex;
}
/* =========================================================
   #headline-strip 태그칩 글로우 (FULL)
   - JS에서 해당 키워드 버튼에: .tag-glow + glow-xxx 클래스를 붙이면 적용
   ========================================================= */

/* ✅ 글로우 기본(팔레트 지정 안 해도 안전하게) */
#headline-strip .tag-chip.tag-glow{
  --g-rgb: 34,197,94;               /* fallback: green */
  position:relative;
  isolation:isolate;                 /* pseudo 레이어 안정화 */
  font-weight:800;
  border-color: rgb(var(--g-rgb)) !important;
  color: rgb(var(--g-rgb)) !important;
  box-shadow:
    0 0 0 7px rgba(var(--g-rgb), .14),
    0 10px 22px rgba(0,0,0,.06);
  transition: transform .18s ease, filter .18s ease, box-shadow .18s ease;
}

/* ✅ 후광(바깥 빛) */
#headline-strip .tag-chip.tag-glow::after{
  content:"";
  position:absolute;
  inset:-10px;
  border-radius:999px;
  background: radial-gradient(circle, rgba(var(--g-rgb), .40) 0%, rgba(var(--g-rgb), 0) 70%);
  filter: blur(10px);
  opacity:.90;
  z-index:-1;
  pointer-events:none;
}

/* ✅ 호버: 살짝 띄우고 더 선명 */
#headline-strip .tag-chip.tag-glow:hover{
  transform: translateY(-1px);
  filter: brightness(1.08) saturate(1.15);
  box-shadow:
    0 0 0 9px rgba(var(--g-rgb), .16),
    0 14px 28px rgba(0,0,0,.08);
}

/* ✅ active(선택된 칩)도 해당 색으로 유지 */
#headline-strip .tag-chip.tag-glow.active{
  background: rgb(var(--g-rgb)) !important;
  border-color: rgb(var(--g-rgb)) !important;
  color:#fff !important;
}
#headline-strip .tag-chip.tag-glow.active::after{
  opacity:1;
}

/* (선택) 은은한 펄스 */
@keyframes chipGlowPulse{
  0%,100%{ opacity:.70; filter: blur(10px); }
  50%    { opacity:1.00; filter: blur(12px); }
}
#headline-strip .tag-chip.tag-glow::after{
  animation: chipGlowPulse 2.8s ease-in-out infinite;
}
@media (prefers-reduced-motion: reduce){
  #headline-strip .tag-chip.tag-glow::after{ animation:none; }
}

/* =========================================================
   ✅ 팔레트 (원하는 것만 골라 쓰면 됨)
   ========================================================= */
#headline-strip .tag-chip.glow-emerald { --g-rgb: 16,185,129; }  /* #10b981 */
#headline-strip .tag-chip.glow-teal    { --g-rgb: 20,184,166; }  /* #14b8a6 */
#headline-strip .tag-chip.glow-cyan    { --g-rgb: 6,182,212; }   /* #06b6d4 */
#headline-strip .tag-chip.glow-sky     { --g-rgb: 14,165,233; }  /* #0ea5e9 */
#headline-strip .tag-chip.glow-blue    { --g-rgb: 59,130,246; }  /* #3b82f6 */
#headline-strip .tag-chip.glow-indigo  { --g-rgb: 99,102,241; }  /* #6366f1 */
#headline-strip .tag-chip.glow-violet  { --g-rgb: 139,92,246; }  /* #8b5cf6 */
#headline-strip .tag-chip.glow-purple  { --g-rgb: 168,85,247; }  /* #a855f7 */
#headline-strip .tag-chip.glow-fuchsia { --g-rgb: 217,70,239; }  /* #d946ef */
#headline-strip .tag-chip.glow-pink    { --g-rgb: 236,72,153; }  /* #ec4899 */
#headline-strip .tag-chip.glow-rose    { --g-rgb: 244,63,94; }   /* #f43f5e */
#headline-strip .tag-chip.glow-red     { --g-rgb: 239,68,68; }   /* #ef4444 */
#headline-strip .tag-chip.glow-orange  { --g-rgb: 249,115,22; }  /* #f97316 */
#headline-strip .tag-chip.glow-amber   { --g-rgb: 245,158,11; }  /* #f59e0b */
#headline-strip .tag-chip.glow-yellow  { --g-rgb: 234,179,8; }   /* #eab308 */
#headline-strip .tag-chip.glow-lime    { --g-rgb: 132,204,22; }  /* #84cc16 */
#headline-strip .tag-chip.glow-green   { --g-rgb: 34,197,94; }   /* #22c55e */
#headline-strip .tag-chip.glow-slate   { --g-rgb: 100,116,139; } /* #64748b */
#headline-strip .tag-chip.glow-gray    { --g-rgb: 107,114,128; } /* #6b7280 */
#headline-strip .tag-chip.glow-black   { --g-rgb: 17,24,39; }    /* #111827 */

/* ✅ 태그칩(글로우) 상단 잘림 방지: tagbar에 위/아래 여유 주기 */
#headline-strip .headline-tagbar{
  padding: 12px 12px 14px !important;   /* 기존 0 12px 10px → 상단 추가 */
  overflow-y: visible !important;        /* 그림자/후광 잘림 방지 */
}
@media (max-width:768px){
  #headline-strip .headline-tagbar{
    padding: 12px 10px 14px !important;
    overflow-y: visible !important;
  }
}
/* ===============================
   NEWSROOM 펼쳐보기 본문: ul/ol을 article처럼(수직 정렬) 고정
   - 전역 li{display:flex} 때문에 목록이 깨지는 문제 복구
   =============================== */
.center details.news-card.news-expand .news-full ul,
.center details.news-card.news-expand .news-full ol{
  padding-left: 1.1rem !important;
  margin: 0.75rem 0 0.95rem !important;
  list-style-position: outside !important;

  /* 혹시 columns 계열이 어디서든 걸리면 무력화 */
  column-count: 1 !important;
  column-width: auto !important;
}

.center details.news-card.news-expand .news-full li{
  display: list-item !important;   /* ✅ 마커(점/숫자) 복구 */
  padding: 0 !important;
  margin: 0.35rem 0 !important;

  /* 전역 flex 흔적 제거 */
  align-items: initial !important;
  gap: 0 !important;

  font-size: inherit !important;
  line-height: 1.7 !important;
}

.center details.news-card.news-expand .news-full img{
  display:block !important;
  margin: 1.2rem auto !important;

  /* ✅ 기본: 중앙정렬 + 보기 좋은 최대폭 */
  width: min(100%, 760px) !important;
  max-height: none !important;     
  /* ✅ 데스크탑 최소 폭 */
  min-width: 400px !important;

  height: auto !important;
}
.mobile-admin-inline{display:none;}

@media (max-width:1024px){
  .mobile-admin-inline{
    display:flex !important;
    align-items:center;
    gap:.45rem;
    flex-wrap:wrap;
    padding:.55rem 1rem;
    background:rgba(255,255,255,0.85);
    backdrop-filter:blur(6px);
    border-bottom:1px solid #e5e7eb;
    font-size:.85rem;
  }

  .mobile-admin-inline a,
  .mobile-admin-inline span,
  .mobile-admin-inline strong{
    color:#333;
    white-space:nowrap;
    text-decoration:none;
  }

  .mobile-admin-inline a:hover{
    color:#16a34a;
  }

  .mobile-admin-inline .join-link{
    color:#16a34a;
    font-weight:600;
  }
}

/* 모바일(화면이 400px보다 좁으면) 오버플로 방지 */
@media (max-width: 420px){
  .center details.news-card.news-expand .news-full img{
    min-width: 0 !important;
    width: 100% !important;
  }
}


/* ===============================
   CHIHO MP4 대표미디어 / 카드 썸네일
   =============================== */
.center .summary-media .video-wrap.thumb-video{
  width:100%;
  max-width:100%;
  margin:0 auto;
  background:#000;
  overflow:hidden;
}
.center .summary-media .video-wrap.thumb-video video{
  display:block;
  width:100%;
  max-width:100%;
  aspect-ratio:16 / 9;
  object-fit:contain;
  background:#000;
}
#headline-strip .feat-card video{
  width:100%;
  height:auto;
  aspect-ratio:16 / 9;
  object-fit:contain;
  object-position:center;
  display:block;
  background:#000;
  border-radius:0;
}
#headline-strip .feat-card .video-wrap.thumb-video{
  width:100%;
  max-width:100%;
  background:#000;
  overflow:hidden;
}



/* ===== extracted style block 5 ===== */

/* =========================================================
   CHIHO Ferrari Editorial Skin
   - 기능/JS 유지
   - 상단만 near-black cinematic hero
   - 하단 3단 본문은 흰색 기반 유지
   ========================================================= */
:root{
  --chiho-f-red:#da291c;
  --chiho-f-red-active:#b01e0a;
  --chiho-f-canvas:#181818;
  --chiho-f-elevated:#303030;
  --chiho-f-ink:#ffffff;
  --chiho-f-muted:#969696;
  --chiho-f-line:#303030;
  --chiho-light:#ffffff;
  --chiho-light-soft:#f7f7f7;
  --chiho-line-light:#d2d2d2;
  --chiho-line-soft:#ebebeb;
  --chiho-text:#181818;
}
html,body{
  font-family:'Pretendard Variable', Pretendard, -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif !important;
  background:#fca800 !important;
  color:var(--chiho-text) !important;
  overflow-x:hidden;
}
.chiho-ferrari-top-zone{
  background:white !important;
  color:var(--chiho-f-ink) !important;
  overflow:hidden;
  isolation:isolate;
}
.chiho-ferrari-top-zone *,
.chiho-ferrari-top-zone *::before,
.chiho-ferrari-top-zone *::after{box-sizing:border-box;}
.chiho-ferrari-top-zone a{color:inherit;text-decoration:none;}
.chiho-ferrari-top-zone img{max-width:100%;}

/* top nav */
.chiho-ferrari-top-zone .topbar{
  position:sticky;
  top:0;
  z-index:80;
  min-height:64px;
  padding:0 48px !important;
  background:rgba(24,24,24,.92) !important;
  color:#fff !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
  backdrop-filter:blur(16px);
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  gap:8px !important;
  flex-wrap:nowrap !important;
}
.chiho-ferrari-top-zone .topbar::before{
  content:"";
  position:absolute;
  left:24px;
  top:50%;
  transform:translateY(-50%);
  width:10px;
  height:34px;
  background:var(--chiho-f-red);
}

.chiho-ferrari-top-zone .topbar::after{
  display:none !important;
}
.chiho-ferrari-top-zone .topbar::after{
  content:"";
  position:absolute;
  left:24px;
  top:50%;
  transform:translateY(-50%);
  width:10px;
  height:34px;
  background:var(--chiho-f-red);
}
.chiho-ferrari-top-zone .topbar a{
  color:#fff !important;
  padding:23px 12px !important;
  font-size:12px !important;
  font-weight:800 !important;
  line-height:1 !important;
  letter-spacing:.7px !important;
  text-transform:uppercase;
  opacity:.86;
  white-space:nowrap;
}
.chiho-ferrari-top-zone .topbar a:hover{opacity:1;color:#fff !important;}
.chiho-ferrari-top-zone .topbar a::after{
  bottom:14px !important;
  height:2px !important;
  background:var(--chiho-f-red) !important;
}
.chiho-ferrari-top-zone .topbar-search input{
  height:38px;
  background:#202020 !important;
  border:1px solid rgba(255,255,255,.18) !important;
  border-radius:0 !important;
  color:#fff !important;
}
.chiho-ferrari-top-zone .mobile-admin-inline{
  background:#ffffff !important;
  color:#fff !important;
  border-bottom:1px solid rgba(255,255,255,.12) !important;
}
.chiho-ferrari-top-zone .mobile-admin-inline a,
.chiho-ferrari-top-zone .mobile-admin-inline span,
.chiho-ferrari-top-zone .mobile-admin-inline strong{color:#fff !important;}
.chiho-ferrari-top-zone .mobile-admin-inline .join-link{color:var(--chiho-f-red) !important;}

/* cinematic hero */
.chiho-cinema-hero{
  position:relative;
  min-height:clamp(540px,76vh,880px);
  background:var(--chiho-f-canvas);
  color:#fff;
  overflow:hidden;
}
.chiho-cinema-hero__media{
  position:absolute;
  inset:0;
  z-index:0;
  background:linear-gradient(135deg,#181818,#050505);
}
.chiho-cinema-hero__media img,
.chiho-cinema-hero__media video{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  opacity:.56;
  filter:saturate(.95) contrast(1.08);
}
.chiho-cinema-hero__media::after{
  content:"";
  position:absolute;
  inset:0;
  background:
    linear-gradient(90deg, rgba(24,24,24,.96) 0%, rgba(24,24,24,.72) 34%, rgba(24,24,24,.20) 66%, rgba(24,24,24,.82) 100%),
    linear-gradient(180deg, rgba(24,24,24,.08) 0%, rgba(24,24,24,.94) 100%);
}
.chiho-cinema-hero__fallback{
  width:100%;height:100%;
  background:radial-gradient(circle at 74% 20%, rgba(218,41,28,.38), transparent 30%), linear-gradient(135deg,#181818,#050505 70%);
}
.chiho-cinema-hero__inner{
  position:relative;
  z-index:1;
  min-height:inherit;
  width:min(1760px,100%);
  margin:0 auto;
  padding:96px 48px 64px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 400px;
  gap:48px;
  align-items:end;
}
.chiho-kicker{
  display:inline-flex;
  align-items:center;
  gap:10px;
  margin-bottom:22px;
  color:#d8d8d8;
  font-size:11px;
  font-weight:900;
  letter-spacing:1.3px;
  text-transform:uppercase;
}
.chiho-kicker::before{content:"";width:44px;height:2px;background:var(--chiho-f-red);}
.chiho-cinema-hero h1{
  margin:0;
  max-width:960px;
  color:#fff;
  font-size:clamp(48px,7vw,108px);
  line-height:.96;
  font-weight:600;
  letter-spacing:-.065em;
  text-transform:uppercase;
}
.chiho-cinema-hero__lead{
  max-width:700px;
  margin:28px 0 0;
  color:#c8c8c8;
  font-size:clamp(15px,1.15vw,19px);
  line-height:1.75;
  word-break:keep-all;
}
.chiho-cinema-hero__actions{display:flex;flex-wrap:wrap;gap:12px;margin-top:34px;}
.chiho-f-cta{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:48px;
  padding:0 32px;
  border-radius:0 !important;
  font-size:12px;
  font-weight:900;
  letter-spacing:1.35px;
  text-transform:uppercase;
}
.chiho-f-cta--primary{background:var(--chiho-f-red);border:1px solid var(--chiho-f-red);color:#fff !important;}
.chiho-f-cta--outline{background:transparent;border:1px solid rgba(255,255,255,.72);color:#fff !important;}
.chiho-cinema-hero__side{
  align-self:end;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(24,24,24,.62);
  backdrop-filter:blur(16px);
  padding:24px;
}
.chiho-stat-grid{display:grid;grid-template-columns:repeat(3,1fr);border:1px solid rgba(255,255,255,.12);border-right:0;}
.chiho-stat{min-width:0;padding:18px 12px;border-right:1px solid rgba(255,255,255,.12);}
.chiho-stat b{display:block;color:#fff;font-size:32px;line-height:1;font-weight:900;letter-spacing:-.05em;}
.chiho-stat span{display:block;margin-top:9px;color:#969696;font-size:10px;letter-spacing:1.1px;text-transform:uppercase;}
.chiho-cinema-hero__latest{margin-top:20px;padding-top:18px;border-top:1px solid rgba(255,255,255,.14);}
.chiho-cinema-hero__latest small{display:block;color:#969696;font-size:11px;letter-spacing:1.1px;text-transform:uppercase;margin-bottom:10px;}
.chiho-cinema-hero__latest a{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:#fff !important;font-size:16px;line-height:1.45;font-weight:850;word-break:keep-all;}
.chiho-scroll-cue{position:absolute;z-index:2;right:48px;bottom:26px;color:#969696;font-size:10px;letter-spacing:1.4px;text-transform:uppercase;}
.chiho-scroll-cue::after{content:"";display:inline-block;width:42px;height:1px;margin-left:12px;vertical-align:middle;background:var(--chiho-f-red);}

/* bridge */
.chiho-bridge{background:#fff;color:black;border-bottom:1px solid var(--chiho-line-light);padding:32px 32px 0;}
.chiho-bridge__inner{max-width:1760px;margin:0 auto;display:grid;grid-template-columns:1.3fr repeat(4,1fr);gap:1px;background:var(--chiho-line-light);border-top:4px solid var(--chiho-f-red);}
.chiho-bridge__intro,.chiho-bridge__card{background:#fff;min-height:128px;padding:24px;color:var(--chiho-text);text-decoration:none;}
.chiho-bridge__intro span{display:block;margin-bottom:12px;color:var(--chiho-f-red);font-size:11px;font-weight:900;letter-spacing:1.6px;text-transform:uppercase;}
.chiho-bridge__intro strong{display:block;max-width:460px;font-size:24px;font-weight:700;line-height:1.2;letter-spacing:-.04em;}
.chiho-bridge__card{display:flex;flex-direction:column;justify-content:space-between;transition:background .18s ease,color .18s ease;}
.chiho-bridge__card em{font-style:normal;color:var(--chiho-f-red);font-size:12px;font-weight:900;letter-spacing:1px;}
.chiho-bridge__card b{display:block;font-size:18px;font-weight:800;letter-spacing:-.02em;}
.chiho-bridge__card small{display:block;color:#666;font-size:12px;line-height:1.45;}
.chiho-bridge__card:hover{background:var(--chiho-text);color:#fff !important;}
.chiho-bridge__card:hover small{color:#c9c9c9;}

/* top naver rail / headline strip as light editorial */
.chiho-ferrari-top-zone #naver-row8{
  background:#f7f7f7 !important;
  border-top:1px solid #d2d2d2;
  border-bottom:1px solid #d2d2d2;
  padding:22px 48px 12px !important;
  gap:12px !important;
}
.chiho-ferrari-top-zone #naver-row8 .ncard{
  width:190px !important;
  background:#fff !important;
  border:1px solid #d2d2d2 !important;
  color:#181818 !important;
  border-radius:0 !important;
}
.chiho-ferrari-top-zone #naver-row8 .thumb{background:#eee !important;}
.chiho-ferrari-top-zone #naver-row8 .thumb img{object-fit:cover !important;border-radius:0 !important;}
.chiho-ferrari-top-zone #naver-row8 .t{color:#181818 !important;font-size:12px !important;font-weight:800 !important;line-height:1.3 !important;}

.chiho-ferrari-top-zone #headline-strip{
  max-width:1760px;
  margin:32px auto 0 !important;
  padding:24px !important;
  background:#fff !important;
  color:#181818 !important;
  border:1px solid #d2d2d2 !important;
  border-radius:0 !important;
  box-shadow:none !important;
}
.chiho-ferrari-top-zone #headline-strip .pf-head{display:grid !important;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:start;padding:0 0 20px !important;margin:0 !important;border-bottom:1px solid #ebebeb;}
.chiho-ferrari-top-zone #headline-strip .pf-title{background:none !important;-webkit-text-fill-color:initial !important;color:#181818 !important;text-shadow:none !important;animation:none !important;font-size:34px !important;font-weight:700 !important;line-height:1.05 !important;letter-spacing:-.055em !important;}
.chiho-ferrari-top-zone #headline-strip .pf-title::after{display:none !important;}
.chiho-ferrari-top-zone #headline-strip .pf-navbtn{width:48px !important;height:48px !important;border-radius:0 !important;background:#181818 !important;color:#fff !important;border:1px solid #181818 !important;font-weight:900;}
.chiho-ferrari-top-zone #headline-strip .pf-navbtn:not(:disabled):hover{background:var(--chiho-f-red) !important;border-color:var(--chiho-f-red) !important;}
.chiho-ferrari-top-zone #headline-strip .headline-tagbar{padding:18px 0 18px !important;gap:8px !important;border-bottom:1px solid #ebebeb;}
.chiho-ferrari-top-zone #headline-strip .tag-chip{border-radius:0 !important;border:1px solid #d2d2d2 !important;background:#fff !important;color:#181818 !important;font-size:12px !important;font-weight:800;box-shadow:none !important;}
.chiho-ferrari-top-zone #headline-strip .tag-chip.active{background:var(--chiho-f-red) !important;border-color:var(--chiho-f-red) !important;color:#fff !important;}
.chiho-ferrari-top-zone #headline-strip #headlineScroller.pf-scroller{padding:24px 0 0 !important;}
.chiho-ferrari-top-zone #headline-strip .tag-panel{grid-template-columns:minmax(420px,.95fr) minmax(0,1.05fr) !important;gap:32px !important;}
.chiho-ferrari-top-zone #headline-strip .feat-card,
.chiho-ferrari-top-zone #headline-strip .feat-empty{border-radius:0 !important;border:1px solid #d2d2d2 !important;background:#fff !important;color:#181818 !important;}
.chiho-ferrari-top-zone #headline-strip .feat-card img,
.chiho-ferrari-top-zone #headline-strip .feat-card video{width:100% !important;height:auto !important;aspect-ratio:16/9 !important;object-fit:cover !important;border-radius:0 !important;background:#000 !important;}
.chiho-ferrari-top-zone #headline-strip .feat-body{padding:18px !important;}
.chiho-ferrari-top-zone #headline-strip .feat-title{font-size:20px !important;line-height:1.25 !important;font-weight:800 !important;color:#181818 !important;}
.chiho-ferrari-top-zone #headline-strip .tag-panel__head{padding-bottom:12px;border-bottom:2px solid #181818;}
.chiho-ferrari-top-zone #headline-strip .tag-panel__tag{color:var(--chiho-f-red) !important;font-size:14px;font-weight:900;text-transform:uppercase;letter-spacing:.04em;}
.chiho-ferrari-top-zone #headline-strip .tag-list{border-top:0 !important;}
.chiho-ferrari-top-zone #headline-strip .tag-li{padding:10px 0 !important;border-bottom:1px solid #ebebeb !important;}
.chiho-ferrari-top-zone #headline-strip .tag-link{white-space:nowrap !important;overflow:hidden !important;text-overflow:ellipsis !important;color:#181818 !important;}
.chiho-ferrari-top-zone #headline-strip .badge{border-radius:0 !important;font-size:10px !important;letter-spacing:.08em;text-transform:uppercase;}
.chiho-ferrari-top-zone #headline-strip .badge-blog{background:#181818 !important;color:#fff !important;border-color:#181818 !important;}
.chiho-ferrari-top-zone #headline-strip .badge-news,
.chiho-ferrari-top-zone #headline-strip .badge-side{background:#fff !important;color:#181818 !important;border-color:#d2d2d2 !important;}
.chiho-ferrari-top-zone #headline-strip .tag-page-btn,
.chiho-ferrari-top-zone #headline-strip .tag-page-info{border-radius:0 !important;}
.chiho-ferrari-top-zone #headline-strip .tag-page-btn.active{background:var(--chiho-f-red) !important;border-color:var(--chiho-f-red) !important;color:#fff !important;}

/* lower 3-column remains functionally same but cleaner */
body > .container{
  width:100% !important;
  max-width:none !important;
  margin:40px 0 96px !important;
  padding:0 !important;
  display:grid !important;
  grid-template-columns:500px minmax(0,1fr) 400px !important;
  gap:32px !important;
  background:#fff !important;
}
body > .container > .left,
body > .container > .right{background:#f7f7f7 !important;border:1px solid #d2d2d2 !important;box-shadow:none !important;min-width:0 !important;}
body > .container > .left{width:500px !important;}
body > .container > .right{width:400px !important;}
body > .container > .center{width:100% !important;max-width:none !important;min-width:0 !important;background:transparent !important;box-shadow:none !important;overflow:visible !important;}
body > .container .news-card,
body > .container .ad-card,
body > .container .pf-wrap,
body > .container .coupang-strip-wrap,
body > .container .shop-strip-wrap{border-radius:0 !important;border:1px solid #d2d2d2 !important;background:#fff !important;box-shadow:none !important;}
body > .container .filter-tabs{padding:16px !important;background:#fff !important;border:1px solid #d2d2d2 !important;margin:0 0 32px !important;}
body > .container .filter-tabs button{height:44px !important;border-radius:0 !important;background:#181818 !important;border:1px solid #181818 !important;color:#fff !important;font-size:12px !important;font-weight:900 !important;letter-spacing:.08em;text-transform:uppercase;box-shadow:none !important;}
body > .container .filter-tabs button.active,
body > .container .filter-tabs button:hover{background:var(--chiho-f-red) !important;border-color:var(--chiho-f-red) !important;transform:none !important;}
body > .container h3,
body > .container .blog-title,
body > .container .section-title{border-top:2px solid #181818 !important;border-bottom:0 !important;color:#181818 !important;font-size:12px !important;font-weight:900 !important;text-transform:uppercase;letter-spacing:1.2px;}
body > .container .left ul li,
body > .container .right p{border-bottom:1px solid #ebebeb !important;}
body > .container .left a,
body > .container .right a{color:#181818 !important;}
body > .container .left a:hover,
body > .container .right a:hover{color:var(--chiho-f-red) !important;}
body > .container .card-image,
body > .container .card-banner img,
body > .container .summary-media img,
body > .container .summary-media video{border-radius:0 !important;}
body > .container .btn-detail,
body > .container .btn-cta{border-radius:0 !important;background:var(--chiho-f-red) !important;border-color:var(--chiho-f-red) !important;color:#fff !important;text-transform:uppercase;letter-spacing:.08em;}
body > .container .btn-close,
body > .container .btn-close-top{border-radius:0 !important;background:#fff !important;border:1px solid #d2d2d2 !important;color:#181818 !important;}

@media(max-width:1280px){
  .chiho-cinema-hero__inner{grid-template-columns:1fr;padding:82px 28px 56px;}
  .chiho-cinema-hero__side{max-width:540px;}
  .chiho-ferrari-top-zone #headline-strip{max-width:calc(100vw - 48px) !important;}
  .chiho-ferrari-top-zone #headline-strip .tag-panel{grid-template-columns:1fr !important;}
  body > .container{grid-template-columns:minmax(260px,360px) minmax(0,1fr) minmax(260px,320px) !important;gap:24px !important;padding:0 24px !important;}
  body > .container > .left, body > .container > .right{width:auto !important;}
}
@media(max-width:980px){
  .chiho-bridge{padding:24px 16px 0;}
  .chiho-bridge__inner{max-width:100%;grid-template-columns:1fr 1fr;}
  .chiho-bridge__intro{grid-column:1 / -1;}
  body > .container{display:block !important;margin-top:24px !important;padding:0 16px !important;}
  body > .container > .left, body > .container > .right{display:none !important;}
  body > .container > .center{width:100% !important;}
}
@media(max-width:768px){
  .chiho-ferrari-top-zone .topbar{min-height:auto;padding:12px 14px !important;justify-content:flex-start !important;overflow-x:auto;}
  .chiho-ferrari-top-zone .topbar::before,
  .chiho-ferrari-top-zone .topbar::after{display:none;}
  .chiho-ferrari-top-zone .topbar a{padding:9px 10px !important;}
  .chiho-cinema-hero{min-height:620px;}
  .chiho-cinema-hero__inner{padding:74px 18px 52px;}
  .chiho-cinema-hero h1{font-size:clamp(42px,13vw,72px);}
  .chiho-cinema-hero__lead{font-size:14px;line-height:1.7;}
  .chiho-cinema-hero__actions{gap:8px;}
  .chiho-f-cta{min-height:44px;padding:0 18px;font-size:11px;}
  .chiho-cinema-hero__side{padding:16px;}
  .chiho-stat b{font-size:24px;}
  .chiho-scroll-cue{right:18px;}
  .chiho-ferrari-top-zone #naver-row8{padding:12px 14px !important;}
  .chiho-ferrari-top-zone #naver-row8 .ncard{width:156px !important;}
  .chiho-ferrari-top-zone #headline-strip{max-width:calc(100vw - 28px) !important;margin-top:22px !important;padding:18px !important;}
  .chiho-ferrari-top-zone #headline-strip .pf-head{grid-template-columns:1fr !important;}
  .chiho-ferrari-top-zone #headline-strip .pf-title{font-size:26px !important;}
  .chiho-bridge__inner{grid-template-columns:1fr;}
  .chiho-bridge__intro,.chiho-bridge__card{min-height:auto;padding:18px;}
}
/* ✅ 상단 썸네일 카드: 데스크탑 8개 고정 + 중앙 정렬 */
@media (min-width: 981px){
  .chiho-ferrari-top-zone #naver-row8{
    display: grid !important;
    grid-template-columns: repeat(8, 190px) !important;
    justify-content: center !important;
    gap: 12px !important;
    overflow: hidden !important;
  }

  .chiho-ferrari-top-zone #naver-row8 .ncard{
    width: 190px !important;
  }

  .chiho-ferrari-top-zone #naver-row8 .ncard:nth-child(n+9){
    display: none !important;
  }
}

@media(max-width:768px){
  .chiho-ferrari-top-zone .mobile-admin-inline{
    display:flex !important;
    background:#fff !important;
    color:#181818 !important;
    border-bottom:1px solid #d2d2d2 !important;
  }

  .chiho-ferrari-top-zone .mobile-admin-inline a,
  .chiho-ferrari-top-zone .mobile-admin-inline span,
  .chiho-ferrari-top-zone .mobile-admin-inline strong{
    color:#181818 !important;
  }

  .chiho-ferrari-top-zone .mobile-admin-inline .join-link{
    color:#da291c !important;
    font-weight:800 !important;
  }
}
/* 모바일 버튼 크기 최종 보정 */
@media (max-width:768px){
  .article-ferrari-btn,
  .chiho-f-cta,
  .admin-action-button,
  .comment-btn,
  .btn-detail,
  .btn-close,
  .btn-close-top,
  .tag-page-btn,
  .pf-navbtn,
  .coupang-nav button,
  .shop-nav,
  .cta-head-btn{
    min-height:40px !important;
    height:40px !important;
    padding:0 14px !important;
    font-size:11px !important;
    line-height:1 !important;
    display:inline-flex !important;
    align-items:center !important;
    justify-content:center !important;
    border-radius:0 !important;
    white-space:nowrap !important;
  }

  .article-ferrari-hero__actions,
  .chiho-cinema-hero__actions,
  .news-actions,
  .admin-toolbar,
  .cta-actions{
    gap:8px !important;
    flex-wrap:wrap !important;
  }

  .pf-navbtn,
  .coupang-nav button,
  .shop-nav,
  .cta-head-btn{
    width:40px !important;
    min-width:40px !important;
    padding:0 !important;
  }
}

@media (max-width:420px){
  .article-ferrari-btn,
  .chiho-f-cta,
  .btn-detail,
  .btn-close{
    min-height:38px !important;
    height:38px !important;
    padding:0 11px !important;
    font-size:10px !important;
  }
}
@media(max-width:768px){
  .chiho-ferrari-top-zone #headline-strip .pf-navbtn,
  #headline-strip .pf-actions .pf-navbtn{
    width:32px !important;
    height:32px !important;
    min-width:32px !important;
    min-height:32px !important;
    padding:0 !important;
    font-size:10px !important;
    line-height:1 !important;
  }

  .chiho-ferrari-top-zone #headline-strip .pf-actions{
    gap:6px !important;
    justify-content:flex-end !important;
  }

  .chiho-ferrari-top-zone #headline-strip .pf-head{
    gap:12px !important;
    padding-bottom:14px !important;
  }
}

@media(max-width:420px){
  .chiho-ferrari-top-zone #headline-strip .pf-navbtn,
  #headline-strip .pf-actions .pf-navbtn{
    width:30px !important;
    height:30px !important;
    min-width:30px !important;
    min-height:30px !important;
    font-size:9px !important;
  }
}
html, body{
  background:
    repeating-linear-gradient(
      135deg,
      #f5a400 0px,
      #f5a400 10px,
      #eda000 10px,
      #eda000 20px,
      #ffbd28 20px,
      #ffbd28 21px,
      #d88900 21px,
      #d88900 22px
    ) !important;
}

/* 노란 배경 위에 고급 광택 레이어 */
body::before{
  content:"";
  position:fixed;
  inset:0;
  pointer-events:none;
  z-index:-1;
  background:
    radial-gradient(circle at 20% 10%, rgba(255,255,255,.35), transparent 28%),
    linear-gradient(90deg, rgba(255,255,255,.18), transparent 35%, rgba(0,0,0,.08));
}

/* 콘텐츠 영역은 흰색 유지 */
.chiho-ferrari-top-zone,
body > .container{
  background:#fff !important;
}
/* ✅ 유튜브 재생 후 검은 구름/오버레이 제거 */
.yt-lite[data-activated="1"]::after,
.yt-lite[data-activated="1"]::before {
  display: none !important;
  content: none !important;
}

.yt-lite iframe {
  position: absolute !important;
  inset: 0 !important;
  z-index: 5 !important;
  width: 100% !important;
  height: 100% !important;
  background: #000 !important;
}

.yt-lite[data-activated="1"] img {
  display: none !important;
}

/* =========================================================
   ✅ YouTube Clean Player Final Override
   - yt-lite 오버레이를 더 이상 사용하지 않음
   - iframe 위에 검은 레이어/가상요소/필터가 절대 올라오지 않게 고정
   ========================================================= */
.youtube-clean-media,
.youtube-clean-wrapper,
.center .summary-media.youtube-clean-media,
.center .summary-media .youtube-clean-wrapper{
  position: relative !important;
  z-index: 30 !important;
  isolation: isolate !important;
  background: #000 !important;
  overflow: hidden !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  transform: none !important;
}

.youtube-clean-media::before,
.youtube-clean-media::after,
.youtube-clean-wrapper::before,
.youtube-clean-wrapper::after,
.center .summary-media.youtube-clean-media::before,
.center .summary-media.youtube-clean-media::after,
.center .summary-media .youtube-clean-wrapper::before,
.center .summary-media .youtube-clean-wrapper::after{
  display: none !important;
  content: none !important;
  opacity: 0 !important;
  background: transparent !important;
  filter: none !important;
  pointer-events: none !important;
}

.youtube-clean-iframe,
.center iframe.youtube-clean-iframe,
.center .summary-media iframe.youtube-clean-iframe,
.center .video-wrapper iframe.youtube-clean-iframe{
  position: absolute !important;
  inset: 0 !important;
  z-index: 80 !important;
  display: block !important;
  width: 100% !important;
  height: 100% !important;
  border: 0 !important;
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
  background: #000 !important;
  pointer-events: auto !important;
}

.center .video-wrapper.youtube-clean-wrapper{
  aspect-ratio: 16 / 9 !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 auto !important;
  border-radius: 0 !important;
}

.center .video-wrapper.youtube-clean-wrapper.is-shorts{
  aspect-ratio: 9 / 16 !important;
  width: min(500px, 100%) !important;
  max-width: 500px !important;
  margin: 0.75rem auto 0.25rem !important;
}

/* 기존 yt-lite가 남아 있는 캐시/무한스크롤 카드 대비 */
.yt-lite[data-activated="1"],
.yt-lite[data-activated="1"] iframe{
  opacity: 1 !important;
  filter: none !important;
  mix-blend-mode: normal !important;
}
.yt-lite[data-activated="1"]::before,
.yt-lite[data-activated="1"]::after{
  display: none !important;
  content: none !important;
}
.chiho-ferrari-top-zone .topbar .chiho-logo-link{
  position:absolute !important;
  left:48px !important;
  top:50% !important;
  transform:translateY(-50%) !important;
  padding:0 !important;
  color:#fff !important;
  font-size:15px !important;
  font-weight:900 !important;
  letter-spacing:1.8px !important;
  line-height:1 !important;
  z-index:90 !important;
  opacity:1 !important;
}

.chiho-ferrari-top-zone .topbar .chiho-logo-link::after{
  display:none !important;
}
@media (max-width:768px){
  .chiho-ferrari-top-zone .topbar{
    justify-content:flex-start !important;
    gap:10px !important;
    overflow-x:auto !important;
    padding:12px 14px !important;
  }

  .chiho-ferrari-top-zone .topbar::before{
    display:none !important;
  }

  .chiho-ferrari-top-zone .topbar .chiho-logo-link{
    position:relative !important;
    left:auto !important;
    top:auto !important;
    transform:none !important;
    flex:0 0 auto !important;
    margin-right:12px !important;
    padding:9px 10px 9px 0 !important;
    font-size:14px !important;
    letter-spacing:1.4px !important;
  }

  .chiho-ferrari-top-zone .topbar .chiho-logo-link::before{
    content:"";
    display:inline-block;
    width:7px;
    height:24px;
    background:var(--chiho-f-red);
    margin-right:10px;
    vertical-align:middle;
  }

  .chiho-ferrari-top-zone .topbar a:not(.chiho-logo-link){
    flex:0 0 auto !important;
  }
}
.chiho-cinema-hero{
  min-height: calc(100svh - 64px) !important;
}

@media(max-width:768px){
  .chiho-cinema-hero{
    min-height: calc(100svh - 56px) !important;
  }
}
@media (max-width:768px){
  .chiho-ferrari-top-zone .topbar a::after{
    display:none !important;
    content:none !important;
  }
}

.hero-visitor-card{
  margin-bottom:22px;
  padding:28px 24px 30px;
  min-height:170px;
  border:1px solid rgba(255,255,255,.16);
  background:rgba(0,0,0,.22);
}

.hero-visitor-label{
  font-size:11px;
  font-weight:900;
  letter-spacing:1.2px;
  text-transform:uppercase;
  color:#aeb4bf;
  margin-bottom:14px;
}

.hero-visitor-value{
  font-size:52px;
  line-height:1;
  font-weight:900;
  letter-spacing:-.06em;
  color:#fff;
  font-variant-numeric:tabular-nums;
}

.hero-visitor-sub{
  margin-top:12px;
  font-size:13px;
  color:#bdbdbd;
}

.hero-visitor-sub .up{color:#17c964;font-weight:900;}
.hero-visitor-sub .down{color:#f13a2c;font-weight:900;}

/* =========================================================
   CHIHO HERO MP4 FADE BACKGROUND - PERFORMANCE FIX
   - /static/hero/img1.mp4 ~ img11.mp4
   - 11 videos / 5 seconds each
   - 현재 보이는 영상만 play, 나머지는 pause
   ========================================================= */

.chiho-cinema-hero__media.hero-fade-bg{
  position:absolute !important;
  inset:0 !important;
  z-index:0 !important;
  overflow:hidden !important;
  background:#111 !important;
}

.chiho-cinema-hero__media.hero-fade-bg::after{
  content:"";
  position:absolute;
  inset:0;
  z-index:5;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(0,0,0,.45) 0%, rgba(0,0,0,.18) 42%, rgba(0,0,0,.08) 70%, rgba(0,0,0,.35) 100%),
    linear-gradient(180deg, rgba(0,0,0,.05) 0%, rgba(0,0,0,.38) 100%);
}

.hero-fade-item{
  position:absolute;
  inset:0;
  z-index:1;
  opacity:0;
  transform:scale(1.02);
  transition:opacity .9s ease;
  overflow:hidden;
  pointer-events:none;
}

.hero-fade-item.is-active{
  opacity:1;
  transform:scale(1.02);
}

.hero-fade-item video{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  display:block;
  filter:saturate(.98) contrast(1.04);
  background:#111;
}

.chiho-cinema-hero__inner,
.chiho-scroll-cue{
  position:relative;
  z-index:10;
}

@media (prefers-reduced-motion: reduce){
  .hero-fade-item{
    transition:none !important;
    opacity:0 !important;
  }

  .hero-fade-item:first-child{
    opacity:1 !important;
  }
}

/* =========================================================
   ✅ MOBILE HERO / TOPZONE WIDTH FIX
   - 모바일 상단 우측 잘림, 옆으로 밀림, 내부 카드 overflow 방지
   ========================================================= */
@media (max-width: 768px){
  html,
  body{
    width:100% !important;
    max-width:100vw !important;
    overflow-x:hidden !important;
  }

  .chiho-ferrari-top-zone,
  .chiho-cinema-hero,
  .chiho-bridge,
  body > .container{
    width:100% !important;
    max-width:100vw !important;
    min-width:0 !important;
    overflow-x:hidden !important;
    box-sizing:border-box !important;
  }

  .chiho-cinema-hero{
    min-height:auto !important;
    padding:0 !important;
  }

  .chiho-cinema-hero__inner{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding:64px 16px 58px !important;
    display:grid !important;
    grid-template-columns:minmax(0, 1fr) !important;
    gap:28px !important;
    align-items:start !important;
    box-sizing:border-box !important;
  }

  .chiho-cinema-hero__main,
  .chiho-cinema-hero__side{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
  }

  .chiho-cinema-hero h1{
    max-width:100% !important;
    font-size:clamp(40px, 15vw, 68px) !important;
    line-height:.98 !important;
    letter-spacing:-.055em !important;
    overflow-wrap:anywhere !important;
  }

  .chiho-cinema-hero__lead{
    max-width:100% !important;
    font-size:14px !important;
    line-height:1.7 !important;
    word-break:keep-all !important;
    overflow-wrap:break-word !important;
  }

  .chiho-cinema-hero__side{
    padding:16px !important;
    border-left:1px solid rgba(255,255,255,.16) !important;
    border-right:1px solid rgba(255,255,255,.16) !important;
  }

  .hero-visitor-card{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    min-height:0 !important;
    padding:22px 18px 24px !important;
    margin:0 0 18px !important;
    box-sizing:border-box !important;
  }

  .hero-visitor-value{
    font-size:clamp(44px, 17vw, 64px) !important;
    letter-spacing:-.055em !important;
  }

  .hero-visitor-sub{
    font-size:12px !important;
    line-height:1.5 !important;
    overflow-wrap:anywhere !important;
  }

  .chiho-stat-grid{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    grid-template-columns:repeat(3, minmax(0, 1fr)) !important;
    box-sizing:border-box !important;
  }

  .chiho-stat{
    min-width:0 !important;
    padding:14px 8px !important;
    box-sizing:border-box !important;
  }

  .chiho-stat b{
    font-size:clamp(22px, 7vw, 30px) !important;
    letter-spacing:-.04em !important;
  }

  .chiho-stat span{
    font-size:9px !important;
    letter-spacing:.8px !important;
  }

  .chiho-cinema-hero__latest{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  .chiho-cinema-hero__latest a{
    font-size:14px !important;
    line-height:1.5 !important;
    overflow-wrap:anywhere !important;
  }

  .chiho-scroll-cue{
    left:16px !important;
    right:auto !important;
    bottom:20px !important;
    max-width:calc(100vw - 32px) !important;
    white-space:nowrap !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
  }

  .chiho-bridge{
    padding:24px 16px 0 !important;
    box-sizing:border-box !important;
  }

  .chiho-bridge__inner{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    grid-template-columns:minmax(0, 1fr) !important;
  }

  .chiho-bridge__intro,
  .chiho-bridge__card{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    padding:18px !important;
    box-sizing:border-box !important;
  }

  .chiho-bridge__intro strong{
    max-width:100% !important;
    font-size:22px !important;
    line-height:1.18 !important;
    overflow-wrap:anywhere !important;
  }

  .chiho-ferrari-top-zone #headline-strip,
  .chiho-ferrari-top-zone #naver-row8{
    width:calc(100vw - 28px) !important;
    max-width:calc(100vw - 28px) !important;
    margin-left:14px !important;
    margin-right:14px !important;
    box-sizing:border-box !important;
  }

  .chiho-ferrari-top-zone #headline-strip{
    padding:16px !important;
  }

  .chiho-ferrari-top-zone #headline-strip .tag-panel,
  .chiho-ferrari-top-zone #headline-strip .tag-panel__left,
  .chiho-ferrari-top-zone #headline-strip .tag-panel__right{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
  }

  .chiho-ferrari-top-zone #headline-strip .tag-panel__head{
    flex-wrap:wrap !important;
    align-items:flex-start !important;
  }

  .chiho-ferrari-top-zone #headline-strip .tag-panel__head-right{
    width:100% !important;
    justify-content:space-between !important;
    min-width:0 !important;
  }

  .chiho-ferrari-top-zone #headline-strip .tag-link{
    min-width:0 !important;
  }

  body > .container{
    margin:24px 0 72px !important;
    padding:0 14px !important;
    box-sizing:border-box !important;
  }
}

@media (max-width: 420px){
  .chiho-cinema-hero__inner{
    padding-left:14px !important;
    padding-right:14px !important;
  }

  .chiho-cinema-hero__side{
    padding:14px !important;
  }

  .hero-visitor-card{
    padding:20px 16px 22px !important;
  }

  .chiho-stat{
    padding:12px 6px !important;
  }
}
/* =========================================================
   MOBILE CENTER / ADS FULL WIDTH FIX
   - 모바일 센터 좌우 여백 제거
   - 광고 슬롯은 화면 전체폭 사용
   - 광고 iframe 잘림 방지
   ========================================================= */
@media (max-width: 768px){

  html,
  body{
    width:100% !important;
    max-width:100% !important;
    overflow-x:hidden !important;
  }

  .container{
    width:100% !important;
    max-width:100% !important;
    padding:0 !important;
    margin:0 !important;
    display:block !important;
  }

  .center{
    width:100% !important;
    max-width:100% !important;
    padding:0 !important;
    margin:0 !important;
    overflow:visible !important;
  }

  /* 본문 카드는 내부 패딩으로 여백 유지 */
  .center .news-card,
  .center details.news-card.news-expand{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    box-sizing:border-box !important;
  }

  .center details.news-card.news-expand > summary.news-summary,
  .center details.news-card.news-expand .news-expanded{
    padding:1rem !important;
  }

  /* 광고는 카드 여백과 무관하게 화면 전체폭 */
  .center .ad-slot,
  .center .ad-card,
  .center .ad-card.ad-filled{
    width:100vw !important;
    max-width:100vw !important;
    margin-left:calc(50% - 50vw) !important;
    margin-right:calc(50% - 50vw) !important;
    padding:0 !important;
    border:0 !important;
    border-radius:0 !important;
    box-shadow:none !important;
    background:transparent !important;
    overflow:visible !important;
    text-align:center !important;
    box-sizing:border-box !important;
  }

  .center .ad-slot .adsbygoogle,
  .center .ad-card .adsbygoogle{
    display:block !important;
    width:100% !important;
    max-width:100vw !important;
    min-width:0 !important;
    margin:0 auto !important;
    padding:0 !important;
    box-sizing:border-box !important;
    overflow:visible !important;
  }

  .center .ad-slot iframe,
  .center .ad-card iframe,
  .center .adsbygoogle iframe{
    display:block !important;
    max-width:100% !important;
    margin:0 auto !important;
  }
}
.center details.news-card.news-expand .news-full .video-wrap,
.center details.news-card.news-expand .news-full video,
.news-full .video-wrap,
.news-full video{
  display:block !important;
  margin:1.2rem auto !important;
  max-width:760px !important;
  width:100% !important;
}

.news-full .video-wrap video{
  width:100% !important;
  height:auto !important;
}



/* ===== extracted style block 6 ===== */

/* ===============================
   CHIHO LEFT/CENTER BANNER MP4 THUMB FIX
   - 좌측 썸네일 카드가 mp4 대표미디어일 때 video로 출력
   - 가운데 삽입 배너가 mp4일 때도 video로 출력
   =============================== */
.left-banner .left-thumb-video{
  width:100% !important;
  height:400px !important;
  margin-bottom:1.5rem !important;
  background:#000 !important;
  overflow:hidden !important;
  border-radius:4px !important;
}
.left-banner .left-thumb-video video{
  width:100% !important;
  height:100% !important;
  display:block !important;
  object-fit:cover !important;
  background:#000 !important;
}
.card-banner .card-banner-video{
  width:100% !important;
  margin:2rem 0 !important;
  background:#000 !important;
  overflow:hidden !important;
  border-radius:6px !important;
}
.card-banner .card-banner-video video{
  width:100% !important;
  height:auto !important;
  aspect-ratio:16 / 9 !important;
  display:block !important;
  object-fit:cover !important;
  background:#000 !important;
}



/* ===== extracted style block 7 ===== */

/* =========================================================
   CHIHO HEADLINE / FILTER MOBILE FINAL FIX
   1. headline 좌우 흰 가리개 제거
   2. 슬라이드 폭 100% 고정
   3. 페이지 번호/이전/다음 겹침 제거
   4. 최신순 필터 버튼 1줄 가로스크롤 처리
   ========================================================= */

#headline-strip::before,
#headline-strip::after,
#headline-strip.coupang-strip-wrap::before,
#headline-strip.coupang-strip-wrap::after{
  display:none !important;
  content:none !important;
}

#headline-strip,
#headline-strip *{
  box-sizing:border-box !important;
}

#headline-strip #headlineScroller.pf-scroller{
  width:100% !important;
  max-width:100% !important;
  gap:0 !important;
  scroll-padding:0 !important;
}

#headline-strip .headline-slide{
  flex:0 0 100% !important;
  width:100% !important;
  min-width:100% !important;
  max-width:100% !important;
  scroll-snap-align:start !important;
}

#headline-strip .tag-panel,
#headline-strip .tag-panel__left,
#headline-strip .tag-panel__right{
  width:100% !important;
  max-width:100% !important;
  min-width:0 !important;
}

#headline-strip .tag-head-pager{
  display:none !important;
}

#headline-strip .tag-list-pager{
  width:100% !important;
  max-width:100% !important;
  display:flex !important;
  align-items:center !important;
  justify-content:flex-start !important;
  gap:6px !important;
  margin:8px 0 10px !important;
  padding:0 0 4px !important;
  overflow-x:auto !important;
  overflow-y:hidden !important;
  white-space:nowrap !important;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}

#headline-strip .tag-list-pager::-webkit-scrollbar{
  display:none !important;
}

#headline-strip .tag-page-numbers{
  display:flex !important;
  align-items:center !important;
  gap:5px !important;
  flex:0 0 auto !important;
  flex-wrap:nowrap !important;
}

#headline-strip .tag-page-btn,
#headline-strip .tag-page-info{
  flex:0 0 auto !important;
  height:30px !important;
  min-height:30px !important;
  padding:0 8px !important;
  font-size:11px !important;
  line-height:1 !important;
  white-space:nowrap !important;
  border-radius:0 !important;
}

@media (max-width:768px){
  html,
  body{
    overflow-x:hidden !important;
  }

  .chiho-ferrari-top-zone #headline-strip{
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
    padding:14px 10px !important;
    overflow:hidden !important;
  }

  .chiho-ferrari-top-zone #headline-strip::before,
  .chiho-ferrari-top-zone #headline-strip::after,
  #headline-strip::before,
  #headline-strip::after,
  .coupang-strip-wrap::before,
  .coupang-strip-wrap::after{
    display:none !important;
    content:none !important;
  }

  #headline-strip #headlineScroller.pf-scroller{
    width:100% !important;
    max-width:100% !important;
    padding:0 !important;
    margin:0 !important;
    gap:0 !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    scroll-snap-type:x mandatory !important;
    scroll-padding:0 !important;
    -webkit-overflow-scrolling:touch;
  }

  #headline-strip .headline-slide{
    flex:0 0 100% !important;
    width:100% !important;
    min-width:100% !important;
    max-width:100% !important;
    padding:0 !important;
    margin:0 !important;
  }

  #headline-strip .headline-tagbar{
    width:100% !important;
    max-width:100% !important;
    padding:10px 0 12px !important;
    margin:0 !important;
    flex-wrap:nowrap !important;
    overflow-x:auto !important;
    overflow-y:visible !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }

  #headline-strip .headline-tagbar::-webkit-scrollbar{
    display:none !important;
  }

  #headline-strip .headline-tagbar .tag-chip{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }

  #headline-strip .tag-panel{
    display:grid !important;
    grid-template-columns:1fr !important;
    gap:14px !important;
  }

  #headline-strip .tag-panel__head{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    flex-wrap:nowrap !important;
    padding-bottom:8px !important;
  }

  #headline-strip .tag-panel__tag{
    flex:1 1 auto !important;
    min-width:0 !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
  }

  #headline-strip .tag-panel__head-right{
    flex:0 0 auto !important;
    width:auto !important;
    min-width:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
  }

  #headline-strip .tag-panel__more{
    flex:0 0 auto !important;
    white-space:nowrap !important;
  }

  #headline-strip .tag-list{
    width:100% !important;
    max-width:100% !important;
  }

  #headline-strip .tag-li{
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    display:flex !important;
    align-items:center !important;
    gap:6px !important;
  }

  #headline-strip .badge{
    flex:0 0 auto !important;
  }

  #headline-strip .tag-date{
    flex:0 0 auto !important;
    min-width:64px !important;
    font-size:11px !important;
  }

  #headline-strip .tag-link{
    flex:1 1 auto !important;
    min-width:0 !important;
    max-width:100% !important;
    overflow:hidden !important;
    white-space:nowrap !important;
    text-overflow:ellipsis !important;
  }

  #headline-strip .tag-list-pager{
    margin:8px 0 10px !important;
    padding:0 0 4px !important;
  }

  #headline-strip .tag-page-numbers{
    gap:4px !important;
  }

  #headline-strip .tag-page-btn,
  #headline-strip .tag-page-info{
    height:28px !important;
    min-height:28px !important;
    padding:0 7px !important;
    font-size:10px !important;
  }

  body > .container .filter-tabs,
  .filter-tabs{
    display:flex !important;
    flex-wrap:nowrap !important;
    justify-content:flex-start !important;
    align-items:center !important;
    gap:8px !important;
    width:100% !important;
    max-width:100% !important;
    overflow-x:auto !important;
    overflow-y:hidden !important;
    padding:10px 0 !important;
    margin:0 0 22px !important;
    border:0 !important;
    background:transparent !important;
    box-shadow:none !important;
    -webkit-overflow-scrolling:touch;
    scrollbar-width:none;
  }

  .filter-tabs::-webkit-scrollbar{
    display:none !important;
  }

  .filter-tabs a{
    flex:0 0 auto !important;
    display:block !important;
  }

  .filter-tabs button{
    flex:0 0 auto !important;
    height:38px !important;
    min-height:38px !important;
    padding:0 14px !important;
    font-size:11px !important;
    white-space:nowrap !important;
    border-radius:0 !important;
  }
}
