@charset "utf-8";
/***  メインビジュアル　フェード  ***/

#top01,
#top02,
#top03,
#top04,
#top05,
#top06,
#top07,
#top08 {
  width: 94%;
  margin: 0 auto;
  text-align: left;
  padding: 1.5em 0;
}

.top_slid00 {
  width: 98%;
  margin: 0 auto;
}

/*=========================
	メインコンテンツここから
==========================*/

.kumo_bg img {
  width: 100%;
}

.back_B7E3F7_top4 {
  background: linear-gradient(transparent 4em, #b7e3f7 0 4em);
}

.mainasu_01 {
  margin: -4.5em auto 0;
}
.mainasu_02 {
  margin: 0 auto 0;
}
.mainasu_03 {
  margin: -3.5em auto 0;
}

.top01_01bnr_block > ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  margin: -2.5em 0 0 0;
  justify-content: center;
}
.top01_01bnr_block > ul > li {
  /* 1600*/
  width: 23%;
  margin: 0.1em 1%;
}

.top01_04lp > ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
}

.top01_04lp > ul > li {
  width: 100%;
  margin: 0 auto 1.5em;
}

.top01_04 > ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
}
.top01_04block > dl {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: flex-end;
}
.top01_04 > ul > li {
  /*442 1380*/
  width: 48%;
  margin: 0 1% 1em;
  box-sizing: border-box;
  display: flex;
  flex-direction: column;
}
.top01_04title {
  position: relative;
  z-index: 2;
}
.top01_04title::after {
  content: "";
  position: absolute;
  top: 16%;
  left: 0;
  width: 100%;
  height: 84%;
  border-radius: 20px 20px 0 0;
  z-index: -2;
}

.top01_04title::before {
  content: "";
  border-radius: 20px 20px 0 0;
  width: 96%;
  height: 76%;
  position: absolute;
  top: 20%;
  left: 2%;
  z-index: -1;
}

.top01_04block {
  background: #ffffff;
  padding: 0.5em;
  border-radius: 0 0 20px 20px;
  box-sizing: border-box;
  flex-grow: 1;
}

.top01_04block > dl > dt {
  /*414 155*/
  width: 42.5%;
}
.top01_04block > dl > dd {
  width: 55.5%;
  margin: 0 0 0 2%;
}

.top01_04fee {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
  align-items: center;
  background: #ffff00;
}

.top01_04nebi {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
  align-items: center;
  background: #c1272d;
}

.top01_04text {
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  justify-content: flex-end;
}

.top01_04off {
  display: block;
  color: #c1272d;
  font-weight: bold;
  padding: 0.2em 0.3em;
  box-sizing: border-box;
}

.top01_04nebi .top01_04off {
  color: #ffffff;
}

