@charset "utf-8";
/* 헤드 */
.tbheader{
  position:fixed; top:0; left:0; width:100%; height:auto; z-index:100; overflow: hidden; height: 100px; background: #fff;
  -webkit-transition: padding 0.3s, height .3s, top .3s, background .3s,  top 0.3s; -moz-transition: padding 0.3s, height .3s, background .3s, top .3s ; -ms-transition: padding 0.3s, height .3s, background .3s, top .3s; -o-transition: padding 0.3s, height .3s, background .3s, top .3s;  transition: padding 0.3s, height .3s, background .3s, top .3s;
}
.tbheader.subopen{ background-color: #fff; }
.tbheader.headHide{top:-100px}
.tbheader .tbinner{height:100%;}
.header_sec{display: flex;position:relative; display:flex; align-items: center; height:100px; transition: height .3s ease-out;}

.tbheader .head-menu{
  height:100%; display:flex; align-items: center; text-align: center; justify-content:center
}

/*header 버튼*/
.tbheader .head-icons { display:flex; align-items: center; position: relative; height:100%; }
.tbheader .head-icons .head_btn {padding:8px 30px 8px 28px; background-color:#0b2d67; border:1px solid #0b2d67; font-size:1.5rem; font-weight:400; margin-right:10px; color:#fff; border-radius:30px;}
.tbheader .head-icons .head_btn:hover {background-color:#159bed; border:1px solid #159bed;}
.tbheader .head-icons .head_btn img {padding-right:5px; width:auto; height:20px; vertical-align:middle; margin-bottom:2px;}



.tbheader .head-logo {flex-grow: 1;}
.tbheader .head-logo img { height: 60px; padding-bottom:5px; }
.tbheader .head-icons{ margin-left: 20px; }
.tbheader .head-menu .category_menu, 
.tbheader .head-icons .icons{ display:flex; align-items: center; position: relative; height:100%; }
.tbheader .head-menu .category_menu .mainmenu,
.tbheader .head-icons .icons a span
{font-size:1.8rem; padding:14px 1.5em 8px; font-weight:500; letter-spacing: 0.05em;}
.tbheader .head-menu .category_menu .mainmenu a{ color:#000; position:relative}
  .tbheader.subopen .head-menu .category_menu .mainmenu a { color:#000; }
  
.tbheader .head-menu .subblocks{position:absolute; width:100%; height:auto; top:100px; left:0; padding:10px 0 30px 0; transition: background 0.3s ease-out, top .3s ease-out;}
.tbheader .head-menu .subblocks .subblocks-li{margin-bottom:15px;}
  .tbheader .head-menu .subblocks .subblocks-li a{ color:#000; font-weight:400; font-size:1.6rem; position:relative; transition:color .3s ease-out; }
  .tbheader .head-menu .category_menu:hover .mainmenu a .menuHvEff{width:100%;}
  .tbheader .head-menu .category_menu{transition:background .3s ease-out;}

  .tbheader .head-menu .category_menu:hover{background:#0b2d67;}
  .tbheader .head-menu .category_menu:hover .subblocks{background:#0b2d67}
  .tbheader .head-menu .category_menu:hover .subblocks .subblocks-li a{color:#fff;}
  .tbheader.subopen .head-menu .category_menu:hover .mainmenu a {color: #fff;}
  .tbheader .head-menu .category_menu .subblocks .subblocks-li a:hover{color: #fff;}


/* 스크롤 fixed HEAD + sub메뉴 slideDown시에 */
.tbheader.fixed{ height:80px; background:rgba(255,255,255,1); box-shadow: 0 3px 10px rgb(78 78 78 / 15%);}
.tbheader.fixed .header_sec{height:80px;}
.tbheader.fixed .head-menu .subblocks{top:80px;}
.tbheader.fixed  .head-menu .category_menu .mainmenu a{ color:#000;}


.tbheader.fixed .head-logo .logo{display: none;}
.tbheader.fixed .head-logo .logo000{display: inline;}
.tbheader.fixed .head-icons .resmenu-icon{display: none;}
.tbheader.fixed .head-icons .resmenu-icon000{display: inline;}
.tbheader .head-logo .logo000{display: block;}
.tbheader .head-icons .resmenu-icon{display: none;}
.tbheader .head-icons .resmenu-icon000{display: block;}
.tbheader .head-logo .logo{display: none;}
.tbheader.subopen .head-logo .logo{display: none;}
.tbheader.subopen .head-logo .logo000{display: block;}
.tbheader.subopen .head-icons .resmenu-icon{display: none;}
.tbheader.subopen .head-icons .resmenu-icon000{display: inline;}

.tbheader .head-icons .resIcon{display:none; position:relative; width:32px; height:32px; margin-left:10px;}
.tbheader .head-icons .resIcon .resIcon_wrap{position:absolute; width:26px; height:18px; top:50%; left:50%; transform:translate(-50%, -50%);}
.tbheader .head-icons .resIcon .resIcon_wrap span{position:absolute; width:100%; height:2px; background:#000; border-radius: 2px; transition:.3s; }
  .tbheader .head-icons .resIcon .resIcon_wrap span:nth-child(1){ top:0; right:0  }
  .tbheader .head-icons .resIcon .resIcon_wrap span:nth-child(2){ top:calc(50% - 1px); width:20px; right:0;}
  .tbheader .head-icons .resIcon .resIcon_wrap span:nth-child(3){ bottom:0; right:0 }

  .tbheader .head-icons .resIcon.open .resIcon_wrap span:nth-child(1){ transform-origin:4px 0; transform:rotate(45deg);}
  .tbheader .head-icons .resIcon.open span:nth-child(2){opacity:0;}
  .tbheader .head-icons .resIcon.open .resIcon_wrap span:nth-child(3){ transform-origin:-1px 0; transform:rotate(-45deg);}

  .tbheader .head-icons .resIcon.open{position:fixed; top:20px; right:20px; z-index:200;}
  .tbheader .head-icons .resIcon.open .resIcon_wrap span{background:#000;}

@media screen and (max-width:1400px){
  .tbheader .head-menu .category_menu .mainmenu {font-size:1.6rem; padding:8px 1.5em;}
  
}

@media screen and (max-width:1024px){
  .tbheader{height:65px; }
  .tbheader.fixed { height: 65px;}
  .tbheader .head-menu{display: none;}
  .tbheader .head-logo{flex-grow: 1;}
  .tbheader .head-logo img { height: 50px; padding-bottom:0;}
  .header_sec,
  .tbheader.fixed .header_sec{height:65px;}
  .tbheader.headHide{top:-65px}
  .tbheader .head-icons .resIcon{display:inline-block;}
}
@media screen and (max-width:768px){
  .tbheader .head-logo img { height: 40px;}
}

@media screen and (max-width:560px){
  .tbheader .head-icons .head_btn {padding: 8px 10px 8px 10px; margin-right:5px; }
  .tbheader .head-icons .head_btn span {display:none;}
  .tbheader .head-icons .head_btn img {padding-right:0; margin-bottom: 0px;}
}
/* 사이드바 */
.sidebar{ width:100%;height:100%; background:rgba(0,0,0,.3); position:fixed; top: 0; left:0; z-index: 101;display:none; }
.sidebar.show { display:block; }
  .sidebar_area{
    width:400px; height:100%; max-height:1000px; min-height:560px; transition:right .3s; position:fixed; top: 0; overflow-y: auto; right: -100%; z-index:102; overflow-x: visible;  text-align:left; background:#fff; transition:.3s; padding:100px 50px;
  }
  .sidebar_area.show{ right:0; }
  .sidebar_area .sideclose{ position:absolute; top:30px; right:30px; z-index:100; cursor: pointer; }
.sidebar_area .sidebar_menu{ margin-bottom:20px; }
.sidebar_area .sidebar_menu .sidebar_mainmenu{
  position:relative; display:inline-block; width:100%; color:#222; font-size:2.4rem; line-height:1.5em; margin-bottom:10px; cursor: pointer;
}
.sidebar_area .sidebar_menu .sidebar_mainmenu.subExt::after{ position:absolute; background-image:url('../img/tbimg/common/more_plus.svg'); right:10px; top:50%; transform: translateY(-50%); display: block; width: 28px; height: 28px; background-repeat: no-repeat; content:""; }
.sidebar_area .sidebar_menu .sidebar_mainmenu.subExt.active::after{background-image:url('../img/tbimg/common/more_minus.svg');}
.sidebar_area .sidebar_menu .res_subblocks .resSubblocks-li{margin-bottom:7px; padding:0 10px}
.sidebar_area .sidebar_menu .res_subblocks .resSubblocks-li a:last-child{margin-bottom:0;}
.sidebar_area .sidebar_menu .res_subblocks a{font-size:1.6rem; color:#a5a5a5; margin-bottom:0;}

.sidebar_area .sbbtn_area{ padding-top:2em; overflow: hidden;}
.sidebar_area .sbbtn_wrap{ margin:0 -5px; font-size:0; text-align: center; }
.sidebar_area .sbbtn_wrap .tbbtn{ display:inline-block; width:calc(50% - 10px);  margin:0 5px; padding:0; text-align: center; font-size:1.7rem; }
.sidebar_area .sbadmin{margin-top:20px;}
@media (max-width: 560px){
  .sidebar_area{ width:100%; text-align: center;}
  .sidebar_area .sbbtn_wrap .tbbtn{ width:calc(40% - 10px);}
}
@media (max-width: 420px){
  .sidebar_area .sbbtn_wrap .tbbtn{ width:calc(50% - 10px);}
  .sidebar_area{padding:100px 30px;}
}