/*
 Theme Name: Zero School
 FLOCSS customed (FLOU)
 */
/**************************************
 Reset CSS
 ***************************************/
 /*! normalize.css v8.0.0 | MIT License | github.com/necolas/normalize.css */
/* Document
========================================================================== */
/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */
 html {
 	line-height: 1.15;
 	/* 1 */
 	-webkit-text-size-adjust: 100%;
 	/* 2 */
 }
/* Sections
========================================================================== */
/**
 * Remove the margin in all browsers.
 */
 body {
 	margin: 0;
 }
/**
 * Correct the font size and margin on `h1` elements within `section` and
 * `article` contexts in Chrome, Firefox, and Safari.
 */
 h1 {
 	font-size: 2em;
 	margin: 0.67em 0;
 }
/* Grouping content
========================================================================== */
/**
 * 1. Add the correct box sizing in Firefox.
 * 2. Show the overflow in Edge and IE.
 */
 hr {
 	box-sizing: content-box;
 	/* 1 */
 	height: 0;
 	/* 1 */
 	overflow: visible;
 	/* 2 */
 }
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
 pre {
 	font-family: monospace, monospace;
 	/* 1 */
 	font-size: 1em;
 	/* 2 */
 }
/* Text-level semantics
========================================================================== */
/**
 * Remove the gray background on active links in IE 10.
 */
 a {
 	background-color: transparent;
 }
/**
 * 1. Remove the bottom border in Chrome 57-
 * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
 */
 abbr[title] {
 	border-bottom: none;
 	/* 1 */
 	text-decoration: underline;
 	/* 2 */
 	text-decoration: underline dotted;
 	/* 2 */
 }
/**
 * Add the correct font weight in Chrome, Edge, and Safari.
 */
 b, strong {
 	font-weight: bolder;
 }
/**
 * 1. Correct the inheritance and scaling of font size in all browsers.
 * 2. Correct the odd `em` font sizing in all browsers.
 */
 code, kbd, samp {
 	font-family: monospace, monospace;
 	/* 1 */
 	font-size: 1em;
 	/* 2 */
 }
/**
 * Add the correct font size in all browsers.
 */
 small {
 	font-size: 80%;
 }
/**
 * Prevent `sub` and `sup` elements from affecting the line height in
 * all browsers.
 */
 sub, sup {
 	font-size: 75%;
 	line-height: 0;
 	position: relative;
 	vertical-align: baseline;
 }
 sub {
 	bottom: -0.25em;
 }
 sup {
 	top: -0.5em;
 }
/* Embedded content
========================================================================== */
/**
 * Remove the border on images inside links in IE 10.
 */
 img {
 	border-style: none;
 }
/* Forms
========================================================================== */
/**
 * 1. Change the font styles in all browsers.
 * 2. Remove the margin in Firefox and Safari.
 */
 button, input, optgroup, select, textarea {
 	font-family: inherit;
 	/* 1 */
 	font-size: 100%;
 	/* 1 */
 	line-height: 1.15;
 	/* 1 */
 	margin: 0;
 	/* 2 */
 }
/**
 * Show the overflow in IE.
 * 1. Show the overflow in Edge.
 */
 button, input {
 	/* 1 */
 	overflow: visible;
 }
/**
 * Remove the inheritance of text transform in Edge, Firefox, and IE.
 * 1. Remove the inheritance of text transform in Firefox.
 */
 button, select {
 	/* 1 */
 	text-transform: none;
 }
/**
 * Correct the inability to style clickable types in iOS and Safari.
 */
 button, [type="button"], [type="reset"], [type="submit"] {
 	-webkit-appearance: button;
 }
/**
 * Remove the inner border and padding in Firefox.
 */
 button::-moz-focus-inner, [type="button"]::-moz-focus-inner, [type="reset"]::-moz-focus-inner, [type="submit"]::-moz-focus-inner {
 	border-style: none;
 	padding: 0;
 }
/**
 * Restore the focus styles unset by the previous rule.
 */
 button:-moz-focusring, [type="button"]:-moz-focusring, [type="reset"]:-moz-focusring, [type="submit"]:-moz-focusring {
 	outline: 1px dotted ButtonText;
 }
/**
 * Correct the padding in Firefox.
 */
 fieldset {
 	padding: 0.35em 0.75em 0.625em;
 }
/**
 * 1. Correct the text wrapping in Edge and IE.
 * 2. Correct the color inheritance from `fieldset` elements in IE.
 * 3. Remove the padding so developers are not caught out when they zero out
 *    `fieldset` elements in all browsers.
 */
 legend {
 	box-sizing: border-box;
 	/* 1 */
 	color: inherit;
 	/* 2 */
 	display: table;
 	/* 1 */
 	max-width: 100%;
 	/* 1 */
 	padding: 0;
 	/* 3 */
 	white-space: normal;
 	/* 1 */
 }
/**
 * Add the correct vertical alignment in Chrome, Firefox, and Opera.
 */
 progress {
 	vertical-align: baseline;
 }
/**
 * Remove the default vertical scrollbar in IE 10+.
 */
 textarea {
 	overflow: auto;
 }
/**
 * 1. Add the correct box sizing in IE 10.
 * 2. Remove the padding in IE 10.
 */
 [type="checkbox"], [type="radio"] {
 	box-sizing: border-box;
 	/* 1 */
 	padding: 0;
 	/* 2 */
 }
/**
 * Correct the cursor style of increment and decrement buttons in Chrome.
 */
 [type="number"]::-webkit-inner-spin-button, [type="number"]::-webkit-outer-spin-button {
 	height: auto;
 }
/**
 * 1. Correct the odd appearance in Chrome and Safari.
 * 2. Correct the outline style in Safari.
 */
 [type="search"] {
 	-webkit-appearance: textfield;
 	/* 1 */
 	outline-offset: -2px;
 	/* 2 */
 }
/**
 * Remove the inner padding in Chrome and Safari on macOS.
 */
 [type="search"]::-webkit-search-decoration {
 	-webkit-appearance: none;
 }
/**
 * 1. Correct the inability to style clickable types in iOS and Safari.
 * 2. Change font properties to `inherit` in Safari.
 */
 ::-webkit-file-upload-button {
 	-webkit-appearance: button;
 	/* 1 */
 	font: inherit;
 	/* 2 */
 }
/* Interactive
========================================================================== */
/*
 * Add the correct display in Edge, IE 10+, and Firefox.
 */
 details {
 	display: block;
 }
/*
 * Add the correct display in all browsers.
 */
 summary {
 	display: list-item;
 }
/* Misc
========================================================================== */
/**
 * Add the correct display in IE 10+.
 */
 template {
 	display: none;
 }
/**
 * Add the correct display in IE 10.
 */
 [hidden] {
 	display: none;
 }
 html {
 	font-size: 62.5%;
 }
 body {
 	font-family: 'Noto Sans JP', '游ゴシック体', 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
 	font-size: 1.6rem;
 	line-height: 1.6;
 }
 h1, h2, h3, h4, h5 {
 	margin: 0;
 	padding: 0;
 	font-size: 1.6rem;
 	font-weight: 400;
 }
 p, strong {
 	margin-top: 0;
 	font-size: 1.6rem;
 	line-height: 1.8;
 }
 a {
 	color: #333;
 	text-decoration: none;
 	transition: 0.5s;
 	font-size: 1.6rem;
 }
 a:hover {
	opacity: 0.8;
	text-decoration: underline;
 }
 ul {
 	list-style: none;
 	margin: 0;
 	padding: 0;
 }
 li {
 	font-size: 1.6rem;
 	line-height: 1.8;
 }
/**************************************
 INNER
 ***************************************/
 .l-section {
 	padding: 4rem 0;
 }
 .l-section--inner {
 	width: 1140px;
 	margin: 0 auto;
 	padding: 2rem 0;
 }
 @media screen and (max-width: 768px) {
 	.l-section--inner {
 		width: 95%;
 		margin: 0 auto;
 	}
 }
 .l-section--inner_md {
 	width: 768px;
 	margin: 0 auto;
 }
 @media screen and (max-width: 768px) {
 	.l-section--inner_md {
 		width: 95%;
 		margin: 0 auto;
 	}
 }
 .l-section--inner_md > div {
 	margin-bottom: 2rem;
 }

 .blog--inner {
 	max-width: 768px;
 	width: 100%;
	/* 井上 センター表示を解除 */
 	/* margin: 0 auto; */
 }

