@charset "UTF-8";

/* 공통 알림 팝업 (BNKui.alert)
   구조는 .lysheet.half 를 그대로 쓰고, 날짜 다이얼(9900) 등 위에 겹치도록 z-index만 올린다. */
.lysheet.half[data-bnk-alert] {
  z-index: 10000;
}

.lysheet.half[data-bnk-alert] > .bnk-alert {
  position: relative;
  z-index: 1;
  flex-shrink: 0;
}

.bnk-alert {
  width: 100%;
  max-width: 320px;
  border-radius: var(--radius-10);
  background: var(--foundation-font-white);
  box-shadow: 0 8px 24px rgba(2, 12, 34, 0.16);
  overflow: hidden;
  box-sizing: border-box;
  animation: bnkAlertPopIn 0.2s ease-out;
}

.bnk-alert-body {
  padding: 32px 24px 24px;
  text-align: center;
}

.bnk-alert-title {
  color: var(--foundation-font-black);
  font-size: 1.8rem;
  font-style: normal;
  font-weight: 800;
  line-height: 140%;
  letter-spacing: -0.09px;
}

.bnk-alert-title + .bnk-alert-msg {
  margin-top: 12px;
}

.bnk-alert-msg {
  color: var(--foundation-font-gray-1);
  font-size: 1.5rem;
  font-style: normal;
  font-weight: 500;
  line-height: 150%;
  letter-spacing: -0.075px;
  word-break: keep-all;
}
.bnk-alert-msg.ty1 {
  text-align:left;
  color: var(--foundation-font-black);

font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 24px */
letter-spacing: -0.08px;
}

.bnk-alert-footer {
  padding: 0 16px 16px;
}

.bnk-alert-footer .bnk-btn {
  width: 100%;
}

.bnk-alert--icon .bnk-alert-body {
  padding: 32px 20px 24px;
}

.bnk-alert--icon .bnk-alert-img .bnk-icon,
.bnk-alert--icon .bnk-alert-img .lottie-icon {
  display: block;
  width: 56px;
  height: 56px;
  margin: 0 auto;
}

.bnk-alert--icon .bnk-alert-img .lottie-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}

.bnk-alert--icon .bnk-alert-img + .bnk-alert-msg {
  margin-top: 24px;
  color: var(--foundation-font-black);
  font-size: 2rem;
  font-style: normal;
  font-weight: 800;
  line-height: 146%;
  letter-spacing: -0.1px;
}

.bnk-alert--icon .bnk-alert-footer {
  padding: 0 20px 16px;
}

.bnk-alert--icon .bnk-alert-footer .bnk-btn {
  width: 100%;
  max-width: 280px;
  margin: 0 auto;
  display: flex;
}

@keyframes bnkAlertPopIn {
  from { opacity: 0; transform: translateY(8px) scale(0.98); }
  to { opacity: 1; transform: translateY(0) scale(1); }
}

/* 알람팝업 - 스크린 뷰 */
.alarm-screen {
  display: flex;
  padding:0 20px
}

.alarm-screen.bnk-grid-top0 {padding:0}

.alarm-screen .alarm-screen-content {padding-top: 16px;flex:1}
.alarm-screen .alarm-screen-content.bnk-grid-padding-top0 {padding-top: 0}
.alarm-screen .alarm-screen-content.bnk-grid-padding-top01 {padding-top: 16px}
.alarm-screen .alarm-screen-content.bnk-grid-padding-top02 {padding-top: 24px}
.alarm-screen .alarm-screen-content.bnk-grid-padding-top03 {padding-top: 32px}
.alarm-screen .alarm-screen-content.bnk-grid-padding-top04 {padding-top: 48px}
.alarm-screen .alarm-screen-content.bnk-grid-padding-top05 {padding-top: 38px}
.alarm-screen .alarm-screen-content.bnk-grid-padding-top06 {padding-top: 40px}


.alarm-screen .alarm-screen-content .alarm-msgbox { }
.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img { }
.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img .bnk-icon {display: block;width: 56px;height: 56px;margin: 0 auto;}
.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img .bnk-icon.icon-call2 {width: 78px;height: 78px;}
.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img .lottie-icon {
  display: block;
  width: 56px;
  height: 56px;
  margin: 0 auto;
}

.alarm-screen.lottie-type01 .alarm-screen-content .alarm-msgbox .alarm-img .lottie-icon {
 
  width: 92px;
  height: 92px;
 
  margin-top: -5px;
}

