@charset "utf-8";

:root{
    --bg:#ffffff;
    --text:#222;
    --accent:#ff7a00;
    --accent2:#0b5ed7;
    --muted:#888;
    --error:#d93025;
  }
  
.intro,
.gallery,
form,
footer {
    text-align: center;
}

  
  html,body{
    margin:0;padding:0;background:var(--bg);color:var(--text);
    font-family:system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans JP","Hiragino Kaku Gothic ProN","Yu Gothic",Meiryo,sans-serif;
  }
  a{color:var(--accent2);text-decoration:none}
  a:hover{text-decoration:underline}
  
  /* ヘッダー */
  header{
    background:linear-gradient(90deg,var(--accent),#ffa646);
    color:#fff;padding:18px 20px;
  }
  header .title{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
  .logo-dot{
    width:28px;height:28px;border-radius:50%;
    background:#ffcc00;position:relative;flex:0 0 28px;
    box-shadow:0 0 0 3px rgba(255,255,255,.35) inset, 0 2px 6px rgba(0,0,0,.15);
  }
  .logo-dot::after{
    content:"★"; color:#c31616; font-weight:700; font-size:16px;
    position:absolute; inset:0; display:grid; place-items:center;
  }
  header h1{margin:0;font-size:1.4rem;letter-spacing:.02em}
  header p{margin:4px 0 0;opacity:.9}

  body{
    background-image: url("../images/back4.png");
  }
  
  
  /* 既存のヘッダーなどはそのまま */
  
  .slideshow {
    overflow: hidden;
    position: relative;
    min-width: 960px;
    height: 465px;
  }
  
  .slideshow img {
    display: none;
    position: absolute;
    left: 50%;
    margin-left: -800px;
  }
  

/* 写真スタイル */
.gallery img {
    width: 200px;
    height: auto;
    border-radius: 8px;
    object-fit: cover;
}