/**************************************
 COLUMN
 ***************************************/
 img {
 	max-width: 100%;
 	height: auto;
 }
 .l-col-box {
 	display: -webkit-flex;
 	display: -moz-flex;
 	display: -ms-flex;
 	display: -o-flex;
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-between;
 	align-items: center;
 }
 .l-col2 {
 	width: 50%;
 	box-sizing: border-box;
 }
 .l-col2_sm {
 	width: 30%;
 }
 @media screen and (max-width: 768px) {
 	.l-col2_sm {
 		width: 100%;
 	}
 }
 .l-col2_md {
  width: 46.5%;
 }
 @media screen and (max-width: 768px) {
 	.l-col2_md {
 		width: 100%;
 	}
 }
 .l-col2_lg {
 	width: 65%;
 }
 @media screen and (max-width: 768px) {
 	.l-col2_lg {
 		width: 100%;
 	}
 }
 .l-col3 {
 	width: 30%;
 }
 @media screen and (max-width: 768px) {
 	.l-col3 {
 		width: 48%;
 		margin-bottom: 2rem;
 	}
 	.l-col3 img {
 		width: 100%;
 		height: auto;
 	}
 }
 @media screen and (max-width: 480px) {
 	.l-col3 {
 		width: 100%;
 		margin-bottom: 2rem;
 	}
 }
 .l-col4 {
  width: 24%;
}
.l-col4 img {
  width: 100%;
  height: auto;
  transition: 1s;
  -webkit-transition: 100ms;
}
.l-col4 img:hover {
  transform: scale(1.1);
}
@media screen and (max-width: 480px) {
  .l-col4 {
    width: 48%;
  }
}
.l-col5 {
  width: 15%;
}
@media screen and (max-width: 480px) {
  .l-col5 {
    width: 32%;
  }
}
/**************************************
 HEADER CONTENT
 ***************************************/
 header {
 	position: fixed;
 	left: 0;
 	top: 0;
 	width: 100%;
 	z-index: 100;
 	background: #fff;
 }
 @media screen and (max-width: 768px) {
 	header {
 		display: none;
 	}
 }
 .header--inner {
 	display: -webkit-flex;
 	display: -moz-flex;
 	display: -ms-flex;
 	display: -o-flex;
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-between;
 	align-items: center;
 	width: 1100px;
 	margin: 0 auto;
 	padding: 1rem 0px;
 }
 @media screen and (max-width: 768px) {
 	.header--inner {
 		width: 95%;
 		margin: 0 auto;
 	}
 }
 .header--inner_btn {
 	width: 40%;
 	display: -webkit-flex;
 	display: -moz-flex;
 	display: -ms-flex;
 	display: -o-flex;
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-between;
 	align-items: center;
 }
 .globalNav {
 	background: #00999F;
 }
 @media screen and (max-width: 768px) {
 	.globalNav {
 		display: none;
 	}
 }
 .globalNav ul {
 	width: 1200px;
 	margin: 0 auto;
 	display: -webkit-flex;
 	display: -moz-flex;
 	display: -ms-flex;
 	display: -o-flex;
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-between;
 	align-items: center;
 	justify-content: flex-end;
	background: #00999F;
 }
 @media screen and (max-width: 768px) {
 	.globalNav ul {
 		width: 100%;
 		margin: 0 auto;
		background: #00999F;
 	}
 }
 .globalNav li:hover {
 	background: rgba(255, 255, 255, 0.75);
 }
 .globalNav li:hover a {
 	color: #4284c5;
 }
 .globalNav a {
 	display: block;
 	margin: 0 2rem;
 	padding: 1.5rem 0;
 	color: #fff;
 }

 a.home {
 	color:#4284c5;
 }

 .sumaho_btn {
 	display: none;
 }
 @media screen and (max-width: 768px) {
 	.sumaho_btn {
 		width: 98%;
 		display: block;
 		position: fixed;
 		right: 0;
 		bottom: 0;
 		z-index: 9999;
 		text-align: center;
 	}
 	.sumaho_btn .sumaho_btn01 a, .sumaho_btn .sumaho_btn02 a, .sumaho_btn .sumaho_btn03 a {
 		float: left;
 		width: 29%;
 		margin-right: 5px;
 		margin-bottom: 13px;
 		padding: 10px;
 		color: #fff;
 		border-radius: 50px;
 	}
 	.sumaho_btn .sumaho_btn01 a {
 		background-color: #e25d6a;
 	}
 	.sumaho_btn .sumaho_btn02 a {
 		background-color: #ffb637;
 	}
 	.sumaho_btn .sumaho_btn03 a {
 		background-color: #00a968;
 	}
 }
/**************************************
 MAIN CONTENT
 ***************************************/
 #container {
 	padding-top: 140px;
 }
 @media screen and (max-width: 768px) {
 	#container {
 		padding-top: 0;
 	}
 }

 #mainVisual {
 	position: relative;
 	width: 100%;
 	height: 600px;
 }

 @media screen and (max-width: 768px) {
 	#mainVisual {
 		position: relative;
 		width: 100%;
 		height: 400px;
 	}
	 .scroll {
		overflow:auto;
		white-space:nowrap;
	 }
	 .scroll::-webkit-scrollbar{
		height:5px;
	 }
	 .scroll::-webkit-scrollbar-track{
		background:#f1f1f1;
	 }
	 .scroll::-webkit-scrollbar-thumb{
		background:#bcbcbc;
	 }
 }

 @media screen and (max-width: 480px) {
 	#mainVisual {
 		position: relative;
 		width: 100%;
 		height: 0;
 		padding-top: 50%;
 	}
 }

 .mainVisual-item {
 	position: absolute;
 	top: 0;
 	right: 0;
 	bottom: 0;
 	left: 3rem;
 	width: 600px;
 	height: 310px;
 	margin: auto 100px;
 }

 .mainVisual-item img {
 	width: 100%;
 	height: auto;
 }

 .mainVisual-item a {
 	display: block;
 	margin: 1rem 0;
 	padding: 1rem;
 	/* background: #2c8fc3; */
	background: #e25d6a;
 	color: #fff;
 	text-align: center;
 	font-size: 2.4rem;
 	border-radius: 15px;
 	transition: 0.2s;
 }

 .mainVisual-item a:hover {
 	background: #fff;
 	color: #2c8fc3;
 }

 @media screen and (max-width: 768px) {
 	.mainVisual-item {
 		position: absolute;
 		top: 0;
 		right: 0;
 		bottom: 0;
 		left: 3rem;
 		width: 400px;
 		height: 210px;
 		margin: auto 0;
 	}

 	.mainVisual-item a {
 		display: block;
 		width: 80%;
 		margin: 1rem 0;
 		padding: 1rem;
 		background: #2c8fc3;
 		color: #fff;
 		text-align: center;
 		font-size: 2rem;
 		border-radius: 15px;
 		transition: 0.2s;
 	}
 }

 @media screen and (max-width: 480px) {
 	.mainVisual-item {
 		position: absolute;
 		top: 0;
 		right: 0;
 		bottom: 0;
 		left: 1rem;
 		width: 200px;
 		height: 120px;
 		margin: auto 0;
 	}

 	.mainVisual-item a {
 		display: block;
 		margin: 0.5rem 0;
 		padding: 0.5rem;
 		background: #2c8fc3;
 		color: #fff;
 		text-align: center;
 		font-size: 1.4rem;
 		border-radius: 10px;
 		transition: 0.2s;
 	}
 }

 .main-btn {
 	display: block;
 	width: 320px;
 	margin: 0 auto !important;
 	padding: 2rem !important;
 	background: #fff;
 	color: #4284c5;
 	font-size: 2em;
 	border-radius: 4px;
 	transition: 0.3s;
 }
 .main-btn:hover {
 	background: -webkit-linear-gradient(90deg, #39a5dd, #2c8fc3);
 	background: linear-gradient(90deg, #39a5dd, #2c8fc3);
 	color: #fff;
 }
 .curriculum-list {
 	padding-left: 1.6rem;
 	box-sizing: border-box;
 }
 .curriculum_txt {
 	width:66%;
 	margin: 0 auto 66px auto;
 }
 .curriculum_cont {
 	width:90%;
 	margin:0 auto;
 }
 .curriculum_left {
 	float:left;
 	width:40%;
 }
 .curriculum_right {
 	float:right;
 	width:40%;
 }
 .curriculum_cont span {
 	width:50%;
 	display:inline-block;
 	margin-left:5%
 }
 .curriculum_cont .course {
 	width: 50%;
 	float: left;
 	box-sizing: border-box;
 	padding: 5px;
 }
 .curriculum_cont .course h4.course_top {
 	background-color: #4284c5;
 	color: #fff;
 	text-align: center;
 	box-sizing: border-box;
 	padding: 15px;
 	font-weight: bold;
 	font-size: 20px;
 	border-bottom: solid 1px #fff;
 }
 .curriculum_cont .course_left {
 	float: left;
 	width: 40%;
 	box-sizing: border-box;
 	padding: 10px 15px;
 	background-color: #ccc;
 	border-bottom: solid 1px #fff;
 }
 .curriculum_cont .course_right {
 	float: left;
 	width: 60%;
 	box-sizing: border-box;
 	padding: 10px 15px;
 	border-bottom: solid 1px #fff;
 }
 .curriculum_cont .course p.syosai {
 	background-color: #ffb637;
 	color: #fff;
 	box-sizing: border-box;
 	padding: 10px;
 }
 .curriculum_cont .course p span {
 	text-align: center;
 	width: 100%;
 	margin: auto;
 }
 .curriculum_cont .course ul {
 	list-style: decimal-leading-zero;
 	background-color: #4284c5;
 	color: #fff;
 	list-style-position: inside;
 }
 .curriculum_cont .course li {
 	box-sizing: border-box;
 	padding: 10px 20px;
 	border-bottom: solid 1px #fff;
 }
 .curriculum_cont table {
 	width: 100%;
 	border-collapse: collapse;
 	margin: 50px auto;
 	font-size: 14px;
 }
 .curriculum_cont th, .curriculum_cont td {
 	width: 20%;
 	text-align: center;
 	box-sizing: border-box;
 	padding: 10px 5px;
 }
 .curriculum_cont th.wide, .curriculum_cont td.wide {
 	width: 29%;
 }
 .curriculum_cont th.narrow, .curriculum_cont td.narrow {
 	width: 11%;
 }
 .curriculum_cont th {
 	background-color: #4284c5;
 	color: #fff;
 	font-weight: normal;
 	border: solid 1px #fff;
 }
 .curriculum_cont td {
 	border: solid 1px #ccc;
 }
 .curriculum_cont td.td_top {
 	background-color: #e25d6a;
 	border: solid 1px #fff;
 	color: #fff;
 }

 .curriculum_cont td.td_business_top {
 	background-color: #e2925d;
 	border: solid 1px #fff;
 	color: #fff;
 }

 .curriculum_cont td.td_bottom {
 	background-color: #e25d6a;
 	border: solid 1px #fff;
 	border-bottom: solid 1px #e25d6a;
 	color: #fff;
 }
 @media screen and (max-width: 768px) {
 	.curriculum_cont .course {
 		width: 100%;
 	}
 	.curriculum_cont .course li {
 		font-size: 15px;
 	}
 }

 .QandA {
 	width:90%;
 	margin:1rem auto;
 	box-sizing: border-box;
 }

 .QandA p {
 	padding: 0;
 	margin: auto;
 	line-height: 130%;
 }

 .QandA h2 {
 	position:relative;
 	font-weight: bold;
 	font-size: 20px;
 }



 .QandA h2:after {
 	position: absolute;
 	top:0;
 	bottom:0;
 	right: 2rem;
 	width: 24px;
 	height: 24px;
 	margin: auto;
 	font-family:"Font Awesome 5 Free";
 	font-weight: 900;
 	content:"\f107";
 }

 .QandA h2.is-rotate:after {
 	transform:rotate(180deg);
 }


 .question {
 	cursor: pointer;
 	box-sizing: border-box;
 	transition: 0.3s;
 }

 .question p {
 	display: none;
 	line-height: 1.8;
 }

 .float_clear {
 	clear:both;
 }
 .voice-category {
 	margin-right: 0.5rem;
 	padding: 0.5rem 1rem;
 	border-radius: 8px;
 	box-sizing: border-box;
 	background: #ffb637;
 	color: #fff;
 	text-align: center;
 }
 .blog_lg {
  width: 66.5%;
  float: left;
  position: relative;
  height: 600px;
  overflow: hidden;
}

@media screen and (min-width:481px) and ( max-width:768px) {
  .blog_lg {
    height: 360px;
  }
}
@media screen and (max-width: 480px) {
  .blog_lg {
    height: 160px;
  }
}
.blog_sm {
  width: 33.5%;
  float: right;
  position: relative;
  height: 300px;
  overflow: hidden;
}
@media screen and (min-width:481px) and ( max-width:768px) {
  .blog_sm {
    height: 180px;
  }
}
@media screen and (max-width: 480px) {
  .blog_sm {
    height: 80px;
  }
}
.blog_lg img, .blog_sm img {
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 120%;
  height: auto;
  margin: auto;
}
.blog_gradation {
  position: absolute;
  background: linear-gradient(rgba(0, 0, 0, 0) 80%, rgba(0, 0, 0, 0.90) 100%) 50% 50% / 100% 100% no-repeat;
  width: 100%;
  height: 100%;
}
.blog_date {
  width: 95%;
  position: absolute;
  bottom: 5px;
  left: 10px;
  color: #fff;
  font-size: 18px;
  font-weight: bold;
  text-shadow: 1px 1px 1px #000,
  -1px 1px 1px #000,
  1px -1px 1px #000,
  -1px -1px 1px #000;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}
@media screen and (max-width: 480px) {
  .blog_date {
    bottom: 0;
    left: 2px;
    font-size: 11px;
  }
}
a.shadow {
 text-shadow:3px 4px 5px #00ff00;
}
/**************************************
 FOOTER CONTENT
 ***************************************/
 @media screen and (max-width: 480px) {
 	.footerNav {
 		border-bottom: 1px solid #fff;
 	}
 }
 .footerNav a {
 	color: #fff;
 	font-size: 1.4rem;
 }
 .footerNav a:before {
 	top: 0;
 	right: 1.5rem;
 	bottom: 0;
 	display: inline-block;
 	margin-right: 1rem;
 	font-family: "Font Awesome 5 Free";
 	font-weight: 900;
 	content: "\f105";
 	line-height: 1;
 }
 .footerNav li {
 	margin-bottom: 2rem;
 }
 .footer-btn ul {
 	display: -webkit-flex;
 	display: -moz-flex;
 	display: -ms-flex;
 	display: -o-flex;
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-between;
 	align-items: center;
 }
 .footer-btn li {
 	width: 48%;
 	margin-bottom: 1rem;
 }
 @media screen and (max-width: 480px) {
 	.footer-btn li {
 		width: 100%;
 	}
 }
 .footer-btn a {
 	position: relative;
 	display: block;
 	padding: 1.5rem;
 	box-sizing: border-box;
 	background: #fff;
 	color: #4284c5;
 	text-align: center;
 	border-radius: 8px;
 }
 .footer-btn a:after {
 	position: absolute;
 	top: 0;
 	right: 1.5rem;
 	bottom: 0;
 	display: inline-block;
 	width: 2rem;
 	height: 2rem;
 	margin: auto;
 	font-family: "Font Awesome 5 Free";
 	font-weight: 900;
 	content: "\f105";
 	line-height: 1.3;
 	transition: 0.2s;
 }
 .footer-btn a:hover:after {
 	right: 1rem;
 }
 @media screen and (max-width: 768px) {
 	#submenu {
 		display: none;
 	}
 }
/**************************************
 SINGLE NAVIGATION
 ***************************************/
 #nav-below {
 	display: -webkit-flex;
 	display: -moz-flex;
 	display: -ms-flex;
 	display: -o-flex;
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-between;
 	align-items: center;
 	justify-content: center;
 	margin-top: 2rem;
 }
 #nav-below .meta-nav {
 	display: none;
 }
 .single a[rel="prev"], .single a[rel="next"] {
 	display: block;
 	width: 120px;
 	margin: 1rem;
 	padding: 1rem;
 	background: #4284c5;
 	border-radius: 10px;
 	border: 2px solid #4284c5;
 	transition: 0.2s;
 	display: block;
 	font-size: 12px;
 	text-align: center;
 	color: #fff;
 	transition: 0.2s;
 	line-height: 1;
 }
 @media screen and (max-width: 480px) {
 	.single a[rel="prev"], .single a[rel="next"] {
 		width: 100%;
 		margin: 1rem auto;
 	}
 }
 .single a[rel="prev"]:hover, .single a[rel="next"]:hover {
 	background: White;
 	color: #4284c5;
 }
 .single a[rel="prev"]:hover:before, .single a[rel="next"]:hover:before {
 	color: #4284c5;
 	border-bottom: 1px solid #4284c5;
 }
