/*
copyright(c) 상상너머·원데이넷 all rights reserved.
허용된 라이센스이외 무단도용재배포를 금합니다.
*/

@charset 'utf-8';

/* ●●●●●●●●●● CSS형 버튼 */
.button_pack {display:inline-block; text-align:center;}
.button_pack a,.button_pack input,.button_pack button {word-wrap:normal; word-break:keep-all; letter-spacing:-1px; border-radius:100px; display:block; box-sizing:border-box; padding:0 60px;}
.button_pack a,.button_pack input,.button_pack button {background-image:none; position:relative; font-weight:normal; margin:0 !important; box-shadow:inset 0 -3px 0 rgba(0,0,0,0.06)}

.button_pack .btn_input {background:none; position:relative; position:relative; margin:0; display:block;}
.button_pack input,.button_pack button {border:0; display:block; width:100%; box-sizing:border-box; overflow:visible; font-weight:normal; word-wrap:normal; word-break:keep-all; letter-spacing:-0.5px;}
.button_pack .edge {display:none;}

.button_pack .btn_input .btn_md_white,.button_pack .btn_input .btn_md_black,.button_pack .btn_input .btn_md_color {height:35px;}
.button_pack .btn_md_white,.button_pack .btn_md_black,.button_pack .btn_md_color {height:35px; line-height:35px; font-size:13px;}
.button_pack .btn_md_white {background:#fff; color:#666 !important; border:1px solid rgba(0,0,0,0.15);}
.button_pack .btn_md_white:hover {background:#eee;}
.button_pack .btn_md_black {background:#5d5f6a; color:#fff !important;}
.button_pack .btn_md_black:hover {background:#333;}
.button_pack .btn_md_color {background:#42bfec; color:#fff !important;}
.button_pack .btn_md_color:hover {background:#2e87d9;}

.button_pack .btn_input .btn_lg_white,.button_pack .btn_input .btn_lg_black,.button_pack .btn_input .btn_lg_color {height:55px;}
.button_pack .btn_lg_white,.button_pack .btn_lg_black,.button_pack .btn_lg_color { height:55px; line-height:55px; font-size:17px;}
.button_pack .btn_lg_white {background:#fff; color:#666 !important; border:1px solid rgba(0,0,0,0.15);}
.button_pack .btn_lg_white:hover {background:#eee;}
.button_pack .btn_lg_black {background:#5d5f6a; color:#fff !important;}
.button_pack .btn_lg_black:hover {background:#333;}
.button_pack .btn_lg_color {background:#42bfec; color:#fff !important;}
.button_pack .btn_lg_color:hover {background:#2e87d9;}


/* 계산기 화면 전체(어플에서 쓸경우 삭제) */
.charge_wrap {overflow:hidden; padding:20px 0 40px 0;}

/* 계산기 탭메뉴 */
.charge_tabmenu {height:78px; background:#fff; text-align:center; border:1px solid #cccfd9;}
.charge_tabmenu li {float:left; width:20%; list-style:none; position:relative; height:78px; }
.charge_tabmenu .tab {color:#8c8c8f; font-size:17px; font-weight:300; margin-top:22px; padding:0 5px; line-height:1.1;}
.charge_tabmenu .tab strong {display:block; font-weight:inherit}
.charge_tabmenu .tab:before {content:""; background:#cccfd9; width:1px; height:100%; position:absolute; left:-1px; top:0; z-index:2}
.charge_tabmenu .hit {background:#f2f3f6; border-bottom:1px solid #f2f3f6}
.charge_tabmenu .hit .tab {color:#000; font-weight:400;}

@media screen and (max-width:1000px) {
.charge_wrap {padding:5px;}
}
@media screen and (max-width:800px) {
.charge_tabmenu .tab {font-size:13px; word-wrap:break-word; word-break:break-word; white-space:normal; font-weight:400; margin-top:27px;}
}
@media screen and (max-width:600px) {
.charge_tabmenu {height:68px;}
.charge_tabmenu li {height:68px;}
.charge_tabmenu .tab {font-size:12px; margin-top:18px;}

}
@media screen and (max-width:500px) {
.charge_tabmenu .tab {font-size:11px; margin-top:18px;}
}


/* 계산기 내용 */
.charge_conts_box {background:#f2f3f6; border:1px solid #cccfd9; border-top:0; overflow:hidden; padding:40px;}
.charge_conts_box .title {text-align:center; margin:10px 0 40px 0}
.charge_conts_box .title dt .txt {color:#474b53; font-size:31px; font-weight:400; border:1px solid #474b53; border-left:0; border-right:0; padding:10px 0 6px 0;}
.charge_conts_box .title dd {color:#868ba2; font-size:19px; font-weight:300; margin-top:10px}

.charge_conts_box .form_box {overflow:hidden; background:#8b91ab; border-radius:20px;}
.charge_conts_box .form_box li {list-style:none; position:relative; overflow:hidden;}
.charge_conts_box .form_box li:before {content:""; background:rgba(0,0,0,0.15); height:1px; width:100%; position:absolute; left:0; top:0;}
.charge_conts_box .form_box li:first-of-type:before {display:none;}
.charge_conts_box .form_box .opt {position:absolute; left:30px; top:50%; margin-top:-12px;}
.charge_conts_box .form_box .opt_txt {background:transparent url('../images/charge/opt_ic.png') 0 1px no-repeat; padding:3px 0 3px 30px; color:#fff; font-size:17px; font-weight:300; }
.charge_conts_box .form_box .ess .opt_txt {background:transparent url('../images/charge/opt_ic_ess.png') 0 1px no-repeat;}
.charge_conts_box .form_box .opt_txt strong {display:block; color:#c5c8d5; font-weight:inherit; font-size:15px;}
.charge_conts_box .form_box .if_line2 .opt {margin-top:-20px}
.charge_conts_box .form_box .value {background:#fff; padding:15px; margin-left:210px; border-left:1px solid rgba(0,0,0,0.01); overflow:hidden; }

.charge_conts_box .btn_design {overflow:hidden;}
.charge_conts_box .width_btn {height:40px; background:#585a64; color:#fff; font-size:15px; line-height:42px; padding:0 30px; float:left; }
.charge_conts_box .width_btn:hover {background:#42bfec;}
.charge_conts_box .width_btn+ .width_btn {margin-left:5px}
.charge_conts_box .width_txt {color:#666; background:#eee; font-size:15px; margin-top:5px; padding:10px 20px;}


.charge_conts_box .input_design {position:relative; overflow:hidden; float:left; width:70%;}
.charge_conts_box .input_design input {border:1px solid #bdc2d2; height:40px; text-indent:15px; width:100%; font-size:15px; color:#797c8c; box-sizing:border-box;}
.charge_conts_box .input_design input::-webkit-input-placeholder {color:#999}
.charge_conts_box .input_design input::input-placeholder {color:#999}
.charge_conts_box .input_design input:focus {border:1px solid #333;}
.charge_conts_box .input_design .upper_txt {font-size:15px; color:#333; font-weight:400; position:absolute; right:15px; top:50%; margin-top:-7px}

.charge_conts_box .select_design {position:relative; background:#fff; height:40px; width:70%; float:left;}
.charge_conts_box .select_design .shape {position:absolute; right:0; top:0; border-left:1px solid #ddd; width:30px; height:100%; background:#fafafa; border-radius:0 5px 5px 0;}
.charge_conts_box .select_design .shape:before {content:''; width:1px; height:8px; position:absolute; left:50%; top:50%; background:#aaa; transform: rotate(45deg); -webkit-transform: rotate(45deg); margin:-4px 0 0 2px}
.charge_conts_box .select_design .shape:after {content:''; width:1px; height:8px; position:absolute; left:50%; top:50%; background:#aaa; transform: rotate(-45deg); -webkit-transform: rotate(-45deg); margin:-4px 0 0 -3px}
.charge_conts_box .select_design select {width:100%; height:100%; padding:0 35px 0 15px; box-sizing:border-box; position:absolute; left:0; top:0; -webkit-appearance:none; background:transparent; z-index:1; border-radius:0; }
.charge_conts_box .select_design select {border:1px solid #bdc2d2; font-size:15px !important;  color:#797c8c;}
.charge_conts_box .select_design select:focus {border:1px solid #333; color:#42bfec;}

.charge_conts_box .label_design {overflow:hidden;}
.charge_conts_box .label_design label {overflow:hidden; position:relative; float:left;}
.charge_conts_box .label_design label+ label {margin-left:10px}
.charge_conts_box .label_design .txt {font-size:15px; color:#797c8c; border:1px solid #bdc2d2; padding:0 20px 0 40px; height:38px; line-height:40px; border-radius:100px; box-sizing:border-box; }
.charge_conts_box .label_design label input {position:absolute; left:10px; top:50%; margin-top:-10px; z-index:1; width:20px; height:20px;}
.charge_conts_box .label_design label input {-webkit-appearance:none; -webkit-gradient:none; border:0;}
.charge_conts_box .label_design label:hover .txt {border:1px solid #333; color:#42bfec;}
.charge_conts_box .label_design input:checked+ .txt {border:1px solid #333; color:#000; background:#e7e7e7;}

/* 체크박스,라디오박스 */
.charge_conts_box input[type=checkbox] {width:20px; height:20px; border-radius:100px; box-sizing:border-box; box-shadow:0 0 1px rgba(0,0,0,0.5); margin-left:1px !important}
.charge_conts_box input[type=checkbox] {background:#fff url('../images/charge/checkbox_radio.png') left top no-repeat; background-size:40px;}
.charge_conts_box input[type=checkbox]:checked {background-color:#42bfec; background-position:right top; box-shadow:none}
.charge_conts_box input[type=radio] {width:20px; height:20px; border-radius:100px; box-sizing:border-box; box-shadow:0 0 1px rgba(0,0,0,0.5); margin-left:1px !important}
.charge_conts_box input[type=radio] {background:#fff url('../images/charge/checkbox_radio.png') left bottom no-repeat; background-size:40px; }
.charge_conts_box input[type=radio]:checked {background-color:#42bfec; background-position:right bottom; box-shadow:none}

.charge_conts_box .bottom_btn {margin-top:20px; text-align:center;}

.charge_conts_box .result_box {background:#fff; border-radius:20px 20px 0 0; overflow:hidden; box-shadow:0 0 5px rgba(0,0,0,0.1); position:relative; margin-top:30px}
.charge_conts_box .result_box .first_table {width:100%;}
.charge_conts_box .result_box .first_table th {background:#8b91ab; color:#fff; font-size:17px; font-weight:300; padding:15px; border-left:1px dashed rgba(0,0,0,0.15);}
.charge_conts_box .result_box .first_table th:first-of-type {border-left:0}
.charge_conts_box .result_box .first_table td {background:#fff; border-left:1px dashed rgba(0,0,0,0.05);  border-bottom:1px dashed rgba(0,0,0,0.05); padding:15px 20px; font-size:15px; position:relative;}
.charge_conts_box .result_box .first_table td {word-wrap:break-word; word-break:break-all; white-space:normal; }
.charge_conts_box .result_box .first_table tr:hover td {background:#fafafa;}
.charge_conts_box .result_box .first_table td:first-of-type {border-left:0}
.charge_conts_box .result_box .add_txt {color:#999; font-size:13px !important;}
.charge_conts_box .result_box .opt {text-align:center; color:#333;}
.charge_conts_box .result_box .price {text-align:right}
.charge_conts_box .result_box .lineup {display:inline-block; overflow:hidden;}
.charge_conts_box .result_box .price .number {font-family:"lato"; color:#000; font-size:19px; float:left; letter-spacing:0px;}
.charge_conts_box .result_box .price .unit {color:#929294; float:left; margin:2px 0 0 3px; font-size:15px;}
.charge_conts_box .result_box .price .front {color:#000; float:left; font-size:17px; margin:2px 10px 0 0}
.charge_conts_box .result_box .first_table tfoot td {border-bottom:0; padding:30px 20px; background:#e5edf5}
.charge_conts_box .result_box .first_table tfoot .opt {font-size:21px;}
.charge_conts_box .result_box .first_table tfoot .number {font-size:29px; color:#da0000; font-weight:600;}
.charge_conts_box .result_box .first_table tfoot .unit {font-size:21px; margin-top:6px; color:#000;}
.charge_conts_box .result_box .mark {position:absolute; left:10px; top:50%; width:23px; height:23px; z-index:2; margin-top:-11px}
.charge_conts_box .result_box .mark.if_plus {background:transparent url('../images/charge/ic_p.png') left top no-repeat;}
.charge_conts_box .result_box .mark.if_minus {background:transparent url('../images/charge/ic_m.png') left top no-repeat;}
.charge_conts_box .result_box .mark.if_multi {background:transparent url('../images/charge/ic_x.png') left top no-repeat;}
.charge_conts_box .result_box .mark.if_equal {background:transparent url('../images/charge/ic_e.png') left top no-repeat;}

.charge_conts_box .result_box .exeplain_txt {border:1px solid #eee; margin:10px; padding:20px; font-size:15px; font-weight:300; text-align:center;}

.charge_conts_box .result_box .upper_border {position:absolute; left:50%; top:0; width:1px; height:100%; background:rgba(0,0,0,0.15); z-index:3}
.charge_conts_box .result_box .one_box {float:left; width:50%;}
.charge_conts_box .result_box .one_box .title_box {background:#8b91ab; text-align:center; position:relative;}
.charge_conts_box .result_box .one_box .title_box .shape {width:0; height:0; border-left: 12px solid transparent; border-right: 12px solid transparent; border-top: 12px solid #8b91ab; position:absolute; left:50%; bottom:-12px; margin-left:-12px}
.charge_conts_box .result_box .one_box .title_box dt {font-size:17px; color:#fff; padding:20px; border-bottom:1px solid #6f7489}
.charge_conts_box .result_box .one_box .title_box dd {padding:20px 80px;}
.charge_conts_box .result_box .one_box .title_box li {list-style:none; overflow:hidden; border-top:1px solid #aeb2c4; padding:5px 0;}
.charge_conts_box .result_box .one_box .title_box li:first-of-type {border:0}
.charge_conts_box .result_box .one_box .title_box span {color:#fff; font-size:15px;}
.charge_conts_box .result_box .one_box .title_box .txt_opt {float:left;}
.charge_conts_box .result_box .one_box .title_box .txt_value {float:right;}
.charge_conts_box .result_box .one_box .title_box .number {font-family:"lato";}

.charge_conts_box .result_box .table_wrap {padding:20px 15px;}
.charge_conts_box .result_box .second_table {width:100%;}
.charge_conts_box .result_box .second_table th {border-bottom:3px solid #8b91ab; font-size:13px; color:#2f3340; padding:10px; font-weight:600;}
.charge_conts_box .result_box .second_table tr:hover td {background:#fafafa;}
.charge_conts_box .result_box .second_table td {border:1px solid #d7d9de; border-top:0; border-right:0; padding:10px 5px; font-family:"lato"; letter-spacing:0px; text-align:right; font-size:13px;}
.charge_conts_box .result_box .second_table td:first-of-type {border-left:0}
.charge_conts_box .result_box .second_table td {word-wrap:break-word; word-break:break-all; white-space:normal; }
.charge_conts_box .result_box .second_table .number {text-align:center;}
.charge_conts_box .result_box .second_table .fc_black {color:#2f3340}
.charge_conts_box .result_box .second_table .fc_purple {color:#6f48a0;}
.charge_conts_box .result_box .second_table .fc_blue {color:#0036d7;}
.charge_conts_box .result_box .second_table .fc_red {color:#dc0000;}



@media screen and (max-width:900px) {
.charge_conts_box .input_design {width:100%; float:none}
.charge_conts_box .width_btn {float:none; margin:5px 0 0 0; display:block; text-align:center;}
.charge_conts_box .width_btn+ .width_btn {margin-left:0}
.charge_conts_box .width_txt { text-align:center;}
.charge_conts_box .select_design {width:100%; float:none;}
}

@media screen and (max-width:800px) {
.charge_conts_box {padding:20px;}
.charge_conts_box .title {margin:20px 0}
.charge_conts_box .title dt .txt {font-size:23px;}
.charge_conts_box .title dd {font-size:14px;}
.charge_conts_box .bottom_btn {margin-top:10px;}
.charge_conts_box .form_box .opt_txt {font-size:15px; font-weight:400;}
.charge_conts_box .form_box .opt strong {font-size:13px;}
.charge_conts_box .input_design input {font-size:13px;}
.charge_conts_box .select_design select {font-size:13px;}
.charge_conts_box .label_design .txt {font-size:13px; padding-left:35px; line-height:38px;}
.charge_conts_box .label_design label {margin:2px 0; display:block; float:none}
.charge_conts_box .label_design label+ label {margin-left:0;}
.charge_conts_box .label_design .txt {display:block; width:100%;}
.button_pack {display:block;}
.button_pack a,.button_pack input,.button_pack button  {padding:0;}
.charge_conts_box .result_box .first_table th {font-size:15px; font-weight:400;}
.charge_conts_box .result_box .first_table td {font-size:13px; font-weight:400;}
.charge_conts_box .result_box .exeplain_txt {font-weight:400;}

.charge_conts_box .result_box .one_box .title_box dt {font-size:15px; padding:15px 10px;}
.charge_conts_box .result_box .one_box .title_box dd {padding:15px 20%}
.charge_conts_box .result_box .one_box .title_box span {font-size:13px;}
.charge_conts_box .result_box .upper_border {display:none;}
.charge_conts_box .result_box .one_box {width:100%; float:none}
.charge_conts_box .result_box .second_table th {font-size:12px;}
.charge_conts_box .result_box .second_table td {font-size:12px;}
}

@media screen and (max-width:600px) {
.charge_conts_box {padding:0;}
.charge_conts_box .bottom_btn {margin:15px 10px}
.charge_conts_box .form_box {border-radius:0px;}
.charge_conts_box .form_box .value {margin-left:100px}
.charge_conts_box .form_box .opt {left:10px; }
.charge_conts_box .form_box .opt_txt {padding:3px 0 3px 18px; background-size:12px !important; background-position:left 4px !important; font-size:12px; width:60px; word-wrap:break-word; word-break:break-word; white-space:normal;}
.charge_conts_box .form_box .value {padding:10px;}
.charge_conts_box .form_box .opt_txt strong {display:inline}
.charge_conts_box .input_design input {font-size:12px !important;}
.charge_conts_box .input_design .upper_txt {font-size:12px;}
.charge_conts_box .select_design select {font-size:12px !important;}
.charge_conts_box .label_design .txt {font-size:12px !important;}
.charge_conts_box .width_btn {font-size:12px !important;}
.charge_conts_box .width_txt {font-size:12px !important;}
.charge_conts_box .result_box {border-radius:0px;}
.charge_conts_box .result_box .first_table td {font-size:12px; padding:5px 10px;}
.charge_conts_box .result_box .price .number {font-size:17px;}
.charge_conts_box .result_box .add_txt {font-size:11px !important;}
.charge_conts_box .result_box .first_table tfoot .opt {font-size:17px;}
.charge_conts_box .result_box .first_table tfoot td {padding:20px 10px;}
.charge_conts_box .result_box .first_table tfoot .number {font-size:21px;}
.charge_conts_box .result_box .first_table tfoot .unit {font-size:15px; margin-top:4px;}
.charge_conts_box .result_box .exeplain_txt {font-size:12px;}
.charge_conts_box .result_box .mark {background-size:15px !important; width:15px; height:15px; margin-top:-7px; left:5px;}

.charge_conts_box .result_box .second_table td {font-size:11px;}
}











/* 2016-05-06 ------------------------------------------------------------------------------- */

/* ● 계산기 퀵메뉴 */
.btn_scroll_top {right:33px; bottom:15px;}

.fly_quick {width:100px; position:fixed; right:10px; bottom:80px; z-index:12; text-align:center;}
.fly_quick .title {background:#42bfec; border-radius:10px 10px 0 0; position:relative;}
.fly_quick .title .link { color:#fff; font-weight:600; letter-spacing:-0.5px; height:40px; line-height:42px;}
.fly_quick .title .shape {width:0; height:0; border-left: 7px solid transparent; border-right: 7px solid transparent; border-top: 7px solid #42bfec; position:absolute; left:50%; bottom:-7px; margin-left:-7px}
.fly_quick .title:hover .link {text-decoration:underline}
.fly_quick .menu_box {overflow:hidden; border-radius:0 0 10px 10px; border:1px solid #c7ccce; border-top:0; background:rgba(255,255,255,0.95);; padding:15px 0 10px 0}
.fly_quick .menu_box li {list-style:none; position:relative; overflow:hidden; padding:4px 0;}
.fly_quick .menu_box .icon {overflow:hidden; display:inline-block; padding:6px; border-radius:100px; width:27px; height:27px;}
.fly_quick .menu_box .icon img {float:left;}
.fly_quick .menu_box .icon .off {display:inline-block}
.fly_quick .menu_box .icon .over {display:none;}
.fly_quick .menu_box .icon_m {display:none;}
.fly_quick .menu_box .icon_m img {width:22px;}
.fly_quick .menu_box em {display:none;}
.fly_quick .menu_box .txt {color:#65666f; letter-spacing:-0.5px; clear:both}
.fly_quick .menu_box li:hover .icon {background:#8b91ab;}
.fly_quick .menu_box li:hover .txt {color:#000; text-decoration:underline}
.fly_quick .menu_box li:hover .off {display:none}
.fly_quick .menu_box li:hover .over {display:inline-block}

@media screen and (max-width:1200px) {
	.fly_quick {width:100%; bottom:0; right:0}
	.fly_quick .title {display:none;}
	.fly_quick .menu_box {border:0; box-shadow:-1px 0 2px rgba(0,0,0,0.3); border-radius:0px; padding:8px 0 5px 0;}
	.fly_quick .menu_box .icon {display:none;}
	.fly_quick .menu_box .icon_m {display:inline-block;}
	.fly_quick .menu_box li {float:left; width:20%; padding:3px 0;}
	.fly_quick .menu_box .txt {font-size:11px; margin-top:3px}
	.fly_quick .menu_box em {display:block; font-size:10px; letter-spacing:-1px; color:rgba(0,0,0,0.3);}

	.footer_wrap .footer {padding-bottom:100px !important}
}






/* ● 인재채용 */
.visual_recruit { background-image:url('../images/bg_sub_visual05.jpg'); background-repeat:no-repeat; background-position: center top;}
.recruit {overflow:hidden; margin:20px 0}
.recruit em {display:block; font-family:inherit; font-size:inherit; color:inherit; line-height:inherit; letter-spacing:inherit;}

.recruit .first_box {border:1px solid #e0e0e0; background:transparent url('../images/recruit/first_bg.gif') left top repeat; text-align:center; padding:20px;}
.recruit .first_box .inner {background:transparent url('../images/recruit/first_unit1.png') center top no-repeat; padding-top:40px}
.recruit .first_box .txt {color:#1d1e20; font-size:31px; font-weight:300;/*  background:transparent url('../images/recruit/first_unit2.png') center bottom no-repeat; padding-bottom:40px */}

.recruit .keypoint_box {overflow:hidden; text-align:center; margin-top:40px;}
.recruit .keypoint_box ul {margin-left:-40px;}
.recruit .keypoint_box li {float:left; width:33.33333%; list-style:none;}
.recruit .keypoint_box .bg1 .one_box {background:#92c2c9;}
.recruit .keypoint_box .bg2 .one_box {background:#72a6cb;}
.recruit .keypoint_box .bg3 .one_box {background:#718ddc;}
.recruit .keypoint_box .img {overflow:hidden; margin-bottom:5px}
.recruit .keypoint_box .img img {max-width:100%}
.recruit .keypoint_box .one_box {padding:20px 10px 40px 10px; margin-left:40px;  overflow:hidden;}
.recruit .keypoint_box .one_box dt {font-family:"lato"; color:#fff; font-size:37px; font-weight:200;}
.recruit .keypoint_box .one_box strong {border-bottom:1px solid #fff; letter-spacing:-1px; height:35px; line-height:35px;}
.recruit .keypoint_box .one_box dd {color:#fff; font-size:17px; font-weight:300; margin-top:15px}

.recruit .group_title {text-align:center; height:15px; background:transparent url('../images/recruit/title_bg.gif') left top repeat; margin-top:20px}
.recruit .group_title .txt {color:#000; font-weight:300; font-size:31px; margin-top:-19px; background:#fff; padding:0 20px;}

.recruit .rull_box {margin-top:80px; overflow:hidden;}
.recruit .rull_box .manage {overflow:hidden; text-align:center; margin-top:50px}
.recruit .rull_box .manage ul {margin-left:-30px}
.recruit .rull_box .manage li {float:left; list-style:none; width:20%; position:relative;}
.recruit .rull_box .manage li:before {content:""; width:30px; height:30px; background:transparent url('../images/recruit/rule_+.png') left top no-repeat; position:absolute; left:0; top:50%; margin-top:-25px}
.recruit .rull_box .manage .one_box {background:#f1f1f3; color:#1f1f21; border-radius:100px; position:absolute; left:0; top:0; width:100%; height:100%;}
.recruit .rull_box .manage .txt {position:absolute; left:0; top:50%; font-size:17px; width:100%; margin-top:-15px}
.recruit .rull_box .fake {overflow:hidden; margin:0 0 30px 30px; position:relative;}
.recruit .rull_box .fake_img {width:100%;}
.recruit .rull_box .vision {overflow:hidden; border:1px solid #bcbdc2;}
.recruit .rull_box .vision li {float:left; width:33.33333%; list-style:none; text-align:center;}
.recruit .rull_box .vision .one_box {padding:30px 0; border-left:1px solid #d2d4dd}
.recruit .rull_box .vision li:first-of-type .one_box {border:0}
.recruit .rull_box .vision .one_box dt {font-family:"lato"; color:#42bfec; font-size:25px; font-weight:300;}
.recruit .rull_box .vision .one_box dd {font-size:17px; color:#5a5b60; margin-top:10px}
.recruit .rull_box .last_txt {color:#545558; text-align:center; background:transparent url('../images/recruit/rule_next.png') center top no-repeat; padding-top:80px; font-size:17px; line-height:1.4; font-weight:300;}

.recruit .who_box {overflow:hidden; position:relative; background:#ecf0f1; margin-top:80px}
.recruit .who_box .title_box {position:absolute; left:0; top:0; width:320px; height:100%; background:#aac3cc url('../images/recruit/who_img.png') center bottom no-repeat; text-align:center;}
.recruit .who_box .title_box .txt {color:#fff; font-size:23px; background:transparent url('../images/recruit/benefit_unit1.png') center top no-repeat; font-weight:300; padding-top:40px; margin-top:60px}
.recruit .who_box ul {overflow:hidden; margin-left:320px}
.recruit .who_box li {list-style:none; position:relative; overflow:hidden; border-top:1px solid #fff}
.recruit .who_box li:first-of-type {border-top:0}
.recruit .who_box .opt {background:#fff; color:#2e2f36; font-size:21px; border-radius:100px; width:110px; text-align:center; padding:15px 20px; position:absolute; left:20px; top:50%; margin-top:-27px}
.recruit .who_box .value {margin:43px 10px 40px 190px;}
.recruit .who_box .value dt,.recruit .who_box .value dd {font-size:15px; color:#2e2f36; padding:3px 0;}
.recruit .who_box .value strong {color:#2876a2; margin-right:10px; display:none;}

.recruit .benefit_box {border:2px solid #bcbdc2; margin-top:80px; overflow:hidden; position:relative;}
.recruit .benefit_box .title_box {position:absolute; left:25%; top:160px; background:#6b6cb2; width:50%; z-index:3; text-align:center; height:320px;}
.recruit .benefit_box .title_box .txt {color:#fff; font-size:27px; background:transparent url('../images/recruit/benefit_unit1.png') center top no-repeat; font-weight:300; padding:40px 20px 0 20px; margin-top:110px}
.recruit .benefit_box li {float:left; list-style:none; width:25%; text-align:center; height:160px;}
.recruit .benefit_box .bg {background:#fafafa;}
.recruit .benefit_box .one_box {padding:15px 10px; position:relative;}
.recruit .benefit_box .one_box:before {content:""; width:1px; height:150%; background:#ebebed; position:absolute; left:-1px; top:0;}
.recruit .benefit_box .one_box:after {content:""; width:100%; height:1px; background:#ebebed; position:absolute; left:0; top:-1px;}
.recruit .benefit_box .img {padding:10px 10px 0 10px;}
.recruit .benefit_box .img img {max-width:100%}
.recruit .benefit_box .one_box .txt {margin-top:15px; font-size:13px; color:#c8c8ca;}
.recruit .benefit_box .one_box .txt strong {color:#35353a; font-size:17px; display:block; margin-bottom:3px}

.recruit .process_box {margin-top:80px; overflow:hidden; text-align:center;}
.recruit .process_box ul {overflow:hidden; padding-top:60px}
.recruit .process_box li {float:left; width:20%; list-style:none;}
.recruit .process_box .one_box {border-radius:100px; background:#fff; border:4px solid #9aa0aa; height:80px; line-height:90px; font-size:19px; color:#2b2d30; position:relative;}
.recruit .process_box .number {width:40px; height:40px; line-height:40px; color:#fff; background:#000; font-family:"lato"; font-size:21px; border-radius:100px;}
.recruit .process_box .number {position:absolute; left:50%; top:-20px; margin-left:-15px}
.recruit .process_box .second_box {color:#6a6c6f; font-weight:300; font-size:15px; padding:40px 10px 0 10px; position:relative;}
.recruit .process_box .second_box:before {content:""; width:1px; height:20px; position:absolute; left:50%; top:0; background:#6a6f7c; }
.recruit .process_box .second_box:after {content:""; background:#6a6f7c; position:absolute; left:50%; top:20px; width:7px; height:7px; border-radius:100px; margin-left:-3px}
.recruit .process_box .bg1 .one_box {border:4px solid #9aa0aa; }
.recruit .process_box .bg2 .one_box {border:4px solid #9ab8c1; }
.recruit .process_box .bg3 .one_box {border:4px solid #6ba5ca; }
.recruit .process_box .bg4 .one_box {border:4px solid #2281bd; }
.recruit .process_box .bg5 .one_box {border:4px solid #4a68c0; }
.recruit .process_box .bg1 .number {background:#9aa0aa; }
.recruit .process_box .bg2 .number {background:#9ab8c1; }
.recruit .process_box .bg3 .number {background:#6ba5ca; }
.recruit .process_box .bg4 .number {background:#2281bd; }
.recruit .process_box .bg5 .number {background:#4a68c0; }

.recruit .qna_box {margin-top:80px; overflow:hidden; background:#767677 url('../images/recruit/qna_bg.jpg') center top no-repeat; background-size:100%; text-align:center;}
.recruit .qna_box .title {text-align:center; overflow:hidden; position:relative;}
.recruit .qna_box .title .txt {color:#fff; font-size:37px; font-weight:300; position:absolute; left:0; top:20%; width:100%;}
.recruit .qna_box .title img {float:left; width:100%;}
.recruit .qna_box .email {background:#3096cb; color:#fff; font-size:17px; padding:15px 30px 12px 30px; border-radius:20px 20px 0 0;}
.recruit .qna_box .qna_list {background:#fff; border-radius:20px; margin:0 40px 40px 40px; overflow:hidden; text-align:left; padding:50px 30px;}
.recruit .qna_box .qna_list li {overflow:hidden; list-style:none;}
.recruit .qna_box .qna_list .one_box {position:relative; padding-left:50px}
.recruit .qna_box .qna_list .num {position:absolute; left:0; top:0; font-family:"lato"; color:#3096cb; font-size:23px;}
.recruit .qna_box .qna_list .one_box dt {font-size:19px; color:#373845;}
.recruit .qna_box .qna_list .one_box dd {background:#f8f8f8; color:#71717a; font-size:15px; padding:15px 20px; margin-top:10px}
.recruit .qna_box .qna_list li+ li {margin-top:20px}


@media screen and (max-width:1000px) {
.recruit {padding-top:0; margin-top:0;}
.recruit .first_box {margin-top:0}

.recruit .keypoint_box {margin-top:20px;}
.recruit .keypoint_box .one_box {margin:0}
.recruit .keypoint_box ul {margin-left:0;}
.recruit .keypoint_box .one_box dt {font-size:23px;}

.recruit .rull_box .manage {margin-left:10px; margin-right:10px}
.recruit .rull_box .vision {margin-left:10px; margin-right:10px}

.recruit .who_box {margin:40px 10px 10px 10px;}

.recruit .benefit_box {margin:40px 10px 10px 10px;}
.recruit .benefit_box .title_box .txt {font-size:25px;}
.recruit .benefit_box .one_box .txt {font-size:12px;}
.recruit .benefit_box .one_box .txt strong {font-size:15px;}

.recruit .process_box {margin-top:40px }
.recruit .process_box ul {margin:0 10px;}
.recruit .process_box .one_box {font-size:17px;}
.recruit .process_box .second_box {font-size:13px; font-weight:400;}

.recruit .qna_box {margin-top:40px; background-size:120%; }
.recruit .qna_box .email {font-size:13px; display:block; margin:0 10px}
.recruit .qna_box .title img {margin:20px 0 20px 0}
.recruit .qna_box .qna_list {margin:0 10px 20px 10px; border-radius:0 0 20px 20px; padding:20px;}
.recruit .qna_box .qna_list .one_box {padding-left:30px}
.recruit .qna_box .qna_list .num {font-size:17px;}
.recruit .qna_box .qna_list .one_box dt {font-size:14px; padding-top:3px}
.recruit .qna_box .qna_list .one_box dd {font-size:12px; padding:10px 15px; margin-top:5px}
}


@media screen and (max-width:800px) {
.recruit em {display:inline;}
.recruit .first_box .txt {font-size:25px;}
.recruit .first_box {border-left:0; border-top:0; border-right:0; }
.recruit .first_box .inner {background-size:20px; padding-top:25px}

.recruit .keypoint_box em {display:block;}
.recruit .keypoint_box .img {margin:0}
.recruit .keypoint_box .img img {height:90px}
.recruit .keypoint_box .one_box dd {font-size:15px; margin-top:5px}

.recruit .group_title .txt {font-size:23px; font-weight:400;}

.recruit .rull_box .manage .txt {font-size:15px;}
.recruit .rull_box .manage .txt em {display:block;}
.recruit .rull_box .vision .one_box dt {font-size:21px;}
.recruit .rull_box .vision .one_box dd {font-size:15px;}
.recruit .rull_box .last_txt {background-size:60px; padding-top:50px; margin:0 15px; font-weight:400; font-size:14px;}

.recruit .who_box .title_box {position:static; width:100%; background-size:100px;}
.recruit .who_box .title_box .txt {font-size:19px; font-weight:400; padding:25px 20px 20px 20px; margin:0; background-size:20px; margin:20px 0 120px 0}
.recruit .who_box ul {margin-left:0; text-align:center;}
.recruit .who_box li {padding:20px;}
.recruit .who_box .opt {position:static; font-size:17px; margin:0; padding:10px 20px;}
.recruit .who_box .value {margin:10px 0 0 0}
.recruit .who_box .value dt,.recruit .who_box .value dd {font-size:14px; padding:2px 0;}

.recruit .benefit_box .title_box .txt {font-size:21px; background-size:20px; padding-top:25px;}
.recruit .benefit_box .one_box .txt {margin-top:10px; }

.recruit .process_box ul {padding-top:30px}
.recruit .process_box li {float:none; width:100%;}
.recruit .process_box .one_box {height:40px; line-height:45px; }
.recruit .process_box .number {left:-1px; margin:0; top:0px}
.recruit .process_box .second_box {padding:20px 10px 10px 10px}
.recruit .process_box .second_box:before {height:10px;}
.recruit .process_box .second_box:after {top:10px; width:5px; height:5px; margin-left:-2px}

.recruit .qna_box .title .txt {font-size:25px; font-weight:400;;}
}


@media screen and (max-width:700px) {
.recruit .keypoint_box .one_box dd {font-size:13px;}

.recruit .rull_box {margin-top:20px;}
.recruit .rull_box .manage {margin-top:30px}
.recruit .rull_box .manage ul {margin-left:0}
.recruit .rull_box .manage li {float:none; width:100%; padding-top:20px;}
.recruit .rull_box .manage li:before {left:50%; top:0; background-size:16px; margin-left:-8px; width:16px; height:16px; margin-top:2px}
.recruit .rull_box .manage li:first-of-type { padding-top:0}
.recruit .rull_box .manage li:first-of-type:before {display:none;}
.recruit .rull_box .manage .one_box {position:static; height:auto; padding:15px 10px; box-sizing:border-box;}
.recruit .rull_box .manage .txt {position:static; margin-top:0; font-size:15px;}
.recruit .rull_box .manage .txt em {display:inline}
.recruit .rull_box .fake {overflow:hidden; margin:0}
.recruit .rull_box .fake_img {display:none;}

.recruit .rull_box .vision {margin-top:20px}
.recruit .rull_box .vision li {float:none; width:100%;}
.recruit .rull_box .vision .one_box {border-top:1px solid #d2d4dd; border-left:0; padding:10px;}
}


@media screen and (max-width:600px) {
.recruit .keypoint_box li {float:none; width:100%;}
.recruit .keypoint_box .one_box {padding:10px 20px 20px 20px; border-radius:30px; margin:5px 15px}

.recruit .first_box .txt {font-size:19px; font-weight:400;}
.recruit .first_box {border-left:0; border-top:0; border-right:0;}
.recruit .keypoint_box .one_box dt {font-weight:400;}
.recruit .keypoint_box .one_box dd {font-weight:400;}

.recruit .benefit_box .title_box {position:static; width:100%; height:auto}
.recruit .benefit_box .title_box .txt {margin:20px 0}
.recruit .benefit_box li {width:50%; height:120px;}
.recruit .benefit_box .bg {background:none;}
.recruit .benefit_box .one_box {padding:5px;}
.recruit .benefit_box .one_box .txt {font-size:11px; line-height:1.1;}
.recruit .benefit_box .one_box .txt strong {font-size:14px;}
.recruit .benefit_box .blank {display:none;}
.recruit .benefit_box .img img {width:40px}
}








/* ● 계산기 */
.visual_charge { background-image:url('../images/bg_sub_visual06.jpg'); background-repeat:no-repeat; background-position: center top;}

.charge_main {overflow:hidden; padding:40px 0 60px 0; text-align:center;}
.charge_main ul {margin-left:-26px; overflow:hidden;}
.charge_main li {list-style:none; float:left; position:relative; overflow:hidden;}
.charge_main .if_col2 li {width:50%;}
.charge_main .if_col3 li {width:33.3333%; margin-top:60px}
.charge_main .one_box {margin-left:26px;}
.charge_main .one_box dt {font-size:21px; color:#303235; font-weight:300; margin-top:45px}
.charge_main .one_box dt strong {font-weight:400;}
.charge_main .one_box dd {font-size:15px; color:#8e9196; font-weight:300; margin-top:5px}
.charge_main .one_box .img {position:relative;}
.charge_main .one_box .img img {max-width:100%; width:100%;}
.charge_main .one_box .img .first {display:block;}
.charge_main .one_box .img .second {display:none}
.charge_main .one_box .icon {background:#42bfec; position:absolute; left:50%; bottom:-34px; width:68px; height:68px; border-radius:100px; margin-left:-34px}
.charge_main .one_box .ic1 {background-image:url('../images/charge_main_ic1.png');}
.charge_main .one_box .ic2 {background-image:url('../images/charge_main_ic2.png');}
.charge_main .one_box .ic3 {background-image:url('../images/charge_main_ic3.png');}
.charge_main .one_box .ic4 {background-image:url('../images/charge_main_ic4.png');}
.charge_main .one_box .ic5 {background-image:url('../images/charge_main_ic5.png');}

@media screen and (max-width:1000px) {
.charge_main {padding:30px 0 40px 0;}
.charge_main {margin:10px}
.charge_main .one_box {margin-left:10px;}
.charge_main ul {margin-left:-10px}
}

@media screen and (max-width:800px) {
.charge_main {padding:20px 0 30px 0;}
.charge_main .one_box dt {font-size:19px;}
.charge_main .one_box dd {font-size:13px;}
}

@media screen and (max-width:600px) {
.charge_main {padding:0 0 20px 0;}
.charge_main ul {margin-left:0}
.charge_main li {float:none !important; width:100% !important;}
.charge_main .if_col2 li {width:100%}
.charge_main .if_col3 li {width:100%; margin-top:0}
.charge_main .one_box {margin-left:0; margin-top:20px}
.charge_main .one_box dt {margin-top:35px}
.charge_main .one_box dd {margin:0}
.charge_main .one_box .img .first {display:none;}
.charge_main .one_box .img .second {display:block}
.charge_main .one_box .icon {width:50px; height:50px; bottom:-25px; margin-left:-25px; background-size:50px;}
}







/* 팝업창 */
.popup_box {position:fixed; left:0; top:0; width:100%; height:100%; z-index:99; background:transparent url('../images/charge/opacity80w.png') left top repeat; box-sizing:border-box;}
.popup_box .inner_box {border-radius:10px; box-shadow:0 0 10px rgba(0,0,0,0.5); overflow:hidden; position:absolute; left:50%; top:50%; width:550px; margin:-320px 0 0 -275px; border:2px solid #2f2e37;}
.popup_box .inner_box .title {background:#9ad1e5 url('../images/charge/popup_img.png') center bottom no-repeat; text-align:center; color:#fff; font-size:20px; font-family: "NanumSquare"; height:310px; position:relative;}
.popup_box .inner_box .btn_close {position:absolute; right:0; top:5px; padding:15px 15px;}
.popup_box .inner_box .btn_close .shape {width:17px; height:17px; position:relative; z-index:9; background:transparent url('../images/charge/ic_close.png') center center no-repeat;}
.popup_box .inner_box .icon {overflow:hidden; width:96px; height:96px; background:transparent url('../images/charge/popup_ic.png') left top no-repeat; position:absolute; left:50%; bottom:-45px; z-index:2; margin-left:-48px}
.popup_box .conts_box {background:#fff; overflow:hidden; border-bottom:1px solid #ccc; position:relative; padding:80px 30px 30px 30px; text-align:center; }
.popup_box .conts_box dl {overflow:hidden;}
.popup_box .conts_box dt {font-size:21px; color:#000; letter-spacing:-1px;}
.popup_box .conts_box dd {font-size:17px; color:#888; letter-spacing:-1px; margin-top:5px}
.popup_box .conts_box ul {overflow:hidden; display:inline-block; margin-top:25px}
.popup_box .conts_box li {list-style:none; float:left; position:relative; padding:0 10px}
.popup_box .conts_box li+ li:before {content:""; width:8px; height:1px; background:#000; position:absolute; left:-3px; top:50%;}
.popup_box .conts_box .input_design {height:40px; background:#e3e2ed; width:100px; border:1px solid #bab9c2; border-right:0; border-bottom:0; font-size:21px; text-align:center; color:#000;}
.popup_box .conts_box .input_design:focus {background:#cfcddc;}
.popup_box .btn_box {overflow:hidden; margin-top:20px;}

@media screen and (max-width:650px) {
.popup_box .inner_box .title {height:280px; background-size:240px;}
.popup_box .inner_box {width:400px; margin:-320px 0 0 -200px;}
.popup_box .inner_box .icon {background-size:60px; width:60px; height:60px; margin-left:-30px; bottom:-30px}
.popup_box .conts_box {padding-top:60px}
.popup_box .conts_box dt {font-size:19px;}
.popup_box .conts_box dd {font-size:15px;}
.popup_box .conts_box .input_design {width:70px;}
}
@media screen and (max-width:450px) {
.popup_box .inner_box {width:300px; top:15px; margin:0 0 0 -150px;}
.popup_box .inner_box .title {height:150px; background-size:130px;}
.popup_box .inner_box .icon {background-size:40px; width:40px; height:40px; margin-left:-20px; bottom:-20px}
.popup_box .conts_box {padding:40px 20px 20px 20px}
.popup_box .conts_box dt {font-size:15px;}
.popup_box .conts_box dd {font-size:13px;}
.popup_box .conts_box ul {margin-top:15px}
.popup_box .conts_box .input_design {width:50px; font-size:15px;}
.popup_box .btn_box {margin-top:15px;}
}