.blue{color:#174da4}
.lmd{font-family: 'LotteMartDream'; font-weight:500}

/* animation effect */
.fadeup{position:relative;opacity:0;top:130px;transition: all 2s cubic-bezier(0.18, 0.89, 0.43, 1.14) 0s;}
.fadeup-in{position:relative;opacity:1;top:0;transition: all 2s cubic-bezier(0.18, 0.89, 0.43, 1.14) 0s;}
@-webkit-keyframes fade-in-bottom{0%{-webkit-transform:translateY(50px);transform:translateY(50px);opacity:0}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}@keyframes fade-in-bottom{0%{-webkit-transform:translateY(50px);transform:translateY(50px);opacity:0}100%{-webkit-transform:translateY(0);transform:translateY(0);opacity:1}}
@-webkit-keyframes text-focus-in{0%{-webkit-filter:blur(12px);filter:blur(12px);opacity:0}100%{-webkit-filter:blur(0);filter:blur(0);opacity:1}}@keyframes text-focus-in{0%{-webkit-filter:blur(12px);filter:blur(12px);opacity:0}100%{-webkit-filter:blur(0);filter:blur(0);opacity:1}}

.wrapper{width:1280px; margin:0 auto;}
.list01 > li{position:relative; line-height:1.9; padding-left:13px;}
.list01 > li:before{content:""; position:absolute; left:0; top:12px; width:5px; height:1px; margin-right:5px; background:#555;}
.list02 > li{position:relative; line-height:1.9; padding-left:13px;}
.list02 > li:before{content:""; position:absolute; left:0; top:12px; width:4px; height:4px; margin-right:5px; background:#007ad8; border-radius:50%;}

/* header */
#header{z-index:99;width:100%; height:100px; background:#fff; transition:0.3s; }
#header .wrapper{position:relative; margin:0 auto;}
#header h1{z-index:90; position:absolute; left:30px; top:15px; }
#header h1 a{display:block; width:285px; height:70px; background:url(../images/main/logo.jpg) no-repeat 50% 0; background-size:100%; font-size:0;}

#header .gnb{box-sizing:border-box; width:100%; text-align:center; top:0;}
#header .gnb > li{position: relative; display:inline-block;}
#header .gnb > li > a{position:relative; display:block; line-height:100px; height:100px; margin:0 30px; color:#111; font-size:18px; font-weight:600; transition:0.5s}
#header .gnb > li > a:hover{color:#004b85; transition:0.5s}
#header .gnb > li > a:hover:before{opacity:1;transition:0.4s;}
#header .gnb > li > .sub_menu{display:none; box-sizing: border-box; position:absolute; left:0; top:80px; width:100% !important; padding:15px 10px; border:1px solid #ddd; background:#fff;animation:submenu 0.3s 1 linear; z-index:99;}
#header .gnb li:hover .sub_menu{display:block;}
#header .gnb .sub_menu:before {display: inline-block; content: ""; width:12px; height: 12px; position: absolute; left: 50%; top: -12px; background: url(../images/main/menu_arrow.png) no-repeat 50% 50%;transform: translateX(-50%); }
#header .gnb .sub_menu li a{display: block;  color:#333; font-size:14px; text-align:center; word-break:keep-all; transition:0.4s;}
#header .gnb .sub_menu li a:hover{color:#125798}
#header .gnb .sub_menu li{margin-top:10px;}
#header .gnb .sub_menu li:first-child{margin-top:0;}
#header .area_util{position:absolute; right:30px; top:37px;  height:30px;}
#header .area_util > a{display:block;width:30px;height:100%;float: left;margin-top: 4px;}
#header .area_util > a span{display:block; width:30px; height:1px; background:#111; background-size:15px;}
#header .area_util > a span:nth-of-type(2){margin-top:7px;}
#header .area_util > a span:nth-of-type(3){margin-top:7px;}
#header .area_util ul{float:left;}
#header .area_util ul li{display:inline-block;}
#header .area_util ul li a{display:inline-block; padding-right:20px; font-size:13px}

@keyframes submenu{
	0% { transform:translateY(15px); animation-delay:50s; opacity:0; }
	100% { transform:translateY(0); animation-delay:50s; opacity:1; }
}
/* mobile-menu */
.mobile_header{background:#008790; color:#333; text-align:center; padding:35px 0 10px 0;}
.btn_menu{position:absolute; z-index:90; width:25px; height:45px; right:20px; top:20px;}
.btn_menu{display:none;}
.btn_menu span{display:block; width:24px; height:1px; background:#333; text-align:center;}
.btn_menu span:nth-child(1){margin-top:14px;}
.btn_menu span:nth-child(2){margin-top:7px;}
.btn_menu span:nth-child(3){margin-top:7px;}

.menu_top p{margin-top:10px; color:#949494;}
#header .m_gnb_top h1{float:none; padding:20px; }
.m_area_util{margin-top:40px;overflow:hidden;  padding:20px; box-sizing:border-box; background:#4c4c4c;}
.m_area_util a{display:inline-block; width: 49%; height:31px; box-sizing: border-box; padding:5px 0; margin:2px 0px; border:1px solid #fff; vertical-align:middle; color:#fff; text-align:center; font-size:14px;}
.m_gnb{overflow-y:auto; position:fixed; top:0px; right:-100%; width:280px; height:100%; background:#fff; transition:all 0.5s ease-out 0s;z-index:999;}
.m_gnb > ul > li > a{display:block; position:relative; padding:15px 25px; border-bottom: 1px solid #eaeaea; color:#424242; transition:all 0.3s ease 0s;}
.m_gnb > ul > li > a.open:before{content:''; display:block; position:absolute; top:25px; right:10px; width:11px; height:7px; background:url(../images/main/menu_button.png) no-repeat 50% 0; transition:all 0.4s ease 0s; background-size:100%;}
.m_gnb > ul > li > a.active{}
.m_gnb > ul > li > a.active:before{transform:rotate(180deg);}
.m_gnb > ul > li > ul{display:none; background:#efefef; }
.m_gnb > ul > li > ul > li{border-bottom:1px solid #dedede;}
.m_gnb > ul > li > ul > li > a{position:relative; display:block; padding:20px 25px; font-size:14px; color:#333; }

.m_gnb .btn_close{opacity: 0; display: block; position:absolute; top:30px; right:-100%; width:24px; height:23px; font-size:0px; transition:0.8s;}
.m_gnb.active{right:0px;}
.m_gnb.active .btn_close{opacity:1; right:15px;}
.m_top {background:#222; margin-top:150px; text-align:center;}
.m_top ul li{display:inline-block; padding:10px 0; margin:0 5px;}
.m_top ul li a{font-size:14px; color:#fff}
.m_gnb > ul{}
.m_gnb .btn_close:before{content: ''; display:block; position:absolute; top:9px; left:0px;  width:100%; height:1px; background:#333; transform:rotate(45deg);}
.m_gnb .btn_close:after{content: ''; display:block; position:absolute; top:9px; left:0px; width:100%; height:1px; background:#333; bottom: 9px; transform:rotate(-45deg);}

.area_util_m{padding:20px 20px; margin-top:100px; background:#598e35;}
.area_util_m span{display:inline-block; width:40px; height:40px; margin-right:6px; background:#111 url(../images/main/icon_call.svg) no-repeat 50%; background-size:15px; border-radius:50%; }
.area_util_m div{display:inline-block; color:#fff;}
.area_util_m div a{color:#fff; font-weight:bold; font-size:17px;}

.cover{position: fixed; width: 100%; height:100%; left:0; top:0; background:rgba(0, 0, 0, 0.8); z-index:995; display:none;}
.cover.active{display:block;}

/* footer */
footer{overflow:hidden; background:#f4f4f4;}
footer address{float:left;}
footer address span{display:inline-block;padding:5px 10px 0 0; font-size:14px;}
footer .wrapper{position:relative; overflow:hidden;  padding:22px 0;}
footer .wrapper .ft_top{clear:both; }
footer .go_homepage{box-sizing:border-box;position:absolute;height:141px;right:220px;top:0;background: #fff;padding:20px;border: 1px solid #d8d8d8;} 
footer .go_homepage ul{clear:both;}
footer .go_homepage ul li{overflow: hidden; margin-bottom:15px;}
footer .go_homepage ul li:last-child{margin-bottom:0}
footer .go_homepage ul li span{float:left; line-height: 33px; font-size:13px;}
footer .go_homepage ul li select{float:right; margin-left:10px; font-size:13px;}

footer .total{box-sizing:border-box; position:absolute; right:0; top:0; width:220px; height:141px; padding:23px; background:#444; color:#fff;} 
footer .total ul li{margin-bottom:10px; text-align:right; font-size:14px;}
footer .total ul li i{float:left}
h2.flogo{float:left; display:block; width:283px; height:70px; background:url(../images/main/f_logo.jpg) no-repeat 50% 0 / auto 100%; font-size:0px; vertical-align:middle;}
footer .total ul li.today{color:#ec9c1f}
.copy{clear:both; padding:10px 0; background:#434856; color:#fff; text-align:center; font-size:13px}

.ft_bottom{clear:both; position:relative;}

@media screen and (max-width:1520px){
	#header .gnb{text-align:right; padding-right:180px;}
	#header .gnb > li > a{margin:0 25px;}
}


@media screen and (max-width:1400px){
	#header h1{left:10px;}
	#header .gnb > li > a{font-size:16px;}
}


@media screen and (max-width:1300px){
	
	.wrapper{width:96%;}

	footer address{width:55%;}
}

@media screen and (max-width:1280px){
	#header .gnb > li > a{margin:0 18px;}
	#header .gnb{padding-right:200px;}
	#header h1{top:26px;}
	#header h1 a{width:200px; height:43px}
}

@media screen and (max-width:1200px){
	footer .total,
	footer .go_homepage{height:170px;}
	footer address{width:50%}

	#header .area_util{right:10px;}
	#header .gnb{padding-right:170px;}
}

@media screen and (max-width:1100px){
	#header h1{top:10px;}
	#header{height:80px;}
	#header h1 a{width:245px; height:50px;}
	#header .area_util,
	#header .gnb{display:none;}
	.btn_menu{display:block;}
}


@media screen and (max-width:1023px){


}

@media (max-width: 960px){
	footer address{width:100%;}
	footer .total, footer .go_homepage,
	footer .total{position:static; width:100%; height:auto; margin-top:20px;}
	footer address{float:none; margin:10px auto; text-align:center;}
	h2.flogo{float:none; width: 245px; height: 50px; margin:10px auto; text-align:center;}
	
}

@media (max-width: 767px){
	body,
	p,
	li,
    a{font-size:14px;font-family: Sans-serif;}

	.wrapper{width:94%;}

	#header{height:60px; border-bottom:1px solid #ddd;}
	#header h1{left:10px;}
	#header h1 a{width:175px; height:38px;}
	.btn_menu{top:8px;}
	
	footer .go_homepage ul li{margin-bottom:7px;}
}