@charset "UTF-8";
/* sp(320px) */

/* 名古屋最大級！あなたのクラスに最適なレンタルスタジオ */
#pageHome #top_about .hl {
	font-size: 17px;
	font-weight: bold;
	line-height: 1.4;
	color: var(--hcolor);
	text-align: center;
}
#pageHome #top_about .hl span {
	display: block;
	color: var(--fcolor);
}
#pageHome #top_about p {
	text-align: left;
	line-height: 1.9;
}
#pageHome #top_about p br.mbr {
	display: none;
}
#pageHome #top_about #top_splide ul li div {
	margin-block-start: .6em;
}

/* 選ばれる3つの理由 */
#pageHome #top_reason .hl {
	font-size: 23px;
	font-weight: bold;
	line-height: 1.3;
	color: var(--hcolor);
	text-align: center;
}
#pageHome #top_reason .hl span.s {
	display: block;
	font-size: 62.5%;
}
#pageHome #top_reason .hl span.b {
	font-family: "Average", serif;
	font-size: 50px;
	line-height: 1;
	font-weight: normal;
}
#pageHome #top_reason .bg_box {	
/*	background: linear-gradient(to bottom, #fff 0%, #fff 90px, #ecf1f9 90px, #ecf1f9 100%);*/
	background: linear-gradient(to bottom, #fff 0%, #fff 90px, #f8f8f8 90px, #f8f8f8 100%);
}
#pageHome #top_reason .bg_box .bg_box2 {
	background: linear-gradient(to right, #fff 0%, #fff 15px, transparent 15px, transparent calc(100% - 15px), #fff calc(100% - 15px), #fff 100%);
}

#pageHome #top_reason .box .ph {
	padding-inline: 0 35px;
}
#pageHome #top_reason .box.reverse .ph {
	padding-inline: 35px 0;
}

#pageHome #top_reason .box .txt {
	padding-block-start: 1em;
	padding-block-end: 1.5em;
	padding-inline-start: 0;
}
#pageHome #top_reason .box .txt .in {
	max-inline-size: 480px;
	padding-inline: 35px;
}
#pageHome #top_reason .box.reverse .txt .in {
	margin-inline: auto 0;
}
#pageHome #top_reason .box .txt .ttl {
	display: grid;
	align-items: center;
	grid-template-columns: 58px auto;
	grid-template-rows: auto;
	column-gap: 1.2em;
	row-gap: 0;
	margin-block-end: .8em;
}
#pageHome #top_reason .box .txt .hl3 {
	font-size: 20px;
	font-weight: bold;
	line-height: 1.4;
	color: var(--hcolor);
}
#pageHome #top_reason .box .txt .hl4 {
	font-size: 18px;
	font-weight: bold;
	line-height: 1.4;
	color: var(--fcolor);
	margin-block-end: .2em;
}

/* 受講生にとっても快適な環境 */
#pageHome #top_kankyo .hl {
	font-size: 19px;
	font-weight: bold;
	line-height: 1.4;
	color: var(--hcolor);
	text-align: center;
}
#pageHome #top_kankyo .hl span.w1,
#pageHome #top_kankyo .hl span.w2 {
	position: relative;
}
#pageHome #top_kankyo .hl span.w1::before,
#pageHome #top_kankyo .hl span.w2::before,
#pageHome #top_kankyo .hl span.w1::after,
#pageHome #top_kankyo .hl span.w2::after {
	content: '';
	inline-size: 1.3em;
	border-top: 1px solid #bababa;
	position: absolute;
	inset-block-start: .8em;
	transform: rotate(-34deg);
}
#pageHome #top_kankyo .hl span.w1::before {
	inset-inline-start: -2.4em;	
}
#pageHome #top_kankyo .hl span.w2::before {
	inset-inline-start: -2.0em;	
}
#pageHome #top_kankyo .hl span.w1::after {
	inset-inline-end: -2.3em;	
}
#pageHome #top_kankyo .hl span.w2::after {
	inset-inline-end: -1.9em;	
}

#pageHome #top_kankyo .grid {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	column-gap: 0;
	row-gap: 3.8em;
}
#pageHome #top_kankyo .grid > div figure {
	inline-size: 67.86%;
}
#pageHome #top_kankyo .grid > div {
	position: relative;
}
#pageHome #top_kankyo .grid > div .txt {
	inline-size: 50.90%;
	inline-size: 54.90%;
	background-color: #fff;
	position: absolute;
	inset: 17% 0 auto auto;
	padding: 1.0em 1.0em;
/*	border: 1px solid #000;*/
}
#pageHome #top_kankyo .grid > div .txt .ttl {
	font-size: 17px;
	font-weight: bold;
	line-height: 1.4;
	color: var(--fcolor);
	margin-block-end: .3em;
}
#pageHome #top_kankyo .grid > div .txt p {
	margin-block-end: 0;
}

