@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 100;
	src: url(./fonts/NotoSansKR-Thin.woff2) format('woff2'),  
	url(./fonts/NotoSansKR-Thin.woff) format('woff'),  
	url(./fonts/NotoSansKR-Thin.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 300;
	src: url(./fonts/NotoSansKR-Light.woff2) format('woff2'),  
	url(./fonts/NotoSansKR-Light.woff) format('woff'), 
	 url(./fonts/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 400;
	src: url(./fonts/NotoSansKR-Regular.woff2) format('woff2'),  
	url(./fonts/NotoSansKR-Regular.woff) format('woff'),  
	url(./fonts/NotoSansKR-Regular.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 500;
	src: url(./fonts/NotoSansKR-Medium.woff2) format('woff2'),  
	url(./fonts/NotoSansKR-Medium.woff) format('woff'),  
	url(./fonts/NotoSansKR-Medium.otf) format('opentype');
}
@font-face {
	font-family: 'Noto Sans KR';
	font-style: normal;
	font-weight: 700;
	src: url(./fonts/NotoSansKR-Bold.woff2) format('woff2'),  
	url(./fonts/NotoSansKR-Bold.woff) format('woff'),  
	url(./fonts/NotoSansKR-Bold.otf) format('opentype');
}



* {margin:0;padding:0;}
html, body{height:100%;letter-spacing:-0.025em;-webkit-font-smoothing:subpixel-antialiased;-webkit-text-size-adjust:none;}
body{font-family:'Noto Sans KR', sans-serif;font-weight:300;font-size:12px;color:#222;}
header, section, nav, article, aside, details, figcaption, figure, hgroup, menu, footer {display:block;}
h1, h2, h3, h4, h5, h6{font-weight:400;font-size:100%}
ul, ol, li{list-style:none;}
fieldset, img{border:none;}
img{vertical-align:top;}
em {font-style:normal;}
table{width:100%;border-collapse:collapse;}
th {font-weight:400;}
td {color:#222;}
legend {position:absolute;top:0;left:0;width:0;height:0;overflow:hidden;padding:0;visibility:hidden;text-indent:-9999px;}
caption {width:0;height:0;overflow:hidden;padding:0;font-size:0;line-height:0;}
.hidden {font-size:0;line-height:0;text-indent:-99999px;}
.clear:after {display:block;content:'';clear:both;}
input, select{font-weight:300;font-family:'Noto Sans KR', sans-serif;vertical-align:middle;color:#777;border:1px solid #ddd;}
textarea {resize:none;border:1px solid #afafaf;padding:5px;font-family:'Noto Sans KR', sans-serif;font-size:12px;}
a{text-decoration:none; color:#222;}
a:foucs {border:1px solid red;outline: inherit;}


#wrap {min-width: 1200px;margin: 0 auto; overflow:hidden; }
/*헤드영역*/

#header {   z-index:10; top:0; left:0;width:100%;   padding:0; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; -o-box-sizing:border-box; -ms-box-sizing:border-box; box-sizing:border-box; background:#fff; }
#header .logo {position:absolute;}
#header .logo h1 {margin:0 0 0 3px;padding:0;height:35px;}
#header .logo h1 a {font-weight:bold;color:#555;font-size:22px;font-family:nanumgothic,dotum;}
#header .gnb { padding:0; text-align:right;}
#header .gnb ul {padding:0;margin:0;letter-spacing:-1px;}
#header .gnb li {list-style-type:none;display:inline;padding:5px 10px 5px 10px;font:normal 11px "malgun gothic",dotum;}
#header .gnb li { position:relative}
#header .gnb li::after { content:""; position:absolute; right:0px; top:7px; width:1px; height:10px; background-color:#ccc;}
#header .gnb li:last-child::after { display:none}
#header .gnb .admin a {color:#ff0000;}
#header .headUserHtml {color:#fff}
#header .imglogo{ z-index:10; text-align:center;}
#lnb {width:1200px;margin:0 auto;z-index:2;}


#header .gnbWrap { overflow:hidden; position:relative; width:100%;text-align:right}
#header .gnbWrap h2 { overflow:hidden; position:absolute; top:-9999px; width:1px; height:1px; }
#header .gnbWrap .gnbAcc { position:absolute; top:67px; width:60px; height:3px; background-color:#36C; opacity:0; }
#header .gnbWrap.active .gnbAcc { opacity:1; }
#header .gnbWrap #gnb:after { content:''; display:block; clear:both; }
#header .gnbWrap #gnb > li { display:inline-block; position:relative; }
#header .gnbWrap #gnb > li > a { display:inline-block; margin-right:35px; font-weight:400; line-height:90px; color:#333; font-size:19px; }
#header .gnbWrap #gnb > li:last-child a{ margin-right:0;}
#header .gnbWrap #gnb > li > a.current,
#header .gnbWrap #gnb > li > a:hover,
#header .gnbWrap #gnb > li > a:focus { font-weight:400; color:#36C; }
#header .gnbWrap #gnb > li > .depth2 { position:absolute; left:31px; width:100%; padding:27px 0 52px; opacity:0; }
#header .gnbWrap #gnb > li > .depth2 li + li { margin:10px 0 0; }
#header .gnbWrap #gnb > li > .depth2 li a { font-size:15px; color:#757575; letter-spacing:-0.5;}
#header .gnbWrap #gnb > li > .depth2 li a:hover,
#header .gnbWrap #gnb > li > .depth2 li a:focus { color:#36C; } 



/* Header :: 사이트맵, 네비게이션 버튼 */
.header-line-btn{ display:none;}

#container {position:relative;}
#content {}
#content .subContent { padding:100px 0 0px 0; font-size:15px; word-break:keep-all;}
#content .subContent .location {clear:both;font:normal 11px dotum;color:#999;padding:0;text-align:right}
#content .subContent .location a {color:#999;letter-spacing:-1px;}
#content .subContent .location a:hover {color:#000}
#content .subContent h3.subTitleSubject {margin:0;padding:0;font-size:30px; font-weight:500;letter-spacing:-1px;margin-bottom:30px;color:#333; text-align:center; }
/*--서브메뉴--*/
#content .snb {width:100%;padding:0;margin:0;}
#content .snb .snbBottom {padding:0px;margin-top:10px}

#content .snb .mybox {margin-bottom:10px}
#content .snb .mybox {border:#D4D4D4 solid 1px;}
#content .snb .mybox .login .mbrinfo {background:#F4F4F4;padding:0;border-bottom:#dfdfdf solid 1px;position:relative;height:80px;}
#content .snb .mybox .login .symbol {position:absolute;top:5px;left:5px;}
#content .snb .mybox .login .symbol img {width:37px;height:37px;border:1px #c0c0c0 solid}
#content .snb .mybox .login .namel {position:absolute;top:30px;left:55px;width:120px;height:12px;font-weight:bold;color:#454545;}
#content .snb .mybox .login .namer {position:absolute;top:5px;left:55px;width:108px;height:12px;font-weight:bold;color:#454545;}
#content .snb .mybox .login .score {position:absolute;bottom:12px;left:10px;font-size:11px;font-family:verdana;color:#636363;padding-top:3px;letter-spacing:-1px}
#content .snb .mybox .login .tabbox {}
#content .snb .mybox .login .tabbox .tp {float:left;width:60px;height:24px;line-height:24px;background:#F4F4F4;border-top:#ffffff solid 1px;border-bottom:#D4D4D4 solid 1px;text-align:center;font-weight:bold;color:#9E9E9E;cursor:pointer;position:relative}
#content .snb .mybox .login .tabbox .tp span.mcounter {
	font-weight:normal; font-size:11px; color:#F21914;letter-spacing:-1px;position:absolute;top:-10px;right:2px;font-family:arial;
	border-radius:12px;background-color:#ff6000;height:14px;padding:0 5px;color:#fff;line-height:14px;
	box-shadow:1px 1px 3px #ccc;
}
#content .snb .mybox .login .tabbox .tp span.mcounter1 {
	font-weight:normal; font-size:11px; color:#F21914;letter-spacing:-1px;position:absolute;top:-10px;right:2px;font-family:arial;
	border-radius:12px;background-color:#999;height:14px;padding:0 5px;color:#fff;line-height:14px;
	box-shadow:1px 1px 3px #ccc;
}
#content .snb .mybox .login .tabbox .vline {border-right:#D4D4D4 solid 1px;}
#content .snb .mybox .login .tabbox .on {background:#ffffff;border-top:#ffffff solid 1px;border-bottom:#ffffff solid 1px;color:#676767;}
#content .snb .mybox .login .lbody {padding:8px;}
#content .snb .mybox .login .lbody ul {padding:0;margin:0;list-style-type:none;}
#content .snb .mybox .login .lbody li {padding:4px 0;line-height:130%;}
#content .snb .mybox .login .lbody li a {font-family:dotum;font-size:11px;letter-spacing:-1px;line-height:130%}
#content .snb .mybox .login .lbody li .comment {font-family:arial;font-size:11px;color:#E75801;padding-left:3px;}
#content .snb .mybox .login .lbody li .new {font-family:arial;font-size:10px;color:#ff0000;}
#content .snb .mybox .login .lbody li .reply {font-family:dotum;font-size:11px;color:#888888;letter-spacing:-1px}
#content .snb .mybox .login .lbody li .pic {float:left;width:35px;}
#content .snb .mybox .login .lbody li .info {float:left;width:130px;}
#content .snb .mybox .login .lbody li a.lbmore {display:block;text-align:center;border:1px #ddd solid;padding:3px;}
#content .snb .mybox .login .lbody li a.lbmore:hover {color:#ff6000;background:#f0f0f0}
#content .snb .mybox .login .lbody .none {text-align:center;padding-top:40px;}
#content .snb .mybox .login .lbody .none span {display:block;font-weight:bold;font-size:13px;letter-spacing:-1px;} 
#content .snb .mybox .login .lbody .none p {padding:10px 0 40px 0;color:#9C9C9C;line-height:140%;letter-spacing:-1px;font-size:11px}

#content .snb .mybox .logout .tabbox {}
#content .snb .mybox .logout .tabbox .np {padding:10px 0 10px 10px;background:#F4F4F4;border-bottom:#D4D4D4 solid 1px;font-weight:bold;color:#9E9E9E;}
#content .snb .mybox .logout .tabbox .tp {float:left;width:90px;height:22px;background:#F4F4F4;border-bottom:#D4D4D4 solid 1px;text-align:center;font-weight:bold;color:#9E9E9E;padding-top:12px;cursor:pointer;}
#content .snb .mybox .logout .tabbox .vline {width:91px;border-right:#D4D4D4 solid 1px;}
#content .snb .mybox .logout .tabbox .on {background:#ffffff;border-bottom:#ffffff solid 1px;color:#676767;}
#content .snb .mybox .logout .nlog {margin-top:10px;padding:0 0 30px 10px;position:relative;height:65px;}
#content .snb .mybox .logout .i1 {position:absolute;font-size:11px;font-family:dotum;color:#67686A;letter-spacing:-1px;padding-bottom:3px;}
#content .snb .mybox .logout .i1 .input {float:left;width:110px;height:17px;border:#BEBEBE solid 1px;font-size:12px;font-family:tahoma}
#content .snb .mybox .logout .i1 .input:focus {border:#BEBEBE solid 2px;}
#content .snb .mybox .logout .i2 {position:absolute;top:48px;left:8px;font-family:dotum;font-size:11px;letter-spacing:-1px}
#content .snb .mybox .logout .i3 {position:absolute; top:1px;left:127px;}

#content .snb .mybox .logout .rbtm {position:absolute;bottom:4px;left:8px;font-size:11px;font-family:dotum;color:#67686A;letter-spacing:-1px;padding:10px 0 0 3px;}
#content .snb .mybox .logout .rbtm .ipc {color:#67686A}
#content .snb .mybox .logout .rbtm a {color:#313946;}
#content .snb .mybox .logout .rbtm span {padding:0 5px 0 5px;}
#content .snb .mybox .logout .slog {padding:20px 10px 10px 10px;}
#content .snb .mybox .logout .slog .icon {width:160px;padding:0px;text-align:center;}
#content .snb .mybox .logout .slog .icon img {cursor:pointer;margin:0 4px 0 4px;}
#content .snb .mybox .logout .slog .guide {line-height:140%;font-size:11px;font-family:dotum;color:#999;letter-spacing:-1px;padding:10px 0 0 0;}


#content .snb .category {padding:0; text-align:center;}
#content .snb .category h2 { position:absolute; top:175px;margin:0 0 10px 0;font-size:45px;letter-spacing:-2px;font-weight:bold;color:#fff;text-align:center; text-align:center; width:100%;}
#content .snb .category h2 span{ font-size:22px; line-height:27px; font-weight:400; display:inline-block; margin-top:15px;}
#content .snb .category ul {padding:0;margin:0; border-bottom:1px #ddd solid;}
#content .snb .category li { display:inline-block;list-style-type:none;margin:0; border-right:1px #ddd solid; margin-left:-2px;}
#content .snb .category li:last-child{ border:none;}

#content .snb .category .m2 {font-size:12px;letter-spacing:-1px;}
#content .snb .category .m2 a {color:#444;display:block;height:28px;line-height:28px; padding:10px 50px; font-size:19px;}
#content .snb .category .m2 a:hover {text-decoration:none;color:#ff6000;background-color:#efefef}

#content .snb .category .selected2 a {color:#fff;background:url(./image/sub_active_orange.jpg) repeat-x 0 0;font-weight:400;height:30px;line-height:30px}
#content .snb .category .selected2 a:hover {color:#fff;text-decoration:none;}
#content .snb .category .selected2 span.num {color:#fff}

#content .snb .category .orange a {background:url(./image/sub_active_orange.jpg) repeat-x 0 0;}
#content .snb .category .green a {background:url(./image/sub_active_green.jpg) repeat-x 0 0;}
#content .snb .category .blue a {background:url(./image/sub_active_blue.jpg) repeat-x 0 0;}
#content .snb .category .light_blue a {background:url(./image/sub_active_light_blue.jpg) repeat-x 0 0;}
#content .snb .category .black a {background:url(./image/sub_active_black.jpg) repeat-x 0 0;}
#content .snb .category .grey a {background:url(./image/sub_active_grey.jpg) repeat-x 0 0;}
#content .snb .category .red a {background:url(./image/sub_active_red.jpg) repeat-x 0 0;}

#content .snb .category ul li ul {margin:0px;background:none;background:#f0f0f0 url(./image/submenu_shadow.gif) repeat-x top;padding:10px 0;border-top:none}
#content .snb .category ul li ul li.m3 {font-weight:normal;font-size:12px;border-bottom:none}
#content .snb .category ul li ul li.m3 a {font-weight:normal;font-family:dotum;color:#454545;display:block;padding-left:23px;height:21px;line-height:21px;background:url(./image/snb_m3_ico.gif) no-repeat 16px 8px;letter-spacing:-1px;}
#content .snb .category ul li ul li.m3 a:hover {text-decoration:none;color:#000;background-color:#ddd;}

#content .snb .category ul li ul li.selected3 a {color:#ff6000;font-weight:bold;background:url(./image/snb_m3_ico_open.gif) no-repeat 15px 7px;}
#content .snb .category .spaceLi {height:7px;}
#content .snb .category .new {font:normal 10px arial;color:#ff0000;}
#content .snb .category .num {font:normal 11px arial;color:#999;}

/*하단정보영역*/
#footerWrap{ position:relative; }
#footerInfoWrap .newPhoto {position:absolute;left:0;width:210px}
#footerInfoWrap .newPhoto .tt {padding:0 0 8px 0;font-weight:bold;color:#666;}
#footerInfoWrap .newPhoto .pic {float:left;margin:0 0 8px 5px;padding:3px;background:#fff}
#footerInfoWrap .newPhoto .pic:hover{background:#ff6000}
#footerInfoWrap .newPhoto .pic img {width:54px;height:45px;}
#footerInfoWrap .newPhoto .nomargin {margin:0 0 7px 0;clear:both;}

#footerInfoWrap .newPost {position:absolute;left:250px;width:210px}
#footerInfoWrap .newPost .tt {padding:0 0 8px 0;font-weight:bold;color:#666;}
#footerInfoWrap .newPost ul {padding:0;margin:0;}
#footerInfoWrap .newPost li {list-style-type:none;margin-bottom:5px;}
#footerInfoWrap .newPost li a {font-family:dotum;font-size:11px;color:#ccc;letter-spacing:-1px;line-height:135%;background:url(./image/ico_dot.gif) no-repeat 15px 4px;padding-left:23px;display:block}
#footerInfoWrap .newPost li a:hover {text-decoration:none;color:#ff6000;background-position:15px -41px}
#footerInfoWrap .newPost li .comment {font:normal 11px arial;color:#FC6138;}
#footerInfoWrap .newPost li .trackback {font:normal 11px arial;color:#02ACD6;}
#footerInfoWrap .newPost li .new {font-family:arial;font-size:10px;color:#ff0000;}
#footerInfoWrap .newPost .none {padding:0 0 0 15px;font-size:11px;color:#ddd;letter-spacing:-1px;}

#footerInfoWrap .newComment {position:absolute;left:250px;width:210px}
#footerInfoWrap .newComment .tt {padding:0 0 8px 0;font-weight:bold;color:#666;}
#footerInfoWrap .newComment ul {padding:0;margin:0;}
#footerInfoWrap .newComment li {list-style-type:none;margin-bottom:5px;}
#footerInfoWrap .newComment li a {font-family:dotum;font-size:11px;color:#ccc;letter-spacing:-1px;line-height:135%;background:url(./image/ico_dot.gif) no-repeat 15px 4px;padding-left:23px;display:block}
#footerInfoWrap .newComment li a:hover {text-decoration:none;color:#ff6000;background-position:15px -41px}
#footerInfoWrap .newComment li .comment {font:normal 11px arial;color:#FC6138;}
#footerInfoWrap .newComment li .trackback {font:normal 11px arial;color:#02ACD6;}
#footerInfoWrap .newComment li .new {font-family:arial;font-size:10px;color:#ff0000;}
#footerInfoWrap .newComment .none {padding:0 0 0 15px;font-size:11px;color:#ddd;letter-spacing:-1px;}

#footerInfoWrap .newNotice {position:absolute;left:250px;width:210px}
#footerInfoWrap .newNotice .tt {padding:0 0 8px 0;font-weight:bold;color:#666;}
#footerInfoWrap .newNotice ul {padding:0;margin:0;}
#footerInfoWrap .newNotice li {list-style-type:none;margin-bottom:5px;}
#footerInfoWrap .newNotice li a {font-family:dotum;font-size:11px;color:#ccc;letter-spacing:-1px;line-height:135%;background:url(./image/ico_dot.gif) no-repeat 15px 4px;padding-left:23px;display:block}
#footerInfoWrap .newNotice li a:hover {text-decoration:none;color:#ff6000;background-position:15px -41px}
#footerInfoWrap .newNotice li .comment {font:normal 11px arial;color:#FC6138;}
#footerInfoWrap .newNotice li .trackback {font:normal 11px arial;color:#02ACD6;}
#footerInfoWrap .newNotice li .new {font-family:arial;font-size:10px;color:#ff0000;}
#footerInfoWrap .newNotice .none {padding:0 0 0 15px;font-size:11px;color:#ddd;letter-spacing:-1px;}

#footerInfoWrap .postCalendar,#footerInfoWrap .bottomRss,#footerInfoWrap .bottomCounter {
	-webkit-border-radius: 8px;	-moz-border-radius:8px;	border-radius: 8px;
	-moz-box-shadow:1px 1px 6px rgba(0,0,0,0.5);-webkit-box-shadow:1px 1px 6px rgba(0,0,0,0.5);box-shadow:1px 1px 6px rgba(0,0,0,0.5);behavior: url(./_ie/PIE.htc);
}

#footerInfoWrap .postCalendar {position:absolute;width:184px;left:810px;background:#fff;border:2px #c0c0c0 solid;top:20px;}
#footerInfoWrap .postCalendar .tt {padding:5px 0 5px 0;text-align:center;font-weight:bold;font-family:verdana;color:#666;}
#footerInfoWrap .postCalendar .tt img {position:relative;top:-1px;}
#footerInfoWrap .postCalendar .sunday {color:#2B97D7;}
#footerInfoWrap .postCalendar .week {height:20px;}
#footerInfoWrap .postCalendar .week td {color:#333;background:#f9f9f9;}
#footerInfoWrap .postCalendar table {width:100%;}
#footerInfoWrap .postCalendar td {text-align:center;color:#666;font-family:dotum;font-size:11px;}

#footerInfoWrap .bottomRss {position:absolute;left:810px;width:174px;height:18px;padding:5px;background:#fff url(./image/rss.gif) no-repeat 5px 6px;border:2px #c0c0c0 solid;text-align:right;line-height:18px;}
#footerInfoWrap .bottomRss {font-family:tahoma;font-size:11px;}
#footerInfoWrap .bottomCounter {position:absolute;left:810px;background:#fff url(./image/ico_count.gif) no-repeat 8px 1px;width:114px;padding:5px 5px 5px 65px;border:2px #c0c0c0 solid;font-family:tahoma;font-size:11px;color:#777}
#footerInfoWrap .customerCont {position:absolute;width:200px;height:200px;font-family:dotum;font-size:11px;color:#ddd;letter-spacing:-1px;}
#footerInfoWrap .customerCont a {color:#fff;}
#footerInfoWrap .customerCont a:hover {color:#ff6000;}

/*하단*/
#footer {margin:0;padding:0px 0px 25px 0px !important; background-color:#434343}
#footerbg {margin:0;padding:0 0 20px 0;position:absolute;left:0;display:block;width:100%;z-index:1;}

#footer .footerCont {width:1200px;margin:0 auto;display:block;position:relative;}
#footer .footerCont div.footerMenu {text-align:left; padding:15px 0px;}
#footer .footerCont div.footerMenu a {}
#footer .footerCont div.footerMenu a:hover {color:#e56a20}
#footer .footerCont div.footerMenu .split {font-family:dotum;font-size:9px;color:#c0c0c0;}

#footer .footerCont div.footerSiteInfo {font-size:15px;color:#c6c6c6;text-align:left; margin:0 auto}
#footer .footerCont div.footerSiteInfo h3 { font-size:17px;}
#footer .footerCont address {font-size:12px;font-style:normal;color:#c6c6c6 !important;text-align:left;margin-top:10px;}
#footer .footerCont address a{ color:#c6c6c6;}
#footer .footerCont .footerLogo {position:absolute;left:0;top:0}
#footer .footerCont .qrimage {position:absolute;right:0;top:0}

/*etc*/
.templatePreview {position:fixed;top:0;left:0;z-index:1000;background:#ff6000;padding:15px;border:3px #000 solid;color:#fff;text-align:center}
.usersavePreview {position:fixed;top:0;left:0;z-index:1000;background:#00ccff;padding:15px;border:3px #000 solid;color:#fff;text-align:center}

/*탭메뉴01*/
.tab01 {background: url("./image/bg_tab.gif") no-repeat scroll 0 top transparent;overflow: hidden;position: relative;}
.tab01 ul {margin:0;padding:0;overflow: hidden;padding-left: 1px;width: 100%;}
.tab01 li {background: url("./image/bg_tab.gif") no-repeat scroll -1px top transparent;display: inline;float: left;margin-left: -1px;padding-left: 5px;}
.tab01 li a {background: url("./image/bg_tab.gif") no-repeat scroll right top transparent;display: inline-block;height: 32px;letter-spacing: -1px;line-height: 32px;padding:0 20px 0 16px;text-decoration: none;vertical-align: top;text-align:Center}
.tab01 li a:hover, .tab01 li a:active {text-decoration: none;}
.tab01 li.selected {background-position: 0 -58px;margin-right: 1px;position: static;z-index: 10;}
.tab01 li.selected a {background-position: right -58px;color: #ff6000;font-weight: bold;}

div.depth5 {list-style:none;height:33px;border-bottom:1px #bbb solid;margin-top:5px;}
div.depth5 a{display:inline-block;padding:8px 15px 5px 15px;letter-spacing:-0.5px;margin-right:10px;background:url('./image/common/bul_arrow1.gif') no-repeat 0 10px;font-weight:bold;}
div.depth5 a.selected5 {background:#ff6000;font-weight:bold;color:#fff;-webkit-border-radius: 3px; -moz-border-radius: 3px;}

#pctomobile {visibility:hidden}
#pctomobile_blueb {position:absolute;bottom:-70px;z-index:10000;display:block;width:100%;border:1px #000 solid;background:#e0e0e0;height:70px;text-align:center;font-family:dotum;font-size:24px;color:#fff;line-height:70px;}


#pages_join, #pages_login, #mypage_main, #pages_top, #pages_all, .iframe, #bbsview, #guidebox{ width:1200px; margin:0 auto; padding-top:150px;}
#pages_login{ padding:100px 0 100px 0;}
#bbslist { padding-bottom:50px !important;}

.inner{ position:relative; width:1200px; margin:0 auto;}

.haccp_img {position: absolute;width: 70px;left: 30%;}
.haccp_img img {width: 100%;}

 /*-- banner-top --*/
.banner-top {width: 100%;background: url(./image/main/img_main_slide01.jpg) no-repeat 50% 50%;background-size: cover;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;-moz-background-size: cover;height:485px/* 메인 비주얼 높이 100% 채울시 100%로 변환*/;}
.banner-top1 {width: 100%;background: url(./image/main/img_main_slide02.jpg) no-repeat 50% 50%;background-size: cover;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;-moz-background-size: cover;	height:485px;/* 메인 비주얼 높이 100% 채울시 100%로 변환*/}
.banner-top2 {width: 100%;background: url(./image/main/img_main_slide03.jpg) no-repeat 50% 50%;background-size: cover;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;-moz-background-size: cover;height:485px;/* 메인 비주얼 높이 100% 채울시 100%로 변환*/}
.banner-top3 {width: 100%;background: url(/img/template/banner4.jpg) no-repeat 0px 0px;background-size: cover;-webkit-background-size: cover;-moz-background-size: cover;-o-background-size: cover;-moz-background-size: cover;height: 750px;}
.banner-info { position:absolute;text-align: center; left:50%; top:50%; width:1300px; height:100px; margin:-200px 0 0 -650px;  color:#fff;}
.banner-info a i {color: #fff;text-decoration: none;padding: 6px 10px;letter-spacing: 1px;font-size: 16px;margin: 1em 5px 0 0em;display: inline-block;border: 1px solid transparent;border-color: #fff;}
.banner-info a i:hover {color: #f36f21;background: #fff;display: inline-block;}
.banner-info h3 {font-size:4.5em;letter-spacing: -3px;margin-bottom: 0.2em;font-weight: 600;}
.banner-info h4{ font-size:2em; line-height:40px; font-weight:400; letter-spacing:-1px;}
.banner-info p {font-size: 1em;color: #fff;margin: 1.5em 0;letter-spacing: 6px;}
.banner-info i {color: #fff;}
/*-- //banner-top --*/
#slider4 li .visual-text { text-align:center; color:#fff; margin-top:160px;}
#slider4 li .visual-text h3 {color:#fff; font-size:45px; line-height:48px;}
#slider4 li .visual-text h3 b { text-transform:uppercase;}
#slider4 li .visual-text p {color:#fff;font-size:20px; margin-top:20px;}
 
 /*--slider--*/
#slider2, #slider3 {box-shadow: none;-moz-box-shadow: none;-webkit-box-shadow: none;margin: 0 auto;}
.rslides_tabs li:first-child {margin-left: 0;}
.rslides_tabs .rslides_here a {background: rgba(255, 255, 255, .1);color: #fff;font-weight: bold;}
.events {list-style: none;}
.callbacks_container {position: relative; width: 100%;}
.callbacks {position: relative;list-style: none;overflow: hidden;width: 100%;padding: 0;margin: 0;}
.callbacks li {position: absolute;width: 100%;}
.callbacks img {position: relative;z-index: 1;height: auto;	border: 0;}
.callbacks .caption {display: block;position: absolute;z-index: 2;font-size: 20px;text-shadow: none;color: #fff;left: 0;right: 0;padding: 10px 20px;margin: 0;max-width: none;top: 10%;text-align: center;}
.callbacks_nav {position: absolute;	-webkit-tap-highlight-color: rgba(0, 0, 0, 0); top:50%;left: 40px;opacity: 0.9;z-index: 3;text-indent: -9999px;overflow: hidden;text-decoration: none;height:35px;width:35px; background: #fff url(/img/template/left.png) no-repeat 0px 0px;}
.callbacks_nav.next {left: auto;background: url(./image/main/photo_next.png) no-repeat; right:70px;}
.callbacks_nav.prev {left: auto;background: url(./image/main/photo_prev.png) no-repeat;left:70px;}
.callbacks_nav.prev:hover,
.callbacks_nav.prev:focus { background-image:url('./image/main/photo_prev.png'); }
.callbacks_nav.next:hover,
.callbacks_nav.next:focus { background-image:url('./image/main/photo_next.png'); }

#slider3-pager a {display: inline-block;}
#slider3-pager span {float: left;}
#slider3-pager span {width: 100px;height: 15px;	background: #fff;	display: inline-block;border-radius: 30em;opacity: 0.6;}
#slider3-pager .rslides_here a {background: #FFF;border-radius: 30em;opacity: 1;}
#slider3-pager a {padding: 0;}
#slider3-pager li {display: inline-block;}
.rslides {position: relative;list-style: none;overflow: hidden;width: 100%;padding: 0; height:485px !important;/* 메인 비주얼 높이 100% 채울시 100%로 변환*/}
.rslides li {-webkit-backface-visibility: hidden;position: absolute;display: none;width: 100%;left: 0;top: 0; height:100%;}
.rslides li {position: relative;display: block;float: left;}
.rslides img {height: auto;border: 0;}
.callbacks_tabs {list-style: none;position: absolute; left:0; right:0;   bottom:35px;padding: 0; margin:0px auto;display: block;z-index:9; text-align:center;}
.callbacks_tabs li{ display:inline-block; }
.slider-top span {font-weight: 600;}

/*----*/

.callbacks_tabs a {visibility: hidden; display:inline-block;}
.callbacks_tabs a:after {content: "\f111";font-size: 0;font-family: FontAwesome;visibility: visible;display: block;height:15px;width:15px;display: inline-block;background: #ffffff;border-radius: 50%;-webkit-border-radius: 50%;
-o-border-radius: 50%;-moz-border-radius: 50%;-ms-border-radius: 50%;margin: 0;}
.callbacks_here a:after {background: #f36f21;margin: 0;height:15px;width:15px;}  
#maincontent { margin:0 auto; width:100%; }
#maincontent section h2 { font-size:28px; font-weight:600; color:#333}
#maincontent section p {font-size:16px; font-weight:300; color:#666}
#maincontent .mainsection01 .boxbanner { display:inline-block; width:100%; margin:50px 0 20px 0;} 
#maincontent .mainsection01 .boxbanner ul { margin:0; padding:0;} 
#maincontent .mainsection01 .boxbanner ul li a { width:calc((100% / 3) - 90px); float:left; padding:60px 45px; height:330px; background-size: auto 100%}
#maincontent .mainsection01 .boxbanner ul li a h3 { font-size:18px; line-height:22px;  font-weight:300; word-break:keep-all}
#maincontent .mainsection01 .boxbanner ul li a h3 b { font-weight:500}
#maincontent .mainsection01 .boxbanner ul li a span { margin-top:30px; display:inline-block; font-size:16px; padding-bottom:5px;}
#maincontent .mainsection01 .boxbanner ul li.box01 a { background:#eae5da url('/layouts/bluebDesign_2019/image/main/box01.png') right bottom no-repeat;} 
#maincontent .mainsection01 .boxbanner ul li.box01 a h3 { color:#684d12}
#maincontent .mainsection01 .boxbanner ul li.box01 a span { border-bottom:1px #684d12 solid; color:#684d12}
#maincontent .mainsection01 .boxbanner ul li.box02 a { background:#f8f8f8 url('/layouts/bluebDesign_2019/image/main/box02.png') right bottom no-repeat;}
#maincontent .mainsection01 .boxbanner ul li.box02 a h3 { color:#262626}
#maincontent .mainsection01 .boxbanner ul li.box02 a span { border-bottom:1px #262626 solid; color:#262626}
#maincontent .mainsection01 .boxbanner ul li.box03 a { background:#4f3c25 url('/layouts/bluebDesign_2019/image/main/box03.png') center bottom no-repeat;}
#maincontent .mainsection01 .boxbanner ul li.box03 a h3 { color:#fff}
#maincontent .mainsection01 .boxbanner ul li.box03 a span { border-bottom:1px #eee solid; color:#fff}
#maincontent .mainsection01 .bannerbg { background:#f7f7f7 url('/layouts/bluebDesign_2019/image/main/bannerbg.png') right bottom no-repeat;  }
#maincontent .mainsection01 .bannerbg a { height:140px; display:block; padding-top:60px; padding-left:30px;}

#maincontent .mainsection02 {  background:#f7f7f7 url('/layouts/bluebDesign_2019/image/main/foodbg.jpg') center top no-repeat; background-size: auto 100%; text-align:center; padding:50px 0px; margin:50px auto} 
#maincontent .mainsection02 .phototitle {  }
#maincontent .mainsection02 .photozone { margin-top:30px;}
#maincontent .mainsection02 .photozone .photoBox {position:relative; text-align:center; margin:0 auto; width:1200px;}
#maincontent .mainsection02 .photozone .photoBox .btn_prev {position:absolute; top:180px; left:-65px;cursor:pointer;}
#maincontent .mainsection02 .photozone .photoBox .btn_next {position:absolute; top:180px; right:-65px;cursor:pointer;}
#maincontent .mainsection02 .photozone .photoBox .photoDiv {position:relative;  padding:0; text-align:center; overflow:hidden; }
#maincontent .mainsection02 .photozone .photoBox .photoImg {margin:0 auto; width:300%; padding:0; text-align:left; display:inline-block}
#maincontent .mainsection02 .photozone .photoBox .photoImg li { display:inline-block;list-style-type:none;  width:240px; height:250px; padding:40px 20px; text-align:center; margin-right:10px; font-weight:400; background-color:#fff; vertical-align:top}
#maincontent .mainsection02 .photozone .photoBox .photoImg li:last-child { margin:0}
#maincontent .mainsection02 .photozone .photoBox .photoImg p{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-align:center; margin-top:15px; font-size:17px;}
#maincontent .mainsection02 .photozone .photoBox .photoImg p a { font-weight:400}
#maincontent .mainsection02 .photozone .photoBox .photoImg  img{ width:100%; }

#maincontent .mainsection03 .minibanner ul { display:inline-block; width:100%}
#maincontent .mainsection03 .minibanner ul li {width:49%; text-align:center; padding:50px 0px}
#maincontent .mainsection03 .minibanner ul li.system {background:#eae5da url('/layouts/bluebDesign_2019/image/main/system01.png') left top no-repeat ;background-size:100%; float:left}
#maincontent .mainsection03 .minibanner ul li.catering {background:#dedccb url('/layouts/bluebDesign_2019/image/main/catering01.png') left top no-repeat ;background-size:100%;  float:right}

#maincontent .mainsection04 { background-color: #f9f9f9;display: inline-block;width: 100%;padding: 50px 0px; margin-top:50px;}
#maincontent .mainsection04 .phototitle { float:left;width:20%;  height:190px; position:relative}
#maincontent .mainsection04 .phototitle .photoBoxbtn { position:absolute; bottom:0px; }
#maincontent .mainsection04 .phototitle .photoBoxbtn #btn_prev2 {position:absolute; bottom:0px;  left:0px;cursor:pointer;}
#maincontent .mainsection04 .phototitle .photoBoxbtn #btn_next2 {position:absolute; bottom:0px; left:40px;cursor:pointer;}
#maincontent .mainsection04 .photozone { float:right;width:75%; }
#maincontent .mainsection04 .photozone .photoBox2 {position:relative; text-align:center; margin:0 auto; }
#maincontent .mainsection04 .photozone .photoBox2 .photoDiv2 {position:relative;  width:100%; padding:0; text-align:left; overflow:hidden;}
#maincontent .mainsection04 .photozone .photoBox2 .photoImg2 {margin:0 auto; width:2500%; padding:0; text-align:left; display:inline-block}
#maincontent .mainsection04 .photozone .photoBox2 .photoImg2 li {float:left; list-style-type:none;  text-align:center; margin:0 15px; font-weight:400; }
#maincontent .mainsection04 .photozone .photoBox2 .photoImg2 p{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; text-align:center; margin-top:15px; font-size:17px;}
#maincontent .mainsection04 .photozone .photoBox2 .photoImg2  img{ width:275px; height:190px;}



 
#content .subContent .subtext { text-align:center; font-size:18px; margin-bottom:30px;}  
.text-right { text-align:right}
.text-left { text-align:left}
 
.page34 .address{ position:relative} 
.page34 .address_info{ width:550px;height:260px;background:#ff6b00; padding:47px 0 0 60px;box-sizing:border-box;z-index:10; position:absolute; top:50px; left:0}
.page34 .address_info .title{color:#fff; font-size: 2.133rem; font-weight:500}
.page34 .address_info .text{padding-top:20px;line-height:200%;color:#fff}
.page34 .map_area{ padding-top:100px} 


.page30 { background:url('/layouts/bluebDesign_2019/image/content/movie-bg.jpg') no-repeat top center; }
.page30 .company { padding:0;}
.page30 p { font-size:17px; margin-top:30px;}
.page30 .company-movie {}
.page30 .company-text { padding:80px 0}
.page30 .company-text h3 {  font-size: 3.133rem;  font-weight:600}
.page30 .company-text h4 { font-size: 2.133rem;  font-weight:300} 
.page30 span { margin-top:20px; display:block}
.page30 span a {    display: inline-block;    position: relative;    padding: 0 34px;    border: 1px solid rgba(69,80,101,0.5);    line-height: 35px;}
.page30 span a::after{ content: '';    position: absolute;    left: -34px;    top: 17px;    width: 45px;    height: 1px;    background: rgba(69,80,101,0.5);} 
 
 
 
 
 


.page31 .business { padding-bottom:50px;}
.page31 .business-section.br .cellbox { position: relative; width:1200px; margin:0 auto}
.page31 .business-section.br .cellbox .container { position:relative}
.page31 .business-section.br .cellbox:nth-child(1), 
.page31 .business-section.br .cellbox:nth-child(2),
.page31 .business-section.br .cellbox:nth-child(3),
.page31 .business-section.br .cellbox:nth-child(4) { padding:50px 0px }
.page31 .business-section.br .cellbox:nth-child(2) .container { position: relative; }  
.page31 .business-section.br .cellbox:nth-child(2) .container, .business-section.br .cellbox:nth-child(3) .container {  }
/* .business-section.br .cellbox .text { position: absolute; top: 98px; } */
.page31 .business-section.br .cellbox .text { float: right; padding-top: 9%; } 
.page31 .business-section.br .cellbox .thumb { float: left; position: relative; z-index:1000}
.page31 .business-section.br .cellbox .text p { font-size: 1.2rem; line-height: 2.133rem; letter-spacing: -0.6px; color: #000; word-break: keep-all; }
/* .business-section.br .cellbox .thumb { position: relative; } */
.page31 .business-section.br .cellbox .thumb span { padding-top: 5px; border-top: 2px solid #ff6b00; font-family: 'Roboto', sans-serif; font-weight: 700; color: #ff6b00; position: absolute; top: 20px; left: 35px; }
.page31 .business-section.br .cellbox:nth-child(2) .thumb { float: right; }
.page31 .business-section.br .cellbox:nth-child(4) .thumb { float: right; }
/* .business-section.br .cellbox:nth-child(2) .thumb img { transform: translate(16px); }
.business-section.br .cellbox:nth-child(3) .thumb img {transform: translate(-16px); } */
.page31 .business-section.br .cellbox:nth-child(1) .text { padding-top: 5%; }
.page31 .business-section.br .cellbox:nth-child(2) .text { float: left; padding-top: 100px; }
.page31 .business-section.br .cellbox:nth-child(3) .text { float: right; }
.page31 .business-section.br .cellbox:nth-child(4) .text { float: left; padding-top: 100px; }
.page31 .business-section.br .cellbox .title1 { font-size: 3.133rem; line-height: 3.866rem; letter-spacing: -3px; margin-bottom: 20px; position: relative; }
.page31 .business-section.br .cellbox .title1:before { font-size: 4.8rem; color: #ff6b00; content: '“'; position: absolute; top: -10px; left: -35px; }
.page31 .business-section.br .cellbox .title1 strong { font-weight: 700; }
.page31 .business-section.br .cellbox:nth-child(1):after,
.page31 .business-section.br .cellbox:nth-child(3):after,
.page31 .business-section.br .cellbox:nth-child(2) .container:before { width: 100%; height: 1px; background: #ff6b00; position: absolute; z-index: 0; content: ''; }
.page31 .business-section.br .cellbox:nth-child(4) .container:before { width: 100%; height: 1px; background: #ff6b00; position: absolute; z-index:0; content: ''; }
.page31 .business-section.br .cellbox:nth-child(1):after, .business-section.br .cellbox:nth-child(3):after { max-width: 1495px; bottom:205px; }
.page31 .business-section.br .cellbox:nth-child(1):after { left: 0; }
.page31 .business-section.br .cellbox:nth-child(2) .container:before { width:100%; bottom: 115px; right: 0; }
.page31 .business-section.br .cellbox:nth-child(3):after { right: 0; max-width: 1540px; }
.page31 .business-section.br .cellbox:nth-child(4) .container:before { width:100%; bottom: 115px; right: 0; } 


#page32 .areas-box { margin-bottom:50px;}
#page32 .areas-box .areas-title { width:100%; text-align:center; border:0px; padding:0; text-align:left; }
#page32 .areas-box .areas-title h3 {position:relative; padding:15px 0 5px 0;    font-size: 30px;    margin:0;     font-weight: 500;    line-height: 36px;    word-break: keep-all;
}
#page32 .areas-box .areas-title h3::before { position:absolute; content:""; top:0px; left:0px; width:50px; height:4px; background-color:#ff6b00}
#page32 .areas-box .areas-title p {font-size: 17px; font-weight: 300;list-style: none;margin-bottom: 15px;position: relative; word-break: keep-all;}
#page32 .areas-box .areas-text { width:100%; text-align:left; border:0px; padding:0px;background-color:#fcfcfc; padding:30px; display:inline-block; width:100%}
#page32 .areas-box .areas-text ul {  text-align:left; margin:0 auto}
#page32 .areas-box .areas-text ul li { margin:0 0 10px 0; position:relative; padding-left:10px;}
#page32 .areas-box .areas-text ul li::before {    position: absolute;    left: 0;    top: 10px;    width: 3px;    height: 3px;    background-color: #666;    content: " ";}
#page32 .areas-box .areas-text ul li span {   font-weight:400}  

.page33 { background:url('/layouts/bluebDesign_2019/image/content/page33-bg.jpg') no-repeat top center;  }
.page33 .area_brand { padding:20px 0}
.page33 .area_brand .vision-pic { text-align:center}
.page33 .area_brand .vision-pic .pBox_t{font-size:26px; font-weight:300; word-break:keep-all; line-height:26px; position:relative; padding-top:15px;} 
.page33 .area_brand .vision-pic .pBox_t::before {position: absolute;    content: "";    top: 0px;    left: 0px;  right:0; margin:0 auto ; width: 50px;    height: 4px;    background-color: #ff6b00;}
.page33 .area_brand .vision-pic .pBox_t strong{display:block; font-size:28px; font-weight:400;margin-bottom:20px !important; line-height:36px;}
.page33 .area_brand .vision-pic .pBox_t span{color:#ff6b00; font-size:18px; font-weight:400;display:block; text-transform:uppercase}
.page33 .area_brand .vision-pic ul {display:inline-block;  margin:0 auto 50px auto; padding:0; list-style:none }
.page33 .area_brand .vision-pic ul li {position:relative; display:inline-block; width:345px;position:relative; vertical-align:top; background-color:#fff; border:1px #ddd solid; padding:50px 30px; margin:5px; min-height:280px;}
.page33 .area_brand .vision-pic ul li p { font-size:15px; text-align:left; position:relative; padding-left:10px}
.page33 .area_brand .vision-pic ul li p::before { position:absolute; content:""; width:2px; height:2px; background-color:#666; top:15px; left:0} 
.page33 .area_brand .vision-pic ul li.ico00_slo:after{display:none;}   
  
  
  
   
#page40 .jsg { margin-top:50px; }
#page40 .jsg-text { text-align:center; margin:50px 0px 60px 0 ; }
#page40 .jsg-text h3 { margin:0px 0px 10px 0px; color:#0f0f0f; font-size:28px; font-weight:500}
#page40 .jsg-text p { font-size:15px; color:#0f0f0f} 
#page40 .jsg-interior { margin:0px 0 50px 0; text-align:center}  
#page40 .cont { display:inline-block; position:relative; margin:0px 0px 20px 0; width:100%; border:1px solid #e7e7e7;}
#page40 .cont dl {  margin:0; padding:0; width:100%;}
#page40 dl dt {line-height:40px; height:40px; margin:0; padding:0; color:#fff; font-size:16px; font-weight:bold; letter-spacing:-1px; text-align:center;background:#ff6b00; center top no-repeat;}
#page40 dl dt span {padding-left:7px; color:#333; font-size:12px; font-weight:normal; letter-spacing:0px;}
#page40 dl dd { margin:0; padding:0; text-align:left;}
#page40 dl dd ul {margin:20px 0 0 10px; padding:0;}
#page40 dl dd ul li {width:170px; color:#777; font-size:13px; line-height:150%; padding:4px 0 0 10px; position:relative; }
#page40 dl dd ul li::before { position:absolute; left:0px; top:15px; width:3px; height:3px; background-color:#ff6b00; content:"";}
#page40 .menulist { margin:0 auto; text-align:center}

  
  
  
  
.system { text-align:center; margin-bottom:50px;}
.system .fz_01 { padding:50px 0px}


  
  
   
.h3_tit {font-weight:500; padding-bottom:50px; line-height:48px;}
.h3_tit::after {content: ''; display:block; width:40px; height:4px; background-color: #373737; margin-top:36px;}
.fz_01 {font-size: 36px;}
.ta_01 { text-align:center}
.ta_01:after { left:0; right:0; margin:36px auto 0 auto}

.section01 {background-color: #e2ddd7; padding:60px 0; box-sizing: border-box;} 
.section01 .promise .bs_cont {display:table; width:100%;} 
.section01 .promise .bs_cont h2 { line-height:44px; float:left}
.section01 .promise .bs_cont .bs_txt {width:68%; word-break: keep-all;}
.section01 .promise .bs_cont .bs_txt p { line-height:27px; font-size:17px;}  
.section01 .promise .bs_txt {display:table-cell; vertical-align: top; float:right} 
.section01 .promise .bs_img { text-align:center; padding:50px 10px; background-color:#d7ccbf; margin-top:50px;}

.section02 .foodmenu { padding:50px 0 0 0px;}
.section02 .foodmenu .menulist { }
.section02 .foodmenu .menulist .menucont { text-align:center;  }
.section02 .foodmenu .menulist h2 {  font-size:22px; text-align:center; margin-bottom:50px}
.section02 .foodmenu .menulist .menucont dl { display:inline-block; vertical-align:top;  margin-right:45px; } 
.section02 .foodmenu .menulist .menucont dl:last-child { margin:0px;} 
.section02 .foodmenu .menulist .menucont dl dt {  font-size:18px; font-weight:400; margin-bottom:20px; text-align:center}
.section02 .foodmenu .menulist .menucont dl dt img { width:200px; height:200px; border-radius:100%;}
.section02 .foodmenu .menulist .menucont dl dt span { font-size:14px; color:#666; text-transform:uppercase;  display:block}
.section02 .foodmenu .menulist .menucont dl dd {padding:25px; border-top:2px #eeecec solid;}
.section02 .foodmenu .menulist .menucont dl dd ul { margin:0; padding:0}
.section02 .foodmenu .menulist .menucont dl dd ul li { position:relative; padding-left:10px; text-align:left}
.section02 .foodmenu .menulist .menucont dl dd ul li::before { content:""; position:absolute; left:0px;  top:15px; width:3px; height:1px; background-color:#666;}

.section03 .bs_txt_wrap {position:relative; display:table; width:100%; padding:100px 0 120px 0;}
.section03 .bs_txt {position:relative;}
.section03 .bs_txt ul {overflow: hidden; counter-reset: promise_list;}
.section03 .bs_txt ul li {position: relative; float:left; width:570px; height:210px;display:block; padding:40px 40px 40px 200px; box-sizing: border-box; background-color: #eeecec; margin-top:30px;}
.section03 .bs_txt ul li:before {content: ''; display:inline-block; width:130px; height:130px; background: url(/layouts/bluebDesign_2019/image/content/icon_promise.png) left top no-repeat; background-size:260px 260px; position:absolute; left:40px; top:40px;}
.section03 .bs_txt ul li.pr_list02:before {background-position:-130px 0;}
.section03 .bs_txt ul li.pr_list03:before {background-position:0px -130px;}
.section03 .bs_txt ul li.pr_list04:before {background-position:-130px -130px;}
.section03 .bs_txt ul li:after {content: ''; width:20px; height:20px; position:absolute; right:0; bottom:0; background: url(../images/hansot/bg_list.jpg) left top no-repeat; display: inline-block;}
.section03 .bs_txt ul li:nth-child(odd) {margin-right:30px;}
.section03 .bs_txt ul li.pr_list01,
.section03 .bs_txt ul li.pr_list02 {margin-top:0;} 
.section03 .bs_txt ul li h4 {font-size:20px;}
.section03 .bs_txt ul li h4 span.s_block {display:inline;}
.section03 .bs_txt ul li h4, .section03 .bs_txt ul li p {margin-left:2px; padding-top:5px;} 
.section03 .bs_txt ul li > p {padding-top:18px; color:#909090; line-height:25px; font-size:17px; word-break: keep-all;} 

.section04 .subWrapB {   width:100%; background:#f7f7f3; padding:70px 0; }
.section04 .subWrapB .subSection { width:1200px; margin:0 auto; }
.section04 .subWrapB .confirmbox { background-color:#fff}
.section04 .subWrapB .subSection > h1 { font-size:40px; font-weight:200; letter-spacing:-0.07em; }
.section04 .subWrapB .subSection  > h2 { white-space:pre-line; font-size:26px; font-weight:300; letter-spacing:-0.04em; margin:0px 0 40px 0; text-align:center}
.section04 .subWrapB .subSection  > h2 > span { font-weight:400; }
.section04 .subWrapB .subSection  > h2 > span.under { border-bottom:1px solid #ccc; }
.section04 .subWrapB .subSection  > h3 { white-space:pre-line; font-weight:200; font-size:17px; line-height:28px; letter-spacing:-0.03em; text-align:center; margin:30px auto 0 auto; width:70%}
.section04 .subWrapB .subSection  > h3 > span { font-weight:400; color:#b7343d; }
	 
.section05 .menu_material {position:relative;display:inline-block;padding:130px 0; box-sizing: border-box; width:100%} 
.section05 .menu_material .mat_cont {position:relative; box-sizing: border-box;  padding:0; overflow: hidden;}
.section05 .menu_material .mat_cont div.mat_img, 
.section05 .menu_material .mat_cont .mat_txt_wrap {float:left; height:560px;}
.section05 .menu_material .mat_cont div.mat_img {float:right; width:600px;}
.section05 .menu_material .mat_cont div.mat_txt_wrap{float:left; width:510px; margin-right:60px; box-sizing: border-box;}   
.section05 .menu_material .mat_cont .mat_txt p { margin-bottom:20px;}
.section05 .menu_material .mat_cont .mat_txt strong {font-size: 18px; font-weight:500; padding-bottom: 10px; display: block;} 
.section05 .onlinebtn { width:100%; text-align:center; margin-top:50px;}
.section05 .onlinebtn span { width:180px; text-align:center; background-color:#f2c000; height:45px; line-height:45px; display:inline-block; margin:0 auto}
.section05 .onlinebtn span a { color:#000; font-weight:400}

.section06 .morestory {width:100%; padding:50px 0; overflow: hidden; background:#f2c000} 
.section06 .morestory  .more_tit {position:relative; padding-bottom:30px; width:100%; margin:0 auto; line-height:100%; font-size:26px; color:#373737; font-weight:500;} 
.section06 .morestory  ul { width:100%; margin:0 auto;  }
.section06 .morestory  ul li {position:relative; float:left; width:370px; height:266px; overflow:hidden; box-sizing: border-box; margin-left:30px;}
.section06 .morestory  ul li:first-child {margin-left:0;}
.section06 .morestory  ul li figure {position:relative;}
.section06 .morestory  ul li figure span.more_img {display:block; width:100%; height:100%; overflow: hidden;}
.section06 .morestory  ul li figure span.more_img img {width:100%;}
.section06 .morestory  ul li figure figcaption {position:absolute; bottom:0; left:0; padding:0 20px 0 30px; height:61px; box-sizing: border-box; width:100%; background-color: #373737; overflow:hidden;}
.section06 .morestory  ul li figure figcaption h4 {color:#fff; position:relative; padding:22px 0 20px 0; font-size:15px; height:60px; box-sizing: border-box;} 
.section06 .morestory  a.more_link {position:absolute; left:0; top:0; width:100%; height:100%; display:block; background-color: #ddd; opacity: 0; z-index: 2;}
.section06 .morestory  a.more_link + figure h4 {transition-duration: 0.5s;} 
.section06 .morestory  ul li a.more_link:hover + figure figcaption h4 {color:#f6ca00;}
.section06 .morestory  ul li a.more_link:hover + figure figcaption h4:after {content: ''; background-position: -6px 0;} 
  
  
   
 
#page35 {position:relative; display:inline-block; width:100%;}
#page35 .listBox {position:relative; z-index:1; margin:0 auto; border:1px solid #eee;  margin:5px; padding:20px;} 
#page35 .listBox .tit {margin:0px 0 30px; width:150px; height:35px; line-height:35px; font-size:15px; background:#ff6b00; text-align:center; color:#fff; font-weight:500}
#page35 .listBox ul {margin:0 auto; padding:0; list-style:none;}
#page35 .listBox ul li {margin:0; padding:0;   text-align:center; }
#page35 .listBox ul li p {font-size:13px; color:#777; margin-top:15px;}

 
#page35 .tit { margin:25px 0 30px; width:100%; height:40px; line-height:40px; font-size:16px; color:#fff;  text-align: center;  background:url(./image/content/viewbox_tit_bg.jpg) center top no-repeat; } 
#page35 .Img { float:left; vertical-align:top; text-align: center; width:30%; } 
#page35 .cont { float:right; text-align:right; width:65%;}
#page35 .cont ul {margin:0 0 0 10px; padding:0;}
#page35 .cont ul li {color:#000; padding-left:10px; text-align:left; position:relative; line-height:28px}
#page35 .cont ul li::after { content:""; position:absolute; left:0; top:15px; width:3px; height:3px; background-color:#666}
#page35 .foodbox { margin-bottom:30px;border-bottom:1px #eee solid; padding-bottom:30px; width:100%; display:inline-block; } 
#page35 .foodbox:last-child { border:0px}
#page35 .check { display:inline-block; width:100%; text-align:right; color:#666;  font-size:14px;}
#page35 .name { padding-top:20px; margin-top:20px; text-align:right}
#page35 .price { font-size:25px; font-weight:500; margin-left:15px; color:#ff6b00}
#page35 .etc { display:block} 
   
   
.Cateringicon { margin-bottom:50px;}
.Cateringicon P { width:50%; margin:0 auto 50px auto}
.Cateringicon li { position:relative; display:inline-block; background-color:#e6e6e6; width:170px; height:170px; border-radius:100%; margin:0px 60px; vertical-align:top;  }
.Cateringicon li::before { position:absolute; content:""; width:60px; height:1px; border-top:1px #000 dotted; margin:0 auto; right:-90px; top:85px;}
.Cateringicon li:last-child::before { display:none}
.Cateringicon li img { margin-top:20px;}
.Cateringicon li span { font-weight:400; display:block; word-break:keep-all}
.Cateringservice li { display:inline-block; width:45%; text-align:center; margin:30px 10px;vertical-align:top;  }
.Cateringservice li img { width:100%}
.Cateringservice li h3 { margin:10px 0px; padding-bottom:10px;  border-bottom:1px #eee solid; font-size:20px; color:#ff6b00}
   
   
 
/*브랜드 철학 > section_01*/
.section_01 {background-color: #e2ddd7; padding:100px 0; box-sizing: border-box; text-align:center}
.section_01 h2.h2_tit {  line-height:64px;} 
.section_01 .bs_cont .bs_txt {background-color:#d7ccbf; margin:30px auto 0 auto; padding:10px 0; width:80%;} 
.section_01 .bs_cont .bs_txt .bs_icon { display:inline-block; width:40%; vertical-align:top;padding:20px;} 
.section_01 .bs_cont .bs_txt .bs_icon span { font-weight:500; display:block}
.section_01 .bs_cont .bs_txt .bs_icon p {border-top:1px #000 solid;letter-spacing: -0.027em;  text-align:center; margin:0 auto; margin-top:10px; padding-top:10px;  }

/*브랜드 철학 > section_02*/
.section_02 {z-index:3; padding:100px 0}
.section_02 .bs_cont {padding-top:0; overflow:inherit;}
.section_02 .bs_cont:after {content: ''; clear:both; display:block;}
.section_02 .bs_cont div.bs_img { float:left}
.section_02 .bs_cont div.bs_img img { width:100%}
.section_02 .bs_cont .bs_txt_wrap {float:left; height:610px;}
.section_02 .bs_cont div.bs_img {float:right; width:600px; }
.section_02 .bs_cont div.bs_img img {max-width:100%; width:100%; height:auto;}
.section_02 .bs_cont .bs_txt_wrap {width:500px; margin:0 70px 0 0;  box-sizing: border-box;   }
.section_02 .bs_txt_wrap h3.h3_tit {padding-top:130px;}

/*브랜드 스토리 > section03*/
.section_03 {position:relative; width:100%; height:670px; background: url(/layouts/bluebDesign_2019/image/content/brand_ph_visual_02.jpg) 50% 50% no-repeat; background-size: cover;}
.section_03 .bs_cont {position:relative; box-sizing: border-box; height:670px; color:#fff; padding:0; overflow: hidden;}
.section_03 .bs_cont div.bs_img {float:left; width:500px; height:670px;}
.section_03 .bs_cont div.bs_txt_wrap{float:right; width:670px;  margin:130px 0 0 0; padding-left:70px; box-sizing: border-box;}
.section_03 .bs_cont h3.h3_tit {color:#fff; padding-top:0;}
.section_03 .bs_cont h3.h3_tit:after {content: ''; background-color: #fff;}

/*브랜드 스토리 > section04*/
.section_04  {background: #f6f5f5; height:730px; box-sizing: border-box;}
.section_04 .bs_cont {padding:130px 0 0 0; position:relative; overflow:hidden; color:#373737;}
.section_04 .bs_cont div.bs_img, .section_02 .bs_cont .bs_txt_wrap {float:left;}
.section_04 .bs_cont div.bs_img {float:right; width:670px; height:430px;}
.section_04 .bs_cont .bs_txt_wrap {width:500px; height:430px; margin-right:70px; box-sizing: border-box;}
.section_04 .bs_cont h3.h3_tit {color:#373737;}
.section_04 .bs_cont h3.h3_tit:after {content: ''; background-color: #373737;}

/*버튼*/  
.section_04 .bs_cont .btn{ border:2px #000 solid; margin-top:50px; display:inline-block;width: 180px; text-align:center; height: 45px;line-height: 45px;}
.section_05 { padding:100px 0; background: url(/layouts/bluebDesign_2019/image/content/brand_ph_visual_01.jpg) 50% 50% no-repeat; background-size: cover; text-align:center}
.section_05 h4 { font-size:36px; color:#fff; margin-bottom:10px; font-weight:500} 
.section_05 p { color:#fff; margin-bottom:20px;}
.section_05 span { text-align: center;width: 180px;background-color: #f2c000; height: 45px;line-height: 45px;display: inline-block;margin: 0 auto;} 
  
  
  
.menutab { padding:50px 0}
.menutab { text-align:center}
.menutab  .menu_p { text-align:center; margin-top:20px}
.menutab #tabmenuBox { margin-bottom:50px; text-align:center}
.menutab #tabmenuBox ul { margin:0; padding:0;}
.menutab #tabmenuBox ul li { display:inline-block;  position:relative;   cursor:pointer ; text-align:center; margin-left:-4px}
.menutab #tabmenuBox ul li a {  height:45px; line-height:45px;  margin:0px 20px; width:150px;  display:block}
.menutab #tabmenuBox ul li::after{ position:absolute; right:0; top:3px; width:1px; height:30px; content:""; background-color:#ccc;}
.menutab #tabmenuBox ul li:last-child::after { display:none}
.menutab #tabmenuBox ul li:hover { background-color:#f2c000}
.menutab #tabmenuBox ul li.on  { background-color:#f2c000}
 
.noPlastic { height:650px; padding:50px 0 80px 0; background:#fcfCfc url(/layouts/bluebDesign_2019/image/content/page37-bg.png)  no-repeat center;}
  
/*서브레이아웃*/
.area_subVisual{overflow:hidden; height:450px; }
a.btn_quick{bottom:40px;}
.area_subVisual > div{width:100%; height:100%; animation:visualScale 7s; -webkit-animation:visualScale 7s;}
.area_subVisual h2,
.area_subVisual i{position:relative; opacity:0; top:50px; transition:all 0.6s ease-out;}
.area_subVisual h2.active,
.area_subVisual i.active{opacity:1; top:0;}
.area_subVisual i{display:block; line-height:1.7; margin-top:40px; font-weight:200; transition-delay:0.5s;}
.area_subVisual h2{font-weight:100; font-size:46px;}
.area_subVisual  a{position:absolute; bottom:40px; left:50%; margin-left:-36px; text-align:center;}
.area_subVisual  a img{animation:Mike 0.8s ease 0s infinite;}
.area_subVisual a em{display:block; margin-bottom:19px; font-size:12px; color:#fff; text-align:center; letter-spacing:5px;}
.inr_subVisual{position:absolute; top:43%; left:0; z-index:98; width:100%; color:#fff; text-align:center;}
  

.tableType1 {width:100%;border-collapse:separate;*border-collapse:collapse;border-spacing:0;table-layout:fixed;border-top:1px solid #ccc; margin-left:5px; border-left:1px #E6E6E6 solid;}
.tableType1 th {background:#ccc;border-bottom:1px solid #E6E6E6; text-align:left;line-height:18px; font-size:15px; color:#555; text-align:center;height:40px; padding:5px 0;border-right:1px #E6E6E6 solid;}
.tableType1 td {border-bottom:1px solid #E6E6E6;height:40px; padding:5px 0;line-height:18px;word-break:break-all;font-size:14px;color:#777; text-align:center; border-right:1px #E6E6E6 solid;}



























@media screen and (max-width:1000px) {
	.main_slide_txt{ display:none;}
	.main_slide_txt_1920{ display:block; position:absolute; left:20%; z-index:9; height:337px; top:50%; margin-top:-300px;}
	.main_slide_txt_1920 p{ font-size:20px; letter-spacing:-1px; margin-top:20px; line-height:25px;}
	.area_subVisual{ height:170px; }
	#content .snb .category h2 { top:65px; font-size:24px;}
	#content .snb .category h2 span { font-size:15px; margin-top:5px;}
	#content .snb .category ul { display:none}
	.lnbWrap { display:none}
	.inner { width:95%} 
	
	#wrap{ min-width:100%;}
	#header .gnbWrap { display:none;}
	#header{ background:#fff;} 
	#header .gnb { display:none;}
	#header .imglogo{ text-align:left; margin-left:20px;} 
	#searchFormView { display:none !important}
	/* Header :: 사이트맵, 네비게이션 버튼 */
	.header-line-btn{ display:block;position:absolute; top:50%; z-index:0; right:20px; margin-top:-20px; /* margin-top: button 크기의 1/2 px */
	width:40px; height:40px; -webkit-border-radius:50%;-moz-border-radius:50%;-o-border-radius:50%;border-radius:50%;	background-color:#404041;transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); -webkit-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);  	-oz-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715); -ms-transition:all 0.3s cubic-bezier(0.47, 0, 0.745, 0.715);}
	button {margin: 0px;padding: 0px;cursor: pointer;border: 0px;background: none;background-color: rgba(0, 0, 0, 0);}
	.header-line-btn .line{display:block; width:15px; height:2px; background-color:#fff; border-radius:5px; margin: 3px auto;-webkit-transition: all 0.3s ease-in-out; -o-transition: all 0.3s ease-in-out; transition: all 0.3s ease-in-out;}
	.header-line-btn.active .line{background-color:#fff;}
	.header-line-btn.active .line:nth-child(2), .header-line-btn.active .line:nth-child(4){opacity: 0;}
	.header-line-btn.active .line:nth-child(1){ -webkit-transform: translateY(6px) rotate(45deg); -ms-transform: translateY(6px) rotate(45deg); -o-transform: translateY(6px) rotate(45deg); transform: translateY(6px) rotate(45deg);}
	.header-line-btn.active .line:nth-child(3){ -webkit-transform: translateY(-6px) rotate(-45deg);  -ms-transform: translateY(-6px) rotate(-45deg);  -o-transform: translateY(-6px) rotate(-45deg);  transform: translateY(-6px) rotate(-45deg);}
	
	#footer { padding-top:10px !important}
	#footer .footerMenu { display:none}
	#footer .footerCont{ width:100%;}
	#footer .footerCont div.footerSiteInfo { text-align:center;  width:100%;}

#maincontent .mainsection04 .phototitle .photoBoxbtn { display:none}

.callbacks_nav.next {left: auto;right:10px;}
.callbacks_nav.prev {left: auto;left:10px;}
#slider4 li .visual-text h3 { font-size:36px}
#slider4 li .visual-text p { font-size:16px; width:50%; margin:20px  auto 0 auto; word-break:keep-all}

#maincontent .mainsection01 { margin-top:5%}
#maincontent .mainsection01 .boxbanner { margin:0px auto}
#maincontent .mainsection01 .boxbanner ul li a {  width:90%; padding:10% 5%;background-size:100% !important}
#maincontent .mainsection01 .bannerbg a { text-align:center; height:320px; padding-left:0px;}
#maincontent .mainsection02 { display:none}
#maincontent .mainsection03 { margin:50px 0}
#maincontent .mainsection03 .minibanner ul li { float:none; width:100%; margin-bottom:0px; padding:20px 0px;} 
#maincontent section h2  { font-size:20px;}
#maincontent section p { font-size:14px;}
#maincontent .mainsection04 { margin:0;}
#maincontent .mainsection01 .bannerbg a
.bannerbg { background-size:50% !important; background:#fff !important}


.fz_01 { font-size:20px; line-height:120%; word-break:keep-all}


#content .subContent { padding:30px; font-size:13px;}
#content .subContent inner img { width:100%}
#content .subContent h3.subTitleSubject { font-size:26px;}
#content .subContent .subtext { font-size:14px;}



.company-movie iframe { height:250px;}

.page30 .company-text h3 {  font-size:26px;}
.page30 .company-text h4 { font-size:20px;}
.page30 p { font-size:14px;}
.page30 img { width:100%}

.page31 .business-section.br .cellbox { width:100%}
.page31 .business-section.br .cellbox .thumb { float:none}
.page31 .business-section.br .cellbox .text { float:none}
.page31 .business img { width:100%}
.page31 .business-section.br .cellbox:nth-child(1):after, .business-section.br .cellbox:nth-child(3):after { bottom:0px;}
.page31 .business-section.br .cellbox:nth-child(2) .container:before { bottom:0px;}
.page31 .business-section.br .cellbox .title1:before { display:none}
.page31 .business-section.br .cellbox:nth-child(4) .container:before { display:none}
.page31 .business-section.br .cellbox:nth-child(4) .text { padding:9% 0;}
.page31 .business-section.br .cellbox:nth-child(2) .text { padding:9% 0;}
.page31 .business-section.br .cellbox .title1 { font-size:24px; line-height:130%; letter-spacing:-1px}
.page31 .business-section.br .cellbox .text p { font-size:14px; line-height:130%; letter-spacing:0px}

#page32 .areas-box .areas-text { width:90%; padding:5%}
#page32 .areas-box .areas-title h3 { font-size:24px;}
#page32 .areas-box .areas-title p { font-size:14px;}

.page33 .area_brand .vision-pic ul li { width:90%; padding:10% 5%}

.page34 .address_info { width:100%; padding:10% 5%; height:auto}

#page35 .Img { width:100%; float:none}
#page35 .Img img { width:100%; }
#page35 .cont { float:none; width:100%;}
#page35 .check { display:none}


.Cateringicon li {  width:150px; height:150px;  margin:20px;   }
.Cateringicon li::before { display:none}

.section01 img { width:90%}
.section01 .promise  .menu_tit { text-align:center}
.section01 .promise .bs_cont h2 { float:none; margin:10px 0 30px 0 ; text-align:center; line-height:110%}
.section01 .promise .bs_cont .bs_txt { width:100%}
.section01 .promise .bs_img { display:inline-block; padding:20px 0; margin-top:20px; width:100%}
 
.menutab #tabmenuBox ul li a { width:auto; margin:0 5PX	}
.menutab #tabmenuBox ul li::after {    top: 17px;     height: 10px;} 

.section_04 { padding-bottom:50px; height:auto}
.section_04 .bs_cont div.bs_img { float:none; width:100%; height:auto; margin-bottom:30px;}
.section_04 .bs_cont div.bs_img img { width:100%}
.section_04 .bs_cont .bs_txt_wrap { width:100%; height:auto; margin:0}
.section_05 h4 { font-size:20px;}

.bs_bg img{ width:100%}
.section_01 .bs_cont .bs_txt { width:90%}
.section_01 .bs_cont .bs_txt .bs_icon { width:90%; padding:20PX 0px;}
.div_contents img { width:90%}
.section_03 .bs_cont div.bs_txt_wrap{ padding:0; float:none; width:100%} 
.section03 .bs_txt ul li { width:100%; padding:5%; float:none; height:auto; margin:0 0 20px 0;}
.section03 .bs_txt ul li:before { background-image:none}
.section03 .bs_txt ul li > p { font-size:14px;}
.section04 .subWrapB .subSection,
.section04 .subWrapB .subSection img { width:90%}
.section05 .menu_material .mat_cont div.mat_img, .section05 .menu_material .mat_cont .mat_txt_wrap { float:none; width:100%}
.section05 .menu_material .mat_cont div.mat_txt_wrap { float:none; width:100%; margin:0}
.section06 .morestory ul li { float:none; margin:10px 0 ; width:100%; height:auto}



.section02 .foodmenu .menulist .menucont dl { margin:0; width:49%}
.section02 .foodmenu .menulist .menucont dl dt img { width:100px; height:100px;}
.section04 .subWrapB .subSection > h2 { font-size:18px}
.section04 .subWrapB .subSection > h3 { font-size:14px; line-height:140%; width:80%}
.section05 img { width:100%; margin-bottom:30px;}
.section05 .menu_material .mat_cont div.mat_img, .section05 .menu_material .mat_cont .mat_txt_wrap { height:auto;}



 
.noPlastic { height:auto; background: url(/layouts/bluebDesign_2019/image/content/page37-bg.png)  no-repeat bottom center; background-size:65%}
}

@media screen and (max-width:500px) {
	
#header .haccp_img {left:50%}	
	
	
}