@charset "utf-8";

/********************************************************
■ SideBar : 사이드바(모바일 메뉴)
********************************************************/

/* sidebar Box */
#nt_sidebar {top: 0; width: 350px; height:100%; position: fixed; z-index:1000; background: #fff;}
#nt_sidebar .sidebar-content { height: 100%; overflow-y:auto; overflow-x:hidden; -webkit-overflow-scrolling:touch; padding-bottom: 10rem;}

/* Icon */
.sidebar-icon i { font-size:22px; line-height:22px; }

/* Menu */
.sidebar-list h5 { padding: 10px 20px; margin-top: 10px;}
.sidebar-list h5 span {border-bottom: 2px solid; padding: 2px;}
.sidebar-list ul.off { display:none; }
.sidebar-list li { position:relative; }
.sidebar-list li a { display:block; overflow:hidden; }
.sidebar-list li .me-a { padding-right:2.5rem; }

.sidebar-list .me-ul { background:#fff; }
.sidebar-list .me-ul li {border-bottom: 1px solid #eee; padding: 8px 20px;}
.sidebar-list .me-ul li a img {width: 20px;}
.sidebar-list .me-ul1 { background:#f7f7f7 !important; border: 1px solid #eee; border-bottom: 0; margin-top: 10px;}
.sidebar-list .me-ul1 li::before {content: '\f148'; font-family: "FontAwesome"; color: #ddd; transform: rotate(90deg); display: inline-block; position: absolute; top: 7px; left: 11px;}
.sidebar-list .me-ul2 { }
.sidebar-list .me-li1 .me-a1,
.sidebar-list .me-li2 .me-a2 { padding-left: 10px;}
.sidebar-list .me-li.active .me-a,
.sidebar-list .me-li1.active .me-a1,
.sidebar-list .me-li2.active .me-a2 { font-weight:bold; }
.sidebar-list .me-line1 .me-a1 { background:#eee; font-weight:bold; }
.sidebar-list .me-line2 .me-a2 { background:#eee; font-weight:bold; }

.sidebar-list .me-ul-user { display: flex; flex-wrap: wrap; padding: 10px;}
.sidebar-list .me-ul-user>li {flex: 0 0 50%; padding: 5px; position: relative;}
.sidebar-list .me-ul-user>li a {border: 1px solid #eee; background: #f7f7f7; display: block; padding: 10px;}
.sidebar-list .me-ul-user>li a img {width: 20px; position: relative; top: -2px;}

.sidebar-list .me-ul-noti li {padding: 10px 20px; border-bottom: 1px solid #eee;}
.sidebar-list .me-ul-noti li:first-child {border-top: 1px solid #eee;}
.sidebar-list .me-ul-noti li:nth-child(odd) {background: #f7f7f7;}

@media (min-width: 1200px) {
  #nt_sidebar {
    right: -350px;
  }
}
@media (max-width: 1199px) {
  #nt_sidebar {
    left: -100%;
  }
}


#nt_sidebar_header {background: #fff; border-bottom: 1px solid #eee;}
#nt_sidebar_header>div:last-child {font-size: 14px;}
.sidebar_head_menu {display: flex; justify-content: space-between; align-items: center;}
.sidebar_head_menu>a {font-size: 25px;}

.sidebar_content_menu {display: flex; justify-content: space-between; background: #fff; border-bottom: 1px solid #eee;}
.sidebar_content_menu>div {flex: 0 0 33.33333%; padding: 5px;}
.sidebar_content_menu>div a {border: 1px solid #eee; display: flex; flex-direction: column; align-items: center; background: #f7f7f7; border-radius: 5px; padding: 10px;}
.sidebar_content_menu>div a i {font-size: 18px;}

.nt_sidebar_menus {display: flex; justify-content: space-between; padding: 10px 10px 0;}
.nt_sidebar_menus li {flex: 0 0 33.33333%; padding: 5px 5px 0;}
.nt_sidebar_menus li a {position: relative; border: 1px solid #eee; border-radius: 5px; background: #f7f7f7; display: block; text-align: center; padding: 10px 0; font-weight: 500;}
.nt_sidebar_menus img {width: 30px;}

/* Mask */
#nt_sidebar_mask { display:none; position:fixed; z-index:499; background:rgba(0,0,0,0.75); left:0; top:0; width:100%; height:100%; }

/* Noti Tack */
#nt_sidebar_noti { position: fixed; z-index: 100; }
@media (min-width: 1200px) {
	#nt_sidebar_noti { top:40%; right: 0; border-top-left-radius: 50rem !important; border-bottom-left-radius: 50rem !important; }
}
@media (max-width: 1199px) {
	#nt_sidebar_noti { left:0; bottom:25px; border-top-right-radius: 50rem !important; border-bottom-right-radius: 50rem !important; }
}

/* Go to Top */
#nt_sidebar_move { display:none; position: fixed; width: 40px; bottom: 20px; right: 25px; z-index: 2; }
#nt_sidebar_move span { display: block; color:#fff; background: rgba(0,0,0,0.5); margin:5px 0; text-align: center; border-radius: 50%; width: 42px; height: 42px; line-height: 42px !important; font-size: 19px; }
#nt_sidebar_move .sidebar-move-bottom { display:none; }

#mobile_bt_menu {display: none;}

@media (max-width: 1199px) {
  #mobile_bt_menu {display: block; position: fixed; z-index: 100; bottom: 0; left: 0; width: 100%; background: #fff;}
  #mobile_bt_menu ul {display: flex; border-top: 1px solid #ddd;}
  #mobile_bt_menu ul li {flex: 0 0 20%; border-right: 1px solid #ddd;}
  #mobile_bt_menu ul li:last-child {border-right: 0;}
  #mobile_bt_menu ul .mo_bt_home {position: relative;}
  #mobile_bt_menu ul .mo_bt_home a i {position: absolute; left: 0; top: -6px; width: 100%; height: 69px; line-height: 59px; background: #ff2f2f; color: #fff; border-radius: 10px 10px 0 0; font-size: 2.5rem;}
  #mobile_bt_menu ul li a {display: block; padding: 5px 0; text-align: center;}
  #mobile_bt_menu ul li a img {width: 25px;}
  #mobile_bt_menu ul li a b {position: absolute; top: 4px; right: 20px; min-width: 18px; height: 18px; line-height: 18px; background: #ff2f2f; color: #fff; padding: 0 5px; border-radius: 50rem;}

  #nt_sidebar_move {bottom: 60px; right: 15px;}
}