@charset "utf-8";
/* CSS Document */
/* ------------------------------------------------------------
 * Name      : web_layout.css
 * Desc      : page layout
 * Created   :
 * Updated   :
 ------------------------------------------------------------ */
body.fixe {overflow:hidden; width: 100%; height:100%; position: fixed;}
img {max-width: 100%;}

/* header */
#header {height: 1107px; background: url(../img/head.jpg) no-repeat center top; color: #fff; background-size: cover}
#header .text{position:absolute; text-align: center; top:230px; left:0px; width:100%; font-size:2.5em; color:#fff; line-height:100%;}
#header .text .time{font-family: 'Open Sans', sans-serif;font-size:2.2em; font-weight: bold; color:#f5e945}



/* wrap */
#wrap {width:100%; max-width:1920px; overflow:hidden; margin:0 auto; font-size: 14px;}

#inner_wrap {max-width:1000px; margin:0 auto; position:relative; padding-bottom:70px;}
#inner_wrap:after {clear:both; content:""; display:block;}
#inner_wrap.no_visual {padding-top:70px;}

.inner {max-width:1000px; margin:0 auto;}
.inner:after { clear: both; content: ""; display: block;}





/* section */
#section1 {background: #001125;}
.section {padding-bottom: 120px;}
#section2 {background:url(../img/bg2.jpg) no-repeat center top; background-size:cover}
#section3 {background:#001125}

