:root {
    --mainColor: #2B7FFC;
}

main {
    padding: 75px 73px 120px;
    overflow-x: hidden;
}

body {
    padding-left: 280px;
}

.flexSb {
    display: flex;
    justify-content: space-between;
}

.flex {
    display: flex;
}

body {
    overflow-x: hidden;
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

main {
    flex: 1;
}

.tt span {
    display: block;
    font-size: 20px;
    font-weight: 300;
    color: var(--mainColor);
    margin-bottom: 5px;
}

.tt h3 {
    font-size: 40px;
    font-weight: 600;
}

.mb {
    display: none;
}

.btn {
    width: 100px;
    background: var(--mainColor);
    color: #fff;
    padding: 5px 15px;
    text-align: center;
}

pre {
    white-space: pre-line;
    word-break: keep-all;
}

/******************* snb ********************/

.snb {
    position: fixed;
    top: 0;
    left: 0;
    width: 280px;
    height: 100vh;
    padding-bottom: 60px;
    z-index: 10;
    background: #08358E;
    display: flex;
    flex-direction: column;
}

h1 {
    padding: 0 20px;
}

h1 a {
    display: block;
    padding: 50px 0 40px;
    text-align: center;
    border-bottom: 1px solid rgba(154, 172, 181, 0.3)
}

nav {
    padding: 10px 0;
    flex: 1;
    overflow-y: auto;
    -ms-overflow-style: none;
}

nav::-webkit-scrollbar {
    display: none;
}

.gnb > li > span {
    display: block;
    padding: 15px 60px;
    color: #fff;
    font-weight: 700;
    font-size: 19px;
    cursor: pointer;
}

.gnb > li.active > span {
    background: #1E4CB0;
    position: relative;
}

.gnb > li.active > span:after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 6px;
    height: 100%;
    background: var(--mainColor);
    border-radius: 0 8px 8px 0;
    border-bottom: 1px solid #1E4CB0;
}

.subMenu {
    display: none;
}

.subMenu li a {
    display: block;
    padding: 10px 60px;
    font-size: 16px;
    font-weight: 500;
    background: #fff;
}

.subMenu li.active a {
    color: var(--mainColor);
}

.gnb > li.active .subMenu {
    display: block;
}


/******************* index ********************/

.mainBanner {
    height: 410px;
    padding: 100px;
    display: flex;
    justify-content: center;
    flex-direction: column;
    background: url("../img/mainImg.jpg") no-repeat center right / cover;
}

#index_container {
    padding: 0;
}

.mainBanner h2 {
    font-size: 38px;
    font-weight: 600;
}

.mainBanner p {
    margin-top: 22px;
    font-size: 18px;
    line-height: 2;
    white-space: pre-line;
}

.menu ul {
    display: flex;
    justify-content: center;
    padding: 50px 20px 60px;
    gap: 105px;
}

.menu ul a {
    display: block;
    text-align: center;
}

.menu ul .img {
    height: 63.7px;
}

.menu span {
    display: block;
    font-weight: 500;
    font-size: 18px;
    margin-top: 20px;
}

#index_container .content {
    padding: 0 70px 45px 110px;
    display: flex;
    gap: 70px
}

#index_container .mainTt {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding-bottom: 10px;
}

#index_container .mainTt h3 {
    font-weight: 600;
    font-sizE: 25px;
}

#index_container .mainTt a {
    color: var(--mainColor);
}

.mainNotice ul {
    border-top: 1px solid #D9D9D9;
}

.mainNotice ul li {
    border-bottom: 1px solid #D9D9D9;
}

.mainNotice ul li a {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 13px 0;
    gap: 10px;
    font-size: 18px
}

.mainNotice ul li a span {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
    height: 1.3em;
    line-height: 1.3;
    flex: 1;
}

.mainNotice ul li a em {
    font-style: normal;
    font-size: 14px
}

.mainMooc ul {
    display: flex;
    gap: 25px
}

.mainMooc ul li {
    flex: 1;
    border-radius: 15px;
    overflow: hidden;
    border: 1px solid rgba(146, 148, 151, 0.3);
}