.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img.lg .lottie-icon {
  width: 112px;
  height: 112px;
  margin: 0 auto;
}

.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img.ty1 .lottie-icon {
  transform: scale(1.631);
  transform-origin: center;
}

.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img.ty2 .lottie-icon {
  transform: scale(1.038);
  transform-origin: center;
}

.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img.ty3 .bnk-icon,
.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img.ty3 .lottie-icon {
  width: 48px;
  height: 48px;
}


.alarm-screen.lottie-type01 .alarm-screen-content .alarm-msgbox .alarm-msg {
  margin-top:0
}

.alarm-screen.lottie-type02 .alarm-screen-content .alarm-msgbox .alarm-img .lottie-icon {
 
  width: 78px;
  height: 78px;
 
}

.alarm-screen.lottie-type02 .alarm-screen-content.bnk-grid-padding-top04 {
  padding-top: 38px;
}


.lysheet.half .lysheet-content  .alarm-screen.lottie-type02 .alarm-screen-content .alarm-msgbox .alarm-img + .alarm-msg
 {
  margin-top:12px;

}


.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img .lottie-icon svg {
  width: 100%;
  height: 100%;
  display: block;
}
.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img.lg .bnk-icon {width: 112px;height: 112px;}

.alarm-screen .alarm-screen-content .alarm-msgbox .hd3 + .stxt {margin-top: 16px}
.alarm-screen .alarm-screen-content .alarm-msgbox .stxt + .alarm-img.lg {margin-top: 100px}

/* 보정 : 공통에서 안쓰지만 이미 쓴것때문에 남겨둠 */
.alarm-screen.ty1 .alarm-screen-content {padding:0}
.alarm-screen.ty2 .alarm-screen-content {padding-top:48px}
.alarm-screen.ty3 .alarm-screen-content {padding-top:32px} 
.alarm-screen.ty4 .alarm-screen-content {padding-top:20px} 

.tablist .alarm-screen.ty4 .alarm-screen-content,
.tabcont .cont .alarm-screen.ty4 .alarm-screen-content {padding-top:24px}


.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg {margin-top: 24px;text-align: center;color: var(--foundation-font-black);text-align: center;font-size: 2rem;font-style: normal;font-weight: 800;line-height: 146%; /* 29.2px */letter-spacing: -0.1px;}
.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg.bnk-grid-top01 {
  margin-top:16px
}
.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg.lt {text-align: left}


.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg + .bnk-btnset {
  margin-top:24px
}

.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg + .bnk-btnset.bnk-grid-top02 {
  margin-top:32px
}


.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg.ty1 { 
  color: var(--foundation-font-gray-1);
font-size: 1.4rem;
font-style: normal;
font-weight: 400;
line-height: 150%; /* 21px */
letter-spacing: -0.07px;
}

.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg.ty1.ct {
  text-align: center;
}

.lysheet.half .lysheet-header.alert-header-close {
  justify-content: flex-end;
  min-height: 56px;
  padding: 16px 20px 0;
  box-sizing: border-box;
}

.lysheet.half .lysheet-header.alert-header-close .bnk-btn.icon {
  position: static;
}

.alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg + .alarm-msg.ty1 {
  margin-top:16px
}

/* Pattern Lock (login08) */
.pattern-lock {
  --dot: 22px;
  position: relative;
  width: min(280px, 100%);
  aspect-ratio: 1 / 1;
  margin: 16px auto 0;
  touch-action: none;
}
.pattern-lock .node.active {
  background: var(--foundation-primary-bnk-red);
  /* box-shadow: 0 0 0 10px rgba(210, 19, 0, .25); */
}
.pattern-lock .pattern-lines {
  position: absolute;
  inset: 0;
  pointer-events: none;
}
.pattern-lock .pattern-instructions {
  text-align: center;
  margin-top: 12px;
  font-size: 1.4rem;
  color: #6b7280;
}

