.model {
  display: none;
  position: fixed;
  z-index: 999;
  background: #fff;
  border-radius: 4px;
  box-shadow: 0 25px 50px -12px rgb(0 0 0 / 0.25);
}

.model.share-show {
  animation: scale-in 0.25s ease 0s 1 normal forwards;
}

.model.share-hide {
  animation: scale-out 0.25s ease 0s 1 normal forwards;
}

.model .model-content {
  padding: 20px;
}

.model .model-nav {
  padding: 8px 20px;
  font-size: 16px;
  line-height: 24px;
  color: rgb(148 163 184);
  background-color: rgb(241 245 249);
  border-top-left-radius: 4px;
  border-top-right-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.model .model-nav i.close {
  display: block;
  cursor: pointer;
  background-color: rgb(148 163 184);
  width: 16px;
  height: 16px;
  mask-image: url("data:image/svg+xml,%3Csvg xmlns%3D%27http%3A//www.w3.org/2000/svg%27 viewBox='0 0 48 48'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'%3E%3Cpath d='M8 8L40 40'/%3E%3Cpath d='M8 40L40 8'/%3E%3C/g%3E%3C/svg%3E");
  -webkit-mask-image: url("data:image/svg+xml,%3Csvg xmlns%3D%27http%3A//www.w3.org/2000/svg%27 viewBox='0 0 48 48'%3E%3Cg fill='none' stroke='%23000' stroke-linecap='round' stroke-linejoin='round' stroke-width='4'%3E%3Cpath d='M8 8L40 40'/%3E%3Cpath d='M8 40L40 8'/%3E%3C/g%3E%3C/svg%3E");
  mask-size: 100%;
  -webkit-mask-size: 100%;
  transition: 0.1s;
}

.model .model-nav i.close:hover {
  background-color: rgb(71 85 105);
}

.Artical_Link_Div li a {
  display: inline-block;
  width: 32px;
  height: 32px;
  background-color: #eee;
  border-radius: 999px;
  cursor: pointer;
}

.Artical_Link_Div li a[data-share="facebook"] {
  background-color: #0d5185;
  background-image: url("data:image/svg+xml,%3Csvg xmlns%3D%27http%3A//www.w3.org/2000/svg%27 width='24' height='24' viewBox='0 0 24 24'%3E%3Cpath fill='%23fff' d='M14 13.5h2.5l1-4H14v-2c0-1.03 0-2 2-2h1.5V2.14c-.326-.043-1.557-.14-2.857-.14C11.928 2 10 3.657 10 6.7v2.8H7v4h3V22h4z'/%3E%3C/svg%3E");
  background-size: 70% 70%;
  background-repeat: no-repeat;
  background-position: center;
}

.Artical_Link_Div li a[data-share="twitter"] {
  background-color: #000;
  background-image: url('data:image/svg+xml,%3Csvg xmlns%3D%27http%3A//www.w3.org/2000/svg%27 width="24" height="24" viewBox="0 0 24 24"%3E%3Cpath fill="%23fff" d="M18.205 2.25h3.308l-7.227 8.26l8.502 11.24H16.13l-5.214-6.817L4.95 21.75H1.64l7.73-8.835L1.215 2.25H8.04l4.713 6.231zm-1.161 17.52h1.833L7.045 4.126H5.078z"%2F%3E%3C%2Fsvg%3E');
  background-size: 60% 60%;
  background-repeat: no-repeat;
  background-position: center;
}

.Artical_Link_Div li a[data-share="weibo"] {
  background-color: #ffda47;
  background-image: url("data:image/svg+xml,%3Csvg xmlns%3D%22http%3A//www.w3.org/2000/svg%22 viewBox%3D%220 0 404 323%22%3E%3Cg fill%3D%22none%22%3E%3Cg%3E%3Cpath d%3D%22M29.136 219.44c0 45.849 59.707 83.045 133.364 83.045 73.657 0 133.363-37.197 133.363-83.045 0-45.859-59.707-83.045-133.364-83.045-73.656 0-133.363 37.186-133.363 83.045%22 fill%3D%22%23FEFEFE%22/%3E%3Cpath d%3D%22M165.616 295.712c-65.199 6.433-121.469-23.032-125.714-65.833-4.234-42.791 45.204-82.708 110.383-89.151 65.209-6.453 121.469 23.011 125.714 65.802 4.213 42.812-45.195 82.729-110.383 89.182m130.387-142.077c-5.553-1.657-9.358-2.782-6.443-10.084 6.29-15.811 6.934-29.465.123-39.191-12.794-18.276-47.772-17.284-87.862-.501 0-.01-12.59 5.512-9.368-4.469 6.177-19.831 5.236-36.44-4.357-46.023-21.743-21.764-79.599.818-129.201 50.4C21.75 140.933.18 180.308.18 214.344c0 65.117 83.516 104.707 165.211 104.707 107.1 0 178.343-62.213 178.343-111.62 0-29.854-25.139-46.79-47.731-53.796%22 fill%3D%22%23D52C2B%22/%3E%3Cpath d%3D%22M367.124 34.465c-25.865-28.677-64.023-39.61-99.235-32.124h-.01c-8.141 1.749-13.336 9.757-11.598 17.888 1.728 8.151 9.747 13.357 17.898 11.608 25.057-5.318 52.159 2.465 70.558 22.827 18.348 20.373 23.349 48.16 15.484 72.511v.01c-2.567 7.926 1.769 16.415 9.716 18.982 7.916 2.557 16.425-1.78 18.992-9.695v-.051c11.045-34.262 4.05-73.31-21.805-101.956%22 fill%3D%22%23E79115%22/%3E%3Cpath d%3D%22M327.396 70.305c-12.59-13.96-31.162-19.268-48.324-15.617-7.016 1.493-11.495 8.397-9.972 15.412 1.483 6.985 8.386 11.485 15.372 9.961v.02c8.407-1.78 17.489.808 23.645 7.609 6.167 6.832 7.814 16.139 5.165 24.3h.02c-2.199 6.811 1.534 14.144 8.345 16.353 6.832 2.178 14.144-1.544 16.343-8.366 5.392-16.689 2.017-35.711-10.594-49.672%22 fill%3D%22%23E79115%22/%3E%3Cpath d%3D%22M169.206 218.197c-2.27 3.897-7.312 5.768-11.27 4.142-3.886-1.595-5.103-5.942-2.884-9.788 2.27-3.805 7.108-5.666 10.984-4.122 3.937 1.433 5.349 5.841 3.17 9.768m-20.761 26.672c-6.32 10.043-19.82 14.451-29.986 9.818-10.023-4.561-12.978-16.251-6.678-26.059 6.218-9.777 19.278-14.124 29.373-9.89 10.216 4.358 13.468 15.955 7.291 26.131m23.676-71.202c-31.019-8.08-66.089 7.384-79.558 34.732-13.725 27.869-.45 58.817 30.897 68.942 32.451 10.462 70.722-5.584 84.037-35.663 13.112-29.423-3.273-59.716-35.376-68.011%22 fill%3D%22%23060101%22/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  background-size: 65% 65%;
  background-repeat: no-repeat;
  background-position: center;
}

.Artical_Link_Div li a[data-share="wechat"] {
  background-color: #09bc64;
  background-image: url('data:image/svg+xml,%3Csvg xmlns%3D%27http%3A//www.w3.org/2000/svg%27 width="24" height="24" viewBox="0 0 24 24"%3E%3Cg fill="%23fff" fill-rule="evenodd" clip-rule="evenodd"%3E%3Cpath d="M8.452 3.5C4.149 3.5.5 6.425.5 10.214c0 1.94.97 3.668 2.484 4.878v1.682a.5.5 0 0 0 .634.482l2.363-.657a9.307 9.307 0 0 0 2.63.329a.202.202 0 0 0 .192-.24a6.457 6.457 0 0 1-.097-1.122c0-3.898 3.405-6.637 7.197-7.01a.198.198 0 0 0 .172-.26C15.088 5.48 12 3.5 8.452 3.5M6.855 7.46a1.065 1.065 0 1 1-2.13 0a1.065 1.065 0 0 1 2.13 0m4.258 1.064a1.065 1.065 0 1 0 0-2.129a1.065 1.065 0 0 0 0 2.13"%2F%3E%3Cpath d="M16.79 9.887c3.617 0 6.71 2.461 6.71 5.679c0 1.632-.81 3.084-2.07 4.104v1.362a.5.5 0 0 1-.634.482l-1.947-.541a7.845 7.845 0 0 1-2.059.271c-3.616 0-6.71-2.46-6.71-5.678s3.094-5.679 6.71-5.679m-2.244 4.758a.932.932 0 1 0 0-1.863a.932.932 0 0 0 0 1.863m5.456-.931a.931.931 0 1 1-1.863 0a.931.931 0 0 1 1.863 0"%2F%3E%3C%2Fg%3E%3C%2Fsvg%3E');
  background-size: 65% 65%;
  background-repeat: no-repeat;
  background-position: center;
}

@keyframes scale-in {
  0% {
    transform: scale(0);
  }

  100% {
    transform: scale(1);
  }
}

@keyframes scale-out {
  0% {
    transform: scale(1);
  }

  100% {
    transform: scale(0);
  }
}