.mainMooc ul li .img {
    height: 140px;
}

.mainMooc ul li .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.mainMooc ul li .txt {
    padding: 16px 20px 25px;
}

.mainMooc ul li .txt b {
    font-weight: 500;
    font-size: 18px;

}

.mainMooc ul li .txt span {
    font-size: 14px;
    display: block;
    padding: 5px 0;
}

.mainMooc ul li .txt p {
    color: #333;
    font-size: 14px;
}

.index_footer .flexSb {
    border-bottom: 1px solid #D9D9D9;
    border-top: 1px solid #D9D9D9;
    padding: 13.5px 100px 13.5px 87px;
    align-items: center;
}

.index_footer .flexSb ul {
    display: flex;
    gap: 40px;
}

.index_footer .flexSb ul a {
    font-size: 14px
}

.index_footer .flexSb img {
    width: 152px;
}

.index_footer .fnb {
    padding: 27px 87px 37px;
    font-size: 14px;
    color: #7D7D7D;
    line-height: 2;
}

.index_footer .fnb p {
    color: #000;
}


/******************* introduce ********************/


#introduce_container {
    background: url("../img/intro_bg.png") no-repeat top 286px right / 100% auto;
    padding-right: 270px;
}
#introduce_container .tt {
    position: relative;
}
#introduce_container .tt:after {
    content: "";
    display: block;
    width: 50.61px;
    height: 37.31px;
    position: absolute;
    bottom: 0;
    right: 0;
    background: url("../img/icon_quotes.png") no-repeat center center / contain;
}
#introduce_container .content {
    margin-top: 80px;
    display: flex;
    gap: 150px;
}
#introduce_container .content > div:first-child:after {
    content: "";
    display: block;
    width: 1px;
    height: 367px;
    background: #888;
    position: absolute;
    top: 0;
    right: -77px;
}
#introduce_container .content > div {
    flex: 1;
    white-space: pre-line;
    line-height: 2;
    font-size: 18px;
    position: relative;
}
#introduce_container .content > div span {
    color: #2B7FFC;
    font-weight: bold;
    font-size: 20px;
    display: block;
    position: absolute;
    bottom: 0;
    left: 0;
}



#history_container {
    padding-right: 135px;
    background: url("../img/intro_bg.png") no-repeat top 286px right / 100% auto;
}
#history_container .title {
    margin-top: 17px;
    text-align: right;
    font-size: 47px;
    margin-bottom: 60px;
    padding-right: 30px;
}
#history_container .title h3 {
    font-weight: 400;
    white-space: pre-line;
}
#history_container ul li {
    display: flex;
    align-items: center;
    padding: 22px 0;
    border-bottom: 1px solid #C5C5C5;
}
#history_container ul li:first-child {
    font-weight: 600;
}
#history_container ul li:first-child span:last-child {
    font-weight: 500;
    font-size: 30px
}
#history_container ul li span {
    font-size: 22px;
}
#history_container ul li span:first-child {
    width: 160px;
    display: block;
    font-size: 23px;
}
#history_container ul li span:last-child {
    flex: 1;
    word-break: keep-all;
}



.organization_info {
    margin-top: 22px;
    font-size: 18px;
    font-weight: 500;
}
.organization_info div + div {
    margin-top: 12px;
}
.organization_info b {
    font-size: 20px;
}
#organization_container .content {
    padding: 0 240px 0 120px;
}
#organization_container .content .img {
    text-align: right;
    margin-bottom: 65px;
}
#organization_container .content .img img {
    width: 645.96px;
}
.organization table {
    table-layout: fixed;
}
.organization table th {
    color: #EB880E;
    font-weight: 500;
    font-size: 16px;
    height: 39.69px;
    vertical-align: middle;
    text-align: center;
    background: rgba(235, 136, 14, 0.15);
    border: 1px solid #D9D9D9
}
.organization table td {
    border: 1px solid #D9D9D9;
    vertical-align: middle;
    padding: 20px 12px;
    line-height: 2;
    font-size: 16px
}
.organization table td:not(:last-child) {
    text-align: center;
}
.organization table tr.important {
    background: rgba(91, 188, 43, 0.15);
}
.organization table td div{
    position: relative;
    padding-left: 15px;
}
.organization table td div:before{
    content: "•";
    display: block;
    position: absolute;
    left: 0;
    top:8px;
    width: 15px;
    height: 5px;
    font-size:18px;
    line-height: 1;
}


