@charset "utf-8";

main .sec01{}
main .sec01 img{display: block;width:100%;}

main .sec02{padding:180px 40px;}
main .sec02 .inner{margin:0 auto;max-width: 1136px;}
main .sec02 h2{text-align: center;font-size: 72px;font-weight: 600;line-height: 1.4;letter-spacing: -1.44px;color: #0e0e0e;}
main .sec02 figure{position:relative;margin-top:78px;display: flex;justify-content: center;}
main .sec02 figure img{max-width:740px;width:100%;}
main .sec02 p{margin-top:88px;text-align: center;font-size: 24px;font-weight: normal;line-height: 1.5;letter-spacing: -0.05px;color: #5e5e5e;}
main .sec02 .btn-box{margin-top:84px;display: flex;justify-content: center;}
main .sec02 .btn-box a{display:flex;align-items:center;justify-content:center;width:213px;height: 48px;border-radius: 999px;background-color: #1b63d9; font-size: 17px;font-weight: 500;line-height: 1;color: #fff;}


main .sec03{padding:120px 40px 150px;}
main .sec03 .inner{max-width: 1432px;margin:0 auto;}
main .sec03 h2{font-size: 48px;font-weight: 600;line-height: 1.15;letter-spacing: -0.24px;color: #0e0e0e;}
main .sec03 p{margin-top:24px;font-size: 19px;font-weight: normal;line-height: 1.6;text-align: left;}

main .sec04 {padding: 30px 0 130px;}
main .sec04 .inner {width: 100%;max-width: 1432px;margin: 0 auto;display: flex;align-items: stretch;gap:40px;}
main .sec04 .inner .left {position: relative;width: 660px;padding-bottom: 150px;}
main .sec04 .inner .left .txt {position: sticky;top: 50vh;transform: translateY(-50%);}
main .sec04 .inner .left .txt span {display: block;opacity: 0;transform: translateY(30px);font-size: 64px;font-weight: 600;line-height: 1.1;letter-spacing: -0.64px;color: #86868b;transition: opacity 0.6s ease, transform 0.8s cubic-bezier(0.22, 1, 0.36, 1), color 0.5s ease;}
main .sec04 .inner .left .txt span + span{margin-top:8px;}
main .sec04 .inner .left .txt span.is-visible {opacity: 1;transform: translateY(0);}
main .sec04 .inner .left .txt span.is-active {color: #0e0e0e;}
main .sec04 .inner .left .txt span.is-past {color: #86868b;}
main .sec04 .inner .right {width: calc(100% - 700px);}
main .sec04 .inner .right ul {margin: 0;}
main .sec04 .inner .right ul li {position: relative;overflow: hidden;border-radius: 24px;}
main .sec04 .inner .right ul li + li {margin-top: 40px;}
main .sec04 .inner .right ul li .bg img {display: block;width: 100%;}
main .sec04 .inner .right ul li .txt{position: absolute;top: 0;left: 0;width: 100%;height: 100%;background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.55) 45%, rgba(0, 0, 0, 0.44));padding:40px;transition: all 0.3s;}
main .sec04 .inner .right ul li .txt .t-txt{display: flex;align-items: center;justify-content: space-between;}
main .sec04 .inner .right ul li .txt .t-txt h3{font-size: 32px;font-weight: 600;line-height: 1.25;letter-spacing: -0.1px;color: #fff;}
main .sec04 .inner .right ul li .txt .t-txt button{display: inline-block;width:32px;height:32px;background: url(/img/icon/btn_plus.svg) no-repeat;background-size: cover;}
main .sec04 .inner .right ul li .txt .t-txt button{display: inline-block;width:32px;height:32px;background: url(/img/icon/btn_plus.svg) no-repeat;background-size: cover;}
main .sec04 .inner .right ul li .txt .b-txt{position: absolute;left:0;bottom:-100%;opacity:0;width:100%;padding:40px; font-size: 24px;font-weight: normal;line-height: 1.5;letter-spacing: -0.05px;color: #fff;transition: all 0.3s;}
main .sec04 .inner .right ul li.on .txt{background-image: linear-gradient(to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.55) 45%, rgba(0, 0, 0, 0.88));}
main .sec04 .inner .right ul li.on .txt .t-txt button{background: url(/img/icon/btn_minus.svg) no-repeat;background-size: cover;}
main .sec04 .inner .right ul li.on .txt .b-txt{bottom:0;opacity: 1;}

main .sec05{padding:130px 40px 80px;}
main .sec05 .inner{max-width: 1432px;margin:0 auto;}
main .sec05 h2{font-size: 48px;font-weight: 600;line-height: 1.15;letter-spacing: -0.24px;color: #0e0e0e;}
main .sec05 p{margin-top:24px;font-size: 19px;font-weight: normal;line-height: 1.6;text-align: left;}

main .sec06{padding:0 40px 180px;}
main .sec06 .inner{margin:0 auto;max-width: 1728px;}
main .sec06 ul{display: flex;gap:48px;}
main .sec06 ul li{overflow: hidden;flex: 1;}
main .sec06 ul li a{overflow: hidden;border-radius: 24px;background: #f5f5f7;display: flex;flex-direction: column;align-items: center;padding:104px 20px 83px;}
main .sec06 ul li em{display: inline-block; font-size: 24px;font-weight: 600;line-height: 1.3;text-align: center;color: #5e5e5e;}
main .sec06 ul li h3{margin-top:18px;font-size: 48px;font-weight: 600;line-height: 1.15;letter-spacing: -0.24px;text-align: center;color: #0e0e0e;}
main .sec06 ul li span{display: inline-block;margin-top:26px;padding:15px 32px;border-radius: 999px;background: #1b63d9; font-size: 17px;font-weight: 500;line-height: 1;color: #fff;}
main .sec06 ul li .img{display: flex;justify-content: center;margin-top:87px;}
main .sec06 ul li .img img{display: block;}


main .sec07{position:relative;padding:0 40px 180px;background:#fff;}
main .sec07 .txt{position:sticky;top:0;z-index:1;height:100vh;display:flex;align-items:center;justify-content:center;pointer-events:none;}
main .sec07 .txt h2{font-size: 96px;font-weight: 600;line-height: 1.4;letter-spacing: -2.4px;text-align:center;color:#0e0e0e;will-change:opacity,filter,transform;}
main .sec07 .img-box{position:relative;z-index:2;max-width:1728px;margin:50vh auto 0;}
main .sec07 .img-box ul{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:48px;}
main .sec07 .img-box ul li{overflow:hidden;border-radius:24px;background:#f5f5f7;}
main .sec07 .img-box ul li img{display:block;width:100%;height:auto;}


main .sec08{}
main .sec08 .pc-cont{display: block;}
main .sec08 .pc-cont img{display: block;width:100%;}
main .sec08 .mo-cont{display: none;}
main .sec08 .img{}
main .sec08 .txt-box{position: absolute;top:50%;transform:translateY(-50%);width:100%;padding:0 96px;text-align: right;}
main .sec08 .txt-box p{font-family: 'Michroma', sans-serif;font-weight: 400;font-size: 60px;line-height: 1.3;color: #0e0e0e;}
main .sec08 .txt-box h2{margin-top:48px;display: flex;justify-content: flex-end;}
main .sec08 .txt-box h2 img{display: block;}



@media all and (max-width: 1432px) {
    main .sec04{padding:30px 20px 130px;}
    main .sec04 .inner{gap:40px;}
    main .sec04 .inner .left{width:calc(50% - 20px);}
    main .sec04 .inner .right{width:calc(50% - 20px);}
    main .sec04 .inner .left .txt span{font-size:44px;}
}

@media all and (max-width:1024px) {
    main .sec02{padding:72px 20px;}
    main .sec02 h2{font-size: 32px;line-height: 1.2;letter-spacing: -0.32px;}
    main .sec02 figure{margin-top:32px;}
    main .sec02 p{margin-top:32px;font-size: 16px;font-weight: normal;line-height: 1.6;word-break: keep-all;}
    main .sec02 p br{display: none;}
    main .sec02 .btn-box{margin-top:32px;}

    main .sec03{padding:48px 20px 72px;}
    main .sec03 h2{font-size: 28px;font-weight: 600;line-height: 1.25;letter-spacing: -0.14px;}
    main .sec03 p{margin-top:16px;font-size: 16px;font-weight: normal;line-height: 1.6;color: #5e5e5e;}

    main .sec04{padding:72px 20px;}
    main .sec04 .inner{flex-direction: column;}
    main .sec04 .inner .left{width:100%;padding-bottom: 0;}
    main .sec04 .inner .left .txt{position: relative;top:0;transform: none;}
    main .sec04 .inner .left .txt span{font-size: 28px;font-weight: 600;line-height: 1.25;letter-spacing: -0.14px;opacity: 1;transform: none;}
    main .sec04 .inner .left .txt span + span{margin-top:4px;}
    main .sec04 .inner .left .txt span[data-step="2"]{color:#0e0e0e;}
    main .sec04 .inner .right{width:100%;}
    main .sec04 .inner .right ul li .txt{padding:24px;}
    main .sec04 .inner .right ul li .txt .t-txt h3{font-size: 20px;font-weight: 600;line-height: 1.35;}
    main .sec04 .inner .right ul li.on .txt .b-txt{padding:24px;font-size: 17px;font-weight: normal;line-height: 1.55;}

    main .sec05{padding:72px 20px 32px;}
    main .sec05 h2{font-size: 28px;font-weight: 600;line-height: 1.25;letter-spacing: -0.14px;}
    main .sec05 p{margin-top:16px;font-size: 16px;font-weight: normal;line-height: 1.6;color: #5e5e5e;word-break: keep-all;}
    main .sec05 p br{display: none;}

    main .sec06{padding:0 20px 72px;}
    main .sec06 ul{flex-direction: column;gap:32px;}
    main .sec06 ul li a{padding:40px 20px 32px;}
    main .sec06 ul li em{font-size: 15px;font-weight: 600;line-height: 1.3;}
    main .sec06 ul li h3{margin-top:12px;font-size: 24px;font-weight: 600;line-height: 1.3;letter-spacing: -0.07px;}
    main .sec06 ul li span{margin-top:12px;}
    main .sec06 ul li .img{margin-top:12px;}

    main .sec07{padding:74px 20px;}
    main .sec07 .txt h2{font-size: 32px;line-height: 1.2;letter-spacing: -0.32px;}
    main .sec07 .img-box ul{grid-template-columns: repeat(2, minmax(0, 1fr));gap:16px;}

    main .sec08{padding:24px 0 72px;background: #fff;overflow: hidden;}
    main .sec08 .pc-cont{display:none;}
    main .sec08 .mo-cont{display:block;}
    main .sec08 .img{display: block;}
    main .sec08 .txt-box{position: relative;padding:0 20px;margin-top:24px;transform: none;}
    main .sec08 .txt-box p{font-size: 24px;font-weight: normal;line-height: 1.3;}
    main .sec08 .txt-box h2{margin-top:20px;}
    main .sec08 .txt-box h2 img{max-width:240px;}


}

@media all and (max-width:768px) {
}