/* きぼうキャンプ場コンシェルジュ — 表示（カード型） */
.ccj-app { max-width: 820px; margin: 1.2em auto; font-size: 15px; line-height: 1.65; }
.ccj-lead { background: #f4faec; border: 1px solid #cfe6a8; border-radius: 8px; padding: 12px 14px; }
.ccj-app h3 { margin: 1.2em 0 .5em; }
.ccj-form { margin: 0 0 .4em; }
.ccj-fg { display: flex; align-items: center; margin-bottom: 10px; max-width: 620px; }
.ccj-fg label { width: 120px; font-weight: bold; flex-shrink: 0; }
.ccj-fg input, .ccj-fg select { flex: 1; padding: 7px 8px; font-size: 14px; border: 1px solid #ccc; border-radius: 6px; }
.ccj-btn { padding: 8px 18px; font-size: 14px; font-weight: bold; cursor: pointer; color: #fff; background: #5a9e2f; border: 0; border-radius: 6px; }
.ccj-btn:hover { background: #4a8525; }
.ccj-result { margin-top: 1.4em; }
.ccj-msg { padding: 1em; color: #555; }
.ccj-foot { font-size: .8em; color: #777; margin-top: 12px; }

/* 天気ブロック */
.ccj-weather { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; background: #eef5fb; border: 1px solid #cfe0f0; border-radius: 8px; padding: 10px 12px; margin-bottom: 14px; font-size: 13px; }
.ccj-wx-ttl { font-weight: 700; color: #245a87; }
.ccj-wx-day { background: #fff; border: 1px solid #d6e4f0; border-radius: 6px; padding: 3px 8px; white-space: nowrap; }

/* カード */
.ccj-cards { display: flex; flex-direction: column; gap: 12px; }
.ccj-card { border: 1px solid #e2e2e2; border-radius: 10px; padding: 12px 14px; background: #fff; }
.ccj-c-head { display: flex; align-items: baseline; flex-wrap: wrap; gap: 8px; }
.ccj-c-head a { font-size: 1.08em; font-weight: 700; color: #1a4fa0; text-decoration: none; }
.ccj-c-head a:hover { text-decoration: underline; }
.ccj-c-star { color: #e8a300; font-size: .95em; }
.ccj-c-area { color: #777; font-size: .82em; }
.ccj-c-tags { margin: 6px 0 4px; }
.ccj-tag { display: inline-block; background: #eef5e6; color: #4a7a22; border-radius: 4px; padding: 2px 8px; font-size: .8em; margin: 2px 4px 2px 0; }
.ccj-c-comment { margin: 4px 0 8px; }
.ccj-fit { color: #5a9e2f; font-size: .9em; }
.ccj-c-rows { font-size: .9em; color: #333; }
.ccj-c-rows > div { padding: 3px 0; border-top: 1px dashed #eee; }
.ccj-c-rows a { color: #1a4fa0; text-decoration: none; }
.ccj-c-rows a:hover { text-decoration: underline; }

/* チェックリスト */
.ccj-check { margin-top: 16px; background: #fff8ec; border: 1px solid #f0dcae; border-radius: 10px; padding: 12px 16px; }
.ccj-check-ttl { font-weight: 700; color: #9a6b00; margin-bottom: 6px; }
.ccj-check ul { margin: 0; padding-left: 1.3em; }
.ccj-check li { margin: 3px 0; }

/* ローディング */
.ccj-loading { margin: 12px 0; }
.ccj-bar { width: 100%; background: #eee; border-radius: 6px; overflow: hidden; margin: 10px 0; }
.ccj-bar-in { height: 12px; width: 0%; background: #7cc957; animation: ccjGrow 8s linear forwards; }
@keyframes ccjGrow { 0% { width: 0%; } 30% { width: 35%; } 60% { width: 65%; } 90% { width: 90%; } 100% { width: 97%; } }

@media (max-width: 480px) {
	.ccj-fg { flex-direction: column; align-items: stretch; }
	.ccj-fg label { width: auto; margin-bottom: 3px; }
}