/**************************************
 ARCHIVE CONTENT
 ***************************************/
 .img-frame_news {
 	position: relative;
 	overflow: hidden;
 	width: 200px;
 	height: 120px;
 }
 @media screen and (max-width: 768px) {
 	.img-frame_news {
 		margin: 1rem auto;
 	}
 }
 .img-frame_news img {
 	position: absolute;
 	top: 0;
 	right: 0;
 	bottom: 0;
 	left: 0;
 	width: 120%;
 	height: auto;
 	margin: auto;
 }
 .img-frame_column {
 	position: relative;
 	overflow: hidden;
 	width: 100%;
 	height: 200px;
 }
 .img-frame_column img {
 	position: absolute;
 	top: 0;
 	right: 0;
 	bottom: 0;
 	left: 0;
 	width: 120%;
 	height: auto;
 	margin: auto;
 }
/**************************************
 SLIDER CONTENT
 ***************************************/
 @media screen and (max-width: 480px) {
 	.n2-style-16278aad61440ffdc0dbe139d658aea6-heading {
 		padding: 5px 15px !important;
 		font-size: 1.4rem !important;
 		box-sizing: border-box;
 	}
 }
 .n2-font-f3f51712ffba327f45222eecc7bc2d0a-link a {
 	font-family: 'Noto Sans JP', '游ゴシック体', 'Yu Gothic', YuGothic, 'ヒラギノ角ゴシック Pro', 'Hiragino Kaku Gothic Pro', メイリオ, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif !important;
 }
 @media screen and (max-width: 480px) {
 	.n2-ss-layer {
 		width: 80% !important;
 		margin: 0 0 0.5rem 0 !important;
 		text-align: left;
 	}
 }
/**************************************
 BREADCRUMB CONTENT
 ***************************************/
 .breadcrumbs {
 	margin-bottom: 2rem;
 }
 .breadcrumbs a, .breadcrumbs span {
 	font-size: 1.2rem;
 }
 .entry-box {
 	display: -webkit-flex;
 	display: -moz-flex;
 	display: -ms-flex;
 	display: -o-flex;
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-between;
 	align-items: center;
 	align-items: stretch;
 	margin-bottom: 4rem;
 }
 .entry-box-card {
 	margin-bottom: 1rem;
 	padding: 1rem;
 	border: 1px solid #f4f4f4;
 	box-sizing: border-box;
 }
 .step {
 	margin-bottom: 0.25rem;
 	background: #4284c5;
 	color: #fff;
 	font-size: 1.4rem;
 	text-align: center;
 	border-radius: 20px;
 }
 .form-list {
 	width: 768px;
 	margin: 2rem auto;
 	padding: 2rem;
 	box-sizing: border-box;
 	background: #f5faff;
 }
 @media screen and (max-width: 768px) {
 	.form-list {
 		width: 100%;
 	}
 }
 .form-list li {
 	padding: 2rem 0;
 	box-sizing: border-box;
 	border-bottom: 1px solid #e2e2e2;
 }
 .form-list li:last-child {
 	border-bottom: 0;
 }
 p > a {
 	color: #4284c5;
 }
 .accessmap, .company-tbl {
 	width: 100%;
 	margin-bottom: 4rem;
 	border-collapse: collapse;
 }
 .accessmap th, .company-tbl th, .accessmap td, .company-tbl td {
 	font-size: 1.6rem;
 	padding: 1rem;
 	box-sizing: border-box;
 	border: 1px solid #f4f4f4;
 }
 .accessmap th, .company-tbl th {
 	width: 30%;
 	background: #aad1f6;
 	color: #fff;
 }
@media screen and (max-width: 768px) {
 .accessmap th, .company-tbl th {
 	width: 100%;
	display:block;
 }
 .accessmap td, .company-tbl td{
 	width: 100%!important;
	display:block;
 }	
}	 
 .accessmap td, .company-tbl td {
 	width: 70%;
 }
 .accessmap td > a, .company-tbl td > a {
 	color: #4284c5;
 }
 .accessmap td img, .company-tbl td img {
 	width: 50px;
 	height: 50px;
 }
 .company-box {
 	background: #f5faff;
 	margin: 2rem auto;
 	padding: 4rem;
 	box-sizing: border-box;
 }
 .company-box .l-col3 {
 	padding: 1rem;
 	box-sizing: border-box;
 	border-radius: 10px;
 }
 .company-box a {
 	text-align: center;
 }
 .company-box img {
 	display: block;
 	margin: 0 auto;
 }
 .about-box {
 	margin: 2rem auto;
 	padding: 2rem;
 	box-shadow: 2px 2px 2px rgba(51, 51, 51, 0.15);
 	box-sizing: border-box;
 }
 .about-box img {
 	display: block;
 }
 .about-box ol > li {
 	font-size: 2rem;
 }
 .page-template-blog .l-col3, .category .l-col3, .post-type-archive-column .l-col3 {
 	margin: 1%;
 }
 .page-template-blog a:hover, .category a:hover, .post-type-archive-column a:hover {
 	opacity: 0.8;
 }
 .wp-pagenavi {
 	margin-top: 2rem;
 }
 .post-type-archive-news #content .l-col-box {
 	padding: 1rem 0;
 	border-bottom: 1px dotted #4284c5;
 }
 #news .l-col-box {
 	border-bottom: 1px solid #f4f4f4;
 }
 .message-box {
 	display: -webkit-flex;
 	display: -moz-flex;
 	display: -ms-flex;
 	display: -o-flex;
 	display: flex;
 	flex-wrap: wrap;
 	justify-content: space-between;
 	align-items: center;
 	align-items: stretch;
 	justify-content: center;
 	margin-bottom: 2rem;
 }
 .message-box_l, .message-box_r {
 	width: 50%;
 }
 @media screen and (max-width: 480px) {
 	.message-box_l, .message-box_r {
 		width: 100%;
 	}
 }
 .message-box_l img, .message-box_r img {
 	display: block;
 	width: 100%;
 	height: auto;
 }
 .message-box_txt {
 	position: relative;
 	padding: 4rem;
 	box-sizing: border-box;
 }
 @media screen and (max-width: 768px) {
 	.message-box_txt {
 		padding: 2rem;
 	}
 }
 .message-box_name {
 	position: absolute;
 	bottom: 4rem;
 	left: 4rem;
 }
 @media screen and (max-width: 768px) {
 	.message-box_name {
 		bottom: 2rem;
 		left: 2rem;
 	}
 }
 @media screen and (max-width: 480px) {
 	.message-box_name {
 		position: static;
 	}
 }
 @media screen and (max-width: 480px) {
 	.bg_campus .space {
 		margin: 0.25rem;
 	}
 }