#smart_studio_container {
    background: url("../img/intro_bg.png") no-repeat top 286px right / 100% auto;
}
#smart_studio_container .content  {
    margin-top: 70px;
}
#smart_studio_container .content > div , .kmooc04 > div , .kmooc04 > a {
    margin-top: 34px;
    gap: 65px;
}
#smart_studio_container .content .flex img , .kmooc04 img {
    width: 491px;
}
#smart_studio_container .content .flex .txt , .kmooc04 .txt {
    flex: 1;
}
.kmooc04 .txt span {
    display: inline-block;
    color: #fff;
    background: #FFA76C;
    padding: 3px 10px;
    margin-bottom: 10px;
}
#smart_studio_container .content .flex h4 , .kmooc04 h4 {
    font-weight: 500;
    font-size:28px;
}
.kmooc04 > div h5 {
    font-size:18px;
    margin-top: 10px;
    font-weight: 500;
}
#smart_studio_container .content .flex p , .kmooc04  p {
    font-size:16px;
    width: 324px;
    word-break: break-all;
    margin-top: 20px;
}



#map_container {
    position: relative;
}
#map_container h4 {
    margin-top: 84px;
    margin-bottom: 34px;
    font-weight: 500;
    font-size:28px;
}
#map_container ul {
    margin-bottom: 28px;
}
#map_container ul li {
    display: flex;
    gap: 17px;
}
#map_container ul li + li {
    margin-top: 10px;
}
#map_container ul li span {
    width: 52px;
    font-size:15px;
    font-weight: 600;
    display: block;
}
#map_container ul li b {
    font-weight: 400;
}
#map_container img {
    width: 338px;
}
.map {
    position: absolute;
    right: 0;
    top:0;
    height: 100%;
}
.map iframe {
    height: 100%;
    width: 50vw;
}





/******************* professor ********************/

#professor_support_container  {
    padding: 75px 383px 120px 124px;
}
.proTt {
    text-align: center;
    margin-top: 80px;
    margin-bottom: 30px;
}
.proTt h3{
    font-size:30px;
    font-weight: 600;
    margin-bottom: 10px;
    background: #FFD7A8;
    padding: 0 8px;
    display: inline-block;
}
.proTt p {
    font-size: 18px;
    font-weight: 500;
}
#professor_support_container .content {
    padding-right: 20px;
    padding-left: 15px;
}



.professor_bg {
    padding-right: 130px;
}
.guide {
    display: flex;
    margin-top: 34px;
    margin-bottom: 68px;
}
.guideLeft {
    flex: 1;
    padding: 50px 40px;
    background: #F2F2F2;
}
.guide h3 {
    font-weight: 600;
    font-size:30px;
    margin-bottom: 47px;
}
.guide h4 , .programDetail h4 {
    margin-bottom: 15px;
    font-size:20px;
    font-weight: bold;
    margin-top: 28px;
}
.guide p , .guide pre , .guide li , .guide span{
    font-size:18px;
    line-height: 2;
}
.guide p , .guide pre {
    white-space: pre-line;
}
.guide li ,.programDetail li{
    position: relative;
    padding-left: 15px;
}
.guide li:before , .programDetail li:before{
    content: "•";
    display: block;
    position: absolute;
    left: 0;
    top:8px;
    width: 15px;
    height: 5px;
    font-size:18px;
    line-height: 1;
}
.guideRight {
    width: 463px;
}
.guideRight .img {
    overflow: hidden;
}
.guideRight .txt {
    padding: 42px 44px;
}
.professor_bg {
    background: #FAFAFA;
}
.professor_bg .guideRight {
    background: linear-gradient(65deg, #54A9E0, #53A7B9, #53A594);
    color: #fff;
}
.guideRight .txt h4 {
    font-weight: 800;
    font-size:30px;
    margin-bottom: 25px;
}
.guideRight .txt p{
    font-weight: 600;
    font-size:18px;
    line-height: 1.66;
}
.dot_list2 li {
    display: flex;
}
.dot_list2 li span:last-child {
    flex: 1;
}
.dot_list2 li span:first-child {
    width: 60px;
}

.process h3 {
    margin-bottom: 38px;
    font-size:30px;
    font-weight: 600;
}
.process ul {
    display: flex;
    gap:38px;
    flex-wrap: wrap;
}
.process ul li {
    text-align: center;
    width: 135px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
.process ul li .img {
    margin-bottom: 20px;
}
.process ul li b {
    display: block;
    margin-bottom: 15px;
    font-size:20px;
    width: max-content;
    text-align: center;
}
.process ul li span {
    display: block;
    white-space: pre-line;
    font-size:15px;
    width: max-content;
    text-align: center;
}
#service_running_container .process ul {
    gap:0;
    justify-content: space-between;
}
#online_education_container .process ul li:nth-child(5) {
    margin-right: 50px;
}



