:root{
    /* 글자크기 */
    --text14 : 0.875rem;  /* 14px */
    --text16 : 1rem;      /* 16px */
    --text18 : 1.125rem;  /* 18px */
    --text20 : 1.25rem;   /* 20px */
    --text22 : 1.375rem;  /* 22px */
    --text24 : 1.5rem;    /* 24px */
    --text30 : 1.875rem;  /* 30px */
    --text32 : 2rem;      /* 32px */
    --text35 : 2.1875rem; /* 35px */
    --text45 : 2.8125rem; /* 45px */
    --text120: 7.5rem;    /* 120px */

    /* 색상 */
    --white : #fff;
    --black : #000;
    --orange : #FF6B00; 
    --grey : #B2B2B2;  
    --dark-grey :#444; 
    --deep-grey : #333;  
    --bg-orange : #FF9326;
    --bg-orange2 : #FFF5EF;
    --bg-grey : #F9F7F6;
    --yellow : #FFCC00;
    --tit-grey : #382F29;
    --text-grey : #666;

    /* 그라데이션 */
    --orange-gradient1 : linear-gradient(125deg,rgba(255, 107, 0, 1) 0%, rgba(255, 187, 77, 0.2) 90%);
    --orange-gradient2 : linear-gradient(125deg,rgba(255, 107, 0, 1) 0%, rgba(255, 187, 77, 1) 90%);

    /* 그림자 */
    --shadow-orange : 0 4px 16px rgba(255,107,0,0.3);
    --shadow-black1 : 0 4px 16px rgba(0,0,0,0.09);
    --shadow-black2 : 0 4px 16px rgba(0,0,0,0.1);
}
@media all and (max-width: 768px) { 
    :root {
        --text14 : 0.6875rem;  /* 11px */
        --text16 : 0.8125rem;  /* 13px */
        --text18 : 0.9375rem;  /* 15px */
        --text20 : 1.0625rem;  /* 17px */
        --text22 : 1.0625rem;  /* 17px */
        --text24 : 1.125rem;   /* 18px */
        --text30 : 1.3125rem;  /* 21px ↓*/
        --text32 : 1.375rem;   /* 22px ↓↓↓ */
        --text35 : 1.45rem; 
        --text45 : 1.75rem;    /* 28px ↓↓↓ */
        --text120: 2.5rem;     /* 40px ↓↓↓ */
      }
}


/*공통*/
#wrap .orange{color:var(--orange);}
#wrap .inner{width:1200px;margin:0 auto;}
#wrap br.pc_only{display:inline;}
#wrap br.m_only{display:cotnents;}
@media all and (max-width: 1199px) { 
	#wrap .inner{width:100%;padding:0 4%;}
}
@media all and (max-width: 768px) { 
    #wrap br.pc_only{display:contents;}
    #wrap br.m_only{display:inline;}
}

