@charset "utf-8";

@import url('https://fonts.googleapis.com/css2?family=Antonio:wght@700&display=swap');



/* ======================================================================================================
	trial common
====================================================================================================== */
* {
	--contents-padding:6em;
}
@media screen and (max-width:799px){
	* {
		--contents-padding:3em;
	}
}


body:not(#page-index) main {
	padding:80px 0 0;
	font-family: 'Noto Sans JP' ,sans-serif;
}
@media screen and (min-width:1400px){
	body:not(#page-index) main {
		padding-top:100px;
	}
}
@media screen and (max-width:799px){
	body:not(#page-index) main {
		padding-top:63px;
	}
}



.sideButton {
	top:320px;
	width:240px;
}
@media screen and (min-width:800px){
	.sideButton:hover {
		filter:brightness(1.1);
	}
}


@media screen and (max-width:799px){
	#footer-info .logo{
		padding-bottom:1em;
	}
	#footer-copyright {
		padding:1em 0 5em;
	}
	.strong {
		font-size:150%;
	}
}


/* ====================================================================
	layout
==================================================================== */
.trial-inner {
	width:100%;
	max-width:1200px;
	margin:0 auto;
}
.trial-inner + .trial-inner {
	padding-top:var(--contents-padding);
}
.trial-paddingTop {
	padding-top:var(--contents-padding);
}


@media screen and (max-width:799px){
	.trial-inner {
		padding:0 1em;
	}
}



/* ==============================================
	contact button
=============================================== */
.trial-contact-button {
	max-width:95%;
	margin:auto;
	text-align:center;
	border-radius:1em;
	transition:all 0.2s ease;
	-webkit-transition:all 0.2s ease;
}
@media screen and (min-width:800px){
	.trial-contact-button.anchorLink:hover {
		opacity:1;
		filter:brightness(1.1);
		transition:all 0.2s ease;
		-webkit-transition:all 0.2s ease;
	}
}


/* ==============================================
	sp bottom button
=============================================== */
#spBottomButton {
	padding-left: 4em;
}
#spBottomTrainer {
	position:fixed;
	left:-0.8em;
	bottom:-1em;
	width:6em;
    z-index: 1;
}


/* ==============================================
	h2
=============================================== */
.trial-h2 {
	position:relative;
	padding-bottom:calc( var(--contents-padding) / 3 * 2 );
}
.trial-h2-bottom {
	width:8em;
	height:0;
	border-style:solid;
	border-width:3em 4em 0;
	border-color:#9b8647 transparent transparent;
	margin:-1px auto 0;
}

.trial-h2-main {
	padding:3em 0;
	font-weight:bold;
	color:#fff;
	background:#9b8647;
	font-family:'termina' ,'Noto Sans JP' ,sans-serif;
	text-align:center;
}
.trial-h2 h2 {
	font-size:240%;
	line-height:1.3;
}
.trial-h2 p {
	font-size:130%;
	padding-top:0.3em;
}


@media screen and (max-width:799px){
	.trial-h2-main {
		padding:2em 0;
	}
	.trial-h2-bottom {
		width:6em;
		border-width:2em 3em 0;
	}

	.trial-h2 h2 {
		font-size:180%;
		line-height:1.3;
	}
	.trial-h2 p {
		font-size:110%;
	}
}


