@charset "UTF-8";
/*--------------------------------------------------------------
>>> TABLE OF CONTENTS:
----------------------------------------------------------------
# Module
	## system
	## item-list
	## item

--------------------------------------------------------------*/

/*--------------------------------------------------------------
# Module
	## item
--------------------------------------------------------------*/
.img_max{max-width: 100%;}

.system{margin-top: 100px; }
.system-header{position: relative;width: calc(100%); height: 400px; padding: 140px 130px;color:#fff; 
	background: url("../img/img-business-header.jpg") no-repeat 00% 50%;font-size:30px; font-weight: 400;line-height: 52px;}
.system-header::after{position:absolute; top:0; left:0; display:inline-block; content: ''; width: 260px; margin-top: 100px;border-top: 3px solid #fff}
.system-body{margin-top: 160px; color:#4e4d4d;}

.item{margin-bottom: 160px;}
.item::after{content: ''; display: table;}
.item-title{font-size: 46px; font-weight: 500; margin-bottom: 40px;}

.item-content{font-size: 28px; line-height: 48px;margin-bottom: 30px;}
.item-content .bul_list li{position:relative; padding-left: 25px;}
.item-content .bul_list li:after{position:absolute;left: 0;top: 17px;display: block;content:'';width: 15px;height: 15px;background-image: url(../../images/ico/bul_business.png);background-repeat: no-repeat;background-size: contain;}

.item-sub{margin-bottom: 40px}
.step-txt{display: block; color:#878787; font-weight: 300;}
.item-list .list-title{font-size: 32px; font-weight: 500;margin-bottom: 25px;}
.item-list ul li{font-size: 28px; line-height: 40px; position: relative; margin-bottom: 10px; padding-left: 20px; background:url("../img/bullet2.gif") no-repeat 0 15px;}
.item-img{margin-top:80px; width: calc(100%);}
/* 20210217 손원웅 수정 width 32 -> 31 */
/* .item-img-box{display: inline-block; width: 32%; margin-left:1.8%;background-size: cover; } */
.item-img-box{display: inline-block; width: 31%; margin-left:1.8%;background-size: cover; }
.item-img-box:first-child{margin-left:0;}
.item-img-box img{width: calc(100%)}

.img-survey{width: 31.3%; margin-left:1.8%;}
.img-survey img{width: 31.3%}

.item-content-list{margin-top:10px; margin-left: 20px;}
.item-content-list dt{position: relative; margin-bottom: 10px; margin-top:20px; font-weight: 400; padding-left: 15px; background:url("../img/bullet2.gif") no-repeat 0 15px;}
.item-content-list dd{margin-bottom: 10px; font-weight: 300; padding-left: 15px; }
.item-content-list li{margin-bottom: 10px; font-weight: 300; padding-left: 15px; }

.item-body{ margin-top: 0;overflow: hidden; width:100%;}
.item-body + .item-body {margin-top: 180px;}

.item-box1{float: left; width: 50%;}
.item-box2{float: right; width: 45.9%;}
.item-box2::after{content:''; display: block; right:0;}

.content-title{font-size: 26px; font-weight: bold; margin-bottom: 25px;}
.main-title{font-size: 38px; color: #004680; margin-bottom: 35px; letter-spacing: -1.5px; border-left: 6px solid #004680; padding-left: 20px; line-height: 1.2; font-weight: 800; scroll-margin-top: 120px;}
.contents-info{font-size: 22px; color:#5e5e5e}

.image-list {float: right; right: 0; display: block;}
.image-list li{position: relative; display: block; }
/*
20210318 font-size 변경 28 -> 27
.image-list li .img-title{display:block; position: relative; margin-bottom: 33px;color:#b75333; text-align: right; font-size: 28px; line-height: 28px;} */
.image-list li .img-title{display:block; position: relative; margin-bottom: 33px;color:#b75333;text-indent: -9999px;}
.img-box1{display: block; width: 100%; background: #f4f4f4; border-radius: 5px; overflow: hidden; box-shadow: 0 5px 15px rgba(0,0,0,0.05); border: 1px solid #e1e1e1;}
.img-box1 img{width: 100%; height: auto; display: block;}
.img-box2{width: 100%;}

.image-list li.image-list-size1{width: 58%;}
.image-list li.image-list-size2{width: 40%;}

.image-step-wrap{margin-top:80px;}
.image-step{width: 100%; }
.image-step img{width: 100%; }
.image-step-m{display: none}

.image-shape{display: block; position: relative; width: 97.6%; overflow: hidden; margin-left: 2.4%;}
.image-shape::after{content:''; display: block;}
.image-shape li{float: left; width: 32%;  margin-left: 2%; display: block;}
.image-shape li:first-child{margin-left:0;}
.image-shape li img{display: inline-block; width: 100%;}

.video-title{margin-bottom: 20px; text-align: center; font-size: 42px;}
.video-box{background: #f0f0f0; text-align: center; }
.video-box #video {width: 70%}

.data-step1{float:left; width: 20%}
.data-step2{float:right; width: 80%;}
.data-step2::after{content:''; display: block; width: 100%;}
.data-list{ display: block; width: 95%; overflow: hidden}
.data-list li{float:left; display: inline-block;  width: 21%; margin-left: 3%; overflow: hidden;}
.data-list li:first-child{margin-left:0;}
.step-title{margin-bottom: 20px;font-size: 24px;}
.data-step2 .step-title  {width: 100%;  display: block;}
	
.video-body{margin-top:180px;}
.data-mov1{display:inline-block; padding-right: 10%; width: 90%; border-right: 1px solid #aaa;}
.data-mov2{display:inline-block;}
.data-mov-menu{display:inline-block; opacity: 0.8; background: #000 url("../img/btn-play1.png") no-repeat 50% 50%; overflow: hidden}
.data-mov-menu:hover{ opacity: 0.95;}
.data-mov-menu img{opacity: 0.5; width: 100% }
.data-name{display:inline-block; margin-top: 15px; font-size: 24px;}
/*
20210318 손원웅 margin-bottom, font-size 추가
 .data-name{display:inline-block;} */

.small-wrap{position: relative;display: inline-block; margin-right: 5px; }
.small-font{font-size: 14px; line-height: 36px;vertical-align: top; display: inline-block; margin-left: 2px;}

@media only screen and (max-width: 1920px){
	.item-img-box{ margin-left: 1.76%; }
}
@media only screen and (max-width: 1600px){
	.item-sub { margin-bottom: 30px; }
	.item-title {font-size: 42px; margin-bottom: 30px;}
	.content-title{font-size: 26px; margin-bottom: 20px;}
	.contents-info{font-size: 20px;}
	.item-content {font-size: 20px;line-height: 36px;}
	.item-list ul li{font-size: 24px; line-height: 34px;}	
	.item-list .list-title { font-size: 32px; margin-bottom: 22px;}
	.image-list li .img-title{font-size: 22px; line-height: 22px;}
	.image-list li .img-title::after{top:30px; width:100%}
	.image-list li.image-list-size1{width: 58%;}
	.image-list li.image-list-size2{width: 40%;}
	.small-font {line-height: 28px;}
	.item-content .bul_list li:after{top: 10px;}	
}
@media only screen and (max-width: 1440px){
	.item-title {font-size: 36px; margin-bottom: 24px;}
	.content-title{font-size: 25px; margin-bottom: 16px;}
	.contents-info{font-size: 18px;}
	.item-content {font-size: 22px;line-height: 32px;}
	.item-list ul li{font-size: 22px; line-height: 32px;}
	.item-list .list-title { font-size: 30px; margin-bottom: 20px;}
	.item{margin-bottom: 80px;}
	.system{margin-top: 120px; }
	.system-header{height: 320px; padding: 120px 80px; font-size:28px; line-height: 42px;}
	.system-header::after{width: 205px; margin-top: 80px; }
	.system-body{margin-top: 120px;}
	.item{margin-bottom: 120px;}
	.item-img-box{ margin-left: 1.71%; }
	
	.item-content-list dt {margin-top: 15px;margin-bottom: 5px;}
	.image-step-wrap {margin-top: 60px;}
	
	.video-body {margin-top: 100px;}
	.video-title {font-size: 36px;}
	.item-content .bul_list li:after{top: 9px;}
}
@media only screen and (max-width: 1024px) {
	.content-title {  font-size: 18px; margin-bottom: 12px;}
	.main-title { scroll-margin-top: 80px; }
	.contents-info{font-size: 15px;}
	.item-body + .item-body { margin-top: 100px;}
	.item-title {font-size: 30px; margin-bottom: 20px;}
	.item-content {font-size: 18px;line-height: 26px;margin-bottom: 50px;}
	.item-list .list-title {font-size: 22px; margin-bottom: 15px;}
	.item-list ul li {font-size: 18px;line-height: 26px;padding-left: 10px; background:url("../img/bullet2.gif") no-repeat 0 10px; background-size: 0.5%;}
	.item-list ul li::before {top: 12px;}
	.item-img {margin-top: 60px;}
	.item-img-box{ margin-left: 1.7%; }
	.item{margin-bottom: 60px;}

	.item-content-list dt {margin-top: 10px; padding-left: 10px; margin-bottom: 5px; background:url("../img/bullet2.gif") no-repeat 0 10px; background-size: 0.5%;}
	
	.item-box1 {width: 100%; padding-right: 0;}
	.item-box2 {width: 100%; float: inherit;}

	.image-list {float: inherit; position: relative;}
	.image-list::after{content:''; display: block; top: 30px; }
	.image-list li{margin-top: 30px;}
	.image-list li .img-title { margin-bottom: 28px; text-align: left;}
	.image-list li .img-title::after{top:32px;}	
	
	.system{margin-top: 80px; }
	.system-header{height: 260px;padding: 100px 60px;font-size: 24px;line-height: 36px;}
	.system-header::after{width: 165px; margin-top: 70px; border-top: 2px solid #fff;}
	.system-body{margin-top: 100px;}
	.image-step-wrap {margin-top: 40px;}
	
	.video-body {margin-top: 80px;} 
	.video-box #video {width: 100%;}
	.step-title {font-size: 20px;}
	.video-title {margin-bottom: 15px; font-size: 28px;}
	
	.small-font {font-size: 12px;line-height: 20px;}
	.item-content .bul_list li{padding-left: 15px;}
	.item-content .bul_list li:after{top: 8px;width: 10px;height: 10px;}
}
@media only screen and (max-width: 800px) {
	.item-body + .item-body {margin-top: 80px;}
	.content-title {margin-bottom: 10px;}
	.item-list ul li {font-size: 18px; line-height: 26px;position: relative;	padding-left: 15px;}
	.item-title {font-size: 26px; margin-bottom: 15px;}
	.item-content {font-size: 18px;line-height: 26px;margin-bottom: 30px;}
	.item-list .list-title {font-size: 22px; margin-bottom: 10px;}
	.item{margin-bottom: 50px;}	
	.item-box2 {clear: both;}
	.item-img-box{margin-bottom: 20px; margin-left:0; width: 100%}	
	.image-list li .img-title {font-size: 19px;  margin-bottom: 20px;  margin-bottom: 22px;}
	/*
	20210318 손원웅 font-size 20->19 변경
	 .image-list li .img-title {font-size: 20px;  margin-bottom: 20px;  margin-bottom: 22px;} */
	.image-list li { float: inherit;width: 100%; clear: both;}
	.image-list li .img-title::after {top: 30px;}
	.image-list li + li {margin-left: 0; margin-top: 50px;}
	
	.image-list li.image-list-size1, .image-list li.image-list-size2 {width: 100%;}
	.image-shape li { float: inherit; width: 100%;margin-left: 0; margin-bottom: 15px;}
		
	.system{margin-top: 50px;}
	.system-header{height: 300px; padding: 80px 40px;font-size: 20px;line-height: 32px;}
	.system-header::after{width: 130px; margin-top: 60px; }
	
	.image-step-wrap {margin-top: 30px;}
	.image-step {display: none;}
	.image-step-m {display:block; }
	.image-step-m img {width: 100%}
	
	.data-step1 {float: inherit; width: 20.6%}
	.data-step2 {float: inherit; width: 100%; margin-top: 30px;}
	
	.data-mov1 {border-right: none;}
	.video-body {margin-top: 50px;} 
	.step-title {font-size: 18px; margin-bottom: 10px;}

}
@media only screen and (max-width: 640px) {
	.system-header{height: 380px; padding: 80px 20px;}
	.data-name {margin-top: 10px; font-size: 12px;}
	.step-title {font-size: 15px;}
}

@media only screen and (max-width: 320px) {
	.system-header{height: 360px;}
}



.vision-top {
  text-align: center;
}
.vision-top .container {
  padding-bottom: 85px;
  padding-top: 20px;
  border-bottom: 1px solid #e8e8e8;
}
.vision-top .tit {
  padding-top: 0;
}
.vision-top-txt p {
  color: #0a5298;
  font-size: 24px;
}
.vision-top-txt h4 {
  color: #000;
  font-size: 44px;
}
.vision-mid .container {
  background: url("../images/alliance/vision-bg.png") no-repeat right 50px bottom;
  border-bottom: 1px solid #e8e8e8;
  padding-bottom: 60px;
}
.vision-mid .tit {
  padding-bottom: 65px;
}
.vision-mid p {
  text-align: center;
  color: #0a5298;
  font-size: 30px;
  line-height: 1.5;
}
.vision-end {
  text-align: center;
  padding-bottom: 55px;
  margin-top: 60px;
}
.vision-end .container {
  border-top: 1px solid #e8e8e8;
}
.vision-end p {
  color: #000;
  font-size: 30px;
  line-height: 1.5;
}
.vision-value {
  padding-top: 60px;
}
.vision-value > div {
  width: 530px;
  margin: 0 auto;
  position: relative;
  text-align: center;
}
.vision-value > div .item {
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 300px;
  height: 300px;
  border-radius: 50%;
}
.vision-value > div .item strong {
  color: #fff;
  font-size: 36px;
}
.vision-value > div .item.value-1 {
  background-color: #6fb4a9;
  position: relative;
  left: 50%;
  transform: translateX(-50%);
}
.vision-value > div .item.value-2 {
  background-color: rgba(9, 93, 167, 0.8);
  left: 0;
  transform: translateY(-100px);
}
.vision-value > div .item.value-3 {
  background-color: rgba(204, 204, 204, 0.8);
  right: 0;
  transform: translateY(-100px);
}
.vision-simbol {
  position: relative;
  background: url("../images/alliance/vision-foot-bg.jpg") no-repeat 50% 0;
  height: 600px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.vision-simbol .model {
  position: absolute;
  bottom: 0;
  z-index: 1;
}
.vision-simbol .simbol {
  position: relative;
  z-index: 2;
}
.vision-list .container {
  text-align: center;
}
.vision-list .container .item {
  display: inline-block;
  font-size: 0;
}
.vision-list .container .item h4 {
  font-weight: 400;
  color: #000;
  font-size: 30px;
}
.vision-list .container .item .icon {
  height: 111px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding-top: 0;
  margin-top: 70px;
}
.vision-list .container .item + .item {
  margin-left: 135px;
}
.vision-list .container p {
  font-size: 16px;
  color: #666666;
  padding-top: 60px;
  line-height: 1.5;
}
@media (max-width: 1200px) {
  .vision-top .container {
    padding-left: 20px;
    padding-right: 20px;
    margin-left: 0;
    margin-right: 0;
    padding-bottom: 40px;
    background-size: auto 100%;
  }
  .vision-top-txt h4 {
    font-size: 4vw;
  }
  .vision-top-txt p {
    font-size: 2vw;
  }
  .vision-list .container {
    overflow: hidden;
  }
  .vision-list .container .item {
    float: left;
    display: block;
    width: 25%;
  }
  .vision-list .container .item + .item {
    margin-left: 0;
  }
}
@media (max-width: 992px) {
  .vision .lg-block {
    display: block;
  }
  .vision-list .container {
    overflow: hidden;
  }
  .vision-list .container .item h4 {
    font-size: 20px;
  }
  .vision-list .container .item p {
    font-size: 12px;
  }
}
@media (max-width: 768px) {
  .vision-list {
    padding-top: 0;
  }
  .vision-top .tit {
    padding-top: 0 !important;
    padding-bottom: 25px;
  }
  .vision-top .container {
    margin-left: 15px;
    margin-right: 15px;
    padding-bottom: 20px;
    padding-top: 0 !important;
  }
  .vision-top-txt h4 {
    font-size: 5vw;
  }
  .vision-top-txt p {
    font-size: 4vw;
  }
  .vision-mid .container {
    padding-bottom: 30px;
    background-position: 50% 100%;
    background-size: auto 50%;
  }
  .vision-mid .tit {
    padding-bottom: 25px;
  }
  .vision-mid p {
    font-size: 4vw;
  }
  .vision-end {
    padding-bottom: 25px;
    margin-top: 35px;
  }
  .vision-end p {
    font-size: 4vw;
  }
  .vision-value {
    padding-top: 25px;
  }
  .vision-value > div {
    width: 320px;
  }
  .vision-value > div .item {
    width: 170px;
    height: 170px;
  }
  .vision-value > div .item strong {
    font-size: 20px;
  }
  .vision-value > div .item.value-2, .vision-value > div .item.value-3 {
    transform: translateY(-50px);
  }
  .vision-simbol {
    height: auto;
    padding: 0;
  }
  .vision-simbol .model {
    display: none;
  }
  .vision-list .container {
    overflow: hidden;
  }
  .vision-list .container .item {
    width: 50%;
  }
  .vision-list .container .item:nth-child(3), .vision-list .container .item:nth-child(4) {
    margin-top: 35px;
  }
  .vision-list .container .item h4 {
    font-size: 18px;
  }
  .vision-list .container .item .icon {
    margin-top: 15px;
  }
  .vision-list .container .item p {
    font-size: 11px;
    padding-top: 20px;
  }
}







.process-list {
  margin-top: 20px;
}
.process-list ul {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.process-list li {
  flex: 1 1 200px;
  background: #f8f9fa;
  padding: 8px 15px;
  border-radius: 8px;
  border-left: 4px solid #004680;
  font-size: 16px;
  color: #333;
  display: flex;
  align-items: center;
  box-shadow: 0 2px 5px rgba(0,0,0,0.05);
  line-height: 1.2;
  word-break: keep-all;
}
.process-list li span {
  font-weight: 800;
  color: #004680;
  margin-right: 10px;
  font-size: 18px;
}

@media only screen and (max-width: 1024px) {
  .process-list li {
    font-size: 14px;
    padding: 10px;
  }
}