@charset "utf-8";

/* Reset */
*, *::before, *::after {
    box-sizing: border-box;
}

body {
    margin: 0;
    padding: 0;
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
    font-size: 16px;
    line-height: 1.7;
    color: #333;
    background: #f5f5f5;
}


a {
    color: #0066cc;
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

img {
    max-width: 100%;
    height: auto;
}

/* Container */
#container {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
}

/* Topbar */
.topbar {
    background: #333;
    color: #fff;
    font-size: 13px;
    line-height: 1.4;
    height: 34px;
    display: flex;
    align-items: center;
}

.topbar__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    width: 100%;
}

/* Header */
#header {
    background: #fff;
    border-bottom: 1px solid #e0e0e0;
}

.header-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 5px 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

#logo {
    margin: 0;
    padding: 0;
}

#logo a {
    display: block;
    color: #333;
}

#logo img {
    display: block;
    max-height: 60px;
    width: auto;
}

#logo .site-title {
    font-size: 24px;
    font-weight: bold;
}

/* Navigation */
#nav .menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    gap: 20px;
}

#nav .menu li {
    margin: 0;
}

#nav .menu a {
    color: #333;
    font-size: 14px;
    padding: 5px 0;
}

#nav .menu a:hover {
    color: #0066cc;
    text-decoration: none;
}

#nav .menu a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-align: center;
}

#nav .menu .menu-title {
    font-weight: 500;
}

#nav .menu .menu-desc {
    font-size: 11px;
    color: #888;
    margin-top: 2px;
}

#nav .menu a:hover .menu-desc {
    color: #0066cc;
}

/* Header menu - hide sub-menus */
#nav .menu .sub-menu {
    display: none;
}

/* Hero Section */
.swarm-hero {
    --hero-height: 500px;
    --hero-text-color: #fff;
    --hero-button-color: #0066cc;
    --hero-overlay-color: rgba(0,0,0,0.4);

    position: relative;
    height: var(--hero-height);
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.swarm-hero--fullscreen {
    height: 100vh;
}

.swarm-hero__bg {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.swarm-hero__video {
    position: absolute;
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    transform: translate(-50%, -50%);
    object-fit: cover;
}

.swarm-hero__slider {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.swarm-hero__slide {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    opacity: 0;
    transition: opacity 1s ease;
}

.swarm-hero__slide.is-active {
    opacity: 1;
}

.swarm-hero__slider-nav {
    position: absolute;
    bottom: 30px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 10;
}

.swarm-hero__slider-dot {
    width: 12px;
    height: 12px;
    border-radius: 50%;
    border: 2px solid #fff;
    background: transparent;
    cursor: pointer;
    transition: all 0.3s ease;
    padding: 0;
}

.swarm-hero__slider-dot:hover,
.swarm-hero__slider-dot.is-active {
    background: #fff;
}

.swarm-hero__overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: var(--hero-overlay-color);
}

.swarm-hero__content {
    position: relative;
    z-index: 5;
    text-align: center;
    padding: 20px;
    max-width: 800px;
    color: var(--hero-text-color);
}

.swarm-hero__title {
    font-size: 48px;
    font-weight: bold;
    margin: 0 0 20px;
    line-height: 1.3;
    text-shadow: 0 2px 10px rgba(0,0,0,0.3);
}

.swarm-hero__subtitle {
    font-size: 18px;
    margin: 0 0 30px;
    line-height: 1.7;
    text-shadow: 0 1px 5px rgba(0,0,0,0.3);
}

.swarm-hero__button {
    display: inline-block;
    padding: 15px 40px;
    background: var(--hero-button-color);
    color: #fff;
    font-size: 16px;
    font-weight: bold;
    border-radius: 50px;
    text-decoration: none;
    transition: all 0.3s ease;
    box-shadow: 0 4px 15px rgba(0,0,0,0.2);
}

.swarm-hero__button:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.3);
    color: #fff;
    text-decoration: none;
}

@media (max-width: 768px) {
    .swarm-hero__title {
        font-size: 28px;
    }

    .swarm-hero__subtitle {
        font-size: 15px;
    }

    .swarm-hero__button {
        padding: 12px 30px;
        font-size: 14px;
    }
}

/* Hero Below Navigation */
.hero-below-nav {
    background: #fff;
    border-bottom: 1px solid #e0e0e0;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
}

.hero-below-nav__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
}

/* Hero below nav - Logo (hidden by default) */
.hero-below-nav__logo {
    display: none;
    flex-shrink: 0;
    margin-right: 20px;
}

.hero-below-nav__logo a {
    display: flex;
    align-items: center;
    text-decoration: none;
    color: #333;
}

.hero-below-nav__logo img {
    max-height: 35px;
    width: auto;
}

.hero-below-nav__site-title {
    font-size: 16px;
    font-weight: bold;
    white-space: nowrap;
}

/* Hero below nav - Fixed state */
.hero-below-nav--can-fix {
    transition: transform 0.3s ease, box-shadow 0.3s ease;
}

