@charset "utf-8";
/* CSS Document */
/******************************************
commons
******************************************/
html {
  background-color: #F2F2F3;
  font-size: 62.5%; /*フォントの基準サイズを10pxにする*/
  width: 100%;
  height: 100%;
}
body {
  background-color: #FFF;
  min-width: 100%;
  min-height: 100%;
}
.container {
  margin: 0 auto;
  padding: 0;
}
.container:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden;
}
img {
  max-width: 100%;
}
@media (max-width: 750px) {
  body {
    font-size: 1.4rem; /*全体のフォントサイズは14pxとする*/
    -webkit-text-size-adjust: 100%; /*スマホでPC表示した際に勝手に文字が大きくなるのを防ぐ*/
  }
  .hidden_sp {
    display: none;
  }
}
@media (min-width: 751px) {
  body {
    font-size: 1.8rem; /*全体のフォントサイズは16pxとする*/
  }
  .container {
    width: 1200px;
    min-width: 1200px;
  }
  .hidden_pc {
    display: none;
  }
}

/* header */
#header {
	background-color: #FFF;
}
#header .head_wrap .head_right .head_entry a {
	background-color: #FCD80D;
	color: #000;
	text-decoration: none;
	font-weight: bold;
}
@media (max-width: 750px) {
#header .head_wrap .sitename {
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
}
#header .head_wrap .sitename .logo {
	width: 60%;
	padding: 8px;
}
#header .head_wrap .head_right {
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
}
#header .head_wrap .head_right ul {
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	background-color: #F2F2F3;
}
#header .head_wrap .head_right ul li {
	flex-basis: 50%;
	border-bottom: 1px solid #CCC;
	box-sizing: border-box;
}
#header .head_wrap .head_right ul li:nth-child(odd) {
	border-right: 1px solid #CCC;
}
#header .head_wrap .head_right ul li a {
	display: block;
	padding: 8px;
}
#header .head_wrap .head_right .head_entry {
	width: 100%;
}
#header .head_wrap .head_right .head_entry a {
	display: block;
	padding: 8px;
}
}
@media (min-width: 751px) {
#header .head_wrap {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
#header .head_wrap .sitename {
	display: flex;
	align-items: center;
}
#header .head_wrap .sitename .logo {
	padding: 8px;
	flex-basis: 220px;
}
#header .head_wrap .head_right {
	display: flex;
	align-items: center;
}
#header .head_wrap .head_right ul {
	display: flex;
}
#header .head_wrap .head_right ul li a {
	display: block;
	white-space: nowrap;
	padding: 8px 1.5em;
	color: #000;
	text-decoration: none;
	border-bottom: 3px solid rgba(255,241,0,0);
	font-weight: bold;
}
#header .head_wrap .head_right ul li a:hover {
	border-bottom: 3px solid rgba(255,241,0,1.00);
}
#header .head_wrap .head_right .head_entry {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
#header .head_wrap .head_right .head_entry a {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	flex-basis: 80px;
	padding: 0 2.5em;
	white-space: nowrap;
}
}



.flex {
	display: flex;
	flex-wrap: wrap;
	margin-bottom: 30px;
	justify-content: center;
}
.flex.justify_center {
	justify-content: center;
}
.flex > li,
.flex > div {
	box-sizing: border-box;
}
.flex.col2 > li,
.flex.col2 > div {
	flex-basis: 50%;
}
.flex.col3 > li,
.flex.col3 > div {
	flex-basis: 33.3%;
}
@media (max-width: 750px) {
.flex.col2_1,
.flex.col3_1,
.flex.col4_1 {
	flex-direction: column;
}
.flex.col3_2 > li,
.flex.col3_2 > div,
.flex.col4_2 > li,
.flex.col4_2 > div,
.flex.col5_2 > li,
.flex.col5_2 > div {
	flex-basis: 50%;
}
.flex.col5_3 > li,
.flex.col5_3 > div {
	flex-basis: 33.3%;
}
}
@media (min-width: 751px) {
.flex.col3_1 > li,
.flex.col3_1 > div,
.flex.col3_2 > li,
.flex.col3_2 > div {
	flex-basis: 33.3%;
}
.flex.col4_1 > li,
.flex.col4_1 > div,
.flex.col4_2 > li,
.flex.col4_2 > div {
	flex-basis: 25%;
}
.flex.col5_1 > li,
.flex.col5_1 > div,
.flex.col5_2 > li,
.flex.col5_2 > div,
.flex.col5_3 > li,
.flex.col5_3 > div {
	flex-basis: 20%;
}
}
ul.disc,
ul.circle,
ul.decimal {
	text-align: left;
	margin-left: 1.5em;
}
ul.disc> li ,
ul.circle> li ,
ul.decimal > li {
	list-style-position: outside;
}
ul.disc > li {
	list-style-type: disc;
}
ul.circle > li {
	list-style-type: circle;
}
ul.decimal > li {
	list-style-type: decimal;
}
/*スマホでのテーブルFullWidth*/
@media (max-width: 750px) {
  .table_sp, .table_sp caption, .table_sp tbody, .table_sp thead, .table_sp tfoot, .table_sp tr, .table_sp th, .table_sp td {
    display: block;
  }
  .table_sp {
    margin-bottom: 5px;
  }
  .table_sp caption {
    padding: 5px;
    background-color: #E2E2E2;
  }
  .table_sp th {
    background-color: #F2F2F2;
    padding: 8px;
  }
  .table_sp td {
    background-color: #FFFFFF;
    padding: 8px;
  }
}
@media (min-width: 751px) {
  .table_sp {
		width: 100%;
    margin: 0 auto 10px;
  }
  .table_sp tr th {
    padding: 15px;
    border: 1px solid #CCC;
		font-weight: 500;
		background-color: #F2F2F2;
  }
  .table_sp tr td {
    padding: 15px;
    border: 1px solid #CCC;
  }
}
/* scroll */
.scroll {
  overflow: auto;
  white-space: nowrap;
  margin-bottom: 20px;
}
.scroll table {
  width: 100%;
  margin-bottom: 20px;
}
.scroll::-webkit-scrollbar {
  height: 5px;
}
.scroll::-webkit-scrollbar-track {
  background: #F1F1F1;
}
.scroll::-webkit-scrollbar-thumb {
  background: #BCBCBC;
}
@media (max-width: 750px) {
  .scroll table {
    font-size: 80%;
  }
}
/* Yutube　googlemap　のレスポンシブ */
.video_wrap, .gmap_wrap {
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
}
.video_wrap iframe, .gmap_wrap iframe, .gmap_wrap object, .gmap_wrap embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
/* pager */
.pager {
	margin-bottom: 20px;
	width: 100%;
	display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.pager .right ul {
	display: flex;
}
.pager .right ul li {
	padding: 1px;
}
.pager .right li a,
.pager .right li span {
	padding: 3px 8px;
	display: inline-block;
}
.pager .right li span {
	border: 1px solid #F2F2F3;
	background-color: #EEE;
	color: #999;
}
.pager .right li a {
	border: 1px solid #ccc;
	background-color: #FFF;
}
@media (max-width: 750px) {
}
@media (min-width: 751px) {
.pager {
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
}
.pager .right {
	margin-left: auto;
}
}