.pattern-lock {position: relative;width: 232px;height: 232px;margin: 0 auto 0;touch-action: none;}
.pattern-lock .grid {position: absolute;inset: 0;display: grid;grid-template-columns: repeat(3, 16px);grid-template-rows: repeat(3, 16px);gap: 72px;padding: 0;align-content: center;justify-content: center;/* border: 1px solid #f00; */left: 0;right: 0;/* width: 100%; */}
.pattern-lock .node {width: 16px;height: 16px;border-radius: 9999px;background: #9ca3af;border: none;outline: none;cursor: pointer;}
.pattern-lock .pattern-lines { position: absolute; inset: 0; pointer-events: none; }
.pattern-lock .pattern-instructions { text-align: center; margin-top: 12px; font-size: 1.4rem; color: #6b7280; }


/* 간편 비밀번호 설정 login09 */
.simple-pw {
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 32px;
}

.simple-pw .pw-indicators {
  display: flex;
  gap: 10px;
  justify-content: center;
}

.simple-pw .pw-indicator {
  width: 16px;
  height: 16px;
  border-radius: 50%;
  background-color: var(--foundation-font-gray-4);
  transition: background-color 0.2s;
}

.simple-pw .pw-indicator.active {
  background-color: var(--foundation-primary-bnk-red);
}

.simple-pw .keypad {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0;
  width: 100%;
  /* max-width: 300px; */
  padding: 0 12px;
}

.simple-pw .keypad-key {
  /* aspect-ratio: 1; */
  cursor: pointer;
  transition: all 0.15s;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  -webkit-tap-highlight-color: transparent;
  color: var(--foundation-font-black);
  text-align: center;
  font-size: 1.8rem;
  font-style: normal;
  font-weight: 700;
  line-height: 100%; /* 18px */
  letter-spacing: -0.09px;
  height: 40px;
  /* border: 1px solid #f00; */
}



.simple-pw .keypad-key:active {
  /* background-color: var(--foundation-bg-bg-2); */
  transform: scale(0.95);

}

.simple-pw .keypad-key.pressed {
  border-color: var(--palette-purple-base);
  border-width: 2px;
}

.simple-pw .keypad-key.delete {
  border: none;
  background-color: transparent;
}
.simple-pw .keypad-key.delete .bnk-icon.keypad-arrow-left {
  width: 17px;
  height: 14px;
}

.simple-pw .keypad-key.rearrange {
  /* background-color: var(--foundation-bg-bg-white); */
  font-size: 1.4rem;
  color: var(--foundation-font-black);
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 700;
  line-height: 100%; /* 16px */
  letter-spacing: -0.08px;
}

.simple-pw .keypad-key.rearrange:active {
  /* background-color: var(--foundation-bg-bg-2); */
}

.simple-pw .pressed-ripple {
  position: absolute;
  width: 100%;
  height: 100%;
  border-radius: var(--radius-6);
  
  animation: simple-pw-ripple 0.4s ease-out;
  pointer-events: none;
}

@keyframes simple-pw-ripple {
  from {
      transform: scale(0.8);
      opacity: 0.5;
      background-color: var(--palette-purple-lighter);
  }
  to {
      transform: scale(1.2);
      opacity: 0;
  }
}

.lysheet .viewbox {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 24px;
  padding:0 0 0 0
}
.lysheet.view.certi01 .viewbox {
  padding-top:32px
}
.lysheet.view.certi01 .lysheet-body { 
  padding-bottom:56px
}

.lysheet.view.certi02 .viewbox {
  padding-top:16px
}

.lysheet.view.certi03 .viewbox {
  padding-top: 32px;
}
.lysheet.view.certi03 .lysheet-body {
  padding-bottom:40px;
  padding-left: 0;
  padding-right: 0;
}


.lysheet.view.amount-sheet .viewbox {padding-top:16px}
.lysheet.view.amount-sheet .lysheet-body {
    padding-left: 0;
    padding-right: 0;
}

.viewbox .bnk-icon {
  width:72px;
  height:72px;
  margin: 0 auto;
  display: block;
}

.lysheet {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9900;
  visibility: hidden;
  pointer-events: none;
}
.lysheet .lysheet-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--foundation-bg-bg-white);
  z-index: 100;
  border-radius: var(--radius-15) var(--radius-15) 0 0;
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

.lysheet .lysheet-content.size1 {
  height: calc(100vh / 1.33);
}
.lysheet .lysheet-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  /* height: 64px; */
  padding: 20px 20px 20px;
  position: relative;
}
.lysheet .lysheet-header #close-lysheet-icon {
  position:absolute;
  top: 27px;
  flex: none;
  bottom: auto;
}

.lysheet .lysheet-header.ty1 {
  padding-top:32px;
  display: block;
}

.lysheet .lysheet-header.ty2 {align-items: flex-start;}
.lysheet .lysheet-header.ty2 .hd4 {
  color: var(--foundation-font-black);
/* Body/16_B_150%_-0.5% */
font-family: "Pretendard Variable";
font-size: 16px;
font-style: normal;
font-weight: 700;
line-height: 150%; /* 24px */
letter-spacing: -0.08px;
}