/*헤더*/
#header{width:100%;height:80px;background:#fff;position:sticky;inset:0;z-index:999;}
#header.is-scroll{box-shadow:var(--shadow-black1);} 
#header .inner{height:100%;display:flex;align-items:center;justify-content:space-between;}
#header h1{width:156px;}
#header h1 img{width:100%;}
#header .gnb ul{display:flex;}
#header .gnb ul li{flex:0 0 auto;}
#header .gnb ul li a{display:block;font-size:var(--text20);font-weight:600;color:#1D1D1D;padding:28px 40px;}
#header .gnb ul li.m_only{display:none;}
#header .btn_app{flex:0 0 auto;color:var(--white);background:var(--orange);border-radius:100px;font-size:var(--text18);font-weight:600;padding:11px 36px;box-shadow:var(--shadow-orange);}
#header .btn_menu {display: none;width: 2.5rem;height: 2.5rem;padding: 0;border: 0;background: transparent;position: relative;cursor: pointer;}
#header .btn_menu span {display: block;position: absolute;left: 50%;width: 1.5rem;height: 3px;background:var(--orange);transform: translateX(-50%);transition: all 0.3s ease;}
#header .btn_menu span:nth-child(1) {top: 0.7rem;}
#header .btn_menu span:nth-child(2) {top: 1.2rem;}
#header .btn_menu span:nth-child(3) {top: 1.7rem;}
#header.menu-open .btn_menu span:nth-child(1) {top: 1.2rem;transform: translateX(-50%) rotate(45deg);}
#header.menu-open .btn_menu span:nth-child(2) {opacity: 0;}
#header.menu-open .btn_menu span:nth-child(3) {top: 1.2rem;transform: translateX(-50%) rotate(-45deg);}
@media all and (max-width: 1080px) { 
    #header .gnb{position: absolute;left: 0;top: 80px;width: 100%;}
    #header .gnb ul{display:block;background:rgba(255,107,0,0.8);backdrop-filter: blur(5px);max-height:0;overflow:hidden;transition:0.5s;}
    #header .gnb ul li{width:100%;}
    #header .gnb ul li a{color:var(--white);text-shadow:var(--shadow-black1);padding:20px 0;text-align:center;font-size:var(--text24);}
    #header.menu-open .gnb ul{max-height:100vh;}
    #header .btn_app{margin-right:3.5rem;}
	#header .btn_menu {display: block;position:absolute;right:4%;top:50%;transform:translateY(-50%);}
    
}
@media all and (max-width: 768px) { 
    #header .btn_app{display:none;}
    #header .gnb ul li.m_only{display:block;}
}
/*섹션 공통*/
#wrap .main_section{width:100%;padding:140px 0;text-align:center;line-height:1.6;}
#wrap .main_section h2{font-size:var(--text45);line-height:1.4;font-family:"STUNNING", "Pretendard", "맑은 고딕", sans-serif;}
#wrap .main_section h2 em{font-size:var(--text20);color:var(--orange);font-style:normal;display:block;letter-spacing:0.3rem;margin-bottom:20px;}
#wrap .main_section .sec_txt{font-size:var(--text20);color:var(--text-grey);margin-top:50px;}
@media all and (max-width: 1080px) { 
    #wrap .main_section{padding:80px 0;}  
    #wrap .main_section h2 em{margin-bottom:15px;}
    #wrap .main_section .sec_txt{margin-top:35px;}
}
@media all and (max-width: 768px) { 
    #wrap .main_section{padding:60px 0;}
    #wrap .main_section h2 em{margin-bottom:10px;}
    #wrap .main_section .sec_txt{margin-top:20px;}
}
/*메인 비주얼*/
#wrap .dk_visual{width:100%;height:850px;background:url(../images/main_visual.jpg) 50% bottom no-repeat #fefff9;background-size:cover;}
#wrap .dk_visual .inner{display: flex;align-items: flex-start;flex-flow: column;justify-content: center;height: 100%;}
#wrap .dk_visual .txt_wrap{font-size:var(--text20);color:var(--white);background:var(--ogran);}
#wrap .dk_visual .txt_wrap em{background:rgba(255,107,0,0.75);color:var(--white);font-style: normal;opacity:0.7;font-size:var(--text20);font-weight:600;padding:10px 30px;letter-spacing: 0.1em;border-radius:100px;}
#wrap .dk_visual .txt_wrap h2{width:328px;margin-top:30px;}
#wrap .dk_visual .txt_wrap h2 img{width:100%;}
#wrap .dk_visual .txt_wrap p{margin-top:40px;color:var(--text-grey);font-size:var(--text20);line-height:1.4;text-shadow: 0 0 4px rgba(255, 255, 255, 0.9);}
#wrap .dk_visual .btn_wrap{margin-top:40px;display:flex;gap:20px;}
#wrap .dk_visual .btn_wrap a{width:180px;display: inline-flex;align-items: center;gap: 10px;background:var(--white);color:var(--black);font-size:var(--text16);box-shadow: var(--shadow-black1);padding:15px 30px;justify-content:center;font-weight:600;border-radius:100px;}
#wrap .dk_visual .btn_wrap a i{display:inline-block;height:20px;}
#wrap .dk_visual .btn_wrap a i img{height:100%;}
@media all and (max-width: 1080px) {	
    #wrap .dk_visual{height:780px;}
    #wrap .dk_visual{background-size:120%;}
    #wrap .dk_visual .btn_wrap #qrBtn{display:none;}
}
@media all and (max-width: 768px) { 
    #wrap .dk_visual{height:fit-content;background:url(../images/main_visual_m.jpg) 50% bottom no-repeat #fefff9;background-size: contain;padding-top:40px;padding-bottom:470px;}
    #wrap .dk_visual .inner{justify-content:flex-start;}
    #wrap .dk_visual .txt_wrap{width:100%;text-align:center;}
    #wrap .dk_visual .txt_wrap h2{width: 100%; padding: 0 15%;margin-top:20px;}
    #wrap .dk_visual .txt_wrap p{margin-top:30px;font-size:var(--text18);}
    #wrap .dk_visual .btn_wrap{width: 100%; justify-content: center;flex-wrap:wrap;}
    #wrap .dk_visual .btn_wrap a{flex:0 0 100%;width:auto;font-size:var(--text20);}
    
}
@media all and (max-width: 460px) { 
    #wrap .dk_visual{padding-bottom:250px;}
}
#wrap .modal {position: fixed;top: 0;left: 0;width: 100%;height: 100%;background: rgba(0,0,0,0.5);display: none;align-items: center;justify-content: center;z-index: 9999;}
#wrap .modal p{font-size:var(--text16);color:var(--text-grey);}
#wrap .modal.active {display: flex;}
#wrap .modal-content {background: #fff;padding: 2rem;border-radius: 1rem;text-align: center;position: relative;width: 300px;}
#wrap .modal-close {position: absolute;top: 10px;right: 20px;font-size: 2rem;border: none;background: none;cursor: pointer;color: var(--grey);}
#wrap .qr-img {width: 200px;margin-top: 1rem;}

