@charset "utf-8";

/* main */
.main-visual {position:relative; text-align:center; color:#fff;}
.main-visual .item {position:relative; height:100vh; overflow:hidden;}
.main-visual .item img {margin:0 auto;}
.main-visual .desktop {display:block;}
.main-visual .mobile {display:none;}
.main-visual .image {position:absolute; top:0; left:0; width:100%; height:100%; overflow:hidden;}
.main-visual .image img {position:absolute; top:50%; left:0; transform:translateY(-50%); -ms-transform:translateY(-50%); -webkit-transform:translateY(-50%); width:100%; height:auto !important; max-width:100%; min-height:100%; object-fit:cover;}
.main-visual .text-wrap {position:absolute; top:50%; left:0; width:100%; padding:50px 100px; transform:translateY(-50%);}
.main-visual .text-wrap p {position:relative; transition-duration:1.7s; opacity:0;}

.main-visual .text-wrap p strong.yellow_txt { color:#ffe70e; }
.main-visual .text-wrap p:nth-child(1) {transform:translateX(100px);}
.main-visual .text-wrap p:nth-child(2) {transform:translateX(100px); transition-delay:.4s;}
.main-visual .text-wrap .inline {display:inline-block; text-align:left; position:relative;}

/* .main-visual .text-wrap .inline:before {content:"";  background:url('../images/main/mv_01_side_img.png')no-repeat; width:246px; height:183px; position: absolute; left: -39px; top: -32px; transition-duration:1.2s; opacity:0; transform:translateX(100px); } */

.main-visual .slick-current .text-wrap p {opacity:1; transform:translateX(0);}

/*붉은 종이 이미지 버전 bjm 240605 추가*/
.main-visual .red_card_ver .text-wrap p.s-txt { color:#e5e5e5; }
.main-visual .red_card_ver .text-wrap p.b-txt2 {  }
.main-visual .red_card_ver .text-wrap .inline:before { content:"";  background:url('../images/main/mv_01_side_img_red.svg')no-repeat; width:246px; height:183px; position: absolute; left: -39px; top: -32px; transition-duration:1.2s; opacity:0; transform:translateX(100px); }

/*scene3 인증으로 보는 신뢰의 케이웹 개별 추가 (숫자로보는 믿음의 케이웹 복제 후 사용) bjm 240610*/
.main-visual .img_content_ver .text-wrap .inline:before { content:"";  background:url('../images/main/mv_01_side_img_red.svg')no-repeat; width:246px; height:183px; position: absolute; left: -39px; top: -32px; transition-duration:1.2s; opacity:0; transform:translateX(100px); }
.main-visual .img_content_ver .text-wrap { transform: translateY(-100%); }


/*.main-visual .img_content_ver .slick-current .text-wrap .content_type2 ul {opacity:1; transform:translateX(0);}*/

/*붉은 종이 이미지 버전 2nd bjm 240605 추가*/
/*
.main-visual .red_card_ver2 .text-wrap p.s-txt { color:#e5e5e5; }
.main-visual .red_card_ver2 .text-wrap p.b-txt2 {  }
.main-visual .red_card_ver2 .text-wrap .inline:before { content:"";  background:url('../images/main/mv_01_side_img_red.svg')no-repeat; width:246px; height:183px; position: absolute; left: -39px; top: -32px; transition-duration:1.2s; opacity:0; transform:translateX(100px); }
*/

/*흰박스에 어두운 글씨버전*/
.main-visual .white_ver .text-wrap .inline:before {content:"";  background:url('../images/main/mv_01_side_img2.png')no-repeat; width:246px; height:183px; position: absolute; left: -39px; top: -32px; transition-duration:1.2s; opacity:0; transform:translateX(100px); }
.main-visual .white_ver .slick-current .text-wrap .inline:before {opacity:1; transform:translateX(0); }
.main-visual .white_ver .text-wrap p { color:#333; } /*white version*/
/* .main-visual .text-wrap .inline:before { content:"";  background:url('../images/main/mv_01_side_img_red.svg')no-repeat; width:246px; height:183px; position: absolute; left: -39px; top: -32px; transition-duration:1.2s; opacity:0; transform:translateX(100px); } */
.main-visual .white_ver .text-wrap p.s-txt { color:#607D8B;}
.main-visual .white_ver .text-wrap .inline:before {content:"";  background:url('../images/main/mv_01_side_img_white.svg')no-repeat; width:246px; height:183px; position: absolute; left: -39px; top: -32px; transition-duration:1.2s; opacity:0; transform:translateX(100px); }

.main-visual .slick-current .text-wrap .inline:before {opacity:1; transform:translateX(0);}




/*이미지 나열형*/
/*.main-visual .img_content_ver .text-wrap { margin-left: -257px; }*/ /*위치 맞추기용 임시*/
.main-visual .img_content_ver .text-wrap .inline { width:650px; } /*가운데 정렬위해 로고 너비만큼 width 값 잡아줌, 작업용 투명BG background:rgba(0,0,0,0.1);*/
.main-visual .img_content_ver .text-wrap p { color:#fff !important; } /*img_content_ver version*/
.main-visual .img_content_ver .slick-current .text-wrap .inline:before {opacity:1; transform:translateX(0);}
/*상단 svg 이미지 반영*/
.img_svg_ver .img_svg { padding:0 50px; }

.main-visual .img_svg {line-height:0; margin-bottom:25px;}
.main-visual .img_svg_txt { font-size:38px; line-height:1.4em; letter-spacing:-.02em;}
.main-visual .s-txt {font-size:30px; font-weight:700; line-height:1.3em; letter-spacing:-.03em; margin:0 0 15px 2px;}
.main-visual .b-txt {font-size:95px; font-weight:500; line-height:1.2em; letter-spacing:-.04em;}
.main-visual .b-txt2 {font-size:62px; line-height:1.2em; letter-spacing:-.03em; font-weight:300; }
.main-visual .b-txt2.opacity0_txt { font-size:16.3px !important;  } /*가운데정렬을 위한 로고 이미지의 너비만큼 폰트사이즈 반영 후 폰트 투명처리*/ /*opacity:0 !important; 반영해야함*/ /*폰트 사이즈로 조절하는 방식은 특정 사이즈에서 더이상 줄어들지 않아 실패.*/

.main-visual .wrap {position:absolute; top:50%; left:0; width:100%; padding:50px 100px; display:flex; align-items:center; justify-content:center; transform:translateY(-50%);}
.main-visual .wrap .text-wrap {position:static; transform:none; padding:0; margin-right:5%; width:45%; max-width:640px;}
.main-visual .wrap .device {width:50%; max-width:900px;}
.main-visual .pager-wrap {position:absolute; bottom:8%; left:50%; transform:translateX(-50%); text-align:left; z-index:50;}
.main-visual .pager { font-family:'Play', sans-serif; font-size:20px; color:rgba(255,255,255,0.6); line-height:1.3em; letter-spacing:0; margin-bottom:12px; }
.main-visual .pager .bar {margin:0 12px;}
.main-visual .pager .current {color:#fff; font-weight:700;}
.main-visual .progress {position:relative; width:300px; height:2px; background:rgba(4,19,49,.7);}
.main-visual .progress:after {content:""; position:absolute; top:0; left:0; width:0; height:100%; background:#fff; transition: 0.1s width linear;}
.main-visual .progress.animate:after {transition:width linear; width:100%; transition-delay:unset; transition-duration:6s;} /*슬라이더 바 흰색차는 모션 시간*/
.main-visual video {object-fit: cover;}

/*main visual slider */
.main-visual .text-wrap .inline:before { } 
.main-visual .img_svg { width:60%; margin:0 auto 25px;}
.main-visual .img_svg_txt {font-size:36px;}
.main-visual .s-txt {font-size:26px; font-weight:700; } 
.main-visual .b-txt {font-size:75px;}
.main-visual .pager {font-size:18px;}
.main-visual .pager .bar {margin:0 10px;}
.main-visual .progress {width:220px;}

/*new add 230605 bjm*/
/*인증내용*/
.content_type2 ul { position:absolute; min-width:665px; transition-duration: 1.7s; } 
.main-visual .text-wrap .content_type2 ul { opacity:0; transform:translateX(-100px); } /*로고 등장 전 투명도0, 위치값 뒤로 배치*/
.main-visual .slick-current .text-wrap .content_type2 ul { opacity:1; transform:translateX(0px); } /*슬라이더 활성화 시 투명도1, 원래 위치로 배치*/
.content_type2 ul li { float:left;  width:210px; height:60px; line-height:60px; margin-right:10px; margin-bottom:14px; font-size:20px; font-weight:600; text-align:center; color:#333;  background:#fff; border-radius:50px;  transition-duration: 1.7s; display:flex; justify-content: center; }
.content_type2 ul li img { width:170px; } 
.content_type2 ul li:nth-child(5) img { width:90px; }
.content_type2 ul li:nth-child(6) img { width:124px; }
.content_type2 ul li:nth-child(7) img { width:120px; }

@media (max-width: 1400px) {
	.main-visual .img_svg {width:80%;}
}

@media (max-width: 1200px) {
	/*인증내용*/
	.content_type2 ul { min-width:555px; }
	.content_type2 ul li { width: calc((100% - 4%)/3); height: 69px; margin-right: 2%; margin-bottom: 2%; font-size: 18px; } /* line-height:55px;  font-size:18px; */
	.content_type2 ul li:nth-child(3n) { margin-right:unset; }
	
	.content_type2 ul li img { width: 180px; }
	.content_type2 ul li:nth-child(5) img { width: 90px; }
	.content_type2 ul li:nth-child(6) img { width: 120px; }
	.content_type2 ul li:nth-child(7) img { width: 122px; }
	/*이미지 나열형*/
	.main-visual .img_content_ver .text-wrap .inline { width:70vw; } /*background: blue;*/
	.main-visual .img_svg {width:800px;} /**/
	.main-visual .img_svg_txt { font-size: 32px;}
}
@media (max-width: 1024px) {
	/*main visual slider */
	.main-visual .img_svg_txt {font-size:32px;}
	.main-visual .s-txt {font-size:28px; font-weight:700;}
	.main-visual .b-txt {font-size:62px;}
	.main-visual .b-txt2 {font-size:50px;}
	
} 
@media (max-width: 980px) {
	/*인증내용*/
	.content_type2 ul { min-width: 680px; }
	.content_type2 ul li { width:calc((100% - 3%)/3); height:70px; line-height:70px; margin-right:1.5%; margin-bottom:1.5%; font-size:16px; }
	.content_type2 ul li img { width: 170px; }
	.content_type2 ul li:nth-child(5) img { width: 70px; }
	.content_type2 ul li:nth-child(6) img { width: 104px; }
	.content_type2 ul li:nth-child(7) img { width:100px; }
	/*이미지 나열형*/
	.main-visual .img_content_ver .text-wrap .inline { width:680px; }
	
	.main-visual .img_svg { width:100%; margin: 0 auto 30px; padding: 0 20px; }
	
	
	
}
/* portrait tablet */
@media (max-width: 900px) {
	/*main visual slider */
	.main-visual .wrap {display:block;  transform:translateY(-40%);}
	.main-visual .wrap .text-wrap {margin:0 auto 5%; width:100%;}
	.main-visual .wrap .device {width:80%; margin:0 auto;}
	.main-visual .img_svg {width:100%;}
} 
@media (max-width: 840px) {
	/*main visual slider*/
	.main-visual .desktop {display:none;}
	.main-visual .mobile {display:block;}
	.main-visual .slick-current .text-wrap .inline:before { transform: translateX(0) scale(1.2); top: -0.9524vw; left: -2.8571vw; }
	.main-visual .s-txt { font-size: 4.2857vw; }

	.main-visual .white_ver .text-wrap p.s-txt { margin: 0 0 0.5952vw 0; }
	.content_type2 ul li:nth-child(3n) { margin-right:1vw; }
	
	/*인증내용*/
	.content_type2 ul { min-width: 80vw; }
	.content_type2 ul li { width: 25.6vw;  height: 9vw; line-height: 8vw; margin-right: 1vw; margin-bottom: 1.2vw; font-size: 2.1vw; }
	.content_type2 ul li img { width: 20vw; }
	.content_type2 ul li:nth-child(5) img { width: 10.6vw; }
	.content_type2 ul li:nth-child(6) img { width: 15vw; }
	.content_type2 ul li:nth-child(7) img { width: 15vw;  } /*width: 31.9048vw; height:23.8095vw;*/
	/*이미지 나열형*/
	.main-visual .img_content_ver .text-wrap .inline { width:75vw; }
	.main-visual .img_svg {width:100%;}
	.img_svg_ver .img_svg { padding: 0px; }
	.main-visual .b-txt2 { font-size: 5.9524vw; }
	.main-visual .text-wrap { padding: 50px 70px; }
}
/* Landscape phone */
@media (max-width: 640px) {
	/*main visual slider */
	
	.main-visual .text-wrap {padding:15px;}
	.main-visual .text-wrap .inline:before {width:116px; height:116px; left:50%; margin-left:-58px; top:-32px;}
	/*흰박스에 어두운 글씨버전*/
	.main-visual .white_ver .text-wrap .inline:before { width:90px; height:66.9px; left:50%; margin-left: unset; transform: translateX(-50%); top:-18px; }
	.main-visual .white_ver .text-wrap p { margin-bottom: 30px; }
	/* .main-visual .img_content_ver .text-wrap .inline:before {width:116px; height:116px; left:50%; margin-left:-58px; top:-32px;} */
	/*svg 상단이미지 반영형*/
	.main-visual .img_svg {width:100%;}
	.main-visual .img_svg_txt { font-size:5.5vw; }

	.main-visual .s-txt {font-size:4.8vw; text-align:center; margin:0 0 20px;}
	.main-visual .white_ver .text-wrap p.s-txt { margin: 0 0 4.0476vw 0; }
	
	.main-visual .b-txt {font-size:50px; text-align:center;}
	.main-visual .b-txt2 {font-size:7vw; text-align:center;}
	.main-visual .b-txt2 br {} /*display:none;*/
	.main-visual .wrap {padding:15px;}
	.main-visual .wrap .device {width:110%; margin:0 -5%;}
	.main-visual .pager {font-size:16px; margin-bottom:8px;}
	.main-visual .pager .bar {margin:0 8px;}
	.main-visual .progress {width:150px;}
	.main-visual .progress.animate:after {transition-duration:2s;}
	
	/*scene2 붉은 박스 있는 컨텐츠 bjm 240610 */
	.main-visual .red_card_ver .text-wrap .inline:before { transform: translateX(-50%) scale(0.8); top: -8.1250vw; left: 50%; margin: 0; }
	
	/*scene3 인증으로 보는 믿음의 케이웹 bjm 240610*/
		.main-visual .img_content_ver .text-wrap .inline:before { width:37.375vw; height: 28.5717vw;; left:50%; margin: 0; top: -6.125vw; transform: translateX(-50%) scale(1); }

	/* .main-visual .slick-current .text-wrap .inline:before { transform: translateX(-50%) scale(0.8); top: -8.1250vw; left: 50%; margin: 0; } */
	
	/*scene3 인증으로 보는 신뢰의 케이웹 bjm 240610*/
	.main-visual .img_content_ver .text-wrap .content_type2 ul { left: 50%; margin-left:-50%; transform:translateX(-50%); min-width: 77vw; opacity:0; } /*로고들 가운데 정렬 이후 브라우저 640px 미만에서 등장모션 안됨 >  margin-left 음수값 추가하여 해결 bjm 240610 */
	.main-visual .slick-current .img_content_ver .text-wrap .content_type2 ul { opacity:1; margin-left:unset; }

	.main-visual .img_content_ver .text-wrap .content_type2 ul li { width: 38vw; height: 10.5vw; }
	.main-visual .img_content_ver .text-wrap .content_type2 ul li:nth-child(2n) { margin-right:0; }
	.main-visual .img_content_ver .text-wrap .content_type2 ul li img { width: 30vw; }
	.main-visual .img_content_ver .text-wrap .content_type2 ul li:nth-child(5) img {  width: 15vw; }
	.main-visual .img_content_ver .text-wrap .content_type2 ul li:nth-child(6) img {  width: 20vw; }
	.main-visual .img_content_ver .text-wrap .content_type2 ul li:nth-child(7) img {  width: 20vw; }
	
		
	/*인증내용*/
	.content_type2 ul { min-width: 50vw; }
	.content_type2 ul li { width: 24vw; height: 7vw; line-height: 7vw; margin-right: 1vw; margin-bottom: 1.2vw; font-size: 2.6vw; }
	.content_type2 ul li img { width: 18vw; }
	/*이미지 나열형*/
	.main-visual .img_content_ver .text-wrap .inline { width:49vw; }
	/*.main-visual .text-wrap { padding: 0px; }*/
	
	
	
	/*svg 상단이미지 반영형*/
	.main-visual .img_svg { width:90%; margin: 0 auto 5vw; }
	.img_svg_ver .img_svg { padding: 0px; }
} 
@media (max-width: 480px) {
	.content_type2 ul { min-width: 80vw; } /*min-width: 58vw;*/
	.content_type2 ul li { width: 28vw; height: 9vw; line-height: 9vw; margin-right: 1vw; margin-bottom: 1.2vw; font-size: 3vw; }
	.content_type2 ul li img { width: 21vw; }
	.content_type2 ul li:nth-child(5) img { width: 12vw; }
	.content_type2 ul li:nth-child(6) img { width: 16vw; }
	.content_type2 ul li:nth-child(7) img { width: 16vw; }
	.main-visual .img_content_ver .text-wrap .inline { width:49vw; }
	/*이미지 나열형*/
	.main-visual .img_content_ver .text-wrap .inline { width:56.7vw; }
	/*svg 상단이미지 반영형*/
	.img_svg_ver .img_svg { padding: 0px; }

	.main-visual .b-txt2 { font-size: 7.5vw; }
	
    .main-visual .white_ver .text-wrap .inline:before { width: 20vw; height: 15.3983vw; left: 50%;  top: -4.75vw; }
    .main-visual .s-txt { font-size: 5.8vw; }
	.main-visual .white_ver .text-wrap p { margin-bottom: 6.25vw; }
	
	.main-visual .white_ver .text-wrap p.s-txt { margin: 0 0 20px 0; }
	
	/*scene2 붉은 박스 있는 컨텐츠 bjm 240610 */
	.main-visual .red_card_ver .text-wrap .inline:before { transform: translateX(-50%) scale(0.67); top:-12.6563vw;  }
	
	/*scene3 인증으로 보는 신뢰의 케이웹 bjm 240610*/
	.main-visual .img_content_ver .text-wrap .content_type2 ul {  min-width: 82vw;}
	.main-visual .img_content_ver .text-wrap .content_type2 ul li { width: 40vw; height: 12vw; }
	.main-visual .img_content_ver .text-wrap .content_type2 ul li:nth-child(2n) { margin-right:0; }
	.main-visual .img_content_ver .text-wrap .content_type2 ul li img { width: 32vw; }
	.main-visual .img_content_ver .text-wrap .content_type2 ul li:nth-child(5) img {  width: 17vw; }
	.main-visual .img_content_ver .text-wrap .content_type2 ul li:nth-child(6) img {  width: 22vw; }
	.main-visual .img_content_ver .text-wrap .content_type2 ul li:nth-child(7) img {  width: 24vw; }
}	

@media (max-width: 420px) {
	.main-visual .red_card_ver .text-wrap .inline:before { transform: translateX(-50%) scale(0.5); top: -18.6563vw; }
}