@charset "utf-8";
@import url('https://fonts.googleapis.com/earlyaccess/notosanskr.css');



:root {
    --font-size-5: 30px;
    --main-color: #000;
}

.test {
    color: var(--main-color);
    font-size: var(--font-size-5);
}

/*reset*/
body,
h1,
h2,
h3,
div,
p,
img,
ol,
ul,
li,
a,
span,
address,
cite,
form,
input,
nav,
footer,
strong {
    margin: 0;
    padding: 0;
    word-break: keep-all;
}

caption,
legend,
.skip caption {
    position: absolute;
    left: -999px;
    width: 1px;
    height: 1px;
    font-size: 0;
    line-height: 0;
    overflow: hidden;
    visibility: hidden;
}

body,
input,
select {
    font-size: 14px;
    font-family: 'noto sans KR', '나눔고딕', 'Nanum Gothic', 'nanumgothic', 'sans-serif';
    color: #363636;
}

select,
input,
img,
td,
option {
    vertical-align: middle;
}


table {
    border-collapse: collapse;
    text-align: center;
}

img,
fieldset {
    border: 0 none;
}

ul {
    list-style-type: none;
}

address,
cite {
    font-style: normal;
}

a:link,
a:visited {
    text-decoration: none;
}

a:hover,
a:active {
    text-decoration: none;
}

input {
    vertical-align: middle;
}


.color-r {
    color: #a20000;
}

.color-myzip {
    color: #2EBDBA;
}

.tal {
    text-align: left;
}

.pdt5 {
    padding-top: 5px;
}

.pdt10 {
    padding-top: 10px;
}

.pdt20 {
    padding-top: 20px;
}

.pdt30 {
    padding-top: 30px;
}

.pdt40 {
    padding-top: 40px;
}

.pdt50 {
    padding-top: 50px;
}

.pdb5 {
    padding-bottom: 5px;
}

.pdb10 {
    padding-bottom: 10px;
}

.pdb20 {
    padding-bottom: 20px;
}

.pdb30 {
    padding-bottom: 30px;
}

.pdb40 {
    padding-bottom: 40px;
}

.pdb50 {
    padding-bottom: 50px;
}

.pdr5 {
    padding-right: 5px;
}

.pdr10 {
    padding-right: 10px;
}

.pdr20 {
    padding-right: 20px;
}

.pdr30 {
    padding-right: 30px;
}

.pdr40 {
    padding-right: 40px;
}

.pdr50 {
    padding-right: 50px;
}

.pdl5 {
    padding-left: 5px;
}

.pdl7 {
    padding-left: 7px;
}

.pdl10 {
    padding-left: 10px;
}

.pdl20 {
    padding-left: 20px;
}

.pdl30 {
    padding-left: 30px;
}

.pdl40 {
    padding-left: 40px;
}

.pdl50 {
    padding-left: 50px;
}

.mgt10 {
    margin-top: 10px;
}

.mgl10 {
    margin-left: 10px;
}

.fw5 {
    font-weight: 500;
}

.fw7 {
    font-weight: 700 !important;
}

.container {
    margin: 0 auto;
    padding: 0;
    max-width: 500px;
    position: relative;
}


.wrap-header {
    position: relative;
}


.wrap-top {
    position: relative;
    max-width: 500px;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 100%;
    margin: 0 auto;
}

.wrap-top-txt {
    position: absolute;
    left: 0;
    top: 290px;
    z-index: 3;
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    bottom: 25px;
}

.top-img {
    max-width: 500px;
    margin: 0 auto;
}

.top-img::before {
    position: absolute;
    left: 0;
    top: 0;
    bottom: 0;
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.3);
    z-index: 2;
}

.top-img img {
    width: 100%;
    min-width: 280px;
    margin: 0 auto;
}

.intro-txt img {
    width: 100%;
    margin: 0 auto;
}

.m-tit {
    margin: 16px 16px 0 16px;
    text-align: center;
}

.write-bar {
    display: flex;
    justify-content: space-between;
    margin: 20px 16px 0;
    max-width: 500px;
}


.tip-box {
    background: #F2EBE7;
    border-radius: 8px;
    padding: 32px 16px;
    color: #000;
}

.tip-tit {
    font-weight: 700;
    font-size: 16px;
    margin-bottom: 10px;
}

.tip-sTxt {
    color: #767676;
    font-size: 12px;
}

.bold-txt {
    font-weight: bold;
    color: #F95858;
    font-size: 15px;
}

.txt-marker {
    position: relative;
    vertical-align: top;
    font-size: 15px;
}

.vat {
    vertical-align: top;
    ;
}

