/*════════════所有子页面样式════════════*/

/*════════════首页════════════*/
/* banner */
.banner {
	width: 100%;
	height: 380px;
	/* background-color: aquamarine; */
}

.banner img {
	width: 100%;
	height: 380px;
}

/* 软件和设计案例【软件案例+设计案例】 */
.case {
	width: 100%;
	height: 220px;
	margin-top: 20px;
	/* background-color: red; */
	display: flex;

}

/* 软件案例 */
.softcase {
	height: 220px;
	width: 46%;
	margin-left: 3%;
	margin-right: 1%;
	background-color: #60BBA7;
	display: flex;
	align-items: center;
	/*垂直居中*/
	/* justify-content: center; */
}

/* 设计案例 */
.designcase {
	height: 220px;
	width: 46%;
	margin-left: 1%;
	margin-right: 3%;
	background-color: #EE803A;
	display: flex;
	align-items: center;
	/*垂直居中*/
}

/* 公司信息【公司介绍+新闻动态】 */
.companyinfo {
	width: 100%;
	height: 220px;
	margin-top: 10px;
	/* background-color: red; */
	display: flex;
}

/* 公司介绍 */
.company {
	height: 220px;
	width: 46%;
	margin-left: 3%;
	margin-right: 1%;
	background-color: #B94850;
	display: flex;
	align-items: center;
	/*垂直居中*/
	/* justify-content: center; */
}

/* 新闻动态 */
.news {
	height: 220px;
	width: 46%;
	margin-left: 1%;
	margin-right: 3%;
	background-color: #5AC561;
	display: flex;
	align-items: center;
	/*垂直居中*/
}

/* 联系【联系我们+在线咨询】*/
.contact {
	width: 100%;
	height: 220px;
	margin-top: 10px;
	/* background-color: red; */
	display: flex;
}

/* 联系我们 */
.contactus {
	height: 220px;
	width: 46%;
	margin-left: 3%;
	margin-right: 1%;
	background-color: #404A65;
	display: flex;
	align-items: center;
	/*垂直居中*/
	/* justify-content: center; */
}

/* 在线咨询 */
.onlinecontact {
	height: 220px;
	width: 46%;
	margin-left: 1%;
	margin-right: 3%;
	background-color: #3E4651;
	display: flex;
	align-items: center;
	/*垂直居中*/
}



/*════════════公司信息页面════════════*/
.companyText {
	margin-left: 30px;
	margin-right: 30px;
	/* background-color: red; */
}



/*════════════我的页面════════════*/
/* 个人信息 */
.userInfo {
	height: 360px;
	width: 100%;
	display: flex;
	background-color: #D3E3F1;
}

/* 个人信息左侧 */
.userLeft {
	width: 360px;
	/* 下面三行一起实现内容水平居中与垂直居中 */
	display: flex;
	justify-content: center;
	/* 水平居中 */
	align-items: center;
	/* 垂直居中 */
	/* background-color: red; */
}

/* 个人信息右侧 */
.userRight {
	flex-grow: 1;
	/* 占据右边剩余空间 */
	/* background-color: lightseagreen; */
}

/* 登录 */
.userLogin {
	margin-top: 140px;
	font-size: 50px;
	font-weight: 700;
}

/* 登录文本 */
.userLoginText {
	margin-top: 10px;
}

/* 所有的横条菜单组样式 */
.barmenuGroup {
	width: 100%;
	background-color: white;
	margin-top: 20px;
}

/* 所有的横条菜单样式 */
.barmenu {
	width: 100%;
	height: 110px;
	background-color: white;
	display: flex;
}

/* 横条菜单左侧 */
.barmenuLeft {
	flex-grow: 1;
	/* 占据左侧剩余空间 */
	/* background-color: #5AC561; */
	/* 下面三行一起实现内容水平居中与垂直居中 */
	display: flex;
	align-items: center;
	/* 垂直居中 */
}

