@charset "utf-8";


#wrap {
	width: 100%;
	margin: auto;
	background-color: #fff;
}

.topbnr {
	width: 100%;
	text-align: center;
	margin-bottom: -100px;
}

.wrapper-innner {
	width: 100%;
	margin: 0 auto;
	padding-bottom: 30px;
	max-width: 1024px;
}

.top-category{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	margin: 50px auto 50px auto;
	justify-content: space-between;
	max-width: 1200px;
	position: relative;
}

.top-category > div {
	width: 19%;
	text-align: center;
	padding: 10px 4px;
	box-shadow: 2px 4px 14px rgba(0,0,0,.3);
}

.btn-flat-border_top {
	text-decoration: none;
	background-color: #fff;
	border-radius: 3px;
}

.btn-flat-border_top a {
	color: #1074c3;
	font-size: medium;
}

.btn-flat-border_top:hover {
	font-weight: bold;
}

.btn-flat-border_top span {
	display: block;
	color: #1074c3;
}

.block-text {
	width: 100%;
	padding: 17px;
	font-size: 20px;
	color: #222;
	text-align: center;
	margin: 0 auto;
	border: solid 2px #aaa;
	/* border-radius: 10px; */
	background-color: #e2e2e2;
	box-sizing: border-box;
	margin-bottom: 50px;
}

.block-text span {
	font-size: 40px;
	font-weight: bold;
	color: #1074c3;
}

.contents {
	width: 100%;
	margin: 0px auto 50px;
	max-width: 1024px;
	padding-top: 50px;
}

.main-blok{
}

.main-block-text {
	width: 100%;
	padding: 30px;
	font-size: large;
	color: #222;
	text-align: left;
	margin: 30px auto 0;
	border: solid 2px #aaa;
	/* border-radius: 10px; */
	background-color: #fff;
}

.main-block-text span {
	font-size: x-large;
	font-weight: bold;
	color: #1074c3;
	line-height: 50px;
}

.text-arrow {
	display: block;
	line-height: 0px;
	text-align: center;
}

.schedule {
	width: 100%;
	border: solid 2px #1074c3;
}

.schedule td {
	width: 14%;
	border: solid 2px #1074c3;
	font-size: small;
	padding: 4px;
}

#training-day {
	background-color: #dbebf8;
}

#recovery-day {
	background-color: #fbf19d;
}

.category_unit {
	background: #fff9c5;
	/* margin-right: calc(50% - 50vw); */
	/* margin-left: calc(50% - 50vw); */
	/* padding-right: calc(50vw - 50%); */
	/* padding-left: calc(50vw - 50%); */
	/* padding-top: 50px; */
	/* padding-bottom: 50px; */
	padding: 30px;
}

.use-category{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	margin: 50px auto 0px auto;
	justify-content: space-between;
}

.use-category > div {
	width: 32%;
	text-align: center;
	padding: 20px 20px;
	box-shadow: 0 0 10px grey;
}

.btn-flat-border_use {
	text-decoration: none;
	background-color: #ef3933;
	/* border: solid 2px #03a9f4; */
	/* border-radius: 3px; */
	transition: .4s;
}

.btn-flat-border_use a {
	color: #fff;
	font-size: medium;
}

.btn-flat-border_use:hover {
	font-weight: bold;
}

.use-main-titl {
	font-size: x-large;
	margin-bottom: 10px;
}

.use-titl {
	background-color: #fff;
	padding: 10px;
	color: #222;
	margin-bottom: 10px;
	font-size: medium;
}

.use-blok{
}

.use-block-text {
	width: 100%;
	padding: 30px;
	font-size: large;
	color: #222;
	text-align: left;
	margin: 50px auto 0;
	border: solid 2px #aaa;
	/* border-radius: 10px; */
	background-color: #fff;
	box-sizing: border-box;
}

.use-subTitl {
	font-size: large;
	font-weight: bold;
	color: #1074c3;
	line-height: 30px;
}

.weight {
	font-weight: bold;
}

.red {
	color: #ff7600;
	font-weight: bold;
}

.category-block_item {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	margin: 0 auto;
	justify-content: space-between;
}

.category-block_item > div {
	/* width: 19%; */
	text-align: center;
	/* margin: 5px 0; */
	padding-bottom: 10px;
	/* background: #fff; */
}

.btn-flat-border_item {
	text-decoration: none;
	border-radius: 3px;
	transition: .4s;
}

.btn-flat-border_item a {
	color: #222;
	font-size: medium;
}

.btn-flat-border_item span {
	color: #ff0000;
}

