:root {

    --font-80: 80px;
    --font-70: 70px;
    --font-76: 76px;
    --font-72: 72px;
    --font-64: 64px;
    --font-60: 60px;
    --font-56: 56px;
    --font-50: 50px;
    --font-48: 48px;
    --font-46: 46px;
    --font-42: 42px;
    --font-40: 40px;
    --font-38: 38px;
    --font-36: 36px;
    --font-30: 30px;
    --font-32: 32px;
    --font-28: 28px;
    --font-26: 26px;
    --font-24: 24px;
    --font-22: 22px;
    --font-20: 20px;
    --font-18: 18px;
    --font-16: 16px;
    --font-14: 14px;

    --component-gap: 120px;
    --gap-175: 175px;
    --gap-100: 100px;
    --gap-90: 90px;
    --gap-80: 80px;
    --gap-72: 72px;
    --gap-70: 70px;
    --gap-60: 60px;
    --gap-50: 50px;
    --gap-40: 40px;
    --gap-30: 30px;
    --gap-25: 25px;
    --gap-24: 24px;
    --gap-22: 22px;
    --gap-20: 20px;
    --gap-14: 14px;
    --gap-12: 12px;
    --gap-10: 10px;

    --page-padding: max(40px, calc((100vw - 1620px) / 2));
}

#jif-form-box .input-label{
  color: #99A1AF;
  font-family: var(--font-family);
  font-size: 16px;
  font-style: normal;
  font-weight: 300;
  line-height: normal;
  display: block !important;
  padding: 5px 0 !important;
}


.jiaye-button{
    padding: 8px 37px;
    text-align: center;
    font-family: var(--font-family);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 1.5; /* 150% */
    border-radius: 39px;
    border: 1px solid var(--color-primary);
    transition: all 0.5s;
    background: linear-gradient(92deg, #24BDD8 0%, #95D7E1 123.91%);
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
}
.jiaye-button:hover{
    color: #fff;
    -webkit-text-fill-color: #fff;
    background: linear-gradient(92deg, #24BDD8 0%, #95D7E1 123.91%);
}

.jiaye-page #pagesize{
    margin: 0;
}
.jiaye-page #pagesize ul li a{
    padding: 7px 14px !important;
    margin: 0 8px;
    color: #333;
    text-align: center;
    font-family: var(--font-family);
    font-size: 16px;
    font-style: normal;
    font-weight: 400;
    line-height: 150%; /* 24px */
    border-radius: 10px;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    border: none !important;
}



.container {
  width: min(1620px, calc(100vw - 80px));
  /* max-width: none; */
  max-width: 100%;
  margin: 0 auto;
  padding-left: 0;
  padding-right: 0;
  box-sizing: border-box;
}
@media screen and (max-width: 1600px) {
  :root {
    --page-padding: 32px;
  }

  .container {
    width: min(1682px, calc(100vw - 64px));
  }
}

@media screen and (max-width: 1400px) {
  :root {
    --page-padding: 24px;
  }

  .container {
    width: min(1682px, calc(100vw - 48px));
  }
}

@media screen and (max-width: 1200px) {
  :root {
    --page-padding: 16px;
  }

  .container {
    width: min(1682px, calc(100vw - 32px));
  }
}

@media screen and (max-width: 576px) {
  .container {
    width: min(1682px, calc(100vw - 32px));
  }
}


@media (max-width: 1500px) {


    :root {

        --font-80: 72px;
        --font-76: 68px;
        --font-70: 65px;
        --font-64: 60px;
        --font-60: 56px;
        --font-56: 52px;
        --font-50: 46px;
        --font-48: 44px;
        --font-46: 42px;
        --font-42: 40px;
        --font-40: 38px;
        --font-36: 34px;
        --font-32: 30px;
        --font-30: 28px;
        --font-28: 26px;
        --font-26: 24px;
        --font-24: 22px;
        --font-22: 20px;
        --font-20: 18px;
        --font-18: 18px;
        --font-16: 16px;
        --font-14: 16px;

        --component-gap: 100px;
        --gap-175: 150px;
        --gap-100: 90px;
        --gap-90: 80px;
        --gap-80: 70px;
        --gap-72: 65px;
        --gap-70: 60px;
        --gap-60: 50px;
        --gap-50: 44px;
        --gap-40: 34px;
        --gap-30: 28px;
        --gap-25: 24px;
        --gap-24: 24px;
        --gap-22: 22px;
        --gap-20: 20px;
        --gap-10: 10px;
        --gap-14: 12px;
        --gap-12: 10px;
    }


}

@media (max-width: 1280px) {


    :root {
        --font-80: 70px;
        --font-76: 64px;
        --font-70: 60px;
        --font-64: 56px;
        --font-60: 52px;
        --font-56: 48px;
        --font-50: 44px;
        --font-48: 40px;
        --font-46: 40px;
        --font-42: 38px;
        --font-40: 36px;
        --font-38: 34px;
        --font-36: 26px;
        --font-32: 26px;
        --font-30: 26px;
        --font-28: 24px;
        --font-26: 22px;
        --font-24: 22px;
        --font-22: 20px;
        --font-20: 18px;
        --font-18: 18px;
        --font-16: 16px;
        --font-14: 16px;

        --component-gap: 90px;
        --gap-175: 120px;
        --gap-100: 80px;
        --gap-90: 75px;
        --gap-80: 65px;
        --gap-72: 55px;
        --gap-70: 50px;
        --gap-60: 45px;
        --gap-50: 40px;
        --gap-40: 30px;
        --gap-30: 25px;
        --gap-25: 24px;
        --gap-24: 24px;
        --gap-22: 22px;
        --gap-14: 10px;
        --gap-12: 8px;
    }
}


