/*
Theme Name: Colibri WP Child
Theme URI: https://colibriwp.com/go/colibri-theme/
Template: colibri-wp
Author: Extend Themes
Author URI: https://colibriwp.com/
Description: A beautiful, very customizable, multipurpose theme that you can use to create amazing websites through drag and drop. It comes with a pre-designed home page, 5 header designs and over 35 ready-to-use content blocks that you can easily customize. You can also design your own custom blocks by combining more than 25 drag and drop components. It offers lots of customization options (video background, slideshow background, header content types, etc) to help you create a website that stands out in no time. It is also designed with responsiveness, to work on mobile devices right out of the box. It is the only theme you will ever need! CHECK OUT THE DEMOS: https://colibriwp.com/go/demos
Tags: entertainment,food-and-drink,portfolio,one-column,two-columns,right-sidebar,grid-layout,custom-header,custom-menu,custom-logo,full-width-template,theme-options,translation-ready,featured-images,threaded-comments
Version: 1.0.144.1769976330
Updated: 2026-02-01 15:05:30

*/



/* --- WIMU Directory Final CSS (Updated) --- */

#wimu-modern-directory {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: #333;
    box-sizing: border-box;
}

#wimu-modern-directory * {
    box-sizing: border-box;
}

.wimu-section-title {
    font-size: 1.8rem;
    color: #1e3a8a;
    border-bottom: 2px solid #dc2626;
    padding-bottom: 10px;
    margin: 60px 0 30px 0;
    text-transform: uppercase;
    letter-spacing: 1px;
}

/* --- 사진 스타일 (80px 원형 통일) --- */
.card-photo, 
.header-photo,
.president-photo {
    width: 80px !important;
    height: 80px !important;
    border-radius: 50% !important;
    overflow: hidden;
    border: 3px solid #f1f5f9;
    box-shadow: 0 2px 6px rgba(0,0,0,0.1);
    flex-shrink: 0;
    background: #fff;
}

.president-photo {
    margin-left: 20px;
}

.card-photo img, 
.header-photo img,
.president-photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* --- 버튼 스타일 --- */
.degree-badge, 
.p-degree-badge,
.role-badge,
.p-role {
    display: inline-block;
    background-color: #f1f5f9;
    color: #1e3a8a;
    padding: 4px 12px;
    border-radius: 20px !important;
    font-size: 0.8rem;
    font-weight: 600;
    margin-top: 5px;
    border: 1px solid #e2e8f0;
}

.p-role, 
.role-badge {
    background-color: #1e3a8a;
    color: #fff;
    border: none;
    margin-bottom: 5px;
    margin-top: 0;
    padding: 5px 15px !important;
}

/* --------------------------------------
   SECTION 1: Board of Directors (3열 고정)
-------------------------------------- */
.wimu-board-grid {
    display: grid;
    /* 중요: 3열로 고정하여 3명-2명 배치가 되도록 설정 */
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.wimu-board-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    padding: 20px;
    text-align: center;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
    transition: transform 0.2s;
}

.wimu-board-card:hover {
    transform: translateY(-3px);
    border-color: #1e3a8a;
    box-shadow: 0 5px 15px rgba(0,0,0,0.1);
}

.wimu-board-card h4 {
    margin: 0 0 5px 0;
    font-size: 1.1rem;
    color: #2d3748;
    font-weight: 700;
}

.wimu-board-card span {
    font-size: 0.9rem;
    color: #dc2626;
    font-weight: 600;
}

/* --------------------------------------
   SECTION 2: Staff Directory
-------------------------------------- */
.wimu-president-container {
    background: #fff;
    border-left: 5px solid #1e3a8a;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 4px 10px rgba(0,0,0,0.08);
    margin-bottom: 30px;
}

.president-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    margin-bottom: 20px;
    border-bottom: 1px solid #eee;
    padding-bottom: 20px;
}

.president-info {
    flex: 1;
    padding-right: 20px;
}

.p-name {
    font-size: 1.8rem;
    color: #1e3a8a;
    margin: 0 0 8px 0;
    font-weight: 800;
}

.president-bio p {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #4a5568;
}

.wimu-staff-grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 30px;
}

.staff-card {
    display: flex;
    justify-content: space-between;
    align-items: center;
    background: #f8fafc;
    padding: 20px;
    border-radius: 8px;
    border: 1px solid #e2e8f0;
}

.staff-card .card-info {
    flex: 1;
    padding-right: 15px;
}

.staff-card h4 {
    margin: 0 0 5px 0;
    font-size: 1.2rem;
    color: #2d3748;
}

/* --------------------------------------
   SECTION 3: Instructors
-------------------------------------- */
.wimu-instructor-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 25px;
}

.instructor-card {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    padding: 20px;
    box-shadow: 0 3px 6px rgba(0,0,0,0.04);
    height: 100%;
}

.instructor-card .card-header {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    border-bottom: 1px dashed #e2e8f0;
    padding-bottom: 15px;
    margin-bottom: 15px;
}

.instructor-card .header-text {
    flex: 1;
    padding-right: 10px;
}

