@charset "utf-8";

html, body {font-size:13px;}

/*HEADER ------------------------------------------------*/

#container {background:url(/images/main_imgbg2.jpg) repeat-x center top; background-size:contain;}

#header {width:100%; min-width:320px; z-index:99; background-color:#FFFFFF;}

.header {background-color:#000;opacity:1;}

/*-- gnb 상단고정 --*/
.headernav-lnb {width:100%; height:80px; background-color:#FFFFFF; z-index:100;}
.headernav-lnb.quickFixed_header {position:fixed; top:0px; width:100%; z-index:999;}
.clearFix_header {*zoom:1;}
.clearFix_header:after {content:""; display:block; clear:both;}
/*-- ~gnb 상단고정 --*/

#gnb {width:100%; z-index:999; position:relative; border-bottom:1px solid #FFF; background-color:#000;opacity:0.7;}

#gnb_logo > #globallogo {float:left; width:230px; height:80px;}
#gnb > #gnb_logo > #globallogo a {display:block; width:100%; height:50px; padding:5% 0; background:url('/images/logo.png') no-repeat center; background-size:contain; text-indent:-9999px;}

#gnb_list > #globallist {float:right; width:50px; height:50px; padding-top:15px;margin-right:0px;}
#gnb > #gnb_list > #globallist a {display:block;width:100%;height:100%;background:url('/images/kakao.png') #CCC no-repeat center;}

/*GLOBAL NAVIGATION ------------------------------------------------*/
#gnb > #gnb_top {position:relative;}
#globalnav_m {display:block; width:100%; line-height:40px; position:absolute; top:80px; left:0px;background-color:rgba(0,0,0,0.7);}
/* Main menu */
#globalmenu_m {margin:0;}
#globalmenu_m li {float:left; display:block; margin:0 7px;text-align:left;}
#globalmenu_m li {color:#FFF; font-size:1.1em;font-family:"Nanum Gothic";font-weight:300;text-decoration: none;text-shadow: 0 1px 0 #f2f2f2;}
#globalmenu_m li:hover {color: yellow; background-color:2px solid #000; cursor:pointer;}
*html #globalmenu_m li a:hover {color: #003399;} /* IE6 */
#globalmenu_m li:hover > ul {display: inline-block;}

#globalnav {display:none;}

.topline {position:absolute; z-index:20; top:60px; left:0; width:100%; height:6px; border:0px solid #CCC; background:url('/images/top_bg.png') repeat-x top transparent;}

#middle_area {display:none; text-indent:-999;}
#topicon > a.glbtop {display:none; text-indent:-999;}

#section {width:100%; min-width:320px; margin:0 auto; overflow:hidden;}


/*HEADER ------------------------------------------------*/

/*MAIN CONTENS ------------------------------------------------*/

#main_contents {width:100%;min-width:320px;max-width:760px;margin:auto;}

.main_title {margin:0 auto; overflow:hidden; padding-top:50px; padding-bottom:40px;}
.main_title dl {margin:0 auto; width:80%; text-align:center;}
.main_title dl dt {font-size:2.35em; font-weight:bold; margin-bottom:18px; text-transform:uppercase;}
.main_title dl dd {font-size:1.05em; line-height:150%; color:#666666; margin-bottom:0px;}


/* PART 1 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

#main_part1 {width:100%; height: auto !important; padding-top:0px; overflow:hidden;}

/* 메인슬로건  */
#mainslogan {display:bolco; margin:0 auto; overflow:hidden; width:300px; min-height:400px; position:relative;}
#mainslogan p {display:block; height:72px;position:absolute;top:100px;left:0px;z-index:200;color:#FFF;text-shadow:0px 0px 3px #330000;line-height:30px;font-size:1.45em;text-align:center;font-weight:300;letter-spacing:-1px;}
#mainslogan p span {display:block;font-size:2.25em;font-weight:700;color:#FFFFFF;text-decoration:;font-family:Bodoni MT;height:85px;line-height:30px;}

/* PART 1 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* PART 2 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
#main_part2 {width:100%; height: auto !important; padding-bottom:80px; overflow:hidden; background-color:#FFFFFF;}

.main_brand {margin:0 auto;overflow:hidden;}

.main_brand ul.infoPlace {width:280px; overflow:hidden; margin:0 auto; text-align:center; padding:0 0%;}
.main_brand ul.infoPlace li {float:left; border-radius:0px;}
.main_brand ul.infoPlace li div {display:block; overflow:hidden; text-align:center; width:140px; height:73px;  border:1px solid #FFF; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;}
.main_brand ul.infoPlace li div.img1 {background:url('/images/brand2.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img2 {background:url('/images/brand1.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img3 {background:url('/images/brand10.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img4 {background:url('/images/brand6.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img5 {background:url('/images/brand3.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img6 {background:url('/images/brand8.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img7 {background:url('/images/brand5.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img8 {background:url('/images/brand7.jpg?version=2020033101') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img9 {background:url('/images/brand4.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img10 {background:url('/images/brand11.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img11 {background:url('/images/brand12.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img12 {background:url('/images/brand9.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img13 {background:url('/images/brand13.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img14 {background:url('/images/brand14.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img15 {background:url('/images/brand15.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img16 {background:url('/images/brand16.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img17 {background:url('/images/brand17.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div.img18 {background:url('/images/brand18.jpg') no-repeat top;opacity:0.7;}
.main_brand ul.infoPlace li div img {margin-top:20px; max-width:120px;}
.main_brand ul.infoPlace li div img:hover {background-color:#FFF;}

/* PART 2 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */


/* PART 3 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
#main_part3 {display:block;width:100%; height: auto !important; padding-top:0px; overflow:hidden; background-color:#e7e7e7;background-image:url(/images/part3_bg.jpg);background-size:cover;background-repeat : no-repeat;background-position:center;}

.main_company_eff > ul {overflow:hidden;width:100%;margin:0 auto;margin-bottom:20px;}
.main_company_eff > ul > li {float:left;width:50%;text-align:center;padding:40px 0 60px 0;}
.main_company_eff > ul > li h1 {font-size:1.8em;margin-bottom:20px;}
.main_company_eff > ul > li span {font-size:40px;font-weight:bold;}

/* PART 3 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* PART HISTORY - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
#history {width:100%; height: auto !important; padding-top:0px; overflow:hidden;position:relative;background-color:#f0f1f2;}
#history .history {margin:0 auto;padding:50px 0;}
#history > .history> .historypage > ul {overflow:hidden;}
#history > .history> .historypage > ul > li {float:left;width:25%;background:url(/images/main_historydot.jpg) no-repeat;background-position:left top;}
#history > .history> .historypage > ul > li dt {font-size:1.4em;font-weight:bold;padding-bottom:20px;padding-top:40px;}
#history > .history> .historypage > ul > li dd li {font-size:0.9em;color:#808080;line-height:180%;letter-spacing:-1px;}

/* PART 4 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
#main_part4 {width:100%; height: auto !important; padding-bottom:80px; overflow:hidden; background-color:#FFFFFF;}

.main_history {margin-bottom:0px;}
.main_history dl {text-align:center;margin:50px 0;}
.main_history dt {margin-bottom:10px;font-size:1.55em;font-weight:bold;color:#808080;}
.main_history dd {line-height:30px;font-size:1.05em;}

#main_part4 .logo_bg {display:none;}

/* PART 4 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/* PART 5 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */
#main_part5 {width:100%; height: auto !important; padding-top:0px; overflow:hidden; background-color:#fff;padding-bottom:50px;}

#main_part5 .main_contact {width:450px;margin:0 auto;position:relative;}
#main_part5 .main_contact li {margin-top:10px;}
#main_part5 .main_contact li input {width:100%;height:40px;}
#main_part5 .main_contact p {margin-top:10px;font-size:1.1em;}
#main_part5 .main_contact input[type=submit] {
	width:100%;margin-top:15px;
	-webkit-border-radius:0px;-moz-border-radius:0px;border-radius:0px;
	border:0px solid #007fc8;padding:15px;color:#FFFFFF;font-size:1.2em;font-weight:bold;font-family:"Nanum Gothic","돋움";
	background: #0099f1; /* Old browsers */
}

#yakcontent {display:none;position:absolute;top:0px;left:0px;width:450px;background-color:#FFF; border:1px solid #000;padding:10px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;line-height:150%;}
#yakcontent h1 {font-size:1.5em;margin-bottom:15px;}
#yakcontent input {float:right;}

/* PART 5 - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - - */

/*INTRO ------------------------------------------------*/
#intro {width:100%;height:100%;text-align:center;vertical-align:middle;}
.intrologo {
	margin-top:100px;width:80%;height:auto;
	animation-name:introplay;
	animation-duration:2s;
	animation-iteration-count:1;
}

@keyframes introplay {
	from {
		transform : scale(0);opacity:0;
	}
	to {
		transform : scale(1);opacity:1;
	}
}

.btnhome {
	margin-top:80px;margin-left:calc(50% - 75px);
	text-align:center;width:150px;line-height:40px;font-weight:bold;font-size:1.2em;color:#373737;
	background-color:#c0c0c0;border-radius:20px;
	animation-name:btnplay;
	animation-duration:2s;
	animation-iteration-count:10000;
}

@keyframes btnplay {
	0% {background-color:#c0c0c0;color:#373737;}
	50% {background-color:#8b8b8b;color:#FFF;}
	100% {background-color:#c0c0c0;color:#373737;}
}
/*INTRO ------------------------------------------------*/

/* FOOTER ------------------------------------------------*/

#footer {width:100%; overflow:hidden; margin:0 auto; background-color:#585858; border-top:1px solid #e2e2e2;}

#footer > #csCopy {padding:20px; margin:0 auto; overflow:hidden; position:relative;}
#footer > #csCopy > .copybox {display:block; margin:0 auto; z-index:100;}
#footer > #csCopy > .copybox .copymenu {margin:0 auto; display:block; height:20px; line-height:20px; padding:20px 0;}
#footer > #csCopy > .copybox .copymenu li {float:left;}
#footer > #csCopy > .copybox .copymenu li a {color:#FFFFFF; font-size:0.95em; text-transform:uppercase;}
#footer > #csCopy > .copybox .copymenu li a:hover {color:#CC0000;}
#footer > #csCopy > .copybox .copymenu li span {padding:0 10px; color:#e7e7e7; font-size:11px; text-align:center;}
#footer > #csCopy > .copybox .copytalk {position:absolute; right:10px; top:100px; float:right; margin:0 auto; overflow:hidden; padding-top:5px;}
#footer > #csCopy > .copyinfo {display:block; width:100%; margin:0 auto; overflow:hidden; padding-top:30px; position:relative;}
#footer > #csCopy > .copyinfo > .copy {margin:0 auto; color:#FFFFFF; font-size:0.95em; line-height:24px;color:#FFF;}
#footer > #csCopy > .copyinfo > .copy p {color:#FFFFFF; font-size:1.1em;}
#footer > #csCopy > .copyinfo > .copy a {color:#FFF;}
#footer > #csCopy > .copyinfo > .copy a:hover {color:#2a3866;}
#footer > #csCopy > .copyinfo > .copy span.blank {display:inline-block; width:15px; height:5px;}
#footer > #csCopy > .copyinfo > .copyright {margin:0 auto; overflow:hidden;}
#footer > #csCopy > .copyinfo > .copyright p {color:#9e9e9e; font-size:0.9em; padding:20px 0;}

/* ~FOOTER ------------------------------------------------*/