@charset "utf-8";

/* layout */
.inner {	width: 100%; max-width:1560px;	position:relative;	margin-left:auto;	margin-right:auto; }
.s-inner {	width:100%; max-width:1400px;	position:relative;	margin-left:auto;	margin-right:auto; }

#wrap { font-size: 1.6rem;  /* overflow-x: hidden; */}

/* 타블렛 가로 */
@media all and (max-width:1560px) {
    .inner {	width: 90%;}
}
@media all and (max-width:1399px) {
    .s-inner {	width:95%; }
}
@media all and (max-width:1024px) {
    html { font-size: 60% !important; }
}
@media all and (max-width:768px) {
  html { font-size: 0.55rem !important; }
}
@media all and (max-width:480px) {
  html { font-size: 2.1vw !important; }
}




.p-Part { padding-top:70px 0}
.m-Part { margin-top:70px 0}
 
@media all and (max-width:1280px) {
	.p-Part { padding-top:40px 0}
	.m-Part { margin-top:40px 0}
}
@media all and (max-width:480px) {
	.p-Part { padding-top:11vw 0}
	.m-Part { margin-top:11vw 0}
}








/*Header*/
#header {padding:0 3%; position:fixed; width:100%; height:100px; z-index:150; display:flex;align-items: center; 
			justify-content: space-between;}

#header #logo { font-size:0; z-index:103; position:relative}
#header #logo a { width:310px; height:52px;}
#header #logo a.logo { display: block; background:url("/images/common/logo_251024.png") no-repeat left center; background-size:100% auto; }


#header .hd_bx { line-height:100px; }
#header .hd_mbx { display: none; }



#gnb_pc { }
#gnb_pc > ul > li {display:inline-block; vertical-align:top; text-align:center; position:relative;}
#gnb_pc > ul > li > div {display:block;  text-transform:uppercase; line-height:100px; position:relative; width: auto; font-weight:600;
							padding: 0 15px; cursor: pointer;letter-spacing:0; }
#gnb_pc > ul > li > div  a { font-size: 1.9rem; color:#000; }
#gnb_pc > ul > li > ul { display: none; padding:15px 0; width:190px; background:#fff; position: absolute; top: 100px; left: 50%; margin-left: -90px;  border:1px solid #eaeaea;}
#gnb_pc > ul > li > ul > li > a {display:block; width:100%;padding:7px; color:#000;box-sizing: border-box; line-height:1.4em; 
										font-size: 1.7rem;}
#gnb_pc > ul > li > ul > li:last-child > a {border-bottom:0;}
#gnb_pc > ul > li:hover > div a { color:#1fac55 }
#gnb_pc > ul > li > ul > li > a:hover {text-decoration:underline}
#gnb_pc > ul > li > ul > li > ul {display:none}



#hd_login {display:flex; gap:0 5px; position:relative}
#hd_login.pc li a {padding:0.5em 1em; border-radius:50px; background:rgba(0,0,0,0.3); color:#FFF}
#hd_login.pc li a:hover {background:#1fac55}

#hd_login.mo {margin:1em 0; padding:1em}
#hd_login.mo li a {padding:0.5em 1em; border-radius:50px; border:1px solid #fff; color:#fff;}
#hd_login.mo li a:hover {background:#1fac55; color:#FFF; border-color: #1fac55;}


