/* 北九州メディア トップページ（リニューアル） */

body.kmt-body{margin:0;background:#FFFFFF}
.kmt,.kmt *{box-sizing:border-box}
.kmt a{color:#1A1A1A}
.kmt a:hover{color:#000}
.kmt img{max-width:none}

/* ---- アニメーション ---- */
@keyframes km-marquee{from{transform:translateX(0)}to{transform:translateX(-50%)}}
@keyframes km-spin{to{transform:rotate(360deg)}}
@keyframes km-pop{0%{opacity:0;transform:translateY(24px) scale(.96)}100%{opacity:1;transform:none}}
@keyframes km-wiggle{0%,100%{transform:rotate(0)}25%{transform:rotate(-5deg)}75%{transform:rotate(5deg)}}
@keyframes km-blink{0%,100%{transform:scale(1)}50%{transform:scale(1.12)}}
@keyframes km-zoomin{0%{opacity:0;transform:scale(1.06)}100%{opacity:1;transform:none}}
@keyframes km-train{0%{left:-22%}100%{left:104%}}
@keyframes km-rattle{0%,100%{transform:translateY(0)}50%{transform:translateY(-2px)}}
@keyframes km-bob{0%,100%{transform:translateY(0) rotate(-2deg)}50%{transform:translateY(-12px) rotate(2deg)}}
@keyframes km-drift{0%,100%{transform:rotate(var(--r,-12deg)) translateY(0)}50%{transform:rotate(var(--r,-12deg)) translateY(-16px)}}
@keyframes km-roamA{0%{left:4%;top:12%;transform:rotate(-10deg)}25%{left:46%;top:4%;transform:rotate(12deg)}50%{left:88%;top:38%;transform:rotate(-6deg)}75%{left:52%;top:84%;transform:rotate(14deg)}100%{left:4%;top:12%;transform:rotate(-10deg)}}
@keyframes km-roamB{0%{left:90%;top:80%;transform:rotate(8deg)}25%{left:60%;top:30%;transform:rotate(-12deg)}50%{left:18%;top:62%;transform:rotate(10deg)}75%{left:30%;top:6%;transform:rotate(-8deg)}100%{left:90%;top:80%;transform:rotate(8deg)}}
@keyframes km-roamC{0%{left:40%;top:50%;transform:rotate(0)}25%{left:8%;top:86%;transform:rotate(-14deg)}50%{left:70%;top:90%;transform:rotate(10deg)}75%{left:92%;top:10%;transform:rotate(-6deg)}100%{left:40%;top:50%;transform:rotate(0)}}
@keyframes km-progress{0%{width:4%}100%{width:96%}}

.anim .km-spin{animation:km-spin 14s linear infinite}
.anim .km-marquee{animation:km-marquee 30s linear infinite}
.anim .km-pop{animation:km-pop .8s cubic-bezier(.2,.9,.3,1.3) both}
.anim .km-blink{animation:km-blink 1.6s ease-in-out infinite}
.anim .km-zoomin{animation:km-zoomin 1.4s cubic-bezier(.2,.7,.2,1) both}
.km-train{left:38%}
.anim .km-train{animation:km-train 14s linear infinite}
.anim .km-train img{animation:km-rattle .35s ease-in-out infinite}
.anim .km-bob{animation:km-bob 3.2s ease-in-out infinite}
.anim .km-bob.d2{animation-delay:-1.6s}
.anim .km-drift{animation:km-drift 9s ease-in-out infinite}
.km-roam{position:absolute}
.anim .km-roam.ra{animation:km-roamA linear infinite}
.anim .km-roam.rb{animation:km-roamB linear infinite}
.anim .km-roam.rc{animation:km-roamC linear infinite}
.anim .km-progress{animation:km-progress 24s linear infinite}

/* ---- ホバー ---- */
.km-card{transition:transform .25s cubic-bezier(.2,.9,.3,1.4),box-shadow .25s}
.km-card:hover{transform:translate(-4px,-6px) rotate(-1deg);box-shadow:10px 12px 0 #1A1A1A}
.km-btn{transition:transform .15s,box-shadow .15s}
.km-btn:hover{transform:translate(-2px,-2px);box-shadow:6px 6px 0 #1A1A1A}
.km-btn:active{transform:translate(3px,3px);box-shadow:0 0 0 #1A1A1A}
.km-member .km-pose2{opacity:0}
.km-member:hover .km-pose1{opacity:0}
.km-member:hover .km-pose2{opacity:1}
.km-member img{transition:opacity .2s}
.anim .km-member:hover .km-chara{animation:km-wiggle .5s ease-in-out 2}
.km-phone-body{transition:transform .25s cubic-bezier(.2,.9,.3,1.4)}
.km-phone:hover .km-phone-body{transform:translateY(-8px) scale(1.03)}
.km-laptop-screen{transition:transform .25s cubic-bezier(.2,.9,.3,1.4)}
.km-laptop:hover .km-laptop-screen{transform:translateY(-6px)}
.km-nav a{text-decoration:none}
.km-nav a:hover{background:#1A1A1A;color:#FFFFFF}

/* ---- 背景・装飾 ---- */
.km-teal{background-image:url(img/bg-teal.jpg);background-size:cover;background-position:center}
.km-ig-ring{background:linear-gradient(45deg,#F9CE34,#EE2A7B,#6228D7)}
.kmt-article,.kmt-pickup-grid a{overflow-wrap:anywhere}
.kmt-clamp2{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}

/* ---- 新着記事の絞り込みボタン ---- */
.kmt-filter{cursor:pointer;font-family:inherit;font-weight:900;font-size:14px;padding:10px 18px;border-radius:999px;border:3px solid #1A1A1A;box-shadow:3px 3px 0 #1A1A1A;color:#1A1A1A;background:#FFFFFF}
.kmt-filter[aria-pressed="true"]{background:#13A3AF}
.kmt-filter:focus-visible,.kmt a:focus-visible{outline:3px solid #F2E62B;outline-offset:3px}

/* ---- YouTube埋め込み（クリック後） ---- */
.kmt-yt-player iframe{position:absolute;inset:0;width:100%;height:100%;border:0}

/* ---- ログイン中の管理バー分ずらす ---- */
.admin-bar .kmt-header{top:32px !important}
@media (max-width:782px){.admin-bar .kmt-header{top:46px !important}}

/* ---- スマホ ---- */
@media (max-width:767px){
	.kmt-header{position:static !important}
	.kmt .km-nav{flex-wrap:nowrap !important;overflow-x:auto;width:100%;-webkit-overflow-scrolling:touch}
	.kmt .km-nav a{white-space:nowrap}
	.kmt-pickup-grid{grid-template-columns:repeat(2,minmax(0,1fr)) !important}
	.kmt section > div[style*="padding: 96px"],
	.kmt section > div[style*="padding: 88px"]{padding-top:56px !important;padding-bottom:56px !important}
	.kmt section[style*="padding: 96px"]{padding-top:56px !important;padding-bottom:56px !important}
	.kmt .km-laptop{padding:0 12px !important}
}

/* ---- スマホだけの表示切り替え ---- */
.kmt .kmt-sp-only{display:none !important}
.kmt-pickup-grid > a:nth-child(n+4){display:none !important}
@media (max-width:767px){
	.kmt .kmt-pc-only{display:none !important}
	.kmt .kmt-sp-only{display:inline-flex !important}
	.kmt-pickup{order:1}
	.kmt-hero-btns{order:2}
	.kmt-pickup-grid > a:nth-child(4){display:flex !important}
	.kmt-sns-phones{flex-wrap:nowrap !important;gap:12px !important;width:100%}
	.kmt-sns-phones .km-phone{width:calc(50% - 6px) !important;gap:10px !important}
	.kmt-sns-phones .km-phone-body{border-radius:26px !important;padding:6px !important;box-shadow:5px 5px 0 #0B6F78 !important}
	.kmt-phone-screen{height:300px !important;border-radius:20px !important}
	.kmt-phone-label{font-size:12px !important;padding:6px 10px !important;white-space:nowrap}
	.kmt-service-title{font-size:24px !important;line-height:1.5 !important}
	/* 新着記事：左に写真・右にタイトルの横並び（カードのデザインはそのまま） */
	#news div[style*="minmax(300px"]{gap:16px !important}
	.kmt .kmt-article{flex-direction:row !important;border-radius:16px !important;box-shadow:4px 4px 0 #1A1A1A !important}
	.kmt .kmt-article > div:first-child{flex:0 0 132px;align-self:stretch}
	.kmt .kmt-article > div:first-child > img,.kmt .kmt-article > div:first-child > div{width:100% !important;height:100% !important;min-height:88px;aspect-ratio:auto !important;border-bottom:0 !important;border-right:3px solid #1A1A1A}
	.kmt .kmt-article > div:first-child > span{left:6px !important;top:6px !important;padding:1px 8px !important;font-size:10px !important}
	.kmt .kmt-article > div:last-child{padding:10px 12px !important;gap:6px !important;min-width:0}
	.kmt .kmt-article > div:last-child > div:first-child{font-size:14px !important;line-height:1.5 !important;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden}
	.kmt .kmt-article > div:last-child > div:last-child{font-size:12px !important}
}

/* ---- オープニング画面 ---- */
html.kmt-lock,html.kmt-lock body{overflow:hidden}
.kmt-opening{position:fixed;inset:0;z-index:100000;display:flex;align-items:center;justify-content:center;background:#2A1A12;overflow:hidden;font-family:'Zen Antique Soft','Kiwi Maru',sans-serif;transition:opacity .35s}
.kmt-opening[hidden]{display:none}
.kmt-opening.is-leaving{opacity:0}
.kmt-opening-blur{position:absolute;inset:-30px;background-size:cover;background-position:center;filter:blur(18px) brightness(.55);transform:scale(1.1)}
.kmt-opening-inner{position:relative;width:min(1100px,100%);padding:24px 16px;display:flex;flex-direction:column;align-items:center;gap:32px}
.kmt-opening-banner{width:100%;height:auto;display:block;border:3px solid #1A1A1A;border-radius:20px;box-shadow:8px 8px 0 #1A1A1A;animation:km-zoomin 1.2s cubic-bezier(.2,.7,.2,1) both}
.kmt-opening-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:16px 24px;animation:km-pop .8s .5s cubic-bezier(.2,.9,.3,1.3) both}
.kmt-op-btn{cursor:pointer;font-family:inherit;font-size:clamp(20px,2.4vw,28px);color:#1A1A1A;padding:16px 36px;border-radius:999px;border:3px solid #1A1A1A;box-shadow:5px 5px 0 #1A1A1A;transition:transform .15s,box-shadow .15s}
.kmt-op-btn:hover{transform:translate(-2px,-2px);box-shadow:7px 7px 0 #1A1A1A}
.kmt-op-btn:active{transform:translate(3px,3px);box-shadow:0 0 0 #1A1A1A}
.kmt-op-btn:focus-visible{outline:3px solid #FFFFFF;outline-offset:4px}
.kmt-op-go{background:#F2E62B}
.kmt-op-game{background:#13A3AF}
.kmt-footer-game{cursor:pointer;font:inherit;font-weight:700;font-size:14px;color:#FFFFFF;background:none;border:0;padding:0;text-decoration:underline}

/* ---- ミニゲーム ---- */
.kmt-game{position:fixed;inset:0;z-index:100001;background:rgba(35,24,21,.92);display:flex;align-items:flex-start;justify-content:center;overflow:auto;font-family:'Kiwi Maru',system-ui,sans-serif;color:#1A1A1A}
.kmt-game[hidden],.kmt-game [hidden]{display:none !important}
.kmt-g-panel{width:min(760px,100%);margin:12px auto;background:#FFFBEA;border:3px solid #1A1A1A;border-radius:24px;box-shadow:8px 8px 0 #13A3AF;overflow:hidden}
.kmt-g-head{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:10px 16px;background:#13A3AF;border-bottom:3px solid #1A1A1A}
.kmt-g-title{margin:0;font-family:'Zen Antique Soft','Kiwi Maru',sans-serif;font-size:24px;color:#FFFFFF;text-shadow:2px 2px 0 #0B6F78}
.kmt-g-head-btns{display:flex;gap:8px}
.kmt-g-close,.kmt-g-sound{cursor:pointer;width:44px;height:44px;border-radius:50%;border:3px solid #1A1A1A;background:#FFFFFF;font-size:18px;font-weight:900;color:#1A1A1A}
.kmt-g-select{padding:18px 16px 22px;display:flex;flex-direction:column;gap:16px}
.kmt-g-lead{margin:0;text-align:center;font-family:'Zen Antique Soft','Kiwi Maru',sans-serif;font-size:22px;line-height:1.5}
.kmt-g-lead small{font-family:'Kiwi Maru',sans-serif;font-size:14px}
.kmt-g-picks{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.kmt-g-pick{cursor:pointer;font-family:inherit;color:#1A1A1A;background:#FFFFFF;border:3px solid #1A1A1A;border-top:10px solid var(--c);border-radius:16px;box-shadow:4px 4px 0 #1A1A1A;padding:8px 4px 10px;display:flex;flex-direction:column;align-items:center;gap:4px;transition:transform .15s}
.kmt-g-pick:hover,.kmt-g-pick:focus-visible{transform:translateY(-4px) rotate(-2deg);outline:none}
.kmt-g-pick img{width:100%;height:96px;object-fit:contain}
.kmt-g-pick b{font-size:13px;line-height:1.3}
.kmt-g-pick small{font-size:10px;color:#555555}
.kmt-g-help{background:#FFFFFF;border:2px solid #1A1A1A;border-radius:16px;padding:10px 14px}
.kmt-g-help summary{cursor:pointer;font-weight:900}
.kmt-g-legend{list-style:none;margin:8px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:6px 14px;font-size:13px}
.kmt-g-legend li{display:flex;align-items:center;gap:6px;line-height:1.4}
.kmt-g-legend b{white-space:nowrap}
.kmt-g-emoji{font-size:22px}
.kmt-g-howto{margin:10px 0 0;font-size:12px;color:#555555;line-height:1.6}
.kmt-g-play{padding:10px 10px 14px;display:flex;flex-direction:column;align-items:center;gap:10px}
.kmt-g-hud{width:100%;display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:4px 12px;font-weight:700;font-size:14px}
.kmt-g-me{display:inline-flex;align-items:center;gap:4px}
.kmt-g-me img{width:26px;height:26px;object-fit:contain}
.kmt-g-stage{position:relative;width:100%;display:flex;justify-content:center}
.kmt-g-canvas{display:block;border:3px solid #1A1A1A;border-radius:10px;touch-action:none;background:#A9DFE5}
.kmt-g-toast{position:absolute;left:50%;top:8px;transform:translateX(-50%);max-width:92%;background:#1A1A1A;color:#FFFFFF;border-radius:999px;padding:6px 14px;font-size:13px;font-weight:700;text-align:center;pointer-events:none}
.kmt-g-result{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(255,251,234,.82)}
.kmt-g-result[hidden]{display:none}
.kmt-g-result-box{background:#FFFFFF;border:3px solid #1A1A1A;border-radius:20px;box-shadow:6px 6px 0 #1A1A1A;padding:16px 20px;text-align:center;max-width:92%;animation:km-pop .5s cubic-bezier(.2,.9,.3,1.3) both}
.kmt-g-result-box img{width:80px;height:80px;object-fit:contain}
.kmt-g-result-box p{margin:6px 0}
.kmt-g-result-title{font-family:'Zen Antique Soft','Kiwi Maru',sans-serif;font-size:28px}
.kmt-g-result-btns{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:10px}
.kmt-g-result-btns button{cursor:pointer;font-family:inherit;font-weight:900;font-size:14px;color:#1A1A1A;padding:10px 16px;border-radius:999px;border:3px solid #1A1A1A;background:#F2E62B;box-shadow:3px 3px 0 #1A1A1A}
.kmt-g-result-btns button+button{background:#FFFFFF}
.kmt-g-pad{display:none;width:100%;max-width:420px;align-items:center;justify-content:space-between;gap:16px;padding:0 6px}
.kmt-g-dpad{display:grid;grid-template-columns:repeat(3,56px);grid-template-rows:repeat(3,56px);gap:4px}
.kmt-g-dpad button,.kmt-g-bomb{cursor:pointer;touch-action:none;font-size:22px;color:#1A1A1A;background:#FFFFFF;border:3px solid #1A1A1A;border-radius:14px;box-shadow:3px 3px 0 #1A1A1A}
.kmt-g-dpad button.is-on,.kmt-g-bomb:active{background:#F2E62B;transform:translate(2px,2px);box-shadow:1px 1px 0 #1A1A1A}
.kmt-g-dpad [data-dir="0"]{grid-column:2;grid-row:1}
.kmt-g-dpad [data-dir="3"]{grid-column:1;grid-row:2}
.kmt-g-dpad [data-dir="1"]{grid-column:3;grid-row:2}
.kmt-g-dpad [data-dir="2"]{grid-column:2;grid-row:3}
.kmt-g-bomb{width:96px;height:96px;border-radius:50%;font-size:40px;background:#D7262B}
@media (hover:none),(pointer:coarse),(max-width:767px){.kmt-g-pad{display:flex}}
@media (max-width:767px){
	.kmt-g-panel{margin:0;border-radius:0;border-left:0;border-right:0;min-height:100%}
	.kmt-g-picks{grid-template-columns:repeat(3,minmax(0,1fr))}
	.kmt-g-pick img{height:80px}
	.kmt-g-hud{font-size:12px}
	.kmt-opening-inner{gap:24px}
	.kmt-op-btn{padding:14px 28px}
}

/* ---- 動きを減らす設定の人には止める ---- */
@media (prefers-reduced-motion:reduce){
	.kmt.anim *,.kmt.anim *::before,.kmt.anim *::after{animation:none !important;transition:none !important}
}
