:root {
  --accent: #E01969;      /* 旧サイトのテーマカラー（ピンク） */
  --link: #1826ED;        /* 旧サイトのリンク色 */
  --link-hover: #3BAFE1;  /* 旧サイトのホバー色 */
  --text: #333;
  --muted: #999;
  --line: #ccc;
}
* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body { margin: 0; background: #fff; color: var(--text); font-family: Arial, "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Yu Gothic", Meiryo, sans-serif; font-size: 16px; line-height: 1.8; }
a { color: var(--link); text-decoration: none; }
a:hover { color: var(--link-hover); text-decoration: underline; }
img { max-width: 100%; height: auto; }
ul, ol { margin: 0; padding: 0; list-style: none; }

/* header */
#header_top { border-bottom: 1px solid var(--line); }
#header_top_inner { max-width: 1000px; margin: 0 auto; padding: 0 16px; height: 110px; display: flex; align-items: center; }
#logo_text { margin: 0; font-size: 26px; font-weight: normal; line-height: 1.2; }
#logo_text a { color: var(--accent); text-decoration: none; }
#logo_text a:hover { color: var(--link-hover); }

/* global menu */
#menu_area { background: var(--accent); }
#menu_area_inner { max-width: 1000px; margin: 0 auto; overflow-x: auto; -webkit-overflow-scrolling: touch; }
#global_menu { display: flex; height: 35px; white-space: nowrap; border-left: 1px solid rgba(255,255,255,.2); }
#global_menu li a { display: block; height: 35px; line-height: 35px; padding: 0 25px; font-size: 12px; color: #fff; text-decoration: none; border-right: 1px solid rgba(255,255,255,.2); }
#global_menu li a:hover, #global_menu li.active_menu a { background: rgba(0,0,0,.15); }

/* 2 column */
#contents { max-width: 1000px; margin: 0 auto; padding: 20px 16px; display: flex; gap: 20px; align-items: flex-start; }
#main_col { flex: 1 1 680px; min-width: 0; }
#side_col { flex: 0 0 300px; }
@media (max-width: 999px) {
  #contents { flex-direction: column; }
  #side_col { flex-basis: auto; width: 100%; }
}

/* post list */
.headline1 { background: #ededed; height: 30px; line-height: 30px; border-bottom: 3px solid var(--accent); margin: 0 0 15px; font-weight: normal; font-size: 14px; }
.headline1 span { background: var(--accent); display: inline-block; color: #fff; padding: 0 20px; }
#post_list .post_list_item { display: flex; gap: 15px; padding: 15px 0; border-bottom: 1px dotted var(--line); }
#post_list .image { flex: 0 0 110px; width: 110px; height: 110px; border: 1px solid #ddd; overflow: hidden; display: block; }
#post_list .image img { width: 100%; height: 100%; object-fit: cover; display: block; }
#post_list .info { min-width: 0; }
#post_list .title { margin: 0 0 4px; font-size: 18px; line-height: 1.5; font-weight: normal; }
#post_list .title a { color: var(--text); }
#post_list .title a:hover { color: var(--link-hover); }
.post_list_meta { margin: 0 0 6px; font-size: 12px; color: var(--muted); }
.post_list_meta .post_date { padding-left: 15px; background: url(/theme/img/icon_date.png) no-repeat left center; margin-right: 12px; }
.post_list_meta .cat { display: inline-block; margin-right: 8px; padding-left: 15px; background: url(/theme/img/icon_category.png) no-repeat left center; }
#post_list .excerpt { margin: 0; font-size: 13px; line-height: 1.7; color: #666; }
@media (max-width: 480px) { #post_list .image { flex-basis: 80px; width: 80px; height: 80px; } #post_list .title { font-size: 16px; } }

/* single */
#single_title h1 { font-size: 27px; font-weight: normal; line-height: 1.3; border-bottom: 1px dotted var(--line); margin: 0 0 20px; padding: 4px 0 25px; }
#post_meta_top { display: flex; gap: 15px; font-size: 14px; margin: 0 0 20px; }
#post_meta_top .post_author span { margin-right: 4px; }
#post_meta_top .post_date { border-left: 1px solid var(--line); padding-left: 15px; color: #666; }

.post_content { font-size: 16px; line-height: 1.8; word-wrap: break-word; }
.post_content p { margin: 0 0 1.4em; }
.post_content h2 { font-size: 120%; font-weight: normal; padding: 8px 15px; margin: 30px 0 15px; background: var(--accent); color: #fff; line-height: 1.5; }
.post_content h3 { font-size: 120%; font-weight: normal; border-bottom: 3px solid var(--accent); padding: 5px 0 7px; margin: 30px 0 15px; line-height: 1.5; }
.post_content h4 { font-size: 110%; font-weight: normal; background: #e8e8e8; padding: 8px 15px; margin: 25px 0 12px; }
.post_content h5 { font-size: 105%; font-weight: normal; margin: 20px 0 8px; }
.post_content h5:before { content: ''; width: 12px; height: 12px; background: var(--accent); display: inline-block; margin: 0 7px 0 0; }
.post_content img { display: block; margin: 10px auto; }
.post_content ul { list-style: circle outside; margin: 0 0 1.4em 1.3em; }
.post_content ol { list-style: decimal outside; margin: 0 0 1.4em 1.6em; }
.post_content li { line-height: 1.8; }
.post_content blockquote { margin: 0 0 1.4em; padding: 27px 30px; border: 1px solid var(--line); box-shadow: 0 4px 0 0 #f2f2f2; position: relative; }
.post_content blockquote:before { content: '"'; font-style: italic; font-size: 30px; line-height: 40px; position: absolute; top: 5px; left: 10px; color: var(--accent); }
.post_content blockquote:after { content: '"'; font-style: italic; font-size: 30px; line-height: 60px; position: absolute; bottom: 7px; right: 8px; color: var(--accent); }
.post_content blockquote p:last-child { margin-bottom: 0; }
.post_content table { border-collapse: collapse; margin: 0 0 1.4em; max-width: 100%; display: block; overflow-x: auto; }
.post_content th, .post_content td { border: 1px solid var(--line); padding: 6px 10px; }
.post_content th { background: #f2f2f2; }
.post_content .embed { position: relative; padding-top: 56.25%; margin: 1.4em 0; }
.post_content .embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.post_content iframe { max-width: 100%; }
.post_content del { text-decoration: line-through; }

#post_meta { border-top: 1px dotted var(--line); border-bottom: 1px dotted var(--line); padding: 12px 0; margin: 20px 0; font-size: 11px; }
#post_meta ul { display: flex; flex-wrap: wrap; gap: 6px 15px; }
#post_meta li { color: var(--muted); padding-left: 15px; line-height: 1.6; }
#post_meta li.post_date { background: url(/theme/img/icon_date.png) no-repeat left 4px; }
#post_meta li.post_category { background: url(/theme/img/icon_category.png) no-repeat left 4px; }
#post_meta li.post_tag { background: url(/theme/img/icon_tag.png) no-repeat left 4px; }

/* LINE 導線 */
.cta { margin: 30px 0; padding: 24px 20px; text-align: center; border: 1px solid var(--line); box-shadow: 0 4px 0 0 #f2f2f2; }
.cta_text { margin: 0 0 12px; font-size: 14px; }
.line_button { display: inline-block; background: #06C755; color: #fff !important; padding: 12px 28px; border-radius: 4px; font-weight: bold; text-decoration: none !important; }
.line_button:hover { opacity: .85; }

#next_prev_post { display: flex; justify-content: space-between; gap: 16px; font-size: 13px; margin: 20px 0 30px; }
#next_prev_post a { max-width: 48%; }
#next_prev_post a span { display: block; font-size: 11px; color: var(--muted); }
#next_prev_post .prev { text-align: right; }

/* sidebar */
.side_widget { margin: 0 0 25px; font-size: 12px; line-height: 1.7; }
.side_headline { background: #ededed; height: 30px; line-height: 30px; border-bottom: 3px solid var(--accent); margin: 0 0 15px; font-weight: normal; font-size: 14px; }
.side_headline span { background: var(--accent); display: inline-block; color: #fff; padding: 0 20px; }
.side_widget p { margin: 0 0 8px; }
.side_widget ul li { margin: 0 0 8px; padding: 0 0 0 9px; background: url(/theme/img/bullet1.gif) no-repeat left 8px; }
.side_widget .count { color: var(--muted); }
.widget_post_list li { display: flex; gap: 12px; align-items: center; padding: 0 0 10px; margin: 0 0 10px; border-bottom: 1px dotted var(--line); }
.widget_post_list li:last-child { border: none; }
.widget_post_list .image { flex: 0 0 70px; width: 70px; height: 70px; border: 1px solid #ddd; overflow: hidden; display: block; }
.widget_post_list .image img { width: 100%; height: 100%; object-fit: cover; display: block; }
.widget_post_list .title { font-size: 12px; }
.widget_line { text-align: center; }

/* footer */
#footer { margin-top: 40px; border-top: 1px solid var(--line); }
#footer_inner { max-width: 1000px; margin: 0 auto; padding: 20px 16px; font-size: 12px; }
.footer_cats a { color: var(--text); margin-right: 12px; text-decoration: underline; }
#copyright { text-align: center; height: 40px; line-height: 40px; font-size: 12px; background: var(--accent); color: #fff; }
#return_top { position: fixed; bottom: 10px; right: 10px; z-index: 10; display: block; width: 45px; height: 45px; text-indent: 100%; overflow: hidden; white-space: nowrap; background: #555 url(/theme/img/return_top2.gif) no-repeat center center; opacity: .5; }
#return_top:hover { opacity: 1; }