@charset "utf-8";

/*========================================================================
좌측 스크롤바
========================================================================*/
.scroll_wrap #scroll_left { position:fixed; top:57% !important; left:auto; right:0; width:auto; transform:translateY(-50%); z-index:130; }
.scroll_wrap #scroll_left.ban_fixed  {  }
.scroll_wrap .scroll-list ul { display:flex; flex:1; width:88px; flex-direction:column; justify-content:center;  border-radius:30px 0  0 30px; background:#fff; box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.20); overflow:hidden; }
.scroll_wrap .scroll-list li { color:#939393; }
.scroll_wrap .scroll-list li p { margin:8px 0 0;  font-size:16px; font-weight:500; text-align:center; }
.scroll_wrap .scroll-list ul li:hover,
.scroll_wrap .scroll-list ul li:first-child { color:#000; background:#7EE56A;  }

.scroll_wrap .scroll-list ul li:hover img,
.scroll_wrap .scroll-list ul li:first-child img { filter: brightness(0); }
.scroll_wrap .scroll-list li a { display:inline-flex; flex-direction:column; justify-content:center; align-items:center; width:100%; height:100%; min-height:118px; }

.scroll_wrap .scroll-list { transform:translateX(100%); transition:transform 0.3s ease; }
.scroll_wrap .scroll-list .btn-toggle { position:absolute; top:50%; left:-28px; width:28px; height:50px; background:url("../img/side_fixed_open.png") no-repeat; box-shadow:0 0 12px 0 rgba(0, 0, 0, 0.20); transform:translateY(-50%); z-index:-1; }
.scroll_wrap .scroll-list.open { transform:translateX(0); }
.scroll_wrap .scroll-list.open .btn-toggle { background:url("../img/side_fixed_close.png") no-repeat; }