:root {
	--vh100: calc(var(--vh, 1vh) * 100);
}

@media all and (min-width: 961px){
	:root {
		--header: 100px;
	}
}
@media all and (max-width: 960px) {
	:root {
		--header: 80px;
	}
}


body {
	font-family:'Pretendard-Regular','Roboto',sans-serif !important;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	color:#363432; position: relative;
	background-color: #ffffff !important;
	word-break:keep-all
}

.mgnbmask {display: none}
.mgnb{display: none;}
.gnb_btn {display: none}
.text {letter-spacing: -1%; word-break:keep-all}
.section_title, .title, .subtext, .sub {word-break:keep-all}
.section {padding: 150px 0}
.wrap {width: 1200px;margin: 0 auto}
.disnone {display: none}
.nowrap {white-space: nowrap;}
.company {font-family: 'Pretendard-SemiBold';color: #613447;letter-spacing: 20%;font-size: 11px}
.only-mo {display: none}

header{position: fixed; width:100%; z-index: 99; top:0; transition: top 0.5s ease-in-out;}
header .headwrap{width:100%; margin:0 auto;position: static;padding:0 100px}
header .logo{height: 100px;position: relative; z-index: 99;padding:29px 0;transition: all .8s}
header .logo img{height: 42px;;transition: all .8s}
header .gnb ul{display: flex; justify-content: start; align-items: center;margin: 0}
header .gnb ul li {margin-left:30px;line-height: 100px}
header .gnb ul li .depth01 {line-height: 32px}
header .gnb ul li a{font-size: 16px; font-family: 'Pretendard-SemiBold';text-decoration: none; color:#000000;}
header .gnb ul li:last-of-type{margin-right:0;}

.gnb>ul>li>a {
	display: block;
	color: #ffffff;
	transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
}
.gnb>ul .depth01 {
	position: absolute;
	top: 80%;
	opacity: 0;
	visibility: hidden;
	transition: all .2s ease-in-out;
	-moz-transition: all .2s ease-in-out;
	-webkit-transition: all .2s ease-in-out;
}
.gnb>ul>li:hover .depth01 {
	opacity: 1;
	visibility: visible;
	top: 100%;
	padding-top: 0px;
	transition: all .5s;
}
.gnb>ul .depth01 a {
	display: block;
	color: #fff;
	background-color: #ec7994;
	width: 100%;
	min-width: 130px;
}
.gnb>ul .depth01 .top{
	background-color: #ec7994;
	height: 5px;
}
.gnb>ul .depth01 .bottom{
	background-color: #ec7994;
	height: 5px;
}

.depth01 .inner{padding: 5px;text-align: left;text-overflow: ellipsis; white-space: nowrap;padding:12px 30px 12px 14px;font-size: 14px}
.depth01 .inner:hover {background-color: #de5676;}
.depth01 a {color: #ffffff !important}



.sub_top_vis {height: 400px;display: flex;align-items: center;justify-content: center; text-align: center;font-family: 'SeoulHangangM';}
.sub_top_vis .inner .subtext {font-size: 18px;margin: 50px 0 10px;font-weight: bold}
.sub_top_vis .inner .title_font_b {font-size: 30px;line-height: 1em;letter-spacing: -.06em}
.vis1{color: #ffffff;background: url('/dist/image/sub/sub1.jpg') no-repeat;background-size: cover}
.vis2 {color: #4E6D86;background: url('/dist/image/sub/sub2.jpg') no-repeat;background-size: cover}

footer{position: relative;padding:50px 0 10px;color: #7f7f7f;background: #f6f1ed}
footer  img {height: 34px}
footer .wrap {margin-top: 10px;margin-bottom: 40px;text-align: center}
footer .info ul{font-size: 14px;font-family: 'Pretendard-Regular';line-height:1.8em;margin: 25px auto 30px}
footer .info ul li {display: inline-block;margin: 0 10px}
footer .info ul li b {font-family: 'Pretendard-SemiBold';margin-right: 5px}
footer .copy{font-size:12px; line-height: 1.5em;font-family: 'Pretendard-SemiBold';}

@media screen and (max-width:1320px) {
	.section {padding: 120px 0}
	
	header .headwrap{padding:0 4%}
	header .logo{padding:31px 0;transition: all .8s}
	header .logo img{height: 38px;;transition: all .8s}
	header .gnb ul li {margin-left:20px;}
	header .gnb ul li .depth01 {line-height: 32px}
	
}

@media screen and (max-width:1300px) {
	.wrap {width: 90%;margin: 0 5%}
}

@media screen and (max-width:1100px) {
	.wrap{width:92%;margin: 0 auto}
	
	
	header .logo{height: 36px;padding:30px 0 40px;margin-right: 0;transition: all .8s;text-align: center;width: 100%}
	header .logo img{height: 30px;transition: all .8s}
	header .gnb {width: 100%}
	header .gnb ul {margin: 0 auto;justify-content: center }
	header .gnb ul li {line-height: 90px;margin-left:20px;}
	header .gnb ul li a{font-size: 16px;}
	


}

@media screen and (max-width:960px) {
	footer .tel_wrap {margin-right: 40px}
}

@media screen and (max-width:860px) {
	.section {padding: 90px 0}
	.only-pc {display: none}
	.only-mo {display: block}
	
	.company {font-family: 'Pretendard-SemiBold';color: #1E3A5F;letter-spacing: 20%;font-size: 11px}

	header .logo{height: 60px;padding:20px 0;transition: all .8s;width: auto}
	header .logo img{height: 32px;transition: all .8s}
	header .gnb{display: none;}
	header .gnb_btn{display: block;z-index: 99}
	
	.sub_top_vis {height: 300px;display: flex;align-items: center;justify-content: center; text-align: center;font-family: 'SeoulHangangM';}
	.sub_top_vis .inner .subtext {font-size: 16px;margin: 20px 0 10px;font-weight: bold}
	.sub_top_vis .inner .title_font_b {font-size: 28px;line-height: 1em;letter-spacing: -.06em}
	.vis1{color: #ffffff;background: url('/dist/image/sub/sub1.jpg') no-repeat;background-size: cover}
	.vis2 {color: #4E6D86;background: url('/dist/image/sub/sub2.jpg') no-repeat;background-size: cover}
	
	.gnb_btn{z-index: 99;padding-top:22px}
	
	.toggle-mnu {
	  display: block !important;
	  width: 24px;
	  height: 24px;
	}
	
	.toggle-mnu span:after, .toggle-mnu span:before {
	  content: "";
	  position: absolute;
	  left: 0;
	  top: 7px;
	}
	
	.toggle-mnu span:after {
	  top: 14px;
	}
	
	.toggle-mnu span {
	  position: relative;
	  display: block;
	}
	
	.toggle-mnu span, .toggle-mnu span:after, .toggle-mnu span:before {
	  width: 100%;
	  height: 2px;
	  background-color: #1d3a5e;
	  transition: all 0.3s;
	  backface-visibility: hidden;
	  border-radius: 2px;
	}
	
	.toggle-mnu.on span {
	  background-color: transparent;
	}
	
	.toggle-mnu.on span:before {
	  transform: rotate(45deg) translate(-1px, 0px);
	}
	
	.toggle-mnu.on span:after {
	  transform: rotate(-45deg) translate(5px, -7px);
	}
	

	
	.mgnb{display: block; position: fixed; z-index:98;visibility: hidden; overflow-y: scroll;width:70%;height: calc(100%); top:0; transition: all .4s;right: -100%}
	.mgnb ul{margin-bottom: 0;}
	.mgnb .m_gnb {width:100%; background: #f6f0ec;}
	.mgnb .m_gnb ul{margin-top: 60px}
	.mgnb .m_gnb ul li{font-size: 18px; line-height: 1.5em;font-family: 'Pretendard-SemiBold';position: relative;border-bottom: 1px solid #cac1ba}
	.mgnb .m_gnb ul li::after{display:block; content: ''; position: absolute; top:0; bottom:0; left:0; right:100vw; margin:auto; border-radius: 0 8px 8px 0; background: #ec7994;color: #ececec; box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.25); z-index: 0; transition: right .4s;}
	.mgnb .m_gnb ul li.hover::after, .mgnb .m_gnb ul li.on::after{right:-10px;}
	.mgnb .m_gnb ul li a {text-decoration: none; color:#191919;padding:25px 40px; margin-left:auto; display:block; position: relative; z-index: 1; transition: color .4s;}
	.mgnb .m_gnb ul li.hover a, .mgnb .m_gnb ul li.on a{color:#ffffff;}
	
	.mgnbmask {background: rgba(0, 0, 0, 0.163);position: fixed;top: 0;left: 0;width: 100%;height: calc(100%);}
}

@media screen and (max-width:740px) {
	footer .info {width: 100%;margin-bottom:20px}
	
	footer{position: relative;padding:50px 0 10px;color: #7f7f7f;background: #f6f1ed}
	footer  img {height: 28px}
	footer .wrap {margin-top: 10px;margin-bottom: 40px;text-align: center}
	footer .info ul{font-size: 14px;font-family: 'Pretendard-Regular';line-height:1.8em;margin: 25px auto 30px}
	footer .info ul li {display: inline-block;margin: 0 10px}
	footer .info ul li b {font-family: 'Pretendard-SemiBold';margin-right: 5px}
	footer .copy{font-size:12px; line-height: 1.5em;font-family: 'Pretendard-SemiBold';}
}

@media screen and (max-width:620px) {
	.section {padding: 70px 0}
	
	.sub_top_vis {height: 250px;}
	.sub_top_vis .inner .subtext {font-size: 15px;margin: 30px 0 10px}
	.sub_top_vis .inner .title_font_b {font-size: 24px;line-height: 1em;letter-spacing: -.06em}
	
	
}