.lysheet .lysheet-header .gnb {
  display:flex;
  gap: 8px;
}


.lysheet .lysheet-header .hd3 {
  font-size:1.8rem
}
.lysheet .lysheet-header .hd4 { 
  margin: 0; 
  color: var(--foundation-font-black);

font-size: 1.6rem;
font-style: normal;
font-weight: 700;
line-height: 100%; /* 16px */
letter-spacing: -0.08px;
}
.lysheet .lysheet-header .bnk-btn.icon {padding: 0;/* position: absolute; */right: 16px;top: 0;bottom: 0;/* margin: auto; */}
.lysheet .lysheet-body {
  padding: 0 20px 24px 20px;
  position: relative;
}

.lysheet.half .lysheet-body.bnk-grid-padding-side0 {
  padding-left:0; padding-right:0;
}

.lysheet.half .lysheet-body.bnk-grid-padding-0,
.lysheet .lysheet-body.bnk-grid-padding-0 {padding:0}

.lysheet.full .lysheet-body.bnk-grid-padding-top01,
.lysheet .lysheet-body.bnk-grid-padding-top01 {padding-top:16px;/* padding: 0; */}
.lysheet .lysheet-body.bnk-grid-padding-top02 {padding-top:32px}


.lysheet.view.full .lysheet-body.bnk-grid-padding-top03,
.lysheet .lysheet-body.bnk-grid-padding-top03 {padding-top:24px}

.lysheet .bg-cover {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background:  rgba(0, 0, 0, 0.70);
  z-index: 0;
  border-radius: 0;
  opacity: 0;
  transition: opacity 0.3s ease;
}
/* 레이어 시트 관련 */
.lysheet.active {
  visibility: visible;
  pointer-events: auto;
}
.lysheet.active .lysheet-content {
  transform: translateY(0);
}
.lysheet.active .bg-cover {
  opacity: 1;
}

body:has(.lysheet.active),
body:has(.lysheet[aria-hidden="false"]) {
  overflow: hidden;
}

html:has(.lysheet.active),
html:has(.lysheet[aria-hidden="false"]) {
  overflow: hidden;
}

.container:has(.lysheet.active),
.container:has(.lysheet[aria-hidden="false"]) {
  height: 100dvh;
  overflow: hidden;
}

.lysheet.active .lysheet-body {
  overscroll-behavior: contain;
}

.lysheet.content-fit .lysheet-content {
  display: flex;
  flex-direction: column;
  height: auto;
  overflow: hidden;
}

.lysheet.content-fit .lysheet-header {
  flex-shrink: 0;
}

.lysheet.content-fit .lysheet-body {
  flex: 1 1 auto;
  min-height: 0;
}

.lysheet.content-fit.is-height-capped .lysheet-body {
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  scroll-padding-bottom: 24px;
}

.lysheet.transfer-bank-sheet .lysheet-header {
  padding-top: 24px;
  padding-bottom: 16px;
}

.lysheet.transfer-bank-sheet:not(.view.full) .lysheet-body {
  padding-left: 20px;
  padding-right: 20px;
  padding-bottom: calc(24px + env(safe-area-inset-bottom, 0px));
}

.lysheet.transfer-bank-sheet .transfer-bank-list > li .item-wrap {
  width: 100%;
  border: none;
  background: transparent;
  text-align: left;
  cursor: pointer;
  font: inherit;
  color: inherit;
}

.lysheet.transfer-bank-sheet .transfer-bank-list > li .item-wrap .item-header {
  display: flex;
  align-items: center;
  gap: 12px;
}

.lysheet.transfer-bank-sheet .transfer-bank-list > li .item-wrap .item-header img.bank-logo {
  flex-shrink: 0;
  width: 24px;
  height: 24px;
}

.lysheet.transfer-bank-sheet .transfer-bank-list > li .item-wrap .item-header .item-title .item-subject {
  color: var(--foundation-font-black);
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 150%;
  letter-spacing: -0.08px;
}

/* 은행/증권 선택 풀팝업 — 제목·탭은 고정, 목록만 스크롤 */
.lysheet.view.full.transfer-bank-sheet:has(.bank-sheet-scroll) .lysheet-body > .bnk-row:first-child {
  flex-shrink: 0;
}

.lysheet.view.full.transfer-bank-sheet .lysheet-body > .bank-sheet-scroll {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
}

.lysheet.view.full.transfer-bank-sheet .bank-sheet-scroll .bnk-tab {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  min-height: 0;
}

