/* BASIC css start */
/* ===== [CSS Ä­] °¡ÀÚ¾ÈÀümall ¸ð¹ÙÀÏ ¸ÞÀÎ - ÀÌ ÆÄÀÏÀº "CSS" ÀԷ¶õ¿¡ ³ÖÀ¸¼¼¿ä ===== */
/* ================================================================
   °¡ÀÚ¾ÈÀümall ¸ð¹ÙÀÏ ¸ÞÀÎ (2026-08) - PC Àå¹Ù±¸´Ï(cart_v2) ÅäÅ« ±âÁØ
   ÅäÅ«: ±×¸° #438c46 / µö±×¸° #367038 / °¡°Ý #ff3c00
         ±ÛÀÚ #222 #666 #888 / ¼± #ddd #ccc / ¼ÒÇÁÆ® #f7f7f7 / ¶ó¿îµå 4px
   ================================================================ */

#header .head_inner .head_bottom ul li:first-child a{border-bottom:2px solid #000; font-weight:700;}

.gj-main{
  --ink:#222; --sub:#666; --muted:#888;
  --line:#ddd; --line2:#ccc; --soft:#f7f7f7;
  --green:#438c46; --green-d:#367038; --price:#ff3c00; --tint:#eef5ef;
  font-family:Pretendard,'Pretendard Variable',-apple-system,BlinkMacSystemFont,'Malgun Gothic','¸¼Àº °íµñ',sans-serif;
  color:var(--ink); letter-spacing:-0.01em; -webkit-font-smoothing:antialiased;
  background:#fff;
}
.gj-main *{box-sizing:border-box;}
.gj-main a{color:inherit; text-decoration:none;}

/* ---------- °øÅë ¼½¼Ç ---------- */
.section{margin-bottom:34px;}
.section *{box-sizing:border-box;}
.sec_inner{padding:0 14px;}
.item-title{
  margin:0 14px 14px; padding:0;
  font-size:17px; font-weight:800; color:var(--ink); letter-spacing:-0.02em; text-align:center;
  text-decoration:underline; text-decoration-color:var(--green);
  text-decoration-thickness:3.5px; text-underline-offset:6px;
}