@media (max-width: 992px) {


    :root {
        --font-80: 60px;
        --font-76: 52px;
        --font-70: 50px;
        --font-64: 48px;
        --font-60: 44px;
        --font-56: 40px;
        --font-50: 36px;
        --font-48: 34px;
        --font-46: 34px;
        --font-42: 32px;
        --font-40: 32px;
        --font-38: 30px;
        --font-36: 26px;
        --font-32: 24px;
        --font-30: 24px;
        --font-28: 22px;
        --font-26: 20px;
        --font-24: 20px;
        --font-22: 18px;
        --font-20: 16px;
        --font-18: 16px;
        --font-16: 16px;
        --font-14: 16px;

        --component-gap: 70px;
        --gap-175: 100px;
        --gap-100: 70px;
        --gap-90: 60px;
        --gap-80: 50px;
        --gap-72: 55px;
        --gap-70: 40px;
        --gap-60: 35px;
        --gap-50: 30px;
        --gap-40: 20px;
        --gap-30: 20px;
        --gap-25: 20px;
        --gap-24: 20px;
        --gap-22: 20px;
        --gap-20: 15px;
        --gap-10: 8px;
        --gap-14: 8px;
        --gap-12: 6px;
    }

}

@media (max-width: 768px) {

    :root {
        --font-80: 50px;
        --font-76: 48px;
        --font-70: 42px;
        --font-64: 40px;
        --font-60: 36px;
        --font-56: 28px;
        --font-50: 28px;
        --font-48: 26px;
        --font-46: 24px;
        --font-42: 22px;
        --font-40: 22px;
        --font-38: 24px;
        --font-36: 20px;
        --font-32: 20px;
        --font-30: 19px;
        --font-28: 18px;
        --font-26: 18px;
        --font-24: 18px;
        --font-22: 16px;
        --font-20: 16px;
        --font-18: 16px;
        --font-16: 16px;
        --font-14: 16px;

        --component-gap: 45px;
        --gap-175: 70px;
        --gap-100: 60px;
        --gap-90: 35px;
        --gap-80: 30px;
        --gap-70: 30px;
        --gap-72: 35px;
        --gap-60: 25px;
        --gap-50: 20px;
        --gap-40: 18px;
        --gap-30: 15px;
        --gap-25: 18px;
        --gap-24: 18px;
        --gap-22: 18px;
        --gap-20: 12px;
        --gap-14: 6px;
        --gap-12: 4px;
    }
}

@media (max-width: 576px) {
    :root {
        --font-80: 40px;
        --font-76: 36px;
        --font-70: 34px;
        --font-64: 32px;
        --font-60: 28px;
        --font-56: 26px;
        --font-50: 24px;
        --font-48: 22px;
        --font-46: 22px;
        --font-42: 20px;
        --font-40: 20px;
        --font-36: 18px;
        --font-30: 17px;
        --font-28: 16px;
        --font-26: 16px;
        --font-24: 16px;
        --font-22: 16px;
        --font-20: 16px;
        --font-18: 16px;
        --font-16: 16px;
        --font-14: 16px;

        --component-gap: 25px;
        --gap-175: 60px;
        --gap-100: 40px;
        --gap-90: 20px;
        --gap-80: 18px;
        --gap-72: 25px;
        --gap-70: 14px;
        --gap-60: 16px;
        --gap-50: 15px;
        --gap-40: 12px;
        --gap-30: 10px;
        --gap-25: 12px;
        --gap-24: 12px;
        --gap-22: 12px;
        --gap-20: 8px;
        --gap-10: 6px;
        --gap-14: 4px;
        --gap-12: 3px;
    }

}

@font-face {
  font-family: 'Inter';
  src: url('https://okki-shop.oss-cn-hangzhou.aliyuncs.com/tpl-common/common/css/advanced_fonts/Inter/Inter-Regular.ttf')
    format('truetype');
  font-weight: 400;
  font-style: normal;
}

@font-face {
  font-family: 'Inter';
  src: url('https://okki-shop.oss-cn-hangzhou.aliyuncs.com/tpl-common/common/css/advanced_fonts/Inter/Inter-Medium.ttf')
    format('truetype');
  font-weight: 500;
  font-style: normal;
}

@font-face {
  font-family: 'Inter';
  src: url('https://okki-shop.oss-cn-hangzhou.aliyuncs.com/tpl-common/common/css/advanced_fonts/Inter/Inter-SemiBold.ttf')
    format('truetype');
  font-weight: 600;
  font-style: normal;
}

@font-face {
  font-family: 'Inter';
  src: url('https://okki-shop.oss-cn-hangzhou.aliyuncs.com/tpl-common/common/css/advanced_fonts/Inter/Inter-Bold.ttf')
    format('truetype');
  font-weight: 700;
  font-style: normal;
}