/* font */
@import url('https://webfontworld.github.io/NanumSquareNeo/NanumSquareNeo.css');
/* @import url(//spoqa.github.io/spoqa-han-sans/css/SpoqaHanSansNeo.css);
@import url('https://webfontworld.github.io/bccard/Paybooc.css');
@import url('https://webfontworld.github.io/goodchoice/Jalnan.css');
@import url('https://webfontworld.github.io/pretendard/Pretendard.css');
@import url('https://webfontworld.github.io/NanumSquare/NanumSquare.css');
@import url('https://webfontworld.github.io/Noto/NotoSansKR.css');
@import url('https://webfontworld.github.io/gmarket/GmarketSans.css');
@import url(https://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url('https://webfontworld.github.io/naver/NanumMyeongjo.css');
@import url('https://webfontworld.github.io/naver/NanumPen.css');
@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
@import url('https://fonts.googleapis.com/css?family=Gamja+Flower:400');
@import url('https://webfontworld.github.io/score/SCoreDream.css');
@font-face {
    font-family: 'SUITE-Regular';
    src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2304-2@1.0/SUITE-Regular.woff2') format('woff2');
    font-weight: 400;
    font-style: normal;
}; */


/* 클릭시 파란박스 방지 */
* {-webkit-tap-highlight-color: transparent}

/* reset */
html {font-size: 16px}
html, body {margin: 0; padding: 0;}
h1, h2, h3, h4, h5, h6, p, a, span, em, strong, del, s, b, blockquote, br, i, u, dl, dt, dd, table, tr, thead, tbody, tfoot, th, td, img, object, form, fieldset, label, input, textarea, select, option, button, header, main, section, aside, footer, nav, article, div, ol, ul, li, pre {
    padding: 0; margin: 0; 
    font-family: 'NanumSquareNeo', sans-serif;
    letter-spacing: -0.01rem; line-height: 1; font-weight: normal; font-size: 1rem; color:#333; box-sizing: border-box; word-break: keep-all;
}




