@charset "UTF-8"; 
@import url("https://cdn.jsdelivr.net/npm/bootstrap-icons@1.8.3/font/bootstrap-icons.css"); 
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;700&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Serif+KR:wght@400;500;700&display=swap'); 

b, strong {font-weight: 500;}

a {color: inherit; text-decoration: none;}
a:active, a:focus, a:hover {color: rgba(0, 0, 0, .75); text-decoration: none;}


/* container */
@media (min-width: 1400px) {
    .container-xxl {max-width: 1320px;}
}


/* font family */
.Poppins    {font-family: 'Poppins', sans-serif;}
.Noto-serif {font-family: 'Noto Serif KR', serif;}


/* font size - MinvW 320px, MaxvW 1520px */
.fs-1 {font-size: clamp(1.75rem, 1.55rem + 1vw, 2.5rem)!important;}           /* 최소28px, 최대40px */
.fs-2 {font-size: clamp(1.625rem, 1.4583rem + 0.8333vw, 2.25rem)!important;}  /* 최소26px, 최대36px */
.fs-3 {font-size: clamp(1.5rem, 1.3667rem + 0.6667vw, 2rem)!important;}       /* 최소24px, 최대32px */
.fs-4 {font-size: clamp(1.375rem, 1.275rem + 0.5vw, 1.75rem)!important;}      /* 최소22px, 최대28px */
.fs-5 {font-size: clamp(1.25rem, 1.1833rem + 0.3333vw, 1.5rem)!important;}    /* 최소20px, 최대24px */
.fs-6 {font-size: clamp(1.125rem, 1.0917rem + 0.1667vw, 1.25rem)!important;}  /* 최소18px, 최대20px */
.fs-7 {font-size: 1rem!important;}     /*16px*/
.fs-8 {font-size: .875rem!important;}  /*14px*/
.fs-9 {font-size: .75rem!important;}   /*12px*/

h1, .h1 {font-size: clamp(1.75rem, 1.55rem + 1vw, 2.5rem);}           /* 최소28px, 최대40px */
h2, .h2 {font-size: clamp(1.625rem, 1.4583rem + 0.8333vw, 2.25rem);}  /* 최소26px, 최대36px */
h3, .h3 {font-size: clamp(1.5rem, 1.3667rem + 0.6667vw, 2rem);}       /* 최소24px, 최대32px */
h4, .h4 {font-size: clamp(1.375rem, 1.275rem + 0.5vw, 1.75rem);}      /* 최소22px, 최대28px */
h5, .h5 {font-size: clamp(1.25rem, 1.1833rem + 0.3333vw, 1.5rem);}    /* 최소20px, 최대24px */
h6, .h6 {font-size: clamp(1.125rem, 1.0917rem + 0.1667vw, 1.25rem);}  /* 최소18px, 최대20px */

.display-1 {font-size: clamp(2.5rem, 1.8333rem + 3.3333vw, 5rem);}     /* 최소40px, 최대80px */
.display-2 {font-size: clamp(2.25rem, 1.65rem + 3vw, 4.5rem);}         /* 최소36px, 최대72px */
.display-3 {font-size: clamp(2rem, 1.4667rem + 2.6667vw, 4rem);}       /* 최소32px, 최대64px */
.display-4 {font-size: clamp(1.75rem, 1.2833rem + 2.3333vw, 3.5rem);}  /* 최소28px, 최대56px */
.display-5 {font-size: clamp(1.5rem, 1.1rem + 2vw, 3rem);}             /* 최소24px, 최대48px */
.display-6 {font-size: clamp(1.25rem, 0.9167rem + 1.6667vw, 2.5rem);}  /* 최소28px, 최대40px */

.display-1, .display-2, .display-3, .display-4, .display-5, .display-6 {font-weight: 300; line-height: 1.2;}


