﻿@charset "utf-8";

/* トップページレイアウト */
@import url(common.css);

/*PC専用*/
@media screen and (min-width: 571px) {

	header {
		margin: 0 15px;
		width: 650px;
	}

	header h2 {
		margin: 0 0 20px 0;
		padding-top: 20px;
		text-align: center;
		font-size: 3.2rem;
		font-weight: nomal;
	}

	section {
		width: 650px;
		border-bottom: 1px solid #000000;
		margin-bottom: 3em;
	}

	section ul {
		width: 650px;
		list-style-type: none;
		padding: 0 2em;
	}

	#about p {
		margin: 1em auto;
		width: 620px;
	}

	#access p {
		margin-left: 1.5em;
		width: 620px;
	}

	.right_l {
		text-align: right;
		padding-right:1.5em;
		color: #529F3F;
	}

	.embed-wrapper iframe {
		border:0;
		margin: 0 0 0 15px;
	}

}


/*--  スマホ  --*/
@media screen and (max-width: 570px) {

	header {
		width: 100%;
	}

	header img {
		width: 50% ;
	}

	header h2 {
		margin: 0 0 10px 0;
		padding-top: 10px;
		text-align: center;
		font-size: 1.7rem;
		font-weight: nomal;
	}

	section {
		width: 95%;
		border-bottom: 1px solid #000000;
		margin-bottom: 1.5rem;
		margin-left: 2.5%;
		margin-right: 2.5%;
	}

	section ul {
		list-style-type: none;
		padding: 0 7px;
	}

	#hist ul {
		margin: 0.5rem auto;
		width: 90%;
	}

	#about p {
		margin: 0.5rem auto;
		width: 94%;
	}

	#access p {
		margin: 0.5rem auto 1rem 1rem;
		width: 94%;
	}

	.right_l {
		text-align: right;
		padding-right:1.5rem;
		color: #529F3F;
	}

	.embed-wrapper {
		width: 100% ;
		max-width: 620px ;
		height: 0 ;
		padding-bottom: 56.25% ;	/* 横幅に対する縦幅の比率 */
		position: relative ;
		top: 0 ;
		left: 0 ;
	}

	.embed-wrapper iframe {
		width: 100% ;
		height: 100% ;
		margin: 0 ;
		padding: 0 ;
		position: absolute ;
		top: 0 ;
		left: 0 ;
	}
}
