@charset "utf-8";
@import url(http://fonts.googleapis.com/earlyaccess/notosanskr.css);



/* **** Common Reset **** */
*{margin:0;padding:0;text-decoration:none;list-style:none;font-size:14px;font-family: 'Noto Sans KR';color:#313131;}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5{margin:0;padding:0;word-wrap:break-word;word-break:break-all;}
li,p,span,strong,a{font-size:inherit;color:inherit;font-family:inherit;}
body, html{width:100%;height:100%;}
input,select,img{vertical-align:middle;}
img{border:0;}
table{border-collapse:collapse;width:100%;}
table caption{position: absolute;top: 0px;left: 0px;overflow: hidden;display: block !important;width: 0px !important;height: 0px !important;margin: 0 !important;font-size: 0 !important;line-height: 0 !important;}
.clear{clear:both;}
.clearfix::after{content:"";display:block;position:absolute;top:-99999px;left:-99999px;width:0;height:0;overflow:hidden;}
.blind {position: absolute;top: 0px;left: 0px;overflow: hidden;display: inline-block !important;width: 1px !important;height: 1px !important;margin: 0 !important;font-size: 0 !important;line-height: 0 !important;}
.scroll-transition-fade {transition:transform 1s ease-in-out,opacity .8s ease-in-out;}
.below-viewport {opacity:0;transform:translateY(40px);}
a{transition:all 0.3s ease-in-out;}





header{position:fixed;z-index:1000;width:100%;height:78px;border-bottom:0px solid #a6acb8;}
.header{width:1400px;margin:35px auto;overflow:hidden; background:rgba(0,0,0,0.8); }
.logo{float:left;margin: 2px 0 0 120px;}
.mo-menu{display:none;position:absolute;top:30px;right:22px;}

nav{display:inline-block; *display:inline; *zoom:1;text-align:right; float:right; padding-top:5px; padding-right:150px;}
nav > ul > li{float:left;margin-left:35px;line-height:86px;}
nav > ul > li:first-child{margin-left:0;}
nav > ul > li > a{font-size:17px;color:#ffffff;font-weight:400; position:relative;}
nav > ul > li > a::after{content: '';position: absolute;bottom: -31px;left: 0;width: 100%;height: 3px;background: rgba(50,175,27,0.8);transform: scaleX(0);transform-origin: right;transition: transform .8s cubic-bezier(.19,1,.22,1);z-index: -1;}
nav > ul > li > a:hover::after{transform: scaleX(1); transform-origin: left;}

nav ul li ul.dep02{position: absolute; width:130px; padding:10px 0; background-color:rgba(0,0,0,0.9);}
nav ul li ul.dep02 li{display:block;padding-bottom:20px; line-height:25px; width:100%;text-align:left; padding-left:15px; box-sizing:border-box;}
nav ul li ul.dep02 li a{line-height:1;color:#fff; font-weight: 300; font-size:13px;}
nav ul li ul.dep02 li a:hover{opacity:.6;}


body.fixed header {margin-top:-35px;transition:all 0.3s ease-in-out;}
body.fixed nav > ul > li > a{color:#fff;}
body.fixed .lang select{border:1px solid #dedede;background:#fff;color:#fff;}
body.fixed .lang .go-btn{border:1px solid #dedede;font-size:14px;color:#fff;}
body.is-hidden header {transform: translate3d(0,-100%,0);transition: all 0.3s ease-in-out;opacity: 0;}
body.is-visible header {transform: translate3d(0,0,0);transition: all 0.4s ease-in-out;opacity: 1;}




/* visual */
.visual{
	overflow:hidden;
	width:100%;max-width:1920px;
	height:638px;
	margin:0 auto;
	position:relative;
}
.visual .vprev{
	position:absolute;left:40px;top:50%;z-index:100;
	margin-top:-43px;
}
.visual .vnext{
	position:absolute;right:40px;top:50%;z-index:100;
	margin-top:-43px;
}
.visual .vlist{
	overflow:hidden;
	position:relative;
	width:100%;
	height:638px;
}
.visual .vlist ul{
	overflow:hidden;
	position:relative;
	width:100%;height:638px;
}
.visual .vlist ul li{
	opacity:0;
	position:relative;
	position:absolute;left:0;top:0;
	width:100%;height:638px;
	text-align:center;	
	transform:scale(1.03);
	transition:all 1s;
}
.visual .vlist ul li.v1{
	background:url(/img/main1.jpg) no-repeat center;
	background-size:cover;
	opacity:1;
}

.vlogo{text-align:left; width:1300px; margin:0 auto; padding-top:250px;}
.visual .vlist ul li.v2{
	background:url(/img/main2.jpg) no-repeat center;
	background-size:cover;
}
.visual .vlist ul li.v3{
	background:url(/img/main3.jpg) no-repeat center;
	background-size:cover;
}
.visual .vlist ul li.v4{
	background:url(/img/main3.jpg) no-repeat center;
	background-size:cover;
}

.visual .vlist ul li .vslg1{
	font-size:37px;color:#fff;
	margin-top:332px;margin-bottom:20px;
}
.visual .vlist ul li .vslg1:before{
	display:block;content:"";
	width:55px;height:1px;
	margin:0 auto 55px;
	background:rgba(255,255,255,0.3)
}
.visual .vlist ul li .vslg1 span:nth-child(1){display:block;margin-right:250px;line-height:130%;}
.visual .vlist ul li .vslg1 span:nth-child(2){display:block;margin-left:140px;line-height:130%;}
.visual .vlist ul li .vslg1{line-height:130%;}

.visual .vlist ul li .txt1{
	font-size:20px;color:#fff;
	line-height:150%;
}
.visual .vlist ul li .txt1:before{
	display:block;content:"";
	width:55px;height:1px;
	margin:60px auto 20px;
	background:rgba(255,255,255,0.3)	
}

.visual .vthum{
	position:absolute;left:0;bottom:28px;z-index:100;
	width:100%;text-align:center;
}
.visual .vthum ul{}
.visual .vthum ul li{
	display:inline-block;#display:inline;*zoom:1;
	width:55px;height:4px;
	margin:0 2px;
}
.visual .vthum ul li a{
	display:block;
	width:100%;height:100%;
	background:rgba(255,255,255,0.3)
}
.visual .vthum ul li a.on{
	display:inline-block;#display:inline;*zoom:1;
	width:55px;height:4px;
	background:rgba(255,255,255,1)
}


.visual .vlist ul li.on_visual{
	opacity:1;
	transform:scale(1.0);
	transition:all 1s;
}



/* main contents*/

.main_title{
	font-size:17px;
	color:#000;
	background:url(/img/title_line.png) no-repeat center top;
	padding-top:35px;
}


.main_area2{
	position:relative;
	text-align:center;
}
.main_area2 .bgarea{
	width:100%;
	height:375px;
	background:url(img/dpimg/main/main_area1_bg.gif) repeat 0 -3px;
	position:absolute;left:0;top:0;
	z-index:-1;
}
.main_area2 .brendshop{
	margin-top:45px;
	width:1580px;height:427px;
	margin:35px auto 0;
}
.main_area2 .brendshop>div>a{display:block;width:100%;}
.main_area2 .brendshop>div .bs_title{
	font-size:13px;color:#fff;text-align:center;
	font-weight:300;
	letter-spacing:1px;
	transition:all 1s;
	text-transform: uppercase;

	

}
.main_area2 .brendshop>div .bs_title li {font-style:Italic;list-style:none; padding-top:190px;}
.main_area2 .brendshop>div .bs_title span.t{
	font-size:25px;color:#fff;text-align:center;
	font-weight:600;
	letter-spacing:1px;
	transition:all 1s;
	font-style:none;

}


.main_area2 .brendshop .bread{
	float:left;
	width:394px;height:434px;
	background:#000 url(/img/m01.jpg) no-repeat left top;
}
.main_area2 .brendshop .bread .borderline{
	opacity:0;
	width:354px;height:370px;
	transform:translateY(0px);
	border-top:2px solid #fff;
	border-right:2px solid #fff;
	border-bottom:2px solid #fff;
	border-left:2px solid #fff;
	display:table;
	margin:0 auto;
	transition:all 1s;
	margin-top:-200px;
}
.main_area2 .brendshop>div:hover .bs_title{transform:translateY(-20px);opacity:0;transition:all 1s;}
.main_area2 .brendshop>div:hover .borderline{
	opacity:1;
	transform:translateY(-15px);
	transition:all 1s;
}
.main_area2 .brendshop .align{
	display:table-cell;
	vertical-align:middle;
}
.main_area2 .brendshop .bread .borderline .icon{}
.main_area2 .brendshop .icon:before{
	content:"";display:block;
	width:1px;height:95px;
	margin:0 auto 30px;
	background:rgba(255,255,255,0.3);
}
.main_area2 .brendshop .brand{margin:17px 0 13px}
.main_area2 .brendshop .bread .borderline .cate{}
.main_area2 .brendshop .cate:after{
	content:"";display:block;
	width:1px;height:95px;
	margin:30px auto 0;
	background:rgba(255,255,255,0.3);
}

.main_area2 .brendshop .cookie{
	float:left;
	width:394px;height:434px;
	background:url(/img/m02.jpg) no-repeat left top;
}
.main_area2 .brendshop .cookie .borderline{
	opacity:0;
	width:354px;height:370px;
	transform:translateY(0px);
	border-top:3px solid #fff;
	border-right:3px solid #fff;
	border-bottom:3px solid #fff;
	border-left:3px solid #fff;
	display:table;
	margin:0 auto;
	transition:all 1s;
	margin-top:-200px;
}
.main_area2 .brendshop .cake{
	float:left;
	width:394px;height:434px;
	background:url(/img/m03.jpg) no-repeat left top;
}
.main_area2 .brendshop .cake .borderline{
	opacity:0;
	width:354px;height:370px;
	transform:translateY(0px);
	border-top:3px solid #fff;
	border-right:3px solid #fff;
	border-bottom:3px solid #fff;
	border-left:3px solid #fff;
	display:table;
	margin:0 auto;
	transition:all 1s;
	margin-top:-200px;
}
.main_area2 .brendshop .caramel{
	float:left;
	width:394px;height:434px;
	background:url(/img/m04.jpg) no-repeat left top;
}
.main_area2 .brendshop .caramel .borderline{
	opacity:0;
	width:354px;height:370px;
	transform:translateY(0px);
	border-top:3px solid #fff;
	border-right:3px solid #fff;
	border-bottom:3px solid #fff;
	border-left:3px solid #fff;
	display:table;
	margin:0 auto;
	transition:all 1s;
	margin-top:-200px;
}


.main_btm{padding:38px 0;}
.main_btm .btm_wrap{overflow:hidden;width:1370px;margin:0 auto;}
.main_btm .btm_wrap .btm_title{position:relative;padding:15px 0;font-size:17px;color:#2a2a2a;font-weight:500;}
.main_btm .btm_wrap .btm_title a{position:absolute;right:5px;top:16px;font-size:12px;font-weight:400; color:#a7a7a7;}

.main_btm .gallery{float:left; width:400px; height:205px; border-top:2px solid #000; margin-right:38px;}
.main_btm .gallery ul li{display:inline-block; *display:inline; *zoom:1;}

.main_btm .counsel{float:left; width:400px; height:205px; border-top:2px solid #000; margin-right:38px;}
.main_btm .counsel ul li {text-align:left; font-size:15px; font-weight:300; padding-bottom:5px;}

.main_btm .cs{float:left; width:400px;height:205px;}



.main_area4{position:relative; max-width:1920px; height:376px; margin-top:60px; background:url(/img/cus_bg.gif) center top;}
.main_area4 .customer{width:1400px; margin:0 auto; top:-47px; height:353px;}
.main_area4 .customer:after{content:"";display:block;clear:both;}

.main_area4 .customer .branch{float:left;width:699px;height:353px; position:relative; background:url(/img/branch.gif) no-repeat; }
.main_area4 .customer .branch_ {padding-top:120px; width:550px; margin:0 auto; padding-left:70px;}
.main_area4 .customer .branch_ ul li {font-size:19px; color:#fff; width:265px; padding-bottom:7px; display:inline-block; *display:inline; *zoom:1;}
.main_area4 .customer .branch_ ul li span {padding-left:15px;}

.main_area4 .customer .mcus{float:left;width:560px;height:353px;background:#f6f6f6; text-align:center; overflow:hidden;}
.main_area4 .customer .mcus .class_name {font-size:20px;color:rgba(0,0,0,0.8);padding-top:40px}
.main_area4 .customer .mcus .class_name2 {font-size:16px;color:rgba(0,0,0,0.8);padding-top:10px}
.main_area4 .customer .mcus .mcus_wrap{text-align:center; letter-spacing:-1.5px;}
.main_area4 .customer .mcus .mcus_wrap .info_area{position:relative; margin:0 auto; width:434px; padding-top:20px;}
.main_area4 .customer .mcus .mcus_wrap .info_area .th{color:#444;font-size:35px;font-weight:600; background:url(/img/call.png) no-repeat 40px 5px;}
.main_area4 .customer .mcus .mcus_wrap .info_area .bank_t{color:#444; width:163px; margin:0 auto; border-bottom:2px solid #e54d1d; font-size:20px;font-weight:600; padding-bottom:10px;}
.main_area4 .customer .mcus .mcus_wrap .info_area .bank {margin-top:20px; background:#fff; font-size:15px; padding:15px 0; font-weight:500;}
.main_area4 .customer .mcus .mcus_wrap .info_area .bank span.bank_num {font-size:21px; font-weight:600; padding:0 20px;}
.main_area4 .customer .mcus .mcus_wrap .info_area .bank span.bank_name {font-size:15px; font-weight:300;}



/* footer */
#footer_l{background:#1e1e1e;padding:20px 0;}
.foot_logo{width:1400px; margin:0 auto; font-size:22px;color:#fff; opacity:.5;}

#footer{background:#1e1e1e;padding:10px 0 30px 0; border-top:1px solid #393939;}

.foot{overflow:hidden;position:relative;width:1400px;margin:0 auto;text-align:left;}

.foot .foot_info{float:left; width:900px;}

.foot .foot_info li{
	margin:20px 0 10px;
	font-size:15px;
	color:rgba(255,255,255,0.4);
	font-weight:300;line-height:170%;
}

.foot .foot_info .copy{
	font-size:13px;
	color:rgba(255,255,255,0.3);
	font-weight:300;
}

.foot .foot_info2{float:right; padding-top:30px;}


