/*
Theme Name: Blocksy Child
Template: blocksy
*/




/* =================================================
  [레이아웃 구조]
  - header, footer, container
==================================================== */

 /* #offcanvas 태블릿Blocksy UI 미지원으로 CSS 강제 적용*/
@media (min-width: 689.98px) and (max-width: 999.98px) {
  #offcanvas .ct-panel-content-inner {
    padding-left: 10vw !important;
    padding-right: 10vw !important;
  }
}


@media (max-width: 689.98px) {
    [data-header*="type-1"] #offcanvas .ct-toggle-close {
        position: relative !important;
        left: -8px !important;
         top: -3px !important;
        margin-left: 0 !important;
        margin-right: auto !important;
        display: block !important;
        z-index: 9999;
    }
}



/*Close 태블릿 offcanvas menu button 왼쪽으로 기본 이동 */
@media (min-width: 690px) and (max-width: 999.98px) {
  [data-header*="type-1"] #offcanvas .ct-toggle-close {
    position: relative;
    left: 0;
    padding-left: 50px !important; 
    margin-left: 0 !important;
    margin-right: auto !important;
  }
}



 /* Desktop header menu hover */
@media (min-width: 1000px) {
  .ct-menu-link:hover {
    color: #000000;
    font-weight: 600!important;
  }

  .ct-menu-link[aria-current="page"] {
    color: #000000;
    font-weight: 600!important;
  }
}

/* 모바일 좁은 화면에서는 캡챠 살짝 축소 */
@media (max-width: 480px) {
    .cf-turnstile {
        transform: scale(0.9) !important;
        transform-origin: top left !important;
    }
}




/* Checkout Page count-cart badge settings */
.wc-block-components-order-summary-item__quantity {
  background-color: #ffffff !important;
  color: #1a1a1a !important;
  border: 1px solid #1a1a1a !important;
  border-radius: 9999px !important;
  padding: 2px 8px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
  line-height: 1 !important;
  display: inline-block !important;
  min-width: 18px !important;
  text-align: center !important;
}


/*1. User Icon Hover Background and Size */
.ct-header-account .ct-account-item {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;  
  height: 44px;
  border-radius: 50%;
  transition: background-color 0.3s ease;
}

.ct-header-account .ct-account-item:hover {
  background-color:#ffffff;
}

/* 2.User Icon Hover */
.ct-header-cart .ct-icon-container {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  transition: background-color 0.3s ease;
}

/* 1.Add a hover background to your header cart */
.ct-header-cart .ct-icon-container {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  border-radius: 50%;
  transition: background-color 0.3s ease;
}

/* 2.header cart Apply hover effect*/
.ct-header-cart .ct-icon-container:hover {
  background-color: #ffffff;
}

/* 3. header cart Badge style */
.ct-header-cart .ct-dynamic-count-cart {
  position: absolute;
  top: 1px;
  right: -3px;
  background-color: #ffffff;
  color: #000;
  font-size: 11px;
  padding: 2px 6px;
  border: 1px solid #1a1a1a; 
	border-radius: 999px;
  line-height: 1;
  min-width: 18px;
  text-align: center;
  z-index: 10;
  pointer-events: none; 
}






 /*(Product Page-Back button) icon on mobile  */
