@charset "UTF-8";
.HalfBox20 {
  width: 20%; }
  @media screen and (max-width: 640px) {
    .HalfBox20 {
      width: 100%; } }

.HalfBox30 {
  width: 30%; }
  @media screen and (max-width: 640px) {
    .HalfBox30 {
      width: 100%; } }

.HalfBox40 {
  width: 40%; }
  @media screen and (max-width: 640px) {
    .HalfBox40 {
      width: 100%; } }

.HalfBox50 {
  width: 50%; }
  @media screen and (max-width: 640px) {
    .HalfBox50 {
      width: 100%; } }

.HalfBox60 {
  width: 60%; }
  @media screen and (max-width: 640px) {
    .HalfBox60 {
      width: 100%; } }

.HalfBox70 {
  width: 70%; }
  @media screen and (max-width: 640px) {
    .HalfBox70 {
      width: 100%; } }

.HalfBox80 {
  width: 80%; }
  @media screen and (max-width: 640px) {
    .HalfBox80 {
      width: 100%; } }

.HalfBox90 {
  width: 90%; }
  @media screen and (max-width: 640px) {
    .HalfBox90 {
      width: 100%; } }

.HalfBox100 {
  width: 100%; }
  @media screen and (max-width: 640px) {
    .HalfBox100 {
      width: 100%; } }

.HalfBox110 {
  width: 110%; }
  @media screen and (max-width: 640px) {
    .HalfBox110 {
      width: 100%; } }

.HalfBox120 {
  width: 120%; }
  @media screen and (max-width: 640px) {
    .HalfBox120 {
      width: 100%; } }

.HalfBox130 {
  width: 130%; }
  @media screen and (max-width: 640px) {
    .HalfBox130 {
      width: 100%; } }

.HalfBox140 {
  width: 140%; }
  @media screen and (max-width: 640px) {
    .HalfBox140 {
      width: 100%; } }

.HalfBox150 {
  width: 150%; }
  @media screen and (max-width: 640px) {
    .HalfBox150 {
      width: 100%; } }

.HalfBox10 {
  width: 10%; }
  @media screen and (max-width: 640px) {
    .HalfBox10 {
      width: 100%; } }

.HalfBox11 {
  width: 11%; }
  @media screen and (max-width: 640px) {
    .HalfBox11 {
      width: 100%; } }

.HalfBox12 {
  width: 12%; }
  @media screen and (max-width: 640px) {
    .HalfBox12 {
      width: 100%; } }

.HalfBox13 {
  width: 13%; }
  @media screen and (max-width: 640px) {
    .HalfBox13 {
      width: 100%; } }

.HalfBox14 {
  width: 14%; }
  @media screen and (max-width: 640px) {
    .HalfBox14 {
      width: 100%; } }

.HalfBox15 {
  width: 15%; }
  @media screen and (max-width: 640px) {
    .HalfBox15 {
      width: 100%; } }

.HalfBox16 {
  width: 16%; }
  @media screen and (max-width: 640px) {
    .HalfBox16 {
      width: 100%; } }

.HalfBox17 {
  width: 17%; }
  @media screen and (max-width: 640px) {
    .HalfBox17 {
      width: 100%; } }

.HalfBox18 {
  width: 18%; }
  @media screen and (max-width: 640px) {
    .HalfBox18 {
      width: 100%; } }

.HalfBox19 {
  width: 19%; }
  @media screen and (max-width: 640px) {
    .HalfBox19 {
      width: 100%; } }

.HalfBox20 {
  width: 20%; }
  @media screen and (max-width: 640px) {
    .HalfBox20 {
      width: 100%; } }

.HalfBox21 {
  width: 21%; }
  @media screen and (max-width: 640px) {
    .HalfBox21 {
      width: 100%; } }

.HalfBox22 {
  width: 22%; }
  @media screen and (max-width: 640px) {
    .HalfBox22 {
      width: 100%; } }

.HalfBox23 {
  width: 23%; }
  @media screen and (max-width: 640px) {
    .HalfBox23 {
      width: 100%; } }

.HalfBox24 {
  width: 24%; }
  @media screen and (max-width: 640px) {
    .HalfBox24 {
      width: 100%; } }

.HalfBox25 {
  width: 25%; }
  @media screen and (max-width: 640px) {
    .HalfBox25 {
      width: 100%; } }

.HalfBox26 {
  width: 26%; }
  @media screen and (max-width: 640px) {
    .HalfBox26 {
      width: 100%; } }

.HalfBox27 {
  width: 27%; }
  @media screen and (max-width: 640px) {
    .HalfBox27 {
      width: 100%; } }

.HalfBox28 {
  width: 28%; }
  @media screen and (max-width: 640px) {
    .HalfBox28 {
      width: 100%; } }

.HalfBox29 {
  width: 29%; }
  @media screen and (max-width: 640px) {
    .HalfBox29 {
      width: 100%; } }

.HalfBox30 {
  width: 30%; }
  @media screen and (max-width: 640px) {
    .HalfBox30 {
      width: 100%; } }

.HalfBox31 {
  width: 31%; }
  @media screen and (max-width: 640px) {
    .HalfBox31 {
      width: 100%; } }

.HalfBox32 {
  width: 32%; }
  @media screen and (max-width: 640px) {
    .HalfBox32 {
      width: 100%; } }

