:root{--fs-min:14px;--fs-xs:14px;--fs-sm:15px;--fs-base:16px;--fs-md:18px;--fs-lg:19px;--fs-xl:20px;--fs-2xl:22px;--fs-3xl:26px;--fs-body:1.625rem;}
*{margin:0;padding:0;box-sizing:border-box;}
body{margin:0 auto;font-family:"Yu Gothic Medium","游ゴシック Medium",YuGothic,"游ゴシック体","ヒラギノ角ゴ Pro W3","メイリオ",sans-serif;font-style:normal;font-weight:400;font-size:var(--fs-body);line-height:1.5;-webkit-text-size-adjust:100%;min-height:100vh;font-feature-settings:"palt" 1;color:#333;background-color:#fff;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden;}
a{text-decoration:none;color:inherit;transition:all 0.3s ease;}
img{max-width:100%;height:auto;display:block;transition:transform 0.3s ease;}
.header{background:#fff;border-bottom:1px solid #e5e5e5;position:sticky;top:0;z-index:1000;box-shadow:0 2px 4px rgba(0, 0, 0, 0.05);transition:box-shadow 0.3s ease;}
.header-container{max-width:1200px;margin:0 auto;padding:16px 20px;display:flex;justify-content:space-between;align-items:center;position:relative;}
.mobile-menu-toggle{display:none;width:32px;height:32px;background:transparent;border:none;cursor:pointer;padding:0;z-index:1001;position:relative;align-items:center;justify-content:center;font-size:24px;color:#333;line-height:1;}
.mobile-menu-toggle .hamburger-icon{display:block;transition:opacity 0.3s ease, transform 0.3s ease;}
.mobile-menu-toggle .close-icon{display:none;font-size:28px;font-weight:300;transition:opacity 0.3s ease, transform 0.3s ease;}
.mobile-menu-toggle.active .hamburger-icon{display:none;}
.mobile-menu-toggle.active .close-icon{display:block;}
.header-left{display:flex;align-items:center;}
.logo-section{display:flex;align-items:center;gap:12px;}
.logo-text-brand{display:inline-block;text-decoration:none;white-space:nowrap;position:relative;}
.logo-wordmark{display:inline-block;font-size:24px;font-weight:700;letter-spacing:0.18em;font-family:"Segoe UI", "SF Pro Display", "Yu Gothic Medium", "游ゴシック Medium", YuGothic, sans-serif;color:#1E88E5;position:relative;transition:letter-spacing 0.25s ease, opacity 0.25s ease;}@supports (background-clip:text) or (-webkit-background-clip:text){.logo-wordmark{background:linear-gradient(135deg, #0d47a1 0%, #1E88E5 50%, #42A5F5 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;}
}
.logo-text-brand::after{content:"";position:absolute;left:0;bottom:-4px;width:100%;height:2px;background:linear-gradient(90deg, transparent 0%, #1E88E5 30%, #42A5F5 70%, transparent 100%);opacity:0.6;transition:opacity 0.25s ease;}
.logo-text-brand:hover .logo-wordmark{letter-spacing:0.22em;}@supports (background-clip:text) or (-webkit-background-clip:text){.logo-text-brand:hover .logo-wordmark{background:linear-gradient(135deg, #1565C0 0%, #2196F3 50%, #64B5F6 100%);-webkit-background-clip:text;background-clip:text;}
}
.logo-text-brand:hover::after{opacity:1;}
.logo-subtitle-mobile{display:none;}
.logo-subtitle{font-size:var(--fs-xs);color:#060606;margin:0;}
.logo-subtitle-pc{display:block;}
.header-right{display:flex;align-items:center;}
.job-link{display:flex;align-items:center;gap:8px;color:#1E88E5;font-size:var(--fs-sm);transition:all 0.3s ease;}
.job-link:hover{color:#1565C0;transform:translateX(2px);}
.job-icon{width:16px;height:16px;transition:transform 0.3s ease;object-fit:contain;}
.job-link:hover .job-icon{transform:scale(1.1);}
.arrow{margin-left:4px;transition:transform 0.3s ease;}
.job-link:hover .arrow{transform:translateX(3px);}
.main-nav{background:#fff;border-bottom:1px solid #e5e5e5;transition:max-height 0.3s ease, opacity 0.3s ease;position:relative;}
.mobile-menu-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:rgba(0, 0, 0, 0.6);backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:998;opacity:0;transition:opacity 0.35s cubic-bezier(0.4, 0, 0.2, 1);pointer-events:none;}
.mobile-menu-overlay.active{opacity:1;pointer-events:auto;}
.mobile-nav-logo{display:none;}
.nav-container{max-width:1200px;margin:0 auto;padding:0 20px;display:flex;gap:0;}
.nav-item{padding:12px 0;font-size:var(--fs-lg);font-weight:600;color:#060606;position:relative;transition:none;flex:1;text-align:center;z-index:1;}@keyframes textFadeIn{0%{color:rgba(255, 255, 255, 0.6);}50%{color:rgba(255, 255, 255, 0.8);}100%{color:#fff;}
}
.nav-item::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:60px;height:2px;border-radius:0;transition:none;z-index:-1;}
.nav-item:hover{color:#fff;animation:textFadeIn 0.45s ease forwards;}
.nav-item:hover::after{width:100%;height:100%;bottom:0;border-radius:0;transition:width 0.3s ease 0s, height 0.2s ease 0.3s, bottom 0.2s ease 0.5s;}
.nav-item.active::after{width:100%;height:100%;bottom:0;border-radius:0;}
.nav-item.active:hover{animation:none;}
.nav-item--pinned-1::after{background:#f0ad4e;}
.nav-item--pinned-2::after{background:#1abc9c;}
.nav-item--pinned-3::after{background:#5bc0de;}
.nav-item--pinned-4::after{background:#1E88E5;}
.nav-item.active{color:#fff;animation:none;}
.nav-item.active.nav-item--pinned-1{background:#f0ad4e;}
.nav-item.active.nav-item--pinned-1::after{width:100%;height:100%;bottom:0;background:#f0ad4e;}
.nav-item.active.nav-item--pinned-2{background:#1abc9c;}
.nav-item.active.nav-item--pinned-2::after{width:100%;height:100%;bottom:0;background:#1abc9c;}
.nav-item.active.nav-item--pinned-3{background:#5bc0de;}
.nav-item.active.nav-item--pinned-3::after{width:100%;height:100%;bottom:0;background:#5bc0de;}
.nav-item.active.nav-item--pinned-4{background:#1E88E5;}
.nav-item.active.nav-item--pinned-4::after{width:100%;height:100%;bottom:0;background:#1E88E5;}
.nav-item:not(.active):hover.nav-item--pinned-1::after{background:#f0ad4e;}
.nav-item:not(.active):hover.nav-item--pinned-2::after{background:#1abc9c;}
.nav-item:not(.active):hover.nav-item--pinned-3::after{background:#5bc0de;}
.nav-item:not(.active):hover.nav-item--pinned-4::after{background:#1E88E5;}
.nav-container > .nav-item:first-child.active{color:#fff;background:#f0ad4e;}
.nav-container > .nav-item:first-child.active::after{width:100%;height:100%;bottom:0;background:#f0ad4e;}
.main-content{max-width:1200px;margin:0 auto;padding:40px 20px;}
.container{width:100%;}
.breadcrumb{display:flex;align-items:center;gap:8px;margin-bottom:20px;padding-bottom:12px;border-bottom:1px solid #e5e5e5;font-size:var(--fs-sm);}
.breadcrumb-sep{color:#bbb;user-select:none;}
.breadcrumb-item{position:relative;color:#666;padding-bottom:4px;}
.breadcrumb-item:hover{color:#333;}
.breadcrumb-item::after{content:'';position:absolute;bottom:0;left:50%;transform:translateX(-50%);width:70%;height:2px;border-radius:1px;}
.breadcrumb-item--home::after{display:none;}
.breadcrumb-item--current::after{background:#1E88E5;}
.breadcrumb-item--current{color:#333;font-weight:500;}a.breadcrumb-item--home{text-decoration:none;}
.hero-banner-section{width:100vw;position:relative;left:50%;right:50%;margin-left:-50vw;margin-right:-50vw;margin-bottom:40px;padding:0;}
.hero-banner-container{max-width:1200px;margin:0 auto;padding:0 20px 0px 20px;}
.hero-indicators{display:flex;gap:4px;margin-bottom:16px;}
.hero-indicator{height:3px;flex:1;max-width:60px;border-radius:2px;opacity:0.3;transition:opacity 0.3s ease;}
.hero-indicator.active{opacity:1;}
.hero-breadcrumb{margin-bottom:20px;font-size:var(--fs-sm);}
.hero-breadcrumb a{color:#333;text-decoration:underline;text-decoration-color:#333;}
.hero-breadcrumb a:hover{color:#1E88E5;text-decoration-color:#1E88E5;}
.breadcrumb-sep{margin:0 8px;color:#666;}
.breadcrumb-current{color:#333;font-weight:600;}
.hero-banner{position:relative;width:100%;height:180px;background:#1abc9c;background-image:linear-gradient(135deg, #1abc9c 0%, #17a085 100%);border-radius:0;overflow:hidden;display:flex;align-items:center;justify-content:center;}
.hero-banner--ml{background:#f0ad4e;background-image:linear-gradient(135deg, #f0ad4e 0%, #e89d3d 100%);}
.hero-banner--prog{background:#1abc9c;background-image:linear-gradient(135deg, #1abc9c 0%, #17a085 100%);}
.hero-banner--career{background:#5bc0de;background-image:linear-gradient(135deg, #5bc0de 0%, #49a9c4 100%);}
.hero-banner--freelance{background:#1E88E5;background-image:linear-gradient(135deg, #1E88E5 0%, #1976d2 100%);}
.hero-banner--pinned-1{background:#f0ad4e;background-image:linear-gradient(135deg, #f0ad4e 0%, #e89d3d 100%);}
.hero-banner--pinned-2{background:#1abc9c;background-image:linear-gradient(135deg, #1abc9c 0%, #17a085 100%);}
.hero-banner--pinned-3{background:#5bc0de;background-image:linear-gradient(135deg, #5bc0de 0%, #49a9c4 100%);}
.hero-banner--pinned-4{background:#1E88E5;background-image:linear-gradient(135deg, #1E88E5 0%, #1976d2 100%);}
.hero-banner-overlay{padding:48px 60px;border-radius:0;text-align:center;max-width:800px;width:100%;}
.hero-title{font-size:48px;font-weight:700;color:#fff;margin:0 0 16px 0;line-height:1.2;}
.hero-description{font-size:var(--fs-md);color:#fff;margin:0;line-height:1.6;}
.featured-section{margin-bottom:40px;}
.featured-carousel-indicators{display:none;}
.featured-grid{display:grid;grid-template-columns:2fr 1fr;gap:14px;align-items:stretch;}
.featured-large{position:relative;overflow:hidden;border-radius:2px;border:1px solid rgba(0, 0, 0, 0.06);box-shadow:0 2px 16px rgba(0, 0, 0, 0.04);transition:box-shadow 0.25s ease, border-color 0.25s ease;}
.featured-large:hover{box-shadow:0 8px 32px rgba(0, 0, 0, 0.08);border-color:rgba(0, 0, 0, 0.08);}
.featured-large::after{content:'';position:absolute;bottom:0;left:0;right:0;height:3px;background:#34d399;pointer-events:none;}
.featured-large .article-link{display:block;position:relative;aspect-ratio:3 / 2;min-height:200px;}
.featured-large .article-image{position:absolute;inset:0;overflow:hidden;}
.featured-large .article-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
.featured-large:hover .article-image img{transform:scale(1.04);}
.featured-large .article-overlay{position:absolute;inset:0;background:linear-gradient(to top, rgba(0, 0, 0, 0.82) 0%, rgba(0, 0, 0, 0.2) 50%, transparent 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:18px 22px 16px;}
.featured-large .article-category{font-size:var(--fs-min);font-weight:600;letter-spacing:0.1em;text-transform:uppercase;color:#34d399;margin-bottom:6px;}
.featured-large .article-title{font-size:var(--fs-2xl);font-weight:700;line-height:1.35;color:#fff;margin:0 0 4px;max-width:100%;}
.featured-large .article-date{font-size:var(--fs-min);color:rgba(255, 255, 255, 0.72);}
.featured-small{display:flex;flex-direction:column;gap:14px;}
.featured-small .featured-card{flex:1;min-height:0;}
.featured-small .featured-card .article-link{aspect-ratio:auto;height:100%;}
.featured-card{position:relative;overflow:hidden;border-radius:2px;border:1px solid rgba(0, 0, 0, 0.06);box-shadow:0 2px 16px rgba(0, 0, 0, 0.04);transition:box-shadow 0.25s ease, border-color 0.25s ease;}
.featured-card:hover{box-shadow:0 8px 32px rgba(0, 0, 0, 0.08);border-color:rgba(0, 0, 0, 0.08);}
.featured-card .article-link{display:block;position:relative;aspect-ratio:2 / 1;}
.featured-card .article-image{position:absolute;inset:0;overflow:hidden;}
.featured-card .article-image img{width:100%;height:100%;object-fit:cover;transition:transform 0.6s cubic-bezier(0.25, 0.46, 0.45, 0.94);}
.featured-card:hover .article-image img{transform:scale(1.05);}
.featured-card .article-overlay{position:absolute;inset:0;background:linear-gradient(to top, rgba(0, 0, 0, 0.78) 0%, rgba(0, 0, 0, 0.15) 45%, transparent 100%);display:flex;flex-direction:column;justify-content:flex-end;padding:14px 16px 12px;}
.featured-card .article-category{font-size:var(--fs-min);font-weight:600;letter-spacing:0.08em;text-transform:uppercase;color:#34d399;margin-bottom:4px;}
.featured-card .article-title{font-size:var(--fs-base);font-weight:700;line-height:1.4;color:#fff;margin:0 0 2px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.featured-card .article-date{font-size:var(--fs-min);color:rgba(255, 255, 255, 0.7);}
.latest-section{margin-top:0px;}
.section-header{display:flex;align-items:baseline;gap:16px;padding-bottom:16px;border-bottom:2px solid #e5e5e5;margin-bottom:32px;}
.section-title{font-size:var(--fs-3xl);font-weight:700;color:#333;}
.section-subtitle{font-size:var(--fs-base);color:#666;}
.posts-layout{display:grid;grid-template-columns:2fr 1fr;gap:40px;}
.posts-main{display:flex;flex-direction:column;}
.posts-list{display:flex;flex-direction:column;gap:32px;}
.post-item{display:flex;gap:20px;padding-bottom:28px;border-bottom:1px solid #e5e5e5;align-items:flex-start;transition:background-color 0.25s ease;}
.post-item:hover{background-color:#fafafa;}
.post-item:last-child{border-bottom:none;}
.post-thumb{position:relative;flex-shrink:0;width:200px;aspect-ratio:4 / 3;border-radius:4px;overflow:hidden;}
.post-thumb a{display:block;width:100%;height:100%;}
.post-thumb .post-badge{position:absolute;top:8px;left:0;z-index:2;background:#e91e63;color:#fff;padding:3px 10px 3px 14px;border-radius:0 4px 4px 0;font-size:var(--fs-min);font-weight:700;box-shadow:0 1px 3px rgba(0,0,0,0.2);clip-path:polygon(6px 0, 100% 0, 100% 100%, 6px 100%, 0 50%);}
.post-thumb img{width:100%;height:100%;object-fit:cover;transition:transform 0.3s ease;}
.post-item:hover .post-thumb img{transform:scale(1.03);}
.post-content{flex:1;min-width:0;}
.post-meta{display:flex;justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:10px;}
.post-meta-left{display:flex;align-items:center;gap:8px;}
.post-category{display:inline-block;padding:4px 12px;border-radius:0;font-size:var(--fs-xs);font-weight:600;color:#fff;}
.post-category--ml{background:#f0ad4e;}
.post-category--freelance{background:#1E88E5;}
.post-category--career{background:#5bc0de;}
.post-category--prog{background:#1abc9c;}
.post-category--pinned-1{background:#f0ad4e;}
.post-category--pinned-2{background:#1abc9c;}
.post-category--pinned-3{background:#5bc0de;}
.post-category--pinned-4{background:#1E88E5;}
.post-category[class*="cat-"]{background:#999;color:#fff;}
.post-date{flex-shrink:0;font-size:var(--fs-xs);color:#999;}
.post-title{font-size:var(--fs-2xl);font-weight:700;line-height:1.5;margin-bottom:8px;}
.post-title a{color:#333;transition:color 0.3s ease;display:inline-block;}
.post-title a:hover{color:#333;text-decoration:underline;}
.post-item:has(.post-category--ml) .post-title a:hover{text-decoration-color:#f0ad4e;}
.post-item:has(.post-category--freelance) .post-title a:hover{text-decoration-color:#1E88E5;}
.post-item:has(.post-category--career) .post-title a:hover{text-decoration-color:#5bc0de;}
.post-item:has(.post-category--prog) .post-title a:hover{text-decoration-color:#1abc9c;}
.post-excerpt{font-size:var(--fs-base);color:#666;line-height:1.6;}
.pagination{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:48px;padding-top:32px;border-top:1px solid #e5e5e5;flex-wrap:wrap;width:100%;}
.pagination-info{font-size:var(--fs-base);color:#333;margin-right:8px;}
.pagination-link{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;font-size:var(--fs-base);color:#333;text-decoration:none;border:1px solid #e5e5e5;border-radius:4px;transition:all 0.3s ease;background:#fff;box-sizing:border-box;}
.pagination-link:hover{border-color:#999;background:#f5f5f5;}
.pagination-current{color:#fff;background:#666;border-color:#666;cursor:default;}
.pagination-current:hover{color:#fff;background:#666;border-color:#666;}
.pagination-ellipsis{display:inline-flex;align-items:center;justify-content:center;width:36px;height:36px;font-size:var(--fs-base);color:#333;border:1px solid #e5e5e5;border-radius:4px;background:#fff;box-sizing:border-box;}
.pagination-next,.pagination-last{font-weight:normal;}
.sidebar{display:flex;flex-direction:column;gap:32px;}
.sidebar-section{background:#fff;padding:0;border-radius:0;border:none;box-shadow:none;}
.sidebar-title{font-size:var(--fs-xl);font-weight:700;margin-bottom:20px;color:#333;padding-bottom:12px;border-bottom:1px solid #e5e5e5;position:relative;}
.title-decor{font-size:var(--fs-sm);font-weight:normal;color:#999;margin-left:8px;}
.job-carousel{position:relative;margin-bottom:20px;}
.job-carousel-wrapper{position:relative;overflow:hidden;border:1px solid #e5e5e5;border-radius:0;min-height:170px;}
.job-carousel-item{position:absolute;top:0;left:0;width:100%;transition:transform 0.5s ease-in-out, opacity 0.5s ease-in-out;pointer-events:none;}
.job-carousel-item.active{opacity:1;transform:translateX(0);pointer-events:auto;z-index:2;}
.job-item-card{border:1px solid #e5e5e5;border-radius:0;overflow:hidden;}
.job-item-header{background:#1d88ae;color:#fff;padding:16px;}
.job-item-header .job-title{font-size:var(--fs-sm);font-weight:600;color:#fff;margin:0;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;word-wrap:break-word;}
.job-item-body{background:#fff;padding:16px;}
.job-item-body .job-salary{font-size:var(--fs-lg);font-weight:700;color:#333;margin-bottom:8px;}
.job-item-body .job-location{font-size:var(--fs-sm);color:#666;}
.sidebar-images{display:flex;flex-direction:column;gap:8px;margin-bottom:32px;}
.sidebar-image-item{display:block;width:100%;height:120px;border-radius:0;overflow:hidden;transition:transform 0.3s ease;}
.sidebar-image-item:hover{transform:scale(1.02);}
.sidebar-image-item img{width:100%;height:100%;object-fit:cover;display:block;}
.ranking-list{display:flex;flex-direction:column;gap:16px;}
.ranking-item{display:flex;gap:12px;align-items:flex-start;transition:all 0.3s ease;padding:12px 0;cursor:pointer;}
.ranking-item:hover{background-color:transparent;padding-left:4px;}
.ranking-thumb{flex-shrink:0;width:120px;height:85px;border-radius:0;overflow:hidden;}
.ranking-thumb img{width:100%;height:100%;object-fit:cover;}
.ranking-info{display:flex;gap:8px;align-items:flex-start;flex:1;min-width:0;}
.ranking-crown{flex-shrink:0;font-size:18px;line-height:1;color:#FFD700;}
.ranking-content{flex:1;min-width:0;}
.ranking-category-wrapper{display:flex;align-items:center;gap:8px;margin-bottom:6px;}
.ranking-category{display:inline-block;padding:2px 8px;border-radius:3px;font-size:var(--fs-xs);font-weight:600;color:#fff;}
.ranking-category--career{background:#ff6b6b;}
.ranking-category--prog{background:#4dabf7;}
.ranking-category--ml{background:#ffd43b;color:#333;}
.ranking-category--freelance{background:#51cf66;}
.ranking-category--pinned-1{background:#f0ad4e;}
.ranking-category--pinned-2{background:#1abc9c;}
.ranking-category--pinned-3{background:#5bc0de;}
.ranking-category--pinned-4{background:#1E88E5;}
.ranking-category[class*="cat-"]{background:#999;color:#fff;}
.ranking-title{font-size:var(--fs-sm);font-weight:600;line-height:1.5;margin-bottom:4px;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;}
.ranking-title a{color:#333;transition:color 0.3s ease;display:block;}
.ranking-title a:hover{color:#1E88E5;text-decoration:underline;}
.ranking-views{font-size:var(--fs-xs);color:#999;margin-top:4px;}
.new-list{display:flex;flex-direction:column;gap:16px;}
.new-item{display:flex;gap:12px;align-items:flex-start;transition:all 0.3s ease;padding:12px 0;cursor:pointer;}
.new-item:hover{background-color:transparent;padding-left:4px;}
.new-thumb{flex-shrink:0;width:120px;height:85px;border-radius:0;overflow:hidden;}
.new-thumb img{width:100%;height:100%;object-fit:cover;}
.new-content{flex:1;min-width:0;}
.new-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:6px;}
.new-category{display:inline-block;padding:2px 8px;border-radius:0;font-size:var(--fs-xs);font-weight:600;color:#fff;}
.new-category--career{background:#ff6b6b;}
.new-category--prog{background:#4dabf7;}
.new-category--ml{background:#ffd43b;color:#333;}
.new-category--freelance{background:#51cf66;}
.new-category--new{background:#ff6b6b;color:#fff;}
.new-category--pinned-1{background:#f0ad4e;}
.new-category--pinned-2{background:#1abc9c;}
.new-category--pinned-3{background:#5bc0de;}
.new-category--pinned-4{background:#1E88E5;}
.new-category[class*="cat-"]{background:#999;color:#fff;}
.new-date{font-size:var(--fs-xs);color:#666;margin-left:auto;}
.new-title{font-size:var(--fs-sm);font-weight:600;line-height:1.5;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;}
.new-title a{color:#333;transition:color 0.3s ease;display:block;}
.new-title a:hover{color:#1E88E5;text-decoration:underline;}
.tag-list{display:flex;flex-wrap:wrap;gap:12px 16px;margin-bottom:16px;max-height:calc(var(--fs-sm) * 1.5 * 9 + 12px * 8 + 8px);overflow:hidden;align-items:baseline;}
.tag-item{padding:0;background:transparent;border:none;border-radius:0;font-size:var(--fs-sm);color:#666;transition:color 0.3s ease;display:inline-flex;align-items:center;font-weight:normal;text-decoration:none;position:relative;padding-left:20px;line-height:1.5;white-space:nowrap;flex-shrink:0;}
.tag-item::before{content:'◆';position:absolute;left:0;top:50%;transform:translateY(-50%);color:#333;font-size:10px;line-height:1;margin-right:8px;}
.tag-item:hover{color:#1E88E5;text-decoration:underline;}
.sidebar-link{color:#1E88E5;font-size:var(--fs-sm);text-decoration:none;transition:color 0.3s ease;display:inline-block;margin-top:16px;font-weight:normal;}
.sidebar-link:hover{color:#1565C0;text-decoration:underline;}
.footer{margin-top:80px;}
.cta-fixed-bar{position:fixed;bottom:0;left:0;right:0;z-index:999;background:rgba(0, 56, 86, 0.8);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:32px 20px;box-shadow:0 -2px 10px rgba(0, 0, 0, 0.15);transition:visibility 0.25s ease, opacity 0.25s ease;}
.cta-fixed-bar.cta-fixed-bar-hidden{visibility:hidden;opacity:0;pointer-events:none;}
.footer-banner{position:relative;background:rgba(0, 56, 86, 0.8);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);padding:32px 20px;z-index:1;box-shadow:0 -2px 10px rgba(0, 0, 0, 0.15);}
.footer-banner-container{max-width:1200px;margin:0 auto;display:flex;justify-content:center;align-items:center;text-align:center;}
.footer-banner-content{display:flex;flex-direction:column;gap:12px;max-width:900px;}
.footer-banner-text{font-size:var(--fs-xl);color:#fff;margin:0;line-height:1.6;letter-spacing:0.02em;}
.footer-banner-text strong{color:#34d399;font-weight:700;background:linear-gradient(135deg, #34d399 0%, #10b981 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;}
.footer-banner-subtext{font-size:var(--fs-base);color:rgba(255, 255, 255, 0.85);margin:0;line-height:1.7;letter-spacing:0.01em;}
.footer-banner-subtext strong{color:#7dd3fc;font-weight:600;}
.footer-main{background:#1d88ae;padding:60px 20px 40px;}
.footer-main-container{max-width:1200px;margin:0 auto;display:grid;grid-template-columns:1fr auto 1fr;column-gap:150px;row-gap:0;}
.footer-brand-logo{font-size:var(--fs-2xl);font-weight:700;color:#fff;letter-spacing:0.02em;margin:0 0 16px;}
.footer-brand-desc{font-size:var(--fs-sm);color:rgba(255, 255, 255, 0.9);line-height:1.6;margin:0;}
.footer-follow-desc{font-size:var(--fs-sm);color:rgba(255, 255, 255, 0.9);line-height:1.6;margin:0 0 16px;}
.footer-column-title{font-family:"Brush Script MT", "Brush Script Std", cursive;font-size:28px;font-weight:400;color:#fff;margin:0 0 24px;letter-spacing:0.05em;}
.footer-menu{display:flex;flex-direction:column;gap:12px;}
.footer-menu-item{color:#fff;font-size:var(--fs-base);text-decoration:none;transition:color 0.25s ease, padding-left 0.25s ease;padding-left:0;}
.footer-menu-item:hover{color:#ffeb3b;padding-left:8px;}
.footer-services{display:flex;flex-direction:column;gap:24px;}
.footer-service{padding-bottom:24px;border-bottom:1px solid rgba(255, 255, 255, 0.2);}
.footer-service:last-child{border-bottom:none;padding-bottom:0;}
.footer-service-logo{font-size:var(--fs-lg);font-weight:700;color:#fff;margin-bottom:8px;letter-spacing:0.02em;}
.footer-service-desc{font-size:var(--fs-sm);color:rgba(255, 255, 255, 0.9);line-height:1.6;margin:0;}
.footer-company{display:flex;flex-direction:column;gap:20px;}
.footer-company-logo{font-size:var(--fs-xl);font-weight:700;color:#fff;letter-spacing:0.02em;}
.footer-company-info{display:flex;flex-direction:column;gap:12px;}
.footer-company-address,.footer-company-contact{font-size:var(--fs-sm);color:rgba(255, 255, 255, 0.9);line-height:1.6;margin:0;}
.footer-company-note{font-size:var(--fs-xs);color:rgba(255, 255, 255, 0.8);line-height:1.6;margin:0;}
.footer-social{display:flex;gap:12px;margin-top:8px;}
.footer-social-icon{width:36px;height:36px;background:rgba(255, 255, 255, 0.2);color:#fff;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:18px;text-decoration:none;transition:background-color 0.25s ease, transform 0.25s ease;}
.footer-social-icon:hover{background:rgba(255, 255, 255, 0.3);transform:scale(1.1);}
.footer-copyright{background:#1d88ae;padding:20px;text-align:center;border-top:1px solid rgba(255, 255, 255, 0.1);}
.footer-copyright p{font-size:var(--fs-xs);color:rgba(255, 255, 255, 0.8);margin:0;}
.footer-copyright-link{color:rgba(255, 255, 255, 0.85);text-decoration:none;transition:color 0.25s ease, text-decoration-color 0.25s ease;}
.footer-copyright-link:hover{color:#7dd3fc;text-decoration:underline;text-decoration-color:#7dd3fc;}
@media (max-width:1024px) and (min-width:769px){.main-content{padding:30px 16px;}
.header-container{padding:14px 16px;}
.nav-item{padding:10px 16px;font-size:var(--fs-base);}
.hero-banner{height:160px;}
.hero-banner-overlay{padding:35px 40px;}
.hero-title{font-size:36px;}
.posts-layout{grid-template-columns:1fr;gap:24px;}
.post-item{flex-direction:row;}
.post-thumb{width:180px;height:120px;flex-shrink:0;}
.featured-grid{grid-template-columns:1fr;gap:20px;}
.sidebar{margin-top:40px;}
.job-carousel-wrapper{min-height:180px;}
.ranking-item{gap:12px;}
.ranking-thumb{width:100px;height:70px;}
}
@media (max-width:768px){body{overflow-x:hidden;}
.main-content{padding:20px 12px;width:100%;max-width:100%;box-sizing:border-box;}
.container{padding:0;width:100%;max-width:100%;box-sizing:border-box;}
.posts-layout{min-width:0;}
.posts-main,.sidebar{min-width:0;width:100%;}
.header-container{padding:18px 16px;flex-wrap:nowrap;min-height:60px;}
.header-left{order:1;flex:1;justify-content:flex-start;}
.mobile-menu-toggle{display:flex;order:2;width:36px;height:36px;font-size:26px;}
.logo-section{gap:10px;justify-content:flex-start;align-items:center;}
.logo-subtitle-pc{display:none;}
.logo-text-brand{transform:translateY(-5px);}
.logo-text-brand .logo-wordmark{font-size:18px;letter-spacing:0.12em;}
.logo-subtitle-mobile{display:block;font-size:14px;color:#666;line-height:1.2;margin:0;}
.header-right{display:none;}
.job-link{font-size:var(--fs-xs);}
.job-link span:not(.arrow){display:none;}
.main-nav{position:fixed;top:0;left:-100%;width:320px;max-width:85vw;height:100vh;background:#ffffff;border-right:1px solid rgba(0, 0, 0, 0.08);box-shadow:8px 0 32px rgba(0, 0, 0, 0.12);overflow-y:auto;overflow-x:hidden;transition:left 0.35s cubic-bezier(0.4, 0, 0.2, 1);z-index:999;padding-top:0;}
.mobile-nav-logo{display:block;padding:24px 20px 20px;border-bottom:1px solid rgba(0, 0, 0, 0.08);background:#ffffff;position:sticky;top:0;z-index:10;}
.mobile-nav-logo .logo-text-brand{display:inline-block;margin-bottom:8px;}
.mobile-nav-logo .logo-wordmark{font-size:16px;letter-spacing:0.08em;}
.mobile-nav-logo .logo-subtitle{font-size:13px;color:#666;display:block;margin:0;}
.main-nav.mobile-open{left:0;}
.main-nav::before{display:none;}
.mobile-menu-overlay{display:block;}
.nav-container{flex-direction:column;padding:20px 0 16px;min-width:auto;}
.nav-item{padding:20px 28px;font-size:16px;font-weight:500;white-space:normal;text-align:left;width:calc(100% - 32px);flex:none;position:relative;min-height:56px;display:flex;align-items:center;transition:all 0.25s cubic-bezier(0.4, 0, 0.2, 1);z-index:1;color:#333;margin:6px 16px;border-radius:10px;background:#f8f9fa;box-shadow:none;border:1px solid transparent;}
.nav-item:first-child{margin-top:8px;}
.nav-item:last-child{margin-bottom:16px;}
.nav-item,.nav-item *{position:relative;z-index:10;}
.nav-item{border-bottom:none;}
.nav-item::after{display:block;content:'';position:absolute;left:0;top:50%;transform:translateY(-50%);width:0;height:60%;border-radius:0 4px 4px 0;transition:width 0.3s cubic-bezier(0.4, 0, 0.2, 1);z-index:2;}
.nav-item::before{content:'';position:absolute;top:0;left:0;right:0;bottom:0;z-index:-1;transition:background-color 0.3s ease;}
.nav-item--pinned-1::after{background:#f0ad4e;}
.nav-item--pinned-2::after{background:#1abc9c;}
.nav-item--pinned-3::after{background:#5bc0de;}
.nav-item--pinned-4::after{background:#1E88E5;}
.nav-item[class*="cat-"]::after{background:#1E88E5;}
.nav-item:hover::after{display:none;}
.nav-item:hover{background:#ffffff;color:#1E88E5;animation:none;transform:translateX(6px);box-shadow:0 2px 8px rgba(30, 136, 229, 0.15);border-color:rgba(30, 136, 229, 0.2);}
.nav-item.active{color:#fff !important;font-weight:600;box-shadow:0 4px 12px rgba(30, 136, 229, 0.25);transform:translateX(0);background:#1E88E5 !important;border-color:#1E88E5;}
.nav-item.active::before{background:#1E88E5;z-index:-1;border-radius:10px;box-shadow:none;}
.nav-item.active::after{display:none;}
.nav-item.active.nav-item--pinned-1{color:#fff !important;background:#f0ad4e !important;border-color:#f0ad4e;}
.nav-item.active.nav-item--pinned-1::before{background:#f0ad4e;z-index:-1;border-radius:10px;box-shadow:none;}
.nav-item.active.nav-item--pinned-1::after{display:none;}
.nav-item.active.nav-item--pinned-2{color:#fff !important;background:#1abc9c !important;border-color:#1abc9c;}
.nav-item.active.nav-item--pinned-2::before{background:#1abc9c;z-index:-1;border-radius:10px;box-shadow:none;}
.nav-item.active.nav-item--pinned-2::after{display:none;}
.nav-item.active.nav-item--pinned-3{color:#fff !important;background:#5bc0de !important;border-color:#5bc0de;}
.nav-item.active.nav-item--pinned-3::before{background:#5bc0de;z-index:-1;border-radius:10px;box-shadow:none;}
.nav-item.active.nav-item--pinned-3::after{display:none;}
.nav-item.active.nav-item--pinned-4{color:#fff !important;background:#1E88E5 !important;border-color:#1E88E5;}
.nav-item.active.nav-item--pinned-4::before{background:#1E88E5;z-index:-1;border-radius:10px;box-shadow:none;}
.nav-item.active.nav-item--pinned-4::after{display:none;}
.nav-item.active[class*="cat-"]{color:#fff !important;}
.nav-item.active[class*="cat-"]::before{background:linear-gradient(135deg, #1E88E5 0%, #1976d2 100%);z-index:-1;border-radius:12px;box-shadow:inset 0 2px 4px rgba(0, 0, 0, 0.1);}
.nav-item.active[class*="cat-"]::after{background:#1E88E5 !important;width:4px !important;height:60% !important;top:50% !important;left:0 !important;transform:translateY(-50%) !important;z-index:2;border-radius:0 4px 4px 0;}
.hero-banner{padding:40px 16px;min-height:200px;}
.hero-title{font-size:var(--fs-2xl);margin-bottom:12px;}
.hero-description{font-size:var(--fs-sm);}
.featured-section{position:relative;margin-bottom:30px;}
.featured-grid{display:flex;overflow:hidden;position:relative;border-radius:8px;min-height:240px;}
.featured-large,.featured-small .featured-card{flex:0 0 100%;width:100%;min-width:100%;margin:0;opacity:0;transform:translateX(100%);transition:opacity 0.8s ease, transform 0.8s ease;position:absolute;top:0;left:0;z-index:1;}
.featured-large.active,.featured-small .featured-card.active{opacity:1;transform:translateX(0);position:relative;z-index:2;}
.featured-large.featured-slide-leave,.featured-small .featured-card.featured-slide-leave{transform:translateX(-100%);opacity:0;z-index:3;}
.featured-small{display:block;width:100%;}
.featured-large .article-link,.featured-small .featured-card .article-link{aspect-ratio:4 / 3;min-height:240px;}
.featured-large .article-title,.featured-card .article-title{font-size:var(--fs-lg);}
.featured-carousel-indicators{display:none !important;}
.posts-layout{grid-template-columns:1fr;gap:20px;}
.post-item{flex-direction:column;padding:16px;}
.post-thumb{width:100%;height:200px;margin-bottom:12px;}
.post-content{width:100%;}
.post-title{font-size:var(--fs-xl);}
.post-excerpt{font-size:var(--fs-sm);}
.sidebar{margin-top:24px;gap:18px;}
.sidebar-section{margin-bottom:16px;}
.sidebar-title{font-size:var(--fs-lg);margin-bottom:14px;padding-bottom:10px;}
.job-carousel{height:auto;margin-bottom:0;}
.sidebar-section.job-board{margin-bottom:0;}
.job-item-card{padding:16px;}
.job-title{font-size:var(--fs-base);line-height:1.4;}
.ranking-item{flex-direction:column;gap:12px;}
.ranking-thumb{width:100%;height:150px;}
.ranking-title{font-size:var(--fs-sm);}
.new-item{flex-direction:column;}
.new-thumb{width:100%;height:150px;margin-bottom:12px;}
.tag-list{gap:10px 14px;align-items:flex-start;justify-content:flex-start;}
.tag-item{font-size:14px;padding-left:20px;line-height:1.6;white-space:nowrap;flex-shrink:0;}
.tag-item::before{font-size:14px;line-height:1.6;}
.pagination{gap:6px;flex-wrap:wrap;}
.pagination-link{width:32px;height:32px;font-size:var(--fs-sm);}
.pagination-info{font-size:var(--fs-sm);width:100%;text-align:center;margin-bottom:8px;}
.hero-banner{height:150px;}
.hero-banner-overlay{padding:30px 20px;}
.hero-title{font-size:28px;margin-bottom:10px;}
.hero-description{font-size:var(--fs-sm);}
.featured-section{margin-bottom:30px;}
.section-title{font-size:var(--fs-xl);margin-bottom:16px;}
.section-subtitle{font-size:var(--fs-base);}
.cta-fixed-bar{padding:16px 16px;}
.footer-banner{padding:16px 20px;}
.footer-banner-container{flex-direction:column;text-align:center;padding:0;}
.footer-banner-content{gap:10px;}
.footer-banner-text{font-size:var(--fs-lg);}
.footer-banner-subtext{font-size:var(--fs-sm);}
.footer-main-container{grid-template-columns:1fr;gap:30px;padding:40px 16px;}
.footer-column-title{font-size:20px;}
.footer-links{gap:12px;}
.footer-copyright{padding:16px;}
}
@media (max-width:480px){.main-content{padding:16px 8px;width:100%;max-width:100%;}
.container{width:100%;max-width:100%;}
.header-container{padding:16px 12px;min-height:56px;}
.mobile-menu-toggle{width:32px;height:32px;font-size:24px;}
.logo-text-brand .logo-wordmark{font-size:16px;letter-spacing:0.08em;}
.logo-text-brand:hover .logo-wordmark{letter-spacing:0.1em;}
.logo-subtitle-mobile{font-size:12px;}
.logo-subtitle{display:none;}
.nav-item{padding:8px 10px;font-size:var(--fs-sm);}
.hero-banner{padding:30px 12px;min-height:150px;}
.hero-title{font-size:var(--fs-xl);}
.post-item{padding:12px;}
.post-thumb{height:160px;}
.post-title{font-size:var(--fs-lg);}
.sidebar{margin-top:18px;gap:14px;}
.sidebar-section{margin-bottom:12px;padding:0 12px;}
.sidebar-title{margin-bottom:10px;padding-bottom:8px;}
.job-carousel{margin-bottom:0;}
.sidebar-section.job-board{margin-bottom:0;}
.job-item-card{padding:12px;}
.job-title{font-size:var(--fs-sm);}
.ranking-thumb{height:120px;}
.new-thumb{height:120px;}
.tag-item{font-size:14px;padding-left:18px;line-height:1.5;white-space:nowrap;}
.tag-item::before{font-size:14px;line-height:1.5;}
.hero-banner{height:120px;}
.hero-banner-overlay{padding:20px 16px;}
.hero-title{font-size:22px;margin-bottom:8px;}
.hero-description{font-size:14px;}
.job-carousel-wrapper{min-height:170px;margin-top:20px;}
.job-item-header{padding:10px;}
.job-item-body{padding:10px;}
.job-title{font-size:14px;-webkit-line-clamp:3;}
.job-salary{font-size:var(--fs-sm);}
.cta-fixed-bar{padding:12px 16px;}
.footer-banner{padding:28px 16px;}
.footer-banner-content{gap:8px;}
.footer-banner-text{font-size:var(--fs-base);}
.footer-banner-subtext{font-size:13px;}
.pagination{gap:4px;}
.pagination-link{width:28px;height:28px;font-size:14px;}
.pagination-info{font-size:14px;}
}