/*     1654195 : HTML 편집기      */
/* ============ Base ============ */
:root {
    --mx: 1480px;
    --pad: clamp(1rem, 2vw, 2rem);
    --radius: clamp(0.8rem, 1.6vw, 1.6rem);
    --shadow: 10px 10px 20px rgba(0, 0, 0, 0.06);
    --line: rgba(0, 0, 0, 0.08);
    --bg-soft: #f8fbff;
    --grad: linear-gradient(275deg, #1d6fcd, #1983c2, #419fbb);
}

.product_salt_cn * {
    color: #000;
    list-style: none;
    box-sizing: border-box;
    word-break: keep-all;
    margin: 0;
    padding: 0;
}

.product_salt_cn .inner {
    max-width: var(--mx);
    margin: 0 auto;
    padding: 0 var(--pad);
}

.product_salt_cn h1,
.product_salt_cn h2 {
    line-height: 1.35;
    word-break: keep-all;
    margin: 0;
}

.product_salt_cn h1 {
    font-size: clamp(1.6rem, 2.4vw, 2.4rem);
    text-align: center;
    margin-bottom: 0.8em;
}

.product_salt_cn h2 {
    font-size: clamp(1.25rem, 1.8vw, 1.8rem);
    margin-bottom: 0.8em;
    text-align: center;
}

.product_salt_cn p,
.product_salt_cn li {
    font-size: clamp(0.95rem, 1.05vw, 1.05rem);
    line-height: 1.9;
    word-break: keep-all;
    margin: 0;
}

.product_salt_cn section {
    margin: 0 0 clamp(3.5rem, 6vw, 6rem) 0;
}

.product_salt_cn img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: var(--radius)
}

/* ============ 1. 인트로 ============ */
.product_salt_cn .pd-intro {
    display: flex;
    gap: clamp(1rem, 5vw, 5rem);
    align-items: center
}

.product_salt_cn .pd-intro .intro-img {
    flex: 1
}

.product_salt_cn .pd-intro .intro-text {
    flex: 1
}

.product_salt_cn .pd-intro .intro-text p {
    opacity: .9
}

/* ============ 2. 특성/성질 ============ */
.product_salt_cn .pd-features {
    text-align: center
}

.product_salt_cn .features-list {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: clamp(0.8rem, 1.2vw, 1.2rem);
    margin-top: 1rem
}

.product_salt_cn .features-list li {
    background: var(--bg-soft);
    border: 1px solid var(--line);
    border-radius: var(--radius);
    padding: clamp(0.9rem, 1.4vw, 1.4rem);
    box-shadow: var(--shadow)
}

.product_salt_cn .features-list strong {
    display: block;
    margin-bottom: 0.3rem;
    font-size: clamp(1rem, 1.1vw, 1.1rem);
}

/* ============ 3. 생산 & 물류(현지) ============ */
.product_salt_cn .pd-production .prod-stats {
    display: flex;
    justify-content: center;
    gap: clamp(1rem, 1.2vw, 1.2rem);
    text-align: center;
    margin: 1.2rem 0 1.6rem
}