.HalfBox33 {
  width: 33%; }
  @media screen and (max-width: 640px) {
    .HalfBox33 {
      width: 100%; } }

.HalfBox34 {
  width: 34%; }
  @media screen and (max-width: 640px) {
    .HalfBox34 {
      width: 100%; } }

.HalfBox35 {
  width: 35%; }
  @media screen and (max-width: 640px) {
    .HalfBox35 {
      width: 100%; } }

.HalfBox36 {
  width: 36%; }
  @media screen and (max-width: 640px) {
    .HalfBox36 {
      width: 100%; } }

.HalfBox37 {
  width: 37%; }
  @media screen and (max-width: 640px) {
    .HalfBox37 {
      width: 100%; } }

.HalfBox38 {
  width: 38%; }
  @media screen and (max-width: 640px) {
    .HalfBox38 {
      width: 100%; } }

.HalfBox39 {
  width: 39%; }
  @media screen and (max-width: 640px) {
    .HalfBox39 {
      width: 100%; } }

.HalfBox40 {
  width: 40%; }
  @media screen and (max-width: 640px) {
    .HalfBox40 {
      width: 100%; } }

.HalfBox41 {
  width: 41%; }
  @media screen and (max-width: 640px) {
    .HalfBox41 {
      width: 100%; } }

.HalfBox42 {
  width: 42%; }
  @media screen and (max-width: 640px) {
    .HalfBox42 {
      width: 100%; } }

.HalfBox43 {
  width: 43%; }
  @media screen and (max-width: 640px) {
    .HalfBox43 {
      width: 100%; } }

.HalfBox44 {
  width: 44%; }
  @media screen and (max-width: 640px) {
    .HalfBox44 {
      width: 100%; } }

.HalfBox45 {
  width: 45%; }
  @media screen and (max-width: 640px) {
    .HalfBox45 {
      width: 100%; } }

.HalfBox46 {
  width: 46%; }
  @media screen and (max-width: 640px) {
    .HalfBox46 {
      width: 100%; } }

.HalfBox47 {
  width: 47%; }
  @media screen and (max-width: 640px) {
    .HalfBox47 {
      width: 100%; } }

.HalfBox48 {
  width: 48%; }
  @media screen and (max-width: 640px) {
    .HalfBox48 {
      width: 100%; } }

.HalfBox49 {
  width: 49%; }
  @media screen and (max-width: 640px) {
    .HalfBox49 {
      width: 100%; } }

.HalfBox50 {
  width: 50%; }
  @media screen and (max-width: 640px) {
    .HalfBox50 {
      width: 100%; } }

.HalfBox51 {
  width: 51%; }
  @media screen and (max-width: 640px) {
    .HalfBox51 {
      width: 100%; } }

.HalfBox52 {
  width: 52%; }
  @media screen and (max-width: 640px) {
    .HalfBox52 {
      width: 100%; } }

.HalfBox53 {
  width: 53%; }
  @media screen and (max-width: 640px) {
    .HalfBox53 {
      width: 100%; } }

.HalfBox54 {
  width: 54%; }
  @media screen and (max-width: 640px) {
    .HalfBox54 {
      width: 100%; } }

.HalfBox55 {
  width: 55%; }
  @media screen and (max-width: 640px) {
    .HalfBox55 {
      width: 100%; } }

.HalfBox56 {
  width: 56%; }
  @media screen and (max-width: 640px) {
    .HalfBox56 {
      width: 100%; } }

.HalfBox57 {
  width: 57%; }
  @media screen and (max-width: 640px) {
    .HalfBox57 {
      width: 100%; } }

.HalfBox58 {
  width: 58%; }
  @media screen and (max-width: 640px) {
    .HalfBox58 {
      width: 100%; } }

.HalfBox59 {
  width: 59%; }
  @media screen and (max-width: 640px) {
    .HalfBox59 {
      width: 100%; } }

.HalfBox60 {
  width: 60%; }
  @media screen and (max-width: 640px) {
    .HalfBox60 {
      width: 100%; } }

.HalfBox61 {
  width: 61%; }
  @media screen and (max-width: 640px) {
    .HalfBox61 {
      width: 100%; } }

.HalfBox62 {
  width: 62%; }
  @media screen and (max-width: 640px) {
    .HalfBox62 {
      width: 100%; } }

.HalfBox63 {
  width: 63%; }
  @media screen and (max-width: 640px) {
    .HalfBox63 {
      width: 100%; } }

.HalfBox64 {
  width: 64%; }
  @media screen and (max-width: 640px) {
    .HalfBox64 {
      width: 100%; } }

.HalfBox65 {
  width: 65%; }
  @media screen and (max-width: 640px) {
    .HalfBox65 {
      width: 100%; } }

.HalfBox66 {
  width: 66%; }
  @media screen and (max-width: 640px) {
    .HalfBox66 {
      width: 100%; } }

.HalfBox67 {
  width: 67%; }
  @media screen and (max-width: 640px) {
    .HalfBox67 {
      width: 100%; } }

.HalfBox68 {
  width: 68%; }
  @media screen and (max-width: 640px) {
    .HalfBox68 {
      width: 100%; } }

.HalfBox69 {
  width: 69%; }
  @media screen and (max-width: 640px) {
    .HalfBox69 {
      width: 100%; } }

