body {
	  font-family: 'M PLUS Rounded 1c', 'ヒラギノ角ゴ Pro', 'Hiragino Kaku Gothic Pro', 'メイリオ', 'Meiryo',
    'Noto Sans Japanese', Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif;
		background-image: url("../img/back1.png");
		background-size: cover; 
}

/* ヘッダー見出し文字サイズ */
h1{
  font-size: 24px;
  color: #fff;
}
h2{
  font-size: 24px;
  padding: 1rem 3rem;
  -webkit-transform: skew(-15deg);
  transform: skew(-15deg);
  color: #fff;
  background-image: -webkit-gradient(linear, left top, right top, from(#209cff), to(#17a2b8));
  background-image: -webkit-linear-gradient(left, #209cff 0%, #17a2b8 100%);
  background-image: linear-gradient(to right, #209cff 0%, #17a2b8 100%);
}
h3{
  font-size: 22px;
  color: #fff;
}
a {
  font-size: 18px;
  color: #fff;
}

.btn-info {
  background: #17a2b8; /*好きな色; //ボタンの背景色*/
  color: #fff; /*好きな色; //ボタンのテキストの色*/
}
.btn-info:hover, .btn-info:focus, 
.btn-info:active, .btn-info:active:focus, .btn-info:active:hover, .btn-info:active.focus,
.btn-info.active, .btn-info.active:focus, .btn-info.active:hover, .btn-info.active.focus,
.open > .dropdown-toggle.btn-info, 
.open > .dropdown-toggle.btn-info:hover,
.open > .dropdown-toggle.btn-info:focus, 
.open > .dropdown-toggle.btn-info.focus,
.btn-info.disabled:hover, .btn-info[disabled]:hover, fieldset[disabled] .btn-info:hover,
.btn-info.disabled:focus, .btn-info[disabled]:focus, fieldset[disabled] .btn-info:focus,
.btn-info.disabled.focus, .btn-info[disabled].focus, fieldset[disabled] .btn-info.focus {
  background: #fff;/*好きな色; //ボタンの上にポインタを持ってきたり、クリックしたりした時の背景色*/
  color: #17a2b8;/*好きな色; //ボタンの上にポインタを持ってきたり、クリックしたりした時のテキストの色*/
}
.btn-info.outline {
  border: 3px solid #fff;/*好きな色; //アウトラインのみのボタンの線の色*/
  color: #17a2b8;/*好きな色; //アウトラインのみのボタンのテキストの色*/
}

.container{
  align-items: flex-start;
}

svg.base-svg path {
    width: 100%;
}

#svg-bg1 {
  background-color: #0061b1;
  color: #fff;
}
#svg-bg {
    width: 100%;
    height: 50%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
    overflow: hidden;
}

/* フッター背景色 */
.footer {
  background-color:#0061b1;
  color: #fff;
}
.footer a {
  color: #FFF; /* 文字色のコード */
}
.footer a:hover {
  color: #ffd900; /* 文字色のコード */
}

/* navbarハンバーガーアイコン変更 */
.navbar {
  background-color:#0061b1;
}

/* nav-itemの文字色 */
.navbar .navbar-nav .nav-link {
  color: #fff;
}
/* nav-item activeの文字色 */
.navbar .navbar-nav .active > .nav-link {
  color: #ffd900;;
}
/* nav-item:focus、nav-item:hoverの文字色 */
.navbar .navbar-nav .nav-link:focus, .navbar-dark .navbar-nav .nav-link:hover {
  color: #ffd900;
}
/* ドロップダウンアイテムの文字色 */
.dropdown-item {
  color: #0061b1;
}
.dropdown-item:hover  {
  color: #ffd900;
}

.navbar-dark .navbar-toggler {
  border: none;
  padding: 0px;
  width: 30px;
  height: 30px;
  box-sizing: border-box;
  position: relative;
}

.navbar-dark .navbar-toggler-icon {
  background-image:none; /* この行で背景画像を無効化 */
  background-color: #fff;
  width: 30px;
  height: 2px;
  display: block;
  position: absolute;
  transition: ease .5s;
}

/* 3本のバーそれぞれの座標を設定 */
.navbar-toggler-icon:nth-of-type(1) {top:7px;}
.navbar-toggler-icon:nth-of-type(2) {top:14px;}
.navbar-toggler-icon:nth-of-type(3) {top:21px;}

/* メニューが開いている時の　3本のバーそれぞれの座標および角度を設定 */
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:nth-of-type(1) {
top:13px;
transform: rotate(45deg);
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:nth-of-type(2) {
opacity: 0;
}
.navbar-toggler[aria-expanded="true"] .navbar-toggler-icon:nth-of-type(3) {
top:13px;
transform: rotate(-45deg);
}

/*	地図レスポンシブ　*/
.map_wrapper {
  max-width: 800px;
  min-width: 320px;
  margin: auto;
  padding: 4px;
  border: 1px solid #CCC;  
}
.maps {
    position: relative;
    padding-bottom: 56.25%;
    height: 0;
    overflow: hidden;
}
.maps iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100% !important;
    height: 100% !important;
}

/* ウィンドウ幅による 768px以下は文字サイズ変更*/
@media (max-width: 768px) {
  html { font-size: 14px }
  h1 { font-size: 16px }
  h2 { font-size: 20px }
  h3 { font-size: 14px }
}
/* ウィンドウ幅によるbreak 900px以下はブレーク*/
@media screen and (min-width: 900px) {
	.break { display:none; }
}

.bg-image-loop {
	width: 100%;
	height: 160px; /* 画像の高さを指定 */
	position: relative;
	background: url("../loop_bg.png") repeat-x 0 0;
	background-size: auto 100%;
	animation: bg-slider 46s linear infinite; /* 23sの部分背景画像の約数だとスムーズ */
	margin: 80px 0;
	padding: 0;
}
@keyframes bg-slider {
	from { background-position: 0 0; }
    to { background-position: -1518px 0; } /* 1518pxとは使用した背景画像の長さ */
}
