.ci-box{position:relative}.ci-box .boxs{height:100%;position:absolute;width:100%;z-index:1}.ci-box .box{backface-visibility:hidden;height:50%;position:absolute;text-align:left;transform-style:preserve-3d;transition:all .6s ease-in-out;width:50%}.ci-box .info{margin:0;position:relative;text-align:center;top:0;z-index:2}.ci-box .info img{width:520px}.ci-box .box-content .title{color:#00807b;font-size:24px;font-weight:600;line-height:1.3;margin:0 0 5px}.ci-box .box-content .text{color:#000;display:none;font-size:18px;font-weight:400;line-height:1.4}.ci-box .box-content-2 .title{color:#fc3}.ci-box .box-content-2 .text{color:#fff;display:block}.ci-box .hover-div{background:red;cursor:pointer;display:block;height:100%;opacity:0;position:absolute;width:100%;z-index:5}.ci-box .box{pointer-events:none;pointer-events:auto}.ci-box .box.active .box-content .text{opacity:1}.ci-box .box-content{align-items:center;background:#d8dfe4;background:linear-gradient(90deg,#d8dfe4,#d8dfe4,hsla(0,0%,100%,0));border-radius:100px;box-shadow:0 10px 10px 0 rgb(0 0 0/5%);display:flex;height:210px;margin:1px 0;position:relative;transition:all .3s ease-in-out;width:90%;z-index:2}.ci-box .box-content-2{background:#214f4d;position:absolute;z-index:1}.ci-box .box:nth-child(2) .box-content-2,.ci-box .box:nth-child(4) .box-content-2{background:#214f4d!important}.ci-box .box:first-child{left:0;top:0}.ci-box .box:nth-child(2){right:0;top:0}.ci-box .box:nth-child(3){bottom:-45px;left:0}.ci-box .box:first-child .hover-div,.ci-box .box:nth-child(4){bottom:-45px;right:0}.ci-box .box:nth-child(2) .hover-div{bottom:0;left:0}.ci-box .box:nth-child(3) .hover-div{right:0;top:0}.ci-box .box:first-child .box-content-2,.ci-box .box:nth-child(4) .hover-div{left:0;top:0}.ci-box .box:nth-child(2) .box-content-2{right:0;top:0}.ci-box .box:nth-child(3) .box-content-2{left:0;top:0}.ci-box .box:nth-child(4) .box-content-2{right:0;top:0}.ci-box .box:nth-child(2) .box-content,.ci-box .box:nth-child(4) .box-content{background:#d8dfe4;background:linear-gradient(270deg,#d8dfe4,#d8dfe4,hsla(0,0%,100%,0));display:flex;float:right;justify-content:flex-end}.ci-box .box .box-content>div{max-width:340px;min-width:340px;padding:10px 50px}.ci-box .box .box-content{backface-visibility:hidden;transform-style:preserve-3d;transition:all .6s ease-in-out}.ci-box .box .box-content-2{box-shadow:0 0 15px rgb(0,0,0,.15);-o-box-shadow:0 0 15px rgba(0,0,0,.15);-moz-box-shadow:0 0 15px rgba(0,0,0,.15);-webkit-box-shadow:0 0 15px rgb(0,0,0,.15);transform:rotateX(0) rotateY(180deg)}.ci-box .box.active .box-content{transform:rotateX(0) rotateY(-180deg)}.ci-box .box.active .box-content-2{backface-visibility:hidden;transform:none;transform-style:preserve-3d}.ci-box .hover div{cursor:pointer;height:50%;position:absolute;width:50%}.ci-box .hover .hover-div-1{left:0;top:0}.ci-box .hover .hover-div-2{right:0;top:0}.ci-box .hover .hover-div-3{bottom:0;left:0}.ci-box .hover .hover-div-4{bottom:0;right:0}.mobile-img{display:none}@media (max-width:768px){.ci-box{display:none}.mobile-img{display:block}}