@charset "utf-8";

#pagetitle {
    .pagetitle {
        h1 {
			margin-bottom:2.5em;
            .obj {
                left:-100px;
                top:-5px;
            }
        }
    }
}

#news {
	.wrap {
		.contents {
			max-width:1200px;
			.catlist {
				display:grid;
				grid-template-columns:repeat(3,auto);
				align-items:center;
				justify-content:center;
				font-size:1.7rem;
				margin-bottom:3em;
				li {
					padding:0 1.75em;
					line-height:1;
					&:not(:last-child):not(:first-child) {
						border-left:1px solid #000000;
						border-right:1px solid #000000;
					}
					a {
						font-weight:600;
					}
					&.active {
						a {
							pointer-events:none;
							color:var(--color_main);
						}
					}
				}
			}
			position:relative;
			.oldblog {
				display:grid;
				grid-template-columns:auto .8em;
				justify-self:end;
				grid-column-gap:.25em;
				align-items:center;
				font-weight:600;
				font-size:1.4rem;
				position:absolute;
				top:.2em;
				right:0;
				img {
					transform:translateY(..5em);
				}
			}
			.contents_inner {
				display:grid;
				grid-template-columns:repeat(4,1fr);
				grid-column-gap:3.3%;
				grid-row-gap:38px;
				margin-bottom:50px;
				a {
					.img {
						overflow:hidden;
						border-radius:5px;
						box-shadow:7px 7px 5px rgba(0,0,0,.08);
						img {
							display:block;
							aspect-ratio:1.78;
							width:100%;
						}
						&:has(.draft) {
							position: relative;
						}
						.draft {
							font-size: 1.2rem;
							background-color: #ff0000;
							color:#FFFFFF;
							line-height: 2;
							padding:0 1em;
							position: absolute;
							left: 0;
							top:0;
						}
					}
					.info {
						display:grid;
						grid-template-columns:auto 1fr;
						font-size:1.3rem;
						padding:1.4em 0 .75em;
						span {
							color:var(--color_main);
							font-weight:600;
							&.date {
								&::after {
									content:'|';
									margin:0 .66em;
								}
							}
							&.cat {
								display:flex;
								flex-wrap:wrap;
								gap:.5em;
							}
						}
					}
					h3 {
						font-size:1.4rem;
						line-height:1.5;
						font-weight:500;
						font-family: "dnp-shuei-mgothic-std", sans-serif;
						margin-bottom:0;
					}
				}
			}
		}
	}
	&.single {
		.wrap {
			.contents {
				max-width:800px;
				.info {
					display:grid;
					grid-template-columns:auto 1fr;
					font-size:1.7rem;
					letter-spacing:.06em;
					margin-bottom:1em;
					span {
						font-weight:500;
						&.date {
							&::after {
								content:'|';
								margin:0 .66em;
							}
						}
						&.cat {
							display:flex;
							flex-wrap:wrap;
							gap:.5em;
						}
					}
					&:has(.draft) {
						position: relative;
					}
					.draft {
						font-size: 1.2rem;
						background-color: #ff0000;
						color:#FFFFFF;
						line-height: 2;
						padding:0 1em;
						position: absolute;
						left: 0;
						top:-2.5em;
					}
				}
				h2 {
					font-size:2.3rem;
					color:#000000;
					font-weight:500;
					line-height:1.5;
					text-align:left;
					margin-bottom:1.5em;
				}
				.contwrap {
					margin-bottom:70px;
					& > .wp-block-image,& > .wp-block-gallery {
						&:not(:first-child) {
							margin:25px 0;
						}
					}
					.wp-block-gallery {
						gap:25px!important;
						.wp-block-image {
							width:calc(50% - 15px)!important;
						}
					}
					p {
						text-align:left;
					}
				}
				& > .btn {
                    display:inline-grid;
                    position:relative;
                    max-width:100%;
                    width:auto;
                    padding-left:1.25em;
                    margin-left:auto;
                    padding-right:1em;
                    margin-right:3.2em;
                    .pdf {
                        position:absolute;
                        display:block;
                        width:2.7em!important;
                        right:-3.5em;
                        top:-.3em;
                    }
                }
			}
		}
	}
}

@media screen and (max-width:1200px){

}

@media screen and (max-width:1024px){
    
	#news {
		.wrap {
			.contents {
				.contents_inner {
					grid-template-columns:repeat(3,1fr);
				}
				.oldblog {
					top:2.2em;
				}
			}
		}
	}
	
}

@media screen and (max-width:768px){

    #pagetitle {
        .pagetitle {
            h1 {
				margin-bottom:1.5em;
                .obj {
                    left:-80px;
                    top:-5px;
                }
            }
        }
    }
    
	#news {
		.wrap {
			.contents {
				.catlist {
					font-size:1.4rem;
					li {
						padding:0 1.25em;
					}
					margin-bottom:1.25em;
				}
				.contents_inner {
					grid-template-columns:repeat(2,1fr);
					grid-column-gap:18px;
					grid-row-gap:18px;
					margin-bottom:36px;
					a {
						.info {
							font-size:1.05rem;
							padding:1.33em 0 .5em;
						}
						h3 {
							font-size:1.1rem;
							line-height:1.36;
							font-weight:500;
							font-family: "dnp-shuei-mgothic-std", sans-serif;
						}
					}
				}
				.oldblog {
					justify-self:center;
					font-size:1.2rem;
					position:relative;
					top:auto;
					right:auto;
					margin-bottom:1.5em;
				}
			}
		}
		&.single {
			.wrap {
				.contents {
					.info {
						font-size:1.3rem;
					}
					h2 {
						font-size:1.6rem;
						margin-bottom:1em;
					}
					.contwrap {
						margin-bottom:50px;
						& > .wp-block-image,& > .wp-block-gallery {
							&:not(:first-child) {
								margin:15px 0;
							}
						}
						.wp-block-gallery {
							gap:15px!important;
							.wp-block-image {
								width:calc(50% - 8px)!important;
							}
						}
					}
				}
			}
		}
	}
    
}