@charset "utf-8";

/* 회원가입 이메일 자동완성 */
.autocomplete-suggestions { 
	border: 1px solid #ccc; 
	max-height: 150px; 
	overflow-y: auto; 
	position: relative; 
/* 	position: absolute;  */
	background-color: white; 
	z-index: 1000; 
	width: calc(100% - 22px); 
} 


/* ================= 메인배너 ================= */
.banner { position: relative; width: 100%; background: #000; }
.banner .banner_img { width: 100%; }
.banner .banner_img img { width: 100%; height: auto; display: block; margin: 0 auto; }
.banner .banner_text { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); color: #fff; text-align: center; line-height: 1.5; padding: 12px 16px; border-radius: 8px; }

/* ================= 설립 취지 ================= */
.banner_box { display: flex; flex-direction: column; justify-content: center; align-items: center;}
.banner_box h1, .banner_box h2, .banner_box h3, .banner_box p { margin: 0; }
.banner_box img { display: block; max-width: 100%; height: auto; }
.banner_box { margin-top: 72px; font-family: Pretendard;}
.banner_box .esd-section { width: 100%; max-width: 1200px; margin: 0 auto; padding: clamp(20px, 4vw, 60px); color: #111; font-family: Pretendard, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Noto Sans KR", Arial, "Apple SD Gothic Neo", "맑은 고딕", "Malgun Gothic", sans-serif; display: flex; flex-direction: column; gap: 2rem; }
.banner_box .hero { position: relative; overflow: hidden; border-radius: 8px; background: #e9ecef; }
.banner_box .hero .hero__img { width: 100%; object-fit: cover; }
.banner_box .hero .hero__text { position: absolute; left: clamp(16px, 3vw, 28px); bottom: clamp(16px, 3vw, 28px); padding: clamp(10px, 2.2vw, 16px) clamp(14px, 2.6vw, 20px); background: rgba(0,0,0,.36); color: #fff; border-radius: 12px; max-width: min(92%, 640px); }
.banner_box .hero .hero__text h1 { font-size: clamp(20px, 3.6vw, 34px); font-weight: 700; letter-spacing: -0.02em; }
.banner_box .hero .hero__text p { margin-top: 0.4em; font-size: clamp(13px, 2.2vw, 18px); line-height: 1.5; opacity: .95; }

/* 카드 영역: flex로 변경 */
.banner_box .info-grid { margin-top: clamp(18px, 3.5vw, 28px); display: flex; flex-wrap: wrap; gap: clamp(12px, 2.6vw, 18px); }
.banner_box .info-grid .card { flex: 1 1 calc(50% - clamp(12px, 2.6vw, 18px)); box-sizing: border-box; padding: clamp(16px, 3vw, 22px); background: #eefaf1; border-radius: 8px; line-height: 1.6; display: flex; flex-direction: column; gap: 1rem; border: 0; }
.banner_box .info-grid .card h3 { font-size: clamp(16px, 2.4vw, 20px); font-weight: 700; margin-bottom: .5rem; }
.banner_box .info-grid .card p { font-size: clamp(13px, 2.1vw, 16px); color: #333; }

/* 모바일: 카드 1열 */
@media (max-width: 860px) {
  .banner_box .info-grid .card { flex: 1 1 100%; }
}



/* ================= AI 프로그램 설명 ================= */
.banner_box .ai_desc_box{background-color:#f9f9f9;font-family:sans-serif;display:flex;flex-direction:column;width:100%;justify-content:center;align-items:center;}
.banner_box .ai_desc{width:100%;display:flex;flex-direction:column;justify-content:center;align-items:center;padding:3rem 0}
.banner_box .ai_desc:first-child{background-color:#fff}
.banner_box .ai_desc:first-child .ai_card{background-color:#f9f9f9}
.banner_box .ai_desc:nth-child(odd){background-color:#fff}
.banner_box .ai_desc:nth-child(odd) .ai_card{background-color:#f9f9f9}
.banner_box .ai_desc__bg{width:1200px}
.banner_box .title_row{display:flex;align-items:center;gap:8px;margin-bottom:12px}
.banner_box .title_row .step{display:inline-block;background:#0db763;color:#fff;font-weight:700;border-radius:9999px;width:2.5rem;height:1.75rem;text-align:center;line-height:1.75rem;font-size:14px}
.banner_box .title_row h2{font-size:20px;font-weight:700;color:#111;margin:0}
.banner_box .ai_desc .desc{color:#555;margin-bottom:24px;font-size:14px;width:100%}
.banner_box .ai_card_list{display:grid;grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:16px;list-style:none;padding:0;margin:0 auto;max-width:1200px}
.banner_box .ai_card{width:auto;background:#fff;padding:20px;border-radius:12px;font-size:14px;line-height:1.6;color:#333;box-sizing:border-box}
.banner_box .ai_card b{display:block;margin-bottom:8px;font-weight:600;color:#111}
.banner_box .ai_desc__top{width:100%;display:flex;justify-content:space-between;align-items:center;padding:1rem 0}
.banner_box .ai_desc_img{width:70px;aspect-ratio:1/1}
.banner_box .ai_desc_img img{width:100%;height:100%;object-fit:contain}

@media (max-width:1200px){.banner_box .ai_desc__bg{width:100%}}
@media (max-width:1024px){.banner_box .ai_card{flex:1 1 calc(50% - 8px)}}
@media (max-width:600px){.banner_box .ai_card{flex:1 1 100%}}


/* ================= 사업소개 ================= */

.visually_hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* ─────────────── 소개 영역 ─────────────── */
.section_about { width: 100%; background-color: #f9f9f9; }
.section_about .about_container { max-width: 1400px; margin: 0 auto; display: flex; align-items: center; gap: 64px; padding: 80px 0; }
.section_about .about_content { flex: 1; display: flex; flex-direction: column; gap: 1rem; }
.section_about .about_title { font-size: 1.5rem; font-weight: 700; margin-bottom: 1rem; line-height: 1.4; }
.section_about .about_desc { font-size: 1rem; color: #444; line-height: 1.6; margin-bottom: 1rem; }
.section_about .about_image { flex: 1; }
.section_about .about_image img { width: 100%; height: auto; border-radius: 8px; display: block; }

@media (max-width: 768px) {
  .section_about .about_container { flex-direction: column; text-align: center; }
  .section_about .about_image { margin-top: 20px; }
}

/* ─────────────── 강의 리스트 ─────────────── */
.schedule_section { padding: 5rem 0; background-color: #ffffff; }
.schedule_section .schedule_grid { max-width: 1400px; margin: 0 auto; display: grid; grid-template-columns: 1fr 1fr; gap: 40px; position: relative; }
.schedule_section .schedule_grid::before { content: ""; position: absolute; top: 40px; bottom: 0; left: 50%; width: 1px; background: #e6ece6; transform: translateX(-0.5px); }

.schedule_section .schedule_block { display: flex; flex-direction: column; justify-content: center; align-items: center; }

.schedule_section .schedule_title { display: flex; align-items: center; gap: 10px; margin-bottom: 16px; }
.schedule_section .schedule_title h3 { margin: 0; line-height: 1; font-size: 1.2rem; font-weight: 700; }
.schedule_section .schedule_title .icon { width: 40px; height: 40px; flex: 0 0 20px; display: flex; align-items: center; justify-content: center; }
.schedule_section .schedule_title .icon img { width: 100%; height: 100%; display: block; object-fit: contain; }

.schedule_section .schedule_card { width: 100%; background: #ffffff; border: 1px solid #e6ece6; border-radius: 4px; box-shadow: 0 2px 10px rgba(0,0,0,.04); overflow: hidden; }

.schedule_section .schedule_table { width: 100%; border-collapse: collapse; table-layout: fixed; font-size: 14px; }
.schedule_section .schedule_table th,
.schedule_section .schedule_table td { width: 33.33%; text-align: center; padding: 10px 14px; }

.schedule_section .schedule_table thead th { color: #3b3b3b; background: #f3faf4; border-bottom: 1px solid #e6ece6; }
/* .schedule_section .schedule_table thead th:nth-child(2) { text-align: left; } */

.schedule_section .schedule_table tbody td { color: #444444; border-bottom: 1px solid #eef2ee; }
/* .schedule_section .schedule_table tbody td:nth-child(2) { text-align: left; } */

.schedule_section .schedule_table tbody tr:nth-child(even) { background: #fbfdfb; }
.schedule_section .schedule_table tbody tr:hover { background: #f1f9f2; }
.schedule_section .schedule_table tbody tr:last-child td { border-bottom: 0; }

.schedule_section .schedule_link { display: inline-block; text-decoration: underline; color: #1a7f3a; font-weight: 600; }
.schedule_section .schedule_link:focus { outline: 2px solid #8fd3a7; outline-offset: 2px; }
.schedule_section .schedule_link:hover { text-decoration: none; }

@media (max-width: 900px) {
  .schedule_section .schedule_grid { grid-template-columns: 1fr; gap: 40px; }
  .schedule_section .schedule_grid::before { display: none; }
  .schedule_section .schedule_title { font-size: 18px; }
  .schedule_section .schedule_table { font-size: 13px; }
}


/*====================오시는길============================*/

*{margin:0;padding:0;list-style:none;box-sizing:border-box;}
.map_section{width:100%;display:flex;justify-content:center; padding: 5rem 2rem 1rem 1rem;}
.map_section .map_box{width:100%;max-width:1400px;}
.map_section .map_img img{width:100%;height:auto;display:block;border-radius:10px; margin-bottom: 1.5rem;}
.map_section .map_desc{display:flex;flex-direction:column;}
.map_section .map_desc li{display:flex;align-items:flex-start;gap:2rem;padding:2.5rem 1rem;border-bottom:2px solid #ddd;}
.map_section .desc_left{display:flex;align-items:center;gap:1rem;min-width:180px;}
.map_section .desc_left img{width:30px;height:30px;object-fit:contain;}
.map_section .desc_left h3{font-size:1.25rem;font-weight:600;color:#222;}
.map_section .desc_right{font-size:1rem;line-height:1.6;color:#444;}
.map_buttons { display: flex; gap: 1rem; }
.map_buttons .map_button {margin-bottom: 7rem; width: 7%; display: flex; align-items: center; gap: 0.5rem; background-color: #00c73c; color: #fff; padding: 0.75rem 1.5rem; border-radius: 8px; text-decoration: none; font-size: 1rem; font-weight: 500; transition: background-color 0.2s; }
.map_buttons .map_button:hover { background-color: #00b233; }
.map_buttons .map_button img { width: 20px; height: 20px; }
.map_btn{width: 100%; display: flex; justify-content: center; align-items: center;}
.map_buttons{width: 100%; display: flex; justify-content: center; align-items: center;}
.map_buttons a{width: 5%; display: flex; justify-content: center; align-items: center;}

@media(max-width:768px){
.map_section .map_desc li{flex-direction:column;align-items:flex-start;}
.map_section .desc_left{flex-direction:row;margin-bottom:0.5rem;}
}


/* ================= 참가 안내 ================= */
.participation_guide { padding: 7.5rem 0; font-family: 'Pretendard', sans-serif; color: #222; max-width: 1400px; width: 100%; margin: 0 auto; display: flex; flex-direction: column; gap: 7.5rem; align-items: center; }
.participation_guide .intro__text { margin-bottom: 2rem; }
.participation_guide .intro__text h1 { font-size: 2rem; line-height: 1.25; margin-bottom: 0.75rem; }
.participation_guide .intro__text p { line-height: 1.7; }
.participation_guide .intro__content { display: flex; gap: 2rem; align-items: flex-start; flex-wrap: wrap; }
.participation_guide .info_box { flex: 1 1 560px; display: flex; flex-direction: column; gap: 1.5rem; }
.participation_guide .link_section { display: flex; flex-wrap: wrap; gap: 1rem; padding: 1.25rem 0; border-bottom: 1px solid #ddd; }
.participation_guide .link_item { flex: 1 1 260px; background: #f9f9f9; padding: 1rem; border-radius: 0.75rem; }
.participation_guide .link_item h2 { font-size: 1.1rem; margin-bottom: 0.5rem; }
.participation_guide .link_item a { display: block; color: #0a66c2; text-decoration: none; word-break: break-word; }
.participation_guide .link_item a:hover { text-decoration: underline; }
.participation_guide .description { padding-top: 0.5rem; }
.participation_guide .description p { line-height: 1.7; margin-bottom: 0.75rem; }
.participation_guide .description h5 { font-size: 0.75rem; text-align: right; color: #999; font-weight: 500; }
.participation_guide .intro__image { flex: 0 1 400px; max-width: 400px; margin-left: auto; }
.participation_guide .intro__image img { display: block; width: 100%; height: auto; aspect-ratio: 400 / 270; object-fit: cover; border-radius: 8px; }
.participation_guide .guide_desc { width: 100%; display: flex; flex-direction: column; justify-content: center; gap: 3rem; margin-top: 7.5rem; }
.participation_guide .guide_desc .desc_img { width: 100%; display: flex; justify-content: center; }
.participation_guide .guide_desc .desc_img img { width: 100%; object-fit: cover; border-radius: 20px; }
.participation_guide .guide_desc .desc_text { background: #f9f9f9; padding: 1.5rem 24px; border-radius: 10px; color: #222; }
.participation_guide .guide_desc .desc_text h3 { font-size: 1.8rem; font-weight: 700; margin-bottom: 1.5rem; }
.participation_guide .guide_desc .desc_text .desc_box { padding: 1rem 0; display: flex; flex-direction: column; gap: 1rem; border-bottom: 2px solid #ddd; }
.participation_guide .guide_desc .desc_text .desc_box:last-child { border-bottom: none; padding-bottom: 0; }
.participation_guide .guide_desc .desc_text .desc_box p { margin: 0.5rem 0; }
.participation_guide .guide_desc .desc_text .desc_box a { color: #0056b3; text-decoration: underline; word-break: break-word; }

/* 반응형 */
@media (max-width: 1400px) {
  .participation_guide { width: 100%; }
}
@media (max-width: 1024px) {
  .participation_guide .intro__image { flex-basis: 300px; max-width: 300px; }
}
@media (max-width: 768px) {
  .participation_guide .intro__content { flex-direction: column; }
  .participation_guide .link_section { padding: 1rem 0; }
  .participation_guide .intro__image { max-width: 220px; margin: 0 auto; }
}