/******************* education ********************/


#education_support_container .content  {
    padding:0 337px 0 65px;
}
#education_support_container .content > div + div {
    margin-top: 20px;
}
#education_support_container .proTt h3 {
    background: #FEFBA7;
}
#education_support_container .proTt {
    margin-bottom: 120px;
    padding-right : 337px;
}
#education_support_container .proTt img {
    width: 642px;
    margin-top: 36.8px;
}
#education_support_container .img {
    text-align: right;
}

.education_bg:not(#education_support_container) {
    background:#FAFAFA url("../img/developmentBg.png") no-repeat top -314px right -221px / 1152px 1210px;
    padding-right: 130px;
}
#tutoring_container.education_bg {
   /* background:#FAFAFA url("../img/developmentBg02.png") no-repeat top -314px right -221px / 1152px 1210px;*/
    padding-right: 130px;
}
.eduBanner {
    background: linear-gradient(65deg, #E08A54, #DAB14C);
    color: #fff;
    display: flex;
    min-height: 200px;
    margin: 33px 0 43px;
}
.eduBanner .con {
    padding: 40px 57px 40px 65px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    flex: 1;
}
.eduBanner .con h3 {
    font-size:50px;
    font-weight: 300;
}
.eduBanner .con h3 + h4 {
    margin-top: 20px;
}
.eduBanner .con h4 + h3 {
    margin-top: 8px;
}
.eduBanner .con h4 {
    font-size:30px;
    font-weight: 800;
}
.eduBanner .con p {
/*    border-bottom: 1px solid #fff;*/
    padding: 30px 0;
    line-height: 1.66;
    font-size:18px;
    font-weight: 500;
}
.eduBanner .img{
    overflow: hidden;
    width: 450px;
}
.eduBanner .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.education_bg .guide {
    display: block;
}
.education_bg .guide > .flex > div {
    flex: 1;
}
.education_bg .guide h3 {
    margin-bottom: 12px;
}
#learning_community_container .guide_info ul li{
    display: flex;
    align-items: center;
}
#learning_community_container .guide_info ul li .img{
    width: 103.69px;
}
#learning_community_container .guide_info ul li + li {
    margin-top: 32px;
}
.guide_info ul li span {
    color: #FB812F;
    font-size:18px;
    margin-bottom: 13px;
    display: block;
    font-weight: 600;
    line-height: 1;
}
.guide_info ul li p {
    line-height: 1.3;
}
.guide_info ul:not(.dot_list) li:before {
    display: none;
}
#learning_community_container .process ul {
    gap:0;
    justify-content: space-between;
}
.guide_info ul.flex {
    justify-content: space-between;
    text-align: center;
    margin-top: 40px;
}
.guide_info ul.flex .img {
    height: 63.69px;
}

#tutoring_container .eduBanner .con p {
    white-space: pre-line;
}


