@charset "UTF-8";
html {
  /* font-size: 62.5%; */
  /* 16px x 62.5% = 10px    10px x 設定サイズ(rem) */
  background-color: #fff;
}

body {
  color: #0D264E;
  /* color: #333; */
  font-family: 'Noto Sans JP', sans-serif;
  /* font-family: 'Noto Serif JP', serif; */
  /* font-family: 'Roboto', sans-serif; */
  /* font-family: 'Roboto Condensed', sans-serif; */
  /* font-family: 'Oswald', sans-serif; */
  font-weight: 400;
  font-size: 16px;
  font-feature-settings: "palt";
  letter-spacing: 0.07em;
  /* letter-spacing: 0.1em; */
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  /* overflow: hidden; */
}

a,
a:link,
a:visited {
  text-decoration: none;
  color: #333;
}
a:hover {
  /* opacity: 0.8; */
}
a:hover img {
  /* opacity: 0.8; */
}
img {
  max-width: 100%;
  height: auto;
}
button {
  transition: all 0.2s ease 0s;
}
button:hover {
  opacity: 0.8;
  transform: translateY(2px);
}
li {
  list-style-type: none;
}
p,
h1,
h2,
h3 {
  margin: 0;
}
.text_center {
  text-align: center;
}
.text_left {
  text-align: left;
}
.font_blue {
  color: #0071BA;
}
.font_navy {
  color: #00223D;
}
.font_sky {
  color: #12A7EB;
}
.font_yellow {
  color: #FED455;
}
.font_reg {
  font-weight: 400;
}
.bold {
  font-weight: 700;
}
.under_skyblue {
  background: linear-gradient(transparent 70%, #AAD0ED 30%);
}
.under_yellow {
  background: linear-gradient(transparent 70%, #FED455 30%);
}
.under_white {
  background: linear-gradient(transparent 90%, #fff 10%);
}
.under_skyblue_grad {
	background-image: linear-gradient(to right, #6D9FC4, #6D9FC4);
	background-repeat: no-repeat;
	background-size: 100% 30%;
	background-position: bottom;
	transition: all 0.25s ease-in;
}
.underWave_pink {
  text-decoration: underline wavy #FA7F8E;
}
.underWave_yellow {
  text-decoration: underline wavy #FFEBAD;
}
.bg_red{
  background-color: #CB2228;
}
.bg_orange{
  background-color: #F48800;
}

/*------------------------------------------------
*     utility
-------------------------------------------------*/


/* メディアクエリ */
@media screen and (max-width:576px) {}
@media screen and (max-width:768px) {}
@media screen and (max-width:992px) {}

/*PCのとき表示する*/
.disp_pc {
  display: inline;
}
@media screen and (max-width:768px) {
  .disp_pc {
      display: none;
  }
}
/*TB以下のとき表示する*/
.disp_tb {
  display: none;
}
@media screen and (max-width:992px) {
  .disp_tb {
      display: inline;
  }
}
/*SP以下のとき表示する*/
.disp_sp {
  display: none;
}
@media screen and (max-width:768px) {
  .disp_sp {
    display: inline;
  }
}
/*PCのとき改行する*/
.br_pc {
  display: block;
}
@media screen and (max-width:992px) {
  .br_pc {
    display: none;
  }
}
/*タブレットのとき改行する*/
.br_tb {
  display: none;
}
@media screen and (max-width:992px) {
  .br-tb {
    display: block;
  }
}
/*SPのとき改行する*/
.br_sp {
  display: none;
}
@media screen and (max-width:768px) {
  .br_sp {
    display: block;
  }
}
/*XSサイズのとき改行する*/
.br_xs {
  display: none;
}
@media screen and (max-width:576px) {
  .br_xs {
    display: block;
  }
}
/*XXSサイズのとき改行する*/
.br_xxs {
  display: none;
}
@media screen and (max-width:400px) {
  .br_xxs {
    display: block;
  }
}
/*w320px以下のとき改行する*/
.br_320 {
  display: none;
}
@media screen and (max-width:320px) {
  .br_320 {
    display: block;
  }
}

/*------------------------------------------------
*     common parts
-------------------------------------------------*/

/* セクションスペース */
.section_space {
  padding: 80px 20px 100px;
}
@media screen and (max-width:768px) {
  .section_space {
    padding: 50px 15px 40px;
  }
}
/* セクションインナー */
.section_inner{
  max-width: 1000px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .section_inner{
  }
}
/* セクションタイトル */
.section_ttlWrap {
  max-width: 1000px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 20px;
  border-bottom: 4px solid #0071BA;
  padding-bottom: 10px;
  margin: 0 auto 60px;
}
@media screen and (max-width:768px) {
  .section_ttlWrap {
    max-width: 600px;
    gap: 10px;
    margin: 0 auto 30px;
  }
}
/* タイトルアイコン */
.section_ttlIcon {
  min-width: 100px;
  min-height: 100px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: 'Roboto', sans-serif;
  font-size: 22px;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  text-align: center;
  background-color: #0071BA;
  border-radius: 50px;
}
@media screen and (max-width:768px) {
  .section_ttlIcon {
    min-width: 70px;
    min-height: 70px;
    font-size: 15px;
  }
}
/* タイトルテキスト部 */
.section_ttlText {
}
@media screen and (max-width:768px) {
  .section_ttlText {
  }
}
/* タイトルメイン */
.section_ttlText .section_ttlMain {
  font-size: 32px;
  font-weight: 700;
  color: #333;
  line-height: 1.3;
  margin-bottom: 3px;
}
@media screen and (max-width:768px) {
  .section_ttlText .section_ttlMain{
    font-size: 26px;
    margin-bottom: 4px;
  }
}
.section_ttlText .section_ttlSub {
  font-size: 20px;
  font-weight: 400;
  color: #333;
}
@media screen and (max-width:768px) {
  .section_ttlText .section_ttlSub{
    font-size: 15px;
  }
}


/**********************************
*    お問い合わせボタン
***********************************/
.btn_contact {
  position: relative;
  min-width: 106px;
  background-color: #FED455;
  border: 2px solid #FED455;
  border-radius: 50px;
  box-shadow: 0px 3px 6px #00000029;
  transition: all 0.2s ease 0s;
  padding: 9px 30px;
  margin: 0 auto;
}
.btn_contact:hover {
  opacity: 0.8;
  transform: translateY(2px);
}
.btn_contact a{
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  font-weight: 700;
  color: #0D264E;
  transition: all 0.4s ease 0s;
}
.btn_contact a .icon{
  position: absolute;
  top: 59%;
  right: -23px;
  transform: translateY(-50%);
  z-index: 3;
}
.btn_contact .icon i{
  font-size: 20px;
  color: #FED455;
  background-color: #0D264E;
  border-radius: 50px;
}
.btn_contact .textWrap{
  position: relative;
  top: 50%;
  left: -4px;
  z-index: 3;
}
.btn_contact .textWrap .textMain{
  font-size: 18px;
  font-weight: 700;
}
.btn_contact .textWrap .textSub{
  font-size: 11px;
  font-weight: 700;
  text-align: center;
}
/* ヘッダーナビ_お問い合わせボタン */
.gnav_item .btn_contact {
  margin: 0 10px 0 auto;
}
/*--------------------------------------------


/*------------------------------------------------
*    header
-------------------------------------------------*/

@media screen and (max-width:768px) {}

/* header */
.header {
  width: 100%;
  position: fixed;
  height: 80px;
  background-color: rgba(255, 255, 255, .9);
  box-shadow: 0px 3px 20px #0000000D;
  z-index: 999;
  transition: .3s;
  padding: 0 20px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .header {
    position: fixed;
    height: 60px;
    padding: 5px 10px 0;
    z-index: 200;
  }
}
.headerInner {
  max-width: 1600px;
  display: flex;
  margin: 0 auto;
  justify-content: space-between;
  align-items: center;
  padding-top: 15px;
}
@media screen and (max-width:992px) {
  .headerInner {
    padding-top: 0;
  }
}
.header .logo {
  max-width: 300px;
  height: auto;
}
.header .logo a{
	display: flex;
	justify-content: center;
	align-items: center;
}
.header .logo img {
  max-width: 76px;
  height: 100%;
	max-height: 55px;
  padding: 3px 0;
  margin-right: 11px;
}
@media screen and (max-width:992px) {
  .header .logo img {
    max-width: 55px;
    max-height: 60px;
    padding: 7px 0;
    margin-right: 8px;
  }
}
.header .logo .textWrap {
  line-height: 1.1;
}
.header .logo .textWrap .name{
	font-size: 18px;
	font-weight: 700;
	color: #0072BB;
  margin-bottom: 5px;
}
@media screen and (max-width:768px) {
  .header .logo .textWrap .name{
    font-size: 17px;
  }
}
.header .logo .textWrap .notice{
	font-size: 10px;
	font-weight: 300;
	color: #333;
	/* color: #555; */
}
@media screen and (max-width:768px) {
  .header .logo .textWrap .notice{
    font-size: 10px;
  }
}


/* ヘッダー お問い合わせボタン */
.header .btn_headerContact {
  min-width: 160px;
  background: linear-gradient(to right, #00A6ED, #0072BB);
  box-shadow: 0px 3px 6px #00000029;
  border: 1px solid #00A6ED;
	border-radius: 30px;
  transition: all 0.4s ease 0s;
  padding: 10px 13px 10px 24px;
  margin: 0 20px 0 auto;
}
@media screen and (max-width:992px) {
  .header .btn_headerContact {
    min-width: 160px;
    max-width: 120px;
    padding:  9px 15px 9px 13px;
    margin: 0 0 0 auto;
    }
}
@media screen and (max-width:768px) {
  .header .btn_headerContact {
    min-width: 130px;
    max-width: 120px;
    padding:  9px 15px 9px 13px;
    margin: 0 0 0 auto;
    }
}
.header .btn_headerContact a{
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 15px;
	font-weight: 700;
  color: #fff;
  transition: all 0.4s ease 0s;
}
@media screen and (max-width:768px) {
  .header .btn_headerContact a{
    font-size: 14px;
  }
}
.header .btn_headerContact a i{
  font-size: 24px;
}
@media screen and (max-width:768px) {
  .header .btn_headerContact a i{
    font-size: 20px;
  }
}
.header .btn_headerContact:hover {
  background: #fff;
  border: 1px solid #05437D;
}
.header .btn_headerContact:hover a {
  color: #00559D;
}


/*------------------------------------------------
*    mv
-------------------------------------------------*/
.mv {
  /* max-width: 1300px; */
  /* height: 740px; */
  height: auto;
  padding-top: 80px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .mv {
    padding-top: 60px;
  }
}
/* MV背景 */
.mv_bg {
  /* max-width: 1300px; */
  /* height: 740px; */
  height: auto;
  background-image: url(../img/mv_bg.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center top;
  /* padding-top: 80px; */
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .mv_bg {
    background-image: url(../img/mv_bg_sp.png);
  }
}
/* MVコンテンツ */
.mv_conts {
  max-width: 1000px;
  padding: 50px 20px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .mv_conts {
    max-width: 500px;
    padding: 30px 15px 50px;
    margin: 0 auto;
  }
}
/* MVタイトル */
.mv_conts .mvTtl{
  margin-bottom: 40px;
}
@media screen and (max-width:768px) {
  .mv_conts .mvTtl{
    margin-bottom: 25px;
  }
}
.mvTtl .ttlSub{
  font-size: 26px;
  font-weight: 400;
  color: #0071BA;
  text-align: center;
  margin-bottom: 20px;
}
@media screen and (max-width:768px) {
  .mvTtl .ttlSub{
    font-size: 22px;
    margin-bottom: 10px;
  }
}
.mvTtl .ttlMain{
  margin-bottom: 20px;
}
@media screen and (max-width:768px) {
  .mvTtl .ttlMain{
    margin-bottom: 10px;
  }
}
.mvTtl .ttlMain img{
}
.mvTtl .detail{
  font-size: 18px;
  font-weight: 400;
  color: #333;
  text-align: center;
}
@media screen and (max-width:768px) {
  .mvTtl .detail{
    font-size: 16px;
    text-align: left;
  }
}

/* MV詳細 */
.mv .mvMedia{
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
}
@media screen and (max-width:768px) {
  .mv .mvMedia{
    flex-direction: column;
    gap: 20px;
  }
}
/* 画像 */
.mvMedia>.imgWrap{
  width: 40%;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .mvMedia>.imgWrap{
    width: 100%;
  }
}
.mvMedia>.imgWrap>img{
}
/* テキスト */
.mvMedia>.textWrap{
  width: 60%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: column;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .mvMedia>.textWrap{
    width: 100%;
  }
}
/* 困りごと */
.mvMedia>.textWrap ul.mvProblemList{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 15px;
  margin-bottom: 30px;
}
@media screen and (max-width:768px) {
  .mvMedia>.textWrap ul.mvProblemList{
    gap: 10px;
    margin-bottom: 20px;
  }
}
.mvProblemList>li{
  width: 100%;
  max-width: 520px;
  max-height: 94px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 15px;
  background-color: #fff;
  border: 1px solid #707070;
  border-radius: 20px;
  padding: 0 20px;
}
@media screen and (max-width:768px) {
  .mvProblemList>li{
    gap: 10px;
    padding: 0 15px;
  }
}
.mvProblemList>li:nth-of-type(2){
  flex-direction: row-reverse;
}
.mvProblemList>li>.imgWrap{
}
.mvProblemList>li>.imgWrap img{
  max-width: 100px;
  max-height: 80px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .mvProblemList>li>.imgWrap img{
    /* max-width: 80px; */
    max-height: 80px;
    margin: 0 auto;
  }
}
.mvProblemList>li>.textWrap{
  font-size: 16px;
  font-weight: 700;
}
@media screen and (max-width:768px) {
  .mvProblemList>li>.textWrap{
    font-size: 15px;
    padding: 20px 0;
  }
}
/* リード文 そんな困りごとをお持ちの皆様に */
.mvMedia>.textWrap>.lead{
  font-size: 29px;
  color: #0071BA;
  font-weight: 700;
  text-align: center;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .mvMedia>.textWrap>.lead{
    font-size: 23px;
  }
}



/*------------------------------------------------
*    point
-------------------------------------------------*/
.point{
  max-width: 1600px;
  background-image: url(../img/point_bg.png);
  background-size: cover;
  background-repeat: no-repeat;
  background-position: center bottom;
  margin: 0 auto;
}
.point.section_space {
}
@media screen and (max-width:768px) {
  .point.section_space {
    padding: 50px 15px 70px;
  }
}
/* point_コンテンツ */
.point_conts{
  max-width: 1200px;
  margin: 0 auto;
}
/* 3つのポイント */
.point_conts .pointList{
}
ul.pointList{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 30px;
}
@media screen and (max-width:768px) {
  ul.pointList{
    max-width: 280px;
    flex-direction: column;
    gap: 40px;
    margin: 0 auto;
  }
}
ul.pointList>li{
  width: 28%;
}
@media screen and (max-width:768px) {
  ul.pointList>li{
    width: 100%;
  }
}
ul.pointList>li>a{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  flex-direction: column;
  gap: 20px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  ul.pointList>li>a{
    gap: 10px;
  }
}
ul.pointList>li>a:hover{
  opacity: 0.8;
}
ul.pointList>li .imgWrap{
}
ul.pointList>li .imgWrap img{
}
/* 詳細はこちらボタン */
ul.pointList>li .btn_point{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  background-color: #3070B5;
  border-radius: 50px;
  padding: 6px 20px;
}
@media screen and (max-width:768px) {
  ul.pointList>li .btn_point{
    margin-top: -27px;
  }
}
ul.pointList>li .btn_point .text{
  font-size: 16px;
  font-weight: 700;
  color: #fff;
}
ul.pointList>li .btn_point .icon{
  font-family: "Material Icons";
  font-size: 22px;
  color: #fff;
}

/*------------------------------------------------
*    モーダル表示のためのCSS
-------------------------------------------------*/
/* モーダル共通 */
.hide-area{
	display: none;
}
.modaal-inner-wrapper{
  padding: 40px 25px !important;
}
@media screen and (max-width:768px) {
  .modaal-inner-wrapper{
    padding: 40px 15px !important;
  }
}
.modaal-content-container{
  padding: 30px 20px 80px;
}
@media screen and (max-width:768px) {
  .modaal-content-container{
    padding: 20px 15px 60px;
  }
}
/*全て共通：モーダルのボタンの色を変更したい場合*/
.modaal-close{
	background:#F8F8F8 !important;
  color: #666;
  border: 1px solid #ccc !important;
}
.modaal-close:after,
.modaal-close:before{
  color: #666;
	background:#444;
}
.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
	background:#666;
}
/*確認を促すモーダル：タイトルの色を変更したい場合*/
#modaal-title{
	font-size:1.2rem;
	text-align: center;
	margin: 0 0 20px 0;
}
/*動画表示のモーダル：余白を変更したい場合*/
.modaal-video .modaal-inner-wrapper{
	padding:0;
}

/* モーダル内容 */
/* モーダルタイトル */
.modal_ttlWrap {
  max-width: 1000px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 20px;
  border-bottom: 4px solid #0071BA;
  /* padding-bottom: 10px; */
  padding: 0 0 10px 20px;
  margin: 0 auto 30px;
}
@media screen and (max-width:768px) {
  .modal_ttlWrap {
    gap: 10px;
    margin: 0 auto 20px;
  }
}
/* モーダルタイトルアイコン */
.modal_ttlIcon {
  min-width: 76px;
  min-height: 76px;
  display: flex;
  justify-content: center;
  align-items: center;
  font-family: 'Roboto', sans-serif;
  font-size: 52px;
  font-weight: 700;
  color: #fff;
  line-height: 1.2;
  text-align: center;
  background-color: #0071BA;
  border-radius: 50px;
  box-shadow: -8px -4px 0 #4EBAFF;
}
@media screen and (max-width:768px) {
  .modal_ttlIcon {
    min-width: 60px;
    min-height: 60px;
    font-size: 40px;
  }
}
/* タイトルテキスト部 */
.modal_ttlText {
  margin-left: 0;
}
@media screen and (max-width:768px) {
  .modal_ttlText {
  }
}
/* タイトル・テキスト */
.modal_ttlSub {
  font-family: 'Roboto', sans-serif;
  font-size: 16px;
  font-weight: 300;
  color: #747474;
  padding-left: 3px;
  margin-bottom: -3px;
}
@media screen and (max-width:768px) {
  .modal_ttlSub{
    font-size: 15px;
  }
}

.modal_ttlMain {
  font-size: 32px;
  font-weight: 700;
  color: #333;
  line-height: 1.3;
}
@media screen and (max-width:768px) {
  .modal_ttlMain{
    font-size: 26px;
  }
}

/* モーダルコンテンツ */
.modal_conts{
}
.modal_conts ul.modalList{
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 30px;
}
@media screen and (max-width:768px) {
  .modal_conts ul.modalList{
    gap: 20px;
  }
}
ul.modalList li.modalItem{
  width: 100%;
  background-color: #F1F5FA;
  border: 1px solid #D9E3F0;
  border-radius: 20px;
  padding: 40px 30px 50px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  ul.modalList li.modalItem{
    padding: 30px 30px 30px;
  }
}
@media screen and (max-width:576px) {
  ul.modalList li.modalItem{
    padding: 20px 15px 30px;
  }
}
.modalItemInner{
  max-width: 900px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .modalItemInner{
    /* max-width: 500px; */
  }
}
li.modalItem .ttlWrap{
  /* width: 220px; */
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 30px;
  margin: 0 auto 40px;
}
@media screen and (max-width:768px) {
  li.modalItem .ttlWrap{
    flex-direction: column;
    align-items: flex-start;
    gap: 15px;
    margin: 0 auto 20px;
  }
}
li.modalItem .ttlWrap .ttlNoWrap{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 0;
  background-color: #0071BA;
  border: 3px solid #0071BA;
}
li.modalItem .ttlWrap .ttlNoWrap .no{
  width: 68px;
  font-family: 'Roboto', sans-serif;
  font-size: 37px;
  font-weight: 300;
  letter-spacing: 0.0em;
  text-align: center;
  color: #0071BA;
  background-color: #fff;
  padding: 0 8px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  li.modalItem .ttlWrap .ttlNoWrap .no{
    width: 55px;
    font-size: 27px;
    padding: 0 8px;
    margin: 0 auto;
  }
}
li.modalItem .ttlWrap .ttlNoWrap .text{
  width: 156px;
  height: 100%;
  display: inline-block;
  font-size: 24px;
  font-weight: 700;
  color: #fff;
  text-align: center;
  padding: 0;
}
@media screen and (max-width:768px) {
  li.modalItem .ttlWrap .ttlNoWrap .text{
    width: 140px;
    font-size: 21px;
    padding: 0;
  }
}
li.modalItem .ttlWrap .detail{
  font-size: 18px;
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (max-width:768px) {
  li.modalItem .ttlWrap .detail{
    font-size: 16px;
  }
}
/* モーダルコンテンツ内画像部 */
/* pointEnv 自然環境 */
.pointEnv .modal_imgWrap{
}
/* .modal_imgWrap .imgWrap{ */
.pointEnv .modal_imgWrap .imgWrap{
  display: flex;
  justify-content: center;
  align-items: flex-start;
  gap: 20px;
  margin-bottom: 30px;
}
/* 02 水害 */
.pointEnv .modalItem:nth-of-type(2) .modal_imgWrap .imgWrap{
  max-width: 900px;
  margin: 0 auto 10px;
}

.pointEnv .modal_imgWrap .imgWrap img{
  width: 48%;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .pointEnv .modal_imgWrap .imgWrap{
    flex-direction: column;
    gap: 20px;
    margin-bottom: 20px;
  }
  .pointEnv .modal_imgWrap .imgWrap img{
    width: 100%;
    max-width: 500px;
    margin: 0 auto;
  }
}
/* 出典リンク（共通） */
.modal_imgWrap .source{
  text-align: center;
}
.modal_imgWrap .source a{
  font-size: 15px;
  font-weight: 400;
  color: #0071BA;
  text-decoration: underline;
}
@media screen and (max-width:768px) {
  .modal_imgWrap .source{
    font-size: 13px;
    text-align: left;
  }
  .modal_imgWrap .source a{
    font-size: 13px;
  }
}

/* pointEnv インフラ */
.pointInfra .modal_imgWrap{
}
.pointInfra .modal_imgWrap .imgWrap{
  max-width: 700px;
  gap: 20px;
  background-color: #fff;
  margin: 0 auto;
}
/* 02 水資源の画像のみ */
.modalItem:nth-of-type(2) .modal_imgWrap .imgWrap{
  max-width: 700px;
  margin: 0 auto 10px;
}
/* 03 電力の画像のみ */
.modalItem:nth-of-type(3) .modal_imgWrap .imgWrap{
  max-width: 900px;
  margin: 0 auto 10px;
}
.pointInfra .modal_imgWrap .imgWrap img{
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .pointInfra .modal_imgWrap .imgWrap{
    gap: 20px;
    margin-bottom: 0px;
  }
  .pointInfra .modal_imgWrap .imgWrap img{
    max-width: 500px;
    margin: 0 auto;
  }
}

/* pointSupport サポート */
.pointSupport .modal_imgWrap{
}
.pointSupport .modal_imgWrap .imgWrap{
  max-width: 700px;
  gap: 20px;
  background-color: #fff;
  margin: 0 auto 30px;
}
.pointSupport .modal_imgWrap .imgWrap img{
  width: 100%;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .pointSupport .modal_imgWrap .imgWrap{
    gap: 20px;
    margin-bottom: 20px;
  }
  .pointSupport .modal_imgWrap .imgWrap img{
    max-width: 500px;
    margin: 0 auto;
  }
}


/*------------------------------------------------
*    outline
-------------------------------------------------*/
.outline{
  max-width: 1600px;
  background-color: #F8F7F3;
  margin: 0 auto;
}
.outline.section_space {
}
@media screen and (max-width:768px) {
  .outline.section_space {
    padding: 50px 15px 60px;
  }
}
/* outline */
.outline_conts{
  max-width: 1200px;
  margin: 0 auto;
}
/* 概要図 */
.outline_conts .overview{
  max-width: 800px;
  margin: 0 auto 50px;
}
@media screen and (max-width:768px) {
  .outline_conts .overview{
    margin: 0 auto 40px;
  }
}
.outline_conts .overview img{
}
/* 各部屋の詳細リスト */
.outline_conts ul.outlineList{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 40px;
  margin: 0 auto 40px;
}
@media screen and (max-width:768px) {
  .outline_conts ul.outlineList{
    max-width: 600px;
    gap: 30px;
    margin: 0 auto 60px;
  }
}
ul.outlineList>li.outlineItem{
  width: 100%;
  background-color: #fff;
  border-radius: 30px;
  box-shadow: 10px 10px 20px #0000000D;
  padding: 50px 15px 80px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  ul.outlineList>li.outlineItem{
    padding: 30px 15px 30px;
    margin: 0 auto;
  }
  /* 居室エリアのみ */
  ul.outlineList>li.outlineItem:nth-of-type(3){
    padding: 80px 15px 30px;
    margin: 0 auto;
  }
}
/* 居室ルームのみ：タイトル */
li.outlineItem.office .ttlOuter{
  position: relative;
}
li.outlineItem.office .ttlOuter .comment{
  max-width: 240px;
  position: absolute;
  top: -10%;
  right: 6%;
}
@media screen and (max-width:992px) {
  li.outlineItem.office .ttlOuter .comment{
    max-width: 240px;
    position: absolute;
    top: -10%;
    right: 0%;
  }
}
@media screen and (max-width:768px) {
  li.outlineItem.office .ttlOuter .comment{
    max-width: 230px;
    top: -162%;
    right: -22%;
    transform: translate(-50%, 0);
  }
}
li.outlineItem.office .ttlOuter .comment img{
}
li.outlineItem .ttlWrap{
  max-width: 360px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 15px;
  background-color: #00B4CB;
  padding: 6px 10px;
  margin: 0 auto 40px;
}
@media screen and (max-width:768px) {
  li.outlineItem .ttlWrap{
    padding: 6px 10px;
    margin: 0 auto 20px;
  }
}
li.outlineItem:nth-of-type(2) .ttlWrap{
  background-color: #009BC9;
}
li.outlineItem:nth-of-type(3) .ttlWrap{
  max-width: 300px;
  background-color: #00A54C;
}
li.outlineItem .ttlWrap .icon{
}
li.outlineItem .ttlWrap .icon img{
  max-width: 30px;
  margin: 0 0 0 auto;
}
li.outlineItem .ttlWrap .text{
  font-size: 28px;
  font-weight: 700;
  color: #fff;
}
@media screen and (max-width:768px) {
  li.outlineItem .ttlWrap .text{
    font-size: 22px;
  }
}
/* 各部屋の詳細表 */
.outlineItem>ul.specList{
  width: 100%;
  max-width: 700px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 0;
  margin: 0 auto 40px;
}
@media screen and (max-width:768px) {
  .outlineItem>ul.specList{
    max-width: 500px;
    gap: 5px;
    margin: 0 auto 20px;
  }
}
.specList>li.specItem{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  font-size: 15px;
  border-bottom: 1px solid #C3C3C3;
}
@media screen and (max-width:768px) {
  .specList>li.specItem{
    flex-direction: column;
    font-size: 14px;
    border-bottom: none;
  }
}
.specList>li.specItem:last-of-type{
  border: none;
}
.specItem .ttlItem{
  width: 30%;
  height: 100%;
  min-height: 50px;
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #EFE5DB;
  font-weight: 700;
  padding: 6px 20px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .specItem .ttlItem{
    width: 100%;
    min-height: auto;
    padding: 6px 10px;
  }
}
.specItem .dataItem{
  width: 70%;
  min-height: 50px;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  background-color: #F8F8F8;
  padding: 13px 20px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .specItem .dataItem{
    width: 100%;
    min-height: auto;
    justify-content: center;
    padding: 10px 10px;
  }
}
/* クリーンルーム①の表：高さ大きく */
.specList.clean1>.specItem:nth-of-type(4) .ttlItem,
.specList.clean1>.specItem:nth-of-type(4) .dataItem{
  min-height: 170px;
}
@media screen and (max-width:768px) {
  .specList.clean1>.specItem:nth-of-type(4) .ttlItem,
  .specList.clean1>.specItem:nth-of-type(4) .dataItem{
    min-height: auto;
  }
}
@media screen and (max-width:768px) {
  .specList.clean1>.specItem:nth-of-type(3) .ttlItem,
  .specList.clean1>.specItem:nth-of-type(3) .dataItem{
    min-height: auto;
  }
}
/* クリーンルーム②の表：高さ大きく */
.specList.clean2>.specItem:nth-of-type(4) .ttlItem,
.specList.clean2>.specItem:nth-of-type(4) .dataItem{
  min-height: 130px;
}
@media screen and (max-width:768px) {
  .specList.clean2>.specItem:nth-of-type(4) .ttlItem,
  .specList.clean2>.specItem:nth-of-type(4) .dataItem{
    min-height: auto;
  }
}
@media screen and (max-width:768px) {
  .specList.clean2>.specItem:nth-of-type(3) .ttlItem,
  .specList.clean2>.specItem:nth-of-type(3) .dataItem{
    min-height: auto;
  }
}
/* 居室エリアの表：高さ大きく */
.specList.office>.specItem:nth-of-type(1) .ttlItem,
.specList.office>.specItem:nth-of-type(1) .dataItem{
  min-height: 100px;
}
.specList.office>.specItem:nth-of-type(3) .ttlItem,
.specList.office>.specItem:nth-of-type(3) .dataItem{
  min-height: 140px;
}
@media screen and (max-width:768px) {
  .specList.office>.specItem:nth-of-type(1) .ttlItem,
  .specList.office>.specItem:nth-of-type(1) .dataItem{
    min-height: auto;
  }
  .specList.office>.specItem:nth-of-type(3) .ttlItem,
  .specList.office>.specItem:nth-of-type(3) .dataItem{
    min-height: auto;
  }
}
/* クリーンルーム①画像部 */
.outlineImg01{
  max-width: 800px;
  margin: 0 auto;
}
.outlineImg01 .imgWrap{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin: 0 auto 20px;
}
@media screen and (max-width:768px) {
  .outlineImg01 .imgWrap{
    max-width: 400px;
    flex-direction: column;
    gap: 10px;
    margin: 0 auto 10px;
  }
}
.outlineImg01 .imgWrap img{
  width: 50%;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .outlineImg01 .imgWrap img{
    width: 100%;
  }
}
.outlineImg01 .ttl{
  text-align: center;
}

/* クリーンルーム②画像部 */
.outlineImg02{
  max-width: 800px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .outlineImg02{
    flex-direction: column;
    gap: 10px;
    margin: 0 auto;
  }
}
.outlineImg02 .imgWrap{
  width: 50%;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 10px;
  margin: 0 auto 20px;
}
@media screen and (max-width:768px) {
  .outlineImg02 .imgWrap{
    max-width: 400px;
    width: 100%;
    gap: 10px;
    margin: 0 auto 20px;
  }
}
.outlineImg02 .imgWrap img{
  width: 100%;
  margin: 0 auto;
}
.outlineImg02 .imgWrap .ttl{
  font-size: 15px;
  text-align: center;
}

/* 居室エリア画像部 */
.outlineImg03{
  max-width: 800px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .outlineImg03{
    max-width: 400px;
    flex-direction: column;
    gap: 0px;
    margin: 0 auto;
  }
}
.outlineImg03 .imgWrap{
  width: 31%;
  margin: 0 auto 20px;
}
@media screen and (max-width:768px) {
  .outlineImg03 .imgWrap{
    width: 100%;
    margin: 0 auto 20px;
  }
}
.outlineImg03 .imgWrap img{
  width: 100%;
  margin: 0 auto;
}
/* 一部のレンタルも可能 */
.outlline_notice{
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .outlline_notice{
    max-width: 600px;
  }
}
.outlline_notice .ttlWrap{
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 10px;
  background-color: #AFA57E;
  /* background-color: #FED455; */
  border-radius: 30px 30px 0 0;
  padding: 10px 20px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .outlline_notice .ttlWrap{
    flex-direction: column;
    gap: 8px;
    padding: 10px 15px 20px;
  }
}
.outlline_notice .ttlWrap .imgWrap{
  max-width: 50px;
}
@media screen and (max-width:768px) {
  .outlline_notice .ttlWrap .imgWrap{
    max-width: 60px;
    margin-top: -42px;
  }
}
.outlline_notice .ttlWrap .imgWrap img{
}
.outlline_notice .ttlWrap .text{
  font-size: 20px;
  font-weight: 700;
  color: #fff;
}
@media screen and (max-width:768px) {
  .outlline_notice .ttlWrap .text{
    font-size: 18px;
  }
}
.outlline_notice .ttlWrap .text>span{
  background-color: #FED455;
  /* background-color: #fff; */
  padding: 0 10px;
  margin: 0 5px;
}
.outlline_notice .detailWrap{
  background-color: #fff;
  box-shadow: 10px 10px 20px #0000000D;
  border-radius: 0 0 30px 30px;
  padding: 30px 20px 40px;
}
@media screen and (max-width:768px) {
  .outlline_notice .detailWrap{
    padding: 20px 15px 30px;
  }
}
.outlline_notice>.detailWrap>ul{
  max-width: 700px;
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  gap: 8px;
  padding: 0 20px;
  margin: 0 auto 20px;
}
@media screen and (max-width:768px) {
  .outlline_notice>.detailWrap>ul{
    gap: 12px;
    padding: 0 0px;
    margin: 0 auto 20px;
  }
}
.outlline_notice>.detailWrap>ul>li{
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 10px;
}
@media screen and (max-width:768px) {
  .outlline_notice>.detailWrap>ul>li{
    flex-direction: column;
    align-items: flex-start;
    gap: 3px;
  }
}
.outlline_notice>.detailWrap>ul>li>.ttl{
  font-family: 'Roboto', sans-serif;
  font-size: 18px;
  font-weight: 700;
  color: #fff;
  background-color: #0071BA;
  padding: 3px 10px;
}
@media screen and (max-width:768px) {
  .outlline_notice>.detailWrap>ul>li>.ttl{
    font-size: 16px;
    padding: 3px 10px;
  }
}
.outlline_notice>.detailWrap>ul>li>.text{
  font-size: 18px;
  font-weight: 400;
  line-height: 1.2;
  color: #333;
}
@media screen and (max-width:768px) {
  .outlline_notice>.detailWrap>ul>li>.text{
    font-size: 16px;
  }
}
.outlline_notice>.detailWrap .comment{
  font-size: 20px;
  font-weight: 700;
  color: #333;
  text-align: center;
}
@media screen and (max-width:768px) {
  .outlline_notice>.detailWrap .comment{
    font-size: 18px;
  }
}



/*------------------------------------------------
*    access
-------------------------------------------------*/
.access{
  max-width: 1600px;
  background-color: #fff;
  margin: 0 auto;
}
.access.section_space {
  padding: 80px 20px 60px;
}
@media screen and (max-width:768px) {
  .access.section_space {
    padding: 50px 15px 40px;
  }
}
/* access */
.access_conts{
  max-width: 1200px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .access_conts{
    max-width: 500px;
  }
}
.access_conts>ul.accessList{
  max-width: 750px;
  display: flex;
  justify-content: center;
  align-items: flex-start;
  flex-direction: column;
  margin: 0 auto;
}
ul.accessList>li.accessItem{
  width: 100%;
  display: flex;
  justify-content: flex-start;
  align-items: center;
  gap: 70px;
  padding: 20px 20px 20px 20px;
}
ul.accessList>li.accessItem:first-of-type{
  padding: 0px 20px 20px 20px;
  border-bottom: 1px solid #B5B5B5;
}
ul.accessList>li.accessItem:nth-of-type(2){
  /* padding: 20px 20px 0px 20px; */
}
@media screen and (max-width:768px) {
  ul.accessList>li.accessItem{
    flex-direction: column;
    gap: 10px;
    padding: 20px 0px;
  }
}
li.accessItem>.iconWrap{
  max-width: 74px;
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  gap: 4px;
}
@media screen and (max-width:768px) {
  li.accessItem>.iconWrap{
    max-width: 64px;
    flex-direction: column-reverse;
    gap: 4px;
  }
}
li.accessItem>.iconWrap img{
}
li.accessItem>.iconWrap .text{
  font-size: 20px;
  font-weight: 700;
  color: #0071BA;
}
li.accessItem>.detailWrap{
  text-align: left;
}
@media screen and (max-width:768px) {
  li.accessItem>.detailWrap{
    text-align: center;
  }
}
li.accessItem>.detailWrap>.ttl{
  font-size: 20px;
  font-weight: 700;
  color: #0071BA;
  margin-bottom: 5px;
}
@media screen and (max-width:768px) {
  li.accessItem>.detailWrap>.ttl{
    font-size: 18px;
  }
}
li.accessItem>.detailWrap>.detail{
}
li.accessItem>.detailWrap>.detail>.ttlDetail{
  margin-bottom: 5px;
}
li.accessItem:nth-of-type(2) .detailWrap>.detail>.ttlDetail{
  font-weight: 700;
  margin-top: 20px;
}
/* 自動車のみ・リスト */
li.accessItem .detailWrap ul.routeList{
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  flex-direction: column;
  gap: 4px;
  /* margin-bottom: 20px; */
  margin: 0 auto 20px;
}
@media screen and (max-width:768px) {
  li.accessItem .detailWrap ul.routeList{
    max-width: 300px;
    text-align: left;
  }
}
ul.routeList li.routeItem{
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 10px;
  font-size: 16px;
}
@media screen and (max-width:768px) {
  ul.routeList li.routeItem{
    flex-direction: column;
    font-size: 15px;
    gap: 0;
    margin-bottom: 10px;
  }
}
ul.routeList li.routeItem .ttl{
  min-width: 110px;
}
ul.routeList li.routeItem .data{
  padding-left: 0;
}
@media screen and (max-width:768px) {
  ul.routeList li.routeItem .data{
    padding-left: 15px;
  }
}
li.accessItem .comment{
  font-size: 14px;
  font-weight: 400;
  color: #C30000;
}


/*------------------------------------------------
*    cta
-------------------------------------------------*/
.cta {
  max-width: 1600px;
  position: relative;
  background-image: url(../img/cta_bg.png);
  background-repeat: no-repeat;
	background-size: cover;
  background-position: bottom center;
  text-align: center;
  overflow: hidden;
  border-top: 1px solid #CBEFFF;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .cta {
    background-image: url(../img/cta_bg_sp.png);
  }
}
/* CTA人物 */
.ctaPerson{
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
}
@media screen and (max-width:768px) {
  .ctaPerson{
    gap: 0px;
  }
}
.ctaPerson img:nth-of-type(1){
  max-width: 210px;
}
.ctaPerson img:nth-of-type(2){
  max-width: 350px;
}
@media screen and (max-width:768px) {
  .ctaPerson{
  }
  .ctaPerson img:nth-of-type(1){
    max-width: 130px;
  }
  .ctaPerson img:nth-of-type(3){
    max-width: 190px;
  }
}
/* CTAインナー */
.ctaInner{
  max-width: 1000px;
  background-color: #fff;
  border-radius: 30px;
  box-shadow: 10px 10px 20px #0000000D;
  padding: 40px 20px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .ctaInner{
    padding: 40px 15px;
    margin: 0 auto;
  }
}
.cta.section_space {
  padding: 50px 20px 70px;
}
@media screen and (max-width:768px) {
  .cta.section_space {
    padding: 40px 20px 60px;
  }
}
/* CTAタイトル */
.cta .ttlWrap {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin-bottom: 30px;
}
@media screen and (max-width:768px) {
  .cta .ttlWrap{
    gap: 10px;
    margin-bottom: 20px;
    }
}
.cta .ttlWrap .icon{
  max-width: 37px;
}
@media screen and (max-width:768px) {
  .cta .ttlWrap .icon{
    max-width: 30px;
  }
}
.cta .ttlWrap .icon img{
}
.cta .ttlWrap .text{
  font-size: 30px;
  font-weight: 700;
  color: #0071BA;
}
@media screen and (max-width:768px) {
  .cta .ttlWrap .text{
    font-size: 26px;
  }
}
/* CTA詳細 */
.cta .detailWrap{
  max-width: 800px;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 20px;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .cta .detailWrap{
    flex-direction: column;
    gap: 20px;
    margin: 0 auto;
  }
}
/* CTAコンテンツ左 */
.cta .detailWrap>.detailL{
  width: 60%;
  border-right: 1px solid #CCCCCC;
  padding: 10px 20px;
}
@media screen and (max-width:768px) {
  .cta .detailWrap>.detailL{
    width: 100%;
    border-right: none;
    border-bottom: 1px solid #CCCCCC;
    padding: 0 0 20px;
  }
}
.cta .detailWrap>.detailL>.ttl{
  font-size: 23px;
  font-weight: 700;
  margin-bottom: 20px;
}
@media screen and (max-width:768px) {
  .cta .detailWrap>.detailL>.ttl{
    font-size: 17px;
    margin-bottom: 20px;
  }
}
.cta .detailWrap>.detailL .contactTel{
}
.cta .detailWrap>.detailL .contactTel>.ttl{
  font-size: 18px;
  font-weight: 400;
  margin-bottom: 10px;
}
@media screen and (max-width:768px) {
  .cta .detailWrap>.detailL .contactTel>.ttl{
    font-size: 16px;
    margin-bottom: 10px;
  }
}
.cta .detailWrap>.detailL .contactTel>ul{
  max-width: 260px;
  margin: 0 auto;
}
.cta .detailWrap>.detailL .contactTel>ul>li{
  display: flex;
  justify-content: flex-start;
  align-items: flex-start;
  gap: 10px;
}
.cta .detailWrap>.detailL .contactTel>ul>li>img{
  max-width: 35px;
}
@media screen and (max-width:768px) {
  .cta .detailWrap>.detailL .contactTel>ul>li>img{
    max-width: 30px;
  }
}
.cta .detailWrap>.detailL .contactTel>ul>li>.text{
  font-family: 'Roboto', sans-serif;
  font-size: 28px;
  font-weight: 700;
}
@media screen and (max-width:768px) {
  .cta .detailWrap>.detailL .contactTel>ul>li>.text{
    font-size: 26px;
  }
}
/* CTAコンテンツ右 */
.cta .detailWrap>.detailR{
  width: 40%;
  padding: 0 20px;
}
@media screen and (max-width:768px) {
  .cta .detailWrap>.detailR{
    width: 100%;
    padding: 0 20px;
    margin: 0 auto;
  }
}
.cta .detailWrap>.detailR>.ttl{
  margin-bottom: 10px;
}

/* CTAお問い合わせボタン */
.btn_cta {
  min-width: 160px;
  max-width: 250px;
  background: linear-gradient(to right, #00A6ED, #0072BB);
  box-shadow: 0px 3px 6px #00000029;
  border: 1px solid #00A6ED;
	border-radius: 30px;
  padding: 10px 13px 10px 24px;
  transition: all 0.4s ease 0s;
  margin: 0 auto;
}
@media screen and (max-width:768px) {
  .btn_cta {
    margin: 0 auto;
  }
}
.btn_cta a{
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 15px;
	font-weight: 700;
  color: #fff;
  transition: all 0.4s ease 0s;
}
.btn_cta:hover {
  background: #fff;
  border: 1px solid #05437D;
}
.btn_cta:hover a {
  color: #00559D;
}



/*------------------------------------------------
*    footer
-------------------------------------------------*/

footer {
  height: 60px;
  text-align: center;
}
@media screen and (max-width:576px) {
  footer {
    /* height: 130px; */
    text-align: center;
  }
}
/* ページトップ */
.pageTop{
  display: flex;
  justify-content: center;
  align-items: center;
  background-color: #EDEDED;
  font-size: 14px;
  padding: 10px 20px;
}
.pageTop i{
  font-size: 18px;
  padding-left: 3px;
}
.pageTop:hover{
  opacity: 0.8;
}



/* フッターナビ */
.footerNav {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  box-shadow: 0px -1px 10px #dfdfdf;
  padding: 20px;
}
.footerNav ul {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
}
.footerNav ul li {
  font-size: 14px;
  font-weight: 400;
  margin-right: 20px;
}
@media screen and (max-width:768px) {
  .footerNav {
    padding: 10px 8px;
    margin: 0 auto;
  }
  .footerNav ul {
    justify-content: space-around;
  }
  .footerNav ul li {
    margin-right: 10px;
  }
}

/* コピーライト */
footer .copyrightWrap {
  width: 100%;
  background-color: #3E3200;
  padding: 20px 20px;
}
@media screen and (max-width:768px) {
  footer .copyrightWrap {
    padding: 20px 15px;
  }
}
footer .copyright {
  font-size: 10px;
  font-weight: 400;
  color: #fff;
  margin: 0 auto;
}

/*------------------------------------------------
*    btn_totop #page-top
-------------------------------------------------*/
#page-top {
  position: fixed;
  opacity: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 72px;
  height: 72px;
  right: 20px;
  bottom: 10px;
  font-size: 36px;
  font-weight: bold;
  color: #fff;
  background: #00223D;
  box-shadow: 0px 3px 6px #00000029;
  border: 1px solid #fff;
  border-radius: 50%;
  cursor: pointer;
  z-index: 100;
  transition: all 0.4s ease 0.3s;
  margin-right: 10px;
}
@media screen and (max-width:768px) {
  #page-top {
    width: 64px;
    height: 64px;
    right: 0px;
    bottom: 5px;
    font-size: 29px;
  }
}
#page-top .arrow{
  max-width: 22px;
  margin: -10px auto 7px;
}
#page-top .imgText{
  max-width: 54px;
  margin: 0 auto;
}
#page-top.fade-in {
  opacity: 0.85;
  transition: opacity 1s;
}
#page-top:hover {
  transition: 0.3s;
  right: 20px;
  bottom: 15px;
  opacity: 0.8;
}
@media screen and (max-width:768px) {
  #page-top:hover {
    transition: 0.3s;
    right: 0px;
    bottom: 5px;
    opacity: 0.7;
  }
}

