@charset "UTF-8";
/* jsghp2019_common.css
build:20190420
update:20190718
update:20190808
update:20190820
update:20190826
update:20190907
update:20191006
update:20201126
update:20210508
update:20210525
update:20250303
update:20250305
Copyright H.Hishida. All rights reserved. */

/*       1         2         3         4         5         6         7 *
  34567890123456789012345678901234567890123456789012345678901234567890 */
/* ▼▲△▽●○■□◆◇★☆↑↓←→ */ /* style="color:white;" */

html, body{
  background-color: white; /* ブラウザ背景色 */
}

/* swiper
 ------------------------------ */
.swiper-container{/* text-align: center; */}

@media(min-width: 992px){
  .swiper-wrapper{
    flex-wrap:wrap;
  }
  .swiper-slide{
    width: 33.3%;
    width: 16.6%;
    padding: 0 5px;
  }
  .swiper-button-prev,.swiper-button-next,.swiper-pagination{
    display: none;
  }
}

.swiper-wrapper{
  padding: 0px 0px 20px 0px;
}
.swiper-container .swiper-slide img{
  max-width: 100%;
  height: 100%;/* aute -> 100% */
  margin-bottom: 10px;
}
.prettyprint{
  border: none;
  background: #fafafa;
  color: #697d86;
}
.swiper-button-prev, .swiper-button-next, .swiper-pagination{
  bottom: 16px !important;
  position: fixed;
  opacity: 0.7;
}
.swiper-button-prev, .swiper-button-next{
  top: auto;
  height: 22px;
}
.swiper-button-prev{
  left: 32px;
}
.swiper-button-next{
  right: 32px;
}

/* adjustment for search-container's position
 ------------------------------ */
/* adjustment for search-container's position */
#top-page #header .row {
  position: relative;
}
#top-page .jsghp_icon {
  width: 71px;
  height: 59px;
}
#top-page .jsghp_logo {
  position: absolute;
  left: 72px;
  top: 17px;
}
#top-page .search-container {
  position: absolute;
/*  right: 0.25rem; */
  right: -5px;/* ★★ */
  z-index: 10;
}
/* 992px以上の処理 */
@media(min-width: 992px) {
  #top-page .search-container {
    padding-top: 18px;
  right: -5px;/* ★★ */
  }
}
/* sm,md - 768～991pxの処理 - タブレット、スマホ（横）*/
@media (min-width:768px) and (max-width:991px) {
  #top-page .search-container {
    padding-top: 18px;
  right: -5px;/* ★★ */
  }
}
/* 767px以下の処理 */
@media(max-width: 767px) {
  #top-page .search-container {
    padding-top: 18px;
    top: 40px;
    right: -5px;
  }
  #top-page #site {
    height: 90px;
  }
  .text-truncate {
    font-size: 110%;
  }
}

/* card
 ------------------------------ */
.card, .box {
  border: none;
/*  height: 100%; 不要 */
  margin-top: 5px;
  background-color: white;
  box-shadow: 3px 5px 8px 2px rgba(0,0,0,0.2), -1px -1px 8px 2px rgba(0,0,0,0.1);
  -webkit-box-shadow: 3px 5px 8px 2px rgba(0,0,0,0.2), -1px -1px 8px 2px rgba(0,0,0,0.1);
  -moz-box-shadow: 3px 5px 8px 2px rgba(0,0,0,0.2), -1px -1px 8px 2px rgba(0,0,0,0.1);
  border-radius: 0;
}
.card-separator {
  width: 100%;
  height: 0.5rem;
  background-color: gainsboro;
  margin: 0px;
  padding: 0px;
}
.card-body {
  background-color: white;
  margin-top: 0px;
  padding: 0px;
  min-height: 500px;
/*  height: 100%;*/
}

.box-body {
  background-color: white;
  margin-top: 0.65rem;
  padding: 0px;
  height: 200px;
  overflow: hidden;
  position: relative;
}
.card-body img, .box-body img {
  padding: 0.25rem;
}
.card-body .card-title {
  padding: 0.65rem 0.5rem;
  margin-bottom: 0rem;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.card-body .card-subtitle,
.box-body .card-subtitle {
  padding: 0.5rem 0.25rem 0.25rem 0.25rem;
/*   font-size: 1rem; * 20210508 */
}
.box-body .card-subtitle {
/*  padding: 0.75rem 0.5rem 0.5rem 0.5rem;*/
  margin-top: 0rem;
  margin-bottom: 0rem;
}
.card-body .card-text, .card-link p,
.box-body .box-text, .box-link p {
  margin-bottom: 0px;
/*  padding: 0.1rem 0.25rem;* 20210508 */
  padding: 0.25rem 0.25rem; /* 20210508 */
}
.card-body > .card-link a {
  text-decoration: none;
}
.card-link + .card-link {
  margin-left: 0px !important;
}
.card-title-border {
  border-left: solid 12px #aaa;
}
.card-img-overlay {
  top: 4rem;  
}
.card-img-bottom {
  position: absolute;
  bottom: 15px;
  right: 0px;
}
#card-01 .text-truncate { /* 20201126 */
  text-overflow: clip;/* ellipsis→clip */
  white-space: normal;/* nowrap→normal */
  overflow: visible;/* hidden→visible */
}
#card-01 .card-subtitle { /* 20210525 */
  padding-top: 0px;
}