/*당나귀, 무엇인가요?*/
.dk_introduce{}
.dk_introduce .feature_box{margin-top:90px;}
.dk_introduce .feature_box ul{display:flex;align-items:center;}
.dk_introduce .feature_box ul:nth-child(even){flex-flow:row-reverse;}
.dk_introduce .feature_box ul li{flex:0 0 50%;}
.dk_introduce .feature_box ul li.pic{height:360px;background:var(--orange-gradient1);border-radius:40px;}
.dk_introduce .feature_box ul li.pic img{height:100%;}
.dk_introduce .feature_box ul li.txt{text-align:left;padding:0 60px;}
.dk_introduce .feature_box ul li.txt h3{color:var(--tit-grey);font-size:var(--text35);font-weight:600;}
.dk_introduce .feature_box ul li.txt h3 em{font-size:var(--text16);display:block;color:rgba(255,107,0,0.5);margin-bottom:12px;}
.dk_introduce .feature_box ul li.txt p{color:var(--text-grey);font-size:var(--text18);margin-top:12px;}
@media all and (max-width: 1080px) { 
	.dk_introduce .feature_box{margin-top:50px;}
    .dk_introduce .feature_box ul li.pic{height:300px;border-radius:30px;}
    .dk_introduce .feature_box ul li.txt{padding:40px;}
}
@media all and (max-width: 768px) { 
    .dk_introduce .feature_box{margin-top:35px;}
    .dk_introduce .feature_box ul{display:block;}
    .dk_introduce .feature_box ul li.pic{height:190px;border-radius:20px;}
    .dk_introduce .feature_box ul li.txt{padding:30px;text-align:center;padding: 15px 10px 30px;}
    .dk_introduce .feature_box ul li.txt h3 em{margin-bottom:0;}
    .dk_introduce .feature_box ul li.txt p{margin-top:5px;}
}

