/* -----
共通
----- */

	/* --------
	フォント・フォントカラー
	-------- */
		body {
			font-family: serif;
			color: #231815;
		}

	/* -----
	header
	----- */

		header {
			margin-bottom: 50px;
			padding-top: 10px;

			background-color: #FFFFFF;
		}

		/* --------
		SNS
		-------- */
			header .sns {
				align-content: center;

				margin-right: 20px;
			}

			header .sns a {
				margin: 0 10px;
			}


	/* -----
	ページ見出し
	----- */
		.ttl {
			margin-bottom: 30px;
			background-color: #231815;
			color: #FFFFFF;
		}

		.ttl .box {
			justify-content: space-between;

			max-width: 1200px;

			margin: auto;
		}

		.ttl::after {
			content: "";
			display: block;

			width: 100%;

			background-color: #FFFFFF;

			border-bottom: 10px solid #DEB887;
		}

			
	/* -----
	pan
	----- */

		.pan {
			display: flex;

			max-width: 1200px;

			margin: auto;
			margin-bottom: 70px;
		}

		.pan a,
		.pan p {
			display: block;

			margin: 0 0 0 20px;

			font-size: small;
		}

		.pan a::after {
			content: "　>";
		}


	/* -----
	見出し（帯）
	----- */

		section .belt {
			margin-bottom: 50px;
			background-color: #231815;
			color: #FFFFFF;
		}


	/* -----
	footer
	----- */

		body {
			position: relative;

			min-height: 100vh;

			box-sizing: border-box;
		}

		footer {
			position: absolute;
			bottom: 0;

			width: 100%;

			background-color: #231815;
			color: #FFFFFF;
		}

		/* -----
		footerメニュー
		----- */

			footer menu {
				margin: 0;
				padding: 0;

				list-style: none;

				font-size: small;
			}

			footer li a {
				display: block;
			}

			
		/* -----
		SNS
		----- */

		footer .sns img {
			transition: 0.3s;
		}

		footer .sns img:hover {
			opacity: 0.6;
		}
		
		/* -----
		お問い合わせBTN
		----- */
		
			footer .agency,
			footer .contact {
				display: block;
			}

			footer .agency img,
			footer .contact img {
				transition: 0.3s;
			}

			footer .agency img:hover,
			footer .contact img:hover {
				opacity: 0.6;
			}

		/* -----
		会社名
		----- */

		footer .name {
			margin-bottom: 10px;

			font-size: xx-large;
		}


/* -----
PC
----- */

	@media not screen and (max-width:1200px) {

		/* --------
		中央寄せ
		-------- */
			
			.center {
				max-width: 1180px;
				margin: auto;
			}

		/* --------
		セクション間の隙間
		-------- */
			section {
				margin-bottom: 100px;

			}
			

		/* -----
		header
		----- */

			header .step {
				display: flex;
				justify-content: space-between;
				margin-top: 10px;
			}

			header .step:first-child {
				border-bottom: 5px solid #231815;
			}

			/* --------
			header 上段
			-------- */

				header .logo {
					margin-left: 20px;
					margin-bottom: 10px;
				}

				header .data {
					display: flex;
				}

				/* --------
				SNS
				-------- */

					header .sns img {
						transition: 0.3s;
					}
					
					header .sns img:hover {
						opacity: 0.6;
					}

				/* --------
				TEL
				-------- */

					header .call {
						text-align: end;

						margin-right: 20px;
						margin-bottom: 10px;
					}

					header .tel {
						margin-bottom: 3px;
					}

					header .time {
						font-size: x-small;
					}

			/* --------
			header 下段
			-------- */
			
				/* --------
				menu
				-------- */

					header nav button {
						display: none;
					}

					header menu {
						display: flex;
						
						margin: 0;
						margin-left: 30px;
						padding: 0;

						list-style: none;
					}

					header menu li {
						margin-right: 30px;
					}

					header menu .sp {
						display: none;
					}

					header li a {
						display: block;

						padding: 10px;
					}

				/* --------
				お問い合わせ
				-------- */

					header .customer {
						display: flex;
					}

					header .agency,
					header .contact {
						display: block;

						margin-right: 20px;
					}


					header .agency img,
					header .contact img {
						transition: 0.3s;
					}

					header .agency img:hover,
					header .contact img:hover {
						opacity: 0.6;
					}


		/* -----
		ページ見出し
		----- */

		
			.ttl .box {
				display: flex;
			}

			.ttl h1 {
				padding: 20px 0;
				margin-left: 20px;
				font-size: 70px;
			}

			.ttl p {
				position: relative;
				align-content: end;

				margin-right: 20px;
				padding: 10px 0;

				font-size: xx-large;
			}

			.ttl p::before {
				content: url(../../images/common/h1_logo.png);
				position: absolute;
				left: -100px;
				bottom: -5px;
			}

			.ttl::after {
				padding-top: 30px;
			}

			
		/* -----
		見出し（帯）
		----- */

			section h2 {
				max-width: 1180px;

				margin: auto;
				padding: 10px 0;

				font-size: xx-large;
			}

			section h2 br {
				display: none;
			}
			
		/* -----
		TOPへアイコン
		----- */

			.up {
				max-width: 1180px;

				margin: auto;

				margin-bottom: 10px;

				text-align: right;

			}

			.up img {
				width: 80px;
				
				margin-right: 5px;
				transition: 0.3s;
			}

			.up img:hover {
				opacity: 0.6;
			}


		/* -----
		footer
		----- */
		
			body {
				padding-bottom: 213px;
			}

			/* --------
			一段目
			-------- */

				footer menu {
					display: flex;
					justify-content: center;

					max-width: 1200px;
					
					margin: auto;
					margin-bottom: 30px;
				}

				footer menu li {
					text-align: center;
					margin: 0 5px;
				}

				footer li a {
					padding: 10px;
				}

			/* --------
			二段目
			-------- */
				
				footer .step {
					display: flex;
					justify-content: space-between;
					align-items: end;

					max-width: 1200px;

					margin: auto;
					margin-bottom: 20px;
				}

				footer .data {
					display: flex;
				}

				/* --------
				SNS
				-------- */
					footer .sns {
						align-content: center;

						margin-right: 20px;
					}

					footer .sns a {
						margin: 0 10px;
					}

				/* --------
				TEL
				-------- */

					footer .call {
						text-align: end;

						margin-right: 20px;
						margin-bottom: 10px;
					}

					footer .tel {
						margin-bottom: 3px;
					}

					footer .time {
						font-size: x-small;
					}

				/* --------
				お問い合わせ
				-------- */

					footer .contact,
					footer .agency {
						margin-right: 20px;
					}

					footer .customer {
						display: flex;
						justify-content: end;

						margin: auto;
					}
					
			/* -----
			会社名
			----- */

				footer .company {
					margin-left: 20px;
				}

			/* --------
			コピーライト
			-------- */

				footer .cr {
					text-align: center;
					padding: 3px;
					background-color: #FFFFFF;
					color: #231815;
				}
	}