@media (max-width: 999.98px) {
.back-button-bg {
  width: 44px;
  height: 44px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%; /* 원형 배경 */
}

.back-button-bg:hover {
  background-color: #ffffff!important; /* 밝은 회색 배경 */
}

.back-button svg {
  width: 36px;
  height: 36px;
  color: black;
}
	
	
	
	

/* =============================================
  [우커머스 구조]
  - SHOP, 카테고리, proudct
============================================= */

/* WooCommerce Single Product Page */
/*  (Desktop) 제품페이지 제품요소의 양옆 여백과 이미지와 간격 */
@media (min-width: 1000px) {
    .ct-default-gallery .entry-summary,
    .ct-stacked-gallery .entry-summary {
        margin-inline-start: 170px!important;
        margin-inline-end: 100pximportant; /* 오른쪽 여백 추가 */
        width: 450px !important;
        padding-top: 150pximportant;
    }
}
		
		

/* 2.(모바일,태블릿) 양옆 여백 포함해서 깔끔하게— top 값만 변경경==*/
@media (max-width: 999px) {
    .ct-default-gallery .entry-summary,
    .ct-stacked-gallery .entry-summary {
        margin-inline-start: 0!important;
        width: 100%!important;
        padding: 32px 0 0 0!important; 
    }
}


/* Set product image aspect ratio on mobile only == */
@media (max-width:689.98px){
	.woocommerce ul.products li.product a img {
		width: 100%!important;
		height: auto!important;
        aspect-ratio: 9 / 14!important;
		object-fit: cover; 
    }
}





/* export-goods 카테고리 전용 상품 그리드 설정 */
/* 데스크탑 (1000px 이상) */
@media (min-width: 1000.02px) {
  body.term-export-goods ul.products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr)!important;
    row-gap: 5rem;
    column-gap: 9rem!important;
  }
}

/* 태블릿 (690px ~ 999.98px) */
@media (min-width: 690px) and (max-width: 999.98px) {
  body.term-export-goods ul.products {
    display: grid !important;
    grid-template-columns: repeat(2, 1fr);
    row-gap: 5rem;
    column-gap: 5rem !important;
  }
}

/* 모바일 (≤ 689.98px) */
@media (max-width: 689.98px) {
  body.term-export-goods ul.products {
    display: grid !important;
    grid-template-columns: 1fr;
    row-gap: 3rem;
    column-gap: 0rem;
  }

  body.term-export-goods ul.products li.product a.ct-media-container {
    aspect-ratio: 1 / 1.3;
  }
  body.term-export-goods ul.products li.product {
    padding: 1rem;
  }
}




/* 1.모바일 한정- 제품페이지 이미지 FULL 너비로 채움 처리== */
@media (max-width: 689.98px) {
  body.woocommerce.single-product .product .woocommerce-product-gallery {
    margin-left: calc(-1 * var(--theme-container-padding, 20px));
    margin-right: calc(-1 * var(--theme-container-padding, 20px));
    width: auto;
    max-width: none;
  }

  /*2.이미지가 꽉 차도록 처리== */
  body.woocommerce.single-product .product .woocommerce-product-gallery img {
    width: 100%!important;
    height: auto;
    object-fit: cover;
  }
}	
	
	
/* ================================================
  [우커머스 페이지]
  - 결재, 장바구니, 우커머스 페이지
================================================== */	
	
	
	
 /* WooCommerce mobile_Single Product Page quantity-1 Button */
@media (max-width: 689.98px) {
    .ct-cart-actions .quantity[data-type="type-2"] {
        height:45px; 

    }
}
/* Woocommerce Desktop,태블릿_Single Product Page add to cart Button  */ 

@media (min-width: 999.98px) {
    .ct-cart-actions .quantity[data-type="type-2"]{
        height:47px !important; 
    }
    .ct-cart-actions {
        --theme-button-min-height: 43px;/* 장바구니 버튼은 !important를 피한다 */
    }
}


/* 모바일 장바구니 페이지 구분선 */
@media (max-width: 689.98px) {
  .wc-block-cart-items__row {
    border-bottom: 1px solid #e5e5e5;
    padding-bottom: 1rem;
    margin-bottom: 1rem;
  }
}
.wc-block-cart-items__row:last-child {
  border-bottom: none;
}



/*Woocommerce checkout page input field height */
.wc-block-components-form .wc-block-components-text-input input {
    height: 2,8em!important;
}

/* Cart Product Name& price font size */
table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-name {
    font-size:17px; 
    font-weight:400; 
	    color: #1a1a1a; 
}
table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-price {
    font-size:17px; 
     font-weight:500; 
         color: #404040; 
}
	

/* Hide summary description on WooCommerce block-based checkout page */
.woocommerce-checkout .wc-block-components-product-metadata__description {
  display: none !important;
}