#card-04 .card-img-bottom {
  width: 181px;
  height: auto; /* 100% -> auto */
  margin-bottom: -1.0rem;
  width: 80%;
  opacity: 0.2;
}
.img-jsghp-logotype01 {
  background-image: url('../img/top_box-02-bk_img.png');
  background-repeat: no-repeat;
  background-size: contain;
  width: 100%;
  height: 110px;
  opacity: 0.5;
  position: absolute;
  right: 0px;
  bottom: 0px;
  background-position: right bottom;
}
#card-02 .text-truncate, /* 20250305 */
#card-03 .text-truncate, /* 20250305 */
#card-04 .text-truncate,
#card-05 .text-truncate {
  text-overflow: clip;/* ellipsis→clip */
  white-space: normal;/* nowrap→normal */
  overflow: visible;/* hidden→visible */
}
#card-06 .card-body {
  height: 500px;
  overflow: hidden;
}
#box-02 .img-jsghp-logotype01 {
  background-size: contain; /* cover>contain 20190825 */
/*  width: 100%; ** del 20190825 */
  opacity: 0.5; /* 0.3>0.5 20190825 */
}
#box-03, #box-04, #box-05, #box-06 {
/*  position: relative;*/
}
#box-01 img, #box-02 img, #box-03 img, #box-04 img, #box-05 img, #box-06 img {
  position: absolute;
  opacity: 0.65;
}
#box-06 img {/* 01→06 */
  top: 2px;
  right: 8px;
  width: 24px;
  height: 40px;
}
#box-05 img {/* 02→05 */
  top: 3px;
  right: 8px;
  width: 27px;
  height: 35px;
}
#box-04 img {/* 03→04 */
  top: 3px;
  right: 3px;
  width: 50px;
  height: 38px;
}
#box-02 img {/* 04→02 */
  top: 5px;
  right: 10px;
  width: 30px;
  height: 30px;
}
#box-03 img {/* 05→03 */
  top: 3px;
  right: 10px;
  width: 25px;
  height: 34px;
}
#box-01 img {/* 06→01 */
  top: 3px;
  right: 10px;
  width: 22px;
  height: 34px;
}

/* card-footer
 ------------------------------ */
.card-footer {
  padding: 0.4rem;
  border-top: none;
  background-color: white;
  border-radius: 0;
  position: absolute;
  bottom: 0px;
  right: 0px;
}

/* sns
 ------------------------------ */
.sns-icon ul {
  margin-bottom: 3px !important;
}
.sns-icon li {
  list-style: none;
  padding-bottom: 0px;
}
.sns-icon img {
  margin-bottom: 0px !important;
}
.sns-icon :not(:last-child).list-inline-item {
  margin-right: auto;
}
.sns-icon li {
  width: 31%;
}
.sns-icon img[alt*="qrcode"] {
  padding: 0;
}

.top-sns-label {
/*  height:40px; */
  height:36px; /* 20250303 */
  border:1px solid gray;
  padding: 10px;
  color: #ffffff;
  margin-bottom: 15px;
  margin: 0 0.25rem 0px 0.25rem;
}
.sns-separator {
  width: 100%;
  height: 0.5rem; /* 1rem > 0.5rem */
  background-color: white;
  margin: 0px;
  padding: 0px;
}
.sns-banner img {
  padding-top: 0px !important;
  padding-bottom: 0px !important;
  margin-bottom: 0px !important;
}
.sns-banner i {
  padding-right: 0.5rem;
}
#top-sns-facebook .top-sns-label {
  border-width: 0;
  background-color: #315096;
}
#top-sns-twitter .top-sns-label {
  border-width: 0;
  background-color: #55acee;
}
#top-sns-line .top-sns-label {
  border-width: 0;
  background-color: #00c300;
}
#top-sns-instagram .top-sns-label {
/*  border-color: #e1306c; */
/*  color: #e1306c; */
  border-width: 0;
  background-color: #e1306c;
}
#top-sns-youtube .top-sns-label {
  border-width: 0;
  background-color: #ff0000;
}

/* 992px以上の処理 */
@media(min-width: 992px) {
  #card-06 .fb-1 {display: block;}
  #card-06 .fb-2 {display: none;}
  
  .box .card-separator {display: none;}
  body {font-size: 67%; /* 20250303 */}
  #card-05 .card-title {font-size: 12px; line-height: 19.2px; /* 20250303 */}
  #card-06 .card-title {font-size: 12px; line-height: 19.2px; /* 20250303 */}
}

/* 767px以下の処理 */
@media(max-width: 767px) { /* 991>767 20190820 */
  .card-body .card-subtitle,
  .box-body .card-subtitle {
    font-size: 16px; /* 20210508 */
    padding: 0.25rem 0.25rem;
  }
  #card-06 .card-body {
    height: 100%;
  }
/* カードの影を解除
 ------------------------------ */
  .card, .box {
    box-shadow: none;
    -webkit-box-shadow: none;
    -moz-box-shadow: none;
    padding: 0px 5px 0px 0px;
  }
  .card-title-border {
    margin-left: 3px;
  }
  #card-06 .fb-1 {display: none;}
  #card-06 .fb-2 {display: block;}
}

/* //End of page -------------- */