@charset "UTF-8";
/*
    Template: swell
    Theme Name: SWELL CHILD
    Theme URI: https://swell-theme.com/
    Description: SWELLの子テーマ
    Version: 1.0.0
    Author: LOOS WEB STUDIO
    Author URI: https://loos-web-studio.com/

    License: GNU General Public License
    License URI: http://www.gnu.org/licenses/gpl.html
*/

/*islet-setouchi.comのCSS*/

.l-header, .l-footer, [data-scrolled=true] .p-fixBtnWrap{
    display: none;
}
@media screen and (min-width: 600px){
    .l-mainContent__inner>.post_content {
    margin-top: -4em !important;
}
}
@media screen and (max-width: 599px){
   .l-mainContent__inner>.post_content {
    margin-top: -4em !important;
} 
}

@media screen and (min-width: 600px){
.fv-block {
  position: relative !important;
  min-height: 1920px!important;
  /* ↓ここが中央揃えの魔法の3行です */
  display: flex;
  justify-content: center; /* 水平方向（横）の中央揃え */
  align-items: center;     /* 垂直方向（縦）の中央揃え */
}
}
@media screen and (max-width: 599px){
.fv-block {
  position: relative !important;
  min-height: 1280px!important;
  /* ↓ここが中央揃えの魔法の3行です */
  display: flex;
  justify-content: center; /* 水平方向（横）の中央揃え */
  align-items: center;     /* 垂直方向（縦）の中央揃え */
}
}

@media screen and (min-width: 600px){
.blink-smooth {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
}
@media screen and (max-width: 599px){
.blink-smooth {
    position: fixed;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100%;
}
}

/* 中の画像だけを、中央位置を基準にしてアニメーションさせる */
@media screen and (min-width: 600px){
.blink-smooth img {
  animation: blink-up 5s infinite linear;
  display: block;
}
}
@media screen and (max-width: 599px){
.blink-smooth img {
  animation: blink-up 5s infinite linear;
  display: block;
  margin: 0 auto;
}
}

/* アニメーションの内容は元のままでOKです */
@keyframes blink-up {
  0% {
    opacity: 0;
    /*transform: translateY(60px);*/ /* 中央より20px下からスタート */
  }
  50% {
    opacity: 1;
    /*transform: translateY(30px);*/ /* 中央より10px下を通過 */
  }
  100% {
    opacity: 0;
    /*transform: translateY(0);*/    /* ジャスト中央で消滅 */
  }
}

.fixed-top-box img{
  position: fixed; /* ★スクロールしても画面に対して位置を固定する */
  left: 50%;       /* 横方向の中央揃えの起点 */
  top:8%;
  transform: translateX(-50%); /* 横方向のジャスト中央揃え */
  
  z-index: 9999;   /* ★他のコンテンツ（点滅画像など）の下に隠れないように最前面に出す */

  /* 以下は画像のサイズや余白の調整用です（環境に合わせて変更してください） */
  width: 100%;
  text-align: center; /* 中の画像を中央寄せにする */
  padding: 10px 0;    /* 上下に少し隙間を空ける場合 */
}

.fixed-top-box img {
  max-width: 320px; /* 画像が大きすぎる場合はここで横幅を制限できます */
  height: auto;
}

@media screen and (min-width: 600px){
.top-under-btn{
    position: fixed; /* ★スクロールしても画面に対して位置を固定する */
  bottom:8%;
  z-index: 9999;   /* ★他のコンテンツ（点滅画像など）の下に隠れないように最前面に出す */
left: 50%;
    transform: translateX(-50%);
}
}
@media screen and (max-width: 599px){
.top-under-btn{
    position: fixed; /* ★スクロールしても画面に対して位置を固定する */
  bottom:8%;
  width: 100%;
  z-index: 9999;   /* ★他のコンテンツ（点滅画像など）の下に隠れないように最前面に出す */
left: 50%;
    transform: translateX(-50%);
}
.top-under-btn .swell-block-columns__inner{
justify-content: center!important;
}
}