/* wrap */
#wrap{position:relative;width:100%;margin:0 auto;overflow:hidden;}

/* header */
#header{position:relative;z-index:999;width:100%;background-color:#fff;}
#header:after{content:"";display:block;clear:both;}
#header .logo{position:relative;width:1200px;margin:0 auto;text-align:center;z-index:9999999999;}
#header .logo .header_logo{position:absolute;left:0;top:8px; font-size:24px;color:#333;letter-spacing:-1px;font-weight:bold}
#header .logo .header_logo img{padding-right:5px;}
#header .header_in{position:relative;width:100%; height:35px; margin:0 auto;background-color:#fff;overflow:hidden;}
#header .header_in .top_menu{position:relative;margin:0 auto;width:1200px;height:40px;}
#header .header_in .top_menu ul.menu{float:right}
#header .header_in .top_menu ul.menu li{float:left;padding:10px 5px;}
#header .header_in .top_menu ul.menu li span{padding-left:8px;}
#header .header_in .top_menu ul.menu li a{color:#999; font-size:12px; font-weight:bold; font-weight:300;}

/* gnb */
.gnb{position:relative;width:100%;padding:0;margin:0; z-index:9999999;}
.gnb ul.depth1{width:1200px; height:55px; margin:0 auto;text-align:right; line-height:54px;}
.gnb ul.depth1 .t{display:inline-block; *display:inline; *zoom:1;padding:0 20px;position:relative;background:url('/resources/site/optics/resource/images/layout/menu_dot.png') no-repeat left center}
.gnb ul.depth1 .t:last-child{padding-right:0}
.gnb ul.depth1 .t:first-child{background-image:none;}
.gnb ul.depth1 .t a{width:auto;font-size:18px;color:#333; font-weight:400; letter-spacing:-1px;}
.gnb ul.depth1 .submenu01{position:absolute;top:54px;left:-10px;text-align:left;line-height:25px; margin:0 auto;min-width:120px;border-top:2px solid #a90056; }
.gnb ul.depth1 .subfont{text-align:center;border-bottom:1px solid #e8e8e8;line-height:22px;background:rgba(255,255,255,0.9)}
.gnb ul.depth1 .subfont a{display:block;padding:8px 10px;font-size:13px;font-weight:normal;color:#5f5956;}
.gnb ul.depth1 .subfont a:hover{background:#fff}

/*#container{position:relative;width:1200px;margin:110px auto 0 auto}*/
#container{position:relative;width:1200px;margin:0 auto;padding-top:110px}
.contents_box {margin:0 auto;text-align:center}

#sub_container{position:relative;width:1200px;margin:0 auto;background-color:#fff;z-index:10; margin-top:-20px;}

/*lnb*/
.lnb {position:relative;float:left;width:250px; z-index:999;}
.lnb h2{width:100%;height:145px;line-height:28px;margin-top:-25px; font-weight:400;color:#fff;font-size:28px;letter-spacing:-1px; text-align:center; background:#383e54}
.lnb h2 span{display:block;padding:50px 0 5px 0}
.lnb h2 p{color:#888;font-size:10px;letter-spacing:0.5px}
.lnb .lnb_m{background-color:#fff}
.lnb .lnb_m a{display:block;color:#888;font-size:18px;letter-spacing:-0.5px;background:url('/resources/site/optics/resource/images/layout/lnb_off.png') no-repeat 210px center;padding:15px}
.lnb .lnb_m li{border:1px solid #e7e7e7;margin-top:5px;}
.lnb .lnb_m .on{background:url('/resources/site/optics/resource/images/layout/lnb_title_on.png')}
.lnb .lnb_m .on > a {background:url('/resources/site/optics/resource/images/layout/lnb_on.png') no-repeat 210px center;color:#fff}
.lnb .lnb_m .on dl{width:248px}
.lnb .lnb_m .on dl dd > a{font-size:15px;border:none;background:none;background-color:#fbfbfb;padding:11px 32px;}
.lnb .lnb_m li:hover{background:url('/resources/site/optics/resource/images/layout/lnb_title_on.png');transition:all 0.5s ease}
.lnb .lnb_m li > a:hover{color:#fff}
.lnb .lnb_m .on dl dd.on a{color:#aa0056;background:/*url('/resources/site/optics/resource/images/layout/bullet.png') no-repeat 24px 15px*/ #fbfbfb}
.lnb .lnb_m .on dl dd > a:hover{background-color:#f1f1f1;transition:all 0.5s ease}


#contents{position:relative;float:right;width:900px;min-height:750px;letter-spacing:-0.8px;color:#444;font-weight:300;padding-bottom:70px;}
.sub_top{position:relative;margin-bottom:18px}
.sub_top h1{position:relative;font-size:34px;letter-spacing:-3px;font-weight:normal;color:#444;border-bottom:1px solid #e7e7e7;padding:55px 0 15px 0;}
.sub_top h1 span{font-size:14px;color:#999;padding-left:10px;letter-spacing:-0.3px; font-weight:100;}
.sub_top .m_scroll{display:none;margin-top:10px;font-size:14px;color:#999;letter-spacing:-0.5px;}
.location{position:absolute ;overflow:hidden; bottom:18px; right:0; padding:0; color:#FFF; font-size:14px;}
.location li{float:left;color:#888;font-weight:300;}
.location li span{margin:0 10px;vertical-align:middle;}
.location li img{vertical-align:middle; margin-top:-4px;}
.location strong{}

/*banner*/
.fl_left{float:left;}
.fl_right{float:right;}
.clear{clear:both;}
.footer_banner {position:relative; width:100%; height:75px; overflow:hidden; background:#e9e9e9; margin-top:30px;}

/*배너모음*/
.bannerBox{position:relative; width:1200px; margin:0 auto; overflow:hidden;}
.bannerBox h2{font-size:18px; font-weight:normal; letter-spacing:-0.5px; line-height:75px; padding-right:12px;}
.bannerBox ul{line-height:75px; /*margin-left:20px;*/}
.bannerBox ul li{display:inline-block;*display:inline;zoom:1; padding:0 10px;}
.bannerBox .btn_banner a{float:left; padding:0 7px; line-height:75px;}

/*배너존 슬라이드*/
.fl_left2{width:1050px !important; margin-top:18px;}
.bx-wrapper{margin-top:17px; width:1072px !important;overflow:hidden; max-width: 1072px !important;}
.bx-viewport{width:100%; }
.bx-pager{display:none !important; }
.ul-banner{width:1072px;height:90px; }


/*footer*/
#footer{clear:both;position:relative; width:100%;height:115px;background:#fff;border-top:1px solid #e9e9e9 }
#footer .footer_in{position:relative;width:1200px;margin:0 auto;height:41px; background:#fff}
#footer .copy{position:relative;width:1000px;margin:0 auto; padding:25px 0 35px 0;float:left}
#footer .copy .copy_logo{position:absolute; top:25px; left:0;font-size:22px;color:#999;letter-spacing:-1px;font-weight:600}
#footer .copy .copy_logo img{padding-right:5px}
#footer .copy address{color:#8a8a8a;font-weight:300; font-size:14px; letter-spacing:-0.3px; line-height:22px; padding-left:300px;}
#footer .copy p{font-size:11px;font-weight:300;color:#ccc;letter-spacing:0;padding-top:5px; padding-left:300px;}
#footer select{float:right;margin-top:25px;width:175px;padding:3px;font-size:12px;border:1px solid #ccc;color:#555}

/*************** PC Device ***************/
@media only screen and (min-width:768px) and (max-width:1220px) {
	#wrap,#intro_wrap,#header,#footer,.open_box{width:1220px;}
}

/*************** Mobile Device ***************/
@media screen and (max-width:767px) and (-webkit-device-pixel-ratio: 2){
	#wrap{min-width:380px;max-width:auto;overflow:hidden;z-index:2}
}

@media all and (max-width:767px) {
	#wrap{}
	#header{position:relative;z-index:999;width:100%; height:60px; background-color:#fff; border-bottom:1px solid #d9dee1;}
	#header:after{content:"";display:block;clear:both;}
	#header .logo{ position:relative;width:98%;margin:0 auto;text-align:left;z-index:1;margin-left:4%}
	#header .logo .header_logo{position:absolute;left:0;top:21px; width:80%;font-size:18px}
	#header .logo .header_logo img{width:35%;}
	#header .header_in{display:none;}
	#header .header_menu {display:none;}

	/* gnb */
	.gnb{clear:both; display:none;}
	.gnb ul.depth1 li{display:none}

	/* mobile_gnb */
	.m_top{position:absolute; right:4%; top:15px; }
	.m_top img{width:30px;}
	.cssmenu { width:0px; position:fixed; height:2000px; background:#4a4a4a; right:0; top:0;z-index:9999999;}
	.cssmenu_bg{left:0; top: 0px; right: 0px; bottom: 0px; position: fixed; z-index: 9998; cursor: pointer; opacity: 0.7; background-color: rgb(0, 0, 0);display:none} 
	#cssmenu,#cssmenu ul,#cssmenu li,#cssmenu a { font-weight: normal; text-decoration: none; line-height: 1; font-size:14px; position: relative;text-align:left}
	#cssmenu .cssmenu_top{position:relative; background:#fff}
	#cssmenu .cssmenu_top h2{padding:15px 0 15px 15px;}
	#cssmenu .cssmenu_top h2 img{width:100px}
	#cssmenu .cssmenu_top h2 p{font-size:18px; letter-spacing:-0.8px; font-weight:600; margin-top:8px;}
	#cssmenu .cssmenu_top .btn_close{position:absolute;top:20px;right:15px}
	#cssmenu .cssmenu_top ul{background:#f1f1f1;height:40px}
	#cssmenu .cssmenu_top ul li{float:left;width:50%;display:inline-block;background:#f1f1f1;}
	#cssmenu .cssmenu_top ul li:last-child{border-left:1px solid #ddd;margin-left:-1px}
	#cssmenu .cssmenu_top ul li a{display:block;color:#333;font-size:13px;text-align:center;padding:12px 4px}
	#cssmenu .cssmenu_top .m_logout{height:85px}
	#cssmenu .cssmenu_top .m_logout .hello{background:#491731;color:#fff;padding:15px 0;width:220px;text-align:center;font-weight:600;font-size:15px;}
	#cssmenu .cssmenu_top .m_logout ul .floatLeft{float:left;}
	#cssmenu a { line-height: 1.3;}
	#cssmenu {width:220px; overflow:hidden; height:100%; border-left:1px solid #ddd;}
	#cssmenu > ul > li > a {font-size: 24px; font-weight: bold;display: block;text-transform: uppercase;position: relative;}
	#cssmenu > ul > li > a > span {background:url('/resources/site/optics/resource/images/layout/gnb_all_bg_off.gif') no-repeat;background-position:18px 22px; padding:14px 15px 14px 38px; border-bottom:1px solid #3a3a3a; color:#fff; display: block; font-size:15px; font-weight:normal; }
	#cssmenu > ul > li > a:hover {text-decoration: none;}
	#cssmenu > ul > li.active {border-bottom: none;}
	#cssmenu > ul > li.active > a {color: #fff;}
	#cssmenu > ul > li.active > a span {background:url('/resources/site/optics/resource/images/layout/gnb_all_bg_on.gif') no-repeat;background-position:18px 22px;color:#fff;}
	#cssmenu span.cnt {position: absolute;top: 8px;right: 15px;padding: 0;margin: 0;background: none; display:none;}
	#cssmenu ul ul {display: none;}
	#cssmenu ul ul li {border-bottom:1px solid #e1e1e1;border-top: 0;}
	#cssmenu ul ul a {padding: 12px 0 12px 40px;display: block; color: #4a4a4a; font-weight: normal; font-size: 13px;}
	#cssmenu ul ul a:hover {color:#333;}
	#cssmenu ul ul li.odd {background: #f5f5f5 url('/resources/site/optics/resource/images/layout/mobile_smenu_dot.gif') no-repeat 28px center;}
	#cssmenu ul ul li.even {background: #f5f5f5 url('/resources/site/optics/resource/images/layout/mobile_smenu_dot.gif') no-repeat 28px center;}

	/* mobile_gnb
	.m_top{position:absolute; right:4%; top:20px; }
	.m_top img{width:30px;}
	.cssmenu { width:0px; position:fixed; height:2000px; background:#4a4a4a; right:0; top:0;z-index:999}
	#cssmenu,#cssmenu ul,#cssmenu li,#cssmenu a { font-weight: normal; text-decoration: none; line-height: 1; font-size:14px; position: relative;text-align:left}
	#cssmenu a { line-height: 1.3;}
	#cssmenu {width:220px;overflow:hidden; height:100%;}
	#cssmenu > ul > li > a {font-size: 24px; font-weight: bold;display: block;text-transform: uppercase;position: relative;}
	#cssmenu > ul > li > a > span {background:url('/resources/site/optics/resource/images/layout/gnb_all_bg_off.gif') no-repeat;background-position:18px 22px; padding:14px 15px 14px 38px;color:#fff; display: block; font-size:15px; font-weight:normal;border:1px solid #3a3a3a;margin-top:-1px}
	#cssmenu > ul > li.active > a {color: #fff;}
	#cssmenu > ul > li.active > a span {background:url('/resources/site/optics/resource/images/layout/gnb_all_bg_on.gif') no-repeat;background-position:18px 22px;color:#a90056;}
	#cssmenu ul ul li {border-bottom:1px solid #e1e1e1;border-top: 0; }
	#cssmenu ul ul li:last-child { border-bottom:0;}
	#cssmenu ul ul a {padding: 12px 0 12px 40px;display: block; color: #4a4a4a;background:#f6f6f6; font-weight: normal; font-size: 13px;}
	*/

	/*#container{overflow:hidden;width:100%; margin:0 auto; top:0; margin-top:0; padding-bottom:15px;}*/
	#container{overflow:hidden;width:100%; margin:0 auto; top:0; margin-top:0; padding-bottom:24px;padding-top:0;background:#f6f6f6}
	#sub_container{width:92%;margin:0 4%}

	#contents{width:100%;min-height:auto;}
	.sub_top h1{padding:20px 0 15px 0;font-size:26px;}

	/*모바일 서브메뉴*/
	.m_submen{background:#f5f5f5; border-bottom:1px solid #e5e5e5;}
	.lnb {display:none;}
	.location{display:none;}
	.m_location{position:relative; overflow:hidden; padding:3% 3%; line-height:10px; width:100%;}
	.m_location img{padding-right:5px; width:3%; padding-top:1px;}
	.m_location img.drop_down {padding-left:5px; padding-right:0; width:2%;}
	.m_location a{color:#888; font-size:12px;}
	.m_location strong { color:#009b6d; font-size:13px; font-weight:600;}
	.m_location p{color:#888;padding:2px 24px;padding-left:35px}
	.m_location span.arrow {position:absolute; top:3px; left:0;color:#999; font-size:11px; line-height:8px; padding:0 7px;}

	.contents_box img{max-width:100%}

	/*footer_banner*/
	.footer_banner {width:100%; height:100%; margin-top:0;}
	.bannerBox {width:100%; background:#e9e9e9;}
	.bannerBox ul {margin-left:0;}
	.banner_wrap {width:100%; height:75px; margin:0 auto; background:#fff; border-top:1px solid #eee; border-bottom:1px solid #eee;}
	.bannerBox h2 {font-size:17px; letter-spacing:-1px; float:left; width:43%; margin-left:5%; display:none;}
	.btn_banner.fl_left {float:right; text-align:right;}
	.bannerBox .btn_banner{z-index:50;left:unset;right:0;height:100%;background:#fff;padding-left:14px; display:none;}
	.fl_left.fl_left2 {width:100%;position:absolute;top:0;left:16px}

	/*.footer_banner .bx-wrapper{width:20% !important;margin:0 auto;overflow:hidden}*/
	/*.footer_banner .bx-viewport{width:50% !important;}*/
	/*.fl_left.fl_left2 {width:100%;position:absolute;top:0;left:20%;}*/
	/*.fl_left.fl_left2 li {display:inline-block; width:43%; text-align:center;}*/
	/*.fl_left.fl_left2 li img {width:90%}*/

	/*footer*/
	#footer{clear:both; height:auto;}
	#footer .footer_in{width:100%;margin:0 auto;text-align:center;height:100%; }
	#footer .copy{width:92%;margin:0 4%;padding: 3% 0;text-align:center;float:none;}
	#footer .copy .copy_logo{display:none;}
	#footer .copy address{padding-left:0px;font-size:13px}
	#footer .copy p{padding-left:0px;font-size:10px}
	#footer select{float:none;margin-top:4%;width:90%;padding:2%;font-size:13px;border:1px solid #ccc;color:#555}
	/*#footer:after{content:"";display:block;clear:both;}*/

}