@charset "UTF-8";

/* ====== 共通 ====== */

/* 画面上部の帯 */
#top_belt { max-width:660px;height:10px;background:#fff;margin:0 auto; }
/*スライダー全体のコンテナー*/
#stage {
	position: relative;
	max-width: 660px;
	margin: 0 auto;
	background:#000;
	overflow: hidden;
     
}
/*全ラジオボタンを非表示に*/
#r1,#r2,#r3,#r4,#r5,#back1,#back2,#back3,#back4,#back5,#next1,#next2,#next3,#next4,#next5 {
	display: none;
}
/* 表示切換えボタンと表示位置 */
.circ img {
	position: absolute;
	bottom:2.5%;
	cursor: pointer;
}
#lb1 img { left: 40%;width:3%; }
#lb2 img { left: 43%;width:3%; }
#lb3 img { left: 46%;width:3%; }
#lb4 img { left: 49%;width:3%; }
#lb5 img { left: 52%;width:3%; }
/* 左右送りボタン */
.pb, .nb { color:#fff;font-weight:bold; font-size:26px;display:block;position:absolute;top:45%;/*z-index:200;pointer-events:auto;*/}
.pb { left:0%; }
.nb { left:96%; }
.pb:hover, .nb:hover { color:orange; cursor:pointer; }
/* stageが初期サイズ以下のなったときのサイズ */
@media screen and (max-width: 660px) { .pb, .nb { font-size:18px; } }
/*全表示スライドのコンテナー*/
#photos {
	position: absolute;
	width:100%;
	height:90%; /*100%;*/
	left: 4.55%;
	opacity:0;
	/*pointer-events: none;*/
	animation:flowSlides 40s infinite;
}
/* 個々のスライド・現スライド標示ボタン */
.pic {
	position: absolute;
	width:100%;
	height:100%;
}
.pic img:nth-child(1) { width:90.9%; margin-left:4.55%; }
.pic img:nth-child(2) { width:3%; bottom:-8.5%; /*2.5%;*/ }