/* さまざまな用途に対応！ */
#pageHome #top_taio {
	background-color: #f8f8f8;
}
#pageHome #top_taio .hl {
	font-size: 19px;
	font-weight: bold;
	line-height: 1.4;
	color: var(--hcolor);
	text-align: center;
}
#pageHome #top_taio .grid {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	column-gap: 0;
	row-gap: 0;
}
#pageHome #top_taio .grid > .ph {
	display: none;
}
#pageHome #top_taio .grid .txt {
	padding-inline-end: 0;
}
#pageHome #top_taio .grid .txt .osusume {
	display: grid;
	grid-template-columns: 56px auto;
	grid-template-rows: auto;
	column-gap: .8em;
	row-gap: 0;
	margin-block-start: 2em;
	border: 3px solid #fff;
	padding: .5em .8em;
}
#pageHome #top_taio .grid .txt .osusume > div .ttl {
	display: grid;
	align-items: center;
	grid-template-columns: 24px auto;;
	grid-template-rows: auto;
	column-gap: .5em;
	row-gap: 0;
	border-block-end: 3px solid #ddeaff;
	padding-block-end: .4em;
}
#pageHome #top_taio .grid .txt .osusume > div > figure {
	position: relative;
	inset-block-start: .6em;
}
#pageHome #top_taio .grid .txt .osusume > div .ttl div {
	font-size: 16px;
	font-weight: bold;
	line-height: 1.4;
	color: var(--fcolor);
	position: relative;
	inset-block-start: .2em;
}
#pageHome #top_taio .grid .txt .osusume > div ul {
	margin-block-start: .5em;
}
#pageHome #top_taio .grid .txt .osusume > div ul li {
	display: grid;
	grid-template-columns: 14px auto;
	grid-template-rows: auto;
	column-gap: .6em;
	row-gap: 0;
	margin-block-end: .1em;
}
#pageHome #top_taio .grid .txt .osusume > div ul li figure {
	position: relative;
	inset-block-start: .4em;
}

/* 講師・インストラクターのための特別サポート */
#pageHome #top_support {
	background-color: #f8f8f8;
	padding-block-end: 40px;
}
#pageHome #top_support .hl {
	font-size: 20px;
	font-weight: bold;
	line-height: 1.4;
	color: var(--fcolor);
	text-align: center;
}
#pageHome #top_support .hl span {
	display: block;
	font-size: 81.3%;
	color: var(--hcolor);
}

#pageHome #top_support ul li {
	display: grid;
	grid-template-columns: auto;
	grid-template-rows: auto;
	column-gap: 0;
	row-gap: 0;
	background-color: #fff;
}
#pageHome #top_support ul li:not(:last-of-type) {
	margin-block-end: 1.5em;
}
#pageHome #top_support ul li .txt {
	padding: 1.4em 2em 0em 2em;
/*	border: 1px solid #000;*/
}
#pageHome #top_support ul li .txt .ttl {
	display: grid;
	align-items: center;
	grid-template-columns: 29px auto;
	grid-template-rows: auto;
	column-gap: .6em;
	row-gap: 0;
}
#pageHome #top_support ul li .txt .ttl .hl3 {
	font-size: 17px;
	font-weight: bold;
	line-height: 1.4;
	color: var(--fcolor);
}
#pageHome #top_support ul li .txt p {
	margin-block-start: .4em;
}
#pageHome #top_support ul li .txt p span {
	font-weight: bold;
	color: #b69b60;
}















@media handheld, print, screen and (min-width: 390px) {
/* iphone6 */

/* 名古屋最大級！あなたのクラスに最適なレンタルスタジオ */
#pageHome #top_about .hl {
	font-size: 18px;
}
/* 受講生にとっても快適な環境 */
#pageHome #top_kankyo .grid {
	row-gap: 2.2em;
}

/* end of media query(iphone6) */	
}



@media handheld, print, screen and (min-width: 414px) {
/*  iPhone6 Plus */

/* end of media query(iPhone6 Plus) */	
}



@media handheld, print, screen and (min-width: 480px) {
/* tablet */

/* 名古屋最大級！あなたのクラスに最適なレンタルスタジオ */
#pageHome #top_about .hl {
	font-size: 22px;
}
#pageHome #top_about p br.mbr {
	display: inline-block;
}

/* 選ばれる3つの理由 */
#pageHome #top_reason .hl {
	font-size: 30px;
}
#pageHome #top_reason .hl span.b {
	font-size: 60px;
}
#pageHome #top_reason .box .txt .ttl {
	grid-template-columns: 58px auto;
}
#pageHome #top_reason .box .txt .hl3 {
	font-size: 22px;
}
#pageHome #top_reason .box .txt .hl4 {
	font-size: 18px;
}

