@charset "utf-8";

/* layout */
.m-inner {	width: 100%; max-width:1600px;	position:relative;	margin-left:auto;	margin-right:auto;  }
.s-inner {	width:100%; max-width:1480px;	position:relative;	margin-left:auto;	margin-right:auto; }
#wrap { /*overflow-x: hidden; */ /*scroll-behavior:smooth;*/ }

/* 타블렛 가로 */
@media all and (max-width:1620px) {
	.s-inner {	width:90%; }
}
@media all and (max-width:1599px) {
	.m-inner {	width:90%; }
}
@media all and (max-width:1310px) {
	.s-inner {	width:85%; }
}
@media all and (max-width:1280px) {
	html { font-size: 60% !important; }
	.s-inner {	width:90%; }
}
@media all and (max-width:976px) {
	html { font-size: 60% !important; }
}
@media all and (max-width:767px) {
	html { font-size: 0.55rem !important; }
}
@media all and (max-width:480px) {
	html { font-size: 2.2vw !important; }
}


/*Header*/
#header { position:fixed; width:100%; height:100px; box-sizing:border-box; z-index:300;  margin: 0 auto; background:#FFF;
				display:flex; justify-content:space-between;align-items: center; border-bottom:1px solid rgba(140,140,140,0.2) }
#header .hd_bx { line-height:100px;  }
#header .hd_mbx { display: none; }

#header #logo { font-size:0; padding-left:60px; z-index:103; position:relative}
#header #logo a { width:287px; height:55px;}
#header #logo a.logo { display: block; background:url("/images/common/logo_250923.png") no-repeat left center; background-size:100% auto; }


.menuToggle { position: relative; right:0; top:0; width:80px; height:80px; cursor:pointer; z-index:101; }
.menuToggle span { display:block;  height:2px; border-radius:3px;   position:absolute; top: 50%; left:50%; margin-left: -16px; transition:all 0.5s; background:#222}
.menuToggle span.t { margin-top: -11px; width:27px;}
.menuToggle span.m { margin-top:-1px; width: 27px; }
.menuToggle span.b { margin-top: 9px; width:27px; }

 #header.mo_on .menuToggle span.t {transform: rotate(45deg);  margin-top: 0;}
#header.mo_on .menuToggle span.m {width:0;}
#header.mo_on .menuToggle span.b {transform: rotate(-45deg); width:27px;  margin-top: 0;} 

#header.mo_on .menuToggle span { background:#FFF} 




#gnb_pc {margin: 0 auto; }
#gnb_pc > ul > li {display:inline-block; vertical-align:top; text-align:center; position:relative;}
#gnb_pc > ul > li > div {display:block; font-size:1.8rem; text-transform:uppercase; line-height:100px; position:relative; width: auto; padding: 0 23px; cursor: pointer;letter-spacing:0; }
#gnb_pc > ul > li > div  a { color:#222;  font-weight:600 }
#gnb_pc > ul > li > ul { display: none; padding:15px 0; width:180px; background:#fe6e00; position: absolute; top: 100px; left: 50%; margin-left: -90px; }
#gnb_pc > ul > li > ul > li > a {display:block; width:100%;padding:10px; color:#fff;box-sizing: border-box; }
#gnb_pc > ul > li > ul > li:last-child > a {border-bottom:0;}
#gnb_pc > ul > li:hover > div { background: ;  }
#gnb_pc > ul > li > ul > li > a:hover {text-decoration:underline}

#gnb_pc > ul > li > ul > li > ul {display:none}

#t-loca {color:#7f7f7f; margin-right:30px}



/* #header.menu_on {background:#FFF}
#header.menu_on #logo a.logo { background:url("/images/common/logo_on.png") no-repeat left center; background-size:auto 100%; }
#header.menu_on #gnb_pc > ul > li > div  a,
#header.menu_on #gnb_pc .gnb_dp1>div>span{color:#222}
#header.menu_on .t_menu { background:#022a47} */





#header.mo_on #logo a.logo { background:url("/images/common/logo_250923.png") no-repeat left center;background-size:100% auto; }




#gnb_mo { position:fixed; top:0; right:0; width:100%; height:100%; max-width:500px; padding: 80px 0;
                background:rgba(5,5,5, 0.90); overflow-y:scroll; -ms-overflow-style:none; z-index: 100; text-align: left;
                transition: all 0.4s ease; -webkit-transform: translateX(100%) rotate(0); -moz-transform: translateX(100%) rotate(0);
                -ms-transform: translateX(100%) rotate(0); -o-transform: translateX(100%) rotate(0);
                 transform: translateX(100%) rotate(0); }