.HalfBox70 {
  width: 70%; }
  @media screen and (max-width: 640px) {
    .HalfBox70 {
      width: 100%; } }

.HalfBox71 {
  width: 71%; }
  @media screen and (max-width: 640px) {
    .HalfBox71 {
      width: 100%; } }

.HalfBox72 {
  width: 72%; }
  @media screen and (max-width: 640px) {
    .HalfBox72 {
      width: 100%; } }

.HalfBox73 {
  width: 73%; }
  @media screen and (max-width: 640px) {
    .HalfBox73 {
      width: 100%; } }

.HalfBox74 {
  width: 74%; }
  @media screen and (max-width: 640px) {
    .HalfBox74 {
      width: 100%; } }

.HalfBox75 {
  width: 75%; }
  @media screen and (max-width: 640px) {
    .HalfBox75 {
      width: 100%; } }

.HalfBox800 {
  width: 66.7%; }
  @media screen and (max-width: 640px) {
    .HalfBox800 {
      width: 100%; } }

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
  margin: 0;
  padding: 0;
  font-weight: normal; }

fieldset, img {
  border: 0;
  vertical-align: middle; }

code, em, strong, th {
  font-style: normal;
  font-weight: normal; }

h1, h2, h3, h4, h5, h6 {
  font-size: 100%;
  font-weight: normal; }

/*===============================================
	li
===============================================*/
li {
  list-style: outside none none; }

/*===============================================
	box-sizing
===============================================*/
* {
  box-sizing: border-box;
  margin: 0;
  padding: 0; }

/*===============================================
	cFix
===============================================*/
/*Opera Fix*/
body:before {
  content: "";
  height: 100%;
  float: left;
  width: 0;
  margin-top: -32767px; }

main {
  display: block; }

/*cFix*/
.cFix:after {
  content: ".";
  display: block;
  height: 0;
  clear: both;
  visibility: hidden; }

/* IE-mac */
* html .cFix {
  height: 1%; }

.cFix {
  display: block; }

img {
  width: 100%; }

/*===============================================
	a,text
===============================================*/
a:hover, a:hover img {
  opacity: 0.75;
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
  filter: alpha(opacity=80); }

a, a img {
  text-decoration: none;
  border: none;
  -webkit-transition: 0.3s ease-in-out;
  -moz-transition: 0.3s ease-in-out;
  -o-transition: 0.3s ease-in-out;
  transition: 0.3s ease-in-out; }

/*=============================================== 
	base
===============================================*/
html {
  font-size: 62.5%;
  -webkit-text-size-adjust: none; }
  @media screen and (max-width: 640px) {
    html {
      font-size: 80%; } }

html, body {
  height: 100%;
  width: 100%; }

/*===============================================
	font
===============================================*/
body {
  font-family: "メイリオ",Meiryo,"ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HiraKakuPro-W3","ＭＳ Ｐゴシック","MS PGothic",Arial, Helvetica,sans-serif;
  font-size: 1.5rem;
  line-height: 1.6em;
  color: #231815;
  background: white;
  -webkit-text-size-adjust: 100%; }

