@charset "UTF-8";

/* **************************************** *
 * TABLE
 * **************************************** */

.Table{width: 100%;}

.Table,
.Table td,
.Table tr,
.Table th{word-wrap:break-word; word-break:break-all; font-size: 14px;}

.Table.Form-type tbody th,
.Table th{padding:7px 15px; text-align:left; color:#fff; line-height:1.5; font-weight:300; vertical-align:middle; font-weight: bold; text-align: center;
    border-bottom:1px solid #dcdfe2; }
.Table > thead th {border: none;}

.Table > thead > tr{background: #ffffff;border-bottom: 1px solid #404040;border-top: 2px solid #404040;}

.Table th:first-child{
    border-radius: 8px 0px 0px 8px;
}
.Table th:last-child{
    border-radius: 0px 8px 8px 0px;
}
.Table tr, tbody td span{
    font-weight: bold;
    color: #404040;
}

.Table tbody td,
.Table td{min-height:24px; text-align: center; padding:10px 5px; border-bottom:1px solid #dcdfe2; line-height:1; color:#383838; font-weight:bold; font-size: 14px;}
.Table td p{text-align: left;}
.Table tbody td
.Table tr td p{font-size: 14px; margin: 6px 4px;}
.Table td input,
.Table td textarea
{/*float: left;*/}
.intable {}
.intable thead th{}

/* **************************************** *
 * SEARCHBOX
 * **************************************** */
.com-searchbox{position:relative}
.com-searchbox:after{content:""; clear:both; display:block}
.com-searchdetail{display:block; position:relative; height:0; padding:0; overflow:hidden}
.com-searchdetail.visible{display:block; height:auto; margin-top:-1px}

.com-searchbox .searchConfirm{position:absolute; right:0; top:0; background:#f9fafc; border:1px solid #dcdfe2; font-size:0; overflow:hidden; z-index:1}
.com-searchbox .searchConfirm .open,
.com-searchbox .searchConfirm .reset{width:24px; min-width:24px; height:24px; margin:0; padding:0; background:none; border:0; text-align:center; border-radius:0}
.com-searchbox .searchConfirm .open:hover,
.com-searchbox .searchConfirm .open:active,
.com-searchbox .searchConfirm .open:focus,
.com-searchbox .searchConfirm .open.Checked,
.com-searchbox .searchConfirm .reset:hover,
.com-searchbox .searchConfirm .reset:active,
.com-searchbox .searchConfirm .reset:focus,
.com-searchbox .searchConfirm .reset.Checked{background:none; margin:0; padding:0; border:0}
.com-searchbox .searchConfirm .open:after,
.com-searchbox .searchConfirm .reset:after{line-height:24px; font-family:'xeicon'; font-weight:300; font-size:16px}
.com-searchbox .searchConfirm .open:after{content:"\e944"; color:#0196fa}
.com-searchbox .searchConfirm .open.close:after{content:"\e941"}
.com-searchbox .searchConfirm .reset:after{content:'\e973'; color:#808080}
.com-searchbox .searchConfirm button:nth-child(even):before{content:''; position:absolute; left:0; top:0; width:1px; height:100%; background:#dcdfe2}

.com-searchbox .searchExtend{position:absolute; right:0; top:0; background:#f9fafc; border:1px solid #dcdfe2; font-size:0; overflow:hidden; z-index:1}
.com-searchbox .searchExtend .open,
.com-searchbox .searchExtend .reset{width:24px; min-width:24px; height:24px; margin:0; padding:0; background:none; border:0; text-align:center; border-radius:0}
.com-searchbox .searchExtend .open:hover,
.com-searchbox .searchExtend .open:active,
.com-searchbox .searchExtend .open:focus,
.com-searchbox .searchExtend .open.Checked,
.com-searchbox .searchExtend .reset:hover,
.com-searchbox .searchExtend .reset:active,
.com-searchbox .searchExtend .reset:focus,
.com-searchbox .searchExtend .reset.Checked{background:none; margin:0; padding:0; border:0}
.com-searchbox .searchExtend .open:after,
.com-searchbox .searchExtend .reset:after{line-height:24px; font-family:'xeicon'; font-weight:300; font-size:16px}
.com-searchbox .searchExtend .open:after{content:"\e941"; color:#0196fa}
.com-searchbox .searchExtend .open.active:after{content:"\e944"}
.com-searchbox .searchExtend .reset:after{content:'\e973'; color:#808080}


/* **************************************** *
 * 분석 수기 입력 표
 * **************************************** */
.club-table {
    width: 100%;
    border-collapse: collapse;
    border: 1px solid #CCC;
}
.club-table th,
.club-table td {
    padding: 6px 10px;
    border-top: 1px solid #CCC;
    border-left: 1px solid #CCC;
}

.club-table th:first-child,
.club-table td:first-child {
    border-left: 0 none;
}
.club-table th {
    text-align: center;
    font-weight: normal;
    background: #eee;
}
.club-table tr {
    height: 28px;
}
.club-table td {
    text-align: right;
}
.club-table .label {
    display: none;
}
.club-table .lower {
    color: #0464b3;
}
.club-table .upper {
    color: #d92c12;
}
@media (max-width: 768px) {
    .club-table colgroup {
        display: none;
    }
    .club-table thead,
    .club-table thead th {
        display: none;
    }
    .club-table tr {
        display: block;
        box-sizing: border-box;
        width: 100%;
        padding: 10px 10px 0;
        border-top: 1px solid #ccc;
        clear: both;
    }
    .club-table th,
    .club-table td {
        display: block;
        float: left;
        box-sizing: border-box;
        border: 0;
    }
    .club-table th {
        width: 100%;
        background: none;
    }
    .club-table td {
        margin-bottom: 10px;
        padding: 0 1px;
        width: 25%;
        text-align: center;
    }
    .club-table td {
        width: 33.33333%;
    }
    .club-table .label {
        display: block;
        padding: 5px 8px;
        font-weight: normal;
        background: #eee;
    }
    .club-table .data {
        display: block;
        padding: 5px 8px;
        background: #fafafa;
        min-height: 15px;
    }
}

.table-cell-1of1 {
    width: 100%;
}
.table-cell-1of2 {
    width: 50%;
}
.table-cell-1of3 {
    width: 33.3333333333%;
}
.table-cell-1of4 {
    width: 25%;
}
.table-cell-1of5 {
    width: 20%;
}
.table-cell-1of6 {
    width: 16.6666666667%;
}
.table-cell-1of7 {
    width: 14.2857142857%;
}
.table-cell-1of8 {
    width: 12.5%;
}
.table-cell-1of9 {
    width: 11.1111111111%;
}
.table-cell-1of10 {
    width: 10%;
}
.table-cell-3of5 {
    width: 60%;
}
.table-cell-2of3 {
    width: 66.66%;
}
.table-cell-3of4 {
    width: 75%;
}
.table-cell-4of5 {
    width: 80%;
}
.table-cell-5of6 {
    width: 83.33%;
}

.readable-hidden {
    position: absolute !important;
    height: 1px;
    width: 1px;
    overflow: hidden;
    clip: rect(1px 1px 1px 1px);
    clip: rect(1px, 1px, 1px, 1px);
}

@media (max-width: 767px) {
    .Table th {
        padding: 7px 7px;
    }
}