/*atab*/
.atab {margin: 0px -4px;}
.atab:after {clear:both; display:block; content:"";}
.atab li {float:left; width:25%; box-sizing:border-box; position:relative; display: table; padding:0px 0px;}
.atab li a {display:table-cell; width: 100%; height:78px; vertical-align: middle; background:#4f4f4f ; line-height:26px; padding:0px 0px; text-align:center; color:#000000; font-weight:600; box-sizing:border-box; font-size:1.9em; word-break: break-all}
.atab li.on a {color:#fff;background:#2f2f2f;}

.tab_area {background: #171717; padding-bottom: 60px;}
.tab_area .bt {text-align: center; padding: 0px 10%;}

.phone_list {overflow: hidden; padding-top:40px; }
.phone_list > li {float: left; width: 100%; border-top:1px solid #001125; }

.form_table {width:81%;margin:10px auto 20px auto;}
.form_table table {width: 100%; border-collapse:collapse; border-spacing:0px;}
.form_table table th {color: #000;}
.form_table table th,
.form_table table td {font-weight:300;text-align:left;padding:0.3em 0px;font-size:1.7em;}

.form_table table tr.verify input{width:78%;margin-right:1%}
.form_table table select,
.form_table table input[type=text],
.form_table table input[type=tel] {width:98%;padding-left:2%;height:46px;-webkit-box-sizing: border-box;-moz-box-sizing: border-box;  box-sizing: border-box;border:0px;background:#fff}
.form_table input[type=checkbox],
.form_table input[type=radio] {width:18px;height:18px;margin-left:0.5em;}
.form_table td input[type=radio]:first-child {margin-left:0px}
.form_table .point {font-size:1.4em; padding: 30px 0px 20px 0px; font-weight: 300; line-height: 140%; color:F5E945; text-align:left;}
.form_table .agreeCheck {font-size:1.4em; padding: 30px 0px 20px 0px; font-weight:400; text-align: center; color:#FFF;letter-spacing:-0.02em}
.form_table .agreeCheck a{color:#bbb;cursor:pointer}
.form_table .bt {text-align: center;}



.agreePopup h1{background:#333;font-size:1.25em;color:#fff;height:3em;line-height:3em;text-align:left;padding:0px 2%;}
.agreePopup h1 a{float:right;display:block;width:30px;height:30px; margin-top: 10px;}
.agreePopup h1 a img {width:100%}
.agreePopup pre{padding:2%}

.m_tit {text-align: center; padding-top:100px;}


#section2 .list {background:#fff;width:80%;margin:0px auto; padding-bottom: 20px; margin-top: 20px;}
#section2 .list .subj {font-size:1.5em; text-align: center; background: #171717; font-weight:700; line-height: 140%; padding:25px}
#section2 .list .subj:after{display:block;content:"";clear:both;}
#section2 .list .name {width:20%;float:left;color:#fff;}
#section2 .list .item {width:40%;float:left;color:#fff;}
#section2 .list .status {width:20%;float:left;color:#fff;}
#section2 .list .date {width:20%;float:left;color:#fff;}
#section2 .list .item1 {width:20%;display:block !important;float:left;}
#section2 .list .item2 {width:40%;display:block !important;float:left;}
#section2 .list .item3 {width:20%;display:block !important;float:left;}
#section2 .list .item4 {width:20%;display:block !important;float:left;}
#section2 .bxslider {width: 100% !important; box-sizing: border-box; padding:0px 25px !important;}
#section2 .bxslider span {line-height: 140%; padding: 15px 0px;}
.bx-viewport, .bx-wrapper{ position:relative; width:100%; height:100% !important; top:0; left:0;}
.bx-wrapper {max-width:100% !important;}
ul.bxslider {width:100% !important}
.bxslider li {width:100% !important; font-size:1.2em; font-weight:300; padding: 10px 0px; border-bottom:solid 1px #001125; text-align:center; margin-bottom:0px !important}/*background-position: 50% 50%; background-size: auto 100%;background-repeat:no-repeat;*/
.bxslider li:after{display:block;content:"";clear:both;}
.bxslider li a {display:block;height:100%;}
.bx-wrapper .bx-viewport{ border: none !important;}


.free_gift {overflow: hidden; margin: -4px;}
.free_gift > li {float: left; width: 100%; text-align: center; box-sizing: border-box; padding: 4px;}

#section4 {background: #424242; padding-top: 0px;margin-top:-120px;}


/* 980px 이하 */
@media screen and (max-width:979px) {
    #wrap {font-size: 13px;}
    #header {height:0px; height:800px;}
    #header .text {top:170px; font-size: 2em;}

    .inner {padding: 0px 10px;}
    .m_tit {padding-top: 80px;}




}

/* 768 이하 */
@media screen and (max-width:767px) {

   #wrap {font-size:12px;}
   #header {height:0px; height:500px;}
   #header .text {top:110px; font-size:1.5em;}

   .m_tit {padding-top:50px;}

   .atab li a {height:60px; font-size:1.5em;}

   .section {padding-bottom:30px;}
    .form_table {width:100%;}
    .form_table table th, .form_table table td {font-size: 1.5em;}

}


/* 480px 이하 */
@media screen and (max-width:479px) {
    #wrap {font-size: 11px;}
    #header {height:300px;}
    .atab {margin: 0px -2px;}
    .atab li {padding: 0px 2px;}
    .atab li a {font-size:13px; letter-spacing: -1px; height:45px}
    .form_table table th, .form_table table td {font-size:13px;}
    .form_table table select, .form_table table input[type=text], .form_table table input[type=tel] {height:36px;}
    .m_th {width:70px !important;}
    .form_table .point {font-size: 13px;}
    .form_table .agreeCheck {font-size:13px; padding:10px 0px 10px 0px;}

    .m_tit {padding-top:30px;}

    #header .text {top: 63px; font-size: 1.1em;}
    #header .text .time {font-size: 2em;}

    #section2 .list {width: 100%}
    #section2 .list .subj {font-size:13px;   padding:15px 5px;}
    #section2 .bxslider span {padding:10px 0px;}
    .bxslider li {font-size:12px;}
    #section2 .bxslider {padding: 0px 5px !important}
    .bt {padding: 0px 10%}

    #section4 {padding: 10px 0px;}
    .tab_area {padding-bottom: 20px;}

}




/* 320px 이하 */
@media screen and (max-width:320px) {
    .main_company h3 {font-size:24px; }
    .atab li a {font-size:12px;}
    .title_bar .s_txt {padding-left: 10px;}
    .bt_application a {padding: 0px 18px;}
    .bt_application a span {text-align: center;}
    .main_customer > ul > li > a > .ico {min-height:90px; padding-top:15px;}
    .main_customer > ul > li > a > .ico.num {font-size:20px; min-height: 85px; padding-top:20px;}
    .btns > li {width:100%; float: none; padding:2px 0px;}
    .btn-tc {padding:20px 0px;}

}