@charset "UTF-8";
/* CSS Document */

/*----------------------------------

コンテンツ

----------------------------------*/
body {
  padding-bottom: 0;
}

.col-2,
.col-2-re,
.col-4,
.col-2-1,
.col-2-2,
.col-2-2-re,
.col-3{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
}
.col-2-re,
.col-2-2-re {
	flex-direction: row-reverse;
}
.col-scroll {
	overflow-x: auto;
}
.col-2-2 > div {
	width: calc(50% - .75em);
}

@media only screen and (min-width: 768px) {
.col-2 > div:not(.col-2-1),
.col-2 > section,
.col-2 > figure,
.col-2-re > div,
.col-2-re > dl,
.col-2-re > figure,
.col-2-1 > dl,
.col-2-1 > div {
	width: calc(50% - 1em);
}
.col-3 > div,
.col-3 > section,
.col-3 > figure {
	width: calc(33% - 1em);
}
.col-4 > div,
.col-4 > section,
.col-4 > figure {
	width: calc(25% - 1em);
}
}
@media only screen and (max-width: 767px) {
	.title-page {
		margin-bottom: 40px;
	}

	.col-2,
	.col-2-re,
  .col-3,
	.col-4 {
		flex-direction: column;
	}
	.col-2.sp-re,
	.col-2-re {
		flex-direction: column-reverse;
	}
	.col-2 > div,
	.col-2 > figure,
	.col-2-re > dl,
	.col-2-re > figure,
	.col-3 > div,
	.col-3 > section,
	.col-3 > figure,
  .col-4 > div,
	.col-4 > section,
	.col-4 > figure{
		width: 100%;
		margin-bottom: 1em;
	}
}

/*　リンクボタン　*/
.link-btn a {
	display: inline-block;
	text-align: center;
	padding: .5em;
	font-weight: bold;
	background-color: #000;
	position: relative;
	vertical-align: middle;
	overflow: hidden;
	z-index: 0;
	color: #fff;
	box-sizing: border-box;
	border-radius: .25em;
	width: 100%;
}
.news .link-btn-l a {
	display: inline-block;
	text-align: center;
	padding: .75em;
	font-size: 1.8rem;
	font-weight: bold;
  border: 1px solid #005bac;
	background-color: #fff;
	position: relative;
	vertical-align: middle;
	overflow: hidden;
	z-index: 0;
	color: #005bac;
	box-sizing: border-box;
	border-radius: .25em;
	width: 100%;
}
.news .link-btn-l a:hover {
  color: #fff;
}
.back-news {
  max-width: 400px;
  margin: 40px auto 0;
}
.link-btn a::after,
.link-btn-l a::after {
	width: 100%;
	height: 0;
	left: 0;
	bottom: 0;
	transition-duration: 0.3s;
	transform-origin: bottom left;
	box-sizing: border-box;
	background-color: #005bac;
	content: '';
	position: absolute;
	z-index: -1;
}
.link-btn a:hover::after,
.link-btn-l a:hover::after {
    height: 100%;
    width: 100%;
}
.link-btn a span.arrow::after,
.link-btn-l a span.arrow::after {
	display: inline-block;
	margin-left: .5em;
	content: "";
	vertical-align: middle;
	width: .5em;
	height: .5em;
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
	-webkit-transform: rotate(45deg);
	transform: rotate(45deg);
}
.link-btn a span.arrow-back::before,
.link-btn-l a span.arrow-back::before {
	display: inline-block;
	margin-right: .5em;
	content: "";
	vertical-align: middle;
	width: .5em;
	height: .5em;
	border-top: 2px solid #005bac;
	border-right: 2px solid #005bac;
	-webkit-transform: rotate(225deg);
	transform: rotate(225deg);
}
.link-btn a:hover span.arrow-back::before,
.link-btn-l a:hover span.arrow-back::before {
	border-top: 2px solid #fff;
	border-right: 2px solid #fff;
}
.news-text:not(:last-child) {
  margin-bottom: 2em;
  padding-bottom: 2em;
}
.flex-wrap {
  display: flex;
  flex-wrap: wrap;
}
.flex-wrap-3col {
  display: flex;
}
/*キャラクター*/
.character01 {
  display: flex;
  justify-content: center;
  align-items: center;
}
.character01 figure {
  width: 100px;
}
.character01 p {
  padding: 1.5em 2em;
  border-radius: 10px;
  border: 1px solid #ccc;
  position: relative;
  margin-left: 24px;
}
.character01 p:after, .character01 p:before{
  border: solid transparent;
  content:'';
  height:0;
  width:0;
  pointer-events:none;
  position:absolute;
  right:100%;
  top:50%;
}
.character01 p:after{
  margin-top: -11px;
  border: 11px solid transparent;
  border-right: 19px solid #f05b5b;
  border-right-color:#fff;
}
.character01 p:before{
  margin-top: -12px;
  border: 12px solid transparent;
  border-right: 20px solid #f05b5b;
  border-right-color:#ccc;
}

/*table*/
.table-01 {
	width: 100%;
}
.table-01 th,
.table-01 td {
	border: 1px solid #ccc;
	padding: .75em;
}
.table-01 th {
	background: #666;
	color: #fff;
	font-weight: bold;
}

.flex-wrap-3col {
  display: flex;
}
.flex-wrap-3col dl{
  width: calc(100% / 3);
}

/* movie */
.movie_wrap_2col {
  display: flex;
  margin: 0 auto 3rem auto;
  max-width: 900px;
}
.movie-box {
  display: block;
  position: relative;
  width: 100%;
  max-width: 400px;
  margin-right: 2.5rem;
  margin-bottom: 1rem;
  padding: 0;
}
.movie-box::before {
  content: "";
  padding-top: 56.25%;
  display: block;
}
.movie-box iframe {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

@media only screen and (max-width: 767px) {
.link-btn-l a {
	font-size: 1.8rem;
}
.back-news {
/*  max-width: 100%;*/
}
/*キャラクター*/
.character01 p {
  padding: 1em;
  width: calc(100% - 60px);
}
/*table*/
.table-01 {
	word-break: break-all;
}
.table-01 > colgroup .width-20,
.table-01 > colgroup .width-80 {
  width: 100% !important;
}
.table-01 th,
.table-01 td {
  display: block;
  width: 100%;
  border-bottom: none;
}
.table-01 tr:last-of-type td {
  border-bottom: 1px solid #ccc;
}
.flex-wrap-3col {
  display: block;
}
.flex-wrap-3col dl{
  width: 100%;
}
  
/* movie */
.movie_wrap_2col {
  flex-direction: column;
}
.movie-box {
  width: 100%;
  max-width: 100%;
  margin-right: 0;
}
}