/**************************************
 BACKGROUND MODULE
 ***************************************/
 .bg_main {
 	background: transparent url('images/bg_main01.png') center bottom no-repeat;
 	background-size: cover;
 }
 .bg_style {
 	background: transparent url('images/bg_style.png') center bottom no-repeat;
 	background-size: cover;
 }
 .bg_campus {
 	background: transparent url('images/bg_campus.png') center bottom no-repeat;
 	background-size: cover;
 }
 .bg_l-gray {
 	background: #f4f4f4;
 }
 .bg_gradient {
 	background: -webkit-linear-gradient(-90deg, #f5faff, #00999F);
 	background: linear-gradient(-90deg, #f5faff, #00999F);
 }
 .bg_footer {
 	background: -webkit-linear-gradient(90deg, #39a5dd, #2c8fc3);
 	background: linear-gradient(90deg, #39a5dd, #2c8fc3);
 }
 .bg_social {
 	background: transparent url('images/bg_social.png') center bottom no-repeat;
 	background-size: cover;
 }
 .bg_l-blue {
 	background: #00999F;
 }
 .bg_gradient_t {
 	background: #f5faff !important;
 }
 .bg_white {
 	background: #fff;
 }
 .bg_red {
 	background: #e25d6a;
 }
/**************************************
 SECTION TITLE MODULE
 ***************************************/
 .section-ttl_lg {
 	display: block;
 	padding: 1rem 0;
 	font-size: 3rem;
 	font-weight: 700;
 	text-align: center;
 	letter-spacing: 5px;
 }
 @media screen and (max-width: 480px) {
 	.section-ttl_lg {
 		font-size: 2.4rem;
 	}
 }
 .section-ttl_lg span {
 	margin-left: 1rem;
 	font-size: 2rem;
 }
 @media screen and (max-width: 480px) {
 	.section-ttl_lg span {
 		font-size: 1.4rem;
 	}
 }
 .section-ttl_md {
 	display: block;
 	padding: 1rem 0;
 	color: #4284c5;
 	font-size: 3rem;
 	font-weight: 700;
 	text-align: center;
 }
 @media screen and (max-width: 480px) {
 	.section-ttl_md {
 		font-size: 2.4rem;
 	}
 }
 .section-ttl_sm {
 	display: block;
 	font-size: 1.8rem;
 	font-weight: 700;
 	text-align: left;
 	line-height: 1.5;
 }
 .section-ttl_sub {
 	margin-bottom: 3rem;
 	font-size: 1.4rem;
 	text-align: center;
 }
/**************************************
 BUTTON MODULE
 ***************************************/
 .btn {
 	display: block;
 	padding: 1rem;
 	margin: 0.5rem;
 	text-align: center;
 	box-sizing: border-box;
 }
 .btn_red {
 	display: block;
 	width: 180px;
 	padding: 1.5rem;
 	border: 2px solid #e25d6a;
 	background: #e25d6a;
 	color: #fff;
 	border-radius: 50px;
 	box-sizing: border-box;
 	transition: 0.2s;
 }
 .btn_red:hover {
 	background: #fff;
 	color: #e25d6a;
 	opacity: 1;
 }
 .btn_orange {
 	display: block;
 	width: 100px;
 	padding: 1.5rem;
 	background: #ffb637;
 	border: 2px solid #ffb637;
 	color: #fff;
 	border-radius: 50px;
 	box-sizing: border-box;
 	transition: 0.2s;
 }
 .btn_orange:hover {
 	background: #fff;
 	color: #ffb637;
 	opacity: 1;
 }
 .btn_green {
 	display: block;
 	width: 100px;
 	padding: 1.5rem;
 	border: 2px solid #00a968;
 	background: #00a968;
 	color: #fff;
 	border-radius: 50px;
 	box-sizing: border-box;
 	transition: 0.2s;
 }
 .btn_green:hover {
 	background: #fff;
 	color: #00a968;
 	opacity: 1;
 }
 .btn_gradient {
 	width: 320px;
 	margin: 1rem auto;
 	padding: 1.5rem;
 	border-radius: 50px;
 	background: -webkit-linear-gradient(90deg, #39a5dd, #2c8fc3);
 	background: linear-gradient(90deg, #39a5dd, #2c8fc3);
 	color: #fff;
 	font-size: 2rem;
 }
 @media screen and (max-width: 480px) {
 	.btn_gradient {
 		width: 90%;
 	}
 }
 .btn_gradient_hvr {
 	transition: 0.2s;
 }
 .btn_gradient_hvr:hover {
 	color: #4284c5;
 	background: #fff;
 	opacity: 1;
 }
 .btn_more {
 	border-radius: 8px;
 }
 .btn_moreread {
 	display: block;
 	width: 60%;
 	padding: 0.5rem 1rem;
 	color: #fff;
 	background: -webkit-linear-gradient(90deg, #39a5dd, #2c8fc3);
 	background: linear-gradient(90deg, #39a5dd, #2c8fc3);
 	box-sizing: border-box;
 	border-radius: 30px;
 	text-align: center;
 }
 @media screen and (max-width: 480px) {
 	.btn_moreread {
 		width: 100%;
 	}
 }
 .btn_news {
 	width: 160px;
 	border: 2px solid #4284c5;
 	color: #fff;
 	text-align: center;
 	border-radius: 50px;
 	font-size: 1.4rem;
 	box-sizing: border-box;
	background-color: #4284c5;
 }
 @media screen and (max-width: 480px) {
 	.btn_news {
 		width: 100%;
 		margin: 0;
 		float: none !important;
 	}
 }
 .btn_news:after {
 	line-height: 1.5 !important;
 }
/**************************************
 TEXTCOLOR MODULE
 ***************************************/
.white {
  color: #fff;
}
.gradient {
  color: #4284c5;
}
.red {
  color: #e25d6a;
}
/**************************************
 ARROW MODULE
 ***************************************/
 .arrow_before:before {
 	display: inline-block;
 	margin-right: 1rem;
 	font-family: "Font Awesome 5 Free";
 	font-weight: 900;
 	content: "\f105";
 }
 .arrow_before_r:before {
 	display: inline-block;
 	margin-right: 1rem;
 	padding: 0 0.75rem;
 	border-radius: 100px;
 	background: -webkit-linear-gradient(90deg, #39a5dd, #2c8fc3);
 	background: linear-gradient(90deg, #39a5dd, #2c8fc3);
 	color: #fff;
 	font-family: "Font Awesome 5 Free";
 	font-size: 1.2rem;
 	font-weight: 900;
 	content: "\f105";
 	-webkit-background-clip: none;
 	-webkit-text-fill-color: #fff;
 }
 .arrow_after {
 	position: relative;
 }
 .arrow_after:after {
 	position: absolute;
 	top: 0;
 	right: 1.5rem;
 	bottom: 0;
 	display: inline-block;
 	width: 2rem;
 	height: 2rem;
 	margin: auto;
 	font-family: "Font Awesome 5 Free";
 	font-weight: 900;
 	content: "\f105";
 	line-height: 1;
 	transition: 0.2s;
 }
 .arrow_after:hover:after {
 	right: 1rem;
 }

input[size="60"], textarea[cols="70"] {
	width: 60%;
}
input[size="70"], textarea[cols="70"] {
	width: 70%;
}

/**************************************
 ORDER MODULE
 ***************************************/
 @media screen and (max-width: 768px) {
 	.od1 {
 		order: 1;
 	}
 }
 @media screen and (max-width: 768px) {
 	.od2 {
 		order: 2;
 	}
 }
/**************************************
 ETC MODULE
 ***************************************/
 span.date {
 	margin-right: 1rem;
 	margin-bottom: 1rem;
 	color: #4284c5;
 	font-size: 1.4rem;
 	font-weight: 700;
 }
 @media screen and (max-width: 480px) {
 	span.date {
 		display: block;
 	}
 }
 .section-card {
 	background: rgba(255, 255, 255, 0.8);
 }
 .space {
 	margin: 1rem;
 	box-sizing: border-box;
 }
 @media screen and (max-width: 480px) {
 	.space {
 		/* margin: 0.25rem; */
 	}
 }
 address {
 	padding: 0.5rem 0;
 	font-size: 1.4rem;
 	font-style: normal;
 	text-align: center;
 }
 .img-center {
 	display: block;
 	text-align: center;
 	margin: 0 auto;
 }
 .box-txt {
 	padding: 1.5rem;
 	box-sizing: border-box;
 }
 .box-txt {
 	word-break: break-all;
 }
 .box-bd {
 	margin: 2rem 0;
 	padding: 2rem 1rem;
 	border-top: 1px solid #333;
 	border-bottom: 1px solid #333;
 	box-sizing: border-box;
 }
 .box-bd_white {
 	padding: 3rem 0;
 	border-top: 1px solid #fff;
 	border-bottom: 1px solid #fff;
 }
 .box-bb_white {
 	border-bottom: 1px solid #fff;
 }
 .sns:before {
 	display: inline-block;
 	width: 22px;
 	height: 20px;
 	margin-right: 1rem;
 	text-align: center;
 	vertical-align: middle;
 	content: "";
 }
 .twitter:before {
 	background: transparent url('images/twitter.png') center no-repeat;
 }
 .instagram:before {
 	background: transparent url('images/instagram.png') center no-repeat;
 }
 .facebook:before {
 	background: transparent url('images/facebook.png') center no-repeat;
 }
 .line:before {
 	background: transparent url('images/line.png') center no-repeat;
 }
/* Start Instagramリンクの追加に伴い、margin: 0 20px; から margin: 0 10px;に変更 2022/09/21 鹿子沢 */
li.footer_sns {
  margin: 0 10px;
}
/* End Instagramリンクの追加に伴い、margin: 0 20px; から margin: 0 10px;に変更 2022/09/21 鹿子沢 */
@media screen and (max-width: 480px) {
  li.footer_sns {
    margin: auto;
    width: 49%;
  }
  li.footer_sns img {
    width: 100%;
  }
}
 .fadein {
 	opacity: 0;
 	transform: translate(0, 50px);
 	transition: all 0.5s;
 }
 .fadein.scrollin {
 	opacity: 1;
 	transform: translate(0, 0);
 }
/**************************************
 SUBPAGE MODULE
 ***************************************/
 .page-ttl_lg {
 	display: block;
 	margin: 2rem 0;
 	padding: 1rem 0;
 	border-bottom: 2px solid #4284c5;
 	font-size: 2.4rem;
 	font-weight: 700;
 	text-align: left;
	color: #11376b;
 }
 @media screen and (max-width: 480px) {
 	.page-ttl_lg {
 		font-size: 2rem;
 	}
 }
 .page-ttl_md {
 	display: block;
 	margin: 0 0 1rem;
 	padding: 1rem 0;
 	color: #4284c5;
 	border-bottom: 1px dotted #aad1f6;
 	font-size: 2rem;
 	font-weight: 700;
 	text-align: left;
 }
 @media screen and (max-width: 480px) {
 	.page-ttl_md {
 		font-size: 1.6rem;
 	}
 }
 .page-ttl_sm {
 	display: block;
 	margin: 0 0 1rem;
 	padding: 1rem 0;
 	color: #4284c5;
 	border-top: 1px dotted #aad1f6;
 	border-bottom: 1px dotted #aad1f6;
 	font-size: 1.8rem;
 	text-align: center;
 }
 @media screen and (max-width: 480px) {
 	.page-ttl_sm {
 		font-size: 1.6rem;
 	}
 }
 .notice {
 	color: #f00;
 	font-size: 1.2rem;
 }
 .require {
 	display: inline-block;
 	padding: 0 0.25rem;
 	color: #f00;
 	font-size: 1.2rem;
 	border: 1px solid #f00;
 	vertical-align: middle;
 }
 .etc {
 	font-size: 1.2rem;
 	color: gray;
 }
 .area {
 	display: inline-block;
 	padding: 1rem;
 	margin-right: 1rem;
 	background: #ffb637;
 	color: white;
 	font-size: 1.4rem;
 	text-align: center;
 	box-sizing: border-box;
 	vertical-align: middle;
 }
 .form-tel {
 	display: inline-block;
 	color: #4284c5;
 	font-size: 3rem;
 	vertical-align: middle;
 	font-weight: 700;
 }
 input, textarea {
 	margin-top: 5px;
 	padding: 0.5rem;
 	box-sizing: border-box;
 	border: 1px solid #e2e2e2;
 }
 label {
 	margin-top: 5px;
 }
 @media screen and (max-width: 768px) {
 	input[name="name"], input[name="kana"], input[name="age"], input[name="email"], input[name="address1"], input[name="address2"], input[name="questionnaire-etc"], textarea {
 		width: 100%;
 		box-sizing: border-box;
 	}
 }
 input[type="submit"] {
 	display: block;
 	width: 240px;
 	margin: 0.5rem auto;
 	padding: 2rem;
 	border: 0;
 	background: #4284c5;
 	color: #fff;
 	font-size: 2rem;
 	box-sizing: border-box;
 }
 .page #content h2.section-ttl_lg, .post-type-archive-voice #content h2.section-ttl_lg {
 	padding-top: 2rem;
 }
 .page #content h2.section-ttl_lg:after, .post-type-archive-voice #content h2.section-ttl_lg:after {
 	display: block;
 	width: 80px;
 	margin: 2rem auto;
 	text-align: center;
 	border-bottom: 4px solid #4284c5;
 	content: "";
 }
 .page #content h2.section-ttl_lg.red:after, .post-type-archive-voice #content h2.section-ttl_lg.red:after {
 	border-bottom: 4px solid #e25d6a;
 }
 p > strong {
 	border-bottom: 2px solid #4284c5;
 }
 h1.section-ttl_lg {
 	font-size: 4.5rem;
 }
 @media screen and (max-width: 480px) {
 	h1.section-ttl_lg {
 		font-size: 2.8rem;
 	}
 }
 .bd-box {
 	padding: 4rem;
 	border: 2px solid #4284c5;
 	box-sizing: border-box;
 }
 @media screen and (max-width: 768px) {
 	.bd-box {
 		padding: 2rem;
 	}
 }
 @media screen and (max-width: 480px) {
 	.bd-box {
 		padding: 1rem;
 	}
 }
/**************************************
 Margin Padding Module
 ***************************************/
 /******* Margin *******/
 .u-mt1r {
 	margin-top: 1rem;
 }
 .u-mr1r {
 	margin-right: 1rem;
 }
 .u-mb1r {
 	margin-bottom: 1rem;
 }
 .u-ml1r {
 	margin-left: 1rem;
 }
 .u-mt2r {
 	margin-top: 2rem;
 }
 .u-mr2r {
 	margin-right: 2rem;
 }
 .u-mb2r {
 	margin-bottom: 2rem;
 }
 .u-ml2r {
 	margin-left: 2rem;
 }
 .u-mt4r {
 	margin-top: 4rem;
 }
 .u-mr4r {
 	margin-right: 4rem;
 }
 .u-mb4r {
 	margin-bottom: 4rem;
 }
 .u-ml4r {
 	margin-left: 4rem;
 }
 /******* Padding *******/
 .u-pt1r {
 	padding-top: 1rem;
 }
 .u-pr1r {
 	padding-right: 1rem;
 }
 .u-pb1r {
 	padding-bottom: 1rem;
 }
 .u-pl1r {
 	padding-left: 1rem;
 }
 .u-pt2r {
 	padding-top: 2rem;
 }
 .u-pr2r {
 	padding-right: 2rem;
 }
 .u-pb2r {
 	padding-bottom: 2rem;
 }
 .u-pl2r {
 	padding-left: 2rem;
 }
 .u-pt4r {
 	padding-top: 4rem;
 }
 .u-pr4r {
 	padding-right: 4rem;
 }
 .u-pb4r {
 	padding-bottom: 4rem;
 }
 .u-pl4r {
 	padding-left: 4rem;
 }
 .u-mt0 {
 	margin-top: 0;
 }
 .u-mb0 {
 	margin-bottom: 0;
 }
 .u-pt0 {
 	padding-top: 0;
 }
 .u-pb0 {
 	padding-bottom: 0;
 }
/**************************************
 Text Module
 ***************************************/
 .u-ta-l {
 	text-align: left;
 }
 .u-ta-c {
 	text-align: center;
 }
 .u-ta-r {
 	text-align: right;
 }
/**************************************
 Float Module
 ***************************************/
 .u-fl-l {
 	float: left;
 }
 .u-fl-r {
 	float: right;
 }
 .u-fl-n {
 	float: none;
 }
/**************************************
 Position Module
 ***************************************/
 .u-po-r {
 	position: relative;
 }
 .u-po-f {
 	position: fixed;
 }
/**************************************
 Flex Module
 ***************************************/
 .u-flex {
 	display: -webkit-flex;
 	display: -moz-flex;
 	display: -ms-flex;
 	display: -o-flex;
 	display: flex;
 }
 .u-jc-fs {
 	justify-content: flex-start;
 }
 .u-jc-c {
 	justify-content: center;
 }
 @media screen and (max-width: 768px) {
 	.u-jc-c_m {
 		justify-content: center;
 	}
 }
 .u-ai-str {
 	align-items: stretch;
 }
 .u-ai-fs {
 	align-items: flex-start;
 }
/**************************************
 Clear Fix
 ***************************************/
 .u-clr {
 	clear: both;
 }
/**************************************
 Overflow Module
 ***************************************/
 .u-hidden {
 	overflow: hidden;
 }
 .u-hidden-x {
 	overflow-x: hidden;
 }
 .u-hidden-y {
 	overflow-y: hidden;
 }
 .u-of-auto {
 	overflow: auto;
 }
 @media screen and (max-width: 768px) {
 	.u-w-a {
 		width: auto;
 	}
 }
 .u-fs-i {
 	font-style: italic;
 }
 .box-shadow {
 	box-shadow: 2px 2px 4px rgba(51, 51, 51, 0.1);
 }
 .u-db {
 	display: block;
 }
 /* Float Shadow */
 .hvr-float-shadow {
 	display: inline-block;
 	vertical-align: middle;
 	-webkit-transform: perspective(1px) translateZ(0);
 	transform: perspective(1px) translateZ(0);
 	box-shadow: 0 0 1px rgba(0, 0, 0, 0);
 	position: relative;
 	-webkit-transition-duration: 0.3s;
 	transition-duration: 0.3s;
 	-webkit-transition-property: transform;
 	transition-property: transform;
 }
 .hvr-float-shadow:before {
 	pointer-events: none;
 	position: absolute;
 	z-index: -1;
 	content: '';
 	top: 100%;
 	left: 5%;
 	height: 10px;
 	width: 90%;
 	opacity: 0;
 	background: -webkit-radial-gradient(center, ellipse, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
 	background: radial-gradient(ellipse at center, rgba(0, 0, 0, 0.35) 0%, rgba(0, 0, 0, 0) 80%);
 	/* W3C */
 	-webkit-transition-duration: 0.3s;
 	transition-duration: 0.3s;
 	-webkit-transition-property: transform, opacity;
 	transition-property: transform, opacity;
 }
 .hvr-float-shadow:hover, .hvr-float-shadow:focus, .hvr-float-shadow:active {
 	-webkit-transform: translateY(-5px);
 	transform: translateY(-5px);
 	/* move the element up by 5px */
 }
 .hvr-float-shadow:hover:before, .hvr-float-shadow:focus:before, .hvr-float-shadow:active:before {
 	opacity: 1;
 	-webkit-transform: translateY(5px);
 	transform: translateY(5px);
 	/* move the element down by 5px (it will stay in place because it's attached to the element that also moves up 5px) */
 }

/**************************************
 /TOP スライダー上文言
 ***************************************/
 @media screen and (min-width: 768px) {
 	.n2-ss-img-wrapper {
 		margin-top: -100px;
 		margin-left: 100px;
 	}
 	.n2-ss-button-container {
 		margin-left: 100px;
 	}
 }

 .n2-ss-button-container a {
 	color: #fff !important;
 	background-color: #2c8fc3 !important;
 }
 .n2-ss-button-container a:hover {
 	color: #2c8fc3 !important;
 	background-color: #fff !important;
 }

/**************************************
 MTS Simple Booking CSS　井上カスタマイズ
 ***************************************/
/* 全体設定 */
table,
td,
th {
    border-collapse: collapse;
    border:1px solid silver;
}

/*******************
 カレンダーページ
 *******************/
/* カレンダー背景色（月～金） */
.week-title.mon,
.week-title.tue,
.week-title.wed,
.week-title.thu,
.week-title.fri {
	background-color: #F0F0EE;
}
/* カレンダー背景色（土曜日） */
.week-title.sat,
.day-box.sat{
	background-color: #E6FAFF;
}
/* カレンダー背景色（日曜日） */
.week-title.sun,
.day-box.sun{
	background-color: #FFF1F6;
}
/* カレンダーヘッダー余白設定 */
tr.header-row th {
	padding: 15px;
}

/* 前月、次月リンクボタンの文字サイズ */
.monthly-prev-next .monthly-prev,
.monthly-prev-next .monthly-next {
	font-size: 1.6rem;
}

/* 祝日指定のコメント文字色 */
td.holiday .schedule-note {
	color:#ff6347;
}
/* 祝日の背景色 */
td.holiday {
	background-color: #FFF1F6;
}

/*******************
 時間帯指定ページ
 *******************/
/* テーブル装飾 */
table.mtssb-timetable-link{
  border-collapse: separate;
  border-spacing: 0px 5px;
  margin: 0 auto;
}
table.mtssb-timetable-link td,th{
  padding: 10px;
}
table.mtssb-timetable-link th{
  background: #10a0e0;
  color: #fff;
}
table.mtssb-timetable-link td{
  background: #f1fafe;
}
/* 戻るボタンセンター表示 */
.mtssb-daily-action {
	text-align:center;
}
/*******************
 申込ページ
 *******************/
/* テーブル装飾 */
.content-form table{
  border-collapse: separate;
  border-spacing: 0px 5px;
  margin: 0 auto;
}
.content-form table td,th{
  padding: 10px;
}
.content-form table th{
  background: #10a0e0;
  color: #fff;
	font-size: 1.2rem;
	vertical-align: middle;
	text-align:center;
}
.content-form table td{
  background: #f1fafe;
		font-size: 1.2rem;
}
.content-form legend{
	font-size: 1.6rem;
}
/* 確定ボタン色設定 */
.content-form button.cls_submit_btn {
  display       : inline-block;
  border-radius : 5%;          /* 角丸       */
  font-size     : 11pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 12px 33px;   /* 余白       */
  background    : #4da6ff;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 3px 3px 3px #666666;  /* 影の設定 */
  border        : 2px solid #4da6ff;    /* 枠の指定 */
  margin-left   : 15px;   /* 余白       */
}
.content-form button.cls_submit_btn:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #4da6ff;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}
/* 戻るボタン色設定 */
.mtssb-daily-action button.back_btn,
.content-form button.back_btn {
  display       : inline-block;
  border-radius : 5%;          /* 角丸       */
  font-size     : 11pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
  padding       : 12px 33px;   /* 余白       */
  background    : #999999;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 3px 3px 3px #666666;  /* 影の設定 */
  border        : 2px solid #999999;    /* 枠の指定 */
}
.mtssb-daily-action button.back_btn:hover,
.content-form button.back_btn:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #999999;     /* 背景色     */
  background    : #ffffff;     /* 文字色     */
}

/*******************
 見出し装飾
 *******************/
h1.title_style01 {
position: relative;
background: #dfefff;
box-shadow: 0px 0px 0px 5px #dfefff;
border: dashed 2px white;
padding: 0.2em 0.5em;
color: #454545;
}

h1.title_style01:after{
position: absolute;
content: '';
left: -7px;
top: -7px;
border-width: 0 0 15px 15px;
border-style: solid;
border-color: #fff #fff #a8d4ff;
box-shadow: 1px 1px 1px rgba(0, 0, 0, 0.15);
}

h1.title_style02 {
color: #6cb4e4;
text-align: center;
padding: 0.25em;
border-top: solid 2px #6cb4e4;
border-bottom: solid 2px #6cb4e4;
background: -webkit-repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
background: repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
}

h1.title_style03 {
background: linear-gradient(transparent 70%, #a7d6ff 70%);
}

h1.title_style04 {
position: relative;
padding: 5px 5px 5px 42px;
background: #77c3df;
font-size: 20px;
color: white;
margin-left: -33px;
line-height: 1.3;
z-index:-1;
}

h1.title_style04:before {
position: absolute;
content: '';
left: -2px;
top: -2px;
border: none;
border-left: solid 40px white;
border-bottom: solid 79px transparent;
z-index:-2
}


/*追加：スクール一覧の申込フォームボタン*/
  .testVisual-item {
 	top: 0;
 	right: 0;
 	bottom: 0;
	 width :350px;
 }

 .testVisual-item a {
 	display: block;
 	background: #2c8fc3;
 	color: #fff;
 	text-align: center;
 	font-size: 2.0rem;
 	border-radius: 15px;
 	transition: 0.2s;
 }

 .testVisual-item a:hover {
 	background: #fff;
 	color: #2c8fc3;
 }
/**/


/* 追加：Twitter広告用　人生で一番成長を感じた3ヶ月でした。記事 */
/*ページ上部：オレンジ枠*/
h1.twitter_style {
    background: #fffaf4;
    border-left: solid 5px #ffaf58;
	border-bottom: 0px;
}
/*ゼロスク文字アンダーライン*/
.under {
    background: linear-gradient(transparent 50%, #a8eaff 50%);
}
/*ページ中部：水色枠*/
h2.twitter_style {
    position: relative;
    color: black;
    background: #d0ecff;
    line-height: 1.4;
    padding: 0.25em 0.5em;
    margin: 2em 0 0.5em;
    border-radius: 0 5px 5px 5px;
    border-bottom: 0px;
}
/*水色枠上check文字*/
h3.twitter_style:after {
    position: absolute;
    font-family: "Font Awesome 5 Free",'Quicksand','Avenir','Arial',sans-serif;
    content: '✔ Check';
    background: #2196F3;
    color: #fff;
    left: 0px;
    bottom: 100%;
    border-radius: 5px 5px 0 0;
    padding: 3px 7px 1px;
    font-size: 0.7em;
    line-height: 1;
    letter-spacing: 0.05em;
}

.flash{
  animation: flash 1s ease infinite alternate;
  color: #ffea00;
  -webkit-text-stroke: 1px #000;
}

@keyframes flash {
  50% {
    opacity: 0;
  }
}

/* k_inoue コラム用　hタグ装飾 */
h3.column {
  border-bottom: solid 3px #cce4ff;
  position: relative;
  font-size: 2.4rem;
  font-weight: 700;
}

h3.column:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #5472cd;
  bottom: -3px;
  width: 20%;
}

/**/

/* 星テスト */
 .page-ttl_lg222 {
    display: block;
 	margin: 2rem 0;
 	padding: 1rem 0;
 	border-bottom: 2px solid #4284c5;
 	font-size: 3rem;
 	font-weight: 700;
 	text-align: left;
 }
 @media screen and (max-width: 480px) {
 	.page-ttl_lg222 {
 		font-size: 2rem;
 	}
 }
 .l-col2_md222 {
  width: 46.5%;
 }
 @media screen and (max-width: 768px) {
 	.l-col2_m222 {
 		width: 50%;
 	}
 }
/*画像に影つける*/
.basic_boxshadw222 {
  box-shadow: 0 10px 25px 0 rgba(0, 0, 0, .5);
}

/**/

/* 中川テスト */
h1.title_style055 {
font-size: 160%;
position: relative;
background: #dfefff;
box-shadow: 0px 0px 0px 5px #dfefff;
border: dashed 2px white;
padding: 0.2em 0.5em;
color: #454545;
}

h3.title_style066 {
 	display: block;
 	margin: 2rem 0;
 	padding: 1rem 0;
 	font-size: 2.4rem;
 	font-weight: 700;
 	text-align: center; 
 }

.select-mwform-single-field {
display: block;
white-space: nowrap;
float: left;
}

/* 見出し用hタグ装飾 */
h1.column_style001 {
  border-bottom: solid 3px #cce4ff;
  position: relative;
  font-size: 2.4rem;
  font-weight: 700;
}

h1.column_style001:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #5472cd;
  bottom: -3px;
  width: 20%;
}

h2.column_style002 {
  border-bottom: solid 3px #cce4ff;
  position: relative;
  font-size: 2.4rem;
  font-weight: 700;
}

h2.column_style002:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 3px #5472cd;
  bottom: -3px;
  width: 20%;
}

/* 中川テストここまで */

/* パンフレット スタイル用 Start */
h1.title_style056 {
  font-size: 3rem;
  font-weight: 700;
  color: #6cb4e4;
  text-align: center;
  padding: 0.25em;
  border-top: solid 2px #6cb4e4;
  border-bottom: solid 2px #6cb4e4;
  background: -webkit-repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
  background: repeating-linear-gradient(-45deg, #f0f8ff, #f0f8ff 3px,#e9f4ff 3px, #e9f4ff 7px);
}

a.btn-gradient-t1 {
  font-size: 2.0rem;
  font-weight: 700;
  line-height: 1.5;
/*   position: relative; */
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
	
  -webkit-transform: skew(-15deg);
  transform: skew(-15deg);
  color: #fff;
  border-radius: 20px;
  background-image: -webkit-gradient(linear, left top, right top, from(#2af598), to(#009efd));
  background-image: -webkit-linear-gradient(left, #2af598 0%, #009efd 100%);
  background-image: linear-gradient(90deg, #2af598 0%, #009efd 100%);
  -webkit-box-shadow: 0 5px 10px rgba(0, 0, 0, .1);
  box-shadow: 0 5px 10px rgba(0, 0, 0, .1);
}

a.btn-gradient-t1:hover {
  -webkit-transform: skew(0);
  transform: skew(0);
  color: #fff;
  -webkit-box-shadow: 0 2px 3px rgba(0, 0, 0, .1);
  box-shadow: 0 2px 3px rgba(0, 0, 0, .1);
}
/* パンフレット スタイル用 End */

/* パンフレット閲覧ページ カレンダーリンク用　Start*/
.pnf_calendar {
  display       : inline-block;
/*  border-radius : 5%;          /* 角丸       */
 /* font-size     : 18pt;        /* 文字サイズ */
  text-align    : center;      /* 文字位置   */
  cursor        : pointer;     /* カーソル   */
/*   padding       : 12px 12px;   /* 余白       */
  background    : #1affe0;     /* 背景色     */
  color         : #ffffff;     /* 文字色     */
  line-height   : 1em;         /* 1行の高さ  */
  transition    : .3s;         /* なめらか変化 */
  box-shadow    : 6px 6px 3px #666666;  /* 影の設定 */
  border        : 2px solid #000066;    /* 枠の指定 */
  border-radius : 20px 10px 20px 10px;    /* 角丸の指定 */

}
.pnf_calendar:hover {
  box-shadow    : none;        /* カーソル時の影消去 */
  color         : #000066;     /* 背景色     */
  background    : #99ffff;     /* 文字色     */
}

@media (max-width: 500px) {
	a.pnf_calendar {
        height: 50%;
		width: 50%;
	}
}
.mgr-5{
    margin-right : 5px;
}
/* パンフレット閲覧ページ カレンダーリンク用　End*/

/* デザイン 文字点滅用 Start */
.flash-shaping{
  	display: inline-block;
    width: 50px;
    height: 50px;
    line-height: 50px;
}

.flash-new{
  animation: flash 1s linear infinite;
  color:#0091EA;
  height: 20px;
}

@keyframes flash {
  0%,35%,60%,100%{
    opacity: 0;
  }

  25%{
    opacity: 1;
    color:#7fff00;
  }
  
  50%{
    opacity: 1;
    color:#0091EA;
  }
  
  75%{
    opacity: 1;
    color:#ff1493;
  }
  
}

.bounce {
  animation: bounce 0.5s infinite;
}

@keyframes bounce {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-10px);
  }
  100% {
    transform: translateY(0);
  }
}
/* デザイン 文字点滅用 End */

/* 中川 スライド導入START */
.csslider1 {
  display: inline-block;
  position: relative;
  max-width: 960px;  
  width: 100%;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
}
.csslider1 > .cs_anchor {
  display: none;
}
.csslider1 > ul {
  position: relative;
  z-index: 1;
  font-size: 0;
  line-height: 0;
  margin: 0 auto;
  padding: 0;
  
  overflow: hidden;
  white-space: nowrap;
}
.csslider1 > ul > li.img img {
  width: 100%;
}
.csslider1 > ul > li.img {
  font-size: 0pt;

  -khtml-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.csslider1 > ul > li {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  font-size: 15px;
  font-size: initial;
  line-height: normal;
  white-space: normal;
  vertical-align: top;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  -o-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.csslider1 .cs_lnk{
  position: absolute;
  top: -9999px;
  left: -9999px;
  font-size: 0pt;
  opacity: 0;
  filter: alpha(opacity=0);
}.csslider1 > .cs_arrowprev,
.csslider1 > .cs_arrownext {
  position: absolute;
  top: 50%;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;

  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 5;
}
.csslider1 > .cs_arrowprev > label,
.csslider1 > .cs_arrownext > label {
  position: absolute;

  text-decoration: none;
  cursor: pointer;
  opacity: 0;
  z-index: -1;
}
.csslider1 > .cs_arrowprev {
  left: 0;
}
.csslider1 > .cs_arrownext {
  right: 0;
}

.csslider1 > .cs_arrowprev > label.num4,
.csslider1 > .cs_arrownext > label.num1 {
  opacity: 1;
  z-index: 5;
}
.csslider1 > .slide:checked ~ .cs_arrowprev > label,
.csslider1 > .slide:checked ~ .cs_arrownext > label {
  opacity: 0;
  z-index: -1;
}

.csslider1 > #cs_slide1_0:checked ~ .cs_arrowprev > label.num4,
.csslider1 > #cs_slide1_0:checked ~ .cs_arrownext > label.num1, 
.csslider1 > #cs_slide1_1:checked ~ .cs_arrowprev > label.num0,
.csslider1 > #cs_slide1_1:checked ~ .cs_arrownext > label.num2, 
.csslider1 > #cs_slide1_2:checked ~ .cs_arrowprev > label.num1,
.csslider1 > #cs_slide1_2:checked ~ .cs_arrownext > label.num3,
.csslider1 > #cs_slide1_3:checked ~ .cs_arrowprev > label.num2,
.csslider1 > #cs_slide1_3:checked ~ .cs_arrownext > label.num4,
.csslider1 > #cs_slide1_4:checked ~ .cs_arrowprev > label.num3,
.csslider1 > #cs_slide1_4:checked ~ .cs_arrownext > label.num0{
  opacity: 1;
  z-index: 5;
}

.csslider1.cs_pauseHover:hover > .cs_arrowprev > label,
.csslider1 > #cs_pause1:checked ~ .cs_arrowprev > label,
.csslider1.cs_pauseHover:hover > .cs_arrownext > label,
.csslider1 > #cs_pause1:checked ~ .cs_arrownext > label {
  -webkit-animation-play-state: paused !important;
  -moz-animation-play-state: paused !important;
  -ms-animation-play-state: paused !important;
  -o-animation-play-state: paused !important;
  animation-play-state: paused !important;
}


/* /calculate autoplay */
.csslider1 > .cs_bullets {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 6;
  font-size: 0;
  line-height: 8pt;
  text-align: center;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.csslider1 > .cs_bullets > div {
  margin-left: -50%;
  width: 100%;
}
.csslider1 > .cs_bullets > label {
  position: relative;
  display: inline-block;
  cursor: pointer;
}
.csslider1 > .cs_bullets > label > .cs_thumb {
  visibility: hidden;
  position: absolute;
  opacity: 0;
  z-index: 1;
  line-height: 0;
  left: -44px;
  top: -48px;
}
.csslider1 > ul > li {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-block;
  opacity: 0;
  z-index: 1;
    
}

.csslider1 > ul > li.num0 {
  opacity: 1;
  z-index: 2;
}
.csslider1 > .slide:checked ~ ul > li.num0 {
  opacity: 0;
  z-index: 1;
}

.csslider1 > #cs_slide1_0:checked ~ ul > li.num0,.csslider1 > #cs_slide1_1:checked ~ ul > li.num1,.csslider1 > #cs_slide1_2:checked ~ ul > li.num2,.csslider1 > #cs_slide1_3:checked ~ ul > li.num3,.csslider1 > #cs_slide1_4:checked ~ ul > li.num4 {
  opacity: 1;
  -webkit-transform: scale(1) translate(0, 0);
  -moz-transform: scale(1) translate(0, 0);
  -ms-transform: scale(1) translate(0, 0);
  -o-transform: scale(1) translate(0, 0);
  transform: scale(1) translate(0, 0);
  
  z-index: 2;
}

.csslider1 > .cs_arrowprev,
.csslider1 > .cs_arrownext,
.csslider1 > .cs_play_pause {
  opacity: 0;
}
.csslider1:hover > .cs_arrowprev,
.csslider1:hover > .cs_arrownext,
.csslider1:hover > .cs_play_pause {
  opacity: 1;
  -webkit-transform: rotateX(0deg);
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  -o-transform: rotateX(0deg);
  transform: rotateX(0deg);
  
}.csslider1 > .cs_arrowprev > label,
.csslider1 > .cs_arrownext > label {
  overflow: hidden;
  margin-top: -35px;
  width: 40px;
  height: 70px;

  /* Fallback for web browsers that doesn't support RGBa */
  background: #000;
  background-color: rgba(0,0,0,0.6);

  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.csslider1 > .cs_arrowprev {
  left: 70px;
}
.csslider1 > .cs_arrownext {
  right: 70px;
}
.csslider1 > .cs_arrowprev > label {
  right: 0;
}
.csslider1 > .cs_arrownext > label {
  left: 0;
}
.csslider1 > .cs_arrowprev > label:after {
  content: '\e800';
}
.csslider1 > .cs_arrownext > label:after {
  content: '\e801';
}
.csslider1 > .cs_arrowprev > label:after,
.csslider1 > .cs_arrownext > label:after {
  display: block;
  font: 40px "demurecontrols";
  text-align: center;
  line-height: 76px;
  color: #fff;
}

.csslider1 > .cs_arrowprev:hover > label {
  background-color: #4284c5;
  width: 70px;
}
.csslider1 > .cs_arrownext:hover > label {
  background-color: #4284c5;
  width: 70px;
}.csslider1 > .cs_bullets {
  bottom: 5px;
  margin-bottom: 5px;
}

.csslider1 > .cs_bullets > label {
  -webkit-perspective: 500px;
  -moz-perspective: 500px;
  -ms-perspective: 500px;
  -o-perspective: 500px;
  perspective: 500px;
  
}

.csslider1 > .cs_bullets > label > .cs_thumb {
  border: 2px solid #4284c5;
  margin-top: -11px;
  -webkit-transition: opacity 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), visibility 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
  -moz-transition: opacity 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), -moz-transform 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), visibility 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
  -ms-transition: opacity 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), -ms-transform 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), visibility 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
  -o-transition: opacity 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), -o-transform 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), visibility 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
  transition: opacity 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), transform 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), visibility 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
  
  -webkit-transform-origin: 0% 100% 0px;
  -moz-transform-origin: 0% 100% 0px;
  -ms-transform-origin: 0% 100% 0px;
  -o-transform-origin: 0% 100% 0px;
  transform-origin: 0% 100% 0px;
  
  -webkit-transform: rotateX(90deg);
  -moz-transform: rotateX(90deg);
  -ms-transform: rotateX(90deg);
  -o-transform: rotateX(90deg);
  transform: rotateX(90deg);
  
}
.csslider1 > .cs_bullets > label > .cs_thumb:before {
  content: '';
  position: absolute;
  width: 0; 
  height: 0; 
  left: 50%;
  margin-left: -1px;
  bottom: -8px;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  
  border-top: 7px solid #4284c5;
}
.csslider1 > .cs_bullets > label:hover > .cs_thumb {
  visibility: visible;
  opacity: 1;
  -webkit-transform: rotateX(0deg);
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  -o-transform: rotateX(0deg);
  transform: rotateX(0deg);
  
}


.csslider1 > .cs_bullets > label {
  margin: 0 6px;
  padding: 9px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  
  /* Fallback for web browsers that doesn't support RGBa */
  background: #000;
  background-color: rgba(0,0,0,0.6);
}

.csslider1 > .cs_bullets > label.num0 {
  background-color: #4284c5;
}
.csslider1 > .slide:checked ~ .cs_bullets > label {
  /* Fallback for web browsers that doesn't support RGBa */
  background: #000;
  background-color: rgba(0,0,0,0.6);
}

.csslider1 > #cs_slide1_0:checked ~ .cs_bullets > label.num0,
.csslider1 > #cs_slide1_1:checked ~ .cs_bullets > label.num1,
.csslider1 > #cs_slide1_2:checked ~ .cs_bullets > label.num2,
.csslider1 > #cs_slide1_3:checked ~ .cs_bullets > label.num3,
.csslider1 > #cs_slide1_4:checked ~ .cs_bullets > label.num4 {
  background-color: #4284c5;
}

