@charset "utf-8";


body {
	/***	フォント関連設定	***/
	font-family: "游ゴシック", "Yu Gothic", "游ゴシック体", YuGothic, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "Meiryo UI", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-family: "メイリオ", Meiryo, "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "A-OTF 新ゴ Pro", A-OTF Shin Go Pro, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size: 112.5%;	/* 18px */
	font-size: 137.5%;	/* 22px */
	line-height: 1.7;

	/***	背景＆文字色設定	***/
	background: #f5f5f5;
	color: #333;
	
	font-feature-settings: "palt";
	text-align: justify;
}

h1 {
	position: relative;
	padding: 4em 0;
	overflow: hidden;
	z-index: 9999;
}

h1 img {
	max-width: 96%;
	filter: drop-shadow( 0 0 5px rgba(255,255,255,1));
}

h1::after {
	content: '';
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	width: 110%;
	height: 110%;
	background: url(../images/bg_header01.jpg) center center / cover no-repeat;
	z-index: -1;

	animation-name: bg_change;
	animation-iteration-count: infinite;
	animation-duration: 40s;
}

@keyframes bg_change {
	0% {
	}

	20% {
		background: url(../images/bg_header01.jpg) center center / 100% auto no-repeat;
	}

	25% {
		background: url(../images/bg_header02.jpg) center center / 100% auto no-repeat;
	}


	40% {
		background: url(../images/bg_header02.jpg) center center / 100% auto no-repeat;
	}
	50% {
		background: url(../images/bg_header03.jpg) center center / 100% auto no-repeat;
	}

	70% {
		background: url(../images/bg_header03.jpg) center center / 100% auto no-repeat;
	}
	75% {
		background: url(../images/bg_header04.jpg) center center / 100% auto no-repeat;
	}

	95% {
		background: url(../images/bg_header04.jpg) center center / 100% auto no-repeat;
	}
	100% {
		background: url(../images/bg_header01.jpg) center center / 100% auto no-repeat;
	}
}

@media (max-aspect-ratio: 2500/1667) {

	h1::after {
		background-size: auto 100%;
	}
}

a {cursor: pointer;}

img {
	display: block;	/*	ブロック要素としてふるまう：中揃えで表示	*/
	margin: 0 auto;
	max-width: 100%;
}

strong {
	font-weight: bold;
}

#wrapper {
	margin: 0 auto;
	background: url("../images/bg_wrapper.png") center center repeat-y;
}

footer {
	margin: 5em auto 0;
	padding: 2.5em 3%;
	border: 1px solid #CCC;
	background: #fff;
	color: #666;
	text-align:center;
	font-size: smaller;
}
footer a {
	text-decoration:underline;
}

footer a:hover {
}
address {
	margin-top: 1em;
	font-size: 100%;
	font-family: serif;
	font-style:normal;
	line-height: 1.4;
}

.copys {
	display: flex;
	justify-content: space-between;
	margin: 20px auto 0;
	width: 900px;
	max-width: 100%;
}



/***	テキスト装飾設定	***/

.large {
	font-size: 120%;
}

.xlarge {
	font-size: 144%;
}

.xxlarge {
	font-size: 172.8%;
}

.small {
	font-size: 82.5%;
}

.xsmall {
	font-size: 62.5%;
}

.xxsmall {
	font-size: 56.25%;
}

.u {
	text-decoration: underline;
}

.red {
	color: red;
}

.highlight {
	background-color: #fff266;
}

.redhigh {
	color: red;
	background-color: #fff266;
}


/***	画像右寄せ設定	***/

.pic_right {
	float: right;
	margin: 10px -15px 10px 10px;
	box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.2);
}


/***	PC・スマホ改行設定	***/

.pconly {
	display: block;
}

.tbonly {
	display: none;
}

.sponly {
	display: none;
}


/*
 *		desc
 */

.desc {
	padding-bottom: 2.5em;
	background: #fff;
}

.wrap_desc {
	margin: 0 auto;
	padding-top: 2.5em;
	max-width: 920px;
}
 
.wrap_desc h2 {
	display: flex;
	margin: 1.5em auto 1em;
	padding: 0.6em 1em 0.5em;
	border: 2px solid #FF9774;
	border-radius: 0.4em;
	background: #fff;
	color: #FF9774;
	font-size: 1.25em;
}

