.tfile-box{
      width: 100%;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 60px 0 0;
}
.tlswiper, .tpswiper{
      width: 100%;
      flex-shrink: 1;
      overflow: hidden;
}
.tfile_l, .tfile_p{
      cursor: pointer;
}
.tf-photo-out{
      width: 100%;
      padding-top: 100%;
      border-radius: 4px;
      overflow: hidden;
      position: relative;
      margin-bottom: 24px;
}
.tf-photo-in{
      position: absolute;
      top:0;
      left: 0;
      width: 100%;
      height: 100%;
      transition: 0.5s;
      transform: scale(1,1);
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
}

.tfile_p .tf-photo-out{
      width: 100%;
      padding-top: 80%;
      border-radius: 4px;
      overflow: hidden;
      position: relative;
      margin-bottom: 24px;
}
.tfile_p .tf-photo-in{
      position: absolute;
      top:0;
      left: 0;
      width: 100%;
      height: 100%;
      transition: 0.5s;
      transform: scale(1,1);
      background-size: cover;
      background-repeat: no-repeat;
      background-position: center;
}
.tfile_p:hover .tf-photo-in{
      transform: scale(1.1,1.1);
}
.tfile_l .txt1, .tfile_p .txt1{
      text-align: center;
}
.tfile:last-child{
      padding-bottom: 200px;
}
.tsani {
      flex-shrink: 0;
      position: relative;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
      width: 52px;
      height: 52px;
      border-radius: 100%;
      cursor: pointer;
      margin-left: 24px;
}
.tsani::after {
      content: '';
      position: absolute;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      background: rgba(160, 199, 162, 1);
      border-radius: 100px;
      z-index: 0;
}

.tsani span{
      position: absolute;
      display: block;
      width: 0;
      height: 0;
      border-radius: 100%;
      background: radial-gradient(circle, rgba(160, 199, 162, 1) 0%, rgba(69, 114, 71, 0.5) 50%,rgba(160, 199, 162, 1) 100%);
      transition: width 0.8s ease-in-out, height 0.8s ease-in-out, opacity 0.5s ease-in-out;
      transform: translate(-50%, -50%);
      opacity: 0;
      z-index: 1;
}
.tsani:hover {
      color: #F4F9F4;
}
.tsani:hover span {
      opacity: 1;
      transition: width 0.8s ease-in-out, height 0.8s ease-in-out, opacity 1.2s ease-in-out;
}
.tsani svg {
      position: relative;
      z-index: 2;
}
.tsani.swiper-button-disabled{
      cursor: default;
}
.tsani.swiper-button-disabled::after{
      background: rgba(208, 209, 208, 1);
}
.tsani.swiper-button-disabled span{
      display: none;
}

.tsani:nth-child(1){
      margin-right: 24px;
}
.tsani:nth-child(3){
      margin-left: 24px;
}

.popbox{
      position: fixed;
      width: 100%;
      height: 100%;
      top: 0;
      left: 0;
      background: rgba(0,0,0,0.9);
      display: none;
      z-index: 99999;
}

.popbox-close{
      position: absolute;
      top: 0px;
      right: 0px;
      padding: 30px;
      cursor: pointer;
      z-index: 2;
}
.popbox-close svg{
      width: 48px;
      height: 48px;
}     

.img-block{
      position: absolute;
      width: 100%;
      height: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      top: 0;
      left: 0;
}
.imgbox{
      width: 80%;
      height: 80%;
      background-size: contain;
      background-repeat: no-repeat;
      background-position: center;
}
.imgdescription{
      width: 80%;
      text-align: center;
      color: white;
      margin-top: 24px;
      font-size: 18px;
}
.tfile{
      background-color: transparent;
}
@media( max-width: 768px){
      .tfile{
            width: 100%;
            padding-top: 50px;
            padding-bottom: 50px;
      }
      .tfile:last-child{
            padding-bottom: 100px;
      }
      .tsani{
            display: none;
      }
      .tfile-box{
            flex-direction: column;
            padding: 30px 0 0;
      }
      .popbox-close{
            padding: 20px;
            cursor: pointer;
            z-index: 2;
      }
      .popbox-close svg{
            width: 36px;
            height: 36px;
      } 
      .imgbox{
            width: 90%;
            height: 80%;
      }
      .imgdescription{
            width: 90%;
            margin-top: 16px;
            font-size: 16px;
      }
}