/*input,textarea,select{font-family: "メイリオ", Meiryo, "Hiragino Kaku Gothic Pro", "ヒラギノ角ゴ Pro W3", "ＭＳ Ｐゴシック", "Lucida Grande", "Lucida Sans Unicode", Arial, Verdana, sans-serif; font-size:1.2rem;}*/
/* for IE6 */
* html body {
  font-family: "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif; }

* html input, * html textarea {
  font-family: "ＭＳ Ｐゴシック", "MS PGothic", Sans-Serif; }

/* --responsive------------------------------------------- */
/*===============================================
				登録mixin一覧
===============================================
	1.リンクスタイル
	2.タイトルスタイル
	3.flex
	4.矢印
	5.テーブル
	6.ボタン
	7.グラデーション
	8.吹き出し
	9.フォントスタイル
	10.リストスタイル
	11.ホバースタイル
===============================================*/
/*/////////////////////////////////////////////////////////////////////////////////////////////

	1.リンクスタイル

/////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////

	2.タイトルスタイル

/////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////

	3.flex 

/////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////

	4.矢印 

/////////////////////////////////////////////////////////////////////////////////////////////*/
/*===ベースの矢印===*/
/*===右への矢印→===*/
/*===四角の中にの中に▶===*/
/*===丸の中に▶===*/
/*===丸の中に>===*/
/*===▶だけ===*/
/*===くの字===*/
/*/////////////////////////////////////////////////////////////////////////////////////////////

	5.テーブル 

/////////////////////////////////////////////////////////////////////////////////////////////*/
/*===
$bordercolor＝線の色
$theadThBg＝thead内thの背景色
$ThBg＝tbody内thの背景色
===*/
/*===
$theadThBg＝thead内thの背景色
$ThBg＝tbody内thの背景色
===*/
/*===
$hBg:流れリボン部分の色
$TdBg＝tbdの背景色
===*/
/*/////////////////////////////////////////////////////////////////////////////////////////////

	6.ボタンスタイル

/////////////////////////////////////////////////////////////////////////////////////////////*/
/*===テキストのみのボタン
$Bgcolor=背景色
===*/
/*===丸の中に▶のボタン
$Bgcolor=背景色（▶と同色）
$circleBg＝丸の背景色
$bordercolor＝線の色
===*/
/*===立体的なボタン
$Bgcolor=背景色（▶と同色）
$bordercolor＝>の色
===*/
/*/////////////////////////////////////////////////////////////////////////////////////////////

7.グラデーション

/////////////////////////////////////////////////////////////////////////////////////////////*/
/* Mixins */
/*/////////////////////////////////////////////////////////////////////////////////////////////

	8.吹き出し

/////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////

	9.フォントスタイル

/////////////////////////////////////////////////////////////////////////////////////////////*/
/*/////////////////////////////////////////////////////////////////////////////////////////////

	10.リストスタイル

/////////////////////////////////////////////////////////////////////////////////////////////*/
/* チェック */
/* 丸の中にチェック */
/*/////////////////////////////////////////////////////////////////////////////////////////////

	11.ホバースタイル

/////////////////////////////////////////////////////////////////////////////////////////////*/
/* ホバーで透明度が低い黒＋内容が上にせり上がる　*/
/*===============================================
  タイトルスタイル
===============================================*/
.gradeBorder {
  position: relative;
  font-size: 2.6rem;
  text-align: center;
  margin-bottom: 70px;
  font-weight: bold;
  line-height: 1.8; }
  .gradeBorder::after {
    position: absolute;
    content: "";
    left: 0;
    right: 0;
    margin: auto;
    bottom: -1em;
    width: 90px;
    height: 5px;
    background: #3a991d;
    background: -moz-linear-gradient(left, #3a991d 0%, #1c95db 80%, #1c95db 100%);
    background: -webkit-linear-gradient(left, #3a991d 0%, #1c95db 80%, #1c95db 100%);
    background: linear-gradient(to right, #3a991d 0%, #1c95db 80%, #1c95db 100%); }

.mincho {
  font-size: 2.4rem;
  text-align: center;
  margin-bottom: 50px;
  font-family: 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;
  line-height: 1.8; }

.titleSpeech {
  text-align: center;
  margin-bottom: 20px; }
  .titleSpeech span {
    font-size: 1.8rem;
    color: white;
    position: relative;
    padding: 0.6em;
    line-height: 1.4em;
    margin-bottom: 0.8em;
    background: #ee6149;
    border-radius: 10px;
    display: inline-block;
    padding: 0.6em 1.5em; }
    .titleSpeech span::after {
      position: absolute;
      content: '';
      top: 100%;
      left: 0;
      right: 0;
      margin: auto;
      border: 10px solid transparent;
        border-top: 10px solid #ee6149;
      width: 0;
      height: 0; }

.LongTwin {
  font-size: 2rem;
  color: #000;
  margin-bottom: 0.8em;
  padding-bottom: 0.5em;
  position: relative;
  border-bottom: 5px #ccc solid; }
  .LongTwin::after {
    position: absolute;
    bottom: -5px;
    left: 0;
    z-index: 2;
    content: '';
    width: 20%;
    height: 5px;
    background-color: #3498db; }

.LeftBlue {
  font-size: 1.8rem;
  color: #4aaae0;
  line-height: 1.4em;
  margin-bottom: 0.8em;
  padding-left: 0.2em;
  text-align: left;
  border-left: solid 5px #4aaae0;
  font-weight: bold; }

.LeftGreen {
  font-size: 1.8rem;
  color: #61ad4c;
  line-height: 1.4em;
  margin-bottom: 0.8em;
  padding-left: 0.2em;
  text-align: left;
  border-left: solid 5px #61ad4c;
  font-weight: bold; }

.WhiteBorder {
  color: white;
  font-size: 2.6rem;
  text-align: center;
  text-shadow: 0px 1px 3px rgba(0, 0, 0, 0.35);
  position: relative;
  margin-bottom: 50px; }
  .WhiteBorder::after {
    position: absolute;
    content: "";
    width: 215px;
    height: 2px;
    background-color: white;
    left: 0;
    top: 0;
    bottom: 0;
    margin: auto; }
    @media screen and (max-width: 640px) {
      .WhiteBorder::after {
        display: none; } }
  .WhiteBorder::before, nav .accordion li.WhiteBorder:last-of-type::after {
    position: absolute;
    content: "";
    width: 215px;
    height: 2px;
    background-color: white;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto; }
    @media screen and (max-width: 640px) {
      .WhiteBorder::before, nav .accordion li.WhiteBorder:last-of-type::after {
        display: none; } }

/*=============================================== 
	head
===============================================*/
#HeaderWrapper {
  width: 100%;
  position: relative; }

#Header {
  margin: 0 auto;
  padding: 20px 0;
  position: relative;
  width: 1200px;
  display: flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  /* Safari */
  justify-content: space-between;
  align-items: flex-end; }
  @media screen and (max-width: 640px) {
    #Header {
      width: 100%; } }
  #Header p {
    color: #009FB9; }
  #Header .Logo {
    width: 28.2%; }
    @media screen and (max-width: 640px) {
      #Header .Logo {
        margin: auto;
        width: 41.2%; } }

#Headerback {
  background: #fff;
  margin: 0 auto;
  width: 1200px;
  position: relative; }

/*=============================================== 
	Gnav
===============================================*/
nav {
  border-bottom: solid 6px #80cfdc;
  position: relative;
  background: #009eb8; }
  @media screen and (max-width: 640px) {
    nav {
      display: none;
      border: none;
      background: #dedfdf; } }
  nav .accordion {
    width: 1200px;
    margin: auto;
    display: flex;
    -webkit-flex-wrap: wrap;
    /* Safari */
    flex-wrap: wrap;
    -webkit-justify-content: space-between;
    /* Safari */
    justify-content: space-between; }
    @media screen and (max-width: 640px) {
      nav .accordion {
        padding: 0;
        width: 100%; } }
    nav .accordion li {
      position: relative;
      color: white;
      text-align: center;
      display: block;
      width: calc(1200px / 6);
      -webkit-transition: 0.3s ease-in-out;
      -moz-transition: 0.3s ease-in-out;
      -o-transition: 0.3s ease-in-out;
      transition: 0.3s ease-in-out; }
      nav .accordion li::before, nav .accordion li:last-of-type::after {
        content: "";
        position: absolute;
        width: 1px;
        height: 54px;
        background: white;
        left: 0;
        top: 0;
        bottom: 0;
        margin: auto; }
        @media screen and (max-width: 640px) {
          nav .accordion li::before, nav .accordion li:last-of-type::after {
            display: none; } }
      nav .accordion li:last-of-type::after {
        right: 0;
        left: inherit; }
        @media screen and (max-width: 640px) {
          nav .accordion li:last-of-type::after {
            display: none; } }
      @media screen and (max-width: 640px) {
        nav .accordion li {
          border: solid 1px white;
          width: 50%;
          text-align: center;
          padding: 0; } }
      nav .accordion li a {
        color: white;
        border-bottom: none;
        padding: 1em 0;
        padding: 1em;
        display: block;
        width: 100%; }
        nav .accordion li a:hover {
          background: #80cfdc;
          opacity: 1; }
        @media screen and (max-width: 640px) {
          nav .accordion li a {
            padding: .5em 0 .5em 1.5em;
            display: block;
            color: #251919; } }

.sp_menu_button {
  display: none; }
  @media screen and (max-width: 640px) {
    .sp_menu_button {
      width: 50px;
      height: 27px;
      outline: none;
      border: none;
      font-size: 20px;
      display: block;
      position: absolute;
      top: 1.5em;
      right: 1em; }
      .sp_menu_button .menu_icon01 {
        display: block;
        float: left;
        cursor: pointer;
        transition: all 0.2s ease-in; }
        .sp_menu_button .menu_icon01 span {
          display: block;
          width: 50px;
          height: 2px;
          background: #003f8d;
          margin-bottom: 5px;
          transition: all 0.4s ease-out; } }

.sp_menu_button.open .menu_icon01 {
  transform: rotate(-45deg); }

.sp_menu_button.open .menu_icon01 .bar1 {
  transform: rotate(20deg) translateY(8px); }

.sp_menu_button.open .menu_icon01 .bar2 {
  opacity: 0; }

.sp_menu_button.open .menu_icon01 .bar3 {
  transform: rotate(-110deg) translateX(8px); }

/*=============================================== 
	footer
===============================================*/
#footerBg {
  width: auto;
  background: #595757;
  width: 100%;
  padding: 10px 0; }

#footer {
  max-width: 1200px;
  margin: 0 auto;
  position: relative; }
  @media screen and (max-width: 640px) {
    #footer {
      width: 100%;
      padding: .5em 1em;
      display: flex;
      -webkit-flex-wrap: wrap;
      /* Safari */
      flex-wrap: wrap;
      -webkit-justify-content: space-between;
      /* Safari */
      justify-content: space-between; }
      #footer .HalfBox23 ul {
        display: flex;
        -webkit-flex-wrap: wrap;
        /* Safari */
        flex-wrap: wrap;
        -webkit-justify-content: space-between;
        /* Safari */
        justify-content: space-between; }
        #footer .HalfBox23 ul li {
          width: 49%; } }

.footer-list {
  width: 100%; }
  @media screen and (max-width: 640px) {
    .footer-list {
      display: none; } }
  .footer-list li {
    font-size: 1.4rem;
    margin-right: 20px; }
    .footer-list li a {
      color: white; }
  .footer-list .ulbox {
    display: flex;
    -webkit-flex-wrap: wrap;
    /* Safari */
    flex-wrap: wrap;
    -webkit-justify-content: flex-start;
    /* Safari */
    justify-content: flex-start;
    margin-right: 1em; }
    .footer-list .ulbox .ulinner {
      margin-left: 1em; }
    @media screen and (max-width: 640px) {
      .footer-list .ulbox {
        width: 45%;
        margin-bottom: 1em; } }
  .footer-list p {
    margin-left: auto; }
    @media screen and (max-width: 640px) {
      .footer-list p {
        width: 100%;
        margin-bottom: 2em; } }

.pageTop {
  position: fixed;
  bottom: 0;
  right: 0;
  width: 50px;
  height: 50px; }
  @media screen and (max-width: 640px) {
    .pageTop {
      width: 3em;
      height: 3em; } }

.pageTop.footIn {
  position: absolute;
  bottom: -30px; }

#copyBox {
  padding: .5em 0;
  background: #e6e6e6; }
  #copyBox .inner {
    width: 1200px;
    align-items: center;
    margin: auto; }
    @media screen and (max-width: 640px) {
      #copyBox .inner {
        width: 100%;
        padding: 0 .5em; } }
  #copyBox .nav-footer-user {
    margin-top: 1em; }
    #copyBox .nav-footer-user li {
      margin-bottom: .5em; }
    #copyBox .nav-footer-user a {
      color: #595757; }
  #copyBox .copy {
    font-size: 1.1rem;
    color: #595757;
    text-align: center;
    display: block;
    margin-top: 1em; }
  #copyBox .add {
    color: #595757;
    line-height: 1.5;
    text-align: right;
    border-bottom: 1px solid #9FA0A0; }
    @media screen and (max-width: 640px) {
      #copyBox .add {
        text-align: center;
        border: none;
        margin-top: 2em; }
        #copyBox .add .f17 {
          font-size: 2rem !important; } }