.fw-100 {font-weight: 100;} /* Thin */
.fw-200 {font-weight: 200;} /* ExtraLight */
.fw-300 {font-weight: 300;} /* Light */
.fw-400 {font-weight: 400;} /* Regular */
.fw-500 {font-weight: 500;} /* Medium */
.fw-600 {font-weight: 600;} /* SemiBold */
.fw-700 {font-weight: 700;} /* Bold */
.fw-800 {font-weight: 800;} /* ExtraBold */
.fw-900 {font-weight: 900;} /* Black */

.letter-spacing-1 {letter-spacing: .1em;}
.letter-spacing-2 {letter-spacing: .2em;}
.letter-spacing-3 {letter-spacing: .3em;}
.letter-spacing-4 {letter-spacing: .4em;}
.letter-spacing-5 {letter-spacing: .5em;}
.letter-spacing-less-1 {letter-spacing: -.1rem;}
.letter-spacing-less-2 {letter-spacing: -.2rem;}


/* round */
.rounded-1 {border-radius: 0.25rem;}
.rounded-2 {border-radius: 0.375rem;}
.rounded-3 {border-radius: 0.5rem;}
.rounded-4 {border-radius: 0.75rem;}
.rounded-5 {border-radius: 1rem;}
.rounded-6 {border-radius: 1.5rem;}


