img{will-change: transform}

.box-60{
	width: 60px;
	height: 60px;
	overflow: hidden;
}
.box-80{
	width: 80px;
	height: 80px;
	overflow: hidden;
}
.box-30{
	width: 60px;
	height: 60px;
	overflow: hidden;
}
.image-box-80{
	width: 80px;
	height: 80px;
	overflow: hidden;
}
.image-box-80 img{
	width: 100%;
	height: 100%;
}
.image-box-120{
	width: 120px;
	height: 120px;
	overflow: hidden;
}
.image-box-120 img{	
	width: 100%;
	height: 100%;
}
.image-box-100{
	width: 200px;
	height: 200px;
	overflow: hidden;
}
.image-box-100 img{	
	width: 100%;
	height: 100%;
}
.image-box-70{
	width: 140px;
	height: 140px;
	overflow: hidden;
}
.image-box-70 img{	
	width: 100%;
	height: 100%;
}
.image-box-50{
	width: 100px;
	height: 100px;
	overflow: hidden;
}
.image-box-50 img{	
	width: 100%;
	height: 100%;
}
.image-3{
	width:224px;
	height: 168px;
	border-radius: 10px; 
}
.box-20{
	width: 40px;
	height: 40px;
	overflow: hidden;
}
.video-box{
	width: 670px;
	height: 380px;
}
/* scroll-view */
.scroll-row{ width: 100%;white-space: nowrap;line-height: 44px; }
.scroll-row-item{ display: inline-block!important; }
.hh-bg{background: linear-gradient(to bottom right, #eaf1f1,#b3f4f4);color:#183354;}
.hh-bg2{background: linear-gradient(to bottom right, #ff8b2d, #ec6b49);}
.block-1{
	background-color: #d0f592;
	box-shadow: 0 6rpx 0rpx rgba(168, 225, 142, 1)!important;
}
.block-2{
	background-color: #cbeffd;
	box-shadow: 0 6rpx 0rpx rgba(160, 226, 249, 1)!important;
}
.block-3{
	background-color: #eedbfc;
	box-shadow: 0 6rpx 0rpx rgba(194, 118, 249, 1)!important;
}

body{
	--default: #F74F0E;
	--primary:#183354;
	--secondary: #6c757d;
	--success: #2ba045;
	--danger: #F55726;
	--warning: #ffc107;
	--info: #17a2b8;
	--light: #f8f9fa;
	--dark: #343a40;
	--muted: #6c757d;
	--white: #fff;
	--black: #000;
	--borderColor:#d7b87a;
	--borderColor2:#dee2e6;
	--borderColor3:#F55726;
	--borderColor4:#ffffff;
	--lightmuted:#B2B2B2;
	--diycolor1:#f4feff;
	--diycolor2:#fff8f9;
	--diycolor3:#dcadf8;
}


.shadow-sm {
    box-shadow: 0 2rpx 4rpx rgba(114, 130, 138, 0.2)!important;
}
.shadow {
    box-shadow: 0 8rpx 16rpx rgba(114, 130, 138, 0.2)!important;
}
.shadow-lg {
    box-shadow: 0 16rpx 48rpx rgba(114, 130, 138, 0.2)!important;
}

.position-absolute{ position: absolute; }
.position-fixed{ position: fixed; }
.position-relative{ position: relative; }
.left-0{ left: 0; }
.top-0{ top: 0; }
.bottom-0{ bottom: 0; }
.right-0{ right: 0; }

.w-100{ width: 100%;}
.w-50{ width: 50%;}
.w-45{ width: 45%;}
.w-33{ width: 30%;}
.w-25{ width: 25%;}
.w-75{ width: 75%;}
.w-710{width:710px;}
.w-224{width:224px;}
.wr-100{ width:150px; }
.h-100{ height: 1250px;}
.h-50{ width: 625px; }

.h-sm{ height: 40px;}
.h-md{ height: 60px;}
.h-big{ height: 80px;}


.row { box-sizing: border-box!important; display: flex!important; flex-direction: row!important; flex-wrap: wrap;}
[class*='col-'],[class*='span-'],[class*='span24-'] { min-height: 1px;box-sizing: border-box!important;}


.fs-7{
	font-size: 0.7rem !important;
}
.fs-8{
	font-size: 0.5rem !important;
}
.text-row {
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
} 

.d-flex{ display: flex;flex-direction: row!important; }
.d-block{ display: block; }
.d-inline-block{ display: inline-block; }

.flex-1{ flex: 1; }
.flex-column{ flex-direction: column!important; }
.flex-row{ flex-direction: row; }
.flex-wrap{ flex-wrap: wrap; }
.flex-nowrap{ flex-wrap: nowrap; }
.flex-shrink{flex-shrink: 0;}
.j-start{ justify-content: flex-start; }
.j-center{ justify-content: center!important; }
.j-end{ justify-content: flex-end; }
.j-sb{ justify-content: space-between; }
.j-sa{ justify-content: space-around; }
.a-center{ align-items:center!important; }
.a-start{ align-items: flex-start; }
.a-end{ align-items:flex-end; }
.a-stretch{ align-items: stretch; }
.a-self-start{ align-self: flex-start; }
.a-self-auto{ align-self: auto; }
.a-self-end{ align-self: flex-end; }
.a-self-stretch{ align-self:stretch; }
.a-self-baseline{ align-self:baseline; }
/* Border */
.border{  border-width: 1px; border-style: solid; border-color: var(--borderColor);}
.border2{  border-width: 1px; border-style: solid; border-color: var(--borderColor2);}
.border-top{ border-top-width: 1px; border-top-style: solid; border-top-color: var(--borderColor); }
.border-right{ border-right-width: 1px; border-right-style: solid; border-right-color: var(--borderColor);}
.border-bottom{ border-bottom-width: 1px;border-bottom-style: solid;border-bottom-color:var(--borderColor);}
.border-left{ border-left-width: 1px;border-left-style: solid;border-left-color:var(--borderColor);}
.border-bottom-2{ border-bottom-width: 2px;border-bottom-style: solid;border-bottom-color:var(--borderColor2);}
.border-bottom-3{ border-bottom-width: 4px;border-bottom-style: solid;border-bottom-color:var(--borderColor3);}
.border-bottom-4{ border-bottom-width: 6px;border-bottom-style: solid;border-bottom-color:var(--borderColor4);}
.border-0{ border-width: 0; }
.border-top-0{ border-top-width: 0; }
.border-right-0{ border-right-width: 0; }
.border-bottom-0{ border-bottom-width: 0; }
.border-left-0{ border-left-width: 0; }

.border-primary{ border-color: var(--primary)!important }
.border-secondary{ border-color:var(--secondary)!important }
.border-success{ border-color: var(--success)!important }
.border-danger{ border-color: var(--danger)!important }
.border-warning{ border-color:var(--warning)!important }
.border-info{ border-color: var(--info)!important }
.border-light{ border-color: var(--light)!important }
.border-dark{ border-color: var(--dark)!important }
.border-white{ border-color: var(--white)!important }
.border-light-secondary{border-color: #F1F1F1!important;}

.rounded{ border-radius: 5px; }
.rounded-circle{ border-radius:100%; }
.rounded-0{ border-radius:0; }
.rounded-5{ border-radius: 5px; }

.rounded-10{ border-radius: 10px; }
.rounded-20{ border-radius: 20px; }
/* color */

.text-default{ color:var(--default)!important; }
.text-primary{ color:var(--primary)!important; }
.text-secondary{ color:var(--secondary)!important; }
.text-success{ color:var(--success)!important; }
.text-danger{ color: var(--danger)!important; }
.text-warning{ color:var(--warning)!important; }
.text-info{ color: var(--info)!important; }
.text-light{ color: var(--light)!important; }
.text-dark{ color: var(--dark)!important; }
.text-muted{ color: var(--muted)!important; }
.text-light-muted{ color: var(--lightmuted)!important; }
.text-white{ color: var(--white)!important; }
.text-black{ color: var(--black)!important; }
.text-diycolor3{ color: var(--diycolor3)!important; }
.bg-default{ background-color:var(--default)!important; }
.bg-primary{ background-color:var(--primary)!important; }
.bg-secondary{ background-color:var(--secondary)!important; }
.bg-success{ background-color:var(--success)!important; }
.bg-danger{ background-color: var(--danger)!important; }
.bg-warning{ background-color:var(--warning)!important; }
.bg-info{ background-color: var(--info)!important; }
.bg-light{ background-color: var(--light)!important; }
.bg-dark{ background-color: var(--dark)!important; }
.bg-white{ background-color: var(--white)!important; }
.bg-light-secondary{background-color: #F1F1F1!important;}
.bg-diy1{ background-color: var(--diycolor1)!important; }
.bg-diy2{ background-color: var(--diycolor2)!important; }
.bg-diy3{ background-color: var(--diycolor3)!important; }
nav .pagination{
	display:flex;
	align-items: center;
	justify-content: center;
}
nav .pagination li{
	padding: 5px 10px;
	margin: 10px;
	border-radius: 10px;
	min-width: 30px;
	border-width: 1px; border-style: solid; border-color: #dee2e6;
}
nav .pagination li a{
	color: #F4796C;
}
nav .pagination .active a {
	color: var(--dark)!important;
}