/* common */
.subpage { overflow: hidden; position:relative; }
.subpage > section {padding: 80px 0;}
.subpage > section:nth-of-type(even) {background: #f7f7f7;}
/* font */
.h_28 {font-size: 28px; font-weight:500; color: #000; line-height: 1.3; font-family: 'Pretendard';}
.h_24 {font-size: 24px; font-weight:700; color: #000; line-height: 1.3;font-family: 'Pretendard'; }
.h_22 {font-size: 22px; font-weight:500; color: #000; line-height: 1.3;font-family: 'Pretendard'; }
.p_20 {font-size: 20px; font-weight: 300; color: #000; line-height:38px; font-family: 'Pretendard';}
.p_18 {font-size: 18px; font-weight: 300; color: #000; line-height:1.65;}

/* title */
.c_tit { position:relative; display: inline-block; font-size: 60px; color: #000; white-space: nowrap; font-weight: 800; }
/* .c_tit::after { content:".";  color:#0b3b63; } */

/* rules */
#rules { padding:80px 0 140px; text-align: center; }
#rules .c_tit + p { margin-top: 20px; font-weight: 300; letter-spacing: -0.5px; }

.tab_btn_wr { position:relative; z-index: 3; }
.tab_btn { width:100%; display: flex; height: 60px; justify-content: center; align-items: center; position:relative; z-index: 2; }
.tab_btn li { width:300px; height: 100%;  }
.tab_btn li ~ li { margin-left: 20px; }
.tab_btn li a { display: block; width:100%; line-height: 60px; font-size: 18px; cursor: pointer; transition: all .3s; background:#333; color:#fff; text-align: center;
font-weight: 500; }
.tab_btn li a.active { background-color: #0b3b63; }

.tab { display: none; }
.tab.active { display: block; }
.tap_wrap { margin-top: 60px; }

.txt_wrap { margin-top: 60px; }
.txtarea { width:100%; padding:28px 35px; background: #fafafa; border:1px solid #ddd; border-radius: 3px; height:700px;
font-size:16px; font-weight: 300; color:#333; line-height: 28px; overflow-y: auto; white-space: pre-line; text-align: left; scroll-behavior: none !important; }
.txtarea b { font-weight: 500; color:#000;  }
.txtarea strong { font-weight: 500; text-align: center; display: block; color:#000;  }

/* 스크롤 */
.txtarea::-webkit-scrollbar { width: 10px; }
.txtarea::-webkit-scrollbar-thumb { border-radius: 10px; height: 50px; background-color: #bbb; }
.txtarea::-webkit-scrollbar-track { background-color: #f7f7f7; }

.table_wrap { display: grid; }
.table_wrap table { width:100%; border-collapse: collapse; text-align: center; }
.table_wrap table thead th { background:#333; padding:12px; font-weight: 600; color:#fff; font-size: 16px; border: 1px solid rgba(255,255,255,0.25); line-height: 1.3; }
.table_wrap table tbody td { background:#fff; padding:12px; font-weight: 300; color:#000; font-size: 15px; border: 1px solid #ddd; line-height: 1.55;}
.table_wrap table tbody .green td {background-color:#e2f5ce;}
.table_arrow { display: none; }

.table_img_wrap {display: flex; justify-content: space-between; margin-top: 10px;}
.table_img_wrap img {border:1px solid #ddd; max-width: calc(50% - 5px);}
.table_img_wrap img + img {margin-left: 5px;}


/* 반응형 */
@media screen and (max-width:1420px) {

    /* common */
    /* br:not(.mob) {display: none; } */

    /* rules */



}

@media screen and (max-width:1023px) {

    /* common */
    .subpage {text-align: center;}
    .c_tit { font-size: 48px; }
    /* flex_tit */
    .flex_tit {display: block; }
    .flex_tit h2 {margin:0 0 20px;}
    /* font */
    .h_28 {font-size: 22px;}
    .h_24 {font-size: 21px;}
    .h_22 {font-size: 20px;}
    .p_20 {font-size: 18px; line-height: 1.65;}
    .p_18 {font-size: 16px; }

    .table_wrap table thead th { padding:12px 10px; font-size: 15px; }
    .table_wrap table tbody td { padding:12px 10px; font-size: 14px; }

    /* rules */
    #rules { padding: 50px 0 100px; }
    #rules p br { display: none; }
    #rules .c_tit + p { ; }





}
@media screen and (max-width:767px) {

    /* common */
    .subpage > section {padding: 60px 0;}
    .c_tit { font-size: 32px; }
    .line_tit { padding-left: 13px; margin: 0 0 20px; }
    .line_tit::before { top: 3px; width: 3px; height: 20px; }
    /* font */
    .h_28 {font-size: 20px;}
    .h_24 {font-size: 19px;}
    .h_22 {font-size: 18px;}
    .p_20 {font-size: 16px; }
    .p_18 {font-size: 15px; }

    .table_wrap.res { overflow-x: scroll; width: 100%;}

    .table_img_wrap {display: block; margin: 0;}
    .table_img_wrap img {max-width:100%; width: 100%;}
    .table_img_wrap img + img {margin: 5px 0 0;}



    /* rules */
    #rules { padding:30px 0 60px; }
    #rules .c_tit + p { margin-top: 15px; }

    .tab_btn { height: 50px; }
    .tab_btn li {width: calc(50% - 5px); }
    .tab_btn li ~ li { margin-left: 10px; }
    .tab_btn li a { line-height: 50px; font-size: 14px; padding:0 10px; white-space: nowrap; letter-spacing: -.5px;}

    .tap_wrap { margin-top: 30px; }

    .txt_wrap { margin-top: 30px; }
    .txtarea { padding: 20px; font-size: 14px; height: 500px; }


}

@media screen and (max-width:480px) {
    .table_arrow { display: inline-block; float: right; }
    .table_arrow i { font-size:30px; color:#333; }
    .table_wrap.res table { width: 480px; }
    .table_wrap table thead th {padding: 10px; font-size: 14px;}
    .table_wrap.res table tbody td { padding: 10px 5px; font-size: 13px; letter-spacing: -.5px;}
}