@charset "utf-8"; /* layout.css는 전체적인 레이아웃 스타일을 정의합니다. */ #skipToContent a {z-index:100000;position:absolute;top:0;left:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden} #skipToContent a:focus, #skipToContent a:active {width:200px;height:50px;background:#21272e;color:#fff;font-size:14px;font-weight:bold;text-align:center;text-decoration:none;line-height:50px} .contain {*zoom:1; width:1200px; margin:0 auto;} .contain:after {content:" "; display:block; clear:both;} body.bg {background:#222} #wrapper {background:#fff;} /* header */ #header {height:135px; background:url('../images/common/bg_top.gif') 0 0 repeat-x;} #header .contain {position:relative; z-index:999;} #header .logo {position:absolute; top:75px; left:0; z-index:999} #header .top-bar {height:45px;} #header .util {position:absolute; top:0; right:-20px} #header .util li {float:left; position:relative; padding:0 20px; color:#303030; vertical-align:middle; font-size:14px; line-height:45px;} #header .util li:first-child:after {display:none;} #header .util li:after {content:"";position:absolute; top:50%; margin-top:-6px; left:0; width:1px; height:12px; background:#d2d2d2;} #header .util li strong {font-size:15px; font-weight:500; color:#30539f; padding-right:10px;} #header .util li img {vertical-align:middle; padding-right:10px;} #gnb {*zoom:1; margin-right:-80px;} #gnb:after {content:" "; display:block; clear:both;} #gnb > ul {float:right;} #gnb > ul > li {float:left; position:relative; text-align:center;font-size:19px; line-height:90px; padding:0 80px; font-weight:500;} #gnb > ul > li:first-child:after {display:none;} #gnb > ul > li:after {content:"";position:absolute; top:50%; margin-top:-5px; left:0; width:1px; height:10px; background:#d2d2d2;} #gnb > ul > li > a {display:block; color:#454545;} #gnb > ul > li.active > a {color:#3a5ba3;} #gnb .submenu {display:none; position:absolute; top:90px; left:0; width:100%; z-index:102} #gnb .submenu ul {float:none;} #gnb .submenu ul li {float:none; font-size:16px; line-height:60px; text-align:center; padding:0;font-weight:500;} #gnb .submenu ul li a {display:block; color:#454545; background:#f3f3f4;} #gnb .submenu ul li a:hover, #gnb .submenu ul li.on a {color:#fff; background:#3a5ba3} /* #gnb ul li.m1 div.submenu {left:10px;} */ /* main */ .main-visual {position:relative; width:100%; height:500px; overflow:hidden;} .main-visual .inner {position:absolute; top:0; left:50%; width:1920px; height:500px; margin-left:-960px; z-index:10} .main-visual .bx-wrapper .bx-pager {position:absolute; bottom:160px; left:0; width:100%; z-index:100; text-align:center; } .main-visual .bx-wrapper .bx-pager .bx-pager-item, .main-visual .bx-wrapper .bx-controls-auto .bx-controls-auto-item {display:inline-block;*zoom: 1; *display: inline; vertical-align:middle; } .main-visual .bx-wrapper .bx-pager.bx-default-pager a {background:transparent; border:2px solid #fff; width:8px; height:8px; text-indent: -9999px; display:block; margin:0 4px; outline: 0; border-radius:50%;overflow:hidden;} .main-visual .bx-wrapper .bx-pager.bx-default-pager a:hover, .main-visual .bx-wrapper .bx-pager.bx-default-pager a.active {background:#fff;} .main-bnr {*zoom:1;width:1200px; position:relative; margin:-120px auto 60px; z-index:12} .main-bnr ul:after {content:" "; display:block; clear:both;} .main-bnr ul li {float:left; width:33.333%; height:180px; background-repeat:no-repeat; background-position:40px 50%;} .main-bnr ul li.bg1 {background-color:#41adde; background-image:url('../images/main/icon1.png');} .main-bnr ul li.bg2 {background-color:#0280c9; background-image:url('../images/main/icon2.png');} .main-bnr ul li.bg3 {background-color:#30539f; background-image:url('../images/main/icon3.png');} .main-bnr ul li .info {padding-left:180px; display:table; height:180px; color:#fff} .main-bnr ul li .info dl {width:100%; display:table-cell; vertical-align:middle;} .main-bnr ul li .info dl dt {font-size:18px; line-height:1.7em; font-weight:500; margin-bottom:10px;} .main-bnr ul li .info dl dd {font-size:15px; line-height:1.7em;} .main-title {text-align:center; margin-bottom:40px;} .main-title h2 {font-size:28px; line-height:1.6em; font-weight:700; color:#333;} .main-title p {color:#656565; font-size:17px;line-height:1.6em;} .main-price {margin:0 -10px 80px; overflow:hidden;} .main-price:after{content:"";display:block;clear:both;} .main-price .col {float:left; width:50%; padding:0 10px; box-sizing:border-box; margin-bottom:20px;} .main-price .col:nth-child(2n+1) {clear:left;} .main-table.type2 table thead th {background:#0280c9} .main-table table {width:100%; border-collapse:collapse; border-spacing:0px;} .main-table table thead th {padding:9px 10px; height:35px; font-size:22px; font-weight:500; line-height:22px; color:#fff; background:#30539f} .main-table table tbody th {padding:9px 10px; height:35px; font-size:16px; font-weight:500; line-height:22px; color:#333; border-bottom:1px solid #d6d6d6; background:#eaeef4;} .main-table table tbody td {padding:9px 20px; color:#2c2c2c; font-size:16px; line-height:22px; border-bottom:1px solid #d6d6d6; background:#f8f8f8} .main-table table tbody th.none,.main-table table tbody td.none {border-bottom:0} .main-table .f-back {background-color:#e62b2b; color:#fff; } .main-table strong {font-weight:500} .main-service {background:url('../images/main/bg_bnr.jpg') 50% 0 no-repeat; width:100%; height:330px;} .main-service .col {float:left; width:50%; height:330px; display:table; text-align:center;} .main-service .col .link {width:600px; height:330px; display:table-cell; vertical-align:middle; color:#fff;} .main-service .col .link dl dt {font-size:30px; line-height:1.4em; font-weight:500; margin-bottom:5px;} .main-service .col .link dl dd {font-size:17px; line-height:1.4em; margin-bottom:20px;} .main-service .col .link .more {font-size:15px; line-height:1.4em; opacity:.8} .main-service .col .link .more .arrow {margin:0 3px;position:relative;border: solid #ddd;border-width: 0 2px 2px 0;transform: rotate(-45deg);display: inline-block;padding: 3px;} .main-service .col a {display:block;} .main-notice {background:#f5f5f5; padding:60px 0;} .main-notice .title {float:left; width:511px; height:276px; color:#fff; background:url('../images/main/bg_notice.gif') 0 0 no-repeat;} .main-notice .title dl {padding:50px} .main-notice .title dl dt {font-size:32px; line-height:1.4em; font-weight:500; margin-bottom:5px;} .main-notice .title dl dd {font-size:16px; line-height:1.4em; color:#cbcfd9;} .main-notice .list {float:left; width:688px; height:276px; background:#fff; border:1px solid #ddd; border-left:0; box-sizing:border-box;} .main-notice .list ul {padding:15px 40px 0;} .main-notice .list ul li {font-size:16px; line-height:49px; height:49px; border-bottom:1px solid #ddd; position:relative;} .main-notice .list ul li:last-child {border-bottom:0} .main-notice .list ul li a {display:inline-block; width:500px; height:49px; white-space:nowrap;overflow:hidden;text-overflow:ellipsis; } .main-notice .list span {position:absolute; top:0; right:0; font-size:14px; color:#959595;} /* sub page */ #sub #container {*zoom:1; width:1200px; margin:0 auto; overflow:hidden;} #sub #container:after {content:" "; display:block; clear:both;} .sub-visual {position:relative; height:290px; overflow:hidden;} .sub-visual .inner {position:absolute; top:0; left:50%; width:1920px; height:290px; margin-left:-960px;} #lnb {float:left; width:250px;} #lnb .titlebox {width:250px; height:169px; display:table; background:#f3f5f9; border:1px solid #dce2ec; border-top:0; box-sizing:border-box;} #lnb .title {position:relative;color:#30539f; font-size:25px; line-height:50px; font-weight:700; text-align:center; width:210px; height:100px; padding-top:13px; display:table-cell; vertical-align:middle;} #lnb .title:after{content:""; position:absolute; top:70px; left:50%; margin-left:-10px; width:20px; height:3px; background:#333333;} .lnb {margin-bottom:50px;} .lnb ul li {font-size:17px; line-height:60px; border-bottom:1px solid #ececec; transition:none;} .lnb ul li a {display:block; color:#4d4d4d; padding-left:24px;} .lnb ul li a:hover, .lnb ul li.on a {color:#fff; background:url('../images/common/menu_on.gif') 0 0 no-repeat;} .lnb-bnr .col {margin-bottom:8px; line-height:0} #contArea {float:right; width:900px; overflow:hidden;} .sub-title {position:relative; height:109px; border-bottom:1px solid #dfdfdf; margin-bottom:60px;} .sub-title h2 {color:#2c2c2c; font-size:27px; line-height:30px; font-weight:500; padding-top:45px;} .sub-title .path {position:absolute; top:60px; right:0; color:#ccc; font-size:14px; line-height:18px;} .sub-title .path .home {position:relative; display:inline-block;zoom:1;*display:inline; vertical-align:top; margin:-0.2em 0 0 0; width:8px; height:18px; font-size:0; line-height:0; text-indent:-9999px; background:url('../images/common/home.gif') 50% 50% no-repeat;} .sub-title .path .arrow {margin:0 3px;position:relative;top:-2px;border: solid #ccc;border-width: 0 1px 1px 0;transform: rotate(-45deg);display: inline-block;padding: 3px;} .real-cont {min-height:450px; _height:450px; padding:0 0 100px;} /* footer */ #footer {clear:both; padding:60px 0; background:#222;} #footer address {font-style:normal;} #footer .contain {position:relative;} #footer .bar {display:inline-block; background:#fff; vertical-align:middle; width:1px; height:10px; margin:0 10px;} .foot-logo {position:absolute; top:10px; left:0;} .foot-info {color:#fff; font-size:14px; line-height:22px; padding:0 0 0 240px; font-weight:300; opacity:.6;} .quick-top {position:fixed; bottom:185px; right:30px; z-index:100}