/*表示スライドをphotosの中に横並びで一列に並べる*/
#photo1 { left: 0; }
#photo2 { left: 660px; }
#photo3 { left: 1320px; }
#photo4 { left: 1980px; }
#photo5 { left: 2640px; }
/* 写真の下に現スライド標示ボタンを配置 */
#photo1 img:nth-child(2) { position:absolute;left:40%;width:3%; }
#photo2 img:nth-child(2) { position:absolute;left:43%;width:3%; }
#photo3 img:nth-child(2) { position:absolute;left:46%;width:3%; }
#photo4 img:nth-child(2) { position:absolute;left:49%;width:3%; }
#photo5 img:nth-child(2) { position:absolute;left:52%;width:3%; }
/*チェックされたドットに相当するスライドが画面中央になるようにphotosを移動*/
#r1:checked ~ #photos { animation:flowSlides1 40s infinite; animation-delay: 0s; }
#r2:checked ~ #photos { animation:flowSlides2 40s infinite; animation-delay:-8s; }
#r3:checked ~ #photos { animation:flowSlides3 40s infinite; animation-delay:-16s; }
#r4:checked ~ #photos { animation:flowSlides4 40s infinite; animation-delay:-24s; }
#r5:checked ~ #photos { animation:flowSlides5 40s infinite; animation-delay:-32s; }
/* 左右送りボタン */
#back1:checked ~ #photos { animation:flowSlides5 40s infinite; animation-delay:-32s; }
#back2:checked ~ #photos { animation:flowSlides1 40s infinite; animation-delay: 0s; }
#back3:checked ~ #photos { animation:flowSlides2 40s infinite; animation-delay:-8s; }
#back4:checked ~ #photos { animation:flowSlides3 40s infinite; animation-delay:-16s; }
#back5:checked ~ #photos { animation:flowSlides4 40s infinite; animation-delay:-24s; }
#next1:checked ~ #photos { animation:flowSlides2 40s infinite; animation-delay:-8s; }
#next2:checked ~ #photos { animation:flowSlides3 40s infinite; animation-delay:-16s; }
#next3:checked ~ #photos { animation:flowSlides4 40s infinite; animation-delay:-24s; }
#next4:checked ~ #photos { animation:flowSlides5 40s infinite; animation-delay:-32s; }
#next5:checked ~ #photos { animation:flowSlides1 40s infinite; animation-delay: 0s; }
/* 初期スライドショー */
@keyframes flowSlides {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.01% { left:-660px; opacity:0; }
	22% { left:-660px; opacity:1; }
	38% { left:-660px; opacity:1; }
	40% { left:-660px; opacity:0; }
	40.01% { left:-1320px; opacity:0; }
	42% { left:-1320px; opacity:1; }
	58% { left:-1320px; opacity:1; }
	60% { left:-1320px; opacity:0; }
	60.01% { left:-1980px; opacity:0; }
	62% { left:-1980px; opacity:1; }
	78% { left:-1980px; opacity:1; }
	80% { left:-1980px; opacity:0; }
	80.01% { left:-2640px; opacity:0; }
	82% { left:-2640px; opacity:1; }
	98% { left:-2640px; opacity:1; }
	100% { left:-2640px; opacity:0; }
}
/* 各スライド向けスライドショー */
@keyframes flowSlides1 {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.01% { left:-660px; opacity:0; }
	22% { left:-660px; opacity:1; }
	38% { left:-660px; opacity:1; }
	40% { left:-660px; opacity:0; }
	40.01% { left:-1320px; opacity:0; }
	42% { left:-1320px; opacity:1; }
	58% { left:-1320px; opacity:1; }
	60% { left:-1320px; opacity:0; }
	60.01% { left:-1980px; opacity:0; }
	62% { left:-1980px; opacity:1; }
	78% { left:-1980px; opacity:1; }
	80% { left:-1980px; opacity:0; }
	80.01% { left:-2640px; opacity:0; }
	82% { left:-2640px; opacity:1; }
	98% { left:-2640px; opacity:1; }
	100% { left:-2640px; opacity:0; }
}
@keyframes flowSlides2 {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.01% { left:-660px; opacity:0; }
	22% { left:-660px; opacity:1; }
	38% { left:-660px; opacity:1; }
	40% { left:-660px; opacity:0; }
	40.01% { left:-1320px; opacity:0; }
	42% { left:-1320px; opacity:1; }
	58% { left:-1320px; opacity:1; }
	60% { left:-1320px; opacity:0; }
	60.01% { left:-1980px; opacity:0; }
	62% { left:-1980px; opacity:1; }
	78% { left:-1980px; opacity:1; }
	80% { left:-1980px; opacity:0; }
	80.01% { left:-2640px; opacity:0; }
	82% { left:-2640px; opacity:1; }
	98% { left:-2640px; opacity:1; }
	100% { left:-2640px; opacity:0; }
}
@keyframes flowSlides3 {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.01% { left:-660px; opacity:0; }
	22% { left:-660px; opacity:1; }
	38% { left:-660px; opacity:1; }
	40% { left:-660px; opacity:0; }
	40.01% { left:-1320px; opacity:0; }
	42% { left:-1320px; opacity:1; }
	58% { left:-1320px; opacity:1; }
	60% { left:-1320px; opacity:0; }
	60.01% { left:-1980px; opacity:0; }
	62% { left:-1980px; opacity:1; }
	78% { left:-1980px; opacity:1; }
	80% { left:-1980px; opacity:0; }
	80.01% { left:-2640px; opacity:0; }
	82% { left:-2640px; opacity:1; }
	98% { left:-2640px; opacity:1; }
	100% { left:-2640px; opacity:0; }
}
@keyframes flowSlides4 {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.01% { left:-660px; opacity:0; }
	22% { left:-660px; opacity:1; }
	38% { left:-660px; opacity:1; }
	40% { left:-660px; opacity:0; }
	40.01% { left:-1320px; opacity:0; }
	42% { left:-1320px; opacity:1; }
	58% { left:-1320px; opacity:1; }
	60% { left:-1320px; opacity:0; }
	60.01% { left:-1980px; opacity:0; }
	62% { left:-1980px; opacity:1; }
	78% { left:-1980px; opacity:1; }
	80% { left:-1980px; opacity:0; }
	80.01% { left:-2640px; opacity:0; }
	82% { left:-2640px; opacity:1; }
	98% { left:-2640px; opacity:1; }
	100% { left:-2640px; opacity:0; }
}
@keyframes flowSlides5 {
	0% { left:0px; opacity:0; }
	2% { left:0px; opacity:1; }
	18% { left:0px; opacity:1; }
	20% { left:0px; opacity:0; }
	20.01% { left:-660px; opacity:0; }
	22% { left:-660px; opacity:1; }
	38% { left:-660px; opacity:1; }
	40% { left:-660px; opacity:0; }
	40.01% { left:-1320px; opacity:0; }
	42% { left:-1320px; opacity:1; }
	58% { left:-1320px; opacity:1; }
	60% { left:-1320px; opacity:0; }
	60.01% { left:-1980px; opacity:0; }
	62% { left:-1980px; opacity:1; }
	78% { left:-1980px; opacity:1; }
	80% { left:-1980px; opacity:0; }
	80.01% { left:-2640px; opacity:0; }
	82% { left:-2640px; opacity:1; }
	98% { left:-2640px; opacity:1; }
	100% { left:-2640px; opacity:0; }
}
