.hd_full { display:none;  width:70px; height:70px; position:relative; cursor:pointer; z-index:5}
.hd_full span { display:block; width:26px; height:2px; background:#FFF; position:absolute; top: 50%; left:50%; margin-left: -13px; transition:all 0.5s; }
.hd_full span.t { margin-top:-10px; }
.hd_full span.m { margin-top: -1px;  }
.hd_full span.b { margin-top: 8px;  }



#header.scroll:before {content:''; width:100%; height:100%; position:absolute; left:0; top:0; background:rgba(0,0,0,0.2); backdrop-filter: blur(40px);}
#header.scroll #logo a.logo {background:url("/images/common/logo_251024.png") no-repeat left center; background-size:100% auto;}
/* #header.scroll .hd_full { background: #a59266;} */
#header.scroll .hd_full span {background:#FFF}
#header.scroll .t_blog{background-color: #0f9220}
#header.scroll .t_blog.talk{background-color: #e4ac12}


#gnb_mo { position:fixed; height:100%; z-index:999; right:0;  top:0; padding-top:70px; background:rgba(10,10,10,0.9);
                color:#FFF; width:100%; max-width:640px; box-sizing:border-box; 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); text-align: left; z-index:3}
#gnb_mo > ul > li > div {display:block; width:100%;  color:#fff; line-height:50px; border-bottom:1px solid rgba(255,255,255,0.1); box-sizing:border-box; padding:0 2rem; position:relative; cursor: pointer; }
#gnb_mo > ul > li > div.on {background:#a59266  }
#gnb_mo > ul > li > div:after {content:''; display:block; width:11px; height:1px; background:#fff; position:absolute; right:15px; top:50%; margin-top:-1px;}
#gnb_mo > ul > li > div:before {content:''; display:block; width:1px; height:11px; background:#fff; position:absolute; right:20px; top:50%; margin-top:-6px; transition:all 0.5s;}
#gnb_mo > ul > li > div a { color:#fff; font-size:1.9rem }
#gnb_mo > ul > li > ul { display:none; }
#gnb_mo > ul > li > ul > li > a { display:block; width:100%; color:#555; line-height:50px; padding:0 2rem 0 3rem; font-size: 1.7rem;
                                             border-bottom:1px solid #e1e1e1; background:#f9f9f9;  box-sizing:border-box; }

#gnb_mo > ul > li > div.on:before {transform:rotate(90deg)}

#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); }

#header.on .hd_full span.t {transform:translateY(9px) rotate(45deg)}
#header.on .hd_full span.m {width:0;}
#header.on .hd_full span.b {transform:translateY(-9px) rotate(-45deg)}



@media all and (max-width:1650px){
	#header #logo a { width:250px;}
	#gnb_pc > ul > li > div {padding:0 10px}
	#gnb_pc > ul > li > div  a { font-size: 1.9rem; }
}

@media all and (max-width:1510px){
  #header {padding:0; padding-right:0;  height:70px; justify-content:space-between; }
  #header #logo { margin-left:3%}
  #header #logo a { width:300px;}
  #hd_login {margin-left: auto}

  #header .hd_bx { line-height:70px;  }
  #header .hd_mbx { display: block;  }
  #header .hd_pc {display:none;}

  #header .t_blog { width:40px; height:40px; margin-left:3px }
}
@media all and (max-width:1280px){
  #header #logo a { width:250px;}
}

@media all and (max-width:768px){
    #header { height:60px; }
    #header::after { top: 60px; }
    #header .hd_bx { line-height:60px;  }
    #header .hd_full { width: 60px; height: 60px; }
	
	#header .t_tel,
	#header .t_blog {width:40px; height:40px;}

    #header.menu_on #gnb_pc:before { height:60px; }

    #header.scroll { height: 60px;  }
    #header.scroll .hd_bx { line-height: 59px; }
    #header.scroll #gnb_pc:before { height: 60px; }

    #gnb_mo { padding-top: 60px; }
}
@media all and (max-width:510px){
	#hd_login.pc {display:none}
}

@media all and (max-width:480px){
    #header { height:55px; }
    #header::after { top: 55px; }
    #header .hd_bx { line-height:55px;  }
    #header .hd_full  { width: 55px; height: 55px; }
    #header #logo a {width:230px;}
	#hd_login.mo {margin:2vw 0; padding:1em}
    #header .t_tel,
    #header .t_blog {width:36px; height:36px;}

    #header.scroll { height: 55px;  }
    #header.scroll .hd_bx { line-height: 54px; }
    #header.scroll #gnb_pc:before { height: 55px; }

    #gnb_mo { padding-top: 55px; }
}





/*header.ver2*/
#header.ver2 {padding:0 3%; position:fixed; width:100%; height:100px; z-index:150; display:flex;align-items: center; 
			justify-content: space-between; background-color: #fff;}

#header.ver2 #logo { font-size:0; z-index:103; position:relative}
#header.ver2 #logo a { width:312px; height:54px;}
#header.ver2 #logo a.logo { display: block; background:url("/images/common/logo_260423.png") no-repeat left center; background-size:100% auto; }

#header.ver2 #gnb_pc > ul > li > div  a{color: #050505;}
#header.ver2 .hd_full span {background:#000}

#header.ver2 .hd_bx { line-height:100px; }
#header.ver2 .hd_mbx { display: none; }



#header.ver2.scroll:before {display: none;}
#header.ver2.scroll #logo a.logo {background:url("/images/common/logo_260423.png") no-repeat left center; background-size:100% auto;}
#header.ver2.scroll .hd_full span {background:#000}
#header.ver2.scroll .t_blog{background-color: #0f9220}
#header.ver2.scroll .t_blog.talk{background-color: #e4ac12}

#header.ver2.on #logo a.logo {background:url("/images/common/logo_on_260423.png") no-repeat left center; background-size:100% auto;}
#header.ver2.on .hd_full span {background:#fff}
#header.ver2.on .hd_full span.t {transform:translateY(9px) rotate(45deg)}
#header.ver2.on .hd_full span.m {width:0;}
#header.ver2.on .hd_full span.b {transform:translateY(-9px) rotate(-45deg)}



@media all and (max-width:1650px){
	#header.ver2 #logo a { width:250px;}
}

@media all and (max-width:1510px){
  #header.ver2 {padding:0; padding-right:0;  height:70px; justify-content:space-between; }
  #header.ver2 #logo { margin-left:3%}
  #header.ver2 #logo a { width:300px;}

  #header.ver2 .hd_bx { line-height:70px;  }
  #header.ver2 .hd_mbx { display: block;  }
  #header.ver2 .hd_pc {display:none;}

  #header.ver2 .t_blog { width:40px; height:40px; margin-left:3px }
}
@media all and (max-width:1280px){
  #header.ver2 #logo a { width:250px;}
}

@media all and (max-width:768px){
    #header.ver2 { height:60px; }
    #header.ver2::after { top: 60px; }
    #header.ver2 .hd_bx { line-height:60px;  }
    #header.ver2 .hd_full { width: 60px; height: 60px; }
	
	#header.ver2 .t_tel,
	#header.ver2 .t_blog {width:40px; height:40px;}

    #header.ver2.menu_on #gnb_pc:before { height:60px; }

    #header.ver2.scroll { height: 60px;  }
    #header.ver2.scroll .hd_bx { line-height: 59px; }
    #header.ver2.scroll #gnb_pc:before { height: 60px; }

}
@media all and (max-width:510px){
}

@media all and (max-width:480px){
    #header.ver2 { height:55px; }
    #header.ver2::after { top: 55px; }
    #header.ver2 .hd_bx { line-height:55px;  }
    #header.ver2 .hd_full  { width: 55px; height: 55px; }
    #header.ver2 #logo a {width:230px;}
    #header.ver2 .t_tel,
    #header.ver2 .t_blog {width:36px; height:36px;}

    #header.ver2.scroll { height: 55px;  }
    #header.ver2.scroll .hd_bx { line-height: 54px; }
    #header.ver2.scroll #gnb_pc:before { height: 55px; }

}




#footer {padding:1.2em 0; background: #050505}
#footer .inner {display:flex; justify-content:space-between; flex-wrap:wrap; gap:10px;}
#footer .f-cont {display:flex; gap:5px 20px; flex-wrap:wrap;  }
#footer .f-cont p {  font-size:1.5rem; color:#FFF; opacity:.5 }
#footer .f-cont p span {color:#adadad}
#footer .copy { font-size: 1.4rem; opacity: 0.2; font-weight: 500; text-transform:uppercase; color:#FFF}

@media all and (max-width:976px) {
	#footer {padding:1.0em 0;}
}
@media all and (max-width:768px) {
	#footer { text-align:center}
	#footer .inner {justify-content:center;}
	#footer .f-cont {justify-content:center;}
}
@media all and (max-width:480px) {
	#footer .f-cont p {font-size:1.4rem}
	#footer .copy { font-size: 1.2rem; }
}








/* 개인정보처리방침 */
.layer{position:fixed; display:none; left:0;top:0; z-index:9999; width:100%; height:100%; background:rgba(0,0,0,0.3)}
.layer .layer_wrap{position:relative;width:90%; max-width:700px; height:500px; top:50%; transform:translateY(-50%);  margin:0 auto; border-radius:10px; background: #fff; 
					text-align:left; letter-spacing:-0.5px; box-shadow:0 0 50px rgba(0,0,0,0.6); overflow: hidden;}

.layer .layer_wrap h2 {padding:1em 0 0.7em; font-size:2.8rem; color:#111; text-align:Center;}
.layer .close_btn{position:absolute; overflow: hidden; right:0; top:0;background:#111;  border-radius:0 10px 0 10px; color: #fff;}
.layer .close_btn:hover {background:#636363 }
.layer .close_btn a{display: block;color: #fff;padding:14px 18px; font-size:20px; font-weight:bold;}

.layer .layer_wrap .contwrap{position: absolute; top: 70px;  bottom: 0;  left: 0;  right: 0;  overflow-y: auto;  overflow-x: hidden;  
									padding:15px 30px 30px;  font-size: 1.7rem; }
.layer .layer_wrap .contwrap h2 {padding:28px 20px;border-bottom:1px solid #eee; font-size:2.2rem; font-weight:bold;}
.layer .layer_wrap .contwrap .cont_wrap .t2 {font-size:1.5rem;}
.layer .layer_wrap .contwrap .cont_wrap{width:98%; height:360px; padding:8px 16px; overflow:auto; box-sizing:border-box;}
.layer .layer_wrap .contwrap .cont_wrap h4 {font-size:1.5rem; display:block; background: #eee;border-radius:3px; padding:7px 10px; font-weight: bold;}
.layer .layer_wrap .contwrap .cont_wrap p {font-size:1.4rem; margin-bottom:16px; padding:4px 12px; box-sizing:border-box; line-height:1.4em}
.layer .layer_wrap .contwrap  .pop_agree {overflow-y:scroll;height:100px;padding:5px;border:solid 1px #ddd;margin-bottom:5px;}

.layer .layer_wrap .contwrap > dl:first-child {border-top:2px solid #333;}
.layer .layer_wrap .contwrap > dl {display:flex; }
.layer .layer_wrap .contwrap > dl dt {width:110px; background:#f0f0f0; padding:0.5em; color:#111; border-bottom:1px solid #ebebeb;
												text-align:center; display:flex; align-items: center; justify-content:center}
.layer .layer_wrap .contwrap > dl dd {width:calc(100% - 110px); padding:0.5em; border-bottom:1px solid #f3f3f3}

.layer_wrap input[type="text"],
.layer_wrap input[type="number"],
.layer_wrap select {	font-size: 1.7rem;	color: #111;	border: 1px solid #DDD;	border-radius: 6px;	padding: 6px 10px;	
						box-sizing: border-box;}
.layer_wrap select:focus,
.layer_wrap input[type="text"]:focus {outline: none;	border-color: #aaa;}

.layer_wrap input[type="radio"],
.layer_wrap input[type="checkbox"] {
	appearance: none;	-webkit-appearance: none;	-moz-appearance: none;	
	width: 20px;	height: 20px;	border: 1px solid #DDD;	border-radius: 4px; 
	background-color: #fff;	cursor: pointer;	display: inline-block;	
	position: relative;	margin-right: 6px;	vertical-align: middle;}

/* 라디오만 둥글게 */
.layer_wrap input[type="radio"] {	border-radius: 50%;}

/* 체크됐을 때 스타일 */
.layer_wrap input[type="checkbox"]:checked {
	background-color: #333;	border-color: #333;}

.layer_wrap input[type="radio"]:checked {
	background-color: #333;	border-color: #333;}

/* 체크 표시 (✓) 효과 */
.layer_wrap input[type="checkbox"]:checked::after {
	content: '✓';	color: #fff;	font-size: 1.2rem;	position: absolute;	top: 1px;	left: 4px;}

/* 라디오 선택 시 점 표시 */
.layer_wrap input[type="radio"]:checked::after {
	content: '';	position: absolute;	top: 5px;	left: 5px;	width: 8px;	height: 8px;	background: #fff;	border-radius: 50%;}


.layer .btn_area {  display: flex;  justify-content: center;  gap: 5px;  margin-top: 30px;}
.layer .btn_area button {  font-size: 1.8rem;  padding: 12px 28px;  border-radius: 6px;  border: 1px solid #DDD;  cursor: pointer;  
								transition: all 0.2s ease; font-family:'SUIT'}
/* 문의하기 버튼 */
.layer .btn_area .btn_submit {  background: #0f9220;  color: #fff;  border-color: #0f9220;}
.layer .btn_area .btn_submit:hover {  background: #222;  border-color: #222;}
/* 취소하기 버튼 */
.layer .btn_area .btn_cancel {  background: #fff;  color: #333;}
.layer .btn_area .btn_cancel:hover {  background: #f4f4f4;}

@media all and (max-width:580px) {
	.layer .layer_wrap .contwrap{top: 60px; padding:10px 15px 15px}
	.layer .layer_wrap .contwrap > dl { flex-wrap:wrap; }
	.layer .layer_wrap .contwrap > dl dt {width:100%; justify-content:unset; border-bottom:0}
	.layer .layer_wrap .contwrap > dl dd {width:100%; border-color:#ede9e2;  padding:0.8em 0.5em; }
}