.lysheet.view.full.transfer-bank-sheet .bank-sheet-scroll .tablist {
  flex-shrink: 0;
}

.lysheet.view.full.transfer-bank-sheet .bank-sheet-scroll .tabcont {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
}

input:focus {
  caret-color: var(--foundation-primary-bnk-red); 
}

.lysheet.full {
  inset: 0;
  width: 100%;
  max-width: 100%;
  height: 100%;
}

/* 전창 시트 — 짧은 화면 스크롤 방지, 본문만 스크롤 */
html:has(.lysheet.full.active),
html:has(.lysheet.full[aria-hidden="false"]) {
  overflow: hidden;
}
body:has(.lysheet.view.full.active),
body:has(.lysheet.view.full[aria-hidden="false"]) {
  min-height: 100dvh;
  height: 100dvh;
  overflow: hidden;
}

.container:has(.lysheet.view.full.active),
.container:has(.lysheet.view.full[aria-hidden="false"]) {
  height: 100dvh;
  overflow: hidden;
}

.lysheet.view.full .lysheet-content {
  display: flex;
  flex-direction: column;
  height: 100dvh;
  max-height: 100dvh;
  overflow: hidden;
}

.lysheet.view.full .lysheet-header {
  flex-shrink: 0;
}

.lysheet.view.full .lysheet-body {
  display: flex;
  flex-direction: column;
  flex: 1 1 0%;
  min-height: 0;
  overflow: hidden;
  padding: 16px 0 0;
}

.lysheet.view.full .lysheet-body .transfer-manage-body,
.lysheet.view.full .lysheet-body .lysheet-scroll-body {
  flex: 1 1 0%;
  min-height: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior: contain;
  /* padding: 0 20px; */
}

.lysheet.view.full .lysheet-body > .bnk-row.fixed {
  position: static;
  flex-shrink: 0;
  transform: none;
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  z-index: auto;
  padding-left: 20px;
  padding-right: 20px;
  padding-top: 16px;
  padding-bottom: max(20px, env(safe-area-inset-bottom, 0px));
  background: var(--foundation-bg-bg-white);
}

.lysheet.full .lysheet-content  {
  inset: 0;
  width: 100%;
  max-width: 100%;
  height: 100%;
  border-radius: 0;
  transition:none
}

.lysheet-memo .lysheet-content {
    display: flex;
    flex-direction: column;
    max-height: 100vh;
}

.lysheet-memo .memo-keypad-wrap {
    display: none;
}

.lysheet-memo.keypad-open .memo-keypad-wrap {
    display: block;
}

.lysheet-memo .memo-keypad-wrap .cert-password {
    padding: 0;
}

.lysheet.half .lysheet-content {
  /* min-height: 373px; */
  /* background:#f00; */
  top: 0;
  margin: auto;
  left: 0;
  right: 0;
  border-radius: var(--radius-10);
  position: relative;
  display: flex;
  width: 100%;
  justify-content: center;
  flex-direction: column;
}

/* ===== 다이얼 형식 날짜 선택기 ===== */
.date-dial-modal {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 9900;
  visibility: hidden;
  pointer-events: none;
}

.date-dial-modal.active {
  visibility: visible;
  pointer-events: auto;
}

.date-dial-modal .date-dial-overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.70);
  z-index: 1;
  opacity: 0;
  transition: opacity 0.3s ease;
}

.date-dial-modal.active .date-dial-overlay {
  opacity: 1;
}

.date-dial-modal .date-dial-content {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  background: var(--foundation-bg-bg-white);
  z-index: 2;
  border-radius: var(--radius-15) var(--radius-15) 0 0;
  transform: translateY(100%);
  transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  max-height: 70vh;
  display: flex;
  flex-direction: column;
}

.date-dial-modal.active .date-dial-content {
  transform: translateY(0);
}

.date-dial-modal .date-dial-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 24px 20px 16px;
}

.date-dial-modal .date-dial-header .hd4 {
  margin: 0;
  color: var(--foundation-font-black);
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 700;
  line-height: 100%;
  letter-spacing: -0.08px;
}

.date-dial-modal .date-dial-header .bnk-btn.icon {
  padding: 0;
}

.date-dial-modal .date-dial-body {
  flex: 1;
  overflow: hidden;
  padding: 16px 20px 24px;
  position: relative;
  display: flex;
  align-items: center;
}

.date-dial-modal .date-dial-wheels {
  display: flex;
  align-items: stretch;
  height: 168px;
  width: 100%;
  position: relative;
  padding: 0 16px;
  box-sizing: border-box;
}

