@charset "euc-kr";
/*CSS Document*/
@import url(reset.css);
/*¿¡½ºÄÚ¾î*/
@font-face { font-family: 'S-CoreDream-3Light'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-3Light.woff') format('woff'); font-weight: normal; font-style: normal; }
@font-face { font-family: 'S-CoreDream-4Regular'; src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_six@1.2/S-CoreDream-4Regular.woff') format('woff'); font-weight: normal; font-style: normal; } 

@import url(//fonts.googleapis.com/earlyaccess/notosanskr.css); .notosanskr * { font-family: 'Noto Sans KR', sans-serif; }



#Header { height:80px; background:#fff; font-family:'Nanumgodic';border-bottom:3px solid #cd274d}

#Gnb {  width:1200px; margin:0 auto; text-align:center; position:relative; padding:3px 0;} 
#Gnb .utill {  right:0; top:0; white-space: nowrap; font-size:15px;text-align:right;}
#Gnb .utill a { padding:7px 0 0 15px; display:inline-block; color:#999; }

#Navi { width:1000px; margin:0 auto;   position:relative; }
#Navi ul { position:absolute; left:170px;  width:820px; margin:0 auto; overflow:hidden; }
#Navi ul li { /*width:20%;*/ margin-left:60px; float:left; }
#Navi ul li a {font-weight:bold; display:block; text-align:center; color:#f8f8f8; line-height:80px;font-size:17px;   padding-top: 6px; }
#Navi ul li a:hover { color:#ea274b; font-weight:800; }

/*¸ÞÀÎºñÁÖ¾ó¿¡ °ÉÄ¡´Â ¸Þ´º*/
#Visual{position: absolute; width: 100%; top: 589px; z-index: 999;}

.main_cont { width:900px; margin:0 auto; overflow:hidden;  }
.main_cont li { margin:0 5px 10px; width:290px; float:left; background:url(../img/main/arrow.png) right 10% top 50% no-repeat #ea274b; padding:20px 0px 20px 20px;  transition:0.3s; }
.main_cont li.border { }
.main_cont li:hover {box-shadow:5px 5px 5px rgba(0,0,0,0.2); transition:0.3s; }
.main_cont li.last { }
.main_cont li.last a  { color:#ce7722; }
.main_cont li a { line-height:30px; display:inline-block; }
.main_cont li a b { color:#fff; font-size:18px; letter-spacing:-0.05em;  }
.main_cont li a span { color:#fff; font-size:12px; display:inline-block; margin-left:10px; letter-spacing:-0.05em; }

/*¸ÞÀÎ ÇÏ´Ü ¹è³Ê3Á¾*/
.m_bn{padding:100px 0 00px; background-color:#fff; text-align:center;}



/* ¸ÞÀÎ ¼³ºñ±â°è¸Þ´º */
.product_main {width:1270px; height:802px; margin:-2px auto;}
.product_main .first_box {border-right:3px solid #dc2443; text-align:center; width:300px; height:800px;  float:left;  padding:80px 0 80px 0px; position:relative;} 
.product_main .first_box img {position:absolute; bottom:-30px; right:0;}
.product_main ul {width:970px; float:left; padding:100px 0 100px 70px }
.product_main li { height:300px; width:300px; float:left; text-align:center;}
.product_main li a { transition:0.3s;  display:inline-block; width:100%; height:100%; text-decoration:none;  position:relative; } 
.product_main li a:hover {  transition:0.3s;  color:#ea274b;  }
.product_main li a p { position:absolute; width:100%; bottom:10px; left:30px; text-align:center; font-size:20px; font-weight:900; font-family:'nanumgodic'; }
.product_main li a span { text-align:center; font-size:15px; font-weight:500; }

.main_c_1 {background:url('../img/main/01.png') no-repeat 0px 40px; background-size:100%;}
.main_c_2 {background:url('../img/main/main_01.png') no-repeat 30px 0px; background-size:85%;}
.main_c_3 {background:url('../img/main/main_02.png') no-repeat 0px 80px; background-size:100%; }
.main_c_4 {background:url('../img/main/main_04.png') no-repeat 35px 32px; background-size:75%; }
.main_c_5 {background:url('../img/main/main_05.png') no-repeat -5px 80px; background-size:105%; }
.main_c_6 {background:url('../img/main/main_03.png') no-repeat -10px 25px; background-size:110%;} 




.snip1585 {
  background-color: #000; color: #fff; display: inline-block; font-family: 'NanumSquare', sans-serif !important; font-size: 24px; margin-right: 16px; max-width: 320px; min-width: 230px; overflow: hidden;
  position: relative; text-align: center; width: 100%;}

.snip1585 * { -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.45s ease; transition: all 0.45s ease;}

.snip1585:before,
.snip1585:after { background-color: rgba(0, 0, 0, 0.5); border-top: 50px solid rgba(0, 0, 0, 0.5); border-bottom: 50px solid rgba(0, 0, 0, 0.5); position: absolute;  top: 0;  bottom: 0;
  left: 0; right: 0;  content: ''; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; z-index: 1; opacity: 0;}
.snip1585:before { -webkit-transform: scaleY(2); transform: scaleY(2);}

.snip1585:after { -webkit-transform: scaleY(2); transform: scaleY(2);}

.snip1585 img { vertical-align: top; max-width: 100%; backface-visibility: hidden;}

.snip1585 figcaption { position: absolute; top: 0; bottom: 0; left: 0; right: 0; align-items: center; z-index: 1; display: flex; flex-direction: column; justify-content: center;
  line-height: 1.1em; opacity: 0; z-index: 2; -webkit-transition-delay: 0s; transition-delay: 0s;}

.snip1585 h3 { font-size: 18px; font-weight: 700; letter-spacing: 1px; margin: 0; text-transform: uppercase;}

.snip1585 h3 span { display: block; font-size:14px; font-weight:normal;}

.snip1585 a { position: absolute; top: 0; bottom: 0; left: 0; right: 0;  z-index: 3;}

.snip1585:hover > img,
.snip1585.hover > img { opacity: 0.7;}

.snip1585:hover:before,
.snip1585.hover:before,
.snip1585:hover:after,
.snip1585.hover:after { -webkit-transform: scale(1); transform: scale(1);  opacity: 1;}

.snip1585:hover figcaption,
.snip1585.hover figcaption { opacity: 1; -webkit-transition-delay: 0.1s; transition-delay: 0.1s;}

/*¿À¸¥ÂÊ*/
.snip15851 {
  background-color: #000; color: #fff; display: inline-block; font-family: 'Roboto', sans-serif; font-size: 24px; max-width: 320px; min-width: 230px; overflow: hidden;
  position: relative; text-align: center; width: 100%;}

.snip1585 * { -webkit-box-sizing: border-box; box-sizing: border-box; -webkit-transition: all 0.45s ease; transition: all 0.45s ease;}

.snip15851:before,
.snip15851:after { background-color: rgba(0, 0, 0, 0.5); border-top: 50px solid rgba(0, 0, 0, 0.5); border-bottom: 50px solid rgba(0, 0, 0, 0.5); position: absolute;  top: 0;  bottom: 0;
  left: 0; right: 0;  content: ''; -webkit-transition: all 0.3s ease; transition: all 0.3s ease; z-index: 1; opacity: 0;}
.snip15851:before { -webkit-transform: scaleY(2); transform: scaleY(2);}

.snip15851:after { -webkit-transform: scaleY(2); transform: scaleY(2);}

.snip15851 img { vertical-align: top; max-width: 100%; backface-visibility: hidden;}

.snip15851 figcaption { position: absolute; top: 0; bottom: 0; left: 0; right: 0; align-items: center; z-index: 1; display: flex; flex-direction: column; justify-content: center;
  line-height: 1.1em; opacity: 0; z-index: 2; -webkit-transition-delay: 0s; transition-delay: 0s;}

.snip15851 h3 { font-size: 20px; font-weight: 700; letter-spacing: 1px; margin: 0; text-transform: uppercase; font-family: 'NanumSquare', sans-serif !important;}

.snip15851 h3 span { display: block; font-size:14px; font-weight:normal;}

.snip15851 a { position: absolute; top: 0; bottom: 0; left: 0; right: 0;  z-index: 3;}


.snip15851:hover > img,
.snip15851.hover > img { opacity: 0.7;}

.snip15851:hover:before,
.snip15851.hover:before,
.snip15851:hover:after,
.snip15851.hover:after { -webkit-transform: scale(1); transform: scale(1);  opacity: 1;}

.snip15851:hover figcaption,
.snip15851.hover figcaption { opacity: 1; -webkit-transition-delay: 0.1s; transition-delay: 0.1s;}


/*ÆÐ·¯·¢½º ÅØ½ºÆ®*/
.parallax-window {min-height: 340px; background: transparent; padding-bottom: 0;  }

.parallax-window .para_text{text-align: center;	padding-top: 100px;	padding-bottom: 100px;	color: #f4f4f5;	}
#para{	margin: 0px auto;	height: 430px;}
.para_text h1 {font-family: 'NanumSquare', sans-serif !important;	font-size: 25px;}
.para_text1 h2 {font-family: 'NanumSquare', sans-serif !important; color: white; font-size: 60px; font-weight:700; line-height:150%;}
.para_text1 p {font-family: 'NanumSquare', sans-serif !important; color: white; font-size: 22px; font-weight:500;}

/*¸ÞÀÎÇÏ´Ü¹è³Ê µÎ¹øÂ°*/
.m_bn1{ width:100%; background: #6f6e6e; padding-top:40px; }

/* ¸ÞÀÎ ÄÁÅÙÃ÷ */
#m_container{   width:1200px; margin:0 auto; overflow:hidden; padding:10px 0 30px 0 ; }
#m_container h4{font-size:18px; color: #fff; font-weight:600;  font-family: 'NanumSquare', sans-serif !important;   padding-bottom: 0px;}
#m_container .f_wrap li {float:left; width:350px; padding-right: 20px; box-sizing:border-box;}

/* °øÁö»çÇ× */
.f_t2 {padding-top:23px}
.f_t2 li {width:350px !important; height:28px; color:#fff;  }  
.f_t2 a{text-decoration:none;color:#fff; font-size:15px;} 
.f_t2 div {text-decoration:none;color:#b3b3b9 ;  font-size:15px !important; }
f_right { float:right;} 
.f_left { float:left; } 

.f_02 {width:500px !important; padding-left:50px;}
.f_03 img {margin-top:27px;}

.f_logo {width:200px; }
#m_container01 {width:100%; padding:20px 0;background: #fff; border-top:1px solid #e1e1e3 }
#m_container01_in {width:1200px; margin:0 auto; }
#m_container01_in ul { padding:8px 0; width:700px; display:inline-block;  float:right; }
#m_container01_in ul li {float:right; padding-right:35px; position:relative; }
#m_container01_in ul li:after {content:''; height:13px; width:1px; background:#e1e1e3; display:block; position:absolute; bottom:5px; right:15px; }
#m_container01_in ul li:first-child:after {display:none; } 
#m_container01_in ul li a {display:inline-block; height:20px; font-size:15px; font-weight:600; color:#2d2d2d !important; }
#m_container01_in ul li a:hover {color:#2d2d2d; font-weight:bold !important;}


.main_title { font-size:18px; font-weight:600; text-align:center; }
.bn_tit { text-align:center; line-height:90px; border:1px solid #; background:#f7f7f7; margin-top:10px; font-size:10px; }

/* »ó´ã */
.m_cs{overflow:hidden; margin:0 0px 0px 0; }
.m_cs span{font-size:43px; color:#0085da; font-family:Calibri; letter-spacing:-1.7px; display:block; line-height:60px; }
.m_cs small{ font-size:14px; color:#616161;}
 
/* »ó´ã¹®ÀÇ */
#m_ask{position:relative; overflow:hidden; }
#m_ask h2{height:18px; font-size:18px; font-weight:600; margin-bottom:24px;}
#m_ask table{float:left; letter-spacing:-0.05em;}
#m_ask table td{font-size:11px; color:#a3a3a3; margin-bottom:2px;     line-height: 140%;}
#m_ask .m_notice_title{padding-right:75px; margin-bottom:0;}
#m_ask .m_notice_title a{font-size:12px; color:#666666;}
#m_ask .m_notice_title a:hover{color:#4794d5;}
#m_ask button{position:absolute; top:7px; right:4px; font-size:11px; color:#7d7d7d;}


#Sub_Wrap { width:1000px; margin: 0 auto; overflow:hidden; }

#Sub_Category { float:left; width:150px; margin-top:30px; }
#Sub_Container { float:right; width:750px; margin-top:30px;  }

/*¼­ºê»ó´ÜÀÌ¹ÌÁö*/
/* °ßÀûÀÇ·Ú */
#subtop1 {background:#eee; height:350px; background:url('../img/comm/sub_01.jpg')no-repeat ; background-position:bottom right; background-size:100%; }
/* È¸»ç¼Ò°³ */
#subtop2 {background:#eee; height:350px; background:url('../img/comm/sub_02.jpg')no-repeat ; background-position:bottom right; background-size:100%; }
/* °í°´Áö¿ø */
#subtop3 {background:#eee; height:350px; background:url('../img/comm/sub_03.jpg')no-repeat ; background-position:bottom right; background-size:100%; }
/* Á¦Ç°¼Ò°³ */
#subtop4 {background:#eee; height:350px; background:url('../img/comm/sub_04.jpg')no-repeat ; background-position:bottom right; background-size:100%; }
/* ÁÖ¹®Á¦ÀÛ */
#subtop5 {background:#eee; height:350px; background:url('../img/comm/sub_05.jpg')no-repeat ; background-position:bottom right; background-size:100%; }
/* µ¿¿µ»óÀÚ·á */
#subtop6 {background:#eee; height:350px; background:url('../img/comm/sub_06.jpg')no-repeat ; background-position:bottom right; background-size:100%; }
/* ¸É¹ö */
#subtop7 {background:#eee; height:350px; background:url('../img/comm/sub_07.jpg')no-repeat ; background-position:bottom right; background-size:100%; }


#subtop_con{width:1000px; margin:0 auto; }
#subtop_con p {font-size:28px; text-align:center; line-height:150px; font-weight:700; font-family: 'S-CoreDream-4Regular', sans-serif !important; color:#111;}

/*¼­ºêÄ«Å×°í¸®*/
#Sub_Category .Category_Title { padding:20px 0 20px 00px; letter-spacing:-0.05em; border-top:5px solid #ea274b;  }
#Sub_Category .Category_Title span { color:#999; font-size:13px; }
#Sub_Category h2 { font-size:26px; font-weight:900; color:#ea274b; margin-top:10px; height:40px; line-height:33px; font-family: 'noto Sans KR', sans-serif !important; }
#Sub_Category ul { padding-top:12px; }
#Sub_Category li { background:#fff; }
#Sub_Category li a {transition:0.3s; box-sizing:border-box;  display:block; line-height:1.2!important; color:#666; padding:15px 0 5px 0px; font-size:14px; letter-spacing:-0.5px; font-family: 'S-CoreDream-4Regular';}
#Sub_Category li a:hover { text-decoration:none; padding-left:15px; transition:0.3s; }
#Sub_Category li.on a  { font-weight:700; color:#ea274b; /*background:url(../img/comm/arrow.png) no-repeat 90% 17px #fff;*/ } 

#Sub_Category .cate_in {}
#Sub_Category .cate_in li {font-size:14px; color:#b6b6b6 !important; padding-left: 10px; ;} 
#Sub_Category .cate_in li a{padding-top:5px; position:relative;}



/*¼­ºêÅ¸ÀÌÆ²*/
#Sub_Title { position:relative; border-bottom:1px solid #ddd; height:48px;}
#Sub_Title h3 { position:absolute; font-size:26px; font-weight:normal; color:#333; letter-spacing:-0.05em; font-family: 'S-CoreDream-4Regular', sans-serif !important; font-weight:700;}
#Sub_Title ul { position:absolute; overflow:hidden; right:0; top:10px; }
#Sub_Title li { float:left; color:#666; letter-spacing:-0.05em; padding-left:15px; background:url(../img/comm/arrow.png) no-repeat 4px -29px;  font-size:12px !important;}
#Sub_Title li.home {  background:url(../img/comm/home.png) no-repeat 4px 4px; }
#sub_title ul li span{color:#555;  }

/*¼­ºêÄÁÅÙÃ÷*/
#Sub_Body  { margin-top:30px; min-height:500px; padding-bottom:50px; } 
.sub_tit {font-size:30px; font-weight:bold; font-family: 'S-CoreDream-4Regular', sans-serif !important;}
.sub_tit span {color:#ea274b; font-weight:800;} 
.sub_tits {padding-top:5px; font-size:15px; color:#999;}

/*ÀÎ»ç¸»*/
.gtgt {font-size:17px; font-family: 'S-CoreDream-4Regular', sans-serif !important; color:#333; font-weight:normal; line-height:140%;}
.gt_right {font-size:17px; font-weight:bold; font-family: 'S-CoreDream-4Regular', sans-serif !important; text-align:right;}


/*¿¬Çõ*/
/*È¸»ç¿¬ÇõÅ×ÀÌºí¾ç½Ä*/
.history th, .history td{padding:10px 0;}
.history th{font-size:2.3em; color:#fbac18; padding-right:20px; vertical-align: top;}
.history td{border-bottom:1px dashed #999999; font-size:17px; padding:10px; font-family: 'S-CoreDream-4Regular', sans-serif !important; color:#333; font-weight:normal; line-height:130%;}
.dash{border-bottom:1px dashed #999999;}



/*ÇÏ´ÜÀÎÆ÷*/
#Footer { text-align:left;  height:120px; margin:0px auto 0; background: #6f6e6e;  padding:00px 0 10px}
.footer_cont { width:100%; margin: 0 auto; padding-top:20px; line-height:20px;  background: #6f6e6e; }  
.footer_cont span { padding:0 10px; background:url(../img/comm/line_g.gif) no-repeat center 3px; color:#6b6b7a}
.footer_cont .copyright {  color:#b3b3b9;font-size:13px; width:1200px; margin:0 auto; }
.footer_cont .copyright p { color:#b3b3b9;padding-bottom:30px; }





.sub_btit {font-family: 'NanumSquare', sans-serif !important; font-size:20px; text-align:left; font-weight:700; border-left:5px solid #ea274b; padding-left:5px; line-height:22px; color:#333}


/* -------------------------------- 2. Auto-Hiding Navigation - with Sub Nav-------------------------------- */
.cd-secondary-nav {
	position:relative;
	z-index:1;
	clear:both;
	width:100%;
	height:50px;
	font-family: 'RIDIBatang';
	background-color:/*#25283D*/#f2f2f2;
	/* Force Hardware Acceleration */
	-webkit-transform:translateZ(0);
	transform:translateZ(0);
	will-change:transform;
	-webkit-transition:-webkit-transform .5s;
	transition:-webkit-transform .5s;
	transition:transform .5s;
	transition:transform .5s,-webkit-transform .5s;
}
.cd-secondary-nav::after {
	/* gradient on the right - to indicate it's possible to scroll */
	content:'';
	position:absolute;
	z-index:1;
	top:0;
	right:0;
	height:100%;
	width:35px;
	background:transparent;
	/*background:-webkit-linear-gradient(right,#25283D,rgba(37,40,61,0));
	background:linear-gradient(to left,#25283D,rgba(37,40,61,0));*/
	pointer-events:none;
	-webkit-transition:opacity .2s;
	transition:opacity .2s;
}
.cd-secondary-nav.nav-end::after {
	opacity:0;
}
.cd-secondary-nav ul,.cd-secondary-nav li,.cd-secondary-nav a {
	height: 100%;
}
.cd-secondary-nav ul {
	/* enables a flex context for all its direct children */
	display:-webkit-box;
	display:-webkit-flex;
	display:-ms-flexbox;
	display:flex;
	padding:0 5%;
	overflow-x:auto;
	-webkit-overflow-scrolling:touch;
}
.cd-secondary-nav ul::after {
	clear:both;
	content:"";
	display: block;
}
.cd-secondary-nav li {
	font-size: 14px;
	display:inline-block;
	float:left;
	/* do not shrink - elements float on the right of the element */
	-webkit-flex-shrink:0;
	-ms-flex-negative:0;
	flex-shrink:0;
}
.cd-secondary-nav li:last-of-type {
	padding-right:20px;
}
.cd-secondary-nav a {
	display:block;
	color:#333;
	opacity:.6;
	line-height:50px;
	padding:0 1em;
}
.cd-secondary-nav a:hover,.cd-secondary-nav a.active {
	opacity:1;
}
@media only screen and (min-width:1024px) {
	.cd-secondary-nav {
		height:70px;
		overflow: visible;
	}
	.cd-secondary-nav ul {
		/* reset mobile style */
		display:block;
		text-align:center;
	}
	.cd-secondary-nav li {
		/* reset mobile style */
		float:none;
		-webkit-flex-shrink:1;
		-ms-flex-negative:1;
		flex-shrink:1;
	}
	.cd-secondary-nav a {
		line-height:70px;
	}
	.cd-secondary-nav a.active {
		box-shadow:  inset 0 -4px #da3c72;
	}
}
/* -------------------------------- 3. Auto-Hiding Navigation - with Sub Nav+Hero Image-------------------------------- */
.cd-secondary-nav.fixed {
	position:fixed;
	top:60px;
}
.cd-secondary-nav.slide-up {
	-webkit-transform:translateY(-60px);
	-ms-transform:translateY(-60px);
	transform: translateY(-60px);
}
@media only screen and (min-width:1024px) {
	.cd-secondary-nav.fixed {
		top:80px;
		/* fixes a bug where nav and subnab move with a slight delay */
		box-shadow:0 -6px 0 #25283D;
	}
	.cd-secondary-nav.slide-up {
		-webkit-transform:translateY(-80px);
		-ms-transform:translateY(-80px);
		transform: translateY(-80px);
	}
}
/* -------------------------------- Main content-------------------------------- */
.cd-main-content {
	padding:60px 5% 2em;
	overflow: hidden;
}
.cd-main-content.sub-nav {
	/* to be used if there is sub nav */
	padding-top:110px;
}
.cd-main-content.sub-nav-hero {
	/* to be used if there is hero image+subnav */
	padding-top:0;
}
.cd-main-content.sub-nav-hero.secondary-nav-fixed {
	margin-top:50px;
}
.cd-main-content p {
	max-width:1024px;
	line-height:1.6;
	margin:2em auto;
	font-family:"David Libre",serif;
	color:#a5a8a9;
}
@media only screen and (min-width:1024px) {
	.cd-main-content {
		padding-top:80px;
	}
	.cd-main-content.sub-nav {
		padding-top:150px;
	}
	.cd-main-content.sub-nav-hero.secondary-nav-fixed {
		margin-top:70px;
	}
	.cd-main-content p {
		font-size: 2.4rem;
	}
}
/*	adjust the positioning of in-page links	http://nicolasgallagher.com/jump-links-and-viewport-positioning/
*/
.cd-main-content.sub-nav:target::before,.cd-main-content.sub-nav-hero:target::before {
	display:block;
	content:"";
	margin-top:-50px;
	height:50px;
	visibility:hidden;
}
@media only screen and (min-width:1024px) {
	.cd-main-content.sub-nav:target::before,.cd-main-content.sub-nav-hero:target::before {
		margin-top:-70px;
		height: 70px;
	}
}
/* -------------------------------- Intro Section-------------------------------- */
.cd-hero {
	/* vertically align its content */
	display:table;
	width:100%;
	margin-top:60px;
	height:300px;
	background:url(../img/cd-hero-background.jpg) no-repeat center center;
	background-size:cover;
}
.cd-hero .cd-hero-content {
	/* vertically align inside parent element */
	display:table-cell;
	vertical-align:middle;
	text-align:center;
}
@media only screen and (min-width:768px) {
	.cd-hero {
		height:400px;
	}
}
@media only screen and (min-width:1024px) {
	.cd-hero {
		height:600px;
		margin-top: 80px;
	}
}
