.sub {overflow-x: hidden;}
  

.sub_visual  {width:100%; height:300px; background:url('/common/img/sub/sub_vi1.png') no-repeat center; background-size:cover !important}
.sub_visual.bg2  {  background:url('/common/img/sub/sub_vi2.png') no-repeat center; }
.sub_visual.bg3  {  background:url('/common/img/sub/sub_vi3.png') no-repeat center; }
.sub_visual.bg4  {  background:url('/common/img/sub/sub_vi4.png') no-repeat center;background-color:#ddd;  }
.sub_visual.bg5  {  background:url('/common/img/sub/sub_vi5.png') no-repeat center; }
.bottom_img {position:absolute;  z-index:99; left:0; bottom:0; width:100%}

.sub_wrap  {margin:50px 0 70px 0}
.sub section {padding:60px 0; line-height:1.5}
.guide { font-size:4em; line-height:1; margin-bottom:70px; font-family: 'MaplestoryOTFBold';}
.arti_tit {font-size:2.5em; line-height:1; margin-bottom:70px; font-family: 'MaplestoryOTFBold';}
.arti_tit span {font-size:.7em; font-weight:400}
.arti_tit + h4 {margin-top:-55px; font-size:1.6em}

.about, .company {font-size:17px}


@media screen and (max-width:640px){
		.sub section {padding:50px 0; }
		.sub_wrap  img {max-width:100%}
		.guide { font-size:2.6em;  }
		.arti_tit {font-size:2.2em; line-height:1.3;  margin-bottom:40px  }
		.arti_tit span {font-size:16px;  }
		.about, .company {font-size:16px}
		.arti_tit + h4 {margin-top:-20px; font-size:1.3em; line-height:1.4}
		.sub_visual  { height:200px;  background-size:cover !important }


}



.about {color:#333}
.about .guide {color:var(--main_c1)}
.about .arti_tit {color:var(--main_c1)}

.about .section1 p {color:#f3a16f; font-size:1.5em; font-weight:600 }

.about .section2 {background:url('/common/img/main/mainVision01.png'); background-attachment:fixed; background-size: cover; background-position: center; position:relative; padding:100px 0;  margin-top:20px }
.about .section2 .arti_tit {color:#fff}
.about .section2 .inner {padding-top:100px; padding-bottom:100px}
.about .section2 .text_box {color:#fff; width:100%; line-height:1.7; font-size:1.04em; text-shadow:2px 2px 3px rgba(0,0,0,.2) }
.about .section2 .top_img {position:absolute; transform: rotate(180deg); z-index:99; left:0; top:-1px; width:100%}
.about .section2 .text_box b {font-size:1.5em; line-height:1.6; font-weight:700; display:block; }

.about .section3 {padding-top:150px; background-color:#fff; position:Relative; z-index:99; margin-top:-1px}
.about .section3 .text_box {background-color:#fffcdc; box-shadow:2px 2px 10px #ddd; width:95%; margin:0 auto; margin-top:-30px; position:Relative; z-index:99; border-radius:50px; box-sizing:border-box; padding:60px 10% 70px 10% }
.about .section3 h4 {color:#f3a16f; margin-bottom:40px}
.about .section3 img {max-width:90%}

@media screen and (max-width:640px) {
		.about .section2 {  background-attachment:local; background-size: cover; background-position: center; position:relative; margin-top:30px }

		.about .section1 p {  font-size:1.2em; }
		.about .section1 p br {display:none}
		.about .section2 { padding:50px 4%;  }
		.about .section2 .text_box {font-size:1em }
		.about .section3 {padding-top:80px;  }


}

.company {color:#333}
.company .guide {color:var(--main_c2)}
.company .arti_tit {color:var(--main_c2)}
.company .arti_tit + h4 {color:var(--main_c2)}

.company .img_box {width:60%; padding-bottom:46%; flex-shrink:0; position:Relative}
.company .img_box  img {position:absolute; left:0; top:0; z-index:-9}
.company .img_box  p {position:absolute; color:#fff; text-align:center; display:flex; align-items:center; justify-content:center; line-height:1.3 }



.company .section1 ul {margin-top:50px}
.company .section1 ul li {display:flex; gap:6%; align-items:center; position:relative}
.company .section1 ul li div { }
.company .section1 ul li div b {width:100%; display:block; margin-bottom:10px; font-size:1.5em}
.company .section1 ul li:nth-child(2n) {justify-content:flex-end}
.company .section1 ul li:nth-child(2n) div {order:1; margin-left:0; text-align:right}
.company .section1 ul li:nth-child(2n) img {order:2}
.company .section1 ul li:nth-child(3) {padding-left:5%}


/*맨파워*/
.company .section2 .flex {align-items:flex-start; justify-content:space-between; }
 
.company .section2 .img_box  p { width:23%; font-size:20px;  }
.company .section2 .img_box  p:nth-child(1) { left:16%; top:3%; }
.company .section2 .img_box  p:nth-child(2) { left:0%; top:17%}
.company .section2 .img_box  p:nth-child(3) { right:0; bottom:20%}
.company .section2 .img_box  p:nth-child(4) { right:16%; bottom:2%}


/*조직도*/
.company .section3 {margin-top:-50px}
.company .section3 .arti_tit {margin-bottom:0; position:relative; z-index:99}
.company .section3 .img_box {width:75%; padding-bottom:55%; margin:0 auto;  margin-top:-20px }
.company .section3 .img_box  p { width:30%; height:100px; font-size:25px;  }
.company .section3 .img_box  p:nth-child(1) { left:0%; bottom:0 }
.company .section3 .img_box  p:nth-child(2) { left:35%; bottom:0}
.company .section3 .img_box  p:nth-child(3) { right:0; bottom:0}
 


/*사업영역*/
.company .section4 .flex  { align-items:center; justify-content:space-between; }
.company .section4 .flex .img_box + p { margin-right:2%}
.company .section4 .img_box {width:55%; padding-bottom:47%;  }
.company .section4 .img_box  p { width:28%;  height:145px; font-size:21px;   }
.company .section4 .img_box  p:nth-child(1) { left:20%; top:7% }
.company .section4 .img_box  p:nth-child(2) { right:10%; top:6%; height:180px}
.company .section4 .img_box  p:nth-child(3) { left:0; bottom:24%; height:180px}
.company .section4 .img_box  p:nth-child(4) { left:35%; bottom:3%}
.company .section4 .img_box  p:nth-child(5) { right:0; bottom:1.5%;  height:180px}

 
.company .section4 ul  {display:flex; gap:20px; margin-top:70px; margin-bottom:40px}
.company .section4 ul li  {width:20%;  background:url('/common/img/sub/one_bg.png') no-repeat center;  text-align:center; padding:60px 0 ;  display:flex; justify-content:center; align-items:center; color:#fff;  font-size:1.25em; line-height:1.3 }
.company .section4 ul li:nth-child(2)  { background:url('/common/img/sub/one_bg2.png') no-repeat center; }
.company .section4 ul li:nth-child(3)  { background:url('/common/img/sub/one_bg3.png') no-repeat center; }
.company .section4 ul li:nth-child(4)  { background:url('/common/img/sub/one_bg4.png') no-repeat center; }
.company .section4 ul li:nth-child(5)  { background:url('/common/img/sub/one_bg5.png') no-repeat center; }




/*업무프로세스*/

.company .section5  ul {margin-bottom:50px; display:flex; justify-content:center; gap:50px}
.company .section5  ul li {position:relative; width:150px;  height:150px; background-color:#F07E99; border-radius:50%; display:flex;   justify-content:center; align-items:center; text-align:center; color:#fff; font-size:1.3em; line-height:1.3}
.company .section5  ul li:after {content:' '; background:url('/common/img/sub/arrow.png') no-repeat center; background-size:100%;  position:absolute; text-align:center;  right:-35px; width:20px;  top:0; height:150px;}
.company .section5  ul li:last-child:after {display:none}

.company .section5  ul li:nth-child(2)  {background-color:#F89B41 }
.company .section5  ul li:nth-child(3)  {background-color:#95C63B }
.company .section5  ul li:nth-child(4)  {background-color:#51C3B6 }
.company .section5  ul li:nth-child(5)  {background-color:#6995C8 }
.company .section5  ul li:nth-child(6)  {background-color:#AD71BD }

.company .section5  ul li:before {content:'1'; position:absolute; left:0; top:-13px; font-size:55px; font-weight:600; color:#F399AE}
.company .section5  ul li:nth-child(2):before {content:'2'; color:#ffc664}
.company .section5  ul li:nth-child(3):before {content:'3'; color:#d3e36d }
.company .section5  ul li:nth-child(4):before {content:'4'; color:#8cd7c2 }
.company .section5  ul li:nth-child(5):before {content:'5'; color:#acbedd }
.company .section5  ul li:nth-child(6):before {content:'6'; color:#c9a3d4 }

.company .section5 a {margin-top:50px}

@media screen and (min-width:1200px) {

  .company .img_box img:last-child {display:none }


}

@media screen and (max-width:1200px) {

		.company .img_box {padding:0 !important}
 		.company .img_box p {display:none }
		.company .img_box img {display:none; position:static }
		.company .img_box img:last-child {display:block }
		.company .section4 ul {flex-wrap:wrap;  justify-content:center;}
		.company .section4 ul li  {width:25vw; height:25vw;  padding:0; background-size:100% !important; }
        
		.company .section5 ul {flex-wrap:wrap; gap:3%; margin-bottom:10px; justify-content:center;}
		.company .section5 ul li { width:20vw; margin-bottom:20px; height:20vw;   }
		.company .section5  ul li:after { background-size:15px;   right:-3vw; width:3vw;   height:20vw;}

}
 
@media screen and (max-width:640px) {

			.company .section1 ul li  {flex-wrap:wrap}

			.company .section1 ul li {display:flex; justify-content:center; margin-bottom:40px }
			.company .section1 ul li:last-child {  margin-bottom:0 }
			.company .section1 ul li div { width:100%; margin-top:40px}
			.company .section1 ul li div b { font-size:1.3em}
			.company .section1 ul li:nth-child(2n) {justify-content:center}
			.company .section1 ul li:nth-child(2n) div {order:2; width:100%; text-align:left}
			.company .section1 ul li:nth-child(2n) img {order:1}
			.company .section1 ul li:nth-child(3) {padding-left:0}
			

			.company .section3 .arti_tit {margin-bottom:40px}

	 
			.company .section4 .img_box  {width:100%; margin-bottom:30px}
			.company .section3 .img_box  {width:100%; }
			.company .section2 .img_box  {width:100%; margin-top:30px}

            .company .section4 ul {flex-wrap:wrap; gap:0; justify-content:space-between;}
			.company .section4 ul li {width:49%; height:43vw; font-size:1.1em; }
			.company .section4 ul li:nth-child(n+3) {margin-top:10px}

			.company .section5 ul {  gap:3%; }
			.company .section5 ul li { width:41vw;  height:41vw; font-size:1.2em }
			.company .section5 ul li:nth-child(n+3) {margin-top:20px}
			.company .section5  ul li:after {display:none }



		

}





.character {color:#333}
.character .guide {color:var(--main_c3)}
.character .arti_tit {color:var(--main_c3)}

.character .section1 {padding-bottom:40px}
.character .bg {background:url('/common/img/sub/character_bg_line.png') center top repeat-y; margin-top:-50px; padding-top:150px; padding-bottom:190px}
.character .section1 ul { }
.character .section1 ul li {  display:flex; align-items:center; justify-content:flex-end;  height:410px; width:100%; margin-left:auto; padding:0 10%; box-sizing:border-box; font-size:1.2em}
.character .section1 ul li:nth-child(8) {height:370px}
.character .section1 ul li .flex {align-items:center; gap:60px}
.character .section1 ul li .flex .text {text-align:right}
.character .section1 ul li .flex .text h5 {font-size:3em; color:#ea5f21; font-family: 'MaplestoryOTFBold';}
.character .section1 ul li:nth-child(2n) { justify-content:flex-start;  margin-left:0}
.character .section1 ul li:nth-child(2n) .flex img {order:1}
.character .section1 ul li:nth-child(2n) .flex .text {order:2}
.character .section1 ul li:nth-child(2n) .flex .text {text-align:left}
.character .section2 {padding-top:0}

.character .section1 ul li:nth-child(2) .flex .text h5 { color:#ecb000}
.character .section1 ul li:nth-child(3) .flex .text h5 {color:#c66f2e}
.character .section1 ul li:nth-child(4) .flex .text h5 {color:#a85f92}
.character .section1 ul li:nth-child(5) .flex .text h5 {color:#e88527}
.character .section1 ul li:nth-child(6) .flex .text h5 {color:#3c3939}
.character .section1 ul li:nth-child(7) .flex .text h5 {color:#ec8088}
.character .section1 ul li:nth-child(8) .flex .text h5 {color:#4f3527 }
.character .section1 ul li:nth-child(9) .flex .text h5 {color:#3b7cb8 }
.character .section1 ul li:nth-child(10) .flex .text h5 {color:#c95d79 }


@media screen and (max-width:640px) {
		.character .bg {background:url('/common/img/sub/ .png') top; margin-top:0; padding:70px 0}
		.character .section1 ul li {padding:0; height:auto; margin-bottom:50px; font-size:1em}
		.character .section1 ul li:last-child {margin-bottom:0}
		.character .section1 ul li .flex {justify-content:center;   gap:0}
		.character .section1 ul li .flex img {max-width:200px}
		.character .section1 ul li .flex .text {width:100%; text-align:left; order:2}
		.character .section1 ul li .flex .text h5 {font-size:2em; }

  
}


.product {color:#333}
.product .guide {color:var(--main_c4)}
.product .arti_tit {color:var(--main_c4)}

/* 견적문의 */

 
.contact .guide {color:var(--main_c5)}
.contact .arti_tit {color:var(--main_c5)}

.contact_form {}
.contact_form > li {display: flex; margin-bottom: 30px;}
.contact_form > li > div {width: 49%; margin-right: 20px;}
.contact_form > li.w100 > div {width: 100%; }
.contact_form > li > div > p.tit {font-size: 1.3em; font-weight: 600; margin-bottom: 15px;}
.contact_form > li > div > p.tit.f_box {align-items: center; justify-content: space-between; font-size: 1.05rem; }
.contact_form > li > div > p.tit > span {color:red;}
.contact_form > li > div input[type="text"] {vertical-align:middle; padding: 10px 0; box-sizing: border-box; border: 0; border-bottom: 2px solid #000; width: 100%; font-size:1.05rem;}
.contact_form > li > div > label.btn_upload {display: block;width: 100%;padding: 10px;border-bottom:2px solid #000;cursor: pointer;color:#a3a3a3;background:url('/common/img/common/ico_upload.png') no-repeat;background-position: 99% 55%;background-size: 15px;box-sizing: border-box;}
.contact_form > li > div > label.btn_upload > input[type="file"] {display: none;}
 
.contact_form > li > div > ol {display: flex; flex-wrap:wrap;padding: 10px 0; width:100%; box-sizing: border-box; border-bottom: 2px solid #000;}
.contact_form > li > div > ol > li {  width:20%}
.contact_form > li > div > ol > li > label {display: flex; align-items: center; font-size:1.05rem;}
.contact_form > li > div label input {margin-right: 3px;}

.contact_form > li > div > textarea {border: 2px solid #000;; resize: none; width: 100%; height: 200px; padding: 10px; font-size:1.05rem; box-sizing: border-box;}

div.date_div  {border-bottom: 2px solid #000; align-items:center; white-space:nowrap}
div.date_div p {margin-right:30px}
.contact_form > li > div div.date_div input[type="checkbox"] {vertical-align:middle}
.contact_form > li > div div.date_div input[type="text"] {border-bottom:none;  box-sizing:border-box}
.contact_form > li > div div.date_div input[type="text"]:disabled {background-color:#ddd}

.contact_form .agree_box {height: 150px; overflow-y: scroll; border: 1px solid #DDD; padding: 10px; box-sizing: border-box; font-size: 0.95rem; line-height: 1.5;}
.contact_form .btn_agree {display: flex; align-items: center;}

.form_area button.btn_sand {width:250px; line-height:55px; text-align:center; font-size:19px; display:inline-block; border-radius:50px; background-color:var(--main_c5); color:#fff; margin-top:30px;  transition: all 0.3s ease-out;}
.form_area button.btn_sand:hover {background-color:var(--main_c1)}

 
 
 @media screen and (max-width:640px) {
		.contact_form > li {flex-wrap:wrap; margin-bottom:20px}
		.contact_form > li div + div {margin-top:20px}
		.contact_form > li > div {width:100%; margin-right:0}
		.contact_form > li > div > ol > li  {width:50%}
		.contact_form > li > div > p.tit {font-size:1em;   margin-bottom:5px;}

}

 
/* 오시는길 */
.map_area .text_box {margin-left:auto}
.map_area .text_box > span {display: block; margin-bottom: 20px; padding-bottom: 20px; font-size:2em; font-weight: 700; border-bottom: 1px solid #DDD;}
.map_area .text_box > span > em {font-style: initial; font-size:.5em}
.map_area .text_box > ul > li {display: flex; flex-wrap: wrap; margin-bottom:10px;  }
.map_area .text_box > ul > li > span {margin-right: 10px; font-weight: 600;}

@media screen and (max-width:1300px) {
   .map_area .text_box {margin-left:50px; width:40%; flex-shrink:0}

  
  }
@media screen and (max-width:640px) {

		.map_area iframe {height:200px; width:100%}
		.map_area .text_box {margin-top:20px; width:100%; margin-left:0}
		 .map_area .text_box > span {  margin-bottom: 15px; padding-bottom:10px; font-size:1.6em;  }
		 .map_area .text_box > ul > li {  margin-bottom:5px;  }

}