/* 受講生にとっても快適な環境 */
#pageHome #top_kankyo .hl {
	font-size: 22px;
}

/* さまざまな用途に対応！ */
#pageHome #top_taio .hl {
	font-size: 22px;
}

#pageHome #top_taio .grid .txt .osusume {
	grid-template-columns: 80px auto;
}
#pageHome #top_taio .grid .txt .osusume > div .ttl div {
	font-size: 17px;
}

/* 講師・インストラクターのための特別サポート */
#pageHome #top_support {
	padding-block-end: 60px;
}
#pageHome #top_support .hl {
	font-size: 22px;
}
#pageHome #top_support ul li .txt .ttl {
	grid-template-columns: 32px auto;
	column-gap: .6em;
}
#pageHome #top_support ul li .txt .ttl .hl3 {
	font-size: 18px;
}

	@media (-webkit-min-device-pixel-ratio: 2){
		

	/* end of media query(retina) */	
	}

/* end of media query(tablet) */	
}



@media handheld, print, screen and (min-width: 620px) {
/* iPad */

/* 名古屋最大級！あなたのクラスに最適なレンタルスタジオ */
#pageHome #top_about .hl {
	font-size: 26px;
}
#pageHome #top_about p {
	text-align: center;
}

#pageHome #top_about #top_splide ul {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-template-rows: auto;
	column-gap: 1.8%;
	row-gap: 0;
}

/* 選ばれる3つの理由 */
#pageHome #top_reason .hl {
	font-size: 34px;
}
#pageHome #top_reason .hl span.b {
	font-size: 70px;
}

#pageHome #top_reason .bg_box {
	background: linear-gradient(to bottom, #fff 0%, #fff 30px, #f8f8f8 30px, #f8f8f8 100%);
}
#pageHome #top_reason .bg_box .bg_box2 {
	background: linear-gradient(to left, transparent 0%, transparent calc(100vw / 2 + 420px), #fff 300px, #fff 100%);
}
#pageHome #top_reason .bg_box .bg_box2:has(.reverse) {
	background: linear-gradient(to right, transparent 0%, transparent calc(100vw / 2 + 420px), #fff 300px, #fff 100%);
}

#pageHome #top_reason .box .ph {
	padding-inline: 0 0;
	margin-block-start: 80px;
}
#pageHome #top_reason .box.reverse .ph {
	padding-inline: 0 0;
}


#pageHome #top_reason .box .txt {
	padding-block-start: 0em;
	padding-block-end: 1.0em;
	padding-inline-start: .6em;
	padding-inline-end: 20px;
}
#pageHome #top_reason .box.reverse .txt {
	padding-inline-start: 20px;
	padding-inline-end: 0px;
}
#pageHome #top_reason .box .txt .in {
	max-inline-size: 480px;
	padding-inline: 0px;
}
#pageHome #top_reason .box.reverse .txt .in {
	margin-inline: auto 0;
	padding-inline: 0;
}
#pageHome #top_reason .box .txt .ttl {
	grid-template-columns: 64px auto;
}
#pageHome #top_reason .box .txt .hl3 {
	font-size: 26px;
}
#pageHome #top_reason .box .txt .hl4 {
	font-size: 20px;
}

/* 受講生にとっても快適な環境 */
#pageHome #top_kankyo .hl {
	font-size: 26px;
}
#pageHome #top_kankyo .grid {
	grid-template-columns: 1fr 1fr;
	column-gap: 2%;
	row-gap: 0;
}
#pageHome #top_kankyo .grid > div .txt {
	padding: 1.2em 1.2em;
}
#pageHome #top_kankyo .grid > div .txt .ttl {
	font-size: 18px;
}

/* さまざまな用途に対応！ */
#pageHome #top_taio .hl {
	font-size: 26px;
}
#pageHome #top_taio .grid {
	grid-template-columns: 1fr 1fr;
}
#pageHome #top_taio .grid .ph {
	display: block;
}
#pageHome #top_taio .grid .txt {
	padding-inline-end: 2em;
}
#pageHome #top_taio .grid .txt .osusume {
	grid-template-columns: 70px auto;
	column-gap: .8em;
	padding: .5em 1em;
}
#pageHome #top_taio .grid .txt .osusume > div .ttl {
	grid-template-columns: 27px auto;;
	column-gap: .4em;
}
#pageHome #top_taio .grid .txt .osusume > div > figure {
	inset-block-start: .6em;
}
#pageHome #top_taio .grid .txt .osusume > div .ttl div {
	font-size: 17px;
	inset-block-start: .2em;
}
#pageHome #top_taio .grid .txt .osusume > div ul {
	margin-block-start: .5em;
}
#pageHome #top_taio .grid .txt .osusume > div ul li {
	grid-template-columns: 18px auto;
	column-gap: .6em;
}

