/*서브*/

.sub_vi {width:100%; display:inline-block; overflow:hidden; height:320px; color:#fff; text-align:center; position:relative; margin-top:-80px}
.sub_vi::after {width:100%; height:100%; position:absolute; top:0; left:0; background:rgb(0,0,0,.6); display:inline-block; z-index:9; content:''}
.sub_vi div {position:absolute; top:45%; left:50%; color:#fff;  z-index:99;  transform: translate(-50%,  0);  font-size:2.5rem; font-weight:700}
.sub_vi div p {font-size:1.1rem; color:rgba(255,255,255,.9); font-weight:400; display:block; margin-top:10px; line-height:1.3em; } 

.sub_vi  img {-moz-animation: bounce 5s;
    -webkit-animation: bounce 5s;
    animation: bounce 5s; width:100% }

@keyframes bounce {
  0% { transform: translateY(-50px);}
  
  100% {transform: translateY(0);}
}

/* .sub_vi_img2 {background:url('../img/container-2879154_1920.jpg') no-repeat center;  background-size:cover}
.sub_vi_img3 {background:url('../img/alesia-kazantceva-VWcPlbHglYc-unsplash.jpg') no-repeat center; background-size:cover }
 */
.sub_con {width:100%; max-width:1240px; margin:0 auto; padding-top:8vh;}

.img_box {width:100%; height:300px; overflow:hidden; position:relative}
.img_box::after {width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(0,0,0,.2); display:inline-block; content:'' }
.img_box img {margin-top:-100px}

.text_color_box {width:100%; display:inline-block; margin-top:-200px}
.text_color_box h2 {font-size:3rem; color:#fff;  width:100%; display:inline-block; text-align:center; position:relative; z-index:99;  font-family: 'GmarketSansBold';}
.text_color_box div {width:70%; background-color:#c2a315; margin-top:50px;  color:#fff; padding:50px; box-sizing:border-box; text-align:center;  margin-left:15%; font-size:1.2rem; line-height:1.3em; position:relative}

.text_color_box div::after {content:''; width:calc(100% - 15px); height:calc(100% - 15px); display:inline-block; border:1px solid #fff;    position:absolute; top:7.5px; left:7.5px; box-sizing:border-box}

.text_box {font-size:1rem; text-align:center; margin-top:20px; color:#333; font-weight:400; line-height:1.4em}

.img_box2 {width:100%; height:250px; overflow:hidden; position:relative}
.img_box2 img {position:absolute; top:0; left:0; width:100%}
.img_box2::after {content:''; width:calc(100% - 15px); height:calc(100% - 15px); display:inline-block; border:1px solid #fff;    position:absolute; top:7.5px; left:7.5px; box-sizing:border-box}

.img_box2 h2 {font-size:3rem; color:#fff;  width:100%; display:inline-block; text-align:center; position:absolute; top:40%; z-index:99;  font-family: 'GmarketSansBold';}


.company3 {width:100%}
.company3 ul {display:flex; flex-wrap:wrap;  width:100%; }
.company3 ul li {border:1px solid #ddd; width:15%; line-height:0; box-sizing:border-box; padding:5px; margin-right:2%; height:75px; align-items:center; justify-content:center;  display:flex;}
.company3 ul li:nth-child(6n) {margin-right:0}
.company3 ul li:nth-child(n + 7) {margin-top:2%}
.company3 ul li img {max-width:100%; max-height:100%}


.write {width:100%; display:flex; flex-wrap:wrap; border-top:1px solid #333}
.write > div {width:50%; display:flex; align-items:center; padding:10px; box-sizing:border-box; border:1px solid #ddd; margin-right:-1px; margin-bottom:-1px; }
.write > div  > label {width:100px; font-size:1rem; font-weight:500}
.write textarea {width:100%; height:200px; border:1px solid #ddd; font-size:.95rem; color:#666; padding:10px; box-sizing:border-box}
.write > div > div {width:calc(100% - 100px);  display:flex; align-items:center }
.write > div input {border:1px solid #ddd; width:100%; box-sizing:border-box; color:#666; padding-left:5px;  font-size:0.93rem; height:35px;}
.write > div select {border:1px solid #ddd; margin-left:10px;  box-sizing:border-box; color:#666; font-size:0.93rem;   height:35px; width:30%; max-width:200px}
 
ul.tab {width:100%; display:flex; justify-content :center; margin-bottom:30px}
ul.tab li {width:50%; max-width:200px; font-size:1.3rem;  border:1px solid #333; text-align:center; line-height:50px; color:#333; }
ul.tab li a {width:100%; display:inline-block; color:#333 !important; transition: all 0.3s ease-out;}
ul.tab li a:hover {background-color:#333; color:#fff !important; }
ul.tab li.ov {background-color:#333; color:#fff}
ul.tab li.ov a {color:#fff !important}

.b_t {font-size:1.3em}


@media all and (max-width:1240px) {

	.sub_con {padding:8vh 5% 0 5%; box-sizing:border-box; }
}


@media all and (max-width:900px) {
	.sub_vi {height:25vh; margin-top:0;}
	.sub_vi div { font-size:1.5rem; width:100%; transform: translate(-50%,  -50%); top:50% }
	.sub_vi div p {font-size:0.93rem; width:100%; box-sizing:border-box; padding:0 10%} 


	ul.tab li {max-width:100%; font-size:1.1rem; line-height:40px}
	.img_box {width:100%; height:200px; overflow:hidden}
	.img_box img {margin-top:0}
	 
	.text_color_box {width:100%; display:inline-block; margin-top:-150px}
	.text_color_box h2 {font-size:1.7rem;  }
	.text_color_box div {width:100%; padding:30px;  margin-top:50px; margin-left:0%; font-size:1.05rem}
	.text_box {font-size:0.93rem; margin-top:20px;  text-align:left  }

	.img_box2 {width:100%; height:150px;  }
     .img_box2 h2 {font-size:1.8rem; }

    .write > div {width:100%; flex-wrap:wrap}
	.write > div > input {width:100%}
     .write > div  > label {width:100%; margin-bottom:5px}
    .write > div > div {width:100%; }

	.company3 ul li { width:32%;   margin-right:2%}
	.company3 ul li:nth-child(3n) {margin-right:0}
	.company3 ul li:nth-child(n + 4) {margin-top:2%}


   .b_t {font-size:1.15em}


 
}


.product2  {  width:100%;  }
.dl_wrap  {display:flex; width:100%; box-sizing:border-box; flex-wrap:wrap; border-right:1px solid #ddd; border-top:1px solid #ddd; }
.product2 dl {width:33.3333%;  border-left:1px solid #ddd; border-bottom:1px solid #ddd; box-sizing:border-box; font-size:.97rem; line-height:1.25em; color:#444; padding:30px;  }
 
.product2 dl dt {font-size:1.3em;  color:#333; font-weight:700; position:relative}
.product2 dl dt span { display:inline-block; letter-spacing:0}
.product2 dl dd {margin-top:10px; box-sizing:border-box;  }

.product_line {width:1px; height:30px; display:inline-block; background-color:#c2a315;}


.history {width:100%; position:relative;  z-index:9}
.history ul {width:100%; padding-top:3vh  }
.history ul li {width:50%; box-sizing:border-box; padding:0 3%; display:block; font-size:1rem; line-height:1.4em; color:#444;   text-align:right; margin-bottom:20px; position:relative;  z-index:999999999999999999;  }
.history ul li:after {width:20px; height:20px; position:absolute; right:-10px; top:0; background-color:#fff;  border:3px solid #c2a315; box-sizing:border-box; border-radius:50%; content:''; }
.history ul li b {font-size:1.7em; letter-spacing:-1px; line-height:1em; display:block;  margin-bottom:10px}
.history ul li:last-child {margin-bottom:0}
.history ul li:nth-child(2n) {text-align:left; margin-left:auto}
.history ul li:nth-child(2n):after { left:-10px; right:auto; }

.history ul li b {width:100%; display:inline-block}


.history .history_line {width:1px; height:calc(100% - 7vh); background-color:#c2a315; display:inline-block; position:absolute; left:50%; top:75px; z-index:9}


@media all and (max-width:900px) {
	.history ul {padding-top:0}
	.history ul li {width:100%; text-align:left;   padding:0; padding-left:30px; font-size:.93rem;  }
	.history ul li:after { left:-7.5px; right:auto; top:2px; }
	.history .history_line {left:5%;  height:100%;  top:25px}
	.history ul li b {font-size:1.3em; }
   
	.product2 dl {width:100%; padding:15px; font-size:.93rem;}
	.product2 dl dt {font-size:1.1em}
	.product2 dl dd {margin-top:5px}
}

.customer1 {display:flex;   }
.customer1 iframe {width:50%}

.map_info {width:50%; display:flex; align-items:center; background-color:#c2a315; color:#fff;  font-size:0.97rem; text-align:center; line-height:1.4em; padding:70px 0; position:relative}
.map_info b {font-size:1.15em; color:#fff; font-weight:600; display:block; margin-bottom:10px}
.map_info div {width:100%}
.map_info div h3 {font-size:1.5rem;  color:#fff; font-weight:700; margin-bottom:20px}
.map_info div img {width:70px; vertical-align:middle; margin-bottom:10px}

.map_info::after {content: '';
    width: calc(100% - 15px);
    height: calc(100% - 15px);
    display: inline-block;
    border: 1px solid #fff;
    position: absolute;
    top: 7.5px;
    left: 7.5px;
    box-sizing: border-box;}


@media all and (max-width:900px) {
.customer1 {flex-wrap:wrap }
.customer1 iframe {width:100%; height:200px}


.map_info {width:100%; font-size:.93rem; padding:30px 6%}
.map_info div img {width:50px;  }
.map_info div h3 {font-size:1.2rem;   }
.map_info b {font-size:1.1em;}


}


.img_list {line-height:0; width:100%; display:flex}
.img_list li {width:33.3333%}
.img_list li img {width:100%}

.s_t {color:#555; font-size:.95rem}



 /*조직도*/

.company4 > div {margin:0 0; position:relative; box-sizing:border-box; width:100%;  }
.company4 .box_wrap  {position:relative; z-index:9; display:flex; flex-wrap:wrap; justify-content : space-between; align-items:flex-start; margin-top:70px}
.company4 .box_wrap div {width:18%; text-align:center; }
.company4 .box_wrap p.b {width:100%;  background-color:#c2a315; line-height:1.2em; padding:19px 15px;  font-size:1.15rem; font-weight:500; color:#fff; position:relative; box-sizing:border-box}


.company4 .box_wrap p.b:after {content: '';
    width: calc(100% - 10px);
    height: calc(100% - 10px);
    display: inline-block;
    border: 1px solid #fff;
    position: absolute;
    top: 5px;
    left: 5px;
    box-sizing: border-box;
	}

.company4 .box_wrap p.s {width:100%;  background-color:#f1f1f1;  margin-top:10px; line-height:40px;   font-size:.90rem; font-weight:400; color:#666;}
.company4  .box1 {width:250px; text-align:center; background-color:#333; line-height:60px; font-size:1.3rem; color:#fff; margin:0 auto; border-radius:60px; font-weight:600; position:relative; z-index:9;}
 
.company4 .line_x {width:82%; height:1px; background-color:#999; display:inline-block; position:absolute; left:9%; top:90px}
.company4 .line_y {width:1px; height:50px;  background-color:#999; display:inline-block; position:absolute;  top:90px}
.company4 .line_y:nth-child(1) {left:9%;}
.company4 .line_y:nth-child(2) {left:29%;}
.company4 .line_y:nth-child(3) {left:50%; top:40px; height:100px}
 .company4 .line_y:nth-child(4) {right:29%;}
.company4 .line_y:nth-child(5) {right:9%;}


@media all and (max-width:900px) {https://acis.syn.co.kr/
		.company4 > div {margin:0;width:100% }
		.company4 .box_wrap div {width:32%; text-align:center;    }
		.company4 .box_wrap div:nth-child(n + 4) {margin-top:10px}
		.company4 .line_x {width:80%; left:10%; }
		.company4 .line_y:nth-child(1) {left:10%;}
		.company4 .line_y:nth-child(2) {display:none}
		.company4 .line_y:nth-child(4) {display:none}
		.company4 .line_y:nth-child(5) {right:10%;}

		.company4 .box_wrap p.b {font-size:1rem; padding:15px}


  }



 .company1 {font-size:1rem; line-height:1.5em; font-weight:400; color:#444 }

.company1 > div {width:100%; display:flex; align-items:flex-start}
.company1 div div.company_img {width:43%; position:relative;}
.company1 div div.company_img p {overflow:hidden; width:100%; padding-bottom:70%; display:inline-block;     position:Relative; z-index:99}
.company1 div div.company_img p img { width:100%;  position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); }
.company1 div div.company_img:after {content:''; background-color:#c2a315; position:absolute; width:100%; height:100%; top:25px; left:25px}

.company1 div div.company_img + div {width:51%; margin-left:auto; padding:20px 0}
.company1  span.t1 {font-size:1.7em; line-height:1.2em; font-weight:800; color:#333;}
.company1  span.t2 {font-size:1.5em; font-weight:600; color:#333;}
.company1 div span.sign {font-family: 'InkLipquid'; font-size:2.1em}

@media all and (max-width:900px) {

	.company1 {font-size:0.97rem; line-height:1.4em;  }
	.company1 > div {display:inline-block; }
	.company1 div div.company_img {width:100%; }
	.company1 div div.company_img p {  padding-bottom:60%; }
   .company1 div div.company_img:after {display:none}

	.company1 div div.company_img + div {width:100%; margin-top:20px; padding:0; }
	.company1  span.t1 {font-size:1.3em;  }
 
}