/* Hide summary description on woocommerce block based cart page */    
table.wc-block-cart-items .wc-block-cart-items__row .wc-block-components-product-metadata {
  display: none;
}


/* single-product  font-size */
 .single-product .summary {
        font-size: 16px;
    }

/* Hide the WooCommerce My Account Page Navigation */
.woocommerce-MyAccount-navigation {
display:none!important;
}

/* Disable single product image effects Overlay*/
.single-product .woocommerce-product-gallery__image{pointer-
events:none}.single-product .woocommerce-product-image-
overlay{display:none;}
	




/* =========================
  [문단, 페이지 CSS 디자인]
========================= */



/* iphone safari  */
a[href^=tel] {
   text-decoration:inherit;
   color: inherit;
}




/* 모바일 checkout page logo size  */
@media (max-width: 689px) {
  .custom-mobile-logo img {
    max-width: 100px!important;
    height: auto!important;
  }
}

/*문의하기 테마 아이콘의 문자*/	
.contact-title {
  font-weight: 400 important;
  font-size: 16px!important; 
}
.contact-text {
  font-weight: 400 important;
  font-size: 17px!important; 
}

.modal-field::placeholder {
  font-size: 18px!important;       
  font-weight: 400!important;       
  color: #333;           
  letter-spacing: -0.02emimportant; 
}


/*New Shop Category button*/	
.gb-button.active-button,
.gb-text.active-button {
  font-weight: 800!important;
box-shadow: inset 0 -1px 0 #000;     
}


/*현무복어_Gutenberg*/
@keyframes fadeDownUpSoft {
  0% {
    opacity: 0;
    transform: translateY(-30px);
  }
  50% {
    opacity: 0.8;
    transform: translateY(30px);
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}

.gb-text-fadein {
  opacity: 0;
  animation: fadeDownUpSoft 1s ease-in-out 0.1s forwards;
}

 /* fade up아래에서 시작 */
@keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translateY(50px); 
  }
  100% {
    opacity: 1;
    transform: translateY(0); /* 원래 자리 */
  }
}

.fade-up {
  opacity: 0;
  animation: fadeUp 0.5s ease-out forwards;
}

/*현무복어_Gutenberg 히로 숨기기*/
@media (max-width: 1024px) {
  .hiro-hide-on-mobile,
  .hiro-hide-on-table {
    display: none !important;
  }
}



/*현무복어_Gutenberg loop builder*/
@media (max-width: 767.98px) {
  .scroll-loop {
    display: flex;
    flex-wrap: nowrap;
    overflow-x: auto;
    scroll-snap-type: x mandatory;
    gap: 1rem;
    padding-bottom: 1rem;
    -webkit-overflow-scrolling: touch;
  }

  .scroll-item {
    flex: 0 0 80%;
    scroll-snap-align: start;
  }
}




/* Single post Template (2)*/
/* 모바일에서 숨기기 */
@media (max-width: 767.98px) {
  .hide-on-mobile {
    display: none !important;
  }
}

/* 태블릿에서 숨기기 */
@media (min-width: 768px) and (max-width: 1023.98px) {
  .hide-on-tablet {
    display: none !important;
  }
}

/* Single post Template (1)*/
/* 모바일에서 숨기기 */
@media (max-width: 767.98px) {
  .hide-on-mobile {
    display: none !important;
  }
}

/* 태블릿에서 숨기기 */
@media (min-width: 768px) and (max-width: 1023.98px) {
  .hide-on-tablet {
    display: none !important;
  }
}
	
/* 내계정 페이지 hover-box */
.hover-box {
  transition: all 0.3s ease;
  cursor: pointer;
}

.hover-box:hover {
  background-color: #ffffff;
  box-shadow: 0 6px 15px rgba(0, 0, 0, 0.15);
  transform: translateY(-4px);
}
	
/* founders-story 창업자 이야 기 */
  @keyframes fadeInSoft {
  0%   { opacity: 0; }
  100% { opacity: 1; }
}

.my-soft-fade {
  opacity: 0;
  animation: fadeInSoft 1.4s ease-in-out forwards;
}