@charset "UTF-8";

/*******************************
ページトップの告知エリア
*******************************/
a.announcement {
	margin		: 20px auto;
	margin		: 1rem auto 1.5rem;
	padding		: 0.5em 0 0;
	display		: block;
	font-weight	: bold;
	font-size	: 1.3em;
	line-height	: 1.4;
	color		: #ff0;
	text-align	: center;
	border		: 2px solid #1f54bc;
	border-radius	: 1em;
	background	: linear-gradient(to bottom, rgb(161, 217, 239) 25%, rgb(29, 125, 192) 75%);
	box-shadow	: 2px 2px 3px 0px #888;
}
a.announcement span img {
	display		: block;
	height		: 0.5em;
}
a.announcement span {
	display		: block;
}
a.announcement span:before {
	content		: "本年2020年のモンスター道場杯は中止";
	white-space	: pre;
}
a.announcement:hover {
	background	: linear-gradient(to top, rgb(161, 217, 239) 25%, rgb(29, 125, 192) 75%);
}
a.announcement2 span:before {
	content		: "2020年5月24日(日)のモンスター杯は\A 9月13日(日)に延期";
}

@media screen and (max-width:640px) {
a.announcement {
	max-width	: 100%;
	font-size	: 20px;
	font-size	: 4.5vw;
	font-size	: calc(100vw/21);
}
}
/******* ページトップの告知エリア *******/

/*******************************
下へのスクロール
*******************************/
.scroll2 {
	position	: relative;
	display		: table;	/* for centering	*/
	margin		: -1.2em auto -2em;
	width		: 64px;	/* 単なる目安	*/
}
.scroll2 span {
	position	: relative;
	display		: block;
	left		: 50%;
	width		: 1em;
	font-size	: 12px;	/* 念のため三角の高さより低く設定	*/
	line-height	: 1;
}
.scroll2 span:before {
	content		: "";
	position	: absolute;
	top		: 0;
	border-style	: solid;
	animation		: goto_arrow 2s infinite;
	opacity	: 0;
}
.scroll2 span:nth-of-type(1) {
	height		: 16px;
}
.scroll2 span:nth-of-type(1):before {
	left		: -16px;
	border-width	: 16px 16px 0px 16px;
	border-color	: indigo transparent transparent transparent;
	animation-delay		: 0s;
}
.scroll2 span:nth-of-type(2) {
	margin-top	: 4px;
	height		: 24px;
}
.scroll2 span:nth-of-type(2):before {
	left		: -24px;
	border-width	: 24px 24px 0px 24px;
	border-color	: purple transparent transparent transparent;
	animation-delay		: .15s;
}
.scroll2 span:nth-of-type(3) {
	margin-top	: 6px;
	height		: 32px;
}
.scroll2 span:nth-of-type(3):before {
	left		: -32px;
	border-width	: 32px 32px 0px 32px;
	border-color	: mediumorchid transparent transparent transparent;
	animation-delay		: .3s;
}
@keyframes goto_arrow {
	0% {
		opacity: 0;
	}
	50% {
		opacity: 1;
	}
	100% {
		opacity: 0;
	}
}
/******* 下へのスクロール *******/

