@charset "utf-8";

body{background:#fafafa;}
.app{position:relative;margin:0 auto;width: 520px;max-width:100%;background:#fff;}
@media screen and (max-width:750px){
  .app{width:100%;}
}

/* 상단 */
.header{position: fixed;top:0;left: 50%;width: 520px;max-width: 100dvw;z-index:1000;display: flex;align-items: center;justify-content: space-between;height: 56px;padding: 0 8px;background: #fff;transform: translateX(-50%);}
.header .logo{position:relative;padding: 0 12px;}
.header .logo a{display:block;width: 85px;height: auto;aspect-ratio: 17/4;background: url("../img/logo.svg") no-repeat center / contain;}
.header .bttn{}
.header .bttn a{display: flex;align-items: center;justify-content: center;padding: 0 10px;height: 34px;border-radius: 12px;background: #3182f6;line-height: 1.5;font-size: 16px;font-weight: 800;color: #fff;}
@media screen and (max-width:750px){
  .header{width:100%;}
}

/* 메인 */
.main{position:relative;padding: 56px 0 80px 0;}
.main .line{background:#FF445D;padding:16px 0;display:flex;align-items:center;justify-content:center;}
.main .line > a{display:flex;align-items:center;justify-content:center;line-height:24px;font-size:20px;font-weight:600;color:#fff;}
.main .sec{padding: 30px 20px;}
.main .sec .title{padding:30px 0;display:flex;flex-direction:column;align-items:center;text-align:center;}
.main .sec .title .sub{margin:0 0 16px;padding:0 16px;display:flex;align-items:center;justify-content:center;text-align:center;height:32px;font-size:16px;font-weight: 600;color: #326FCB;border-radius:32px;background: #D8E4FF;}
.main .sec .title .tit{margin:0 0 8px;line-height: 36px;font-size: 30px;font-weight: 800;color: #384D6D;}
.main .sec .title .tit span{color: #3182F6;}
.main .sec .title .txt{line-height:17px;font-size:14px;font-weight:400;color:#4f5871;}
.main .sec-1{padding: 0;}
.main .sec-1 .text{padding: 40px 32px 22px;display:flex;flex-direction:column;align-items:center;text-align:center;}
.main .sec-1 .text .sub{margin:0 0 16px;padding:0 16px;display:flex;align-items:center;justify-content:center;text-align:center;height:32px;font-size:16px;font-weight:700;color:#3f67be;border:1px solid #c2d0ff;border-radius:32px;background:#f2f6fe;}
.main .sec-1 .text .tit{margin:0 0 8px;line-height:42px;font-size:32px;font-weight:600;color:#464e60;}
.main .sec-1 .text .tit p{font-family:'Paperlogy', sans-serif;}
.main .sec-1 .text .tit span{line-height:42px;font-size:48px;font-weight:700;color:#3f67be;font-family:'Paperlogy', sans-serif;}
.main .sec-1 .text .txt{line-height:29px;font-size:24px;font-weight:600;color:#3f67be;}
.main .sec-1 .image{padding: 28px 32px 30px;display:flex;align-items:center;justify-content:center;background: url("../img/sec1_bg.png") no-repeat top center / 100% auto;}
.main .sec-1 .image img{max-width:100%;height:auto;}
.main .sec-1 .bttn{padding:10px 20px 30px;}
.main .sec-1 .bttn a{display:flex;align-items:center;justify-content:center;gap: 4px;height: 58px;line-height:24px;font-size:20px;font-weight:600;color:#fff;background: #3182F6;border-radius: 12px;}
.main .sec-1 .bttn a.btn-arr:after{content:'';width:20px;height:20px;background:url("../img/ic_arr.svg") no-repeat center / contain;}
.main .sec-2{padding:40px 20px;background:#FFFCF7;}
.main .sec-2 .text{margin: 0 0 31px;display:flex;flex-direction:column;align-items:center;text-align:center;}
.main .sec-2 .text .sub{margin:0 0 16px;padding:0 16px;display:flex;align-items:center;justify-content:center;text-align:center;height:32px;font-size:16px;font-weight:700;color: #FF6577;border: 1px solid #FDA9C1;border-radius:32px;background: #FFEEEB;}
.main .sec-2 .text .tit{margin:0 0 8px;line-height: 36px;font-size: 30px;font-weight: 800;color: #384D6D;}
.main .sec-2 .text .tit span{color: #FF6577;font-family:'Paperlogy', sans-serif;}
.main .sec-2 .text .num{width:350px;max-width:100%;height:auto;aspect-ratio: 175 / 64;background:url("../img/sec2_100.png") no-repeat center / contain;text-indent: -9999em;overflow: hidden;}
.main .sec-2 .list{}
.main .sec-2 .list ul{}
.main .sec-2 .list li{margin:0 0 12px;padding:12px 16px;display:flex;align-items:center;gap:18px;background:#fff;border-radius:12px;border:1px solid #ffeaef;}
.main .sec-2 .list li:last-child{margin:0;}
.main .sec-2 .list li .img{flex:0 0 auto;position:relative;width:60px;height:60px;}
.main .sec-2 .list li .img:after{content:'';position:absolute;top:5px;right:-8px;width:20px;height:20px;background:url("../img/sec2_check.png") no-repeat center / contain;}
.main .sec-2 .list li .con{flex:1;}
.main .sec-2 .list li .tit{display:block;line-height:26px;font-size:22px;font-weight:700;color:#191f28;}
.main .sec-2 .list li .txt{display:block;line-height:16px;font-size:13px;font-weight:400;color:#4f5871;}
.main .sec-2 .desc{padding: 20px 0 0;line-height:17px;font-size:14px;font-weight:400;color:#4f5871;text-align:center;}
.main .sec-2 .desc p{margin:0 0 17px;}
.main .sec-2 .desc p:last-child{margin:0;}
.main .sec-2 .desc span{font-weight:700;color:#ff6577;}
.main .sec-3{}
.main .sec-3 .list{}
.main .sec-3 .list ul{}
.main .sec-3 .list li{padding: 16px 0 16px 16px;display:flex;align-items:center;gap: 15px;border-bottom: 1px solid #E2EAF8;}
.main .sec-3 .list li:last-child{margin:0;border:0;}
.main .sec-3 .list li .img{flex:0 0 auto;position:relative;width:80px;height:80px;border-radius:10px;border:1px solid #d9e3e6;display:flex;align-items:center;justify-content:center;background:#f7f9fe}
.main .sec-3 .list li .img img{max-width:100%;height:auto;}
.main .sec-3 .list li .con{flex:1;}
.main .sec-3 .list li .tit{display:block;line-height:26px;font-size:22px;font-weight:700;color:#191f28;}
.main .sec-3 .list li .txt{margin: 4px 0 0;display:block;line-height:16px;font-size:13px;font-weight:400;color:#4f5871;}
.main .sec-3 .desc{margin: 20px 0 30px;padding:16px;border-radius:4px;border:1px solid #dae2ff;background:#f1f5ff;text-align:center;}
.main .sec-3 .desc .tit{line-height:26px;font-size:20px;font-weight:600;color:#4f5871;}
.main .sec-3 .desc .tit span{font-weight:700;color:#3182F6;}
.main .sec-3 .desc .txt{margin: 10px 0 0;line-height:17px;font-size:14px;font-weight:400;color:#4f5871;}
.main .sec-3 .desc .txt span{font-weight:700;color:#4F5871;}
.main .sec-4{background:#F3F8FE;}
.main .sec-4 .image{padding: 0 12px;display:flex;align-items:center;justify-content:center;}
.main .sec-4 .image img{max-width:100%;height:auto;}
.main .sec-4 .list{padding: 0 0 30px;}
.main .sec-4 .list ul{display:flex;flex-wrap:wrap;gap:8px;}
.main .sec-4 .list li{padding:16px 10px;width:calc(50% - 4px);background:#fff;border-radius:20px;}
.main .sec-4 .list li .img{margin:0 0 16px;width:64px;height:64px;display:flex;align-items:center;justify-content:center;border-radius:64px;background:#eff3fd;}
.main .sec-4 .list li .tit{margin:0 0 8px;line-height:19px;font-size:16px;font-weight:700;color:#191f28;}
.main .sec-4 .list li .txt{line-height:17px;font-size:14px;font-weight:400;color:#4f5871;}
.main .sec-5{background: linear-gradient(165.1deg, #FFF2E0 7.17%, #FDEAF2 95.58%);}
.main .sec-5 .text{margin: 0 0 30px;display:flex;flex-direction:column;align-items:center;text-align:center;}
.main .sec-5 .text .sub{margin:0 0 16px;padding:0 16px;display:flex;align-items:center;justify-content:center;text-align:center;height: 25px;font-size: 14px;font-weight:700;color: #fff;border-radius:32px;background: #FFA9B3;}
.main .sec-5 .text .tit{margin:0 0 8px;line-height: 36px;font-size: 30px;font-weight: 800;color: #384D6D;}
.main .sec-5 .text .tit span{color: #FF667D;}
.main .sec-5 .letter{position:relative;margin: 0 0 30px;padding: 40px 20px;background:url("../img/sec5_pattern.png") repeat-y top center / 100% auto;border-radius:10px;}
.main .sec-5 .letter:before{content:'';position:absolute;top: -11px;left:50%;width: 70px;height: 31px;background:url("../img/sec5_sticker.png") no-repeat center / contain;transform: translateX(-50%);pointer-events:none;}
.main .sec-5 .letter .txt{line-height: 17px;font-size: 14px;font-weight: 400;color: #191f28;}
.main .sec-5 .letter .txt p{display:block;margin:0 0 17px;}
.main .sec-5 .letter .txt span{}
.main .sec-5 .letter .txt span.underline{position:relative;font-weight:700;}
.main .sec-5 .letter .txt span.underline:before{content:'';position:absolute;z-index:0;bottom:0;left:0;height:40%;width:100%;background:#ffe9ab;}
.main .sec-5 .letter .txt span.underline em{position:relative;z-index:1;}
.main .sec-5 .letter .txt span.point{font-weight:700;color:#FB6B81;}
.main .sec-5 .letter .txt span.strong{font-weight:700;}
.main .sec-5 .letter .box{position:relative;margin: 0 0 34px;padding:18px 22px;display:flex;flex-direction:column;align-items:flex-start;border-radius:18px;background:#ffeded;}
.main .sec-5 .letter .box .box-t{line-height:18px;font-size:15px;font-weight:400;color:#ff4d63;}
.main .sec-5 .letter .box .box-t span{font-weight:700;}
.main .sec-5 .letter .box .box-n{line-height:48px;font-size:40px;font-weight:800;color:#ff4d63;}
.main .sec-5 .letter .box .box-b{display:flex;align-items:center;justify-content:center;padding:0 12px;height:27px;border-radius:27px;background:#ff97a4;font-size:16px;font-weight:800;color:#fff;}
.main .sec-5 .letter .box:after{content:'';position:absolute;top:50%;right: -40px;max-width: 40vw;width:172px;height:292px;aspect-ratio: 43/ 73;background: url("../img/sec5_flower.png") no-repeat right center / contain;transform: translateY(-50%);}
.main .sec-6{background:#F4F7FC;}
.main .sec-6 .list{}
.main .sec-6 .list ul{}
.main .sec-6 .list li{margin:0 0 16px;padding:12px 16px;display:flex;align-items:center;gap:12px;background:#fff;border-radius:12px;border:1px solid #e3eaff;box-shadow: 0px 4px 5px 0px #7C8EB41A;}
.main .sec-6 .list li .num{flex:0 0 auto;width:24px;height:24px;display:flex;align-items:center;justify-content:center;line-height:24px;font-size:14px;font-weight:700;color:#fff;border-radius:24px;background:#4973dc}
.main .sec-6 .list li .img{flex:0 0 auto;width:60px;height:60px;display:flex;align-items:center;justify-content:center;border-radius:64px;background:#eff3fd;}
.main .sec-6 .list li .img img{max-width:100%;height:auto;}
.main .sec-6 .list li .con{flex:1;}
.main .sec-6 .list li .tit{line-height: 26px;font-size: 22px;font-weight:700;color: #2A3D59;}
.main .sec-6 .list li .txt{line-height: 16px;font-size: 13px;font-weight:400;color:#4f5871;}
.main .sec-6 .bttn{padding: 30px 0 0;}
.main .sec-6 .bttn a{display:flex;align-items:center;justify-content:center;gap: 4px;height: 58px;line-height:24px;font-size:20px;font-weight:600;color:#fff;background: #3182F6;border-radius: 12px;}
.main .sec-6 .bttn a.btn-arr:after{content:'';width:20px;height:20px;background:url("../img/ic_arr.svg") no-repeat center / contain;}
.main .sec-6 .caution{margin:18px 8px 0;line-height:17px;font-size:14px;font-weight:400;color:#4f5871;}
.main .sec-6 .caution span{font-weight:700;color:#FF4A65;}
.main .sec-7{}
.main .sec-7 .box{margin:30px 0 0;padding:24px 20px;text-align:center;border-radius:20px;background:#f4f7fc;}
.main .sec-7 .box .img{margin:0 0 20px;height:68px;display:flex;align-items:center;justify-content:center;}
.main .sec-7 .box .img img{height:100%;width:auto;}
.main .sec-7 .box .txt{line-height:21px;font-size:16px;font-weight:400;color:#1c4481;}
.main .sec-7 .box .txt span{font-weight:700;}
.main .sec-8{}
.main .sec-8 .box{padding:24px 16px;border-radius:20px;border:1px solid #e3eaff;background:#fff;box-shadow: 0px 4px 5px 0px #7C8EB41A;}
.main .sec-8 .head{margin:0 0 20px;text-align:center;}
.main .sec-8 .head .img{margin:0 auto 8px;width:60px;height:60px;}
.main .sec-8 .head .img img{width:100%;height:auto;}
.main .sec-8 .head .tit{margin:0 0 8px;line-height:24px;font-size:20px;font-weight:600;color:#191f28;}
.main .sec-8 .head .txt{line-height:19px;font-size:16px;font-weight:600;color:#3182f6;}
.main .sec-8 .text{padding:20px 16px;border-radius:10px;background:#f5f8ff;text-align:center;}
.main .sec-8 .text p{margin:0 0 17px;line-height:17px;font-size:14px;font-weight:400;color:#1c4481;}
.main .sec-8 .text p:last-child{margin:0;}
.main .sec-8 .text p span{font-weight: 800;}

/* 하단 */
.footer{position:relative;padding: 30px 20px;background: #fff;text-align: center;border-top:1px solid #E6EDFF;}
.footer .cite{line-height:17px;font-size:14px;font-weight:400;color:#2c5490;}
.footer .desc{line-height:17px;font-size:14px;font-weight:400;color:#2c5490;}
