:root { --blue:#0d448d; --deep:#143f83; --orange:#ff6900; --pale:#edf3ff; --ink:#292929; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); font-family:"Yu Gothic","Hiragino Kaku Gothic ProN",Meiryo,sans-serif; letter-spacing:.02em; background:#fff; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }
button { font:inherit; }
.site-header { height:103px; padding:0 28px; position:sticky; top:0; z-index:50; display:flex; align-items:center; justify-content:space-between; background:rgba(255,255,255,.98); }
.brand img { width:157px; }
.global-nav { display:flex; gap:38px; align-items:center; }
.global-nav a { color:#2380dd; font-size:15px; font-weight:700; text-shadow:0 0 5px #bce0ff; white-space:nowrap; }
.global-nav a:hover { color:var(--orange); }
.menu-button { display:none; background:none; border:0; width:42px; padding:8px; }
.menu-button span { display:block; height:2px; margin:6px 0; background:var(--blue); }
.hero { height:660px; position:relative; overflow:hidden; background:#fff; }
.hero-strip { height:402px; display:flex; gap:9px; width:max-content; animation:heroMove 28s linear infinite; }
.hero-strip img { width:510px; height:402px; object-fit:cover; object-position:50% 40%; }
@keyframes heroMove { to { transform:translateX(-2076px); } }
.hero-frame { position:absolute; left:0; top:210px; width:100%; height:auto; pointer-events:none; }
.hero-copy { position:absolute; left:45px; top:300px; color:var(--blue); }
.hero-copy p { font-size:25px; font-weight:700; margin:0 0 18px; }
.hero-copy img { width:380px; }
.scroll-cue { position:absolute; left:50%; bottom:24px; transform:translateX(-50%); font-size:44px; line-height:.5; text-align:center; }
.scroll-cue span { display:block; font-size:18px; margin-top:16px; }
.phone-box { position:fixed; right:14px; bottom:0; z-index:60; width:190px; padding:10px 12px 8px; border:3px solid var(--orange); background:#fff; color:#353535; }
.phone-box small { color:var(--orange); display:block; font-weight:700; }
.phone-box strong { display:block; font-size:17px; letter-spacing:.05em; }
.phone-box span,.phone-box em { display:block; font-size:8px; text-align:center; font-style:normal; }
.section-pad { padding:90px max(5vw,24px); }
.section-title { position:relative; width:500px; max-width:90%; margin:0 auto 75px; color:var(--blue); text-align:center; border-bottom:1px solid var(--blue); }
.section-title span { display:block; color:transparent; -webkit-text-stroke:1px var(--blue); font:700 34px/1 Arial,sans-serif; letter-spacing:.12em; }
.section-title h2 { margin:12px 0 24px; font-size:34px; }
.section-title.orange { width:475px; padding:18px 40px; border:0; background:var(--orange); color:#fff; }
.section-title.orange::after { content:""; position:absolute; right:55px; bottom:-48px; border-width:48px 48px 0 0; border-style:solid; border-color:var(--orange) transparent transparent transparent; }
.section-title.orange span { display:none; }
.section-title.orange h2 { margin:0; font-size:54px; }
.benefits { background:#f0f0f0; }
.benefit-grid { max-width:980px; margin:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:70px 85px; }
.benefit-card { margin:0; text-align:center; font-weight:600; line-height:1.8; }
.benefit-card img { width:245px; margin:auto; }
.benefit-card p { margin:12px -15px 0; font-size:15px; }
.voices { overflow:hidden; position:relative; }
.voice-person { position:absolute; top:55px; width:155px; }
.voice-person.left { left:12%; } .voice-person.right { right:12%; }
.voice-list { max-width:1040px; margin:auto; }
.voice-card { display:grid; grid-template-columns:.9fr 1.1fr; gap:75px; align-items:center; margin:100px 0 160px; }
.voice-card.reverse { direction:rtl; } .voice-card.reverse>* { direction:ltr; }
.voice-photo { position:relative; }
.voice-photo::before { content:""; position:absolute; inset:-35px -35px auto auto; width:75%; height:55%; z-index:-1; background:repeating-linear-gradient(-45deg,#fff9a9 0 14px,transparent 14px 28px); }
.voice-photo img { height:480px; width:100%; object-fit:cover; }
.voice-photo strong { position:absolute; left:20px; bottom:25px; max-width:90%; padding:10px 18px; background:rgba(255,255,255,.93); font-size:24px; }
.voice-text span { color:var(--blue); font-weight:700; }
.voice-text h3 { color:var(--blue); font-size:31px; line-height:1.45; }
.voice-text p { line-height:2; }
.voice-text b { font-size:30px; color:var(--orange); }
.flow { background:linear-gradient(135deg,#fff 0 12%,#f7f9ff 12% 24%,#fff 24% 36%,#f7f9ff 36% 48%,#fff 48%); }
.flow-list { max-width:1080px; margin:auto; }
.flow-item { display:grid; grid-template-columns:170px 1fr 290px; gap:28px; align-items:center; margin:0 0 70px; }
.flow-step { width:170px; height:170px; border-radius:50%; display:grid; place-items:center; text-align:center; background:var(--blue); color:#fff; font-size:28px; font-weight:700; }
.flow-balloon { position:relative; border:4px solid var(--orange); padding:20px 28px; background:#fff; }
.flow-balloon::before { content:""; position:absolute; left:-26px; top:55px; width:22px; height:22px; background:#fff; border-left:4px solid var(--orange); border-bottom:4px solid var(--orange); transform:rotate(45deg); }
.flow-balloon h3 { margin:0 0 12px; font-size:21px; }.flow-balloon p { margin:0; line-height:2; }
.flow-item img { width:290px; height:230px; object-fit:cover; }
.movies { background:#0e438b; color:#fff; }.movies .section-title { color:#fff; border-color:#fff; }.movies .section-title span { -webkit-text-stroke-color:#fff; }
.movie-grid { max-width:1100px; margin:auto; display:grid; grid-template-columns:repeat(3,1fr); gap:30px; }
.movie-card { position:relative; padding:0 0 18px; border:0; background:#fff; color:#222; cursor:pointer; }.movie-card img { width:100%; height:230px; object-fit:cover; }.movie-card strong { display:block; padding:15px 10px 0; }
.play { position:absolute; left:50%; top:100px; transform:translate(-50%,-50%); width:62px; height:62px; padding:20px 0 0 6px; border-radius:50%; background:rgba(255,105,0,.9); color:#fff; }.movie-card.playing .play { background:var(--blue); }
.home-job-grid,.listing-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:34px; max-width:1000px; margin:auto; }
.job-card { border:1px solid #d6d6d6; background:#fff; transition:.25s; }.job-card:hover { transform:translateY(-5px); box-shadow:0 12px 30px #082f681c; }
.job-card img { width:100%; height:220px; object-fit:cover; }.job-card-body { padding:25px 20px 30px; }.job-card-body span { display:inline-block; padding:8px 20px; background:var(--blue); color:#fff; font-weight:700; }.job-card h3 { min-height:60px; font-size:19px; line-height:1.55; }.job-card p { line-height:1.7; color:#555; }.job-card small { color:var(--orange); font-weight:700; }
.more-button { display:flex; justify-content:space-between; width:320px; margin:55px auto 0; padding:17px 22px; background:var(--blue); color:#fff; font-weight:700; }.more-button span { font-size:22px; }
.sns { background:#f4f4f4; }.insta-grid { max-width:900px; margin:auto; display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }.insta-grid img { width:100%; aspect-ratio:1; object-fit:cover; }
.company { background:#fff; }.company-box { max-width:850px; margin:auto; }.company-box h3 { color:var(--blue); font-size:26px; }.company-box dl { display:grid; grid-template-columns:180px 1fr; border-top:1px solid #ddd; }.company-box dt,.company-box dd { margin:0; padding:18px; border-bottom:1px solid #ddd; }.company-box dt { color:var(--blue); font-weight:700; }
footer { padding:48px max(5vw,24px); background:#0e438b; color:#fff; display:grid; grid-template-columns:200px 1fr auto; align-items:center; gap:35px; }footer img { filter:brightness(0) invert(1); }footer p { line-height:1.7; }
.sub-hero { height:310px; position:relative; overflow:hidden; }.circle-one,.circle-two { position:absolute; border-radius:50%; }.circle-one { width:560px; height:560px; left:-55px; top:-255px; background:#174593; }.circle-two { width:280px; height:280px; left:350px; top:-80px; background:#ceddf7; }.sub-hero h1 { position:absolute; left:12%; top:90px; color:#fff; font-size:36px; z-index:2; }
.listing { padding-top:20px; }.category-nav { max-width:980px; margin:0 auto 55px; display:flex; justify-content:space-between; gap:20px; flex-wrap:wrap; }.category-nav a { padding-bottom:8px; border-bottom:2px solid transparent; }.category-nav a.active,.category-nav a:hover { color:var(--blue); border-color:var(--orange); font-weight:700; }
.post { padding-top:20px; }.back-link { display:block; max-width:930px; margin:0 auto 18px; color:var(--blue); }.post-body { max-width:930px; margin:auto; padding:70px 95px; border:1px solid #e2e2e2; }.post-body h2 { margin-top:0; font-size:38px; font-weight:500; }.post-body h3 { color:var(--blue); margin-top:34px; }.post-body p { line-height:1.9; }.post-body table { width:100%; border-collapse:collapse; margin-top:20px; }.post-body th,.post-body td { border:1px solid #aaa; padding:15px; text-align:left; vertical-align:top; }.post-body th { width:190px; background:#eff4fb; color:var(--blue); }.entry-box { margin:55px 0 0; padding:35px; text-align:center; background:#f4f6fa; border-top:5px solid var(--orange); }.entry-box a { display:block; color:var(--blue); font-size:32px; font-weight:700; }.entry-box small { display:block; }
@media (max-width:900px) {
  .site-header { height:72px; padding:0 18px; }.brand img { width:128px; }.menu-button { display:block; }.global-nav { display:none; position:absolute; left:0; right:0; top:72px; padding:25px; background:#fff; grid-template-columns:1fr 1fr; gap:18px; box-shadow:0 12px 20px #0001; }.menu-open .global-nav { display:grid; }
  .hero { height:570px; }.hero-strip { height:310px; }.hero-strip img { width:330px; height:310px; }.hero-frame { top:205px; width:900px; max-width:none; left:-235px; }.hero-copy { left:22px; top:320px; }.hero-copy p { font-size:18px; }.hero-copy img { width:270px; }
  .phone-box { width:100%; right:0; padding:7px 14px; display:flex; align-items:center; justify-content:center; gap:14px; }.phone-box small,.phone-box span { display:none; }.phone-box em { font-size:9px; }
  .section-pad { padding:65px 20px; }.section-title { margin-bottom:50px; }.section-title.orange h2 { font-size:38px; }.benefit-grid { grid-template-columns:repeat(2,1fr); gap:45px 18px; }.benefit-card img { width:100%; }.voice-person { display:none; }.voice-card,.voice-card.reverse { direction:ltr; grid-template-columns:1fr; gap:25px; margin:65px 0 100px; }.voice-photo img { height:430px; }.flow-item { grid-template-columns:95px 1fr; gap:18px; }.flow-step { width:95px; height:95px; font-size:20px; }.flow-item img { display:none; }.movie-grid,.home-job-grid,.listing-grid { grid-template-columns:1fr 1fr; }.insta-grid { grid-template-columns:repeat(2,1fr); }.sub-hero { height:220px; }.circle-one { width:420px; height:420px; top:-230px; }.circle-two { left:250px; }.sub-hero h1 { top:58px; font-size:30px; }.post-body { padding:45px 30px; }.post-body h2 { font-size:28px; }footer { grid-template-columns:140px 1fr; padding-bottom:90px; }footer small { grid-column:1/-1; }
}
@media (max-width:560px) {
  .benefit-grid,.movie-grid,.home-job-grid,.listing-grid { grid-template-columns:1fr; }.benefit-card img { width:245px; }.section-title h2 { font-size:28px; }.section-title span { font-size:28px; }.voice-photo img { height:380px; }.voice-photo strong { font-size:18px; }.voice-text h3 { font-size:25px; }.flow-item { grid-template-columns:1fr; }.flow-step { margin:auto; }.flow-balloon::before { display:none; }.category-nav { justify-content:flex-start; }.post-body { padding:34px 17px; }.post-body h2 { font-size:24px; }.post-body table,.post-body tbody,.post-body tr,.post-body th,.post-body td { display:block; width:100%; }.post-body th { border-bottom:0; }.entry-box a { font-size:23px; }footer { display:block; }footer img { width:150px; margin-bottom:20px; }
}

/* 管理画面は公開サイトと区別しやすい、落ち着いた操作画面にしています。 */
.admin-body { background:#f3f6fa; color:#263247; }
.admin-header { position:sticky; top:0; z-index:20; min-height:70px; padding:0 max(3vw,20px); display:flex; align-items:center; justify-content:space-between; background:#123f82; color:#fff; box-shadow:0 5px 20px #102d581f; }
.admin-header>a { display:flex; align-items:baseline; gap:12px; }.admin-header>a strong { font:italic 800 22px Arial,sans-serif; }.admin-header>a span { font-size:13px; opacity:.75; }
.admin-header nav { display:flex; gap:24px; }.admin-header nav a { font-size:14px; }
.admin-main { width:min(1180px,94%); margin:38px auto 80px; }
.admin-flash,.admin-error { padding:14px 18px; margin:0 0 22px; border-radius:5px; background:#e8f7ef; color:#176b42; border:1px solid #b5e3cb; }.admin-error { background:#fff0ed; color:#a93222; border-color:#efc3bb; }
.admin-panel { margin:0 0 32px; padding:30px; border-radius:9px; background:#fff; box-shadow:0 6px 24px #18365b0e; }
.admin-panel-head { display:flex; align-items:center; justify-content:space-between; gap:20px; margin-bottom:25px; }.admin-panel-head span { display:block; margin-bottom:4px; color:#69809f; font-size:12px; font-weight:700; letter-spacing:.12em; }.admin-panel-head h1,.admin-panel-head h2 { margin:0; color:#163f7f; }
.admin-add,.admin-panel-head>a { color:#174b97; font-weight:700; }.admin-add { padding:11px 17px; border-radius:4px; background:#174b97; color:#fff; }
.admin-settings { display:grid; grid-template-columns:repeat(2,1fr); gap:18px; }.admin-settings label,.admin-edit-form label { display:grid; gap:7px; color:#334663; font-size:13px; font-weight:700; }.admin-settings .wide { grid-column:1/-1; }
.admin-settings input,.admin-settings textarea,.admin-edit-form input[type="text"],.admin-edit-form input[type="number"],.admin-edit-form textarea,.admin-login input { width:100%; padding:11px 12px; border:1px solid #cbd5e3; border-radius:4px; background:#fff; color:#1e2c42; font:inherit; }.admin-settings textarea,.admin-edit-form textarea { resize:vertical; }
.admin-settings button,.admin-edit-form button,.admin-login button { justify-self:start; padding:12px 24px; border:0; border-radius:4px; background:#ff6900; color:#fff; font-weight:700; cursor:pointer; }
.admin-table-wrap { overflow:auto; }.admin-table { width:100%; border-collapse:collapse; }.admin-table th,.admin-table td { padding:13px 12px; border-bottom:1px solid #e3e8ef; text-align:left; vertical-align:middle; }.admin-table th { color:#667a96; font-size:12px; }.admin-table td small { display:block; margin-top:4px; color:#718097; }
.status { display:inline-block; padding:4px 9px; border-radius:20px; background:#edf0f4; color:#707b89; font-size:12px; }.status.published { background:#e1f6eb; color:#187147; }
.admin-actions { display:flex; align-items:center; gap:14px; }.admin-actions>a { color:#18539f; font-weight:700; }.admin-actions form { margin:0; }.admin-actions button { padding:0; border:0; background:none; color:#c34032; cursor:pointer; }
.admin-edit-panel { max-width:850px; margin-inline:auto; }.admin-edit-form { display:grid; gap:22px; }.admin-edit-form label>span { font-size:14px; }.field-checkbox { display:block!important; }.field-checkbox input { margin-right:8px; }.field-image input[type="file"] { padding:9px; border:1px dashed #aebed4; border-radius:4px; }.admin-image-preview { width:220px; height:145px; object-fit:cover; border-radius:4px; border:1px solid #ddd; }.admin-form-buttons { display:flex; align-items:center; gap:20px; }.admin-form-buttons a { color:#69778a; }
.admin-login-body { min-height:100vh; display:grid; place-items:center; padding:24px; background:linear-gradient(145deg,#f3f6fa,#dfe9f7); }.admin-login { width:min(420px,100%); padding:42px; display:grid; gap:20px; border-radius:10px; background:#fff; box-shadow:0 25px 70px #123a761f; }.admin-login img { width:180px; margin:auto; }.admin-login h1 { margin:5px 0; text-align:center; color:#16458b; font-size:24px; }.admin-login label { display:grid; gap:7px; color:#40536f; font-size:13px; font-weight:700; }.admin-login button { justify-self:stretch; }.admin-login>a { text-align:center; color:#63738a; font-size:13px; }
.empty-message { text-align:center; color:#68778a; }
@media (max-width:700px) { .admin-header { padding:13px 18px; }.admin-header>a span { display:none; }.admin-header nav { gap:13px; }.admin-panel { padding:22px 16px; }.admin-settings { grid-template-columns:1fr; }.admin-settings .wide { grid-column:auto; }.admin-panel-head { align-items:flex-start; }.admin-table { min-width:680px; }.admin-login { padding:32px 23px; } }
