/*@import url(https://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700);*/

.wrapper {
	position:absolute;
	left:0;
	top:0;
	z-index:2;
	transform:translateX(-50%);
}

.steps {
  list-style: none;
  z-index: 0;
  position: relative;
  border-radius: 50%;
  width:64.6rem;
  height:64.6rem;
  border-radius: 100%;
  overflow: hidden;
}
.steps .title{
	position:absolute;
	width:35rem;
	height:35rem;
	top:50%;
	left:50%;
	z-index:10;
	background:#5377d7;
	border:0.8rem solid #fff;
	border-radius:100%;
	transform:translate(-50%, -50%);
}
.steps .title span{
	font-size:4.8rem;
	color:#fff;
	float:right;
	width:50%;
	writing-mode: vertical-lr;
    display: flex;
    height: 100%;
    justify-content: center;
	letter-spacing: 0.5rem;
    box-sizing: border-box;
    padding: 0 0 0 2.5rem;
	font-weight:bold;
	
}
.steps-cont{
	display:none;	
}

.is-active{
  background: linear-gradient(466deg, #11b3f1 60%, #5179d8) !important;
}
#steps-menu, steps-menu ul{
	height:100%
}

#steps-menu ul li {
  -moz-transition: all 1.2s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  -o-transition: all 1.2s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  -webkit-transition: all 1.2s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  -ms-transition: all 1.2s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  transition: all 1.2s cubic-bezier(0.18, 0.89, 0.32, 1.28);
  left: 50%;
  list-style: none;
  position: absolute;
  top: 50%;
  transform-origin: 0 0;
  background:#96ccff;
  border:1px solid #fff;
  height:50%;
  width:50%;
  border: 2px solid #fff;
  overflow:hidden;
}
#steps-menu ul li a {
  -moz-transition: all 0.5s ease-in-out;
  -o-transition: all 0.5s ease-in-out;
  -webkit-transition: all 0.5s ease-in-out;
  -ms-transition: all 0.5s ease-in-out;
  transition: all 0.5s ease-in-out;
  color: #fff;
  text-decoration: none;
  text-align: center;
  font-size: 1.6em;
  /* writing-mode: vertical-lr; */
  letter-spacing: 0.5rem;
  position:absolute;
  right: 11%;
  top: 20%;
  font-size: 2.8rem;
}

.step-1 ul li:nth-of-type(1) {
  transform: rotate(-18deg);
  z-index:3;
}
.step-1 ul li:nth-of-type(1) a {
  transform: rotate(-75deg);
}

.step-2 ul li:nth-of-type(1) {
  transform: rotate(-54deg);
  z-index:2
}
.step-2 ul li:nth-of-type(1) a {
  transform: rotate(111deg);
}

.step-3 ul li:nth-of-type(1) {
  transform: rotate(-90deg);
}
.step-3 ul li:nth-of-type(1) a {
  transform: rotate(110deg);
}

.step-4 ul li:nth-of-type(1) {
  transform: rotate(54deg);
  z-index:3
}
.step-4 ul li:nth-of-type(1) a {
  transform: rotate(-77deg);
}

.step-5 ul li:nth-of-type(1) {
  transform: rotate(18deg);
  z-index:2
}
.step-5 ul li:nth-of-type(1) a {
  transform: rotate(-69deg);
}


.step-1 ul li:nth-of-type(2) {
  transform: rotate(18deg);
  z-index:4;
}
.step-1 ul li:nth-of-type(2) a {
  transform: rotate(-69deg);
}

.step-2 ul li:nth-of-type(2) {
  transform: rotate(-18deg);
  z-index:3;
}
.step-2 ul li:nth-of-type(2) a {
	transform: rotate(-75deg);
}

.step-3 ul li:nth-of-type(2) {
  transform: rotate(-54deg);
}
.step-3 ul li:nth-of-type(2) a {
  transform: rotate(111deg);
}

.step-4 ul li:nth-of-type(2) {
  transform: rotate(-90deg);
}
.step-4 ul li:nth-of-type(2) a {
  transform: rotate(110deg);
}

.step-5 ul li:nth-of-type(2) {
  transform: rotate(54deg);
  z-index:3
}
.step-5 ul li:nth-of-type(2) a {
  transform: rotate(-77deg);
}


.step-1 ul li:nth-of-type(3) {
  transform: rotate(54deg);
  z-index:5;
}
.step-1 ul li:nth-of-type(3) a {
  transform: rotate(-77deg);
}

.step-2 ul li:nth-of-type(3) {
  transform: rotate(18deg);
  z-index:4;
}
.step-2 ul li:nth-of-type(3) a {
  transform: rotate(-69deg);
}

.step-3 ul li:nth-of-type(3) {
  transform: rotate(-18deg);
}
.step-3 ul li:nth-of-type(3) a {
  transform: rotate(-75deg);
}

.step-4 ul li:nth-of-type(3) {
  transform: rotate(-54deg);
}
.step-4 ul li:nth-of-type(3) a {
  transform: rotate(111deg);
}

.step-5 ul li:nth-of-type(3) {
  transform: rotate(-90deg);
}
.step-5 ul li:nth-of-type(3) a {
  transform: rotate(110deg);
}


.step-1 ul li:nth-of-type(4) {
  transform: rotate(-90deg);
}
.step-1 ul li:nth-of-type(4) a {
  transform: rotate(110deg);
}

.step-2 ul li:nth-of-type(4) {
  transform: rotate(54deg);
  z-index:5;
}
.step-2 ul li:nth-of-type(4) a {
  transform: rotate(-77deg);
}