#gnb_mo > ul { border-top: 1px solid rgba(255,255,255,0.1); line-height:3.5em;}
#gnb_mo > ul > li > div {display:block; width:100%; font-size:2.0rem;  border-bottom:1px solid rgba(255,255,255,0.1); box-sizing:border-box; padding:0 1.5em; position:relative; cursor: pointer; }
#gnb_mo > ul > li > div:after {content:''; display:block; width:11px; height:1px; background:#fff; position:absolute; right:1em; top:50%; margin-top:-1px;}
#gnb_mo > ul > li > div:before {content:''; display:block; width:1px; height:11px; background:#fff; position:absolute; right:calc(1em + 5px); top:50%; margin-top:-6px; transition:all 0.5s;}
#gnb_mo > ul > li > div > a { color:#fff; }
#gnb_mo > ul > li > ul { display:none; }
#gnb_mo > ul > li > ul > li > a {display:block; width:100%; font-size:1.8rem; color:#4b4b4b;padding:0 2em; font-weight: 500;
                                             border-bottom:1px solid #e1e1e1; background:#fff; box-sizing:border-box; line-height:3.5em;}
#gnb_mo > ul > li > div.on { background: #fe6e00; }
#gnb_mo > ul > li > div.on:before {transform:rotate(90deg)}

#header.mo_on #gnb_mo {display:block;}
#gnb_mo.m_menuOn{	-webkit-transform: translateX(0) rotate(0); -moz-transform: translateX(0) rotate(0);	-ms-transform: translateX(0) rotate(0);	-o-transform: translateX(0) rotate(0);	transform: translateX(0) rotate(0); }




#login-mo {margin:1em; display:flex;; border-top:0 !important}
#login-mo li a {background:#FFF; padding:0.7em 1.5em; border-radius:100px; margin:2px; color:#222; font-weight:600; font-size:1.8rem }
#login-mo li.admin a {background:#fe6e00; color:#FFF}
#login-mo li a:hover {background:#fe6e00; color:#FFF}


@media all and (max-width:1699px){
  #header #logo { padding-left:30px }  
  #gnb_pc > ul > li > div {padding: 0 19px;}
}
@media all and (max-width:1599px){
	#t-loca {display:none}
	#header #logo a { width:260px;}
}
@media all and (max-width:1399px){
	 #gnb_pc > ul > li > div {padding: 0 15px;}
	 #gnb_pc > ul > li > ul { padding:10px 0; width:150px; margin-left: -75px;}
}
@media all and (max-width:1280px){
  #header { height:80px; text-align: center}
  #header .hd_bx { line-height:80px; }
  #header .hd_mbx { display: block; }

  #t-loca {display:block; margin-left:auto; margin-right:10px}
  
  #gnb_pc {display:none;}
  #gnb_mo { text-align: left; }
}
@media all and (max-width:976px){
	#header { height:70px; }
	.menuToggle { width:70px; height:70px }
	#header #logo a { width:240px;}
	#gnb_mo { padding: 70px 0; }	
}
@media all and (max-width:767px) {
	#header { height:60px; }
	#header #logo { padding-left:20px }
	.menuToggle { width:60px; height:60px }
	#gnb_mo { max-width: 100%; padding: 60px 0; }
	#header.mo_on #logo a.logo { background:url("/images/common/logo_w_250923.png") no-repeat left center; 
										background-size:100% auto; }
	  #t-loca {display:none}
}
@media all and (max-width:480px) {
	#header #logo { padding-left:10px }
	#header #logo a {width:240px;}
}