/* ==============================================
	catch text
=============================================== */
.trial-catchText {
/*
	padding-bottom:calc( var(--contents-padding) / 2 );
*/
	text-align:center;
}
.trial-catchText p.mainText strong {
	font-family:'termina' ,'Noto Sans JP' ,sans-serif;
}
.trial-catchText p.mainText strong.em {
	font-size:120%;
	font-weight:900;
}
.trial-catchText p.mainText:after {
	content:"";
	display:block;
	width:100%;
	height:3px;
	background: linear-gradient(90deg,#600,#f33,#600);
}
.trial-catchText p.subText {
	padding-top:0.5em;
}
.trial-catchText p.subText em {
	font-size:140%;
}


@media screen and (max-width:799px){
	.trial-catchText p.subText em {
		font-size:120%;
	}
}




/* ======================================================================================================
	FV section
====================================================================================================== */
.content-header {
	position:relative;
	height:calc(100vh - 80px);
	min-height:800px;
	text-align:center;
}
@media screen and (min-width:1400px){
	.content-header {
		height:calc(100vh - 100px);
	}
}
@media screen and (max-width:799px){
	.content-header {
		height:720px;
		min-height:640px;
	}
}

.content-header .bg {
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	width:100%;
	height:100%;
	z-index:1;
}
.content-header .bg video {
	width:100%;
	height:calc(100% - 1px);
	object-fit:cover;
	object-position:top;
}

.content-header .filter {
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	width:100%;
	height:100%;
	background:url(images/contents/trial/ami.png);
	z-index:2;
}

.content-header .top {
	position:absolute;
	top:0;
	left:0;
	right:0;
	width:100%;
	z-index:3;
}
.content-header .bottom {
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	width:100%;
	z-index:4;
}

.content-header .top img.noSP {
	width:1400px;
}
.content-header .bottom img.noSP {
	width:100%;
	height:480px;
	object-fit:cover;
}



/* ======================================================================================================
	welcome section
====================================================================================================== */
.tiral-welcome-catch {
	text-align:center;
}
.tiral-welcome-catch p {
	font-size:160%;
}
.tiral-welcome-catch p + p {
	padding-top:1em;
}
.tiral-welcome-catch strong {
	color: #f39;
	font-size:200%;
	font-weight:bold;
}


@media screen and (max-width:799px){
	.tiral-welcome-catch p {
		font-size:120%;
	}
	.tiral-welcome-catch strong {
		font-size:140%;
	}
}



/* ======================================================================================================
	recommend section
====================================================================================================== */

/* ------------------ recommend list --------------------------- */
.trial-recommend-list > li + li {
	padding-top:calc( var(--contents-padding) * 1.5);
}

/* ------------------ recommend list > title --------------------------- */
.trial-recommend-title.flex {
	padding-bottom:0.3em;
	justify-content:flex-start;
	flex-wrap:wrap;
}

.trial-recommend-title.flex > .number {
	line-height:1;
	padding-bottom:0.1em;
	font-size:550%;
	font-weight:bold;
	font-family:'Antonio',sans-serif;
	text-align:center;
}
.trial-recommend-title.flex > .mainText {
	flex-grow:1;
	padding:0 0.5em;
	line-height:1.4;
	font-size:220%;
}

.trial-recommend-title.flex:after {
    content: "";
    display: block;
    width: 80%;
    height: 3px;
	margin-top:1em;
    background: linear-gradient(90deg,#600,#f33,#600);
}


@media screen and (max-width:799px){
	.trial-recommend-title.flex {
		flex-direction:column;
	}
	.trial-recommend-title.flex > .number {
		font-size:400%;
		padding-bottom:0.3em;
	}
	.trial-recommend-title.flex > .mainText {
		padding:0;
		font-size:135%;
		text-align:center !important;
	}
	.trial-recommend-title.flex:after {
		width:100%;
	}
}



/* ------------------ recommend list > body --------------------------- */
.trial-recommend-body.flex {
	padding:3em 2em 0;
}

.trial-recommend-body.flex > .text {
	padding-top:0.3em;
	line-height:1.8;
	font-size:110%;
}

.trial-recommend-body.flex > .image {
	text-align:center;
}


/* ------------------ sub box --------------------------- */
.trial-recommnd-sub-title {
	padding:6em 0 4em;
	text-align:center;
}
.trial-recommnd-sub-title:before ,
.trial-recommnd-sub-title:after {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
    background: linear-gradient(90deg,#600,#f33,#600);
}
.trial-recommnd-sub-title p {
	padding:1em 0;
}
.trial-recommnd-sub-title p em {
	font-size:180%;
}

.trial-recommnd-sub .flex.col4 > li {
	padding:0 0.5em;
}


@media screen and (max-width:799px){
	.trial-recommnd-sub-title {
		padding:4em 0 2em;
	}
	.trial-recommend-body.flex {
		padding:1em 1em 0;
		flex-direction:column-reverse;
		justify-content:center;
		align-items:center;
	}
	.trial-recommend-body.flex.col2 > * {
		width:100%;
	}
	.trial-recommend-body.flex > .image {
		padding-bottom:1em;
	}
	.trial-recommend-body.flex > .image img {
		max-width:80%;
	}

	.trial-recommnd-sub-title p em {
		font-size:130%;
	}
}



/* ------------------ recommend list(even) --------------------------- */
.trial-recommend-list > li:nth-child(even) .trial-recommend-title.flex {
	justify-content:flex-end;
}
.trial-recommend-list > li:nth-child(even) .trial-recommend-title.flex > .mainText {
	text-align:right;
}

@media screen and (min-width:800px){
	.trial-recommend-list > li:nth-child(even) .trial-recommend-title.flex > .number {
		order:2;
	}
	.trial-recommend-list > li:nth-child(even) .trial-recommend-title.flex > .mainText {
		order:1;
	}
	.trial-recommend-list > li:nth-child(even) .trial-recommend-title.flex:after {
		order:3;
	}

	.trial-recommend-list > li:nth-child(even) .trial-recommend-body.flex {
		flex-direction:row-reverse;
	}
}


/* ======================================================================================================
	media section
====================================================================================================== */
.trial-tv {
}
.trial-tv + .trial-tv {
	padding-top:3em
}

.trial-tv .flex > * {
	padding:0 2em;
}

.trial-tv .flex > .text {
	width:540px;
}
.trial-tv .flex > .text h3 {
	font-size:200%;
	font-weight:bold;
}
.trial-tv .flex > .text h3 .r {
	display:block;
	text-align:right;
}
.trial-tv .flex > .text .date{
	padding-bottom:1em;
	text-align:right;
}
.trial-tv .flex > .text p {
	line-height:1.8;
	font-size:120%;
}


@media screen and (max-width:799px){
	.trial-tv .flex.top {
		flex-direction:column;
	}
	.trial-tv .flex > .text {
		width:100%;
		padding:0 1em 1em;
	}

	.trial-tv .flex > .text h3 {
		font-size:150%;
	}
	.trial-tv .flex > .text .date{
		padding-bottom:0.5em;
	}
	.trial-tv .flex > .text p {
		line-height:1.6;
		font-size:110%;
	}

	.media-video-list.flex {
		padding:0 0.5em;
	}

	.media-video-list.flex.col2 > * {
		padding:0.5em 0.3em 1em;
	}

	.media-video-cell .label {
		overflow:hidden;
		display:-webkit-box;
		-webkit-box-orient:vertical;
		-webkit-line-clamp:2;
	}
}



/* ======================================================================================================
	trainer section
====================================================================================================== */
.trial-trainer {
}
.trial-trainer > li {
	padding:0.5em;
}
.trial-trainer > li > a {
	position:relative;
	display:block;
	width:100%;
	aspect-ratio:400/450;
	overflow:hidden;
}
.trial-trainer > li img {
	width:100%;
	height:100%;
	object-fit:cover;
	object-position:top;
	transition:all 0.3s ease;
	-webkit-transition:all 0.3s ease;
}
.trial-trainer > li .name {
	position:absolute;
	bottom:0.2em;
	left:0.2em;
	right:0.2em;
	padding-top:0.2em;
	color:#fff;
	background:rgba(34,34,34,0.8);
	text-align:center;
	z-index:10;
	font-size:160%;
	line-height:1.2;
	font-family: 'termina' ,'Noto Sans JP' ,sans-serif;
}

@media screen and (min-width:800px){
	.trial-trainer > li a:hover img {
		transform:scale(1.1);
	}
}
@media screen and (max-width:799px){
	.trial-trainer.flex > * {
		width:calc(100% / 3);
		padding:0.2em;
	}
	.trial-trainer > li .name {
		font-size:100%;
	}
}



/* ======================================================================================================
	flow section
====================================================================================================== */
/* ------------------ flow list --------------------------- */
.trial-flow-list > li {
	padding-top:calc( var(--contents-padding) / 2 );
}
.trial-flow-list > li + li {
	padding-top:var(--contents-padding);
}

@media screen and (max-width:799px){
	.trial-flow-list > li.flex {
		position:relative;
	}
}


/* ------------------ flow list > * --------------------------- */
.trial-flow-body {
	position:relative;
	z-index:2;
	width:55%;
}
.trial-flow-image {
	position:relative;
	z-index:1;
	flex-grow:1;
	padding-top:1em;
	text-align:center;
}


@media screen and (max-width:799px){
	.trial-flow-body {
		width:100%;
		height:350px;
	}
	.trial-flow-image {
		position:absolute;
		top:6em;
		right:0;
		width:70%;
		height:250px;
		padding:0;
		text-align:right;
		filter:brightness(0.9);
	}

	.trial-flow-list > li + li .trial-flow-image {
		top:7.5em;
	}
}


/* ------------------ flow list title --------------------------- */
.trial-flow-title.flex {
	line-height:1;
	padding-bottom:0.3em;
	justify-content:flex-start;
	flex-wrap:wrap;
}

.trial-flow-title.flex > .number {
	padding-left:0.5em;
	font-size:400%;
	font-weight:bold;
	font-family:'Antonio',sans-serif;
	text-align:center;
}
.trial-flow-title.flex > .mainText {
	padding-left:0.8em;
	font-size:180%;
}

.trial-flow-title.flex:after {
    content: "";
    display: block;
    width: 100%;
    height: 3px;
	margin-top:1em;
    background: linear-gradient(90deg,#600,#f33,#600);
}

@media screen and (max-width:799px){
	.trial-flow-title.flex > .number {
		font-size:250%;
	}
	.trial-flow-title.flex > .mainText {
		font-size:140%;
	}


}


/* ------------------ flow list text --------------------------- */
.trial-flow-body .text {
	padding:1em 2em 0;
}
.trial-flow-body .text p {
	line-height:2;
	font-size:120%;
}


@media screen and (max-width:799px){
	.trial-flow-body .text {
		position:relative;
		padding:0.5em 0 0;
	}
	.trial-flow-body .text p {
		position:relative;
		z-index:2;
		padding:0 0.5em;
		font-size:100%;
		font-weight:bold;
	}

	.trial-flow-body .text .clone {
		position:absolute;
		z-index:1;
		top:0.5em;
		bottom:0;
		left:0;
		right:0;
		-webkit-text-stroke:0.2em #fffe;
	}
}



/* ==============================================
	full image
=============================================== */
.trial-largeImage {
	padding-top:var(--contents-padding);
}
.trial-largeImage img {
	width:100%;
}


@media screen and (max-width:799px){
	.trial-largeImage img {
		height:200px;
		object-fit: cover;
		object-position: 45%;
	}
}



/* ======================================================================================================
	FAQ data section
====================================================================================================== */
.faq {
	padding:0;
}

.faq .head.flex {
	cursor:pointer;
}
.faq .head.flex .text.flex {
	padding:0.5em 0 0.5em 0.5em;
	justify-content:space-between;
}
.faq .head.flex .text.flex > .headText {
	width:calc(100% - 3.5em);
}
.faq .head.flex .text.flex > .toggle {
	width:3.5em;
	text-align:center;
}

.faq .head.flex .toggle > span {
	font-size:85%;
	line-height:1.2;
	letter-spacing:0;
}
.faq .head.flex .toggle > span > span {
	display:block;
}

.faq .head.flex .toggle .open {
	color:#9ff;
}
.faq .head.flex .toggle .close {
	color:#fcf;
}

.faq .head.flex.close .toggle .close {
	display:none;
}
.faq .head.flex:not(.close) .toggle .open {
	display:none;
}

.faq .body.flex {
	width:100% !important;
	min-height:auto;
}
.faq .body.flex > .letter.flex {
	padding:0.5em 0;
}




/* ======================================================================================================
	shop data section
====================================================================================================== */

/* ------------------ floor guide --------------------------- */
.trial-inner .floor-guide-table {
	background:rgba(51,51,51,0.6);
}
.trial-inner .floor-photo-list.flex > .floor-photo-cell {
	padding:0 0.5em 1em;
}


/* ------------------ shop name --------------------------- */
.trial-shop-name {
	padding-bottom:3em;
	font-weight:bold;
	text-align:center;
}
.trial-shop-name p {
	font-size:160%;
}


@media screen and (max-width:799px){
	.trial-shop-name {
		padding-bottom:2em;
	}
	.trial-shop-name p {
		font-size:140%;
	}
}


/* ------------------ shop information --------------------------- */
.trial-shop-data {
}
.trial-shop-data:before ,
.trial-shop-data:after {
	content:"";
	display:block;
	width:100%;
	height:3px;
	background: linear-gradient(90deg,#600,#f33,#600);
}

.trial-shop-data dl {
	padding:1.5em 2em;
}
.trial-shop-data dt {
	width:35%;
	padding:1em 2em;
	text-align:right;
}
.trial-shop-data dd {
	width:calc(100% - 35%);
	padding:1em 2em;
}
.trial-shop-data dl span {
	font-size:140%;
}


@media screen and (max-width:799px){
	.trial-shop-data dl {
		padding:0.5em;
	}
	.trial-shop-data dt {
		width:25%;
		padding:0.5em;
	}
	.trial-shop-data dd {
		width:calc(100% - 25%);
		padding:0.5em;
	}
	.trial-shop-data dl span {
		font-size:110%;
	}
}



/* ======================================================================================================
	contact section
====================================================================================================== */
.trial-inner .form-notes p{
	font-size:140%;
}


@media screen and (max-width:799px){
	.trial-inner .form-notes p{
		font-size:120%;
	}
}



/* ======================================================================================================
	map section
====================================================================================================== */
#trial-access .trial-h2 {
	padding-bottom:0.5em;
}