@font-face {
  font-family: "736-CAI978";
  src: url(/asset/online/jpg-converter/css/font/736-CAI978-86686fbe.ttf);
  font-style: normal;
  font-display: swap;
}
.g-hover {
  cursor: pointer;
}
.g-hover:hover {
  opacity: 0.8;
}
.g-color {
  text-decoration: none;
  color: #7419E3;
}
.g-color:hover {
  text-decoration: underline;
}
.g-underline {
  text-decoration: underline;
}
.g-underline:hover {
  text-decoration: none;
}
.g-underline-color {
  text-decoration: underline;
}
.g-underline-color:hover {
  color: #7419E3;
}
.g-content {
  max-width: 1280px;
  margin: 0 auto;
  padding: 0 80px;
  box-sizing: border-box;
}
.g-h2 {
  font-size: 28px;
  font-family: "736-CAI978";
  color: #1D1749;
  line-height: 44px;
  text-align: center;
}
.g-desc {
  max-width: 863px;
  margin: 0 auto;
  margin-top: 14px;
  font-size: 16px;
  line-height: 24px;
  color: #1D1749;
}
.as-download {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  justify-content: center;
  height: 66px;
  color: #ffffff;
  border-radius: 8px;
  border: 1px solid #7419E3;
  box-sizing: border-box;
  background: #7419E3;
}
.main .product-nav {
  margin: 0 auto;
  box-sizing: border-box;
  display: none;
  position: fixed;
  background: #FFFFFF;
  top: 0;
  z-index: 999;
  width: 100%;
  height: 64px;
  box-shadow: 0px 5px 10px 0px rgba(14, 36, 118, 0.1);
  font-size: 16px;
}
.main .product-nav .wrapper {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 100%;
  margin: 0 auto;
  box-sizing: initial;
}
.main .product-nav .wrapper .logo a {
  font-size: 26px;
  font-family: "736-CAI978";
}
.main .product-nav .wrapper .button {
  display: inline-block;
  font-family: "736-CAI978";
  font-size: 14px;
  background: #231959;
  color: #FFFFFF;
  border-radius: 4px;
  height: 40px;
  line-height: 40px;
  white-space: nowrap;
}
.main .product-nav .wrapper .button a {
  display: inline-block;
  padding: 0 20px;
}
.main .section-1 {
  background: url(/asset/online/jpg-converter/css/images/bg-1-5e27ba99.png) no-repeat center top / cover;
}
.main .section-1 .content {
  padding-top: 52px;
  padding-bottom: 64px;
  color: #fff;
}
.main .section-1 .content h1 {
  font-size: 48px;
  text-align: center;
  font-family: "736-CAI978";
}
.main .section-1 .content .h-desc {
  margin-top: 16px;
  font-size: 24px;
  text-align: center;
  font-family: "736-CAI978";
}
.main .section-1 .content .container {
  display: flex;
  justify-content: center;
  margin-top: 64px;
}
.main .section-1 .content .container .lt {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 525px;
  height: 313px;
  margin-right: 80px;
  background: #FFFFFF;
  border-radius: 4px;
}
.main .section-1 .content .container .lt .box {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 474px;
  height: 258px;
  margin: 0 24px;
  background: #F7F0FF;
  border: 2px dashed #E0D4EF;
  border-radius: 4px;
}
.main .section-1 .content .container .lt .box .center .upload {
  position: relative;
}
.main .section-1 .content .container .lt .box .center .upload .btn-upload {
  width: 328px;
  height: 64px;
  line-height: 64px;
  background: #7419E3;
  border-radius: 8px;
  text-align: center;
  font-size: 20px;
  font-family: "736-CAI978";
}
.main .section-1 .content .container .lt .box .center .upload .btn-upload span {
  padding-left: 36px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAsCAMAAAAUyMtVAAABGlBMVEVHcEz////////////////////////////PzPP///////////9oYNr4+P1cUtdfV9i6tu7////08/xYT9asqOv///9oYNp2b91lXtr////t7Ptxatz////LyPL////y8fzIxfH///////+IguLFwvH///////9/eOCjnOiJhON/d+BrY9v19f3////////e3PeHgeKRiuT///////+1se1jWtmjnujz8vz///////9eVdf5+f7v7vv///98dt/PzPRgWNh3b97///////////9za91lXdmQieTi4fiZleb///////9fV9ijnuhbUtf////Y1vZbU9dsZdvHxPFYT9Zya91/eeCppOpYT9b////+/v/9/f/7+/78/P5b+Nz8AAAAWHRSTlMAJJkg5PXz4Nyg60jX/erf1D75+s/92NHa6PPRL91s+NsuIcjaAd3Mz87P1frxF+nKyeIM1dzK+Mzu5P71wM/f3s7mkeHR2c7rzvdz4dDpUeTu1dz7zcvPL9dJ1gAAAQxJREFUSMfl1sVywzAUQFEF2zhQZmZmxpSZ8cpu//83unAmk9jJs7TM9K7f2XgkPSulEvGkLrc7rqLKpnVlZ2MR87GUrm6pTQYZHezuWQROCOiu4SkB6FrtNdVo+uh+ox6o18WgJdB9y5ZAn9uCdVugGwfcrK0O2YDNDmDONQaPAHDsmQH3mlKXPybAm6fcQj4a5AeoqLc9CizmqOrkUAYHWwTa7xdBJ6FORTARBgURtALQ4o++AnAlAq8HyI344P0N+BiN+KzF7UlX+6D59/vz68XoLJWA+eH7l6AAwIo5uAXoNr+i2p19eJrZaZiHzLGbd2osRbFMeO2KpWKhxS6WzioV+HWQSsYTSv0B2QmJdukdZucAAAAASUVORK5CYII=) no-repeat left center / 24px;
}
.main .section-1 .content .container .lt .box .center .upload.active .tips {
  display: block;
}
.main .section-1 .content .container .lt .box .center .upload .tips {
  display: none;
  position: absolute;
  left: 34px;
  bottom: 63px;
  width: 249px;
  padding: 14px 8px 12px 8px;
  background: #ECEBFF;
  box-shadow: 0px 2px 5px 0px rgba(88, 79, 214, 0.2);
  border-radius: 10px;
  text-align: center;
}
.main .section-1 .content .container .lt .box .center .upload .tips::before {
  content: "";
  position: absolute;
  left: 122px;
  bottom: -8px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 10px 18px 0px 7px;
  border-color: #ECEBFF transparent transparent transparent;
}
.main .section-1 .content .container .lt .box .center .upload .tips p {
  font-size: 16px;
  line-height: 22px;
  color: #584FD6;
  font-family: "736-CAI978";
}
.main .section-1 .content .container .lt .box .center .upload .tips .btn-download {
  display: inline-block;
  height: 32px;
  line-height: 32px;
  margin-top: 10px;
  padding: 0 36px;
  background: #140F5D;
  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  text-align: center;
  font-size: 14px;
  font-family: "736-CAI978";
}
.main .section-1 .content .container .lt .box .center .desc {
  margin-top: 16px;
  font-size: 16px;
  color: #1D1749;
  text-align: center;
}
.main .section-1 .content .container .rt .title {
  padding-top: 4px;
  font-size: 28px;
  font-weight: 600;
}
.main .section-1 .content .container .rt ul {
  margin-top: 12px;
}
.main .section-1 .content .container .rt ul li {
  height: 30px;
  line-height: 16px;
  padding-top: 14px;
  padding-left: 40px;
  font-size: 16px;
  font-weight: 600;
  background: no-repeat left center / 30px;
  background-position-y: 7px;
}
.main .section-1 .content .container .rt ul li:nth-of-type(1) {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAMAAAANIilAAAABSlBMVEVHcEz///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////8dFFKSAAAAbXRSTlMAsECKgKDAYFDgBw8BiRRa0vTinxl7pr35Bu4e/eU8ZURii53jrdS09/tCMG5fItOpybqjBP5r7TJFUhXC/DOufiRmDLm32Vs7Juz61pCeskkDT94RMXUQuEbx9QmObSXXjCfPlugrkZgWLZXcUmkcywAAAXNJREFUSMftlsVyAzEQBZU4jnHNzMzMGGZmZqb3/9dcU2VJ6+hou48z1bW1b0SETBhTClsYRDGkvEFxsTrspzOqAdYNo5v00gyHhUWuOwcu81x5eUXDYc04kmnr8srKLIOKMq/jqPqchx+3J6dnulUAxZKSQakIoMqy7UA5y/upbBmw01teF5xafiRaJ1xeakcBs00uUJuZcSyYEJUfRxQmaj2FsLwcRopaB9R/o3+iDlUNyMvdZ7huzwXlR3jqaDZqQvIU2q0esHMgJk8T0jkGLt4EZaI9u0L/uysmE/L50cfrvaBMyFcPL8Ky+x0OUbnzA1yKyaezwENbKDDbXh3Nu5rIqG7sZmzvnggsEiucFmB/U2h5tq4BU0ZwY5BC4+jwH1syjSHuIiPS1LoGkrwsQUOtW2Fxy7luC6zURmCIB5MCCNA7cUDiHtxaCYizbrkEEIsEVQyCkRiQYN51hiRkSPLeYyGH38cSfX5HaPK4Hkd+AbhGnqMKgpoYAAAAAElFTkSuQmCC);
}
.main .section-1 .content .container .rt ul li:nth-of-type(2) {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAMAAAANIilAAAABTVBMVEVHcEz///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////+TP3goAAAAbnRSTlMAkCADEMDQUGCguAEE/gKG9WcarfoV2QfOXLrnq5LMT7EPTsTfJ/0b4VO/l4yy9GKIoiO9DQt0jxz8TbTy3XN3yD6kHbtk2kkYLsZCBWWj7tgqodYWXb5D1GYIme1BfiKNzYVbwfjvijMR3pxV6sJpKKUAAAGqSURBVEjH7ZbXUsJQFEWjhAQJoUgRFQQbTQUr9t577733/f+PJoGImmQ8YSwzynrI7Dk36+HWOQxT4veoctXiA+IVT3MtNdCjrYciVwN2j+0dwDPQ5SDIIdQ5P5SAp0fgliBbEWY0Mi9EgQhFLtORmfsH3JwWKzN31zg/KFZmPMAhTRYWeZ6PVL6VmQ5gmyQvK5vb9E7u2YN7nSI3iLK8oMr75TK7bgSdlDn75b8dqlzAa3bBmt7IAbNyZYTP04Ups3KBMlj/opxCq/FgK1IGI0ImGuS4hDvAGRJwJzguGM0IGrkdZNo1chqbGxUU1pBm9G8eAR74Lrk5rtbizWqqn1+iyI5BiCO50qiIttzVGh/CcB9BbpCW01cvJ7ZfigNKcUxKvQR5Wt4M5QWalJNNKc5IaYIgz60CO+pZxdGWkk4keZayYJ2ubHcudWcvOvPH7/Ls+Ae2qgg5hpUkTyDZgZhGttMvhl0j+70+murz+vW6ApZlG9HCGtKCRulrKb2eXyeHjQfDn8g6rdQrzjqEzDZxKh7pDFYX0z7mqbGYblxVal1Vpcb+X/ICjG3Oq4IjHSMAAAAASUVORK5CYII=);
}
.main .section-1 .content .container .rt ul li:nth-of-type(3) {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAMAAAANIilAAAABC1BMVEVHcEz////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////V4T8nAAAAWHRSTlMAmz6iAfoKsGAQ9pQUdfAG/P18zY55iN319MffSPeMhEssKqR2UVtaagJ9ZQtKDecx7qAPEiuA/nPR1xoMzhmQJjX4XetAwb7kqTjiMOjMmgkvIAPDr88bV2ZOQwAAASlJREFUSMftltduAjEQRQfwsjZbCL2THtJ7770X0u//f0keUJRAdhV7nhK0583SHMnt2kMUEdHnJGMpfDGQmzCRE+jBEfqyhfi3atezUNSXge5xKwOPLdMkMMOWKYtMVvYyN6snUx4BLCzqyWLa/kEJOT05iPnAOk2Z/rw8pZRSSqU5sqp1zqY8zJDXPwM2Yi67PupEaxWMMaZdxDnR7jZsYS67FZwRXaGkGLt9gAsiCRz7/lLBUN5v4JrI62zZsqHs4EZK+fj+dHuJrRVDuQEAuKP2C2o7pmsu2Lb9hvvnV5wesq5nE80HlI94d3sPVVh1XjBWNwCcMFM1DmCTG0kHyLPzXMWoYMtDg+l/+YYZyN1fbBgiDkvncw8j8WtbEUoqloxasIj+5wNsyHebooPNkgAAAABJRU5ErkJggg==);
}
.main .section-1 .content .container .rt ul li:nth-of-type(4) {
  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADwAAAA8CAMAAAANIilAAAAAPFBMVEVHcEz///////////////////////////////////////////////////////////////////////////+PybD1AAAAE3RSTlMAMK+QEO/P32Agf7+AUHCPoJ9v8x2CUgAAAMdJREFUSMft1ssOgyAQQNERgREfte39/3/twrdGRVdN5K6MyVHDEKJIKvXAgqq9jRsobuMi4YQTHvr6bIuzqozC4MIaB8VF4Qo0LHFQqKKwVehOkAEHHZ8XcfqAtxO2Pt6KBAefCZtpFWLKHLQDboHs4oQpO1wSN+3GjG94Aa8CihKoxy8yzS526HhdAxWYuRV/MG1mWHL68umeQhyWd2eN3MHWQz/w67jbaosBX8ASdLWxruBN/4rRwzjGp+3i/Nzm6Wcr9YR+AzsVjKnr0+EAAAAASUVORK5CYII=);
}
.main .section-1 .content .container .rt .btn-wrapper {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  margin-top: 20px;
}
.main .section-1 .content .container .rt .more {
  display: inline-block;
  margin: 16px 0 0 42px;
  font-size: 20px;
  color: #FFFFFF;
  line-height: 28px;
  height: 28px;
  text-decoration: underline;
}
.main .section-1 .content .container .rt .more:hover {
  color: #BE9BE9;
}
@media screen and (max-width: 768px) {
  .main .section-1 .content .container .rt .more {
    font-size: 14px;
  }
}
.main .section-1 .content .container .rt .btn-download {
  display: inline-block;
  height: 56px;
  line-height: 56px;
  padding: 0 42px;
  background: #1E0B35;
  box-shadow: 0px 2px 18px 0px rgba(0, 0, 0, 0.35);
  border-radius: 8px;
  text-align: center;
  font-size: 24px;
  font-family: "736-CAI978";
}
.main .section-1 .content .container .rt .btn-download span {
  padding-left: 42px;
  background: url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNTIiIGhlaWdodD0iNTIiPjxkZWZzPjxzdHlsZT5AZm9udC1mYWNle2ZvbnQtZmFtaWx5OmVsZW1lbnQtaWNvbnM7c3JjOnVybChjaHJvbWUtZXh0ZW5zaW9uOi8vbW9vbWJlb2Rmb21kcGpucG9jb2JlbW9pYWVtZWRua2cvZm9udHMvZWxlbWVudC1pY29ucy53b2ZmKSBmb3JtYXQoJnF1b3Q7d29mZiZxdW90OyksdXJsKCZxdW90O2Nocm9tZS1leHRlbnNpb246Ly9tb29tYmVvZGZvbWRwam5wb2NvYmVtb2lhZW1lZG5rZy9mb250cy9lbGVtZW50LWljb25zLnR0ZiAmcXVvdDspIGZvcm1hdCgmcXVvdDt0cnVldHlwZSZxdW90Oyl9PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTQ2OC44MSA4Mi4wNnY0MTYuNDY5aDU1Mi40MTRWMHpNMi43NzcgNTAzLjI2SDQzNC4yNlY4NS45NjZMMi43NzYgMTQ5LjcyM3ptNDY2LjAzNSA0MzguNjhsNTUyLjQxMyA4Mi4wNlY1MzcuODFINDY4Ljgxek0yLjc3NiA4NzQuMjc3bDQzMS40ODMgNjMuNzU2VjUzNy44MUgyLjc3NnoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=) no-repeat left center / 26px;
}
.main .section-1 .content .container .rt .btn-download.mac span {
  background-image: url(/asset/online/jpg-converter/css/images/mac-237a415a.svg);
}
.main .section-2 {
  margin-top: 74px;
  padding-top: 48px;
  text-align: center;
  background: #F5F4FF;
}
.main .section-2 ul {
  display: flex;
  justify-content: center;
  margin-top: 48px;
  padding-bottom: 58px;
}
.main .section-2 ul li {
  max-width: 340px;
  margin: 0 16px;
  padding: 24px 0 28px;
  background: #FFFFFF;
  box-shadow: 0px 5px 14px 1px rgba(56, 46, 198, 0.15);
  border-radius: 10px;
}
.main .section-2 ul li .title {
  padding: 0 8px;
  font-size: 20px;
  font-family: "736-CAI978";
  color: #7419E3;
  line-height: 32px;
}
.main .section-2 ul li .desc {
  margin-top: 16px;
  padding: 0 24px;
  font-size: 14px;
  line-height: 22px;
  color: #1D1749;
}
.main .section-3 {
  margin-top: 88px;
  text-align: center;
}
.main .section-3 ul {
  display: flex;
  justify-content: center;
  margin-top: 28px;
}
.main .section-3 ul li {
  max-width: 340px;
  margin: 0 16px;
  padding: 94px 0 28px;
  border-radius: 10px;
  background: no-repeat center top / 64px #F5F4FF;
  background-position-y: 24px;
}
.main .section-3 ul li:nth-of-type(1) {
  background-image: url(/asset/online/jpg-converter/css/images/icon-2-1-69440594.png);
}
.main .section-3 ul li:nth-of-type(2) {
  background-image: url(/asset/online/jpg-converter/css/images/icon-2-2-909ddcad.png);
}
.main .section-3 ul li:nth-of-type(3) {
  background-image: url(/asset/online/jpg-converter/css/images/icon-2-3-272a3e90.png);
}
.main .section-3 ul li .title {
  font-size: 20px;
  font-family: "736-CAI978";
  color: #7419E3;
  line-height: 32px;
}
.main .section-3 ul li .desc {
  margin-top: 16px;
  padding: 0 24px;
  font-size: 14px;
  line-height: 22px;
  color: #1D1749;
}
.main .section-3-1 {
  margin-top: 88px;
  text-align: center;
}
.main .section-3-1 ul {
  display: flex;
  justify-content: center;
  margin-top: 24px;
}
.main .section-3-1 ul li {
  max-width: 340px;
  margin: 0 16px;
  padding: 80px 0 0;
  border-radius: 10px;
  background: no-repeat center top / 40px #fff;
  background-position-y: 24px;
}
.main .section-3-1 ul li:nth-of-type(1) {
  background-image: url(/asset/online/jpg-converter/css/images/icon-3-1-1-7a8edf34.png);
}
.main .section-3-1 ul li:nth-of-type(2) {
  background-image: url(/asset/online/jpg-converter/css/images/icon-3-1-2-8f3e714e.png);
}
.main .section-3-1 ul li:nth-of-type(3) {
  background-image: url(/asset/online/jpg-converter/css/images/icon-3-1-3-23d1cd11.png);
}
.main .section-3-1 ul li .title {
  font-size: 20px;
  font-family: "736-CAI978";
  color: #7419E3;
  line-height: 32px;
}
.main .section-3-1 ul li .desc {
  margin-top: 16px;
  padding: 0 24px;
  font-size: 14px;
  line-height: 22px;
  color: #1D1749;
}
.main .section-ten {
  padding-top: 88px;
  padding-bottom: 72px;
}
.main .section-ten .h2-desc {
  margin: 4px auto 0;
  font-size: 16px;
  line-height: 24px;
  color: #4f4f4f;
  text-align: center;
}
.main .section-ten .star {
  position: relative;
  min-height: 38px;
  margin-top: 20px;
  text-align: center;
}
.main .section-ten .star .worst,
.main .section-ten .star .best {
  display: none;
}
.main .section-ten .star-btn {
  display: inline-block;
  position: absolute;
  left: -168px;
  right: 0;
  width: 106px;
  margin: 0 auto;
  padding: 8px 20px;
  box-sizing: border-box;
  z-index: 1;
  border-radius: 24px;
  font-size: 24px;
  font-weight: 600;
  color: #fff;
  text-align: left;
  background-color: #ffa500;
}
.main .section-ten .star-btn:hover {
  background-color: #ffb733;
  cursor: pointer;
}
.main .section-ten .star-btn > span {
  position: relative;
}
.main .section-ten .star-btn > span:after {
  content: "";
  position: absolute;
  right: -30px;
  top: 6px;
  width: 20px;
  height: 20px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAMAAAC7IEhfAAAAY1BMVEVHcEz///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////80LMUcAAAAIHRSTlMAIU30oAs5LOzK/ILB11SneZgYRLjgMl3nBavwEXGxaYfPy3sAAAECSURBVBgZjcEHcoNAEATAIe4eGZSTPf9/pSmMKHGsgG4YigK7hGSIPRzpsMOBvQO2FewV2JRykGLLkYMjNpw5OmPdnaM7VgkngjUxJzFWBBknWQDbM73kJT+U+SV94kMiVRM7pUld3FSSAGhP3OHU4spdrhDlDiqAKDepoCfKDSoYiHKVCkaiXKGCiSi/UsEHUX6hghlRmlTgkQcND8FCTUONJUeDw1JEQ4SFgKYAvpCmEL6Gphd8NU0xfCVNDp5bxrcfOR/5FsEjHLkUvYPjKMBcxUFZYXQ5cRBiLmfv+nvD5PZS9hrM3ckoTzCT5BEZY+4nazssdG1WYy7pYOoS/PsDhPdZcAQ6g68AAAAASUVORK5CYII=) no-repeat center;
  background-size: contain;
}
.main .section-ten .star-desc {
  display: inline-block;
  position: absolute;
  left: 98px;
  right: 0;
  margin: 0 auto;
  font-size: 18px;
}
.main .section-ten .star-list {
  position: absolute;
  left: 0;
  right: 0;
  top: 0px;
  width: 120px;
  margin: 0 auto;
  padding: 10px 16px 10px 40px;
  border: 1px solid #ffa500;
  border-radius: 24px;
  background-color: #fff;
  opacity: 0;
}
.main .section-ten .star-list #star-list {
  width: 120px !important;
  padding-top: 3px;
}
.main .section-ten .star-list #star-list img {
  width: 20px;
}
.main .section-ten > ul {
  display: flex;
  margin-top: 44px;
  text-align: center;
}
.main .section-ten > ul > li {
  flex: 1;
  padding: 20px 24px 24px;
  border-radius: 10px;
  border: 1px solid #bebebe;
  background: #ffffff;
}
.main .section-ten > ul > li:not(:last-child) {
  margin-right: 24px;
}
.main .section-ten > ul > li .title {
  font-size: 22px;
  font-weight: 600;
}
.main .section-ten > ul > li .desc {
  margin-top: 6px;
  font-size: 14px;
  line-height: 22px;
  color: #4F4F4F;
}
.main .section-5 {
  margin-top: 70px;
  text-align: center;
}
.main .section-four {
  max-width: 997px;
  height: 330px;
  margin: 88px auto 0;
  padding: 32px 16px 56px 0;
  box-sizing: border-box;
  background: url(/asset/online/jpg-converter/css/images/section-four-4f851f93.png) no-repeat center / 100% 100%;
}
.main .section-four h2 {
  color: #333;
}
.main .section-four-cont {
  margin: 44px auto 0;
  text-align: center;
}
.main .section-four-cont-select {
  display: inline-block;
  position: relative;
  cursor: pointer;
}
.main .section-four-cont-select > select {
  cursor: pointer;
  width: 221px;
  height: 51px;
  background: #ffffff;
  border: 2px solid #584fd6;
  border-radius: 5px;
  font-size: 20px;
  line-height: 51px;
  font-weight: bold;
  text-align: center;
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
}
.main .section-four-cont-select::before {
  content: '';
  width: 16px;
  height: 9px;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 16px;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAJCAMAAAAM9FwAAAAAgVBMVEVHcExXTtdYT9ZYT9ZYT9VYT9VZTthYT9ZYTthXT9ZXUNdOTthXUddYTtZXT9VYUNZYT9ZXUNdYT9ZYT9ZXUddYUNZYT9ZYT9ZXUdZYT9ZYT9ZYUNdXT9ZWT9ZYUNZYT9ZYT9ZYT9dZUdRZTtdcUtZYT9daUtZYT9ZZTtVXTtZYT9bbhsaEAAAAKnRSTlMAUsbUbnQuvzTMZg1SS9va+kbs1kzt9OUs8+dAe0T64d46PF8Z5R+OeVhvTFx+AAAAVElEQVQIHQXBhQHCQAAEsKDfYsXdndt/QBKl0wLg9/pqZzoGeCQf/Sa7EzBI6jfVJfM7dJPyhNs+m4peUobAYZXr9pgUALN1FkkBwPKcFAAwmtSAPzyABtqHpHkkAAAAAElFTkSuQmCC) no-repeat center / contain;
  pointer-events: none;
}
.main .section-four-cont-to {
  display: inline-block;
  font-size: 48px;
  color: #584fd6;
  line-height: 51px;
  font-weight: bold;
  margin: 0 50px;
  vertical-align: top;
}
.main .section-four-cont .buttons {
  position: relative;
  width: 598px;
  margin: 0 auto;
  margin-top: 40px;
  text-align: center;
}
.main .section-four-cont .buttons .as-download {
  width: 100%;
  font-size: 24px;
  font-family: "736-CAI978";
}
.main .section-four-cont .buttons .as-download::before {
  display: none;
}
.main .section-four-cont .buttons.active .tips {
  display: block;
}
.main .section-four-cont .buttons .tips {
  display: none;
  position: absolute;
  left: 144px;
  bottom: 88px;
  width: 319px;
  padding: 14px 8px 16px 8px;
  background: #ECEBFF;
  box-shadow: 0px 2px 5px 0px rgba(88, 79, 214, 0.2);
  border-radius: 10px;
  text-align: center;
}
.main .section-four-cont .buttons .tips::before {
  content: "";
  position: absolute;
  left: 160px;
  bottom: -14px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 16px 28px 0px 7px;
  border-color: #ECEBFF transparent transparent transparent;
}
.main .section-four-cont .buttons .tips p {
  font-size: 20px;
  line-height: 28px;
  color: #584FD6;
  font-family: "736-CAI978";
}
.main .section-four-cont .buttons .tips .btn-download {
  display: inline-block;
  height: 40px;
  line-height: 40px;
  margin-top: 16px;
  padding: 0 36px;
  background: #140F5D;
  box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2);
  border-radius: 4px;
  text-align: center;
  font-size: 16px;
  font-family: "736-CAI978";
  color: #fff;
}
.main .section-convert {
  margin-top: 88px;
  text-align: center;
}
.main .section-convert ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  max-width: 724px;
  margin: 40px auto 0;
  border-top: 1px solid #DDDDDD;
  border-left: 1px solid #DDDDDD;
}
.main .section-convert ul li {
  flex: auto;
  width: 180px;
  padding: 16px 0 2px;
  border-right: 1px solid #DDDDDD;
  border-bottom: 1px solid #DDDDDD;
}
.main .section-convert ul li a {
  display: block;
}
.main .section-convert ul li .title {
  padding: 0 8px;
  font-size: 20px;
  font-weight: 600;
  color: #1D1749;
}
.main .section-convert ul li img {
  margin-top: 16px;
  width: 83px;
  height: 95px;
}
.main .questions {
  margin: 0 auto;
  padding: 88px 80px 0;
  box-sizing: border-box;
  color: #1D1749;
}
.main .questions .questions-list {
  margin: 32px auto 0;
  padding: 0 80px;
  max-width: 888px;
}
.main .questions .questions-list li {
  border-bottom: 1px solid #E1E1E1;
  padding: 22px 0;
  margin: 0 auto;
  max-width: 728px;
}
.main .questions .questions-list li h3 {
  font-size: 20px;
  line-height: 40px;
  padding-left: 28px;
  position: relative;
  cursor: pointer;
  font-family: "736-CAI978";
}
.main .questions .questions-list li h3:before {
  content: '';
  position: absolute;
  width: 16px;
  height: 16px;
  top: 12px;
  left: 0;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgBAMAAACBVGfHAAAAHlBMVEVHcEwAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAABaVcReAAAACXRSTlMAQKU/+LoiEXCI2GU9AAAAXUlEQVQoz2NgAAN2FacCBmTAOnNmAIpA5syZ01AELGfOnIwiIDlz5sQBFkgWBILOmTNngGgzBobSmSggnEETVWASgyeqwBRMAQwtGIZiWDtowgN7RGFEJUZkI5IDAEmEaMvW+5+mAAAAAElFTkSuQmCC);
  background-size: 16px;
}
.main .questions .questions-list li .question-desc {
  display: none;
  padding: 0 28px;
  line-height: 36px;
  font-size: 16px;
}
.main .questions .questions-list li[data-active='true'] h3:before {
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgBAMAAACBVGfHAAAAFVBMVEVHcEwAAAAAAAAAAAAAAAAAAAAAAADtBGx6AAAABnRSTlMA/VPpacn3DnLkAAAALUlEQVQoz2NgGEaAxSwNCSQ7MKiloYAkhjBUgVQGMVSBREwBDC0YhmJYO4wAAC/mMDdV4Cf8AAAAAElFTkSuQmCC);
  background-size: 16px;
}
.main .questions .questions-list li[data-active='true'] .question-desc {
  display: block;
}
@media screen and (max-width: 768px) {
  .g-content {
    padding: 0 16px;
  }
  .g-h2 {
    font-size: 20px;
    line-height: 28px;
  }
  .g-desc {
    margin-top: 12px;
    font-size: 14px;
    line-height: 22px;
  }
  .main .product-nav {
    font-size: 14px;
    height: auto;
    padding: 0;
  }
  .main .product-nav .wrapper {
    height: 44px;
    padding: 0 16px;
  }
  .main .product-nav .wrapper .logo a {
    font-size: 16px;
  }
  .main .product-nav .wrapper .button {
    font-size: 12px;
    width: auto;
    height: 28px;
    line-height: 28px;
  }
  .main .product-nav .wrapper .button a {
    padding: 0 12px;
  }
  .main .section-1 {
    background: #7015DF;
  }
  .main .section-1 .content {
    padding-top: 24px;
    padding-bottom: 24px;
  }
  .main .section-1 .content h1 {
    font-size: 30px;
  }
  .main .section-1 .content .h-desc {
    margin-top: 20px;
    font-size: 20px;
  }
  .main .section-1 .content .container {
    flex-wrap: wrap;
    margin-top: 32px;
  }
  .main .section-1 .content .container .lt {
    height: 200px;
    margin-right: 0;
    padding: 18px 0;
    box-sizing: border-box;
    border-radius: 2px;
  }
  .main .section-1 .content .container .lt .box {
    width: 100%;
    height: 100%;
    margin: 0 16px;
    border: 1px dashed #D8D7EA;
    border-radius: 2px;
    box-sizing: border-box;
  }
  .main .section-1 .content .container .lt .box .center .upload .btn-upload {
    width: 238px;
    height: 46px;
    line-height: 46px;
    border-radius: 4px;
    font-size: 14px;
  }
  .main .section-1 .content .container .lt .box .center .upload .btn-upload span {
    padding-left: 28px;
    background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADAAAAAsCAMAAAAUyMtVAAABGlBMVEVHcEz////////////////////////////PzPP///////////9oYNr4+P1cUtdfV9i6tu7////08/xYT9asqOv///9oYNp2b91lXtr////t7Ptxatz////LyPL////y8fzIxfH///////+IguLFwvH///////9/eOCjnOiJhON/d+BrY9v19f3////////e3PeHgeKRiuT///////+1se1jWtmjnujz8vz///////9eVdf5+f7v7vv///98dt/PzPRgWNh3b97///////////9za91lXdmQieTi4fiZleb///////9fV9ijnuhbUtf////Y1vZbU9dsZdvHxPFYT9Zya91/eeCppOpYT9b////+/v/9/f/7+/78/P5b+Nz8AAAAWHRSTlMAJJkg5PXz4Nyg60jX/erf1D75+s/92NHa6PPRL91s+NsuIcjaAd3Mz87P1frxF+nKyeIM1dzK+Mzu5P71wM/f3s7mkeHR2c7rzvdz4dDpUeTu1dz7zcvPL9dJ1gAAAQxJREFUSMfl1sVywzAUQFEF2zhQZmZmxpSZ8cpu//83unAmk9jJs7TM9K7f2XgkPSulEvGkLrc7rqLKpnVlZ2MR87GUrm6pTQYZHezuWQROCOiu4SkB6FrtNdVo+uh+ox6o18WgJdB9y5ZAn9uCdVugGwfcrK0O2YDNDmDONQaPAHDsmQH3mlKXPybAm6fcQj4a5AeoqLc9CizmqOrkUAYHWwTa7xdBJ6FORTARBgURtALQ4o++AnAlAq8HyI344P0N+BiN+KzF7UlX+6D59/vz68XoLJWA+eH7l6AAwIo5uAXoNr+i2p19eJrZaZiHzLGbd2osRbFMeO2KpWKhxS6WzioV+HWQSsYTSv0B2QmJdukdZucAAAAASUVORK5CYII=) no-repeat left center / 18px;
  }
  .main .section-1 .content .container .lt .box .center .upload .tips {
    left: -10px;
    bottom: 49px;
  }
  .main .section-1 .content .container .lt .box .center .desc {
    margin-top: 8px;
    font-size: 12px;
  }
  .main .section-1 .content .container .rt .title {
    padding-top: 40px;
    font-size: 16px;
    font-weight: 600;
    text-align: center;
  }
  .main .section-1 .content .container .rt ul {
    margin-top: 0;
  }
  .main .section-1 .content .container .rt ul li {
    height: auto;
    line-height: 22px;
    padding-top: 16px;
    padding-left: 28px;
    font-size: 14px;
    font-weight: 600;
    background: no-repeat left center / 22px;
    background-position-y: 15px;
  }
  .main .section-1 .content .container .rt .btn-wrapper {
    text-align: center;
  }
  .main .section-1 .content .container .rt .btn-download {
    display: inline-block;
    height: 40px;
    line-height: 40px;
    margin: 0 auto;
    margin-top: 20px;
    padding: 0 42px;
    border-radius: 4px;
    text-align: center;
    font-size: 16px;
  }
  .main .section-1 .content .container .rt .btn-download span {
    padding-left: 26px;
    background: url(data:image/svg+xml;base64,PHN2ZyBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjQgMTAyNCIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNTIiIGhlaWdodD0iNTIiPjxkZWZzPjxzdHlsZT5AZm9udC1mYWNle2ZvbnQtZmFtaWx5OmVsZW1lbnQtaWNvbnM7c3JjOnVybChjaHJvbWUtZXh0ZW5zaW9uOi8vbW9vbWJlb2Rmb21kcGpucG9jb2JlbW9pYWVtZWRua2cvZm9udHMvZWxlbWVudC1pY29ucy53b2ZmKSBmb3JtYXQoJnF1b3Q7d29mZiZxdW90OyksdXJsKCZxdW90O2Nocm9tZS1leHRlbnNpb246Ly9tb29tYmVvZGZvbWRwam5wb2NvYmVtb2lhZW1lZG5rZy9mb250cy9lbGVtZW50LWljb25zLnR0ZiAmcXVvdDspIGZvcm1hdCgmcXVvdDt0cnVldHlwZSZxdW90Oyl9PC9zdHlsZT48L2RlZnM+PHBhdGggZD0iTTQ2OC44MSA4Mi4wNnY0MTYuNDY5aDU1Mi40MTRWMHpNMi43NzcgNTAzLjI2SDQzNC4yNlY4NS45NjZMMi43NzYgMTQ5LjcyM3ptNDY2LjAzNSA0MzguNjhsNTUyLjQxMyA4Mi4wNlY1MzcuODFINDY4Ljgxek0yLjc3NiA4NzQuMjc3bDQzMS40ODMgNjMuNzU2VjUzNy44MUgyLjc3NnoiIGZpbGw9IiNmZmYiLz48L3N2Zz4=) no-repeat left center / 16px;
  }
  .main .section-2 {
    margin-top: 44px;
    padding-top: 32px;
    text-align: center;
  }
  .main .section-2 ul {
    flex-wrap: wrap;
    margin-top: 8px;
    padding-bottom: 32px;
  }
  .main .section-2 ul li {
    max-width: 414px;
    margin: 20px 16px 0;
    padding: 16px 0;
    background: #FFFFFF;
    box-shadow: 0px 5px 14px 1px rgba(56, 46, 198, 0.15);
    border-radius: 10px;
  }
  .main .section-2 ul li .title {
    font-size: 16px;
    line-height: 20px;
  }
  .main .section-2 ul li .desc {
    margin-top: 8px;
    padding: 0 24px;
    font-size: 12px;
    line-height: 18px;
  }
  .main .section-3 {
    margin-top: 44px;
    text-align: center;
  }
  .main .section-3 ul {
    flex-wrap: wrap;
    margin-top: 8px;
  }
  .main .section-3 ul li {
    max-width: 414px;
    margin: 20px 16px 0;
    padding: 58px 0 16px;
    border-radius: 10px;
    background: no-repeat center top / 40px #F5F4FF;
    background-position-y: 12px;
  }
  .main .section-3 ul li .title {
    font-size: 16px;
    line-height: 20px;
  }
  .main .section-3 ul li .desc {
    margin-top: 8px;
    padding: 0 24px;
    font-size: 12px;
    line-height: 18px;
  }
  .main .section-3-1 {
    margin-top: 56px;
    text-align: center;
  }
  .main .section-3-1 ul {
    flex-wrap: wrap;
    margin-top: 8px;
  }
  .main .section-3-1 ul li {
    max-width: 414px;
    margin: 16px 16px 0;
    padding: 66px 0 16px;
    border-radius: 10px;
    background: no-repeat center top / 40px #fff;
    background-position-y: 12px;
  }
  .main .section-3-1 ul li .title {
    font-size: 16px;
    line-height: 20px;
  }
  .main .section-3-1 ul li .desc {
    margin-top: 8px;
    padding: 0 24px;
    font-size: 12px;
    line-height: 18px;
  }
  .main .section-5 {
    margin-top: 44px;
  }
  .main .section-ten {
    padding-top: 44px;
    padding-bottom: 40px;
  }
  .main .section-ten .h2-desc {
    margin: 14px auto 0;
    font-size: 14px;
    line-height: 22px;
  }
  .main .section-ten .star {
    margin-top: 24px;
  }
  .main .section-ten .star-btn {
    left: -110px;
    width: 64px;
    padding: 8px 16px 8px 0;
    font-size: 18px;
    font-weight: 700;
    text-align: center;
    box-sizing: content-box;
  }
  .main .section-ten .star-btn > span:after {
    right: -28px;
    top: 1px;
  }
  .main .section-ten .star-desc {
    margin: 2px auto;
    font-size: 12px;
  }
  .main .section-ten .star-list {
    padding: 6px 16px 6px 48px;
  }
  .main .section-ten .star-list #star-list {
    padding-top: 2px;
  }
  .main .section-ten > ul {
    flex-wrap: wrap;
    margin-top: 0;
  }
  .main .section-ten > ul > li {
    flex: auto;
    width: 46%;
    margin-top: 24px;
    padding: 16px 8px 24px;
    border-radius: 5px;
    box-sizing: border-box;
  }
  .main .section-ten > ul > li:not(:last-child) {
    margin-right: 0;
  }
  .main .section-ten > ul > li:nth-child(2n-1) {
    margin-right: 4%;
  }
  .main .section-ten > ul > li:nth-child(2n) {
    margin-left: 4%;
  }
  .main .section-ten > ul > li .title {
    font-size: 16px;
  }
  .main .section-ten > ul > li .desc {
    margin-top: 8px;
    font-size: 12px;
    line-height: 18px;
  }
  .main .section-four {
    margin: 42px 16px 0;
    padding: 24px 18px 14px 0;
    background-image: url(/asset/online/jpg-converter/css/images/section-four-m-ca0dff44.png);
    height: 355px;
  }
  .main .section-four-cont {
    width: auto;
    margin-top: 20px;
  }
  .main .section-four-cont-select {
    display: block;
    width: fit-content;
    margin: auto;
  }
  .main .section-four-cont-select > select {
    text-align: left;
    width: 213px;
    height: 37px;
    border-width: 1px;
    border-radius: 2.5px;
    line-height: 37px;
    font-size: 16px;
    padding-left: 90px !important;
  }
  .main .section-four-cont-select::before {
    width: 11px;
    height: 6px;
  }
  .main .section-four-cont-to {
    font-size: 36px;
    line-height: 64px;
    display: block;
    text-align: center;
  }
  .main .section-four .buttons {
    width: 282px;
    margin-top: 32px;
  }
  .main .section-four .buttons .as-download {
    height: 40px;
    font-size: 16px;
    padding: 0;
  }
  .main .section-four .buttons .tips {
    display: none;
    position: absolute;
    left: 8px;
    bottom: 52px;
    width: 249px;
    padding: 14px 8px 12px 8px;
    background: #ECEBFF;
    box-shadow: 0px 2px 5px 0px rgba(88, 79, 214, 0.2);
    border-radius: 10px;
    text-align: center;
  }
  .main .section-four .buttons .tips::before {
    content: "";
    position: absolute;
    left: 122px;
    bottom: -8px;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 18px 0px 7px;
    border-color: #ECEBFF transparent transparent transparent;
  }
  .main .section-four .buttons .tips p {
    font-size: 16px;
    line-height: 22px;
    color: #584FD6;
    font-family: "736-CAI978";
  }
  .main .section-four .buttons .tips .btn-download {
    display: inline-block;
    height: 32px;
    line-height: 32px;
    margin-top: 10px;
    padding: 0 36px;
    background: #140F5D;
    box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.2);
    border-radius: 4px;
    text-align: center;
    font-size: 14px;
    font-family: "736-CAI978";
  }
  .main .section-convert {
    margin-top: 44px;
  }
  .main .section-convert ul {
    justify-content: left;
    margin: 24px auto 0;
  }
  .main .section-convert ul li {
    width: 32%;
    padding: 12px 0 2px;
  }
  .main .section-convert ul li:last-child {
    flex: 0 0 auto;
    width: calc(33.33% - 1px);
  }
  .main .section-convert ul li .title {
    padding: 0 4px;
    font-size: 12px;
  }
  .main .section-convert ul li img {
    margin-top: 8px;
    width: 60px;
    height: auto;
  }
  .main .section-convert {
    margin-top: 44px;
  }
  .main .section-convert ul {
    justify-content: left;
    margin: 24px auto 0;
  }
  .main .section-convert ul li {
    flex: 0 0 auto;
    width: calc(33.33% - 1px);
    padding: 12px 0 2px;
  }
  .main .section-convert ul li .title {
    padding: 0 4px;
    font-size: 12px;
  }
  .main .section-convert ul li img {
    margin-top: 8px;
    width: 60px;
    height: auto;
  }
  .main .questions {
    padding: 44px 16px 0;
  }
  .main .questions .questions-list {
    margin: 8px auto 0;
    padding: 0;
    background-position: left 32px;
  }
  .main .questions .questions-list li {
    padding: 16px 0;
  }
  .main .questions .questions-list li h3 {
    font-size: 16px;
    line-height: 24px;
  }
  .main .questions .questions-list li h3:before {
    top: 4px;
    left: 0;
  }
  .main .questions .questions-list li .question-desc {
    display: none;
    line-height: 21px;
    font-size: 14px;
  }
  .main .product-nav .wrapper .mobile {
    display: none;
  }
}