/* 講師・インストラクターのための特別サポート */
#pageHome #top_support .hl {
	font-size: 26px;
}
#pageHome #top_support .hl span {
	display: inline;
	font-size: 81.3%;
}

#pageHome #top_support ul li {
	grid-template-columns: 260px auto;
}
#pageHome #top_support ul li .txt {
	padding: 1.4em 2em 0em 2em;
}
#pageHome #top_support ul li .txt .ttl {
	grid-template-columns: 35px auto;
	column-gap: .6em;
}
#pageHome #top_support ul li .txt .ttl .hl3 {
	font-size: 20px;
}





/* end of media query(iPad) */	
}



@media handheld, print, screen and (min-width: 900px) {
/* pc */

/* 名古屋最大級！あなたのクラスに最適なレンタルスタジオ */
#pageHome #top_about .hl {
	font-size: 30px;
}

/* 選ばれる3つの理由 */
#pageHome #top_reason .hl {
	font-size: 40px;
}
#pageHome #top_reason .hl span.b {
	font-size: 80px;
}

#pageHome #top_reason .bg_box {
	background: linear-gradient(to bottom, #fff 0%, #fff 50px, #f8f8f8 50px, #f8f8f8 100%);
}

#pageHome #top_reason .box .ph {
	padding-inline: 0 0;
	margin-block-start: 0;
}
#pageHome #top_reason .box.reverse .ph {
	padding-inline: 0 0;
}


#pageHome #top_reason .box .txt {
	padding-block-start: 1em;
	padding-block-end: 1.5em;
	padding-inline-start: 1em;
	padding-inline-end: 20px;
}
#pageHome #top_reason .box.reverse .txt {
	padding-inline-start: 20px;
	padding-inline-end: 0px;
}
#pageHome #top_reason .box .txt .in {
	max-inline-size: 480px;
	padding-inline: 0px;
}
#pageHome #top_reason .box.reverse .txt .in {
	margin-inline: auto 0;
	padding-inline: 0;
}
#pageHome #top_reason .box .txt .ttl {
	grid-template-columns: 80px auto;
}
#pageHome #top_reason .box .txt .hl3 {
	font-size: 30px;
}
#pageHome #top_reason .box .txt .hl4 {
	font-size: 22px;
}

/* 受講生にとっても快適な環境 */
#pageHome #top_kankyo .hl {
	font-size: 30px;
}
#pageHome #top_kankyo .grid > div .txt {
	padding: 1.7em 1.7em;
}
#pageHome #top_kankyo .grid > div .txt .ttl {
	font-size: 22px;
}

/* さまざまな用途に対応！ */
#pageHome #top_taio .hl {
	font-size: 30px;
}

#pageHome #top_taio .grid {
	grid-template-columns: 1fr 1fr;
}
#pageHome #top_taio .grid .ph {
	display: block;
}
#pageHome #top_taio .grid .txt {
	padding-inline-end: 3em;
}
#pageHome #top_taio .grid .txt .osusume {
	grid-template-columns: 90px auto;
	column-gap: .8em;
	padding: .5em 1em;
}
#pageHome #top_taio .grid .txt .osusume > div .ttl {
	grid-template-columns: 29px auto;;
	column-gap: .5em;
}
#pageHome #top_taio .grid .txt .osusume > div > figure {
	inset-block-start: .6em;
}
#pageHome #top_taio .grid .txt .osusume > div .ttl div {
	font-size: 18px;
	inset-block-start: .2em;
}
#pageHome #top_taio .grid .txt .osusume > div ul {
	margin-block-start: .5em;
}
#pageHome #top_taio .grid .txt .osusume > div ul li {
	grid-template-columns: 20px auto;
	column-gap: .6em;
}

/* 講師・インストラクターのための特別サポート */
#pageHome #top_support {
	padding-block-end: 80px;
}
#pageHome #top_support .hl {
	font-size: 30px;
}
#pageHome #top_support .hl span {
	display: inline;
	font-size: 81.3%;
}

#pageHome #top_support ul li {
	grid-template-columns: 260px auto;
}
#pageHome #top_support ul li .txt {
	padding: 1.4em 2em 0em 2em;
}
#pageHome #top_support ul li .txt .ttl {
	grid-template-columns: 44px auto;
	column-gap: .6em;
}
#pageHome #top_support ul li .txt .ttl .hl3 {
	font-size: 22px;
}


/* end of media query(pc) */
}