/*사용자 후기*/
.dk_reviews{background:var(--bg-grey);overflow:hidden;}
.dk_reviews .review_slide{width:110%;margin-top:90px;overflow:visible !important;margin-left:-5%;}
.dk_reviews .review_slide .swiper-wrapper{align-items:stretch;}
.dk_reviews .review_slide .swiper-slide{position:relative;background:var(--white);padding:40px;border-radius:40px;text-align:left;box-shadow:var(--shadow-black1);}
.dk_reviews .review_slide .swiper-slide .user{position:relative;display:flex;gap:20px;align-items: center;}
.dk_reviews .review_slide .swiper-slide .user:before{content:'';display:block;width:40%;height:36px;background:url(../images/star.svg) 0 0 no-repeat;background-size:contain;position:absolute;right:0;top:0;}
.dk_reviews .review_slide .swiper-slide .user .name{color:var(--tit-grey);font-size:var(--text24);font-weight:600;}
.dk_reviews .review_slide .swiper-slide .user .name span{color:var(--text-grey);font-size:var(--text16);font-weight:400;display:block;}
.dk_reviews .review_slide .swiper-slide p{color:var(--text-grey);font-size:var(--text16);margin-top:30px;}
@media all and (max-width: 1199px) { 
    .dk_reviews .review_slide{padding:0 20px;width:100%;margin-left:0;}
    .dk_reviews .review_slide .swiper-slide .user:before{width:90px;top:10px;}
}
@media all and (max-width: 1080px) { 
    .dk_reviews .review_slide{margin-top:50px;}
    .dk_reviews .review_slide .swiper-slide{padding:30px;border-radius:20px;}
}
@media all and (max-width: 768px) { 
    .dk_reviews .review_slide{margin-top:35px;}

}

