// common.scss
@font-face {
	font-family: "iconfont";
	src: url("@/static/font/iconfont.woff2") format("woff2"),
		url("@/static/font/iconfont.woff") format("woff"),
		url("@/static/font/iconfont.ttf") format("truetype");
}
:root {
	--theme-color: rgba(0, 188, 166, 1);
	--theme-pd: 30rpx;
	--second-pt-color: rgba(0, 175, 236, 1);
	--second-color: #ffd6dd;
	--box-ra-20px: 40rpx;
}
html {
	// max-width: 640px !important;
	margin: 0;
	color: rgba(22, 24, 26, 1);
}
::-webkit-scrollbar {
    width: 0;
    height: 0;
    color: transparent;
}
.container {
	padding-top: calc(var(--status-bar-height) + 88rpx);
}
.f-colot-00BCA6 {
	color: #00bca6;
}
.f-colot-282F38 {
	color: rgba(40, 47, 56, 0.78);
}
.f-colot-11C3AE {
	color: #11c3ae;
}
.f-colot-848D99 {
	color: #848d99;
}
.f-color-333333 {
	color: #333333;
}
.f-color-858494 {
	color: #858494;
}
.f-color-666666 {
	color: #666666;
}
.f-color-16181A {
	color: #16181a;
}
.pd-15 {
	padding: 30rpx;
}
.pd-12 {
	padding: 24rpx;
}
.pd-56 {
	padding: 56rpx;
}
.pd-25 {
	padding: 50rpx;
}
.pd-30 {
	padding: 50rpx;
}
.pd-32 {
	padding: 32rpx;
}
.border-r-20 {
	border-radius: var(--box-ra-20px);
}
.border-r-30 {
	border-radius: 60rpx;
}
.border-r-40 {
	border-radius: 80rpx;
}
.bg-color-theme {
	background-color: var(--theme-color);
}

.title-12 {
	font-size: 24rpx;
	font-weight: 500;
}
.title-12-400 {
	font-size: 24rpx;
	font-weight: 400;
}
.title-13-400 {
	font-size: 26rpx;
	// font-weight: 400;
}
.title-14 {
	font-size: 28rpx;
	font-weight: 500;
}
.title-14-400 {
	font-size: 28rpx;
	font-weight: 400;
}
.title-14-600 {
	font-size: 28rpx;
	font-weight: 600;
}
.title-15-400 {
	font-size: 30rpx;
	font-weight: 400;
}
.title-16-600 {
	font-size: 32rpx;
	font-weight: 600;
}
.title-16-400 {
	font-size: 32rpx;
	font-weight: 400;
}
.title-16-500 {
	font-size: 32rpx;
	font-weight: 500;
}
.title-16-700 {
	font-size: 32rpx;
	font-weight: 700;
}
.title-17-500 {
	font-size: 34rpx;
	font-weight: 500;
}
.title-18 {
	font-size: 36rpx;
	font-weight: 500;
}
.title-18-600 {
	font-size: 36rpx;
	font-weight: 600;
}
.title-20-700 {
	font-size: 40rpx;
	font-weight: 700;
}
.title-20-500 {
	font-size: 40rpx;
	font-weight: 500;
}
.title-20-600 {
	font-size: 40rpx;
	font-weight: 600;
}
.title-20-800 {
	font-size: 40rpx;
	font-weight: 800;
}
.title-24-700 {
	font-size: 48rpx;
	font-weight: 700;
}
.title-24 {
	font-size: 48rpx;
	font-weight: 500;
}
.title-24-600 {
	font-size: 48rpx;
	font-weight: 600;
}
.title-24-800 {
	font-size: 48rpx;
	font-weight: 800;
}
.f-color-white {
	color: white;
}
.f-color-pink {
	color: rgba(255, 214, 221, 1);
}
.f-color-blue {
	color: rgba(67, 130, 253, 1);
}
.f-color-858494 {
	color: #858494;
}
.f-color-0C092A {
	color: #0c092a;
}

@mixin flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
@mixin flex-c {
	display: flex;
	flex-direction: column;
	// align-items: center;
	justify-content: space-between;
}
.flex-c {
	display: flex;
	flex-direction: column;
	// align-items: center;
	justify-content: space-between;
}

.flex-r {
	display: flex;
	align-items: center;
}
.flex-r-c {
	display: flex;
	justify-content: center;
	align-items: center;
}
.flex-r-b {
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.flex-c-c {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.flex-c-d {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
}

.button-01 {
	border-radius: 40rpx;
	background-color: white;
	height: 88rpx;
	width: 236rpx;
	display: flex;
	align-items: center;
	justify-content: center;
}
.button-02 {
	margin: 0;
	padding: 0;
	border-radius: 10rpx;
	color: white;
	background-color: rgba(0, 188, 166, 1);
	height: 88rpx;
	width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
}
.button-03 {
	margin: 0;
	padding: 0;
	border-radius: 16rpx;
	color: white;
	background-color: #00afec;
	height: 58rpx;
	width: 124rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 28rpx;
	font-weight: 500;
}
.button-04 {
	margin: 0;
	padding: 0;
	border-radius: 40rpx;
	color: rgb(71, 71, 71);
	background-color: #dde8ee;
	height: 58rpx;
	width: 124rpx;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 28rpx;
	font-weight: 500;
}
button::after {
	border: unset !important;
}

.flag_01 {
	background: #e8f3ff;
	border-radius: 8rpx 8rpx 8rpx 8rpx;
	font-weight: 400;
	font-size: 24rpx;
	color: #165dff;
    padding: 1rpx 16rpx;
}
.headline{
	font-weight: 800;
font-size: 34rpx;
color: #16181A;
}
.content-font{
	font-weight: 400;
	font-size: 28rpx;
	color: #848D99;
}
