@charset "UTF-8";

/* 메인 상단 */
/* 이미지 오버레이 */
.content .content_head {
  position: relative; /* absolute 기준 */
}

.content .content_head .head_inner{position:relative;max-width:1040px;margin:0 auto;}

.content .content_head .bg01 {
  position: absolute;
  bottom: 120px;    /* 위쪽 여백 */
  left: calc(50% - 520px - 60px);  /* 왼쪽으로 살짝 나가게 */
  width: 430px; /* 이미지 크기 조절 */
  animation: floatY 4s ease-in-out infinite;
  z-index: 2;
}

.content .content_head .bg02 {
  position: absolute;
  bottom: 420px; /* 아래쪽 여백 */
  right: calc(50% - 520px - 360px); /* 오른쪽으로 살짝 나가게 */
  width: 330px;
  animation: floatY 4s ease-in-out infinite;
  z-index: 2;
}

@keyframes floatY {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50% { transform: translateX(-50%) translateY(-15px); }
}

.content .content_head .bg03 {position:absolute; top:0; z-index:-1; width:100%; display:block;}
.content .content_head {width:100%; max-width:none; margin:0; background:linear-gradient(to bottom,#58A1FE 22%,#F9D7FF 83%,#FFFDFE 100%); overflow:hidden; z-index:0;}
.content .content_head .title_wrap {gap: 0;}
.content .content_head p.tit {padding:5px 24px; margin-bottom:32px; font-weight:400; border-radius:50px; border:1px solid #36CDFF; color:#36CDFF;}

.content .content_head p.des {font-size: 20px; line-height: 160%; color:#8199C0;}
.content .content_head .btn_wrap .btn_general {color:#fff; cursor:pointer; padding:10px 50px 10px 50px; font-size:24px; background:linear-gradient(45deg, #3469B8, #073780); border-radius:60px; position:absolute; z-index:1; top:350px;}
.content .content_head .btn_wrap .btn_general:hover {background:linear-gradient(45deg, #3166b6, #053275);}

.content .content_head .visual_wrap {padding:70px 0 110px; margin:70px auto 0; max-width:100%; display:flex; justify-content:center; background-color: #fff; border-radius:32px;}
.content .content_head .visual_wrap img {max-width:60%; border-radius:0;}
.content .content_head .visual_wrap .visual_text {padding: 32px 0 40px; }
.content .content_head .visual_wrap .visual_text dl {display: flex; flex-direction: row; align-items: flex-start; gap:20px; margin:14px 0;}
.content .content_head .visual_wrap .visual_text dt {padding: 5px 20px 6px; font-size: 20px; color: #fff; background-color: #23C4FF; border-radius: 30px;}
.content .content_head .visual_wrap .visual_text dd {font-size: 20px; color: #333; line-height: 160%; padding-top: 4px; text-align:left;}
.content .content_head .visual_wrap .visual_text .desc {font-size: 18px; font-weight: 300; color:#9f9f9f;}

/* 바디영역 공통 */
.content h3 {margin-bottom:52px; color:#fff; font-size:48px;}
.content .point {color:#4CAEFF;}
.content .sub {color:#2DEBFF; font-size:18px;}
.content h4 {margin-bottom:8px; font-size:48px; font-weight:700; letter-spacing:-1.8px; line-height:160%; color:#333;}
.content h5 {margin-bottom:8px; font-size:28px; font-weight:300; letter-spacing:-1.8px; line-height:160%; color:#fff;}
.content h5 b {font-weight:700;}
.content .link {font-size:18px; color:#888; cursor:pointer;}

/* 혜택 */
.content .area_benefit {width:100%; padding:100px 0 60px; position:relative; z-index:0; background-color:#2F3B4F; display: flex; flex-direction:column; align-items:center;}
.content .area_benefit h4 {font-size:48px; color:#fff; line-height:140%; margin:20px 0 14px 0;}
.content .area_benefit h5 {font-size:28px; color:#333; line-height: 140%; font-weight: 600; margin:20px 0 11px;}
.content .area_benefit .text_wrap p {font-size:20px; color:#888; margin:0px 0 20px;}
.content .area_benefit .card_vertical {margin-top:50px; z-index:1; position:relative; width:100%; max-width:1080px; display:flex; flex-direction:row; align-items:flex-start; justify-content:center; gap:24px;}
.content .area_benefit .card_vertical .card {width:100%; position:relative; display:flex; flex-direction:column; background-color:#fff; border-radius:24px;}
.content .area_benefit .card_vertical .card .text_wrap {padding:50px 40px 50px;}
.content .area_benefit .card_vertical .card img {margin-top:20px;}
.content .area_benefit .card_vertical .card img.pc {display:block;}
.content .area_benefit .card_vertical .card img.mo {display:none;}
.content .area_benefit .notice {font-size:20px; color:#C8C8C8; margin-top:30px;}
.content .area_benefit .notice .mint {color:#2DEBFF;}
.content .area_benefit .bg01 {position:absolute; max-width:110%; top:140px; z-index:-2;}

/* 추가혜택 */
.content .area_add {width:100%; padding:100px 0 60px; position:relative; background-color:#fff; display:flex; flex-direction:column; align-items:center;}
.content .area_add h4 {font-size:48px; text-align:center; color:#333; line-height:140%; margin-bottom:60px;}
.content .area_add .text_wrap {padding:40px 0; display:flex; flex-direction:column; align-items:center; gap:10px;}
.content .area_add .text_wrap p {font-size:20px; color:#333; margin-top: 10px;}
.content .area_add .card_vertical {width:100%; max-width:1000px; display:flex; flex-direction:row; align-items:flex-start; justify-content:center; gap:24px;}
.content .area_add .card_vertical .card {width:100%; display:flex; flex-direction:column; background-color:#F5F6F8; border-radius:24px;}

/* 배너 */
.content .area_banner {max-width:1000px; margin:0 auto;}
.content .area_banner a {cursor:pointer;}

/* 추가혜택 */
.content .area_feature {width:100%; padding:140px 0 60px; position:relative; background-color:#fff; display:flex; flex-direction:column; align-items:center;}
.content .area_feature h4 {font-size:48px; color:#333; line-height:140%; }
.content .area_feature p {font-size:20px; color:#888; margin-top: 10px;}
.content .area_feature ul {max-width:1000px; margin-top:60px; padding:40px 140px; border-radius:30px; background-color:#EEF9FF; display:flex; flex-direction:column; gap:10px;}
.content .area_feature ul li {display:flex; gap:30px; border-bottom:1px solid #C5EBFF; padding:30px 0;}
.content .area_feature ul li:last-child {border-bottom:none;}
.content .area_feature ul li .text_wrap {display:flex; flex-direction:column;}
.content .area_feature ul li .tit {font-size:28px; color:#2688FF; font-weight:600;}
.content .area_feature ul li .txt {font-size:22px; color:#747474; margin-top: 10px;}

.content .area_feature .card_vertical {width:100%; max-width:1000px; display:flex; flex-direction:row; align-items:flex-start; justify-content:center; gap:24px;}
.content .area_feature .card_vertical .card {width:100%; display:flex; flex-direction:column; background-color:#F5F6F8; border-radius:24px;}

.content .btn_wrap .btn_round_sub {cursor:pointer; color:#fff; width:100%; padding:20px 50px; background-color:#3469B8; border-radius:60px; z-index:1;}
.content .btn_wrap .btn_round_sub:hover {background-color:#295aa3;}

.content .ic_service01 {width:80px; height:80px; background:url("./images/ic_service01.png"); display:inline-block;}
.content .ic_service02 {width:80px; height:82px; background:url("./images/ic_service02.png"); display:inline-block;}
.content .ic_service03 {width:63px; height:78px; background:url("./images/ic_service03.png"); display:inline-block;}
.content .ic_benefit01 {width:64px; height:44px; background:url("./images/ic_benefit01.png"); display:inline-block;}
.content .ic_benefit02 {width:44px; height:44px; background:url("./images/ic_benefit02.png"); display:inline-block;}
.content .ic_feature01 {width:94px; height:94px; background:url("./images/ic_feature01.png"); display:inline-block;}
.content .ic_feature02 {width:94px; height:94px; background:url("./images/ic_feature02.png"); display:inline-block;}
.content .ic_feature03 {width:94px; height:94px; background:url("./images/ic_feature03.png"); display:inline-block;}
.content .ic_arrow_wt {width:15px; height:13px; margin-left:12px; background:url("./images/ic_arrow_1.png"); display:inline-block;}
.content .ic_arrow_mt {width:15px; height:13px; margin-left:12px; background:url("./images/ic_arrow_3.png"); display:inline-block;}
.content .ic_arrow {width:7px; height:13px; margin-left:12px; background:url("./images/ic_arrow_2.png"); display:inline-block;}
.content .ic_label {width:77px; height:63px; display:inline-block; position:absolute; top:-15px; left:250px;}
.content .ic_label.n01 {background:url("./images/ic_label01.png");}
.content .ic_label.n02 {background:url("./images/ic_label02.png");}
.content .ic_label.n03 {background:url("./images/ic_label03.png");}

/* 유의사항 */
.content .area_notice {width: 100%; margin: 0; gap: 24px; display: flex; flex-direction: column; align-items: center; background-color:#1D2D54; color:#fff;}
.content .area_notice .info_cont {max-width: 1040px; width: 100%; display: flex; flex-direction: column; align-items: flex-start; margin: 90px 0; }  
.content .area_notice .info_cont p {font-size: 24px; font-weight: 600; margin-bottom: 16px;}
.content .area_notice .info_cont li {margin: 4px; font-size: 19px; color: #8199C0;}

/* 하단 */
.content .content_foot {padding:100px 0; background-image: url("https://daouoffice.com/images/main_new/2025/function/img_footer_pc_01.png"), linear-gradient(45deg,#F3DFFF 0%, #6382FF 100%);}
.content .content_foot h2 {color:#fff; text-shadow: 0 2px 6px rgba(0, 60, 180, 0.25), 0 8px 20px rgba(80, 120, 255, 0.35);}
.content .content_foot .btn_wrap .btn_general {background-color:#fff; font-size:22px; color:#6382FF; box-shadow: 0px 4px 30px 0px rgba(8, 0, 166, 0.25);}
.content .content_foot .btn_wrap .btn_general:hover {background-color:rgb(245, 243, 255);}

/* 서비스 소개 */
.content .area_service {width:100%; padding:40px 0 140px 0;; display:flex; flex-direction:column; align-items:center; background:linear-gradient(to top, #B6F1FF, #fff);}
.content .area_service img  {max-width:1200px; width:100%;}
.content .area_service h3 {font-size:48px; margin-bottom:18px; color:#333;}
.content .area_service p {margin-bottom: 52px; font-size: 20px; font-weight: 400; line-height: 160%; text-align: center; color: #999;}


@media (max-width: 1240px) {
  .content .area_benefit h4 {font-size:28px; text-align:center; margin:5px 0 0 0;}
  .content .area_service h4,
  .content .area_add h4 {font-size:28px; margin-bottom:40px; color:#333; text-align:center;}
  .content .area_feature h4 {font-size:28px; margin-bottom:20px; color:#333; text-align:center;}
  .content .area_service p {margin-bottom:30px;}
  .content .area_feature p {font-size:16px; text-align:center; margin-top:0;}
  .content .area_benefit .card_vertical {flex-direction:column; margin-top:30px;}
  .content .area_benefit .card_vertical .card .text_wrap {padding:30px 40px 30px;}
  .content .area_benefit .text_wrap h4 {font-size:18px; text-align:left;}
  .content .area_benefit .text_wrap p {font-size:16px;}
  .content .link {font-size:15px;}
  .content .area_benefit h5 {font-size:20px;}
  .content .area_benefit .notice {font-size:14px;}
  .content .area_add .card_vertical {flex-direction:column;}
  .content .area_add .text_wrap p {font-size:16px;}
  .content .area_feature ul {margin-top:30px;}
  .content .area_benefit .bg01 {display:none;}
  .content .content_head .visual_wrap {margin:90px auto 0;}
  .content .content_head .btn_wrap .btn_general {padding: 4px 8px; top: 310px; font-size: 20px; max-width: 60%;}
  .content .content_head .visual_wrap {padding: 40px;}
  .content .content_head .visual_wrap img {max-width: 100%;}
  .content .ic_label {top:-12px; left:270px;}

  .content .ic_service01 {width:60px; height:60px; background:url("./images/ic_service01_mo.png"); display:inline-block;}
  .content .ic_service02 {width:60px; height:60px; background:url("./images/ic_service02_mo.png"); display:inline-block;}
  .content .ic_service03 {width:49px; height:58px; background:url("./images/ic_service03_mo.png"); display:inline-block;}
  .content .ic_benefit01 {width:32px; height:24px; background:url("./images/ic_benefit01_mo.png"); display:inline-block;}
  .content .ic_benefit02 {width:24px; height:24px; background:url("./images/ic_benefit02_mo.png"); display:inline-block;}
  .content .ic_feature01 {width:51px; height:51px; background:url("./images/ic_feature01_mo.png"); display:inline-block;}
  .content .ic_feature02 {width:51px; height:51px; background:url("./images/ic_feature02_mo.png"); display:inline-block;}
  .content .ic_feature03 {width:51px; height:51px; background:url("./images/ic_feature03_mo.png"); display:inline-block;}


  .content .area_feature ul {padding:30px 12%;}
  .content .area_feature ul li {flex-direction: column;}
  .content .area_feature ul li .tit {font-size:20px;}
  .content .area_feature ul li .txt {font-size:16px;}
  .content .content_foot {background:linear-gradient(45deg,#F3DFFF 0%, #6382FF 100%);}
  .content .content_foot h2 {font-size:38px;}
  .content .content_foot .title_wrap {margin-top:40px;}
  .content .area_notice .info_cont {margin:20px 0;}
  .content .area_notice .info_cont p {font-size:18px;}
  .content .area_notice .info_cont li {font-size:16px;}

}

@media (max-width: 768px) {
  .content .area_banner .wrap {background-color:#4C8BFF; border-radius:30px; display:flex; justify-content:center;}
}