.programDetail {
    gap: 144px;
    padding-left: 50px;
}
.programDetail h3 {
    font-weight: 600;
    line-height: 1.6;
    font-size:30px
}
.programDetail li , .programDetail p {
    line-height: 1.3;
    font-size:18px;
}
.programDetail li + li {
    margin-top: 16px;
}
.programDetail li:before {
    top:4px;
}
.programDetail .flex {
    gap: 30px;
    align-items: flex-start;
}
.programDetail .flex img {
    margin-top: 10px;
}
.programDetail_content > img {
    margin-top: 20px;
}



/******************* kmooc ********************/

.kmooc_mainbg {
    padding-bottom: 120px;
    background: #F8FCF9 url("../img/kmoocBg3.png") no-repeat top center / 100% auto;
}
#kmooc_container h3 {
    margin-bottom: 40px;
    text-align: center;
}
#kmooc_container h3 img {
    width: 311px;
}
#kmooc_container {
    padding: 90px 0 0
}
#kmooc_container .kmoocBanner {
    text-align: center;
    height: 383px;
    background: linear-gradient(65deg, #54A9E0, #53A7B9, #53A594);
    display: flex;
    align-items: center;
    justify-content: center;
}
#kmooc_container .kmoocBanner img {
    max-width: 821px;
}
.kmooc01 {
    position: relative;
    padding: 60px 120px;
    background: #FAFAFA;
}
.kmooc01 a {
    position: absolute;
    top:50%;
    transform: translateY(-50%);
    right: 0;
    width: 311px;
    padding: 18px 25px;
    text-align: left;
    background: #0084CF;
}
#kmooc_container .kmooc01 h3 {
    font-size:35px;
    margin-bottom: 35px;
    text-align: left;
}
.kmooc01 pre {
    white-space: pre-line;
    color: #666;
    font-size: 18px
}

.kmooc02 {
    padding-top: 120px;
    padding-bottom: 120px;
    text-align: center;
}
.kmooc02 span {
    display: block;
    font-size:24px;
}
.kmooc02 h3 {
    font-size:54px;
    margin-bottom: 24px ;
}
.kmooc02 h3 b {
    color: #1894D9;
    font-weight: 700;
}
.kmooc02 p {
    color: #666;
    font-size:24px;
    white-space: pre-line;
}
.kmooc03 {
    padding: 85px 128px 0;
}
.kmooc03 h4 {
font-size:35px;
    font-weight: 700;
}
.kmooc03 p {
    margin-top: 17px;
    font-size:18px;
    color: #666;
    white-space: pre-line;
    line-height: 1.5;
}
.kmooc03 ul {
    display: flex;
    justify-content: space-between;
    margin-top: 65px;
}
.kmooc03 ul li {
    width: 135px;
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: center;
}
.kmooc03 ul li .txt {
    display: flex;
    flex-direction: column;
    text-align: center;
    justify-content: center;
    align-items: center;
}
.kmooc03 ul li span {
    display: block;
    margin-top: 16px;
    font-size:18px;
    color: #333;
    width: max-content;
    text-align: center;
}
.kmooc04 {
    padding: 50px 128px 0;
}

.kmooc_bg .guideLeft {
    position: relative;
}
.kmooc_bg .guideLeft .preparing{
    position: absolute;
    width: calc(100% - 40px);
    height: calc(100% - 40px);
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
}
.kmooc_bg .guideRight {
    background: linear-gradient(65deg, #5464E0, #6F53A5);
    color: #fff;
}
.kmooc_bg .guideRight .preparing {
    height: 232px;
}
.preparing {
    border:1px solid #EB880E;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #EB880E;
    font-weight: 700;
    font-size:20px;
    background: rgba(255,255,255,0.64);
}
.kmooc_bg .process {
    position: relative;
}
.kmooc_bg .process ul {
    justify-content: center;
    gap:38px
}
.kmooc_bg .process .preparing {
    bottom: -20px;
    left: 0;
    height: calc(100% - 50px);
    position: absolute;
    width: 100%;
}
.course_tt .kmooc03 {
    padding: 135px 0 0;
}



.kmooc_bg:not(#kmooc_container) {
    background: #F8FCF9 url("../img/kmoocBg3.png") no-repeat top center / 100% auto;
}
#course_container .content {
    padding: 0 50px ;
}

