@charset "utf-8";
#index_wrap{padding-top:150px;}
.pickup_slide{
	opacity:0;
	width:100%;
}
.pickup_slide.slick-initialized{opacity:1 !important;}

#pickup_area{margin-bottom:80px;}
.slick-dotted.slick-slider.pickup_slide{margin:0 0 14px;padding:0;}
.slick-list{overflow:visible;}
.slick-track{display:flex;}
.slick-slide{height:auto !important;}

#pickup_nav{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:12px;
	margin-top:34px;
}
#pickup_nav .slick-prev{order:1;}
#pickup_nav .slick-dots{order:2;}
#pickup_nav .slick-next{order:3;}
#pickup_nav .slick-arrow{
	position:relative;
	top:auto;
	left:auto;
	right:auto;
	z-index:5;
	width:24px;
	height:24px;
	background:#00A88E;
	border:none;
	border-radius:50%;
	transform:none !important;
	transition:background 0.3s;
	flex-shrink:0;
}
#pickup_nav .slick-arrow::before{display:none;}
#pickup_nav .slick-prev{
	background:#00A88E url(/log/img/common/arrow_l_white.svg) center no-repeat;
	transition:background .3s;
}
#pickup_nav .slick-next{
	background:#00A88E url(/log/img/common/arrow_r_white.svg) center no-repeat;
	transition:background .3s;
}
#pickup_nav .slick-prev:hover{background-color:#00CBAB;}
#pickup_nav .slick-next:hover{background-color:#00CBAB;}
#pickup_nav .slick-dots{
	position:static;
	bottom:auto;
	width:auto;
	margin:0;
	display:flex;
	align-items:center;
}
#pickup_nav .slick-dots li{
	width:16px;
	height:16px;
	margin:0;
}
#pickup_nav .slick-dots li button::before{
	content:'';
	width:6px;
	height:6px;
	bottom:0;
	right:0;
	margin:auto;
	opacity:1;
	background:#AFC5C2;
	border-radius:50%;
	transition:background .3s;
}
#pickup_nav .slick-dots li.slick-active button::before,#pickup_nav .slick-dots li button:hover::before{background:#006556;}