.csslider1 > .cs_bullets > label:hover {
  background-color: #4284c5;
}


/* 中川 スライドパターン2 */
.csslider2 {
  display: inline-block;
  position: relative;
  max-width: 960px;  
  width: 100%;
  margin-top: 10px;
  margin-left: auto;
  margin-right: auto;
}
.csslider2 > .cs_anchor2 {
  display: none;
}
.csslider2 > ul {
  position: relative;
  z-index: 1;
  font-size: 0;
  line-height: 0;
  margin: 0 auto;
  padding: 0;
  
  overflow: hidden;
  white-space: nowrap;
}
.csslider2 > ul > li.img img {
  width: 100%;
}
.csslider2 > ul > li.img {
  font-size: 0pt;

  -khtml-user-select: none;
  -moz-user-select: none;
  user-select: none;
}
.csslider2 > ul > li {
  position: relative;
  display: inline-block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  font-size: 15px;
  font-size: initial;
  line-height: normal;
  white-space: normal;
  vertical-align: top;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;

  -webkit-transform: translate3d(0,0,0);
  -moz-transform: translate3d(0,0,0);
  -ms-transform: translate3d(0,0,0);
  -o-transform: translate3d(0,0,0);
  transform: translate3d(0,0,0);
}
.csslider2 .cs_lnk{
  position: absolute;
  top: -9999px;
  left: -9999px;
  font-size: 0pt;
  opacity: 0;
  filter: alpha(opacity=0);
}.csslider2 > .cs_arrowprev,
.csslider2 > .cs_arrownext {
  position: absolute;
  top: 50%;
  -webkit-box-sizing: content-box;
  -moz-box-sizing: content-box;
  box-sizing: content-box;

  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  z-index: 5;
}
.csslider2 > .cs_arrowprev > label,
.csslider2 > .cs_arrownext > label {
  position: absolute;

  text-decoration: none;
  cursor: pointer;
  opacity: 0;
  z-index: -1;
}
.csslider2 > .cs_arrowprev {
  left: 0;
}
.csslider2 > .cs_arrownext {
  right: 0;
}

