コンタクトパーツ

<link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20..48,100..700,0..1,-50..200">

<div  id="mailtous">
	<hr class="green">
	<p>ご不明点がございましたらお気軽に 以下よりお問い合わせください。</p>
	<a href="/form.php">お問い合わせ</a>
</div>

#mailtous {
	width: 100%;
	margin: 2rem 0;
	text-align: center;
	}
#mailtous a {
	display: block;
	background: #f9f9f9;
	width: 32rem;
	margin: 3rem auto;
	padding: 1rem 0;
	border: 1px solid #666;
	border-radius: 5px;
	color: #000;
	font-size: 2.5rem;
	font-weight: 300;
	}
#mailtous a:hover {
	text-decoration: none;
	background: rgba(238,120,54,.2);
	}
#mailtous a:before {
	font-size: 4rem;
	font-family: "Material Symbols Outlined";
	content: 'mail';
	display: inline-flex !important;
	align-items: center !important;
	vertical-align: -11px !important;
	}

@media screen and (max-width: 767px) {
	#mailtous a {
		width: 90%;
		padding: 2rem 1rem;
		}
	}

hr.green {
	width: 100%;
	height: 2px;
	margin: 2rem auto;
	padding: 0;
	border: 0;
	background: linear-gradient(to right, rgba(24, 157, 0,0), rgba(24, 157, 0,1), rgba(24, 157, 0,0));
	}