.wrap_desc h2::before {
	margin-top: 0.15em;
	margin-right: 0.5em;
	display: block;
	content: "";
	background: url("data:image/svg+xml,%3Csvg version='1.1' id='_x32_' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='width: 256px; height: 256px; opacity: 1;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23f5cc00;%7D%0A%3C/style%3E%3Cg%3E%3Cpath class='st0' d='M256,0C114.613,0,0,114.613,0,256s114.613,256,256,256s256-114.613,256-256S397.387,0,256,0z M356.662,244.613 l-47.588,37.976l16.178,58.702c1.338,4.887-0.477,10.097-4.581,13.081c-4.105,2.976-9.621,3.097-13.855,0.306l-50.83-33.532 l-50.815,33.532c-4.233,2.79-9.75,2.67-13.863-0.306c-4.104-2.984-5.92-8.194-4.581-13.081l16.186-58.702l-47.597-37.976 c-3.952-3.161-5.548-8.451-3.975-13.274c1.564-4.822,5.96-8.17,11.016-8.395l60.831-2.75l21.411-57.001 c1.79-4.742,6.331-7.887,11.387-7.887c5.08,0,9.612,3.146,11.394,7.887l21.42,57.001l60.815,2.75 c5.064,0.226,9.467,3.573,11.032,8.395C362.218,236.162,360.629,241.452,356.662,244.613z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E") left center / auto 100% no-repeat;
	width: 1.2em;
	height: 1.2em;
}


.wrap_desc p {
	margin: 0 auto;
	width: 94%;
}

/*
 *		music
 */

 .music {
	padding: 2.5em 0;
	background: url(../images/bg_music.png) center center no-repeat #FDF8EF fixed;

}

.wrap_music {
	margin: 0 auto;
	max-width: 920px;
}

.wrap_music h2 {
	display: flex;
	margin: 1.5em auto 1em;
	padding: 0.6em 1em 0.5em;
	border-radius: 0.4em;
	background: #FF9774;
	color: #fff;
	font-size: 1.25em;
}

.wrap_music h2::before {
	flex-shrink: 0;
	margin-top: 0.15em;
	margin-right: 0.5em;
	display: block;
	content: "";
	background: url("data:image/svg+xml,%3Csvg version='1.1' id='_x32_' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='width: 256px; height: 256px; opacity: 1;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23f5f500;%7D%0A%3C/style%3E%3Cg%3E%3Cpath class='st0' d='M134.75,0v307.684c-14.347-2.241-29.784-1.552-45.222,3.303c-46.227,14.534-73.715,58.046-61.393,97.194 c12.307,39.063,59.771,58.996,105.984,44.462c35.443-11.144,62.887-39.349,66.822-69.478V117.602l219.68,41.776v202.82 c-14.06-2.068-29.154-1.35-44.218,3.403c-46.227,14.578-73.715,58.09-61.393,97.153c12.294,39.133,59.756,59.024,105.983,44.49 c36.751-11.575,63.361-41.504,65.816-72.898V60.676L134.75,0z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E") left center / auto 100% no-repeat;
	width: 1.2em;
	height: 1.2em;
}

.wrap_music h3 {
	margin: 1.5em auto 1em;
	padding: 0.6em 1em 0.5em;
	border: 2px solid #FF9774;
	border-radius: 0.4em;
	background: #fff;
	color: #FF9774;
}

.wrap_music .desc_music h3 {
	margin-top: 0;
}

.con_music {
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 1.5em;
}

.wrap_movie {
	margin: 1.5em auto 0;
	width: 96vw;
	max-width: 920px;
	aspect-ratio: 16/9;
}


.wrap_movie iframe {
	width: 100% !important;
	height: 100% !important;
  }

.wrap_form {
	margin: 1.5em auto 0;
	width: 96vw;
	max-width: 920px;
}

.wrap_form h2 {
	display: flex;
	margin: 1.5em auto;
	padding: 0.6em 1em 0.5em;
	border-radius: 0.4em;
	background: #FF9774;
	color: #fff;
	font-size: 1.25em;
}

