/* 브레인에스 WEB Style sheet */
/* 팝업 레이아웃*/
#popup_container {position:absolute; top:20px; left:20px; z-index:99}
#popup_container > a {display:block; width:500px; height:auto; overflow:hidden}
#popup_container > a img {width:100%; height:auto}
.popup_bottom {position:relative; padding:10px 0; text-align:center}
.popup_bottom span {font-size:13px; font-weight:700; display:inline-block}
.popup_bottom label {display:inline-block; width:15px; height:15px; line-height:13px; border:1px solid #999; text-align:center}
.popup_bottom a {display:inline-block; font-size:14px; position:absolute; top:15px; left:0}
.popup_bottom a i {font-size:1.2em; vertical-align:-2px}
.popup_bottom .close_btn {background:transparent; position:absolute; top:0; right:0}
.popup_bottom .close_btn i {font-size:30px; line-height:50px;}

.inner {width:1300px; margin:0 auto}

#quickbanner {position:fixed; top:50%; right:50px; margin-top:-211px; box-shadow:0 2px 10px rgba(0,0,0,0.2)}
#quickbanner a {display:block}

#main_visual {width:100%}
#main_visual img {width:100%}

#top_menu {width:100%; height:100px; background:#0069a6}
#top_menu ul {width:1300px; height:100%; margin:0 auto; display:table}
#top_menu ul li {width:33.33%; display:table-cell; vertical-align:middle; border-right:1px solid #33a8d3}
#top_menu ul li:last-child {border-right:0}
#top_menu ul li a {display:block; text-align:center; color:#fff; font-size:22px}
#top_menu ul li a span {display:block; font-weight:700}
body.fixed #top_menu {position:fixed; top:0; left:0; z-index:11}

#mid_db {width:100%; height:auto; background:#cbecf1; padding:50px 0; overflow:hidden}
#mid_db .db_form {width:1300px; margin:0 auto; padding:0 80px}
#mid_db .input_db {width:65%; float:left}
#mid_db .input_db li {width:50%; float:left; display:table; margin-bottom:10px}
#mid_db .input_db li > * {display:table-cell; vertical-align:middle}
#mid_db .input_db li .title {width:35%; font-size:18px; font-weight:400; text-align:right; padding-right:15px}
#mid_db .input_db li .input {width:65%}
#mid_db .input_db li .input input {width:100%; height:45px; line-height:45px; background:#fff; border:0; border-radius:5px; padding:0 10px}
#mid_db .input_db li .s_btn {width:65%}
#mid_db .input_db li .s_btn > div {width:50%; height:45px; line-height:45px; float:left; background:#fff; border-radius:5px; text-align:center; cursor:pointer}
#mid_db .input_db li .s_btn > div.on {background:#0069a6; color:#fff}
#mid_db .input_db li .s_btn .s_m {border-radius:5px 0 0 5px}
#mid_db .input_db li .s_btn .s_f {border-radius:0 5px 5px 0}
#mid_db .submit {width:35%; float:right; padding-left:50px}
#mid_db .submit .send_btn {width:100%}
#mid_db .submit .send_btn button {display:block; width:100%; height:105px; font-size:36px; text-align:center; line-height:105px; color:#fff; background:#0069a6; border-radius:5px; transition:all 0.3s ease}
#mid_db .submit .send_btn button:hover {background:#005688}

#point01 {background:#0098d2}
#point02 {position:relative; padding-bottom:50px}
#point02 .inner {width:1400px; text-align:center}
#point02 .inner:before {content:''; width:358px; height:550px; background:url(../image/section03_bg01.png) center bottom no-repeat; position:absolute; bottom:0; left:50%; margin-left:-780px}
#point02 .inner:after {content:''; width:306px; height:456px; background:url(../image/section03_bg02.png) center bottom no-repeat; position:absolute; bottom:0; right:50%; margin-right:-750px}
#point03 {background:#fff5d0}

#bottom {padding:80px 0; position:relative}
#bottom:before {content:''; width:630px; height:800px; background:url(../image/bottom_bg01.png) center bottom no-repeat; position:absolute; bottom:0; left:50%; margin-left:-960px; z-index:-1}
#bottom:after {content:''; width:625px; height:722px; background:url(../image/bottom_bg02.png) center bottom no-repeat; position:absolute; bottom:0; right:50%; margin-right:-950px; z-index:-1}
#bottom .db_title {text-align:center; margin-bottom:60px}
#bottom .inner {width:1062px; height:569px; background:url(../image/bottom_img.png) center bottom no-repeat}
#main_db {padding-top:40px; margin-left:510px}
#main_db form {padding:30px 50px}
#main_db h1 {text-align:center}
#main_db .input_db {margin-top:30px}
#main_db .input_db li {width:100%; display:table; margin-bottom:10px}
#main_db .input_db li > * {display:table-cell; vertical-align:middle}
#main_db .input_db li .title {width:30%; font-size:20px; font-weight:400; color:#fff}
#main_db .input_db li .input {width:70%}
#main_db .input_db li .input input {width:100%; height:45px; line-height:45px; background:#fff; border:0; border-radius:5px; padding:0 10px}
#main_db .input_db li .s_btn {width:70%}
#main_db .input_db li .s_btn > div {width:50%; height:45px; line-height:45px; float:left; background:#fff; border-radius:5px; text-align:center; cursor:pointer}
#main_db .input_db li .s_btn > div.on {background:#0069a6; color:#fff}
#main_db .input_db li .s_btn .s_m {border-radius:5px 0 0 5px}
#main_db .input_db li .s_btn .s_f {border-radius:0 5px 5px 0}
#main_db .sendbtn {width:100%; height:90px; line-height:90px; text-align:center; color:#222; font-size:36px; background:#ffe792; border-radius:5px; transition:all 0.3s ease}
#main_db .sendbtn:hover {background:#fcdd71}

#footer {width:100%; padding:30px; background:#f8f8f8; text-align:center}
#footer h1 {margin-bottom:20px}
#footer h1 img {width:100px; opacity:0.6}
#footer p {font-size:12px; line-height:1.6; color:#888}
#footer a {display:inline-block; width:120px; height:30px; line-height:30px; background:#888; margin-top:20px; font-size:12px; color:#fff; border-radius:3px}

/* db 개인정보취급동의 체크박스 커스텀 */
#mid_db .privacy_agree {clear:both; text-align:right}
#mid_db .privacy_agree .checkbox {display:inline-block}

#main_db .privacy_agree {height:auto; margin-top:20px; overflow:hidden}
#main_db .privacy_agree .checkbox {width:auto;letter-spacing:-1.5px;margin-right:5px; float:left}

.privacy_agree .checkbox {font-size:12px; font-weight:400; letter-spacing:-1px; position:relative}
.privacy_agree .checkbox input[type="checkbox"] {width:0; height:0; visibility: hidden; position:absolute; top:0; left:0}
.privacy_agree .checkbox label {display:inline-block; position:relative; top:1px; width:15px; height:15px; line-height:13px; text-align: center; background:rgba(255,255,255,0.5); border: 1px solid rgba(0,0,0,0.3); border-radius:3px}
.privacy_agree .checkbox input[type="checkbox"]:checked + label {border-color:#0069a6}
.privacy_agree .checkbox input[type="checkbox"]:checked + label:before {content:'\e929'; font-family:'xeicon'; font-size:1.2em; font-weight:700; color:#0069a6; position:absolute; top:0; left:0; width:100%; height:100%}
.privacy_agree .checkbox span,.privacy_agree .checkbox a  {vertical-align:middle; display:inline-block}
.privacy_agree .checkbox span.bold {font-weight:600}


/* 레이어팝업 */
.layer_popup {display:none; background:#fff; width:800px; height:500px}
.layer_popup .title {width:100%; height:60px; background:#1c2637; line-height:60px; padding:0 20px; position:relative}
.layer_popup .title h2 {font-size:18px; font-weight:400; color:#fff}
.layer_popup .title a {width:60px; height:60px; display:block; text-align:center; color:#fff; font-size:30px; position:absolute; top:0; right:0}
.layer_popup .title a i {line-height:60px; vertical-align:top}
.layer_popup .inner {width:100%; height:360px; margin:30px 0; padding:0 30px; overflow-x:hidden; overflow-y:scroll;}


/* 개인정보처리방침 */
#privacy_all {width:1000px; margin:100px auto}
#privacy_all .title {font-size:24px; text-align:center; margin-bottom:20px}
.privacy-wrap {width:100%; font-size:14px; letter-spacing:-0.5px}
.privacy-wrap .priv_msg {background:#f9f9f9; padding:15px; text-align:justify; line-height:2; margin-bottom:20px}
.privacy-wrap .normal-text {text-align:justify; line-height:1.7}
.privacy {margin-bottom:20px}
.privacy:last-child {margin-bottom:0}
.privacy h3 {margin-bottom:10px}
.privacy h4 {font-weight:500; line-height:1.7}
.privacy ul {margin:10px 0}
.privacy ul > li {position:relative; padding-lefT:7px; line-height:1.7}
.privacy ul > li:before {content:'-'; position: absolute; top:0; left:0}
.privacy ol {margin:5px 0}
.privacy ol > li {position: relative; padding-left:7px; font-size:13px; font-family:'Nanum Gothic'; line-height:1.8; letter-spacing:-0.7px}
.privacy ol > li:before {content:'·'; position: absolute; top:0; left:0}
.priv_table {width:100%; margin:10px 0; border-top:1px solid #333}
.priv_table thead th {background:#f8f8f8; font-weight:600; padding:10px 0; border-bottom:1px solid #ddd}
.priv_table tbody td {padding:10px; border-bottom:1px solid #ddd}
.priv_table tbody th {padding:10px; border-bottom:1px solid #ddd; border-right:1px solid #ddd; font-weight:600}

/* TOP 버튼 */
#top_btn {width:60px; height:60px; background:#222; text-align:center; position:fixed; bottom:10px; right:10px}
#top_btn i {font-size:24px; color:#fff; line-height:60px}

#event {width:100%; height:auto; background:#124b2a;}

@media screen and (max-width: 768px) { 
    body {width:100%; min-width:auto; max-width:1000px; margin:0 auto; font-size:12px} 

    #privacy_all {width:100%; margin:0; padding:30px 10px}
    #privacy_all .title {font-size:20px; margin-bottom:15px; text-align:center}
    .priv_msg p {font-size:13px}
    .privacy h3 {font-size:13px}
    .privacy h4 {font-size:12px}
    .privacy ul > li {font-size:11px}
    .privacy-wrap .normal-text {font-size:12px}
    .priv_table thead th {font-size:13px}
    .priv_table tbody th,
    .priv_table tbody td {font-size:12px}
    .privacy ol > li {font-size:11px}
}