@charset "utf-8";
/* CSS Document */
/**
 * custom css 입니다. 추가적인 css 는 여기에 작성을 해주세요.
 */


		
.main-guide ul {
    clear: both;
    overflow: hidden;
    padding: 0;
	margin-bottom:40px;
}
	
	
.main-guide ul li {
    float: left;
    margin-right: 11px;
    width: 188px;
    height: 200px;
    list-style: none;
    border: 1px solid #ccc;
    text-align: center;
}

.main-guide ul li a {
    text-decoration: none;
}

.main-guide ul li img {
    padding-top: 30px;
}

.main-guide ul li p {
    font-size: 15px;
    font-weight: bold;
    margin-bottom: 8px;
    letter-spacing: -1px;
    color: #333;
}

.main-guide ul li span {
    font-size: 11px;
    letter-spacing: -1.5px;
    margin-bottom: 25px;
    display: block;
    line-height: 17px;
    color: #333;
}


.main-guide .btn-1:hover {
    border: 1px solid #2a2b2c;
    color: #fff;
    background: #2a2b2c;	
}


	
.main-guide .btn-1 {
    width: 55px;
    cursor: pointer;
    letter-spacing: 1px;
    background: none;
    border: 1px solid #ccc;
    color: #676767;
    display: block;
    font-size: 12px;
    margin: 0 auto;
    padding: 3px 45px;
    position: relative;
}

.main-guide .btn-1,.main-guide .btn-1::after {
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}





.menu-gd ul {
    overflow: hidden;
    padding: 0;
    margin: 0;
    list-style: none;
}

.menu-gd ul li {
    background-position: center;
    display: block;
    float: left;
    width: 60px;
    height: 45px;
    text-align: center;
    font-size: 11px;
    color: #555;
    padding-top: 8px;
    line-height: 17px;
}

.menu-gd ul li img {
    margin-bottom: 5px;
    width: 25px;
}