.course_tt {
    position: relative;
}
.course_tt a.btn{
    position: absolute;
    top: 120px;
    right: -125px;
    width: max-content;
}
#special_course_container .course_tt a.btn {
    right: -73px;
}
.course_con {
    padding: 150px 0 0;
}

.special_course_con table {
    margin-top: 80px;
}
.special_course_con table th{
    padding: 12px 20px;
    font-size:20px;
    text-align: left;
}
.special_course_con table th:first-child {
    background: #C5E8EA;
    color: #0084CA
}
.special_course_con table th:last-child {
    background: #FFE966;
    color: #654925
}
.special_course_con table td {
    padding: 18px 20px;
    font-size: 18px;
    line-height: 1.8;
}
.special_course_con .kmooc03 {
    padding: 55px 0 0;
}
.special_course_list {
    padding: 0 20px 0;
}
.special_course_list > div {
    margin-top: 50px;
}
.special_course_list > div h5 {
    font-size: 20px;
    margin-bottom: 20px;
}
.dot_list li{
    position: relative;
    padding-left: 15px;
    font-size: 18px;
    line-height: 1.8;
}
.dot_list li:before{
    content: "•";
    display: block;
    position: absolute;
    left: 0;
    top:8px;
    width: 15px;
    height: 5px;
    font-size:18px;
    line-height: 1;
}


#kocw_container.kmooc_bg {
    padding-left: 490px;
    background: url("../img/kocwBg.png") no-repeat top left / auto;
}
#kocw_container h5 {
    margin: 40px 0 30px;
    font-size: 25px;
}
#kocw_container h4 {
font-size:30px;
    margin-bottom: 83.5px;
}
#kocw_container h4 span {
    color: #F36523;
    display: block;
}
#kocw_container p {
    font-size:18px;
    margin-bottom: 50px;
    white-space: pre-line;
    line-height: 2;
}
#kocw_container h6 {
    font-size: 20px;
    margin-bottom: 15px;
}
#kocw_container small {
    display: block;
    margin-bottom: 70px;
    font-size:18px;
    font-weight: 500;
    line-height: 2;
}
#kocw_container a {
    display: inline-block;
    padding: 16px 25px;
    color: #fff;
    background: #F36523;
}


/******************* notice ********************/

#notice_container {
    background: #FAFAFA;
}

.search {
    padding: 28px 0 58px;
}

.search .flex {
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.search .flex select {
    border: 1px solid #DFDFDF;
    background: #fff;
    padding: 10px 15px;
    color: #555;
}

.search .flex input {
    max-width: 500px;
    width: 100%;
    flex: 1;
    background: #fff;
    border: 1px solid #DFDFDF;
    padding: 10px 15px;
}

.search .flex .btn {
    padding: 10px 15px;
}


/* board table */

.board_table th {
    background: #E4EDFF;
    border-top: 3px solid var(--mainColor);
    border-bottom: 1px solid var(--mainColor);
    color: #08358E;
    height: 60px;
}

.board_table td {
    height: 60px;
    border-bottom: 1px solid #ccc;
}

.board_table td:not(:nth-child(2)) {
    text-align: center;
}

.board_table td a {
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
    height: 1.3em;
    line-height: 1.3;
}

/* paging */
.paging {
    justify-content: center;
    gap: 5px;
    margin-top: 30px;
}

.paging ul {
    display: flex;
    gap: 5px;
}

.paging ul li a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 35px;
    height: 35px;
    border: 1px solid #ccc;
    background: #fff;
}

.paging ul li.active a {
    background: var(--mainColor);
    color: #fff;
    border-color: var(--mainColor);
}

.paging ul li:hover:not(.active) a {
    color: var(--mainColor);
}

.paging button:first-child {
    transform: rotate(180deg);
}

/* notice detail */

.notice_tt {
    padding: 73px 0 45px;
}

.notice_tt h4 {
    font-size: 30px;
    font-weight: 600;
}

.notice_tt form {
    display: flex;
}