.marker_n {
    display: inline-block;
    padding-left: 5px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.7;
    letter-spacing: normal;
    text-align: left;
    color: #000;
    width: calc(100% - 32px);
    font-size: 15px;
}

.tit-round {
    background-color: #4B6BF6;
    color: #fff;
    padding: 3px 10px;
    border-radius: 20px;
    margin-right: 10px;
}

.intro-txt a,
.marker_n a {
    color: #333;
}

.text-dec {
    text-decoration: underline !important;
}



.v-line {
    border-left: 2px solid #4B4B4B;
    /* height: 100px; */
    margin-top: 13px;
    padding-left: 1px;

}

.wrap-url {
    display: flex;
    justify-content: left;
}

.url-tit {
    margin-left: -5px;
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 24px;
    color: #000;
    margin-right: 10px;
}

.url-txt {
    padding-top: 4px;
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #000000;
    padding-left: 10px;
    padding-bottom: 6px;
}


.url-tit span {
    padding-left: 10px;
}



.title {
    padding: 0 16px;
}

.sTit {
    font-family: 'Noto Sans KR';
    font-style: normal;
    font-weight: 400;
    font-size: 17px;
    line-height: 160%;
    color: #fff;
}

.mTit {
    font-style: normal;
    font-weight: 900;
    font-size: 40px;
    line-height: 49px;
    color: #fff;
}

.name {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    color: #fff;
    padding-left: 4px;
}

.date {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 24px;
    color: #fff;
    padding-left: 20px;
}

.wrap-body {
    margin: 0 auto;
    max-width: 500px;
    position: relative;
    padding: 30px 16px 0;
    word-break: keep-all;
}

.intro-txt {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 26px;
    color: #000;

}

.highlight {
    display: inline;
    box-shadow: inset 0 -20px 0 #F26C5B;
    /*-10px은 highlight의 두께*/
    color: #fff;
}

.intro-txt2 {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 32px;
    color: #000;
    background-color: 000;
    display: inline-block;
}

.section-title {
    font-style: normal;
    font-weight: 700;
    font-size: 22px;
    line-height: 32px;
    color: #000;
}

.img-sTxt {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 12px;

    text-align: center;

    color: #999999;
}

.intro-txt .txt-sTit {
    font-weight: 700;
    font-size: 16px;
}

.body-txt {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 28px;
    color: #363636;
}

.body-txt span {
    font-weight: 700;
}

.snow {
    padding-top: 32px;
    margin: 0 auto;
    max-width: 500px;
    text-align: center;
}

.line {
    max-width: 500px;
    margin: 0 auto;
    background-color: #f1f1f1;
    height: 8px;
    border: 0;
}



.u-line {
    font-weight: 700;
    border-bottom: 1px solid #000;
}


.keyword-list {
    border-radius: 8px;
    border: 1px solid #e3e3e3;
    margin-top: 12px;
}

table {
    width: 100%;
    border: 1px solid #E3E3E3;
    border-collapse: collapse;
    border-style: hidden;

}

.list-tit {
    border-top-left-radius: 7px;
    background-color: #E5EFEB;
    border-top-right-radius: 7px;
    font-weight: 700;
}

table td {
    border-right: 1px solid #DDE7E3;
    border-bottom: 1px solid #DDE7E3;
}

table td:nth-last-child(1) {
    border-right: 0;
}

table td {
    text-align: center;
    padding: 8px 0 8px 0;

}

.chart {
    max-width: 500px;
    margin: 0 auto;
    background: #FDFDFD;
    border: 1px solid #F5F5F5;
    border-radius: 8px;
    margin-top: 20px;

}

.chart img {
    width: 90%;
    margin: 0 auto;
    padding: 16px;
}

.q-box {
    max-width: 500px;
    margin: 0 auto;
    margin-top: 20px;
}

.q-box-img {
    background-image: url(img/q-box013.svg);
    background-repeat: no-repeat;
    background-size: cover;
}

.q-box-img-b {
    display: block;
    margin: 0;

}

.q-box-img-b img {
    width: 100%;
    margin-top: -1px;
}

.q-txt-color {
    padding: 44px 12px 0 12px;
    font-weight: 700;
    font-size: 16px;
    line-height: 23px;
    color: #29B1A3;
}

.img-cover img {
    /* vertical-align: baseline; */
    display: block;
}

.q-txt {
    background-image: url(img/Mask\ group-0.svg);
    background-size: contain;
    background-repeat: repeat-y;
}

/* .q-txt span{margin:0 16px;} */


.q-box-txt {
    padding-top: 50px;
}