.hero-below-nav.is-fixed {
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 1000;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    background: color-mix(in srgb, var(--swarm-hero-below-bg, #ffffff) 80%, transparent);
    backdrop-filter: blur(8px);
}

.hero-below-nav.is-fixed .hero-below-nav__inner {
    display: flex;
    align-items: center;
}

.hero-below-nav.is-fixed .hero-below-nav__logo {
    display: flex;
}

.hero-below-nav.is-fixed .hero-below-menu {
    justify-content: flex-start;
    flex: 1;
}

/* Fixed hero-below with topbar consideration */
.has-topbar .hero-below-nav.is-fixed {
    top: 0;
}

.hero-below-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    justify-content: center;
    flex-wrap: wrap;
    gap: 5px;
}

.hero-below-menu li {
    margin: 0;
}

.hero-below-menu a {
    display: flex;
    flex-direction: column;
    align-items: center;
    padding: 12px 25px;
    color: #333;
    font-size: 14px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s ease;
    border-bottom: 3px solid transparent;
}

.hero-below-menu .menu-title {
    display: block;
    line-height: 1.3;
}

.hero-below-menu .menu-desc {
    display: block;
    font-size: 10px;
    font-weight: 400;
    opacity: 0.7;
    margin-top: 2px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

.hero-below-menu a:hover {
    color: var(--swarm-main-color, #0066cc);
    background: #f8f9fa;
    text-decoration: none;
}

.hero-below-menu .current-menu-item a,
.hero-below-menu .current_page_item a {
    color: var(--swarm-main-color, #0066cc);
    border-bottom-color: var(--swarm-main-color, #0066cc);
}

/* Hero below menu - dropdown */
.hero-below-menu > li {
    position: relative;
}

.hero-below-menu .sub-menu {
    position: absolute;
    top: 100%;
    left: 0;
    min-width: 200px;
    background: var(--swarm-hero-below-bg, #ffffff);
    border: 1px solid rgba(0, 0, 0, 0.1);
    border-radius: 4px;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    list-style: none;
    margin: 0;
    padding: 8px 0;
    opacity: 0;
    visibility: hidden;
    transform: translateY(10px);
    transition: all 0.2s ease;
    z-index: 100;
}

.hero-below-menu > li:hover > .sub-menu {
    opacity: 1;
    visibility: visible;
    transform: translateY(0);
}

.hero-below-menu .sub-menu li {
    margin: 0;
}

.hero-below-menu .sub-menu a {
    display: block;
    padding: 10px 20px;
    font-size: 13px;
    border-bottom: none;
}

.hero-below-menu .sub-menu a:hover {
    background: rgba(0, 0, 0, 0.05);
}

@media (max-width: 768px) {
    .hero-below-menu {
        justify-content: flex-start;
        overflow-x: auto;
        flex-wrap: nowrap;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: none;
    }

    .hero-below-menu::-webkit-scrollbar {
        display: none;
    }

    .hero-below-menu a {
        padding: 12px 18px;
        white-space: nowrap;
    }
}

/* Post Carousel */
.post-carousel {
    background: #fff;
    padding: 20px 0;
    border-bottom: 1px solid #e0e0e0;
}

.post-carousel__inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    display: flex;
    align-items: center;
    gap: 15px;
}

.post-carousel__nav {
    flex-shrink: 0;
    width: 40px;
    height: 40px;
    border: none;
    background: #f5f5f5;
    border-radius: 50%;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #666;
    transition: all 0.2s ease;
}

.post-carousel__nav:hover {
    background: var(--swarm-main-color, #0066cc);
    color: #fff;
}

.post-carousel__nav:disabled {
    opacity: 0.3;
    cursor: not-allowed;
}

.post-carousel__track-wrapper {
    flex: 1;
    overflow: hidden;
}

.post-carousel__track {
    display: flex;
    gap: 15px;
    transition: transform 0.3s ease;
}

.post-carousel__item {
    flex: 0 0 calc((100% - 60px) / 5);
    min-width: 0;
}

.post-carousel__link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.post-carousel__thumbnail {
    position: relative;
    aspect-ratio: 16 / 9;
    overflow: hidden;
    border-radius: 4px;
}

.post-carousel__thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.post-carousel__item:hover .post-carousel__thumbnail img {
    transform: scale(1.05);
}

.post-carousel__overlay {
    position: absolute;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 30px 10px 10px;
    background: linear-gradient(to top, rgba(0, 0, 0, 0.7) 0%, rgba(0, 0, 0, 0) 100%);
}

.post-carousel__title {
    margin: 0;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.4;
    color: #fff;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-shadow: 0 1px 2px rgba(0, 0, 0, 0.3);
}

@media (max-width: 1024px) {
    .post-carousel__item {
        flex: 0 0 calc((100% - 45px) / 4);
    }
}

@media (max-width: 768px) {
    .post-carousel__item {
        flex: 0 0 calc((100% - 30px) / 3);
    }

    .post-carousel__nav {
        width: 32px;
        height: 32px;
    }

    .post-carousel__nav svg {
        width: 18px;
        height: 18px;
    }
}

@media (max-width: 480px) {
    .post-carousel__item {
        flex: 0 0 calc((100% - 15px) / 2);
    }

    .post-carousel__inner {
        padding: 0 10px;
        gap: 10px;
    }
}

/* Breadcrumb */
.breadcrumb {
    background: transparent;
}

.breadcrumb__list {
    max-width: 1200px;
    margin: 0 auto;
    padding: 20px 20px 10px;
    list-style: none;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 0;
    font-size: 12px;
}

.breadcrumb__item {
    display: flex;
    align-items: center;
}

.breadcrumb__item a {
    display: flex;
    align-items: center;
    color: #888;
    text-decoration: none;
    transition: color 0.2s;
}

.breadcrumb__item a:hover {
    color: var(--swarm-main-color, #0066cc);
    text-decoration: none;
}

.breadcrumb__home-icon {
    display: block;
    margin-right: 4px;
}

.breadcrumb__home-link {
    display: flex;
    align-items: center;
    gap: 4px;
}

.breadcrumb__item--current span {
    color: #555;
}

.breadcrumb__separator {
    margin: 0 8px;
    color: #ccc;
    display: block;
}

.screen-reader-text {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

@media (max-width: 768px) {
    .breadcrumb__list {
        padding: 15px 15px 8px;
        font-size: 11px;
    }

    .breadcrumb__separator {
        margin: 0 6px;
    }

    .breadcrumb__item--current span {
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        max-width: 180px;
    }
}

/* Main Wrap */
#main-wrap {
    flex: 1;
}

.main-container {
    max-width: 1200px;
    margin: 0 auto;
    padding: 30px 20px;
    display: flex;
    gap: 30px;
}

#main {
    flex: 1;
    min-width: 0;
}

/* Sidebar */
#sidebar {
    width: 300px;
    flex-shrink: 0;
}

.widget {
    background: #fff;
    padding: 16px 24px 24px;
    margin-bottom: 24px;
    border-radius: 4px;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transition: box-shadow 0.3s ease;
}

.widget:hover {
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
}

.widget-title,
.widget h2,
.widget h3,
.widget .wp-block-heading {
    margin: 0 0 20px;
    padding: 0;
    font-size: 15px;
    font-weight: 600;
    color: var(--swarm-main-color, #333);
    display: flex;
    align-items: center;
    gap: 10px;
    border-bottom: none;
}

.widget-title::before,
.widget h2::before,
.widget h3::before,
.widget .wp-block-heading::before {
    content: '';
    display: inline-block;
    width: 4px;
    height: 18px;
    background: var(--swarm-accent-color, #ff6600);
    border-radius: 2px;
    flex-shrink: 0;
}

.widget ul {
    list-style: none;
    margin: 0;
    padding: 0;
}

.widget li {
    padding: 0;
    border-bottom: none;
    margin-bottom: 4px;
}

.widget li:last-child {
    margin-bottom: 0;
}

.widget li a {
    display: flex;
    align-items: center;
    padding: 10px 12px;
    color: #555;
    text-decoration: none;
    border-radius: 8px;
    transition: all 0.2s ease;
    font-size: 14px;
}

.widget li a::before {
    content: '';
    display: inline-block;
    width: 6px;
    height: 6px;
    background: #ddd;
    border-radius: 50%;
    margin-right: 12px;
    transition: all 0.2s ease;
}

.widget li a:hover {
    background: #f8f9fa;
    color: var(--swarm-main-color, #0066cc);
    text-decoration: none;
}

.widget li a:hover::before {
    background: var(--swarm-main-color, #0066cc);
    transform: scale(1.3);
}

/* Search Widget */
.widget_search .search-form {
    display: flex;
    gap: 0;
}

.widget_search .search-field {
    flex: 1;
    padding: 12px 16px;
    border: 2px solid #e8e8e8;
    border-right: none;
    border-radius: 8px 0 0 8px;
    font-size: 14px;
    transition: border-color 0.2s ease;
    outline: none;
}

.widget_search .search-field:focus {
    border-color: var(--swarm-main-color, #0066cc);
}

.widget_search .search-submit {
    padding: 12px 18px;
    background: var(--swarm-main-color, #0066cc);
    color: #fff;
    border: none;
    border-radius: 0 8px 8px 0;
    cursor: pointer;
    font-size: 14px;
    font-weight: 500;
    transition: background 0.2s ease;
}

.widget_search .search-submit:hover {
    background: var(--swarm-main-color-dark, #0055aa);
}

/* Calendar Widget */
.widget_calendar table {
    width: 100%;
    border-collapse: collapse;
    font-size: 13px;
}

.widget_calendar caption {
    font-weight: 600;
    padding-bottom: 12px;
    color: #333;
}

.widget_calendar th,
.widget_calendar td {
    text-align: center;
    padding: 8px 4px;
}

.widget_calendar th {
    font-weight: 500;
    color: #888;
    font-size: 12px;
}

.widget_calendar td {
    border-radius: 4px;
}

.widget_calendar td a {
    display: block;
    background: var(--swarm-main-color, #0066cc);
    color: #fff;
    border-radius: 4px;
    text-decoration: none;
}

/* Tag Cloud Widget */
.widget_tag_cloud .tagcloud {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.widget_tag_cloud .tagcloud a {
    display: inline-block;
    padding: 6px 14px;
    background: #f5f5f5;
    color: #666;
    border-radius: 20px;
    font-size: 13px !important;
    text-decoration: none;
    transition: all 0.2s ease;
}

.widget_tag_cloud .tagcloud a:hover {
    background: var(--swarm-main-color, #0066cc);
    color: #fff;
}

/* Recent Posts Widget */
.widget_recent_entries li a {
    font-weight: 500;
}

.widget_recent_entries .post-date {
    display: block;
    font-size: 12px;
    color: #999;
    margin-top: 2px;
}

/* Recent Comments Widget */
.widget_recent_comments ul {
    margin: 0;
    padding: 0;
}

.widget_recent_comments li {
    margin-bottom: 12px;
    padding-bottom: 12px;
    border-bottom: 1px solid #f0f0f0;
}

.widget_recent_comments li:last-child {
    margin-bottom: 0;
    padding-bottom: 0;
    border-bottom: none;
}

.widget_recent_comments li,
.widget_recent_comments .recentcomments {
    font-size: 13px;
    line-height: 1.5;
    color: #666;
}

.widget_recent_comments .comment-author-link {
    font-weight: 600;
    color: #333;
}

.widget_recent_comments a {
    color: var(--swarm-main-color, #0066cc);
    text-decoration: none;
    font-weight: 500;
}

.widget_recent_comments a:hover {
    text-decoration: underline;
}

/* recentcommentsのスタイル */
.widget_recent_comments li.recentcomments {
    display: block;
    padding: 12px 14px;
    margin-bottom: 8px;
    background: #f9f9f9;
    border-radius: 8px;
    border-bottom: none;
}

.widget_recent_comments li.recentcomments:last-child {
    margin-bottom: 0;
}

.widget_recent_comments li.recentcomments a::before {
    display: none;
}

.widget_recent_comments .comment-author {
    display: block;
    font-size: 12px;
    color: #888;
    margin-bottom: 4px;
    line-height: 1.3;
}

.widget_recent_comments li.recentcomments a {
    display: block;
    padding: 0;
    background: none;
    border-radius: 0;
    line-height: 1.4;
}

.widget_recent_comments li.recentcomments {
    line-height: 1;
}

/* ブロック版最新コメント */
.wp-block-latest-comments {
    list-style: none !important;
    margin: 0 !important;
    padding: 0 !important;
}

.wp-block-latest-comments__comment {
    padding: 12px 14px !important;
    margin-bottom: 8px !important;
    background: #f9f9f9 !important;
    border-radius: 8px !important;
    font-size: 13px !important;
}

.wp-block-latest-comments__comment:last-child {
    margin-bottom: 0 !important;
}

.widget .wp-block-latest-comments__comment .comment-author,
.wp-block-latest-comments__comment .comment-author {
    display: inline !important;
    color: #888 !important;
    font-size: 12px !important;
    margin-right: 4px !important;
    padding: 0 !important;
    background: none !important;
}

.widget .wp-block-latest-comments__comment a,
.wp-block-latest-comments__comment a {
    display: inline !important;
    padding: 0 !important;
    background: none !important;
    border-radius: 0 !important;
    color: var(--swarm-main-color, #0066cc) !important;
    font-weight: 500 !important;
}

.widget .wp-block-latest-comments__comment a::before,
.wp-block-latest-comments__comment a::before {
    display: none !important;
}

/* Widget内のブロックエディタ要素のマージンリセット */
.widget .wp-block-group,
.widget .wp-block-group__inner-container {
    margin: 0;
    padding: 0;
}

.widget .wp-block-heading {
    margin-top: 0;
}

/* プロフィールウィジェット */
.profile-widget {
    text-align: center;
}

.profile-widget__image {
    margin-bottom: 15px;
}

.profile-widget__image img {
    width: 120px;
    height: 120px;
    border-radius: 50%;
    object-fit: cover;
    border: 3px solid #f0f0f0;
}

.profile-widget__name {
    font-size: 16px;
    font-weight: 600;
    color: #333;
    margin: 0 0 10px;
}

.profile-widget__bio {
    font-size: 13px;
    color: #666;
    line-height: 1.7;
    margin: 0;
}

.profile-widget__sns {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 15px;
}

.profile-widget__sns .sns-link {
    width: 32px;
    height: 32px;
    filter: none;
}

.profile-widget__sns .sns-link::before {
    filter: brightness(0) saturate(100%) invert(20%) sepia(0%) saturate(0%) hue-rotate(0deg) brightness(90%) contrast(90%);
}

.profile-widget__sns .sns-link:hover::before {
    filter: brightness(0) saturate(100%);
}

.profile-widget__link {
    margin-top: 15px;
    text-align: center;
}

.profile-widget__button {
    display: inline-block;
    padding: 8px 20px;
    background: var(--swarm-main-color, #0066cc);
    color: #fff;
    font-size: 13px;
    text-decoration: none;
    border-radius: 4px;
    transition: opacity 0.2s;
}

.profile-widget__button:hover {
    opacity: 0.8;
    color: #fff;
    text-decoration: none;
}

.widget ol {
    margin-left: 0;
    padding-left: 0;
    list-style-position: inside;
}

/* Post List */
.post-list {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.post-item {
    background: #fff;
    border-radius: 4px;
    overflow: hidden;
    display: flex;
    gap: 20px;
    padding: 20px;
}

.post-thumbnail {
    width: 200px;
    flex-shrink: 0;
    position: relative;
}

.post-thumbnail img {
    display: block;
    width: 100%;
    height: auto;
    border-radius: 4px;
    aspect-ratio: 16 / 9;
    object-fit: cover;
}

.category-badge {
    position: absolute;
    top: 8px;
    left: 8px;
    display: inline-block;
    background: color-mix(in srgb, var(--swarm-main-color, #0066cc) 80%, transparent);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
    padding: 4px 10px;
    border-radius: 3px;
    text-decoration: none;
    line-height: 1.3;
}

.category-badge:hover {
    background: var(--swarm-link-hover-color, #0055aa);
    color: #fff;
    text-decoration: none;
}

.post-content {
    flex: 1;
    min-width: 0;
}

.post-title {
    margin: 0 0 10px;
    font-size: 20px;
}

.post-title a {
    color: #333;
}

.post-title a:hover {
    color: #0066cc;
    text-decoration: none;
}

.post-meta {
    font-size: 13px;
    color: #666;
    margin-bottom: 10px;
}

.post-meta time {
    margin-right: 15px;
}

.post-excerpt {
    color: #555;
    font-size: 14px;
}

/* Single Post */
article.single-post,
article.page-content {
    background: #fff;
    padding: 30px;
    border-radius: 4px;
}

/* Comments */
.comments-area {
    background: #fff;
    padding: 30px;
    border-radius: 4px;
    margin-top: 30px;
}

.comments-title {
    font-size: 20px;
    margin: 0 0 20px;
    padding-bottom: 10px;
    border-bottom: 2px solid var(--swarm-main-color, #0066cc);
}

.comment-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.comment-list .comment {
    padding: 20px 0;
    border-bottom: 1px solid #e0e0e0;
}

.comment-list .comment:last-child {
    border-bottom: none;
}

.comment-author {
    font-weight: bold;
    margin-bottom: 5px;
}

.comment-author .avatar {
    border-radius: 50%;
    margin-right: 10px;
    vertical-align: middle;
}

.comment-metadata {
    font-size: 13px;
    color: #666;
    margin-bottom: 10px;
}

.comment-metadata a {
    color: #666;
}

.comment-content {
    line-height: 1.7;
}

.comment-content p {
    margin: 0 0 10px;
}

.comment-reply-link {
    font-size: 13px;
}

.comment-respond {
    margin-top: 30px;
}

.comment-reply-title {
    font-size: 18px;
    margin: 0 0 15px;
}

.comment-form label {
    display: block;
    margin-bottom: 5px;
    font-weight: 500;
}

.comment-form input[type="text"],
.comment-form input[type="email"],
.comment-form input[type="url"],
.comment-form textarea {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 14px;
}

.comment-form textarea {
    min-height: 150px;
    resize: vertical;
}

.comment-form .form-submit {
    margin-top: 15px;
}

.comment-form input[type="submit"] {
    background: var(--swarm-main-color, #0066cc);
    color: #fff;
    border: none;
    padding: 12px 30px;
    border-radius: 4px;
    font-size: 14px;
    cursor: pointer;
    transition: background 0.2s;
}

.comment-form input[type="submit"]:hover {
    background: var(--swarm-link-hover-color, #0055aa);
}

.no-comments {
    color: #666;
    font-style: italic;
}

.entry-header {
    margin-bottom: 20px;
}

.entry-title {
    margin: 0 0 10px;
    font-size: 28px;
}

.entry-meta {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 10px;
    font-size: 13px;
    color: #666;
}

.entry-meta .entry-categories {
    display: flex;
    flex-wrap: wrap;
    gap: 5px;
}

.entry-meta .category-badge {
    position: static;
    font-size: 12px;
}

.entry-thumbnail {
    margin-bottom: 20px;
}

.entry-thumbnail img {
    display: block;
    width: 100%;
    border-radius: 4px;
}

.entry-content {
    line-height: 1.8;
}

.entry-content h2 {
    font-size: 24px;
    margin: 40px 0 20px;
    line-height: 1.4;
}

.entry-content h3 {
    font-size: 20px;
    margin: 35px 0 15px;
    line-height: 1.4;
}

.entry-content p {
    margin: 0 0 15px;
}

.entry-content ul,
.entry-content ol {
    margin: 0 0 15px;
    padding-left: 25px;
}

.entry-content img {
    border-radius: 4px;
}

/* ==========================================================================
   Core Blocks Styles
   ========================================================================== */

/* Headings */
.entry-content h1 {
    font-size: 28px;
    margin: 40px 0 20px;
}

.entry-content h4 {
    font-size: 18px;
    margin: 30px 0 15px;
    line-height: 1.4;
}

.entry-content h5 {
    font-size: 16px;
    margin: 25px 0 12px;
    line-height: 1.4;
}

.entry-content h6 {
    font-size: 14px;
    margin: 15px 0 10px;
    font-weight: bold;
    color: #666;
}

/* Lists */
.entry-content li {
    margin-bottom: 8px;
}

.entry-content ul ul,
.entry-content ol ol,
.entry-content ul ol,
.entry-content ol ul {
    margin: 0;
}

/* Blockquote */
.entry-content blockquote,
.wp-block-quote {
    margin: 20px 0;
    padding: 20px 25px;
    background: #f8f9fa;
    border-left: 4px solid #0066cc;
    font-style: italic;
}

.wp-block-quote p {
    margin: 0 0 10px;
}

.wp-block-quote p:last-child {
    margin-bottom: 0;
}

.wp-block-quote cite,
.wp-block-quote footer {
    display: block;
    font-size: 14px;
    color: #666;
    font-style: normal;
    margin-top: 10px;
}

.wp-block-quote.is-style-large {
    padding: 30px 40px;
    font-size: 20px;
}

.wp-block-quote.is-style-plain {
    border-left: none;
    background: transparent;
    padding: 0;
    font-style: normal;
}

/* Pullquote */
.wp-block-pullquote {
    margin: 30px 0;
    padding: 30px;
    text-align: center;
    border-top: 4px solid #0066cc;
    border-bottom: 4px solid #0066cc;
}

.wp-block-pullquote blockquote {
    margin: 0;
    padding: 0;
    border: none;
    background: transparent;
}

.wp-block-pullquote p {
    font-size: 22px;
    line-height: 1.6;
    margin: 0 0 15px;
}

.wp-block-pullquote cite {
    font-size: 14px;
    color: #666;
}

/* Table */
.wp-block-table {
    margin: 20px 0;
    overflow-x: auto;
}

.wp-block-table table {
    width: 100%;
    border-collapse: collapse;
    font-size: 15px;
}

.wp-block-table th,
.wp-block-table td {
    padding: 12px 15px;
    border: 1px solid #ddd;
    text-align: left;
}

.wp-block-table th {
    background: #f5f5f5;
    font-weight: bold;
}

.wp-block-table tbody tr:nth-child(even) {
    background: #fafafa;
}

.wp-block-table.is-style-stripes tbody tr:nth-child(odd) {
    background: #f8f9fa;
}

.wp-block-table figcaption {
    font-size: 13px;
    color: #666;
    text-align: center;
    margin-top: 10px;
}

/* Image */
.wp-block-image {
    margin: 20px 0;
}

.wp-block-image img {
    display: block;
    border-radius: 4px;
}

.wp-block-image figcaption {
    font-size: 13px;
    color: #666;
    text-align: center;
    margin-top: 10px;
}

.wp-block-image.aligncenter {
    text-align: center;
}

.wp-block-image.alignleft {
    float: left;
    margin-right: 20px;
    margin-bottom: 10px;
}

.wp-block-image.alignright {
    float: right;
    margin-left: 20px;
    margin-bottom: 10px;
}

.wp-block-image.is-style-rounded img {
    border-radius: 50%;
}

/* Gallery */
.wp-block-gallery {
    margin: 20px 0;
}

.wp-block-gallery .wp-block-image {
    margin: 0;
}

.wp-block-gallery figcaption {
    font-size: 13px;
    color: #666;
}

/* Cover */
.wp-block-cover {
    margin: 20px 0;
    min-height: 300px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4px;
    overflow: hidden;
}

.wp-block-cover__inner-container {
    max-width: 800px;
    padding: 20px;
}

.wp-block-cover p {
    font-size: 18px;
}

/* Media & Text */
.wp-block-media-text {
    margin: 20px 0;
    display: grid;
    grid-template-columns: 50% 1fr;
    gap: 0;
}

.wp-block-media-text .wp-block-media-text__media {
    margin: 0;
}

.wp-block-media-text .wp-block-media-text__media img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.wp-block-media-text .wp-block-media-text__content {
    padding: 20px 30px;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.wp-block-media-text.has-media-on-the-right {
    grid-template-columns: 1fr 50%;
}

.wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
    order: 2;
}

.wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
    order: 1;
}

/* Columns */
.wp-block-columns {
    margin: 20px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
}

.wp-block-column {
    flex: 1;
    min-width: 0;
}

/* Buttons */
.wp-block-buttons {
    margin: 20px 0;
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
}

.wp-block-button__link {
    display: inline-block;
    padding: 12px 24px;
    background: #0066cc;
    color: #fff;
    border-radius: 4px;
    font-size: 15px;
    font-weight: 500;
    text-decoration: none;
    transition: all 0.2s ease;
}

.wp-block-button__link:hover {
    background: #0055aa;
    color: #fff;
    text-decoration: none;
}

.wp-block-button.is-style-outline .wp-block-button__link {
    background: transparent;
    border: 2px solid #0066cc;
    color: #0066cc;
}

.wp-block-button.is-style-outline .wp-block-button__link:hover {
    background: #0066cc;
    color: #fff;
}

/* Separator */
.wp-block-separator {
    margin: 30px auto;
    border: none;
    border-top: 1px solid #ddd;
}

.wp-block-separator.is-style-wide {
    width: 100%;
}

.wp-block-separator.is-style-dots {
    border: none;
    text-align: center;
}

.wp-block-separator.is-style-dots::before {
    content: '···';
    font-size: 24px;
    letter-spacing: 1em;
    color: #999;
}

/* Spacer */
.wp-block-spacer {
    clear: both;
}

/* Code & Preformatted */
.wp-block-code,
.wp-block-preformatted {
    margin: 20px 0;
    padding: 20px;
    background: #1e1e1e;
    color: #f8f8f2;
    border-radius: 4px;
    overflow-x: auto;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 14px;
    line-height: 1.6;
}

.wp-block-code code {
    background: transparent;
    padding: 0;
    color: inherit;
}

code {
/*    background: #f0f0f0;*/
    padding: 2px 6px;
    border-radius: 3px;
    font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace;
    font-size: 0.9em;
}

/* Verse */
.wp-block-verse {
    margin: 20px 0;
    padding: 20px;
    background: #f8f9fa;
    font-family: Georgia, serif;
    white-space: pre-wrap;
}

/* Details (Accordion) */
.wp-block-details {
    margin: 20px 0;
    border: 1px solid #e0e0e0;
    border-radius: 4px;
}

.wp-block-details summary {
    padding: 15px 20px;
    background: #f5f5f5;
    cursor: pointer;
    font-weight: 500;
}

.wp-block-details summary:hover {
    background: #eee;
}

.wp-block-details[open] summary {
    border-bottom: 1px solid #e0e0e0;
}

.wp-block-details > *:not(summary) {
    padding: 20px;
}

/* Group */
.wp-block-group {
    margin: 20px 0;
}

.wp-block-group.has-background {
    padding: 20px;
    border-radius: 4px;
}

/* List with icons */
.is-style-checkmark-list li::marker {
    content: '✓ ';
    color: #28a745;
}

/* File */
.wp-block-file {
    margin: 20px 0;
    display: flex;
    align-items: center;
    gap: 15px;
}

.wp-block-file a:first-child {
    flex: 1;
}

.wp-block-file .wp-block-file__button {
    display: inline-block;
    padding: 8px 16px;
    background: #0066cc;
    color: #fff;
    border-radius: 4px;
    font-size: 14px;
    text-decoration: none;
}

.wp-block-file .wp-block-file__button:hover {
    background: #0055aa;
    text-decoration: none;
}

/* Embed */
.wp-block-embed {
    margin: 20px 0;
}

.wp-block-embed figcaption {
    font-size: 13px;
    color: #666;
    text-align: center;
    margin-top: 10px;
}

/* Video/Audio */
.wp-block-video,
.wp-block-audio {
    margin: 20px 0;
}

.wp-block-video video,
.wp-block-audio audio {
    display: block;
    width: 100%;
}

.wp-block-video figcaption,
.wp-block-audio figcaption {
    font-size: 13px;
    color: #666;
    text-align: center;
    margin-top: 10px;
}

/* Footnotes */
.wp-block-footnotes {
    margin: 30px 0;
    padding-top: 20px;
    border-top: 1px solid #ddd;
    font-size: 14px;
}

/* Clear floats */
.entry-content::after {
    content: '';
    display: table;
    clear: both;
}

/* Responsive for Core Blocks */
@media (max-width: 768px) {
    .wp-block-columns {
        flex-direction: column;
    }

    .wp-block-column {
        flex-basis: 100% !important;
    }

    .wp-block-media-text {
        grid-template-columns: 1fr;
    }

    .wp-block-media-text.has-media-on-the-right {
        grid-template-columns: 1fr;
    }

    .wp-block-media-text .wp-block-media-text__media,
    .wp-block-media-text.has-media-on-the-right .wp-block-media-text__media {
        order: 1;
    }

    .wp-block-media-text .wp-block-media-text__content,
    .wp-block-media-text.has-media-on-the-right .wp-block-media-text__content {
        order: 2;
        padding: 20px;
    }

    .wp-block-image.alignleft,
    .wp-block-image.alignright {
        float: none;
        margin: 20px 0;
    }

    .wp-block-pullquote p {
        font-size: 18px;
    }

    .wp-block-quote.is-style-large {
        padding: 20px 25px;
        font-size: 17px;
    }
}

.entry-tags {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #eee;
    font-size: 14px;
}

.tag-label {
    font-weight: bold;
    margin-right: 5px;
}

/* Post Navigation */
.post-navigation {
    display: flex;
    justify-content: space-between;
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}

.post-navigation a {
    max-width: 45%;
}

/* Related Posts */
.related-posts {
    margin-top: 40px;
    padding: 30px;
    background: #fff;
    border-radius: 4px;
}

.related-posts__title {
    margin: 0 0 20px;
    padding: 0 0 15px;
    font-size: 18px;
    font-weight: 600;
    color: #333;
    border-bottom: 2px solid var(--swarm-main-color, #0066cc);
}

.related-posts__list {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 20px;
}

.related-posts__item {
    background: #f9f9f9;
    border-radius: 4px;
    overflow: hidden;
    transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.related-posts__item:hover {
    transform: translateY(-3px);
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

.related-posts__link {
    display: block;
    text-decoration: none;
    color: inherit;
}

.related-posts__thumbnail {
    aspect-ratio: 16 / 9;
    overflow: hidden;
}

.related-posts__thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
}

.related-posts__item:hover .related-posts__thumbnail img {
    transform: scale(1.05);
}

.related-posts__item-title {
    margin: 0;
    padding: 12px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    color: #333;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

@media (max-width: 768px) {
    .related-posts__list {
        grid-template-columns: repeat(2, 1fr);
        gap: 15px;
    }

    .related-posts {
        padding: 20px;
    }

    .related-posts__item-title {
        font-size: 13px;
        padding: 10px;
    }
}

@media (max-width: 480px) {
    .related-posts__list {
        grid-template-columns: 1fr;
    }
}

/* Pagination */
.pagination {
    margin-top: 30px;
}

.pagination .nav-links {
    display: flex;
    justify-content: center;
    gap: 5px;
}

.pagination .page-numbers {
    display: inline-block;
    padding: 8px 15px;
    background: #fff;
    border-radius: 4px;
}

.pagination .page-numbers.current {
    background: #0066cc;
    color: #fff;
}

/* Archive Header */
.archive-header,
.search-header {
    margin-bottom: 30px;
}

.archive-title,
.search-title {
    margin: 0 0 10px;
    font-size: 24px;
}

.archive-description {
    color: #666;
}

/* 404 */
.error-404 {
    background: #fff;
    padding: 60px 30px;
    border-radius: 4px;
    text-align: center;
}

.error-404 .entry-title {
    font-size: 32px;
}

.search-form-wrap {
    margin-top: 30px;
}

/* Search Form */
.search-form {
    display: flex;
    max-width: 400px;
    margin: 0 auto;
}

.search-form .search-field {
    flex: 1;
    padding: 10px 15px;
    border: 1px solid #ddd;
    border-right: none;
    border-radius: 4px 0 0 4px;
    font-size: 14px;
}

.search-form .search-submit {
    padding: 10px 20px;
    background: #0066cc;
    color: #fff;
    border: none;
    border-radius: 0 4px 4px 0;
    cursor: pointer;
}

.search-form .search-submit:hover {
    background: #0055aa;
}

/* Footer */
#footer {
    background: #333;
    color: #fff;
    padding: 30px 0;
    margin-top: auto;
}

.footer-inner {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 20px;
    text-align: center;
}

.footer-nav {
    margin-bottom: 20px;
}

.footer-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 10px 20px;
}

.footer-menu li {
    position: relative;
}

.footer-menu a {
    color: #ccc;
    font-size: 14px;
}

.footer-menu a:hover {
    color: #fff;
}

.footer-menu .sub-menu {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 5px 15px;
}

.footer-menu .sub-menu a {
    font-size: 13px;
    color: #999;
}

.footer-menu .sub-menu a::before {
    content: '└ ';
    color: #666;
}

.footer-sns {
    display: flex;
    justify-content: center;
    gap: 15px;
    margin-bottom: 20px;
}

.sns-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    background: rgba(255, 255, 255, 0.1);
    border-radius: 50%;
    transition: all 0.2s ease;
}

.sns-link:hover {
    background: rgba(255, 255, 255, 0.2);
    text-decoration: none;
}

.sns-link::before {
    content: '';
    display: block;
    width: 20px;
    height: 20px;
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    filter: brightness(0) invert(1);
}

.sns-link--twitter::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M18.244 2.25h3.308l-7.227 8.26 8.502 11.24H16.17l-5.214-6.817L4.99 21.75H1.68l7.73-8.835L1.254 2.25H8.08l4.713 6.231zm-1.161 17.52h1.833L7.084 4.126H5.117z"/></svg>');
}

.sns-link--facebook::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M24 12.073c0-6.627-5.373-12-12-12s-12 5.373-12 12c0 5.99 4.388 10.954 10.125 11.854v-8.385H7.078v-3.47h3.047V9.43c0-3.007 1.792-4.669 4.533-4.669 1.312 0 2.686.235 2.686.235v2.953H15.83c-1.491 0-1.956.925-1.956 1.874v2.25h3.328l-.532 3.47h-2.796v8.385C19.612 23.027 24 18.062 24 12.073z"/></svg>');
}

.sns-link--instagram::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 2.163c3.204 0 3.584.012 4.85.07 3.252.148 4.771 1.691 4.919 4.919.058 1.265.069 1.645.069 4.849 0 3.205-.012 3.584-.069 4.849-.149 3.225-1.664 4.771-4.919 4.919-1.266.058-1.644.07-4.85.07-3.204 0-3.584-.012-4.849-.07-3.26-.149-4.771-1.699-4.919-4.92-.058-1.265-.07-1.644-.07-4.849 0-3.204.013-3.583.07-4.849.149-3.227 1.664-4.771 4.919-4.919 1.266-.057 1.645-.069 4.849-.069zm0-2.163c-3.259 0-3.667.014-4.947.072-4.358.2-6.78 2.618-6.98 6.98-.059 1.281-.073 1.689-.073 4.948 0 3.259.014 3.668.072 4.948.2 4.358 2.618 6.78 6.98 6.98 1.281.058 1.689.072 4.948.072 3.259 0 3.668-.014 4.948-.072 4.354-.2 6.782-2.618 6.979-6.98.059-1.28.073-1.689.073-4.948 0-3.259-.014-3.667-.072-4.947-.196-4.354-2.617-6.78-6.979-6.98-1.281-.059-1.69-.073-4.949-.073zm0 5.838c-3.403 0-6.162 2.759-6.162 6.162s2.759 6.163 6.162 6.163 6.162-2.759 6.162-6.163c0-3.403-2.759-6.162-6.162-6.162zm0 10.162c-2.209 0-4-1.79-4-4 0-2.209 1.791-4 4-4s4 1.791 4 4c0 2.21-1.791 4-4 4zm6.406-11.845c-.796 0-1.441.645-1.441 1.44s.645 1.44 1.441 1.44c.795 0 1.439-.645 1.439-1.44s-.644-1.44-1.439-1.44z"/></svg>');
}

.sns-link--threads::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.186 24h-.007c-3.581-.024-6.334-1.205-8.184-3.509C2.35 18.44 1.5 15.586 1.472 12.01v-.017c.03-3.579.879-6.43 2.525-8.482C5.845 1.205 8.6.024 12.18 0h.014c2.746.02 5.043.725 6.826 2.098 1.677 1.29 2.858 3.13 3.509 5.467l-2.04.569c-1.104-3.96-3.898-5.984-8.304-6.015-2.91.022-5.11.936-6.54 2.717C4.307 6.504 3.616 8.914 3.589 12c.027 3.086.718 5.496 2.057 7.164 1.43 1.783 3.631 2.698 6.54 2.717 2.623-.02 4.358-.631 5.8-2.045 1.647-1.613 1.618-3.593 1.09-4.798-.31-.71-.873-1.3-1.634-1.75-.192 1.352-.622 2.446-1.284 3.272-.886 1.102-2.14 1.704-3.73 1.79-1.202.065-2.361-.218-3.259-.801-1.063-.689-1.685-1.74-1.752-2.96-.065-1.182.408-2.256 1.332-3.023.88-.73 2.088-1.146 3.6-1.242 1.02-.064 1.987-.025 2.897.115-.078-.586-.263-1.063-.552-1.418-.396-.487-1.023-.755-1.862-.796-1.456-.07-2.563.39-3.413 1.418l-1.517-1.28c1.104-1.396 2.738-2.166 4.873-2.166h.18c1.425.07 2.562.56 3.38 1.458.737.81 1.174 1.892 1.3 3.217.468.083.91.19 1.325.32 1.037.328 1.907.835 2.59 1.51.872.863 1.449 1.997 1.716 3.373.305 1.572.088 3.365-1.063 5.028-1.303 1.882-3.343 2.972-6.075 3.24-.316.031-.633.046-.95.046zm-.09-8.044c-.958.058-1.702.323-2.216.79-.46.42-.685.955-.652 1.55.035.634.326 1.16.866 1.563.589.44 1.398.665 2.276.622 1.09-.059 1.908-.443 2.503-1.175.473-.582.78-1.39.916-2.411-.95-.192-1.972-.261-2.693-.261-.342 0-.67.017-1 .044v-.722z"/></svg>');
}

.sns-link--note::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M22.8 4.32a2.36 2.36 0 0 0-.7-.56 7.28 7.28 0 0 0-1.86-.67A21.64 21.64 0 0 0 17 2.74a44.08 44.08 0 0 0-5-.28 44.08 44.08 0 0 0-5 .28 21.64 21.64 0 0 0-3.24.35 7.28 7.28 0 0 0-1.86.67 2.36 2.36 0 0 0-.7.56 1.2 1.2 0 0 0-.2.68v14.9a1.2 1.2 0 0 0 .2.68 2.36 2.36 0 0 0 .7.56 7.28 7.28 0 0 0 1.86.67 21.64 21.64 0 0 0 3.24.35 44.08 44.08 0 0 0 5 .28 44.08 44.08 0 0 0 5-.28 21.64 21.64 0 0 0 3.24-.35 7.28 7.28 0 0 0 1.86-.67 2.36 2.36 0 0 0 .7-.56 1.2 1.2 0 0 0 .2-.68V5a1.2 1.2 0 0 0-.2-.68zM9.55 16.59a1.4 1.4 0 1 1 1.4-1.4 1.4 1.4 0 0 1-1.4 1.4zm5.3-4.54H7.12a.58.58 0 0 1 0-1.16h7.73a.58.58 0 0 1 0 1.16zm1.87-3.09H7.12a.58.58 0 0 1 0-1.16h9.6a.58.58 0 0 1 0 1.16z"/></svg>');
}

.sns-link--youtube::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M23.498 6.186a3.016 3.016 0 0 0-2.122-2.136C19.505 3.545 12 3.545 12 3.545s-7.505 0-9.377.505A3.017 3.017 0 0 0 .502 6.186C0 8.07 0 12 0 12s0 3.93.502 5.814a3.016 3.016 0 0 0 2.122 2.136c1.871.505 9.376.505 9.376.505s7.505 0 9.377-.505a3.015 3.015 0 0 0 2.122-2.136C24 15.93 24 12 24 12s0-3.93-.502-5.814zM9.545 15.568V8.432L15.818 12l-6.273 3.568z"/></svg>');
}

.sns-link--tiktok::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12.525.02c1.31-.02 2.61-.01 3.91-.02.08 1.53.63 3.09 1.75 4.17 1.12 1.11 2.7 1.62 4.24 1.79v4.03c-1.44-.05-2.89-.35-4.2-.97-.57-.26-1.1-.59-1.62-.93-.01 2.92.01 5.84-.02 8.75-.08 1.4-.54 2.79-1.35 3.94-1.31 1.92-3.58 3.17-5.91 3.21-1.43.08-2.86-.31-4.08-1.03-2.02-1.19-3.44-3.37-3.65-5.71-.02-.5-.03-1-.01-1.49.18-1.9 1.12-3.72 2.58-4.96 1.66-1.44 3.98-2.13 6.15-1.72.02 1.48-.04 2.96-.04 4.44-.99-.32-2.15-.23-3.02.37-.63.41-1.11 1.04-1.36 1.75-.21.51-.15 1.07-.14 1.61.24 1.64 1.82 3.02 3.5 2.87 1.12-.01 2.19-.66 2.77-1.61.19-.33.4-.67.41-1.06.1-1.79.06-3.57.07-5.36.01-4.03-.01-8.05.02-12.07z"/></svg>');
}

.sns-link--line::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M19.365 9.863c.349 0 .63.285.63.631 0 .345-.281.63-.63.63H17.61v1.125h1.755c.349 0 .63.283.63.63 0 .344-.281.629-.63.629h-2.386c-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63h2.386c.349 0 .63.285.63.63 0 .349-.281.63-.63.63H17.61v1.125h1.755zm-3.855 3.016c0 .27-.174.51-.432.596-.064.021-.133.031-.199.031-.211 0-.391-.09-.51-.25l-2.443-3.317v2.94c0 .344-.279.629-.631.629-.346 0-.626-.285-.626-.629V8.108c0-.27.173-.51.43-.595.06-.023.136-.033.194-.033.195 0 .375.104.495.254l2.462 3.33V8.108c0-.345.282-.63.63-.63.345 0 .63.285.63.63v4.771zm-5.741 0c0 .344-.282.629-.631.629-.345 0-.627-.285-.627-.629V8.108c0-.345.282-.63.63-.63.346 0 .628.285.628.63v4.771zm-2.466.629H4.917c-.345 0-.63-.285-.63-.629V8.108c0-.345.285-.63.63-.63.348 0 .63.285.63.63v4.141h1.756c.348 0 .629.283.629.63 0 .344-.282.629-.629.629M24 10.314C24 4.943 18.615.572 12 .572S0 4.943 0 10.314c0 4.811 4.27 8.842 10.035 9.608.391.082.923.258 1.058.59.12.301.079.766.038 1.08l-.164 1.02c-.045.301-.24 1.186 1.049.645 1.291-.539 6.916-4.078 9.436-6.975C23.176 14.393 24 12.458 24 10.314"/></svg>');
}

.sns-link--github::before {
    background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 24 24"><path d="M12 .297c-6.63 0-12 5.373-12 12 0 5.303 3.438 9.8 8.205 11.385.6.113.82-.258.82-.577 0-.285-.01-1.04-.015-2.04-3.338.724-4.042-1.61-4.042-1.61C4.422 18.07 3.633 17.7 3.633 17.7c-1.087-.744.084-.729.084-.729 1.205.084 1.838 1.236 1.838 1.236 1.07 1.835 2.809 1.305 3.495.998.108-.776.417-1.305.76-1.605-2.665-.3-5.466-1.332-5.466-5.93 0-1.31.465-2.38 1.235-3.22-.135-.303-.54-1.523.105-3.176 0 0 1.005-.322 3.3 1.23.96-.267 1.98-.399 3-.405 1.02.006 2.04.138 3 .405 2.28-1.552 3.285-1.23 3.285-1.23.645 1.653.24 2.873.12 3.176.765.84 1.23 1.91 1.23 3.22 0 4.61-2.805 5.625-5.475 5.92.42.36.81 1.096.81 2.22 0 1.606-.015 2.896-.015 3.286 0 .315.21.69.825.57C20.565 22.092 24 17.592 24 12.297c0-6.627-5.373-12-12-12"/></svg>');
}

.copyright {
    font-size: 13px;
    color: #999;
}

.copyright p {
    margin: 0;
}

/* No Posts */
.no-posts {
    background: #fff;
    padding: 60px 30px;
    border-radius: 4px;
    text-align: center;
    color: #666;
}

/* Responsive */
@media (max-width: 768px) {
    .header-inner {
        flex-direction: column;
        gap: 15px;
    }

    #nav .menu {
        flex-wrap: wrap;
        justify-content: center;
    }

    .main-container {
        flex-direction: column;
    }

    #sidebar {
        width: 100%;
    }

    .post-item {
        flex-direction: column;
    }

    .post-thumbnail {
        width: 100%;
    }

    .entry-title {
        font-size: 22px;
    }
}

/* Share Buttons */
.share-buttons {
    margin: 30px 0;
    padding: 20px;
    background: #f8f9fa;
    border-radius: 8px;
    text-align: center;
}

.share-buttons__label {
    display: block;
    font-size: 14px;
    font-weight: 600;
    color: #666;
    margin-bottom: 15px;
}

.share-buttons__list {
    display: flex;
    justify-content: center;
    gap: 10px;
    flex-wrap: wrap;
}

.share-buttons__item {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    color: #fff;
    text-decoration: none;
    transition: transform 0.2s, opacity 0.2s;
    border: none;
    cursor: pointer;
}

.share-buttons__item:hover {
    transform: scale(1.1);
    opacity: 0.9;
    text-decoration: none;
    color: #fff;
}

.share-buttons__item--x {
    background: #000;
}

.share-buttons__item--facebook {
    background: #1877f2;
}

.share-buttons__item--threads {
    background: #000;
}

.share-buttons__item--line {
    background: #06c755;
}

.share-buttons__item--hatena {
    background: #00a4de;
}

.share-buttons__item--pocket {
    background: #ef4056;
}

.share-buttons__item--copy {
    background: #6c757d;
    position: relative;
}

.share-buttons__item--copy.copied {
    background: #28a745;
}

.share-buttons__tooltip {
    position: absolute;
    bottom: 100%;
    left: 50%;
    transform: translateX(-50%);
    background: #333;
    color: #fff;
    font-size: 12px;
    padding: 6px 12px;
    border-radius: 4px;
    white-space: nowrap;
    margin-bottom: 8px;
    animation: tooltipFadeIn 0.2s ease;
}

.share-buttons__tooltip::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    transform: translateX(-50%);
    border: 6px solid transparent;
    border-top-color: #333;
}

@keyframes tooltipFadeIn {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(5px);
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }
}

@media (max-width: 480px) {
    .share-buttons__item {
        width: 40px;
        height: 40px;
    }

    .share-buttons__item svg {
        width: 16px;
        height: 16px;
    }
}

/* ========================================
   Table of Contents (目次)
   ======================================== */
.toc {
    margin: 30px 0;
    padding: 25px 30px;
    background: #f8f9fa;
    border-radius: 8px;
    border: 1px solid #e9ecef;
}

.toc__toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    padding: 0 0 10px;
    margin: 0 0 15px;
    background: none;
    border: none;
    border-bottom: 2px solid var(--swarm-main-color, #0066cc);
    cursor: pointer;
    text-align: left;
}

.toc__title {
    font-size: 18px;
    font-weight: 600;
    color: #333;
}

.toc__icon {
    position: relative;
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.toc__icon::before,
.toc__icon::after {
    content: '';
    position: absolute;
    background: #666;
    transition: transform 0.3s ease;
}

.toc__icon::before {
    top: 50%;
    left: 0;
    width: 100%;
    height: 2px;
    transform: translateY(-50%);
}

.toc__icon::after {
    top: 0;
    left: 50%;
    width: 2px;
    height: 100%;
    transform: translateX(-50%);
}

.toc__toggle[aria-expanded="false"] .toc__icon::after {
    transform: translateX(-50%) rotate(0deg);
}

.toc__toggle[aria-expanded="true"] .toc__icon::after {
    transform: translateX(-50%) rotate(90deg);
    opacity: 0;
}

.toc__nav {
    font-size: 15px;
    line-height: 1.8;
    overflow: hidden;
    transition: max-height 0.3s ease, opacity 0.3s ease;
    max-height: 2000px;
    opacity: 1;
}

.toc__nav--hidden {
    max-height: 0;
    opacity: 0;
}

.toc__list {
    margin: 0;
    padding: 0;
    list-style: none;
    counter-reset: toc-counter;
}

.toc__sublist {
    margin: 5px 0 5px 20px;
    padding: 0;
    list-style: none;
    counter-reset: toc-sub-counter;
}

.toc__item {
    margin: 0;
    padding:0;
}

.toc__item--h2 {
    counter-increment: toc-counter;
}

.toc__item--h3 {
    counter-increment: toc-sub-counter;
}

.toc__item--h2 > .toc__link::before {
    content: counter(toc-counter) ". ";
    font-weight: 600;
    color: var(--swarm-main-color, #0066cc);
}

.toc__item--h3 > .toc__link::before {
    content: counter(toc-counter) "-" counter(toc-sub-counter) ". ";
    color: #666;
}

.toc__item--h4 > .toc__link {
    font-size: 14px;
    color: #666;
}

.toc__link {
    display: block;
    color: #333;
    text-decoration: none;
    transition: color 0.2s ease, padding-left 0.2s ease;
}

.toc__link:hover {
    color: var(--swarm-main-color, #0066cc);
    padding-left: 5px;
}

@media (max-width: 768px) {
    .toc {
        padding: 20px;
    }

    .toc__title {
        font-size: 16px;
    }

    .toc__nav {
        font-size: 14px;
    }

    .toc__sublist {
        margin-left: 15px;
    }

    .toc__icon {
        width: 14px;
        height: 14px;
    }
}

/* ========================================
   Code Block with Copy Button
   ======================================== */
.code-block-wrapper {
    position: relative;
    margin: 1.5em 0;
}

.code-block-wrapper pre.wp-block-code {
    margin: 0;
    padding: 20px;
    padding-top: 45px;
    background: #1e1e1e;
    border-radius: 8px;
    overflow-x: auto;
}

.code-block-wrapper pre.wp-block-code code {
    display: block;
    font-family: 'SF Mono', 'Monaco', 'Inconsolata', 'Roboto Mono', 'Source Code Pro', monospace;
    font-size: 14px;
    line-height: 1.6;
    color: #e0e0e0;
    background: none;
    padding: 0;
    white-space: pre;
}

.code-block__copy {
    position: absolute;
    top: 8px;
    right: 8px;
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 6px 12px;
    background: rgba(255, 255, 255, 0.1);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 4px;
    color: #aaa;
    font-size: 12px;
    cursor: pointer;
    transition: all 0.2s ease;
    z-index: 10;
}

.code-block__copy:hover {
    background: rgba(255, 255, 255, 0.2);
    color: #fff;
}

.code-block__copy.copied {
    background: #28a745;
    border-color: #28a745;
    color: #fff;
}

.code-block__copy svg {
    flex-shrink: 0;
}

@media (max-width: 480px) {
    .code-block-wrapper pre.wp-block-code {
        padding: 15px;
        padding-top: 45px;
        border-radius: 4px;
    }

    .code-block-wrapper pre.wp-block-code code {
        font-size: 12px;
    }

    .code-block__copy-text {
        display: none;
    }

    .code-block__copy {
        padding: 6px 8px;
    }
}

/* ========================================
   Single Column (個別1カラム設定)
   ======================================== */
body.single-column #sidebar {
    display: none;
}

body.single-column #main {
    max-width: 900px;
    margin: 0 auto;
}

/* ========================================
   Sitemap Page
   ======================================== */
.sitemap-page {
    max-width: 900px;
    margin: 0 auto;
}

.sitemap-page .entry-content {
    max-width: none;
}

.sitemap-section {
    margin-bottom: 40px;
}

.sitemap-section:last-child {
    margin-bottom: 0;
}

.sitemap-section__title {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 0 0 20px;
    padding: 0 0 10px;
    font-size: 20px;
    font-weight: 600;
    color: #333;
    border-bottom: 2px solid var(--swarm-main-color, #0066cc);
}

.sitemap-section__title svg {
    flex-shrink: 0;
    color: var(--swarm-main-color, #0066cc);
}

.sitemap-list {
    margin: 0;
    padding: 0;
    list-style: none;
}

.sitemap-list--categories {
    display: flex;
    flex-wrap: wrap;
    gap: 10px 20px;
}

.sitemap-list--categories .sitemap-list__item {
    padding: 0;
    border: none;
}

.sitemap-list--categories .sitemap-list__item a {
    display: inline-flex;
    align-items: center;
    padding: 8px 16px;
    background: #f5f5f5;
    border-radius: 20px;
    color: #333;
    font-size: 14px;
    text-decoration: none;
    transition: all 0.2s ease;
}

.sitemap-list--categories .sitemap-list__item a:hover {
    background: var(--swarm-main-color, #0066cc);
    color: #fff;
}

.sitemap-list--categories .sitemap-list__count {
    margin-left: 5px;
    font-size: 12px;
    color: #999;
}

.sitemap-list--categories .sitemap-list__item a:hover + .sitemap-list__count,
.sitemap-list--categories .sitemap-list__item:hover .sitemap-list__count {
    color: #ccc;
}

.sitemap-list--pages .sitemap-list__item,
.sitemap-list--posts .sitemap-list__item {
    padding: 12px 0;
    border-bottom: 1px solid #eee;
}

.sitemap-list--pages .sitemap-list__item:last-child,
.sitemap-list--posts .sitemap-list__item:last-child {
    border-bottom: none;
}

.sitemap-list--pages .sitemap-list__item a,
.sitemap-list--posts .sitemap-list__item a {
    color: #333;
    text-decoration: none;
    font-weight: 500;
    transition: color 0.2s ease;
}

.sitemap-list--pages .sitemap-list__item a:hover,
.sitemap-list--posts .sitemap-list__item a:hover {
    color: var(--swarm-main-color, #0066cc);
}

.sitemap-list__meta {
    display: flex;
    align-items: center;
    gap: 15px;
    margin-top: 5px;
    font-size: 13px;
    color: #999;
}

.sitemap-list__meta time {
    color: #999;
}

.sitemap-list__category {
    display: inline-block;
    padding: 2px 8px;
    background: #f0f0f0;
    border-radius: 3px;
    font-size: 12px;
    color: #666;
}

.sitemap-pagination {
    margin-top: 30px;
    padding-top: 20px;
    border-top: 1px solid #eee;
}

@media (max-width: 768px) {
    .sitemap-section__title {
        font-size: 18px;
    }

    .sitemap-list--categories {
        gap: 8px 12px;
    }

    .sitemap-list--categories .sitemap-list__item a {
        padding: 6px 12px;
        font-size: 13px;
    }

    .sitemap-list--pages .sitemap-list__item,
    .sitemap-list--posts .sitemap-list__item {
        padding: 10px 0;
    }

    .sitemap-list__meta {
        flex-wrap: wrap;
        gap: 8px;
    }
}