.btn-flat-border_item span {
	font-size: 14px;
	display: block;
}

.arrow {
	width: 100%;
	text-align: right;
	margin-bottom: 30px;
	font-size: medium;
}

.arrow p {
	padding-right: 2em;
	margin: 10px 0 5px 0;
	font-weight: bold;
	color: #2174c3;
}

.arrow span {
	display: block;
	width: 20%;
	height: 2px;
	background-color: #2174c3;
	position: relative;
	transform: scale(0, 1);
	transform-origin: top left;
	animation: arrow01 5s ease-in-out infinite forwards;
	margin: auto 0 auto auto;
}

@keyframes arrow01 {
	0% { transform: scale(0, 1); }
	30% { transform: scale(0, 1); }
	40% { transform: scale(1, 1); }
	85% { transform: scale(1, 1); opacity: 1;}
	90% { transform: scale(1, 1); opacity: 0; }
	100% { transform: scale(1, 1); opacity: 0; }
}

.arrow span::after {
	content: "";
	display: block;
	width: 8px;
	height: 15px;
	border-right: 2px solid #2174c3;
	transform: rotate(-45deg) scale(1, 0);
	transform-origin: right bottom;
	position: absolute;
	bottom: 2px;
	right: 1px;
	animation: arrow02 5s ease-in-out infinite forwards;
}

@keyframes arrow02 {
	0% { transform: rotate(-45deg) scale(1, 0); }
	45% { transform: rotate(-45deg) scale(1, 0); }
	55% { transform: rotate(-45deg) scale(1, 1); }
	85% { transform: rotate(-45deg) scale(1, 1); opacity: 1;}
	90% { transform: rotate(-45deg) scale(1, 1); opacity: 0; }
	100% { transform: rotate(-45deg) scale(1, 1); opacity: 0; }
}

h2 {
	font-size: 28px;
	margin: 0px auto 20px auto;
	position: relative;
	padding: 0.5rem 0rem;
	width: 100%;
	color: #fff;
	text-align: center;
	font-weight: bold;
	background-color: #2174c3;
	box-sizing: border-box;
	text-indent: 0.5em;
}

h2:before {
	position: absolute;
	top: 4px;
	left: 4px;
	width: calc(100% - 8px);
	height: calc(100% - 8px);
	content: '';
	border: 1px solid #ffffff;
	box-sizing: border-box;
}

.content-block1{
	width: 100%;
	display: flex;
	display: -ms-flexbox;
	flex-wrap: wrap;
	-ms-flex-wrap: wrap;
	transition: .7s ease-in-out;
	text-align: center;
	justify-content: space-between;
}

.content-block1 > div {
	width: 40%;
	margin: 0;
}

.content-block1 > div:nth-of-type(2) {
	width: 58%;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(5, 1fr);
	grid-gap: 20px;
	padding: 0px;
}

.content-block1 > div.fourth {
	width: 58%;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	grid-gap: 20px;
	padding: 0px;
}

.content-block1 > div.third {
	width: 58%;
	margin: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	grid-gap: 20px;
	padding: 0px;
}

.content-block1 a {
	color: #222;
}

.content-block1 span {
	color: #ff0000;
}

.item-name {
	font-size: 14px;
	text-align: left;
	font-feature-settings: "palt";
}

.item-lineup {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	margin: 0 auto 0px auto;
}

.item-lineup > div {
	width: 18%;
	text-align: center;
	margin: 5px auto;
	padding-bottom: 10px;
}

.item-lineup > div.t_way {
	width: 26%;
	text-align: center;
	margin: 5px auto;
	padding-bottom: 10px;
}

.btn-flat-border_lineup {
	text-decoration: none;
	border-radius: 3px;
	transition: .4s;
}

.btn-flat-border_lineup a {
	color: #222;
	font-size: medium;
}

.btn-flat-border_lineup span {
	color: #ff0000;
}

.btn-flat-border_lineup span {
	font-size: large;
	display: block;
}

.innner-title {
	font-size: xx-large;
	margin: 0px 0 50px;
	text-align: center;
	line-height: 1em;
	color: #222;
	font-weight: bold;
}

.innner-title span{
	font-size: medium;
	text-align: center;
}

.lineup-title {
	font-size: 28px;
	margin: 50px 0 50px 0;
	text-align: center;
	line-height: 1em;
	color: #2174c3;
	font-weight: bold;
}

.lineup-title span{
	font-size: large;
	text-align: center;
	color: #222;
}



