input[type='radio']:checked + label{color: #296EB2;} ::selection{background-color: #2974be; color: #fff;} .file_delete{ font-size: 10px !important; padding: 3px 10px !important; box-sizing: border-box; cursor: pointer; border-radius: 100px; margin: 0 3px; border: 1px solid #C53636; color:#C53636;} .file_delete:hover{ color:#fff; background:#C53636;} /* 토글버튼 */ .toggleSwitch_wrapper { float: right; display: flex; align-items: center; justify-content: center; margin-bottom: 10px; gap: 10px; } .toggleSwitch_wrapper .toggleSwitch { display: flex; align-items: center; justify-content: flex-end; background: var(--toggle_btn-background); padding: 3px; border-radius: 100px; } .toggleSwitch_wrapper .toggleButton .iconBox { background: #c7c7c7; padding: 3px; border-radius: 50px; position: relative; width: 18px; height: 18px; display: flex; align-items: center; justify-content: center; } .toggleSwitch_wrapper .toggleButton.active .iconBox { background: #c3dcfa; } .toggleSwitch_wrapper .toggleButton.active .iconBox i { color: #003B83; } .toggleSwitch_wrapper .toggleButton .iconBox i { color: #777; font-size: 12px; } .toggleSwitch_wrapper i.active {color: #003B83;} .toggleSwitch_wrapper .toggleSwitch .toggleButton { width: 95px; display: flex; align-items: center; justify-content: center; gap: 6px; cursor: pointer; padding: 5px 0; border-radius: 100px; color: var(--light-gray); font-size: 14px; } .toggleSwitch_wrapper .toggleSwitch .toggleButton.active { background: var(--white); box-shadow: 0px 0px 6px -2px #111; color: var(--dark_gray); } /* 서브페이지 껍데기 */ .sub_con{width: 100%; overflow: hidden; background: url("/img/sub/sub_bg.png") no-repeat top/contain;} .sub_bn{width: 100%; overflow: hidden; } .sub_bn .titBox{text-align: center; overflow: hidden; box-sizing: border-box; padding: 40px 0;} .sub_bn .titBox h3.tit{font-size: 30px; font-weight: normal; margin-bottom: 10px;} .sub_bn .titBox p.eng{font-size: 20px; color:#747474; font-weight: 400; text-transform: uppercase;} .sub_content{width: 100%; background: #fff; } .sub_content .sub_content_inner{overflow: hidden; width: 1200px; margin: 0 auto; box-sizing: border-box; padding: 40px 0;} /* left 메뉴 */ .leftMenu{width: 190px; display: inline-block; float: left;} .leftMenu p.mainTit{font-size:24px; text-align: center; color:var(--color-primary); margin-bottom: 20px; font-weight:600;} .leftMenu > ul.mainMenu{width: 100%; overflow: hidden; border: 1px solid #E3E3E3;} .leftMenu > ul.mainMenu > li{width: 100%; border-top: 1px solid #e3e3e3; font-weight: 400; } .leftMenu > ul.mainMenu > li:first-child{border-top: 0px;} .leftMenu > ul.mainMenu > li > a{color: #878787; width: 100%; height: 100%; display: block; box-sizing: border-box; padding: 15px 10px; font-size:16px;} .leftMenu > ul.mainMenu > li > a.on{background: linear-gradient(to right, var(--color-primary-dark), var(--color-primary)); color:#fff;font-weight: bold; } .leftMenu > ul.mainMenu > li:hover{ } .leftMenu > ul.mainMenu > li:hover > a{ background: linear-gradient(to right, var(--color-primary-dark), var(--color-primary)); color:#fff;font-weight: bold; } .leftMenu > ul.mainMenu > li:after{background: linear-gradient(to right, var(--color-primary-dark), var(--color-primary)); position: absolute; content: ''; width: 0%; height: 100%; left: 0; top:0; z-index: -1;} .leftMenu ul.subMenu{ background:#f9f9f9; width:100%; overflow:hidden; } .leftMenu ul.subMenu li a{box-sizing:border-box; padding: 10px 15px; font-size:14px; font-weight:; width:100%; display:block; color:#777;} .leftMenu ul.subMenu li:hover a{ color: #003B83; font-weight:550;} .leftMenu ul.subMenu li a.on{ color: #003B83; font-weight: bold;} .main_con{display: inline-block; float: right; width: 80%; } .main_con .content{box-sizing:border-box; padding: 10px 0px; line-height:1.7;} .main_con .titBox{width: 100%; overflow: hidden; box-sizing: border-box; padding-bottom:16px; border-bottom: 1px solid #979797;} .main_con .titBox h3{font-size:30px; font-weight: bold; display: inline-block; float: left;} .main_con .titBox .naviBox{display: inline-block; float: right; height: 100%; margin-top: 10px;} .main_con .titBox .naviBox ul{overflow: hidden; vertical-align: middle; } .main_con .titBox .naviBox ul li{display: inline-block;float: left;margin-right: 20px;padding-right: 10px;box-sizing: border-box;position: relative; color: #979797; font-weight: 400; cursor:pointer; font-size:16px;} .main_con .titBox .naviBox ul li:last-child{margin-right: 0px;padding-right: 0px;} .main_con .titBox .naviBox ul li:after{position: absolute;content: ">";right: -12px;top: -6%; font-size: 16px;} .main_con .titBox .naviBox ul li:last-child:after{display: none;} .main_con .in_con{width: 100%;} .main_con .in_con .in_con_inner{width: 100%; box-sizing: border-box; padding: 30px 0px;} .main_con .in_con .in_con_inner section{width: 100%; margin-bottom:50px;} .main_con .in_con .in_con_inner section:last-child{margin-bottom:0px;} .main_con .in_con .in_con_inner section h3.tit{width: 100%; font-size: 22px; font-weight: bold; margin-bottom: 10px;} .main_con .in_con .in_con_inner section h3.tit img{margin-right: 10px; margin-top: -5px;} .main_con .in_con .in_con_inner section p{box-sizing: border-box; padding-left: 35px; font-weight: 400; line-height: 1.7;} .main_con .in_con .in_con_inner section p img{text-align: center;} /* 게시판 리스트 스타일 */ .table_list{width: 100%; overflow:hidden; font-size: 16px;} .table_list ul{width: 100%; overflow: hidden; border-bottom:1px solid #ddd; clear: both; display:table; border-collapse: collapse; table-layout: fixed; word-break: break-all; height: auto;} .table_list ul > ul:last-child{border-bottom: 0px;} .table_list ul li{ display:table-cell; text-align: center; vertical-align: middle; font-weight: 400;overflow:hidden; text-overflow:ellipsis; white-space:nowrap; width: 100%; } .table_list ul li.left{text-align: left; padding: 0px;} .table_list ul li.left img{margin-top: -4px; margin-right: 5px;} .mypage_qna ul li.left a img{margin-top: -4px; } .table_list ul li.left a{padding: 30px 10px; box-sizing: border-box; cursor: pointer;} .table_list ul:hover{ color: var(--color-primary);} .table_list ul:hover li {font-weight: bold; } .table_list ul li.left a{width: 100%; height: 100%; display: inline-block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; } .table_list.table_list_board ul.head{ background: var(--color-primary-bglight); border-top: 1px solid var(--color-primary);} .table_list.table_list_board ul.head li{ font-weight:bold; padding: 15px 10px; color:var(--color-primary); box-sizing: border-box;} .table_list.table_list_board ul.noti{background: var(--color-border-light);} .table_list.table_list_board ul.noti li{font-weight: bold;} .table_list.table_list_board ul.noti li.noti_ico { color: var(--color-primary); font-weight: 600;} .main_con .titBox.titBox_b{border-bottom: 1px solid #ddd !important; } .table_list.table_list_board .none_result{ margin-top:0px !important;} .table_list.table_list_board .none_result li{box-sizing: border-box; padding:40px; background:#fff;} .none_result{box-sizing: border-box; padding:40px;text-align:center; background: var(--color-border-light); margin-top:30px; font-weight:400;cursor:default !important;} span.b_main{background: #B05D8E; color:#fff; font-size:14px; font-weight: 400; box-sizing:border-box; padding: 2px 10px; margin-right: 5px; display:inline-block; border-radius:100px;} span.notice{color: #3A5673; width:30px; height:30px; border-radius:100%; background:#003D7C ;display:inline-block;text-align:center; vertical-align:middle; } .table_row span.notice{margin-right:5px;} span.notice i{color:#fff; font-size:12px;} .table_list.table_list_board ul .li_01{width:4%;} .table_list.table_list_board ul li.li_02{width:30%;} .table_list.table_list_board ul li.li_03{width:5%;} .table_list.table_list_board ul li.li_04{width:6%;} .table_list.table_list_board ul li.li_05{width:7%;} .table_list.table_list_board ul li.li_06{width:5%;} .job_list ul li{box-sizing: border-box; padding: 10px;} .job_list ul .li_02{width:20% !important;} .job_list ul .li_03{width:10% !important;} .job_list ul .li_04{width:15% !important;} .job_list ul .li_05{width:10% !important;} .job_list ul .li_06{width:10% !important;} /* 페이징 .pasing{text-align: center; width: 100%; box-sizing: border-box; padding: 30px 0;} .pasing ul{overflow: hidden;} .pasing ul li{ display: inline-block; margin-right: 10px; cursor: pointer; width:35px; height: 35px; line-height: 35px;} .pasing ul li:last-child{margin-right: 0px;} .pasing ul li.now{border: 1px solid #aaa; border-radius: 100px; background:#3A81C7; border: 1px solid #3A81C7;color:#fff;} .pasing ul li.arrow{border: 1px solid #aaa; border-radius: 100px; width:35px; height: 35px; line-height: 35px; } */ .pasing{width:100%; overflow:hidden; text-align:center; padding:30px 0; box-sizing:border-box;} .pasing ul{width:100%; overflow:hidden;} .pasing ul li{display:inline-block; margin:0px 10px; cursor:pointer; font-size:15px; font-weight:400; } .pasing ul li.now{ border-bottom:2px solid var(--color-primary); font-weight: bold; color: var(--color-primary);} .pasing ul li.arrow{background: var(--color-primary); color: #fff; border-radius: 100px; width: 25px; height: 25px; line-height: 25px; margin:0px;} /* 검색창 */ .search_Box{ width: 100%; text-align: center; box-sizing: border-box; padding: 50px 0;} .search_Box .search{ overflow: hidden;display: inline-block; text-align: left; border: 2px solid; border-image: linear-gradient(to right, #5B6AB7, #9FA9E3); border-image-slice: 1; box-sizing: border-box; padding:8px 16px; } .search_Box .search select{display: inline-block; margin-right: 10px;border: none; width: 100px} .search_Box .search .in{display:inline-flex; align-items:center;} .search_Box .search .in input{border: none; width:calc(100% - 40px); font-size:16px;} .search_Box .search .in input#sch_detail_word {width:auto;} .search_Box .search .in button{cursor: pointer;} .search_Box .search .in button i {font-size:18px;} .search_Box .delete_btn{color:#999;margin-right:10px;} .search_Box .search_btn{text-align:right;} .search_Box .btn_box{display:inline-block; text-align:right; overflow:hidden; width:40px; vertical-align:middle;} .search_Box .btn_box i {font-size:18px;} .cate_lect{display:inline-block; margin:8px 8px 0 0; font-size:14px; vertical-align:middle; border-right:1px solid #aaa; box-sizing:border-box; padding-right:15px;} /* 로그인 */ .login_wrap{width: 100%; overflow: hidden; box-sizing: border-box; padding: 110px 0; background: linear-gradient(to right, #F1FAFB ,#BACEF3);} .login_box h3.title i{font-size:35px; text-align: center; margin-bottom: 10px; color: #fff; background: var(--color-primary); border: 1px solid var(--color-primary); border-radius: 100px; width: 80px; height: 80px; line-height: 80px;} .login_box{background:#fff; width:600px; text-align:center;border-radius:20px; margin: 0 auto; } .login_inner{ width:100%; overflow:hidden;} .login_box .login_box_inner{width:100%; overflow:hidden; height:100%; padding:30px 0; box-sizing:border-box; } .login_box .login_box_inner .logo{text-align:center;} .login_box .login_box_inner .input_box{margin-top:30px; overflow:hidden; margin-bottom:15px;} .login_box .login_box_inner .input_box i{ color: #666;} .login_box .login_box_inner .input_box input{border:none; outline:0 none; padding:8px; height:auto; font-size:18px; width:400px; background:var(--color-primary-bglight);} .login_box .login_box_inner .input_box .id{border-radius:16px; background:var(--color-primary-bglight); display:inline-block; padding:16px 20px; box-sizing:border-box; margin-bottom:10px;} .login_box .login_box_inner .input_box .id img{width:20px; margin-right:8px;} .login_box .login_box_inner .input_box .pw{border-radius:16px; background:var(--color-primary-bglight); display:inline-block; padding:16px 20px; box-sizing:border-box; } .login_box .login_box_inner .input_box .pw img{width:20px; margin-right:8px;} .login_box .login_box_inner button.login{background: var(--color-primary); color:#fff; width:458px; border-radius:16px; font-size:18px; padding:24px 20px; box-sizing:border-box; cursor: pointer; } .login_box .login_box_inner button.login:hover{background: var(--color-primary-dark);} .login_box .login_box_inner .id_save{display:flex; gap:8px; align-items:center; font-size:16px; margin:20px 0 20px 75px; cursor:pointer;} .login_box .login_box_inner .login_search{width:100%; overflow:hidden; border-top:1px solid #ddd; width:75%; margin:40px auto 0; position:relative; padding:40px 0px 0; box-sizing:border-box; border-top: 1px dotted #ddd;} .login_box .login_box_inner .login_search ul{ display:inline-block;} .login_box .login_box_inner .login_search ul li{display:inline-block; } .login_box .login_box_inner .login_search ul li a{width:100%; height:100%; display:inline-block;} .login_box .login_box_inner .login_search ul li.join a{color: var(--color-primary); box-sizing: border-box; font-weight: 600;} .login_box .login_box_inner .login_search ul li.idpw_s{margin-right:20px;} .login_box .login_box_inner .login_search ul li.idpw_s a{box-sizing: border-box; font-weight: bold; color: #999; } .login_box .login_box_inner .login_search ul li.join {margin-right:20px;} /* 회원가입 - 약관 동의 */ .joinBox{width: 100%; /*background: linear-gradient(to right, #F1FAFB ,#BACEF3);*/ box-sizing: border-box; } .join_wrap{ margin: 0 auto; overflow: hidden; background: #fff; border-radius:20px; box-sizing: border-box; padding:40px 20px 30px 20px;} .join2_wrap{width: 800px; border: 1px solid #eee;} .joinBox .join_wrap .title{overflow: hidden; text-align: center; margin-bottom: 20px;} .joinBox .join_wrap .title > img {margin-bottom:8px; width:60px;} .joinBox .join_wrap .title h3{font-size: 35px; font-weight: bold; margin-bottom: 10px; color: var(--color-primary);} .joinBox .join_wrap .title p span{color: red;} .joinBox .join_wrap .join-con-wrap{ width: 100%;} .joinBox .join_wrap .join-con-wrap .all{font-size: 22px; font-weight: bold; box-sizing: border-box; padding: 0 0 20px 30px; border-bottom: 1px solid #ddd; position: relative;} .joinBox .join_wrap .join-con-wrap .all input[type="checkbox"]{display: none;} .joinBox .join_wrap .join-con-wrap .all input[type="checkbox"] + label{display: inline-block; width: 20px;height: 20px;border:1px solid #ddd; position: relative; border-radius: 100px; margin-right: 10px; position: absolute; left: 0; top:5px; } .joinBox .join_wrap .join-con-wrap .all input[id="all_c"] + label::after{content:'✔';font-size:15px;width: 20px;height: 20px;text-align: center;position: absolute;left: 50%;top:50%; transform: translate(-50%, -50%); color: #ddd;} .joinBox .join_wrap .join-con-wrap .all input[id="all_c"]:checked + label::after{content:'✔';font-size: 15px;width: 20px;height: 20px;text-align: center;position: absolute;left: 50%;top:50%; transform: translate(-50%, -50%);color: #fff; border:1px solid var(--color-primary); border-radius: 100px; background: var(--color-primary);} .joinBox .join_wrap .join-con-wrap .text_area{width: 100%; overflow: hidden; box-sizing: border-box; padding: 30px 0;} .joinBox .join_wrap .join-con-wrap .text_area > div{width: 100%; overflow: hidden; margin-bottom: 40px;} .joinBox .join_wrap .join-con-wrap .text_area > div > p{width: 100%; overflow: hidden; position: relative; box-sizing: border-box; padding-left: 30px;} .joinBox .join_wrap .join-con-wrap .text_area > div:last-child{margin-bottom: 0px} .joinBox .join_wrap .join-con-wrap .text_area > div #text_01{width: 99.5%; resize: none; height: 300px; border: 1px solid #ddd; overflow-y: auto; margin-bottom: 15px; box-sizing: border-box; padding: 20px; font-weight: 400; line-height:1.7;} .joinBox .join_wrap .join-con-wrap .text_area > div #text_01::-webkit-scrollbar { width: 5px; /* 스크롤바의 너비 */ } .joinBox .join_wrap .join-con-wrap .text_area > div #text_01::-webkit-scrollbar-thumb { height: 30%; /* 스크롤바의 길이 */ background: #ccc; /* 스크롤바의 색상 */ border-radius: 10px; } .joinBox .join_wrap .join-con-wrap .text_area > div #text_01::-webkit-scrollbar-track { background: #eee; /*스크롤바 뒷 배경 색상*/ } .joinBox .join_wrap .join-con-wrap .text_area > div #text_02{width: 99.5%; resize: none; height: 300px; border: 1px solid #ddd; overflow-y: auto; margin-bottom: 15px; box-sizing: border-box; padding: 20px; font-weight: 400; line-height:1.7;} .joinBox .join_wrap .join-con-wrap .text_area > div #text_02::-webkit-scrollbar { width: 5px; /* 스크롤바의 너비 */ } .joinBox .join_wrap .join-con-wrap .text_area > div #text_02::-webkit-scrollbar-thumb { height: 30%; /* 스크롤바의 길이 */ background: #ccc; /* 스크롤바의 색상 */ border-radius: 10px; } .joinBox .join_wrap .join-con-wrap .text_area > div #text_02::-webkit-scrollbar-track { background: #eee; /*스크롤바 뒷 배경 색상*/ } .joinBox .join_wrap .join-con-wrap .text_area > div textarea:focus{outline: none;} .joinBox .join_wrap .join-con-wrap .text_area > div input[type="checkbox"]{display: none;} .joinBox .join_wrap .join-con-wrap .text_area > div input[type="checkbox"] + label{display: inline-block; width: 15px;height: 15px;border:1px solid #ddd; position: relative; border-radius: 100px; position: absolute; left: 0; top: 5px; } .joinBox .join_wrap .join-con-wrap .text_area > div input[id="inp_02"] + label::after{content:'✔';font-size:10px;width: 15px;height: 15px;text-align: center;position: absolute;left: 50%;top:50%; transform: translate(-50%, -50%); color: #ddd;} .joinBox .join_wrap .join-con-wrap .text_area > div input[id="inp_02"]:checked + label::after{content:'✔';font-size: 10px;width: 15px;height: 15px;text-align: center;position: absolute;left: 50%;top:50%; transform: translate(-50%, -50%); color: #fff; border:1px solid var(--color-primary); border-radius: 100px; background: var(--color-primary);} .joinBox .join_wrap .join-con-wrap .text_area > div input[type="checkbox"]{display: none;} .joinBox .join_wrap .join-con-wrap .text_area > div input[type="checkbox"] + label{display: inline-block; width: 15px;height: 15px;border:1px solid #ddd; position: relative; border-radius: 100px; position: absolute; left: 5px; top: 1px;} .joinBox .join_wrap .join-con-wrap .text_area > div input[id="inp_03"] + label::after{content:'✔';font-size:10px;width: 15px;height: 15px;text-align: center;position: absolute;left: 50%;top:50%; transform: translate(-50%, -50%); color: #ddd;} .joinBox .join_wrap .join-con-wrap .text_area > div input[id="inp_03"]:checked + label::after{content:'✔';font-size: 10px;width: 15px;height: 15px;text-align: center;position: absolute;left: 50%;top:50%; transform: translate(-50%, -50%); color: #fff; border:1px solid var(--color-primary); border-radius: 100px; background: var(--color-primary);} .buttonWrap{width: 100%; overflow: hidden; text-align: center; box-sizing: border-box; padding: 30px 0;} .buttonWrap button{ font-weight: 400; font-size: 18px; color: #fff; cursor: pointer; box-sizing: border-box; border: 1px solid var(--color-primary);} .buttonWrap button.next{background:var(--color-primary); border: 1px solid var(--color-primary);} .buttonWrap button.prev{color:var(--color-primary); border: 1px solid var(--color-primary); margin-right: 20px; margin-left:auto;} .join_wrap .buttonWrap button.resign {color:#ed0000; border: 1px solid #ed0000; border-radius: 100px; } @media screen and (max-width: 980px) { .join_wrap .buttonWrap button {font-size: 16px !important; line-height: 16px !important; font-weight: 500 !important;} } /* 회원가입 - 인증 버튼 */ .certified{width: 100%; overflow: hidden; box-sizing: border-box; padding: 50px 0; margin: 20px 0; text-align: center; border-top: 1px dotted #bbb; border-bottom: 1px dotted #bbb;} .certified button.cell-certified{ box-sizing: border-box; padding: 30px 40px; border: 1px solid #ddd; border-radius: 10px; box-shadow: 3px 3px 6px rgba(0,0,0,10%); background: #fbfbfb;} .certified button.cell-certified:hover{box-shadow: 3px 3px 10px rgba(0,0,0,20%);} .certified button.cell-certified i{font-size: 50px; margin-bottom: 20px; color:var(--color-primary) ;} .certified button.cell-certified p{ font-size: 18px;} /* 회원가입 - 정보 입력 */ .info_in{width: 100%; box-sizing: border-box; padding: 40px 0;} .info_in ul{width: 100%; } .info_in ul li{padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px dotted #ddd; box-sizing: border-box;} .info_in ul li:last-child{padding-bottom: 0px; margin-bottom: 0px; border-bottom: none;} .info_in ul li p.tit{ font-weight: bold; color: var(--color-primary); margin-bottom: 10px;} .info_in ul li p.tit span{color:red;} .info_in ul li > div{display: block; width: 100%; clear: both;} .info_in ul li > div button{color: var(--color-primary); font-weight: bold; cursor: pointer; border: 1px solid var(--color-primary) ; box-sizing: border-box; padding: 16px; border-radius: 100px; font-size:16px;} .info_in ul li > div button:hover{background:var(--color-primary); color: #fff;} .info_in ul li > div input{width: 100%; padding:10px; font-size:16px; border-radius:4px;} .info_in ul li > div input.id_inp{width: 70%;} .info_in ul li > div input[type="radio"]{width: auto;} .info_in ul li select {padding:16px 40px 16px 16px; font-size:16px;} .join-con-wrap .info_in ul li > div input {padding:16px; background: var(--color-border-light);} /* 회원가입 - 아이디 or 비번 찾기 */ .idpw_wrap{width: 100%; box-sizing: border-box; padding: 50px 0; position: relative;} .idpw_wrap:after{position: absolute; content: ''; width: 1px; height:100%; border-right: 1px dotted #aaa; left: 50%; top:50%; transform: translate(-50%, -50%);} .idpw_wrap .idpw{width: 1200px; margin: 0 auto; overflow: hidden;} .idpw_wrap .idpw > div{width: 49.9%; display: inline-block; text-align: center; box-sizing: border-box; padding-top: 5px; } .idpw_wrap .idpw .id_f{float: left; } .idpw_wrap .idpw .pw_f{float: right;} .idpw_wrap .idpw > div h3{font-size: 25px; font-weight: 300; margin-bottom: 30px; position: relative;box-sizing: border-box; padding-right: 20px; } .idpw_wrap .idpw > div h3 span{font-weight: bold; color: var(--color-primary);} .idpw_wrap .idpw .pw_f h3 span{color: var(--color-secondary);} .idpw_wrap .idpw > div h3 i{border-radius: 100px; background: var(--color-primary); color: #fff; font-size: 16px; width: 40px; height: 40px; line-height: 40px; position: absolute; top: 50%; transform: translateY(-50%); margin-left: 10px;} .idpw_wrap .idpw .pw_f h3 i{background: var(--color-secondary);} .idpw_wrap .idpw > div .form{ overflow: hidden; display: inline-block; border: 1px dotted #ddd; box-sizing: border-box; padding: 20px 0; width: 70%;} .idpw_wrap .idpw > div ul{width: 100%; } .idpw_wrap .idpw > div ul li{margin-bottom: 10px;} .idpw_wrap .idpw > div ul li:last-child{margin-bottom: 0;} .idpw_wrap .idpw > div ul li label{width: 25%; display: inline-block; text-align: left; } .idpw_wrap .idpw .id_f .form{padding: 40px 0; box-sizing: border-box;} .idpw_wrap .idpw .buttonWrap button.search{cursor: pointer; box-sizing: border-box; padding:8px 16px; border-radius: 100px; border:none; color: #fff; background: var(--color-primary); } .idpw_wrap .idpw .pw_f .buttonWrap button.search{background: var(--color-secondary);} /* 회원가입 - 아이디 찾기 결과 */ .id_res{width: 100%; box-sizing: border-box; padding: 60px 0;} .id_res .res_box{width: 70%; overflow: hidden; text-align: center; box-sizing: border-box; padding: 50px 20px; background: #f8f8f8; border: 1px solid #ddd; border-radius: 20px; margin: 0 auto;} .id_res .res_box p span{font-size: 22px; color: #003B83;} .id_res .buttonWrap button{box-sizing: border-box; padding:8px 16px; border-radius: 100px; cursor: pointer; font-weight: bold;} .id_res .buttonWrap button.re{color: #003B83; border: 1px solid #003B83; margin-right: 20px;} .id_res .buttonWrap button.login{background:#003B83; color: #fff;} .id_res .buttonWrap{padding: 70px 0 0;} /* 내 정보 수정 */ .info_in ul.edit li input{background:#f4f4f4;} .info_in_ed{padding: 10px 20px 30px;} /* 자주 묻는 질문 */ .accordion{width: 100%; overflow: hidden; } .accordion ul{width: 100%; overflow: hidden;} .accordion ul li{width: 100%; cursor: pointer; border-bottom: 1px solid rgba(41,110,178,20%); position: relative;} .accordion ul li:after{position: absolute; content: ''; width: 0%; height: 1px; left: 0; bottom: 0; background: linear-gradient(to right, var(--color-primary-light),var(--color-primary) );} .accordion ul li:last-child{border-bottom: none;} .accordion ul li:hover:after{ animation: width_ani 0.7s forwards;} @keyframes width_ani { 0%{width: 0%;} 100%{width: 100%;} } .accordion ul li.on:after{display: none;} .accordion ul li.on:last-child{ border-bottom: 1px solid rgba(41,110,178,20%);} .accordion ul li > p{box-sizing: border-box; padding: 20px 15px; font-size: 18px; position: relative; line-height: 1.7; display:flex;align-items: flex-start;} .accordion ul li > p:after{position: absolute; content: "\f13a"; right: 0; top: 50%; transform: translateY(-50%); font-size: 20px; color: #ddd; width: 5%; font-family: "FontAwesome";} .accordion ul li > p span.q{ margin-right: 10px; background:var(--color-primary); color: #fff; border-radius: 100px; width: 30px; height: 30px; line-height: 30px; text-align: center; display: inline-block;} .accordion ul li > p span.tit{display: inline-block; width:90%; word-break: break-all; } .accordion ul li.on > p:after{content: "\f139"; color: var(--color-primary);} .accordion ul li.on > p{ color: var(--color-primary);} .accordion ul li.on div.answer{ border-top: 1px solid rgba(91,106,183,20%);} .accordion ul li.on div.answer img{width: 90% !important;} .accordion ul li div.answer{display: none; box-sizing: border-box; padding: 15px; background:#f9f9f9;} .accordion ul li div.answer.on{display: block;} .accordion ul li div.answer p{box-sizing: border-box; padding: 10px 40px; line-height: 1.5; font-size: 15px; color: #555;} .accordion ul li div.answer img{width: 100% !important;} .tab_content .tab-content{display:none;} .tab_content .tab-content.current{display:block;} .tab_menu{width:100%; margin-top:30px;} .tab_menu ul{width:100%; overflow: hidden; display:flex; align-items: center; justify-content: space-between;} .tab_menu li{text-align: center; width: 49%; cursor: pointer; box-sizing: border-box; padding: 15px; background:#eee; border-radius: 100px; color:#888; font-weight:400;} .tab_menu li.current{background: var(--color-primary); color: var(--color-white); font-weight: 600;} .tab_menu li a{width:100%; height:100%; display:block; } /* 게시판 뷰 */ .table_view{width: 100%; } .table_view .titleBox{width: 100%; box-sizing: border-box; padding: 20px; background:#f4f5f7; } .table_view .titleBox h3.tit{font-weight: 600; font-size: 20px; line-height: 1.5; margin-bottom: 20px;} .table_view .titleBox ul.info{width: 100%; overflow: hidden; } .table_view .titleBox ul.info li{display: inline-block; margin-right: 20px; padding-right: 20px; box-sizing: border-box; border-right: 1px solid #ddd;font-weight: 400; color:#555; font-size:16px;} .table_view .titleBox ul.info li:last-child{margin-right: 0; border-right: none; padding-right: none;} .table_view .titleBox ul.info li span{ margin-right: 5px;font-weight: bold; color:#1d1d1d;} .table_view .fileBox{overflow: hidden; border-bottom: 1px solid #ddd; font-weight: 400; color: #555555; display: flex; align-items: center;} .table_view .fileBox p.lab{display: inline-block; box-sizing: border-box; padding: 15px 20px; position: relative; font-weight:bold; font-size:16px;} .table_view .fileBox p.lab:after{position: absolute; content: ''; right: 0; top: 50%; transform: translateY(-50%); width: 1px; height: 30%; background: #ddd;} .table_view .fileBox p.inp{display: inline-block; box-sizing: border-box; padding:15px 20px; color: #999; } .table_view .fileBox p.inp.inp_file{} .table_view .fileBox p.inp.inp_file a{color: rgba(41,110,178,100%); width: 100%; height: 100%; display: block; font-weight: normal; font-size:16px;} .table_view .fileBox p.inp.inp_file:hover a{text-decoration: underline; } .table_view .view_con{ overflow: hidden; box-sizing: border-box; padding: 20px; border-bottom: 1px solid #ddd; } .table_view .view_con img{width: auto !important; max-width:100% !important;} .buttonWrap_v{text-align: inherit; box-sizing: border-box; padding: 20px 0;} .buttonWrap_v button{ font-weight: 400; font-size: 17px; border-radius: 100px;} .buttonWrap_v button.list{float: right; border: 1px solid #999; box-sizing: border-box; padding: 8px 16px; color: #999;} .buttonWrap_v button.list:hover{ border: 1px solid rgba(41,110,178,100%); color:rgba(41,110,178,100%);} .buttonWrap_v div button{color: #444;} .buttonWrap_v div button i{color: rgba(41,110,178,100%);} .buttonWrap_v div button.prev_li{margin-right: 20px;border:none; } .buttonWrap_v div button.prev_li:hover i{animation: arrow_ani1 0.5s forwards;} @keyframes arrow_ani1{ 100%{transform: translateX(-5px); transition: 0.5s;} } .buttonWrap_v div button.next_li {border:none;} .buttonWrap_v div button.next_li:hover i{animation: arrow_ani2 0.5s forwards;} @keyframes arrow_ani2{ 100%{transform: translateX(5px);} } /* 1:1 문의 */ i.reply_ico{color: ; transform:rotate(180deg); margin-right: 5px;} .buttonWrap_v button.reply{float: right; border: 1px solid #999; background: #999; box-sizing: border-box; padding: 5px 20px; color: #ffff; margin-left: 10px;} .buttonWrap_v button.reply:hover{background: #000; border: 1px solid #000;} .table_list.table_list_board ul li.li_02.reply a{position: relative; box-sizing: border-box; line-height: 26px;} span.re{ box-sizing: border-box; padding: 0px 8px; background: #1d1d1d; color: #fff; font-size: 14px; border-radius: 5px; margin-right: 5px; display: inline-block; cursor: text;} /* 1:1 문의 글쓰기 */ .table_input{ box-sizing: border-box; } .table_input .view_con{padding: 20px 0;} .view_con textarea{width: 100%; resize: none; height: 300px; border: 1px solid #ddd; overflow-y: auto; box-sizing: border-box; padding: 10px;} .table_input .titleBox{border-bottom: none; border-top: none; padding: 20px 0 0; background: none;} .table_input .titleBox h3.tit{margin-bottom: 0;} .table_input .fileBox{width: 100%; box-sizing: border-box; padding: 0 20px; } .buttonWrap_v button.in{float: right; background: #999; border:1px solid transparent; box-sizing: border-box; padding: 8px 16px; color: #ffff; margin-left: 10px;} .buttonWrap_v button.in:hover{background:rgba(41,110,178,100%); } .buttonWrap_v button.delete{background:rgba(213,40,40,50%); } .buttonWrap_v button.delete:hover{background:rgba(213,40,40,100%); } .table_input .fileBox p.lab{padding: 20px 20px 20px 0px;} .reply_ico{color: rgba(41,110,178,100%);} /* 1:1 문의 답변 뷰 */ .reply_table{ padding: 0 20px; box-sizing: border-box; margin-bottom: 40px; background: #fdfdfd; border-radius: 20px; border: 1px solid #eee;} .reply_table .titleBox{border-bottom: 1px solid #ccc; border-top: none; padding: 20px 10px; background:none;} .reply_table .view_con{border-bottom: none; padding: 20px 10px; } .replyTitle{font-weight: 600; font-size: 20px; margin-bottom: 10px; box-sizing: border-box; padding: 0 10px;} .replyTitle2{ margin-top:70px;} .replyTitle i{color: rgba(41,110,178,100%) ;} .table_input .titleBox_in{padding-top: 10px; background:none;} .reply_table .titleBox.none{box-sizing:border-box; padding:30px 0px;} /* 통합검색 */ .allsearchBox{width:100%; text-align: center; box-sizing: border-box; padding: 40px 10px; border-top: 2px solid rgba(41,110,178,100%); border-bottom:2px solid rgba(41,110,178,100%); position: relative;} .allsearchBox h3.resultTxt{font-weight: bold; font-size: 23px;} .allsearchBox h3.resultTxt .searchWord{font-size:25px; color: rgba(41,110,178,100%);} .allsearchBox .search_Box{padding: 20px 0 30px; vertical-align: middle; } .allsearchBox .search_Box .p{ position: absolute; left:0; top:50%; transform: translateY(-50%);} .allsearchBox .search_Box .search{border: none; position: relative; box-sizing: border-box; text-align:center;} .allsearchBox .search_Box .search .in{overflow: hidden; border: 2px solid;border-image: linear-gradient(to right, #003B83, #6AA7E3);border-image-slice: 1; box-sizing: border-box; padding: 8px;} .allsearchBox h3.resultTxt .resultNum{font-weight: 600; color:#003B83;} /* 통합검색 탭 */ .allsearchBox .tabBox{width:100%; } .allsearchBox .tabBox ul{width:95%; overflow: hidden; display: flex; position: absolute; left:50%; transform: translateX(-50%); bottom:-40px; padding-bottom: 10px; box-sizing: border-box; justify-content: center;} .allsearchBox .tabBox ul li{display: inline-block; width: 19%; cursor: pointer; border-right: 1px solid #ddd; height: 100%; box-sizing: border-box; padding: 15px 0; border: 1px solid #cccc; background: #fff; border-right: none; box-shadow: 3px 3px 6px rgba(0,0,0,15%); font-weight:bold;} .allsearchBox .tabBox ul li:last-child{ border-radius: 0 100px 100px 0; border-right: 1px solid #ccc;} .allsearchBox .tabBox ul li:first-child{ border-radius: 100px 0 0 100px;} .allsearchBox .tabBox ul li.current{border: 2px solid rgba(41,110,178,100%);} .allsearchBox .tabBox ul li span.num{ margin-left: 10px; color: rgba(41,110,178,100%) ; display: inline-block; box-sizing: border-box; padding: 1px 15px; border:1px solid rgba(41,110,178,100%); border-radius: 100px;} .allsearchBox .tabBox ul li.current span.num{color: #fff; background: rgba(41,110,178,100%); } .tab_menu_search .tab-content{display: none;} .tab_menu_search .tab-content .content{ margin-bottom: 70px;} .tab_menu_search .tab-content .content:last-child{margin-bottom: 0px;} .tab_menu_search .tab-content.current{display: block;} .tab_menu_search .contentBox{box-sizing: border-box; padding: 100px 0;} /* 통합검색 과정 리스트 */ .tab_menu_search .tab-content .titBox{overflow: hidden; margin-bottom: 10px; box-sizing: border-box; padding: 0px 30px;} .tab_menu_search .tab-content .titBox h3{font-size: 24px; font-weight: bold; display: inline-block; float: left;} .tab_menu_search .tab-content .titBox h3 span{font-size: 18px; color: #555555;} .tab_menu_search .tab-content .titBox .more{float:right; display:inline-block; } .tab_menu_search .tab-content .titBox .more a{width:100%; height:100%; display:block; color:#B2C1D3; font-weight:400; font-size: 20px; cursor: pointer;} .tab_menu_search .tab-content .titBox .more:hover a{color:#4390DD; font-weight: bold;} .tab_menu_search .tab-content .listView{width: 100%; width:96%; margin:0 auto;} .tab_menu_search .tab-content .listView ul.list{ overflow: hidden; box-sizing: border-box; padding-bottom:10px; margin: -20px -15px 0 -20px; } .tab_menu_search .tab-content .listView ul.list li{width: 24.7%; float:left;} .tab_menu_search .tab-content .listView ul.list li:last-child{margin-right: 0px;} .tab_menu_search .tab-content .listView ul.list li a{ margin: 20px 0px 0px 20px; background:#fff; border-radius:15px; box-shadow: 0px 0px 10px rgba(0,0,0,15%); border: 1px solid #ddd; display: inline-block; border-radius:15px;position: relative; width: 92%; } .tab_menu_search .tab-content .listView ul.list li a p.img{ border-bottom:1px solid #ddd; height:139px; } .tab_menu_search .tab-content .listView ul.list li a p.img img{width:100%; border-radius:15px 15px 0px 0px; height:100%;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox{ box-sizing: border-box; padding: 15px; position: relative;height: 200px;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .text{overflow: hidden;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .text p.category{ font-size: 14px;color: #4796E0;display: inline-block; overflow: hidden;box-sizing: border-box;padding: 3px 15px;border-radius: 100px;border: 1px solid #4796E0;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .text p.category.color_2{color: #9E3F78 !important; border: 1px solid #9E3F78 !important;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .text p.category.color_3{color: #366E2E !important; border: 1px solid #366E2E !important;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .text h3.title{ font-size: 18px; margin-top: 5px;width: 100%;overflow: hidden;word-break: break-word;line-height: 1.5;font-weight: 600; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .info{ position: absolute; left: 15px;bottom: 15px; width: 89%;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .info p{ width: 100%; overflow: hidden; display: flex;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .info p span.tit{ display: inline-block; width: 25%; color: #4390DD;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .info p span.con{ display: inline-block; width: 75%;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .info p span.con.price{color:red;} .tab_menu_search .tab-content .listView ul.list li a:hover{box-shadow:0px 0px 15px #4796E0;} .tab_menu_search .tab-content .listView_no{text-align: center; box-sizing: border-box; padding: 60px 0; background: #fbfbfb; font-size: 16px; color: #888; font-weight: 400; border: 1px solid #eee; width:96%; margin:0 auto;} .tab_menu_search .tab-content .listView ul.board{width: 100%; overflow: hidden; } .tab_menu_search .tab-content .listView ul.board:last-child{border-bottom: 1px solid #ddd;} .tab_menu_search .tab-content .listView ul.board li{overflow: hidden; width: 100%; border-top: 1px solid #ddd; font-size:14px;} .tab_menu_search .tab-content .listView ul.board li a{width: 100%; display: flex; flex-flow:row nowrap; align-items:center; box-sizing: border-box; padding: 25px 20px;} .tab_menu_search .tab-content .listView ul.board li h3.tit {display: inline-block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size: 20px; font-weight: bold;} .tab_menu_search .tab-content .listView ul.board li a .date {display:flex; margin-left:auto; color:#999999;} .tab_menu_search .tab-content .listView ul.board li a .date li {border-top:none;} .tab_menu_search .tab-content .listView ul.board li a .date li.date_box {width:110px;} .tab_menu_search .tab-content .listView ul.board li a .date li.look_box {width:60px;} .tab_menu_search .tab-content .listView ul.board li span.date{ float: right; color: #999;} .tab_menu_search .tab-content .listView ul.board li p{font-weight: 400;width: 90%; color: #444; font-size: 16px; overflow: hidden; word-break: break-word; line-height: 1.6; display: -webkit-box; -webkit-line-clamp:1; -webkit-box-orient: vertical; } .tab_menu_search .tab-content .listView ul.board li span.search_word{ color:#003B83;} .tab_menu_search .tab-content .listView ul.board li:hover{ color: rgba(41,110,178,100%);} .tab_menu_search .tab-content .listView ul.board li:hover span.date{ color: rgba(41,110,178,100%);} @media screen and (max-width:640px) { .tab_menu_search .tab-content .listView ul.board li a {flex-flow:column wrap;} .tab_menu_search .tab-content .listView ul.board li a .date {margin-top:8px; width:100%;} } /* 오픈 콘텐츠 */ p.allNum{font-size: 21px; margin-bottom:20px; box-sizing:border-box; font-weight:bold;} p.allNum span{color:var(--color-primary); font-size:24px;} .in_con .listView{width: 100%; } .in_con .listView ul.list {display:flex; width:100%;} .in_con .listView ul.list li{ width:25%; float: left; } .in_con .listView ul.list li div.box{ overflow: hidden; margin: 40px 0px 0px 20px; background:#fff; position: relative; border: 1px solid #ddd; border-radius:15px; } .in_con .listView ul.list li:first-child {margin: 0px;} .in_con .listView ul.list li p.img{overflow: hidden; width:100%; height: 114px; border-bottom: 1px solid #ddd;} .in_con .listView ul.list li p.img img{border-radius:15px 15px 0 0; transition: all 0.3s; width:100%; height:100%;} .in_con .listView ul.list li:hover p.img img{transform: scale(1.05); transition: all 0.3s;} .in_con .listView ul.list li .text{padding:10px 15px;box-sizing:border-box; overflow:hidden; font-weight:bold; height:200px;} .in_con .listView ul.list li .text p.category{font-size:10px; color:#3180D9; display:inline-block; overflow:hidden;} .in_con .listView ul.list li h3.title{ font-size:18px; margin-bottom:5px; overflow:hidden; height:50px; width:100%; overflow:hidden;font-weight: bold; white-space: normal; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; line-height:1.4;} .in_con .listView ul.list li .bottomBox{position:absolute; bottom:15px; left:15px; width: 87%;} .in_con .listView ul.list li .bottomBox .info{margin-bottom:15px; border-bottom:1px dotted #aaa;box-sizing:border-box; padding-bottom:15px; } .in_con .listView ul.list li .bottomBox .info p{ width: 100%; overflow: hidden;display: flex; font-size: 14px;} .in_con .listView ul.list li .bottomBox .info p span.tit{ display: inline-block; width: 25%; color: #4390DD;} .in_con .listView ul.list li .bottomBox .info p span.con{display: inline-block; width: 75%; font-weight:normal;} .in_con .listView ul.list li .bottomBox .info p span.con.price{color:red;} .in_con .listView ul.list li.list_none{margin-top:50px; clear:both; text-align:center; width:100%; display:block; box-sizing:border-box; padding:40px; background:#f9f9f9; font-size:14px; color:#555; margin-left:10px; line-height:1.7;} /* 오픈 콘텐츠 - 뷰 페이지 */ .topBox{overflow: hidden; } .topBox p.img{display: inline-block; float: left; width: 35%; height: 173px; } .topBox p.img img{ box-shadow: 0px 0px 15px rgba(0,0,0,30%); width:100%; height:100%;} .topBox .infoBox{ display: inline-block; float: right; width: 63%; border-bottom: 1px solid #ddd;} .topBox .infoBox h3{text-align: center; font-size: 20px; font-weight: bold; box-sizing: border-box; padding: 15px 20px; text-align: left; line-height: 1.8; background:#f4f5f7; border: 1px solid #eee;} .topBox .infoBox .info{width: 100%; box-sizing: border-box; padding: 20px; display:flex;align-items: center; justify-content: space-between;} .topBox .infoBox .info ul.list{display: inline-block; float:left; width: 72%; } .topBox .infoBox .info ul.list li{width: 100%; margin-bottom: 16px; } .topBox .infoBox .info ul.list li i{color: #1d1d1d;} .topBox .infoBox .info ul.list li:last-child{margin-bottom: 0px;} .topBox .infoBox .info ul.list li p.title{display: inline-block; float: left; width: 30%; font-weight:bold;} .topBox .infoBox .info ul.list li p.con{display: inline-block; width: 70%; font-weight: 400;} .topBox .infoBox .info ul.list li p.con.bold{color:var(--color-primary);} .topBox .infoBox .info ul.list li p.money{color: red; font-weight: bold;} .topBox .infoBox .info ul.list li p.con span.block{display:block;overflow:hidden;} .topBox .infoBox .info ul.list li p.con span.block span{font-weight:600; color: #4a93da;} /* 수강 기간 선택 */ .topBox .infoBox .info ul.list li .selectBox{display: inline-block; width: 70%; font-weight: 400; position:relative; } .topBox .infoBox .info ul.list li .selectBox .select{box-sizing:border-box; padding:5px; font-size:13px; font-weight:bold; border:1px solid #ddd; position:relative;} .topBox .infoBox .info ul.list li .selectBox .select.on{border:1px solid #000; font-weight:bold;} .topBox .infoBox .info ul.list li .selectBox .select:after{position:absolute; content:'\f078'; font-family:'FontAwesome'; font-size: 14px; right:10px; top:50%; transform:translateY(-50%); cursor:pointer;} .topBox .infoBox .info ul.list li .selectBox .select.on:after{ } .topBox .infoBox .info ul.list li .selectBox .select a{width:95%; height:100%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; display: block; } .topBox .infoBox .info ul.list li .selectBox .optionBox{background:#fff; overflow:hidden; border:1px solid #000; border-top:0px; position:absolute; left:0; top: 27px; z-index:9999999; width:99.4%; } .topBox .infoBox .info ul.list li .selectBox .optionBox ul{ width:100%;overflow:hidden; max-height:86px; overflow-y:auto;} .topBox .infoBox .info ul.list li .selectBox .optionBox ul::-webkit-scrollbar { width: 3px; /* 스크롤바의 너비 */ } .topBox .infoBox .info ul.list li .selectBox .optionBox ul::-webkit-scrollbar-thumb { height: 10%; /* 스크롤바의 길이 */ background: #9B9B9B; /* 스크롤바의 색상 */ border-radius: 10px; } .topBox .infoBox .info ul.list li .selectBox .optionBox ul::-webkit-scrollbar-track { background: #ddd; /*스크롤바 뒷 배경 색상*/ } .topBox .infoBox .info ul.list li .selectBox .optionBox ul li{font-size:13px; font-weight:bold; border-bottom:1px solid#000; box-sizing:border-box; padding: 5px ; width:100%; margin-bottom:0px;} .topBox .infoBox .info ul.list li .selectBox .optionBox ul li:last-child{border-bottom:0px;} .topBox .infoBox .info ul.list li .selectBox .optionBox ul li:hover{cursor:pointer; background: #dff2ff;} .topBox .infoBox .info ul.list li .selectBox .optionBox ul li span.date{font-weight:bold; color:#3A81C7;} .topBox .infoBox .info ul.list li .selectBox .select a span.date{font-weight:bold; color:#3A81C7;} .topBox .button{width:22%; display: inline-block; float: right; overflow: hidden;} .topBox .button button{ text-align: center; box-sizing: border-box; padding: 10px 20px; width: 100%; font-size: 14px; margin-bottom: 10px; color: #888; border-radius: 100px; font-weight: bold;} .topBox .button button.interest{border:1px solid #888;} .topBox .button button.interest.on{border:1px solid red; color: red;} .topBox .button button.interest:action{border:1px solid red; color: red;} .topBox .button button.preview{border:1px solid #888;} .topBox .button button.preview:action{border:1px solid #003B83; color: #003B83;} .topBox .button button.application{margin-bottom: 0px; color:#fff; background: #4a93da; } .nr_btn2 {margin-top: 96px} .topBox .button button i{margin-right: 5px;} .topBox .button button.application:action{background:linear-gradient(to right, var(--color-primary-dark), var(--color-primary));} /* 오픈 콘텐츠 - 뷰 페이지 - 내용 */ .listCon{overflow: hidden; box-sizing: border-box; margin: 80px 0 50px;} .listCon .tabBox{ } .listCon .tabBox .tabs{width: 100%; overflow: hidden; display: inline-block;} .listCon .tabBox .tabs li{display: inline-block; box-sizing: border-box; padding: 10px 30px; cursor: pointer; color: #888; font-weight: 400; } .listCon .tabBox .tabs li:hover{color: var(--color-primary); font-weight: bold;} .listCon .tabBox .tabs li.current{ color:var(--color-primary); font-weight: bold; border-bottom: none; background: #fff; border-bottom: 3px solid var(--color-primary);} .listCon .contentBox{width: 100%; box-sizing: border-box; padding: 30px; margin-top: -5px; border: 1px solid #ddd; } .listCon .contentBox .tab-content{display: none; } .listCon .contentBox .tab-content.current{display: block; } .listCon .contentBox #tab-1 .intro{ border-radius: 20px; box-sizing: border-box;padding: 20px 30px; background: #f4f5f7; overflow: hidden; margin-bottom: 20px; border: 1px solid #eee; display: flex; align-items: flex-start; justify-content: space-between;} .listCon .contentBox #tab-1 .intro.cla_goal{background: #fefafd; margin-bottom:40px;} .listCon .contentBox #tab-1 .intro div.icon{width: 90px; height:90px; border-radius: 100%; text-align: center; background:#fff;box-sizing: border-box; padding:16px 0; color:#444; font-size: 18px;} .listCon .contentBox #tab-1 .intro div.icon i{font-size: 25px; display: block; margin-bottom: 10px;} .listCon .contentBox #tab-1 .intro div.txt{width: 86%;float: right; box-sizing: border-box; font-weight: 400; line-height: 1.7; display: inline-block;} .data{width: 100%; overflow: hidden;} .data li{ margin-bottom: 20px;} .data li:last-child{margin-bottom: 0px;} .data li p.title{width:130px; display: inline-block; float: left; font-weight:bold;} .data li p.title i{margin-right: 5px; } .data li p.con{font-weight: 400; color: #555; cursor: pointer; display: inline-block; } .data li p.con:hover{color:var(--color-primary); font-weight: bold; text-decoration: underline;} /* 수강 신청 / 결제 */ .view_list ul li.head{color:#296EB2; font-weight:bold; background: #f4f5f7; width:15%;} .view_list ul li.left{text-align:left;} .view_list ul li .point{font-size:12px; font-weight:600; color:#555;} .agreeBox{border-top:1px solid #ddd; margin-top:60px; box-sizing:border-box; padding-top:20px;} .agree_txt{ font-size:16px !important; font-weight:bold !important; display:flex;align-items: center;justify-content: flex-start; } .agree_txt input[type='checkbox']{margin:0px 5px;} /* 오픈 콘텐츠 - 뷰 페이지 - 이수 기준 */ .tableRow{width: 99.5%; display: table; border: 1px solid #ddd; border-bottom: none; border-right: none;} .tableRow ul{width: 100%; overflow: hidden; display: table-row; } .tableRow ul li{ display: table-cell; box-sizing: border-box; padding: 20px 10px; vertical-align: middle; text-align: center;border-bottom: 1px solid #ddd; font-weight: 400; border-right: 1px solid #ddd; width: 40%;} .tableRow ul li.con{text-align:left; padding: 20px;} .tableRow ul li.head{background:#f4f5f7; font-weight: bold; width: 15%; line-height:1.8;} .tableRow ul li.percent p{display: inline-block; width:48%;} .tableRow ul li span.num{color:#000; font-weight:bold;} .tableRow ul li.three p{margin-bottom:20px;} .con_table{width: 100%; overflow: hidden;} .con_table li{box-sizing: border-box; width: 100%; padding:0 10px 20px ; margin-bottom: 20px; border-bottom: 1px dotted #ddd; overflow: hidden;} .con_table li:last-child{margin-bottom: 0px; padding-bottom: 0px; border-bottom: none;} .con_table li span.num{ color:var(--color-primary) ; display: inline-block; width: 8%; height: 100%; float: left; font-weight:bold;} .con_table li span.name{display: inline-block; float: right; width: 92%; height: 100%;} /* 오픈 콘텐츠 - 뷰 페이지 - 버튼 */ .buttonBox{width:100%; overflow: hidden; text-align: center; } .buttonBox button{cursor: pointer; box-sizing: border-box; padding: 8px 25px; font-weight: 400; font-size: 16px;} .buttonBox button.list{margin-right: 20px; border: 1px solid #666; color: #666;} .buttonBox button.list:hover{background:#f8f8f8; color: #222;} .buttonBox button.application{background:var(--color-primary); color: #fff;} .buttonBox button.application.delete{background:var(--color-text-sub);} .buttonBox button.application.delete:hover{background:var(--color-text-sub);} .buttonBox button.application:hover{background:linear-gradient(to right, var(--color-primary-dark), var(--color-primary));} /* 정규 과정 */ .nowBox{overflow:hidden; box-sizing: border-box; padding:30px 0px; padding-bottom:0px;} .nowBox h3.now_tit{font-weight:bold; font-size:18px; margin-bottom: 10px; box-sizing:border-box; padding:0 10px;} .nowBox h3.now_tit i{color:var(--color-primary);} .view_list{border:1px solid #296EB2; border-right:none; border-bottom:0px; width:99.5%; margin:0 auto;} .view_list ul{width: 100%; overflow: hidden; clear: both; display:table; border-collapse: collapse; table-layout: fixed; word-break: break-all; height: auto; border-bottom:1px solid #296EB2;} .view_list ul li{ display:table-cell; padding:10px 20px; box-sizing: border-box; text-align: center; vertical-align: middle; overflow: hidden; line-height: 1.6; font-weight:400; border-right:1px solid #296EB2;} .view_list ul.head{ background: #f4f5f7; } .view_list ul.head li{font-weight:bold; color:#296EB2; padding:10px; } .view_list ul li.bold{color: #b84c97;} .view_list ul .li_01{width:40%;} .view_list ul li.li_02{width:30%;} .view_list ul li.li_03{width:15%;} .view_list ul li.li_04{width:15%;} .now_tablewRow{border:1px solid #296EB2; border-right: 0px; border-bottom: 0px; display:none;} .now_tablewRow ul li.head{ color:#296EB2;} .now_tablewRow ul li{border-right: 1px solid #296EB2; border-bottom:1px solid #296EB2;} .now_tablewRow ul li.con.bold{color:#b84c97;} .all_price{overflow: hidden; text-align: center; box-sizing:border-box; padding: 30px; background:#f9f9f9; margin-top: 10px;} .all_price p{font-size: 23px; font-weight: 400; } .all_price p span{font-weight:bold; color:red; font-size:28px;} .listCon .contentBox #tab-1 .selectBox{overflow: hidden; margin-bottom: 30px; padding-bottom:30px; box-sizing: border-box; border-bottom: 1px dotted #bbb;} .listCon .contentBox #tab-1 .selectBox:last-child{margin-bottom: 0px; padding-bottom: 0px; border-bottom: 0px;} .listCon .contentBox #tab-1 .selectBox p.tit{margin-bottom: 15px; font-size: 18px; overflow: hidden;} .listCon .contentBox #tab-1 .selectBox p.tit span.num{display: inline-block; width:25px; height:25px; line-height: 25px; border-radius: 100%; background:#4a93da ; text-align:center; color: #fff; font-size: 15px; float:left;} .listCon .contentBox #tab-1 .selectBox p.tit span.q{display:inline-block; width: 96%; float:right;} .listCon .contentBox #tab-1 .selectBox .select{width:100%; overflow: hidden; box-sizing: border-box; padding: 0px 35px;} .listCon .contentBox #tab-1 .selectBox .select li{font-weight: 400; margin-bottom: 10px;} .listCon .contentBox #tab-1 .selectBox .select li:last-child{margin-bottom: 0px;} /* 나의 강의실 */ .conlist{box-sizing: border-box; padding: 30px 0;} .conlist h3{box-sizing: border-box; padding: 0px 10px; margin-bottom: 15px; font-size: 19px; font-weight: bold; } .conlistH3{box-sizing: border-box; padding: 0px 10px; margin-bottom: 15px; font-size: 19px; font-weight: bold; } .conlistH3 i{color:#003B83;} .conlist h3 i{color:#003B83;} .conlist .pasing{border: 1px solid #ddd; border-top: 0px; padding:20px 0;} .mypage_table{border: 1px solid #ddd; width:auto;border-bottom: 0px; border-top: 0px; } .mypage_table ul.head{ } .mypage_table ul.head li{padding: 15px 10px!important; } .mypage_table ul li{padding: 10px!important; line-height: 1.7; font-size:15px; box-sizing: border-box;} .mypage_table ul li.bold{color:#b84c97;} .mypage_table ul li.li_01{width:5% !important;} .mypage_table ul li.li_02{width:30% !important;} .mypage_table ul li.li_03{width:10% !important;} .mypage_table ul li.li_04{width:10% !important;} .mypage_table ul li.li_05{width:7% !important;} .mypage_table ul li.li_06{width:7% !important;} .mypage_table ul li.studying{color:#42ac53;} .mypage_table ul li.completion{color:#56547c;} .mypage_table ul li.unpaid{color:#C53636;} .mypage_table ul li.wait{color:#000;} /*.mypage_table ul li.bold{color:#b84c97;}*/ .mypage_table ul li a{font-weight: bold; } .mypage_table ul:hover{background:#f9f9f9;} .mypage_table ul.head:hover{ background:#f4f5f7;} .mypage_table .left .dday{background:var(--color-primary); color:#fff; font-size:11px; box-sizing:border-box; padding:0px 7px; display:inline-block; line-height:18px;} .mypage_table .left .lect_name{ font-weight:600; margin:5px 0px;} .mypage_table .left .cateBox{overflow:hidden;} .mypage_table .left .cateBox span{box-sizing:border-box; padding:0px; text-align:center; display:inline-block; border-radius:100px; background:#f7f7f7; border:1px solid #ddd; font-weight:600; font-size:12px; width:13%; color:#555; } .mypage_table .p_num span{font-size:18px; font-weight:bold; color:var(--color-primary) ;} .mypage_table .progress{width:100%; height:5px; background:#eee; border-radius:100px; margin-top:10px;} .mypage_table .progress-bar{background: #1d1d1d; height:100%; border-radius:100px;} .mypage_table .un_completion{color:#4D377B; font-weight:600; display:block;} .mypage_table .studying{color:var(--color-secondary); font-weight:600; display:block;} .mypage_table .completion{color:var(--color-primary-dark); font-weight:600; display:block;} .mypage_table .wait{color:#999; font-weight:600; display:block;} .mypage_table .delete{color:var(--color-red); font-weight:600; display:block;} .mypage_table .my_class_in{background:#ddd; border-radius:100%; width:40px; height:40px; color:#555;} .mypage_table .my_class_in:hover{background: var(--color-primary); color:#fff } .mypage_table .my_class_in i{font-size:18px;} .mypage_table .score_more{ font-weight: ; margin-top:10px; background:var(--color-secondary); color:#fff; box-sizing:border-box; padding:5px 10px;} .mypage_table .score_more:hover{background:var(--color-secondary);} .mypage_table .score_more.on{background:var(--color-secondary);} .score_more_box{background: #f9f9f9; width:100%; overflow:hidden; box-sizing:border-box; padding: 20px; border-bottom:1px solid #ddd;} .score_more_box .table_score{background:#fff; width:100%; overflow:hidden;} .score_more_box .table_score ul li{} .score_more_box .table_score ul.head {border-top:1px solid #1d1d1d; background:#f1f1f1;} .score_more_box .table_score ul.head li{ padding:10px !important; font-weight:bold; color:#1d1d1d;} .score_more_box .table_score ul li{ font-weight:600;} .score_more_box .table_score ul li .chk_ing{ background: #f9f9f9; box-sizing:border-box; padding:5px 10px; border: 1px solid #ddd;color: #777;} .score_more_box .table_score ul.score:hover{background:none; color:#1d1d1d; } .score_more_box .table_score ul li .score1{color:#3A81C7; font-size:18px;} .score_more_box .table_score ul li .score2{font-weight:bold;} .score_more_box p.caption{background:none; text-align:right; font-size:14px; font-weight:bold; margin-top:10px; } .score_more_box p.caption .score1{color:#3A81C7; font-weight:bold;} .score_more_box .table_score ul.head{border-top:;} .score_more_box .table_score ul.score li.head{background: #f1f1f1;} .prolist{box-sizing: border-box; padding: 30px 0;} .prolist h3{box-sizing: border-box; padding: 0px 10px; margin-bottom: 15px; font-size: 19px; font-weight: bold; } .prolist h3 i{color:#003B83;} .prolist .pasing{border: 1px solid #ddd; border-top: 0px; padding:20px 0;} .m_contentBox{display:none;} /* 나의 강의실 상세 페이지 */ .my_topBox {overflow:visible; position:relative; z-index:1; margin-bottom:30px;} .my_topBox .score_view{ position:absolute; left:25%; bottom:-119%; width: 70%; background:#fff; box-shadow:3px 3px 6px rgba(0,0,0,10%); font-size:13px; padding-bottom:20px; z-index:99999; display:none;} .my_topBox .score_view.on{display:inline-block;} .my_topBox .score_view .tableRow ul li{padding:5px;line-height:1.8;} .my_topBox .score_view .tableRow ul li.head{ width:;} .my_topBox .score_view .tableRow ul li.con{padding:10px ; width:35%; font-weight:bold; } .my_topBox .score_view .tableRow ul li.three p{margin-bottom:0px;} .my_topBox .score_view .tableRow ul li.percent p{width:49%; margin-right:0px;} .my_topBox > div{width:100%; overflow:hidden;box-sizing:border-box; padding:20px; background:#f4f5f7; padding-bottom:10px; } .my_topBox .class_name{ font-size: 22px; overflow: hidden; line-height: 1.6; font-weight: 600 !important; text-align: left; box-sizing:border-box; padding-bottom:20px; margin-bottom:20px; border-bottom:1px solid #aaa;} .my_topBox .my_infoBox{width:100% !important; border-bottom:0px; position:relative;} .my_topBox .infoBox .my_info{display:block; padding:0px;} .my_topBox .infoBox .my_info ul.list{display:flex !important;flex-wrap: wrap; width:100%;} .my_topBox .infoBox .my_info ul.list li{width:50%; display:inline-block; font-size:15px; } .my_topBox .infoBox .my_info ul.list p.title{width: 25% !important;} .my_topBox .infoBox .my_info ul.list p.con{width: 75% !important;} .my_topBox .infoBox .my_info ul.list p.con button.score_more{margin-left:5px; } .my_topBox .infoBox .my_info ul.list p.con button.score_more.on i{color: #003B83;} .my_topBox .infoBox .my_info ul.list p.con button.score_more i{font-size:18px; color:#888; } .my_topBox .infoBox .my_info ul.list p.con button.down_btn{} .my_topBox .infoBox .my_info ul.list p.con button.down_btn i{} .my_topBox .infoBox .my_info ul.list p.con a.file{ font-weight:550;} .my_topBox .infoBox .my_info ul.list p.con a.file:last-child{margin-right:0px;} .my_topBox .infoBox .my_info ul.list p.con > span{color:#999;} .my_topBox .infoBox .my_info ul.list p.con > span i{color:#999;} .my_topBox .infoBox .my_info ul.list p.con a.file:hover{text-decoration:underline;} .my_topBox .infoBox .my_info ul.list p.con.bold span.dday{color:red;} .my_topBox .score_view button.closeBtn{display:none;} .score button.score_plus i{font-size: 14px; color: #888; margin-left:5px;} /* 학습하기 합침 */ .studyBox {} .studyBox > div{width:100%; overflow:hidden;} /* 진도율 */ .my_progress{ background: ; border:1px solid #ddd; } .my_progress > div{width:100%; overflow:hidden; box-sizing:border-box ; padding:15px 20px; display:flex; align-items: center; justify-content: space-between;} .my_progress > div p.tit{margin-right:20px;} .my_progress > div p{display:inline-block;} .my_progress > div .progress{width:540px; height:8px; border-radius:100px; background:#eee; display:inline-block; margin-right:10px;} .my_progress > div .progress .progress-bar{background:var(--color-primary-light); height:100%; border-radius:100px;} .my_progress > div .score .percent{font-size:20px; font-weight:bold; color:var(--color-primary); } .my_progress > div .st_box{ display:inline-block;} .my_progress > div .st_box button{ box-sizing:border-box; padding:10px 20px; font-size:18px; background:var(--color-primary); color:#fff; border-radius:10px;} .my_progress > div .st_box button i{margin-left:5px; } .my_progress > div .st_box button:hover{background:linear-gradient(to right, var(--color-primary-dark), var(--color-primary));} .my_progress > div .st_box button.on{background:linear-gradient(to right, var(--color-primary-dark), var(--color-primary)); box-shadow:4px 4px 10px rgba(0,0,0,10%);} .bottomBox .inner{width:100%; overflow: hidden; } .bottomBox .inner .progress_ul{width:100%; overflow: hidden; display: flex; justify-content: space-between; box-sizing: border-box; padding:50px 0px 10px 0px; } .bottomBox .inner .progress_ul li{display:inline-block; width:18%; background:#fff; border-radius: 10px;border:1px solid #ddd;} .bottomBox .inner .progress_ul li p.tit a{display:block; width: 100%; height:100%;} .bottomBox .inner .progress_ul li:hover{ box-shadow:5px 5px 10px rgba(0,0,0,20%); } .bottomBox .inner .progress_ul li p.tit{ box-sizing:border-box; padding:10px 0px; margin: 0 10px;border-bottom: 1px dotted var(--color-primary); font-weight:bold;} .bottomBox .inner .progress_ul li p.tit span{font-size:13px; margin-left:0px; font-weight:600; display:inline-block;} .bottomBox .inner .progress_ul li.all{width:20%;} .bottomBox .inner .progress_ul li.all p.tit{ } .bottomBox .inner .progress_ul li .show{ vertical-align: middle; height:120px;} .bottomBox .inner .progress_ul li.all .show .show_inner p.all_score{font-size:25px; position:absolute; left: 50%; top:50%; transform: translate(-50%, -50%); width:100%;} .bottomBox .inner .progress_ul li.all .show .show_inner span.n_b{font-size:16px; color:#1d1d1d;} .bottomBox .inner .progress_ul li .show{ /* border:1px solid #ddd;*/ text-align: center;} .bottomBox .inner .progress_ul li .show .show_inner{width: 100%; overflow: hidden; position: relative; height:100%;} .bottomBox .inner .progress_ul li .show .show_inner .noneIcon{font-size:20px; color:#ccc; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);} .bottomBox .inner .progress_ul li .show .show_inner a{width:100%; height:100%; display:block; cursor: pointer;} .bottomBox .inner .progress_ul li .show .show_inner span.score{ display:inline-block; font-size: 20px; } .bottomBox .inner .progress_ul li .show .show_inner span.score.center{position:absolute; left:50%; top:50%; transform:translate(-50%, -50%);} .bottomBox .inner .progress_ul li .show .show_inner span.score.none{cursor:inherit; color:#ccc;} .bottomBox .inner .progress_ul li .show .show_inner span.chk_ing{position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); display:inline-block; box-sizing:border-box; padding:5px 10px; background:#f9f9f9; border:1px solid #ddd; color:#777; font-size:14px; font-weight:bold; border-radius: 5px;} .bottomBox .inner .progress_ul li .show .show_inner p.score_chk{position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); width:100%;} .bottomBox .inner .progress_ul li .show .show_inner span.score1{font-size: 20px;font-weight: bold; color: var(--color-primary);} .bottomBox .inner .progress_ul li .show .show_inner p.score_chk button{margin-top:15px; min-width:72px; box-sizing:border-box; padding:6px 12px; background:var(--color-primary); color:#fff; font-size:14px; border-radius: 5px;} .bottomBox .inner .progress_ul li .show .show_inner span.test_score{color: var(--color-primary); font-weight:bold; cursor:pointer;} .bottomBox .inner .progress_ul li .show .show_inner span.survey_score{background:var(--color-primary); box-sizing:border-box; padding: 5px 15px ; cursor:pointer; font-size:16px; font-weight: bold; color:#fff;} /*.bottomBox .inner .progress_ul li .show .show_inner div button {padding:4px 8px;}*/ .bottomBox .inner .progress_ul li.stateBox{width:22%; position: relative; box-shadow: none; background:none;} .bottomBox .inner .progress_ul li.stateBox p.tit{display:flex; align-items: center; justify-content: space-between;} .bottomBox .inner .progress_ul li.stateBox p.tit span.all_score{ display:inline-block; font-size:14px; } .bottomBox .inner .progress_ul li.stateBox p.tit span.all_score .num{font-size:14px; font-weight:bold; color: var(--color-primary);} .bottomBox .inner .progress_ul li.stateBox .state{width:100%; overflow: hidden; position:absolute; left: 50%; top:50%; transform: translate(-50%, -50%);font-size:30px; font-weight:bold; } .bottomBox .inner .progress_ul li.stateBox .studying.state {color:var(--color-secondary);} .bottomBox .inner .progress_ul li.stateBox .completion.state{color: var(--color-primary-dark);} .bottomBox .inner .progress_ul li.stateBox .completion.state span{ vertical-align:middle;} .bottomBox .inner .progress_ul li.stateBox .un_completion.state{color: var(--color-text-sub);} .bottomBox .inner .progress_ul li.stateBox .state button.com_print{ font-size: 20px;background:#f4f5f7; color:#444; margin-left:10px; box-sizing:border-box; padding:5px 10px; margin:; display:inline-block; border:1px solid #ddd; border-radius:5px; } .bottomBox .inner .progress_ul li.stateBox .state button.com_print:hover{background: #dbe0eb;} .bottomBox .inner .progress_ul li.stateBox .state button.com_print_prev{font-size: 20px;background:#ddd; color:#aaa; margin-left:10px; box-sizing:border-box; padding:5px 10px; margin:; display:inline-block; border:1px solid #ddd; border-radius:5px; cursor:default; } .bottomBox .inner .progress_ul li.stateBox .state button.sur_need{display:block;margin:15px auto 0; box-sizing:border-box; padding:5px 15px; background: #fff; font-size:16px; color:#334773; border:1px solid #334773; border-radius: 5px;} .bottomBox .inner .progress_ul li.stateBox .state button.sur_need i{margin-left:5px;} .bottomBox .inner .progress_ul li.stateBox .state button.sur_need:hover{background: #334773; color:#fff;} .bottomBox .inner .progress_ul li.stateBox .state button.sur_ok{display:block;margin:15px auto 0; box-sizing:border-box; padding:5px 15px; font-size:16px; background: #334773; color:#fff; border:1px solid #334773; border-radius: 5px;} .bottomBox .inner .progress_ul li.stateBox .state button.sur_ok i{margin-left:5px;} .bottomBox .inner .progress_ul li.stateBox .state p{font-size:22px; width:90px; height:90px; border-radius: 100%; text-align:center; margin:0 auto; color:#fff; vertical-align: middle; box-sizing:border-box; padding-top: 30px;} .bottomBox .inner .progress_ul li.stateBox .state .unpaid{background:#C53636;} .bottomBox .inner .progress_ul li.stateBox .state .wait{background:#000; box-sizing: border-box; padding-top:20px; line-height: ;} .mypage_view_table ul li.li_01{width:5% !important;} .mypage_view_table ul li.li_02{width: 30% !important;} .mypage_view_table ul li.li_03{width:10% !important;} .mypage_view_table ul li.li_04{width:15% !important;} .mypage_view_table ul li.li_05{width:15% !important;} .mypage_view_table ul li br{display:none;} .mypage_view_table ul li.li_06{width:10% !important;} .mypage_view_table ul li.li_07{width:10% !important; } .mypage_view_table ul li .class_play{display: none;} .bottomBox2{overflow:hidden; box-sizing:border-box; padding:20px; background: #f9f9f9; } .bottomBox2 .title{font-weight:bold; font-size: 18px; margin-bottom: 10px; box-sizing:border-box; overflow: hidden; padding:0px 10px;} .bottomBox2 .title i{color:#003B83;} .bottomBox2 .title span.m{display:none;} .bottomBox2 .mypage_view_table .head{background: #f4f5f7 !important; border-top:1px solid #003B83 !important;} .bottomBox2 .mypage_view_table .head li{padding:15px 10px ;} .bottomBox2 .mypage_view_table ul li{padding:10px 0px; font-size: 15px; box-sizing: border-box; font-weight:bold;} .bottomBox2 .mypage_view_table ul li.li_07 button.study_btn{ font-size:14px; background: #dbe0eb; box-sizing:border-box; padding:5px 15px; font-weight: bold;border-radius: 5px;} .mypage_view_table ul li.li_07 button.study_btn:hover{background: #296EB2; color:#fff;} .bottomBox2 .mypage_view_table ul li span.wait{color: #999; font-weight:bold;} .bottomBox2 .mypage_view_table ul li span.studying{color: #42ac53;font-weight:bold;} .bottomBox2 .mypage_view_table ul li span.completion{color: #42a3b8;font-weight:bold;} .mypage_tableRow{display:none;} .view_wrap{width:100%; height:100%; font-size:13px;} .view_wrap .inner{width:100%; overflow:hidden;} .view_wrap .inner > .head{ background: #003B83; color:#fff; box-sizing: border-box; padding: 8px 20px; } .view_wrap .inner > .head h3{font-size:21px; font-weight:bold;} .view_wrap .inner .view_content{ width: 100%; overflow: hidden; box-sizing: border-box; padding: 20px;} .view_wrap .inner .view_content .tableRow_view{display:block; border:1px solid #888;} .view_wrap .inner .view_content .tableRow_view ul{display:table; height: auto; display: table; table-layout: fixed; overflow:hidden; border-bottom:1px solid #888; font-size:14px;} .view_wrap .inner .view_content .tableRow_view ul:last-child{border-bottom: 0px;} .view_wrap .inner .view_content .tableRow_view ul li.head{width:13%; text-align: center; background:var(--color-secondary-lighter); font-weight: 600;} .view_wrap .inner .view_content .tableRow_view ul li{padding:10px; width:auto; text-align: left; border-bottom: 0px; border-right: 1px solid #888; font-weight: bold; word-break: break-word;} .view_wrap .inner .view_content .tableRow_view ul li:last-child{border-right: 0px;} .view_wrap .inner .view_content .tableRow_view ul li.w100{ } /* 시험, 과제, 퀴즈 정보 */ div.table_now_new{border:0px !important; border-bottom:1px solid #aaa !important; box-sizing:border-box; padding-bottom:5px;} div.table_now_new li.head{width:10% !important; border-radius:100px; font-weight: bold;} div.table_now_new li.con{width: 23% !important;} div.table_now_new li{border-right:0px !important; padding: 5px 10px !important; margin-bottom:5px;} div.table_now_new li br{display: none;} div.table_now_new ul{border-bottom: 0px !important; box-sizing:border-box; margin: 10px 0px; } div.table_now_new ul.name{ border-collapse: initial ; box-sizing:border-box; padding:0px 0px 5px; border-bottom:2px solid #4390DD !important; margin-top:0px; margin-bottom:15px;} div.table_now_new ul.name li.con{font-weight: bold; text-align:; color:#4390DD ; font-size: 18px !important; padding:5px !important;} div.table_now_new li.head{ } .quizBox{margin-top:30px;} .quizBox .quiz{width:100%; overflow:hidden; margin-bottom:60px;} .quizBox .quiz:last-child{margin-bottom:10px !important;} .quizBox .quiz .top{display:flex; align-items:center; width:100%; box-sizing:border-box; padding-bottom:8px; border-bottom:1px solid #ddd; overflow:hidden; } .quizBox .quiz .top h3{font-size:18px; display:inline-block; width:87%; font-weight:bold !important; margin-top:1px; line-height:1.6 !important;} .quizBox .quiz .top span.num{ font-size:16px; margin-right:10px; background:var(--color-secondary-darken); color:#fff; font-weight:normal; border-radius:4px; width:27px; height:27px; line-height:27px; text-align:center; display:inline-block; float:left;} .quizBox .quiz .top span.num.wrong{background: red ;} .quizBox .quiz .top span.num.answer{background:green;} .quizBox .quiz .top p.score{display:inline-block; font-size:15px; width:7%; text-align:right; color:#888; font-weight:600; overflow:hidden; float:right;} .quizBox .quiz .top .explanBox{ box-sizing:border-box; background:#f5f5f5; border-radius: 5px; padding:15px; margin: 25px 34px 0px; position:relative;} .quizBox .quiz .top p.explan{ } .quizBox .quiz .top .explanBox:after { content: ''; position: absolute; top: 0; left: 100px; width: 0; height: 0; border: 20px solid transparent; border-bottom-color: #f5f5f5; border-top: 0; margin-left: -15px; margin-top: -15px; } .quizBox .quiz .check{width:100%; padding-left:35px !important; overflow:hidden; box-sizing:border-box;} .quizBox .quiz .check ul{width:100%; } .quizBox .quiz .check ul li{box-sizing:border-box; padding:8px 0; width:100%; } .quizBox .quiz .check ul li img{width: 30% !important; margin-top:5px; border:1px solid #ddd;} .quizBox .quiz .check ul li.wrong{color:red; font-weight:bold;position:relative;} .quizBox .quiz .check ul li.wrong span.num{background:red; color:#fff;} .quizBox .quiz .check ul li.wrong:after{position:absolute; content:"오답"; color:red; left:-30px; top:50%; transform:translateY(-50%);} .quizBox .quiz .check ul li.answer{color:green; font-weight:bold;position:relative;} .quizBox .quiz .check ul li.answer span.num{background:green; color:#fff;} .quizBox .quiz .check ul li.answer:after{position:absolute; content:"정답"; color:green; left:-30px; top:50%; transform:translateY(-50%);} .quizBox .quiz .check ul li span.num{width: 20px;height: 20px;line-height: 20px;text-align: center;display: inline-block;border-radius: 100px; margin-right: 10px; font-weight: bold; color:#fff; background: #888;} .quizBox .quiz .check ul li div.content{display:inline-block; width:90%; font-size:16px;} .quizBox .quiz .info{width:100%; overflow:hidden; box-sizing:border-box; padding:15px; background:#f7f7f7; border-radius:10px; margin-top:10px;} .quizBox .quiz .info p span{margin-right:10px; font-weight:bold; box-sizing:border-box; padding:3px 10px; border-radius:10px; height:100%; display:inline-block; float:left; margin-top:-4px;} .quizBox .quiz .info p img{width:90% !important; margin-top: 10px;} .quizBox .quiz .info p.answer{margin-bottom:15px; } .quizBox .quiz .info p.answer span{background:green; color:#fff; } .quizBox .quiz .info p.tip{margin-bottom:15px;} .quizBox .quiz .info p.tip.feedback { display:flex;} .quizBox .quiz .info p.tip:last-child{margin-bottom: 0px;} .quizBox .quiz .info p.tip span.tit{background:#887BB0; color:#fff; } .quizBox .quiz .info p.tip span.score{float:inherit; margin-top: 0px; margin-right: 0px; padding:0px;} .quizBox .quiz .info p.tip textarea{margin-top:10px; height:100px; resize: none; width: 100%; box-sizing: border-box;padding: 20px; border: 1px solid #ddd;} .quizBox .quiz .info span.feedback{margin-top: 0px; margin-right: 0px; padding:0; width:90%; } .quizBox .quiz .write{padding:10px 10px;} .quizBox .quiz .check p.tit{font-size:16px; margin-bottom:10px;} .quizBox .quiz .check p.tit i{color: #547BAE;} .quizBox .quiz .check .answerBox{width:100%; border:1px solid #ddd; border-radius:5px; box-sizing:border-box; padding:10px; } .quizBox .quiz .check .answerBox a{width:100%; height:100%; display:block;} .quizBox .quiz .check .answerBox a:hover{text-decoration:underline;} /* 이미지 노출 */ .quizBox .quiz .top .q_imgBox{ box-sizing:border-box; padding:0px 37px; overflow:hidden; width:100%; margin-top:10px; } .quizBox .quiz .top .q_imgBox img{width: 50% !important; border:1px solid #ddd; } .view_content .view_button_wrap{width: 100%; overflow: hidden;text-align: center;box-sizing: border-box;padding: 15px 0;} .view_content .view_button_wrap button{box-sizing: border-box; padding: 12px 20px; font-size:18px; cursor: pointer; border-radius:100px;} .view_content .view_button_wrap button.close{border:1px solid #e2e2e2;} .view_content .view_button_wrap button.close:hover{border:1px solid #1d1d1d;} .view_content .view_button_wrap button.enter {background:var(--color-primary); color: #fff; margin-left:10px;} .view_content .view_button_wrap button.enter:hover{background:var(--color-primary-dark);} .view_wrap .quizBox .quiz{margin-bottom: 30px; } .view_wrap .quizBox .quiz .check ul li{ } .view_wrap .quizBox .quiz .check ul li.s_check label span.num{background: #60a4e7; color:#fff; } .view_wrap .quizBox .quiz .check ul li.s_check label span.content{color: #60a4e7;} .view_wrap .quizBox .quiz .check{padding:10px;} .view_wrap .check input[type="checkbox"]{ display:none;} .view_wrap .check input[type="checkbox"] + label{cursor: pointer;display:flex; padding:4px;} .view_wrap .check input[type="checkbox"].check + label{color: #60a4e7;} .view_wrap .quizBox .quiz .check .answer input{border-radius:5px;} .sur_wrap .quizBox .quiz .check ul li:hover{cursor:default;font-weight:normal; } .sur_wrap .check input[type="checkbox"] + label{cursor:default;font-weight:normal; } .sur_wrap .check input[type="checkbox"]:checked + label span.num{background: #60a4e7; margin-right: 10px;} .sur_wrap .check input[type="checkbox"]:checked + label{color: #60a4e7;} /*.input_wrap .check input[type="checkbox"]:checked + label span.num{background: #60a4e7; color:#fff;} .input_wrap .check input[type="checkbox"]:checked + label span.content{color: #60a4e7;} */ .input_wrap .check input[type="checkbox"] + label:hover span.num{background:var(--color-secondary); color:#fff;} .input_wrap .check input[type="checkbox"] + label:hover span.content{font-weight: bold; color:var(--color-secondary-dark);} .input_wrap .check input[type="checkbox"]:checked + label {background:var(--color-secondary-lighter);} .input_wrap .check input[type="checkbox"]:checked + label span.num {background:var(--color-secondary);} .input_wrap .check input[type="checkbox"]:checked + label span.content{font-weight: bold; color:var(--color-secondary-dark);} /*.input_wrap .check input[type="checkbox"]:checked + label span.num{background: #60a4e7; margin-right: 10px;} .input_wrap .check input[type="checkbox"]:checked + label{color: #60a4e7;} */ .input_wrap .quizBox .write .answer textarea{ resize: none;width: 100%;min-height: 200px; height:auto; box-sizing: border-box;padding: 20px;border: 1px solid #ddd; border-radius: 5px; z-index: -1;} /* 수료증 */ .completion_wrap{ background: url("/img/common/completion_bg.png") no-repeat top; height: 950px; font-family: 'NotoSerifKR'; width: 700px; margin:0 auto; overflow: hidden; } .completion_wrap .inner{ overflow:hidden; box-sizing:border-box; padding: 193px 0px 0px; width: 100%; height: 100%; position: relative;} .completion_wrap .inner .titleBox{width:100%; overflow:hidden; text-align: center;} .completion_wrap .inner .titleBox h2.tit{font-size:60px; text-align: center; font-weight:600; margin-bottom:50px;} .completion_wrap .inner .titleBox .infoBox {box-sizing: border-box; margin-top:120px; padding: 0px 130px; overflow: hidden;} .completion_wrap .inner .titleBox .infoBox ul{width:100%; overflow:hidden; } .completion_wrap .inner .titleBox .infoBox ul li{font-size: 16px; font-weight:bold; margin-bottom: 5px; display: flex;} .completion_wrap .inner .titleBox .infoBox ul li:last-child{margin-bottom:0px;} .completion_wrap .inner .titleBox .infoBox ul li p.title {display: flex; float: left; width: 23%;justify-content: space-between;margin-right: 10px; font-weight:bold;} .completion_wrap .inner .titleBox .infoBox ul li > span{width: 80%; overflow: hidden; display: inline-block;text-align: left;} .completion_wrap .inner .contentBox{margin: 70px auto 0px; box-sizing:border-box; padding: 0px 100px;text-align: center;} .completion_wrap .inner .contentBox p{font-size: 22px; line-height: 1.5; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical;} .completion_wrap .inner .dateBox{position: absolute; bottom: 23%; left: 50%; transform: translateX(-50%); width: 100%;} .completion_wrap .inner .dateBox p{text-align: center; font-size:20px;} .completion_wrap .inner .stempBox{text-align: center; position: absolute; overflow: hidden; box-sizing: border-box; padding: 10px 0px 38px; bottom: 12%; left: 45%; transform: translateX(-50%); width: 100%; overflow: hidden;} .completion_wrap .inner .stempBox p{font-size:36px; display:inline-block; font-weight:400; } .completion_wrap .inner .stempBox .stemp{display:inline-block; position: absolute; width:80px; height:80px; border: 0px solid #ddd; top:40%; transform: translateY(-50%); right:13%;} .completion_wrap .inner .stempBox .stemp img{width:100% !important;} /* 학습창 */ body.learning{ } .learning_wrap{background:rgba(0,0,0,20%); height:100%; display: flex; align-items: center;} .learning_wrap .inner{width:100% ; display: flex; align-items: center; justify-content: space-between; overflow:hidden; height: 100%;} .learning_wrap .inner .videoBox{display:inline-block; box-sizing:border-box; margin:0px auto; width:auto; height: auto; overflow:auto;text-align:center; position:relative; position:relative; max-width:1100px; max-height: 670px; } .learning_wrap .inner .study_endBox{ width:1000px; overflow:hidden; display:flex;justify-content: space-between; align-items: center; margin:10px auto;} .learning_wrap .inner .study_endBox button.end_btn{box-sizing:border-box; font-size:16px; box-sizing: border-box; padding: 8px 25px; font-family: 'Noto Sans KR', sans-serif; background: #3A81C7; color:#fff; font-size:20px;} .learning_wrap .inner .study_endBox button.end_btn:hover{background: #003B83;} .learning_wrap .inner .study_endBox .txt{display:inline-block; float:left; color: #003B83; font-weight:600; font-size:18px;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.refreshBtn{} .learning_wrap .inner .videoBox iframe{border: 0px; } .learning_wrap .inner .boardBox{display:inline-block; position: relative; float:right; height: 750px; } .learning_wrap .inner .boardBox button.openBtn{position: absolute; left:-30px; top:50%; width:30px; height:75px; background: rgba(0,0,0,22%); transform: translateY(-50%);} .learning_wrap .inner .boardBox button.openBtn:after{position: absolute; content: '\f105'; left:50%; top:50%; transform: translate(-50%, -50%); color:#fff; font-family: 'FontAwesome'; font-size: 20px;} .learning_wrap .inner .board_inner{ width:470px;height:100%; overflow-y:auto;} .learning_wrap .inner .board_inner.open{display:none;} .learning_wrap .inner button.openBtn.arrow:after{content: '\f104';} .learning_wrap .inner .boardBox .mainTit{text-align: center; font-size: 18px; background: linear-gradient(to right, #003B83, #3A81C7); box-sizing: border-box; padding: 10px 20px; color:#fff; border-radius: 30px 0px 0px 0px; line-height:1.6 !important; font-weight:normal;} .learning_wrap .inner .boardBox .bottomBox{ background: #fff; border-radius: 0px 0px 0px 30px; height:701px;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner{width:100%; overflow:hidden; box-sizing:border-box; padding:20px; position:relative; height:100%;} .nameBox_m{display:none;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .nameBox{width:100%; margin-bottom: 20px; } .learning_wrap .inner .boardBox .bottomBox .bottom_inner .nameBox .class_name{font-size:20px; font-weight: bold; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; margin-bottom:15px; } .learning_wrap .inner .boardBox .bottomBox .bottom_inner .nameBox .class_name i{margin-right: 5px;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .nameBox p.sub_name{font-size: 16px; color:#555555; overflow: hidden; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } .learning_wrap .inner .boardBox .bottomBox .bottom_inner .nameBox p.sub_name span{display: inline-block; box-sizing: border-box; padding: 1px 20px; color:#fff; background:#555; font-weight:400; margin-right: 5px; } .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board{width:90%; overflow:hidden;position:absolute; bottom:20px; left:50%; transform: translateX(-50%);} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board .tab_menu_lning{width:100%; margin-bottom:10px;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board .tab_menu_lning ul{width:100%; overflow:hidden; display:flex; justify-content: space-between; } .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board .tab_menu_lning ul li{width:33.333%; text-align: center; color:#AAAAAA; font-size:16px; border-right:1px solid #aaa; cursor:pointer;box-sizing:border-box; padding: 10px 0;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board .tab_menu_lning ul li:last-child{border-right:0px;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board .tab_menu_lning ul li.current{ background: rgba(0,59,131,7%); color:rgba(0,59,131,100%); font-weight:600; } .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board .content_lning{width:100%; } .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board .content_lning .tab-content{display:none;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board .content_lning .tab-content.current{display:inline-block; width:100%;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board .content_lning .tab-content p.no_list{position:absolute; left:50%; top:50%; transform: translate(-50%, -50%); color:#555555;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board .content_lning .tab-content .content{display:none; } .learning_wrap .inner .boardBox .bottomBox .bottom_inner .board .content_lning .tab-content .content.current{display:inline-block; position: relative; width:99.5%;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2{width:100%; overflow:hidden; height:42px;} .buttonBox_m{display:none;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button{box-sizing:border-box; font-size:16px; box-sizing: border-box; padding: 8px 25px; font-family: 'Noto Sans KR', sans-serif;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.refreshBtn{float:right; background:#f9f9f9; color:#555; border:1px solid #ddd;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.editBtn{float:right; background:#999; color:#fff; border:1px solid #999; margin-left:5px !important;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.editBtn:hover{background: rgba(41,110,178,100%); border: 1px solid rgba(41,110,178,100%) ;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.writeBtn{float:left; color:#003B83; border:1px solid #003B83;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.writeBtn:hover{background:#003B83; color:#fff;} .video_contentBox{width:100%; height:100%;flex-wrap: wrap;align-content: center; display:flex; } @media screen and (max-width:640px) { .video_contentBox {height:auto; align-content:stretch;} } /* 학습창 페이징 버튼 */ .learning_wrap .inner .arrowBox{ margin-top: 10px; margin-right: 5px;} .learning_wrap .inner .arrowBox button{width:30px; height:30px;background: #003B83; color:#fff; border-radius: 100%; box-shadow: 3px 3px 6px rgba(0,0,0,25%);} .learning_wrap .inner .arrowBox button i{font-size: 20px; line-height:31px; } .learning_wrap .inner .arrowBox button.next{margin-left:5px; float: right;} /* 일반 게시판 */ .learning_wrap .tab-content .boardList{width:100%; margin-bottom: 10px; overflow:hidden; height: 445px; background: #f9f9f9; border:1px solid #dddd; position:relative;} .learning_wrap .tab-content .boardList::-webkit-scrollbar { width: 3px; /* 스크롤바의 너비 */ } .learning_wrap .tab-content .boardList::-webkit-scrollbar-thumb { height: 10%; /* 스크롤바의 길이 */ background: #9B9B9B; /* 스크롤바의 색상 */ border-radius: 10px; } .learning_wrap .tab-content .boardList::-webkit-scrollbar-track { background: #ddd; /*스크롤바 뒷 배경 색상*/ } .learning_wrap .tab-content .boardList .boardUl{width:100%; overflow:hidden; background:#fff;} .learning_wrap .tab-content .boardList .boardUl li.list{width:100%;overflow: hidden; border-bottom: 1px dotted #DDDDDD; } .learning_wrap .tab-content .boardList .boardUl li.list:hover a .textBox p.tit{text-decoration: underline; } .learning_wrap .tab-content .boardList .boardUl li.list.list_noti{background:#E4E7EB; font-weight:600;} .learning_wrap .tab-content .boardList .boardUl li.list.list_noti ul.subInfo li{color: #555 !important;} .learning_wrap .tab-content .boardList .boardUl li.list a{width:100%; display:flex;align-items: center; justify-content: space-between; } .learning_wrap .tab-content .boardList .boardUl li.list a .textBox{width:90%; box-sizing: border-box; padding: 20px; overflow:hidden;} .learning_wrap .tab-content .boardList .boardUl li.list a .textBox p.tit{font-size:16px; margin-bottom:10px; overflow:hidden; width:100%; word-break: break-word; display: -webkit-box; -webkit-line-clamp: 1; -webkit-box-orient: vertical; } .learning_wrap .tab-content .boardList .boardUl li.list a .textBox ul.subInfo{width:100%; oevrflow:hidden; } .learning_wrap .tab-content .boardList .boardUl li.list a .textBox ul.subInfo li{display:inline-block; color:#AAAAAA; font-size:14px; font-weight:400; margin-right:10px; box-sizing:border-box; padding-right:10px; border-right:1px solid #aaa;} .learning_wrap .tab-content .boardList .boardUl li.list a .textBox ul.subInfo li:last-child{margin-right:0px; padding-right:0px; border-right:0px;} .learning_wrap .tab-content .boardList .boardUl li.list a .textBox ul.subInfo li i{margin-right:5px;} .learning_wrap .tab-content .boardList .boardUl li.list a .arrow{width: 10%; text-align:center;} /* Q&A */ .learning_wrap .tab-content .boardList .boardUl li.list a .textBox_qna{width:68% ;} .learning_wrap .tab-content .boardList .boardUl li.list a .state{width:21%; height:100%; overflow:hidden; border-right:1px solid #aaa;} .learning_wrap .tab-content .boardList .boardUl li.list a .state .stateTxt {text-align:center; font-weight:bold; font-size:14px;} .learning_wrap .tab-content .boardList .boardUl li.list a .state .stateTxt img{ margin-bottom: 10px;} .learning_wrap .tab-content .boardList .boardUl li.list a .state .stateTxt.no{color:#CC0000;} .learning_wrap .tab-content .boardList .boardUl li.list a .state .stateTxt.repple{color:#006ABB;} /* Q&A 뷰 */ .content_view{width:100%;} .content_view .boardView{width:100%; margin-bottom: 10px;overflow:hidden; overflow-y:auto; height: 445px; background: #f9f9f9; border:1px solid #dddd; } .content_view .boardView .view_inner{width:100%; overflow:hidden; } .content_view .boardView::-webkit-scrollbar { width: 3px; /* 스크롤바의 너비 */ } .content_view .boardView::-webkit-scrollbar-thumb { height: 10%; /* 스크롤바의 길이 */ background: #9B9B9B; /* 스크롤바의 색상 */ border-radius: 10px; } .content_view .boardView::-webkit-scrollbar-track { background: #ddd; /*스크롤바 뒷 배경 색상*/ } .content_view .boardView .view_inner .mainContent{width:100%; overflow: hidden; box-sizing:border-box; padding:20px; background:#fff; } .content_view .boardView .view_inner .mainContent .tit{font-weight:600; font-size:18px; display:inline-block; width:83%; } .content_view .boardView .view_inner .mainContent .state{float:right; text-align: right; font-weight:bold; font-size:14px; color:#006ABB; width:16%; display:inline-block;} .content_view .boardView .view_inner .mainContent .state.state_ok{color:#006ABB; } .content_view .boardView .view_inner .mainContent .state.state_no{color:#CC0000;} .content_view .boardView .view_inner ul.sub_info{width:100%; oevrflow:hidden; margin-top:10px; box-sizing:border-box; } .content_view .boardView .view_inner ul.sub_info li{ color:#AAAAAA; font-size:14px; font-weight:400; box-sizing:border-box; padding:; margin-top:5px; = font-size:14px;} .content_view .boardView .view_inner ul.sub_info li:last-child{margin-right:0px; padding-right:0px; border-right:0px;} .content_view .boardView .view_inner ul.sub_info li a{color:#003B83; font-weight: bold;} .content_view .boardView .view_inner ul.sub_info li:hover a{text-decoration: underline;} .content_view .boardView .view_inner .contentBox{width:100%; overflow:hidden; margin:20px 0px; } .content_view .boardView .view_inner .contentBox img{width:80% !important; text-align: center !important;} .content_view .boardView .view_inner .reppleBox{width:100%; overflow: hidden; border-top:1px solid #ddd; box-sizing:border-box; padding:20px; } .content_view .boardView .view_inner .reppleBox .tit{font-weight:600; font-size:18px; display:inline-block; width:100%; } .content_view .boardView .view_inner .contentBox{width:100%; overflow:hidden; margin:20px 0px 0px; border-top: 1px solid #eee; box-sizing: border-box; padding-top: 20px;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.backBtn{color:#5A5A5A; border:1px solid #D2D2D2; padding:8px 15px; margin-right:10px;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.backBtn:hover{border:1px solid #5a5a5a;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.deleteBtn{color:#E8BFBF; border:1px solid #E8BFBF; float:right;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.deleteBtn:hover{color:#C70000; border:1px solid #C70000;} /* Q&A 문의하기 */ .content_write{width:100%;} .content_write .boardWrite{background:#fff; width:100%; margin-bottom: 10px; overflow:hidden; height: 445px; border:1px solid #dddd; } .content_write .boardWrite .write_inner{width:100%; overflow:hidden;} .content_write .boardWrite .write_inner .titBox{width:100%; overflow: hidden; box-sizing: border-box; padding:10px; } .content_write .boardWrite .write_inner .titBox input{box-sizing:border-box; padding:10px; border-radius: 5px;} .content_write .boardWrite .write_inner .fileBox{ overflow: hidden; margin:5px 10px; background: #F6F6F6; padding: 5px 10px;} .content_write .boardWrite .write_inner .fileBox label{font-size:14px; margin: 0px 10px; } .content_write .boardWrite .write_inner .fileBox input{border:0px;} .content_write .boardWrite .write_inner .writeBox{width:100%; overflow: hidden; box-sizing: border-box; padding:10px;} .content_write .boardWrite .write_inner .writeBox textarea{width: 100%; height:314px; box-sizing:border-box; padding:10px; border-radius: 5px; border:1px solid #ddd; resize: none; overflow-y: auto; font-family: 'Noto Sans KR', sans-serif;} textarea::-webkit-scrollbar { width: 5px; /* 스크롤바의 너비 */ } textarea::-webkit-scrollbar-thumb { height: 10%; /* 스크롤바의 길이 */ background: #9B9B9B; /* 스크롤바의 색상 */ border-radius: 10px; } textarea::-webkit-scrollbar-track { background: #ddd; /*스크롤바 뒷 배경 색상*/ } .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.inBtn{color:#98AEC8; border:1px solid #98AEC8; float:right;} .learning_wrap .inner .boardBox .bottomBox .bottom_inner .buttonBox2 button.inBtn:hover{border:1px solid rgba(0,59,131,100%); color:rgba(0,59,131,100%);} /* 관심교육 */ .mypage_inter{border: 1px solid #ddd; width:auto;border-bottom: 0px; border-top: 0px; } .mypage_inter ul.head{ /*border-top:2px solid #296EB2; border-bottom: 1px solid #296EB2;*/ background:var(--color-primary-bglight); border-top: 1px solid var(--color-primary);} .mypage_inter ul.head li{ font-weight:bold; color:var(--color-primary); padding: 10px !important;} .mypage_inter ul li{padding: 10px !important; line-height: 1.7; font-size:16px;} .mypage_inter ul li a{font-weight: bold; } .mypage_inter ul:hover{background:#f9f9f9;} .mypage_inter ul.head:hover{ background:#f4f5f7;} .mypage_inter ul li.bold{color: #b84c97;} .mypage_inter ul {display:flex;justify-content: space-between; align-items: center;} .mypage_inter ul.none li{width:100%;} .mypage_inter ul .li_01{ width:35%;} .mypage_inter ul .lect_name{display:flex; align-items: center;} .mypage_inter ul .lect_name img.like_thum{width:25%; display:inline-block; float: left; border-radius:8px;} .mypage_inter ul .lect_name p.lect_name{ text-align:left; margin-left:10px;display:inline-block; float: left; width:75%; } .mypage_inter ul .lect_name p.lect_name a{width:100%; height:100%; display:block; font-weight:bold; line-height:1.7; } .mypage_inter ul .li_02{width: 10% ;} .mypage_inter ul .li_03{width: 13%;} .mypage_inter ul .li_04{width: 7%;} .mypage_inter ul li button.deleteBtn{ font-weight:bold; border:1px solid #aaa; color:#555; border-radius: 100px; box-sizing: border-box; padding:5px 10px;} .mypage_inter ul li button.deleteBtn:hover{background:#1d1d1d; color:#fff; border:1px solid #1d1d1d;} .in_con .conlist .i_m_contentBox{display: none;} .in_con .prolist .i_m_processBox{display: none;} /* 문의 내역 */ .mypageBox{overflow:hidden;} .mypage_qna{border: 1px solid #ddd; width:auto;border-bottom: 0px; border-top: 0px; } .mypage_qna ul.head{ /*border-top:2px solid #296EB2; border-bottom: 1px solid #296EB2;*/ background:var(--color-primary-bglight); border-top: 1px solid var(--color-primary);} .mypage_qna ul.head li{ font-weight:bold; padding: 15px 10px; color:var(--color-primary);} .mypage_qna ul li.li_02.reply a{position: relative; box-sizing: border-box; line-height: 26px; } .mypage_qna ul li.li_02.reply span.re{font-size:12px; line-height: 1.5; } .mypage_qna ul li{padding: 10px !important; line-height: 1.7; font-size:16px;} .mypage_qna ul li a{padding: 13px 10px !important; } .mypage_qna ul:hover{background:#f9f9f9;} .mypage_qna ul.head:hover{ background:#f4f5f7;} .mypageBox .pasing{border: 1px solid #ddd; border-top: 0px; padding: 20px 0;} .mypage_qna ul li.left:hover{color:#1d1d1d;} .mypage_qna ul li.li_01{width: 5%;} .mypage_qna ul li.li_02{width: 30%;} .mypage_qna ul li.li_03{width: 8%;} .mypage_qna ul li.li_04{width: 8%;} .mypage_qna_class ul li.li_01{width: 4%;} .mypage_qna_class ul li.li_02{width: 30%;} .mypage_qna_class ul li.li_03{width: 25%;} .mypage_qna_class ul li.li_04{width: 8%;} .tab_content .tab-content.tab-content-2{display:block;} .tab-link-2{padding:0px !important;} .tab-link-2 a{width:100%; height: 100%; display: block; padding:15px; box-sizing: border-box;} .classInfo{font-weight: bold; box-sizing: border-box; margin-top: 50px; display:flex; align-items: center; justify-content: space-between; justify-content: space-between;} .classInfo .info{overflow:hidden; display:inline-block; width:89%; border-left:1px dotted #1d1d1d; box-sizing:border-box; padding-left:20px; color: #003B83;} .classInfo .info i{margin-right:5px; color: rgba(41,110,178, 80%); margin-top: 6px;} .classInfo .info p.className{line-height:1.7; width:100%; font-weight:bold;} .classInfo .info p.className span{display: inline-block; font-weight:normal; } .classInfo_reply{ margin-bottom: 15px; box-sizing: border-box; background: #;} .classInfo .replyTitle{display:inline-block; margin-bottom:0px; } /* 설문 */ .in_con .in_con_inner .surveyList{width:100%; overflow:hidden; display:flex; justify-content: space-between; flex-wrap: wrap; margin-top: -30px; box-sizing: border-box; padding:10px;} .in_con .in_con_inner .surveyList .survey{ display:inline-block; width:48%; border:1px solid #ddd; margin-top:30px; border-top: 1px solid #111; cursor: pointer;} .in_con .in_con_inner .surveyList .survey:hover{box-shadow: 3px 3px 10px rgba(0,0,0,15%);} .in_con .in_con_inner .surveyList .survey .topBox{width:100%; overflow:hidden; box-sizing: border-box; padding:15px; background:#f4f5f7;} .in_con .in_con_inner .surveyList .survey .topBox h3{font-weight:bold; color:#296EB2; overflow: hidden;word-break: break-word; ine-height:1.6;display: -webkit-box;-webkit-line-clamp: 1; -webkit-box-orient: vertical; font-size: 18px; float:left; width:95%;} .in_con .in_con_inner .surveyList .survey .topBox i{width:5%; text-align: right;} .in_con .in_con_inner .surveyList .survey .bottomBox{width:100%; overflow:hidden; box-sizing: border-box; padding:15px; display:flex; justify-content: space-between; align-items: center;} .in_con .in_con_inner .surveyList .survey .bottomBox .left{ width: 100%; overflow:hidden; } .in_con .in_con_inner .surveyList .survey .bottomBox .left ul{display: flex; overflow:hidden; } .in_con .in_con_inner .surveyList .survey .bottomBox .left ul li{display:inline-block;font-weight:400; box-sizing:border-box; padding:5px 0;} .in_con .in_con_inner .surveyList .survey .bottomBox .left ul li.head{width: 20%; font-weight:bold;} .in_con .in_con_inner .surveyList .survey .bottomBox .left ul li.con{width: 78%;} .in_con .in_con_inner .surveyList .survey .bottomBox .left ul li.bold{color:#b84c97;} .in_con .in_con_inner .surveyList .survey .bottomBox .left ul li span.no_sur{color:red;} .in_con .in_con_inner .surveyList .survey .bottomBox .left ul li span.ok_sur{color:#42a3b8;} /*.in_con .in_con_inner .surveyList .survey .bottomBox button.particendBtn{ background:#666; color:#fff; box-sizing:border-box; padding:0px 15px; display:inline-block; height:40px; cursor: inherit;} .in_con .in_con_inner .surveyList .survey .bottomBox button.particBtn{ background:#fff; color:#296EB2; box-sizing:border-box; padding:0px 15px; display:inline-block; height:40px; font-weight: bold; box-shadow: 0px 3px 6px rgba(0,0,0,10%); border:1px solid #eee;} .in_con .in_con_inner .surveyList .survey .bottomBox button.particBtn:hover{box-shadow: 0px 5px 10px rgba(0,0,0,15%); font-weight:600;}*/ /* 나의 강의실 검색 */ .usr_search{margin-top:30px;} .usr_search > div{width:100%; overflow:hidden;} .usr_search > div .table_row{border-top:1px solid #ddd; width:100%; border-bottom:1px solid #ddd; margin-bottom:30px;} .usr_search > div .table_row ul{display:table; border-collapse: collapse; table-layout: fixed; width:100%; overflow:hidden; border-bottom:1px solid #ddd;} .usr_search > div .table_row ul:last-child{border-bottom:0px;} .usr_search > div .table_row ul li{display:table-cell; box-sizing:border-box; padding: 10px; font-size: 16px; vertical-align: middle ;} .usr_search > div .table_row ul li.head{width:144px; text-align:center; background: #f4f5f7; font-weight:600; } .usr_search > div .table_row ul li.con{width: ;} .usr_search > div .table_row ul li.w100{width:85%;} .usr_search > div .table_row ul li input[type="text"] {font-size:16px;} .usr_search > div .usr_search_btn {background : var(--color-primary-light); color:#fff;} .usr_search > div .usr_search_btn:hover {background:var(--color-primary);} .conlist h3 .num{color:#003B83; font-weight:600; font-size:22px;} .conlistH3 .num{color:#003B83; font-weight:600; font-size:22px;} /* 학습창 페이징 버튼 */ .mobile_class .inner .arrowBox{ margin-top: 10px; margin-right: 5px;} .mobile_class .inner .arrowBox button{width: 70px; height: 70px;background: #003B83; color:#fff; border-radius: 100%; box-shadow: 3px 3px 6px rgba(0,0,0,25%);} .mobile_class .inner .arrowBox button i{font-size: 50px; line-height: 70px; } .mobile_class .inner .arrowBox button.next{margin-left:5px; float: right;} /* 이용 안내 */ .in_con .in_con_inner .locationBox{ width: 100%; overflow: hidden;background: #fff; } .in_con .in_con_inner .locationBox .address{ box-sizing: border-box; margin-top:30px; padding-bottom: 30px; display: flex; align-items: center; border-bottom: 2px solid #4390DD; overflow: hidden;} .in_con .in_con_inner .locationBox .transport{ overflow: hidden; margin:20px 10px; display:flex; } .in_con .in_con_inner .locationBox .address p.icon{ font-size: 50px;width: 90px;height: 90px;line-height:90px; border: 1px solid #ddd;border-radius: 100%;text-align: center; margin-right: 20px;} .in_con .in_con_inner .locationBox .address p.icon i{} .in_con .in_con_inner .locationBox p.text{display:inline-block; line-height:1.6; color:#000;} .in_con .in_con_inner .locationBox .address p.text{font-size:20px; font-weight:bold;} .in_con .in_con_inner .locationBox .address p.icon{color:#1d1d1d;} .in_con .in_con_inner .locationBox .transport div{ width: 50%; display: flex;align-items: center;} .in_con .in_con_inner .locationBox .transport div.bus{border-bottom:0px; } .in_con .in_con_inner .locationBox .transport div p.icon{ font-size: 40px;color:#4390DD;width: 70px;height: 70px;line-height: 70px; border: 1px solid #ddd;border-radius: 100%;text-align: center; margin-right: 20px;} /* 반응형 */ @media screen and (max-width:640px) { .main_con .in_con .in_con_inner.in_sp_inner{padding:20px 0;} .main_con .in_con .in_con_inner.in_sp_inner img{width:100% !important;} .main_con .in_con .in_con_inner > img{width:100% !important;} .main_con .in_con .in_con_inner {font-size: 13px; padding:15px 0px;} /* 서브 페이지 내용 */ .sub_con{background: url("/img/sub/sub_bg.png") no-repeat top;} .sub_content .sub_content_inner{width: 100%; padding: 30px 20px;} .sub_bn .titBox{padding: 30px 0;} .sub_bn .titBox h3.tit{font-size: 18px; margin-bottom: 8px;} .sub_bn .titBox p.eng{font-size: 14px;} .leftMenu{display: none;} .main_con{display: block; clear: both; width: 100%;} .main_con .content{ box-sizing:border-box; font-size: 13px;} .sub_content{border-radius:0;} .main_con .titBox h3{font-size: 20px; display: block; clear: both; width: 100%;} .main_con .titBox .naviBox{margin-bottom: 20px; display:none;} .main_con .titBox .naviBox ul li{font-size: 13px;} .main_con .in_con .in_con_inner section h3.tit{font-size: 16px;} .main_con .in_con .in_con_inner section h3.tit img{width: 20px; margin-right: 5px;} .main_con .in_con .in_con_inner section p{font-size: 13px; padding-left: 20px;} .main_con .in_con .in_con_inner section p img{width: 100%;} .conlist{padding-top:0px;} /* 게시판 */ .pasing{padding: 20px 0;} .table_list ul li{ padding: 5px; font-size: 14px; box-sizing: border-box;} .table_list ul li.left img{margin-top: 0px;} .table_list.table_list_board ul.head li{padding: 10px 5px;} .table_list.table_list_board ul li.li_01{display: none;} .table_list.table_list_board ul li.li_02{width: 20%;} .table_list.table_list_board ul li.li_02 a{width:100%; padding: 8px;} .table_list.table_list_board ul li.li_03{width: 5%;} .table_list.table_list_board ul li.li_05{width: 10%;} .table_list.table_list_board ul li.li_04{display: none;} .table_list.table_list_board ul li.li_06{display: none;} .pasing ul li{font-size: 11px; margin: 0 5px;} .pasing ul li.arrow{font-size: 11px; width: 20px; height: 20px; line-height: 20px;} .search_Box{padding: 0px 0px 20px !important;} .search_Box .search{width: 100%; padding:10px;} .search_Box .search .in{width: 100%;} .search_Box .search .cate_lect{display:none;} .search_Box .btn_box{width:40px; float:right;} .search_Box .search select{ margin: 0 auto 10px; } .usr_search > div .table_row{ } .usr_search > div .table_row ul{display:block;border-bottom:0px;} .usr_search > div .table_row ul li{ display:inline-block; } .usr_search > div .table_row ul li.head{width: 21%; font-size:14px; padding:15px 5px; } .usr_search > div .table_row ul li.con{width: 77%; padding:0px 10px;} .usr_search > div .table_row ul li.con input{width:100%;} .m_boardList{margin-top:0px !important;} /* 로그인 */ .login_wrap{padding: 50px 10px;} .login_box{width: auto; } .login_box .login_box_inner{padding: 10px 0 0;} .login_wrap h2.title{font-size: 20px;} .login_box .login_box_inner .input_box{margin-top:0;} .login_box .login_box_inner .input_box .id{width: 90%; padding:16px 8px;} .login_box .login_box_inner .input_box .pw{width: 90%; padding:16px 8px;} .login_box .login_box_inner .input_box i{width: 7%; font-size: 14px;} .login_box .login_box_inner .input_box input{width: 90%; padding: 0px 10px;} .login_box .login_box_inner button.login{width: 90%; padding:16px 8px;} .login_box .login_box_inner .id_save{margin: 15px 0 15px 8%;} .login_box .login_box_inner .id_save label{font-size: 14px;} .login_box .login_box_inner .login_search{width: 90%; margin: 20px auto 0; padding: 5px 0px 0;} .login_box .login_box_inner .login_search ul li.join{text-align: center; float: inherit; margin-top: 15px;} .login_box .login_box_inner .login_search ul li{margin-right: 0; text-align: center; float: inherit;} .login_box .login_box_inner .login_search ul li a{font-size: 14px;} .login_box .login_box_inner .login_search ul li.join a{font-size: 14px; padding: 8px; text-align: center;} .login_box .login_box_inner .login_search ul li.idpw_s a{padding: 8px; font-size:14px;} .login_box .login_box_inner .login_search ul li.idpw_s{margin-right: 0; margin-top: 15px;} .login_box h3.title i{font-size: 20px; width: 40px; height: 40px; line-height: 40px; margin-bottom: 25px;} /* 회원가입 약관 동의 */ .join_wrap{width: auto; padding:0;} .joinBox .join_wrap .title h3{font-size: 24px;} .joinBox .join_wrap .join-con-wrap .all{font-size: 18px; padding: 0 0 10px 25px;} .joinBox .join_wrap .join-con-wrap .all input[type="checkbox"] + label{width: 20px; height: 20px; line-height: 20px; } .joinBox .join_wrap .join-con-wrap .all input[id="all_c"] + label::after{font-size: 13px; width: 20px; height: 20px; line-height: 20px;} .joinBox .join_wrap .join-con-wrap .all input[id="all_c"]:checked + label::after{content:'✔';font-size: 13px;width: 20px;height: 20px;text-align: center;position: absolute;left: 50%;top:50%; transform: translate(-50%, -50%);color: #fff; border:1px solid #003B83; border-radius: 100px; background: #003B83;} .joinBox .join_wrap .join-con-wrap .text_area{padding: 20px 0;} .joinBox .join_wrap .join-con-wrap .text_area > div{margin-bottom: 20px;} .joinBox .join_wrap .join-con-wrap .text_area > div textarea{height: 200px;} .joinBox .join_wrap .join-con-wrap .text_area > div > p{font-size: 13px; padding-left: 20px;} .joinBox .join_wrap .join-con-wrap .text_area > div > div{font-size: 11px;} .joinBox .join_wrap .join-con-wrap .text_area > div input[type="checkbox"] + label{width: 13px; height: 13px; line-height: 13px; } .joinBox .join_wrap .join-con-wrap .text_area > div input[id="inp_02"] + label::after{font-size: 9px; width: 13px; height: 13px; line-height: 13px;} .joinBox .join_wrap .join-con-wrap .text_area > div input[id="inp_02"]:checked + label::after{content:'✔';font-size: 10px;width: 13px;height: 13px;text-align: center;position: absolute;left: 50%;top:50%; transform: translate(-50%, -50%);color: #fff; border:1px solid #003B83; border-radius: 100px; background: #003B83;} .joinBox .join_wrap .join-con-wrap .text_area > div input[id="inp_03"] + label::after{font-size: 9px; width: 13px; height: 13px; line-height: 13px;} .joinBox .join_wrap .join-con-wrap .text_area > div input[id="inp_03"]:checked + label::after{content:'✔';font-size: 10px;width: 13px;height: 13px;text-align: center;position: absolute;left: 50%;top:50%; transform: translate(-50%, -50%);color: #fff; border:1px solid #003B83; border-radius: 100px; background: #003B83;} .buttonWrap{padding: 10px 0;} /* 회원가입 - 인증 버튼 */ .certified{padding: 25px 0;} .certified button.cell-certified{padding: 15px 20px;} .certified button.cell-certified i{font-size: 30px; margin-bottom: 10px;} .certified button.cell-certified p{font-size: 13px;} /* 회원가입 정보 입력 */ .join2_wrap{width: auto; border: none;} .joinBox .join_wrap .title p{font-size: 16px;} .info_in{padding: 20px 0;} .info_in ul li{font-size: 16px;} .info_in ul li p.tit{font-size: 16px;} .info_in ul li > div input[type="radio"]{width: auto;} .info_in ul li > div button{margin-top: 10px;} .info_in ul li > div input.id_inp{width: 100%;} /* 회원가입 - 아이디 or 비번 찾기 */ .idpw_wrap{padding: 0;} .idpw_wrap:after{display: none;} .idpw_wrap .idpw{width: auto;} .idpw_wrap .idpw > div{width: 100%; display: block; } .idpw_wrap .idpw > div h3{font-size: 20px; box-sizing: border-box; padding-right: 20px; margin-bottom: 20px;} .idpw_wrap .idpw > div h3 i{font-size: 13px; width: 30px; height: 30px; line-height: 30px; margin-left: 5px;} .idpw_wrap .idpw > div ul li label{font-size: 13px; width: 100%; display: block; margin-bottom: 10px;} .idpw_wrap .idpw > div .form{width: 95%; padding: 10px; border:1px solid #eee;} .idpw_wrap .idpw > div .form input{width: 100%;} #usr_email1{width:43% !important;} #usr_email2{width:45% !important;} #sel_mail{margin-top:5px;} .idpw_wrap .idpw > div ul li{margin-bottom: 20px;} .idpw_wrap .idpw .id_f .form{padding: 10px;} .idpw_wrap .idpw .id_f{padding-bottom: 20px; margin-bottom: 20px; border-bottom: 1px dotted #aaa;} /* 회원가입 - 아이디 찾기 결과 */ .id_res{padding: 0;} .id_res .res_box{width: 85%; padding: 20px;} .id_res .res_box p{font-size: 13px; line-height: 1.7;} .id_res .res_box p span{font-size: 18px;} .id_res .buttonWrap{padding: 20px 0 0;} .id_res .buttonWrap button.re{margin-right: 10px;} .id_res .buttonWrap button{font-size: 13px;} /* 자주 묻는 질문 */ .accordion ul li > p{font-size: 13px; padding: 15px 5px; line-height: 25px;} .accordion ul li > p:after{font-size: 13px; right: 15px;} .accordion ul li div.answer{padding:15px 30px;} .accordion ul li div.answer p{font-size: 11px; padding: 0; font-weight: 400;} .accordion ul li div.answer img{width: 100% !important;} .accordion ul li > p span{width: 25px; height: 25px; line-height: 25px; margin-right: 5px;} .tab_menu li {font-size:14px; padding: 10px;} /* 게시판 뷰 */ .table_view{box-sizing: border-box; } .table_view .titleBox{padding: 10px 15px; border-top: none; border-radius:15px;} .table_view .titleBox h3.tit{font-size: 16px; margin-bottom: 10px;} .table_view .titleBox ul.info li{font-size: 13px; margin-right: 0; padding-right: 0; border-right: none; width: 100%;} .table_view .titleBox ul.info li span{width: 45px; display: inline-block;} .table_view .fileBox{font-size: 13px; display:block;} .table_view .fileBox p.lab{padding: 10px 15px; font-weight: bold; font-size:14px;} .table_view .fileBox p.inp{ padding: 0px; } .table_view .fileBox p.inp:last-child{margin-bottom: 10px;} .table_view .fileBox p.inp.inp_file{padding: 0px 15px; } .table_view .fileBox p.inp.inp_file a{font-size:13px;} .table_view .view_con{padding: 10px 15px; font-size: 13px;} .table_view .view_con img{width: 100% !important;} .buttonWrap_v{padding: 10px 0px;} .buttonWrap_v button{font-size: 16px; padding: 8px 16px;} .buttonWrap_v button.list{padding: 8px 16px;} .buttonWrap_v button.in{padding: 8px 16px;} .buttonWrap_v button.reply{padding: 8px 16px;} .buttonWrap_v div button.prev_li{margin-right: 0px;} /* 글 입력 */ .table_input .titleBox h3.tit{margin-bottom: 0px;} .table_input .view_con{padding: 0px;} .table_input .titleBox{padding: 10px 0;} .table_input .fileBox{padding: 0; } .table_input .fileBox p.inp{display: block;} .table_input .fileBox p.lab{display: block; padding: 10px 0px 0; margin-bottom: 5px;} .table_view .fileBox p.lab:after{display: none;} /* 1:1 답변 뷰 */ .table_view .titleBox_m{border-top: 2px solid rgba(41,110,178,100%);} .reply_table{margin-bottom: 30px; padding: 0 10px;} .replyTitle{font-size: 16px; margin-top: 30px !important;} .table_list.table_list_board ul li.li_02.reply a{line-height: 1.6;} span.re{font-size: 8px; padding: 1px 5px; margin-right: 0px;} /* 통합검색 */ .allsearchBox{padding: 20px 10px; margin-top:20px;} .allsearchBox h3.resultTxt{font-size: 18px;} .allsearchBox h3.resultTxt .searchWord{font-size: 20px;} .allsearchBox .search_Box{margin-top:20px;} .allsearchBox .search_Box .search{padding:0px;} .allsearchBox .search_Box .search .in input{width:89%;} .allsearchBox .search_Box .p{font-size: 12px; position:static; text-align:center; display:block; transform:translateY(0%); margin-bottom:10px;} .allsearchBox .search_Box{padding: 10px 0;} .allsearchBox .tabBox ul{display:flex;transform: translateX(0); position: inherit; width:100%; flex-wrap: wrap; border-right:1px solid #ddd; border-bottom:1px solid #ddd; padding-bottom:0px;} .allsearchBox .tabBox ul li{font-size: 13px; padding: 10px; overflow: hidden; width: 50%; display: inline-block; border: 1px solid #ddd; border-bottom:0px; border-right:0px; box-shadow: none;} .allsearchBox .tabBox ul li:last-child{border-radius: 0px; margin-bottom: 0px;border-right:0px;} .allsearchBox .tabBox ul li.current:last-child{ border-right: 2px solid rgba(41,110,178,100%);} .allsearchBox .tabBox ul li:first-child{border-radius: 0px;} .allsearchBox .tabBox ul li span.num{margin-left:5px;} .tab_menu_search .contentBox{padding: 20px 0;} .tab_menu_search .tab-content .titBox{padding:0px 10px;} .tab_menu_search .tab-content .titBox h3{font-size: 18px;} .tab_menu_search .tab-content .titBox h3 span{font-size: 16px; margin-left:5px;} .tab_menu_search .tab-content .titBox .more a{font-size: 16px;} .tab_menu_search .tab-content .listView ul.list { margin: -10px -10px 0 -10px;} .tab_menu_search .tab-content .listView ul.list li{ width: 48%; } .tab_menu_search .tab-content .listView ul.list li a{margin:10px 0px 0px 10px; border-radius: 10px; } .tab_menu_search .tab-content .listView ul.list li:nth-child(even){ } .tab_menu_search .tab-content .listView ul.list li p.img{height: auto !important;} .tab_menu_search .tab-content .listView ul.list li a p.img img{ height:100%; border-radius:10px 10px 0px 0px;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .text h3.title{font-size: 14px; margin-bottom: 30px; height: 42px;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox{height:auto; padding:10px;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .info{position:static; width:100%;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .info p span.tit{font-size: 11px; width: 35%;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .info p span.con{font-size: 11px;} .tab_menu_search .tab-content .content{margin-bottom: 50px;} .tab_menu_search .tab-content .listView_no{font-size: 15px; padding:30px 0px;} .tab_menu_search .tab-content .listView ul.list li a .bottomBox .text p.category{font-size: 9px;} .tab_menu_search .tab-content .listView ul.board li a{padding: 10px;} .tab_menu_search .tab-content .listView ul.board li h3.tit{font-size: 15px; margin-bottom: 0px; display: block; width:100%;} .tab_menu_search .tab-content .listView{font-size: 13px; width:100%;} .tab_menu_search .tab-content .listView ul.board li p{font-size: 13px; width:100%; } .tab_menu_search .tab-content .listView ul.board li span.date{float: left; display: block; margin-bottom: 15px; margin-top:5px;} /* 과정 리스트 */ p.allNum{font-size: 15px; margin-bottom: 30px;} .in_con .listView ul.list{overflow: hidden; margin: -40px 0 0 -10px; } .in_con .listView ul.list li{width:50%;} .in_con .listView ul.list li div.box{margin: 20px 0 0 10px;} .in_con .listView ul.list li h3.title{font-size: 12px; height: auto; margin-bottom: 30px;} .in_con .listView ul.list li div.box{height: auto;} .in_con .listView ul.list li p.img{height: auto;} .in_con .listView ul.list li p.img img{height:100%; width:100%;} .in_con .listView ul.list li .text{height:auto; padding:10px;} .in_con .listView ul.list li .bottomBox{position:static; width:100%;} .in_con .listView ul.list li .bottomBox .info p span.tit{font-size:11px; width:35%;} .in_con .listView ul.list li .bottomBox .info p span.con{font-size:11px; width:75%;} /* 과정 상세보기 페이지 */ .topBox{overflow:visible;} .topBox p.img{display: block; float: inherit; width: 90%; height:auto; margin: 0 auto;} .topBox p.img img{width: 100%; } .topBox .infoBox{display: block; float: inherit; width: 100%; margin-top: 20px; border-bottom: 1px dotted var(--color-primary);} .topBox .infoBox h3{padding: 10px; font-size: 15px;} .topBox .infoBox .info{padding:20px 10px; display:block;} .topBox .infoBox .info ul.list{display: block; float: inherit; width: 100%; margin-bottom: 20px; overflow:hidden;} .topBox .infoBox .info ul.list li{font-size: 13px; margin-bottom: 20px; width:100%; display:flex; align-items: center;} .topBox .infoBox .info ul.list li .selectBox .optionBox ul li{display:block;} .topBox .infoBox .info ul.list li p.title{ float:inherit; width:30% !important;} .topBox .infoBox .info ul.list li p.con{width:70% !important; } .topBox .infoBox .info ul.list li .selectBox{ width: 60%; } .topBox .infoBox .info ul.list li p.con br.m{display:none;} .topBox .button{width: 100%; display: block; float:inherit;} .nr_btn2 {margin-top: 0!important;} .listCon{margin: 20px 0 30px;} .listCon .tabBox .tabs li{font-size: 13px; width: 33.3%; text-align: center; border-bottom: none; padding:10px;float:left;} .listCon .tabBox .tabs li.current{border-bottom: 3px solid var(--color-primary);} .listCon .contentBox{padding:20px 10px;} .listCon .contentBox #tab-1 .intro{padding: 15px; flex-direction: column; align-items: stretch;} .listCon .contentBox #tab-1 .intro p.txt{font-size: 13px; width: 100%; float: inherit; margin-top: 10px;} .listCon .contentBox #tab-1 .intro p.icon{ font-size: 13px; width:auto; height:auto; border-radius: 10px; padding: 10px;} .listCon .contentBox #tab-1 .intro p.icon i{font-size: 13px; display: inline-block; margin-right: 5px; margin-bottom: 0px;} .data li{font-size: 14px;} .data li p.title i{margin-right: 0px;} .data li p.title{width: 100%; margin-bottom: 5px;} .data li p.con{box-sizing: border-box; width:100%; padding:0px 15px;} .buttonBox button{font-size: 14px;} .buttonBox button.list{margin-right: 10px;} .tableRow ul{font-size: 14px;} .tableRow ul li{ width:100% !important; line-height:1.7; display: block !important; padding:10px;} .tableRow ul li.con{text-align:center;} .tableRow ul li br{display:none;} .tableRow ul li.percent p{margin-bottom: 10px; margin-right: 0px; width: 49%;} .tableRow ul li.three p{margin-bottom:10px;} .tableRow ul li.percent p.non{margin-bottom: 0px;} .con_table li{padding: 0 10px 10px; font-size: 13px;} .con_table li span.num{display: block; width: 100%; margin-bottom: 10px;} .con_table li span.name {display: block; width: 100%;} .listCon .contentBox #tab-1 .intro div.icon{margin:0px auto 20px; } .listCon .contentBox #tab-1 .intro div.txt{width:100%; overflow-x:auto;} .nowBox h3.now_tit{font-size:16px;} .view_list{font-size: 13px; overflow: hidden; display:none;} .m_pay_way{display:block !important;} .m_pay_way ul li.head{width:;} .m_pay_way{display:block ;} .m_pay_way ul{display: block;} .m_pay_way ul li.head{width:100%; padding:10px;} .m_pay_way ul li{display:block; width:100%; padding:20px; } .m_pay_way ul li.left{text-align: center;} .m_pay_way ul li.head{ border-bottom: 1px solid #296EB2; } .m_pay_way ul li.pay_name{border-top: 1px solid #296EB2;} .m_pay_way ul li .point{display:block; margin-top:5px;} .agreeBox{margin-top:30px; } .agreeBox label{font-size:14px;} .usr_search > div .table_row {margin-bottom:0;} .buttonBox{margin:20px 0 40px 0px;} .all_price{padding:15px; } .all_price p{font-size: 18px;} .all_price p span{font-size:20px;} .listCon .contentBox #tab-1 .selectBox{font-size:13px; margin-bottom: 15px; padding-bottom: 15px;} .listCon .contentBox #tab-1 .selectBox p.tit{font-size:13px; margin-bottom:20px;} .listCon .contentBox #tab-1 .selectBox p.tit span.num{font-size: 13px; width: 20px; height: 20px; line-height: 20px; display:block; float:inherit; margin-bottom:10px;} .listCon .contentBox #tab-1 .selectBox p.tit span.q{ display:block; float:inherit; width:100%;} .view_list ul{} .view_list ul.head{} .view_list ul li{} .listCon .contentBox #tab-1 .selectBox .select{padding:0px; } .listCon .contentBox #tab-1 .selectBox .select li label{font-size:13px;} .now_tablewRow{display:block;} .now_tablewRow ul{display: block;} .now_tablewRow ul li.head{width:100%; padding:10px;} .now_tablewRow ul li{display:block; width:100%; padding:20px; text-align:center !important;} /* 나의 강의실 */ .conlist .pasing{padding: 15px 0; border:0px;} .conlist .contentBox{border:1px solid #ddd;} .m_contentBox{border:0px !important; display:block;} .conlist h3{font-size:16px;} .conlist h3 .num{font-size:18px;} .conlistH3{font-size:16px;} .conlistH3 .num{font-size:18px;} .mypage_table{display:none; } .mypage_tableRow{ display:block; border:0px; margin-bottom:20px;border:1px solid #ddd;} .mypage_tableRow .myClass_ul{ background:#fff; box-sizing: border-box; padding: 10px 15px; display:block;} .mypage_tableRow .myClass_ul ul{display:block; margin-bottom:10px; overflow:visible;} .mypage_tableRow .myClass_ul ul:last-child{margin-bottom:0px;} .mypage_tableRow ul li{display:inline-block !important; padding:0px !important;} .mypage_tableRow ul li.head{background:none; width:22% !important; font-weight: bold;} .mypage_tableRow ul li.con{width: 76% !important; padding:0px; text-align:left !important;} .mypage_tableRow ul li{padding:5px 0; border-bottom: 0px; border-right: 0px; vertical-align: middle;text-align:left !important; } .mypage_tableRow div.myClass{overflow: hidden; background:#f4f5f7; box-sizing: border-box; padding:15px; display:flex;justify-content: space-between; align-items: center;} .mypage_tableRow div.myClass > div{overflow:hidden; width:80%;} .mypage_tableRow div.myClass .dday{background:#296EB2; color:#fff; font-size:11px; box-sizing:border-box; padding:0px 7px; display:inline-block; line-height:18px;} .mypage_tableRow div.myClass .lect_name{ font-weight:600; margin:5px 0px; font-size:15px; line-height:1.7;} .mypage_tableRow div.myClass .cateBox{overflow:hidden;} .mypage_tableRow div.myClass .cateBox span{box-sizing:border-box; padding:0px 10px; text-align:center; display:inline-block; border-radius:100px; background:#f7f7f7; border:1px solid #ddd; font-weight:600; font-size:12px; color:#555; } .mypage_tableRow div.myClass .my_class_in{background:#ddd; border-radius:100%; width:40px; height:40px; color:#555;} .mypage_tableRow div.myClass .my_class_in:hover{background: #296EB2; color:#fff } .mypage_tableRow div.myClass .my_class_in i{font-size:18px;} .mypage_tableRow div.myClass_ul .p_num{display:inline-block; margin-right:5px; } .mypage_tableRow div.myClass_ul .p_num span{font-size:16px; font-weight:bold; color:#003B83 ;} .mypage_tableRow div.myClass_ul .progress{width:50%; height:10px; background:#eee; border-radius:100px; margin-top:10px; display:inline-block;position:relative; } .mypage_tableRow div.myClass_ul .progress-bar{background: #1d1d1d; height:100%; border-radius:100px; position:relative;} .mypage_tableRow div.myClass_ul .progress-bar span.score{position: absolute; content: '';right: -10px; top: -20px; color: #fff; font-weight: 500;box-sizing: border-box; padding:0px 5px; background: #296EB2;font-size: 9px; width: auto;} .mypage_tableRow div.myClass_ul .progress-bar span.score:after{ border-top: 10px solid #296EB2; border-left: 5px solid transparent; border-right: 5px solid transparent; border-bottom: 0px solid transparent; content: ""; position: absolute;bottom: -5px;left: 50%;transform: translateX(-50%);} .mypage_tableRow div.myClass_ul .un_completion{color:#4D377B; font-weight:600; display:block;} .mypage_tableRow div.myClass_ul .studying{color:#42ac53; font-weight:600; display:block;} .mypage_tableRow div.myClass_ul .completion{color:#42a3b8; font-weight:600; display:block;} .mypage_tableRow div.myClass_ul .wait{color:#999; font-weight:600; display:block;} .mypage_tableRow div.myClass_ul .delete{color:#C53636; font-weight:600; display:block;} .mypage_tableRow div.myClass_ul .score_more{ font-weight: ; margin:5px auto 0px; background:rgba(176,93,142,50%); color:#fff; box-sizing:border-box; padding:3px 7px; text-align:center; font-size:12px; float:right;} .mypage_tableRow div.myClass_ul .score_more:hover{background:#B05D8E;} .mypage_tableRow div.myClass_ul .score_more.on{background:#B05D8E;} .score_more_box{padding:10px; border:1px solid #ddd; margin-top:10px; display:; margin-bottom:10px;} .score_more_box .table_score{ background:none; border:1px solid #ddd; border-bottom:0px;display:flex;flex-wrap: wrap;} .score_more_box .table_score li{padding:10px !important;} .score_more_box .table_score li.con{width:33.33% !important;text-align:center !important;} .score_more_box .table_score li.head{width:33.33% !important;} .score_more_box .table_score li.head{ text-align:center !important; background: #f1f1f1; height:100%; } .score_more_box .table_score ul{display: inline-flex; align-items: center; margin-bottom:0px; border-bottom:1px solid #ddd;} .score_more_box .table_score ul li .score1{font-size:11px;} .score_more_box .table_score ul li .chk_ing{ background: #f9f9f9; box-sizing:border-box; padding:5px 10px; border: 1px solid #ddd;color: #777;} .mypage_tableRow h3.myClass{margin-bottom: 0px; padding: 15px 10px; } .mypage_tableRow h3.myClass a{color:#296EB2; width:100%; height:100%; display:block; font-size:16px; line-height:1.6;} .mypage_tableRow ul li.studying{color:#42ac53;} .mypage_tableRow ul li.completion{color:#56547c;} .mypage_tableRow ul li.unpaid{color:#C53636;} .mypage_tableRow ul li.wait{color:#000;} .mypage_tableRow ul li.bold{color:#b84c97;} .prolist h3{font-size: 16px;} .prolist .pasing{padding: 15px 0;} .contentBox ul.none{width:100%; overflow:hidden; box-sizing:border-box; padding:20px 0; display: inherit; background:#f5f5f5;} .contentBox ul.none li{text-align:center; font-size: 13px;} .prolist .processBox{border:1px solid #ddd; border-top:0px;} .processBox ul.none{width:100%; overflow:hidden; box-sizing:border-box; padding:20px 0; display: inherit; background:#f5f5f5; border-top: 1px solid #ddd;} .processBox ul.none li{text-align:center; font-size: 13px;} /* 나의 강의실 - 상세보기 */ .my_topBox > div{padding:10px;} .my_topBox .class_name{padding: 10px !important; margin-bottom:00px;} .my_topBox .my_infoBox{margin-top:10px;} .my_topBox .infoBox .my_info{padding:10px;} .my_topBox .infoBox .my_info ul.list p.con > span{ } .my_topBox .infoBox .my_info ul.list p.title{ } .my_progress > div{display:block;} .my_progress > div p.tit{margin-right:0px; margin-bottom: 5px;} .my_progress > div .progressBox{text-align:center;} .my_progress > div .progress{width: 40%; margin-right:0px; margin:0px 10px;} .my_progress > div .score{font-size:16px; font-weight:bold;} .my_progress > div .st_box{ display:block; text-align:center; margin-top:10px; box-sizing:border-box; padding-top:10px; border-top:1px dotted #aaa;} .my_progress > div .st_box button{} .my_topBox .score_view{overflow:visible; bottom:-200%;} .my_topBox .score_view button.closeBtn{display:inline-block; position:absolute; margin-bottom: 10px; right: 10px; top:-25px; font-weight:bold; background:#888; color:#fff;font-size: 12px; border-radius:100%; width:20px; height:20px; line-height:20px;} .topBox .my_lec_img{width:90% !important; margin: 0 auto; height:auto;} .topBox .my_infoBox{width: 100% !important;} .topBox .infoBox .my_info ul.list p.title{ } .topBox .infoBox .my_info ul.list p.con{ } .topBox .infoBox .my_info ul.list li div.con{margin-top: 20px; box-sizing: border-box; padding: 0px 10px; width: 100%;} .topBox .infoBox .my_info ul.list li div.con ul.completion{display: block; margin-top: -10px;} .topBox .infoBox .my_info ul.list li div.con ul.completion li{ width: 49%; margin-top: 10px;} .topBox .infoBox .my_info ul.list li div.con ul.completion li:last-child{ } .topBox .infoBox .my_info ul.list li div.con ul.completion li span{display:inline-block; width:60%; float:right;} .topBox .infoBox .my_info ul.list li div.con ul.file li{font-size: 13px;} .topBox .infoBox .my_info ul.list li div.con ul.file li span.tit{width:30%; } .topBox .infoBox .my_info ul.list li div.con ul.file li span.fileName {width: 68%; } .my_progress > div .score .percent{font-size: 16px;} .my_topBox .infoBox .my_info ul.list p.con a.file{} .bottomBox .inner .progress_ul li .show{height: 100px;} .bottomBox .inner .progress_ul li .show .show_inner{padding:0px;} .bottomBox .inner .progress_ul li .show .show_inner p.score_chk{ } .bottomBox .inner .progress_ul li p.tit span{font-size: 11px; display:block;} .bottomBox .inner .progress_ul li .show .show_inner span.score1{font-size: 16px;} .bottomBox .inner .progress_ul{display: block; padding:30px 5px;} .bottomBox .inner .progress_ul li{width:48%; overflow:hidden;} .bottomBox .inner .progress_ul li.all{width: 49%;} .bottomBox .inner .progress_ul li.stateBox{width:100%; margin-top: 20px;} .bottomBox .inner .progress_ul li.stateBox .state{ } .bottomBox .inner .progress_ul li .show .show_inner span.score{font-size: 18px;} .bottomBox .inner .progress_ul li .show .show_inner span.survey_score{font-size: 14px; padding:5px 10px;} .bottomBox .inner .progress_ul li p.tit{font-size: 15px; text-align:center;} .bottomBox .inner .progress_ul li.all .show{ } .bottomBox .inner .progress_ul li.all .show .show_inner span.n_b{font-size:13px;} .topBox .infoBox .my_info ul.list{margin-bottom: 0px;} .bottomBox2 .title{font-size:16px;} .bottomBox2 .title span.m{font-size: 11px; color:#aaa; margin-left: 5px; display:inline-block;} .bottomBox2{ padding:5px; } .mypage_view_table{ } .mypage_view_table ul li{word-break:break-all;} .mypage_view_table ul li.li_01{display: table-cell !important; width:4% !important;} .mypage_view_table ul li.li_02{display: table-cell !important; width:15% !important;} .mypage_view_table ul li.li_04{display: table-cell !important; width:6% !important;} .mypage_view_table ul li.li_05{display: table-cell !important; width:5% !important;} .mypage_view_table ul li br{display:inline-block;} .mypage_view_table ul li.li_06{display: table-cell !important; width:5% !important;} .bottomBox2 .mypage_view_table ul li{font-size: 11px;} .mypage_view_table ul li.li_07{display:none;} .mypage_view_table ul li .class_play{display: inline-block; color: #3A81C7; font-size:12px; } .mypage_view_table ul li .class_play i{ } .topBox .class_name span.nameTit{width: 100%;} .topBox .class_name{font-size: 16px; line-height: 1.5; padding:15px;} .topBox .class_name span.name{width: 100%; word-break: break-word; float: inherit; margin-top: 10px; box-sizing: border-box; padding: 0px 10px;} .topBox .infoBox .d-day{font-size: 16px;} .bottomBox2 .mypage_view_table ul li.li_07 button.study_btn{font-size: 13px; padding:3px 10px;} .bottomBox2::-webkit-scrollbar { width:100%; /* 스크롤바의 너비 */ height:8px; } .bottomBox2::-webkit-scrollbar-thumb { width: 1%; /* 스크롤바의 길이 */ background: #9B9B9B; /* 스크롤바의 색상 */ border-radius: 10px; } .bottomBox2::-webkit-scrollbar-track { background: #ddd; /*스크롤바 뒷 배경 색상*/ } /* 시험지, 과제지 모바일 */ .quizBox{margin-top: 20px;} .view_wrap .inner > .head{padding: 8px 10px;} .view_wrap .inner > .head h3{font-size: 16px;} .view_wrap{font-size:10px;} .view_wrap .inner .view_content{padding:10px;} .view_wrap .inner .view_content .tableRow_view ul li{font-size: 14px;} .view_wrap .inner .view_content .tableRow_view ul li br{display:none;} .quizBox .quiz{margin-bottom: 30px;} .quizBox .quiz .top {align-items:start;} .quizBox .quiz .top span.num{flex:20px 1 0; font-size: 14px; width:20px; height:20px; line-height:20px; border-radius: 8px;} .quizBox .quiz .top h3{font-size: 16px; line-height:1.3 !important; } .quizBox .quiz .top p.score{font-size:14px; width:40px; margin-top:10px;} .quizBox .quiz .check{padding:10px 33px !important;} .quizBox .quiz .check ul li.wrong:after{left:-23px;} .quizBox .quiz .info p span{border-radius: 8px;} .quizBox .quiz .check ul li.answer:after{left:-23px;} .quizBox .quiz .write{padding:10px;} .quizBox .quiz .info span.feedback{width:83%;} .view_content .view_button_wrap button.close{color:#1d1d1d;} .view_wrap .inner .view_content .tableRow_view{border-bottom: 0px;} .view_wrap .inner .view_content .tableRow_view ul{display:flex; flex-wrap: wrap; margin:10px 0 0 0; border-bottom: 0px;} .view_wrap .inner .view_content .tableRow_view ul li{width:70%; border-right:0px;} .view_wrap .inner .view_content .tableRow_view ul li.head{width:20% !important; border-right: 1px solid #888;} .view_wrap .inner .view_content .tableRow_view ul li.con{width:80% !important;} .quizBox .quiz .check ul li span.content{margin-top:3px;} div.table_now_new ul.name li.con{border-bottom:0px !important; padding:0px 5px !important; margin:0px !important; width:100% !important;} .quizBox .quiz .check p.tit{font-size: 12px;} .quizBox .quiz .check .answerBox input{width:100%; padding:0px;} .quizBox .quiz .top p.explan{width:100%; margin-top: 10px;} /* 학습창 모바일 */ body.learning.mobile_class{ background: rgba(0,0,0,37%);} .mobile_class .learning_wrap{ background:none; display:block;} .mobile_class .learning_wrap .inner{ box-sizing: border-box; padding:20px; display:block; overflow: auto;} .mobile_class .learning_wrap .inner .boardBox{display:none;} .mobile_class .learning_wrap .inner .videoBox{width:100%;max-width:none !important; max-height: none !important; display:block; height:100%;} .mobile_class .learning_wrap .inner .videoBox iframe{ position:static; transform:translate(0,0);} .mobile_class .learning_wrap .inner .videoBox iframe video{ } .mobile_class .learning_wrap .inner .videoBox iframe #container{ } .mobile_class .nameBox_m{width:100%; display:block; background:#fff; box-sizing:border-box; padding: 10px; border-bottom:1px solid #ddd;} .mobile_class .nameBox_m .class_name{font-size: 18px; font-weight: bold; overflow: hidden; word-break: break-word;line-height:1.5; margin-bottom:15px;} .mobile_class .nameBox_m .class_name i{margin-right: 5px;} .mobile_class .nameBox_m p.sub_name{font-size: 14px; color:#555555; overflow: hidden; word-break: break-word; line-height:1.5; } .mobile_class .nameBox_m p.sub_name span{display: inline-block; box-sizing: border-box; padding: 3px 20px; color:#fff; background:#555; font-weight:400; margin-right: 5px;} .mobile_class .buttonBox_m{width:100%; overflow:hidden; display: block; text-align:center; margin: 20px 0 0;} .mobile_class .buttonBox_m button{box-sizing:border-box; font-size: 20px; box-sizing: border-box; padding: 8px 25px; } .mobile_class .buttonBox_m button.endBtn{ background:#3A81C7; color:#fff; border:1px solid #3A81C7; } .mobile_class .buttonBox_m p.txt{font-size: 14px; color:; line-height:1.5; margin-bottom:20px; color:#003B83; font-weight:bold;} .learning_wrap .inner .videoBox .study_endBox{display:none;} /* 관심교육 */ .mypage_inter{} .myClass_ul button.deleteBtn{ font-weight:bold; border:1px solid #aaa; color:#555; border-radius: 100px; box-sizing: border-box; padding:5px 10px; display: block; margin: 5px auto; font-size: 11px;} .myClass_ul button.deleteBtn:hover{background:#1d1d1d; color:#fff; border:1px solid #1d1d1d;} .in_con .conlist .i_m_contentBox{display: block;} .in_con .prolist .i_m_processBox{display: block;} .mypage_inter ul li{width:auto; padding: 5px !important; } .mypage_inter ul .li_02{width:15%;} .mypage_inter ul .li_03{width:18%;} .mypage_inter ul .li_04{width:15%;} .mypage_inter ul li button.deleteBtn{font-size: 11px; border-radius:10px; padding:5px;} .mypage_inter ul .lect_name p.lect_name{width:100%;display:block;text-align:center; margin-left:0px; float:inherit;} .mypage_inter ul .lect_name img.like_thum{width:50%; display:inline-block; margin:0 auto; margin-bottom:10px; float:inherit;} .mypage_inter ul .lect_name{display:inline-block;} .mypage_inter ul.head li{padding:10px !important;} /* 문의 내역 */ .mypage_qna ul li.li_01{display:none;} .mypage_qna ul li.li_02{width:18%;} .mypage_qna ul li.li_03{width:6%;} .mypage_qna ul li.li_04{width:11%;} .mypage_qna_class ul li.li_01{display:none;} .mypage_qna_class ul li.li_02{width: 15%;} .mypage_qna_class ul li.li_03{width: 10% !important;} .mypage_qna_class ul li.li_04{width: 10% !important;} .mypage_qna ul li.li_02.reply span.re{font-size:10px;padding: 1px 5px; margin-right: 0px;} .mypage_qna ul li.li_02.reply a{line-height:1.6;} .classInfo{font-size:13px; margin-top: 25px; display:block; box-sizing:border-box; padding:0px 10px;} .classInfo .replyTitle{margin-top:0px !important; padding :0;} .classInfo .info{width:100%; display:block; padding:0px; border-left:0px; margin-top:5px;} .classInfo .info p.className {line-height:1.5;} .classInfo .info p.className span{} .tab-link-2 a{padding:10px;} /* 설문 */ .in_con .in_con_inner .surveyList{} .in_con .in_con_inner .surveyList .survey{width:100%; } .in_con .in_con_inner .surveyList .survey .topBox h3{font-size: 16px; margin-top: 1px;} .in_con .in_con_inner .surveyList .survey .topBox{padding:10px; vertical-align: middle;} .in_con .in_con_inner .surveyList .survey .bottomBox .left ul li{font-size: 13px;} .search_Box2 .search .in input{width:100%;} .search_Box2 .search select{ margin: 10px 5px; width: 95%;} .search_Box2 .search .date{margin:0; width:100%;} .search_Box2 .search .date input{width:46%;} .search_Box2 .search button{ text-align: center; margin: 0 auto; width: 100%;} .no_sur{font-size:14px !important;} .main_con .in_con{margin-top:0px !important;} /**/ .tab_menu{margin-top: 25px;} /* 찾아오시는 길 */ #map{height:200px !important;} .in_con .in_con_inner .locationBox .address{margin-top:20px; padding-bottom:20px; justify-content: space-between;flex-wrap: wrap;text-align:center; } .in_con .in_con_inner .locationBox .address p.icon{width:35px; height:35px; line-height:35px; font-size:20px;margin:0 auto 10px; } .in_con .in_con_inner .locationBox .address p.text{font-size:15px; width:100%;} .in_con .in_con_inner .locationBox .transport{margin:0px; display:block;} .in_con .in_con_inner .locationBox .transport div{width:100%; } .in_con .in_con_inner .locationBox .transport div p.icon{width:30px; height:30px; line-height:30px; font-size:16px; } .in_con .in_con_inner .locationBox p.text{font-size: 13px; width:85%;} .in_con .in_con_inner .locationBox .transport div.bus p.text br{display:none;} .in_con .in_con_inner .locationBox .transport div.subway{box-sizing:border-box; padding:20px 0px; margin-bottom:20px;border-bottom:1px dotted #aaa;} .learning_wrap .inner .study_endBox{display:none;} .main_con .content img{ width:auto !important; max-width:100% !important;} }