@charset "utf-8";

.dropzone {
	border: dashed 4px #e1e6ec;
	/*	background-color: #f3f3f3; */
	padding: 10px 10px;
}

.upload-area {
	color: #666;
}

.upload-area svg {
	width: 1rem;
}

.upload-area span {
	display: block;
	margin-bottom: 1rem;
	color: #999;
}

.content .main .supportForm .col:nth-child(even) {
	border-left: 2px solid gray;
	padding-left: 3rem;
}

.upload-area h3 {
	text-align: center;
}

.spinner-border {
	position: absolute;
	top: 48%;
	left: 50%;
	border: 16px solid #f3f3f3;
	border-top: 16px solid #666;
	border-bottom: 16px solid #666;
	border-radius: 50%;
	width: 120px;
	height: 120px;
	animation: spin 2s linear infinite;
}

@keyframes spin {
	0% {
		transform: rotate(0deg);
	}

	100% {
		transform: rotate(360deg);
	}
}

p.titleDesc {
	font-size: 16px;
	line-height: 1.6;
}

.supportForm .col-container {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 2rem;
}

.supportForm .col-container .col {
	width: 50%;
	padding-right: 10%;
}

.supportForm .col-container .col:nth-child(even) {
	border-left: 2px solid gray;
	padding-left: 3rem;
}

.supportForm .col-container .col .html-content {
	margin: 0;
}

.supportForm .col-container h1, .supportForm .html-content h1 {
	font-size: 20px;
	color: #535353;
	font-weight: bold;
}

.supportForm .group h3 {
	font-size: 18px;
	color: #333333;
	line-height: 28px;
	margin-bottom: 0.5em;
	padding-bottom: 0;
	font-weight: normal;
}

.supportForm .col-container .group {
	margin-bottom: 1em;
}

.supportForm .group textarea {
	margin-top: 10px;
	width: 100%;
	font-size: 15px;
	line-height: 1.5;
	height: 55px;
	padding: 15px;
	color: #333333;
}

.supportForm .group input[type=text] {
	font-size: 15px;
	margin: 0;
	letter-spacing: 0;
	color: #333333;
	letter-spacing: 0.05em;
	height: 40px;
	line-height: 40px;
	width: 100%;
	display: block;
	background: #fff;
	min-width: 1px;
	padding: 0 10px;
	border: 1px solid #ccc;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}

.supportForm .group textarea {
	height: 90px;
}

.supportForm .html-content {
	margin: 2rem 0 0 0;
}

@media (max-width:980px) {
	.supportForm .col-container .col {
		width: 100%;
		padding: 0;
	}

	.supportForm .col-container .col:nth-child(even) {
		border-left: none;
		padding-left: 0rem;
	}

	.supportForm .col-container .col .html-content {
		margin: 0 5%;
	}

	.supportForm .group {
		margin: 0 5%;
	}

	.supportForm .html-content {
		margin: 2rem 5% 0 5%;
	}

	.supportForm+.html-content {
		margin: 2rem 5% 0 5%;
	}
}