@font-face {
    font-family: 'InkLipquid';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_one@1.0/InkLipquid.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

 .sub_vi {width:100%; height:300px; background:url('/common/img/21389047.jpg') no-repeat center; background-size:cover;  display:flex; align-items:center;  }
 .rnd_vi { background:url('/common/img/17407672.jpg') no-repeat center; background-size:cover; }
 .pipeline_vi { background:url('/common/img/21389050.jpg') no-repeat center; background-size:cover; }
.news_vi { background:url('/common/img/17407672.jpg') no-repeat center; background-size:cover; }
.contact_vi { background:url('/common/img/21389047.jpg') no-repeat center; background-size:cover; }

 .sub_vi div {width:100%; text-align:center; font-size:2rem;  color:#fff;   }
 .sub_vi div h3 {font-size:1.2rem; letter-spacing:-1px; font-weight:400; margin-top:50px; text-shadow:2px 2px 3px rgba(0,0,0,.1) }
.sub_vi div h2 {font-size:3rem; font-weight:700; text-shadow:2px 2px 3px rgba(0,0,0,.1); font-family:'Montserrat';  }
 
.sub_con {width:100%; max-width:1200px;  margin:0 auto; padding-bottom:10vh}


.s_menu {width:100%; display:inline-block; text-align:center; margin-bottom:50px; margin-top:-20px; overflow-x:auto ; }
.s_menu ul {display:flex; width:auto;  white-space: nowrap;}
.s_menu li  {width:50%;  line-height:55px;  text-align:center;  font-size:1.15rem;   background-color:#f5f5f5; letter-spacing:-1px; transition: all 0.3s ease-out;}

.s_menu.rnd_menu li:nth-child(5) {width:30%}
.s_menu.rnd_menu li:nth-child(6) {width:30%}

.s_menu li a {color:#333 !important; width:100%; display:inline-block; transition: background-color 0.3s ease-in;   }
.s_menu li a:hover {background-color:#af1e23; color:#fff !important  }
.s_menu li.ov {background-color:#af1e23}
.s_menu li.ov a {color:#fff !important}

.guide {font-size:2.2rem; line-height:100px; letter-spacing:-2px   }


.sub_content {width:100%; display:inline-block; border-top:1px solid #ddd; padding-top:50px; padding-bottom:20px;  box-sizing:border-box; font-size:1.05rem; color:#444; line-height:1.5rem}

.sub_content h3 {font-size:1.6rem; font-weight:700; color:#111; width:100%; display:block; margin-bottom:20px;}
/* .sub_content h3:before {width:14px; height:14px; border:5px solid #af1e23; display:inline-block; content:''; vertical-align:-3px; border-radius:50%}
 */
 .text {width:68%; margin-left:auto; }
.text * {line-height:1.6em}
.text b {font-size:1.5rem; line-height:1.4em; color:#333; font-weight:700;  }


.s_line {width:1px; height:20px; background-color:#333; display:block; }
.content_br {width:100%; height:50px; display:inline-block}


 
@media (max-width:1240px) {
	 .sub_content {padding:0 5%;   padding-top:30px}
}


@media (max-width:1024px) {
    

	.guide {font-size:1.7rem; line-height:60px;   }
     
	.s_menu {background-color:#f9f9f9; min-width:100%}
	.s_menu li  {font-size:1rem; width:auto;  line-height:45px;  }
 	.s_menu li a {width:auto;  padding:0 25px;  display:inline-block}
	.sub_vi {height:220px}
	.sub_vi div h3 {font-size:1rem;   margin-top:45px }
	.sub_vi div h2 {font-size:2rem }

	.sub_content {flex-wrap:wrap; }

	.text {width:100%;   margin-top:40px}
	.text b {font-size:1.2rem;    }


}
@media (max-width:950px) {
	.guide {font-size:1.5rem;   }
	.sub_content h3 {font-size:1.3rem; }

     
}


/*artbllood*/

.artblood1,.artblood2,.artblood3,.artblood4,.artblood5,.artblood6,.artblood7 {font-size:1.1rem;  }


.artblood1_box {width:100%; box-sizing:border-box; padding:6%; padding-right:35%; background:url('/common/img/vivi2.png') no-repeat center; background-size:cover;  background-color:#333; color:#fff;  font-size:1.1rem; line-height:1.5em }
.artblood1_box b {font-size:1.2em; font-weight:600; line-height:1.4em}
.artblood1_box .t_line {width:20px; height:1px; display:block; background-color:#fff; margin:20px 0}

.artblood2 {display:flex;  }
.ceo_img {width:25%; color:#333; font-size:0.97rem}
.ceo_img img {max-width:230px}
.artblood2 .text {width:70%}
.sign   {font-family: 'InkLipquid'; font-size:3rem; color:#333}

.artblood3 ul {width:100%; display:flex; flex-wrap:wrap}
.artblood3 ul li {width:48%; margin-bottom:4px}

.artblood3 ul.disc_list li {width:100%; margin-bottom:2px}

.artblood4 {width:100%; }
.artblood4_wrap {width:100%; display:flex;flex-wrap: wrap;}
.artblood4_wrap dl {border:1px solid #ddd; width:50%; padding:20px; margin-right:-1px; box-sizing:border-box; font-size:1.02rem ; line-height:1.5em}
.artblood4_wrap dl dt {font-size:1.25em;  padding:10px;  margin-bottom:15px; font-weight:600; background-color:#333; color:#fff; }
.artblood4_wrap dl dt span {font-size:.85em; letter-spacing:0; font-weight:500}



.artblood5_wrap {position:relative; box-sizing:border-box;  width:100%; max-width:800px; display:inline-block; left:50%; transform: translate(-50%, 0); }
.artblood5_wrap .box {width:150px;  height:150px; display:flex; justify-content:center; align-items:center; border-radius:50%;   font-size:1.2rem; font-weight:500;   background-color:#af1e23;   color:#fff;  text-align:center; position:absolute; z-index:999}
.artblood5_wrap .box.type1 {left:50%; margin-left:-75px;  }
.artblood5_wrap .box:after {position:absolute; width:calc(100% - 20px); top:10px; left:10px;  height:calc(100% - 20px); border:1px solid rgba(255,255,255,.5); content:''; display:inline-block; box-sizing:border-box; border-radius:50%; }


.artblood5_wrap .box_100 {width:100%; display:flex;  justify-content :space-between;  margin-top:300px;}
.artblood5_wrap .box2 {width:23%; line-height:45px; font-size:1.05rem; display:inline-block;   text-align:center;  z-index:999; }
.artblood5_wrap .box2 p {width:100%; margin-bottom:5px; box-sizing:border-box; background-color:#333; color:#fff;  white-space:nowrap;}
.artblood5_wrap .box2 p.radius {border-radius:15px 15px 0 0}
.artblood5_wrap .box2 p.w_box {background-color:#fff; color:#333; border:1px solid #333}
.artblood5_wrap  p span.s_t {font-size:.85em;  }


.line_x {width:70%; height:1px; display:inline-block; position:absolute; background-color:#333;}
.line_y {width:1px; height:470px; display:inline-block; position:absolute; background-color:#333;}

.artblood5_wrap > p:nth-of-type(1){left:11.5%; width:77%}
.artblood5_wrap > p:nth-of-type(3){left:11.5%; height:120px;}
.artblood5_wrap > p:nth-of-type(6){right:11.5%; height:120px;}



  
.artblood7 {position:relative; }

.artblood6 {display:flex;}
.history_tt {width:25%; display:inline-block; font-size:3rem; font-family:'Montserrat'; color:#111;  vertical-align:top;  background-color:#af1e23; color:#fff; padding:50px 0;   box-sizing:border-box; padding-left:2%; }
.history_tt  p {width:100%; display:inline-block; font-size:1.05rem; padding-top:25px;  font-weight:400; line-height:1.3em; }
.history {width:70%; margin-left:5%;  display:inline-block}
.history div.in {width:100%;  position:relative; margin-top:10px; display:flex; margin-bottom:20px}
.history div.in h3 {width:18%; font-family:'Montserrat'; font-size:2rem;   font-weight:700; margin-bottom:0; line-height:1em;}
.history div.in ul {width:80%;  }
.history div.in ul li   {width:100%; display:flex; padding-bottom:5px}
.history div.in ul li:before {width:15px; height:15px; border:4px solid #af1e23; display:inline-block; content:''; background-color:#fff; position:relative; z-index:999;  border-radius:50%;  margin-right:5%; vertical-align:-3px }
.history div.in ul li span {width:70px; font-size:1.2rem; font-weight:500; color:#333;  display:inline-block ; font-family:'Montserrat'; flex-shrink:0;}
.history .history_line {width:1px; height:100%;  top:0; position:absolute; left:calc(18% + 11px); display:inline-block; background-color:#af1e23}

.vistion {width:100%; box-sizing:border-box; padding:0 5%; display:flex; align-items:center; justify-content:space-between}
.vistion div.box1 {width:23%; display:inline-block; box-sizing:border-box;  position:relative;padding-bottom:23%; z-index:9999; background-color:#fff ; }
.vistion div.box1 div {   width:100%; height:100%; display:inline-block; position:absolute; box-sizing:border-box;
border: 10px solid;
     border-image: linear-gradient(to right, #af1e23, #8c080c);
    border-image-slice: 1;}



.vistion div  p {position:absolute; top:50%; left:50%;  transform: translate(-50%, -50%);  width:100%; box-sizing:border-box; padding:5%; font-size:1.15rem; font-weight:500;   text-align:center; color:#111}
.vistion div  p img {height:50px; margin-bottom:10px;   }
.vistion_line {width:80%; top:53%; left:10%; position:absolute;   display:inline-block; height:1px; background-color:#af1e23}



@media (max-width:1024px) {
			.artblood1,.artblood2,.artblood3,.artblood4,.artblood5,.artblood6,.artblood7 {font-size:1rem;  }

			.artblood1_box {padding:15% 5%; font-size:1rem; }
			.artblood1_box b {font-size:1.1em;  }

			.artblood2 .text {width:100%}


			.ceo_img {width:100%;text-align:center  }
			.ceo_img img {width:40%; margin-bottom:10px}

			.artblood3 ul li {width:100%;   }

			.artblood4_wrap {width:100%; display:flex; flex-wrap:wrap}
			.artblood4_wrap dl {  width:100%;  margin-bottom:-1px; font-size:0.97rem}
			.artblood4_wrap dl dt {font-size:1.2em;}


			.artblood5_wrap {padding:0}
			.artblood5_wrap .box {width:150px; line-height:45px  }
			.artblood5_wrap .box.type1 {margin-left:-75px}
			.artblood5_wrap .box.type2 {left:0;  top:160px; }
			.artblood5_wrap .box:after {display:none}

			.artblood5_wrap .box_100{flex-wrap:wrap;}
			.artblood5_wrap .box_80 {width:100%; margin-left:0; display:flex;  justify-content:space-between;   margin-top:80px;}
			.artblood5_wrap   .box2  {width:48%; font-size:.95rem}
			.artblood5_wrap > p:nth-of-type(1){left: 24%; width: 52%;}
			.artblood5_wrap > p:nth-of-type(3){left:24%; height:200px;}
			.artblood5_wrap > p:nth-of-type(4){display:none;}
			.artblood5_wrap > p:nth-of-type(5){display:none;}
			.artblood5_wrap > p:nth-of-type(6){right:24%; height:200px;}
			.line_x.line-x_type1 {top:180px; width:50%; left:0; margin-left:0}
 


			.history {width:100%; margin-left:0;    }
			.history_tt {width:100%; margin-bottom:10px; display:inline-block; font-size:2rem; text-align:center; padding:25px}
			.history_tt  p {padding-top:13px}
			.history div.in {display:inline-block; margin-bottom:8px; padding-bottom:8px;  border-bottom:1px solid #ddd; }
			.history div.in h3 {width:100%;  font-size:1.5rem; margin-bottom:10px}
			.history div.in ul {width:100%}
			.history div.in ul li span {font-size:1rem; width:60px;}
			.history .history_line {display:none}

			.history div.in ul li:before {display:none}

			.vistion { padding:0 0%; flex-wrap:wrap; align-items:stretch;  }
			.vistion div.box1 {width:50%; display:inline-block; padding:0;  }
			.vistion div.box1 div {  position:static; border:none; border-right:1px solid #fff; border-top:1px solid #fff; background:linear-gradient(to right, #af1e23, #8c080c); display:flex; align-items:center   }
			.vistion div.box1  p { position:static; width:100%; padding:20px;  transform: translate(0, 0);   font-size:1rem; line-height:1.3em; color:#fff }
			.vistion div.box1  p img {margin-bottom:5px; }
			.vistion_line {display:none}

}


/*rnd*/

.rnd1,.rnd2,.rnd3,.rnd4 {font-size:1.2rem; text-align:Center}
.rnd1 h3,.rnd2 h3,.rnd3 h3,.rnd4 h3  {font-size:1.5em;  font-weight:700; letter-spacing:-1.5px}
.rnd1 img,.rnd2 img,.rnd3 img,.rnd4 img  { max-width:800px}

.rnd1 .flex_box p {height:20vw; max-height:300px}
.rnd1 .flex_box p  img {max-height:100%}

.rnd2 .flex_box div {}
.rnd2 .flex_box div img {margin:20px 0; }

.img_box { display:flex; width:100%;  }
.img_box div {min-width:300px;   display:inline-block; text-align:Center; border:1px solid #333}
.rnd3 .img_box div img {height:150px; margin:30px auto}
.img_box div p {width:100%; font-size:1.05rem; background-color:#333; color:#fff; padding:8px 0; box-sizing:border-box}

@media (max-width:950px) {

.rnd1,.rnd2,.rnd3,.rnd4 {text-align:left}

.img_box {justify-content:space-between}
.img_box div {width:48%; min-width:auto; margin-right:0}

.rnd3 .img_box div img {height:15vw; margin:15px auto}

.rnd1,.rnd2,.rnd3,.rnd4 {font-size:1rem}
.rnd1 h3,.rnd2 h3,.rnd3 h3,.rnd4 h3  {font-size:1.2em;  letter-spacing:-1px}


 


.img_box div p {font-size:1rem}

}

/*파이프라인*/


.pipeline2,.pipeline3 {font-size:1.1rem;  }
.pipeline2 h3,.pipeline3 h3  {font-size:1.6em;  font-weight:700; letter-spacing:-1.5px}


.pipeline1 table {width:100%;}
.pipeline1 th {padding:8px; font-size:1rem;   border:1px solid #333;  background-color:#f1f1f1;}
.pipeline1 td  {padding:15px 10px; font-size:1rem; text-align:center; line-height:1.3em;  border:1px solid #333; color:#333; }

.point {width:100%; display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start}
.point li {width:calc(50% - 7px); border:1px solid #555; color:#333;  border-radius:3px; box-sizing:border-box; padding:13px; font-size:1.13rem; font-weight:500}
.point li:nth-child(n+3) {margin-top:15px}

.pipeline2 img {max-width:80%}

.bg_box {background-color:#f5f5f5; box-sizing:border-box; padding:30px;  }

.pipeline3  div.img_box   { width:30%;  }
.pipeline3  div.img_box div {width:100%}
.pipeline3  div.img_box div img {width:80%; margin:30px auto}
.pipeline3 .t   { width:65%; }

.flex_li li {width:100%; display:flex}
.flex_li li span {width:30px}
.flex_li li p {width:calc(100% - 30px);}

@media (max-width:950px) {

.pipeline2,.pipeline3 {font-size:1rem;  }
.pipeline2 h3,.pipeline3 h3  {font-size:1.3em;   letter-spacing:-1px }
.point li {width:100%; font-size:1rem; padding:10px}
.point li:nth-child(n+2) {margin-top:7px}


.pipeline3 .t   {margin-top:20px; width:100% }
.pipeline3  div.img_box   { width:50%;    }
.pipeline2 img {max-width:100%}


}

/*오시는길*/


.contact2 {width:100%; display:flex; align-items:flex-end}
.contact2 div.map_wrap {width:50%; }
.contact2 div.text_box {width:50%; padding-left:4%; box-sizing:border-box;  font-size:1.05rem;  line-height:1.5em; color:#333; }
.contact2 div b {font-size:1.1em; color:#333; font-weight:600}
.contact2 div  img {margin-bottom:20px}
.map_img {width:100%; position:relative}
.map_img img {width:100%; border:1px solid #ddd; box-sizing:border-box; }
.map_img:hover:before  {content:''; width:100%; height:100%; display:inline-block; position:absolute; top:0; left:0; background:rgba(0,0,0,.2); cursor:pointer }



@media (max-width:950px) {
.contact2 {width:100%; display:inline-block;  }
.contact2 div.map_wrap {width:100%;   }
.contact2 div.text_box {width:100%; padding-left:0; font-size:0.97rem;   }
.contact2 div b {font-size:1.05em; color:#333; font-weight:600}
.contact2 div.text_box img {display:none}


}


.sitemap {width:100%; display:flex; margin-top:50px}
.sitemap > li {width:20%; border:1px solid #333; border-right:none; padding:10px; box-sizing:border-box;}
.sitemap > li:last-child {border-right:1px solid #333}
.sitemap > li a {width:100%; display:inline-block; text-align:center; font-size:1rem; padding:2px 0; color:#333 !important}
.sitemap > li a:hover { text-decoration:underline}
.sitemap > li a.one_dep {background-color:#333; padding:8px 0;  font-size:1.1rem; font-weight:600; color:#fff !important; text-align:center; margin-bottom:10px }


@media (max-width:950px) {

.sitemap {flex-wrap:wrap; border-top:1px solid #333}
.sitemap > li {width:50%; border-top:none; padding:15px}
.sitemap > li:nth-child(2n) {border-right:1px solid #333}

}
