body {
	max-width: 640px;
	margin: 0 auto;
}

body.top > header {
	height: 0;
	padding-top: 133.75%;
	background: url(../images/top/header_bg.png) no-repeat center top;
	background-size: contain;
	position: relative;
}
body.top > header > nav {
	position: absolute;
	top: 36.5%;
	width: 100%;
	z-index: 0;
}
body.top > header ul {
	display: block;
	width: 100%;
	margin: 0 auto;
	margin-bottom: 3%;
	margin-left: 5%;
}
body.top > header ul li a {
	display: block;
	float: left;
	height: 0;
	width: 44%;
	overflow: hidden;
	margin-bottom: 2%;
}
body.top > header ul li.profile a {
	padding-top: 18.4%;
	background: url(../images/top/nav_profile.png) no-repeat center top;
	background-size: contain;
}
body.top > header ul li.lesson a,
body.top > header ul li.demo a,
body.top > header ul li.event a,
body.top > header ul li.news a {
	padding-top: 19.9%;
	padding-left: 1%;
}
body.top > header ul li.lesson a {
	background: url(../images/top/nav_lesson.png) no-repeat center top;
	background-size: contain;
}
body.top > header ul li.demo a {
	background: url(../images/top/nav_demo.png) no-repeat center top;
	background-size: contain;
}
body.top > header ul li.event a {
	background: url(../images/top/nav_event.png) no-repeat center top;
	background-size: contain;
}
body.top > header ul li.news a {
	background: url(../images/top/nav_news.png) no-repeat center top;
	background-size: contain;
}
body.top > header ul li.tel a,
body.top > header ul li.mail a {
	padding-top: 14.625%;
	padding-left: 1%;
}
body.top > header ul li.tel a {
	background: url(../images/tel.png) no-repeat center top;
	background-size: contain;
}
body.top > header ul li.mail a {
	background: url(../images/mail.png) no-repeat center top;
	background-size: contain;
}
body.top > article {
	height: 0;
	padding-top: 192.656%;
	background: url(../images/top/top.png) no-repeat center top;
	background-size: contain;
}
body.top > footer {
	background-color: #002e73;
}
body.top > footer div {
	position: relative;
	padding-top: 5%;
}
body.top > footer .copy {
	height: 0;
	padding-top: 5.79%;
	background: url(../images/top/footer.png) no-repeat center top;
	background-size: contain;
}
ul.contact {
	display: block;
	width: 85.937%;
	margin-left: 6.862%;
}
ul.contact li {
	display: block;
}
ul.contact li a {
	display: block;
	float: left;
	height: 0;
	overflow: hidden;
	width: 48.909%;
	padding-top: 16.363%;
}
ul.contact li:last-child a {
	margin-left: 2.182%;
}
ul.contact li.tel a {
	background: url(../images/tel.png) no-repeat center top;
	background-size: contain;
}
ul.contact li.mail a {
	background: url(../images/mail.png) no-repeat center top;
	background-size: contain;
}
ul.social {
	display: block;
	width: 87.5%;
	margin-top: 3.125%;
	margin-left: 6.862%;
}
ul.social li {
	display: block;
}
ul.social li a {
	display: block;
	float: left;
	overflow: hidden;
	height: 0;
	margin-right: 2.8575%;
}
ul.social li:last-child a {
	margin-right: 0;
}
ul.social li.access a {
	width: 37.857%;
	padding-top: 15%;
	background: url(../images/top/nav_access.png) no-repeat center top;
	background-size: contain;
}
ul.social li.facebook a {
	width: 23.928%;
	padding-top: 14.642%;
	background: url(../images/top/nav_facebook.png) no-repeat center top;
	background-size: contain;
}
ul.social li.jdc a {
	width: 32.5%;
	padding-top: 15.892%;
	background: url(../images/top/nav_jdc.png) no-repeat center top;
	background-size: contain;
}
p.contact {
	margin-top: 3.125%;
	margin-bottom: 3.125%;
	margin-left: 6.862%;
	font-size: 2.812vw;
	line-height: 1.8em !important;
}
p.contact a {
	color: #fff;
	text-decoration: none;
}
body.top p.bottom {
	position: absolute;
	right: 3%;
	bottom: 3%;
	font-size: 3.125vw;
	padding-top: 0.1%;
	padding-left: 6%;
	background: url(../images/arrow.png) no-repeat left top;
	background-size: contain;
}
p.bottom a {
	display:block;
	text-decoration: none;
	color: #00a0e8;
}

