
/* trigger */
.selbox__trigger{
	display:flex;
	align-items:center;
	justify-content:space-between;

	width: 100%;
	height: 35px;
	border-radius: 18px;
	border: 1px solid var(--border);
	background:#fff;
	box-sizing: border-box;
	cursor:pointer;

	padding: 0 14px;
	font-size: 15px;
}

/* ±âº» »óÅÂ */
.selbox__text{
  color: var(--placeholder);
}

/* ¼±ÅÃµÈ »óÅÂ */
.selbox__trigger.is-selected{
	border-color: var(--trg-border);
}
.selbox__trigger.is-selected .selbox__text{
  color: var(--trg-text);
}


/* arrow */
.selbox__arrow{
  width:8px;
  height:8px;
  border-right:1px solid #666;
  border-bottom:1px solid #666;
  transform:rotate(45deg);
  transition:transform .1s ease;
}
.selbox__arrow2{
  width:8px;
  height:15px;
  border-right:2px solid #666;
  border-bottom:2px solid #666;
  transform:rotate(45deg);
  transition:transform .1s ease;
}
/* trigger */


/* dim */
.b-sheet-dim{
  position: fixed;
  inset: 0;
  background: rgba(0,0,0,.45);/* ÁøÇÏ°Ô */
  opacity: 0;
  visibility: hidden;
  transition: opacity .25s ease;
  z-index: 9998;
}


/* ÄÁÅ×ÀÌ³Ê ÆÐ³Î */
.b-sheet__panel{
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  max-height: 85vh; /* ´õ ³ô°Ô 90~95 */
  background: #fff;
  border-radius: 16px 16px 0 0;
  transform: translateY(110%);
  transition: transform .4s cubic-bezier(.25,.8,.25,1); /* ¿Ã¶ó¿À´Â ¼Óµµ */
  z-index: 9999;
}

/* ³»ºÎ */
.b-sheet__header{
  display: flex;
  justify-content: space-between;
  padding: 14px;
  border-bottom: 1px solid #eee;
}
.b-sheet__title{
  font-size:17px;
}


.b-sheet__body{
  padding: 14px;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch; /* iOS ÇÊ¼ö */
  overscroll-behavior: contain;
  touch-action: pan-y;
}
.b-sheet__footer{
  padding: 12px 14px;
  border-top: 1px solid #eee;
}


/* ¿­¸² »óÅÂ */
.b-sheet-wrap.is-open{
  overflow: hidden;
}

.b-sheet-wrap.is-open .b-sheet-dim{
  opacity: 1;
  visibility: visible;
}

.b-sheet-wrap.is-open .b-sheet__panel{
  transform: translateY(0);
}

.b-sheet-wrap.is-open .selbox__arrow{
  transform: rotate(-135deg);
}


/* (¼±ÅÃ) À§¿¡ ¼ÕÀâÀÌ ¹Ù */
.b-sheet__handle{
  height: 40px;               /* ÅÍÄ¡ ¿µ¿ª È®´ë */
  display:flex;
  align-items:center;
  justify-content:center;

  touch-action: none;
  cursor: grab;
  user-select:none;
}

/* ½ÇÁ¦ º¸ÀÌ´Â ¸·´ë */
.b-sheet__handle::before{
  content:"";
  width:44px;
  height:5px;
  border-radius:999px;
  background: rgba(0,0,0,.25);
}



html.b-sheet-lock{
  overflow: hidden;
}