.kakao-wrap {overflow: hidden;}
.visual {width: 100%; height: 323vw;background: url("https://russeldata.megastudy.net/campus/images/russel/m_russel/russel_bd/event/2023/kakao/visual_bg.jpg") no-repeat 0 0;background-size: cover;}
.visual .inner {position: relative;width: 86vw; height: inherit;margin: 0 auto;}
.visual .inner .img {position: absolute;}
.visual .inner .v-tit.tit01 {width: calc(440vw / 7.2); top: 15vw;left: 5vw;overflow: hidden;}
.visual .inner .v-tit.tit01 img {animation:fadeup .8s .3s both;}
.visual .inner .v-tit.tit02 {width: calc(383vw / 7.2); top: 33vw;left: 5vw;overflow: hidden;}
.visual .inner .v-tit.tit02 img {animation:fadeleft .8s 1.1s both;}
.visual .inner .v-tit.tit03 {width: calc(383vw / 7.2); top: 48vw;left: 5vw;overflow: hidden;}
.visual .inner .v-tit.tit03 img {animation:fadeleft .8s 1.1s both;}
.visual .inner .v-tit.tit04 {width: calc(165vw / 7.2); top: 72vw;left: 55.9vw;animation:jello-horizontal .8s 1.7s both;}
.visual .inner .v-tit.tit05 {width: calc(372vw / 7.2); top: 83vw;left: 5vw;}
.visual .inner .v-tit.tit05 img {animation:fadeleft .8s 1.1s both;}
.visual .inner .v-box.box01 {width: calc(528vw / 7.2); top: 108vw;left: 0;opacity: 0;}
.visual .inner .v-box.box01.on {animation:fadedown .8s 0s both;opacity: 1;}
.visual .inner .v-box.box02 {width: calc(587vw / 7.2); top: 144vw;right: 0;}
.visual .inner .v-box.box03 {width: calc(587vw / 7.2); top: 221vw;right: 0;position: relative;}

.visual .inner .v-box.box03 a {position: absolute;top: 24vw;left: 12vw;width: 57vw;height: 15vw;}




.visual .inner .v-box.box03 .obj01 {width: calc(408vw / 7.2);position: absolute;top: 24vw;left: 12vw;}
/* .kakao-wrap.russel_dg .visual .inner .v-box.box03 .obj01 {animation:jello-horizontal02 1s ease-in-out infinite;} */
.visual .inner .v-box.box03 .obj02 {width: calc(128vw / 7.2);position: absolute;top: 33vw;right: 0;}

/*´ë±¸ÇÐ¿ø¸¸ Àû¿ë*/
.kakao-wrap.russel_dg .visual {height: 263vw;}
.kakao-wrap.russel_dg .visual .inner .v-box.box01 {width: calc(588vw / 7.2); top: 108vw;left: 0;opacity: 0;}
.kakao-wrap.russel_dg .visual .inner .v-tit.tit05 {width: calc(458vw / 7.2); top: 83vw;left: 5vw;}
.kakao-wrap.russel_dg .visual .inner .v-box.box03 {width: calc(587vw / 7.2); top: 160vw;left: 4vw;}
.kakao-wrap.russel_dg .visual .inner .v-box.box03 .obj01 {animation: shake-vertical 8s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;}

/*´ëÀüÇÐ¿ø¸¸ Àû¿ë*/
.kakao-wrap.core_dj .visual {height: 263vw;}
.kakao-wrap.core_dj .visual .inner .v-box.box01 {width: calc(588vw / 7.2); top: 108vw;left: 0;opacity: 0;}
.kakao-wrap.core_dj .visual .inner .v-tit.tit05 {width: calc(458vw / 7.2); top: 83vw;left: 5vw;}
.kakao-wrap.core_dj .visual .inner .v-box.box03 {width: calc(587vw / 7.2); top: 160vw;left: 4vw;}
.kakao-wrap.core_dj .visual .inner .v-box.box03 .obj01 {animation: shake-vertical 8s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;}

/*ÀüÁÖÇÐ¿ø¸¸ Àû¿ë*/
.kakao-wrap.core_jj .visual {height: 263vw;}
.kakao-wrap.core_jj .visual .inner .v-box.box01 {width: calc(588vw / 7.2); top: 108vw;left: 0;opacity: 0;}
.kakao-wrap.core_jj .visual .inner .v-tit.tit05 {width: calc(458vw / 7.2); top: 83vw;left: 5vw;}
.kakao-wrap.core_jj .visual .inner .v-box.box03 {width: calc(587vw / 7.2); top: 160vw;left: 4vw;}
.kakao-wrap.core_jj .visual .inner .v-box.box03 .obj01 {animation: shake-vertical 8s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;}