.notice_tt form input {
    border: none;
    padding: 5px 15px;
    width: 156px;
    height: 30px;
    background: #F4F4F4;
}

.notice_tt form .btn {
    background: #DF0623;
    width: 40px;
    height: 30px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.notice_content {
    box-shadow: 0 0 11px rgba(57, 106, 191, 0.11);
    background: #fff;
    padding: 73px 50px 63px;
    margin-bottom: 27px;
}

.notice_content h4 {
    font-size: 28px;
    margin-bottom: 40px;
}

.notice_content pre {
    font-size: 20px;
    margin-bottom: 40px;
}

#notice_detail_container .flex {
    gap: 40px
}

#notice_detail_container .flex .content {
    flex: 7;
}

.notice_list {
    flex: 3;
}

.notice_btm {
    justify-content: right;
    display: flex;
    gap: 13px;
    margin-top: 12px;
}

.notice_item {
    box-shadow: 0 0 11px rgba(57, 106, 191, 0.11);
    background: #fff;
    margin-bottom: 20px;
    padding: 20px;
}

.notice_item .img {
    width: 100%;
    height: 164px;
    margin-bottom: 8px;
}

.notice_item .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.notice_item .txt {
    font-size: 14px;
    color: #7D7D7D;
    margin-bottom: 8px;
}

.notice_item .txt span {
    color: var(--mainColor);
}

.notice_item p {
    font-size: 18px;
    font-weight: 500;
}

#ctl_notice_container .board_table th {
    background: transparent;
}

#ctl_data_container .content ul {
    border-top: 3px solid var(--mainColor);
}

#ctl_data_container .content ul li {
    display: flex;
    border-bottom: 1px solid #ccc;
    padding: 30px 18px;
    justify-content: space-between;
    align-items: center;
    gap: 20px
}

#ctl_data_container .content ul li .img {
    width: 265px;
    height: 169px;
    margin-right: 40px;
}

#ctl_data_container .content ul li .img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

#ctl_data_container .content ul li .txt {
    flex: 1;
}

#ctl_data_container .content ul li > div {
    display: flex;
}

#ctl_data_container .content ul li .txt h4 {
    font-size: 24px;
    font-weight: 500;
    margin-bottom: 13px;
}

#ctl_data_container .content ul li .txt p {
    margin-bottom: 27px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    height: 2.6em;
    line-height: 1.3;
    white-space: pre-line;

}

#ctl_data_container .content ul li .txt > div {
    display: flex;
    align-items: center;
    gap: 25px;
    color: #aaa;
    font-size: 14px;
}

#ctl_data_container .content ul li .txt > div span {
    color: #555;
    margin-left: 5px;
    display: inline-block;
}

#ctl_data_container .content ul li .download {
    background: var(--mainColor);
    color: #fff;
    width: 176px;
    height: 56px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 28px;
    font-size: 18px;
    font-weight: 900;
}


/******************* footer ********************/

.sub_footer {
    padding: 35px 75px;
    color: #fff;
}

.sub_footer .flex {
    gap: 10px;
    align-items: center;
}

.sub_footer .flex .fnb {
    display: flex;
    align-items: end;
    gap: 50px;
    font-size: 16px;
    font-weight: 500;
}

.sub_footer .flex .fnb a {
    font-size: 18px;
    font-weight: 700;
    display: block;
    margin-top: 3px;
    color: #fff;
}

.professor_footer {
    background: linear-gradient(65deg, #54A9E0, #53A7B9, #53A594);
}

.education_footer {
    background: linear-gradient(65deg, #E08A54, #DAB14C);
}

.kmooc_footer {
    background: linear-gradient(65deg, #5464E0, #6F53A5);
}
.mbMenu {

}




/* 2025-06-26  추가 */
/* 3depth 스타일 */
/*
.depth02 > li { position: relative; }
.depth03 {

    position: absolute;
	padding-right:-50px;
    min-width: 160px;
    background: #fff;

    z-index: 10;
}
.depth02 > li:hover > .depth03 {
    display: block;
}
.depth03 li a {
    padding: 8px 16px;
    display: block;
    white-space: nowrap;
}
*/