2026 가을학기 AP 시간표 body { font-family: 'Noto Sans KR', sans-serif; background-color: #f4f6f9; margin: 0; padding: 40px 20px; /* 패딩 값 정상 수정 */ display: flex; flex-direction: column; align-items: center; } .header-area { text-align: center; margin-bottom: 30px; } h1 { color: #111; font-size: 32px; margin: 0 0 10px 0; } .date-sub { color: #666; font-size: 14px; } .search-container { background: white; padding: 20px 30px; border-radius: 8px; box-shadow: 0 4px 10px rgba(0,0,0,0.08); margin-bottom: 30px; display: flex; gap: 20px; flex-wrap: wrap; width: 100%; max-width: 900px; box-sizing: border-box; justify-content: space-between; } .search-group { display: flex; flex-direction: column; gap: 8px; flex: 1; min-width: 200px; } label { font-size: 14px; font-weight: bold; color: #444; } select { padding: 10px 12px; border: 1px solid #ccc; border-radius: 6px; font-size: 14px; background-color: #fff; width: 100%; box-sizing: border-box; cursor: pointer; } .grid-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px; width: 100%; max-width: 900px; } .card { background: white; border-radius: 8px; padding: 20px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); border-top: 5px solid #ccc; box-sizing: border-box; } .card.토요일 { border-top-color: #00b894; } .card.일요일 { border-top-color: #ff7675; } .badge { display: inline-block; padding: 4px 8px; border-radius: 4px; font-size: 11px; font-weight: bold; color: white; margin-bottom: 12px; } .badge.sat { background-color: #00b894; } .badge.sun { background-color: #ff7675; } .subject { font-size: 18px; font-weight: bold; color: #2d3436; margin-bottom: 6px; } .teacher { font-size: 14px; color: #636e72; margin-bottom: 12px; } .time { font-size: 13px; color: #2d3436; background: #f1f2f6; padding: 6px; border-radius: 4px; text-align: center; font-weight: 500; } .no-result { grid-column: 1 / -1; text-align: center; color: #999; padding: 40px; font-size: 16px; } 2026 가을학기 AP 시간표 2026.06.25 🗓 요일 선택 전체 요일 토요일 (8/22 ~ 12/5) 일요일 (8/23 ~ 12/6) ⏱ 시작 시간 전체 시간 10:00 12:00 14:00 16:00 📚 과목 계열 전체 과목 Physics (물리) Chemistry / Bio Math / CS (미적분/컴과) Humanities (역사/지리/영어 등) const scheduleData = [ // 토요일 강좌 { day: "토요일", time: "10:00", subject: "AP Chem", teacher: "유현정", type: "Chem" }, { day: "토요일", time: "10:00", subject: "AP Phy C-MC", teacher: "신범식", type: "Phy" }, { day: "토요일", time: "10:00", subject: "AP H Geo", teacher: "이종호", type: "Human" }, { day: "토요일", time: "12:00", subject: "AP Bio", teacher: "유현정", type: "Chem" }, { day: "토요일", time: "12:00", subject: "AP Phy C-EM", teacher: "신범식", type: "Phy" }, { day: "토요일", time: "12:00", subject: "AP CS P", teacher: "박승준", type: "Math" }, { day: "토요일", time: "12:00", subject: "AP Envi Sci", teacher: "이종호", type: "Chem" }, { day: "토요일", time: "14:00", subject: "AP Cal BC", teacher: "박승준", type: "Math" }, { day: "토요일", time: "14:00", subject: "AP Chinese", teacher: "이종호", type: "Human" }, // 일요일 강좌 { day: "일요일", time: "10:00", subject: "AP Phy 1", teacher: "신범식", type: "Phy" }, { day: "일요일", time: "10:00", subject: "AP Stat", teacher: "김민수", type: "Math" }, { day: "일요일", time: "10:00", subject: "AP World H", teacher: "이종호", type: "Human" }, { day: "일요일", time: "12:00", subject: "AP Phy 2", teacher: "신범식", type: "Phy" }, { day: "일요일", time: "12:00", subject: "AP Micro", teacher: "김민수", type: "Human" }, { day: "일요일", time: "12:00", subject: "AP Eng Lang", teacher: "류은결", type: "Human" }, { day: "일요일", time: "12:00", subject: "AP CGNP (비교정치)", teacher: "이종호", type: "Human" }, { day: "일요일", time: "14:00", subject: "AP CS A", teacher: "박승준", type: "Math" }, { day: "일요일", time: "14:00", subject: "AP Macro", teacher: "김민수", type: "Human" }, { day: "일요일", time: "14:00", subject: "AP Eng Lit", teacher: "류은결", type: "Human" }, { day: "일요일", time: "16:00", subject: "AP Psycho", teacher: "류은결", type: "Human" } ]; function displayCards(data) { const grid = document.getElementById('scheduleGrid'); grid.innerHTML = ''; if (data.length === 0) { grid.innerHTML = '선택하신 조건에 맞는 강좌가 없습니다.'; return; } data.forEach(item => { const badgeClass = item.day === '토요일' ? 'sat' : 'sun'; const card = document.createElement('div'); card.className = `card ${item.day}`; // 시작 시간에 맞춰 대략적인 종료 시간 계산 (보통 2시간 블록) let endTime = "12:00"; if(item.time === "12:00") endTime = "14:00"; else if(item.time === "14:00") endTime = "16:00"; else if(item.time === "16:00") endTime = "18:00"; card.innerHTML = ` ${item.day} ${item.subject} ${item.teacher} 선생님 ⏱ ${item.time} ~ ${endTime} `; grid.appendChild(card); }); } function filterSchedule() { const dayValue = document.getElementById('daySelect').value; const timeValue = document.getElementById('timeSelect').value; const subjectValue = document.getElementById('subjectSelect').value; const filtered = scheduleData.filter(item => { const matchDay = (dayValue === 'all' || item.day === dayValue); const matchTime = (timeValue === 'all' || item.time === timeValue); const matchSubject = (subjectValue === 'all' || item.type === subjectValue); return matchDay && matchTime && matchSubject; }); displayCards(filtered); } // 초기 실행 displayCards(scheduleData); # 소스코드 2026 가을학기 AP 시간표 body { font-family: 'Noto Sans KR', sans-serif; background-color: #f4f6f9; margin: 0; padding: 40px 20px; /* 패딩 값 정상 수정 */ display: flex; flex-direction: column; align-items: center; } .header-area { text-align: center; margin-bottom: 30px; } h1 { color: #111; font-size: 32px; margin: 0 0 10px 0; } .date-sub { color: #666; font-size: 14px; } .search-container { background: white; padding: 20px 30px; border-radius: 8px; box-shadow: 0 4px 10px rgba(0,0,0,0.08); margin-bottom: 30px; display: flex; gap: 20px; flex-wrap: wrap; width: 100%; max-width: 900px; box-sizing: border-box; justify-content: space-between; } .search-group { display: flex; flex-direction: column; gap: 8px; flex: 1; min-width: 200px; } label { font-size: 14px; font-weight: bold; color: #444; } select { padding: 10px 12px; border: 1px solid #ccc; border-radius: 6px; font-size: 14px; background-color: #fff; width: 100%; box-sizing: border-box; cursor: pointer; } .grid-container { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 20px; width: 100%; max-width: 900px; } .card { background: white; border-radius: 8px; padding: 20px; box-shadow: 0 2px 5px rgba(0,0,0,0.05); border-top: 5px solid #ccc; box-sizing: border-box; } .card.토요일 { border-top-color: #00b894; } .card.일요일 { border-top-color: #ff7675; } .badge { display: inline-block; padding: 4px 8px; border-radius: 4px; font-size: 11px; font-weight: bold; color: white; margin-bottom: 12px; } .badge.sat { background-color: #00b894; } .badge.sun { background-color: #ff7675; } .subject { font-size: 18px; font-weight: bold; color: #2d3436; margin-bottom: 6px; } .teacher { font-size: 14px; color: #636e72; margin-bottom: 12px; } .time { font-size: 13px; color: #2d3436; background: #f1f2f6; padding: 6px; border-radius: 4px; text-align: center; font-weight: 500; } .no-result { grid-column: 1 / -1; text-align: center; color: #999; padding: 40px; font-size: 16px; } 2026 가을학기 AP 시간표 2026.06.25 🗓 요일 선택 전체 요일 토요일 (8/22 ~ 12/5) 일요일 (8/23 ~ 12/6) ⏱ 시작 시간 전체 시간 10:00 12:00 14:00 16:00 📚 과목 계열 전체 과목 Physics (물리) Chemistry / Bio Math / CS (미적분/컴과) Humanities (역사/지리/영어 등) const scheduleData = [ // 토요일 강좌 { day: "토요일", time: "10:00", subject: "AP Chem", teacher: "유현정", type: "Chem" }, { day: "토요일", time: "10:00", subject: "AP Phy C-MC", teacher: "신범식", type: "Phy" }, { day: "토요일", time: "10:00", subject: "AP H Geo", teacher: "이종호", type: "Human" }, { day: "토요일", time: "12:00", subject: "AP Bio", teacher: "유현정", type: "Chem" }, { day: "토요일", time: "12:00", subject: "AP Phy C-EM", teacher: "신범식", type: "Phy" }, { day: "토요일", time: "12:00", subject: "AP CS P", teacher: "박승준", type: "Math" }, { day: "토요일", time: "12:00", subject: "AP Envi Sci", teacher: "이종호", type: "Chem" }, { day: "토요일", time: "14:00", subject: "AP Cal BC", teacher: "박승준", type: "Math" }, { day: "토요일", time: "14:00", subject: "AP Chinese", teacher: "이종호", type: "Human" }, // 일요일 강좌 { day: "일요일", time: "10:00", subject: "AP Phy 1", teacher: "신범식", type: "Phy" }, { day: "일요일", time: "10:00", subject: "AP Stat", teacher: "김민수", type: "Math" }, { day: "일요일", time: "10:00", subject: "AP World H", teacher: "이종호", type: "Human" }, { day: "일요일", time: "12:00", subject: "AP Phy 2", teacher: "신범식", type: "Phy" }, { day: "일요일", time: "12:00", subject: "AP Micro", teacher: "김민수", type: "Human" }, { day: "일요일", time: "12:00", subject: "AP Eng Lang", teacher: "류은결", type: "Human" }, { day: "일요일", time: "12:00", subject: "AP CGNP (비교정치)", teacher: "이종호", type: "Human" }, { day: "일요일", time: "14:00", subject: "AP CS A", teacher: "박승준", type: "Math" }, { day: "일요일", time: "14:00", subject: "AP Macro", teacher: "김민수", type: "Human" }, { day: "일요일", time: "14:00", subject: "AP Eng Lit", teacher: "류은결", type: "Human" }, { day: "일요일", time: "16:00", subject: "AP Psycho", teacher: "류은결", type: "Human" } ]; function displayCards(data) { const grid = document.getElementById('scheduleGrid'); grid.innerHTML = ''; if (data.length === 0) { grid.innerHTML = '선택하신 조건에 맞는 강좌가 없습니다.'; return; } data.forEach(item => { const badgeClass = item.day === '토요일' ? 'sat' : 'sun'; const card = document.createElement('div'); card.className = `card ${item.day}`; // 시작 시간에 맞춰 대략적인 종료 시간 계산 (보통 2시간 블록) let endTime = "12:00"; if(item.time === "12:00") endTime = "14:00"; else if(item.time === "14:00") endTime = "16:00"; else if(item.time === "16:00") endTime = "18:00"; card.innerHTML = ` ${item.day} ${item.subject} ${item.teacher} 선생님 ⏱ ${item.time} ~ ${endTime} `; grid.appendChild(card); }); } function filterSchedule() { const dayValue = document.getElementById('daySelect').value; const timeValue = document.getElementById('timeSelect').value; const subjectValue = document.getElementById('subjectSelect').value; const filtered = scheduleData.filter(item => { const matchDay = (dayValue === 'all' || item.day === dayValue); const matchTime = (timeValue === 'all' || item.time === timeValue); const matchSubject = (subjectValue === 'all' || item.type === subjectValue); return matchDay && matchTime && matchSubject; }); displayCards(filtered); } // 초기 실행 displayCards(scheduleData); -->
