@charset "utf-8";
/* PC ================================================== */
@media all and (min-width:960px){
#blog {
	width: 100%;
}
	.blog--inner {
		width: 100%;
		padding-top: 82px;
	}
		.blog-main_image {
			width: 100%;
			height: 350px;
		}
			.blog-main_image img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}

		.blog-list_contents {
			width: 90%;
			max-width: 1200px;
			padding: 70px 0px 120px;
			margin: auto auto;
		}
			.blog-heading {
				width: 100%;
				margin: auto auto 50px;
				font-family: lato, sans-serif;
				font-size: 20px;
				font-weight: 700;
				color: #6B0F2B;
				letter-spacing: 0em;
				display: flex;
				justify-content: space-between;
				align-items: center;
			}
				.blog-heading:before,
				.blog-heading:after {
					content: '';
					width: 42%;
					height: 1px;
					background-color: #6B0F2B;
				}
			.blog-list_container {
				width: 100%;
				display: flex;
				justify-content: space-between;
				align-items: flex-start;
			}
				.blog-list_wrap {
					width: calc(100% - 310px);
				}
					.blog-list {
						width: 100%;
						margin-bottom: 80px !important;
					}
						.blog-item {
							width: 100%;
							margin: auto auto 40px;
							display: flex;
							justify-content: space-between;
							align-items: flex-start;
							position: relative;
							z-index: 1;
						}
						.blog-item:last-of-type {
							margin: auto auto 0px;
						}
						.blog-item:hover {
							color: #6B0F2B;
						}
							.blog-item a {
								display: block;
								width: 100%;
								height: 100%;
								position: absolute;
								top: 0;
								left: 0;
								z-index: 2;
							}
							.blog-image {
								width: 175px;
								height: 175px;
								overflow: hidden;
							}
								.blog-image img {
									width: 100%;
									height: 100%;
									object-fit: cover;
									transition: .8s;
									-webkit-transition: .8s;
								}
								.blog-item:hover .blog-image img {
									transform: scale(1.05,1.05);
									-webkit-transform: scale(1.05,1.05);
								}

							.blog-contents {
								width: calc(100% - 175px);
								padding-left: 30px;
							}
								.blog-date {
									width: 100%;
									margin: auto auto 8px;
									font-family: lato, sans-serif;
									font-size: 14px;
									font-weight: 400;
									line-height: 1.2;
									color: #6B0F2B;
								}
								.blog-title {
									width: 100%;
									margin: auto auto 15px;
									font-size: 18px;
									font-weight: 600;
									line-height: 1.6;
								}
								.blog-details {
									width: 100%;
									font-size: 14px;
									line-height: 2.0;
									text-align: justify;
								}

					.pagination {
						width: 100%;
					}
						ul.page-numbers {
							width: auto;
							font-family: lato, sans-serif;
							font-size: 16px;
							display: flex;
							justify-content: flex-start;
							align-items: center;
						}
							ul.page-numbers li {
								width: 44px;
								height: 44px;
								margin-right: 14px;
							}
								ul.page-numbers li a.page-numbers,
								ul.page-numbers li span.page-numbers {
									display: flex;
									justify-content: center;
									align-items: center;
									width: 100%;
									height: 100%;
									border-radius: 50%;
									border: solid 1px #6B0F2B;
								}
								ul.page-numbers li a {
									background-color: #ffffff;
									color: #6B0F2B;
								}
								ul.page-numbers li span.current {
									background-color: #6B0F2B;
									color: #ffffff;
								}
								ul.page-numbers li a.prev {

								}
									ul.page-numbers li a.prev:before {
										content: "\f053";
										font-family: "Font Awesome 5 Pro";
										font-weight: 500;
									}
								ul.page-numbers li a.next {

								}
									ul.page-numbers li a.next:before {
										content: "\f054";
										font-family: "Font Awesome 5 Pro";
										font-weight: 500;
									}
								ul.page-numbers li span.dots {
									border: none;
								}
}