/* 고정 선택 영역 (Figma: bg-popup-2) */
.date-dial-modal .date-dial-wheels::before {
  content: '';
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  transform: translateY(-50%);
  height: 56px;
  border-radius: var(--radius-6);
  background: var(--foundation-bg-bg-1);
  pointer-events: none;
  z-index: 1;
}

.date-dial-modal .date-dial-column {
  position: relative;
  overflow: hidden;
  height: 168px;
  z-index: 2;
}

.date-dial-modal .date-dial-column[data-type="year"] {
  flex: 1 1 0;
  min-width: 0;
  max-width: none;
}

.date-dial-modal .date-dial-column[data-type="month"],
.date-dial-modal .date-dial-column[data-type="day"] {
  flex: 0 0 90px;
  max-width: 90px;
}

.date-dial-modal .date-dial-items {
  height: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  scroll-snap-type: y mandatory;
  -webkit-overflow-scrolling: touch;
  padding: 56px 0;
  scrollbar-width: none;
  -ms-overflow-style: none;
  touch-action: pan-y;
  cursor: grab;
  scroll-behavior: smooth;
  position: relative;
  z-index: 2;
}

.date-dial-modal .date-dial-items:active {
  cursor: grabbing;
}

.date-dial-modal .date-dial-items.lock-snap {
  scroll-behavior: auto;
}

.date-dial-modal .date-dial-items::-webkit-scrollbar {
  display: none;
}

.date-dial-modal .date-dial-item {
  height: 56px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  font-size: 1.6rem;
  font-style: normal;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.08px;
  color: var(--foundation-font-gray-4);
  scroll-snap-align: center;
  transition: color 0.2s ease, font-weight 0.2s ease;
  user-select: none;
  -webkit-user-select: none;
  background: transparent;
}

.date-dial-modal .date-dial-item.selected {
  color: var(--foundation-font-black);
  font-weight: 700;
  font-size: 1.6rem;
}

.date-dial-modal .date-dial-footer {
  display: flex;
  gap: 8px;
  padding: 16px 20px 24px;
}

.date-dial-modal .date-dial-footer .bnk-btn {
  flex: 1;
  min-width: 0;
  border-radius: var(--radius-8);
  height: 56px;
}

.date-dial-modal .date-dial-footer .bnk-btn.secondary {
  flex: 0 1 38.75%;
}

.date-dial-modal .date-dial-footer .bnk-btn.primary {
  flex: 1 1 61.25%;
}

/* 레이어 반창타입 알람스크린 */
.lysheet.half {display: flex;align-items: center;padding: 0 20px;}
.lysheet.half .lysheet-content  .alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg { 
  margin-top:0
}

.lysheet .lysheet-content  .alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg + .alarm-msg {
  margin-top:16px
}

.lysheet .lysheet-content .alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg.ty1 + .alarm-msg.ty1 {
  margin-top:8px
}
.lysheet.half .lysheet-content  .alarm-screen .alarm-screen-content .alarm-msgbox .bnk-inputset.ckbox + .bnk-btnset,
.lysheet.half .lysheet-content  .alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg + .bnk-inputset.ckbox {margin-top:24px}

.lysheet.half .lysheet-content  .alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img + .bnk-inputset.ckbox,
.lysheet.half .lysheet-content  .alarm-screen .alarm-screen-content .alarm-msgbox .alarm-img + .alarm-msg {margin-top:24px}
.lysheet .lysheet-content .alarm-screen .alarm-screen-content .alarm-msgbox .alarm-msg + .bnk-row.min {margin-top: 16px;}
.lysheet .lysheet-content .alarm-screen .alarm-screen-content .alarm-msgbox .displaybox .stxt.sm + .hd2 {margin-top: 4px;}
.lysheet.half .lysheet-body {padding: 0 20px 16px 20px;width: 100%;}
.lysheet.half .alarm-screen {padding:0}

/* .lysheet.half.lv1 .lysheet-content {height:182px}
.lysheet.half.lv2 .lysheet-content {height:270px} */

/* ===== 토스트 팝업 (Figma ETC / Toast) ===== */
.bnk-toast {
  position: fixed;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9900;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  animation: toastSlideIn 0.3s ease-out;
  border-radius: var(--radius-6);
  background: #111;
  backdrop-filter: blur(5px);
  padding: 12px 16px;
  max-width: calc(100% - 40px);
}

.bnk-toast .bnk-toast-message {
  color: var(--foundation-font-white);
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 1;
  letter-spacing: -0.07px;
  text-align: center;
  white-space: nowrap;
}