h9 {
  color: #ff0000;/*文字色*/
  /*線の種類（点線）2px 線色*/
  border-bottom: dashed 2px #ff0000;
}


.bn13 {
  display: inline-block;
  padding: 0.65em 1.6em;
  border: 3px solid #000;
  margin: 0 0.3em 0.3em 0;
  border-radius: 0.12em;
  box-sizing: border-box;
  text-decoration: none;
  font-family: "Roboto", sans-serif;
  font-weight: 300;
  color: #000;
  text-align: center;
  transition: all 0.2s;
  animation: bn13bouncy 5s infinite linear;
  position: relative;
}

.bn13:hover {
  background-color: white;
  color: #000000;
}

@keyframes bn13bouncy {
  0% {
    top: 0em;
  }
  40% {
    top: 0em;
  }
  43% {
    top: -0.9em;
  }
  46% {
    top: 0em;
  }
  48% {
    top: -0.4em;
  }
  50% {
    top: 0em;
  }
  100% {
    top: 0em;
  }
}


























h6{
	background-color: #336633; /* 背景色 */
	color: #fff; /* 文字色 */
	overflow: hidden;
	padding: 10px;  /* 余白 */
	position: relative;
}
h6:before{
	background-color: #fff; /* 切り替わる色1 */
	content: '';
	display: block;
	opacity: 0.3; /* 不透明度 */
	transform: rotate(-50deg);
	position: absolute;
	bottom: -10px;
	right: -330px;
	width: 500px;
	height: 500px;
}
h6:after{
	background-color: #fff; /* 切り替わる色2 */
	content: '';
	display: block;
	opacity: 0.3; /* 不透明度 */
	transform: rotate(-70deg);
	position: absolute;
	bottom: -100px;
	right: -500px;
	width: 500px;
	height: 500px;
}














/* BOXデザイン022 */
.div_design022 {
  width: 300px;
  position: relative;
  background: #C5b8a6;
  -webkit-box-shadow: 0px 0px 0px 5px #a7825e;
          box-shadow: 0px 0px 0px 5px #a7825e;
  border: dashed 2px #fff;
  padding: 1em 1em;
  color: #fff;
}

.div_design022 :after {
  position: absolute;
  content: '';
  right: -7px;
  top: -7px;
  border-width: 0 15px 15px 0;
  border-style: solid;
  border-color: #ddd #fff rgba(244, 160, 6, 0.1);
  -webkit-box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.15);
          box-shadow: -1px 1px 1px rgba(0, 0, 0, 0.15);
}

.div_design022 p {
  margin: 0;
  padding: 0;
}





/* メニューを固定最下部 */
.menu {
  width: 100%;
  position: fixed;
  bottom: 10px;
  z-index:999;
}

/* BOXデザイン013 */
.div_design013 {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;

}

.div_design013 .div_design013_inner {
  background: #547d65;
  width: 300px;
  height: 100px;
  margin: 5px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-pack: center;
      -ms-flex-pack: center;
          justify-content: center;
  -webkit-box-align: center;
      -ms-flex-align: center;
          align-items: center;
  cursor: pointer;
  border: solid #111 1px;
  color: #fff;
}

.div_design013 .div_design013_inner p {
  font-family: 'Train One', cursive;
  font-size: 1rem;
  width: auto;
  margin: 0;
  padding: 1rem;
  display: block;
  text-align: center;
}

.div_design013 .div_design013_inner:hover {
  background: #c7b9a3;
}

.div_design013 .div_design013_inner:hover p {
  font-size: 1.1rem;
}