/*******************************
練習場所
*******************************/
#map_wrap {
	position	: relative;
	margin		: 0 auto 1em;
	max-width	: 560px;
	border		: 1px solid dodgerblue;
	background	: linear-gradient(10deg, rgb(8,78,255), lightskyblue 7%);	/* 左下湘南海岸のグラデーション	*/
}
#map_wrap:before,
#map_wrap:after {
	position	: absolute;
	top		: 1%;
	left		: 1%;
	display		: inline-block;
	padding		: 0.3em;
	line-height	: 1;
}
#map_wrap:before {
	content		: "モンスター道場";
	padding-left	: 1.5em;
	color		: white;
	background	: rgba(0, 0, 0, 0.7);
	border-radius	: 0.5em;
	text-shadow	:
			-1px  0px 0px #333, -1px -1px 0px #333,
			 0px -1px 0px #333,  1px -1px 0px #333,
			 1px  0px 0px #333,  1px  1px 0px #333,
			 0px  1px 0px #333, -1px  1px 0px #333;
	z-index		: 1;

}
#map_wrap:after {
	content		: "★";
	color		: magenta;
	z-index		: 2;
}
#map_wrap ul {
	position	: relative;
	margin		: 0;
	padding		: 100% 0 0;
	list-style	: none;
	overflow	: hidden;	/* 市町村名の背景色がはみでる場合のため	*/
	background	: url(/wp-content/uploads/2016/07/front_01.gif), linear-gradient(280deg,
				rgb(8,78,255), lightskyblue 8%, rgba(0,0,0,0) 0);	/* 東京湾のグラデーション	*/
	background-repeat	: no-repeat;
	background-position	: center center;
	background-size	: cover;
}
#map_wrap ul:before {	/* 道場の場所を示すマーク	*/
	position	: absolute;
	content		: "★";
	top		: 32.5%;
	left		: 76.5%;
	display		: block;
	margin		: -0.5em 0 0 -0.5em;
	width		: 1em;
	line-height	: 1;
	color		: magenta;
}
#map_wrap ul:after {	/* アクアラインを示す棒	*/
	content		: "";
	position	: absolute;
	top		: 36.8%;
	left		: 92%;
	margin-top	: -0.194em;
	margin-top	: calc( -0.25em * 0.777 );	/* アクアライン棒幅 / 2 * cos39°	*/
	width		: 15%;
	height		: 0.5em;
	border-radius	: 100vh;
	background	: blue;
	transform	: rotate(39deg);
}
#chiba,
#map_wrap ul:after,
#map_wrap li {
	position	: absolute;
	font-size	: 16px;
}
@media screen and (max-width:592px) {
	#chiba,
	#map_wrap ul:after,
	#map_wrap li {
		font-size	: 3.125vw;
		font-size	: calc( 100vw / 32 );
	}
}
@media screen and (max-width:512px) {
	#map_wrap:before {
		font-family	: "rounded-mplus-1p-bold-ttf";
	}
}

#map_wrap li {
	display		: inline-block;	/* 最小幅	*/
	padding		: 0.2em 0.15em 0.1em;
	color		: black;	/* 背景色・背景画像からなるべく際立たせる	*/
	text-align	: center;
	line-height	: 1.2;	/* 県・郡がある場合は改行するので	*/
	white-space	: nowrap;
	transform	: translate(-50%, -50%);
}
#map_wrap .with_back {
	background	: rgba(225, 255, 255, 0.8);
	border-radius	: 0.3em;
}
#map_wrap .county {
	display		: block;
	font-size	: 0.9em;
}

