@charset "utf-8";
/* ********************************************************************
 * name : ½º¸¶Æ®¼Ö·ç¼Ç
 * filename : main.css
 * description : ¸ÞÀÎ ÄÜÅÙÃ÷ css 
 * date : 2024-02-01
********************************************************************* */


/* === ºñÁÖ¾ó === */
.visualWrap{width:100%;height:100vh;color:var(--white-color);background: url(../img/main/vis_bg.jpg) no-repeat center rgb(7,26,154);background-size: cover;overflow: hidden;}
.visualWrap .visObject{position: relative;}
.visualWrap .visObject p{position: absolute}
.visualWrap .visObject .ob1{right: 6%;top: -30vh;animation: ob1 3.05s infinite alternate;}
.visualWrap .visObject .ob2{right: -7%;top: 27vh;animation: moveRight 6.05s linear 0s infinite alternate, moveBotton 5.4s linear 0s infinite alternate;}
.visualWrap .visObject .ob3{top: 66vh;right: 3%;animation:ob2 5s infinite alternate}
.visualWrap .visObject .ob4{top: 3vh;left: 25vw;animation: moveX 8.05s linear 0s infinite alternate, moveY 10.4s linear 0s infinite alternate;}
.visualWrap .visObject .ob5{left: -9vw;top: 5vh;animation: ob3 3.05s infinite alternate;}
.visualWrap .visObject .ob6{top: 73vh;left: -7vw;animation: rotate 10s infinite alternate;}
.visualWrap .visTitel{position: relative;width: 65vw;height: 65vh;display: flex;justify-content: center;align-items: center;top: 50%;left: 50%;transform: translate(-50%, -50%);}
.visualWrap .visTitel .title{position: absolute;z-index: 1;text-align: center;}
.visualWrap .visTitel .title h2{font-size:22px;font-weight:300;margin-bottom: 1em;}
.visualWrap .visTitel .title h2 strong{font-weight:700;}
.visualWrap .visTitel .title h3{font-size:52px;line-height: 1.3;}

.visualWrap .visTitel .title a{position: relative;display: inline-block;width: 275px;padding: 17px 0;border: none;box-shadow: inset 0 0 0 3px var(--white-color);letter-spacing: 1px;font-weight: 600;font-size:20px;
	background: none;color: var(--white-color);text-transform: uppercase;outline: none;overflow: hidden;transition: .5s ease-in-out;z-index: 0;border-radius: 50px;margin-top: 2em;}
.visualWrap .visTitel .title a:after {content: '';position: absolute;background: var(--white-color);opacity: 0;z-index: -1;}
.visualWrap .visTitel .title a i{background: url(../img/main/arrow.png) no-repeat center;width:31px;height:13px;margin-left:15px;display: inline-block;}
.visualWrap .visTitel .title a:hover{color: var(--main-color);}
.visualWrap .visTitel .title a:hover i{filter: invert(35%) sepia(51%) saturate(4654%) hue-rotate(199deg) brightness(93%) contrast(88%);}
.visualWrap .visTitel .title a:hover:after {height: 330%;opacity: 1;}
.visualWrap .visTitel .title a:after {top: 50%;left: 50%;width: 100%;height: 50%;transform: translate(-50%, -50%) rotate(-135deg);transition: opacity .3s ease-in-out, height .3s ease-in-out;}

