@charset "utf-8";

header{position: fixed; top: 0; left: 0; z-index: 999; width: 100%; background:#fff;}

/* header_top_menu */
.header_top_menu{display:flex; background:#444444; text-align: center; height:40px; line-height:40px; justify-content: space-around;}
.header_top_menu:after{content:inherit;}
    .header_top_menu li{width:100%;}
    .header_top_menu a{width:100%; height:100%; font-size:15px; letter-spacing: -0.75px; color:#fff; opacity:.4;}
    .header_top_menu a:hover{background:#a082c8; color:#fff; opacity:1;}
    .on_header_top_menu a{background:#a082c8; color:#fff; opacity:1;}

    
@media screen and (max-width:1023px){
    .header_top_menu{display:none;}
}

/* nav */
#nav{display:flex; justify-content: space-between;  padding: 55px 90px 0;}

    .nav_left{}
    h1{float:left; margin-right:100px; }
    .gnb{float:left; display:flex; font-size:22px}

        .gnb > li > a{margin-right:120px; margin-bottom:40px;}
        .gnb > li > a:last-child{margin-right:0;}
        .gnb > li > a > p{font-weight:bold;}
        .gnb > li > a > small{font-size:15px; color:#707070;}
        .gnb > li:hover > a > p{color:#a082c8}

    .lnb{display:none; padding-bottom:70px;}
    .gnb:hover .lnb{display: block;}
        .lnb li{margin-bottom:20px; }
		.lnb li a{font-size:19px;}
        .lnb li:hover > a{font-weight:800;}


    .nav_right{display:flex; font-size:14px; font-weight:800; }
        .nav_right > li{margin-right:30px;}
        .nav_right > li:last-child{margin-right:0;}
        .nav_right a{color:#8b8b8b;}
        /*.nav_right a:hover{color:#a082c8;}*/
		.nav_right .xi-globus{font-size: 20px;  margin-right: 6px;  vertical-align: middle;}

@media screen and (max-width:1679px){
    #nav{padding:55px 50px 0;}
    h1{margin-right:50px;}
    .gnb{font-size:20px;}
    .gnb > li > a{margin-right:100px;}
}

@media screen and (max-width:1439px){
    #nav{padding:30px; align-items:center;}
    h1 img{width:150px;}
    .lnb{padding-bottom:0; padding-top:30px;}
    .gnb > li > a{margin-bottom:0;}
}


@media screen and (max-width:1279px){

    .gnb{font-size:18px;}
    .gnb > li > a{margin-right:80px;}

    .nav_right > li{margin-right:10px}
}

@media screen and (max-width:1120px){
    h1{margin-right:40px;}
    .gnb > li > a{margin-right:60px;}
    .lnb{font-size:16px;}
}

@media screen and (max-width:1023px){
    #nav{padding:20px;}
    .gnb > li > a{margin-right:30px;}
    .gnb:hover .lnb{display: none;}
    .nav_right{display:none;}
    
}

@media screen and (max-width:767px){
    .gnb{font-size:16px; display:none;}
    h1 img{width:120px;}
}


/*** 모바일 햄버거 ***/
.btn_ham{
	width: 100px; height: 100px;
	position: fixed; top: 42px; right:20px; z-index: 999; transform:translateY(-50%);
	width:40px; height:29px;
}

.btn_ham .btn {
  cursor: pointer;
  display: inline-block;
  position: absolute; top: 0; /*8px*/ right: 0; z-index: 20;
  padding: 8px 0 !important;
  user-select: none;
}

.btn_ham .bar {/* 2nd bar */
  background: #000; /*blue;*/
  position: relative;
  width: 15px; height: 5px;
  display: block;
  transition: background .2s ease-out;
	position: relative;
}

.btn_ham .bar:before,
.btn_ham .bar:after {
  background: #000; /*red;*/
  content: ''; display: block;
  width: 40px; height: 100%;
  position: absolute; right:0;
  transition: all .2s ease-out;
}

.btn_ham .bar:before {top: 13px; width:30px;}
.btn_ham .bar:after {top: -13px;}
.btn_ham .checkbox {display: none;}

/*
.btn_ham .checkbox:checked~.menu_content {max-width: 100%; right:0; }
.btn_ham .checkbox:checked~.btn .bar {background: transparent;}
.btn_ham .checkbox:checked~.btn .bar i{border: transparent;}
.btn_ham .checkbox:checked~.btn .bar:before {transform: rotate(-45deg);}
.btn_ham .checkbox:checked~.btn .bar:after {transform: rotate(45deg);}
.btn_ham .checkbox:checked~.btn:not(.steps) .bar:before,
.btn_ham .checkbox:checked~.btn:not(.steps) .bar:after {top: 0;}
*/

/*** 햄버거 클릭시 메뉴 ***/
.sitemap_wrap{display:none; overflow-y: auto; width:100%; height:100%; position: fixed; top:0; left:0; z-index: 999; background: #fff; transition: all 900ms cubic-bezier(0.86, 0, 0.07, 1);  }

	.sitemap_head{ padding:20px; display:flex; align-items:center; justify-content:space-between; margin-bottom:50px; position:relative;}
	.sitemap_head:after{content:inherit;}
		.sitemap_head h2 img{max-width:150px;}
        .sitemap_head .btn_ham2{font-size:35px; cursor: pointer;}
        .sitemap_head .btn_ham2 i{font-weight:bold;}

	.sitemap { padding:20px; display:flex; justify-content: flex-start; height: 73vh; overflow: auto;}
		.sitemap > li { width:10%; margin-right:20px;}
		.sitemap > li:last-child {margin-right:0}
		.sitemap > li > p { border:1px solid #e7e7e7; border-radius:5px; font-size:17px; font-weight:bold; margin-bottom:8px; padding:10px 0; text-align:center; margin-bottom:25px;}
		.sitemap > li > ul > li { font-size:15px; padding:4px 10px;}
		.sitemap > li > ul > li a:hover{color:#ff584e;}



@media screen and (max-width: 1279px) {
	.sitemap{flex-wrap:wrap; }
	.sitemap > li {width: calc(25% - 20px); margin-right:20px; margin-bottom:30px;}
	.sitemap > li:last-child {margin-right:0}
}

@media screen and (max-width: 767px) {
	.sitemap_head{margin-bottom:0;}

	.sitemap > li { width: calc(50% - 20px); margin-right:20px;}
	.sitemap > li:last-child {margin-right:0}
}

@media screen and (max-width: 479px) {
	.sitemap_head h2 img {max-width: 120px; }
    .sitemap > li { width: 100%; margin-right:0;}
	.sitemap > li > p{margin-bottom:15px;}
}

/* 스크롤 막기 */
.noscroll{
	height:100%; min-height:100%; 
	overflow:hidden !important; 
	touch-action:none;
}