/*shop 시작*/
#gw-theme-main-visual {position: relative;z-index: 99;overflow: hidden;width: 100%;height: 100%;background: #fff;}
#gw-theme-main-visual .gw-visual {position: relative;width: 100%;height:100%;overflow: hidden;}
#gw-theme-main-visual .gw-visual .swiper-wrapper {display: flex;flex-direction: row;}
#gw-theme-main-visual .gw-visual .swiper-slide {width: 100%;height: 100%;display: flex;justify-content: center;align-items: center;}
#gw-theme-main-visual .swiper-container,
#gw-theme-main-visual .swiper-wrapper,
#gw-theme-main-visual .swiper-slide{position: relative;height: 100%;}
#gw-theme-main-visual .swiper-slide{overflow: hidden;display: flex;justify-content: center;align-items: center;background: #333;}
#gw-theme-main-visual .swiper-container {position: relative;overflow: hidden;}
#gw-theme-main-visual .swiper-slide {position: relative;overflow: hidden;}
#gw-theme-main-visual .slide-inner {overflow: hidden;display: block;width:100%;height:100%;}
#gw-theme-main-visual .gw-main-visual-img{width:100%;height:100%;}
#gw-theme-main-visual .gw-main-visual-img > img{width: 100%;height: 100%;object-fit: cover;object-position:center;transform: scale(1.05,1.05);transition:transform 5000ms ease-in-out ;}
.gw-main-visual-img.current {z-index: 1;position: absolute;transition: transform 0.5s ease-in-out;}
.gw-main-visual-img.next {z-index: 0;position: absolute;transform: translate3d(100%, 0, 0);}
#gw-theme-main-visual .swiper-slide-active .gw-main-visual-img > img{transform: scale(1.0,1.0) rotate(0.002deg);}