.top01_04btn a,
.top01_04btn_02 a,
.top01_04btn p {
  display: block;
  width: 100%;
  padding: 0.7em;
  box-sizing: border-box;
  border-radius: 50px;
  background: #e83819;
  border: #e83819 1px solid;
  color: #ffffff;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
.top01_04btn a:hover {
  background: #ffffff;
  color: #e83819;
}
.top01_04btn_02 a {
  background: #004c88;
  border: #004c88 1px solid;
}

.top01_04btn_02 a:hover {
  background: #ffffff;
  color: #004c88;
}

.top04_01 {
  border: #29abe2 4px solid;
  border-radius: 20px;
  box-sizing: border-box;
  padding: 2em;
}

.top04_01title {
  position: relative;
  padding: 0 0 1em 0;
}
.top04_01title::after {
  content: "";
  background: none;
  background-size: contain;
  width: 100px;
  height: 116px;
  position: absolute;
  top: 20%;
  left: 2em;
  transform: translate(-50%, -50%);
}
.top04_01cate > ul > li,
.top04_02cate > ul > li {
  padding: 0 0.1em 0.1em;
}
.top04_01cate > ul > li a,
.top04_02cate > ul > li a,
.top03_02cate > ul > li a,
.top03_02cate > ul > li span {
  display: inline-block;
  background: #ffe780;
  border: #ffe780 1px solid;
  padding: 0.4em 1.2em;
  line-height: 1.4;
  text-decoration: none;
  border-radius: 50px;
  box-sizing: border-box;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
.top04_02cate > ul > li a {
  background: #f15a24;
  border: #f15a24 1px solid;
  color: #ffffff;
}
.top03_02cate > ul > li {
  display: inline-block;
  margin: 0.1em;
}
.top03_02cate > ul > li a,
.top03_02cate > ul > li span {
  line-height: 1.2;
  background: #e6e6e6;
  border: #e6e6e6 1px solid;
  color: #666666;
}

.top03_02cate > ul > li a:hover {
  background: #666666;
  border: #666666 1px solid;
  color: #e6e6e6;
}

.top04_01 > ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  align-items: center;
}
.top04_01 > ul > li:nth-child(1) {
  width: 100%;
}
.top04_01 > ul > li:nth-child(2) {
  width: 0;
  display: none;
}

.top04_01more a {
  text-decoration: none;
  position: relative;
  padding: 0 0 0 2em;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

.top04_01more a::before {
  content: "";
  background-size: contain;
  width: 10px;
  height: 6px;
  position: absolute;
  top: 50%;
  left: 1em;
  transform: translate(-50%, -50%);
}

.top04_02 > ul,
.top04_02 > ul > li > dl {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}
.top04_02 > ul > li {
  width: 100%;
  padding: 0 0 1em 0;
  box-sizing: border-box;
}

.top04_02 > ul > li > dl > dt {
  width: 23%;
  margin: 0 2% 0 0;
}
.top04_02 > ul > li > dl > dd {
  width: 75%;
}

.top02_01 > ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  width: 100%;
}

.top02_01 > ul > li {
  width: 90%;
  margin: 2em 5% 0;
  box-sizing: border-box;
  background: #ffffff;
  border-radius: 25px;
}

.top02_01num {
  /*99 385*/
  width: 80%;
  margin: -1em auto 1em;
}
.top02_01text {
  width: 96%;
  margin: 0 auto;
}

.top02_01icon {
  width: 40%;
  margin: 2em auto;
}

.top01_05btn a {
  max-width: 520px;
  width: 90%;
  margin: 0 auto;
  display: block;
  background: #004c88;
  color: #ffffff;
  text-align: center;
  text-decoration: none;
  font-weight: bold;
  position: relative;
  padding: 1em 2em 1em 1em;
  box-sizing: border-box;
  border-radius: 50px;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

.top01_05btn a::after {
  content: "";
  background: url("../img/common/icon_more_FFFFFF.svg") no-repeat;
  width: 17px;
  height: 8px;
  position: absolute;
  top: 50%;
  right: 2em;
  transform: translate(-50%, -50%);
}
.top01_05btn a:hover {
  color: #002f7b;
  background: #ffffff;
}
.top01_05btn a:hover::after {
  content: "";
  background: url("../img/common/icon_more_002F7B.svg") no-repeat;
}

.top01_05plan {
  max-width: 780px;
  margin: 0 auto;
}

.top03_01block {
  position: relative;
  margin: -3.5em 0 0 0;
}
.top03_01text {
  width: 70%;
  margin: 0 0 0 30%;
}
.top03_01img {
  width: 28%;
  max-width: 120px;
  position: absolute;
  bottom: 0;
  left: 0;
}

.top03_01 > ul {
  display: flex; /*フレックボックス宣言*/
  flex-wrap: wrap; /*折り返しあり*/
  width: 100%; /*親要素100％*/
}

.top03_01 > ul > li {
  /*318 1380*/
  width: 48%;
  margin: 0 1% 1.5em;
  box-sizing: border-box;
  position: relative;
}
.top03_01 > ul > li a {
  display: block;
  padding: 0;
  border-radius: 20px;
  text-decoration: none;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

.top03_02text,
.top03_02fee {
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

.top03_01tag > ul {
  padding: 0.5em 0;
  line-height: 1.4;
}
.top03_01tag > ul > li {
  display: inline-block;
  padding: 0 1em 0 0;
}

.top03_01tag > ul > li::before {
  content: "#";
}

.top03_01tag > ul > li a {
  text-decoration: none;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

.top03_02text {
  border-radius: 20px 20px 0 0;
  padding: 0.5em;
  box-sizing: border-box;
}

.top03_02fee {
  padding: 0.5em 1em 1em 1em;
  box-sizing: border-box;
  border-radius: 0 0 20px 20px;
}

.top03_03 > ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
}
.top03_03 > ul > li {
  width: 100%;
  margin: 0 0 1em 0;
}

.top03_03 > ul > li > a {
  font-weight: bold;
  cursor: pointer;
  display: block;
  width: 100%;
  max-width: 380px;
  margin: 0 auto;
  padding: 1em 3.5em;
  box-sizing: border-box;
  text-align: center;
  text-decoration: none;
  color: #ffffff;
  border-radius: 50px;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}
.top03_03 > ul > li > a:hover {
  border: #ffffff 2px solid;
}

.top03_03 .inner {
  background: #f2f2f2;
  border-radius: 20px;
  padding: 1em;
  margin: 1em 0;
  box-sizing: border-box;
}

.top03_03 .inner > li {
  display: inline-block;
  margin: 0.1em;
}
.top03_03 .inner > li a {
  display: inline-block;
  background: #ffffff;
  border: #e6e6e6 1px solid;
  text-decoration: none;
  border-radius: 50px;
  padding: 0.2em 1em;
  -webkit-transition: 0.2s ease-in-out;
  transition: 0.2s ease-in-out;
}

.top03_03 .inner > li a:hover {
  border: #fb7b1b 1px solid;
  color: #fb7b1b;
}

.top03_03_koji,
.top03_03_map {
  padding: 0 1.5em 0 2.5em;
  position: relative;
}
.top03_03_koji::before,
.top03_03_map::before {
  content: "";
  background: url("../img/common/icon_top_koji.svg") no-repeat;
  background-size: contain;
  width: 20px;
  height: 21px;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translate(-50%, -50%);
}
.top03_03_map::before {
  content: "";
  background: url("../img/common/icon_top_map.svg") no-repeat;
  background-size: contain;
}
.top03_03_koji::after,
.top03_03_map::after {
  content: "";
  background: url("../img/common/icon_arrow_FFC871.svg") no-repeat;
  background-size: contain;
  width: 8px;
  height: 14px;
  position: absolute;
  top: 70%;
  right: -1em;
  transform: translate(-50%, -50%);
}
.top03_03_koji::after,
.top03_03_map::after {
  content: "";
  background: url("../img/common/icon_arrow_FFC871.svg") no-repeat;
  background-size: contain;
  width: 8px;
  height: 14px;
  position: absolute;
  top: 70%;
  right: -1em;
  transform: translate(-50%, -50%);
}

.menu.active .top03_03_koji:after,
.menu.active .top03_03_map:after {
  position: absolute;
  content: "";
  background: url("../img/common/icon_arrow_FFC871.svg") no-repeat;
  background-size: contain;
  width: 8px;
  height: 14px;
  top: 9%;
  right: -0.7em;
  transform: translate(-50%, -50%);
  transform: rotate(-180deg);
}

.top05_01 > ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
}

.top05_01 > ul > li {
  width: 100%;
  margin: 0 0 1em;
}
.top06_block {
  width: 96%;
  margin: 0 auto;
}

.top06_00 > ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
}

.top06_00 > ul > li {
  width: 100%;
  padding: 0 1em 0.5em;
  box-sizing: border-box;
}

.top06_01 > ul > li {
  padding: 0 0 0.5em 0;
}

.top06_01address,
.top06_01tel,
.top06_01time,
.top06_01day {
  position: relative;
  padding: 0 0 0 2.5em;
}

.top06_01address::before,
.top06_01tel::before,
.top06_01time::before,
.top06_01day::before {
  position: absolute;
  content: "";
  background: url("../img/top/icon_top_map.svg") no-repeat;
  background-size: contain;
  width: 16px;
  height: 22px;
  top: 50%;
  left: 1em;
  transform: translate(-50%, -50%);
}
.top06_01tel::before {
  background: url("../img/top/icon_top_tel.svg") no-repeat;
  background-size: contain;
  width: 18px;
  height: 19px;
}
.top06_01time::before {
  background: url("../img/top/icon_top_time.svg") no-repeat;
  background-size: contain;
  width: 20px;
  height: 20px;
}
.top06_01day::before {
  background: url("../img/top/icon_top_cale.svg") no-repeat;
  background-size: contain;
  width: 18px;
  height: 18px;
}
.top06_01area {
  display: inline-block;
  font-weight: bold;
  padding: 0.2em 1.5em;
  border-radius: 50px;
}

.top06_02 > ul {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  justify-content: center;
}
.top06_02 > ul > li {
  width: 90%;
  margin: 0 5%;
}

.top07_01 {
  width: 96%;
  margin: 0 auto;
}

/*========================
	マップ
========================*/

.map_block {
  position: relative;
  padding-bottom: 56.9%; /* 100/横*縦*/
  height: 0;
  overflow: hidden;
}
.map_block02 {
  position: relative;
  padding-bottom: 52%; /* 100/横*縦*/
  height: 0;
  overflow: hidden;
}
.map_block iframe,
.map_block02 iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.youtube_block {
  position: relative;
  padding-bottom: 56.9%; /* 100/横*縦*/
  height: 0;
  overflow: hidden;
}
.youtube_block iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

/*=================================================================================*/
/** 768px以上　タブレット縦　サイズ画面  **/
@media (min-width: 768px) {
  /***  メインビジュアル　フェード  ***/
  #top01,
  #top02,
  #top03,
  #top04,
  #top05,
  #top06,
  #top07,
  #top08 {
    width: 96%;
  }

  .mainasu_01 {
    margin: -16em auto 0;
  }
  .mainasu_02 {
    margin: -5em auto 0;
  }
  .mainasu_03 {
    margin: -5.5em auto 0;
  }
  /*============================
	メインコンテンツ
=============================*/

  .mainasu_01 {
    margin: -10em auto 0;
  }
  .back_B7E3F7_top4 {
    background: linear-gradient(transparent 9em, #b7e3f7 0 9em);
  }
  .top01_01bnr_block > ul {
    margin: -5em 0 0 0;
  }

  .top01_01bnr_block > ul > li {
    /* 1600*/
    width: 10.3125%;
    margin: 0.1em 0.5%;
  }
  .top01_04block {
    padding: 1em;
  }
  .top01_04block > dl > dt {
    /*414 155*/
    width: 45.5%;
  }
  .top01_04block > dl > dd {
    width: 50.5%;
    margin: 0 0 0 4%;
  }

  .top01_04lp > ul > li {
    width: 49%;
    margin: 0 auto 1.5em;
  }

  .top01_04 > ul > li {
    /*442 1380*/
    width: 48%;
    margin: 0 1% 1em 1%;
    box-sizing: border-box;
  }

  .top02_01_01 > ul {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-around;
    width: 67%;
    margin: 0 auto;
  }

  .top02_01 > ul > li {
    width: 33%;
    margin: 2em 0.5%;
  }

  .top02_01num {
    /*99 385*/
    width: 52%;
    margin: -1.2em auto 1em;
  }

  .top03_01 > ul > li {
    /*318 1380*/
    width: 23.1%;
    margin: 0 0.95% 2.5em;
  }
  .top03_01text {
    width: 60%;
    margin: 0 0 0 24%;
  }

  .top03_01new {
    top: -1.5em;
  }
  .top03_01tenji {
    top: 0.7em;
    left: 0.7em;
  }

  .top03_02fee {
    padding: 1em 0.5em;
  }

  .top03_03 > ul > li {
    width: 32%;
    margin: 0 1%;
  }

  .top04_01title {
    padding: 0 0 0 5em;
  }
  .top04_01title::after {
    content: "";
    background: url("../img/top/top_04.svg") no-repeat;
    background-size: contain;
    width: 100px;
    height: 116px;
    position: absolute;
    top: 20%;
    left: 2em;
    transform: translate(-50%, -50%);
  }

  .top04_01 > ul > li:nth-child(1) {
    width: 70%;
  }
  .top04_01 > ul > li:nth-child(2) {
    width: 30%;
    display: block;
  }

  .top04_02 > ul > li {
    width: 50%;
    padding: 0 2%;
  }
  .top04_02 > ul > li:last-child {
    border-right: none;
  }

  .top05_01 > ul > li {
    width: 27.5%;
    margin: 0 1% 1em;
  }

  .top06_block {
    width: 83.3333%;
  }

  .top06_00 > ul > li {
    width: 50%;
    padding: 0 0.5em;
  }

  .top06_02 > ul > li {
    width: 40%;
    margin: 0 1%;
  }

  /*========================
	マップ
========================*/

  .map_block {
    position: relative;
    padding-bottom: 39.9%; /* 100/横*縦*/
    height: 0;
    overflow: hidden;
  }
}

@media (min-width: 1200px) {
  #top01,
  #top02,
  #top03,
  #top04,
  #top05,
  #top06,
  #top07,
  #top08 {
    width: 1200px;
    padding: 40px 0;
  }

  /*============================
	メインコンテンツ
=============================*/
  /*
.top01_04>ul>li:nth-child(1),
.top01_04>ul>li:nth-child(2),
.top01_04>ul>li:nth-child(3){
	width:32.333333%;
	margin:0 0.5% 1em ;
}
.top01_04>ul>li:nth-child(4),
.top01_04>ul>li:nth-child(6){
	width:28%;
	margin:0 0.5% 1em 21.5% ;
}
.top01_04>ul>li:nth-child(5),
.top01_04>ul>li:nth-child(7){
	width:28%;
	margin:0 21.5% 1em 0.5% ;
}
	*/

  .top01_04 > ul > li {
    width: 32.33333%;
    margin: 0 0.5% 1em;
  }
}

/*=================================================================================*/
/** 1600px以上 padding: ;PCサイズ画面 **/

@media (min-width: 1300px) {
  .mainasu_01 {
    margin: -16em auto 0;
  }
  .back_B7E3F7_top4 {
    background: linear-gradient(transparent 15em, #b7e3f7 0 15em);
  }

  /**** メインコンテンツ　****/

  /*============================
	メインコンテンツ
=============================*/
}

@media (min-width: 1400px) {
}

@media (min-width: 1750px) {
  .mainasu_02 {
    margin: -20em auto 0;
  }
  .top03_01block {
    position: relative;
    margin: -8em 0 0 0;
  }
  .top03_01img {
    width: auto;
    max-width: 249px;
    position: absolute;
    top: -2em;
    bottom: auto;
    left: 0;
  }
}