.pickup_item{
	width:860px !important;
	min-height:360px;
	margin:0 15px;
	list-style:none !important;
}
.pickup_link{
	display:flex;
	height:100%;
	justify-content:space-between;
	text-decoration:none !important;
	position:relative;
	color:#333 !important;
	transition:color .3s;
	background:#fff;
	transition:color 0.3s, background 0.3s;
}
.pickup_link:hover{color:#00A88E !important;background:#F0FFFD;}
.pickup_txt{
	width:355px;
	position:relative;
	padding:60px 30px 80px 30px;
}
.pickup_txt p{
	font-size:1.8rem;
	letter-spacing:0.9px;
	line-height:2.6rem;
	font-weight:500;
}
.pickup_info{
	position:absolute;
	left:0;
	width:100%;
	bottom:0;
	padding:0 33px 22px;
	display:flex;
	justify-content:space-between;
	align-items:center;
}
.pickup_cate{
	font-family:"Poppins", serif;
	position:relative;
	color:#87A7A3 !important;
	padding-left:14px;
	font-size:1.6rem;
	font-weight:500;
	letter-spacing:0;
	text-transform:uppercase;
}
.pickup_cate::before{
	content:'';
	display:block;
	background:#87A7A3;
	width:7px;
	height:2px;
	position:absolute;
	left:3px;
	top:calc(50% - 1px);
}
.pickup_date{
	font-size:1.1rem;
	letter-spacing:0;
	color:#87A7A3 !important;
}
.pickup_txt::before{
	content:'';
	position:absolute;
	display:block;
	top:30px;
	left:10px;
	width:80px;
	height:27px;
	background:url(/log/img/index/icon_pickup.svg) 0 0 no-repeat;
}
.pickup_img{width:505px}
.pickup_img img{object-fit:cover;width:100%;height:100%;}


/* ランキング */
#top_ranking{
	position:relative;
	max-width:1160px;
	margin:130px auto 0;
	padding:75px 30px 130px;
}
#top_ranking::before{
	content:'';
	display:block;
	position:absolute;
	left:0;
	top:0;
	margin:0 calc(50% - 50vw);
	padding:4px calc(50vw - 50% + 8px);
	width:100vw;
	height:100%;
	background:#00A88E;
	z-index:-1;
}
#top_ranking h2{
	color:#fff;
	font-size:1.7rem;
	letter-spacing:0;
	line-height:2.5rem;
	position:relative;
	font-weight:500;
	margin-bottom:23px;
}
#top_ranking h2::after{
	content:attr(data-en);
	display:block;
	font-size:4.6rem;
	line-height:1;
	font-weight:bold;
	font-family:"Poppins", serif;
	margin-top:10px;
}
.t_w{color:#fff;}
.ranking_list {
	display: grid;
	grid-template-columns: 480fr 610fr;
	grid-template-rows: repeat(3, 1fr);
	grid-template-areas: 
		"rank1 rank2"
		"rank1 rank3"
		"rank1 rank4";
	gap:10px;
	list-style: none;
	padding: 0;
	margin: 0;
}

.ranking_item{position:relative;}
.ranking_item:nth-child(1) { grid-area: rank1; }
.ranking_item:nth-child(2) { grid-area: rank2; }
.ranking_item:nth-child(3) { grid-area: rank3; }
.ranking_item:nth-child(4) { grid-area: rank4; }
.ranking_item:nth-child(5) {display:none;}
.ranking_item::after{
	content:'';
	display:block;
	position:absolute;
	left:10px;
	top:10px;
	width:27px;
	height:36px;
}
.ranking_item:nth-child(1)::after{
	background:url(/log/img/common/icon_rank_1.svg) no-repeat center center;
	width:48px;
	height:64px;
}
.ranking_item:nth-child(2)::after{
	background:url(/log/img/common/icon_rank_2.svg) no-repeat center center;
}
.ranking_item:nth-child(3)::after{
	background:url(/log/img/common/icon_rank_3.svg) no-repeat center center;
}
.ranking_item:nth-child(4)::after{
	background:url(/log/img/common/icon_rank_4.svg) no-repeat center center;
}
.ranking_item a{
	display:flex;
	text-decoration: none;
	color:#333;
	height:100%;
	background: #fff;
	transition:color 0.3s, background 0.3s;
}
.ranking_item a:hover{color:#00A88E !important;background:#F0FFFD;}
.ranking_item:nth-child(1) a {flex-direction: column;}
.ranking_item:nth-child(1) .thumb {overflow: hidden;}
.ranking_item .post_title {
	font-weight:500;
	margin:0;
}
.ranking_item:not(:first-child) a {flex-direction:row;}
.ranking_item:not(:first-child) .thumb {
	width:200px;
	height:100%;
	flex-shrink: 0;
}
.ranking_item .thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.ranking_item .post_cate{text-transform:uppercase;}

/* 連載 */
#series_area{
	background:url(/log/img/common/bg_2.jpg) center no-repeat;
	background-size:cover;
	text-align:center;
	padding:75px 0 134px;
	margin-bottom:70px;
}
.series_content{
	max-width:870px;
	margin:auto;
	padding:0 30px;
}
.series_content h2{
	color:#87A7A3;
	font-size:1.7rem;
	letter-spacing:0;
	line-height:2.5rem;
	position:relative;
	font-weight:500;
	margin-bottom:24px;
}
.series_content h2::after{
	content:attr(data-en);
	display:block;
	color:#333;
	font-size:4.6rem;
	line-height:1;
	font-weight:bold;
	font-family:"Poppins", serif;
	margin-top:10px;
}
.series_list{
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:30px;
	list-style:none !important;
	padding:0;
	margin:0;
}
.series_item a{
	display:flex;
	flex-direction:column;
	color:#333 !important;
	text-decoration: none !important;
	height:100%;
	background:#8BDCD0;
	border-radius: 4px;
	font-size: 1.8rem;
	overflow: hidden;
	padding:12px 20px 20px;
	font-weight:500;
	border:2px solid #8BDCD0;
	transition:background 0.3s, color 0.3s;
}
.series_item a:hover{
	background:#F0FFFD;
	color:#00A88E !important;
}
.series_title {
	margin: 0;
	min-height: calc(1.8rem * 1.4 * 2);
	line-height: 1.4;
	display: flex;
	flex-direction: column;
	justify-content: center;
	text-align: center;
	height:100%;
}
.series_img {
	margin-top:12px;
}
.series_img img {
	width: 100%;
	display: block;
}

.post_area{
	max-width:1160px;
	margin:77px auto 0;
	padding:0 30px;
}
#new_area{
	margin:60px auto 0;
}
.post_area h2{
	color:#87A7A3;
	font-size:1.7rem;
	letter-spacing:0;
	line-height:2.5rem;
	position:relative;
	font-weight:500;
	margin-bottom:22px;
}
.post_area h2::after{
	content:attr(data-en);
	display:block;
	color:#333;
	font-size:4.6rem;
	line-height:1;
	font-weight:bold;
	font-family:"Poppins", serif;
	text-transform:uppercase;
	margin-top:9px;
}
.post_list{
	margin:0;
	padding:0;
	display:grid;
	grid-template-columns:repeat(4,1fr);
	gap:31px;
}
.post_item{list-style:none;}
.post_link{
	display:flex;
	flex-direction:column;
	color:#333 !important;
	text-decoration:none !important;
	height:100%;
	background:#fff;
	transition:color 0.3s,background 0.3s;
}
.post_link:hover{color:#00A88E !important;background:#F0FFFD;}
.post_img{
	overflow:hidden;
	aspect-ratio:252 / 168;
}
.post_img img{
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform 0.3s;
}
.post_link:hover img{transform:scale(1.03);}
.post_txt{
	position:relative;
	flex:1;
	padding:12px 15px 56px 15px;
}
.post_title{
	font-weight:500;
	line-height:1.5;
	font-size:1.4rem;
}
.post_info{
	position:absolute;
	left:0;
	width:100%;
	bottom:0;
	padding:0 15px 13px 15px;
	display:flex;
	justify-content:space-between;
	align-items:center;
	font-size:1.3rem;
	letter-spacing:0.8px;
	line-height:1.5;
}
.post_cate{
	position:relative;
	color:#87A7A3 !important;
	padding-left:15px;
	letter-spacing:0;
	text-transform:uppercase;
	font-family:"Poppins", serif;
}
.post_cate::before{
	content:'';
	display:block;
	background:#87A7A3;
	width:7px;
	height:2px;
	position:absolute;
	left:0;
	top:calc(50% - 1px);
}
.post_date{
	font-size:1.1rem;
	letter-spacing:0;
	color:#87A7A3 !important;
}

/* about */
#about{
	background:url(/log/img/common/bg_2.jpg) center no-repeat;
	background-size:cover;
	text-align:center;
	margin-top:100px;
	overflow:hidden;
	padding-bottom:68px;
}
.about_content{
	max-width:1160px;
	margin:auto;
	padding:0 30px;
}
.about_content h2{
	font-size:2.6rem;
	margin:40px 0 0;
	font-weight:bold;
}
.about_content p{font-size:1.5rem;}
.about_copy{margin:21px 0 17px;}
.about_copy strong{
	display:block;
	font-size:1.8rem;
	line-height:2.56rem;
	font-weight:500;
}
.about_list{
	max-width:640px;
	display:grid;
	grid-template-columns:repeat(3,1fr);
	gap:20px;
	margin:16px auto 0;
}
.about_link{
	display:flex;
	align-items:center;
	justify-content:center;
	height:52px;
	border-radius:30px;
	color:#fff !important;
	text-decoration:none !important;
	background:#00A88E;
	border:1px solid #00A88E;
	transition:background 0.3s,color 0.3s;
}
.about_link:hover{
	background:#F0FFFD;
	color:#00A88E !important;
}
.about_content h3{
	font-size:2.2rem;
	margin:38px 0 0;
	font-weight:bold;
}
.content_search{
	position:relative;
	max-width:820px;
	border-radius:30px;
	background:#f5f5f5;
	border:1px solid #DDD;
	height:60px;
	margin:7px auto 0;
}
.content_search_txt{
	border:none;
	background:none;
	position:absolute;
	left:0;
	top:0;
	width:calc(100% - 82px);
	height:60px;
	line-height:60px;
	padding:0 30px;
}
.content_search_btn{
	position:absolute;
	right:0;
	top:0;
	width:82px;
	height:60px;
	background:url(/log/img/common/icon_search_green.svg) center no-repeat !important;
	background-size:auto 19px !important;
	border:none;
	transition:background 0.3s;
	font-size:0;
	color:rgba(0,0,0,0);
}