body.profile > header > h1 {
	height: 0;
	padding-top: 11.093%;
	background: url(../images/profile/header_profile.png) no-repeat center top;
	background-size: contain;
}
body.lesson > header > h1 {
	height: 0;
	padding-top: 11.111%;
	background: url(../images/lesson/header_lesson.png) no-repeat center top;
	background-size: contain;
}
body.demo > header {
	height: 0;
	padding-top: 11.093%;
	background: url(../images/demo/header_demo.png) no-repeat center top;
	background-size: contain;
}
body.access > header {
	height: 0;
	padding-top: 11.093%;
	background: url(../images/access/header_studio.png) no-repeat center top;
	background-size: contain;
}
body.profile > article h2,
body.lesson > article h2,
body.demo > article h2,
body.access > article h2 {
	margin-top: 3%;
}
body.profile > article div.photo {
	margin: 0 auto;
	margin-top: 4%;
	text-align: center;
	position: relative;
}
body.profile > article div.photo img {
	width: 52.656%;
}
body.profile > article div.photo > p {
  position: absolute;
	right: 6.211%;
	width: 11.25%;
	height: 0;
	padding-top: 13.25%;
	font-size: 2.5vw;
	text-align: left;
	line-height: 1.4em;
}
body.profile > article div.photo p.facebook {
	bottom: 20%;
	background: url(../images/facebook.png) no-repeat center top;
	background-size: contain;
}
body.profile > article div.photo p.ameba {
	bottom: 60%;
	background: url(../images/ameba.png) no-repeat center top;
	background-size: contain;
}
body.profile > article div.photo p.facebook a,
body.profile > article div.photo p.ameba a {
	color: #00a0e9;
	text-decoration: none;
}
body.profile > article h2.shibanishi {
	height: 0;
	padding-top: 8.92%;
	background: url(../images/profile/name_murata.png) no-repeat center top;
	background-size: contain;
}
body.profile > article h2.maria {
	height: 0;
	padding-top: 8.763%;
	background: url(../images/profile/name_maria.png) no-repeat center top;
	background-size: contain;
}
body.profile > article p,
body.lesson > article p,
body.demo > article p,
body.access > article p {
	width: 85%;
	margin: 0 auto;
	margin-top: 3.125%;
	font-size: 4.375vw;
	line-height: 1.5em;
}
body.profile > article h3.gallery {
	height: 0;
	margin-top: 4.687%;
	padding-top: 5.937%;
	background: url(../images/profile/header_gallery.png) no-repeat center top;
	background-size: contain;
}
body.profile > article ul.gallery {
	margin: 0 auto;
	width: 100%;
	margin-left: 7.5%;
}
body.profile > article ul.gallery li {
	list-style-type: none;
	float: left;
	width: 41.25%;
	height: 53.437%;
	margin-top: 2.5%;
	margin-right: 2.5%;
}
body.profile > article ul.gallery li.wide {
	width: 85%;
}
body.profile > article ul.gallery li img {
	width: 100%;
	height: 100%;
}
body.profile ul.contact,
body.lesson ul.contact,
body.demo ul.contact,
body.access ul.contact {
	margin-top: 4.687%;
}
body.profile p.bottom,
body.lesson p.bottom,
body.demo p.bottom,
body.access p.bottom {
	width: 88.125%;
	height: 4.687%;
	text-align: right;
	margin-top: 6.25%;
	margin-bottom: 6.25%;
}
body.profile p.bottom a,
body.lesson p.bottom a,
body.demo p.bottom a,
body.access p.bottom a {
	display: inline;
	background: url(../images/icon_home.png) no-repeat left top;
	background-size: 21px 17px;
	padding-top: 4px;
	padding-left: 24px;
	font-size: 4.062vw;
}
body.lesson > article h2.lesson {
	height: 0;
	padding-top: 8.906%;
	background: url(../images/lesson/header_lesson_menu.png) no-repeat center top;
	background-size: contain;
}
body.lesson > article h2.price {
	height: 0;
	padding-top: 8.906%;
	background: url(../images/lesson/header_price.png) no-repeat center top;
	background-size: contain;
}
body.lesson ul.lesson {
	width: 100%;
	margin: 0 auto;
	margin-top: 4.687%;
	margin-left: 7.5%;
	font-size: 4.375vw;
}
body.lesson ul.lesson li {
	list-style-type: none;
	float: left;
	width: 42.187%;
	margin-bottom: 3.125%;
}
body.lesson ul.lesson li.long {
	width: 84.375%;
}
body.lesson > article p.note {
	width: 85%;
	margin: 0 auto;
}
body.lesson p.tel a {
	color: #00a0e8;
	text-decoration: none;
}
body.demo > article h2.price {
	height: 0;
	padding-top: 8.906%;
	background: url(../images/demo/header_demo_price.png) no-repeat center top;
	background-size: contain;
}
body.demo > header > h1 span {
	display: block;
}
body.access > article h2.guide {
	height: 0;
	padding-top: 8.906%;
	background: url(../images/access/header_studio_guide.png) no-repeat center top;
	background-size: contain;
}
body.access > article h3 {
	width: 85%;
	margin: 0 auto;
	margin-top: 3%;
	font-size: 4.375vw;
	line-height: 1.5em;
}
body.access hr {
	width: 85%;
	margin: 5px auto;
}
div.map {
	position: relative;
	padding-bottom: 115%;
	height: 0;
	overflow: hidden;
	margin: 5% auto;
}
div.map iframe {
	position: absolute;
	top: 0;
	left: 6%;
	width: 88% !important;
	height: 100% !important;
}