/*이용방법*/
.dk_usage{background:var(--bg-orange);}
.dk_usage h2{color:var(--white);}
.dk_usage h2 em{color:#FFECA1 !important;}
.dk_usage .sec_txt{color:var(--white) !important;}
.dk_usage .process_box{margin-top:90px;display: flex;flex-wrap:wrap;gap:30px;row-gap:60px;}
.dk_usage .process_box .box{flex:0 0 calc(100% / 2 - 15px);background:var(--white);padding:60px 40px;border-radius:40px;text-align:center;box-shadow:var(--shadow-black2);}
.dk_usage .process_box .box h3{width:50px;line-height:50px;background:#4A3D34;color:var(--white);font-weight:600;font-size:var(--text20);border-radius:100px;text-align:center; margin: -84px auto 33px;box-shadow:var(--shadow-orange);}
.dk_usage .process_box .box dl{}
.dk_usage .process_box .box dl dt{font-size:var(--text30);font-weight:600;color:var(--tit-grey);}
.dk_usage .process_box .box dl dd{font-size:var(--text16);color:var(--text-grey);margin-top:12px;}
@media all and (max-width: 1080px) { 
	.dk_usage .process_box .box{padding:60px 40px 40px;}
    .dk_usage .process_box .box img{height:85px;}
}
@media all and (max-width: 768px) { 
    .dk_usage .process_box{margin-top: 50px;gap:50px;}
    .dk_usage .process_box .box{flex:0 0 100%;border-radius:20px;padding:60px 20px 40px;}
}

/*기존 vs 당나귀*/
.dk_compare{background:var(--bg-orange2);}
.dk_compare .compare_box{display:flex;justify-content:center;gap:60px;margin-top:90px;}
.dk_compare .compare_box .box{width:460px;border-radius:40px;padding:6px;}
.dk_compare .compare_box .box h3{color:var(--white);font-size:var(--text32);font-weight:600;padding:45px 0;}
.dk_compare .compare_box .box ul{width:100%;background:var(--white);border-radius:40px;overflow:hidden;}
.dk_compare .compare_box .box ul li{border-top:1px solid #ddd;padding:20px;font-size:var(--text22);color:var(--text-grey);}
.dk_compare .compare_box .box ul li:first-child{border-top:0;}
.dk_compare .compare_box .box1{box-shadow:var(--shadow-black2);background:var(--grey);}
.dk_compare .compare_box .box2{box-shadow:var(--shadow-orange);background:var(--orange-gradient2);}
.dk_compare .compare_box .box2 ul li{color:var(--deep-grey);}
@media all and (max-width: 1080px) { 
	.dk_compare .compare_box{gap:30px;margin-top:50px;}
}
@media all and (max-width: 768px) { 
    .dk_compare .compare_box{flex-wrap:wrap;margin-top:35px;}
    .dk_compare .compare_box .box{flex:0 0 100%;border-radius:30px;}
    .dk_compare .compare_box .box h3{font-size:var(--text30);padding:15px 0;}
    .dk_compare .compare_box .box ul{border-radius:30px;}
    .dk_compare .compare_box .box ul li{padding:10px;font-size: var(--text18);}
}

/*지금 시작하세요*/
.dk_application{background:url(../images/app_bg_img.jpg) bottom center no-repeat #fff;background-size: cover;}
.dk_application .btn_wrap{margin-top:80px;display:flex;gap:20px;justify-content:center;}
.dk_application .btn_wrap a{width:250px;display: inline-flex;align-items: center;gap: 10px;background:var(--orange);color:var(--white);font-size:var(--text24);padding:15px 35px;font-weight:600;border-radius:100px;justify-content: center;box-shadow:var(--shadow-orange);}
.dk_application .btn_wrap a i{display:inline-block;height:27px;}
.dk_application .btn_wrap a i img{height:100%;}
.dk_application .btn_wrap a i{display:inline-block;width:25px;}
.dk_application .people_list{display: flex;flex-flow: column;margin-top:80px;position:relative;}
.dk_application .people_list .txt{width:580px;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);}
.dk_application .people_list .txt img{width:100%;}
.dk_application .people_list ul{display:flex;flex-wrap:wrap;justify-content:center;gap:40px;row-gap:176px;}
.dk_application .people_list ul li{flex:0 0 calc(100% / 5 - 40px);flex-flow: column;background:var(--white);color:var(--text-grey);font-size:var(--text16);box-shadow:var(--shadow-orange);text-align:center;font-weight:600;display:inline-flex;align-items:center;justify-content:center;border-radius:100px;aspect-ratio: 1 / 1;}
@media all and (max-width: 1080px) { 
    .dk_application{background-size:contain;}
    .dk_application .btn_wrap{margin-top:50px;}
    .dk_application .btn_wrap a{width:40%;}
    .dk_application .people_list{margin-top:50px;}
	.dk_application .people_list ul{gap:20px;row-gap:160px;}
    .dk_application .people_list ul li img{width:70px;}
    .dk_application .people_list .txt{width:65%;}
}
@media all and (max-width: 768px) { 
    .dk_application .btn_wrap{flex-wrap:wrap;row-gap:20px;margin-top:35px;}
    .dk_application .btn_wrap a{width:100%;padding:10px 0;}
    .dk_application .people_list{gap:40px;}
    .dk_application .people_list .txt{width:100%;order:2;position:relative;left:auto;top:auto;transform:none;padding:0 20px;}
    .dk_application .people_list ul{gap:20px;row-gap:20px;}
    .dk_application .people_list ul li{flex: 0 0 25%;}
    .dk_application .people_list ul li img{width:60%;}
}

/*푸터*/
#wrap footer{background:#444;padding:40px 0;}
#wrap footer .inner{display:flex;align-items: flex-start;gap:55px;}
#wrap footer .inner .f_txt .f_info{font-size:var(--text16);line-height:1.4;color:var(--white);opacity:0.8;font-weight:400;}
#wrap footer .inner .f_txt .f_info span{margin-right:35px;}
#wrap footer .inner .f_txt .copy{font-size:var(--text14);color:var(--white);opacity:0.5;margin-top:22px;}
@media all and (max-width: 1080px) { 
    #wrap footer .inner .f_txt .f_info span{margin-right:20px;}
}
@media all and (max-width: 768px) { 
    #wrap footer .inner{flex-flow:column;gap:20px;}
}