.csslider2 > .cs_arrowprev > label.num4,
.csslider2 > .cs_arrownext > label.num1 {
  opacity: 1;
  z-index: 5;
}
.csslider2 > .slide:checked ~ .cs_arrowprev > label,
.csslider2 > .slide:checked ~ .cs_arrownext > label {
  opacity: 0;
  z-index: -1;
}

.csslider2 > #cs_slide2_0:checked ~ .cs_arrowprev > label.num4,
.csslider2 > #cs_slide2_0:checked ~ .cs_arrownext > label.num1, 
.csslider2 > #cs_slide2_1:checked ~ .cs_arrowprev > label.num0,
.csslider2 > #cs_slide2_1:checked ~ .cs_arrownext > label.num2, 
.csslider2 > #cs_slide2_2:checked ~ .cs_arrowprev > label.num1,
.csslider2 > #cs_slide2_2:checked ~ .cs_arrownext > label.num3,
.csslider2 > #cs_slide2_3:checked ~ .cs_arrowprev > label.num2,
.csslider2 > #cs_slide2_3:checked ~ .cs_arrownext > label.num4,
.csslider2 > #cs_slide2_4:checked ~ .cs_arrowprev > label.num3,
.csslider2 > #cs_slide2_4:checked ~ .cs_arrownext > label.num0{
  opacity: 1;
  z-index: 5;
}