h5 {
  padding: 1.65rem 2rem;
  color: #e5004f;
  background-color: transparent;
  background-image: linear-gradient(45deg, #738f6f 25%, transparent 25%, transparent 75%, #738f6f 75%, #738f6f),
    linear-gradient(45deg, #738f6f 25%, transparent 25%, transparent 75%, #738f6f 75%, #738f6f);
  background-size: 40px 40px;
  background-position: 0 0, 20px 20px;
}






.column-wrapper {
  width: 100%;
  display: flex;
}
:nth-of-type(even) {
flex-direction: row-reverse;
}
.column1, .column2 {
  width: 50%;
  display: flex;
  align-items: center;
}
.column1 {
  background: 	#336633;
  padding: 60px;
  box-sizing: border-box;
}
.column-wrapper:nth-of-type(2n) .column1:nth-of-type(1){
  background: #b5ffb6;
}
.column1title {
  font-size: 25px;
}
.column1txt {
  font-size: 15px;
}
.column2 img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
@media screen and ( max-width:500px )
{
  .column-wrapper {
    flex-direction: column-reverse;
  }
  .column1, .column2 {
  width: 100%;
}
  .column1 {
  padding: 25px;
} 
}
@import "https://use.fontawesome.com/releases/v5.13.0/css/all.css";



.btn,
a.btn,
button.btn {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  display: inline-block;
  
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
  position: auto;
  
  
  
  
}

a.btn--circle {
  width: 100px;
  height: 100px;
  padding: 0px 0 0;
  border-radius: 50%;
  color: #fff;
  background: #ffb624;
  -webkit-box-shadow: 0 7px 0 #e89a00;
  box-shadow: 0 7px 0 #e89a00;
}

a.btn--circle i {
  font-size: 150%;
}

.fas-position-bottom {
  position: absolute;
  bottom: 1rem;
  left: calc(50% - 0.5rem);
}

a.btn--circle:hover {
  -webkit-transform: translate(0, 4px);
  transform: translate(0, 4px);
  color: #fff;
  -webkit-box-shadow: 0 3px 0 #e89a00;
  box-shadow: 0 3px 0 #e89a00;
}










.btn2,
a.btn2,
button.btn2 {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
  position: auto;
 
  
}

a.btn--circle2 {
  width: 100px;
  height: 100px;
  padding: 0px 0 0;
  border-radius: 50%;
  color: #fff;
  background: #17c24d;
  -webkit-box-shadow: 0 7px 0 #0e8032;
  box-shadow: 0 7px 0 #0e8032;
}

a.btn--circle2 i {
  font-size: 150%;
}

.fa-position-bottom {
  position: absolute;
  bottom: 1rem;
  left: calc(50% - 0.5rem);
}

a.btn--circle2:hover {
  -webkit-transform: translate(0, 4px);
  transform: translate(0, 4px);
  color: #fff;
  -webkit-box-shadow: 0 3px 0 #0e8032;
  box-shadow: 0 3px 0 #0e8032;
}



.btn3,
a.btn3,
button.btn3 {
  font-size: 1.6rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
  position: auto;
  
  
}

a.btn--circle3 {
  width: 100px;
  height: 100px;
  padding: 0px 0 0;
  border-radius: 50%;
  color: #fff;
  background: #CF2E92;
  -webkit-box-shadow: 0 7px 0 #9e247c;
  box-shadow: 0 7px 0 #9e247c;
}

a.btn--circle3 i {
  font-size: 150%;
}

.fab-position-bottom {
  position: absolute;
  bottom: 1rem;
  left: calc(30% - 0.5rem);
}

a.btn--circle3:hover {
  -webkit-transform: translate(0, 4px);
  transform: translate(0, 4px);
  color: #fff;
  -webkit-box-shadow: 0 3px 0 #9e247c;
  box-shadow: 0 3px 0 #9e247c;
}











.btn4,
a.btn4,
button.btn4 {
  font-size: 1.0rem;
  font-weight: 700;
  line-height: 1.5;
  position: relative;
  display: inline-block;
  
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #212529;
  border-radius: 0.5rem;
  position: auto;
  
  
}

a.btn--circle4 {
  width: 50px;
  height: 50px;
  padding: 0px 0 0;
  border-radius: 50%;
  color: #000;
  background: #fff;
  -webkit-box-shadow: 0 7px 0 #ddd;
  box-shadow: 0 7px 0 #ddd;
}

a.btn--circle4 i {
  font-size: 150%;
}

.fas-position-bottom {
  position: absolute;
  bottom: 1rem;
  left: calc(30% - 0.5rem);
}

a.btn--circle4:hover {
  -webkit-transform: translate(0, 4px);
  transform: translate(0, 4px);
  color: #000;
  -webkit-box-shadow: 0 3px 0 #ddd;
  box-shadow: 0 3px 0 #ddd;
}














.tel-number {
    color:#000 !important;
    text-decoration:none !important;
    }









a:hover {
  text-decoration: none;
  opacity: 0.8;
}







.kaisha {
width: 100%;
}

.kaisha th,
.kaisha td {
border: 1px solid #ccc;
padding: 20px;
}

.kaisha th {
font-weight: bold;
background-color: #dedede; 
}

@media screen and (max-width: 767px) {
.kaisha,
.kaisha tr,
.kaisha td,
.kaisha th {display:block;}
.kaisha th {width:auto;}
}

.sample1{
  display     : inline-block;
  font-size   : 160%;
  font-weight : bold;
  color       : #ffffff;
  text-shadow:  2px  2px 10px #777 ,
               -2px  2px 10px #777 ,
                2px -2px 10px #777 ,
               -2px -2px 10px #777; 
}


.sample {
	margin: 16px auto;
	text-align: center;
	display: block;
	border: 0px solid #000;
}
.sample .text {
	text-align: left;
	display: inline-block;
}


table{
  width: 100%;
  border-spacing: 0;
}

table th{
  border-bottom: solid 2px #006b1e;
  padding: 10px 0;
  text-align: center;
}

table td{
  border-bottom: solid 2px #ddd;
  text-align: center;
  padding: 10px 0;
}


.ryokin {
width: 100%;

}

.ryokin th,
.ryokin td {
border: 1px solid #ccc;
padding: 15px;
}

.ryokin th {
font-weight: bold;
background-color: #dedede; 
}

@media screen and (max-width: 767px) {
.ryokin,
.ryokin tr,
.ryokin td,
.ryokin th {display:block;}
.ryokin th {width:auto;}
}



.plan {
width: 100%;
}

.plan th,
.plan td {
border: 1px solid #ccc;
padding: 15px;
}

.plan th {
font-weight: normal;

background-color: #fff; 
}

@media screen and (max-width: 767px) {
.plann,
.plan tr,
.plan td,
.plan th {display:block;}
.plan th {width:auto;}
}














.table7{

border-collapse: collapse;
border-right: 1px solid #8fd2ed;
}
.table7 th{

padding: 10px;
background-color: #cee7ff;
border-left: 5px solid #8fd2ed; 
border-top: 1px solid #fff;
}
.table7 td{

padding: 10px;
background-color: #fff;
border: 1px solid #999;
}



.top-banner{
	display: flex;
	flex-wrap:wrap;
}
.top-banner li {
	width: calc(100%/4);/*←画像を横に4つ並べる場合*/
	padding:0 5px;/*←画像の左右に5pxの余白を入れる場合*/
	box-sizing:border-box;
}
.top-banner li img {
	max-width:100%; /*画像のはみだしを防ぐ*/
	height: auto; /*画像の縦横比を維持 */
	border:solid 3px #ccc; /*←画像を1pxのグレーの枠線で囲む指定の場合*/
}




.hidden_box {
	margin: 10px 0;
	padding: 0;
	text-align: center;
}

.hidden_box label {
	border: 1px solid #ddd;
	border-radius: 5px;
	cursor: pointer;
	font-weight: bold;
	margin: 0 auto;
	padding: 10px;
	min-width: 50%;
}

.hidden_box label:hover {
	background: #f5f5f5;
}

.hidden_box label:after {
	content: "について▼";	/* 閉じている状態のときにラベルの後ろに続く文字 */
}

.hidden_box input {
	display: none;
}

.hidden_box .hidden_show {
	height: 0;
	overflow: hidden;
	opacity: 0;
	padding: 0;
	text-align: left;
	transition: 0.5s;
}

.hidden_box input:checked + label:after {
	content: "について閉じる▲";	/* 開いている状態のときにラベルの後ろに続く文字 */
}

.hidden_box input:checked ~ .hidden_show {
	height: auto;
	opacity: 1;
	padding: 10px 0;
}



































/* ====== TOTOP ====== */
/* ページトップ */


#page-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-size: 80%;
}

#page-top a {
  background: #666;
  text-decoration: none;
  color: #fff;
  width: 100px;
  padding: 25px 0;
  text-align: center;
  display: block;
  border-radius: 10px;
}

