@charset "UTF-8";

/* ===================================
	File Name   : contact.css
	Description : Contact Pages Layout CSS
	
	Update Description :
	[2018/7/17] Top Page Setting
	[2018/5/1] 新規作成

====================================== */

/*========== Style Contents ==========

	1. Share Elements Setting
	2. Top Page Setting
	3. Form Page Setting
	
====================================== */



/*===== ■1. Share Elements Setting =====*/
dl.notice {
	margin: 0 20px 30px;
	padding: 20px;
	background: #ebebeb;
}

dl.notice dt {
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 1px solid #ccc;
}

dl.notice dd { font-weight: bold;}

ul.submit {
	display: flex;
	justify-content: center;
	margin: 0 10px;
}
ul.submit li {
	flex: 450px;
	margin: 0 10px;
}


@media only screen and (max-width: 750px){
	dl.notice {
		margin: 0 0 20px;
		padding: 10px;
	}
	
	dl.notice dt {
		margin-bottom: 10px;
		padding-bottom: 10px;
	}

}



/*===== ■3. Top Page Setting =====*/
#contact_top .flex2 { align-items: flex-start;}

#contact_top .flex2 > section {
	margin-bottom: 30px;
	padding-bottom: 15px;
}
#contact_top .flex2 > section:nth-last-of-type(-n+2) { margin-bottom: 0;}

#contact_top p {
	display: flex;
	justify-content: space-between;
	margin-bottom: 15px;
	padding: 0 10px 10px;
	border-bottom: 1px dotted #ccc;
	background: #fff;
}

#contact_top em {
	font-weight: bold;
	font-size: 1.8rem;
	line-height: 1.3;
}

#contact_top p a {
	align-items: center;
	position: relative;
	font-size: 1.4rem;
	line-height: 1;
	text-decoration: none !important;
}
#contact_top ul { margin: 0 10px 20px;}

#contact_top li {
	position: relative;
	margin-bottom: 10px;
	padding-left: 24px;
	line-height: 1.4;
}

#contact_top li::before {
	position: absolute;
	top: 0;
	left: 0;
	box-sizing: border-box;
	padding: 4px 5px;
	border-radius: 50%;
	background: #636262;
	color: #fff;
	font-size: 1.4rem;
	line-height: 1;
	font-family: Arial, Helvetica, "sans-serif";
	content:'Q';
}


@media only screen and (max-width: 750px){
	#contact_top .flex2 { align-items: flex-start;}

	#contact_top .flex2 > section {
		width: 100%;
		margin-bottom: 30px;
	}
	#contact_top .flex2 > section:nth-last-of-type(-n+2) { margin-bottom: 30px;}
	#contact_top .flex2 > section:nth-last-of-type(1) { margin-bottom: 0;}
	
	#contact_top em { font-size: 1.6rem;}
	
	#contact_top a.button.limited {
		width: 92%;
		padding: 15px 35px 15px 10px;
		font-size: 1.3rem;
	}
	
	#contact_top a.button i.arrow { width: 25px;}
}


/*===== ■2. Form Page Setting =====*/

@media only screen and (max-width: 750px){
}