.q-txt {
    font-weight: 700;
    font-size: 16px;
    line-height: 23px;
    color:
        #29B1A3;
    padding: 0 16px;

}


.q-txt span:nth-last-child(1) {
    font-size: 15px;
    font-weight: normal
}

.a-txt {
    background-color: #DBEAE8;
    font-weight: 400;
    font-size: 15px;
    line-height: 150%;
    color: #000;
    padding: 0 16px;
    margin-top: -1px;
}


.a-txt li {
    list-style-type: disc;
    background-color: #DBEAE8;
    font-weight: 400;
    font-size: 13px;
    line-height: 150%;
    color: #000;
}

.a-txt li::marker {
    font-size: 12px;
}

.q-txt-color span {
    font-size: 14px;
    font-weight: normal;
}

.a-txt-color {
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 150%;
    padding: 87px 12px 10px 12px;
}

.c-gray {
    font-weight: 700;
    font-size: 14px;
    line-height: 150%;
    color: #6A6A6A;
    padding-top: 10px;
}

.intro-txt .gray a {
    color: #6a6a6a;
    text-decoration: underline;
    font-size: 14px;
    font-weight: normal;
}

.c-red {
    font-weight: 700;
    line-height: 150%;
    color: #CE0016;
}

.wrap-a-txt {
    font-size: 14px;
    font-weight: 150%;
}

.wrap-qna {
    padding-top: 20px;
    padding-bottom: 10px;
}

.q-txt2 {
    font-weight: 700;
    font-size: 16px;
    line-height: 150%;
    color: #000000;
    padding-top: 8px;
}

.a-txt2 {
    font-weight: normal;
    font-size: 15px;
    line-height: 150%;
    color: #000;
    padding-top: 8px;
    position: relative;
}

.a-bd {
    background-color: #ffeec6;
    display: inline-block;
    font-weight: 700;
}

.a-txt2-sub {
    font-weight: 400;
    font-size: 14px;
    line-height: 150%;
    color: #929292;
}


.img-cover img {
    width: 100%;
    margin-top: -1px;
}

.section-img {
    max-width: 500px;
    margin: 0 auto;
    background-color: #FBFBFB;
    text-align: center;
    padding: 24px 0;
}


.section-img img {
    min-width: 230px;
    margin: 0 auto;

}

.section-img-txt {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #9F9F9F;
    padding-top: 8px;
    text-align: center;
}

.v-line {
    border-left: 2px solid #4B4B4B;
    /* height: 100px; */
    margin-top: 13px;
    padding-left: 1px;

}

.wrap-url {
    display: flex;
    justify-content: left;
}

.url-tit {
    margin-left: -5px;
    font-style: normal;
    font-weight: 600;
    font-size: 15px;
    line-height: 24px;
    color: #000;
    margin-right: 10px;
    padding-bottom: 4px;
}

.url-txt {
    padding-top: 4px;
    font-style: normal;
    font-weight: 400;
    font-size: 15px;
    line-height: 24px;
    color: #000000;
    padding-left: 10px;
    /* padding-bottom: 6px; */
}

.url-tel {
    padding-top: 4px;
    font-style: normal;
    font-weight: normal;
    font-size: 15px;
    line-height: 24px;
    color: #000000;
    padding-left: 10px;
    /* padding-bottom: 6px; */
}

.url-tit span {
    padding-left: 10px;
}



.url-txt a {
    color: #000;
    text-decoration: underline;
    font-weight: 300px;
}



.url-tel span a {
    color: #777;
    text-decoration: none;
    font-weight: 300px;
}

.group-card-color01 {
    background-color: #4F81BD;
    border-radius: 8px;
    padding-bottom: 5px;
}

.group-card-color02 {
    background-color: #57A9BB;
    border-radius: 8px;
    padding-bottom: 5px;
    margin-top: 8px;
}

.group-card-color03 {
    background-color: #9283BE;
    border-radius: 8px;
    padding-bottom: 5px;
    margin-top: 8px;
}

.group-card-color04 {
    background-color: #B45062;
    border-radius: 8px;
    padding-bottom: 5px;
    margin-top: 8px;
}

.card-title {
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #FFFFFF;
    padding: 12px 0;
}

.card-title img {
    padding-right: 10px;
}

.card-box {
    border-radius: 6px;
    background-color: #fff;
    padding: 12px 0;
    margin: 0 5px;
}

.card-color01 {
    font-style: normal;
    font-weight: 700;
    font-size: 15px;
    line-height: 24px;
    color: #4F81BD;
    padding: 0 16px;
}

.card-color02 {
    font-style: normal;
    font-weight: 700;
    font-size: 15px;
    line-height: 24px;
    color: #57A9BB;
    padding: 0 16px;
}

