@charset "utf-8";

/* layout */
.inner {	width: 100%; max-width:1600px;	position:relative;	margin-left:auto;	margin-right:auto;  }
.m-inner {	width: 95%; max-width:1620px;	position:relative;	margin-left:auto;	margin-right:auto;  }
.s-inner {	width:100%; max-width:1400px;	position:relative;	margin-left:auto;	margin-right:auto; }
#wrap { /* overflow-x: hidden; */ /*scroll-behavior:smooth;*/ }

/* 타블렛 가로 */
@media all and (max-width:1740px) {
	.inner {	width:90%; }
}
@media all and (max-width:1599px) {
	.inner {	width:85%; }
}
@media all and (max-width:1399px) {
	.s-inner {	width:90%; }
}
@media all and (max-width:1366px) {
	.inner {margin-right:8%}
}
@media all and (max-width:1280px) {
	html { font-size: 65% !important; }
}
@media all and (max-width:1024px) {
	html { font-size: 60% !important; }
}
@media all and (max-width:976px) {
	.inner {width:90%;margin-right:auto}
}
@media all and (max-width:768px) {
	html { font-size: 0.55rem !important; }
}
@media all and (max-width:480px) {
	html { font-size: 2.2vw !important; }
}


/*Header*/
#header {padding:0 3%; position:fixed; width:100%; height:110px; box-sizing:border-box; z-index:300;  margin: 0 auto; 
				display:flex; justify-content:space-between;align-items: center; border-bottom:1px solid rgba(255,255,255,0.1)}
#header .hd_bx { line-height:110px;  }
#header .hd_mbx { display: none; }

#header #logo { font-size:0; z-index:103; position:relative}
#header #logo a { width:275px; height:50px;}
#header #logo a.logo { display: block; background:url("/images/common/logo.png") no-repeat left center; background-size:100% auto; }


.menuToggle { position: relative; right:0; top:0; width:50px; height:50px; cursor:pointer; z-index:101; }
.menuToggle span { display:block;  height:3px; border-radius:3px;   position:absolute; top: 50%; left:50%; margin-left: -16px; 
						transition:all 0.5s; background:#FFF}
.menuToggle span.t { margin-top: -11px; width:30px;}
.menuToggle span.m { margin-top:-1px;  width: 23px; }
.menuToggle span.b { margin-top: 9px; width:30px; }

 #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:30px;  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.9rem; text-transform:uppercase; line-height:110px; position:relative; 
								width: auto; padding: 0 40px; cursor: pointer;letter-spacing:0; }
#gnb_pc > ul > li > div  a { color:#FFF;   }
#gnb_pc > ul > li > ul { display: none; padding:25px 0; width:200px; background:#48aec6; position: absolute; 
								top: 110px; left: 50%; margin-left: -100px; }
#gnb_pc > ul > li > ul > li > a {font-size:1.7rem; display:block; width:100%;padding:8px; 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-login {margin-left: auto; margin-right:20px;}
#t-login ul {display:flex; align-items: center;}
#t-login ul li {margin:0 5px;}
#t-login ul li a { font-size:1.5rem; color:#FFF; font-family:'Montserrat';text-transform:uppercase; font-weight:500 }
#t-login .login {width:40px; line-height:40px; border-radius:40px; background:rgba(255,255,255,0.15)}
#t-login .login:hover {background:#48aec6}
#t-login .admin {width:40px; line-height:40px; border-radius:40px; background:#941313}


