/* ------------笑顔のページ------------ */



/* グリッド内の各 cover に白フェードを重ねる */
/* ---------------------------------------------------------------------- */
/* 端が白くなるフェード（四辺） */
.xcs-smile-block {
    position: relative;
    overflow: hidden;
    /* はみ出し防止 */
    /* border-radius: 50px; */
}

.xcs-smile-block::after {
    content: '';
    position: absolute;
    inset: 0;
    pointer-events: none;

    /* “中央は透明、端ほど白” を4方向に足し合わせる */
    background:
        linear-gradient(
            to right,
            rgba(255, 255, 255, 1) 0%,
            rgba(255, 255, 255, 0) 12%,
            rgba(255, 255, 255, 0) 88%,
            rgba(255, 255, 255, 1) 100%
        ),
        linear-gradient(
            to bottom,
            rgba(255, 255, 255, 1) 0%,
            rgba(255, 255, 255, 0) 12%,
            rgba(255, 255, 255, 0) 88%,
            rgba(255, 255, 255, 1) 100%
        );
}


@media (max-width: 768px) {
  .xcs-smile-block {
    width: 98vw !important ;
    max-width: 98vw !important;
    left: 50%  !important;
    transform: translateX(-50%) !important;
  }
}