*{
  font-family: "Hiragino Kaku Gothic ProN","メイリオ", sans-serif;
}


@media (min-width: 1200px) {
  .jumbotron-top {
    background-image: url("../img/KV5.jpg");
    background-size: cover;
    background-position: center center;
    padding-top: 6em;
    padding-bottom: 4em;
    min-height:560px;
  }
}
@media (min-width: 1200px) {
  .jumbotron-top-2 {
    background-image: url("../img/KV5-2.jpg");
    background-size: cover;
    background-position: center center;
    padding-top: 6em;
    padding-bottom: 4em;
    min-height:560px;
  }
}

@media (min-width: 992px) and (max-width: 1199.98px) {
  .jumbotron-top {
    background-image: url("../img/KV5.jpg");
    background-size: cover;
    background-position: center center;
    padding-top: 6em;
    padding-bottom: 4em;
    min-height:560px;
  }
}
@media (min-width: 992px) and (max-width: 1199.98px) {
  .jumbotron-top-2 {
    background-image: url("../img/KV5-2.jpg");
    background-size: cover;
    background-position: center center;
    padding-top: 6em;
    padding-bottom: 4em;
    min-height:560px;
  }
}

@media (min-width: 768px) and (max-width: 991.98px) {
  .jumbotron-top {
    background-image: url("../img/KV5.jpg");
    background-color: white;
    background-size: cover;
    background-position: center center;
    padding-top: 6em;
    padding-bottom: 4em;
    min-height:560px;
  }
}
@media (min-width: 768px) and (max-width: 991.98px) {
  .jumbotron-top-2 {
    background-image: url("../img/KV5-2.jpg");
    background-color: white;
    background-size: cover;
    background-position: center center;
    padding-top: 6em;
    padding-bottom: 4em;
    min-height:560px;
  }
}

@media (min-width: 576px) and (max-width: 767.98px) {
  .jumbotron-top {
    background-image: url("../img/KV5.jpg");
    background-color: white;
    background-size: cover;
    background-position: center center;
    padding-top: 6em;
    padding-bottom: 4em;
    min-height:560px;
  }
}
@media (min-width: 576px) and (max-width: 767.98px) {
  .jumbotron-top-2 {
    background-image: url("../img/KV5-2.jpg");
    background-color: white;
    background-size: cover;
    background-position: center center;
    padding-top: 6em;
    padding-bottom: 4em;
    min-height:560px;
  }
}

@media (max-width: 575.98px) {
  .jumbotron-top {
    background-color: white;
    background-size: cover;
    background-position: center center;
    /* padding-top: 6em;
    padding-bottom: 4em; */
  }
}

.jumbotron-subtop {
  background-image: url('../img/pattern.jpg');
  background-repeat: repeat;
  padding-top: 4em;
  padding-bottom: 4em;
}