.instructor-card h4 {
    margin: 0 0 8px 0;
    font-size: 1.15rem;
    color: #1e3a8a;
    font-weight: 700;
}

.instructor-card .card-body ul {
    margin: 0;
    padding-left: 15px;
    list-style-type: disc;
	text-align: left;
}

.instructor-card .card-body li {
    font-size: 0.85rem;
    color: #4a5568;
    margin-bottom: 5px;
    line-height: 1.4;

}

/* 반응형 (모바일/태블릿) */
@media screen and (max-width: 900px) {
    /* 태블릿: 보드와 강사 모두 2열로 변경 */
    .wimu-board-grid,
    .wimu-instructor-grid {
        grid-template-columns: repeat(2, 1fr);
    }
}

@media screen and (max-width: 600px) {
    /* 모바일: 모두 1열 */
    .wimu-board-grid,
    .wimu-staff-grid,
    .wimu-instructor-grid {
        grid-template-columns: 1fr;
    }
    .president-header {
        flex-direction: column-reverse;
        align-items: center;
        text-align: center;
    }
    .president-info {
        padding-right: 0;
        margin-top: 15px;
    }
    .president-photo {
        margin-left: 0;
        margin-bottom: 15px;
    }
}




/* --- WIMU Course Catalog Styles --- */

#wimu-course-catalog {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
    font-family: 'Open Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    color: #333;
    box-sizing: border-box;
}

#wimu-course-catalog * {
    box-sizing: border-box;
}

/* 학과별 섹션 컨테이너 (Flexbox) */
.dept-container {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 80px; /* 섹션 간 간격 */
    border-bottom: 1px solid #eee;
    padding-bottom: 60px;
}

.dept-container:last-child {
    border-bottom: none;
}

/* --- 좌측 사이드바 (학과 제목 & 이미지) --- */
.dept-sidebar {
    width: 30%; /* 데스크탑 기준 너비 */
    padding-right: 40px;
}

.dept-sticky-content {
    position: sticky;
    top: 100px; /* 스크롤 시 상단 고정 위치 */
    text-align: right; /* 우측 정렬 (캡쳐 이미지 스타일) */
}

.dept-credits {
    display: block;
    font-size: 0.9rem;
    color: #666;
    letter-spacing: 1px;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.dept-title {
    font-family: 'Times New Roman', serif; /* 클래식한 느낌 */
    font-size: 2.8rem;
    color: #1e3a8a; /* University Blue */
    margin: 0;
    line-height: 1.1;
    text-transform: uppercase;
}

.dept-subtitle {
    display: block;
    font-size: 1rem;
    color: #1e3a8a;
    margin-top: 5px;
    letter-spacing: 2px;
}

.dept-line {
    width: 100%;
    height: 3px;
    background-color: #d97706; /* Gold/Orange Accent */
    margin: 20px 0;
}

.dept-image {
    width: 100%;
    overflow: hidden;
    box-shadow: 0 4px 10px rgba(0,0,0,0.15);
    border: 1px solid #ddd;
}

.dept-image img {
    width: 100%;
    height: auto;
    display: block;
    transition: transform 0.3s;
}

.dept-image:hover img {
    transform: scale(1.05); /* 마우스 오버 시 살짝 확대 */
}

/* --- 우측 강좌 리스트 --- */
.dept-course-list {
    width: 70%; /* 데스크탑 기준 너비 */
    padding-left: 20px;
    border-left: 1px solid #f0f0f0; /* 좌우 구분선 */
}

.course-item {
    margin-bottom: 30px;
    padding-bottom: 30px;
    border-bottom: 1px dashed #e0e0e0;
}

.course-item:last-child {
    border-bottom: none;
}

.c-header {
    display: flex;
    align-items: baseline;
    margin-bottom: 10px;
    flex-wrap: wrap;
}

.c-code {
    font-size: 1.2rem;
    font-weight: 700;
    color: #1e3a8a; /* 코드 색상 (남색) */
    margin-right: 15px;
    min-width: 80px;
}

.c-name {
    font-size: 1.3rem;
    font-weight: 600;
    color: #222;
    font-family: 'Times New Roman', serif;
}

.c-desc {
    font-size: 0.95rem;
    line-height: 1.6;
    color: #555;
    margin: 0;
    text-align: justify; /* 텍스트 양쪽 정렬 */
}

/* --- 반응형 (모바일) --- */
@media screen and (max-width: 900px) {
    .dept-container {
        flex-direction: column;
    }

    .dept-sidebar {
        width: 100%;
        padding-right: 0;
        margin-bottom: 30px;
        text-align: center; /* 모바일은 중앙 정렬 */
    }

    .dept-sticky-content {
        position: static; /* 모바일에서는 고정 해제 */
        text-align: center;
    }

    .dept-course-list {
        width: 100%;
        padding-left: 0;
        border-left: none;
    }

    .dept-line {
        margin: 20px auto; /* 중앙 정렬 */
    }
    
    .c-header {
        flex-direction: column;
    }
    
    .c-code {
        margin-bottom: 5px;
        color: #d97706; /* 모바일에서 코드 색상 강조 (Gold) */
    }
}