.title-hr {
	width: 70%;
	margin-top: 10px;
	border-width: 0 0 2px;
	border-image: linear-gradient(
		90deg,
		hsla(0, 0%, 100%, 0),
		hsla(0deg 1% 6% / 50%) 50%,
		hsla(0, 0%, 100%, 0) 100%) 0 0 100%;
	border-style: solid;
}

.btn {
	width: 100%;
	margin-bottom: 0;
	text-align: center;
	margin: 50px 0 50px;
}

.btn-square-shadow {
	display: inline-block;
	width: 100%;
	padding: 15px;
	text-decoration: none;
	background: #dbebf8;
	color: #2174c3 !important;
	text-align: center;
	border-bottom: solid 4px #2174c3;
	border-radius: 3px;
	font-size: medium;
	font-weight: bold;
}

.btn-square-shadow:active {
	transform: translateY(4px);
	box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
	border-bottom: none;
}

footer{
	width: 100%;
	/* padding-bottom: 10px; */
	background-color: #222;
	text-align: center;
}

footer a:nth-of-type(2) {
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 20px;
}

.footer-img {
	width: 100%;
}

#page-top {
	position: fixed;
	right: -70px;
	bottom: 10px;
}
.icon {
	width: 25%;
	display: inline;
}



@media screen and (min-width: 891px) {
	.pc_none {
		display: none;
	}
}