@media screen and (max-width:1023px){
.pickup_item{width:720px !important;}
.post_list{gap:15px;}
.post_info{
	padding:0 15px 13px 15px;
	font-size:1.4rem;
	letter-spacing:0;
	flex-wrap:wrap;
}
.post_cate{
	padding-left:11px;
	margin:0 20px 0 0;
}
.post_cate::before{width:7px;}
.post_date{
	font-size:1.1rem;
	margin-left:auto;
}
.series_list{gap:15px;}
.series_item a{font-size:1.4rem;padding:16px 15px 20px;}
.post_title{font-size:1.4rem;}

}


@media screen and (max-width:767px){
#index_wrap{padding-top:0;}
#pickup_area{overflow:hidden;}
.pickup_slide .slick-track{
	display:block;
}
.pickup_slide .slick-slide{
	float:left;
	height:auto !important;
}
.pickup_slide .slick-slide > div{
	height:auto;
}
.pickup_item{
	width:auto !important;
	min-height:100px;
	margin:0;
}
.pickup_link{
	flex-direction:column-reverse;
	height:auto;
}
.pickup_txt{
	width:auto;
	padding:60px 30px 80px 30px;
}
.pickup_txt p{
	letter-spacing:0;
	line-height:2.56rem;
}
.pickup_info{
	padding:0 30px 22px;
}
.pickup_cate{
	font-size:1.4rem;
}
.pickup_txt::before{
	top:30px;
	left:10px;
	width:80px;
	height:27px;
}
.pickup_img{width:auto}
.pickup_img img{object-fit:contain;width:100%;height:auto;}
.pickup_img img {
	display: block;    /* 追加：隙間をなくす */
	width: 100%;       /* 必須：親要素の幅に合わせる */
	height: auto;      /* 必須：縦横比を維持 */
	object-fit: cover; /* 修正：containよりcoverの方が隙間ができず綺麗です */
}


/* ランキング */
#top_ranking{
	margin:40px auto 0;
	padding:20px 15px 40px;
}
#top_ranking h2{
	font-size:1.3rem;
	line-height:1.9rem;
	margin-bottom:23px;
}
#top_ranking h2::after{
	font-size:3.6rem;
	margin-top:10px;
}
.ranking_list {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	grid-template-rows: auto;
	grid-template-areas: 
		"rank1 rank1"
		"rank2 rank3"
		"rank4 rank5";
	gap: 10px;
}

