@charset "utf-8";
/*
Theme Name: provindex
*/

@font-face {
    font-family: 'Outfit';
    src: url('./fonts/Outfit-Thin.ttf');
    font-weight: 100;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('./fonts/Outfit-ExtraLight.ttf');
    font-weight: 200;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('./fonts/Outfit-Light.ttf');
    font-weight: 300;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('./fonts/Outfit-Regular.ttf');
    font-weight: 400;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('./fonts/Outfit-Medium.ttf');
    font-weight: 500;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('./fonts/Outfit-SemiBold.ttf');
    font-weight: 600;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('./fonts/Outfit-Bold.ttf');
    font-weight: 700;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('./fonts/Outfit-ExtraBold.ttf');
    font-weight: 800;
    font-style: normal;
    font-display: swap;
}
@font-face {
    font-family: 'Outfit';
    src: url('./fonts/Outfit-Black.ttf');
    font-weight: 900;
    font-style: normal;
    font-display: swap;
}

.inner{width: 100%;max-width: 1570px;margin: auto;padding: 0px 140px;}
@media (min-width: 768px) {
    /* Chrome */
    ::-webkit-scrollbar { width: 6px;height: 8px;}
    ::-webkit-scrollbar-track {border-radius: 10px;background-color: transparent;}
    ::-webkit-scrollbar-thumb {background-color: rgba(144, 147, 153, 0.3);transition: background-color 0.3s;border-radius: 10px;}
    ::-webkit-scrollbar-thumb:hover {background-color: rgba(144, 147, 153, 0.3);transition: background-color 0.3s;}
    /* Firefox */
    *{
        /* scrollbar-color:rgba(144, 147, 153, 0.3) rgba(255,255,255,0) ; */
        scrollbar-width: thin;
    }
}
:root{
    /* base colors */
    --v-black:#000000;
    --v-black-light: #002329;
    --v-orange:#E35728;
    --v-orange-dark:#B75D26;
    --v-orange-light:#FF8E5C;
    --v-white: #FFFFFF;
    --v-green-darker: #034854;
    --v-grey-dark:#404040;
    --v-grey: #818181;

    /* Public font size */
    --fs-90:90px;
    --fs-64:64px;
    --fs-60:60px;
    --fs-52:52px;
    --fs-50:50px;
    --fs-48:48px;
    --fs-44:44px;
    --fs-42:42px;
    --fs-40:40px;
    --fs-32:32px;
    --fs-26:26px;
    --fs-20:20px;
    --fs-18:18px;
    --fs-16:16px;
    --fs-14:14px;
    --fs-13:13px;
    --fs-12:12px;

}
@media (max-width:1600px) {
    :root{
        --fs-90:85px;
        --fs-64:58px;
        --fs-60:54px;
        --fs-52:50px;
        --fs-50:48px;
        --fs-48:44px;
        --fs-44:42px;
        --fs-42:40px;
        --fs-40:38px;
        --fs-32:30px;
        --fs-28:26px;
        --fs-26:24px;
    }
}
@media (max-width:1440px) {
    :root{
        --fs-90:75px;
        --fs-64:54px;
        --fs-60:50px;
        --fs-52:48px;
        --fs-50:46px;
        --fs-48:40px;
        --fs-44:38px;
        --fs-42:38px;
        --fs-40:36px;
        --fs-32:28px;
        --fs-28:24px;
        --fs-26:22px;
        
    }

	
}
@media (max-width:1400px) {
    .inner{padding: 0 80px;}
}

@media (max-width:1240px) {
    :root{
        --fs-90:70px;
        --fs-64:48px;
        --fs-60:44px;
        --fs-52:42px;
        --fs-50:40px;
        --fs-48:36px;
        --fs-44:34px;
        --fs-42:34px;
        --fs-40:32px;
        --fs-32:26px;
        --fs-28:22px;
        --fs-26:20px;
        --fs-20:18px;
        --fs-18:16px;
        --fs-16:14px;
    }
}

@media (max-width:1024px) {
    .inner{padding: 0 40px;}
}


@media (max-width:980px) {
    :root{
        --fs-90:65px;
        --fs-64:42px;
        --fs-60:40px;
        --fs-52:38px;
        --fs-50:36px;
        --fs-48:32px;
        --fs-44:30px;
        --fs-42:30px;
        --fs-40:28px;
        --fs-32:24px;
        --fs-28:20px;
        --fs-26:18px;
        --fs-20:18px;
    }
}

