/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Sep 07 2025 | 05:13:53 */
/* 
@media (max-width: 640px) 
@media (min-width: 960px) 
var(--color_main)
サブカラーの設定
var(--color_deep01)
var(--color_deep02)
var(--color_deep03)
*/
/* -------------
○○〇の設定
-----------------------------*/
/* 共通 */
.radius-10{
	border-radius:10px;
}
.post_content .gradation-line {
  position: relative;
  padding: 0.3em 0.5em;
}

.post_content .gradation-line::after {
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 5px;
  content: '';
  border-radius: 2px;
  background-image: -webkit-gradient(linear, right top, left top, from(#8e00a9), to(#dbabff));
  background-image: -webkit-linear-gradient(right, #8e00a9 0%, #dbabff 100%);
    background-image: linear-gradient(to left, #8e00a9 0%, #dbabff 100%);
}
/* -------------
ボタンアニメーションの追加
-----------------------------*/
.btn_anime a{
margin: 0 auto;
animation: anime 2s ease 0s infinite alternate;
transform-origin:center;
cursor: pointer;
}
@keyframes anime {
from {transform: scale(0.95,0.95);}
to {transform: scale(1,1);}
}
.btn_anime img{
margin: 0 auto;
animation: anime 2s ease 0s infinite alternate;
transform-origin:center;
cursor: pointer;
}
@keyframes anime {
from {transform: scale(0.95,0.95);}
to {transform: scale(1,1);}
}
.btn_size a {
    padding: 2em;
}
/* 3つ並びのカラムの高さ合わせる */
.eight-28-arrange-main .flex-arrange {
  display: flex;
  flex-grow: 1;
  padding: 2em 1em 0.4em;
  position: relative;
}
.eight-28-arrange-main .flex-arrange .wp-block-group__inner-container {
  display: flex;
  flex-direction: column;
  width: 100%;
}
.eight-28-arrange-main .flex-arrange .wp-block-group__inner-container .flex-arrange-text {
  flex-grow: 1;
    width: fit-content;
    margin: 0 auto;
	display: flex;
    align-items: end;
}
/* 各カラムのスタイル調整 */
.eight-28-arrange-main .swell-block-column {
  display: flex;
  justify-content: center;
  flex: 1 1 auto;
  position: relative;
}

/* カラム内のコンテンツ配置 */
.eight-28-arrange-main .flex-arrange {
  display: flex;
  flex-grow: 1;
  padding: 2em 1em 0.4em;
  position: relative;
  justify-content: center;
}
/* ===== プラン枠（紫の装飾）===== */
.eight-28-arrange-main .flex-arrange{
  --violet: #6c00bf;
  position: relative;
  border-radius: 14px;               /* 角丸はお好みで */
  background: #fff;                  /* 中身の背景 */
  border: 1px solid rgba(108,0,191,.30); /* ベース線 */
  box-shadow:
    0 0 0 3px rgba(108,0,191,.08) inset, /* 内側にうっすら */
    0 10px 24px rgba(108,0,191,.15);      /* ふわっと影 */
  padding: clamp(16px,2vw,24px);
  overflow: hidden;
  transition: transform .25s ease, box-shadow .25s ease;
}

/* 外周に“発光グラデ”の疑似ボーダー */
.eight-28-arrange-main .flex-arrange::before{
  content:"";
  position:absolute;
  inset:0;
  border-radius: inherit;
  padding:2px; /* 太さ */
  background: linear-gradient(135deg, var(--violet), #b56cff);
  -webkit-mask:
    linear-gradient(#000 0 0) content-box,
    linear-gradient(#000 0 0);
  -webkit-mask-composite: xor;
          mask-composite: exclude; /* 中身を抜く */
  pointer-events:none;
  opacity:.95;
}

/* 上部のアクセントバー */
.eight-28-arrange-main .flex-arrange::after{
  content:"";
  position:absolute;
  left:0; top:0;
  width:100%; height:4px;
  background: linear-gradient(90deg, var(--violet), #b56cff 60%, #e3ccff);
  opacity:.9;
}

/* ホバー時のリフト＆発光強化（PC想定） */
@media (hover:hover){
  .eight-28-arrange-main .flex-arrange:hover{
    transform: translateY(-4px);
    box-shadow:
      0 0 0 3px rgba(108,0,191,.12) inset,
      0 16px 32px rgba(108,0,191,.22);
  }
}

/* ボタンを枠色に寄せる（任意） */
.eight-28-arrange-main .flex-arrange .swell-block-button__link{
  border:2px solid var(--violet);
  box-shadow: 0 4px 12px rgba(108,0,191,.25);
}
.eight-28-arrange-main .flex-arrange .swell-block-button__link:hover{
  filter: brightness(1.03);
  transform: translateY(-1px);
}

/* ----------------------------------- */
/* 説明リスト */
/* ----------------------------------- */
.eight-style-float .swell-block-dl__dt mark {
  display: block;
  text-align: center;
}

.eight-style-float > .swell-block-dl__dt {
  padding: 0.25em 2.5em 1.15em 0;
}

@media (max-width: 600px) {
  .eight-style-float .swell-block-dl__dt mark {
    padding: 0.4rem;
  }
}