#page-top a:hover {
  text-decoration: none;
  background: #999;
}

.btn-outline-secondary:hover,
.btn-outline-secondary:not(:disabled):not(.disabled).active {
  color: #6c757d !important;
}

/* ====== TOP IMAGE ====== */

header.top-page {
  hidden: 100vh;
  overflow: hidden;
  padding-right: 0;
  padding-left: 0;
 
}

/* ====== TOPPAGE SECTION ====== */

#sec1 .card:nth-of-type(2) {
  border-left: none;
  border-right: none;
}

.ttl-bdr {
  font-size: 3rem;
  line-height: 1.5;
  position: relative;
  margin-bottom: 50px;
}

.ttl-bdr::before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  border-bottom: 1px solid #000;
  width: 100%;
  margin: 0 auto -15px;
}

#sec3 {
  background-image: url("../img/12.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}


#sec7 {
  background-color: #eef5ed;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}



#sec4 table {
  width: 100%;
  background-color: #CCC;
  font: 12px;
  color: #666;
  table-layout: fixed;
  border-collapse: collapse;
}

#sec4 table th,
#sec4 table td {
  padding: 10px;
  text-align: center;
  border: 1px solid #ccc;
}

#sec4 table th {
  background-color: #002795;
  color: #fff;
}

#sec4 table td {
  width: 14.2%;
}