/* Colors */
.back-f39c12 {background-color: #f39c12;} 
.back-e74c3c {background-color: #e74c3c;} 
.back-c0392b {background-color: #c0392b;} 
.back-5a6773 {background-color: #5a6773;} 
.back-f6b436 {background-color: #f6b436;} 
.back-ece0d1 {background-color: #ece0d1;}
.back-ededed {background-color: #ededed;}
.back-f8f8ff {background-color: #f8f8ff;} /* GhostWhite color */
.back-1a2421 {background-color: #1a2421;} /* Dark Jungle Green color */
.back-3b5998 {background-color: #3b5998;} /* Facebook Color */

/* SteelBlue color */
.text-steelblue {color: #4682b4;} 
.back-steelblue {background-color: #4682b4!important;} 
.border-steelblue {border-color: #4682b4!important;}

/* Denim color */
.text-denim {color: #1560bd;} 
.back-denim {background-color: #1560bd!important;} 
.border-denim {border-color: #1560bd!important;}

/* Saffron color */
.text-saffron {color: #f4c430;} 
.back-saffron {background-color: #f4c430!important;}  
.border-saffron {border-color: #f4c430!important;} 

/* Orange color */
.text-orange {color: #ffa500;} 
.back-orange {background-color: #ffa500!important;}  
.border-orange {border-color: #ffa500!important;} 

/* Tomato color */
.text-tomato {color: #ff6347;} 
.back-tomato {background-color: #ff6347!important;}  
.border-tomato {border-color: #ff6347!important;} 

/* Crimson color */
.text-crimson {color: #dc143c;} 
.back-crimson {background-color: #dc143c!important;}  
.border-crimson {border-color: #dc143c!important;} 

/* Firebrick color */
.text-firebrick {color: #b22222;} 
.back-firebrick {background-color: #b22222!important;}  
.border-firebrick {border-color: #b22222!important;} 

/* Forest Green */
.text-forestgreen {color: #228b22;} 
.back-forestgreen {background-color: #228b22!important;}  
.border-forestgreen {border-color: #228b22!important;} 

/* Dark Green */
.text-DarkGreen {color: #006400;}
.back-DarkGreen {background-color: #006400!important;} 
.border-DarkGreen {border-color: #006400!important;} 



/*----------------------------------------
page-content
----------------------------------------*/
/* page-text */
.page-text {text-align: justify;}
.page-text div {margin-top: 1.5rem; margin-bottom: 1.5rem;}
.page-text p {margin: .5rem 0;}
.page-text ul, .page-wrap ol {padding-left: 1.25rem;}
.page-text li {margin: .5rem 0;}
.page-text blockquote {margin-left: 1.25rem;}


/* list style */
.list-none>li        {list-style: none;}
.list-disc>li        {list-style: disc;}
.list-circle>li      {list-style: circle;}
.list-decimal>li     {list-style: decimal;}
.list-lower-roman>li {list-style: lower-roman;}
.list-hangul>li      {list-style: hangul;}

.list-bracket1>li {counter-increment: section; position: relative; list-style-type: none;}
.list-bracket1>li::before {
    display: inline-block; 
    content: counter(section) ')'; 
    position: absolute; 
    left: -20px; 
}

.list-bracket2>li {counter-increment: inst; position: relative; list-style-type: none;}
.list-bracket2>li::before {
    display: inline-block; 
    content: '(' counter(inst) ')'; 
    position: absolute; 
    left: -20px; 
}

.list-bullet>li {position: relative; list-style: none;}
.list-bullet>li:before {
    display: block; 
    content: ""; 
    width: 5px; 
    height: 5px; 
    background: #737373; 
    position: absolute; 
    top: 10px; 
    left: -15px; 
    border-radius: 50%; 
}


/* tab open */
.tab {overflow: hidden;}

.tab button {
    background-color: #f1f1f1; 
    float: left; 
    cursor: pointer; 
    padding: 1rem 1.5rem; 
    transition: 0.3s; 
    font-size: 1rem; 
    margin-bottom: -1px; 
    border: 1px solid #ccc; 
    min-height: 60px; 
}
.tab button:focus  {outline: none;}
.tab button:hover  {background-color: #ddd;}
.tab button.active {background-color: #fff; color: #0063b8; font-weight: 500; border-top: 3px solid #0063b8;}

.tabcontent {margin: 1.5rem 0;}
.tabcontent:nth-child(n+3) {display: none;}


/* 3depth button */
.tab-3depth a { margin-bottom: .25rem;}


/* button */
.button {
    display: inline-block; 
    zoom: 1; 
    /* zoom and *display = ie7 hack for display:inline-block */
    display: inline; 
    vertical-align: baseline; 
    margin: 0; 
    outline: none; 
    cursor: pointer; 
    text-align: center; 
    text-decoration: none; 
}

.button:hover  {text-decoration: none;}
.button:active {position: relative; top: 1px;}

.button.size-lg {padding: 1rem 2rem; font-weight: 500;}
.button.size-md {padding: .75rem 1.5rem; font-weight: 500;}
.button.size-sm {padding: .5rem 1rem; font-weight: 500; font-size: .85rem;}
.button.size-xs {padding: .25rem .75rem; font-weight: 500; font-size: .75rem;}

.button.white {color: #555; border: solid 1px #CCC; background: #FFF;}
.button.white:hover  {color: #555; background: #F2F2F2;}
.button.white:active {color: #555;}

.button.gray {color: #555; border: solid 1px #CCC; background: #F2F2F2;}
.button.gray:hover  {color: #555; background: #FFF;}
.button.gray:active {color: #555;}

.button.blue {color: #FFF; border: solid 1px #009EDB; background: #009EDB;}
.button.blue:hover  {color: #FFF; background: #2EB3E6;}
.button.blue:active {color: #FFF;}

.button.rosy {color: #FFF; border: solid 1px #DA4B58; background: #DA4B58;}
.button.rosy:hover  {color: #FFF; background: #DC5867;}
.button.rosy:active {color: #FFF;}


/* panel */
.panel {margin: 1rem 0; padding: .1rem 1rem;}
.panel.left-bar {border-left: 6px solid #ccc;}


/* rule */
.rule .ex {background-color: #e2e3e5; font-size: .85rem; color: #464646; padding: 8px 16px; margin: 0.25rem 0;}

.rull-amendment ul {display: flex; flex-wrap: wrap; justify-content: flex-end;}
.rull-amendment li {display: none;}
.rull-amendment li:last-child {display: block;}

@media (min-width: 992px) {
    .rull-amendment li {
        display: block; 
        text-align: right; 
        width: calc(100%/4 - 0px);
        margin-top: 0; margin-bottom: 0;
    }
}


/* table reponsive */
.re-table div.f-left {display: grid; justify-content: center; align-items: center;}
.re-table .f-left    {border: 1px solid #dee2e6; background-color: #f8f9fa; padding: 1rem 0; margin: 0;}
.re-table .f-right   {left: -1px; border: 1px solid #dee2e6; padding: .75rem 1.5rem; margin: 0;}

.re-table li {position: relative; display: block; margin: .25rem 1.25rem;}
.re-table li:before {
    display: block; 
    content: ""; 
    width: 5px; 
    height: 5px; 
    background: #737373; 
    position: absolute; 
    top: 10px; 
    left: -15px; 
    border-radius: .5rem; 
}

.re-table .w-half li {position: relative; display: inline-flex; margin: .25rem 1.25rem; width: calc(100%/2 - 42px);}

@media (max-width: 767.98px) {
    .re-table .f-right {left: 0; top: -1px;}
}

@media (max-width: 575.98px) {
    .re-table .w-half li {width: calc(100%/1 - 40px);}
}


/* table */
.table-type1 {
    border-collapse: collapse; 
    border: 1px solid #E1E2E4; 
    border-top: 2px solid #C6D1E3; 
    margin-top: 10px; 
    font-size: .875rem; 
    text-align: center; 
}
.table-type1 th {
    padding: 5px; 
    background-color: #F8F9FD; 
    color: #517AB8; 
    border-right: 1px solid #E1E2E4; 
    font-weight: 500; 
}
.table-type1 td {
    padding: 5px; 

    border-top: 1px solid #E1E2E4; 
    border-right: 1px solid #E1E2E4; 
}
.table-type1 td.point {background-color: #fafafa;}


/* history */
.tab .tab-history {width: auto;}

.history {
    display: -ms-flexbox; 
    display: flex; 
    -ms-flex-wrap: nowrap; 
    flex-wrap: nowrap; 
    margin: 0!important; 
}
.history>div {margin: 0;}

.years_wrap {
    -ms-flex: 0 0 auto; 
    flex: 0 0 auto; 
    width: auto; 
    max-width: 100%; 
    position: relative; 
}

.years h4 {
    padding-right: 1rem; 
    font-weight: 500; 
    font-size: 1.5rem; 
    margin-top: 20px; 
    width: 120px; 
}
.years h4:after {
    display: block; 
    content: ""; 
    width: 15px; 
    height: 15px; 
    border: 1px solid #606060; 
    background-color: #606060; 
    box-shadow: inset 3px 0 0 0 #fff, inset 0 3px 0 0 #fff, inset 0 0 0 3px #fff; 
    position: absolute; 
    top: 28px; 
    right: -8px; 
    border-radius: 100%; 
    box-sizing: border-box; 
}

.history-list {border-left: 1px solid #ccc; padding-left: 3rem;}
.history-list ul {
    margin: .75rem 0; 
    display: flex; 
    flex-direction: row; 
    flex-wrap: nowrap; 
    justify-content: flex-start; 
    align-items: flex-start; 
}

.history-list ul:first-child {margin-top: 1.25rem;}

.history-list li {margin: 0; padding: 3px 0; list-style: none;}
.history-list li.txt_month {display: inline-block; font-weight: 500; margin-right: 1rem; min-width: 4rem;}
.history-list li.txt_info {display: inline-block; margin: 0;}
.history-list li.txt_info>p {margin: 0;}
.history-list li.txt_info>p:first-child {margin-bottom: .25rem;}

@media (max-width: 991.98px) {
    .history-list ul {display: grid;}
}

@media (max-width: 767.98px) {
    .history {display: block;}
    .history-list {border-left: none; padding: 0; border-top: 1px solid #ccc;}
    .years h4 {padding-top: 1.5rem; padding-bottom: 1rem;}
    .years h4:after {top: 62px; right: 0;}
    .history-list ul {padding-left: 0rem !important;}
}