:root {
	--search-height: 42px;
	--search-color:#0072c9;
}

.search-content{
	width: 100%;
	display: flex;
	justify-content: center;
}

.mysearch {
	width: 60%;
	min-width: 320px;
	max-width: 640PX;
	height: var(--search-height);
	display: flex;
}

.mysearch button,
.mysearch input {
	font-family: Microsoft YaHei, Heiti SC, tahoma, arial, Hiragino Sans GB, "\5B8B\4F53", sans-serif;
	outline: none;
	line-height: (--search-height);
	height: var(--search-height);
	border: 2px solid #c5c0c0;
	border-right: 0;
	display: block;
}

.mysearch input:focus {
	opacity:1;
	border: 2px solid var(--search-color);
	border-right: 0;
}

.mysearch input {
	width: calc(100% - 100px);
	min-width: 320px;
	max-width: 640px;
	font-size: 14px;
	border-top-left-radius: 10px;
	border-bottom-left-radius: 10px;
	padding-left: 15px;
	padding-right: 10px;
}

.mysearch button {
	min-width: 100px;
	font-size: 14px;
	color: #fff;
	background-color: var(--search-color);
	border-top-right-radius: 10px;
	border-bottom-right-radius: 10px;
	border: 1px solid var(--search-color);
}