/*=============================================== 
	wrapper
===============================================*/
#wrapper {
  padding: 0;
  overflow: hidden; }

.pankuzu {
  width: 1200px;
  margin: 0.666em auto 4.33em; }
  .pankuzu a {
    color: black; }
  @media screen and (max-width: 640px) {
    .pankuzu {
      width: 100%; } }

/*=============================================== 
	page
===============================================*/
#page {
  height: auto;
  margin: 0 auto;
  padding: 0; }

#contents {
  height: auto;
  margin: 0;
  padding: 0;
  line-height: 2em; }

.conte {
  width: 1200px;
  margin: 0 auto; }

/*/////////////////////////////////////////////////////////////////////////////////////////////

背景

/////////////////////////////////////////////////////////////////////////////////////////////*/
.BgGlay {
  background: #ecf1f4; }

/*/////////////////////////////////////////////////////////////////////////////////////////////

	リスト

/////////////////////////////////////////////////////////////////////////////////////////////*/
.disc li {
  list-style: disc;
  margin-left: 1em; }

/*/////////////////////////////////////////////////////////////////////////////////////////////

	テーブル

/////////////////////////////////////////////////////////////////////////////////////////////*/
.table_a {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
  border: 1px solid #231815; }
  .table_a thead th {
    background-color: #ceccc7; }
  .table_a th {
    -moz-box-sizing: border-box;
    /* box-size[border・padding 込み] */
    box-sizing: border-box;
    /* box-size[border・padding 込み] */
    color: #8a1c31;
    border-top: 1px solid #231815;
    padding: 1em .5em;
    width: 24%;
    text-align: left;
    font-style: normal;
    font-weight: bold;
    vertical-align: top;
    background-color: #ecdcd8; }
  .table_a td {
    padding: 1em .8em;
    text-align: left;
    vertical-align: middle;
    border-top: solid 1px #231815;
    background-color: #fff; }
  @media screen and (max-width: 640px) {
    .table_a {
      border-bottom: none; }
      .table_a th {
        width: 100%;
        display: block;
        margin: 0 auto;
        border: none;
        text-align: left; }
      .table_a td {
        width: 100%;
        display: list-item;
        list-style: none;
        border-top: none !important;
        border-bottom: 1px solid #231815; } }

.ScrollTh {
  overflow: auto; }
  .ScrollTh table {
    width: 1200px;
    border-collapse: collapse;
    border-spacing: 0;
    border: 2px solid #22ac38; }
    .ScrollTh table thead th {
      background-color: #9bd2af; }
    .ScrollTh table th {
      -moz-box-sizing: border-box;
      /* box-size[border・padding 込み] */
      box-sizing: border-box;
      /* box-size[border・padding 込み] */
      border: 2px solid #22ac38;
      padding: 9.2px 5px;
      font-style: normal;
      font-weight: bold;
      text-align: center;
      vertical-align: middle;
      background-color: #f8f6f2; }
    .ScrollTh table td {
      padding: 9.2px 5px;
      text-align: center;
      vertical-align: middle;
      border-top: solid 2px #22ac38;
      border-right: solid 2px #22ac38;
      background-color: #fff; }
      .ScrollTh table td:last-child {
        border-right: none; }

/*/////////////////////////////////////////////////////////////////////////////////////////////

	border

/////////////////////////////////////////////////////////////////////////////////////////////*/
.b_dash {
  padding-bottom: .5em;
  border-bottom: dashed #0075c2 1px;
  display: block; }

.textShWhite {
  text-shadow: 0px 0px 3px #fff, 0px 0px 5px #fff, 0px 0px 10px #fff; }

.textShBlack {
  text-shadow: 0px 0px 3px #000, 0px 0px 5px #000, 0px 0px 10px #000; }

/*/////////////////////////////////////////////////////////////////////////////////////////////

	flex

/////////////////////////////////////////////////////////////////////////////////////////////*/
.flex {
  display: flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  /* Safari */
  justify-content: space-between; }

.flexRev {
  display: flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  /* Safari */
  justify-content: space-between;
  flex-direction: row-reverse; }

.flexCenter {
  display: flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-justify-content: center;
  /* Safari */
  justify-content: center; }

.flexitemCenter {
  display: flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  /* Safari */
  justify-content: space-between;
  align-items: center; }

.flexCenterRev {
  display: flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-justify-content: space-between;
  /* Safari */
  justify-content: space-between;
  flex-direction: row-reverse;
  align-items: center; }

.flexstart {
  display: flex;
  -webkit-flex-wrap: wrap;
  /* Safari */
  flex-wrap: wrap;
  -webkit-justify-content: flex-start;
  /* Safari */
  justify-content: flex-start; }

/*===独自のスタイル===*/
/*style*/
.sp {
  display: none; }

.pc {
  display: block; }

/*===============================================
	font-size
===============================================*/
.f7 {
  font-size: 0.7rem !important; }

.f8 {
  font-size: 0.8rem !important; }

.f9 {
  font-size: 0.9rem !important; }

.f10 {
  font-size: 1.0rem !important; }

.f11 {
  font-size: 1.1rem !important; }

.f12 {
  font-size: 1.2rem !important; }

.f13 {
  font-size: 1.3rem !important; }

.f14 {
  font-size: 1.4rem !important; }

.f15 {
  font-size: 1.5rem !important; }

.f16 {
  font-size: 1.6rem !important; }

.f17 {
  font-size: 1.7rem !important; }

.f18 {
  font-size: 1.8rem !important; }

.f19 {
  font-size: 1.9rem !important; }

.f20 {
  font-size: 2rem !important;
  line-height: 1.5; }

.f21 {
  font-size: 2.1rem !important;
  line-height: 1.5; }

.f22 {
  font-size: 2.2rem !important;
  line-height: 1.5; }

.f23 {
  font-size: 2.3rem !important;
  line-height: 1.5; }

.f24 {
  font-size: 2.4rem !important;
  line-height: 1.5; }

.f25 {
  font-size: 2.5rem !important;
  line-height: 1.5; }

.f26 {
  font-size: 2.6rem !important;
  line-height: 1.5; }

.f27 {
  font-size: 2.7rem !important;
  line-height: 1.5; }

.f28 {
  font-size: 2.8rem !important;
  line-height: 1.5; }

.f29 {
  font-size: 2.9rem !important;
  line-height: 1.5; }

.f30 {
  font-size: 3rem !important;
  line-height: 1.5; }

.f31 {
  font-size: 3.1rem !important;
  line-height: 1.5; }

.f32 {
  font-size: 3.2rem !important;
  line-height: 1.5; }

.f33 {
  font-size: 3.3rem !important;
  line-height: 1.5; }

.f34 {
  font-size: 3.4rem !important;
  line-height: 1.5; }

.f35 {
  font-size: 3.5rem !important;
  line-height: 1.5; }

.f36 {
  font-size: 3.6rem !important;
  line-height: 1.5; }

.f37 {
  font-size: 3.7rem !important;
  line-height: 1.5; }

.f38 {
  font-size: 3.8rem !important;
  line-height: 1.5; }

.f39 {
  font-size: 3.9rem !important;
  line-height: 1.5; }

.f40 {
  font-size: 4rem !important;
  line-height: 1.5; }

/*===============================================
	float
===============================================*/
.fl {
  float: left !important; }

.fr {
  float: right !important; }

.clear {
  clear: both !important; }

/*===============================================
	margine
===============================================*/
.mt0 {
  margin-top: 0 !important; }

.mt5 {
  margin-top: 5px !important; }

.mt10 {
  margin-top: 10px !important; }

.mt15 {
  margin-top: 15px !important; }

.mt20 {
  margin-top: 20px !important; }

.mt25 {
  margin-top: 25px !important; }

.mt30 {
  margin-top: 30px !important; }

.mt40 {
  margin-top: 40px !important; }

.mt50 {
  margin-top: 50px !important; }

.mt60 {
  margin-top: 60px; }

.mt70 {
  margin-top: 70px; }

.mt80 {
  margin-top: 80px; }

.mt90 {
  margin-top: 90px; }

.mt100 {
  margin-top: 100px; }

.mt90 {
  margin-top: 90px !important; }

.mr5 {
  margin-right: 5px !important; }

.mr10 {
  margin-right: 10px !important; }

.mr15 {
  margin-right: 15px !important; }

.mr20 {
  margin-right: 20px !important; }

.mr25 {
  margin-right: 25px !important; }

.mr30 {
  margin-right: 30px !important; }

.mr50 {
  margin-right: 50px !important; }

.mb0 {
  margin-bottom: 0px !important; }

.mb3 {
  margin-bottom: 3px !important; }

.mb5 {
  margin-bottom: 5px !important; }

.mb10 {
  margin-bottom: 10px !important; }

.mb15 {
  margin-bottom: 15px !important; }

.mb20 {
  margin-bottom: 20px !important; }

.mb25 {
  margin-bottom: 25px !important; }

.mb30 {
  margin-bottom: 30px !important; }

.mb40 {
  margin-bottom: 40px !important; }

.mb50 {
  margin-bottom: 50px !important; }

.mb60 {
  margin-bottom: 60px !important; }

.mb70 {
  margin-bottom: 70px !important; }

.mb80 {
  margin-bottom: 80px !important; }

.mb90 {
  margin-bottom: 90px !important; }

.ml5 {
  margin-left: 5px !important; }

.ml10 {
  margin-left: 10px !important; }

.ml15 {
  margin-left: 15px !important; }

.ml20 {
  margin-left: 20px !important; }

.ml25 {
  margin-left: 25px !important; }

.ml30 {
  margin-left: 30px !important; }

.ml50 {
  margin-left: 50px !important; }

.mAuto {
  margin: auto !important; }

.mlAuto {
  margin-left: auto !important; }

.mrAuto {
  margin-right: auto !important; }

/*===============================================
	padding
===============================================*/
.pt5 {
  padding-top: 5px !important; }

.pt10 {
  padding-top: 10px !important; }

.pt15 {
  padding-top: 15px !important; }

.pt20 {
  padding-top: 20px !important; }

.pt25 {
  padding-top: 25px !important; }

.pt30 {
  padding-top: 30px !important; }

.pt40 {
  padding-top: 40px; }

.pt50 {
  padding-top: 50px; }

.pt60 {
  padding-top: 60px; }

.pt70 {
  padding-top: 70px; }

.pt80 {
  padding-top: 80px; }

.pt90 {
  padding-top: 90px; }

.pr5 {
  padding-right: 5px !important; }

.pr10 {
  padding-right: 10px !important; }

.pr15 {
  padding-right: 15px !important; }

.pr20 {
  padding-right: 20px !important; }

.pr25 {
  padding-right: 25px !important; }

.pr30 {
  padding-right: 30px !important; }

.pr50 {
  padding-right: 50px !important; }

.pb5 {
  padding-bottom: 5px !important; }

.pb10 {
  padding-bottom: 10px !important; }

.pb15 {
  padding-bottom: 15px !important; }

.pb20 {
  padding-bottom: 20px !important; }

.pb25 {
  padding-bottom: 25px !important; }

.pb30 {
  padding-bottom: 30px !important; }

.pb40 {
  padding-bottom: 40px; }

.pb50 {
  padding-bottom: 50px; }

.pb60 {
  padding-bottom: 60px; }

.pb70 {
  padding-bottom: 70px; }

.pb80 {
  padding-bottom: 80px; }

.pb90 {
  padding-bottom: 90px; }

.pb100 {
  padding-bottom: 100px; }

.pl5 {
  padding-left: 5px !important; }

.pl10 {
  padding-left: 10px !important; }

.pl15 {
  padding-left: 15px !important; }

.pl20 {
  padding-left: 20px !important; }

.pl25 {
  padding-left: 25px !important; }

.pl30 {
  padding-left: 30px !important; }

.pl50 {
  padding-left: 50px !important; }

.p10 {
  padding: 10px; }

.p20 {
  padding: 20px; }

.p30 {
  padding: 30px; }

.p40 {
  padding: 40px; }

.p50 {
  padding: 50px; }

/*===============================================
	align
===============================================*/
.center {
  text-align: center !important;
  margin: 0 auto !important; }

.textleft {
  text-align: left !important; }

.textright {
  text-align: right !important; }

.pcenter {
  vertical-align: middle; }

.bold {
  font-weight: bold; }

/*===============================================
	color
===============================================*/
.Blue01 {
  color: #0075c2; }

.Blue02 {
  color: #1c95db; }

.Green01 {
  color: #36aa69; }

.Orange {
  color: #e85504; }

.red {
  color: #8a1c31; }

.red02 {
  color: #e60012; }

.Pink {
  color: #f9789d; }

.Black {
  color: #000 !important; }

.gridWrapper .grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(400px, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 0; }

/*responsive*/
/********max-width:640px************/
@media screen and (max-width: 640px) {
  .sp {
    display: block; }

  .pc {
    display: none !important; }

  body {
    background: #fff;
    font-size: 2.0rem;
    -webkit-text-size-adjust: 100%; }

  /*=============================================== 
  	上書き
  ===============================================*/
  /*=============================================== 
  	フォントサイズ
  ===============================================*/
  html {
    font-size: 85.0%; }

  body {
    background: #fff;
    font-size: 1.6rem;
    -webkit-text-size-adjust: 100%; }

  /*===============================================*/
  /*=============================================== 
  	基本コンテンツ
  ===============================================*/
  #page {
    width: 100%;
    height: 100%;
    margin: 0 auto;
    border: none; }

  #contents {
    float: none;
    width: 100%;
    height: auto;
    margin: 0 auto;
    line-height: 1.8em;
    padding: 0; }

  #midConte {
    display: inline !important; }

  .conte {
    width: 95%; }
    .conte img {
      width: 100%; }

  /*=============================================== 
  	wrapper
  ===============================================*/
  #wrapper {
    background: #fff;
    width: 100%;
    margin: 0;
    border: none;
    box-shadow: none; }

  /*=============================================== 
  	独自
  ===============================================*/
  .HalfBoxL30 {
    width: 80%;
    float: none;
    padding-right: 0;
    margin: 20px auto; }

  .HalfBoxL40 {
    width: 80%;
    float: none;
    padding-right: 0;
    margin: 20px auto; }

  .HalfBoxL50 {
    width: 80%;
    float: none;
    padding-right: 0;
    margin: 20px auto; }

  .HalfBoxR50 {
    width: 100%;
    float: none;
    margin: auto; }

  .HalfBoxR60 {
    width: 100%;
    float: none;
    margin: auto; }

  .HalfBoxR70 {
    width: 100%;
    float: none;
    margin: auto; } }