.creation_container{background-color: #fff;padding:1.5rem 3rem 0;}
.creation_container .top_box{}
.creation_container .top_box .label{color:#121317;font-size: 32px;font-weight: 700;line-height: 62px;margin-bottom: 16px;}
.creation_container .top_box .label b{font-family: 'SimSun', serif;}
.creation_container .work_box{padding:15px;background-color:#fcfcfd;border-radius: 16px;border:1px solid #00000012;}
.creation_container .work_box .content{min-height: 84px;resize: none;background-color: transparent;}
.creation_container .work_box .select_box{padding: 5px 8px 5px 5px;background-color: #fff;border:1px solid #e5e5eb;border-radius: 12px;gap:8px;}
.creation_container .work_box .select_box:hover{border:1px solid #99999980;}
.creation_container .work_box .select_box img{width:24px;height:24px;border-radius: 6px;}
.creation_container .work_box .select_box i{font-size: 12px;}
.creation_container .work_box .generate_btn{height: 36px;font-weight: 500;background-color: var(--primary-color);color: #fff;gap:5px;}
.creation_container .work_box .generate_btn.disabled{cursor: not-allowed;opacity: .6;}
.creation_container .middle_box{}
.creation_container .middle_box .top{font-weight: 600;line-height: 26px;font-size: 18px;}
.creation_container .middle_box .top .more{color: #5a5e68;font-size: 12px;}
.creation_container .middle_box .voices_box .items_box{overflow-x: auto;display:grid;grid-template-columns:repeat(6,1fr);justify-content:center;align-items:center;gap:1.5rem;}
.creation_container .middle_box .voices_box .item{min-width: 152px;}
.creation_container .middle_box .voices_box .item img{transition: all 0.4s cubic-bezier(0.175, 0.885, 0.32, 1.275);}
.creation_container .middle_box .voices_box .item img:hover{transform: scale(1.16) perspective(1000px);}
.creation_container .middle_box .voices_box .item .name{line-height: 21px;margin-top:.375rem;}
.creation_container .middle_box .voices_box .item .tag_box{margin-top:.375rem;gap:.375rem;}
.creation_container .middle_box .voices_box .item .tag{color:#000000bf;font-size: 12px;background-color: #c8ceda26;border-radius: .375rem;height: 21px;}
.creation_container .middle_box .voices_box .item .play_btn{width:36px;height:36px;background-color:#fff;position: absolute;left:10px;bottom:10px;padding:10px;border-radius: 100px;}
.creation_container .middle_box .voices_box .item .play_btn i{margin-right: -4px;}
.creation_container .middle_box .voices_box .audio-overlay{display:flex;position: absolute;left: 10px;top: 4px;}
.creation_container .middle_box .voices_box .audio-overlay .iconfont{color:#333;font-size: 20px;}
.creation_container .middle_box .voices_box .play_btn.current-play-active .audio-overlay{left:8px;}
.creation_container .bottom_box{}
.creation_container .bottom_box .top{font-weight: 600;line-height: 26px;font-size: 18px;}
.creation_container .bottom_box ._box{padding:29px;border-radius: 16px;gap:2.5rem;background-color: #c8ceda0f;border:1px solid #c8ceda29;}
.creation_container .bottom_box ._box:hover{border:1px solid #c8ceda80;}
.creation_container .bottom_box ._box .box_r{gap:62px;}
.creation_container .bottom_box ._box .top{align-self: flex-start;}
.creation_container .bottom_box ._box .name{color: #121317;font-size: 20px;margin-bottom: 8px;}
.creation_container .bottom_box ._box .desc{color: #121317;font-size: 12px;}
.creation_container .bottom_box ._box .bottom .try_btn{border:1px solid #121317;border-radius: 32px;position: relative;overflow: hidden;transition: all 0.2s ease;}
.creation_container .bottom_box ._box .bottom .try_btn::before {content: '';position: absolute;top: -100%;left: 0;width: 100%;height: 100%;background-color:#000;transition: top 0.2s ease;z-index: 1;}
.creation_container .bottom_box ._box .bottom .try_btn:hover::before {top: 0;}
.creation_container .bottom_box ._box .bottom .try_btn span {position: relative;z-index: 2;transition: all 0.2s ease;display: flex;align-items: center;justify-content: center;}
.creation_container .bottom_box ._box .bottom .try_btn:hover span {color: white;}
.creation_container .bottom_box .play_btn.current-play-active{background-color: unset !important;}
.creation_container .bottom_box ._box.box_1 .play_box{flex-direction: row;width:155px;height:58px;top:18px;left:-12px;transition: all .3s ease;box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .102);font-size: 15px;padding:5px 17px;background-color: #baadf5;color:#fff;border-radius: 16px;}
.creation_container .bottom_box ._box.box_1 .play_box .play_btn i{font-size: 2rem;}
.creation_container .bottom_box ._box.box_1 .play_box:nth-child(2){top:98px;right:-12px;left:auto;background-color: #74747c;}
.creation_container .bottom_box ._box.box_1:hover .play_box:nth-child(1){transform: scale(1.08) perspective(1000px) rotate(-9deg);}
.creation_container .bottom_box ._box.box_1:hover .play_box:nth-child(2){transform: scale(1.08) perspective(1000px) rotate(9deg);}
.creation_container .bottom_box ._box.box_2 .play_box{flex-direction: row;width: 152px;top: 12px;right:-12px;transition: all .3s ease;box-shadow: 0 4px 4px 0 rgba(0, 0, 0, .102);color: #121317;font-size: 12px;padding:1px 0 1px 1px;background-color: #fff;}
.creation_container .bottom_box ._box.box_2 .play_box button{width: 32px;height: 32px;}
.creation_container .bottom_box ._box.box_2 .play_box .icon_box{color: #fff;top:7px;left:7px;}
.creation_container .bottom_box ._box.box_2 .play_box img{width: 32px;height: 32px;}
.creation_container .bottom_box ._box.box_2 .play_box:nth-child(2){top:66px;left:-12px;right:auto;}
.creation_container .bottom_box ._box.box_2 .play_box:nth-child(3){top:120px;right:-12px;}
.creation_container .bottom_box ._box.box_2:hover .play_box:nth-child(1){transform: scale(1.08) perspective(1000px) rotate(9deg);}
.creation_container .bottom_box ._box.box_2:hover .play_box:nth-child(2){transform: scale(1.08) perspective(1000px) rotate(-9deg);}
.creation_container .bottom_box ._box.box_2:hover .play_box:nth-child(3){transform: scale(1.08) perspective(1000px) rotate(9deg);}

@media (max-width: 1340px) {
    .creation_container .bottom_box .sub_box{flex-direction: column;}
    .creation_container .bottom_box ._box{width:100%;}
}