.match_form{padding: 110px 0; background: top center / cover no-repeat;}
.match_form .title_box{text-align: center;color: #fff;}
.match_form .title_box .title{font-size: 40px;margin-bottom: 60px; margin-top: 30px;}
.match_form .title_box .sub_title{font-size: 24px;margin-bottom: 115px;}
.match_form .form_box{border-radius: 25px;padding: 40px;box-shadow: 0 0 5px 5px rgba(0,0,0,.1); position: relative;background: #fff url(/images/match_footer_bg.png) center bottom / contain no-repeat; padding-top: 90px;}
.match_form .form_box .item_box{max-width: 50%;margin: 0 auto;padding:20px 0 20px 50px;position: relative;}
.match_form .form_box .item_box .step{position: absolute;left: 0;top: 20px;height: 100%;}
.match_form .form_box .item_box .step::before{content: '';width: 1px;height: 100%;border-left: 1px dashed #064192;position: absolute;left: 50%;top: 5px;}
.match_form .form_box .item_box .step .num{width: 45px;height: 45px;display: flex;align-items: center;justify-content: center;background: url(/images/match_icon_bg.png) center / 100% 100% no-repeat;font-size: 20px;color: #fff;position: relative;z-index: 1;}
.match_form .form_box .item_box .step_title{line-height: 45px;font-size: 24px;padding: 0 35px;margin-bottom: 45px;background-image: linear-gradient(to right,rgba(255,255,255,0), rgba(29,64,153,.5));display: inline-block;border-radius: 0 20px 20px 0 ;}
.match_form .form_box .item_box:last-child .step::before{display: none;}

.match_form .form_box .layui-form-label{font-size: 18px;}
.match_form .form_box .layui-form-item{margin-bottom: 25px;}
.match_form .form_box .layui-input{height: 45px;}
.match_form .form_box .match_btns{padding-top: 90px;text-align: center;}
.match_form .form_box .match_btns .btn{padding: 20px 85px; background: #316CF4; box-shadow: 0px 4px 17px 0px #A4BFFA; font-size: 18px;color: #fff;font-weight: bold;border-radius: 10px;}



.match_form .form_wrap{
  max-width: 800px;
  margin: 0 auto;
  margin-top: 50px;
}

.match_form .box_title{
  position: absolute;
  top: -26.5px;
  left: 0;
  right: 0;
  text-align: center;
}

.row_box{
  margin-bottom: 30px;
}
.row_box .label {
  font-size: 18px;
  margin-bottom: 15px;
}

.radio_box { 
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: wrap;
  margin: 0 -10px;
}

.radio_box .radio_item {
  margin: 10px;
  cursor: pointer;
  padding: 10px 10px;
  width: calc(25% - 20px);
  text-align: center;
  border-radius: 5px;
  border: 1px solid #d6d6d6;
  font-size: 17px;
  user-select: none;
}

.radio_box .radio_item.active{
  background: rgba(49, 108, 244, 0.1);
  border: 1px solid #316CF4;
  color: #316CF4;
}


.match_form .form_list_box{ background: #F6FBFF; border-radius: 25px;padding: 10px;box-shadow: 0 0 5px 5px rgba(0,0,0,.1);
   position: relative; 
   display: flex;
   margin-top: 30px;
  }

.match_form .left_box {
  min-width: 530px;
  width: 530px;
  margin-right: 20px;
  background: #fff;
  border-radius: 20px;
  overflow: hidden;
}

.match_form .right_box {
  width: 100%;
  background: #fff;
  position: relative;
  overflow: hidden;
  border-radius: 20px;
  padding: 15px;
}

.progress {
  width: 100%;
  height: 16px;
  background: #DCECFF;
  position: relative;
  overflow: hidden;
}

.progress .line_wrap {
  overflow: hidden;
  height: 100%;
  background: linear-gradient(270deg, #41F1FE 0%, #407BFF 100%);
  border-radius: 0 30px 30px 0;
  transition: all .8s ease;
}

.match_form .tags_list{
 display: flex;
 flex-wrap: wrap;
 margin-top: 20px;
}

.match_form .tags_list .item {
  width: 42%;
  text-align: center;
  display: flex;
  justify-content: center;
  font-size: 18px;
  font-weight: bold;
  background: rgba(49, 108, 244, 0.1);
  padding: 10px;
  margin: 15px 4%;
  border-radius: 10px;
}

.match_form .tags_list .item .icon {
  margin-left: 10px;
  display: block;
  width: 22px;
  height: 22px
}

.match_form .tags_list .item .icon.check {
}

.match_form .tags_list .item .icon.refresh {
    animation: ShowRatate 1s linear infinite;
    display: none;
}

.match_form .tags_list .item.loading .icon.refresh {
  display: block;
}

.match_form .tags_list .item.loading .icon.check {
  display: none;
}

@keyframes ShowRatate {
  0% { transform:rotate(0deg); }
  100% { transform:rotate(360deg); }
}


.match_form .search_button {
  background: #316CF4;
  box-shadow: 0px 4px 17px 0px #A4BFFA;
  border-radius: 10px;
  text-align: center;
  color: #fff;
  font-size: 22px;
  padding: 15px 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 20px 0;
}

.match_form .search_button .icon{
  margin-right: 10px;
  width: 22px;
}

.match_form  .button_box{
  display: flex;
  justify-content: center;
}


.match_form .policy_list{background: #fff;border-radius: 16px;overflow: hidden;}
.match_form .policy_list .item{border-bottom: 1px dashed rgba(0, 0, 0, 0.16);padding: 15px;}
.match_form .policy_list .item .title{display: flex;justify-content: space-between;align-items: center;margin-bottom: 15px;}
.match_form .policy_list .item .title .name{font-size: 18px;font-weight: bold;max-width: 500px;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}
.match_form .policy_list .item .title .status .tag{font-size: 14px;font-weight: bold;padding: 5px 10px;background: #F4AB00;color: #fff;border-radius: 6px;margin-left: 15px;}
.match_form .policy_list .item .title .status .tag.end{background: #ff4904;}
.match_form .policy_list .item .title .status .tag.no{background: gray;}
.match_form .policy_list .item .title .title_left{display: flex;align-items: center;}
.match_form .policy_list .item .endtime{display: flex;font-size: 14px;color: #ED1515;font-weight: bold;align-items: center;}
.match_form .policy_list .item .tags{display: flex;align-items: center;}
.match_form .policy_list .item .tags .tag{margin-left: 40px;color: rgba(0, 0, 0, 0.6);}
.match_form .policy_list .item .tags .tag:first-child{margin: 0;}

.layui-tab-title li{ padding: 0; margin-right: 30px;font-size: 20px;}
.layui-tab-brief > .layui-tab-title { font-weight: bold; }
.layui-tab-brief > .layui-tab-title .layui-this{ color: #316CF4;  }
.layui-tab-brief > .layui-tab-title .layui-this:after, .layui-tab-brief > .layui-tab-more li.layui-this:after {
  border-bottom-color: #316CF4;
}

.match_form.green-theme .form_box { background-image: url(/images/match_footer_bg_2.png); }
.match_form.green-theme .radio_box .radio_item.active { 
  background-color: rgba(0, 181, 120, 0.1);
  border-color: #00B578;
  color: #00B578; 
}
.match_form.green-theme .form_box .match_btns .btn { background-color: #00B578; }
.match_form.green-theme .progress .line_wrap{ background: linear-gradient(270deg, #41F1FE 0%, #2AD987 97%); }

.match_form.green-theme .layui-tab-brief > .layui-tab-title .layui-this{ color: #00B578;  }
.match_form.green-theme .layui-tab-brief > .layui-tab-title .layui-this:after, 
.match_form.green-theme .layui-tab-brief > .layui-tab-more li.layui-this:after {
  border-bottom-color: #00B578;
}

.match_form.green-theme .search_button{ background: #00B578; }