#chiba {	/* 千葉からのアクセス	*/
	top		: 37.5%;
	left		: 96%;
	padding		: 0.3em 0.4em;
	width		: 1em;
	text-align	: center;
	line-height	: 1.1;
	background	: lightyellow;
	border		: 1px solid orangered;
	border-radius	: 0.25em;
	transform	: translateX(-50%);
}
#chiba:before,
#chiba:after {
	content		: "";
	position	: absolute;
	bottom		: 100%;
	left		: 50%;
	margin-left	: -0.35em;
	border-style	: solid;
	border-width	: 0 0.35em 1.2em;
	border-color	: transparent;
}
#chiba:before {
	border-bottom-color	: orangered;
}
#chiba:after {
	margin-bottom	: -3px;
	border-bottom-color	: lightyellow;
}
#chiba span:after {
	content		: "６４０円より";
	display		: block;
	margin		: 0.2em auto;
	padding		: 0.2em 0;
	color		: blue;
	border		: solid blue;
	border-width	: 1px 0;
	border-radius	: 50% / 0.3em;	/* 上下にカッコを表示させるため	*/
}
#chuuou {
	top	: 2%;
	left	: 95%;
}
#minato {
	top	: 3%;
	left	: 86%;
}
#koutou {
	top	: 9%;
	left	: 95%;
}
#shinagawa {
	top	: 12%;
	left	: 82%;
}
#meguro {
	top	: 8%;
	left	: 76%;
}
#oota {
	top	: 22%;
	left	: 80%;
}
#setagaya {
	top	: 4%;
	left	: 63%;
}
#shibuya {
	top	: 2%;
	left	: 77%;
}
#machida {
	top	: 19%;
	left	: 26%;
}
#yokohama {
	top	: 37%;
	left	: 50%;
	background	: rgba(255, 255, 0, 0.3);
	border-radius	: 0.4em;
}
#tsurumi {
	top	: 36%;
	left	: 70%;
}
#kanagawa {
	top	: 43%;
	left	: 64%;
}
#nishi {
	top	: 49%;
	left	: 63%;
}
#naka {
	top	: 56%;
	left	: 68%;
}
#minami {
	top	: 56%;
	left	: 57%;
}
#hodogaya {
	top	: 50%;
	left	: 51%;
}
#isogo {
	top	: 62%;
	left	: 60%;
}
#kanazawa {
	top	: 76%;
	left	: 61%;
}
#kouhoku {
	top	: 31%;
	left	: 62%;
}
#totsuka {
	top	: 62%;
	left	: 44%;
}
#kounan {
	top	: 66%;
	left	: 52%;
}
#asahi {
	top	: 44%;
	left	: 43%;
}
#midori {
	top	: 34%;
	left	: 38.5%;
}
#seya {
	top	: 48%;
	left	: 36%;
}
#sakae {
	top	: 72%;
	left	: 48%;
}
#izumi {
	top	: 57%;
	left	: 38%;
}
#aoba {
	top	: 25%;
	left	: 42%;
}
#tsuzuki {
	top	: 27%;
	left	: 53%;
}
#kawasaki {
	top	: 32%;
	left	: 84%;
}
#saiwai {
	top	: 27%;
	left	: 73%;
}
#nakahara {
	top	: 20%;
	left	: 67.5%;
}
#takatsu {
	top	: 14%;
	left	: 60%;
}
#tama {
	top	: 10%;
	left	: 48%;
}
#miyamae {
	top	: 18%;
	left	: 54%;
}
#asao {
	top	: 15%;
	left	: 39%;
}
#sagamihara {
	top	: 25%;
	left	: 12%;
}
#yokosuka {
	top	: 97%;
	left	: 71%;
}
#hiratsuka {
	top	: 77%;
	left	: 5.5%;
}
#kamakura {
	top	: 81%;
	left	: 46%;
}
#fujisawa {
	top	: 74%;
	left	: 30%;
}
#chigasaki {
	top	: 80%;
	left	: 18.5%;
}
#zushi {
	top	: 87%;
	left	: 55%;
}
#atsugi {
	top	: 46%;
	left	: 5.5%;
}
#yamato {
	top	: 44%;
	left	: 28%;
}
#isehara {
	top	: 64%;
	left	: 6.5%;
}
#ebina {
	top	: 51%;
	left	: 15.5%;
}
#zama {
	top	: 42%;
	left	: 18%;
}
#ayase {
	top	: 56%;
	left	: 23%;
}
#hayama {
	top	: 94.5%;
	left	: 57.5%;
}
#samukawa {
	top	: 70%;
	left	: 14.5%;
}
#aikawa {
	top	: 33%;
	left	: 5%;
}
#shounan {
	top	: 89%;
	left	: 41%;
}
/******* 練習場所 *******/

/*******************************
新着・更新情報
*******************************/
.reload_area {
	border		: 1px solid #999;
	border-radius	: 0.5em;
}
.reload_area dl {
	margin		: 0;
	padding		: 0;
	line-height	: 1.5;
}
.reload_area dl ul {
	margin-bottom	: 0;
}
.reload_area dl li {
	line-height	: 1.5;
}
.reload_area dt {
	margin		: 0;
	padding		: 0.5em 0px 0px 2%;
	border-top	: 1px dotted #999;
	color		: #259eb4;
}
.reload_area dt:first-child {
	border-top	: none;
}
dt.new_info {
	position	: relative;
}
dt.new_info:before {
	position	: absolute;
	content		: "1";
	display		: block;
	top		: -0.2em;
	right		: 0em;
	width		: 1.5em;
	height		: 1.5em;
	line-height	: 1.5;
	font-family	: "HGPｺﾞｼｯｸE";
	font-weight	: bold;
	color		: white;
	text-align	: center;
	background	: red;
	border-radius	: 50%;
}
dt.new_info2:before {
	content		: "2";
}
dt.new_info3:before {
	content		: "3";
}
.reload_area dd {
	margin		: 0;
	padding		: 0.3em 2% 0.5em 3%;
}
.reload_area dd a {
	text-decoration	: none;
	padding		: 0 0.5em 0 0;
}
/******* 新着・更新情報 *******/