/* ---------- Àαâ°Ë»ö¾î : ¿ÞÂÊ °íÁ¤ ¶óº§ + ¼øÀ§ Ĩ ---------- */
.gj-chipbar{display:flex; align-items:center; gap:10px; padding:14px 0 12px 14px; background:#fff;}
.gj-chip-label{
  flex:0 0 auto; display:inline-flex; align-items:center; gap:5px;
  padding-right:10px; border-right:1px solid #ececec;
  font-size:12px; font-weight:700; color:var(--ink); white-space:nowrap;
}
.gj-chip-label svg{color:var(--green);}
.gj-chips{
  flex:1 1 auto; min-width:0;
  display:flex; gap:6px; padding:0 14px 0 0; background:#fff;
  overflow-x:auto; -webkit-overflow-scrolling:touch; cursor:grab;
}
.gj-chips::-webkit-scrollbar{display:none;}
.gj-chips.is-drag{cursor:grabbing;}
.gj-chips.is-drag a{pointer-events:none;}
/* ¾Æ·¡ »óÇ° ÅÇ(.sec5_cate li a)°ú °°Àº ±ÔÄ¢À» ¾´´Ù - Èò ¹è°æ + ¾ãÀº Å׵θ® */
.gj-main .gj-chip,
.gj-chip{
  flex:0 0 auto; display:inline-flex; align-items:center; gap:5px;
  height:32px; padding:0 14px; border-radius:16px;
  border:1px solid var(--line2); background:#fff;
  font-size:12.5px; font-weight:600; color:var(--sub); white-space:nowrap;
}
.gj-chip i{font-style:normal; font-weight:800; color:var(--green); font-size:12px; margin-right:1px;}
.gj-chip:active{border-color:var(--muted); color:var(--ink); background:#fafbfc;}

/* ---------- ½Å·Ú ½ºÆ®¸³ ---------- */
.gj-trust{
  min-height:38px; padding:9px 12px; background:#fff;
  border-top:1px solid #f0f0f0; border-bottom:1px solid #f0f0f0;
  display:flex; align-items:center; justify-content:center; flex-wrap:wrap;
  gap:2px 6px; font-size:11.5px; color:var(--sub); font-weight:500;
  text-align:center; line-height:1.5;
}
.gj-trust svg{color:var(--green); flex:0 0 auto;}
.gj-trust i{font-style:normal; color:#d5dcd6;}
/* ¸Þ½ÃÁö´Â Ç×»ó µÑ° ÁÙ·Î ³»·Á Æø¿¡ »ó°ü¾øÀÌ °°Àº ¸ð¾çÀ» À¯Áö */
.gj-trust b{flex:0 0 100%; margin-top:2px; color:var(--green); font-weight:700; white-space:nowrap;}
/* '´çÀÏÃâ°í' ´Â »óÇ° ¾ÆÀÌÄÜÀ» °¡¸®Å°´Â ¸»À̶ó ¹îÁöó·³ º¸ÀÌ°Ô */
.gj-trust b em{
  font-style:normal; display:inline-block; padding:1px 6px; margin-right:3px;
  background:var(--green); color:#fff; border-radius:3px; font-size:10.5px; font-weight:800;
}

/* ---------- sec1 : À̺¥Æ® ¹è³Ê ---------- */
#sec1{margin-top:16px; margin-bottom:28px; padding:0 14px;}
#sec1 .swiper{position:relative; border-radius:4px; overflow:hidden;}
#sec1 .swiper-wrapper{display:flex; margin:0; padding:0; list-style:none;}
#sec1 .swiper-slide{flex:0 0 100%; width:100%; max-width:100%;}
#sec1 .swiper-slide a{display:block; width:100%;}
#sec1 .swiper-slide img{width:100%; display:block;}
#sec1 .swiper-pagination{
  position:absolute; right:10px; bottom:10px; left:auto; width:auto; z-index:5;
  background:rgba(20,30,22,.55); color:#fff; font-size:11px; border-radius:12px; padding:3px 10px;
}

/* ---------- sec2 : Ä«Å×°í¸® ¾ÆÀÌÄÜ ---------- */
#sec2{margin-bottom:30px;}
#sec2 .sec_inner{padding:0;}
.slider-wrapper{overflow:hidden; width:100%; background:#fff; padding:18px 0 4px;}
.slider-track{display:flex; transition:transform .3s ease; width:max-content;}
.slider-page{display:flex; flex-wrap:wrap; width:100vw; max-width:850px; flex-shrink:0; margin:0; padding:0; list-style:none;}
.slider-page li{width:20%; box-sizing:border-box; padding:0 2px 12px; list-style:none; text-align:center;}
.slider-page li a{display:block;}
.slider-page li img{width:46px; height:46px; object-fit:contain; display:block; margin:0 auto 6px;}
.slider-page li p{font-size:11px; line-height:1.25; color:var(--ink); margin:0; word-break:keep-all;}
.dot-pagination{position:relative; display:flex; justify-content:center; gap:6px; margin-top:10px; text-align:center;}
.sec3_prd .dot-pagination,
.sec5_prd .dot-pagination{margin-top:18px;}
.dot-pagination .dot,
.dot-pagination span{
  display:inline-block; width:7px; height:7px; background:#d0d0d0;
  border-radius:10px; margin:0 3px; transition:all .3s ease;
}
.dot-pagination .dot.active,
.dot-pagination .swiper-pagination-bullet-active{width:20px; background:var(--green);}

/* ---------- ºê·£µå°ü (¿øÇü / Å׵θ® ¾øÀ½) ---------- */
/* ºê·£µå°¡ 30°³¶ó 2ÁÙ·Î ¹èÄ¡ÇÏ°í °¡·Î·Î ¹Ð¾î¼­ º»´Ù */
.gj-brand-scroll{
  display:grid; grid-auto-flow:column; grid-template-rows:repeat(2,auto); grid-auto-columns:72px;
  gap:18px 10px; overflow-x:auto; padding:8px 14px 12px;
  -webkit-overflow-scrolling:touch; cursor:grab;
}
.gj-brand-scroll::-webkit-scrollbar{display:none;}
.gj-brand-scroll.is-drag{cursor:grabbing;}
.gj-brand-scroll.is-drag a{pointer-events:none;}
.gj-brand{
  display:flex; flex-direction:column; align-items:center; gap:8px;
  font-size:11px; color:var(--ink); width:72px;
}
.gj-brand-mark{
  width:72px; height:72px; border-radius:50%; border:0; background:#fff;
  box-shadow:0 1px 7px rgba(20,40,25,.13);
  display:flex; align-items:center; justify-content:center; overflow:hidden;
}
/* ºê·£µå¸ô°ú °°Àº ·Î°í(177x50, Èò ¹è°æ ¡¤ Å׵θ® ¾øÀ½)¸¦ ¾²¹Ç·Î Àß¶ó³¾ ÇÊ¿ä°¡ ¾ø´Ù. */
.gj-brand-mark img{
  max-width:58px; max-height:20px; width:auto; height:auto; display:block;
}
.gj-brand-name{display:block; width:100%; text-align:center; white-space:nowrap; overflow:hidden; text-overflow:ellipsis;}
.gj-brand-all .gj-brand-mark{background:var(--tint); box-shadow:none; color:var(--green-d); font-weight:800; font-size:12px;}

/* ---------- »óÇ° ÅÇ (sec3 / sec5 °øÅë) ---------- */
:is(#sec3,.sec5) :is(.sec3_cate,.sec5_cate){
  margin:0 0 16px; padding:0 14px; overflow-x:auto; overflow-y:hidden;
  -webkit-overflow-scrolling:touch; cursor:grab;
}
:is(#sec3,.sec5) :is(.sec3_cate,.sec5_cate)::-webkit-scrollbar{display:none;}
:is(#sec3,.sec5) :is(.sec3_cate,.sec5_cate).is-drag{cursor:grabbing;}
:is(#sec3,.sec5) :is(.sec3_cate,.sec5_cate).is-drag a{pointer-events:none;}
:is(#sec3,.sec5) :is(.sec3_cate,.sec5_cate) ul{display:flex; margin:0; padding:0 4px 0 0; list-style:none; width:max-content;}
:is(#sec3,.sec5) :is(.sec3_cate,.sec5_cate) ul li{display:inline-block; width:auto !important; margin-right:6px; list-style:none;}
:is(#sec3,.sec5) :is(.sec3_cate,.sec5_cate) ul li a{
  display:block; height:32px; line-height:30px; padding:0 14px;
  background:#fff; border:1px solid var(--line2); border-radius:16px;
  text-align:center; color:var(--sub); font-size:12.5px; font-weight:600;
  white-space:nowrap; transition:all .12s;
}
:is(#sec3,.sec5) :is(.sec3_cate,.sec5_cate) ul li.on>a{color:#fff; background:var(--green); border-color:var(--green);}

:is(#sec3,.sec5) :is(.sec3_prd,.sec5_prd)>div{display:none; position:relative; opacity:0; transition:opacity .35s;}
:is(#sec3,.sec5) :is(.sec3_prd,.sec5_prd)>div.show{display:block;}
:is(#sec3,.sec5) :is(.sec3_prd,.sec5_prd)>div.act{opacity:1;}
/* ¡Ú ¾ÈÀüÀåÄ¡ : JS °¡ ¾È µ¹¾Æµµ ù ÅÇ »óÇ°Àº º¸ÀÌ°Ô ÇÑ´Ù.
   (JS °¡ Á¤»ó µ¿ÀÛÇÏ¸é ¼½¼Ç¿¡ .gj-tabs-on ÀÌ ºÙ¾î ÀÌ ±ÔÄ¢ÀÌ ²¨Áø´Ù) */
:is(#sec3,.sec5):not(.gj-tabs-on) :is(.sec3_prd,.sec5_prd)>div:first-child{display:block; opacity:1;}

/* ---------- »óÇ° Ä«µå (3¿­) ----------
   flex + calc ´Â ¼Ò¼öÁ¡ ¹Ý¿Ã¸² ¶§¹®¿¡ 3¹ø° Ä«µå°¡ ´ÙÀ½ ÁÙ·Î ¹Ð¸®´Â ÀÏÀÌ ÀÖ¾î
   grid ·Î °íÁ¤ÇÑ´Ù. ½ºÅ² ±âº» CSS ÀÇ .item_list{width:calc(...)} µµ ¹«·ÂÈ­. */
.item_cont{
  display:grid !important; grid-template-columns:repeat(3,minmax(0,1fr)) !important;
  gap:20px 10px; margin:0; padding:0; list-style:none;
}
.item_cont::before,.item_cont::after{display:none !important; content:none !important;}
.item_cont .item_list{
  width:auto !important; max-width:none !important; min-width:0; float:none !important;
  margin:0; padding:0; list-style:none;
  display:flex; flex-direction:column; text-align:left; position:relative;
}
.item_cont .item_list .tumb,
.item_cont .item_list .thumb{
  display:block; width:100%; aspect-ratio:1/1; overflow:hidden;
  border:1px solid var(--line); border-radius:4px; background:var(--soft); position:relative;
}
.item_cont .item_list .tumb a{display:block; width:100%; height:100%;}
.item_cont .item_list .tumb img{width:100%; height:100%; object-fit:cover; display:block;}
.item_cont .item_list .info{padding:8px 1px 0;}
.item_cont .item_list .info_link{display:block; color:inherit;}
.item_cont .item_list .prdname{
  margin:0; font-size:12.5px; line-height:1.4; color:var(--ink); font-weight:500;
  display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden;
}
.item_cont .item_list .prdetc{
  margin:3px 0 0; font-size:11px; line-height:1.35; color:var(--muted);
  display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; overflow:hidden;
}
.item_cont .item_list .prdprice{margin:6px 0 0; font-size:14px; font-weight:800; color:var(--ink); line-height:1.25;}
.item_cont .item_list .prdprice .price{font-size:14px; font-weight:800; color:var(--ink);}
.item_cont .item_list .prdprice .percent{color:var(--price); font-weight:800; margin-right:4px; font-size:12.5px;}
.item_cont .item_list .prdprice strike{display:block; font-size:11px; color:#9aa39b; font-weight:400; margin-top:1px;}
.item_cont .item_list .prdprice .soldout{font-size:13px; font-weight:700; color:var(--muted);}
.item_cont .item_list .prdreview{margin:4px 0 0; font-size:11px; color:var(--muted); display:flex; gap:6px; flex-wrap:wrap;}
.item_cont .item_list .prdreview:empty{display:none;}
.item_cont .item_list .prdreview .score{color:var(--green); font-weight:700;}
.item_cont .item_list .prdreview img{height:11px; vertical-align:middle;}

/* ¼½¼Ç ³»ºÎ ½½¶óÀ̵å */
.sec5_swiper,.sec3_swiper{overflow:hidden;}
.sec5_swiper .swiper-wrapper,
.sec3_swiper .swiper-wrapper{display:flex;}
.sec5_swiper .swiper-slide,
.sec3_swiper .swiper-slide{flex:0 0 100%; width:100%;}

/* ---------- sec6 : ¶óÀÎ ¹è³Ê ---------- */
#sec6 .sec_inner a{display:block; width:100%;}
#sec6 .sec_inner a img{width:100%; display:block; border-radius:4px;}

/* ---------- ÇýÅÃ ---------- */
.gj-benefit{margin:0 14px; border:1px solid var(--line); border-radius:4px; overflow:hidden; background:#fff;}
.gj-benefit-row{display:flex; align-items:center; gap:12px; padding:14px 14px;}
.gj-benefit-row+.gj-benefit-row{border-top:1px solid #eee;}
.gj-benefit-ico{
  width:36px; height:36px; border-radius:4px; background:var(--tint);
  display:flex; align-items:center; justify-content:center; flex:0 0 auto; color:var(--green);
}
.gj-benefit-row p{margin:0; font-size:13px; line-height:1.5; color:var(--ink);}
.gj-benefit-row p b{font-weight:700;}
.gj-benefit-row p span{font-size:11.5px; color:var(--muted);}

/* ---------- Æ÷Å丮ºä ---------- */
.gj-reviewbanner{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  margin:0 14px; padding:16px 14px; background:var(--tint); border-radius:4px;
}
.gj-reviewbanner strong{display:block; font-size:14.5px; font-weight:800; color:var(--green-d); letter-spacing:-0.3px;}
.gj-reviewbanner p{margin:5px 0 0; font-size:12px; color:#5e6b60;}

/* ---------- B2B ---------- */
.gj-b2b{margin:0 14px 34px; padding:18px 16px; background:var(--tint); border-radius:4px;}
.gj-b2b strong{display:block; font-size:15px; font-weight:800; color:var(--green-d); letter-spacing:-0.3px;}
.gj-b2b p{margin:7px 0 14px; font-size:12px; color:#5e6b60; line-height:1.6;}
.gj-b2b-btns{display:flex; gap:8px;}
.gj-btn-fill{
  flex:1; height:50px; background:var(--green); color:#fff; border-radius:4px;
  display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:800;
}
.gj-btn-line{
  flex:1; height:50px; background:#fff; border:1px solid var(--green); color:var(--green);
  border-radius:4px; display:flex; align-items:center; justify-content:center; font-size:14px; font-weight:700;
}

/* ---------- °í°´¼¾ÅÍ ---------- */
.gj-cs{display:grid; grid-template-columns:repeat(3,1fr); gap:8px; padding:0 14px;}
.gj-cs a{
  border:1px solid var(--line); border-radius:4px; padding:14px 6px; background:#fff;
  display:flex; flex-direction:column; align-items:center; gap:6px; text-align:center;
}
.gj-cs strong{font-size:12.5px; font-weight:700; color:var(--ink);}
.gj-cs span{font-size:11px; color:var(--muted);}
.gj-cs-hours{margin:12px 14px 0; font-size:11.5px; color:var(--muted); text-align:center; line-height:1.6;}

/* ---------- ³ÐÀº È­¸é (½ºÅ² ÄÁÅ×ÀÌ³Ê ÃÖ´ë 850px) ---------- */
@media screen and (min-width:560px){
  /* ¡Ú ÅÂºí¸´¿¡¼­µµ 3¿­ À¯Áö : ÇÑ ½½¶óÀ̵å 6°³ = 3¿­ x 2ÁÙ ·Î µü ¸Â°Ô ä¿öÁü
        (4¿­·Î µÎ¸é 6°³°¡ 4+2 ·Î ¾î±ß³ª º¸ÀÓ) */
  .item_cont{grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:24px 14px;}
  .slider-page li{width:10%;}
  .item_cont .item_list .prdname{font-size:13px;}
}
@media screen and (min-width:760px){
  .sec_inner{padding:0 20px;}
  #sec1{padding:0 20px;}
  .item-title,.gj-benefit,.gj-reviewbanner,.gj-b2b{margin-left:20px; margin-right:20px;}
  .gj-chipbar{padding-left:20px;}
  .gj-brand-scroll,.gj-cs{padding-left:20px; padding-right:20px;}
  :is(#sec3,.sec5) :is(.sec3_cate,.sec5_cate){padding-left:20px; padding-right:20px;}
}

/* ================= ½ÃÁð»óÇ° : Á¦¸ñ ºí·Ï¿¡¸¸ ¹è°æ À̹ÌÁö =================
   ¡Ú À̹ÌÁö ÁÖ¼Ò´Â ¾Æ·¡ background-image ÀÇ url() ÇÑ °÷¸¸ ¹Ù²Ù¸é µË´Ï´Ù.
     ¿¶Àº Á¤µµ´Â ::before ÀÇ rgba(255,255,255,.62) °ªÀ¸·Î Á¶ÀýÇÕ´Ï´Ù. */
.gj-season{--season:#1E7BE8; --season-d:#1560BE;}

.gj-season .gj-season-band{
  position:relative; overflow:hidden;
  margin:0 14px 18px; padding:26px 16px 24px;
  border-radius:14px;
  background-color:#EAF3FD;
  background-image:url('https://chsbd.img7.kr/WEB/Summer%20Background.png'),
                   linear-gradient(180deg,#F2F7FF 0%,#E4EFFC 100%);
  background-size:cover, auto;
  background-position:center bottom, center;   /* ¿øº»ÀÌ ¼¼·ÎÇü(425x707)ÀÌ¶ó ¹°°áÀÌ ÀÖ´Â ¾Æ·¡ÂÊÀ» º¸¿©ÁØ´Ù */
  background-repeat:no-repeat, no-repeat;
}
.gj-season .gj-season-band::before{
  content:""; position:absolute; inset:0; background:rgba(255,255,255,.62);
}
.gj-season .gj-season-band > *{position:relative; z-index:1;}

.gj-season .gj-season-eyebrow{
  display:table; margin:0 auto 10px; height:22px; line-height:22px; padding:0 11px;
  background:var(--season); color:#fff; border-radius:11px;
  font-size:10.5px; font-weight:800; letter-spacing:.08em;
}
.gj-season .item-title{
  text-decoration:none; color:var(--ink);
  font-size:20px; letter-spacing:-0.03em; margin:0 0 6px;
}
.gj-season .gj-season-desc{margin:0; text-align:center; font-size:12px; color:#5F7185; line-height:1.5;}

/* ÅÇ : ¼±Åà ½Ã ÆĶõ ä¿òÀ¸·Î ¼½¼Ç »ö°ú ¿¬°á */
.gj-season .sec5_cate{margin-bottom:16px;}
.gj-season .sec5_cate ul li a{border-color:#D7E5F5 !important; color:var(--season-d) !important; font-weight:700 !important;}
.gj-season .sec5_cate ul li.on>a{background:var(--season) !important; border-color:var(--season) !important; color:#fff !important;}

.gj-season .dot-pagination .swiper-pagination-bullet-active{background:var(--season);}
/* BASIC css end */