.box-layout{margin:0 auto;width:1310px;padding-left:15px;padding-right:15px;z-index:9;-webkit-box-shadow:0 0 15px rgba(0,0,0,.1);box-shadow:0 0 15px rgba(0,0,0,.1)}.body_overlay{position:relative}.body_overlay:before{content:"";position:absolute;width:100%;height:100%;background:rgba(0,0,0,.4)}.box_bg_style,.switcher_layout{border-top:1px solid}.select_bg{display:inline-block;width:100%}.layout_title{font-size:14px;margin-bottom:10px;display:inline-block}.radio_check{border-radius:22px;display:block;height:44px;width:100px;position:relative;overflow:hidden}.radio_check input[type=checkbox]{display:none}.radio_check label{padding:0 15px;transform:translateX(0);width:156px;cursor:pointer;max-width:inherit}.radio_check input[type=checkbox]:checked+label{transform:translateX(-56px)}.radio_check label span{line-height:44px}.radio_check label span:first-child{float:left}.radio_check label span:last-child{float:right}.radio_check label::before{background-color:#fff;border-radius:50%;content:"";height:40px;left:58px;position:absolute;top:2px;width:40px;z-index:1}[type=radio]{display:none}label.radios{position:relative;padding-left:25px;cursor:pointer;font-weight:500;width:30px;height:30px;margin-bottom:-5px}[type=radio]:checked+label.radios::after{content:'✔';line-height:28px;border:1px solid;text-align:center}.box_bg_style label::after{content:'';position:absolute;left:0;top:0;width:100%;height:100%;box-shadow:inset 0 1px 3px rgba(0,0,0,.1)}[type=radio]:checked+label.radios::before{content:'';position:absolute;left:0;top:0;width:30px;height:30px}.box_bg_style li{float:left;margin:0 3px 0 0}.on-panel{height:45px;left:-45px;position:absolute;top:0;width:45px;cursor:pointer}.color-panel{position:fixed;right:-225px;top:140px;z-index:999;-webkit-transition:all .5s ease-in-out;-ms-transition:all .5s ease-in-out;-o-transition:all .5s ease-in-out;-moz-transition:all .5s ease-in-out;transition:all .5s ease-in-out}.color-panel.open{right:0}.on-panel{height:45px;left:-45px;position:absolute;top:0;width:45px;cursor:pointer;z-index:9999}.on-panel img{padding:10px}.box_bg_style,.panel-box,.switcher_layout{padding:14px 10px 14px 20px;width:225px;background:#f8f8f8;display:table}.panel-box .panel-title{display:inline-block;width:100%;margin-bottom:10px}.color-box{display:table;width:100%;text-align:left}.color-box li{display:inline-block;width:27px;height:27px;margin-right:5px;cursor:pointer}.scroll-btn{position:fixed;right:30px;bottom:50px;width:35px;height:35px;line-height:33px;text-align:center;color:#fff;z-index:9}.color-panel{background-color:#fff}.color-box li{position:relative;overflow:hidden}.color-box li:before{position:absolute;content:"";width:110%;height:145%;z-index:9;transform:rotate(45deg);left:11px;top:5px}.color-box li.default{background-color:#84fab0}.color-box li.default:before{background:#8fd3f4}.color-box li.color-2{background-color:#fbc2eb}.color-box li.color-2:before{background:#a6c1ee}.color-box li.color-3{background-color:#ffafbd}.color-box li.color-3:before{background:#ffc3a0}.color-box li.color-4{background-color:#a1c4fd}.color-box li.color-4:before{background:#c2e9fb}.color-box li.color-5{background-color:#f6d365}.color-box li.color-5:before{background:#fda085}.color-box li.color-6{background-color:#81e3fb}.color-box li.color-6:before{background:#ffc0d9}.color-box li.color-7{background-color:#d86ffb}.color-box li.color-7:before{background:#cea7db}.color-box li.color-8{background-color:#94e900}.color-box li.color-8:before{background:#7fb843}.color-box li.color-9{background-color:#767bdd}.color-box li.color-9:before{background:#b1b5fe}.color-box li.color-10{background-color:#36d1dc}.color-box li.color-10:before{background:#5b86e5}