.barmenuLeft img {
	width: 50px;
	height: 50px;
	margin-left: 40px;
}

.barmenuLeft a {
	margin-left: 30px;
}

/* 横条菜单右侧 */
.barmenuRight {
	width: 100px;
	/* background-color: red; */
	/* 下面三行一起实现内容水平居中与垂直居中 */
	display: flex;
	justify-content: center;
	/* 水平居中 */
	align-items: center;
	/* 垂直居中 */
}

.barmenuRight img {
	width: 40px;
	height: 40px;
}

/* 横条菜单灰色线条 */
.barmenuLine {
	width: 88%;
	height: 2px;
	margin-left: 12%;
	/* background-color: red; */
	background-color: #e0e0e0;
}

/* 底部登录与退出 */
.logout {
	position: fixed;
	bottom: 600px;
	height: 80px;
	width: 100%;
	/* background-color: red; */
	display: flex;
	justify-content: center;
}

/* 立即登录 */
.loginBtn {
	height: 100px;
	width: 500px;
	background-color: royalblue;
	border-radius: 12px;
	font-size: 40px;
	color: white;
}

/* 退出登录 */
.logoutBtn {
	height: 100px;
	width: 500px;
	background-color: royalblue;
	border-radius: 12px;
	font-size: 40px;
	color: white;
	display: none;
}

/*════════════在线咨询页面════════════*/
/* 标题 */
.adviceTitle {
	width: 100%;
	/* background-color: red; */
	text-align: center;
	margin-top: 50px;
}

/* 表单 */
.adviceForm {
	/* background-color: #60BBA7; */
	padding-left: 90px;
}

.adviceForm label {
	margin-top: 20px;
	display: flex;
	align-items: center;
	/* 垂直居中 */
}

.adviceForm label a {
	color: red;
}

.adviceForm input {
	width: 800px;
	height: 90px;
	margin-top: 20px;
}

.adviceForm input a {
	font-size: 40px;
}

.adviceForm textarea {
	width: 800px;
	height: 400px;
	margin-top: 20px;
}

/* 提交需求按钮 */
.submitAdvice {
	/* position: fixed;
	bottom: 300px; */
	height: 100px;
	width: 500px;
	background-color: royalblue;
	border-radius: 12px;
	font-size: 40px;
	color: white;
	margin-left: 160px;
	margin-top: 100px;
}

/*════════════登录页面════════════*/
/* 登录说明 */
.loginText {
	color: #767C89;
	box-sizing: border-box;
	padding-top: 120px;
	padding-left: 50px;
	width: 100%;
	text-align: center;
	/* background-color: red; */
}

/* 登录信息 */
.loginInfo {
	width: 100%;
	margin-top: 30px;
	/* background-color: blue; */
}

/* 用户名、手机号、账号输入框 */
.userName {
	height: 70px;
	width: 600px;
	margin-top: 20px;
	font-size: 40px;
	border: 1px solid black;
	/* 边框为1像素宽，灰色 */
	box-sizing: border-box;
	padding: 0 20px;
}

/* 验证码 */
.checkCode {
	height: 70px;
	width: 320px;
	margin-top: 0;
	font-size: 40px;
	border: 1px solid black;
	/* 边框为1像素宽，灰色 */
	box-sizing: border-box;
	padding: 0 20px;
}

/* 密码输入框 */
.password {
	height: 70px;
	width: 600px;
	font-size: 40px;
	border: 1px solid black;
	box-sizing: border-box;
	padding: 0 20px;
}

/* 获取验证码 */
.getCode {
	width: 260px;
	height: 70px;
	margin-left: 10px;
	font-size: 40px;
	color: white;
	background-color: royalblue;
	border-radius: 10px;
}

/* 登录 */
.login {
	height: 80px;
	width: 300px;
	background-color: royalblue;
	font-size: 40px;
	color: white;
	border-radius: 10px;
}

