<meta charset="utf-8">


/*인사말*/
.greeting{position:relative; max-width:1200px}
.greeting .img{position:relative; height:324px; margin-top:110px; background:url(../img/bg_greeting.jpg) no-repeat 50%; background-size:cover;}
.greeting .img:before{content:''; display:block; position:absolute; bottom:0; left:135px; width:400px; height:400px; background:url(../img/bg_chairman.png) no-repeat;}
.greeting .tit{position:absolute; top:370px; right:100px; width:514px; height:314px; background:#4168ad}
.greeting .tit h3{position:relative; margin:0; padding:140px 20px 0 50px; color:#fff; font-size:22px; font-weight:100;  line-height:1.6; word-break:keep-all; box-sizing:border-box; text-align:left; letter-spacing:-1px}
.greeting .tit h3:before{content:''; display:block; position:absolute; top:-23px; left:50px; width:1px; height:144px; margin:0; background:#fff;}
.greeting .tit h3 span{display:block; font-weight:600;}
.greeting .colum { padding:80px 20px 70px 20px;  max-width:1100px; margin:0 auto}
.greeting .colum:after{clear:both; content:""; display:block;}
.greeting .colum .left{float:left; width:48%; text-align:justify; }
.greeting .colum .right{float:right; width:48%; text-align:justify; }
.greeting .sign {text-align:right; font-size:1.125em; font-weight:bold; color:#222; margin-top:60px; padding-right:20px;  background-repeat:no-repeat; background-position:right center; line-height:50px;}
.greeting .sign .name { font-size:24px}

@media (max-width: 980px){
   	.greeting .tit{position:relative; width:100%; height:auto; padding:0 50px 50px 0px; top:0; right:0;}
	.greeting .tit h3{font-size:22px; line-height:1.6em;}
	.greeting .tit h3 br{display:none;}
	.greeting .img { height:253px}
	.greeting .img:before{left:50%; width:300px; height:310px; margin-left:-150px; background-size:cover;}
	.greeting .colum .left { width:100%; clear:both}
	.greeting .colum .right { width:100%; padding-top:20px; clear:both}

}
/*인사말*/





/*그룹소개*/
.company_info  { width:100%; height:auto; display: flex; justify-content: space-between; }
.company_info .img_page { flex-basis: 49%;} 
.company_info .txt_page { flex-basis: 49%; margin:0 auto; padding:20px 0 20px 30px}
.company_info .txt_page p {font-size:21px; font-weight:400; line-height: 1.6; margin-bottom:25px;}
.company_info .txt_page p span {font-weight: bold;}
.company-bar {height:60px; width:1px; background: #000; margin:0 auto 100px}

.misson_wrap {margin:150px auto;}
.misson_wrap li {
    border:1px solid #D9D9D9; border-radius: 20px; padding:30px 120px; display: flex; justify-content: space-between;
    margin-bottom: 20px; align-items: center;
}
.misson_wrap li img {height:62px;margin-right:80px; text-align: center;}
.misson_wrap li:last-child img {margin-right:104px}
.misson_wrap li h3 {font-size:28px; font-weight: bold; flex-basis:25%;}
.misson_wrap li p {font-size:19px; line-height: 1.4; flex-basis:60%;}

.society_wrap {text-align: center;margin-bottom:150px}
.page_sub {font-size:28px; }
.society_wrap p {font-size:18px; line-height: 1.4; margin:20px auto 37px}
.society_wrap ul {display: flex; justify-content: space-between;}
.society_wrap ul li {flex-basis: 48%;}
.society_wrap ul li img {width:100%}

.process_wrap {background:url(../img/fhj.jpg) no-repeat center center; background-size: cover; text-align: center;}
.process_wrap .page_sub {margin-bottom: 40px;}
.process_wrap ul {
    padding:0 0 180px; border-bottom:1px solid #D9D9D9; border-left:1px solid #D9D9D9;
    display: flex; flex-wrap: wrap;
}
.process_wrap li {flex-basis:33.3333%; background: #fff; padding:40px;border-top:1px solid #D9D9D9; border-right: 1px solid #d9d9d9;}
.process_wrap li h3 {font-size:20px;}
.process_wrap li img {height: 62px; margin:50px 0 30px}
.process_wrap li p {font-size:17px; line-height: 1.6; color:#555}
.process_wrap ul:after {clear: both; content:''; display: block;}

/*기존연혁*/
.history_area {position: relative;width: 100%;padding-top: 37px;}
.history_area .history_point {position: absolute;left: 50%;top: 0;margin-left: -5px;bottom: 20px;width:8px;background-color: #f6f6f6;overflow: hidden;}
/*.history_area .history_point span {position: absolute;display: block;top: 0;width: 100%;height: 200px; background-color:#039}*/
.history_area dl {width: 50%;padding-right: 94px;padding-left: 20px;box-sizing:border-box;}
.history_area div:nth-child(odd) dl {padding-right: 20px;padding-left: 94px;}
.history_area dt {margin-bottom: 20px;font-size: 46px;line-height:1.3;color: #555;font-weight: bold;}
.history_area dd strong {display: block;padding-bottom: 12px;font-size: 20px;line-height: 1.6;color: #1a1a1a;font-weight: bold;}
.history_area dd p {display: block;}
.history_area dd .img_box {display: block;margin-top: 39px;}
.right {text-align: right;}
.left {text-align: left;}
.fr {float: right;}
.img_box img { max-width: 100%}
@media (max-width: 960px){
	.history_area .history_point {left: 10px;margin-left: 0;}
	.history_area dl {float: none !important;width: 100%;padding-right: 0;padding-left: 50px;text-align: left;}
	.history_area div:nth-child(odd) dl {/* padding-right: 0; */padding-left: 50px;}
	.history_area div + div {margin-top: 40px;}
	.history_area div:nth-child(2) {margin-top: 0;}
	.history_area dt {margin-bottom: 20px;font-size:30px;}
	.history_area dd p br {display: none;}
	.history_area dd .img_box {margin-top: 20px;}	
}
/*기존연혁*/




/*연혁게시판*/
.bg_title {background: #F8F8F8; line-height: 90px; text-align: center; font-size:22px}

/*오시는 길*/
.location_area .contact_address {width:100%;height:auto; line-height:1.7;}
.location_area .contact_address ul {padding:0 20px 20px 0px;border-bottom:1px solid #ddd;}
.location_area ul li {color: #555; line-height:2.1;}
.contact_traffic .bus {width:100%;padding:0;}
.contact_traffic .subway {width:100%; padding-bottom:20px;}
.contact_traffic h3 { font-size:20px; font-weight:400; letter-spacing:-1px; color:#1a1a1a; padding-bottom:10px; margin-top:25px; text-align:left}/* í‘¸í„°íŒì—…*/

.map_info{width:283px;height:214px;background:#19cd61;position:absolute;right:0;top:0px;padding: 30px 28px;font-size:15px;color:#f8969a;letter-spacing:0;}
.map_info span{display:block;font-size:20px;color:#fff; font-weight:bold; letter-spacing:-.25px;}
.map_info p { padding-top:20px; color:#f2f2f2; line-height:1.4;}
.map_btn{position:absolute;left:30px;bottom:30px;}
.map_btn a{display:inline-block; padding:7px 10px; height:41px;border:1px solid #f2f2f2;text-align:center; color:#FFF; letter-spacing:-0.5px;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.map_btn a:hover{color:#000;background:#fff;border-color:#fff; text-decoration:none;
	-webkit-transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	transition: all 0.5s ease;
}
.map_btn a:first-child{margin-right:5px;}

/*오시는 길*/








/* content01 */
.business01 {margin:100px auto 150px}
.business01 ul{display: flex; justify-content: space-between;}
.business01 li {flex-basis: 48%; }
.business01 li h3 {font-size:22px; border-bottom: 1px solid #aaa; padding-bottom: 10px; margin-bottom: 12px;}
.business01 li p {font-size:18px; line-height: 1.45;}
.busi_process h4 {text-align: center;}
.busi_process ul {margin:30px auto 120px}
.busi_process li {display: flex; border:1px solid #ddd; margin-bottom: 20px;}
.busi_process li div {padding:23px 35px}
.busi_process li div h3 {font-size:20px; margin-bottom: 8px;}
.busi_process li div p {font-size: 17px; font-weight: 300; line-height: 1.4;}
.rep_project {text-align: center; margin-bottom: 50px;}
.rep_project > p {font-size: 20px; margin-top:30px; font-weight: bold;}
.rep_project ul {display: flex; justify-content: space-between; margin:40px auto 80px; flex-wrap: wrap;}
.rep_project ul li {flex-basis: 23%; border:1px solid #ddd; padding:25px 30px}
.rep_project ul li:last-child {margin-right:0}
.rep_project ul:last-child li {flex-basis: 49%; }
.rep_project ul li h4 {font-size:18px; line-height: 1.4; height:44px; font-weight: 500;}
.rep_project ul li h4 span {font-size:15px; font-weight: 300; display: block;}
.rep_project ul li img {margin:50px auto 20px; width:100%}
.rep_project ul li p {font-size:15.5px; line-height:1.5 ;}
.rep_project ul:last-child li img {height:200px}
.content_area {margin-bottom: 120px;}
/* content01 */


/*문의하기*/
.inquiry_wrap {margin:70px auto}
.top_contact {
    background: #F4F5F9; border-radius: 25px; padding:30px 0; text-align: center;
}
.top_contact h3 {font-size:23px; margin-bottom: 20px;}
.top_contact div {background: #fff; border-radius: 20px; line-height: 80px; display: inline-block; padding: 0 80px;}
.top_contact div img {height:22px; margin-right:5px; vertical-align: -5px;}
.top_contact div span {font-size:20px; padding-right:30px}
.top_contact div strong {color:#003F93; font-size:30px; vertical-align: -3px;}
.top_contact p {font-size:17px; margin-top:15px}
.contactbox {margin:60px auto 150px}
.contactbox h2 {font-size:26px; text-align: center; border-bottom:2px solid #000; padding-bottom: 25px;}
.contactbox .input_page {display: flex; padding:20px 10px; border-bottom: 1px solid #ccc;}
.contactbox .input_page h3 {flex-basis: 120px; margin-right:10px; font-size:16px; font-weight: bold; line-height: 42px;}
.contactbox .input_page input {width:470px; border:1px solid #ddd; height:42px; padding:0 8px}
.contactbox .input_page.essential h3 {position: relative;}
.contactbox .input_page.essential h3:after {position: absolute; left:47px; top:0; content:'*'; color:#004FB8; font-size:17px}
.contactbox .input_page.essential.namecan h3:after {left:34px}
.contactbox .input_page.essential.namecan input {width:240px}
.contactbox .input_page textarea {
    height:170px; width:calc(100% - 120px); border:1px solid #ddd; resize: none; padding:8px
}
.contactbox .input_page.file_box input {width:240px; line-height: 42px; padding:0 5px}
.captcha {margin:40px 0}
.privacybox {margin-bottom: 15px;}
.privacybox h3 {font-size:16px; margin-bottom:15px}
.privacybox div {border:1px solid #ddd; padding:15px 20px; height: 160px; overflow: auto;}
.check_page input {width:16px; height:16px}
.check_page label {font-size:15px; margin-left:5px}
.contactbox .send {width:250px; height:60px; display: block; margin:40px auto 80px; background: #000A31; color:#fff; font-size:18px}


@media screen and (max-width: 1300px) {
    .busi_process li div p br {display: none;}
    .rep_project ul li p br {display: none;}
}


@media screen and (max-width: 1200px) {
    .company-bar {margin:0 auto 55px}
    .company_info .img_page img {width:100%}
    .company_info .txt_page {padding:0 20px}
    .company_info .txt_page p {font-size: 18px;}
    .misson_wrap li img {height: 42px;}
    .misson_wrap li h3 {font-size:24px;}
    .misson_wrap li p {font-size:17px}
    .misson_wrap li p br {display: none;}
    .society_wrap ul li {flex-basis: 49%;}
    .page_sub {font-size:26px;}
    .process_wrap {background: #fff;;}
    .process_wrap ul {border-bottom: 1px solid #d9d9d9; padding:0; margin-bottom: 100px;}
    .process_wrap li h3 {font-size:17px}
    .business01 {margin:70px auto 100px}
    .business01 li h3 {font-size:19px}
    .business01 li p {font-size:17px}
    .busi_process li div h3 {font-size: 18px;}
    .busi_process li div p {font-size:15.5px; line-height: 1.5;}
    .rep_project > p {font-size:18px}
    .rep_project ul li {padding:15px 20px}
    .rep_project ul li h4 {font-size:17px}
    .rep_project ul li p {font-size:15px}
}

@media screen and (max-width: 969px) {
    .company_info {display: block;}
    .company_info .txt_page {padding:20px 0 0}
    .company_info .txt_page p {font-size: 16.5px;}
    .misson_wrap li {padding:20px 60px}
    .misson_wrap li img {margin-right: 50px;}
    .misson_wrap li:last-child img {margin-right: 65px;}
    .misson_wrap li p {font-size: 16px;}
    .page_sub {font-size: 23px;}
    .society_wrap p {font-size: 17px; margin: 10px auto 30px;}
    .process_wrap .page_sub {margin-bottom: 25px;}
    .process_wrap li {padding: 25px;}
    .process_wrap li h3 {font-size: 17px; line-height: 1.5;}
    .process_wrap li img {margin:30px 0 20px; height:52px}
    .misson_wrap li h3 {font-size: 21px;}
    .process_wrap li p {font-size: 15px;}
    .rep_project ul li {flex-basis: 49%;margin-bottom: 20px;}
    .rep_project ul li img {width:60%}
    .rep_project ul:last-child li img {height:auto}
    .busi_process li img {width:30%}
    .top_contact h3 {font-size: 21px; margin-bottom: 15px;}
    .top_contact {border-radius: 20px;}
    .top_contact div {line-height: 70px; border-radius: 10px;}
    .top_contact div img {height:20px}
    .top_contact div span {font-size:18px}
    .top_contact div strong {font-size:25px}
    .top_contact p {font-size:16px}
    .contactbox h2 {font-size:23px}
    .contactbox .send {height:50px; width:200px}
}

@media screen and (max-width: 768px) {
    .company-bar {margin:0 auto 35px; height:40px}
    .company_info .txt_page p {font-size: 16px;}
    .misson_wrap li {padding: 20px 30px;}
    .misson_wrap li img {margin-right: 30px;}
    .misson_wrap li:last-child img {margin-right: 45px;}
    .society_wrap {margin-bottom: 80px;}
    .society_wrap p br {display: none;}
    .misson_wrap {margin: 100px auto;}
    .process_wrap ul {border-right: 1px solid #d9d9d9; border-top: 1px solid #d9d9d9; border-left: 0;}
    .process_wrap li {flex-basis: 50%; border-bottom: 1px solid #d9d9d9; border-top: 0; border-right: 0; border-left: 1px solid #d9d9d9;}
    .process_wrap li:last-child {border-right: 1px solid #d9d9d9; border-bottom: 0;}
    .bg_title {font-size:20px}
    .busi_process li {display: block;}
    .busi_process li img {width:100%}
    .busi_process li div {padding:20px 25px}
    .content_area {margin-bottom: 70px;}
    .contactbox .input_page input {width:calc(100% - 120px)}
    .contactbox .input_page h3 {font-size:15px}
    .privacybox div {font-size:.9em}
    .top_contact div {padding:0 40px}
}

@media screen and (max-width: 600px) {
    .misson_wrap li {display: block;}
    .misson_wrap li img {margin-right:0 !important; margin-bottom: 10px;}
    .misson_wrap li h3 {margin-bottom: 5px;}
    .page_sub {font-size:21px}
    .society_wrap p {font-size:16px}
    .business01 {margin:40px auto 70px}
    .business01 ul {display: block;}
    .business01 li {margin-bottom: 30px;}
}

@media screen and (max-width: 499px) {
    .company_info .txt_page p {font-size:15px}
    .process_wrap li h3 {font-size:15px}
    .misson_wrap {margin:70px auto}
    .misson_wrap li h3 {font-size: 18px;}
    .misson_wrap li p {font-size:15px}
    .society_wrap {margin-bottom: 45px;}
    .process_wrap li p {font-size:14px}
    .process_wrap li img {height:40px}
    .bg_title {font-size: 18px;}
    .business01 li h3 {font-size:17px}
    .business01 {margin:0 auto 50px}
    .business01 li p {font-size:15px}
    .page_sub {font-size:19px}
    .busi_process ul {margin:15px auto 60px}
    .rep_project > p {margin-top:15px; font-size: 16px;}
    .rep_project ul {display: block; margin:15px auto 50px}
    .content_area {margin-bottom: 50px;}
    .busi_process li div h3 {font-size: 16.5px;}
    .busi_process li div p {font-size: 14px;}
    .busi_process li div {padding:15px 12px}
    .rep_project ul li p {font-size:14px}
    .top_contact h3 {font-size:19px}
    .top_contact div  {line-height: 60px; padding:0 20px}
    .top_contact div img {height:16px; vertical-align: -3px;}
    .top_contact div span {padding-right: 20px; font-size: 16px;}
    .top_contact div strong {font-size:18px}
    .top_contact p {font-size:14.5px}
    .contactbox h2 {font-size:20px; padding-bottom: 15px;}
    .contactbox .input_page h3 {width:100px}
    .contactbox .input_page input {width: calc(100% - 100px) !important;}
    .contactbox .input_page textarea {width: calc(100% - 100px);}
}

@media screen and (max-width: 360px) {
    .process_wrap ul {display: block;}
    .process_wrap li:last-child {border-right: 0;}
    .top_contact {padding:15px}
    .top_contact h3 {font-size:18px}
    .top_contact div {line-height: normal; padding:20px; width:100%}
    .top_contact div span {padding-right:0}
    .top_contact div strong {display: block; margin-top:15px}
    .top_contact p {font-size:14px}
    .contactbox h2 {font-size:18px}
    .contactbox .input_page h3 {width:60px;}
    .contactbox .input_page input {width: calc(100% - 60px) !important;}
    .contactbox .input_page textarea {width: calc(100% - 60px);}
}