/** --------------------------- 공통 CSS -------------------------------- **/
/*폰트*/
@font-face {
    font-family: 'SBAggroB';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2108@1.1/SBAggroB.woff') format('woff');
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: 'Pretendard-Regular';
    src: url('https://fastly.jsdelivr.net/gh/Project-Noonnu/noonfonts_2107@1.1/Pretendard-Regular.woff') format('woff');
    font-weight: 400;
    font-style: normal;
}

* {
    font-family: 'Pretendard-Regular';
    font-weight: 500;
}


.w-16n9 {
    width: 100%;
    height: 100%; /* 부모 컨테이너의 높이에 맞춤 */
    /*max-width: 600px;*/
    aspect-ratio: 16 / 9;
    object-fit: cover;
    object-position: center; /* 이미지를 중앙에 배치 */
    display: block;
}


.bg-6ED8CE { background-color: #6ED8CE ; }
.bg-white { background-color: #ffffff; }
.bg-grey { background-color: #F7F7F7; }

.intro-bg-1 { background-color: #fff; }
.intro-bg-2 { background-color: #e0f7fa; }

.font_000 { color: #000; }
.font_333 { color: #333; }
.font_5B5B5B { color: #5B5B5B; }

a.log_in_out:hover {
    color: #0EDC8D;
    -webkit-transition: all 0.3s ease-out 0s;
    transition: all 0.3s ease-out 0s;
} /* 로그인 클릭시 hover */

/* 전체강의 a태그 hover시 색상 동일 */
.single-news a:hover  { color: #5B5B5B; }

.font_SBAggroB { font-family: 'SBAggroB'; }
.font_Pretendard { font-family: 'Pretendard-Regular'; }
/*폰트*/

.line_height_30 { line-height: 30px; }
.line_height_40 { line-height: 40px; }
.line_height_55 { line-height: 55px; }

.font_400 { font-weight: 400; }
.font_500 { font-weight: 500; }
.font_600 { font-weight: 600; }

.font_Size_12 { font-size: 12px; }
.font_Size_15 { font-size: 15px; }
.font_Size_18 { font-size: 18px; }
.font_Size_21 { font-size: 21px; }
.font_Size_24 { font-size: 24px; }
.font_Size_30 { font-size: 30px; }

.banner-section { padding-top: 91px; }
.log-before-section { flex:1; padding: 50px 0 100px 0; }
.guide-section { flex: 1; padding: 20px 0 50px 0; }
.curriculum-section { flex: 1; padding: 100px 0; }
.introduce-section { flex: 1; padding: 100px 0; }
.part-section { flex: 1; padding: 120px 0 20px 0; } /* 수정 */
.part-section {
    display: flex;
    justify-content: center; /* 수평 중앙 정렬 */
    align-items: center;    /* 수직 중앙 정렬 */
    margin: 0;              /* 여백 제거 */
}

.log-section { flex: 1; padding: 250px 0 0 0; }

/*해상도 버튼 위치*/
.text-position_center_start { text-align: center; }
.text-position_center_end { text-align: center; }
.text-position_end { text-align: end; }

@media (min-width: 992px) and (max-width: 1200px) {  .banner-section { padding-top: 85px; }  }

@media(max-width: 991px)  {
    .banner-section { padding-top: 131px; }
    .log-before-section { padding: 30px 0 50px 0; }
}

@media only screen and (max-width: 580px) {
    .banner-section { padding-top: 80px; }
}


@media only screen and (min-width: 768px) and (max-width: 991px) {
    .introduce-section { padding: 50px 0; }
    .text-position_center_end { text-align: end; }
    .text-position_center_start { text-align: start; }
    .part-section { padding: 200px 0 50px 0; }
    .log-section { padding: 200px 0 0 0; }
    .curriculum-section { padding: 50px 0; }
}

@media only screen and (max-width: 767px) {
    .introduce-section { padding: 30px 0; }
    .text-position_center_end { text-align: end; }
    .text-position_center_start { text-align: start; }
    .part-section { padding: 150px 0 30px 0; }
    .log-section { padding: 150px 0 0 0; }
    .curriculum-section { padding: 30px 0; }
}

.single-news .image img { border-radius: 10px; }

.info-head { padding: 10px 0 0 0; }

.common-box { margin-top: 30px; position: relative; }
.common-box .image { overflow: hidden; /*padding: 10px;*/ }
.common-box .image img { width: 100%; border: 1px solid #eee; border-radius: 10px;}

.btn-puple { color: #fff; font-family: 'Pretendard-Regular'; background-color: #A67BF7; border-color: #A67BF7; border-radius: 20px !important;}
puple:focus { color: #fff; background-color: #A67BF7; border-color: #A67BF7; box-shadow: 0 0 0 .25rem #A67BF7;}
.btn-puple:hover { color: #fff; font-family: 'Pretendard-Regular'; background-color: #A67BF7; border-color: #A67BF7; border-radius: 20px !important; }

.cursor_pointer { cursor: pointer; }
.underlined-text { text-decoration: underline; }

/* 메뉴 간격 */
@media (max-width: 991px) {
    .breadcrumbs .breadcrumbs-content {
        padding: 3rem 0 0;
        margin: 0;
    }
}

.common-section a { color: #000 !important;  }

.common-section-md { padding: 70px 0; }
.common-section-md a { color: #000 !important;  }

/* 테두리 없앰 */
/* 폰글 굵기 */
.common-bold { font-weight: 700 !important; }

/* 텍스트 소 */
.common-title_sm {
    font-size: 0.875rem;
    color: #000 !important;
}

/* 텍스트_중 */
.common-title_md {
    font-size: 1.125rem;
    color: #000 !important;
}

.common-title_md a { color: #000 !important; }

/* 텍스트_일반 */
.common-title {
    font-size: 1.25rem !important; /* 이 스타일이 우선되면 미디어 쿼리가 적용되지 않음 */
}

.common-title p{
    color: #000 !important;
    min-height: 30px;
}

.common-title a{
    color: #5b5b5b !important;
    font-weight: 500 !important;
}

/* 텍스트_대 */
.common-title_lg {
    font-size: 2.1875rem !important;
    color: #000;
}

/* 텍스트_대 더 작게*/
.common-title_lg2 {
    font-size: 1.7rem !important;
    color: #000;
}

.img-border { border-radius: 15px; }

.common-section { flex: 1; padding: 100px 0; }

/* 반응형 중간크기 */
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .common-section { padding: 50px 0; }

    /* 텍스트_대 */
    .common-title_lg { font-size: 1.75rem !important; }
    .common-title_lg2 {
        font-size: 1.5rem !important;
        color: #000;
    }
}

/* 반응형 모바일 */
@media only screen and (max-width: 767px) {
    .common-section { padding: 30px 0; }

    /* 텍스트 일반 */
    .common-title { font-size: 1.125rem !important; }
    /* 텍스트_대 */
    .common-title_lg { font-size: 1.5rem !important; }

    .common-title_lg2 {
        font-size: 1.2rem !important;
        color: #000;
    }
}


/* 반응형 폰트 */
/** --------------------------- 공통 CSS -------------------------------- **/

/** --------------------------- 로그인 화면 -------------------------------- **/
.login-eye {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    cursor: pointer;
}
/** --------------------------- 로그인 화면 -------------------------------- **/

/** --------------------------- nav메뉴바 -------------------------------- **/


/** --------------------------- nav메뉴바 -------------------------------- **/



/** --------------------------- 로그인 페이지(전) -------------------------------- **/
/* 로그인 후 페이지 간격 정리 */
.single-log-section { padding: 50px 0 100px 0; }

.single-log-be { padding: 40px; }

/* 로그인 후 페이지 간격 정리 */
/** --------------------------- 로그인 페이지(후) -------------------------------- **/


/** --------------------------- 로그인 페이지(후) -------------------------------- **/
/* 로그인 후 페이지 간격 정리 */
.single-log-sub {
    position: relative;
    padding: 40px 20px;
    border-right: 1px solid #eee;
    height: 100%;
}

/* 이미지 상단 간격 */
.single-log-img { padding-top: 25px;}

/* div 라인 생성*/
.single-log-sub.last { border-right: none; }

/* 반응형 */
@media only screen and (max-width: 1200px) {
    .single-log-sub {
        padding: 10px;
    }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .single-log-sub {
        padding: 20px 60px;
    }
    /* 화면이 줄어들었들면 테두리를 옆에서 아래로 배치 */
    .single-log-sub.center {
        border-right: none;
        border-bottom: 1px solid #f5f5f5;
    }
    .single-log-sub.last { border: none; }
}

@media only screen and (max-width: 767px) {
    .single-log-sub { padding: 30px; }
    .single-log-sub.center {
        border-right: none;
        border-bottom: 1px solid #f5f5f5;
    }
    .single-log-sub.last { border: none; }
}
/* 로그인 후 페이지 간격 정리 */
/** --------------------------- 로그인 페이지(후) -------------------------------- **/


/* 리드인과 읽쓰플러스의 기본 이론부터 학생적용까지 여기는 에듀리드인입니다. */

/* 기본적으로 줄바꿈을 숨김 */
.responsive-line-break { display: none; }

/* 텍스트_대 더 작게*/
.guide-title {
    font-size: 1.7rem !important;
    color: #000;
}
.responsive-center{ padding-bottom: 30px; }


/* 490px 이하일 때 왼쪽 정렬하고 중앙에 고정 */
@media (max-width: 490px) {
    .responsive-line-break-mobile { display: inline; }

    .guide-title {
        text-align: left; /* 텍스트 왼쪽 정렬 */
        max-width: 90%; /* 텍스트 너비를 제한하여 중앙에서 벗어나지 않게 */
    }

    .responsive-center {
        display: flex;
        justify-content: center; /* 부모 요소의 중앙에 위치 */
        padding-bottom: 0;
    }

}

/* 화면 너비가 768px 이하일 때 줄바꿈 표시 */
@media (max-width: 910px) {
    .responsive-line-break { display: inline; }

    .responsive-center { padding-bottom: 0; }
}

/* 반응형 모바일 */
@media only screen and (max-width: 767px) {
    .guide-title {
        font-size: 1.2rem !important;
        color: #000;
    }
    .responsive-center { padding-bottom: 0; }
}

/* 반응형 중간크기 */
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .guide-title {
        font-size: 1.5rem !important;
        color: #000;
    }
    .responsive-center { padding-bottom: 0; }
}

/* 리드인과 읽쓰플러스의 기본 이론부터 학생적용까지 여기는 에듀리드인입니다. */




.navbar-brand {
    display: inline-block; /* 기본 정렬 */
}
/* 모바일 환경 */
@media (max-width: 768px) {
    .navbar-brand {
        display: flex; /* Flexbox 활성화 */
        justify-content: center; /* 가로 중앙 정렬 */
        }
}




.info-head .info-box .designation {
    font-weight: 600;
    font-size: 13px;
    display: block;
    margin-bottom: 3px;
}

.common-box .info-head .info-box .name {
    display: block;
    margin-bottom: 15px;
}

.common-box .info-head .info-box .name a {
    font-weight: 700;
    font-size: 19px;
    color: #081828;
}


/* 카드형 목록 */

/* 마이픽 */
.table-checkbox { width: 5%; }
.table-no { width: 5%; }
.table-category { width: 10%; }
.table-title { width: 80%;}

.table-point { cursor: pointer; }

.pointer {
    display: inline-block;
    cursor: pointer;
}

@media (max-width: 768px) {
    .table-checkbox { width: 10%; }
    .table-no { width: 10%; }
    .table-category { width: 25%; }
    .table-title { width: 65%; }
}

@media only screen and (min-width: 768px) and (max-width: 991px) {
    .table-checkbox { width: 10%; }
    .table-no { width: 10%; }
    .table-category { width: 20%; }
    .table-title { width: 70%; }
}
/* 마이픽 */

/* 파트별 강의신청 */
.part-course-bottom {
    padding-bottom: 40px;
}

@media (max-width: 991px) {
    .part-course-bottom {
        padding-bottom: 0;
    }
}




/* 과정소개 버튼 */


/* 20241127 템플릿 수정 */

/* 로그인 */
/* 로그인 테두리 */
 .login .form-head form .form-group input {
     border: 1px solid #979696 !important;
     border-radius: 15px !important;
 }

/* 로그인 버튼색상 */
.button .log {
    background-color: #A67BF7 !important;
    border-radius: 15px !important;
    height: 56px !important;
}

/* 로그인 클릭시 버튼색상 */
.button .log::before {
    background-color: #A67BF7 !important;
    border-radius: 15px !important;
    height: 56px !important;
}

/* 입력창 중앙정렬 */
input::placeholder { text-align: center; }

/* 로그인 그림자 */
.login .form-head { box-shadow: none; }


/* 로그인 */


/* 전체강의 */
    /*세션정리*/
    .course-section {
        display: flex;
        justify-content: center; /* 수평 중앙 정렬 */
        align-items: center;    /* 수직 중앙 정렬 */
        margin: 0;              /* 여백 제거 */
    }
    .course-section { padding: 90px 0 20px 0; }
    @media only screen and (min-width: 768px) and (max-width: 991px) {
        .course-section { padding: 150px 0 50px 0; }
    }
    @media only screen and (max-width: 767px) {
        .course-section { padding: 100px 0 30px 0; }
    }
/* 전체강의 */