.bnk-toast .bnk-toast-message.is-compound {
  display: flex;
  flex-direction: column;
  gap: 8px;
  align-items: flex-start;
  white-space: normal;
}

.bnk-toast .bnk-toast-message .stxt {
  display: block;
  color: var(--foundation-font-white);
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 100%;
  letter-spacing: -0.07px;
  text-align: center;
  white-space: nowrap;
}

.bnk-toast .bnk-toast-message.is-compound .stxt {
  font-weight: 800;
  line-height: 100%;
  padding-left: 0;
  padding-right: 0;
  text-align: left;
  white-space: normal;
}

.bnk-toast .bnk-toast-message .stxt.ty1 {
  color: var(--foundation-font-gray-3);
  font-size: 1.2rem;
  font-weight: 400;
  letter-spacing: -0.06px;
  line-height: 1;
  text-align: left;
  white-space: normal;
}

.bnk-toast.bnk-toast-top {
  top: 20px;
}

.bnk-toast.bnk-toast-bottom {
  bottom: 92px;
}

.bnk-toast.bnk-toast-above-anchor {
  top: auto;
}

.bnk-toast.bnk-toast-center {
  top: 50%;
  transform: translate(-50%, -50%);
  animation: toastSlideInCenter 0.3s ease-out;
}

.bnk-toast.bnk-toast-error {
  background-color: #111;
  color: var(--foundation-font-white);
}

.bnk-toast.bnk-toast-success {
  background-color: var(--palette-green-dark);
  color: var(--foundation-font-white);
}

.bnk-toast.bnk-toast-info {
  background-color: #1976d2;
  color: var(--foundation-font-white);
}

.bnk-toast.bnk-toast-warning {
  background-color: #f57c00;
  color: var(--foundation-font-white);
}



