/*서브 wrap*/
* {
    box-sizing: border-box;
  }
  .term-con textarea {
    background: #f8f8f8;
    border: 1px solid #e5e5e5;
    box-sizing: border-box;
    padding: 15px 20px;
    height: 300px;
    margin: 20px 0;
  }
  .join-process {
    display: table;
    width: 100%;
    border: 1px solid #d4d4d4;
    box-sizing: border-box;
  }
  .join-process li {
    display: table-cell;
    width: 33.3%;
    padding: 20px 20px;
    text-align: center;
    font-size: 15px;
    background: #f7f7f7;
    color: #ccc;
    letter-spacing: -1px;
  }
  .join-process li:nth-child(2) {
    border-left: 1px solid #d4d4d4;
    border-right: 1px solid #d4d4d4;
  }
  .join-process li.active {
    background: #fff;
    color: #2b83e4;
  }
  .join-process li.active > span {
    color: #222;
  }
  .join-process li i {
    padding-right: 10px;
  }
  .join-process li > span {
    padding-right: 20px;
    color: #ccc;
  }

  .all_checkbox {    
    width: 18px;
    height: 18px;
    margin-bottom: 4px;
    margin-right: 5px;
  }

  .join-con-wrap {
    padding: 50px 0;
  }
  .join-con-wrap h3 {
    display: inline-block;
    position: relative;
    margin-top: 10px;
    padding-left: 10px;
    letter-spacing: -1px;
    font-size: 16px;
    font-weight: normal;
    text-shadow: 0.5px 0;
  }
  .join-con-wrap h3:before {
    position: absolute;
    top: 5px;
    left: 0;
    display: block;
    width: 5px;
    height: 15px;
    background: #2b83e4;
    content: "";
  }

  .join-con-wrap h3.tith3_2:before {
    position: absolute;
    top: 5px;
    left: 0;
    display: block;
    width: 5px;
    height: 18px;
    background: #2b83e4;
    content: "";
  }

  .join-con-wrap > div {
    padding: 10px 0;
    margin: 5px 0 20px 0;
    border-bottom: 1px solid #d8d8d8;
    overflow: hidden;
  }
  .join-con-wrap .term-btn {
    display: inline-block;
    float: right;
  }
  .join-con-wrap .term-btn > span {
    float: left;
    display: inline-block;
    padding-top: 10px;
    padding-right: 10px;
  }
  .join-con-wrap .term-btn > span > span {
    color: #b61a1a;
  }
  .join-con-wrap .term-btn a {
    float: right;
    margin: 5px;
    padding: 7px 15px;
    background: #555;
    color: #fff;
  }
  .join-con-wrap .term-btn a:hover {
    background: #3b3b3b;
  }
  .join-con-wrap .term-btn a a {
    color: #fff;
  }
  .join-con-wrap .join-finish {
    border-bottom: none;
    text-align: center;
  }
  .join-con-wrap .join-finish i {
    font-size: 70px;
    color: #2b83e4;
  }
  .join-con-wrap .join-finish p {
    font-size: 20px;
    padding-top: 10px;
    color: #2b83e4;
  }
  .join-con-wrap .join-finish span {
    display: inline-block;
    padding-top: 10px;
    color: #777;
    letter-spacing: -1px;
  }
  .join-btn-wrap {
    display: block;
    padding-top: 60px;
    margin: 0 auto;
    text-align: center;
  }
  .join-btn-wrap li {
    display: inline-block;
    padding-right: 10px;
  }
  .join-btn-wrap li a {
    background: #454d63;
    color: #fff;
    padding: 12px 60px;
    font-size: 15px;
  }
  .join-btn-wrap li a:hover {
    background: #303645;
  }
  .join-btn-wrap li a:hover a {
    color: #fff;
  }
  .join-btn-wrap li.next a {
    background: #454d63;
    color: #fff;
  }
  .join-btn-wrap li.next a:hover {
    background: #303645;
  }
  .join-btn-wrap li.next a.join {
    background: #2b83e4;
  }
  .join-btn-wrap li.next a.join:hover {
    background: #196ac3;
  }
  .join-btn-wrap2 {
    display: block;
    margin: 0 auto;
    text-align: center;
  }
  .join-btn-wrap2 li {
    display: inline-block;
    padding-right: 10px;
  }
  .join-btn-wrap2 li a {
    background: #e5e5e5;
    color: #999;
    padding: 12px 60px;
    font-size: 15px;
  }
  .join-btn-wrap2 li a:hover {
    color: #777;
    background: #e1e1e1;
  }
  .join-btn-wrap2 li.next a {
    background: #2b83e4;
    color: #fff;
  }
  .join-btn-wrap2 li.next a:hover {
    background: #196ac3;
  }
  .tbl-caption {
    float: right;
    padding-bottom: 10px;
  }
  .reddot {
    display: inline-block;
    padding: 2px 5px;
    color: red;
  }
  .dash {
    display: inline-block;
    padding: 0 5px;
  }
  .join-tbl {
    width: 100%;
    border-top: 2px solid #888;
    border-bottom: 1px solid #ddd;
    text-align: left;
  }
  .join-tbl tbody tr {
    border-bottom: 1px solid #e5e5e5;
  }
  .join-tbl tbody tr:last-child {
    border-bottom: 1px solid #ccc;
  }
  .join-tbl tbody th {
    padding: 10px;
    background: #f1f1f1;
    text-align: left;
    padding-left: 20px;
    font-weight: normal;
    letter-spacing: -1px;
    font-size: 14px;
  }
  .join-tbl tbody td {
    padding: 15px;
  }
  .join-tbl tbody button {
    padding: 3px 10px;
    margin: 0 10px 0 3px;
    cursor: pointer;
    height: 30px;
    box-sizing: border-box;
    background: #555;
    color: #fff;
    font-size: 12px;
    font-weight: 300;
  }
  .join-tbl tbody button:hover {
    background: #222;
    color: #fff;
  }
  .join-tbl tbody td.center {
    text-align: center;
  }
  .join-tbl td.sns input {
    vertical-align: top;
    margin-top: 5px;
  }
  .join-tbl td.sns span.tit {
    padding-left: 5px;
  }
  .join-tbl .join-ex {
    display: inline-block;
    padding: 0 10px;
  }
  .class-menu {
    width: 100%;
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
  .class-menu > li {
    width: calc(14.2% - -2px);
    height: 41px;
    border: 1px solid #ccc;
    margin: -1px -1px 0 0;
    box-sizing: border-box;
  }
  .class-menu {
    border-top: 1px solid #ccc;
  }
  .class-menu > li > a {
    display: block;
    width: 100%;
    height: 100%;
    text-align: center;
    background: #fff;
    color: #000;
    padding: 10px 0;
    letter-spacing: -0.8px;
    box-sizing: border-box;
    font-size: 14px;
  }
  .class-menu > li.active {
    border-bottom: none;
  }
  .class-menu > li.active a {
    background: #fff;
    color: #1f8cde;
    border-top: 2px solid #1f8cde;
    box-sizing: border-box;
    text-shadow: 0.5px 0;
    border-bottom: 1px solid #ccc;
  }
  .class-list > ul > li {
    padding: 15px;
    background: #fff;
    margin-top: 20px;
    border: 1px solid #e5e5e5;
    box-sizing: border-box;
    display: table;
    width: 100%;
    background: #f9f9f9;
  }
  .class-list > ul > li > div {
    display: table-cell;
    vertical-align: top;
  }
  .class-list > ul > li > div:last-child {
    padding-left: 15px;
  }
  .class-list > ul > li .class-/img/sub {
    width: 171px;
    padding-right: 20px;
  }
  .class-list > ul > li .class-/img/sub /img/sub {
    border: 1px solid #ccc;
    padding: 5px;
    display: block;
    text-align: center;
    margin: 0 auto;
    background: #fff;
  }
  .class-list > ul > li .class-con {
    position: relative;
    overflow: hidden;
  }
  .class-list > ul > li .class-con h4 {
    font-size: 18px;
    color: #555;
    font-weight: normal;
    text-shadow: 0.5px 0;
  }
  .class-list > ul > li .class-con .class-detail {
    display: inline-block;
    float: left;
    font-size: 13px;
  }
  .class-list > ul > li .class-con .class-detail > div dl dt {
    width: 100px;
    display: inline-block;
    color: red;
    color: #6d88d6;
  }
  .class-list > ul > li .class-con .class-detail > div dl dd {
    display: inline-block;
    color: #777;
  }
  .class-list > ul > li .class-con .class-detail h4 {
    padding-left: 0;
  }
  .class-list > ul > li .class-con .class-detail h4 a {
    color: #000;
  }
  .class-list > ul > li .class-con .class-detail h4:before {
    display: none;
  }
  .class-list > ul > li .class-con .class-detail h4:hover a {
    color: #339ae6;
  }
  .class-list > ul > li .class-con .class-detail h4 .class-badge-green {
    display: inline-block;
    font-size: 13px;
    border: 1px solid #48d08c;
    padding: 0 3px;
    margin-left: 5px;
    color: #23af69;
    text-shadow: none;
    border-radius: 3px;
    text-align: center;
  }
  .class-list > ul > li .class-con .class-detail .class-teacher li {
    position: relative;
    display: inline-block;
    padding-left: 4px;
    padding-right: 10px;
  }
  .class-list > ul > li .class-con .class-detail .class-teacher li:before {
    position: absolute;
    top: 2px;
    right: 0;
    content: "/";
    color: #cacaca;
    font-size: 10px;
  }
  .class-list > ul > li .class-con .class-detail .class-teacher li:first-child {
    padding-left: 0;
  }
  .class-list > ul > li .class-con .class-detail .class-teacher li:last-child {
    padding-right: 0;
  }
  .class-list
    > ul
    > li
    .class-con
    .class-detail
    .class-teacher
    li:last-child:before {
    display: none;
  }
  .class-list > ul > li .class-con .class-detail .class-teacher .red {
    color: red;
  }
  .class-list > ul > li .class-con .class-detail .class-teacher .red-btn {
    display: inline-block;
    margin-left: 3px;
    background: red;
    color: #fff;
    border-radius: 3px;
    padding: 2px 5px;
    font-size: 12px;
  }
  .class-list > ul > li .class-con .class-detail .star-state,
  .class-list > ul > li .class-con .class-detail .star-state span {
    display: block;
    width: 60px;
    height: 12px;
    overflow: hidden;
    text-align: left;
    background: url(..//img/sub/sub/icon_star.png) no-repeat;
    vertical-align: middle;
  }
  .class-list > ul > li .class-con .class-detail .star-state span {
    display: inline-block;
    background-position: 0 -12px;
    vertical-align: top;
  }
  .class-list > ul > li .class-con .class-detail .class-info {
    padding-top: 12px;
    color: #7b7b7b;
    padding-top: 10px;
    font-size: 12px;
    line-height: 16px;
    height: 78px;
    overflow: hidden;
  }
  .class-list > ul > li .class-view {
    float: right;
    width: 200px;
  }
  .class-list > ul > li .class-view ul {
    padding-top: 16px;
  }
  .class-list > ul > li .class-view ul li {
    margin-top: 5px;
    background: #fff;
    border: 1px solid #dcdcdc;
    padding: 7px;
    text-align: center;
    border-radius: 4px;
    margin: 5px 20px;
  }
  .class-list > ul > li .class-view ul li /img/sub {
    display: inline-block;
    padding-right: 8px;
  }
  .class-list > ul > li .class-view ul li a {
    display: block;
    width: 100%;
    height: 100%;
    text-shadow: 0.5px 0;
  }
  .class-list > ul > li .class-view ul li:first-child {
    margin-top: 5px;
  }
  .class-list > ul > li .class-view ul li:first-child a {
    color: #3f97d8;
  }
  .class-list > ul > li .class-view ul li:first-child:hover {
    border: 1px solid #3f97d8;
  }
  .class-list > ul > li .class-view ul li:last-child {
    margin-top: 5px;
  }
  .class-list > ul > li .class-view ul li.red_border {
    border: 1px solid #f73f3f;
  }
  .class-list > ul > li .class-view ul li.red_border a {
    color: #f73f3f !important;
  }
  .class-list > ul > li .class-view ul li.red_border:hover {
    border: 1px solid #f73faa !important;
  }
  .class-list > ul > li .class-view ul li:last-child a {
    color: #5c6684;
  }
  .class-list > ul > li .class-view ul li:last-child:hover {
    border: 1px solid #3f97d8;
  }
  .class-search-wrap {
    overflow: hidden;
    margin-top: 20px;
  }
  .class-search-wrap input {
    height: 30px;
    box-sizing: border-box;
    border: 1px solid #cacaca;
    padding-left: 10px;
  }
  .class-search-wrap > ul {
    float: left;
    margin-top: 10px;
  }
  .class-search-wrap > ul li {
    display: inline-block;
    padding-left: 10px;
    background: url(..//img/sub/common/fm-bar.jpg) 4px 4px no-repeat;
  }
  .class-search-wrap > ul li:first-child {
    padding-left: 0;
    background: none;
  }
  .class-search-wrap > ul li a {
    color: #888;
  }
  .class-search-wrap > ul li.active a {
    color: #000;
    text-shadow: 0.5px 0;
  }
  .class-search-wrap > div {
    float: right;
  }
  .class-search-wrap > div button {
    padding: 4px 10px;
    margin: 0 0 0 3px;
    cursor: pointer;
    border: 1px solid #e5e5e5;
    box-sizing: border-box;
    background: #f5f5f5;
  }
  .class-search-wrap > div button.search {
    background: #555;
    color: #fff;
    border: 1px solid #555;
    box-sizing: border-box;
  }
  .class-search-wrap > div button.search:hover {
    background: #3b3b3b;
    color: #fff;
  }
  .class-search-wrap > div button:hover {
    background: #f5f5f5;
    color: #777;
  }
  .paging {
    padding: 30px 0;
  }
  .paging div {
    text-align: center;
  }
  .paging div > span {
    display: inline-block;
    padding: 0 20px;
  }
  .paging div > span.prev {
    font-size: 12px;
    color: #999;
  }
  .paging div > span.prev:hover a {
    color: #2199e5;
  }
  .paging div > span.prev:hover i {
    color: #2199e5;
  }
  .paging div > span.next {
    font-size: 12px;
    color: #999;
  }
  .paging div > span.next:hover a {
    color: #2199e5;
  }
  .paging div > span.next:hover i {
    color: #2199e5;
  }
  .paging div > span i {
    color: #b1b1b1;
    padding: 2px 5px;
  }
  .paging div > ul {
    display: inline-block;
  }
  .paging div > ul li {
    display: inline-block;
    margin: 0 3px;
    padding: 3px 7px;
    cursor: pointer;
  }
  .paging div > ul li a {
    display: block;
    width: 100%;
    height: 100%;
    cursor: pointer;
  }
  .paging div > ul li.active a {
    font-weight: bold;
    color: #2199e5;
  }
  .star-rating {
    unicode-bidi: bidi-override;
    direction: rtl;
  }
  .star-rating > span {
    display: inline-block;
    position: relative;
    width: 1.1em;
  }
  .class-view-detail-wrap h4 {
    display: block;
    width: 100%;
    float: left;
    padding-bottom: 10px;
    font-weight: normal;
    font-size: 30px;
    text-shadow: 1px 0;
    letter-spacing: -1px;
    padding-left: 0;
    border-bottom: 1px solid #999;
  }
  .class-view-detail-wrap h4:before {
    display: none;
  }
  .class-view-detail-wrap h4 .class-badge-green {
    display: inline-block;
    font-size: 13px;
    border: 1px solid #48d08c;
    padding: 0 3px;
    margin-left: 5px;
    color: #23af69;
    text-shadow: none;
    border-radius: 3px;
    text-align: center;
  }
  .class-view-detail-wrap div {
    display: table;
    width: 100%;
  }
  .class-view-detail-wrap div .class-/img/sub {
    display: table-cell;
    vertical-align: top;
    width: 171px;
  }
  .class-view-detail-wrap div .class-/img/sub /img/sub {
    border: 1px solid #ccc;
    padding: 5px;
    display: block;
    text-align: center;
    margin: 0 auto;
    background: #fff;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn {
    width: 100%;
    overflow: hidden;
    margin-top: 5px;
    display: flex;
    justify-content: center;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li {
    display: inline-block;
    background: #fff;
    border: 1px solid #c6cace;
    text-align: center;
    width: 33.333%;
    margin-right: 3px;
    margin-top: 5px;
    height: 54px;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li a {
    display: block;
    width: 100%;
    height: 100%;
    padding: 16px 0;
    box-sizing: border-box;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li.li_02 {
    background: #4d6887;
    border: none;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li.li_02 a {
    color: #fff;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li.li_02:hover {
    background: #4d687b;
  }
  
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li.li_03 {
    background: #f73f3f;
    border: none;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li.li_03 a {
    color: #fff;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li.li_03:hover {
    background: red;
  }
  
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li /img/sub {
    margin: 0;
    display: inline-block;
    border: 0;
    padding: 0;
    padding-right: 5px;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li:first-child {
    margin-top: 5px;
    margin-right: 3px;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li.red_border {
    border: 1px solid #f73f3f !important;
    background: #fff !important;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li.red_border a {
    color: #f73f3f !important;
    font-size: 12px;
    text-align: center;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li.red_border:hover {
    border: 1px solid #f73f3f !important;
    background: #fff !important;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li.red_border a {
    color: #f73f3f !important;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li:first-child a {
    color: #4d687b;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li:first-child:hover {
    background: #f8f8f8;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li:first-child:hover a {
    color: #435b6b;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li:last-child {
    margin-top: 5px;
    background: #2b3f54;
    border: 1px solid #2b3f54;
    margin-right: 0px;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li:last-child a {
    color: #fff;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li:last-child:hover {
    background: #223243;
  }
  .class-view-detail-wrap div .class-/img/sub .class-ask-btn li:last-child:hover a {
    color: #fff;
  }
  .class-ask-btn_02 li {
    margin-top: 10px !important;
  }
  .class-view-detail-wrap div .class-con {
    display: table-cell;
    vertical-align: top;
  }
  .class-view-detail-wrap div .class-con .level-c {
    display: inline-block;
    width: 20px;
    height: 21px;
    margin: 0 5px;
    background: url(..//img/sub/sub/lavel-a-bg.jpg) 0 2px no-repeat;
    text-align: center;
    font-size: 12px;
    color: #fff;
  }
  .class-view-detail-wrap div .class-con .level-b {
    display: inline-block;
    width: 20px;
    height: 21px;
    margin: 0 5px;
    background: url(..//img/sub/sub/lavel-b-bg.jpg) 0 2px no-repeat;
    text-align: center;
    font-size: 12px;
    color: #fff;
  }
  .class-view-detail-wrap div .class-con .level-a {
    display: inline-block;
    width: 20px;
    height: 21px;
    margin: 0 5px;
    background: url(..//img/sub/sub/lavel-c-bg.jpg) 0 2px no-repeat;
    text-align: center;
    font-size: 12px;
    color: #fff;
  }
  .class-view-detail-wrap div .class-con dl {
    position: relative;
    border-bottom: 1px dotted #d6d6d6;
    margin-left: 20px;
    padding: 10px 0;
    box-sizing: border-box;
  }
  .class-view-detail-wrap div .class-con dl dt {
    position: relative;
    padding-left: 12px;
    width: 80px;
    display: inline-block;
    color: #464646;
    text-shadow: 0.5px 0;
    vertical-align: top;
  }
  .class-view-detail-wrap div .class-con dl dt:before {
    position: absolute;
    top: 9px;
    left: 2px;
    display: block;
    content: "";
    width: 3px;
    height: 3px;
    background: #adb7bd;
  }
  .class-view-detail-wrap div .class-con dl dd {
    display: inline-block;
    color: #000;
    font-size: 13px;
  }
  .class-view-detail-wrap div .class-con dl dd ul li {
    position: relative;
    display: inline-block;
    padding-left: 12px;
  }
  .class-view-detail-wrap div .class-con dl dd ul li.star {
    height: 12px;
    overflow: hidden;
  }
  .class-view-detail-wrap div .class-con dl dd ul li:before {
    position: absolute;
    right: -10px;
    content: "/";
    color: #ccc;
  }
  .class-view-detail-wrap div .class-con dl dd ul li:first-child {
    padding-left: 0;
  }
  .class-view-detail-wrap div .class-con dl dd ul li:last-child:before {
    display: none;
  }
  .class-view-detail-wrap div .class-con dl dd ul li span.tit {
    color: #1180d2;
  }
  .class-view-detail-wrap div .class-con dl dd .class-period li {
    display: block;
    padding-left: 0;
    padding-bottom: 5px;
  }
  .class-view-detail-wrap div .class-con dl dd .class-period li:before {
    display: none;
  }
  .class-view-detail-wrap div .class-con dl dd .class-period li input {
    display: inline-block;
    margin-top: 0;
    margin-right: 10px;
    vertical-align: middle;
  }
  .class-view-detail-wrap div .class-con dl dd .class-period li span.day {
    color: #999;
    padding-right: 5px;
  }
  .class-view-detail-wrap div .class-con dl dd .class-period li span.class-type {
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 12px;
    margin-left: 3px;
  }
  .class-view-detail-wrap
    div
    .class-con
    dl
    dd
    .class-period
    li
    span.class-type.type01 {
    background: #1b6fc3;
    color: #fff;
  }
  .class-view-detail-wrap
    div
    .class-con
    dl
    dd
    .class-period
    li
    span.class-type.type02 {
    background: #ef5d05;
    color: #fff;
  }
  .class-view-detail-wrap
    div
    .class-con
    dl
    dd
    .class-period
    li
    span.class-type.type03 {
    background: #e1e8e8;
    color: #556371;
  }
  .class-view-detail-wrap div .class-con .red {
    color: red;
  }
  .class-view-detail-wrap div .class-con .red-btn {
    display: inline-block;
    margin-left: 10px;
    margin-right: 3px;
    background: red;
    color: #fff;
    border-radius: 3px;
    padding: 2px 5px;
    font-size: 12px;
  }
  .class-view-detail-wrap div .class-con .class-summary {
    background: #f5f5f5;
    padding: 5px;
    width: 867px;
    margin-left: 20px;
    margin-top: 10px;
    height: 100%;
    color: #444;
    font-size: 13px;
    box-sizing: border-box;
    overflow-y: scroll;
    word-break: break-all;
    display: block;
  }
  .class-view-detail-wrap div .class-con .star-state,
  .class-view-detail-wrap div .class-con .star-state span {
    display: block;
    width: 60px;
    height: 12px;
    overflow: hidden;
    text-align: left;
    background: url(..//img/sub/sub/icon_star.png) no-repeat;
    vertical-align: middle;
  }
  .class-view-detail-wrap div .class-con .star-state span {
    display: inline-block;
    background-position: 0 -12px;
    vertical-align: top;
  }
  .class-view-tab {
    display: table;
    width: 100%;
    margin-top: 30px;
    font-size: 15px;
    border: 1px solid #e5e5e5;
    border-top: 0;
    border-bottom: 0;
    box-sizing: border-box;
  }
  .class-view-tab li {
    border-top: 1px solid #000;
    width: 16.6%;
    display: table-cell;
  }
  .class-view-tab li > a {
    display: block;
    line-height: 35px;
    height: 35px;
    font-size: 15px;
    background: #f8f8f8;
    text-align: center;
    border-left: 1px solid #e5e5e5;
    border-bottom: 1px solid #e5e5e5;
  }
  .class-view-tab li.active {
    border-top: 1px solid #4aa3ff;
  }
  .class-view-tab li.active a {
    color: #000;
    text-shadow: 0.3px 0;
    border-bottom: none;
    background: #fff;
  }
  .class-view-tab li:hover a {
    color: #000;
    background: #fff;
  }
  .class-view-tab li:first-child a {
    border-left: none;
  }
  .class-tab-contents {
    border: 1px solid #e5e5e5;
    border-top: 0;
  }
  .class-tab-contents > div {
    padding: 20px;
    font-size: 14px;
    color: #555;
  }
  .class-tab-contents > div /img/sub {
    width: 100% !important;
    height: auto !important;
  }
  .class-tab-contents > div h3 {
    position: relative;
    padding-left: 12px;
    font-weight: normal;
    font-size: 15px;
    color: #000;
    margin: 30px 0 0 0;
    text-shadow: 0.3px 0;
  }
  .class-tab-contents > div h3:first-child {
    margin-top: 0;
  }
  .class-tab-contents > div h3:before {
    position: absolute;
    display: block;
    top: 7px;
    left: 0;
    width: 8px;
    height: 9px;
    background: #2b3f54;
    content: "";
  }
  .class-tab-contents > div > div {
    color: #666;
    font-size: 13px;
    padding-top: 5px;
	margin-bottom:20px;
  }
  .tab-subtit {
    position: relative;
    font-size: 18px;
    text-shadow: 0.5px 0;
    color: #000;
    padding-left: 10px;
    padding-bottom: 10px;
    margin-bottom: 10px;
    border-bottom: 1px dotted #ccc;
  }
  .tab-subtit:before {
    position: absolute;
    display: block;
    top: 6px;
    left: 0;
    width: 4px;
    height: 16px;
    background: #21a4ea;
    content: "";
  }
  .lec-view-blue {
    color: #1570a0;
  }
  .similar-class-wrap {
    margin-left: 20px;
    background: #f5f5f5;
    width: 867px !important;
    padding: 10px;
    box-sizing: border-box;
  }
  .similar-class-wrap > p {
    color: #464646;
    text-shadow: 0.5px 0;
  }
  .similar-class-wrap table.similar-class-tbl {
    margin-top: 5px;
    border-top: 1px solid #555;
    border-bottom: 1px solid #e5e5e5;
    font-size: 13px;
  }
  .similar-class-wrap table.similar-class-tbl .thumbnail /img/sub {
    width: 70px;
  }
  .similar-class-wrap table.similar-class-tbl tr:hover td {
    background: #fff;
    cursor: pointer;
  }
  .similar-class-wrap table.similar-class-tbl tr:hover td a {
    text-decoration: underline;
  }
  .similar-class-wrap table.similar-class-tbl td {
    padding: 5px;
    border-bottom: 1px solid #e5e5e5;
  }
  .similar-class-wrap table.similar-class-tbl td:last-child {
    border-bottom: none;
  }
  .class-index > li {
    color: #000;
    padding-bottom: 15px;
    text-shadow: 0.2px 0;
  }
  .class-index > li > ul {
    margin-top: 5px;
    font-size: 13px;
    background: #fbfbfb;
    padding: 15px;
    border-radius: 5px;
  }
  .class-index > li > ul > li {
    position: relative;
    padding-left: 15px;
    color: #777;
    font-weight: 100;
  }
  .class-index > li > ul > li:before {
    position: absolute;
    left: 0;
    clear: #777;
    content: "-";
  }
  .teacher-info-wrap {
    overflow: hidden;
	margin:0;
	display:flex; align-items:start; gap:10px; width:100%;
  }
  
  .lec-view-teacherimg {
    display: inline-block;
    float: left;
    width: 150px;
    height: 200px;
    background: #f8f8f8;
    border: 1px solid #e5e5e5;
    box-sizing: border-box;
  }
  .teacher-info {
    display: block;
    padding: 20px;
	width:auto;
	flex:1;
	border:1px solid #e5e5e5;
    box-sizing: border-box;
  }
  .teacher-info dl {
    width: 100%;
    overflow: hidden;
    padding: 5px 0;
    border-bottom: 1px dotted #e5e5e5;
  }
  .teacher-info dl dt {
    width: 100px;
    display: inline-block;
    float: left;
    color: #000;
    text-shadow: 0.5px 0;
  }
  .teacher-info dl dd {
    display: inline-block;
    float: left;
    color: #777;
  }
  .teacher-info dl:last-child {
    border-bottom: none;
  }
  .book-info-wrap {
    overflow: hidden;
    padding-bottom: 20px;
	display:flex;
  }
  .lec-view-bookimg {
    display: inline-block;
    float: left;
    width: 150px;
    height: 200px;
	max-width:255px;
    background: #f8f8f8;
    border: 1px solid #e5e5e5;
    box-sizing: border-box;
  }
  .book-info {
    display: inline-block;
    float: left;
    width: 1000px;
    padding-left: 20px;
    box-sizing: border-box;
  }
  .book-info dl {
    width: 100%;
    overflow: hidden;
    padding: 5px 0;
    border-bottom: 1px dotted #e5e5e5;
  }
  .book-info dl dt {
    width: 100px;
    display: inline-block;
    float: left;
    color: #000;
    text-shadow: 0.5px 0;
  }
  .book-info dl dd {
    display: inline-block;
    float: left;
    color: #777;
  }
  .book-info dl:last-child {
    border-bottom: none;
  }
  .info-list li {
    position: relative;
    padding-left: 15px;
    padding-bottom: 5px;
  }
  .info-list li:before {
    position: absolute;
    left: 0;
    display: block;
    content: "ㆍ";
    color: #000;
  }
  .breadcrumb-wrap {
    display: inline-block;
    background: #fff;
    float: right;
    padding-top: 10px;
    height: 30px;
    line-height: 1;
  }
  .breadcrumb-wrap > div {
    display: inline-block;
    float: right;
  }
  .breadcrumb-wrap li {
    position: relative;
    display: inline-block;
    padding-right: 20px;
  }
  .breadcrumb-wrap li:before {
    position: absolute;
    right: 5px;
    display: block;
    font-size: 10px;
    content: ">";
    color: #acacac;
  }
  .breadcrumb-wrap li a {
    color: #b9b9b9;
  }
  .breadcrumb-wrap li:last-child:before {
    display: none;
  }
  .breadcrumb-wrap li:last-child {
    padding-right: 0;
  }
  .breadcrumb-wrap li:last-child a {
    color: #222;
  }
  /*나의강의실 공지사항*/
  .megaphone {
    width: 100%;
    height: 200px;
  }
  .megaphone .more_view {
    width: 100%;
    overflow: hidden;
    margin-bottom: 10px;
  }
  .megaphone .more_view li {
    display: inline-block;
    padding: 5px 0;
  }
  .megaphone .more_view li:first-child {
    width: 55%;
    text-align: right;
    font-weight: 500;
    font-size: 22px;
  }
  .megaphone .more_view li:nth-child(2) {
    font-size: 16px;
    border: 2px solid #3aad6a;
    padding: 7px 10px;
    border-radius: 10px;
    font-weight: 500;
    margin-bottom: 5px;
    float: right;
  }
  .megaphone .more_view li:nth-child(2):hover {
    color: #3aad6a;
    cursor: pointer;
    background: fff;
    transition: 0.2s;
  }
  
  .megaphone > .megatable {
    width: 100%;
    text-align: center;
  }
  .megaphone > .megatable tr:first-child {
    border-top: 1px solid #222;
    background: #f5f5f5;
  }
  .megaphone > .megatable tr th {
    font-weight: 400;
    padding: 5px 0;
    border-bottom: 1px solid #ccc;
    font-size: 17px;
    width: 33.33%;
  }
  .megaphone > .megatable tr td {
    border-bottom: 1px solid #ccc;
    padding: 15px 0;
    font-size: 13px;
    width: 33.33%;
  }
  .megaphone > .megatable tr:last-child td {
    border-bottom: 1px solid #222;
  }
  
  .breadcrumb-wrap2 {
    position: absolute;
    right: 0;
    top: 0;
    display: inline-block;
    background: #fff;
    float: right;
    padding-top: 10px;
    height: 30px;
    line-height: 30px;
  }
  .breadcrumb-wrap2 > div {
    display: inline-block;
    float: right;
  }
  .breadcrumb-wrap2 li {
    position: relative;
    display: inline-block;
    padding-right: 20px;
  }
  .breadcrumb-wrap2 li:before {
    position: absolute;
    right: 5px;
    display: block;
    font-size: 10px;
    content: ">";
    color: #acacac;
  }
  .breadcrumb-wrap2 li a {
    color: #b9b9b9;
  }
  .breadcrumb-wrap2 li:last-child:before {
    display: none;
  }
  .breadcrumb-wrap2 li:last-child {
    padding-right: 0;
  }
  .breadcrumb-wrap2 li:last-child a {
    color: #222;
  }
  .greeting-wrap {
    overflow: hidden;
    width: 100%;
    height: 500px;
    background: url(..//img/sub/sub/greeting-/img/sub.jpg) bottom right no-repeat;
  }
  .greeting-wrap > div {
    display: inline-block;
    float: left;
  }
  .greeting-wrap .greeting-text {
    line-height: 20px;
    padding-right: 20px;
    box-sizing: border-box;
  }
  .greeting-wrap /img/sub {
    display: block;
    width: 400px;
    height: 400px;
    background: #e4e4e4;
  }
  .map-address dl {
    overflow: hidden;
    padding: 10px 0;
    border-bottom: 1px solid #dcdcdc;
  }
  .map-address dt {
    display: inline-block;
    float: left;
    width: 200px;
    font-size: 14px;
    text-shadow: 0.5px 0;
  }
  .map-address dd {
    display: inline-block;
    float: left;
    vertical-align: bottom;
    color: #777;
    height: 100%;
    line-height: 30px;
  }
  .map-address i {
    padding-right: 20px;
    font-size: 25px;
    color: #b7b7b7;
  }
  .summary01 {
    margin: 10px 0;
    font-size: 15px;
    padding: 15px;
    background: #ffffff;
    border: 3px solid #e3eaf3;
  }
  .summary02 {
    margin: 10px 0;
    font-size: 15px;
    padding: 15px;
    background: #fff;
    border: 5px solid #eff8f9;
    color: #142d77;
    background: #eff8f9;
  }
  .btn01 {
    margin-left: 5px;
    margin-top: 5px;
    display: inline-block;
    border: 1px solid #dadada;
    padding: 3px 7px;
    border-radius: 5px;
    color: #000;
    background: #fff;
    cursor: pointer;
  }
  .btn01:hover {
    background: #fff;
    border: 1px solid #007cff;
    color: #007cff;
  }
  .bbs-search {
    border: #e5e5e5 1px solid;
    padding: 15px;
    background: #f8f8f8;
  }
  .bbs-search > div {
    text-align: center;
  }
  .bbs-search > div button {
    background: #5d5d5d;
    height: 30px;
    color: #fff;
    font-size: 13px;
    padding: 0 10px;
  }
  .bbs-search.mt25 {
    margin-top: 25px;
  }
  .bbs-search-term {
    border: #e5e5e5 1px solid;
    padding: 15px;
    background: #f8f8f8;
  }
  .bbs-search-term > div {
    text-align: center;
  }
  .bbs-search-term > div button {
    background: #5d5d5d;
    height: 30px;
    color: #fff;
    font-size: 13px;
    padding: 0 10px;
  }
  .bbs-search-term.mt10 {
    margin-top: 10px;
  }
  .bbs-search-term-dic {
    border: #e5e5e5 1px solid;
    padding: 15px;
    background: #f8f8f8;
  }
  .bbs-search-term-dic .term-dic-index {
    text-align: left;
  }
  .bbs-search-term-dic .term-dic-index .tit {
    text-shadow: 0.5px 0;
    display: inline-block;
    padding-right: 30px;
  }
  .bbs-search-term-dic .term-dic-index ul {
    display: inline-block;
  }
  .bbs-search-term-dic .term-dic-index ul li {
    position: relative;
    display: inline-block;
    padding: 0 20px 0 20px;
  }
  .bbs-search-term-dic .term-dic-index ul li a {
    color: #000;
    text-shadow: 0.3px 0;
  }
  .bbs-search-term-dic .term-dic-index ul li:before {
    position: absolute;
    top: 6px;
    left: 0;
    width: 1px;
    height: 10px;
    background: #ccc;
    content: "";
  }
  .bbs-search-term-dic .term-dic-index ul li:first-child:before {
    display: none;
  }
  .bbs-search-term-dic .term-dic-index ul li:hover a {
    color: #00aaff;
  }
  .bbs-search-term-dic.mt25 {
    margin-top: 25px;
  }
  .bbs-btn-wrap {
    padding-top: 20px;
    float: right;
    padding-bottom: 10px;
    overflow: hidden;
  }
  .bbs-btn-wrap li {
    margin-left: 3px;
    display: inline-block;
    border: 1px solid #dadada;
    padding: 3px 7px;
    border-radius: 5px;
    color: #000;
    background: #fff;
    cursor: pointer;
  }
  .bbs-btn-wrap li:hover {
    background: #fff;
    border: 1px solid #2199e5;
    color: #2199e5;
  }
  .bbs-btn-wrap li:hover a {
    color: #2199e5;
  }
  .bbs-ok {
    padding-top: 20px;
    text-align: center;
    clear: both;
  }
  .bbs-ok a {
    display: inline-block;
    padding: 10px 50px;
    background: #333;
    color: #fff;
    font-size: 16px;
  }
  .note-ok {
    padding-top: 20px;
    text-align: center;
    clear: both;
  }
  .note-ok a {
    display: inline-block;
    padding: 10px 50px;
    background: #333;
    border-radius: 5px;
    color: #fff;
    font-size: 15px;
  }
  .note-line {
    width: 100%;
    margin-top: 40px;
    border-top: 1px dotted #ccc;
  }
  .note-div-wrap {
    margin-top: 10px;
    box-sizing: border-box;
  }
  .note-btn-wrap {
    overflow: hidden;
    margin-top: 20px;
  }
  .note-write {
    display: inline-block;
    color: #454d63;
    padding: 8px 30px;
    background: #fff;
    font-weight: normal;
    font-size: 14px;
    border-radius: 5px;
    margin: 5px;
    border: 1px solid #d9dde4;
    box-sizing: border-box;
    vertical-align: top;
  }
  .note-write span {
    display: inline-block;
    padding: 0 5px;
  }
  /* 쪽지함 탭 */
  .note-list-tab {
    vertical-align: top;
    float: right;
    overflow: hidden;
    margin-bottom: 10px;
    /*background: #edeff3; padding: 5px;*/
  }
  .note-list-tab > li {
    display: inline-block;
    float: left;
    width: 150px;
    text-align: center;
  }
  .note-list-tab > li h3 {
    color: #222;
    width: 100%;
    float: left;
  }
  .note-list-tab > li h3 > a {
    display: block;
    color: #454d63;
    padding: 8px 30px;
    background: #fff;
    font-weight: normal;
    font-size: 14px;
    border-radius: 5px;
    margin: 5px;
    border: 1px solid #d9dde4;
    box-sizing: border-box;
  }
  .note-list-tab > li.active {
    color: #fff;
  }
  .note-list-tab > li.active > h3 {
    color: #fff;
  }
  .note-list-tab > li.active > h3 > a {
    background: #454d63;
    color: #fff;
    border: 1px solid #454d63;
  }
  .note-list-tab > li:last-child h3 a {
    margin-right: 0;
  }
  /* 마이페이지*/
  .class-list-tab {
    margin-top: 20px;
    width: 100%;
    overflow: hidden;
    /*background: #edeff3; padding: 5px;*/
  }
  .class-list-tab > li {
    display: inline-block;
    float: left;
    width: 50%;
    text-align: center;
  }
  .class-list-tab > li h3 {
    color: #222;
    width: 100%;
    float: left;
  }
  .class-list-tab > li h3 > a {
    display: block;
    color: #454d63;
    padding: 8px 30px;
    background: #fff;
    font-weight: normal;
    margin: 5px;
    border: 1px solid #d9dde4;
    box-sizing: border-box;
  }
  .class-list-tab > li.active {
    color: #fff;
  }
  .class-list-tab > li.active > h3 {
    color: #fff;
  }
  .class-list-tab > li.active > h3 > a {
    background: #454d63;
    color: #fff;
    border: 1px solid #454d63;
  }
  /*테이블*/
  .tbl01 {
    width: 100%;
    font-size: 14px;
    margin-top: 20px;
    border-top: 2px solid #888;
    /*뷰,수정,리스트*/
  }
  .tbl01 thead tr {
    border-bottom: 1px solid #cbcbcb;
  }
  .tbl01 thead tr th {
    padding: 10px;
    text-align: center;
    color: #555;
    font-weight: normal;
    text-shadow: 0.5px 0;
    background: #f5f5f5;
    /*테이블정렬*/
  }
  .tbl01 thead tr th.center {
    text-align: center;
  }
  .tbl01 thead tr th.left {
    text-align: left;
  }
  .tbl01 thead tr th.right {
    text-align: right;
  }
  .tbl01 thead tr th.tit {
    font-size: 16px;
    color: #000;
    background: #fff;
    font-weight: normal;
    text-shadow: 0.5px 0;
  }
  .tbl01 thead tr th.tit2 {
    background: #f5f5f5;
  }
  .tbl01 thead tr td {
    height: 30px;
    /*테이블정렬*/
  }
  .tbl01 thead tr td.center {
    text-align: center;
  }
  .tbl01 thead tr td.left {
    text-align: left;
  }
  .tbl01 thead tr td.right {
    text-align: right;
  }
  .tbl01 thead tr td.pdr20 {
    padding-right: 20px;
    color: #999;
  }
  .tbl01 thead tr td dl {
    font-size: 13px;
    display: inline-block;
    padding-left: 20px;
  }
  .tbl01 thead tr td dl dt {
    display: inline-block;
    width: 50px;
    text-align: center;
    color: #999;
  }
  .tbl01 thead tr td dl dd {
    display: inline-block;
    width: 100px;
    text-align: center;
  }
  .tbl01 thead tr td dl.note {
    font-size: 13px;
    display: inline-block;
    padding-left: 20px;
  }
  .tbl01 thead tr td dl.note dt {
    display: inline-block;
    width: 50px;
    text-align: center;
    color: #999;
  }
  .tbl01 thead tr td dl.note dd {
    display: inline-block;
    width: 150px;
    text-align: center;
  }
  .tbl01 thead tr td.pl10 {
    padding-left: 10px;
  }
  .tbl01 tbody tr {
    border-bottom: 1px solid #cbcbcb;
  }
  .tbl01 tbody tr th {
    height: 30px;
    text-shadow: 0.3px 0;
    text-align: center;
    font-weight: normal;
    background: #f5f5f5;
    color: #000;
    /*테이블정렬*/
  }
  .tbl01 tbody tr th.center {
    text-align: center;
  }
  .tbl01 tbody tr th.left {
    text-align: left;
  }
  .tbl01 tbody tr th.right {
    text-align: right;
  }
  .tbl01 tbody tr th.tbody-th {
    background: #f9f9f9;
    padding: 10px;
    text-align: center;
    color: #555;
    font-weight: normal;
    text-shadow: 0.5px 0;
  }
  .tbl01 tbody tr td {
    height: 30px;
    background: #fff;
    padding: 10px;
    box-sizing: border-box;
    color: #555;
    text-align: center;
    /*테이블정렬*/
  }
  .tbl01 tbody tr td.center {
    text-align: center;
  }
  .tbl01 tbody tr td.left {
    text-align: left;
  }
  .tbl01 tbody tr td.right {
    text-align: right;
  }
  .tbl01 tbody tr td.unread {
    color: #000;
    text-shadow: 0.5px 0;
  }
  .tbl01 tbody tr td.unread a {
    color: #000;
    text-shadow: 0.5px 0;
  }
  .tbl01 tbody tr td a:hover {
    color: #2199e5;
    text-decoration: underline;
  }
  .tbl01 tbody tr td .dot-icon {
    display: inline-block;
    padding: 0 3px;
    vertical-align: middle;
    margin-bottom: 3px;
  }
  .tbl01 tbody tr.not-wrap td {
    color: #4f626f;
    text-shadow: 0.8px 0;
    background: #f4f4f5;
  }
  .tbl01 tbody tr.not-wrap td a {
    color: #4f626f;
  }
  .tbl01 tbody tr.not-wrap td a:hover {
    color: #2199e5;
    text-decoration: underline;
  }
  .tbl01 input,
  .tbl01 select {
    height: 30px;
    border: 1px solid #ccc;
    box-sizing: border-box;
  }
  .tbl01 input[type="checkbox"] {
    height: auto;
  }
  .tbl01.view > thead > tr {
    border-bottom: 1px solid #d6d6d6;
  }
  .tbl01.view > thead > th.tit {
    background: #fff;
    padding: 15px 0;
    font-size: 16px;
    text-shadow: 0.7px 0;
    font-weight: normal;
    color: #000;
  }
  .tbl01.view > thead > th.day {
    background: #fff;
    font-size: 12px;
    font-weight: normal;
    color: #999;
    padding: 5px 0;
  }
  .tbl01.view tbody > td {
    padding: 10px 20px;
    background: #f5f5f5;
    font-size: 13px;
  }
  .tbl01.edit {
    font-size: 13px;
  }
  .tbl01.edit > tbody > tr > th {
    background: #f5f5f5;
    color: #000;
  }
  .tbl01.edit > thead > th.tit {
    background: #f5f5f5;
    color: #000;
  }
  .tbl01.edit > tbody > td {
    background: #fff;
  }
  .tbl01.edit > tbody > td > input {
    width: 100%;
    border: 1px solid #e5e5e5;
  }
  .tbl01.board thead > th {
    background: #f5f5f5;
    padding: 10px;
    text-align: center;
    color: #000;
  }
  .tbl01.dic .dic-tit {
    color: #333;
    text-shadow: 0.5px 0;
  }
  .tbl01.mt0 {
    margin-top: 0;
  }
  .tbl02 {
    margin-top: 20px;
    width: 100%;
    border-top: 2px solid #222;
    /*뷰,수정,리스트*/
  }
  .tbl02 > thead > tr {
    border-bottom: 1px solid #cbcbcb;
  }
  .tbl02 > thead > tr > th {
    background: #4d62a0;
    padding: 10px;
    text-align: center;
    color: #fff;
    /*테이블정렬*/
  }
  .tbl02 > thead > tr > th.center {
    text-align: center;
  }
  .tbl02 > thead > tr > th.left {
    text-align: left;
  }
  .tbl02 > thead > tr > th.right {
    text-align: right;
  }
  .tbl02 > thead > tr > td {
    height: 30px;
    /*테이블정렬*/
  }
  .tbl02 > thead > tr > td input[type="text"] {
    width: 100%;
    background: #f8f8f8;
    padding: 10px 0;
    box-sizing: border-box;
  }
  .tbl02 > thead > tr > td.center {
    text-align: center;
  }
  .tbl02 > thead > tr > td.left {
    text-align: left;
  }
  .tbl02 > thead > tr > td.right {
    text-align: right;
  }
  .tbl02 > tbody > tr {
    border-bottom: 1px solid #cbcbcb;
  }
  .tbl02 > tbody > tr > th {
    height: 30px;
    text-shadow: 0.3px 0;
    background: #f9fbfd;
    text-align: center;
    font-weight: normal;
    color: #4d62a0;
    /*테이블정렬*/
  }
  .tbl02 > tbody > tr > th.center {
    text-align: center;
  }
  .tbl02 > tbody > tr > th.left {
    text-align: left;
  }
  .tbl02 > tbody > tr > th.right {
    text-align: right;
  }
  .tbl02 > tbody > tr > td {
    height: 30px;
    background: #fff;
    padding: 10px 10px 10px 20px;
    box-sizing: border-box;
    /*테이블정렬*/
  }
  .tbl02 > tbody > tr > td a:hover {
    text-decoration: underline;
    color: #007cff;
  }
  .tbl02 > tbody > tr > td.center {
    text-align: center;
  }
  .tbl02 > tbody > tr > td.left {
    text-align: left;
  }
  .tbl02 > tbody > tr > td.right {
    text-align: right;
  }
  .tbl02 table.view > thead > tr {
    border-bottom: 1px solid #cbcbcb;
  }
  .tbl02 table.view > thead > th.tit {
    background: #fff;
    padding: 15px 0;
    font-size: 16px;
    text-shadow: 0.7px 0;
    font-weight: normal;
    color: #000;
  }
  .tbl02 table.view > thead > th.day {
    background: #fff;
    font-size: 12px;
    font-weight: normal;
    color: #999;
    padding: 5px 0;
  }
  .tbl02 table.view tbody > td {
    padding: 10px 20px;
    background: #f5f5f5;
    font-size: 13px;
  }
  .tbl02 table.edit {
    font-size: 13px;
  }
  .tbl02 table.edit > tbody > tr > th {
    background: #f5f5f5;
    color: #000;
  }
  .tbl02 table.edit > thead > th.tit {
    background: #f5f5f5;
    color: #000;
  }
  .tbl02 table.edit > tbody > td {
    background: #fff;
  }
  .tbl02 table.edit > tbody > td > input {
    width: 100%;
    border: 1px solid #e5e5e5;
  }
  .tbl02 table.board thead > th {
    background: #f5f5f5;
    padding: 10px;
    text-align: center;
    color: #000;
  }
  .tbl03 {
    width: 100%;
    border-top: 2px solid #888;
  }
  .tbl03 > thead > tr {
    border-bottom: 1px solid #cbcbcb;
  }
  .tbl03 > thead > tr > th {
    background: #f9f9f9;
    padding: 7px;
    text-align: center;
    color: #333;
    font-weight: normal;
    text-shadow: 0.4px 0;
    border-right: 1px solid #ccc;
    /*테이블정렬*/
  }
  .tbl03 > thead > tr > th:last-child {
    border-right: 0;
  }
  .tbl03 > thead > tr > th.center {
    text-align: center;
  }
  .tbl03 > thead > tr > th.left {
    text-align: left;
  }
  .tbl03 > thead > tr > th.right {
    text-align: right;
  }
  .tbl03 > thead > tr > td {
    height: 30px;
    /*테이블정렬*/
  }
  .tbl03 > thead > tr > td.center {
    text-align: center;
  }
  .tbl03 > thead > tr > td.left {
    text-align: left;
  }
  .tbl03 > thead > tr > td.right {
    text-align: right;
  }
  .tbl03 > tbody > tr {
    border-bottom: 1px solid #cbcbcb;
  }
  .tbl03 > tbody > tr > th {
    height: 30px;
    text-shadow: 0.3px 0;
    text-align: center;
    font-weight: normal;
    color: #222;
    /*테이블정렬*/
  }
  .tbl03 > tbody > tr > th.center {
    text-align: center;
  }
  .tbl03 > tbody > tr > th.left {
    text-align: left;
  }
  .tbl03 > tbody > tr > th.right {
    text-align: right;
  }
  .tbl03 > tbody > tr > td {
    height: 30px;
    background: #fff;
    padding: 10px;
    box-sizing: border-box;
    color: #555;
    text-align: center;
    border-right: 1px solid #ccc;
    /*테이블정렬*/
  }
  .tbl03 > tbody > tr > td:last-child {
    border-right: 0;
  }
  .tbl03 > tbody > tr > td.center {
    text-align: center;
  }
  .tbl03 > tbody > tr > td.left {
    text-align: left;
  }
  .tbl03 > tbody > tr > td.right {
    text-align: right;
  }
  .tbl03 > tbody > tr > td .class-link {
    color: #444;
    text-shadow: 0.3px 0;
  }
  .tbl03 > tbody > tr > td .class-link:hover {
    color: #2b83e4;
    text-decoration: underline;
  }
  .tbl03 > tbody > tr > td .exam-btn {
    display: inline-block;
    background: #3aad69;
    color: #fff;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 13px;
  }
  .tbl03 > tbody > tr > td .exam-btn:hover {
    background: #2d8752;
  }
  .tbl03 > tbody > tr > td .exam-btn i {
    padding-right: 4px;
  }
  .tbl03 > tbody > tr > td .exam-btn-disabled {
    display: inline-block;
    background: #f5f5f5;
    border: 1px solid #e5e5e5;
    pointer-events: none;
    cursor: text;
    color: #a0a0a0;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 13px;
  }
  .tbl03 > tbody > tr > td .exam-btn-disabled:hover {
    background: #f5f5f5;
  }
  .tbl03 > tbody > tr > td .task-btn {
    display: inline-block;
    background: #72b9c1;
    color: #fff;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 13px;
  }
  .tbl03 > tbody > tr > td .task-btn:hover {
    background: #4fa7b1;
  }
  .tbl03 > tbody > tr > td .task-btn i {
    padding-right: 4px;
  }
  .tbl03 > tbody > tr > td .task-btn-disabled {
    display: inline-block;
    background: #f5f5f5;
    border: 1px solid #e5e5e5;
    pointer-events: none;
    cursor: text;
    color: #a0a0a0;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 13px;
  }
  .tbl03 > tbody > tr > td .task-btn-disabled:hover {
    background: #f5f5f5;
  }
  .tbl03 > tbody > tr > td .evaluation-btn {
    display: inline-block;
    border: 1px solid #87addc;
    color: #3877d8;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 13px;
  }
  .tbl03 > tbody > tr > td .evaluation-btn:hover {
    background: #fdfdfd;
    color: #1c498e;
    border: 1px solid #3977c4;
  }
  .tbl03 > tbody > tr > td .evaluation-btn i {
    padding-right: 4px;
  }
  .tbl03 > tbody > tr > td .evaluation-btn-disabled {
    display: inline-block;
    background: #f5f5f5;
    border: 1px solid #e5e5e5;
    pointer-events: none;
    cursor: text;
    color: #a0a0a0;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 13px;
  }
  .tbl03 > tbody > tr > td .evaluation-btn-disabled:hover {
    background: #f5f5f5;
  }
  .tbl03 > tbody > tr > td .score-wrap i {
    color: #2e75d6;
  }
  .tbl03 > tbody > tr > td .score {
    display: inline-block;
    padding: 5px;
  }
  .tbl03 > tbody > tr > td .enter-btn {
    display: inline-block;
    background: #3a3b4c;
    color: #fff;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 13px;
  }
  .tbl03 > tbody > tr > td .enter-btn:hover {
    background: #24252f;
  }
  .tbl03 > tbody > tr > td .enter-btn i {
    padding-right: 4px;
  }
  .tbl03 > tbody > tr > td .enter-btn-disabled {
    display: inline-block;
    background: #f5f5f5;
    border: 1px solid #e5e5e5;
    pointer-events: none;
    cursor: text;
    color: #a0a0a0;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 13px;
  }
  .tbl03 > tbody > tr > td .enter-btn-disabled:hover {
    background: #f5f5f5;
  }
  .tbl03 > tbody > tr > td .enter-btn-disabled i {
    padding-right: 4px;
  }
  .tbl03 > tbody > tr > td.pd-tb10 {
    padding: 10px 0;
  }
  .tbl03 > tbody > tr > td.pd0 {
    padding: 0;
  }
  .tbl03 > tbody > tr > td.tbl-progress {
    color: #607bca;
    padding: 18px 10px 2px 10px;
  }
  .tbl03 > tbody > tr > td.tbl-class-num {
    color: #a2a2a2;
    font-size: 13px;
  }
  .tbl03 > tbody > tr > td.tbl-class-day {
    color: #a2a2a2;
    font-size: 13px;
  }
  .tbl03 > tbody > tr > td span.class-type {
    padding: 2px 5px;
    border-radius: 3px;
    font-size: 13px;
    margin-left: 3px;
    color: #fff;
  }
  .tbl03 > tbody > tr > td span.class-type.type01 {
    color: #1b6fc3;
  }
  .tbl03 > tbody > tr > td span.class-type.type02 {
    color: #ef5d05;
  }
  .tbl03 > tbody > tr > td span.class-type.type03 {
    color: #555;
  }
  .tbl03 > tbody > tr > td.class-statue.cancle a {
    background: #e6e6e6;
    color: #9c9c9c;
  }
  .tbl03 > tbody > tr > td.class-statue.proceed a {
    background: #2b83e4;
    color: #fff;
  }
  .tbl03 > tbody > tr > td.class-statue.finished a {
    background: #3a3b4c;
    color: #fff;
  }
  .tbl03 > tbody > tr > td.class-statue a {
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 3px;
    box-sizing: border-box;
  }
  .tbl03 > tbody > tr > td.class-statue i {
    padding-right: 5px;
  }
  .tbl03 > tbody > tr > td a.issued {
    display: inline-block;
    background: #2b83e4;
    color: #fff;
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 3px;
    cursor: pointer;
  }
  .tbl03 > tbody > tr > td a.issued i {
    padding-right: 5px;
  }
  .tbl03 > tbody > tr > td a.survey {
    display: inline-block;
    background: #fff;
    border: 1px solid #2e75d6;
    color: #2e75d6;
    font-size: 12px;
    padding: 2px 8px;
    border-radius: 3px;
    cursor: pointer;
  }
  .tbl03 > tbody > tr > td a.survey i {
    padding-right: 5px;
  }
  .tbl03 > tbody > tr > td .exam-take-tit {
    font-size: 13px;
  }
  .tbl03 > tbody > tr > td .exam-take-day {
    font-size: 13px;
    color: #000;
  }
  .tbl03 > tbody > tr > td .exam-take-state {
    font-size: 13px;
    display: inline-block;
    border: 1px solid #cecece;
    color: #888;
    padding: 1px 6px;
    border-radius: 3px;
    margin-top: 3px;
    background: #f5f5f5;
  }
  .tbl03.mt25 {
    margin-top: 25px;
  }
  .tbl04 {
    width: 100%;
    /*border-bottom: 1px solid #c2c7d0;*/
  }
  .tbl04 > thead > tr > th {
    font-weight: normal;
    background: #eff3f7;
    height: 30px;
    font-size: 13px;
    border-right: 0;
    color: #5087b5;
    text-shadow: 0.1px 0;
  }
  .tbl04 > tbody > tr {
    border-bottom: 1px solid #cbd2dc;
  }
  
  .tbl04 > tbody > tr > td {
    border-right: 0;
    height: 30px;
    color: #454d63;
    font-size: 13px;
    background: #fff;
    padding: 0 10px;
    /*테이블정렬*/
  }
  .tbl04 tr:last-child {
    border-bottom: 0px;
  }
  
  .tbl04 > tbody > tr > td.center {
    text-align: center;
  }
  .tbl04 > tbody > tr > td.left {
    text-align: left;
  }
  .tbl04 > tbody > tr > td.right {
    text-align: right;
  }
  .tbl04 > tbody > tr > td.tbl-progress2 {
    color: #1e8ef1;
  }
  .tbl04 > tbody > tr > td.class-num {
    color: #5c93c7;
  }
  .tbl04 > tbody > tr:last-child td {
  }
  /*프로그레스 바*/
  .tbl-progress-wrap {
    position: relative;
    display: block;
    background: #efefef;
    width: 100%;
    height: 15px;
    box-sizing: border-box;
  }
  .tbl-progress-wrap .tbl-progress-wrap {
    position: relative;
    left: 0;
    top: 0;
    background: #2b8ae6;
  }
  .tbl-progress-wrap .tbl-progress-wrap .tbl-progress-num {
    position: absolute;
    top: -15px;
    right: 0;
    left: 0;
    color: #2b8ae6;
    font-size: 10px;
  }
  .tbl-progress-wrap > ul {
    font-size: 10px;
    color: #9e9e9e;
    padding-top: 1px;
  }
  .tbl-progress-wrap > ul li {
    display: inline-block;
    width: 33.3%;
    float: left;
  }
  .tbl-progress-wrap > ul li:nth-child(1) {
    text-align: left;
  }
  .tbl-progress-wrap > ul li:nth-child(2) {
    text-align: center;
  }
  .tbl-progress-wrap > ul li:nth-child(3) {
    text-align: right;
  }
  /*테이블정렬*/
  .center {
    text-align: center;
  }
  .left {
    text-align: left;
  }
  .right {
    text-align: right;
  }
  .class-play-btn a {
    background: #2b83e4;
    color: #fff;
    padding: 2px 8px;
    border-radius: 3px;
    font-size: 12px;
  }
  .class-play-btn a:hover {
    background: #196ac3;
  }
  .class-play-btn i {
    padding-right: 4px;
  }
  .class-list-text {
    padding: 10px 0;
  }
  .class-list-text span {
    text-shadow: 0.5px 0;
    padding: 0px 3px;
  }
  .class-exam-wrap {
    width: 100%;
    height: 100%;
    overflow-y: scroll;
  }
  .class-exam-wrap .class-exam {
    position: relative;
    width: 100%;
    height: 100%;
    background: #fff;
    /*시험지*/
  }
  .class-exam-wrap .class-exam h3 {
    position: fixed;
    width: 100%;
    z-index: 9990;
    box-sizing: border-box;
    background: #333;
    color: #fff;
    font-weight: normal;
    padding: 20px;
    font-size: 18px;
  }
  .class-exam-wrap .class-exam h3 i {
    padding-right: 5px;
  }
  .class-exam-wrap .class-exam p.warning {
    color: #d80404;
    background: #fffafa;
    padding: 10px;
    border: 1px solid #ead2d2;
  }
  .class-exam-wrap .class-exam .class-exam-con {
    padding: 100px 20px 20px 20px;
    font-size: 14px;
  }
  .class-exam-wrap .class-exam ol {
    padding-bottom: 40px;
  }
  .class-exam-wrap .class-exam ol li {
    display: table;
    width: 100%;
    padding: 5px 0;
    color: #545454;
  }
  .class-exam-wrap .class-exam ol li span.num {
    display: table-cell;
    color: #38a765;
    width: 20px;
    padding-right: 10px;
    font-weight: bold;
  }
  .class-exam-wrap .class-exam ol li span.txt {
    display: table-cell;
    color: #666;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con {
    padding: 70px 20px 20px 20px;
    font-size: 14px;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con .class-exam-paper-ul {
    padding-top: 20px;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con > ul > li {
    padding-bottom: 30px;
    box-sizing: border-box;
    padding-top: 30px;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con > ul > li:first-child {
    padding-top: 0;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con .question-wrap {
    display: table;
    width: 100%;
    overflow: hidden;
    border-bottom: 1px dotted #999;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .question-wrap
    .question-num {
    float: left;
    display: inline-block;
    font-size: 13px;
    width: 20px;
    height: 20px;
    line-height: 18px;
    border: 1px solid #555;
    box-sizing: border-box;
    background: #555;
    text-align: center;
    vertical-align: top;
    color: white;
    font-weight: 500;
    margin-top: 2px;
    border-radius: 3px;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .question-wrap
    .question-tit {
    float: left;
    display: inline-block;
    width: calc(100% - 125px);
    color: #000;
    font-size: 15px;
    padding-bottom: 5px;
    box-sizing: border-box;
    vertical-align: top;
    padding-left: 10px;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .question-wrap
    .question-score {
    float: left;
    display: inline-block;
    width: 100px;
    box-sizing: border-box;
    vertical-align: top;
    text-align: right;
    padding: 3px 0;
    font-size: 13px;
    border-radius: 5px;
    color: #999;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con .multiple-choice-wrap {
    padding: 15px 0 0 30px;
    font-size: 13px;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con .multiple-choice-wrap li {
    padding-bottom: 5px;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li
    span.num {
    position: relative;
    display: inline-block;
    margin-right: 10px;
    width: 18px;
    height: 18px;
    background: #f8f8f8;
    border-radius: 50%;
    text-align: center;
    font-size: 12px;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li
    span.num:before {
    position: absolute;
    left: -1px;
    display: block;
    width: 18px;
    height: 18px;
    border-radius: 50%;
    border: 1px solid #cacaca;
    background: none;
    color: #999;
    content: "";
    text-align: center;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li
    span.num:hover {
    background: #fff;
    color: #38a665;
    cursor: pointer;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li
    span.num:hover:before {
    border: 1px solid #38a665;
    cursor: pointer;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li:hover
    span {
    background: #fff;
    color: #38a665;
    cursor: pointer;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li:hover
    span:before {
    border: 1px solid #38a665;
    cursor: pointer;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li.correct-answer {
    position: relative;
    color: #ff520d;
    text-shadow: 0.5px 0;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li.correct-answer
    span.num {
    background: #fff;
    line-height: 20px;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li.correct-answer
    span.num:before {
    border: 2px solid #ff520d;
    box-sizing: border-box;
    width: 21px;
    height: 21px;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li.correct-answer:hover {
    color: #ff520d !important;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li.correct-answer:hover
    span.num {
    background: #fff;
    line-height: 20px;
    color: #ff520d;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li.correct-answer:hover
    span.num:before {
    border: 2px solid #ff520d;
    box-sizing: border-box;
    width: 21px;
    height: 21px;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li.correct-answer:hover
    span.tit {
    color: #ff520d !important;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li.correct-answer:before {
    position: absolute;
    left: -31px;
    content: "오답";
    top: 1px;
    color: #ff520d;
    font-size: 13px;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li.active-answer {
    color: #38a665;
    text-shadow: 0.5px 0;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li.active-answer
    span.num {
    background: #fff;
    line-height: 20px;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .multiple-choice-wrap
    li.active-answer
    span.num:before {
    border: 2px solid #38a665;
    box-sizing: border-box;
    width: 21px;
    height: 21px;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con .essay-question-wrap {
    padding-left: 25px;
    padding-top: 15px;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .essay-question-wrap
    span.tit {
    position: relative;
    text-shadow: 0.5px 0;
    font-size: 13px;
    padding-bottom: 5px;
    display: block;
    padding-left: 8px;
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .essay-question-wrap
    span.tit:before {
    position: absolute;
    display: block;
    width: 3px;
    height: 12px;
    background: #38a665;
    left: 0;
    top: 5px;
    content: "";
  }
  .class-exam-wrap
    .class-exam
    .class-exam-paper-con
    .essay-question-wrap
    textarea {
    border: 1px solid #d8d8d8;
    box-sizing: border-box;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con .essay-correct-answer {
    padding-left: 25px;
    padding-top: 10px;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con .essay-correct-answer .tit {
    background: #ff520d;
    margin-right: 5px;
    display: inline;
    padding: 0 5px;
    border-radius: 5px;
    color: #fff;
    font-size: 12px;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con .essay-correct-answer > div {
    background: #f9f7f7;
    border-radius: 5px;
    font-size: 13px;
    padding: 5px 10px;
    color: #ff520d;
    box-sizing: border-box;
    margin-top: 5px;
    text-shadow: 0.5px 0;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con .hint-wrap {
    padding-left: 25px;
    padding-top: 10px;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con .hint-wrap .tit {
    background: #2b9456;
    margin-right: 5px;
    display: inline;
    padding: 0 5px;
    border-radius: 5px;
    color: #fff;
    font-size: 12px;
  }
  .class-exam-wrap .class-exam .class-exam-paper-con .hint-wrap > div {
    background: #f3f9f5;
    border-radius: 5px;
    font-size: 13px;
    padding: 5px 10px;
    color: #43885e;
    box-sizing: border-box;
    margin-top: 5px;
  }
  .class-exam-wrap .exam-close {
    position: absolute;
    top: 24px;
    right: 17px;
  }
  .class-exam-wrap .exam-close i {
    color: #fff;
    font-size: 20px;
  }
  .exam-checkbox {
    padding-top: 50px;
  }
  .exam-checkbox > div {
    display: block;
    text-align: center;
    margin: 0 auto;
  }
  .exam-checkbox > div.exam-confirm {
    display: block;
    text-align: center;
    margin: 0 auto;
    background: #f7f7f7;
    padding: 5px 0;
    border: 1px solid #e4e4e4;
  }
  .exam-checkbox > div.exam-start {
    padding-top: 50px;
  }
  .exam-checkbox .exam-btn {
    display: inline-block;
    background: #008636;
    padding: 10px 40px;
    color: #fff;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    font-size: 15px;
  }
  .exam-checkbox .exam-btn i {
    padding-right: 5px;
  }
  .exam-checkbox .exam-btn:hover {
    background: #005321;
  }
  
  .exam-checkbox .re-exam-btn {
    display: inline-block;
    background: #f15f5f;
    padding: 10px 40px;
    color: #fff;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    font-size: 15px;
  }
  .exam-checkbox .re-exam-btn i {
    padding-right: 5px;
  }
  .exam-checkbox .re-exam-btn:hover {
    background: #980000;
  }

  .is-re-exam-btn {
	display: inline-block;
	border: 1px solid #dadada;
	padding: 3px 7px;
	border-radius: 5px;
	color: #FF5E00 !important;
	 
  }
  
  .is-re-exam-btn:hover {
	background: #fff;
	border: 1px solid #2e75d6;
  }
  
  .edu_lec-con-wrap .tbl01 {
    margin-top: 10px;
  }
  .edu_lec-con-wrap .tbl01 tbody tr th {
    background: #f5f5f5;
  }
  .edu_lec-con-wrap .tbl01 tbody tr td {
    padding: 5px;
  }
  .edu_lec-con-wrap .tbl01 tbody .modify {
    display: inline-block;
    margin: 0 10px;
    color: #999;
    border-radius: 3px;
    border: 1px solid #e5e5e5;
    padding: 1px 5px;
  }
  .edu_lec-con-wrap .tbl01 tbody .modify:hover {
    text-decoration: none;
    background: #f8f8f8;
  }
  .edu_lec-con-wrap .tbl01 tfoot tr {
    border-bottom: 1px solid #d2d2d2;
  }
  .edu_lec-con-wrap .tbl01 tfoot tr td {
    height: 30px;
    background: #fff;
    padding: 10px;
    box-sizing: border-box;
    color: #555;
    text-align: center;
  }
  .edu_lec-con-wrap .tbl01 .total-tit {
    color: #000;
    text-shadow: 0.3px 0;
  }
  .edu_lec-con-wrap .tbl01 .total {
    color: #000;
    text-shadow: 0.3px 0;
  }
  .edu_lec-con-wrap .tbl01.left td {
    text-align: left;
    padding-left: 20px;
  }
  .edu_lec-con-wrap .tbl01 .class-name {
    text-shadow: 0.5px 0;
    color: #43627d;
  }
  .edu_lec-con-wrap .tbl01 .class-day {
    color: #999;
  }
  .edu_lec-con-wrap i {
    color: #2b3f54;
    padding-right: 5px;
  }
  .edu_lec-con-wrap p.sub-title01 {
    position: relative;
    margin-top: 30px;
    font-size: 16px;
    color: #000;
    text-shadow: 0.5px 0;
  }
  .edu_lec-con-wrap p.sub-title01:first-child {
    margin-top: 0;
  }
  .edu_lec-con-wrap .total-price-tit {
    background: #ebebeb;
    color: #242424;
  }
  .edu_lec-con-wrap .total-price {
    color: #2e75d6;
    font-size: 20px;
    text-shadow: 1px 0;
    padding: 10px !important;
  }
  .edu_lec-con-wrap .price-method ul li {
    display: inline-block;
    padding-right: 20px;
    color: #000;
  }
  .edu_lec-con-wrap .pay-btn-wrap {
    margin: 80px 0;
    text-align: center;
  }
  .edu_lec-con-wrap .pay-btn-active {
    width: 200px;
    background: #2b3f54;
    padding: 10px 20px;
    color: #fff;
    box-sizing: border-box;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    margin-right: 10px;
  }
  .edu_lec-con-wrap .pay-btn-active:hover {
    background: #1a2632;
    color: #fff;
  }
  .edu_lec-con-wrap .pay-btn {
    width: 200px;
    background: #f8f8f8;
    padding: 10px 20px;
    color: #777;
    border: 1px solid #ddd;
    box-sizing: border-box;
    text-decoration: none;
    display: inline-block;
    text-align: center;
  }
  .edu_lec-con-wrap .pay-btn:hover {
    background: #f8f8f8;
    color: #555;
  }
  .class-btn-wrap {
    margin: 80px 0 20px 0;
    text-align: center;
  }
  .class-btn-wrap .class-btn {
    width: 200px;
    background: #2b3f54;
    padding: 10px 20px;
    color: #fff;
    box-sizing: border-box;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    margin-right: 10px;
  }
  .class-btn-wrap .class-btn2 {
    width: 200px;
    background: #3d83ce;
    padding: 10px 20px;
    color: #fff;
    box-sizing: border-box;
    text-decoration: none;
    display: inline-block;
    text-align: center;
    margin-right: 10px;
  }
  
  .class-btn-wrap .class-btn:hover {
    background: #1a2632;
    color: #fff;
  }
  .class-btn-wrap .class-btn2:hover {
    background: #2b83e4;
    color: #fff;
  }
  /*내일배움카드*/
  .tomorrow-card-tab-wrap {
    display: table;
    width: 100%;
    overflow: hidden;
    margin: 30px 0;
  }
  .tomorrow-card-tab-wrap li {
    display: inline-block;
    float: left;
    text-align: center;
    width: 14.2%;
    padding: 10px;
    box-sizing: border-box;
    border-radius: 30px;
  }
  .tomorrow-card-tab-wrap li a {
    font-size: 17px;
    border: 1px solid #e5e5e5;
    /*background: #f4f5f9;*/
    display: block;
    padding: 10px 0;
    border-radius: 30px;
  }
  .tomorrow-card-tab-wrap li:hover a {
    color: #3e4352;
    background: #f5f5f5;
  }
  .tomorrow-card-tab-wrap li.active a {
    color: #fff;
    background: #3e4352;
  }
  .tomorrow-card-tab-wrap li:first-child {
    padding-left: 0;
  }
  .tomorrow-card-tab-wrap li:last-child {
    padding-right: 0;
  }
  /*환급과정*/
  .return-card-tab-wrap {
    display: table;
    width: 100%;
    overflow: hidden;
    margin: 30px 0;
  }
  .return-card-tab-wrap li {
    display: inline-block;
    float: left;
    text-align: center;
    width: 20%;
    padding: 10px;
    box-sizing: border-box;
    border-radius: 30px;
  }
  .return-card-tab-wrap li a {
    font-size: 17px;
    border: 1px solid #e5e5e5;
    /*background: #f4f5f9;*/
    display: block;
    padding: 10px 0;
    border-radius: 30px;
  }
  .return-card-tab-wrap li:hover a {
    color: #3e4352;
    background: #f5f5f5;
  }
  .return-card-tab-wrap li.active a {
    color: #fff;
    background: #3e4352;
  }
  .return-card-tab-wrap li:first-child {
    padding-left: 0;
  }
  .return-card-tab-wrap li:last-child {
    padding-right: 0;
  }
  /*취업지원*/
  .support-card-tab-wrap {
    display: table;
    width: 100%;
    overflow: hidden;
    margin: 30px 0;
  }
  .support-card-tab-wrap li {
    display: inline-block;
    float: left;
    text-align: center;
    width: 33.3%;
    padding: 10px;
    box-sizing: border-box;
    border-radius: 30px;
  }
  .support-card-tab-wrap li a {
    font-size: 17px;
    border: 1px solid #e5e5e5;
    /*background: #f4f5f9;*/
    display: block;
    padding: 10px 0;
    border-radius: 30px;
  }
  .support-card-tab-wrap li:hover a {
    color: #3e4352;
    background: #f5f5f5;
  }
  .support-card-tab-wrap li.active a {
    color: #fff;
    background: #3e4352;
  }
  .support-card-tab-wrap li:first-child {
    padding-left: 0;
  }
  .support-card-tab-wrap li:last-child {
    padding-right: 0;
  }
  .return-card-tab-con h3 {
    position: relative;
    font-size: 18px;
    font-weight: 500;
    padding-left: 10px;
    margin-top: 60px;
  }
  .return-card-tab-con h3:before {
    position: absolute;
    top: 7px;
    left: 0;
    display: block;
    width: 3px;
    height: 15px;
    background: #2e75d6;
    content: "";
  }
  .return-card-tab-con .sub-span-wrap {
    background: #f5f5f5;
    border-radius: 5px;
    padding: 20px;
    margin-top: 10px;
    box-sizing: border-box;
  }
  .return-card-tab-con .sub-span-wrap span.caption-bottom {
    color: #1186b5;
    padding-top: 2px;
  }
  .return-card-tab-con .sub-span-wrap span.bold {
    text-shadow: 0.3px 0;
    color: #000;
  }
  .return-card-step {
    display: table;
    width: 100%;
    padding: 20px 0;
  }
  .return-card-step li {
    position: relative;
    display: table-cell;
    width: 33.3%;
    padding: 10px;
    box-sizing: border-box;
  }
  .return-card-step li span {
    display: block;
    width: 150px;
    height: 150px;
    background: #f5f5f5;
    border-radius: 50%;
    text-align: center;
    margin: 0 auto;
  }
  .return-card-step li span em {
    display: inline-block;
    padding-top: 55px;
    font-size: 17px;
    color: #1b4073;
    font-weight: 500;
  }
  .return-card-step li.step01 span {
    border: 10px solid #f5f9ff;
    background: #fff;
    box-sizing: border-box;
  }
  .return-card-step li.step02 span {
    border: 10px solid #eef5ff;
    background: #fff;
    box-sizing: border-box;
  }
  .return-card-step li.step03 span {
    border: 10px solid #e0edff;
    background: #fff;
    box-sizing: border-box;
  }
  .return-card-step li.step04 span {
    border: 10px solid #cfe2ff;
    background: #fff;
    box-sizing: border-box;
  }
  .return-card-step li.step05 span {
    background: #68a3f9;
  }
  .return-card-step li.step05 span em {
    font-size: 17px;
    color: #fff;
    font-weight: bold;
    padding-top: 60px;
  }
  .return-card-step li p {
    text-align: center;
    font-size: 14px;
    color: #2e75d6;
  }
  .return-card-step li:before {
    position: absolute;
    content: "";
    top: 75px;
    right: -15px;
    z-index: 9999;
    width: 25px;
    height: 19px;
    background: url(..//img/sub/sub/tm-before.jpg) no-repeat;
  }
  .return-card-step li:last-child:before {
    background: none;
  }
  .return-card-step-info {
    display: table;
    width: 100%;
  }
  .return-card-step-info li {
    display: table-cell;
    color: #333;
    width: 33.3%;
    padding: 0 10px;
    box-sizing: border-box;
    text-align: center;
    text-shadow: 0.5px 0;
  }
  .return-card-step-info li p {
    text-align: center;
    font-weight: 500;
    font-size: 16px;
    color: #5a93e0;
    padding-bottom: 10px;
  }
  .return-card-step-4 {
    display: table;
    width: 100%;
    padding: 20px 0;
  }
  .return-card-step-4 li {
    position: relative;
    display: table-cell;
    width: 25%;
    padding: 10px;
    box-sizing: border-box;
    text-shadow: 0.5px 0;
  }
  .return-card-step-4 li span {
    display: block;
    width: 150px;
    height: 150px;
    background: #f5f5f5;
    border-radius: 50%;
    text-align: center;
    margin: 0 auto;
  }
  .return-card-step-4 li span em {
    display: inline-block;
    padding-top: 55px;
    font-size: 17px;
    color: #1b4073;
    font-weight: 500;
  }
  .return-card-step-4 li.step01 span {
    border: 10px solid #f5f9ff;
    background: #fff;
    box-sizing: border-box;
  }
  .return-card-step-4 li.step02 span {
    border: 10px solid #eef5ff;
    background: #fff;
    box-sizing: border-box;
  }
  .return-card-step-4 li.step03 span {
    border: 10px solid #e0edff;
    background: #fff;
    box-sizing: border-box;
  }
  .return-card-step-4 li.step04 span {
    border: 10px solid #cfe2ff;
    background: #fff;
    box-sizing: border-box;
  }
  .return-card-step-4 li.step05 span {
    background: #68a3f9;
  }
  .return-card-step-4 li.step05 span em {
    font-size: 17px;
    color: #fff;
    font-weight: bold;
    padding-top: 60px;
  }
  .return-card-step-4 li p {
    text-align: center;
    font-size: 14px;
    color: #2e75d6;
  }
  .return-card-step-4 li:before {
    position: absolute;
    content: "";
    top: 75px;
    right: -15px;
    z-index: 9999;
    width: 25px;
    height: 19px;
    background: url(..//img/sub/sub/tm-before.jpg) no-repeat;
  }
  .return-card-step-4 li:last-child:before {
    background: none;
  }
  .return-card-step-info-4 {
    display: table;
    width: 100%;
  }
  .return-card-step-info-4 li {
    display: table-cell;
    color: #333;
    width: 25%;
    padding: 0 10px;
    box-sizing: border-box;
    text-align: center;
    text-shadow: 0.5px 0;
  }
  .return-card-step-info-4 li p {
    text-align: center;
    font-weight: 500;
    font-size: 16px;
    color: #5a93e0;
    padding-bottom: 10px;
  }
  .tomorrow-card-tab-con h3 {
    position: relative;
    font-size: 18px;
    font-weight: 500;
    padding-left: 10px;
    margin-top: 60px;
  }
  .tomorrow-card-tab-con h3:before {
    position: absolute;
    top: 7px;
    left: 0;
    display: block;
    width: 3px;
    height: 15px;
    background: #2e75d6;
    content: "";
  }
  .tomorrow-card-tab-con.info h3 {
    margin-top: 0;
  }
  .tomorrow-card-tab-con .sub-title {
    position: relative;
    font-size: 16px;
    color: #2e75d6;
    font-weight: 500;
    padding-top: 30px;
    bottom: 5px;
    padding-left: 10px;
  }
  .tomorrow-card-tab-con .sub-title.first {
    padding-top: 30px;
  }
  .tomorrow-card-tab-con .subul-01 {
    padding-left: 10px;
  }
  .tomorrow-card-tab-con .subul-01 li {
    position: relative;
    color: #333;
    padding-bottom: 5px;
    padding-left: 10px;
  }
  .tomorrow-card-tab-con .subul-01 li:before {
    position: absolute;
    display: inline-block;
    left: 0;
    top: 8px;
    width: 4px;
    height: 4px;
    background: #6598da;
    content: "";
  }
  .tomorrow-card-tab-con .subul-01 li.no_before:before {display: none;}
  .tomorrow-card-tab-con .subul-01 li > span.tit {
    width: 120px;
    color: #333;
    display: inline-block;
    text-shadow: 0.5px 0;
  }
  .tomorrow-card-tab-con .sub-span-wrap {
    background: #f5f5f5;
    border-radius: 5px;
    padding: 20px;
    margin-top: 10px;
    box-sizing: border-box;
    margin: 10px 15px;
  }
  .tomorrow-card-tab-con .sub-span-wrap span.caption-bottom {
    color: #1186b5;
    padding-top: 2px;
  }
  .tomorrow-card-tab-con .sub-span-wrap span.bold {
    text-shadow: 0.3px 0;
    color: #000;
  }
  .tomorrow-card-tab-con .hrd-link-wrap {
    text-align: center;
    margin: 0 auto;
    padding: 10px 0;
  }
  .tomorrow-card-tab-con .hrd-link {
    background: #2e75d6;
    padding: 10px 20px;
    display: inline-block;
    color: #fff;
    border-radius: 5px;
  }
  .tomorrow-card-tab-con .hrd-link:hover {
    background: #225eaf;
  }
  .tomorrow-card-tab-con h5 {
    font-size: 15px;
    padding-left: 15px;
  }
  .to-02 {
    width: 80%;
    margin: 0 auto;
    display: block;
    margin: 30px auto;
    text-align: center;
    border: 1px solid #ccc;
  }
  .to-info-wrap {
    display: table;
    margin: 0 auto;
    width: 1170px;
    padding: 20px;
    overflow: hidden;
    /* border:7px solid #ececec;*/
    box-sizing: border-box;
  }
  .to-info-wrap > /img/sub {
    display: inline-block;
    float: left;
    width: 200px;
  }
  .to-info-wrap > div {
    display: inline-block;
    float: left;
    width: 750px;
    padding: 35px 0 0 30px;
    line-height: 20px;
    color: #808080;
  }
  .to-info-wrap .point-txt {
    display: block;
    padding-bottom: 15px;
    color: #1d1d1d;
    font-size: 23px;
    line-height: 28px;
  }
  .to-info-wrap .warning-txt {
    color: #de4724;
    font-size: 12px;
  }
  .to-info-wrap .button-txt {
    cursor: pointer;
    margin-left: 5px;
    background: #2e75d6;
    border-radius: 3px;
    display: inline;
    padding: 1px 8px;
    color: #fff;
    font-size: 13px;
    margin-right: 5px;
  }
  .sub-content-box .iframe-wrapper {
    margin-top: 20px;
    width: 100%;
    padding-bottom: 56.25%; /* 16:9 비율을 유지하기 위해 사용 (가로:세로 = 16:9) */
    position: relative;
  }
  .sub-content-box .iframe-wrapper iframe.video  {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
  }
  .sub-content-box.tomorrow-wrap .tbl01 {
    margin-top: 50px;
  }
  .sub-content-box.tomorrow-wrap .tbl01.padding-none {
    margin-top: 10px;
  }
  .sub-content-box.tomorrow-wrap .tbl01 tbody tr th {
    color: #3a6cc3;
    background: #f6faff;
  }
  .sub-content-box.tomorrow-wrap .tbl01 tbody tr td.yellow {
    background: #ffffff;
    color: #0a3369;
    font-weight: 500;
    font-size: 15px;
  }
  .sub-content-box.tomorrow-wrap .blue-t {
    background: #f5f9ff;
    color: #093369;
  }
  .sub-content-box.tomorrow-wrap .tbl01 tbody tr th.bg01 {
    background: #4584d4;
    color: #fff;
    border-bottom: 1px solid #4584d4;
  }
  .sub-content-box.tomorrow-wrap .tbl01 tbody tr th.bg02 {
    background: #1858ab;
    color: #fff;
    border-bottom: 1px solid #1858ab;
  }
  .sub-content-box.tomorrow-wrap .tbl01 tbody tr th.bg03 {
    background: #0a3369;
    color: #fff;
  }
  .sub-content-box.tomorrow-wrap .caption-bottom {
    color: #999;
    display: block;
    padding-top: 5px;
  }
  .sub-content-box.return-wrap .tbl01 {
    margin-top: 50px;
  }
  .sub-content-box.return-wrap .tbl01.padding-none {
    margin-top: 10px;
  }
  .sub-content-box.return-wrap .tbl01 tbody tr th {
    color: #3a6cc3;
    background: #f6faff;
  }
  .sub-content-box.return-wrap .tbl01 tbody tr td.yellow {
    background: #ffffff;
    color: #0a3369;
    font-weight: 500;
    font-size: 15px;
  }
  .sub-content-box.return-wrap .blue-t {
    background: #f5f9ff;
    color: #093369;
  }
  .sub-content-box.return-wrap .tbl01 tbody tr th.bg01 {
    background: #e7f2ff;
    color: #2477d2;
  }
  .sub-content-box.return-wrap .tbl01 tbody tr th.bg02 {
    color: #637798;
    background: #f6faff;
  }
  .sub-content-box.return-wrap .caption-bottom {
    color: #999;
    display: block;
    padding-top: 5px;
    display: inline-block;
  }
  .sub-content-box.return-wrap h5 {
    position: relative;
    padding-left: 5px;
    font-size: 14px;
    color: #42689e;
  }
  .sub-content-box.return-wrap h5:before {
    position: absolute;
    display: block;
    content: "-";
    left: 0;
    color: #42689e;
  }
  .tomorrow-card-step {
    display: table;
    width: 100%;
    padding: 20px 0;
  }
  .tomorrow-card-step li {
    position: relative;
    display: table-cell;
    width: 20%;
    padding: 10px;
    box-sizing: border-box;
  }
  .tomorrow-card-step li span {
    display: block;
    width: 150px;
    height: 150px;
    background: #f5f5f5;
    border-radius: 50%;
    text-align: center;
    margin: 0 auto;
  }
  .tomorrow-card-step li span em {
    display: inline-block;
    padding-top: 45px;
    font-size: 18px;
    color: #1b4073;
    font-weight: 500;
  }
  .tomorrow-card-step li.step01 span {
    border: 15px solid #f5f9ff;
    background: #fff;
    box-sizing: border-box;
  }
  .tomorrow-card-step li.step02 span {
    border: 15px solid #eef5ff;
    background: #fff;
    box-sizing: border-box;
  }
  .tomorrow-card-step li.step03 span {
    border: 15px solid #e0edff;
    background: #fff;
    box-sizing: border-box;
  }
  .tomorrow-card-step li.step04 span {
    border: 15px solid #cfe2ff;
    background: #fff;
    box-sizing: border-box;
  }
  .tomorrow-card-step li.step05 span {
    background: #68a3f9;
  }
  .tomorrow-card-step li.step05 span em {
    font-size: 20px;
    color: #fff;
    font-weight: bold;
    padding-top: 60px;
  }
  .tomorrow-card-step li p {
    text-align: center;
    font-size: 14px;
    color: #2e75d6;
  }
  .tomorrow-card-step li:before {
    position: absolute;
    content: "";
    top: 75px;
    right: -15px;
    z-index: 9999;
    width: 25px;
    height: 19px;
    background: url(..//img/sub/sub/tm-before.jpg) no-repeat;
  }
  .tomorrow-card-step li:last-child:before {
    background: none;
  }
  .tomorrow-card-step-info {
    display: table;
    width: 100%;
    padding: 10px 0;
  }
  .tomorrow-card-step-info li {
    display: table-cell;
    color: #333;
    width: 20%;
    padding: 0 10px;
    box-sizing: border-box;
    text-align: center;
  }
  .tomorrow-card-step-info li p {
    text-align: center;
    font-weight: 500;
    font-size: 16px;
    color: #5a93e0;
    padding-bottom: 10px;
  }
  .em-card-tab-con /img/sub {
    display: inline-block;
    width: 1200px;
    margin: 15px 0;
    border: 1px solid #cdcdcd;
    box-sizing: border-box;
  }
  .em-card-tab-con .em-p01 {
    padding: 10px 0;
  }
  .em-card-tab-con .list01 {
    padding: 10px 0 40px 0 !important;
  }
  .em-card-tab-con .em-summary {
    padding: 15px 20px;
    background: #fdfdfd;
    border-radius: 10px;
    margin: 10px 0;
  }
  .em-card-tab-con .em-summary /img/sub {
    width: 1160px;
  }
  .em-card-tab-con .subul-01 {
    padding-top: 20px;
  }
  .em-card-tab-con .subul-01 > li {
    font-weight: 400;
  }
  .em-card-tab-con .subul-01 > li ul {
    padding: 10px;
    background: #fafbfd;
    margin: 10px;
  }
  .em-card-tab-con .subul-01 > li ul li {
    color: #000;
    font-weight: 300;
    padding-left: 25px;
  }
  .em-card-tab-con .subul-01 > li ul li:before {
    background: none;
    content: "-";
    top: 0;
    left: 10px;
  }
  .em-card-tab-con .subul-01 > li .step-tit {
    color: #2e75d6;
    display: inline-block;
    padding: 0 5px;
    font-weight: 500;
  }
  .em-card-tab-con .subul-03 {
    padding-left: 10px;
  }
  .em-card-tab-con .subul-03 > li {
    position: relative;
    color: #333;
    padding-bottom: 5px;
    padding-left: 10px;
  }
  .em-card-tab-con .subul-03 > li:before {
    position: absolute;
    display: inline-block;
    left: 0;
    top: 8px;
    width: 4px;
    height: 4px;
    background: #6598da;
    content: "";
  }
  .em-card-tab-con .subul-03 > li ul li {
    color: #000;
    font-weight: 300;
    padding-left: 25px;
  }
  .em-card-tab-con .subul-03 > li ul li:before {
    background: none;
    content: "-";
    top: 0;
    left: 10px;
  }
  .em-card-tab-con h5 {
    position: relative;
    padding-left: 10px;
  }
  .em-card-tab-con h5:before {
    position: absolute;
    left: 0;
    top: 0;
    content: "-";
  }
  .em-card-tab-con .tbl01 {
    margin-top: 10px !important;
  }
  .history-wrap {
    position: relative;
  }
  .history-wrap:before {
    position: absolute;
    left: 0;
    right: 0;
    margin: 0 auto;
    display: block;
    width: 1px;
    height: 100%;
    background: #ccc;
    content: "";
  }
  .history-wrap > ul {
    margin-top: 30px;
  }
  .history-wrap > ul > li {
    width: 50%;
    padding-right: 30px;
    overflow: hidden;
    margin-top: 30px;
    padding-bottom: 40px;
    margin-top: 10px;
  }
  .history-wrap > ul > li h3 {
    position: relative;
    color: #333;
    font-weight: 600;
    font-size: 25px;
    letter-spacing: -1px;
    text-align: right;
    padding-right: 33px;
  }
  .history-wrap > ul > li h3:before {
    position: absolute;
    top: 6px;
    right: -13px;
    display: block;
    width: 25px;
    height: 25px;
    background: #fff;
    content: "";
    border: 5px solid #2e75d6;
    box-sizing: border-box;
    border-radius: 50%;
  }
  .history-wrap > ul > li:first-child {
    margin-top: 0;
  }
  .history-wrap > ul > li.right {
    float: right;
    padding-right: 0;
    padding-left: 30px;
  }
  .history-wrap > ul > li.right h3 {
    position: relative;
    text-align: left;
    padding-right: 0;
    padding-left: 30px;
  }
  .history-wrap > ul > li.right h3:before {
    position: absolute;
    top: 6px;
    left: -13px;
    display: block;
    width: 25px;
    height: 25px;
    background: #fff;
    content: "";
    border: 5px solid #2e75d6;
    box-sizing: border-box;
    border-radius: 50%;
  }
  .history-wrap > ul > li.right ul {
    text-align: left;
    padding-right: 10px;
    float: left;
    margin-left: 30px;
  }
  .history-wrap > ul > li ul {
    display: inline-block;
    float: right;
    border-radius: 5px;
    padding: 10px 20px;
    border: 1px dotted #d8d8d8;
    background: #f8f8f8;
    margin-top: 5px;
    margin-right: 30px;
  }
  .history-wrap > ul > li ul li {
    position: relative;
    padding-left: 13px;
    padding-right: 5px;
  }
  .history-wrap > ul > li ul li:before {
    position: absolute;
    display: block;
    width: 3px;
    height: 3px;
    border-radius: 5px;
    content: "";
    left: 0;
    background: #2e75d6;
    top: 10px;
  }
  .history-wrap > ul > li span.point {
    text-shadow: 0.5px 0;
    color: #507ab3;
  }
  .history-wrap .history-text-box {
    text-align: center;
    /*background: url(//img/sub/sub/history_bg.jpg) left 250px bottom #fff no-repeat;*/
    background-color: #fff;
    padding: 20px 0 40px 0;
    position: relative;
    border-bottom: 1px solid #e5e5e5;
  }
  .history-wrap .history-text-box p {
    font-size: 22px;
    padding-bottom: 5px;
    color: #2e75d6;
    letter-spacing: -1px;
    font-weight: 500;
    color: #184b90;
  }
  .history-wrap .history-text-box span {
    color: #6b6b6b;
    letter-spacing: -1px;
  }
  .vision-wrap {
    padding: 10px 0;
  }
  .vision-wrap h3 {
    position: relative;
    font-size: 18px;
    font-weight: 500;
    padding-left: 10px;
    margin-top: 60px;
  }
  .vision-wrap h3:before {
    position: absolute;
    top: 6px;
    left: 0;
    display: block;
    width: 4px;
    height: 17px;
    background: #2e75d6;
    content: "";
  }
  .vision-wrap h3.first {
    margin-top: 0;
  }
  .vision-wrap h4 {
    color: #2e75d6;
    display: table-cell;
    float: left;
    width: 250px;
    margin-top: 0;
    vertical-align: top;
    padding-left: 30px;
  }
  .vision-wrap h4:before {
    display: none;
  }
  .vision-wrap h4 .icon {
    width: 35px;
    height: 3px;
    margin-top: 8px;
    display: inline-block;
    font-size: 0;
    vertical-align: top;
    /* border: 4px solid #e2eeff;*/
    box-sizing: border-box;
  }
  .vision-wrap h4 .icon.ic01 {
    background: #3977cc;
  }
  .vision-wrap h4 .icon.ic02 {
    background: #244570;
  }
  .vision-wrap h4 .icon.ic03 {
    background: #d6d6d6;
  }
  .vision-wrap h4 .text {
    padding-left: 20px;
    display: inline-block;
    color: #040404;
    font-size: 19px;
  }
  .vision-wrap ul {
    padding: 30px 0;
  }
  .vision-wrap li {
    display: table;
    overflow: hidden;
    width: 100%;
    padding-top: 20px;
    border-bottom: 1px dotted #ccc;
    padding-bottom: 10px;
  }
  .vision-wrap li p {
    color: #777;
    padding-bottom: 20px;
    display: inline-block;
    padding-left: 40px;
  }
  .vision-wrap li span {
    letter-spacing: -1px;
  }
  .vision-wrap div {
    color: #555;
    padding-top: 15px;
  }
  .vision-wrap h4:first-child {
    margin-top: 0;
    background: none;
  }
  .survey-checkbox {
    padding-top: 50px;
  }
  .survey-checkbox > div {
    margin: 0 auto;
    text-align: center;
  }
  .survey-checkbox .survey-btn {
    display: inline-block;
    background: #4187f5;
    padding: 10px 40px;
    color: #fff;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    font-size: 15px;
  }
  .survey-checkbox .survey-btn i {
    padding-right: 5px;
  }
  .survey-checkbox .survey-btn:hover {
    background: #1168f2;
  }
  .survey-checkbox .survey-close-btn {
    display: inline-block;
    background: #f4f4f4;
    padding: 10px 40px;
    width: 155px;
    box-sizing: border-box;
    color: #777;
    border-radius: 5px;
    cursor: pointer;
    margin: 0 auto;
    font-size: 15px;
  }
  .survey-checkbox .survey-close-btn i {
    padding-right: 5px;
  }
  .survey-checkbox .survey-close-btn:hover {
    background: #dbdbdb;
  }
  .multiple-choice-wrap.survey-wrap li label {
    cursor: pointer;
  }
  .multiple-choice-wrap.survey-wrap li:hover span {
    color: #4187f5 !important;
  }
  .multiple-choice-wrap.survey-wrap input {
    margin-right: 10px;
    margin-top: 5px;
    vertical-align: top;
    display: inline-block;
  }
  .class-exam-wrap.survey-top-wrap .class-exam h3 {
    background: #2c3440;
  }
  .class-exam-wrap.survey-top-wrap
    .class-exam
    .class-exam-paper-con
    .question-wrap
    .question-num {
    background: #2c3440;
  }
  .greeting-text {
    text-align: center;
    line-height: 27px;
    padding-top: 30px;
    font-size: 15px;
    padding-bottom: 80px;
    font-weight: 400;
    color: #000;
  }
  .countdown-wrap {
    display: inline-block;
    position: absolute;
    top: 15px;
    right: 20px;
  }
  .countdown-wrap i {
    color: #2a9e4a;
    display: inline-block;
    padding-right: 10px;
    font-size: 20px;
  }
  .countdown-wrap #countdown {
    display: inline-block;
    color: #fff;
    font-size: 22px;
    font-weight: 100;
    letter-spacing: 2px;
  }
  .support-card-tab-con h3 {
    padding-left: 23px;
    background: url(..//img/sub/sub/sup-tit-bg.jpg) 0 9px no-repeat;
    font-size: 18px;
    font-weight: normal;
    padding-bottom: 5px;
    margin-top: 30px;
    text-shadow: 0.7px 0;
  }
  .support-card-tab-con h4 {
    position: relative;
    color: #176ddc;
    margin: 0;
    font-size: 16px;
    padding-left: 25px;
  }
  .support-card-tab-con h4:before {
    position: absolute;
    left: 10px;
    top: 0;
    display: block;
    padding: 0 5px;
    background: none;
    content: "-";
    color: #176ddc;
  }
  .support-card-tab-con .support-con01 {
    letter-spacing: -1px;
    padding: 15px 20px;
  }
  .support-card-tab-con .support-con02 {
    letter-spacing: -1px;
    padding: 5px 15px 20px 25px;
  }
  .support-card-tab-con .support-ul01 {
    padding: 10px 0;
  }
  .support-card-tab-con .support-ul01 li {
    padding-bottom: 7px;
    padding-top: 7px;
    border-bottom: 1px #ccc dotted;
  }
  .support-card-tab-con .support-ul01 li span {
    display: inline-block;
    color: #396fcf;
    padding-right: 10px;
  }
  
  /* 추가 2019.04.28 JE Kim */
  
  /* 인사말 */
  @import url(https://font.googleapis.com/darlyaccess/nanummyeongjo.css);
  
  .n_greet {
    width: 1200px;
    margin: 30px auto 0px;
  }
  .n_greet li {
    float: left;
  }
  .n_greet li:nth-child(1) {
    width: 300px;
    box-sizing: border-box;
    padding-right: 50px;
    color: #8a8a8a;
    line-height: 1.4;
    font-weight: 600;
  }
  .n_greet li:nth-child(2) {
    width: 900px;
    box-sizing: border-box;
    padding: 5px 0px 10px 70px;
    font-size: 17px;
    line-height: 1.8;
    letter-spacing: 0.8px;
    border-left: 1px solid #cccccc;
  }
  .n_greet h1 {
    color: #123b7e;
    font-size: 26px;
    display: block;
    margin-bottom: 10px;
  }
  .n_greet p {
    text-align: right;
    margin: 40px 0px 0px 0px;
    font-weight: 600;
    letter-spacing: 0px;
  }
  .n_greet span {
    color: #c62b3d;
  }
  
  /* 조직도 */
  .n_call {
    width: 250px;
    height: 40px;
    border-radius: 20px;
    background-color: #f1f1f1;
    box-sizing: border-box;
    text-align: center;
    margin: 50px auto 30px;
    padding-top: 9px;
    letter-spacing: 1px;
  }
  .n_call /img/sub {
    margin-right: 7px;
  }
  .n_call span {
    color: #3872b1;
    margin-right: 7px;
    font-weight: 400;
  }
  
  /* 찾아오시는 길 */
  .n_add {
    width: 1200px;
    margin: 40px auto 30px;
    clear: both;
    display: block;
  }
  .n_add li {
    height: 60px;
    float: left;
    border-bottom: 1px solid #eaeaea;
    padding: 20px 20px 0px 20px;
    box-sizing: border-box;
  }
  .n_add li:nth-child(odd) {
    clear: both;
    width: 20%;
    font-weight: 600;
  }
  .n_add li:nth-child(even) {
    width: 80%;
  }
  .n_add /img/sub {
    margin-right: 15px;
  }
  .n_add span {
    margin: 0px 20px;
  }
  
  /* 연혁 */
  .n_hist {
    width: 1200px;
    margin-top: 50px;
    margin-bottom: 20px;
  }
  .n_hist li {
    float: left;
  }
  .n_hist li:nth-child(1) {
    width: 30%;
    color: #818181;
    line-height: 1.6;
    box-sizing: border-box;
    padding-right: 50px;
    padding-top: 20px;
    letter-spacing: -1px;
  }
  .n_hist li:nth-child(1) > h1 {
    color: #0c5990;
    font-size: 26px;
    font-weight: 600;
    margin-bottom: 5px;
  }
  .n_hist li:nth-child(2) {
    width: 70%;
    box-sizing: border-box;
  }
  .n_hist dl {
    width: 100%;
  }
  .n_hist dt {
    clear: both;
    float: left;
    border-left: 2px solid #dadada;
    padding: 30px 0px;
    margin-right: 50px;
    color: #222;
    font-size: 30px;
    font-weight: 600;
    display: inline-block;
  }
  .n_hist dt span {
    width: 10px;
    height: 10px;
    border: 3px solid #0c5990;
    border-radius: 9px;
    background-color: #fff;
    margin: 0px 50px 0px -9px;
    display: inline-block;
  }
  .n_hist dd {
    float: left;
    background-color: #f2f2f2;
    padding: 0px 20px 2px;
    border: 1px solid #ddd;
    border-radius: 5px;
    display: block;
    margin-top: 25px;
    line-height: 3;
  }
  .n_hist_bg {
    background: url("//img/sub/sub/history_02.png") no-repeat;
    height: 473px;
    display: inline-block;
  }
  
  .history-text-box {
    text-align: center;
    /*background: url(//img/sub/sub/history_bg.jpg) left 250px bottom #fff no-repeat;*/
    background-color: #fff;
    padding: 20px 0 40px 0;
    position: relative;
    border-bottom: 1px solid #e5e5e5;
  }
  .history-text-box p {
    font-size: 22px;
    padding-bottom: 5px;
    color: #2e75d6;
    letter-spacing: -1px;
    font-weight: 500;
    color: #184b90;
  }
  .history-text-box span {
    color: #6b6b6b;
    letter-spacing: -1px;
  }
  .sub-content .s_able {
    margin-top: 30px;
  }
  .sub-content .s_able > h1 {
    font-size: 17px;
    background: #222;
    color: #fff;
    display: inline-block;
    padding: 10px;
    text-align: center;
    width: 223px;
  }
  .sub-content .s_able table {
    margin-bottom: 50px;
  }
  .sub-content .s_able table > thead > tr {
    border-top: 2px solid #222;
    background: #f5f5f5;
  }
  .sub-content .s_able table > thead > tr > th {
    padding: 10px 5px;
    color: #444;
    font-weight: 500;
    border-right: 1px solid #ccc;
  }
  .sub-content .s_able table > thead > tr > th:last-child {
    border-right: none;
  }
  .sub-content .s_able table > tbody > tr > td:last-child {
    border-right: none;
    text-align: center;
  }
  .sub-content .s_able table > tbody > tr > td {
    padding: 10px;
    border-right: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    font-weight: 400;
    color: #444;
  }
  .sub-content .s_able table > tbody > tr > td:nth-child(2n) {
    text-align: center;
  }
  
  .sub-content .s_able .s_stable {
    margin: 0 auto;
    border-top: 1px solid #ccc;
    height: 41px;
  }
  .sub-content .s_able .s_stable > tbody > tr > th {
    background: #f5f5f5;
    border-right: 1px solid #ccc;
    width: 50%;
  }
  .sub-content .s_able .s_stable > tbody > tr > td > span {
    color: #777;
    font-size: 13px;
    font-weight: 500;
    margin-left: 10px;
  }
  .sub-content .s_able .s_stable > tbody > tr > td > span > b {
    text-decoration: line-through;
  }
  .sub-content .s_able .s_stable > tbody > tr > td > em {
    color: #ff4a8a;
    font-weight: 500;
  }
  .sub-content .s_able .s_stable > tbody > tr > td > p {
    text-align: right;
    color: #ff4a8a;
    font-size: 18px;
    font-weight: 800;
  }
  .sub-content .s_able .s_stable > tbody > tr > td > p > b {
    font-weight: 800 !important;
  }
  .sub-content .s_able table > tbody > .s_cash > td {
    border: none;
    background: #3a3e47;
    font-weight: 800;
    text-align: center;
    font-size: 18px;
    color: #fff600;
    width: 50%;
  }
  .sub-content .s_able table > tbody > .s_cash > td:first-child {
    color: #fff;
    font-weight: 500;
  }
  .sub-content .s_able .s_stable > tbody > .s_cash > td:first-child {
    font-weight: 400;
    color: #fff;
  }
  
  .sub_smenu {
    width: 12%;
    float: left;
    margin-right: 1%;
  }
  .sub_smenu > h4 {
    font-size: 25px;
    font-weight: 500;
    margin-top: 67px;
    padding: 10px 0;
    box-sizing: border-box;
  }
  .sub_smenu > ul {
    border-top: 2px solid #888;
  }
  .sub_smenu > ul > li {
    padding: 10px 10px;
    border-bottom: 1px solid #ddd;
  }
  .sub_smenu > ul > li > a {
    color: #555;
    font-size: 15px;
  }
  .sub_smenu > ul > li:hover > a {
    color: #222;
    font-weight: 500;
  }
  
  .s_away {
    margin-top: 59px;
    border-top: 2px solid #888;
    box-sizing: border-box;
    height: 400px;
    padding: 50px 0;
    position: relative;
  }
  .s_away > h5 {
    padding: 20px 0;
    color: #222;
    font-size: 25px;
    padding: 10px 30px;
  }
  .s_away > h5 > span {
    color: #f73f3f;
  }
  .s_away > ul {
    width: 80%;
    display: inline-block;
  }
  .s_away > ul > li {
    list-style: inside;
    margin: 0 0 5px 30px;
    font-size: 15px;
    font-weight: 600;
    padding: 0 30px;
    color: #222;
  }
  .s_away > /img/sub {
    float: right;
    position: absolute;
    top: 50px;
    right: 0;
  }
  .s_away > ul:last-child {
    margin-top: 50px;
  }
  .s_away > ul:last-child > li {
    list-style: none;
    text-align: center;
    margin-bottom: 40px;
  }
  .s_away > ul:last-child > li:first-child > a {
    color: #f73f3f;
    font-size: 35px;
    border-bottom: 2px solid #f73f3f;
    padding: 10px 50px;
  }
  .s_away > ul:last-child > li:last-child > a {
    border: 1px solid #0076b3;
    background: #0076b3;
    color: #fff;
    padding: 10px;
    font-size: 20px;
    border-radius: 5px;
  }
  .sh_wrap {
    width: 1280px;
    margin: 0 auto;
  }
  .sh_bgwrap {
    text-align: center;
    background: #f3f3f3;
  }
  
  .sh_menu {
    position: fixed;
    width: 100%;
    background: #fff;
    z-index: 55;
  }
  .sh_menu .sh_top {
    padding: 20px 0;
    overflow: hidden;
    width: 1280px;
    margin: 0 auto;
  }
  .sh_menu .sh_top .right_btn {
    float: right;
  }
  .lec_bg {
    background: url("//img/sub/sub/lec_bg.jpg") no-repeat center;
    width: 100%;
    height: 102px;
  }
  .lec_bg h1 {
    font: 56px "Cafe24Ohsquare";
    color: #fff;
    text-align: center;
    line-height: 102px;
    font-weight: bolder;
    letter-spacing: -2px;
  }
  #contact {
    background: lightslategrey;
    height: 752px;
    padding: 20px 0 20px 0;
    box-sizing: border-box;
  }
  
  #contact .sub_btn {
    padding: 10px;
    margin: 0 auto;
    width: 250px;
    border: 0px;
    border-radius: 30px;
    background: midnightblue;
    font-size: 30px;
    color: #ffffff;
    text-align: center;
    cursor: pointer;
    display: block;
    font-weight: 500;
  }
  
  #contact .div_box {
    width: 1280px;
    margin: 0 auto;
    padding: 30px;
    margin-bottom: 40px;
    text-align: center;
    vertical-align: top;
    background: #ffffff;
    border: 5px solid #cccccc;
    border-bottom-color: #cccccc;
    border-radius: 0.5em;
    overflow: hidden;
  }
  #contact .ul_box {
    display: inline-block;
    text-align: center;
    width: 100%;
    overflow: hidden;
  }
  #contact .ul_box li {
    height: 55px;
    line-height: 55px;
  }
  #contact .ul_box li:nth-child(1n) {
    width: 20%;
    background-color: #e3e3e3;
    text-align: right;
    border-bottom: 2px solid #fff;
    font-size: 16px;
    color: #333333;
    float: left;
    font-weight: 500;
    padding: 0 20px;
  }
  
  #contact .ul_box li:nth-child(2n) {
    width: 80%;
    background-color: #f3f3f3;
    text-align: left;
    font-size: 14px;
    color: #555555;
    line-height: 30px;
    padding: 10px;
    box-sizing: border-box;
    border-bottom: 2px solid #fff;
  }
  
  #contact .ul_box input {
    padding: 5px;
    height: 30px;
    color: #666666;
    border: 1px solid #cccccc;
    border-bottom-color: #e2e2e2;
    border-radius: 0.5em;
  }
  #contact .lecture_tel {
    width: 70%;
    text-align: left;
    font: bold 30px "맑은 고딕";
    color: #0e529d;
    float: left;
  }
  #contact .lec_agree {
    color: #fff;
    background: midnightblue;
    padding: 5px 10px;
    display: block;
  }
  
  .popUp {
    width: 750px;
    margin: 0 auto;
    background-color: #fff;
    height: 600px;
    border: 3px solid #888;
    border-radius: 10px;
    overflow-x: hidden;
    position: absolute;
    bottom: -460%;
    left: 30%;
    display: none;
  }
  .popUp .landing_tab {
    width: 744px;
    height: 560px;
    overflow-x: hidden;
    border-bottom: 1px solid #cccc;
  }
  
  .popUp .landing_tab > div > .tabs {
    overflow: hidden;
  }
  .popUp .landing_tab > div > .tabs li:first-child {
    background: url("//img/sub/sub/landing_img_05.jpg") no-repeat center 0px;
  }
  .popUp .landing_tab > div > .tabs li:nth-child(2) {
    background: url("//img/sub/sub/landing_img_06.jpg") no-repeat center 0px;
  }
  .popUp .landing_tab > div > .tabs li {
    cursor: pointer;
    height: 50px;
    width: 50%;
    float: left;
  }
  .popUp .landing_tab > div > .tabs > .pointTab {
    height: 50px;
    background-position: 0 -50px !important;
  }
  .popUp .landing_tab > div > .tab_container .tab_content .explain {
    width: 710px;
    margin: auto;
    word-break: keep-all;
  }
  
  .popUp .lec_menu_close {
    position: absolute;
    font-size: 20px;
    bottom: 5px;
    left: 50%;
    cursor: pointer;
    font-size: 13px;
    font-weight: 500;
    background: #333;
    color: #fff;
    padding: 2px 5px;
    border-radius: 5px;
  }
  
  #contact h2 {
    color: #fff;
    text-align: center;
    font-size: 45px;
    padding: 10px;
    letter-spacing: 1;
  }
  #contact h2 span {
    color: #ccc;
    text-align: center;
  }
  
  .meong {
    cursor: pointer;
  }
  .bong {
    cursor: pointer;
  }
  
  /*랜딩페이지*/
  .yn_wrap /img/sub {
    width: 100%;
  }
  .yn_wrap .table_01 {
    margin: 0 auto;
    font-size: 13px;
    text-align: center;
    border-top: 2px solid #000;
    background: #fff;
    height: 300px;
  }
  .yn_wrap .table_01 tr th {
    padding: 10px 0;
    border: 1px solid #ccc;
  }
  .yn_wrap .table_01 tr td {
    padding: 10px 10px;
    border: 1px solid #ccc;
    font-size: 13px;
  }
  .yn_wrap .table_01 tr td:nth-child(2) {
    text-align: left;
  }
  .yn_pass /img/sub {
    width: 100%;
  }
  .yn_table p {
    font-size: 3px;
    padding: 10px;
    font-weight: 600;
    background: #000;
    display: inline-block;
    color: #fff;
    margin-bottom: 10px;
    border-radius: 5px;
  }
  
  .sh_file {
    margin: 0 auto;
    background: #fff;
    position: absolute;
    top: 180px;
    border: 2px solid #ff9800;
    border-radius: 10px;
    overflow: hidden;
    display: none;
    right: 0;
    width: 900px;
  }
  .sh_file table {
    height: 100%;
  }
  .sh_file table th {
    color: #fff;
    background: #ff9800;
    padding: 10px;
    border-right: 1px solid #888;
    font-size: 18px;
  }
  .sh_file table th:last-child {
    border: none;
  }
  .sh_file table td {
    font-size: 17px;
    padding: 10px;
    line-height: 1.6em;
    border-right: 1px solid #888;
    letter-spacing: -0.8px;
  }
  .sh_file table td:last-child {
    border: none;
  }
  
  .sh_file02 {
    margin: 0 auto;
    background: #fff;
    position: absolute;
    top: 800px;
    border: 2px solid #ff9800;
    border-radius: 10px;
    overflow: hidden;
    display: none;
    width: 70%;
    height: 200px;
    left: 0;
    width: 900px;
  }
  .sh_file02 table {
    height: 100%;
  }
  .sh_file02 table th {
    color: #fff;
    background: #ff9800;
    padding: 10px;
    font-size: 18px;
    width: 100%;
  }
  .sh_file02 table td {
    font-size: 17px;
    padding: 10px;
    line-height: 1.6em;
    width: 100%;
    letter-spacing: -0.8px;
  }
  .yn_click {
    position: relative;
  }
  .close {
    position: absolute;
    top: -5px;
    color: #fff;
    right: 5px;
    font-size: 30px;
    font-weight: 600;
    cursor: pointer;
  }
  .close:hover {
    color: #000;
  }
  .box_sucname {
    display: block;
    position: relative;
    width: 85%;
    height: 700px;
    overflow: hidden;
    margin: 0 auto;
    position: relative;
    background: transparent;
    border: none;
    border: 2px solid #460c4d;
  }
  .sucname_list {
    width: 100%;
    display: block;
    float: left;
    animation: slidein 40s infinite;
    position: absolute;
    left: 0;
    top: 0;
    animation-timing-function: linear;
    background: #ffff;
  }
  .sucname_list > ul {
    padding: 0;
    margin: 0;
    float: left;
    width: 33.33%;
    overflow: hidden;
  }
  .sucname_list > ul li {
    display: block;
    padding: 0;
    margin: 0;
    width: 100%;
    text-align: center;
    box-sizing: border-box;
    -moz-box-sizing: border-box;
    line-height: 60px;
    font-size: 14px;
    color: #383642;
    height: 60px;
    font-weight: 500;
  }
  .box_sucname02 {
    display: block;
    position: relative;
    width: 400px;
    height: 500px;
    overflow: hidden;
    margin: 0 auto 20px auto;
    position: relative;
  }
  .box_sucname02 .sucname_list > ul {
    width: 33%;
  }
  .box_sucname_position {
    position: relative;
    padding: 50px 0;
    background: #ffffb0;
  }
  .img09_img {
    position: absolute;
    top: 27%;
    left: 21%;
    z-index: 1;
  }
  @keyframes slidein {
    0% {
      top: 0px;
    }
    100% {
      top: -1400px;
    }
  }
  #quick_counsel2,
  #quick_counsel1 {
    background: #fff;
  }
  /*랜딩페이지 End*/
  
  /*빠른상담*/
  .pc_bg {
    background: #8012a1;
    padding: 20px 10px;
    box-sizing: border-box;
    height: 800px;
    display: flex;
    flex-direction: column;
  }
  .sh_mran {
    width: 65%;
    border: 5px solid #ffa5b2;
    border-radius: 10px;
    margin: auto;
  }
  .sh_mran .point {
    color: red;
  }
  
  .sh_mran_bx {
    display: flex;
    padding: 0 10px;
    box-sizing: border-box;
    flex-direction: column;
  }
  .sh_mran_bx li {
    justify-content: center;
    padding: 20px 0;
    text-align: left;
    box-sizing: border-box;
    border-bottom: 2px solid #ccc;
  }
  .sh_mran_bx li b {
    width: 80px;
    display: inline-block;
    font-size: 20px;
  }
  .sh_mran_bx li input,
  .sh_mran_bx li select {
    border: 1px solid #888;
    font-size: 20px;
    width: 80px;
    text-align: center;
  }
  .sh_mran_bx li .sh_phone {
    width: 18%;
  }
  .sh_mran_bx li .li_same {
    width: calc(100% / 2 - 85px);
  }
  .email_bx {
    width: 90px;
  }
  .sh_mran_bx li:first-child select {
    width: 140px;
  }
  
  .sh_mran_bx li textarea {
    resize: none;
    width: 88%;
    height: 150px;
    border-radius: 10px;
  }
  .sh_mran_bx li a {
    background: #ffa5b2;
    display: block;
    height: 100%;
    color: #fff;
    text-align: center;
    line-height: 150px;
    font-size: 25px;
    border-radius: 10px;
  }
  .sh_mran_bx .area_b {
    vertical-align: top;
    font-size: 20px;
    width: 105px;
    margin-right: -2%;
    color: #ffa5b2;
  }
  .y_con {
    text-align: center;
    color: #fff;
    font-size: 55px;
  }
  /*빠른상담 E*/
  
  /* 나의 강의실 평가 ui 추가_20230531 */
  .test_sub_table {
    box-sizing: border-box;
    margin: 10px 0px;
    border-bottom: 1px solid #cbd2dc;
    border-top: 1px solid #cbd2dc;
  }
  .test_sub_table tr.head {
    background: #eff3f7;
    font-size: 14px;
    border-bottom: 1px solid #ddd;
    border-top: 1px solid #ddd;
    font-weight: bold;
  }
  .test_sub_table tr.head th {
    box-sizing: border-box;
    padding: 5px;
    font-weight: normal;
    border-right: 1px solid #ddd;
    color: #5087b5;
  }
  .test_sub_table .test_name {
    font-size: 18px;
    border: 1px solid #ddd;
  }
  .test_sub_table tr.content {
    border-top: 1px solid #ddd;
  }
  .test_sub_table tr.content td {
    box-sizing: border-box;
    padding: 5px;
    border-right: 1px solid #ddd;
    font-size: 14px;
  }
  .test_sub_table tr.space {
    background: #fff;
    height: 20px;
    border: 0px;
  }
  .test_sub_table tr.content td .score-wrap {
    display: block;
  }
  .test_sub_table tr.content td .exam-take-day {
    font-size: 14px;
  }
  
  
  
  /* 20230714 기업교육문의 추가 */
  .css_p .searchBtn{ margin:0px; margin-left:-5px;}
  .css_p .searchBtn i{color:#fff; padding-right:0px;}
  .css_p .searchBox{display:inline-block;}
  .css_p .cmt{ display:inline-block; margin-left:10px; font-size:12px; }
  .css_p textarea{width:100%; resize:none; height:150px; box-sizing:border-box; padding:10px;}
  .css_p input[type='radio']{margin-top:-2px; vertical-align:middle;}
  .css_p input[type='checkbox']{margin-top:0px; vertical-align:middle;}
  .css_p .more{font-size:13px; text-decoration:underline; color:#999; margin-left:5px;}
  .css_p .more:hover{color:#1d1d1d;}



/* greeating new */
.sub_tit_h3 {font-size: 20px; font-weight: 600;}
.business_rule .sub_tit_h3::before {content: ""; display: inline-block; background: #2e75d6; width: 3px; height: 15px; margin-right: 10px;}
.sub_tit_h4 {font-size: 18px; font-weight: 500; text-align: left; position: static; text-shadow: none; padding-left: 0!important; letter-spacing: normal!important;}
.sub_tit_h4::before {background: none!important;}
.txtover {background: url(/img/sub/bg_pattern.gif) repeat; width: 100%; height: 200px; position: relative; z-index: 1; display: flex; align-items: center;}
.txtover::before {content: "";; display: inline-block; background: #fff; width: calc(100% - 20px); height: calc(100% - 20px); position: absolute; left: 10px; top: 10px; z-index: -1;}
.txtover p {margin: 0 auto; font-size: 16px;}

/* 콘텐츠 */
#conbox {color: #333!important;  border-top: 1px solid #ccc;}
.con2 {display: none;}
.con3 {display: none;}
.con4 {display: none;}
#conbox .content {height: 2000px;}
#conbox .intro .intro_tit {display: flex; justify-content: space-between;border-bottom: 1px solid #ccc; padding-bottom: 10px; align-items: center;}
#conbox .intro .intro_tit h2 {font-size: 30px; font-weight: 500;}
#conbox .intro .intro_tit ul {display: flex; margin: 5px 0 0 5px;}
#conbox .intro .intro_tit ul > li::before {content: ">"; display: inline-block; color: #acacac; font-size: 10px; margin: 0 5px 0 9px;}
#conbox .intro .intro_tit ul > li:first-child:before {display: none;}         
#conbox .intro .intro_tit ul > li a {font-size: 14px;}
#conbox .intro .intro_txt {margin-top: 20px; background: #f8f8f8; height: 248px; display: flex; align-items: center; justify-content: center;}
#conbox .intro .intro_txt .intro_txt_inner h3 {font-size: 29px;}
#conbox .intro .intro_txt .intro_txt_inner h3::before {content: ""; display: inline-block; background: #333; width: 2px; height: 54px; position: relative; top: 15px; margin-right: 10px;}
#conbox .intro .intro_txt .intro_txt_inner h3::after {content: ""; display: inline-block; background: #333; width: 2px; height: 54px; position: relative; top: 15px; margin-left: 10px;}
#conbox .intro .intro_txt .intro_txt_inner p {font-size: 18px; font-weight: 600; margin-top: 40px; text-align: center;}

/* 경영원칙 */
.business_rule {margin-top: 70px;}
.business_rule .rule_intro {margin-top: 20px;}
.business_rule .rule_intro p {font-size: 18px;}
.business_rule .rulebox .rule {margin: 50px 0; display: flex; background: #f6faff; }
.business_rule .rulebox .rule .img_box1 {background: url(/img/sub/rule_img1.png)no-repeat 0 0; width: 398px; height: 200px;}
.business_rule .rulebox .rule .img_box2 {background: url(/img/sub/rule_img2.png)no-repeat 0 0; width: 398px; height: 200px;}
.business_rule .rulebox .rule .img_box3 {background: url(/img/sub/rule_img3.png)no-repeat 0 0; width: 398px; height: 200px;}
.business_rule .rulebox .rule .rule_txt {margin: auto 30px;}
.business_rule .rulebox .rule .rule_txt p {font-size: 16px; color: #666; margin-top: 30px; word-spacing: -2px;}

/* 훈련기관 비전 */
.visionbox {margin: 70px 0 50px 0;}
.visionbox .vision_con {display: flex; margin-top: 20px; width: 100%; height: 608px;}
.visionbox .vision_con .img_box {background: url(/img/sub/vision_img.png)no-repeat 0 0; width: 45%; height: 608px;}
.visionbox .vision_con .vision_txtbox {width: 55%;}
.visionbox .vision_con .vision_txtbox ul {position: relative; transform: translateY(-50%); top: 50%;}
.visionbox .vision_con .vision_txtbox ul li {display: flex; align-items: center; margin-bottom: 50px;}
.visionbox .vision_con .vision_txtbox ul li .icon {width: 58px; height: 72px; margin: 0 30px 0 50px;}
.visionbox .vision_con .vision_txtbox ul li .icon1 {background: url(/img/sub/icon1.png)no-repeat 0 0; }
.visionbox .vision_con .vision_txtbox ul li .icon2 {background: url(/img/sub/icon2.png)no-repeat 0 0; }
.visionbox .vision_con .vision_txtbox ul li .icon3 {background: url(/img/sub/icon3.png)no-repeat 0 0; }
.visionbox .vision_con .vision_txtbox ul li .icon4 {background: url(/img/sub/icon4.png)no-repeat 0 0; }
.visionbox .vision_con .vision_txtbox ul li .icon5 {background: url(/img/sub/icon5.png)no-repeat 0 0; }
.visionbox .vision_con .vision_txtbox ul li .vision_txt p {word-spacing: -3px; font-size: 16px;}


/* 과정 페이지 수정 */
/* 영상 버튼 추가 */
.newlectview .class-view-detail-wrap div .class-img .class-ask-btn_02 {flex-direction:column;}
.newlectview .class-view-detail-wrap div .class-img .class-ask-btn_02 li {width:100%; height:auto; border:none; background:none;}
.newlectview .class-view-detail-wrap div .class-img .class-ask-btn_02 li:hover {border:none; background:none;}
.newlectview .class-view-detail-wrap div .class-img .class-ask-btn_02 li a {padding:8px; display:flex; align-items:end; justify-content:center; font-size:14px; background:#4d687b; color:#fff;}
.newlectview .class-view-detail-wrap div .class-img .class-ask-btn_02 li:hover a {background:#2b3f54; color:#fff;}
.newlectview .class-view-detail-wrap div .class-img .class-ask-btn_02 li a img {width:22px; background:none;}
/* 주의사항 */
.newlectview  .class-view-detail-wrap div .class-con dl.class-date-box {display:flex; align-items:start;}
.newlectview  .class-view-detail-wrap div .class-con dl dd.class-caution-box {margin-left:auto; padding:8px 16px; background:#f7f7f7; border:2px solid #FF0000; border-radius:10px; text-align:center;}
.newlectview  .class-view-detail-wrap div .class-con dl dd.class-caution-box p {font-size:14px; font-weight:600;}
.newlectview  .class-view-detail-wrap div .class-con dl dd.class-caution-box p span {color:#FF0000;}
/* 교육비 추가 */
.newlectview  .class-view-detail-wrap div .class-con dl.class-pay-box {display:flex; flex-flow:row wrap;}
.newlectview  .class-view-detail-wrap div .class-con dl dd.class-pay-list {display:flex; align-items: start; margin:0; width:calc(100% - 80px)}
.newlectview  .class-view-detail-wrap div .class-con dl dd.class-pay-list .price_type {display:inline-block; width:85px;}
.newlectview  .class-view-detail-wrap div .class-con dl dd.class-pay-list .class-period li span.day {display:inline-block; vertical-align:text-top;}
.newlectview  .class-view-detail-wrap div .class-con dl dd.class-pay-list .class-pop-btn {margin-left:auto; padding:20px 30px; background:#999; color:#fff; border-radius:8px; font-size:16px; font-weight:600; text-align:center; cursor:pointer;}
.newlectview  .class-view-detail-wrap div .class-con dl dd.class-pay-list .class-pop-btn:hover {background:#666;}
/* 교육비 최종금액 */
.newlectview .class-view-detail-wrap div .class-con dl dd.class-pay-all {flex:1; margin-top:10px; padding:10px; width:100%; display:flex; align-items:center; gap:8px; background:#f5f5f5; box-sizing:border-box;}
.newlectview .class-view-detail-wrap div .class-con dl dd.class-pay-all .tit {padding:2px 5px; color:#fff; background:#666; border-radius:3px;}
.newlectview .class-view-detail-wrap div .class-con dl dd.class-pay-all .con {margin-right:15px; font-weight:600; color:#666;}
.newlectview .class-view-detail-wrap div .class-con dl dd.class-pay-all .tit.red {padding:2px 5px; font-weight:600; color:#fff; background:#ff0000; border-radius:3px;}
.newlectview .class-view-detail-wrap div .class-con dl dd.class-pay-all .con.red {font-weight:600; color:#ff0000;}
/* 모달 팝업 */
.modal {position:fixed; inset:0; z-index:9999; display:none;}
.modal.is-open {display:block;}
.modal__dim {position:absolute; inset:0; background:rgba(0,0,0,0.55);}
.modal__panel {position:absolute; left:50%; top:50%; width:480px; transform:translate(-50%,-50%); background:#fff; border-radius:16px; 
						box-shadow:0 10px 30px rgba(0,0,0,0.25); padding:40px; box-sizing:border-box; display:flex; flex-direction:column;}
.modal__close {position:absolute; right:12px; top:10px; width:36px; height:36px; border:0; background:transparent; font-size:26px; line-height:1; cursor:pointer;}
.modal__title {margin:0 0 12px; font-size:18px;}
.modal__body {flex:1; overflow:auto;}
/* 훈련과정 팝업 내용 별도 */
.class-pop .modal__body {display:flex; flex-direction:column; align-items:center; text-align:center; gap:20px;}
.class-pop .modal__body select {width:100%; font-size:16px; height:40px; line-height:40px; cursor:pointer;}
.class-pop .modal__body button {padding:10px 24px; font-size:16px; border-radius:1000px; background:#1B6FC3; color:#fff; cursor:pointer;}
/* 회원특전 영상 */
.class-tab-contents .tab-subtit-mov {margin-left:8px; padding:4px 6px; display:inline-flex; align-items:start; gap:4px; background:#21a4ea; border-radius:4px;}
.class-tab-contents .tab-subtit-mov:hover {background:#1b6fc3;}
.class-tab-contents .tab-subtit-mov span {font-size:16px; font-weight:300; line-height:1; color:#fff;}
.class-tab-contents > div .tab-subtit-mov img {max-width:18px; max-height:18px;}



/* 학습자 pc 등록 */
.mac-pc-regist .mac-pc-img {width:55px; height:auto;}
.mac-pc-regist .mac-add {background:#f9f9f9;}
.mac-pc-regist .mac-add span {color:#2b8ae6;}
.mac-pc-agree {margin-top:40px; position:relative; width:100%; oveflow:hidden; box-sizing:border-box;}
.mac-pc-agree h6 {margin-bottom:8px; font-size:21px; color:#2b8ae6;}
.mac-pc-agree .mac-pc-agree-info {text-align:center;}
.mac-pc-agree .mac-pc-agree-info p {margin:20px 0;}
.mac-pc-agree .mac-pc-agree-info label {margin:0 auto; display:block; width:300px; color:#2b8ae6; cursor:pointer;}
.mac-pc-agree #btn_submit {margin-top:40px; padding:12px 60px; font-size:15px; color:#fff; background:#454d63;}
.mac-pc-agree #btn_submit:hover {background:#303645;}