/* -----
SP
----- */

	@media screen and (max-width:1200px) {

		/* --------
		中央寄せ
		-------- */
			
			.center {
				width: 100%;
			}

		/* --------
		セクション間の隙間
		-------- */
			section {
				margin-bottom: 50px;

			}


		/* -----
		header
		----- */
			header {
				position: sticky;
				top: 0;
				display: flex;
				justify-content: space-between;

				padding-bottom: 5px;

				border-bottom:5px solid #231815;

				z-index: 30;
			}

			header .logo {
				margin-left: 5px;
			}

			header .step {
				align-content: end;
			}

			header .logo img {
				height: 30px;
			}

			header .step .data,
			header .step .customer {
				display: none;
			}

			header nav button {
				align-content: center;

				margin-right: 10px;
			}

			header nav .gNav {
				display: none;

				position: absolute;
				top: 55px;
				left: 0px;

				width: 100%;

				background-color: #231815;

				z-index: 10;
			}

			header nav menu {
				text-align: center;

				margin: 0;
				padding: 0;

				list-style-type: none;

				box-shadow: 0 1px 5px 1px #DEB887;
			}

			header nav menu li {
				color: #FFFFFF;

				border-bottom: 1px dashed #DEB887;
			}

			header nav menu li:last-child {
				border-bottom: 0;
			}

			header menu a {
				display: block;

				padding: 10px;
			}

			header menu .sns {
				display: flex;
				justify-content: center;
			}


		/* -----
		ページ見出し
		----- */
		
			.ttl h1 {
				margin-left: 20px;
				padding-top: 10px;
				font-size: xx-large;
			}

			.ttl p {
				text-align: end;
				align-content: end;

				margin: 0 20px 5px 0;

				font-size: small;
			}
			
				.ttl::after {
				padding-top: 15px;
			}


		/* -----
		見出し（帯）
		----- */

			section h2 {
				width: 100%;

				padding: 10px 0 10px 5px;

				font-size: x-large;
			}
			

		/* -----
		TOPへアイコン
		----- */

			.up {
				position: fixed;
				right: 10px;
				bottom: 10px;

				z-index: 10;
			}

			.up img {
				width: 50px;
			}


		/* -----
		footer
		----- */
		
			body {
				padding-bottom: 826px;
			}

			/* -----
			footerメニュー
			----- */

				footer menu {
					margin-bottom: 30px;
				}

				footer menu li {
					border-bottom: 1px dashed #DEB887;
				}
				
				footer li a {
					padding: 15px;
				}

			/* -----
			SNS
			----- */

				footer .step {
					display: flex;
					flex-direction: column-reverse;

					text-align: center;
				}
			
				footer .sns {
					margin-bottom: 10px;
				}

				footer .sns img {
					margin: 0 10px 0 10px;
				}
			/* -----
			TEL
			----- */

				footer .call {
					margin-bottom: 10px;
				}

				footer .tel {
					margin-bottom: 3px;
				}

				footer .time {
					font-size: small;
				}

			/* -----
			お問い合わせBTN
				----- */
				
				footer .agency,
				footer .contact {
					margin-bottom: 10px;
				}

				footer .agency img,
				footer .contact img {
					width: 153px;
				}

			/* -----
			会社名
			----- */

				footer .company {
					margin-bottom: 50px;
				}

				footer .address {
					display: inline-block;
					text-align: left;
					
				}

			/* -----
			コピーライト
			----- */

				footer .cr {
					text-align: center;
					padding: 10px;

					font-size: small;
				}
	}