@charset "utf-8";

/* main_visual */
#main_visual {background:url(../images/main/main_visual.jpg) 50% 100% no-repeat; background-size:cover; text-align:center;}
#main_visual > div {height:970px;}
#main_visual .text_group {position:relative; top:50%; transform:translateY(-50%); color:#fff; text-transform:uppercase;}
#main_visual .text_group > span {font-size:20px; font-weight:300; opacity:0.5; letter-spacing:4px;}
#main_visual .text_group .tit {font-size:60px; font-weight:700; line-height:1.1;}
#main_visual .text_group .desc {font-size:26px; margin-top:20px;}

/* 사업분야_타이틀 */
.sv_intro {background:url(../images/main/main_bg_pattern.png) 50% 100% no-repeat; background-size:cover;}
.sv_intro > div {padding-top:4.5%; padding-bottom:4.5%;}
.sv_intro > div h2 {font-size:55px; line-height:1.1; text-transform:uppercase;}
.sv_intro > div h2 + p {font-size:20px; max-width:570px; margin-top:20px; word-break:keep-all;}
/* 사업분야_리스트 */
.sv_list > ul {overflow:hidden;}
.sv_list > ul > li {float:left; width:25%; text-align:center; overflow:hidden;}
.sv_list > ul > li > div {display:block; height:700px; padding:90px 30px; background-size:cover !important; transform:scale(1); -webkit-transform:scale(1); transition:transform .3s linear; -webkit-transition:transform .3s linear;}
.sv_list > ul > li > div:hover, .sv_list > ul > li > div.focusin {transform:scale(1.1); -webkit-transform:scale(1.1);}
.sv_list > ul > li.bn_moms > div {background:url(../images/main/sv_moms_bg.jpg) 50% 0 no-repeat;}
.sv_list > ul > li.bn_mes > div {background:url(../images/main/sv_mes_bg.jpg) 50% 40% no-repeat;}
.sv_list > ul > li.bn_crm > div {background:url(../images/main/sv_crm_bg.jpg) 100% 40% no-repeat;}
.sv_list > ul > li.bn_web > div {background:url(../images/main/sv_web_bg.jpg) 50% 0 no-repeat;}
.sv_list > ul > li > div .text_group {color:#fff; position:relative; bottom:-3em; transition:bottom .3s linear; -webkit-transition:bottom .3s linear;}
.sv_list > ul > li > div:hover .text_group, .sv_list > ul > li > div.focusin .text_group {bottom:0;}
.sv_list > ul > li .text_group > span {font-size:14px; color:rgba(255,255,255,0.6); letter-spacing:2px;}
.sv_list > ul > li .text_group h3 {font-size:36px; color:#fff;}
.sv_list > ul > li .text_group h3 + p {margin-top:4%; word-break:keep-all;}
.sv_list > ul > li .text_group .btn_more {display:block; width:42px; height:42px; margin:50px auto 0; opacity:0; transition:1.5s;}
.sv_list > ul > li > div:hover .text_group .btn_more, .sv_list > ul > li > div.focusin .text_group .btn_more {opacity:1; transition-delay:0.3s;}
.sv_list > ul > li .text_group .btn_more > span {display:inline-block; background-position:0 0; width:13px; height:39px; text-indent:-9999px;}

/* 온라인문의 */
.contact_group > div {position:relative; max-width:1280px; margin-top:4.5%; margin-bottom:4.5%;}
.contact_group > div:before {content:''; background:#c7c7c7; width:1px; height:100%; position:absolute; top:0; left:32%;}
.contact_group > div:after {content:''; display:block; clear:both;}
.contact_group .infos {float:left; width:32%;}
.contact_group .contact {float:right; width:62%;}
.ciinfo {background:#fff; position:relative; height:80px; margin:13px; padding-left:25px; font-size:21px; color:#111; line-height:1.1;}
.ciinfo:before {content:''; background:#1a1a1a; width:30px; height:106px; position:absolute; top:-13px; left:-13px; z-index:-1;}
.ciinfo > p:first-child strong {font-size:34px;}
.ciinfo strong {display:inline-block; font-size:40px; font-family:Arial, Helvetica, sans-serif; text-transform:uppercase;}
.contact_group .infos h3 {font-size:21px; margin-top:40px; margin-bottom:15px;}
.contact_group .infos .addr dt {color:#111; font-weight:700; margin-bottom:5px;}
.contact_group .infos ul, .contact_group .infos > ul a {color:#111; font-weight:700;}
.contact_group .infos ul > li {position:relative;}
.contact_group .infos ul > li > span {display:inline-block; margin-right:5px;}
.contact_group .infos .time {margin-top:20px;}
.contact_group .contact .save_btn {margin-top:20px; overflow:hidden;}
.contact_group .contact .save_btn .chkbox {float:left; margin-top:10px;}
.contact_group .contact .save_btn .btns {float:right; width:180px; height:54px; line-height:54px; font-size:18px; border-radius:5px;}
.contact_group .contact .save_btn label > a {display:inline-block; padding:2px 10px; margin-left:10px; background:#f7f7f7; border:1px solid #ccc; font-size:13px;}
/* 온라인문의_입력 */
.input_con {margin-top:10px;}
.input_con > div {margin-top:5px; text-align:left; position:relative; padding:5px; padding-left:75px; border-bottom:1px solid #e5e5e5; min-height:45px;}
.input_con > div:first-child {margin-top:0;}
.input_con > div.s02 {padding-left:0; border-bottom:0; padding:0; overflow:hidden;}
.input_con > div.s02 > div {float:left; width:47%; margin-left:6%; position:relative; padding:5px; padding-left:75px; border-bottom:1px solid #e5e5e5;}
.input_con > div.s02 > div:first-child {margin-left:0;}
.input_con > div > label, .input_con > div.s02 > div > label {display:block; color:#555; position:absolute; top:14px; left:0;}
.input_con input, .input_con select, .input_con textarea {border:0; font-size:16px; width:100%; padding:10px 5px;}

@media screen and (max-width:1024px) {
/* main_visual */
#main_visual > div {height:500px;}
#main_visual .text_group > span {font-size:14px;}
#main_visual .text_group .tit {font-size:30px;}
#main_visual .text_group .desc {font-size:18px;}

/* 사업분야_타이틀 */
.sv_intro > div h2 {font-size:30px;}
.sv_intro > div h2 + p {font-size:16px;}
/* 사업분야_리스트 */
.sv_list > ul > li {float:none; width:auto; margin:15px;}
.sv_list > ul > li > div {height:270px; padding:40px 15px;}
.sv_list > ul > li > div .text_group {bottom:-1.5em;}
.sv_list > ul > li .text_group h3 + p {margin-top:15px;}
.sv_list > ul > li .text_group h3 + p br {display:none;}
.sv_list > ul > li .text_group .btn_more {margin-top:30px; opacity:1;}

/* 온라인문의_입력 */
.input_con > div.s02 > div {float:none; width:auto; margin-left:0;}
}

@media screen and (max-width:980px) {

}

@media screen and (max-width:768px) {
/* main_visual */
#main_visual .text_group .tit {font-size:24px;}
#main_visual .text_group .desc {font-size:14px;}

/* 사업분야_타이틀 */
.sv_intro > div {padding-top:7%; padding-bottom:7%;}
.sv_intro > div h2 {font-size:24px;}
.sv_intro > div h2 + p {font-size:14px;}
/* 사업분야_리스트 */
.sv_list > ul > li .text_group > span {font-size:12px;}
.sv_list > ul > li .text_group h3 {font-size:27px;}
.sv_list > ul > li .text_group h3 + p br {display:block;}

/* 온라인문의 */
.contact_group > div {margin-top:12%; margin-bottom:12%;}
.contact_group > div > div, .contact_group .contact {float:none !important; width:auto !important;}
.contact_group > div:before {display:none;}
.contact_group .infos {text-align:center;}
.contact_group .infos h3 {font-size:18px;}
.ciinfo {margin:9px; height:60px; display:inline-block;}
.ciinfo:before {width:30px; height:78px; position:absolute; top:-9px; left:-9px;}
.ciinfo > p:first-child strong {font-size:24px;}
.ciinfo strong {font-size:30px;}
.contact_group .contact {margin-top:8%;}
.contact_group .contact .save_btn .chkbox {float:none; margin-bottom:15px;}
.contact_group .contact .save_btn .btns {float:none; width:100%; height:42px; line-height:42px; font-size:14px;}
/* .contact_group .type_chk > span {display:block;}
.contact_group .type_chk > span + span {margin-top:5px;} */
}

/* 메인 레이어 팝업 */
.main-layer-popup {width:90%; max-width:420px; position:absolute; top:170px; left:100px; z-index:9; visibility:hidden; overflow:hidden; border-radius:3px; box-shadow:rgba(134, 134, 134, 0.4) 3px 4px 5px, rgba(134, 134, 134, 0.25) -2px -1px 4px;}
.layer_popup_inner img {max-width:100%;}
.layer_pop_func {overflow:hidden; padding:10px 15px; background:#fff; font-size:12px; font-family:dotum;}
.today_close {float:left;}
.today_close label {cursor:pointer;}
.today_close, .today_close + a {color:#777;}
@media all and (max-width:768px) {
.main-layer-popup {left:2% !important; top:6% !important; margin-left:0; width:auto !important; max-width:96% !important; height:auto !important; }
.main-layer-popup .layer-popup-inner-img img{max-width:100%; width:auto; height:auto;}
}