@media (max-width:768px) {
    .pc-br{display: none;}
    .inner{padding: 0 40px;}
    :root{
        --fs-90:50px;
        --fs-64:28px;
        --fs-60:28px;
        --fs-52:28px;
        --fs-50:26px;
        --fs-48:26px;
        --fs-44:24px;
        --fs-42:24px;
        --fs-40:24px;
        --fs-32:22px;
        --fs-28:20px;
        --fs-26:16px;
        --fs-20:16px;
        --fs-18:16px;
    }

}

@media (max-width:510px) {
    .inner{padding: 0 20px;}
    :root{
        --fs-90:45px;
        --fs-64:20px;
        --fs-60:28px;
        --fs-52:26px;
        --fs-48:20px;
        /* 后续在定义start */
        --fs-44:20px;
        --fs-42:20px;
        --fs-40:20px;
        --fs-32:18px;
        /* 后续在定义end */
        --fs-28:18px;
        --fs-20:14px;
        --fs-18:14px;
        --fs-14:14px;
        --fs-13:13px;
        --fs-12:12px;
    }
}


*,
*:before,
*:after{-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;padding: 0;margin: 0;-webkit-tap-highlight-color: rgba(255, 255, 255, 0);}
html{background:none;-webkit-text-size-adjust:100%;height:100%;}
body{font-family: 'Outfit', Arial, Helvetica, sans-serif;font-size: var(--fs-16);font-weight: 400; margin: 0px;line-height: 1.5;color: var(--v-grey);text-align: left;background-color: #191c28;}
hr{box-sizing: content-box;height: 0;overflow: visible}
b,strong{font-weight:800;}
button, input, optgroup, select, textarea {margin: 0; font-family: inherit;font-size: inherit;line-height: inherit;-webkit-appearance: none; -moz-appearance: none; appearance: none;outline: none;}

a{color: inherit;}
a, a:hover {text-decoration: none;}
a.underline, a.underline:hover {text-decoration: underline;}
p{margin: 0 0 20px;font-weight: 400;}
img{max-width: 100%;height: auto;border-style: none;vertical-align: middle;}
li{list-style: none;}
sub,sup {position: relative;font-size: 75%;line-height: 0;vertical-align: baseline;}
sub{bottom: -.25em;}
sup{top: -.5em;}
svg{overflow: hidden;vertical-align: middle;}
table{border-collapse: collapse}
th{text-align: inherit;text-align: -webkit-match-parent;}

label{display: inline-block;}
button{border-radius: 0;}
button:focus:not(:focus-visible){outline: 0;}
button,input,optgroup,select,textarea{margin: 0;font-family: inherit;font-size: inherit;line-height: inherit;}
button,input{overflow: visible;}
button,select{text-transform: none;}
[role=button]{cursor: pointer;}
select{word-wrap: normal;}
[type=button],[type=reset],[type=submit],button{-webkit-appearance: button;}
[type=button]:not(:disabled),[type=reset]:not(:disabled),[type=submit]:not(:disabled),button:not(:disabled){cursor: pointer;}
[type=button]::-moz-focus-inner,[type=reset]::-moz-focus-inner,[type=submit]::-moz-focus-inner,button::-moz-focus-inner{padding: 0;border-style: none;}
input[type=checkbox],input[type=radio]{box-sizing: border-box;padding: 0;}
textarea{overflow: auto;resize: vertical;}




.whiet-button{width: fit-content;overflow: hidden; transition: all 0.6s; background: #fff;position: relative;border-radius: 8px; color: var(--v-black); display: flex; font-size: 23px; font-weight: 400;padding: 7px 8px 7px 22px;gap: 8px;align-items: center;}
.whiet-button::before{content: '';display: block;width: 50%;height: 150px;background-color: #418565;position: absolute;top: 0%;left: 0%;border-radius: 50%;transition: .4s;z-index: -1;transform: translate(-100%, 100%);}
.botton-svg{ width: 42px; height: 42px;background: #418565;border-radius: 8px;display: flex; transition: all 0.4s; justify-content: center;}
.botton-svg img{width: 20px;transform: rotate(-90deg);transition: .4s;}
.whiet-button{position: relative; z-index: 1;}
.whiet-button span{transition: all 0.4s;}
.whiet-button:hover{background-color: #418565;}
.whiet-button:hover span{color: #fff;}
.whiet-button:hover::before{transform: translate(50%, 50%) scale(4);}
.whiet-button:hover .botton-svg img{transform: rotate(-45deg);}

@media (max-width:1240px) {
    .whiet-button{font-size: 20px;}
    .botton-svg {width: 40px;height: 40px;}
}
@media (max-width:1024px) {
    .whiet-button{font-size: 18px;}
    .botton-svg {width: 38px;height: 38px;}
}
@media (max-width:768px) {
    .whiet-button{font-size: 16px;padding: 6px 8px 6px 16px;}
    .botton-svg {width: 32px;height: 32px;}
}