/* ÆòÃÌ */
.kakao-wrap.russel_pc .visual {height: 263vw;}
.kakao-wrap.russel_pc .visual .inner .v-box.box03 {width: calc(587vw / 7.2); top: 155vw;left: 4vw;}
.kakao-wrap.russel_pc .visual .inner .v-box.box03 .obj01 {animation: shake-vertical 8s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;}

/* ºÎÃµ */
.kakao-wrap.russel_bc .visual {height: 263vw;}
.kakao-wrap.russel_bc .visual .inner .v-box.box03 {width: calc(587vw / 7.2); top: 155vw;left: 4vw;}
.kakao-wrap.russel_bc .visual .inner .v-box.box03 .obj01 {animation: shake-vertical 8s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;}

/* °­³² */
.kakao-wrap.russel_gn .visual {height: 263vw;}
.kakao-wrap.russel_gn .visual .inner .v-box.box03 {width: calc(587vw / 7.2); top: 155vw;left: 4vw;}
.kakao-wrap.russel_gn .visual .inner .v-box.box03 .obj01 {animation: shake-vertical 8s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;}

/* ¸ñµ¿ */
.kakao-wrap.russel_md .visual {height: 263vw;}
.kakao-wrap.russel_md .visual .inner .v-tit.tit05 {width: calc(458vw / 7.2); top: 83vw;left: 5vw;}
.kakao-wrap.russel_md .visual .inner .v-box.box03 {width: calc(587vw / 7.2); top: 155vw;left: 4vw;}
.kakao-wrap.russel_md .visual .inner .v-box.box03 .obj01 {animation: shake-vertical 8s cubic-bezier(0.455, 0.030, 0.515, 0.955) infinite both;}

.cont.cont01 {background: #f7f5e9;}
.cont.cont01 .inner {padding: 0 8% 60px;}
.cont.cont01 .inner .img:not(:last-child) {margin-bottom: 20px;}

@keyframes fadeup{0%{opacity: 0;transform: translateY(-100px);}100%{opacity: 1;transform: translateY(0px);}}
@keyframes fadedown{0%{opacity: 0;transform: translateY(100px);}100%{opacity: 1;transform: translateY(0px);}}
@keyframes fadeleft{0%{opacity: 0;transform: translateX(-100px);}100%{opacity: 1;transform: translateX(0px);}}
@keyframes jello-horizontal{0%{opacity: 0; -webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}30%{-webkit-transform:scale3d(1.25,.75,1);transform:scale3d(1.25,.75,1)}40%{-webkit-transform:scale3d(.75,1.25,1);transform:scale3d(.75,1.25,1)}50%{-webkit-transform:scale3d(1.15,.85,1);transform:scale3d(1.15,.85,1)}65%{-webkit-transform:scale3d(.95,1.05,1);transform:scale3d(.95,1.05,1)}75%{-webkit-transform:scale3d(1.05,.95,1);transform:scale3d(1.05,.95,1)}100%{opacity: 1; -webkit-transform:scale3d(1,1,1);transform:scale3d(1,1,1)}}


@keyframes jello-horizontal02 {
	0% { transform: scale3d(1, 1, 1); }
	30% { transform: scale3d(1.05, 0.95, 1); }
	40% { transform: scale3d(0.95, 1.05, 1); }
	50% { transform: scale3d(1.02, 0.98, 1); }
	65% { transform: scale3d(0.99, 1.01, 1); }
	75% { transform: scale3d(1.01, 0.99, 1); }
	100% { transform: scale3d(1, 1, 1); }
  }


  @keyframes shake-vertical {
	0%, 100% {
		-webkit-transform: translateY(0);
		transform: translateY(0);
	}
  
	10%, 30%, 50%, 70% {
		-webkit-transform: translateY(-3px);
		transform: translateY(-3px);
	}
  
	20%, 40%, 60% {
		-webkit-transform: translateY(3px);
		transform: translateY(3px);
	}
  
	80% {
		-webkit-transform: translateY(2.4px);
		transform: translateY(2.4px);
	}
  
	90% {
		-webkit-transform: translateY(-2.4px);
		transform: translateY(-2.4px);
	}
  }
  













