@charset "utf-8";

html {/* scroll-behavior:smooth; */}
body {
	margin: 0;
	padding: 0;
	font-family:"Noto Sans JP", "Yu Gothic", "YuGothic", "Hiragino Kaku Gothic Pro", "Meiryo", sans-serif;
	font-size:16px;
	line-height:180%;
	color: #000;
	min-width:1240px;
	-webkit-text-size-adjust: 100% ;/* iPhone */
}
img {
	border: none;
	vertical-align:bottom;
}
div, p, ul, ul li, h1, h2, h3, h4, h5, dl, dt, dd {
	font-size:100%;
	margin: 0;
	padding: 0;
	list-style:none;
	box-sizing:border-box;
}
div, p, ul, ul li, h1, h2, h3, h4, h5, dl, dt, dd, ol, ol li, table, th, td {
	background-image:url(../image/spacer.gif); /* Android */
}
a:link {color:#06F; outline:none; }
a:visited {color:#06F;}
a:hover {color: #333;}
a:hover img { opacity: 0.7; filter: alpha(opacity=70); -moz-opacity: 0.7;}
#wrapper {}
#base { position:relative; }

.pc {display:block;}
.sm {display:none;}

/*====================================================================================================
  HEADER
====================================================================================================*/

#header {
	clear:both;
	width:100%;
	left: 0;
	right: 0;
	top: 35px;
	z-index: 2;
	display: flex;
	margin: 0 auto;
	overflow: hidden;
	background: #FFF;
	max-width: 1200px;
	position:absolute;
	align-items: center;
	border-radius: 80px;
	justify-content: space-between;
}

/*** LOGO ******************************************************************/
#header h1,
#header h1 a { display: block; width:216px; height:64px; }
#header h1 { text-align: center; margin:13px 0 13px 40px; }
#header h1 a { color: #222;
	/*text-indent: -9999px;
	background: url(../image/logo.svg) no-repeat;*/
}

/*** NAVIGATION ************************************************************/
#Nav { margin: auto; max-width: 1000px;}
#Nav ul { display:flex; align-items:center; }
#Nav ul li {}
#Nav ul li+li { margin-left:25px; }
#Nav ul li a {
	display: block;
	color: #000;
	font-size: 98%;
	font-weight: 700;
	/*line-height: 130%;*/
	position: relative;
	text-decoration: none;
	box-sizing: border-box;
}
#Nav ul li a::before {
	content: "";
	position: absolute;
	top: 50%;
	left: -11px;
	width: 10px;
	height: 8px;
	transform: translateY(-50%);
	background: url(../image/arrow_right1.svg) no-repeat;
	background-size: contain;
}

#Nav ul li:last-child { width:148px; margin-left:15px; }
#Nav ul li:last-child a {
	color: #FFF;
	text-align: center;
	background: #F58342;
	padding-block: 35px;
	border-radius: 0 80px 80px 0;
}
#Nav ul li:last-child a::before {
	left: 15px;
	background: url(../image/arrow_right2.svg) no-repeat;
	background-size: contain;
}
#Nav ul li a:hover { opacity:0.7; }

/*====================================================================================================
  CONTENT
====================================================================================================*/

#content { clear:both; width:100%; }

/* WRAPPER 1240px */
.box_main { max-width:1240px; width:100%; margin:0 auto;padding: 0 20px; }