/* ISO 아이콘 가로 정렬 */
.iso-list {
	width:1280px;
	max-width:100%;
	margin:0 auto;
	padding:0;
	list-style:none;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
/* ===== 2026-09-10 목록 가독성 개선 (기본 스킨 파일 미수정, 이 블록만 삭제하면 원복) ===== */
.item_tit_box .item_name { font-size: 14px; line-height: 1.45; }
.item_tit_box .item_brand { font-size: 12px; color: #6b6b6b; }
/* ===== 개선 블록 끝 ===== */

/* ================================================================
   2026-09-10 리뉴얼 1차 : 타이포그래피
   (고도몰 기본 스킨 파일 미수정. 이 블록만 지우면 즉시 원복)
   ================================================================ */
html, body, input, textarea, select, button, table, th, td,
div, p, span, a, li, dt, dd, strong, em, label,
h1, h2, h3, h4, h5, h6 {
  font-family: "Pretendard Variable", Pretendard, -apple-system,
               BlinkMacSystemFont, system-ui, "Malgun Gothic", sans-serif;
}
body {
  font-size: 14px;
  line-height: 1.65;
  letter-spacing: -0.01em;
  color: #16181d;
  -webkit-font-smoothing: antialiased;
}
/* 상품 카드 */
.item_tit_box .item_name { font-size: 15px; line-height: 1.5; letter-spacing: -0.015em; }
.item_tit_box .item_brand { font-size: 12.5px; color: #6b6b6b; letter-spacing: 0; }
/* 섹션 제목 */
.main_goods_cont .tit, .main_goods_cont h2, .main_goods_cont h3 {
  letter-spacing: -0.03em; font-weight: 700;
}
/* ===== /리뉴얼 1차 ===== */

/* ================================================================
   2026-09-10 리뉴얼 2차 : 정렬 + 모션 (이 블록만 지우면 원복)
   * 카드 바깥 프레임 없음 — 사진 테두리는 기본 스킨 것 그대로 사용
   ================================================================ */
#container li { vertical-align: top; }

/* 사진: 기본 스킨 테두리 유지, 확대 시 넘침만 정리 */
.item_photo_box { overflow: hidden; }

/* 상품명 2줄 고정 → 줄바꿈 때문에 카드 높이 어긋나는 것 방지 */
.item_tit_box { padding-top: 12px; }
.item_tit_box .item_name {
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  min-height: 3em;
  font-size: 15px;
  line-height: 1.5;
  letter-spacing: -0.015em;
}
.item_tit_box .item_brand { font-size: 12.5px; color: #6b6b6b; letter-spacing: 0; }
.item_money_box { padding-top: 6px; }
/* 아이콘(품절/NEW) 자리 항상 확보 → 카드 높이 통일 */
.item_icon_box { min-height: 21px; }

@media (prefers-reduced-motion: no-preference) {
  .item_photo_box img { transition: transform .4s cubic-bezier(.2,.7,.3,1); }
  .item_cont:hover .item_photo_box img { transform: scale(1.04); }
  .item_cont:hover .item_name { color: #000; }
  .item_name { transition: color .2s ease; }

  .rv-init { opacity: 0; transform: translateY(20px); }
  .rv-on   { opacity: 1; transform: none;
             transition: opacity .65s cubic-bezier(.2,.7,.3,1), transform .65s cubic-bezier(.2,.7,.3,1); }
}
/* ===== /리뉴얼 2차 ===== */

/* ================================================================
   2026-09-10 리뉴얼 3차 : 납품사례 섹션 (.otoo-cases)
   ================================================================ */
.otoo-cases { max-width: 1200px; margin: 76px auto 20px; padding: 0; } /* 아이콘 6종(.main-guide 1200px)과 좌우 정렬 */
.otoo-cases__head { text-align: center; margin-bottom: 36px; }
.otoo-cases__eyebrow { display:inline-block; font-size:12.5px; font-weight:700;
  letter-spacing:.16em; color:#c0392b; margin-bottom:11px; }
.otoo-cases__title { font-size:31px; font-weight:800; letter-spacing:-.04em;
  color:#16181d; margin:0 0 9px; line-height:1.3; }
.otoo-cases__desc { font-size:15px; color:#6b7280; margin:0; letter-spacing:-.02em; }

.otoo-cases__grid { display:grid; grid-template-columns:repeat(4,1fr); gap:18px; }
.otoo-case { position:relative; display:block; border-radius:14px; overflow:hidden;
  background:#eef1f5; aspect-ratio:1/1; text-decoration:none; }
.otoo-case img { width:100%; height:100%; object-fit:cover; display:block;
  transition: transform .5s cubic-bezier(.2,.7,.3,1); }
.otoo-case__veil { position:absolute; inset:0; pointer-events:none;
  background:linear-gradient(to top, rgba(8,10,14,.68) 0%, rgba(8,10,14,.20) 26%, rgba(8,10,14,0) 46%); }
.otoo-case__body { position:absolute; left:0; right:0; bottom:0; padding:16px 16px 15px; }
.otoo-case__client { display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;
  overflow:hidden; color:#fff; font-size:15px; font-weight:700;
  letter-spacing:-.025em; line-height:1.35;
  text-shadow:0 1px 6px rgba(0,0,0,.7), 0 0 2px rgba(0,0,0,.5); }
.otoo-case__work { display:inline-block; margin-top:8px; padding:3px 10px; border-radius:999px;
  font-size:11.5px; font-weight:600; font-style:normal; color:#fff;
  background:rgba(0,0,0,.45); backdrop-filter:blur(2px); }

.otoo-cases__more { text-align:center; margin-top:36px; }
.otoo-cases__more a { display:inline-block; padding:13px 30px; border:1px solid #d7dbe2;
  border-radius:999px; font-size:14.5px; font-weight:600; color:#16181d;
  text-decoration:none; transition:background .25s ease, color .25s ease, border-color .25s ease; }

@media (prefers-reduced-motion: no-preference) {
  .otoo-case:hover img { transform: scale(1.07); }
  .otoo-cases__more a:hover { background:#16181d; border-color:#16181d; color:#fff; }
}
@media (max-width:1200px){ .otoo-cases__grid { grid-template-columns:repeat(2,1fr); } }
/* ===== /리뉴얼 3차 ===== */

/* ================================================================
   2026-09-10 리뉴얼 4차 : 작은 글자 확대 (가독성)
   * 스킨 규칙이 #id 로 강하게 잡혀있어 선택자 강도를 맞춤
   ================================================================ */
#header .header_top_cont .top_member_box > li a { font-size: 13px; }
#header .gnb .depth0 > li > a { font-size: 16px; letter-spacing: -.03em; }
#header .gnb .depth1 li a { font-size: 14px; }
.menu-gd ul li, .menu-gd ul li a { font-size: 13px; }

/* 카테고리 페이지 : 하위분류 목록 */
.list_item_category ul li a span { font-size: 15px; letter-spacing: -.02em; }
.list_item_category ul li a em { font-size: 13px; color: #7c8391; }

/* 정렬 탭 / 보기 개수 */
.pick_list_box .pick_list li label, .pick_list_box .pick_list li { font-size: 14.5px; }
.pick_list_box .choice_num_view select,
.pick_list_box .choice_num_view .chosen-single span { font-size: 14px; }

/* 공지 롤링 */
#header .notice_box a, .header_notice a { font-size: 13.5px; }

/* 푸터 */
#footer strong, #footer dt, #footer dd, #footer address, #footer li { font-size: 12.5px; }
/* ===== /리뉴얼 4차 ===== */

/* ================================================================
   2026-09-10 리뉴얼 5차 : 우측 스크롤(최근 본 상품) 간격 정리
   ================================================================ */
#scroll_right .right_banner { margin-bottom: 12px; }
#scroll_right .scroll_right_cont { margin-bottom: 12px; padding-top: 16px; padding-bottom: 16px; }
#scroll_right .scroll_right_cont h4 { font-size: 13px; letter-spacing: -.02em; line-height: 1.4; }
#scroll_right .scroll_right_cont ul { margin-top: 0; }
/* ===== /리뉴얼 5차 ===== */