/* Tablet ================================================== */
@media all and (min-width:560px) and (max-width:959px){
#blog {
	width: 100%;
}
	.blog--inner {
		width: 100%;
	}
		.blog-main_image {
			width: 100%;
			height: 180px;
		}
			.blog-main_image img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}

		.blog-list_contents {
			width: 90%;
			padding: 30px 0px 70px;
			margin: auto auto;
		}
			.blog-heading {
				width: 100%;
				margin: auto auto 30px;
				font-family: lato, sans-serif;
				font-size: 20px;
				font-weight: 700;
				color: #6B0F2B;
				letter-spacing: 0em;
				display: flex;
				justify-content: space-between;
				align-items: center;
			}
				.blog-heading:before,
				.blog-heading:after {
					content: '';
					width: 36%;
					height: 1px;
					background-color: #6B0F2B;
				}
			.blog-list_container {
				width: 100%;
				padding: 0px 0px 30px;
				display: flex;
				flex-direction: column-reverse;
				justify-content: flex-start;
				align-items: center;
			}
				.blog-list_wrap {
					width: 100%;
				}
					.blog-list {
						width: 100%;
						margin-bottom: 30px !important;
					}
						.blog-item {
							width: 100%;
							margin: auto auto 35px;
							display: flex;
							justify-content: space-between;
							align-items: flex-start;
							transition: .2s;
							-webkit-transition: .2s;
							position: relative;
							z-index: 1;
						}
						.blog-item:last-of-type {
							margin: auto auto 0px;
						}
						.blog-item:hover {
							color: #6B0F2B;
						}
							.blog-item a {
								display: block;
								width: 100%;
								height: 100%;
								position: absolute;
								top: 0;
								left: 0;
								z-index: 2;
							}
							.blog-image {
								width: 175px;
								height: 175px;
								overflow: hidden;
							}
								.blog-image img {
									width: 100%;
									height: 100%;
									object-fit: cover;
								}

							.blog-contents {
								width: calc(100% - 175px);
								padding-left: 25px;
							}
								.blog-date {
									width: 100%;
									margin: auto auto 8px;
									font-family: lato, sans-serif;
									font-size: 14px;
									font-weight: 400;
									line-height: 1.2;
									color: #6B0F2B;
								}
								.blog-title {
									width: 100%;
									margin: auto auto 10px;
									font-size: 18px;
									font-weight: 600;
									line-height: 1.6;
								}
								.blog-details {
									width: 100%;
									font-size: 14px;
									line-height: 2.0;
									text-align: justify;
								}

					.pagination {
						width: 100%;
					}
						ul.page-numbers {
							width: auto;
							font-family: lato, sans-serif;
							font-size: 16px;
							display: flex;
							justify-content: center;
							align-items: center;
						}
							ul.page-numbers li {
								width: 44px;
								height: 44px;
								margin-right: 10px;
							}
								ul.page-numbers li a.page-numbers,
								ul.page-numbers li span.page-numbers {
									display: flex;
									justify-content: center;
									align-items: center;
									width: 100%;
									height: 100%;
									border-radius: 50%;
									border: solid 1px #6B0F2B;
								}
								ul.page-numbers li a {
									background-color: #ffffff;
									color: #6B0F2B;
								}
								ul.page-numbers li span.current {
									background-color: #6B0F2B;
									color: #ffffff;
								}
								ul.page-numbers li a.prev {

								}
									ul.page-numbers li a.prev:before {
										content: "\f053";
										font-family: "Font Awesome 5 Pro";
										font-weight: 500;
									}
								ul.page-numbers li a.next {

								}
									ul.page-numbers li a.next:before {
										content: "\f054";
										font-family: "Font Awesome 5 Pro";
										font-weight: 500;
									}
								ul.page-numbers li span.dots {
									border: none;
								}
}

/* SP ================================================== */
@media all and (max-width:559px){
#blog {
	width: 100%;
}
	.blog--inner {
		width: 100%;
	}
		.blog-main_image {
			width: 100%;
			height: 180px;
		}
			.blog-main_image img {
				width: 100%;
				height: 100%;
				object-fit: cover;
			}

		.blog-list_contents {
			width: 90%;
			padding: 30px 0px 70px;
			margin: auto auto;
		}
			.blog-heading {
				width: 100%;
				margin: auto auto 30px;
				font-family: lato, sans-serif;
				font-size: 20px;
				font-weight: 700;
				color: #6B0F2B;
				letter-spacing: 0em;
				display: flex;
				justify-content: space-between;
				align-items: center;
			}
				.blog-heading:before,
				.blog-heading:after {
					content: '';
					width: 36%;
					height: 1px;
					background-color: #6B0F2B;
				}
			.blog-list_container {
				width: 100%;
				padding: 0px 0px 30px;
				display: flex;
				flex-direction: column-reverse;
				justify-content: flex-start;
				align-items: center;
			}
				.blog-list_wrap {
					width: 100%;
				}
					.blog-list {
						width: 100%;
						margin-bottom: 30px !important;
					}
						.blog-item {
							width: 100%;
							margin: auto auto 30px;
							display: flex;
							justify-content: space-between;
							align-items: flex-start;
							transition: .2s;
							-webkit-transition: .2s;
							position: relative;
							z-index: 1;
						}
						.blog-item:last-of-type {
							margin: auto auto 0px;
						}
						.blog-item:hover {
							color: #6B0F2B;
						}
							.blog-item a {
								display: block;
								width: 100%;
								height: 100%;
								position: absolute;
								top: 0;
								left: 0;
								z-index: 2;
							}
							.blog-image {
								width: 90px;
								height: 90px;
								overflow: hidden;
							}
								.blog-image img {
									width: 100%;
									height: 100%;
									object-fit: cover;
								}

							.blog-contents {
								width: calc(100% - 90px);
								padding-left: 15px;
							}
								.blog-date {
									width: 100%;
									margin: auto auto 3px;
									font-family: lato, sans-serif;
									font-size: 12px;
									font-weight: 400;
									line-height: 1.2;
									color: #6B0F2B;
								}
								.blog-title {
									width: 100%;
									margin: auto auto 15px;
									font-size: 14px;
									font-weight: 600;
									line-height: 1.6;
								}
								.blog-details {
									display: none;
								}

					.pagination {
						width: 100%;
					}
						ul.page-numbers {
							width: auto;
							font-family: lato, sans-serif;
							font-size: 16px;
							display: flex;
							justify-content: center;
							align-items: center;
						}
							ul.page-numbers li {
								width: 40px;
								height: 40px;
								margin-right: 7px;
							}
								ul.page-numbers li a.page-numbers,
								ul.page-numbers li span.page-numbers {
									display: flex;
									justify-content: center;
									align-items: center;
									width: 100%;
									height: 100%;
									border-radius: 50%;
									border: solid 1px #6B0F2B;
								}
								ul.page-numbers li a {
									background-color: #ffffff;
									color: #6B0F2B;
								}
								ul.page-numbers li span.current {
									background-color: #6B0F2B;
									color: #ffffff;
								}
								ul.page-numbers li a.prev {

								}
									ul.page-numbers li a.prev:before {
										content: "\f053";
										font-family: "Font Awesome 5 Pro";
										font-weight: 500;
									}
								ul.page-numbers li a.next {

								}
									ul.page-numbers li a.next:before {
										content: "\f054";
										font-family: "Font Awesome 5 Pro";
										font-weight: 500;
									}
								ul.page-numbers li span.dots {
									border: none;
								}
}