@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
*/

.wp-block-cover__inner-container,
.wp-block-cover {
  overflow: visible !important; /* stickyに必要 */
}

.wp-block-cover__inner-container {
  min-height: 200vh;
  position: relative;
}
.oya-scroll-sticky {
  position: relative; /* stickyの基準として必要 */
  overflow: visible;  /* 必要に応じて */

	
}

.scroll-sticky {
  position: sticky;
  top: 30vh;
  z-index: 10;
}

/* post-slide */

.post-slide {
  padding-left: 32px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none; /* Firefox */
  -ms-overflow-style: none; /* IE/Edge */
}

.post-slide::-webkit-scrollbar {
  display: none;
}

.post-slide > .p-postList {
  display: flex;
  flex-wrap: nowrap;
  gap: 1rem;
  width: max-content;
  padding: 1rem 0;
}

.post-slide .p-postList__item {
  flex: 0 0 auto;
  width: 300px;
}

.post-slide .p-postList__item img {
  width: 100%;
  height: auto;
  display: block;
  object-fit: cover;
  border-radius: 8px;
}

.l-header .l-header__inner {
    color: #a36d6d;
}

.l-header .c-gnav>li>a:after {
    background: #a36d6d;
}

/* ✅ 600px以下ならカード幅を250pxに */
@media (max-width: 599px) {
  .post-slide .p-postList__item {
     width: 250px !important;
  }
}

/******************************/
/******************************/
/******************************/

/* 追従バナー */
.follow-banner-group {
    position: fixed;
    right: 0px;
    top: 400px;
    transform: translateY(-50%);
    display: flex;
    flex-direction: column;  /* 縦方向に並べる */
    align-items: center;
    gap: 5px;
    padding: 1px;
    border-radius: 10px;
    z-index: 1000;
    width: auto;  /* 文字の長さに応じて調整 */
}

/* 各ボタンのスタイル */
.follow-banner-group .wp-block-group {
    width: 51px;
    padding: 10px;
    text-align: center;
    border-radius: 5px;
    transition: all 0.3s ease-in-out;
    cursor: pointer;
    display: flex;
    flex-direction: column;  /* アイコンとテキストを縦に並べる */
    align-items: center;
    margin-bottom: 2px !important;
    
}

/* ボタンのホバーエフェクト */
.follow-banner-group .wp-block-group:hover {
    transform: scale(1.05);
    opacity: 0.9;
}

/* アイコンとテキストを縦一列に並べる */
.follow-banner-group .wp-block-group p {
    display: flex;
    text-align: center;
　　flex-direction: row;
    align-items: center;
    justify-content: center;
    writing-mode: vertical-rl;  /* 文字を縦書き（右→左） */
    text-orientation: upright;  /* 文字を正しい向きで表示 */
    font-size: 14px;
    line-height: 1.8;
    margin: 0;
    gap: 15px;
}

/******************************/
/* モバイル用 */
@media (max-width: 959px) {
	/* 追従バナー */
    .follow-banner-group .wp-block-group p {
        writing-mode: vertical-rl;
        text-orientation: upright;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        line-height: 1.8;
        min-width: 1em;
        max-width: 100%;
        margin: 0 auto;
    }
}