/* 登录 */
.login-l {
	height: 80px;
	width: 500px;
	background-color: royalblue;
	font-size: 40px;
	color: white;
	border-radius: 10px;
	margin-top: 80px;
}

/* 返回 */
.back {
	height: 100px;
	width: 300px;
	margin-top: 50px;
	margin-left: 60px;
	font-size: 40px;
}

/* 密码登录和修改密码 */
.loginPwd {
	display: flex;
	width: 100%;
	margin-top: 60px;
	box-sizing: border-box;
	padding-left: 180px;
	padding-right: 120px;
	/* background-color: red; */
}

/* 密码登录 */
.loginPassword {
	flex-grow: 1;
	/* 占据左侧剩余空间 */
	color: royalblue;
	font-size: 42px;
}

/* 忘记密码 */
.forgetPassword {
	width: 600px;
	text-align: right;
	margin-top: 10px;
	margin-right: 0;
	color: royalblue;
	font-size: 42px;
}

/* 其他登录方式 */
.loginOther {
	margin-top: 200px;
}

/* 其他登录方式标题 */
.loginOtherTitle {
	width: 100%;
	text-align: center;
	color: #767C89;
}

/* 其他登录方式按钮 */
.loginOtherMenu {
	width: 100%;
	margin-top: 80px;
	display: flex;
	/* 水平居中 */
	justify-content: center;
	/* background-color: red; */
}

/* 按钮项 */
.loginOtherItem {
	display: flex;
	flex-direction: column;
	/* 设置为纵向排列 */
	align-items: center;
	/* 水平居中对齐 */
	margin-left: 100px;
	margin-right: 100px;
	/* background-color: #EE803A; */
}

.loginOtherItem img {
	width: 80px;
	height: 80px;
}

.loginOtherItem a {
	margin-top: 10px;
	color: #767C89;
}

/* 版权信息 */
.copyRight {
	/* 要设置fixed,才可以用bottom设置居于底部 */
	position: fixed;
	bottom: 100px;
	width: 100%;
	text-align: center;
	color: #8f8f8f;
	/* background-color: #f8f8f8; */
}

/* 登录方式切换样式 */
.loginMethodToggle {
	width: 70%;
	display: flex;
	justify-content: center;
	margin: 100px auto 0 auto;
	background-color: #fff;
	border-radius: 12px;
	padding: 8px;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
}

.methodTab {
	flex: 1;
	text-align: center;
	padding: 15px 20px;
	border-radius: 8px;
	cursor: pointer;
	font-size: 28px;
	color: #666;
	transition: all 0.3s ease;
}

.methodTab.active {
	background-color: #365DC2;
	color: white;
}

/* 登录表单样式 */
.loginForm {
	padding: 20px 0;
}

/* 居中表单样式 */
.centeredLoginForm {
	display: flex;
	flex-direction: column;
	align-items: center;
	padding: 20px;
}

/* 验证码输入容器 */
.codeInputContainer {
	display: flex;
	align-items: center;
	gap: 10px;
}

/* 底部登录区域 */
.loginBottom {
	display: flex;
	justify-content: center;
	margin-top: 20px;
}

/* 注册提示文字 */
.registerText {
	width: 600px;
	color: #767C89;
	text-align: left;
	margin-bottom: 10px;
	font-size: 32px;
}

/* 空隙文字样式 */
.spacerText {
	height: 32px;
	font-size: 32px;
}

/* 按钮容器样式 */
.buttonContainer {
	margin-top: 50px;
	display: flex;
	justify-content: center;
	gap: 20px;
	margin-top: 80px;
}

/* 注册按钮样式 */
.register {
	height: 80px;
	width: 300px;
	background-color: #f0f4ff;
	color: #365DC2;
	border: 2px solid #365DC2;
	border-radius: 10px;
	font-size: 40px;
	cursor: pointer;
}

.register:hover {
	background-color: #e0e8ff;
}