body { background-color:#ffffff; font-family:'Nanum Gothic'} /*본문 스타일 시작 */ /* Header ------------------------------------------------------------------------------------------------------------------------------------- */ /* header layout */ #head_con { width:100%; height:110px; background:url(/resources/images/top_bg.png);} #head_con .gnb { width:1050px; height:110px; margin:0 auto; position:relative;} #head_con .gnb .logo { width:340px; height:80px; top:30px; left:0; position:absolute;} #head_con .gnb .logo a { width:340px; height:80px; background:url(/resources/images/logo.png); display:block;} #head_con .gnb .spot {top:0; right:0; position:absolute;} #head_con .gnb .spot ul li { float:left;} #head_con .gnb .spot ul li a { height:30px; display:block; padding:0 5px; font-size:11px; text-align:center; color:#FFFFFF; line-height:30px;} #head_con .gnb .spot ul .bgpink { background-color:#ed1a3b;} /* navigation menu group */ #menu { clear:both; width:700px; height:45px; top:65px; left:50%; margin-left:-180px; position:absolute; z-index:300;} #nav { list-style: none; height:45px;} #nav li { width:140px; height:45px; float:left; display:block; background: none; position: relative; text-align:center; font-size:14px;} #nav li a { display: block; zoom: 1;} #nav li a strong{ font-family:'Nanum Gothic'; font-size:15px; color:#3c3c3c; line-height:45px; text-align:center; cursor: pointer; height:45px; width:140px; display: inline-block;} #nav li a strong span { font-family:'Nanum Gothic'; font-size:15px; color:#3c3c3c; line-height:45px; text-align:center;} #nav li a#g_menu1 strong, #nav li a#g_menu2 strong, #nav li a#g_menu3 strong, #nav li a#g_menu4 strong, #nav li a#g_menu5 strong { background: url("/resources/images/menu_bg.png") no-repeat left top;} #nav li a:hover, #nav li a.hov strong { background-position:left bottom !important; font-weight:800; color:#FFFFFF;} #nav li a:hover strong span:hover { font-weight:800; color:#FFFFFF;} /* submenu group */ #nav ul { display: none; padding:10px 0 0 0; list-style: none; background-color:#ffffff; z-index:350; border-left:solid 1px #375066; border-right:solid 1px #375066; border-bottom:solid 1px #375066;} #nav ul li { font-family:'Nanum Gothic'; font-size:12px; width:140px; height:25px; float:left; text-align:left; } #nav ul li:hover { border-left:0px solid transparent; border-right: 0px solid transparent; } #nav ul a:link, #nav ul a:active, #nav ul a:visited { text-decoration: none; padding: 0 10px; display: block; height:25px; line-height: 20px; color: #000000; text-transform:uppercase; } #nav ul a:hover { color: #c70125; font-weight:bold; } #nav .subgrp01 { height:105px;} #nav .subgrp02 { height:105px;} #nav .subgrp03 { height:80px;} #nav .subgrp04 { height:105px;} #nav .subgrp05 { height:155px;}/* ����޴� 2�� : 50px, 3�� : 80px, 4�� : 105px, 5�� : 130px */ .shadow { -webkit-box-shadow: 0 0 30px 5px rgba(0, 0, 0, 0.3); /* Safari and Chrome */ -moz-box-shadow: 0 0 30px 5px rgba(0, 0, 0, 0.3); /* Firefox */ -ms-box-shadow: 0 0 30px 5px rgba(0, 0, 0, 0.3); /* CSS3 */ } /** @group clearfix **/ .clearfix:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0; } .clearfix { display: inline-block; } html[xmlns] .clearfix { display: block; } * html .clearfix { height: 1%; } /* index contetns ------------------------------------------------------------------------------------------------------------------------------------- */ /* index contents */ #wrap_index { width:100%; position:relative; background:url(/resources/images/main_mid_bg.jpg) repeat-x top; } #wrap_index .index_visual { max-width:1300px; height:410px; margin:0 auto; padding:0; position:relative; font-size:0; line-height:0; background:url(/resources/images/visual_bg.jpg) no-repeat center;} #wrap_index .index_visual .mslogan { width:338px; height:180px; position:absolute; top:70px; left:170px; z-index:200; } #wrap_index .index_visual .mslogan img { width:100%; height:100%;} #wrap_index .index_visual .main_ben {width:404px; height:60px; position:absolute; bottom:80px; left:50%; margin-left:-470px; z-index:200;} #wrap_index .index_visual .quickben { position:relative;} #wrap_index .index_visual .quickben .qben { width:200px; height:60px; margin:1px; padding:0; line-height:0; float:left;} #wrap_index .index_visual .quickben .qben a { width:200px; height:60px; display:block; } #wrap_index .index_visual .quickben .qben .qbtn01:link, #wrap_index .index_visual .quickben .qben .qbtn01:active, #wrap_index .index_visual .quickben .qben .qbtn01:visited { background:url("/resources/images/q_ben01.png") no-repeat top; } #wrap_index .index_visual .quickben .qben .qbtn02:link, #wrap_index .index_visual .quickben .qben .qbtn02:active, #wrap_index .index_visual .quickben .qben .qbtn02:visited { background:url("/resources/images/q_ben02.png") no-repeat top; } #wrap_index .index_visual .quickben .qben .qbtn01:hover, #wrap_index .index_visual .quickben .qben .qbtn02:hover { background-position:bottom; } #wrap_index .index_visual .main_btn01 { width:400px; height:70px; position:absolute; top:190px; left:190px; z-index:200; } #wrap_index .index_visual .main_btn02 { width:400px; height:70px; position:absolute; top:270px; left:190px; z-index:200; } #wrap_index .index_visual .mbtn:link, #wrap_index .index_visual .mbtn:visited, #wrap_index .index_visual .mbtn:active { width:400px; height:70px; display:block; line-height:65px; color:#ffffff; font-size:25px; font-weight:800; text-align:center; border:solid 3px #ffffff; box-sizing:border-box;} #wrap_index .index_visual .btnbg01 {background-color:#c70125;} #wrap_index .index_visual .btnbg02 {background-color:#4074e1;} #wrap_index .index_visual .btnbg01:hover { background-color:#6a0013;} #wrap_index .index_visual .btnbg02:hover { background-color:#13357b;} /* index_visual slied */ #slides { display: none; width:1300px; height:410px;} #slides img { margin:0 auto; } #slides .slidesjs-navigation { margin-top:0;} #slides .slidesjs-previous { display:none;} #slides .slidesjs-next {display:none;} #slides a.slidesjs-play, a.slidesjs-stop { background: url(/resources/images/btns-next-prev.png) no-repeat; display:block; width:12px; height:18px; overflow:hidden; position:absolute; bottom:25px; left:190px; z-index:500; text-indent:900px; }/*���,���� ��ư ����*/ #slides a.slidesjs-play { width:15px; background-position:-25px 0; } #slides a:hover.slidesjs-play { background-position:-25px -18px; } #slides a.slidesjs-stop { width:18px; background-position: -41px 0; } #slides a:hover.slidesjs-stop { background-position: -41px -18px;} #slides .slidesjs-pagination { bottom:25px; left:220px; position:absolute; list-style:none; z-index:500;} #slides .slidesjs-pagination li { float:left; margin:0 2px;} #slides .slidesjs-pagination li a { display:block; width:16px; height:0; padding-top:20px; background-image:url(/resources/images/pagination.png); background-position:0 0; float:left; overflow:hidden;}/* ��ư ������ ���� */ #slides .slidesjs-pagination li a.active, .slidesjs-pagination li a:hover.active { background-position: 0 -20px } #slides .slidesjs-pagination li a:hover {background-position:0 -40px } /* index Middle contetns */ #wrap_index .mcon { width:1050px; margin:0 auto; } #wrap_index .mcon .contents { width:1050px; height:300px; position:relative; margin:20px 0; } #wrap_index .mcon .contents .mbr { border-right:solid 2px #ebebeb;} #wrap_index .mcon .contents .mbb { border-bottom:solid 2px #ebebeb;} #wrap_index .mcon .contents .mbl { border-left:solid 2px #ebebeb;} #wrap_index .mcon .contents .mbt { border-top:solid 2px #ebebeb;} #wrap_index .mcon .contents .mbr2 { border-right:solid 4px #ebebeb;} #wrap_index .mcon .contents .mbb2 { border-bottom:solid 4px #ebebeb;} #wrap_index .mcon .contents .mbl2 { border-left:solid 4px #ebebeb;} #wrap_index .mcon .contents .mbt2 { border-top:solid 4px #ebebeb;} #wrap_index .mcon .contents .conbox { width:350px; height:150px; float:left; background-color:#FFFFFF; box-sizing:border-box; position:relative;} #wrap_index .mcon .contents .conbox .mcon { width:350px; height:150px; position:relative; background:} #wrap_index .mcon .contents .conbox .mcon .btn_more01 { width:11px; height:11px; position:absolute; top:20px; left:80px; z-index:10;} #wrap_index .mcon .contents .conbox .mcon .btn_more02 { width:11px; height:11px; position:absolute; top:20px; left:100px; z-index:10;} #wrap_index .mcon .contents .conbox .mbg01 { background:url(../images/mben_bg01.png) no-repeat top; } #wrap_index .mcon .contents .conbox .mbg02 { background:url(../images/mben_bg02.png) no-repeat top; } #wrap_index .mcon .contents .conbox .mbg03 { background:url(../images/mben_bg03.png) no-repeat top; } #wrap_index .mcon .contents .conbox .mbg04 { background:url(../images/mben_bg04.png) no-repeat top; } #wrap_index .mcon .contents .conbox .mbg01:hover, #wrap_index .mcon .contents .conbox .mbg02:hover, #wrap_index .mcon .contents .conbox .mbg03:hover, #wrap_index .mcon .contents .conbox .mbg04:hover { background-position:bottom;} #wrap_index .mcon .contents .conbox .mcon .mcon_tit01 { width:310px; height:20px; position:absolute; top:15px; left:15px; line-height:20px; font-size:16px; font-weight:700; z-index:10; } #wrap_index .mcon .contents .conbox .mcon .mcon_tit01 .mtco01 { color:#ba0628;} #wrap_index .mcon .contents .conbox .mcon .mcon_tit02 { width:310px; height:20px; position:absolute; top:17px; left:15px; line-height:20px; font-size:16px; font-weight:700; z-index:10; } #wrap_index .mcon .contents .conbox .mcon .mcon_tit02 .mtco02 { color:#022e65;} #wrap_index .mcon .contents .conbox .mcon .mcon_tit02 .mtco03 { color:#4c3d00;} #wrap_index .mcon .contents .conbox .mcon .mcon_tit02 .mtco04 { color:#871800;} #wrap_index .mcon .contents .conbox .mcon .mcon_tit02 .mtco05 { color:#00504a;} #wrap_index .mcon .contents .conbox .mcon .mcon_txt01 { width:320px; height:88px; position:absolute; top:45px; left:15px; } #wrap_index .mcon .contents .conbox .mcon .mcon_txt02 { width:220px; position:absolute; top:55px; left:15px; color:#ffffff; font-weight:bold; } #wrap_index .mcon .contents .conbox .mcon .mcon_txt03 { width:210px; position:absolute; top:55px; left:15px; color:#ffffff; font-weight:bold; } #wrap_index .mcon .contents .conbox .mcon .mcon_txt04 { width:225px; position:absolute; top:55px; left:15px; color:#ffffff; font-weight:bold; } #wrap_index .mcon .contents .conbox .mcon .mcon_txt05 { width:220px; position:absolute; top:55px; left:15px; color:#ffffff; font-weight:bold; } #wrap_index .mcon .contents .conbox .mcon .mcon_txt06 { width:320px; position:absolute; top:20px; left:15px; } #wrap_index .mcon .contents .conbox .mcon .board01 { width:320px; height:88px; } #wrap_index .mcon .contents .conbox .mcon .board01 li { width:310px; height:22px; background:url(/resources/images/n_dot.png) no-repeat left center; padding-left:10px; line-height:22px; font-family:"Nanum Gothic"; font-size:12px; color:#898989; position:relative; } #wrap_index .mcon .contents .conbox .mcon .board01 li:link, #wrap_index .mcon .contents .conbox .mcon .board01 li:active, #wrap_index .mcon .contents .conbox .mcon .board01 li:visited { color:#8e8e8e; text-decoration:none;} #wrap_index .mcon .contents .conbox .mcon .board01 li:hover { color:#000; text-decoration:none; background-color:#ffdfdf;} #wrap_index .mcon .contents .conbox .mcon .board01 li span { width:70px; height:22px; line-height:24px; display:block; position:absolute; right:0; top:0;} #wrap_index .mcon .contents .conbox .mcon .food { width:320px;} #wrap_index .mcon .contents .conbox .mcon .food .nowdate { margin-bottom:6px; height:12px; line-height:12px; text-align:right; font-weight:bold; color:#9f1313; } #wrap_index .mcon .contents .conbox .mcon .food .fd_list { height:32px; line-height:16px; font-size:11px;} #wrap_index .mcon .contents .conbox .mcon .food .fd_list div { height:30px; padding-left:45px; padding-top:2px; line-height:28px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap;} #wrap_index .mcon .contents .conbox .mcon .food .fd_list .ico_bf { background:url(/resources/images/icon_bre.jpg) no-repeat left; } #wrap_index .mcon .contents .conbox .mcon .food .fd_list .ico_lh { background:url(/resources/images/icon_lun.jpg) no-repeat left; } #wrap_index .mcon .contents .conbox .mcon .food .fd_list .ico_dn { background:url(/resources/images/icon_din.jpg) no-repeat left; } #wrap_index .mcon .contents .conbox .mcon .food .linedot { background:url(/resources/images/line_dot.png) repeat-x bottom;} #all_class { width:100%; height:100%; background:url(/resources/images/poplayer_bg.png); position:fixed; top:0; left:0; z-index:999;} #all_class .classbox { width:1000px; height:760px; position:absolute; left:50%; margin-left:-500px; top:40px; background-color:#FFFFFF; border:solid 2px #c8c8c8; padding:10px;} #all_class .classbox .allclass_tit { width:100%; height:50px; line-height:50px; font-size:25px; color:#ffffff; text-align:center; background-color:#7d0101; } #all_class .close { position:absolute; right:50px; bottom:50px; z-index:110;} /* Sub contetns ------------------------------------------------------------------------------------------------------------------------------------- */ /* Sub layout */ #wrap_sub{ width:100%; padding-bottom:50px; position:relative; background-color:#FFFFFF;} #wrap_sub .midS { width:100%; height:140px; position:absolute; top:0; left:0; background:url(/resources/images/smid_bg.jpg) center; } #wrap_sub .scon { width:1050px; margin:0 auto; position:relative;} #wrap_sub .scon .leftcon { width:220px; position:absolute; top:44px; left:0; background:#fff7ec;} #wrap_sub .scon .leftcon .leftTitle { width:220px; height:80px; background-color:#2b3747; position:relative;} #wrap_sub .scon .leftcon .leftTitle li { position:absolute; } #wrap_sub .scon .leftcon .leftTitle .txtkor { width:205px; height:25px; top:20px; left:15px; font-size:20px; color:#ffffff; line-height:25px; font-weight:800; } #wrap_sub .scon .leftcon .leftTitle .txteng { width:205px; height:10px; top:50px; left:15px; font-size:10px; color:#ffffff; line-height:10px; } #wrap_sub .scon .leftcon .leftMenu { width:190px; margin:0 auto; padding-top:16px; padding-bottom:78px; } #wrap_sub .scon .leftcon .leftMenu li a { font-size:13px; text-indent:20px; line-height:30px; width:190px; height:31px; display:block;} #wrap_sub .scon .leftcon .leftMenu li .leftm:link,.leftm:active,.leftm:visited { color:#4c4c4d; background:url(/resources/images/leftm_bg.png) no-repeat top;} #wrap_sub .scon .leftcon .leftMenu li .leftm:hover, #wrap_sub .scon .leftcon .leftMenu li .over { color:#ffffff; background-position:bottom !important;} #wrap_sub .scon .leftcon .leftBot { width:220px; background-color:#fff7ec;} #wrap_sub .scon .leftcon .leftBot .quickben { width:201px; height:162px; margin:0 9px 10px 10px; position:relative; background:url(/resources/images/sqben_bg.png); } #wrap_sub .scon .leftcon .leftBot .quickben .sqben { width:100px; height:40px; float:left;} #wrap_sub .scon .leftcon .leftBot .quickben .sqben a { width:100px; height:40px; display:block; } #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn01:link, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn01:active, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn01:visited { background:url("/resources/images/q_sben01.png") no-repeat top; } #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn02:link, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn02:active, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn02:visited { background:url("/resources/images/q_sben02.png") no-repeat top; } #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn03:link, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn03:active, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn03:visited { background:url("/resources/images/q_sben03.png") no-repeat top; } #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn04:link, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn04:active, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn04:visited { background:url("/resources/images/q_sben04.png") no-repeat top; } #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn05:link, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn05:active, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn05:visited { background:url("/resources/images/q_sben05.png") no-repeat top; } #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn06:link, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn06:active, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn06:visited { background:url("/resources/images/q_sben06.png") no-repeat top; } #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn07:link, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn07:active, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn07:visited { background:url("/resources/images/q_sben07.png") no-repeat top; } #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn08:link, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn08:active, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn08:visited { background:url("/resources/images/q_sben08.png") no-repeat top; } #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn01:hover, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn02:hover, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn03:hover, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn04:hover, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn05:hover, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn06:hover, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn07:hover, #wrap_sub .scon .leftcon .leftBot .quickben .sqben .sqbtn08:hover { background-position:bottom; } #wrap_sub .scon .leftShadow { width:50px; height:410px; top:0; left:220px; background:url(/resources/images/left_shadow.png) no-repeat; position:absolute;} #wrap_sub .scon .rightcon { width:780px; margin-left:270px;} #wrap_sub .scon .rightcon .conTop { width:780px; height:140px; margin-bottom:60px;} #wrap_sub .scon .rightcon .conTop .subTitle { width:700px; height:80px; font-size:35px; line-height:80px; text-indent:10px; color:#2b3747; font-weight:bold;} #wrap_sub .scon .rightcon .conTop .root { width:780px; height:30px; position:relative;} #wrap_sub .scon .rightcon .conTop .root .root_txt { height:18px; margin-top:5px; line-height:20px; text-align:right; font-size:11px; color:#686767; float:right;} #wrap_sub .scon .rightcon .conTop .root .root_txt img { margin-top:-2px;} #wrap_sub .scon .rightcon .subcon { min-height:400px; margin-top:30px;} #wrap_sub .scon .rightcon .subcon .sample { text-align:center; padding-top:100px; font-size:20px; font-weight:bold;} /* Footer ------------------------------------------------------------------------------------------------------------------------------------- */ /* bot_con*/ #bot_con { width:1050px; height:45px; margin:0 auto; position:relative; } /* footer layout */ #foot_con { width:100%; height:100px; background-color:#7c8497; position:relative; z-index:10;} #foot_con .bot { width:1050px; height:100px; position:relative; margin:0 auto;} #foot_con .bot .copyright { width:650px; height:40px; position:absolute; top:50%; margin-top:-20px; left:0; } #foot_con .bot .copyright li { width:100%; height:20px; line-height:20px; color:#ffffff; } #foot_con .bot .bot_btn { width:360px; height:46px; position:absolute; top:10px; right:0; } #foot_con .bot .bot_btn .bot_button { width:360px; height:46px; position:relative; } #foot_con .bot .bot_btn .bot_button li { width:120px; height:46px; float:left;} #foot_con .bot .bot_btn .bot_button li .b_btn:link, #foot_con .bot .bot_btn .bot_button li .b_btn:active, #foot_con .bot .bot_btn .bot_button li .b_btn:visited { width:110px; height:46px; display:block; text-align:center; font-size:12px; color:#ffffff; line-height:46px;} #foot_con .bot .bot_btn .bot_button li .b_btn:hover { color:#c70125;} #foot_con .bot .Fsite { width:130px; height:18px; bottom:20px; right:10px; position:absolute;} /* Sitemap */ #foot_con .allmenu{ display:none; position:absolute; left:0; bottom:100px; width:100%; height:285px; background:#fef5f7; z-index:550; border-top:solid 1px #c0c0c0;} #foot_con .allmenu .closemap { position:absolute; right:20px; bottom:245px;} #foot_con .allmenu .amenu {position:relative; width:800px; left:50%; margin-left:-500px;} #foot_con .allmenu .amenu .m_li {float:left; width:160px; margin-top:10px;} #foot_con .allmenu .amenu .m_li .rline { border-right:solid 1px #d3d6d6;} #foot_con .allmenu .amenu .m_li ul{ width:159px; height:220px; margin-top:10px; } #foot_con .allmenu .amenu .m_li ul li b { width:159px; display:block; font-size:13px; color:#8c0000; margin-bottom:5px; text-align:center; margin-bottom:10px;} #foot_con .allmenu .amenu .m_li ul .smemu { margin-left:10px; width:149px;} #foot_con .allmenu .amenu .m_li ul li a {color:#5a5a5a; line-height:25px; margin-left:0;} #foot_con .allmenu .amenu .m_li ul li a:hover{color:red;} #foot_con .allmenu .amenu .bg_img { width:340px; height:230px; position:absolute; left:50%; top:30px; margin-left:350px; background:url(/resources/images/sitemap_img.png) no-repeat;} /* Site Link*/ #siteLink01 { position:absolute; top:-70px; display:none; z-index:999; } #siteLink01 .fam { width:150px; padding:5px; border:solid 1px #aaa; background-color:#383838; text-align:left; list-style:none;} #siteLink01 .fam a:link, #siteLink01 .fam a:active, #siteLink01 .fam a:visited { font-size:11px; color:#ffffff; text-decoration:none;} #siteLink01 .fam a:hover { color:#f84566;} /* ------------------------------------------------------------------------------------------------------------------------------------- */ /* go to Top */ #quick { top:320px; right:0; width:70px; position:fixed;} #quick .top {width:70px; height:30px; background:url(/resources/images/top.png) no-repeat; display:block;}