/*******************************
メリット
*******************************/
.merit {
	margin		: 0;
	padding		: 0;
	list-style	: none;
	counter-reset	: merit_count;
	background	: radial-gradient(aquamarine 20%, white 70%);
	overflow	: hidden;	/* for float	*/
}
.merit li {
	margin		: 0 0 1em 0;
	padding		: 0;
}
.merit a {
	position	: relative;
	background	: repeating-linear-gradient(35deg,
					rgb(0,95,190)  0, rgb(0,95,190)   6px,
					rgb(0,100,200) 0, rgb(0,100,200)  8px,
					rgb(0,105,210) 0, rgb(0,105,210) 10px,
					rgb(0,100,200) 0, rgb(0,100,200) 12px);
	display		: block;
	margin		: 0;
	padding		: 3.1em 0em 1em;
	width		: 304px;
	line-height	: 1.3;
	color		: white;
	text-decoration	: none;
	border-radius	: 10px;
	overflow	: hidden;	/* rotateさせたアンカーテキストのはみ出しを消す	*/
}
@media screen and (max-width:359px) {
.merit a {
	width		: 288px;
}
}

.merit a:before {
	position	: absolute;
	content		: "";
	top		: 0;
	right		: 0;
	border-style	: solid;
	border-width	: 30px 0px 0px 43px;
	border-color	: gold transparent transparent transparent;
}
.merit a:hover:before {
	border-color	: coral transparent transparent transparent;
}
.merit a:hover {
	background	: repeating-linear-gradient(-35deg,
					rgb(0,95,190)  0, rgb(0,95,190)   6px,
					rgb(0,100,200) 0, rgb(0,100,200)  8px,
					rgb(0,105,210) 0, rgb(0,105,210) 10px,
					rgb(0,100,200) 0, rgb(0,100,200) 12px);
}
.merit a:after {
	position	: absolute;
	content		: "";
	display		: block;
	width		: 100%;
	height		: 100%;
	top		: 0;
	left		: 0;
	background	: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 70%);
}
.merit a:hover:after {
	background	: linear-gradient(to top, rgba(255,255,255,0) 0%, rgba(255,255,255,0.3) 100%);
}
.merit span.a_text {
	position	: relative;
	display		: block;
	margin		: 0 -0.5em;
	padding		: 0.3em 0.6em;
	line-height	: 1.4;
	text-align	: center;
	font-weight	: bold;
	background	: blue;
	background	: linear-gradient(rgba(0,0,255,0.6), rgba(0,0,255,0.6));
}
.merit span.a_text:before {
	position	: absolute;
	content		: "Merit " counter(merit_count, decimal);
	counter-increment	: merit_count;
	top		: -2.1em;
	left		: 50%;
	display		: block;
	width		: 6em;
	margin-left	: -3em;
	font-weight	: normal;
	text-align	: center;
	text-decoration	: underline;
	font-style	: italic;
	font-family	: "rounded-mplus-1p-bold-ttf";
	font-display	: swap;
}
.merit span.a_text:after {	/* 左上の○	*/
	position	: absolute;
	top		: -2.3em;
	left		: 0.8em;
	display		: block;
	padding		: 0.2em;
	width		: 2em;
	height		: 2em;
	line-height	: 2em;
	border-radius	: 50%;
	font-size	: 1.2em;
	font-weight	: normal;
	text-align	: center;
	white-space	: nowrap;
	font-family	: "rounded-mplus-1p-bold-ttf";
	font-display	: swap;
}
@media screen and (max-width:382px) {
.merit span.a_text {
	font-family	: "rounded-mplus-1p-bold-ttf";
	font-display	: swap;
	transform	: rotate(-4deg);
}
.merit span.a_text:before,
.merit span.a_text:after {
	transform	: rotate(4deg);
}
}

