@charset "UTF-8";

/* 右上blobがコンテンツより前面に来るのを打ち消し */
main.ais-blog .ais-common-blob--01.pc {
	z-index: 0;
}

/* ============================================
   スタッフの日常ブログ（ais_blog）PC
   カラーはおとなり系トーン。#f08300 は既存の
   オレンジと違う場合は common.css に合わせて調整
============================================ */
@media screen and (min-width: 768px), print {

/* ---------- 共通（一覧・詳細） ---------- */
.ais-blog .system-contents {
	width: min(1200px, 92%);
	margin: 0 auto 120px;
	padding: clamp(3rem, 5vw, 6.5rem) 0;
	position: relative;
	z-index: 2;
}
.ais-blog .inner-Box {
  position:relative; z-index: 10;
	background: rgba(255, 255, 255, 0.75);
	border-radius: 24px;
	padding: clamp(32px, 5vw, 60px) clamp(24px, 5.8vw, 70px);
	box-shadow: 0 4px 24px rgba(224, 158, 82, 0.12);
}

/* ---------- 一覧 ---------- */
/* page-system.css の3カラムgrid指定を打ち消し */
.ais-blog .system-list.ais-blog__list {
	display: block;
	gap: 0;
	grid-template-columns: none;
}

.ais-blog .system-list.ais-blog__list li {
	border-bottom: 2px dashed #f3d9ae;
}
.ais-blog .system-list.ais-blog__list li:last-child {
	border-bottom: none;
}
.ais-blog .system-list.ais-blog__list .text-box a {
	display: block;
	padding: 24px 16px;
	border-radius: 12px;
	transition: background 0.25s ease;
}
.ais-blog .system-list.ais-blog__list .text-box a:hover {
	background: #fff3dd;
}
.ais-blog .system-list.ais-blog__list .system-date {
	display: flex;
	align-items: center;
	gap: 32px;
	margin: 0;
}
.ais-blog .system-list.ais-blog__list .date {
	flex-shrink: 0;
	width: 110px;
	font-family: "Quicksand", sans-serif;
	font-weight: 600;
	font-size: 16px;
	letter-spacing: 0.05em;
	color: #f08300;
}
.ais-blog .system-list.ais-blog__list .ttln {
	font-size: 17px;
	font-weight: 500;
	letter-spacing: 0.05em;
	line-height: 1.6;
	color: #4a3c2a;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 1;
	overflow: hidden;
	transition: color 0.25s ease;
}
.ais-blog .system-list.ais-blog__list .text-box a:hover .ttln {
	color: #f08300;
}
.ais-blog .ais-blog__empty {
	text-align: center;
	font-size: 16px;
	color: #8a7a5f;
	padding: 40px 0;
}

/* ページネーション（wp-pagenavi） */
.ais-blog .wp-pagenavi {
	text-align: center;
	margin: 48px 0 0;
	border: none;
}
.ais-blog .wp-pagenavi a,
.ais-blog .wp-pagenavi span {
	display: inline-block;
	min-width: 40px;
	padding: 9px 0;
	margin: 0 5px;
	border: 1.5px solid #f3d9ae;
	border-radius: 999px;
	background: #fff;
	color: #4a3c2a;
	font-family: "Quicksand", sans-serif;
	font-weight: 600;
	font-size: 15px;
	line-height: 1;
	text-align: center;
	transition: all 0.25s ease;
}
.ais-blog .wp-pagenavi a:hover {
	background: #f08300;
	border-color: #f08300;
	color: #fff;
}
.ais-blog .wp-pagenavi span.current {
	background: #f08300;
	border-color: #f08300;
	color: #fff;
}

/* page-system.css の .page-list 余白を打ち消し */
.ais-blog .page-list {
	margin: 48px 0 0;
	font-size: 15px;
}
.ais-blog .page-list a,
.ais-blog .page-list span,
.ais-blog .page-list .current {
	display: inline-block;
	min-width: 40px;
	padding: 9px 0;
	margin: 0 5px;
	border: 1.5px solid #f3d9ae;
	border-radius: 999px;
	background: #fff;
	color: #4a3c2a;
	font-family: "Quicksand", sans-serif;
	font-weight: 600;
	font-size: 15px;
	line-height: 1;
	text-align: center;
	transition: all 0.25s ease;
}
.ais-blog .page-list a:hover {
	background: #f08300;
	border-color: #f08300;
	color: #fff;
}
.ais-blog .page-list .current {
	background: #f08300;
	border-color: #f08300;
	color: #fff;
}

/* ---------- 詳細 ---------- */
.ais-blog .ais-blog__single .num-bx {
	position: relative;
	border-bottom: 2px dashed #f3d9ae;
	padding-bottom: 5px;
	margin-bottom: 35px;
}
.ais-blog .ais-blog__single .system-date {
	margin-bottom: 16px;
}
.ais-blog .ais-blog__single .system-date .date {
	display: inline-block;
	padding: 6px 22px;
	background: #fff3dd;
	border-radius: 999px;
	font-family: "Quicksand", sans-serif;
	font-weight: 600;
	font-size: 15px;
	letter-spacing: 0.08em;
	color: #f08300;
}
.ais-blog .ais-blog__single .system-ttl {
	position: relative;
	padding-left: 22px;
	font-size: clamp(24px, 2.4vw, 32px);
	font-weight: 700;
	line-height: 1.55;
	letter-spacing: 0.04em;
	color: #4a3c2a;
}
.ais-blog .ais-blog__single .system-ttl::before {
	content: "";
	position: absolute;
	top: 0.35em;
	left: 0;
	width: 6px;
	height: calc(100% - 0.7em);
	min-height: 0.9em;
	border-radius: 999px;
	background: #f08300;
}
.ais-blog .ais-blog__single-thumb {
	margin-bottom: 40px;
	text-align: center;
}
.ais-blog .ais-blog__single-thumb img {
	max-width: 100%;
	height: auto;
	border-radius: 16px;
	text-align: center;
}
.ais-blog .ais-blog__single .wysiwyg-bx {
	font-size: 16px;
	line-height: 2;
	letter-spacing: 0.04em;
	color: #4a3c2a;
}

/* 一覧へ戻るボタン */
.ais-blog .ais-blog__back {
	text-align: center;
	margin: 0px 0 200px;
	position: relative;
	z-index: 2;
}
.ais-blog .ais-blog__back a {
	display: inline-block;
	min-width: 280px;
	padding: 18px 40px;
	border: 2px solid #f08300;
	border-radius: 999px;
	background: #fff;
	color: #f08300;
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-align: center;
	transition: all 0.25s ease;
}
.ais-blog .ais-blog__back a:hover {
	background: #f08300;
	color: #fff;
}

/* 詳細ページのみ：ボタンを近づけるため下余白を詰める */
.ais-blog.is-single .system-contents {
	margin-bottom: 0;
}

}