/*------------------------------------------------
*    フローティングボタン（SP）
*    btn_fix_sp #btn_fix_sp
-------------------------------------------------*/
#btn_fix_sp {
  display: none;
}
@media screen and (max-width:992px) {
  #btn_fix_sp {
    display: inline;
    width: 90%;
    max-width: 300px;
    transition: all 0.3s;
    position: fixed;
    left: 30%;
    bottom: 5px;
    transform: translateY(-50%);
    z-index: 100;
    opacity: 0;
    box-shadow: 2px 2px 8px #00000029;
    transition: all 0.4s ease 0s;
    padding: 8px 25px;
    margin-left: 20px;
  }
}
#btn_fix_sp:hover {
  opacity: 0.8;
}
@media screen and (max-width:576px) {
  #btn_fix_sp {
    width: 90%;
    max-width: 250px;
    left: 0%;
    bottom: 10px;
  }
}
@media screen and (max-width:360px) {
  #btn_fix_sp {
    width: 90%;
    max-width: 180px;
    left: 0%;
    bottom: 10px;
    padding: 10px 20px;
  }
}
#btn_fix_sp a{
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 16px;
  font-weight: 700;
  color: #fff;
  transition: all 0.4s ease 0s;
}
#btn_fix_sp a .icon{
  margin-right: 10px;

}
#btn_fix_sp a .icon i{
  position: absolute;
  top: 50%;
  left: 18px;
  transform: translateY(-50%);
  z-index: 3;
  font-size: 22px;
  color:#fff
}
#btn_fix_sp a .text{
  position: relative;
  top: 50%;
  left: 10px;
  /* transform: translateY(-50%); */
  z-index: 3;
}
#btn_fix_sp br{
  display: none;
}
@media screen and (max-width:360px) {
  #btn_fix_sp br{
    display: block;
  }
}


/* 上に上がる動き */
#btn_fix_sp.UpMove {
  animation: UpAnime 0.5s forwards;
}
@keyframes UpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
/* 下に下がる動き */
#btn_fix_sp.DownMove {
  animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime {
  from {
    opacity: 1;
    transform: translateY(0);
  }
  to {
    opacity: 1;
    transform: translateY(100px);
  }
}