@charset "utf-8";.tableContainer {
    position: relative;
    margin: 0 auto;
    font-family: NotoM;
    box-sizing: border-box
}

.tableContainer table {
    font-size: inherit;
    table-layout: auto;
    border-collapse: separate
}

.tableContainer.fix table {
    table-layout: fixed
}

.tableContainer.collapse table {
    border-collapse: collapse
}

.tableContainer table td,
.tableContainer table th {
    text-align: center;
    padding: 2px 4px 4px;
    font-size:45px;
}

.tableContainer table tr:first-of-type>:first-child {
    border-radius: 10px 0 0 0
}

.tableContainer table tr:first-of-type>:last-child {
    border-radius: 0 10px 0 0
}

.tableContainer table tr:last-of-type>:first-child {
    border-radius: 0 0 0 10px
}

.tableContainer table tr:last-of-type>:last-child {
    border-radius: 0 0 10px 0
}

.tableContainer table td>img {
    vertical-align: top
}


.tableContainer table td { text-align: left; }
.contentsBox td h2 { font-size: 45px; margin-bottom: 0; text-align: left; }

.tableContainer table td.orange { background-color: #ffdfb9; }

/*브라운*/
.tableContainer.brown table th {
    color: #333;
    background-color: #c7a08c
}

.tableContainer.brown table tr:first-of-type th:not(:last-of-type) {
    border-right: 2px solid #efe8e0
}

.tableContainer.brown table tr th:first-child,.tableContainer.brown table tr th:not(:last-of-type) {
    border-right: 2px solid #efe8e0
}

.tableContainer.brown table tr:not(:last-of-type) th {
    border-bottom: 2px solid #efe8e0
}

.tableContainer.brown table tr td {
    background-color: #fffbf5;
    border-right: 2px solid #efe8e0;
    border-bottom: 2px solid #efe8e0
}

.tableContainer.brown table tr:first-of-type td {
    border-top: 2px solid #efe8e0
}

.tableContainer.brown table tr td:first-child {
    border-left: 2px solid #efe8e0
}

.tableContainer.brown table th.lightBrown {
    background-color: #ddc9b1
}

/*그린*/
.tableContainer.green table tr th {
    background-color: #93bfb2
}

.tableContainer.green table tr th:first-child,.tableContainer.green table tr th:not(:last-of-type) {
    border-right: 2px solid #fff
}

.tableContainer.green table tr:not(:last-of-type) th {
    border-bottom: 2px solid #fff
}

.tableContainer.green table tr:first-of-type th:not(:last-of-type) {
    border-right: 2px solid #fff
}

.tableContainer.green table tr td {
    border-bottom: 2px solid #93bfb2;
    border-right: 2px solid #93bfb2;
    background-color: #fff
}

.tableContainer.green table tr:first-of-type td {
    border-top: 2px solid #93bfb2
}

.tableContainer.green table tr td:first-child {
    border-left: 2px solid #93bfb2
}

.tableContainer.green table th.lightGreen {
    background-color: #ccded8
}




.tableContainer.noBorder table,.tableContainer.noBorder table th,.tableContainer.noBorder table td {
    border: 0;
    background-color: transparent
}

.tableContainer tr.blackLine {
    border-top: 2px solid #000
}

.tableContainer.thRound table tr:first-of-type th {
    border-right: 0;
    border-radius: 10px 10px 0 0
}

.tableContainer.bothRound table tr:first-of-type>* {
    border-radius: 10px 10px 0 0
}

.tableContainer.bothRound table tr:last-of-type>* {
    border-radius: 0 0 10px 10px
}

.tableContainer.bothRound.brown table tr th:first-child,.tableContainer.bothRound.brown table tr th:not(:last-of-type),.tableContainer.bothRound.green table tr th:first-child,.tableContainer.bothRound.green table tr th:not(:last-of-type) {
    border-right: 0
}

.tableContainer caption {
    display: table-caption;
    margin: 0 0 10px 0
}

.tableContainer.center table tr td,.tableContainer td.center {
    text-align: center
}

.tableContainer.justify table tr td,.tableContainer td.justify {
    text-align: justify
}

.tableContainer.left table tr td,.tableContainer td.left {
    text-align: left
}

.tableContainer.center .toggle .answer {
    text-align: center
}

.tableContainer.justify .toggle .answer {
    text-align: justify
}

.tableContainer.left .toggle .answer {
    text-align: left
}

.tableContainer .crossLine {
    position: relative
}

.tableContainer .crossLine span {
    position: absolute;
    font-size: .5em;
    letter-spacing: -2px
}

.tableContainer.brown .crossLine.top {
    background-image: linear-gradient(to top right,#c7a08c 49%,#efe8e0,#c7a08c 51%)
}

.tableContainer.brown .crossLine.bottom {
    background-image: linear-gradient(to bottom right,#c7a08c 49%,#efe8e0,#c7a08c 51%)
}

.tableContainer.green .crossLine.top {
    background-image: linear-gradient(to top right,#93bfb2 49%,#fff,#93bfb2 51%)
}

.tableContainer.green .crossLine.bottom {
    background-image: linear-gradient(to bottom right,#93bfb2 49%,#fff,#93bfb2 51%)
}

.popup_pages .scroll_container .tableContainer {
    margin: inherit
}

.tableContainer[data-self-check] table tr th {
    text-align: justify
}

.tableContainer .answer {font-weight:bold;font-size:38px}



.tableContainer.orange table th {
    color: #A67058;
    background-color: #ffdfb9
}
.tableContainer.orange table th.pink {
    color: #B4647C;
    background-color: #ffd9e5
}
.tableContainer.orange table th.purple {
    color: #7e6a8b;
    background-color: #e8d5f7
}
.tableContainer.orange table th.green {
    color: #6C8540;
    background-color: #eaf0b6
}
.tableContainer.orange table tr:first-of-type th:not(:last-of-type) {
    border-right: 2px solid #f8ece0
}
.tableContainer.orange table tr th:first-child,.tableContainer.orange table tr th:not(:last-of-type) {
    border-right: 2px solid #f8ece0
}
.tableContainer.orange table tr:not(:last-of-type) th {
    border-bottom: 2px solid #f8ece0
}


.tableContainer.orange table tr td {
    background-color: #fff;
    border-right: 2px solid #f8ece0;
    border-bottom: 2px solid #f8ece0
}
.tableContainer.orange table tr:first-of-type td {
    border-top: 2px solid #f8ece0
}
.tableContainer.orange table tr td:first-child {
    border-left: 2px solid #f8ece0
}
.tableContainer.orange table th.lightorange {
    background-color: #ffdfb9
}



.tableContainer.pink table th {
    color: #b05d76;
    background-color: #ffd9e5;
}
.tableContainer.pink table tr:first-of-type th:not(:last-of-type) {
    border-right: 2px solid #f0d1da
}
.tableContainer.pink table tr th:first-child,.tableContainer.pink table tr th:not(:last-of-type) {
    border-right: 2px solid #f0d1da
}
.tableContainer.pink table tr:not(:last-of-type) th {
    border-bottom: 2px solid #f0d1da
}
.tableContainer.pink table tr td {
    background-color: #fff;
    border-right: 2px solid #f0d1da;
    border-bottom: 2px solid #f0d1da
}
.tableContainer.pink table tr:first-of-type td {
    border-top: 2px solid #f0d1da
}
.tableContainer.pink table tr td:first-child {
    border-left: 2px solid #f0d1da
}



.tableContainer.lightgreen table th {
    color: #79904c;
    background-color: #e9efb3;
}
.tableContainer.lightgreen table tr:first-of-type th:not(:last-of-type) {
    border-right: 2px solid #e1e6b7
}
.tableContainer.lightgreen table tr th:first-child,.tableContainer.lightgreen table tr th:not(:last-of-type) {
    border-right: 2px solid #e1e6b7
}
.tableContainer.lightgreen table tr:not(:last-of-type) th {
    border-bottom: 2px solid #e1e6b7
}
.tableContainer.lightgreen table tr td {
    background-color: #fff;
    border-right: 2px solid #e1e6b7;
    border-bottom: 2px solid #e1e6b7
}
.tableContainer.lightgreen table tr:first-of-type td {
    border-top: 2px solid #e1e6b7
}
.tableContainer.lightgreen table tr td:first-child {
    border-left: 2px solid #e1e6b7
}


.tableContainer.purple2 table th {
    color: #8b739c;
    background-color: #e8d5f7;
}
.tableContainer.purple2 table tr:first-of-type th:not(:last-of-type) {
    border-right: 2px solid #deccec
}
.tableContainer.purple2 table tr th:first-child,.tableContainer.purple2 table tr th:not(:last-of-type) {
    border-right: 2px solid #deccec
}
.tableContainer.purple2 table tr:not(:last-of-type) th {
    border-bottom: 2px solid #deccec
}
.tableContainer.purple2 table tr td {
    background-color: #fff;
    border-right: 2px solid #deccec;
    border-bottom: 2px solid #deccec
}
.tableContainer.purple2 table tr:first-of-type td {
    border-top: 2px solid #deccec
}
.tableContainer.purple2 table tr td:first-child {
    border-left: 2px solid #deccec
}


/*세로표td*/
.table-box.column table td:nth-child(1) { text-align: center; font-family: NotoB; }
.table-box.column.orange table td:nth-child(1) { color: #A67058; background-color: #ffdfb9; }
.table-box.column.pink table td:nth-child(1) { color: #B4647C; background-color: #ffd9e5; }
.table-box.column.purple table td:nth-child(1) { color: #8b739c; background-color: #e8d5f7; }
.table-box.column.lightgreen table td:nth-child(1) { color: #79904c; background-color: #e9efb3; }


.table-box {
    position: relative;
    width: 100%;
    margin: 0 auto;
    border-radius: 20px;
    overflow: hidden;
    font-family: NotoM;
    font-size: 45px;
}
.table-box:before {
    content:'';
    position:absolute;
    top:0;
    right:0;
    bottom:0;
    left:0;
    border-radius:20px;
    pointer-events: none;
}
/*핑크*/
.table-box.color-01:before {
    border: 3px solid #e0c7ce;
}
.table-box.color-01 th,
.table-box.color-01 td {
    border: 2px solid #e0c7ce;
}
.table-box.color-01 th {
    background-color: #ffd9e5;
    color: #B4647C;
}
.table-box.color-01 th.light {
    background-color: #fff0f5;
    color: #B4647C;
}

/*오렌지*/
.table-box.color-02:before {
    border: 3px solid #f0d2b7;
}
.table-box.color-02 th,
.table-box.color-02 td {
    border: 2px solid #f0d2b7;
}
.table-box.color-02 th {
    /* background-color: #FFEFDB; */
    background-color: #ffdfb9;
    color: #A67058;
}
/*보라*/
.table-box.color-03:before {
    border: 3px solid #d5c5e0;
}
.table-box.color-03 th,
.table-box.color-03 td {
    border: 2px solid #d5c5e0;
}
.table-box.color-03 th {
    background-color: #e8d5f7;
    color: #7e6a8b;
}
/*그린*/
.table-box.color-04:before {
    border: 3px solid #d9dbbc;
}
.table-box.color-04 th,
.table-box.color-04 td {
    border: 2px solid #d9dbbc;
}
.table-box.color-04 th {
    background-color: #eaf0b6;
    color: #6C8540;
}
/*파랑*/
.table-box.color-05:before {
    border: 3px solid #CEDBE4;
}
.table-box.color-05 th,
.table-box.color-05 td {
    border: 2px solid #CEDBE4;
}
.table-box.color-05 th {
    background-color: #F1F9FC;
    color: #0070C0;
}

.table-box.color-01 .sub-th,
.table-box.color-01 thead + tbody th {
    background-color: #ffeef3;
    color: #b4647c;
}
.table-box.color-02 .sub-th,
.table-box.color-02 thead + tbody th {
    background-color: #ffefdb;
    color: #a67058;
}
.table-box.color-03 .sub-th,
.table-box.color-03 thead + tbody th {
    background-color: #f1e5fa;
    color: #7e6a8b;
}
.table-box.color-04 .sub-th,
.table-box.color-04 thead + tbody th {
    background-color: #f4f7d8;
    color: #6C8540;
}

.table-box table {
    width: 100%;
    height: 100%;
    table-layout: fixed;
}
.table-box td, th {

    text-align: center;
}
.table-box th {
    font-family: NotoB;
}
.table-box tbody th{padding: 8px 20px; text-align: center;}
.table-box td {
    padding: 8px 20px;
    text-align: justify;
}
.table-box td > .position-box { 
    position: relative;
    width: 100%;
}
.table-box td.has-bullet  {
    padding: 8px 20px 8px 26px;
}
.table-box.has-bullet td {
    padding: 8px 20px 8px 26px;
}
.table-box.has-bullet td > .bullet-box {
    margin-left: -25px;
}
.table-box.has-bullet td .hidden-box .bullet-box {
    margin-left: -25px;
}
.table-box table.table tr:first-child th,
.table-box table.table tr:first-child td {
    border-top: none;
    border-left: none;
}
.table-box table tr:first-child th:first-child,
.table-box table tr:first-child td:first-child {
    border-top: none;
    border-left: none;
}
.table-box table tr:first-child th:last-child,
.table-box table tr:first-child td:last-child {
    border-top: none;
    border-right: none;
}
.table-box table tbody tr:last-child th:first-child,
.table-box table tbody tr:last-child td:first-child {
    border-bottom: none;
    border-left: none;
}
.table-box table tbody tr:last-child th:last-child,
.table-box table tbody tr:last-child td:last-child {
    border-bottom: none;
    border-right: none;
}
.table-box table tr:not(:first-child):not(:last-child) th:first-child,
.table-box table tr:not(:first-child):not(:last-child) td:first-child {
    border-left: none;
}
.table-box table tr:not(:first-child):not(:last-child) th:last-child,
.table-box table tr:not(:first-child):not(:last-child) td:last-child {
    border-right: none;
}
.table-box table thead th{border-top:0 !important; padding:8px 20px 12px; line-height:1.2;}
.table-box table tbody tr:last-child > *{border-bottom:0 !important;}
.table-box th.no-bt,
.table-box td.no-bt {
    border-top: none;
}
.table-box th.no-br,
.table-box td.no-br {
    border-right: none;
}
.table-box th.no-bb,
.table-box td.no-bb {
    border-bottom: none;
}
.table-box th.no-bl,
.table-box td.no-bl {
    border-left: none;
}

td .ti .indent { text-indent: 20px; }