html {height: 100%;}
body {height: 100%;}

.inner {width: 95%; max-width:1400px; margin:0 auto; }
.flx { display: flex; flex-direction: row; }
.flxCol { display: flex; flex-direction: column; }
.flxMiddle { display: flex; align-items: center; flex-wrap: wrap; }
.flxLeft { display: flex; align-items: flex-start; }
.flxCenter { display: flex; justify-content: center; }
.flxSb { display: flex; justify-content: space-between;}
.flxSe { display: flex; justify-content: space-evenly;}
.flxStart { display: flex; justify-content: flex-start; }
.flxEnd { display: flex; justify-content: flex-end; }
.flxWrap { display: flex; flex-wrap: wrap;}

.fontGB { font-family: 'GmarketSansBold'; }
.fontGM { font-family: 'GmarketSansMedium'; }
.fontGL { font-family: 'GmarketSansLight'; }
.tl { text-align: left; }
.tc { text-align: center; }
.tr { text-align: right; }
Strong { font-family: 'GmarketSansBold'; }
.clrRed { color:#ac232f; }
.clrYellow { color:#ffd200; }
.clrBgBlue { display: inline-block; padding:10px 15px 0; margin-right:10px; border-radius: 9px; background-color:#005fc0; }

h2.section-title { font-size: 5rem; margin: 0 auto; text-align: center; word-break: keep-all;}
h3.section-title { font-size: 4rem; margin: 0 auto; text-align: center; word-break: keep-all;}
h4.sub-title { font-size: 3.5rem; margin: 0 auto; text-align: center; word-break: keep-all;}
.donka-logo { width:367px; height: 96px; background: url('../donka-logo.png') no-repeat 0 0; background-size: contain;}


header { width: 100%; height:90px; position:fixed; left:0; top:0; z-index: 1000; font-size: 1.1rem; }
header.active { background-color: #fff; -webkit-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    -moz-box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);
    box-shadow: 0 0 5px rgba(0, 0, 0, 0.2);  }
.logo {}
.logo h1 { width:181px; height: 47px; background: url('../logo.png') no-repeat 0 0; background-size: contain; margin:0 20px; }
.logo h1 a { display: block; height: 100%;} 

#nav { width: 620px; }
.top-tel { margin:0 20px; }
.top-tel-title { width: 114px; height:34px; background-color: #ac232f; color:#fff; line-height: 36px; text-align: center; border-radius: 34px;}
.top-tel-num { margin-left: 15px; }

#wrap{  }
#main { position:relative; height: 1000px; background: url('../main_bg.png') no-repeat center bottom; background-size: cover; }
.main-title { font-size: 5rem; text-align: center; margin: 0px auto 0; line-height: 1.2; padding-top: 150px; word-break: keep-all;}
.main-stamp { position:absolute; left:50%; top:340px; width:372px; height:256px; background: url('../main_stamp_new.png') no-repeat 0 0; background-size: contain;}


#fixedArea { position: fixed; left:0; bottom:0; width:100%; height:110px; padding:20px 0; z-index: 1000; background-color: #333; font-size: 1.1rem;}
#fixedArea .top-tel-title { width: 114px; height:34px; background-color: #ac232f; color:#fff; line-height: 36px; text-align: center; border-radius: 34px;}
#fixedArea .top-tel-num { margin-left: 15px; color: #fff;}
#fixedArea .top-tel-num a, #fixedArea .top-tel-num a:hover {color: #fff;}
#fixedArea input[type="text"], #fixedArea select { width: 250px; height:45px; margin-right:20px; border:none; border-radius: 8px; padding: 0 10px; font-family: 'Noto Sans KR'; color:#666; }
#fixedArea #csFormSubmit { width:250px; height: 45px; border:none; font-size: 1.2rem; background-color: #ac232f;  border-radius: 8px; }
#fixedArea .mb10 { margin-top: 10px; }
#fixedArea #csAgree+label, #fixedArea label a { color:#fff; font-size: 0.8rem;}


#section01 { min-height:1016px; background-color: #faf6f4; padding:140px 0 150px; }
#section01 .donka-logo { width:367px; height: 96px; }
#section01 .about-txt { font-family: 'Noto Sans KR'; font-size: 1.3rem; color: #666; font-weight: 400; line-height: 1.8; letter-spacing: -0.1; text-align: center; margin: 110px auto 100px; }
#section01 .about-list { width: 95%; max-width:700px; margin: 0 auto;}
#section01 .about-list .about-item { width: 180px; height:180px; border-radius: 50%; background-color: #ac232f; line-height: 1.6; font-size: 1.12rem;  color:#fff; text-align: center;}


#section02 { background-color: #ece5df; padding:130px 0 130px; }
#section02 .section-title { margin-bottom: 90px;}
#section02 .cont { max-width: 95%; max-width: 1215px; margin: 0 auto; }
#section02 .slide-area { position: relative; }
#section02 .swiper {width: 90%; max-width: 1215px;}
#section02 .slide-area03 { height:350; margin-bottom:80px;}
#section02 .swiper-slide { border-radius: 10px; overflow: hidden;}
#section02 .menu-etc-img img { width: 100%; }

#section03 { background-color: #ac232f; padding:130px 0 140px; }
#section03 .section-title { font-size:6rem; color:#fff; } 
#section03 .sub-title { color:#fff; margin:125px 0 85px; word-break: keep-all; }
#section03 .benefit01 .benefit01-box { min-height: 460px; background-color: #fff; border-radius: 30px; margin-bottom: 140px; padding-bottom: 56px; }
#section03 .benefit01 ul {}
#section03 .benefit01 ul li { width: 50%; max-width: 420px; margin: 56px 0 30px;}
#section03 .benefit01 ul li .benefit-icon { width:111px; height:105px; background-size: contain; margin-bottom:28px; } 
#section03 .benefit01 ul li .benefit-icon01 { background: url('../benefit-icon01.png') no-repeat 0 0; }
#section03 .benefit01 ul li .benefit-icon02 { background: url('../benefit-icon02.png') no-repeat 0 0; }
#section03 .benefit01 ul li .benefit-icon03 { background: url('../benefit-icon03.png') no-repeat 0 0; }
#section03 .benefit01 ul li .benefit-icon04 { background: url('../benefit-icon04.png') no-repeat 0 0; }
#section03 .benefit01 ul li .benefit-icon05 { background: url('../benefit-icon05.png') no-repeat 0 0; }
#section03 .benefit01 ul li .benefit-icon06 { background: url('../benefit-icon06.png') no-repeat 0 0; }
#section03 .benefit01 .benefit01-txt { font-size: 2.6rem;}
#section03 .benefit01 .benefit-plus { margin: 60px 0 0;}
#section03 .benefit01 .benefit-plus .plus { width:72px; height:72px; margin-right:14px; background: url('../plus.png') no-repeat 0 0; background-size: contain; }
#section03 .benefit02 ul { gap: 30px; }
#section03 .benefit02 ul li { width:calc(25% - 30px); min-width: 310px; height: 240px; margin-bottom:30px; }
#section03 .benefit02 ul li.benefit-img01 { background: url('../benefit-img01.png') no-repeat 0 0; }
#section03 .benefit02 ul li.benefit-img02 { background: url('../benefit-img02.png') no-repeat 0 0; }
#section03 .benefit02 ul li.benefit-img03 { background: url('../benefit-img03.png') no-repeat 0 0; }
#section03 .benefit02 ul li.benefit-img04 { background: url('../benefit-img04.png') no-repeat 0 0; }
#section03 .benefit02 ul li.benefit-img05 { background: url('../benefit-img05.png') no-repeat 0 0; }
#section03 .benefit02 ul li.benefit-img06 { background: url('../benefit-img06.png') no-repeat 0 0; }
#section03 .benefit02 ul li.benefit-img07 { background: url('../benefit-img07.png') no-repeat 0 0; }
#section03 .benefit02 ul li.benefit-img08 { background: url('../benefit-img08.png') no-repeat 0 0; }
#section03 .benefit02 ul li.benefit-img09 { background: url('../benefit-img09.png') no-repeat 0 0; }
#section03 .benefit02 ul li.benefit-img10 { background: url('../benefit-img10.png') no-repeat 0 0; }
#section03 .benefit02 ul li.benefit-img11 { background: url('../benefit-img11.png') no-repeat 0 0; }

#section04 { background-color: #f4eae6; padding:130px 0 90px;}
#section04 .section-title { } 
#section04 .cont { margin-top: 50px; }
#section04 .cont .news-img { background-color: #fff; border-radius: 20px; margin-bottom: 50px; }
#section04 .cont .news-img a { display: block; height: 100%; text-align: center;}
#section04 .cont .news-img a img { width: 95%; margin: auto; padding: 50px 0; }
#section04 .cont .news-img:first-child a img { max-width: 1125px; width: 95%; margin: auto; padding: 50px 0; }


#section05 { padding:100px 0; }
#section05 > div { flex-wrap: wrap; gap: 30px;}
#section05 > div > div { width: calc(50% - 30px);}
#section05 .cont-img01 img {width: 100%;}
#section05 .section-title { text-align: left; margin: 0 0;}
#section05 .cont ul { margin-top: 50px; }
#section05 .cont ul li { font-size: 1.5rem; margin:15px 0; position: relative; padding-left: 50px;}
#section05 .cont ul li .num { position: absolute; left: 0; width: 36px; height:36px; margin-right:12px; line-height: 40px; border-radius: 6px; text-align: center; background-color: #ac232f; color:#fff; }

#section06 { background-color: #f4eae6; padding: 140px 0 150px; }
#section06 .section-title { color:#ac232f; margin-bottom: 105px; }
#section06 .slide-area { width: 95%; max-width: 1216px; margin: 0 auto; }
#section06 .slide-area01 { margin-bottom:158px;}
#section06 .swiper-slide { border-radius: 20px; overflow: hidden;}

#section07 { background:url('../section07-bg.png') no-repeat center center; background-size: cover; padding:140px 0 150px; }
#section07 .section-title { color:#fff; }
#section07 .cont-box { min-height:240px; margin-top:40px; border-radius: 20px; border: 10px solid #222; background-color: #fff; font-size: 3.2rem; }
#section07 .cont-box:first-child { margin-top: 100px; }
#section07 .cont-box .income { font-size: 3rem; }
#section07 .cont-box .income .fontGB { font-size: 3.8rem;}

#section08 { background-color: #f3f3f3; padding:140px 0 50px; }
#section08 .cont { margin-top:90px; }
#section08 .cont .step-img img { width: 100%; }


#section09 { background-color: #f3f3f3; padding:140px 0 150px; }
#section09 .cont { font-size: 3.8rem;}
#section09 .cost-img img { width: 100%; }
#section09 .arrow-img { width:77px; height: 85px; margin-right: 20px; background:url('../arrow-img.png') no-repeat 0 0; background-size: contain; }


#section10 {  padding:150px 0 150px; }
#section10 .gragh { margin: 92px 0 127px;} 
#section10 .gragh-img img { width: 100%; }
#section10 .cont { text-align: center; font-size: 1.8rem; line-height: 1.6; word-break: keep-all;}


#section11 { background-color: #f4eae6; padding:140px 0 150px; }
#section11 .cont { margin-top:100px; gap:30px; }
#section11 .edu-img01 img { width: 100%; }
#section11 .edu-img02 img { width: 100%; }


#section12 { background:url('../section12-bg.png') no-repeat center center; background-size: cover; padding:140px 0 150px; }
#section12 .section-title { color: #a7d9ff; margin-bottom: 92px;}
#section12 .cont div, #section12 .cont span, #section12 .cont p { color:#fff; text-align: center; word-break: keep-all;}
#section12 .cont .cont-txt01 { font-size: 3rem; line-height: 1.4; margin-bottom: 60px; word-break: keep-all;}
#section12 .cont .nh-img { width: 90%; max-width:452px; height: 61px; margin-right: 20px; display: inline-block; background:url('../nh-img.png') no-repeat 0 0; background-size: contain; }
#section12 .cont .cont-txt02 { font-size: 3.8rem; line-height: 1.6; text-align: center;}
#section12 .cont .cont-txt02 div { margin-bottom:10px; }
#section12 .cont .cont-txt02 .small-txt { font-size: 1.8rem; margin-top:45px; }


#section13 { padding:140px 0 150px; }
#section13 .section-title {}
#section13 .cont { margin-top:50px; }
#section13 select {height: 54px; display: inline-block; padding: 0 10px; border: 1px solid #ddd;}
#section13 .search-area { display: inline-block; margin-bottom: 28px; position:relative; width:350px; height:54px; border: 1px solid #ddd;  }
#section13 .search-area input { font-size:1rem; padding: 0 15px; border:none; width:100%; height:100%; }
#section13 .search-area #search-btn { position:absolute; right:4px; top:4px; }
#section13 .board-store ul li { padding:28px 0 24px; border-bottom:1px solid #ddd; }
#section13 .board-store ul li div{ font-family:'GmarketSansLight'; font-size: 1.4rem; text-align: center; }
#section13 .board-store ul li:first-child { border-top:3px solid #333; border-bottom:3px solid #333;  }
#section13 .board-store ul li:first-child div { font-family:'GmarketSansMedium'; font-size: 1.8rem; }
#section13 .board-store ul li .col-local { width:15%; }
#section13 .board-store ul li .col-name { width:20%; }
#section13 .board-store ul li .col-addr { width:65%; }
#section13 .paging { margin-top: 70px; text-align: center; display: block; }
#section13 .paging b { display: inline-block; width:38px; height:38px; line-height: 38px; border: 1px solid #ac232f; text-align: center; font-size: 1.1rem; color:#fff; background: #ac232f; font-family:'GmarketSansBold'; }
#section13 .paging a { display: inline-block; width:38px; height:38px; line-height: 38px; border: 1px solid #ddd; text-align: center; font-size: 1.1rem; color:#777; font-family:'GmarketSansBold'; }
#section13 .paging .prev-btn a { background:url('../page-prev-img.png') no-repeat center center; }
#section13 .paging .next-btn a { background:url('../page-next-img.png') no-repeat center center; }
#section13 .search-area input[type="image"] { width: 41px; height: 41px; padding: 0; position: absolute; right: 4px; top: 4px; }
tr.trhead { border-top: 3px solid #333; border-bottom: 3px solid #333; }
tr.trhead td { padding: 28px 0 24px; border: none; }
tr.trhead td font { font-family: 'GmarketSansMedium'; font-size: 1.8rem !important; }
.table_02 {border-left: none !important;}
.table_02 td {border-right: 0 !important; padding: 28px 0 24px !important;}
.table_02 tr td { font-family: 'GmarketSansLight'; font-size: 1.4rem; text-align: center; }
.table_02 tr td:first-of-type { color: #ac232f; width:15%; }
.table_02 tr td:nth-of-type(2n) { width:20%; }
.table_02 tr td:last-of-type { width:65%; }
.submitBtn {width: 100% !important; max-width: 365px;}



#section14 { background-color: #eee; padding:140px 0 150px; font-size: 1.2rem;}
#section14 .section-title { margin-bottom: 90px; }
#section14 .donka-logo { width: 100%; max-width:325px; height: 82px; margin-right: 20px; }
#section14 #custForm { width: 100%; max-width: 1215px; margin:0 auto; }
#section14 #custForm > div { margin-bottom:40px; }
#section14 #custForm .ml10 { margin-left:8%; }
#section14 #custForm label { width:16%; font-size: 1.5rem; }
#section14 #custForm input[type="text"], #section14 #custForm select { width:30%; height:60px; border: 1px solid #ccc;  border-radius: 5px; font-size: 1.2rem; padding:0 15px 0;  font-family: 'Noto Sans KR';}
#section14 #custForm #isStore { width:30%; height:60px; background-color: #fff; border: 1px solid #ccc; border-radius: 5px; }
#section14 #custForm #isStore input[type="radio"] { visibility: hidden; width:0px; height:0; padding:0; margin:0; }
#section14 #custForm #isStore button { width: 50%; height:100%; border: none; color:#333; font-size: 1.2rem; }
#section14 #custForm #isStore button.on { background-color: #333; color:#fff; }
#section14 #custForm #custContentArea { width: 84%; text-align: left; }
#section14 #custForm textarea { width:100%; height:200px; margin-bottom: 10px; border: 1px solid #ccc; border-radius: 5px; }
#section14 #custForm #custAgree { }
#section14 #custForm #custAgree+label { font-size: 1rem; }
#section14 #custForm #custFormSubmit { display: block; width:365px; height:80px; margin:70px auto 0;  border-radius: 5px; background-color: #ac232f; color:#fff; text-align: center; font-size: 1.6rem;}


footer { min-height:400px; font-size: 1.1rem; padding-bottom: 120px; }
footer .fnb { height: 120px; }
footer .fnb ul li { margin-right:40px; padding: 30px 20px; }
footer .footer-inner .donka-logo { width:178px; height:48px; margin: 0 100px 0 0; } 
footer .footer-inner .company-info { line-height: 2; color:#777; }
a.kakaoBtn { position: fixed; right: 2%; bottom: 120px; z-index: 1000;}
a.kakaoBtn img { width: 70px; height: 70px;}
.mo {display: none;}
#fixedArea .top-tel { margin-left: 0; }

@media screen and (max-width: 1185px) {
    header .top-tel {display: none;}
}

@media screen and (max-width: 1460px) {
    #section03 .benefit02 ul li {width: calc(33.3% - 30px); background-position: center !important;}
}

@media screen and (max-width: 1394px) {
    #fixedArea .top-tel {display: none;}
    #fixedArea .flx { justify-content: center; }
}

@media screen and (max-width: 1090px) {
    #section03 .benefit02 ul li {width: calc(50% - 30px);}
    h2.section-title {font-size: 4rem;}
    #fixedArea .top-tel {display: block; margin-right: 0;}
    #fixedArea .flx { justify-content: center; display: flex;}
    #fixedArea .top-tel-title {height: 70px; line-height: 70px; width: 250px; font-size: 25px;}
    #fixedArea .top-tel-num {font-size: 25px;}
    #fixedArea .csform {display: none;}
}

@media screen and (max-width: 960px) {
    #section05 > div > div {width: 100%;}
    #section07 .cont-box { flex-direction: column; padding: 20px 0; row-gap: 30px;}
}

@media screen and (max-width: 902px) {
    #nav { width: 493px; }
}

@media screen and (max-width: 768px) {
    .web {display: none;}
    .mo {display: block;}
    #main { position:relative; background: url('../m-main-bg.png') no-repeat center bottom; background-size: cover; }
    .main-title {font-size: 4rem;}
    .main-stamp {left: auto; right: 0; width: 262px; height: 180px; background-size: cover;}
    #section09 .cost-img img {border-radius: 20px; margin: 50px 0;}
    #section09 .arrow-m { flex-direction: column; align-items: center; row-gap: 30px; text-align: center; font-size: 3rem; }
    #section09 .arrow-img {transform: rotate(90deg); margin-right: 0;}
    #section11 .cont { flex-direction: column; }
    .table_02 {border: none !important;}
    .table_02 tr.trhead {display: none;}
    .table_02 tr { display:block; margin-bottom:10px; border-top:none; height: auto;}
    .table_02 th, .table_02 tr td { display:block; position:relative; padding:10px 0 !important; padding-left:30% !important; border-width:0 0 1px 0; width: 100% !important;}
    .table_02 tr td:before { display:flex; position:absolute; left:0; top:0; width:30%; padding:10px 0; background:#ccc; justify-content: center; align-items: center; height: 100%;}
    .table_02 tr td:nth-child(1):before {content:'\c9c0\c5ed';}
    .table_02 tr td:nth-child(2):before {content:'\b9e4\c7a5\ba85';}
    .table_02 tr td:nth-child(3):before {content:'\c8fc\c18c';}
    .flxEnd { display: flex; justify-content: center; flex-direction: column; flex-wrap: wrap; align-items: center; }
    .flxEnd form {width: 100%; display: flex; justify-content: center; flex-direction: column; flex-wrap: wrap; align-items: center; row-gap: 10px; }
    #section13 select, #section13 .search-area {width: 100%; max-width: 350px;}
    .formWrap { flex-direction: column; }
    #section14 #custForm label {width: 100%; margin-top: 40px; margin-bottom: 10px;}
    #section14 #custForm input[type="text"], #section14 #custForm select, #section14 #custForm #isStore, #section14 #custForm #custContentArea {width: 100%;}
    #section14 #custForm .ml10 {margin-left: 0;}
    #section14 #custForm > div {margin-bottom: 0;}
    .flxCenter { flex-direction: column; align-items: center; }
    #section03 .section-title {font-size: 4rem;}
    #section03 .sub-title {margin: 80px 0;}
    #section03 .benefit01 ul {flex-direction: row;}
    #section03 .benefit01 .benefit01-txt {display: flex; flex-direction: column; align-items: center;}
    #section03 .benefit01 .benefit-plus .plus {margin-right: 0; margin-bottom: 14px;}
    #section03 .benefit01 .benefit01-box {margin-bottom: 80px;}
    #section14 .donka-logo {margin-right: 0;}

    .swiper-button-prev, .swiper-rtl .swiper-button-next {left: 0 !important;}
    .swiper-button-next, .swiper-rtl .swiper-button-prev {right: 0 !important;}
    #section02 .swiper {width: 80%;}
}

@media screen and (max-width: 722px) {
    #section03 .benefit02 ul li {width: 100%; gap: 0;}
    #section01 .about-list { justify-content: center; flex-wrap: wrap; gap: 30px;}
    footer .fnb ul {justify-content: center; padding: 30px 0;}
    footer .fnb ul li {margin: 0 10px; padding: 5px 0; }
    footer .footer-inner { justify-content: center;}
    footer .footer-inner > div { margin-right: 0 !important;}
    footer .footer-inner .company-info {margin-top: 20px; font-size: 14px; text-align: center;}
}

@media screen and (max-width: 430px) {
    .main-title, h2.section-title { font-size: 3.5rem; }
    #section01, #section02, #section03, #section04, #section05, #section06, #section07, #section08, #section09, #section10, #section11, #section12, #section13, #section14 {padding: 20% 0;}
    #section03 .sub-title {margin: 30px 0; font-size: 3rem;}
    #section01 .about-list .about-item {width: 150px; height: 150px; font-size: 1rem;}
    #section01 .about-txt {margin: 80px auto;}
    #section06 .section-title, #section06 .slide-area01 {margin-bottom: 80px;}
    #section07 .cont-box:first-child {margin-top: 80px;}
    #section07 .cont-box .income .fontGB, #section09 .arrow-m {font-size: 2.8rem;}
    h3.section-title {font-size: 3rem;}
    #section12 .section-title, #section14 .section-title {margin-bottom: 60px;}
    #section12 .cont .cont-txt01 {font-size: 2rem;}
    .clrBgBlue {margin-right: 0;}
    #section11 .cont {margin-top: 30px;}
    #section12 .cont .cont-txt02 {font-size: 2.8rem;}
    #section12 .cont div, #section12 .cont span, #section12 .cont p {margin-bottom: 10px;}
    #fixedArea .top-tel-title {width: 200px;}
}

@media screen and (max-width: 375px) {
    .main-title, h2.section-title { font-size: 3rem; }
    #section01 .donka-logo {width: 90%; max-width: 367px;}
    #section09 .arrow-m {font-size: 2.5rem;}
    #fixedArea .top-tel-title {width: 150px;}
}

@media screen and (max-width: 360px) {
    #section03 .sub-title, #section07 .cont-box .income .fontGB, #section09 .arrow-m, #section07 .cont-box, #section07 .cont-box .income {font-size: 2.5rem;}
    #section07 .cont-box:first-child {margin-top: 50px;}
    #section14 .section-title {margin-bottom: 60px;}
    #section14 #custForm #custAgree+label a { display: block; text-align: center; margin-top: 10px }
    .submitBtn {margin-top: 40px !important;}
    h3.section-title {font-size: 2rem;}
    #section10 .cont, #section12 .cont .cont-txt02 .small-txt {font-size: 1.5rem;}
    #section03 .benefit02 ul li {min-width: 300px;}
    #section03 .benefit01 .benefit-plus {margin-top: 30px;}
    #section01 .about-txt {margin: 50px auto;}

}

@media screen and (max-width: 340px) {
    #section01 .about-list .about-item {width: 125px; height: 125px; font-size: 0.8rem;}
    #section03 .benefit01 ul li {width: 100%; margin: 20px 0;}
    #section09 .arrow-m {font-size: 2rem;}
    h3.section-title {font-size: 2.5rem;}
    #fixedArea .top-tel-num {font-size: 24.5px;}
}