@charset "utf-8";
/*==================================================
	【サブ】ページ固有のスタイル
==================================================*/
#station .txt {
	font-size : 16px;
	line-height : 35px;
	letter-spacing : 3.2px;
}
#station .msg {
	position: relative;
}
#station .msg .img {
	width: 325px;
	position: absolute;
	top: -20px;
	right: 0;
}
#station .msg .box {
	background: #fff;
	padding: 30px 50px;
	border-radius: 10px;
	position: relative;
}
#station .msg .box::before {
	content: "";
	background: url("../img/top/concept-ico01.png") no-repeat top left/100%;
	width: 90px;
	height: 90px;
	position: absolute;
	top: -25px;
	left: 20px;
}
#station .msg .box .ttl {
	font-size : 20px;
	letter-spacing : 4px;
	color : #534741;
}
#station .flow {
	position: relative;
}
#station .flow::before {
	content: "";
	background: url("../img/station/bg01.png") no-repeat top right/100%;
	width: 205px;
	height: 188px;
	left: auto;
	right: 0;
	top: -100px;
	position: absolute;
}
#station .flow .box {
	margin-bottom: 80px;
	align-items: center;
}
#station .flow .box:not(:last-of-type)::before {
	content: "";
	width: 5px;
	height: calc(100% - 430px);
	background: #fff;
	margin-left: 130px;
	position: absolute;
	top: 200px;
	left: 0;
	z-index: -5;
}
#station .flow .box .maru {
	width: 276px;
	position: relative;
}
#station .flow .box .maru .img {
	position: relative;
	z-index: -2;
}
#station .flow .box .maru .img img {
	border-radius: 50%;
	width: 285px;
	height: 285px;
	border: 5px solid #fff;
}
#station .flow .box .maru .num {
	position: absolute;
	top: 0;
	right: 30px;
	font-size : 35px;
	letter-spacing : 7px;
	color : #534741;
}
#station .flow .box .maru .num::before {
	content: "";
	background: url("../img/station/num-bg.png") no-repeat center/100%;
	width: 61px;
	height: 72px;
	position: absolute;
	top: -3px;
	right: -15px;
	z-index: -1;
}
#station .flow .box .maru::after {
	content: "";
	background: url("../img/station/num-bg02.png") no-repeat bottom left/100%;
	width: 96px;
	height: 109px;
	position: absolute;
	bottom: 0;
	left: 0;
	z-index: -3;
}
#station .flow .box dl {
	width: calc(100% - 300px);
}
#station .flow .box dt {
	font-size : 35px;
	letter-spacing : 7px;
	color : #534741;
}
#station .office h3.sub {
	position: relative;
}
#station .office h3.sub::before {
	content: "";
	background: url("../img/top/concept-ico02.png") no-repeat center/100%;
	width: 130px;
	height: 90px;
	position: absolute;
	top: 0;
	left: 250px;
}
#station .office .txt_box {
	width: 450px;
}
#station .office dl {
	border-top: 1px solid #fff;
	padding: 30px 0;
	display: flex;
	font-size : 16px;
	line-height : 35px;
	letter-spacing : 3.2px;
	color : #998675;
}
#station .office dl:last-of-type {
	border-bottom:  1px solid #fff;
}
#station .office dt {
	width: 30%;
}
#station .office dd {
	width: 65%;
}
#station .office iframe {
	border: 5px solid #fff;
	border-radius: 10px;
	width: 400px;
}
@media print, screen and (min-width: 769px){ /* PCのみ */
}
@media print, screen and (min-width: 641px){ /* PC・タブレット */
}
@media only screen and (max-width: 768px) and (min-width: 641px){ /* タブレットのみ */
}
@media only screen and (max-width: 768px) {  /* タブレット以下 */
	#station .txt {
		font-size: 100%;
		line-height: 1.8em;
		letter-spacing: normal;
	}
	#station .msg .img {
		width: 35%;
	}
	#station .msg .box {
		margin-top: 80px;
		padding: 20px 30px;
	}
	#station .msg .box::before {
		width: 70px;
		height: 70px;
		top: -20px;
		left: 10px;
	}
	#station .msg .box .ttl {
		font-size: 115%;
	}
	#station .flow::before {
		width: 160px;
		height: 155px;
		top: -50px;
	}
	#station .flow .box {
		margin-bottom: 30px;
	}
	#station .flow .box:not(:last-of-type)::before {
		margin-left: 100px;
	}
	#station .flow .box .maru {
		width: 220px;
	}
	#station .flow .box .maru::after {
		width: 70px;
		height: 75px;
	}
	#station .flow .box .maru .img img {
		width: 200px;
		height: 200px;
	}
	#station .flow .box dl {
		width: calc(100% - 230px);
	}
	#station .flow .box dt {
		font-size: 25px;
		letter-spacing: normal;
	}
	#station .office h3.sub::before {
		width: 100px;
	}
	#station .office .box_flex {
		display: block;
	}
	#station .office .txt_box {
		width: 100%;
		margin-bottom: 30px;
	}
	#station .office dl {
		padding: 15px 0;
		font-size: 100%;
	}
	#station .office iframe {
		width: 100%;
		height: 300px;
	}
}
@media only screen and (max-width: 640px){ /* スマホ */
	#station .msg .img {
		position: relative;
		margin: 0 auto;
		width: 80%;
		top: 5px;
	}
	#station .msg .box {
		margin-top: 20px;
	}
	#station .msg .box::before {
		width: 50px;
		height: 50px;
		left: -25px;
		top: 0;
	}
	#station .msg .box .ttl {
		text-align: left;
		font-size: 110%;
		letter-spacing:  normal;
	}
	#station .flow::before {
		width: 100px;
	}
	#station .flow .box:not(:last-of-type)::before {
		display: none;
	}
	#station .flow .box .maru {
		margin: 0 auto;
	}
	#station .flow .box dl {
		width: 100%;
	}
	#station .flow .box dt {
		font-size: 20px;
	}
	#station .office .txt_box {
		width: 100%;
		margin-top: 30px;
	}
	#station .office dl {
		display: block;
		line-height: 1.8em;
		letter-spacing: normal;
	}
	#station .office dt,#station .office dd {
		width: 100%;
	}
}