.merit li:nth-child(1) span.a_text:after {
	content		: "刺激";
	background	: radial-gradient(circle closest-side at center, rgb(160,0,0) 10%, rgb(255,80,80));
}
.merit li:nth-child(2) span.a_text:after {
	content		: "技術";
	background	: radial-gradient(circle closest-side at center, rgb(5,125,173) 10%, rgb(6,175,242));
}
.merit li:nth-child(3) span.a_text:after {
	content		: "快適";
	background	: radial-gradient(circle closest-side at center, rgb(16,132,46) 20%, rgb(23,197,69));
}
.merit li:nth-child(1) {
	margin-bottom	: 3em;
}
.merit li:nth-child(2),
.merit li:nth-child(3) {
	width		: 50%;
	float		: left;
}
.merit li:nth-child(1) a {
	margin		: auto;
}
.merit li:nth-child(2) a {
	margin-right	: 8px;
	margin-left	: auto;
}
.merit li:nth-child(3) a {
	margin-left	: 8px;
}

@media screen and (max-width:920px) {
.merit li:nth-child(1) {
	margin-bottom	: 1em;
}
.merit li:nth-child(2),
.merit li:nth-child(3) {
	width		: 100%;
	float		: none;
}
.merit li:nth-child(1) a {
	margin		: 0;
}
.merit li:nth-child(2) a {
	margin		: auto;
}
.merit li:nth-child(3) a {
	margin-left	: auto;
}
}

.merit span.click {
	display		: block;
	margin		: 1em 1em 0;
	padding		: 0.3em 0;
	font-weight	: bold;
	font-style	: italic;
	line-height	: 1;
	color		: #333;
	text-align	: center;
	background	: white;
	border-radius	: 0.8em;
}
.merit span.click:before {
	content		: "TAP・";
}
.merit span.click:after {
	position	: absolute;
	content		: "";
	display		: inline-block;
	margin-left	: 0.7em;
	border-style	: solid;
	border-width	: 0.4em 0 0.6em 0.75em;
	border-color	: transparent transparent transparent red;
	transform	: rotate(10deg);
}
.merit #member_cnt {
	padding-left	: 0.15em;
	padding-right	: 0.15em;
	font-size	: 1.2em;
	color		: red;
	text-shadow	:
			-1px  0px 0px #fff, -1px -1px 0px #fff,
			 0px -1px 0px #fff,  1px -1px 0px #fff,
			 1px  0px 0px #fff,  1px  1px 0px #fff,
			 0px  1px 0px #fff, -1px  1px 0px #fff;
}
/******* メリット *******/

/*******************************
協賛スポンサー様
*******************************/
ul.sponsor {
	position	: relative;
	margin		: 4em 0 2em 0;
	padding		: 0.5em 2%;
	list-style	: none;
	border		: solid 3px #62c1ce;
}
ul.sponsor li {
	margin		: 0;
	padding		: 0;
}
ul.sponsor li#nobu .speech {
	margin		: 0 0 1em 0;
	line-height	: 1.4;
	display		: inline-block;
	overflow	: hidden;
}
ul.sponsor li#nobu .speech_japanese,
ul.sponsor li#nobu .speech_english {
	float		: left;
	padding		: 0.5em;
}
ul.sponsor li#nobu .speech_japanese {
	background	: lightcyan;
	border-radius	: 0.8em 0 0 0.8em;
}
ul.sponsor li#nobu .speech_english {
	background	: #FBFBBA;
	border-radius	: 0 0.8em 0.8em 0;
}
@media screen and (max-width:480px) {
ul.sponsor li#nobu .speech_japanese,
ul.sponsor li#nobu .speech_english {
	font-size	: 3.5vw;	/* フォールバック	*/
	font-size	: calc( 100vw / 28 );
}
}
ul.sponsor h3.sponsor_name {
	position	: absolute;
	display		: inline-block;
	margin		: 0;
	padding		: 0 0.5em;
	border		: none;
	top		: -40px;
	left		: -3px;
	height		: 40px;
	line-height	: 40px;
	vertical-align	: middle;
	background	: #62c1ce;
	color		: #ffffff;
	font-weight	: normal;
	border-radius	: 8px 8px 0 0;
	white-space	: nowrap;
}
/******* 協賛スポンサー様 *******/