/* 태그속성 지우기 */
a, del, s, u {text-decoration: none;}
em, i {font-style: normal}
ol, ul, li {list-style: none;}
table, tr, td {border-collapse: unset;}
input {border:0; -webkit-appearance: none; -moz-appearance: none; appearance: none; caret-color: #666;}
input,textarea {caret-color: #302e2c;}
input[type='number']::-webkit-inner-spin-button,
input[type='number']::-webkit-outer-spin-button {-webkit-appearance: none; -moz-appearance: none; appearance: none;}
input[type='password']::-ms-reveal,
input[type='password']::-ms-clear {display: none;}
input[type='date'] {background: #fff}
input::-ms-clear {display: none;}
select {-webkit-appearance: none; -moz-appearance: none; appearance: none;}
select::-ms-expand {display: none;}
button {cursor: pointer; background: none; border: 0;}
pre {white-space: pre-line;}

/* 클래스 속성 */
.off {display: none !important;}

/* 반응형 */
@media screen and (max-width: 1279px) {
    html {font-size: 14px}
}
@media screen and (max-width: 767px) {
    html {font-size: 10px}
}

/* IOS 선택 비활성화 */
h1, h2, h3, h4, h5, h6, p, div, img, span, a, em {
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -o-user-select: none;
    user-select: none;
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
}

/* Adsense */
.ads_wrap {display: flex; justify-content: center;}
.ads_main_sm .adsbygoogle {display: inline-block; width: 336px !important; height: 98px !important; margin: 1.5rem;}
.ads_main_mid .adsbygoogle {display: inline-block; width: 336px !important; height: 100px !important; margin: 1rem 0;}
.ads_sub_sm .adsbygoogle {display: inline-block; width: 300px !important; height: 50px !important; margin: 1.5rem;}
.ads_sub_sm2 .adsbygoogle {display: inline-block; width: 100% !important; height: 120px !important; margin: 1rem;}
.ads_main_big .adsbygoogle {display: inline-block; width: 336px !important; height: 280px !important; margin: 1.5rem;}
ins.adsbygoogle[data-ad-status="unfilled"] { display: none !important; }

header {
    height: 55px; background: #fff;
    padding: 0 0.5rem 0 1.5rem;
    position: sticky; top: 0; display: flex;
    align-items: center; border-bottom: 1px solid #ffd0c6 ;
}
header h1 {
    width: 130px;
}
header h1 a {
    width: 100%;
}
header h1 a img {
    width: 100%;
}
main {}
main .bnr {
    padding: 2rem 1.5rem;
}
main .bnr .top {
    display: flex; justify-content: space-between;
}
main .bnr .top p {
    margin-bottom: 1.5rem;
    font-size: 1.6rem; font-weight: 600;
    line-height: 1.4; color: #5b606b;
}
main .bnr .top p span {
    font-size: 2.2rem; font-weight: 900;
    color: #fc6736;
}
main .bnr .top .image {
    width: 76px;
}
main .bnr .top .image img {
    width: 100%;
}
main .bnr a {
    display: flex; justify-content: space-between;
    align-items: center;
    background: #f4f2f2; border-radius: 1rem;
    margin-top: 5rem; padding: 2.5rem 1.5rem;
}
main .bnr a .text {}
main .bnr a .text h2 {
    font-size: 2.2rem; font-weight: 800;
    color: inherit;
}
main .bnr a .text p {
    font-size: 1.4rem; font-weight: bold;
    color: #5b606b; line-height: 1.4;
}
main .bnr a .image {
    width: 95px;
}
main .bnr a .image img {
    width: 100%;
}
main .box {
    display: grid; padding: 2rem 1.5rem;
    gap: 1.5rem;
    grid-template-areas:
        'a a'
        'a a'
    ;
}
main .box a {
    height: 20rem;
    border-radius: 1rem; padding: 1.5rem;
}
main .box a:nth-of-type(1) {
    background: #4bbfa9 url(../images/codeB.png) no-repeat 85% 88% / 45%;
}
main .box a:nth-of-type(2) {
    background: #f98638 url(../images/codeC.png) no-repeat 85% 88% / 45%;
}
main .box a:nth-of-type(3) {
    background: #ef4f4f url(../images/codeD.png) no-repeat 85% 88% / 45%;
}
main .box a:nth-of-type(4) {
    background: #0c2d57 url(../images/codeE.png) no-repeat 85% 88% / 45%;
}
main .box a h3 {
    color: #fff; font-size: 2.2rem;
    margin-bottom: 0.5rem;
    font-weight: 800; line-height: inherit;
}
main .box a p {
    color: #fff; font-size: 1.4rem;
    line-height: 1.4;
}
main .tip {
    padding: 2rem 1.5rem;
}
main .tip h2 {
    margin-bottom: 1.5rem; font-size: 1.6rem;
    font-weight: 800; line-height: 1.4;
    color: #5b606b;
}
main .tip .contents {
    display: flex; justify-content: space-between;
    gap: 1.5rem;
}
main .tip a {
    border-radius: 1rem; 
    padding: 1.5rem; height: 17rem; width: 100%;
}
main .tip a:nth-of-type(1) {
    background: #f9efe8 url(../images/btn-icon-7.png) no-repeat 85% 80% / 40%;
}
main .tip a:nth-of-type(2) {
    background: #e9f0f4 url(../images/btn-icon-6.png) no-repeat 85% 80% / 40%;
}
main .tip a span {
    font-size: 1.6rem; color: #d85903;
    line-height: 1.4; font-weight: 800;
}
main .tip a:nth-of-type(2) span {
    color: #092a55;
}
main .news {
    padding: 2rem 1.5rem;
}
main .news h2 {
    display: flex; justify-content: space-between;
    align-items: center;
    margin-bottom: 1.5rem; font-size: 1.6rem;
    font-weight: 800; line-height: 1.4;
    color: #5b606b;
}
main .news h2 > a{
    color: #fff; border-radius: 1rem;
    font-weight: bold;
    font-size: 1.2rem; padding: 0.7rem 1rem;
    background: #111;
}
main .news .contents {}
main .news .contents a {
    display: block; border-radius: 1rem;
    padding: 1.5rem; box-shadow: 0.1rem 0.1rem 0.3rem rgba(0, 0, 0, .3);
    margin-bottom: 1.3rem;
}
main .news .contents a span {
    font-size: 1.6rem; color: #000;
    font-weight: bold; line-height: 1.4;
}