@charset "utf-8";
@import url(_reset.css);
@import url(_variables.css);
@import url(button.css);

* {box-sizing: border-box;}
html, body {margin: 0; padding: 0;font-size:62.5%;font-family: var(--f_nsN);}

/*망고체*/
@font-face {
    font-family: 'SF_IceMango';
    src: url('https://fastly.jsdelivr.net/gh/projectnoonnu/noonfonts_2106@1.1/SF_IceMango.woff') format('woff');
    font-weight: normal;
    font-style: swap;
}

/*나눔스퀘어 네오*/
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 100;
    font-style: normal;
    src: url('/resources/font/NanumSquareNeo/NanumSquareNeo-aLt.eot');
    src: url('/resources/font/NanumSquareNeo/NanumSquareNeo-aLt.eot?#iefix') format('embedded-opentype'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-aLt.woff2') format('woff2'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-aLt.woff') format('woff'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-aLt.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 300;
    font-style: normal;
    src: url('/resources/font/NanumSquareNeo/NanumSquareNeo-bRg.eot');
    src: url('/resources/font/NanumSquareNeo/NanumSquareNeo-bRg.eot?#iefix') format('embedded-opentype'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-bRg.woff2') format('woff2'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-bRg.woff') format('woff'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-bRg.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 500;
    font-style: normal;
    src: url('/resources/font/NanumSquareNeo/NanumSquareNeo-cBd.eot');
    src: url('/resources/font/NanumSquareNeo/NanumSquareNeo-cBd.eot?#iefix') format('embedded-opentype'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-cBd.woff2') format('woff2'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-cBd.woff') format('woff'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-cBd.ttf') format("truetype");
    font-display: swap;
} 
@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 800;
    font-style: normal;
    src: url('/resources/font/NanumSquareNeo/NanumSquareNeo-dEb.eot');
    src: url('/resources/font/NanumSquareNeo/NanumSquareNeo-dEb.eot?#iefix') format('embedded-opentype'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-dEb.woff2') format('woff2'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-dEb.woff') format('woff'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-dEb.ttf') format("truetype");
    font-display: swap;
} 

@font-face {
    font-family: 'NanumSquareNeo';
    font-weight: 900;
    font-style: normal;
    src: url('/resources/font/NanumSquareNeo/NanumSquareNeo-eHv.eot');
    src: url('/resources/font/NanumSquareNeo/NanumSquareNeo-eHv.eot?#iefix') format('embedded-opentype'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-eHv.woff2') format('woff2'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-eHv.woff') format('woff'),
         url('/resources/font/NanumSquareNeo/NanumSquareNeo-eHv.ttf') format("truetype");
    font-display: swap;
} 


/* suit 숫자폰트로 사용 */
@font-face {
    font-family: 'SUIT';
    font-weight: 400;
    font-style: normal;
    src: url('/resources/font/sunn/SUIT-Regular.eot');
    src: url('/resources/font/sunn/SUIT-Regular.eot?#iefix') format('embedded-opentype'),
        url('/resources/font/sunn/SUIT-Regular.woff2') format('woff2'),
        url('/resources/font/sunn/SUIT-Regular.woff') format('woff'),
        url('/resources/font/sunn/SUIT-Regular.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'SUIT';
    font-weight: 700;
    font-style: normal;
    src: url('/resources/font/sunn/SUIT-Bold.eot');
    src: url('/resources/font/sunn/SUIT-Bold.eot?#iefix') format('embedded-opentype'),
        url('/resources/font/sunn/SUIT-Bold.woff2') format('woff2'),
        url('/resources/font/sunn/SUIT-Bold.woff') format('woff'),
        url('/resources/font/sunn/SUIT-Bold.ttf') format("truetype");
    font-display: swap;
}
@font-face {
    font-family: 'SUIT';
    font-weight: 900;
    font-style: normal;
    src: url('/resources/font/sunn/SUIT-Heavy.eot');
    src: url('/resources/font/SUIT-Heavy.eot?#iefix') format('embedded-opentype'),
        url('/resources/fontsunn/SUIT-Heavy.woff2') format('woff2'),
        url('/resources/font/sunn/SUIT-Heavy.woff') format('woff'),
        url('/resources/font/sunn/SUIT-Heavy.ttf') format("truetype");
    font-display: swap;
}

h3 {
    font-size: 22px;
    color: white;
    font-weight: 600;
    margin-bottom: 20px;
}

.plan_intro li > div > img {
    height: 19rem;
    width: 39rem;
    object-fit: cover;
}

/* screen reader only 세가지 동일 삭제예정*/
.skip {overflow: hidden;position: absolute;border: 0;width: 1px;height: 1px;clip: rect(1px, 1px, 1px, 1px);clip-path: inset(50%);}
.sr-only {overflow: hidden;position: absolute;border: 0;width: 1px;height: 1px;clip: rect(1px, 1px, 1px, 1px); clip-path: inset(50%);}
.blind {overflow: hidden;position: absolute;border: 0;width: 1px;height: 1px;clip: rect(1px, 1px, 1px, 1px);clip-path: inset(50%);}
.hidden {visibility: hidden;opacity: 0;}

#accessibility {position:absolute;top:-1px;left:0;background-color:#333;z-index:999999}
#accessibility a {position:absolute;top:0;left:0;padding:10px 25px;margin-top:-100px;text-align:center;line-height:1;white-space:nowrap;background:#000}
#accessibility a:link {color:#333}
#accessibility a:focus {margin-top:0;text-decoration:underline;color:#fff}

/*icon+txt*/
.waring {position:relative;margin: 0.5rem 0;padding-left:3rem;line-height: 1.7;color:#E62D8B;}
.waring::before {content: '';position: absolute;display:block;left:0; top:0;width:2.6rem; height:2.6rem; background:url('/resources/images/common/icon_waring.svg') no-repeat 50%;}

/* img 
img {display: block; max-width:100%; margin: 0 auto;} */

/* flex */
.flex-column {display: flex; flex-direction: column;}
.flex-space-between {display: flex;align-items: center;justify-content: space-between;}

/* arr - icon */
.arr {display: block;}
.arr.small {width: 2rem; height: 2rem; background: url('/resources/images/common/arr_sm.svg') no-repeat 50%;}
.arr.medium {width: 2rem; height: 2rem; background: url('/resources/images/common/arr_mdi.svg') no-repeat 50%;}

/* btn */
a {cursor: pointer;}
.btn.tx {display:inline-flex;align-items:center;justify-content:space-evenly;flex-direction:row;padding: 1.2rem 2.5rem;line-height:1;border: 1px solid #bbb; border-radius:5rem;color:#333;}
.btn.circle {display: flex; align-items: center; justify-content: center; width:8rem; height: 8rem; border-radius: 8rem; background:#F2F2F2;}

/*여백*/
.mr-1 {margin-right:1rem;}
.mr-2 {margin-right:2rem;}

/*table*/
.tbl_basic.type2 {display: table;width: 100%;margin-bottom: 10px;font-size: 1.5rem;border-top: 4px solid #4D8DE7;border-bottom: 1px solid transparent;border-collapse: collapse;}
.tbl_basic.type2 thead th {border: 1px solid #8D9BA8;}
.tbl_basic.type2 th:first-child, .tbl_basic.type2 td:first-child {border-left: 0;}
.tbl_basic.type2 th:last-child, .tbl_basic.type2 td:last-child {border-right: 0;}
.tbl_basic.type2 th, .tbl_basic.type2 td {margin-left: -1px; padding:1.8rem 1.5rem;border-left: 1px solid #DEE2E6;border-bottom: 1px solid #DEE2E6;word-wrap: break-word; word-break: keep-all;}
.tbl_basic.type2 tbody th {text-align: left;background-color: #fff;}
.tbl_basic.type2 tbody th, .tbl_basic.type2 tbody td {font-size:1.4rem; font-weight: 300;}
.tbl_basic.type2 tbody tr.last_line {font-weight:600; background:#F8F9FA;}
.tbl_basic.type2 tbody th, .tbl_basic.type2 tbody tr.last_line td, .tbl_basic.type2 tbody tr.last_line td {font-weight:600;}

@media only screen and (max-width:768px) {
	.tbl_m_warp {width:100%; overflow:scroll}
	.tbl_m_warp .tbl_basic {min-width:600px;}
    .tab-ul.type1 li a,
    .tab-ul.type1 li button{
        line-height: 1.5;
    }
}

/*list*/
.list_num{overflow:hidden;}
.list_num li{position:relative;display:block;color:#555;padding-left:33px;font-weight: 300;}
.list_num li .number{display:block;position:absolute;width:25px;height:25px;line-height:25px;border-radius:100%;top:2px;left:0;text-align:center;font-size:14px;color:#fff; background: #ccc;}

.list_num.white li {color:#fff}
.list_num.white .number {background:#fff; color:#00A6E2;font-weight:600;}

/*bg*/
.bg_blue {background:#00A6E2;}

/*font*/
.font_mg {font-family:var(--f_mag);font-weight: normal;}

/*줄바꿈*/
.enter {display:block;}

/*Tab*/
.tab_header {display:block;}
.tab_body {display:block;}
.tab_section {display:block; padding:8rem 0; /* border-bottom:1px solid #DEE2E6; */}

.tab-ul {display:flex;padding-left: 1px;padding-top: 1px;}
.tab-ul li * {margin:0;padding:0;line-height:0;}
.tab-ul li a {display:table-cell;background-image:none;color:inherit;text-align:left;cursor:pointer;}
.tab-ul li a span {
	display: flex;position:relative;line-height:1.2;flex-direction: row;width: 100%;height: 100%;align-items: center;
    /* padding-left: 2rem;padding-right: 4.5rem;  */
    justify-content: center;
}

/*Tab Type1*/
.tab-ul.type1 li {z-index:999;position:relative;z-index:10; transition:all .3s;-webkit-transition:all .3s; width: 100%;}
.tab-ul.type1 li a,
.tab-ul.type1 li button {
    text-align: center;
    position:relative;
    height:7.5rem;
    color:#6C757D;
    font-size:16px;
    border:1px solid #e1e1e1;
    transition:all .3s;
    -webkit-transition:all .3s;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #fff;
    width: 100%;
}

.tab-ul.type1 li.on {z-index:111;position:relative;}

.tab-ul.type1 li.on button,
.tab-ul.type1 li.on button:active,
.tab-ul.type1 li.on button:focus,
.tab-ul.type1 li.on button:hover,
.tab-ul.type1 li.on a,
.tab-ul.type1 li.on a:active,
.tab-ul.type1 li.on a:focus,
.tab-ul.type1 li.on a:hover {
	font-weight: 800;
	/* border:3px solid #1E4298; */
	color:#1E4298;
	background-color: #fff;
	text-decoration : underline;
	text-underline-offset : 5px;
	text-decoration-thickness: 2.5px;
}

.tab-ul.type1 li:active,
.tab-ul.type1 li:focus,
.tab-ul.type1 li:hover {z-index:11;}

.tab-ul.type1 li a:active,
.tab-ul.type1 li a:focus,
.tab-ul.type1 li a:hover,
.tab-ul.type1 li button:hover {color:#1E4298;font-weight: 800; /* border:1px solid #1E4298; */}

.tab-ul.type1 li a span:after {
	/* position: absolute; content: ""; top: 50%; right: 15px; width: 16px; height: 4px; margin-top: -1px; border-radius: 5px; background: #DEE2E6; transition: all 0.3s ease-out; */
}
.tab-ul.type1 li.on a span:after,
.tab-ul.type1 li a:hover span:after {display: none;}

.tab-ul.type1 li a span:before {display:block;position:absolute;content: "";top: 50%; right:15px; z-index: 20; width:16px; height:10px; margin-top: -5px;}
.tab-ul.type1 li a:active span:before,
.tab-ul.type1 li a:focus span:before,
.tab-ul.type1 li a:hover span:before {background:url(/resources/images/common/tab_on_arrow.svg)no-repeat;}
.tab-ul.type1 li.on a span:before,
.tab-ul.type1 li.on a:active span:before,
.tab-ul.type1 li.on a:focus span:before,
.tab-ul.type1 li.on a:hover span:before {background:url(/resources/images/common/tab_on_arrow.svg)no-repeat;}

/*탭버튼 5개부터는 2줄로*/
.tab-ul.type1.tab-col-5 {flex-wrap: wrap;} 
.tab-ul.type1.tab-col-5 li {width: 25%;}

@media only screen and (max-width:768px) {
	.tab-ul {flex-wrap: wrap;}
	.tab-ul.type1 li {width: 50%;}
}

@media only screen and (max-width:540px) {
	.tab-ul.type1 li {width: 100%;}
}



/* 공통탭 */


.tab-ul-basic {
    display: flex;
    gap: 10%;
}
.tab-ul-basic li span{
    display: flex;
    justify-self: center;
    align-items: center;
}
.tab-ul-basic.type1 li.on a, .tab-ul.type1 li.on a:active, .tab-ul.type1 li.on a:focus, .tab-ul.type1 li.on a:hover {
    display: flex;
    font-weight: 800;
    color: white;
    background: #5175AA;

}

.tab-ul-basic.type1 li.on {
    z-index: 10;
    position: relative;
}

.tab-ul-basic.type1 li {
    z-index: 999;
    position: relative;
    z-index: 10;
    transition: all .3s;
    -webkit-transition: all .3s;
    width: 100%;
}

.tab-ul-basic.type1 li a span:before {
    display: block;
    position: absolute;
    content: "";
    top: 50%;
    right: 15px;
    z-index: 20;
    width: 16px;
    height: 10px;
    margin-top: -5px;
}

.tab-ul-basic.type1 li a {
    color: #6c757d;
    display: flex;
    justify-content: center;
    align-items: center;
    word-break: break-all;
    line-height: 1.2;
    flex-direction: row;
    width: 100%;
    height: 100%;
    text-align: center;
    position: relative;
    height: 7.5rem;
    font-size: 16px;
    text-align: left;
    border: 1px solid #e1e1e1;
    transition: all .3s;
    -webkit-transition: all .3s;
    padding: 2rem;
    word-break: break-word;
    text-align: center;
}
.tab-ul-basic li a {
    display: table-cell;
    background-image: none;
    color: inherit;
    text-align: left;
    cursor: pointer;
}
.tab-ul-basic li * {
    margin: 0;
    padding: 0;
    line-height: 0;
}

.tab-ul-basic li {
    width: 100%;
    height: 100%;
    display: flex;
}