.csslider2.cs_pauseHover:hover > .cs_arrowprev > label,
.csslider2 > #cs_pause1:checked ~ .cs_arrowprev > label,
.csslider2.cs_pauseHover:hover > .cs_arrownext > label,
.csslider2 > #cs_pause1:checked ~ .cs_arrownext > label {
  -webkit-animation-play-state: paused !important;
  -moz-animation-play-state: paused !important;
  -ms-animation-play-state: paused !important;
  -o-animation-play-state: paused !important;
  animation-play-state: paused !important;
}


/* /calculate autoplay */
.csslider2 > .cs_bullets {
  position: absolute;
  left: 0;
  width: 100%;
  z-index: 6;
  font-size: 0;
  line-height: 8pt;
  text-align: center;
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.csslider2 > .cs_bullets > div {
  margin-left: -50%;
  width: 100%;
}
.csslider2 > .cs_bullets > label {
  position: relative;
  display: inline-block;
  cursor: pointer;
}
.csslider2 > .cs_bullets > label > .cs_thumb {
  visibility: hidden;
  position: absolute;
  opacity: 0;
  z-index: 1;
  line-height: 0;
  left: -44px;
  top: -48px;
}
.csslider2 > ul > li {
  position: absolute;
  left: 0;
  top: 0;
  display: inline-block;
  opacity: 0;
  z-index: 1;
    
}

.csslider2 > ul > li.num0 {
  opacity: 1;
  z-index: 2;
}
.csslider2 > .slide:checked ~ ul > li.num0 {
  opacity: 0;
  z-index: 1;
}

.csslider2 > #cs_slide2_0:checked ~ ul > li.num0,.csslider2 > #cs_slide2_1:checked ~ ul > li.num1,.csslider2 > #cs_slide2_2:checked ~ ul > li.num2,.csslider2 > #cs_slide2_3:checked ~ ul > li.num3,.csslider2 > #cs_slide2_4:checked ~ ul > li.num4 {
  opacity: 1;
  -webkit-transform: scale(1) translate(0, 0);
  -moz-transform: scale(1) translate(0, 0);
  -ms-transform: scale(1) translate(0, 0);
  -o-transform: scale(1) translate(0, 0);
  transform: scale(1) translate(0, 0);
  
  z-index: 2;
}

