@charset "utf-8";

/* ========================
    NanumGothic fonts
   ======================== */

@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);

/* ========================
    reset
   ======================== */

body,div,dl,dt,dd,form,input,label,img,p,span,ul,ol,li,h1,h2,h3,h4,h5,h6{margin:0;padding:0;}
body{font:16px/1 "Nanum Gothic","Helvetica Neue",Helvetica,Arial,malgun gothic,Dotum,sans-serif;word-wrap:break-word;word-break:normal;-webkit-text-size-adjust:none;color:#717171;}
html,body{height:100%;}
ol,ul{list-style:none;}
h1,h2,h3,h4,h5,h6{font-size:100%;}
em,i{font-style:normal;}
img{border:none;vertical-align:top;}
a{color:#7f7f7f;text-decoration:none;outline:none;background:transparent;-webkit-tap-highlight-color:transparent;}
a:hover{color:#000;text-decoration:none;}
input,button,textarea,select,option{font:16px/1 "Nanum Gothic","Helvetica Neue",Helvetica,Arial,malgun gothic,Dotum,sans-serif;outline:none;color:#363636;}
table{border-collapse:collapse;border-spacing:0;}

/* ========================
    common
   ======================== */

.fl{float:left;}
.fr{float:right;}
.container{width:1026px;margin:0 auto;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
.container:before,.clear:before{content:"";display:block;}
.container:after,.clear:after{clear:both;content:"";display:table;}
.app-none{-moz-appearance:none;-ms-appearance:none;-webkit-appearance:none;appearance:none;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;}

/* ========================
    header
   ======================== */

.nav-btn{display:none;}
.login-btn{display:none;}
.top-bar{height:61px;line-height:61px;background:#003876;color:#fff;font-size:16px;text-align:right;}
.top-bar span{width:1px;height:19px;display:inline-block;font-size:0;background:#fff;color:#fff;vertical-align:middle;margin:-2px 22px 0;}
.top-bar a{color:#fff;}
.nav-bar{height:106px;border-bottom:8px solid #223387;}
.nav-bar .container{position:relative;}
.nav-bar .logo{width:382px;height:114px;position:absolute;left:0;top:0;background:#fff;}
.nav-bar .logo img{margin:39px auto 0;display:block;}
.nav-bar .nav{float:right;margin:46px -20px 0 0;font-size:0;}
.nav-bar .nav .nav-title{display:none;}
.nav-bar .nav-item > ul{font-size:19px;display:inline-block;position:relative;margin-left:40px;}
.nav-bar .nav-item > ul span{display:inline-block;padding:15px 23px;border-top-left-radius:4px;border-top-right-radius:4px;color:#484848;font-weight:bold;letter-spacing:-1px;}
.nav-bar .nav-item .nav-menu:hover span a { color:#fff;}
.nav-bar .nav-item li ul{position:absolute;left:0;top:49px;width:100%;z-index:100;font-size:14px;background:#f1f1f1;padding:5px;border-bottom-left-radius:4px;border-bottom-right-radius:4px;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;display:none;}
.nav-bar .nav-item li ul a{width:100%;height:30px;line-height:30px;display:block;text-indent:10px;}
.nav-bar .nav-item > ul span.on{background:#003876;color:#fff;}
.nav-bar .nav-item span + ul a:hover{background:#fff;-webkit-border-radius:4px;-moz-border-radius:4px;border-radius:4px;}
.top-login{display:none;}
.top-login-bg{display:none;}

@media only screen and (max-width:1026px) {
    .container{width:100%;}
    .nav-btn{width:46px;height:38px;position:absolute;left:9px;top:16px;text-align:center;line-height:10px;z-index:1;cursor:pointer;display:block;}
    .nav-btn span{width:32px;height:5px;display:inline-block;font-size:0;background:#233387;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;}
    .nav-btn span:first-child{margin-top:6px;}
    .login-btn{display:block;font-size:0;position:absolute;right:8px;top:16px;width:46px;height:38px;text-align:center;cursor:pointer;}
    .login-btn span{width:6px;height:6px;background:#233387;display:inline-block;margin:15px 3px 0;}
    .top-bar{background:none;height:70px;}
    .nav-bar{width:100%;height:70px;position:absolute;left:0;top:0;z-index:100;border-bottom:none;}
    .nav-bar .logo{position:absolute;left:50%;top:-25px;margin-left:-100px;background:none;width:auto;height:auto;}
    .nav-bar .logo img{width:200px;}
    .nav-bar .nav{float:none;background:#fff;position:absolute;width:100%;left:0;top:-52px;z-index:2;padding:6px 0 0;-webkit-box-shadow:0 3px 4px rgba(0,0,0,.4);-moz-box-shadow:0 3px 4px rgba(0,0,0,.4);box-shadow:0 3px 4px rgba(0,0,0,.4);display:none;}
    .nav-bar .nav .nav-title{color:#000;font-size:16px;height:50px;line-height:50px;border-bottom:2px solid #223387;text-indent:15px;display:block;}
    .nav-bar .nav .nav-title em img{height:30px;float:right;margin:10px 15px 0 0;cursor:pointer;}
    .nav-bar .nav-item{height:300px;background:#e6e6e6;}
    .nav-bar .nav-item > ul{font-size:16px;margin-left:0;width:100%;position:static;}
    .nav-bar .nav-item > ul > li{width:100%;height:100%;}
    .nav-bar .nav-item > ul span{padding:15px 15px;border-top-left-radius:0;border-top-right-radius:0;font-weight:bold;width:35%;float:left;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}
    .nav-bar .nav-item li ul{width:65%;height:300px;position:absolute;left:35%;top:58px;font-size:16px;padding:0;border-bottom-left-radius:0;border-bottom-right-radius:0;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;background:#fff;display:none;}
    .nav-bar .nav-item li ul a{height:40px;line-height:40px;text-indent:15px;border-bottom:1px solid #a3a3a3;}
    .nav-bar .nav-item > ul:hover ul{display:block;}
    .nav-bar .nav-item > ul:hover span + ul a:hover{background:#efefef;-webkit-border-radius:0;-moz-border-radius:0;border-radius:0;}
    .top-login{width:100%;height:320px;position:absolute;left:0;top:0;background:#fff;z-index:102;-webkit-box-shadow:0 3px 4px rgba(0,0,0,.4);-moz-box-shadow:0 3px 4px rgba(0,0,0,.4);box-shadow:0 3px 4px rgba(0,0,0,.4);text-align:center;}
    .top-login h2{padding:30px 0 20px;}
    .top-login h2 img{height:50px;}
    .top-login input[type=text],.top-login input[type=password]{width:278px;height:16px;line-height:16px;padding:10px 0;text-indent:10px;border:1px solid #b5b5b5;margin:15px auto 0;display:block;font-size:14px;color:#000;}
    .top-login input[type=submit]{width:280px;height:36px;margin:15px auto 0;border:none;background:#003876;color:#fff;display:block;}
    .top-login p{margin-top:20px;}
    .top-login p a{padding:0 10px;}
    .top-login-bg{width:100%;height:100%;position:fixed;left:0;top:0;z-index:100;background:rgba(0,0,0,.4);}
}

@media only screen and (max-width:320px) {
    .nav-bar .logo{top:-21px;margin-left:-80px;}
    .nav-bar .logo img{width:160px;}
}

/* ========================
    footer
   ======================== */

.footer{padding:55px 0;background:#4b4b4b;color:#b7b7b7;margin-top:68px;}
.footer .container{position:relative;}
.footer .info{font-size:12px;line-height:20px;}
.footer .info span{padding:0 5px;}
.footer .f-logo{position:absolute;top:20px;right:21px;}

@media only screen and (max-width:1026px) {
    .footer{margin-top:50px;padding:40px 20px;}
    .footer .f-logo{display:none;}
}

@media only screen and (max-width:480px) {
    .footer{margin-top:30px;}
}

/* ========================
    main-top
   ======================== */

.main-top{margin-top:39px;height:359px;}
.main-top .container{height:100%;}
.main-slider{width:740px;height:100%;position:relative;z-index:0;float:left;}
.main-slider .slider{height:100%;z-index:99;background:#fff;}
.main-slider .slider li{width:100%;height:100%;position:absolute;left:0;top:0;z-index:99;opacity:0;}
.main-slider .slider li a{width:100%;height:100%;display:block;background-repeat:no-repeat;background-position:center top;position:absolute;left:0;top:0;z-index:99;}
.main-slider .slider-btn{width:100%;position:absolute;left:0;bottom:20px;z-index:100;font-size:0;text-align:center;}
.main-slider .slider-btn li{width:12px;height:12px;background:#fff;cursor:pointer;display:inline-block;-webkit-border-radius:18px;-moz-border-radius:18px;border-radius:18px;margin:0 4px;}
.main-slider .slider-btn li.flagClass{background:#4a4a4a;}
.main-slider .slider-arrow-btn{width:100%;height:100%;margin:0 auto;position:absolute;left:0;top:0;}
.main-slider .slider-arrow-btn span{width:30px;height:57px;position:absolute;top:50%;margin-top:-28px;background:url("../img/arrow.png") no-repeat;z-index:101;cursor:pointer;}
.main-slider .slider-arrow-btn span.prev{left:10px;background-position:0 0;}
.main-slider .slider-arrow-btn span.next{right:10px;background-position:-40px 0;}
.main-banner{width:266px;float:right;}
.main-banner .img-pc img{margin-bottom:13px;}
.main-banner .img-pc a:first-child img{height:195px;}
.main-banner .img-pc a:last-child img{height:151px;}
.main-banner .img-mb{display:none;}

@media only screen and (max-width:1026px) {
    .main-top{margin-top:0;}
    .main-top .container{width:96%;margin:0 auto;}
    .main-slider{width:68%;}
    .main-slider .slider li a{background-size:cover;}
    .main-banner{width:30%;}
    .main-banner img{width:100%;}
}

@media only screen and (max-width:768px) {
    .main-top{height:auto;}
    .main-top .container{width:100%;}
    .main-slider{width:100%;height:300px;float:none;}
    .main-banner{width:100%;margin-top:7px;}
    .main-banner .img-pc{display:none;}
    .main-banner .img-mb{display:block;}
}

@media only screen and (max-width:480px) {
    .main-top{height:220px;}
    .main-slider{height:100%;}
}

/* ========================
    main-list
   ======================== */

.main-list{margin-top:60px;}
.main-list .list-item{width:306px;float:left;margin-left:54px;}
.main-list .list-item:first-child{margin-left:0;}
.main-list .list-item h2{font-size:24px;color:#000;border-bottom:1px solid #173c5f;padding-bottom:15px;position:relative;}
.main-list .list-item h2:after{width:95px;height:2px;background:#173c5f;font-size:0;content:"";position:absolute;left:0;bottom:-3px;}
.main-list .list-item h2 a{width:17px;height:17px;float:right;margin:2px 13px 0 0;}
.main-list .list-item ul{margin-top:10px;}
.main-list .list-item li{height:47px;line-height:47px;border-bottom:1px solid #999;overflow:hidden;}
.main-list .list-item li:before{ content: ''; width:5px;height:5px;background:#111947;display:inline-block;font-size:0;vertical-align:middle;margin:-2px 7px 0 8px;}

@media only screen and (max-width:1026px) {
    .main-list{margin-top:30px;}
    .main-list .container{width:96%;margin:0 auto;}
    .main-list .list-item{width:30%;margin-left:5%;}
}

@media only screen and (max-width:768px) {
    .main-list{margin-top:0;}
    .main-list .container{width:90%;}
    .main-list .list-item{width:100%;margin-left:0;margin-top:35px;}
    .main-list .list-item li{height:40px;line-height:40px;}
}

/* ========================
    main-bottom
   ======================== */

.main-bottom{margin-top:49px;}
.main-bottom .left-part{width:668px;height:267px;border-top:2px solid #223387;border-bottom:2px solid #223387;background:url("../img/main_bl_banner.jpg") no-repeat 0 bottom;float:left;-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding:39px 0 0 18px;}
.main-bottom .left-part h2{font-size:24px;color:#223387;line-height:30px;}
.main-bottom .left-part h3{font-size:13px;margin-top:5px;}
.main-bottom .left-part p{font-size:18px;line-height:28px;margin-top:16px;font-weight:bold;}
.main-bottom .right-part{width:309px;float:right;}
.main-bottom .right-part img{height:77px;border:1px solid #b0b0b0;margin-bottom:15px;}

@media only screen and (max-width:1026px) {
    .main-bottom .container{width:96%;margin:0 auto;}
    .main-bottom .left-part{width:68%;background-position:right bottom;}
    .main-bottom .right-part{width:30%;}
    .main-bottom .right-part img{width:100%;}
}

@media only screen and (max-width:768px) {
    .main-bottom{margin-top:40px;}
    .main-bottom .container{width:100%;}
    .main-bottom .left-part{width:100%;float:none;height:200px;background-size:70%;padding:20px 0 0 15px;}
    .main-bottom .left-part h2{font-size:18px;line-height:24px;}
    .main-bottom .left-part h3{font-size:12px;}
    .main-bottom .left-part p{font-size:14px;line-height:20px;}
    .main-bottom .right-part{width:100%;float:none;text-align:center;font-size:0;margin-top:20px;}
    .main-bottom .right-part a:first-child img{margin-left:1px;}
    .main-bottom .right-part img{width:46%;height:auto;margin-left:-1px;margin-bottom:12px;}
}

/* ========================
    sub
   ======================== */

.sub{margin-top:70px;}
.sub-nav{float:left;width:156px;}
.sub-nav h2{font-size:22px;color:#484848;padding-bottom:24px;border-bottom:5px solid #223387;}
.sub-nav li{height:45px;line-height:45px;border-bottom:1px solid #a2a2a2;}
.sub-nav li a{display:block;font-size:16px;font-weight:bold;color:#505050;text-indent:6px;}
.sub-nav li a:hover,.sub .sub-nav li a.on{color:#2e8ee0;background:url("../img/sub_nav_icon.gif") no-repeat 135px center;}
.sub-content{float:right;width:810px;}
.sub-title{font-size:34px;font-weight:bold;color:#484848;margin-bottom:20px;}
.sub-title span{font-size:12px;color:#484848;font-weight:bold;text-align:right;margin-top:-46px;float:right;}

@media only screen and (max-width:1026px) {
    .sub{margin-top:0;border-top:1px solid #d6d6d6;}
    .sub-nav{display:none;}
    .sub .container{width:96%;margin:0 auto;}
    .sub-content{float:none;width:100%;margin-top:30px;}
    .sub-title span{margin-top:14px;}
}

@media only screen and (max-width:768px) {
    .sub .container{width:92%;}
    .sub-title{font-size:24px;}
    .sub-title span{margin-top:6px;}
}

@media only screen and (max-width:480px) {
    .sub-title span{display:none;}
}

/* ========================
    speech
   ======================== */

.speech{font-size:18px;}
.speech .txt-1{line-height:25px;margin-top:40px;}
.speech .txt-1 p{margin-top:26px;}
.speech .top-img img{width:100%;}
.speech h2{margin-top:97px;}
.speech h2.table-title:after,
.speech h2.table-title:before{ content: ''; width:10px;height:10px;display:inline-block;font-size:0;background:#ff8400;-webkit-border-radius:10px;-moz-border-radius:10px;border-radius:10px;vertical-align:middle;margin-top:-4px;}


.speech h2 em{margin:0 10px;}
.speech .table{margin-top:15px;border-bottom:1px solid #a2a2a2;}
.speech .table-item{width:100%;display:table;letter-spacing:-1px;}
.speech .table-item span{display:table-cell;border-top:1px solid #a2a2a2;padding:12px 0;line-height:30px;vertical-align:middle;}
.speech .table-item span.w-1{width:20%;}
.speech .table-item span.w-2{width:30%;border-left:1px solid #a2a2a2;padding-left:3%;}
.speech .table-item span.w-3{width:50%;border-left:1px solid #a2a2a2;padding-left:3%;}

@media only screen and (max-width:480px) {
    .speech{font-size:16px;}
    .speech h2{margin-top:50px;line-height:20px;}
    .speech .table{font-size:14px;}
    .speech .table-item span{line-height:20px;}
    .speech .table-item span.w-1{width:28%;}
    .speech .table-item span.w-2{width:32%;}
    .speech .table-item span.w-3{width:40%;}
}

/* ========================
    history
   ======================== */
.history #tabs { margin-top:30px; border:none;}
.history .ui-widget-header { border-style:none none solid; background:none;}

.history .top-img img{width:100%;}
.history .list{margin-top:70px;overflow:hidden;}
.history .list-item{background:url("../img/his_line.gif") repeat-y;font-size:18px;letter-spacing:-1px;margin-top:-24px;margin-left:30px;}
.history .list-item dl{display:table;padding:20px 0;width:100%;}
.history .list-item dt{display:table-cell;width:25%;}
.history .list-item dt::before{ content: ''; width:10px;height:10px;border-radius:10px;display:inline-block;vertical-align:middle;margin-top:-6px;margin-right:9%;border:3px solid #223387;background:#fff;}
.history .list-item dd{display:table-cell;line-height:26px;width:75%;}

@media only screen and (max-width:768px) {
    .history .list-item{margin-left:0;font-size:16px;}
}

@media only screen and (max-width:768px) {
    .history .list{margin-top:40px;}
    .history .list-item{margin-top:-13px;}
    .history .list-item dl{display:block;padding:15px 0;}
    .history .list-item dt{display:block;width:100%;color:#484848;font-weight:bold;}
    .history .list-item dt em{margin-top:-6px;margin-right:10px;}
    .history .list-item dd{display:block;line-height:24px;padding-left:25px;margin-top:10px;}
}

/* ========================
    notice
   ======================== */

.notice{position:relative;}
.board-search{position:absolute;right:0;top:-54px;}
.board-search select{padding:7px;width:80px;height:36px;font-size:14px;border:1px solid #c9c9c9;vertical-align:top;}
.board-search input[type=text]{font-size:14px;border:1px solid #c9c9c9;width:161px;height:16px;padding:9px 0;text-indent:5px;vertical-align:top;margin-left:0;}
.board-search input[type=submit]{position:absolute;right:1px;top:1px;width:34px;height:34px;border:none;background:url("../img/search_icon.gif") no-repeat center;cursor:pointer;}
.notice .title{height:59px;line-height:59px;border-top:2px solid #223387;border-bottom:1px solid #ddd;color:#484848;font-size:0;}
.notice .list{height:50px;line-height:50px;border-bottom:1px solid #ddd;overflow:hidden;font-size:0;}
.notice span{display:inline-block;text-align:center;vertical-align:middle;font-size:14px;height:50px;line-height:50px;overflow:hidden;}
.notice span.w-1{width:14%;}
.notice span.w-2{width:40%;text-align:left;}
.notice span.w-3{width:20%;}
.notice span.w-4{width:13%;}
.notice span.w-5{width:13%;}
.notice .title span.w-2{text-align:center;}
.board-page{text-align:center;padding:40px 0 30px;}
.board-page a{color:#484848;font-weight:bold;padding:5px 10px;margin:0 1px;}
.board-page a:hover,.board-page a.on{background:#223387;color:#fff;}

@media only screen and (max-width:480px) {
    .board-search{position:static;margin-bottom:15px;}
    .board-search input[type=submit]{position:static;margin-left:-40px;}
    .notice .title{height:0;line-height:0;border-bottom:none;}
    .notice .title span{display:none;}
    .notice .list{height:65px;position:relative;}
    .notice .list span{display:inline;line-height:30px;}
    .notice .list span.w-1{display:none;}
    .notice .list span.w-2{width:100%;height:100%;overflow:hidden;display:inline-block;}
    .notice .list span.w-2 a{width:100%;height:60px;line-height:45px;color:#2e2e2e;position:absolute;left:0;top:0;z-index:1;overflow:hidden;}
    .notice .list span.w-2 a:hover{color:#223387;}
    .notice .list span.w-3{width:auto;}
    .notice .list span.w-4{width:auto;margin-left:2%;}
    .notice .list span.w-5{width:auto;height:30px;float:right;background:url("../img/view_icon.png") no-repeat 0 center;background-size:16px;padding-left:20px;}
    .notice .list em{position:absolute;left:0;top:30px;width:100%;height:40px;line-height:30px;z-index:0;}
    .notice .list em span{font-size:12px;}
    .board-page{padding:30px 0;}
    .board-page a{padding:10px 15px;background:#dedede;}
}


/* ========================
    pay-status
   ======================== */

.pay-status{position:relative;}
.pay-status .table{margin-top:15px;border-top:2px solid #223387;}
.pay-status .table-item{width:100%;display:table;letter-spacing:-1px;border-bottom:1px solid #a2a2a2;}
.pay-status .table-item span{width:25%;display:table-cell;padding:12px 0;line-height:30px;vertical-align:middle;text-align:center;}
.pay-status .table-item:first-child{color:#2e2e2e;font-weight:bold;}
.pay-status .table-item em.finish{color:#ff5a00;}

.text_box { }
.text_box h2 { font-size:20px; margin:20px 0;}
.text_box p { font-size:14px; line-height:1.8em; padding:.5em 0;} 

.text_box.rule {}

/* ========================
    staff_list
   ======================== */
#staff_list table { width:100%; margin:20px 0 60px;}
#staff_list table caption { font-weight:bold; margin-bottom:20px; text-align:left; font-size: 20px; color: #363636;}
#staff_list table caption:before { content: " "; display:inline-block; width: 10px; height: 10px; background: #003876; -webkit-border-radius: 10px; -moz-border-radius: 10px; border-radius: 10px; vertical-align: middle; margin: -4px 5px 0 8px;}
#staff_list thead th { border: 1px solid #c0c0c0; padding: 15px 0; border-top: 3px solid #223387; border-bottom: 2px solid #223387;}
#staff_list tbody td { border: 1px solid #c0c0c0; text-align: center; padding: 20px 0;}


/* ========================
    로그인 에러메세지 창
   ======================== */
#login_message { z-index:1000;}
#login_message .message { position:fixed; box-sizing:border-box; top:50%; left:10%; width:80%; margin-top:-25%; background:#fff; border:5px solid #b94a48; padding:50px 20px; text-align:center; line-height:1.8em; font-weight:bold; z-index:1000;}
#login_message p { font-size:17px;}
#login_message button { margin-top:20px; border:none; background:#b94a48; padding:10px 30px; font-size:15px; color:#fff; cursor:pointer;}
#login_message .bg { position:fixed; left:0; top:0; width:100%; height:100%; background:rgba(0,0,0,.5); z-index:1000;}

.message.info { z-index:1000;}