@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css);
.menu-panel {
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    position: fixed;
    z-index: 9999;
    top: 0;
    height: 100%;
    width: 80%;
    background-color: #fff;
  }
  
  
   /*PC 햄버거 메뉴*/
  .lnb .menu__button {
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    display: inline-block;
    cursor: pointer;
    position: absolute;
    z-index: 2;
    top: 15px;
	right:10px;
    width: 30px;
    height: 30px;
  }
  .lnb .menu__button span,
  .lnb .menu__button span:before,
  .lnb .menu__button span:after {
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    width: 32px;
    height: 3px;
    background-color: #979797;
  }
  .lnb .menu__button span {
    position: relative;
    display: inline-block;
    float: left;
    margin-top: 9.09090909px;
  }
  .lnb .menu__button span:before,
  .lnb .menu__button span:after {
    content: "";
    position: absolute;
    left: 0;
  }
  .lnb .menu__button span:before {
    top: -9.09090909px;
  }
  .lnb .menu__button span:after {
    top: 9.09090909px;
  }
  /*햄버거 메뉴 활성화 시*/
  .lnb .menu__button.is--active span{
    background: transparent;
  }
  .lnb .menu__button.is--active span:before,
  .lnb .menu__button.is--active span:after {
    top: 0;
  }
  .lnb .menu__button.is--active span:before {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
  }
  
  
  .lnb .menu__button.is--active span:after {
    -webkit-transition-delay: 0.09s;
    -moz-transition-delay: 0.09s;
    -o-transition-delay: 0.09s;
    -ms-transition-delay: 0.09s;
    transition-delay: 0.09s;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
  }
  
  /*-- 추가작업 --*/
  
    .menu-panel .menu__button2 {
 
    display: inline-block;
    cursor: pointer;
    position: absolute;
    z-index: 2;
    top: 10px;
	right:10px;
    width: 43px;
    height:44px;
	background: url('/images/se/close1.png');
 
  }
  
  /*모바일 햄버거 메뉴*/
  
  .menu-panel .menu__button {
    transition: all 0.2s ease-in-out;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    display: none;
    cursor: pointer;
    position: absolute;
    z-index: 2;
    top: 30px;
	right:10px;
    width: 30px;
    height: 30px;
 
  }
  .menu-panel .menu__button span,
  .menu-panel .menu__button span:before,
  .menu-panel .menu__button span:after {
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    width: 32px;
    height: 3px;
    background-color: #979797;
  }
  .menu-panel .menu__button span {
    position: relative;
    display: inline-block;
    float: left;
    margin-top: 9.09090909px;
  }
  .menu-panel .menu__button span:before,
  .menu-panel .menu__button span:after {
    content: "";
    position: absolute;
    left: 0;
  }
  .menu-panel .menu__button span:before {
    top: -9.09090909px;
  }
  .menu-panel .menu__button span:after {
    top: 9.09090909px;
  }
  
  /*햄버거 메뉴 활성화 시*/
  .menu-panel .menu__button.is--active span{
    background: transparent;
  }
  .menu-panel .menu__button.is--active span:before,
  .menu-panel .menu__button.is--active span:after {
    top: 0;
  }
  .menu-panel .menu__button.is--active span:before {
    transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    -moz-transform: rotate(-135deg);
    -o-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
  }
  
  
  .menu-panel .menu__button.is--active span:after {
    -webkit-transition-delay: 0.09s;
    -moz-transition-delay: 0.09s;
    -o-transition-delay: 0.09s;
    -ms-transition-delay: 0.09s;
    transition-delay: 0.09s;
    transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    -moz-transform: rotate(135deg);
    -o-transform: rotate(135deg);
    -ms-transform: rotate(135deg);
  }
  
  /*메뉴 패널 안쪽부분*/
  .mo-menu-title{
    background: #f9914c;
    height:62px;
    color:#fff;
    font-size:16px;
    padding: 18px 20px 0 10px;
    text-align: left;
  }
   .mo-menu-title .dg-white{color:#fff}
   .mo-menu-title a:first-of-type{
    border-right:1px solid #fbbc90;
    padding:0 7px 0 0;
  }
   
  .menu-panel > .menu-list {
    width:100%;
    z-index: 1;
    height: 45px;
    text-align: left;
  }
  
  .menu-panel > .menu-list > li{
    clear: both;
    width: 100%;
    border-bottom: 1px solid #dcdcdc;
	height:55px;
	line-height:30px;
	vertical-align:top;
  }
  
  .menu-panel > .menu-list > .menu-label > .menu-list__text {
    font-size: 17px;
    padding: 10px 0 20px 30px;
    color: #444;
    width: calc(100% - 60px);
    display: inline-block;
    height: 100%;
  }

  
  /*1차 메뉴의 - + 부분*/
  .menu-panel ul li .menu-list__arrow{
    height: 64px;
    width: 60px;
    display: inline-block;
    float: right;
    position: relative;
    cursor: pointer;
	margin-top:-5px;
  }
  
  .menu-panel ul li .menu-list__arrow::before,
  .menu-panel ul li .menu-list__arrow::after{
    width: 25px;
    height: 2px;
    background: #535353;
    content: "";
    display: inline-block;
    position:absolute;
    left:17.5px;
    top: calc(50% - 1px);
    transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
  }
  
  .menu-panel ul li .menu-list__arrow::after{
    transform: rotate(90deg);
    -webkit-transform: rotate(90deg);
    -moz-transform: rotate(90deg);
    -o-transform: rotate(90deg);
    -ms-transform: rotate(90deg);
  }

  .menu-panel .sub-menu{
    display: none;
    width: 100%;
    padding:0 10.133%;
  }
  
  .menu-panel .sub-menu:after {
    content: '';
    display: block;
    clear: both;
  }

  .menu-panel .sub-menu li{
    float: left;
    height: 45px;
    width: 100%;
    border-bottom: 1px solid #e0e0e0;
  }
  
  .menu-panel .sub-menu li:last-of-type {
    border-bottom: none;
    margin: 0 0 20px 0;
	
  }

  .menu-panel .sub-menu li:first-of-type {
    margin: 20px 0 0 0;
  }
  
  .menu-panel .sub-menu li a{
    display: block;
    height: 100%;
    padding:11px 0px 15px 8px;
    font:15px 'bgR';
    color: #666666;
  }
  
  .menu-panel {
    left: -100%;
  }
  .menu-panel .menu__button {
    left: 130%;
  }
  .menu-panel.is--active {
    left: 0;
    overflow: scroll;
  }
  .menu-panel.is--active .menu__button {
    left: 100%;
    margin-left: -46px;
    z-index: 999;
    margin-top: -10px;
}
  
  .menu-panel.is--active .menu__button span:before,
  .menu-panel.is--active .menu__button span:after{
    background: #fff;
	
  }
  
  .menu-panel-overlay{
    position: fixed;
    top: 0;
    z-index: 9998;
    width: 100%;
    height: 100%;
    display: none;
    background-color: rgba(0, 0, 0, 0.62);
    cursor: pointer;
	
  }

  /* active */

  .menu-list > .menu-label.is--open .menu-list__text {
    color:#f9904c;
  }
  .menu-list > .menu-label.is--open .sub-menu{
    border-top: 2px solid #f9914c;
    display: block;
  }

  .menu-list > .menu-label.is--open .menu-list__arrow::before,
  .menu-list > .menu-label.is--open .menu-list__arrow::after {
    background: #f9914c;
  }

  .menu-list > .menu-label.is--open .menu-list__arrow::after {
    -webkit-transition-delay: 0.09s;
    -moz-transition-delay: 0.09s;
    -o-transition-delay: 0.09s;
    -ms-transition-delay: 0.09s;
    transition-delay: 0.09s;
    transform: rotate(0deg);
    -webkit-transform: rotate(0deg);
    -moz-transform: rotate(0deg);
    -o-transform: rotate(0deg);
    -ms-transform: rotate(0deg);
  }