.csslider2 > .cs_arrowprev,
.csslider2 > .cs_arrownext,
.csslider2 > .cs_play_pause {
  opacity: 0;
}
.csslider2:hover > .cs_arrowprev,
.csslider2:hover > .cs_arrownext,
.csslider2:hover > .cs_play_pause {
  opacity: 1;
  -webkit-transform: rotateX(0deg);
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  -o-transform: rotateX(0deg);
  transform: rotateX(0deg);
  
}.csslider2 > .cs_arrowprev > label,
.csslider2 > .cs_arrownext > label {
  overflow: hidden;
  margin-top: -35px;
  width: 40px;
  height: 70px;

  /* Fallback for web browsers that doesn't support RGBa */
  background: #000;
  background-color: rgba(0,0,0,0.6);

  -webkit-border-radius: 4px;
  -moz-border-radius: 4px;
  border-radius: 4px;
}
.csslider2 > .cs_arrowprev {
  left: 70px;
}
.csslider2 > .cs_arrownext {
  right: 70px;
}
.csslider2 > .cs_arrowprev > label {
  right: 0;
}
.csslider2 > .cs_arrownext > label {
  left: 0;
}
.csslider2 > .cs_arrowprev > label:after {
  content: '\e800';
}
.csslider2 > .cs_arrownext > label:after {
  content: '\e801';
}
.csslider2 > .cs_arrowprev > label:after,
.csslider2 > .cs_arrownext > label:after {
  display: block;
  font: 40px "demurecontrols";
  text-align: center;
  line-height: 76px;
  color: #fff;
}

.csslider2 > .cs_arrowprev:hover > label {
  background-color: #4284c5;
  width: 70px;
}
.csslider2 > .cs_arrownext:hover > label {
  background-color: #4284c5;
  width: 70px;
}.csslider2 > .cs_bullets {
  bottom: 5px;
  margin-bottom: 5px;
}

.csslider2 > .cs_bullets > label {
  -webkit-perspective: 500px;
  -moz-perspective: 500px;
  -ms-perspective: 500px;
  -o-perspective: 500px;
  perspective: 500px;
  
}

.csslider2 > .cs_bullets > label > .cs_thumb {
  border: 2px solid #4284c5;
  margin-top: -11px;
  -webkit-transition: opacity 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), -webkit-transform 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), visibility 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
  -moz-transition: opacity 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), -moz-transform 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), visibility 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
  -ms-transition: opacity 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), -ms-transform 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), visibility 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
  -o-transition: opacity 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), -o-transform 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), visibility 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
  transition: opacity 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), transform 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275), visibility 0.5s cubic-bezier(0.175, 0.885, 0.320, 1.275);
  
  -webkit-transform-origin: 0% 100% 0px;
  -moz-transform-origin: 0% 100% 0px;
  -ms-transform-origin: 0% 100% 0px;
  -o-transform-origin: 0% 100% 0px;
  transform-origin: 0% 100% 0px;
  
  -webkit-transform: rotateX(90deg);
  -moz-transform: rotateX(90deg);
  -ms-transform: rotateX(90deg);
  -o-transform: rotateX(90deg);
  transform: rotateX(90deg);
  
}
.csslider2 > .cs_bullets > label > .cs_thumb:before {
  content: '';
  position: absolute;
  width: 0; 
  height: 0; 
  left: 50%;
  margin-left: -1px;
  bottom: -8px;
  border-left: 7px solid transparent;
  border-right: 7px solid transparent;
  
  border-top: 7px solid #4284c5;
}
.csslider2 > .cs_bullets > label:hover > .cs_thumb {
  visibility: visible;
  opacity: 1;
  -webkit-transform: rotateX(0deg);
  -moz-transform: rotateX(0deg);
  -ms-transform: rotateX(0deg);
  -o-transform: rotateX(0deg);
  transform: rotateX(0deg);
  
}


.csslider2 > .cs_bullets > label {
  margin: 0 6px;
  padding: 9px;
  -webkit-border-radius: 50%;
  -moz-border-radius: 50%;
  border-radius: 50%;
  
  /* Fallback for web browsers that doesn't support RGBa */
  background: #000;
  background-color: rgba(0,0,0,0.6);
}

.csslider2 > .cs_bullets > label.num0 {
  background-color: #4284c5;
}
.csslider2 > .slide:checked ~ .cs_bullets > label {
  /* Fallback for web browsers that doesn't support RGBa */
  background: #000;
  background-color: rgba(0,0,0,0.6);
}

.csslider2 > #cs_slide2_0:checked ~ .cs_bullets > label.num0,
.csslider2 > #cs_slide2_1:checked ~ .cs_bullets > label.num1,
.csslider2 > #cs_slide2_2:checked ~ .cs_bullets > label.num2,
.csslider2 > #cs_slide2_3:checked ~ .cs_bullets > label.num3,
.csslider2 > #cs_slide2_4:checked ~ .cs_bullets > label.num4 {
  background-color: #4284c5;
}

.csslider2 > .cs_bullets > label:hover {
  background-color: #4284c5;
}

/* 中川 スライド導入END */