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

/* ===== グリッド設定 ===== */

/* PC：4列 */
.cafe-grid{
  display:grid;
  grid-template-columns:repeat(4, 1fr);
  gap:20px;
}

/* タブレット：2列 */
@media (max-width:1024px){
  .cafe-grid{
    grid-template-columns:repeat(2, 1fr);
  }
}

/* スマホ：1列 ←ここ重要 */
@media (max-width:768px){
  .cafe-grid{
    grid-template-columns:1fr;
  }
}

/* ===== カードデザイン ===== */

.cafe-card{
  background:#f3f3f3;
  border-radius:18px;
  overflow:hidden;
  box-shadow:0 4px 12px rgba(0,0,0,0.08);
  transition:.25s;
  padding:0.6em;
}

.cafe-card:hover{
  transform:translateY(-4px);
  box-shadow:0 10px 22px rgba(0,0,0,0.12);
}

/* 画像 */
.cafe-thumb img{
  width:100%;
  height:150px;
  object-fit:cover;
  display:block;
}

/* タイトル */
.cafe-title{
  font-size:14px !important;
  margin:0.2em !important;
  padding:0.7em !important;
  border:none !important;
  font-weight:600;
  line-height:1.4;
}

.cafe-title a{
  text-decoration:none;
  color:#e67e5f;
}

/* メタ情報 */
.cafe-meta{
  font-size:12px;
  margin:0 14px 14px;
  line-height:1.7;
  color:#444;
}

@media (max-width:768px){

  .cafe-card{
    display:block;
  }

  .cafe-thumb{
    width:100%;
  }

  .cafe-thumb img{
  width:100%;
  height:180px;
  object-fit:cover;
  display:block;
  }

}

  .cafe-content{
    flex:1;
  }
}

/* =========================
   VK Filter Search UI
   ========================= */

/* フォーム全体 */
.vkfs .vkfs_form{
  background:#fff;
  padding:28px 24px;
  border-radius:18px;
  box-shadow:0 8px 24px rgba(0,0,0,.06);
  margin-bottom:40px;
}

/* 各フィールド間隔 */
.vkfs .vkfs_form > div{
  margin-bottom:24px;
}

/* ラベル */
.vkfs label{
  font-size:16px !important;
  font-weight:700 !important;
  margin-bottom:8px;
  display:block;
  color:#333;
}

/* 入力欄 */
.vkfs select,
.vkfs input{
  width:100%;
  font-size:18px !important;
  padding:16px 18px !important;
  border-radius:12px;
  border:1px solid #e3e3e3;
  background:#fafafa;
  transition:.2s;
}

/* フォーカス */
.vkfs select:focus,
.vkfs input:focus{
  outline:none;
  border-color:#6aa36f;
  background:#fff;
  box-shadow:0 0 0 3px rgba(106,163,111,.15);
}

/* 検索ボタン */
.vkfs .vkfs_submit{
  width:100%;
  margin-top:24px !important;
  padding:18px !important;
  border:none;
  border-radius:16px;
  background:#6aa36f;
  color:#fff;
  font-weight:800;
  font-size:18px !important;
  letter-spacing:.1em;
  cursor:pointer;
  transition:.25s;
}

/* hover */
.vkfs .vkfs_submit:hover{
  background:#5b8f60;
  transform:translateY(-2px);
  box-shadow:0 8px 16px rgba(0,0,0,.15);
}

/* PCだけ2列 */
@media (min-width:768px){
  .vkfs .vkfs_form{
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:20px;
  }

  .vkfs .vkfs_submit{
    grid-column:1 / -1;
  }
}

/* H1タイトル整形 */
h1.wp-block-heading{
  font-size:clamp(28px,4vw,38px);
  line-height:1.5;
  font-weight:800;
  letter-spacing:.04em;
  margin-top:40px;
  margin-bottom:28px;
}

/* SPだけ微調整 */
@media(max-width:768px){
  h1.wp-block-heading{
    font-size:28px;
    line-height:1.45;
    margin-top:28px;
    margin-bottom:22px;
  }
}

h1.wp-block-heading::after{
  content:"";
  display:block;
  width:60px;
  height:4px;
  margin:16px auto 0;
  border-radius:4px;
  background:#6aa36f;
}