#footer {padding-top:4em; background:#2d2d2d;  }
#footer ul li a {color:#777}
#footer ul li a:hover {color:#a5a5a5}

#footer #f-info,
#footer #f-link {display:flex; justify-content:space-between; flex-wrap:wrap }

#footer #f-info {padding:2em 0}
#footer #f-info ul {display:flex; flex-wrap:wrap}
#footer #f-info ul.cont {max-width:680px}
#footer #f-info ul.cont li {padding-right:1.5em}
#footer #f-info ul.cont li p {line-height:1.6em}

#footer #f-info ul.sns li {margin:2px}
#footer #f-info ul.sns li a {display:block; width:40px; line-height:40px; border-radius:100px; background:#222}
#footer #f-info ul.sns li a:hover {background:#fe6e00}

#footer #f-link {padding:1.8em 0; border-top:1px solid rgba(140,140,140,0.2)}
#footer #f-link ul {display:flex; flex-wrap:wrap}
#footer #f-link ul li {padding-right:1.5em}
#footer #f-link .copy { font-size:1.4rem; opacity:.3; text-transform:uppercase}

@media all and (max-width:767px) {
	#footer #f-logo { text-align:center}
	#footer #f-logo img {height:46px}
	#footer #f-info,
	#footer #f-link { justify-content:center; }
	#footer #f-info ul.cont li {padding: 0 0.6em}
	#footer #f-info ul {justify-content:center;}
	#footer #f-info ul.sns { margin-top:1em }
	#footer #f-link ul {justify-content:center;}
	#footer #f-link ul li {padding: 0 0.6em}
	#footer #f-link .copy {margin-top:1em; width:100%; text-align:center}
}




#Quick {position:fixed; right:15px; bottom:7%; padding: 10px; z-index:290; background: #ffffff99; border-radius: 90px;;}
#Quick a {display:block; margin-bottom:18px; text-align:center}
#Quick a li {width:54px; height:54px; border-radius:100px; background:#3d3e42; margin:0 auto} 
#Quick a p {padding-top:8px; font-size:1.5rem; font-weight:600; color:#4a4a4b; letter-spacing:-0.02em}
#Quick a:hover li {background:#fe6e00; transition: all 0.3s;}
#Quick a:hover p {color:#222;}



.Quick-m-bg { visibility: hidden; opacity: 0; transition: 0.3s; width: 100%; height: 100%; background: rgba(0,0,0,0.5); position: fixed; bottom: 0; right: 0; /*z-index: 800;*/ }
.Quick-m { display: none; position: fixed; bottom: 2%; right: 2%; z-index: 120; }
.mq-menu { display: flex; flex-direction: column;  visibility: hidden; opacity: 0; transition: 0.3s; margin-bottom:10px; }
.mq-menu a { display:flex; justify-content: flex-end ; align-items: center; margin-bottom:7px}
.mq-menu a li {width:54px; line-height:54px; border-radius:100px; background:#fe6e00; text-align:center}
.mq-menu a p {padding-right:10px; color:#FFF; font-weight:600}

.mq-Btn { display: none; cursor: pointer; width: 64px; height: 64px; border-radius: 50%; background: #fe6e00; text-align: center; line-height: 60px; color: #fff; font-size: 16px; margin-left:auto }
.mq-Btn:before { content:"CLICK"; font-family:'Poppins'; font-size:1.5rem;  } 
.mq-Btn.on:before { content:"CLOSE";  } 


@media all and (max-width:1280px){
	#Quick  {display:none}

	.Quick-m { display: block; }
	.mq-menu.on { visibility: visible; opacity: 1; transition: 0.3s;}
	.Quick-m-bg.on { display: block; visibility: visible; opacity: 1; transition: 0.3s; }
	.mq-Btn { display: block; transition: 0.3s; }
	.mq-Btn.on { background: #3d3d3d; transition: 0.3s; }
}