body{background:#F4F0FF}body picture{display:inline-block}h1{font-weight:700;font-size:48px;line-height:140%;margin:0;text-align:center;color:#fff}h1~p{font-weight:400;font-size:18px;line-height:160%;text-align:center;margin:20px auto 30px;color:#FFF9}h2{font-weight:700;font-size:34px;line-height:48px;color:#161616;margin:0;text-align:center}h2~p{font-weight:400;font-size:18px;line-height:120%;color:#161616CC;margin:30px auto 60px;text-align:center}h2~p span{font-weight:600}.base-width{max-width:1300px;padding:100px 20px;margin:0 auto}.mobile{display:none}.pc{display:block}.plate{display:none}.pc-plate{display:block}.pink-button-box{display:flex;align-items:center;justify-content:center}.pink-button{width:fit-content;display:inline-block;padding:0 10px;font-weight:600;font-size:20px;line-height:50px;height:50px;text-align:center;border-radius:6px;color:#FFF;background:linear-gradient(180deg,#E43BFF 0%,#983BFF 100%);cursor:pointer}.pink-button:hover{background:linear-gradient(180deg,#C74FFF 0%,#7C3DFF 100%)}.play-box{display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:50%;background:#DD3BFF;cursor:pointer;color:#fff;flex-shrink:0}.play-box:hover{background:#D300FF}.play-box svg{width:16px;height:16px}.play-box .play-icon{display:block}.play-box .pause-icon{display:none}.play-box.start .play-icon{display:none}.play-box.start .pause-icon{display:block}@media (max-width:1024px){h1{font-size:32px;line-height:120%}h1~p{font-size:16px}h2{font-size:28px;line-height:120%}h2~p{font-size:18px;line-height:140%;margin:30px 0 40px}.base-width{padding:50px 20px}.plate{display:block}.pc-plate{display:none}}@media (max-width:768px){.mobile{display:block}.pc{display:none}}.banner{background:#000 url(https://images.topmediai.com/topmediaifr/assets/overview/ai-music-composition/banner-bg.jpg) no-repeat center/cover;padding:0 0 100px}.banner .base-width{padding-top:80px;padding-bottom:0}.banner h1{position:relative}.banner h1 span{position:relative;z-index:1}.banner h1 img{position:absolute;top:75%;left:44%;transform:translateX(-50%);height:21px}.banner .text-to-song-outside{background:linear-gradient(270deg,#993BFF 0%,#E33BFF 100%);padding:2px;border-radius:20px;overflow:hidden}.banner .text-to-song{border-radius:20px;padding:30px;background:#fff;display:flex;column-gap:30px;row-gap:20px}.banner .text-to-song .song-left{width:57%;text-align:center}.banner .text-to-song .song-left .song-nav{display:flex;column-gap:40px;margin-bottom:24px;cursor:pointer}.banner .text-to-song .song-left .song-nav .song-nav-item{font-weight:600;font-size:24px;line-height:34px;color:#16161699}.banner .text-to-song .song-left .song-nav .song-nav-item.active{color:#DD3BFF;border-bottom:2px solid #DD3BFF}.banner .text-to-song .song-left .prompt-to-song,.banner .text-to-song .song-left .lyrics-to-song{display:none}.banner .text-to-song .song-left .prompt-to-song.active,.banner .text-to-song .song-left .lyrics-to-song.active{display:block}.banner .text-to-song .song-left .text-header{font-weight:600;font-size:18px;line-height:30px;color:#161616;margin-bottom:10px;text-align:left}.banner .text-to-song .song-left .song-textarea-box{border:1px solid #E5E9EE;background:#F4F5F7;padding:16px;display:flex;flex-direction:column;border-radius:12px;margin-bottom:20px}.banner .text-to-song .song-left .song-textarea-box textarea{border:none;resize:none;background:transparent;flex:1;font-weight:400;font-size:16px;line-height:140%;color:#16161699;text-align:left}.banner .text-to-song .song-left .song-textarea-box textarea::-webkit-scrollbar{width:6px;height:1px}.banner .text-to-song .song-left .song-textarea-box textarea::-webkit-scrollbar-thumb{border-radius:12px;background:#16161699}.banner .text-to-song .song-left .song-textarea-box.prompt-textarea-box{height:470px}.banner .text-to-song .song-left .song-textarea-box.lyrics-textarea-box{height:300px}.banner .text-to-song .song-left .song-textarea-box.style-textarea-box{height:110px}.banner .text-to-song .song-left .song-textarea-box textarea::placeholder{color:#16161699}.banner .text-to-song .song-left .song-textarea-box .text-footer{text-align:right}.banner .text-to-song .song-left .song-textarea-box .text-footer .random-text{border:none;background:#F8D8FF;font-weight:400;font-size:18px;line-height:120%;text-align:center;color:#2e2e2e;padding:9px 20px;border-radius:6px}.banner .text-to-song .song-left .song-textarea-box .text-footer .random-text:hover{background:#DD3BFF;color:#fff}@keyframes spin{from{transform:rotate(0deg)}to{transform:rotate(360deg)}}.banner .pink-button{display:inline-flex;align-items:center;column-gap:8px;padding:0 10px;border:none}.banner .pink-button svg{width:20px;height:20px}.banner .pink-button img{width:20px;height:20px;display:none;animation:spin 1s linear infinite;transition:transform 0.3s ease}.banner .pink-button.generating svg{display:none}.banner .pink-button.generating img{display:block}.banner .pink-button span{font-weight:600;font-size:20px;line-height:120%;text-align:center;color:#fff}.banner .song-right{width:43%;text-align:center}.banner .song-right .song-info-box{background:url(https://images.topmediai.com/topmediaifr/assets/overview/ai-music-composition/lyric-bg.jpg) no-repeat 0 0 / 100% 100%;text-align:center;padding:30px 24px 16px;border-radius:12px;overflow:hidden}.banner .song-right .song-title{font-weight:600;font-size:18px;line-height:30px;text-align:center;color:#161616}.banner .song-right .song-cover{width:100px;height:100px;border:2px solid #FFF;border-radius:16px;overflow:hidden;margin:12px 0 16px}.banner .song-right .song-cover img{width:100%}.banner .song-right .song-text{font-weight:400;font-size:16px;line-height:160%;text-align:center;color:#161616CC;max-height:260px;overflow:auto}.banner .song-right .song-text::-webkit-scrollbar{width:6px;height:1px}.banner .song-right .song-text::-webkit-scrollbar-thumb{border-radius:12px;background:rgba(255,255,255,.5)}.banner .song-right .song-audio{display:flex;align-items:center;padding:8px 16px;background:#FFFFFF4D;border:1px solid #FFFFFF80;margin-top:16px;border-radius:24px}.banner .song-right .song-progcess{flex:1;height:8px;background:#fff;position:relative;border-radius:24px;overflow:hidden;margin:0 16px 0 10px;cursor:pointer}.banner .song-right .song-progcess .song-progcess-bar{position:absolute;top:0;left:0;height:100%;background:#DD3BFF}.banner .song-right .song-progcess .song-time{font-weight:400;font-size:16px;line-height:140%;color:#16161666;min-width:45px}.banner .song-right .free-to-play{display:inline-flex;align-items:center;column-gap:8px;margin-top:34px;color:#AB00D1}.banner .song-right .free-to-play:hover{text-decoration:underline}.banner .song-right .free-to-play span{font-weight:400;font-size:18px;line-height:120%}.banner .song-right .free-to-play svg{width:18px;height:14px}@media (max-width:1024px){.banner{background-image:url(https://images.topmediai.com/topmediaifr/assets/overview/ai-music-composition/banner-bg-m.jpg)}.banner .base-width{padding-top:30px}.banner h1 img{height:14px}.banner .text-to-song{flex-wrap:wrap}.banner .text-to-song .song-left{width:100%}.banner .text-to-song .song-right{width:100%}.banner .text-to-song .song-left .song-textarea-box.style-textarea-box{height:146px}}@media (max-width:768px){.banner{padding:0 0 50px}.banner .text-to-song{padding:20px}.banner .text-to-song .song-left .song-nav{font-size:20px;margin-bottom:20px}.banner .song-right .song-cover{width:80px;height:80px}.banner .song-right .song-text{font-size:14px}}@media (max-width:607px){.banner h1 img{top:40%}}@media (max-width:550px){.banner h1 img{left:49%}}@media (max-width:500px){.banner h1 img{left:55%}}@media (max-width:430px){.banner h1 img{left:66%}}@media (max-width:375px){.banner h1 img{left:74%}}.multiple-methods .methods-list{display:flex;column-gap:30px;row-gap:20px;align-items:center;flex-wrap:wrap}.multiple-methods .methods-item{position:relative;border-radius:18px;width:380px;height:220px;overflow:hidden}.multiple-methods .methods-item .item-title{position:absolute;top:16px;left:50%;transform:translateX(-50%);font-weight:700;font-size:18px;line-height:100%;text-align:center;color:#161616;margin:0}.multiple-methods .methods-item .item-text{display:none;position:absolute;top:0;left:0;width:100%;height:100%;padding:24px;background:#00000080;backdrop-filter:blur(8px);font-weight:400;font-size:18px;line-height:140%;text-align:left;color:#fff}@media (min-width:1024px){.multiple-methods .methods-item:hover .item-text{display:block}}@media (max-width:1024px){.multiple-methods .methods-item:active .item-text{display:block}}.multiple-methods .methods-box{padding:100px 0;display:flex;gap:30px;align-items:center;justify-content:center}.multiple-methods .methods-box:nth-of-type(3){border-top:2px dashed #DED2FF;border-bottom:2px dashed #DED2FF}.multiple-methods .methods-box:nth-of-type(3) .methods-box-left{order:2}.multiple-methods .methods-box:nth-of-type(3) .methods-box-right{order:1}.multiple-methods .methods-box .methods-box-left{max-width:530px;min-width:328px}.multiple-methods .methods-box .methods-box-left h3{font-weight:700;font-size:34px;line-height:48px;color:#161616;margin:0}.multiple-methods .methods-box .methods-box-left .methods-pagination-list{display:flex;row-gap:16px;flex-direction:column;margin:30px 0}.multiple-methods .methods-box .methods-box-left .methods-pagination-list .pagination-item{padding:16px;box-sizing:border-box;background:#ECE5FC;border-radius:6px;cursor:pointer;border-left:4px solid transparent;transition:all 0.3s ease-in-out}.multiple-methods .methods-box .methods-box-left .methods-pagination-list .pagination-item .item-title{font-weight:600;font-size:20px;line-height:120%;color:#161616}.multiple-methods .methods-box .methods-box-left .methods-pagination-list .pagination-item .item-text{font-weight:400;font-size:16px;line-height:120%;color:#161616CC;margin-top:16px;display:none}.multiple-methods .methods-box .methods-box-left .methods-pagination-list .pagination-item.active{background:#fff;border-left:4px solid #DD3BFF}.multiple-methods .methods-box .methods-box-left .methods-pagination-list .pagination-item.active .item-title{color:#AB00D1}.multiple-methods .methods-box .methods-box-left .methods-pagination-list .pagination-item.active .item-text{display:block}.multiple-methods .methods-box .methods-box-left .pink-button{padding:0 24px;line-height:20px;display:flex;align-items:center}.multiple-methods .methods-box .methods-box-right{max-width:700px;border-radius:16px;overflow:hidden;text-align:center}.multiple-methods .methods-box .methods-box-right .swiper-slide,.multiple-methods .methods-box .methods-box-right .swiper-slide img{border-radius:16px}.multiple-methods .methods-box .methods-box-right .methods-song{border:1px solid #EE9DFF;border-radius:24px;display:inline-flex;align-items:center;background:#FFF;padding:8px 16px;margin-top:16px}.multiple-methods .methods-box .methods-box-right .methods-song .song-text{font-weight:400;font-size:16px;line-height:24px;color:#AB00D1;margin:0 16px 0 10px}.multiple-methods .methods-box .methods-box-right .methods-song img{width:32px;height:22px}@media (max-width:1024px){.multiple-methods .methods-box{flex-wrap:wrap;padding:50px 0}.multiple-methods .methods-box:nth-of-type(3) .methods-box-left{order:1}.multiple-methods .methods-box:nth-of-type(3) .methods-box-right{order:2}.multiple-methods .methods-box .methods-box-left{text-align:center}.multiple-methods .methods-box .methods-box-left h3{font-size:28px}.multiple-methods .methods-box .methods-box-left .methods-pagination-list .pagination-item{text-align:left}.multiple-methods .methods-box .methods-box-left .methods-pagination-list .pagination-item .item-title{font-size:18px}.multiple-methods .methods-box .methods-box-right .swiper-slide,.multiple-methods .methods-box .methods-box-right .swiper-slide img{border-radius:8px}.multiple-methods .methods-box .methods-box-right .swiper-slide img{margin-top:5px}.multiple-methods .methods-box .methods-box-right .methods-song{margin-top:20px}}@media (max-width:768px){.multiple-methods .methods-list{justify-content:center}.multiple-methods .methods-item{width:335px;height:194px}.multiple-methods .methods-item .item-text{font-size:16px}}@media (max-width:480px){.multiple-methods .methods-box .methods-box-right .methods-song .song-text{font-size:12px;margin-right:14px}.multiple-methods .methods-box .methods-box-left .pink-button{font-size:18px}}.multi-function{background:#000 url(https://images.topmediai.com/topmediaifr/assets/overview/ai-music-composition/bg.jpg) no-repeat 0 0 / 100% 100%}.multi-function h2{color:#FFF}.multi-function h2~p{color:#FFF9}.multi-function .multi-function-box-outside{padding:2px;background:linear-gradient(270deg,#6E67FF 0%,#9A4CFF 100%);border-radius:20px}.multi-function .multi-function-box{border-radius:20px;background:#1C1934;padding:40px;display:flex;column-gap:40px;row-gap:20px;align-items:center}.multi-function .multi-function-box .pagination-list{display:flex;flex-direction:column;row-gap:20px;width:33.3%}.multi-function .multi-function-box .pagination-list .pagination-item{width:100%;padding:12px 20px;border-radius:16px;background:#1C1934;display:flex;column-gap:10px;cursor:pointer}.multi-function .multi-function-box .pagination-list .pagination-item.active{background:linear-gradient(90deg,#9B4CFF 0%,#6F67FF 100%)}.multi-function .multi-function-box .pagination-list .pagination-item.active .item-content p{display:block}.multi-function .multi-function-box .pagination-list .pagination-item svg{width:24px;height:24px;min-width:24px;min-height:24px}.multi-function .multi-function-box .pagination-list .pagination-item .item-content h3{font-weight:600;font-size:20px;line-height:120%;color:#FFF;margin:0}.multi-function .multi-function-box .pagination-list .pagination-item .item-content p{font-weight:400;font-size:18px;line-height:120%;color:#FFFC;margin-top:8px;display:none}.multi-function .multi-function-box .swiper-container{flex:1;border-radius:24px}.multi-function .multi-function-box .swiper-container img{border-radius:24px}.multi-function .pink-button-box{margin-top:40px}.multi-function .pink-button{display:none}.multi-function .pink-button.active{display:inline-block}@media (max-width:1024px){.multi-function{background:url(https://images.topmediai.com/topmediaifr/assets/overview/ai-music-composition/bg-m.jpg) no-repeat 0 0 / 100% 100%}.multi-function .multi-function-box{flex-wrap:wrap}.multi-function .multi-function-box .pagination-list{width:100%}.multi-function .multi-function-box .swiper-container{width:100%}.multi-function .pink-button.active{line-height:20px;display:flex;align-items:center}}@media (max-width:768px){.multi-function .multi-function-box{padding:10px}.multi-function .multi-function-box .pagination-list .pagination-item{padding:12px 16px}.multi-function .multi-function-box .pagination-list .pagination-item .item-content p{font-size:16px}.multi-function .multi-function-box .swiper-container,.multi-function .multi-function-box .swiper-container img{border-radius:8px}}.use-cases .pagination-list{display:grid;grid-template-columns:repeat(4,1fr);align-items:center;column-gap:40px}.use-cases .pagination-list .pagination-item{cursor:pointer;width:100%}.use-cases .pagination-list .pagination-item h3{font-weight:600;font-size:22px;line-height:120%;color:#161616;margin:0 0 12px}@keyframes progcess-bar-animation{0%{width:0}100%{width:100%}}.use-cases .pagination-list .pagination-item .progcess{width:100%;background:#EAE0FF;border-radius:2px;height:4px;position:relative;overflow:hidden;margin-bottom:30px}.use-cases .pagination-list .pagination-item .progcess .progcess-bar{position:absolute;top:0;left:0;width:0;height:100%;background:#E43BFF}.use-cases .pagination-list .pagination-item.active .progcess .progcess-bar{animation:progcess-bar-animation 5.2s linear forwards}.use-cases .pagination-list .pagination-item.active h3{color:#AB00D1}.use-cases .pagination-list .pagination-item .slide p,.use-cases .swiper-container .swiper-slide p{font-weight:400;font-size:18px;line-height:140%;text-align:center;color:#161616;margin-bottom:30px}.use-cases .pagination-list .pagination-item .slide img,.use-cases .swiper-container .swiper-slide img{border-radius:24px}.use-cases .pagination-list .pagination-item .slide{display:none;margin-bottom:16px}@media (max-width:1024px){.use-cases .swiper-container{position:fixed;left:-100vw;width:10px;height:10px}.use-cases .pagination-list{display:flex;justify-content:center;flex-direction:column;align-items:center;gap:0}.use-cases .pagination-list .pagination-item.active .slide{display:block}.use-cases .pagination-list .pagination-item .progcess{margin-bottom:16px}}.ai-composition{background:url(https://images.topmediai.com/topmediaifr/assets/overview/ai-music-composition/music-bg.jpg) no-repeat 0 0 / 100% 100%}.ai-composition .base-width{padding:80px 20px}.ai-composition h2{background:linear-gradient(90deg,#750CE8 0%,#C700E8 100%);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.ai-composition .pink-button{display:inline-flex;column-gap:8px;padding:13px 24px;align-items:center}.ai-composition .pink-button-box{margin-top:30px}.ai-composition .pink-button svg{width:20px;height:20px}.ai-composition .pink-button span{font-weight:600;font-size:20px;line-height:120%;text-align:center}@media (max-width:768px){.ai-composition{background:url(https://images.topmediai.com/topmediaifr/assets/overview/ai-music-composition/music-bg-m.jpg) no-repeat 0 0 / 100% 100%}.ai-composition .base-width{padding:50px 20px}}.hot-faq{text-align:center}.hot-faq .hot-nav{display:inline-flex;border:1px solid #DDD;background:#FFF;font-weight:600;font-size:22px;line-height:120%;padding:2px;border-radius:24px;margin-bottom:40px}.hot-faq .hot-nav .nav-item{display:inline-block;border-radius:24px;padding:12px 24px;cursor:pointer;font-weight:600;font-size:22px;line-height:120%}.hot-faq .hot-nav .nav-item.active{background:#161616;color:#fff}.hot-faq .hot.active{display:block}.hot-faq .hot{padding:80px 48px;background:#FFF;border-radius:30px;display:none}.hot-faq .hot .hot-list{display:grid;grid-template-columns:repeat(2,1fr);row-gap:40px}.hot-faq .hot .hot-list .hot-item{display:flex;align-items:baseline}.hot-faq .hot .hot-list .hot-item{color:#161616}.hot-faq .hot .hot-list .hot-item svg{width:16px;height:16px;margin-left:4px}.hot-faq .hot .hot-list .hot-item .hot-span{display:inline-block;background:linear-gradient(99.11deg,#B454FF 6.91%,#FF57B8 50.06%,#FF9D66 93.09%);font-weight:700;font-size:14px;line-height:20px;text-align:center;color:#FFF;width:39px;height:20px;border-radius:4px;margin-left:8px}.hot-faq .hot .hot-list .hot-item p{font-weight:600;font-size:20px;line-height:120%;text-align:left}.hot-faq .hot .hot-list .hot-item a{display:block;margin-left:8px;font-weight:600;font-size:20px;line-height:120%;text-align:left}.hot-faq .hot .hot-list .hot-item:hover,.hot-faq .hot .hot-list .hot-item:hover a,.hot-faq .hot .hot-list .hot-item:hover p{color:#DD3BFF}.hot-faq .hot .hot-list .hot-item:hover a{text-decoration:underline}.hot-faq .hot .pink-button-box{margin-top:60px}.hot-faq .hot .pink-button{padding:0 84px}.hot-faq .faq.active{display:block}.hot-faq .faq{padding:30px;border-radius:30px;background:#FFF;display:none}.hot-faq .faq li{margin-bottom:30px;padding:0 0 30px;border-bottom:1px solid #CBCBCB;cursor:pointer}.hot-faq .faq li b{display:flex;justify-content:space-between;align-items:center;font-size:20px;color:#161616;text-align:left}.hot-faq .faq li p{display:none;font-size:18px;color:#161616CC;line-height:120%;margin-top:24px;text-align:left}.hot-faq .faq li b span{position:relative;display:inline-block;width:32px;height:32px;border:1px solid #161616;cursor:pointer;border-radius:100%;flex-shrink:0;margin-left:10px}.hot-faq .faq li b span:before,.hot-faq .faq li b span:after{content:'';width:12px;height:3px;border-radius:3px;background:#161616;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.hot-faq .faq li b span:after{transform:rotate(90deg) translate(-50%,-60%);transform-origin:0 0}.hot-faq .faq li.active b{color:#DD3BFF}.hot-faq .faq li.active p{display:block}.hot-faq .faq li.active b span:before{background:#2C2935}.hot-faq .faq li.active b span:after{display:none}.hot-faq .faq li p a{cursor:pointer;text-decoration:underline}.hot-faq .faq li p a:hover{color:#DD3BFF}@media (max-width:1024px){.hot-faq .hot{padding:30px 20px}.hot-faq .hot .hot-list{grid-template-columns:1fr;row-gap:20px;justify-content:center}.hot-faq .hot .hot-list .hot-item a,.hot-faq .hot .hot-list .hot-item p{font-size:18px}.hot-faq .hot .pink-button-box{margin-top:30px}.hot-faq .faq{padding:0 0 32px}.hot-faq .faq{padding:30px 20px}.hot-faq .faq li{margin-bottom:20px;padding:0 0 20px}}@media (max-width:768px){.hot-faq .hot-nav{margin-bottom:30px}.hot-faq .hot-nav .nav-item{font-size:14px;padding:8px 12px}}.bottom-banner{background:#000 url(https://images.topmediai.com/topmediaifr/assets/overview/ai-music-composition/bottom-banner.jpg) no-repeat 0 0 / 100% 100%}.bottom-banner h2{color:#FFF}.bottom-banner h2~p{margin-bottom:40px;color:#FFFC}.bottom-banner .pink-button-box{column-gap:40px;row-gap:20px;flex-wrap:wrap}.bottom-banner .pink-button-box .pink-button{padding:0;width:240px;line-height:54px;height:54px}.bottom-banner .pink-button-box .white-button{width:240px;line-height:54px;background:#FFF;border-radius:6px;font-size:20px;line-height:54px;text-align:center;color:#AB00D1}.bottom-banner .pink-button-box .white-button:hover{background:#F8D8FF}@media (max-width:768px){.bottom-banner{background:url(https://images.topmediai.com/topmediaifr/assets/overview/ai-music-composition/bottom-banner-m.jpg) no-repeat 0 0 / 100% 100%}.bottom-banner h2~p{margin-bottom:30px}}