@charset "utf-8";

/* m_txt */
.m_txt{}
.m_txt h3{font-size: 42px; color:#000; word-break: keep-all; line-height: 1.2em;}
.m_txt h3 span{color:var(--color2);}
.m_txt p{font-size: 20px; color:#686868; line-height: 1.6em; word-break: keep-all; margin-top: 15px;}

@media all and (max-width:1400px){
    .m_txt h3{font-size: 38px;}
    .m_txt p{font-size: 19px;}
}
@media all and (max-width:1024px){
    .m_txt h3{font-size: 34px;}
    .m_txt p{font-size: 18px;}
}
@media all and (max-width:768px){
    .m_txt h3{font-size: 30px; line-height: 1.4em;}
    .m_txt p{font-size: 17px;}
}
@media all and (max-width:500px){
    .m_txt h3{font-size: 26px;}
    .m_txt p{font-size: 16px;}
}

/* mVisual */
.mVisual{height: 100vh; width: 100%; background-color: #000;}
.mVisual .video{height: 100%; position: absolute; width: 100%; height: 100%; top: 0; left: 0; opacity: 0.6;}
.mVisual .video video{width: 100%; height: 100%; object-fit: cover;}
.mVisual .inner{height: 100%;}
.mVisual .inner .txt{display: flex; justify-content: center; align-items: center; text-align: center; color:#fff; flex-direction: column; height: 100%;}
.mVisual .inner .txt h4{font-size: 24px; font-weight: 700; margin-bottom: 5px; font-family: 'SUIT', sans-serif;}
.mVisual .inner .txt h3{font-size: 64px; margin-bottom: 20px;}
.mVisual .inner .txt p{font-size: 18px; line-height: 1.8em;}
.mVisual .inner .txt p b{font-weight: 600;}
.mVisual .inner a.btn{display: inline-block; margin-top: 50px; background-color: #fff; line-height: 48px; width: 160px; font-size: 16px; color:#000; font-weight: 700; border-radius: 40px; position: relative; text-indent: -25px;}
.mVisual .inner a.btn .circle{width: 31px; height: 31px; border-radius: 50%; background-color: #000; display: flex; position: absolute; overflow: hidden; top:50%; transform: translateY(-50%); right: 10px;}
.mVisual .inner a.btn .circle img{width: 16px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); transition: .4s;}
.mVisual .inner a.btn:hover .circle img{animation: rocket 1s infinite ease-in-out;}
@keyframes rocket {
    0%{top: 50%; left: 50%;}
    49%{top: -10%; left: 120%;}
    50%{top:150%; left: 120%;}
    51%{top:100%; left: -10%;}
    100%{top:50%; left: 50%;}
}
.mVisual .scroll{position: absolute; left: 50%; bottom: 40px; transform: translateX(-50%); text-align: center;}
.mVisual .scroll .mouse{width: 20px; height: 37px; border-radius: 30px; border:1px solid #fff; margin-left: auto; margin-right: auto; position: relative;}
.mVisual .scroll .mouse .dot{width: 4px; height: 4px; border-radius: 100%; background-color: #fff; position: absolute; left: 50%; transform: translateX(-50%); top: 9px;}
.mVisual .scroll p{font-size: 11px; color:#fff; margin-top: 10px;}

@media all and (max-width:1400px){
    .mVisual .inner .txt h4{font-size: 22px;}
    .mVisual .inner .txt h3{font-size: 58px; margin-bottom: 15px;}
    .mVisual .inner .txt p{font-size: 17px;}
    .mVisual .inner a.btn{margin-top: 45px;}
}
@media all and (max-width:1024px){
    .mVisual .inner .txt h4{font-size: 21px;}
    .mVisual .inner .txt h3{font-size: 52px;}
    .mVisual .inner a.btn{margin-top: 40px;}
}
@media all and (max-width:768px){
    .mVisual{height: calc(100vh - 50px);}
    .mVisual .video{height: calc(100vh - 50px);}
    .mVisual .scroll{bottom: 3%;}
    .mVisual .inner .txt h4{font-size: 20px;}
    .mVisual .inner .txt h3{font-size: 46px; margin-bottom: 12px;}
    .mVisual .inner .txt p{font-size: 16px;}
    .mVisual .inner a.btn{margin-top: 35px; font-size: 15px; width: 140px;}
}
@media all and (max-width:500px){
    .mVisual .inner .txt h4{font-size: 19px;}
    .mVisual .inner .txt h3{font-size: 42px;}
    .mVisual .inner a.btn{margin-top: 30px;}
}

/* sec1 */
#sec1{padding: 140px 0; overflow-x: hidden;} 
#sec1 .inner{}
#sec1 .inner .m_txt{text-align: center; margin-bottom: 70px;}
#sec1 .inner > .list{width: 120%;}
#sec1 .inner > .list > div > div > li{display: grid; width: 100%; max-width: 408px; margin-right: 30px; aspect-ratio: 408 / 508; border-radius: 20px; overflow: hidden;}
#sec1 .inner > .list li a{display: block; width: 100%; height: 100%; background: linear-gradient(to bottom, #1c63b2, #1c96ff); padding: 40px 40px 50px; color:#fff; display: flex; flex-direction: column; justify-content: space-between; transition: .4s; position: relative;}
#sec1 .inner > .list li a::after{position: absolute; content:''; bottom: 60px; right: 0; width: 177px; height: 164px; background-size: contain; background-repeat: 
    no-repeat;}
#sec1 .inner > .list li.c1 a::after{background-image: url('/images/main/sec1_1.webp');}
#sec1 .inner > .list li.c2 a::after{background-image: url('/images/main/sec1_2.webp');}
#sec1 .inner > .list li.c3 a::after{background-image: url('/images/main/sec1_3.webp');}
#sec1 .inner > .list li.c4 a::after{background-image: url('/images/main/sec1_4_260527.webp');}
#sec1 .inner > .list li.c5 a::after{background-image: url('/images/main/sec1_5.webp');}
#sec1 .inner > .list li:hover a{background: linear-gradient(to bottom, #1c86b0, #1cceff);}
#sec1 .inner > .list li a .txt{}
#sec1 .inner > .list li a .txt h4{background-color: #3e8eee; font-size: 14px; font-weight: 500; border-radius: 5px; padding: 10px 15px; display: inline-block; margin-bottom: 25px;}
#sec1 .inner > .list li a .txt h3{font-size: 32px; margin-bottom: 10px;}
#sec1 .inner > .list li a .txt h3 small{font-size: 16px; font-weight: 500; color:#fff;}
#sec1 .inner > .list li a .txt p{font-size: 16px; word-break: keep-all;}
#sec1 .inner > .list li a .list2{display: inline-flex; flex-direction: column; align-items: flex-start; position: relative; z-index: 3;}
#sec1 .inner > .list li a .list2 li{font-size: 15px; font-weight: 500; border:1px solid #fff; padding: 2.5px 13px; border-radius: 30px; display: inline-block; background: rgba(255, 255, 255, 0.15); -webkit-backdrop-filter: blur(5px); backdrop-filter: blur(5px);}
#sec1 .inner > .list li a .list2 li + li{margin-top: 10px;}

@media  all and (max-width:1400px) {
    #sec1{padding: 120px 0;}
    #sec1 .inner .m_txt{margin-bottom: 60px;}
    #sec1 .inner > .list > div > div > li{max-width: 378px; margin-right: 25px;}
    #sec1 .inner > .list li a{padding: 35px 35px 45px;}
    #sec1 .inner > .list li a .txt h4{padding: 9px 14px; margin-bottom: 20px; font-size: 13px;}
    #sec1 .inner > .list li a .txt h3{font-size: 29px;}
    #sec1 .inner > .list li a .txt h3 small{font-size: 15px;}
}
@media  all and (max-width:1024px) {
    #sec1{padding: 100px 0;}
    #sec1 .inner .m_txt{margin-bottom: 50px;}
    #sec1 .inner > .list > div > div > li{max-width: 360px;}
    #sec1 .inner > .list li a{padding: 32px 32px 40px;}
    #sec1 .inner > .list li a .txt h3{font-size: 27px;}
}
@media  all and (max-width:768px) {
    #sec1{padding: 90px 0;}
    #sec1 .inner{width: 100%;}
    #sec1 .inner .m_txt{margin-bottom: 40px;}
    #sec1 .inner > .list{width: 100%;}
    #sec1 .inner > .list > div > div > li{max-width: 348px;margin-right: 0; margin: 0 10px;}
    #sec1 .inner > .list li.slick-current a{background: linear-gradient(to bottom, #1c86b0, #1cceff);}
    #sec1 .inner > .list li a{padding: 28px 28px 35px;}
    #sec1 .inner > .list li a .txt h4{padding: 7px 12px; margin-bottom: 15px; font-size: 12px;}
    #sec1 .inner > .list li a .txt h3{font-size: 25px;}
    #sec1 .inner > .list li a .txt h3 small{font-size: 14px;}
    #sec1 .inner > .list li a .txt p{font-size: 15px;}
    #sec1 .inner > .list li a .list2 li{font-size: 14px;}
    #sec1 .inner > .list li a::after{width: 151px; height: 140px; bottom: 40px;}
}
@media  all and (max-width:500px) {
    #sec1{padding: 80px 0;}
    #sec1 .inner > .list > div > div > li{max-width: 75vw; min-height: 420px;}
    #sec1 .inner > .list li a{padding: 26px 26px 32px;}
    #sec1 .inner > .list li a .txt h3{font-size: 24px;}
}


/* sec2 */
#sec2{padding: 140px 0; background-color: #f7f8fa;}
#sec2 .inner{display: grid; grid-template-columns: repeat(3, 1fr); gap:30px}
#sec2 .inner .box{aspect-ratio: 553/420; width: 100%; height: 100%; position: relative; border-radius: 20px; overflow: hidden; cursor: pointer;}
#sec2 .inner .box:nth-child(1){display: flex; justify-content: flex-start; align-items: center; cursor: default;}
#sec2 .inner .box.border{border: 5px solid transparent; transition: background 0.4s ease;}
#sec2 .inner .box.border:hover{background: linear-gradient(#fff, #fff) padding-box, linear-gradient(to right, #0e7af5, #54acf8) border-box;}
#sec2 .inner .box .img{height: 100%;}
#sec2 .inner .box .img::after{content: ''; width: 100%; height: 100%; position: absolute; background: linear-gradient(to bottom, transparent 0%, transparent 50%, #113872ab 100%); top: 0; left: 0; transition: background 0.5s ease;}
#sec2 .inner .box:hover .img::after{background: linear-gradient(to bottom, #113872ab 0%, #113872ab 50%, #113872ab 100%);}
#sec2 .inner .box .img img{width: 100%; height: 100%; object-fit: cover;}

#sec2 .inner .box .m_txt{text-align: left; width: 100%;}
#sec2 .inner .box .m_txt h3{font-size: 38px; color:#111; line-height: 1.3em; font-weight: 700;}
#sec2 .inner .box .m_txt h3 span{}
#sec2 .inner .box .m_txt p{font-size: 18px; color:#666; margin-top: 20px; line-height: 1.6em;}
#sec2 .inner .box .m_txt ul.tag{display: flex; gap:5px; margin-top: 30px;}
#sec2 .inner .box .m_txt ul.tag li{font-size: 16px; color:#fff; font-weight: 600; background: #00397d; border-radius: 20px; padding: 10px 18px;}
#sec2 .inner .box .m_txt ul.tag li::before{content: '#'; margin-right: 3px; font-weight: 500; color: #eee;}

#sec2 .inner .box .txt{position: absolute; left: 0; top: 0; width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: flex-end; padding: 0 40px 30px; transition: padding 0.4s ease;}
#sec2 .inner .box .txt h3{font-size: 32px; color:#fff; font-weight: 700; transition: transform 0.4s ease;}
#sec2 .inner .box .txt p{opacity: 0; visibility: hidden; max-height: 0; overflow: hidden; font-size: 16px; font-weight: 400; color:#fff; transform: translateY(10px); margin-top: 0; transition: opacity 0.4s ease, transform 0.4s ease, max-height 0.4s ease, visibility 0.4s; word-break: keep-all; line-height: 1.5em;}
#sec2 .inner .box .txt ul{display: flex; flex-wrap: wrap; gap:5px; margin-bottom: 0px; opacity: 0; visibility: hidden; max-height: 0; overflow: hidden; transition: 0.4s ease;}
#sec2 .inner .box .txt ul li{font-size: 15px; color:#fff; border: 1px solid rgba(255,255,255,0.4); padding: 3px 10px; border-radius: 4px;}

#sec2 .inner .box:hover .txt{justify-content: center; text-align: center; padding: 0 40px;}
#sec2 .inner .box:hover .txt h3{transform: translateY(-10px);}
#sec2 .inner .box:hover .txt p{opacity: 1; visibility: visible; max-height: 200px; transform: translateY(0); margin-top: 15px;}
#sec2 .inner .box:hover .txt ul{opacity: 1; visibility: visible; max-height: 100px; margin-top: 0px; margin-bottom: 0px; justify-content: center;}

@media all and (max-width:1720px) {
    #sec2 .inner{gap:25px;}
    #sec2 .inner .box .m_txt h3{font-size: 2.2vw;}
    #sec2 .inner .box .m_txt p{font-size: 1.1vw;}
    #sec2 .inner .box .txt h3{font-size: 2vw;}
    #sec2 .inner .box .txt p{font-size: 15px;}
}
@media  all and (max-width:1400px) {
    #sec2{padding: 120px 0;}
    #sec2 .inner{gap:20px;}
}
@media all and (min-width:1025px) and (max-width:1280px) {
    #sec2 .inner .m_txt h3{font-size: 2.75vw;}
    #sec2 .inner .m_txt p{font-size: 1.5vw;}
}
@media  all and (max-width:1024px) {
    #sec2{padding: 100px 0;}
    #sec2 .inner{grid-template-columns: repeat(2, 1fr);}
    #sec2 .inner .box:nth-child(1){grid-column: 1/3; height: auto; aspect-ratio: auto; margin-bottom: 40px;}
    #sec2 .inner .box:nth-child(1) .m_txt{text-align: center; padding: 0;}
    #sec2 .inner .box:nth-child(1) .m_txt h3{font-size: 30px;}
    #sec2 .inner .box:nth-child(1) .m_txt h3 br{display: none;}
    #sec2 .inner .box:nth-child(1) .m_txt p{font-size: 17px; margin-top: 15px;}
    #sec2 .inner .box:nth-child(1) .m_txt p br{display: none;}
    #sec2 .inner .box:nth-child(1) .m_txt ul.tag{justify-content: center; margin-top: 25px;}
    
    #sec2 .inner .box .txt{padding: 0 30px 20px;}
    #sec2 .inner .box .txt h3{font-size: 24px;}
    #sec2 .inner .box .txt p{font-size: 16px;}
    #sec2 .inner .box .txt p br{display: none;}
    #sec2 .inner .box:hover .txt h3{transform: translateY(-5px);}
    #sec2 .inner .box:hover .txt ul{margin-top: 0px; margin-bottom: 0px;}
}
@media  all and (max-width:768px) {
    #sec2{padding: 80px 0;}
    #sec2 .inner{gap:15px; display: flex; flex-direction: column;}
    #sec2 .inner .box:nth-child(1){margin-bottom: 30px;}
    #sec2 .inner .box:nth-child(1) .m_txt h3{font-size: 26px;}
    #sec2 .inner .box:nth-child(1) .m_txt p{font-size: 16px;}
    #sec2 .inner .box:nth-child(1) .m_txt ul.tag{gap:8px; margin-top: 20px;}
    #sec2 .inner .box:nth-child(1) .m_txt ul.tag li{font-size: 16px; padding: 8px 12px;}

    #sec2 .inner .box{aspect-ratio: 550/380;}
    #sec2 .inner .box.border{border-width: 2px !important;}
    #sec2 .inner .box .txt{padding: 0 25px 20px;}
    #sec2 .inner .box .txt h3{font-size: 22px;}
    #sec2 .inner .box .txt p{font-size: 16px; }
    #sec2 .inner .box:hover .txt p{margin-top: 10px;}
    #sec2 .inner .box:hover .txt ul{margin-top: 0px; margin-bottom: 0px;}
    #sec2 .inner .box .txt ul li{padding: 2px 8px;}
}
@media  all and (max-width:500px) {
    #sec2{padding: 60px 0;}
    #sec2 .inner .box:nth-child(1) .m_txt h3{font-size: 23px;}
    #sec2 .inner .box:nth-child(1) .m_txt ul.tag{flex-wrap: wrap;}
}


/* #sec3 */
#sec3{padding: 140px 0;}
#sec3 .inner{}
#sec3 .inner .m_txt{text-align: center; margin-bottom: 60px;}
#sec3 .inner .list{display: grid; grid-template-columns: repeat(2, 1fr); border-radius: 20px; overflow: hidden; background-color: #e4e4e4; gap:1px; border: 1px solid #e4e4e4;}
#sec3 .inner .list li{height: 500px; background-color: #fff; position: relative; padding: 80px;}
#sec3 .inner .list li.l1{}
#sec3 .inner .list li.l2{}
#sec3 .inner .list li.l3{}
#sec3 .inner .list li.l4{}
#sec3 .inner .list li .txt{}
#sec3 .inner .list li:nth-child(2),
#sec3 .inner .list li:nth-child(3){background-color: #f8f8f8;}
#sec3 .inner .list li:nth-child(even) .txt{text-align: right;}
#sec3 .inner .list li .txt{display: flex; flex-direction: column; justify-content: flex-end; height: 100%; position: relative; z-index: 2;}
#sec3 .inner .list li .txt h3{font-size: 80px; color:#0e7af5;}
#sec3 .inner .list li .txt h3 span{font-size: 32px;}
#sec3 .inner .list li .txt h4{font-size: 24px; color:#000; margin-bottom: 20px;}
#sec3 .inner .list li .txt p{font-size: 18px; font-weight: 500; color:#666666; line-height: 1.6em; word-break: keep-all;}
#sec3 .inner .list li .img{z-index: 0;}
#sec3 .inner .list li.l1 .img{position: absolute; top: 0; right: 35px;}
#sec3 .inner .list li.l2 .img{position: absolute; top: 30px; left: 80px;}
#sec3 .inner .list li.l3 .img{position: absolute; top: 0; left: 0px;}
#sec3 .inner .list li.l4 .img{position: absolute; top: 0px; left: 0px;}
#sec3 .inner .list li .img img{}

@media  all and (max-width:1400px) {
    #sec3{padding: 120px 0;}
    #sec3 .inner .list li{padding: 60px 50px; height: 40vw;}
    #sec3 .inner .list li.l1 .img{ right: 25px;}
    #sec3 .inner .list li:nth-child(1) .img img{width: 23vw;}
    #sec3 .inner .list li.l2 .img{top: 25px; left: 7%;}
    #sec3 .inner .list li:nth-child(2) .img img{width: 21vw;}
    #sec3 .inner .list li .txt h3{font-size: 68px;}
    #sec3 .inner .list li .txt h3 span{font-size: 28px;}
    #sec3 .inner .list li .txt h4{font-size: 22px; margin-bottom: 17px;}
    #sec3 .inner .list li .txt p{font-size: 17px;}
}
@media  all and (max-width:1024px) {
    #sec3{padding: 100px 0;}
    #sec3 .inner .list li{padding: 40px 30px; height: 43vw;}
    #sec3 .inner .list li .txt h3{font-size:56px; line-height: 1em;}
    #sec3 .inner .list li .txt h3 span{font-size: 26px;}
    #sec3 .inner .list li .txt h4{font-size: 21px; margin-bottom: 14px;}
    #sec3 .inner .list li .txt p{font-size: 16px;}
    #sec3 .inner .list li .txt p br{display: none;}
}
@media  all and (max-width:768px) {
    #sec3{padding: 90px 0;}
    #sec3 .inner .list{grid-template-columns: repeat(1, 1fr);}
    #sec3 .inner .list li{padding: 40px 30px; height: 50vw; min-height: 280px;}
    #sec3 .inner .list li:nth-child(1) .img img{width: 34vw;}
    #sec3 .inner .list li:nth-child(2) .img img{width: 26vw;}
    #sec3 .inner .list li .txt h3{font-size:48px;}
    #sec3 .inner .list li .txt h3 span{font-size: 24px;}
    #sec3 .inner .list li .txt h4{font-size: 20px; margin-bottom: 10px;}
    #sec3 .inner .list li:nth-child(2),
    #sec3 .inner .list li:nth-child(3){background-color: #fff;}
    #sec3 .inner .list li:nth-child(1),
    #sec3 .inner .list li:nth-child(3){background-color: #f8f8f8;}
}
@media  all and (max-width:500px) {
    #sec3{padding: 80px 0;}
    #sec3 .inner .list li{padding: 35px 25px;}
    #sec3 .inner .list li .txt h3{font-size:40px;}
    #sec3 .inner .list li .txt h3 span{font-size: 22px;}
    #sec3 .inner .list li .txt h4{font-size: 19px; margin-bottom: 7px;}
}


/* sec4 */
#sec4{padding-bottom: 140px; overflow-x: hidden;}
#sec4 .inner{max-width: 100%; width: 100%;}
#sec4 .inner .m_txt{text-align: center; margin-bottom: 70px;}
#sec4 .inner .cont{}
#sec4 .inner .cont li{display: grid; aspect-ratio: 1010 / 540; width: 100%; max-width: 1010px; margin: 0 15px; position: relative; border-radius: 20px; overflow: hidden; padding: 60px;}
#sec4 .inner .cont li .img{position: absolute; top: 0; left: 0; z-index: -1; background: #000; width: 100%; height: 100%;}
#sec4 .inner .cont li .img img{width: 100%; height: 100%; object-fit: cover; opacity: 0.5;}
#sec4 .inner .cont li.slick-current .img img{opacity:1;}
#sec4 .inner .cont li .txt{color:#fff; display: flex; flex-direction: column; justify-content: space-between; height: 100%;}
#sec4 .inner .cont li .txt h4{font-weight: 500; font-size: 18px; opacity: 0.8;}
#sec4 .inner .cont li .txt .bot{}
#sec4 .inner .cont li .txt .bot h3{font-size: 32px; margin-bottom: 15px;}
#sec4 .inner .cont li .txt .bot p{height: 0; opacity: 0;}
#sec4 .inner .cont li.slick-current .txt .bot p{height: auto; opacity: 0.7;}

@media  all and (max-width:1400px) {
    #sec4{padding-bottom: 120px;}
    #sec4 .inner .m_txt{margin-bottom: 60px;}
    #sec4 .inner .cont li{max-width: 80vw; padding: 50px;}
    #sec4 .inner .cont li .txt h4{font-size: 17px;}
    #sec4 .inner .cont li .txt .bot h3{font-size: 29px; margin-bottom: 13px;}
}
@media  all and (max-width:1024px) {
    #sec4{padding-bottom: 100px;}
    #sec4 .inner .m_txt{margin-bottom: 50px;}
    #sec4 .inner .cont li{padding: 40px;}
    #sec4 .inner .cont li .txt .bot h3{font-size: 27px;}
}
@media  all and (max-width:768px) {
    #sec4{padding-bottom: 90px;}
    #sec4 .inner .m_txt{margin-bottom: 35px;}
    #sec4 .inner .m_txt p{width: 80%; margin-left: auto; margin-right: auto;}
    #sec4 .inner .cont li{min-height: 340px; margin: 0 10px; padding: 30px;}
    #sec4 .inner .cont li .txt h4{font-size: 16px;}
    #sec4 .inner .cont li .txt .bot h3{font-size: 25px; margin-bottom: 10px;}
    #sec4 .inner .cont li.slick-current .txt .bot p br{display: none;}
    #sec4 .inner .cont li.slick-current .txt .bot p{font-size: 15px;}
}
@media  all and (max-width:500px) {
    #sec4{padding-bottom: 80px;}
    #sec4 .inner .m_txt{margin-bottom: 30px;}
    #sec4 .inner .cont li{padding: 25px;}
    #sec4 .inner .cont li .txt h4{font-size: 15px;}
    #sec4 .inner .cont li .txt .bot h3{font-size: 23px; margin-bottom: 8px;}
}

/* sec6 */
#sec6{padding: 140px 0 0;}
#sec6 .inner{}
#sec6 .inner .m_txt{text-align: center;}
#sec6 .inner #root{margin-top: -80px;}

@media  all and (max-width:1400px) {
    #sec6{padding: 120px 0 0;}
}
@media  all and (max-width:1024px) {
    #sec6{padding: 100px 0 0;}
}
@media  all and (max-width:768px) {
    #sec6{padding: 90px 0 0;}
}
@media  all and (max-width:500px) {
    #sec6{padding: 80px 0 0;}
}

/* sec7 */
#sec7{padding: 140px 0; background: linear-gradient(to bottom, #008bbf, #1b65cd);}
#sec7 .inner{}
#sec7 .inner .m_txt{text-align: center;}
#sec7 .inner .m_txt h3{color:#fff;}
#sec7 .inner .m_txt h3 span{color:#b5e827;}
#sec7 .inner .m_txt p{color:#fff;}
#sec7 .inner .btn_box{display: flex; justify-content: center; gap:10px; margin-top: 35px;}
#sec7 .inner .btn_box a.btn{border-radius:5px; line-height: 48px; font-size: 15px; font-weight: 600; padding: 0 25px;}
#sec7 .inner .btn_box a.btn.btn1{color:#fff; border: 1px solid #fff;}
#sec7 .inner .btn_box a.btn.btn2{background-color: #000; color:#fff;}
#sec7 .inner .list{display: flex; justify-content: center; align-items: center; gap:20px; margin-top: 20px; opacity: 0.8;}
#sec7 .inner .list li{font-size: 14px; color:#fff;}
#sec7 .inner .list li::before{content: '·'; margin-right: 3px;}

@media  all and (max-width:1400px) {
    #sec7{padding: 120px 0;}
    #sec7 .inner .btn_box{margin-top: 30px;}
    #sec7 .inner .list{margin-top: 17px; gap:16px}
}
@media  all and (max-width:1024px) {
    #sec7{padding: 100px 0;}
    #sec7 .inner .btn_box{margin-top: 25px;}
}
@media  all and (max-width:768px) {
    #sec7{padding: 90px 0;}
    #sec7 .inner .list{margin-top: 14px; gap:12px;}
}
@media  all and (max-width:500px) {
    #sec7{padding: 80px 0;}
    #sec7 .inner .btn_box{margin-top: 22px;}
}