@charset "utf-8";

/* タイトル↓ */
.title {
  	height: 310px;
  	background-image: url(../images/jimusyo.jpeg);
  	background-repeat: no-repeat;
  	background-position: center center;
  	background-size: cover;
  	display: flex;
  	flex-direction: column;
  	justify-content: center;
  	align-items: center;
  	color: #fff;
  	text-shadow: 1px 1px 10px #000022;
}

.title h1 {
  	font-family: sans-serif;
  	font-size: 40px;
  	font-weight: bold;
	margin-top: 100px;
}

.title p {
  	font-size: 16px;
  	margin-top: 300px;
}
/* タイトル終わり↑ */

/* 予約の説明↓ */
.yoyaku {
  	width: 930px;
  	max-width: 100%;
  	margin-top: 75px;
  	margin-left: auto;
  	margin-right: auto;
	font-weight: bold;
}

main h2 {
  	font-size: 30px;
  	font-weight: bold;
  	line-height: 40px;
	border-bottom: 2px solid #000044;
	border-left: 10px solid #000044;
	padding: 10px;
}	
h2+p {
	color: #000;
	font-weight: normal;
	font-size: 20px;
	margin-top: 25px;
	line-height: 30px;
	letter-spacing: 0.2em;
	
}
/* 予約の説明終わり↑ */

/* 電話欄↓ */
.tel2 {
  	width: 930px;
  	max-width: 90%;
  	margin-top: 75px;
  	margin-left: auto;
  	margin-right: auto;
	font-weight: bold;
}
main h3 {
  	font-size: 22px;
  	font-weight: bold;
  	line-height: 30px;
}

main h3::after {
  	content: '';
  	display: block;
  	width: 36px;
  	height: 3px;
  	background-color: #000000;
  	margin-top: 20px;
  	margin-left: 25px;
}
p.tel3 {
	color: #1363DF;
	font-size: 30px;
	margin-top: 25px;
}
p.tel4 {
	color: #000;
	font-size: 17px;
	margin-top: 10px;
	font-weight: normal;
	letter-spacing: 0.2em;
}
/* 電話終わり↑ */

/*メールフォームエリア↓*/
.contact {
  	width: 930px;
  	max-width: 90%;
  	margin-top: 75px;
  	margin-left: auto;
  	margin-right: auto;
}
p.me1,p.me2 {
	color: #000;
	font-size: 17px;
	margin-top: 10px;
	font-weight: normal;
	letter-spacing: 0.2em;
}
p span {
	color: red;
}

.form-area {
  	background-color: #f8f8f8;
  	border: 1px solid #aaaaaa;
  	margin-top: 25px;
  	padding: 30px;
  	display: flex;
  	flex-wrap: wrap;
}

.form-area dt {
  	width: 200px;
  	padding: 15px 0;
  	font-size: 17px;
  	font-weight: bold;
  	line-height: 24px;
}
.re::after {
  	content: '*';
  	color: red;
}
	
.form-area dd {
  	width: calc(100% - 200px);
  	padding: 15px 0;
}

.input-text {
  	width: 100%;
  	max-width: 280px;
  	height: 40px;
  	padding-left: 10px;
  	padding-right: 10px;
}

.select-box {
  	width: 200px;
  	height: 40px;
}

.radio-button {
  	display: block;
  	margin-top: 20px;
}

.radio-button:first-child {
  	margin-top: 0;
}

.radio-button input {
  	margin-right: 8px;
}

.message {
  	width: 100%;
  	height: 260px;
  	padding: 10px;
  	line-height: 1.5;
}

.text {
  	font-size: 16px;
  	line-height: 22px;
  	margin-top: 30px;
}
/*メールフォームエリア終わり↑*/

/*ボタン↓*/
.button {
  	background-color: #ffa500;
  	display: inline-block;
  	min-width: 180px;
  	line-height: 48px;
  	border-radius: 10px;
  	font-size: 14px;
  	text-align: center;
  	margin-top: 20px;
  	border: none;
}
.button:hover {
  	background-color: #D2691E;
}
/*ボタン終わり↑*/

/*調整↓*/
.footer {
  	margin-top: 100px;
}
/*調整終わり↑*/