@charset "utf-8";

/* CSS Document */

table,
td,
th {
    border-collapse: collapse;
    border-bottom: 1px solid #DFE4EC;
}

.lessonLst_tbl,
.workLst_tbl,
.curriLst_tbl {
    font-size: 14px;
    margin-bottom: 20px;
}

.lessonLst_tbl thead tr {
    background: var(--linear, linear-gradient(91deg, #5B88D1 0%, #60B8EF 98.37%));
    color: #ffffff;
}

.lessonLst_inner_headertext {
    font-weight: bold;
    margin: 0 auto;
    font-size: 20px;
}

.lessonLst_inner_headertext span {
    font-weight: lighter;
    font-size: 14px;
    margin-left: 20px;
}

.workLst_tbl thead tr {
    background: linear-gradient(90deg, #547ACF 0%, #60BB7B 0.01%, #5EB769 0.02%, #61C08F 0.03%, #69D5E8 99.99%, #F8FC94 100%);
    color: #ffffff;
}

.curriLst_tbl thead tr {
    background: linear-gradient(90deg, rgba(105, 213, 232, 1) 0%, rgba(96, 184, 239, 1) 100%);
    color: #ffffff;
}

.lessonLst_tbl,
.workLst_tbl,
.curriLst_tbl tbody tr {
    background-color: #ffffff;
}

.col_tangenType {
    display: flex;
    background-color: #ffffff;
    width: 70px;
    border: solid 1px;
    border-radius: 20px;
    margin: auto;
}

.col_tangenType p {
    margin: auto;
    font-size: 12px;
    font-weight: 600;
}

.col_tangenType.exploration {
    color: #5B88D1;
}

.col_tangenType.career {
    color: #E36079;
}

.col_tangenType.thinking {
    color: #21AA85;
}


.tbl_center {
    text-align: center;
}

.tbl_text {
    text-align: left;
    padding: 5px 10px;
    color: #3A414D;
}

.tbl_icon,
.tbl_icon2,
.tbl_icon_del {
    text-align: center;
}

.tbl_icon a img {
    width: 23%;
}

.tbl_icon2 a img {
    width: 20%;
}

.tbl_icon_del a img {
    width: 25%;
}

.tbl_te_saport {
    display: flex;
    align-items: center;
}

.tbl_te_saport p {
    width: 33%;
}

.tbl_te_saport p a {
    color: #5B88D1;
    font-size: 12px;
}

.tbl_te_saport p a:hover {
    text-decoration: underline;
}

.g-calendar {
    margin: 0 12px;
    border: 1px solid #e7eeec;
    height: 40px;
    border-radius: 10px;
    border: 1px solid #e7eeec;
    padding: 10px 24px 11px;
    color: #999999;
    font-size: 14px;
    font-weight: bold;
    line-height: 22.4px;
}

.clsSelArea-input {
    display: flex;
    background: #FFFFFF80;
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 20px;
}

.clsSelArea {
    background: #FFFFFF80;
    padding: 10px;
    border-radius: 6px;
    margin-bottom: 20px;
}

.clsSelArea-center {
    background: #FFFFFF80;
    padding: 30px;
    border-radius: 6px;
    margin-bottom: 20px;
    display: flex;
    justify-content: center;
    width: 70%;
    margin: 0 auto;
}

.clsSelArea-line {
    display: flex;
    vertical-align: middle;
    padding: 10px;
}

.g-radio-btn__block--col-2 {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px;
    margin: auto 0 auto 12px;
}

.g-radio-btn__block {
    display: flex;
    position: relative;
}

.g-search-btn {
    background: linear-gradient(90deg, #5B88D1 0%, #60B8EF 100%);
    color: #ffffff;
    position: relative;
    border-radius: 30px;
    text-align: center;
    box-shadow: 0 4px #BFC7D34D;
    width: 165px;
    height: 45px;
    margin: 0 20px 0 auto;
    padding: 10px 0px;
    font-weight: bold;
    font-size: 16px;
    border: 0;
    cursor: pointer;
}

.g-addTangen-btn {
    background: linear-gradient(90deg, #5B88D1 0%, #60B8EF 100%);
    color: #ffffff;
    position: relative;
    border-radius: 30px;
    text-align: center;
    box-shadow: 0 4px #BFC7D34D;
    width: 305px;
    margin: 0 20px 0 auto;
    padding: 10px 0px;
    font-weight: bold;
    font-size: 16px;
    border: 0;
    cursor: pointer;
}

.g-fixTangen-btn {
    background: linear-gradient(273deg, rgba(255, 242, 122, 0.40) 0%, rgba(255, 242, 122, 0.00) 52.15%), #F6A506;
    color: #ffffff;
    position: relative;
    border-radius: 30px;
    text-align: center;
    box-shadow: 0 4px #BFC7D34D;
    width: 305px;
    margin: 0 0 0 auto;
    padding: 10px 0px;
    font-weight: bold;
    font-size: 16px;
    border: 0;
    cursor: pointer;
}

.g-lessenMove {
    text-align: center;
}

.g-lessenMove a:hover {
    text-decoration: underline;
}

.triangleD-Area {
    width: 90px;
    margin: 0 auto;
}

.triangleD {
    background: linear-gradient(90deg, rgba(105, 213, 232, 1) 0%, rgba(96, 184, 239, 1) 100%);
    height: 20px;
    clip-path: polygon(100% 0, 50% 100%, 0 0%);
}

.curriculum-setting {
    display: flex;
}

.curriculum-settingbutton {
    display: flex;
    flex-flow: column;
}

.curriculum-settingbutton button {
    background: linear-gradient(90deg, rgba(105, 213, 232, 1) 0%, rgba(96, 184, 239, 1) 100%);
    color: #ffffff;
    position: relative;
    border-radius: 5px 0 0 5px;
    text-align: center;
    box-shadow: 0 4px #BFC7D34D;
    width: 165px;
    margin: 0 0 2px auto;
    padding: 10px 0px;
    font-weight: bold;
    font-size: 14px;
    border: 0;
    cursor: pointer;
}

.curriculum-setting-buttonOff {
    color: #585858 !important;
    background: #D9D9D9 !important;
}

.curriculum-settingArea {
    border-radius: 0 5px 5px 0;
    width: 100%;
    padding: 10px;
    border: solid;
    border-image: linear-gradient(90deg, rgba(96, 184, 239, 1) 0%, #60B8EF 100%);
    border-image-slice: 1;
}

.curriculum-settingLine {
    display: flex;
    align-items: center;
}

.curriculum-checkIcon {
    margin-left: 10px;
    margin-right: 50px;
}

.curriculum-confirm {
    background-color: #0080C820 !important;
}

.curriculum-confirm-word {
    font-size: 10px;
    font-weight: 600;
    color: #5B88D1;
}

.curriculum-gaide {
    margin-left: auto;
    font-size: 12px;
}

.curriculum-gaide:hover {
    text-decoration: underline;
}

.tablesorter th {
    position: relative;
    cursor: pointer;
    text-align: center;
    padding-left: 5px;
    font-weight: lighter;
}

.tablesorter th::before,
.tablesorter th::after {
    content: '';
    position: absolute;
    z-index: 2;
    right: 7px;
    width: 0;
    height: 0;
    border: 4px dashed;
    border-color: #fff transparent;
    pointer-events: none;
}

.tablesorter th::before {
    border-bottom-style: solid;
    border-top: none;
    top: 30%;
}

.tablesorter th::after {
    border-top-style: solid;
    border-bottom: none;
    bottom: 30%;
}

.tablesorter th.tablesorter-headerAsc:after {
    border: none;
}

.tablesorter th.tablesorter-headerAsc:before {
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}

.tablesorter th.tablesorter-headerDesc:before {
    border: none;
}

.tablesorter th.tablesorter-headerDesc:after {
    top: 50%;
    transform: translateY(-50%);
    -webkit-transform: translateY(-50%);
}

.tablesorter th.sorter-false:before,
.tablesorter th.sorter-false:after {
    border: none;
}

.workTitle {
    background-color: fff;
    margin: 0px 10px 15px 0;
    padding: 5px 15px;
    display: inline-block;
    border-left: solid 5px  rgb(98, 195, 158);

}

.workTitle2 {
    margin-bottom: 10px;
    padding: 5px 15px;
    display: inline-block;
}

.workTitle_arrow::before {
    content: url(../img/share/circle-chevron-right-solid.svg);
    display: inline-block;
    width: 15px;
    height: 15px;
    margin: 5px 10px;

}

.workTitle_point {
    background: rgb(98, 195, 158);
    display: inline-block;
    padding: 2px 15px;
    border-radius: 15px;
    color: fff;
    margin-right: 15px;
}