.visualWrap .visTitel .titleBg{width: 100%;height: 100%;border-radius: 30px;background-color: rgb(26 118 213 / 59%);backdrop-filter: blur(10px);box-shadow:inset -7px -2px 12px -7px rgb(255 255 255 / 25%);}
.visualWrap .visLink{position: relative;top: 29vh;width: 100%;}
.visualWrap .visLink a.instar{filter: invert(100%) sepia(93%) saturate(2%) hue-rotate(98deg) brightness(111%) contrast(101%);display: block;width: 40px;position: absolute;bottom: 0;left: 4%;transition: all 0.5s;}
.visualWrap .visLink a.instar:hover{opacity: 0.6;}
.visualWrap .visLink a.contact{font-size: 18px;transform: rotate(270deg);position: absolute;bottom: 20px;right: 4%;color: #fff;font-weight: 500;animation: contactDown 1.5s ease-in-out infinite;}
.visualWrap .visLink a.contact:after{content: '';display: flex;width: 67px;height: 1px;background: #fff;opacity: 0;}
.visualWrap .visLink a.contact:hover:after{animation: btnhover .5s forwards ease-in-out;}

/* === snsÅǽ½¶óÀ̵å === */
.snsTabWrap{width: calc(100% - 8%);padding: 10em 4% 22em;position: relative;background: #fff;z-index: 0;}
.snsTabWrap h2{color:#202020;font-size: 42px;font-weight: 300;margin: 2em 0 0 5em;line-height: 1.3;}
.snsTabWrap h2 strong{color: var(--main-color);display: block;}
.snsTabSilde{max-width: 1920px;margin: 0 auto;padding-top: 5em !important;height: 638px;margin-top: -5em;}
.snsTabSilde .swiper-wrapper{width: 59%;}
.snsTabSilde .swiper-slide{display: flex;align-items: flex-start;justify-content: space-between;width: 100% !important;flex-direction: row;opacity: 0 !important;}
.swiper-fade .swiper-slide-active{ opacity: 1 !important;}
.snsTabSilde .swiper-slide .phoneCon{width: 265px;padding-top: 4em;position: absolute;right: 24px;}
.snsTabSilde .swiper-slide .phoneCon:after{content:'';background: url(../img/main/phone.png) no-repeat center;width:320px;height:638px;position: absolute;left: 50%;top: 50%;z-index: -1;transform: translate(-50%, -50%);box-shadow: 18px 1px 20px 4px #00000029;border-radius: 42px;}
.snsTabSilde .swiper-slide .phoneCon .conBox{position: relative;width: 100%;height: 480px;}
.snsTabSilde .swiper-slide .phoneCon .conBox h3{font-size:24px;color:#1e1e1e;position: absolute;top: 0;}
.snsTabSilde .swiper-slide .phoneCon .conBox p{font-size:17px;color:#828282;margin: 20px 0;position: absolute;top: 5vh;}
.snsTabSilde .swiper-slide .phoneCon .conBox img{width:96px;height:96px;position: absolute;bottom:33%;left: 50%;transform: translate(-50%, 0);box-shadow: 1px 1px 14px 7px #00000021;border-radius: 25px;}
.snsTabSilde .swiper-slide .phoneCon .conBox .btn{text-align: center;border-top: 1px solid #236ae045;padding: 20px 0;position: absolute;bottom: 0;width: 100%;}
.snsTabSilde .swiper-slide .phoneCon .conBox .btn:after{}
.snsTabSilde .swiper-slide .phoneCon .conBox .btn a{border: 1px solid #236ae0;display: block;border-radius: 50px;padding: 10px 0;color: #236ae0;font-size: 17px;font-weight: 600;}
.snsTabSilde .swiper-slide .phoneCon .conBox .btn a:hover{background:var(--main-color);color:#fff;}
.snsTabSilde .swiper-slide .imgBox{padding: 5.5em 0;display: flex;align-items: center;}
.swiper-fade .swiper-slide-active .imgBox .img1{animation: text-active-animation 1s cubic-bezier(0.4, 0, 0.2, 1) both;}
.swiper-fade .swiper-slide-active .imgBox .img2{animation: text-active-animation 2s cubic-bezier(0.4, 0, 0.2, 1) both;}
.snsTabSilde .swiper-slide .imgBox img{position: relative;height: 100%;box-shadow: 2px 3px 11px 1px #00000024;border-radius: 27px;}
.snsTabSilde .swiper-slide .imgBox img.i1{right: 37px;top: 100px;border-radius: 15px;}
.snsTabSilde .swiper-slide .imgBox img.i2{right: 110px;top: 100px;border-radius: 25px;}
.snsTabSilde .swiper-slide .imgBox img.i3{transform: rotate(10deg);margin-left: 3em;top: 0.5em;}

.snsTabSilde .swiper-pagination{display: grid;grid-template-columns: 1fr 1fr;grid-column-gap: 20px;width: 36.5% !important;position: absolute;right: 0;left: inherit !important;bottom: inherit !important;top: 10em !important;}
.snsTabSilde .swiper-pagination .custom_bullet{transition: all 0.5s;display: flex;align-items: center;background: none;margin: 2em 0;cursor: pointer;}
.snsTabSilde .swiper-pagination .custom_bullet span{font-size:20px;color:#202020;margin-left: 48px;}
.snsTabSilde .swiper-pagination .custom_bullet img{width:76px;height:76px;filter: grayscale(100%);opacity:0.5;}
.snsTabSilde .swiper-pagination .custom_bullet:hover img,
.snsTabSilde .swiper-pagination .swiper-pagination-bullet-active img{opacity:1;}
.snsTabSilde .swiper-pagination .custom_bullet:nth-child(5) img,
.snsTabSilde .swiper-pagination .custom_bullet:nth-child(6) img{opacity:0.3;}
.snsTabSilde .swiper-pagination .swiper-pagination-bullet-active span,
.snsTabSilde .swiper-pagination .custom_bullet:hover span{color: var(--main-color);font-weight: 700;}
.snsTabSilde .swiper-pagination .swiper-pagination-bullet-active img,
.snsTabSilde .swiper-pagination .custom_bullet:hover img{filter: none;transition: 0.5s ease-out}
.snsTabSilde .swiper-pagination .swiper-pagination-bullet-active:nth-child(5) img,
.snsTabSilde .swiper-pagination .swiper-pagination-bullet-active:nth-child(6) img,
.snsTabSilde .swiper-pagination .custom_bullet:hover:nth-child(5) img,
.snsTabSilde .swiper-pagination .custom_bullet:hover:nth-child(6) img{opacity:1;}

.snsTabWrap .shapeBg{background:#edf5ff;width: 923px;height: 923px;position: absolute;top: 12.5em;border-radius: 50%;z-index: -1;left: 50%;transform: translateX(-50%);}
.swiper-notification{display:none !important;}

/* === ŸÀÌƲ === */
.mTitleBox{position: relative;z-index: 1;}
.mTitleBox h2{font-size: 20px;margin-bottom: 1.5em;color:#191919;}
.mTitleBox p{font-size: 42px;font-weight: 700;line-height: 1.3;color:#202020;}
.mTitleBox p strong{color:var(--main-color);}
.txtWhite h2,
.txtWhite p{color:#fff;}
.mt-8{margin-top: 8em;}


/* === ¼ýÀÚ === */
.countWrap{background: var(--main-color);padding: 10em 4% 16em;display: flex;flex-direction: row;justify-content: space-between;position: relative;overflow: hidden;}
.countWrap:after{content:'';background: url(../img/main/countbg.png) no-repeat center;width:370px;height:599px;position: absolute;left: -4%;top: -35px;}
.countWrap .conBox{width: 60%;}
.countWrap .conBox ul{display: flex;flex-wrap: wrap;}
.countWrap .conBox ul li{color:#fff;width: calc(50% - 11em);background: #4684e9;padding: 3em 4em;margin: 1.5em;border-radius: 0 0 60px 0;box-shadow: 3px 5px 20px 0px #00000036;}
.countWrap .conBox ul li:nth-child(2){background:#3f98ea;position: relative;top: 8em;}
.countWrap .conBox ul li:nth-child(3){background:#3f98ea;}
.countWrap .conBox ul li:nth-child(4){position: relative;top: 8em;}
.countWrap .conBox ul li h3{font-size:20px;}
.countWrap .conBox .figure{font-size:36px;}
.countWrap .conBox .figure strong{}
.countWrap .conBox .figure i{font-weight: bold;font-size: 24px;vertical-align: 2px;margin-left: 10px;}
.countWrap .conBox ul li span{text-align: right;display: block;margin: 5em 0 0;}
.countWrap .conBox ul li span img{}

/* === ¼º°ø»ç·Ê === */
.successWrap{margin: 0 4%;padding-top: 2em;}
.successWrap .conBox{display: grid;grid-template-columns: 1fr 1fr 1fr;grid-column-gap: 45px;margin: 9em 0 10em;}
.successWrap .conBox li{background:var(--main-color);border-radius: 30px;padding: 4em 3em 3em;position: relative;top:0;transition: all 0.5s}
.successWrap .conBox li a{color:#fff;}
.successWrap .conBox li:nth-child(2){top: -7em;}
.successWrap .conBox li:nth-child(3){top: -15em;}
.successWrap .conBox li h3{font-size:24px;}
.successWrap .conBox li h3 span{background: url(../img/main/successicon.png) no-repeat center;/*width:110px;*/width:85px;height:18px;display: block;margin-bottom: 10px;background-size: 100%;}
.successWrap .conBox li p{font-size:17px;letter-spacing: -0.05em;margin-top: 6em;position: relative;z-index: 1;}
.successWrap .conBox li img{position: absolute;right: 3em;top: 4em;}
#element-1.img-in-slide,
#element-2.img-in-slide,
#element-3.img-in-slide{animation: image-in 2s cubic-bezier(0.5, 0, 0.1, 1) 0.7s backwards;opacity: 1;}

/* === ¸ÂÃãÇü±¤°í === */
/*.clickNO a{pointer-events: none;}*/
.slideConWrap{background:#eff3ff;padding: 0 0 15em 4%;}
.adSlideWrap{display: flex;align-items: center;padding: 15em 0 0;}
.adSlideWrap .mTitleBox{width: 38%;margin-top: -5em;}
.adSlideWrap .adSlide{width: calc(100% - 38%);max-width: 1500px;padding-bottom: 4em;}
.adSlideWrap .adSlide .swiper-wrapper{}
.adSlideWrap .adSlide .swiper-slide{width: 400px;background: #fff;border-radius: 40px;overflow: hidden;box-shadow: -1px 1px 12px 0px #41414121;margin-top: 10px;margin-bottom: 10px;}
.adSlideWrap .adSlide .swiper-slide a{}
.adSlideWrap .adSlide .swiper-slide a:hover{}
.adSlideWrap .adSlide .swiper-slide a .imgBox{height: 271px;position: relative;display: block;overflow: hidden;}
.adSlideWrap .adSlide .swiper-slide a .imgBox img{position: absolute;: 0;left: 0;width: 100%;transition: all 0.5s ease;-webkit-transition: all 0.5s ease;}
.adSlideWrap .adSlide .swiper-slide a:hover .imgBox img{transform: scale(1.1);}
.adSlideWrap .adSlide .swiper-slide a .txtBox{display: flex;justify-content: space-between;padding: 2.5em 2em;align-items: center;}
.adSlideWrap .adSlide .swiper-slide a .txtBox .title{}
.adSlideWrap .adSlide .swiper-slide a .txtBox .title h3{font-size:26px;color:#2f2f2f;}
.adSlideWrap .adSlide .swiper-slide a .txtBox .title h4{font-size:18px;color:#858585;font-weight: 400;}
.adSlideWrap .adSlide .swiper-slide a .txtBox .title p{font-size: 15.5px;color: #858585;font-weight: 400;letter-spacing: -0.05em;margin-top: 15px;}
.adSlideWrap .adSlide .swiper-slide a .txtBox img{width:60px;height:60px;}
.adSlideWrap .swiper-pagination{top: inherit !important;bottom: 0;height: 2px !important;background: #d9dde9;}
.adSlideWrap .swiper-pagination-progressbar .swiper-pagination-progressbar-fill{background: #4b4d63;}

.slideConWrap .lineBox{position: relative;z-index: 0;height: 100%;width: 100%;/* left: -4%; */}
.slideConWrap .lineBox p{position: absolute;}
.slideConWrap .lineBox .line p{width: 1px;height: 250vh;border-right: 1px solid #dde4f6;top: 0;}
.slideConWrap .lineBox .line .line1{left: 13.2%;}
.slideConWrap .lineBox .line .line2{left: 30.65%;}
.slideConWrap .lineBox .line .line3{left: 48.05%;}
.slideConWrap .lineBox .line .line4{right: 34.45%;}
.slideConWrap .lineBox .line .line5{right: 17.05%;}

/* === ¼­ºñ½º === */
.serviceWrap{width:100vw;position: relative;}
.serviceWrap .pin-spacer{}
.serviceWrap .pin-spacer .pinSection{}
.serviceWrap .mTitleBox{position: absolute;z-index: 11;left: 4%;top: 10em;}
.serviceWrap .mTitleBox h2{font-weight: 500;}
.serviceWrap .mTitleBox p{font-weight: 500;}
.serTabSilde{width: 100vw;height: 100vh;}
.serTabSilde .swiper-wrapper{}
.serTabSilde .swiper-slide{color:#fff;}
/*.serTabSilde .swiper-slide:after{content:'';background: url(../img/main/service_line.png) no-repeat center/cover;width:100vw;height:100vh;position: absolute;z-index: -1;}*/
.serTabSilde .swiper-slide-active{opacity: 1 !important;}
.serTabSilde .serBg1{background: url(../img/main/service1.jpg) no-repeat center/cover;width:100vw;height:100vh;}
.serTabSilde .serBg2{background: url(../img/main/service2.jpg) no-repeat center/cover;width:100vw;height:100vh;}
.serTabSilde .serBg3{background: url(../img/main/service3.jpg) no-repeat center/cover;width:100vw;height:100vh;}
.serTabSilde .swiper-slide .imgBox{display: flex;align-items: center;justify-content: center;position: absolute;right: 16.5%;top: 50%;transform: translateY(-42%);}
.serTabSilde .swiper-slide .imgBox img{}
.serTabSilde .swiper-slide .imgBox .txtBox{position: absolute;text-align: center;top: 7.5em;}
.serTabSilde .swiper-slide .imgBox .txtBox h4{font-size:32px;line-height: 1.2;margin-bottom: 1em;}
.serTabSilde .swiper-slide .imgBox .txtBox p{font-size:18px;}

.serTabSilde .swiper-pagination{text-align: left;top: 30em !important;left: 16.7% !important;}
.serTabSilde .swiper-pagination .custom_bullet{transition: all 0.5s;display;cursor: pointer;background: none;}
.serTabSilde .swiper-pagination .custom_bullet h3{font-size:28px;color:#fff;opacity: 0.4;margin: 1.8em 0;font-weight: 500;position: relative;}
.serTabSilde .swiper-pagination .custom_bullet h3:after{color: #236ae0;font-size: 15px;font-weight: 900;position: absolute;margin-left: 12px;margin-top: -5px;}
.serTabSilde .swiper-pagination .custom_bullet:nth-child(1) h3:after{content: '1';}
.serTabSilde .swiper-pagination .custom_bullet:nth-child(2) h3:after{content: '2';}
.serTabSilde .swiper-pagination .custom_bullet:nth-child(3) h3:after{content: '3';}
.serTabSilde .swiper-pagination .swiper-pagination-bullet-active h3{opacity:1;font-weight: 600;}

/* === ÇÁ·Î¼¼½º === */
.processWrap{position: relative;background: #fff;padding: 10em 4%;}
.processWrap .mTitleBox{text-align: center;}
.processWrap .mTitleBox em{font-size:52px;}
.processWrap ul{display: flex;justify-content: center;margin-top: 7em;}
.processWrap ul li{text-align: center;margin: 0 4em;}
.processWrap .iconBox{background:var(--main-color);width: 148px;height: 160px;border-radius: 20px 0 50px;padding: 30px;display: flex;align-items: flex-end;justify-content: flex-end;}
.processWrap .iconBox span{font-size:18px;color:#d8efff;}
.processWrap .iconBox span i{display: block;width:60px;height:53px;margin-bottom: 7px;}
.processWrap .iconBox .i1{background: url(../img/main/step01.png) no-repeat center;}
.processWrap .iconBox .i2{background: url(../img/main/step02.png) no-repeat center;}
.processWrap .iconBox .i3{background: url(../img/main/step03.png) no-repeat center;}
.processWrap .iconBox .i4{background: url(../img/main/step04.png) no-repeat center;}
.processWrap .iconBox .i5{background: url(../img/main/step05.png) no-repeat center;}
.processWrap .txtBox{margin-top: 2em;}
.processWrap .txtBox h3{font-size:24px;color:#131313;}
.processWrap .txtBox em{font-size:18px;color:#737d88;font-weight: 600;margin-top: 3px;display: block;}
#element-4.slide-in-left{animation: image-sin 1s cubic-bezier(0.5, 0, 0.1, 1) 0s backwards;opacity: 1;animation-delay:0.3s;}
#element-5.slide-in-left{animation: image-sin 1s cubic-bezier(0.5, 0, 0.1, 1) 0s backwards;opacity: 1;animation-delay:0.6s;}
#element-6.slide-in-left{animation: image-sin 1s cubic-bezier(0.5, 0, 0.1, 1) 0s backwards;opacity: 1;animation-delay:0.9s;}
#element-7.slide-in-left{animation: image-sin 1s cubic-bezier(0.5, 0, 0.1, 1) 0s backwards;opacity: 1;animation-delay:1.2s;}
#element-8.slide-in-left{animation: image-sin 1s cubic-bezier(0.5, 0, 0.1, 1) 0s backwards;opacity: 1;animation-delay:1.5s;}

/* === »ó´ã½Åû === */
.contactWrap{background:var(--main-color);margin: 0 4% 10em;position: relative;overflow: hidden;border-radius: 30px;padding: 6em 0 10em;display: flex;justify-content: center;flex-direction: column;align-items: center;}
.contactWrap:after{content:'';background: url(../img/main/contact01.png) no-repeat center;position: absolute;width:712px;height:804px;left: 3em;top: -6em;animation: rotate 20s infinite alternate, moveYtop 15.4s linear 0s infinite alternate, moveRight 10.05s linear 0s infinite alternate;z-index: 0;}
.contactWrap:before{content:'';background: url(../img/main/contact02.png) no-repeat center;position: absolute;width:453px;height:540px;right: 4em;bottom: -16em;}
.contactWrap .mTitleBox{text-align: center;z-index: 1;}
.contactWrap .mTitleBox h2{font-weight: 400;}
.contactWrap .mTitleBox p{}
.contactWrap .btn{margin-top: 2em;position: relative;z-index: 1;}
.contactWrap .btn a{position: relative;display: inline-block;width: 275px;padding: 17px 0;border: none;box-shadow: inset 0 0 0 3px var(--white-color);letter-spacing: 1px;font-weight: 600;font-size:20px;
	background: none;color: var(--white-color);text-transform: uppercase;outline: none;overflow: hidden;transition: .5s ease-in-out;z-index: 0;border-radius: 50px;margin-top: 2em;text-align: center;}
.contactWrap .btn a:after {content: '';position: absolute;background: var(--white-color);opacity: 0;z-index: -1;}
.contactWrap .btn a:hover{color: var(--main-color);}
.contactWrap .btn a:hover:after {height: 330%;opacity: 1;}
.contactWrap .btn a:after {top: 50%;left: 50%;width: 100%;height: 50%;transform: translate(-50%, -50%) rotate(-135deg);transition: opacity .3s ease-in-out, height .3s ease-in-out;}

/*
===============================================
animation
===============================================
*/
@keyframes ob1 {
	0%{transform:translate(0,0);} 100%{transform:translate(0,50px);}
}

@keyframes moveX {
  from { left: -3vw; } to { left: 40vw; }
}
@keyframes moveY {
  from { top: -2%; } to { top: 50vh; }
}

@keyframes moveYtop {
  from {top: -15em;} to {top: 10vh;}
}

@keyframes moveRight {
  from { right: -7%; } to { right: 5vw; }
}
@keyframes moveBotton {
  from { top: 20vh; } to { top: 45vh; }
}

@keyframes rotate{
      from {transform:rotate(0deg)}  to {transform:rotate(360deg)}
}

@keyframes ob2 {
	0% {transform: rotate(-1deg);}
  25% {transform: rotate(1deg);}
  50% {transform: rotate(-2deg);}
  75% {transform: rotate(2deg);}
  100% {transform: rotate(0deg);}
}

@keyframes ob3 {
  0% {transform: rotate(0deg);} 100% {transform: rotate(8deg);}
}

@keyframes btnhover {
    0% {width: 0;opacity: 0;}
    100% {width: 67px;opacity: 1;}
}

@keyframes text-active-animation {
	from {
		opacity:0;filter:Alpha(opacity=0);
		-webkit-transform: translateY(50px); 
		transform: translateY(50px); 
	}
	to {
		opacity:1.0;filter:Alpha(opacity=100);
		-webkit-transform: translateY(0); 
		transform: translateY(0); 
	}
}

@keyframes image-in {
  from {clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);}
  to {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
}

@keyframes image-sin {
  from {clip-path: polygon(0 0, 0 0, 0 100%, 0 100%);}
  to {clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);}
}

@keyframes contactDown {
	0% {
		opacity: 0.6;
		transform:  translateY(-5px) rotate(270deg);
	}
	50% {
		opacity: 1;
		transform: translateY(5px) rotate(270deg);
	}
	100% {
		opacity: 0.6;
		transform:  translateY(-5px) rotate(270deg);
	}
}

/*
===============================================
¹ÝÀÀÇü css
===============================================
*/

@media all and (min-width:1921px){
	.snsTabSilde .swiper-slide .phoneCon {right: 27px;}
}

@media all and (min-width:2100px){
	.visualWrap .visTitel .title h2 {font-size: 30px;}
	.visualWrap .visTitel .title h3 {font-size: 70px;}
	.snsTabSilde .swiper-slide .phoneCon {right: 38px;}
	.snsTabSilde .swiper-slide .phoneCon .conBox img{bottom:30%;}
	.snsTabWrap h2 {font-size: 50px;margin: 1em 0 0 5em;}

	.mTitleBox h2 {font-size: 25px;}
	.mTitleBox p {font-size: 52px;}
	.countWrap .conBox ul li h3 {font-size: 28px;}
	.countWrap .conBox .figure {font-size: 50px;}

	.successWrap .conBox li h3 span{width: 110px;}
	.successWrap .conBox li h3 {font-size: 28px;}
	.successWrap .conBox li p {font-size: 20px;}

	.serTabSilde .swiper-slide .imgBox img {width: 820px;}
	.serTabSilde .swiper-slide .imgBox .txtBox h4 {font-size: 36px;}
	.serTabSilde .swiper-pagination .custom_bullet h3 {font-size: 36px;}
	.serTabSilde .swiper-pagination {top: 35em !important;}
	.serTabSilde .swiper-slide .imgBox .txtBox {top: 9.5em;}
	.serTabSilde .swiper-slide .imgBox .txtBox p {font-size: 22px;}

	.processWrap .mTitleBox em {font-size: 65px;}
	.processWrap .txtBox h3 {font-size: 26px;}
	.processWrap .txtBox em {font-size: 20px;margin-top: 15px;}

	.contactWrap {padding: 12em 0 14em;}
	.contactWrap .btn {margin-top: 1em;}
}



@media all and (max-width:1820px){
	.snsTabSilde .swiper-pagination {grid-template-columns: 1fr;width: 19.5% !important;top: 2em !important;}
	.snsTabSilde .swiper-pagination .custom_bullet {margin: 1em 0;}
	.snsTabSilde .swiper-wrapper {width: 68%;}
}

@media all and (max-width:1720px){
	.successWrap .conBox li img {height: 200px;}
	.successWrap .conBox li p br{display:none;}
}

@media all and (max-width:1600px){
	.visualWrap .visLink a.contact {right: 2%;}
	.visualWrap .visLink a.instar{left: 3%;}

	.snsTabSilde .swiper-wrapper {width: 73%;}
	.snsTabSilde .swiper-slide .imgBox{width:600px; padding: 7.5em 0;}
	.snsTabSilde .swiper-slide .imgBox img {width: 100%;}
	.snsTabSilde .swiper-slide .imgBox img.i3{width: 260px;}
	.snsTabSilde .swiper-pagination {width: 21.5% !important;}
	.snsTabSilde .swiper-pagination .custom_bullet span {font-size: 19px;margin-left: 30px;}  

	.countWrap .conBox ul li {width: calc(50% - 7em);padding: 2em 2em;}

	.adSlideWrap {align-items: flex-start;flex-direction: column;}
	.adSlideWrap .adSlide {width: 100%;margin-top: 4em;}
	.adSlideWrap .mTitleBox {width: 100%;}

	.serTabSilde .swiper-pagination {left: 7% !important;}
	.serTabSilde .swiper-slide .imgBox {right: 8.5%;}

	.processWrap {padding: 10em 4% 6em;}
	.processWrap ul{flex-wrap: wrap;}
	.processWrap ul li {margin: 0 4em 4em;}
	#element-4.slide-in-left,
	#element-5.slide-in-left,
	#element-6.slide-in-left,
	#element-7.slide-in-left,
	#element-8.slide-in-left{animation: image-sin 0.5s cubic-bezier(0.5, 0, 0.1, 1) 0s backwards;opacity: 1;}
}

@media all and (max-width:1340px){
	.snsTabSilde {height: 790px;}
	.snsTabSilde .swiper-pagination {width: 100% !important;display: flex;flex-direction: row;justify-content: center;top: inherit !important;bottom: 0 !important;}
	.snsTabSilde .swiper-pagination .custom_bullet{flex-direction: column;}
	.snsTabSilde .swiper-pagination .custom_bullet span {margin-left: 0;margin-top: 20px;}
	.snsTabSilde .swiper-wrapper {width: 97%;}
	.snsTabSilde .swiper-slide .imgBox {width: auto;}
	.snsTabWrap h2 {margin: 0 0 0 5em;}
	.snsTabWrap {padding: 10em 4% 14em;}
	.snsTabSilde .swiper-slide .phoneCon .conBox img {box-shadow: 1px 1px 14px 7px #00000012;}

	.successWrap .conBox li {padding: 3em 2em 2em;}
	.successWrap .conBox {grid-column-gap: 20px;margin: 15em 0 10em;}

	.serTabSilde {height: 1200px;}
	.serTabSilde .swiper-slide{height: 100% !important;}
	.serTabSilde .swiper-slide .imgBox{transform: translateY(-25%);}
	.serTabSilde .swiper-pagination {left: 4% !important;}
}

@media all and (max-width:1280px){
	.visualWrap .visObject p img{width:100%;height:100%;}
	.visualWrap .visObject .ob1 {width: 400px;height: auto;top: -20vh;}
	.visualWrap .visObject .ob2 {width: 250px;}
	.visualWrap .visObject .ob3 {top: 74vh;width: 500px;}
	.visualWrap .visObject .ob4 {width: 280px;}
	.visualWrap .visObject .ob5 {width: 470px;}
	.visualWrap .visObject .ob6 {width: 310px;}

	.countWrap {padding: 4em 4% 16em;flex-direction: column;}
	.countWrap .conBox {width: 100%;margin-top: 5em;position: relative;z-index: 1;}
	.countWrap .conBox ul li span {margin: 3em 0 0;}
	.countWrap .conBox ul li span img {height: 60px;}

	.successWrap .conBox li img {position: inherit;width: 253px;height: 249px;margin: 1.5em auto -2em;display: block;}
	.successWrap .conBox li p {margin-top: 0;}
	.successWrap .conBox li {padding: 3em 2em 1em;}

	.slideConWrap .lineBox .line .line1 {left: 25%;}
	.slideConWrap .lineBox .line .line2 {left: 50%;}
	.slideConWrap .lineBox .line .line4 {right: 25%;}
	.slideConWrap .lineBox .line .line3,
	.slideConWrap .lineBox .line .line5{display:none;}
}

@media all and (max-width:1100px){
	.visualWrap .visTitel {width: 85vw;}
	.visualWrap .visTitel .title h2 {font-size: 18px;}
	.visualWrap .visTitel .title h3 {font-size: 40px;}
	.snsTabSilde .swiper-slide .imgBox {width: 500px;}
	.snsTabSilde .swiper-slide .imgBox img.i3 {width: 230px;}
	.snsTabSilde .swiper-slide .phoneCon:after {box-shadow: 2px 3px 20px 4px #00000029;}

	.successWrap {padding-top: 0;}
	.successWrap .conBox {display: flex;flex-direction: column;margin: 4em 0 10em;}
	.successWrap .conBox li {position: inherit;margin: 1em 0;padding: 3em 2em 2em;}
	.successWrap .conBox li a {display: flex;align-items: center;}
	.successWrap .conBox li img {margin: 0 2em;}

	.adSlideWrap .adSlide .swiper-slide {width: 340px;border-radius: 20px;}
	.adSlideWrap .adSlide .swiper-slide a .imgBox {width: 100%;height: 230px;}
	.adSlideWrap .adSlide .swiper-slide a .imgBox img{object-fit: cover;}
	.adSlideWrap .adSlide .swiper-slide a .txtBox {padding: 2em 2em;}
	.adSlideWrap .adSlide .swiper-slide a .txtBox img {position: absolute;right: 2em;bottom: 6.5em;}

	.serTabSilde .swiper-slide .imgBox {left: 50%;transform: translate(-50%, -50%);margin-top: 7em;width: 100%;}
	.serTabSilde .swiper-pagination {left: 4% !important;top: 67em !important;display: flex;justify-content: space-between;width: calc(100% - 9%) !important;}
	.serTabSilde .swiper-pagination .custom_bullet h3 {font-size: 20px;}
}

@media all and (max-width:980px){	
	.snsTabWrap h2 {margin: 0;}
	.snsTabSilde .swiper-slide .imgBox {padding: 9.5em 0;}
	.snsTabSilde .swiper-pagination .custom_bullet img {width: 55px;height: 55px;}
	.snsTabSilde .swiper-pagination .custom_bullet span {font-size: 17px;}
	.snsTabSilde .swiper-pagination .custom_bullet {margin: 1em 0.5em;}

	.successWrap .conBox li h3 i{display:block;}
}

@media all and (max-width:920px){	
	.snsTabSilde .swiper-pagination {flex-wrap: wrap;}
	.snsTabSilde .swiper-pagination .custom_bullet {width: 29%;}
	.snsTabSilde {height: 915px;}
	.snsTabWrap {padding: 10em 4% 8em;}
	.snsTabSilde .swiper-slide .phoneCon {z-index: 10;}
	.snsTabSilde .swiper-slide .imgBox {width: auto;}

	.slideConWrap .lineBox .line .line1 {left: 10%;}
	.slideConWrap .lineBox .line .line4 {right: 10%;}
}

@media all and (max-width:800px){	
	.visualWrap .visObject .ob1 {width: 310px;top: -15vh;}
	.visualWrap .visObject .ob2 {width: 180px;}
	.visualWrap .visObject .ob3 {top: 80vh;width: 375px;right: -5%;}
	.visualWrap .visObject .ob4 {width: 260px;}
	.visualWrap .visObject .ob5 {width: 360px;}
	.visualWrap .visObject .ob6 {width: 280px;top: 83vh;}

	.successWrap .conBox li img {width: 200px;height: 197px;}
	.successWrap .conBox li h3 {font-size: 20px;}
	.successWrap .conBox li h3 span {width: 85px; background-size: 100%;}
	.successWrap .conBox li h3 {font-size: 18px;}

	.processWrap {padding: 8em 4% 4em;}
	.mTitleBox p {font-size: 32px;}
	.contactWrap:after {width: 500px;background-size: 100%;}
	.contactWrap:before {width: 280px;background-size: 100%;right: 1em;}
}

@media all and (max-width:768px){
	.snsTabSilde .swiper-pagination .custom_bullet {width: auto;}
	.snsTabSilde {padding-top: 11em !important;}

	.countWrap {padding: 0 4% 16em;}
	.countWrap .conBox ul li h3 {font-size: 17px;}
	.countWrap .conBox .figure {font-size: 30px;}

	.serTabSilde .swiper-slide .imgBox img {width: calc(100% - 8%);}
	.serTabSilde .swiper-pagination{display: block;bottom: 0 !important;top: 51em !important;}
	.serTabSilde .swiper-pagination .custom_bullet h3 {font-size: 20px;margin: 0.5em 0;}
	.serviceWrap .mTitleBox p{font-size: 32px;}
	.serviceWrap .mTitleBox h2 {font-size: 18px;margin-bottom: 1em;}

	.slideConWrap {padding: 0 0 10em 4%;}
	
		
	.serTabSilde {height: 1050px;}
	.serviceWrap .mTitleBox {top: 7em;}
	.serTabSilde .swiper-pagination {top: 18em !important;}
	.serTabSilde .swiper-slide .imgBox {margin-top: 13em;}
}

@media all and (max-width:690px){
	.serTabSilde .swiper-slide .imgBox .txtBox h4 {font-size: 24px;}
	.serTabSilde .swiper-slide .imgBox .txtBox p {font-size: 16px;}
	.serTabSilde .swiper-slide .imgBox .txtBox{top:100px;}
}

@media all and (max-width:640px){
	.visualWrap{height: 70vh !important;top: 0 !important;}
	.visualWrap .visTitel {height: 42vh;top: 53%;}
	.visualWrap .visLink a.contact {right: 2%;transform: none !important;animation: none;font-size: 15px;bottom: 3px;}
	.visualWrap .visTitel .title h2 strong{display:block;}
	.visualWrap .visTitel .title h3 {font-size: 26px;}
	.visualWrap .visTitel .title a {width: 220px;font-size: 18px;box-shadow: inset 0 0 0 1px var(--white-color);}
	.visualWrap .visLink {top: 25vh;}
	.visualWrap .visLink a.instar{width: 27px;}

	.visualWrap .visObject .ob1 {width: 230px;top: -18vh;right: -5em;}
	.visualWrap .visObject .ob2 {width: 100px;}
	.visualWrap .visObject .ob3 {top: 54vh;width: 250px;right: -14%;}
	.visualWrap .visObject .ob4 {width: 160px;}
	.visualWrap .visObject .ob5 {width: 220px;left: -19vw;}
	.visualWrap .visObject .ob6 {width: 150px;top: 55vh;left: -12vw;}

	.countWrap .conBox ul li {width: calc(50% - 4em);padding: 2em 1.5em;margin: 0.5em;}

	.successWrap .conBox li h3{font-size:24px;}
	.successWrap .conBox li a {align-items: flex-start;flex-direction: column;}
	.successWrap .conBox li img {position: absolute;right: 0;top: 2em;}
	.successWrap .conBox li p {margin-top: 6em;}
	.successWrap .conBox {margin: 4em 0 6em;}

	.serTabSilde .swiper-slide .imgBox .txtBox h4 {font-size: 20px;}
	.serTabSilde .swiper-slide .imgBox .txtBox p {font-size: 15px;}

	.contactWrap .mTitleBox p {margin: 0 4%;}
}

@media all and (max-width:550px){	
	.snsTabWrap h2 {font-size: 32px;}
	.snsTabSilde {height: 815px;}
	.snsTabSilde .swiper-wrapper {width: 100%;}
	.snsTabSilde .swiper-slide .phoneCon:after {width: 260px;height: 510px;background-size: 100%;box-shadow: -7px 3px 20px 0px #00000029;}
	.snsTabSilde .swiper-slide .phoneCon {width: 220px;}
	.snsTabSilde .swiper-slide .phoneCon .conBox h3 {font-size: 18px;}
	.snsTabSilde .swiper-slide .phoneCon .conBox p {font-size: 16px;margin: 0;}
	.snsTabSilde .swiper-slide .phoneCon .conBox .btn a {padding: 4px 0;font-size: 16px;}
	.snsTabSilde .swiper-slide .phoneCon .conBox {height: 420px;}
	.snsTabSilde .swiper-slide .phoneCon .conBox img {width: 65px;height: 65px;bottom: 35%;border-radius: 15px;}

	.mTitleBox p {font-size: 32px;margin-right: 4%;}
	.mTitleBox p br{display:none;}
	.mTitleBox p i{display:block;}
	.mTitleBox h2 {font-size: 18px;margin-bottom: 1em;}
	.countWrap .conBox ul li span img {height: 47px;}

	.serviceWrap .mTitleBox p{font-size: 28px;}
	.serTabSilde .swiper-slide .imgBox .txtBox {top: 80px;}
	.serTabSilde {height: 970px;}

	.successWrap .conBox li h3{font-size:22px;}
	.successWrap .conBox li h3 span {width: 70px;}

	.processWrap .mTitleBox em {font-size: 32px;}
	.processWrap .mTitleBox p br{display:block;}

	.contactWrap:before{display:none;}
	.contactWrap{height:250px;padding: 7em 0 10em;display: block;margin: 0 4% 8em;}
	.contactWrap .btn {width: 275px;margin: 0 auto;}
}

@media all and (max-width:500px){
	.serTabSilde {height: 855px;}
	.serTabSilde .swiper-slide .imgBox .txtBox {margin: 0 10%;top: 50px;}
	.serTabSilde .swiper-slide .imgBox .txtBox p br{display:none;}
}

@media all and (max-width:460px){
	.snsTabSilde .swiper-pagination {flex-direction: column;align-items: flex-start;}
	.snsTabSilde .swiper-pagination .custom_bullet span,
	.snsTabSilde .swiper-slide .imgBox{display: none;}
	.snsTabSilde .swiper-pagination {width: 17% !important;top: 8.5em !important;left: 0 !important;}
	.snsTabSilde {height: 530px;}
	.snsTabWrap {padding: 6em 4% 4em;}
	.snsTabWrap .shapeBg {top: 7.5em;}

	.countWrap {padding: 0 4% 15em;}
	.countWrap .conBox ul li h3 i{display:block;}
	.countWrap .conBox ul li{border-radius: 0 0 40px 0;}
	.countWrap .conBox ul li {width: calc(50% - 4em);padding: 2em 1.5em;}
	.countWrap .conBox ul li span {margin: 0;}
	.countWrap .conBox .figure {font-size: 27px;}
	.countWrap .conBox .figure i {display: block;margin-left: 0;font-size: 18px;}

	.serTabSilde .swiper-slide .imgBox .txtBox {top: 40px;}
}