@charset "utf-8";
/* contact.css */

#contact {
	padding: 115px 0 0;
}

@media screen and (max-width:1000px) {
#contact {
	padding: 75px 0 0;
}	
}


.page_ttl {
	padding: 70px 0;
}

@media screen and (max-width:1000px) {
.page_ttl {
	padding: 50px 0 40px;
}	 
}

.page_ttl h2 {
	font-size: 40px;
	text-align: center;
	color: #9B9B9B;
	margin: 0 0 15px;
}

@media screen and (max-width:1000px) {
.page_ttl h2 {
	font-size: 24px;
	margin: 0 0 10px;
}	
}

@media screen and (max-width:500px) {
.page_ttl h2 {
	font-size: 21px;
	margin: 0 0 10px;
}	
}


.page_ttl h2 span {
	font-size: 20px;

}

@media screen and (max-width:1000px) {
.page_ttl h2 span {
	font-size: 13px;	
}	
}

@media screen and (max-width:500px) {
.page_ttl h2 span {
	font-size: 11px;	
}	
}


.page_ttl p {
	display: flex;
	justify-content: space-between;
	width: 62px;
	margin: 0 auto;
}

@media screen and (max-width:768px) {
.page_ttl p {
	width: 50px;
	margin: 0 auto;
}	
}

.page_ttl p span {
	width: 12px;
	height: 12px;
	border-radius: 50%;
}

@media screen and (max-width:768px) {
.page_ttl p span {
	width: 9px;
	height: 9px;
}	
}

.page_ttl p span:first-child {
	background-color: #F6B83A;
}

.page_ttl p span:nth-child(2) {
	background-color: #81AF2D;
}

.page_ttl p span:nth-child(3) {
	background-color: #DD606D;
}

#contact_container {
	width: 95%;
	max-width: 1100px;
	margin: 0 auto 80px;
}

@media screen and (max-width:1000px) {
#contact_container {
	margin: 0 auto 20px;
}	
}