.card-color03 {
    font-style: normal;
    font-weight: 700;
    font-size: 15px;
    line-height: 24px;
    color: #9283BE;
    padding: 0 16px;
}

.card-color04 {
    font-style: normal;
    font-weight: 700;
    font-size: 15px;
    line-height: 24px;
    color: #B45062;
    padding: 0 16px;
}

.card-box p span {
    font-size: 13px;
    font-weight: 300;
    padding-left: 5px;
}

.dash-line-color01 {
    object-fit: contain;
    background-image: url(img/Vector3.svg);
    background-repeat: repeat-x;
    height: 20px;
    background-position-y: center;

}

.dash-line-color02 {
    object-fit: contain;
    background-image: url(img/Vector4.svg);
    background-repeat: repeat-x;
    height: 20px;
    background-position-y: center;

}

.dash-line-color03 {
    object-fit: contain;
    background-image: url(img/Vector5.svg);
    background-repeat: repeat-x;
    height: 20px;
    background-position-y: center;

}

.dash-line-color04 {
    object-fit: contain;
    background-image: url(img/Vector6.svg);
    background-repeat: repeat-x;
    height: 20px;
    background-position-y: center;

}

.card-box ul {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    padding: 0 16px;
    color: #363636;
    list-style: disc;
    margin-left: 16px;
}

.card-box ul li::marker {
    font-size: 10px;
}

.group-tip {
    border-radius: 8px;
    border: 1px solid #DFF3F4;
    padding: 20px 9px;
}




.wrap-talbe-02 {
    width: 100%;
}



.section-m-tit span {
    border-bottom: 1px solid #2DBDBD;
    display: inline-block;
    margin-left: 10px;
}



.section-img2 {
    max-width: 500px;
    margin: 0 auto;
    background-color: #FBFBFB;
    text-align: center;
    /* padding: 24px 0; */
}

.section-img2 img {
    object-fit: cover;
    width: 100%;
}




.wrap-bottom {
    margin: 0 auto;
    max-width: 500px;
    position: relative;
    padding: 30px 16px 40px 16px;
    word-break: keep-all;

}

.knowhow-tit {
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 20px;
    color: #000000;
    padding: 0 16px;
}

.knowhow-tit ul,
.section01 ul {
    list-style: disc;
    display: inline-block;
}

.knowhow-tit img {
    padding-left: 10px;
    padding-bottom: 2px;
}


.more-wrapper {
    display: flex;
    padding-top: 16px;
    justify-content: space-between;
    padding-bottom: 30px;
    border-bottom: 1px solid #DBDBDB
}

.inApp {
    width: 48%;
}

.inApp img {
    width: 100%;
}

/* .more-wrapper p img{width:100%;}

.more-wrapper img {
    width:100%;
} */

.more-txt {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    color: #000000;
    padding-top: 6px;
}

.sub-txt {
    font-size: 14px;
    text-align: center;
    color: #777;
    padding: 40px 0;
}

.marker_n {
    color: #000 !important;
}

.slide-bottom-txt {
    font-size: 12px;
    color: #666;
}

.slide-bottom-txt-line {
    margin: 10px auto;
    background-color: #999;
    height: 1px;
    border: 0;
}

.tag {
    font-size: 12px;
    color: #000;
    background-color: #FFEAE8;
    padding: 2px 10px;
    border-radius: 22px;
    margin-right: 10px;
}

.tag2 {
    font-size: 12px;
    color: #fff;
    background-color: #000;
    padding: 2px 10px;
    border-radius: 22px;
    margin-right: 10px;
}

.word-break-keepall {
    word-break: keep-all;
}


.slide-bottom-txt a {
    color: #000;
    text-decoration: underline;
}


.intro-tit {
    background-color: #FFEAE8;
    text-align: center;
    border-radius: 5px;
    font-size:15px;
    padding-bottom:20px;
}

.intro-tit .tit {
    background-color: #48863C;
    color: #fff;
    text-align: center;
    border-radius: 20px;
    padding: 5px 10px;
    display: inline-block;
    width:80px;
    font-weight: bold;
    margin-top:20px;
}
.intro-tit-txt{font-size:18px; font-weight:bold; color:#FF5548;}




.section01{background-color:#F9F6ED;} 


.section01, .section02, .section03, .section04, .section05{max-width:500px;display:flex; justify-content:center;}
.section01 img, .section02 img, .section03 img, .section04 img, .section05 img{width:360px;}


.btn{max-width:500px; display: flex; justify-content:center;}
.btn img{width:360px}


.wrap-slid{margin:0 auto;}