/* BTNS */
.download_btn { width: 300px; }
.download_btn a {
	color: #FFF;
	display: block;
	font-size: 125%;
	font-weight: 900;
	text-align: center;
	padding-block: 20px;
	border-radius: 80px;
	text-decoration: none;
	background: #F58342 url(../image/icon_download2.svg) no-repeat 90%;
}
.download_btn.dl_wh a { color: #F58342; background: #FFF url(../image/icon_download1.svg) no-repeat 93%; } 
.download_btn a:hover { opacity:0.7; }

.b_more { width:400px; margin:0 auto; }
.b_more a {
	color: #000;
	display: block;
	font-size: 125%;
	font-weight: 900;
	line-height: 100%;
	text-align: center;
	padding-block: 20px;
	border-radius: 80px;
	text-decoration: none;
	background: #E9E9E9 url(../image/arrow_right3.svg) no-repeat 95%;
}
.b_more.b_wh a { background:#FFF url(../image/arrow_right3.svg) no-repeat 95%; }
.b_more.b_wh2 a { background:#FFF url(../image/arrow_down2.svg) no-repeat 95%; }
.b_more a:hover { opacity:0.7; }



/* SHAKE OUT TRAINING LIST */
h3+.list_box { margin-top:110px; }
.list_box {
	display: flex;
	row-gap: 60px;
	column-gap:54px;
	flex-wrap: wrap;
}
.list_box dl { width:364px; }
.list_box dl a { text-decoration:none; color:#000; display:block; }
.list_box dl a:hover { opacity:0.7; }
.list_box dl dt { width:100%; margin:auto; position:relative; margin-bottom:35px; }
.list_box dl dt img { width:100%; height: 213px; object-fit: cover; border-radius:10px; }
.list_box dl dt .caption {
	left: 0;
	bottom: 0;
	min-width: 180px;
	height: 38px;
	font-size: 150%;
	font-weight: 700;
	background: #FFF;
	padding-top: 12px;
	padding-right: 16px;
	position: absolute;
	border-top-right-radius: 10px;
}
.list_box dl dd {
	width:304px;
	height: 95px;
	margin: auto;
	display: flex;
	padding: 0 15px;
	position:relative;
	flex-direction: column;
	justify-content: center;
}
.list_box dl dd::before,
.list_box dl dd::after {
	content: "";
	top: 0;
	left: -30px;
	width: 30px;
	height: 100%; /* initial value: 60px */
	position: absolute;
	background: url(../../image/top/curve.svg) no-repeat;
	background-size: auto 100%; /* initial value: contain */
}
.list_box dl dd::after { left:auto; right:-30px; transform:scaleX(-1); }
.list_box dl dd b { font-size: 125%; font-weight: 900; }
.list_box dl dd small {
	display: block;
	font-size: 112.5%;
	font-weight: 700;
	/*line-height: 120%;*/
	margin-top: 10px;
}
.list_box dl dd small+small { margin-top:0; }

.list_box dl dt .kanryo {
	background: #F58342;
	color: #FFF;
	font-size: 14px;
	font-weight: 500;
	padding: 8px;
	position: absolute;
	top: 0;
	left: 0;
	border-top-left-radius: 10px;
	border-bottom-right-radius: 10px;
}



/*====================================================================================================
  FOOTER
====================================================================================================*/

#footer { width:100%; background:#1E374B; position:relative; /*border-top:3px solid #E9E9E9;*/ }
#footer::before {
	content: "";
	bottom: 0;
	z-index: 5;
	width: 100%;
	left: -668px;
	height: 460px;
	position: absolute;
	background: #234D6C;
	border-top-right-radius: 240px;
	margin-left: calc(((100% - 1200px) / 2) * -1);
}
#footer .sponsor { background: #FFF; padding-block:120px 160px; }
#footer .sponsor h3 { text-align:center; position:relative; }
#footer .sponsor h3::after {
	content: "";
	left: 0;
	right: 0;
	bottom: -40px;
	width: 68px;
	height: 10px;
	margin: auto;
	position: absolute;
	background: url(../image/tit_bar.svg) no-repeat;
	background-size: contain;
}
#footer .sponsor h3 small {
	color: #286189;
	display: block;
	font-size: 125%;
	font-weight: 700;
}
#footer .sponsor h3 b {
	display: block;
	font-size: 300%;
	font-weight: 700;
	/*line-height: 100%;*/
	margin-top: 20px;
}
#footer .sponsor ul {
	display: flex;
	row-gap: 20px;
	flex-wrap: wrap;
	column-gap: 30px;
	margin-top: 30px;
	align-items: center;
	justify-content: center;
}
#footer .sponsor ul li img { width:100%; height:auto; }
#footer .f_box {
	color: #FFF;
	z-index: 99;
	width: 100%;
	display: flex;
	margin: 0 auto;
	padding: 60px 0;
	max-width: 1200px;
	position: relative;
	align-items: center;
	justify-content: space-between;
}
#footer ul { display:flex; justify-content:space-between; }
#footer .profile { max-width: 532px; font-weight: 700; }
#footer .profile div { line-height:200%; }
#footer .profile .logo { margin-bottom:40px; }
#footer .profile .copy { font-size: 81.3%; }
#footer .profile ul { width:150px; margin-block:30px; }
#footer .f_nav { width: 100%; max-width:600px; }
#footer .f_nav ul { flex-wrap:wrap; row-gap:30px; }
#footer .f_nav ul li { flex-basis:32%; }
#footer .f_nav ul li:nth-child(3n+2) { flex-basis:16%; }
#footer .f_nav ul li:nth-child(3n+3),
#footer .f_nav ul li:last-child { flex-basis:27%; }
#footer .f_nav ul li a {
	color: #FFF;
	font-weight: 700;
	position: relative;
	text-decoration: none;
}
#footer .f_nav ul li a::before {
	content: "";
	position: absolute;
	left:-12px;
	top: 50%;
	width: 10px;
	height: 8px;
	transform: translateY(-50%);
	background: url(../image/arrow_right2.svg) no-repeat;
	background-size: contain;
}
#footer .f_nav ul li a:hover { opacity:0.7; }






/*====================================================================================================
  PAGE
====================================================================================================*/

#page,
#page a { display:block; width:51px; height:51px;}
#page { position: fixed; bottom:20px; right: 20px; z-index:99999; }
#page a {
	text-indent: -9999px;
	background:#234D6C url(../image/page_top.png) no-repeat;
}


/*====================================================================================================
  COLOR eto.. [No Touch]
====================================================================================================*/
.light-blue { color: #40A6DD;}
.blue { color: #0000FF;}
.dark-blue { color: #000099;}
.purple { color: #660099;}
.pink { color: #FF6699;}
.red { color: #FF0000;}
.orange { color: #FF6600;}
.yellow { color: #FFCC00;}
.white { color: #FFFFFF;}
.gray { color: #666666;}
.brown { color: #663300;}
.green { color: #339900;}
.italic { font-style: italic;}
.strong { font-weight: bold;}
.large { font-size: 115%; /*line-height: 140%;*/}
.small { font-size: 80%;}
.underline { text-decoration: underline;}
.line-through { text-decoration: line-through;}
.left { text-align: left;}
.center { text-align: center;}
.right { text-align: right;}