@keyframes toastSlideIn {
  from {
    opacity: 0;
    transform: translateX(-50%) translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
}

@keyframes toastSlideInCenter {
  from {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0.9);
  }
  to {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes toastSlideOut {
  from {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
  to {
    opacity: 0;
    transform: translateX(-50%) translateY(20px);
  }
}

/* Bottom Sheet — viewport 고정 오버레이 (본문 레이아웃과 분리) */
.bottom-sheet.ty1 {
  --bottom-sheet-content-padding: 16px;
  --bottom-sheet-anchor-top: 56px;
  --bottom-sheet-collapsed-height: 364px;
  --bottom-sheet-max-height: calc(100dvh - var(--bottom-sheet-anchor-top));
  position: fixed;
  bottom: 0;
  left: 0;
  right: 0;
  z-index: 90;
  height: var(--bottom-sheet-collapsed-height);
  max-height: var(--bottom-sheet-max-height);
  display: flex;
  flex-direction: column;
  border-radius: var(--radius-15) var(--radius-15) 0 0;
  background: var(--foundation-bg-bg-white);
  box-shadow: 0 0 10px rgba(2, 16, 48, 0.08);
  transition: height 0.28s ease;
  will-change: height;
  pointer-events: auto;
}
.bottom-sheet.ty1.is-dragging {
  transition: none;
}
.bottom-sheet.ty1.is-anchor-locked {
  top: var(--bottom-sheet-anchor-top);
  height: auto !important;
  bottom: 0;
  max-height: none;
  overflow: visible;
}
.bottom-sheet.ty1 .bottom-sheet-inner {
  display: flex;
  flex-direction: column;
  min-height: inherit;
  max-height: inherit;
  height: 100%;
}
.bottom-sheet.ty1 .bnk-tab.sheet-tab {
  display: flex;
  flex-direction: column;
  min-height: inherit;
  max-height: inherit;
  height: 100%;
}
.bottom-sheet.ty1 .bnk-tab.sheet-tab::after {
  display: none;
}
.bottom-sheet.ty1 .bnk-tab.sheet-tab .tablist.ty1 {
  flex-shrink: 0;
  border-bottom: 1px solid var(--foundation-line-gray-1);
  background: var(--foundation-bg-bg-white);
  border-radius: var(--radius-15) var(--radius-15) 0 0;
}
.bottom-sheet.ty1 .bottom-sheet-body.tabcont {
  flex: 1 1 auto;
  min-height: 0;
  overscroll-behavior: contain;
  -webkit-overflow-scrolling: touch;
}
.bottom-sheet.ty1.is-collapsed .bottom-sheet-body.tabcont {
  overflow: hidden;
  touch-action: none;
}
.bottom-sheet.ty1.is-expanded .bottom-sheet-body.tabcont {
  overflow: auto;
  touch-action: pan-y;
  overscroll-behavior-y: none;
  box-sizing: border-box;
  padding-bottom: var(--bottom-sheet-content-padding, 16px);
}
.bottom-sheet.ty1 .bnk-tab.sheet-tab > .bottom-sheet-body.tabcont > .cont {
  display: none;
}
.bottom-sheet.ty1 .bnk-tab.sheet-tab > .bottom-sheet-body.tabcont > .cont:first-child {
  display: block;
}
.bottom-sheet.ty1 .sheet-sub-toggle {
  padding: 16px 20px 0;
}
.bottom-sheet.ty1 .bnk-tab.sheet-sub-tab .tablist.ty2 {
  margin-bottom: 8px;
}
.bottom-sheet.ty1 .bnk-tab.sheet-sub-tab .tablist.ty2 > li.on > a {
  border: 2px solid var(--foundation-global-red);
  box-shadow: 0 8px 16px -4px rgba(0, 0, 0, 0.05);
}
.bottom-sheet.ty1 .bnk-tab.sheet-sub-tab .tabcont > .cont {
  display: none;
}
.bottom-sheet.ty1 .bnk-tab.sheet-sub-tab .tabcont > .cont:first-child {
  display: block;
}
.bottom-sheet.ty1 .sheet-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  padding: 16px 0 40px;
  text-align: center;
}
.bottom-sheet.ty1.is-collapsed .sheet-empty,
.bottom-sheet.ty1.is-collapsed .bottom-sheet-body .bnk-list.full.ty3.transfer-list {
  touch-action: none;
}
.bottom-sheet.ty1.is-expanded .sheet-empty,
.bottom-sheet.ty1.is-expanded .bottom-sheet-body .bnk-list.full.ty3.transfer-list {
  touch-action: pan-y;
}
.bottom-sheet.ty1 .sheet-empty .stxt {
  color: var(--foundation-font-gray-1);
  font-size: 1.4rem;
  font-weight: 400;
  line-height: 150%;
  letter-spacing: -0.07px;
}
.bottom-sheet.ty1 .bottom-sheet-body .bnk-list.full.ty3.transfer-list {
  padding: 0 20px var(--bottom-sheet-content-padding, 16px);
}

.bottom-sheet.ty1 .sheet-sub-tab .bnk-list.full.ty3.transfer-list {
  padding: 0 0 var(--bottom-sheet-content-padding, 16px);
}

.has-bottom-sheet {
  padding-bottom: 380px;
}

/* transfer03 step01 — 상단 입력영역 1화면 고정, 바텀시트만 드래그/스크롤 */
body:has(.subwrapper.transfer-account-step01-entry.has-bottom-sheet) {
  min-height: 100dvh;
  height: 100dvh;
  overflow: hidden;
}

.container:has(.subwrapper.transfer-account-step01-entry.has-bottom-sheet) {
  height: 100dvh;
  overflow: hidden;
}

.subwrapper.transfer-account-step01-entry.has-bottom-sheet {
  display: flex;
  flex-direction: column;
  box-sizing: border-box;
  height: 100dvh;
  max-height: 100dvh;
  min-height: 0;
  overflow: hidden;
  padding-top: 56px;
  padding-bottom: 0 !important;
  position: relative;
  z-index: 1;
}

.subwrapper.transfer-account-step01-entry.has-bottom-sheet > .bnk-row.bnk-grid-top05 {
  flex-shrink: 0;
}

.subwrapper.transfer-account-step01-entry.has-bottom-sheet .transfer-number-row {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  margin-top: 0;
}

.subwrapper.transfer-account-step01-entry.has-bottom-sheet .amount-display.ty2.transfer-direct-entry {
  width: 100%;
}


.lysheet.half .hd4 {
  max-width:200px;
  word-break: keep-all;
}

.lysheet.half .hd4.ty1 {
  max-width:none;
  word-break: normal;
}

.lysheet.half .hd4.ty1.icon {
  position: relative;
  padding-left: 26px;
  line-height: 150%;
}
.lysheet.half .hd4.ty1.icon .bnk-icon {
  position:absolute; left:0; 
  top:0; bottom:0; margin:auto
}

.lysheet.view.full .lysheet-header {
  justify-content:center
}
.lysheet.view.full .lysheet-header .bnk-btn.icon {
  position:absolute;
  right:16px;
}