#sec4 table td:nth-child(7n) {
  background-color: #5197E0;
  color: #fff;
}

#sec4 table td:nth-child(7n+1) {
  background-color: #FF8A8C;
  color: #fff;
}

/* ====== SNS ====== */
.social img {
  width: 36px;
  height: 36px;
}

/* ====== SNS ====== */

iframe {
  width: 100%;
  height: 450px;
}

/* ====== FOOTER ====== */
.footer-logo {
  width: 50%;
}

/* =============================================
メディアクエリ
============================================= */

/* 大デバイス（デスクトップ, 1200px 未満）
==============================================*/
@media screen and (max-width: 1199.98px) {
  .herounit h1 {
    margin-top: 10rem;
  }
}

/* END */
/* 中デバイス（タブレット, 992px 未満）
==============================================*/
@media screen and (max-width: 991.98px) {
  .container {
    max-width: 740px;
  }
}

/* END */
/* 小デバイス（横向きモバイル, 768px 未満）
==============================================*/
@media screen and (max-width: 767.98px) {
  h1 {
    font-size: 2rem;
    font-weight: bold;
    line-height: 1.2;
  }



  header .navbar-brand {
    width: 70%;
  }

  header .navbar-brand .logo {
    width: 100%;
  }

  header .navbar-nav {
    border-top: 1px solid #fff;
  }

  .footer-logo {
    width: 100%;
  }

}

/* END */
/* 極小デバイス（縦向きモバイル, 576px 未満）
==============================================*/
@media screen and (max-width: 575.98px) {
  .display-3 {
    line-height: 0.8em;
  }

  .display-4 {
    font-size: 2rem;
    line-height: 1.2;
  }

}

/* パソコンで見たときは"pc"のclassがついた画像が表示される */
.pc { display: block !important; }
.sp { display: none !important; }

/* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
@media only screen and (max-width: 750px) {
    .pc { display: none !important; }
    .sp { display: block !important; }
}


/* 画面幅の50%の幅で画像を表示 */
.image-vw {
  width : 30vw ; 
}

/* 画面幅の50%の幅で画像を表示 */
.image-vr {
  width : 85vw ; 
}


/* メニューを固定最下部 */
.menu {
  width: 100%;
  position: fixed;
  bottom: 10px;
  z-index:999;
}

/* リンク色変更 */
a {
  color: white;
  text-decoration: none;
}


}





/* スライダー画像は画面幅いっぱいに */
.carousel-item img {
  height: auto;
  max-height: 80vh;
  object-fit: cover;
}

/* インジケーターと左右矢印の色調整 */
.carousel-indicators li {
  background-color: rgba(255, 255, 255, 0.7);
}
.carousel-indicators .active {
  background-color: #ffc107;
}
.carousel-control-prev-icon,
.carousel-control-next-icon {
  filter: invert(100%);
}



@media (max-width: 600px) {
  /* フォーム全体のcontainerも100%幅 */
  .contact-form-section .container {
    max-width: 100% !important;
    width: 100% !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }

  /* フォーム本体も横幅100%、左右マージン0に */
  .contact-form {
    max-width: 100% !important;
    width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0.7em !important;
    padding-right: 0.7em !important;
    box-sizing: border-box !important;
  }

  /* 見出しを大きく崩れないように調整 */
  .section-title {
    font-size: 1.3rem !important;
    text-align: center !important;
    word-break: keep-all;
    white-space: normal;
    padding-left: 0.2em !important;
    padding-right: 0.2em !important;
  }
}


/* END */