.product_salt_cn .pd-production .prod-stats div {
    min-width: 180px;
    aspect-ratio: 4 / 2;
    background: #fff;
    border: 1px solid var(--line);
    border-radius: var(--radius);
    box-shadow: var(--shadow);
    padding: clamp(1.2rem, 1.8vw, 1.8rem);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.product_salt_cn .pd-production .prod-stats strong {
    display: block;
    font-size: clamp(1.1rem, 1.5vw, 1.5rem);
    background: var(--grad);
    -webkit-background-clip: text;
    background-clip: text;
    color: transparent;
    margin-bottom: 0.8rem
}

.product_salt_cn .pd-production .prod-imgs {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: clamp(0.8rem, 1.2vw, 1.2rem)
}

.product_salt_cn .pd-production p {
  text-align: center;
  padding-bottom: clamp(1rem, 2vw, 2rem);
}

/* ============ 4. 수출 물류 과정 ============ */
.product_salt_cn .pd-logistics {
    text-align: center
}

.product_salt_cn .logi-steps {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 0.6rem 0.8rem;
    margin-top: 0.8rem;
    padding: 0;
    list-style: none
}

.product_salt_cn .logi-steps li {
    padding: 0.5rem 0.9rem;
    border-radius: 999px;
    background: var(--bg-soft);
    border: 1px solid var(--line);
    box-shadow: var(--shadow);
    font-size: clamp(0.85rem, 0.95vw, 0.95rem)
}

/* ============ 5. 공급 네트워크(지도) ============ */
.product_salt_cn .pd-network {
  text-align: center;
}
.product_salt_cn .pd-network .map-grid {
padding-top: clamp(1rem, 2vw, 2rem);
}



/* ============ 7. 영상 ============ */
.product_salt_cn .pd-video .video-box {
    background: #000;
    border-radius: var(--radius);
    overflow: hidden;
    box-shadow: var(--shadow)
}

.product_salt_cn .pd-video iframe {
    width: 100%;
    aspect-ratio: 16/9;
    border: 0;
    display: block
}



/* ============ 반응형 ============ */
@media (max-width:1023px) {
    .product_salt_cn .pd-intro {
        flex-direction: column
    }

    .product_salt_cn .features-list {
        grid-template-columns: repeat(3, 1fr)
    }

    .product_salt_cn .pd-production .prod-stats {
        flex-direction: column
    }

    .product_salt_cn .pd-production .prod-imgs {
        grid-template-columns: 1fr
    }

    .product_salt_cn .pd-network .map-grid {
        grid-template-columns: 1fr
    }

    .product_salt_cn .pd-products .prod-list {
        grid-template-columns: repeat(3, 1fr)
    }

    .product_salt_cn .pd-docs .docs-grid {
        grid-template-columns: repeat(3, 1fr)
    }

    .product_salt_cn .pd-uses .use-grid {
        grid-template-columns: repeat(2, 1fr)
    }
}

@media (max-width:767px) {
    .product_salt_cn .features-list {
        grid-template-columns: 1fr
    }

    .product_salt_cn .pd-products .prod-list {
        grid-template-columns: 1fr 1fr
    }

    .product_salt_cn .pd-docs .docs-grid {
        grid-template-columns: 1fr 1fr
    }

    .product_salt_cn .pd-uses .use-grid {
        grid-template-columns: 1fr
    }

    .product_salt_cn .pd-docs img {
        height: 200px
    }

    .product_salt_cn .pd-production .prod-stats div {
      aspect-ratio: unset;
    }
}


/* 4번 섹션 KPI 스타일 (pd-logistics 변형) */
.product_salt_cn .pd-logistics.kpi { text-align:center; }

.product_salt_cn .pd-logistics.kpi .kpi-head { margin-bottom: clamp(1.2rem, 2vw, 2rem); }
.product_salt_cn .pd-logistics.kpi h2 { margin:0 0 0.35rem; }
.product_salt_cn .pd-logistics.kpi .kpi-sub {
  margin:0 0 0.35rem; opacity:.9; font-weight:600;
}
.product_salt_cn .pd-logistics.kpi .kpi-quote {
  margin:0; font-style:italic; opacity:.85;
}

.product_salt_cn .pd-logistics.kpi .kpi-grid {
  display:grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(0.8rem, 1.2vw, 1.2rem);
  margin-top: clamp(1rem, 1.6vw, 1.6rem);
}

.product_salt_cn .pd-logistics.kpi .kpi-item {
  background:#fff;
  border:1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: clamp(1rem, 1.6vw, 1.6rem);
}

.product_salt_cn .pd-logistics.kpi .kpi-num {
  font-weight: 800;
  font-size: clamp(1.1rem, 1.6vw, 1.6rem);
  background: var(--grad);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
  margin-bottom: 0.35rem;
}

.product_salt_cn .pd-logistics.kpi .kpi-title {
  margin: 0 0 0.25rem;
  font-size: clamp(1rem, 1.2vw, 1.2rem);
}

.product_salt_cn .pd-logistics.kpi .kpi-desc {
  margin: 0; opacity: .85;
  font-size: clamp(0.9rem, 1.02vw, 1.02rem);
}

.product_salt_cn .pd-logistics.kpi .kpi-foot {
  margin-top: clamp(1.2rem, 2vw, 2rem);
}
.product_salt_cn .pd-logistics.kpi .kpi-foot p {
  max-width: 980px; margin: 0 auto; opacity:.9;
}

/* 반응형 */
@media (max-width:1023px){
  .product_salt_cn .pd-logistics.kpi .kpi-grid { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width:767px){
  .product_salt_cn .pd-logistics.kpi .kpi-grid { grid-template-columns: 1fr; }
}


/* 6번 섹션 : 믿을 수 있는 품질 */
.product_salt_cn .pd-quality { text-align:center; }
.product_salt_cn .pd-quality .q-head { margin-bottom: clamp(1.2rem, 2vw, 2rem); }
.product_salt_cn .pd-quality h2 { margin:0 0 0.4rem; font-size: clamp(1.25rem,1.8vw,1.8rem); }
.product_salt_cn .pd-quality .q-sub { margin:0 0 0.3rem; opacity:.9; font-weight:600; }
.product_salt_cn .pd-quality .q-quote {
  margin:0; font-style:italic; opacity:.85;
}

/* 스텝 카드 그리드 */
.product_salt_cn .qa-steps {
  display:grid;
  grid-template-columns: repeat(5, 1fr);
  gap: clamp(0.8rem, 1.2vw, 1.2rem);
  margin-top: clamp(1rem, 1.6vw, 1.6rem);
}
.product_salt_cn .qa-steps .step {
  background:#fff;
  border:1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: clamp(1rem, 1.6vw, 1.6rem);
  text-align:left;
}
.product_salt_cn .qa-steps .num {
  width: 42px; height: 42px; border-radius: 999px;
  display:flex; align-items:center; justify-content:center;
  font-weight:800; color:#fff; margin-bottom: 0.6rem;
  background: var(--grad);
}
.product_salt_cn .qa-steps h3 {
  margin: 0 0 0.35rem;
  font-size: clamp(1rem,1.2vw,1.2rem);
  line-height: 1.45;
  word-break: keep-all;
}
.product_salt_cn .qa-steps p {
  margin: 0; opacity:.9;
  font-size: clamp(0.92rem,1.02vw,1.02rem);
  line-height: 1.8;
  word-break: keep-all;
}

/* 반응형 */
@media (max-width:1023px){
  .product_salt_cn .qa-steps { grid-template-columns: repeat(2, 1fr); }
}
@media (max-width:767px){
  .product_salt_cn .qa-steps { grid-template-columns: 1fr; }
  .product_salt_cn .qa-steps .step { text-align:left; }
}


/* 8번 섹션 : 중국산 vs 국산 비교 */
.product_salt_cn .pd-compare.vs {}
.product_salt_cn .pd-compare.vs h2 {
  text-align:center; margin-bottom: clamp(1rem,1.8vw,1.8rem);
}

/* 상단 사진 2장 */
.product_salt_cn .pd-compare.vs .vs-photos {
  display:grid; grid-template-columns: 1fr 1fr;
  gap: clamp(0.8rem,1.2vw,1.2rem); justify-items:center;
  margin-bottom: clamp(1.2rem,2vw,2rem);
}
.product_salt_cn .pd-compare.vs figure { margin:0; text-align:center; }
.product_salt_cn .pd-compare.vs img {
  width: 520px; max-width: 100%; height: auto; border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.product_salt_cn .pd-compare.vs figcaption { margin-top: .4rem; opacity: .9; }

/* 비교 표 */
.product_salt_cn .pd-compare.vs .vs-table table{
  width:100%; border-collapse:collapse; background:#fff;
  border-radius: var(--radius); overflow:hidden; box-shadow: var(--shadow);
}
.product_salt_cn .pd-compare.vs .vs-table thead th{
  background:#f4f8ff; font-weight:700; text-align:center;
  padding: clamp(0.8rem,1vw,1rem); border:1px solid var(--line);
}
.product_salt_cn .pd-compare.vs .vs-table tbody th,
.product_salt_cn .pd-compare.vs .vs-table tbody td{
  border:1px solid var(--line); padding: clamp(0.8rem,1vw,1rem);
  text-align:center; line-height:1.8;
}

/* 하단 노트 */
.product_salt_cn .pd-compare.vs .vs-note{
  text-align:center; margin-top: clamp(1rem,1.6vw,1.6rem);
  opacity:.9; word-break: keep-all;
}

/* 반응형 */
@media (max-width:1023px){
  .product_salt_cn .pd-compare.vs .vs-photos{ grid-template-columns: 1fr; }
}

@media (max-width:767px){
  .product_salt_cn .pd-compare.vs .vs-table thead th,
  .product_salt_cn .pd-compare.vs .vs-table tbody th,
  .product_salt_cn .pd-compare.vs .vs-table tbody td{
    font-size: clamp(0.9rem,3.6vw,1rem);
  }
}



/* 섹션 컨테이너 */
.product_salt_cn .pd-docs-cn{ margin-top: clamp(2.5rem,6vw,6rem); }
.product_salt_cn .pd-docs-cn *{ color:#000; }

/* 그룹 */
.product_salt_cn .pd-docs-cn .docs-group + .docs-group{ margin-top: clamp(2rem,4vw,4rem); }
.product_salt_cn .pd-docs-cn .docs-title{
  margin:0 0 0.8rem; font-size: clamp(1.05rem,1.4vw,1.4rem);
}

/* 좌/우 레이아웃 */
.product_salt_cn .pd-docs-cn .docs-grid{
  display:grid; grid-template-columns: 3fr 2fr; gap: clamp(0.8rem,1.4vw,1.4rem);
  align-items:start;
}

/* 좌측: 제품 포대들(3열) */
.product_salt_cn .pd-docs-cn .docs-products{
  display:grid; grid-template-columns: repeat(3,1fr); gap: clamp(0.6rem,1vw,1rem);
}
.product_salt_cn .pd-docs-cn .docs-fig{
  margin:0; text-align:center; background:#fff; border:1px solid var(--line);
  border-radius: var(--radius); box-shadow: var(--shadow); padding: clamp(0.6rem,1vw,1rem);
}
.product_salt_cn .pd-docs-cn .docs-fig img{
  width:100%; height:auto; object-fit:contain; border-radius: var(--radius);
}
.product_salt_cn .pd-docs-cn .docs-fig figcaption{
  margin-top:.4rem; opacity:.9; font-size:.95em;
}

/* 우측: 라벨(2열) */
.product_salt_cn .pd-docs-cn .docs-labels{
  display:grid; grid-template-columns: 1fr 1fr; gap: clamp(0.6rem,1vw,1rem);
}
.product_salt_cn .pd-docs-cn .docs-labels .docs-fig img{
  width:100%; height:260px; object-fit:cover; border-radius: calc(var(--radius) * .75);
}

/* 구분선 */
.product_salt_cn .pd-docs-cn .docs-divider{
  border:0; height:1px; background: var(--line);
  margin: clamp(1.6rem,3vw,3rem) 0;
}

/* 포장 표 */
.product_salt_cn .pd-docs-cn .docs-pack{ margin-top: clamp(2rem,4vw,4rem); }
.product_salt_cn .pd-docs-cn .docs-note{
  text-align:center; margin-bottom:.6rem; color:#666;
  font-size: clamp(0.85rem,0.95vw,0.95rem);
}
.product_salt_cn .pd-docs-cn .pack-table{
  width:100%; border-collapse:collapse; background:#fff; border-radius: var(--radius);
  overflow:hidden; box-shadow: var(--shadow);
}
.product_salt_cn .pd-docs-cn .pack-table th,
.product_salt_cn .pd-docs-cn .pack-table td{
  border:1px solid var(--line); padding: clamp(0.8rem,1vw,1rem);
  text-align:center; font-size: clamp(0.9rem,1vw,1rem); line-height:1.6;
}
.product_salt_cn .pd-docs-cn .pack-table thead th{
  background:#f4f8ff; font-weight:700;
}

/* 반응형 */
@media (max-width:1023px){
  .product_salt_cn .pd-docs-cn .docs-grid{ grid-template-columns: 1fr; }
  .product_salt_cn .pd-docs-cn .docs-labels{ grid-template-columns: 1fr 1fr; }
}
@media (max-width:767px){
  .product_salt_cn .pd-docs-cn .docs-products{ grid-template-columns: 1fr 1fr; }

  .product_salt_cn .pd-docs-cn .docs-labels .docs-fig img{ height:unset; }
}


/* 10번 섹션 : 품질 관리 및 인증 */
.product_salt_cn .pd-quality-cert {
  text-align: center;
}

.product_salt_cn .pd-quality-cert h2 {
  margin-bottom: clamp(1.2rem, 2vw, 2rem);
  font-size: clamp(1.3rem, 1.8vw, 1.8rem);
}

/* 상단 박스 4개 */
.product_salt_cn .qc-boxes {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: clamp(0.8rem, 1.2vw, 1.2rem);
  margin-bottom: clamp(2rem, 4vw, 4rem);
}

.product_salt_cn .qc-item {
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: clamp(1rem, 1.6vw, 1.6rem);
  text-align: center;
}

.product_salt_cn .qc-item h3 {
  margin: 0 0 0.5rem;
  font-size: clamp(1rem, 1.2vw, 1.2rem);
}

.product_salt_cn .qc-item p {
  margin: 0;
  font-size: clamp(0.9rem, 1vw, 1rem);
  line-height: 1.7;
  opacity: .9;
  word-break: keep-all;
}

/* 하단 인증서 이미지 */
.product_salt_cn .qc-docs {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: clamp(0.8rem, 1.2vw, 1.2rem);
}

.product_salt_cn .qc-docs figure {
  margin: 0;
  text-align: center;
}

.product_salt_cn .qc-docs img {
  width: 100%;

  object-fit: cover;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}

.product_salt_cn .qc-docs figcaption {
  margin-top: .5rem;
  font-size: 0.9rem;
  opacity: .85;
}

/* 반응형 */
@media (max-width:1023px) {
  .product_salt_cn .qc-boxes { grid-template-columns: repeat(2, 1fr); }
  .product_salt_cn .qc-docs { grid-template-columns: repeat(2, 1fr); }
}

@media (max-width:767px) {

  .product_salt_cn .qc-docs img { }
}

/* 11번 섹션 : 천일염 활용 방법 */
.product_salt_cn .pd-uses-adv{
  margin-bottom: 0;
  text-align:center;
}
.product_salt_cn .pd-uses-adv h2{
  margin-bottom: clamp(1.2rem,2vw,2rem);
  font-size: clamp(1.3rem,1.8vw,1.8rem);
}

/* 카드 그리드 */
.product_salt_cn .pd-uses-adv .uses-grid{
  display:grid;
  grid-template-columns: 1fr 1fr;
  gap: clamp(0.9rem,1.4vw,1.4rem);
}

/* 카드 공통 */
.product_salt_cn .pd-uses-adv .use-card{
  position:relative;
  overflow:hidden;
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  text-align:left;
  color:#fff;
  padding: clamp(1.2rem,2vw,2rem);
  min-height: 280px;
  display:flex;
  flex-direction:column;
  justify-content:flex-start;
}
.product_salt_cn .pd-uses-adv .use-card::before{
  /* 배경 이미지 + 어둡게 오버레이 */
  content:"";
  position:absolute; inset:0;
  background-position:center; background-size:cover; background-repeat:no-repeat;
  z-index:0;
}
.product_salt_cn .pd-uses-adv .use-card::after{
  content:"";
  position:absolute; inset:0;
  background: rgba(0,0,0,0.61);
  z-index:1;
}
.product_salt_cn .pd-uses-adv .use-icon,
.product_salt_cn .pd-uses-adv .use-card h3,
.product_salt_cn .pd-uses-adv .use-card p{
  position:relative; z-index:2;
}
.product_salt_cn .pd-uses-adv .use-icon{
  width:48px; height:48px; border-radius:12px;
  display:flex; align-items:center; justify-content:center;
  font-size: 22px; font-weight:700;
  color:#00d96d; border:2px solid #00d96d;
  background: rgba(0,0,0,0.25);
  margin-bottom: .6rem;
}
.product_salt_cn .pd-uses-adv h3{
  margin:0 0 .4rem; font-size: clamp(1.05rem,1.3vw,1.3rem);
  color: #fff;
}
.product_salt_cn .pd-uses-adv p{
  margin:0; line-height:1.9; opacity:.95; word-break:keep-all;
  font-size: clamp(0.95rem,1.05vw,1.05rem);
  color: #fff;
}

/* 배경 이미지 경로 (실제 경로로 교체) */
.product_salt_cn .pd-uses-adv .bg-cook::before{
  background-image:url("/img_up/shop_pds/ehompy0649/build/option/sub_psc_img7-011755830893.jpg");
}
.product_salt_cn .pd-uses-adv .bg-industry::before{
  background-image:url("/img_up/shop_pds/ehompy0649/build/option/sub_psc_img7-021755831042.jpg");
}
.product_salt_cn .pd-uses-adv .bg-process::before{
  background-image:url("/img_up/shop_pds/ehompy0649/build/option/sub_psc_img7-031755831043.jpg");
}
.product_salt_cn .pd-uses-adv .bg-beauty::before{
  background-image:url("/img_up/shop_pds/ehompy0649/build/option/sub_psc_img7-041755831043.jpg");
}

/* 반응형 */
@media (max-width:1023px){
  .product_salt_cn .pd-uses-adv .uses-grid{ grid-template-columns: 1fr; }
  .product_salt_cn .pd-uses-adv .use-card{ min-height: 240px; }
}
@media (max-width:767px){
  .product_salt_cn .pd-uses-adv .use-icon{ width:44px; height:44px; font-size:20px; }
}