.bg-white-tran{background-color: rgba(255, 255, 255, 0.8)}
.bg-mitsu{background-color: #0097e0;}
.bg-mitsu2{background-color: rgba(0, 151, 224, .07);}
.bg-mitsu3{background-color: #0097e0;}
.bg-mitsu4{background-color: #c5e6ee;}
.bg-alart{background-color: #f15a24;}
.bg-green{background-color: #8cc63f;}
.bg-triangle{
  background-image: url('../img/pattern.jpg');
  background-repeat: repeat;
}

.text-mitsu{color: rgba(0, 151, 224, 1.0);}
.text-alart{color: #f15a24;}

.border-w2{border-width: 2px;}
.border-w3{border-width: 3px;}

.serif{
  font-family: serif;
}


.bb{
  width:100%;
  display: inline-block;
  text-decoration: none;
  background-color: #f8e097;
  border-bottom: 8px solid #9e9e9e;
  border-radius: 20px;
  transition: 0.2s all ease 0s;
}
.bb:hover{
	margin-top: 0px;
  text-decoration: none;
  -ms-transform: translateY(3px);
  -webkit-transform: translateY(3px);
  transform: translateY(3px);/*下に動く*/
  border-bottom: 5px solid #9e9e9e;
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
}
.bb:active{
	margin-top: 0px;
  text-decoration: none;
  -ms-transform: translateY(8px);
  -webkit-transform: translateY(8px);
  transform: translateY(8px);/*下に動く*/
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
  border-bottom: none;
}


.bb-danger{
  width:100%;
  display: inline-block;
  text-decoration: none;
  background-color: #ff1100;
  border-bottom: 8px solid #9e9e9e;
  border-radius: 20px;
  transition: 0.2s all ease 0s;
}
.bb-danger:hover{
  margin-top: 0px;
  text-decoration: none;
  -ms-transform: translateY(3px);
  -webkit-transform: translateY(3px);
  transform: translateY(3px);/*下に動く*/
  border-bottom: 5px solid #9e9e9e;
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
}
.bb-danger:active{
  margin-top: 0px;
  text-decoration: none;
  -ms-transform: translateY(8px);
  -webkit-transform: translateY(8px);
  transform: translateY(8px);/*下に動く*/
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
  border-bottom: none;
}


.bb-nomal{
  display: inline-block;
  text-decoration: none;
  background-color: #ffef69;
  border-bottom: 8px solid #ffb469;
  border-radius: 5px;
  transition: 0.2s all ease 0s;
}
.bb-nomal:hover{
  margin-top: 0px;
  text-decoration: none;
  -ms-transform: translateY(3px);
  -webkit-transform: translateY(3px);
  transform: translateY(3px);/*下に動く*/
  border-bottom: 5px solid #ffb469;
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
}
.bb-nomal:active{
  margin-top: 0px;
  text-decoration: none;
  -ms-transform: translateY(8px);
  -webkit-transform: translateY(8px);
  transform: translateY(8px);/*下に動く*/
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
  border-bottom: none;
}

.bb-none{
  width:100%;
  display: inline-block;
  text-decoration: none;
  background-color: #f8e097;
  border-bottom: 8px solid #9e9e9e;
  border-radius: 5px;
  transition: 0.2s all ease 0s;
}
.bb-none:hover{
  margin-top: 0px;
  text-decoration: none;
  -ms-transform: translateY(3px);
  -webkit-transform: translateY(3px);
  transform: translateY(3px);/*下に動く*/
  border-bottom: 5px solid #696969;
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
}
.bb-none:active{
  margin-top: 0px;
  text-decoration: none;
  -ms-transform: translateY(8px);
  -webkit-transform: translateY(8px);
  transform: translateY(8px);/*下に動く*/
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
  border-bottom: none;
}

.bb-red{
  width:100%;
  display: inline-block;
  text-decoration: none;
  background-color: #e00f26;
  border-bottom: 8px solid #890f26;
  border-radius: 5px;
  transition: 0.2s all ease 0s;
}
.bb-red:hover{
  margin-top: 0px;
  text-decoration: none;
  -ms-transform: translateY(3px);
  -webkit-transform: translateY(3px);
  transform: translateY(3px);/*下に動く*/
  border-bottom: 5px solid #890f26;
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
}
.bb-red:active{
  margin-top: 0px;
  text-decoration: none;
  -ms-transform: translateY(8px);
  -webkit-transform: translateY(8px);
  transform: translateY(8px);/*下に動く*/
  box-shadow: 0px 0px 1px rgba(0, 0, 0, 0.2);/*影を小さく*/
  border-bottom: none;
}


.title1 {
  border-bottom: solid 8px #0097e0;
  position: relative;
}

.title1:after {
  position: absolute;
  content: " ";
  display: block;
  border-bottom: solid 8px #e00f26;
  bottom: -8px;
  width: 20%;
}

.title2 {
     position: relative;
     color: white;
     padding:0.5em 0.5em 0.5em 1.4em;
     background-color: #0097e0;
}
 
.title2::after {
     position: absolute;
     top: 50%;
     left:0;
     transform:translateY(-50%);
     content: '';
     width: 18px;
     height:8px;
     background-color: #b4cc0e;
}

.title3{
  border-bottom: 3px solid #FFF;
}

.caution{
  position: fixed;
  top: 100px;
  right: 0px;
  z-index: 99;
}

.title-border:before,
.title-border:after{
  content: "";
  position: absolute;
  right: 0;
  left: 0;
  width: 0;
  height: 0;
  margin: auto;
}

.title-border{
  border-bottom: 5px solid #0097e0;
  width: 170px;
  position: relative;
}

.title-border:before{
  content: "";
  bottom: -20px;
  width: 0;
  height: 0;
  border-style: solid;
  border-width: 15px 12px 0 12px;
  border-color: #0097e0 transparent transparent transparent;
  position: absolute;
}

.title-border:after{
  content: "";
  bottom: -13px;
  width: 0;
  height: 0;
  border-style: solid;
  border-color: #fff transparent transparent transparent;
  border-width: 13px 9px 0 9px;
  z-index: 10;
  position: absolute;
}


.badge-gas {
    background-color: #f15a24;
    padding: 5px 5px;
    font-weight: 400;
    color: white;
}

.btn-danger{
  background-color: #ff1100;
  border-color: #ff1100;
}

.btn-warning{
  background-color: #f8e097;
  border-color: #f8e097;
}

.btn-warning:hover {
    color: #212529;
    background-color: #ffeb3b;
    border-color: #ffeb3b;
}

.img-boxes .card,
.img-boxes .card-footer{
      background-image: url(../img/pattern.jpg);
    background-repeat: repeat;
}

.img-boxes-rel {
  position: relative;
}
.img-boxes{
  opacity: 0.9;
  transition: all 0.5s ease;
}
.img-boxes:hover{
  opacity: 1;
}
.img-boxes:hover .card{
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}
.img-boxes-rel .p-5{
  padding: 1rem 5rem !important;
}
.img-boxes small{
  font-size: 70%;
}
.img-boxes .hovbase {
  opacity: 1;
  transition: all 0.5s ease;
}
.img-boxes .hovactive {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  transition: all 0.5s ease;
}
.img-boxes:hover .hovactive {
  opacity: 1;
}

.img-boxes:hover .hovbase {
  opacity: 0;
}

.img-boxes .card-title{
  padding-bottom: 4px;
  position: relative;
}
.img-boxes.gtokyo .card-title:before{
  background-color: green;
  bottom: 0;
  content: '';
  display: block;
  height: 3px;
  left: 0;
  position: absolute;
  transition: all 0.5s ease;
  width: 0%;
}
.img-boxes.gtokyo:hover .card-title:before{
  width: 100%
}

.img-boxes.gtoho .card-title:before{
  background-color: #cddc39;
  bottom: 0;
  content: '';
  display: block;
  height: 3px;
  left: 0;
  position: absolute;
  transition: all 0.5s ease;
  width: 0%;
}
.img-boxes.gtoho:hover .card-title:before{
  width: 100%
}

.img-boxes.gosaka .card-title:before{
  background-color: #17a2b8;
  bottom: 0;
  content: '';
  display: block;
  height: 3px;
  left: 0;
  position: absolute;
  transition: all 0.5s ease;
  width: 0%;
}
.img-boxes.gosaka:hover .card-title:before{
  width: 100%
}

/*ここから追記202407*/
.img-boxes.gsaibu .card-title:before{
  background-color: #ffa965;
  bottom: 0;
  content: '';
  display: block;
  height: 3px;
  left: 0;
  position: absolute;
  transition: all 0.5s ease;
  width: 0%;
}
.img-boxes.gsaibu:hover .card-title:before{
  width: 100%
}
.btn-saibu{
  color: #212529;
    background-color: #ffa965;
    border-color: #ffa965;
}
/*ここまで追記202407*/