@charset "utf-8";
/* ==========================================================================
 initialize
========================================================================== */










	#header.t #topimage {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
	}
		#header.t #topimage > div {
			background-size: cover;
			/* -webkit-box-flex: 1; */
			-ms-flex-positive: 1;
			flex-grow: 1;
		}
			#header.t #topimage > div:nth-child(1) {
				background-image: url(../img/sightseeing/topimage/1.jpg);
				background-position: 30% 0%;
			}
			#header.t #topimage > div:nth-child(2) {
				background-image: url(../img/sightseeing/topimage/2.jpg);
				background-position: 0% 0%; 
			}
			#header.t #topimage > div:nth-child(3) {
				background-image: url(../img/sightseeing/topimage/3.jpg?ut=1560178800);
				background-position: 58% 0%;
			}

			#introduction > article > p {
				display: block !important;
				width: 60%;
				margin-right: auto !important;
				margin-left: auto !important;
			}



			#frm_0 dd > p:nth-child(2) {
		color: red;
		font-size: 1.50rem;
	}

	#frm_0 dd > p:nth-child(4) {
		font-size: 1.50rem;
	}

	#frm_0 dd > p:nth-child(5) {
		font-size: 1.15rem;
		padding: 0.75rem 0;
		border-top: 1px solid rgba(51 51 51/ 1.0);
		border-bottom: 1px solid rgba(51 51 51/ 1.0);
	}

	#frm_1 > article > ul > li > * {
		text-align: left;
	}

	#frm_1 > article > ul > li::before {
		content: "";
		display: flex;
		justify-content: center;
		width: 100%;
		height: 100px;
		margin-bottom: 20px;
		background-position: center center;
		background-repeat: no-repeat;
		background-size: 100px;
	}

	#frm_1 > article > ul > li:nth-child(1)::before {
		background-image: url(../img/sightseeing/1/dinner.png);
	}

	#frm_1 > article > ul > li:nth-child(2)::before {
		background-image: url(../img/sightseeing/1/lunch.png);
	}


	#frm_1 > article > ul > li:nth-child(2) dl dd:last-child {
		margin-top: 20px;
		padding-top: 20px;
		border-top: 2px dashed rgba(51 51 51/ 1.00);
	}

	#frm_1 article > section:last-child {
		max-width: 800px;
		margin-right: auto;
		margin-left: auto;
	}

	#frm_1 article > section:last-child * {
		font-family: sans-selif;
	}

	#frm_1 article > section:last-child h4 {
		border-bottom: 2px solid rgba(51 51 51/ 1.00);
	}

	#frm_2 > article > ul > li {
		display: flex;
		flex-direction: column;
		justify-content: space-between;
	}

	#frm_2 > article > ul > li > p a {
		display: flex;
		align-items: center;
		justify-content: center;

		width: 100%;
		height: 100%;
		padding: 10px 0;
		border: 1px solid rgba(200 165 65/ 1.00);
		color: rgba(200 165 65/ 1.00);
	}

	#frm_2 dd p:nth-child(1) {
		display: flex;
		align-items: center;
		justify-content: center;
		min-height: 160px;
		border-top: 1px solid rgba(51 51 51/ 1.00);
		border-bottom: 1px solid rgba(51 51 51/ 1.00);
	}

	#frm_2 dd p:nth-child(2) {
		font-family: sans-serif;
		font-size: 1.75rem;
		font-weight: bold;
	}





	[id^=frm_] {
		margin: 0 auto 50px auto;
		/* border: 1px solid red; */
	}

	[id^=frm_] > article > ul {
		display: flex;
		justify-content: space-between;

		width: 90%;
		margin: auto;
	}

	[id^=frm_] img {
		width: 100%;
	}

	#frm_0 > article > ul {
		margin: 0 auto
	}

	#frm_0 > article > ul > li {
		width: calc(100% / 3 - 15px);
	}

	@media all and (max-width: 1100px) {
		body,
		main,
		#footer,
		.footer-header {
			width: 100% !important;
			max-width: 100% !important;
			min-width: 100% !important;
			padding: 0;
			margin: 0;
		}


		#introduction .text {
			width: 85%;
			margin: 0 auto !important;
		}

		#footer #groupstore ul {
			margin-right: 0;
			margin-left: 0;
		}

		#footer #groupstore ul li {
			width: calc(100% / 7 - 8px);
		}



		#frm_0 > article > ul {
			flex-wrap: wrap;
			justify-content: center;

			width: 85%;
			margin: auto;
		}

		#frm_0 > article > ul > li:nth-child(1),
		#frm_0 > article > ul > li:nth-child(2) {
			width: calc(100% / 2 - 10px);
		}

		#frm_0 > article > ul > li:nth-child(1),
		#frm_0 > article > ul > li:nth-child(2) {
			width: calc(100% / 2 - 10px);
		}

		#frm_0 > article > ul > li:nth-child(1) {
			width: calc(40% - 10px);
			margin: 0 10px 20px 0;
		}

		#frm_0 > article > ul > li:nth-child(2) {
			width: calc(60% - 10px);
			margin: 0 0 20px 10px;
		}

		#frm_0 > article > ul > li:nth-child(3) {
			width: 100%;
			margin: 0 auto;
		}

	}


	@media all and (max-width: 700px) {
		#introduction .text {
			width: 90%;
			margin: 0 auto !important;
		}

		#frm_0 > article > ul {
			width: 100%;
		}

		#frm_0 > article > ul > li {
			width: 90% !important;
			margin: auto;
		}

	}




	#frm_1 > article > ul {
		width: 80%;
		margin: 0 auto
	}

	#frm_1 > article > ul > li {
		width: calc(100% / 2 - 15px);
	}

	#frm_1 > article > section {
		width: 85%;
		margin: 30px auto 0 auto;
	}

	@media all and (max-width: 960px) {
		#frm_1 > article > ul {
			flex-wrap: wrap;
			width: 85%;
		}

	}

	@media all and (max-width: 700px) {
		#frm_1 > article > ul {
			width: 100%;
		}

		#frm_1 > article > ul > li {
			width: 90% !important;
			margin: auto;
		}

		#frm_1 > article > ul > li {
			width: 90%;
			margin: 0 auto;
		}

		#frm_1 > article > section {
			width: 90%;
		}
	}




	#frm_2 > article > ul {
		width: 100%;
		margin: 0 auto
	}

	#frm_2 > article > ul > li {
		width: calc(100% / 4 - 15px);
	}

	@media all and (max-width: 960px) {
		#frm_2 > h3 {
			width: 90%;
			margin: auto;
		}

		#frm_2 > article > ul {
			flex-wrap: wrap;
			width: 85%;
		}

		#frm_2 > article > ul > li {
			width: calc(100% / 2 - 15px);
			margin-bottom: 20px;
		}

	}

	@media all and (max-width: 700px) {
		#frm_2 > article > p {
			width: 90% !important;
			margin: 20px auto;
		}

		#frm_2 > article > ul {
			width: 100%;
		}

		#frm_2 > article > ul > li {
			width: 90% !important;
			margin: auto;
		}

		#frm_2 > article > ul > li {
			width: 90%;
			margin: 0 auto;
		}

	}
