@charset "UTF-8";
/*
Theme Name: NUKITIMES
Template: cocoon-master
*/

/*--------------------------------
reset / global
--------------------------------*/
html,body,div,p,img,iframe,a,span,blockquote,q,address,cite,
pre,code,em,small,strong,b,i,
header,article,section,nav,figure,figcaption,hgroup,menu,aside,footer,time,
h1,h2,h3,h4,h5,h6,
ul,ol,li,dl,dt,dd,
table,tbody,thead,tfoot,th,tr,td,
form,fieldset,legend,label,select,input,textarea,button {
	margin: 0;
	padding: 0;
	border: 0;
	box-sizing: border-box;
	vertical-align: baseline;
}
header,article,section,nav,figure,figcaption,hgroup,menu,aside,footer,small {
	display: block;
}
ul { list-style-type: none; }
h1,h2,h3,h4,h5,h6 { font-weight: 200; color: #424242; }

h1.entry-title { display: block !important; position: relative !important; z-index: 10 !important; color: #000 !important; font-size: 1.8em !important; font-weight: bold !important; margin: 1em 0 !important; }
body {
	width: 100%;
	height: 100%;
	background: #fff;
	font-size: 21px;
	color: #333;
	font-family: sans-serif;
	line-height: 1;
	-webkit-text-size-adjust: 100%;
}
a { text-decoration: none; transition: .3s; }
a:hover { opacity: .6; }
img { vertical-align: middle; }
table { border-collapse: collapse; border-spacing: 0; }
select,option,input,textarea,button { font: inherit; appearance: none; outline: none; border-radius: 0; }
[type=submit],[type=button],[type=reset],[type=file],button { cursor: pointer; }
:focus { outline: none; }

/*--------------------------------
Header
--------------------------------*/
.toolbar {
	padding: 0 0 0 16px;
	width: 100%;
	height: 64px;
	position: fixed;
	top: 0;
	background: rgba(27,28,30,1);
	display: flex;
	justify-content: space-between;
	align-items: center;
	z-index: 2;
	transition: .3s;
}
.toolbar-home { background: rgba(27,28,30,0); }
.toolbar-visible { background: rgba(27,28,30,1); }
.logo {
    height: 24px;  /* スマホ用 */
    filter: invert(1);
    transition: .3s;
}
.logo .content-img {
    height: 100%;
    width: auto;
    object-fit: contain;
}
.inner-txt {
    display: none;
}


@media screen and (min-width: 768px) {
    .logo {
        height: 36px;   /* PC用に少し大きめ */
        max-height: 40px;
    }
}

.toolbar-nav { display: flex; }
.toolbar-btn { width: 64px; height: 64px; overflow: hidden; }
.search-btn { background: url(./images/icon_search.webp) no-repeat center / 16px; }
.menu-btn { display: none; background: url(./images/icon_menu.webp) no-repeat center / 16px; }
.close-btn { background: url(./images/icon_close.webp) no-repeat center / 16px; }

/*--------------------------------
Search
--------------------------------*/
.search-bar {
	padding: 0 0 0 16px;
	width: 100%;
	height: 64px;
	position: fixed;
	top: 0;
	background: rgba(27,28,30,1);
	z-index: 3;
	transition: .3s;
	display: none;
}
.search-bar-inner {
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.search-bar .logo { padding: 0 16px 0 0; }
.search-bar .form-item { flex-grow: 1; }
.search-bar input[type="search"] {
	width: 100%;
	padding: 0 16px;
	height: 32px;
	border-radius: 16px;
}

/*--------------------------------
Intro / Slider
--------------------------------*/
/*
.intro {
	border-bottom: 1px solid rgba(0,0,0,.1);
}
.intro-inner { display: flex; flex-direction: column-reverse; }
.intro-item .post-thumb { flex-shrink: 0; flex-grow: 0; position: relative; overflow: hidden; }
.post-thumb .content-img { transform-origin: center; transition: .3s; max-width: 50%; height: auto; }
.intro .slick-current .post-thumb .content-img { animation: scale-down 1s ease 0s forwards; }
.progress-bar { width: 0%; height: 8px; position: absolute; left: 0; bottom: 0; z-index: 2; background: rgba(255,255,255,.5); }
.slick-current .progress-bar { animation: progress 4s ease 1s forwards; }
.post-head { padding: 32px; display: flex; }
.intro-item .post-head { width: 100%; height: 25%; justify-content: space-between; align-items: center; }
.post-head-inner { width: 100%; display: flex; justify-content: space-between; align-items: flex-start; }
.intro-item .post-head-inner { opacity: 0; transform: translate3d(0,16px,0); flex-direction: column; }
.intro .slick-current .post-head-inner { animation: slide-up 1s ease 0s forwards; }
.post-title { padding: 0 16px 16px 0; font-weight: bold; font-size: 1.4em; line-height: 1.2; order: 2; }
.intro .post-title { width: 70%; }
.post-title .general-link { color: #333; }
.post-category { padding: 0 8px 16px 0; font-size: .7em; line-height: 1.3; color: #333; order: 1; }
.post-time { padding: 0 0 0 20px; line-height: 20px; font-size: .7em; color: #999; background: url(./images/icon_time.webp) no-repeat left / 14px; order: 3; }
.intro-item .post-author { opacity: 0; }
.intro .slick-current .post-author { animation: fade-in 1s ease 0s forwards; }
.author-link { text-align: center; display: block; }
.author-thumb { width: 72px; height: 72px; overflow: hidden; border-radius: 50%; transform-origin: center; }
.author-thumb img { width: 100%; height: 100%; object-fit: cover; }
.intro-item .author-thumb { transform: scale(0); }
.intro .slick-current .author-thumb { animation: scale-up 1s ease 0s forwards; }
.author-name { padding: 16px 0 0; font-size: 1em; color: #333; font-weight: bold; display: block; clear: both; }
*/

/*--------------------------------
Post / New List
--------------------------------*/
.new-list {
    padding: 16px 16px 0 16px; /* 上左右少しだけ、下は0 */
    border-bottom: 1px solid rgba(0,0,0,.1);
    position: relative;
    min-height: auto; /* 高さをコンテンツに合わせる */
}

.new-list .list-item {
    width: 320px !important;
    height: auto; /* 高さを自動にして余白最小化 */
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    margin: 0 8px;   /* 左右だけ少し空ける */
    padding: 0;       /* 下パディングなし */
}

.list-item-inner {
    display: flex;
    flex-direction: column-reverse;
    align-items: flex-start;
}

.list-item .post-head {
    margin: 0;         /* 下マージン削除 */
    width: 100%;
    background: #fff;
    z-index: 2;
    flex-direction: column;
    align-items: flex-start;
}

.list-item .post-head-inner {
    order: 2;
    margin: 0;
    padding: 0;
}

.list-item .post-title {
    font-size: .9em;
    order: 1;
    margin: 0;
    padding: 0;
}

.list-item .post-author {
    order: 2;
    margin: 0;
    padding: 0;
}
.heading-txt {
    text-align: center;   /* 中央揃え */
    font-weight: bold;    /* 太字 */
    font-size: 1.2em;     /* 好きなサイズに調整 */
    margin: 0 0 16px 0;   /* 上下の余白調整 */
}

.post-category{ padding: 0 8px 16px 0; font-size: .7em; line-height: 1.3; color: #333; order: 1; } .post-category span{ padding: 0 0 4px 0; background: linear-gradient(to bottom, rgba(255,51,51,0) 0%,rgba(255,51,51,0) 70%,rgba(255,51,51,.5) 71%,rgba(255,51,51,.5) 100%); } .post-category .category-350{ padding: 0 0 4px 0; background: linear-gradient(to bottom, rgba(151,57,255,0) 0%,rgba(151,57,255,0) 70%,rgba(151,57,255,.5) 71%,rgba(151,57,255,.5) 100%); } .post-category .category-15{ padding: 0 0 4px 0; background: linear-gradient(to bottom, rgba(102,204,51,0) 0%,rgba(102,204,51,0) 70%,rgba(102,204,51,.5) 71%,rgba(102,204,51,.5) 100%); } .post-category .category-37{ padding: 0 0 4px 0; background: linear-gradient(to bottom, rgba(51,102,204,0) 0%,rgba(51,102,204,0) 70%,rgba(51,102,204,.5) 71%,rgba(51,102,204,.5) 100%); line-height: 1.7; } .post-category .category-1{ padding: 0 0 4px 0; background: linear-gradient(to bottom, rgba(255,204,51,0) 0%,rgba(255,204,51,0) 70%,rgba(255,204,51,.5) 71%,rgba(255,204,51,.5) 100%); }

/*--------------------------------
Contents Layout
--------------------------------*/
.main-content { display: flex; align-items: flex-start; gap: 32px; flex-direction: column; }
.content-pane { flex: 1 1 0; min-width: 0; }

/*--------------------------------
Slick / Slider
--------------------------------*/
/*
.slick-arrow { margin: auto 0; width: 88px; height: 88px; background: transparent; overflow: hidden; position: absolute; top: 0; z-index: 9; text-indent: -9999px; }
.intro .slick-arrow { height: 75%; }
.new-list .slick-arrow { top: 32px; }
.slick-arrow::after { width: 88px; height: 88px; content: ""; position: absolute; top: 0; bottom: 0; left: 0; background: url(./images/icon_arrow.webp) no-repeat center / 44px; }
.new-list .slick-arrow::after, .post-list .slick-arrow::after { filter: invert(1); }
.slick-prev { left: 0; }
.new-list .slick-prev { left: 32px; }
.slick-prev::after { transform: rotate(180deg); }
.slick-next { right: 0; }
.new-list .slick-next { right: 32px; }
.slick-disabled { opacity: .25; filter: grayscale(1); }
.slick-dots { padding: 32px 0; display: flex; align-items: center; justify-content: center; }
.new-list .slick-dots { display: flex; bottom: 0; }
.slick-dots li { padding: 0 8px; height: 8px; overflow: hidden; }
.slick-dots button { width: 8px; height: 8px; border-radius: 50%; background: #666; opacity: .5; text-indent: -9999px; }
.slick-dots .slick-active button { opacity: 1; }
*/
/*--------------------------------
Footer
--------------------------------*/
.footer { 
    padding: 0; 
    text-align: center; 
    background: #222; 
    color: #fff; /* 文字色白 */
}
.footer .gnav { 
    padding: 32px 0; 
    color: #fff; /* ナビ文字色白 */
}
.copy { 
    padding: 32px 0; 
    font-size: .8em; 
    line-height: 1.2; 
    color: #fff; /* コピーライト文字色白 */
}
.source-org.copyright {
    color: #fff;
}
@media screen and (max-width: 767px) {
    .source-org.copyright {
        display: inline-block; /* 幅を文字サイズに合わせる */
        max-width: 90%;       /* 最大幅を少し制限 */
        text-align: center;   /* 中央揃え */
        margin: 0 auto;       /* 横中央に配置 */
        color: #fff;          /* 文字色白 */
        background: #222;     /* 背景色を黒に設定 */
        padding: 4px 8px;     /* 少し余白を追加 */
        border-radius: 4px;   /* 角丸で柔らかく */
        font-size: 14px;      /* 文字サイズを大きく */
    }
}



@media screen and (max-width: 767px) {
    .footer,
    .footer-in,
    .footer-mobile,
    .footer-bottom {
        background: transparent !important;
    }
}

/*--------------------------------
Responsive
--------------------------------*/
@media screen and (max-width: 767px) {
	body { font-size: 16px; }
	.toolbar-btn { width: 44px; }
	.search-bar .logo { display: none; }
	.heading { padding: 32px 0 16px; }
	.intro-item .post-head { height: auto; padding: 8px 16px; margin: 0; }
	.intro-item .post-title { margin-bottom: 8px; width: 100%; font-size: 1.1em; }
	.author-thumb { width: 64px; height: 64px; }
	.author-name { padding: 8px 0 0; font-size: 1em; }
	.new-list { padding: 16px 0 0; }
	.list-item .post-head { margin: 0 0 20px 0; padding: 16px 0 0 16px; width: 95%; }
	.list-item .post-title { padding: 0 16px 16px 0; font-size: .9em; }
	.sidebar { display: none; }
}

@media screen and (min-width: 768px) {
	.main-content { flex-direction: row; align-items: flex-start; gap: 32px; }
	.content-pane { padding: 0 0 32px; }
	.sidebar { display: block; }
}

/*--------------------------------
Sidebar (まとめ)
--------------------------------*/
.sidebar { flex: 0 0 300px; max-width: 100%; padding: 0 0 32px 64px; }
.side-box { padding: 0 0 32px; }
.sidebar .heading-txt { padding: 0 0 16px; text-align: left; font-size: 1.1em; }
.side-post-item { padding: 0 0 32px; display: flex; }
.side-thumb { width: 112px; height: 112px; flex-shrink: 0; overflow: hidden; }
.side-thumb .content-img { transform-origin: center; transition: .3s; }
.side-thumb .content-img:hover { transform: scale(1.2); }
.side-post-inner { padding: 8px 0 8px 16px; display: flex; flex-direction: column; justify-content: space-between; overflow: hidden; }
.side-title { color: #333; font-size: .8em; line-height: 1.2; }
.side-info { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; color: #999; }
.side-box .post-category { margin: 0 0 0 8px; padding: 0; font-size: .7em; line-height: 1; color: #999; border-bottom: none; white-space: nowrap; text-overflow: ellipsis; }
.side-list-item { padding: 0 0 8px; }
.side-list-link { padding: 8px 8px 8px 16px; color: #333; font-size: .8em; display: block; background: url(./images/icon_doublearrow.webp) no-repeat left/ 12px 14px; }
.side-list-link:hover { background-color: #f0f0f0; }
.side-feature-item { margin: 0 0 32px; position: relative; }
.side-feature-thumb { height: 180px; }
.side-feature-inner { position: absolute; top: 0; right: 0; bottom: 0; left: 0; display: flex; align-items: center; }
.side-feature-inner .side-title { padding: 8px 16px; width: 100%; color: #fff; font-size: .9em; line-height: 1.2; font-weight: bold; background: rgba(0,0,0,.5); }

/*--W2508_03*/
.entry-title-bottom{
	padding: 2% 0;
	display: flex;
	align-items: center;
	justify-content: space-between;
	border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
.entry-title-bottom .post-author-box{
	margin: 0;
	border: 0;
	display: flex;
	align-items: center;
	flex-grow: 1;
}
.entry-title-bottom .date-tags{
	margin: 0;
}
.entry-title-bottom .post-author-thumb{
	width: 72px;
	aspect-ratio: 1;
	border-radius: 50%;
	overflow: hidden;
	display: block;
}
.entry-title-bottom .post-author-thumb .avatar{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.entry-title-bottom .post-author-info{
	padding: 0 0 0 2%;
}
.entry-title-bottom .post-author-link{
	font-weight: bold;
	text-decoration: none;
}
.segment-switch{
	margin: 0 0 4%;
	border-radius: 4px;
	overflow: hidden;
	display: flex;
	position: relative;
	border: 1px solid #111;
}
.segment-btn{
	width: 50%;
	line-height: 44px;
	background: #fff;
	color: #111;
	text-align: center;
}
.selected{
	background: #111;
	color: #fff;
}
/*--------------------------------
Intro
--------------------------------*/
.top-slide{
	width: 100%;
	margin: 0 auto;
	overflow: hidden;
	background: #000;
}
.intro-item{
	width: 1024px;
	max-width: 100%;
	position: relative;
	aspect-ratio: 2.35 / 1;
	opacity: .25;
}
.slick-active{
	opacity: 1;
}
.intro-inner{
	height: 100%;
}
.intro-item .intro-thumb{
	width: 100%;
	height: 100%;
	position: relative;
	overflow: hidden;
}
.intro-thumb .content-img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.intro-item .intro-head{
	padding: 2%;
	min-height: 40%;
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	background: rgba(0,0,0,.5);
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.intro-head-inner{
	width: 100%;
	color: #fff;
}
.intro-title{
	padding: 0 4% 1% 0;
	font-weight: bold;
	font-size: 1.3em;
	line-height: 1.2;
	order: 2;
}
.intro .intro-title{
	width: 70%;
}
.intro-title .general-link{
	color: #fff;
}
.intro-category{
	margin: 0 0 1%;
	padding: 1%;
	font-size: .8em;
	line-height: 1.2;
	color: #fff;
	border: 1px solid #333;
	background: rgba(0,0,0,.5);
	display: inline-block;
}
.intro-time{
	line-height: 1.2em;
	font-size: .7em;
	font-family: arial,sans-serfi;
	color: #fff;
	display: block;
}
.intro-author{
	width: 15%;
	flex-shrink: 0;
}
.intro-author .author-link{
	text-align: center;
	display: block;
}
.intro-author .author-thumb{
	margin: 0 auto;
	width: 72px;
	height: 72px;
	overflow: hidden;
	border-radius: 50%;
	float: none;
	clear: both;
}
.author-thumb .content-img{
	height: 100%;
	object-fit: cover;
}
.intro-author .author-name{
	padding: 16px 0 0;
	font-size: .6em;
	color: #fff;
	font-weight: bold;
}
.slick-arrow{
	margin: auto 0;
	width: 88px;
	height: 88px;
	background: transparent;
	overflow: hidden;
	position: absolute;
	top: 0;
	bottom: 0;
	z-index: 9;
	text-indent: -9999px;
}
.slick-arrow::after{
	margin: auto 0;
	width: 88px;
	height: 88px;
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 0;
	background: url(./images/icon_arrow.webp) no-repeat center / 44px;
}
.slick-prev{
	left: 0;
}
.slick-prev::after{
	transform: rotate(180deg);
}
.slick-next{
	right: 0;
}
.slick-disabled{
	opacity: .25;
	filter: grayscale(1);
}
.top-slide{
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s;
}
.top-slide.slick-initialized {
  visibility: visible;
  opacity: 1;
}
/*--/W2508_03*/