/* 전체 */ img {margin:0 auto;} .carousel-control img {position:relative; top:50%; width:100px; margin-top:-50px;} #myCarousel_mobile {display:none;} .bx-wrapper {margin-bottom:0;} .bx-wrapper .bx-controls-direction a {z-index:0;} .clear:after {display:block; content:''; clear:both;} .utbThumbWrap {padding-bottom:66%} .utbThumb {margin-top:-14%;} @media (min-width: 834px) and (max-width: 1024px) { .utbThumb {margin-top:-22%;} } @media (min-width : 600px) and (max-width: 833px) { .utbThumb {margin-top:-17%;} } @media (max-width: 599px) { .utbThumb {margin-top:-20%;} } .bg {padding:50px 0;} .gray {background:#f5f6f8;} .subject_title {position:relative;} .subject_title h1 {font-size:20px; color:#000; font-weight:600; position:relative; margin:0 0 13px;} .subject_title .btn_more {position:absolute; right:0; top:9px; color:#000000; font-size:17px; font-weight:500;} .subject_title .btn_more:hover {color:#1e8aff;} .top_left_login{float:left; margin-right:5px; width:285px; margin-top:-3px; } .top_login{float:left; margin-left:3px; width:330px; height:27px; } .top_login_btn {width:70px; height:26px; margin-bottom:-8px; margin-left:-1px; border-radius:15px; color:#ffffff; font-weight:normal; background:#255ece;} .stw_top_login{width:100px; padding:4px; margin-right:3px; height:28px; border:1px solid #dddddd; background:#ffffff;} .gasipan .subject_title h1 {margin-bottom:5px; letter-spacing:-1px;} .gasipan {display:inline-block; width:100%; padding:50px 0;} .gasipan .left_sec {width:55%; margin-right:5%; float:left;} .gasipan .right_sec {width:39%; float:left; margin-top:-10px;} .gasipan .list_four {display:inline-block; width:100%;} .gasipan .list_four li {width:40%; margin-right:6%; float:left; text-align:center; margin-bottom:3%; border-radius:15px; box-shadow:rgb(100 100 111 / 10%) 0px 5px 25px 0px;} .gasipan .list_four li a {display:block; padding:14px 0; border:1px solid #d3d3d3; border-radius:15px; } .gasipan .list_four li a:hover{border:1px solid #1e8aff; border-radius:15px;} .gasipan .list_four li:nth-child(7),.gasipan .list_four li:nth-child(8) {margin-bottom:0;} .gasipan .list_four li:nth-child(2n) {margin-right:0;} .gasipan .list_four li h1 {color:#000; font-size:17px; letter-spacing:-0.05em; font-weight:600; margin-top:3px;} .gasipan .list_four li:hover h1 {color:#1e8aff;} .classList {display:inline-block; width:100%;} .classList ul li {width:31.3%; float:left; margin-right:3%; margin-bottom:3%; } .classList ul li:nth-child(3n) {margin-right:0;} .classList ul .list01 {} .classList ul .list02 {} .classList ul .list03 {} .classList ul .list04 {} .classList ul .list05 {} .classList ul .list06 {} .classList ul li a:hover{opacity: 0.6;} .classList .txt_wrap {padding:30px 5%; min-height:140px;} .classList ul li h1 {color:#000; font-size:20px; font-weight:600; margin-bottom:8px;} .classList ul li h1.two{color:#000; font-size:18px; font-weight:600; margin-bottom:8px; line-height:22px; margin-top:-10px;} .classList ul li h2 {color:#777; font-size:14px; font-weight:400; letter-spacing:-1px;} .classList .btn_more {width:100%; position:relative;} .classList .btn_more a {display:block; padding:11px 0 11px 5%; border-top:1px solid #eee; transition:all 0.1s;} .classList .btn_more h1 {font-size:15px; font-weight:400; margin-bottom:0; } .classList .btn_more span {display:inline-block; width:45px; height:44px; text-align:center; line-height:44px; background:#000; color:#fff; font-size:25px; position:absolute; right:0; bottom:0;} .classList .btn_more a:hover {background:#000; transition:all 0.1s;} .classList .btn_more a:hover h1 {color:#fff;} .new_class {width:100%;} .new_class .course_1 li {width:23.5%; margin-right:2%; float:left;} .new_class .course_1 li:last-child {margin-right:0;} .new_class .course_1 li img {width:100%;} .new_class .course_1 li a:hover{opacity: 0.6;} .bc-box-out {position:relative; width:100%; height:0; padding-bottom:63%;} .bc-box-in {height:100%; overflow:hidden; width:100%; position:absolute;} .bc-img {width:100%; display:block; margin:0 auto;} .bc-text {background:#fff; padding:10px 10px 30px; border:1px solid #eee;} .bc-text h2{float:right; margin-bottom:14px; color:#e35d6f; font-size:15px; text-align:right; padding:2px 3px; display:inline-block; font-weight:500; transition:all 0.1s;} .bc-text h3 {color:#222; font-size:19px; font-weight:500; margin-top:0px; font-weight:500; letter-spacing:-1px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical; word-wrap:break-word; line-height: 20px;height:20px;} .long_banner {padding:30px 0 0; display:inline-block; width:100%;} .long_banner.main{background:#8abcfc;} .long_banner ul {width:1100px; margin:0 auto;} .long_banner ul li {float:left;} .long_banner ul li.txt_section {width:40%; padding-top:18px;} .long_banner ul li.img_section {width:60%;} .long_banner ul li.img_section img {width:80%;} .long_banner ul li.txt_section span {font-size:48px; color:#FFFFFF; line-height:45px;} .long_banner ul li.txt_section h1 {font-size:26px; color:#FFFFFF;} .long_banner ul li.txt_section h2{margin-top:24px; color:#ffffff; font-size:20px; border:1px solid #ffffff; text-align:left; padding:6px 48px; display:inline-block; font-weight:300; transition:all 0.1s;} /* 메인 - 그외 기타등등 */ .etc_three_box > li {float:left; position:relative; width:31%; margin-right:3%;} .etc_three_box > li:nth-child(2) {width:31%;} .etc_three_box > li:nth-child(3) {width:31%; margin-right:0;} .etc_three_box h3 {text-align:left; border-bottom:1px solid #ddd; padding:0px 0 20px; margin-bottom:20px; color:#000000; font-size:24px; font-weight:600; letter-spacing:-0.025em;} .etc_notice li button {position:absolute; top:5%; right:0; background:none; color:#444; padding-right:0; font-size:14px;} .etc_service .etc_up {margin-bottom:4%;} .etc_service ul li {float:left; width:48%; margin-right:4%; background:#ddd; height:100px; position:relative; border:1px solid #e5e5e5;} .etc_service ul li:last-child {margin-right:0;} .etc_service .etc_up a,.etc_service .etc_down a {display:inline-block; width:100%; height:100%;} .icon_ani.etc_color1 {background:url('/files/images/etc_icon_01.png') no-repeat 50% 35%;} .icon_ani.etc_color2 {background:url('/files/images/etc_icon_02.png') no-repeat 50% 35%;} .icon_ani.etc_color3 {background:url('/files/images/etc_icon_03.png') no-repeat 50% 35%;} .icon_ani.etc_color4 {background:url('/files/images/etc_icon_04.png') no-repeat 50% 35%;} .icon_ani.etc_color1:hover {background:url('/files/images/etc_icon_01_b.png') no-repeat 50% 35%;} .icon_ani.etc_color2:hover {background:url('/files/images/etc_icon_02_b.png') no-repeat 50% 35%;} .icon_ani.etc_color3:hover {background:url('/files/images/etc_icon_03_b.png') no-repeat 50% 35%;} .icon_ani.etc_color4:hover {background:url('/files/images/etc_icon_04_b.png') no-repeat 50% 35%;} .icon_ani h5 {margin-top:65px; color:#666666; font-size:14px; letter-spacing:-0.025em; text-align:center; font-weight:400;} .icon_ani:hover h5 {color:#0059ff;} .guide_number h2 {color:#000000; font-size:47px; letter-spacing:-0.025em; font-weight:500; margin-bottom:15px;} .guide_number h4 {color:#777777; font-size:17px; letter-spacing:-0.025em; font-weight:400;} .guide_number h5 {color:#000000; font-size:20px; letter-spacing:-0.025em; font-weight:600;} .guide_number .no {padding-bottom:25px;} .guide_number .list {padding-bottom:25px;} .guide_number .list:last-child {padding-bottom:0;} /* 메인 배너 텍스트 */ .main_tit_2022 {padding-left: 32px; display: block;} .main_tit_2022 > .pc {font-size:30px; font-weight: 400!important;} .main_tit_2022 > .pc > b {font-size:38px; color:#481099!important;display: block;} .main_tit_2022 > .mobile {font-size:30px;} .main_tit_2022 > .mobile > b {color:#481099!important;display: block;} .main_des_2022 {padding-left: 32px; display: block;} .main_des_2022 > .pc {font-weight: 400!important; font-size: 18px; line-height: 1.4em; } .main_des_2022 > .mobile {font-weight: 400!important; font-size: 18px; line-height: 1.4em;} .bnr_btn_more {background: #481099; padding: 8px 50px 12px; position: relative; border-radius: 30px; bottom: -30px;} .bnr_btn_more:hover {background: #360f6d; box-shadow:0 10px 10px rgba(200,50,200,0.1); transition: 0.3s; } .bnr_btn_more span {font-size:14px; font-weight: 400; margin-left:-20px; color: #fff;} .bnr_btn_more span i{border-top: 2px solid #fff; border-right: 2px solid #fff; margin-left: 10px; transform: rotate(45deg) translateY(-50%); position: absolute; top: 50%; width: 8px; height: 8px;} @media screen and (max-width:420px) { /* 메인 모바일 배너 텍스트 */ .swiper-slide{background-position:right 34% center!important; background-repeat: no-repeat;} .swiper-slide::before{content: ''; width: 100%; height: 440px;background-image: linear-gradient(90deg,rgba(255,255,255,0.8), rgba(255,255,255,0)); position: absolute;} .main_tit_2022 {padding-left: 0px!important;} .main_des_2022 {padding-left: 0px!important;} } /* 전체메뉴 */ .full_menu_box{margin: 0 auto;width:100%; max-width:1300px;} .sticky {position: fixed;top: 0;width: 100%;} #navbar {z-index: 99999; background: linear-gradient(to bottom, #f9fbfd 0%, #eef3f8 100%); border-top: 1px solid #e7edf4; border-bottom: 1px solid #d8e1ea;} p.full_m_tit{ text-align:center; color:#000000; font-size:25px; } .menu_box{margin: 0 auto; background:#ffffff; display:inline-block;} .menu_box01{float:left; width:33%;} .menu_box02{float:left; width:33%;} .menu_box03{float:left; width:33%;} .menu_box04{float:left; width:32%;} .menu_box05{float:left;width:32%;} .menu_box06{float:left;width:36%;} ul.menu {margin:4%; width:96%; border: 1px solid #b0cfeb; text-align:left;} li.menu_tit{display:inline-block; width: 100%;color:#1a67af; text-align:center; background:#e4ebfb; font-size:16px; font-weight:bold; padding:2%;letter-spacing:-1px; } li.menu_stit{display:inline-block; width: 100%;color:#000000; font-size:13px; font-weight:400; padding:2px 0px 2px 6px; letter-spacing:-1px; } li.menu_txt{display:inline-block; width: 100%;color:#1a67af; font-size:13px; font-weight:400;padding-left:5%; letter-spacing:-1px; } span.menu_stxt{float:left; margin-right:10px;} span.menu_stxt_left{float:left; margin-right:10px; min-width:120px;} /* /web/734 등 서브 — 개설강좌 전체보기 (introduce/sub_all_menu.html) */ .course-all-menu-section { margin-top: 6px; } .course-all-menu-section .sub-title .subject, .course-all-menu-section .sub-title .subject span { font-size: 29px; letter-spacing: -0.7px; } .course-all-menu-section p.full_m_tit { margin: 14px 0 18px; font-size: 30px; font-weight: 700; letter-spacing: -0.9px; color: #0f2d56; } .course-all-menu-section .menu_box { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 22px; margin: 0; width: 100%; background: transparent; } .course-all-menu-section .menu_box + .menu_box { margin-top: 4px; } .course-all-menu-section .menu_box01, .course-all-menu-section .menu_box02, .course-all-menu-section .menu_box03, .course-all-menu-section .menu_box04, .course-all-menu-section .menu_box05, .course-all-menu-section .menu_box06 { float: none; width: auto; flex: 1 1 calc(33.333% - 15px); min-width: 280px; } .course-all-menu-section .menu_box04, .course-all-menu-section .menu_box05 { flex-basis: calc(30% - 15px); } .course-all-menu-section .menu_box06 { flex-basis: calc(40% - 15px); } .course-all-menu-section ul.menu { margin: 0 0 18px; width: 100%; padding-bottom: 10px; border: 1px solid #d7e3f5; border-radius: 14px; background: linear-gradient(180deg, #ffffff 0%, #fcfdff 100%); box-shadow: 0 8px 20px rgba(20, 62, 118, 0.08); overflow: hidden; transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease; } .course-all-menu-section ul.menu:hover { transform: translateY(-4px); border-color: #9ebde8; box-shadow: 0 14px 28px rgba(20, 62, 118, 0.16); } .course-all-menu-section li.menu_tit { display: block; width: 100%; margin: 0; padding: 12px 14px 11px; background: linear-gradient(120deg, #edf4ff 0%, #dbe8ff 100%); border-bottom: 1px solid #cfe0fa; color: #114a8a; font-size: 21px; font-weight: 700; letter-spacing: -0.6px; text-align: center; } .course-all-menu-section li.menu_stit, .course-all-menu-section li.menu_txt { display: block; width: 100%; padding: 8px 14px 8px 16px; font-size: 15px; line-height: 1.56; letter-spacing: -0.15px; word-break: keep-all; } .course-all-menu-section li.menu_stit { color: #122842; font-weight: 500; } .course-all-menu-section li.menu_txt { color: #335f97; padding-left: 22px; } .course-all-menu-section ul.menu > li.menu_stit:first-of-type, .course-all-menu-section ul.menu > li.menu_txt:first-of-type { padding-top: 12px; } .course-all-menu-section ul.menu > li.menu_stit:last-of-type, .course-all-menu-section ul.menu > li.menu_txt:last-of-type { padding-bottom: 12px; } .course-all-menu-section li.menu_stit a, .course-all-menu-section li.menu_txt a, .course-all-menu-section .menu_stxt a, .course-all-menu-section .menu_stxt_left a { display: inline-block; color: #1b4378; transition: color 0.2s ease, transform 0.2s ease, text-shadow 0.2s ease; } .course-all-menu-section li.menu_txt a { color: #2a5a98; } .course-all-menu-section li.menu_txt a:hover, .course-all-menu-section li.menu_stit a:hover, .course-all-menu-section .menu_stxt a:hover, .course-all-menu-section .menu_stxt_left a:hover { color: #0a3a75; transform: translateX(4px); text-shadow: 0 0 0 rgba(0, 0, 0, 0); } .course-all-menu-section .menu_stxt, .course-all-menu-section .menu_stxt_left { float: none; display: inline-block; margin: 2px 12px 2px 0; } .course-all-menu-section .menu_stxt_left { min-width: 132px; } @media screen and (max-width: 1200px) { .course-all-menu-section .menu_box01, .course-all-menu-section .menu_box02, .course-all-menu-section .menu_box03, .course-all-menu-section .menu_box04, .course-all-menu-section .menu_box05, .course-all-menu-section .menu_box06 { flex-basis: calc(50% - 11px); min-width: 260px; } } @media screen and (max-width: 768px) { .course-all-menu-section .sub-title .subject, .course-all-menu-section .sub-title .subject span { font-size: 24px; } .course-all-menu-section p.full_m_tit { font-size: 24px; margin-bottom: 14px; } .course-all-menu-section .menu_box { gap: 14px; } .course-all-menu-section .menu_box01, .course-all-menu-section .menu_box02, .course-all-menu-section .menu_box03, .course-all-menu-section .menu_box04, .course-all-menu-section .menu_box05, .course-all-menu-section .menu_box06 { flex-basis: 100%; min-width: 0; } .course-all-menu-section li.menu_tit { font-size: 19px; } .course-all-menu-section li.menu_stit, .course-all-menu-section li.menu_txt { font-size: 14px; } } span.fullmenu-tag {font-size: 13px; margin-left:0px;cursor: pointer;position: absolute;z-index: 9999;padding: 5px 12px; border-radius:15px; border: 1px solid #255ece;color: #fff; background:#255ece; margin-top: 10px;} /* 상단 "개설강좌 전체보기" */ #header .section > a.fullmenu-link { text-decoration: none; } #header .section > a.fullmenu-link .fullmenu-tag { overflow: visible; isolation: isolate; box-shadow: 0 5px 14px rgba(37, 94, 206, 0.18); transition: transform 0.3s ease, background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease; } #header .section > a.fullmenu-link .fullmenu-tag::before { content: ''; position: absolute; left: -45%; top: -80%; width: 34%; height: 260%; background: rgba(255, 255, 255, 0.32); transform: rotate(28deg) translateX(0); transition: transform 0.55s ease; z-index: 0; pointer-events: none; } #header .section > a.fullmenu-link:hover .fullmenu-tag::before { transform: rotate(28deg) translateX(520%); } #header .section > a.fullmenu-link:hover .fullmenu-tag { background:#1e4fa8; border-color: #1e4fa8; box-shadow: 0 9px 22px rgba(37, 94, 206, 0.28); transform: translateY(-2px); } .overlay {height: 0%;width: 100%;position: fixed;z-index: 1;top: 0;left: 0;background-color: rgb(0,0,0);background-color: rgba(0,0,0, 0.6);overflow-y: hidden;transition: 0.5s;z-index: 999999;} .overlay-content {position: relative; top: 15%; width: 100%; text-align: center; margin-top: 30px; padding: 0 5%;} .overlay-content ul {width: 14.28571428571429%; float: left;} .overlay a {padding: 2px 2px;text-decoration: none;display: block;transition: 0.3s;} .overlay a .menu-title {font-size:18px; font-weight: 400; color: #fff; background: #bb1212; padding: 2px 0;} .overlay a:hover, .overlay a:focus {color: #1a67af;} .overlay .closebtn {position: absolute;top: 20px;right: 45px;font-size: 60px;} @media screen and (max-height: 450px) { .overlay {overflow-y: auto;} .overlay a {font-size: 20px} .overlay .closebtn { font-size: 40px; top: 15px; right: 35px; } } /***********메인************/ .div_center {text-align:center;} .viewpoint_banner {width:100%; padding:80px 0;} .viewpoint_banner h1.section_tit_a {text-align:center; margin-bottom:40px; font-size:27px; font-weight:500;} .viewpoint_banner h1.section_tit_a {position:relative; display:inline-block;} .viewpoint_banner h1.section_tit_a:after {content:"";width: 100%;height: 10px;display: inline-block;background: #ffec9c; position: absolute; bottom:7px; left:0; z-index:-1;} .viewpoint_banner li.box {float:left; padding-top:80px; position:relative; margin-right:20px; width:calc(25% - 15px);text-align:center;background-size:cover; background-position:top; min-height:305px;transition:all 0.1s;} .viewpoint_banner li.box:last-child {margin-right:0;} .viewpoint_banner li.box img {width:65px;} .viewpoint_banner li.box h1.tit {color:#fff; font-size:30px; padding:8px 0; letter-spacing:1px;transition:all 0.1s; } .viewpoint_banner li.box:hover .tit{color:#f7ecc1;} .viewpoint_banner li.box1 {background-image:url('/files/images/main_banner_01_bg.jpg');} .viewpoint_banner li.box2 {background-image:url('/files/images/main_banner_02_bg.jpg');} .viewpoint_banner li.box3 {background-image:url('/files/images/main_banner_031_bg.jpg'); padding-top:100px;} .viewpoint_banner li.box4 {background-image:url('/files/images/main_banner_04_bg.jpg');} .viewpoint_banner li.box3 img {margin-bottom:9px;} /* 추천강좌&신규과정 공통 */ .bs-title, .ns-title {text-align:center; font-size:40px; color:#333; font-weight:500;} .bs-border-line, .ns-border-line {width:39px; height:2px; margin:10px auto 23px;} /* 컨텐츠 - 추천강좌 */ .section-best-subject {padding:60px 0px;} .bs-txt {color:#666; font-size:17px; text-align:center;} .bs-border-line {background:#ffb92e;} /* 컨텐츠 - 신규과정 */ .section-new-subject {padding:60px 0;} .ns-border-line {background:#1C5C47;} .course_1,.course_2 {margin-top:10px;} .bs-ss-box {height:0; overflow:hidden; padding-bottom:68%; position:relative;} .bs-ss-box img {width:100%; border-radius:10px;} .bs-source-subjcet{height:390px;} .bs-ss-text, .ns-ss-text {padding:0px 10px; min-height:20px; margin-top:15px;} .bs-ss-text2, .ns-ss-text2 {padding:0px 10px; min-height:58px; margin-top:0px; margin-bottom:0px;} .bs-ss-button ul li, .ns-ss-button ul li {width:100%;} .bs-ss-button-r, .bs-ns-button-r {font-size:14px; padding:10px 0; text-align:center; transition:all 0.2s;} .bs-ss-button-l, .ns-ss-button-l{background:#26485f; color:#fff;} .bs-ss-all:hover, .ns-ss-all:hover{} .course_1:after, .course_2:after {content:''; display:block; clear:both;} .course_1 > li, .course_2 > li {float:left; width:23.5%; margin-right:2%; margin-bottom:20px;} .course_1 > li:nth-child(4n), .course_2 > li:nth-child(4n) {margin-right:0;} .course_1 > li:last-child, .course_2 > li:last-child {margin-right:0;} .bs-ss-button,.bs-ns-button {height:40px; width:100%;} .bs-ss-text h1, .ns-ss-text h1 {font-size:20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical; word-wrap:break-word; line-height: 25px;height:29px;} .bs-ss-text h2, .ns-ss-text h2 {font-size:15px; color:#888; font-weight:400; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical; word-wrap:break-word; line-height: 18px;height:37px; margin-top:3px;} .main_teacher {float:left; font-size:16px; font-weight:normal; color:#888;} .main_price {float:right; font-size:20px; color:#fa2828; letter-spacing:-1px; line-height:24px;} .main_price span.salePersent{color:#6b90dc; font-size:16px;} .main_price span.salePrice{color:#888888; font-size:16px; text-decoration:line-through;} .bs-ss-button-r {background:#ffec9c; color:#333;} .bs-ss-button-r:hover {background:#ffb92e; color:#fff;} .bs-ss-all{border:1px solid #eeeeee; border-radius:11px;} .bs-ss-all:hover {opacity: 0.4;} .bs-ns-button-r {background:#ecf3f0; color:#333;} .bs-ns-button-r:hover {background:#1C5C47; color:#fff;} .ns-ss-all{border:1px solid #eeeeee; border-radius:11px;} .ns-ss-all:hover {opacity: 0.4;} .class_total{margin:5px} .starImg{margin:5px} /* 컨텐츠 - 세미나리스트 */ .seminar_section {display:inline-block; width:100%; background:url('/files/images/main_seminar_bg.jpg') center top; padding:100px 0;} .seminar_section .tit {color:#fff; text-align:center; font-size:26px; margin-bottom:40px;} .seminar_section ul li.box {width:calc(25% - 20px); float:left; min-height:200px; background:#fff; margin-right:20px; margin-bottom:20px; padding:25px; position:relative;} .seminar_section ul li.box:after {content:""; position:absolute; right:0; bottom:0; display:inline-block; width:20px; height:20px;background:#fa2828; transition:all 0.1s;} .seminar_section ul li.box:hover:after {width:50%;} .seminar_section ul li.box:nth-child(4) {margin-right:0;} .seminar_section ul li.empty {background:none;} .seminar_section ul li.empty:after {display:none;} .seminar_section ul li.titBox {background:#fa2828; padding:25px 25px 0 25px;} .seminar_section ul li.titBox h2 {font-size:25px; color:#fff; letter-spacing:-2px; margin-bottom:15px;} .seminar_section ul li.titBox .titBtn {color:#fff; border:1px solid #fff; font-size:20px; text-align:center; padding: 5px 0; transition:all 0.1s;} .seminar_section ul li.titBox .titBtn:hover {color:#fa2828; background:#fff;} .seminar_section ul li.titBox .titBtn a {display:block;} .seminar_section ul li.box ul.semi_list li {font-size:18px; letter-spacing:-2px; line-height:24px; padding-left:12px; position:relative;} .seminar_section ul li.box ul.semi_list li:before {content:"·"; position:absolute; left:0;top:0;} /* 컨텐츠 - 메인교재리스트 */ .main-best-book {padding-top:80px;} .main-best-book .bb-ui {display:table; width:100%;} .main-best-book .bb-ui > li {width:80%; border:1px solid #ddd; border-left:0; padding:30px 10px 30px 30px; display:table-cell; vertical-align:top;} .main-best-book .bb-ui > li:first-child {width:20%; border-left:1px solid #ddd;} .main-best-book .bb-ui-left {padding-top:40px; font-size:18px;} .main-best-book .bb-ui-left .tablinks {margin-bottom:10px;} .main-best-book .bb-ui-left .active {border-bottom:5px solid #000; margin-bottom:10px; width:70%; padding-bottom:0; color:#333; font-weight:500;} .main-best-book .bb-a {cursor:pointer;} .main-best-book .bb-a:hover {color:#fa2828} .main-best-book .tabcontent {padding:0;} .nb-img-box {position:relative; width:100%; height:0; padding-bottom:120%;} .nb-img-out {height:100%; overflow:hidden; width:100%; position:absolute;} .nb-img-in {width:100%; height:100%; display:block; margin:0 auto; border:1px solid #ddd;} .main-best-book .book_tit {text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; width:100%; overflow:hidden; font-size:16px; padding-top:15px; font-weight:400;} .main-best-book .book_price {font-size:18px; padding-top:10px; font-weight:400; color:#fa2828;} @media (max-width: 834px) { .main-best-book .bb-ui > li,.main-best-book .bb-ui > li:first-child {width:100%; display:table;} .main-best-book .bb-ui-left {padding-top:0;} .main-best-book .bb-ui > li {padding:0px 10px 20px; border:0;} .main-best-book .bb-tap {padding-top:15px;} .main-best-book .bb-ui > li:first-child {border:0} .main-best-book .bb-a {font-size:15px;} .main-best-book .bb-ui-left .tablinks {width:calc(100% / 3); float:left; text-align:center; padding-bottom:5px;} } @media (max-width: 480px) { .main-best-book .bb-a {font-size:14px;} } /* 컨텐츠 - 게시판&서브버튼 */ .section-board_button {padding:80px 0; height:500px;} .board_button > ul > li {width:66%;} .board_button > ul > li:last-child{width:33%;} .button > ul > li {margin-left:3%; width:47%; float:left; } .button > ul > li:last-child {margin-left:3%; width:97%;} .board-menu {display:inline-block; margin-left:2%; width:96%; position:relative; margin-bottom:3px;} .board-menu > ul {border-bottom:1px solid #e5e5e5; height:44px;} .board-menu > ul > li {border-top-left-radius:10px; border-top-right-radius:10px; width:33.3%; float:left; height:44px; line-height:44px; font-weight:600; text-align:center; font-size:18px; color:#333; background:#f7f7f7; border:1px solid #e5e5e5; } #issues > a {color:#fff;} .board-menu > ul > li > a {color:#61869e;} .board-menu > ul > li + li {border-left:0; border-top-right-radius:10px;} #view {width:100%; max-width:60px; font-size:30px; background:#ffb92e; color:#fff; height:60px; overflow:hidden; position:absolute; right:0; top:0;} .main_board {float:left; width:100%; border:1px solid #d3d3d3; padding:1.8% 0 2%; border-radius:15px; box-shadow:rgb(100 100 111 / 10%) 0px 5px 25px 0px;} .bbody {width:99.9%; } .btext {position:relative;} .btext > ul > li {padding:0px 25px 4px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .btext a{float:left; width:350px; font-size:14px;} .btext a:hover{color:#1e8aff;} .btext span.no {float:left; width:70px; font-size:13px;} .btext span.nick {float:left; width:90px; font-size:13px;} .btext span.date {float:right; width:95px; font-size:13px;} .bmenus {cursor:pointer;} .bmenus.active {background:#fff; border-bottom:0; border-top-left-radius:10px; border-top-right-radius:10px;} .add-button {position:absolute; background:#000; top:0; right:0; width:10.8%;} .boxnotice .btext > ul > li {padding:3px 25px 4px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .boxnotice .btext a{float:left; width:460px; font-size:14px;} .boxnotice .btext a:hover{color:#1e8aff;} .boxnotice .btext span.no {float:left; width:70px; font-size:13px;} .boxnotice .btext span.nick {float:left; width:90px; font-size:13px;} .boxnotice .btext span.date {float:right; width:95px; font-size:13px;} .button{display:inline-block;} .button2 {margin-top:0px; background:#f7f7f7;} .guide_info {padding:14px 25px; border:1px solid #e5e5e5; width:100%; position:relative;} .b-title {font-size:22px; color:#333; border-bottom:1px solid #e5e5e5; padding-bottom:7px;} .guide_info .b-text .num {font-size:30px; letter-spacing:-.5px; font-weight:600; margin-top:15px;} .guide_info .b-text .text_info {font-size:14px; letter-spacing:-.5px; margin-top:20px; color:#777} .b-text img {position:absolute; bottom:15px; right:25px;} .guide_info .location_btn {display:inline-block; background:#333; margin-top:33px; margin-bottom:10px; border:1px solid #333; transition:all 0.1s; } .guide_info .location_btn a {color:#fff; display:block;padding:8px 45px; } .guide_info .location_btn:hover {background:#fff;} .guide_info .location_btn:hover a {color:#333;} .lecturestudy li.finishstudy {background:#fff;} .lecturestudy li.finishstudy .lectureTxt h2, .lecturestudy li.finishstudy .lectureTxt p, .lecturestudy li.finishstudy .lectureTxt div {color:#000;} @media all and (max-width: 1100px) { .section {width:95%;} /* 컨텐츠 - 세미나리스트 */ .seminar_section ul li.box {width:calc(33% - 20px);} .seminar_section ul li.empty {display:none;} .seminar_section ul li.box:nth-child(4) {margin-right:20px;} .seminar_section ul li.box ul.semi_list li {font-size:17px;} .seminar_section ul li.titBox {padding:20px 20px 0 20px;} .seminar_section ul li.box {padding:17px;} .button > ul > li {width:100%; margin:0;} .board_button > ul > li {width:100%;} .board_button > ul > li:last-child {width:100%;} } /* Tablet Device */ @media all and (min-width: 768px) and (max-width: 1024px) { /* 컨텐츠 - 추천강좌&신규과정 공통 */ .bs-title, .ns-title {font-size:22px;} .bs-ss-title, .ns-ss-title {font-size:20px;} .navy-box {font-size:16px; width:85%;} .course_1 > li, .course_2 > li {width:49%; margin-right:2%;} .course_1 > li:nth-child(even), .course_2 > li:nth-child(even) {margin-right:0;} /* 컨텐츠 - 신규과정 */ .section-new-subject::before {height:70%;} /* 컨텐츠 - 배너버튼 */ .long-img-center {top:26px; left:100px;} .long-text {top:50px; right:150px;} .short-text {position:absolute; top:50px; left:30px;} } @media all and (max-width: 1024px) { .viewpoint_banner li.box {width:calc(50% - 5px); margin:0; background-position:center;} .viewpoint_banner li.box:nth-child(4) {background-position:top;} .viewpoint_banner li.box:nth-child(1),.viewpoint_banner li.box:nth-child(3) {margin-right:5px;} .viewpoint_banner li.box:nth-child(2),.viewpoint_banner li.box:nth-child(4) {margin-left:5px;} .viewpoint_banner li.box:nth-child(1),.viewpoint_banner li.box:nth-child(2) {margin-bottom:10px;} .viewpoint_banner li.box3 {padding-top:80px;} } @media all and (max-width: 768px) { .viewpoint_banner {padding:40px 0;} .viewpoint_banner li.box {min-height:260px; border:0;} .viewpoint_banner li.box .tit {font-size:25px;} .viewpoint_banner li.box img {width:55px;} .viewpoint_banner li.box:nth-child(1), .viewpoint_banner li.box:nth-child(2),.viewpoint_banner li.box:nth-child(3), .viewpoint_banner li.box:nth-child(4) {margin:0; width:calc(50% - 4px);} .viewpoint_banner li.box:nth-child(1), .viewpoint_banner li.box:nth-child(3) {margin-right:2px;} .viewpoint_banner li.box:nth-child(2), .viewpoint_banner li.box:nth-child(4) {margin-left:2px;} .viewpoint_banner li.box:nth-child(1), .viewpoint_banner li.box:nth-child(2) {margin-bottom:4px;} .long_banner {padding:30px 0;} .long_banner ul {width:100%;} .long_banner ul li.txt_section h1 {font-size:30px;} .long_banner ul li.txt_section {text-align:left; width:60%;} .long_banner ul li.img_section {float:right; width:40%; text-align:right; margin-top:15px;} .long_banner ul li.img_section img {width:100%;} .long_banner ul li.txt_section span {font-size:22px;} /* 컨텐츠 - 세미나리스트 */ .seminar_section ul li.box {width:calc(50% - 10px);} .seminar_section ul li.box:nth-child(2),.seminar_section ul li.box:nth-child(4),.seminar_section ul li.box:nth-child(7),.seminar_section ul li.box:nth-child(9) {margin-right:0;} .seminar_section .tit {font-size:20px; width:95%; margin:0 auto 30px;} } @media only screen and (max-width : 480px){ #myCarousel {display:none;} #myCarousel_mobile {display:inline-block;} #myCarousel_mobile > .bx-wrapper {margin:0;} /* 컨텐츠 - 추천강좌&신규과정 공통 */ .bs-title, .ns-title {font-size:30px;} .bs-source-subjcet > ul > li, .ns-source-subjcet > ul > li {width:100%;} .open-source-background {top:410px;} .bs-ss-title, .ns-ss-title {font-size:18px;} .navy-box {width:85%;} .section-best-subject {padding:30px 0 60px;} .section-new-subject {padding:30px 0 60px;} .course_1 > li, .course_2 > li {width:100%; margin-right:0;} /* 컨텐츠 신규과정 */ .section-new-subject::before {height:90%;} /* 컨텐츠 - 세미나리스트 */ .seminar_section ul li.box {width:80%; margin:0 auto 10px; float:none; min-height:auto;} .seminar_section ul li.box:nth-child(2),.seminar_section ul li.box:nth-child(4),.seminar_section ul li.box:nth-child(7),.seminar_section ul li.box:nth-child(9) {margin-right:auto;} .seminar_section ul li.titBox h2 {font-size:20px;} .seminar_section ul li.titBox .titBtn {font-size:17px;} /* 컨텐츠 - 배너버튼 */ .section-banner-button > .section::after{content:''; display:block; clear:both;} .long-img-center {top:30px; left:200px; z-index:1;} .long-img-center img {width:80%;} .long-text {top:55px; left:40px; right:0;} .bb h2 {font-size:24px;} .bb p {margin-top:10px;} .banner-button-short > ul > li {clear:both; width:100%;} .banner-button-short > ul > li:nth-child(2) {margin:0; margin:20px 0;} .long-text > p {margin-top:20px;} .short-text {top:30px;} .short-box1, .short-box2, .short-box3 {height:150px;} /* 컨텐츠 - 게시판&서브버튼 */ .board_button > ul > li {width:100%;} .board_button > ul > li:last-child {width:100%;} .button > ul > li {margin-left:0; margin-top:20px;} .guide_info .b-text .num {font-size:18px;} .guide_info .b-text .text_info {font-size:13px;} } @media only screen and (max-width : 320px){ .long-text {top:50px; left:25px; right:0;} .long-text p {padding-right:20px; font-size:15px;} .short-text {left:25px;} .short-text p {font-size:15px;} } /* Smartphones (landscape) */ @media only screen and (min-width: 480px) and (max-width:834px){ #myCarousel {display:none;} #myCarousel_mobile {display:inline-block;} #myCarousel_mobile > .bx-wrapper {margin:0;} /* 컨텐츠 - 추천강좌&신규과정 공통 */ .bs-title, .ns-title {font-size:20px;} .bs-source-subjcet > ul > li, .ns-source-subjcet > ul > li {width:100%; float:left;} .bs-source-subjcet > ul > li:nth-child(2), .ns-source-subjcet > ul > li:nth-child(2) {margin-right:0;} .open-source-background {top:410px;} .bs-ss-title, .ns-ss-title {font-size:18px;} .navy-box {font-size:16px; width:85%;} .course_1 > li, .course_2 > li {width:49%; margin-right:2%;} .course_1 > li:nth-child(even), .course_2 > li:nth-child(even) {margin-right:0;} /* 컨텐츠 - 신규과정 */ .section-new-subject::before {height:75%;} /* 컨텐츠 - 배너버튼 */ .long-img-center {top:50px; left:50px;} .long-img-center img {width:70%;} .long-text {top:60px; right:80px;} .bb h2 {font-size:22px;} .bb p {font-size:14px;} .short-text {top:60px; left:10px;} /* 컨텐츠 - 게시판&서브버튼 */ .button2 {margin:0;} .board_button > ul > li {width:100%;} .board_button > ul > li:last-child {width:100%;} .button > ul > li {margin-left:0; margin-top:20px; float:left; width:100%;} .button > ul > li:last-child {padding-right:0;} } /* ipad Pro 10.5 */ @media only screen and (min-width:481px) and (max-width:834px) { .long-img-center {top:50px; left:50px;} .long-img-center img {width:70%;} .long-text {right:100px;} } /* 메인페이지 */ .block1, .block2, .block3, .block4 {width: 50%; color: #fff; padding: 30px; position: relative; float: left;} .block1 {min-height: 284px; background: #9acc6d;} .block1 h3, .block3 h3 {color: #fff;} button.more {position: absolute; right: 30px; padding: 0; background: none; font-size: 42px; font-weight: 200; top: 20px;} .block2 {min-height: 284px; background: url(/files/images/block2-bg.jpg) no-repeat center top;} .block3 {min-height: 194px; background: #434343;} .block4 {min-height: 194px; background: url(/files/images/block4-bg.jpg) no-repeat center top; cursor: pointer;} .main-gray {padding: 80px 0; background: #f7f7f8;} .main-board {background: #fff; height: 330px;} .main-board .latest {float: left; width: 50%; position: relative; padding: 40px; } button.more2 {position: absolute; right: 40px; background: url(/files/images/more2.png) no-repeat center top; top: 40px; width: 23px; height: 23px; padding: 0;} ul.community {display: inline-block; width: 100%;} ul.community li {float: left; width: 25%; padding: 60px 0; text-align: center;} /* 로그인/회원가입 */ .box_btn > button {background: #000000; height: 69px; border-radius: 0;} button.find-id, button.join {padding: 10px 19px; height: 32px;} button.join {color: #af0d23;} .sns_login {width:250px; margin: 0 auto;} .naverlogin {width: 250px; height: 50px; color: #1dc700; padding-left: 67px; margin: 2px 0;} .kakaologin {width: 250px; height: 50px; background: url(/files/default-img/login_kakao.png) no-repeat top center; color: #412e34; padding-left: 67px; margin: 2px 0;} .login_sbox .box_btn {text-align: center;} .login_sbox .box_id {width: auto;} .web_login {margin-bottom: -1px; width: 160px;} .login_sbox {width: auto;} #login_box {width: 100%; max-width: 630px; padding: 0px 0 30px; border-radius: 2px; background: #ffffff; border:1px solid #dddddd; margin:0px auto 40px;} .login-title {color: #196dbe;font-size: 28px;font-weight: 600;margin: 30px auto; text-align: center; width:auto;} .logincheck {padding: 10px 0;} .loginForm {width:250px;} .box_member {margin:0 auto;} .idpw_box {border: 0; background: none;} .idpw_box li.id_find, .idpw_box li {float: none; width: 100%;} .form_context {margin:0; font-size: 12px; padding: 0 15%; color: #ff0000; line-height: 1.2;} .find_form .small_txt {margin: 0;} .find_form fieldset {margin:0; padding: 0; border: 0;} .btn-confirm {background: #000;} .stit_all {background: none;} button.cancel {background: #969696;} #member_join {margin: 0; border: 0; text-align: center; height: auto;} .member_box {float: none; width: 100%;} .box_title {font-size: 24px; color: #000; font-weight: 800; margin-bottom: 20px;} .box_text {font-size: 13px; line-height: 1.5;} /* 통합검색 */ .search {width:100%; max-width:800px; margin:50px auto;} .tword-box {text-align: center; margin-bottom: 50px; position: relative;} .serch-title {display: none;} input.tword {display: inline-block; width: 100%; max-width: 474px;height: 45px;border: 2px solid #af0d23; background-color:#fff;} input.btn-tword {position: relative; top: -2px; left: -5px;} li.search-img {float:left;width:20%;} li.search-content {float:left;width:80%;} /* 나의 학습강좌 */ .my-class .block-thumb {width: 150px;} .detail-top .right th, #lec-list table th, button {font-weight: 500;} button.large {font-size: 13px;} .contable .subject {font-size:15px; color:#333;} .table-title .section-box .ul-1 li {line-height:initial; font-size:15px;} .table-textlist .section-box .ul-1 > li {line-height:initial; font-size:15px;} .dtable {font-size:14px;} @media all and (max-width: 640px) { .table-textlist .section-box .ul-1 > li,.contable .subject {font-size:13px;} } /* 모바일 */ .sub-body.mobile .bar_log {padding:20px 0; border:5px solid #eee; text-align:center; margin-top:20px;} .sub-body.mobile .bar_log img {width:700px;} /* 기관소개 */ .sub-body.about .top_tit { font-size:33px; text-align:center; font-weight:400; letter-spacing:-.5px; } .sub-body.about .top_tit em {font-weight:500; font-size:1.1em;font-style:normal} .sub-body.about .bar_log {padding:20px 0; border:20px solid #eee; text-align:center; margin-top:40px;} .sub-body.about .bar_log img {width:250px;} .sub-body.about .txt_info_a {font-size:22px; text-align:center; letter-spacing:-.5px; margin: 40px 0;} .sub-body.about .img_txt {width:100%; display:inline-block;} .sub-body.about .img_txt ul li {width:50%; float:left;} .sub-body.about .img_txt ul li .txt {padding-top:120px;} .sub-body.about .img_txt ul li .txt h1 {font-size:24px; } .sub-body.about .img_txt ul li .txt .mark {position:relative; z-index:0; display:inline-block;} .sub-body.about .img_txt ul li .txt .mark:before {content:""; position:absolute; width:100%; height:12px; background:rgba(24,92,71,0.3); left:0; bottom:3px; z-index:-1;} .sub-body.about .img_txt ul li .txt h2 {font-size:20px; letter-spacing:-.5px;font-weight:400;} .sub-body.about .img_txt.bottom_space {margin-bottom:20px;} .long_banner.about { background-image:url('/files/images/sub_01_long_bg.jpg'); letter-spacing:2px; margin-top:80px; } .long_banner.about h1 {color:#625123; font-size:25px; line-height:30px;} .long_banner.about h2 {color:#fff; font-size:23px; margin-top:5px;} .sub-subject_a {font-size:24px; margin:80px 0 40px;; padding-left:15px; position:relative;} .sub-subject_a:before {content:""; display:inline-block; width:10px; height:10px; border-radius:50%; background:#185c47; position:absolute; left:0; top:50%; margin-top:-5px;} .object_section p, .major_section p {font-size:21px; margin-bottom: 20px; letter-spacing:-.5px;} .sub-body.about .img_txt ul li .txt .say {color:#f6cc2f; font-size:34px; position:relative; padding-left:45px;} .sub-body.about .img_txt ul li .txt .say .left_img {margin-top:-2px; position:absolute; top:-10px; left:0;} .sub-body.about .img_txt ul li .txt p {font-weight:800;} .sub-body.about .img_txt ul li .txt.bottom {padding-top:90px;} .sub-body.about .img_txt.say {margin-top:20px;} .sub-body.about .img_txt ul li .txt.bottom p {margin-bottom:0;} .sub-body.about ul.major_list {width:100%; display:inline-block;} .sub-body.about ul.major_list li {width:calc(50% - 10px); float:left; background:#f6f6f6; margin-right:20px; padding:20px 30px; border-radius:10px;} .sub-body.about ul.major_list li:nth-child(2), .sub-body.about ul.major_list li:nth-child(4) {margin-right:0;} .sub-body.about ul.major_list li:nth-child(1), .sub-body.about ul.major_list li:nth-child(2) {margin-bottom:20px;} .sub-body.about ul.major_list li:nth-child(3) {min-height:135px} .sub-body.about ul.major_list li .sub_01_icon {width:80px; height:80px; border-radius:50%; float:left; border:1px solid #e2e2e2; background:#fff; text-align:center; line-height:80px;} .sub-body.about ul.major_list li .sub_01_icon img {width:80%;} .sub-body.about ul.major_list li p {font-size:18px; padding-left:95px; padding-top:15px;} .sub-body.about ul.major_list li p.topnone {padding-top:0;} @media all and (max-width: 1100px) { .sub-body.about .img_txt ul li {width:100%;} .sub-body.about .img_txt ul li .txt {padding-top:40px;} .sub-body.about .img_txt {margin-bottom:80px;} .sub-body.about .img_txt.bottom_space {margin-bottom:40px;} .long_banner.about h1,.long_banner.about h2 {text-align:center;} .sub-body.about .img_txt.say ul li {text-align:left;} .sub-body.about .img_txt ul li .txt.bottom {padding:20px 0 40px;} .sub-body.about .img_txt.say {margin-top:0; margin-bottom:0;} .object_section p, .major_section p {font-size:18px;} } @media all and (max-width: 834px) { .sub-body.about .top_tit {font-size:25px;} .sub-body.about .txt_info_a {font-size:18px;} .long_banner.about h1 {font-size:20px; text-align:left;} .long_banner.about h2 {font-size:17px; text-align:left;} .sub-body.about ul.major_list li {width:100%; margin:0;} .sub-body.about ul.major_list li:nth-child(3) {min-height:auto; margin-bottom:20px;} .sub-body.about .img_txt ul li .txt h2 {font-size:17px;} .sub-body.about .img_txt ul li img {width:100%;} .sub-body.about .img_txt.say ul li img {width:auto;} .sub-body.about .img_txt.say ul li img.img_im {width:100%;} .long_banner.about {margin-top:20px;} .sub-body.about .img_txt {margin-bottom:20px;} } @media all and (max-width: 640px) { .sub-body.about .top_tit {font-size:20px;} .sub-body.about .bar_log img {width:180px;} .sub-body.about .txt_info_a {font-size:15px;} .sub-body.about .img_txt ul li .txt h2 {font-size:15px;} .sub-body.about ul.major_list li {padding:15px} .sub-body.about ul.major_list li p {font-size:12px;} .sub-body.about ul.major_list li p.topnone {padding-top:15px;} .object_section p, .major_section p {font-size:16px;} .sub-body.mobile .bar_log {padding:0px 0; border:0px solid #eee; text-align:center; margin-top:20px;} .sub-body.mobile .bar_log img {width:100%;} } .ceo_intro .ceo_img {display:inline-block; width:400px; vertical-align:top;} .ceo_intro .intro_txt {display:inline-block; width:calc(100% - 403px); padding-left:55px; vertical-align:top;} .ceo_intro .ceo_tit {position:relative; font-size:31px; letter-spacing:-1px; font-weight:500; color:#1c5c47;} .ceo_intro .ceo_tit span {font-size:0.7em; font-weight:400;} .ceo_intro .profileList {margin-top:60px;} .ceo_intro .profileList li {position:relative; padding-left:220px; color:#888;} .ceo_intro .profileList li strong {position:absolute; top:0; left:0; font-size:26px; letter-spacing:-1px; font-weight:500;} .ceo_intro .profileList li:before {content:""; display:block; position:absolute; top:0; left:180px; width:2px; height:100%; background:#000;} .ceo_intro .profileList li p.profileTxt {font-size:17px; position:relative;} .ceo_intro .profileList li p.profileTxt:before {content:""; display:inline-block; width:3px; height:3px; border-radius:50%; background:#1c5c47; position:absolute; top:13px; left:-10px; } .ceo_intro .profileList li p.profileTxt+p.profileTxt {margin-top:13px;} .ceo_intro .ceo_info {margin:65px 0 60px;} .ceo_intro .ceo_info img {width:200px; margin-bottom:20px;} .ceo_intro .ceo_info p {font-size:18px; color:#333; line-height:33px} .location_tit p {display:inline-block; padding:3px 23px 5px; background:#1C5C47; border-radius:20px; font-size:17px; color:#fff; margin-bottom:15px;} .location_tit .location_txt {margin:20px 0;} .location_tit .location_txt h1 {font-size:18px; font-weight:400;} .location_tit .location_txt h2 {font-size:18px; font-weight:400; color:#333; letter-spacing:-1px;} .location_tit .location_txt img {width:20px; margin-bottom:8px;} .location_tit .location_txt.bottom {border-bottom:1px solid #eee; padding-bottom:15px; margin-bottom:30px;} .bank_course .tit,.bank_course .course_month {display:inline-block; padding:4px 23px 5px; background: #548687; border-radius:20px; font-size:17px; color:#fff; margin-top:40px; font-weight:400;} .bank_course .tit.first {background:#8FBC94} .bank_course .txt {color:#666; line-height:28px; font-size:16px; padding-top:10px;} .bank_course .txt_tit {color:#000; font-size:20px; margin-bottom:9px; font-weight:700; margin-top:30px;} .bank_course .list_txt {padding-left:12px; line-height:27px; font-size:16px; font-weight:300; color:#525252;} .bank_course .list_txt.first {margin-top:15px;} .bank_course .content-subject {font-size:30px;padding-bottom:15px; margin-top:50px; font-weight:500; position:relative; margin-left:15px; color:#333; display:inline-block; z-index:0;} .bank_course .content-subject.topnone {margin-top:0;} .bank_course .content-subject:before {content:""; display:inline-block; width:10px; height:10px; border-radius:50%; background:#185c47; position:absolute; left:-15px; top:50%; margin-top:-17px;} .bank_course .couse_con {border-bottom:1px solid #ddd; padding-bottom:50px;} .bank_course .couse_con.a_2 .content-subject:after{background:rgb(212 153 185 / 50%)} .bank_course .couse_con.a_2 .course_month{background:#D499B9} .bank_course .couse_con.a_3 .content-subject:after {background:rgb(132 177 237 / 50%)} .bank_course .couse_con.a_3 .course_month {background:#84B1ED} .bank_course .couse_con.a_4 .content-subject:after {background:rgb(241 107 111 / 50%)} .bank_course .course_month {margin-left:15px;} .banksystem .content-subject.block {display:block;} .banksystem .study_list {width:100%; display:inline-block; margin-top:20px;} .banksystem .study_list li {float:left; width:50%; padding:7px 5px; font-size:16px; color:#8a8a8a; } .banksystem .study_list li >.wrapper {padding:13px 20px; background:#f9f9f9; border:2px solid #ddd} .banksystem .study_list li span {color:#f18a8a; font-weight:500;} .banksystem .width_3 {width:100%;} .banksystem .width_3 th {background:#ECF3F0; padding:10px 0; color:#333; font-size:18px; border-top:2px solid #3c9276;} .banksystem .width_3 td {text-align:center; font-size:15px; padding:10px 0; border-bottom:1px solid #f5f5f5;} .banksystem .width_3 td.back {background:#ECF3F0; padding:10px 0; color:#333; font-size:18px; border-top:1px solid #3c9276;} .banksystem .width_3 .right_border { border-right:1px solid #3c9276;} .banksystem .mean_txt {width:100%; display:inline-block; margin-top:25px;} .banksystem .mean_txt li {float:left; margin-left:35px; position:relative; display:table;} .banksystem .mean_txt li span {width:200px; height:200px; border-radius:50%; display:table-cell; font-size:18px; text-align:center; vertical-align:middle} .banksystem .mean_txt li.li1 span,.banksystem .mean_txt li.li2 span {color:#828282; background:#f1f1f1;} .banksystem .mean_txt li.li3 span {background:#8eca6a; color:#fff;} .banksystem .mean_txt li.li4 span {background:#06b083; color:#fff;} .banksystem .mean_txt li:after {content:""; position:absolute; right:-22px; top:50%; width:0; height:0; border-top:9px solid transparent; border-bottom:9px solid transparent } .banksystem .mean_txt li.li2:after {border-left:11px solid #8eca6a;} .banksystem .mean_txt li.li3:after {border-left:11px solid #06b083;} .banksystem .mean_txt li.li1:after,.banksystem .mean_txt li.li4:after {display:none;} .banksystem .redPoint {color:#f18a8a; font-weight:500;} .subpage_btn_t {text-align:center; margin-top:20px;} .subpage_btn_t.right {text-align:right;} .subpage_btn_t img.ceo_btn_img {width:30px; margin:0; margin-right:8px;} .subpage_btn_t img.course_btn_img {margin-left:8px;} .subpage_btn_t a {padding:10px 30px; border:2px solid #1c5c47; font-size:15px; color:#fff; display:inline-block; border-radius:35px; background:#1c5c47; transition:all 0.1s;} .subpage_btn_t a .hover_img {display:none;} .subpage_btn_t a:hover {background:#fff; color:#1c5c47} .subpage_btn_t a:hover .hover_img {display:inline-block;} .subpage_btn_t a:hover .re_img {display:none;} .courseinfo .content-subject:after {content:""; position:absolute; width:100%; height:7px; background:rgba(24,92,71,0.3); left:0; bottom:22px; z-index:-1;} .courseinfo {padding-bottom:80px;} .courseinfo .course_info_01 {width:100%; display:inline-block; border:1px solid #ddd; background:#fbfbfb;margin-top:40px;} .courseinfo .course_info_01 li {width:50%; float:left; padding:0 50px 50px;} .courseinfo ul.boxList {width:100%; display:inline-block;} .courseinfo ul.boxList li.box {width:calc(25% - 20px); float:left; min-height:200px; border:1px solid #ddd; background:#fbfbfb; margin-right:20px; margin-bottom:20px; padding:25px; position:relative;} .courseinfo ul.boxList li.box:after {content:""; position:absolute; right:0; bottom:0; display:inline-block; width:10px; height:10px;background:#fa2828; transition:all 0.1s;} .courseinfo ul.boxList li.box:nth-child(4) {margin-right:0;} .courseinfo ul.boxList li.box ul.semi_list li {font-size:18px; letter-spacing:-2px; line-height:24px; padding-left:12px; position:relative;} .courseinfo ul.boxList li.box ul.semi_list li:before {content:"·"; position:absolute; left:0;top:0;} /* 동영상 재생환경 */ .media .tit,.bank_course .course_month {display:inline-block; padding:4px 23px 5px; background: #548687; border-radius:20px; font-size:17px; color:#fff; margin-top:40px; font-weight:400;} .media .tit.first {background:#8FBC94} .media .txt {color:#666; line-height:28px; font-size:16px; padding-top:10px;} .media .txt_tit {color:#000; font-size:20px; margin-bottom:9px; font-weight:700; margin-top:30px;} .media .txt_ctit {color:#000; font-size:18px; text-align:center; margin-bottom:9px; font-weight:700; margin-top:30px;} .media .list_txt {padding-left:12px; line-height:27px; font-size:16px; font-weight:300; color:#525252;} .media .list_txt.first {margin-top:15px;} .media .content-subject {font-size:26px;padding-bottom:15px; margin-top:50px; font-weight:500; position:relative; margin-left:15px; color:#333; display:inline-block; z-index:0;} .media .content-subject.topnone {margin-top:0;} .media .content-subject:before {content:""; display:inline-block; width:10px; height:10px; border-radius:50%; background:#104a82; position:absolute; left:-15px; top:50%; margin-top:-17px;} .media .couse_con {border-bottom:1px solid #ddd; padding-bottom:50px;} .media .couse_con.a_2 .content-subject:after{background:rgb(132 177 237 / 50%)} .media .couse_con.a_2 .course_month{background:#84B1ED} .media .couse_con.a_3 .content-subject:after {background:rgb(132 177 237 / 50%)} .media .couse_con.a_3 .course_month {background:#84B1ED} .media .couse_con.a_4 .content-subject:after {border-bottom:1px solid #fff; background:rgb(132 177 237 / 50%)} .media .course_month {margin-left:15px;} .media .content-subject:after {content:""; position:absolute; width:100%; height:7px; background:rgba(132 177 237 / 50%); left:0; bottom:22px; z-index:-1;} .media {padding-bottom:80px;} .media .course_info_01 {width:100%; display:inline-block; border:1px solid #ddd; background:#ffffff; margin-top:40px;} .media .course_info_01 li {width:50%; float:left; padding:30px 50px 30px;} .media .course_info_01 li .con{width:100%; text-align:center;} .media .course_info_01 li .con img{text-align:center;} .media ul.boxList {width:100%; display:inline-block;} .media ul.boxList li.box {width:calc(25% - 20px); float:left; min-height:200px; border:1px solid #ddd; background:#ffffff; margin-right:20px; margin-bottom:20px; padding:25px; position:relative;} .media ul.boxList li.box:nth-child(4) {margin-right:0;} .media ul.boxList li.box ul.semi_list li {list-style-type:none; font-size:18px; letter-spacing:-2px; line-height:24px; padding-left:12px; position:relative;} .media ul.boxList li.box ul.semi_list li .con{width:100%; text-align:center;} .media ul.boxList li.box ul.semi_list li .con img{text-align:center;} .media_btn_t {text-align:center; margin-top:20px;} .media_btn_t.right {text-align:right;} .media_btn_t a {padding:10px 30px; border:2px solid #104a82; font-size:15px; color:#fff; display:inline-block; border-radius:35px; background:#104a82; transition:all 0.1s;} .media_btn_t a .hover_img {display:none;} .media_btn_t a:hover {background:#fff; color:#104a82} .media_btn_t a:hover .hover_img {display:inline-block;} .media_btn_t a:hover .re_img {display:none;} @media all and (max-width: 1100px){ .ceo_intro .intro_txt {padding-left:2%;} .ceo_intro .profileList li {padding-left:200px;} .ceo_intro .profileList li:before {left:160px;} .courseinfo ul.boxList li.box {width:calc(33% - 20px)} .courseinfo ul.boxList li.box:nth-child(4) {margin-right:20px;} .courseinfo ul.boxList li.box ul.semi_list li {font-size:16px;} .banksystem .mean_txt li span {width:150px; height:150px; font-size:14px; } } @media all and (max-width: 900px) { .ceo_intro .intro_txt {width:100%; padding-left:0;} .ceo_intro .ceo_img {width:100%; text-align:center;} .ceo_intro .ceo_img img {width:400px;} .ceo_intro .ceo_tit {text-align:center;} } @media all and (max-width: 834px) { .courseinfo ul.boxList li.box {width:calc(50% - 20px)} .viewpoint_banner li.box h1.tit {font-size:20px;} .btn-area.pause {width:100%; display:block;} } @media all and (max-width: 640px) { .ceo_intro .ceo_tit {font-size:18px; margin-top:20px;} .ceo_intro .profileList {margin-top:30px; padding-left:20px;} .ceo_intro .profileList li strong {position:initial; font-size:20px; display:inline-block; margin-bottom:5px;} .ceo_intro .profileList li p.profileTxt {font-size:15px;} .ceo_intro .profileList li p.profileTxt+p.profileTxt {margin-top:8px;} .ceo_intro .profileList li {padding:0;} .ceo_intro .profileList li:before {display:none;} .ceo_intro .ceo_info p {font-size:16px; line-height:29px;} .ceo_intro .profileList li p.profileTxt:before {top:9px;} .logo_img_ceo {text-align:center;} .location_tit .location_txt h2 {font-size:16px;} .location_tit .location_txt h1 {font-size:15px;} .banksystem .study_list li {width:100%;} .courseinfo .course_info_01 li {width:100%;} .courseinfo ul.boxList li.box {width:100%; min-height:155px;} .bank_course .tit, .bank_course .course_month {margin-top:20px;} .banksystem .width_3 th,.banksystem .width_3 td.back {font-size:16px;} .media .txt_tit {color:#000; font-size:20px; margin-bottom:9px; font-weight:700; margin-top:10px;} .media .course_info_01 li {width:100%; padding:20px 20px 20px;} .media .course_info_01 li .con img{width:100%;} .media ul.boxList li.box {width:100%; min-height:155px;} .media .tit, .bank_course .course_month {margin-top:20px;} .media ul.boxList li.box ul.semi_list li img{margin: 0 auto;} } @media all and (max-width: 400px) { .ceo_intro .ceo_img img {width:100%;} .banksystem .mean_txt li span {width:100px; height:100px; font-size:13px;} .agree-box {margin:0 auto 20px;} .sub-body {padding:0px 0;} .con_center{margin-left:1%; text-align:center; width:98%;} .con_center img{text-align:center; width:100%;} } @media (max-width: 820px) { .bg {padding:60px 0;} .classList ul li {width:49%; margin-right:1%;} .classList ul li:nth-child(2n) {margin-right:0;} .classList ul li:nth-child(3n) {margin-right:1%;} .new_class .course_1 li {margin-right:1%; width:24%;} .long_banner ul li.txt_section {width:60%; padding-top:18px;} .long_banner ul li.img_section {width:40%;} .long_banner ul {width:100%; margin:0 auto;} .long_banner ul li.img_section img{width:100%;} .gasipan .subject_title h1 {font-size:23px; margin-bottom:5px; letter-spacing:-1px;} .gasipan {display:inline-block; width:100%; padding:50px 0;} .gasipan .left_sec {width:60%; margin-right:3%; float:left;} .gasipan .right_sec {width:36%; float:left; margin-top:-10px;} .gasipan .list_four {display:inline-block; width:100%;} .gasipan .list_four li {width:48%; margin-right:4%; float:left; text-align:center; margin-bottom:4%; border-radius:15px; box-shadow:rgb(100 100 111 / 10%) 0px 5px 25px 0px;} .gasipan .list_four li a {display:block; padding:5px 0;} .gasipan .list_four li a img{width:40%;} .gasipan .list_four li a:hover{border:1px solid #1e8aff; border-radius:15px; } .gasipan .list_four li:nth-child(7),.gasipan .list_four li:nth-child(8) {margin-bottom:0;} .gasipan .list_four li:nth-child(2n) {margin-right:0;} .gasipan .list_four li h1 {color:#000; font-size:17px; letter-spacing:-0.05em; font-weight:600; margin-top:0px;} .gasipan .list_four li:hover h1 {color:#1e8aff;} .board-menu > ul > li {width:50%; } .btext > ul > li {padding:0px 15px 8px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .btext a{width:200px;} .btext span.no {float:left; width:40px; font-size:13px;} .btext span.nick {display:none; float:right; width:70px; font-size:13px;} .btext span.date { float:right; width:95px; font-size:13px;} .boxnotice .btext > ul > li {padding:0px 15px 8px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .boxnotice .btext a{float:left; width:70%; font-size:14px;} .boxnotice .btext span.nick { float:right; width:40px; font-size:13px;} } @media (max-width: 640px) { .classList ul li {width:100%; margin-right:0;} .cop_txt br {display:none;} .tea_li li {width:100%; margin-right:0; margin-bottom:4%;} .cop_tit br {display:none;} .padt80 {padding-top:60px;} .pad80 {padding:60px 0;} .cop_li {display:block;} .cop_li2 li {display:block; width:100%; padding:20px 20px 40px;} .cop_li2 li:first-child {width:100%; text-align:center;} .cop_bg_txt {font-size:17px; font-weight:400;} .cop_bg_txt br {display:none;} } @media (max-width: 480px) { .new_class .course_1 li {width:100%; margin-right:0;} .subject_title h1 {font-size:24px; margin-bottom:15px;} .classList .txt_wrap {padding:25px 5%;} .long_banner {padding:0px 0;} .long_banner h1 {font-size:20px; line-height:35px;} .long_banner h2 {font-size:15px; margin-bottom:30px;} .long_banner ul li.txt_section h1 {font-size:20px;} .long_banner ul li.txt_section span {font-size:32px;} .gasipan .left_sec {width:100%; margin-right:0;} .gasipan .right_sec {width:100%; margin-top:30px;} .gasipan .list_four li h1 {font-size:15px;} .teali4 li {width:100%; margin-right:0;} .teali4 li:first-child {margin-bottom:2%;} .tea_txt {position:relative; top:-20px; left:0;} .etc_three_box > li {clear:both; width:100%; margin-right:0; margin-top:20px;} .etc_three_box > li:nth-child(2) {width:100%;} .etc_three_box > li:nth-child(3) {width:100%;} span.fullmenu-tag {display:none;} .btext a{float:left; width:50%; font-size:14px;} .btext span.date{float:right; width:70px; font-size:13px;} .board-menu > ul > li {width:50%; } .btext > ul > li {padding:0px 15px 8px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .btext span.no {float:left; width:40px; font-size:13px;} .btext span.nick {display:none;} .boxnotice .btext > ul > li {padding:0px 15px 8px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .boxnotice .btext a{float:left; width:70%; font-size:14px;} .boxnotice .btext span.nick {float:right; width:40px; font-size:13px;} .bg {padding:20px 0;} .menu_box01{float:auto; width:100%;} .menu_box02{float:auto; width:100%;} .menu_box03{float:auto; width:100%;} .menu_box04{float:auto; width:100%;} .menu_box05{float:auto; width:100%;} .menu_box06{float:auto; width:100%;} } @media (max-width: 320px) { .cop_li2 img {width:100%;} } /* main visual swiper */ .main-slide .swiper-container { position:relative !important; width:100%; overflow:hidden; height:320px; } .main-slide .height-700-responsive {height:320px !important;} .main-slide .swiper-slide {min-height:0; height:320px;} .main-slide .main-slide-link {display:block; width:100%; height:320px;} .main-slide .main-slide-image { display:block; width:100%; height:100%; object-fit:cover; object-position:center center; } .main-slide .swiper-slide > .container, .main-slide .main-slide-link > .container { position:absolute; top:0; left:0; width:100%; height:100%; z-index:2; pointer-events:none; } .main-slide .swiper-button-next, .main-slide .swiper-button-prev { width:44px; height:44px; margin-top:-22px; z-index:20; } .main-slide .swiper-button-next:after, .main-slide .swiper-button-prev:after {display:none;} .main-slide .swiper-button-next img, .main-slide .swiper-button-prev img {width:100%; height:100%; object-fit:contain;} .main-slide .swiper-pagination { position:absolute !important; left:0; right:0; bottom:16px !important; z-index:120 !important; display:block !important; text-align:center; pointer-events:auto; } .main-slide .swiper-pagination-bullet { position:relative; width:6px !important; height:6px !important; background:transparent !important; border:0 !important; opacity:1 !important; border-radius:50% !important; margin:0 14px !important; vertical-align:middle; box-shadow:0 0 0 1px rgba(0,0,0,0.28), 0 1px 4px rgba(0,0,0,0.45), 0 0 8px rgba(255,255,255,0.35); } .main-slide .swiper-pagination-bullet .qs-bullet-core { position:absolute; left:50%; top:50%; width:6px; height:6px; background:rgba(255,255,255,0.95); border-radius:50%; transform:translate(-50%, -50%); } .main-slide .swiper-pagination-bullet .qs-progress-ring { position:absolute; left:50%; top:50%; width:18px; height:18px; transform:translate(-50%, -50%) rotate(-90deg); display:block; overflow:hidden; pointer-events:none; } .main-slide .swiper-pagination-bullet .qs-progress-ring__track, .main-slide .swiper-pagination-bullet .qs-progress-ring__bar { fill:none !important; } .main-slide .swiper-pagination-bullet .qs-progress-ring__track { stroke:transparent; stroke-width:4.8; } .main-slide .swiper-pagination-bullet .qs-progress-ring__bar { stroke:#ffffff; stroke-width:4.8; stroke-linecap:round; stroke-dasharray:94.25; stroke-dashoffset:94.25; opacity:0; will-change:stroke-dashoffset; filter:drop-shadow(0 1px 1px rgba(0,0,0,0.35)); } .main-slide .swiper-pagination-bullet-active { opacity:1 !important; box-shadow:0 0 0 1px rgba(0,0,0,0.38), 0 2px 6px rgba(0,0,0,0.52), 0 0 10px rgba(255,255,255,0.45); } .main-slide .swiper-pagination-bullet.qs-progress-active .qs-progress-ring__bar { opacity:1; animation:qsSwiperRingProgress var(--qs-progress-duration, 5000ms) linear forwards; } .main-slide .swiper-page-fraction { position:absolute; right:24px; bottom:20px; color:#ffffff; font-size:13px; font-weight:600; letter-spacing:0.03em; z-index:20; text-shadow:0 1px 4px rgba(0,0,0,0.35); } @media (max-width: 768px) { .main-slide .swiper-container {height:320px;} .main-slide .height-700-responsive {height:320px !important;} .main-slide .swiper-slide {min-height:0; height:320px;} .main-slide .main-slide-link {height:320px;} .main-slide .swiper-button-next, .main-slide .swiper-button-prev { width:34px; height:34px; margin-top:-17px; } .main-slide .swiper-pagination { position:absolute !important; bottom:10px !important; display:block !important; z-index:120 !important; } .main-slide .swiper-page-fraction { right:12px; bottom:10px; font-size:12px; } } @keyframes qsSwiperRingProgress { from {stroke-dashoffset:94.25;} to {stroke-dashoffset:0;} } /* 전체 */ img {margin:0 auto;} .carousel-control img {position:relative; top:50%; width:100px; margin-top:-50px;} #myCarousel_mobile {display:none;} .bx-wrapper {margin-bottom:0;} .bx-wrapper .bx-controls-direction a {z-index:0;} .clear:after {display:block; content:''; clear:both;} .utbThumbWrap {padding-bottom:66%} .utbThumb {margin-top:-14%;} @media (min-width: 834px) and (max-width: 1024px) { .utbThumb {margin-top:-22%;} } @media (min-width : 600px) and (max-width: 833px) { .utbThumb {margin-top:-17%;} } @media (max-width: 599px) { .utbThumb {margin-top:-20%;} } .bg {padding:50px 0;} .gray {background:#f5f6f8;} .subject_title {position:relative;} .subject_title h1 {font-size:20px; color:#000; font-weight:600; position:relative; margin:0 0 13px;} .subject_title .btn_more {position:absolute; right:0; top:9px; color:#000000; font-size:17px; font-weight:500;} .subject_title .btn_more:hover {color:#1e8aff;} .top_left_login{float:left; margin-right:5px; width:285px; margin-top:-3px; } .top_login{float:left; margin-left:3px; width:330px; height:27px; } .top_login_btn {width:70px; height:26px; margin-bottom:-8px; margin-left:-1px; border-radius:15px; color:#ffffff; font-weight:normal; background:#255ece;} .stw_top_login{width:100px; padding:4px; margin-right:3px; height:28px; border:1px solid #dddddd; background:#ffffff;} .gasipan .subject_title h1 {margin-bottom:5px; letter-spacing:-1px;} .gasipan {display:inline-block; width:100%; padding:50px 0;} .gasipan .left_sec {width:55%; margin-right:5%; float:left;} .gasipan .right_sec {width:39%; float:left; margin-top:-10px;} .gasipan .list_four {display:inline-block; width:100%;} .gasipan .list_four li {width:40%; margin-right:6%; float:left; text-align:center; margin-bottom:3%; border-radius:15px; box-shadow:rgb(100 100 111 / 10%) 0px 5px 25px 0px;} .gasipan .list_four li a {display:block; padding:14px 0; border:1px solid #d3d3d3; border-radius:15px; } .gasipan .list_four li a:hover{border:1px solid #1e8aff; border-radius:15px;} .gasipan .list_four li:nth-child(7),.gasipan .list_four li:nth-child(8) {margin-bottom:0;} .gasipan .list_four li:nth-child(2n) {margin-right:0;} .gasipan .list_four li h1 {color:#000; font-size:17px; letter-spacing:-0.05em; font-weight:600; margin-top:3px;} .gasipan .list_four li:hover h1 {color:#1e8aff;} .classList {display:inline-block; width:100%;} .classList ul li {width:31.3%; float:left; margin-right:3%; margin-bottom:3%; } .classList ul li:nth-child(3n) {margin-right:0;} .classList ul .list01 {} .classList ul .list02 {} .classList ul .list03 {} .classList ul .list04 {} .classList ul .list05 {} .classList ul .list06 {} .classList ul li a:hover{opacity: 0.6;} .classList .txt_wrap {padding:30px 5%; min-height:140px;} .classList ul li h1 {color:#000; font-size:20px; font-weight:600; margin-bottom:8px;} .classList ul li h1.two{color:#000; font-size:18px; font-weight:600; margin-bottom:8px; line-height:22px; margin-top:-10px;} .classList ul li h2 {color:#777; font-size:14px; font-weight:400; letter-spacing:-1px;} .classList .btn_more {width:100%; position:relative;} .classList .btn_more a {display:block; padding:11px 0 11px 5%; border-top:1px solid #eee; transition:all 0.1s;} .classList .btn_more h1 {font-size:15px; font-weight:400; margin-bottom:0; } .classList .btn_more span {display:inline-block; width:45px; height:44px; text-align:center; line-height:44px; background:#000; color:#fff; font-size:25px; position:absolute; right:0; bottom:0;} .classList .btn_more a:hover {background:#000; transition:all 0.1s;} .classList .btn_more a:hover h1 {color:#fff;} .new_class {width:100%;} .new_class .course_1 li {width:23.5%; margin-right:2%; float:left;} .new_class .course_1 li:last-child {margin-right:0;} .new_class .course_1 li img {width:100%;} .new_class .course_1 li a:hover{opacity: 0.6;} .bc-box-out {position:relative; width:100%; height:0; padding-bottom:63%;} .bc-box-in {height:100%; overflow:hidden; width:100%; position:absolute;} .bc-img {width:100%; display:block; margin:0 auto;} .bc-text {background:#fff; padding:10px 10px 30px; border:1px solid #eee;} .bc-text h2{float:right; margin-bottom:14px; color:#e35d6f; font-size:15px; text-align:right; padding:2px 3px; display:inline-block; font-weight:500; transition:all 0.1s;} .bc-text h3 {color:#222; font-size:19px; font-weight:500; margin-top:0px; font-weight:500; letter-spacing:-1px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical; word-wrap:break-word; line-height: 20px;height:20px;} .long_banner {padding:30px 0 0; display:inline-block; width:100%;} .long_banner.main{background:#8abcfc;} .long_banner ul {width:1100px; margin:0 auto;} .long_banner ul li {float:left;} .long_banner ul li.txt_section {width:40%; padding-top:18px;} .long_banner ul li.img_section {width:60%;} .long_banner ul li.img_section img {width:80%;} .long_banner ul li.txt_section span {font-size:48px; color:#FFFFFF; line-height:45px;} .long_banner ul li.txt_section h1 {font-size:26px; color:#FFFFFF;} .long_banner ul li.txt_section h2{margin-top:24px; color:#ffffff; font-size:20px; border:1px solid #ffffff; text-align:left; padding:6px 48px; display:inline-block; font-weight:300; transition:all 0.1s;} /* 메인 - 그외 기타등등 */ .etc_three_box > li {float:left; position:relative; width:31%; margin-right:3%;} .etc_three_box > li:nth-child(2) {width:31%;} .etc_three_box > li:nth-child(3) {width:31%; margin-right:0;} .etc_three_box h3 {text-align:left; border-bottom:1px solid #ddd; padding:0px 0 20px; margin-bottom:20px; color:#000000; font-size:24px; font-weight:600; letter-spacing:-0.025em;} .etc_notice li button {position:absolute; top:5%; right:0; background:none; color:#444; padding-right:0; font-size:14px;} .etc_service .etc_up {margin-bottom:4%;} .etc_service ul li {float:left; width:48%; margin-right:4%; background:#ddd; height:100px; position:relative; border:1px solid #e5e5e5;} .etc_service ul li:last-child {margin-right:0;} .etc_service .etc_up a,.etc_service .etc_down a {display:inline-block; width:100%; height:100%;} .icon_ani.etc_color1 {background:url('/files/images/etc_icon_01.png') no-repeat 50% 35%;} .icon_ani.etc_color2 {background:url('/files/images/etc_icon_02.png') no-repeat 50% 35%;} .icon_ani.etc_color3 {background:url('/files/images/etc_icon_03.png') no-repeat 50% 35%;} .icon_ani.etc_color4 {background:url('/files/images/etc_icon_04.png') no-repeat 50% 35%;} .icon_ani.etc_color1:hover {background:url('/files/images/etc_icon_01_b.png') no-repeat 50% 35%;} .icon_ani.etc_color2:hover {background:url('/files/images/etc_icon_02_b.png') no-repeat 50% 35%;} .icon_ani.etc_color3:hover {background:url('/files/images/etc_icon_03_b.png') no-repeat 50% 35%;} .icon_ani.etc_color4:hover {background:url('/files/images/etc_icon_04_b.png') no-repeat 50% 35%;} .icon_ani h5 {margin-top:65px; color:#666666; font-size:14px; letter-spacing:-0.025em; text-align:center; font-weight:400;} .icon_ani:hover h5 {color:#0059ff;} .guide_number h2 {color:#000000; font-size:47px; letter-spacing:-0.025em; font-weight:500; margin-bottom:15px;} .guide_number h4 {color:#777777; font-size:17px; letter-spacing:-0.025em; font-weight:400;} .guide_number h5 {color:#000000; font-size:20px; letter-spacing:-0.025em; font-weight:600;} .guide_number .no {padding-bottom:25px;} .guide_number .list {padding-bottom:25px;} .guide_number .list:last-child {padding-bottom:0;} /* 메인 배너 텍스트 */ .main_tit_2022 {padding-left: 32px; display: block;} .main_tit_2022 > .pc {font-size:30px; font-weight: 400!important;} .main_tit_2022 > .pc > b {font-size:38px; color:#481099!important;display: block;} .main_tit_2022 > .mobile {font-size:30px;} .main_tit_2022 > .mobile > b {color:#481099!important;display: block;} .main_des_2022 {padding-left: 32px; display: block;} .main_des_2022 > .pc {font-weight: 400!important; font-size: 18px; line-height: 1.4em; } .main_des_2022 > .mobile {font-weight: 400!important; font-size: 18px; line-height: 1.4em;} .bnr_btn_more {background: #481099; padding: 8px 50px 12px; position: relative; border-radius: 30px; bottom: -30px;} .bnr_btn_more:hover {background: #360f6d; box-shadow:0 10px 10px rgba(200,50,200,0.1); transition: 0.3s; } .bnr_btn_more span {font-size:14px; font-weight: 400; margin-left:-20px; color: #fff;} .bnr_btn_more span i{border-top: 2px solid #fff; border-right: 2px solid #fff; margin-left: 10px; transform: rotate(45deg) translateY(-50%); position: absolute; top: 50%; width: 8px; height: 8px;} @media screen and (max-width:420px) { /* 메인 모바일 배너 텍스트 */ .swiper-slide{background-position:right 34% center!important; background-repeat: no-repeat;} .swiper-slide::before{content: ''; width: 100%; height: 440px;background-image: linear-gradient(90deg,rgba(255,255,255,0.8), rgba(255,255,255,0)); position: absolute;} .main_tit_2022 {padding-left: 0px!important;} .main_des_2022 {padding-left: 0px!important;} } /* 전체메뉴 */ .full_menu_box{margin: 0 auto;width:100%; max-width:1300px;} .sticky {position: fixed;top: 0;width: 100%;} #navbar {z-index: 99999; background: linear-gradient(to bottom, #f9fbfd 0%, #eef3f8 100%); border-top: 1px solid #e7edf4; border-bottom: 1px solid #d8e1ea;} p.full_m_tit{ text-align:center; color:#000000; font-size:25px; } .menu_box{margin: 0 auto; background:#ffffff; display:inline-block;} .menu_box01{float:left; width:33%;} .menu_box02{float:left; width:33%;} .menu_box03{float:left; width:33%;} .menu_box04{float:left; width:32%;} .menu_box05{float:left;width:32%;} .menu_box06{float:left;width:36%;} ul.menu {margin:4%; width:96%; border: 1px solid #b0cfeb; text-align:left;} li.menu_tit{display:inline-block; width: 100%;color:#1a67af; text-align:center; background:#e4ebfb; font-size:16px; font-weight:bold; padding:2%;letter-spacing:-1px; } li.menu_stit{display:inline-block; width: 100%;color:#000000; font-size:13px; font-weight:400; padding:2px 0px 2px 6px; letter-spacing:-1px; } li.menu_txt{display:inline-block; width: 100%;color:#1a67af; font-size:13px; font-weight:400;padding-left:5%; letter-spacing:-1px; } span.menu_stxt{float:left; margin-right:10px;} span.menu_stxt_left{float:left; margin-right:10px; min-width:120px;} /* /web/734 등 서브 — 개설강좌 전체보기 (introduce/sub_all_menu.html) */ .course-all-menu-section { margin-top: 6px; } .course-all-menu-section .sub-title .subject, .course-all-menu-section .sub-title .subject span { font-size: 29px; letter-spacing: -0.7px; } .course-all-menu-section p.full_m_tit { margin: 14px 0 18px; font-size: 30px; font-weight: 700; letter-spacing: -0.9px; color: #0f2d56; } .course-all-menu-section .menu_box { display: flex; flex-wrap: wrap; align-items: flex-start; gap: 22px; margin: 0; width: 100%; background: transparent; } .course-all-menu-section .menu_box + .menu_box { margin-top: 4px; } .course-all-menu-section .menu_box01, .course-all-menu-section .menu_box02, .course-all-menu-section .menu_box03, .course-all-menu-section .menu_box04, .course-all-menu-section .menu_box05, .course-all-menu-section .menu_box06 { float: none; width: auto; flex: 1 1 calc(33.333% - 15px); min-width: 280px; } .course-all-menu-section .menu_box04, .course-all-menu-section .menu_box05 { flex-basis: calc(30% - 15px); } .course-all-menu-section .menu_box06 { flex-basis: calc(40% - 15px); } .course-all-menu-section ul.menu { margin: 0 0 18px; width: 100%; padding-bottom: 10px; border: 1px solid #d7e3f5; border-radius: 14px; background: linear-gradient(180deg, #ffffff 0%, #fcfdff 100%); box-shadow: 0 8px 20px rgba(20, 62, 118, 0.08); overflow: hidden; transition: transform 0.22s ease, box-shadow 0.22s ease, border-color 0.22s ease; } .course-all-menu-section ul.menu:hover { transform: translateY(-4px); border-color: #9ebde8; box-shadow: 0 14px 28px rgba(20, 62, 118, 0.16); } .course-all-menu-section li.menu_tit { display: block; width: 100%; margin: 0; padding: 12px 14px 11px; background: linear-gradient(120deg, #edf4ff 0%, #dbe8ff 100%); border-bottom: 1px solid #cfe0fa; color: #114a8a; font-size: 21px; font-weight: 700; letter-spacing: -0.6px; text-align: center; } .course-all-menu-section li.menu_stit, .course-all-menu-section li.menu_txt { display: block; width: 100%; padding: 8px 14px 8px 16px; font-size: 15px; line-height: 1.56; letter-spacing: -0.15px; word-break: keep-all; } .course-all-menu-section li.menu_stit { color: #122842; font-weight: 500; } .course-all-menu-section li.menu_txt { color: #335f97; padding-left: 22px; } .course-all-menu-section ul.menu > li.menu_stit:first-of-type, .course-all-menu-section ul.menu > li.menu_txt:first-of-type { padding-top: 12px; } .course-all-menu-section ul.menu > li.menu_stit:last-of-type, .course-all-menu-section ul.menu > li.menu_txt:last-of-type { padding-bottom: 12px; } .course-all-menu-section li.menu_stit a, .course-all-menu-section li.menu_txt a, .course-all-menu-section .menu_stxt a, .course-all-menu-section .menu_stxt_left a { display: inline-block; color: #1b4378; transition: color 0.2s ease, transform 0.2s ease, text-shadow 0.2s ease; } .course-all-menu-section li.menu_txt a { color: #2a5a98; } .course-all-menu-section li.menu_txt a:hover, .course-all-menu-section li.menu_stit a:hover, .course-all-menu-section .menu_stxt a:hover, .course-all-menu-section .menu_stxt_left a:hover { color: #0a3a75; transform: translateX(4px); text-shadow: 0 0 0 rgba(0, 0, 0, 0); } .course-all-menu-section .menu_stxt, .course-all-menu-section .menu_stxt_left { float: none; display: inline-block; margin: 2px 12px 2px 0; } .course-all-menu-section .menu_stxt_left { min-width: 132px; } @media screen and (max-width: 1200px) { .course-all-menu-section .menu_box01, .course-all-menu-section .menu_box02, .course-all-menu-section .menu_box03, .course-all-menu-section .menu_box04, .course-all-menu-section .menu_box05, .course-all-menu-section .menu_box06 { flex-basis: calc(50% - 11px); min-width: 260px; } } @media screen and (max-width: 768px) { .course-all-menu-section .sub-title .subject, .course-all-menu-section .sub-title .subject span { font-size: 24px; } .course-all-menu-section p.full_m_tit { font-size: 24px; margin-bottom: 14px; } .course-all-menu-section .menu_box { gap: 14px; } .course-all-menu-section .menu_box01, .course-all-menu-section .menu_box02, .course-all-menu-section .menu_box03, .course-all-menu-section .menu_box04, .course-all-menu-section .menu_box05, .course-all-menu-section .menu_box06 { flex-basis: 100%; min-width: 0; } .course-all-menu-section li.menu_tit { font-size: 19px; } .course-all-menu-section li.menu_stit, .course-all-menu-section li.menu_txt { font-size: 14px; } } span.fullmenu-tag {font-size: 13px; margin-left:0px;cursor: pointer;position: absolute;z-index: 9999;padding: 5px 12px; border-radius:15px; border: 1px solid #255ece;color: #fff; background:#255ece; margin-top: 10px;} /* 상단 "개설강좌 전체보기" */ #header .section > a.fullmenu-link { text-decoration: none; } #header .section > a.fullmenu-link .fullmenu-tag { overflow: visible; isolation: isolate; box-shadow: 0 5px 14px rgba(37, 94, 206, 0.18); transition: transform 0.3s ease, background-color 0.3s ease, border-color 0.3s ease, box-shadow 0.3s ease; } #header .section > a.fullmenu-link .fullmenu-tag::before { content: ''; position: absolute; left: -45%; top: -80%; width: 34%; height: 260%; background: rgba(255, 255, 255, 0.32); transform: rotate(28deg) translateX(0); transition: transform 0.55s ease; z-index: 0; pointer-events: none; } #header .section > a.fullmenu-link:hover .fullmenu-tag::before { transform: rotate(28deg) translateX(520%); } #header .section > a.fullmenu-link:hover .fullmenu-tag { background:#1e4fa8; border-color: #1e4fa8; box-shadow: 0 9px 22px rgba(37, 94, 206, 0.28); transform: translateY(-2px); } .overlay {height: 0%;width: 100%;position: fixed;z-index: 1;top: 0;left: 0;background-color: rgb(0,0,0);background-color: rgba(0,0,0, 0.6);overflow-y: hidden;transition: 0.5s;z-index: 999999;} .overlay-content {position: relative; top: 15%; width: 100%; text-align: center; margin-top: 30px; padding: 0 5%;} .overlay-content ul {width: 14.28571428571429%; float: left;} .overlay a {padding: 2px 2px;text-decoration: none;display: block;transition: 0.3s;} .overlay a .menu-title {font-size:18px; font-weight: 400; color: #fff; background: #bb1212; padding: 2px 0;} .overlay a:hover, .overlay a:focus {color: #1a67af;} .overlay .closebtn {position: absolute;top: 20px;right: 45px;font-size: 60px;} @media screen and (max-height: 450px) { .overlay {overflow-y: auto;} .overlay a {font-size: 20px} .overlay .closebtn { font-size: 40px; top: 15px; right: 35px; } } /***********메인************/ .div_center {text-align:center;} .viewpoint_banner {width:100%; padding:80px 0;} .viewpoint_banner h1.section_tit_a {text-align:center; margin-bottom:40px; font-size:27px; font-weight:500;} .viewpoint_banner h1.section_tit_a {position:relative; display:inline-block;} .viewpoint_banner h1.section_tit_a:after {content:"";width: 100%;height: 10px;display: inline-block;background: #ffec9c; position: absolute; bottom:7px; left:0; z-index:-1;} .viewpoint_banner li.box {float:left; padding-top:80px; position:relative; margin-right:20px; width:calc(25% - 15px);text-align:center;background-size:cover; background-position:top; min-height:305px;transition:all 0.1s;} .viewpoint_banner li.box:last-child {margin-right:0;} .viewpoint_banner li.box img {width:65px;} .viewpoint_banner li.box h1.tit {color:#fff; font-size:30px; padding:8px 0; letter-spacing:1px;transition:all 0.1s; } .viewpoint_banner li.box:hover .tit{color:#f7ecc1;} .viewpoint_banner li.box1 {background-image:url('/files/images/main_banner_01_bg.jpg');} .viewpoint_banner li.box2 {background-image:url('/files/images/main_banner_02_bg.jpg');} .viewpoint_banner li.box3 {background-image:url('/files/images/main_banner_031_bg.jpg'); padding-top:100px;} .viewpoint_banner li.box4 {background-image:url('/files/images/main_banner_04_bg.jpg');} .viewpoint_banner li.box3 img {margin-bottom:9px;} /* 추천강좌&신규과정 공통 */ .bs-title, .ns-title {text-align:center; font-size:40px; color:#333; font-weight:500;} .bs-border-line, .ns-border-line {width:39px; height:2px; margin:10px auto 23px;} /* 컨텐츠 - 추천강좌 */ .section-best-subject {padding:60px 0px;} .bs-txt {color:#666; font-size:17px; text-align:center;} .bs-border-line {background:#ffb92e;} /* 컨텐츠 - 신규과정 */ .section-new-subject {padding:60px 0;} .ns-border-line {background:#1C5C47;} .course_1,.course_2 {margin-top:10px;} .bs-ss-box {height:0; overflow:hidden; padding-bottom:68%; position:relative;} .bs-ss-box img {width:100%; border-radius:10px;} .bs-source-subjcet{height:390px;} .bs-ss-text, .ns-ss-text {padding:0px 10px; min-height:20px; margin-top:15px;} .bs-ss-text2, .ns-ss-text2 {padding:0px 10px; min-height:58px; margin-top:0px; margin-bottom:0px;} .bs-ss-button ul li, .ns-ss-button ul li {width:100%;} .bs-ss-button-r, .bs-ns-button-r {font-size:14px; padding:10px 0; text-align:center; transition:all 0.2s;} .bs-ss-button-l, .ns-ss-button-l{background:#26485f; color:#fff;} .bs-ss-all:hover, .ns-ss-all:hover{} .course_1:after, .course_2:after {content:''; display:block; clear:both;} .course_1 > li, .course_2 > li {float:left; width:23.5%; margin-right:2%; margin-bottom:20px;} .course_1 > li:nth-child(4n), .course_2 > li:nth-child(4n) {margin-right:0;} .course_1 > li:last-child, .course_2 > li:last-child {margin-right:0;} .bs-ss-button,.bs-ns-button {height:40px; width:100%;} .bs-ss-text h1, .ns-ss-text h1 {font-size:20px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical; word-wrap:break-word; line-height: 25px;height:29px;} .bs-ss-text h2, .ns-ss-text h2 {font-size:15px; color:#888; font-weight:400; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical; word-wrap:break-word; line-height: 18px;height:37px; margin-top:3px;} .main_teacher {float:left; font-size:16px; font-weight:normal; color:#888;} .main_price {float:right; font-size:20px; color:#fa2828; letter-spacing:-1px; line-height:24px;} .main_price span.salePersent{color:#6b90dc; font-size:16px;} .main_price span.salePrice{color:#888888; font-size:16px; text-decoration:line-through;} .bs-ss-button-r {background:#ffec9c; color:#333;} .bs-ss-button-r:hover {background:#ffb92e; color:#fff;} .bs-ss-all{border:1px solid #eeeeee; border-radius:11px;} .bs-ss-all:hover {opacity: 0.4;} .bs-ns-button-r {background:#ecf3f0; color:#333;} .bs-ns-button-r:hover {background:#1C5C47; color:#fff;} .ns-ss-all{border:1px solid #eeeeee; border-radius:11px;} .ns-ss-all:hover {opacity: 0.4;} .class_total{margin:5px} .starImg{margin:5px} /* 컨텐츠 - 세미나리스트 */ .seminar_section {display:inline-block; width:100%; background:url('/files/images/main_seminar_bg.jpg') center top; padding:100px 0;} .seminar_section .tit {color:#fff; text-align:center; font-size:26px; margin-bottom:40px;} .seminar_section ul li.box {width:calc(25% - 20px); float:left; min-height:200px; background:#fff; margin-right:20px; margin-bottom:20px; padding:25px; position:relative;} .seminar_section ul li.box:after {content:""; position:absolute; right:0; bottom:0; display:inline-block; width:20px; height:20px;background:#fa2828; transition:all 0.1s;} .seminar_section ul li.box:hover:after {width:50%;} .seminar_section ul li.box:nth-child(4) {margin-right:0;} .seminar_section ul li.empty {background:none;} .seminar_section ul li.empty:after {display:none;} .seminar_section ul li.titBox {background:#fa2828; padding:25px 25px 0 25px;} .seminar_section ul li.titBox h2 {font-size:25px; color:#fff; letter-spacing:-2px; margin-bottom:15px;} .seminar_section ul li.titBox .titBtn {color:#fff; border:1px solid #fff; font-size:20px; text-align:center; padding: 5px 0; transition:all 0.1s;} .seminar_section ul li.titBox .titBtn:hover {color:#fa2828; background:#fff;} .seminar_section ul li.titBox .titBtn a {display:block;} .seminar_section ul li.box ul.semi_list li {font-size:18px; letter-spacing:-2px; line-height:24px; padding-left:12px; position:relative;} .seminar_section ul li.box ul.semi_list li:before {content:"·"; position:absolute; left:0;top:0;} /* 컨텐츠 - 메인교재리스트 */ .main-best-book {padding-top:80px;} .main-best-book .bb-ui {display:table; width:100%;} .main-best-book .bb-ui > li {width:80%; border:1px solid #ddd; border-left:0; padding:30px 10px 30px 30px; display:table-cell; vertical-align:top;} .main-best-book .bb-ui > li:first-child {width:20%; border-left:1px solid #ddd;} .main-best-book .bb-ui-left {padding-top:40px; font-size:18px;} .main-best-book .bb-ui-left .tablinks {margin-bottom:10px;} .main-best-book .bb-ui-left .active {border-bottom:5px solid #000; margin-bottom:10px; width:70%; padding-bottom:0; color:#333; font-weight:500;} .main-best-book .bb-a {cursor:pointer;} .main-best-book .bb-a:hover {color:#fa2828} .main-best-book .tabcontent {padding:0;} .nb-img-box {position:relative; width:100%; height:0; padding-bottom:120%;} .nb-img-out {height:100%; overflow:hidden; width:100%; position:absolute;} .nb-img-in {width:100%; height:100%; display:block; margin:0 auto; border:1px solid #ddd;} .main-best-book .book_tit {text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; width:100%; overflow:hidden; font-size:16px; padding-top:15px; font-weight:400;} .main-best-book .book_price {font-size:18px; padding-top:10px; font-weight:400; color:#fa2828;} @media (max-width: 834px) { .main-best-book .bb-ui > li,.main-best-book .bb-ui > li:first-child {width:100%; display:table;} .main-best-book .bb-ui-left {padding-top:0;} .main-best-book .bb-ui > li {padding:0px 10px 20px; border:0;} .main-best-book .bb-tap {padding-top:15px;} .main-best-book .bb-ui > li:first-child {border:0} .main-best-book .bb-a {font-size:15px;} .main-best-book .bb-ui-left .tablinks {width:calc(100% / 3); float:left; text-align:center; padding-bottom:5px;} } @media (max-width: 480px) { .main-best-book .bb-a {font-size:14px;} } /* 컨텐츠 - 게시판&서브버튼 */ .section-board_button {padding:80px 0; height:500px;} .board_button > ul > li {width:66%;} .board_button > ul > li:last-child{width:33%;} .button > ul > li {margin-left:3%; width:47%; float:left; } .button > ul > li:last-child {margin-left:3%; width:97%;} .board-menu {display:inline-block; margin-left:2%; width:96%; position:relative; margin-bottom:3px;} .board-menu > ul {border-bottom:1px solid #e5e5e5; height:44px;} .board-menu > ul > li {border-top-left-radius:10px; border-top-right-radius:10px; width:33.3%; float:left; height:44px; line-height:44px; font-weight:600; text-align:center; font-size:18px; color:#333; background:#f7f7f7; border:1px solid #e5e5e5; } #issues > a {color:#fff;} .board-menu > ul > li > a {color:#61869e;} .board-menu > ul > li + li {border-left:0; border-top-right-radius:10px;} #view {width:100%; max-width:60px; font-size:30px; background:#ffb92e; color:#fff; height:60px; overflow:hidden; position:absolute; right:0; top:0;} .main_board {float:left; width:100%; border:1px solid #d3d3d3; padding:1.8% 0 2%; border-radius:15px; box-shadow:rgb(100 100 111 / 10%) 0px 5px 25px 0px;} .bbody {width:99.9%; } .btext {position:relative;} .btext > ul > li {padding:0px 25px 4px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .btext a{float:left; width:350px; font-size:14px;} .btext a:hover{color:#1e8aff;} .btext span.no {float:left; width:70px; font-size:13px;} .btext span.nick {float:left; width:90px; font-size:13px;} .btext span.date {float:right; width:95px; font-size:13px;} .bmenus {cursor:pointer;} .bmenus.active {background:#fff; border-bottom:0; border-top-left-radius:10px; border-top-right-radius:10px;} .add-button {position:absolute; background:#000; top:0; right:0; width:10.8%;} .boxnotice .btext > ul > li {padding:3px 25px 4px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .boxnotice .btext a{float:left; width:460px; font-size:14px;} .boxnotice .btext a:hover{color:#1e8aff;} .boxnotice .btext span.no {float:left; width:70px; font-size:13px;} .boxnotice .btext span.nick {float:left; width:90px; font-size:13px;} .boxnotice .btext span.date {float:right; width:95px; font-size:13px;} .button{display:inline-block;} .button2 {margin-top:0px; background:#f7f7f7;} .guide_info {padding:14px 25px; border:1px solid #e5e5e5; width:100%; position:relative;} .b-title {font-size:22px; color:#333; border-bottom:1px solid #e5e5e5; padding-bottom:7px;} .guide_info .b-text .num {font-size:30px; letter-spacing:-.5px; font-weight:600; margin-top:15px;} .guide_info .b-text .text_info {font-size:14px; letter-spacing:-.5px; margin-top:20px; color:#777} .b-text img {position:absolute; bottom:15px; right:25px;} .guide_info .location_btn {display:inline-block; background:#333; margin-top:33px; margin-bottom:10px; border:1px solid #333; transition:all 0.1s; } .guide_info .location_btn a {color:#fff; display:block;padding:8px 45px; } .guide_info .location_btn:hover {background:#fff;} .guide_info .location_btn:hover a {color:#333;} .lecturestudy li.finishstudy {background:#fff;} .lecturestudy li.finishstudy .lectureTxt h2, .lecturestudy li.finishstudy .lectureTxt p, .lecturestudy li.finishstudy .lectureTxt div {color:#000;} @media all and (max-width: 1100px) { .section {width:95%;} /* 컨텐츠 - 세미나리스트 */ .seminar_section ul li.box {width:calc(33% - 20px);} .seminar_section ul li.empty {display:none;} .seminar_section ul li.box:nth-child(4) {margin-right:20px;} .seminar_section ul li.box ul.semi_list li {font-size:17px;} .seminar_section ul li.titBox {padding:20px 20px 0 20px;} .seminar_section ul li.box {padding:17px;} .button > ul > li {width:100%; margin:0;} .board_button > ul > li {width:100%;} .board_button > ul > li:last-child {width:100%;} } /* Tablet Device */ @media all and (min-width: 768px) and (max-width: 1024px) { /* 컨텐츠 - 추천강좌&신규과정 공통 */ .bs-title, .ns-title {font-size:22px;} .bs-ss-title, .ns-ss-title {font-size:20px;} .navy-box {font-size:16px; width:85%;} .course_1 > li, .course_2 > li {width:49%; margin-right:2%;} .course_1 > li:nth-child(even), .course_2 > li:nth-child(even) {margin-right:0;} /* 컨텐츠 - 신규과정 */ .section-new-subject::before {height:70%;} /* 컨텐츠 - 배너버튼 */ .long-img-center {top:26px; left:100px;} .long-text {top:50px; right:150px;} .short-text {position:absolute; top:50px; left:30px;} } @media all and (max-width: 1024px) { .viewpoint_banner li.box {width:calc(50% - 5px); margin:0; background-position:center;} .viewpoint_banner li.box:nth-child(4) {background-position:top;} .viewpoint_banner li.box:nth-child(1),.viewpoint_banner li.box:nth-child(3) {margin-right:5px;} .viewpoint_banner li.box:nth-child(2),.viewpoint_banner li.box:nth-child(4) {margin-left:5px;} .viewpoint_banner li.box:nth-child(1),.viewpoint_banner li.box:nth-child(2) {margin-bottom:10px;} .viewpoint_banner li.box3 {padding-top:80px;} } @media all and (max-width: 768px) { .viewpoint_banner {padding:40px 0;} .viewpoint_banner li.box {min-height:260px; border:0;} .viewpoint_banner li.box .tit {font-size:25px;} .viewpoint_banner li.box img {width:55px;} .viewpoint_banner li.box:nth-child(1), .viewpoint_banner li.box:nth-child(2),.viewpoint_banner li.box:nth-child(3), .viewpoint_banner li.box:nth-child(4) {margin:0; width:calc(50% - 4px);} .viewpoint_banner li.box:nth-child(1), .viewpoint_banner li.box:nth-child(3) {margin-right:2px;} .viewpoint_banner li.box:nth-child(2), .viewpoint_banner li.box:nth-child(4) {margin-left:2px;} .viewpoint_banner li.box:nth-child(1), .viewpoint_banner li.box:nth-child(2) {margin-bottom:4px;} .long_banner {padding:30px 0;} .long_banner ul {width:100%;} .long_banner ul li.txt_section h1 {font-size:30px;} .long_banner ul li.txt_section {text-align:left; width:60%;} .long_banner ul li.img_section {float:right; width:40%; text-align:right; margin-top:15px;} .long_banner ul li.img_section img {width:100%;} .long_banner ul li.txt_section span {font-size:22px;} /* 컨텐츠 - 세미나리스트 */ .seminar_section ul li.box {width:calc(50% - 10px);} .seminar_section ul li.box:nth-child(2),.seminar_section ul li.box:nth-child(4),.seminar_section ul li.box:nth-child(7),.seminar_section ul li.box:nth-child(9) {margin-right:0;} .seminar_section .tit {font-size:20px; width:95%; margin:0 auto 30px;} } @media only screen and (max-width : 480px){ #myCarousel {display:none;} #myCarousel_mobile {display:inline-block;} #myCarousel_mobile > .bx-wrapper {margin:0;} /* 컨텐츠 - 추천강좌&신규과정 공통 */ .bs-title, .ns-title {font-size:30px;} .bs-source-subjcet > ul > li, .ns-source-subjcet > ul > li {width:100%;} .open-source-background {top:410px;} .bs-ss-title, .ns-ss-title {font-size:18px;} .navy-box {width:85%;} .section-best-subject {padding:30px 0 60px;} .section-new-subject {padding:30px 0 60px;} .course_1 > li, .course_2 > li {width:100%; margin-right:0;} /* 컨텐츠 신규과정 */ .section-new-subject::before {height:90%;} /* 컨텐츠 - 세미나리스트 */ .seminar_section ul li.box {width:80%; margin:0 auto 10px; float:none; min-height:auto;} .seminar_section ul li.box:nth-child(2),.seminar_section ul li.box:nth-child(4),.seminar_section ul li.box:nth-child(7),.seminar_section ul li.box:nth-child(9) {margin-right:auto;} .seminar_section ul li.titBox h2 {font-size:20px;} .seminar_section ul li.titBox .titBtn {font-size:17px;} /* 컨텐츠 - 배너버튼 */ .section-banner-button > .section::after{content:''; display:block; clear:both;} .long-img-center {top:30px; left:200px; z-index:1;} .long-img-center img {width:80%;} .long-text {top:55px; left:40px; right:0;} .bb h2 {font-size:24px;} .bb p {margin-top:10px;} .banner-button-short > ul > li {clear:both; width:100%;} .banner-button-short > ul > li:nth-child(2) {margin:0; margin:20px 0;} .long-text > p {margin-top:20px;} .short-text {top:30px;} .short-box1, .short-box2, .short-box3 {height:150px;} /* 컨텐츠 - 게시판&서브버튼 */ .board_button > ul > li {width:100%;} .board_button > ul > li:last-child {width:100%;} .button > ul > li {margin-left:0; margin-top:20px;} .guide_info .b-text .num {font-size:18px;} .guide_info .b-text .text_info {font-size:13px;} } @media only screen and (max-width : 320px){ .long-text {top:50px; left:25px; right:0;} .long-text p {padding-right:20px; font-size:15px;} .short-text {left:25px;} .short-text p {font-size:15px;} } /* Smartphones (landscape) */ @media only screen and (min-width: 480px) and (max-width:834px){ #myCarousel {display:none;} #myCarousel_mobile {display:inline-block;} #myCarousel_mobile > .bx-wrapper {margin:0;} /* 컨텐츠 - 추천강좌&신규과정 공통 */ .bs-title, .ns-title {font-size:20px;} .bs-source-subjcet > ul > li, .ns-source-subjcet > ul > li {width:100%; float:left;} .bs-source-subjcet > ul > li:nth-child(2), .ns-source-subjcet > ul > li:nth-child(2) {margin-right:0;} .open-source-background {top:410px;} .bs-ss-title, .ns-ss-title {font-size:18px;} .navy-box {font-size:16px; width:85%;} .course_1 > li, .course_2 > li {width:49%; margin-right:2%;} .course_1 > li:nth-child(even), .course_2 > li:nth-child(even) {margin-right:0;} /* 컨텐츠 - 신규과정 */ .section-new-subject::before {height:75%;} /* 컨텐츠 - 배너버튼 */ .long-img-center {top:50px; left:50px;} .long-img-center img {width:70%;} .long-text {top:60px; right:80px;} .bb h2 {font-size:22px;} .bb p {font-size:14px;} .short-text {top:60px; left:10px;} /* 컨텐츠 - 게시판&서브버튼 */ .button2 {margin:0;} .board_button > ul > li {width:100%;} .board_button > ul > li:last-child {width:100%;} .button > ul > li {margin-left:0; margin-top:20px; float:left; width:100%;} .button > ul > li:last-child {padding-right:0;} } /* ipad Pro 10.5 */ @media only screen and (min-width:481px) and (max-width:834px) { .long-img-center {top:50px; left:50px;} .long-img-center img {width:70%;} .long-text {right:100px;} } /* 메인페이지 */ .block1, .block2, .block3, .block4 {width: 50%; color: #fff; padding: 30px; position: relative; float: left;} .block1 {min-height: 284px; background: #9acc6d;} .block1 h3, .block3 h3 {color: #fff;} button.more {position: absolute; right: 30px; padding: 0; background: none; font-size: 42px; font-weight: 200; top: 20px;} .block2 {min-height: 284px; background: url(/files/images/block2-bg.jpg) no-repeat center top;} .block3 {min-height: 194px; background: #434343;} .block4 {min-height: 194px; background: url(/files/images/block4-bg.jpg) no-repeat center top; cursor: pointer;} .main-gray {padding: 80px 0; background: #f7f7f8;} .main-board {background: #fff; height: 330px;} .main-board .latest {float: left; width: 50%; position: relative; padding: 40px; } button.more2 {position: absolute; right: 40px; background: url(/files/images/more2.png) no-repeat center top; top: 40px; width: 23px; height: 23px; padding: 0;} ul.community {display: inline-block; width: 100%;} ul.community li {float: left; width: 25%; padding: 60px 0; text-align: center;} /* 로그인/회원가입 */ .box_btn > button {background: #000000; height: 69px; border-radius: 0;} button.find-id, button.join {padding: 10px 19px; height: 32px;} button.join {color: #af0d23;} .sns_login {width:250px; margin: 0 auto;} .naverlogin {width: 250px; height: 50px; color: #1dc700; padding-left: 67px; margin: 2px 0;} .kakaologin {width: 250px; height: 50px; background: url(/files/default-img/login_kakao.png) no-repeat top center; color: #412e34; padding-left: 67px; margin: 2px 0;} .login_sbox .box_btn {text-align: center;} .login_sbox .box_id {width: auto;} .web_login {margin-bottom: -1px; width: 160px;} .login_sbox {width: auto;} #login_box {width: 100%; max-width: 630px; padding: 0px 0 30px; border-radius: 2px; background: #ffffff; border:1px solid #dddddd; margin:0px auto 40px;} .login-title {color: #196dbe;font-size: 28px;font-weight: 600;margin: 30px auto; text-align: center; width:auto;} .logincheck {padding: 10px 0;} .loginForm {width:250px;} .box_member {margin:0 auto;} .idpw_box {border: 0; background: none;} .idpw_box li.id_find, .idpw_box li {float: none; width: 100%;} .form_context {margin:0; font-size: 12px; padding: 0 15%; color: #ff0000; line-height: 1.2;} .find_form .small_txt {margin: 0;} .find_form fieldset {margin:0; padding: 0; border: 0;} .btn-confirm {background: #000;} .stit_all {background: none;} button.cancel {background: #969696;} #member_join {margin: 0; border: 0; text-align: center; height: auto;} .member_box {float: none; width: 100%;} .box_title {font-size: 24px; color: #000; font-weight: 800; margin-bottom: 20px;} .box_text {font-size: 13px; line-height: 1.5;} /* 통합검색 */ .search {width:100%; max-width:800px; margin:50px auto;} .tword-box {text-align: center; margin-bottom: 50px; position: relative;} .serch-title {display: none;} input.tword {display: inline-block; width: 100%; max-width: 474px;height: 45px;border: 2px solid #af0d23; background-color:#fff;} input.btn-tword {position: relative; top: -2px; left: -5px;} li.search-img {float:left;width:20%;} li.search-content {float:left;width:80%;} /* 나의 학습강좌 */ .my-class .block-thumb {width: 150px;} .detail-top .right th, #lec-list table th, button {font-weight: 500;} button.large {font-size: 13px;} .contable .subject {font-size:15px; color:#333;} .table-title .section-box .ul-1 li {line-height:initial; font-size:15px;} .table-textlist .section-box .ul-1 > li {line-height:initial; font-size:15px;} .dtable {font-size:14px;} @media all and (max-width: 640px) { .table-textlist .section-box .ul-1 > li,.contable .subject {font-size:13px;} } /* 모바일 */ .sub-body.mobile .bar_log {padding:20px 0; border:5px solid #eee; text-align:center; margin-top:20px;} .sub-body.mobile .bar_log img {width:700px;} /* 기관소개 */ .sub-body.about .top_tit { font-size:33px; text-align:center; font-weight:400; letter-spacing:-.5px; } .sub-body.about .top_tit em {font-weight:500; font-size:1.1em;font-style:normal} .sub-body.about .bar_log {padding:20px 0; border:20px solid #eee; text-align:center; margin-top:40px;} .sub-body.about .bar_log img {width:250px;} .sub-body.about .txt_info_a {font-size:22px; text-align:center; letter-spacing:-.5px; margin: 40px 0;} .sub-body.about .img_txt {width:100%; display:inline-block;} .sub-body.about .img_txt ul li {width:50%; float:left;} .sub-body.about .img_txt ul li .txt {padding-top:120px;} .sub-body.about .img_txt ul li .txt h1 {font-size:24px; } .sub-body.about .img_txt ul li .txt .mark {position:relative; z-index:0; display:inline-block;} .sub-body.about .img_txt ul li .txt .mark:before {content:""; position:absolute; width:100%; height:12px; background:rgba(24,92,71,0.3); left:0; bottom:3px; z-index:-1;} .sub-body.about .img_txt ul li .txt h2 {font-size:20px; letter-spacing:-.5px;font-weight:400;} .sub-body.about .img_txt.bottom_space {margin-bottom:20px;} .long_banner.about { background-image:url('/files/images/sub_01_long_bg.jpg'); letter-spacing:2px; margin-top:80px; } .long_banner.about h1 {color:#625123; font-size:25px; line-height:30px;} .long_banner.about h2 {color:#fff; font-size:23px; margin-top:5px;} .sub-subject_a {font-size:24px; margin:80px 0 40px;; padding-left:15px; position:relative;} .sub-subject_a:before {content:""; display:inline-block; width:10px; height:10px; border-radius:50%; background:#185c47; position:absolute; left:0; top:50%; margin-top:-5px;} .object_section p, .major_section p {font-size:21px; margin-bottom: 20px; letter-spacing:-.5px;} .sub-body.about .img_txt ul li .txt .say {color:#f6cc2f; font-size:34px; position:relative; padding-left:45px;} .sub-body.about .img_txt ul li .txt .say .left_img {margin-top:-2px; position:absolute; top:-10px; left:0;} .sub-body.about .img_txt ul li .txt p {font-weight:800;} .sub-body.about .img_txt ul li .txt.bottom {padding-top:90px;} .sub-body.about .img_txt.say {margin-top:20px;} .sub-body.about .img_txt ul li .txt.bottom p {margin-bottom:0;} .sub-body.about ul.major_list {width:100%; display:inline-block;} .sub-body.about ul.major_list li {width:calc(50% - 10px); float:left; background:#f6f6f6; margin-right:20px; padding:20px 30px; border-radius:10px;} .sub-body.about ul.major_list li:nth-child(2), .sub-body.about ul.major_list li:nth-child(4) {margin-right:0;} .sub-body.about ul.major_list li:nth-child(1), .sub-body.about ul.major_list li:nth-child(2) {margin-bottom:20px;} .sub-body.about ul.major_list li:nth-child(3) {min-height:135px} .sub-body.about ul.major_list li .sub_01_icon {width:80px; height:80px; border-radius:50%; float:left; border:1px solid #e2e2e2; background:#fff; text-align:center; line-height:80px;} .sub-body.about ul.major_list li .sub_01_icon img {width:80%;} .sub-body.about ul.major_list li p {font-size:18px; padding-left:95px; padding-top:15px;} .sub-body.about ul.major_list li p.topnone {padding-top:0;} @media all and (max-width: 1100px) { .sub-body.about .img_txt ul li {width:100%;} .sub-body.about .img_txt ul li .txt {padding-top:40px;} .sub-body.about .img_txt {margin-bottom:80px;} .sub-body.about .img_txt.bottom_space {margin-bottom:40px;} .long_banner.about h1,.long_banner.about h2 {text-align:center;} .sub-body.about .img_txt.say ul li {text-align:left;} .sub-body.about .img_txt ul li .txt.bottom {padding:20px 0 40px;} .sub-body.about .img_txt.say {margin-top:0; margin-bottom:0;} .object_section p, .major_section p {font-size:18px;} } @media all and (max-width: 834px) { .sub-body.about .top_tit {font-size:25px;} .sub-body.about .txt_info_a {font-size:18px;} .long_banner.about h1 {font-size:20px; text-align:left;} .long_banner.about h2 {font-size:17px; text-align:left;} .sub-body.about ul.major_list li {width:100%; margin:0;} .sub-body.about ul.major_list li:nth-child(3) {min-height:auto; margin-bottom:20px;} .sub-body.about .img_txt ul li .txt h2 {font-size:17px;} .sub-body.about .img_txt ul li img {width:100%;} .sub-body.about .img_txt.say ul li img {width:auto;} .sub-body.about .img_txt.say ul li img.img_im {width:100%;} .long_banner.about {margin-top:20px;} .sub-body.about .img_txt {margin-bottom:20px;} } @media all and (max-width: 640px) { .sub-body.about .top_tit {font-size:20px;} .sub-body.about .bar_log img {width:180px;} .sub-body.about .txt_info_a {font-size:15px;} .sub-body.about .img_txt ul li .txt h2 {font-size:15px;} .sub-body.about ul.major_list li {padding:15px} .sub-body.about ul.major_list li p {font-size:12px;} .sub-body.about ul.major_list li p.topnone {padding-top:15px;} .object_section p, .major_section p {font-size:16px;} .sub-body.mobile .bar_log {padding:0px 0; border:0px solid #eee; text-align:center; margin-top:20px;} .sub-body.mobile .bar_log img {width:100%;} } .ceo_intro .ceo_img {display:inline-block; width:400px; vertical-align:top;} .ceo_intro .intro_txt {display:inline-block; width:calc(100% - 403px); padding-left:55px; vertical-align:top;} .ceo_intro .ceo_tit {position:relative; font-size:31px; letter-spacing:-1px; font-weight:500; color:#1c5c47;} .ceo_intro .ceo_tit span {font-size:0.7em; font-weight:400;} .ceo_intro .profileList {margin-top:60px;} .ceo_intro .profileList li {position:relative; padding-left:220px; color:#888;} .ceo_intro .profileList li strong {position:absolute; top:0; left:0; font-size:26px; letter-spacing:-1px; font-weight:500;} .ceo_intro .profileList li:before {content:""; display:block; position:absolute; top:0; left:180px; width:2px; height:100%; background:#000;} .ceo_intro .profileList li p.profileTxt {font-size:17px; position:relative;} .ceo_intro .profileList li p.profileTxt:before {content:""; display:inline-block; width:3px; height:3px; border-radius:50%; background:#1c5c47; position:absolute; top:13px; left:-10px; } .ceo_intro .profileList li p.profileTxt+p.profileTxt {margin-top:13px;} .ceo_intro .ceo_info {margin:65px 0 60px;} .ceo_intro .ceo_info img {width:200px; margin-bottom:20px;} .ceo_intro .ceo_info p {font-size:18px; color:#333; line-height:33px} .location_tit p {display:inline-block; padding:3px 23px 5px; background:#1C5C47; border-radius:20px; font-size:17px; color:#fff; margin-bottom:15px;} .location_tit .location_txt {margin:20px 0;} .location_tit .location_txt h1 {font-size:18px; font-weight:400;} .location_tit .location_txt h2 {font-size:18px; font-weight:400; color:#333; letter-spacing:-1px;} .location_tit .location_txt img {width:20px; margin-bottom:8px;} .location_tit .location_txt.bottom {border-bottom:1px solid #eee; padding-bottom:15px; margin-bottom:30px;} .bank_course .tit,.bank_course .course_month {display:inline-block; padding:4px 23px 5px; background: #548687; border-radius:20px; font-size:17px; color:#fff; margin-top:40px; font-weight:400;} .bank_course .tit.first {background:#8FBC94} .bank_course .txt {color:#666; line-height:28px; font-size:16px; padding-top:10px;} .bank_course .txt_tit {color:#000; font-size:20px; margin-bottom:9px; font-weight:700; margin-top:30px;} .bank_course .list_txt {padding-left:12px; line-height:27px; font-size:16px; font-weight:300; color:#525252;} .bank_course .list_txt.first {margin-top:15px;} .bank_course .content-subject {font-size:30px;padding-bottom:15px; margin-top:50px; font-weight:500; position:relative; margin-left:15px; color:#333; display:inline-block; z-index:0;} .bank_course .content-subject.topnone {margin-top:0;} .bank_course .content-subject:before {content:""; display:inline-block; width:10px; height:10px; border-radius:50%; background:#185c47; position:absolute; left:-15px; top:50%; margin-top:-17px;} .bank_course .couse_con {border-bottom:1px solid #ddd; padding-bottom:50px;} .bank_course .couse_con.a_2 .content-subject:after{background:rgb(212 153 185 / 50%)} .bank_course .couse_con.a_2 .course_month{background:#D499B9} .bank_course .couse_con.a_3 .content-subject:after {background:rgb(132 177 237 / 50%)} .bank_course .couse_con.a_3 .course_month {background:#84B1ED} .bank_course .couse_con.a_4 .content-subject:after {background:rgb(241 107 111 / 50%)} .bank_course .course_month {margin-left:15px;} .banksystem .content-subject.block {display:block;} .banksystem .study_list {width:100%; display:inline-block; margin-top:20px;} .banksystem .study_list li {float:left; width:50%; padding:7px 5px; font-size:16px; color:#8a8a8a; } .banksystem .study_list li >.wrapper {padding:13px 20px; background:#f9f9f9; border:2px solid #ddd} .banksystem .study_list li span {color:#f18a8a; font-weight:500;} .banksystem .width_3 {width:100%;} .banksystem .width_3 th {background:#ECF3F0; padding:10px 0; color:#333; font-size:18px; border-top:2px solid #3c9276;} .banksystem .width_3 td {text-align:center; font-size:15px; padding:10px 0; border-bottom:1px solid #f5f5f5;} .banksystem .width_3 td.back {background:#ECF3F0; padding:10px 0; color:#333; font-size:18px; border-top:1px solid #3c9276;} .banksystem .width_3 .right_border { border-right:1px solid #3c9276;} .banksystem .mean_txt {width:100%; display:inline-block; margin-top:25px;} .banksystem .mean_txt li {float:left; margin-left:35px; position:relative; display:table;} .banksystem .mean_txt li span {width:200px; height:200px; border-radius:50%; display:table-cell; font-size:18px; text-align:center; vertical-align:middle} .banksystem .mean_txt li.li1 span,.banksystem .mean_txt li.li2 span {color:#828282; background:#f1f1f1;} .banksystem .mean_txt li.li3 span {background:#8eca6a; color:#fff;} .banksystem .mean_txt li.li4 span {background:#06b083; color:#fff;} .banksystem .mean_txt li:after {content:""; position:absolute; right:-22px; top:50%; width:0; height:0; border-top:9px solid transparent; border-bottom:9px solid transparent } .banksystem .mean_txt li.li2:after {border-left:11px solid #8eca6a;} .banksystem .mean_txt li.li3:after {border-left:11px solid #06b083;} .banksystem .mean_txt li.li1:after,.banksystem .mean_txt li.li4:after {display:none;} .banksystem .redPoint {color:#f18a8a; font-weight:500;} .subpage_btn_t {text-align:center; margin-top:20px;} .subpage_btn_t.right {text-align:right;} .subpage_btn_t img.ceo_btn_img {width:30px; margin:0; margin-right:8px;} .subpage_btn_t img.course_btn_img {margin-left:8px;} .subpage_btn_t a {padding:10px 30px; border:2px solid #1c5c47; font-size:15px; color:#fff; display:inline-block; border-radius:35px; background:#1c5c47; transition:all 0.1s;} .subpage_btn_t a .hover_img {display:none;} .subpage_btn_t a:hover {background:#fff; color:#1c5c47} .subpage_btn_t a:hover .hover_img {display:inline-block;} .subpage_btn_t a:hover .re_img {display:none;} .courseinfo .content-subject:after {content:""; position:absolute; width:100%; height:7px; background:rgba(24,92,71,0.3); left:0; bottom:22px; z-index:-1;} .courseinfo {padding-bottom:80px;} .courseinfo .course_info_01 {width:100%; display:inline-block; border:1px solid #ddd; background:#fbfbfb;margin-top:40px;} .courseinfo .course_info_01 li {width:50%; float:left; padding:0 50px 50px;} .courseinfo ul.boxList {width:100%; display:inline-block;} .courseinfo ul.boxList li.box {width:calc(25% - 20px); float:left; min-height:200px; border:1px solid #ddd; background:#fbfbfb; margin-right:20px; margin-bottom:20px; padding:25px; position:relative;} .courseinfo ul.boxList li.box:after {content:""; position:absolute; right:0; bottom:0; display:inline-block; width:10px; height:10px;background:#fa2828; transition:all 0.1s;} .courseinfo ul.boxList li.box:nth-child(4) {margin-right:0;} .courseinfo ul.boxList li.box ul.semi_list li {font-size:18px; letter-spacing:-2px; line-height:24px; padding-left:12px; position:relative;} .courseinfo ul.boxList li.box ul.semi_list li:before {content:"·"; position:absolute; left:0;top:0;} /* 동영상 재생환경 */ .media .tit,.bank_course .course_month {display:inline-block; padding:4px 23px 5px; background: #548687; border-radius:20px; font-size:17px; color:#fff; margin-top:40px; font-weight:400;} .media .tit.first {background:#8FBC94} .media .txt {color:#666; line-height:28px; font-size:16px; padding-top:10px;} .media .txt_tit {color:#000; font-size:20px; margin-bottom:9px; font-weight:700; margin-top:30px;} .media .txt_ctit {color:#000; font-size:18px; text-align:center; margin-bottom:9px; font-weight:700; margin-top:30px;} .media .list_txt {padding-left:12px; line-height:27px; font-size:16px; font-weight:300; color:#525252;} .media .list_txt.first {margin-top:15px;} .media .content-subject {font-size:26px;padding-bottom:15px; margin-top:50px; font-weight:500; position:relative; margin-left:15px; color:#333; display:inline-block; z-index:0;} .media .content-subject.topnone {margin-top:0;} .media .content-subject:before {content:""; display:inline-block; width:10px; height:10px; border-radius:50%; background:#104a82; position:absolute; left:-15px; top:50%; margin-top:-17px;} .media .couse_con {border-bottom:1px solid #ddd; padding-bottom:50px;} .media .couse_con.a_2 .content-subject:after{background:rgb(132 177 237 / 50%)} .media .couse_con.a_2 .course_month{background:#84B1ED} .media .couse_con.a_3 .content-subject:after {background:rgb(132 177 237 / 50%)} .media .couse_con.a_3 .course_month {background:#84B1ED} .media .couse_con.a_4 .content-subject:after {border-bottom:1px solid #fff; background:rgb(132 177 237 / 50%)} .media .course_month {margin-left:15px;} .media .content-subject:after {content:""; position:absolute; width:100%; height:7px; background:rgba(132 177 237 / 50%); left:0; bottom:22px; z-index:-1;} .media {padding-bottom:80px;} .media .course_info_01 {width:100%; display:inline-block; border:1px solid #ddd; background:#ffffff; margin-top:40px;} .media .course_info_01 li {width:50%; float:left; padding:30px 50px 30px;} .media .course_info_01 li .con{width:100%; text-align:center;} .media .course_info_01 li .con img{text-align:center;} .media ul.boxList {width:100%; display:inline-block;} .media ul.boxList li.box {width:calc(25% - 20px); float:left; min-height:200px; border:1px solid #ddd; background:#ffffff; margin-right:20px; margin-bottom:20px; padding:25px; position:relative;} .media ul.boxList li.box:nth-child(4) {margin-right:0;} .media ul.boxList li.box ul.semi_list li {list-style-type:none; font-size:18px; letter-spacing:-2px; line-height:24px; padding-left:12px; position:relative;} .media ul.boxList li.box ul.semi_list li .con{width:100%; text-align:center;} .media ul.boxList li.box ul.semi_list li .con img{text-align:center;} .media_btn_t {text-align:center; margin-top:20px;} .media_btn_t.right {text-align:right;} .media_btn_t a {padding:10px 30px; border:2px solid #104a82; font-size:15px; color:#fff; display:inline-block; border-radius:35px; background:#104a82; transition:all 0.1s;} .media_btn_t a .hover_img {display:none;} .media_btn_t a:hover {background:#fff; color:#104a82} .media_btn_t a:hover .hover_img {display:inline-block;} .media_btn_t a:hover .re_img {display:none;} @media all and (max-width: 1100px){ .ceo_intro .intro_txt {padding-left:2%;} .ceo_intro .profileList li {padding-left:200px;} .ceo_intro .profileList li:before {left:160px;} .courseinfo ul.boxList li.box {width:calc(33% - 20px)} .courseinfo ul.boxList li.box:nth-child(4) {margin-right:20px;} .courseinfo ul.boxList li.box ul.semi_list li {font-size:16px;} .banksystem .mean_txt li span {width:150px; height:150px; font-size:14px; } } @media all and (max-width: 900px) { .ceo_intro .intro_txt {width:100%; padding-left:0;} .ceo_intro .ceo_img {width:100%; text-align:center;} .ceo_intro .ceo_img img {width:400px;} .ceo_intro .ceo_tit {text-align:center;} } @media all and (max-width: 834px) { .courseinfo ul.boxList li.box {width:calc(50% - 20px)} .viewpoint_banner li.box h1.tit {font-size:20px;} .btn-area.pause {width:100%; display:block;} } @media all and (max-width: 640px) { .ceo_intro .ceo_tit {font-size:18px; margin-top:20px;} .ceo_intro .profileList {margin-top:30px; padding-left:20px;} .ceo_intro .profileList li strong {position:initial; font-size:20px; display:inline-block; margin-bottom:5px;} .ceo_intro .profileList li p.profileTxt {font-size:15px;} .ceo_intro .profileList li p.profileTxt+p.profileTxt {margin-top:8px;} .ceo_intro .profileList li {padding:0;} .ceo_intro .profileList li:before {display:none;} .ceo_intro .ceo_info p {font-size:16px; line-height:29px;} .ceo_intro .profileList li p.profileTxt:before {top:9px;} .logo_img_ceo {text-align:center;} .location_tit .location_txt h2 {font-size:16px;} .location_tit .location_txt h1 {font-size:15px;} .banksystem .study_list li {width:100%;} .courseinfo .course_info_01 li {width:100%;} .courseinfo ul.boxList li.box {width:100%; min-height:155px;} .bank_course .tit, .bank_course .course_month {margin-top:20px;} .banksystem .width_3 th,.banksystem .width_3 td.back {font-size:16px;} .media .txt_tit {color:#000; font-size:20px; margin-bottom:9px; font-weight:700; margin-top:10px;} .media .course_info_01 li {width:100%; padding:20px 20px 20px;} .media .course_info_01 li .con img{width:100%;} .media ul.boxList li.box {width:100%; min-height:155px;} .media .tit, .bank_course .course_month {margin-top:20px;} .media ul.boxList li.box ul.semi_list li img{margin: 0 auto;} } @media all and (max-width: 400px) { .ceo_intro .ceo_img img {width:100%;} .banksystem .mean_txt li span {width:100px; height:100px; font-size:13px;} .agree-box {margin:0 auto 20px;} .sub-body {padding:0px 0;} .con_center{margin-left:1%; text-align:center; width:98%;} .con_center img{text-align:center; width:100%;} } @media (max-width: 820px) { .bg {padding:60px 0;} .classList ul li {width:49%; margin-right:1%;} .classList ul li:nth-child(2n) {margin-right:0;} .classList ul li:nth-child(3n) {margin-right:1%;} .new_class .course_1 li {margin-right:1%; width:24%;} .long_banner ul li.txt_section {width:60%; padding-top:18px;} .long_banner ul li.img_section {width:40%;} .long_banner ul {width:100%; margin:0 auto;} .long_banner ul li.img_section img{width:100%;} .gasipan .subject_title h1 {font-size:23px; margin-bottom:5px; letter-spacing:-1px;} .gasipan {display:inline-block; width:100%; padding:50px 0;} .gasipan .left_sec {width:60%; margin-right:3%; float:left;} .gasipan .right_sec {width:36%; float:left; margin-top:-10px;} .gasipan .list_four {display:inline-block; width:100%;} .gasipan .list_four li {width:48%; margin-right:4%; float:left; text-align:center; margin-bottom:4%; border-radius:15px; box-shadow:rgb(100 100 111 / 10%) 0px 5px 25px 0px;} .gasipan .list_four li a {display:block; padding:5px 0;} .gasipan .list_four li a img{width:40%;} .gasipan .list_four li a:hover{border:1px solid #1e8aff; border-radius:15px; } .gasipan .list_four li:nth-child(7),.gasipan .list_four li:nth-child(8) {margin-bottom:0;} .gasipan .list_four li:nth-child(2n) {margin-right:0;} .gasipan .list_four li h1 {color:#000; font-size:17px; letter-spacing:-0.05em; font-weight:600; margin-top:0px;} .gasipan .list_four li:hover h1 {color:#1e8aff;} .board-menu > ul > li {width:50%; } .btext > ul > li {padding:0px 15px 8px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .btext a{width:200px;} .btext span.no {float:left; width:40px; font-size:13px;} .btext span.nick {display:none; float:right; width:70px; font-size:13px;} .btext span.date { float:right; width:95px; font-size:13px;} .boxnotice .btext > ul > li {padding:0px 15px 8px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .boxnotice .btext a{float:left; width:70%; font-size:14px;} .boxnotice .btext span.nick { float:right; width:40px; font-size:13px;} } @media (max-width: 640px) { .classList ul li {width:100%; margin-right:0;} .cop_txt br {display:none;} .tea_li li {width:100%; margin-right:0; margin-bottom:4%;} .cop_tit br {display:none;} .padt80 {padding-top:60px;} .pad80 {padding:60px 0;} .cop_li {display:block;} .cop_li2 li {display:block; width:100%; padding:20px 20px 40px;} .cop_li2 li:first-child {width:100%; text-align:center;} .cop_bg_txt {font-size:17px; font-weight:400;} .cop_bg_txt br {display:none;} } @media (max-width: 480px) { .new_class .course_1 li {width:100%; margin-right:0;} .subject_title h1 {font-size:24px; margin-bottom:15px;} .classList .txt_wrap {padding:25px 5%;} .long_banner {padding:0px 0;} .long_banner h1 {font-size:20px; line-height:35px;} .long_banner h2 {font-size:15px; margin-bottom:30px;} .long_banner ul li.txt_section h1 {font-size:20px;} .long_banner ul li.txt_section span {font-size:32px;} .gasipan .left_sec {width:100%; margin-right:0;} .gasipan .right_sec {width:100%; margin-top:30px;} .gasipan .list_four li h1 {font-size:15px;} .teali4 li {width:100%; margin-right:0;} .teali4 li:first-child {margin-bottom:2%;} .tea_txt {position:relative; top:-20px; left:0;} .etc_three_box > li {clear:both; width:100%; margin-right:0; margin-top:20px;} .etc_three_box > li:nth-child(2) {width:100%;} .etc_three_box > li:nth-child(3) {width:100%;} span.fullmenu-tag {display:none;} .btext a{float:left; width:50%; font-size:14px;} .btext span.date{float:right; width:70px; font-size:13px;} .board-menu > ul > li {width:50%; } .btext > ul > li {padding:0px 15px 8px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .btext span.no {float:left; width:40px; font-size:13px;} .btext span.nick {display:none;} .boxnotice .btext > ul > li {padding:0px 15px 8px; font-size:16px; color:#222; width:100%; text-overflow:ellipsis; white-space:nowrap; word-wrap:normal; overflow:hidden;} .boxnotice .btext a{float:left; width:70%; font-size:14px;} .boxnotice .btext span.nick {float:right; width:40px; font-size:13px;} .bg {padding:20px 0;} .menu_box01{float:auto; width:100%;} .menu_box02{float:auto; width:100%;} .menu_box03{float:auto; width:100%;} .menu_box04{float:auto; width:100%;} .menu_box05{float:auto; width:100%;} .menu_box06{float:auto; width:100%;} } @media (max-width: 320px) { .cop_li2 img {width:100%;} }