.step-3 ul li:nth-of-type(4) {
  transform: rotate(18deg);
}
.step-3 ul li:nth-of-type(4) a {
  transform: rotate(-69deg);
}

.step-4 ul li:nth-of-type(4) {
  transform: rotate(-18deg);
}
.step-4 ul li:nth-of-type(4) a {
  transform: rotate(-75deg);
}

.step-5 ul li:nth-of-type(4) {
  transform: rotate(-54deg);
}
.step-5 ul li:nth-of-type(4) a {
  transform: rotate(111deg);
}


.step-1 ul li:nth-of-type(5) {
  transform: rotate(-54deg);
}
.step-1 ul li:nth-of-type(5) a {
  transform: rotate(111deg);
}

.step-2 ul li:nth-of-type(5) {
  transform: rotate(-90deg);
}
.step-2 ul li:nth-of-type(5) a {
  transform: rotate(110deg);
}

.step-3 ul li:nth-of-type(5) {
  transform: rotate(54deg);
}
.step-3 ul li:nth-of-type(5) a {
  transform: rotate(-77deg);
}

.step-4 ul li:nth-of-type(5) {
  transform: rotate(18deg);
}
.step-4 ul li:nth-of-type(5) a {
  transform: rotate(-69deg);
}

.step-5 ul li:nth-of-type(5) {
  transform: rotate(-18deg);
}
.step-5 ul li:nth-of-type(5) a {
  transform: rotate(-75deg);
}




#step-1 {
  display: block;
}

.container {
	overflow:hidden;
	padding:1px 0 0 0;
	position:relative;
	height:64.6rem;
}
.container-fluid {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.col-sm-5{
  position: relative;
  z-index:1;
  min-height: 1px;
  max-width:143.6rem;
  height:43rem;
  padding:5rem 0 5rem 17rem;
  box-sizing: border-box;
  margin:10.8rem auto;
  background-image: linear-gradient(to right, rgba(223,234,255) , rgba(223,234,255, 0));
}
.col-sm-5 .box_50{ width:50%;}
.col-sm-5 .title{ color:#4169d0; font-size:3rem; font-weight:bold; margin:0 0 2rem 0;}
.col-sm-5 .left_cont li{    justify-content: normal;}
.col-sm-5 .left_cont li:before{ content:""; background:url(rczt20250613_03.png) left center no-repeat; width:1.4rem; height:2rem; background-size:100% auto; margin:0 2rem 0 0; }

.col-sm-5 .right_cont{margin:3rem 0 0 8rem;width:55rem;}
.all_flex_cont .w58{ width: 58%;}
.all_flex_cont .w42{ width: 42%;    margin: 3rem 0 0 0rem;}
.col-sm-5 .btn_cont a{ display:flex;background-image: linear-gradient(to right, #d7effd, #cae0fe); height:11.7rem; border-radius:0.5rem; margin:3rem 0 0 0; color:#2e4583; font-size:3rem; align-items: center; padding: 0 1rem; }
.col-sm-5 .btn_cont a:hover{ text-decoration:none;background-image: linear-gradient(to left, #d7effd, #cae0fe);}
.col-sm-5 .btn_cont span{ margin:0 2rem;}
.col-sm-5 .btn_cont span img{ width:6rem;}

.steps-cont { display: none; position: absolute; left: -100%; opacity: 0; transition: all 0.5s ease-in-out;}
.steps-cont_active {display: block;left: 13%;opacity: 1;}

@media (max-width:900px){
	.all_flex_cont{ display:block;}
	.container{ height:auto; margin:0.6rem 3%;}
	.wrapper{ position:relative;transform: none;}
	.steps{ width:auto; height:auto; border-radius:0;}
	.steps .title{margin: 0 0 1.5rem 0; position:relative;width:auto;float:none;height: auto;top: 0;left: 0;transform: none;border-radius: 0; background:none; border:none; margin:0.9rem 0 0.9rem 0;}
	.steps .title span{width:auto;float:none;height: auto;    writing-mode: horizontal-tb;
    display: block; color:#5377d7; padding:0; font-size:2.4rem;letter-spacing: 0;}
	#steps-menu, #steps-menu ul{ height:auto;}
	#steps-menu ul{ display:flex;}
	#steps-menu ul li{ position:relative; transform:none; width:auto; height:auto; left:0; top:0; border:1px solid #fff; box-sizing:border-box; padding:0; width:20%; line-height:2;}	
	#steps-menu ul li a{position:relative; transform:none; width:auto; height:auto; left:0; top:0; display:block; font-size:1.8rem;letter-spacing: 0;}
	.col-sm-5{ max-width:none; width:auto; height:auto; margin:0.6rem 0; padding:1.5rem 2.4rem;}
	.col-sm-5 .title{ font-size:2.1rem;}
	.AllListCon li{ font-size:1.2rem;}
	.col-sm-5 .left_cont li:before{ width:1.2rem; height:1.8rem; margin:0 1.5rem 0 0;}
	.col-sm-5 .btn_cont a{ font-size:1.8rem; height:6rem;margin: 1rem 0;}
	.col-sm-5 .right_cont{ width:auto; margin:0.9rem 0 0 0;}
	.col-sm-5 .right_cont a{justify-content: center;}
	.col-sm-5 .btn_cont span{ margin:0 1.8rem 0 0;}
	.col-sm-5 .btn_cont span img{ width:3.6rem;}

  .steps-cont {transition: none;  display: none; position: unset;}
  .steps-cont_active {display: block;}

  .AllListCon ul.li2row{
    grid-template-columns: repeat(1, 1fr);
}
	}