.gw-main-visual-bottom-container {padding: 0 60px;position: absolute;bottom: 30px;left: 0;width: 100%;height: auto;}
.gw-main-visual-arrow {display: flex;gap:10px;position: relative;}
.gw-main-visual-arrow > div {position: relative;left:0;display: block;width:50px;height: 50px;background:rgba(255,255,255,0.1);border-radius:50%;color:rgba(255,255,255,0.25);transition:all 0.4s;}
.gw-main-visual-arrow .swiper-button-prev:after,
.gw-main-visual-arrow .swiper-button-next:after {content: "\e93b";position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);display: block;font-family:xeicon;color:#fff;font-size:var(--main-title04);}
.gw-main-visual-arrow .swiper-button-prev:after {transform: translate(-50%,-50%) rotate(180deg);}
.swiper-pagination {left:50% !important;transform:translateX(-50%);display: flex !important;justify-content: center;align-items: center;gap: 5px;width:auto !important;}
.swiper-pagination-bullet {margin: 0 10px;width: 8px;height: 8px;display: inline-block;border-radius: 100%;background: #fff;opacity: 1;font-size: 0;text-indent: -9999px;}
.swiper-pagination-bullet-active {width: 10px;height: 10px;border: 3px solid #fff;background-color: transparent;box-sizing: content-box;}
.gw-main-visual-scroll{position: absolute !important;right: 60px;bottom: 0;z-index: 100;}
.gw-main-visual-scroll > ul{position: relative}
.gw-main-visual-scroll > ul > li{transform:rotate(90deg);color:#fff; font-size:14px; font-family: "Play", sans-serif;font-weight: 700;}
.gw-main-visual-scroll i{font-size: 16px; display: block; color: #fff; opacity: 0.25;}
.gw-main-visual-scroll i.down01{animation: gw-scroll 1.5s ease infinite;}
.gw-main-visual-scroll i.down02{margin-top: -10px;animation: gw-scroll 1.5s ease infinite; animation-delay:0.2s;}
.gw-main-visual-scroll i.down03{margin-top: -10px;animation: gw-scroll 1.5s ease infinite; animation-delay:0.3s;}

@keyframes gw-scroll {
    10% {opacity: 0.25;}
    20% {opacity: 0.5;}
    30% {opacity: 1;}
}

/*배너 이미지가 없을 경우------------------------------------------------------------------------------------------------------------------ */
#gw-theme-main-visual .gw-slider-container {height: 100%;}
#gw-theme-main-visual .gw-slider {height: 100%;}
#gw-theme-main-visual .gw-no-banner {width:100%;height: 100%;background: #ddd;  align-items: center;place-content: center;}
#gw-theme-main-visual .gw-no-banner .gw-title{font-size:var(--main-title03);}
#gw-theme-main-visual .gw-no-banner .gw-btn01{max-width: 300px;}

@media screen and (max-width:1280px) {
    .gw-main-visual-bottom-container{padding: 0 40px;}
    #gw-theme-main-visual{padding-top: 120px;}
    #gw-theme-main-visual .gw-main-visual-text01{font-size:60px;}
    .gw-main-visual-scroll{right: 40px;}
}

@media screen and (max-width:1024px) {
    #gw-theme-main-visual{height: 668px;}
    #gw-theme-main-visual .gw-main-visual-video iframe {margin-top:0 !important;top: 50% !important;transform: translate(0, -50%) !important;height: 580px !important;}
}

@media screen and (max-width:576px) {
    .gw-main-visual-bottom-container{padding: 0 20px;bottom:20px;}
    #gw-theme-main-visual{padding-top:90px;height: 400px;}
    #gw-theme-main-visual .gw-main-visual-text-box{padding: 0 20px;}
    #gw-theme-main-visual .gw-main-visual-text01{font-size:40px;}
    .gw-main-visual-scroll{right: 20px;}
    #gw-theme-main-visual .gw-slide-btn-container {width: 100%;}
    #gw-theme-main-visual .gw-slide-btn-container .gw-btn01 {max-width: 100%;width: 100%;padding: 12px 0;height: auto;line-height: inherit;}
	#gw-theme-main-visual .gw-no-banner .gw-title{padding:40px 20px 20px 20px;}
    .gw-main-visual-arrow > div{width: 30px;height: 30px;}
    .gw-main-visual-arrow .swiper-button-prev:after, .gw-main-visual-arrow .swiper-button-next:after{font-size: 14px;}
    .swiper-pagination-bullet-active{width: 7px;height: 7px;}
    .swiper-pagination-bullet{width: 5px;height: 5px;}
    .gw-main-visual-scroll > ul > li{font-size: 10px;}
}

@media screen and (max-width:375px) {
    #gw-theme-main-visual .gw-main-visual-text-con .gw-main-visual-text01{font-size: 40px;}
    .gw-main-visual-arrow > div{width: 40px;height: 40px;}
    .swiper-pagination-bullet{width: 6px;height: 6px;}
    .swiper-pagination-bullet-active{width: 8px;height: 8px;}

}

/*design_5 끝*/

/* =======================================================================
   PATCH: 그리드형 메인배너 대응 (슬라이더 높이/요소 덮어쓰기)
   - 기존 슬라이더 전용 height 고정 해제
   - 배경/패딩을 그리드 섹션에 맞춤
   - 슬라이더 잔여 UI 숨김
   - 모바일에서도 2열(초소형 1열) 레이아웃 유지에 필요한 기본 가드
   ======================================================================= */

/* 연한 회색 배경 기본값(전역 변수 없을 때 대비) */
:root{
  --mb-section-bg: #f3f5f7;
}

/* 루트 섹션: 높이 고정 제거 + 배경 통일 */
#gw-theme-main-visual{
  height: auto !important;
  padding-top: 0 !important;
  background: var(--mb-section-bg) !important;
  overflow: visible !important;
}

/* 내부 컨테이너 높이 고정 제거 */
#gw-theme-main-visual .gw-visual{
  height: auto !important;
}

/* 슬라이더 기본 요소들의 height 고정 해제 */
#gw-theme-main-visual .swiper-container,
#gw-theme-main-visual .swiper-wrapper,
#gw-theme-main-visual .swiper-slide{
  height: auto !important;
  min-height: 0 !important;
}

/* 슬라이더 잔여 UI 완전 숨김(화살표/도트/스크롤 표시 등) */
#gw-theme-main-visual .gw-main-visual-bottom-container,
#gw-theme-main-visual .gw-main-visual-bottom,
#gw-theme-main-visual .gw-main-visual-scroll,
#gw-theme-main-visual .gw-main-visual-arrow,
#gw-theme-main-visual .gw-main-visual-dot,
#gw-theme-main-visual .swiper-pagination,
#gw-theme-main-visual .swiper-button-next,
#gw-theme-main-visual .swiper-button-prev{
  display: none !important;
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden !important;
}

/* 반응형에서 기존 고정 높이 무력화 */
@media screen and (max-width: 1280px){
  #gw-theme-main-visual{ height: auto !important; }
}
@media screen and (max-width: 1024px){
  #gw-theme-main-visual{ height: auto !important; }
}
@media screen and (max-width: 576px){
  #gw-theme-main-visual{ height: auto !important; }
}

/* (보험) 그리드 섹션이 있을 때 섹션 배경/패딩 유지 */
.gw-visual-grid-wrap{
  background: var(--mb-section-bg) !important;
  /* mainbanner.skin.php 내 인라인 스타일(패딩 24px)이 우선이지만,
     만약 해당 스타일이 변경되면 아래값이 기본 가드가 됩니다. */
  padding: 24px !important;
}

/* =========================================================
   PATCH: 모바일에서 고정 헤더가 배너를 가리는 문제 보정
   - 헤더 높이 변수로 관리
   - iOS safe-area 대응
   - 첫 섹션(anchor 점프 시 포함) 오프셋 적용
   ========================================================= */
:root{
  /* 모바일 헤더 실제 높이에 맞춰 조정하세요 (예: 56~68px) */
  --mob-header-h: 64px;
}

/* 모바일/태블릿 구간에서만 헤더 높이만큼 상단 패딩 부여 */
@media (max-width: 1024px){
  #gw-theme-main-visual{
    /* 앞서 0으로 덮어쓴 걸 다시 보정 */
    padding-top: calc(var(--mob-header-h) + env(safe-area-inset-top, 0px)) !important;
  }
  /* 앵커 스크롤 시 헤더 뒤에 가려지지 않도록 */
  .gw-visual-grid-wrap{
    scroll-margin-top: calc(var(--mob-header-h) + 8px);
  }
}