.text_title p {
  font-size: 18px;
  letter-spacing: .1em; }
.text_title .gray {
  font-size: 14px; }

.service_item {
  padding: 60px 0 0 0; }
.service_item img {
}

.service_item:last-child {
  margin-bottom: 60px; }

.text_title {
  margin-bottom: 40px; }

.service_list {
  position: relative;
  background-color: #252525; }
.service_list .mask {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 0;
  content: " ";
  height: 360px;
  width: 20%;
  opacity: 0;
  background: -webkit-linear-gradient(45deg, #822983, #ff1c41);
  background: linear-gradient(45deg, #822983, #ff1c41);
  -webkit-transition: background .3s,left .3s,opacity .3s;
          transition: background .3s,left .3s,opacity .3s; }
.service_list .mask:before {
  position: absolute;
  z-index: 1;
  top: 2px;
  right: 2px;
  bottom: 2px;
  left: 2px;
  content: " ";
  background-color: #121215;
  -webkit-transition: background .3s,left .3s;
          transition: background .3s,left .3s; }
.service_list ul {
  z-index: 2; }
.service_list li {
  position: relative;
  z-index: 2;
  float: left;
  width: 20%;
  height: 360px;
  -webkit-transition: background .3s;
          transition: background .3s; }
.service_list li:before {
  position: absolute;
  top: 0;
  left: 0;
  content: ' ';
  width: 1px;
  height: 100%;
  background: #a7a7a6;
  -webkit-transition: background .2s .1s;
          transition: background .2s .1s; }
.service_list li:first-child:before {
  display: none; }
.service_list p {
  padding: 0 35px;
  line-height: 2;
  font-size: 16px;
  color: #a7a7a6;
  -webkit-transition: color .3s;
          transition: color .3s; }
.service_list .en {
  padding-top: 20px; }
.service_list .img {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%; }
.service_list .img i {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 22%;
  height: 96px;
  background: bottom center no-repeat;
  -webkit-transition: opacity .2s;
          transition: opacity .2s; }
.service_list .img .h {
  opacity: 0; }
.service_list li:hover p {
  color: #fff; }
.service_list li:hover .img .d {
  opacity: 0; }
.service_list li:hover .img .h {
  opacity: 1; }

.service_list_hover .mask {
  opacity: 1; }
.service_list_hover.service_list_1 .mask {
  left: 0; }
.service_list_hover.service_list_1 .l2:before {
  background-color: transparent; }
.service_list_hover.service_list_2 .mask {
  left: 20%; }
.service_list_hover.service_list_2 .l2:before, .service_list_hover.service_list_2 .l3:before {
  background-color: transparent; }
.service_list_hover.service_list_3 .mask {
  left: 40%; }
.service_list_hover.service_list_3 .l3:before, .service_list_hover.service_list_3 .l4:before {
  background-color: transparent; }
.service_list_hover.service_list_4 .mask {
  left: 60%; }
.service_list_hover.service_list_4 .l4:before, .service_list_hover.service_list_4 .l5:before {
  background-color: transparent; }
.service_list_hover.service_list_5 .mask {
  left: 80%; }
.service_list_hover.service_list_5 .l5:before {
  background-color: transparent; }

.service_img img {
  float: left;
  width: 33.33%; }

.service_text {
  padding: 90px 24%;
  text-align: center; }
.service_text p {
  line-height: 1.2;
  font-size: 18px;
  color: #1a1a1a; }
.service_text .en {
  margin-bottom: 25px;
  font-size: 36px; }

.service_partner {
  border-top: 1px solid #ddd;
  border-left: 1px solid #ddd; }
.service_partner li {
  position: relative;
  float: left;
  width: 19.9%;
  height: 118px;
  background: center no-repeat; }
.service_partner li i {
  display: block;
  height: 100%;
  background: center no-repeat;
  opacity: 0;
  -webkit-transition: opacity .3s;
          transition: opacity .3s; }
.service_partner li:before, .service_partner li:after {
  position: absolute;
  z-index: 5;
  content: ' ';
  background: #ddd; }
.service_partner li:before {
  top: 0;
  right: 0;
  width: 1px;
  height: 100%; }
.service_partner li:after {
  bottom: 0;
  right: 0;
  width: 100%;
  height: 1px; }
.service_partner li:hover i {
  opacity: 1; }