/* 2023.11追加 */

body.top > header ul li.studio {
	position:relative;
}

body.top > header ul li.studio a {
	padding-top: 19.9%;
	padding-left: 1%;
	background: url(../images/top/nav_studio.png) no-repeat center top;
	background-size: contain;
}

body.top > header ul li.studio:before {
	content: "";
	position: absolute;
	top: -7vw;
	right: 13vw;
	display: block;
	width: 12.5vw;
	height: 12.5vw;
	text-indent: 0;
	background: url(../images/top/nav_studio_open.png) no-repeat center top;
	background-size: contain;
	z-index: 100;
}

body.profile > article ul.normal_list,
body.access > article ul.normal_list {
	width: 85%;
	margin: 0 auto;
	margin-top: 3.125%;
	font-size: 4.375vw;
	line-height: 1.5em;
	list-style: none;
}
body.access > article ul.normal_list {
	margin-top: 6.25%;
}
body.profile > article ul.normal_list li,
body.access > article ul.normal_list li {
	padding-left: 4.375vw;
	text-indent: -4.375vw;
}
body.profile > article ul.normal_list li:before,
body.access > article ul.normal_list li:before {
	content: "・";
}
body.access > article h3.bl-txt {
	color: #00a0e8;
	margin-top: 3.125%;
	font-size: 5.125vw;
	text-align: center;
}
body.access > article div.pic {
	position: relative;
}
body.access > article div.pic p {
	width: auto;
}
body.access p.pic_studio img {
	max-width: 100%;
	height: auto;
}
body.access p.pic_comment {
	position: absolute;
	right: 6.25vw;
	bottom: -15vw;
}
body.access p.pic_comment img {
	width: 20vw;
}

@media (min-width: 640px) {
	p.contact {
		font-size: 16px;
	}
	body.top p.bottom {
		font-size: 14px;
		padding-left: 30px;
	}
	body.profile > article div.photo > p {
		font-size: 16px;
	}
	body.profile > article p,
	body.lesson > article p,
	body.demo > article p,
	body.access > article p {
		font-size: 20px;
	}
	body.profile p.bottom a,
	body.lesson p.bottom a,
	body.demo p.bottom a,
	body.access p.bottom a {
		font-size: 14px;
	}
	body.lesson ul.lesson {
		font-size: 20px;
	}
	body.access > article h3 {
		font-size: 20px;
	}

	/* 2023.11追加 */

	body.profile > article ul.normal_list,
	body.access > article ul.normal_list  {
		font-size: 20px;
	}
	body.profile > article ul.normal_list li,
	body.access > article ul.normal_list li {
		padding-left: 20px;
		text-indent: -20px;
	}
	body.access > article h3.bl-txt {
		font-size: 24px;
	}
	body.access p.pic_comment {
		right: 20px;
		bottom: -112px;
	}
	body.access p.pic_comment img {
		width: 135px;
	}
	body.top > header ul li.studio:before {
		top: -45px;
		right: 85px;
		width: 79px;
		height: 80px;
	}
}
