/* 메인 */
.main { display: flex; gap: 15px; }
.main-item { width: 595px; display: flex; flex-direction: column; gap: 15px; }
.section { overflow: hidden; }

.event-banner { width: 100%; height: 225px; margin-top: -20px; }
.event-banner .main-event { width: 100%; height: 100%; }
.event-banner .main-event .swiper-slide { width: 100%; height: 225px; border-radius: 10px; overflow: hidden; }
.event-banner .main-event .swiper-pagination { width: fit-content; padding: 5px 8px; background-color: rgba(255,255,255,0.6); border-radius: 50px; font-size: 12px; color: var(--black03); font-weight: 600; left: auto; top: auto; right: 15px; bottom: 15px; }
.event-banner .main-event .swiper-pagination-current { color: var(--base); }

.small-banner { display: flex; gap: 15px; }
.small-banner a { display: flex; flex-direction: column; justify-content: center; gap: 10px; flex: 1; height: 100px; border-radius: 10px; background-repeat: no-repeat; padding: 15px; }
.small-banner p { font-size: 13px; color: rgba(255,255,255,0.6); }
.small-banner span { font-size: 16px; color: var(--w); font-weight: 600; }
.small-banner a:nth-child(1) { background-color: #0a306b; background-image: url('https://yeorcqadlpopsmgaoudu.supabase.co/storage/v1/object/public/certification/mark/5bc937e4-f97a-49ac-aab6-b1123019441e/c9fd0bd3-6b04-4a13-9523-aaca031ed39e-2024-08-20T00:15:19.291Z'); background-size: 100px; background-position: 175px 15px; }
.small-banner a:nth-child(2) { background-color: #0041a7; background-image: url('../images/main/small_banner.png'); background-size: 100px; background-position: 175px 0px; }

.quick-menu { display: flex; justify-content: center; gap: 15px; }
.quick-menu a { flex: 1; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.quick-menu a p { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; }
.quick-menu a p img { width: 40px; }
.quick-menu a span { font-size: 14px; font-weight: 600; }
.quick-menu a:hover p { animation: swing ease-in-out 0.5s 1 alternate; }
@keyframes swing { 0%, 30%, 50%, 70%, 100% { transform: rotate(0deg); } 10% { transform: rotate(15deg); } 40% { transform: rotate(-15deg); } 60% { transform: rotate(5deg); } 80% { transform: rotate(-5deg); } }

.main-notice { width: 100%; padding: 10px; border-radius: 10px; border: 1px solid var(--border); }
.main-notice ul { display: flex; flex-direction: column; gap: 8px; }
.main-notice ul li a { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.main-notice ul li a i { display: flex; align-items: center; gap: 8px; }
.main-notice ul li a i span { width: 450px; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; font-size: 13px; font-weight: 500; }
.main-notice ul li a p { font-size: 13px; }
.main-notice ul li:hover span { opacity: 0.4; }
.main-notice ul li:hover p { opacity: 0.4; }

.main-msg-box .transmit-area { width: 290px; }
.main-msg-box .msg-area { height: 100%; }
.main-msg-box .reply-box { padding: 0; border: none; }
.main-msg-box .reply-box a { display: none; }
.main-msg-box .send-area { gap: 8px; }
.main-msg-box .send-btn-box a { background-color: var(--base3); }

.banner { width: 895px; display: flex; flex-direction: column; gap: 20px; padding-top: 20px; border-top: 1px dashed var(--border); margin-top: -5px; }
.banner ul { display: flex; gap: 20px; }
.banner ul li { flex: 1; }
.banner ul li a { display: flex; align-items: center; gap: 10px; }
.banner ul li a p { min-width: 90px; width: 90px; height: 90px; overflow: hidden; border-radius: 10px; position: relative; }
.banner ul li a p img { height: 100%; transition: 0.2s; position: absolute; left: 50%; transform: translateX(-50%); }
.banner ul li a:hover img { transform: translateX(-50%) scale(1.1); }
.banner .banner-text { max-width: 185px; display: flex; flex-direction: column; gap: 5px; overflow: hidden; }
.banner .banner-text h4 { width: 100%; font-size: 15px; font-weight: 600; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; line-height: 1.6; }
.banner .banner-text span { width: 100%; font-size: 12px; line-height: 1.6; color: var(--gray); overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; }
.banner .banner-text i { display: flex; gap: 5px; }
.banner .banner-text i b { font-size: 12px; color: var(--base); }

.post-swiper-wrap { width: 895px; padding-bottom: 50px; overflow: hidden; margin-bottom: -20px; }
.post-swiper { position: relative; }
.post-swiper ul { gap: 0; }
.post-swiper .swiper-pagination { display: flex; justify-content: center; bottom: -40px !important; }
.post-swiper .swiper-pagination-bullet { width: 24px; height: 24px; display: flex; align-items: center; justify-content: center; font-size: 12px; border-radius: 100%; color: var(--gray); background-color: var(--w3); opacity: 1; }
.post-swiper .swiper-pagination-bullet-active { background-color: var(--base) !important; color: var(--w); }