.wrap_form h2::before {
	flex-shrink: 0;
	margin-top: 0.15em;
	margin-right: 0.5em;
	display: block;
	content: "";
	background: url("data:image/svg+xml,%3Csvg version='1.1' id='_x32_' xmlns='http://www.w3.org/2000/svg' xmlns:xlink='http://www.w3.org/1999/xlink' x='0px' y='0px' viewBox='0 0 512 512' style='width: 256px; height: 256px; opacity: 1;' xml:space='preserve'%3E%3Cstyle type='text/css'%3E .st0%7Bfill:%23f5f500;%7D%0A%3C/style%3E%3Cg%3E%3Cpath class='st0' d='M134.75,0v307.684c-14.347-2.241-29.784-1.552-45.222,3.303c-46.227,14.534-73.715,58.046-61.393,97.194 c12.307,39.063,59.771,58.996,105.984,44.462c35.443-11.144,62.887-39.349,66.822-69.478V117.602l219.68,41.776v202.82 c-14.06-2.068-29.154-1.35-44.218,3.403c-46.227,14.578-73.715,58.09-61.393,97.153c12.294,39.133,59.756,59.024,105.983,44.49 c36.751-11.575,63.361-41.504,65.816-72.898V60.676L134.75,0z'%3E%3C/path%3E%3C/g%3E%3C/svg%3E") left center / auto 100% no-repeat;
	width: 1.2em;
	height: 1.2em;
}

.table_form {
	width: 100%;
	line-height: 1.3;
}

.table_form td {
	padding: 0.2em;
}

.table_form tr:first-of-type td:last-of-type,
.table_form tr:nth-of-type(2) td:last-of-type {
	display: flex;
	justify-content: space-between;
	width: 100%;
}	
.table_form tr:first-of-type input,
.table_form tr:nth-of-type(2) input {
	width: 49%;
}

.table_form tr:nth-of-type(3) input,
.table_form tr:nth-of-type(4) input {
	width: 100%;
}

.table_form tr:last-of-type input {
	padding: 1em 1em 0.8em;
	width: 66%;
	border: none;
	border-radius: 0.4em;
	background: #00cc66;
	color: #fff;
	font-size: 1.25em;
	cursor: pointer;
}

.table_form tr:last-of-type input:hover {
	opacity: 0.5;
}

.table_form td:first-of-type {
	padding-right: 0.5em;
	width: 10em;
	font-weight: bold;
	color: #333;
}

.table_form td:last-of-type {
	width: calc( 100% - 10em );
}

.table_form input,
.table_form textarea {
	padding: 0.4em 0.5em 0.2em;
	border: 2px solid #FF9774;
	border-radius: 0.2em;
	background: #fff;
}

.table_form textarea {
	width: 100%;
	height: 8em;
}

/*
 *		profile
 */

 .profile {
	padding: 1.5em 0;
	background: #fff;
}

.profile h2 {
	margin: 0 auto 0.6em;
	color: #FF9774;
	font-size: 2.5em;
	text-align: center;
}

.wrap_profile {
	margin: 0 auto;
	width:920px;
	max-width: 96%;
}

.con_profile {
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-start;
	align-items: flex-start;
	gap: 1.5em;

	margin: 0 auto 2.5em;
}

.con_profile:last-of-type {
	margin-bottom: 0;
}

.con_profile p {
}

.con_profile h3 {
	margin-bottom: 1.5em;
	font-family: serif;
}

.name {
	display: block;
	font-size: 2em;
}


/*
 *		eff
 */

 .eff {
	padding: 1.5em 0;
	background: #f5fbff;
}

.eff h2 {
	margin: 0 auto 1em;
	color: #0079d6;
	font-size: 1.5em;
	text-align: center;
}

.wrap_eff {
	margin: 0 auto;
	width: 920px;
	max-width: 96%;
}

.wrap_eff h3 {
	margin: 1.5em auto 1em;
	padding: 0.6em 1em 0.5em;
	border: 2px solid #0079d6;
	border-radius: 0.4em;
	background: #fff;
	color: #0079d6;
}

.con_prof02 {
	display: flex;
	flex-direction: row-reverse;
	justify-content: flex-end;
	align-items: flex-start;
	gap: 1.5em;

	margin: 0 auto 2.5em;
}

.con_prof02 img {
	display: inline;
	margin: 0;
}


.wrap_eff p {
	margin: 0 auto;
}

.btn {
	display: block;
	margin: 0 auto;
	max-width: 96vw;
}