/* ========================================
  @media screen and (max-width: 767px)
======================================== */
@media screen and (max-width: 767px) {

/* 右上blobがコンテンツより前面に来るのを打ち消し */
main.ais-blog .ais-common-blob--01.sp {
	z-index: 0;
}

/* ---------- 共通（一覧・詳細） ---------- */
.ais-blog .system-contents {
	width: 91.79vw;
	margin: 0 auto 18vw;
	padding: 8vw 0;
	position: relative;
	z-index: 2;
}
.ais-blog .inner-Box {
	position: relative;
	z-index: 10;
	background: rgba(255, 255, 255, 0.75);
	border-radius: 4.8vw;
	padding: 7.2vw 4.8vw;
	box-shadow: 0 1vw 5.8vw rgba(224, 158, 82, 0.12);
}

/* ---------- 一覧 ---------- */
.ais-blog .system-list.ais-blog__list {
	display: block;
	gap: 0;
	grid-template-columns: none;
}
.ais-blog .system-list.ais-blog__list li {
	border-bottom: 0.5vw dashed #f3d9ae;
}
.ais-blog .system-list.ais-blog__list li:last-child {
	border-bottom: none;
}
.ais-blog .system-list.ais-blog__list .text-box a {
	display: block;
	padding: 4.8vw 2.4vw;
	border-radius: 2.4vw;
	transition: background 0.25s ease;
}
.ais-blog .system-list.ais-blog__list .text-box a:hover {
	background: #fff3dd;
}
.ais-blog .system-list.ais-blog__list .system-date {
	display: block;
	margin: 0;
}
.ais-blog .system-list.ais-blog__list .date {
	display: block;
	width: auto;
	margin-bottom: 1.5vw;
	font-family: "Quicksand", sans-serif;
	font-weight: 600;
	font-size: 3.86vw;
	letter-spacing: 0.05em;
	color: #f08300;
}
.ais-blog .system-list.ais-blog__list .ttln {
	font-size: 3.86vw;
	font-weight: 500;
	letter-spacing: 0.05em;
	line-height: 1.7;
	color: #4a3c2a;
	display: -webkit-box;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
	overflow: hidden;
	transition: color 0.25s ease;
}
.ais-blog .system-list.ais-blog__list .text-box a:hover .ttln {
	color: #f08300;
}
.ais-blog .ais-blog__empty {
	text-align: center;
	font-size: 3.86vw;
	color: #8a7a5f;
	padding: 9.7vw 0;
}

/* ページネーション（page-list 上書き） */
.ais-blog .page-list {
	margin: 9.7vw 0 0;
	font-size: 3.62vw;
	text-align: center;
}
.ais-blog .page-list a,
.ais-blog .page-list span,
.ais-blog .page-list .current {
	display: inline-block;
	min-width: 9.7vw;
	padding: 2.2vw 0;
	margin: 0 1.2vw;
	border: 0.36vw solid #f3d9ae;
	border-radius: 999px;
	background: #fff;
	color: #4a3c2a;
	font-family: "Quicksand", sans-serif;
	font-weight: 600;
	font-size: 3.62vw;
	line-height: 1;
	text-align: center;
	transition: all 0.25s ease;
}
.ais-blog .page-list a:hover {
	background: #f08300;
	border-color: #f08300;
	color: #fff;
}
.ais-blog .page-list .current {
	background: #f08300;
	border-color: #f08300;
	color: #fff;
}

/* ---------- 詳細 ---------- */
.ais-blog .ais-blog__single .num-bx {
	position: relative;
	border-bottom: 0.5vw dashed #f3d9ae;
	padding-bottom: 2.4vw;
	margin-bottom: 7.2vw;
}
.ais-blog .ais-blog__single .system-date {
	margin-bottom: 3.4vw;
}
.ais-blog .ais-blog__single .system-date .date {
	display: inline-block;
	padding: 1.5vw 5.3vw;
	background: #fff3dd;
	border-radius: 999px;
	font-family: "Quicksand", sans-serif;
	font-weight: 600;
	font-size: 3.62vw;
	letter-spacing: 0.08em;
	color: #f08300;
}
.ais-blog .ais-blog__single .system-ttl {
	position: relative;
	padding-left: 4.8vw;
	font-size: 5.31vw;
	font-weight: 700;
	line-height: 1.6;
	letter-spacing: 0.04em;
	color: #4a3c2a;
}
.ais-blog .ais-blog__single .system-ttl::before {
	content: "";
	position: absolute;
	top: 0.35em;
	left: 0;
	width: 1.45vw;
	height: calc(100% - 0.7em);
	min-height: 0.9em;
	border-radius: 999px;
	background: #f08300;
}
.ais-blog .ais-blog__single-thumb {
	margin-bottom: 7.2vw;
}
.ais-blog .ais-blog__single-thumb img {
	width: 100%;
	height: auto;
	border-radius: 3.4vw;
}
.ais-blog .ais-blog__single .wysiwyg-bx {
	font-size: 3.86vw;
	line-height: 2;
	letter-spacing: 0.04em;
	color: #4a3c2a;
}

/* 一覧へ戻るボタン */
.ais-blog .ais-blog__back {
	text-align: center;
	margin: 0 0 30vw;
	position: relative;
	z-index: 2;
}
.ais-blog .ais-blog__back a {
	display: inline-block;
	min-width: 62vw;
	padding: 4.1vw 9.7vw;
	border: 0.5vw solid #f08300;
	border-radius: 999px;
	background: #fff;
	color: #f08300;
	font-size: 3.86vw;
	font-weight: 700;
	letter-spacing: 0.08em;
	text-align: center;
	transition: all 0.25s ease;
}
.ais-blog .ais-blog__back a:hover {
	background: #f08300;
	color: #fff;
}

/* 詳細ページのみ：ボタンを近づけるため下余白を詰める */
.ais-blog.is-single .system-contents {
	margin-bottom: 0;
}

}