@font-face {
    font-family: "iconfont"; /* Project id 772731 */
    src: url('data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAADxkAAsAAAAAbawAADwTAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACPMAqBthyBkwcBNgIkA4J4C4E+AAQgBYRnB4hSG5VaNeOYpbgdICXZ8Q4RVatUFGWUk5j9/5+TG0MUWmhabv0g84ilVGKVp2yDjqy7rRLTpC4HBbxwzJdAeKztQ5EL8aJAxEFEkCRE9UjP+43vAWnoQuixpC0amkihhcfWN+iWQTx9TXIh2E+X/XnMtGnxLObTHJIUTXh65tB/dwmXgCyRrKpDVtUkq2CbJ5bEajNic0Bxez7Dw9z6t2q2UbEKYGNB5NYMBoyxkTFSSSmDUFIxUcFEjFMswCrM07PQ/ndmfc4zMSEA5NqV1z5JDyFswjJEUI5VfYjCE+Ee4Atvk0xtngJgeV36kl9RMpRpbSeYOqxlU3IFBmmVVl9cYJjaET9ecriWbWxiqw5LDJNsEdQjb+ymb8S/UAUNAJNJsqebUUG3a+eZEw8ToV/UieSCnLgxcErE1/C5tk1nlWEvxC8aiuYDVD/fhRBKRtjCaNeWOFneNJRTSyocaNJ7DRgCB8akcJBkgUhQWGj5sQj+SF/pO2AIFCzLkgMFp44dJ2k5eOm2lv2932X6uTnCJsyhL8gI4Hme+xrPzl/84hyfIRvxpeX1agdL0+JEMw93jzSKJfFMm1I1a7EKY9458hwjHSuPi86Vq9pFtbsA77QLQuSCok9LKoFOAuGgpWQPQV2KTilXHgK8AF4EeYmkE+koOaYqxdJl+BCrL3++9Hz35Xfflf9XVK/OYk2GP5Em7ao3T9BgTC0HsWPqE6vWEEQlSBTX6Pixl+F0xnYVepvSTisWIVD4VxAgokc46MRrtADi3lczHbiC4z4ViB/K3l+YA9DX1zgZgxCceaovOiAX6wM96xI4D35e/rHcFQCKa+B+ZtamzQdjLyDv7sKab/PYV/ytuUfkeQVcwIAOy25sIvtWhwAsOu4ITiLZ94ArVoBGsM9ogoYosey66u1MPnn2rXe85Hf5T/5fAsuL8q98DRhyRClTod4scww6JNjZt1XN38i7Wl1Dj1pZW95tnpoCPyEvHHPryxZvN/999eGvUeNoYHZkyH5Xv3L/Te590UeNat1bby7amw8vb6Ov0d/sf6i2Ju3/WvJ17catdQ93ao+ddCveaJ67cOlKPZHJ5vKFYqlcqSZTsei9UDgS3LBpy7Ydu/bsO3DoyLETp86s6TZmUI9effoNGDRk2JCAYSNGjRk3YdKUaTNmzZm3YNGSZSsGdOrQPjH+eC39yFI/tH/d/ZIgDF8SFDskOHZJCOyREjFBysaP1IV90jK8Sr3bcnoG+JbVuJZn41NuxbncgXd5CT7kt9ggv8MmeQJb5P+wTQnEm/ICF8q/uFHe41b5gDvlI+6VT3hQPuNR+XLpCf0KNAQUzwKGF0HGpYjClSjDmajAqajHAdGIIzETx2IWTsQcHIoBTBIbMEUMYpo4hBniCGaJo5gjjmGeOI4F4gQWiTEsESexTJzCCnEaq8QZrBFnsU6zCuM0f6OVSsAYlYRuqh16qGT0Uinoo1LRT7XHANUBg1THMFsnBOqMQF0QqCsCdUOg7gjUA4F6IlAvBEpDoHQEykSgLATKRqAcBMpFoDwEykegAiDiOiARhjLqjYCKAT4kOvAg0YMLSSU4kLSAQbJ5/87dldaFlbwlBwNVe6Bp3d1Bv0OcB0txET9leJ8riGJ4jI/hylTdxls9zFTPU10lZYPv9Qk/kwBRXXXNM4jlOMZaWJcL/oMqGar5uBQsqNGj6ujhCGdhXRJQbJliFvtOspkXIFQJ8+Ff6jpX7wyP84aqWUmR3SHz+WeVgPLq5JlIO8MFxmUueQw28Y9mQnVwa/sEKr6TVwoB2E2zaBTHGMndUCUrkkQZeOZyIpC0Skn4JqTEWeQSXaFpSothEVeOHQoGp1RpiEgTg6AfIwPE5ykVLsQ4yAQmDAPJFOOWIsi/BOBxfTrUcVgCSDh9+wrAXPWjCGuTdqIdtM5lXWTIw7OhCsWoJPdU0koTKpd0ulLkXNExYBVXpp/NJDENz3S9o8hFxcAeklTpZDIluAygTrMyjEMKXN2Virxu3IsBnA703eG7bTxDnPQYw2lEdAAFSwHaRfi11iGUZRAWYvLNzT9X53oHPYmylESjcDFeun1jro7s1m0mpBDGDYtzClXKXEGGSrV0utFzFIWrj/ByvuB6peKndicmBFZyA0z1rvRZ2+/Wfg/bGRluF0DnLb9wSjjoBDOhqk12ejuh2qCkoUtCFTIu44A4QYyTxzUAhaHqaj7rj62bgcZILaar1D5mDfWS049qGkYDsI+FVQu/xye1SQmkvxObeFBZV+tFNGe8W339YWJKn5IrMkmikwdmn7lphRMhowrgz7BlxHRRHUu8yIc55oKMzMfnSUlvVCSSj8xkKK0IUy5kUbOAWLRyS7WVg3ODnOccJkW2kmCKbOKn2I5wZNWsWdthuT3qyRZ1hg0ox4NcgDYiftwi85M925arJoWDwbmh6eegITz0jpFQWjkxhFuAKi3jd9VqtPAE7m5CLlI3waRw1AASPh7mB+j60rCmqqQDgTy8rYHNFDEWHAhOOshNNg8UoiwqTXRnJZDMTKb6OKR1jFvDuM9wJdU6WIwNHouX4vNPeenHvlVtCQRFs4ihZJIRQUg6PTLSnXalHDD+AjNNlAzFweYr4gOsEaMxhrolfTRdQKdSPpUmSBlO45iyE9JhaOvJrprTL6IhMrYl0vPTvQbhoKaWXJeIFSQQtZPaKezAVi/EyM9GfO8nda1Xkr+FaReis88032g+sdmw07B6qPSPS0aPDfZ35fSyURvr3CIjxTDNOPyUfe6ENkAMibRz0t46DI7uzMOJPr5fk9KZM8MFgWc7P6oJ4zUcP81tKTEzl+CQ54SFPwQuJg1ZS/nPjkupO1go4Hn4vFLXB6znkjovE0Mhq8SggsFL5CWd9Iu8SIY7qTGP/J4ABc2Y6FSPqwd8M7Nfe6wRxgfA7Ole1ZjxbGCNHNJH692Eav1jtM1lZ9Vayc27WeaiLm2eBlJqQDU4CFZWH1XiuomLuCCHKa9QnwBJL5oLGYW5SzAk1+5aBMfDnEJDE2Q4we8hUoRzmKEUzYbrLUcZNxXrCwaPd2lYJz+nrECCXC7jqAxaA4fbZYVGq24BnNEJN22oZTul78r2GIn9S0Ot8HmNUfzm65QT40UuQHXSyfoDk4+70UL/xOPVwmkw9kxQkNGbgzHALfEIbsIUAa8DWW0Rc/5iE3G9+ijiKdqzsWcXHqrD6QV5SjB0c3ZFVLuQ0yJaNDYKH6ccF2MK2TpYwhjMnw8Wu1yNWwIZQqAnJA4RSvGTnJOSoYO7LlGG44jWhJYBPK9xV/vwzmk+ctPOYw2PWHJLQDebQUg+QxN0VHkH6yn+pC4EEXLH0eLjCirGRi3dGPsDzSSkqlKCD2/KP6pbCZrYGqxGTMQcQp7yiJduZFk00tpj0uU5KoxSm2O9/jrm59gSmepoeSNS3GaSO2+cBawzaRBoPiUCty3Z0+VQMsI0DlhNEYcDOQGKNFdTAOQ2bRNlnZyYZAx+TCke55x8JgQ6nj1R5k6Kwsw0G2YRQ4gT0xAvN07xsBo3hJXsLMhn1vzqEki8uTxrWf9Me3FT4ey1S50aKLFVN5uaCl/fDi6vhdc7+tqmtKum79Ss4PD0I2fsdIkzmmdpPDb1ZMt+fLEf5k8S5PvL4vcbVLZcHWX1WFDjXl1ceQBHetruUUajwQbZBbQk1yCfOf3sKcc3q3Zg1fRw2M9OaNPWRylqLq5M2g3Id2e9rVMKPGxC7AKOkFKO8UoX0doOk0cwrVdGRHaww3sv7rVI95l+aJrrR7Uut9R8NaGunZZeCWJ6nxDjPd8wDOHIVMh20xjSmCFSEJjO80KcLXU2KtNhTs9IaI3P9W5YfeLYSUt8algfJtUmpTY+ybl8dNPhU8eEIxLY2gjTdlSQY8dPnDqpqMgwELo/D6XcWCEPj5c3dqLHxLZquqo6GS7cEoU8LePr3eLDp7rjD2eumMbS8MSU90y1I/wsDyduqD0ykYFJNxoln4QcYkE8nigPH2FVhRUGxRqoWv8s86FqUlpRNa1azuJW4Gaa5JSQgWtTgcFA5LtyLKvBvtq12VdEbPVpinLQErkzPteU/93wbiKrl9rfoylc+6JbWW9afoHlrUxakftVoLtdd4FTqc8QAt+iH32BedGC8XSB9ihe2xT7U6su9/ggg078uNOUTHgfOgAQp2IqpQmZpxjy+vN8YjIEtgnn39lgnbIWZ8zZZtp5pJ9n1GfVZzIzN2KXszNl6e7i3aHpod4EtlcZo+Zk0dsGaL6ZUQsRCs/4FzLvV+1hzNZLRc+d5cXSNOYlYtjsNvrmlbWt4Mr6xc2uvroxab+9he6FLDQzLmIMYq7J8YZ0MnFu+it6rFi41gN70WwC94iIE4x5pWLQsiDZQMR81wW+ZLU+r/YrVo2A69k+JJuyliWgp0MA6cawbi9eNqOvz3VBU8w+WSx8s3TpaktDpGwg1EBJKxMkKWQgKDUu7az97ksgYJDJCI/RvR3wWf/di+RBnZCHM/poBihgQEg8f3sbc93orETgMCop5d7Zoh/Oh0rpoLv7IO1y3iyc93VrVnDC0cJ96Izy3/GzjmU7AaaHNt1FXlofvT0LgEayoH/wxjlNBFhKf84R4YtHb+G8LQ7FmHzljmStOWt+CTAqR4IgNdkM/bFRCZKN6KhlTsbxqXFZJifwk0is2FBlvNwnuSDkZ7c5eyECTzpjJNVEnwWx3YhTFk8qXppfaiwkXSTSXuOwEvHO18EdMSSVn1vccm8mWkBAY1Mtrdyfl7iNl+auf0+WxhaybpQhlofVTu1a5Ro3XaaFD+jpPhIk7aVJT65DOZEgl3oBY78oT/VaOA4e73D0t1rj90AB3uhhEfDwyOIj0n0xViCSfBA8XY2Lsh/gUZWsvQZSbP3sNKMI+HZ8j9yo7LP/Jvbq7RowobSUVhWjEO4RhtA+L7TTXuUYKyDthLrL2Tky/KBVRnQPYQB28lfnmH0UpShFIdU919dLe57vjNR6bln5FuXcYJfeKCbdE5keyedkOwQg+tOG0mSq17F9gxTyA01+PGBIwIRveEkeYZP9FoSX7ZT1oFMe40q8Ey+8BPJCKXOlKpV4s/x6LBJU69AXybtxc2A+ygrITYsSKcV4sXLcQQU/WZhYtFtTca8WF7qDwJIj6ELpXjUi37seTHWpJXpzdqJaTxWDFCcGhusX4Ead4uW6SjUv92RwJ/e0HtzLfbx6PnuELaTdBvm8djFHgO3DpOF+flACr7EVa9VZNttnFFRclKBYJi/BWgP46siJyBMMN70EZ4EzJHHfQgm6zfOkk0tN5Ot+7FQ8v8lTuR8Um5pPg/BgTtZVkDFdkG31+GUiRj4CvsNQHwLTR4EWz2buIsTO1MxDSJULWUFFqKQEKiTbP6OWphjFVsGY5yK3RIjIqRTt8mo0KcaqFXKoqT+69PPlje1usS4nfR1w1sOqZlg0+bfJqCmBdGIzndr6y/WErZB1q1vd4qm/T8UsGbWXnO81NF5rpJ2LRVuFers/33/eHKWzTy6PuWN3Bfs2obE6VBq6ZIxSGVMr4xUgzJt/1ekXjeTIHFVx3gYpQ5v8XUAjw20xoscdhA4OBorh/kbNJqkk4dC2NW5kxzHF3rWjqSOnm2tj7+wvVTvcXuSWcJB/V/hzwmGmXp80J9khUIsokMJdpasdgGVZmWp/HuajW4sW4IH8JEuiBU0zej7xgo0IPzgSz4/rN7s3H3XCpptB6eWnfZH69Tvc9I3yq9Z/rr3XU07YdjMN2+pW62VJopXUvWx1oMJTwbAvL/NT5xpxdgJ9xl8tFc0tvly7ndyCoMstLhPrKj2BGTOsu/6kJKGtKiuWuhKKX71r3HAoxCIEZ/hXwbIrCfl/+F+mHBcQQ0g78u7GHCLIo4mwyU/fUmLokoxb3/w/RzCpoXwzhUp5jnTorTgo7zghBw51JD5CTi2+e38MCb6CUEHnP+fy2IV+ShxiyUPuqPQYLvL77LIkncEtsLXIgepgiL+aikgojkody6UdZ/cs3iId//cr9ZnJhcb81FOc0ogT58fu71KgVG7KlSKRb3YzVkmvkSXNW9/7F1mR1RaDCpSVW84D2fvQetD76mElePqhSwzVwFZ8umc7wQPj9yrQ7SlP6IrzH+ER4I+Su/VhtSoWkMwgeVgel9mTqUtu7GBqWvcW/MkJWK63Yrg4XTvpAAaBLkgH+ydWr8eQYsreTccvSLnOj1kcayKANPQ1VehJ2ymU4ax58p5i02VJl0lNpGnsS0/ttOyU9Jhuj0h8uDzWJZvdhbTPONMRhgnczGUFTzLKm1AB9s92JQozkXgRkXZQ6KexCrjzqpPFlkYuvFOumsvrwntRcDkUvnmgg9ROht/0pruJuVvZxIpFBndp+L/yyg5UmpiX4N4NoRKI/woqA4nfQI1YjcA/iJ9cGLU4+eMBtI+5pz0mG3/TOpZhoSwrwMgHUukiISPLsmckc1E5noTxwgE0G73SgTW43Amp/E7wS/Mj8Wu9DoPG4Ru8E3b7oXHfoVUvevB/8fzzkZnIeS2UY47RmI8VYwdvpV+UtTvc9dTSlYrJOT7Od5Iye7cEJTpJqVmGgcTuopCDSdZamVvgWqKu5gz5hQJUkwR8sFIzS3F550SQOZBGeBdHhWh0cu9qeehlMCUEG9CwkkD4kEGaxt4EiRNv9VLsctxwcSMTdkKVqqy5sbJVIHyKlDxcG/aIMTO0npg9aXVpaTchr16B8FcksrYEnFO09YJ03ezLsca2YdaGm20OXDl/ijmxtT9U1tC13oRBpsodKERCEfluGvys6RX5/efjjNhxUeIVmmeu6jm4zU+UZ8ymcb+ueWCyk9t+uf7q9eFA1qHpkaWvhSDy1djUcDBeGaXU9Mn9vEKUZa/NP3p9tJ6gVUl8MLkxdrdpWZv8K8wj5hIv7taPKL/6biu3hlp0DvQc492HLTqfpD5+JezaQlVOhfOTpu10fFayQve5D3KK9tiq06yjPVFTUE4lnNNOnzXOnHN6NoNTiPZjw22d/fri/hkJ5I0mYH9qk6EenHtz40cLbB8zf78T289F+RKnz4T6EmdPBw/ZubNvaJz53FmOSlZGlk9pxajkjCnhPrUmQJfVTii2Eturq+kTIUOEW1NlvEM7zZvsSiz1DcTaEnI4x+rW1yBhCZLOowx2xn36e86BYZQz0NFt2rmzKvYYc323Q8b963HLyjfb111R/odN9/6y+S8w6O+L/5f7hnylB+Ct9R1cw1YwtIJCCb6Tsrcwdd+d7v2X8Jkc4YwftS9fDYqimrGqx8ac2VYuKSkj22k0x/MKwCZ9ZJ6Cx/B5RXnSDTFXcXzwsGreKsOS9tNtSdBEWeZcNcYPpljcgw7Fyvh0EnDQ7j23TDWjB0Pnnm4oKFAwuMslVYmxHCByH3ciofD9n9KKjt24qe/JVF9kv9ppJfU22fetnZGdlktAv6UWl9ZHeenMIJkV39Fkzqvm8SyzlYZKQAbfadGuCTQ/6QMOv5xOyMjQTbI+9k6YXg19japdk7VLnGLackY8pUXlbuSltkLLaEXGq6ugMGoyR1gc6Hns5D9yX5TzDGmnBGLwuOoQQ2sOHSsFpvrUIoocsj1//kq2ksqqKqcmt4V7p+G7LyTDr4fqo0tDi6NBdx8RRebtAmmEgom8gQHEUAEx1XK3pUYi+wlChqYJFoqw5LurCJpaGFGxiM6hevBKA7sdzc8m85KExjGNefMxa8XOCNryJGk6Naul1K2DZOzCtv0sJ9+lfUcHvhyRpG2vTK8CThat0lW0VkFeFN88X/hj6Xf+vXRovoHUZaHooqmGi1zgpMgunsLRVJemHNcsK8YtAY0l9ORy2g4sb0apnscjOQhcTFVG1wbbnUFyudef8d9ovhK6gZ2S+cHicCXFMSdEeGuOwWh5VLmHeVy9b3u6GyI96xcnS9OxtPvI7zLliKtk3eRCuqF7vll15qgVBrczSjkX5yqJpqG0NfKHyYUwoliISA1zPW7N7zWvvKrxVCXRtXTSELQrg5AyRxD57tcMPgjHS5IuS/2IXnI99/eW9EnOsmE9rAG1gALZiu3XeeRwXe3+wJMrbX+P/dwK6g541NDtJXbYduSPlf8lhqVp4aG043nQ2Yhtl12RiDYplXVPgI8Dvz8f21x+s5Vr+d93caiB8ehOYQU2PH2W21UTnTlNT2CQc2dYG2E4985KeK0GryLH6CtptzVtyFqs+MraMQTOWCkJ+6cJNfmsOMxn7VSblGXcGbF/YkfOmAXX8UqWKuI2e3fvzfFKcN8Zsco599n0yugv5aqf1L73Ovqjclp1Rgwt9F77JXU8xtsnxtejG9F/6nQXgV2AJCGblE0IiPJOwvvxRzknpQ756LUfXnLk35wXUSedqxnbJUv26sWcGGiStyFKOILuHAzVnbIIrHuduMb5QSUlQQtWBs4vLZ0fuAIsCD723x1TKE2WWK2SZKntSJJBqOfz9cKonULDwAPZtTPqVjK0REHkgP0g5ISZaG6PAx776w2SlXelpoMq12N2/lNiei1dafbrg2lgTFbgNDLjcYq4WofZoDGYEQmDLE5amrx+QW+KaEEHxzChXBP/r4FT57tgeWoCEaQP1LjBNAcv1l+aqYWO1DCrRyZn5qX6f7bCNG4/s8u3YtRMvHjwo/BkV5gDBdswwGrysuYGSdza8gkB+EKMffsRmKUdH0Y4Gpp/qhDclyVhIkNyXqsjEl3CqJXzLtymybf9gYQnYRrwjZhsVCfuMScNpBKTkdgYpv/r0MNAVrkaWY+wIOuQUoYDh7S9yE7kOmQHUgIIox41aXK09yeYjEhrQ9Yji/M7IYoR9cg2pqkPOXIO8WE1ivKm9xlXxe52NrUj0hDFyM3Oy40Lo9KKVHDTSmSI4ocN/PkoO6DsFPxR7bFztoe49PADN/+DaovpoL2xVlG71mxtz7njONeprHKn6HQsr+veRGF8++4USxdfdM9OwV5K6BaXFEq6MUsjW+qsi90XMyszlHNBFGqoQlExhAZl048cK/0b+FMBZAyCP423Qzh43j1uFidOP9C0vySx/AD4fd5+eNSZTm51w0NHz3ByHFo8HAe1/Y4HXkJemK2/O67YvU97S5FBMsytlUx3HqV5Z6UzINBWFOu6/0RtrY8RgC1t7Z4kaqoM3QKFpDOei0uPvISj4Lw5L8yP8VtANrWVGvE1l52ZuXGVDdWPYhBtnFTgGcUceGx+MYeHQCJER1yxBM4ZjQH/eUBoXyc3JzfFi+LEOH0bzCgMVWJHNxo81Z6NZWKH5U5tDvPWa/wZ7UVbdgpPSIGZ4VG1OJ2dMK7FXHXUjgK9ffvB3e/lfv985yu4MH1r99mEc3Giy1+d74kj9jHOdlfBIuFGi9q9v9xv9n0NSXPihIaoKSk5kA5maLWrV5NcEDFVmSSVJhUZIloUjZaqGZVOGqdKjX8xM0Ky8+G9ZBS9q5uOPthQZCkDRX9waLEQGXtoD02QUZStaanVP6CjGED/Bh8mcFSG9pzS4gdTUgyzUh3rP3a5d1HrOak375SUUQ3++myjgzLYB9+LN4Z8ShhnX9fgR1NSImcVO9U/VdrnaRG3OLKqwA16/KmeUHtlSChhlqbo3hkNp/CVxPpkh2nHkxk1maThnPlZ/E4yyc8Ck/xAYY6ilKNgsxVGQ0aNkcVWew6Feh6ABsOVpsmTZbJkedrtBdcdJ8vS5LeFgiWalGihQSAwCKNHCXnHBkG0cJQszaUtYVxe2i6NRDROkrX+uiUjWPLKLNfkpW2sQGRDUsM1HhrgR7aGiIoTjeXMakJeiDrLvsq1IlxOUK/QXNPINUQrIcHV5GZurk2wN1MFt2NzrZvZ1URIIFrlmvSNXaEmyva4W9xmqPHqZXPUBG2KbNwSp77s2DbGqS3jshQtQQ2W/aJcLEz95fBUQ/ueEluVovGKox6hKqytdzFF1NWUbMpqahHmbqugafXqX/Qn2d2B3e0bJvZgU9HU/6vwcC7jCVoHyxOfuErLg101PWFw4So8IBO5zRtoYeZz155KgmFj0lRqP/UiO2T6ajnmHobv7T+wXOBCHrLtdatjYi5haNhwYuHa/ueIX1xtHl1UPeKCk2khTiH0+MMvCUyFrjOXLWKM+u6s7twSuQe5LkFuYDgzihktjEut6mWIrtCsCs5C92XJta2aKAgiES5CWGNviKvh6mpqoHjQr4raXwrTiRHLYXfEiTC2A6IA/ghegMAFI2rE3A5qC73Bz5kxWEWt9hsWc2FDMzolLZQtFLQEN8HEMOwY2HxLN8SL82FrYQEKWYDfXJiAyvXrB2jf+0ueVjn5oYNTk+gA1PIgc9qGn92cNrfP/+Z8yMxxys8z3PNzmWkYpMMcjfNYxqxER9cA2Cjy/Oc/+z+/ONPIYmORDnjPRtDouXTTB8LCv44jSdvecY8wUnH5wQzq2LdTSYuL97lhMVwox3L1E759YcWpDfIk1Zax7DYV7ksH8+PRNz9z6wr/ggK79+b9aXIc0sGLZMdK35e7ONtBa/ef6mx68Sv2IpLYaefMAyiHv3T8WP7eemkyjYNRROg+m4CDpNnNvC/NP2DnJWuvz0UtL5YHoneLJ3NKHQdkDvtz0KF5Lse9fsWkGiydKcPLmmqnpTGuXbaVg7yednwdHGegUfIC++Oc3MgjzpPOIxA3p4GnBNG+TUvzm8N9hwEWmHTUPEUnW7RX1ueIz5kREc+8cfZSOxzhH+Ed5R69qK9ZF8syxTKPP5zhGtxGJBBztfHDMrgWzhoGJm0ugUhsCxZc6dIQNX296mG1MaC4OCaXqH1Bj3pYZQycUYFfw0KbiNh4tGdrCJoUOZOnyH5F60k5zL6pLH8qLdTxt/dU4b/eEzfeOPrEmxszr29hJVJD6t0zKWmcBvsmo60yWJmmrAyKtlGa+fWpydfBP1EZJdJQdVieNhIqy+Zq1P18Xn+OWWtrv2ZiHqlK5dfIaC4yqTN84zmBWodkcpJc3wbR6mtq1To8pjqSSMVEVhNRXL2H1UPPRXLbn1XvAehP2dNN7fZQG82+3TR9DWNNwM8XlGaDtttPN11gXJB72EXaDH9cn0WlzvLoNthka/ShzppFvbb1de6yWqLn8RaPMiJyX17/JDNSr8lzKNuod6nbKHmDQWsJ8PYVlJ2TOy85hUQZqtvrPpuDuYRlYqsUZ2DeaxSlq3BQpkX1o9x3JzPCWeGMeN3BRTgIpawDIeYbmIWTlOrYk9WLMKAFs2gn1fDNRnIG5MoJPdWUyYVY0IxZVBMzVkOZzFNyYQ1eZ7eOso68jvWghlITpzkdZVF1zMl8an68uQD9/soyhUqlzg0817By3+TL1Q6KQ/0me5ZhwNjQQc7zyVsZoVvfepye/Q9j7nRVYN4MyL7zBlFD0tEC5Flzmr9EUeSU0+/oWAS390+Tl2aXYBBMnUlzki3ItffL5ed6WOK0UrgGD6XNu+d46XLlFf0HejO2XEL9OnxET2CN6+DjKjc28aX6jSvHpQSIHrNu0m5yERqiJ6qA/0Y71J8J0EW56GD0OfMjmIeqCyw2TQxBeeSiq0LQuYb9CQeQwei8qNV8bmG5mbXVeibhT5QfKiFmrNexN/zA8o24CtzG5YqDEknyUQI/HwA1WgOpD0so8Wxzn2sqq1d0IGb7ZeTzmkltUb3eeuom6bqqxtWhmzHLTDnttEH+xuLm5ZFcBHarmpEsa5vxfoYLFnoUN7F4XLBmhrfYAofyv22gIyl35qiBZPQyrfwL3Ur7Uk5LjII0K32oVZ3ocN/RWsSBvkYOVsf7M+TY7/ygIwwb72+7yQC6Ojm0BHPXv5ffyP9O/cGT7bJTueCwy0PnsJY5//wQiOpHaZYtRi64nNkcyRPoLYYzJEHH5+ssGHMdj692bqsX1bVXMOl6Ruqx2U1Hu+Zf1l/LGHCCZyP7UGR0F5plLR21V/ragB+kd6WdxA5itpAlkIws4Afaj5jqGeaJt4NCOiES8pCGqKmzlF/NUQ61M3IzjRPl35mXDx59Fpt9RfHZhHP4TBAn8jVl+cZtoHos9FTwqdDFhOHgYQJltuHsXHVdBN3e6ujxluV6nxjRQZUj8qwqhPWb/Sx3XmvVSIZEG5HKAYlPlEKaz9EEX0Pdp+RuJF+SG7ak8+eYTH603jPqKRhI6fh1VS5nQgkzsRlvFdCzZ2diLeUcY2viDmKIsxsYdb7nzHCpO7zGZhVYbWtzCe4/hgNehvvBjR76kWhyFHnEQw83+vneQQ7/uDfLecTOzVmlUQ0J40xzAh8dzTxNnrPrWwD92GviyBS3s9r1sNIzPNxPhpx090hUJ5EL6YXkpAGefjuTzBpikZmJAbdqEhtJhmiYNG9Ezdx/FadtdB/JFmlcd/c8R9PgtKnN9a5aUfYIvgSnvbqfoSZOu+P2Mx/B4b7wfomvjrauszBlERscLfMEk3EBnD3C2E5dyizHVX6Lp5VGOW5xdNLGexaRyoJTU4PLSEWe8drKnBJ7ZaptVtCiW0lRAr3gS1bULoFBEPlNpssugzCSz48UGnZ920kik2pOVGuq1aqqLlV1taqrSqWu7lJXVak1iz3wY0EnccG4gWwM3l1tl0iz0gpoNrDkHLWfqpCyNexYMklGnE+UkcgJHDUbWs3kPGRrOJARpw7MEQwUfRGTQHH/cSLoxA93Siz6kmKrDjO5nrp+EqMbS+3OhEcExyNR/WhmndhO8YGwWCAf7Welmzgf3o3olRjXn2YOSPLiGuePKMVLMdK1e3m/ubGNK6ZJUAwaqPlgTVkpXRW9htJPraEjxUftcEwy6fCWavB5iNVQUeGa6FXSlSmHb4diT5zAht5urTkjOYPzOwzZ7xHuoQ/DeIb/sTPf0p97PMHdQVG4GBsqZrsnXDH3J/wN3sBr8k2Qk9Nvl/Bj5YVdcUF3BL9NvoUN0mQBrpXSSXm9eye1ErNDR27+2Jp30ozSuLRfcDUn9W0721QXkMu8suacjv09qW0kr0yXqhGwy9eSfmPj9sVNDIuM4kAEV02/jIt21OsinaNx/5CpyDfR7iRB5LyAJ9ZytEaN0WK0Hk5hxcMiX0oh3kKDzDxaAyxvHNUDciOdQHOnj0PvOZtgBoP+ithpCmQHAuqIrDfRbkelFG6e3ScPAQbB7qIXXANbgxm8nwWksMT/Z4baRGLpi8+HkCsQcAGy2ATfi7CHyuAJaLDmokxuGqenh5PGzRw3HHjuPI2TyR2XeEzSGNBE9zXi2stST+llQr642YlvkBlJGxdXpzopbrgpPbcuyHgDzfDa6qr84pPqtLg6aSPXB5bivKg6cSMyXWrN84afJJ87FZpYWCaXCHy+PCegGY+rBrseKwKR801nz5rmIwMEXMdXD0feK1hTk3d4RkSWN0+hZ1sYnhWWQaUZfHVeOr8oWtXxtjRlqq8mw5Dlp07P4B6vdyMYngiLi4VPehu6eq9H/5ivp7BM6ErVEFPzlSvgvtRQh1SVhnhUBUQyZA8Jj4DYb1MBVnqPHmp/yB4O0/UYWcohVkQEa0hZGWW2OxaYIWIOqT5+VA1RI6bxLoOA1u2x5j2c3DXV65y2VqS1dDudJZ3wpJHddx5DcqJAwA3ad5KUxArJz8zsmXnWoy+0L4Sl+v9/auYYXRR07L2Ht+efouT6av2hF07C+CG8W5d6Q/8GLqcVLqhtKOMcI2oI5Up9iwPSpPIUuYAR9TaBZHnDiObLZcmpMhPDmTWY5phQq9Au6G1o0zHXpvVpJZA9AbkOHn0eJ/S90Nd/XGV6MTTIZOWmjrwrx4l+iQGu9BHILmRXpvaHvukudAJAb6S9oaADQQD5HbF5Lqgmv0lDpVVtwa5rT7ongapG/Y9NICpaV61LW0zMM4n0htIIEAo9pVescLvntkKrIGYR9Sq1A6b5/GO314/V7N8ZpUQcsZ/d3/Jar4sJmUT4+fW7108CmpRWVQafPa5WE+6wYWjPeFgVvOwOQa0en20WNx/Pc4YHJsq+WFl50HViw3wnasnrC2LvNH/DhOvBSr8SWU71nOCcoKCcGsOJ1kSjg6I4zzONmc+NvnVgnsMlgfeOAmGQbq/rYZ6cV6LZLC1M1DfPk2lmcRJjLBy3w/tXsZZ+MwQfM4BOduU5jmfY9ZB1mS7kYEXhueW9vE3LuSv2KwqDSS6LTvYXkjuZu8G3C10tshwzNc2Sva4+ykle9L7WYcKhFjQJE4DN4ZejY6WrRZIok8ukIKTK39lJlt1+VNb3LEcRC58FnQYAVyWxcEXOsz4ZZLNKFKbz1UShI8UKn5B68NmykT1t0NmQfeZoe7ZMjHesSE+j2WO6wfB71Wz/9JbKimX/kTSwGRKtkBSSpGCXvxjIGXiRrWDfnIxuCxi7fnUsW8e/6fMy0GP24kFNXbJf3kEnqsE3l7P7ibdIba2PZESzxcUkjYdHN4XAc9DuEbmWAclG/wahMzQe/udvfL51ZPkShYIwX+fFkSRIxEkyp4RyRJ4sR6ZJXpQjTEgdrYaIOHEqeZ/VjZDgkhkVgpy3OcLzZLO1v8Hml+GtNStiGLmMzBxXGwh58tZtkIoEpyIvxCztf5hvhQcFsvMSLqiz8ZwATQF++f4HkJaO7LmgYqxvRhSPtVqw13UmZycFgmletN+9jkaHxmZlaNQleUkmGx1OWAaCYZQ/GOhWhpY+h0XD5GzTWfoJJP3jbHIdIEKXl1vKf+HNF1O+qRyc/V04Q5NF6JgaGwwbRrQCoHEvA8eLQjSUUXD5Il0kCE7R1OodYpySsyzuSR7Sen2QtsVnW1ycoYmxhFAbEpGEzoqLbGIuIdYGfz+km4UT2yKJWvIUP7or/2/E6x03lM9GIcviW7wWqJZMNz8v8775bFroo9uX6tmJWS6zBCBmwdbzYeB/5OQwtdX14Kk5aS+51Wc37Dq6IDjVtlkIYtJ156+DEaP+BiBI3aUCiELB5SjYUPCHic3hqVQ8Dk2h7P+iKvaFPaAR50FuDFNleON4HVwhrzB75/v1ZawlrufKFj3ayW1HCbn12ek3fiw9jhc2UK6e91HwUO8PO8OxsN+ie/V355K1Bw637Xvj/rF3HiS7YAE1DEOxoznjJ3x/Qe51bHkzNo6HuJOMkau4zpuuUkCNQOSLwq5fOmb2aDkz2JvIl179gSEuOTc4o4DHujKA8Vx6e2m1dh44dwXQYIrGwtD8kJD80MJPhnPH+SGFoZ+E8WrYYI1k6OiWGm24uqROH4WBXSSgg1CurMiKS7TrJU9UBrPWUqOjRzIgY50wJswRRgm3mKFhKagU2gWTQB3hkHBLPIxxNyDZA3XEUEgX0uSEQGxnpOPhZKgE6oQwhTqFctDhwDAlw5h6dgY0ZZ0DEj4thGYckYgU6N0YIx3BJoUVmeK8P9jtn7D+qVT8U47MyGyw6zYyZOyPSs6/22L+cRPMisErr2MOOWJp3+CkdKghrM5UvWSuYtYZaigjwb574Ry3AdkNm/B/AkBFCXctHYxWiBbuXLohYhW5zQ4OyMUQxE5C5BZBerejOlF0ZJmNqE4k/dH/hQLcBA7MLi5KpBdIyFZyEnPPXhstXzK802SdFHInFJU04yawXVxlpc3kEyNM6ssIw5muHevssV2VBSRonc9lYAVlkZ1uBL/XTiFSiR1NhVz84MiOgdiM5L4YocmHyCwcUDXeECppsTGmyGVqi4r1RD8rmgLiX14TDGoWfkn2TKMdh4rvlfEeflm5atLPePtNplE384OSBYLf+/I4WiW/6iQEEh6OB1gRTIfjtHQCgyBl9fV55IktvuZ4cYLfGZhVlODjZ5ImQHMEfXgvV0TqRzbd5TrF28W+JigvIDsrMDfkBTQ/IMc/ODM0B1q9ubj+gNNjMyq04EP9x1AnXwcUCKDlxjPLbUaPW56R6DVPHU7Mka11S1KEX6BSbvsafb3jRAQ3t6y1+acr9Pjo+rzGZBcUyn3XP263cUs353+IUpV1UYes258nM8gGBvQH+HTJsriRkdwsmV5bW6fVy7I4nFT3bXQqrs7d5q5DymXJyVL5/v8hYHn5mb6RvtbymQ1FSch1mdJgQeVup+GVZ8Bin3iYnqb2is+f3lfYzduC6g6cvXB6fEq37/7pZ2+U/gn3VNJ1Fmms+Ca/AJ+I1bvH0x4bQBRvPyq17WyUOsFT6bz229jWQBEDhYPpIX9aVdjH3VDnO0Bnzws4UKtaC/kp6bFLj60k8TBLc/7jOSkf7l0hYf2HMPBjyn81Htj2TkS/9uVlDH764ncuIJoj3J7otK96+F9HcvMr3jgbZ4/CQNDqoid+/nscCWQbeeAZ8+u8b3A9ewNCUpJ84RnC/NMLqj8/CL0CwlvXF+1/cndwUE14FO+VBIvly3TkxFX1iDtl0RlrIAW+qTve/wET8c2RgXcv3gm1Gd8bmoQqUFGlEa72MbdNl9pE0VadiV3AzivADC0A9RXUe1lVZP6zLxe+uJHjY7Z6KDy2xsVQllDi46yO2GvP9V5YfYdbXX1pC8WP0oXrC92APHe6JWtb41Djo5DVF3xv4ShZWdFZ0GMUAUSttujSr6tmCLBsyXtTSez7BBaWv+WC82oQkS2FW+FlTHtHrl74yR7BBPiNMPl7tI2CoUcbGWjGqyBjYBjR0Q6RuyoFsNEbPZGfYtmGgZt/eQ0RvQkMVwZBCLeKtyOsCBBEhA+G19D4jmwCIbmJRfbH1+zfTtveYsOKzs+E3CMzO1aPrefqSC6lE3g9rShI4ySxOjvZyZy0C5w0dlJnZxI7jXMhjZPM7uxkJUkCrORAMquA7PkGuxTKQWqy3buGZOpBSoqyVhgmDE3yCfMJNQubhMKcnqU9YY4HmBDRf6unLv+qJ8iMienUAImFfgN3mKIZNJMeDuThQGiTh2dKSj3cHoAG088qDrOFhNjCiicNJ2YLuZ/x5G3u1Cb6o08cVoBtD6V0lkuh5bNY8T1vlnve6vh8y1nalDEvo8exSbvM8HVuQjR+uIkv0pMxD/CUt/ITnNUyDF+FW/a5/ISXQzHqxwJt4HSCENGBFHx7FA6W8JdbfhonmdXZyWofwGpLBkltbMAGScKKVfT79BRW8C+bD0nA02h5CRrejBaQfAqT3Tm2GG+pybObYxSMaCUjpsmaFzUb9wNucYzIX8ZwGWf+l8TxQIvx4n1zdmVrZWz7vPwKbWlJoB17zNHWWAoRGbUNfzTs23L4RfrBhSGRuHxosOOzNHfZHq9yyv+bikokUglTwjD451WHr/uwQboOnL3XdkUs7jBOGbvda2Iwj7ogzwNBZdKwn7GkAqdspwIv7I5GScFNyx/NNHFiWQ99lUZtVO28uHgs8z4RG412ZyWPeM11fIgwxKcbfZUPf8ReigO9tRImhbnAKNqMVBgz5EzYyr3hDKdoTpDUDlWfgznDpNC+I0TlDO5yOUcgLiyldlHlQFGXq+opDs1VSEthOX9xXQ2qfMfAcgpYoHWpxX0nRFGL9O9yuG9PQt8KBF+mTp6ldAYj6pAUWW5QajC8DkEx2S7C+VRdSRbbsy1PgpPktXlyOAoli8sMyIXSmH8aLYlo2+fi57IURXdZXmBBYF7vRdcy7CXKJSobSMPcowiRBWrdL9bcL4JbnJPrn/UIDVfO56sKsO8xS0kPNMpFxe27M46mdZj6G+oagpQetdIAa1He/U7Yv2RsLcTbX/XHgc17H3C/xbjwSOMWeX6JWW4Q8eO5MQl2gTVEaeHfso5jJnwp/goQ0AUgFSEGGzkTl2aGYcVcuoxRXkLf6JzOCc5GIN6YDjGBcM+DQJsZg/73O3Oifd1yjPAvcPM1Zu8fp6mI+9XjZeOlF64u5hiE8avLfTBUcBg6DR4nT4w4RIDnBorJ1p0NX9w0K0XBy4F7bgsviJNXwDjbZrlCHIm+U0UkpzkvpDgpAF2d+UP5ff2x9/0V565DnchIiJOdH41k5wLJr1JnmhPUiSamicguNuW8WRSY5iOPy1xwagmkcFmf8GmKGo4oIC7Dx21EMU0ekRaYkaly/sFxFe0f1A6k7BJnqSwxXRKIPbVeE20TlJIJBApdMPcp93sIvygEfDQ4fQfBy01fqSbXrH3EqXgqpnCNq9KHMX2GV9Y83dYTea65IZaN9a5E1kPLh3Ylar5reEV68EDDBm/GTXsoCywkIf6TnatqgvjL7WnhCbmpLmp9XBqvFJ7qkaxPTWU1j4yFbzowa2cVIFdFbJ3n4CnxOuM/GVRghphcLO/B40xXmZqUMJAsXDlcbw2H5N5rFXuqjtn/H4d6ktP7x5swVDlcOJ+jC1njAVGv9V+Dr5iwUJei+0mHTW1XuwkoAgx5mLgSCVrA5nmXLkqfSS9esnwX3M+FDg3p+xKvofDDEYfHd0R6eh0O/wa2h1ep5vdb7pdGrYDL3m5mEw+HHQk/4uWTcoD3UREIW474W/iKtZ/v8Wi1zrn21R8GF6t1SZz/EPChlC7xN/mx7XbXdrR+htTHIf3i4O/JmJ1/hlLPQDdkbqoInhuXIjH6RSUIE71t1nUpIoMkJjnNusoojPP1rsNk3Puli+VoWCqVz6aBnDNOJoX7toLEWadz5UkBqVVgqunHdgMYqTAxf3hZb0pLSoGkSans99R49iuV4RMDUsXxbV5awlBs7BBtKCZ2lZfVa0giBS9WOJPFnv7KKfptdLb7vstr15ugroJ0zxSP7mlsHcewOX6FIeAQZuFru+p/p21wk3ZsMhx44L3KdM/8W+6nmueeS+ulvlb7GmbrkoONgYZsYZ7323xvQh4bZBwOEuCKB4ZcIP6d5g+APVNnZAMhqqxVnkPNLhmyFYVJTajmlgH/7zU34E5PBy7wZObbdGz7K72rOXNrzaE93Xbd7IStsuzNDnUNNE1lxw+Try/dP0dtkKq+DrC5ziJ9ZyMpD24Xf2glFwDSKZgGkQU/6wXrb3kYgGgFwb3eWZ/NhwtSWf1CcL7fk/6z/DBg7+tLHTWK3uudV13krq4A9kl/0H2v2U1kXleJRve9oxPCeq6El63bN3FN3e4y+F109H5na1LqPhhZ2mnbJ71lLyGvnsf2K7Xxsyap9cMoSlOLtfU2/T0ctCQreK0HqUc2mLZOmEPZNakBNKQ+6jivZJ383bihZNoYtDdU+9k09bftdKCs+wT7op90Y2OETadeqe96a4HDCoPgA6vcd5lh5ftusUpqajGobN+nXumU9foAKyYFn1Q+APpH+25aew4kLG+C1mtbaqaLpuj/dQ8BNvJc328sE4Wh//uO2xx03iJVUFn/ae9VBPveddKE5rBj4m21NR9gJ4MfnmLBw2KHbzKlHIChaX3KP1Qyqk8+eFBh6X9rdOdTwtL7Pgv9vMANA/eEb7suRAdIDTTnyRCgEColCLd5D3CQIX2b0/9iPBYW4KX902H/Lunvcv6FpkwWS39MgAVwD2wL8lCRyDsP/P/I/jwPSDT/P3FxIeCUq5DiUx4yAuqA094WconpC3kEDIYi2mlXH5OvAsAQZzRAk7m7kJBjW0jJ4lXIyPEncNrvhFyKvAx55PgVipiDEPzFNHU9xl0UwdA3uQ1NcZ7w6E4LHugvDCWCJg3+Q82EExq/4tLTU94joxZRoro2dDU1Y2OrktTonA3DGKWpqJIlOntSVGPzC1HJuqzsJ3nl6eC1Ihj6JnfnH7HYCY9nbPyX7xeGEkEVwT+umWLywBs/X7ECeK+y0hwtsVevQ1dD+Niw6VVSo9PjGD1Lmgp5sSU6e1KkYc4vROSMbKrqk/K1tEqo426ubgWiFrql0nTDtPzF2OZzO67nMy6k0sY6H2dz+UKxVK5Ua/VGs9XudHv9wXA0nkxn88Vytd5sd/vDUUhYRFRMXEJSSlpGVk5eQVFJWUVVTV1DU0tbx4NHT56DTZN3p1r1OYr1UJyR8KMtSThDwB4ceEy7vhtA/z53vQRyRgPOcZcpn62RrSjm5yHDGnWIEi72tCQGfijA1UvuzapAJOCNWQg8q+ebfSaQ48npyOhqB/JAHB7NnZR6L7HxQOcvx5E03oqG+eTlj4+d/0plhcq1x1ky2eWImCcp2zIinbooxdejIg7malm5CYgvJpjn3TslD7uzZUlzNlBbiJXmmnBTHddiJZ/MIvH8dxnAOSls1X+IEe1yGWVoJAddIR7Laqj2ZNDk8yTcOGRn3VQrbkB9rpaEHuhC1KO+RjbUxQNhA8U2578E6a3ObPtRRNqk3xjRGfrFF+IVeuLFQDvh0PbCCA4HkVXnp71QUhd+5AoaQSGVI3hP1gbtY7MyYOtvsCqidYFtyEzyLjQH56ukDX8o5vxLJFUbpEFat1fgzo/E2OrPn1cDe/Dey4ajqBfcCBYjh9Ij5jLPotaGrOQKT7ZKPS1Mq8uLVFUssiDXg6pszkYRzq1eR0UmSANqKHp+PMxFyXh175IpcC/FTudqqhdi8SSKfRvj1kVIba7eGFzChOB7pTBZ1ZYbgUOBgMfEub162yC2Zbjb9Napq1Z3a2fQMpPbKtH6rRipWjXclpnW3xIXHq9+JSlN+IROUipMtruvWJMer5K6iJUDdhgvB3ArE5vQZF54giihYJWbtjTw1V8eJfrFnwroBw==') format('woff2'),
    url('iconfont.woff?t=1636374732434') format('woff'),
    url('iconfont.ttf?t=1636374732434') format('truetype'),
    url('iconfont.svg?t=1636374732434#iconfont') format('svg');
}

.iconfont {
    font-family: "iconfont" !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-icon_slot_auction:before {
    content: "\eca5";
}

.icon-homepage_academy_24:before {
    content: "\ebfe";
}

.icon-VK21:before {
    content: "\ec81";
}

.icon-assetanslysis:before {
    content: "\ec71";
}

.icon-ventures8:before {
    content: "\ec47";
}

.icon-naverblog:before {
    content: "\ec46";
}

.icon-zijinanquan:before {
    content: "\ec30";
}

.icon-anquan:before {
    content: "\ec0f";
}

.icon-kualianwangguan:before {
    content: "\ec10";
}

.icon-pianhao:before {
    content: "\ec11";
}

.icon-hua:before {
    content: "\ec12";
}

.icon-ti:before {
    content: "\ec13";
}

.icon-yaoqinghaoyou:before {
    content: "\ec14";
}

.icon-zhuanbi:before {
    content: "\ec15";
}

.icon-Affiliates:before {
    content: "\ec16";
}

.icon-API2:before {
    content: "\ec17";
}

.icon-Brokern:before {
    content: "\ec18";
}

.icon-deposit:before {
    content: "\ec19";
}

.icon-feeshouxufei:before {
    content: "\ec1a";
}

.icon-cloud:before {
    content: "\ec1b";
}

.icon-freebtc:before {
    content: "\ec1c";
}

.icon-okchain:before {
    content: "\ec1d";
}

.icon-happyFriday:before {
    content: "\ec1e";
}

.icon-jumpstart:before {
    content: "\ec1f";
}

.icon-overview:before {
    content: "\ec20";
}

.icon-status:before {
    content: "\ec21";
}

.icon-pool:before {
    content: "\ec23";
}

.icon-Subaccount:before {
    content: "\ec24";
}

.icon-Wallet:before {
    content: "\ec25";
}

.icon-Verification:before {
    content: "\ec26";
}

.icon-okb:before {
    content: "\ec27";
}

.icon-zichan:before {
    content: "\ec28";
}

.icon-monijiaoyi:before {
    content: "\ec29";
}

.icon-rewards:before {
    content: "\ec2a";
}

.icon-jiedai:before {
    content: "\ec2b";
}

.icon-orderCenter:before {
    content: "\ec2c";
}

.icon-qiepian1:before {
    content: "\ec0d";
}

.icon-logo_okex_footer:before {
    content: "\eb72";
}

.icon-Selected:before {
    content: "\e656";
}

.icon-Linkedin:before {
    content: "\e9a0";
}

.icon-biyong11:before {
    content: "\e9a1";
}

.icon-facebook2:before {
    content: "\e9a2";
}

.icon-medium2:before {
    content: "\e9b9";
}

.icon-Instagram:before {
    content: "\e9bb";
}

.icon-reddit1:before {
    content: "\e9bc";
}

.icon-youtube1:before {
    content: "\e9bd";
}

.icon-wechat2:before {
    content: "\e9be";
}

.icon-twitter2:before {
    content: "\e9bf";
}

.icon-telegram1:before {
    content: "\e9c0";
}

.icon-PressRoom:before {
    content: "\e9c1";
}

.icon-weibo1:before {
    content: "\e9c2";
}

.icon-blog1:before {
    content: "\e9c3";
}

.icon-line1:before {
    content: "\e9c4";
}

.icon-QQ:before {
    content: "\e9c5";
}

.icon-home_download:before {
    content: "\e7eb";
}

.icon-home_notice:before {
    content: "\e7ec";
}

.icon-home_support1:before {
    content: "\e7ee";
}

.icon-home_user:before {
    content: "\e7f1";
}

.icon-facebook:before {
    content: "\e602";
}

.icon-weibo:before {
    content: "\e604";
}

.icon-twitter:before {
    content: "\e605";
}

.icon-medium:before {
    content: "\e689";
}

.icon-ic_arrow:before {
    content: "\e978";
}

.icon-icon_user:before {
    content: "\e97e";
}

.icon-icon_hambergur:before {
    content: "\e97a";
}

.icon-icon_close:before {
    content: "\e97b";
}

.icon-icon_sign_out:before {
    content: "\e97c";
}

.icon-press:before {
    content: "\e970";
}

.icon-icon_more_1:before {
    content: "\e96c";
}

.icon-exclamation:before {
    content: "\e782";
}

.icon-arrowhead_right:before {
    content: "\e8e6";
}

.icon-home_language:before {
    content: "\e911";
}

.icon-ins:before {
    content: "\e94a";
}

.icon-facebook1:before {
    content: "\e743";
}

.icon-linkedin:before {
    content: "\e8ef";
}

.icon-medium1:before {
    content: "\e8f0";
}

.icon-line:before {
    content: "\e8f2";
}

.icon-biyong1:before {
    content: "\e8f3";
}

.icon-telegram:before {
    content: "\e8f4";
}

.icon-twitter1:before {
    content: "\e8f5";
}

.icon-youtube:before {
    content: "\e8f6";
}

.icon-reddit:before {
    content: "\e8f7";
}

.icon-wechat1:before {
    content: "\e902";
}

.icon-xinlang:before {
    content: "\e903";
}

.icon-Reddit:before {
    content: "\e693";
}

.icon-icon_community:before {
    content: "\e838";
}

.icon-exclamation-circle:before {
    content: "\e787";
}

.icon-cancel:before {
    content: "\e791";
}

.icon-backtothetop:before {
    content: "\e77d";
}

.icon-dialogue:before {
    content: "\e601";
}

.icon-spread:before {
    content: "\e6c4";
}

.icon-Unfold:before {
    content: "\e660";
}

.icon-Telegram:before {
    content: "\e694";
}

a, b, body, button, dd, div, dl, dt, em, fieldset, footer, form, h1, h2, h3, h4, h5, h6, header, html, i, img, input, li, ol, p, pre, select, span, strong, td, textarea, th, ul {
    margin: 0;
    padding: 0;
    font-size: 100%;
    -webkit-tap-highlight-color: transparent;
    -webkit-appearance: none
}

body, html {
    color: #000;
    background: #fff;
    font-size: 14px;
    line-height: 1;
    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
    user-select: text;
    -webkit-overflow-scrolling: touch;
    margin: 0;
    padding: 0;
    font-family: SF Pro Text, SF Pro Icons, Helvetica Neue, Helvetica, Arial, sans-serif;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
    -webkit-text-size-adjust: none;
    -moz-text-size-adjust: none;
    -ms-text-size-adjust: none;
    text-size-adjust: none
}

img, video {
    height: auto;
    max-width: 100%
}

iframe {
    border: 0
}

table {
    border-collapse: collapse;
    border-spacing: 0
}

h1, h2, h3, h4, h5, h6 {
    font-size: 1em;
    font-weight: 400
}

a {
    cursor: pointer
}

a, a:active, a:hover {
    text-decoration: none
}

a:active, a:hover {
    outline-width: 0
}

li, ol, ul {
    list-style: none
}

button, input, select, textarea {
    background-color: transparent;
    resize: none;
    border: none;
    outline: 0;
    -webkit-box-shadow: none;
    box-shadow: none;
    border-radius: 0;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none
}

button, fieldset, input, label, legend, option, select, textarea {
    font-size: 1em
}

input[type=number] {
    -moz-appearance: textfield
}

input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
    -webkit-appearance: none;
    margin: 0
}

b, em, i, strong {
    font-style: normal;
    font-weight: 400
}

body ::-webkit-scrollbar {
    width: 4px;
    height: 0;
    background-color: #f5f5f5
}

body ::-webkit-scrollbar-track {
    background-color: #fff
}

body ::-webkit-scrollbar-thumb {
    background-color: #d8dce6
}

body.theme-dark ::-webkit-scrollbar {
    background-color: #1b2436
}

body.theme-dark ::-webkit-scrollbar-track {
    -webkit-box-shadow: inset 0 0 4px #1b2436;
    background-color: #1b2436
}

body.theme-dark ::-webkit-scrollbar-thumb {
    -webkit-box-shadow: inset 0 0 4px rgba(220, 224, 232, .15);
    background-color: rgba(220, 224, 232, .15)
}

:root {
    --color-up: #2ead65;
    --color-down: #e35e5e
}

:root .cfg-red-up {
    --color-up: #e35e5e;
    --color-down: #2ead65
}

.theme-dark {
    --color-up: #2ead65;
    --color-down: #e35e5e
}

.theme-dark.cfg-red-up {
    --color-up: #e35e5e;
    --color-down: #2ead65
}

.theme-okcoin {
    --color-up: #2ead65;
    --color-down: #e35e5e
}

.theme-okcoin.cfg-red-up {
    --color-up: #e35e5e;
    --color-down: #2ead65
}

.entrance {
    position: fixed;
    right: 40px;
    bottom: 82px;
    width: 32px;
    color: #fff;
    font-size: 12px;
    z-index: 101
}

.entrance .wrapper {
    display: inline-block;
    height: 32px;
    width: 32px;
    border-radius: 50%;
    cursor: pointer;
    margin-top: 10px;
    background: #4e88f0 !important;
    text-align: center;
    line-height: 32px
}

.entrance .wrapper i {
    font-size: 20px
}

.entrance .im-chat {
    position: relative
}

.entrance .wrapper .red-dot {
    position: absolute;
    top: 5px;
    right: 5px;
    height: 8px;
    width: 8px;
    border-radius: 50%;
    background-color: #ef3031
}

.entrance .iconTipsService {
    background: url(/cdn/assets/imgs/MjAxODg/B174692CA36B9690CEDB586F6F32727E.png) 50% no-repeat scroll transparent;
    background-size: 60% 60%
}

.ok-global-float-layer {
    position: fixed;
    -webkit-transform: translateZ(0);
    transform: translateZ(0);
    width: 100%;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: end;
    justify-content: end;
    -webkit-box-orient: vertical;
    -webkit-box-direction: reverse;
    flex-direction: column-reverse;
    bottom: 0;
    z-index: 9400
}

.ok-global-float-layer.ok-global-float-layer-hide-all, .ok-global-float-layer.ok-global-float-layer-hide .ok-global-float-layer-box {
    display: none
}

.ok-global-float-layer .ok-global-float-layer-box {
    -webkit-box-flex: 1;
    flex-grow: 1
}

.ok-float-app-download {
    width: 100%;
    position: relative;
    z-index: 9400;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin-bottom: 12px;
    padding-left: 8px;
    padding-right: 8px
}

@media (min-width: 768px) {
    .ok-float-app-download {
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .ok-float-app-download {
        padding-left: calc((100% - 960px) / 2);
        padding-right: calc((100% - 960px) / 2)
    }
}

@media (min-width: 1270px) {
    .ok-float-app-download {
        padding-left: calc((100% - 1248px) / 2);
        padding-right: calc((100% - 1248px) / 2)
    }
}

.ok-float-app-download .okg-container {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding-left: 8px;
    padding-right: 8px
}

@media (min-width: 768px) {
    .ok-float-app-download .okg-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .ok-float-app-download .okg-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .ok-float-app-download .okg-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.ok-float-app-download .okg-container .app-box {
    padding: 12px 14px;
    display: -webkit-box;
    display: flex;
    border-radius: 6px;
    -webkit-box-align: center;
    align-items: center;
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    background: rgba(243, 245, 250, .9);
    position: relative
}

.ok-float-app-download .okg-container .app-box .app-logo {
    width: 36px;
    height: 36px;
    border-radius: 7px
}

.ok-float-app-download .okg-container .app-box .icon_app_logo {
    display: inline-block;
    width: 36px;
    height: 36px;
    background: url(/cdn/assets/okfe/seo-ex/6.10.11/home-icon.png?bce24c1c55a8c7314a2fc775323cf825=) -75px -75px/149px 111px no-repeat
}

.ok-float-app-download .okg-container .app-box .app-text {
    font-size: 14px;
    color: #000;
    font-weight: 500
}

.ok-float-app-download .okg-container .app-box .text-box {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-flex: 1;
    flex-grow: 1;
    color: #000;
    margin-left: 8px
}

.ok-float-app-download .okg-container .app-box .text-box .title {
    width: 46px
}

.ok-float-app-download .okg-container .app-box .text-box .desc {
    font-size: 12px;
    font-weight: 400;
    margin-top: 5px;
    color: #7b8293;
    max-width: 172px
}

.ok-float-app-download .okg-container .app-box .down-btn {
    width: 72px;
    min-height: 28px;
    line-height: 20px;
    font-size: 14px;
    color: #1f2533;
    background: #fff;
    border: 1px solid #d8dce6;
    font-weight: 500;
    border-radius: 2px;
    padding: 0 12px
}

.ok-float-app-download .okg-container .app-box .close-float-btn, .ok-float-app-download .okg-container .app-box .down-btn {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center
}

.ok-float-app-download .okg-container .app-box .close-float-btn {
    position: absolute;
    top: 0;
    right: 0;
    width: 15px;
    height: 15px
}

.ok-float-app-download .okg-container .app-box .icon-cancel {
    font-size: 12px;
    opacity: .2;
    -webkit-transform: scale(.85);
    transform: scale(.85)
}

@media (min-width: 768px) {
    .ok-float-app-download {
        display: none
    }
}

.ok-ip-kyc-container {
    background-color: #e4ecff
}

.ok-ip-kyc-container .ok-ip-kyc-okg {
    padding-left: 8px;
    padding-right: 8px
}

@media (min-width: 768px) {
    .ok-ip-kyc-container .ok-ip-kyc-okg {
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .ok-ip-kyc-container .ok-ip-kyc-okg {
        padding-left: calc((100% - 960px) / 2);
        padding-right: calc((100% - 960px) / 2)
    }
}

@media (min-width: 1270px) {
    .ok-ip-kyc-container .ok-ip-kyc-okg {
        padding-left: calc((100% - 1248px) / 2);
        padding-right: calc((100% - 1248px) / 2)
    }
}

.ok-ip-kyc-container .ok-ip-kyc-col {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding-left: 8px;
    padding-right: 8px
}

@media (min-width: 768px) {
    .ok-ip-kyc-container .ok-ip-kyc-col {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .ok-ip-kyc-container .ok-ip-kyc-col {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .ok-ip-kyc-container .ok-ip-kyc-col {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.ok-ip-kyc-container .ok-ip-kyc-box {
    padding-top: 40px;
    padding-bottom: 40px
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-checkbox {
    -webkit-box-ordinal-group: 2;
    order: 1;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    height: 20px
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-checkbox input:checked + label {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    cursor: pointer;
    color: #1f2533
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-checkbox input:checked + label span {
    position: relative;
    background-color: #2d60e0;
    border-color: #2d60e0
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-checkbox input:checked + label span:after {
    position: absolute;
    -webkit-transition: all .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
    transition: all .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
    content: " ";
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 5px;
    height: 8px;
    border: 2px solid #fff;
    border-top: 0;
    border-left: 0;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    background-color: transparent
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-checkbox label {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    height: 20px;
    cursor: pointer;
    color: #1f2533
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-checkbox label span {
    position: relative;
    display: inline-block;
    width: 16px;
    height: 16px;
    border: 1px solid #959dad;
    -webkit-box-shadow: 0 1px 2px 0 rgb(0 0 0);
    box-shadow: 0 1px 2px 0 rgb(0 0 0);
    cursor: pointer;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 3px;
    margin-right: 8px
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-chunk {
    display: -webkit-box;
    display: flex;
    -webkit-box-ordinal-group: 4;
    order: 3
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-chunk > div {
    -webkit-box-flex: 1;
    flex: 1
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-chunk #okIpKycVerify {
    margin-left: 16px
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-link {
    -webkit-box-ordinal-group: 3;
    order: 2
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-md {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-md > div {
    margin-top: 24px;
    -webkit-box-flex: 1;
    flex: 1;
    cursor: pointer
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-text {
    color: #205fec;
    font-size: 14px;
    line-height: 20px
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-btn {
    cursor: pointer;
    line-height: 40px;
    text-align: center;
    font-size: 14px;
    padding: 0 28px;
    border-radius: 4px
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-btn.primary {
    background-color: #2d60e0;
    color: #fff
}

.ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-btn.base {
    color: #3f475a;
    background-color: #fff;
    border: 1px solid #d8dce6
}

@media (min-width: 768px) {
    .ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-checkbox, .ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-checkbox label {
        height: 40px
    }

    .ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-chunk {
        display: -webkit-box;
        display: flex;
        -webkit-box-ordinal-group: 3;
        order: 2
    }

    .ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-chunk > div {
        -webkit-box-flex: unset;
        flex: unset
    }

    .ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-chunk #okIpKycVerify {
        margin-left: 24px
    }

    .ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-link {
        -webkit-box-ordinal-group: 4;
        order: 3
    }

    .ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-md {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        margin-top: 24px;
        -webkit-box-align: center;
        align-items: center;
        -webkit-box-pack: initial;
        justify-content: normal
    }

    .ok-ip-kyc-container .ok-ip-kyc-box .ok-ip-kyc-md > div {
        margin-right: 24px;
        margin-top: unset;
        -webkit-box-flex: unset;
        flex: unset
    }
}

.web-dialog-mask {
    position: fixed;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .3);
    z-index: 9980
}

.web-dialog-mask * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.web-dialog-mask .okg-container {
    padding-left: 8px;
    padding-right: 8px
}

@media (min-width: 768px) {
    .web-dialog-mask .okg-container {
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .web-dialog-mask .okg-container {
        padding-left: calc((100% - 960px) / 2);
        padding-right: calc((100% - 960px) / 2)
    }
}

@media (min-width: 1270px) {
    .web-dialog-mask .okg-container {
        padding-left: calc((100% - 1248px) / 2);
        padding-right: calc((100% - 1248px) / 2)
    }
}

.web-dialog-mask .dialog-wrapper {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding-left: 8px;
    padding-right: 8px;
    position: absolute;
    bottom: 16px
}

@media (min-width: 768px) {
    .web-dialog-mask .dialog-wrapper {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .web-dialog-mask .dialog-wrapper {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .web-dialog-mask .dialog-wrapper {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.web-dialog-mask .dialog-wrapper .dialog-window {
    display: -webkit-box;
    display: flex;
    max-height: 75vh;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    background: #fff;
    position: relative;
    border-radius: 4px;
    color: #000;
    overflow: hidden
}

.web-dialog-mask .dialog-wrapper .dialog-window .dialog-top {
    flex-shrink: 0;
    height: 30px;
    line-height: 30px;
    position: relative;
    display: -webkit-box;
    display: flex
}

.web-dialog-mask .dialog-wrapper .dialog-window .dialog-top .top-content {
    -webkit-box-flex: 1;
    flex-grow: 1
}

.web-dialog-mask .dialog-wrapper .dialog-window .dialog-top .web-dialog-close-btn {
    height: 100%;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    margin-right: 16px;
    cursor: pointer;
    font-size: 22px;
    color: rgba(43, 46, 61, .25);
    z-index: 1
}

.web-dialog-mask .dialog-wrapper .dialog-window .dialog-box {
    overflow: auto;
    position: relative;
    padding: 0 16px
}

.web-dialog-mask .dialog-wrapper .dialog-window .dialog-box .dialog-content {
    position: relative
}

.web-dialog-mask .dialog-wrapper .dialog-window .dialog-box .link {
    color: #2d60e0
}

.web-dialog-mask .dialog-wrapper .dialog-window .dialog-box .tips-icon {
    height: 48px;
    display: inline-block;
    width: 48px;
    background: rgba(255, 155, 0, .1);
    border-radius: 50%;
    line-height: 48px;
    text-align: center;
    margin-bottom: 16px
}

.web-dialog-mask .dialog-wrapper .dialog-window .dialog-box .tips-icon .icon {
    font-size: 32px;
    color: #ff9b00
}

.web-dialog-mask .dialog-wrapper .dialog-window .btn-box {
    flex-shrink: 0;
    text-align: center;
    padding: 32px 16px 20px
}

.web-dialog-mask .dialog-wrapper .dialog-window .btn-box .web-dialog-confirm-btn {
    width: 100%;
    height: 48px;
    font-size: 16px;
    line-height: 16px;
    padding: 16px;
    font-weight: 500;
    color: #fff;
    background: #2d60e0;
    border-radius: 2px;
    cursor: pointer
}

.web-dialog-mask .dialog-wrapper .dialog-window .btn-box .web-dialog-confirm-btn.disabled {
    cursor: no-drop;
    color: #999;
    background: #f7f7f7;
    border: 1px solid #d9d9d9
}

.web-dialog-mask .dialog-wrapper .dialog-window .btn-box .err-info.hide-error {
    display: none
}

@media (min-width: 768px) {
    .web-dialog-mask .okg-container {
        width: auto
    }

    .web-dialog-mask .dialog-wrapper {
        width: 460px;
        min-width: 380px;
        position: absolute;
        bottom: auto;
        top: 50%;
        left: 50%;
        -webkit-transform: translate(-50%, -50%);
        transform: translate(-50%, -50%)
    }

    .web-dialog-mask .dialog-wrapper .dialog-window {
        max-height: unset
    }

    .web-dialog-mask .dialog-wrapper .dialog-window .dialog-top {
        height: 40px
    }

    .web-dialog-mask .dialog-wrapper .dialog-window .dialog-box {
        flex-shrink: 0;
        padding: 0 24px
    }

    .web-dialog-mask .dialog-wrapper .dialog-window .btn-box {
        padding: 24px
    }

    .web-dialog-mask .dialog-wrapper .dialog-window .btn-box .web-dialog-confirm-btn {
        height: 36px;
        padding: 10px 16px;
        line-height: 16px;
        width: auto;
        min-width: 120px
    }
}

.web-dialog-mask.global-tips-dialog .dialog-wrapper .dialog-window .dialog-box .dialog-content .content-box {
    text-align: center
}

.web-dialog-mask.global-tips-dialog .dialog-wrapper .dialog-window .dialog-box .dialog-content .content-box .content-info {
    font-size: 14px;
    font-weight: 400;
    color: #3f475a;
    line-height: 24px
}

.web-dialog-mask.global-tips-dialog .dialog-wrapper .dialog-window .dialog-box .dialog-content .content-box .checkbox-tip {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    height: 24px;
    margin-top: 16px;
    text-align: left
}

.web-dialog-mask.global-tips-dialog .dialog-wrapper .dialog-window .dialog-box .dialog-content .content-box .checkbox-tip .check-label {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center
}

.web-dialog-mask.global-tips-dialog .dialog-wrapper .dialog-window .dialog-box .dialog-content .content-box .checkbox-tip .checkbox[type=checkbox] {
    border: 1px solid #d9d9d9;
    border-radius: 3px;
    display: inline-block;
    position: relative;
    width: 14px;
    height: 14px;
    cursor: pointer
}

.web-dialog-mask.global-tips-dialog .dialog-wrapper .dialog-window .dialog-box .dialog-content .content-box .checkbox-tip .checkbox[type=checkbox]:checked {
    background-color: #3075ee;
    border: 0
}

.web-dialog-mask.global-tips-dialog .dialog-wrapper .dialog-window .dialog-box .dialog-content .content-box .checkbox-tip .checkbox[type=checkbox]:checked:after {
    position: absolute;
    top: 1px;
    left: 4px;
    width: 4px;
    height: 8px;
    border-color: #fff;
    border-style: solid;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    content: ""
}

.web-dialog-mask.global-tips-dialog .dialog-wrapper .dialog-window .dialog-box .dialog-content .content-box .checkbox-tip .check-desc {
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, .85);
    line-height: 21px;
    margin-left: 6px
}

.pisces-container {
    position: fixed;
    height: 30px;
    bottom: 80px;
    right: 0;
    color: #fff;
    font-weight: 700;
    z-index: 1000000;
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
    line-height: 30px;
    background: rgba(69, 157, 245, .6);
    padding: 0 10px 2px
}

.pisces-container .ghost-btn {
    color: #459df5;
    display: inline-block;
    margin-left: 10px;
    font-size: 12px;
    height: 18px;
    line-height: 18px;
    cursor: pointer;
    background: #f1e9e9;
    padding: 1px 5px;
    border-radius: 2px
}

.guide-to-app {
    position: fixed;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    z-index: 20000;
    background: url(/cdn/assets/imgs/218/C94D91FFF6F90415.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #fff
}

.guide-logo {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100px;
    height: 100px;
    border-radius: 36px;
    margin: 20% auto 10px;
    background: url(/cdn/assets/imgs/218/200396215BA8A776.png);
    background-size: 70px 70px;
    background-repeat: no-repeat;
    background-position: 50%;
    background-color: #fff;
    -webkit-box-shadow: 0 1px 4px rgba(26, 81, 203, .04), 0 16px 32px rgba(97, 110, 139, .12);
    box-shadow: 0 1px 4px rgba(26, 81, 203, .04), 0 16px 32px rgba(97, 110, 139, .12)
}

.guide-title {
    font-weight: 600;
    font-size: 24px;
    line-height: 28px;
    text-align: center;
    color: #1f2933;
    margin-bottom: 16px
}

.guide-desc {
    font-size: 16px;
    line-height: 24px;
    text-align: center;
    color: #60687b;
    padding: 0 30px
}

.guide-button {
    position: absolute;
    bottom: 50px;
    left: 0;
    width: 100%;
    padding: 32px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.guide-button-common {
    width: 100%;
    height: 48px;
    border-radius: 4px;
    font-size: 16px;
    line-height: 48px;
    text-align: center
}

.guide-button-primary {
    margin-top: 40%;
    color: #fff;
    background: #205fec;
    margin-bottom: 16px
}

.guide-button-second {
    border: 1px solid #f0f3f7;
    color: #3f475a
}

.web-dialog-mask.dnsSwitch-dialog {
    z-index: 8999
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper {
    width: 528px
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .okg-container {
    padding-left: 0;
    padding-right: 0
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dialog-top {
    height: 28px
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dialog-top .web-dialog-close-btn {
    display: none
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dialog-box {
    padding: 0
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .btn-box {
    display: none
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-info {
    padding: 0 40px
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-title {
    font-size: 16px;
    font-weight: 500;
    color: rgba(0, 0, 0, .85);
    line-height: 24px;
    text-align: center;
    margin-bottom: 4px
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-desc {
    width: 330px;
    margin: 0 auto 20px;
    font-size: 12px;
    font-weight: 400;
    color: #4f5669;
    line-height: 18px;
    text-align: center
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-content {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-content .main-box {
    width: 202px;
    margin-right: 24px
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-content .main-box:last-child {
    margin-right: 0
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-content .main-box .img-box {
    width: 56px;
    height: 56px;
    margin: 0 auto
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-content .main-box .img-box img {
    height: 100%;
    width: 100%
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-content .main-box .title {
    font-size: 16px;
    font-weight: 500;
    color: #3f475a;
    line-height: 20px;
    margin: 12px 0 7px;
    text-align: center
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-content .main-box .btn {
    font-size: 12px;
    font-weight: 500;
    color: #fff;
    line-height: 16px;
    padding: 6px 16px;
    background: #3075ee;
    border-radius: 2px;
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    margin: 0 auto;
    cursor: pointer;
    display: block;
    text-align: center
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-content .main-box .change-link {
    font-size: 12px;
    font-weight: 500;
    color: #3075ee;
    line-height: 16px;
    text-align: center;
    display: block;
    padding-top: 6px
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-btn {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    padding: 16px;
    border-top: 1px solid #e9ebf2;
    margin-top: 24px
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-btn .btn {
    font-size: 14px;
    font-weight: 400;
    min-width: 202px;
    height: 36px;
    border-radius: 2px;
    line-height: 36px;
    text-align: center;
    cursor: pointer;
    padding: 0 6px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-btn .cancel-btn {
    color: #3075ee;
    border: 1px solid #3075ee;
    margin-right: 24px;
    background: #fff
}

.web-dialog-mask.dnsSwitch-dialog .dialog-wrapper .dialog-window .dns-btn .confirm-btn {
    color: #fff;
    background: #3075ee;
    border: 1px solid #3075ee
}

:root {
    --okd-icon-size-base: 18px;
    --okd-icon-size-xs: 14px;
    --okd-color-gray-050: #f7f9fc;
    --okd-color-gray-100: #f0f3f7;
    --okd-color-gray-200: #d8dce6;
    --okd-color-gray-300: #aab1bf;
    --okd-color-gray-400: #959dad;
    --okd-color-gray-500: #60687b;
    --okd-color-gray-600: #4f5669;
    --okd-color-gray-700: #404859;
    --okd-color-gray-800: #353946;
    --okd-color-gray-900: #1d2023;
    --okd-color-blue-050: #edf2fc;
    --okd-color-blue-100: #e0eeff;
    --okd-color-blue-200: #d3e4ff;
    --okd-color-blue-300: #b8d3ff;
    --okd-color-blue-400: #6e97ff;
    --okd-color-blue-500: #5281f9;
    --okd-color-blue-600: #3c6fef;
    --okd-color-blue-700: #205fec;
    --okd-color-blue-800: #2450be;
    --okd-color-blue-900: #1e429c;
    --okd-color-green-050: #e6fff1;
    --okd-color-green-100: #d2f9e3;
    --okd-color-green-200: #bef4d5;
    --okd-color-green-300: #9ce6bc;
    --okd-color-green-400: #7dd8a5;
    --okd-color-green-500: #5ec98d;
    --okd-color-green-600: #46be7a;
    --okd-color-green-700: #2ead65;
    --okd-color-green-800: #259857;
    --okd-color-green-900: #1d8148;
    --okd-color-red-050: #ffe7e7;
    --okd-color-red-100: #ffdfdf;
    --okd-color-red-200: #ffd6d6;
    --okd-color-red-300: #ffc1c1;
    --okd-color-red-400: #ffa9a9;
    --okd-color-red-500: #fb9191;
    --okd-color-red-600: #f17878;
    --okd-color-red-700: #e35e5e;
    --okd-color-red-800: #c04343;
    --okd-color-red-900: #9c2c2c;
    --okd-color-orange-050: #fff1e5;
    --okd-color-orange-100: #ffe9d6;
    --okd-color-orange-200: #ffe1c7;
    --okd-color-orange-300: #ffcfa5;
    --okd-color-orange-400: #febe86;
    --okd-color-orange-500: #faab66;
    --okd-color-orange-600: #f7984a;
    --okd-color-orange-700: #f3882b;
    --okd-color-orange-800: #c67024;
    --okd-color-orange-900: #99581e;
    --okd-color-yellow-050: #fffae5;
    --okd-color-yellow-100: #fff9d6;
    --okd-color-yellow-200: #fff8c7;
    --okd-color-yellow-300: #fff2a8;
    --okd-color-yellow-400: #ffe985;
    --okd-color-yellow-500: #ffde66;
    --okd-color-yellow-600: #f6cd43;
    --okd-color-yellow-700: #e8bb26;
    --okd-color-yellow-800: #c09d21;
    --okd-color-yellow-900: #967c1d;
    --okd-color-text-white: #fff;
    --okd-color-text-black: #1f2933;
    --okd-color-background-1: #fff;
    --okd-color-background-2: #f7f9fc;
    --okd-color-transparent: transparent;
    --okd-color-white: #fff;
    --okd-color-black: #000;
    --okd-color-line-muted: #f0f3f7;
    --okd-color-line-secondary: #d8dce6;
    --okd-color-line-amplifed: #959dad;
    --okd-color-text-lighter: #aab1bf;
    --okd-color-text-light: #959dad;
    --okd-color-text-secondary: #3f475a;
    --okd-color-text-amplifed: #1d2023;
    --okd-color-background-3: #fff;
    --okd-pagination-simple-default-text-color: --okd-color-text-amplifed;
    --okd-pagination-simple-default-line-height: --okd-line-height-base;
    --okd-font-size-base: 16px;
    --okd-font-size-md: 14px;
    --okd-font-size-xs: 12px;
    --okd-line-height-base: 20px;
    --okd-line-height-md: 20px;
    --okd-line-height-xs: 16px;
    --okd-shadow-none: 0 0 0 0 transparent;
    --okd-shadow-xs: 0 0 0 1px #0000000d;
    --okd-shadow-sm: 0 1px 2px 0 #0000000d;
    --okd-shadow-default: 0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;
    --okd-shadow-md: 0 4px 6px -1px #0000001a, 0 2px 4px -1px #0000000f;
    --okd-shadow-lg: 0 10px 15px -3px #0000001a, 0 4px 6px -2px #0000000d;
    --okd-shadow-xl: 0 20px 25px -5px #0000001a, 0 10px 10px -5px #0000000a;
    --okd-shadow-2xl: 0 25px 50px -12px #00000040;
    --okd-border-radius-none: 0;
    --okd-border-radius-sm: 2px;
    --okd-border-radius-md: 4px;
    --okd-border-radius-lg: 6px;
    --okd-border-radius-xl: 8px;
    --okd-border-radius-xxl: 10px;
    --okd-border-radius-xxxl: 12px;
    --okd-text-display-lg-font-size: 56px;
    --okd-text-display-lg-font-weight: 500;
    --okd-text-display-lg-line-height: 1.32;
    --okd-text-display-md-font-size: 40px;
    --okd-text-display-md-font-weight: 500;
    --okd-text-display-md-line-height: 52px;
    --okd-text-display-sm-font-size: 40px;
    --okd-text-display-sm-font-weight: 500;
    --okd-text-display-sm-line-height: 52px;
    --okd-text-heading-lg-font-size: 30px;
    --okd-text-heading-lg-font-weight: 500;
    --okd-text-heading-lg-line-height: 40px;
    --okd-text-heading-md-font-size: 24px;
    --okd-text-heading-md-font-weight: 500;
    --okd-text-heading-md-line-height: 30px;
    --okd-text-heading-sm-font-size: 18px;
    --okd-text-heading-sm-font-weight: 500;
    --okd-text-heading-sm-line-height: 24px;
    --okd-text-heading-xl-font-size: 36px;
    --okd-text-heading-xl-line-height: 1.32;
    --okd-text-heading-xl-font-weight: 600;
    --okd-text-heading-xxl-font-size: 40px;
    --okd-text-heading-xxl-line-height: 1.32;
    --okd-text-heading-xxl-font-weight: 600;
    --okd-text-heading-overline-font-size: 12px;
    --okd-text-heading-overline-line-height: 15px;
    --okd-text-heading-overline-font-weight: 500;
    --okd-text-body-sm-regular-font-size: 14px;
    --okd-text-body-sm-regular-font-weight: 400;
    --okd-text-body-sm-regular-line-height: 21px;
    --okd-text-body-sm-bold-font-size: 14px;
    --okd-text-body-sm-bold-font-weight: 500;
    --okd-text-body-sm-bold-line-height: 21px;
    --okd-text-body-md-regular-font-size: 16px;
    --okd-text-body-md-regular-font-weight: 400;
    --okd-text-body-md-regular-line-height: 24px;
    --okd-text-body-md-bold-font-size: 16px;
    --okd-text-body-md-bold-font-weight: 500;
    --okd-text-body-md-bold-line-height: 24px;
    --okd-text-body-xs-regular-font-size: 12px;
    --okd-text-body-xs-regular-font-weight: 400;
    --okd-text-body-xs-regular-line-height: 18px;
    --okd-text-body-xs-bold-font-size: 12px;
    --okd-text-body-xs-bold-font-weight: 500;
    --okd-text-body-xs-bold-line-height: 18px;
    --okd-alert-normal-background: var(--okd-color-gray-050);
    --okd-alert-normal-title-color: var(--okd-color-gray-900);
    --okd-alert-normal-icon-color: var(--okd-color-gray-700);
    --okd-alert-normal-desc-color: var(--okd-color-gray-800);
    --okd-alert-normal-action-color: var(--okd-color-gray-900);
    --okd-alert-normal-link-color: var(--okd-color-gray-900);
    --okd-alert-normal-accent-color: var(--okd-color-gray-700);
    --okd-alert-success-background: var(--okd-color-green-050);
    --okd-alert-success-title-color: var(--okd-color-green-900);
    --okd-alert-success-icon-color: var(--okd-color-green-700);
    --okd-alert-success-desc-color: var(--okd-color-green-800);
    --okd-alert-success-action-color: var(--okd-color-green-900);
    --okd-alert-success-link-color: var(--okd-color-green-900);
    --okd-alert-success-accent-color: var(--okd-color-green-700);
    --okd-alert-info-background: var(--okd-color-blue-050);
    --okd-alert-info-title-color: var(--okd-color-blue-900);
    --okd-alert-info-icon-color: var(--okd-color-blue-700);
    --okd-alert-info-desc-color: var(--okd-color-blue-800);
    --okd-alert-info-action-color: var(--okd-color-blue-900);
    --okd-alert-info-link-color: var(--okd-color-blue-900);
    --okd-alert-info-accent-color: var(--okd-color-blue-700);
    --okd-alert-warn-background: var(--okd-color-yellow-050);
    --okd-alert-warn-title-color: var(--okd-color-yellow-900);
    --okd-alert-warn-icon-color: var(--okd-color-yellow-700);
    --okd-alert-warn-desc-color: var(--okd-color-yellow-800);
    --okd-alert-warn-action-color: var(--okd-color-yellow-900);
    --okd-alert-warn-link-color: var(--okd-color-yellow-900);
    --okd-alert-warn-accent-color: var(--okd-color-yellow-700);
    --okd-alert-error-background: var(--okd-color-red-050);
    --okd-alert-error-title-color: var(--okd-color-red-900);
    --okd-alert-error-icon-color: var(--okd-color-red-700);
    --okd-alert-error-desc-color: var(--okd-color-red-800);
    --okd-alert-error-action-color: var(--okd-color-red-900);
    --okd-alert-error-link-color: var(--okd-color-red-900);
    --okd-alert-error-accent-color: var(--okd-color-red-700);
    --okd-alert-box-padding-vertical: 16px;
    --okd-alert-box-padding-horizontal: 18px;
    --okd-alert-box-border-radius: 4px;
    --okd-alert-accent-width: 4px;
    --okd-alert-title-font-size: var(--okd-font-size-md);
    --okd-alert-title-line-height: var(--okd-line-height-md);
    --okd-alert-text-font-size: var(--okd-font-size-md);
    --okd-alert-text-line-height: var(--okd-line-height-md);
    --okd-alert-action-font-size: var(--okd-font-size-md);
    --okd-alert-action-line-height: var(--okd-line-height-md);
    --okd-avatar-default-background: var(--okd-color-gray-200);
    --okd-avatar-xs-font-size: var(--okd-font-size-xs);
    --okd-avatar-xs-line-height: var(--okd-line-height-xs);
    --okd-avatar-xs-size: 24px;
    --okd-avatar-sm-font-size: var(--okd-font-size-xs);
    --okd-avatar-sm-line-height: var(--okd-line-height-xs);
    --okd-avatar-sm-size: 32px;
    --okd-avatar-md-font-size: 18px;
    --okd-avatar-md-line-height: 24px;
    --okd-avatar-md-size: 40px;
    --okd-avatar-lg-font-size: 18px;
    --okd-avatar-lg-line-height: 24px;
    --okd-avatar-lg-size: 56px;
    --okd-avatar-xl-font-size: 30px;
    --okd-avatar-xl-line-height: 96px;
    --okd-avatar-xl-size: 96px;
    --okd-avatar-border-color: var(--okd-color-gray-300);
    --okd-badge-grey-background: var(--okd-color-gray-100);
    --okd-badge-grey-text-color: var(--okd-color-gray-800);
    --okd-badge-grey-delete-color: var(--okd-color-gray-500);
    --okd-badge-green-background: var(--okd-color-green-100);
    --okd-badge-green-text-color: var(--okd-color-green-800);
    --okd-badge-green-delete-color: var(--okd-color-gray-500);
    --okd-badge-red-background: var(--okd-color-red-100);
    --okd-badge-red-text-color: var(--okd-color-red-800);
    --okd-badge-red-delete-color: var(--okd-color-gray-500);
    --okd-badge-yellow-background: var(--okd-color-yellow-100);
    --okd-badge-yellow-text-color: var(--okd-color-yellow-800);
    --okd-badge-yellow-delete-color: var(--okd-color-gray-500);
    --okd-badge-orange-background: var(--okd-color-orange-100);
    --okd-badge-orange-text-color: var(--okd-color-orange-800);
    --okd-badge-orange-delete-color: var(--okd-color-gray-500);
    --okd-badge-blue-background: var(--okd-color-blue-100);
    --okd-badge-blue-text-color: var(--okd-color-blue-800);
    --okd-badge-blue-delete-color: var(--okd-color-gray-500);
    --okd-badge-md-padding-vertical: 2px;
    --okd-badge-md-padding-horizontal: 8px;
    --okd-badge-lg-padding-vertical: 3px;
    --okd-badge-lg-padding-horizontal: 12px;
    --okd-badge-md-font-size: var(--okd-font-size-xs);
    --okd-badge-lg-font-size: var(--okd-font-size-md);
    --okd-badge-md-line-height: var(--okd-line-height-xs);
    --okd-badge-lg-line-height: var(--okd-line-height-base);
    --okd-badge-basic-md-radius: var(--okd-border-radius-xxl);
    --okd-badge-basic-lg-radius: var(--okd-border-radius-xxxl);
    --okd-badge-rounded-md-radius: var(--okd-border-radius-md);
    --okd-badge-rounded-lg-radius: var(--okd-border-radius-md);
    --okd-button-primary-normal-default-background: var(--okd-color-blue-700);
    --okd-button-primary-normal-hover-background: var(--okd-color-blue-500);
    --okd-button-primary-normal-active-background: var(--okd-color-blue-800);
    --okd-button-primary-normal-focus-background: var(--okd-color-blue-700);
    --okd-button-primary-normal-disabled-background: var(--okd-color-gray-100);
    --okd-button-primary-normal-default-border-color: var(--okd-color-blue-700);
    --okd-button-primary-normal-hover-border-color: var(--okd-color-blue-500);
    --okd-button-primary-normal-active-border-color: var(--okd-color-blue-800);
    --okd-button-primary-normal-focus-border-color: var(--okd-color-blue-700);
    --okd-button-primary-normal-disabled-border-color: var(--okd-color-gray-100);
    --okd-button-primary-normal-default-font-color: var(--okd-color-text-white);
    --okd-button-primary-normal-hover-font-color: var(--okd-color-text-white);
    --okd-button-primary-normal-active-font-color: var(--okd-color-text-white);
    --okd-button-primary-normal-focus-font-color: var(--okd-color-text-white);
    --okd-button-primary-normal-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-primary-normal-default-icon-color: var(--okd-color-text-white);
    --okd-button-primary-normal-hover-icon-color: var(--okd-color-text-white);
    --okd-button-primary-normal-active-icon-color: var(--okd-color-text-white);
    --okd-button-primary-normal-focus-icon-color: var(--okd-color-text-white);
    --okd-button-primary-normal-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-primary-normal-default-shadow: var(--okd-shadow-none);
    --okd-button-primary-normal-hover-shadow: var(--okd-shadow-none);
    --okd-button-primary-normal-active-shadow: var(--okd-shadow-none);
    --okd-button-primary-normal-focus-shadow: var(--okd-shadow-sm), 0px 0px 0px 3px rgba(211, 228, 255, 45%);
    --okd-button-primary-normal-disabled-shadow: var(--okd-shadow-none);
    --okd-button-primary-normal-loader-track-color: var(--okd-color-blue-500);
    --okd-button-primary-normal-loader-mark-color: var(--okd-color-white);
    --okd-button-primary-red-default-background: var(--okd-color-red-700);
    --okd-button-primary-red-hover-background: var(--okd-color-red-500);
    --okd-button-primary-red-active-background: var(--okd-color-red-800);
    --okd-button-primary-red-focus-background: var(--okd-color-red-700);
    --okd-button-primary-red-disabled-background: var(--okd-color-gray-100);
    --okd-button-primary-red-default-border-color: var(--okd-color-red-700);
    --okd-button-primary-red-hover-border-color: var(--okd-color-red-500);
    --okd-button-primary-red-active-border-color: var(--okd-color-red-800);
    --okd-button-primary-red-focus-border-color: var(--okd-color-red-800);
    --okd-button-primary-red-disabled-border-color: var(--okd-color-gray-100);
    --okd-button-primary-red-default-font-color: var(--okd-color-text-white);
    --okd-button-primary-red-hover-font-color: var(--okd-color-text-white);
    --okd-button-primary-red-active-font-color: var(--okd-color-text-white);
    --okd-button-primary-red-focus-font-color: var(--okd-color-text-white);
    --okd-button-primary-red-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-primary-red-default-icon-color: var(--okd-color-text-white);
    --okd-button-primary-red-hover-icon-color: var(--okd-color-text-white);
    --okd-button-primary-red-active-icon-color: var(--okd-color-text-white);
    --okd-button-primary-red-focus-icon-color: var(--okd-color-text-white);
    --okd-button-primary-red-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-primary-red-default-shadow: var(--okd-shadow-sm);
    --okd-button-primary-red-hover-shadow: var(--okd-shadow-none);
    --okd-button-primary-red-active-shadow: var(--okd-shadow-none);
    --okd-button-primary-red-focus-shadow: var(--okd-shadow-sm), 0px 0px 0px 3px rgba(255, 193, 193, 45%);
    --okd-button-primary-red-disabled-shadow: var(--okd-shadow-none);
    --okd-button-primary-red-loader-track-color: var(--okd-color-red-500);
    --okd-button-primary-red-loader-mark-color: var(--okd-color-white);
    --okd-button-primary-green-default-background: var(--okd-color-green-700);
    --okd-button-primary-green-hover-background: var(--okd-color-green-500);
    --okd-button-primary-green-active-background: var(--okd-color-green-800);
    --okd-button-primary-green-focus-background: var(--okd-color-green-700);
    --okd-button-primary-green-disabled-background: var(--okd-color-gray-100);
    --okd-button-primary-green-default-border-color: var(--okd-color-green-700);
    --okd-button-primary-green-hover-border-color: var(--okd-color-green-500);
    --okd-button-primary-green-active-border-color: var(--okd-color-green-800);
    --okd-button-primary-green-focus-border-color: var(--okd-color-green-700);
    --okd-button-primary-green-disabled-border-color: var(--okd-color-gray-100);
    --okd-button-primary-green-default-font-color: var(--okd-color-text-white);
    --okd-button-primary-green-hover-font-color: var(--okd-color-text-white);
    --okd-button-primary-green-active-font-color: var(--okd-color-text-white);
    --okd-button-primary-green-focus-font-color: var(--okd-color-text-white);
    --okd-button-primary-green-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-primary-green-default-icon-color: var(--okd-color-text-white);
    --okd-button-primary-green-hover-icon-color: var(--okd-color-text-white);
    --okd-button-primary-green-active-icon-color: var(--okd-color-text-white);
    --okd-button-primary-green-focus-icon-color: var(--okd-color-text-white);
    --okd-button-primary-green-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-primary-green-default-shadow: var(--okd-shadow-sm);
    --okd-button-primary-green-hover-shadow: var(--okd-shadow-none);
    --okd-button-primary-green-active-shadow: var(--okd-shadow-none);
    --okd-button-primary-green-focus-shadow: var(--okd-shadow-sm), 0px 0px 0px 3px rgba(156, 230, 188, 45%);
    --okd-button-primary-green-disabled-shadow: var(--okd-shadow-none);
    --okd-button-primary-green-loader-track-color: var(--okd-color-green-500);
    --okd-button-primary-green-loader-mark-color: var(--okd-color-white);
    --okd-button-secondary-normal-default-background: var(--okd-color-blue-100);
    --okd-button-secondary-normal-hover-background: var(--okd-color-blue-050);
    --okd-button-secondary-normal-active-background: var(--okd-color-blue-200);
    --okd-button-secondary-normal-focus-background: var(--okd-color-blue-100);
    --okd-button-secondary-normal-disabled-background: var(--okd-color-gray-100);
    --okd-button-secondary-normal-default-border-color: var(--okd-color-blue-100);
    --okd-button-secondary-normal-hover-border-color: var(--okd-color-blue-050);
    --okd-button-secondary-normal-active-border-color: var(--okd-color-blue-200);
    --okd-button-secondary-normal-focus-border-color: var(--okd-color-blue-100);
    --okd-button-secondary-normal-disabled-border-color: var(--okd-color-gray-100);
    --okd-button-secondary-normal-default-font-color: var(--okd-color-blue-800);
    --okd-button-secondary-normal-hover-font-color: var(--okd-color-blue-800);
    --okd-button-secondary-normal-active-font-color: var(--okd-color-blue-800);
    --okd-button-secondary-normal-focus-font-color: var(--okd-color-blue-800);
    --okd-button-secondary-normal-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-secondary-normal-default-icon-color: var(--okd-color-blue-700);
    --okd-button-secondary-normal-hover-icon-color: var(--okd-color-blue-700);
    --okd-button-secondary-normal-active-icon-color: var(--okd-color-blue-700);
    --okd-button-secondary-normal-focus-icon-color: var(--okd-color-blue-700);
    --okd-button-secondary-normal-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-secondary-normal-default-shadow: var(--okd-shadow-none);
    --okd-button-secondary-normal-hover-shadow: var(--okd-shadow-none);
    --okd-button-secondary-normal-active-shadow: var(--okd-shadow-none);
    --okd-button-secondary-normal-focus-shadow: 0px 0px 0px 3px rgba(211, 228, 255, 0.45);
    --okd-button-secondary-normal-disabled-shadow: var(--okd-shadow-none);
    --okd-button-secondary-normal-loader-track-color: var(--okd-color-blue-050);
    --okd-button-secondary-normal-loader-mark-color: var(--okd-color-blue-700);
    --okd-button-secondary-grey-default-background: var(--okd-color-gray-100);
    --okd-button-secondary-grey-hover-background: var(--okd-color-gray-050);
    --okd-button-secondary-grey-active-background: var(--okd-color-gray-200);
    --okd-button-secondary-grey-focus-background: var(--okd-color-gray-100);
    --okd-button-secondary-grey-disabled-background: var(--okd-color-gray-050);
    --okd-button-secondary-grey-default-border-color: var(--okd-color-gray-100);
    --okd-button-secondary-grey-hover-border-color: var(--okd-color-gray-050);
    --okd-button-secondary-grey-active-border-color: var(--okd-color-gray-200);
    --okd-button-secondary-grey-focus-border-color: var(--okd-color-gray-100);
    --okd-button-secondary-grey-disabled-border-color: var(--okd-color-gray-050);
    --okd-button-secondary-grey-default-font-color: var(--okd-color-gray-700);
    --okd-button-secondary-grey-hover-font-color: var(--okd-color-gray-700);
    --okd-button-secondary-grey-active-font-color: var(--okd-color-gray-700);
    --okd-button-secondary-grey-focus-font-color: var(--okd-color-gray-700);
    --okd-button-secondary-grey-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-secondary-grey-default-icon-color: var(--okd-color-gray-700);
    --okd-button-secondary-grey-hover-icon-color: var(--okd-color-gray-700);
    --okd-button-secondary-grey-active-icon-color: var(--okd-color-gray-700);
    --okd-button-secondary-grey-focus-icon-color: var(--okd-color-gray-700);
    --okd-button-secondary-grey-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-secondary-grey-default-shadow: var(--okd-shadow-sm);
    --okd-button-secondary-grey-hover-shadow: var(--okd-shadow-none);
    --okd-button-secondary-grey-active-shadow: var(--okd-shadow-none);
    --okd-button-secondary-grey-focus-shadow: var(--okd-shadow-sm), 0px 0px 0px 3px var(--okd-color-gray-200);
    --okd-button-secondary-grey-disabled-shadow: var(--okd-shadow-none);
    --okd-button-secondary-grey-loader-track-color: var(--okd-color-gray-200);
    --okd-button-secondary-grey-loader-mark-color: var(--okd-color-gray-700);
    --okd-button-basic-normal-default-background: #fff;
    --okd-button-basic-normal-hover-background: #fff;
    --okd-button-basic-normal-active-background: var(--okd-color-gray-050);
    --okd-button-basic-normal-focus-background: #fff;
    --okd-button-basic-normal-disabled-background: #fff;
    --okd-button-basic-normal-default-border-color: var(--okd-color-gray-200);
    --okd-button-basic-normal-hover-border-color: var(--okd-color-gray-200);
    --okd-button-basic-normal-active-border-color: var(--okd-color-gray-200);
    --okd-button-basic-normal-focus-border-color: var(--okd-color-blue-300);
    --okd-button-basic-normal-disabled-border-color: var(--okd-color-gray-200);
    --okd-button-basic-normal-default-font-color: var(--okd-color-gray-700);
    --okd-button-basic-normal-hover-font-color: var(--okd-color-gray-400);
    --okd-button-basic-normal-active-font-color: var(--okd-color-gray-900);
    --okd-button-basic-normal-focus-font-color: var(--okd-color-gray-700);
    --okd-button-basic-normal-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-basic-normal-default-icon-color: var(--okd-color-gray-700);
    --okd-button-basic-normal-hover-icon-color: var(--okd-color-gray-700);
    --okd-button-basic-normal-active-icon-color: var(--okd-color-gray-700);
    --okd-button-basic-normal-focus-icon-color: var(--okd-color-gray-700);
    --okd-button-basic-normal-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-basic-normal-default-shadow: var(--okd-shadow-sm);
    --okd-button-basic-normal-hover-shadow: var(--okd-shadow-none);
    --okd-button-basic-normal-active-shadow: var(--okd-shadow-none);
    --okd-button-basic-normal-focus-shadow: 0px 0px 0px 3px rgba(211, 228, 255, 0.45);
    --okd-button-basic-normal-disabled-shadow: var(--okd-shadow-none);
    --okd-button-basic-normal-loader-track-color: var(--okd-color-blue-100);
    --okd-button-basic-normal-loader-mark-color: var(--okd-color-blue-700);
    --okd-button-plain-normal-default-background: var(--okd-color-transparent);
    --okd-button-plain-normal-hover-background: var(--okd-color-blue-050);
    --okd-button-plain-normal-active-background: var(--okd-color-blue-050);
    --okd-button-plain-normal-focus-background: var(--okd-color-blue-050);
    --okd-button-plain-normal-disabled-background: var(--okd-color-gray-050);
    --okd-button-plain-normal-default-border-color: var(--okd-color-transparent);
    --okd-button-plain-normal-hover-border-color: var(--okd-color-transparent);
    --okd-button-plain-normal-active-border-color: var(--okd-color-transparent);
    --okd-button-plain-normal-focus-border-color: var(--okd-color-transparent);
    --okd-button-plain-normal-disabled-border-color: var(--okd-color-transparent);
    --okd-button-plain-normal-default-font-color: var(--okd-color-blue-800);
    --okd-button-plain-normal-hover-font-color: var(--okd-color-blue-800);
    --okd-button-plain-normal-active-font-color: var(--okd-color-blue-800);
    --okd-button-plain-normal-focus-font-color: var(--okd-color-blue-800);
    --okd-button-plain-normal-disabled-font-color: rgba(36, 80, 190, 0.45);
    --okd-button-plain-normal-default-icon-color: var(--okd-color-blue-800);
    --okd-button-plain-normal-hover-icon-color: var(--okd-color-blue-800);
    --okd-button-plain-normal-active-icon-color: var(--okd-color-blue-800);
    --okd-button-plain-normal-focus-icon-color: var(--okd-color-blue-800);
    --okd-button-plain-normal-disabled-icon-color: rgba(36, 80, 190, 0.45);
    --okd-button-plain-normal-default-shadow: none;
    --okd-button-plain-normal-hover-shadow: none;
    --okd-button-plain-normal-active-shadow: none;
    --okd-button-plain-normal-focus-shadow: none;
    --okd-button-plain-normal-disabled-shadow: none;
    --okd-button-plain-red-default-background: var(--okd-color-transparent);
    --okd-button-plain-red-hover-background: var(--okd-color-red-050);
    --okd-button-plain-red-active-background: var(--okd-color-red-050);
    --okd-button-plain-red-focus-background: var(--okd-color-red-050);
    --okd-button-plain-red-disabled-background: var(--okd-color-gray-050);
    --okd-button-plain-red-default-border-color: var(--okd-color-transparent);
    --okd-button-plain-red-hover-border-color: var(--okd-color-transparent);
    --okd-button-plain-red-active-border-color: var(--okd-color-transparent);
    --okd-button-plain-red-focus-border-color: var(--okd-color-transparent);
    --okd-button-plain-red-disabled-border-color: var(--okd-color-transparent);
    --okd-button-plain-red-default-font-color: var(--okd-color-red-800);
    --okd-button-plain-red-hover-font-color: var(--okd-color-red-800);
    --okd-button-plain-red-active-font-color: var(--okd-color-red-800);
    --okd-button-plain-red-focus-font-color: var(--okd-color-red-800);
    --okd-button-plain-red-disabled-font-color: rgba(192, 67, 67, 0.45);
    --okd-button-plain-red-default-icon-color: var(--okd-color-red-800);
    --okd-button-plain-red-hover-icon-color: var(--okd-color-red-800);
    --okd-button-plain-red-active-icon-color: var(--okd-color-red-800);
    --okd-button-plain-red-focus-icon-color: var(--okd-color-red-800);
    --okd-button-plain-red-disabled-icon-color: rgba(192, 67, 67, 0.45);
    --okd-button-plain-red-default-shadow: none;
    --okd-button-plain-red-hover-shadow: none;
    --okd-button-plain-red-active-shadow: none;
    --okd-button-plain-red-focus-shadow: none;
    --okd-button-plain-red-disabled-shadow: none;
    --okd-button-plain-green-default-background: var(--okd-color-transparent);
    --okd-button-plain-green-hover-background: var(--okd-color-green-050);
    --okd-button-plain-green-active-background: var(--okd-color-green-050);
    --okd-button-plain-green-focus-background: var(--okd-color-green-050);
    --okd-button-plain-green-disabled-background: var(--okd-color-gray-050);
    --okd-button-plain-green-default-border-color: var(--okd-color-transparent);
    --okd-button-plain-green-hover-border-color: var(--okd-color-transparent);
    --okd-button-plain-green-active-border-color: var(--okd-color-transparent);
    --okd-button-plain-green-focus-border-color: var(--okd-color-transparent);
    --okd-button-plain-green-disabled-border-color: var(--okd-color-transparent);
    --okd-button-plain-green-default-font-color: var(--okd-color-green-800);
    --okd-button-plain-green-hover-font-color: var(--okd-color-green-800);
    --okd-button-plain-green-active-font-color: var(--okd-color-green-800);
    --okd-button-plain-green-focus-font-color: var(--okd-color-green-800);
    --okd-button-plain-green-disabled-font-color: rgba(37, 152, 87, 0.45);
    --okd-button-plain-green-default-icon-color: var(--okd-color-green-800);
    --okd-button-plain-green-hover-icon-color: var(--okd-color-green-800);
    --okd-button-plain-green-active-icon-color: var(--okd-color-green-800);
    --okd-button-plain-green-focus-icon-color: var(--okd-color-green-800);
    --okd-button-plain-green-disabled-icon-color: rgba(37, 152, 87, 0.45);
    --okd-button-plain-green-default-shadow: none;
    --okd-button-plain-green-hover-shadow: none;
    --okd-button-plain-green-active-shadow: none;
    --okd-button-plain-green-focus-shadow: none;
    --okd-button-plain-green-disabled-shadow: none;
    --okd-button-plain-orange-default-background: var(--okd-color-transparent);
    --okd-button-plain-orange-hover-background: var(--okd-color-orange-050);
    --okd-button-plain-orange-active-background: var(--okd-color-orange-050);
    --okd-button-plain-orange-focus-background: var(--okd-color-orange-050);
    --okd-button-plain-orange-disabled-background: var(--okd-color-gray-050);
    --okd-button-plain-orange-default-border-color: var(--okd-color-transparent);
    --okd-button-plain-orange-hover-border-color: var(--okd-color-transparent);
    --okd-button-plain-orange-active-border-color: var(--okd-color-transparent);
    --okd-button-plain-orange-focus-border-color: var(--okd-color-transparent);
    --okd-button-plain-orange-disabled-border-color: var(--okd-color-transparent);
    --okd-button-plain-orange-default-font-color: var(--okd-color-orange-800);
    --okd-button-plain-orange-hover-font-color: var(--okd-color-orange-800);
    --okd-button-plain-orange-active-font-color: var(--okd-color-orange-800);
    --okd-button-plain-orange-focus-font-color: var(--okd-color-orange-800);
    --okd-button-plain-orange-disabled-font-color: rgba(198, 112, 36, 0.45);
    --okd-button-plain-orange-default-icon-color: var(--okd-color-orange-800);
    --okd-button-plain-orange-hover-icon-color: var(--okd-color-orange-800);
    --okd-button-plain-orange-active-icon-color: var(--okd-color-orange-800);
    --okd-button-plain-orange-focus-icon-color: var(--okd-color-orange-800);
    --okd-button-plain-orange-disabled-icon-color: rgba(198, 112, 36, 0.45);
    --okd-button-plain-orange-default-shadow: none;
    --okd-button-plain-orange-hover-shadow: none;
    --okd-button-plain-orange-active-shadow: none;
    --okd-button-plain-orange-focus-shadow: none;
    --okd-button-plain-orange-disabled-shadow: none;
    --okd-button-plain-yellow-default-background: var(--okd-color-transparent);
    --okd-button-plain-yellow-hover-background: var(--okd-color-yellow-050);
    --okd-button-plain-yellow-active-background: var(--okd-color-yellow-050);
    --okd-button-plain-yellow-focus-background: var(--okd-color-yellow-050);
    --okd-button-plain-yellow-disabled-background: var(--okd-color-gray-050);
    --okd-button-plain-yellow-default-border-color: var(--okd-color-transparent);
    --okd-button-plain-yellow-hover-border-color: var(--okd-color-transparent);
    --okd-button-plain-yellow-active-border-color: var(--okd-color-transparent);
    --okd-button-plain-yellow-focus-border-color: var(--okd-color-transparent);
    --okd-button-plain-yellow-disabled-border-color: var(--okd-color-transparent);
    --okd-button-plain-yellow-default-font-color: var(--okd-color-yellow-800);
    --okd-button-plain-yellow-hover-font-color: var(--okd-color-yellow-800);
    --okd-button-plain-yellow-active-font-color: var(--okd-color-yellow-800);
    --okd-button-plain-yellow-focus-font-color: var(--okd-color-yellow-800);
    --okd-button-plain-yellow-disabled-font-color: rgba(192, 157, 33, 0.45);
    --okd-button-plain-yellow-default-icon-color: var(--okd-color-yellow-800);
    --okd-button-plain-yellow-hover-icon-color: var(--okd-color-yellow-800);
    --okd-button-plain-yellow-active-icon-color: var(--okd-color-yellow-800);
    --okd-button-plain-yellow-focus-icon-color: var(--okd-color-yellow-800);
    --okd-button-plain-yellow-disabled-icon-color: rgba(192, 157, 33, 0.45);
    --okd-button-plain-yellow-default-shadow: none;
    --okd-button-plain-yellow-hover-shadow: none;
    --okd-button-plain-yellow-active-shadow: none;
    --okd-button-plain-yellow-focus-shadow: none;
    --okd-button-plain-yellow-disabled-shadow: none;
    --okd-button-xxs-font-size: var(--okd-font-size-xs);
    --okd-button-xs-font-size: var(--okd-font-size-xs);
    --okd-button-sm-font-size: var(--okd-font-size-md);
    --okd-button-md-font-size: var(--okd-font-size-md);
    --okd-button-lg-font-size: var(--okd-font-size-base);
    --okd-button-xl-font-size: var(--okd-font-size-base);
    --okd-button-xxs-icon-size: 14px;
    --okd-button-xs-icon-size: 14px;
    --okd-button-sm-icon-size: 18px;
    --okd-button-md-icon-size: 18px;
    --okd-button-lg-icon-size: 18px;
    --okd-button-xl-icon-size: 18px;
    --okd-button-xxs-icon-margin: 5px;
    --okd-button-xs-icon-margin: 5px;
    --okd-button-sm-icon-margin: 11px;
    --okd-button-md-icon-margin: 11px;
    --okd-button-lg-icon-margin: 11px;
    --okd-button-xl-icon-margin: 11px;
    --okd-button-xxs-line-height: var(--okd-line-height-xs);
    --okd-button-xs-line-height: var(--okd-line-height-xs);
    --okd-button-sm-line-height: var(--okd-line-height-md);
    --okd-button-md-line-height: var(--okd-line-height-md);
    --okd-button-lg-line-height: var(--okd-line-height-base);
    --okd-button-xl-line-height: var(--okd-line-height-base);
    --okd-button-xxs-padding-horizontal: 8px;
    --okd-button-xxs-padding-vertical: 3px;
    --okd-button-xs-padding-horizontal: 8px;
    --okd-button-xs-padding-vertical: 5px;
    --okd-button-sm-padding-horizontal: 12px;
    --okd-button-sm-padding-vertical: 7px;
    --okd-button-md-padding-horizontal: 16px;
    --okd-button-md-padding-vertical: 9px;
    --okd-button-lg-padding-horizontal: 24px;
    --okd-button-lg-padding-vertical: 13px;
    --okd-button-xl-padding-horizontal: 24px;
    --okd-button-xl-padding-vertical: 17px;
    --okd-button-xxs-min-width: 63px;
    --okd-button-xs-min-width: 63px;
    --okd-button-sm-min-width: 81px;
    --okd-button-md-min-width: 90px;
    --okd-button-lg-min-width: 108px;
    --okd-button-xl-min-width: 126px;
    --okd-button-xxs-border-radius: 4px;
    --okd-button-xs-border-radius: 4px;
    --okd-button-sm-border-radius: 4px;
    --okd-button-md-border-radius: 4px;
    --okd-button-lg-border-radius: 6px;
    --okd-button-xl-border-radius: 8px;
    --okd-button-xxs-border-size: 1px;
    --okd-button-xs-border-size: 1px;
    --okd-button-sm-border-size: 1px;
    --okd-button-md-border-size: 1px;
    --okd-button-lg-border-size: 1px;
    --okd-button-xl-border-size: 1px;
    --okd-button-fill-highlight-default-background: var(--okd-color-gray-900);
    --okd-button-fill-highlight-hover-background: var(--okd-color-gray-900);
    --okd-button-fill-highlight-active-background: var(--okd-color-gray-900);
    --okd-button-fill-highlight-focus-background: var(--okd-color-gray-900);
    --okd-button-fill-highlight-disabled-background: var(--okd-color-gray-100);
    --okd-button-fill-highlight-default-border-color: var(--okd-color-gray-900);
    --okd-button-fill-highlight-hover-border-color: var(--okd-color-gray-900);
    --okd-button-fill-highlight-active-border-color: var(--okd-color-gray-900);
    --okd-button-fill-highlight-focus-border-color: var(--okd-color-gray-900);
    --okd-button-fill-highlight-disabled-border-color: var(--okd-color-gray-100);
    --okd-button-fill-highlight-default-font-color: var(--okd-color-text-white);
    --okd-button-fill-highlight-hover-font-color: hsla(0, 0%, 100%, 0.6);
    --okd-button-fill-highlight-active-font-color: var(--okd-color-text-white);
    --okd-button-fill-highlight-focus-font-color: var(--okd-color-text-white);
    --okd-button-fill-highlight-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-fill-highlight-default-icon-color: var(--okd-color-text-white);
    --okd-button-fill-highlight-hover-icon-color: var(--okd-color-text-white);
    --okd-button-fill-highlight-active-icon-color: var(--okd-color-text-white);
    --okd-button-fill-highlight-focus-icon-color: var(--okd-color-text-white);
    --okd-button-fill-highlight-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-fill-highlight-default-shadow: var(--okd-shadow-none);
    --okd-button-fill-highlight-hover-shadow: var(--okd-shadow-none);
    --okd-button-fill-highlight-active-shadow: var(--okd-shadow-none);
    --okd-button-fill-highlight-focus-shadow: 0px 0px 0px 1.5px #fff, 0px 0px 0px 3.5px #1d202359;
    --okd-button-fill-highlight-disabled-shadow: var(--okd-shadow-none);
    --okd-button-fill-highlight-loader-track-color: hsla(0, 0%, 100%, 0.35);
    --okd-button-fill-highlight-loader-mark-color: var(--okd-color-white);
    --okd-button-fill-primary-default-background: var(--okd-color-blue-700);
    --okd-button-fill-primary-hover-background: var(--okd-color-blue-500);
    --okd-button-fill-primary-active-background: var(--okd-color-blue-800);
    --okd-button-fill-primary-focus-background: var(--okd-color-blue-700);
    --okd-button-fill-primary-disabled-background: var(--okd-color-gray-100);
    --okd-button-fill-primary-default-border-color: var(--okd-color-blue-700);
    --okd-button-fill-primary-hover-border-color: var(--okd-color-blue-500);
    --okd-button-fill-primary-active-border-color: var(--okd-color-blue-800);
    --okd-button-fill-primary-focus-border-color: var(--okd-color-blue-700);
    --okd-button-fill-primary-disabled-border-color: var(--okd-color-gray-100);
    --okd-button-fill-primary-default-font-color: var(--okd-color-text-white);
    --okd-button-fill-primary-hover-font-color: var(--okd-color-text-white);
    --okd-button-fill-primary-active-font-color: var(--okd-color-text-white);
    --okd-button-fill-primary-focus-font-color: var(--okd-color-text-white);
    --okd-button-fill-primary-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-fill-primary-default-icon-color: var(--okd-color-text-white);
    --okd-button-fill-primary-hover-icon-color: var(--okd-color-text-white);
    --okd-button-fill-primary-active-icon-color: var(--okd-color-text-white);
    --okd-button-fill-primary-focus-icon-color: var(--okd-color-text-white);
    --okd-button-fill-primary-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-fill-primary-default-shadow: var(--okd-shadow-none);
    --okd-button-fill-primary-hover-shadow: var(--okd-shadow-none);
    --okd-button-fill-primary-active-shadow: var(--okd-shadow-none);
    --okd-button-fill-primary-focus-shadow: 0px 0px 0px 1.5px #fff, 0px 0px 0px 3.5px #2d60e040;
    --okd-button-fill-primary-disabled-shadow: var(--okd-shadow-none);
    --okd-button-fill-primary-loader-track-color: var(--okd-color-blue-500);
    --okd-button-fill-primary-loader-mark-color: var(--okd-color-white);
    --okd-button-fill-red-default-background: var(--okd-color-red-700);
    --okd-button-fill-red-hover-background: var(--okd-color-red-500);
    --okd-button-fill-red-active-background: var(--okd-color-red-800);
    --okd-button-fill-red-focus-background: var(--okd-color-red-700);
    --okd-button-fill-red-disabled-background: var(--okd-color-gray-100);
    --okd-button-fill-red-default-border-color: var(--okd-color-red-700);
    --okd-button-fill-red-hover-border-color: var(--okd-color-red-500);
    --okd-button-fill-red-active-border-color: var(--okd-color-red-800);
    --okd-button-fill-red-focus-border-color: var(--okd-color-red-700);
    --okd-button-fill-red-disabled-border-color: var(--okd-color-gray-100);
    --okd-button-fill-red-default-font-color: var(--okd-color-text-white);
    --okd-button-fill-red-hover-font-color: var(--okd-color-text-white);
    --okd-button-fill-red-active-font-color: var(--okd-color-text-white);
    --okd-button-fill-red-focus-font-color: var(--okd-color-text-white);
    --okd-button-fill-red-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-fill-red-default-icon-color: var(--okd-color-text-white);
    --okd-button-fill-red-hover-icon-color: var(--okd-color-text-white);
    --okd-button-fill-red-active-icon-color: var(--okd-color-text-white);
    --okd-button-fill-red-focus-icon-color: var(--okd-color-text-white);
    --okd-button-fill-red-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-fill-red-default-shadow: 0 0 0 0 transparent;
    --okd-button-fill-red-hover-shadow: var(--okd-shadow-none);
    --okd-button-fill-red-active-shadow: var(--okd-shadow-none);
    --okd-button-fill-red-focus-shadow: 0px 0px 0px 1.5px #fff, 0px 0px 0px 3.5px #e35e5e66;
    --okd-button-fill-red-disabled-shadow: var(--okd-shadow-none);
    --okd-button-fill-red-loader-track-color: var(--okd-color-red-500);
    --okd-button-fill-red-loader-mark-color: var(--okd-color-white);
    --okd-button-fill-green-default-background: var(--okd-color-green-700);
    --okd-button-fill-green-hover-background: var(--okd-color-green-500);
    --okd-button-fill-green-active-background: var(--okd-color-green-800);
    --okd-button-fill-green-focus-background: var(--okd-color-green-700);
    --okd-button-fill-green-disabled-background: var(--okd-color-gray-100);
    --okd-button-fill-green-default-border-color: var(--okd-color-green-700);
    --okd-button-fill-green-hover-border-color: var(--okd-color-green-500);
    --okd-button-fill-green-active-border-color: var(--okd-color-green-800);
    --okd-button-fill-green-focus-border-color: var(--okd-color-green-700);
    --okd-button-fill-green-disabled-border-color: var(--okd-color-gray-100);
    --okd-button-fill-green-default-font-color: var(--okd-color-text-white);
    --okd-button-fill-green-hover-font-color: var(--okd-color-text-white);
    --okd-button-fill-green-active-font-color: var(--okd-color-text-white);
    --okd-button-fill-green-focus-font-color: var(--okd-color-text-white);
    --okd-button-fill-green-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-fill-green-default-icon-color: var(--okd-color-text-white);
    --okd-button-fill-green-hover-icon-color: var(--okd-color-text-white);
    --okd-button-fill-green-active-icon-color: var(--okd-color-text-white);
    --okd-button-fill-green-focus-icon-color: var(--okd-color-text-white);
    --okd-button-fill-green-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-fill-green-default-shadow: 0 0 0 0 transparent;
    --okd-button-fill-green-hover-shadow: var(--okd-shadow-none);
    --okd-button-fill-green-active-shadow: var(--okd-shadow-none);
    --okd-button-fill-green-focus-shadow: 0px 0px 0px 1px #fff, 0px 0px 0px 3.5px #2ead6573;
    --okd-button-fill-green-disabled-shadow: var(--okd-shadow-none);
    --okd-button-fill-green-loader-track-color: var(--okd-color-green-500);
    --okd-button-fill-green-loader-mark-color: var(--okd-color-white);
    --okd-button-fill-secondary-default-background: var(--okd-color-blue-050);
    --okd-button-fill-secondary-hover-background: var(--okd-color-blue-100);
    --okd-button-fill-secondary-active-background: var(--okd-color-blue-200);
    --okd-button-fill-secondary-focus-background: var(--okd-color-blue-100);
    --okd-button-fill-secondary-disabled-background: var(--okd-color-gray-100);
    --okd-button-fill-secondary-default-border-color: var(--okd-color-blue-050);
    --okd-button-fill-secondary-hover-border-color: var(--okd-color-blue-100);
    --okd-button-fill-secondary-active-border-color: var(--okd-color-blue-200);
    --okd-button-fill-secondary-focus-border-color: var(--okd-color-blue-100);
    --okd-button-fill-secondary-disabled-border-color: var(--okd-color-gray-100);
    --okd-button-fill-secondary-default-font-color: var(--okd-color-blue-800);
    --okd-button-fill-secondary-hover-font-color: var(--okd-color-blue-800);
    --okd-button-fill-secondary-active-font-color: var(--okd-color-blue-800);
    --okd-button-fill-secondary-focus-font-color: var(--okd-color-blue-800);
    --okd-button-fill-secondary-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-fill-secondary-default-icon-color: var(--okd-color-blue-700);
    --okd-button-fill-secondary-hover-icon-color: var(--okd-color-blue-700);
    --okd-button-fill-secondary-active-icon-color: var(--okd-color-blue-700);
    --okd-button-fill-secondary-focus-icon-color: var(--okd-color-blue-700);
    --okd-button-fill-secondary-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-fill-secondary-default-shadow: var(--okd-shadow-none);
    --okd-button-fill-secondary-hover-shadow: var(--okd-shadow-none);
    --okd-button-fill-secondary-active-shadow: var(--okd-shadow-none);
    --okd-button-fill-secondary-focus-shadow: 0px 0px 0px 1.5px #fff, 0px 0px 0px 3.5px #2d60e040;
    --okd-button-fill-secondary-disabled-shadow: var(--okd-shadow-none);
    --okd-button-fill-secondary-loader-track-color: var(--okd-color-blue-050);
    --okd-button-fill-secondary-loader-mark-color: var(--okd-color-blue-700);
    --okd-button-fill-grey-default-background: var(--okd-color-gray-100);
    --okd-button-fill-grey-hover-background: rgba(216, 220, 230, 0.5);
    --okd-button-fill-grey-active-background: rgba(216, 220, 230, 0.5);
    --okd-button-fill-grey-focus-background: rgba(216, 220, 230, 0.5);
    --okd-button-fill-grey-disabled-background: var(--okd-color-gray-100);
    --okd-button-fill-grey-default-border-color: var(--okd-color-gray-100);
    --okd-button-fill-grey-hover-border-color: var(--okd-color-transparent);
    --okd-button-fill-grey-active-border-color: var(--okd-color-transparent);
    --okd-button-fill-grey-focus-border-color: var(--okd-color-gray-200);
    --okd-button-fill-grey-disabled-border-color: var(--okd-color-gray-100);
    --okd-button-fill-grey-default-font-color: var(--okd-color-gray-700);
    --okd-button-fill-grey-hover-font-color: var(--okd-color-gray-700);
    --okd-button-fill-grey-active-font-color: var(--okd-color-gray-700);
    --okd-button-fill-grey-focus-font-color: var(--okd-color-gray-700);
    --okd-button-fill-grey-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-fill-grey-default-icon-color: var(--okd-color-gray-700);
    --okd-button-fill-grey-hover-icon-color: var(--okd-color-gray-700);
    --okd-button-fill-grey-active-icon-color: var(--okd-color-gray-700);
    --okd-button-fill-grey-focus-icon-color: var(--okd-color-gray-700);
    --okd-button-fill-grey-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-fill-grey-default-shadow: 0 0 0 0 transparent;
    --okd-button-fill-grey-hover-shadow: var(--okd-shadow-none);
    --okd-button-fill-grey-active-shadow: var(--okd-shadow-none);
    --okd-button-fill-grey-focus-shadow: 0px 0px 0px 0px #00000000, 0px 0px 0px 3.5px #d8dce673;
    --okd-button-fill-grey-disabled-shadow: var(--okd-shadow-none);
    --okd-button-fill-grey-loader-track-color: var(--okd-color-gray-200);
    --okd-button-fill-grey-loader-mark-color: var(--okd-color-gray-700);
    --okd-button-outline-primary-default-background: #fff;
    --okd-button-outline-primary-hover-background: #fff;
    --okd-button-outline-primary-active-background: var(--okd-color-gray-050);
    --okd-button-outline-primary-focus-background: #fff;
    --okd-button-outline-primary-disabled-background: #fff;
    --okd-button-outline-primary-default-border-color: var(--okd-color-gray-200);
    --okd-button-outline-primary-hover-border-color: var(--okd-color-gray-200);
    --okd-button-outline-primary-active-border-color: var(--okd-color-gray-200);
    --okd-button-outline-primary-focus-border-color: var(--okd-color-blue-300);
    --okd-button-outline-primary-disabled-border-color: var(--okd-color-gray-200);
    --okd-button-outline-primary-default-font-color: var(--okd-color-gray-700);
    --okd-button-outline-primary-hover-font-color: var(--okd-color-gray-400);
    --okd-button-outline-primary-active-font-color: var(--okd-color-gray-900);
    --okd-button-outline-primary-focus-font-color: var(--okd-color-gray-700);
    --okd-button-outline-primary-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-outline-primary-default-icon-color: var(--okd-color-gray-700);
    --okd-button-outline-primary-hover-icon-color: var(--okd-color-gray-700);
    --okd-button-outline-primary-active-icon-color: var(--okd-color-gray-700);
    --okd-button-outline-primary-focus-icon-color: var(--okd-color-gray-700);
    --okd-button-outline-primary-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-outline-primary-default-shadow: 0 0 0 0 transparent;
    --okd-button-outline-primary-hover-shadow: var(--okd-shadow-none);
    --okd-button-outline-primary-active-shadow: var(--okd-shadow-none);
    --okd-button-outline-primary-focus-shadow: 0px 0px 0px 3px #bdcfff73;
    --okd-button-outline-primary-disabled-shadow: var(--okd-shadow-none);
    --okd-button-outline-primary-loader-track-color: var(--okd-color-blue-100);
    --okd-button-outline-primary-loader-mark-color: var(--okd-color-blue-700);
    --okd-button-outline-secondary-default-background: var(--okd-color-white);
    --okd-button-outline-secondary-hover-background: var(--okd-color-white);
    --okd-button-outline-secondary-active-background: var(--okd-color-gray-050);
    --okd-button-outline-secondary-focus-background: var(--okd-color-white);
    --okd-button-outline-secondary-disabled-background: var(--okd-color-white);
    --okd-button-outline-secondary-default-border-color: var(--okd-color-gray-200);
    --okd-button-outline-secondary-hover-border-color: var(--okd-color-gray-200);
    --okd-button-outline-secondary-active-border-color: var(--okd-color-gray-200);
    --okd-button-outline-secondary-focus-border-color: var(--okd-color-blue-300);
    --okd-button-outline-secondary-disabled-border-color: var(--okd-color-gray-200);
    --okd-button-outline-secondary-default-font-color: var(--okd-color-gray-700);
    --okd-button-outline-secondary-hover-font-color: var(--okd-color-gray-400);
    --okd-button-outline-secondary-active-font-color: var(--okd-color-gray-900);
    --okd-button-outline-secondary-focus-font-color: var(--okd-color-gray-700);
    --okd-button-outline-secondary-disabled-font-color: var(--okd-color-gray-300);
    --okd-button-outline-secondary-default-icon-color: var(--okd-color-gray-700);
    --okd-button-outline-secondary-hover-icon-color: var(--okd-color-gray-700);
    --okd-button-outline-secondary-active-icon-color: var(--okd-color-gray-700);
    --okd-button-outline-secondary-focus-icon-color: var(--okd-color-gray-700);
    --okd-button-outline-secondary-disabled-icon-color: var(--okd-color-gray-300);
    --okd-button-outline-secondary-default-shadow: 0 0 0 0 transparent;
    --okd-button-outline-secondary-hover-shadow: var(--okd-shadow-none);
    --okd-button-outline-secondary-active-shadow: var(--okd-shadow-none);
    --okd-button-outline-secondary-focus-shadow: 0px 0px 0px 3px rgba(211, 228, 255, 0.45);
    --okd-button-outline-secondary-disabled-shadow: var(--okd-shadow-none);
    --okd-button-outline-secondary-loader-track-color: var(--okd-color-blue-100);
    --okd-button-outline-secondary-loader-mark-color: var(--okd-color-blue-700);
    --okd-button-text-primary-default-background: var(--okd-color-transparent);
    --okd-button-text-primary-hover-background: var(--okd-color-blue-050);
    --okd-button-text-primary-active-background: var(--okd-color-blue-050);
    --okd-button-text-primary-focus-background: var(--okd-color-blue-050);
    --okd-button-text-primary-disabled-background: var(--okd-color-gray-050);
    --okd-button-text-primary-default-border-color: var(--okd-color-transparent);
    --okd-button-text-primary-hover-border-color: var(--okd-color-transparent);
    --okd-button-text-primary-active-border-color: var(--okd-color-transparent);
    --okd-button-text-primary-focus-border-color: var(--okd-color-transparent);
    --okd-button-text-primary-disabled-border-color: var(--okd-color-transparent);
    --okd-button-text-primary-default-font-color: var(--okd-color-blue-800);
    --okd-button-text-primary-hover-font-color: var(--okd-color-blue-800);
    --okd-button-text-primary-active-font-color: var(--okd-color-blue-800);
    --okd-button-text-primary-focus-font-color: var(--okd-color-blue-800);
    --okd-button-text-primary-disabled-font-color: rgba(36, 80, 190, 0.45);
    --okd-button-text-primary-default-icon-color: var(--okd-color-blue-800);
    --okd-button-text-primary-hover-icon-color: var(--okd-color-blue-800);
    --okd-button-text-primary-active-icon-color: var(--okd-color-blue-800);
    --okd-button-text-primary-focus-icon-color: var(--okd-color-blue-800);
    --okd-button-text-primary-disabled-icon-color: rgba(36, 80, 190, 0.45);
    --okd-button-text-primary-default-shadow: none;
    --okd-button-text-primary-hover-shadow: none;
    --okd-button-text-primary-active-shadow: none;
    --okd-button-text-primary-focus-shadow: none;
    --okd-button-text-primary-disabled-shadow: none;
    --okd-button-text-secondary-default-background: var(--okd-color-transparent);
    --okd-button-text-secondary-hover-background: var(--okd-color-blue-050);
    --okd-button-text-secondary-active-background: var(--okd-color-blue-050);
    --okd-button-text-secondary-focus-background: var(--okd-color-blue-050);
    --okd-button-text-secondary-disabled-background: var(--okd-color-gray-050);
    --okd-button-text-secondary-default-border-color: var(--okd-color-transparent);
    --okd-button-text-secondary-hover-border-color: var(--okd-color-transparent);
    --okd-button-text-secondary-active-border-color: var(--okd-color-transparent);
    --okd-button-text-secondary-focus-border-color: var(--okd-color-transparent);
    --okd-button-text-secondary-disabled-border-color: var(--okd-color-transparent);
    --okd-button-text-secondary-default-font-color: var(--okd-color-blue-800);
    --okd-button-text-secondary-hover-font-color: var(--okd-color-blue-800);
    --okd-button-text-secondary-active-font-color: var(--okd-color-blue-800);
    --okd-button-text-secondary-focus-font-color: var(--okd-color-blue-800);
    --okd-button-text-secondary-disabled-font-color: rgba(36, 80, 190, 0.45);
    --okd-button-text-secondary-default-icon-color: var(--okd-color-blue-800);
    --okd-button-text-secondary-hover-icon-color: var(--okd-color-blue-800);
    --okd-button-text-secondary-active-icon-color: var(--okd-color-blue-800);
    --okd-button-text-secondary-focus-icon-color: var(--okd-color-blue-800);
    --okd-button-text-secondary-disabled-icon-color: rgba(36, 80, 190, 0.45);
    --okd-button-text-secondary-default-shadow: none;
    --okd-button-text-secondary-hover-shadow: none;
    --okd-button-text-secondary-active-shadow: none;
    --okd-button-text-secondary-focus-shadow: none;
    --okd-button-text-secondary-disabled-shadow: none;
    --okd-button-text-red-default-background: var(--okd-color-transparent);
    --okd-button-text-red-hover-background: var(--okd-color-red-050);
    --okd-button-text-red-active-background: var(--okd-color-red-050);
    --okd-button-text-red-focus-background: var(--okd-color-red-050);
    --okd-button-text-red-disabled-background: var(--okd-color-gray-050);
    --okd-button-text-red-default-border-color: var(--okd-color-transparent);
    --okd-button-text-red-hover-border-color: var(--okd-color-transparent);
    --okd-button-text-red-active-border-color: var(--okd-color-transparent);
    --okd-button-text-red-focus-border-color: var(--okd-color-transparent);
    --okd-button-text-red-disabled-border-color: var(--okd-color-transparent);
    --okd-button-text-red-default-font-color: var(--okd-color-red-800);
    --okd-button-text-red-hover-font-color: var(--okd-color-red-800);
    --okd-button-text-red-active-font-color: var(--okd-color-red-800);
    --okd-button-text-red-focus-font-color: var(--okd-color-red-800);
    --okd-button-text-red-disabled-font-color: rgba(192, 67, 67, 0.45);
    --okd-button-text-red-default-icon-color: var(--okd-color-red-800);
    --okd-button-text-red-hover-icon-color: var(--okd-color-red-800);
    --okd-button-text-red-active-icon-color: var(--okd-color-red-800);
    --okd-button-text-red-focus-icon-color: var(--okd-color-red-800);
    --okd-button-text-red-disabled-icon-color: rgba(192, 67, 67, 0.45);
    --okd-button-text-red-default-shadow: none;
    --okd-button-text-red-hover-shadow: none;
    --okd-button-text-red-active-shadow: none;
    --okd-button-text-red-focus-shadow: none;
    --okd-button-text-red-disabled-shadow: none;
    --okd-button-text-green-default-background: var(--okd-color-transparent);
    --okd-button-text-green-hover-background: var(--okd-color-green-050);
    --okd-button-text-green-active-background: var(--okd-color-green-050);
    --okd-button-text-green-focus-background: var(--okd-color-green-050);
    --okd-button-text-green-disabled-background: var(--okd-color-gray-050);
    --okd-button-text-green-default-border-color: var(--okd-color-transparent);
    --okd-button-text-green-hover-border-color: var(--okd-color-transparent);
    --okd-button-text-green-active-border-color: var(--okd-color-transparent);
    --okd-button-text-green-focus-border-color: var(--okd-color-transparent);
    --okd-button-text-green-disabled-border-color: var(--okd-color-transparent);
    --okd-button-text-green-default-font-color: var(--okd-color-green-800);
    --okd-button-text-green-hover-font-color: var(--okd-color-green-800);
    --okd-button-text-green-active-font-color: var(--okd-color-green-800);
    --okd-button-text-green-focus-font-color: var(--okd-color-green-800);
    --okd-button-text-green-disabled-font-color: rgba(37, 152, 87, 0.45);
    --okd-button-text-green-default-icon-color: var(--okd-color-green-800);
    --okd-button-text-green-hover-icon-color: var(--okd-color-green-800);
    --okd-button-text-green-active-icon-color: var(--okd-color-green-800);
    --okd-button-text-green-focus-icon-color: var(--okd-color-green-800);
    --okd-button-text-green-disabled-icon-color: rgba(37, 152, 87, 0.45);
    --okd-button-text-green-default-shadow: none;
    --okd-button-text-green-hover-shadow: none;
    --okd-button-text-green-active-shadow: none;
    --okd-button-text-green-focus-shadow: none;
    --okd-button-text-green-disabled-shadow: none;
    --okd-button-text-orange-default-background: var(--okd-color-transparent);
    --okd-button-text-orange-hover-background: var(--okd-color-orange-050);
    --okd-button-text-orange-active-background: var(--okd-color-orange-050);
    --okd-button-text-orange-focus-background: var(--okd-color-orange-050);
    --okd-button-text-orange-disabled-background: var(--okd-color-gray-050);
    --okd-button-text-orange-default-border-color: var(--okd-color-transparent);
    --okd-button-text-orange-hover-border-color: var(--okd-color-transparent);
    --okd-button-text-orange-active-border-color: var(--okd-color-transparent);
    --okd-button-text-orange-focus-border-color: var(--okd-color-transparent);
    --okd-button-text-orange-disabled-border-color: var(--okd-color-transparent);
    --okd-button-text-orange-default-font-color: var(--okd-color-orange-800);
    --okd-button-text-orange-hover-font-color: var(--okd-color-orange-800);
    --okd-button-text-orange-active-font-color: var(--okd-color-orange-800);
    --okd-button-text-orange-focus-font-color: var(--okd-color-orange-800);
    --okd-button-text-orange-disabled-font-color: rgba(198, 112, 36, 0.45);
    --okd-button-text-orange-default-icon-color: var(--okd-color-orange-800);
    --okd-button-text-orange-hover-icon-color: var(--okd-color-orange-800);
    --okd-button-text-orange-active-icon-color: var(--okd-color-orange-800);
    --okd-button-text-orange-focus-icon-color: var(--okd-color-orange-800);
    --okd-button-text-orange-disabled-icon-color: rgba(198, 112, 36, 0.45);
    --okd-button-text-orange-default-shadow: none;
    --okd-button-text-orange-hover-shadow: none;
    --okd-button-text-orange-active-shadow: none;
    --okd-button-text-orange-focus-shadow: none;
    --okd-button-text-orange-disabled-shadow: none;
    --okd-button-text-yellow-default-background: var(--okd-color-transparent);
    --okd-button-text-yellow-hover-background: var(--okd-color-yellow-050);
    --okd-button-text-yellow-active-background: var(--okd-color-yellow-050);
    --okd-button-text-yellow-focus-background: var(--okd-color-yellow-050);
    --okd-button-text-yellow-disabled-background: var(--okd-color-gray-050);
    --okd-button-text-yellow-default-border-color: var(--okd-color-transparent);
    --okd-button-text-yellow-hover-border-color: var(--okd-color-transparent);
    --okd-button-text-yellow-active-border-color: var(--okd-color-transparent);
    --okd-button-text-yellow-focus-border-color: var(--okd-color-transparent);
    --okd-button-text-yellow-disabled-border-color: var(--okd-color-transparent);
    --okd-button-text-yellow-default-font-color: var(--okd-color-yellow-800);
    --okd-button-text-yellow-hover-font-color: var(--okd-color-yellow-800);
    --okd-button-text-yellow-active-font-color: var(--okd-color-yellow-800);
    --okd-button-text-yellow-focus-font-color: var(--okd-color-yellow-800);
    --okd-button-text-yellow-disabled-font-color: rgba(192, 157, 33, 0.45);
    --okd-button-text-yellow-default-icon-color: var(--okd-color-yellow-800);
    --okd-button-text-yellow-hover-icon-color: var(--okd-color-yellow-800);
    --okd-button-text-yellow-active-icon-color: var(--okd-color-yellow-800);
    --okd-button-text-yellow-focus-icon-color: var(--okd-color-yellow-800);
    --okd-button-text-yellow-disabled-icon-color: rgba(192, 157, 33, 0.45);
    --okd-button-text-yellow-default-shadow: none;
    --okd-button-text-yellow-hover-shadow: none;
    --okd-button-text-yellow-active-shadow: none;
    --okd-button-text-yellow-focus-shadow: none;
    --okd-button-text-yellow-disabled-shadow: none;
    --okd-button-fill-primary-border-size: 1px;
    --okd-button-fill-secondary-border-size: 1px;
    --okd-button-fill-red-border-size: 1px;
    --okd-button-fill-green-border-size: 1px;
    --okd-button-fill-grey-border-size: 1px;
    --okd-button-outline-primary-border-size: 1px;
    --okd-button-outline-secondary-border-size: 1px;
    --okd-button-text-primary-border-size: 1px;
    --okd-button-text-secondary-border-size: 1px;
    --okd-button-text-red-border-size: 1px;
    --okd-button-text-green-border-size: 1px;
    --okd-button-text-orange-border-size: 1px;
    --okd-button-text-yellow-border-size: 1px;
    --okd-button-fill-highlight-border-size: 1px;
    --okd-button-xl-loader-size: 18px;
    --okd-button-lg-loader-size: 14px;
    --okd-button-md-loader-size: 14px;
    --okd-button-sm-loader-size: 14px;
    --okd-button-xs-loader-size: 14px;
    --okd-button-xxs-loader-size: 14px;
    --okd-button-xl-loader-text-margin-left: 4px;
    --okd-button-lg-loader-text-margin-left: 4px;
    --okd-button-md-loader-text-margin-left: 4px;
    --okd-button-sm-loader-text-margin-left: 4px;
    --okd-button-xs-loader-text-margin-left: 4px;
    --okd-button-xxs-loader-text-margin-left: 4px;
    --okd-button-s-font-size: 14px;
    --okd-button-s-icon-size: 18px;
    --okd-button-s-icon-margin: 11px;
    --okd-button-s-line-height: 16px;
    --okd-button-s-padding-horizontal: 12px;
    --okd-button-s-padding-vertical: 7px;
    --okd-button-s-min-width: 72px;
    --okd-button-s-border-radius: 4px;
    --okd-button-s-loader-size: 14px;
    --okd-button-s-loader-text-margin-left: 4px;
    --okd-checkbox-default-text-color: var(--okd-color-gray-700);
    --okd-checkbox-default-background: var(--okd-color-text-white);
    --okd-checkbox-default-border-color: var(--okd-color-gray-200);
    --okd-checkbox-default-hover-border-color: var(--okd-color-blue-300);
    --okd-checkbox-default-shadow: 0px 1px 2px 0px #0000000d;
    --okd-checkbox-default-hover-shadow: 0px 0px 0px 2px #bdcfff73;
    --okd-checkbox-selected-text-color: var(--okd-color-gray-700);
    --okd-checkbox-selected-background: var(--okd-color-blue-700);
    --okd-checkbox-selected-border-color: var(--okd-color-blue-700);
    --okd-checkbox-selected-hover-border-color: var(--okd-color-blue-700);
    --okd-checkbox-selected-inner-color: var(--okd-color-text-white);
    --okd-checkbox-selected-shadow: 0px 1px 2px 0px #0000000d;
    --okd-checkbox-selected-hover-shadow: 0px 0px 0px 2px #bdcfff73;
    --okd-checkbox-error-text-color: var(--okd-color-red-700);
    --okd-checkbox-error-border-color: var(--okd-color-red-700);
    --okd-checkbox-error-hover-border-color: var(--okd-color-red-700);
    --okd-checkbox-error-background: var(--okd-color-red-700);
    --okd-checkbox-error-inner-color: var(--okd-color-text-white);
    --okd-checkbox-error-shadow: 0px 1px 2px 0px #0000000d;
    --okd-checkbox-error-hover-shadow: 0px 0px 0px 2px #e35e5e73;
    --okd-checkbox-disabled-text-color: var(--okd-color-gray-300);
    --okd-checkbox-disabled-background: var(--okd-color-gray-050);
    --okd-checkbox-disabled-border-color: var(--okd-color-gray-200);
    --okd-checkbox-disabled-hover-border-color: var(--okd-color-gray-200);
    --okd-checkbox-disabled-inner-color: var(--okd-color-gray-300);
    --okd-checkbox-common-border-radius: var(--okd-border-radius-sm);
    --okd-checkbox-common-label-font-size: var(--okd-font-size-xs);
    --okd-checkbox-sm-font-size: var(--okd-font-size-xs);
    --okd-checkbox-sm-line-height: var(--okd-line-height-xs);
    --okd-checkbox-sm-height: 12px;
    --okd-checkbox-sm-width: 12px;
    --okd-checkbox-sm-margin: 4px;
    --okd-checkbox-sm-padding: 4px;
    --okd-checkbox-md-font-size: var(--okd-font-size-md);
    --okd-checkbox-md-line-height: var(--okd-line-height-md);
    --okd-checkbox-md-height: 16px;
    --okd-checkbox-md-width: 16px;
    --okd-checkbox-md-margin: 8px;
    --okd-checkbox-md-padding: 0;
    --okd-datepicker-default-background: var(--okd-color-text-white);
    --okd-datepicker-default-font-color: var(--okd-color-gray-700);
    --okd-datepicker-title-default-color: var(--okd-color-gray-700);
    --okd-datepicker-title-selected-color: var(--okd-color-blue-700);
    --okd-datepicker-day-default-text-color: var(--okd-color-gray-700);
    --okd-datepicker-day-selected-text-color: var(--okd-color-text-white);
    --okd-datepicker-day-selected-background: var(--okd-color-blue-700);
    --okd-datepicker-day-disable-text-color: var(--okd-color-gray-400);
    --okd-datepicker-day-disable-background: var(--okd-color-gray-100);
    --okd-datepicker-day-hover-background: var(--okd-color-blue-050);
    --okd-datepicker-day-range-background: var(--okd-color-blue-050);
    --okd-datepicker-day-second-color: var(--okd-color-gray-400);
    --okd-datepicker-month-default-text-color: var(--okd-color-gray-700);
    --okd-datepicker-month-selected-text-color: var(--okd-color-text-white);
    --okd-datepicker-month-selected-background: var(--okd-color-blue-700);
    --okd-datepicker-month-disable-text-color: var(--okd-color-gray-400);
    --okd-datepicker-month-disable-background: var(--okd-color-gray-100);
    --okd-datepicker-month-hover-background: var(--okd-color-blue-050);
    --okd-datepicker-year-default-text-color: var(--okd-color-gray-700);
    --okd-datepicker-year-selected-text-color: var(--okd-color-text-white);
    --okd-datepicker-year-selected-background: var(--okd-color-blue-700);
    --okd-datepicker-year-disable-text-color: var(--okd-color-gray-400);
    --okd-datepicker-year-disable-background: var(--okd-color-gray-100);
    --okd-datepicker-year-hover-background: var(--okd-color-blue-050);
    --okd-datepicker-week-default-text-color: var(--okd-color-gray-900);
    --okd-datepicker-today-hover-text-color: var(--okd-color-gray-900);
    --okd-datepicker-today-selected-text-color: var(--okd-color-text-white);
    --okd-datepicker-today-border-color: var(--okd-color-blue-700);
    --okd-datepicker-today-border-hover-color: var(--okd-color-gray-900);
    --okd-datepicker-today-border-disable-color: var(--okd-color-gray-400);
    --okd-datepicker-icon-default-color: var(--okd-color-gray-500);
    --okd-datepicker-footer-border-color: var(--okd-color-gray-100);
    --okd-datepicker-footer-button-color: var(--okd-color-blue-800);
    --okd-datepicker-border-color: var(--okd-color-gray-100);
    --okd-datepicker-input-caret-color: var(--okd-color-blue-600);
    --okd-datepicker-input-placeholder-color: var(--okd-color-gray-400);
    --okd-datepicker-input-border-color: var(--okd-color-blue-700);
    --okd-datepicker-shortcut-background: var(--okd-color-gray-100);
    --okd-datepicker-shortcut-active-background: var(--okd-color-gray-050);
    --okd-datepicker-shortcut-icon-color: var(--okd-color-blue-700);
    --okd-datepicker-md-range-input-font-size: var(--okd-font-size-md);
    --okd-datepicker-sm-range-input-font-size: var(--okd-font-size-xs);
    --okd-datepicker-xs-range-input-font-size: var(--okd-font-size-xs);
    --okd-datepicker-md-range-input-width: 80px;
    --okd-datepicker-sm-range-input-width: 70px;
    --okd-datepicker-xs-range-input-width: 70px;
    --okd-datepicker-dateinput-title-color: var(--okd-color-gray-900);
    --okd-datepicker-dateinput-placeholder-color: var(--okd-color-gray-400);
    --okd-datepicker-dateinput-connector-color: var(--okd-color-gray-700);
    --okd-datepicker-shortcut-text-default-color: var(--okd-color-gray-700);
    --okd-datepicker-shortcut-text-active-color: var(--okd-color-gray-700);
    --okd-dialog-window-background: var(--okd-color-text-white);
    --okd-dialog-window-mask-color: rgba(0, 0, 0, 0.3);
    --okd-dialog-window-box-shadow: var(--okd-shadow-xl);
    --okd-dialog-window-default-text-color: var(--okd-color-gray-700);
    --okd-dialog-window-min-width: 392px;
    --okd-dialog-window-border-radius: 8px;
    --okd-dialog-window-close-btn-color: var(--okd-color-gray-500);
    --okd-dialog-window-close-size: 32px;
    --okd-dialog-window-split-line-border-color: var(--okd-color-gray-100);
    --okd-dialog-tip-window-min-width: 344px;
    --okd-dialog-tip-window-2btn-min-width: 448px;
    --okd-dialog-title-color: var(--okd-color-gray-900);
    --okd-dialog-title-font-size: 18px;
    --okd-dialog-title-line-height: 24px;
    --okd-dialog-title-box-sm-padding-vertical: 12.5px;
    --okd-dialog-title-box-md-padding-vertical: 19px;
    --okd-dialog-sub-title-color: var(--okd-color-gray-500);
    --okd-dialog-sub-title-font-size: var(--okd-font-size-md);
    --okd-dialog-sub-title-line-height: 16px;
    --okd-dialog-tip-title-color: var(--okd-color-gray-900);
    --okd-dialog-tip-title-font-size: 18px;
    --okd-dialog-tip-title-line-height: 24px;
    --okd-dialog-tip-detail-color: var(--okd-color-gray-700);
    --okd-dialog-tip-detail-font-size: 14px;
    --okd-dialog-tip-detail-line-height: 20px;
    --okd-dialog-tip-success-icon-bg: rgba(46, 173, 101, 0.2);
    --okd-dialog-tip-info-icon-bg: rgba(32, 95, 236, 0.2);
    --okd-dialog-tip-prompt-icon-bg: rgba(243, 136, 43, 0.2);
    --okd-dialog-tip-warn-icon-bg: rgba(243, 136, 43, 0.2);
    --okd-dialog-tip-alert-icon-bg: rgba(227, 94, 94, 0.2);
    --okd-dialog-tip-error-icon-bg: rgba(227, 94, 94, 0.2);
    --okd-dialog-tip-success-icon-color: var(--okd-color-green-700);
    --okd-dialog-tip-info-icon-color: var(--okd-color-blue-700);
    --okd-dialog-tip-prompt-icon-color: var(--okd-color-orange-700);
    --okd-dialog-tip-warn-icon-color: var(--okd-color-orange-700);
    --okd-dialog-tip-alert-icon-color: var(--okd-color-red-700);
    --okd-dialog-tip-error-icon-color: var(--okd-color-red-700);
    --okd-dialog-tip-icon-bg-size: 48px;
    --okd-dialog-tip-icon-font-size: 30px;
    --okd-dialog-action-close-btn-color: var(--okd-color-blue-700);
    --okd-dialog-footer-box-sm-padding-vertical: 12px;
    --okd-dialog-footer-box-md-padding-vertical: 18px;
    --okd-dialog-tip-footer-box-sm-padding-vertical: 20px;
    --okd-dialog-tip-footer-box-md-padding-vertical: 24px;
    --okd-dialog-container-sm-padding-horizontal: 16px;
    --okd-dialog-container-md-padding-horizontal: 24px;
    --okd-dialog-container-md-padding-vertical: 24px;
    --okd-dialog-container-sm-padding-vertical: 8px;
    --okd-dialog-window-close-icon-size: 16px;
    --okd-dialog-window-back-icon-size: 14px;
    --okd-drawer-content-bg: var(--okd-color-white);
    --okd-drawer-mask-color: rgba(64, 72, 89, 0.3);
    --okd-upload-active-border-color: var(--okd-color-blue-700);
    --okd-upload-active-logo-color: var(--okd-color-blue-700);
    --okd-upload-active-background-color: rgba(237, 242, 252, 0.45);
    --okd-upload-active-label-color: var(--okd-color-blue-700);
    --okd-upload-error-border-color: var(--okd-color-red-700);
    --okd-upload-error-logo-color: var(--okd-color-red-700);
    --okd-upload-error-background-color: var(--okd-color-transparent);
    --okd-upload-error-label-color: var(--okd-color-red-700);
    --okd-upload-success-border-color: var(--okd-color-gray-200);
    --okd-upload-success-logo-color: var(--okd-color-blue-700);
    --okd-upload-error-retry-text-color: var(--okd-color-blue-700);
    --okd-upload-success-background-color: var(--okd-color-transparent);
    --okd-upload-pc-label-font-size: var(--okd-font-size-base);
    --okd-upload-pc-label-line-height: var(--okd-line-height-base);
    --okd-upload-pc-desc-font-size: var(--okd-font-size-xs);
    --okd-upload-pc-desc-line-height: var(--okd-line-height-xs);
    --okd-upload-mobile-label-font-size: var(--okd-font-size-md);
    --okd-upload-mobile-label-line-height: var(--okd-line-height-md);
    --okd-upload-mobile-desc-font-size: var(--okd-font-size-md);
    --okd-upload-mobile-desc-line-height: var(--okd-line-height-md);
    --okd-upload-filelist-count-font-size: var(--okd-font-size-base);
    --okd-upload-filelist-count-line-height: var(--okd-line-height-base);
    --okd-upload-file-name-font-size: var(--okd-font-size-md);
    --okd-upload-file-name-line-height: var(--okd-line-height-md);
    --okd-upload-file-desc-font-size: var(--okd-font-size-xs);
    --okd-upload-file-desc-line-height: var(--okd-line-height-xs);
    --okd-upload-text-btn-color: var(--okd-color-blue-700);
    --okd-upload-list-font-size: var(--okd-font-size-base);
    --okd-upload-list-line-height: var(--okd-line-height-base);
    --okd-upload-list-color: var(--okd-color-gray-900);
    --okd-upload-list-retry-font-size: var(--okd-font-size-md);
    --okd-upload-list-retry-line-height: var(--okd-line-height-md);
    --okd-upload-list-retry-color: var(--okd-color-blue-700);
    --okd-upload-list-label-font-size: var(--okd-font-size-md);
    --okd-upload-list-label-line-height: var(--okd-line-height-md);
    --okd-upload-list-desc-font-size: var(--okd-font-size-xs);
    --okd-upload-list-desc-line-height: var(--okd-line-height-xs);
    --okd-upload-list-desc-color: var(--okd-color-gray-400);
    --okd-input-default-text-color: var(--okd-color-gray-700);
    --okd-input-default-placeholder-color: var(--okd-color-gray-300);
    --okd-input-default-border-color: var(--okd-color-gray-200);
    --okd-input-default-caret-color: var(--okd-color-blue-600);
    --okd-input-default-shadow: 0 0 0 0 transparent;
    --okd-input-default-background: var(--okd-color-white);
    --okd-input-hover-text-color: var(--okd-input-default-text-color);
    --okd-input-hover-placeholder-color: var(--okd-input-default-placeholder-color);
    --okd-input-hover-border-color: var(--okd-input-default-border-color);
    --okd-input-hover-caret-color: var(--okd-input-default-caret-color);
    --okd-input-hover-shadow: var(--okd-input-default-shadow);
    --okd-input-hover-background: var(--okd-color-white);
    --okd-input-focus-text-color: var(--okd-input-default-text-color);
    --okd-input-focus-placeholder-color: var(--okd-input-default-placeholder-color);
    --okd-input-focus-border-color: var(--okd-color-blue-300);
    --okd-input-focus-caret-color: var(--okd-input-default-caret-color);
    --okd-input-focus-shadow: 0px 0px 0px 2px #bdcfff73;
    --okd-input-focus-background: var(--okd-color-white);
    --okd-input-disabled-text-color: var(--okd-color-text-light);
    --okd-input-disabled-placeholder-color: var(--okd-input-default-placeholder-color);
    --okd-input-disabled-border-color: var(--okd-color-gray-200);
    --okd-input-disabled-caret-color: var(--okd-input-default-caret-color);
    --okd-input-disabled-shadow: 0 0 0 0 transparent;
    --okd-input-disabled-background: var(--okd-color-gray-050);
    --okd-input-error-text-color: var(--okd-input-default-text-color);
    --okd-input-error-placeholder-color: var(--okd-input-default-placeholder-color);
    --okd-input-error-border-color: var(--okd-color-red-500);
    --okd-input-error-caret-color: var(--okd-input-default-caret-color);
    --okd-input-error-shadow: var(--okd-shadow-sm);
    --okd-input-error-background: var(--okd-color-white);
    --okd-input-error-tips-color: var(--okd-color-red-700);
    --okd-input-tips-text-color: var(--okd-color-gray-600);
    --okd-input-icon-color: var(--okd-color-gray-300);
    --okd-input-label-color: var(--okd-color-gray-700);
    --okd-input-action-color: var(--okd-color-blue-700);
    --okd-input-md-label-font-size: var(--okd-font-size-md);
    --okd-input-sm-label-font-size: var(--okd-font-size-xs);
    --okd-input-xs-label-font-size: var(--okd-font-size-xs);
    --okd-input-md-label-line-height: var(--okd-line-height-md);
    --okd-input-sm-label-line-height: var(--okd-line-height-xs);
    --okd-input-xs-label-line-height: var(--okd-line-height-xs);
    --okd-input-md-action-font-size: var(--okd-font-size-md);
    --okd-input-sm-action-font-size: var(--okd-font-size-xs);
    --okd-input-xs-action-font-size: var(--okd-font-size-xs);
    --okd-input-md-action-line-height: var(--okd-line-height-md);
    --okd-input-sm-action-line-height: var(--okd-line-height-xs);
    --okd-input-xs-action-line-height: var(--okd-line-height-xs);
    --okd-input-md-height: 40px;
    --okd-input-md-text-font-size: var(--okd-font-size-md);
    --okd-input-md-border-radius: 4px;
    --okd-input-md-error-font-size: var(--okd-font-size-xs);
    --okd-input-md-error-line-height: var(--okd-line-height-xs);
    --okd-input-md-tip-font-size: var(--okd-font-size-xs);
    --okd-input-md-tip-line-height: var(--okd-line-height-xs);
    --okd-input-md-icon-size: 20px;
    --okd-input-md-icon-margin: 6px;
    --okd-input-sm-height: 32px;
    --okd-input-sm-text-font-size: var(--okd-font-size-xs);
    --okd-input-sm-border-radius: 4px;
    --okd-input-sm-error-font-size: var(--okd-font-size-xs);
    --okd-input-sm-error-line-height: var(--okd-line-height-xs);
    --okd-input-sm-tip-font-size: var(--okd-font-size-xs);
    --okd-input-sm-tip-line-height: var(--okd-line-height-xs);
    --okd-input-sm-icon-size: 16px;
    --okd-input-sm-icon-margin: 4px;
    --okd-input-xs-height: 28px;
    --okd-input-xs-text-font-size: var(--okd-font-size-xs);
    --okd-input-xs-border-radius: 4px;
    --okd-input-xs-error-font-size: var(--okd-font-size-xs);
    --okd-input-xs-error-line-height: var(--okd-line-height-xs);
    --okd-input-xs-tip-font-size: var(--okd-font-size-xs);
    --okd-input-xs-tip-line-height: var(--okd-line-height-xs);
    --okd-input-xs-icon-size: 16px;
    --okd-input-xs-icon-margin: 4px;
    --okd-input-number-default-add-icon-color: var(--okd-color-gray-500);
    --okd-input-number-default-add-icon-background: var(--okd-color-transparent);
    --okd-input-number-hover-add-icon-color: var(--okd-color-gray-700);
    --okd-input-number-hover-add-icon-background: var(--okd-color-transparent);
    --okd-input-number-active-add-icon-color: var(--okd-color-gray-300);
    --okd-input-number-active-add-icon-background: var(--okd-color-gray-100);
    --okd-input-number-disabled-add-icon-color: var(--okd-color-gray-300);
    --okd-input-number-disabled-add-icon-background: var(--okd-color-transparent);
    --okd-input-code-common-btn-color: var(--okd-color-blue-700);
    --okd-input-code-common-btn-disabled-color: var(--okd-color-gray-300);
    --okd-input-code-common-count-color: var(--okd-color-gray-300);
    --okd-input-code-md-btn-font-size: var(--okd-font-size-md);
    --okd-input-code-md-btn-line-height: var(--okd-line-height-md);
    --okd-input-code-md-count-font-size: var(--okd-font-size-md);
    --okd-input-code-md-count-line-height: var(--okd-line-height-md);
    --okd-input-code-sm-btn-font-size: var(--okd-font-size-xs);
    --okd-input-code-sm-btn-line-height: var(--okd-line-height-xs);
    --okd-input-code-sm-count-font-size: var(--okd-font-size-xs);
    --okd-input-code-sm-count-line-height: var(--okd-line-height-xs);
    --okd-input-code-xs-btn-font-size: var(--okd-font-size-xs);
    --okd-input-code-xs-btn-line-height: var(--okd-line-height-xs);
    --okd-input-code-xs-count-font-size: var(--okd-font-size-xs);
    --okd-input-code-xs-count-line-height: var(--okd-line-height-xs);
    --okd-input-search-default-text-color: var(--okd-color-text-amplifed);
    --okd-input-search-default-placeholder-color: var(--okd-color-gray-300);
    --okd-input-search-default-border-color: var(--okd-color-transparent);
    --okd-input-search-default-caret-color: var(--okd-color-blue-600);
    --okd-input-search-default-shadow: 0px 0px 0px 0px transparent;
    --okd-input-search-default-background: var(--okd-color-gray-100);
    --okd-input-search-hover-text-color: var(--okd-color-gray-700);
    --okd-input-search-hover-placeholder-color: var(--okd-color-gray-300);
    --okd-input-search-hover-border-color: var(--okd-color-blue-300);
    --okd-input-search-hover-caret-color: var(--okd-color-blue-600);
    --okd-input-search-hover-shadow: 0px 0px 0px 2px #bdcfff73;
    --okd-input-search-hover-background: var(--okd-color-white);
    --okd-input-search-focus-text-color: var(--okd-color-gray-700);
    --okd-input-search-focus-placeholder-color: var(--okd-color-gray-300);
    --okd-input-search-focus-border-color: var(--okd-color-blue-300);
    --okd-input-search-focus-caret-color: var(--okd-color-blue-600);
    --okd-input-search-focus-shadow: 0px 0px 0px 2px #bdcfff73;
    --okd-input-search-focus-background: var(--okd-color-white);
    --okd-input-search-error-text-color: var(--okd-color-gray-700);
    --okd-input-search-error-placeholder-color: var(--okd-color-gray-300);
    --okd-input-search-error-border-color: var(--okd-color-red-500);
    --okd-input-search-error-caret-color: var(--okd-color-blue-600);
    --okd-input-search-error-shadow: 0 1px 2px 0 #0000000d;
    --okd-input-search-error-background: var(--okd-color-white);
    --okd-input-search-disabled-text-color: var(--okd-color-text-light);
    --okd-input-search-disabled-placeholder-color: var(--okd-color-gray-300);
    --okd-input-search-disabled-border-color: var(--okd-color-transparent);
    --okd-input-search-disabled-caret-color: var(--okd-color-blue-600);
    --okd-input-search-disabled-shadow: 0px 0px 0px 0px transparent;
    --okd-input-search-disabled-background: var(--okd-color-background-2);
    --okd-input-search-prefix-icon-color: var(--okd-color-gray-400);
    --okd-input-search-prefix-icon-size: 13px;
    --okd-input-search-suffix-icon-color: var(--okd-color-text-light);
    --okd-input-search-suffix-icon-size: 13px;
    --okd-input-search-error-tips-color: var(--okd-color-red-700);
    --okd-loader-line-active-color: var(--okd-color-blue-700);
    --okd-loader-line-inactive-color: var(--okd-color-gray-100);
    --okd-loader-primary-active-color: var(--okd-color-blue-700);
    --okd-loader-primary-inactive-color: var(--okd-color-blue-100);
    --okd-loader-neutral-active-color: var(--okd-color-gray-700);
    --okd-loader-neutral-inactive-color: var(--okd-color-gray-200);
    --okd-loader-mask-bg-color: hsla(0, 0%, 100%, 0.85);
    --okd-loader-circle-xl-size: 38px;
    --okd-loader-circle-lg-size: 30px;
    --okd-loader-circle-md-size: 22px;
    --okd-loader-circle-sm-size: 14px;
    --okd-loader-circle-xl-track-width: 2px;
    --okd-loader-circle-lg-track-width: 2px;
    --okd-loader-circle-md-track-width: 2px;
    --okd-loader-circle-sm-track-width: 2px;
    --okd-loader-line-size: 4px;
    --okd-loader-circle-cover-background: var(--okd-color-background-1);
    --okd-loader-mask-text-font-size: 14px;
    --okd-loader-mask-text-line-height: 16px;
    --okd-loader-mask-text-font-weight: 400;
    --okd-loader-mask-text-color: var(--okd-color-gray-900);
    --okd-loader-mask-text-margin-top: 10px;
    --okd-notification-success-icon-color: var(--okd-color-green-700);
    --okd-notification-info-icon-color: var(--okd-color-blue-700);
    --okd-notification-warn-icon-color: var(--okd-color-yellow-700);
    --okd-notification-error-icon-color: var(--okd-color-red-700);
    --okd-notification-title-color: var(--okd-color-gray-700);
    --okd-notification-text-color: var(--okd-color-gray-400);
    --okd-notification-action-confirm-btn-color: var(--okd-color-blue-700);
    --okd-notification-action-cancel-btn-color: var(--okd-color-gray-700);
    --okd-notification-box-close-icon-color: var(--okd-color-gray-400);
    --okd-notification-box-shadow: var(--okd-shadow-xl);
    --okd-notification-box-background: var(--okd-color-white);
    --okd-notification-box-border-color: var(--okd-color-gray-100);
    --okd-notification-box-border-radius: var(--okd-border-radius-md);
    --okd-notification-box-padding: 16px;
    --okd-notification-box-each-margin: 14px;
    --okd-notification-box-max-width: 700px;
    --okd-notification-box-min-width: 451px;
    --okd-notification-box-auto-width-min-width: 100px;
    --okd-notification-box-icon-text-margin: 15px;
    --okd-notification-title-font-size: var(--okd-font-size-md);
    --okd-notification-title-line-height: var(--okd-line-height-md);
    --okd-notification-text-font-size: var(--okd-font-size-md);
    --okd-notification-text-line-height: var(--okd-line-height-md);
    --okd-notification-action-font-size: var(--okd-font-size-md);
    --okd-notification-action-line-height: var(--okd-line-height-md);
    --okd-pagination-normal-background: var(--okd-color-transparent);
    --okd-pagination-hover-background: var(--okd-color-transparent);
    --okd-pagination-active-background: var(--okd-color-transparent);
    --okd-pagination-disabled-background: var(--okd-color-transparent);
    --okd-pagination-normal-text-color: var(--okd-color-gray-400);
    --okd-pagination-hover-text-color: var(--okd-color-gray-700);
    --okd-pagination-active-text-color: var(--okd-color-blue-700);
    --okd-pagination-disabled-text-color: var(--okd-color-gray-200);
    --okd-pagination-normal-border-color: var(--okd-color-gray-400);
    --okd-pagination-hover-border-color: var(--okd-color-gray-700);
    --okd-pagination-active-border-color: var(--okd-color-blue-700);
    --okd-pagination-disabled-border-color: var(--okd-color-gray-200);
    --okd-pagination-load-background: var(--okd-color-gray-100);
    --okd-pagination-load-text-color: var(--okd-color-gray-700);
    --okd-pagination-normal-min-width: 24px;
    --okd-pagination-normal-margin-horizontal: 6px;
    --okd-pagination-normal-margin-vertical: 0;
    --okd-pagination-simple-slash-margin-horizontal: 10px;
    --okd-pagination-simple-slash-margin-vertical: 0;
    --okd-pagination-normal-line-height: var(--okd-line-height-base);
    --okd-pagination-icon-font-size: 16px;
    --okd-pagination-icon-jump-font-size: var(--okd-font-size-md);
    --okd-pagination-border-bottom-height: 2px;
    --okd-pagination-normal-text-new-color: var(--okd-color-gray-900);
    --okd-pagination-hover-text-new-color: var(--okd-color-gray-900);
    --okd-pagination-active-text-new-color: var(--okd-color-white);
    --okd-pagination-normal-background-color: var(--okd-color-transparent);
    --okd-pagination-active-background-color: var(--okd-color-gray-900);
    --okd-pagination-hover-background-color: var(--okd-color-gray-100);
    --okd-pagination-icon-jump-text-color: var(--okd-color-gray-900);
    --okd-pagination-icon-jump-hover-text-color: var(--okd-color-gray-900);
    --okd-pagination-disabled-text-new-color: var(--okd-color-text-light);
    --okd-pagination-simple-default-text-color: var(--okd-color-text-amplifed);
    --okd-pagination-simple-default-line-height: 20px;
    --okd-pagination-default-padding-vertical-size: 8px;
    --okd-pagination-default-padding-horizontal-size: 8px;
    --okd-pagination-default-min-width-size: 32px;
    --okd-pagination-default-height-size: 32px;
    --okd-pagination-default-border-radius: 16px;
    --okd-pagination-default-font-size: 14px;
    --okd-pagination-default-margin-horizontal-size: 16px;
    --okd-pagination-simple-slash-margin-horizontal-size: 16px;
    --okd-popover-background: var(--okd-color-text-white);
    --okd-popover-link-color: var(--okd-color-blue-800);
    --okd-popover-action-color: var(--okd-color-blue-800);
    --okd-popover-title-color: var(--okd-color-gray-900);
    --okd-popover-title-line-height: 20px;
    --okd-popover-title-background: var(--okd-color-background-2);
    --okd-popover-desc-color: var(--okd-color-gray-700);
    --okd-popover-md-font-size: 14px;
    --okd-popover-md-title-font-size: 16px;
    --okd-popover-md-line-height: 20px;
    --okd-popover-sm-font-size: 12px;
    --okd-popover-sm-title-font-size: 14px;
    --okd-popover-sm-line-height: 16px;
    --okd-popover-common-padding: 12px;
    --okd-popover-common-layer-width: 280px;
    --okd-popover-common-layer-shadow: rgba(0, 0, 0, 0.05) 0px 4px 6px -2px, rgba(0, 0, 0, 0.1) 0px 10px 15px -3px;
    --okd-popover-desc-background: var(--okd-color-background-1);
    --okd-popover-layer-background: var(--okd-color-background-1);
    --okd-popover-layer-border-color: rgba(0, 0, 0, 0.02);
    --okd-popup-white-board-background: var(--okd-color-text-white);
    --okd-popup-white-board-shadow: #0000000d 0px 4px 6px -2px, #0000001a 0px 10px 15px -3px;
    --okd-radio-default-text-color: var(--okd-color-gray-700);
    --okd-radio-default-background: var(--okd-color-text-white);
    --okd-radio-default-border-color: var(--okd-color-gray-200);
    --okd-radio-default-hover-border-color: var(--okd-color-blue-300);
    --okd-radio-default-hover-shadow: 0px 0px 0px 2px #bdcfff73;
    --okd-radio-selected-text-color: var(--okd-color-gray-700);
    --okd-radio-selected-background: var(--okd-color-blue-700);
    --okd-radio-selected-border-color: var(--okd-color-blue-700);
    --okd-radio-selected-hover-border-color: var(--okd-color-blue-700);
    --okd-radio-selected-hover-shadow: 0px 0px 0px 2px #bdcfff73;
    --okd-radio-selected-inner-color: var(--okd-color-text-white);
    --okd-radio-error-text-color: var(--okd-color-red-700);
    --okd-radio-error-border-color: var(--okd-color-red-700);
    --okd-radio-error-hover-border-color: var(--okd-color-red-700);
    --okd-radio-error-background: var(--okd-color-red-700);
    --okd-radio-error-inner-color: var(--okd-color-text-white);
    --okd-radio-error-hover-shadow: 0px 0px 0px 2px #e35e5e73;
    --okd-radio-disabled-text-color: var(--okd-color-gray-300);
    --okd-radio-disabled-background: var(--okd-color-gray-050);
    --okd-radio-disabled-border-color: var(--okd-color-gray-200);
    --okd-radio-disabled-hover-border-color: var(--okd-color-gray-200);
    --okd-radio-disabled-inner-color: var(--okd-color-gray-300);
    --okd-radio-disabled-checked-border-color: var(--okd-color-gray-200);
    --okd-radio-disabled-checked-inner-color: var(--okd-color-gray-300);
    --okd-radio-common-label-font-size: var(--okd-font-size-xs);
    --okd-radio-sm-font-size: var(--okd-font-size-xs);
    --okd-radio-sm-line-height: var(--okd-line-height-xs);
    --okd-radio-sm-height: 12px;
    --okd-radio-sm-width: 12px;
    --okd-radio-sm-margin: 4px;
    --okd-radio-sm-padding: 4px;
    --okd-radio-md-font-size: var(--okd-font-size-md);
    --okd-radio-md-line-height: var(--okd-line-height-md);
    --okd-radio-md-height: 16px;
    --okd-radio-md-width: 16px;
    --okd-radio-md-margin: 8px;
    --okd-radio-md-padding: 0;
    --okd-select-common-placeholder-color: var(--okd-color-gray-300);
    --okd-select-common-text-color: var(--okd-color-gray-700);
    --okd-select-common-title-color: var(--okd-color-gray-400);
    --okd-select-common-border-color: var(--okd-color-gray-100);
    --okd-select-option-default-text-color: var(--okd-color-text-amplifed);
    --okd-select-option-hover-text-color: var(--okd-color-text-amplifed);
    --okd-select-option-active-text-color: var(--okd-color-text-amplifed);
    --okd-select-option-disabled-text-color: var(--okd-color-text-lighter);
    --okd-select-option-default-bg: var(--okd-color-white);
    --okd-select-option-hover-bg: var(--okd-color-gray-050);
    --okd-select-option-active-bg: var(--okd-color-white);
    --okd-select-option-disabled-bg: var(--okd-color-white);
    --okd-select-check-default-icon-color: var(--okd-color-blue-700);
    --okd-select-empty-default-icon-color: var(--okd-color-gray-500);
    --okd-select-empty-default-text-color: var(--okd-color-gray-400);
    --okd-select-search-input-bg: var(--okd-color-gray-100);
    --okd-select-search-input-placeholder-color: var(--okd-color-gray-400);
    --okd-select-search-input-color: var(--okd-color-text-amplifed);
    --okd-select-search-input-icon-color: var(--okd-color-gray-500);
    --okd-select-search-input-border-radius: 4px;
    --okd-select-drop-box-border-color: var(--okd-color-gray-100);
    --okd-select-drop-box-shadow: var(--okd-shadow-lg);
    --okd-select-drop-box-bg: var(--okd-color-white);
    --okd-select-drop-box-margin-top: 6px;
    --okd-select-drop-box-border-radius: 4px;
    --okd-select-text-select-default-icon-size: var(--okd-font-size-xs);
    --okd-select-text-select-default-font-color: var(--okd-color-gray-700);
    --okd-select-text-select-hover-font-color: var(--okd-color-gray-500);
    --okd-select-text-select-select-font-color: var(--okd-color-gray-700);
    --okd-select-text-select-disabled-font-color: var(--okd-color-gray-300);
    --okd-select-text-select-default-icon-color: var(--okd-color-gray-600);
    --okd-select-text-select-hover-icon-color: var(--okd-color-gray-400);
    --okd-select-text-select-select-icon-color: var(--okd-color-gray-600);
    --okd-select-text-select-disabled-icon-color: var(--okd-color-gray-200);
    --okd-select-input-select-default-icon-color: var(--okd-color-gray-400);
    --okd-select-input-select-default-icon-size: var(--okd-font-size-xs);
    --okd-select-md-title-font-size: 10px;
    --okd-select-sm-title-font-size: 10px;
    --okd-select-xs-title-font-size: 10px;
    --okd-select-md-title-line-height: var(--okd-select-md-title-font-size);
    --okd-select-sm-title-line-height: var(--okd-select-md-title-font-size);
    --okd-select-xs-title-line-height: var(--okd-select-md-title-font-size);
    --okd-select-md-title-padding-horizontal: 16px;
    --okd-select-md-title-padding-top: 12px;
    --okd-select-md-title-padding-bottom: 4px;
    --okd-select-sm-title-padding-horizontal: 12px;
    --okd-select-sm-title-padding-top: 4px;
    --okd-select-sm-title-padding-bottom: 4px;
    --okd-select-xs-title-padding-horizontal: 12px;
    --okd-select-xs-title-padding-top: 4px;
    --okd-select-xs-title-padding-bottom: 4px;
    --okd-select-md-text-font-size: var(--okd-font-size-md);
    --okd-select-sm-text-font-size: var(--okd-font-size-xs);
    --okd-select-xs-text-font-size: var(--okd-font-size-xs);
    --okd-select-md-option-font-size: var(--okd-font-size-md);
    --okd-select-sm-option-font-size: var(--okd-font-size-xs);
    --okd-select-xs-option-font-size: var(--okd-font-size-xs);
    --okd-select-md-option-line-height: var(--okd-line-height-md);
    --okd-select-sm-option-line-height: var(--okd-line-height-xs);
    --okd-select-xs-option-line-height: var(--okd-line-height-xs);
    --okd-select-md-option-padding-horizontal: 16px;
    --okd-select-md-option-padding-vertical: 11px;
    --okd-select-sm-option-padding-horizontal: 12px;
    --okd-select-sm-option-padding-vertical: 8px;
    --okd-select-xs-option-padding-horizontal: 12px;
    --okd-select-xs-option-padding-vertical: 8px;
    --okd-select-md-check-icon-font-size: 16px;
    --okd-select-sm-check-icon-font-size: 16px;
    --okd-select-xs-check-icon-font-size: 16px;
    --okd-select-md-empty-icon-font-size: 24px;
    --okd-select-sm-empty-icon-font-size: 24px;
    --okd-select-xs-empty-icon-font-size: 24px;
    --okd-select-md-empty-font-size: var(--okd-font-size-md);
    --okd-select-sm-empty-font-size: var(--okd-font-size-md);
    --okd-select-xs-empty-font-size: var(--okd-font-size-md);
    --okd-select-md-search-input-font-size: var(--okd-font-size-md);
    --okd-select-sm-search-input-font-size: var(--okd-font-size-md);
    --okd-select-xs-search-input-font-size: var(--okd-font-size-md);
    --okd-select-md-search-icon-size: 18px;
    --okd-select-sm-search-icon-size: 18px;
    --okd-select-xs-search-icon-size: 18px;
    --okd-select-md-text-select-font-size: var(--okd-font-size-md);
    --okd-select-sm-text-select-font-size: var(--okd-font-size-xs);
    --okd-select-xs-text-select-font-size: var(--okd-font-size-xs);
    --okd-select-md-search-margin-vertical: 8px;
    --okd-select-md-search-margin-horizontal: 16px;
    --okd-select-md-search-height: 28px;
    --okd-select-sm-search-margin-vertical: 8px;
    --okd-select-sm-search-margin-horizontal: 12px;
    --okd-select-sm-search-height: 28px;
    --okd-select-xs-search-margin-vertical: 8px;
    --okd-select-xs-search-margin-horizontal: 12px;
    --okd-select-xs-search-height: 28px;
    --okd-select-option-common-line-color: var(--okd-select-common-border-color);
    --okd-select-option-common-line-height: 1px;
    --okd-select-option-common-line-margin-vertical: 6px;
    --okd-select-md-search-padding-vertical: 5px;
    --okd-select-md-search-padding-horizontal: 8px;
    --okd-select-sm-search-padding-vertical: 5px;
    --okd-select-sm-search-padding-horizontal: 8px;
    --okd-select-xs-search-padding-vertical: 5px;
    --okd-select-xs-search-padding-horizontal: 8px;
    --okd-select-mobile-option-container-padding-vertical: 8px;
    --okd-select-mobile-option-item-container-padding-top: 8px;
    --okd-slider-common-active-color: var(--okd-color-blue-700);
    --okd-slider-common-text-color: var(--okd-color-gray-300);
    --okd-slider-common-track-color: var(--okd-color-gray-100);
    --okd-slider-label-color: var(--okd-color-gray-900);
    --okd-slider-label-font-size: var(--okd-font-size-md);
    --okd-slider-label-line-height: var(--okd-line-height-md);
    --okd-slider-node-border-color: var(--okd-color-gray-100);
    --okd-slider-node-bg-color: #fff;
    --okd-slider-handler-shadow-color: #bdcfff73;
    --okd-slider-handler-border-color: var(--okd-color-gray-200);
    --okd-slider-desc-color: var(--okd-color-gray-400);
    --okd-slider-desc-font-size: var(--okd-font-size-md);
    --okd-slider-desc-line-height: var(--okd-line-height-md);
    --okd-slider-md-handler-size: 18px;
    --okd-slider-md-handler-hover-size: 18px;
    --okd-slider-md-node-size: 12px;
    --okd-slider-md-track-height: 4px;
    --okd-slider-sm-handler-size: 12px;
    --okd-slider-sm-handler-hover-size: 16px;
    --okd-slider-sm-node-size: 8px;
    --okd-slider-sm-track-height: 2px;
    --okd-slider-node-text-color: var(--okd-color-gray-300);
    --okd-steps-process-background: var(--okd-color-blue-700);
    --okd-steps-waiting-background: var(--okd-color-gray-300);
    --okd-steps-finish-background: var(--okd-color-green-800);
    --default-error-background: var(--okd-color-green-800);
    --okd-steps-process-title-color: var(--okd-color-gray-900);
    --okd-steps-waiting-title-color: var(--okd-color-gray-400);
    --okd-steps-finish-title-color: var(--okd-color-gray-900);
    --okd-steps-process-description-color: var(--okd-color-gray-400);
    --okd-steps-waiting-description-color: var(--okd-color-gray-400);
    --okd-steps-finish-description-color: var(--okd-color-gray-400);
    --okd-steps-process-icon-color: var(--okd-color-text-white);
    --okd-steps-waiting-icon-color: var(--okd-color-white);
    --okd-steps-finish-icon-color: var(--okd-color-white);
    --okd-steps-process-border-color: var(--okd-color-gray-100);
    --okd-steps-waiting-border-color: var(--okd-color-gray-100);
    --okd-steps-finish-border-color: var(--okd-color-gray-100);
    --okd-steps-tail-after-background: var(--okd-color-gray-100);
    --okd-steps-horizontal-total-color: var(--okd-color-gray-400);
    --okd-steps-common-icon-size: 24px;
    --okd-steps-common-icon-font-size: var(--okd-font-size-xs);
    --okd-steps-common-title-font-size: 14px;
    --okd-steps-common-description-font-size: var(--okd-font-size-xs);
    --okd-steps-label-vertical-content-margin-top: 8px;
    --okd-steps-label-vertical-content-margin-left: 8px;
    --okd-steps-label-vertical-title-padding-right: 0px;
    --okd-steps-label-vertical-description-max-width: 140px;
    --okd-steps-horizontal-content-margin-left: 8px;
    --okd-steps-horizontal-title-line-height: 20px;
    --okd-steps-vertical-content-margin-left: 32px;
    --okd-steps-vertical-icon-margin-right: 8px;
    --okd-steps-vertical-title-line-height: 20px;
    --okd-steps-vertical-description-line-height: 16px;
    --okd-steps-vertical-description-padding-bottom: 12px;
    --okd-switch-label-font-color: var(--okd-color-gray-700);
    --okd-switch-on-default-track-color: var(--okd-color-blue-600);
    --okd-switch-on-disabled-track-color: var(--okd-color-blue-200);
    --okd-switch-on-loading-track-color: var(--okd-color-blue-200);
    --okd-switch-on-default-handler-color: var(--okd-color-white);
    --okd-switch-on-disabled-handler-color: var(--okd-color-white);
    --okd-switch-on-loading-handler-color: var(--okd-color-white);
    --okd-switch-on-default-handler-shadow: var(--okd-shadow-xs);
    --okd-switch-on-disabled-handler-shadow: var(--okd-shadow-xs);
    --okd-switch-on-loading-handler-shadow: var(--okd-shadow-xs);
    --okd-switch-on-loading-mark-color: var(--okd-color-blue-200);
    --okd-switch-on-focus-shadow: 0px 0px 0px 3px #bdcfff73;
    --okd-switch-off-default-track-color: var(--okd-color-gray-200);
    --okd-switch-off-disabled-track-color: var(--okd-color-gray-100);
    --okd-switch-off-loading-track-color: var(--okd-color-gray-100);
    --okd-switch-off-default-handler-color: var(--okd-color-white);
    --okd-switch-off-disabled-handler-color: var(--okd-color-white);
    --okd-switch-off-loading-handler-color: var(--okd-color-white);
    --okd-switch-off-default-handler-shadow: var(--okd-shadow-xs);
    --okd-switch-off-disabled-handler-shadow: var(--okd-shadow-xs);
    --okd-switch-off-loading-handler-shadow: var(--okd-shadow-xs);
    --okd-switch-off-loading-mark-color: var(--okd-color-gray-100);
    --okd-switch-off-focus-shadow: 0px 0px 0px 3px #bdcfff73;
    --okd-switch-duration-seconds: 0.36s;
    --okd-switch-md-label-size: var(--okd-font-size-base);
    --okd-switch-sm-label-size: var(--okd-font-size-md);
    --okd-switch-md-width: 44px;
    --okd-switch-md-height: 24px;
    --okd-switch-md-handler-size: 20px;
    --okd-switch-sm-width: 28px;
    --okd-switch-sm-height: 16px;
    --okd-switch-sm-handler-size: 12px;
    --okd-tabs-pane-bg-color: var(--okd-color-transparent);
    --okd-tabs-pane-label-color: var(--okd-color-gray-400);
    --okd-tabs-pane-label-active-color: var(--okd-color-gray-700);
    --okd-tabs-pane-icon-color: var(--okd-color-gray-400);
    --okd-tabs-pane-icon-active-color: var(--okd-color-gray-700);
    --okd-tabs-pane-icon-bg-color: var(--okd-color-text-white);
    --okd-tabs-pane-slot-bg-color: var(--okd-color-transparent);
    --okd-tabs-pane-active-color: var(--okd-color-blue-700);
    --okd-tabs-pane-background-color: var(--okd-color-text-white);
    --okd-tabs-pane-nav-shadow-color: var(--okd-color-gray-100);
    --okd-tabs-green-color: var(--okd-color-green-700);
    --okd-tabs-blue-color: var(--okd-color-blue-700);
    --okd-tabs-red-color: var(--okd-color-red-700);
    --okd-tabs-underline-pane-list-border-color: var(--okd-color-gray-100);
    --okd-tabs-underline-pane-list-bg-color: var(--okd-color-gray-100);
    --okd-tabs-underline-pane-blue-label-active-color: var(--okd-color-gray-900);
    --okd-tabs-underline-pane-blue-border-active-color: var(--okd-color-blue-700);
    --okd-tabs-underline-pane-green-border-active-color: var(--okd-color-green-700);
    --okd-tabs-underline-pane-green-label-active-color: var(--okd-color-green-700);
    --okd-tabs-underline-pane-red-border-active-color: var(--okd-color-red-700);
    --okd-tabs-underline-pane-red-label-active-color: var(--okd-color-red-700);
    --okd-tabs-underline-pane-grey-border-active-color: var(--okd-color-gray-900);
    --okd-tabs-underline-pane-grey-label-active-color: var(--okd-color-gray-900);
    --okd-tabs-segmented-pane-bg-color: var(--okd-color-transparent);
    --okd-tabs-segmented-pane-green-bg-active-color: var(--okd-color-green-700);
    --okd-tabs-segmented-pane-green-label-active-color: var(--okd-color-text-white);
    --okd-tabs-segmented-pane-red-bg-active-color: var(--okd-color-red-700);
    --okd-tabs-segmented-pane-red-label-active-color: var(--okd-color-text-white);
    --okd-tabs-segmented-pane-blue-bg-active-color: var(--okd-color-blue-700);
    --okd-tabs-segmented-pane-blue-label-active-color: var(--okd-color-text-white);
    --okd-tabs-segmented-pane-grey-bg-active-color: var(--okd-color-text-white);
    --okd-tabs-segmented-pane-grey-label-active-color: var(--okd-color-gray-700);
    --segmented-pane-label-active-color: var(--okd-tabs-pane-icon-active-color);
    --okd-tabs-segmented-pane-bg-shadow-color: 0px 2px 4px -1px #0000000f, 0px 4px 6px -1px #0000001a;
    --okd-tabs-segmented-pane-list-bg-color: var(--okd-color-gray-100);
    --okd-tabs-muted-pane-border-color: var(--okd-color-gray-200);
    --okd-tabs-muted-pane-blue-border-active-color: var(--okd-color-blue-400);
    --okd-tabs-muted-pane-blue-label-active-color: var(--okd-color-blue-700);
    --okd-tabs-muted-pane-green-border-active-color: var(--okd-color-green-700);
    --okd-tabs-muted-pane-green-label-active-color: var(--okd-color-green-700);
    --okd-tabs-muted-pane-red-border-active-color: var(--okd-color-red-700);
    --okd-tabs-muted-pane-red-label-active-color: var(--okd-color-red-700);
    --okd-tabs-muted-pane-grey-border-active-color: var(--okd-color-gray-200);
    --okd-tabs-muted-pane-grey-label-active-color: var(--okd-color-gray-700);
    --okd-tabs-button-pane-bg-color: var(--okd-color-transparent);
    --okd-tabs-button-pane-border-color: var(--okd-color-gray-200);
    --okd-tabs-button-pane-blue-bg-active-color: var(--okd-color-blue-050);
    --okd-tabs-button-pane-blue-label-active-color: var(--okd-color-blue-700);
    --okd-tabs-button-pane-green-bg-active-color: var(--okd-color-green-700);
    --okd-tabs-button-pane-green-label-active-color: var(--okd-color-text-white);
    --okd-tabs-button-pane-red-bg-active-color: var(--okd-color-red-700);
    --okd-tabs-button-pane-red-label-active-color: var(--okd-color-text-white);
    --okd-tabs-button-pane-grey-bg-active-color: var(--okd-color-gray-100);
    --okd-tabs-button-pane-grey-label-active-color: var(--okd-color-gray-900);
    --okd-tabs-lg-font-size: var(--okd-font-size-md);
    --okd-tabs-md-font-size: var(--okd-font-size-md);
    --okd-tabs-sm-font-size: var(--okd-font-size-xs);
    --okd-tabs-xs-font-size: var(--okd-font-size-xs);
    --okd-tabs-lg-icon-size: 16px;
    --okd-tabs-md-icon-size: 16px;
    --okd-tabs-sm-icon-size: 14px;
    --okd-tabs-xs-icon-size: 14px;
    --okd-tabs-lg-height: 44px;
    --okd-tabs-md-height: 40px;
    --okd-tabs-sm-height: 36px;
    --okd-tabs-xs-height: 28px;
    --okd-tabs-lg-label-padding: 16px;
    --okd-tabs-md-label-padding: 16px;
    --okd-tabs-sm-label-padding: 10px;
    --okd-tabs-xs-label-padding: 10px;
    --okd-tabs-lg-gutter-padding: 4px;
    --okd-tabs-md-gutter-padding: 4px;
    --okd-tabs-sm-gutter-padding: 3px;
    --okd-tabs-xs-gutter-padding: 3px;
    --okd-tabs-lg-margin: 16px;
    --okd-tabs-md-margin: 12px;
    --okd-tabs-sm-margin: 8px;
    --okd-tabs-xs-margin: 8px;
    --okd-tabs-lg-icon-width: 10px;
    --okd-tabs-md-icon-width: 10px;
    --okd-tabs-sm-icon-width: 8px;
    --okd-tabs-xs-icon-width: 8px;
    --okd-tabs-underline-pane-common-border-color: var(--okd-color-gray-100);
    --okd-tabs-underline-pane-common-bg-color: var(--okd-color-gray-100);
    --okd-tabs-button-pane-common-border-color: var(--okd-color-gray-100);
    --okd-tabs-muted-pane-common-border-color: var(--okd-color-transparent);
    --okd-tabs-segmented-pane-common-list-bg-color: var(--okd-color-gray-100);
    --okd-tabs-segmented-pane-common-shadow: 0 1px 3px 0 #0000001a, 0 1px 2px 0 #0000000f;
    --okd-tabs-common-pane-icon-color: var(--okd-color-gray-400);
    --okd-tabs-common-pane-icon-active-color: var(--okd-color-gray-700);
    --okd-tabs-common-pane-icon-bg-color: var(--okd-color-white);
    --okd-tabs-common-pane-label-color: var(--okd-color-gray-400);
    --okd-tabs-common-pane-nav-shadow-color: var(--okd-color-gray-400);
    --okd-tabs-xs-underline-height: 28px;
    --okd-tabs-underline-pane-common-label-color: var(--okd-color-gray-400);
    --okd-tabs-button-pane-common-bg-color: var(--okd-color-transparent);
    --okd-tabs-button-pane-common-label-color: var(--okd-color-gray-400);
    --okd-tabs-muted-pane-common-label-color: var(--okd-color-gray-400);
    --okd-tabs-segmented-pane-common-bg-color: var(--okd-color-transparent);
    --okd-tabs-segmented-pane-common-label-color: var(--okd-color-text-secondary);
    --okd-tabs-xs-underline-font-size: 12px;
    --okd-tabs-xs-underline-label-padding: 10px;
    --okd-tabs-xs-underline-spacing: 8px;
    --okd-tabs-xs-common-icon-size: 14px;
    --okd-tabs-xs-button-font-size: 12px;
    --okd-tabs-xs-button-height: 28px;
    --okd-tabs-xs-button-label-padding: 10px;
    --okd-tabs-xs-button-spacing: 8px;
    --okd-tabs-xs-muted-font-size: 12px;
    --okd-tabs-xs-muted-height: 28px;
    --okd-tabs-xs-muted-label-padding: 10px;
    --okd-tabs-xs-muted-spacing: 8px;
    --okd-tabs-xs-segmented-font-size: 12px;
    --okd-tabs-xs-segmented-height: 28px;
    --okd-tabs-xs-segmented-label-padding: 10px;
    --okd-tabs-xs-segmented-spacing: 2px;
    --okd-tabs-xs-segmented-container-padding: 2px;
    --okd-tabs-sm-underline-font-size: 12px;
    --okd-tabs-sm-underline-height: 36px;
    --okd-tabs-sm-underline-label-padding: 10px;
    --okd-tabs-sm-underline-spacing: 8px;
    --okd-tabs-sm-common-icon-size: 14px;
    --okd-tabs-sm-button-font-size: 12px;
    --okd-tabs-sm-button-height: 36px;
    --okd-tabs-sm-button-label-padding: 10px;
    --okd-tabs-sm-button-spacing: 8px;
    --okd-tabs-sm-muted-font-size: 12px;
    --okd-tabs-sm-muted-height: 36px;
    --okd-tabs-sm-muted-label-padding: 10px;
    --okd-tabs-sm-muted-spacing: 8px;
    --okd-tabs-sm-segmented-font-size: 12px;
    --okd-tabs-sm-segmented-height: 36px;
    --okd-tabs-sm-segmented-label-padding: 10px;
    --okd-tabs-sm-segmented-spacing: 2px;
    --okd-tabs-sm-segmented-container-padding: 2px;
    --okd-tabs-md-underline-font-size: 14px;
    --okd-tabs-md-underline-height: 40px;
    --okd-tabs-md-underline-label-padding: 16px;
    --okd-tabs-md-underline-spacing: 12px;
    --okd-tabs-md-common-icon-size: 16px;
    --okd-tabs-md-button-font-size: 14px;
    --okd-tabs-md-button-height: 40px;
    --okd-tabs-md-button-label-padding: 16px;
    --okd-tabs-md-button-spacing: 8px;
    --okd-tabs-md-muted-font-size: 14px;
    --okd-tabs-md-muted-height: 40px;
    --okd-tabs-md-muted-label-padding: 16px;
    --okd-tabs-md-muted-spacing: 8px;
    --okd-tabs-md-segmented-font-size: 14px;
    --okd-tabs-md-segmented-height: 40px;
    --okd-tabs-md-segmented-label-padding: 16px;
    --okd-tabs-md-segmented-spacing: 2px;
    --okd-tabs-md-segmented-container-padding: 2px;
    --okd-tabs-lg-underline-font-size: 14px;
    --okd-tabs-lg-underline-height: 44px;
    --okd-tabs-lg-underline-label-padding: 16px;
    --okd-tabs-lg-underline-spacing: 16px;
    --okd-tabs-lg-common-icon-size: 16px;
    --okd-tabs-lg-button-font-size: 14px;
    --okd-tabs-lg-button-height: 44px;
    --okd-tabs-lg-button-label-padding: 16px;
    --okd-tabs-lg-button-spacing: 8px;
    --okd-tabs-lg-muted-font-size: 14px;
    --okd-tabs-lg-muted-height: 44px;
    --okd-tabs-lg-muted-label-padding: 16px;
    --okd-tabs-lg-muted-spacing: 8px;
    --okd-tabs-lg-segmented-font-size: 14px;
    --okd-tabs-lg-segmented-height: 44px;
    --okd-tabs-lg-segmented-label-padding: 16px;
    --okd-tabs-lg-segmented-spacing: 2px;
    --okd-tabs-lg-segmented-container-padding: 2px;
    --okd-tabs-xl-common-icon-size: 18px;
    --okd-tabs-xl-underline-font-size: 16px;
    --okd-tabs-xl-underline-height: 48px;
    --okd-tabs-xl-underline-label-padding: 16px;
    --okd-tabs-xl-underline-spacing: 24px;
    --okd-tabs-xl-button-font-size: 16px;
    --okd-tabs-xl-button-height: 48px;
    --okd-tabs-xl-button-label-padding: 16px;
    --okd-tabs-xl-button-spacing: 8px;
    --okd-tabs-xl-muted-font-size: 16px;
    --okd-tabs-xl-muted-height: 48px;
    --okd-tabs-xl-muted-label-padding: 16px;
    --okd-tabs-xl-muted-spacing: 8px;
    --okd-tabs-xl-segmented-font-size: 16px;
    --okd-tabs-xl-segmented-height: 48px;
    --okd-tabs-xl-segmented-label-padding: 16px;
    --okd-tabs-xl-segmented-spacing: 2px;
    --okd-tabs-xl-segmented-container-padding: 2px;
    --okd-tabs-xxl-common-icon-size: 20px;
    --okd-tabs-xxl-underline-font-size: 18px;
    --okd-tabs-xxl-underline-height: 48px;
    --okd-tabs-xxl-underline-label-padding: 16px;
    --okd-tabs-xxl-underline-spacing: 24px;
    --okd-tabs-xxl-button-font-size: 18px;
    --okd-tabs-xxl-button-height: 48px;
    --okd-tabs-xxl-button-label-padding: 16px;
    --okd-tabs-xxl-button-spacing: 8px;
    --okd-tabs-xxl-muted-font-size: 18px;
    --okd-tabs-xxl-muted-height: 48px;
    --okd-tabs-xxl-muted-label-padding: 16px;
    --okd-tabs-xxl-muted-spacing: 8px;
    --okd-tabs-xxl-segmented-font-size: 18px;
    --okd-tabs-xxl-segmented-height: 48px;
    --okd-tabs-xxl-segmented-label-padding: 16px;
    --okd-tabs-xxl-segmented-spacing: 2px;
    --okd-tabs-xxl-segmented-container-padding: 2px;
    --okd-tabs-xxxl-common-icon-size: 20px;
    --okd-tabs-xxxl-underline-font-size: 22px;
    --okd-tabs-xxxl-underline-height: 56px;
    --okd-tabs-xxxl-underline-label-padding: 16px;
    --okd-tabs-xxxl-underline-spacing: 24px;
    --okd-tabs-xxxl-button-font-size: 22px;
    --okd-tabs-xxxl-button-height: 56px;
    --okd-tabs-xxxl-button-label-padding: 16px;
    --okd-tabs-xxxl-button-spacing: 8px;
    --okd-tabs-xxxl-muted-font-size: 22px;
    --okd-tabs-xxxl-muted-height: 56px;
    --okd-tabs-xxxl-muted-label-padding: 16px;
    --okd-tabs-xxxl-muted-spacing: 8px;
    --okd-tabs-xxxl-segmented-font-size: 22px;
    --okd-tabs-xxxl-segmented-height: 56px;
    --okd-tabs-xxxl-segmented-label-padding: 16px;
    --okd-tabs-xxxl-segmented-spacing: 2px;
    --okd-tabs-xxxl-segmented-container-padding: 2px;
    --okd-tabs-common-pane-nav-icon-bg-color-1: #fff;
    --okd-tabs-common-pane-nav-icon-bg-color-2: hsla(0, 0%, 100%, 0);
    --okd-tabs-button-pane-common-border-radius: 4px;
    --okd-tabs-muted-pane-common-border-radius: 4px;
    --okd-tabs-segmented-pane-common-border-radius: 4px;
    --okd-tabs-xxxl-button-font-weight: 500;
    --okd-tabs-lg-button-font-weight: 500;
    --okd-tabs-lg-muted-font-weight: 500;
    --okd-tabs-md-button-font-weight: 500;
    --okd-tabs-md-muted-font-weight: 500;
    --okd-tabs-xl-muted-font-weight: 500;
    --okd-tabs-xl-button-font-weight: 500;
    --okd-tabs-xxxl-muted-font-weight: 500;
    --okd-tabs-xxl-muted-font-weight: 500;
    --okd-tabs-xxl-button-font-weight: 500;
    --okd-tabs-sm-button-font-weight: 500;
    --okd-tabs-sm-muted-font-weight: 500;
    --okd-tabs-xs-button-font-weight: 400;
    --okd-tabs-xs-muted-font-weight: 400;
    --okd-tabs-xs-segmented-font-weight: 400;
    --okd-tabs-sm-segmented-font-weight: 500;
    --okd-tabs-md-segmented-font-weight: 500;
    --okd-tabs-lg-segmented-font-weight: 500;
    --okd-tabs-xl-segmented-font-weight: 500;
    --okd-tabs-xxl-segmented-font-weight: 500;
    --okd-tabs-xxxl-segmented-font-weight: 500;
    --okd-tooltip-default-font-color: var(--okd-color-text-white);
    --okd-tooltip-neutral-background: var(--okd-color-gray-800);
    --okd-tooltip-negative-background: var(--okd-color-red-800);
    --okd-tooltip-positive-background: var(--okd-color-green-800);
    --okd-tooltip-informative-background: var(--okd-color-blue-700);
    --okd-typography-header-muted-color: var(--okd-color-gray-400);
    --okd-typography-header-medium-color: var(--okd-color-gray-900);
    --okd-typography-header-amplified-color: var(--okd-color-gray-900);
    --okd-typography-h1-font-size: 30px;
    --okd-typography-h1-line-height: 32px;
    --okd-typography-h2-font-size: 30px;
    --okd-typography-h2-line-height: 32px;
    --okd-typography-h3-font-size: 18px;
    --okd-typography-h3-line-height: 24px;
    --okd-typography-h4-font-size: 18px;
    --okd-typography-h4-line-height: 24px;
    --okd-typography-h5-font-size: 18px;
    --okd-typography-h5-line-height: 24px;
    --okd-typography-h6-font-size: 18px;
    --okd-typography-h6-line-height: 24px;
    --okd-typography-header-medium-font-weight: 500;
    --okd-typography-header-amplified-font-weight: 500;
    --okd-typography-text-muted-color: var(--okd-color-gray-400);
    --okd-typography-text-medium-color: var(--okd-color-gray-700);
    --okd-typography-text-amplified-color: var(--okd-color-gray-900);
    --okd-typography-text-base-font-size: var(--okd-font-size-base);
    --okd-typography-text-base-line-height: var(--okd-line-height-base);
    --okd-typography-text-md-font-size: var(--okd-font-size-md);
    --okd-typography-text-md-line-height: var(--okd-line-height-md);
    --okd-typography-text-xs-font-size: var(--okd-font-size-xs);
    --okd-typography-text-xs-line-height: var(--okd-line-height-xs);
    --okd-typography-text-medium-font-weight: 400;
    --okd-typography-text-amplified-font-weight: 500;
    --okd-breadcrumbs-primary-current-font-color: var(--okd-color-blue-700);
    --okd-breadcrumbs-primary-icon-color: var(--okd-color-black);
    --okd-breadcrumbs-secondary-current-font-color: var(--okd-color-gray-600);
    --okd-breadcrumbs-secondary-icon-color: var(--okd-color-black);
    --okd-breadcrumbs-common-current-font-weight: 400;
    --okd-breadcrumbs-md-current-font-size: 16px;
    --okd-breadcrumbs-md-current-line-height: 24px;
    --okd-breadcrumbs-sm-current-font-size: 14px;
    --okd-breadcrumbs-sm-current-line-height: 24px;
    --okd-breadcrumbs-xs-current-font-size: 12px;
    --okd-breadcrumbs-xs-current-line-height: 24px;
    --okd-breadcrumbs-lg-current-font-size: 18px;
    --okd-breadcrumbs-lg-current-line-height: 24px;
    --okd-breadcrumbs-lg-icon-font-size: 18px;
    --okd-breadcrumbs-lg-icon-margin-left: 8px;
    --okd-breadcrumbs-lg-icon-margin-right: 8px;
    --okd-breadcrumbs-md-icon-font-size: 16px;
    --okd-breadcrumbs-md-icon-margin-left: 8px;
    --okd-breadcrumbs-md-icon-margin-right: 8px;
    --okd-breadcrumbs-sm-icon-font-size: 14px;
    --okd-breadcrumbs-sm-icon-margin-left: 8px;
    --okd-breadcrumbs-sm-icon-margin-right: 8px;
    --okd-breadcrumbs-xs-icon-font-size: 12px;
    --okd-breadcrumbs-xs-icon-margin-left: 8px;
    --okd-breadcrumbs-xs-icon-margin-right: 8px;
    --okd-hyperlink-primary-default-color: var(--okd-color-blue-700);
    --okd-hyperlink-primary-default-icon-color: var(--okd-color-blue-700);
    --okd-hyperlink-primary-default-underline-color: var(--okd-color-blue-700);
    --okd-hyperlink-primary-hover-color: var(--okd-color-blue-900);
    --okd-hyperlink-primary-hover-icon-color: var(--okd-color-blue-900);
    --okd-hyperlink-primary-hover-underline-color: var(--okd-color-blue-900);
    --okd-hyperlink-secondary-default-color: var(--okd-color-gray-700);
    --okd-hyperlink-secondary-default-icon-color: var(--okd-color-gray-700);
    --okd-hyperlink-secondary-default-underline-color: var(--okd-color-gray-700);
    --okd-hyperlink-secondary-hover-color: var(--okd-color-gray-900);
    --okd-hyperlink-secondary-hover-icon-color: var(--okd-color-gray-900);
    --okd-hyperlink-secondary-hover-underline-color: var(--okd-color-gray-900);
    --okd-hyperlink-xs-font-size: 12px;
    --okd-hyperlink-sm-font-size: 14px;
    --okd-hyperlink-md-font-size: 16px;
    --okd-hyperlink-lg-font-size: 18px;
    --okd-hyperlink-xs-icon-font-size: 12px;
    --okd-hyperlink-sm-icon-font-size: 16px;
    --okd-hyperlink-md-icon-font-size: 16px;
    --okd-hyperlink-lg-icon-font-size: 16px;
    --okd-hyperlink-xs-line-height: 16px;
    --okd-hyperlink-sm-line-height: 16px;
    --okd-hyperlink-md-line-height: 20px;
    --okd-hyperlink-lg-line-height: 24px;
    --okd-hyperlink-medium-font-weight: 500;
    --okd-hyperlink-medium-hover-font-weight: 500;
    --okd-hyperlink-muted-font-weight: 400;
    --okd-hyperlink-muted-hover-font-weight: 400;
    --okd-hyperlink-amplified-font-weight: 600;
    --okd-hyperlink-amplified-hover-font-weight: 600;
    --okd-hyperlink-xs-icon-margin-left: 0px;
    --okd-hyperlink-sm-icon-margin-left: 0px;
    --okd-hyperlink-md-icon-margin-left: 0px;
    --okd-hyperlink-lg-icon-margin-left: 0px;
    --okd-empty-img-width: 100px;
    --okd-empty-img-height: 100px;
    --okd-empty-img-margin-bottom: 20px;
    --okd-empty-title-font-size: 16px;
    --okd-empty-title-light-height: 20px;
    --okd-empty-title-margin-bottom: 10px;
    --okd-empty-title-color: var(--okd-color-gray-700);
    --okd-empty-desc-font-size: 14px;
    --okd-empty-desc-light-height: 158%;
    --okd-empty-desc-margin-bottom: 20px;
    --okd-empty-desc-color: var(--okd-color-gray-500);
    --okd-empty-title-line-height: 20px;
    --okd-empty-desc-line-height: 20px
}

#ada-button-frame {
    display: none !important
}

#ok-ada-button {
    position: fixed;
    bottom: 24px;
    right: 24px;
    height: 44px;
    width: 44px;
    border-radius: 50%;
    border: 0;
    opacity: 1;
    background-image: url(/cdn/assets/imgs/2111/EB098825FDB04EF3.png);
    -webkit-transition: all .3s;
    transition: all .3s;
    background-repeat: no-repeat;
    background-size: 106%;
    background-position: 50%;
    z-index: 10000;
    cursor: pointer
}

#ok-ada-button.ok-ada-button-hide {
    opacity: 0
}

.ok-lang-currency-tip {
    width: 100%;
    bottom: 0;
    z-index: 9500;
    background: rgba(243, 245, 250, .9);
    -webkit-backdrop-filter: blur(10px);
    backdrop-filter: blur(10px);
    position: relative
}

.ok-lang-currency-tip .lang-currency-tip .ok-tip {
    padding: 0 12px;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    position: relative
}

.ok-lang-currency-tip .lang-currency-tip .info {
    color: #3f475a;
    display: -webkit-box;
    display: flex;
    position: relative
}

.ok-lang-currency-tip .lang-currency-tip .info .language {
    margin-right: 30px
}

.ok-lang-currency-tip .lang-currency-tip .info .currency, .ok-lang-currency-tip .lang-currency-tip .info .language {
    position: relative;
    cursor: pointer
}

.ok-lang-currency-tip .lang-currency-tip .info .currency .title, .ok-lang-currency-tip .lang-currency-tip .info .language .title {
    font-size: 10px;
    margin-bottom: 4px
}

.ok-lang-currency-tip .lang-currency-tip .info .language:hover .language-list {
    visibility: visible;
    opacity: 1;
    pointer-events: auto
}

.ok-lang-currency-tip .lang-currency-tip .info .language:hover .language-list .box {
    overflow-y: auto
}

.ok-lang-currency-tip .lang-currency-tip .info .language:hover .arrow {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.ok-lang-currency-tip .lang-currency-tip .info .currency:hover .currency-list {
    visibility: visible;
    opacity: 1;
    pointer-events: auto
}

.ok-lang-currency-tip .lang-currency-tip .info .currency:hover .currency-list .box {
    overflow-y: auto
}

.ok-lang-currency-tip .lang-currency-tip .info .currency:hover .arrow {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.ok-lang-currency-tip .lang-currency-tip .info .currency-select, .ok-lang-currency-tip .lang-currency-tip .info .language-select {
    font-weight: 500;
    border-bottom: 2px solid #2e5cff;
    padding-bottom: 3px;
    font-size: 14px;
    display: -webkit-inline-box;
    display: inline-flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center
}

.ok-lang-currency-tip .lang-currency-tip .info .currency-select .arrow, .ok-lang-currency-tip .lang-currency-tip .info .language-select .arrow {
    display: -webkit-inline-box;
    display: inline-flex;
    font-size: 12px;
    color: #1f2533;
    margin-left: 8px;
    -webkit-transition: all .3s;
    transition: all .3s
}

.ok-lang-currency-tip .lang-currency-tip .info .cur-currency, .ok-lang-currency-tip .lang-currency-tip .info .cur-language {
    color: #1f2533
}

.ok-lang-currency-tip .lang-currency-tip .info .currency-list, .ok-lang-currency-tip .lang-currency-tip .info .language-list {
    overflow: hidden;
    visibility: hidden;
    opacity: 0;
    position: absolute;
    -webkit-transition: all .3s;
    transition: all .3s;
    bottom: 35px;
    pointer-events: none;
    left: 0;
    width: 224px;
    height: 268px;
    background: #fff;
    border: 1px solid #edf0f7;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);
    box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .1), 0 4px 6px -2px rgba(0, 0, 0, .05);
    border-radius: 4px
}

.ok-lang-currency-tip .lang-currency-tip .info .currency-list .box, .ok-lang-currency-tip .lang-currency-tip .info .language-list .box {
    overflow-y: hidden;
    overflow-x: hidden;
    padding: 8px 0;
    height: 268px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.ok-lang-currency-tip .lang-currency-tip .info .currency-list .item, .ok-lang-currency-tip .lang-currency-tip .info .language-list .item {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
    line-height: 20px;
    padding: 8px 16px;
    font-size: 14px;
    cursor: pointer
}

.ok-lang-currency-tip .lang-currency-tip .info .currency-list .item .right, .ok-lang-currency-tip .lang-currency-tip .info .language-list .item .right {
    font-size: 12px;
    color: #205fec
}

.ok-lang-currency-tip .lang-currency-tip .info .currency-list .item:hover, .ok-lang-currency-tip .lang-currency-tip .info .language-list .item:hover {
    background: #f7f9fc
}

.ok-lang-currency-tip .lang-currency-tip .btn-box {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center
}

.ok-lang-currency-tip .lang-currency-tip .btn-box .tip-confirm {
    font-size: 14px;
    color: #1f2533;
    font-weight: 500;
    border-radius: 2px;
    height: 28px;
    background: #fff;
    border: 1px solid #d8dce6;
    cursor: pointer;
    padding: 0 16px
}

@media (max-width: 767px) {
    .ok-lang-currency-tip .lang-currency-tip {
        position: relative
    }

    .ok-lang-currency-tip .lang-currency-tip .ok-tip {
        padding: 14px
    }

    .ok-lang-currency-tip .lang-currency-tip .info {
        font-size: 12px;
        font-weight: 400;
        line-height: 16px;
        margin-right: 8px
    }

    .ok-lang-currency-tip .lang-currency-tip .info .currency-list {
        left: -106px
    }

    .ok-lang-currency-tip .lang-currency-tip .info .currency-list, .ok-lang-currency-tip .lang-currency-tip .info .language-list {
        bottom: 60px
    }

    .ok-lang-currency-tip .lang-currency-tip .info .currency, .ok-lang-currency-tip .lang-currency-tip .info .language {
        padding: 0
    }

    .ok-lang-currency-tip .lang-currency-tip .btn-box .tip-confirm {
        padding: 0 16px;
        height: 28px;
        line-height: 16px;
        font-weight: 500
    }
}

@media (min-width: 768px) {
    .ok-lang-currency-tip {
        position: fixed
    }

    .ok-lang-currency-tip .lang-currency-tip .ok-tip {
        -webkit-box-pack: center;
        justify-content: center
    }

    .ok-lang-currency-tip .lang-currency-tip .info {
        font-size: 14px;
        line-height: 20px;
        margin-right: 86px
    }

    .ok-lang-currency-tip .lang-currency-tip .info .currency, .ok-lang-currency-tip .lang-currency-tip .info .language {
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        align-items: center;
        padding: 16px 0
    }

    .ok-lang-currency-tip .lang-currency-tip .info .currency .title, .ok-lang-currency-tip .lang-currency-tip .info .language .title {
        margin-right: 8px
    }

    .ok-lang-currency-tip .lang-currency-tip .info .currency-list, .ok-lang-currency-tip .lang-currency-tip .info .language-list {
        bottom: 50px
    }

    .ok-lang-currency-tip .lang-currency-tip .btn-box .tip-confirm {
        height: 28px;
        line-height: 20px;
        font-weight: 500
    }
}

@media (min-width: 1024px) {
    .ok-lang-currency-tip .lang-currency-tip .btn-box .tip-confirm {
        height: 28px;
        line-height: 24px
    }
}

@media (min-width: 1270px) {
    .ok-lang-currency-tip .lang-currency-tip {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

@media (min-width: 1270px) and (min-width: 768px) {
    .ok-lang-currency-tip .lang-currency-tip {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) and (min-width: 1024px) {
    .ok-lang-currency-tip .lang-currency-tip {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) and (min-width: 1270px) {
    .ok-lang-currency-tip .lang-currency-tip {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.body-wrap {
    overflow: hidden
}

.header-container {
    min-width: 320px;
    background: #082850
}

.header-container * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.header-wrap {
    width: 100%;
    height: 48px
}

.header-main {
    position: relative;
    height: 48px;
    -webkit-box-pack: justify;
    justify-content: space-between;
    visibility: hidden
}

.header-main, .header-main .logo-container {
    display: -webkit-box;
    display: flex
}

.header-main .logo-wrap {
    text-align: left;
    color: #666;
    height: 48px;
    overflow: hidden;
    margin-right: 5px
}

.header-main .logo-wrap .logo-img {
    width: auto;
    height: 36px;
    min-width: 82px
}

.header-main .logo-wrap .logo-img-new {
    min-width: 63px;
    margin-top: 6px
}

.header-main .logo-wrap .simulated-sign {
    display: none
}

.header-main .mode-container {
    display: -webkit-box;
    display: flex;
    line-height: 48px
}

.header-main .mode-container .nav-text {
    line-height: 48px
}

.header-main .nav-container, .header-main .nav-container .nav-scroll-box {
    display: -webkit-box;
    display: flex;
    -webkit-box-flex: 1;
    flex-grow: 1
}

.header-main .nav-container .nav-scroll-box {
    overscroll-behavior-y: contain;
    position: relative
}

.header-main .nav-container .nav-new-tag {
    display: inline-block;
    margin: auto 0 auto 2px
}

@media (max-width: 767px) {
    .header-main .nav-container .nav-new-tag {
        display: none
    }
}

@media (max-width: 767px) {
    .header-main .nav-container .nav-item .info-extend-box .item-box .nav-new-tag {
        display: inline-block
    }
}

@media (max-width: 767px) {
    .header-main .nav-container .nav-language {
        display: none
    }
}

@media (min-width: 768px) {
    .header-main .nav-container .nav-language {
        display: none
    }
}

@media (min-width: 1024px) {
    .header-main .nav-container .nav-language {
        display: -webkit-box;
        display: flex
    }
}

.header-main .user-no-login, .header-main .user-no-login-container {
    display: none;
    margin-right: 24px;
    padding-top: 8px
}

.header-main .user-no-login-container .passport-btn, .header-main .user-no-login .passport-btn {
    border: 1px solid #fafafa;
    border-radius: 14px;
    color: #fafafa;
    display: inline-block;
    font-size: 14px;
    height: 28px;
    line-height: 14px;
    padding: 6px 8px;
    text-align: center;
    white-space: nowrap;
}

.header-main .user-no-login-container .passport-btn + .passport-btn, .header-main .user-no-login .passport-btn + .passport-btn {
    margin-left: 8px
}

.header-main .user-no-login-container .user-login-btn, .header-main .user-no-login .user-login-btn {
    color: #dcdcdc;
    background: transparent;
    display: inline-block
}

.header-main .user-no-login-container .user-login-btn:hover, .header-main .user-no-login .user-login-btn:hover {
    color: #fff
}

.header-main .action-container {
    display: inline-block;
    position: relative;
    cursor: pointer;
    z-index: 9501
}

.header-main .action-container .icon {
    display: inline-block;
    padding: 14px 0;
    color: hsla(0, 0%, 100%, .8)
}

.header-main .nav-custom .hide-link {
    display: none !important
}

body[data-responsive=true] .header-container[data-transparent=true] {
    /*background: transparent;*/
    height: 0
}

body[data-responsive=true] .header-container[data-transparent=true] .header-wrap {
    /*background: transparent !important;*/
}

body[data-responsive=true] .header-container[data-transparent=true][data-scroll=false] .header-wrap, body[data-responsive=true] .header-container[data-transparent=true][data-scroll=true] .header-wrap {
    -webkit-transition: all .2s;
    transition: all .2s
}

body[data-responsive=true] .header-container[data-transparent=true][data-scroll=true] .header-wrap {
    background: #000
}

@media (min-width: 1024px) {
    body[data-responsive=true] .header-container[data-transparent=true] {
        height: 48px;
        position: absolute;
        width: 100%;
        top: 0;
        z-index: 9500;
        background: transparent
    }

    body[data-responsive=true] .header-container[data-transparent=true][data-scroll=true] .header-wrap {
        background: #000
    }
}

body[data-responsive=false] .header-container[data-transparent=true] {
    height: 48px;
    position: absolute;
    width: 100%;
    top: 0;
    z-index: 9500;
    background: transparent
}

body[data-responsive=false] .header-container[data-transparent=true][data-scroll=true] .header-wrap {
    background: #000
}

#YSF-BTN-HOLDER {
    display: none !important
}

.simulated .header-container .header-wrap .header-main .logo-container {
    pointer-events: none
}

.simulated .header-container .header-wrap .header-main .logo-container .simulated-sign {
    display: inline-block;
    height: 18px;
    line-height: 18px;
    padding: 0 4px;
    background: #000;
    border-radius: 2px;
    font-size: 12px;
    font-weight: 500;
    vertical-align: top;
    color: #fff;
    margin-top: 15px;
    margin-left: 4px
}

.simulated .header-container .header-wrap .header-main .header-split-line, .simulated .header-container .header-wrap .header-main .mode-container .drop-c-left-align, .simulated .header-container .header-wrap .header-main .mode-container .nav-text, .simulated .header-container .header-wrap .header-main .mode-container .new-mode-tab, .simulated .header-container .header-wrap .header-main .mode-container .user-arrow, .simulated .header-container .header-wrap .header-main .nav-container .nav-academy, .simulated .header-container .header-wrap .header-main .nav-container .nav-balance .item-analysis, .simulated .header-container .header-wrap .header-main .nav-container .nav-balance .item-fee, .simulated .header-container .header-wrap .header-main .nav-container .nav-balance .item-recharge, .simulated .header-container .header-wrap .header-main .nav-container .nav-balance .item-report, .simulated .header-container .header-wrap .header-main .nav-container .nav-balance .item-simulated, .simulated .header-container .header-wrap .header-main .nav-container .nav-balance .item-transfer, .simulated .header-container .header-wrap .header-main .nav-container .nav-balance .item-withdrawal, .simulated .header-container .header-wrap .header-main .nav-container .nav-buy, .simulated .header-container .header-wrap .header-main .nav-container .nav-earn, .simulated .header-container .header-wrap .header-main .nav-container .nav-market, .simulated .header-container .header-wrap .header-main .nav-container .nav-mode, .simulated .header-container .header-wrap .header-main .nav-container .nav-more, .simulated .header-container .header-wrap .header-main .nav-container .nav-trade .info-extend-box .extend-box .item-convert, .simulated .header-container .header-wrap .header-main .nav-container .nav-trade .info-extend-box .extend-box .item-dex {
    display: none
}

.simulated .header-container .header-wrap .header-main .nav-container .nav-balance .item-real {
    display: block
}

.user-info-item {
    display: -webkit-box;
    display: flex;
    vertical-align: middle
}

.user-info-item .user-info-simple {
    margin-left: 8px
}

.user-info-item .user-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    overflow: hidden;
    align-self: center;
    flex-shrink: 0
}

.user-info-item .user-avatar img {
    width: 100%;
    height: 100%;
    display: block
}

.user-info-item .user-uid {
    font-size: 12px;
    line-height: 16px;
    color: #9aa1b1;
    margin-top: 2px
}

.footer-container {
    width: 100%;
    background: #0e1014;
    min-width: 320px
}

.footer-container * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.footer-container .footer-wrap .all-language-box {
    position: relative
}

.footer-container .footer-wrap .all-language-box .now-language {
    white-space: nowrap;
    font-size: 14px;
    font-weight: 400;
    color: hsla(0, 0%, 100%, .85);
    cursor: pointer;
    padding: 12px;
    background: #0e1014;
    border-radius: 2px;
    border: 1px solid hsla(0, 0%, 59.2%, .2);
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content;
    min-height: 40px;
    line-height: 20px;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center
}

.footer-container .footer-wrap .all-language-box .now-language .lang-box-icon {
    opacity: .75;
    display: inline-block;
    width: 16px;
    height: 16px;
    font-size: 16px;
    line-height: 16px
}

.footer-container .footer-wrap .all-language-box .now-language .arrow-icon {
    width: 12px;
    height: 12px;
    font-size: 12px;
    line-height: 12px;
    color: hsla(0, 0%, 100%, .35);
    position: relative;
    display: inline-block
}

.footer-container .footer-wrap .all-language-box .now-language .text {
    margin-left: 8px;
    margin-right: 16px;
    vertical-align: bottom
}

.footer-container .footer-wrap .all-language-box .language-list {
    position: absolute;
    bottom: 57px;
    left: 0;
    z-index: 20;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 0 10px 10px 0 rgba(3, 6, 18, .5);
    box-shadow: 0 10px 10px 0 rgba(3, 6, 18, .5);
    background: #191c21;
    border-radius: 2px;
    border: 1px solid #202535;
    padding-top: 12px;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
    transition: all .3s cubic-bezier(.645, .045, .355, 1);
    display: -webkit-box;
    display: flex;
    overflow: hidden
}

.footer-container .footer-wrap .all-language-box .language-list .ul-title {
    font-size: 12px;
    font-weight: 400;
    color: hsla(0, 0%, 100%, .35);
    line-height: 16px;
    margin-bottom: 4px;
    padding-left: 12px
}

.footer-container .footer-wrap .all-language-box .language-list .list-ul {
    height: 100%;
    max-height: 308px;
    overflow-y: hidden;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.footer-container .footer-wrap .all-language-box .language-list .list-ul::-webkit-scrollbar {
    width: 2px
}

.footer-container .footer-wrap .all-language-box .language-list .list-ul::-webkit-scrollbar-track {
    background: #2a2e35
}

.footer-container .footer-wrap .all-language-box .language-list .list-ul::-webkit-scrollbar-thumb {
    background: #545960;
    border-radius: 1px
}

.footer-container .footer-wrap .all-language-box .language-list .language {
    white-space: nowrap;
    height: 48px;
    font-size: 16px;
    font-weight: 500;
    color: hsla(0, 0%, 100%, .45);
    padding: 0 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    position: relative;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center
}

.footer-container .footer-wrap .all-language-box .language-list .language .language-link {
    pointer-events: none;
    color: hsla(0, 0%, 100%, .45)
}

.footer-container .footer-wrap .all-language-box .language-list .language:hover {
    color: hsla(0, 0%, 100%, .85);
    background: #252930
}

.footer-container .footer-wrap .all-language-box .language-list .language .now-select-item, .footer-container .footer-wrap .all-language-box .language-list .language:hover .language-link {
    color: hsla(0, 0%, 100%, .85)
}

.footer-container .footer-wrap .all-language-box .language-list .language .now-select, .footer-container .footer-wrap .all-language-box .language-list .language .select-icon {
    height: 10px;
    top: 50%;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    right: 6px;
    position: absolute
}

.footer-container .footer-wrap .all-language-box .language-list .language .select-icon {
    opacity: .75;
    width: 10px;
    font-size: 12px;
    line-height: 10px;
    color: #fff
}

.footer-container .footer-wrap .all-language-box .language-list .ul-box .list-ul {
    width: 146px;
    max-height: 288px
}

.footer-container .footer-wrap .all-language-box .language-list .ul-box:first-child .list-ul .language {
    padding-right: 16px
}

.footer-container .footer-wrap .all-language-box .language-list .ul-box:last-child .list-ul {
    width: 136px
}

.simulated .footer-container .simulated-hide {
    display: none !important
}
.header-wrap{
    background: #000 !important;
}
body[data-responsive=true] {
    min-width: auto
}

body[data-responsive=true] .header-wrap {
    padding-left: 8px;
    padding-right: 8px
}

@media (min-width: 768px) {
    body[data-responsive=true] .header-wrap {
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    body[data-responsive=true] .header-wrap {
        padding-left: calc((100% - 960px) / 2);
        padding-right: calc((100% - 960px) / 2)
    }
}

@media (min-width: 1270px) {
    body[data-responsive=true] .header-wrap {
        padding-left: calc((100% - 1248px) / 2);
        padding-right: calc((100% - 1248px) / 2)
    }
}

@media (max-width: 1023px) {
    body[data-responsive=true] .header-container {
        height: 48px;
        background: transparent
    }

    body[data-responsive=true] .header-wrap {
        width: 100%;
        height: 48px;
        position: fixed;
        z-index: 9500;
        background: #000
    }

    body[data-responsive=true] .header-main {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px;
        visibility: visible
    }

    body[data-responsive=true] .header-main .mode-logo {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center
    }

    body[data-responsive=true] .header-main .mode-logo .nav-text {
        font-size: 18px;
        font-weight: 500;
        color: hsla(0, 0%, 100%, .85);
        line-height: 48px;
        display: none;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer
    }

    body[data-responsive=true] .header-main .mode-logo .mode-quote {
        width: 4px;
        height: 4px;
        background: hsla(0, 0%, 100%, .85);
        border-radius: 2px;
        margin-right: 4px;
        display: inline-block;
        margin-top: -5px;
        vertical-align: middle;
        margin-left: 4px
    }

    body[data-responsive=true] .header-main .new-mode-tab {
        display: -webkit-box;
        display: flex;
        height: 28px;
        background: hsla(0, 0%, 100%, .15);
        border-radius: 4px;
        margin-left: 20px;
        cursor: pointer;
        padding: 1px
    }

    body[data-responsive=true] .header-main .new-mode-tab .tab-defi, body[data-responsive=true] .header-main .new-mode-tab .tab-exchange {
        padding: 5px 12px;
        font-size: 12px;
        line-height: 16px;
        text-align: justify;
        color: #fff
    }

    body[data-responsive=true] .header-main .new-mode-tab .active {
        background: #205fec;
        -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
        box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
        border-radius: 3px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-desc-pc, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .tab-ms {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .title-ms {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .new-desc, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .title-pc, body[data-responsive=true] .header-main .nav-trade.new .new-convert-box, body[data-responsive=true] .header-main .nav-trade.new .new-system-box, body[data-responsive=true] .header-main .nav-trade.new .old-system-box, body[data-responsive=true] .header-main .nav-trade.new .systemTab, body[data-responsive=true] .header-main .nav-trade.new .tab-ms, body[data-responsive=true] .header-main .nav-trade.new .trade-line, body[data-responsive=true] .header-main .nav-trade.old .new-convert-box, body[data-responsive=true] .header-main .nav-trade.old .new-system-box, body[data-responsive=true] .header-main .nav-trade.old .only-new-box, body[data-responsive=true] .header-main .nav-trade.old .systemTab, body[data-responsive=true] .header-main .nav-trade.old .tab-ms, body[data-responsive=true] .header-main .nav-trade.old .trade-line {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade.new .only-new-box {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade.oldAndNew .systemTab {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade.oldAndNew .new-convert-box, body[data-responsive=true] .header-main .nav-trade.oldAndNew .new-system-box {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade.oldAndNew .only-new-box, body[data-responsive=true] .header-main .nav-trade.oldAndNew .tab-ms, body[data-responsive=true] .header-main .nav-trade.oldAndNew .trade-line {
        display: none
    }

    body[data-responsive=true] .header-main .nav-container .nav-scroll-box {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        width: auto;
        top: 0;
        -webkit-box-flex: 1;
        flex-grow: 1;
        padding: 0;
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: end;
        justify-content: flex-end
    }

    body[data-responsive=true] .header-main .nav-container .nav-scroll-box::-webkit-scrollbar {
        display: none
    }

    body[data-responsive=true] .header-main .nav-container .mode-xl-line, body[data-responsive=true] .header-main .nav-container .nav-academy, body[data-responsive=true] .header-main .nav-container .nav-balance, body[data-responsive=true] .header-main .nav-container .nav-buy, body[data-responsive=true] .header-main .nav-container .nav-custom, body[data-responsive=true] .header-main .nav-container .nav-earn, body[data-responsive=true] .header-main .nav-container .nav-gas, body[data-responsive=true] .header-main .nav-container .nav-language, body[data-responsive=true] .header-main .nav-container .nav-market, body[data-responsive=true] .header-main .nav-container .nav-mobile-download, body[data-responsive=true] .header-main .nav-container .nav-mode, body[data-responsive=true] .header-main .nav-container .nav-more, body[data-responsive=true] .header-main .nav-container .nav-trade, body[data-responsive=true] .header-main .nav-container .nav-user, body[data-responsive=true] .header-main .nav-container .other-wrap, body[data-responsive=true] .header-main .nav-container .profile-wrap, body[data-responsive=true] .header-main .nav-container .user-info-item {
        display: none
    }

    body[data-responsive=true] .header-main .nav-container .mode-line {
        width: 1px;
        height: 16px;
        background: hsla(0, 0%, 100%, .15);
        margin: 16px;
        display: none
    }

    body[data-responsive=true] .header-main .nav-container .mode-line.has-address {
        display: block
    }

    body[data-responsive=true] .header-main .nav-container .mode-no-login {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-container {
        position: fixed;
        right: 0;
        width: 376px;
        background: #082850;
        -webkit-box-shadow: 0 12px 60px rgba(0, 0, 0, .3);
        box-shadow: 0 12px 60px rgba(0, 0, 0, .3);
        height: 100%;
        display: -webkit-box;
        display: flex;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }

    body[data-responsive=true] .header-main.active .nav-scroll-box {
        display: block;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        position: absolute;
        top: 48px;
        width: 376px;
        overflow: scroll;
        height: 95%;
        padding: 0 24px 48px;
        -webkit-box-pack: unset;
        justify-content: unset
    }

    body[data-responsive=true] .header-main.active .nav-wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        width: 100%;
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main.active .nav-item {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        -webkit-box-pack: start;
        justify-content: flex-start;
        padding: 0;
        width: 100%;
        display: -webkit-box;
        display: flex;
        flex-wrap: wrap
    }

    body[data-responsive=true] .header-main.active .nav-item .icon-img {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-item.show-more .user-arrow {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    body[data-responsive=true] .header-main.active .nav-item.show-more .drop-c-left-align, body[data-responsive=true] .header-main.active .nav-item.show-more .drop-c-right-align {
        display: block
    }

    body[data-responsive=true] .header-main.active .nav-item .nav-link, body[data-responsive=true] .header-main.active .nav-item .nav-text {
        font-size: 18px;
        height: 52px;
        padding: 17px 0;
        -webkit-box-flex: 1;
        flex-grow: 1;
        color: hsla(0, 0%, 100%, .85);
        cursor: pointer
    }

    body[data-responsive=true] .header-main.active .nav-item .nav-link:active, body[data-responsive=true] .header-main.active .nav-item .nav-text:active {
        color: hsla(0, 0%, 100%, .85)
    }

    body[data-responsive=true] .header-main.active .nav-item .user-arrow {
        display: inline-block;
        color: hsla(0, 0%, 100%, .85);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        margin-left: 4px;
        margin-right: 4px;
        padding: 20px 0;
        cursor: pointer
    }

    body[data-responsive=true] .header-main.active .nav-item .user-arrow .icon {
        font-size: 12px;
        font-weight: 500;
        pointer-events: none
    }

    body[data-responsive=true] .header-main.active .nav-item .drop-c-left-align .box-item, body[data-responsive=true] .header-main.active .nav-item .drop-c-left-align .extend-link {
        color: hsla(0, 0%, 100%, .6)
    }

    body[data-responsive=true] .header-main.active .nav-gas.hide-gas, body[data-responsive=true] .header-main.active .nav-item .drop-c-left-align .box-item .icon, body[data-responsive=true] .header-main.active .nav-item .drop-c-left-align .extend-link .icon {
        display: none
    }

    body[data-responsive=true] .header-main.active .user-no-login {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        flex-direction: row-reverse;
        padding-top: 0;
        -webkit-box-pack: end;
        justify-content: flex-end;
        position: relative;
        top: auto;
        margin-top: 16px
    }

    body[data-responsive=true] .header-main.active .user-no-login .passport-btn + .passport-btn {
        margin-right: 8px;
        margin-left: 0
    }

    body[data-responsive=true] .header-main.active .mode-no-login {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main.active .header-line {
        display: block;
        margin: 10px 0;
        border-bottom: none
    }

    body[data-responsive=true] .header-main.active .trade-line {
        margin: 6px 0;
        border-bottom: none;
        height: 1px;
        background: #1b274d
    }

    body[data-responsive=true] .header-main.active .profile-wrap {
        display: none;
        min-height: 44px;
        margin-bottom: 20px
    }

    body[data-responsive=true] .header-main.active .profile-wrap .photo {
        height: 44px;
        width: 44px;
        line-height: 44px;
        text-align: center;
        border-radius: 50%;
        background: #2f3e6d;
        display: inline-block
    }

    body[data-responsive=true] .header-main.active .profile-wrap .photo .icon {
        font-size: 40px;
        color: #16234a
    }

    body[data-responsive=true] .header-main.active .profile-wrap .user-avatar {
        width: 40px;
        height: 40px;
        border-radius: 50%;
        align-self: center;
        overflow: hidden;
        flex-shrink: 0
    }

    body[data-responsive=true] .header-main.active .profile-wrap .user-avatar .header-avatar-img, body[data-responsive=true] .header-main.active .profile-wrap .user-avatar img {
        width: 100%;
        height: 100%;
        display: block
    }

    body[data-responsive=true] .header-main.active .profile-wrap .person-info {
        -webkit-box-flex: 1;
        flex-grow: 1;
        padding: 5px 0 5px 8px
    }

    body[data-responsive=true] .header-main.active .profile-wrap .person-info .info-text {
        line-height: 18px;
        font-size: 14px;
        color: #808eb6
    }

    body[data-responsive=true] .header-main.active .profile-wrap .logout {
        height: 30px;
        line-height: 30px;
        width: 36px;
        display: inline-block;
        position: relative;
        text-align: right;
        margin: 7px -3px 7px 0
    }

    body[data-responsive=true] .header-main.active .profile-wrap .logout .icon {
        font-size: 24px;
        display: inline-block;
        color: #808eb6
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align, body[data-responsive=true] .header-main.active .drop-c-right-align {
        position: relative;
        display: none;
        left: auto;
        top: auto;
        width: 100%;
        background: transparent;
        visibility: visible;
        opacity: 1;
        padding: 4px 0 4px 12px
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .info-extend-box, body[data-responsive=true] .header-main.active .drop-c-right-align .info-extend-box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .info-extend-box .item-title, body[data-responsive=true] .header-main.active .drop-c-right-align .info-extend-box .item-title {
        height: 44px;
        padding: 14px 0;
        font-size: 16px;
        color: #808eb6;
        display: inline-block;
        width: 100%
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .info-extend-box .item-title:hover, body[data-responsive=true] .header-main.active .drop-c-right-align .info-extend-box .item-title:hover {
        color: hsla(0, 0%, 100%, .85)
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .info-extend-box .tab-ms, body[data-responsive=true] .header-main.active .drop-c-right-align .info-extend-box .tab-ms {
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        color: #646f84
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box {
        max-width: unset;
        min-width: unset;
        width: 100%;
        margin: 0;
        padding: 0
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .box-title, body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .desc-box, body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .icon-box, body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .item-desc, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .box-title, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .desc-box, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .icon-box, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .item-desc {
        display: none
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .box-item, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .box-item {
        margin: 0;
        height: 44px
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .box-item .item-info, body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .box-item .item-title, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .box-item .item-info, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .box-item .item-title {
        height: 44px;
        padding: 14px 0;
        font-size: 16px;
        color: #808eb6;
        display: inline-block;
        width: 100%
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .box-item .item-info:hover, body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .box-item .item-title:hover, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .box-item .item-info:hover, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .box-item .item-title:hover {
        color: hsla(0, 0%, 100%, .85)
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .box-item .text-box .item-title, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .box-item .text-box .item-title {
        width: auto
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .box-item .text-box .blue-font, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .box-item .text-box .blue-font {
        display: inline-block;
        height: 20px;
        padding: 3px 4px;
        font-size: 14px;
        background: rgba(45, 96, 224, .25);
        border-radius: 2px;
        color: #2d60e0
    }

    body[data-responsive=true] .header-main.active .drop-c-left-align .extend-box .box-item.item-academy, body[data-responsive=true] .header-main.active .drop-c-right-align .extend-box .box-item.item-academy {
        display: none
    }

    body[data-responsive=true] .header-main.active .extend-link {
        height: 44px;
        padding: 14px 0;
        font-size: 16px;
        color: #808eb6;
        display: inline-block;
        width: 100%
    }

    body[data-responsive=true] .header-main.active .extend-link:hover {
        color: hsla(0, 0%, 100%, .85)
    }

    body[data-responsive=true] .header-main.active .extend-link .icon {
        position: relative;
        top: 1px;
        font-size: 16px;
        margin-left: 4px;
        color: #808eb6
    }

    body[data-responsive=true] .header-main.active .community-link .icon, body[data-responsive=true] .header-main.active .community-link .wechat-box, body[data-responsive=true] .header-main.active .mode-line, body[data-responsive=true] .header-main.active .mode-line.has-address, body[data-responsive=true] .header-main.active .nav-address, body[data-responsive=true] .header-main.active .nav-balance, body[data-responsive=true] .header-main.active .nav-balance .item-real, body[data-responsive=true] .header-main.active .nav-balance .item-simulated .nav-game, body[data-responsive=true] .header-main.active .nav-balance .line, body[data-responsive=true] .header-main.active .nav-balance .logout, body[data-responsive=true] .header-main.active .nav-balance .user-account, body[data-responsive=true] .header-main.active .nav-balance .user-info, body[data-responsive=true] .header-main.active .nav-user, body[data-responsive=true] .header-main.active .nav-user .item-real, body[data-responsive=true] .header-main.active .nav-user .item-simulated .nav-game, body[data-responsive=true] .header-main.active .nav-user .line, body[data-responsive=true] .header-main.active .nav-user .logout, body[data-responsive=true] .header-main.active .nav-user .user-account, body[data-responsive=true] .header-main.active .nav-user .user-info {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-custom {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        flex-direction: row-reverse;
        -webkit-box-pack: end;
        justify-content: flex-end
    }

    body[data-responsive=true] .header-main.active .custom-logo, body[data-responsive=true] .header-main.active .nav-language {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-mobile-download .app-box {
        width: 100%
    }

    body[data-responsive=true] .header-main.active .nav-mobile-download .app-box .download-text {
        display: block;
        margin-top: 48px;
        margin-bottom: 8px;
        width: 100%;
        height: 48px;
        border-radius: 2px;
        border: 1px solid hsla(0, 0%, 100%, .2);
        font-size: 16px;
        font-weight: 400;
        color: #fff;
        line-height: 16px;
        padding: 16px 2px;
        text-align: center
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-right-container {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column
    }

    body[data-responsive=true] .header-main.active .pc-mode {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-mode .mode-box {
        width: 100%;
        display: block;
        padding: 12px 0 4px
    }

    body[data-responsive=true] .header-main.active .nav-mode .mode-box .box-item .item-box {
        background: rgba(228, 236, 255, .04);
        border-radius: 4px;
        padding: 12px 24px 12px 16px;
        margin-bottom: 12px
    }

    body[data-responsive=true] .header-main.active .nav-mode .mode-box .box-item .item-box .item-title {
        line-height: 20px;
        color: #dde1eb;
        padding: unset;
        font-size: 14px;
        height: unset;
        margin-bottom: 2px;
        font-weight: 600
    }

    body[data-responsive=true] .header-main.active .nav-mode .mode-box .box-item .item-box .desc-box {
        display: block;
        color: #727b8f
    }

    body[data-responsive=true] .header-main.active .nav-mode .mode-box .box-item .item-box .desc-box .desc {
        visibility: visible;
        font-size: 12px;
        font-weight: 400;
        line-height: 18px;
        color: #7b8293
    }

    body[data-responsive=true] .header-main.active .nav-mode .mode-box .box-item .item-box.active, body[data-responsive=true] .header-main.active .nav-mode.mode-chain .box-item .item-chain, body[data-responsive=true] .header-main.active .nav-mode.mode-okex .box-item .item-okex {
        border: 1px solid #205fec
    }

    body[data-responsive=true] .header-main.is-login .user-no-login {
        display: none
    }

    body[data-responsive=true] .header-main.is-login.active .nav-balance, body[data-responsive=true] .header-main.is-login.active .nav-user, body[data-responsive=true] .header-main.is-login.active .profile-wrap {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main.is-login .nav-balance, body[data-responsive=true] .header-main.is-login .nav-user {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        flex-direction: row-reverse;
        -webkit-box-pack: end;
        justify-content: flex-end
    }

    body[data-responsive=true] .header-main.is-login .nav-balance .user-balance-text, body[data-responsive=true] .header-main.is-login .nav-user .user-balance-text {
        -webkit-box-flex: 1;
        flex-grow: 1;
        text-align: left;
        display: block
    }

    body[data-responsive=true] .header-main.is-login .nav-balance .user-balance-href, body[data-responsive=true] .header-main.is-login .nav-user .user-balance-href {
        display: none
    }

    body[data-responsive=true] .header-main.is-login .header-line {
        height: 1px;
        margin: 16px 0;
        background: hsla(0, 0%, 100%, .15)
    }

    body[data-responsive=true] .header-main.not-login .user-no-login {
        display: -webkit-box;
        display: flex;
        position: relative
    }

    body[data-responsive=true] .header-main .mode-container .drop-c-left-align {
        display: none
    }
}

@media (max-width: 1023px) and (min-width: 768px) {
    body[data-responsive=true] .header-main {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 1023px) and (min-width: 1024px) {
    body[data-responsive=true] .header-main {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 1023px) and (min-width: 1270px) {
    body[data-responsive=true] .header-main {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 767px) {
    body[data-responsive=true] .header-main .mode-logo {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center
    }

    body[data-responsive=true] .header-main .mode-logo .nav-text {
        font-size: 18px;
        font-weight: 500;
        color: hsla(0, 0%, 100%, .85);
        line-height: 48px;
        display: inline-block;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer
    }

    body[data-responsive=true] .header-main .mode-logo .mode-quote {
        width: 4px;
        height: 4px;
        background: hsla(0, 0%, 100%, .85);
        border-radius: 2px;
        margin-right: 4px;
        display: inline-block;
        margin-top: -5px;
        vertical-align: middle;
        margin-left: 4px
    }

    body[data-responsive=true] .header-main .nav-container .user-no-login {
        margin-right: 16px
    }

    body[data-responsive=true] .header-main .mode-container .drop-c-left-align, body[data-responsive=true] .header-main .mode-container .new-mode-tab, body[data-responsive=true] .header-main .nav-container .user-login-btn {
        display: none
    }

    body[data-responsive=true] .header-main.active .user-no-login-container {
        visibility: hidden;
        display: -webkit-box;
        display: flex;
        -webkit-box-flex: 1;
        flex-grow: 1
    }

    body[data-responsive=true] .header-main.active .nav-container {
        width: 100%
    }

    body[data-responsive=true] .header-main.active.not-login .logo-wrap {
        display: none
    }

    body[data-responsive=true] .header-main.active.not-login .user-no-login-container {
        visibility: visible;
        position: relative;
        z-index: 1
    }

    body[data-responsive=true] .header-main.active .nav-scroll-box {
        width: 100%;
        padding-left: 20px;
        padding-right: 20px
    }

    body[data-responsive=true] .header-main.active .nav-scroll-box::-webkit-scrollbar {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-item .user-arrow {
        margin-right: 0
    }

    body[data-responsive=true] .header-main.active .profile-wrap .logout {
        margin: 7px -7px 7px 0
    }

    body[data-responsive=true] .header-main.active .user-no-login {
        display: none
    }

    body[data-responsive=true] .header-main.active .header-line {
        margin: 10px 0;
        border-bottom: none
    }
}

@media (min-width: 1024px) {
    body[data-responsive=true].body[data-scroll-disabled=true] {
        overflow: unset
    }

    body[data-responsive=true] .header-container {
        width: 100%;
        height: 48px
    }

    body[data-responsive=true] .header-main {
        width: 100%
    }

    body[data-responsive=true] .header-wrap {
        width: auto;
        padding-left: 0;
        padding-right: 0
    }

    body[data-responsive=true] .header-main {
        padding: 0 24px;
        margin: 0 auto;
        visibility: visible
    }

    body[data-responsive=true] .header-main .nav-item {
        position: relative;
        padding: 0 14px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    body[data-responsive=true] .header-main .nav-item .nav-link, body[data-responsive=true] .header-main .nav-item .nav-text {
        font-size: 14px;
        font-weight: 400;
        color: hsla(0, 0%, 100%, .85);
        line-height: 48px;
        display: inline-block;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer
    }

    body[data-responsive=true] .header-main .nav-item .nav-link:hover, body[data-responsive=true] .header-main .nav-item .nav-text:hover {
        color: #fff
    }

    body[data-responsive=true] .header-main .nav-item .user-arrow {
        display: inline-block;
        color: hsla(0, 0%, 100%, .85);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        margin-left: 4px
    }

    body[data-responsive=true] .header-main .nav-item .user-arrow .icon {
        font-size: 12px
    }

    body[data-responsive=true] .header-main .nav-item:hover .user-arrow {
        color: #fff;
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    body[data-responsive=true] .header-main .nav-item:hover .drop-c-left-align {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        top: 48px
    }

    body[data-responsive=true] .header-main .new-mode-tab {
        display: -webkit-box;
        display: flex;
        background: hsla(0, 0%, 100%, .15);
        border-radius: 4px;
        margin-left: 20px;
        cursor: pointer;
        padding: 1px
    }

    body[data-responsive=true] .header-main .new-mode-tab .tab-defi, body[data-responsive=true] .header-main .new-mode-tab .tab-exchange {
        padding: 5px 12px;
        font-size: 12px;
        line-height: 16px;
        text-align: justify;
        color: #fff
    }

    body[data-responsive=true] .header-main .new-mode-tab .active {
        background: #205fec;
        -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
        box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
        border-radius: 3px
    }

    body[data-responsive=true] .header-main .header-split-line {
        width: 1px;
        height: 16px;
        background: hsla(0, 0%, 100%, .15);
        margin: 16px 10px 16px 24px
    }

    body[data-responsive=true] .header-main .mode-logo {
        -webkit-box-align: center;
        align-items: center;
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .mode-logo .nav-text {
        font-size: 18px;
        font-weight: 500;
        color: hsla(0, 0%, 100%, .85);
        line-height: 48px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
        display: none
    }

    body[data-responsive=true] .header-main .mode-logo .nav-text .mode-quote {
        width: 4px;
        height: 4px;
        background: hsla(0, 0%, 100%, .85);
        border-radius: 2px;
        margin-right: 4px;
        display: inline-block;
        margin-top: -5px;
        vertical-align: middle;
        margin-left: 4px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align {
        left: -56px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab {
        display: none;
        -webkit-box-align: center;
        align-items: center;
        background: #edf0f7
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab {
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 20px;
        color: #1f2533;
        cursor: pointer;
        padding: 12px 22px;
        position: relative
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .tab-text {
        z-index: 2;
        position: relative
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab.active {
        background: #fff
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab.active .rectangle {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle {
        display: none;
        position: absolute;
        z-index: 1;
        top: 0;
        width: 22px;
        height: 44px;
        background: #fff;
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle:after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        width: 22px;
        height: 44px;
        background: #edf0f7;
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle:before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        width: 22px;
        height: 44px;
        background: #fff
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right {
        left: calc(100% - 9.35px);
        -webkit-transform: skewX(12deg);
        transform: skewX(12deg);
        border-top-right-radius: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right:after {
        left: 100%;
        border-bottom-left-radius: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right:before {
        left: 100%
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left {
        right: calc(100% - 9.35px);
        -webkit-transform: skewX(-12deg);
        transform: skewX(-12deg);
        border-top-left-radius: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left:after {
        right: 100%;
        border-bottom-right-radius: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left:before {
        right: 100%
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab:first-child {
        padding-right: 14px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab + .item-tab {
        margin-left: 32px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .tab-new {
        font-style: normal;
        font-weight: 500;
        font-size: 12px;
        line-height: 16px;
        color: #33b06a;
        background: rgba(51, 176, 106, .1);
        border-radius: 2px;
        height: 16px;
        padding: 0 2px;
        margin-left: 8px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab.flex {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab.hide {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showConvert .systemTab .item-tab[data-tab="3"] {
        background: #fff
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showConvert .new-convert-box, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showConvert .systemTab .item-tab[data-tab="3"] .rectangle {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showConvert .new-system-box, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showConvert .old-system-box {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showNew .systemTab .item-tab[data-tab="2"] {
        background: #fff
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showNew .new-system-box, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showNew .systemTab .item-tab[data-tab="2"] .rectangle {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showNew .new-convert-box, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showNew .old-system-box {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showOld .systemTab .item-tab[data-tab="1"] {
        background: #fff
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showOld .systemTab .item-tab[data-tab="1"] .rectangle {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showOld .new-convert-box, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showOld .new-system-box {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showOld .old-system-box {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .tab-ms {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box + .extend-box {
        margin-left: 12px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box {
        min-width: 320px;
        margin-right: 0
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-title {
        margin-bottom: 8px;
        padding-left: 16px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item {
        margin-bottom: 8px;
        padding: 12px;
        -webkit-transition: all .5s;
        transition: all .5s;
        display: -webkit-box;
        display: flex;
        max-width: 342px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .icon-img {
        flex-shrink: 0;
        height: 36px;
        width: 36px;
        margin-right: 10px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .icon-box {
        margin-right: 8px;
        margin-top: -4px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        width: 100%
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .item-title {
        font-weight: 600;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533;
        margin-bottom: 2px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .title-ms {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .title-pc {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box.hide {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box.show {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .blue-font {
        color: #205fec;
        font-size: 12px;
        background: rgba(32, 95, 236, .1);
        border-radius: 1px 4px 4px 1px;
        padding: 0 6px;
        height: 18px;
        font-weight: 500;
        display: inline-block;
        line-height: 18px;
        vertical-align: text-top
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .item-desc {
        margin-top: 4px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box {
        position: relative
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .desc {
        visibility: visible;
        font-size: 12px;
        font-weight: 400;
        line-height: 18px;
        color: #7b8293
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link {
        position: absolute;
        top: 0;
        visibility: hidden
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link {
        font-size: 12px;
        font-weight: 500;
        line-height: 18px;
        color: #205fec
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link:last-child {
        color: #7b8293
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link:hover {
        color: #205fec
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .split-line {
        width: 1px;
        height: 10px;
        background: #d8dce6;
        display: inline-block;
        margin: 0 8px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover {
        cursor: pointer;
        background: #f4f6fa;
        border-radius: 2px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box .desc {
        visibility: hidden
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box .item-link, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box.new-desc-box .desc {
        visibility: visible
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box.new-desc-box .item-link {
        visibility: hidden
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item[data-monitor-more=crossChainGateway] {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box {
        display: block;
        min-width: 676px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .icon-img, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .icon-img {
        display: block;
        width: 56px;
        height: 56px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .trade-line, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .trade-line {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .item-title, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .item-title {
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533;
        text-align: center
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .tab-ms, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .title-ms, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .tab-ms, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .title-ms {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .title-pc, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .title-pc {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .new-desc-pc, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        -webkit-box-align: center;
        align-items: center;
        padding: 36px 12px 50px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .new-desc-pc .icon-img, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .icon-img {
        margin-bottom: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .new-desc-pc .item-title, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-title {
        font-weight: 600;
        font-size: 18px;
        line-height: 20px;
        text-align: center;
        color: #1f2533;
        margin-bottom: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .new-desc-pc .item-desc, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-desc {
        font-size: 14px;
        line-height: 16px;
        text-align: center;
        color: #7b8293
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .new-desc-pc .item-button, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-button {
        margin-top: 32px;
        background: #205fec;
        border-radius: 2px;
        cursor: pointer;
        font-size: 16px;
        line-height: 20px;
        color: #fff
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .item-desc, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .item-desc {
        width: 100%;
        font-weight: 400;
        font-size: 12px;
        line-height: 16px;
        text-align: center;
        color: #9aa1b1;
        margin-top: 2px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box .item-button, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .item-button {
        background: #2d60e0;
        border: 1px solid #2d60e0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
        box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
        border-radius: 2px;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        color: #fff;
        padding: 8px 22px;
        margin-top: 24px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-convert-box {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .old-system-box {
        padding: 16px 12px 20px;
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .only-new-box {
        padding: 8px 0;
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .only-new-box .extend-box .box-item {
        margin: unset
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .only-new-box .extend-box .box-item:hover .item-box .desc-box .desc {
        visibility: visible
    }

    body[data-responsive=true] .header-main .nav-trade.old .drop-c-left-align .only-new-box, body[data-responsive=true] .header-main .nav-trade.old .systemTab, body[data-responsive=true] .header-main .nav-trade.old .tab-ms, body[data-responsive=true] .header-main .nav-trade.old .trade-line {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade.old .drop-c-left-align .old-system-box {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-trade.new .tab-ms, body[data-responsive=true] .header-main .nav-trade.new .trade-line, body[data-responsive=true] .header-main .nav-trade.old .drop-c-left-align .new-convert-box, body[data-responsive=true] .header-main .nav-trade.old .drop-c-left-align .new-system-box, body[data-responsive=true] .header-main .nav-trade.old .drop-c-left-align .systemTab {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade.new .drop-c-left-align {
        left: -2px
    }

    body[data-responsive=true] .header-main .nav-trade.new .drop-c-left-align .only-new-box {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade.new .drop-c-left-align .new-convert-box, body[data-responsive=true] .header-main .nav-trade.new .drop-c-left-align .new-system-box, body[data-responsive=true] .header-main .nav-trade.new .drop-c-left-align .old-system-box, body[data-responsive=true] .header-main .nav-trade.new .drop-c-left-align .systemTab {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade.oldAndNew .systemTab {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-trade.oldAndNew .tab-ms, body[data-responsive=true] .header-main .nav-trade.oldAndNew .trade-line {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade.oldAndNew .drop-c-left-align {
        width: 715px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    body[data-responsive=true] .header-main .nav-trade.oldAndNew .drop-c-left-align .only-new-box {
        display: none
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align {
        left: -2px;
        padding-top: 8px;
        padding-bottom: 8px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box {
        min-width: 220px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item {
        -webkit-box-align: center;
        align-items: center
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .icon {
        font-size: 24px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .item-info {
        font-weight: 600;
        font-size: 14px;
        line-height: 20px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .desc-box {
        display: none;
        margin-top: 2px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .desc-box .desc {
        visibility: visible;
        font-size: 12px;
        line-height: 18px;
        color: #7b8293
    }

    body[data-responsive=true] .header-main .nav-more .drop-c-left-align {
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        padding-top: 12px;
        padding-bottom: 12px
    }

    body[data-responsive=true] .header-main .nav-more .drop-c-left-align .info-extend-box .extend-box {
        min-width: 190px;
        margin-right: 0
    }

    body[data-responsive=true] .header-main .nav-more .item-academy {
        display: none
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align, body[data-responsive=true] .header-main .nav-more .drop-c-left-align {
        max-width: 700px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .extend-box:last-child, body[data-responsive=true] .header-main .nav-more .drop-c-left-align .extend-box:last-child {
        margin-right: 0
    }

    body[data-responsive=true] .header-main .nav-null {
        -webkit-box-flex: 1;
        flex-grow: 1
    }

    body[data-responsive=true] .header-main .drop-c-left-align, body[data-responsive=true] .header-main .drop-c-right-align {
        position: absolute;
        overflow: hidden;
        border-radius: 4px;
        background: #fff;
        -webkit-box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
        box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
        z-index: 9500;
        visibility: hidden;
        opacity: 0;
        -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
        transition: all .3s cubic-bezier(.645, .045, .355, 1);
        cursor: default;
        pointer-events: none
    }

    body[data-responsive=true] .header-main .drop-c-left-align {
        font-weight: 400;
        top: 58px;
        left: -14px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .info-extend-box {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box {
        margin-right: 48px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box:last-child {
        margin-right: 0
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-title {
        padding-left: 20px;
        font-weight: 600;
        font-size: 12px;
        line-height: 20px;
        color: #9aa1b1
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item {
        display: -webkit-box;
        display: flex;
        margin-bottom: 28px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .icon-img {
        width: 28px;
        flex-shrink: 0
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item:last-child {
        margin-bottom: 0
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .icon-box {
        margin-right: 8px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .icon-box .icon {
        height: 28px;
        width: 28px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .item-box {
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-title {
        font-size: 14px;
        font-weight: 400;
        color: #35384a;
        line-height: 16px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-desc {
        font-size: 12px;
        font-weight: 400;
        color: #a7adba;
        line-height: 14px;
        margin-top: 3px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-info {
        font-size: 14px;
        font-weight: 400;
        color: #35384a
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item:hover .item-box .item-info, body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item:hover .item-box .item-title {
        color: #2d60e0
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box {
        margin-right: 80px;
        min-width: 120px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-title {
        margin-bottom: 10px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        margin-bottom: 0;
        padding: 11px 16px;
        cursor: pointer
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item .icon {
        font-size: 22px;
        color: #91b1ff;
        margin-right: 8px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item .item-box .item-info {
        padding: unset;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item:hover {
        color: #205fec;
        background: #f7f9fc
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item:hover .icon {
        color: #205fec
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item.item-academy {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .drop-c-left-align .line {
        height: 1px;
        background-color: #eff1f4
    }

    body[data-responsive=true] .header-main .user-no-login {
        display: none
    }

    body[data-responsive=true] .header-main .nav-balance, body[data-responsive=true] .header-main .nav-user {
        text-align: right;
        cursor: pointer;
        position: relative;
        line-height: 48px;
        font-weight: 500;
        display: none
    }

    body[data-responsive=true] .header-main .nav-balance:hover .user-balance-href, body[data-responsive=true] .header-main .nav-balance:hover .user-balance-text, body[data-responsive=true] .header-main .nav-balance:hover .user-info, body[data-responsive=true] .header-main .nav-user:hover .user-balance-href, body[data-responsive=true] .header-main .nav-user:hover .user-balance-text, body[data-responsive=true] .header-main .nav-user:hover .user-info {
        color: #fff
    }

    body[data-responsive=true] .header-main .nav-balance:hover .user-arrow, body[data-responsive=true] .header-main .nav-user:hover .user-arrow {
        color: #fff;
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    body[data-responsive=true] .header-main .nav-balance:hover .drop-c-left-align, body[data-responsive=true] .header-main .nav-user:hover .drop-c-left-align {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        top: 48px
    }

    body[data-responsive=true] .header-main .nav-balance .user-balance-href, body[data-responsive=true] .header-main .nav-balance .user-balance-text, body[data-responsive=true] .header-main .nav-balance .user-info, body[data-responsive=true] .header-main .nav-user .user-balance-href, body[data-responsive=true] .header-main .nav-user .user-balance-text, body[data-responsive=true] .header-main .nav-user .user-info {
        color: hsla(0, 0%, 100%, .85);
        font-size: 14px;
        float: left;
        margin-right: 8px;
        height: 48px
    }

    body[data-responsive=true] .header-main .nav-balance .user-info, body[data-responsive=true] .header-main .nav-user .user-info {
        margin-right: 0;
        -webkit-box-align: center;
        align-items: center;
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-balance .user-info .user-loginName, body[data-responsive=true] .header-main .nav-user .user-info .user-loginName {
        display: none;
        font-size: 14px;
        line-height: 20px;
        margin-left: 8px
    }

    body[data-responsive=true] .header-main .nav-balance .user-info .user-loginName.show, body[data-responsive=true] .header-main .nav-user .user-info .user-loginName.show {
        display: none
    }

    body[data-responsive=true] .header-main .nav-balance .user-balance-href, body[data-responsive=true] .header-main .nav-user .user-balance-href {
        display: block
    }

    body[data-responsive=true] .header-main .nav-balance .user-balance-text, body[data-responsive=true] .header-main .nav-user .user-balance-text {
        display: none
    }

    body[data-responsive=true] .header-main .nav-balance .user-arrow, body[data-responsive=true] .header-main .nav-user .user-arrow {
        display: inline-block;
        width: 14px;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    body[data-responsive=true] .header-main .nav-balance .user-arrow .icon, body[data-responsive=true] .header-main .nav-user .user-arrow .icon {
        font-size: 10px;
        width: 14px;
        height: 14px;
        line-height: 14px;
        text-align: center;
        display: inline-block
    }

    body[data-responsive=true] .header-main .nav-balance .drop-c-left-align, body[data-responsive=true] .header-main .nav-user .drop-c-left-align {
        padding: 8px 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        left: -24px;
        min-width: 184px
    }

    body[data-responsive=true] .header-main .nav-balance .drop-c-left-align .extend-link .icon, body[data-responsive=true] .header-main .nav-user .drop-c-left-align .extend-link .icon {
        font-size: 22px;
        color: #91b1ff;
        margin-right: 8px
    }

    body[data-responsive=true] .header-main .nav-balance .drop-c-left-align .extend-link:hover .icon, body[data-responsive=true] .header-main .nav-user .drop-c-left-align .extend-link:hover .icon {
        color: #2d60e0
    }

    body[data-responsive=true] .header-main .nav-user {
        padding-left: 18px;
        padding-right: 10px;
        margin-right: 18px
    }

    body[data-responsive=true] .header-main .nav-user .user-account-text, body[data-responsive=true] .header-main .nav-user .user-arrow {
        display: none
    }

    body[data-responsive=true] .header-main .nav-user .user-info {
        margin-right: 0
    }

    body[data-responsive=true] .header-main .nav-user .user-info .icon {
        font-size: 20px
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align {
        padding-top: 0;
        min-width: 220px
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-info-item {
        min-height: 48px;
        width: 100%;
        line-height: 1;
        padding: 16px 18px 8px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        text-align: left;
        cursor: default
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .line {
        height: 1px;
        width: calc(100% - 36px);
        background: #edf0f7;
        margin: 6px auto
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-account {
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .sub-account {
        padding-top: 14px
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-level {
        display: inline-block;
        line-height: 1;
        text-align: left
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-level .sub-tag-wrap {
        height: 16px;
        line-height: 16px;
        padding: 0 4px;
        background: #dfeafc;
        border-radius: 2px;
        text-align: center;
        display: inline-block;
        margin: 0 3px 0 0
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-level .sub-tag {
        font-weight: 400;
        color: #3075ee;
        -webkit-transform: scale(.83);
        transform: scale(.83);
        font-size: 12px;
        display: inline-block;
        -webkit-transform-origin: top;
        transform-origin: top
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-level .level-tag-wrap {
        height: 14px;
        background: #e4f4ea;
        padding: 2px 4px;
        display: inline-block;
        line-height: 14px;
        margin: 0
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-level .level-tag {
        font-size: 12px;
        color: #4db872;
        font-weight: 600;
        display: inline-block;
        text-align: left;
        -webkit-transform: scale(.83);
        transform: scale(.83);
        vertical-align: middle;
        border-radius: 2px;
        font-style: italic;
        -webkit-transform-origin: top;
        transform-origin: top
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .sub-account-uid {
        font-size: 12px;
        line-height: 16px;
        color: #9aa1b1;
        margin-top: 2px
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .logout {
        margin-top: 0;
        cursor: pointer;
        padding: 10px 18px
    }

    body[data-responsive=true] .header-main .nav-balance {
        padding: 0 12px 0 0
    }

    body[data-responsive=true] .header-main .nav-balance .user-arrow {
        margin-left: 0
    }

    body[data-responsive=true] .header-main .nav-balance .item-real, body[data-responsive=true] .header-main .nav-balance .item-simulated {
        display: none
    }

    body[data-responsive=true] .header-main .nav-balance .drop-c-left-align {
        min-width: 220px;
        left: unset;
        right: -16px
    }

    body[data-responsive=true] .header-main .header-line {
        width: 1px;
        height: 16px;
        background: hsla(0, 0%, 100%, .15);
        margin: 16px 0
    }

    body[data-responsive=true] .header-main .mode-line {
        width: 1px;
        height: 16px;
        background: hsla(0, 0%, 100%, .15);
        margin: 16px 24px 16px 8px
    }

    body[data-responsive=true] .header-main.is-login .user-no-login, body[data-responsive=true] .header-main .mode-xl-line, body[data-responsive=true] .header-main .nav-download, body[data-responsive=true] .header-main .nav-gas, body[data-responsive=true] .header-main .nav-language, body[data-responsive=true] .header-main .nav-mobile-download, body[data-responsive=true] .header-main .nav-notice, body[data-responsive=true] .header-main .other-wrap, body[data-responsive=true] .header-main .pc-mode, body[data-responsive=true] .header-main .profile-wrap, body[data-responsive=true] .header-main .sm-mode {
        display: none
    }

    body[data-responsive=true] .header-main.is-login .nav-balance, body[data-responsive=true] .header-main.is-login .nav-user {
        display: block
    }

    body[data-responsive=true] .header-main.is-login .header-line {
        margin-left: 0;
        margin-right: 24px
    }

    body[data-responsive=true] .header-main.not-login .user-no-login {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main.not-login .header-line {
        display: none
    }

    body[data-responsive=true] .header-main .extend-link {
        padding: 10px 16px;
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533;
        height: unset;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        white-space: nowrap;
        cursor: pointer
    }

    body[data-responsive=true] .header-main .extend-link:hover {
        background: #f4f6fa;
        color: #205fec
    }

    body[data-responsive=true] .header-main .community-link {
        position: relative
    }

    body[data-responsive=true] .header-main .community-link .wechat-box {
        width: 124px;
        padding: 12px;
        background: #fff;
        -webkit-box-shadow: 0 7px 14px 0 rgba(0, 0, 0, .1);
        box-shadow: 0 7px 14px 0 rgba(0, 0, 0, .1);
        border-radius: 4px;
        position: absolute;
        top: 58px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        display: none
    }

    body[data-responsive=true] .header-main .community-link .wechat-box img {
        height: 100%;
        width: 100%
    }

    body[data-responsive=true] .header-main .community-link .wechat-box:before {
        content: "";
        display: block;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        top: -6px;
        width: 0;
        height: 0;
        border-color: transparent transparent #fff;
        border-style: solid;
        border-width: 0 6px 6px
    }

    body[data-responsive=true] .header-main .community-link .wechat-box .qr-code-desc {
        text-align: center;
        font-size: 10px;
        line-height: 12px;
        color: #1f2533;
        max-width: 100px;
        white-space: normal;
        margin-top: 8px
    }

    body[data-responsive=true] .header-main .community-link:hover .wechat-box {
        display: block
    }

    body[data-responsive=true] .header-main .nav-gas.hide-gas {
        display: none
    }

    body[data-responsive=true] .header-main .nav-dashboard, body[data-responsive=true] .header-main .nav-nft {
        display: block
    }

    body[data-responsive=true] .header-main .nav-buy {
        -webkit-box-ordinal-group: 2;
        order: 1
    }

    body[data-responsive=true] .header-main .nav-market {
        -webkit-box-ordinal-group: 3;
        order: 2
    }

    body[data-responsive=true] .header-main .nav-trade {
        -webkit-box-ordinal-group: 4;
        order: 3
    }

    body[data-responsive=true] .header-main .nav-earn {
        -webkit-box-ordinal-group: 5;
        order: 4
    }

    body[data-responsive=true] .header-main .nav-academy {
        -webkit-box-ordinal-group: 6;
        order: 5
    }

    body[data-responsive=true] .header-main .nav-more {
        -webkit-box-ordinal-group: 7;
        order: 6
    }

    body[data-responsive=true] .header-main .nav-null {
        -webkit-box-ordinal-group: 8;
        order: 7
    }

    body[data-responsive=true] .header-main .header-search-box {
        -webkit-box-ordinal-group: 9;
        order: 8
    }

    body[data-responsive=true] .header-main .user-no-login {
        -webkit-box-ordinal-group: 10;
        order: 9
    }

    body[data-responsive=true] .header-main .nav-balance {
        -webkit-box-ordinal-group: 11;
        order: 10
    }

    body[data-responsive=true] .header-main .nav-user {
        -webkit-box-ordinal-group: 12;
        order: 11
    }

    body[data-responsive=true] .header-main .header-line {
        -webkit-box-ordinal-group: 13;
        order: 12
    }

    body[data-responsive=true] .header-main .nav-right-section {
        -webkit-box-ordinal-group: 14;
        order: 13
    }

    body[data-responsive=true] .header-main .nav-dashboard {
        -webkit-box-ordinal-group: 2;
        order: 1
    }

    body[data-responsive=true] .header-main .nav-invest {
        -webkit-box-ordinal-group: 3;
        order: 2
    }

    body[data-responsive=true] .header-main .nav-nft {
        -webkit-box-ordinal-group: 4;
        order: 3
    }

    body[data-responsive=true] .header-main .nav-game {
        -webkit-box-ordinal-group: 5;
        order: 4
    }

    body[data-responsive=true] .header-main .nav-address {
        -webkit-box-ordinal-group: 11;
        order: 10
    }

    body[data-responsive=true] .header-main .mode-line {
        -webkit-box-ordinal-group: 13;
        order: 12
    }
}

@media (min-width: 1024px) and (min-width: 1024px) {
    body[data-responsive=true] .header-main .nav-user {
        position: static
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align {
        left: unset;
        right: 0
    }
}

@media (min-width: 1024px) and (min-width: 1270px) {
    body[data-responsive=true] .header-main .nav-user {
        position: relative
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align {
        left: -28px;
        right: unset
    }
}

@media (max-width: 1269px) and (min-width: 1024px) {
    body[data-responsive=true] .header-main .nav-scroll-box .nav-trade .drop-c-left-align .extend-box .item-box {
        width: 100%
    }

    body[data-responsive=true] .header-main .nav-scroll-box .nav-trade .drop-c-left-align .extend-box .box-title {
        padding-left: 22px
    }

    body[data-responsive=true] .header-main .nav-scroll-box .nav-trade .drop-c-left-align .extend-box .box-item {
        padding-right: 20px;
        padding-left: 20px
    }

    body[data-responsive=true] .header-main .nav-scroll-box .nav-trade .drop-c-left-align .new-system-box {
        min-width: 698px
    }

    body[data-responsive=true] .header-main .nav-scroll-box .nav-more .item-academy {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-scroll-box .nav-academy {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-right-section {
        position: fixed;
        right: 0;
        width: 376px;
        background: #082850;
        -webkit-box-shadow: 0 12px 60px rgba(0, 0, 0, .3);
        box-shadow: 0 12px 60px rgba(0, 0, 0, .3);
        height: 100%;
        display: -webkit-box;
        display: flex;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        z-index: 9500
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-right-container {
        display: block;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        position: absolute;
        top: 48px;
        width: 376px;
        overflow: scroll;
        height: 95%;
        padding: 0 24px 48px;
        -webkit-box-pack: unset;
        justify-content: unset
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-right-container::-webkit-scrollbar {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        width: 100%;
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-item {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        -webkit-box-pack: start;
        justify-content: flex-start;
        padding: 0;
        width: 100%;
        display: -webkit-box;
        display: flex;
        flex-wrap: wrap
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-item .icon-img {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-item.show-more .user-arrow {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-item.show-more .drop-c-left-align, body[data-responsive=true] .header-main.active .nav-right-section .nav-item.show-more .drop-c-right-align {
        display: block;
        pointer-events: visible
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-item .nav-link, body[data-responsive=true] .header-main.active .nav-right-section .nav-item .nav-text {
        font-size: 18px;
        height: 52px;
        padding: 17px 0;
        -webkit-box-flex: 1;
        flex-grow: 1;
        color: hsla(0, 0%, 100%, .85);
        cursor: pointer;
        line-height: unset;
        font-weight: unset
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-item .nav-link:active, body[data-responsive=true] .header-main.active .nav-right-section .nav-item .nav-text:active {
        color: hsla(0, 0%, 100%, .85)
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-item .user-arrow {
        display: inline-block;
        color: hsla(0, 0%, 100%, .85);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        margin-left: 4px;
        margin-right: 4px;
        padding: 20px 0;
        cursor: pointer
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-item .user-arrow .icon {
        font-size: 12px;
        font-weight: 500;
        pointer-events: none
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-item .header-line {
        display: block;
        margin: 10px 0;
        border-bottom: none
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-item .drop-c-left-align .box-item, body[data-responsive=true] .header-main.active .nav-right-section .nav-item .drop-c-left-align .extend-link {
        color: hsla(0, 0%, 100%, .6)
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-gas.hide-gas, body[data-responsive=true] .header-main.active .nav-right-section .nav-item .drop-c-left-align .box-item .icon, body[data-responsive=true] .header-main.active .nav-right-section .nav-item .drop-c-left-align .extend-link .icon {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align {
        position: relative;
        display: none;
        left: auto;
        top: auto;
        width: 100%;
        background: transparent;
        visibility: visible;
        opacity: 1;
        padding: 4px 0 4px 12px
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .info-extend-box, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .info-extend-box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .info-extend-box .item-title, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .info-extend-box .item-title {
        height: 44px;
        padding: 14px 0;
        font-size: 16px;
        color: #808eb6;
        display: inline-block;
        width: 100%
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .info-extend-box .item-title:hover, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .info-extend-box .item-title:hover {
        color: hsla(0, 0%, 100%, .85);
        background: transparent
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .info-extend-box .tab-ms, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .info-extend-box .tab-ms {
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        color: #646f84
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box {
        max-width: unset;
        min-width: unset;
        width: 100%;
        margin: 0;
        padding: 0
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-title, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box .desc-box, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box .icon-box, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box .item-desc, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-title, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box .desc-box, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box .icon-box, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box .item-desc {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item {
        margin: 0;
        height: 44px
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .item-info, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .item-title, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .item-info, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .item-title {
        height: 44px;
        padding: 14px 0;
        font-size: 16px;
        color: #808eb6;
        display: inline-block;
        width: 100%
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .item-info:hover, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .item-title:hover, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .item-info:hover, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .item-title:hover {
        color: hsla(0, 0%, 100%, .85);
        background: transparent
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .text-box .item-title, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .text-box .item-title {
        width: auto
    }

    body[data-responsive=true] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .text-box .blue-font, body[data-responsive=true] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .text-box .blue-font {
        display: inline-block;
        height: 20px;
        padding: 3px 4px;
        font-size: 14px;
        background: rgba(45, 96, 224, .25);
        border-radius: 2px;
        color: #2d60e0
    }

    body[data-responsive=true] .header-main.active .nav-right-section .extend-link {
        height: 44px;
        padding: 14px 0;
        font-size: 16px;
        color: #808eb6;
        display: inline-block;
        width: 100%
    }

    body[data-responsive=true] .header-main.active .nav-right-section .extend-link:hover {
        color: hsla(0, 0%, 100%, .85);
        background: transparent
    }

    body[data-responsive=true] .header-main.active .nav-right-section .extend-link .icon {
        position: relative;
        top: 1px;
        font-size: 16px;
        margin-left: 4px;
        color: #808eb6
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-custom {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        flex-direction: row-reverse;
        -webkit-box-pack: end;
        justify-content: flex-end;
        line-height: unset
    }

    body[data-responsive=true] .header-main.active .nav-right-section .custom-logo, body[data-responsive=true] .header-main.active .nav-right-section .nav-language {
        display: none
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-mode .mode-box {
        width: 100%;
        display: block;
        padding: 12px 0 4px
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-mode .mode-box .box-item .item-box {
        background: rgba(228, 236, 255, .04);
        border-radius: 4px;
        padding: 12px 24px 12px 16px;
        margin-bottom: 12px
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-mode .mode-box .box-item .item-box .item-title {
        line-height: 20px;
        color: #dde1eb;
        padding: unset;
        font-size: 14px;
        height: unset;
        margin-bottom: 2px;
        font-weight: 600
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-mode .mode-box .box-item .item-box .desc-box {
        display: block;
        color: #727b8f
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-mode .mode-box .box-item .item-box .desc-box .desc {
        visibility: visible;
        font-size: 12px;
        font-weight: 400;
        line-height: 18px;
        color: #7b8293
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-mode .mode-box .box-item .item-box.active, body[data-responsive=true] .header-main.active .nav-right-section .nav-mode.mode-chain .box-item .item-chain, body[data-responsive=true] .header-main.active .nav-right-section .nav-mode.mode-okex .box-item .item-okex {
        border: 1px solid #205fec
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-mobile-download .app-box {
        width: 100%
    }

    body[data-responsive=true] .header-main.active .nav-right-section .nav-mobile-download .app-box .download-text {
        display: block;
        margin-top: 48px;
        margin-bottom: 8px;
        width: 100%;
        height: 48px;
        border-radius: 2px;
        border: 1px solid hsla(0, 0%, 100%, .2);
        font-size: 16px;
        font-weight: 400;
        color: #fff;
        line-height: 16px;
        padding: 16px 2px;
        text-align: center
    }

    body[data-responsive=true] .header-main.active .action-container {
        position: fixed;
        right: 24px;
        top: 0
    }
}

@media (min-width: 1270px) {
    body[data-responsive=true] .header-container {
        width: 100%;
        height: 48px
    }

    body[data-responsive=true] .header-main {
        width: 100%
    }

    body[data-responsive=true] .header-wrap {
        width: auto;
        padding-left: 0;
        padding-right: 0
    }

    body[data-responsive=true] .header-main {
        padding: 0 24px;
        margin: 0 auto;
        visibility: visible
    }

    body[data-responsive=true] .header-main .pc-mode, body[data-responsive=true] .header-main .sm-mode {
        display: none
    }

    body[data-responsive=true] .header-main .new-mode-tab {
        display: -webkit-box;
        display: flex;
        background: hsla(0, 0%, 100%, .15);
        border-radius: 4px;
        margin-left: 20px;
        cursor: pointer;
        padding: 1px
    }

    body[data-responsive=true] .header-main .new-mode-tab .tab-defi, body[data-responsive=true] .header-main .new-mode-tab .tab-exchange {
        padding: 5px 12px;
        font-size: 12px;
        line-height: 16px;
        text-align: justify;
        color: #fff
    }

    body[data-responsive=true] .header-main .new-mode-tab .active {
        background: #205fec;
        -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
        box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
        border-radius: 3px
    }

    body[data-responsive=true] .header-main .header-split-line {
        width: 1px;
        height: 16px;
        background: hsla(0, 0%, 100%, .15);
        margin: 16px 10px 16px 24px
    }

    body[data-responsive=true] .header-main .mode-logo {
        -webkit-box-align: center;
        align-items: center;
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .mode-logo .nav-text {
        font-size: 18px;
        font-weight: 500;
        color: hsla(0, 0%, 100%, .85);
        line-height: 48px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
        display: none
    }

    body[data-responsive=true] .header-main .mode-logo .nav-text .mode-quote {
        width: 4px;
        height: 4px;
        background: hsla(0, 0%, 100%, .85);
        border-radius: 2px;
        margin-right: 4px;
        display: inline-block;
        margin-top: -5px;
        vertical-align: middle;
        margin-left: 4px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align {
        left: -56px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab {
        display: none;
        -webkit-box-align: center;
        align-items: center;
        background: #edf0f7
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab {
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 20px;
        color: #1f2533;
        cursor: pointer;
        padding: 12px 22px;
        position: relative
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .tab-text {
        z-index: 2;
        position: relative
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab.active {
        background: #fff
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab.active .rectangle {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle {
        display: none;
        position: absolute;
        z-index: 1;
        top: 0;
        width: 22px;
        height: 44px;
        background: #fff;
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle:after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        width: 22px;
        height: 44px;
        background: #edf0f7;
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle:before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        width: 22px;
        height: 44px;
        background: #fff
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right {
        left: calc(100% - 9.35px);
        -webkit-transform: skewX(12deg);
        transform: skewX(12deg);
        border-top-right-radius: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right:after {
        left: 100%;
        border-bottom-left-radius: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right:before {
        left: 100%
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left {
        right: calc(100% - 9.35px);
        -webkit-transform: skewX(-12deg);
        transform: skewX(-12deg);
        border-top-left-radius: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left:after {
        right: 100%;
        border-bottom-right-radius: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left:before {
        right: 100%
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab:first-child {
        padding-right: 14px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab + .item-tab {
        margin-left: 32px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab .tab-new {
        font-style: normal;
        font-weight: 500;
        font-size: 12px;
        line-height: 16px;
        color: #33b06a;
        background: rgba(51, 176, 106, .1);
        border-radius: 2px;
        height: 16px;
        padding: 0 2px;
        margin-left: 8px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab.flex {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .systemTab.hide {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showNew .new-system-box {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showNew .old-system-box, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showOld .new-system-box {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align.showOld .old-system-box {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .tab-ms {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box + .extend-box {
        margin-left: 12px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box {
        min-width: 320px;
        margin-right: 0
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-title {
        margin-bottom: 8px;
        padding-left: 16px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item {
        margin-bottom: 8px;
        padding: 12px;
        -webkit-transition: all .5s;
        transition: all .5s;
        display: -webkit-box;
        display: flex;
        max-width: 342px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .icon-img {
        flex-shrink: 0;
        height: 36px;
        width: 36px;
        margin-right: 10px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .icon-box {
        margin-right: 8px;
        margin-top: -4px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        width: 100%
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .item-title {
        font-weight: 600;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533;
        margin-bottom: 2px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .title-ms {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .title-pc {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box.hide {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box.show {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .blue-font {
        color: #205fec;
        font-size: 12px;
        background: rgba(32, 95, 236, .1);
        border-radius: 1px 4px 4px 1px;
        padding: 0 6px;
        height: 18px;
        font-weight: 500;
        display: inline-block;
        line-height: 18px;
        vertical-align: text-top
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .item-desc {
        margin-top: 4px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box {
        position: relative
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .desc {
        visibility: visible;
        font-size: 12px;
        font-weight: 400;
        line-height: 18px;
        color: #7b8293
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link {
        position: absolute;
        top: 0;
        visibility: hidden
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link {
        font-size: 12px;
        font-weight: 500;
        line-height: 18px;
        color: #205fec
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link:last-child {
        color: #7b8293
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link:hover {
        color: #205fec
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .split-line {
        width: 1px;
        height: 10px;
        background: #d8dce6;
        display: inline-block;
        margin: 0 8px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover {
        cursor: pointer;
        background: #f4f6fa;
        border-radius: 2px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box .desc {
        visibility: hidden
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box .item-link, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box.new-desc-box .desc {
        visibility: visible
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box.new-desc-box .item-link {
        visibility: hidden
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .extend-box .box-item[data-monitor-more=crossChainGateway] {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box {
        display: block;
        min-width: 698px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .icon-img {
        display: block;
        width: 56px;
        height: 56px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .trade-line {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .item-title {
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533;
        text-align: center
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .tab-ms, body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .title-ms {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .title-pc {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        -webkit-box-align: center;
        align-items: center;
        padding: 36px 12px 50px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .icon-img {
        margin-bottom: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-title {
        font-weight: 600;
        font-size: 18px;
        line-height: 20px;
        text-align: center;
        color: #1f2533;
        margin-bottom: 6px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-desc {
        font-size: 14px;
        line-height: 16px;
        text-align: center;
        color: #7b8293
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-button {
        margin-top: 32px;
        background: #205fec;
        border-radius: 2px;
        cursor: pointer;
        font-size: 16px;
        line-height: 20px;
        color: #fff
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .item-desc {
        width: 100%;
        font-weight: 400;
        font-size: 12px;
        line-height: 16px;
        text-align: center;
        color: #9aa1b1;
        margin-top: 2px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .new-system-box .item-button {
        background: #2d60e0;
        border: 1px solid #2d60e0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
        box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
        border-radius: 2px;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        color: #fff;
        padding: 8px 22px;
        margin-top: 24px
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .old-system-box {
        padding: 16px 12px 20px;
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .only-new-box {
        padding: 8px 0;
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .only-new-box .extend-box .box-item {
        margin: unset
    }

    body[data-responsive=true] .header-main .nav-trade .drop-c-left-align .only-new-box .extend-box .box-item:hover .item-box .desc-box .desc {
        visibility: visible
    }

    body[data-responsive=true] .header-main .nav-trade.old .drop-c-left-align .only-new-box, body[data-responsive=true] .header-main .nav-trade.old .systemTab, body[data-responsive=true] .header-main .nav-trade.old .tab-ms, body[data-responsive=true] .header-main .nav-trade.old .trade-line {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade.old .drop-c-left-align .old-system-box {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-trade.new .tab-ms, body[data-responsive=true] .header-main .nav-trade.new .trade-line, body[data-responsive=true] .header-main .nav-trade.old .drop-c-left-align .new-system-box, body[data-responsive=true] .header-main .nav-trade.old .drop-c-left-align .systemTab {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade.new .drop-c-left-align {
        left: -2px
    }

    body[data-responsive=true] .header-main .nav-trade.new .drop-c-left-align .only-new-box {
        display: block
    }

    body[data-responsive=true] .header-main .nav-trade.new .drop-c-left-align .new-system-box, body[data-responsive=true] .header-main .nav-trade.new .drop-c-left-align .old-system-box, body[data-responsive=true] .header-main .nav-trade.new .drop-c-left-align .systemTab {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade.oldAndNew .systemTab {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-trade.oldAndNew .tab-ms, body[data-responsive=true] .header-main .nav-trade.oldAndNew .trade-line {
        display: none
    }

    body[data-responsive=true] .header-main .nav-trade.oldAndNew .drop-c-left-align {
        left: -56px;
        -webkit-transform: inherit;
        transform: inherit
    }

    body[data-responsive=true] .header-main .nav-trade.oldAndNew .drop-c-left-align .only-new-box {
        display: none
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align {
        left: -2px;
        padding-top: 8px;
        padding-bottom: 8px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box {
        min-width: 220px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item {
        -webkit-box-align: center;
        align-items: center
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .icon {
        font-size: 24px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .item-info {
        font-weight: 600;
        font-size: 14px;
        line-height: 20px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .desc-box {
        display: none;
        margin-top: 2px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .desc-box .desc {
        visibility: visible;
        font-size: 12px;
        line-height: 18px;
        color: #7b8293
    }

    body[data-responsive=true] .header-main .nav-more .drop-c-left-align {
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        padding-top: 12px;
        padding-bottom: 12px
    }

    body[data-responsive=true] .header-main .nav-more .drop-c-left-align .info-extend-box .extend-box {
        min-width: 190px;
        margin-right: 0
    }

    body[data-responsive=true] .header-main .nav-more .item-academy {
        display: none
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align, body[data-responsive=true] .header-main .nav-more .drop-c-left-align {
        max-width: 700px
    }

    body[data-responsive=true] .header-main .nav-earn .drop-c-left-align .extend-box:last-child, body[data-responsive=true] .header-main .nav-more .drop-c-left-align .extend-box:last-child {
        margin-right: 0
    }

    body[data-responsive=true] .header-main .nav-null {
        -webkit-box-flex: 1;
        flex-grow: 1
    }

    body[data-responsive=true] .header-main .drop-c-left-align, body[data-responsive=true] .header-main .drop-c-right-align {
        position: absolute;
        overflow: hidden;
        border-radius: 4px;
        background: #fff;
        -webkit-box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
        box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
        z-index: 9500;
        visibility: hidden;
        opacity: 0;
        -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
        transition: all .3s cubic-bezier(.645, .045, .355, 1);
        cursor: default;
        pointer-events: none
    }

    body[data-responsive=true] .header-main .drop-c-left-align {
        font-weight: 400;
        top: 58px;
        left: -14px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .info-extend-box {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box {
        margin-right: 48px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box:last-child {
        margin-right: 0
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-title {
        padding-left: 20px;
        font-weight: 600;
        font-size: 12px;
        line-height: 20px;
        color: #9aa1b1
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item {
        display: -webkit-box;
        display: flex;
        margin-bottom: 28px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .icon-img {
        width: 28px;
        flex-shrink: 0
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item:last-child {
        margin-bottom: 0
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .icon-box {
        margin-right: 8px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .icon-box .icon {
        height: 28px;
        width: 28px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .item-box {
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-title {
        font-size: 14px;
        font-weight: 400;
        color: #35384a;
        line-height: 16px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-desc {
        font-size: 12px;
        font-weight: 400;
        color: #a7adba;
        line-height: 14px;
        margin-top: 3px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-info {
        font-size: 14px;
        font-weight: 400;
        color: #35384a
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item:hover .item-box .item-info, body[data-responsive=true] .header-main .drop-c-left-align .extend-box .box-item:hover .item-box .item-title {
        color: #2d60e0
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box {
        margin-right: 80px;
        min-width: 120px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-title {
        margin-bottom: 10px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        margin-bottom: 0;
        padding: 11px 16px;
        cursor: pointer
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item .icon {
        font-size: 22px;
        color: #91b1ff;
        margin-right: 8px
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item .item-box .item-info {
        padding: unset;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item:hover {
        color: #205fec;
        background: #f7f9fc
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item:hover .icon {
        color: #205fec
    }

    body[data-responsive=true] .header-main .drop-c-left-align .extend-small-box .box-item.item-academy {
        display: none
    }

    body[data-responsive=true] .header-main .drop-c-left-align .line {
        height: 1px;
        background-color: #eff1f4
    }

    body[data-responsive=true] .header-main .user-no-login {
        display: none
    }

    body[data-responsive=true] .header-main .nav-download, body[data-responsive=true] .header-main .nav-notice {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-balance, body[data-responsive=true] .header-main .nav-user {
        text-align: right;
        cursor: pointer;
        position: relative;
        line-height: 48px;
        font-weight: 500;
        display: none
    }

    body[data-responsive=true] .header-main .nav-balance:hover .user-balance-href, body[data-responsive=true] .header-main .nav-balance:hover .user-balance-text, body[data-responsive=true] .header-main .nav-balance:hover .user-info, body[data-responsive=true] .header-main .nav-user:hover .user-balance-href, body[data-responsive=true] .header-main .nav-user:hover .user-balance-text, body[data-responsive=true] .header-main .nav-user:hover .user-info {
        color: #fff
    }

    body[data-responsive=true] .header-main .nav-balance:hover .user-arrow, body[data-responsive=true] .header-main .nav-user:hover .user-arrow {
        color: #fff;
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    body[data-responsive=true] .header-main .nav-balance:hover .drop-c-left-align, body[data-responsive=true] .header-main .nav-user:hover .drop-c-left-align {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        top: 48px
    }

    body[data-responsive=true] .header-main .nav-balance .user-balance-href, body[data-responsive=true] .header-main .nav-balance .user-balance-text, body[data-responsive=true] .header-main .nav-balance .user-info, body[data-responsive=true] .header-main .nav-user .user-balance-href, body[data-responsive=true] .header-main .nav-user .user-balance-text, body[data-responsive=true] .header-main .nav-user .user-info {
        color: hsla(0, 0%, 100%, .85);
        font-size: 14px;
        float: left;
        margin-right: 8px;
        height: 48px
    }

    body[data-responsive=true] .header-main .nav-balance .user-info, body[data-responsive=true] .header-main .nav-user .user-info {
        margin-right: 0;
        -webkit-box-align: center;
        align-items: center;
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-balance .user-info .user-loginName, body[data-responsive=true] .header-main .nav-user .user-info .user-loginName {
        display: none;
        font-size: 14px;
        line-height: 20px;
        margin-left: 8px
    }

    body[data-responsive=true] .header-main .nav-balance .user-info .user-loginName.show, body[data-responsive=true] .header-main .nav-user .user-info .user-loginName.show {
        display: inline-block
    }

    body[data-responsive=true] .header-main .nav-balance .user-balance-href, body[data-responsive=true] .header-main .nav-user .user-balance-href {
        display: block
    }

    body[data-responsive=true] .header-main .nav-balance .user-balance-text, body[data-responsive=true] .header-main .nav-user .user-balance-text {
        display: none
    }

    body[data-responsive=true] .header-main .nav-balance .user-arrow, body[data-responsive=true] .header-main .nav-user .user-arrow {
        display: inline-block;
        width: 14px;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    body[data-responsive=true] .header-main .nav-balance .user-arrow .icon, body[data-responsive=true] .header-main .nav-user .user-arrow .icon {
        font-size: 10px;
        width: 14px;
        height: 14px;
        line-height: 14px;
        text-align: center;
        display: inline-block
    }

    body[data-responsive=true] .header-main .nav-balance .drop-c-left-align, body[data-responsive=true] .header-main .nav-user .drop-c-left-align {
        padding: 8px 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        left: -24px;
        min-width: 184px
    }

    body[data-responsive=true] .header-main .nav-balance .drop-c-left-align .extend-link .icon, body[data-responsive=true] .header-main .nav-user .drop-c-left-align .extend-link .icon {
        font-size: 22px;
        color: #91b1ff;
        margin-right: 8px
    }

    body[data-responsive=true] .header-main .nav-balance .drop-c-left-align .extend-link:hover .icon, body[data-responsive=true] .header-main .nav-user .drop-c-left-align .extend-link:hover .icon {
        color: #2d60e0
    }

    body[data-responsive=true] .header-main .nav-user {
        padding-left: 18px;
        padding-right: 10px;
        margin-right: 18px
    }

    body[data-responsive=true] .header-main .nav-user .user-account-text, body[data-responsive=true] .header-main .nav-user .user-arrow {
        display: none
    }

    body[data-responsive=true] .header-main .nav-user .user-info {
        margin-right: 0
    }

    body[data-responsive=true] .header-main .nav-user .user-info .icon {
        font-size: 20px
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align {
        padding-top: 0;
        left: -28px;
        min-width: 220px
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-info-item {
        min-height: 48px;
        width: 100%;
        line-height: 1;
        padding: 16px 18px 8px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        text-align: left;
        cursor: default
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .line {
        height: 1px;
        width: calc(100% - 36px);
        background: #edf0f7;
        margin: 6px auto
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-account {
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .sub-account {
        padding-top: 14px
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-level {
        display: inline-block;
        line-height: 1;
        text-align: left
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-level .sub-tag-wrap {
        height: 16px;
        line-height: 16px;
        padding: 0 4px;
        background: #dfeafc;
        border-radius: 2px;
        text-align: center;
        display: inline-block;
        margin: 0 3px 0 0
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-level .sub-tag {
        font-weight: 400;
        color: #3075ee;
        -webkit-transform: scale(.83);
        transform: scale(.83);
        font-size: 12px;
        display: inline-block;
        -webkit-transform-origin: top;
        transform-origin: top
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-level .level-tag-wrap {
        height: 14px;
        background: #e4f4ea;
        padding: 2px 4px;
        display: inline-block;
        line-height: 14px;
        margin: 0
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .user-level .level-tag {
        font-size: 12px;
        color: #4db872;
        font-weight: 600;
        display: inline-block;
        text-align: left;
        -webkit-transform: scale(.83);
        transform: scale(.83);
        vertical-align: middle;
        border-radius: 2px;
        font-style: italic;
        -webkit-transform-origin: top;
        transform-origin: top
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .sub-account-uid {
        font-size: 12px;
        line-height: 16px;
        color: #9aa1b1;
        margin-top: 2px
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align .logout {
        margin-top: 0;
        cursor: pointer;
        padding: 10px 18px
    }

    body[data-responsive=true] .header-main .nav-balance {
        padding: 0 12px 0 0
    }

    body[data-responsive=true] .header-main .nav-balance .user-arrow {
        margin-left: 0
    }

    body[data-responsive=true] .header-main .nav-balance .item-real, body[data-responsive=true] .header-main .nav-balance .item-simulated {
        display: none
    }

    body[data-responsive=true] .header-main .nav-balance .drop-c-left-align {
        min-width: 220px;
        left: -16px;
        right: unset
    }

    body[data-responsive=true] .header-main .header-line {
        display: block;
        width: 1px;
        height: 16px;
        background: hsla(0, 0%, 100%, .15);
        margin: 16px 0
    }

    body[data-responsive=true] .header-main .mode-line {
        width: 1px;
        height: 16px;
        background: hsla(0, 0%, 100%, .15);
        margin: 16px 0;
        display: none
    }

    body[data-responsive=true] .header-main .other-wrap {
        display: -webkit-box;
        display: flex;
        cursor: pointer;
        padding: 0 13px;
        width: 44px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        line-height: 48px;
        position: relative
    }

    body[data-responsive=true] .header-main .other-wrap .icon {
        font-size: 20px;
        color: hsla(0, 0%, 100%, .8)
    }

    body[data-responsive=true] .header-main .other-wrap .drop-c-right-align {
        top: 58px;
        right: 0;
        padding: 0 24px;
        overflow: visible
    }

    body[data-responsive=true] .header-main .other-wrap:hover .drop-c-right-align {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        top: 48px
    }

    body[data-responsive=true] .header-main .nav-download {
        padding-left: 10px;
        padding-right: 10px;
        width: 40px;
        margin-left: 14px
    }

    body[data-responsive=true] .header-main .nav-download .drop-c-right-align {
        padding: 4px;
        min-width: 180px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    body[data-responsive=true] .header-main .nav-download .drop-c-right-align .download-box, body[data-responsive=true] .header-main .nav-download .drop-c-right-align .download-box .qr-box {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column
    }

    body[data-responsive=true] .header-main .nav-download .drop-c-right-align .download-box .qr-box {
        padding: 20px 0;
        flex-shrink: 0;
        -webkit-box-align: center;
        align-items: center
    }

    body[data-responsive=true] .header-main .nav-download .drop-c-right-align .download-box .qr-box .qr-code-desc {
        white-space: nowrap;
        font-weight: 600;
        font-size: 12px;
        line-height: 16px;
        color: #1f2533;
        margin-bottom: 6px
    }

    body[data-responsive=true] .header-main .nav-download .drop-c-right-align .download-box .qr-box .img-box {
        width: 100px;
        height: 100px
    }

    body[data-responsive=true] .header-main .nav-download .drop-c-right-align .download-box .qr-box .img-box .qr-code-img {
        display: block;
        width: 100%;
        height: 100%
    }

    body[data-responsive=true] .header-main .nav-download .drop-c-right-align .download-box .pc-box {
        background: #f4f6fa;
        border-radius: 2px;
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        -webkit-box-align: center;
        align-items: center;
        padding: 8px
    }

    body[data-responsive=true] .header-main .nav-download .drop-c-right-align .download-box .pc-box .download-btn {
        font-size: 12px;
        color: #1f2533;
        line-height: 16px;
        padding: 3px 14px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        background: #fff;
        border: .5px solid #d8dce5;
        border-radius: 4px;
        margin-bottom: 8px
    }

    body[data-responsive=true] .header-main .nav-download .drop-c-right-align .download-box .pc-box .download-desc {
        font-size: 12px;
        line-height: 16px;
        color: #9aa1b1;
        text-align: center
    }

    body[data-responsive=true] .header-main .nav-notice {
        position: static
    }

    body[data-responsive=true] .header-main .nav-notice .notice-icon {
        line-height: 48px;
        position: relative
    }

    body[data-responsive=true] .header-main .nav-notice .notice-icon .notice-new {
        background-color: #ff6e00;
        width: 6px;
        height: 6px;
        border-radius: 100px;
        position: absolute;
        right: 0;
        top: 14px;
        display: none
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align {
        padding: 8px 0;
        right: 0;
        overflow: hidden
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align .notice-box {
        width: 336px
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align .notice-box .notice-title {
        display: none
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item {
        padding: 12px 18px;
        display: inline-block;
        width: 100%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item:hover {
        background: #f7f9fc
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item:hover .item-title {
        color: #2d60e0
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item .item-title {
        color: #1f2533;
        font-size: 12px;
        font-weight: 500;
        line-height: 18px
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item .item-date {
        font-size: 12px;
        line-height: 20px;
        font-weight: 400;
        color: #7b8293;
        margin-top: 2px
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align .notice-box .notice-more {
        padding: 12px 18px;
        font-weight: 500;
        font-size: 12px;
        line-height: 18px;
        color: #205fec;
        width: 100%;
        display: inline-block
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align .notice-empty {
        display: none;
        width: 240px;
        height: 158px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        -webkit-box-align: center;
        align-items: center;
        -webkit-box-pack: center;
        justify-content: center
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align .notice-empty .empty-icon {
        display: block;
        width: 80px;
        height: 80px;
        margin-bottom: 6px
    }

    body[data-responsive=true] .header-main .nav-notice .drop-c-right-align .notice-empty .empty-desc {
        font-weight: 500;
        font-size: 12px;
        line-height: 18px;
        color: #3f475a
    }

    body[data-responsive=true] .header-main .nav-custom {
        position: static
    }

    body[data-responsive=true] .header-main .nav-custom .user-arrow, body[data-responsive=true] .header-main .nav-custom .user-support-text {
        display: none
    }

    body[data-responsive=true] .header-main .nav-custom .drop-c-right-align {
        padding: 8px 0;
        min-width: 152px;
        right: 0
    }

    body[data-responsive=true] .header-main .nav-custom .extend-link {
        -webkit-box-pack: justify;
        justify-content: space-between
    }

    body[data-responsive=true] .header-main .nav-custom .extend-link .icon {
        color: #1f2533;
        font-size: 16px;
        margin-left: 12px
    }

    body[data-responsive=true] .header-main .nav-custom .extend-link .icon.icon-wechat2 {
        color: #00bc6b
    }

    body[data-responsive=true] .header-main .nav-custom .extend-link .icon.icon-telegram1 {
        color: #1dade9
    }

    body[data-responsive=true] .header-main .nav-custom .extend-link.click-disable {
        opacity: .5;
        cursor: not-allowed
    }

    body[data-responsive=true] .header-main .nav-custom .extend-link.click-disable:hover {
        color: #35384a;
        background: unset
    }

    body[data-responsive=true] .header-main .nav-language {
        display: -webkit-box;
        display: flex;
        padding-right: 0;
        width: 32px;
        position: relative
    }

    body[data-responsive=true] .header-main .nav-language:hover .language-list {
        visibility: visible;
        opacity: 1;
        top: 48px;
        pointer-events: auto
    }

    body[data-responsive=true] .header-main .nav-language:hover .language-list .list-ul {
        overflow-y: auto
    }

    body[data-responsive=true] .header-main .nav-language .language-list {
        position: absolute;
        pointer-events: none;
        top: 58px;
        right: 0;
        z-index: 9500;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        background: #fff;
        -webkit-box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
        box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
        border-radius: 2px;
        padding-top: 12px;
        visibility: hidden;
        opacity: 0;
        -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
        transition: all .3s cubic-bezier(.645, .045, .355, 1);
        display: -webkit-box;
        display: flex;
        overflow: hidden
    }

    body[data-responsive=true] .header-main .nav-language .language-list .ul-title {
        font-size: 12px;
        font-weight: 400;
        color: #9aa1b1;
        line-height: 14px;
        margin-bottom: 4px;
        padding-left: 12px
    }

    body[data-responsive=true] .header-main .nav-language .language-list .list-ul {
        height: 100%;
        max-height: 308px;
        overflow-y: hidden;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    body[data-responsive=true] .header-main .nav-language .language-list .list-ul::-webkit-scrollbar {
        width: 2px
    }

    body[data-responsive=true] .header-main .nav-language .language-list .list-ul::-webkit-scrollbar-track {
        background: #edf0f7
    }

    body[data-responsive=true] .header-main .nav-language .language-list .list-ul::-webkit-scrollbar-thumb {
        background: #d8dce6;
        border-radius: 1px
    }

    body[data-responsive=true] .header-main .nav-language .language-list .language {
        white-space: nowrap;
        display: block;
        height: 48px;
        line-height: 48px;
        font-size: 14px;
        color: #1f2533;
        padding: 0 12px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
        position: relative
    }

    body[data-responsive=true] .header-main .nav-language .language-list .language .language-link {
        color: #1f2533;
        pointer-events: none
    }

    body[data-responsive=true] .header-main .nav-language .language-list .language:hover {
        background: #f7f9fc;
        color: #2d60e0
    }

    body[data-responsive=true] .header-main .nav-language .language-list .language:hover .language-link {
        color: #2d60e0
    }

    body[data-responsive=true] .header-main .nav-language .language-list .language .now-select-item {
        color: #1f2533
    }

    body[data-responsive=true] .header-main .nav-language .language-list .language .now-select, body[data-responsive=true] .header-main .nav-language .language-list .language .select-icon {
        height: 10px;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        right: 6px;
        position: absolute
    }

    body[data-responsive=true] .header-main .nav-language .language-list .language .select-icon {
        width: 10px;
        font-size: 12px;
        line-height: 12px;
        color: #3f475a
    }

    body[data-responsive=true] .header-main .nav-language .language-list .ul-box .list-ul {
        min-width: 146px;
        max-height: 288px
    }

    body[data-responsive=true] .header-main .nav-language .language-list .ul-box:last-child .list-ul {
        width: 136px
    }

    body[data-responsive=true] .header-main.is-login .user-no-login, body[data-responsive=true] .header-main .nav-mobile-download, body[data-responsive=true] .header-main .profile-wrap {
        display: none
    }

    body[data-responsive=true] .header-main.is-login .nav-balance, body[data-responsive=true] .header-main.is-login .nav-user {
        display: block
    }

    body[data-responsive=true] .header-main.is-login .header-line {
        margin-left: unset;
        margin-right: unset
    }

    body[data-responsive=true] .header-main.not-login .user-no-login {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main.not-login .header-line {
        display: block
    }

    body[data-responsive=true] .header-main .action-container {
        display: none
    }

    body[data-responsive=true] .header-main .extend-link {
        padding: 10px 16px;
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533;
        height: unset;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        white-space: nowrap;
        cursor: pointer
    }

    body[data-responsive=true] .header-main .extend-link:hover {
        background: #f4f6fa;
        color: #205fec
    }

    body[data-responsive=true] .header-main .community-link {
        position: relative
    }

    body[data-responsive=true] .header-main .community-link .wechat-box {
        width: 124px;
        padding: 12px;
        background: #fff;
        -webkit-box-shadow: 0 7px 14px 0 rgba(0, 0, 0, .1);
        box-shadow: 0 7px 14px 0 rgba(0, 0, 0, .1);
        border-radius: 4px;
        position: absolute;
        top: 58px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        display: none
    }

    body[data-responsive=true] .header-main .community-link .wechat-box img {
        height: 100%;
        width: 100%
    }

    body[data-responsive=true] .header-main .community-link .wechat-box:before {
        content: "";
        display: block;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        top: -6px;
        width: 0;
        height: 0;
        border-color: transparent transparent #fff;
        border-style: solid;
        border-width: 0 6px 6px
    }

    body[data-responsive=true] .header-main .community-link .wechat-box .qr-code-desc {
        text-align: center;
        font-size: 10px;
        line-height: 12px;
        color: #1f2533;
        max-width: 100px;
        white-space: normal;
        margin-top: 8px
    }

    body[data-responsive=true] .header-main .community-link:hover .wechat-box {
        display: block
    }

    body[data-responsive=true] .header-main .nav-right-section .nav-right-container {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .mode-xl-line {
        display: block
    }

    body[data-responsive=true] .header-main .nav-invest .invest-tag {
        display: none
    }

    body[data-responsive=true] .header-main .nav-invest .invest-tip-container {
        position: absolute;
        padding: 8px 12px;
        background: #fff;
        z-index: 9500;
        visibility: hidden;
        opacity: 0;
        -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
        transition: all .3s cubic-bezier(.645, .045, .355, 1);
        cursor: default;
        font-size: 14px;
        line-height: 22px;
        color: #3f475a;
        -webkit-box-shadow: rgba(0, 0, 0, .05) 0 4px 6px -2px, rgba(0, 0, 0, .1) 0 10px 15px -3px;
        box-shadow: 0 4px 6px -2px rgba(0, 0, 0, .05), 0 10px 15px -3px rgba(0, 0, 0, .1);
        border-radius: 4px;
        top: 44px;
        min-width: 110px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        pointer-events: none
    }

    body[data-responsive=true] .header-main .nav-invest .invest-tip-arrow {
        width: 12px;
        height: 12px;
        top: -5px;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    body[data-responsive=true] .header-main .nav-invest .invest-tip-arrow-inner {
        display: block;
        width: 100%;
        height: 100%;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform-origin: center;
        transform-origin: center;
        border: 1px solid rgba(0, 0, 0, .02);
        border-radius: 2px;
        background-color: #fff
    }

    body[data-responsive=true] .header-main .nav-invest:hover {
        color: #fff
    }

    body[data-responsive=true] .header-main .nav-invest:hover .invest-tip-container {
        opacity: 1;
        visibility: visible;
        pointer-events: auto
    }

    body[data-responsive=true] .header-main .nav-gas {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .header-main .nav-gas.hide-gas {
        display: none
    }

    body[data-responsive=true] .header-main .nav-buy {
        -webkit-box-ordinal-group: 2;
        order: 1
    }

    body[data-responsive=true] .header-main .nav-market {
        -webkit-box-ordinal-group: 3;
        order: 2
    }

    body[data-responsive=true] .header-main .nav-trade {
        -webkit-box-ordinal-group: 4;
        order: 3
    }

    body[data-responsive=true] .header-main .nav-earn {
        -webkit-box-ordinal-group: 5;
        order: 4
    }

    body[data-responsive=true] .header-main .nav-academy {
        -webkit-box-ordinal-group: 6;
        order: 5
    }

    body[data-responsive=true] .header-main .nav-more {
        -webkit-box-ordinal-group: 7;
        order: 6
    }

    body[data-responsive=true] .header-main .nav-null {
        -webkit-box-ordinal-group: 8;
        order: 7
    }

    body[data-responsive=true] .header-main .header-search-box {
        -webkit-box-ordinal-group: 9;
        order: 8
    }

    body[data-responsive=true] .header-main .user-no-login {
        -webkit-box-ordinal-group: 10;
        order: 9
    }

    body[data-responsive=true] .header-main .nav-balance {
        -webkit-box-ordinal-group: 11;
        order: 10
    }

    body[data-responsive=true] .header-main .nav-user {
        -webkit-box-ordinal-group: 12;
        order: 11
    }

    body[data-responsive=true] .header-main .header-line, body[data-responsive=true] .header-main .nav-right-section {
        -webkit-box-ordinal-group: 13;
        order: 12
    }

    body[data-responsive=true] .header-main .nav-download {
        -webkit-box-ordinal-group: 14;
        order: 13
    }

    body[data-responsive=true] .header-main .nav-notice {
        -webkit-box-ordinal-group: 15;
        order: 14
    }

    body[data-responsive=true] .header-main .nav-custom {
        -webkit-box-ordinal-group: 16;
        order: 15
    }

    body[data-responsive=true] .header-main .nav-language {
        -webkit-box-ordinal-group: 17;
        order: 16
    }

    body[data-responsive=true] .header-main .nav-dashboard {
        -webkit-box-ordinal-group: 2;
        order: 1
    }

    body[data-responsive=true] .header-main .nav-invest {
        -webkit-box-ordinal-group: 3;
        order: 2
    }

    body[data-responsive=true] .header-main .nav-nft {
        -webkit-box-ordinal-group: 4;
        order: 3
    }

    body[data-responsive=true] .header-main .nav-game {
        -webkit-box-ordinal-group: 5;
        order: 4
    }

    body[data-responsive=true] .header-main .nav-address {
        -webkit-box-ordinal-group: 11;
        order: 10
    }

    body[data-responsive=true] .header-main .nav-gas {
        -webkit-box-ordinal-group: 12;
        order: 11
    }

    body[data-responsive=true] .header-main .mode-line, body[data-responsive=true] .header-main .mode-xl-line {
        -webkit-box-ordinal-group: 13;
        order: 12
    }
}

@media (min-width: 1270px) and (min-width: 1270px) {
    body[data-responsive=true] .header-main .nav-user {
        position: relative
    }

    body[data-responsive=true] .header-main .nav-user .drop-c-left-align {
        left: -28px;
        right: unset
    }
}

@media (max-width: 767px) {
    body[data-scroll-disabled=true] {
        overflow: hidden
    }
}

@media (min-width: 1024px) {
    body[data-scroll-disabled=true] {
        overflow: unset
    }
}

body[data-responsive=true].theme-dark .header-container .header-wrap {
    background: #181e2a
}

body[data-responsive=true].theme-dark .header-wrap .header-main.active .nav-container {
    background: #181e2a;
    -webkit-box-shadow: 0 12px 60px rgba(0, 0, 0, .3);
    box-shadow: 0 12px 60px rgba(0, 0, 0, .3)
}

@media (max-width: 1269px) and (min-width: 1024px) {
    body[data-responsive=true].theme-dark .header-wrap .header-main.active .nav-right-section {
        background: #181e2a;
        -webkit-box-shadow: 0 12px 60px rgba(0, 0, 0, .3);
        box-shadow: 0 12px 60px rgba(0, 0, 0, .3)
    }
}

body[data-responsive=true].theme-dark .header-wrap .header-main.active:before {
    content: "";
    display: block;
    background: rgba(8, 13, 21, .65);
    position: absolute;
    width: 100vw;
    height: 100vh;
    right: 0;
    top: 0
}

body[data-responsive=false], body[data-responsive=false] .header-container, body[data-responsive=false] .header-wrap {
    min-width: 1200px
}

body[data-responsive=false] .header-wrap {
    width: 100%
}

body[data-responsive=false] .header-main {
    padding: 0 24px;
    margin: 0 auto;
    visibility: visible
}

body[data-responsive=false] .header-main .nav-item {
    position: relative;
    padding: 0 14px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

body[data-responsive=false] .header-main .nav-item .nav-link, body[data-responsive=false] .header-main .nav-item .nav-text {
    font-size: 14px;
    font-weight: 400;
    color: hsla(0, 0%, 100%, .85);
    line-height: 48px;
    display: inline-block;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer
}

body[data-responsive=false] .header-main .nav-item .nav-link:hover, body[data-responsive=false] .header-main .nav-item .nav-text:hover {
    color: #fff
}

body[data-responsive=false] .header-main .nav-item .user-arrow {
    display: inline-block;
    color: hsla(0, 0%, 100%, .85);
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
    margin-left: 4px
}

body[data-responsive=false] .header-main .nav-item .user-arrow .icon {
    font-size: 12px
}

body[data-responsive=false] .header-main .nav-item:hover .user-arrow {
    color: #fff;
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

body[data-responsive=false] .header-main .nav-item:hover .drop-c-left-align {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    top: 48px
}

body[data-responsive=false] .header-main .new-mode-tab {
    display: -webkit-box;
    display: flex;
    background: hsla(0, 0%, 100%, .15);
    border-radius: 4px;
    margin-left: 20px;
    cursor: pointer;
    padding: 1px
}

body[data-responsive=false] .header-main .new-mode-tab .tab-defi, body[data-responsive=false] .header-main .new-mode-tab .tab-exchange {
    padding: 5px 12px;
    font-size: 12px;
    line-height: 16px;
    text-align: justify;
    color: #fff
}

body[data-responsive=false] .header-main .new-mode-tab .active {
    background: #205fec;
    -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
    box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
    border-radius: 3px
}

body[data-responsive=false] .header-main .header-split-line {
    width: 1px;
    height: 16px;
    background: hsla(0, 0%, 100%, .15);
    margin: 16px 10px 16px 24px
}

body[data-responsive=false] .header-main .mode-logo {
    -webkit-box-align: center;
    align-items: center;
    display: -webkit-box;
    display: flex
}

body[data-responsive=false] .header-main .mode-logo .nav-text {
    font-size: 18px;
    font-weight: 500;
    color: hsla(0, 0%, 100%, .85);
    line-height: 48px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer;
    display: none
}

body[data-responsive=false] .header-main .mode-logo .nav-text .mode-quote {
    width: 4px;
    height: 4px;
    background: hsla(0, 0%, 100%, .85);
    border-radius: 2px;
    margin-right: 4px;
    display: inline-block;
    margin-top: -5px;
    vertical-align: middle;
    margin-left: 4px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align {
    left: -56px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab {
    display: none;
    -webkit-box-align: center;
    align-items: center;
    background: #edf0f7
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab {
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #1f2533;
    cursor: pointer;
    padding: 12px 22px;
    position: relative
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .tab-text {
    z-index: 2;
    position: relative
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab.active {
    background: #fff
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab.active .rectangle {
    display: block
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle {
    display: none;
    position: absolute;
    z-index: 1;
    top: 0;
    width: 22px;
    height: 44px;
    background: #fff;
    -webkit-transform-origin: bottom;
    transform-origin: bottom
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle:after {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 22px;
    height: 44px;
    background: #edf0f7;
    -webkit-transform-origin: bottom;
    transform-origin: bottom
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle:before {
    content: "";
    display: block;
    position: absolute;
    top: 0;
    width: 22px;
    height: 44px;
    background: #fff
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right {
    left: calc(100% - 9.35px);
    -webkit-transform: skewX(12deg);
    transform: skewX(12deg);
    border-top-right-radius: 6px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right:after {
    left: 100%;
    border-bottom-left-radius: 6px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right:before {
    left: 100%
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left {
    right: calc(100% - 9.35px);
    -webkit-transform: skewX(-12deg);
    transform: skewX(-12deg);
    border-top-left-radius: 6px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left:after {
    right: 100%;
    border-bottom-right-radius: 6px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left:before {
    right: 100%
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab:first-child {
    padding-right: 14px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab + .item-tab {
    margin-left: 32px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .tab-new {
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 16px;
    color: #33b06a;
    background: rgba(51, 176, 106, .1);
    border-radius: 2px;
    height: 16px;
    padding: 0 2px;
    margin-left: 8px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab.flex {
    display: -webkit-box;
    display: flex
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab.hide {
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showConvert .systemTab .item-tab[data-tab="3"] {
    background: #fff
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showConvert .new-convert-box, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showConvert .systemTab .item-tab[data-tab="3"] .rectangle {
    display: block
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showConvert .new-system-box, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showConvert .old-system-box {
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showNew .systemTab .item-tab[data-tab="2"] {
    background: #fff
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showNew .new-system-box, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showNew .systemTab .item-tab[data-tab="2"] .rectangle {
    display: block
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showNew .new-convert-box, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showNew .old-system-box {
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showOld .systemTab .item-tab[data-tab="1"] {
    background: #fff
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showOld .systemTab .item-tab[data-tab="1"] .rectangle {
    display: block
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showOld .new-convert-box, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showOld .new-system-box {
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showOld .old-system-box {
    display: -webkit-box;
    display: flex
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .tab-ms {
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box + .extend-box {
    margin-left: 12px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box {
    min-width: 320px;
    margin-right: 0
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-title {
    margin-bottom: 8px;
    padding-left: 16px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item {
    margin-bottom: 8px;
    padding: 12px;
    -webkit-transition: all .5s;
    transition: all .5s;
    display: -webkit-box;
    display: flex;
    max-width: 342px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .icon-img {
    flex-shrink: 0;
    height: 36px;
    width: 36px;
    margin-right: 10px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .icon-box {
    margin-right: 8px;
    margin-top: -4px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    width: 100%
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .item-title {
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    color: #1f2533;
    margin-bottom: 2px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .title-ms {
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .title-pc {
    display: block
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box.hide {
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box.show {
    display: block
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .blue-font {
    color: #205fec;
    font-size: 12px;
    background: rgba(32, 95, 236, .1);
    border-radius: 1px 4px 4px 1px;
    padding: 0 6px;
    height: 18px;
    font-weight: 500;
    display: inline-block;
    line-height: 18px;
    vertical-align: text-top
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .item-desc {
    margin-top: 4px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box {
    position: relative
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .desc {
    visibility: visible;
    font-size: 12px;
    font-weight: 400;
    line-height: 18px;
    color: #7b8293
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link {
    position: absolute;
    top: 0;
    visibility: hidden
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link {
    font-size: 12px;
    font-weight: 500;
    line-height: 18px;
    color: #205fec
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link:last-child {
    color: #7b8293
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link:hover {
    color: #205fec
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .split-line {
    width: 1px;
    height: 10px;
    background: #d8dce6;
    display: inline-block;
    margin: 0 8px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover {
    cursor: pointer;
    background: #f4f6fa;
    border-radius: 2px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box .desc {
    visibility: hidden
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box .item-link, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box.new-desc-box .desc {
    visibility: visible
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box.new-desc-box .item-link {
    visibility: hidden
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item[data-monitor-more=crossChainGateway] {
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box {
    display: block;
    min-width: 676px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .icon-img, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .icon-img {
    display: block;
    width: 56px;
    height: 56px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .trade-line, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .trade-line {
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .item-title, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .item-title {
    font-style: normal;
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    color: #1f2533;
    text-align: center
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .tab-ms, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .title-ms, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .tab-ms, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .title-ms {
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .title-pc, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .title-pc {
    display: block
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .new-desc-pc, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center;
    padding: 36px 12px 50px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .new-desc-pc .icon-img, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .icon-img {
    margin-bottom: 6px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .new-desc-pc .item-title, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-title {
    font-weight: 600;
    font-size: 18px;
    line-height: 20px;
    text-align: center;
    color: #1f2533;
    margin-bottom: 6px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .new-desc-pc .item-desc, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-desc {
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    color: #7b8293
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .new-desc-pc .item-button, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-button {
    margin-top: 32px;
    background: #205fec;
    border-radius: 2px;
    cursor: pointer;
    font-size: 16px;
    line-height: 20px;
    color: #fff
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .item-desc, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .item-desc {
    width: 100%;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    text-align: center;
    color: #9aa1b1;
    margin-top: 2px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box .item-button, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .item-button {
    background: #2d60e0;
    border: 1px solid #2d60e0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
    box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
    border-radius: 2px;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #fff;
    padding: 8px 22px;
    margin-top: 24px
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-convert-box {
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .old-system-box {
    padding: 16px 12px 20px;
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .only-new-box {
    padding: 8px 0;
    display: none
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .only-new-box .extend-box .box-item {
    margin: unset
}

body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .only-new-box .extend-box .box-item:hover .item-box .desc-box .desc {
    visibility: visible
}

body[data-responsive=false] .header-main .nav-trade.old .drop-c-left-align .only-new-box, body[data-responsive=false] .header-main .nav-trade.old .systemTab, body[data-responsive=false] .header-main .nav-trade.old .tab-ms, body[data-responsive=false] .header-main .nav-trade.old .trade-line {
    display: none
}

body[data-responsive=false] .header-main .nav-trade.old .drop-c-left-align .old-system-box {
    display: -webkit-box;
    display: flex
}

body[data-responsive=false] .header-main .nav-trade.new .tab-ms, body[data-responsive=false] .header-main .nav-trade.new .trade-line, body[data-responsive=false] .header-main .nav-trade.old .drop-c-left-align .new-convert-box, body[data-responsive=false] .header-main .nav-trade.old .drop-c-left-align .new-system-box, body[data-responsive=false] .header-main .nav-trade.old .drop-c-left-align .systemTab {
    display: none
}

body[data-responsive=false] .header-main .nav-trade.new .drop-c-left-align {
    left: -2px
}

body[data-responsive=false] .header-main .nav-trade.new .drop-c-left-align .only-new-box {
    display: block
}

body[data-responsive=false] .header-main .nav-trade.new .drop-c-left-align .new-convert-box, body[data-responsive=false] .header-main .nav-trade.new .drop-c-left-align .new-system-box, body[data-responsive=false] .header-main .nav-trade.new .drop-c-left-align .old-system-box, body[data-responsive=false] .header-main .nav-trade.new .drop-c-left-align .systemTab {
    display: none
}

body[data-responsive=false] .header-main .nav-trade.oldAndNew .systemTab {
    display: -webkit-box;
    display: flex
}

body[data-responsive=false] .header-main .nav-trade.oldAndNew .tab-ms, body[data-responsive=false] .header-main .nav-trade.oldAndNew .trade-line {
    display: none
}

body[data-responsive=false] .header-main .nav-trade.oldAndNew .drop-c-left-align {
    width: 715px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%)
}

body[data-responsive=false] .header-main .nav-trade.oldAndNew .drop-c-left-align .only-new-box {
    display: none
}

body[data-responsive=false] .header-main .nav-earn .drop-c-left-align {
    left: -2px;
    padding-top: 8px;
    padding-bottom: 8px
}

body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box {
    min-width: 220px
}

body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item {
    -webkit-box-align: center;
    align-items: center
}

body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .icon {
    font-size: 24px
}

body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .item-info {
    font-weight: 600;
    font-size: 14px;
    line-height: 20px
}

body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .desc-box {
    display: none;
    margin-top: 2px
}

body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .desc-box .desc {
    visibility: visible;
    font-size: 12px;
    line-height: 18px;
    color: #7b8293
}

body[data-responsive=false] .header-main .nav-more .drop-c-left-align {
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    padding-top: 12px;
    padding-bottom: 12px
}

body[data-responsive=false] .header-main .nav-more .drop-c-left-align .info-extend-box .extend-box {
    min-width: 190px;
    margin-right: 0
}

body[data-responsive=false] .header-main .nav-more .item-academy {
    display: none
}

body[data-responsive=false] .header-main .nav-earn .drop-c-left-align, body[data-responsive=false] .header-main .nav-more .drop-c-left-align {
    max-width: 700px
}

body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .extend-box:last-child, body[data-responsive=false] .header-main .nav-more .drop-c-left-align .extend-box:last-child {
    margin-right: 0
}

body[data-responsive=false] .header-main .nav-null {
    -webkit-box-flex: 1;
    flex-grow: 1
}

body[data-responsive=false] .header-main .drop-c-left-align, body[data-responsive=false] .header-main .drop-c-right-align {
    position: absolute;
    overflow: hidden;
    border-radius: 4px;
    background: #fff;
    -webkit-box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
    z-index: 9500;
    visibility: hidden;
    opacity: 0;
    -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
    transition: all .3s cubic-bezier(.645, .045, .355, 1);
    cursor: default;
    pointer-events: none
}

body[data-responsive=false] .header-main .drop-c-left-align {
    font-weight: 400;
    top: 58px;
    left: -14px
}

body[data-responsive=false] .header-main .drop-c-left-align .info-extend-box {
    display: -webkit-box;
    display: flex
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box {
    margin-right: 48px
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box:last-child {
    margin-right: 0
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-title {
    padding-left: 20px;
    font-weight: 600;
    font-size: 12px;
    line-height: 20px;
    color: #9aa1b1
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item {
    display: -webkit-box;
    display: flex;
    margin-bottom: 28px
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .icon-img {
    width: 28px;
    flex-shrink: 0
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item:last-child {
    margin-bottom: 0
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .icon-box {
    margin-right: 8px
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .icon-box .icon {
    height: 28px;
    width: 28px
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .item-box {
    width: -webkit-max-content;
    width: -moz-max-content;
    width: max-content
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-title {
    font-size: 14px;
    font-weight: 400;
    color: #35384a;
    line-height: 16px
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-desc {
    font-size: 12px;
    font-weight: 400;
    color: #a7adba;
    line-height: 14px;
    margin-top: 3px
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-info {
    font-size: 14px;
    font-weight: 400;
    color: #35384a
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item:hover .item-box .item-info, body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item:hover .item-box .item-title {
    color: #2d60e0
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box {
    margin-right: 80px;
    min-width: 120px
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-title {
    margin-bottom: 10px
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    margin-bottom: 0;
    padding: 11px 16px;
    cursor: pointer
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item .icon {
    font-size: 22px;
    color: #91b1ff;
    margin-right: 8px
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item .item-box .item-info {
    padding: unset;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #1f2533
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item:hover {
    color: #205fec;
    background: #f7f9fc
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item:hover .icon {
    color: #205fec
}

body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item.item-academy {
    display: -webkit-box;
    display: flex
}

body[data-responsive=false] .header-main .drop-c-left-align .line {
    height: 1px;
    background-color: #eff1f4
}

body[data-responsive=false] .header-main .user-no-login {
    display: none
}

body[data-responsive=false] .header-main .nav-balance, body[data-responsive=false] .header-main .nav-user {
    text-align: right;
    cursor: pointer;
    position: relative;
    line-height: 48px;
    font-weight: 500;
    display: none
}

body[data-responsive=false] .header-main .nav-balance:hover .user-balance-href, body[data-responsive=false] .header-main .nav-balance:hover .user-balance-text, body[data-responsive=false] .header-main .nav-balance:hover .user-info, body[data-responsive=false] .header-main .nav-user:hover .user-balance-href, body[data-responsive=false] .header-main .nav-user:hover .user-balance-text, body[data-responsive=false] .header-main .nav-user:hover .user-info {
    color: #fff
}

body[data-responsive=false] .header-main .nav-balance:hover .user-arrow, body[data-responsive=false] .header-main .nav-user:hover .user-arrow {
    color: #fff;
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

body[data-responsive=false] .header-main .nav-balance:hover .drop-c-left-align, body[data-responsive=false] .header-main .nav-user:hover .drop-c-left-align {
    opacity: 1;
    visibility: visible;
    pointer-events: auto;
    top: 48px
}

body[data-responsive=false] .header-main .nav-balance .user-balance-href, body[data-responsive=false] .header-main .nav-balance .user-balance-text, body[data-responsive=false] .header-main .nav-balance .user-info, body[data-responsive=false] .header-main .nav-user .user-balance-href, body[data-responsive=false] .header-main .nav-user .user-balance-text, body[data-responsive=false] .header-main .nav-user .user-info {
    color: hsla(0, 0%, 100%, .85);
    font-size: 14px;
    float: left;
    margin-right: 8px;
    height: 48px
}

body[data-responsive=false] .header-main .nav-balance .user-info, body[data-responsive=false] .header-main .nav-user .user-info {
    margin-right: 0;
    -webkit-box-align: center;
    align-items: center;
    display: -webkit-box;
    display: flex
}

body[data-responsive=false] .header-main .nav-balance .user-info .user-loginName, body[data-responsive=false] .header-main .nav-user .user-info .user-loginName {
    display: none;
    font-size: 14px;
    line-height: 20px;
    margin-left: 8px
}

body[data-responsive=false] .header-main .nav-balance .user-info .user-loginName.show, body[data-responsive=false] .header-main .nav-user .user-info .user-loginName.show {
    display: none
}

body[data-responsive=false] .header-main .nav-balance .user-balance-href, body[data-responsive=false] .header-main .nav-user .user-balance-href {
    display: block
}

body[data-responsive=false] .header-main .nav-balance .user-balance-text, body[data-responsive=false] .header-main .nav-user .user-balance-text {
    display: none
}

body[data-responsive=false] .header-main .nav-balance .user-arrow, body[data-responsive=false] .header-main .nav-user .user-arrow {
    display: inline-block;
    width: 14px;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
}

body[data-responsive=false] .header-main .nav-balance .user-arrow .icon, body[data-responsive=false] .header-main .nav-user .user-arrow .icon {
    font-size: 10px;
    width: 14px;
    height: 14px;
    line-height: 14px;
    text-align: center;
    display: inline-block
}

body[data-responsive=false] .header-main .nav-balance .drop-c-left-align, body[data-responsive=false] .header-main .nav-user .drop-c-left-align {
    padding: 8px 0;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    left: -24px;
    min-width: 184px
}

body[data-responsive=false] .header-main .nav-balance .drop-c-left-align .extend-link .icon, body[data-responsive=false] .header-main .nav-user .drop-c-left-align .extend-link .icon {
    font-size: 22px;
    color: #91b1ff;
    margin-right: 8px
}

body[data-responsive=false] .header-main .nav-balance .drop-c-left-align .extend-link:hover .icon, body[data-responsive=false] .header-main .nav-user .drop-c-left-align .extend-link:hover .icon {
    color: #2d60e0
}

body[data-responsive=false] .header-main .nav-user {
    padding-left: 18px;
    padding-right: 10px;
    margin-right: 18px
}

body[data-responsive=false] .header-main .nav-user .user-account-text, body[data-responsive=false] .header-main .nav-user .user-arrow {
    display: none
}

body[data-responsive=false] .header-main .nav-user .user-info {
    margin-right: 0
}

body[data-responsive=false] .header-main .nav-user .user-info .icon {
    font-size: 20px
}

@media (min-width: 1024px) {
    body[data-responsive=false] .header-main .nav-user {
        position: static
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align {
        left: unset;
        right: 0
    }
}

@media (min-width: 1270px) {
    body[data-responsive=false] .header-main .nav-user {
        position: relative
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align {
        left: -28px;
        right: unset
    }
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align {
    padding-top: 0;
    min-width: 220px
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-info-item {
    min-height: 48px;
    width: 100%;
    line-height: 1;
    padding: 16px 18px 8px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-align: left;
    cursor: default
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align .line {
    height: 1px;
    width: calc(100% - 36px);
    background: #edf0f7;
    margin: 6px auto
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-account {
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #1f2533
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align .sub-account {
    padding-top: 14px
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-level {
    display: inline-block;
    line-height: 1;
    text-align: left
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-level .sub-tag-wrap {
    height: 16px;
    line-height: 16px;
    padding: 0 4px;
    background: #dfeafc;
    border-radius: 2px;
    text-align: center;
    display: inline-block;
    margin: 0 3px 0 0
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-level .sub-tag {
    font-weight: 400;
    color: #3075ee;
    -webkit-transform: scale(.83);
    transform: scale(.83);
    font-size: 12px;
    display: inline-block;
    -webkit-transform-origin: top;
    transform-origin: top
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-level .level-tag-wrap {
    height: 14px;
    background: #e4f4ea;
    padding: 2px 4px;
    display: inline-block;
    line-height: 14px;
    margin: 0
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-level .level-tag {
    font-size: 12px;
    color: #4db872;
    font-weight: 600;
    display: inline-block;
    text-align: left;
    -webkit-transform: scale(.83);
    transform: scale(.83);
    vertical-align: middle;
    border-radius: 2px;
    font-style: italic;
    -webkit-transform-origin: top;
    transform-origin: top
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align .sub-account-uid {
    font-size: 12px;
    line-height: 16px;
    color: #9aa1b1;
    margin-top: 2px
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align .logout {
    margin-top: 0;
    cursor: pointer;
    padding: 10px 18px
}

body[data-responsive=false] .header-main .nav-balance {
    padding: 0 12px 0 0
}

body[data-responsive=false] .header-main .nav-balance .user-arrow {
    margin-left: 0
}

body[data-responsive=false] .header-main .nav-balance .item-real, body[data-responsive=false] .header-main .nav-balance .item-simulated {
    display: none
}

body[data-responsive=false] .header-main .nav-balance .drop-c-left-align {
    min-width: 220px;
    left: unset;
    right: -16px
}

body[data-responsive=false] .header-main .header-line {
    width: 1px;
    height: 16px;
    background: hsla(0, 0%, 100%, .15);
    margin: 16px 0
}

body[data-responsive=false] .header-main .mode-line {
    width: 1px;
    height: 16px;
    background: hsla(0, 0%, 100%, .15);
    margin: 16px 24px 16px 8px
}

body[data-responsive=false] .header-main.is-login .user-no-login, body[data-responsive=false] .header-main .mode-xl-line, body[data-responsive=false] .header-main .nav-download, body[data-responsive=false] .header-main .nav-gas, body[data-responsive=false] .header-main .nav-language, body[data-responsive=false] .header-main .nav-mobile-download, body[data-responsive=false] .header-main .nav-notice, body[data-responsive=false] .header-main .other-wrap, body[data-responsive=false] .header-main .pc-mode, body[data-responsive=false] .header-main .profile-wrap, body[data-responsive=false] .header-main .sm-mode {
    display: none
}

body[data-responsive=false] .header-main.is-login .nav-balance, body[data-responsive=false] .header-main.is-login .nav-user {
    display: block
}

body[data-responsive=false] .header-main.is-login .header-line {
    margin-left: 0;
    margin-right: 24px
}

body[data-responsive=false] .header-main.not-login .user-no-login {
    display: -webkit-box;
    display: flex
}

body[data-responsive=false] .header-main.not-login .header-line {
    display: none
}

body[data-responsive=false] .header-main .extend-link {
    padding: 10px 16px;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    color: #1f2533;
    height: unset;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    white-space: nowrap;
    cursor: pointer
}

body[data-responsive=false] .header-main .extend-link:hover {
    background: #f4f6fa;
    color: #205fec
}

body[data-responsive=false] .header-main .community-link {
    position: relative
}

body[data-responsive=false] .header-main .community-link .wechat-box {
    width: 124px;
    padding: 12px;
    background: #fff;
    -webkit-box-shadow: 0 7px 14px 0 rgba(0, 0, 0, .1);
    box-shadow: 0 7px 14px 0 rgba(0, 0, 0, .1);
    border-radius: 4px;
    position: absolute;
    top: 58px;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    display: none
}

body[data-responsive=false] .header-main .community-link .wechat-box img {
    height: 100%;
    width: 100%
}

body[data-responsive=false] .header-main .community-link .wechat-box:before {
    content: "";
    display: block;
    position: absolute;
    left: 50%;
    -webkit-transform: translateX(-50%);
    transform: translateX(-50%);
    top: -6px;
    width: 0;
    height: 0;
    border-color: transparent transparent #fff;
    border-style: solid;
    border-width: 0 6px 6px
}

body[data-responsive=false] .header-main .community-link .wechat-box .qr-code-desc {
    text-align: center;
    font-size: 10px;
    line-height: 12px;
    color: #1f2533;
    max-width: 100px;
    white-space: normal;
    margin-top: 8px
}

body[data-responsive=false] .header-main .community-link:hover .wechat-box {
    display: block
}

body[data-responsive=false] .header-main .nav-gas.hide-gas {
    display: none
}

body[data-responsive=false] .header-main .nav-dashboard, body[data-responsive=false] .header-main .nav-nft {
    display: block
}

body[data-responsive=false] .header-main .nav-buy {
    -webkit-box-ordinal-group: 2;
    order: 1
}

body[data-responsive=false] .header-main .nav-market {
    -webkit-box-ordinal-group: 3;
    order: 2
}

body[data-responsive=false] .header-main .nav-trade {
    -webkit-box-ordinal-group: 4;
    order: 3
}

body[data-responsive=false] .header-main .nav-earn {
    -webkit-box-ordinal-group: 5;
    order: 4
}

body[data-responsive=false] .header-main .nav-academy {
    -webkit-box-ordinal-group: 6;
    order: 5
}

body[data-responsive=false] .header-main .nav-more {
    -webkit-box-ordinal-group: 7;
    order: 6
}

body[data-responsive=false] .header-main .nav-null {
    -webkit-box-ordinal-group: 8;
    order: 7
}

body[data-responsive=false] .header-main .header-search-box {
    -webkit-box-ordinal-group: 9;
    order: 8
}

body[data-responsive=false] .header-main .user-no-login {
    -webkit-box-ordinal-group: 10;
    order: 9
}

body[data-responsive=false] .header-main .nav-balance {
    -webkit-box-ordinal-group: 11;
    order: 10
}

body[data-responsive=false] .header-main .nav-user {
    -webkit-box-ordinal-group: 12;
    order: 11
}

body[data-responsive=false] .header-main .header-line {
    -webkit-box-ordinal-group: 13;
    order: 12
}

body[data-responsive=false] .header-main .nav-right-section {
    -webkit-box-ordinal-group: 14;
    order: 13
}

body[data-responsive=false] .header-main .nav-dashboard {
    -webkit-box-ordinal-group: 2;
    order: 1
}

body[data-responsive=false] .header-main .nav-invest {
    -webkit-box-ordinal-group: 3;
    order: 2
}

body[data-responsive=false] .header-main .nav-nft {
    -webkit-box-ordinal-group: 4;
    order: 3
}

body[data-responsive=false] .header-main .nav-game {
    -webkit-box-ordinal-group: 5;
    order: 4
}

body[data-responsive=false] .header-main .nav-address {
    -webkit-box-ordinal-group: 11;
    order: 10
}

body[data-responsive=false] .header-main .mode-line {
    -webkit-box-ordinal-group: 13;
    order: 12
}

@media (max-width: 1269px) {
    body[data-responsive=false] .nav-more .item-academy {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .nav-academy {
        display: none
    }

    body[data-responsive=false] .header-main.active .nav-right-section {
        position: fixed;
        right: 0;
        width: 376px;
        background: #082850;
        -webkit-box-shadow: 0 12px 60px rgba(0, 0, 0, .3);
        box-shadow: 0 12px 60px rgba(0, 0, 0, .3);
        height: 100%;
        display: -webkit-box;
        display: flex;
        -webkit-transform: translateZ(0);
        transform: translateZ(0);
        z-index: 9500
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-right-container {
        display: block;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        position: absolute;
        top: 48px;
        width: 376px;
        overflow: scroll;
        height: 95%;
        padding: 0 24px 48px;
        -webkit-box-pack: unset;
        justify-content: unset
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-right-container::-webkit-scrollbar {
        display: none
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-wrap {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        width: 100%;
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-item {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        -webkit-box-pack: start;
        justify-content: flex-start;
        padding: 0;
        width: 100%;
        display: -webkit-box;
        display: flex;
        flex-wrap: wrap
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-item .icon-img {
        display: none
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-item.show-more .user-arrow {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-item.show-more .drop-c-left-align, body[data-responsive=false] .header-main.active .nav-right-section .nav-item.show-more .drop-c-right-align {
        display: block;
        pointer-events: visible
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-item .nav-link, body[data-responsive=false] .header-main.active .nav-right-section .nav-item .nav-text {
        font-size: 18px;
        height: 52px;
        padding: 17px 0;
        -webkit-box-flex: 1;
        flex-grow: 1;
        color: hsla(0, 0%, 100%, .85);
        cursor: pointer;
        line-height: unset;
        font-weight: unset
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-item .nav-link:active, body[data-responsive=false] .header-main.active .nav-right-section .nav-item .nav-text:active {
        color: hsla(0, 0%, 100%, .85)
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-item .user-arrow {
        display: inline-block;
        color: hsla(0, 0%, 100%, .85);
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
        margin-left: 4px;
        margin-right: 4px;
        padding: 20px 0;
        cursor: pointer
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-item .user-arrow .icon {
        font-size: 12px;
        font-weight: 500;
        pointer-events: none
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-item .header-line {
        display: block;
        margin: 10px 0;
        border-bottom: none
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-item .drop-c-left-align .box-item, body[data-responsive=false] .header-main.active .nav-right-section .nav-item .drop-c-left-align .extend-link {
        color: hsla(0, 0%, 100%, .6)
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-gas.hide-gas, body[data-responsive=false] .header-main.active .nav-right-section .nav-item .drop-c-left-align .box-item .icon, body[data-responsive=false] .header-main.active .nav-right-section .nav-item .drop-c-left-align .extend-link .icon {
        display: none
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align {
        position: relative;
        display: none;
        left: auto;
        top: auto;
        width: 100%;
        background: transparent;
        visibility: visible;
        opacity: 1;
        padding: 4px 0 4px 12px
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .info-extend-box, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .info-extend-box {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .info-extend-box .item-title, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .info-extend-box .item-title {
        height: 44px;
        padding: 14px 0;
        font-size: 16px;
        color: #808eb6;
        display: inline-block;
        width: 100%
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .info-extend-box .item-title:hover, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .info-extend-box .item-title:hover {
        color: hsla(0, 0%, 100%, .85);
        background: transparent
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .info-extend-box .tab-ms, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .info-extend-box .tab-ms {
        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 20px;
        color: #646f84
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box {
        max-width: unset;
        min-width: unset;
        width: 100%;
        margin: 0;
        padding: 0
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-title, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box .desc-box, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box .icon-box, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box .item-desc, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-title, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box .desc-box, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box .icon-box, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box .item-desc {
        display: none
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item {
        margin: 0;
        height: 44px
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .item-info, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .item-title, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .item-info, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .item-title {
        height: 44px;
        padding: 14px 0;
        font-size: 16px;
        color: #808eb6;
        display: inline-block;
        width: 100%
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .item-info:hover, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .item-title:hover, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .item-info:hover, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .item-title:hover {
        color: hsla(0, 0%, 100%, .85);
        background: transparent
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .text-box .item-title, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .text-box .item-title {
        width: auto
    }

    body[data-responsive=false] .header-main.active .nav-right-section .drop-c-left-align .extend-box .box-item .text-box .blue-font, body[data-responsive=false] .header-main.active .nav-right-section .drop-c-right-align .extend-box .box-item .text-box .blue-font {
        display: inline-block;
        height: 20px;
        padding: 3px 4px;
        font-size: 14px;
        background: rgba(45, 96, 224, .25);
        border-radius: 2px;
        color: #2d60e0
    }

    body[data-responsive=false] .header-main.active .nav-right-section .extend-link {
        height: 44px;
        padding: 14px 0;
        font-size: 16px;
        color: #808eb6;
        display: inline-block;
        width: 100%
    }

    body[data-responsive=false] .header-main.active .nav-right-section .extend-link:hover {
        color: hsla(0, 0%, 100%, .85);
        background: transparent
    }

    body[data-responsive=false] .header-main.active .nav-right-section .extend-link .icon {
        position: relative;
        top: 1px;
        font-size: 16px;
        margin-left: 4px;
        color: #808eb6
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-custom {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        flex-direction: row-reverse;
        -webkit-box-pack: end;
        justify-content: flex-end;
        line-height: unset
    }

    body[data-responsive=false] .header-main.active .nav-right-section .custom-logo, body[data-responsive=false] .header-main.active .nav-right-section .nav-language {
        display: none
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-mode .mode-box {
        width: 100%;
        display: block;
        padding: 12px 0 4px
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-mode .mode-box .box-item .item-box {
        background: rgba(228, 236, 255, .04);
        border-radius: 4px;
        padding: 12px 24px 12px 16px;
        margin-bottom: 12px
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-mode .mode-box .box-item .item-box .item-title {
        line-height: 20px;
        color: #dde1eb;
        padding: unset;
        font-size: 14px;
        height: unset;
        margin-bottom: 2px;
        font-weight: 600
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-mode .mode-box .box-item .item-box .desc-box {
        display: block;
        color: #727b8f
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-mode .mode-box .box-item .item-box .desc-box .desc {
        visibility: visible;
        font-size: 12px;
        font-weight: 400;
        line-height: 18px;
        color: #7b8293
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-mode .mode-box .box-item .item-box.active, body[data-responsive=false] .header-main.active .nav-right-section .nav-mode.mode-chain .box-item .item-chain, body[data-responsive=false] .header-main.active .nav-right-section .nav-mode.mode-okex .box-item .item-okex {
        border: 1px solid #205fec
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-mobile-download .app-box {
        width: 100%
    }

    body[data-responsive=false] .header-main.active .nav-right-section .nav-mobile-download .app-box .download-text {
        display: block;
        margin-top: 48px;
        margin-bottom: 8px;
        width: 100%;
        height: 48px;
        border-radius: 2px;
        border: 1px solid hsla(0, 0%, 100%, .2);
        font-size: 16px;
        font-weight: 400;
        color: #fff;
        line-height: 16px;
        padding: 16px 2px;
        text-align: center
    }

    body[data-responsive=false] .header-main.active .action-container {
        position: fixed;
        right: 24px;
        top: 0
    }
}

@media (min-width: 1270px) {
    body[data-responsive=false] .header-main {
        padding: 0 24px;
        margin: 0 auto;
        visibility: visible
    }

    body[data-responsive=false] .header-main .pc-mode, body[data-responsive=false] .header-main .sm-mode {
        display: none
    }

    body[data-responsive=false] .header-main .new-mode-tab {
        display: -webkit-box;
        display: flex;
        background: hsla(0, 0%, 100%, .15);
        border-radius: 4px;
        margin-left: 20px;
        cursor: pointer;
        padding: 1px
    }

    body[data-responsive=false] .header-main .new-mode-tab .tab-defi, body[data-responsive=false] .header-main .new-mode-tab .tab-exchange {
        padding: 5px 12px;
        font-size: 12px;
        line-height: 16px;
        text-align: justify;
        color: #fff
    }

    body[data-responsive=false] .header-main .new-mode-tab .active {
        background: #205fec;
        -webkit-box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
        box-shadow: 0 4px 4px rgba(0, 0, 0, .1);
        border-radius: 3px
    }

    body[data-responsive=false] .header-main .header-split-line {
        width: 1px;
        height: 16px;
        background: hsla(0, 0%, 100%, .15);
        margin: 16px 10px 16px 24px
    }

    body[data-responsive=false] .header-main .mode-logo {
        -webkit-box-align: center;
        align-items: center;
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main .mode-logo .nav-text {
        font-size: 18px;
        font-weight: 500;
        color: hsla(0, 0%, 100%, .85);
        line-height: 48px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
        display: none
    }

    body[data-responsive=false] .header-main .mode-logo .nav-text .mode-quote {
        width: 4px;
        height: 4px;
        background: hsla(0, 0%, 100%, .85);
        border-radius: 2px;
        margin-right: 4px;
        display: inline-block;
        margin-top: -5px;
        vertical-align: middle;
        margin-left: 4px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align {
        left: -56px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab {
        display: none;
        -webkit-box-align: center;
        align-items: center;
        background: #edf0f7
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab {
        font-style: normal;
        font-weight: 500;
        font-size: 16px;
        line-height: 20px;
        color: #1f2533;
        cursor: pointer;
        padding: 12px 22px;
        position: relative
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .tab-text {
        z-index: 2;
        position: relative
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab.active {
        background: #fff
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab.active .rectangle {
        display: block
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle {
        display: none;
        position: absolute;
        z-index: 1;
        top: 0;
        width: 22px;
        height: 44px;
        background: #fff;
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle:after {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        width: 22px;
        height: 44px;
        background: #edf0f7;
        -webkit-transform-origin: bottom;
        transform-origin: bottom
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle:before {
        content: "";
        display: block;
        position: absolute;
        top: 0;
        width: 22px;
        height: 44px;
        background: #fff
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right {
        left: calc(100% - 9.35px);
        -webkit-transform: skewX(12deg);
        transform: skewX(12deg);
        border-top-right-radius: 6px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right:after {
        left: 100%;
        border-bottom-left-radius: 6px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-right:before {
        left: 100%
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left {
        right: calc(100% - 9.35px);
        -webkit-transform: skewX(-12deg);
        transform: skewX(-12deg);
        border-top-left-radius: 6px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left:after {
        right: 100%;
        border-bottom-right-radius: 6px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab .rectangle.rectangle-left:before {
        right: 100%
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab:first-child {
        padding-right: 14px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .item-tab + .item-tab {
        margin-left: 32px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab .tab-new {
        font-style: normal;
        font-weight: 500;
        font-size: 12px;
        line-height: 16px;
        color: #33b06a;
        background: rgba(51, 176, 106, .1);
        border-radius: 2px;
        height: 16px;
        padding: 0 2px;
        margin-left: 8px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab.flex {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .systemTab.hide {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showNew .new-system-box {
        display: block
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showNew .old-system-box, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showOld .new-system-box {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align.showOld .old-system-box {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .tab-ms {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box + .extend-box {
        margin-left: 12px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box {
        min-width: 320px;
        margin-right: 0
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-title {
        margin-bottom: 8px;
        padding-left: 16px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item {
        margin-bottom: 8px;
        padding: 12px;
        -webkit-transition: all .5s;
        transition: all .5s;
        display: -webkit-box;
        display: flex;
        max-width: 342px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .icon-img {
        flex-shrink: 0;
        height: 36px;
        width: 36px;
        margin-right: 10px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .icon-box {
        margin-right: 8px;
        margin-top: -4px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        width: 100%
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .item-title {
        font-weight: 600;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533;
        margin-bottom: 2px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .title-ms {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .title-pc {
        display: block
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box.hide {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box.show {
        display: block
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .blue-font {
        color: #205fec;
        font-size: 12px;
        background: rgba(32, 95, 236, .1);
        border-radius: 1px 4px 4px 1px;
        padding: 0 6px;
        height: 18px;
        font-weight: 500;
        display: inline-block;
        line-height: 18px;
        vertical-align: text-top
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .item-desc {
        margin-top: 4px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box {
        position: relative
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .desc {
        visibility: visible;
        font-size: 12px;
        font-weight: 400;
        line-height: 18px;
        color: #7b8293
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link {
        position: absolute;
        top: 0;
        visibility: hidden
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link {
        font-size: 12px;
        font-weight: 500;
        line-height: 18px;
        color: #205fec
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link:last-child {
        color: #7b8293
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .link:hover {
        color: #205fec
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item .item-box .desc-box .item-link .split-line {
        width: 1px;
        height: 10px;
        background: #d8dce6;
        display: inline-block;
        margin: 0 8px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover {
        cursor: pointer;
        background: #f4f6fa;
        border-radius: 2px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box .desc {
        visibility: hidden
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box .item-link, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box.new-desc-box .desc {
        visibility: visible
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item:hover .item-box .desc-box.new-desc-box .item-link {
        visibility: hidden
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .extend-box .box-item[data-monitor-more=crossChainGateway] {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box {
        display: block;
        min-width: 698px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .icon-img {
        display: block;
        width: 56px;
        height: 56px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .trade-line {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .item-title {
        font-style: normal;
        font-weight: 600;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533;
        text-align: center
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .tab-ms, body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .title-ms {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .title-pc {
        display: block
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        -webkit-box-align: center;
        align-items: center;
        padding: 36px 12px 50px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .icon-img {
        margin-bottom: 6px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-title {
        font-weight: 600;
        font-size: 18px;
        line-height: 20px;
        text-align: center;
        color: #1f2533;
        margin-bottom: 6px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-desc {
        font-size: 14px;
        line-height: 16px;
        text-align: center;
        color: #7b8293
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .new-desc-pc .item-button {
        margin-top: 32px;
        background: #205fec;
        border-radius: 2px;
        cursor: pointer;
        font-size: 16px;
        line-height: 20px;
        color: #fff
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .item-desc {
        width: 100%;
        font-weight: 400;
        font-size: 12px;
        line-height: 16px;
        text-align: center;
        color: #9aa1b1;
        margin-top: 2px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .new-system-box .item-button {
        background: #2d60e0;
        border: 1px solid #2d60e0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
        box-shadow: 0 1px 2px rgba(0, 0, 0, .05);
        border-radius: 2px;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        text-align: center;
        color: #fff;
        padding: 8px 22px;
        margin-top: 24px
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .old-system-box {
        padding: 16px 12px 20px;
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .only-new-box {
        padding: 8px 0;
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .only-new-box .extend-box .box-item {
        margin: unset
    }

    body[data-responsive=false] .header-main .nav-trade .drop-c-left-align .only-new-box .extend-box .box-item:hover .item-box .desc-box .desc {
        visibility: visible
    }

    body[data-responsive=false] .header-main .nav-trade.old .drop-c-left-align .only-new-box, body[data-responsive=false] .header-main .nav-trade.old .systemTab, body[data-responsive=false] .header-main .nav-trade.old .tab-ms, body[data-responsive=false] .header-main .nav-trade.old .trade-line {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade.old .drop-c-left-align .old-system-box {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main .nav-trade.new .tab-ms, body[data-responsive=false] .header-main .nav-trade.new .trade-line, body[data-responsive=false] .header-main .nav-trade.old .drop-c-left-align .new-system-box, body[data-responsive=false] .header-main .nav-trade.old .drop-c-left-align .systemTab {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade.new .drop-c-left-align {
        left: -2px
    }

    body[data-responsive=false] .header-main .nav-trade.new .drop-c-left-align .only-new-box {
        display: block
    }

    body[data-responsive=false] .header-main .nav-trade.new .drop-c-left-align .new-system-box, body[data-responsive=false] .header-main .nav-trade.new .drop-c-left-align .old-system-box, body[data-responsive=false] .header-main .nav-trade.new .drop-c-left-align .systemTab {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade.oldAndNew .systemTab {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main .nav-trade.oldAndNew .tab-ms, body[data-responsive=false] .header-main .nav-trade.oldAndNew .trade-line {
        display: none
    }

    body[data-responsive=false] .header-main .nav-trade.oldAndNew .drop-c-left-align {
        left: -56px;
        -webkit-transform: inherit;
        transform: inherit
    }

    body[data-responsive=false] .header-main .nav-trade.oldAndNew .drop-c-left-align .only-new-box {
        display: none
    }

    body[data-responsive=false] .header-main .nav-earn .drop-c-left-align {
        left: -2px;
        padding-top: 8px;
        padding-bottom: 8px
    }

    body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box {
        min-width: 220px
    }

    body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item {
        -webkit-box-align: center;
        align-items: center
    }

    body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .icon {
        font-size: 24px
    }

    body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .item-info {
        font-weight: 600;
        font-size: 14px;
        line-height: 20px
    }

    body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .desc-box {
        display: none;
        margin-top: 2px
    }

    body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .info-extend-box .extend-box .box-item .item-box .desc-box .desc {
        visibility: visible;
        font-size: 12px;
        line-height: 18px;
        color: #7b8293
    }

    body[data-responsive=false] .header-main .nav-more .drop-c-left-align {
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        padding-top: 12px;
        padding-bottom: 12px
    }

    body[data-responsive=false] .header-main .nav-more .drop-c-left-align .info-extend-box .extend-box {
        min-width: 190px;
        margin-right: 0
    }

    body[data-responsive=false] .header-main .nav-more .item-academy {
        display: none
    }

    body[data-responsive=false] .header-main .nav-earn .drop-c-left-align, body[data-responsive=false] .header-main .nav-more .drop-c-left-align {
        max-width: 700px
    }

    body[data-responsive=false] .header-main .nav-earn .drop-c-left-align .extend-box:last-child, body[data-responsive=false] .header-main .nav-more .drop-c-left-align .extend-box:last-child {
        margin-right: 0
    }

    body[data-responsive=false] .header-main .nav-null {
        -webkit-box-flex: 1;
        flex-grow: 1
    }

    body[data-responsive=false] .header-main .drop-c-left-align, body[data-responsive=false] .header-main .drop-c-right-align {
        position: absolute;
        overflow: hidden;
        border-radius: 4px;
        background: #fff;
        -webkit-box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
        box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
        z-index: 9500;
        visibility: hidden;
        opacity: 0;
        -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
        transition: all .3s cubic-bezier(.645, .045, .355, 1);
        cursor: default;
        pointer-events: none
    }

    body[data-responsive=false] .header-main .drop-c-left-align {
        font-weight: 400;
        top: 58px;
        left: -14px
    }

    body[data-responsive=false] .header-main .drop-c-left-align .info-extend-box {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box {
        margin-right: 48px
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box:last-child {
        margin-right: 0
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-title {
        padding-left: 20px;
        font-weight: 600;
        font-size: 12px;
        line-height: 20px;
        color: #9aa1b1
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item {
        display: -webkit-box;
        display: flex;
        margin-bottom: 28px
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .icon-img {
        width: 28px;
        flex-shrink: 0
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item:last-child {
        margin-bottom: 0
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .icon-box {
        margin-right: 8px
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .icon-box .icon {
        height: 28px;
        width: 28px
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .item-box {
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-title {
        font-size: 14px;
        font-weight: 400;
        color: #35384a;
        line-height: 16px
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-desc {
        font-size: 12px;
        font-weight: 400;
        color: #a7adba;
        line-height: 14px;
        margin-top: 3px
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item .item-box .item-info {
        font-size: 14px;
        font-weight: 400;
        color: #35384a
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item:hover .item-box .item-info, body[data-responsive=false] .header-main .drop-c-left-align .extend-box .box-item:hover .item-box .item-title {
        color: #2d60e0
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box {
        margin-right: 80px;
        min-width: 120px
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-title {
        margin-bottom: 10px
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        margin-bottom: 0;
        padding: 11px 16px;
        cursor: pointer
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item .icon {
        font-size: 22px;
        color: #91b1ff;
        margin-right: 8px
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item .item-box .item-info {
        padding: unset;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item:hover {
        color: #205fec;
        background: #f7f9fc
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item:hover .icon {
        color: #205fec
    }

    body[data-responsive=false] .header-main .drop-c-left-align .extend-small-box .box-item.item-academy {
        display: none
    }

    body[data-responsive=false] .header-main .drop-c-left-align .line {
        height: 1px;
        background-color: #eff1f4
    }

    body[data-responsive=false] .header-main .user-no-login {
        display: none
    }

    body[data-responsive=false] .header-main .nav-download, body[data-responsive=false] .header-main .nav-notice {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main .nav-balance, body[data-responsive=false] .header-main .nav-user {
        text-align: right;
        cursor: pointer;
        position: relative;
        line-height: 48px;
        font-weight: 500;
        display: none
    }

    body[data-responsive=false] .header-main .nav-balance:hover .user-balance-href, body[data-responsive=false] .header-main .nav-balance:hover .user-balance-text, body[data-responsive=false] .header-main .nav-balance:hover .user-info, body[data-responsive=false] .header-main .nav-user:hover .user-balance-href, body[data-responsive=false] .header-main .nav-user:hover .user-balance-text, body[data-responsive=false] .header-main .nav-user:hover .user-info {
        color: #fff
    }

    body[data-responsive=false] .header-main .nav-balance:hover .user-arrow, body[data-responsive=false] .header-main .nav-user:hover .user-arrow {
        color: #fff;
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    body[data-responsive=false] .header-main .nav-balance:hover .drop-c-left-align, body[data-responsive=false] .header-main .nav-user:hover .drop-c-left-align {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        top: 48px
    }

    body[data-responsive=false] .header-main .nav-balance .user-balance-href, body[data-responsive=false] .header-main .nav-balance .user-balance-text, body[data-responsive=false] .header-main .nav-balance .user-info, body[data-responsive=false] .header-main .nav-user .user-balance-href, body[data-responsive=false] .header-main .nav-user .user-balance-text, body[data-responsive=false] .header-main .nav-user .user-info {
        color: hsla(0, 0%, 100%, .85);
        font-size: 14px;
        float: left;
        margin-right: 8px;
        height: 48px
    }

    body[data-responsive=false] .header-main .nav-balance .user-info, body[data-responsive=false] .header-main .nav-user .user-info {
        margin-right: 0;
        -webkit-box-align: center;
        align-items: center;
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main .nav-balance .user-info .user-loginName, body[data-responsive=false] .header-main .nav-user .user-info .user-loginName {
        display: none;
        font-size: 14px;
        line-height: 20px;
        margin-left: 8px
    }

    body[data-responsive=false] .header-main .nav-balance .user-info .user-loginName.show, body[data-responsive=false] .header-main .nav-user .user-info .user-loginName.show {
        display: inline-block
    }

    body[data-responsive=false] .header-main .nav-balance .user-balance-href, body[data-responsive=false] .header-main .nav-user .user-balance-href {
        display: block
    }

    body[data-responsive=false] .header-main .nav-balance .user-balance-text, body[data-responsive=false] .header-main .nav-user .user-balance-text {
        display: none
    }

    body[data-responsive=false] .header-main .nav-balance .user-arrow, body[data-responsive=false] .header-main .nav-user .user-arrow {
        display: inline-block;
        width: 14px;
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }

    body[data-responsive=false] .header-main .nav-balance .user-arrow .icon, body[data-responsive=false] .header-main .nav-user .user-arrow .icon {
        font-size: 10px;
        width: 14px;
        height: 14px;
        line-height: 14px;
        text-align: center;
        display: inline-block
    }

    body[data-responsive=false] .header-main .nav-balance .drop-c-left-align, body[data-responsive=false] .header-main .nav-user .drop-c-left-align {
        padding: 8px 0;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        left: -24px;
        min-width: 184px
    }

    body[data-responsive=false] .header-main .nav-balance .drop-c-left-align .extend-link .icon, body[data-responsive=false] .header-main .nav-user .drop-c-left-align .extend-link .icon {
        font-size: 22px;
        color: #91b1ff;
        margin-right: 8px
    }

    body[data-responsive=false] .header-main .nav-balance .drop-c-left-align .extend-link:hover .icon, body[data-responsive=false] .header-main .nav-user .drop-c-left-align .extend-link:hover .icon {
        color: #2d60e0
    }

    body[data-responsive=false] .header-main .nav-user {
        padding-left: 18px;
        padding-right: 10px;
        margin-right: 18px
    }

    body[data-responsive=false] .header-main .nav-user .user-account-text, body[data-responsive=false] .header-main .nav-user .user-arrow {
        display: none
    }

    body[data-responsive=false] .header-main .nav-user .user-info {
        margin-right: 0
    }

    body[data-responsive=false] .header-main .nav-user .user-info .icon {
        font-size: 20px
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align {
        padding-top: 0;
        left: -28px;
        min-width: 220px
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-info-item {
        min-height: 48px;
        width: 100%;
        line-height: 1;
        padding: 16px 18px 8px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        text-align: left;
        cursor: default
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align .line {
        height: 1px;
        width: calc(100% - 36px);
        background: #edf0f7;
        margin: 6px auto
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-account {
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align .sub-account {
        padding-top: 14px
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-level {
        display: inline-block;
        line-height: 1;
        text-align: left
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-level .sub-tag-wrap {
        height: 16px;
        line-height: 16px;
        padding: 0 4px;
        background: #dfeafc;
        border-radius: 2px;
        text-align: center;
        display: inline-block;
        margin: 0 3px 0 0
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-level .sub-tag {
        font-weight: 400;
        color: #3075ee;
        -webkit-transform: scale(.83);
        transform: scale(.83);
        font-size: 12px;
        display: inline-block;
        -webkit-transform-origin: top;
        transform-origin: top
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-level .level-tag-wrap {
        height: 14px;
        background: #e4f4ea;
        padding: 2px 4px;
        display: inline-block;
        line-height: 14px;
        margin: 0
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align .user-level .level-tag {
        font-size: 12px;
        color: #4db872;
        font-weight: 600;
        display: inline-block;
        text-align: left;
        -webkit-transform: scale(.83);
        transform: scale(.83);
        vertical-align: middle;
        border-radius: 2px;
        font-style: italic;
        -webkit-transform-origin: top;
        transform-origin: top
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align .sub-account-uid {
        font-size: 12px;
        line-height: 16px;
        color: #9aa1b1;
        margin-top: 2px
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align .logout {
        margin-top: 0;
        cursor: pointer;
        padding: 10px 18px
    }

    body[data-responsive=false] .header-main .nav-balance {
        padding: 0 12px 0 0
    }

    body[data-responsive=false] .header-main .nav-balance .user-arrow {
        margin-left: 0
    }

    body[data-responsive=false] .header-main .nav-balance .item-real, body[data-responsive=false] .header-main .nav-balance .item-simulated {
        display: none
    }

    body[data-responsive=false] .header-main .nav-balance .drop-c-left-align {
        min-width: 220px;
        left: -16px;
        right: unset
    }

    body[data-responsive=false] .header-main .header-line {
        display: block;
        width: 1px;
        height: 16px;
        background: hsla(0, 0%, 100%, .15);
        margin: 16px 0
    }

    body[data-responsive=false] .header-main .mode-line {
        width: 1px;
        height: 16px;
        background: hsla(0, 0%, 100%, .15);
        margin: 16px 0;
        display: none
    }

    body[data-responsive=false] .header-main .other-wrap {
        display: -webkit-box;
        display: flex;
        cursor: pointer;
        padding: 0 13px;
        width: 44px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        line-height: 48px;
        position: relative
    }

    body[data-responsive=false] .header-main .other-wrap .icon {
        font-size: 20px;
        color: hsla(0, 0%, 100%, .8)
    }

    body[data-responsive=false] .header-main .other-wrap .drop-c-right-align {
        top: 58px;
        right: 0;
        padding: 0 24px;
        overflow: visible
    }

    body[data-responsive=false] .header-main .other-wrap:hover .drop-c-right-align {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
        top: 48px
    }

    body[data-responsive=false] .header-main .nav-download {
        padding-left: 10px;
        padding-right: 10px;
        width: 40px;
        margin-left: 14px
    }

    body[data-responsive=false] .header-main .nav-download .drop-c-right-align {
        padding: 4px;
        min-width: 180px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    body[data-responsive=false] .header-main .nav-download .drop-c-right-align .download-box, body[data-responsive=false] .header-main .nav-download .drop-c-right-align .download-box .qr-box {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column
    }

    body[data-responsive=false] .header-main .nav-download .drop-c-right-align .download-box .qr-box {
        padding: 20px 0;
        flex-shrink: 0;
        -webkit-box-align: center;
        align-items: center
    }

    body[data-responsive=false] .header-main .nav-download .drop-c-right-align .download-box .qr-box .qr-code-desc {
        white-space: nowrap;
        font-weight: 600;
        font-size: 12px;
        line-height: 16px;
        color: #1f2533;
        margin-bottom: 6px
    }

    body[data-responsive=false] .header-main .nav-download .drop-c-right-align .download-box .qr-box .img-box {
        width: 100px;
        height: 100px
    }

    body[data-responsive=false] .header-main .nav-download .drop-c-right-align .download-box .qr-box .img-box .qr-code-img {
        display: block;
        width: 100%;
        height: 100%
    }

    body[data-responsive=false] .header-main .nav-download .drop-c-right-align .download-box .pc-box {
        background: #f4f6fa;
        border-radius: 2px;
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        -webkit-box-align: center;
        align-items: center;
        padding: 8px
    }

    body[data-responsive=false] .header-main .nav-download .drop-c-right-align .download-box .pc-box .download-btn {
        font-size: 12px;
        color: #1f2533;
        line-height: 16px;
        padding: 3px 14px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        background: #fff;
        border: .5px solid #d8dce5;
        border-radius: 4px;
        margin-bottom: 8px
    }

    body[data-responsive=false] .header-main .nav-download .drop-c-right-align .download-box .pc-box .download-desc {
        font-size: 12px;
        line-height: 16px;
        color: #9aa1b1;
        text-align: center
    }

    body[data-responsive=false] .header-main .nav-notice {
        position: static
    }

    body[data-responsive=false] .header-main .nav-notice .notice-icon {
        line-height: 48px;
        position: relative
    }

    body[data-responsive=false] .header-main .nav-notice .notice-icon .notice-new {
        background-color: #ff6e00;
        width: 6px;
        height: 6px;
        border-radius: 100px;
        position: absolute;
        right: 0;
        top: 14px;
        display: none
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align {
        padding: 8px 0;
        right: 0;
        overflow: hidden
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align .notice-box {
        width: 336px
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align .notice-box .notice-title {
        display: none
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item {
        padding: 12px 18px;
        display: inline-block;
        width: 100%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item:hover {
        background: #f7f9fc
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item:hover .item-title {
        color: #2d60e0
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item .item-title {
        color: #1f2533;
        font-size: 12px;
        font-weight: 500;
        line-height: 18px
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align .notice-box .notice-list .notice-item .item-date {
        font-size: 12px;
        line-height: 20px;
        font-weight: 400;
        color: #7b8293;
        margin-top: 2px
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align .notice-box .notice-more {
        padding: 12px 18px;
        font-weight: 500;
        font-size: 12px;
        line-height: 18px;
        color: #205fec;
        width: 100%;
        display: inline-block
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align .notice-empty {
        display: none;
        width: 240px;
        height: 158px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        -webkit-box-align: center;
        align-items: center;
        -webkit-box-pack: center;
        justify-content: center
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align .notice-empty .empty-icon {
        display: block;
        width: 80px;
        height: 80px;
        margin-bottom: 6px
    }

    body[data-responsive=false] .header-main .nav-notice .drop-c-right-align .notice-empty .empty-desc {
        font-weight: 500;
        font-size: 12px;
        line-height: 18px;
        color: #3f475a
    }

    body[data-responsive=false] .header-main .nav-custom {
        position: static
    }

    body[data-responsive=false] .header-main .nav-custom .user-arrow, body[data-responsive=false] .header-main .nav-custom .user-support-text {
        display: none
    }

    body[data-responsive=false] .header-main .nav-custom .drop-c-right-align {
        padding: 8px 0;
        min-width: 152px;
        right: 0
    }

    body[data-responsive=false] .header-main .nav-custom .extend-link {
        -webkit-box-pack: justify;
        justify-content: space-between
    }

    body[data-responsive=false] .header-main .nav-custom .extend-link .icon {
        color: #1f2533;
        font-size: 16px;
        margin-left: 12px
    }

    body[data-responsive=false] .header-main .nav-custom .extend-link .icon.icon-wechat2 {
        color: #00bc6b
    }

    body[data-responsive=false] .header-main .nav-custom .extend-link .icon.icon-telegram1 {
        color: #1dade9
    }

    body[data-responsive=false] .header-main .nav-custom .extend-link.click-disable {
        opacity: .5;
        cursor: not-allowed
    }

    body[data-responsive=false] .header-main .nav-custom .extend-link.click-disable:hover {
        color: #35384a;
        background: unset
    }

    body[data-responsive=false] .header-main .nav-language {
        display: -webkit-box;
        display: flex;
        padding-right: 0;
        width: 32px;
        position: relative
    }

    body[data-responsive=false] .header-main .nav-language:hover .language-list {
        visibility: visible;
        opacity: 1;
        top: 48px;
        pointer-events: auto
    }

    body[data-responsive=false] .header-main .nav-language:hover .language-list .list-ul {
        overflow-y: auto
    }

    body[data-responsive=false] .header-main .nav-language .language-list {
        position: absolute;
        pointer-events: none;
        top: 58px;
        right: 0;
        z-index: 9500;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        background: #fff;
        -webkit-box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
        box-shadow: 0 12px 60px rgba(14, 32, 66, .15), 0 1px 2px rgba(14, 32, 66, .05);
        border-radius: 2px;
        padding-top: 12px;
        visibility: hidden;
        opacity: 0;
        -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
        transition: all .3s cubic-bezier(.645, .045, .355, 1);
        display: -webkit-box;
        display: flex;
        overflow: hidden
    }

    body[data-responsive=false] .header-main .nav-language .language-list .ul-title {
        font-size: 12px;
        font-weight: 400;
        color: #9aa1b1;
        line-height: 14px;
        margin-bottom: 4px;
        padding-left: 12px
    }

    body[data-responsive=false] .header-main .nav-language .language-list .list-ul {
        height: 100%;
        max-height: 308px;
        overflow-y: hidden;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    body[data-responsive=false] .header-main .nav-language .language-list .list-ul::-webkit-scrollbar {
        width: 2px
    }

    body[data-responsive=false] .header-main .nav-language .language-list .list-ul::-webkit-scrollbar-track {
        background: #edf0f7
    }

    body[data-responsive=false] .header-main .nav-language .language-list .list-ul::-webkit-scrollbar-thumb {
        background: #d8dce6;
        border-radius: 1px
    }

    body[data-responsive=false] .header-main .nav-language .language-list .language {
        white-space: nowrap;
        display: block;
        height: 48px;
        line-height: 48px;
        font-size: 14px;
        color: #1f2533;
        padding: 0 12px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        cursor: pointer;
        position: relative
    }

    body[data-responsive=false] .header-main .nav-language .language-list .language .language-link {
        color: #1f2533;
        pointer-events: none
    }

    body[data-responsive=false] .header-main .nav-language .language-list .language:hover {
        background: #f7f9fc;
        color: #2d60e0
    }

    body[data-responsive=false] .header-main .nav-language .language-list .language:hover .language-link {
        color: #2d60e0
    }

    body[data-responsive=false] .header-main .nav-language .language-list .language .now-select-item {
        color: #1f2533
    }

    body[data-responsive=false] .header-main .nav-language .language-list .language .now-select, body[data-responsive=false] .header-main .nav-language .language-list .language .select-icon {
        height: 10px;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%);
        right: 6px;
        position: absolute
    }

    body[data-responsive=false] .header-main .nav-language .language-list .language .select-icon {
        width: 10px;
        font-size: 12px;
        line-height: 12px;
        color: #3f475a
    }

    body[data-responsive=false] .header-main .nav-language .language-list .ul-box .list-ul {
        min-width: 146px;
        max-height: 288px
    }

    body[data-responsive=false] .header-main .nav-language .language-list .ul-box:last-child .list-ul {
        width: 136px
    }

    body[data-responsive=false] .header-main.is-login .user-no-login, body[data-responsive=false] .header-main .nav-mobile-download, body[data-responsive=false] .header-main .profile-wrap {
        display: none
    }

    body[data-responsive=false] .header-main.is-login .nav-balance, body[data-responsive=false] .header-main.is-login .nav-user {
        display: block
    }

    body[data-responsive=false] .header-main.is-login .header-line {
        margin-left: unset;
        margin-right: unset
    }

    body[data-responsive=false] .header-main.not-login .user-no-login {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main.not-login .header-line {
        display: block
    }

    body[data-responsive=false] .header-main .action-container {
        display: none
    }

    body[data-responsive=false] .header-main .extend-link {
        padding: 10px 16px;
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px;
        color: #1f2533;
        height: unset;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        white-space: nowrap;
        cursor: pointer
    }

    body[data-responsive=false] .header-main .extend-link:hover {
        background: #f4f6fa;
        color: #205fec
    }

    body[data-responsive=false] .header-main .community-link {
        position: relative
    }

    body[data-responsive=false] .header-main .community-link .wechat-box {
        width: 124px;
        padding: 12px;
        background: #fff;
        -webkit-box-shadow: 0 7px 14px 0 rgba(0, 0, 0, .1);
        box-shadow: 0 7px 14px 0 rgba(0, 0, 0, .1);
        border-radius: 4px;
        position: absolute;
        top: 58px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        display: none
    }

    body[data-responsive=false] .header-main .community-link .wechat-box img {
        height: 100%;
        width: 100%
    }

    body[data-responsive=false] .header-main .community-link .wechat-box:before {
        content: "";
        display: block;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        top: -6px;
        width: 0;
        height: 0;
        border-color: transparent transparent #fff;
        border-style: solid;
        border-width: 0 6px 6px
    }

    body[data-responsive=false] .header-main .community-link .wechat-box .qr-code-desc {
        text-align: center;
        font-size: 10px;
        line-height: 12px;
        color: #1f2533;
        max-width: 100px;
        white-space: normal;
        margin-top: 8px
    }

    body[data-responsive=false] .header-main .community-link:hover .wechat-box {
        display: block
    }

    body[data-responsive=false] .header-main .nav-right-section .nav-right-container {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main .mode-xl-line {
        display: block
    }

    body[data-responsive=false] .header-main .nav-invest .invest-tag {
        display: none
    }

    body[data-responsive=false] .header-main .nav-invest .invest-tip-container {
        position: absolute;
        padding: 8px 12px;
        background: #fff;
        z-index: 9500;
        visibility: hidden;
        opacity: 0;
        -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
        transition: all .3s cubic-bezier(.645, .045, .355, 1);
        cursor: default;
        font-size: 14px;
        line-height: 22px;
        color: #3f475a;
        -webkit-box-shadow: rgba(0, 0, 0, .05) 0 4px 6px -2px, rgba(0, 0, 0, .1) 0 10px 15px -3px;
        box-shadow: 0 4px 6px -2px rgba(0, 0, 0, .05), 0 10px 15px -3px rgba(0, 0, 0, .1);
        border-radius: 4px;
        top: 44px;
        min-width: 110px;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%);
        pointer-events: none
    }

    body[data-responsive=false] .header-main .nav-invest .invest-tip-arrow {
        width: 12px;
        height: 12px;
        top: -5px;
        position: absolute;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    body[data-responsive=false] .header-main .nav-invest .invest-tip-arrow-inner {
        display: block;
        width: 100%;
        height: 100%;
        -webkit-transform: rotate(45deg);
        transform: rotate(45deg);
        -webkit-transform-origin: center;
        transform-origin: center;
        border: 1px solid rgba(0, 0, 0, .02);
        border-radius: 2px;
        background-color: #fff
    }

    body[data-responsive=false] .header-main .nav-invest:hover {
        color: #fff
    }

    body[data-responsive=false] .header-main .nav-invest:hover .invest-tip-container {
        opacity: 1;
        visibility: visible;
        pointer-events: auto
    }

    body[data-responsive=false] .header-main .nav-gas {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=false] .header-main .nav-gas.hide-gas {
        display: none
    }

    body[data-responsive=false] .header-main .nav-buy {
        -webkit-box-ordinal-group: 2;
        order: 1
    }

    body[data-responsive=false] .header-main .nav-market {
        -webkit-box-ordinal-group: 3;
        order: 2
    }

    body[data-responsive=false] .header-main .nav-trade {
        -webkit-box-ordinal-group: 4;
        order: 3
    }

    body[data-responsive=false] .header-main .nav-earn {
        -webkit-box-ordinal-group: 5;
        order: 4
    }

    body[data-responsive=false] .header-main .nav-academy {
        -webkit-box-ordinal-group: 6;
        order: 5
    }

    body[data-responsive=false] .header-main .nav-more {
        -webkit-box-ordinal-group: 7;
        order: 6
    }

    body[data-responsive=false] .header-main .nav-null {
        -webkit-box-ordinal-group: 8;
        order: 7
    }

    body[data-responsive=false] .header-main .header-search-box {
        -webkit-box-ordinal-group: 9;
        order: 8
    }

    body[data-responsive=false] .header-main .user-no-login {
        -webkit-box-ordinal-group: 10;
        order: 9
    }

    body[data-responsive=false] .header-main .nav-balance {
        -webkit-box-ordinal-group: 11;
        order: 10
    }

    body[data-responsive=false] .header-main .nav-user {
        -webkit-box-ordinal-group: 12;
        order: 11
    }

    body[data-responsive=false] .header-main .header-line, body[data-responsive=false] .header-main .nav-right-section {
        -webkit-box-ordinal-group: 13;
        order: 12
    }

    body[data-responsive=false] .header-main .nav-download {
        -webkit-box-ordinal-group: 14;
        order: 13
    }

    body[data-responsive=false] .header-main .nav-notice {
        -webkit-box-ordinal-group: 15;
        order: 14
    }

    body[data-responsive=false] .header-main .nav-custom {
        -webkit-box-ordinal-group: 16;
        order: 15
    }

    body[data-responsive=false] .header-main .nav-language {
        -webkit-box-ordinal-group: 17;
        order: 16
    }

    body[data-responsive=false] .header-main .nav-dashboard {
        -webkit-box-ordinal-group: 2;
        order: 1
    }

    body[data-responsive=false] .header-main .nav-invest {
        -webkit-box-ordinal-group: 3;
        order: 2
    }

    body[data-responsive=false] .header-main .nav-nft {
        -webkit-box-ordinal-group: 4;
        order: 3
    }

    body[data-responsive=false] .header-main .nav-game {
        -webkit-box-ordinal-group: 5;
        order: 4
    }

    body[data-responsive=false] .header-main .nav-address {
        -webkit-box-ordinal-group: 11;
        order: 10
    }

    body[data-responsive=false] .header-main .nav-gas {
        -webkit-box-ordinal-group: 12;
        order: 11
    }

    body[data-responsive=false] .header-main .mode-line, body[data-responsive=false] .header-main .mode-xl-line {
        -webkit-box-ordinal-group: 13;
        order: 12
    }
}

@media (min-width: 1270px) and (min-width: 1270px) {
    body[data-responsive=false] .header-main .nav-user {
        position: relative
    }

    body[data-responsive=false] .header-main .nav-user .drop-c-left-align {
        left: -28px;
        right: unset
    }
}

body[data-responsive=false] .header-main .nav-user {
    position: relative
}

body[data-responsive=false] .header-main .nav-user .drop-c-left-align {
    left: unset;
    right: 0
}

body[data-responsive=true] .footer-wrap {
    padding-left: 8px;
    padding-right: 8px
}

@media (min-width: 768px) {
    body[data-responsive=true] .footer-wrap {
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    body[data-responsive=true] .footer-wrap {
        padding-left: calc((100% - 960px) / 2);
        padding-right: calc((100% - 960px) / 2)
    }
}

@media (min-width: 1270px) {
    body[data-responsive=true] .footer-wrap {
        padding-left: calc((100% - 1248px) / 2);
        padding-right: calc((100% - 1248px) / 2)
    }
}

body[data-responsive=true] .footer-wrap .footer-main .hide-link {
    display: none !important
}

@media (max-width: 767px) {
    body[data-responsive=true] .footer-container .footer-wrap .footer-main {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        position: relative
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left {
        display: -webkit-box;
        display: flex;
        -webkit-box-ordinal-group: 3;
        order: 2;
        position: relative;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .footer-logo {
        display: none
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box {
        -webkit-box-ordinal-group: 2;
        order: 1;
        position: relative;
        margin-bottom: 12px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box .now-language {
        font-size: 16px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box .language-list .language {
        height: 48px;
        font-size: 16px;
        font-weight: 500
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box .language-list .ul-box .list-ul {
        max-height: 288px;
        overflow-y: auto
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box .language-list .ul-box:first-child .list-ul {
        width: 163px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box .language-list .ul-box:first-child .list-ul .language-link {
        width: 100%;
        white-space: normal;
        word-break: break-all
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box .language-list .ul-box:last-child .list-ul {
        width: 136px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box.active .now-language .arrow-icon {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box.active .language-list {
        visibility: visible;
        opacity: 1;
        bottom: 51px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .list {
        -webkit-box-ordinal-group: 4;
        order: 3;
        text-align: center;
        display: -webkit-box;
        display: flex;
        height: 43px;
        -webkit-box-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        align-items: center;
        border-top: 1px solid hsla(0, 0%, 100%, .04)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .list .icon-down-text {
        display: none
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .list .copy-info {
        color: hsla(0, 0%, 100%, .35);
        font-size: 12px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list {
        -webkit-box-ordinal-group: 3;
        order: 2;
        max-width: calc(100vw - 40px);
        display: -webkit-box;
        display: flex;
        flex-wrap: wrap;
        margin-bottom: 37px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat {
        color: hsla(0, 0%, 100%, .35);
        margin-bottom: 8px;
        margin-right: 16px;
        position: relative
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat .iconfont {
        font-size: 24px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat:hover .weichat-qrcode-box {
        visibility: visible;
        opacity: 1;
        bottom: 24px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat .weichat-qrcode-box {
        position: absolute;
        width: 108px;
        height: 108px;
        border-radius: 5px;
        z-index: 999;
        bottom: 34px;
        left: 50%;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
        transition: all .3s cubic-bezier(.645, .045, .355, 1)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat .weichat-qrcode-box img {
        border-radius: 4px;
        width: 100%;
        height: 100%
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right {
        -webkit-box-ordinal-group: 2;
        order: 1;
        padding: 36px 4px 45px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .community-title {
        display: none
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .title-box {
        height: 52px;
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        -webkit-box-pack: justify;
        justify-content: space-between;
        cursor: pointer
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .title-box .title {
        font-size: 18px;
        color: hsla(0, 0%, 100%, .85)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .title-box .user-arrow {
        color: hsla(0, 0%, 100%, .85)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .title-box .user-arrow .iconfont {
        font-size: 12px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .item-box {
        margin-top: 4px;
        margin-bottom: 4px;
        display: none
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .item-box .list-item .link {
        height: 44px;
        padding: 0 13px;
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        color: hsla(0, 0%, 100%, .65)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .item-box .list-item .link:hover {
        color: hsla(0, 0%, 100%, .85)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .icon-list {
        display: none
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list.active .title-box .user-arrow {
        -webkit-transform: rotate(180deg);
        transform: rotate(180deg)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list.active .item-box {
        display: block
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-link {
        display: none
    }
}

@media (max-width: 767px) and (max-width: 767px) {
    body[data-responsive=true] .footer-link, body[data-responsive=true] .footer-main {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

@media (min-width: 768px) and (max-width: 1023px) {
    body[data-responsive=true] .footer-container .footer-wrap .footer-main {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        position: relative
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left {
        -webkit-box-ordinal-group: 3;
        order: 2;
        display: -webkit-box;
        display: flex;
        flex-wrap: wrap;
        -webkit-box-pack: justify;
        justify-content: space-between
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .footer-logo {
        display: none
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box {
        -webkit-box-ordinal-group: 2;
        order: 1;
        position: relative;
        left: unset;
        bottom: unset;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box .language {
        height: 44px;
        font-size: 14px;
        font-weight: 400
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box .ul-box:first-child .list-ul {
        min-width: 146px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box .ul-box:last-child .list-ul {
        width: 132px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box.active .now-language .arrow-icon {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box.active .language-list {
        visibility: visible;
        opacity: 1;
        bottom: 51px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .all-language-box.active .language-list .list-ul {
        overflow-y: auto
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .list {
        -webkit-box-ordinal-group: 4;
        order: 3;
        width: 100%;
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        -webkit-box-pack: center;
        justify-content: center;
        border-top: 1px solid hsla(0, 0%, 100%, .04);
        height: 42px;
        margin-top: 40px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .list .icon-down-text {
        display: none
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .list .copy-info {
        font-size: 12px;
        color: hsla(0, 0%, 100%, .3)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list {
        -webkit-box-ordinal-group: 3;
        order: 2;
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat {
        position: relative
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat:not(:last-child) {
        margin-right: 14px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat .iconfont {
        font-size: 24px;
        color: hsla(0, 0%, 100%, .35)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat .iconfont:hover {
        color: hsla(0, 0%, 100%, .85)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat:hover .weichat-qrcode-box {
        visibility: visible;
        opacity: 1;
        bottom: 24px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat .weichat-qrcode-box {
        position: absolute;
        width: 108px;
        height: 108px;
        border-radius: 5px;
        z-index: 999;
        bottom: 34px;
        left: 50%;
        margin-left: -60px;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
        transition: all .3s cubic-bezier(.645, .045, .355, 1)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-left .icon-list .icon-some-chat .weichat-qrcode-box img {
        border-radius: 4px;
        width: 100%;
        height: 100%
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right {
        -webkit-box-ordinal-group: 2;
        order: 1;
        padding-top: 48px;
        margin-bottom: 48px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list {
        width: 25%
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .title-box {
        font-size: 20px;
        font-weight: 500;
        color: #fff;
        margin-bottom: 16px;
        cursor: pointer
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .title-box .user-arrow {
        display: none
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .item-box .list-item .link {
        font-size: 14px;
        color: hsla(0, 0%, 100%, .35);
        line-height: 16px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .item-box .list-item .link:hover {
        color: hsla(0, 0%, 100%, .85)
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .item-box .list-item:not(:last-child) {
        margin-bottom: 16px
    }

    body[data-responsive=true] .footer-container .footer-wrap .footer-link, body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .community-title, body[data-responsive=true] .footer-container .footer-wrap .footer-main .footer-right .footer-ul .list .icon-list {
        display: none
    }
}

@media (min-width: 768px) and (max-width: 1023px) and (min-width: 768px) {
    body[data-responsive=true] .footer-link, body[data-responsive=true] .footer-main {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    body[data-responsive=true] .footer-wrap .footer-main {
        padding-top: 80px;
        padding-bottom: 48px;
        display: -webkit-box;
        display: flex;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left {
        position: relative;
        width: 25%
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .icon-list {
        display: none
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .footer-logo {
        position: absolute;
        top: -5px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .footer-logo .img {
        height: 36px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .list {
        margin-top: 56px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .list .link {
        color: #fff;
        font-size: 12px;
        line-height: 25px;
        opacity: .43;
        cursor: pointer;
        display: inline-block
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .list .link:hover {
        color: hsla(0, 0%, 100%, .85);
        opacity: 1
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .list .copy-info, body[data-responsive=true] .footer-wrap .footer-main .footer-left .list .down-copy, body[data-responsive=true] .footer-wrap .footer-main .footer-left .list .icon-down-text {
        font-size: 14px;
        font-weight: 400;
        color: hsla(0, 0%, 100%, .35);
        line-height: 16px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .list .down-copy {
        margin-top: -13px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .list .copy-info {
        margin-top: 8px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .all-language-box {
        margin-top: 48px;
        display: inline-block
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .all-language-box .language {
        height: 44px;
        font-size: 14px;
        font-weight: 400
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .all-language-box .ul-box:first-child .list-ul {
        min-width: 146px;
        width: -webkit-fit-content;
        width: -moz-fit-content;
        width: fit-content
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .all-language-box .ul-box:last-child .list-ul {
        width: 132px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .all-language-box:hover .now-language .arrow-icon {
        -webkit-transform: rotate(-180deg);
        transform: rotate(-180deg)
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .all-language-box:hover .language-list {
        visibility: visible;
        opacity: 1;
        bottom: 51px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-left .all-language-box:hover .language-list .list-ul {
        overflow-y: auto
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right {
        width: 75%
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .user-arrow {
        display: none
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .footer-ul {
        display: -webkit-box;
        display: flex
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list {
        width: 25%;
        padding-right: 24px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list:last-child {
        padding-right: 0
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .title {
        font-size: 20px;
        font-weight: 500;
        color: hsla(0, 0%, 100%, .85);
        line-height: 24px;
        margin-bottom: 18px;
        display: inline-block;
        vertical-align: top
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .community-title {
        margin-bottom: 8px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .list-item {
        margin-bottom: 16px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .list-item:last-child {
        padding-right: 40px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .link {
        font-size: 14px;
        font-weight: 400;
        color: hsla(0, 0%, 100%, .35);
        line-height: 16px;
        cursor: pointer;
        display: inline-block
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .link:hover {
        color: hsla(0, 0%, 100%, .85);
        opacity: 1
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .link.click-disable {
        opacity: .5
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .link.click-disable:hover {
        color: hsla(0, 0%, 100%, .35);
        cursor: not-allowed
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .icon-list {
        width: 100%;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        display: block;
        word-wrap: break-word;
        word-break: break-word;
        line-height: 22px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .icon-some-chat {
        font-size: 22px;
        color: hsla(0, 0%, 100%, .25);
        margin-right: 17px;
        position: relative;
        cursor: pointer;
        display: inline-block
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .icon-some-chat:hover {
        color: hsla(0, 0%, 100%, .85);
        opacity: 1
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .icon-some-chat:hover .weichat-qrcode-box {
        visibility: visible;
        opacity: 1;
        bottom: 24px
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .icon-some-chat .weichat-qrcode-box {
        position: absolute;
        width: 120px;
        height: 120px;
        border-radius: 4px;
        z-index: 999;
        bottom: 34px;
        left: 50%;
        margin-left: -60px;
        opacity: 0;
        visibility: hidden;
        -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
        transition: all .3s cubic-bezier(.645, .045, .355, 1)
    }

    body[data-responsive=true] .footer-wrap .footer-main .footer-right .list .icon-some-chat .weichat-qrcode-box img {
        border-radius: 4px;
        width: 100%;
        height: 100%
    }

    body[data-responsive=true] .footer-wrap .footer-main .no_link {
        font-size: 12px;
        margin-bottom: 8px;
        font-weight: 400;
        color: hsla(0, 0%, 100%, .65);
        line-height: 18px
    }

    body[data-responsive=true] .footer-wrap .footer-link {
        margin: 0 auto;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    body[data-responsive=true] .footer-wrap .footer-link .link-line {
        font-size: 14px;
        font-weight: 400;
        color: #fff;
        line-height: 16px;
        padding: 24px 0 48px
    }

    body[data-responsive=true] .footer-wrap .footer-link .link-line .site-map, body[data-responsive=true] .footer-wrap .footer-link .link-line .title {
        margin-right: 16px;
        height: 18px;
        font-size: 12px;
        line-height: 1.5;
        text-align: left;
        color: hsla(0, 0%, 100%, .35);
        display: inline-block
    }

    body[data-responsive=true] .footer-wrap .footer-link .link-line .site-map:hover {
        color: hsla(0, 0%, 100%, .85);
        opacity: 1
    }

    body[data-responsive=true] .footer-wrap .footer-link .link-line .text {
        margin-right: 8px;
        height: 18px;
        font-size: 12px;
        line-height: 1.5;
        text-align: left;
        color: hsla(0, 0%, 100%, .35);
        display: inline-block
    }

    body[data-responsive=true] .footer-wrap .footer-link .link-line .text:hover {
        color: hsla(0, 0%, 100%, .85);
        opacity: 1
    }

    body[data-responsive=true] .footer-wrap .footer-line {
        height: 1px;
        width: 100%;
        border-top: 1px solid hsla(0, 0%, 100%, .1)
    }
}

@media (min-width: 1024px) and (min-width: 1024px) {
    body[data-responsive=true] .footer-link, body[data-responsive=true] .footer-main {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

body[data-responsive=true] #backTopBox {
    display: none !important
}

body[data-responsive=false] .footer-wrap .footer-main {
    padding-top: 80px;
    padding-bottom: 48px;
    display: -webkit-box;
    display: flex;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left {
    position: relative;
    width: 25%
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .icon-list {
    display: none
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .footer-logo {
    position: absolute;
    top: -5px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .footer-logo .img {
    height: 36px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .list {
    margin-top: 56px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .list .link {
    color: #fff;
    font-size: 12px;
    line-height: 25px;
    opacity: .43;
    cursor: pointer;
    display: inline-block
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .list .link:hover {
    color: hsla(0, 0%, 100%, .85);
    opacity: 1
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .list .copy-info, body[data-responsive=false] .footer-wrap .footer-main .footer-left .list .down-copy, body[data-responsive=false] .footer-wrap .footer-main .footer-left .list .icon-down-text {
    font-size: 14px;
    font-weight: 400;
    color: hsla(0, 0%, 100%, .35);
    line-height: 16px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .list .down-copy {
    margin-top: -13px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .list .copy-info {
    margin-top: 8px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .all-language-box {
    margin-top: 48px;
    display: inline-block
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .all-language-box .language {
    height: 44px;
    font-size: 14px;
    font-weight: 400
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .all-language-box .ul-box:first-child .list-ul {
    min-width: 146px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .all-language-box .ul-box:last-child .list-ul {
    width: 132px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .all-language-box:hover .now-language .arrow-icon {
    -webkit-transform: rotate(-180deg);
    transform: rotate(-180deg)
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .all-language-box:hover .language-list {
    visibility: visible;
    opacity: 1;
    bottom: 51px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-left .all-language-box:hover .language-list .list-ul {
    overflow-y: auto
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right {
    width: 75%
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .user-arrow {
    display: none
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .footer-ul {
    display: -webkit-box;
    display: flex
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list {
    width: 25%;
    padding-right: 24px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list:last-child {
    padding-right: 0
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .title {
    font-size: 20px;
    font-weight: 500;
    color: hsla(0, 0%, 100%, .85);
    line-height: 24px;
    margin-bottom: 18px;
    display: inline-block;
    vertical-align: top
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .community-title {
    margin-bottom: 8px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .list-item {
    margin-bottom: 16px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .list-item:last-child {
    padding-right: 40px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .link {
    font-size: 14px;
    font-weight: 400;
    color: hsla(0, 0%, 100%, .35);
    line-height: 16px;
    cursor: pointer;
    display: inline-block
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .link:hover {
    color: hsla(0, 0%, 100%, .85);
    opacity: 1
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .link.click-disable {
    opacity: .5
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .link.click-disable:hover {
    color: hsla(0, 0%, 100%, .35);
    cursor: not-allowed
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .icon-list {
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: block;
    word-wrap: break-word;
    word-break: break-word;
    line-height: 22px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .icon-some-chat {
    font-size: 22px;
    color: hsla(0, 0%, 100%, .25);
    margin-right: 17px;
    position: relative;
    cursor: pointer;
    display: inline-block
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .icon-some-chat:hover {
    color: hsla(0, 0%, 100%, .85);
    opacity: 1
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .icon-some-chat:hover .weichat-qrcode-box {
    visibility: visible;
    opacity: 1;
    bottom: 24px
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .icon-some-chat .weichat-qrcode-box {
    position: absolute;
    width: 120px;
    height: 120px;
    border-radius: 4px;
    z-index: 999;
    bottom: 34px;
    left: 50%;
    margin-left: -60px;
    opacity: 0;
    visibility: hidden;
    -webkit-transition: all .3s cubic-bezier(.645, .045, .355, 1);
    transition: all .3s cubic-bezier(.645, .045, .355, 1)
}

body[data-responsive=false] .footer-wrap .footer-main .footer-right .list .icon-some-chat .weichat-qrcode-box img {
    border-radius: 4px;
    width: 100%;
    height: 100%
}

body[data-responsive=false] .footer-wrap .footer-main .no_link {
    font-size: 12px;
    margin-bottom: 8px;
    font-weight: 400;
    color: hsla(0, 0%, 100%, .65);
    line-height: 18px
}

body[data-responsive=false] .footer-wrap .footer-link {
    margin: 0 auto;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

body[data-responsive=false] .footer-wrap .footer-link .link-line {
    font-size: 14px;
    font-weight: 400;
    color: #fff;
    line-height: 16px;
    padding: 24px 0 48px
}

body[data-responsive=false] .footer-wrap .footer-link .link-line .site-map, body[data-responsive=false] .footer-wrap .footer-link .link-line .title {
    margin-right: 16px;
    height: 18px;
    font-size: 12px;
    line-height: 1.5;
    text-align: left;
    color: hsla(0, 0%, 100%, .35);
    display: inline-block
}

body[data-responsive=false] .footer-wrap .footer-link .link-line .site-map:hover {
    color: hsla(0, 0%, 100%, .85);
    opacity: 1
}

body[data-responsive=false] .footer-wrap .footer-link .link-line .text {
    margin-right: 8px;
    height: 18px;
    font-size: 12px;
    line-height: 1.5;
    text-align: left;
    color: hsla(0, 0%, 100%, .35);
    display: inline-block
}

body[data-responsive=false] .footer-wrap .footer-link .link-line .text:hover {
    color: hsla(0, 0%, 100%, .85);
    opacity: 1
}

body[data-responsive=false] .footer-wrap .footer-line {
    height: 1px;
    width: 100%;
    border-top: 1px solid hsla(0, 0%, 100%, .1)
}

body[data-responsive=false] .footer-link, body[data-responsive=false] .footer-main {
    width: 1180px;
    margin: 0 auto;
    padding-left: 30px;
    padding-right: 30px
}

body[data-nav=false] .footer-container, body[data-nav=false] .header-container {
    display: none
}

body[data-nav=true] .footer-container, body[data-nav=true] .header-container {
    display: block
}

body .footer-container[data-hide=true] {
    display: none
}

body .footer-container[data-hide=false] {
    display: block
}

.home-main .buy-coin-box {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding-left: 8px;
    padding-right: 8px;
    min-height: 140px;
    -webkit-box-pack: justify;
    justify-content: space-between;
    margin-top: 40px;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    position: relative;
    z-index: 2
}

.home-main .buy-coin-box .ok-tip {
    position: relative
}

.home-main .buy-coin-box .ok-tip:active:after, .home-main .buy-coin-box .ok-tip:active:before, .home-main .buy-coin-box .ok-tip:hover:after, .home-main .buy-coin-box .ok-tip:hover:before {
    display: block
}

.home-main .buy-coin-box .ok-tip:before {
    content: attr(tooltip);
    display: none;
    position: absolute;
    z-index: 1100;
    line-height: 16px;
    text-align: justify;
    padding: 8px;
    width: 206px;
    color: #3f475a;
    font-size: 12px;
    border-radius: 2px;
    background-color: #fff;
    text-align: center;
    word-wrap: break-word;
    white-space: normal;
    word-break: break-all
}

.home-main .buy-coin-box .ok-tip:after {
    display: none;
    content: "";
    position: absolute;
    z-index: 1000;
    width: 0;
    height: 0
}

.home-main .buy-coin-box .ok-tip[position=bottom]:before {
    display: block;
    top: calc(100% + 4px);
    color: #e35e5e;
    width: unset;
    max-width: 210px;
    text-align: left;
    -webkit-animation: tip-bottom .28s ease-in;
    animation: tip-bottom .28s ease-in
}

.home-main .buy-coin-box .ok-tip[position=bottom]:after {
    top: 100%;
    left: 20px;
    display: block;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-bottom: 5px solid #fff;
    -webkit-animation: tip-bottom .3s ease-in;
    animation: tip-bottom .3s ease-in
}

@-webkit-keyframes tip-bottom {
    0% {
        opacity: .5;
        top: 150%
    }
}

@keyframes tip-bottom {
    0% {
        opacity: .5;
        top: 150%
    }
}

.home-main .buy-coin-box .ok-tip[position=top]:before {
    bottom: calc(100% + 10px);
    -webkit-animation: tip-top .28s ease-in;
    animation: tip-top .28s ease-in
}

.home-main .buy-coin-box .top-middle[position=top]:before {
    left: 50%;
    -webkit-transform: translate(-10%);
    transform: translate(-10%);
    -webkit-animation: tip-top .3s ease-in;
    animation: tip-top .3s ease-in
}

.home-main .buy-coin-box .ok-tip[position=top]:after {
    bottom: calc(100% + 6px);
    left: 50%;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    border-top: 5px solid #fff;
    -webkit-animation: tip-top .3s ease-in;
    animation: tip-top .3s ease-in
}

@-webkit-keyframes tip-top {
    0% {
        opacity: .5;
        bottom: 150%
    }
}

@keyframes tip-top {
    0% {
        opacity: .5;
        bottom: 150%
    }
}

@media (min-width: 768px) {
    .home-main .buy-coin-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .home-main .buy-coin-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .home-main .buy-coin-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.home-main .buy-coin-box .buy-coin-top {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    min-height: 30px
}

.home-main .buy-coin-box .buy-coin-top .buy-tab-box {
    margin-bottom: 6px;
    -webkit-box-align: center;
    align-items: center;
    display: -webkit-box;
    display: flex
}

.home-main .buy-coin-box .buy-coin-top .buy-tab-box .split-line {
    width: 1px;
    height: 14px;
    background-color: rgba(116, 134, 184, .35)
}

.home-main .buy-coin-box .buy-coin-top .buy-tab-box .buy-tab {
    font-weight: 500;
    color: #7486b8;
    line-height: 24px;
    font-size: 14px;
    margin-right: 10px;
    cursor: pointer
}

.home-main .buy-coin-box .buy-coin-top .buy-tab-box .buy-tab.current {
    color: #fff
}

.home-main .buy-coin-box .buy-coin-top .buy-tab-box .buy-tab:last-child {
    margin-left: 10px
}

.home-main .buy-coin-box .buy-coin-top .buy-tab-box[data-index="1"] .buy-tab:first-of-type, .home-main .buy-coin-box .buy-coin-top .buy-tab-box[data-index="2"] .buy-tab:nth-of-type(2) {
    color: #fff
}

.home-main .buy-coin-box .buy-coin-top .buy-tip {
    display: -webkit-box;
    display: flex;
    color: #29d674;
    -webkit-box-align: center;
    align-items: center;
    margin-bottom: 8px;
    font-weight: 500
}

.home-main .buy-coin-box .buy-coin-top .buy-tip i.icon {
    font-size: 20px;
    margin-right: 4px
}

.home-main .buy-coin-box .buy-input-wrap .buy-input-box {
    width: 312px;
    width: 100%;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    height: 48px;
    background-color: #fff;
    border-radius: 4px;
    padding-right: 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.home-main .buy-coin-box .buy-input-wrap .buy-input-box.buy-input-email .split-line {
    display: none
}

.home-main .buy-coin-box .buy-input-wrap .buy-input-box.buy-input-login {
    padding-right: 0
}

.home-main .buy-coin-box .buy-input-wrap .buy-input-box .split-line {
    width: 1px;
    height: 16px;
    background: #d8dce6
}

.home-main .buy-coin-box .buy-input-wrap .buy-input-box .buy-input {
    -webkit-box-flex: 1;
    flex: 1;
    padding-left: 12px;
    font-size: 16px;
    font-weight: 500;
    color: #35384a;
    min-width: 50px
}

.home-main .buy-coin-box .buy-input-wrap .buy-input-box .buy-input::-webkit-input-placeholder {
    color: #9aa1b1
}

.home-main .buy-coin-box .buy-input-wrap .buy-input-box .buy-input:-moz-placeholder, .home-main .buy-coin-box .buy-input-wrap .buy-input-box .buy-input::-moz-placeholder {
    color: #9aa1b1
}

.home-main .buy-coin-box .buy-input-wrap .buy-input-box .buy-input:-ms-input-placeholder {
    color: #9aa1b1
}

.home-main .buy-coin-box .buy-input-wrap .buy-coin-btn {
    margin-top: 12px;
    width: 100%;
    height: 48px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;

    cursor: pointer;
    -webkit-transition: all .25s;
    transition: all .25s;
    border-radius: 4px;

    background: #0e0e0e;
}

.home-main .buy-coin-box .buy-input-wrap .buy-coin-btn:disabled {
    color: #b3b3b3;
    background-color: #f3f3f3;
}


.home-main .buy-coin-box .buy-input-wrap .buy-coin-btn:hover {
    /*background-color: #1c4fd4*/
}

.home-main .buy-coin-box .present-tip {
    width: 100%;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: hsla(0, 0%, 100%, .7);
    margin-top: 12px;
    display: none;
    text-align: center
}

.home-main .buy-coin-box .present-tip .present-green {
    color: #29d674
}

@media (min-width: 768px) {
    .home-main .buy-coin-box {
        margin-top: 48px;
        min-height: 82px
    }

    .home-main .buy-coin-box .buy-coin-top, .home-main .buy-coin-box .buy-coin-top .buy-tip {
        display: none
    }

    .home-main .buy-coin-box .buy-input-wrap {
        display: -webkit-box;
        display: flex;
        flex-wrap: wrap;
        -webkit-box-pack: center;
        justify-content: center
    }

    .home-main .buy-coin-box .buy-input-wrap .buy-input-box {
        width: 312px;
        border-radius: 4px;
        display: -webkit-inline-box;
        display: inline-flex
    }

    .home-main .buy-coin-box .buy-input-wrap .buy-input-box .buy-input {
        padding-left: 12px
    }

    .home-main .buy-coin-box .buy-input-wrap .buy-coin-btn {
        margin-top: 0;
        min-width: 143px;
        border-radius: 4px;
        width: auto;
        padding: 0 8px;
        margin-left: 12px
    }

    .home-main .buy-coin-box .present-tip {
        display: block
    }
}

@media (min-width: 1024px) {
    .home-main .buy-coin-box .buy-input-wrap {
        -webkit-box-pack: center;
        justify-content: center
    }

    .home-main .buy-coin-box .buy-input-wrap .buy-coin-btn {
        margin-left: 12px
    }
}

@media (min-width: 1270px) {
    .home-main .buy-coin-box {
        width: 100%
    }

    .home-main .buy-coin-box .buy-input-wrap {
        -webkit-box-pack: center;
        justify-content: center
    }

    .home-main .buy-coin-box .buy-input-wrap .buy-input-box {
        height: 52px
    }

    .home-main .buy-coin-box .buy-input-wrap .buy-coin-btn {
        height: 52px;
        font-weight: 600;
        font-size: 16px;
        line-height: 20px
    }
}

.home-main .home-top {
    position: relative;
    overflow: hidden;
    background: #000;
}

.home-main .home-top .circle {
    /*position: absolute;*/
    /*background: radial-gradient(bottom center, ellipse, rgba(230, 228, 224, 0), rgba(95, 95, 173, .39));*/
    /*background: -webkit-radial-gradient(bottom center, ellipse, rgba(230, 228, 224, 0), rgba(95, 95, 173, .39));*/
    /*width: 638px;*/
    /*height: 541px;*/
    /*top: -373px;*/
    /*border-radius: 50%;*/
    /*left: -390px*/
}

.home-main .home-top .circle:before {
    /*background: radial-gradient(center, circle, rgba(92, 92, 214, .25), rgba(230, 228, 224, 0));*/
    /*background: -webkit-radial-gradient(center, circle, rgba(92, 92, 214, .25), rgba(230, 228, 224, 0));*/
    /*bottom: 100px;*/
    /*right: -283px*/
}

.home-main .home-top .circle-right, .home-main .home-top .circle:before {
    content: "";
    position: absolute;
    width: 482px;
    height: 482px;
    border-radius: 50%
}

.home-main .home-top .circle-right {
    background: radial-gradient(left center, ellipse, rgba(163, 163, 241, .17), rgba(0, 34, 154, .12));
    background: -webkit-radial-gradient(left center, ellipse, rgba(163, 163, 241, .17), rgba(0, 34, 154, .12));
    bottom: -400px;
    right: -310px
}

.home-main .home-top .home-banner-bg {
    padding: 95px 0 56px
}

.home-main .home-top .home-text-box {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding-left: 8px;
    padding-right: 8px;
    position: relative;
    -webkit-transition: all .3s ease;
    transition: all .3s ease;
    z-index: 1
}

@media (max-width: 767px) {
    .home-main .home-top .home-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

@media (min-width: 768px) {
    .home-main .home-top .home-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .home-main .home-top .home-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .home-main .home-top .home-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.home-main .home-top .home-text-box .home-title {
    font-size: 28px;
    font-weight: 600;
    color: #fff;
    line-height: 36px
}

.home-main .home-top .home-text-box .home-subtitle {
    margin-top: 8px;
    font-size: 14px;
    font-weight: 500;
    color: hsla(0, 0%, 100%, .7);
    line-height: 20px
}

.home-main .home-top .to-be-bg {
    -webkit-transform: scale(.93);
    transform: scale(.93);
    opacity: .1;
    z-index: 0
}

.home-main .home-top .to-be-bg-buy-box {
    z-index: 0;
    -webkit-transform: scale(.9) translateY(-10px) translateX(5px);
    transform: scale(.9) translateY(-10px) translateX(5px);
    opacity: .04
}

@media (min-width: 768px) {
    .home-main .home-top .home-banner-bg {
        padding-top: 110px
    }

    .home-main .home-top .home-text-box {
        text-align: center
    }

    .home-main .home-top .home-text-box .home-title {
        font-size: 40px;
        line-height: 52px
    }

    .home-main .home-top .home-text-box .home-subtitle {
        margin-top: 14px
    }
}

@media (min-width: 1024px) {
    .home-main .home-top .circle-right {
        bottom: -380px;
        right: -241px
    }

    .home-main .home-top .home-banner-bg {
        background-size: cover
    }

    .home-main .home-top .home-text-box {
        text-align: center
    }

    .home-main .home-top .home-text-box .home-title {
        max-width: 100%
    }

    .home-main .home-top .home-text-box .home-subtitle {
        max-width: 100%;
        line-height: 28px;
        margin-top: 12px
    }
}

@media (min-width: 1270px) {
    .home-main .home-top .home-banner-bg {
        padding-top: 90px
    }

    .home-main .home-top .home-text-box {
        text-align: center
    }

    .home-main .home-top .home-text-box .home-title {
        max-width: 100%;
        font-size: 42px;
        line-height: 52px
    }

    .home-main .home-top .home-text-box .home-subtitle {
        max-width: auto;
        font-size: 18px;
        color: hsla(0, 0%, 100%, .6)
    }
}

.home-main .guide-exchange {
    width: 100%;
    background-color: #fff;
    padding: 64px 0
}

.home-main .guide-exchange .guide-container {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding-left: 8px;
    padding-right: 8px
}

@media (min-width: 768px) {
    .home-main .guide-exchange .guide-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .home-main .guide-exchange .guide-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .home-main .guide-exchange .guide-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 767px) {
    .home-main .guide-exchange .guide-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

.home-main .guide-exchange .guide-container .guide-title {
    max-width: 480px;
    padding: 0 16px;
    margin: 0 auto;
    line-height: 30px;
    text-align: center;
    font-size: 26px;
    font-weight: 600;
    color: #1f2533;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center
}

@media (min-width: 1270px) {
    .home-main .guide-exchange .guide-container .guide-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 66.66666667%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.home-main .guide-exchange .guide-container .guide-subtitle {
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #3f475a;
    margin-top: 15px
}

.home-main .guide-exchange .guide-container .guide-box {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    border-bottom: 1px solid #edf0f7;
    padding-bottom: 100px
}

.home-main .guide-exchange .guide-container .guide-box .guide-item {
    margin: 0 auto;
    padding-top: 36px;
    max-width: 290px;
    text-align: center
}

.home-main .guide-exchange .guide-container .guide-box .guide-item .icon {
    margin-bottom: 8px;
    text-align: center;
    display: inline-block;
    width: 60px;
    height: 60px
}

.home-main .guide-exchange .guide-container .guide-box .guide-item .desc {
    font-weight: 500;
    font-size: 48px;
    line-height: 58px;
    color: #205fec
}

.home-main .guide-exchange .guide-container .guide-box .guide-item .item-title {
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #1f2533
}

@media (max-width: 767px) {
    .home-main .guide-exchange {
        padding: 30px 0
    }

    .home-main .guide-exchange .guide-container .guide-title {
        max-width: unset;
        font-size: 24px;
        line-height: 29px;
        text-align: left
    }

    .home-main .guide-exchange .guide-container .guide-subtitle {
        display: none
    }

    .home-main .guide-exchange .guide-container .guide-box {
        margin-top: 36px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        -webkit-box-pack: center;
        justify-content: center;
        flex-wrap: wrap;
        padding-bottom: 48px
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item {
        margin: unset;
        max-width: unset;
        width: 50%;
        padding: 0 16px;
        margin-bottom: 30px;
        text-align: left
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item .desc {
        font-size: 32px;
        line-height: 38px
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item .item-title {
        font-size: 12px;
        line-height: 16px
    }
}

@media (max-width: 767px) and (max-width: 767px) {
    .home-main .guide-exchange .guide-container .guide-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

@media (min-width: 768px) {
    .home-main .guide-exchange {
        padding: 52px 0
    }

    .home-main .guide-exchange .guide-container .guide-title {
        max-width: unset;
        font-size: 28px;
        line-height: 32px
    }

    .home-main .guide-exchange .guide-container .guide-subtitle {
        margin: 15px auto 0
    }

    .home-main .guide-exchange .guide-container .guide-box {
        margin-top: 36px;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        -webkit-box-pack: center;
        justify-content: center
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item {
        margin: unset;
        max-width: unset;
        width: 25%;
        padding: 0 16px;
        margin-bottom: 0
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item .desc {
        font-size: 32px;
        line-height: 38px
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item .item-title {
        font-size: 12px;
        line-height: 14px
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item + .guide-item {
        margin-left: 21px
    }
}

@media (min-width: 768px) and (min-width: 768px) {
    .home-main .guide-exchange .guide-container .guide-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 768px) {
    .home-main .guide-exchange .guide-container .guide-subtitle {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1024px) {
    .home-main .guide-exchange .guide-container .guide-subtitle {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1270px) {
    .home-main .guide-exchange .guide-container .guide-subtitle {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .home-main .guide-exchange .guide-container .guide-box .guide-item {
        padding: 0 12px;
        margin-bottom: 0
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item .desc {
        font-size: 40px;
        line-height: 48px
    }
}

@media (min-width: 1024px) and (min-width: 1024px) {
    .home-main .guide-exchange .guide-container .guide-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1024px) {
    .home-main .guide-exchange .guide-container .guide-subtitle {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .home-main .guide-exchange .guide-container .guide-title {
        font-size: 38px;
        line-height: 46px
    }

    .home-main .guide-exchange .guide-container .guide-subtitle {
        margin: 16px auto 0
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item {
        padding: 0 24px;
        margin-bottom: 0
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item .desc {
        font-size: 48px;
        line-height: 58px
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item .desc .subtitle {
        font-size: 40px
    }

    .home-main .guide-exchange .guide-container .guide-box .guide-item .item-title {
        font-size: 14px;
        line-height: 17px
    }
}

@media (min-width: 1270px) and (min-width: 768px) {
    .home-main .guide-exchange .guide-container .guide-subtitle {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) and (min-width: 1024px) {
    .home-main .guide-exchange .guide-container .guide-subtitle {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) and (min-width: 1270px) {
    .home-main .guide-exchange .guide-container .guide-subtitle {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.home-main .trade {
    width: 100%;
    background-color: #fff
}

.home-main .trade .trade-container {
    position: relative;
    padding: 36px 0 64px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column
}

.home-main .trade .trade-container .show-transcript {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: end;
    justify-content: flex-end;
    margin-top: 12px
}

@media (max-width: 767px) {
    .home-main .trade .trade-container .show-transcript {
        max-width: 596px;
        position: absolute;
        left: 50%;
        bottom: -20px;
        -webkit-transform: translate(-50%);
        transform: translate(-50%)
    }
}

@media (max-width: 767px) and (max-width: 767px) {
    .home-main .trade .trade-container .show-transcript {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

@media (min-width: 768px) {
    .home-main .trade .trade-container .show-transcript {
        max-width: 596px;
        position: absolute;
        left: 50%;
        bottom: -20px;
        -webkit-transform: translate(-50%);
        transform: translate(-50%);
        padding: 0 !important
    }
}

@media (min-width: 768px) and (min-width: 768px) {
    .home-main .trade .trade-container .show-transcript {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .home-main .trade .trade-container .show-transcript {
        position: static;
        max-width: inherit;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px;
        -webkit-transform: translate(0);
        transform: translate(0)
    }
}

@media (min-width: 1024px) and (min-width: 768px) {
    .home-main .trade .trade-container .show-transcript {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1024px) {
    .home-main .trade .trade-container .show-transcript {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1270px) {
    .home-main .trade .trade-container .show-transcript {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.home-main .trade .trade-container .show-transcript .show-btn {
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #9aa1b1;
    cursor: pointer
}

.home-main .trade .trade-container .trade-box-main {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between
}

.home-main .trade .trade-container .tab-title {
    font-size: 26px;
    line-height: 32px;
    font-weight: 600;
    color: #1f2533;
    margin-bottom: 40px
}

.home-main .trade .trade-container .trade-tab-box {
    width: 420px
}

@media (max-width: 767px) {
    .home-main .trade .trade-container .trade-tab-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab {
    max-width: 596px;
    text-align: center;
    margin: 0 auto
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav {
    margin-top: 12px;
    -webkit-box-pack: center;
    justify-content: center;
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item {
    font-size: 14px;
    font-weight: 500;
    color: rgba(51, 58, 77, .8);
    background-color: #f7f9fc;
    line-height: 20px;
    text-align: center;
    height: 64px;
    overflow: hidden;
    margin-bottom: 12px;
    -webkit-transition: all .3s;
    transition: all .3s
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item .first-stage {
    background-color: #f7f9fc;
    height: 64px;
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    align-items: center;
    cursor: pointer
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item .first-stage .icon-info-title {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item .first-stage .icon-info-title .icon {
    font-size: 24px;
    padding: 0 10px 0 12px;
    color: #1f2533
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item .first-stage .icon-info-title .name {
    color: #1f2533
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item .first-stage .arrow {
    font-size: 24px;
    color: #d8dce6;
    margin-right: 15px;
    -webkit-transition: all .3s;
    transition: all .3s
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item .first-stage .arrow-up {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item-active {
    -webkit-transition: all .5s;
    transition: all .5s;
    height: 240px
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item-space {
    -webkit-box-flex: 1;
    flex-grow: 1;
    width: 10px;
    max-width: 32px
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item-space:last-child {
    display: none
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav {
    margin-top: 16px
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item {
    text-align: center;
    background-color: #f7f9fc;
    padding-left: 46px;
    padding-right: 24px
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .desc {
    font-size: 14px;
    font-weight: 400;
    color: #35384a;
    line-height: 20px;
    text-align: left
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .desc .links {
    color: #2d60e0;
    font-weight: 500
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap {
    padding-top: 20px;
    padding-bottom: 20px
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: start;
    justify-content: flex-start;
    flex-wrap: wrap
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-title {
    display: none;
    font-size: 14px;
    font-weight: 400;
    color: #5c6171;
    line-height: 20px;
    padding-bottom: 15px
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-intro .tab-content-icon {
    display: none
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-intro .tab-content-text {
    display: inline-block;
    font-size: 14px;
    font-weight: 500;
    text-align: left;
    color: #2d60e0;
    line-height: 16px;
    padding-right: 12px;
    padding-bottom: 12px
}

.home-main .trade .trade-container .trade-tab-box .trade-line-tab[data-active="1"] .tab-nav .tab-content-item:first-of-type, .home-main .trade .trade-container .trade-tab-box .trade-line-tab[data-active="2"] .tab-nav .tab-content-item:nth-of-type(2), .home-main .trade .trade-container .trade-tab-box .trade-line-tab[data-active="3"] .tab-nav .tab-content-item:nth-of-type(3), .home-main .trade .trade-container .trade-tab-box .trade-line-tab[data-active="4"] .tab-nav .tab-content-item:nth-of-type(4), .home-main .trade .trade-container .trade-tab-box .trade-line-tab[data-active="5"] .tab-nav .tab-content-item:nth-of-type(5), .home-main .trade .trade-container .trade-tab-box .trade-line-tab[data-active="6"] .tab-nav .tab-content-item:nth-of-type(6) {
    display: block
}

.home-main .trade .trade-container .trade-img-box {
    margin-top: 36px
}

@media (max-width: 767px) {
    .home-main .trade .trade-container .trade-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

.home-main .trade .trade-container .trade-img-box .trade-img, .home-main .trade .trade-container .trade-img-box .trade-img-video {
    display: block;
    margin: 0 auto;
    width: 100%;
    height: 100%
}

.home-main .trade .trade-container .trade-img-box .trade-img {
    opacity: 0;
    -webkit-transition: opacity .2s ease-in-out;
    transition: opacity .2s ease-in-out
}

.home-main .trade .trade-container .trade-img-box .trade-img-show {
    opacity: 1
}

.home-main .trade .trade-container .trade-img-box .trade-img-video {
    border-radius: 4px;
    cursor: pointer
}

.home-main .trade .trade-container .trade-img-box .trade-img-wrap {
    cursor: pointer
}

@media (max-width: 767px) {
    .home-main .trade .trade-container .tab-title {
        max-width: 596px;
        font-size: 24px;
        line-height: 29px;
        margin: 0 auto 20px
    }

    .home-main .trade .trade-container .trade-box-main {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        position: relative
    }

    .home-main .trade .trade-container .trade-tab-box {
        -webkit-box-ordinal-group: 3;
        order: 2
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav {
        margin-top: 12px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item {
        font-size: 16px;
        height: 48px;
        margin-bottom: 8px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item .first-stage {
        height: 48px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item-space {
        max-width: unset;
        width: 32px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav {
        margin-left: auto;
        margin-right: auto
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .desc {
        max-width: unset;
        text-align: left
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap {
        display: -webkit-box;
        display: flex
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-block {
        display: block;
        -webkit-box-flex: 1;
        flex: 1
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-intro {
        padding-right: 20px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-intro .tab-content-url {
        display: -webkit-box;
        display: flex
    }

    .home-main .trade .trade-container .trade-img-box {
        margin-top: 0
    }

    .home-main .trade .trade-container .trade-img-box .trade-img, .home-main .trade .trade-container .trade-img-box .trade-img-video {
        max-width: 596px;
        max-height: 336px
    }
}

@media (max-width: 767px) and (max-width: 767px) {
    .home-main .trade .trade-container .tab-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

@media (min-width: 768px) {
    .home-main .trade .trade-container .tab-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px;
        font-size: 32px;
        line-height: 40px;
        text-align: center;
        margin-bottom: 0
    }

    .home-main .trade .trade-container .trade-box-main {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        -webkit-box-align: center;
        align-items: center;
        position: relative
    }

    .home-main .trade .trade-container .trade-tab-box {
        -webkit-box-ordinal-group: 3;
        order: 2
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav {
        margin-top: 20px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item {
        font-size: 16px;
        height: 50px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item .first-stage {
        height: 50px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item-space {
        max-width: unset;
        width: 32px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav {
        margin-left: auto;
        margin-right: auto
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap {
        display: -webkit-box;
        display: flex
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-block {
        display: block;
        -webkit-box-flex: 1;
        flex: 1
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-intro {
        padding-right: 50px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-intro .tab-content-url {
        display: -webkit-box;
        display: flex
    }

    .home-main .trade .trade-container .trade-img-box {
        margin-top: 48px
    }

    .home-main .trade .trade-container .trade-img-box .trade-img, .home-main .trade .trade-container .trade-img-box .trade-img-video {
        max-width: 596px;
        max-height: 336px
    }
}

@media (min-width: 768px) and (min-width: 768px) {
    .home-main .trade .trade-container .tab-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1024px) {
    .home-main .trade .trade-container .tab-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1270px) {
    .home-main .trade .trade-container .tab-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 768px) {
    .home-main .trade .trade-container .trade-tab-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1024px) {
    .home-main .trade .trade-container .trade-tab-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1270px) {
    .home-main .trade .trade-container .trade-tab-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 768px) {
    .home-main .trade .trade-container .trade-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1024px) {
    .home-main .trade .trade-container .trade-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1270px) {
    .home-main .trade .trade-container .trade-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .home-main .trade {
        overflow: hidden
    }

    .home-main .trade .trade-container {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column;
        padding: 48px 0 130px
    }

    .home-main .trade .trade-container .tab-title {
        -webkit-box-pack: start;
        justify-content: flex-start;
        text-align: left;
        margin-bottom: 40px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }

    .home-main .trade .trade-container .trade-box-main {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        -webkit-box-align: start;
        align-items: flex-start
    }

    .home-main .trade .trade-container .trade-tab-box {
        width: 352px !important;
        -webkit-box-ordinal-group: 1;
        order: 0
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab {
        margin: unset;
        text-align: left
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav {
        margin-top: 0
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item {
        font-size: 14px;
        height: 50px;
        margin-bottom: 13px;
        border-radius: 4px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item .first-stage {
        height: 50px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item {
        text-align: left
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap {
        display: -webkit-box;
        display: flex;
        padding-top: 24px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail {
        -webkit-box-pack: initial;
        justify-content: normal
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-title {
        display: block
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-intro {
        padding-bottom: 12px;
        padding-left: 50px;
        padding-right: 0
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-intro:first-child {
        padding-left: 0
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-intro .tab-content-url {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-intro .tab-content-url .tab-content-icon {
        display: inline-block
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-detail .tab-content-intro .tab-content-url .tab-content-text {
        padding: 0;
        font-size: 14px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-block {
        display: block;
        -webkit-box-flex: 1;
        flex: 1
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-content-item .tab-content-wrap .tab-content-block .tab-content-intro {
        padding-left: 0
    }

    .home-main .trade .trade-container .trade-img-box {
        margin-top: 0
    }

    .home-main .trade .trade-container .trade-img-box .trade-img-video, .home-main .trade .trade-container .trade-img-box .trade-img-wrap {
        display: block;
        max-width: 536px;
        max-height: 302px
    }

    .home-main .trade .trade-container .trade-img-box .trade-img {
        max-width: 536px;
        max-height: 302px
    }
}

@media (min-width: 1024px) and (min-width: 768px) {
    .home-main .trade .trade-container .tab-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1024px) {
    .home-main .trade .trade-container .tab-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1270px) {
    .home-main .trade .trade-container .tab-title {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 768px) {
    .home-main .trade .trade-container .trade-tab-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1024px) {
    .home-main .trade .trade-container .trade-tab-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1270px) {
    .home-main .trade .trade-container .trade-tab-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 768px) {
    .home-main .trade .trade-container .trade-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 58.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1024px) {
    .home-main .trade .trade-container .trade-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 58.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1270px) {
    .home-main .trade .trade-container .trade-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 58.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .home-main .trade .trade-container {
        padding: 48px 0 130px
    }

    .home-main .trade .trade-container .tab-title {
        font-weight: 600;
        font-size: 38px;
        line-height: 46px;
        color: #1f2533;
        margin-bottom: 40px;
        text-align: left;
        padding-left: 0
    }

    .home-main .trade .trade-container .trade-tab-box {
        padding-left: 0;
        width: 420px;
        -webkit-box-ordinal-group: 1;
        order: 0
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab {
        text-align: left;
        max-width: unset
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav {
        margin-top: 0
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item {
        font-size: 16px;
        height: 64px;
        margin-bottom: 12px;
        border-radius: 4px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item .first-stage {
        height: 64px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-content {
        margin: 16px 0 0
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-content .tab-content-item {
        text-align: left
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-content .tab-content-item .more-link {
        margin-top: 20px
    }

    .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-content .tab-content-item .tab-content-block .tab-content-intro {
        padding-bottom: 12px
    }

    .home-main .trade .trade-container .trade-img-box {
        max-width: unset;
        margin: 0;
        width: 728px;
        height: 396px
    }

    .home-main .trade .trade-container .trade-img-box .trade-img-wrap {
        margin-left: 50px
    }

    .home-main .trade .trade-container .trade-img-box .trade-img, .home-main .trade .trade-container .trade-img-box .trade-img-video, .home-main .trade .trade-container .trade-img-box .trade-img-wrap {
        max-width: 654px;
        max-height: 380px
    }
}

.simulated .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-content .tab-content-item .tab-content-detail:first-child .tab-content-intro:nth-of-type(3), .simulated .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item-space:first-of-type, .simulated .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item-space:nth-of-type(3), .simulated .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item:first-of-type, .simulated .home-main .trade .trade-container .trade-tab-box .trade-line-tab .tab-nav .tab-nav-item:nth-of-type(3) {
    display: none
}

.know-okex {
    -webkit-transition: all .5s;
    transition: all .5s
}

.know-okex .pop-bg {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(14, 18, 27, .41);
    z-index: 10010
}

.know-okex .pop-container {
    background-color: #fff;
    border-radius: 4px;
    max-width: 600px;
    height: auto;
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.know-okex .pop-container .top-title {
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    padding: 10px 24px;
    border-bottom: 1px solid #edf0f7;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between
}

.know-okex .pop-container .top-title .close {
    color: #60687b;
    font-size: 26px;
    cursor: pointer;
    padding: 10px 0
}

.know-okex .pop-container .info-main {
    max-height: 400px;
    overflow-y: scroll;
    padding: 24px
}

.know-okex .pop-container .info-main p {
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #3f475a;
    margin-bottom: 8px
}

.know-okex .pop-container .info-main h6 {
    font-size: 14px;
    line-height: 20px;
    margin-bottom: 12px
}

.know-okex .pop-container .info-main div {
    font-size: 12px;
    line-height: 16px;
    color: #9aa1b1;
    margin-bottom: 8px;
    padding-left: 24px
}

.know-okex .pop-container .info-main ul li {
    padding-left: 24px
}

.know-okex .pop-container .info-main ul div {
    padding-left: 0
}

.know-okex .pop-container .info-main a {
    color: #2d60e0;
    font-weight: 500
}

.closed {
    visibility: hidden
}

@media (max-width: 767px) {
    .know-okex .pop-container {
        border-radius: 4px 4px 0 0;
        width: 100%;
        height: calc(100% - 32px);
        top: auto;
        left: 0;
        bottom: 0;
        -webkit-transform: translate(0);
        transform: translate(0);
        max-width: inherit
    }

    .know-okex .pop-container .top-title {
        font-weight: 500;
        font-size: 18px;
        line-height: 24px;
        padding: 16px 24px;
        border-bottom: 1px solid #edf0f7;
        text-align: center;
        -webkit-box-pack: end;
        justify-content: flex-end
    }

    .know-okex .pop-container .top-title .title {
        text-align: center;
        width: calc(100% - 45px)
    }

    .know-okex .pop-container .info-main {
        min-height: 400px;
        overflow-y: scroll;
        max-width: inherit;
        max-height: calc(100vh - 100px)
    }
}

.home-main .tutorials {
    margin-bottom: 130px
}

.home-main .tutorials-container {
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
    user-select: none
}

.home-main .tutorials-container .title {
    font-weight: 600;
    font-size: 38px;
    line-height: 46px;
    margin-bottom: 40px
}

.home-main .tutorials-container .tabs {
    margin-bottom: 24px
}

.home-main .tutorials-container .tabs .btn {
    font-weight: 600;
    font-size: 18px;
    line-height: 22px;
    margin-right: 32px;
    color: #9aa1b1;
    cursor: pointer
}

.home-main .tutorials-container .tabs .btn-ac {
    color: #1f2533
}

.home-main .tutorials-container .tutorials-main .tutorials-main-box {
    display: -webkit-box;
    display: flex
}

.home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial {
    margin-right: 16px;
    display: -webkit-box;
    display: flex;
    border-radius: 4px
}

.home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .link {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    position: relative
}

.home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .tutorials-main-img {
    width: 392px;
    height: 196px;
    border-radius: 4px;
    background-color: #f0f1f3;
    -webkit-transition: all .3s;
    transition: all .3s;
    position: relative;
    z-index: 1
}

.home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .tutorials-main-img:hover {
    -webkit-box-shadow: 0 8px 11px -3px rgba(79, 86, 105, .08);
    box-shadow: 0 8px 11px -3px rgba(79, 86, 105, .08);
    -webkit-transform: scale(1.02);
    transform: scale(1.02)
}

.home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .des {
    font-weight: 500;
    font-size: 18px;
    line-height: 22px;
    margin-top: 8px;
    color: #3f475a;
    text-align: left
}

.home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .des:before {
    position: absolute;
    content: "";
    width: 392px;
    height: 196px;
    border-radius: 4px;
    top: 0;
    left: 0;
    background-color: #edf0f7;
    z-index: 0
}

.home-main .tutorials-container .tutorials-main-box::-webkit-scrollbar, .home-main .tutorials-container .tutorials-main::-webkit-scrollbar {
    width: 0;
    background: transparent;
    display: none
}

.home-main .tutorials-container .tutorials-main-box::-webkit-scrollbar-thumb, .home-main .tutorials-container .tutorials-main::-webkit-scrollbar-thumb {
    background: transparent;
    display: none
}

@media (max-width: 767px) {
    .home-main .tutorials {
        margin-bottom: 64px
    }

    .home-main .tutorials .okg-container {
        padding-left: 0;
        padding-right: 0
    }

    .home-main .tutorials-container .title {
        font-size: 24px;
        line-height: 29px;
        padding: 0 16px;
        margin-bottom: 0
    }

    .home-main .tutorials-container .tabs {
        margin-bottom: 24px;
        text-align: left
    }

    .home-main .tutorials-container .tabs .tabs-box {
        overflow-x: scroll;
        display: -webkit-box;
        display: flex;
        padding: 0 16px
    }

    .home-main .tutorials-container .tabs .btn {
        min-width: 130px;
        font-size: 14px;
        line-height: 22px;
        margin-right: 20px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box {
        min-height: 170px;
        overflow-x: auto;
        overflow-y: hidden;
        padding: 0 16px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial {
        display: -webkit-box;
        display: flex
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .link {
        width: 254px;
        min-height: 127px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .tutorials-main-img {
        width: 254px;
        height: 127px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .des {
        width: 254px;
        font-size: 14px;
        line-height: 17px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .des:before {
        position: absolute;
        content: "";
        width: 254px;
        height: 127px;
        border-radius: 4px;
        top: 0;
        left: 0;
        background-color: #edf0f7;
        z-index: 0
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial:last-child {
        padding-right: 16px
    }
}

@media (min-width: 768px) {
    .home-main .tutorials-container .title {
        font-size: 32px;
        line-height: 38px;
        text-align: center
    }

    .home-main .tutorials-container .tabs {
        text-align: center
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box {
        min-height: 150px;
        -webkit-box-pack: center;
        justify-content: center
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial {
        margin-right: 24px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .tutorials-main-img {
        width: 224px;
        height: 112px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .des {
        font-size: 14px;
        line-height: 17px;
        width: 224px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .des:before {
        position: absolute;
        content: "";
        width: 224px;
        height: 112px;
        border-radius: 4px;
        top: 0;
        left: 0;
        background-color: #edf0f7;
        z-index: 0
    }
}

@media (min-width: 1024px) {
    .home-main .tutorials-container .tabs, .home-main .tutorials-container .title {
        text-align: left
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box {
        min-height: 190px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .tutorials-main-img {
        width: 296px;
        height: 148px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .des {
        width: 296px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .des:before {
        position: absolute;
        content: "";
        width: 296px;
        height: 148px;
        border-radius: 4px;
        top: 0;
        left: 0;
        background-color: #edf0f7;
        z-index: 0
    }
}

@media (min-width: 1270px) {
    .home-main .tutorials-container .tutorials-main .tutorials-main-box {
        min-height: 225px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .tutorials-main-img {
        width: 392px;
        height: 196px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .des {
        width: 392px;
        font-size: 18px;
        line-height: 24px
    }

    .home-main .tutorials-container .tutorials-main .tutorials-main-box .tutorials-main-tutorial .des:before {
        position: absolute;
        content: "";
        width: 392px;
        height: 196px;
        border-radius: 4px;
        top: 0;
        left: 0;
        background-color: #edf0f7;
        z-index: 0
    }
}

img[src=""] {
    opacity: 0;
    visibility: hidden
}

.home-main .guide-registration {
    background-color: #f7f9fc;
    margin-bottom: 120px
}

.home-main .guide-registration .guide-registration-container {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: center;
    align-items: center
}

.home-main .guide-registration .guide-registration-container .title {
    font-weight: 500;
    font-size: 20px;
    line-height: 24px;
    margin-top: 64px;
    margin-bottom: 10px;
    color: #3f475a
}

.home-main .guide-registration .guide-registration-container .get-started-with {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    margin-bottom: 32px
}

.home-main .guide-registration .guide-registration-container .start-money {
    color: #205fec;
    font-weight: 600;
    font-size: 40px;
    line-height: 48px
}

.home-main .guide-registration .guide-registration-container .start-with {
    font-weight: 600;
    font-size: 40px;
    line-height: 48px;
    text-align: center
}

.home-main .guide-registration .guide-registration-container .have-account {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    align-items: center;
    margin-bottom: 52px
}

.home-main .guide-registration .guide-registration-container .have-account .des {
    font-weight: 500;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
    color: #9aa1b1
}

.home-main .guide-registration .guide-registration-container .have-account .sign-in {
    color: #1f2533;
    text-decoration: underline;
    margin-left: 8px
}

.home-main .guide-registration .guide-registration-container .registration-box {
    display: -webkit-box;
    display: flex;
    flex-wrap: wrap;
    -webkit-box-pack: start;
    justify-content: flex-start;
    margin-bottom: 16px
}

.home-main .guide-registration .guide-registration-container .registration-box .input-box {
    width: 312px;
    border-radius: 2px 0 0 2px;
    display: -webkit-inline-box;
    display: inline-flex;
    height: 48px;
    border: 1px solid #edf0f7;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-radius: 4px;
    font-size: 16px;
    background-color: #fff;
    padding-left: 16px;
    -webkit-box-align: center;
    align-items: center
}

.home-main .guide-registration .guide-registration-container .registration-box .registrationInput {
    width: 100%;
    -webkit-box-flex: 1;
    flex: 1;
    font-size: 16px
}

.home-main .guide-registration .guide-registration-container .registration-box .registrationInput::-webkit-input-placeholder {
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #9aa1b1
}

.home-main .guide-registration .guide-registration-container .registration-box .registrationInput::-moz-placeholder {
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #9aa1b1
}

.home-main .guide-registration .guide-registration-container .registration-box .registrationInput::-ms-input-placeholder {
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #9aa1b1
}

.home-main .guide-registration .guide-registration-container .registration-box .registrationInput::placeholder {
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #9aa1b1
}

.home-main .guide-registration .guide-registration-container .registration-box .btn {
    min-width: 143px;
    margin-left: 12px;
    border-radius: 4px;
    width: auto;
    padding: 12px 24px;
    background: #2d6cfa;
    height: 47px;
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    -webkit-transition: all .25s;
    transition: all .25s;
    cursor: pointer
}

.home-main .guide-registration .guide-registration-container .registration-box .btn:hover {
    background-color: #2651be
}

@media (max-width: 767px) {
    .home-main .guide-registration {
        background-color: #f7f9fc;
        margin-bottom: 80px
    }

    .home-main .guide-registration .guide-registration-container .title {
        font-weight: 400;
        font-size: 14px;
        line-height: 20px
    }

    .home-main .guide-registration .guide-registration-container .registration-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        flex-direction: column
    }

    .home-main .guide-registration .guide-registration-container .registration-box .input-box {
        width: auto
    }

    .home-main .guide-registration .guide-registration-container .registration-box .btn {
        margin-left: 0;
        margin-top: 12px;
        font-weight: 600;
        font-size: 16px;
        line-height: 20px
    }

    .home-main .guide-registration .guide-registration-container .start-with {
        font-size: 24px;
        line-height: 28px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }

    .home-main .guide-registration .guide-registration-container .start-money {
        font-size: 24px;
        line-height: 28px
    }
}

@media (max-width: 767px) and (min-width: 768px) {
    .home-main .guide-registration .guide-registration-container .registration-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 767px) and (min-width: 1024px) {
    .home-main .guide-registration .guide-registration-container .registration-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 767px) and (min-width: 1270px) {
    .home-main .guide-registration .guide-registration-container .registration-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 767px) and (min-width: 768px) {
    .home-main .guide-registration .guide-registration-container .start-with {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 767px) and (min-width: 1024px) {
    .home-main .guide-registration .guide-registration-container .start-with {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 767px) and (min-width: 1270px) {
    .home-main .guide-registration .guide-registration-container .start-with {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.home-main .no-dis {
    display: none !important
}

.home-main .ann-faq {
    margin-top: 40px;
    margin-bottom: 100px
}

.home-main .ann-faq .ann-faq-container {
    margin: 0 auto
}

@media (min-width: 1270px) {
    .home-main .ann-faq .ann-faq-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 66.66666667%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .home-main .ann-faq .ann-faq-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) {
    .home-main .ann-faq .ann-faq-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 767px) {
    .home-main .ann-faq .ann-faq-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

.home-main .ann-faq .ann-faq-container .tabs {
    display: -webkit-box;
    display: flex;
    cursor: pointer;
    border-bottom: 1px solid #edf0f7;
    -webkit-box-pack: center;
    justify-content: center
}

.home-main .ann-faq .ann-faq-container .tabs .btn {
    font-weight: 600;
    font-size: 24px;
    line-height: 44px;
    margin-right: 30px;
    color: #9aa1b1;
    cursor: pointer;
    padding: 12px 0
}

.home-main .ann-faq .ann-faq-container .tabs .no-margin {
    margin-right: 0
}

.home-main .ann-faq .ann-faq-container .tabs .active {
    color: #1f2533
}

.home-main .ann-faq .ann-faq-container .faq {
    display: none
}

.home-main .ann-faq .ann-faq-container .faq .item {
    border-bottom: 1px solid #edf0f7;
    height: 91px;
    overflow: hidden;
    -webkit-transition: all .3s;
    transition: all .3s
}

.home-main .ann-faq .ann-faq-container .faq .question {
    height: 91px;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    justify-content: space-between;
    cursor: pointer
}

.home-main .ann-faq .ann-faq-container .faq .question .title {
    padding: 33px 0;
    width: 100%;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    color: #3f475a
}

.home-main .ann-faq .ann-faq-container .faq .question .arrow {
    font-size: 24px;
    color: #9aa1b1;
    -webkit-transition: all .3s;
    transition: all .3s
}

.home-main .ann-faq .ann-faq-container .faq .question .arrow-up {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.home-main .ann-faq .ann-faq-container .faq .faq-link {
    color: #2d60e0;
    font-weight: 500
}

.home-main .ann-faq .ann-faq-container .faq .answer {
    font-weight: 400;
    font-size: 14px;
    line-height: 20px;
    color: #60687b
}

.home-main .ann-faq .ann-faq-container .faq .answer-list {
    padding-bottom: 33px
}

.home-main .ann-faq .ann-faq-container .faq .answer-list.active {
    display: block
}

.home-main .ann-faq .ann-faq-container .faq .des {
    margin-bottom: 20px
}

.home-main .ann-faq .ann-faq-container .faq .a-link {
    margin-bottom: 5px
}

.home-main .ann-faq .ann-faq-container .ann {
    display: block
}

.home-main .ann-faq .ann-faq-container .ann .ann-main .ann-list {
    border-bottom: 1px solid #edf0f7
}

.home-main .ann-faq .ann-faq-container .ann .ann-main .link-go {
    padding: 33px 0;
    display: block
}

.home-main .ann-faq .ann-faq-container .ann .ann-main .des {
    font-weight: 600;
    font-size: 16px;
    line-height: 20px;
    color: #3f475a;
    margin-bottom: 6px
}

.home-main .ann-faq .ann-faq-container .ann .ann-main .time {
    font-size: 14px;
    line-height: 17px;
    color: #9aa1b1
}

.home-main .ann-faq .ann-faq-container .ann .view-all {
    text-align: center;
    margin-top: 30px
}

.home-main .ann-faq .ann-faq-container .ann .all {
    font-weight: 500;
    font-size: 16px;
    line-height: 20px;
    color: #2d60e0
}

@media (max-width: 767px) {
    .home-main .ann-faq {
        margin-bottom: 64px;
        margin-top: 80px
    }

    .home-main .ann-faq .ann-faq-container .tabs, .home-main .ann-faq .ann-faq-container .tabs .btn {
        font-weight: 600;
        font-size: 18px;
        line-height: 44px
    }

    .home-main .ann-faq .ann-faq-container .ann .ann-main .link-go {
        padding: 20px 0
    }

    .home-main .ann-faq .ann-faq-container .ann .ann-main .des {
        font-size: 14px;
        font-weight: 500;
        line-height: 20px
    }

    .home-main .ann-faq .ann-faq-container .ann .ann-main .time {
        font-size: 12px
    }

    .home-main .ann-faq .ann-faq-container .ann .view-all {
        margin-top: 16px
    }

    .home-main .ann-faq .ann-faq-container .ann .all {
        font-size: 14px;
        line-height: 20px
    }

    .home-main .ann-faq .ann-faq-container .faq .item, .home-main .ann-faq .ann-faq-container .faq .question {
        height: 75px
    }

    .home-main .ann-faq .ann-faq-container .faq .question .title {
        padding: 18px 0;
        font-weight: 500;
        font-size: 14px;
        line-height: 20px
    }
}

.home-main .download {
    width: 100%
}

@media (max-width: 767px) {
    .home-main .download .download-container .dl-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

.home-main .download .download-container .dl-text-box .app-download-intro {
    text-align: center
}

.home-main .download .download-container .dl-text-box .app-download-intro .title {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center;
    font-size: 26px;
    line-height: 30px;
    font-weight: 600;
    color: #1f2533
}

.home-main .download .download-container .dl-text-box .app-download-intro .subtitle {
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    color: #3f475a;
    margin-top: 8px
}

.home-main .download .download-container .dl-text-box .app-download-intro .detail {
    color: #205fec;
    font-weight: 500;
    font-size: 14px;
    line-height: 17px;
    margin-top: 8px
}

.home-main .download .download-container .dl-text-box .app-download-mobile {
    display: -webkit-box;
    display: flex;
    padding-top: 24px;
    -webkit-box-pack: center;
    justify-content: center
}

.home-main .download .download-container .dl-text-box .app-download-mobile .app-dl-btn {
    background-color: #242630;
    color: #fff;
    border-radius: 2px;
    border: 0;
    outline: 0;
    -webkit-transition: all .25s;
    transition: all .25s;
    cursor: pointer;
    width: 146px;
    text-align: center;
    background-color: #1f2533;
    border-radius: 4px;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center
}

.home-main .download .download-container .dl-text-box .app-download-mobile .app-dl-btn:hover {
    background-color: #31343f
}

.home-main .download .download-container .dl-text-box .app-download-mobile .app-dl-btn .store-logo {
    height: 24px;
    margin: 8px 24px;
    pointer-events: none
}

.home-main .download .download-container .dl-text-box .app-download-mobile .app-dl-btn + .app-dl-btn {
    margin-left: 16px
}

.home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn {
    display: none
}

.home-main .download .download-container .dl-text-box .app-download-desk {
    display: -webkit-box;
    display: flex;
    padding-top: 18px;
    -webkit-box-pack: center;
    justify-content: center
}

.home-main .download .download-container .dl-text-box .app-download-desk .client-dl-btn {
    width: 146px;
    font-size: 14px;
    line-height: 20px;
    padding: 10px 16px;
    font-weight: 500;
    background-color: #edf0f7;
    border-radius: 4px;
    color: #1f2533;
    cursor: pointer;
    -webkit-transition: all .25s;
    transition: all .25s;
    text-align: center
}

.home-main .download .download-container .dl-text-box .app-download-desk .client-dl-btn:hover {
    background-color: #ebeef2
}

.home-main .download .download-container .dl-text-box .app-download-desk .client-dl-btn + .client-dl-btn {
    margin-left: 16px
}

.home-main .download .download-container .dl-text-box .app-download-api {
    cursor: pointer;
    -webkit-box-pack: center;
    justify-content: center;
    padding-top: 20px;
    text-align: center;
    font-weight: 500;
    font-size: 12px;
    line-height: 20px;
    color: #1f2533
}

.home-main .download .download-container .dl-text-box .app-download-api .icon {
    color: #1f2533;
    font-size: 20px;
    margin-right: 8px;
    vertical-align: middle
}

.home-main .download .download-container .dl-text-box .app-download-api .text {
    color: #1f2533;
    vertical-align: middle;
    text-decoration: underline
}

.home-main .download .download-container .dl-text-box .sell-info {
    display: block;
    margin-top: 30px
}

.home-main .download .download-container .dl-text-box .sell-info .item {
    margin-bottom: 10px;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: start;
    justify-content: flex-start
}

.home-main .download .download-container .dl-text-box .sell-info .item .right {
    font-size: 14px;
    color: #2ead65
}

.home-main .download .download-container .dl-text-box .sell-info .info {
    font-style: normal;
    font-weight: 500;
    font-size: 12px;
    line-height: 14px;
    color: #3f475a;
    margin-left: 7px
}

.home-main .download .download-container .dl-img-box {
    display: none
}

@media (max-width: 767px) {
    .home-main .download .download-container .dl-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }
}

.home-main .download .download-container .dl-img-box .dl-img {
    width: 662px;
    height: 406px
}

@media (max-width: 767px) {
    .home-main .download .download-container .dl-text-box .sell-info {
        max-width: 310px;
        margin: 30px auto 0
    }

    .home-main .download .download-container .dl-text-box .sell-info-bl {
        display: block
    }

    .home-main .download .download-container .dl-text-box .sell-info-none {
        display: none
    }

    .home-main .download .download-container .dl-text-box .detail-btn {
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        align-items: center;
        margin-top: 12px
    }

    .home-main .download .download-container .dl-text-box .detail-btn .main {
        display: -webkit-box;
        display: flex
    }

    .home-main .download .download-container .dl-text-box .detail-btn .btn {
        color: #205fec;
        font-weight: 500;
        font-size: 14px;
        line-height: 17px;
        cursor: pointer
    }

    .home-main .download .download-container .dl-text-box .detail-btn .arrow {
        color: #205fec;
        cursor: pointer
    }

    .home-main .download .download-container .dl-text-box .detail-btn .arrow.down {
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg);
        margin-bottom: 8px
    }

    .home-main .download .download-container .dl-text-box .detail-btn .arrow.up {
        margin-top: 8px;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }
}

@media (min-width: 768px) {
    .home-main .download .download-container {
        padding: 64px 0 38px
    }

    .home-main .download .download-container .dl-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }

    .home-main .download .download-container .dl-text-box .sell-info {
        display: block;
        max-width: 380px;
        margin: 30px auto 0
    }

    .home-main .download .download-container .dl-text-box .sell-info-bl {
        display: block
    }

    .home-main .download .download-container .dl-text-box .sell-info-none {
        display: none
    }

    .home-main .download .download-container .dl-text-box .detail-btn {
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        align-items: center;
        margin: 12px auto 0;
        width: 380px
    }

    .home-main .download .download-container .dl-text-box .detail-btn .main {
        display: -webkit-box;
        display: flex
    }

    .home-main .download .download-container .dl-text-box .detail-btn .btn {
        color: #205fec;
        font-weight: 500;
        font-size: 14px;
        line-height: 17px;
        cursor: pointer
    }

    .home-main .download .download-container .dl-text-box .detail-btn .arrow {
        color: #205fec;
        cursor: pointer
    }

    .home-main .download .download-container .dl-text-box .detail-btn .arrow.down {
        -webkit-transform: rotate(270deg);
        transform: rotate(270deg);
        margin-bottom: 8px
    }

    .home-main .download .download-container .dl-text-box .detail-btn .arrow.up {
        margin-top: 8px;
        -webkit-transform: rotate(90deg);
        transform: rotate(90deg)
    }

    .home-main .download .download-container .dl-text-box .app-download-intro {
        text-align: center
    }

    .home-main .download .download-container .dl-text-box .app-download-intro .title {
        font-size: 28px;
        line-height: 32px
    }

    .home-main .download .download-container .dl-text-box .app-download-intro .subtitle {
        line-height: 16px;
        margin-top: 8px
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile {
        padding-top: 34px
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .app-dl-btn {
        width: 146px
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .app-dl-btn .store-logo {
        margin: 14px 24px 10px 20px
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .app-dl-btn + .app-dl-btn {
        margin-left: 16px
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn {
        display: inline-block;
        position: relative;
        -webkit-box-align: center;
        align-items: center;
        -webkit-box-pack: center;
        justify-content: center;
        width: 48px;
        height: 48px;
        border-radius: 4px;
        background-color: #242630;
        margin-left: 20px;
        cursor: pointer;
        font-size: 0
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn .icon {
        color: #fff;
        font-size: 22px
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn .show-code {
        visibility: hidden;
        opacity: 0;
        position: absolute;
        top: 58px;
        z-index: 1;
        padding: 16px 16px 12px;
        background-color: #fff;
        -webkit-box-shadow: 0 8px 16px 0 rgba(18, 20, 40, .1);
        box-shadow: 0 8px 16px 0 rgba(18, 20, 40, .1);
        border: 1px solid #e3e7ef;
        border-radius: 5px;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        -webkit-transition: all .25s ease-in;
        transition: all .25s ease-in;
        left: 50%;
        -webkit-transform: translateX(-50%);
        transform: translateX(-50%)
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn .show-code .triangle-add, .home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn .show-code .triangle-top {
        position: absolute;
        top: -16px;
        left: 72px;
        width: 0;
        height: 0;
        overflow: hidden;
        font-size: 0;
        line-height: 0;
        border: 8px solid transparent;
        border-bottom-color: #e3e7ef
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn .show-code .triangle-add {
        top: -15px;
        border-color: transparent transparent #fff
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn .show-code .show-code-line {
        width: 116px;
        height: 116px;
        padding: 8px;
        border: 1px solid #ced2d9
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn .show-code .show-code-line .qr-code-img {
        width: 100px;
        height: 100px
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn .show-code .text {
        margin-top: 8px;
        font-size: 14px;
        font-weight: 400;
        color: #35384a;
        line-height: 16px;
        padding: 2px 0
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn:hover {
        background-color: #31343f
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .qr-code-btn:hover .show-code {
        visibility: visible;
        opacity: 1
    }

    .home-main .download .download-container .dl-text-box .app-download-desk {
        display: -webkit-box;
        display: flex;
        padding-top: 12px;
        -webkit-box-pack: center;
        justify-content: center
    }

    .home-main .download .download-container .dl-text-box .app-download-desk .client-dl-btn {
        width: 146px;
        padding: 14px 20px
    }

    .home-main .download .download-container .dl-text-box .app-download-desk .client-dl-btn + .client-dl-btn {
        margin-left: 16px
    }

    .home-main .download .download-container .dl-text-box .app-download-api {
        font-size: 12px;
        line-height: 16px;
        padding-top: 27px
    }

    .home-main .download .download-container .dl-text-box .app-download-api .icon {
        font-size: 18px
    }

    .home-main .download .download-container .dl-text-box .app-download-api .text {
        color: #1f2533
    }

    .home-main .download .download-container .dl-img-box {
        display: block;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px;
        margin-top: 36px
    }

    .home-main .download .download-container .dl-img-box .dl-img {
        max-width: 600px;
        margin: 0 auto;
        display: block
    }
}

@media (min-width: 768px) and (min-width: 768px) {
    .home-main .download .download-container .dl-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1024px) {
    .home-main .download .download-container .dl-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1270px) {
    .home-main .download .download-container .dl-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 768px) {
    .home-main .download .download-container .dl-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1024px) {
    .home-main .download .download-container .dl-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1270px) {
    .home-main .download .download-container .dl-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .home-main .download .download-container {
        padding: 4px 0 27px;
        display: -webkit-box;
        display: flex
    }

    .home-main .download .download-container .dl-text-box {
        margin-top: 0;
        margin-left: 48px;
        -webkit-box-ordinal-group: 3;
        order: 2
    }

    .home-main .download .download-container .dl-text-box .sell-info {
        display: block;
        width: auto;
        max-width: none
    }

    .home-main .download .download-container .dl-text-box .detail-btn {
        display: none
    }

    .home-main .download .download-container .dl-text-box .app-download-intro {
        text-align: left
    }

    .home-main .download .download-container .dl-text-box .app-download-intro .title {
        -webkit-box-pack: start;
        justify-content: flex-start
    }

    .home-main .download .download-container .dl-text-box .app-download-intro .subtitle {
        line-height: 20px;
        margin-top: 6px
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile {
        padding-top: 40px;
        -webkit-box-pack: start;
        justify-content: flex-start
    }

    .home-main .download .download-container .dl-text-box .app-download-mobile .app-dl-btn .store-logo {
        margin: 12px 24px 12px 21px
    }

    .home-main .download .download-container .dl-text-box .app-download-desk {
        display: -webkit-box;
        display: flex;
        padding-top: 16px;
        -webkit-box-pack: start;
        justify-content: flex-start
    }

    .home-main .download .download-container .dl-text-box .app-download-desk .client-dl-btn {
        padding: 14px 16px
    }

    .home-main .download .download-container .dl-text-box .app-download-api {
        text-align: left;
        padding-top: 16px
    }

    .home-main .download .download-container .dl-img-box {
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: end;
        justify-content: flex-end;
        margin-top: 0
    }

    .home-main .download .download-container .dl-img-box .dl-img {
        width: 644px;
        max-width: unset;
        margin: 0 -12px 0 0
    }
}

@media (min-width: 1024px) and (min-width: 768px) {
    .home-main .download .download-container .dl-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1024px) {
    .home-main .download .download-container .dl-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1270px) {
    .home-main .download .download-container .dl-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 768px) {
    .home-main .download .download-container .dl-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1024px) {
    .home-main .download .download-container .dl-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1270px) {
    .home-main .download .download-container .dl-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .home-main .download .download-container .dl-text-box {
        margin-left: 96px;
        margin-top: 36px
    }

    .home-main .download .download-container .dl-text-box .app-download-intro .title {
        font-size: 38px;
        line-height: 46px;
        font-weight: 600
    }

    .home-main .download .download-container .dl-text-box .app-download-intro .subtitle {
        margin-top: 10px;
        font-weight: 500;
        font-size: 18px;
        line-height: 22px
    }

    .home-main .download .download-container .dl-img-box {
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: end;
        justify-content: flex-end
    }

    .home-main .download .download-container .dl-img-box .dl-img {
        width: 860px;
        height: 544px;
        max-width: unset;
        margin: 0 -28px 0 0
    }
}

@media (min-width: 1270px) and (min-width: 768px) {
    .home-main .download .download-container .dl-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) and (min-width: 1024px) {
    .home-main .download .download-container .dl-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) and (min-width: 1270px) {
    .home-main .download .download-container .dl-text-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) and (min-width: 768px) {
    .home-main .download .download-container .dl-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) and (min-width: 1024px) {
    .home-main .download .download-container .dl-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) and (min-width: 1270px) {
    .home-main .download .download-container .dl-img-box {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 50%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.home-main .footer-banner {
    position: relative;
    margin-bottom: 130px
}

.home-main .footer-banner-container {
    position: relative
}

.home-main .footer-banner-container .next, .home-main .footer-banner-container .pre {
    cursor: pointer;
    font-size: 24px;
    color: #3c6fef;
    padding: 30px 5px
}

.home-main .footer-banner-container .no-main {
    color: #d1deff
}

.home-main .banners {
    display: -webkit-box;
    display: flex;
    position: relative;
    min-height: 190px
}

.home-main .banners .banners-list {
    display: -webkit-box;
    display: flex;
    position: absolute;
    left: 0;
    top: 15px;
    -webkit-transition: all .5s ease;
    transition: all .5s ease
}

.home-main .banners .details {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 75%;
    padding-left: 8px;
    padding-right: 8px;
    -webkit-transition: all .25s ease;
    transition: all .25s ease;
    border-radius: 4px
}

@media (min-width: 768px) {
    .home-main .banners .details {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 25%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .home-main .banners .details {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 25%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .home-main .banners .details {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 25%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.home-main .banners .details .details-link {
    display: -webkit-box;
    display: flex;
    -webkit-box-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    align-items: center;
    border-radius: 4px
}

.home-main .banners .details .img {
    display: -webkit-box;
    display: flex;
    width: 100%;
    height: auto;
    border-radius: 4px
}

.home-main .banners .details:hover {
    -webkit-box-shadow: 0 8px 11px -3px rgba(79, 86, 105, .08);
    box-shadow: 0 8px 11px -3px rgba(79, 86, 105, .08);
    -webkit-transform: scale(1.02);
    transform: scale(1.02)
}

.home-main .banners::-webkit-scrollbar, .home-main .footer-banner::-webkit-scrollbar {
    width: 0;
    background: transparent;
    display: none
}

.home-main .banners::-webkit-scrollbar-thumb, .home-main .footer-banner::-webkit-scrollbar-thumb {
    background: transparent;
    display: none
}

@media (max-width: 767px) {
    .home-main .footer-banner {
        margin-bottom: 64px
    }

    .home-main .footer-banner .okg-container {
        padding: 0
    }

    .home-main .footer-banner .next, .home-main .footer-banner .pre {
        display: none
    }

    .home-main .banners {
        min-height: 170px;
        overflow-x: auto;
        overflow-y: hidden;
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 8px;
        padding-right: 8px
    }

    .home-main .banners .banners-list {
        padding-left: 16px;
        min-height: 170px;
        top: 0
    }

    .home-main .banners .details {
        padding-left: 0;
        padding-right: 0;
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        align-items: center;
        margin-right: 16px
    }

    .home-main .banners .details .details-link {
        width: 254px;
        height: 127px
    }
}

@media (max-width: 767px) and (min-width: 768px) {
    .home-main .banners {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 767px) and (min-width: 1024px) {
    .home-main .banners {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (max-width: 767px) and (min-width: 1270px) {
    .home-main .banners {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) {
    .home-main .footer-banner {
        margin-bottom: 120px
    }

    .home-main .footer-banner-container .next, .home-main .footer-banner-container .pre {
        position: absolute;
        top: 50%;
        -webkit-transform: translateY(-50%);
        transform: translateY(-50%)
    }

    .home-main .footer-banner-container .next {
        -webkit-transform: translateY(-50%) rotate(180deg);
        transform: translateY(-50%) rotate(180deg)
    }

    .home-main .footer-banner-container .pre {
        left: 0
    }

    .home-main .footer-banner-container .next {
        right: 0
    }

    .home-main .banners {
        min-height: 170px;
        overflow: hidden;
        margin: 0 auto;
        padding: 0 !important
    }

    .home-main .banners .banners-list {
        display: -webkit-box;
        display: flex;
        position: absolute;
        left: 0;
        top: 15px
    }

    .home-main .banners .details {
        padding-left: 0;
        padding-right: 0;
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        align-items: center;
        width: 100%
    }

    .home-main .banners .details .details-link {
        width: 272px;
        height: 136px;
        overflow: hidden
    }

    .home-main .banners .details:not(:last-child) {
        margin-right: 16px
    }

    .home-main .banners .details:hover {
        -webkit-box-shadow: 0 8px 11px -3px rgba(79, 86, 105, .08);
        box-shadow: 0 8px 11px -3px rgba(79, 86, 105, .08);
        -webkit-transform: scale(1.02);
        transform: scale(1.02)
    }
}

@media (min-width: 768px) and (min-width: 768px) {
    .home-main .banners {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1024px) {
    .home-main .banners {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 768px) and (min-width: 1270px) {
    .home-main .banners {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 83.33333333%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .home-main .banners .banners-list {
        padding-left: 16px
    }
}

@media (min-width: 1024px) and (min-width: 768px) {
    .home-main .banners {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 91.66666667%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1024px) {
    .home-main .banners {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 91.66666667%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) and (min-width: 1270px) {
    .home-main .banners {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 91.66666667%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .home-main .footer-banner {
        position: relative;
        margin-bottom: 120px
    }

    .home-main .footer-banner-container {
        position: relative
    }

    .home-main .footer-banner-container .next, .home-main .footer-banner-container .pre {
        display: none
    }

    .home-main .banners {
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: center;
        justify-content: center
    }

    .home-main .banners .banners-list {
        position: static;
        padding-left: 0;
        width: 100%
    }

    .home-main .banners .details {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 75%;
        padding-left: 8px;
        padding-right: 8px
    }

    .home-main .banners .details .details-link {
        width: auto;
        height: auto
    }

    .home-main .banners .details:not(:last-child) {
        margin-right: 0
    }
}

@media (min-width: 1270px) and (min-width: 768px) {
    .home-main .banners .details {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 25%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) and (min-width: 1024px) {
    .home-main .banners .details {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 25%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) and (min-width: 1270px) {
    .home-main .banners .details {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 25%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.home-main .home-ticker {
    width: 100%;
    margin: 0 auto;
    background: #fff;
    position: relative;
    top: -12px;
    border-radius: 12px 12px 0 0
}

.home-main .ticker-container {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%;
    padding-left: 8px;
    padding-right: 8px;
    padding-top: 16px
}

@media (min-width: 768px) {
    .home-main .ticker-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .home-main .ticker-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1270px) {
    .home-main .ticker-container {
        -webkit-box-sizing: border-box;
        box-sizing: border-box;
        width: 100%;
        padding-left: 12px;
        padding-right: 12px
    }
}

.home-main .ticker-container .ticker-tab-box {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    -webkit-box-pack: center;
    justify-content: center
}

.home-main .ticker-container .ticker-tab-box .ticker-tab {
    font-weight: 600;
    font-size: 14px;
    line-height: 20px;
    padding: 12px 0;
    color: #9aa1b1;
    cursor: pointer;
    border-bottom: 2px solid transparent
}

.home-main .ticker-container .ticker-tab-box .ticker-tab + .ticker-tab {
    margin-left: 24px
}

.home-main .ticker-container .ticker-table {
    display: none;
    table-layout: fixed;
    border: none;
    width: 100%
}

.home-main .ticker-container .ticker-table .table-title-box {
    display: -webkit-box;
    display: flex;
    line-height: 32px;
    height: 32px;
    -webkit-box-align: center;
    align-items: center
}

.home-main .ticker-container .ticker-table .table-title-box .table-title {
    font-size: 12px;
    font-weight: 400;
    color: #979fb1;
    border-bottom: 1px solid #f2f5f6;
    width: 50%
}

.home-main .ticker-container .ticker-table .table-title-box .table-title:first-of-type {
    text-align: left
}

.home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(2) {
    text-align: right
}

.home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(3), .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(4), .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(5) {
    display: none
}

.home-main .ticker-container .ticker-table .table-content {
    min-height: 384px;
    visibility: hidden
}

.home-main .ticker-container .ticker-table .table-content .table-item {
    cursor: pointer;
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    height: 64px;
    border-bottom: 1px solid #f2f5f6;
    font-size: 16px;
    font-weight: 400;
    color: #1f2533;
    position: relative;
    -webkit-transition: all .25s;
    transition: all .25s
}

.home-main .ticker-container .ticker-table .table-content .table-item:hover {
    background: rgba(17, 51, 83, .02)
}

.home-main .ticker-container .ticker-table .table-content .table-item .item-block {
    display: -webkit-box;
    display: flex;
    -webkit-box-align: center;
    align-items: center;
    pointer-events: none
}

.home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-coin {
    -webkit-box-flex: 1;
    flex-grow: 1;
    text-align: left;
    font-weight: 500
}

.home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price {
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-box-align: end;
    align-items: flex-end
}

.home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price .price-value {
    font-weight: 500;
    font-size: 16px;
    color: #1f2533;
    line-height: 20px
}

.home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price .td-percent {
    font-weight: 500;
    font-size: 14px;
    line-height: 16px;
    margin-top: 3px
}

.home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price .equal, .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price .legal-price {
    font-size: 16px;
    color: #979fb1
}

.home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price .equal {
    margin-left: 6px
}

.home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-btn, .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-line {
    display: none
}

.home-main .ticker-container .ticker-table .table-content .table-item .coin-icon {
    width: 32px;
    height: 32px;
    vertical-align: middle
}

.home-main .ticker-container .ticker-table .table-content .table-item .coin-name {
    display: -webkit-box;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    margin-left: 10px
}

.home-main .ticker-container .ticker-table .table-content .table-item .coin-name .intro {
    line-height: 20px;
    font-weight: 500;
    margin-right: 5px
}

.home-main .ticker-container .ticker-table .table-content .table-item .coin-name .all {
    color: #9aa1b1;
    font-weight: 400;
    font-size: 14px;
    line-height: 16px
}

.home-main .ticker-container .ticker-table .table-content .index-green {
    color: #2ead65
}

.home-main .ticker-container .ticker-table .table-content .index-red {
    color: #e35e5e
}

.home-main .ticker-container[data-index="1"] .ticker-tab-box .ticker-tab:first-child {
    color: #1f2533
}

.home-main .ticker-container[data-index="1"] .ticker-table-box .ticker-table:first-child {
    display: table
}

.home-main .ticker-container[data-index="2"] .ticker-tab-box .ticker-tab:nth-child(2) {
    color: #1f2533
}

.home-main .ticker-container[data-index="2"] .ticker-table-box .ticker-table:nth-child(2) {
    display: table
}

.home-main .ticker-container[data-index="3"] .ticker-tab-box .ticker-tab:nth-child(3) {
    color: #1f2533
}

.home-main .ticker-container[data-index="3"] .ticker-table-box .ticker-table:nth-child(3) {
    display: table
}

.home-main .ticker-container[data-index="4"] .ticker-tab-box .ticker-tab:nth-child(4) {
    color: #1f2533
}

.home-main .ticker-container[data-index="4"] .ticker-table-box .ticker-table:nth-child(4) {
    display: table
}

.home-main .ticker-container .ticker-more {
    text-align: center;
    padding-top: 20px;
    padding-bottom: 52px
}

.home-main .ticker-container .ticker-more .text {
    font-size: 14px;
    font-weight: 500;
    color: #2d60e0;
    line-height: 22px
}

.home-main .ticker-container .ticker-more .icon {
    font-size: 12px;
    vertical-align: middle;
    color: #2d60e0
}

.home-main .ticker-container .iconlink {
    color: #1f2533
}

.home-main .ticker-container .icon_btc {
    height: 24px;
    width: 24px;
    background: url(/cdn/assets/okfe/seo-ex/6.10.11/home-icon.png?bce24c1c55a8c7314a2fc775323cf825=) left -50px/99px 74px no-repeat
}

.home-main .ticker-container .icon_bch {
    height: 24px;
    width: 24px;
    background: url(/cdn/assets/okfe/seo-ex/6.10.11/home-icon.png?bce24c1c55a8c7314a2fc775323cf825=) -50px -25px/99px 74px no-repeat
}

.home-main .ticker-container .icon_eth {
    height: 24px;
    width: 24px;
    background: url(/cdn/assets/okfe/seo-ex/6.10.11/home-icon.png?bce24c1c55a8c7314a2fc775323cf825=) -50px top/99px 74px no-repeat
}

.home-main .ticker-container .icon_okb {
    height: 24px;
    width: 24px;
    background: url(/cdn/assets/okfe/seo-ex/6.10.11/home-icon.png?bce24c1c55a8c7314a2fc775323cf825=) left -25px/99px 74px no-repeat
}

.home-main .ticker-container .icon_ltc {
    height: 24px;
    width: 24px;
    background: url(/cdn/assets/okfe/seo-ex/6.10.11/home-icon.png?bce24c1c55a8c7314a2fc775323cf825=) -75px top/99px 74px no-repeat
}

.home-main .ticker-container .icon_bsv {
    height: 24px;
    width: 24px;
    background: url(/cdn/assets/okfe/seo-ex/6.10.11/home-icon.png?bce24c1c55a8c7314a2fc775323cf825=) -25px -25px/99px 74px no-repeat
}

.home-main .ticker-container .icon_etc {
    height: 24px;
    width: 24px;
    background: url(/cdn/assets/okfe/seo-ex/6.10.11/home-icon.png?bce24c1c55a8c7314a2fc775323cf825=) 0 0/99px 74px no-repeat
}

@media (min-width: 768px) {
    .home-main .ticker-container .ticker-tab-box .ticker-tab {
        font-size: 16px
    }

    .home-main .ticker-container .ticker-tab-box .ticker-tab + .ticker-tab {
        margin-left: 36px
    }

    .home-main .ticker-container .ticker-table .table-title-box {
        line-height: 40px;
        height: 40px
    }

    .home-main .ticker-container .ticker-table .table-title-box .table-title {
        width: auto
    }

    .home-main .ticker-container .ticker-table .table-title-box .table-title:first-of-type {
        width: 35%;
        text-align: left
    }

    .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(2) {
        width: 15%;
        text-align: right
    }

    .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(3), .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(4), .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(5) {
        display: block;
        text-align: right
    }

    .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(3) {
        width: 15%
    }

    .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(4) {
        width: 20%
    }

    .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(5) {
        width: 15%;
        text-align: right
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .item-block {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        pointer-events: auto
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-coin {
        -webkit-box-flex: 1;
        flex-grow: 1;
        text-align: left;
        width: 35%
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        -webkit-box-align: center;
        align-items: center;
        width: 30%
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price .price-value {
        width: 50%;
        text-align: right
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price .td-percent {
        -webkit-box-pack: end;
        justify-content: flex-end;
        font-size: 16px;
        width: 50%;
        text-align: right
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-btn, .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-line {
        display: block
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-line {
        width: 20%;
        text-align: right
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-line .line {
        width: 80px
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-btn {
        width: 15%;
        text-align: right
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .coin-icon {
        width: 24px;
        height: 24px;
        vertical-align: middle
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .coin-name {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        margin-left: 10px;
        -webkit-box-align: center;
        align-items: center
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .coin-name .intro {
        line-height: 20px
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .coin-name .all {
        color: #9aa1b1;
        font-weight: 400;
        font-size: 14px;
        line-height: 16px;
        margin-left: 5px
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .go-trade-btn {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        min-width: 72px;
        height: 34px;
        padding: 8px 10px;
        display: inline-block;
        text-align: center;
        background-color: #fff;
        border: 1px solid #d8dce6;
        border-radius: 4px;
        font-size: 14px;
        font-weight: 400;
        color: #3f475a;
        cursor: pointer;
        -webkit-transition: all .25s;
        transition: all .25s
    }

    .home-main .ticker-container .ticker-table .table-content .table-item .go-trade-btn:hover {
        cursor: pointer;
        background-color: #2ead65;
        color: #fff !important;
        border: 1px solid transparent
    }

    .home-main .ticker-container .ticker-more {
        padding-top: 24px;
        padding-bottom: 58px
    }

    .simulated .home-main .ticker-container .ticker-table .table-title-box {
        line-height: 40px;
        height: 40px
    }

    .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title {
        width: auto
    }

    .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title:first-of-type {
        width: 50%;
        text-align: left
    }

    .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(2) {
        width: 25%;
        text-align: right
    }

    .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(3), .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(4), .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(5) {
        display: block;
        text-align: right
    }

    .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(3) {
        width: 25%
    }

    .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(4) {
        width: 0
    }

    .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(5) {
        width: 0;
        text-align: right
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block {
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        pointer-events: auto
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-coin {
        -webkit-box-flex: 1;
        flex-grow: 1;
        text-align: left;
        width: 50%
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        -webkit-box-align: center;
        align-items: center;
        width: 50%
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price .price-value {
        width: 50%;
        text-align: right
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price .td-percent {
        -webkit-box-pack: end;
        justify-content: flex-end;
        font-size: 16px;
        width: 50%
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-btn, .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-line {
        display: block
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-line {
        width: 0;
        text-align: right
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-line .line {
        width: 80px
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-btn {
        width: 0;
        text-align: right
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .coin-icon {
        width: 24px;
        height: 24px;
        vertical-align: middle
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .coin-name {
        display: -webkit-box;
        display: flex;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        flex-direction: row;
        margin-left: 10px;
        -webkit-box-align: center;
        align-items: center
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .coin-name .intro {
        line-height: 20px
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .coin-name .all {
        color: #9aa1b1;
        font-weight: 400;
        font-size: 14px;
        line-height: 16px;
        margin-left: 5px
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .go-trade-btn {
        -webkit-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        width: -webkit-max-content;
        width: -moz-max-content;
        width: max-content;
        min-width: 72px;
        height: 34px;
        padding: 8px 10px;
        display: inline-block;
        text-align: center;
        background-color: #fff;
        border: 1px solid #d8dce6;
        border-radius: 4px;
        font-size: 14px;
        font-weight: 400;
        color: #3f475a;
        cursor: pointer;
        -webkit-transition: all .25s;
        transition: all .25s
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .go-trade-btn:hover {
        cursor: pointer;
        background-color: #2ead65;
        color: #fff !important;
        border: 1px solid transparent
    }

    .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(3) {
        text-align: right
    }

    .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(4), .simulated .home-main .ticker-container .ticker-table .table-title-box .table-title:nth-of-type(5) {
        display: none
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-price .td-percent {
        text-align: right
    }

    .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-btn, .simulated .home-main .ticker-container .ticker-table .table-content .table-item .item-block.td-line {
        display: none
    }
}

@media (min-width: 1024px) {
    .home-main .ticker-container {
        padding-top: 16px
    }
}

.simulated .home-main .ticker-container .ticker-tab-box .ticker-tab:not(:first-child) {
    display: none
}

.simulated .home-main .ticker-container .ticker-tab-box .ticker-tab + .ticker-tab {
    margin-left: 0
}

.cfg-red-up .home-main .ticker-container .ticker-table .table-content .index-green {
    color: #e35e5e
}

.cfg-red-up .home-main .ticker-container .ticker-table .table-content .index-red {
    color: #2ead65
}

.cfg-red-up .home-main .ticker-container .ticker-table .table-content .table-item .go-trade-btn:hover, .cfg-red-up .simulated .home-main .ticker-container .ticker-table .table-content .table-item .go-trade-btn:hover {
    background-color: #e35e5e
}

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.okg-container {
    padding-left: 8px;
    padding-right: 8px
}

@media (min-width: 768px) {
    .okg-container {
        padding-left: 12px;
        padding-right: 12px
    }
}

@media (min-width: 1024px) {
    .okg-container {
        padding-left: calc((100% - 960px) / 2);
        padding-right: calc((100% - 960px) / 2)
    }
}

@media (min-width: 1270px) {
    .okg-container {
        padding-left: calc((100% - 1248px) / 2);
        padding-right: calc((100% - 1248px) / 2)
    }
}

@font-face {
    font-family: iconfont;
    src: url(data:application/vnd.ms-fontobject;base64,WA8AALAOAAABAAIAAAAAAAIABQMAAAAAAAABAJABAAAAAExQAAAAAAAAAAAAAAAAAAAAAAEAAAAAAAAARkFOgwAAAAAAAAAAAAAAAAAAAAAAABAAaQBjAG8AbgBmAG8AbgB0AAAADgBSAGUAZwB1AGwAYQByAAAAFgBWAGUAcgBzAGkAbwBuACAAMQAuADAAAAAQAGkAYwBvAG4AZgBvAG4AdAAAAAAAAAEAAAALAIAAAwAwR1NVQrD+s+0AAAE4AAAAQk9TLzI9LE3+AAABfAAAAFZjbWFwMoEP3AAAAgwAAAJgZ2x5ZnUfQCYAAASMAAAGjGhlYWQbNdKNAAAA4AAAADZoaGVhB94DjwAAALwAAAAkaG10eDgAAAAAAAHUAAAAOGxvY2ELngmwAAAEbAAAAB5tYXhwAR4AXAAAARgAAAAgbmFtZT5U/n0AAAsYAAACbXBvc3Sxir5TAAANiAAAASgAAQAAA4D/gABcBAAAAAAABAAAAQAAAAAAAAAAAAAAAAAAAA4AAQAAAAEAAINOQUZfDzz1AAsEAAAAAADcC8dIAAAAANwLx0gAAAAABAADAAAAAAgAAgAAAAAAAAABAAAADgBQAAYAAAAAAAIAAAAKAAoAAAD/AAAAAAAAAAEAAAAKAB4ALAABREZMVAAIAAQAAAAAAAAAAQAAAAFsaWdhAAgAAAABAAAAAQAEAAQAAAABAAgAAQAGAAAAAQAAAAAAAQQAAZAABQAIAokCzAAAAI8CiQLMAAAB6wAyAQgAAAIABQMAAAAAAAAAAAAAAAAAAAAAAAAAAAAAUGZFZABA5rbsDAOA/4AAXAOAAIAAAAABAAAAAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAEAAAABAAAAAQAAAAAAAAFAAAAAwAAACwAAAAEAAABtAABAAAAAACuAAMAAQAAACwAAwAKAAABtAAEAIIAAAAWABAAAwAG5rbp6erb6t7q4Otz663r/uwD7Az//wAA5rbp6erb6t7q4Otz663r/uwA7Az//wAAAAAAAAAAAAAAAAAAAAAAAAAAAAEAFgAWABYAFgAWABYAFgAWABYAHAAAAAQACgALAAwADQACAAMABQAGAAcACAAJAAEAAAEGAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAwAAAAAAKwAAAAAAAAADQAA5rYAAOa2AAAABAAA6ekAAOnpAAAACgAA6tsAAOrbAAAACwAA6t4AAOreAAAADAAA6uAAAOrgAAAADQAA63MAAOtzAAAAAgAA660AAOutAAAAAwAA6/4AAOv+AAAABQAA7AAAAOwAAAAABgAA7AEAAOwBAAAABwAA7AIAAOwCAAAACAAA7AMAAOwDAAAACQAA7AwAAOwMAAAAAQAAAAAAIABKAIQArgEAAUYBmgIUAl4CgAK8At4DRgAAAAEAAAAAA00CmgAOAAAJAScmBh8BHgE3Nj8BNiYDAP6aYSQ+E3MPOCAjmrAcLgKA/pFuGiwrxBQOIi3C3CcpAAABAAAAAAGcAtQAFAAAAScmIgcBBhQXARYyPwE2NCcJATY0AZY2Bg0F/skJCQE3BQ0GNgUF/wABAAUCmDYFBf7KChwK/soFBTYFDgUBAAEABQ4AAAABAAAAAAMnAoAAIwAAASYiDwEGFB8BBwYUHwEWMj8BFxYyPwE2NC8BNzY0LwEmIg8BAUMECgQtBATQ0AQELQQKBNDQBAsELQMD0NADAy0ECwTQAnwEBC0ECgTQ0AQLBC0DA9DQAwMtBAsE0NAECgQtBATQAAEAAAAAAbQC1wAUAAAlBwYvAQEmNDcBNh8CFg8BCQEWBwGrNgkLBP7KCgoBNgkLBDYIBAT/AAEACARoNggEBAE2ChwKATYIBAQ2CQsE/wD/AAkLAAMAAAAAA1YCyAAbACUAMQAAEyU2FwUWFA8BFxYGBy4BPwEnFRQGKwEiJj0BJgU/ASUFFzMVFzcHJwcGFhc+AS8BBwa3ATwNDQE8DAx5MxSDlJWDFTRTBQMjAwUCAekEdP72/vZ2A5GToJUwDWN8e2MML5YNAgHABwfACB0HSphAagQDakGYMpgDBQUDwxBVAUeiokkBWFmNWo0kQwMDRSONWwgABgAAAAADKwKWAA0AEQAfACMAJwArAAABMhcVFAYjISImPQE2MwUhFSEXFhcVFAYjISImPQE2NwUhFSEBMxUjFyMVMwMiCAEFBP28BAUBCAIZ/hIB7isIAQUE/bwEBQEIAhn+EgHu/klAQEBAQAKVCOQDBQUD5AgzjnMBCOUDBQUD5QgBM5ABnkD4QAACAAAAAANWAtYACwAyAAABHgEXDgEHLgEnPgEXIg4CFzcHIi8BNDY/ATIWBwEeATc+AScHNzIfARQPASImNwEuAQIAkcEDA8GRkcEDA8GRTYJQBiLSTwgCAwQEzAYFBP7MSNRiYD0v0VAIAQMHzQUFBAEzKnoC1QPBkZHBAwPBkZHBMEmDlUTQCAgkBAUBEgoE/tBZJzk+zmjPCAgkCAISCgQBMDk+AAADAAAAAANeAwAANwBDAE8AAAEyFxUeARcUBisBJicuAQ4BHgEzHgIGBxUGByMmJzUuASc0NjsBFhUeAT4BLgEjLgI2NzU2MzcOAQceARc+ATcuAQceARcOAQcuASc+AQIEBAEiKwIDAioEAQIgLB0BHhcoOgorJwEEKgQBIisCAgIrBAMfLR0CHhYpOQorJwEEFZzPBATPnJzPBATPnIayBASyhoayBASyAm8EJQk1IwIDAQQWHAMfLB4BM1E/CyUDAQEDJQk1IwIDAQQWHAMfLB4BM1E/CyUEkQTPnJzPBATPnJzPLwSyhoayBASyhoayAAAAAwAAAAADMAKrABEAHQApAAABHgEXHgEHDgEHLgEnLgE3PgEXDgEHHgEXPgE3LgEnDgEHBhYXPgE3LgEBq050D1NgBgl2VU50D1NgBgl2/0VbAgJbRUVcAQFc7z9ZCQdBPAduUg9VAqsCX04RgFRUbAICX04RgFRUbNwCW0VFXAEBXEVFW6wBTj0+YxFSbgc1QgAAAAEAAAAAA8ECwQAQAAABNjIWFAcBBiInAyY0NjIfAQNTFDMmE/39FDMU/RInMxTPAq0TJzMT/f8SEwEAFDMmE9MAAAAAAgAAAAADJAKaABYAIgAAAR4CBgcXFhQPAQYiLwEOAScuATc+ARcOAQceARc+ATcuAQHVRnM9ECySAwMYAgcDkj+ZREEzFhl7UE9qAgJqT1BqAgJqApoBSH+GN5IDBwIYAwOSMgYsLpFNTFsyAmpPUGoCAmpQT2oAAQAAAAACvQHuABEAAAEXFg8BBi8BJj8BNjIfATc2MgKgGAUFsgYGsgUFGAMHApSUAgcB6xgGBrIFBbIGBhgCApSUAgAEAAAAAANWAtYACwAXADcAQAAAAR4BFw4BBy4BJz4BFw4BBx4BFz4BNy4BBzIWFQcUDwEOARUeATcHDgEjIi4BPwE+AScmBgc3PgE3MhYUBiImNDYCAJHBAwPBkZHBAwPBkXukAwOke3ukAwOkhBsjAQQVAgQCKhAFHB4RHiECBhUEBQgJIA0GESdCEhgYIxkYAtUDwZGRwQMDwZGRwTADpHt7pAMDpHt7pNYbGhEIDkoHFwgZAQgXCwkeKBZKDSMKBwQFFwcNdxkkGBkjGQAAAAASAN4AAQAAAAAAAAAVAAAAAQAAAAAAAQAIABUAAQAAAAAAAgAHAB0AAQAAAAAAAwAIACQAAQAAAAAABAAIACwAAQAAAAAABQALADQAAQAAAAAABgAIAD8AAQAAAAAACgArAEcAAQAAAAAACwATAHIAAwABBAkAAAAqAIUAAwABBAkAAQAQAK8AAwABBAkAAgAOAL8AAwABBAkAAwAQAM0AAwABBAkABAAQAN0AAwABBAkABQAWAO0AAwABBAkABgAQAQMAAwABBAkACgBWARMAAwABBAkACwAmAWkKQ3JlYXRlZCBieSBpY29uZm9udAppY29uZm9udFJlZ3VsYXJpY29uZm9udGljb25mb250VmVyc2lvbiAxLjBpY29uZm9udEdlbmVyYXRlZCBieSBzdmcydHRmIGZyb20gRm9udGVsbG8gcHJvamVjdC5odHRwOi8vZm9udGVsbG8uY29tAAoAQwByAGUAYQB0AGUAZAAgAGIAeQAgAGkAYwBvAG4AZgBvAG4AdAAKAGkAYwBvAG4AZgBvAG4AdABSAGUAZwB1AGwAYQByAGkAYwBvAG4AZgBvAG4AdABpAGMAbwBuAGYAbwBuAHQAVgBlAHIAcwBpAG8AbgAgADEALgAwAGkAYwBvAG4AZgBvAG4AdABHAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAHMAdgBnADIAdAB0AGYAIABmAHIAbwBtACAARgBvAG4AdABlAGwAbABvACAAcAByAG8AagBlAGMAdAAuAGgAdAB0AHAAOgAvAC8AZgBvAG4AdABlAGwAbABvAC4AYwBvAG0AAAAAAgAAAAAAAAAKAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOAQIBAwEEAQUBBgEHAQgBCQEKAQsBDAENAQ4BDwAOd2ViXzE2X3NsZWN0ZWQLd2ViXzE2X2xlZnQJTXVsX2Nsb3NlBGxlZnQTaG9tZXBhZ2VfYWNhZGVteV8yNBFob21lcGFnZV90b29sc18yNBRob21lcGFnZV9leGNoYW5nZV8yNBNob21lcGFnZV9maW5hbmNlXzI0B3FpZXBpYW4NZmFiaV9zZWxlY3RlZBppY29uX3dlYl9vdXRsaW5lX3NtX3NlYXJjaB5pY29uX3dlYl9vdXRsaW5lX3NtX3NtYWxsLWRvd24daWNvbl93ZWJfb3V0bGluZV9zbV9pbnRyb2R1Y2UAAA==);
    src: url(data:application/vnd.ms-fontobject;base64,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SH+GN5IDBwIYAwOSMgYsLpFNTFsyAmpPUGoCAmpQT2oAAQAAAAACvQHuABEAAAEXFg8BBi8BJj8BNjIfATc2MgKgGAUFsgYGsgUFGAMHApSUAgcB6xgGBrIFBbIGBhgCApSUAgAEAAAAAANWAtYACwAXADcAQAAAAR4BFw4BBy4BJz4BFw4BBx4BFz4BNy4BBzIWFQcUDwEOARUeATcHDgEjIi4BPwE+AScmBgc3PgE3MhYUBiImNDYCAJHBAwPBkZHBAwPBkXukAwOke3ukAwOkhBsjAQQVAgQCKhAFHB4RHiECBhUEBQgJIA0GESdCEhgYIxkYAtUDwZGRwQMDwZGRwTADpHt7pAMDpHt7pNYbGhEIDkoHFwgZAQgXCwkeKBZKDSMKBwQFFwcNdxkkGBkjGQAAAAASAN4AAQAAAAAAAAAVAAAAAQAAAAAAAQAIABUAAQAAAAAAAgAHAB0AAQAAAAAAAwAIACQAAQAAAAAABAAIACwAAQAAAAAABQALADQAAQAAAAAABgAIAD8AAQAAAAAACgArAEcAAQAAAAAACwATAHIAAwABBAkAAAAqAIUAAwABBAkAAQAQAK8AAwABBAkAAgAOAL8AAwABBAkAAwAQAM0AAwABBAkABAAQAN0AAwABBAkABQAWAO0AAwABBAkABgAQAQMAAwABBAkACgBWARMAAwABBAkACwAmAWkKQ3JlYXRlZCBieSBpY29uZm9udAppY29uZm9udFJlZ3VsYXJpY29uZm9udGljb25mb250VmVyc2lvbiAxLjBpY29uZm9udEdlbmVyYXRlZCBieSBzdmcydHRmIGZyb20gRm9udGVsbG8gcHJvamVjdC5odHRwOi8vZm9udGVsbG8uY29tAAoAQwByAGUAYQB0AGUAZAAgAGIAeQAgAGkAYwBvAG4AZgBvAG4AdAAKAGkAYwBvAG4AZgBvAG4AdABSAGUAZwB1AGwAYQByAGkAYwBvAG4AZgBvAG4AdABpAGMAbwBuAGYAbwBuAHQAVgBlAHIAcwBpAG8AbgAgADEALgAwAGkAYwBvAG4AZgBvAG4AdABHAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAHMAdgBnADIAdAB0AGYAIABmAHIAbwBtACAARgBvAG4AdABlAGwAbABvACAAcAByAG8AagBlAGMAdAAuAGgAdAB0AHAAOgAvAC8AZgBvAG4AdABlAGwAbABvAC4AYwBvAG0AAAAAAgAAAAAAAAAKAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOAQIBAwEEAQUBBgEHAQgBCQEKAQsBDAENAQ4BDwAOd2ViXzE2X3NsZWN0ZWQLd2ViXzE2X2xlZnQJTXVsX2Nsb3NlBGxlZnQTaG9tZXBhZ2VfYWNhZGVteV8yNBFob21lcGFnZV90b29sc18yNBRob21lcGFnZV9leGNoYW5nZV8yNBNob21lcGFnZV9maW5hbmNlXzI0B3FpZXBpYW4NZmFiaV9zZWxlY3RlZBppY29uX3dlYl9vdXRsaW5lX3NtX3NlYXJjaB5pY29uX3dlYl9vdXRsaW5lX3NtX3NtYWxsLWRvd24daWNvbl93ZWJfb3V0bGluZV9zbV9pbnRyb2R1Y2UAAA==#iefix) format("embedded-opentype"), url("data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAeQAAsAAAAADrAAAAdAAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHEIGVgCEYAqNDIsPATYCJAM4Cx4ABCAFhG0HgigbzQwRVawBIPt5YNw0j5Ua1y++V9VEfdRIes/58Pypf+69L8kLmioYnK5CMqIc+DAB6eZkKIJBzCAFI9t+sgkQcIcgBzNRF/fT+a6TMyw1Xb9N4iuPkEOKXJBUjt/P5XlSvIse3su9+f2HmTbXtASZhkcTjYTMQluuPGRz6CuYVXExEAAaVEMySGZ2OwE8OKBAoNGo4UP7gzfFgfPREvCRSpcDOZACKMDTpfQugJWy7UkprIQHKBQMeKlOQ7IGocVnX5mO2cvtejE77OmlALitBjAAyQC4W8Qx17QDYColy1zj1pLDPAAmRLD2r/zs+/at5EXJ65K3pRNL95f+X8bKdOXlgBQdoXUCE+VVSnBaDbTQIQwUDAoooQIPNQj55ynBcB3I9sWEob0NPAAHfPsGoAFKXgBogZLXADqg5C1AGFA6EYACpfsBGFD6P4ACKAOAEigjACqgjALwQBkDUANlOuMo4npm8yoAqgLkB4CGiGxUBKFpDMr+PgEDAQUBF26MMVbR6PQcIFbTxTXQ6aK42Eiz+CI11FMHSafvpoirr6VdkOWD50d28TgMg1x242C309zVm2+SZIFG2kVNYkQBqKljjCxCRHOfGFOz64mEgZ1cJtMQT755qNdo7Ow2GASRie470JDS322/vOVhvxAMyrIEu0ujcXgI8fQ3ywP6iVqIsiAJ6wJiKFRNElwznUZvsX5Zr3a0DmGi2yY2rz1EC42ogXZkICD606wmhUKiw48smRM4TNXyvWbZ6TYMCgTkUEgS9Bhj1dxrOjzmoZeDU5NOPX6p6n93j2nNnmO71u/WHn8UuFgHLoMthfguR91Zq3Vj9e4Tezfs0fgeB6/UJ0ByHkKgfFPlYFDIUpc9cuHCH4Hkf+tQNaWr/hqbAnn6abYEZ+51nrPHT9rlSJT25F9wJojRcgL+FmLLzCXe5TBJD/1xd5yY4DYILpPkMSd5nUZRFtpWt015SpynUMEe8OdXYfVxc4Vt2zSO0xsqy96NJs82Q+WdJ2Tnbvsux578veVzYUy/0Q1fJE648mH2T8mrLx184XsKt1cUwjLr1V1aZSnbIjNMEDP1meWIUk20mmnT2O7y9ICJtmk1B6vG6teqtd61aC05Fo3lrivCitgzVFy81Va37uoqqwWm5orTGtnSQKk6fGh84fp1focTVX3T8qze5vOGFzMXFVcztLB5u2SsYpnMAs2vVP8qpE/MVm+mrzU5l5ECuajbxmWu7mnLrgxoNZPOoAMyj6Quc/e4AWstN6/6yDI5cgj7qOIrWL9f8X3ihHGqT3btJ9W44oLvfetbYEzzP4RgKPcX0IsXqaXgyqCV/nvT2ufndpyncNVs/ehBBxVvtnB10u9EKvNstrScbk9i+zfo27TJvdShD+93VPEqC9//bqQiz2ZNWzW9KdgYjtWusC2K1qKJ6cz4z5H72lfmcUXqTgdG1KbpVk49kK6blM7VLr18v/Irk30erMA4Q8Fadv8+WwsoMqGVXi11ITt8mIFlIcvAzNon9uxpTyb20bfvEtF3rqIr33XySIHYmv3/IpP06EEyqVuPnplI6dkT0ov17PH93rfd2i8b3WLAIWXn0aM7Kz8KLVHXut9qk2y1KDJs1n/LL22DyUnvP4Z/dRYm5DSZE77QV1hYS1VzapSqlnLCd6sUrZNapFgLjO0qtJ3Ro2NGBzJ8OBEsHa8MdDqCpQOsgI0lU7OyDh8WBB7lkqk1VZHFONlIVcPnzKBbt3arZYbIBLP+/vMDlRMrgW9qyDPV4ysU/JF9+mlktTCzaMhr0mr6ol+uSspRLadETYuZallimYa5/wIfwNrTNQBA1lE/ALA4agcAcmypzGMSvSlnJFGPWRJ07MPgmE73Ol6il8Jj0iqi58j3YQ1Hi40wsYPZ0Te8yW98nECmvdTeyJXjOKSXwYMuzeE4NhhC9uK+JiT9b9jB61Nx16MTlCUUgIaOAo4LWVF4nVeiEflWEPAw6p4UKlT1ZOARI+JkyZ4KaFHHUwkezT01SELO4VpEYwIYCKcGkIiFxJMgAgc9KfS4QMxNdo84kL3yVMCE7yxKUBLmqQFX6vKEWrHpg8cILENJihXRHL3gEvOB0vgbZG1ZZEyXrf4hJo2edJrtf+UreIhp7JLmspuzICKiIy9kB7AWSRVxBjw3FVRU01ZLPG7R5OjWDrQWASYDJaKwEsNqHPKE9ezA9vffgFSzmOjT7ifsPxAlevZER1M7hOiV+1DtlqVlMid1ZSZFIHxJhJwa8cKmAEvLEFG5rzcDuKxJxSipTLWY/kRY3sw/wg11jsHXIb6avqyomm6Yli0c1/OTfihoZ0iTbeUMKA+Ne1kQef+ttpRbTLBFrnep0EHFJFDGWQluRbv9c3tJRrTppriqAUuumFdGdfvRagntmefsgbtBQ6WZPxas0DRB3sL10BBoAVbBOlvtgSbnMTOLXN3fbOiYtY0SF/7uu5b2OWJZc1hbAwAAAA==") format("woff2"), url(data:font/woff;base64,d09GRgABAAAAAAl0AAsAAAAADrAAAQAAAAAAAAAAAAAAAAAAAAAAAAAAAABHU1VCAAABCAAAADMAAABCsP6z7U9TLzIAAAE8AAAARAAAAFY9LE3+Y21hcAAAAYAAAAC3AAACYDKBD9xnbHlmAAACOAAABKQAAAaMdR9AJmhlYWQAAAbcAAAAKwAAADYbNdKNaGhlYQAABwgAAAAcAAAAJAfeA49obXR4AAAHJAAAAA8AAAA4OAAAAGxvY2EAAAc0AAAAHgAAAB4LngmwbWF4cAAAB1QAAAAfAAAAIAEeAFxuYW1lAAAHdAAAAUUAAAJtPlT+fXBvc3QAAAi8AAAAuAAAASixir5TeJxjYGRgYOBikGPQYWB0cfMJYeBgYGGAAJAMY05meiJQDMoDyrGAaQ4gZoOIAgCKIwNPAHicY2BkYWCcwMDKwMHUyXSGgYGhH0IzvmYwYuRgYGBiYGVmwAoC0lxTGByebXvDw9zwv4EhhrmBoQEozAiSAwDtbwyreJzlksENwjAMRV9IW6C0EidOjMB23YB5KCfEMpWqnpCaZIYWu+YE3QBHL5K/FMfyN5ADXrgIGbgHDo27qG7RPeWiZ1wlP3EUpXg9xzF0oQ9DbGIbp+RTNc/wo2P6Sjip9X3OSxclBypqNvJTTsGWHXvtxhWrlf4rquW+fbJaZ26of+NoqGehM2SahN7Q12Ew9G1sDJk1sTV0H+Jk6H4kDHGC5AzxhLQxxB2SN8QncdzAvQFtE01cAHicdVRdbBRVFL7n3Hvnzm7Z7d/uzC60u3Sm3YFuu1t32hlRum2BKhChlR8jlijKC2kMPkAwWhKJGN4wbqWkNo0hhLdqYhoTXzSh6oMStKsCvvAID8YE34gv3Xpmt0sKwXk499xz7znzfeecexgw+vg+nGNRxkLgZLQ0pMD3hsDLcFaZe7Oz2Hqq8dnN9txXbTk8Vymd3NiT/TEWtXq/v+tsZazqD/N4i8VodTKWAi1mglGgAP1OiARc9rSIrPwcCoEvI5on5Sp5SZwlrXIj3Bau3JDSk1EJgTnK1mJyB88xmzYZq5FCpkEFIohr1oLnCSWJ4Bh2irDoFaJcFrSEg7VB9HJeLnPeS2oZz/7PQXnNcY3H1/hnwKNLaXmATL8PXhqNRgiBoWDBCzUIAhyGQPF0IQIeujgRqOAREQi04HCVrbJQA+NVHq/gT2wT62LPMNba5ZnSiDUSBU3lYAiceEzLgpUZhIwcgi5punHTV47SDLMIeaL8DWyPRGD7hg3vubHzl2bOx/sPSm5zifCXOF15WHl4hpc+vTLTFzl+dur4hvzlCMJ1pa7r7Wrv7PCk4JMjs4VZLiX/oekwvHj16h549cjF1y527uR81L44oTOtijGLl1mENbM0ZdxhWcpEwSRodkcAzXNlR7zDNNZZ/MACbtw27bjLLR2kWPlWSNAxWWmBB9knDZU9w8GHM/q9AMw93f34FOj3A/2+Du4n8Pnwv8MM1/J1hzWwAmFIgRkFypNTBNOKImXGykM/tWaBykFNWgRH+YU0UEKtjA85QFZa4nypVJP7PhzXrN/HdORC3NSkqNzcfeutY4P538Z14OoXKQW43e/j7UcOpaW+PedndpV1vZOgt4RFpXzE2Vb89cQyWXQkA/RtK7K1ur5Oi892srFatghsUMuMk4MogXNTqKm4puyMM0AM+r3nwaA7RUJp59DzBzzXJ3LkVQQ/V1XqXJHaycoix24BuLmnHVLmlufCWQdEd/UAMSt4urcdU8bWbVV7fH5ZiOX5mrywKMTiharEd0RXaMBGDsJo4+kegvXyUEMXB+BPs4vSoyDzy/l6EJKszrkPF6hL2tnWWnVSoGqgc0ExzHV8HNKrTUw6LOw/3XjwmBY6c7iurI5OIE6Mjh4FOPrP0JGQGtmuTh5oPIwL+Mb+5nOHDr2NdeVu/d7o6MQXsH+weLz5wEk1sOPRnFjCJdZEG69gxGj4WA7P9HvUFfxgzM20rqzE3NhKi+PGlvHLVsdtXVltaQUWHP0RuNd6rpPmn8GsgBWVzQyeqEa9Fn0KM7j9wqnBpp5pzhOo+PTQZ7tGXCM5NT42iTg5Nh5InIPdH1zwp7nCBOfTBa0nV9r30kShfk53a9jxO3hA+WQ0D+iHNMtorhFy3yvglYSUi5q2KGWCwly6hAr+TlT3ZE1gYGFi3XsxqReHn3gz6/urYMQVsYoCNaFPVbOtYP4Ug4GviKFPydMsStzjT2jqGufXpqryo002NRoK7G6SbanmVAdqcSH10OaI1uzsaEkk7GTi8bdU9yR5Z9PGZj26V5l6EnSzIZTaYuyN2GElpKki7yY7E0k7yf4DBT4vIHicY2BkYGAA4mY/8a54fpuvDNwsDCBwh/u4BzLNwsAMojgYmEAUAOWJByAAeJxjYGRgYG7438AQw8IAAkCSkQEV8AEARxQCd3icY2FgYGAhAwMABsgAOQAAAAAAACAASgCEAK4BAAFGAZoCFAJeAoACvALeA0YAAHicY2BkYGDgYwhgYGMAASYg5gJCBob/YD4DABIeAXsAeJxlj01OwzAQhV/6B6QSqqhgh+QFYgEo/RGrblhUavdddN+mTpsqiSPHrdQDcB6OwAk4AtyAO/BIJ5s2lsffvHljTwDc4Acejt8t95E9XDI7cg0XuBeuU38QbpBfhJto41W4Rf1N2MczpsJtdGF5g9e4YvaEd2EPHXwI13CNT+E69S/hBvlbuIk7/Aq30PHqwj7mXle4jUcv9sdWL5xeqeVBxaHJIpM5v4KZXu+Sha3S6pxrW8QmU4OgX0lTnWlb3VPs10PnIhVZk6oJqzpJjMqt2erQBRvn8lGvF4kehCblWGP+tsYCjnEFhSUOjDFCGGSIyujoO1Vm9K+xQ8Jee1Y9zed0WxTU/3OFAQL0z1xTurLSeTpPgT1fG1J1dCtuy56UNJFezUkSskJe1rZUQuoBNmVXjhF6XNGJPyhnSP8ACVpuyAAAAHicbY5BDoIwEEU7iiIqGKMrE72BCw3xFp6hGdtBmpQWaQl6eyEY3PBX89/LZIZNWJ8lG08CE5hCADOYQwgLiGAJK1hDDAlsWNLQg19u3GkSnuTqVzVlPrrXmgttHQVd3eW2oBKfxFGgpOLDr+l2YN5a7VqyHwi9RY6mHa7pfzVTBo3oWPhSVCo0cYYPxR319w9KWMO7J2zttTLEXdFKrER+GlUFan2WtjHHMa2Mr6ysBTH2BbrjWAw=) format("woff"), url(data:font/ttf;base64,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AScmBgc3PgE3MhYUBiImNDYCAJHBAwPBkZHBAwPBkXukAwOke3ukAwOkhBsjAQQVAgQCKhAFHB4RHiECBhUEBQgJIA0GESdCEhgYIxkYAtUDwZGRwQMDwZGRwTADpHt7pAMDpHt7pNYbGhEIDkoHFwgZAQgXCwkeKBZKDSMKBwQFFwcNdxkkGBkjGQAAAAASAN4AAQAAAAAAAAAVAAAAAQAAAAAAAQAIABUAAQAAAAAAAgAHAB0AAQAAAAAAAwAIACQAAQAAAAAABAAIACwAAQAAAAAABQALADQAAQAAAAAABgAIAD8AAQAAAAAACgArAEcAAQAAAAAACwATAHIAAwABBAkAAAAqAIUAAwABBAkAAQAQAK8AAwABBAkAAgAOAL8AAwABBAkAAwAQAM0AAwABBAkABAAQAN0AAwABBAkABQAWAO0AAwABBAkABgAQAQMAAwABBAkACgBWARMAAwABBAkACwAmAWkKQ3JlYXRlZCBieSBpY29uZm9udAppY29uZm9udFJlZ3VsYXJpY29uZm9udGljb25mb250VmVyc2lvbiAxLjBpY29uZm9udEdlbmVyYXRlZCBieSBzdmcydHRmIGZyb20gRm9udGVsbG8gcHJvamVjdC5odHRwOi8vZm9udGVsbG8uY29tAAoAQwByAGUAYQB0AGUAZAAgAGIAeQAgAGkAYwBvAG4AZgBvAG4AdAAKAGkAYwBvAG4AZgBvAG4AdABSAGUAZwB1AGwAYQByAGkAYwBvAG4AZgBvAG4AdABpAGMAbwBuAGYAbwBuAHQAVgBlAHIAcwBpAG8AbgAgADEALgAwAGkAYwBvAG4AZgBvAG4AdABHAGUAbgBlAHIAYQB0AGUAZAAgAGIAeQAgAHMAdgBnADIAdAB0AGYAIABmAHIAbwBtACAARgBvAG4AdABlAGwAbABvACAAcAByAG8AagBlAGMAdAAuAGgAdAB0AHAAOgAvAC8AZgBvAG4AdABlAGwAbABvAC4AYwBvAG0AAAAAAgAAAAAAAAAKAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAOAQIBAwEEAQUBBgEHAQgBCQEKAQsBDAENAQ4BDwAOd2ViXzE2X3NsZWN0ZWQLd2ViXzE2X2xlZnQJTXVsX2Nsb3NlBGxlZnQTaG9tZXBhZ2VfYWNhZGVteV8yNBFob21lcGFnZV90b29sc18yNBRob21lcGFnZV9leGNoYW5nZV8yNBNob21lcGFnZV9maW5hbmNlXzI0B3FpZXBpYW4NZmFiaV9zZWxlY3RlZBppY29uX3dlYl9vdXRsaW5lX3NtX3NlYXJjaB5pY29uX3dlYl9vdXRsaW5lX3NtX3NtYWxsLWRvd24daWNvbl93ZWJfb3V0bGluZV9zbV9pbnRyb2R1Y2UAAA==) format("truetype")
}

.iconfont {
    font-family: iconfont !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.icon-web_16_slected:before {
    content: "\ec0c"
}

.icon-web_16_left:before {
    content: "\eb73"
}

.icon-Mul_close:before {
    content: "\ebad"
}

.icon-left:before {
    content: "\e6b6"
}

.icon-homepage_academy_24:before {
    content: "\ebfe"
}

.icon-homepage_tools_24:before {
    content: "\ec00"
}

.icon-homepage_exchange_24:before {
    content: "\ec01"
}

.icon-homepage_finance_24:before {
    content: "\ec02"
}

.icon-qiepian:before {
    content: "\ec03"
}

.icon-fabi_selected:before {
    content: "\e9e9"
}

.icon-icon_web_outline_sm_search:before {
    content: "\eadb"
}

.icon-icon_web_outline_sm_small-down:before {
    content: "\eade"
}

.icon-icon_web_outline_sm_introduce:before {
    content: "\eae0"
}

.home-main .google-play {
    display: inline-block;
    width: 98px;
    height: 24px;
    background: url('../imgs/home-img.png') 0 0/98px 49px no-repeat
}

.home-main .apple-store {
    display: inline-block;
    width: 92px;
    height: 24px;
    background: url('../imgs/home-img.png') left -27px/106px 51px no-repeat
}

.home-main .icon-home_official {
    display: inline-block;
    width: 20px;
    height: 20px;
    background: url('../imgs/home-icon.png') -21px -42px/83px 62px no-repeat
}

@media (min-width: 768px) {
    .home-main .google-play {
        display: inline-block;
        width: 101px;
        height: 24px;
        background: url('../imgs/home-img.png') 0 0/101px 49px no-repeat
    }

    .home-main .apple-store {
        display: inline-block;
        width: 92px;
        height: 24px;
        background: url('../imgs/home-img.png') left -27px/106px 51px no-repeat
    }

    .home-main .home_qr_code {
        display: inline-block;
        width: 22px;
        height: 22px;
        background: url('../imgs/home-icon.png') -23px top/91px 68px no-repeat
    }

    .home-main .icon-home_official {
        display: inline-block;
        width: 18px;
        height: 18px;
        background: url('../imgs/home-icon.png') -19px -38px/74px 56px no-repeat
    }
}

.account-container {
    position: relative
}

.account-container .drop-list {
    z-index: 1;
    background: #fff;
    position: absolute;
    top: 64px;
    left: 0;
    width: 100%;
    -webkit-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .15);
    border-radius: 4px;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 180px
}

.account-container .drop-list .drop-item {
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, .25);
    line-height: 20px;
    padding: 8px 12px;
    cursor: pointer;
    word-break: break-all
}

.account-container .drop-list .drop-item .icon {
    color: #ced3dc;
    font-size: 12px;
    display: inline-block;
    margin-right: 6px
}

.account-container .drop-list .drop-item .quick-part {
    color: rgba(0, 0, 0, .85)
}

@media (max-width: 767px) {
    .account-container .drop-list {
        top: 50px
    }
}

.okui-label {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

.okui-label.top-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.okui-label.top-between {
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.okui-label-text {
    color: var(--okd-input-label-color);
    font-weight: 500;
    margin-bottom: 4px
}

.okui-label-action {
    color: var(--okd-input-action-color);
    font-weight: 500;
    margin-bottom: 4px;
    cursor: pointer
}

.okui-label.label-xs .okui-label-text {
    font-size: var(--okd-input-xs-label-font-size);
    line-height: var(--okd-input-xs-label-line-height)
}

.okui-label.label-xs .okui-label-action {
    font-size: var(--okd-input-xs-action-font-size);
    line-height: var(--okd-input-xs-action-line-height)
}

.okui-label.label-xs .okui-label-place {
    min-height: var(--okd-input-xs-label-line-height)
}

.okui-label.label-sm .okui-label-text {
    font-size: var(--okd-input-sm-label-font-size);
    line-height: var(--okd-input-sm-label-line-height)
}

.okui-label.label-sm .okui-label-action {
    font-size: var(--okd-input-sm-action-font-size);
    line-height: var(--okd-input-sm-action-line-height)
}

.okui-label.label-sm .okui-label-place {
    min-height: var(--okd-input-sm-label-line-height)
}

.okui-label.label-md .okui-label-text {
    font-size: var(--okd-input-md-label-font-size);
    line-height: var(--okd-input-md-label-line-height)
}

.okui-label.label-md .okui-label-action {
    font-size: var(--okd-input-md-action-font-size);
    line-height: var(--okd-input-md-action-line-height)
}

.okui-label.label-md .okui-label-place {
    min-height: var(--okd-input-md-label-line-height)
}

.okui-input {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start
}

.okui-input * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.okui-input .okui-input-box {
    -webkit-transition: border-color .3s, -webkit-box-shadow .3s;
    transition: border-color .3s, -webkit-box-shadow .3s;
    transition: border-color .3s, box-shadow .3s;
    transition: border-color .3s, box-shadow .3s, -webkit-box-shadow .3s;
    border: thin solid var(--okd-input-default-border-color);
    background: var(--okd-input-default-background);
    -webkit-box-shadow: var(--okd-input-default-shadow);
    box-shadow: var(--okd-input-default-shadow);
    width: 100%
}

.okui-input-prefix, .okui-input-suffix, .okui-input .okui-input-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.okui-input-prefix, .okui-input-suffix {
    -ms-flex-negative: 1;
    flex-shrink: 1;
    white-space: nowrap
}

.okui-input-input {
    height: 100%;
    width: 100%;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    outline: none;
    border: none;
    background: transparent;
    font-family: inherit;
    color: var(--okd-input-default-text-color)
}

.okui-input-input::-webkit-input-placeholder {
    color: var(--okd-input-default-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-default-placeholder-color)
}

.okui-input-input:-moz-placeholder {
    opacity: 1;
    color: var(--okd-input-default-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-default-placeholder-color)
}

.okui-input-input::-ms-input-placeholder {
    color: var(--okd-input-default-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-default-placeholder-color)
}

.okui-input-input:-webkit-autofill {
    border: none;
    -webkit-box-shadow: 0 0 0 30px var(--okd-input-default-background) inset;
    -webkit-text-fill-color: var(--okd-input-default-text-color) !important
}

.okui-input-input.ta {
    -webkit-box-shadow: none;
    box-shadow: none;
    outline: none;
    resize: none
}

.okui-input-tips-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    width: 100%
}

.okui-input-error {
    display: none;
    color: var(--okd-input-error-tips-color)
}

.okui-input-tips {
    display: inline-block;
    color: var(--okd-input-tips-text-color)
}

.okui-input-help-text {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    text-align: right;
    color: var(--okd-input-tips-text-color)
}

.okui-input.input-xs .okui-input-box {
    border-radius: var(--okd-input-xs-border-radius);
    padding: 0 8px;
    height: var(--okd-input-xs-height)
}

.okui-input.input-xs .okui-input-box.auto-size {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--okd-input-xs-height)
}

.okui-input.input-xs .okui-input-box.no-padding-left {
    padding-left: 0
}

.okui-input.input-xs .okui-input-box.no-padding-right {
    padding-right: 0
}

.okui-input.input-xs .okui-input-box.ta {
    padding: 8px;
    height: 100%
}

.okui-input.input-xs .okui-input-input {
    padding: calc((var(--okd-input-xs-height) - var(--okd-input-xs-text-font-size) - 4px) / 2) 0;
    font-size: var(--okd-input-xs-text-font-size)
}

.okui-input.input-xs .okui-input-input::-webkit-input-placeholder {
    font-size: var(--okd-input-xs-text-font-size);
    text-overflow: ellipsis;
    font-weight: 400
}

.okui-input.input-xs .okui-input-input:-moz-placeholder {
    font-size: var(--okd-input-xs-text-font-size);
    text-overflow: ellipsis;
    font-weight: 400
}

.okui-input.input-xs .okui-input-input::-ms-input-placeholder {
    font-size: var(--okd-input-xs-text-font-size);
    text-overflow: ellipsis;
    font-weight: 400
}

.okui-input.input-xs .okui-input-input.ta {
    padding: 0
}

.okui-input.input-xs.okui-input-place-mode .okui-input-tips-box {
    min-height: calc(var(--okd-input-xs-tip-line-height) + 4px)
}

.okui-input.input-xs .okui-input-error {
    margin-top: 4px;
    font-size: var(--okd-input-xs-error-font-size);
    line-height: var(--okd-input-xs-error-line-height)
}

.okui-input.input-xs .okui-input-help-text, .okui-input.input-xs .okui-input-tips {
    margin-top: 4px;
    font-size: var(--okd-input-xs-tip-font-size);
    line-height: var(--okd-input-xs-tip-line-height)
}

.okui-input.input-sm .okui-input-box {
    border-radius: var(--okd-input-sm-border-radius);
    padding: 0 8px;
    height: var(--okd-input-sm-height)
}

.okui-input.input-sm .okui-input-box.auto-size {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--okd-input-sm-height)
}

.okui-input.input-sm .okui-input-box.no-padding-left {
    padding-left: 0
}

.okui-input.input-sm .okui-input-box.no-padding-right {
    padding-right: 0
}

.okui-input.input-sm .okui-input-box.ta {
    padding: 8px;
    height: 100%
}

.okui-input.input-sm .okui-input-input {
    padding: calc((var(--okd-input-sm-height) - var(--okd-input-sm-text-font-size) - 4px) / 2) 0;
    font-size: var(--okd-input-sm-text-font-size)
}

.okui-input.input-sm .okui-input-input::-webkit-input-placeholder {
    font-size: var(--okd-input-sm-text-font-size);
    text-overflow: ellipsis;
    font-weight: 400
}

.okui-input.input-sm .okui-input-input:-moz-placeholder {
    font-size: var(--okd-input-sm-text-font-size);
    text-overflow: ellipsis;
    font-weight: 400
}

.okui-input.input-sm .okui-input-input::-ms-input-placeholder {
    font-size: var(--okd-input-sm-text-font-size);
    text-overflow: ellipsis;
    font-weight: 400
}

.okui-input.input-sm .okui-input-input.ta {
    padding: 0
}

.okui-input.input-sm.okui-input-place-mode .okui-input-tips-box {
    min-height: calc(var(--okd-input-sm-tip-line-height) + 4px)
}

.okui-input.input-sm .okui-input-error {
    margin-top: 4px;
    font-size: var(--okd-input-sm-error-font-size);
    line-height: var(--okd-input-sm-error-line-height)
}

.okui-input.input-sm .okui-input-help-text, .okui-input.input-sm .okui-input-tips {
    margin-top: 4px;
    font-size: var(--okd-input-sm-tip-font-size);
    line-height: var(--okd-input-sm-tip-line-height)
}

.okui-input.input-md .okui-input-box {
    border-radius: var(--okd-input-md-border-radius);
    padding: 0 8px;
    height: var(--okd-input-md-height)
}

.okui-input.input-md .okui-input-box.auto-size {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    min-height: var(--okd-input-md-height)
}

.okui-input.input-md .okui-input-box.no-padding-left {
    padding-left: 0
}

.okui-input.input-md .okui-input-box.no-padding-right {
    padding-right: 0
}

.okui-input.input-md .okui-input-box.ta {
    padding: 8px;
    height: 100%
}

.okui-input.input-md .okui-input-input {
    padding: calc((var(--okd-input-md-height) - var(--okd-input-md-text-font-size) - 4px) / 2) 0;
    font-size: var(--okd-input-md-text-font-size)
}

.okui-input.input-md .okui-input-input::-webkit-input-placeholder {
    font-size: var(--okd-input-md-text-font-size);
    text-overflow: ellipsis;
    font-weight: 400
}

.okui-input.input-md .okui-input-input:-moz-placeholder {
    font-size: var(--okd-input-md-text-font-size);
    text-overflow: ellipsis;
    font-weight: 400
}

.okui-input.input-md .okui-input-input::-ms-input-placeholder {
    font-size: var(--okd-input-md-text-font-size);
    text-overflow: ellipsis;
    font-weight: 400
}

.okui-input.input-md .okui-input-input.ta {
    padding: 0
}

.okui-input.input-md.okui-input-place-mode .okui-input-tips-box {
    min-height: calc(var(--okd-input-md-tip-line-height) + 4px)
}

.okui-input.input-md .okui-input-error {
    margin-top: 4px;
    font-size: var(--okd-input-md-error-font-size);
    line-height: var(--okd-input-md-error-line-height)
}

.okui-input.input-md .okui-input-help-text, .okui-input.input-md .okui-input-tips {
    margin-top: 4px;
    font-size: var(--okd-input-md-tip-font-size);
    line-height: var(--okd-input-md-tip-line-height)
}

.okui-input.hover, .okui-input:hover {
    cursor: text
}

.okui-input.hover .okui-input-box, .okui-input:hover .okui-input-box {
    border: thin solid var(--okd-input-hover-border-color);
    background: var(--okd-input-hover-background);
    -webkit-box-shadow: var(--okd-input-hover-shadow);
    box-shadow: var(--okd-input-hover-shadow)
}

.okui-input.hover .okui-input-box .okui-input-input, .okui-input:hover .okui-input-box .okui-input-input {
    caret-color: var(--okd-input-hover-caret-color);
    color: var(--okd-input-hover-text-color);
    -webkit-text-fill-color: var(--okd-input-hover-text-color)
}

.okui-input.hover .okui-input-box .okui-input-input::-webkit-input-placeholder, .okui-input:hover .okui-input-box .okui-input-input::-webkit-input-placeholder {
    color: var(--okd-input-hover-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-hover-placeholder-color)
}

.okui-input.hover .okui-input-box .okui-input-input:-moz-placeholder, .okui-input:hover .okui-input-box .okui-input-input:-moz-placeholder {
    opacity: 1;
    color: var(--okd-input-hover-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-hover-placeholder-color)
}

.okui-input.hover .okui-input-box .okui-input-input::-ms-input-placeholder, .okui-input:hover .okui-input-box .okui-input-input::-ms-input-placeholder {
    color: var(--okd-input-hover-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-hover-placeholder-color)
}

.okui-input.focus .okui-input-box {
    border: thin solid var(--okd-input-focus-border-color);
    background: var(--okd-input-focus-background);
    -webkit-box-shadow: var(--okd-input-focus-shadow);
    box-shadow: var(--okd-input-focus-shadow)
}

.okui-input.focus .okui-input-box .okui-input-input {
    caret-color: var(--okd-input-focus-caret-color);
    color: var(--okd-input-focus-text-color);
    -webkit-text-fill-color: var(--okd-input-focus-text-color)
}

.okui-input.focus .okui-input-box .okui-input-input::-webkit-input-placeholder {
    color: var(--okd-input-focus-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-focus-placeholder-color)
}

.okui-input.focus .okui-input-box .okui-input-input:-moz-placeholder {
    opacity: 1;
    color: var(--okd-input-focus-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-focus-placeholder-color)
}

.okui-input.focus .okui-input-box .okui-input-input::-ms-input-placeholder {
    color: var(--okd-input-focus-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-focus-placeholder-color)
}

.okui-input.disabled {
    cursor: not-allowed
}

.okui-input.disabled .okui-input-box {
    border: thin solid var(--okd-input-disabled-border-color);
    background: var(--okd-input-disabled-background);
    -webkit-box-shadow: var(--okd-input-disabled-shadow);
    box-shadow: var(--okd-input-disabled-shadow)
}

.okui-input.disabled .okui-input-box .okui-input-input {
    caret-color: var(--okd-input-disabled-caret-color);
    color: var(--okd-input-disabled-text-color);
    -webkit-text-fill-color: var(--okd-input-disabled-text-color)
}

.okui-input.disabled .okui-input-box .okui-input-input::-webkit-input-placeholder {
    color: var(--okd-input-disabled-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-disabled-placeholder-color)
}

.okui-input.disabled .okui-input-box .okui-input-input:-moz-placeholder {
    opacity: 1;
    color: var(--okd-input-disabled-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-disabled-placeholder-color)
}

.okui-input.disabled .okui-input-box .okui-input-input::-ms-input-placeholder {
    color: var(--okd-input-disabled-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-disabled-placeholder-color)
}

.okui-input.disabled .okui-input-box .okui-input-input {
    cursor: not-allowed;
    opacity: 1
}

.okui-input.error .okui-input-box {
    border: thin solid var(--okd-input-error-border-color);
    background: var(--okd-input-error-background);
    -webkit-box-shadow: var(--okd-input-error-shadow);
    box-shadow: var(--okd-input-error-shadow)
}

.okui-input.error .okui-input-box .okui-input-input {
    caret-color: var(--okd-input-error-caret-color);
    color: var(--okd-input-error-text-color);
    -webkit-text-fill-color: var(--okd-input-error-text-color)
}

.okui-input.error .okui-input-box .okui-input-input::-webkit-input-placeholder {
    color: var(--okd-input-error-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-error-placeholder-color)
}

.okui-input.error .okui-input-box .okui-input-input:-moz-placeholder {
    opacity: 1;
    color: var(--okd-input-error-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-error-placeholder-color)
}

.okui-input.error .okui-input-box .okui-input-input::-ms-input-placeholder {
    color: var(--okd-input-error-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-error-placeholder-color)
}

.okui-input.error .okui-input-error {
    display: inline-block
}

.okui-input.no-border .okui-input-box {
    border: thin solid transparent;
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none
}

.okui-input .input-circle {
    border-radius: 100px !important
}

.okui-input-prefix {
    height: 100%
}

.okui-input-prefix .prefix-icon {
    color: var(--okd-input-icon-color)
}

.okui-input-prefix .select {
    padding-right: 8px
}

.okui-input-suffix {
    height: 100%
}

.okui-input-suffix .suffix-icon {
    color: var(--okd-input-icon-color)
}

.okui-input-suffix .clean-icon {
    cursor: pointer
}

.okui-input-suffix .error-icon {
    color: var(--okd-input-error-tips-color)
}

.okui-input.input-xs .okui-input-prefix .prefix-icon {
    margin-left: 0;
    margin-right: var(--okd-input-xs-icon-margin);
    font-size: var(--okd-input-xs-icon-size)
}

.okui-input.input-xs .okui-input-suffix .suffix-icon {
    margin-left: var(--okd-input-xs-icon-margin);
    margin-right: 0;
    font-size: var(--okd-input-xs-icon-size)
}

.okui-input.input-sm .okui-input-prefix .prefix-icon {
    margin-left: 0;
    margin-right: var(--okd-input-sm-icon-margin);
    font-size: var(--okd-input-sm-icon-size)
}

.okui-input.input-sm .okui-input-suffix .suffix-icon {
    margin-left: var(--okd-input-sm-icon-margin);
    margin-right: 0;
    font-size: var(--okd-input-sm-icon-size)
}

.okui-input.input-md .okui-input-prefix .prefix-icon {
    margin-left: 0;
    margin-right: var(--okd-input-md-icon-margin);
    font-size: var(--okd-input-md-icon-size)
}

.okui-input.input-md .okui-input-suffix .suffix-icon {
    margin-left: var(--okd-input-md-icon-margin);
    margin-right: 0;
    font-size: var(--okd-input-md-icon-size)
}

.okui-input:hover .okui-input-number-suffix:not(.operation-always) {
    opacity: 1
}

.okui-input-number-suffix {
    margin-left: 6px;
    -webkit-transition: opacity .5s;
    transition: opacity .5s;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 100%;
    width: 24px;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    border-left: 1px solid var(--okd-input-default-border-color);
    cursor: pointer;
    line-height: 0
}

.okui-input-number-suffix:not(.operation-always) {
    opacity: 0
}

.okui-input-number-suffix-part {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--okd-input-number-default-add-icon-background)
}

.okui-input-number-suffix-part .icon {
    font-size: 13px;
    color: var(--okd-input-number-default-add-icon-color)
}

.okui-input-number-suffix-part .hover, .okui-input-number-suffix-part:hover {
    background: var(--okd-input-number-hover-add-icon-background)
}

.okui-input-number-suffix-part .hover .icon, .okui-input-number-suffix-part:hover .icon {
    color: var(--okd-input-number-hover-add-icon-color)
}

.okui-input-number-suffix-part .active, .okui-input-number-suffix-part:active {
    background: var(--okd-input-number-active-add-icon-background)
}

.okui-input-number-suffix-part .active .icon, .okui-input-number-suffix-part:active .icon {
    color: var(--okd-input-number-active-add-icon-color)
}

.okui-input-number-suffix-part-disabled, .okui-input-number-suffix-part .disabled {
    background: var(--okd-input-number-disabled-add-icon-background);
    cursor: not-allowed
}

.okui-input-number-suffix-part-disabled .icon, .okui-input-number-suffix-part-disabled:hover .icon, .okui-input-number-suffix-part .disabled .icon, .okui-input-number-suffix-part .disabled:hover .icon {
    color: var(--okd-input-number-disabled-add-icon-color)
}

.okui-input-number-suffix-line {
    width: 100%;
    height: 1px;
    background: var(--okd-input-default-border-color)
}

.okui-input-number-suffix .up {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.okui-input-code-btn {
    color: var(--okd-input-code-common-btn-color);
    cursor: pointer
}

.okui-input-code-btn.disabled {
    color: var(--okd-input-code-common-btn-disabled-color);
    cursor: not-allowed
}

.okui-input-count-down {
    color: var(--okd-input-code-common-count-color)
}

.okui-input input::-webkit-inner-spin-button, .okui-input input::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0
}

.okui-input input[type=number] {
    -moz-appearance: textfield
}

.okui-input.input-xs .okui-input-code-btn {
    font-size: var(--okd-input-code-xs-btn-font-size);
    line-height: var(--okd-input-code-xs-btn-line-height)
}

.okui-input.input-xs .okui-input-count-down {
    font-size: var(--okd-input-code-xs-count-font-size);
    line-height: var(--okd-input-code-xs-count-line-height)
}

.okui-input.input-sm .okui-input-code-btn {
    font-size: var(--okd-input-code-sm-btn-font-size);
    line-height: var(--okd-input-code-sm-btn-line-height)
}

.okui-input.input-sm .okui-input-count-down {
    font-size: var(--okd-input-code-sm-count-font-size);
    line-height: var(--okd-input-code-sm-count-line-height)
}

.okui-input.input-md .okui-input-code-btn {
    font-size: var(--okd-input-code-md-btn-font-size);
    line-height: var(--okd-input-code-md-btn-line-height)
}

.okui-input.input-md .okui-input-count-down {
    font-size: var(--okd-input-code-md-count-font-size);
    line-height: var(--okd-input-code-md-count-line-height)
}

.okui-input-switch-icon.icon {
    cursor: pointer
}

.okui-input-prefix .okui-input-search-prefix-icon {
    font-size: var(--okd-input-search-prefix-icon-size);
    margin-right: 8px;
    color: var(--okd-input-search-prefix-icon-color);
    cursor: pointer
}

.okui-input-suffix .okui-input-search-suffix-icon {
    font-size: var(--okd-input-search-suffix-icon-size);
    color: var(--okd-input-search-suffix-icon-color);
    cursor: pointer
}

.okui-input-search.okui-input .okui-input-error {
    color: var(--okd-input-search-error-tips-color)
}

.okui-input-search.okui-input .okui-input-box {
    background-color: var(--okd-input-search-default-background);
    border-color: var(--okd-input-search-default-border-color);
    -webkit-box-shadow: var(--okd-input-search-default-shadow);
    box-shadow: var(--okd-input-search-default-shadow)
}

.okui-input-search.okui-input .okui-input-input {
    color: var(--okd-input-search-default-text-color)
}

.okui-input-search.okui-input .okui-input-input::-webkit-input-placeholder {
    color: var(--okd-input-search-default-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-default-placeholder-color)
}

.okui-input-search.okui-input .okui-input-input:-moz-placeholder {
    opacity: 1;
    color: var(--okd-input-search-default-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-default-placeholder-color)
}

.okui-input-search.okui-input .okui-input-input::-ms-input-placeholder {
    color: var(--okd-input-search-default-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-default-placeholder-color)
}

.okui-input-search.okui-input.hover .okui-input-box, .okui-input-search.okui-input:hover .okui-input-box {
    border: thin solid var(--okd-input-search-hover-border-color);
    background: var(--okd-input-search-hover-background);
    -webkit-box-shadow: var(--okd-input-search-hover-shadow);
    box-shadow: var(--okd-input-search-hover-shadow)
}

.okui-input-search.okui-input.hover .okui-input-box .okui-input-input, .okui-input-search.okui-input:hover .okui-input-box .okui-input-input {
    caret-color: var(--okd-input-search-hover-caret-color);
    color: var(--okd-input-search-hover-text-color);
    -webkit-text-fill-color: var(--okd-input-search-hover-text-color)
}

.okui-input-search.okui-input.hover .okui-input-box .okui-input-input::-webkit-input-placeholder, .okui-input-search.okui-input:hover .okui-input-box .okui-input-input::-webkit-input-placeholder {
    color: var(--okd-input-search-hover-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-hover-placeholder-color)
}

.okui-input-search.okui-input.hover .okui-input-box .okui-input-input:-moz-placeholder, .okui-input-search.okui-input:hover .okui-input-box .okui-input-input:-moz-placeholder {
    opacity: 1;
    color: var(--okd-input-search-hover-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-hover-placeholder-color)
}

.okui-input-search.okui-input.hover .okui-input-box .okui-input-input::-ms-input-placeholder, .okui-input-search.okui-input:hover .okui-input-box .okui-input-input::-ms-input-placeholder {
    color: var(--okd-input-search-hover-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-hover-placeholder-color)
}

.okui-input-search.okui-input.focus .okui-input-box {
    border: thin solid var(--okd-input-search-focus-border-color);
    background: var(--okd-input-search-focus-background);
    -webkit-box-shadow: var(--okd-input-search-focus-shadow);
    box-shadow: var(--okd-input-search-focus-shadow)
}

.okui-input-search.okui-input.focus .okui-input-box .okui-input-input {
    caret-color: var(--okd-input-search-focus-caret-color);
    color: var(--okd-input-search-focus-text-color);
    -webkit-text-fill-color: var(--okd-input-search-focus-text-color)
}

.okui-input-search.okui-input.focus .okui-input-box .okui-input-input::-webkit-input-placeholder {
    color: var(--okd-input-search-focus-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-focus-placeholder-color)
}

.okui-input-search.okui-input.focus .okui-input-box .okui-input-input:-moz-placeholder {
    opacity: 1;
    color: var(--okd-input-search-focus-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-focus-placeholder-color)
}

.okui-input-search.okui-input.focus .okui-input-box .okui-input-input::-ms-input-placeholder {
    color: var(--okd-input-search-focus-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-focus-placeholder-color)
}

.okui-input-search.okui-input.disabled .okui-input-box {
    border: thin solid var(--okd-input-search-disabled-border-color);
    background: var(--okd-input-search-disabled-background);
    -webkit-box-shadow: var(--okd-input-search-disabled-shadow);
    box-shadow: var(--okd-input-search-disabled-shadow)
}

.okui-input-search.okui-input.disabled .okui-input-box .okui-input-input {
    caret-color: var(--okd-input-search-disabled-caret-color);
    color: var(--okd-input-search-disabled-text-color);
    -webkit-text-fill-color: var(--okd-input-search-disabled-text-color)
}

.okui-input-search.okui-input.disabled .okui-input-box .okui-input-input::-webkit-input-placeholder {
    color: var(--okd-input-search-disabled-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-disabled-placeholder-color)
}

.okui-input-search.okui-input.disabled .okui-input-box .okui-input-input:-moz-placeholder {
    opacity: 1;
    color: var(--okd-input-search-disabled-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-disabled-placeholder-color)
}

.okui-input-search.okui-input.disabled .okui-input-box .okui-input-input::-ms-input-placeholder {
    color: var(--okd-input-search-disabled-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-disabled-placeholder-color)
}

.okui-input-search.okui-input.error .okui-input-box {
    border: thin solid var(--okd-input-search-error-border-color);
    background: var(--okd-input-search-error-background);
    -webkit-box-shadow: var(--okd-input-search-error-shadow);
    box-shadow: var(--okd-input-search-error-shadow)
}

.okui-input-search.okui-input.error .okui-input-box .okui-input-input {
    caret-color: var(--okd-input-search-error-caret-color);
    color: var(--okd-input-search-error-text-color);
    -webkit-text-fill-color: var(--okd-input-search-error-text-color)
}

.okui-input-search.okui-input.error .okui-input-box .okui-input-input::-webkit-input-placeholder {
    color: var(--okd-input-search-error-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-error-placeholder-color)
}

.okui-input-search.okui-input.error .okui-input-box .okui-input-input:-moz-placeholder {
    opacity: 1;
    color: var(--okd-input-search-error-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-error-placeholder-color)
}

.okui-input-search.okui-input.error .okui-input-box .okui-input-input::-ms-input-placeholder {
    color: var(--okd-input-search-error-placeholder-color);
    -webkit-text-fill-color: var(--okd-input-search-error-placeholder-color)
}

@font-face {
    font-family: iconfont;
    src: url("data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAW0AAsAAAAAC7QAAAVlAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACEAgqIZIgOATYCJAMkCxQABCAFhG0HgTcbhQojETZ7UbKR/SMxJjJnHZ9iHHfHDypFlhU+K7LosiaaaDwTAbUG27v7f1QlmSQR7XzDJDFMJ3QSJBLTTeSm8t5PAd86L0kl7G4K6GYktXD63yf41su1BACd8cfybcmjz+1t4IOz2afxdbpKVcgK2Z+/36u/A6R27NkHm9K5P+q8ZTft82y2gUQn0IAKdGxbRteqF9YJfIiAxkaaLs6dv2CF5rs3HN6rswLOD5iNw+4d2zZoeI9ThBiDhpFV3AML4auSeDzewFn198Mbo0NDojLBSy3ZOm+za8+rN5dTnWur0111ft3IxhElEobWLCFcCE87JellQyWN/WoW1qMlP0/iefXi2Mvyutnrdq/xNyM5u8I52pNQSBXVmpQRNWhnoLxTKvefV0FqSqT7YxrqU7fIEXlxNEYDlT9GOBry8hBH4HUzxtK9bkdiVIzvRzgSby575iI1kvnWtH5YThwBNXNR5OYg7Rx7dejUtFPXNm27NWzTrEWnorA073gmOqRe2QrRCzHQ4MlQAJ93FGBePWHzMDMq01qYVUi9QpDxWh2rtebMtp74n9DLS3ZM95VdUxjqNZxlwK7JwQBxASWA4wQRqjcXNNHSCEiWlkIZCllaGSlI3ay5QBJEMq0yga2F0i38grRkU4GUf3Nz9gsC3U+YYwCeYRZrUo+2k4UBLbQkeEEVXunOaqxf+RmCpqZmmtwqk03aphW+vj4bg53Ewn0P5yM6iJZZyHmZ5+eCp6cA+mxrDqv3r5nbw8KDm3C6ZlRYS2JqTAW1/5uy2AU4/LaahNgvLwi8KeiLKJ+giCczT5NYXDyVs5NzdE03iTYODzeONvktoIJGpkn0b9dN0t2rtEMWF2MIUSLmPWlQ/xCs7qHq5qbqob7JkCFD682D7Xq7L39natmHsHtW7qoBHVjPFA3+OGKVlrIQ7n/CkCFbHLH88ROfalV1traTExxlJg2bNFfDeqbkKRD3w8vLSUrgGU7wwi5z42c+LVAlFLsSg13YP21XLJdwLXN+TdYT0jMRvhBKuPi/WD58GZsWVsw83SxbWm5kg+1sg2W/Z2R4KSJsm9L3VnZz8r4gzYjucrny2dlY8wy2OB+B9csKyHjGJriOjEBLy43/X6Deo3uGXMaCrh7yV4/irn576ya/5BjVcJWWTiKSo4x6yBjVj45mqaYWcebmcTkCKlE5bAfzZAUWtFHAPb66fPVwkXfCcr4JIQOJ6moikAy5Y8iWX10dSISQdz7ZfLqqCFcJ/ZaYkIjlzf5+1os0ae9y+jqWIzXkS+l52qre8EJ6n/ZC/BN7ka+kJ2kepJ/xZsbKupBq4jmFNnLxOh5d12Lqt4ZNNofCux8PJfXFq09DkdiuE6ZcIecjpOe3gEbFRtMPUZWzK4W9kUlSSURjPo1zJKu1+/kmtlNGRdBQOxOiBrpB0lBfYSEdCqUmxkKlobtnQGNDvB7eRBtkVygaYbBvgKClH4iauwpJS7/CQvoHpfb+odIy7EJjq8LtCZvoH+zJI6FknMS4ERZSVEIin2iN31AvvCSrV7V8IRVbKPqmc1a+YkTKY5ey1AOzEopSEC9wOfQ+iUxpjsCNYc6ztlV+t2ggha0TcxAkMTQRRhvZ0QJJpEKzE9fPv0HagidRSK8fxy+IFHbpQq/RxRC+UozVa11aFkvagGmJIqhbwyQQXmgK8rwsEbL/enMIsIZJUZLNtHQ0FZea8iPCtF4AjeHnaRRiSKEIZahCg9AwNAqNVYdQEphD8KngqO8txBpqwpCWWGu/yab2+qIE6X3NZGXUHh8idBzrTLi0uLqmhunOq9dbyxtcg5dB8oC3qcESeDwrx2OJ3doCAAA=") format("woff2"), url(/cdn/assets/okfe/login/0.9.3/fonts/iconfont.6713055.woff) format("woff"), url(/cdn/assets/okfe/login/0.9.3/fonts/iconfont.dac773e.ttf) format("truetype")
}

.iconsearch:before {
    content: "\E873"
}

.iconclosebg:before {
    content: "\E606"
}

.iconicn-c-remove-glyph-lg:before {
    content: "\EA25"
}

.iconsmall-triangle:before {
    content: "\EBA6"
}

.iconicn-b-preview-glyph-md:before {
    content: "\EA0D"
}

.iconicn-preview-glyph-md:before {
    content: "\EA15"
}

.submit-btn-container .login-btn {
    width: 100%;
    height: 40px;
    border-radius: 2px;
    font-size: 14px;
    font-weight: 600;
    margin-top: 16px;
    line-height: 22px
}

@media (max-width: 767px) {
    .submit-btn-container .login-btn {
        height: 48px;
        line-height: 30px !important
    }
}

.okui-btn {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    font-weight: 500;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-touch-action: manipulation;
    touch-action: manipulation;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    -webkit-transition: all .3s cubic-bezier(.165, .84, .44, 1);
    transition: all .3s cubic-bezier(.165, .84, .44, 1);
    position: relative;
    border-style: solid;
    outline: none;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-decoration: none;
    -webkit-tap-highlight-color: transparent;
    -webkit-appearance: none;
    font-family: inherit
}

.okui-btn.btn-fill-highlight {
    color: var(--okd-button-fill-highlight-default-font-color);
    background: var(--okd-button-fill-highlight-default-background);
    border-color: var(--okd-button-fill-highlight-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-highlight-default-shadow);
    box-shadow: var(--okd-button-fill-highlight-default-shadow);
    border-width: var(--okd-button-fill-highlight-border-size)
}

.okui-btn.btn-fill-highlight.hover, .okui-btn.btn-fill-highlight:not(:disabled):hover {
    color: var(--okd-button-fill-highlight-hover-font-color);
    background: var(--okd-button-fill-highlight-hover-background);
    border-color: var(--okd-button-fill-highlight-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-highlight-hover-shadow);
    box-shadow: var(--okd-button-fill-highlight-hover-shadow)
}

.okui-btn.btn-fill-highlight.hover .btn-icon, .okui-btn.btn-fill-highlight:not(:disabled):hover .btn-icon {
    color: var(--okd-button-fill-highlight-hover-icon-color)
}

.okui-btn.btn-fill-highlight.focus, .okui-btn.btn-fill-highlight:not(:disabled):focus {
    color: var(--okd-button-fill-highlight-focus-font-color);
    background: var(--okd-button-fill-highlight-focus-background);
    border-color: var(--okd-button-fill-highlight-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-highlight-focus-shadow);
    box-shadow: var(--okd-button-fill-highlight-focus-shadow)
}

.okui-btn.btn-fill-highlight.focus .btn-icon, .okui-btn.btn-fill-highlight:not(:disabled):focus .btn-icon {
    color: var(--okd-button-fill-highlight-focus-icon-color)
}

.okui-btn.btn-fill-highlight.active, .okui-btn.btn-fill-highlight:not(:disabled):active {
    color: var(--okd-button-fill-highlight-active-font-color);
    background: var(--okd-button-fill-highlight-active-background);
    border-color: var(--okd-button-fill-highlight-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-highlight-active-shadow);
    box-shadow: var(--okd-button-fill-highlight-active-shadow)
}

.okui-btn.btn-fill-highlight.active .btn-icon, .okui-btn.btn-fill-highlight:not(:disabled):active .btn-icon {
    color: var(--okd-button-fill-highlight-active-icon-color)
}

.okui-btn.btn-fill-highlight:not(.loading).btn-disabled, .okui-btn.btn-fill-highlight:not(.loading):disabled {
    color: var(--okd-button-fill-highlight-disabled-font-color);
    background: var(--okd-button-fill-highlight-disabled-background);
    border-color: var(--okd-button-fill-highlight-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-highlight-disabled-shadow);
    box-shadow: var(--okd-button-fill-highlight-disabled-shadow)
}

.okui-btn.btn-fill-highlight:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-fill-highlight:not(.loading):disabled .btn-icon {
    color: var(--okd-button-fill-highlight-disabled-icon-color)
}

.okui-btn.btn-fill-highlight.loading {
    cursor: pointer
}

.okui-btn.btn-fill-highlight .btn-icon {
    color: var(--okd-button-fill-highlight-default-icon-color)
}

.okui-btn.btn-fill-highlight .okui-btn-loader-text {
    color: var(--okd-button-fill-highlight-default-font-color)
}

.okui-btn.btn-fill-highlight.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-fill-highlight-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-fill-highlight.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-fill-highlight-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-fill-highlight.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-fill-highlight-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-fill-highlight.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-fill-highlight-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-fill-highlight.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-fill-highlight-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-fill-highlight.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-fill-highlight-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-fill-primary {
    color: var(--okd-button-fill-primary-default-font-color);
    background: var(--okd-button-fill-primary-default-background);
    border-color: var(--okd-button-fill-primary-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-primary-default-shadow);
    box-shadow: var(--okd-button-fill-primary-default-shadow);
    border-width: var(--okd-button-fill-primary-border-size)
}

.okui-btn.btn-fill-primary.hover, .okui-btn.btn-fill-primary:not(:disabled):hover {
    color: var(--okd-button-fill-primary-hover-font-color);
    background: var(--okd-button-fill-primary-hover-background);
    border-color: var(--okd-button-fill-primary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-primary-hover-shadow);
    box-shadow: var(--okd-button-fill-primary-hover-shadow)
}

.okui-btn.btn-fill-primary.hover .btn-icon, .okui-btn.btn-fill-primary:not(:disabled):hover .btn-icon {
    color: var(--okd-button-fill-primary-hover-icon-color)
}

.okui-btn.btn-fill-primary.focus, .okui-btn.btn-fill-primary:not(:disabled):focus {
    color: var(--okd-button-fill-primary-focus-font-color);
    background: var(--okd-button-fill-primary-focus-background);
    border-color: var(--okd-button-fill-primary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-primary-focus-shadow);
    box-shadow: var(--okd-button-fill-primary-focus-shadow)
}

.okui-btn.btn-fill-primary.focus .btn-icon, .okui-btn.btn-fill-primary:not(:disabled):focus .btn-icon {
    color: var(--okd-button-fill-primary-focus-icon-color)
}

.okui-btn.btn-fill-primary.active, .okui-btn.btn-fill-primary:not(:disabled):active {
    color: var(--okd-button-fill-primary-active-font-color);
    background: var(--okd-button-fill-primary-active-background);
    border-color: var(--okd-button-fill-primary-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-primary-active-shadow);
    box-shadow: var(--okd-button-fill-primary-active-shadow)
}

.okui-btn.btn-fill-primary.active .btn-icon, .okui-btn.btn-fill-primary:not(:disabled):active .btn-icon {
    color: var(--okd-button-fill-primary-active-icon-color)
}

.okui-btn.btn-fill-primary:not(.loading).btn-disabled, .okui-btn.btn-fill-primary:not(.loading):disabled {
    color: var(--okd-button-fill-primary-disabled-font-color);
    background: var(--okd-button-fill-primary-disabled-background);
    border-color: var(--okd-button-fill-primary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-primary-disabled-shadow);
    box-shadow: var(--okd-button-fill-primary-disabled-shadow)
}

.okui-btn.btn-fill-primary:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-fill-primary:not(.loading):disabled .btn-icon {
    color: var(--okd-button-fill-primary-disabled-icon-color)
}

.okui-btn.btn-fill-primary.loading {
    cursor: pointer
}

.okui-btn.btn-fill-primary .btn-icon {
    color: var(--okd-button-fill-primary-default-icon-color)
}

.okui-btn.btn-fill-primary .okui-btn-loader-text {
    color: var(--okd-button-fill-primary-default-font-color)
}

.okui-btn.btn-fill-primary.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-fill-primary-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-fill-primary.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-fill-primary-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-fill-primary.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-fill-primary-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-fill-primary.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-fill-primary-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-fill-primary.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-fill-primary-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-fill-primary.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-fill-primary-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-fill-red {
    color: var(--okd-button-fill-red-default-font-color);
    background: var(--okd-button-fill-red-default-background);
    border-color: var(--okd-button-fill-red-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-red-default-shadow);
    box-shadow: var(--okd-button-fill-red-default-shadow);
    border-width: var(--okd-button-fill-red-border-size)
}

.okui-btn.btn-fill-red.hover, .okui-btn.btn-fill-red:not(:disabled):hover {
    color: var(--okd-button-fill-red-hover-font-color);
    background: var(--okd-button-fill-red-hover-background);
    border-color: var(--okd-button-fill-red-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-red-hover-shadow);
    box-shadow: var(--okd-button-fill-red-hover-shadow)
}

.okui-btn.btn-fill-red.hover .btn-icon, .okui-btn.btn-fill-red:not(:disabled):hover .btn-icon {
    color: var(--okd-button-fill-red-hover-icon-color)
}

.okui-btn.btn-fill-red.focus, .okui-btn.btn-fill-red:not(:disabled):focus {
    color: var(--okd-button-fill-red-focus-font-color);
    background: var(--okd-button-fill-red-focus-background);
    border-color: var(--okd-button-fill-red-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-red-focus-shadow);
    box-shadow: var(--okd-button-fill-red-focus-shadow)
}

.okui-btn.btn-fill-red.focus .btn-icon, .okui-btn.btn-fill-red:not(:disabled):focus .btn-icon {
    color: var(--okd-button-fill-red-focus-icon-color)
}

.okui-btn.btn-fill-red.active, .okui-btn.btn-fill-red:not(:disabled):active {
    color: var(--okd-button-fill-red-active-font-color);
    background: var(--okd-button-fill-red-active-background);
    border-color: var(--okd-button-fill-red-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-red-active-shadow);
    box-shadow: var(--okd-button-fill-red-active-shadow)
}

.okui-btn.btn-fill-red.active .btn-icon, .okui-btn.btn-fill-red:not(:disabled):active .btn-icon {
    color: var(--okd-button-fill-red-active-icon-color)
}

.okui-btn.btn-fill-red:not(.loading).btn-disabled, .okui-btn.btn-fill-red:not(.loading):disabled {
    color: var(--okd-button-fill-red-disabled-font-color);
    background: var(--okd-button-fill-red-disabled-background);
    border-color: var(--okd-button-fill-red-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-red-disabled-shadow);
    box-shadow: var(--okd-button-fill-red-disabled-shadow)
}

.okui-btn.btn-fill-red:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-fill-red:not(.loading):disabled .btn-icon {
    color: var(--okd-button-fill-red-disabled-icon-color)
}

.okui-btn.btn-fill-red.loading {
    cursor: pointer
}

.okui-btn.btn-fill-red .btn-icon {
    color: var(--okd-button-fill-red-default-icon-color)
}

.okui-btn.btn-fill-red .okui-btn-loader-text {
    color: var(--okd-button-fill-red-default-font-color)
}

.okui-btn.btn-fill-red.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-fill-red-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-fill-red.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-fill-red-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-fill-red.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-fill-red-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-fill-red.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-fill-red-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-fill-red.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-fill-red-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-fill-red.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-fill-red-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-fill-green {
    color: var(--okd-button-fill-green-default-font-color);
    background: var(--okd-button-fill-green-default-background);
    border-color: var(--okd-button-fill-green-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-green-default-shadow);
    box-shadow: var(--okd-button-fill-green-default-shadow);
    border-width: var(--okd-button-fill-green-border-size)
}

.okui-btn.btn-fill-green.hover, .okui-btn.btn-fill-green:not(:disabled):hover {
    color: var(--okd-button-fill-green-hover-font-color);
    background: var(--okd-button-fill-green-hover-background);
    border-color: var(--okd-button-fill-green-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-green-hover-shadow);
    box-shadow: var(--okd-button-fill-green-hover-shadow)
}

.okui-btn.btn-fill-green.hover .btn-icon, .okui-btn.btn-fill-green:not(:disabled):hover .btn-icon {
    color: var(--okd-button-fill-green-hover-icon-color)
}

.okui-btn.btn-fill-green.focus, .okui-btn.btn-fill-green:not(:disabled):focus {
    color: var(--okd-button-fill-green-focus-font-color);
    background: var(--okd-button-fill-green-focus-background);
    border-color: var(--okd-button-fill-green-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-green-focus-shadow);
    box-shadow: var(--okd-button-fill-green-focus-shadow)
}

.okui-btn.btn-fill-green.focus .btn-icon, .okui-btn.btn-fill-green:not(:disabled):focus .btn-icon {
    color: var(--okd-button-fill-green-focus-icon-color)
}

.okui-btn.btn-fill-green.active, .okui-btn.btn-fill-green:not(:disabled):active {
    color: var(--okd-button-fill-green-active-font-color);
    background: var(--okd-button-fill-green-active-background);
    border-color: var(--okd-button-fill-green-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-green-active-shadow);
    box-shadow: var(--okd-button-fill-green-active-shadow)
}

.okui-btn.btn-fill-green.active .btn-icon, .okui-btn.btn-fill-green:not(:disabled):active .btn-icon {
    color: var(--okd-button-fill-green-active-icon-color)
}

.okui-btn.btn-fill-green:not(.loading).btn-disabled, .okui-btn.btn-fill-green:not(.loading):disabled {
    color: var(--okd-button-fill-green-disabled-font-color);
    background: var(--okd-button-fill-green-disabled-background);
    border-color: var(--okd-button-fill-green-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-green-disabled-shadow);
    box-shadow: var(--okd-button-fill-green-disabled-shadow)
}

.okui-btn.btn-fill-green:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-fill-green:not(.loading):disabled .btn-icon {
    color: var(--okd-button-fill-green-disabled-icon-color)
}

.okui-btn.btn-fill-green.loading {
    cursor: pointer
}

.okui-btn.btn-fill-green .btn-icon {
    color: var(--okd-button-fill-green-default-icon-color)
}

.okui-btn.btn-fill-green .okui-btn-loader-text {
    color: var(--okd-button-fill-green-default-font-color)
}

.okui-btn.btn-fill-green.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-fill-green-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-fill-green.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-fill-green-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-fill-green.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-fill-green-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-fill-green.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-fill-green-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-fill-green.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-fill-green-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-fill-green.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-fill-green-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-fill-secondary {
    color: var(--okd-button-fill-secondary-default-font-color);
    background: var(--okd-button-fill-secondary-default-background);
    border-color: var(--okd-button-fill-secondary-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-secondary-default-shadow);
    box-shadow: var(--okd-button-fill-secondary-default-shadow);
    border-width: var(--okd-button-fill-secondary-border-size)
}

.okui-btn.btn-fill-secondary.hover, .okui-btn.btn-fill-secondary:not(:disabled):hover {
    color: var(--okd-button-fill-secondary-hover-font-color);
    background: var(--okd-button-fill-secondary-hover-background);
    border-color: var(--okd-button-fill-secondary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-secondary-hover-shadow);
    box-shadow: var(--okd-button-fill-secondary-hover-shadow)
}

.okui-btn.btn-fill-secondary.hover .btn-icon, .okui-btn.btn-fill-secondary:not(:disabled):hover .btn-icon {
    color: var(--okd-button-fill-secondary-hover-icon-color)
}

.okui-btn.btn-fill-secondary.focus, .okui-btn.btn-fill-secondary:not(:disabled):focus {
    color: var(--okd-button-fill-secondary-focus-font-color);
    background: var(--okd-button-fill-secondary-focus-background);
    border-color: var(--okd-button-fill-secondary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-secondary-focus-shadow);
    box-shadow: var(--okd-button-fill-secondary-focus-shadow)
}

.okui-btn.btn-fill-secondary.focus .btn-icon, .okui-btn.btn-fill-secondary:not(:disabled):focus .btn-icon {
    color: var(--okd-button-fill-secondary-focus-icon-color)
}

.okui-btn.btn-fill-secondary.active, .okui-btn.btn-fill-secondary:not(:disabled):active {
    color: var(--okd-button-fill-secondary-active-font-color);
    background: var(--okd-button-fill-secondary-active-background);
    border-color: var(--okd-button-fill-secondary-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-secondary-active-shadow);
    box-shadow: var(--okd-button-fill-secondary-active-shadow)
}

.okui-btn.btn-fill-secondary.active .btn-icon, .okui-btn.btn-fill-secondary:not(:disabled):active .btn-icon {
    color: var(--okd-button-fill-secondary-active-icon-color)
}

.okui-btn.btn-fill-secondary:not(.loading).btn-disabled, .okui-btn.btn-fill-secondary:not(.loading):disabled {
    color: var(--okd-button-fill-secondary-disabled-font-color);
    background: var(--okd-button-fill-secondary-disabled-background);
    border-color: var(--okd-button-fill-secondary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-secondary-disabled-shadow);
    box-shadow: var(--okd-button-fill-secondary-disabled-shadow)
}

.okui-btn.btn-fill-secondary:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-fill-secondary:not(.loading):disabled .btn-icon {
    color: var(--okd-button-fill-secondary-disabled-icon-color)
}

.okui-btn.btn-fill-secondary.loading {
    cursor: pointer
}

.okui-btn.btn-fill-secondary .btn-icon {
    color: var(--okd-button-fill-secondary-default-icon-color)
}

.okui-btn.btn-fill-secondary .okui-btn-loader-text {
    color: var(--okd-button-fill-secondary-default-font-color)
}

.okui-btn.btn-fill-secondary.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-fill-secondary-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-fill-secondary.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-fill-secondary-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-fill-secondary.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-fill-secondary-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-fill-secondary.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-fill-secondary-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-fill-secondary.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-fill-secondary-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-fill-secondary.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-fill-secondary-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-fill-grey {
    color: var(--okd-button-fill-grey-default-font-color);
    background: var(--okd-button-fill-grey-default-background);
    border-color: var(--okd-button-fill-grey-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-grey-default-shadow);
    box-shadow: var(--okd-button-fill-grey-default-shadow);
    border-width: var(--okd-button-fill-grey-border-size)
}

.okui-btn.btn-fill-grey.hover, .okui-btn.btn-fill-grey:not(:disabled):hover {
    color: var(--okd-button-fill-grey-hover-font-color);
    background: var(--okd-button-fill-grey-hover-background);
    border-color: var(--okd-button-fill-grey-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-grey-hover-shadow);
    box-shadow: var(--okd-button-fill-grey-hover-shadow)
}

.okui-btn.btn-fill-grey.hover .btn-icon, .okui-btn.btn-fill-grey:not(:disabled):hover .btn-icon {
    color: var(--okd-button-fill-grey-hover-icon-color)
}

.okui-btn.btn-fill-grey.focus, .okui-btn.btn-fill-grey:not(:disabled):focus {
    color: var(--okd-button-fill-grey-focus-font-color);
    background: var(--okd-button-fill-grey-focus-background);
    border-color: var(--okd-button-fill-grey-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-grey-focus-shadow);
    box-shadow: var(--okd-button-fill-grey-focus-shadow)
}

.okui-btn.btn-fill-grey.focus .btn-icon, .okui-btn.btn-fill-grey:not(:disabled):focus .btn-icon {
    color: var(--okd-button-fill-grey-focus-icon-color)
}

.okui-btn.btn-fill-grey.active, .okui-btn.btn-fill-grey:not(:disabled):active {
    color: var(--okd-button-fill-grey-active-font-color);
    background: var(--okd-button-fill-grey-active-background);
    border-color: var(--okd-button-fill-grey-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-grey-active-shadow);
    box-shadow: var(--okd-button-fill-grey-active-shadow)
}

.okui-btn.btn-fill-grey.active .btn-icon, .okui-btn.btn-fill-grey:not(:disabled):active .btn-icon {
    color: var(--okd-button-fill-grey-active-icon-color)
}

.okui-btn.btn-fill-grey:not(.loading).btn-disabled, .okui-btn.btn-fill-grey:not(.loading):disabled {
    color: var(--okd-button-fill-grey-disabled-font-color);
    background: var(--okd-button-fill-grey-disabled-background);
    border-color: var(--okd-button-fill-grey-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-grey-disabled-shadow);
    box-shadow: var(--okd-button-fill-grey-disabled-shadow)
}

.okui-btn.btn-fill-grey:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-fill-grey:not(.loading):disabled .btn-icon {
    color: var(--okd-button-fill-grey-disabled-icon-color)
}

.okui-btn.btn-fill-grey.loading {
    cursor: pointer
}

.okui-btn.btn-fill-grey .btn-icon {
    color: var(--okd-button-fill-grey-default-icon-color)
}

.okui-btn.btn-fill-grey .okui-btn-loader-text {
    color: var(--okd-button-fill-grey-default-font-color)
}

.okui-btn.btn-fill-grey.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-fill-grey-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-fill-grey.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-fill-grey-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-fill-grey.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-fill-grey-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-fill-grey.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-fill-grey-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-fill-grey.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-fill-grey-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-fill-grey.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-fill-grey-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-outline-primary {
    color: var(--okd-button-outline-primary-default-font-color);
    background: var(--okd-button-outline-primary-default-background);
    border-color: var(--okd-button-outline-primary-default-border-color);
    -webkit-box-shadow: var(--okd-button-outline-primary-default-shadow);
    box-shadow: var(--okd-button-outline-primary-default-shadow);
    border-width: var(--okd-button-outline-primary-border-size)
}

.okui-btn.btn-outline-primary.hover, .okui-btn.btn-outline-primary:not(:disabled):hover {
    color: var(--okd-button-outline-primary-hover-font-color);
    background: var(--okd-button-outline-primary-hover-background);
    border-color: var(--okd-button-outline-primary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-outline-primary-hover-shadow);
    box-shadow: var(--okd-button-outline-primary-hover-shadow)
}

.okui-btn.btn-outline-primary.hover .btn-icon, .okui-btn.btn-outline-primary:not(:disabled):hover .btn-icon {
    color: var(--okd-button-outline-primary-hover-icon-color)
}

.okui-btn.btn-outline-primary.focus, .okui-btn.btn-outline-primary:not(:disabled):focus {
    color: var(--okd-button-outline-primary-focus-font-color);
    background: var(--okd-button-outline-primary-focus-background);
    border-color: var(--okd-button-outline-primary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-outline-primary-focus-shadow);
    box-shadow: var(--okd-button-outline-primary-focus-shadow)
}

.okui-btn.btn-outline-primary.focus .btn-icon, .okui-btn.btn-outline-primary:not(:disabled):focus .btn-icon {
    color: var(--okd-button-outline-primary-focus-icon-color)
}

.okui-btn.btn-outline-primary.active, .okui-btn.btn-outline-primary:not(:disabled):active {
    color: var(--okd-button-outline-primary-active-font-color);
    background: var(--okd-button-outline-primary-active-background);
    border-color: var(--okd-button-outline-primary-active-border-color);
    -webkit-box-shadow: var(--okd-button-outline-primary-active-shadow);
    box-shadow: var(--okd-button-outline-primary-active-shadow)
}

.okui-btn.btn-outline-primary.active .btn-icon, .okui-btn.btn-outline-primary:not(:disabled):active .btn-icon {
    color: var(--okd-button-outline-primary-active-icon-color)
}

.okui-btn.btn-outline-primary:not(.loading).btn-disabled, .okui-btn.btn-outline-primary:not(.loading):disabled {
    color: var(--okd-button-outline-primary-disabled-font-color);
    background: var(--okd-button-outline-primary-disabled-background);
    border-color: var(--okd-button-outline-primary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-outline-primary-disabled-shadow);
    box-shadow: var(--okd-button-outline-primary-disabled-shadow)
}

.okui-btn.btn-outline-primary:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-outline-primary:not(.loading):disabled .btn-icon {
    color: var(--okd-button-outline-primary-disabled-icon-color)
}

.okui-btn.btn-outline-primary.loading {
    cursor: pointer
}

.okui-btn.btn-outline-primary .btn-icon {
    color: var(--okd-button-outline-primary-default-icon-color)
}

.okui-btn.btn-outline-primary .okui-btn-loader-text {
    color: var(--okd-button-outline-primary-default-font-color)
}

.okui-btn.btn-outline-primary.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-outline-primary-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-outline-primary.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-outline-primary-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-outline-primary.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-outline-primary-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-outline-primary.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-outline-primary-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-outline-primary.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-outline-primary-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-outline-primary.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-outline-primary-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-outline-secondary {
    color: var(--okd-button-outline-secondary-default-font-color);
    background: var(--okd-button-outline-secondary-default-background);
    border-color: var(--okd-button-outline-secondary-default-border-color);
    -webkit-box-shadow: var(--okd-button-outline-secondary-default-shadow);
    box-shadow: var(--okd-button-outline-secondary-default-shadow);
    border-width: var(--okd-button-outline-secondary-border-size)
}

.okui-btn.btn-outline-secondary.hover, .okui-btn.btn-outline-secondary:not(:disabled):hover {
    color: var(--okd-button-outline-secondary-hover-font-color);
    background: var(--okd-button-outline-secondary-hover-background);
    border-color: var(--okd-button-outline-secondary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-outline-secondary-hover-shadow);
    box-shadow: var(--okd-button-outline-secondary-hover-shadow)
}

.okui-btn.btn-outline-secondary.hover .btn-icon, .okui-btn.btn-outline-secondary:not(:disabled):hover .btn-icon {
    color: var(--okd-button-outline-secondary-hover-icon-color)
}

.okui-btn.btn-outline-secondary.focus, .okui-btn.btn-outline-secondary:not(:disabled):focus {
    color: var(--okd-button-outline-secondary-focus-font-color);
    background: var(--okd-button-outline-secondary-focus-background);
    border-color: var(--okd-button-outline-secondary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-outline-secondary-focus-shadow);
    box-shadow: var(--okd-button-outline-secondary-focus-shadow)
}

.okui-btn.btn-outline-secondary.focus .btn-icon, .okui-btn.btn-outline-secondary:not(:disabled):focus .btn-icon {
    color: var(--okd-button-outline-secondary-focus-icon-color)
}

.okui-btn.btn-outline-secondary.active, .okui-btn.btn-outline-secondary:not(:disabled):active {
    color: var(--okd-button-outline-secondary-active-font-color);
    background: var(--okd-button-outline-secondary-active-background);
    border-color: var(--okd-button-outline-secondary-active-border-color);
    -webkit-box-shadow: var(--okd-button-outline-secondary-active-shadow);
    box-shadow: var(--okd-button-outline-secondary-active-shadow)
}

.okui-btn.btn-outline-secondary.active .btn-icon, .okui-btn.btn-outline-secondary:not(:disabled):active .btn-icon {
    color: var(--okd-button-outline-secondary-active-icon-color)
}

.okui-btn.btn-outline-secondary:not(.loading).btn-disabled, .okui-btn.btn-outline-secondary:not(.loading):disabled {
    color: var(--okd-button-outline-secondary-disabled-font-color);
    background: var(--okd-button-outline-secondary-disabled-background);
    border-color: var(--okd-button-outline-secondary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-outline-secondary-disabled-shadow);
    box-shadow: var(--okd-button-outline-secondary-disabled-shadow)
}

.okui-btn.btn-outline-secondary:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-outline-secondary:not(.loading):disabled .btn-icon {
    color: var(--okd-button-outline-secondary-disabled-icon-color)
}

.okui-btn.btn-outline-secondary.loading {
    cursor: pointer
}

.okui-btn.btn-outline-secondary .btn-icon {
    color: var(--okd-button-outline-secondary-default-icon-color)
}

.okui-btn.btn-outline-secondary .okui-btn-loader-text {
    color: var(--okd-button-outline-secondary-default-font-color)
}

.okui-btn.btn-outline-secondary.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-outline-secondary-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-outline-secondary.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-outline-secondary-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-outline-secondary.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-outline-secondary-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-outline-secondary.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-outline-secondary-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-outline-secondary.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-outline-secondary-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-outline-secondary.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-outline-secondary-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-text-primary {
    color: var(--okd-button-text-primary-default-font-color);
    background: var(--okd-button-text-primary-default-background);
    border-color: var(--okd-button-text-primary-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-primary-default-shadow);
    box-shadow: var(--okd-button-text-primary-default-shadow);
    border-width: var(--okd-button-text-primary-border-size)
}

.okui-btn.btn-text-primary.hover, .okui-btn.btn-text-primary:not(:disabled):hover {
    color: var(--okd-button-text-primary-hover-font-color);
    background: var(--okd-button-text-primary-hover-background);
    border-color: var(--okd-button-text-primary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-primary-hover-shadow);
    box-shadow: var(--okd-button-text-primary-hover-shadow)
}

.okui-btn.btn-text-primary.hover .btn-icon, .okui-btn.btn-text-primary:not(:disabled):hover .btn-icon {
    color: var(--okd-button-text-primary-hover-icon-color)
}

.okui-btn.btn-text-primary.focus, .okui-btn.btn-text-primary:not(:disabled):focus {
    color: var(--okd-button-text-primary-focus-font-color);
    background: var(--okd-button-text-primary-focus-background);
    border-color: var(--okd-button-text-primary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-primary-focus-shadow);
    box-shadow: var(--okd-button-text-primary-focus-shadow)
}

.okui-btn.btn-text-primary.focus .btn-icon, .okui-btn.btn-text-primary:not(:disabled):focus .btn-icon {
    color: var(--okd-button-text-primary-focus-icon-color)
}

.okui-btn.btn-text-primary.active, .okui-btn.btn-text-primary:not(:disabled):active {
    color: var(--okd-button-text-primary-active-font-color);
    background: var(--okd-button-text-primary-active-background);
    border-color: var(--okd-button-text-primary-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-primary-active-shadow);
    box-shadow: var(--okd-button-text-primary-active-shadow)
}

.okui-btn.btn-text-primary.active .btn-icon, .okui-btn.btn-text-primary:not(:disabled):active .btn-icon {
    color: var(--okd-button-text-primary-active-icon-color)
}

.okui-btn.btn-text-primary:not(.loading).btn-disabled, .okui-btn.btn-text-primary:not(.loading):disabled {
    color: var(--okd-button-text-primary-disabled-font-color);
    background: var(--okd-button-text-primary-disabled-background);
    border-color: var(--okd-button-text-primary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-primary-disabled-shadow);
    box-shadow: var(--okd-button-text-primary-disabled-shadow)
}

.okui-btn.btn-text-primary:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-text-primary:not(.loading):disabled .btn-icon {
    color: var(--okd-button-text-primary-disabled-icon-color)
}

.okui-btn.btn-text-primary.loading {
    cursor: pointer
}

.okui-btn.btn-text-primary .btn-icon {
    color: var(--okd-button-text-primary-default-icon-color)
}

.okui-btn.btn-text-primary .okui-btn-loader-text {
    color: var(--okd-button-text-primary-default-font-color)
}

.okui-btn.btn-text-primary.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-text-primary-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-text-primary.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-text-primary-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-text-primary.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-text-primary-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-text-primary.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-text-primary-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-text-primary.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-text-primary-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-text-primary.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-text-primary-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-text-secondary {
    color: var(--okd-button-text-secondary-default-font-color);
    background: var(--okd-button-text-secondary-default-background);
    border-color: var(--okd-button-text-secondary-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-secondary-default-shadow);
    box-shadow: var(--okd-button-text-secondary-default-shadow);
    border-width: var(--okd-button-text-secondary-border-size)
}

.okui-btn.btn-text-secondary.hover, .okui-btn.btn-text-secondary:not(:disabled):hover {
    color: var(--okd-button-text-secondary-hover-font-color);
    background: var(--okd-button-text-secondary-hover-background);
    border-color: var(--okd-button-text-secondary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-secondary-hover-shadow);
    box-shadow: var(--okd-button-text-secondary-hover-shadow)
}

.okui-btn.btn-text-secondary.hover .btn-icon, .okui-btn.btn-text-secondary:not(:disabled):hover .btn-icon {
    color: var(--okd-button-text-secondary-hover-icon-color)
}

.okui-btn.btn-text-secondary.focus, .okui-btn.btn-text-secondary:not(:disabled):focus {
    color: var(--okd-button-text-secondary-focus-font-color);
    background: var(--okd-button-text-secondary-focus-background);
    border-color: var(--okd-button-text-secondary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-secondary-focus-shadow);
    box-shadow: var(--okd-button-text-secondary-focus-shadow)
}

.okui-btn.btn-text-secondary.focus .btn-icon, .okui-btn.btn-text-secondary:not(:disabled):focus .btn-icon {
    color: var(--okd-button-text-secondary-focus-icon-color)
}

.okui-btn.btn-text-secondary.active, .okui-btn.btn-text-secondary:not(:disabled):active {
    color: var(--okd-button-text-secondary-active-font-color);
    background: var(--okd-button-text-secondary-active-background);
    border-color: var(--okd-button-text-secondary-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-secondary-active-shadow);
    box-shadow: var(--okd-button-text-secondary-active-shadow)
}

.okui-btn.btn-text-secondary.active .btn-icon, .okui-btn.btn-text-secondary:not(:disabled):active .btn-icon {
    color: var(--okd-button-text-secondary-active-icon-color)
}

.okui-btn.btn-text-secondary:not(.loading).btn-disabled, .okui-btn.btn-text-secondary:not(.loading):disabled {
    color: var(--okd-button-text-secondary-disabled-font-color);
    background: var(--okd-button-text-secondary-disabled-background);
    border-color: var(--okd-button-text-secondary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-secondary-disabled-shadow);
    box-shadow: var(--okd-button-text-secondary-disabled-shadow)
}

.okui-btn.btn-text-secondary:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-text-secondary:not(.loading):disabled .btn-icon {
    color: var(--okd-button-text-secondary-disabled-icon-color)
}

.okui-btn.btn-text-secondary.loading {
    cursor: pointer
}

.okui-btn.btn-text-secondary .btn-icon {
    color: var(--okd-button-text-secondary-default-icon-color)
}

.okui-btn.btn-text-secondary .okui-btn-loader-text {
    color: var(--okd-button-text-secondary-default-font-color)
}

.okui-btn.btn-text-secondary.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-text-secondary-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-text-secondary.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-text-secondary-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-text-secondary.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-text-secondary-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-text-secondary.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-text-secondary-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-text-secondary.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-text-secondary-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-text-secondary.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-text-secondary-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-text-red {
    color: var(--okd-button-text-red-default-font-color);
    background: var(--okd-button-text-red-default-background);
    border-color: var(--okd-button-text-red-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-red-default-shadow);
    box-shadow: var(--okd-button-text-red-default-shadow);
    border-width: var(--okd-button-text-red-border-size)
}

.okui-btn.btn-text-red.hover, .okui-btn.btn-text-red:not(:disabled):hover {
    color: var(--okd-button-text-red-hover-font-color);
    background: var(--okd-button-text-red-hover-background);
    border-color: var(--okd-button-text-red-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-red-hover-shadow);
    box-shadow: var(--okd-button-text-red-hover-shadow)
}

.okui-btn.btn-text-red.hover .btn-icon, .okui-btn.btn-text-red:not(:disabled):hover .btn-icon {
    color: var(--okd-button-text-red-hover-icon-color)
}

.okui-btn.btn-text-red.focus, .okui-btn.btn-text-red:not(:disabled):focus {
    color: var(--okd-button-text-red-focus-font-color);
    background: var(--okd-button-text-red-focus-background);
    border-color: var(--okd-button-text-red-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-red-focus-shadow);
    box-shadow: var(--okd-button-text-red-focus-shadow)
}

.okui-btn.btn-text-red.focus .btn-icon, .okui-btn.btn-text-red:not(:disabled):focus .btn-icon {
    color: var(--okd-button-text-red-focus-icon-color)
}

.okui-btn.btn-text-red.active, .okui-btn.btn-text-red:not(:disabled):active {
    color: var(--okd-button-text-red-active-font-color);
    background: var(--okd-button-text-red-active-background);
    border-color: var(--okd-button-text-red-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-red-active-shadow);
    box-shadow: var(--okd-button-text-red-active-shadow)
}

.okui-btn.btn-text-red.active .btn-icon, .okui-btn.btn-text-red:not(:disabled):active .btn-icon {
    color: var(--okd-button-text-red-active-icon-color)
}

.okui-btn.btn-text-red:not(.loading).btn-disabled, .okui-btn.btn-text-red:not(.loading):disabled {
    color: var(--okd-button-text-red-disabled-font-color);
    background: var(--okd-button-text-red-disabled-background);
    border-color: var(--okd-button-text-red-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-red-disabled-shadow);
    box-shadow: var(--okd-button-text-red-disabled-shadow)
}

.okui-btn.btn-text-red:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-text-red:not(.loading):disabled .btn-icon {
    color: var(--okd-button-text-red-disabled-icon-color)
}

.okui-btn.btn-text-red.loading {
    cursor: pointer
}

.okui-btn.btn-text-red .btn-icon {
    color: var(--okd-button-text-red-default-icon-color)
}

.okui-btn.btn-text-red .okui-btn-loader-text {
    color: var(--okd-button-text-red-default-font-color)
}

.okui-btn.btn-text-red.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-text-red-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-text-red.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-text-red-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-text-red.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-text-red-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-text-red.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-text-red-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-text-red.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-text-red-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-text-red.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-text-red-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-text-green {
    color: var(--okd-button-text-green-default-font-color);
    background: var(--okd-button-text-green-default-background);
    border-color: var(--okd-button-text-green-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-green-default-shadow);
    box-shadow: var(--okd-button-text-green-default-shadow);
    border-width: var(--okd-button-text-green-border-size)
}

.okui-btn.btn-text-green.hover, .okui-btn.btn-text-green:not(:disabled):hover {
    color: var(--okd-button-text-green-hover-font-color);
    background: var(--okd-button-text-green-hover-background);
    border-color: var(--okd-button-text-green-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-green-hover-shadow);
    box-shadow: var(--okd-button-text-green-hover-shadow)
}

.okui-btn.btn-text-green.hover .btn-icon, .okui-btn.btn-text-green:not(:disabled):hover .btn-icon {
    color: var(--okd-button-text-green-hover-icon-color)
}

.okui-btn.btn-text-green.focus, .okui-btn.btn-text-green:not(:disabled):focus {
    color: var(--okd-button-text-green-focus-font-color);
    background: var(--okd-button-text-green-focus-background);
    border-color: var(--okd-button-text-green-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-green-focus-shadow);
    box-shadow: var(--okd-button-text-green-focus-shadow)
}

.okui-btn.btn-text-green.focus .btn-icon, .okui-btn.btn-text-green:not(:disabled):focus .btn-icon {
    color: var(--okd-button-text-green-focus-icon-color)
}

.okui-btn.btn-text-green.active, .okui-btn.btn-text-green:not(:disabled):active {
    color: var(--okd-button-text-green-active-font-color);
    background: var(--okd-button-text-green-active-background);
    border-color: var(--okd-button-text-green-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-green-active-shadow);
    box-shadow: var(--okd-button-text-green-active-shadow)
}

.okui-btn.btn-text-green.active .btn-icon, .okui-btn.btn-text-green:not(:disabled):active .btn-icon {
    color: var(--okd-button-text-green-active-icon-color)
}

.okui-btn.btn-text-green:not(.loading).btn-disabled, .okui-btn.btn-text-green:not(.loading):disabled {
    color: var(--okd-button-text-green-disabled-font-color);
    background: var(--okd-button-text-green-disabled-background);
    border-color: var(--okd-button-text-green-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-green-disabled-shadow);
    box-shadow: var(--okd-button-text-green-disabled-shadow)
}

.okui-btn.btn-text-green:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-text-green:not(.loading):disabled .btn-icon {
    color: var(--okd-button-text-green-disabled-icon-color)
}

.okui-btn.btn-text-green.loading {
    cursor: pointer
}

.okui-btn.btn-text-green .btn-icon {
    color: var(--okd-button-text-green-default-icon-color)
}

.okui-btn.btn-text-green .okui-btn-loader-text {
    color: var(--okd-button-text-green-default-font-color)
}

.okui-btn.btn-text-green.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-text-green-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-text-green.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-text-green-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-text-green.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-text-green-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-text-green.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-text-green-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-text-green.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-text-green-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-text-green.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-text-green-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-text-orange {
    color: var(--okd-button-text-orange-default-font-color);
    background: var(--okd-button-text-orange-default-background);
    border-color: var(--okd-button-text-orange-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-orange-default-shadow);
    box-shadow: var(--okd-button-text-orange-default-shadow);
    border-width: var(--okd-button-text-orange-border-size)
}

.okui-btn.btn-text-orange.hover, .okui-btn.btn-text-orange:not(:disabled):hover {
    color: var(--okd-button-text-orange-hover-font-color);
    background: var(--okd-button-text-orange-hover-background);
    border-color: var(--okd-button-text-orange-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-orange-hover-shadow);
    box-shadow: var(--okd-button-text-orange-hover-shadow)
}

.okui-btn.btn-text-orange.hover .btn-icon, .okui-btn.btn-text-orange:not(:disabled):hover .btn-icon {
    color: var(--okd-button-text-orange-hover-icon-color)
}

.okui-btn.btn-text-orange.focus, .okui-btn.btn-text-orange:not(:disabled):focus {
    color: var(--okd-button-text-orange-focus-font-color);
    background: var(--okd-button-text-orange-focus-background);
    border-color: var(--okd-button-text-orange-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-orange-focus-shadow);
    box-shadow: var(--okd-button-text-orange-focus-shadow)
}

.okui-btn.btn-text-orange.focus .btn-icon, .okui-btn.btn-text-orange:not(:disabled):focus .btn-icon {
    color: var(--okd-button-text-orange-focus-icon-color)
}

.okui-btn.btn-text-orange.active, .okui-btn.btn-text-orange:not(:disabled):active {
    color: var(--okd-button-text-orange-active-font-color);
    background: var(--okd-button-text-orange-active-background);
    border-color: var(--okd-button-text-orange-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-orange-active-shadow);
    box-shadow: var(--okd-button-text-orange-active-shadow)
}

.okui-btn.btn-text-orange.active .btn-icon, .okui-btn.btn-text-orange:not(:disabled):active .btn-icon {
    color: var(--okd-button-text-orange-active-icon-color)
}

.okui-btn.btn-text-orange:not(.loading).btn-disabled, .okui-btn.btn-text-orange:not(.loading):disabled {
    color: var(--okd-button-text-orange-disabled-font-color);
    background: var(--okd-button-text-orange-disabled-background);
    border-color: var(--okd-button-text-orange-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-orange-disabled-shadow);
    box-shadow: var(--okd-button-text-orange-disabled-shadow)
}

.okui-btn.btn-text-orange:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-text-orange:not(.loading):disabled .btn-icon {
    color: var(--okd-button-text-orange-disabled-icon-color)
}

.okui-btn.btn-text-orange.loading {
    cursor: pointer
}

.okui-btn.btn-text-orange .btn-icon {
    color: var(--okd-button-text-orange-default-icon-color)
}

.okui-btn.btn-text-orange .okui-btn-loader-text {
    color: var(--okd-button-text-orange-default-font-color)
}

.okui-btn.btn-text-orange.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-text-orange-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-text-orange.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-text-orange-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-text-orange.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-text-orange-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-text-orange.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-text-orange-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-text-orange.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-text-orange-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-text-orange.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-text-orange-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-text-yellow {
    color: var(--okd-button-text-yellow-default-font-color);
    background: var(--okd-button-text-yellow-default-background);
    border-color: var(--okd-button-text-yellow-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-yellow-default-shadow);
    box-shadow: var(--okd-button-text-yellow-default-shadow);
    border-width: var(--okd-button-text-yellow-border-size)
}

.okui-btn.btn-text-yellow.hover, .okui-btn.btn-text-yellow:not(:disabled):hover {
    color: var(--okd-button-text-yellow-hover-font-color);
    background: var(--okd-button-text-yellow-hover-background);
    border-color: var(--okd-button-text-yellow-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-yellow-hover-shadow);
    box-shadow: var(--okd-button-text-yellow-hover-shadow)
}

.okui-btn.btn-text-yellow.hover .btn-icon, .okui-btn.btn-text-yellow:not(:disabled):hover .btn-icon {
    color: var(--okd-button-text-yellow-hover-icon-color)
}

.okui-btn.btn-text-yellow.focus, .okui-btn.btn-text-yellow:not(:disabled):focus {
    color: var(--okd-button-text-yellow-focus-font-color);
    background: var(--okd-button-text-yellow-focus-background);
    border-color: var(--okd-button-text-yellow-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-yellow-focus-shadow);
    box-shadow: var(--okd-button-text-yellow-focus-shadow)
}

.okui-btn.btn-text-yellow.focus .btn-icon, .okui-btn.btn-text-yellow:not(:disabled):focus .btn-icon {
    color: var(--okd-button-text-yellow-focus-icon-color)
}

.okui-btn.btn-text-yellow.active, .okui-btn.btn-text-yellow:not(:disabled):active {
    color: var(--okd-button-text-yellow-active-font-color);
    background: var(--okd-button-text-yellow-active-background);
    border-color: var(--okd-button-text-yellow-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-yellow-active-shadow);
    box-shadow: var(--okd-button-text-yellow-active-shadow)
}

.okui-btn.btn-text-yellow.active .btn-icon, .okui-btn.btn-text-yellow:not(:disabled):active .btn-icon {
    color: var(--okd-button-text-yellow-active-icon-color)
}

.okui-btn.btn-text-yellow:not(.loading).btn-disabled, .okui-btn.btn-text-yellow:not(.loading):disabled {
    color: var(--okd-button-text-yellow-disabled-font-color);
    background: var(--okd-button-text-yellow-disabled-background);
    border-color: var(--okd-button-text-yellow-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-yellow-disabled-shadow);
    box-shadow: var(--okd-button-text-yellow-disabled-shadow)
}

.okui-btn.btn-text-yellow:not(.loading).btn-disabled .btn-icon, .okui-btn.btn-text-yellow:not(.loading):disabled .btn-icon {
    color: var(--okd-button-text-yellow-disabled-icon-color)
}

.okui-btn.btn-text-yellow.loading {
    cursor: pointer
}

.okui-btn.btn-text-yellow .btn-icon {
    color: var(--okd-button-text-yellow-default-icon-color)
}

.okui-btn.btn-text-yellow .okui-btn-loader-text {
    color: var(--okd-button-text-yellow-default-font-color)
}

.okui-btn.btn-text-yellow.btn-xxs {
    padding: calc(var(--okd-button-xxs-padding-vertical) + 1px - var(--okd-button-text-yellow-border-size)) var(--okd-button-xxs-padding-horizontal)
}

.okui-btn.btn-text-yellow.btn-xs {
    padding: calc(var(--okd-button-xs-padding-vertical) + 1px - var(--okd-button-text-yellow-border-size)) var(--okd-button-xs-padding-horizontal)
}

.okui-btn.btn-text-yellow.btn-sm {
    padding: calc(var(--okd-button-sm-padding-vertical) + 1px - var(--okd-button-text-yellow-border-size)) var(--okd-button-sm-padding-horizontal)
}

.okui-btn.btn-text-yellow.btn-md {
    padding: calc(var(--okd-button-md-padding-vertical) + 1px - var(--okd-button-text-yellow-border-size)) var(--okd-button-md-padding-horizontal)
}

.okui-btn.btn-text-yellow.btn-lg {
    padding: calc(var(--okd-button-lg-padding-vertical) + 1px - var(--okd-button-text-yellow-border-size)) var(--okd-button-lg-padding-horizontal)
}

.okui-btn.btn-text-yellow.btn-xl {
    padding: calc(var(--okd-button-xl-padding-vertical) + 1px - var(--okd-button-text-yellow-border-size)) var(--okd-button-xl-padding-horizontal)
}

.okui-btn.btn-xxs {
    border-radius: var(--okd-button-xxs-border-radius);
    min-width: var(--okd-button-xxs-min-width)
}

.okui-btn.btn-xxs, .okui-btn.btn-xxs .okui-btn-loader-text {
    font-size: var(--okd-button-xxs-font-size);
    line-height: var(--okd-button-xxs-line-height)
}

.okui-btn.btn-xxs .okui-btn-loader-text {
    margin-left: var(--okd-button-xxs-loader-text-margin-left)
}

.okui-btn.btn-xs {
    border-radius: var(--okd-button-xs-border-radius);
    min-width: var(--okd-button-xs-min-width)
}

.okui-btn.btn-xs, .okui-btn.btn-xs .okui-btn-loader-text {
    font-size: var(--okd-button-xs-font-size);
    line-height: var(--okd-button-xs-line-height)
}

.okui-btn.btn-xs .okui-btn-loader-text {
    margin-left: var(--okd-button-xs-loader-text-margin-left)
}

.okui-btn.btn-sm {
    border-radius: var(--okd-button-sm-border-radius);
    min-width: var(--okd-button-sm-min-width)
}

.okui-btn.btn-sm, .okui-btn.btn-sm .okui-btn-loader-text {
    font-size: var(--okd-button-sm-font-size);
    line-height: var(--okd-button-sm-line-height)
}

.okui-btn.btn-sm .okui-btn-loader-text {
    margin-left: var(--okd-button-sm-loader-text-margin-left)
}

.okui-btn.btn-md {
    border-radius: var(--okd-button-md-border-radius);
    min-width: var(--okd-button-md-min-width)
}

.okui-btn.btn-md, .okui-btn.btn-md .okui-btn-loader-text {
    font-size: var(--okd-button-md-font-size);
    line-height: var(--okd-button-md-line-height)
}

.okui-btn.btn-md .okui-btn-loader-text {
    margin-left: var(--okd-button-md-loader-text-margin-left)
}

.okui-btn.btn-lg {
    border-radius: var(--okd-button-lg-border-radius);
    min-width: var(--okd-button-lg-min-width)
}

.okui-btn.btn-lg, .okui-btn.btn-lg .okui-btn-loader-text {
    font-size: var(--okd-button-lg-font-size);
    line-height: var(--okd-button-lg-line-height)
}

.okui-btn.btn-lg .okui-btn-loader-text {
    margin-left: var(--okd-button-lg-loader-text-margin-left)
}

.okui-btn.btn-xl {
    border-radius: var(--okd-button-xl-border-radius);
    min-width: var(--okd-button-xl-min-width)
}

.okui-btn.btn-xl, .okui-btn.btn-xl .okui-btn-loader-text {
    font-size: var(--okd-button-xl-font-size);
    line-height: var(--okd-button-xl-line-height)
}

.okui-btn.btn-xl .okui-btn-loader-text {
    margin-left: var(--okd-button-xl-loader-text-margin-left)
}

.okui-btn:disabled {
    cursor: not-allowed
}

.okui-btn.block {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.okui-btn.btn-circle {
    border-radius: 100px !important
}

.okui-btn .btn-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.okui-btn.loading .btn-content {
    opacity: 0
}

.okui-btn.loading .btn-content-position {
    display: none
}

.okui-btn.loading .okui-btn-loader {
    position: absolute;
    line-height: 0
}

.okui-btn.loading .btn-loader-position-absolute {
    position: static
}

.okui-btn-loader-container {
    height: 100%;
    position: relative
}

.okui-btn .btn-icon + .btn-content {
    margin-left: 4px
}

.okui-btn.btn-xxs .btn-icon {
    font-size: var(--okd-button-xxs-icon-size)
}

.okui-btn.btn-xxs .btn-icon-leading {
    margin-right: var(--okd-button-xxs-icon-margin)
}

.okui-btn.btn-xxs .btn-icon-tailing {
    margin-left: var(--okd-button-xxs-icon-margin)
}

.okui-btn.btn-xxs .okui-btn-loader-size {
    width: var(--okd-button-xxs-loader-size);
    height: var(--okd-button-xxs-loader-size);
    border-radius: var(--okd-button-xxs-loader-size)
}

.okui-btn.btn-xs .btn-icon {
    font-size: var(--okd-button-xs-icon-size)
}

.okui-btn.btn-xs .btn-icon-leading {
    margin-right: var(--okd-button-xs-icon-margin)
}

.okui-btn.btn-xs .btn-icon-tailing {
    margin-left: var(--okd-button-xs-icon-margin)
}

.okui-btn.btn-xs .okui-btn-loader-size {
    width: var(--okd-button-xs-loader-size);
    height: var(--okd-button-xs-loader-size);
    border-radius: var(--okd-button-xs-loader-size)
}

.okui-btn.btn-sm .btn-icon {
    font-size: var(--okd-button-sm-icon-size)
}

.okui-btn.btn-sm .btn-icon-leading {
    margin-right: var(--okd-button-sm-icon-margin)
}

.okui-btn.btn-sm .btn-icon-tailing {
    margin-left: var(--okd-button-sm-icon-margin)
}

.okui-btn.btn-sm .okui-btn-loader-size {
    width: var(--okd-button-sm-loader-size);
    height: var(--okd-button-sm-loader-size);
    border-radius: var(--okd-button-sm-loader-size)
}

.okui-btn.btn-md .btn-icon {
    font-size: var(--okd-button-md-icon-size)
}

.okui-btn.btn-md .btn-icon-leading {
    margin-right: var(--okd-button-md-icon-margin)
}

.okui-btn.btn-md .btn-icon-tailing {
    margin-left: var(--okd-button-md-icon-margin)
}

.okui-btn.btn-md .okui-btn-loader-size {
    width: var(--okd-button-md-loader-size);
    height: var(--okd-button-md-loader-size);
    border-radius: var(--okd-button-md-loader-size)
}

.okui-btn.btn-lg .btn-icon {
    font-size: var(--okd-button-lg-icon-size)
}

.okui-btn.btn-lg .btn-icon-leading {
    margin-right: var(--okd-button-lg-icon-margin)
}

.okui-btn.btn-lg .btn-icon-tailing {
    margin-left: var(--okd-button-lg-icon-margin)
}

.okui-btn.btn-lg .okui-btn-loader-size {
    width: var(--okd-button-lg-loader-size);
    height: var(--okd-button-lg-loader-size);
    border-radius: var(--okd-button-lg-loader-size)
}

.okui-btn.btn-xl .btn-icon {
    font-size: var(--okd-button-xl-icon-size)
}

.okui-btn.btn-xl .btn-icon-leading {
    margin-right: var(--okd-button-xl-icon-margin)
}

.okui-btn.btn-xl .btn-icon-tailing {
    margin-left: var(--okd-button-xl-icon-margin)
}

.okui-btn.btn-xl .okui-btn-loader-size {
    width: var(--okd-button-xl-loader-size);
    height: var(--okd-button-xl-loader-size);
    border-radius: var(--okd-button-xl-loader-size)
}

.okui-btn .okui-btn-fill-highlight-loader {
    border-top-color: var(--okd-button-fill-highlight-loader-track-color);
    border-color: var(--okd-button-fill-highlight-loader-mark-color) var(--okd-button-fill-highlight-loader-track-color) var(--okd-button-fill-highlight-loader-track-color)
}

.okui-btn .okui-btn-fill-primary-loader {
    border-top-color: var(--okd-button-fill-primary-loader-track-color);
    border-color: var(--okd-button-fill-primary-loader-mark-color) var(--okd-button-fill-primary-loader-track-color) var(--okd-button-fill-primary-loader-track-color)
}

.okui-btn .okui-btn-fill-red-loader {
    border-top-color: var(--okd-button-fill-red-loader-track-color);
    border-color: var(--okd-button-fill-red-loader-mark-color) var(--okd-button-fill-red-loader-track-color) var(--okd-button-fill-red-loader-track-color)
}

.okui-btn .okui-btn-fill-green-loader {
    border-top-color: var(--okd-button-fill-green-loader-track-color);
    border-color: var(--okd-button-fill-green-loader-mark-color) var(--okd-button-fill-green-loader-track-color) var(--okd-button-fill-green-loader-track-color)
}

.okui-btn .okui-btn-fill-secondary-loader {
    border-top-color: var(--okd-button-fill-secondary-loader-track-color);
    border-color: var(--okd-button-fill-secondary-loader-mark-color) var(--okd-button-fill-secondary-loader-track-color) var(--okd-button-fill-secondary-loader-track-color)
}

.okui-btn .okui-btn-fill-grey-loader {
    border-top-color: var(--okd-button-fill-grey-loader-track-color);
    border-color: var(--okd-button-fill-grey-loader-mark-color) var(--okd-button-fill-grey-loader-track-color) var(--okd-button-fill-grey-loader-track-color)
}

.okui-btn .okui-btn-outline-primary-loader {
    border-top-color: var(--okd-button-outline-primary-loader-track-color);
    border-color: var(--okd-button-outline-primary-loader-mark-color) var(--okd-button-outline-primary-loader-track-color) var(--okd-button-outline-primary-loader-track-color)
}

.okui-btn .okui-btn-outline-secondary-loader {
    border-top-color: var(--okd-button-outline-secondary-loader-track-color);
    border-color: var(--okd-button-outline-secondary-loader-mark-color) var(--okd-button-outline-secondary-loader-track-color) var(--okd-button-outline-secondary-loader-track-color)
}

.okui-btn-group {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex
}

.okui-btn-group .okui-btn {
    border-radius: 0
}

.okui-btn-group .okui-btn.btn-fill-highlight:not(:last-child) {
    color: var(--okd-button-fill-highlight-default-font-color);
    background-color: var(--okd-button-fill-highlight-default-background);
    border: 1px solid var(--okd-button-fill-highlight-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-highlight-default-shadow);
    box-shadow: var(--okd-button-fill-highlight-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-highlight:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-fill-highlight-hover-font-color);
    background-color: var(--okd-button-fill-highlight-hover-background);
    border: 1px solid var(--okd-button-fill-highlight-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-highlight-hover-shadow);
    box-shadow: var(--okd-button-fill-highlight-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-highlight:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-fill-highlight-focus-font-color);
    background-color: var(--okd-button-fill-highlight-focus-background);
    border: 1px solid var(--okd-button-fill-highlight-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-highlight-focus-shadow);
    box-shadow: var(--okd-button-fill-highlight-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-highlight:not(:last-child):not(:disabled):active {
    color: var(--okd-button-fill-highlight-active-font-color);
    background-color: var(--okd-button-fill-highlight-active-background);
    border: 1px solid var(--okd-button-fill-highlight-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-highlight-active-shadow);
    box-shadow: var(--okd-button-fill-highlight-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-highlight:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-fill-highlight:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-fill-highlight-disabled-font-color);
    background-color: var(--okd-button-fill-highlight-disabled-background);
    border: 1px solid var(--okd-button-fill-highlight-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-highlight-disabled-shadow);
    box-shadow: var(--okd-button-fill-highlight-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-fill-primary:not(:last-child) {
    color: var(--okd-button-fill-primary-default-font-color);
    background-color: var(--okd-button-fill-primary-default-background);
    border: 1px solid var(--okd-button-fill-primary-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-primary-default-shadow);
    box-shadow: var(--okd-button-fill-primary-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-primary:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-fill-primary-hover-font-color);
    background-color: var(--okd-button-fill-primary-hover-background);
    border: 1px solid var(--okd-button-fill-primary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-primary-hover-shadow);
    box-shadow: var(--okd-button-fill-primary-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-primary:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-fill-primary-focus-font-color);
    background-color: var(--okd-button-fill-primary-focus-background);
    border: 1px solid var(--okd-button-fill-primary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-primary-focus-shadow);
    box-shadow: var(--okd-button-fill-primary-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-primary:not(:last-child):not(:disabled):active {
    color: var(--okd-button-fill-primary-active-font-color);
    background-color: var(--okd-button-fill-primary-active-background);
    border: 1px solid var(--okd-button-fill-primary-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-primary-active-shadow);
    box-shadow: var(--okd-button-fill-primary-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-primary:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-fill-primary:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-fill-primary-disabled-font-color);
    background-color: var(--okd-button-fill-primary-disabled-background);
    border: 1px solid var(--okd-button-fill-primary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-primary-disabled-shadow);
    box-shadow: var(--okd-button-fill-primary-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-fill-red:not(:last-child) {
    color: var(--okd-button-fill-red-default-font-color);
    background-color: var(--okd-button-fill-red-default-background);
    border: 1px solid var(--okd-button-fill-red-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-red-default-shadow);
    box-shadow: var(--okd-button-fill-red-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-red:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-fill-red-hover-font-color);
    background-color: var(--okd-button-fill-red-hover-background);
    border: 1px solid var(--okd-button-fill-red-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-red-hover-shadow);
    box-shadow: var(--okd-button-fill-red-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-red:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-fill-red-focus-font-color);
    background-color: var(--okd-button-fill-red-focus-background);
    border: 1px solid var(--okd-button-fill-red-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-red-focus-shadow);
    box-shadow: var(--okd-button-fill-red-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-red:not(:last-child):not(:disabled):active {
    color: var(--okd-button-fill-red-active-font-color);
    background-color: var(--okd-button-fill-red-active-background);
    border: 1px solid var(--okd-button-fill-red-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-red-active-shadow);
    box-shadow: var(--okd-button-fill-red-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-red:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-fill-red:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-fill-red-disabled-font-color);
    background-color: var(--okd-button-fill-red-disabled-background);
    border: 1px solid var(--okd-button-fill-red-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-red-disabled-shadow);
    box-shadow: var(--okd-button-fill-red-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-fill-green:not(:last-child) {
    color: var(--okd-button-fill-green-default-font-color);
    background-color: var(--okd-button-fill-green-default-background);
    border: 1px solid var(--okd-button-fill-green-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-green-default-shadow);
    box-shadow: var(--okd-button-fill-green-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-green:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-fill-green-hover-font-color);
    background-color: var(--okd-button-fill-green-hover-background);
    border: 1px solid var(--okd-button-fill-green-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-green-hover-shadow);
    box-shadow: var(--okd-button-fill-green-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-green:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-fill-green-focus-font-color);
    background-color: var(--okd-button-fill-green-focus-background);
    border: 1px solid var(--okd-button-fill-green-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-green-focus-shadow);
    box-shadow: var(--okd-button-fill-green-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-green:not(:last-child):not(:disabled):active {
    color: var(--okd-button-fill-green-active-font-color);
    background-color: var(--okd-button-fill-green-active-background);
    border: 1px solid var(--okd-button-fill-green-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-green-active-shadow);
    box-shadow: var(--okd-button-fill-green-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-green:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-fill-green:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-fill-green-disabled-font-color);
    background-color: var(--okd-button-fill-green-disabled-background);
    border: 1px solid var(--okd-button-fill-green-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-green-disabled-shadow);
    box-shadow: var(--okd-button-fill-green-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-fill-secondary:not(:last-child) {
    color: var(--okd-button-fill-secondary-default-font-color);
    background-color: var(--okd-button-fill-secondary-default-background);
    border: 1px solid var(--okd-button-fill-secondary-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-secondary-default-shadow);
    box-shadow: var(--okd-button-fill-secondary-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-secondary:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-fill-secondary-hover-font-color);
    background-color: var(--okd-button-fill-secondary-hover-background);
    border: 1px solid var(--okd-button-fill-secondary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-secondary-hover-shadow);
    box-shadow: var(--okd-button-fill-secondary-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-secondary:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-fill-secondary-focus-font-color);
    background-color: var(--okd-button-fill-secondary-focus-background);
    border: 1px solid var(--okd-button-fill-secondary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-secondary-focus-shadow);
    box-shadow: var(--okd-button-fill-secondary-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-secondary:not(:last-child):not(:disabled):active {
    color: var(--okd-button-fill-secondary-active-font-color);
    background-color: var(--okd-button-fill-secondary-active-background);
    border: 1px solid var(--okd-button-fill-secondary-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-secondary-active-shadow);
    box-shadow: var(--okd-button-fill-secondary-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-secondary:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-fill-secondary:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-fill-secondary-disabled-font-color);
    background-color: var(--okd-button-fill-secondary-disabled-background);
    border: 1px solid var(--okd-button-fill-secondary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-secondary-disabled-shadow);
    box-shadow: var(--okd-button-fill-secondary-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-fill-grey:not(:last-child) {
    color: var(--okd-button-fill-grey-default-font-color);
    background-color: var(--okd-button-fill-grey-default-background);
    border: 1px solid var(--okd-button-fill-grey-default-border-color);
    -webkit-box-shadow: var(--okd-button-fill-grey-default-shadow);
    box-shadow: var(--okd-button-fill-grey-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-grey:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-fill-grey-hover-font-color);
    background-color: var(--okd-button-fill-grey-hover-background);
    border: 1px solid var(--okd-button-fill-grey-hover-border-color);
    -webkit-box-shadow: var(--okd-button-fill-grey-hover-shadow);
    box-shadow: var(--okd-button-fill-grey-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-fill-grey:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-fill-grey-focus-font-color);
    background-color: var(--okd-button-fill-grey-focus-background);
    border: 1px solid var(--okd-button-fill-grey-focus-border-color);
    -webkit-box-shadow: var(--okd-button-fill-grey-focus-shadow);
    box-shadow: var(--okd-button-fill-grey-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-grey:not(:last-child):not(:disabled):active {
    color: var(--okd-button-fill-grey-active-font-color);
    background-color: var(--okd-button-fill-grey-active-background);
    border: 1px solid var(--okd-button-fill-grey-active-border-color);
    -webkit-box-shadow: var(--okd-button-fill-grey-active-shadow);
    box-shadow: var(--okd-button-fill-grey-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-fill-grey:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-fill-grey:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-fill-grey-disabled-font-color);
    background-color: var(--okd-button-fill-grey-disabled-background);
    border: 1px solid var(--okd-button-fill-grey-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-fill-grey-disabled-shadow);
    box-shadow: var(--okd-button-fill-grey-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-outline-primary:not(:last-child) {
    color: var(--okd-button-outline-primary-default-font-color);
    background-color: var(--okd-button-outline-primary-default-background);
    border: 1px solid var(--okd-button-outline-primary-default-border-color);
    -webkit-box-shadow: var(--okd-button-outline-primary-default-shadow);
    box-shadow: var(--okd-button-outline-primary-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-outline-primary:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-outline-primary-hover-font-color);
    background-color: var(--okd-button-outline-primary-hover-background);
    border: 1px solid var(--okd-button-outline-primary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-outline-primary-hover-shadow);
    box-shadow: var(--okd-button-outline-primary-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-outline-primary:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-outline-primary-focus-font-color);
    background-color: var(--okd-button-outline-primary-focus-background);
    border: 1px solid var(--okd-button-outline-primary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-outline-primary-focus-shadow);
    box-shadow: var(--okd-button-outline-primary-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-outline-primary:not(:last-child):not(:disabled):active {
    color: var(--okd-button-outline-primary-active-font-color);
    background-color: var(--okd-button-outline-primary-active-background);
    border: 1px solid var(--okd-button-outline-primary-active-border-color);
    -webkit-box-shadow: var(--okd-button-outline-primary-active-shadow);
    box-shadow: var(--okd-button-outline-primary-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-outline-primary:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-outline-primary:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-outline-primary-disabled-font-color);
    background-color: var(--okd-button-outline-primary-disabled-background);
    border: 1px solid var(--okd-button-outline-primary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-outline-primary-disabled-shadow);
    box-shadow: var(--okd-button-outline-primary-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-outline-secondary:not(:last-child) {
    color: var(--okd-button-outline-secondary-default-font-color);
    background-color: var(--okd-button-outline-secondary-default-background);
    border: 1px solid var(--okd-button-outline-secondary-default-border-color);
    -webkit-box-shadow: var(--okd-button-outline-secondary-default-shadow);
    box-shadow: var(--okd-button-outline-secondary-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-outline-secondary:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-outline-secondary-hover-font-color);
    background-color: var(--okd-button-outline-secondary-hover-background);
    border: 1px solid var(--okd-button-outline-secondary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-outline-secondary-hover-shadow);
    box-shadow: var(--okd-button-outline-secondary-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-outline-secondary:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-outline-secondary-focus-font-color);
    background-color: var(--okd-button-outline-secondary-focus-background);
    border: 1px solid var(--okd-button-outline-secondary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-outline-secondary-focus-shadow);
    box-shadow: var(--okd-button-outline-secondary-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-outline-secondary:not(:last-child):not(:disabled):active {
    color: var(--okd-button-outline-secondary-active-font-color);
    background-color: var(--okd-button-outline-secondary-active-background);
    border: 1px solid var(--okd-button-outline-secondary-active-border-color);
    -webkit-box-shadow: var(--okd-button-outline-secondary-active-shadow);
    box-shadow: var(--okd-button-outline-secondary-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-outline-secondary:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-outline-secondary:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-outline-secondary-disabled-font-color);
    background-color: var(--okd-button-outline-secondary-disabled-background);
    border: 1px solid var(--okd-button-outline-secondary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-outline-secondary-disabled-shadow);
    box-shadow: var(--okd-button-outline-secondary-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-text-primary:not(:last-child) {
    color: var(--okd-button-text-primary-default-font-color);
    background-color: var(--okd-button-text-primary-default-background);
    border: 1px solid var(--okd-button-text-primary-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-primary-default-shadow);
    box-shadow: var(--okd-button-text-primary-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-primary:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-text-primary-hover-font-color);
    background-color: var(--okd-button-text-primary-hover-background);
    border: 1px solid var(--okd-button-text-primary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-primary-hover-shadow);
    box-shadow: var(--okd-button-text-primary-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-primary:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-text-primary-focus-font-color);
    background-color: var(--okd-button-text-primary-focus-background);
    border: 1px solid var(--okd-button-text-primary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-primary-focus-shadow);
    box-shadow: var(--okd-button-text-primary-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-primary:not(:last-child):not(:disabled):active {
    color: var(--okd-button-text-primary-active-font-color);
    background-color: var(--okd-button-text-primary-active-background);
    border: 1px solid var(--okd-button-text-primary-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-primary-active-shadow);
    box-shadow: var(--okd-button-text-primary-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-primary:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-text-primary:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-text-primary-disabled-font-color);
    background-color: var(--okd-button-text-primary-disabled-background);
    border: 1px solid var(--okd-button-text-primary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-primary-disabled-shadow);
    box-shadow: var(--okd-button-text-primary-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-text-secondary:not(:last-child) {
    color: var(--okd-button-text-secondary-default-font-color);
    background-color: var(--okd-button-text-secondary-default-background);
    border: 1px solid var(--okd-button-text-secondary-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-secondary-default-shadow);
    box-shadow: var(--okd-button-text-secondary-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-secondary:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-text-secondary-hover-font-color);
    background-color: var(--okd-button-text-secondary-hover-background);
    border: 1px solid var(--okd-button-text-secondary-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-secondary-hover-shadow);
    box-shadow: var(--okd-button-text-secondary-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-secondary:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-text-secondary-focus-font-color);
    background-color: var(--okd-button-text-secondary-focus-background);
    border: 1px solid var(--okd-button-text-secondary-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-secondary-focus-shadow);
    box-shadow: var(--okd-button-text-secondary-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-secondary:not(:last-child):not(:disabled):active {
    color: var(--okd-button-text-secondary-active-font-color);
    background-color: var(--okd-button-text-secondary-active-background);
    border: 1px solid var(--okd-button-text-secondary-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-secondary-active-shadow);
    box-shadow: var(--okd-button-text-secondary-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-secondary:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-text-secondary:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-text-secondary-disabled-font-color);
    background-color: var(--okd-button-text-secondary-disabled-background);
    border: 1px solid var(--okd-button-text-secondary-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-secondary-disabled-shadow);
    box-shadow: var(--okd-button-text-secondary-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-text-red:not(:last-child) {
    color: var(--okd-button-text-red-default-font-color);
    background-color: var(--okd-button-text-red-default-background);
    border: 1px solid var(--okd-button-text-red-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-red-default-shadow);
    box-shadow: var(--okd-button-text-red-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-red:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-text-red-hover-font-color);
    background-color: var(--okd-button-text-red-hover-background);
    border: 1px solid var(--okd-button-text-red-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-red-hover-shadow);
    box-shadow: var(--okd-button-text-red-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-red:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-text-red-focus-font-color);
    background-color: var(--okd-button-text-red-focus-background);
    border: 1px solid var(--okd-button-text-red-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-red-focus-shadow);
    box-shadow: var(--okd-button-text-red-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-red:not(:last-child):not(:disabled):active {
    color: var(--okd-button-text-red-active-font-color);
    background-color: var(--okd-button-text-red-active-background);
    border: 1px solid var(--okd-button-text-red-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-red-active-shadow);
    box-shadow: var(--okd-button-text-red-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-red:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-text-red:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-text-red-disabled-font-color);
    background-color: var(--okd-button-text-red-disabled-background);
    border: 1px solid var(--okd-button-text-red-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-red-disabled-shadow);
    box-shadow: var(--okd-button-text-red-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-text-green:not(:last-child) {
    color: var(--okd-button-text-green-default-font-color);
    background-color: var(--okd-button-text-green-default-background);
    border: 1px solid var(--okd-button-text-green-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-green-default-shadow);
    box-shadow: var(--okd-button-text-green-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-green:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-text-green-hover-font-color);
    background-color: var(--okd-button-text-green-hover-background);
    border: 1px solid var(--okd-button-text-green-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-green-hover-shadow);
    box-shadow: var(--okd-button-text-green-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-green:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-text-green-focus-font-color);
    background-color: var(--okd-button-text-green-focus-background);
    border: 1px solid var(--okd-button-text-green-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-green-focus-shadow);
    box-shadow: var(--okd-button-text-green-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-green:not(:last-child):not(:disabled):active {
    color: var(--okd-button-text-green-active-font-color);
    background-color: var(--okd-button-text-green-active-background);
    border: 1px solid var(--okd-button-text-green-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-green-active-shadow);
    box-shadow: var(--okd-button-text-green-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-green:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-text-green:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-text-green-disabled-font-color);
    background-color: var(--okd-button-text-green-disabled-background);
    border: 1px solid var(--okd-button-text-green-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-green-disabled-shadow);
    box-shadow: var(--okd-button-text-green-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-text-orange:not(:last-child) {
    color: var(--okd-button-text-orange-default-font-color);
    background-color: var(--okd-button-text-orange-default-background);
    border: 1px solid var(--okd-button-text-orange-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-orange-default-shadow);
    box-shadow: var(--okd-button-text-orange-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-orange:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-text-orange-hover-font-color);
    background-color: var(--okd-button-text-orange-hover-background);
    border: 1px solid var(--okd-button-text-orange-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-orange-hover-shadow);
    box-shadow: var(--okd-button-text-orange-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-orange:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-text-orange-focus-font-color);
    background-color: var(--okd-button-text-orange-focus-background);
    border: 1px solid var(--okd-button-text-orange-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-orange-focus-shadow);
    box-shadow: var(--okd-button-text-orange-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-orange:not(:last-child):not(:disabled):active {
    color: var(--okd-button-text-orange-active-font-color);
    background-color: var(--okd-button-text-orange-active-background);
    border: 1px solid var(--okd-button-text-orange-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-orange-active-shadow);
    box-shadow: var(--okd-button-text-orange-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-orange:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-text-orange:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-text-orange-disabled-font-color);
    background-color: var(--okd-button-text-orange-disabled-background);
    border: 1px solid var(--okd-button-text-orange-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-orange-disabled-shadow);
    box-shadow: var(--okd-button-text-orange-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-text-yellow:not(:last-child) {
    color: var(--okd-button-text-yellow-default-font-color);
    background-color: var(--okd-button-text-yellow-default-background);
    border: 1px solid var(--okd-button-text-yellow-default-border-color);
    -webkit-box-shadow: var(--okd-button-text-yellow-default-shadow);
    box-shadow: var(--okd-button-text-yellow-default-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-yellow:not(:last-child):not(:disabled):hover {
    color: var(--okd-button-text-yellow-hover-font-color);
    background-color: var(--okd-button-text-yellow-hover-background);
    border: 1px solid var(--okd-button-text-yellow-hover-border-color);
    -webkit-box-shadow: var(--okd-button-text-yellow-hover-shadow);
    box-shadow: var(--okd-button-text-yellow-hover-shadow);
    border-right: 1px solid transparent
}

.okui-btn-group .okui-btn.btn-text-yellow:not(:last-child):not(:disabled):focus {
    color: var(--okd-button-text-yellow-focus-font-color);
    background-color: var(--okd-button-text-yellow-focus-background);
    border: 1px solid var(--okd-button-text-yellow-focus-border-color);
    -webkit-box-shadow: var(--okd-button-text-yellow-focus-shadow);
    box-shadow: var(--okd-button-text-yellow-focus-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-yellow:not(:last-child):not(:disabled):active {
    color: var(--okd-button-text-yellow-active-font-color);
    background-color: var(--okd-button-text-yellow-active-background);
    border: 1px solid var(--okd-button-text-yellow-active-border-color);
    -webkit-box-shadow: var(--okd-button-text-yellow-active-shadow);
    box-shadow: var(--okd-button-text-yellow-active-shadow);
    z-index: 1
}

.okui-btn-group .okui-btn.btn-text-yellow:not(:last-child):not(.loading).btn-disabled, .okui-btn-group .okui-btn.btn-text-yellow:not(:last-child):not(.loading):disabled {
    color: var(--okd-button-text-yellow-disabled-font-color);
    background-color: var(--okd-button-text-yellow-disabled-background);
    border: 1px solid var(--okd-button-text-yellow-disabled-border-color);
    -webkit-box-shadow: var(--okd-button-text-yellow-disabled-shadow);
    box-shadow: var(--okd-button-text-yellow-disabled-shadow)
}

.okui-btn-group .okui-btn.btn-xxs {
    border-radius: 0
}

.okui-btn-group .okui-btn.btn-xxs:first-child {
    border-top-left-radius: var(--okd-button-xxs-border-radius);
    border-bottom-left-radius: var(--okd-button-xxs-border-radius)
}

.okui-btn-group .okui-btn.btn-xxs:last-child {
    border-top-right-radius: var(--okd-button-xxs-border-radius);
    border-bottom-right-radius: var(--okd-button-xxs-border-radius)
}

.okui-btn-group .okui-btn.btn-xs {
    border-radius: 0
}

.okui-btn-group .okui-btn.btn-xs:first-child {
    border-top-left-radius: var(--okd-button-xs-border-radius);
    border-bottom-left-radius: var(--okd-button-xs-border-radius)
}

.okui-btn-group .okui-btn.btn-xs:last-child {
    border-top-right-radius: var(--okd-button-xs-border-radius);
    border-bottom-right-radius: var(--okd-button-xs-border-radius)
}

.okui-btn-group .okui-btn.btn-sm {
    border-radius: 0
}

.okui-btn-group .okui-btn.btn-sm:first-child {
    border-top-left-radius: var(--okd-button-sm-border-radius);
    border-bottom-left-radius: var(--okd-button-sm-border-radius)
}

.okui-btn-group .okui-btn.btn-sm:last-child {
    border-top-right-radius: var(--okd-button-sm-border-radius);
    border-bottom-right-radius: var(--okd-button-sm-border-radius)
}

.okui-btn-group .okui-btn.btn-md {
    border-radius: 0
}

.okui-btn-group .okui-btn.btn-md:first-child {
    border-top-left-radius: var(--okd-button-md-border-radius);
    border-bottom-left-radius: var(--okd-button-md-border-radius)
}

.okui-btn-group .okui-btn.btn-md:last-child {
    border-top-right-radius: var(--okd-button-md-border-radius);
    border-bottom-right-radius: var(--okd-button-md-border-radius)
}

.okui-btn-group .okui-btn.btn-lg {
    border-radius: 0
}

.okui-btn-group .okui-btn.btn-lg:first-child {
    border-top-left-radius: var(--okd-button-lg-border-radius);
    border-bottom-left-radius: var(--okd-button-lg-border-radius)
}

.okui-btn-group .okui-btn.btn-lg:last-child {
    border-top-right-radius: var(--okd-button-lg-border-radius);
    border-bottom-right-radius: var(--okd-button-lg-border-radius)
}

.okui-btn-group .okui-btn.btn-xl {
    border-radius: 0
}

.okui-btn-group .okui-btn.btn-xl:first-child {
    border-top-left-radius: var(--okd-button-xl-border-radius);
    border-bottom-left-radius: var(--okd-button-xl-border-radius)
}

.okui-btn-group .okui-btn.btn-xl:last-child {
    border-top-right-radius: var(--okd-button-xl-border-radius);
    border-bottom-right-radius: var(--okd-button-xl-border-radius)
}

.okui-btn-group:disabled {
    cursor: not-allowed
}

.okui-btn-group.block {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

@-webkit-keyframes loadingLine {
    to {
        left: 100%;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

@keyframes loadingLine {
    to {
        left: 100%;
        -webkit-transform: translateX(0);
        transform: translateX(0)
    }
}

.okui-loader-line {
    width: 100%;
    height: var(--okd-loader-line-size);
    border-radius: calc(var(--okd-loader-line-size) / 2);
    position: relative;
    overflow: hidden;
    background: var(--okd-loader-line-inactive-color)
}

.okui-loader-line .okui-loader-mark {
    height: 100%;
    border-radius: calc(var(--okd-loader-line-size) / 2);
    -webkit-transition: all .36s linear;
    transition: all .36s linear;
    background: var(--okd-loader-line-active-color)
}

.okui-loader-line.okui-loader-loading .okui-loader-mark {
    position: absolute;
    left: 0;
    top: 0;
    -webkit-transform: translateX(-100%);
    transform: translateX(-100%);
    -webkit-animation: loadingLine 2s linear infinite;
    animation: loadingLine 2s linear infinite
}

@-webkit-keyframes okui-loader-rotation {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes okui-loader-rotation {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

.okui-loader-mask {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--okd-loader-mask-bg-color);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.okui-loader-mask-text {
    font-size: var(--okd-loader-mask-text-font-size);
    line-height: var(--okd-loader-mask-text-line-height);
    font-weight: var(--okd-loader-mask-text-font-weight);
    color: var(--okd-loader-mask-text-color);
    margin-top: var(--okd-loader-mask-text-margin-top)
}

.okui-loader-spin {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    border-style: solid;
    background-color: transparent;
    -webkit-animation: okui-loader-rotation 1s linear infinite;
    animation: okui-loader-rotation 1s linear infinite
}

.okui-loader-spin-xl {
    width: var(--okd-loader-circle-xl-size);
    height: var(--okd-loader-circle-xl-size);
    border-width: var(--okd-loader-circle-xl-track-width);
    border-radius: var(--okd-loader-circle-xl-size)
}

.okui-loader-spin-lg {
    width: var(--okd-loader-circle-lg-size);
    height: var(--okd-loader-circle-lg-size);
    border-width: var(--okd-loader-circle-lg-track-width);
    border-radius: var(--okd-loader-circle-lg-size)
}

.okui-loader-spin-md {
    width: var(--okd-loader-circle-md-size);
    height: var(--okd-loader-circle-md-size);
    border-width: var(--okd-loader-circle-md-track-width);
    border-radius: var(--okd-loader-circle-md-size)
}

.okui-loader-spin-sm {
    width: var(--okd-loader-circle-sm-size);
    height: var(--okd-loader-circle-sm-size);
    border-width: var(--okd-loader-circle-sm-track-width);
    border-radius: var(--okd-loader-circle-sm-size)
}

.okui-loader-spin-primary {
    border-top-color: var(--okd-loader-primary-inactive-color);
    border-color: var(--okd-loader-primary-active-color) var(--okd-loader-primary-inactive-color) var(--okd-loader-primary-inactive-color)
}

.okui-loader-spin-neutral {
    border-top-color: var(--okd-loader-neutral-inactive-color);
    border-color: var(--okd-loader-neutral-active-color) var(--okd-loader-neutral-inactive-color) var(--okd-loader-neutral-inactive-color)
}

.okui-loader-inner-circle {
    overflow: hidden;
    border: none;
    border-radius: 0;
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.okui-loader-inner-fill-primary {
    background: var(--okd-loader-primary-active-color)
}

.okui-loader-inner-fill-neutral {
    background: var(--okd-loader-neutral-active-color)
}

.okui-loader-inner-track-primary {
    background: var(--okd-loader-primary-inactive-color)
}

.okui-loader-inner-track-neutral {
    background: var(--okd-loader-neutral-inactive-color)
}

.okui-loader-inner-track-right {
    position: absolute;
    height: 100%;
    right: 0;
    overflow: hidden
}

.okui-loader-inner-track-right-content {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    -webkit-transform-origin: left center;
    transform-origin: left center;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
}

.okui-loader-inner-track-left {
    position: absolute;
    height: 100%;
    overflow: hidden
}

.okui-loader-inner-track-left-content {
    position: absolute;
    content: "";
    width: 100%;
    height: 100%;
    -webkit-transform-origin: right center;
    transform-origin: right center;
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg)
}

.okui-loader-inner-xl {
    width: var(--okd-loader-circle-xl-size);
    height: var(--okd-loader-circle-xl-size);
    border-radius: var(--okd-loader-circle-xl-size)
}

.okui-loader-inner-xl-cover {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: calc(var(--okd-loader-circle-xl-size) - var(--okd-loader-circle-xl-track-width) * 2);
    width: calc(var(--okd-loader-circle-xl-size) - var(--okd-loader-circle-xl-track-width) * 2);
    border-radius: 100%;
    background-color: var(--okd-loader-circle-cover-background)
}

.okui-loader-inner-track-xl {
    width: calc(var(--okd-loader-circle-xl-size) / 2)
}

.okui-loader-inner-track-xl-inner-track-left-content {
    width: 100%;
    border-radius: calc(var(--okd-loader-circle-xl-size) / 2) 0 0 calc(var(--okd-loader-circle-xl-size) / 2)
}

.okui-loader-inner-track-xl-inner-track-right-content {
    width: 100%;
    border-radius: 0 calc(var(--okd-loader-circle-xl-size) / 2) calc(var(--okd-loader-circle-xl-size) / 2) 0
}

.okui-loader-inner-lg {
    width: var(--okd-loader-circle-lg-size);
    height: var(--okd-loader-circle-lg-size);
    border-radius: var(--okd-loader-circle-lg-size)
}

.okui-loader-inner-lg-cover {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: calc(var(--okd-loader-circle-lg-size) - var(--okd-loader-circle-lg-track-width) * 2);
    width: calc(var(--okd-loader-circle-lg-size) - var(--okd-loader-circle-lg-track-width) * 2);
    border-radius: 100%;
    background-color: var(--okd-loader-circle-cover-background)
}

.okui-loader-inner-track-lg {
    width: calc(var(--okd-loader-circle-lg-size) / 2)
}

.okui-loader-inner-track-lg-inner-track-left-content {
    width: 100%;
    border-radius: calc(var(--okd-loader-circle-lg-size) / 2) 0 0 calc(var(--okd-loader-circle-lg-size) / 2)
}

.okui-loader-inner-track-lg-inner-track-right-content {
    width: 100%;
    border-radius: 0 calc(var(--okd-loader-circle-lg-size) / 2) calc(var(--okd-loader-circle-lg-size) / 2) 0
}

.okui-loader-inner-md {
    width: var(--okd-loader-circle-md-size);
    height: var(--okd-loader-circle-md-size);
    border-radius: var(--okd-loader-circle-md-size)
}

.okui-loader-inner-md-cover {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: calc(var(--okd-loader-circle-md-size) - var(--okd-loader-circle-md-track-width) * 2);
    width: calc(var(--okd-loader-circle-md-size) - var(--okd-loader-circle-md-track-width) * 2);
    border-radius: 100%;
    background-color: var(--okd-loader-circle-cover-background)
}

.okui-loader-inner-track-md {
    width: calc(var(--okd-loader-circle-md-size) / 2)
}

.okui-loader-inner-track-md-inner-track-left-content {
    width: 100%;
    border-radius: calc(var(--okd-loader-circle-md-size) / 2) 0 0 calc(var(--okd-loader-circle-md-size) / 2)
}

.okui-loader-inner-track-md-inner-track-right-content {
    width: 100%;
    border-radius: 0 calc(var(--okd-loader-circle-md-size) / 2) calc(var(--okd-loader-circle-md-size) / 2) 0
}

.okui-loader-inner-sm {
    width: var(--okd-loader-circle-sm-size);
    height: var(--okd-loader-circle-sm-size);
    border-radius: var(--okd-loader-circle-sm-size)
}

.okui-loader-inner-sm-cover {
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    height: calc(var(--okd-loader-circle-sm-size) - var(--okd-loader-circle-sm-track-width) * 2);
    width: calc(var(--okd-loader-circle-sm-size) - var(--okd-loader-circle-sm-track-width) * 2);
    border-radius: 100%;
    background-color: var(--okd-loader-circle-cover-background)
}

.okui-loader-inner-track-sm {
    width: calc(var(--okd-loader-circle-sm-size) / 2)
}

.okui-loader-inner-track-sm-inner-track-left-content {
    width: 100%;
    border-radius: calc(var(--okd-loader-circle-sm-size) / 2) 0 0 calc(var(--okd-loader-circle-sm-size) / 2)
}

.okui-loader-inner-track-sm-inner-track-right-content {
    width: 100%;
    border-radius: 0 calc(var(--okd-loader-circle-sm-size) / 2) calc(var(--okd-loader-circle-sm-size) / 2) 0
}

.verify-input-new-container {
    border-radius: 4px
}

.verify-input-new-container .title {
    font-size: 12px;
    color: #606f88;
    line-height: 14px
}

.verify-input-new-container .code-input-section {
    margin-top: 5px;
    position: relative
}

.verify-input-new-container .code-input-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 300px;
    margin: 0 auto
}

.verify-input-new-container .code-input-container .left-input, .verify-input-new-container .code-input-container .right-input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 156px
}

.verify-input-new-container .code-input-container .code-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 44px;
    height: 48px;
    padding: 8px 0 8px 3px;
    border: 1px solid var(--passport-input-default-border-color);
    border-radius: var(--passport-border-radius)
}

.verify-input-new-container .code-input-container .code-section:hover {
    background: var(--passport-input-hover-background);
    caret-color: var(--passport--input-hover-caret-color)
}

.verify-input-new-container .code-input-container .active {
    -webkit-box-shadow: var(--passport-input-focus-shadow);
    box-shadow: var(--passport-input-focus-shadow);
    border-radius: 2px;
    border: 1px solid var(--passport-input-focus-border-color)
}

.verify-input-new-container .code-input-container .code-input {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 32px;
    height: 32px;
    padding-left: 11px;
    caret-color: var(--passport-input-default-caret-color);
    font-size: 24px;
    outline: none;
    border: none
}

.verify-input-new-container .bg-number-placeholder {
    position: absolute;
    top: 1px
}

.verify-input-new-container .bg-number-placeholder span {
    display: inline-block;
    margin-right: 3px;
    color: rgba(6, 29, 68, .2);
    font-size: 14px;
    width: 9px
}

.verify-input-new-container input::-webkit-input-placeholder {
    color: rgba(6, 29, 68, .3)
}

.verify-input-new-container input:-moz-placeholder, .verify-input-new-container input::-moz-placeholder {
    color: rgba(6, 29, 68, .3)
}

.verify-input-new-container input:-ms-input-placeholder {
    color: rgba(6, 29, 68, .3)
}

@media (max-width: 767px) {
    .verify-input-new-container .code-input-container .left-input {
        width: 150px;
        margin-right: 22px
    }

    .verify-input-new-container .code-input-container .right-input {
        width: 150px
    }

    .verify-input-new-container .code-input-container .code-section {
        max-width: 40px;
        padding: 8px 0
    }

    .verify-input-new-container .code-input-container .code-input {
        max-width: 40px;
        padding-left: 13px
    }
}

.login-part-main {
    position: relative;
    border-radius: 5px;
    z-index: 10
}

.login-part-main * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.login-part-main .step2-title-box {
    text-align: center
}

.login-part-main .step2-title-box .step2-title {
    font-size: 16px;
    font-weight: 600;
    color: rgba(0, 0, 0, .85);
    line-height: 18px;
    padding: 3px 0
}

.login-part-main .step2-title-box .step2-tips {
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, .45);
    line-height: 17px;
    padding: 2px 0;
    margin-top: 14px
}

.login-part-main .forgot-pwd {
    text-align: right;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: var(--passport-forgotPwd-color);
    line-height: 20px
}

.login-part-main .error-section {
    background: #ffe7e7;
    border-radius: 2px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-top: 16px;
    padding: 16px 24px 16px 18px
}

.login-part-main .error-section .error-msg {
    line-height: 20px;
    display: inline-block;
    vertical-align: top;
    color: #9c2c2c;
    font-size: 14px;
    font-weight: 500
}

.login-part-main .error-section .iconclose-circle {
    color: #e35e5e;
    font-size: 19.2px;
    margin: 0 15px 0 0
}

.login-part-main .psw-and-forgot-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    font-size: 14px;
    font-weight: 500;
    color: var(--passport-pwdLabel-color);
    line-height: 20px;
    margin: 16px 0 4px
}

.login-part-main .account-title {
    font-size: 14px;
    font-weight: 500;
    color: #3f475a;
    line-height: 20px;
    margin-bottom: 4px
}

.login-part-main .step2-error-msg {
    margin-top: 30px
}

.login-part-main .auto-logoff-box {
    margin-top: 16px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.login-part-main .auto-logoff-box p {
    margin-right: 8px;
    font-size: 12px;
    line-height: 18px
}

.login-part-main .auto-logoff-box img {
    width: 16px;
    height: 16px
}

.login-part-main .auto-logoff-box .auto-logoff-tip {
    -ms-flex-negative: 0;
    flex-shrink: 0
}

@media (max-width: 767px) {
    .login-part-main .login-btn, .login-part-main .okui-input.input-md .okui-input-box {
        height: 48px
    }

    .login-part-main .drop-list {
        top: 72px
    }
}

.okui-checkbox-wrapper-indeterminate .okui-checkbox-inner {
    background-color: var(--okd-checkbox-selected-background);
    border-color: var(--okd-checkbox-selected-border-color)
}

.okui-checkbox-wrapper-indeterminate .okui-checkbox-inner:after {
    position: absolute;
    -webkit-transition: all .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
    transition: all .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
    content: " ";
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 10px;
    height: 2px;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    background-color: var(--okd-checkbox-selected-inner-color)
}

.okui-checkbox-inner {
    position: relative;
    top: 0;
    left: 0;
    display: block;
    width: 12px;
    height: 12px;
    direction: ltr;
    background-color: var(--okd-checkbox-default-background);
    border: 1px solid var(--okd-checkbox-default-border-color);
    border-radius: var(--okd-checkbox-common-border-radius);
    -webkit-box-shadow: var(--okd-checkbox-default-shadow);
    box-shadow: var(--okd-checkbox-default-shadow);
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    cursor: pointer
}

.okui-checkbox-input {
    position: absolute;
    z-index: 1;
    width: 100%;
    height: 100%;
    opacity: 0;
    margin: 0;
    cursor: pointer
}

.okui-checkbox-children {
    margin-left: 4px;
    display: inline-block;
    vertical-align: top;
    width: calc(100% - 15px);
    white-space: normal;
    word-break: break-all;
    font-size: var(--okd-checkbox-common-label-font-size)
}

.okui-checkbox-wrapper {
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: inline-block;
    margin-right: 8px;
    font-size: 0;
    white-space: nowrap
}

.okui-checkbox-wrapper .okui-checkbox-children {
    color: var(--okd-checkbox-default-text-color)
}

.okui-checkbox-wrapper .okui-checkbox {
    display: inline-block;
    position: relative;
    cursor: pointer;
    vertical-align: middle
}

.okui-checkbox-wrapper.hover-status .okui-checkbox-inner, .okui-checkbox-wrapper:hover .okui-checkbox-inner {
    -webkit-box-shadow: var(--okd-checkbox-default-hover-shadow);
    box-shadow: var(--okd-checkbox-default-hover-shadow);
    border-color: var(--okd-checkbox-default-hover-border-color)
}

.okui-checkbox-wrapper-checked .okui-checkbox-children {
    color: var(--okd-checkbox-selected-text-color)
}

.okui-checkbox-wrapper-checked .okui-checkbox-inner {
    background-color: var(--okd-checkbox-selected-background);
    border-color: var(--okd-checkbox-selected-border-color);
    -webkit-box-shadow: var(--okd-checkbox-selected-shadow);
    box-shadow: var(--okd-checkbox-selected-shadow)
}

.okui-checkbox-wrapper-checked .okui-checkbox-inner:after {
    position: absolute;
    -webkit-transition: all .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
    transition: all .2s cubic-bezier(.12, .4, .29, 1.46) .1s;
    content: " ";
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 5px;
    height: 8px;
    border: 2px solid var(--okd-checkbox-selected-inner-color);
    border-top: 0;
    border-left: 0;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%) rotate(45deg);
    transform: translate(-50%, -50%) rotate(45deg);
    background-color: transparent
}

.okui-checkbox-wrapper-checked.hover-status .okui-checkbox-inner, .okui-checkbox-wrapper-checked:hover .okui-checkbox-inner {
    border-color: var(--okd-checkbox-selected-hover-border-color);
    -webkit-box-shadow: var(--okd-checkbox-selected-hover-shadow);
    box-shadow: var(--okd-checkbox-selected-hover-shadow)
}

.okui-checkbox-wrapper-error .okui-checkbox-children {
    color: var(--okd-checkbox-error-text-color)
}

.okui-checkbox-wrapper-error .okui-checkbox-inner {
    border-color: var(--okd-checkbox-error-border-color);
    -webkit-box-shadow: var(--okd-checkbox-error-shadow);
    box-shadow: var(--okd-checkbox-error-shadow)
}

.okui-checkbox-wrapper-error.hover-status .okui-checkbox-inner, .okui-checkbox-wrapper-error:hover .okui-checkbox-inner {
    -webkit-box-shadow: var(--okd-checkbox-error-hover-shadow);
    box-shadow: var(--okd-checkbox-error-hover-shadow);
    border-color: var(--okd-checkbox-error-hover-border-color)
}

.okui-checkbox-wrapper-error.okui-checkbox-wrapper-checked .okui-checkbox-inner {
    background-color: var(--okd-checkbox-error-background);
    border-color: var(--okd-checkbox-error-border-color)
}

.okui-checkbox-wrapper-error.okui-checkbox-wrapper-checked .okui-checkbox-inner:after {
    border-color: var(--okd-checkbox-error-inner-color)
}

.okui-checkbox-wrapper-disabled {
    cursor: default
}

.okui-checkbox-wrapper-disabled .okui-checkbox-children {
    color: var(--okd-checkbox-disabled-text-color)
}

.okui-checkbox-wrapper-disabled .okui-checkbox, .okui-checkbox-wrapper-disabled .okui-checkbox .okui-checkbox-input {
    cursor: default
}

.okui-checkbox-wrapper-disabled .okui-checkbox .okui-checkbox-inner {
    background-color: var(--okd-checkbox-disabled-background);
    border-color: var(--okd-checkbox-disabled-border-color);
    cursor: default
}

.okui-checkbox-wrapper-disabled.hover-status .okui-checkbox-inner, .okui-checkbox-wrapper-disabled:hover .okui-checkbox-inner {
    -webkit-box-shadow: unset;
    box-shadow: unset;
    border-color: var(--okd-checkbox-disabled-hover-border-color)
}

.okui-checkbox-wrapper-disabled.okui-checkbox-wrapper-checked .okui-checkbox-inner {
    background-color: var(--okd-checkbox-disabled-background);
    border-color: var(--okd-checkbox-disabled-border-color)
}

.okui-checkbox-wrapper-disabled.okui-checkbox-wrapper-checked .okui-checkbox-inner:after {
    border-color: var(--okd-checkbox-disabled-inner-color)
}

.okui-checkbox-sm .okui-checkbox-inner {
    width: var(--okd-checkbox-sm-width);
    height: var(--okd-checkbox-sm-height)
}

.okui-checkbox-sm .okui-checkbox-children {
    margin-left: var(--okd-checkbox-sm-margin);
    font-size: var(--okd-checkbox-sm-font-size)
}

.okui-checkbox-sm.okui-checkbox-wrapper {
    line-height: var(--okd-checkbox-sm-line-height);
    padding-top: var(--okd-checkbox-sm-padding);
    padding-bottom: var(--okd-checkbox-sm-padding)
}

.okui-checkbox-md .okui-checkbox-inner {
    width: var(--okd-checkbox-md-width);
    height: var(--okd-checkbox-md-height)
}

.okui-checkbox-md .okui-checkbox-children {
    margin-left: var(--okd-checkbox-md-margin);
    font-size: var(--okd-checkbox-md-font-size)
}

.okui-checkbox-md.okui-checkbox-wrapper {
    line-height: var(--okd-checkbox-md-line-height);
    padding-top: var(--okd-checkbox-md-padding);
    padding-bottom: var(--okd-checkbox-md-padding)
}

.okui-tooltip .okui-popup-layer-content {
    padding: 6px 8px;
    color: var(--okd-tooltip-default-font-color);
    border-radius: 2px;
    font-size: 12px;
    line-height: 16px;
    max-width: 160px
}

.okui-tooltip .okui-popup-layer-arrow-inner, .okui-tooltip .okui-popup-layer-content {
    background-color: var(--okd-tooltip-neutral-background)
}

.okui-tooltip-negative .okui-popup-layer-arrow-inner, .okui-tooltip-negative .okui-popup-layer-content {
    background-color: var(--okd-tooltip-negative-background)
}

.okui-tooltip-positive .okui-popup-layer-arrow-inner, .okui-tooltip-positive .okui-popup-layer-content {
    background-color: var(--okd-tooltip-positive-background)
}

.okui-tooltip-informative .okui-popup-layer-arrow-inner, .okui-tooltip-informative .okui-popup-layer-content {
    background-color: var(--okd-tooltip-informative-background)
}

.okui-popup {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    position: relative
}

.okui-popup-layer {
    visibility: hidden;
    -webkit-transition: opacity .3s;
    transition: opacity .3s;
    opacity: 0;
    position: absolute
}

.okui-popup-layer-visible {
    visibility: visible;
    opacity: 1
}

.okui-popup-layer-arrow-inner {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform-origin: center;
    transform-origin: center;
    border: 1px solid transparent;
    border-radius: 2px
}

.okui-popup-layer.okui-popup-overflow[data-popper-reference-hidden] {
    visibility: hidden;
    pointer-events: none
}

.okui-popup-white-board .okui-popup-layer-arrow-inner {
    border: 1px solid rgba(0, 0, 0, .05);
    background-color: var(--okd-popup-white-board-background)
}

.okui-popup-white-board-content {
    border-radius: 4px;
    background-color: var(--okd-popup-white-board-background);
    border: 1px solid rgba(0, 0, 0, .05);
    -webkit-box-shadow: var(--okd-popup-white-board-shadow);
    box-shadow: var(--okd-popup-white-board-shadow)
}

.okui-popup-placement-lg-top {
    padding-bottom: 8px
}

.okui-popup-placement-lg-bottom {
    padding-top: 8px
}

.okui-popup-placement-lg-left {
    padding-right: 8px
}

.okui-popup-placement-lg-right {
    padding-left: 8px
}

.okui-popup-arrow-lg .okui-popup-layer-arrow {
    width: 12px;
    height: 12px
}

.okui-popup-arrow-lg[data-popper-placement*=top] {
    padding: 0 0 8px
}

.okui-popup-arrow-lg[data-popper-placement*=bottom] {
    padding: 8px 0 0
}

.okui-popup-arrow-lg[data-popper-placement*=left] {
    padding: 0 8px 0 0
}

.okui-popup-arrow-lg[data-popper-placement*=right] {
    padding: 0 0 0 8px
}

.okui-popup-arrow-lg[data-popper-placement*=top] .okui-popup-layer-arrow {
    top: 100%;
    margin-top: -15px
}

.okui-popup-arrow-lg[data-popper-placement*=top] .okui-popup-layer-arrow-inner {
    border-left-color: transparent !important;
    border-top-color: transparent !important
}

.okui-popup-arrow-lg[data-popper-placement*=right] .okui-popup-layer-arrow {
    right: 100%;
    margin-right: -15px
}

.okui-popup-arrow-lg[data-popper-placement*=right] .okui-popup-layer-arrow-inner {
    border-right-color: transparent !important;
    border-top-color: transparent !important
}

.okui-popup-arrow-lg[data-popper-placement*=bottom] .okui-popup-layer-arrow {
    bottom: 100%;
    margin-bottom: -15px
}

.okui-popup-arrow-lg[data-popper-placement*=bottom] .okui-popup-layer-arrow-inner {
    border-right-color: transparent !important;
    border-bottom-color: transparent !important
}

.okui-popup-arrow-lg[data-popper-placement*=left] .okui-popup-layer-arrow {
    left: 100%;
    margin-left: -15px
}

.okui-popup-arrow-lg[data-popper-placement*=left] .okui-popup-layer-arrow-inner {
    border-left-color: transparent !important;
    border-bottom-color: transparent !important
}

.okui-popup-placement-md-top {
    padding-bottom: 6px
}

.okui-popup-placement-md-bottom {
    padding-top: 6px
}

.okui-popup-placement-md-left {
    padding-right: 6px
}

.okui-popup-placement-md-right {
    padding-left: 6px
}

.okui-popup-arrow-md .okui-popup-layer-arrow {
    width: 8px;
    height: 8px
}

.okui-popup-arrow-md[data-popper-placement*=top] {
    padding: 0 0 6px
}

.okui-popup-arrow-md[data-popper-placement*=bottom] {
    padding: 6px 0 0
}

.okui-popup-arrow-md[data-popper-placement*=left] {
    padding: 0 6px 0 0
}

.okui-popup-arrow-md[data-popper-placement*=right] {
    padding: 0 0 0 6px
}

.okui-popup-arrow-md[data-popper-placement*=top] .okui-popup-layer-arrow {
    top: 100%;
    margin-top: -11px
}

.okui-popup-arrow-md[data-popper-placement*=top] .okui-popup-layer-arrow-inner {
    border-left-color: transparent !important;
    border-top-color: transparent !important
}

.okui-popup-arrow-md[data-popper-placement*=right] .okui-popup-layer-arrow {
    right: 100%;
    margin-right: -11px
}

.okui-popup-arrow-md[data-popper-placement*=right] .okui-popup-layer-arrow-inner {
    border-right-color: transparent !important;
    border-top-color: transparent !important
}

.okui-popup-arrow-md[data-popper-placement*=bottom] .okui-popup-layer-arrow {
    bottom: 100%;
    margin-bottom: -11px
}

.okui-popup-arrow-md[data-popper-placement*=bottom] .okui-popup-layer-arrow-inner {
    border-right-color: transparent !important;
    border-bottom-color: transparent !important
}

.okui-popup-arrow-md[data-popper-placement*=left] .okui-popup-layer-arrow {
    left: 100%;
    margin-left: -11px
}

.okui-popup-arrow-md[data-popper-placement*=left] .okui-popup-layer-arrow-inner {
    border-left-color: transparent !important;
    border-bottom-color: transparent !important
}

.okui-alert {
    border-radius: var(--okd-alert-box-border-radius);
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    width: 100%;
    padding: var(--okd-alert-box-padding-vertical) var(--okd-alert-box-padding-horizontal);
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.okui-alert.closable {
    padding-right: 44px
}

.okui-alert.accent-border {
    border-radius: 0
}

.okui-alert * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.okui-alert .okui-alert-icon {
    font-size: 20px;
    height: 20px;
    width: 20px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.okui-alert-msg-box, .okui-alert .okui-alert-icon {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.okui-alert-msg-box {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.okui-alert-icon + .okui-alert-msg-box {
    margin-left: 15px
}

.okui-alert-title {
    font-size: var(--okd-alert-title-font-size);
    line-height: var(--okd-alert-title-line-height);
    font-weight: 500
}

.okui-alert-desc {
    font-size: var(--okd-alert-text-font-size);
    line-height: var(--okd-alert-text-line-height);
    font-weight: 400
}

.okui-alert-title + .okui-alert-desc {
    margin-top: 4px
}

.okui-alert-link {
    font-weight: 500;
    text-decoration: none
}

.okui-alert-desc-list {
    -webkit-padding-start: 17px;
    padding-inline-start: 17px;
    -webkit-margin-before: 4px;
    margin-block-start: 4px;
    -webkit-margin-after: 0;
    margin-block-end: 0
}

.okui-alert-action-box {
    margin-top: 21px;
    margin-bottom: 8px
}

.okui-alert-action {
    font-weight: 500;
    font-size: var(--okd-alert-action-font-size);
    line-height: var(--okd-alert-action-line-height);
    outline: 0;
    background: transparent;
    border: 0;
    padding: 0;
    cursor: pointer;
    font-family: inherit
}

.okui-alert-action + .okui-alert-action {
    margin-left: 32px
}

.okui-alert-close-con {
    height: 32px;
    width: 32px;
    cursor: pointer;
    position: absolute;
    top: 10px;
    right: 12px
}

.okui-alert-close-con .okui-alert-close {
    font-size: 32px;
    cursor: pointer;
    position: absolute;
    line-height: 1
}

.okui-alert.normal-alert {
    background: var(--okd-alert-normal-background)
}

.okui-alert.normal-alert .okui-alert-icon {
    color: var(--okd-alert-normal-icon-color)
}

.okui-alert.normal-alert .okui-alert-title {
    color: var(--okd-alert-normal-title-color)
}

.okui-alert.normal-alert .okui-alert-close, .okui-alert.normal-alert .okui-alert-desc {
    color: var(--okd-alert-normal-desc-color)
}

.okui-alert.normal-alert .okui-alert-link {
    color: var(--okd-alert-normal-link-color);
    border-bottom: 1px solid var(--okd-alert-normal-link-color)
}

.okui-alert.normal-alert .okui-alert-action {
    color: var(--okd-alert-normal-action-color)
}

.okui-alert.normal-alert.accent-border {
    border-left: var(--okd-alert-accent-width) solid var(--okd-alert-normal-accent-color)
}

.okui-alert.success-alert {
    background: var(--okd-alert-success-background)
}

.okui-alert.success-alert .okui-alert-icon {
    color: var(--okd-alert-success-icon-color)
}

.okui-alert.success-alert .okui-alert-title {
    color: var(--okd-alert-success-title-color)
}

.okui-alert.success-alert .okui-alert-close, .okui-alert.success-alert .okui-alert-desc {
    color: var(--okd-alert-success-desc-color)
}

.okui-alert.success-alert .okui-alert-link {
    color: var(--okd-alert-success-link-color);
    border-bottom: 1px solid var(--okd-alert-success-link-color)
}

.okui-alert.success-alert .okui-alert-action {
    color: var(--okd-alert-success-action-color)
}

.okui-alert.success-alert.accent-border {
    border-left: var(--okd-alert-accent-width) solid var(--okd-alert-success-accent-color)
}

.okui-alert.info-alert {
    background: var(--okd-alert-info-background)
}

.okui-alert.info-alert .okui-alert-icon {
    color: var(--okd-alert-info-icon-color)
}

.okui-alert.info-alert .okui-alert-title {
    color: var(--okd-alert-info-title-color)
}

.okui-alert.info-alert .okui-alert-close, .okui-alert.info-alert .okui-alert-desc {
    color: var(--okd-alert-info-desc-color)
}

.okui-alert.info-alert .okui-alert-link {
    color: var(--okd-alert-info-link-color);
    border-bottom: 1px solid var(--okd-alert-info-link-color)
}

.okui-alert.info-alert .okui-alert-action {
    color: var(--okd-alert-info-action-color)
}

.okui-alert.info-alert.accent-border {
    border-left: var(--okd-alert-accent-width) solid var(--okd-alert-info-accent-color)
}

.okui-alert.warn-alert {
    background: var(--okd-alert-warn-background)
}

.okui-alert.warn-alert .okui-alert-icon {
    color: var(--okd-alert-warn-icon-color)
}

.okui-alert.warn-alert .okui-alert-title {
    color: var(--okd-alert-warn-title-color)
}

.okui-alert.warn-alert .okui-alert-close, .okui-alert.warn-alert .okui-alert-desc {
    color: var(--okd-alert-warn-desc-color)
}

.okui-alert.warn-alert .okui-alert-link {
    color: var(--okd-alert-warn-link-color);
    border-bottom: 1px solid var(--okd-alert-warn-link-color)
}

.okui-alert.warn-alert .okui-alert-action {
    color: var(--okd-alert-warn-action-color)
}

.okui-alert.warn-alert.accent-border {
    border-left: var(--okd-alert-accent-width) solid var(--okd-alert-warn-accent-color)
}

.okui-alert.error-alert {
    background: var(--okd-alert-error-background)
}

.okui-alert.error-alert .okui-alert-icon {
    color: var(--okd-alert-error-icon-color)
}

.okui-alert.error-alert .okui-alert-title {
    color: var(--okd-alert-error-title-color)
}

.okui-alert.error-alert .okui-alert-close, .okui-alert.error-alert .okui-alert-desc {
    color: var(--okd-alert-error-desc-color)
}

.okui-alert.error-alert .okui-alert-link {
    color: var(--okd-alert-error-link-color);
    border-bottom: 1px solid var(--okd-alert-error-link-color)
}

.okui-alert.error-alert .okui-alert-action {
    color: var(--okd-alert-error-action-color)
}

.okui-alert.error-alert.accent-border {
    border-left: var(--okd-alert-accent-width) solid var(--okd-alert-error-accent-color)
}

@font-face {
    font-family: iconfont;
    src: url("data:application/x-font-woff2;charset=utf-8;base64,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") format("woff2"), url(/cdn/assets/okfe/login/0.9.3/fonts/iconfont.dcf0b85.woff) format("woff"), url(/cdn/assets/okfe/login/0.9.3/fonts/iconfont.1555093.ttf) format("truetype")
}

.iconicn-left-arrow-glyph-sm-copy:before {
    content: "\EA62"
}

.iconicn-left-arrow-outline-lg-copy:before {
    content: "\EA61"
}

.iconicn-close-outline-lg:before {
    content: "\EA30"
}

.iconicn-close-outline-lg-copy:before {
    content: "\EA60"
}

.iconcheck:before {
    content: "\E780"
}

.iconinfo:before {
    content: "\E781"
}

.iconexclamation:before {
    content: "\E782"
}

.iconclose:before {
    content: "\E783"
}

.iconremind:before {
    content: "\E784"
}

.iconcheck-circle:before {
    content: "\E785"
}

.iconinfo-circle:before {
    content: "\E786"
}

.iconexclamation-circle:before {
    content: "\E787"
}

.iconremind-circle:before {
    content: "\E789"
}

.iconicon_info1:before {
    content: "\E9FA"
}

.third-login-container .third-login {
    font-size: 12px;
    color: #606f88
}

.third-login-container .third-login-title {
    text-align: center;
    margin-top: 24px
}

.third-login-container .login-other {
    letter-spacing: 1px
}

.third-login-container .third-login-title span {
    display: block;
    font-size: 12px;
    color: #606f88;
    position: relative
}

.third-login-container .third-login-title span:after, .third-login-container .third-login-title span:before {
    content: "";
    position: absolute;
    top: 52%;
    background: #e9ebf2;
    width: 30%;
    height: 1px
}

.third-login-container .third-login-title span:before {
    left: 0
}

.third-login-container .third-login-title span:after {
    right: 0
}

.third-login-container .error-section {
    background: rgba(238, 101, 96, .1);
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 8px 0 8px 13px
}

.third-login-container .error-section .iconclose-circle {
    color: #ee6560;
    font-size: 14px;
    margin: 2px 9px 0 0
}

.third-login-container .third-section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    margin-top: 24px
}

.third-login-container .third-tel-btn-section {
    position: relative;
    width: 100%;
    overflow: hidden
}

.third-login-container .third-tel-btn-section:first-child {
    margin-right: 8px
}

.third-login-container .third-login-icon {
    width: 24px;
    height: 24px;
    margin: 0 12px
}

.third-login-container .site-text {
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    text-align: center;
    font-weight: 500;
    font-size: 14px;
    color: #606f88;
    line-height: 40px
}

.third-login-container .telegram-section {
    width: 100%;
    height: 40px;
    border-radius: 2px;
    position: absolute;
    border: 1px solid #ced3de;
    top: 0;
    background: #fff;
    pointer-events: none;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-right: 24px;
    -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
    -webkit-transition: all .3s;
    transition: all .3s;
    outline: none
}

.third-login-container .telegram-section:hover {
    -webkit-box-shadow: none;
    box-shadow: none
}

.third-login-container .telegram-section:active {
    -webkit-box-shadow: 0 0 0 3px rgba(189, 207, 255, .45);
    box-shadow: 0 0 0 3px rgba(189, 207, 255, .45);
    border: 1px solid #ced3de !important;
    background: #f5f6fa
}

.third-login-container .telegram-section:focus {
    -webkit-box-shadow: 0 0 0 3px rgba(189, 207, 255, .45);
    box-shadow: 0 0 0 3px rgba(189, 207, 255, .45);
    border: 1px solid #91b1ff
}

.third-login-container .telegram-section > p {
    margin: 0
}

.third-login-container .is-notsupport-third {
    pointer-events: auto;
    cursor: pointer
}

.third-login-container .is-not-support-tips {
    color: rgba(0, 0, 0, .45);
    margin-top: 20px;
    font-size: 12px;
    text-align: center
}

.third-login-container .google-section {
    width: 100%;
    height: 40px;
    border-radius: 2px;
    border: 1px solid #ced3de;
    cursor: pointer;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: #fff;
    padding-right: 24px;
    -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
    -webkit-transition: all .3s;
    transition: all .3s;
    outline: none
}

.third-login-container .google-section:hover {
    -webkit-box-shadow: none;
    box-shadow: none
}

.third-login-container .google-section:active {
    border: 1px solid #ced3de !important;
    background: #f5f6fa
}

.third-login-container .google-section:active, .third-login-container .google-section:focus {
    -webkit-box-shadow: 0 0 0 3px rgba(189, 207, 255, .45);
    box-shadow: 0 0 0 3px rgba(189, 207, 255, .45)
}

.third-login-container .google-section:focus {
    border: 1px solid #91b1ff
}

.third-login-container .google-section > p {
    margin: 0
}

.third-login-container .auth-transfer-icon {
    width: 24px;
    height: 24px
}

.third-tel-btn-section iframe {
    width: 98% !important
}

@media (max-width: 767px) {
    .third-login-container .site-text {
        width: auto;
        text-align: center;
        font-weight: 500;
        font-size: 14px;
        color: #606f88;
        line-height: 40px
    }
}

.ok-auth-item {
    position: relative;
    width: 100%
}

.ok-auth-item .input-container {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.ok-auth-item .input-box {
    width: 100%;
    height: 40px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    position: relative;
    white-space: nowrap
}

.ok-auth-item .input-box .item-input {
    width: 100%;
    height: 40px;
    padding: 0 26px 0 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    color: #3f475a;
    border-radius: var(--passport-border-radius);
    border: 1px solid var(--passport-input-default-border-color);
    font-size: 14px;
    caret-color: var(--passport-input-default-caret-color);
    outline: none;
    -webkit-transition: all .3s;
    transition: all .3s
}

.ok-auth-item .input-box .item-input::-webkit-input-placeholder {
    opacity: .35;
    font-size: 14px;
    color: #fff;
    text-overflow: ellipsis
}

.ok-auth-item .input-box .item-input:-moz-placeholder {
    opacity: .35;
    font-size: 14px;
    color: #fff;
    text-overflow: ellipsis
}

.ok-auth-item .input-box .item-input::-ms-input-placeholder {
    opacity: .35;
    font-size: 14px;
    color: #fff;
    text-overflow: ellipsis
}

.ok-auth-item .input-box .item-input:hover {
    background: var(--passport-input-hover-background);
    caret-color: var(--passport--input-hover-caret-color)
}

.ok-auth-item .input-box .item-input:focus {
    border: 1px solid var(--passport-input-focus-border-color);
    -webkit-box-shadow: var(--passport-input-focus-shadow);
    box-shadow: var(--passport-input-focus-shadow)
}

.ok-auth-item .input-box .item-input[disabled] {
    border-bottom: 1px solid transparent
}

.ok-auth-item .input-box .item-input:-webkit-autofill {
    caret-color: #3075ee;
    border: 1px solid rgba(0, 0, 0, .1);
    -webkit-box-shadow: 0 0 0 30px #fff inset;
    -webkit-text-fill-color: rgba(0, 0, 0, .85) !important
}

.ok-auth-item .input-box .item-input:-webkit-autofill:focus {
    border: 1px solid #91b1ff
}

.ok-auth-item .input-box .input-title {
    position: absolute;
    top: 20px;
    left: 0;
    display: inline-block;
    line-height: 14px;
    padding-left: 12px;
    font-size: 14px;
    color: rgba(0, 0, 0, .45);
    -webkit-transition: top .2s, font-size .2s;
    transition: top .2s, font-size .2s;
    pointer-events: none
}

.ok-auth-item .input-box .quick-delete {
    display: inline-block;
    position: absolute;
    top: 13px;
    right: 12px;
    width: 14px;
    height: 14px;
    background: #9aa8b7;
    border-radius: 50%;
    cursor: pointer;
    pointer-events: none;
    opacity: 0
}

.ok-auth-item .input-box .quick-delete:after {
    content: "\2715";
    font-size: 12px;
    font-weight: bolder;
    color: #fff;
    display: block;
    width: 14px;
    height: 14px;
    line-height: 14px;
    text-align: center;
    -webkit-transform: scale(.7);
    transform: scale(.7)
}

.ok-auth-item .input-box .quick-delete[data-enable=true] {
    opacity: 1;
    pointer-events: auto;
    -webkit-transition: all .7s;
    transition: all .7s
}

.ok-auth-item .input-box .psw-eye {
    opacity: 0;
    cursor: pointer
}

.ok-auth-item .input-box .psw-eye[data-enable=true] {
    opacity: 1;
    pointer-events: auto;
    -webkit-transition: all .7s;
    transition: all .7s
}

.ok-auth-item .input-box .iconassets_display {
    color: #9aa8b7;
    position: absolute;
    top: 13px;
    right: 12px;
    width: 14px;
    height: 14px
}

.ok-auth-item .input-box .iconicn-eye {
    color: #9aa8b7;
    position: absolute;
    top: 11.5px;
    right: 12px;
    font-size: 20px;
    width: 17px;
    height: 17px
}

.ok-auth-item .input-box .iconicn-eye-slash {
    color: #9aa8b7;
    position: absolute;
    top: 10.5px;
    right: 12px;
    font-size: 20px;
    width: 17px;
    height: 17px
}

.ok-auth-item .input-box .password-level {
    display: inline-block;
    position: absolute;
    height: 4px;
    width: 18px;
    top: 18px;
    right: 12px
}

.ok-auth-item .input-box .password-level .point {
    display: inline-block;
    vertical-align: top;
    width: 4px;
    height: 4px;
    background: rgba(0, 0, 0, .1);
    white-space: nowrap
}

.ok-auth-item .input-box .password-level .point + .point {
    margin-left: 3px
}

.ok-auth-item .input-box .password-level + .quick-delete {
    right: 46px
}

.ok-auth-item .input-box .password-level.strength1 .point:first-child, .ok-auth-item .input-box .password-level.strength2 .point:first-child {
    background: #ee6560
}

.ok-auth-item .input-box .password-level.strength3 .point:first-child, .ok-auth-item .input-box .password-level.strength3 .point:nth-child(2) {
    background: #ff9b00
}

.ok-auth-item .input-box .password-level.strength4 .point {
    background: #4db872
}

.ok-auth-item .drop-list {
    z-index: 1;
    background: #fff;
    position: absolute;
    top: 42px;
    left: 0;
    width: 100%;
    -webkit-box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .15);
    box-shadow: 0 1px 6px 0 rgba(0, 0, 0, .15);
    border-radius: 4px;
    overflow-x: hidden;
    overflow-y: auto;
    max-height: 180px
}

.ok-auth-item .drop-list .drop-item {
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, .25);
    line-height: 20px;
    padding: 8px 12px;
    cursor: pointer;
    word-break: break-all
}

.ok-auth-item .drop-list .drop-item .icon {
    color: #ced3dc;
    font-size: 12px;
    display: inline-block;
    margin-right: 6px
}

.ok-auth-item .drop-list .drop-item .quick-part {
    color: rgba(0, 0, 0, .85)
}

.ok-auth-item[data-error=true] .item-input {
    border: 1px solid #ee6560 !important
}

.ok-auth-item[data-error=true] .input-box, .ok-auth-item[data-error=true] .input-box:hover, .ok-auth-item[data-error=true] .item-input, .ok-auth-item[data-error=true] .item-input:hover {
    -webkit-box-shadow: none !important;
    box-shadow: none !important
}

.ok-auth-item[data-error=true] .error-tips {
    display: block;
    color: #ee6560
}

.ok-auth-item .send-code-btn {
    min-width: 118px;
    max-width: 150px;
    margin-left: 16px;
    height: 40px;
    line-height: 38px;
    border-radius: 4px;
    border: 1px solid #3075ee;
    background-color: #3075ee;
    color: #fff;
    text-align: center;
    font-size: 14px
}

.ok-auth-item .send-code-btn[disabled] {
    border: 1px solid rgba(0, 0, 0, .1);
    background: rgba(0, 0, 0, .05);
    border-radius: 4px;
    color: rgba(0, 0, 0, .25);
    cursor: no-drop
}

.ok-auth-item .error-tips {
    width: 100%;
    min-height: 14px;
    line-height: 14px;
    font-size: 12px;
    margin-top: 5px;
    color: transparent;
    display: none
}

.ok-auth-item .tab-verify-code {
    font-size: 12px;
    line-height: 20px;
    color: rgba(0, 0, 0, .45)
}

.ok-auth-item .tab-verify-code .go-to-email, .ok-auth-item .tab-verify-code .verify-code-text {
    color: #3075ee;
    cursor: pointer
}

.ok-auth-item .tab-verify-code .go-to-email {
    margin-left: 8px
}

@media (max-width: 767px) {
    .ok-auth-item .input-box, .ok-auth-item .input-box .item-input {
        height: 48px
    }

    .ok-auth-item .input-box .quick-delete {
        top: 17px
    }

    .ok-auth-item .input-box .iconicn-eye, .ok-auth-item .input-box .iconicn-eye-slash {
        top: 13.5px
    }

    .ok-auth-item .drop-list {
        top: 50px
    }
}

.ok-auth-new-switch-login {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.ok-auth-new-switch-login .item {
    display: inline-block;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: var(--passport-registerAccountDefault-color);
    line-height: 19px;
    padding-bottom: 4px
}

.ok-auth-new-switch-login .item.only-one {
    color: var(--passport-registerAccountDefault-color);
    cursor: default
}

.ok-auth-new-switch-login .item:last-child {
    color: var(--passport-registerAccountSwitch-color)
}

.ok-auth-new-switch-login .item:first-child {
    cursor: default;
    color: var(--passport-registerAccountDefault-color)
}

.select-area {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-right: 10px
}

.country-box {
    position: absolute;
    width: inherit
}

.hot-title {
    font-size: 12px;
    font-weight: 400;
    color: #60687b;
    line-height: 16px;
    margin-top: 4px;
    padding-left: 8px
}

.split-line {
    height: 30px
}

.country-item {
    font-size: 14px;
    font-weight: 400;
    color: #3f475a;
    line-height: 20px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    height: 28px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 100%
}

.country-item, .country-item .country-name {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.country-item .country-name {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.country-item .country-code {
    -ms-flex-negative: 1;
    flex-shrink: 1;
    color: #061d44;
    font-size: 14px
}

.area-code-text {
    color: #3f475a;
    font-size: 14px
}

.okui-select-option-dialog-container {
    padding: var(--okd-select-mobile-option-container-padding-vertical) 0
}

.okui-select-option.fixed-height {
    max-height: unset;
    height: calc(100% - 32px)
}

.okui-select-option.fixed-height .okui-dialog-scroll-box {
    overflow-y: hidden
}

.okui-select-option.fixed-height .okui-dialog-container, .okui-select-option.fixed-height .okui-dialog-scroll-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.okui-select-option.fixed-height .okui-select-item-container {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: auto;
    overflow-scrolling: touch
}

.okui-select-option-pc {
    max-height: 248px;
    padding-top: var(--okd-select-drop-box-margin-top)
}

.okui-select-option-pc, .okui-select-option-pc .okui-select-option-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.okui-select-option-pc .okui-select-option-box {
    background: var(--okd-select-drop-box-bg);
    border-radius: var(--okd-select-drop-box-border-radius);
    -webkit-box-shadow: var(--okd-select-drop-box-shadow);
    box-shadow: var(--okd-select-drop-box-shadow);
    border: 1px solid var(--okd-select-drop-box-border-color);
    height: 100%;
    overflow: auto;
    padding: 4px 0
}

.okui-select-option-pc .pc-option-scroll {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    overflow: auto;
    overflow-scrolling: touch
}

.okui-select-option-pc .pc-option-footer {
    border-top: thin solid var(--okd-select-common-border-color);
    padding: 12px 16px
}

.okui-select-option-pc.align-left {
    right: unset
}

.okui-select-option-pc.align-right {
    left: unset
}

.okui-select-option-pc.fixed-height {
    height: unset
}

.okui-select-option-pc.fixed-height .pc-option-scroll {
    height: 276px;
    overflow: hidden;
    -webkit-box-flex: 0;
    -ms-flex: 0 0 auto;
    flex: 0 0 auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.okui-select-option-mask {
    z-index: 9800
}

.okui-select .select-popup-reference {
    position: absolute
}

.okui-select-title {
    padding: 4px 16px 0;
    color: var(--okd-select-common-title-color);
    font-size: var(--okd-select-md-title-font-size);
    line-height: var(--okd-select-md-title-font-size)
}

.okui-select-title-inner {
    display: inline-block
}

.okui-select-option-dialog-container .okui-select-item-container {
    padding-top: var(--okd-select-mobile-option-item-container-padding-top)
}

.okui-select-item {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--okd-select-option-default-text-color);
    font-weight: 400;
    min-width: 90px
}

.okui-select-item.okui-select-item-active {
    background: var(--okd-select-option-active-bg);
    color: var(--okd-select-option-active-text-color)
}

.okui-select-item.hover, .okui-select-item:hover {
    background: var(--okd-select-option-hover-bg);
    color: var(--okd-select-option-hover-text-color)
}

.okui-select-item.disabled {
    background: var(--okd-select-option-disabled-bg);
    color: var(--okd-select-option-disabled-text-color);
    cursor: not-allowed
}

.okui-select-item.align-center {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.okui-select-item.align-left {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.okui-select-item.align-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.okui-select-item .common-option-check {
    color: var(--okd-select-check-default-icon-color);
    margin-left: auto;
    display: none
}

.okui-select-item-line {
    height: 0;
    width: 100%;
    border-top: var(--okd-select-option-common-line-height) solid var(--okd-select-option-common-line-color);
    margin: var(--okd-select-option-common-line-margin-vertical) 0
}

.okui-select-item-show-check .okui-select-item-active {
    background: var(--okd-select-option-active-bg)
}

.okui-select-item-show-check .okui-select-item-active .common-option-check {
    display: inline-block
}

.okui-select-empty {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    height: calc(100% - 48px);
    margin-top: 10px
}

.okui-select-empty .empty-icon {
    line-height: 1;
    margin-bottom: 4px;
    font-size: var(--okd-select-md-empty-icon-font-size);
    color: var(--okd-select-empty-default-icon-color)
}

.okui-select-empty .empty-text {
    font-size: var(--okd-select-md-empty-font-size);
    color: var(--okd-select-empty-default-text-color)
}

.option-sm .okui-select-title {
    padding: var(--okd-select-sm-title-padding-top) var(--okd-select-sm-title-padding-horizontal) var(--okd-select-sm-title-padding-bottom);
    font-size: var(--okd-select-sm-title-font-size);
    line-height: var(--okd-select-sm-title-line-height)
}

.option-sm .okui-select-item {
    padding: var(--okd-select-sm-option-padding-vertical) var(--okd-select-sm-option-padding-horizontal)
}

.option-sm .okui-select-item, .option-sm .okui-select-item .common-option-check {
    font-size: var(--okd-select-sm-option-font-size)
}

.option-sm .okui-select-item.custom {
    padding: 0
}

.option-sm .okui-select-empty .empty-icon {
    font-size: var(--okd-select-sm-empty-icon-font-size)
}

.option-sm .okui-select-empty .empty-text {
    font-size: var(--okd-select-sm-empty-font-size)
}

.option-md .okui-select-title {
    padding: var(--okd-select-md-title-padding-top) var(--okd-select-md-title-padding-horizontal) var(--okd-select-md-title-padding-bottom);
    font-size: var(--okd-select-md-title-font-size);
    line-height: var(--okd-select-md-title-line-height)
}

.option-md .okui-select-item {
    padding: var(--okd-select-md-option-padding-vertical) var(--okd-select-md-option-padding-horizontal)
}

.option-md .okui-select-item, .option-md .okui-select-item .common-option-check {
    font-size: var(--okd-select-md-option-font-size)
}

.option-md .okui-select-item.custom {
    padding: 0
}

.option-md .okui-select-empty .empty-icon {
    font-size: var(--okd-select-md-empty-icon-font-size)
}

.option-md .okui-select-empty .empty-text {
    font-size: var(--okd-select-md-empty-font-size)
}

.option-xs .okui-select-title {
    padding: var(--okd-select-xs-title-padding-top) var(--okd-select-xs-title-padding-horizontal) var(--okd-select-xs-title-padding-bottom);
    font-size: var(--okd-select-xs-title-font-size);
    line-height: var(--okd-select-xs-title-line-height)
}

.option-xs .okui-select-item {
    padding: var(--okd-select-xs-option-padding-vertical) var(--okd-select-xs-option-padding-horizontal)
}

.option-xs .okui-select-item, .option-xs .okui-select-item .common-option-check {
    font-size: var(--okd-select-xs-option-font-size)
}

.option-xs .okui-select-item.custom {
    padding: 0
}

.option-xs .okui-select-empty .empty-icon {
    font-size: var(--okd-select-xs-empty-icon-font-size)
}

.option-xs .okui-select-empty .empty-text {
    font-size: var(--okd-select-xs-empty-font-size)
}

.okui-select-input {
    -webkit-box-flex: 0;
    -ms-flex: 0 0 28px;
    flex: 0 0 28px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    background: var(--okd-select-search-input-bg);
    border-radius: var(--okd-select-search-input-border-radius);
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.okui-select-input .common-icon {
    color: var(--okd-select-search-input-icon-color)
}

.okui-select-input .common-input {
    margin-left: 6px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    color: var(--okd-select-search-input-color);
    border: 0;
    background: transparent;
    outline: none;
    min-width: 0;
    font-family: inherit
}

.okui-select-input .common-input::-webkit-input-placeholder {
    color: var(--okd-select-search-input-placeholder-color)
}

.okui-select-input .common-input:-ms-input-placeholder {
    color: var(--okd-select-search-input-placeholder-color)
}

.okui-select-input .common-input::-ms-input-placeholder {
    color: var(--okd-select-search-input-placeholder-color)
}

.okui-select-input .common-input::placeholder {
    color: var(--okd-select-search-input-placeholder-color)
}

.option-sm .okui-select-input {
    margin: var(--okd-select-sm-search-margin-vertical) var(--okd-select-sm-search-margin-horizontal);
    height: var(--okd-select-sm-search-height);
    padding: var(--okd-select-sm-search-padding-vertical) var(--okd-select-sm-search-padding-horizontal)
}

.option-sm .okui-select-input .common-icon {
    font-size: var(--okd-select-sm-search-icon-size)
}

.option-sm .okui-select-input .common-input {
    font-size: var(--okd-select-sm-search-input-font-size)
}

.option-md .okui-select-input {
    margin: var(--okd-select-md-search-margin-vertical) var(--okd-select-md-search-margin-horizontal);
    height: var(--okd-select-md-search-height);
    padding: var(--okd-select-md-search-padding-vertical) var(--okd-select-md-search-padding-horizontal)
}

.option-md .okui-select-input .common-icon {
    font-size: var(--okd-select-md-search-icon-size)
}

.option-md .okui-select-input .common-input {
    font-size: var(--okd-select-md-search-input-font-size)
}

.option-xs .okui-select-input {
    margin: var(--okd-select-xs-search-margin-vertical) var(--okd-select-xs-search-margin-horizontal);
    height: var(--okd-select-xs-search-height);
    padding: var(--okd-select-xs-search-padding-vertical) var(--okd-select-xs-search-padding-horizontal)
}

.option-xs .okui-select-input .common-icon {
    font-size: var(--okd-select-xs-search-icon-size)
}

.option-xs .okui-select-input .common-input {
    font-size: var(--okd-select-xs-search-input-font-size)
}

.okui-select .select-up {
    -webkit-transition: -webkit-transform .2s linear;
    transition: -webkit-transform .2s linear;
    transition: transform .2s linear;
    transition: transform .2s linear, -webkit-transform .2s linear
}

.okui-select .select-up-active {
    -webkit-transform: rotate(180deg);
    transform: rotate(180deg)
}

.okui-select {
    position: relative;
    cursor: pointer;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.okui-select.text-select {
    display: inline-block
}

.okui-select-value {
    cursor: pointer;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: var(--okd-select-md-text-font-size)
}

.okui-select-value .value {
    margin-right: 8px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: var(--okd-select-common-text-color);
    width: 100%
}

.okui-select-value .placeholder {
    color: var(--okd-select-common-placeholder-color)
}

.okui-select-value .disabled {
    cursor: not-allowed
}

.okui-select-value .icon-sign {
    margin-left: auto;
    font-size: var(--okd-select-input-select-default-icon-size);
    margin-right: 4px;
    color: var(--okd-select-input-select-default-icon-color);
    -webkit-transition: -webkit-transform .2s linear;
    transition: -webkit-transform .2s linear;
    transition: transform .2s linear;
    transition: transform .2s linear, -webkit-transform .2s linear
}

.okui-select-inner-box, .okui-select-inner-box input[readonly] {
    cursor: pointer
}

.input-sm.okui-select-value {
    font-size: var(--okd-select-sm-text-font-size)
}

.input-md.okui-select-value {
    font-size: var(--okd-select-md-text-font-size)
}

.input-xs.okui-select-value {
    font-size: var(--okd-select-xs-text-font-size)
}

.okui-select-value {
    width: 100%
}

.okui-select-text-value {
    cursor: pointer;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    font-size: var(--okd-select-md-text-font-size);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.okui-select-text-value.align-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.okui-select-text-value .value {
    color: var(--okd-select-text-select-default-font-color)
}

.okui-select-text-value .icon-sign, .okui-select-text-value .value {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.okui-select-text-value .icon-sign {
    font-size: var(--okd-select-text-select-default-icon-size);
    margin-left: 6px;
    margin-right: 0;
    color: var(--okd-select-text-select-default-icon-color)
}

.okui-select-text-value:hover .value {
    color: var(--okd-select-text-select-hover-font-color)
}

.okui-select-text-value:hover .icon-sign {
    color: var(--okd-select-text-select-hover-icon-color)
}

.okui-select-text-value.focus .value {
    color: var(--okd-select-text-select-select-font-color)
}

.okui-select-text-value.focus .icon-sign {
    color: var(--okd-select-text-select-select-icon-color)
}

.okui-select-text-value.disabled {
    cursor: not-allowed
}

.okui-select-text-value.disabled .value {
    color: var(--okd-select-text-select-disabled-font-color)
}

.okui-select-text-value.disabled .icon-sign {
    color: var(--okd-select-text-select-disabled-icon-color)
}

.input-sm.okui-select-text-value {
    font-size: var(--okd-select-sm-text-font-size)
}

.input-md.okui-select-text-value {
    font-size: var(--okd-select-md-text-font-size)
}

.input-xs.okui-select-text-value {
    font-size: var(--okd-select-xs-text-font-size)
}

@font-face {
    font-family: iconfont;
    src: url("data:application/x-font-woff2;charset=utf-8;base64,d09GMgABAAAAAAU0AAsAAAAACsgAAATkAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAAHFQGYACENgqFfIUKATYCJAMsCxgABCAFhGcHgXkbeQkjERaMFrJ/JGRnMjcEUxF73nhUVRX1HWKtfTTROBMP/+1Hu29mvq8pYhJpnG4a4oYE3kRLJJknmoZK9tD3f/Ky32Rdg8mMW6cAMoVyKujr7jMHC91anxaeTZ1lbZ/mZw1LcOz6tONqSGTHNZ6s0tVYq69NLORtr72p3t+LK2qJKBoi8yEhLqEQOsN0QqfUhgp4Nh0OzcpOP0Wgt48P5GhIVBLILKWWF4KGc5zZQd4YSzlEKlyaYKWHHVpTzR5ZxGMV6U56AjyKvz/+cYhLJFXmXOtYVnAG3Nh/ctKAksukS+gH5P4GYOuEChm7zsweT/u9TyCn2V1QfdvfqLgKYI4cVP3rx8HG4eFR9VH90fujTyeMk8qTBrEYGc6ZL8y5/+CBVqVTa/SKkGSiBv2IQb2Nenda4fNo+b3Bo+LPIY+Ov9U8av7WI40a3gPpYfgEHoX/DB7B/0okwdAAg7eNPBwxB4ziC0BsBYd2CmYm4cpKodTgXkZZ17+gJINKyKtJ1+G3RUIh8AmCPSXvinyxAUrVcoiX1i0UiiQsEMBM+32I9KEFZeuBYaWU/m6VtMFRVduhJeU65uCYqudUnDFAKtH751U8UJl5QZtEuPFB3j5ClDJGC8qJrKRMAid4aUmibuWBkW7S/DsS1JAqbWjwilR3vzI2wMokZOrWqGukWflytwW+yrtOmWN5lEDA98N2STKzXuWfq/S0WuK7+XxSIKDSL8oTCl2LQ3v7fxv0aPdxqtv9B5BuX265YY/uALuiPTCKzDXZGxxwknXqcJIeTY9roXn36YwVF4/p9HnRWuJQ05Tw8BRTEEdLCiv8iR+EcYXnX1TIDNDBuHQm/wqw1ycFkoRSe1F7AO2vJ66AA9ECsIcSAVNHVQoX5Xd2FC4pICV/UaFKH9o+R5K1gThAR5vBqIYkXAPa72TZVWBYYqKVytTHFQgNZelVZGNfZT4QS+UTSNOT4PxL0F51Tu4Cn8W6dB26Lzgf2DBwDnbWR2D9YYO/ywrOSTjHs1fAHwkuD/esk+1809NjcFH/2BoDvUNxulqGHObuhEtlaqcFRrEtHB0xe3ssyx5XVhZur8kqSBCFpi/gRPMV5G/MPYtYPeZhEgHSpzgD5MtIGgDpVjyTzR7FV8jrEBDu53TTvwkZ/Wv+jucTwVNC1utbK1nAz8hbksDF8Wyt8d7gj2hATllWmH2Mid9LYLB1z7JQ27vT+OcFp3zav3GaThPaksKGpLESstYGYqHugMrgANRaR6C3U/Dxg2nFgIrSYYsWgTBhBZIxHyCbcJ9YqCKozNmH2oR/0DtzIG7OJskk5jdCxbiAvoCbczKeieNOv9EegqKm1D9SdUjA2A3VwhcmpF3sU492YjZgKEf4tK6HIWQolPc4c7cyl13fm7ZP6eYcmzcEKQwtgHYBnFmWmHBqLv+8b8g6CBQiif9uUg2Zdg5GnYEgfukTNeSZrF8dWRPGjLGdQbIIfK7cKLjZDJT2zfbQjHXWLdLFTq9TGVbfHd8YXz2ZPQLn4pKRIkeJKupooo0u+hhihOQTOF1UVDSvm7cVj5RTHVM8vfTtc0It8oGDSyhq9DZWIbRLPqW7hXJJ3KKW92CV5d7Nqe0ytiNWtMFCaw8mp5IN2J224VJWG289Jaunb4zS7oS04XnPj8vD4eVna20aAAAA") format("woff2"), url(/cdn/assets/okfe/login/0.9.3/fonts/iconfont.d6866d2.woff) format("woff"), url(/cdn/assets/okfe/login/0.9.3/fonts/iconfont.22f9904.ttf) format("truetype")
}

.icon-icon_search:before {
    content: "\EC59"
}

.icon-Chevrons1:before {
    content: "\EC76"
}

.icon-Chevrons2:before {
    content: "\EC7D"
}

.icon-icon_web_outline_sm_small-down:before {
    content: "\EADE"
}

.icon-dropdown_spread:before {
    content: "\E8AD"
}

.icon-icn-small-down-outline-lg:before {
    content: "\EA78"
}

.icon-icn-small-triangle-down-glyph-lg:before {
    content: "\EA7C"
}

.icon-kline-down:before {
    content: "\E7CC"
}

.icon-fabi_selected:before {
    content: "\E9E9"
}

.icon-icon_web_outline_sm_search:before {
    content: "\EADB"
}

.okui-dialog {
    width: 100%;
    height: 100%;
    pointer-events: none
}

.okui-dialog-float {
    position: fixed;
    left: 0;
    top: 0
}

.okui-dialog * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    -webkit-tap-highlight-color: transparent
}

.okui-dialog-window-float {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%)
}

.okui-dialog-window {
    margin-left: auto;
    margin-right: auto;
    border-radius: var(--okd-dialog-window-border-radius);
    -webkit-box-shadow: var(--okd-dialog-window-box-shadow);
    box-shadow: var(--okd-dialog-window-box-shadow);
    width: calc(100% - 32px);
    max-height: calc(100% - 32px);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    pointer-events: auto
}

@media (max-width: 767px) {
    .okui-dialog-window.full-page {
        min-height: calc(100% - 32px) !important;
        height: auto !important
    }

    .okui-dialog-window.bottom-align {
        top: auto;
        bottom: 0;
        border-radius: var(--okd-dialog-window-border-radius) var(--okd-dialog-window-border-radius) 0 0;
        -webkit-transform: translate(-50%);
        transform: translate(-50%)
    }

    .okui-dialog-window.no-margin {
        width: 100%
    }
}

.okui-dialog-title-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.okui-dialog-title-container .title-center {
    text-align: center
}

.okui-dialog-title-block {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.okui-dialog-title-block .modal-title {
    font-weight: 500;
    font-size: var(--okd-dialog-title-font-size);
    line-height: var(--okd-dialog-title-line-height)
}

.okui-dialog-title-block .modal-sub-title {
    font-weight: 400;
    font-size: var(--okd-dialog-sub-title-font-size);
    line-height: var(--okd-dialog-sub-title-line-height);
    margin-top: 2px
}

.okui-dialog-top-between-fixed {
    position: absolute;
    top: 0
}

.okui-dialog-top-l {
    left: 0
}

.okui-dialog-top-r {
    right: 0
}

.okui-dialog-b-btn, .okui-dialog-c-btn {
    position: relative;
    display: inline-block;
    width: var(--okd-dialog-window-close-icon-size);
    height: var(--okd-dialog-window-close-icon-size);
    vertical-align: middle;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    cursor: pointer;
    z-index: 1;
    line-height: 1
}

.okui-dialog-b-btn.icon, .okui-dialog-c-btn.icon {
    font-size: var(--okd-dialog-window-close-icon-size)
}

.okui-dialog-b-btn:after, .okui-dialog-c-btn:after {
    position: absolute;
    display: block;
    content: " ";
    width: calc(var(--okd-dialog-window-close-icon-size) * 2);
    height: calc(var(--okd-dialog-window-close-icon-size) * 2);
    top: -50%;
    left: -50%
}

.okui-dialog-b-btn {
    width: var(--okd-dialog-window-back-icon-size);
    height: var(--okd-dialog-window-back-icon-size);
    margin-right: 16px
}

.okui-dialog-b-btn.icon {
    font-size: var(--okd-dialog-window-back-icon-size)
}

.okui-dialog-c-btn {
    margin-left: 16px
}

.okui-dialog-top-hidden-for-t-center {
    pointer-events: none;
    visibility: hidden
}

.okui-dialog-top-hidden-for-t-left {
    display: none
}

.okui-dialog-scroll-box {
    overflow-y: auto;
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

.okui-dialog-scroll-box.scroll-disable {
    overflow-y: unset
}

.okui-dialog-container, .okui-dialog-customer-box {
    height: 100%
}

.okui-dialog-container.no-padding, .okui-dialog-customer-box.no-padding {
    padding: 0
}

@supports (bottom:constant(safe-area-inset-bottom)) or (bottom:env(safe-area-inset-bottom)) {
    .okui-dialog-footer-box {
        margin-bottom: env(safe-area-inset-bottom)
    }
}

.okui-dialog .okui-dialog-footer-box {
    border-top: thin solid var(--okd-dialog-window-split-line-border-color)
}

.okui-dialog-btn-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.okui-dialog-btn-box.layout-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.okui-dialog-btn-box.layout-left {
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start
}

.okui-dialog-btn-box.layout-full .dialog-btn {
    -webkit-box-flex: 1;
    -ms-flex-positive: 1;
    flex-grow: 1
}

@media (max-width: 767px) {
    .okui-dialog-title-container {
        padding: var(--okd-dialog-title-box-sm-padding-vertical) var(--okd-dialog-container-sm-padding-horizontal)
    }

    .okui-dialog-top-between-fixed {
        padding: var(--okd-dialog-container-sm-padding-horizontal)
    }

    .okui-dialog-container {
        padding: var(--okd-dialog-container-sm-padding-vertical) var(--okd-dialog-container-sm-padding-horizontal)
    }

    .okui-dialog-customer-box {
        padding: 0 var(--okd-dialog-container-sm-padding-horizontal)
    }

    .okui-dialog-footer-box {
        padding: var(--okd-dialog-footer-box-sm-padding-vertical) var(--okd-dialog-container-sm-padding-horizontal)
    }

    .okui-dialog-btn-box .dialog-btn {
        width: 100%
    }

    .okui-dialog-btn-box .dialog-btn.double-btn {
        width: auto
    }

    .okui-dialog-btn-box .dialog-btn + .dialog-btn {
        margin-left: 12px
    }

    .okui-dialog-btn-box.layout-full {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse
    }

    .okui-dialog-btn-box.layout-full .dialog-btn + .dialog-btn {
        margin-left: 0
    }

    .okui-dialog-btn-box.layout-full .double-btn:first-child {
        margin-top: 12px
    }
}

@media (min-width: 768px) {
    .okui-dialog-window {
        width: auto;
        min-width: var(--okd-dialog-window-min-width)
    }

    .okui-dialog-title-container {
        padding: var(--okd-dialog-title-box-md-padding-vertical) var(--okd-dialog-container-md-padding-horizontal)
    }

    .okui-dialog-top-between-fixed {
        padding: var(--okd-dialog-container-md-padding-horizontal)
    }

    .okui-dialog-container {
        padding: var(--okd-dialog-container-md-padding-vertical) var(--okd-dialog-container-md-padding-horizontal)
    }

    .okui-dialog-customer-box {
        padding: 0 var(--okd-dialog-container-md-padding-horizontal)
    }

    .okui-dialog-footer-box {
        padding: var(--okd-dialog-footer-box-md-padding-vertical) var(--okd-dialog-container-md-padding-horizontal)
    }

    .okui-dialog-btn-box.layout-full {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row
    }

    .okui-dialog-btn-box .dialog-btn + .dialog-btn {
        margin-left: 16px
    }
}

.okui-dialog .okui-dialog-window {
    background: var(--okd-dialog-window-background);
    color: var(--okd-dialog-window-default-text-color)
}

.okui-dialog .okui-dialog-window.container-mode {
    background: transparent;
    -webkit-box-shadow: none;
    box-shadow: none
}

.okui-dialog .okui-dialog-title-container {
    border-bottom: thin solid var(--okd-dialog-window-split-line-border-color)
}

.okui-dialog .okui-dialog-title-container .modal-title {
    color: var(--okd-dialog-title-color)
}

.okui-dialog .okui-dialog-title-container .modal-sub-title {
    color: var(--okd-dialog-sub-title-color)
}

.okui-dialog .okui-dialog-b-btn, .okui-dialog .okui-dialog-c-btn {
    color: var(--okd-dialog-window-close-btn-color)
}

.okui-dialog-mask {
    background: var(--okd-dialog-window-mask-color)
}

.okui-dialog.okui-action-dialog .okui-dialog-window.no-radius {
    border-radius: 0
}

.okui-dialog.okui-action-dialog .okui-dialog-close-box {
    color: var(--okd-dialog-action-close-btn-color)
}

.okui-dialog.okui-action-dialog .okui-action-dialog-close {
    font-size: 14px;
    line-height: 24px;
    min-height: 24px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.okui-dialog-group {
    overflow: hidden
}

.okui-dialog-group-window, .okui-dialog.okui-tip-dialog .okui-dialog-tip-content {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.okui-dialog.okui-tip-dialog .okui-dialog-tip-content {
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    margin-bottom: 8px
}

.okui-dialog.okui-tip-dialog .okui-dialog-tip-content .tip-title-box {
    width: 100%
}

.okui-dialog.okui-tip-dialog .okui-dialog-tip-content .tip-title {
    min-height: var(--okd-dialog-tip-title-line-height);
    line-height: var(--okd-dialog-tip-title-line-height);
    font-size: var(--okd-dialog-tip-title-font-size);
    font-weight: 500;
    margin-top: 16px
}

.okui-dialog.okui-tip-dialog .okui-dialog-tip-content .tip-title + .tip-title {
    margin-top: 0
}

.okui-dialog.okui-tip-dialog .okui-dialog-tip-content .tip-detail {
    margin-top: 8px;
    line-height: var(--okd-dialog-tip-detail-line-height);
    font-size: var(--okd-dialog-tip-detail-font-size);
    font-weight: 400
}

.okui-dialog.okui-tip-dialog .okui-dialog-tip-content .tip-detail + .tip-detail {
    margin-top: 2px
}

.okui-dialog.okui-tip-dialog .okui-dialog-tip-content .tip-title {
    color: var(--okd-dialog-tip-title-color)
}

.okui-dialog.okui-tip-dialog .okui-dialog-tip-content .tip-detail {
    color: var(--okd-dialog-tip-detail-color)
}

.okui-dialog.okui-tip-dialog .okui-dialog-footer-box {
    border-top: none
}

@media (max-width: 767px) {
    .okui-dialog.okui-tip-dialog .okui-dialog-window.bottom-align {
        bottom: 16px;
        border-radius: 4px
    }

    .okui-dialog.okui-tip-dialog .okui-dialog-footer-box {
        padding: 0 var(--okd-dialog-container-sm-padding-horizontal) var(--okd-dialog-tip-footer-box-sm-padding-vertical) var(--okd-dialog-container-sm-padding-horizontal)
    }
}

@media (min-width: 768px) {
    .okui-dialog.okui-tip-dialog .okui-dialog-tip-content {
        max-width: var(--okd-dialog-tip-window-min-width);
        margin-left: auto;
        margin-right: auto
    }

    .okui-dialog.okui-tip-dialog .okui-dialog-tip-content.two-btn {
        max-width: var(--okd-dialog-tip-window-2btn-min-width)
    }

    .okui-dialog.okui-tip-dialog .okui-dialog-footer-box {
        padding: 0 var(--okd-dialog-container-md-padding-horizontal) var(--okd-dialog-tip-footer-box-md-padding-vertical) var(--okd-dialog-container-md-padding-horizontal)
    }
}

.okui-dialog-tip-icon-bg {
    width: var(--okd-dialog-tip-icon-bg-size);
    min-width: var(--okd-dialog-tip-icon-bg-size);
    height: var(--okd-dialog-tip-icon-bg-size);
    line-height: var(--okd-dialog-tip-icon-bg-size);
    border-radius: 50%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.okui-dialog-tip-icon-bg .tip-icon {
    font-size: var(--okd-dialog-tip-icon-font-size)
}

.alert-icon {
    margin-top: -6px
}

.success-icon-bg {
    background-color: var(--okd-dialog-tip-success-icon-bg)
}

.success-icon {
    color: var(--okd-dialog-tip-success-icon-color)
}

.info-icon-bg {
    background-color: var(--okd-dialog-tip-info-icon-bg)
}

.info-icon {
    color: var(--okd-dialog-tip-info-icon-color)
}

.prompt-icon-bg {
    background-color: var(--okd-dialog-tip-prompt-icon-bg)
}

.prompt-icon {
    color: var(--okd-dialog-tip-prompt-icon-color)
}

.warn-icon-bg {
    background-color: var(--okd-dialog-tip-warn-icon-bg)
}

.warn-icon {
    color: var(--okd-dialog-tip-warn-icon-color)
}

.alert-icon-bg {
    background-color: var(--okd-dialog-tip-alert-icon-bg)
}

.alert-icon {
    color: var(--okd-dialog-tip-alert-icon-color)
}

.error-icon-bg {
    background-color: var(--okd-dialog-tip-error-icon-bg)
}

.error-icon {
    color: var(--okd-dialog-tip-error-icon-color)
}

.okui-transition-fade {
    will-change: opaticy;
    -webkit-transition: opacity .3s linear;
    transition: opacity .3s linear
}

.okui-transition-fade-ease-out {
    -webkit-transition-timing-function: cubic-bezier(.5, 0, .52, 1);
    transition-timing-function: cubic-bezier(.5, 0, .52, 1)
}

.okui-transition-fade-entered, .okui-transition-fade-entering {
    opacity: 1
}

.okui-transition-fade-exited, .okui-transition-fade-exiting {
    opacity: 0
}

.okui-transition-slide {
    will-change: transform, opacity;
    -webkit-transition: opacity .3s linear, -webkit-transform .3s linear;
    transition: opacity .3s linear, -webkit-transform .3s linear;
    transition: transform .3s linear, opacity .3s linear;
    transition: transform .3s linear, opacity .3s linear, -webkit-transform .3s linear;
    position: fixed;
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
}

.okui-transition-slide-cubic {
    -webkit-transition-timing-function: cubic-bezier(.215, .61, .355, 1);
    transition-timing-function: cubic-bezier(.215, .61, .355, 1)
}

.okui-transition-slide-bottom {
    width: 100%;
    left: 0;
    bottom: 0
}

.okui-transition-slide-right {
    height: 100%;
    right: 0;
    top: 0
}

.okui-transition-slide-entered.okui-transition-slide-bottom, .okui-transition-slide-entering.okui-transition-slide-bottom {
    -webkit-transform: translateY(0);
    transform: translateY(0)
}

.okui-transition-slide-entered.okui-transition-slide-right, .okui-transition-slide-entering.okui-transition-slide-right {
    -webkit-transform: translateX(0);
    transform: translateX(0)
}

.okui-transition-slide-entered.okui-transition-slide-fade, .okui-transition-slide-entering.okui-transition-slide-fade {
    opacity: 1
}

.okui-transition-slide-exited.okui-transition-slide-bottom, .okui-transition-slide-exiting.okui-transition-slide-bottom {
    -webkit-transform: translateY(100%);
    transform: translateY(100%)
}

.okui-transition-slide-exited.okui-transition-slide-right, .okui-transition-slide-exiting.okui-transition-slide-right {
    -webkit-transform: translateX(100%);
    transform: translateX(100%)
}

.okui-transition-slide-exited.okui-transition-slide-fade, .okui-transition-slide-exiting.okui-transition-slide-fade {
    opacity: 0
}

.okui-mask {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: rgba(14, 18, 27, .41)
}

.form-phone-item {
    width: 100%
}

.form-phone-item .form-phone-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 40px;
    position: relative;
    border: 1px solid var(--passport-input-default-border-color);
    border-radius: var(--passport-border-radius);
    background: #fff
}

.form-phone-item .form-phone-section:hover {
    background: var(--passport-input-hover-background);
    caret-color: var(--passport--input-hover-caret-color)
}

.form-phone-item .form-phone-section-active {
    border: 1px solid var(--passport-input-focus-border-color) !important;
    -webkit-box-shadow: var(--passport-input-focus-shadow);
    box-shadow: var(--passport-input-focus-shadow);
    background: var(--passport-input-focus-background) !important
}

.form-phone-item .input-section {
    -webkit-box-flex: 1;
    -ms-flex: auto;
    flex: auto;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding-left: 7px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.form-phone-item .input-section .area-code-text {
    color: #3f475a;
    font-size: 14px
}

.form-phone-item .form-input {
    outline: none;
    margin-left: 5px;
    color: #3f475a;
    font-size: 14px;
    border: none;
    width: 100%
}

.form-phone-item input::-webkit-input-placeholder {
    color: #9aa1b1
}

.form-phone-item input:-moz-placeholder, .form-phone-item input::-moz-placeholder {
    color: #9aa1b1
}

.form-phone-item input:-ms-input-placeholder {
    color: #9aa1b1
}

.form-phone-item .icon-Unfold {
    font-size: 9px;
    color: #60687b
}

@media (max-width: 767px) {
    .form-phone-item .form-phone-section {
        height: 48px
    }
}

.bind-new-account-tip-container .bind-account-icon {
    width: 80px
}

.bind-new-account-tip-container .bind-icon {
    text-align: center
}

.bind-new-account-tip-container .new-account {
    font-weight: 500
}

.bind-new-account-tip-container .bind-new-title {
    font-size: 30px;
    font-weight: 500;
    color: #1f2533;
    line-height: 46px;
    margin-top: 20px;
    text-align: center
}

.bind-new-account-tip-container .bind-new-tips {
    font-size: 14px;
    color: #3f475a;
    line-height: 24px;
    margin-top: 4px;
    text-align: center
}

.bind-new-account-tip-container .bind-new-error-section {
    background: rgba(238, 101, 96, .1);
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 8px 0 8px 13px;
    margin-top: 25px;
    margin-bottom: -30px;
    text-align: center
}

.bind-new-account-tip-container .bind-new-error-section .iconclose-circle {
    color: #ee6560;
    font-size: 14px;
    margin: 2px 9px 0 0
}

@media (max-width: 767px) {
    .bind-new-account-tip-container .bind-icon, .bind-new-account-tip-container .bind-new-tips, .bind-new-account-tip-container .bind-new-title {
        text-align: left
    }
}

.bind-succ-container .bind-icon {
    text-align: center
}

.bind-succ-container .bind-account-icon {
    width: 80px
}

.bind-succ-container .bind-new-title {
    font-size: 30px;
    font-weight: 500;
    color: #1f2533;
    line-height: 46px;
    margin-top: 20px;
    text-align: center
}

.bind-succ-container .bind-new-tips {
    font-size: 14px;
    color: #3f475a;
    line-height: 24px;
    margin-top: 4px;
    text-align: center
}

@media (max-width: 767px) {
    .bind-succ-container .bind-icon, .bind-succ-container .bind-new-tips, .bind-succ-container .bind-new-title {
        text-align: left
    }
}

.link-account-container .title-box {
    text-align: center;
    margin-bottom: 16px
}

.link-account-container .title-box .login-title {
    color: #1f2533;
    font-size: 30px;
    font-weight: 500;
    line-height: 46px;
    margin-top: -8px;
    display: inline-block
}

.link-account-container .title-box .login-tips {
    font-size: 14px;
    color: #3f475a;
    line-height: 24px;
    margin-top: 4px
}

.link-account-container .title-box .login-register-btn {
    display: inline-block;
    font-size: 16px;
    font-weight: 400;
    color: #3075ee;
    line-height: 44px;
    float: right;
    cursor: pointer
}

.link-account-container .title-box:after {
    display: block;
    content: "";
    clear: both
}

.link-account-container .back-login {
    font-size: 16px;
    font-weight: 500;
    color: #2450be;
    line-height: 23px;
    text-align: center;
    margin-top: 22px;
    cursor: pointer
}

.link-account-container .pwd-account {
    font-weight: 500
}

.link-account-container .error-section {
    background: #ffe7e7;
    border-radius: 2px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-top: 15px;
    margin-bottom: -5px;
    padding: 16px 24px 16px 18px
}

.link-account-container .error-section .error-msg {
    line-height: 20px;
    display: inline-block;
    vertical-align: top;
    color: #9c2c2c;
    font-size: 14px;
    font-weight: 500
}

.link-account-container .error-section .iconclose-circle {
    color: #e35e5e;
    font-size: 19.2px;
    margin: 0 15px 0 0
}

@media (max-width: 767px) {
    .link-account-container .title-box {
        text-align: left
    }

    .link-account-container .submit-btn {
        height: 48px
    }
}

.device-verify-container {
    position: relative;
    height: 100%
}

.device-verify-container .device-title {
    font-size: 14px;
    line-height: 20px;
    color: var(--passport--device-text-title-color)
}

.device-verify-container .device-container .device-list {
    margin-top: 20px
}

.device-verify-container .device-container .device-list .device-item {
    min-height: 88px;
    background: #f7f9fc;
    padding: 20px;
    border-radius: 6px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    vertical-align: middle;
    margin-bottom: 10px;
    cursor: pointer
}

.device-verify-container .device-container .device-list .device-item .device-icon {
    height: -webkit-fit-content;
    height: -moz-fit-content;
    height: fit-content;
    margin-top: 5px
}

.device-verify-container .device-container .device-list .device-item .device-icon.phone-icon {
    width: 14px
}

.device-verify-container .device-container .device-list .device-item .device-icon.computer-icon {
    width: 18px
}

.device-verify-container .device-container .device-list .device-item .device-info {
    margin-left: 20px
}

.device-verify-container .device-container .device-list .device-item .device-info .device-name {
    font-size: 16px;
    line-height: 24px;
    color: var(--passport--device-text-device-color);
    font-weight: 500
}

.device-verify-container .device-container .device-list .device-item .device-info .device-desc {
    font-size: 14px;
    line-height: 20px;
    margin-top: 6px;
    color: var(--passport--device-text-device-desc-color)
}

.device-verify-container .device-container .device-lost {
    margin-top: 32px
}

.device-verify-container .device-disabled {
    text-align: right;
    margin-top: 20px;
    font-size: 14px;
    line-height: 16px;
    color: var(--passport--device-text-device-desc-color)
}

.device-verify-container .telephone-container .telephone-title {
    font-size: 22px;
    color: var(--passport--device-text-device-color)
}

.device-verify-container .telephone-container .telephone-desc {
    margin-top: 8px
}

.device-verify-container .telephone-container .device-disabled {
    margin-top: 50px
}

.device-verify-container .telephone-container .device-disabled .device-lost {
    margin-top: 32px;
    margin-bottom: 24px
}

.device-verify-container .telephone-container .phone-number {
    font-size: 14px;
    line-height: 24px;
    color: var(--passport--device-text-device-color)
}

.device-verify-container .refuse-container {
    padding-top: 87px;
    padding-bottom: 80px;
    text-align: center;
    width: 600px
}

.device-verify-container .refuse-container img {
    width: 51px
}

.device-verify-container .refuse-container p {
    margin-top: 31px;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    color: var(--passport--device-text-device-color)
}

@media (max-width: 767px) {
    .device-verify-container .device-disabled .phone-lost {
        position: absolute;
        right: 16px;
        bottom: 16px
    }

    .device-verify-container .telephone-container .device-disabled .phone-lost {
        margin-bottom: 0
    }

    .device-verify-container .refuse-container {
        width: auto
    }
}

.device-verify-container .device-link {
    cursor: pointer;
    color: var(--passport--device-text-device-link-color);
    white-space: nowrap
}

.device-verify-container .verify-call {
    margin-top: 22px;
    width: -webkit-fit-content;
    width: -moz-fit-content;
    width: fit-content;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.device-verify-container .verify-call span {
    font-weight: 500;
    font-size: 16px;
    line-height: 20px
}

.device-verify-container .verify-call img {
    width: 17px;
    margin-left: 10px
}

.okui-notification {
    margin: 0;
    padding: 0;
    position: fixed;
    top: 0;
    left: 0;
    pointer-events: none;
    line-height: 1;
    width: 100vw;
    height: 100vh;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.okui-notification, .okui-notification * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.okui-notification-container.container-remove {
    -webkit-animation-name: NotificationOutTop;
    animation-name: NotificationOutTop;
    -webkit-animation-duration: .55s;
    animation-duration: .55s
}

.okui-notification-box {
    position: relative;
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    background: var(--okd-notification-box-background);
    -webkit-box-shadow: var(--okd-notification-box-shadow);
    box-shadow: var(--okd-notification-box-shadow);
    border-radius: var(--okd-notification-box-border-radius);
    max-width: var(--okd-notification-box-max-width);
    min-width: var(--okd-notification-box-min-width);
    padding: var(--okd-notification-box-padding);
    margin: calc(var(--okd-notification-box-each-margin) / 2) 0;
    overflow: hidden;
    -webkit-animation-duration: .3s;
    animation-duration: .3s;
    line-height: 1;
    pointer-events: all;
    border: thin solid var(--okd-notification-box-border-color)
}

.okui-notification-box.auto-width {
    min-width: var(--okd-notification-box-auto-width-min-width)
}

.okui-notification-box .okui-notification-icon-circle {
    border-radius: 50%;
    display: inline-block;
    width: 20px;
    min-width: 20px;
    height: 20px;
    vertical-align: top;
    border: 2px solid;
    margin-right: var(--okd-notification-box-icon-text-margin)
}

.okui-notification-box .okui-notification-icon {
    width: 100%;
    height: 100%;
    font-size: 14px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.okui-notification-box .okui-notification-content {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.okui-notification-box .okui-notification-inline {
    -webkit-box-orient: unset;
    -webkit-box-direction: unset;
    -ms-flex-direction: unset;
    flex-direction: unset
}

.okui-notification-box .okui-notification-title-box {
    display: -webkit-inline-box;
    display: -ms-inline-flexbox;
    display: inline-flex;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column
}

.okui-notification-box .okui-notification-title {
    font-size: var(--okd-notification-title-font-size);
    line-height: var(--okd-notification-title-line-height);
    color: var(--okd-notification-title-color);
    font-weight: 500;
    text-align: left;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    -ms-flex-negative: 0;
    flex-shrink: 0
}

.okui-notification-box .okui-notification-desc, .okui-notification-box .okui-notification-text {
    font-size: var(--okd-notification-text-font-size);
    line-height: var(--okd-notification-text-line-height);
    color: var(--okd-notification-text-color)
}

.okui-notification-box .okui-notification-desc {
    text-align: left;
    margin-top: 4px;
    width: 100%
}

.okui-notification-box .okui-notification-action {
    pointer-events: auto;
    margin-top: 12px;
    text-align: left;
    width: 100%;
    display: inline-block
}

.okui-notification-box .okui-notification-action .action-undo {
    color: var(--okd-notification-action-confirm-btn-color)
}

.okui-notification-box .okui-notification-action .action-dismiss, .okui-notification-box .okui-notification-action .action-undo {
    cursor: pointer;
    font-size: var(--okd-notification-action-font-size);
    line-height: var(--okd-notification-action-line-height);
    font-weight: 500
}

.okui-notification-box .okui-notification-action .action-dismiss {
    color: var(--okd-notification-action-cancel-btn-color)
}

.okui-notification-box .okui-notification-action .action-undo + .action-dismiss {
    margin-left: 16px
}

.okui-notification-box .okui-notification-inline .okui-notification-action {
    margin-top: 0;
    width: auto
}

.okui-notification-box .okui-notification-close {
    margin-left: 15px;
    width: 22px;
    height: 22px;
    font-size: 22px;
    cursor: pointer;
    pointer-events: auto;
    -webkit-tap-highlight-color: transparent;
    color: var(--okd-notification-box-close-icon-color)
}

.okui-notification-box.success .okui-notification-icon-circle {
    border-color: var(--okd-notification-success-icon-color)
}

.okui-notification-box.success .okui-notification-icon {
    color: var(--okd-notification-success-icon-color)
}

.okui-notification-box.info .okui-notification-icon-circle {
    border-color: var(--okd-notification-info-icon-color)
}

.okui-notification-box.info .okui-notification-icon {
    color: var(--okd-notification-info-icon-color)
}

.okui-notification-box.warn .okui-notification-icon-circle {
    border-color: var(--okd-notification-warn-icon-color)
}

.okui-notification-box.warn .okui-notification-icon {
    color: var(--okd-notification-warn-icon-color)
}

.okui-notification-box.error .okui-notification-icon-circle {
    border-color: var(--okd-notification-error-icon-color)
}

.okui-notification-box.error .okui-notification-icon {
    color: var(--okd-notification-error-icon-color)
}

.okui-notification.okui-notification-bottom, .okui-notification.okui-notification-bottom-left, .okui-notification.okui-notification-bottom-right {
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end
}

.okui-notification.okui-notification-bottom-left .container-remove, .okui-notification.okui-notification-bottom-right .container-remove, .okui-notification.okui-notification-bottom .container-remove {
    -webkit-animation-name: NotificationOutBottom;
    animation-name: NotificationOutBottom
}

.okui-notification.okui-notification-bottom-right .okui-notification-container, .okui-notification.okui-notification-top-right .okui-notification-container {
    text-align: right
}

.okui-notification.okui-notification-bottom .okui-notification-container, .okui-notification.okui-notification-top .okui-notification-container {
    text-align: center
}

.okui-notification.okui-notification-bottom-left .okui-notification-box, .okui-notification.okui-notification-top-left .okui-notification-box {
    -webkit-animation-name: NotificationInLeft;
    animation-name: NotificationInLeft
}

.okui-notification.okui-notification-bottom-right .okui-notification-box, .okui-notification.okui-notification-top-right .okui-notification-box {
    -webkit-animation-name: NotificationInRight;
    animation-name: NotificationInRight
}

.okui-notification.okui-notification-top .okui-notification-box {
    -webkit-animation-name: NotificationInTop;
    animation-name: NotificationInTop
}

.okui-notification.okui-notification-bottom .okui-notification-box {
    -webkit-animation-name: NotificationInBottom;
    animation-name: NotificationInBottom
}

@media (max-width: 767px) {
    .okui-notification.okui-notification-bottom-left .okui-notification-container, .okui-notification.okui-notification-bottom-right .okui-notification-container, .okui-notification.okui-notification-top-left .okui-notification-container, .okui-notification.okui-notification-top-right .okui-notification-container {
        text-align: center
    }

    .okui-notification-box {
        width: 100%;
        min-width: unset
    }

    .okui-notification-box.auto-width {
        width: auto
    }
}

@-webkit-keyframes NotificationInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-30px, 0, 0);
        transform: translate3d(-30px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes NotificationInLeft {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(-30px, 0, 0);
        transform: translate3d(-30px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes NotificationInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(30px, 0, 0);
        transform: translate3d(30px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes NotificationInRight {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(30px, 0, 0);
        transform: translate3d(30px, 0, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes NotificationInTop {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes NotificationInTop {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes NotificationInBottom {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 30px, 0);
        transform: translate3d(0, 30px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@keyframes NotificationInBottom {
    0% {
        opacity: 0;
        -webkit-transform: translate3d(0, 30px, 0);
        transform: translate3d(0, 30px, 0)
    }
    to {
        opacity: 1;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
}

@-webkit-keyframes NotificationOutBottom {
    0% {
        opacity: 1;
        max-height: 150px;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        opacity: 0;
        max-height: 0;
        -webkit-transform: translate3d(0, 30px, 0);
        transform: translate3d(0, 30px, 0)
    }
}

@keyframes NotificationOutBottom {
    0% {
        opacity: 1;
        max-height: 150px;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        opacity: 0;
        max-height: 0;
        -webkit-transform: translate3d(0, 30px, 0);
        transform: translate3d(0, 30px, 0)
    }
}

@-webkit-keyframes NotificationOutTop {
    0% {
        opacity: 1;
        max-height: 150px;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        opacity: 0;
        max-height: 0;
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0)
    }
}

@keyframes NotificationOutTop {
    0% {
        opacity: 1;
        max-height: 150px;
        -webkit-transform: translateZ(0);
        transform: translateZ(0)
    }
    to {
        opacity: 0;
        max-height: 0;
        -webkit-transform: translate3d(0, -30px, 0);
        transform: translate3d(0, -30px, 0)
    }
}

.qr-container {
    display: block;
    margin-top: 0;
    max-width: 288px
}

.qr-container .qr-body {
    width: 184px;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    margin-left: 128px
}

.qr-container .qr-banner {
    margin-top: 16px;
    width: 184px;
    height: 184px;
    -webkit-box-shadow: 1px 5px 5px 1px rgba(0, 0, 0, .13);
    box-shadow: 1px 5px 5px 1px rgba(0, 0, 0, .13);
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.qr-container .qr-banner .qr-code {
    width: 150px
}

.qr-container .qr-banner .qr-mask {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background-color: hsla(0, 0%, 100%, .8);
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.qr-container .qr-banner .qr-mask .status-icon {
    width: 48px;
    height: 48px
}

.qr-container .qr-status-des {
    margin-top: 24px;
    font-size: 12px;
    line-height: 16px
}

.qr-container .qr-status-des .normal-des {
    width: 58px;
    margin-top: 17px
}

@media (max-width: 767px) {
    .qr-container {
        margin: 48px auto 0
    }

    .qr-container .normal-des {
        margin-top: 32px
    }

    .qr-container .qr-body {
        margin: 0 auto
    }
}

@media (max-width: 375px) {
    .qr-container {
        display: none
    }
}

.risk-wrapper {
    margin-top: 25px
}

.risk-wrapper .tip-container .tip-img img {
    width: 100%
}

.risk-wrapper .tip-container .tip-text {
    margin-top: 41px;
    padding: 0 4px
}

.risk-wrapper .tip-container .tip-text .risk-link {
    color: var(--passport--risk-link-color);
    margin-left: 5px
}

.risk-wrapper .tip-container .tip-text .tip-desc {
    font-size: 14px;
    line-height: 21px;
    text-align: center;
    color: #6d697f;
    margin-top: 8px
}

.risk-wrapper .error-container .error-img img {
    width: 100%
}

.risk-wrapper .error-container .error-title {
    margin-top: 24px;
    margin-bottom: 50px
}

.risk-wrapper .risk-title {
    font-size: 18px;
    line-height: 24px;
    text-align: center;
    color: #080013
}

.risk-wrapper .next-btn {
    margin-top: 20px
}

@font-face {
    font-family: iconfont;
    src: url(/cdn/assets/okfe/login/0.9.3/fonts/iconfont.4ac5328.eot);
    src: url(/cdn/assets/okfe/login/0.9.3/fonts/iconfont.4ac5328.eot#iefix) format("embedded-opentype"), url("data:application/x-font-woff2;charset=utf-8;base64,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") format("woff2"), url(/cdn/assets/okfe/login/0.9.3/fonts/iconfont.816a9a0.woff) format("woff"), url(/cdn/assets/okfe/login/0.9.3/fonts/iconfont.72b8e22.ttf) format("truetype"), url(/cdn/assets/okfe/login/0.9.3/img/iconfont.be51899.svg#iconfont) format("svg")
}

.iconfont {
    font-family: iconfont !important;
    font-size: 16px;
    font-style: normal;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.iconLoading:before {
    content: "\E802"
}

.iconicn-chain-outline-md:before {
    content: "\EB04"
}

.iconoverview_eye_slash:before {
    content: "\EAF6"
}

.iconUnfold:before {
    content: "\E660"
}

.icongoogle-forward1:before {
    content: "\E7CE"
}

.iconTelegram:before {
    content: "\E694"
}

.iconicn-eye-slash:before {
    content: "\E971"
}

.iconicn-eye:before {
    content: "\E972"
}

.iconicn-google:before {
    content: "\E973"
}

.iconicn-new-account:before {
    content: "\E974"
}

.iconicn-account-linked:before {
    content: "\E975"
}

.iconassets_display:before {
    content: "\E924"
}

.iconclose-circle:before {
    content: "\E788"
}

.iconicon_authorize:before {
    content: "\E8DC"
}

.iconsearch:before {
    content: "\E6BE"
}

.iconselect:before {
    content: "\E79C"
}

.icondropdown-cell:before {
    content: "\E89D"
}

.icondropdown-mail:before {
    content: "\E89E"
}

.iconDropdown_switch:before {
    content: "\E8AC"
}

.iconicon_okex:before {
    content: "\E8DD"
}

.iconicon__okcoin:before {
    content: "\E8DE"
}

div p {
    margin: 0
}

.ok-auth * {
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale
}

.ok-auth *, .ok-auth div, .ok-auth input {
    -webkit-tap-highlight-color: transparent
}

.ok-auth div, .ok-auth input {
    font-size: 100%
}

.ok-auth input {
    border: none;
    outline: 0;
    border-radius: 0
}

.ok-auth button, .ok-auth input {
    resize: none;
    -webkit-box-shadow: none;
    box-shadow: none
}

.ok-auth button, .ok-auth input {
    background: 0 0;
    -webkit-appearance: none;
    border-radius: 0;
    outline: none
}

.ok-auth input::-webkit-inner-spin-button, .ok-auth input::-webkit-outer-spin-button {
    -webkit-appearance: none !important;
    margin: 0
}

.ok-auth input[type=number] {
    -moz-appearance: textfield
}

.ok-auth .hide {
    display: none
}

.ok-auth .text-left {
    text-align: left
}

.ok-auth .text-center {
    text-align: center
}

.register-part-main * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.register-part-main .account-box {
    width: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.register-part-main .account-box .area-item {
    margin-top: 16px
}

.register-part-main .account-box .phone-item {
    display: inline-block;
    vertical-align: top;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    width: 100%;
    margin-top: 28px;
    margin-left: 16px
}

.register-part-main .password-input {
    padding-bottom: 0
}

.register-part-main .invite-des span {
    color: var(--passport-input-tips-text-color)
}

.register-part-main .invite-code {
    margin-top: 16px
}

.register-part-main .invite-code .invite-title {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    padding-bottom: 4px
}

.register-part-main .invite-code .invite-title .icon-box {
    -ms-flex-negative: 0;
    flex-shrink: 0;
    width: 30px;
    height: 20px;
    line-height: 20px;
    text-align: right;
    cursor: pointer
}

.register-part-main .invite-code .invite-label {
    display: inline-block;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    color: var(--passport--input-label-color);
    line-height: 19px
}

.register-part-main .invite-code .invite-des {
    margin-top: 2px;
    font-size: 12px;
    font-weight: 400;
    color: var(--passport-input-tips-text-color)
}

.register-part-main .invite-code .invite-des:first-child {
    margin-top: 8px
}

.register-part-main .invite-code .invite-toggle {
    display: inline-block;
    font-size: 12px;
    color: #606f88;
    font-weight: 700;
    margin-right: 4px;
    -webkit-transform: rotateX(180deg);
    transform: rotateX(180deg)
}

.register-part-main .invite-code .invite-toggle.down {
    -webkit-transform: rotateX(0deg);
    transform: rotateX(0deg)
}

.register-part-main .promise-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    font-size: 12px;
    margin-top: 25px
}

.register-part-main .promise-box .promise {
    font-size: 12px;
    color: rgba(0, 0, 0, .85);
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    display: inline-block;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    line-height: 1.5;
    word-break: break-word;
    margin-left: 2px
}

.register-part-main .promise-box .promise .agreement-link {
    color: var(--passport-agreenlink-color);
    text-decoration: none;
    font-size: 12px;
    font-weight: 700
}

.register-part-main .pwd-title-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 16px
}

.register-part-main .password-input-tips {
    font-size: 12px;
    color: #828ea2;
    line-height: 14px;
    margin-left: 2px;
    margin-top: 5px
}

.register-part-main .error-section {
    background: #ffe7e7;
    border-radius: 2px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    margin-top: 16px;
    padding: 16px 24px 16px 18px
}

.register-part-main .error-section .error-msg {
    line-height: 20px;
    color: #9c2c2c;
    font-size: 14px;
    font-weight: 500
}

.register-part-main .error-section .iconclose-circle {
    color: #e35e5e;
    font-size: 19.2px;
    margin: 0 15px 0 0
}

.register-part-main .agreen-and {
    color: var(--passport-agreenAnd-color);
    cursor: auto;
    font-weight: 400
}

.register-part-main .pwd-input {
    margin-top: 16px
}

.register-part-main .strength-section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    margin-top: 4px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.register-part-main .strength-section .strength-name {
    text-align: center;
    font-size: 12px;
    font-weight: 400;
    color: #9aa1b1;
    line-height: 16px;
    margin-right: 8px
}

.register-part-main .strength-section .okui-input-top-box.top-between {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.register-part-main .strength-section .password-strength-process {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    height: 4px;
    width: 18px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.register-part-main .strength-section .password-strength-process .level-line {
    width: 4px;
    background: #d9d9d9
}

.register-part-main .strength-section .password-strength-process.strength1 .level-line:first-child, .register-part-main .strength-section .password-strength-process.strength2 .level-line:first-child {
    background: #ee6560
}

.register-part-main .strength-section .password-strength-process.strength3 .level-line:first-child, .register-part-main .strength-section .password-strength-process.strength3 .level-line:nth-child(2) {
    background: #ff9b00
}

.register-part-main .strength-section .password-strength-process.strength4 .level-line {
    background: #4db872
}

.register-part-main .pwd-input-tips {
    margin-top: 4px;
    font-size: 12px;
    font-weight: 400;
    color: #7b8293;
    line-height: 20px
}

.register-part-main .okui-input .okui-input-error {
    font-size: 12px
}

.register-part-main .email-input {
    width: 100%
}

.register-part-main .okui-input-switch-icon.icon {
    color: #9aa8b7;
    font-size: 30px;
    margin-right: -5px
}

.register-part-main .pwd-input .okui-input-input {
    font-size: 14px;
    padding: 10px 0 10px 4px
}

.register-part-main .pwd-hidden {
    display: none !important
}

.register-part-main .account-disabled {
    pointer-events: none
}

@media (max-width: 767px) {
    .register-part-main .okui-input.input-md .okui-input-box, .register-part-main .submit-btn {
        height: 48px
    }
}

.login-main {
    position: relative;
    border-radius: 5px;
    z-index: 10
}

.login-main * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.login-main .auth-section {
    text-align: center
}

.login-main .auth-section .title {
    color: rgba(0, 0, 0, .85);
    font-size: 24px;
    margin: 0 auto;
    font-weight: 600;
    line-height: 48px
}

.login-main .auth-section .auth-logo {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    padding: 44px 0 36px
}

.login-main .auth-section .auth-logo .transfer {
    width: 24px;
    height: 24px;
    border-radius: 24px;
    background: #ebf1fd;
    margin: 5px 24px 0
}

.login-main .auth-section .auth-logo .iconassets_transfer {
    color: #3075ee;
    line-height: 24px
}

.login-main .auth-section .auth-logo .site-name {
    font-size: 24px;
    color: #3075ee;
    font-weight: 600;
    line-height: 30px;
    width: 164px;
    display: inline-block
}

.login-main .auth-section .auth-logo .text-right {
    text-align: right
}

.login-main .auth-section .auth-logo .text-left {
    text-align: left
}

.login-main .auth-section .auth-tips {
    font-size: 14px;
    font-weight: 400;
    color: rgba(0, 0, 0, .85);
    line-height: 20px;
    text-align: left
}

.login-main .auth-section .reject-btn {
    font-weight: 600;
    color: #3075ee;
    cursor: pointer;
    margin-top: 24px;
    font-size: 18px
}

.login-main .login-other-operation {
    margin: -4px 0 20px;
    text-align: right
}

.login-main .forget-psw {
    text-align: right;
    font-size: 12px;
    color: #3075ee;
    cursor: pointer
}

.with-qrcode {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.with-qrcode .step-login {
    width: 288px;
    margin-left: 64px
}

@media (max-width: 767px) {
    .login-box-okex {
        display: block
    }

    .login-box-okex .step-login {
        width: 100%;
        margin: 0 auto
    }
}

.register-main {
    position: relative;
    border-radius: 5px;
    z-index: 10
}

.register-main * {
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.oauth-dialog .oauth-body {
    padding-top: 16px
}

.oauth-dialog .oauth-body .link-area, .oauth-dialog .oauth-body .link-area .link-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.oauth-dialog .oauth-body .link-area .link-box {
    width: 48px;
    height: 48px;
    border: 1px solid #e9ecf5;
    border-radius: 50%
}

.oauth-dialog .oauth-body .link-area .link-box img {
    width: 27px
}

.oauth-dialog .oauth-body .link-area .link-icon {
    width: 15px;
    margin: 0 9px
}

.oauth-dialog .oauth-body .auth-tip {
    margin-top: 16px
}

.oauth-dialog .oauth-body .auth-tip .auth-account {
    text-align: center;
    font-size: 14px;
    line-height: 16px;
    color: var(--okd-color-gray-500)
}

.oauth-dialog .oauth-body .auth-tip .auth-title {
    margin-top: 8px;
    text-align: center;
    font-weight: 500;
    font-size: 18px;
    line-height: 24px;
    color: var(--okd-color-gray-900)
}

.oauth-dialog .oauth-body .auth-tip .auth-redirect {
    margin-top: 20px;
    padding: 8px 12px;
    background: #f7f9fc;
    border-radius: 4px;
    font-size: 12px;
    line-height: 16px;
    color: var(--okd-color-gray-700);
    white-space: nowrap
}

.oauth-dialog .oauth-body .auth-permission {
    margin: 20px 0 32px
}

.oauth-dialog .oauth-body .auth-permission .permission-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    border: .5px solid #d8dce5;
    border-radius: 4px;
    padding: 15px 15px 12px;
    margin-bottom: 26px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between
}

.oauth-dialog .oauth-body .auth-permission .permission-box .permission-panel {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.oauth-dialog .oauth-body .auth-permission .permission-box .permission-icon {
    margin-right: 11px;
    margin-top: 1px
}

.oauth-dialog .oauth-body .auth-permission .permission-box .permission-icon img {
    width: 15px;
    height: auto
}

.oauth-dialog .oauth-body .auth-permission .permission-box .permission-info .permission-title {
    color: var(--okd-color-gray-900);
    font-size: 14px;
    line-height: 16px
}

.oauth-dialog .oauth-body .auth-permission .permission-box .permission-info .permission-des {
    color: var(--okd-color-gray-400);
    font-size: 14px;
    line-height: 16px;
    max-width: 264px
}

.oauth-dialog .oauth-body .auth-permission .permission-box .permission-checkbox {
    -ms-flex-item-align: center;
    align-self: center;
    margin-left: 12px
}

.oauth-dialog .oauth-error {
    margin-top: 32px;
    height: 250px;
    text-align: center
}

.oauth-dialog .oauth-error .error-img {
    width: 80px
}

.oauth-dialog .oauth-error .error-text {
    margin-top: 10px;
    font-size: 14px;
    line-height: 158%;
    color: var(--okd-color-gray-700)
}

.auth-confirm-container .iconicn-chain-outline-md {
    font-size: 30px;
    color: #60687b
}

.auth-confirm-container .auth-logo-icon {
    width: 42px;
    height: 42px;
    border: 1px solid #d1d6e0;
    border-radius: 50%;
    margin-top: -2px;
    text-align: center
}

.auth-confirm-container .auth-logo-icon img {
    width: 30px;
    margin-top: 6px
}

.auth-confirm-container .auth-btn {
    width: 100%;
    height: 40px;
    border-radius: 2px;
    font-size: 18px;
    background-color: #2d60e0;
    color: #fff;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    margin-top: 10px;
    border: none;
    outline: none;
    line-height: 40px
}

.auth-confirm-container .auth-btn .loading-icon {
    width: 18px;
    height: 18px;
    display: none
}

.auth-confirm-container .auth-btn.loading {
    background: #2956ca
}

.auth-confirm-container .auth-btn.loading .loading-icon {
    display: inline-block !important;
    -webkit-animation: spin .8s linear infinite;
    animation: spin .8s linear infinite
}

.auth-confirm-container .auth-btn:not(.loading)[disabled] {
    font-weight: 600;
    color: rgba(0, 0, 0, .25);
    background: rgba(0, 0, 0, .05);
    border-radius: 2px;
    border: 1px solid rgba(0, 0, 0, .1);
    cursor: not-allowed
}

.auth-confirm-container .do-later {
    margin-top: 18px;
    text-align: center;
    font-size: 14px;
    font-weight: 500;
    color: #2450be;
    line-height: 20px;
    cursor: pointer
}

.auth-confirm-container .auth-confirm-tips {
    width: 300px;
    margin: 8px auto 32px;
    font-size: 14px;
    font-weight: 400;
    text-align: left;
    color: #3f475a;
    line-height: 20px
}

.auth-confirm-container .auth-confirm-title {
    font-size: 24px;
    font-weight: 500;
    color: #1f2533;
    line-height: 28px;
    text-align: center;
    margin-top: 8px
}

.auth-confirm-container .user-name {
    font-size: 12px;
    font-weight: 400;
    color: #7b8293;
    text-align: center;
    line-height: 16px;
    margin-top: 16px
}

.auth-confirm-container .login-section {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-top: 8px
}

.auth-confirm-container .auth-logo {
    width: 48px
}

.auth-confirm-container .error-section {
    background: rgba(238, 101, 96, .1);
    border-radius: 4px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 16px 24px 16px 18px
}

.auth-confirm-container .error-section .iconclose-circle {
    color: #ee6560;
    font-size: 19px;
    margin: 0 15px 0 0
}

.auth-confirm-container .error-section .error-msg {
    width: 264px;
    display: inline-block;
    vertical-align: top;
    color: #9c2c2c;
    font-size: 14px;
    font-weight: 500;
    line-height: 20px
}

@media (max-width: 767px) {
    .auth-confirm-container .auth-btn {
        height: 48px;
        line-height: 48px
    }
}

.auth-error-container .auth-confirm-title {
    font-size: 24px;
    font-weight: 500;
    color: #1f2533;
    line-height: 28px;
    text-align: center;
    margin-top: 16px
}

.auth-error-container .auth-confirm-tips {
    width: 300px;
    margin: 8px auto 32px;
    font-size: 14px;
    font-weight: 400;
    text-align: left;
    color: #3f475a;
    text-align: center;
    line-height: 20px
}

.auth-error-container .auth-btn {
    width: 100%;
    height: 40px;
    border-radius: 2px;
    font-size: 14px;
    background-color: #2d60e0;
    color: #fff;
    font-weight: 600;
    text-align: center;
    cursor: pointer;
    position: relative;
    overflow: hidden;
    border: none;
    outline: none;
    margin-top: 10px;
    line-height: 40px
}

.auth-error-container .auth-btn .loading-icon {
    width: 18px;
    height: 18px;
    display: none
}

.auth-error-container .auth-btn.loading {
    background: #2956ca
}

.auth-error-container .auth-btn.loading .loading-icon {
    display: inline-block !important;
    -webkit-animation: spin .8s linear infinite;
    animation: spin .8s linear infinite
}

.auth-error-container .auth-btn:not(.loading)[disabled] {
    font-weight: 600;
    color: rgba(0, 0, 0, .25);
    background: rgba(0, 0, 0, .05);
    border-radius: 2px;
    border: 1px solid rgba(0, 0, 0, .1);
    cursor: not-allowed
}

@-webkit-keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

@keyframes spin {
    0% {
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg)
    }
    to {
        -webkit-transform: rotate(1turn);
        transform: rotate(1turn)
    }
}

.auth-error-container .error-icon-setion {
    width: 120px;
    margin: -8px auto 0
}

.auth-error-container .error-icon-setion .error-icon {
    display: inline-block;
    width: 120px;
    height: 120px
}

.auth-error-container .error-other-tips {
    font-size: 12px;
    font-weight: 400;
    color: #3f475a;
    line-height: 16px;
    margin-top: 16px;
    text-align: center
}

@media (max-width: 767px) {
    .auth-error-container .auth-btn {
        height: 48px;
        line-height: 48px
    }
}

.verify-input-container {
    border-radius: 4px
}

.verify-input-container .title {
    font-size: 12px;
    color: #606f88;
    line-height: 14px
}

.verify-input-container .code-input-section {
    margin-top: 5px;
    position: relative
}

.verify-input-container .code-input-container {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    max-width: 300px;
    margin: 0 auto
}

.verify-input-container .code-input-container .left-input, .verify-input-container .code-input-container .right-input {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    width: 156px
}

.verify-input-container .code-input-container .code-section {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 44px;
    height: 48px;
    padding: 8px 0 8px 3px;
    border: 1px solid #ced3de;
    border-radius: 2px
}

.verify-input-container .code-input-container .active {
    -webkit-box-shadow: 0 0 0 2px rgba(189, 207, 255, .45);
    box-shadow: 0 0 0 2px rgba(189, 207, 255, .45);
    border-radius: 2px;
    border: 1px solid #91b1ff
}

.verify-input-container .code-input-container .code-input {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    width: 38px;
    height: 32px;
    padding-left: 11px;
    caret-color: #3075ee;
    font-size: 24px;
    outline: none;
    border: none
}

.verify-input-container .bg-number-placeholder {
    position: absolute;
    top: 1px
}

.verify-input-container .bg-number-placeholder span {
    display: inline-block;
    margin-right: 3px;
    color: rgba(6, 29, 68, .2);
    font-size: 14px;
    width: 9px
}

.verify-input-container input::-webkit-input-placeholder {
    color: rgba(6, 29, 68, .3)
}

.verify-input-container input:-moz-placeholder, .verify-input-container input::-moz-placeholder {
    color: rgba(6, 29, 68, .3)
}

.verify-input-container input:-ms-input-placeholder {
    color: rgba(6, 29, 68, .3)
}

.error-tips {
    font-size: 12px;
    color: #ee6560;
    line-height: 16px;
    margin-top: 3px;
    display: block
}

.input-active {
    border: 1px solid #3075ee
}

.input-error {
    border: 1px solid #ee6560
}

@media (max-width: 767px) {
    .verify-input-container .code-input-container .left-input {
        width: 150px;
        margin-right: 22px
    }

    .verify-input-container .code-input-container .right-input {
        width: 150px
    }

    .verify-input-container .code-input-container .code-section {
        max-width: 40px;
        padding: 8px 0
    }

    .verify-input-container .code-input-container .code-input {
        max-width: 40px;
        padding-left: 13px
    }
}

.verify-code-new-container .title-box .verify-title {
    color: #061d44;
    font-weight: 400;
    font-size: 32px;
    font-weight: 700;
    line-height: 32px;
    display: inline-block
}

.verify-code-new-container .title-box .verify-tips {
    font-size: 16px;
    color: #606f88;
    line-height: 24px;
    margin-top: 10px
}

.verify-code-new-container .verify-code-input {
    margin-top: 27px
}

.verify-code-new-container .verify-btn {
    margin-top: 32px
}

.verify-code-new-container .verify-input {
    margin-top: 27px
}

.verify-code-new-container .verify-operate {
    margin-top: 29px;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: -20px
}

.verify-code-new-container .verify-operate .operate-tips {
    color: #606f88
}

.verify-code-new-container .verify-operate .operate-item {
    color: #061d44;
    font-weight: 500;
    cursor: pointer
}

.verify-code-new-container .verify-operate .send-timer {
    color: rgba(6, 29, 68, .52);
    cursor: not-allowed;
    pointer-events: none
}

.verify-code-new-container .verify-error-section {
    background: rgba(238, 101, 96, .1);
    border-radius: 2px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    padding: 16px 0 16px 18px;
    margin-top: 15px;
    margin-bottom: -15px
}

.verify-code-new-container .verify-error-section .error-msg {
    font-size: 14px;
    font-weight: 500;
    color: #9c2c2c;
    line-height: 20px
}

.verify-code-new-container .verify-error-section .iconclose-circle {
    color: #ee6560;
    font-size: 19.2px;
    margin: 0 15px 0 0
}

.verify-code-new-container .new-verify-code {
    text-align: center
}

.verify-code-new-container .reset-google {
    color: #666;
    margin-top: 20px;
    font-size: 16px;
    cursor: pointer;
    text-align: center
}

.verify-code-new-container .switch-text {
    color: #061d44;
    font-weight: 500;
    cursor: pointer
}

@media (max-width: 767px) {
    .verify-code-new-container .google-code-tips, .verify-code-new-container .new-verify-code, .verify-code-new-container .reset-google {
        text-align: left
    }
}

.quickAuth {
    position: relative
}

.quickAuth .loader {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto
}

.verify-service {
    border-top: 1px solid #d8dce6;
    margin-top: 45px
}

.verify-service p {
    margin-top: 8px;
    font-size: 12px;
    line-height: 16px;
    color: #7b8293
}

.verify-service p a {
    color: #2d60e0;
    cursor: pointer;
    text-decoration: none
}

:root {
    --passport-border-radius: var(--okd-border-radius-sm);
    --passport-input-default-border-color: var(--okd-input-default-border-color);
    --passport-input-default-caret-color: var(--okd-input-default-caret-color);
    --passport-input-hover-background: var(--okd-input-hover-background);
    --passport--input-hover-caret-color: var(--okd-input-hover-caret-color);
    --passport-input-focus-shadow: var(--okd-input-focus-shadow);
    --passport-input-focus-border-color: var(--okd-input-focus-border-color);
    --passport-input-focus-background: var(--okd-input-focus-background);
    --passport-input-tips-text-color: var(--okd-input-tips-text-color);
    --passport--input-label-color: var(--okd-input-label-color);
    --passport-forgotPwd-color: var(--okd-color-blue-800);
    --passport-registerAccountDefault-color: var(--okd-input-label-color);
    --passport-registerAccountSwitch-color: var(--okd-color-blue-800);
    --passport-agreenlink-color: var(--okd-color-blue-800);
    --passport-pwdLabel-color: var(--okd-input-label-color);
    --passport-agreenAnd-color: rgba(0, 0, 0, 0.85);
    --passport--device-text-title-color: var(--okd-color-gray-700);
    --passport--device-text-device-color: var(--okd-color-gray-900);
    --passport--device-text-device-desc-color: var(--okd-color-gray-400);
    --passport--device-text-device-link-color: var(--okd-color-blue-700);
    --passport--risk-link-color: var(--okd-color-blue-600)
}

.theme-okcoin {
    --passport-border-radius: var(--okd-border-radius-sm);
    --passport-input-default-border-color: var(--okd-input-default-border-color);
    --passport-input-default-caret-color: var(--okd-input-default-caret-color);
    --passport-input-hover-background: var(--okd-input-hover-background);
    --passport--input-hover-caret-color: var(--okd-input-hover-caret-color);
    --passport-input-focus-shadow: var(--okd-input-focus-shadow);
    --passport-input-focus-border-color: var(--okd-input-focus-border-color);
    --passport-input-focus-background: var(--okd-input-focus-background);
    --passport-input-tips-text-color: var(--okd-input-tips-text-color);
    --passport--input-label-color: var(--okd-input-label-color);
    --passport-forgotPwd-color: var(--okd-color-purple-1000);
    --passport-registerAccountDefault-color: var(--okd-input-label-color);
    --passport-registerAccountSwitch-color: var(--okd-color-purple-1000);
    --passport-agreenlink-color: var(--okd-color-purple-1000);
    --passport-pwdLabel-color: var(--okd-input-label-color);
    --passport-agreenAnd-color: var(--okd-color-purple-1000);
    --passport--device-text-title-color: var(--okd-color-gray-700);
    --passport--device-text-device-color: var(--okd-color-gray-900);
    --passport--device-text-device-desc-color: var(--okd-color-gray-400);
    --passport--device-text-device-link-color: var(--okd-color-blue-700);
    --passport--risk-link-color: var(--okd-color-purple-600)
}

.switch-login-reg {
    width: 100%;
    height: 40px;
    -webkit-box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
    box-shadow: 0 1px 2px 0 rgba(0, 0, 0, .05);
    border-radius: 2px;
    border: 1px solid #ced3de;
    margin-top: 16px;
    text-align: center;
    line-height: 40px;
    font-size: 12px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.switch-login-reg .pre-tips {
    color: var(--login-switchLogReg-color)
}

.switch-login-reg .btn-content {
    font-size: 12px
}

.switch-login-reg .link {
    color: var(--login-switchLogRegLink-color);
    font-weight: 700;
    cursor: pointer;
    margin-left: 5px
}

.switch-login-reg .icongoogle-forward1 {
    color: #2450be;
    font-weight: 500;
    font-size: 12.6px
}

.community-container {
    width: 420px;
    height: 90px;
    background: rgba(228, 236, 255, .1);
    border-radius: 6px;
    background-size: 420px 90px;
    padding-left: 10px;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    margin: 12px auto 40px
}

.community-container, .community-container .left {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex
}

.community-container .left {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center
}

.community-container .qr-box {
    margin-right: 10px
}

.community-container .comm-qrcode {
    width: 70px
}

.community-container .comm-title {
    font-size: 16px;
    font-weight: 600;
    color: #fff;
    line-height: 20px;
    letter-spacing: 1px
}

.community-container .comm-desc {
    font-size: 12px;
    font-weight: 400;
    color: hsla(0, 0%, 100%, .6);
    line-height: 16px;
    margin-top: 1px
}

.community-container .right-img {
    height: 90px
}

.community-container.community-container-en {
    height: 68px;
    padding-left: 16px
}

.community-container.community-container-en .comm-title {
    font-size: 14px;
    cursor: pointer
}

.community-container.community-container-en .comm-title .icon {
    font-size: 14px;
    line-height: 14px;
    margin-left: 2px;
    vertical-align: middle
}

.community-container.community-container-en .right-img {
    height: 68px
}

.login-container {
    padding-top: 11vh;
    min-height: 300px
}

.login-container .title-default {
    color: #041636
}

.login-wrap {
    width: 100%;
    min-height: 660px;
    left: 0;
    overflow: hidden;
    background: -webkit-gradient(linear, left top, right top, from(#041636), to(#0b2758));
    background: linear-gradient(90deg, #041636, #0b2758)
}

.login-wrap .login-container, .login-wrap .register-container {
    width: 85%;
    padding: 40px;
    margin: 0 auto;
    background: #fff;
    -webkit-box-shadow: 0 8px 24px 0 rgba(0, 0, 0, .08);
    box-shadow: 0 8px 24px 0 rgba(0, 0, 0, .08);
    border-radius: 6px;
    -webkit-box-sizing: border-box;
    box-sizing: border-box
}

.login-wrap .ok-logo-box {
    width: 100%;
    text-align: center;
    margin: 10% auto 0;
    display: none
}

.login-wrap .ok-logo-box .h5-logo-img {
    position: relative;
    width: 45%;
    max-width: 260px
}

.login-wrap .open-exchange-tips {
    margin-top: 16px;
    font-size: 12px;
    line-height: 18px;
    color: rgba(0, 0, 0, .45)
}

.conn-title {
    width: 420px;
    margin: 0 auto;
    font-size: 30px;
    font-weight: 500;
    color: #fff;
    line-height: 28px;
    text-align: center
}

.passport-bg-okex {
    background: -webkit-gradient(linear, left top, right top, from(#041636), to(#0b2758)) !important;
    background: linear-gradient(90deg, #041636, #0b2758) !important

}

.passport-bg-okcoin {
    background: #fbfbfc !important
}

.passport-bg-oklink {
    background: #f0f3f7
}

.passport-bg-okcoincn {
    background: -webkit-gradient(linear, left top, right top, from(#041636), to(#0b2758));
    background: linear-gradient(90deg, #041636, #0b2758)
}

.home-container-okex {
    min-height: calc(100vh - 400px);
    background: -webkit-gradient(linear, left top, right top, from(#041636), to(#0b2758)) !important;
    background: linear-gradient(90deg, #041636, #0b2758) !important
}

.home-container-okcoin {
    min-height: calc(100vh - 250px);
    background: #fbfbfc !important
}

.home-container-okcoin .conn-title {
    color: #1f2533 !important;
    font-weight: 700
}

.home-container-okcoin .login-container, .home-container-okcoin .register-container {
    -webkit-box-shadow: 0 0 0 rgba(0, 0, 0, .05);
    box-shadow: 0 0 0 rgba(0, 0, 0, .05);
    border-radius: 4px;
    border: 1px solid #f4f3f5 !important
}

.home-container-oklink {
    min-height: calc(100vh - 200px);
    background: #f0f3f7
}

.home-container-oklink .conn-title {
    color: #1f2533 !important;
    font-weight: 700
}

.home-container-okcoincn {
    background: -webkit-gradient(linear, left top, right top, from(#041636), to(#0b2758));
    background: linear-gradient(90deg, #041636, #0b2758);
    min-height: calc(100vh - 200px)
}

@media (max-width: 767px) {
    .login-container {
        background: #fff;
        padding-top: 0
    }

    .login-container .title-default {
        color: #fff
    }

    .login-wrap {
        width: 100%;
        min-width: 100%;
        height: calc(100vh - 100px);
        min-height: 500px;
        padding-bottom: 40px;
        background: #fff
    }

    .login-wrap .login-container, .login-wrap .register-container {
        width: 100%;
        margin: 0;
        border-radius: 0;
        height: calc(100vh - 100px);
        padding: 16px 24px 0;
        -webkit-box-shadow: none;
        box-shadow: none
    }

    .login-wrap .ok-logo-box {
        display: block
    }

    .passport-bg-okex {
        background: #fff !important
    }

    .conn-title {
        width: 100%;
        background: #fff;
        padding: 24px 24px 0;
        font-size: 30px;
        font-weight: 700;
        color: #1f2533;
        margin: 0;
        line-height: 32px;
        text-align: left;
        -webkit-box-sizing: border-box;
        box-sizing: border-box
    }

    .header-wrap {
        background: #000
    }

    .home-container-okcoin .login-container, .home-container-okcoin .register-container {
        border: 0 !important
    }

    .passport-bg-okcoin {
        background: #fbfcff !important
    }

    body {
        min-width: unset
    }
}

@media (min-width: 768px) {
    body {
        min-width: unset
    }

    .login-wrap .login-container, .login-wrap .register-container {
        width: 420px;
        padding: 40px;
        margin: 40px auto 0
    }

    .passport-bg-okex .login-step-box {
        width: 808px
    }
}

@media (min-width: 1024px) {
    body {
        min-width: auto
    }
}

body[data-nav=false] .login-wrap {
    min-height: 100vh
}

.register-container {
    min-height: 350px
}

.title-default {
    color: #041636
}

@media (max-width: 767px) {
    .community-container {
        display: none
    }

    .title-default {
        color: #fff
    }
}

:root {
    --login-switchLogRegLink-color: var(--okd-color-blue-800);
    --login-switchLogReg-color: var(--okd-color-gray-700)
}

.theme-okcoin {
    --login-switchLogRegLink-color: var(--okd-color-purple-1000);
    --login-switchLogReg-color: #3f475a
}

button:disabled {
    /*background-color: #fff !important*/
}


@keyframes ivu-progress-active {
    0% {
        opacity: 0;
        width: 0;
    }


    100% {
        opacity: 0.6;
        width: 100%
    }
}
.jdt2 {
    width: 100%;
    height: 100%;
    background-color: #c4c4c4;
    position: absolute;
    border-radius: 10px;
}


.jdt {
    width: 100%;
    height: 100%;
    animation: ivu-progress-active 2s ease-in-out infinite;
    background-color: #08204a;
    position: absolute;
    border-radius: 10px;
}


input[type="password"]::-ms-reveal{
    display:none
}