/* #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.scroll {background:#FFF}
#header.scroll #gnb_pc > ul > li > div  a { color:#222; }
#header.scroll #allmenuWrap .bar span {background:#222}
#header.scroll #allmenuWrap.open .bar span {background:#FFF}
#header.scroll #t-login .login {background:rgba(15,15,15,0.3)}
#header.scroll #t-login .login:hover {background:#48aec6}
#header.scroll #t-login ul li a { color:#777; font-weight:600 }
#header.scroll .menuToggle span {background:#222}
#header.scroll .menuToggle.m_on span {background:#FFF}



#header.mo_on #logo a.logo { background:url("/images/common/logo.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: #48aec6; }
#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:#62c0d6; color:#FFF}
#login-mo li a:hover {background:#62c0d6; color:#FFF}


@media all and (max-width:1699px){
}
@media all and (max-width:1599px){
	#gnb_pc > ul > li > div {padding:0 30px}
}
@media all and (max-width:1399px){
	 #gnb_pc > ul > li > div {padding: 0 20px;}
	 #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; }
	#header #logo a { width:240px;}
	#t-login {margin-right:10px}
	#gnb_mo { padding: 70px 0; }	
}
@media all and (max-width:767px) {
	#header { height:60px; }
	.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.png") no-repeat left center; 
										background-size:100% auto; }
	  #t-loca {display:none}
}
@media all and (max-width:480px) {
	#header #logo a {width:55vw;}
	#t-login {margin-right:0}
	#t-login .login,
	#t-login .admin {width:9vw; height:9vw}
	#t-login img {width:100%}
}






#footer {background:#2e373e; padding-top:50px; padding-bottom:120px; text-align:center  }
#footer #f-info  {margin-top:20px; display:flex; flex-wrap:wrap; justify-content:center; gap:5px 25px}
#footer #f-info p { display:inline-block; color:#b8c1c9} 
#footer #f-info p span {color:#677078; padding-right:10px}
#footer #f-info p.copy {width:100%; margin-top:0.5em; padding-bottom:0; display:block; font-size:1.3rem; color:#677078; opacity:.7}
#footer #f-sns {margin-top:1em; display:none; flex-wrap:wrap; justify-content:center; gap:5px }

@media all and (max-width:998px) {
	#footer { padding-top:30px;   padding-bottom:160px  }
}
@media all and (max-width:976px) {
	#footer #f-sns {display:flex}
}
@media all and (max-width:768px) {
	#footer {  padding-bottom:190px  }
}
@media all and (max-width:680px) {
	#footer {  padding-bottom:220px  }
}
@media all and (max-width:480px) {
	#footer {  padding-bottom:50vw  }
	#footer #f-logo img { width:50vw  }
}
@media all and (max-width:400px) {
	#footer {  padding-bottom:55vw  }
}
@media all and (max-width:360px) {
	#footer {  padding-bottom:60vw  }
}






#f_inquiry { overflow: hidden; color:#fff; z-index:90; background:rgba(15,15,15,0.8) url('/images/common/f-sb.png') no-repeat 3% center;
              height: 90px; position: fixed; width: 100%; bottom: 0;}
#f_inquiry .inner { height:100%; display:flex; flex-wrap:wrap; justify-content:space-between; align-items: center;}
#f_inquiry input { border:0; outline: none; height:46px; }

#f_inquiry .titWrap {width:220px; padding-top:5px}
#f_inquiry .titWrap dl {text-align:right}
#f_inquiry .titWrap dl dd { font-size:1.6rem;}
#f_inquiry .titWrap dl dt {font-size:3.0rem;font-weight:700; font-family:'Montserrat'; color:#60bfd6}

#f_inquiry .contWrap {padding-left:8%; width:100%; height: 100%; display:flex; justify-content:space-between; align-items: center;}
#f_inquiry form {width:calc(100% - 220px);}
#f_inquiry .wr_input span {padding:0 1em 0 2em; font-size:1.7rem; font-weight:600}
#f_inquiry .wr_input input { width: 270px; color:#323232; background: #FFF; border:0; border-radius:5px; 
								 font-size: 1.7rem; padding: 0 1em; box-sizing: border-box;}
#f_inquiry .wr_input input::placeholder { font-size:0;  color:#555; }
#f_inquiry .wr_input input:first-child { border-left-width:1px;}
#f_inquiry .agree {margin-right: auto; padding-left:3%;  display:flex; align-items: center; }
#f_inquiry .agree a { color:#fff; text-decoration: underline; }
#f_inquiry .agree label span {opacity:.4;  }
#f_inquiry .btn_submit { font-size:2.0rem; font-weight:600; background: #61c0d6; color:#FFF; border-radius:5px; 
                                    padding: 0 2em; cursor: pointer; box-sizing: border-box;}

input[type=checkbox].css-checkbox { position:absolute; z-index:-1000; left:-1000px; overflow: hidden;
   clip: rect(0 0 0 0); height:1px; width:1px; margin:-1px; padding:0; border:0;
}
input[type=checkbox].css-checkbox + label.css-label {
	padding-left:40px;
	height:46px;
	display:inline-block;
	line-height:46px;
	background-repeat:no-repeat;
	background-position: left center;
	vertical-align:middle;
	cursor:pointer;
}
input[type=checkbox].css-checkbox:checked + label.css-label {
	background-image:url("/images/common/checkBox_on.png");
}
label.css-label { background-image:url("/images/common/checkBox.png");
-webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; 
;}


@media all and (max-width:1699px) {
	#f_inquiry .wr_input input { width: 200px; }
}
@media all and (max-width:1499px) {
	#f_inquiry .inner {width:96%; max-width:100%; margin:0 auto}
	#f_inquiry .titWrap { width:211px; }
	#f_inquiry form {width:calc(100% - 211px);}
	#f_inquiry .contWrap {padding-left:30px;}
	#f_inquiry .wr_input span {padding:0 1em; }
}
@media all and (max-width:1280px) {
	#f_inquiry .titWrap { width:240px;}
	#f_inquiry form {width:calc(100% - 240px);}
	#f_inquiry .wr_input input { width: 180px; }
	#f_inquiry .btn_submit {padding:0 1.5em}
}
@media all and (max-width:1140px) {
	#f_inquiry {height:80px}
	#f_inquiry .titWrap { width:180px;}
	#f_inquiry .titWrap dl dt { font-size:2.2rem;}
	#f_inquiry form {width:calc(100% - 180px);}
	#f_inquiry .contWrap {padding:0 20px}
	#f_inquiry .wr_input input { width: 160px; }
	#f_inquiry .btn_submit {padding:0.7em 1em; height:auto !important}
}
@media all and (max-width:1040px) {
	#f_inquiry {padding:10px 0; flex-wrap:wrap; height: auto; background-size:auto 110%}
	#f_inquiry .titWrap { width:100%; padding-bottom:0.5em}
	#f_inquiry .titWrap dl {text-align:center; display:flex; flex-wrap:wrap; justify-content:center; align-items: center; gap:0 10px}
	#f_inquiry .titWrap dl dt {font-size:3.0rem;}
	
	#f_inquiry form {width:calc(100%);}
	#f_inquiry .contWrap {width:100%; padding:0}
}
@media all and (max-width:830px) {
	#f_inquiry .agree {width:170px}
	input[type=checkbox].css-checkbox + label.css-label {
	padding-left:40px;	height:35px;	line-height:1.2em;	background-position: left 5px;}
}
@media all and (max-width:768px) {
	#f_inquiry input {height:40px; }
	#f_inquiry .contWrap {; padding-top:10px; flex-wrap:wrap }
	#f_inquiry .wr_input input  { width:160px; }
	input[type=checkbox].css-checkbox + label.css-label {
	background-position: left center;}
	#f_inquiry .btn_submit {width:100%; margin-top:10px}
}
@media all and (max-width:680px) {
	#f_inquiry .agree {width:100%; margin-top:10px; padding-left:0}
	#f_inquiry .wr_input {width:100%}
	#f_inquiry .wr_input span {display:none}
	#f_inquiry .wr_input input  { width:calc(50% - 5px); margin-left:5px }
	#f_inquiry .wr_input input.input-f  { margin-left:0 }
	#f_inquiry .wr_input input::placeholder { font-size:1.7rem;  color:#555; }
	input[type=checkbox].css-checkbox + label.css-label {
		background-size:auto 100%; padding-left: 30px;  height:20px; line-height:20px}
}



#Quick {position:fixed; right: 0; bottom:15%; z-index:99}
#Quick ul {border-radius:10px 0 0 10px; text-align:center; padding:10px;}
#Quick ul li {padding:8px 0; border-bottom:1px solid rgba(255,255,255,0.1)}
#Quick ul li .t1 {padding-top:5px; font-size:1.4rem; color:#FFF}
#Quick ul li a:hover .t1 {color:#74fff4}
#Quick ul li:last-child {; border-bottom:0}

#Quick ul.bg1 {background:#61c0d6}
#Quick ul.bg2 {margin-top:5px; background:#FFF}
#Quick ul.bg2 li {border-bottom:1px solid rgba(85,85,85,0.1)}
#Quick ul.bg2 li .t1 {color:#777}
#Quick ul.bg2 li a:hover .t1 {color:#000}
#Quick ul.bg2 li:last-child { border-bottom:0}


@media all and (max-width:1024px) {
	#Quick ul {padding:5px 10px; }
	#Quick ul li {padding:5px 0; }
	#Quick ul li img {width:30px}
	#Quick ul li .t1 {font-size:1.2rem; padding-top:3px}
}
@media all and (max-width:976px) {
    #Quick {bottom: 33%;}
    #Quick ul{padding: 3px 6px;}
    #Quick ul li{padding: 3px 0; border-bottom:none;}
	#Quick ul li:not(.mo){display:none; }
    #Quick ul:nth-child(2){display: none;}
    #Quick ul li .t1{display: none;}
}