.ranking_item:nth-child(1) { grid-area: rank1; }
.ranking_item:nth-child(2) { grid-area: rank2; }
.ranking_item:nth-child(3) { grid-area: rank3; }
.ranking_item:nth-child(4) { grid-area: rank4; }
.ranking_item:nth-child(5) { 
	display: block !important; 
	grid-area: rank5; 
}
.ranking_item:nth-child(1) .thumb {
	height: auto;
	aspect-ratio: 16 / 9;
}

.ranking_item:not(:first-child) a {
	flex-direction: column;
}
.ranking_item:not(:first-child) .thumb {
	width: 100%;
	height: auto;
	aspect-ratio: 4 / 3;
}
.ranking_item::after{
	content:'';
	display:block;
	position:absolute;
	left:10px;
	top:10px;
	width:27px;
	height:36px;
}
.ranking_item:nth-child(5)::after{
	background:url(/log/img/common/icon_rank_5.svg) no-repeat center center;
}
.ranking_item a,.ranking_item:not(:first-child) a{
	flex-direction:column;
}
.ranking_item .post_title {
	font-weight:500;
	margin:0;
}

/* 連載 */
#series_area{
	background:url(/log/img/common/bg_2_smp.jpg) center no-repeat;
	background-size:cover;
	padding:40px 0 44px;
	margin-bottom:50px;
}
.series_content{padding:0;}
.series_content h2{
	font-size:1.3rem;
	line-height:1.9rem;
	margin-bottom:14px;
	padding:0 15px;
}
.series_content h2::after{
	font-size:3.6rem;
	line-height:1;
	margin-top:6px;
}
.series_item{width:300px !important;margin:0 10px;}

.post_area{
	max-width:1160px;
	margin:77px auto 0;
	padding:0;
}
#new_area{
	margin:60px auto 0;
}
.post_list{
	grid-template-columns:repeat(2,1fr);
	gap:10px 9px;
	margin:0 15px;
}
.post_area h2{
	font-size:1.3rem;
	line-height:1.9rem;
	padding:0 15px;
	margin-bottom:12px;
}
.post_area h2::after{
	font-size:3.6rem;
	margin-top:6px;
}
.post_title{font-size:1.4rem;letter-spacing:0.7px;line-height:1.45;}
.post_txt{
	padding:12px 15px 56px 15px;
}
.post_info{
	padding:0 15px 13px 15px;
	font-size:1.4rem;
	letter-spacing:0;
	flex-wrap:wrap;
}
.post_cate{
	padding-left:11px;
	margin:0 20px 0 0;
}
.post_cate::before{width:7px;}
.post_date{
	font-size:1.1rem;
	margin-left:auto;
}

