﻿/* 流星群 活動状況ウィジェット (https://www.benricho.org/meteor-shower/)
　みんなの知識 ちょっと便利帳
　今夜、流れ星に会えるかな?｜流星群の活動状況と観測条件｜流星群カレンダー
　2026/10/03
   すべてのルールを .mg-container 配下に限定し、親ページのCSSとの衝突を避けています。 */
.mg-container{width:100%;margin:10px auto;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;color:#333;font-size:16px;line-height:1.7;box-sizing:border-box;border:2px solid #243b53;box-shadow: 0 4px 16px rgba(122, 59, 0, 0.15);border-radius:6px;padding:20px 18px;background:#fff}.mg-container *,.mg-container *:before,.mg-container *:after{box-sizing:inherit}.mg-container .mg-today-box{background:#f0f4f8;border:1px solid #d9e2ec;border-radius:6px;padding:15px;margin-bottom:20px}.mg-container .mg-sub{font-size:14px;color:#627d98;margin:0 0 12px}.mg-container .mg-item{background:#fff;border:1px solid #e1e8ef;border-radius:6px;padding:10px 12px;margin-bottom:10px}.mg-container .mg-item-head{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;justify-content:space-between}.mg-container .mg-bar{position:relative;height:8px;background:#e1e8ef;border-radius:4px;margin:10px 0 4px}.mg-container .mg-bar-fill{position:absolute;left:0;top:0;bottom:0;background:#9fb3c8;border-radius:4px}.mg-container .mg-bar-peak{position:absolute;top:-3px;width:2px;height:14px;background:#f5a623}.mg-container .mg-bar-now{position:absolute;top:-3px;width:3px;height:14px;background:#d64545;border-radius:2px}.mg-container .mg-bar-note{font-size:14px;color:#627d98;display:flex;flex-wrap:wrap;gap:2px 12px;justify-content:space-between}.mg-container .mg-plot{margin-top:8px}.mg-container .mg-plot img{display:block;width:100%;height:auto;border:1px solid #e1e8ef;border-radius:4px}.mg-container .mg-list-table{width:100%;border-collapse:collapse;background:#fff;box-shadow:0 1px 3px rgba(0,0,0,.1);border-radius:6px;overflow:hidden}.mg-container .mg-list-table th,.mg-container .mg-list-table td{padding:10px 12px;text-align:left;border-bottom:1px solid #f0f0f0;vertical-align:middle}.mg-container .mg-list-table th{background:#243b53;color:#fff;font-weight:600;font-size:15px}.mg-container .mg-list-table tr:last-child td{border-bottom:none}.mg-container .mg-badge{display:inline-block;padding:4px 10px;border-radius:4px;font-size:14px;font-weight:bold}.mg-container .mg-badge.active{background:#e3fcef;color:#006644}.mg-container .mg-badge.upcoming{background:#deebff;color:#0747a6}.mg-container .mg-badge.ended{background:#eae6df;color:#423d3d}.mg-container .mg-tag{font-size:13px;color:#8a5a00;background:#fff4d6;border-radius:3px;padding:1px 5px;margin-left:4px}.mg-container .mg-credit{font-size:13px;color:#829ab1;margin-top:12px}.mg-container .mg-credit a{color:inherit}.mg-container .mg-scroll{overflow-x:auto}

/* 親テンプレートのCSSが混ざらないようにするリセット(すべて .mg-container 配下に限定) */
.mg-container .mg-title,.mg-container .mg-sec{background:none;border:0;box-shadow:none;padding:0;text-transform:none;letter-spacing:normal;font-family:inherit;font-style:normal;float:none;position:static;text-indent:0;text-shadow:none;width:auto;height:auto}
.mg-container .mg-title:before,.mg-container .mg-title:after,.mg-container .mg-sec:before,.mg-container .mg-sec:after{content:none;display:none}
.mg-container .mg-title{text-align:center;font-size:28px;font-weight:700;line-height:1.4;margin:0 0 14px;color:#1d4f91}
.mg-container .mg-sec{text-align:left;font-size:20px;font-weight:700;line-height:1.4;margin:0 0 4px;color:#102a43}
.mg-container .mg-title-sub{display:block;margin-top:6px;font-size:16px;font-weight:400;line-height:1.5;color:#486581}
.mg-container .mg-summary{border:1px solid #f0d9a8;border-radius:6px;background:#fffbf0;padding:15px;margin:0 0 20px}
.mg-container .mg-sum-stars{font-size:30px;line-height:1.2;letter-spacing:4px;margin:2px 0 8px}
.mg-container .mg-star-on{color:#f5a623}
.mg-container .mg-star-off{color:#bcccdc}
.mg-container .mg-sum-row{display:flex;flex-wrap:wrap;gap:2px 12px;padding:6px 0;border-bottom:1px solid #f0e6cc}
.mg-container .mg-sum-k{flex:0 0 9em;color:#486581;font-size:15px}
.mg-container .mg-sum-v{font-weight:700;color:#102a43;font-size:18px}
.mg-container .mg-sum-note{font-size:14px;line-height:1.5;color:#627d98;margin:10px 0 0;padding:0;text-align:left}
.mg-container .mg-title-sub:after{content:"";display:block;width:64px;height:3px;margin:12px auto 0;background:#f5a623;border-radius:2px}
.mg-container .mg-loc{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;justify-content:center;margin:0 0 16px;padding:10px 12px;background:#f0f4f8;border:1px solid #d9e2ec;border-radius:6px}
.mg-container .mg-loc label{font-size:15px;color:#486581;font-weight:600}
.mg-container .mg-loc select{font-size:15px;padding:6px 10px;border:1px solid #9fb3c8;border-radius:4px;background:#fff;color:#102a43;max-width:100%}
.mg-container .mg-loc-note{font-size:13px;color:#627d98;width:100%;text-align:center;margin:0}
.mg-container .mg-sum-indent{text-indent:1em}
.mg-container .mg-intro{margin:24px 0 0;padding-top:16px;border-top:1px solid #d9e2ec}
.mg-container .mg-intro .mg-sec{margin-bottom:8px}
.mg-container .mg-intro p{margin:0 0 8px;padding:0;font-size:16px;line-height:1.5;color:#486581;text-align:left;text-indent:1em}
.mg-container .mg-intro p.mg-intro-note{font-size:14px;line-height:1.5;color:#627d98}
.mg-container p.mg-sub,.mg-container p.mg-credit{padding:0;text-align:left}
.mg-container table.mg-list-table{table-layout:auto;margin:0;border-spacing:0;border:0}
.mg-container .mg-list-table td{background:transparent;color:#333;font-size:16px}
.mg-container .mg-plot img{max-width:100%;margin:0;padding:0;box-shadow:none}
.mg-container small{font-size:14px}
.mg-container .mg-night{display:block;margin-top:6px;font-size:16px;line-height:1.6;color:#102a43}
.mg-container .mg-night strong{font-weight:700}
.mg-container .mg-night-sub{display:block;font-size:14px;color:#627d98}
.mg-container .mg-sec-sub{font-size:18px;margin-top:20px}
.mg-container .mg-sec-loc{font-size:16px;font-weight:400;color:#486581;margin-left:6px}
.mg-container .mg-cap{display:block;font-size:14px;color:#627d98;margin-top:4px}
.mg-container .mg-moonline{display:flex;align-items:center;gap:8px;margin-top:6px;font-size:14px;color:#486581}
.mg-container canvas.mg-moon{display:block;flex:none;max-width:none;margin:0;padding:0;border:0;border-radius:50%}
