/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Nov 30 2025 | 21:13:45 */
/* -------------
メインの設定
-----------------------------*/
.original-cover.wp-block-cover {
    position: relative;
    overflow: visible !important;
}
/* 右半分・上→下の斜め背景 */
.original-cover.wp-block-cover::before {
    content: "";
    position: absolute;
    top: -10%;
    left: -10%;
    width: 70%;  /* 右半分＋少し余裕 */
    height: 120%;background: rgba(37, 69, 88, 0.75); /* 色：#254558 / 濃さ調整可 */
    transform: skewX(-12deg); /* ←斜め角度（上→下へ） */
    z-index: 1;
}
@media (max-width: 640px){
	.original-cover.wp-block-cover::before {
    left: -20%;
    width: 100%;
    height: 120%;
  
}
	.is-style-vk-group-solid {
    padding: 0;

}
	.is-style-vk-group-shadow {
    padding: 0.1em;
}
	.vk_button.vk_button-align-wide, .editor-styles-wrapper .vk_button.vk_button-align-wide {
    max-width: 100%;
}
}
/* テキストを前に */
.original-container .wp-block-cover__inner-container {
    position: relative;
    z-index: 2;
}
/*  */
/* 左上 三角形 */
.eight-deco::before {
  content: '';
  position: absolute;
  top: 5px;
  left: 5px;
  width: 200px;
  height: 100px;
background: #254558;
  clip-path: polygon(0 0, 100% 0, 0 100%);
	z-index: 999;
}

/* 右下 三角形 */
.eight-deco::after {
  content: '';
  position: absolute;
  bottom: 5px;
  right: 5px;
  width: 200px;
  height: 100px;
background: #254558;
  clip-path: polygon(100% 100%, 0 100%, 100% 0);
}

/*  */
.line-height-2{
    line-height: 2;
}
.original-container .eight-cover img, .original-container .eight-cover span{
height:80%;	
}
/* 下に影を落とす白背景ボックス */
.eight-service {
    box-shadow: 7px 10px 0px rgb(169 169 169);
	border: 3px solid #a9a9a9;
}
.wp-block-group__inner-container{
    padding: 1em;
}
/* 吹き出し全体 */
.balloon-box {
    position: relative;
    display: inline-block;
    margin: 30px auto;
    padding: 18px 24px;
    background: #ffb400; /* 好きな色に変更可能（今は琥珀系） */
    color: #fff;
    border-radius: 12px;
    font-size: 20px;
    text-align: center;
    font-weight: 700;
    box-shadow: 0 4px 15px rgba(0,0,0,0.12);
}

/* 吹き出しの三角形（下センター） */
.balloon-box::after {
    content: "";
    position: absolute;
    left: 50%;
    bottom: -18px;
    transform: translateX(-50%);
    border-width: 18px 12px 0 12px;
    border-style: solid;
    border-color: #ffb400 transparent transparent transparent;
}
/* 中央寄せ用 */
.center-balloon {
    display: block;
    text-align: center;
    margin-left: auto;
    margin-right: auto;
	width: fit-content;
}
/* ダイナミック赤ボタン */
.dynamic-red-btn .vk_button_link {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 18px 28px;
    background: linear-gradient(135deg, #ff3b3b, #c40000);
    color: #fff !important;
    text-decoration: none;
    border-radius: 0!important;
    box-shadow: 0 10px 20px rgba(255, 0, 0, 0.35),
                0 4px 10px rgba(0, 0, 0, 0.18);
    transform: translateY(0);
    transition: 0.2s ease;
}

/* ホバー：浮き上がる＋拡大 */
.dynamic-red-btn .vk_button_link:hover {
    transform: translateY(-4px) scale(1.04);
    box-shadow: 0 14px 25px rgba(255, 0, 0, 0.45),
                0 8px 16px rgba(0, 0, 0, 0.2);
    opacity: 1;
}

* アイコン */
.dynamic-red-btn i {
    font-size: 22px;
}
/* キャプションの中央揃え */
.dynamic-red-btn .vk_button_link_caption {
    display: inline-flex;
    align-items: center;
    gap: 8px;
}
/* カバー内CTA全体 */
.cta-cover-area {
    text-align: center;
    padding: 40px 20px;
}

/* 見出しテキスト */
.cta-cover-text {
    font-size: 30px;
    font-weight: 700;
    color: #254558;
    text-shadow: 0 2px 8px rgba(255,255,255,0.7);
    margin-bottom: 24px;
}

/* スマホのテキストサイズ */
@media (max-width: 768px) {
    .cta-cover-text {
        font-size: 22px;
        line-height: 1.4;
    }
}