@charset "UTF-8";
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
ふれあいグループ標準フォーマット[老健]（TYPE:F）(C)FureaiGroup 2021

File name:      _variable.scss
Last Update:    2021/08/31
Style Info:     ふれあいグループ標準フォーマット（変数指定用）
------------------------------------------------------------->
 0.基本スタイル
+++++++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ===========================================================
 0.基本スタイル
=========================================================== */
/*フォントサイズ*/
/* テキストカラー */
/* メインカラー */
/* その他カラー */
/* メールフォーム用 */
/* フォント */
/* 蛍光カラー */
/* 背景 */
/* リンクカラー */
/* アンチエイリアス処理 */
/* section-title-h2  */
/* グラデ背景 */
/* スマホナビ用シャドウ */
/* コンテンツ幅
----------------------------------------------------------- */
/* メディアクエリ
----------------------------------------------------------- */
/* cleafix */
/* ===========================================================
 1.ヘッダー・フッター
=========================================================== */
/* サイトロゴ
----------------------------------------------------------- */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++++++
湘南ふれあいの園（TYPE:F）(C)FureaiGroup 2023

File name:      services.scss
Last Update:    2023/02/18
Style Info:     各種サービス
------------------------------------------------------------->*/
/* 変数読込
----------------------------------------------------------- */
/* 汎用スタイル
----------------------------------------------------------- */
.box {
  margin: 0 auto;
}
@media screen and (min-width: 960px), print {
  .box {
    width: 980px;
  }
}

/* スライドショーのシアター画面 */
#slideshow {
  position: relative;
  width: 100%;
  height: 300px;
  overflow: hidden;
}
@media screen and (min-width: 960px), print {
  #slideshow {
    width: 980px;
    height: 480px;
  }
}

/* スライドショーの要素に必ず付けるクラス */
.img_box {
  transition: 1s;
}
.img_box img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 70%;
  box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}
@media screen and (min-width: 960px), print {
  .img_box img {
    top: 90px;
    left: 55px;
    transform: none;
    width: 500px;
    height: 300px;
  }
}

/* スライドのサイズ */
.box_size {
  height: 250px;
  width: 95%;
  border: 3px solid #222;
}
@media screen and (min-width: 960px), print {
  .box_size {
    height: 470px;
    width: 610px;
    border: 2px solid #222;
  }
}

/* 左右の矢印 */
#move_left {
  position: absolute;
  top: 50%;
  left: 8.5%;
  transform: translate(-50%, -50%);
}
@media screen and (min-width: 960px), print {
  #move_left {
    left: 152px;
  }
}
#move_left:before {
  content: "←";
  font-family: "slick";
  font-size: 35px;
  line-height: 1;
  opacity: 0.75;
  color: #000;
}

#move_right {
  position: absolute;
  top: 50%;
  right: -1%;
  transform: translate(-50%, -50%);
}
@media screen and (min-width: 960px), print {
  #move_right {
    left: 825px;
    right: auto;
  }
}
#move_right:before {
  content: "→";
  font-family: "slick";
  font-size: 35px;
  line-height: 1;
  opacity: 0.75;
  color: #000;
}

.arrow_style {
  font-size: 0;
  line-height: 0;
  display: block;
  padding: 0;
  cursor: pointer;
  color: transparent;
  border: none;
  background: transparent;
}

/* 左右の黒掛け */
.left_cover {
  position: absolute;
  width: 125px;
  height: 480px;
  top: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.3);
  z-index: 5;
  display: none;
}
@media screen and (min-width: 960px), print {
  .left_cover {
    display: block;
  }
}

.right_cover {
  position: absolute;
  width: 125px;
  height: 480px;
  top: 0;
  left: 855px;
  background: rgba(0, 0, 0, 0.3);
  z-index: 5;
  display: none;
}
@media screen and (min-width: 960px), print {
  .right_cover {
    display: block;
  }
}

/* 動くボックスのスタイル */
.box0 {
  position: absolute;
  top: 0;
  left: -1060px;
  opacity: 0;
}

.box1 {
  position: absolute;
  top: 0;
  left: -440px;
  transform: scale(0.7);
  position: relative;
}

.box2 {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
@media screen and (min-width: 960px), print {
  .box2 {
    top: 0;
    left: 180px;
    transform: none;
  }
}

.box3 {
  position: absolute;
  top: 0;
  left: 800px;
  transform: scale(0.7);
}

.box4 {
  position: absolute;
  top: 0;
  left: 1420px;
  opacity: 0;
}

.nobox {
  display: none;
}/*# sourceMappingURL=services.css.map */