@charset "utf-8";

* {margin:0;padding:0;scrollbar-face-color:#fff;scrollbar-highlight-color:#fff;scrollbar-3dlight-color:#555;scrollbar-shadow-color:#555;
scrollbar-darkshadow-color:#fff;scrollbar-arrow-color:#555;scrollbar-track-color:#fff}
/* Basic Tags */
body,p,h1,h2,h3,h4,h5,h6,ul,ol,li,dl,dt,dd,table,th,td,form,fieldset,legend,input,textarea,button,select {margin:0; padding:0;color:#444}
body,input,textarea,select,button,table {font-family:'Nanum Gothic',  Malgun Gothic, Dotum,helvetica,sans-serif; font-size:11px;}
img,fieldset {border:0;margin:0;padding:0}
ul,ol {list-style:none;}
em,address {font-style:normal;}
caption {text-indent:-5000px; line-height:0; font-size:0;}
legend{text-indent:-5000px; line-height:0; font-size:0; position:absolute;  top:0; left:0;}
a {text-decoration:none;color:#333}
a:hover,a:active,a:focus {text-decoration:none;color:#333}
article,aside,dialog,footer,header,section,footer,nav,figure {display:block; margin:0; padding:0;} /* html5 tags */

/* Fire Fox button style bug */
button::-moz-focus-inner {padding:0; border:0;}

/* common */
.blind {font-size:0;text-indent:-999em}
.d_inline {display:inline !important}
.d_inblock {display:inline-block !important; *display:inline; *zoom:1}
.f_left {float:left !important}
.f_right {float:right !important}
.a_center {text-align:center !important}
.a_left {text-align:left !important}
.a_right {text-align:right !important}

/* Layout (공통) */
.clear {display:block;float:none;clear:both;margin:0;padding:0}
.clearboth {display:inline-block;float:none;clear:both;margin:0;padding:0}
.clearfix:after {display:block;visibility:hidden;clear:both;height:0;content:'.'}
.clearfix {display:inline-block}
.wide_wrap {width:100%;}
.fix_wrap {width:1100px;margin:20px auto 0;}

h3 {font:bold 14px 'Armata', serif;}

.h10 {height:10px}
.h20 {height:20px}
.h30 {height:30px}
.h40 {height:40px}

.skipNavi {position:absolute;}
.skipNavi a {position:fixed;top:-100px;left:0;width:100%;color:#fff;background:#666;text-align:center;font-size:11px;z-index:300}
.skipNavi a:focus {top:0;padding:10px 0;z-index:300}

/* main visual */
.event_visual_A {overflow:hidden;position:relative;max-height:540px;font-size:0;line-height:0}
.event_visual_A ul.rolling-ui-list li img {width:100%;}
.event_visual_A ul li span.text {position:absolute;top:38%;left:13%;font:20px 'Nanum Gothic';color:#fff;}
.event_visual_A ul li span.text strong {display:block;font:bold 55px 'Arial';color:#fff}
.event_visual_A ul li span.text b {display:block;margin:8px 0 5px;font:bold 28px 'Armata';color:#fff;letter-spacing:-1px}
.event_visual_A ul.btn li {position:absolute;top:49%;}
.event_visual_A ul.btn li.prev {left:30px}
.event_visual_A ul.btn li.next {right:30px}
.event_visual_A .p_rolling {position:absolute;bottom:10px;left:48%;z-index:99;}
.event_visual_A .p_rolling a {display:inline-block;width:18px;height:19px;margin:0 1px;background:url(/images/main/btn_visual.png) no-repeat -19px 0;font-size:0;line-height:0}
.event_visual_A .p_rolling a.active {background-position: 0 0}
.event_visual_A ul.rolling-ui-list li img.big {display:block}
.event_visual_A ul.rolling-ui-list li img.small {display:none}

.web_wrap div p {display:block;width:222px;margin:0 auto;padding:20px;background:#e6e6e6;text-align:left;font:bold 11px 'Armata', serif;color:#333}
.web_wrap div p a:hover {color:#777}
.web_wrap div img {vertical-align:middle}
.web_wrap span.roll {position:absolute;width:262px;height:150px;background:url(/images/hover_effect.png) 50% 50% no-repeat #000;z-index:10}

/* Layout (footer) */
#footer address, #footer address span, #footer address em, #footer address p {font-family:Verdana;font-size:9px;line-height:14px;color:#fff;}

/*  320px   */
@media all and (max-width:320px) {

h1 {display:block;padding:15px 0 17px;font:20px 'Lobster', cursive;text-align:center;}
h1 a, h1 a:hover {display:inline;color:#fff}
h2 {display:block;margin:7px auto;font:bold 14px 'Armata', serif;text-align:center;}

.path {width:90%;margin:5px auto;font:bold 11px 'Armata', serif;}
.path h3 {padding:7px 0;border-bottom:1px solid #ddd;background:#ccc;font:11px 'Armata', serif;color:#fff;text-align:center}

.fix_wrap {width:100%;margin:0 auto;}
.h10 {display:none}

/* Layout Basic blue*/
#wrap {position:relative;width:100%;min-width:320px;}
#header {position:relative;width:100%;background:#000;}
#container {width:100%;background:#f7f7f7}
#container:after {display:block;clear:both;content:''}
#content {width:100%;margin:0 auto;}
#footer {clear:both;width:100%;margin:0;padding:22px 0 30px;background:#555;text-align:center}

/* Layout (header) */
#header .header_bg {display:none}
#header .header_wrap {width:100%;}
#header .header_wrap ul {display:none}

.web_top_A {width:100%;padding:10px 0;background:#eaeaea;font:bold 11px 'Armata', serif;text-align:center}
.web_top_B {width:100%;padding:10px 0;background:#eaeaea;font:bold 11px 'Armata', serif;text-align:center}
.web_top_C {width:100%;padding:10px 0;background:#eaeaea;font:bold 11px 'Armata', serif;text-align:center}
.web_top_D {width:100%;padding:10px 0;background:#eaeaea;font:bold 11px 'Armata', serif;text-align:center}

/* main visual */
.event_visual_A ul.rolling-ui-list li img.big {display:none}
.event_visual_A ul.rolling-ui-list li img.small {display:block}
.event_visual_A ul li span.text {position:absolute;top:35%;left:16%;font:bold 14px 'Nanum Gothic';color:#fff;}
.event_visual_A ul li span.text strong {display:block;font:bold 16px 'Arial';color:#fff}
.event_visual_A ul li span.text b {display:none;margin:8px 0 5px;font:bold 18px 'Armata';color:#fff;letter-spacing:-1px}
.event_visual_A ul.btn li {position:absolute;top:40%;}
.event_visual_A ul.btn li.prev {left:10px}
.event_visual_A ul.btn li.next {right:10px}

/* main banner */
.web_wrap {position:relative;width:300px;margin:0 auto;text-align:center;}
.web_wrap div:first-child {margin:0 auto;}
.web_wrap div {width:262px;margin:20px auto;text-align:center;}
.web_wrap .list a {display:inline-block;clear:both;width:262px;margin:-10px auto;padding:10px 0;border:1px solid #ccc;background:#fff}

/* Super box */
.superbox {width:100%;margin-bottom:20px;text-align:center}
.superbox-list {display:inline-block;*display:inline;*margin:3px 3px 0 0;zoom:1;}
.superbox-img {width:100%;cursor:pointer;}
.superbox-img:hover {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter:alpha(opacity=70);opacity:.7;-webkit-opacity:.7;}
.superbox-show {display:none;float:left;position:relative;width:100%;padding:55px 0;background:#222;text-align:center;box-shadow:inset 0 5px 5px #111;
-webkit-box-shadow:inset 0 5px 5px #111;-moz-box-shadow:inset 0 5px 5px #111;}
.superbox-current-img {max-width:100%;box-shadow:0 1px 4px #222;border:1px solid #222;}
.superbox-float {float:left;}
.superbox-close {position:absolute;top:10px;right:10px;width:35px;height:35px;background:url(/images/common/btn_close.gif) no-repeat 50% 50%;cursor:pointer;}
.superbox-list {width:48.7%;}

/* web detail */
.sub_list {margin:10px auto;padding:0 10px;}
.sub_list h3.sub_title {padding:7px;border-bottom:1px solid #111;background:#555;color:#fff;font-size:14px;font-weight:bold;text-align:left}
.sub_list ul li {display:block;background:#fff;color:#666}
.sub_list ul li a {color:#111}
.sub_list ul li.fst {border-bottom:0}
.sub_list ul li span:first-child {background:#eee;border-bottom:1px solid #ddd;font:bold 12px 'Nanum Gothic';color:#333}
.sub_list ul li span {display:block;padding:5px;}
.web_images {width:100%;padding-bottom:5px;text-align:center;border-bottom:1px solid #ccc;text-align:center}
.web_images img {width:94%;}

/* Tab menu */
ul.tab{display:inline-block;clear:both;width:100%;padding:0;}
ul.tab li{float:left;width:33.2%;}
ul.tab li a {display:inline-block;width:100%;margin-bottom:1px;padding:13px 0;background:#fff;color:#555;text-align:center;font:10px 'Armata', serif}
ul.tab li a.selected{padding:13px 0;background:#eee;color:#111;font-weight:bold;letter-spacing:-1px}
ul.panel {margin-bottom:20px;padding:30px 0;border:1px solid #ccc;background:#fff;text-align:center}
ul.panel li{width:100%;text-align:center}
ul.panel li img {width:90%}

/* contact page */
.contact_warp p {width :97%;;margin:0 auto;padding:10px 0;font:11px/14px 'Nanum Gothic'}
.contact_warp p.tit {font:bold 11px 'Armata', serif;color:#666;}
.contact_warp p strong {font:bold 12px/20px 'Nanum Gothic';color:#666}
#map-canvas, #map_canvas {width :92%;height:300px;margin:0 auto;border:5px solid #eaeaea;font-size:11px;} 
.map_Heading {font:bold 16px/25px 'Nanum Gothic';color:#30C;} 
.map_Content {font:12px 'Nanum Gothic';color:#333}

/* side menu */
#menu {position:absolute;top:0;left:-200px;z-index:220;width:0;height:100%;background:#000;transition:all .3s ease;box-shadow:0 0 10px #000}
#menu.open {position:fixed;display:block;left:0;top:0;width:200px}
#menu a {display:block;margin:10px;padding:10px;border-radius:100px;color:#FFF;text-align:center;text-decoration:none;transition:all .2s ease}
#menu a:hover{background:#323232}
#menu-toggle {position:absolute;top:5px;left:0;z-index:220;transition:all .3s ease}
#menu-toggle img {position:absolute;top:13px;left:15px;width:20px;}
#menu-toggle.open{position:fixed;top:5px;left:150px;z-index:230;}

}

/*   321px ~ 559px  */
@media all and (min-width: 321px) and (max-width:559px) {

h1 {width:140px;margin:0 auto;padding:15px 0;font:24px 'Lobster', cursive;}
h1 a, h1 a:hover {display:inline;color:#fff}
h2 {display:block;margin:13px auto;font:bold 15px 'Armata', serif;text-align:center}

.path {width:95%;margin:10px auto;font:bold 11px 'Armata', serif;}
.path h3 {padding:7px 0;border-bottom:1px solid #ddd;background:#ccc;font:bold 11px 'Armata', serif;color:#fff;text-align:center}

.h10 {height:10px}
.fix_wrap {width:100%;margin:10px auto 0;}

/* Layout Basic green*/
#wrap {position:relative;width:100%;}
#header {width:100%;background:#000;}
#container {width:100%;background:#f7f7f7}
#container:after {display:block;clear:both;content:''}
#content {width:100%;margin:0 auto;}
#footer {clear:both;width:100%;margin:0;padding:22px 0 30px;background:#555;text-align:center}

/* Layout (header) */
#header .header_bg {display:none}
#header .header_wrap {width:100%;}
#header .header_wrap ul {display:none}

.web_top_A {width:100%;padding:10px 0;background:#eaeaea;font:bold 11px 'Armata', serif;text-align:center}  /* 웹포폴*/
.web_top_B {width:100%;padding:10px 0;background:#eaeaea;font:bold 11px 'Armata', serif;text-align:center}  /* city */
.web_top_C {width:100%;padding:10px 0;background:#eaeaea;font:bold 11px 'Armata', serif;text-align:center}  /* 모바일*/
.web_top_D {width:100%;padding:10px 0;background:#eaeaea;font:bold 11px 'Armata', serif;text-align:center} /*배너디자인*/

/* main visual */
.event_visual_A {overflow:hidden;position:relative;min-height:175px;font-size:0;line-height:0}
.event_visual_A ul.rolling-ui-list li img.big {display:none}
.event_visual_A ul.rolling-ui-list li img.small {display:block}
.event_visual_A ul li span.text {position:absolute;top:30%;left:13%;font:bold 14px 'Nanum Gothic';color:#fff;}
.event_visual_A ul li span.text strong {display:block;font:bold 24px 'Arial';color:#fff}
.event_visual_A ul li span.text b {display:block;margin:8px 0 5px;font:bold 18px 'Armata';color:#fff;letter-spacing:-1px}
.event_visual_A ul.btn li {position:absolute;top:40%;}
.event_visual_A ul.btn li.prev {left:10px}
.event_visual_A ul.btn li.next {right:10px}

/* main banner */
.web_wrap {position:relative;width:284px;margin:0 auto;text-align:center;}
.web_wrap div:first-child {margin:0 auto;}
.web_wrap div {width:262px;margin:20px auto;text-align:center;}
.web_wrap .list a {display:inline-block;clear:both;width:262px;margin:-30px auto 0;padding:10px 0;border:1px solid #ccc;background:#fff}

/* Super box */
.superbox {width:100%;margin-bottom:30px}
.superbox-list {display:inline-block;*display:inline;*margin:3px 3px 0 0;zoom:1;}
.superbox-img {width:100%;cursor:pointer;}
.superbox-img:hover {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter:alpha(opacity=70);opacity:.7;-webkit-opacity:.7;}
.superbox-show {display:none;float:left;position:relative;width:100%;padding:55px 0;background:#222;text-align:center;box-shadow:inset 0 5px 5px #111;
-webkit-box-shadow:inset 0 5px 5px #111;-moz-box-shadow:inset 0 5px 5px #111;}
.superbox-current-img {max-width:100%;box-shadow:0 1px 4px #222;border:1px solid #222;}
.superbox-float {float:left;}
.superbox-close {position:absolute;top:10px;right:10px;width:35px;height:35px;background:url(/images/common/btn_close.gif) no-repeat 50% 50%;cursor:pointer;}
.superbox-list {width:32.6%;}

/* web detail */
.sub_list {margin:10px auto;padding:0 10px;}
.sub_list h3.sub_title {padding:7px;border-bottom:1px solid #111;background:#555;color:#fff;font-size:14px;font-weight:bold;text-align:left}
.sub_list ul li {display:block;background:#fff;color:#666}
.sub_list ul li a {color:#111}
.sub_list ul li.fst {border-bottom:0}
.sub_list ul li span:first-child {background:#f5f5f5;border-bottom:1px solid #ddd;font:bold 12px 'Nanum Gothic';color:#333}
.sub_list ul li span {display:block;padding:5px;}
.web_images {width:93.7%;padding:0 3% 20px;text-align:center;border-bottom:1px solid #ccc}
.web_images img {width:100%;}

/* Tab menu */
ul.tab{display:inline-block;clear:both;width:100%;padding:0;}
ul.tab li{float:left;width:33.33%;}
ul.tab li a {display:inline-block;width:100%;margin-bottom:1px;padding:13px 0;background:#fff;color:#555;text-align:center;font:10px 'Armata', serif}
ul.tab li a.selected{padding:13px 0;background:#eee;color:#111;font-weight:bold;letter-spacing:-1px}
ul.panel {margin-bottom:20px;padding:30px 0;border:1px solid #ccc;background:#fff;text-align:center}
ul.panel li{width:100%;text-align:center}
ul.panel li img {width:90%}

/* contact page */
.contact_warp p {overflow:hidden;width :95%;margin:0 auto;padding:10px 0;font:12px/20px 'Nanum Gothic'}
.contact_warp p.tit {font:bold 15px 'Armata', serif;color:#666}
.contact_warp p strong {font:bold 12px/20px 'Nanum Gothic';color:#666}
#map-canvas, #map_canvas {width :95%;height:300px;margin:0 auto;border:5px solid #eaeaea;font-size:11px;} 
.map_Heading {font:bold 16px/25px 'Nanum Gothic';color:#30C;} 
.map_Content {font:12px 'Nanum Gothic';color:#333}

/* side menu */
#menu {position:absolute;top:0;left:-200px;z-index:220;width:0;height:100%;background:#000;transition:all .3s ease;box-shadow:0 0 10px #000}
#menu.open {position:fixed;display:block;left:0;top:0;width:200px}
#menu a {display:block;margin:10px;padding:10px;border-radius:100px;color:#FFF;text-align:center;text-decoration:none;transition:all .2s ease}
#menu a:hover{background:#323232}
#menu-toggle {position:absolute;top:5px;left:0;z-index:220;transition:all .3s ease}
#menu-toggle img {position:absolute;top:13px;left:15px;width:20px;}
#menu-toggle.open{position:fixed;top:5px;left:150px;z-index:230;}

}

/*  550px ~ 829px  */
@media all and (min-width: 560px) and (max-width:829px) {

h1 {width:140px;margin:0 auto;padding:15px 0;font:24px 'Lobster', cursive;}
h1 a, h1 a:hover {display:inline;color:#fff}
h2 {display:block;width:250px;margin:20px auto 5px;font:bold 17px 'Armata', serif;text-align:center;}

.path {width:97%;margin:15px auto 5px;font:bold 11px 'Armata', serif;}
.path h3 {width:33%;padding:10px 0;border-bottom:1px solid #ddd;background:#ddd;font:bold 11px 'Armata', serif;color:#fff;text-align:center}

.h30 {height:10px}
.fix_wrap {width:100%;margin:10px auto 0;}

/* Layout Basic yellow */
#wrap {position:relative;width:100%;}
#header {width:100%;background:#000;}
#container {width:100%;background:#f7f7f7}
#container:after {display:block;clear:both;content:''}
#content {width:100%;margin:0 auto;}
#footer {clear:both;width:100%;margin:0;padding:22px 0 30px;background:#555;text-align:center}

/* Layout (header) */
#header .header_bg {display:none}
#header .header_wrap {width:100%;}
#header .header_wrap ul {display:block;clear:both;width:100%}
#header .header_wrap ul li {float:left;width:20%;padding:15px 0;text-align:center;}
#header .header_wrap ul li a {font:12px 'Armata', serif;color:#fff;}
#header .header_wrap ul li a:hover {color:#ccc;}

.web_top_A {min-height:100px;min-height:100px;background:url(/images/common/web_top1.jpg) no-repeat 50% 50%;text-indent:-999em}  /* 웹포폴*/
.web_top_B {min-height:100px;background:url(/images/common/web_top.jpg) no-repeat 50% 50%;text-indent:-999em}  /* city */
.web_top_C {min-height:100px;background:url(/images/common/web_top2.jpg) no-repeat 50% 50%;text-indent:-999em}  /* 모바일*/
.web_top_D {min-height:100px;background:url(/images/common/web_top3.jpg) no-repeat 50% 50%;text-indent:-999em} /*배너디자인*/

/* main visual */
.event_visual_A {overflow:hidden;position:relative;min-height:180px;font-size:0;line-height:0}
.event_visual_A ul li span.text {position:absolute;top:30%;left:13%;font:bold 14px 'Nanum Gothic';color:#fff;}
.event_visual_A ul li span.text strong {display:block;font:bold 24px 'Arial';color:#fff}
.event_visual_A ul li span.text b {display:block;margin:8px 0 5px;font:bold 18px 'Armata';color:#fff;letter-spacing:-1px}
.event_visual_A ul.btn li {position:absolute;top:40%;}
.event_visual_A ul.btn li.prev {left:10px}
.event_visual_A ul.btn li.next {right:10px}

/* main banner */
.web_wrap {position:relative;width:550px;margin:0 auto}
.web_wrap div {float:left;width:50%;margin:20px auto;text-align:center;}
.web_wrap .list {position:absolute;top:-10px;right:10px;width:60px;padding:5px 0;border:1px solid #ccc;background:#fff}

/* Super box */
.superbox {width:100%;margin-bottom:30px}
.superbox-list {display:inline-block;	*display:inline;	*margin:3px 3px 0 0;zoom:1;}
.superbox-img {width:100%;cursor:pointer;}
.superbox-img:hover {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter:alpha(opacity=70);opacity:.7;-webkit-opacity:.7;}
.superbox-show {display:none;float:left;position:relative;width:100%;padding:55px 0;background:#222;text-align:center;box-shadow:inset 0 5px 5px #111;
-webkit-box-shadow:inset 0 5px 5px #111;-moz-box-shadow:inset 0 5px 5px #111;}
.superbox-current-img {max-width:100%;box-shadow:0 1px 4px #222;border:1px solid #222;}
.superbox-float {	float:left;}
.superbox-close {position:absolute;top:10px;right:10px;width:35px;height:35px;background:url(/images/common/btn_close.gif) no-repeat 50% 50%;cursor:pointer;}
.superbox-list {width:24.5%;}

/* web detail */
.sub_list {margin:30px auto 20px;padding:0 10px;}
.sub_list h3.sub_title {padding:10px;border-bottom:1px solid #111;background:#555;color:#fff;font-size:14px;font-weight:bold;text-align:left}
.sub_list ul li {display:block;background:#fff;color:#666}
.sub_list ul li a {color:#111}
.sub_list ul li.fst {border-bottom:0}
.sub_list ul li span:first-child {background:#f5f5f5;border-bottom:1px solid #ddd;font:bold 12px 'Nanum Gothic';color:#333}
.sub_list ul li span {display:block;padding:10px;}
.web_images {width:90%;padding:0 5% 30px;text-align:center;border-bottom:1px solid #ccc}
.web_images img {width:100%;}

/* Tab menu */
ul.tab{display:inline-block;clear:both;width:100%;padding:0;}
ul.tab li{float:left;width:33.33%;}
ul.tab li a {display:inline-block;width:100%;padding:15px 0 15px;border-top:1px solid #ccc;background:#fff;color:#555;text-align:center;font:11px 'Armata', serif}
ul.tab li a.selected{width:100%;padding:15px 0 12px;border-bottom:3px solid #111;background:#fff;color:#111;}
ul.panel {margin-bottom:20px;padding:30px 0;border:1px solid #ccc;background:#fff;text-align:center}
ul.panel li{width:100%;text-align:center}
ul.panel li img {width:91%}

/* contact page */
.contact_warp p {width:96%;min-width:560px;margin:0 auto;padding:10px 0;font:12px/20px 'Nanum Gothic'}
.contact_warp p.tit {font:bold 15px 'Armata', serif;color:#666}
.contact_warp p strong {font:bold 12px/20px 'Nanum Gothic';color:#666}
#map-canvas, #map_canvas {width :95%;height:200px;margin:0 auto;border:5px solid #eaeaea;font-size:11px;} 
.map_Heading {font:bold 16px/25px 'Nanum Gothic';color:#30C;} 
.map_Content {font:12px 'Nanum Gothic';color:#333}

/* side menu */
#menu {display:none;}
#menu-toggle {display:none;}

}

/*  830px ~ 1099px  */
@media only screen and (min-width:830px) and (max-width:1099px) {

h1 {position:absolute;top:6px;left:7%;font:24px 'Lobster', cursive}
h1 a, h1 a:hover {display:inline;color:#fff}
h2 {display:block;width:250px;margin:20px auto 5px;font:bold 16px 'Armata', serif;text-align:center;}

.path {width:97%;margin:15px auto 0;font:bold 10px 'Armata', serif;}
.path h3 {width:25%;padding:12px 0;border-bottom:1px solid #ddd;border-right:1px solid #ddd;background:#ddd;font:bold 11px 'Armata', serif;color:#fff;text-align:center}

.fix_wrap {width:100%;margin:20px auto 0;}

/* Layout Basic orange*/
#wrap {position:relative;width:100%;}
#header {position:fixed;width:100%;z-index:101;}
#container {width:100%;background:#f7f7f7}
#container:after {display:block;clear:both;content:''}
#content {width:100%;margin:0 auto;}
#footer {clear:both;width:100%;margin:0;padding:22px 0 30px;background:#555;text-align:center}

/* Layout (header) */
#header .header_bg {position:fixed;top:0;width:100%;height:50px;background:#000;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";filter:alpha(opacity=75);opacity:.75;-moz-opacity :.75; -o-opacity:.75;-webkit-opacity:.75;z-index:110;}
#header .header_wrap {position:relative;width:100%;z-index:111;}
#header .header_wrap ul {display:block;clear:both;margin-left:25%;min-width:575px;}
#header .header_wrap ul li {float:left;width:20%;padding:15px 0;text-align:center;}
#header .header_wrap ul li a {font:bold 13px 'Armata', serif;color:#fff;}
#header .header_wrap ul li a:hover {color:#ccc;}

.web_top_A {min-height:200px;background:url(/images/common/web_top1.jpg) no-repeat 50% 37%;text-indent:-999em;}  /* 웹포폴*/
.web_top_B {min-height:200px;background:url(/images/common/web_top.jpg) no-repeat 50% 37%;text-indent:-999em}  /* city */
.web_top_C {min-height:200px;background:url(/images/common/web_top2.jpg) no-repeat 50% 37%;text-indent:-999em}  /* 모바일*/
.web_top_D {min-height:200px;background:url(/images/common/web_top3.jpg) no-repeat 50% 37%;text-indent:-999em} /*배너디자인*/

/* main visual */
.event_visual_A {overflow:hidden;position:relative;min-height:260px;font-size:0;line-height:0}
.event_visual_A ul li span.text {position:absolute;top:38%;left:13%;font:16px 'Nanum Gothic';color:#fff;}
.event_visual_A ul li span.text strong {display:block;font:bold 30px 'Arial';color:#fff}
.event_visual_A ul li span.text b {display:block;margin:8px 0 5px;font:bold 22px 'Armata';color:#fff;letter-spacing:-1px}

/* main banner */
.web_wrap {position:relative;width:100%;margin:0 auto;}
.web_wrap div {float:left;width:33.33%;margin:20px auto;text-align:center;}
.web_wrap .list {position:absolute;top:-10px;left:89%;width:60px;padding:5px 0;border:1px solid #ccc;background:#fff}

/* Super box */
.superbox {width:100%;margin-bottom:30px;}
.superbox-list {display:inline-block;*display:inline;*margin:3px 3px 0 0;zoom:1;}
.superbox-img {width:100%;cursor:pointer;}
.superbox-img:hover {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter:alpha(opacity=70);opacity:.7;-webkit-opacity:.7;}
.superbox-show {display:none;float:left;position:relative;width:100%;padding:55px 0;background:#222;text-align:center;box-shadow:inset 0 5px 5px #111;
-webkit-box-shadow:inset 0 5px 5px #111;-moz-box-shadow:inset 0 5px 5px #111;}
.superbox-current-img {max-width:100%;box-shadow:0 1px 4px #222;border:1px solid #222;}
.superbox-float {float:left;}
.superbox-close {position:absolute;top:10px;right:10px;width:35px;height:35px;background:url(/images/common/btn_close.gif) no-repeat 50% 50%;cursor:pointer;}
.superbox-list {display:inline-block;*display:inline;*margin:3px 3px 0 0;zoom:1;width:16.3%;}

/* web detail */
.sub_list {margin:30px auto 20px;padding:0 10px;}
.sub_list h3.sub_title {padding:10px;border-bottom:1px solid #111;background:#eee;color:#333;font-size:14px;font-weight:bold;text-align:left}
.sub_list ul li {display:block;border-bottom:1px solid #ddd;background:#fff;color:#666}
.sub_list ul li a {color:#111}
.sub_list ul li.fst {border-bottom:0}
.sub_list ul li.fst span:first-child  {display:block;width:97.6%;border-right:0;border-bottom:1px solid #ccc}
.sub_list ul li.fst span {}
.sub_list ul li span:first-child {width:10%;border-right:1px solid #ddd}
.sub_list ul li span {display:inline-block;clear:both;padding:10px}
.web_images {width:90%;padding:0 5% 30px;text-align:center;border-bottom:1px solid #ccc}
.web_images img {width:100%;}

/* Tab menu */
ul.tab{display:inline-block;clear:both;width:100%;margin-top:10px;padding:0;}
ul.tab li{float:left;width:11.11%;}
ul.tab li a {display:inline-block;width:100%;padding:15px 0 14px;border-top:1px solid #ccc;border-bottom:1px solid #ccc;background:#fff;color:#555;text-align:center;font:bold 11px 'Arial', serif}
ul.tab li a.selected{padding:15px 0 12px;border-bottom:3px solid #111;background:#fff;color:#111;}
ul.panel {margin:-1px 0 20px;padding:40px 0;border:1px solid #ccc;border-top:none;background:#fff;text-align:center}
ul.panel li{width:100%;text-align:center}
ul.panel li img {width:90%}

/* contact page */
.contact_warp {width :95%;margin:0 auto}
.contact_warp p {padding:10px 0;font:12px/20px 'Nanum Gothic'}
.contact_warp p.tit {font:bold 15px 'Armata', serif;color:#666}
.contact_warp p strong {font:bold 12px/20px 'Nanum Gothic';color:#666}
#map-canvas, #map_canvas {width :98%;height:300px;margin:0;border:10px solid #eaeaea;font-size:11px;} 
.map_Heading {font:bold 16px/25px 'Nanum Gothic';color:#30C;} 
.map_Content {font:12px 'Nanum Gothic';color:#333}

/* side menu */
#menu {display:none;}
#menu-toggle {display:none;}

}

/*  1100px 이상   */
@media only screen and (min-width:1100px) {

h1 {position:absolute;top:4px;left:30px;font:28px 'Lobster', cursive}
h1 a, h1 a:hover {display:inline;color:#fff}
h2 {display:block;width:250px;margin:30px auto 15px;font:bold 25px 'Armata', serif;text-align:center;}

.web_top_A {height:270px;background:url(/images/common/web_top1.jpg) fixed 50% 0}  /* 웹포폴*/
.web_top_B {height:270px;background:url(/images/common/web_top.jpg) fixed 50% 0}  /* city */
.web_top_C {height:270px;background:url(/images/common/web_top2.jpg) fixed 50% 0}  /* 모바일*/
.web_top_D {height:270px;background:url(/images/common/web_top3.jpg) fixed 50% 0} /*배너디자인*/

.path {display:block;width:1100px;margin:30px auto 0;font:bold 11px 'Armata', serif;}
.path h3 {width:200px;padding:12px 0;border-bottom:1px solid #ddd;border-right:1px solid #ddd;background:#ccc;font:bold 11px 'Armata', serif;color:#fff;text-align:center}

/* Layout Basic  red*/
#wrap {position:relative;width:100%;min-width:1100px;}
#header {position:fixed;width:100%;z-index:101;}
#container {width:100%;background:#f7f7f7}
#container:after {display:block;clear:both;content:''}
#content {width:1100px;margin:0 auto;}
#footer {clear:both;width:100%;margin:0;padding:22px 0 30px;background:#555;text-align:center}

/* Layout (header) */
#header .header_bg {position:fixed;top:0;width:100%;height:50px;background:#000;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";filter:alpha(opacity=75);opacity:.75;-moz-opacity :.75; -o-opacity:1;-webkit-opacity:.75;z-index:110;}
#header .header_wrap {position:relative;width:1100px;margin:0 auto;z-index:111;}
#header .header_wrap ul {margin-left:360px;padding:15px 0;}
#header .header_wrap ul li {float:left;margin:0 45px}
#header .header_wrap ul li a {padding:10px 0;font:bold 13px 'Armata', serif;color:#fff;}
#header .header_wrap ul li a:hover {color:#ccc;}

/* main banner */
.web_wrap {position:relative;width:1100px;margin:0 auto;}
.web_wrap div {float:left;width:25%;margin:20px auto;text-align:center;}
.web_wrap .list {position:absolute;top:-10px;right:10px;width:60px;padding:5px 0;border:1px solid #ccc;background:#fff}

/* Super box */
.superbox {width:1100px;margin-bottom:30px}
.superbox-list {display:inline-block;	*display:inline;	*margin:3px 3px 0 0;zoom:1;}
.superbox-img {width:100%;cursor:pointer;}
.superbox-img:hover {-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=70)";filter:alpha(opacity=70);opacity:.7;-webkit-opacity:.7;}
.superbox-show {display:none;float:left;position:relative;width:100%;padding:55px 0;background:#222;text-align:center;box-shadow:inset 0 5px 5px #111;
-webkit-box-shadow:inset 0 5px 5px #111;-moz-box-shadow:inset 0 5px 5px #111;}
.superbox-current-img {max-width:100%;box-shadow:0 1px 4px #222;border:1px solid #222;}
.superbox-float {	float:left;}
.superbox-close {position:absolute;top:10px;right:10px;width:35px;height:35px;background:url(/images/common/btn_close.gif) no-repeat 50% 50%;cursor:pointer;}
.superbox-list {width:14.04%;}

/* web detail */
.sub_list {width:1100px;margin:30px auto 20px;border:1px solid #ddd}
.sub_list h3.sub_title {padding:10px;border-bottom:1px solid #111;background:#eee;color:#333;font-size:14px;font-weight:bold;text-align:left}
.sub_list ul li {display:block;border-bottom:1px solid #ddd;background:#fff;color:#666}
.sub_list ul li a {color:#111}
.sub_list ul li.fst {border-bottom:0}
.sub_list ul li span:first-child {width:100px;border-right:1px solid #ddd}
.sub_list ul li span {display:inline-block;clear:both;padding:10px}
.web_images {width:1100px;margin:0 auto;padding-bottom:30px;text-align:center;border-bottom:1px solid #ccc}

/* Tab menu */
ul.tab{margin-top:10px;padding:0;}
ul.tab li{float:left;}
ul.tab li:first-child{width:122px;margin-left:1px}
ul.tab li a {display:inline-block;clear:both;width:122px;padding:15px 0 14px;border-top:1px solid #ccc;border-bottom:1px solid #ccc;background:#fff;color:#555;text-align:center;font:bold 11px 'Arial', serif}
ul.tab li a.selected{width:122px;padding:15px 0 12px;border-bottom:3px solid #111;background:#fff;color:#111;}
ul.panel {margin-bottom:40px;padding:80px 25px;border:1px solid #ccc;border-top:none;background:#fff;text-align:center}

/* contact page */
.contact_warp {display:block;}
.contact_warp p {padding:10px 0;font:12px/20px 'Nanum Gothic';}
.contact_warp p.tit {font:bold 15px 'Armata', serif;color:#666}
.contact_warp p strong {font:bold 12px/20px 'Nanum Gothic';color:#666}
#map-canvas, #map_canvas {width :1060px;height:300px;margin:0;border:10px solid #eaeaea;font-size:11px;} 
.map_Heading {font:bold 16px/25px 'Nanum Gothic';color:#30C;} 
.map_Content {font:12px 'Nanum Gothic';color:#333}

/* side menu */
#menu {display:none;}
#menu-toggle {display:none;}

}