@font-face {
    font-family: "baskerville-urw";
    src: url("https://use.typekit.net/af/50c03d/000000000000000077359eea/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff2"),url("https://use.typekit.net/af/50c03d/000000000000000077359eea/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("woff"),url("https://use.typekit.net/af/50c03d/000000000000000077359eea/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n4&v=3") format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 400;
    font-stretch: normal;
}

@font-face {
    font-family: "baskerville-urw";
    src: url("https://use.typekit.net/af/3ba342/000000000000000077359ef0/30/l?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff2"),url("https://use.typekit.net/af/3ba342/000000000000000077359ef0/30/d?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("woff"),url("https://use.typekit.net/af/3ba342/000000000000000077359ef0/30/a?primer=7cdcb44be4a7db8877ffa5c0007b8dd865b3bbc383831fe2ea177f62257a9191&fvd=n7&v=3") format("opentype");
    font-display: auto;
    font-style: normal;
    font-weight: 700;
    font-stretch: normal;
}

.p-only { display:block; }
.m-only { display: none !important; }



/* 장바구니 주문서 공통 */
.od_prd_list .td_chk {}
.od_prd_list .td_prd {border-left:0;position:relative;padding-left:120px;min-height:100px}
.od_prd_list .td_prd .sod_img {position:absolute;top:25px;left:20px}
.od_prd_list .td_prd .sod_name {min-height:80px}
.od_prd_list .td_prd .prd_name {font-size:1.4em}
.od_prd_list .total_prc {color:#000;font-weight:bold;font-size:1.4em}

.sod_opt {margin:5px 0}
.sod_opt ul {display:inline-block;margin:0;padding:0;list-style:none}
.sod_opt li {color:#000;padding:3px 0;line-height:1.3em}
.sod_opt li:before {content:"옵션";display:inline-block;margin:1px 5px 2px 0;padding:3px;border-radius:3px;background:#e2eaf6;line-height:1em;color:#3a8afd}
.sod_option_btn .mod_options {height:30px;margin:5px 0 0;padding:0 5px;border:1px solid #d4d6db;color:#606060;background:#fff;border-radius:3px}
.cp_btn {padding:0 10px;border:1px solid #d4d6db;color:#3a8afd;background:#fff;height:26px;border-radius:3px}
.cp_cancel {padding:0 10px;border:1px solid #aaa;color:#666;background:#fff;height:26px;border-radius:3px}

/* 장바구니 */
#sod_bsk {margin-bottom:30px}
.btn_cart_del {padding:20px 0;border-bottom:1px solid #ccd2d9}
.btn_cart_del button {height:30px;padding:0 10px;border:1px solid #d4d6db;border-radius:5px;background:#fff;color:#666}
#sod_bsk_list {position:relative}
#sod_bsk #sod_bsk_tot {border:1px solid #212a37;margin:20px 0}
#sod_bsk #sod_bsk_tot ul:after {display:block;visibility:hidden;clear:both;content:""}
#sod_bsk #sod_bsk_tot li {float:left;width:33.333%;background:#4a505a;color:#fff;border-left:1px solid #212a37;text-align:right;padding:25px;font-size:1.167em}
#sod_bsk #sod_bsk_tot li:first-child {border:0}
#sod_bsk #sod_bsk_tot li span {display:inline-block;float:left}
#sod_bsk #sod_bsk_tot .sod_bsk_cnt {width:33.335%;background:#212a37}
#sod_bsk_act {text-align:center;margin-bottom:30px}
#sod_bsk_act .btn_submit {height:50px;padding:0 10px;width:160px;font-weight:bold;font-size:1.25em}
#sod_bsk_act .btn01 {height:50px;line-height:50px;padding:0 10px;width:160px;font-weight:bold;font-size:1.25em}
#sod_bsk_act p {margin:0 0 10px}


/* 장바구니 선택사항수정 */
#sod_bsk_list form {display:block;}




#sod_bsk_list #mod_option_frm {z-index:10000;position:fixed;top:50%;left:50%;width:100%;max-width:340px;height:auto !important;height:500px;max-height:500px;margin-left:-150px;
margin-top:-200px;border:1px solid #dde7e9;border-radius:3px;background:#fff;overflow-y:auto;overflow-x:inherit}
#sod_bsk_list .mod_option_bg {content:"";position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.1);display:block;z-index:9999}
#mod_option_frm h2 {border-bottom:1px solid #e8e8e8;padding:0 20px;line-height:50px;font-size:1.25em}

.option_wr {padding:20px 20px 0}
.option_wr h3 {font-size:1.167em;margin-bottom:10px}
.option_wr .get_item_options,
.option_wr .get_item_supply {margin-bottom:10px}
.option_wr label {display:block;margin:10px 0 5px}
.option_wr select {width:100%;border:1px solid #d4d4d4;height:48px}

#sit_opt_added {margin:0;padding:0;border-bottom:0;list-style:none}
#sit_opt_added li {padding:10px 15px;background:#f9f9f9;border:1px solid #e6e9ed;margin:10px 0;position:relative}
#sit_opt_added li:after {display:block;visibility:hidden;clear:both;content:""}
#sit_opt_added li .opt_name {line-height:28px;font-weight:bold}
#sit_opt_added li .opt_count {}
#sit_opt_added button {float:left;width:30px;height:30px;border:1px solid #bdc9dc;border-radius:0;background:#fff;color:#666;font-size:0.92em}
#sit_opt_added button:hover {color:#000}
#sit_opt_added .num_input {float:left;border:0;height:30px;border-top:1px solid #e4e4e4;border-bottom:1px solid #e4e4e4;text-align:center}
#sit_opt_added .sit_opt_del {position:absolute;right:0;top:0;font-size:15px;border:0;border-left:1px solid #e6e9ed;border-bottom:1px solid #e6e9ed}
#sit_opt_added .sit_opt_del:hover {color:#be334a}
#sit_opt_added .sit_opt_prc {display:block;float:right;width:150px;padding:0 3px;text-align:right;line-height:30px;font-size:1.183em;font-weight:bold}

#mod_option_frm #sit_sel_option {margin:20px 20px 10px}
#mod_option_frm #sit_tot_price {float:left;display:inline-block;margin:0 20px 20px}
#mod_option_frm #sit_opt_added {}
#mod_option_frm .btn_confirm {float:right;display:inline-block;margin:0 20px 20px;background:yellow}
#mod_option_frm .btn_confirm .btn_submit {width:100px;height:40px;font-size:1.167em;font-weight:bold;cursor:pointer}
#mod_option_frm .btn_confirm .btn_close {position:absolute;top:0;right:0;width:50px;height:50px;border:0;background:none;font-size:1.25em;border-radius:0}
#mod_option_frm .btn_confirm .btn_close:hover {background:#f3f3f3}


.btn_submit {border:0;background:#3a8afd;color:#fff;cursor:pointer;border-radius:3px}
.btn_submit:hover {background:#2375eb}
.btn_close {border:1px solid #dcdcdc;cursor:pointer;border-radius:3px;background:#fff}
a.btn_close {text-align:center;line-height:50px}


/* 화면낭독기 사용자용 */
#hd_login_msg {position:absolute;top:0;left:0;font-size:0;line-height:0;overflow:hidden}
.msg_sound_only, .sound_only {display:inline-block !important;position:absolute;top:0;left:0;width:0;height:0;margin:0 !important;padding:0 !important;font-size:0;line-height:0;border:0 !important;overflow:hidden !important}



/* 추가 사항*/



    .product-gallery {
      width: 100%;
      max-width: 600px;
      background: #fff;
      border: 0px solid #e0e0e0;
      border-radius: 4px;
      overflow: hidden;
      user-select: none;
	   margin-bottom:50px;
    }

    /* ===========================
       MAIN SWIPER (큰 이미지)
    =========================== */
    .gallery-main {
      position: relative;
      width: 100%;
      background: #fafafa;
    }

    .gallery-main .swiper {
      width: 100%;
    }

    /* 메인 이미지 비율 — 1:1 */
    .gallery-main .swiper-slide {
      position: relative;
      width: 100%;
      padding-bottom: 100%;
      overflow: hidden;
      background: #fff;
    }

    .gallery-main .swiper-slide img {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      object-fit: contain;
      transition: transform 0.3s ease;
    }

    .gallery-main .swiper-slide:hover img {
      transform: scale(1.00);
    }

    /* 좌우 화살표 버튼 */
    .gallery-main .swiper-button-prev,
    .gallery-main .swiper-button-next {
      width: 36px;
      height: 36px;
      background: rgba(255,255,255,0.85);
      border-radius: 50%;
      box-shadow: 0 2px 8px rgba(0,0,0,0.15);
      color: #333;
      transition: background 0.2s, transform 0.2s;
    }

    .gallery-main .swiper-button-prev:hover,
    .gallery-main .swiper-button-next:hover {
      background: #fff;
      transform: scale(1.00);
    }

    .gallery-main .swiper-button-prev::after,
    .gallery-main .swiper-button-next::after {
      font-size: 13px;
      font-weight: 700;
    }

    /* 슬라이드 카운터 (우하단) */
    .gallery-counter {
      position: absolute;
      bottom: 12px;
      right: 14px;
      z-index: 10;
      background: rgba(0,0,0,0.45);
      color: #fff;
      font-size: 12px;
      line-height: 1;
      padding: 5px 10px;
      border-radius: 20px;
      pointer-events: none;
    }

    /* ===========================
       THUMBNAIL SWIPER (작은 썸네일)
    =========================== */
    .gallery-thumbs {
      padding: 10px 10px 12px;
      background: #fff;
      border-top: 0px solid #eee;
    }

    .gallery-thumbs .swiper {
      width: 100%;
    }

    .gallery-thumbs .swiper-slide {
      width: 64px !important;   /* 고정 너비 */
      height: 64px;
      cursor: pointer;
      border: 2px solid transparent;
      border-radius: 4px;
      overflow: hidden;
      transition: border-color 0.2s, opacity 0.2s;
      opacity: 0.55;
      flex-shrink: 0;
    }

    .gallery-thumbs .swiper-slide img {
      width: 100%;
      height: 100%;
      object-fit: contain;
      background: #fafafa;
      display: block;
    }

    /* 활성 썸네일 */
    .gallery-thumbs .swiper-slide-thumb-active {
       
      opacity: 1;
    }

    .gallery-thumbs .swiper-slide:hover {
      opacity: 0.85;
    }

    /* ===========================
       모바일 반응형
    =========================== */
    @media (max-width: 480px) {
.p-only { display:none !important; }
.m-only { display: block !important	; }

	
	
      body {
        padding: 0;
      }

      .product-gallery {
        border: none;
        border-radius: 0;
      }

      .gallery-main .swiper-button-prev,
      .gallery-main .swiper-button-next {
        width: 30px;
        height: 30px;
      }

      .gallery-main .swiper-button-prev::after,
      .gallery-main .swiper-button-next::after {
        font-size: 11px;
      }

      .gallery-thumbs .swiper-slide {
        width: 54px !important;
        height: 54px;
      }

      .gallery-thumbs {
        padding: 8px 8px 10px;
      }
    }

    @media (max-width: 360px) {
      .gallery-thumbs .swiper-slide {
        width: 48px !important;
        height: 48px;
      }
    }
.splide__arrow{ background-color:transparent ; border:0;}	
 .splide__arrow--prev {
  transform: translate(0, 0) rotate(180deg);
}
	
.splide__arrow.splide__arrow--prev {
  position: absolute;
  top: 44%;
  left: 0;  z-index:2;
  width: 50px;
}

.splide__arrow.splide__arrow--next {
  position: absolute;
  top: 44%;
  right: 0;
  width: 50px;
  z-index:2;
}

.splide__arrow:before {
  content: "";
  width: 50px;
  height: 80px;
  background: url(https://kinto.co.jp/cdn/shop/t/470/assets/arrow-r_02.svg) no-repeat 50%;
  background-size: 20px 70px;
  display: block;
  margin: 0 auto;
  border: none;
  transform: none;
  position: relative;
  left: 0;
}

.splide__arrow.splide__arrow--next:before {
  /* transform: rotate(180deg); */
}

.splide__arrow.splide__arrow--prev:before {
  /* transform: rotate(180deg); */
}
	
	
.products .product { position:relative; }	
.kinto-loop-logo{ width:40px;height:40px; position:absolute;top:0px;left:0px;z-index:2;}
.dl-item_product__taglist__tag1{background-color:hsla(0, 0%, 94%, 1); display:inline-block; padding: .5em .7em; border:1px solid #eee; margin:5px 0 ;}




/* 관련상품 리스트   */

.it-parts-wrap {
    border: 1px solid #e8e8e8;
    border-radius: 4px;
    padding: 20px 24px 16px;
    margin-bottom: 20px;       /* 장바구니 버튼과의 간격 */
    background: #fff; 
	margin-top:36px;
}

/* ── 섹션 제목 ── */
.it-parts-title {
    font-size: 12px;
    font-weight: 600;
    letter-spacing: 0.12em;
    color: #333;
    text-transform: uppercase;
    margin-bottom: 18px;
    padding-bottom: 12px;
    border-bottom: 0px solid #ececec;
}

/* ── 상품 목록 (가로 배열) ── */
.it-parts-list {
    display: flex;
    gap: 16px;
    flex-wrap: nowrap;
}

/* ── 개별 상품 카드 ── */
.it-parts-item {

flex: 0 0 calc((100% - 32px) / 3);   /* gap 16px × 2 */
max-width: calc((100% - 32px) / 3);

    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: inherit;
    transition: opacity 0.2s ease;
    min-width: 0;               /* flex 자식 overflow 방지 */
}
.it-parts-item:hover {
    opacity: 0.75;
    text-decoration: none;
    color: inherit;
}

/* ── 이미지 영역 ── */
.it-parts-img-wrap {
    width: 100%;
    aspect-ratio: 1 / 1;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 10px;
    background: #fafafa;
    border-radius: 3px;
    overflow: hidden;
}
.it-parts-img {
    width: 100%;
    height: 100%;
    object-fit: contain;
    padding: 8px;
    box-sizing: border-box;
}

/* ── 상품 정보 ── */
.it-parts-info {
    width: 100%;
    text-align: left;
}
.it-parts-name {
    display: block;
    font-size: 11px;
    color: #444;
    line-height: 1.45;
    margin-bottom: 4px;
    word-break: keep-all;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.it-parts-price {
    display: block;
    font-size: 12px;
    font-weight: 600;
    color: #222;
}

/* ── 반응형: 모바일 ── */
@media (max-width: 480px) {
    .it-parts-wrap {
        padding: 14px 14px 12px;
    }
    .it-parts-list {
        gap: 10px;
    }
    .it-parts-name {
        font-size: 10px;
    }
    .it-parts-price {
        font-size: 11px;
    }
}


.eng{ font-family: "baskerville-urw" !important;}




/* 메인 추가 섹션1 */

  /* ── 섹션 전체 ── */
  .scene-section {
    padding: 120px 0 80px;
  }

  /* ── 섹션 타이틀 ── */
  .scene-heading {
    text-align: center;
    font-family: "baskerville-urw", "Baskerville", Georgia, serif;
    font-size: 21px;
    font-weight: 400;
    letter-spacing: 0.06em;
    color: #555;
    margin-bottom: 80px;
  }

  /* ── 그리드 래퍼 ── */
  .scene-grid {
    width: 90%;
    max-width: 1600px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
	/*grid-template-columns: repeat(3, 1fr); 3개 FARM 있을때 개방 */
    gap: 12px;
  }

  /* ── 카드 ── */
  .scene-card {
    position: relative;
    overflow: hidden;
    border-radius: 4px;
    cursor: pointer;
    aspect-ratio: 9 / 16;  /* 세로형 이미지 비율 */
  }

  /* ── 배경 이미지 ── */
  .scene-card__bg {
    position: absolute;
    inset: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
    transition: transform 0.7s ease;
    will-change: transform;
  }
  .scene-card:hover .scene-card__bg {
    transform: scale(1.04);
  }

  /* ── 어두운 오버레이 ── */
  .scene-card__overlay {
    position: absolute;
    inset: 0;
    background: linear-gradient(
      to top,
      rgba(0,0,0,0.52) 0%,
      rgba(0,0,0,0.18) 45%,
      rgba(0,0,0,0.04) 100%
    );
    transition: background 0.4s ease;
  }
  .scene-card:hover .scene-card__overlay {
    background: linear-gradient(
      to top,
      rgba(0,0,0,0.62) 0%,
      rgba(0,0,0,0.26) 45%,
      rgba(0,0,0,0.08) 100%
    );
  }

  /* ── 텍스트 영역 (카드 하단 중앙) ── */
  .scene-card__body {
    position: absolute;
    inset: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    padding: 0 24px 48px;
    text-align: center;
    color: #fff;
  }

  .scene-card__title {
    font-family: "baskerville-urw", "Baskerville", Georgia, serif;
    font-size: clamp(26px, 2vw, 34px);
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.2;
    margin-bottom: 10px;
  }

  .scene-card__desc {
    font-family: "baskerville-urw", "Baskerville", Georgia, serif;
    font-size: clamp(16px, 1.1vw, 22px);
    font-weight: 300;
    letter-spacing: 0.03em;
    line-height: 1.6;
    margin-bottom: 22px;
    opacity: 0.92;
  }

  /* ── VIEW MORE 버튼 ── */
  .scene-card__btn {
    display: inline-block;
    font-family: "baskerville-urw", "Baskerville", Georgia, serif;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #fff;
    text-decoration: none;
    border-bottom: 1px solid rgba(255,255,255,0.75);
    padding-bottom: 3px;
    transition: border-color 0.25s, opacity 0.25s;
  }
  .scene-card__btn:hover {
    border-color: #fff;
    opacity: 0.8;
  }

  /* ── 태블릿: 768px ~ 1023px ── */
  @media (max-width: 1023px) {
    .scene-grid {
      width: 90%;
      max-width: 90%;
      grid-template-columns: repeat(2, 1fr);
      grid-template-rows: auto auto;
    }
    /* 3번째 카드: 2열 중앙 배치 */
    .scene-card:nth-child(3) {
      grid-column: 1 / -1;
      aspect-ratio: 16 / 7;   /* 풀너비일 때 가로형 비율로 변경 */
    }

    .scene-card__title {
      font-size: clamp(20px, 3vw, 26px);
    }
    .scene-card__desc {
      font-size: clamp(13px, 1.8vw, 15px);
    }
  }

  /* ── 모바일: ~767px ── */
  @media (max-width: 767px) {
    .scene-section {
      padding: 40px 0 60px;
    }
    .scene-heading {
      font-size: 16px;
      margin-bottom: 24px;
    }
    .scene-grid {
      width: 90%;
      max-width: 90%;
      grid-template-columns: 1fr;
      gap: 10px;
    }
    .scene-card:nth-child(3) {
      grid-column: auto;
      max-width: 100%;
    }
    .scene-card {
      aspect-ratio: 3 / 4;
    }
    .scene-card__body {
      padding: 0 20px 36px;
    }
    .scene-card__title {
      font-size: 24px;
    }
    .scene-card__desc {
      font-size: 14px;
    }

	
    .scene-card:nth-child(3) { 
      aspect-ratio: 3 / 4;    
    }
	
	
	
  }
  
  
  /* ── 섹션 전체 ── */
  .futo-section {
    background-color: #efebd4	;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='300' height='300'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.75' numOctaves='4' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='300' height='300' filter='url(%23n)' opacity='0.04'/%3E%3C/svg%3E");
    width: 90%;
	max-width:1600px;
    overflow: hidden;
	margin:50px auto 100px;
	
  }

  /* ── 내부 래퍼 ── */
  .futo-inner {
    width: 90%;
    max-width: 1600px;
    margin: 0 auto;
    display: grid;
    grid-template-columns: 55% 45%;
    align-items: center;
    min-height: 600px;
  }

  /* ── 왼쪽: 일러스트 이미지 ── */
  .futo-illust {
    position: relative;
    width: 100%;
    padding: 40px 0 40px 0;
  }
  .futo-illust img {
    width: 100%;
    max-width: 700px;
    height: auto;
    display: block;
    object-fit: contain;
  }

  /* ── 오른쪽: 텍스트 영역 ── */
  .futo-content {
    padding: 60px 40px 60px 60px;
    display: flex;
    flex-direction: column; 
    gap: 0;
    align-items: center;
    text-align: center;	
  }

  /* 타이틀 "Futo" */
  .futo-title {

  aspect-ratio: 3.0303030303;

  }
  .futo-title svg{ display:block;width:99%; height:99%; top:.05%; left:.05%; fill:#000; }
  .futo-title svg *{ 
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
  -webkit-font-feature-settings: "palt" 1;
  font-feature-settings: "palt" 1;
  box-sizing: border-box;
  }  
  /* 서브타이틀 */
  .futo-subtitle {
    font-family: "baskerville-urw", "Baskerville", Georgia, serif;
    font-size: clamp(13px, 1.1vw, 15px);
    font-weight: 600;
    letter-spacing: 0.04em;
    color: #2a2a2a;
    margin-bottom: 20px;
	margin-top:10px;
  }
  .futo-subtitle em {
    font-style: italic;
    font-weight: 700;
  }

  /* 본문 텍스트 */
  .futo-desc {
    font-family: "baskerville-urw", "Baskerville", Georgia, serif;
    font-size: clamp(13px, 1.05vw, 15px);
    font-weight: 400;
    letter-spacing: 0.04em;
    line-height: 1.9;
    color: #3a3a3a;
    margin-bottom: 32px;
  }

  /* VIEW MORE 버튼 */
  .futo-btn {
    display: inline-block;
    font-family: "baskerville-urw", "Baskerville", Georgia, serif;
    font-size: 11px;
    font-weight: 400;
    letter-spacing: 0.18em;
    text-transform: uppercase;
    color: #2a2a2a;
    text-decoration: none;
    border-bottom: 1px solid #2a2a2a;
    padding-bottom: 3px;
    transition: opacity 0.25s;
  }
  .futo-btn:hover {
    opacity: 0.5;
  }

  /* ── 태블릿: ~1023px ── */
  @media (max-width: 1023px) {
    .futo-inner {
      grid-template-columns: 1fr 1fr;
      min-height: 480px;
    }
    .futo-content {
      padding: 40px 20px 40px 32px;
    }
  }

  /* ── 모바일: ~767px ── */
  @media (max-width: 767px) {
    .futo-inner {
      grid-template-columns: 1fr;
      min-height: auto;
    }
    .futo-illust {
      padding: 40px 0 0;
    }
    .futo-illust img {
      max-width: 100%;
    }
    .futo-content {
      padding: 24px 0 48px;
      align-items: center;
      text-align: center;
    }
    .futo-title {
      font-size: 40px;
      margin-bottom: 20px;
    }
    .futo-desc {
      font-size: 14px;
    }
  }  