/* about */
#about{
	background:url(/log/img/common/bg_2_smp.jpg) center top no-repeat;
	background-size:cover;
	margin-top:60px;
	padding-bottom:43px;
}
.about_content{padding:0 15px;}
.about_content h2{
	font-size:2.4rem;
	margin:30px 0 0;
}
.about_content p{font-size:1.4rem;}
.about_copy{margin:18px 0 15px;}
.about_copy strong{
	font-size:1.6rem;
	line-height:2.4rem;
}
.about_list{
	grid-template-columns:repeat(2,1fr);
	gap:10px;
	margin:16px auto 0;
}
.about_link{
	height:40px;
	font-size:1.5rem;
}
.about_content h3{
	font-size:1.5rem;
	margin:28px 0 0;
}
.content_search{
	height:50px;
	margin:4px auto 0;
}
.content_search_txt{
	width:calc(100% - 62px);
	height:50px;
	line-height:50px;
	padding:0 30px;
}
.content_search_btn{
	width:50px;
	height:50px;
}

.series_list.slick-initialized{
	display:block;
	margin:0;
	padding:0;
}
.series_list.slick-initialized .slick-track{
	display:block;
}
.series_list.slick-initialized .slick-slide,.series_list.slick-initialized .slick-slide > div{
	height:auto;
}

.post_list.slick-initialized{
	display:block;
	margin:0;
	padding:0;
}
.post_list .slick-list{
	overflow:visible;
	margin:0 -8px;
}
.post_list .slick-track{
	display:flex;
	align-items:stretch;
}
.post_list .slick-slide{
	height:auto !important;
	display:flex;
	margin:0 8px;
}
.post_list.slick-initialized .slick-slide{
	width:calc(100vw - 64px) !important;
	max-width:320px;
}
.post_list .slick-slide > div{
	height:auto;
	width:100%;
	display:flex;
}
.post_item{
	display:flex;
	height:100%;
}
.post_list.slick-initialized .post_link{
	height:100% !important;
	width:100%;
}
.post_list.slick-initialized .post_txt{
	flex:1;
}
.slick-dots{
	position:static;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:8px;
	margin-top:20px;
}
.post_list_nav{
	display:flex;
	align-items:center;
	justify-content:center;
	gap:0;
	margin-top:20px;
}
.post_list_nav .slick-prev{order:1;}
.post_list_nav .slick-dots{
	order:2;
	margin:0 8px;
	width:auto;
	flex:0 0 auto;
	justify-content:center;
}
.post_list_nav .slick-next{order:3;}
.post_list_nav .slick-arrow{
	position:relative;
	top:auto;
	left:auto;
	right:auto;
	width:35px;
	height:35px;
	background:#00A88E;
	border:none;
	border-radius:50%;
	transform:none !important;
	transition:background .3s;
	flex-shrink:0;
	font-size:0;
}
.post_list_nav .slick-arrow::before{display:none;}
.post_list_nav .slick-prev{
	background:#00A88E url(/log/img/common/arrow_l_white.svg) center no-repeat;
}
.post_list_nav .slick-next{
	background:#00A88E url(/log/img/common/arrow_r_white.svg) center no-repeat;
}
.post_list_nav .slick-prev:hover,
.post_list_nav .slick-next:hover{
	background-color:#00CBAB;
}
.slick-dots li{
	width:16px;
	height:16px;
	margin:0;
}
.slick-dots li button{
	padding:0;
}
.slick-dots li button::before{
	content:'';
	width:10px;
	height:10px;
	left:0;
	right:0;
	bottom:0;
	margin:auto;
	opacity:1;
	background:#AFC5C2;
	border-radius:50%;
	transition:background .3s;
}
.slick-dots li.slick-active button::before{
	background:#006556;
}
}

@media screen and (max-width: 767px) {
    .pickup_slide .slick-track {
        display: flex !important;
        align-items: stretch !important;
    }

    .pickup_item {
        display: flex !important;
        width: 100vw !important;
        height: auto !important;
        margin: 0 !important;
    }

    .pickup_link {
        display: flex !important;
        flex-direction: column-reverse !important;
        width: 100% !important;
        background: #fff;
    }

    .pickup_img {
        width: 100% !important;
        aspect-ratio: 375 / 268 !important; 
        overflow: hidden;
        flex-shrink: 0 !important;
        display: flex !important;
        align-items: center;
        justify-content: center;
    }

    .pickup_img img {
        width: auto !important;
        height: auto !important;
        max-width: 100% !important;
        max-height: 100% !important;
        object-fit: contain !important;
    }

    .pickup_txt {
        flex-grow: 1 !important;
        width: 100% !important;
        padding: 60px 20px !important;
        box-sizing: border-box;
        position: relative;
    }

    .pickup_txt::before {
        top: 20px !important;
        left: 20px !important;
    }
}