@font-face {
    font-family: 'GongGothicMedium';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_20-10@1.0/GongGothicMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'GmarketSansMedium';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2001@1.1/GmarketSansMedium.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}


 #sub {width:100%; display:inline-block; background-color:#fff; font-size:18px;  }
 #sub section  {  }
 #sub hr {height:30px}
 #sub hr.sub_hr {height:100px;  }
 #sub hr.sub_hr2 {height:55px}
 #sub hr.sub_hr3 {height:35px}


sub .menu li.ov a {color:#fff;  }
 


@media all and (min-width:900px) {
	#sub .menu {width:100%; margin:0 auto;  display:flex; justify-content:center; text-align:Center; font-size:1em;  line-height:1.6;  margin-bottom:40px;  margin-top:120px; gap:20px; box-sizing:border-box; padding:0 3%}
	#sub .menu * {transition: all 0.3s ease-out}
	#sub .menu li {display:flex; align-items:center; justify-content:center;  font-size:1.25em;  width:210px;    position:relative; overflow:hidden; }


	#sub .menu li a {width:100%; position:relative; z-index:9;  padding:12px 0px; display:inline-block; color:#333; font-weight:700 ; letter-spacing:-.5px  }
	#sub .menu li:before {content:''; display:inline-block; border-radius:5px; width:0; height:100%; background-color:#333; position:absolute; left:0; top:0;  transition: all 0.3s ease-out;}
	#sub .menu li:hover:before {width:100%; }
	#sub .menu li:hover {border-bottom:none;}
	#sub .menu li:hover a {color:#fff}

	#sub .menu li:after {content:''; display:inline-block; width:100%; height:3px; background-color:#333; position:absolute; left:0; bottom:0; }
	#sub .menu li:hover:after {display:none}

	#sub .menu li.ov {background-color:#333; border-radius:5px}
	#sub .menu li.ov a  {color:#fff}


}

  
@media all and (max-width:1200px) {
 		#sub .menu {gap:0; margin-top:0; padding:0}
		#sub .menu li {width:100%; font-size:1.1em}
		#sub .menu li.ov {border-radius:0}

}
 
@media all and (max-width:900px) {
		#sub {font-size:15px}
	 
		#sub .menu {width:100vw; overflow-x:auto;  box-sizing:border-box;  display:flex;  position:relative;  justify-content:flex-start;  }
		#sub .menu li {width:auto; display:inline-block; white-space:nowrap; }
		#sub .menu li a  {color:#333; font-size:1.05em; padding:14px 0; margin:0 12px;   display:inline-block;  }
		#sub .menu li:first-child a {margin-left:30px}
		#sub .menu li:last-child a {margin-right:30px}
		#sub .menu li.ov a  {color:#000; font-weight:700; position:relative}
		#sub .menu li.ov a:before {content:' '; display:inline-block;  width:100%; height:3px; background-color:#333; position:absolute;  z-index:9999; left:0; bottom:0; }
		.menu:after {content:''; display:inline-block; width:100%;  min-width:100vw; height:3px; background-color:#ddd; position:absolute;  z-index:99; left:0; bottom:0; }
		/*회사소개용*/
		.frame {position:relative}
		.frame:after {content:''; display:inline-block; width:100%;  min-width:100vw; height:3px; background-color:#ddd; position:absolute;  z-index:99; left:0; bottom:0; }
		.frame .menu:after {display:none}

}

 
 /*비쥬얼*/
 
  
.vi_video {width:100%; height:33vw; overflow:hidden; position:relative; }
.vi_video .video-bg {  width:100%; height:100%; position:absolute; left:0; top:0; overflow:hidden  }
.vi_video .video-bg video { min-width:calc(100% + 1px); margin-left:-1px;  min-height:100%; position:absolute; top:50%; left:50%;  transform: translate( -50%, -50%);   z-index:-1; background-color:#333;  }
.vi_video .video-bg.type2 video { min-width:calc(100% + 1px); margin-left:-1px;  min-height:100%; position:absolute; bottom:0; top:auto; left:50%;  transform: translate( -50%, 0);   z-index:-1; background-color:#333;  }
.vi_video .video-bg img { min-width:calc(100% + 1px); margin-left:-1px;  min-height:100%; position:absolute; top:50%; left:50%;  transform: translate( -50%, -50%);   z-index:-1; background-color:#333;  }
.vi_video .rgba_bg {background:rgba(0,0,0,.1)}

.vi_video .vi_guide {color:#fff; position:absolute; left:5%; top:190px; font-size:1.3em; z-index:99; }
.vi_video .vi_guide  p {display:flex; width:100%; align-items:center; }
.vi_video .vi_guide span {width:20px; height:1px; background-color:#fff; display:inline-block; margin:0 10px}
.vi_video .vi_guide h3 {font-size:100px; text-shadow:2px 2px 10px rgba(0,0,0,.2); width:100%; display:inline-block; margin-top:10px;  font-weight:800;  color:#fff; line-height:1; letter-spacing:5px; font-family: 'Montserrat';/*  color: transparent;      -webkit-text-stroke: 1px rgba(255,255,255,1);  */ }

.vi_video .right_fixed_text {position:absolute; right:5%; bottom:185px; text-align:right; font-size:30px; font-weight:400; letter-spacing:.5px; color:#fff; z-index:99; text-shadow:1px 1px 2px rgba(0,0,0,.1);   }

 .vi_text {
	z-index: 1;
	position:absolute;
	 
	width:auto;  text-align:right; height:50px; right:5%; bottom:150px;  
 }
 .vi_text > div {
	width:100%;
	text-align:center;
	color:#fff; 
 }
  
  
 .vi_text .h1 { background-color:var(--main_c); padding:0px; color:#fff; font-weight:600; color:rgba(255,255,255,1); font-size:65px; letter-spacing:-.5px}

 @media all and (min-width:1920px) {
	 .vi_video .video-bg video  {   bottom:-30px;  }
 
}
 @media all and (max-width:1200px) {
		.vi_video {height:450px;  }
 		.vi_video .vi_guide {top:140px;  }

		.vi_video .vi_guide h3 {font-size:50px}
		.vi_video .right_fixed_text {bottom:100px}
		.vi_text {bottom:70px}
		.vi_text .h1 {font-size:40px}
}
 @media all and (max-width:900px) {
		.vi_video {height:400px;  }
 		.vi_video .video-bg { width:100%; height:100%; position:absolute; left:0; top:0; background:url('/common/img2/sub_vi.jpg') no-repeat; background-size:cover; }
 		.vi_video .video-bg:after { content:''; width:100%; height:100%; position:absolute; left:0; top:0; background:rgba(0,0,0,.65) }
 		.vi_video .video-bg video {display:none }
		.vi_video .rgba_bg {display:none;}
 		.vi_video .vi_guide { font-size:1em}
		.vi_video .vi_guide span  {margin:0 5px; width:15px}
		.vi_video .right_fixed_text {font-size:22px; }
		.vi_text .h1 {font-size:30px; font-weight:700}
		.vi_video .vi_guide h3 {font-size:45px; letter-spacing:2px}
 }


 
#sub section {width:100%; }

#sub .content {width:100%;  display:inline-block; line-height:1.4;  color:#222; box-sizing:border-box;  margin:0 auto; margin-top:100px; padding-bottom:150px} 
#sub .content.type2 { max-width:1550px; } 
#sub .content.type3 { max-width:1700px; } 
#sub .content img {max-width:100%}

.content h3 { font-weight:600; letter-spacing:-1px;  margin-bottom:15px; font-size:1.7em; font-weight:800;  width:100%; display:block}
.content h3.content_h3 { display:flex;  align-items:center; width:100%;  }
.content h3.content_h3:before {content:' ';  width:8px; height:8px; background-color:#222; margin-right:10px}
 
.content h4 {width:100%; gap:10px; display:flex; align-items:center;  font-weight:800; margin-bottom:15px; color:var(--main_c);  font-size:1.3em; }
.content h4 span {border:2px solid var(--main_c); border-radius:5px; width:30px; text-align:center; }
.content h5 {  font-weight:800; font-size:1.2em; margin-bottom:10px;  width:100%; display:block}
 
h3.guide {width:100%; display:inline-block; text-align:center; font-size:2.2em; margin-bottom:30px }
.bg {background-color:#f4f6f8; padding:100px 0}


.text_wrap {line-height:1.5; font-size:1.05em; }
 
 
 
.ok_zone {width:100%; text-align:center; display:inline-block; box-sizing:border-box; padding:10px; background-color:#f9f9f9; font-size:0.95em; color:#666 }
.ok_zone  input[type="checkbox"] { vertical-align:middle }
 
 @media all and (max-width:900px) {
	.content h3.content_h3:before {display:none}
	.bg {background-color:#f4f6f8; padding:70px 0}

}

/****/

.new_flex_box {display:flex; position:relative;  }
.new_flex_box .flex_t {width:52%; flex-shrink:0;  padding-bottom:60px; margin-left:70px; margin-top:230px; position:Relative; z-index:99; font-size:1.05em; line-height:1.43 }
.new_flex_box .flex_t h3 {font-size:3em; font-family:'GongGothicMedium'; font-weight:500}
.new_flex_box .flex_t b {font-size:1.25em;  color:#000; display:block; margin-top:20px; font-weight:400}
.new_flex_box .flex_t b + b {font-size:1.15em; font-weight:700;  margin-top:30px}
.new_flex_box .flex_t hr {height:0}

 
.absolute_t {position:absolute; font-size:7.5em; line-height:.8;  text-align:right; color:#eaeaea;   font-weight:400; right:10px; top:0; letter-spacing:-7px;
-moz-animation: opacity 2s infinite;
-webkit-animation: opacity 2s infinite;
animation: opacity 2s infinite; 

}
.absolute_t b {font-weight:800; font-size:1.3em; letter-spacing:-8px; font-style:italic; color:var(--main_c2); font-family: 'Montserrat';}
.absolute_t span.m {display:none}



.s_line2 {width:30px; height:1px; display:inline-block; background-color:#333; margin-bottom:15px}

 
.new_flex_box .left_img {width:48%; position:relative;  }

.new_flex_box .left_img .img_motion {width:100%; height:100%; position:absolute; left:0; top:0; overflow:hidden; display:inline-block}

.new_flex_box .left_img .img_motion img {position:absolute; min-width:100%;  min-height:140%; left:0; top:0; z-index:99;  -moz-animation: bounce 20s infinite; -webkit-animation: bounce 20s infinite; animation: bounce 20s infinite;}

 

.new_flex_box .left_img .img_motion2 {width:100%; height:100%; position:absolute; left:0; top:0; display:inline-block;  transition: all .8s ease-out;  }
.new_flex_box .left_img .sq_line {width:100%; height:100%; border:6px solid var(--main_c2); opacity:1;  box-sizing:border-box; left:-50px; top:-50px; position:absolute;  }
 

@keyframes bounce {
  0% { transform: translateY(0);}
  40% {transform: translateY(-20%);}
  80% {transform: translateY(0);}
}

@keyframes opacity {
	0% {opacity:.2}
	50% {opacity:1 }
	100% {opacity:.2} 
  }


@media all and (min-width:900px) {
		.new_flex_box .left_img .img_motion2 {width:0; }
		.new_flex_box.active .left_img .img_motion2 {width:100%}

}

@media all and (max-width:900px) {
		.new_flex_box {flex-wrap:wrap}
		.new_flex_box .left_img {width:100%; height:200px}
		.new_flex_box .left_img:after {content:''; position:absolute; left:0; top:0; width:100%;height:100%; background:rgba(0,0,0,.5); display:inline-block; }
		.new_flex_box .left_img .sq_line {display:none }

		.new_flex_box .flex_t {width:100%; margin-left:0; margin-top:80px}
		.new_flex_box .flex_t h3  {font-size:1.9em}
 		.new_flex_box .flex_t b {font-size:1.15em; margin-top:0 }

		.absolute_t { font-size:4.3em; color:#fff; right:5%; top:120px; letter-spacing:-2px; padding-bottom:60px }
		.absolute_t b { font-weight:600; font-size:1.2em}

		.absolute_t span.pc {display:none}
		.absolute_t span.m {display:block; position:absolute; bottom:0; right:0; color:#ddd}

}



.content_box {   display:flex;   }
.content_box h3 {position: -webkit-sticky; position: sticky; height:100px; top:150px;   width:360px; flex-shrink:0; font-size:1.8em;  font-weight:800;  box-sizing:border-box;  padding-right:30px;    }
.content_box h3 span {position:absolute; z-index:99; line-height:1em; line-height:1.3 }
.content_box h3 span b {background-color:#fff; font-weight:500; line-height:1em; width:100%; display:inline-block; margin-bottom:5px}
.content_box h3 span.no {position:absolute; z-index:9; top:0; left:0; color:#f5f5f5; font-size:5em; letter-spacing:0px; line-height:1em   }
.content_box .right_box {width:100%; }

.content_box p.con_hr {background-color:#fff; width:100%; margin-top:60px; height:1px; display:inline-block;}

.content_box + .content_box {margin-top:100px}

.content_box img {max-width:100%}

.top_text {font-size:2.2em; display:block; text-align:center; font-weight:400; margin-bottom:15px;}
.top_text span {font-weight:800}
.top_text  p {text-align:center}

@media all and (max-width:900px) {
		.top_text {font-size:1.5em; }
		.content_box { flex-wrap:wrap}
		.content_box h3 {width:100%; font-size:1.5em; position:static; height:auto}
		.content_box h3 br {display:none}
}

  
.homepage_list {width:100%; box-sizing:border-box;  display:flex; flex-wrap:wrap;   justify-content:space-between;   }
.homepage_list > li {width:24%; display:inline-block;  box-sizing:border-box; padding:50px 30px; font-size:1em;   position:relative;   text-align:center;   font-weight:500; line-height:1.3; border-radius:10px;  }
.homepage_list li .text h3 { color:var(--main_c);  font-size:1.7em; width:100%; display:inline-block; margin-top:15px; padding-bottom:0;}
.homepage_list li  p {line-height:1.4}
.homepage_list li .text b {  color:#000; font-weight:700; line-height:1}
.homepage_list li  p.line {margin-bottom:20px}
 


.data_list {border:1px solid #ddd; box-sizing:border-box; border-radius:10px; padding:25px 20px; width:100%; display:inline-block; }
.data_list li {width:100%; display:flex; border-radius:2px; padding:3px 0; font-size:1em; align-items:center; box-sizing:border-box; color:#333;}
.data_list li:last-child {border-bottom:none}
.data_list li b {width:170px; margin-right:25px; flex-shrink:0;  display:flex; align-items:center;    font-weight:700; color:#111; }


@media all and (max-width:900px) {
  .data_list li {flex-wrap:wrap; gap:5px}
  .data_list li + li {margin-top:10px}
  .data_list li b {width:100%; font-size:1.05em; margin-right:0 }


}

/*서비스안내*/

.homepage1 .in {max-width:1400px}
.homepage1 .bg h3 {font-size:2.4em}
.homepage1 .border_box {box-shadow: 0 6px 26px 6px rgba(0, 0, 0, 0.05); padding:40px; border:none; background-color:#fff}
 
ul.process_list {width:100%; display: flex; gap:20px; margin-top:10px}
ul.process_list > li {flex:1 1 calc(25% - 20px)}
 
ul.process_list > li > div {box-sizing: border-box; }
ul.process_list > li > .img_box {padding: 35%; background-image: url('/common/img2/site01-1.png'); background-repeat: no-repeat; background-size: cover !important; background-position: center; border-radius:10px }
ul.process_list > li:nth-child(2) > .img_box {background-image: url('/common/img2/site01-2.png');}
ul.process_list > li:nth-child(3) > .img_box {background-image: url('/common/img2/site01-3.png');}
ul.process_list > li:nth-child(4) > .img_box {background-image: url('/common/img2/site01-4.png');}
ul.process_list > li > .txt_box { margin-top:15px;  color:#000; font-weight:700; font-size:1.2em;  text-align: center;}

 
.img_ul  {box-sizing:border-box; width:100%;  align-items:center; gap:20px  }
.img_ul li {box-sizing:border-box; }
.img_ul li div.box {height:19vw; margin:0 auto; margin-bottom:15px   }
.img_ul li div.box div {width:100%; height:calc(100% - 40px); }
.img_ul li div.box p {background-color:var(--main_c); color:#fff; width:100%; text-align:center; line-height:45px}
.img_ul li b {font-size:1.2em; color:#111;   margin-bottom:2px; display:block}
.img_ul li:nth-child(1)  {width:53%}
.img_ul li:nth-child(2)  {width:40%}
.img_ul li:nth-child(3)  {width:17%}


@media all and (max-width:1500px) {
    .img_ul li div.box {height:23vw; }
 }

@media all and (max-width:900px) {
		.homepage1 .bg h3 {font-size:1.8em}

		ul.process_list {flex-wrap:wrap}
		ul.process_list > li {flex:1 1 calc(50% - 20px)}

		.img_ul li {text-align:center; width:100%}
		.img_ul li:nth-child(1)  {width:100%}
		.img_ul li:nth-child(2)  {width:100%}
		.img_ul li:nth-child(3)  {width:100%}

		.img_ul li:nth-child(1) div.box  {width:92vw; height:52vw}
		.img_ul li:nth-child(2) div.box  {width:70vw; height:51vw}
		.img_ul li:nth-child(3) div.box {width:150px; height:290px}
 
}

 @media all and (max-width:600px) {
	 
 		.img_ul li:nth-child(1) div.box  { height:55vw}
		.img_ul li:nth-child(2) div.box  {width:75vw; height:57vw}
  
}
 


#sub .content.homepage2 {padding-bottom:0}
.homepage2 .list {width:100%; display:flex; flex-wrap:wrap; gap:10px }
.homepage2 .list li {width:auto;   display:inline-block;  box-sizing:border-box; padding:10px;  font-size:.95em;  font-weight:500; line-height:1.35em; background: linear-gradient( to top, var(--main_c), #5A57C9);  color:rgba(255,255,255,.8); border-radius:5px;  text-align:center;  word-break: keep-all; position:relative   }
.homepage2 .list li:last-child {margin-right:0} 
.homepage2 .list.border_type li:after {content: '';
		width: calc(100% - 14px);
		height: calc(100% - 14px);
		display: inline-block;
		border: 2px solid rgba(255,255,255,.9);
		border-radius: 5px;
		position: absolute;
		top: 7px;
		left: 7px;
		box-sizing: border-box;

}

.homepage2 .bg h3 {color:#fff}
 
.homepage3 .bg h3 {color:#fff}
.homepage3 .info_box_wrap {counter-reset: item;  }
.homepage3 .info_box {width:100%; display:flex; align-items:center; border:2px solid #ddd; box-sizing:border-box; padding:25px 20px; }
.homepage3 .info_box:before {counter-increment: item;  content: counter(item, decimal-leading-zero);  font-size:1.5em; width:80px;  font-family: 'GmarketSansMedium';}
 
  


.homepage3 .info_box  h5 {width:300px; font-weight:700; flex-shrink:0; margin-bottom:0; font-size:1.3em}
.homepage3 .info_box  p {width:calc(100% - 400px); font-size:.97em}
.homepage3 .info_box + .info_box {margin-top:20px}
.homepage3 .info_box b {font-size:1.2em; font-weight:800; margin-bottom:6px;  display:block; color:#222}

.homepage3  ol.step li {width:calc(33% - 40px); }
.homepage3  ol.step li b {font-weight:800; font-size:1.25em;  margin-bottom:17px; padding-bottom:11px; border-bottom:1px solid #ddd; width:100%; display:block }
.homepage3  ol.step li p { padding:10px; text-align:left;  align-items:flex-start; justify-content:flex-start}

.homepage3 .box_list li  {gap:30px; padding:40px 20px}
.homepage3 .box_list li h5 {width:auto;  white-space:nowrap}
 
.homepage3 .box_list2  li { }

 
@media all and (max-width:900px) {
		.homepage3 .info_box {flex-wrap:wrap; align-items:center; padding:30px 20px}
		.homepage3 .info_box  p {width:100%; border-top:1px solid #ddd; padding-top:20px; margin-top:10px}
		.homepage3 .info_box h5 {width:calc(100% - 35px)}
		.homepage3 .info_box h5 br {display:none}
		.homepage3 .info_box:before {font-size:1.2em; width:33px; margin-top:3px   }

		.homepage3 ol.step li {flex:1 1 calc(50% - 40px);}

		.homepage3 .box_list li  {gap:0; padding:30px 20px}
		.homepage3 .box_list li h5 {width:100%}
 
}

@media all and (max-width:600px) {
		 
	.homepage3 ol.step li {flex:1 1 100%;}
	.homepage3 ol.step li:after { content:'\f107';  left:50%; top:auto;  bottom:-27px;   transform: translatex(-50%);   }
		  
}

 

.customer3_list {width:100%; display:flex; flex-wrap:wrap; justify-content:space-between;}
.customer3_list div {width:49%; margin-bottom:-1px; border:1px solid #ddd; box-sizing:border-box; display:flex;   }
.customer3_list div p  { display:flex; align-items:center;   }
.customer3_list div p:nth-child(1) {background-color:var(--main_c); padding:10px 10px; color:#fff; width:60px; justify-content:center  }
.customer3_list div p:nth-child(2) {padding-left:20px }

@media all and (max-width:900px) {

  .customer3_list div {width:100%; margin-bottom:-1px; border:1px solid #ddd; box-sizing:border-box; display:flex;   }

}


 
.award_wrap {width:100%;   display:inline-block; border-top:none;   }
  
.gray_box {width:100%; display:flex;  align-items:center; justify-content:space-between; box-sizing:border-box; padding:50px 3%; background-color:#f7f7f7;}
.gray_box .text {width:55%}

.img_bor {border:1px solid #ddd; box-sizing:border-box}

.award_wrap .award_wrap_in {width:100%;  border:1px solid #ddd; position:relative; height:300px;  display:flex;  align-items:center;  justify-content:space-between; margin-bottom:50px;  border-radius:10px; overflow:hidden}
.award_wrap .award_wrap_in .img {width:38%; height:100%; position:absolute; left:0; top:0;  }
.award_wrap .award_wrap_in .right_text {width:54%; margin-left:auto; }


.award_wrap .award_wrap_in .right_text .year {color:var(--main_c); font-family: 'GmarketSansMedium';  font-weight:900; font-size:4em; opacity:1; position:absolute; letter-spacing:-2px; right:25px; bottom:25px; line-height:.8; font-style:italic;   }
.award_wrap .award_wrap_in .right_text img {  margin-top:15px;   }
.award_wrap .award_wrap_in .right_text h3 {margin-bottom:20px; padding-bottom:13px;  border-bottom:1px solid #ddd;  font-weight:900; font-size:1.6em; line-height:1.3;    color:#111;}
.award_wrap .award_wrap_in .right_text div.box {border-radius:10px;  width:75%; box-sizing:border-box;  display:flex; flex-wrap:wrap; background-color:#fff; box-sizing:border-box; gap:10px 0; }
.award_wrap .award_wrap_in .right_text div.box p {width:50%} .award_wrap .award_wrap_in .right_text div.box p b {width:100%; font-size:1.15em; font-weight:700; display:inline-block; margin-bottom:5px}
.award_wrap .award_wrap_in:nth-child(2n) .right_text {order:1; }
  

 
.list_div {width:100%;  counter-reset: item;   border:1px solid #ddd; box-sizing:border-box; display:flex; flex-wrap:wrap;}
.list_div dl  {  position:relative; box-sizing:border-box;  width:50%; border-bottom:1px solid #ddd; padding:18px;  padding-left:100px}
.list_div dl:before { counter-increment: item; content: counter(item, decimal-leading-zero);   text-align:center; font-size:1.5em;  position:absolute; left:0; width:100px; top:50%; line-height:50px;  height:50px;  margin-top:-25px; color:var(--main_c); font-weight:900}
 
.list_div dt  {font-size:1.15em;  font-weight:800;  color:#111; }
.list_div dd  {font-size:1em; margin-top:5px;  color:#333;  }
.list_div dd b  {font-size:1em;  font-weight:600;   color:#000; }


  
.award_wrap2 {width:100%; display:flex; gap:30px 0;  flex-wrap:wrap; justify-content:space-between; align-items:flex-start}
.img_text_wrap {width:48%; display:flex; flex-wrap:wrap; }
 
 
.img_text_wrap .text {width:100%;  }
.img_text_wrap ul.bl-img {width:100%; display:flex;  margin-top:20px }
.img_text_wrap ul.bl-img li   {width:100%; display:flex;   }
.img_text_wrap  a img {width:100%}
.award_wrap2 .flex { align-items:flex-end;  }
.img_text_wrap .t1  {font-size:1.5em; font-weight:900;  color:#111; }
.img_text_wrap .t2  {font-size:1.15em; margin-left:auto;     }
.img_text_wrap .t3  {font-size:.97em; margin-top:10px;  background-color:#f7f7f7; display:inline-block; padding:18px; box-sizing:border-box;  color:#222;   width:100%;  }
 
.webmind2  .certificate_list {max-width:1050px; margin:0 auto}
.webmind2  .certificate_list p {width:16.6666%; font-size:.93em}
.webmind2 .text_box2 {background-color:#f4f6f8; padding:70px 3%; box-sizing:border-box}
 
 @media all and (max-width:900px) {
		.award_wrap .award_wrap_in {border:none; flex-wrap:wrap; height:auto}
		.award_wrap .award_wrap_in .img {width:100%; border:1px solid #ddd; border-radius:10px;  height:250px; position:static; }


		.award_wrap .award_wrap_in .right_text {width:100%; min-height:auto; padding:0; margin-top:30px;  box-sizing:border-box;  }
		.award_wrap .award_wrap_in .right_text h3 { font-size:1.5em; }
		.award_wrap .award_wrap_in .right_text div.box p {width:100%}
		.award_wrap .award_wrap_in .right_text .year {display:none}

		.list_div {padding:0}
		.list_div dl  {width:100%}
		.img_text_wrap {width:100%}
		.award_wrap2 {  padding-bottom:0 }
		.award_wrap2 .flex   {flex-wrap:wrap}
		.award_wrap2 .flex .t1 {width:100%}
		.award_wrap2 .flex .t2 {width:100%; margin-top:5px}
		.img_text_wrap {  }
		.list_div dl:last-child {border-bottom:none;  }
		.list_div dl:before { width:70px}
		.list_div dl  {padding-left:70px}
       .award_wrap .award_wrap_in:nth-child(3) .img { background-size:100% !important}
       .award_wrap .award_wrap_in:nth-child(4) .img { background-size:100% !important}
       .award_wrap .award_wrap_in:nth-child(5) .img { background-size:100% !important}
}

.history_wrap {  border-bottom:1px solid #ccc; box-sizing:border-box; display:flex; align-items:center; padding: 40px 50px; color:#333; }	
.history_wrap:first-child {border-top:1px solid #555;}	
.history_wrap:last-child {border-bottom:1px solid #555;}	
.history_wrap .history_tit{font-size:3.5em; line-height:1; font-family: 'GmarketSansMedium';  font-weight:800; width:30%;  color:var(--main_c)}
.history_wrap .history_txt{ width:70%; display:flex; gap:15px; flex-direction:column; }
.history_wrap .history_txt dl{display:flex; align-items:flex-start;   }
.history_wrap .history_txt dt{font-weight:700; letter-spacing:1px; font-size:.9em; padding-top:3px;  font-family: 'GmarketSansMedium';   color:#111; width:100px; flex-shrink:0 }
.history_wrap .history_txt dd{color:#333;  display:inline-block}
.history_wrap .history_txt p {line-height:1.5;}
.history_wrap .history_txt p + p {margin-top:2px}
.history_wrap a.t_link {font-weight:600; border:1px solid var(--main_c); padding:2px 10px; font-size:16px; font-weight:400; display:inline-flex;  gap:5px; align-items:center;  border-radius:5px; margin-left:5px}
.history_wrap a.t_link i {font-size:13px}

.logo_list {width:100%; display:flex; flex-wrap:wrap;  border-right:none; border-bottom:none}
.logo_list p {width:16.666%; border:1px solid #ddd; margin-top:-1px; margin-right:-1px; box-sizing:border-box;  height:140px; display:flex; align-items:center; justify-content:center; text-align:Center; cursor:pointer}

.logo_list a {width:16.666%; height:140px; display:flex; align-items:center; justify-content:center; border:1px solid #ddd; margin-top:-1px; margin-right:-1px; box-sizing:border-box; text-align:Center;cursor:pointer  }

.logo_list img  {max-width:70% !important; max-height:60% !important;  filter: grayscale(100%); transition: all 0.3s ease-out}
.logo_list a:hover img  {  filter: grayscale(0%)}
.logo_list p:hover img  {  filter: grayscale(0%)}


 @media all and (max-width:900px) {
		.history_wrap{flex-wrap:Wrap; gap:20px;  padding:50px 0}	
		.history_wrap .history_tit{width:100%; font-size:2.5em}
		.history_wrap .history_txt{ width:100%;   }
		.history_wrap .history_txt dt{width:50px; padding-top:1px}

		.logo_list { gap:10px}
		.logo_list p {width:calc(33% - 9px); height:100px; }
		.logo_list a {width:calc(33% - 9px); height:100px;   }

		.history_wrap a.t_link {font-size:14px}
		.history_wrap a.t_link i {font-size:12px}
 

}
 

/*웹마인드*/


.content-section {
	--scroll-length: 1.5;
	height: calc( var(--scroll-length) * 100vh );
	width: 100%;
	position:relative; 
	display:inline-block; 
	.content .subheading, 
	.content .paragraph  {
	opacity: 1; 
	opacity: calc( 1 + var(--viewport-y) );
   }
 }

.figure {
  width: 100%;
  height: 100vh;
  margin: 0;
  position: absolute;
  top: 0;
  left: 0;

  > img {   
    display: block;
    width: 100%;
    height: 100%;
    max-width: 100%;
    object-fit: cover;
    object-position: center center;
  }
}

.img_content {

	top:50%;
	position:absolute;
	left:0; 
	box-sizing:border-box; 
	width:100%;
	padding:0 6%; 
	max-width:1300px;  
	font-size:1em; line-height:1.6;
	transform: translate( 0, -50%);   
}

 .img_content b {line-height:1.3}
  
 
/* ---------------------------------- */

.figure {
  --scale: calc(.8 + 
    (.2 * var(--scroll-length) * var(--visible-y))
  );
  position: sticky;
  top: 0;
  left: 0;
  margin: 0;
  display: block; 
  overflow: hidden;
  will-change: transform;
  transform: scale(var(--scale));

  &:before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 1;
    background-color: rgba(black, 1);
    opacity: calc( var(--visible-y) );
  }

  > img {
    display: block;
    will-change: transform;
    transform: scale(calc(1 / var(--scale)));
  }
}

 

.webmind1  .t1 {font-family: 'Montserrat'; font-size:5em; font-weight:600; color:#000;  }
.webmind1  .t2 {font-size:1.3em; line-height:1.5; font-weight:400; width:100%; display:inline-block; margin-top:10px}
 
.webmind1 .box1 {color: rgba(255,255,255,.9); }
.webmind1 .b1 {font-size:2.3em; display:inline-block; margin-bottom:20px; font-weight:800; color:#fff}
.webmind1 .b2 {font-size:1.5em; color:#fff;  display:inline-block; margin-bottom:25px; }

.webmind1 .box2 {color:#222; max-width:1100px}
.webmind1 .box2 .b1 { color:#000; }
.webmind1 .box2 .b2 { color:#000; }

.webmind1 .box3 {width:100%; height:300px; margin-bottom:100px; display:flex; align-items:center; text-align:center; padding:0 4%; box-sizing:border-box; font-size:1.8em; line-height:1.4; justify-content:center;}

 @media all and (max-width:900px) {
		.webmind1  .t1 {  font-size:2em;  }
		.webmind1  .t2 {font-size:1.1em; }
		.webmind1 .b1 {font-size:1.7em; }
		.webmind1 .b2 {font-size:1.2em; font-weight:500}
		.webmind1 .box3 {font-size:1.25em; height:auto;  }

}

.webmind3 b {font-size:1em; font-weight:500; line-height:1.5}
.webmind3 b span {font-weight:800; font-size:1.2em}

 @media all and (max-width:900px) {
	  .webmind3 iframe {height:200px}

}



.service .in {max-width:1400px}


.service1 .section-parent .t_box1 {font-size:1.4em; font-weight:500; text-align:Center}
.service1 .section-parent .t_box1 p {font-size:1.4em; font-weight:800; margin-bottom:7px;}
.service1 .section-parent .t_box1 p  i {color:var(--main_c)}
.service1 .section-parent .box {background-color:#fff;  box-shadow: 0 6px 26px 6px rgba(0, 0, 0, 0.05); border-radius:15px; overflow:hidden; max-width:1230px; margin:40px auto }
.service1 .section-parent .box .left_box {  padding:70px 4.5%; box-sizing:border-box }
.service1 .section-parent .box .right_box {width:47%; flex-shrink:0;   position:relative}
.service1 .section-parent .box .right_box div {width:100%; height:100%; overflow:hidden; position:absolute; left:0; top:0}
.service1 .section-parent .box .right_box div video {width:150%; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%);}
.service1 .section-parent .counting_box {font-size:4em;  font-family:'GongGothicMedium';}
.service1 .section-parent .counting_box + p {font-size:1.35em; font-weight:600}
.section-parent2 #grafico {
	position:relative;
	height:300px;
	border-left:2px solid #000000;
	border-bottom: 2px solid #000000;
	width:100%;
	margin-top:20px;
}
.section-parent2 table {display:none}
.section-parent2 .riga {
	position:absolute;
	left:0;
	height: 1px;
	background-color:gray;
	width: 100%;
}
.section-parent2 .riga div {
	float:left;
	margin: -8px 0 0 -60px;
}
 
.section-parent2 .bar{
	position:absolute;
	width: 4%;
	bottom: 0;
	background: linear-gradient(120deg, #6d819c, #4a6682);
	margin-left:3%; 
	color:#fff;
	border-radius:5px 5px 0 0;
	text-align:center; 
	box-sizing:border-box;
	padding-top:10px; 
 }

.section-parent2 .flex {margin-top:10px}
.section-parent2 .flex p {width:10%; text-align:center; font-size:15px; }

.service1 .box_list li { width:100%; text-align:center; justify-content:center;  box-sizing:border-box}
.service1 .box_list li div {padding:30px 0}
.service1 .box_list li div span {margin-bottom:6px; font-size:16px}
.service1 .box_list.type1 li {text-align:left; box-sizing:border-box; border-left:5px solid var(--main_c); border-radius:0;  padding-left:20px}
.service1 .box_list li div b {display:block; font-size:1.17em; margin-bottom:3px}

  @media all and (max-width:900px) {
		.service1 .section-parent .box {width:94%; margin-left:3%}
		.service1 .section-parent .box .left_box {padding:50px 3%;  width:100% }
		.service1 .section-parent .box .right_box {display:none}
		.service1 .section-parent .counting_box {font-size:3em}
		.service1 .box_list {gap:10px}
		.service1 .box_list li {width:calc(50% - 5px);  }
		.service1 .box_list.type1 li {text-align:center;  padding-left:0;  border-top:5px solid var(--main_c); border-left:none }
		.service1 .section-parent .t_box1 {font-size:1.1em; }
		.service1 .section-parent .t_box1 p {font-size:1.2em; }

}


.service2 .box_list li div {margin:15px 0;}
.service2 .box_list li div p { margin-top:0; font-size:1.05em }
.service2 .box_list li div h4 {color:#222;  }
.service2 .box_list2 li {text-align:left; padding:35px 30px; border-radius:0 12px 12px 0;  border-left:5px solid var(--main_c) }
.service2 .box_list2 li h4 {text-align:left}

@media all and (max-width:900px) {
	.service2 .box_list li div  {text-align:left; align-items:center; margin:0 }
	.service2 .box_list h4 {width:300px; margin-bottom:0;   display:inline-block}
	.service2 .box_list h4 i {margin-right:5px}
	.service2 .box_list2 li {width:100%}

    .section-parent2 .bar{ width:8%; left:1% }



}

/*  .homepage3_tab_wrap {width:100%; box-sizing:border-box; display:inline-block; border:3px solid var(--main_c); overflow:hidden; border-radius:10px}
 */ .homepage3_tab  {width:100%; display:flex; border:1px solid var(--main_c); border-bottom:none;  height:370px; }
.homepage3_tab ul  {width:50%; flex-shrink:0; display:flex; flex-wrap:wrap; }
.homepage3_tab ul li {display:flex; cursor:pointer;  box-sizing:border-box; padding:15px; width:50%; align-items:center;  border-right:1px solid var(--main_c); border-bottom:1px solid var(--main_c);  }
.homepage3_tab ul li.active {background-color:var(--main_c); color:#fff}
.homepage3_tab ul li h5 {margin-bottom:0; font-weight:600; font-size:1.15em;}
.homepage3_tab ul li span {width:50px}
.homepage3_tab div {padding:40px;  box-sizing:border-box;  width:50%; height:100%;  border-bottom:1px solid var(--main_c);}
.homepage3_tab .tab-content {display:none}
.homepage3_tab .tab-content.active {display:block}
.homepage3_tab div h5 {font-size:1.3em;  border-bottom:1px solid #ddd; padding-bottom:10px; margin-bottom:20px;  width:100%; display:block;}
.homepage3_tab div b { font-size: 1.1em; font-weight:700; margin-bottom: 6px; display: block; color: #222; }

@media all and (max-width:1700px) {
     .homepage3_tab div {padding:30px; }

}

@media all and (max-width:900px) {
 
		.homepage3_tab  {border-right:none; height:auto; flex-wrap:wrap;  }
		.homepage3_tab ul {width:100%}
		.homepage3_tab div {width:100%; border-right:1px solid var(--main_c); }
.homepage3_tab ul li span {width:35px}

}

.review ul {display:flex; align-items:flex-start; gap:20px 1%; flex-wrap:wrap}
.review ul li {width:24%; border:2px solid #ddd; border-radius:10px; box-sizing:border-box;   height:300px;  }
 
.review div.content_div { width:100%; display:inline-block; overflow-y:auto; padding:20px;  height:calc(100% - 60px); box-sizing:border-box;  }
.review div.content_div p {  
  width:100%; 
   font-size:.97em; 
	color:#333; 
	line-height:1.4;
 	
}
.review div.content_div p br {}

 
.review  div.name {margin-top:-1px; width:100%; font-weight:600;  border-top:1px solid #ddd;  padding:10px;  box-sizing:border-box;  display:flex;          align-items:center; }
.review  div.name span {flex-shrink:0; width:33px; height:33px; display:flex; align-items:center; justify-content:center; border-radius:50%;   background-color:var(--main_c); margin-right:10px; color:#fff; }
.review  div.name p { 
      overflow: hidden;
	text-overflow: ellipsis;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	word-wrap: break-word;
	 font-size:.95em; 
   
     }
@media all and (max-width:900px) {

	.review ul li {width:100%; height:200px  }
	.review div.content_div p { font-size:1em}
}