@media screen and (max-width: 890px) {
	.sp_none {
		display: none !important;
	}

	* {
		box-sizing:border-box;
		font-family: 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3';
	}

	html, body, div, span, applet, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	a, abbr, acronym, address, big, cite, code,
	del, dfn, em, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var,
	b, u, i, center,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend,
	table, caption, tbody, tfoot, thead, tr, th, td,
	article, aside, canvas, details, embed,
	figure, figcaption, footer, header, hgroup,
	menu, nav, output, ruby, section, summary,
	time, mark, audio, video {
		margin: 0;
		padding: 0;
		border: 0;
		font-size: 100%;
		vertical-align: baseline;
	}

	article, aside, details, figcaption, figure,
	footer, header, hgroup, menu, nav, section {
		display: block;
	}

	body {
		line-height: normal;
	}

	ol, ul {
		list-style: none;
	}

	blockquote, q {
		quotes: none;
	}

	blockquote:before, blockquote:after,
	q:before, q:after {
		content: '';
		content: none;
	}

	table {
		border-collapse: collapse;
		border-spacing: 0;
		text-align: center;
	}

	a {
		text-decoration: none;
	}

	.clearfix:after {
		content: "";
		clear: both;
		display: block;
	}

	html {
		/*	scroll-behavior: smooth;*/
	}

	body{
		font-size: 1.2rem;
		color: #333;
		overflow-x: hidden;
	}

	img {
		width: 100%;
		display: block;
		-webkit-backface-visibility: hidden;
		backface-visibility: hidden;
	}

	a:hover {
		opacity: .8;
	}

	#wrap {
		width: 100%;
		margin: auto;
		background-color: #fff;
	}

	.topbnr {
		width: 100%;
		text-align: center;
		margin-bottom: -100px;
	}

	.wrapper-innner {
		width: 94%;
		margin: 0 auto;
		padding-bottom: 30px;
		max-width: 1024px;
	}

	.top-category{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		margin: 100px auto 50px auto;
		justify-content: space-between;
		max-width: 1200px;
		position: relative;
		width: 100%;
		/* display: block; */
		/* margin: 25px 0 25px 0; */
	}

	.top-category > div {
		width: 100%;
		text-align: center;
		padding: 10px 4px;
		box-shadow: 2px 4px 14px rgba(0,0,0,.3);
		display: inline-block;
		width: 90%;
		padding: 5px;
		margin: 5px auto;
	}

	.btn-flat-border_top {
		text-decoration: none;
		background-color: #fff;
		border-radius: 3px;
	}

	.btn-flat-border_top a {
		color: #1074c3;
		font-size: medium;
	}

	.btn-flat-border_top:hover {
		font-weight: bold;
	}

	.btn-flat-border_top span {
		display: block;
		display: contents;
	}

	.block-text {
		width: 100%;
		padding: 20px;
		font-size: 16px;
		color: #222;
		text-align: center;
		margin: 0 auto;
		border: solid 2px #aaa;
		/* border-radius: 10px; */
		background-color: #e2e2e2;
		box-sizing: border-box;
		margin-bottom: 50px;
	}

	.block-text span {
		font-size: 28px;
		font-weight: bold;
		color: #1074c3;
	}

	.contents {
		width: 100%;
		margin: 0px auto 25px;
		max-width: 1024px;
		padding-top: 25px;
	}

	.main-blok{
	}

	.main-block-text {
		width: 100%;
		padding: 10px;
		font-size: 16px;
		color: #222;
		text-align: left;
		margin: 30px auto 0;
		border: solid 2px #aaa;
		/* border-radius: 10px; */
		background-color: #fff;
	}

	.main-block-text span {
		font-size: 18px;
		font-weight: bold;
		color: #1074c3;
		line-height: initial;
	}

	.text-arrow {
		display: block;
		line-height: 0px;
		text-align: center;
	}

	.schedule {
		width: 100%;
		border: solid 2px #1074c3;
	}

	.schedule td {
		width: 14%;
		border: solid 2px #1074c3;
		font-size: small;
		padding: 4px;
	}

	#training-day {
		background-color: #dbebf8;
	}

	#recovery-day {
		background-color: #fbf19d;
	}

	.category_unit {
		background: #fff9c5;
		margin-right: calc(50% - 50vw);
		margin-left: calc(50% - 50vw);
		padding-right: calc(50vw - 50%);
		padding-left: calc(50vw - 50%);
		padding-top: 25px;
		padding-bottom: 25px;
	}

	.use-category{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		margin: 25px auto 0px auto;
		justify-content: space-between;
	}

	.use-category > div {
		width: 100%;
		text-align: center;
		padding: 20px 20px;
		box-shadow: 0 0 10px grey;
		margin: 10px auto;
	}

	.btn-flat-border_use {
		text-decoration: none;
		background-color: #ef3933;
		/* border: solid 2px #03a9f4; */
		/* border-radius: 3px; */
		transition: .4s;
	}

	.btn-flat-border_use a {
		color: #fff;
		font-size: medium;
	}

	.btn-flat-border_use:hover {
		font-weight: bold;
	}

	.use-main-titl {
		font-size: x-large;
		margin-bottom: 10px;
	}

	.use-titl {
		background-color: #fff;
		padding: 10px;
		color: #222;
		margin-bottom: 10px;
		font-size: medium;
	}

	.use-blok{
	}

	.use-block-text {
		width: 100%;
		padding: 10px;
		font-size: large;
		color: #222;
		text-align: left;
		margin: 25px auto 0;
		border: solid 2px #aaa;
		/* border-radius: 10px; */
		background-color: #fff;
		box-sizing: border-box;
	}

	.use-subTitl {
		font-size: large;
		font-weight: bold;
		color: #1074c3;
		line-height: 30px;
	}

	.weight {
		font-weight: bold;
	}

	.red {
		color: #ff7600;
		font-weight: bold;
	}

	.category-block_item {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		margin: 0 auto;
		justify-content: space-between;
	}

	.category-block_item > div {
		/* width: 19%; */
		text-align: center;
		/* margin: 5px 0; */
		padding-bottom: 10px;
		/* background: #fff; */
	}

	.btn-flat-border_item {
		text-decoration: none;
		border-radius: 3px;
		transition: .4s;
	}

	.btn-flat-border_item a {
		color: #222;
		font-size: medium;
	}

	.btn-flat-border_item span {
		color: #ff0000;
	}

	.btn-flat-border_item span {
		font-size: 14px;
		display: block;
	}

	.arrow {
		width: 100%;
		text-align: right;
		margin-bottom: 30px;
		font-size: medium;
	}

	.arrow p {
		padding-right: 20px;
		font-weight: bold;
		color: #2174c3;
	}

	.arrow span {
		display: block;
		width: 50%;
		height: 2px;
		background-color: #2174c3;
		position: relative;
		transform: scale(0, 1);
		transform-origin: top left;
		animation: arrow01 5s ease-in-out infinite forwards;
		margin: auto 0 auto auto;
	}

	@keyframes arrow01 {
		0% { transform: scale(0, 1); }
		30% { transform: scale(0, 1); }
		40% { transform: scale(1, 1); }
		85% { transform: scale(1, 1); opacity: 1;}
		90% { transform: scale(1, 1); opacity: 0; }
		100% { transform: scale(1, 1); opacity: 0; }
	}

	.arrow span::after {
		content: "";
		display: block;
		width: 8px;
		height: 15px;
		border-right: 2px solid #2174c3;
		transform: rotate(-45deg) scale(1, 0);
		transform-origin: right bottom;
		position: absolute;
		bottom: 2px;
		right: 1px;
		animation: arrow02 5s ease-in-out infinite forwards;
	}

	@keyframes arrow02 {
		0% { transform: rotate(-45deg) scale(1, 0); }
		45% { transform: rotate(-45deg) scale(1, 0); }
		55% { transform: rotate(-45deg) scale(1, 1); }
		85% { transform: rotate(-45deg) scale(1, 1); opacity: 1;}
		90% { transform: rotate(-45deg) scale(1, 1); opacity: 0; }
		100% { transform: rotate(-45deg) scale(1, 1); opacity: 0; }
	}

	h2 {
		font-size: 28px;
		margin: 0px auto 20px auto;
		position: relative;
		padding: 0.5rem 0rem;
		width: 100%;
		color: #fff;
		text-align: center;
		font-weight: bold;
		background-color: #2174c3;
		box-sizing: border-box;
	}

	h2:before {
		position: absolute;
		top: 4px;
		left: 4px;
		width: calc(100% - 8px);
		height: calc(100% - 8px);
		content: '';
		border: 1px solid #ffffff;
		box-sizing: border-box;
	}

	.content-block1{
		width: 100%;
		display: flex;
		display: -ms-flexbox;
		flex-wrap: wrap;
		-ms-flex-wrap: wrap;
		transition: .7s ease-in-out;
		text-align: center;
		justify-content: space-between;
	}

	.content-block1 > div {
		width: 100%;
		margin: 0;
	}

	.content-block1 > div:nth-of-type(2) {
		width: 100%;
		margin: 25px 0;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-gap: 10px;
		padding: 0px;
	}

	.content-block1 > div.fourth {
		width: 100%;
		margin: 25px 0;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-gap: 20px;
		padding: 0px;
	}

	.content-block1 > div.third {
		width: 100%;
		margin: 25px 0;
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-gap: 20px;
		padding: 0px;
	}

	.content-block1 a {
		color: #222;
	}

	.content-block1 span {
		color: #ff0000;
	}

	.item-name {
		font-size: 14px;
		text-align: left;
		font-feature-settings: "palt";
	}

	.item-lineup {
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		margin: 10px auto;
		justify-content: space-between;
	}

	.item-lineup > div {
		width: 48%;
		text-align: center;
		margin: 5px auto;
		padding-bottom: 10px;
	}

	.item-lineup > div.t_way {
		width: 30%;
		text-align: center;
		margin: 0;
		padding-bottom: 0;
	}

	.btn-flat-border_lineup {
		text-decoration: none;
		border-radius: 3px;
		transition: .4s;
	}

	.btn-flat-border_lineup a {
		color: #222;
		font-size: 14px;
		display: block;
	}

	.btn-flat-border_lineup span {
		color: #ff0000;
	}

	.btn-flat-border_lineup span {
		font-size: 14px;
		display: block;
	}

	.innner-title {
		font-size: 24px;
		margin: 0px 0 25px;
		text-align: center;
		line-height: 1em;
		color: #222;
		font-weight: bold;
	}

	.innner-title span{
		font-size: medium;
		text-align: center;
	}

	.lineup-title {
		font-size: 20px;
		margin: 50px 0 50px 0;
		text-align: center;
		line-height: 1em;
		color: #2174c3;
		font-weight: bold;
	}

	.lineup-title span{
		font-size: large;
		text-align: justify;
		color: #222;
	}



	.title-hr {
		width: 70%;
		margin-top: 10px;
		border-width: 0 0 2px;
		border-image: linear-gradient(
			90deg,
			hsla(0, 0%, 100%, 0),
			hsla(0deg 1% 6% / 50%) 50%,
			hsla(0, 0%, 100%, 0) 100%) 0 0 100%;
		border-style: solid;
	}

	.btn {
		width: 100%;
		margin-bottom: 0;
		text-align: center;
		margin: 25px 0 25px;
	}

	.btn-square-shadow {
		display: inline-block;
		width: 100%;
		padding: 15px;
		text-decoration: none;
		background: #dbebf8;
		color: #2174c3 !important;
		text-align: center;
		border-bottom: solid 4px #2174c3;
		border-radius: 3px;
		font-size: medium;
		font-weight: bold;
	}

	.btn-square-shadow:active {
		transform: translateY(4px);
		box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);
		border-bottom: none;
	}

	footer{
		width: 100%;
		/* padding-bottom: 10px; */
		background-color: #222;
		text-align: center;
	}

	footer a:nth-of-type(2) {
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		padding: 20px;
	}

	.footer-img {
		width: 100%;
	}

	#page-top {
		position: fixed;
		right: -70px;
		bottom: 10px;
	}
	.icon {
		width: 25%;
		display: inline;
	}

}
