@charset "UTF-8";

.family_250627 * { font-family: Pretendard, sans-serif; text-decoration: none; color: #111; box-sizing: border-box; letter-spacing: -0.5px; transition: all 0.3s ease-in-out; }
.family_250627 { min-width: 1400px; }
.family_250627 .inner { position: relative; width: 1200px; padding: 120px 0; margin: 0 auto; text-align: center; }
.family_250627 h2 { padding-bottom: 60px; }
.family_250627 h3 { padding-bottom: 40px; }
.family_250627 .noti_gray { font-size: 16px; color: #666; margin-top: 15px; text-align: right; display: block; position: relative; }
.family_250627 .noti_gray::before { content: "※ "; }
.family_250627 .bg_lightPink { background: #feebed; }
.family_250627 .bg_pink { background: #ffbbc2; }
.family_250627 .bg_dark { background: #333; }
.family_250627 .bg_white { background: #fff; }
.family_250627 .btn_dark { background: #414141; color: #fff; padding: 8px 30px; border-radius: 20px; font-size: 18px; display: inline-block; }
.family_250627 .btn_dark:hover { background: #111; }
.family_250627 .btn_500 { width: 500px; height: 88px; border-radius: 10px; display: inline-block; display: flex; justify-content: center; align-items: center; background: #222; }
.family_250627 .btn_500 p { font-size: 24px; font-weight: 600; position: relative; display: inline-block; text-align: center; margin-left: 10px; color: #fff; }
.family_250627 .btn_500 p span { color: #ffe03b; }
.family_250627 .btn_500 p::after { content: ""; background: url(https://cdn.ibstudy.co.kr/Content_new/event/2025/family_0627/imgs/btn_arrow01.png) no-repeat center center; margin-left: 14px; width: 11px; height: 18px; display: inline-block; }
.family_250627 .btn_500:hover { background: #000; }
.family_250627 .btnWrap { display: flex; gap: 20px; justify-content: center; margin-top: 50px; }
.family_250627 .quickBn { position: fixed; top: 40%; right: 20px; z-index: 10; text-align: center; }
.family_250627 .quickBn li:nth-of-type(1) { margin-bottom: 10px; }
.family_250627 .mainTop { background: url(https://cdn.ibstudy.co.kr/Content_new/event/2025/family_0627/imgs/mainTop_bg.jpg) no-repeat center top/cover; animation: bgScale 2.3s ease-out both; height: 980px; position: relative; }
.family_250627 .mainTop .inner { padding: 0; }
.family_250627 .mainTop .inner .mainTop_title { position: relative; top: 126px; z-index: 1; }
.family_250627 .mainTop .inner .mainTop_title li { position: relative; }
.family_250627 .mainTop .inner .mainTop_title li:nth-of-type(1) { margin-bottom: 60px; }
.family_250627 .mainTop .inner .mainTop_title li:nth-of-type(2) { margin-bottom: 30px; animation: fadeIn_up 0.5s 0.5s linear both; }
.family_250627 .mainTop .inner .mainTop_title li:nth-of-type(3) { margin-bottom: 60px; animation: scale_02 0.3s 0.8s ease-out both; }
.family_250627 .mainTop .inner .mainTop_title li:nth-of-type(4) { margin-bottom: 50px; }
.family_250627 .stn02 { background: #edf3f4 url(https://cdn.ibstudy.co.kr/Content_new/event/2025/family_0627/imgs/stn02_bg.jpg) no-repeat center left; }
.family_250627 .stn02 .inner { padding: 60px 0; }
.family_250627 .stn04 ul li { background: #fff; }
.family_250627 .stn04 ul li:has(.btn_500) { padding-bottom: 60px; }
.family_250627 .stn04 ul li:has(.btn_500) .btn_500 { margin: 0 auto !important; }
.family_250627 .stn04 ul li:not(:last-of-type) { margin-bottom: 60px; }
.family_250627 .stn05 ul { position: relative; display: flex; justify-content: space-between; margin-bottom: 60px; }
.family_250627 .stn05 ul li { position: relative; }
.family_250627 .stn05 ul li span { position: absolute; bottom: 38px; left: 50%; transform: translateX(-50%); animation: flash 1s infinite both; }
.family_250627 .stn06 .noti_gray { color: #999; }
.family_250627 .stn06 .noti_gray span { color: #cfcfcf; }
.family_250627 .bottom { background: url(https://cdn.ibstudy.co.kr/Content_new/event/2025/family_0627/imgs/bottom_bg.jpg) no-repeat center/cover; }
.family_250627 .bottom .inner { padding: 90px 0; }
@keyframes fadeIn_up {
  0% { opacity: 0; transform: translateY(30%); }
  100% { opacity: 1; transform: translateY(0); }
}
@keyframes scale {
  0% { opacity: 0; transform: scale(0); }
  80% { opacity: 1; transform: scale(1.1); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes scale_02 {
  0% { opacity: 0; transform: scale(1.5); }
  100% { opacity: 1; transform: scale(1); }
}
@keyframes line {
  0% { width: 0; }
  100% { width: 1100px; }
}
@keyframes flash {
  0% { opacity: 0.3; }
  50% { opacity: 1; }
  100% { opacity: 0.3; }
}
@keyframes bgScale {
  0% { background-size: 120% 120%; }
  100% { background-size: 100% 100%; }
}