/* header#header  {background-color:#fff}
 */header#header h1 img:nth-child(1) {display:none}
header#header h1 img:nth-child(2) {display:block}

header#header  a.nav_link {color:#333 !important}

body {height:100%}
html {height:100%}
 
section {word-break: keep-all; }

.kakao_fixed {position:fixed; right:2%; bottom:80px; z-index:999999; width:62px}

.main_vi {height:100%; position:relative}
.main_vi .main_vi_bg {overflow:hidden; height:100%}
.main_vi .main_vi_bg .bg_flex {width:100%; height:100%; position:absolute; display:flex}
 
.main_vi .main_vi_bg .bg_flex .bg_color1 {background-color:#cebce8; width:50%; opacity:.5}
.main_vi .main_vi_bg .bg_flex .bg_color2 {background-color:#ffc6e0; width:50%; opacity:.5}

 
.main_vi .vi_text {  width:50%; color:#3d058d; font-size:5rem; font-weight:800; text-align:center; position:absolute; left:0; top:50%; transform: translate(0, -50%);  z-index:999;   box-sizing:border-box;   }
.main_vi .vi_text.type2 {left:auto; right:0; color:#e6008b }

 
.main_vi .vi_text h2 {font-size:1.7rem; line-height:1;  font-weight:500;}
.main_vi .vi_text p { font-size:6.5rem;  letter-spacing:-3px; line-height:1; font-weight:800; margin-top:5px}


 
  

.about_box {width:100%; max-width:1300px; margin:0 auto; padding:130px 50px 50px 50px; box-sizing:border-box;  display:flex; align-items:center; }
.about_box .text {width:50%}
.about_box h2 {font-size:1.3em; font-weight:400; letter-spacing:3px; color:#111}
.about_box h3 {font-size:5em; font-weight:800;}
.about_box p {font-size:1.2em; margin-top:20px; color:#333; line-height:1.5; font-weight:400; }
.about_box a {padding:13px 30px; margin-top:20px; border-radius:5px; display:inline-block; background-color:rgb(230, 0, 139); color:#fff !important; font-size:1.05em; font-weight:500}



.customer {width:100%; text-align:center; background-color:#3d058d; color:#fff; padding:100px 0; position:relative; overflow:hidden; margin-top:60px }
.customer .container {position:relative; z-index:999}
.customer span {letter-spacing:1.5px;  font-weight:300; font-size:1.1em; }
.customer h3 {font-size:2.7em; margin-bottom:20px; margin-top:10px; letter-spacing:-2px}
.customer a {color:#fff; border:1px solid rgba(255,255,255,.5); padding:12px 50px; display:inline-block; font-size:1.2em; border-radius:55px; margin-right:10px; transition: all 0.3s;}
.customer a:hover {background-color:#fff; border:1px solid #fff; color:#333 !important}
.customer img {position:absolute; width:100%; top:0; left:0; opacity:.2 }

.customer .btn {display:flex; justify-content:center}

.slide_logo {width:100%; padding:15px 0; box-sizing:boder-box; display:flex; justify-content:center}
.slide_logo li {width:120px; margin:0 15px}
.slide_logo img {width:100%; filter:grayscale(100%); opacity:.3}
  



 @media all and (min-width:900px) {

		.about_box .right_box {width:45%; padding-bottom:40%; margin-left:auto; position:relative;  transition: all 0.3s ease-out; box-sizing:border-box; background-color:#f1f1f1; border-radius:20px; margin-top:40px;  }

		.about_box .right_box::after {content:''; width:100%; height:100%;  position:absolute;   bottom:0; background:url('../img/20756400.jpg') no-repeat center;   background-size:cover; transition: all 0.3s ease-out; border-radius:20px;  right:40px; bottom:40px;}
		.about_box .right_box:hover::after { right:0; bottom:0; } 
 

}

 @media all and (max-width:1300px) {
		   
		.main_vi .vi_text h2 {font-size:1.5rem;}
		.main_vi .vi_text p { font-size:7.5vw }
		.slide_logo li:nth-child(n + 10) {display:none}


}

 @media all and (max-width:900px) {
         .kakao_fixed {display:none}
         .main_vi {height:90vw; margin-top:62px}
             .main_vi .main_vi_bg .bg_flex .bg_color1 {width:100%}
             .main_vi .main_vi_bg .bg_flex .bg_color2 {display:none}
 			.main_vi .vi_text {  width:100%;  text-align:center;  }
            .main_vi .vi_text h2 {font-size:5vw;}
 			.main_vi .vi_text p { font-size:10vw; letter-spacing:0 }

 
            .main_vi .vi_text.type2 {display:none}

 
			.about_box { padding:70px 5% 50px 5%; display:flex; flex-wrap:wrap; box-sizing:border-box}
			.about_box .text {width:100%}
			.about_box h2 {font-size:1em; }
			.about_box h3 {font-size:3em; margin-top:0; }
			.about_box p {font-size:.97em; margin-top:10px  }
			.about_box a   {font-size:.97em; padding:10px 25px}

			.about_box .right_box {width:100%; padding-bottom:40%; margin-left:auto; position:relative;    box-sizing:border-box; background-color:#f1f1f1; border-radius:10px; margin-top:20px }
			.about_box .right_box::after {content:''; width:100%; height:100%;  position:absolute; right:0; bottom:0; background:url('../img/20756400.jpg') no-repeat center;   background-size:cover; transition: all 0.3s ease-out; border-radius:10px;}



			.swiper-button-next {display:none !important}
			.swiper-button-prev {display:none !important}

			.slide_logo li {margin:0 10px}
			.slide_logo li:nth-child(n + 5) {display:none}



			.customer { padding:50px 0; margin-top:50px }
			.customer h3 {font-size:5vw; margin-bottom:20px; letter-spacing:-.5px}
			.customer a {font-size:1em; margin:0 0.3%; padding:10px 0; width:48%}


  

			.cursor,
			.cursor2,
			.cursor3 {display:none}
}

 @media all and (min-width:900px) {
   
.cursor,
.cursor2,
.cursor3{
	position: fixed;
	border-radius: 50%;	
	transform: translateX(-50%) translateY(-50%);
	pointer-events: none;
	left: -100px;
	top: 50%;
	-webkit-transition: all 300ms linear;
	transition: all 300ms linear;
}
.cursor{
	background-color: #fff;
	z-index: 999999999999999999999999999999999999999999999;
	height: 0;
	width: 0;
}
.cursor2,.cursor3{
	height: 25px;
	width: 25px;
	z-index:999999999999999999999999999999999999999999999;
	-webkit-transition:all 0.1s ease-out;
	transition:all 0.1s ease-out
}
.cursor2.hover,
.cursor3.hover{
	-webkit-transform:scale(2) translateX(-35%) translateY(-35%);
	transform:scale(2) translateX(-35%) translateY(-35%);
	border:none
}
.cursor2{
}
.cursor2.hover{
	background: rgba(255,255,255,0.1);
}
.cursor2.hover .progress-wrap {
	box-shadow: inset  0 0 0 2px rgba(255,255,255,0);
}
.cursor2.hover .progress-wrap svg.progress-circle path {
	opacity: 0.7;
}


 }


 /**/

.main_swiper_wrap {position:relative; width:100vw; overflow:hidden;}
.main_swiper_wrap > div {width:100%; box-sizing:border-box; padding:0 5%}

 

.mySwiper_b .swiper-pagination-bullet  {opacity:.1}
.mySwiper_b .swiper-pagination-bullet-active {opacity:1; background-color:#333}
.mySwiper_b .swiper-slide:hover {cursor:pointer}

.mySwiper_b .swiper-slide div.img_box {width:85%; margin:0 auto; padding-bottom:85%; position:relative; background-color:#fff; border:1px solid #ddd; border-radius:50%; overflow:hidden}
.mySwiper_b .swiper-slide  div.img_box img {width:90%; position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); }

.mySwiper_b .swiper-slide h3 {font-size:1.5em; text-align:center; font-weight:600; line-height:1.3; display:block; margin:25px 0 8px 0}
.mySwiper_b .swiper-slide h3 img {max-width:60%}
.mySwiper_b .swiper-slide p {font-size:1.1em; text-align:center; font-weight:400; line-height:1.3; color:#555;
width: 100%;

 overflow: hidden;
text-overflow: ellipsis;
display: -webkit-box;
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
word-wrap: break-word;

}


.swiper-pagination {margin-top:10px;   }

.swiper-pagination-bullet {width:50px; height:5px; border-radius:0}
.swiper-pagination-bullet-active {background-color:#fff}
.swiper-pagination-fraction, .swiper-pagination-custom, .swiper-container-horizontal > .swiper-pagination-bullets {bottom:5%}



 @media all and (min-width:900px) {
 
 		.mySwiper_b .swiper-slide  div.img_box:after {content:'+'; position:absolute; left:0; top:0; width:100%; height:100%; background:rgb(230, 0, 139); color:#fff; font-size:6rem; font-weight:200; text-align:center; display:flex; align-items:center; justify-content:center; opacity:0; transition: all 0.3s;}
		.mySwiper_b .swiper-slide:hover div.img_box:after {opacity:1}



}

 @media all and (max-width:900px) {
 
			.mySwiper_b .swiper-slide h3 {font-size:1.15em; margin:15px 0 5px 0}
	.mySwiper_b .swiper-slide h3 img {max-width:70%}
		.mySwiper_b .swiper-slide p {font-size:1em; }

			.swiper-pagination {margin-top:5px;  }
			.mySwiper_b .swiper-slide div.img_box {width:97%;  padding-bottom:97%; }

}