.btn:hover {
	opacity: 0.66;
}


/*
 *		player
 */

 .wrap_audio {
	margin-bottom: 1.5em;
 }




@media screen and (max-width: 1023px) {	/***	幅1023px以下に適用：ipad proなどの1024pxのものはPC表示と同一	***/

	.pconly {display: none;}
	.tbonly {display: block;}
	.sponly {display: none;}

	h1 {
		padding: 2.5em 0;
	}

	.wrap_desc,
	.wrap_music {
		max-width: 96vw;
	}

}


@media screen and (max-width: 599px) {	/***	幅599px以下に適用：スマホ	***/

	body {font-size: 5vw;}
	footer {margin-top: 2em;}

	.pconly {display: none;}
	.tbonly {display: none;}
	.sponly {display: block;}
	.sponly.tbonly {display: block;}

	h1 {
		padding: 10vw 0;
	}

	.desc {
		padding-bottom: 1em;
	}

	.wrap_desc {
		padding-top: 1em;
	}

	.wrap_desc h2 {
		margin: 0.75em auto 0.5em;
		padding: 0.3em 0.5em 0.1em;
	}

	.music {
		padding: 1em 0;
	}

	.wrap_music h2 {
		margin: 0.75em auto 0.5em;
		padding: 0.3em 0.5em 0.1em;
	}

	.con_music {
		flex-direction: column-reverse;
	}

	.audio-player {
		margin: 0.75em auto;
	}

	.profile h2 { font-size: 10vw}

	.con_profile {
		flex-direction: column-reverse;
	
		margin: 0 auto 2.5em;
	}

	.con_prof02 {
		flex-direction: column-reverse;
		margin-bottom: 1em;
	}
	.con_prof02 img {
		margin: 0 auto;
	}

	.eff h2 {
		font-size: 1em;
	}

	.wrap_form h2 {
		margin-bottom: 1em;
		line-height: 1.3;
	}

	.table_form td {
		display: block;
		width: 100%!important;
	}

	.table_form td:first-of-type {
		padding-top: 1em;
	}

	.table_form td input:nth-of-type(2) {
		margin-top: 0.5em;
	}

	.table_form tr:last-of-type input {
		padding: 1em 1em 0.8em;
		width: 12em;
	}

	.table_form tr:first-of-type td:last-of-type,
	.table_form tr:nth-of-type(2) td:last-of-type {
		display: block;
	}

	.table_form tr:first-of-type input,
	.table_form tr:nth-of-type(2) input {
		display: block;
		width: 100%;
	}


}



/*
 *		特商法
 */

 .page_laws #wrapper {
	margin: 0 auto 2em;
	padding: 3em;
	width: 800px;
	background: #fff;
	max-width: 100%;
	font-size: 75%;
}

.page_laws #wrapper h2 {
	margin: 0 auto;
	font-size: 2em;
	text-align: center;
}

.page_laws #wrapper h3 {
	margin-top: 2em;
	font-size: 1.25em;
}

.page_laws #wrapper h4 {
	margin-top: 2em;
}

.page_laws table {
	margin: 1.5em auto;
	width: 720px;
	border-collapse: separate;
	border-spacing: 1px;
	background: #ccc;
}

.page_laws th {
	padding: 0.5em;
	width: 28%;
	border-top: 1px solid #fff;
	background-color: #EBEBEB;
}

.page_laws td {
	padding: 0.5em;
	font-size: 0.8em;
	background-color: #FFFFFF;
}


@media screen and (max-width: 599px) {	/***	幅599px以下に適用：スマホ	***/


	.page_laws #wrapper {
		margin: 0 auto 2em;
		padding: 1em 0;
		background: #fff;
		width: 100%;
		font-size: 75%;
	}
	
	.page_laws #wrapper h2 {
		margin: 0 auto;
		font-size: 1em;
		text-align: center;
	}
	
	.page_laws #wrapper h3 {
		margin-top: 1em;
	}
	
	.page_laws table {
		margin: 1.5em auto;
		width: 96vw;
		border-collapse: separate;
		border-spacing: 1px;
		background: #ccc;
	}
	
	.page_laws th {
		display: block;
		padding: 0.5em;
		width: 100%;
	}
	
	.page_laws td {
		display: block;
		padding: 0.5em;
		width: 100%;
	}


}