*{box-sizing:border-box}
.ai_body{ margin:0; padding:18px; background:#f7f7f7; color:#222;  }
.ai_body .wrap{ width:100%; max-width:520px; margin:0 auto; }
.ai_body .head,.card,.result-head,.day-card{ background:#fff; border:1px solid #eaeaea; padding:16px; margin-bottom:12px; }
.ai_body .head{padding:18px}
.ai_body .badge{ display:inline-block; font-size:12px; color:#f59e0b; border:1px solid #f3c470; background:#fff8ec; padding:4px 8px; margin-bottom:10px; }
.ai_body h1{ font-size:22px; margin:0 0 6px; line-height:1.35; }
.ai_body .sub,.notice{ font-size:12px; color:#777; line-height:1.5; }
.ai_body .section-title{ font-size:15px; font-weight:900; margin-bottom:6px; }
.ai_body .title{ font-size:14px; font-weight:800;margin:14px 0 10px; }
.ai_body .title:first-child{margin-top:0}
.ai_body .input{ width:100%; height:42px; border:1px solid #ddd; padding:0 12px; font-size:14px; outline:none; background:#fff; }
.ai_body .input:focus{border-color:#f59e0b}
.ai_body .row{display:flex;gap:8px}
.ai_body .row .input{flex:1}
.ai_body .chips{ display:flex; flex-wrap:wrap; gap:8px; }
.ai_body .chip{ border:1px solid #ddd; background:#fff; padding:8px 11px; font-size:13px; cursor:pointer; user-select:none; }
.ai_body .chip.active{ border-color:#f59e0b; color:#d97706; background:#fff8ec; }
.ai_body .btn{ width:100%; background:#f59e0b; color:#fff; padding:15px; text-align:center; font-weight:900; font-size:15px; cursor:pointer; border:0; }
.ai_body .btn:active{opacity:.85}
.ai_body .btn-wrap{ display:flex; gap:8px; margin-top:16px; margin-bottom:18px; }
.ai_body .btn.secondary{ background:#fff; color:#d97706; border:1px solid #f59e0b; }
.ai_body .btn.small{ padding:10px; font-size:13px; }
.ai_body .error{ display:none; background:#fff4f4; border:1px solid #ffc9c9; color:#c0392b; padding:10px; font-size:13px; margin-bottom:12px; }
.ai_body .loading{ display:none; background:#fff; border:1px solid #eaeaea; padding:22px; text-align:center; margin-bottom:12px; }
.ai_body .spinner{ width:28px; height:28px; border:3px solid #f1f1f1; border-top-color:#f59e0b; border-radius:50%; margin:0 auto 12px; animation:spin .8s linear infinite; }

@keyframes spin{to{transform:rotate(360deg)}}
.ai_body .hidden{display:none}
.ai_body .info-grid{ display:grid; grid-template-columns:1fr 1fr; gap:8px; margin-top:14px; }
.ai_body .info-box{ border:1px solid #eee; background:#fafafa; padding:10px; }
.ai_body .info-label{ font-size:11px; color:#999; margin-bottom:4px; }
.ai_body .info-value{ font-size:13px; font-weight:800; }
.ai_body .day-top{ display:flex; justify-content:space-between; align-items:center; gap:8px; margin-bottom:8px; }
.ai_body .day-title{ font-size:16px; font-weight:900; }
.ai_body .day-theme{ font-size:12px; color:#d97706; background:#fff8ec; border:1px solid #f3c470; padding:4px 7px; white-space:nowrap; }
.ai_body .route{ margin-top:12px; border-left:2px solid #f3c470; padding-left:12px; }
.ai_body .place{ position:relative; padding-bottom:14px; }
.ai_body .place:last-child{padding-bottom:0} 
.ai_body .place:before{ content:""; position:absolute; left:-17px; top:3px; width:8px; height:8px; background:#f59e0b;
border-radius:50%; }
.ai_body .time{ font-size:12px; color:#999; margin-bottom:3px; }
.ai_body .place-name{ font-size:14px; font-weight:800; margin-bottom:3px; }
.ai_body .desc{ font-size:12px; color:#777; line-height:1.45; }
.ai_body .meta{ display:flex; flex-wrap:wrap; gap:6px; margin-top:12px; }
.ai_body .meta span{ font-size:12px; background:#f3f3f3; border:1px solid #e7e7e7; padding:5px 7px; }
.ai_body .tip{ background:#fff8ec; border:1px solid #f3c470; padding:12px; font-size:12px; color:#8a4a08; line-height:1.5; margin-top:12px; }

/* PC ´ëÀÀ */
@media (min-width: 900px){
	.ai_body  { padding:34px 24px; }
	.ai_body .wrap{ max-width:870px; }
	.ai_body .head{ padding:26px 30px; }
	.ai_body h1{ font-size:28px; }
	.ai_body .sub{ font-size:14px; }
	.ai_body #formPage .card{ padding:22px 24px; }
	.ai_body #formPage{ display:block; }
	.ai_body #formPage .head,.ai_body #formPage #errorBox,.ai_body #formPage > .btn{ grid-column:1 / -1; }
	.ai_body #formPage > .btn{ max-width:420px; justify-self:center; margin-top:8px; }
	.ai_body .section-title{ font-size:16px; }
	.ai_body .title{ font-size:15px; }
	.ai_body .chip{ font-size:14px; padding:9px 13px; }
	.ai_body .result-head{ padding:26px 30px; }
	.ai_body .info-grid{ grid-template-columns:repeat(4,1fr); }
	.ai_body #resultPage{ max-width:870px; margin:0 auto; }
	.ai_body #resultPage .day-card{ padding:22px 24px; }
	.ai_body .day-title{ font-size:18px; }
	.ai_body .place-name{ font-size:15px; }
	.ai_body .desc{ font-size:13px; }
	.ai_body .day-card{ width:100%; }
	.ai_body .btn-wrap{ max-width:520px; margin-left:auto; margin-right:auto;}
}

@media (min-width: 1200px){
	.ai_body .wrap{	 max-width:870px; }
}