.container{ position: fixed; top: 0; bottom: 0; right: 0; left: 0; & .content{ width: 100%; height: 100%; border: none; //flex: none; } & .dragbox{ display: flex; position: fixed; top: 2.5rem; right: -14.5rem; width: 17.6875rem; height: 3.2rem; z-index: var(--zindex-second); //overflow: hidden; } & .backbox{ display: flex; //position: fixed; position: absolute; //top: 2.5rem; //right: -14.5rem; top: 0; left: 0; width: 17.6875rem; height: 3.2rem; //z-index: var(--zindex-second); //overflow: hidden; &.open{ transition: all .3s; transform: translate(-7.875rem); } &.close{ transition: all .3s; transform: translate(0); } & .back_btn{ display: flex; position: relative; align-items: center; justify-content: center; z-index: 2; width: 3.1rem; height: 3.1rem; & .back_bg{ width: 100%; height: auto; } & .arrow{ position: absolute; width: 25%; height: auto; top: .88rem; left: 1.1rem; &.a_open{ transition: all .3s; transform: rotate(180deg); } &.a_close{ transition: all .3s; transform: rotate(0); } } } & .close_box{ display: flex; position: relative; align-items: center; justify-content: center; z-index: 1; width: 9.5rem; margin-top: 2rem; margin-left: -1.2rem; & .bg{ width: 100%; } & .close_info{ position: absolute; left: 2rem; right: 1.3rem; top: -0.3rem; display: flex; align-items: center; justify-content: space-between; color: #fff; } & .line{ transform: rotate(-72deg); opacity: .3; background-color: #fff; width: 1.25rem; height: .0625rem; } & .close{ width: 1.2rem; height: 1.2rem; } } } } .loading{ position: fixed; top: 0; left: 0; right: 0; bottom: 0; }