/* ===============================================
	definition
================================================== */

html,
body {
	overflow-x : clip;
}

/* _______________________________________ headline */

main > article:not([class]) > section > h4,
article[class] > h3 {
	margin-bottom : 3.0rem;
	background-repeat : no-repeat;
	background-size : auto clamp(4.2rem, 9.733vw, 7.3rem);
	width : 100%;
	height : auto;
}

main > article:not([class]) > section > h4 {
	margin : 0 0 3.0rem 0;
	padding : 0 0 calc(clamp(4.2rem, 9.733vw, 7.3rem) + 1.1rem) 0;
	background-position : left bottom 0.6rem;
	font-size : clamp(1.3rem, 3.467vw, 2.6rem);
}

article[class] > h3 {
	margin : 0 auto;
	padding : clamp(6.0rem, 10.133vw, 7.6rem) 0 0 0;
	background-position : center top;
	font-size : clamp(1.6rem, 1.2rem + 1.067vw, 2.0rem);
	text-align : center;
}

main > article:not([class]) > section.philosophy > h4 {
	--philosophy-heading-art-height : calc(clamp(4.62rem, 12.32vw, 9.24rem) - clamp(0rem, calc(12.05vw - 9.038rem), 1.94rem));
	--philosophy-heading-art-offset : calc(clamp(0.68rem, 1.813vw, 1.36rem) - clamp(0rem, calc(12.174vw - 9.131rem), 1.96rem));
	margin-bottom : calc(clamp(2.47rem, 6.587vw, 4.94rem) - clamp(0rem, calc(12.05vw - 9.038rem), 1.94rem));
	padding-bottom : calc(var(--philosophy-heading-art-height) + clamp(0.4rem, 1.067vw, 0.8rem) + clamp(0rem, calc(1.863vw - 1.398rem), 0.3rem));
	background-image : url("../images/headline/philosophy.png");
	background-position : left calc(100% + var(--philosophy-heading-art-offset));
	background-size : auto var(--philosophy-heading-art-height);
	font-weight : 900;
	line-height : 1;
}
main > article:not([class]) > section.product > h4 { background-image : url("../images/headline/goods.png"); }
main > article:not([class]) > section.log > h4,
article.log > h3 { background-image : url("../images/headline/log.png"); }
main > article:not([class]) > section.faq > h4,
article.faq > h3 { background-image : url("../images/headline/faq.png"); }
main > article:not([class]) > section.news > h4,
article.news > h3 { background-image : url("../images/headline/news.png"); }
article.contact > h3 { background-image : url("../images/headline/contact.png"); }
article.about > h3 { background-image : url("../images/headline/about.webp"); }

article.about > :is(#philosophy, #features) {
	scroll-margin-top : clamp(8rem, 16vw, 12rem);
}

article.about > :is(
	h3,
	section.activity > h4,
	section:last-of-type > section > h5
) {
	overflow : hidden;
	text-indent : 100%;
	white-space : nowrap;
}

article.detail > h3,
main > article:not([class]) > section.commitment > h4,
main > article:not([class]) > section:first-of-type > h4,
article.archive > section > h4 {
	display : none;
}

@media (min-width : 912px) {
	main > article:not([class]) > section > h4,
	article[class] > h3 {
		background-size : auto 7.3rem;
		max-width : 1440px;
	}
	main > article:not([class]) > section > h4 {
		padding-bottom : 8.4rem;
		font-size : clamp(1.8rem, 1.455rem + 0.379vw, 2.0rem);
	}
	article[class] > h3 {
		padding-top : 7.6rem;
		font-size : clamp(1.8rem, 1.455rem + 0.379vw, 2.0rem);
	}
}

/* _______________________________________ Page Specific */

body:has(> main > article:is(.contact, .log.archive)) {
	background-color : #f4f2eb;
}

article[class]:not(.about) {
	margin : 0 auto;
	padding-top : clamp(3rem, 8vw, 6rem);
}

article[class]:not(.about, .detail) > h3 {
	margin-bottom : 4.0rem;
}

@media (min-width : 912px) {
	article[class]:not(.about) {
		padding-top : 6.0rem;
	}
	article[class]:not(.about, .detail) > h3 {
		margin-bottom : 5.0rem;
	}
}


/* ===============================================
	components
================================================== */

/* _______________________________________ links */

:is(
	figcaption ul,
	section.log article > ul,
	article.log > section > article > ul,
	article section :is(p:not(.cta), small),
	article.detail > section:first-of-type :is(ul, ol, blockquote, figcaption)
) a {
	color : #5786A3;
}

@media (hover : none) {
	:is(
		figcaption ul,
		section.log article > ul,
		article.log > section > article > ul,
		article section :is(p:not(.cta), small)
	) a:active,
	:is(article > section.news, article.news.archive > section, article.news.detail > section:last-of-type) > ul > li > a:active {
		color : #938D79;
	}
}

@media (hover : hover) {
	:is(
		figcaption ul,
		section.log article > ul,
		article.log > section > article > ul,
		article section :is(p:not(.cta), small)
	) a:hover,
	:is(article > section.news, article.news.archive > section, article.news.detail > section:last-of-type) > ul > li > a:hover {
		color : #938D79;
	}
}

@media (hover : none) {
	:is(
		section.log > .card-slider > article,
		article.log.archive > section > article,
		article.log.detail > section:last-of-type > article
	) > a:not(:first-child):active {
		color : #938D79;
	}
}
@media (hover : hover) {
	:is(
		section.log > .card-slider > article,
		article.log.archive > section > article,
		article.log.detail > section:last-of-type > article
	) > a:not(:first-child):hover {
		color : #938D79;
	}
}

article a > img {
	transition : opacity .25s ease;
}
@media (hover : none) {
	article a:active > img {
		opacity : .7;
	}
}
@media (hover : hover) {
	article a:hover > img {
		opacity : .7;
	}
}

/* _______________________________________ button */

article section > p.cta > a,
article.about > section.activity > figure figcaption > p.cta > a,
:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a,
article section > p.cta > a::after,
article.about > section.activity > figure figcaption > p.cta > a::after,
:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a::after,
:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) {
	display : flex;
	align-items : center;
}

article section > p.cta,
article.about > section.activity > figure figcaption > p.cta {
	margin-top : clamp(3.5rem, min(9.333vw, 20.889rem - 18.519vw), 7.0rem);
}

article section > p.cta > a,
article.about > section.activity > figure figcaption > p.cta > a,
:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a {
	overflow : hidden;
	position : relative;
	justify-content : space-between;
	margin-top : 0;
	padding : 1.2rem 0 1.2rem 2.0rem;
	transition : color .3s ease;
	border : 2px solid #000000;
	background : #ffffff;
	color : #000000;
	font-size : clamp(1.5rem, min(4vw, calc(7.658rem - 6.211vw)), 3.0rem);
	line-height : clamp(1.5rem, min(4vw, calc(7.658rem - 6.211vw)), 3.0rem);
	letter-spacing : .04em;
	width : fit-content;
	min-width : 50%;
	max-width : 100%;
	height : clamp(4.7rem, min(12.533vw, calc(24.215rem - 19.753vw)), 9.4rem);
	z-index : 1;
}

article section > p.cta > a::before,
article.about > section.activity > figure figcaption > p.cta > a::before,
:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a::before {
	position : absolute;
	top : 0;
	left : 0;
	background : #000000;
	transform : scaleX(0);
	transform-origin : left center;
	transition : transform .3s cubic-bezier(0.45, 0, 0.55, 1);
	content : "";
	width : 100%;
	height : 100%;
	z-index : -1;
}

article section > p.cta > a::after,
article.about > section.activity > figure figcaption > p.cta > a::after,
:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a::after {
	align-self : center;
	flex : 0 0 auto;
	justify-content : center;
	margin-left : 1.5rem;
	border-left : 2px solid #000000;
	background : url("../images/accessories/arrow.png") no-repeat center / clamp(1.95rem, min(5.2vw, calc(9.919rem - 8.025vw)), 3.9rem) clamp(1.35rem, min(3.6vw, calc(6.867rem - 5.556vw)), 2.7rem);
	transition : filter .3s ease;
	content : "";
	width : clamp(5.35rem, min(14.267vw, calc(27.83rem - 22.84vw)), 10.7rem);
	height : clamp(3.0rem, min(8vw, calc(15.259rem - 12.346vw)), 6.0rem);
}

@media (min-width : 912px) {
	article section > p.cta > a,
	article.about > section.activity > figure figcaption > p.cta > a,
	:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a {
		font-size : 2.0rem;
		line-height : 2.0rem;
		width : fit-content;
		min-width : clamp(24rem, 25vw, 36rem);
		max-width : 100%;
		height : 6.2rem;
	}
	article section > p.cta > a::after,
	article.about > section.activity > figure figcaption > p.cta > a::after,
	:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a::after {
		background-size : 2.6rem 1.8rem;
		width : 7.0rem;
		height : 4.0rem;
	}
	article section > p.cta,
	article.about > section.activity > figure figcaption > p.cta {
		margin-top : 4.0rem;
	}
	:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a {
		flex-direction : row;
	}
}

@media (hover : none) {
	article section > p.cta > a:active,
	article.about > section.activity > figure figcaption > p.cta > a:active,
	:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a:active {
		color : #ffffff;
	}
	article section > p.cta > a:active::before,
	article.about > section.activity > figure figcaption > p.cta > a:active::before,
	:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a:active::before {
		transform : scaleX(1);
	}
	article section > p.cta > a:active::after,
	article.about > section.activity > figure figcaption > p.cta > a:active::after,
	:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a:active::after {
		filter : invert(1);
	}
}

@media (hover : hover) {
	article section > p.cta > a:hover,
	article.about > section.activity > figure figcaption > p.cta > a:hover,
	:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a:hover {
		color : #ffffff;
	}
	article section > p.cta > a:hover::before,
	article.about > section.activity > figure figcaption > p.cta > a:hover::before,
	:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a:hover::before {
		transform : scaleX(1);
	}
	article section > p.cta > a:hover::after,
	article.about > section.activity > figure figcaption > p.cta > a:hover::after,
	:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) a:hover::after {
		filter : invert(1);
	}
}

/* _______________________________________ horizontal button lists */

:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) {
	flex-direction : column;
	gap : 1.6rem;
	width : 100%;
}

@media (min-width : 912px) {
	:where(article:not(.contact, .detail) section > ul:not(:has(> li > time))) {
		flex-direction : row;
		justify-content : center;
		gap : 2.4rem;
	}
}

/* _______________________________________ slider behavior */

article > section.backnumber {
	position : relative;
	overflow : hidden;
	width : 100%;
}

article > section.backnumber > .card-slider,
article > section.backnumber > .card-slider > :is(article, figure),
article > section.backnumber > nav > ul {
	display : flex;
}

article > section.backnumber > .card-slider {
	flex-direction : row;
	overflow-x : auto;
	scroll-snap-type : x mandatory;
	scroll-behavior : smooth;
	-webkit-overflow-scrolling : touch;
	width : 100%;
}

article > section.backnumber > .card-slider::-webkit-scrollbar {
	display : none;
}

article > section.backnumber > .card-slider > :is(article, figure) {
	flex-shrink : 0;
	scroll-snap-align : center;
}

article > section.backnumber > nav {
	width : 100%;
}

article > section.backnumber > nav > ul {
	justify-content : center;
	width : 100%;
}

/* ________________________ index: log slider */

main > article:not([class]) > section.log.backnumber > .card-slider {
	position : relative;
	margin : 0 0 0 calc(50% - 50vw);
	align-items : flex-start;
	padding : var(--log-slider-padding-top) 10% clamp(1.0rem, 2.667vw, 2.0rem);
	gap : 0 clamp(1.9rem, min(5.067vw, calc(7.527rem - 4.969vw)), 3.8rem);
	box-sizing : border-box;
	width : 100vw;
	max-width : none;
}

main > article:not([class]) > section.log.backnumber > .card-slider > article {
	flex : 0 0 clamp(27.3rem, 72.8vw, 54.6rem);
	flex-direction : column;
}

main > article:not([class]) > section.log.backnumber > nav {
	margin : clamp(2.45rem, min(6.533vw, calc(10.928rem - 8.075vw)), 4.9rem) 0 4.0rem;
}

main > article:not([class]) > section.log.backnumber > nav > ul {
	gap : clamp(1.6rem, min(4.267vw, calc(7.858rem - 6.211vw)), 3.2rem);
}

main > article:not([class]) > section.log.backnumber > nav > ul > li > button {
	display : block;
	overflow : hidden;
	padding : 0;
	transition : background 0.3s ease;
	border : clamp(1px, min(.267vw, calc(.666rem - .621vw)), 2px) solid #000000;
	border-radius : 50%;
	background : #B3B3B3;
	text-indent : 100%;
	white-space : nowrap;
	cursor : pointer;
	width : clamp(.9rem, min(2.4vw, calc(4.595rem - 3.727vw)), 1.8rem);
	height : clamp(.9rem, min(2.4vw, calc(4.595rem - 3.727vw)), 1.8rem);
}

main > article:not([class]) > section.log.backnumber > nav > ul > li.is-active > button {
	background : #ffffbd;
}

@media (min-width : 912px) {
	main > article:not([class]) > section.log.backnumber > .card-slider {
		margin : 0 max(0px, calc((100vw - 1440px) / 2));
		padding : var(--log-slider-padding-top) calc(min(65vw, 93.6rem) + 2.4rem) 2.0rem 0;
		gap : 0 3.0rem;
		scroll-padding-left : 6.5vw;
		box-sizing : border-box;
		max-width : 1440px;
		width : 100vw;
	}
	main > article:not([class]) > section.log.backnumber > .card-slider > article {
		flex : 0 0 min(27.083vw, 39.0rem);
		scroll-snap-align : start;
	}
	main > article:not([class]) > section.log.backnumber > nav {
		margin-top : 3.6rem;
	}
	main > article:not([class]) > section.log.backnumber > nav > ul {
		gap : 2.2rem;
	}
	main > article:not([class]) > section.log.backnumber > nav > ul > li > button {
		border-width : 1px;
		width : 1.2rem;
		height : 1.2rem;
	}
	main > article:not([class]) > section.log.backnumber > .card-slider > article:first-child {
		margin-left : 6.5vw;
		scroll-margin-left : 6.5vw;
	}
}

@media (min-width : 1441px) {
	main > article:not([class]) > section.log.backnumber > .card-slider {
		scroll-padding-left : 9.36rem;
	}
	main > article:not([class]) > section.log.backnumber > .card-slider > article:first-child {
		margin-left : 9.36rem;
		scroll-margin-left : 9.36rem;
	}
}

/* _______________________________________ philosophy */

:is(main > article:not([class]) > section.philosophy, article.about > section#philosophy) ol {
	display : flex;
	flex-direction : column;
	counter-reset : philosophy-counter;
}
main > article:not([class]) > section.philosophy ol {
	width : 100%;
}

article.about > section#philosophy ol {
	gap : clamp(3.0rem, min(8vw, calc(15.317rem - 12.422vw)), 6.0rem);
}

:where(main > article:not([class]) > section.philosophy ol li, article.about > section#philosophy ol li > p:first-of-type) {
	display : inline-flex;
	flex-direction : column;
	align-items : flex-start;
	padding : 0.3em 0.6em 0.4em 0.6em;
	background : linear-gradient(to top, #000000 1.7em, transparent 1.7em);
	color : #ffffff;
	font-weight : 900;
	line-height : 1;
	width : max-content;
}
main > article:not([class]) > section.philosophy ol li {
	font-size : clamp(1.6rem, 1.177rem + 1.128vw, 2.4rem);
}
article.about > section#philosophy ol li > p:first-of-type {
	font-size : clamp(1.75rem, 4.667vw, 3.5rem);
}

:where(main > article:not([class]) > section.philosophy ol li, article.about > section#philosophy ol li > p:first-of-type)::before {
	display : block;
	counter-increment : philosophy-counter;
	margin : 0 0 1.2em -0.6em;
	color : #000000;
	font-size : 0.875em;
	content : "その" counter(philosophy-counter);
}

article.about > section#philosophy ol li > p:first-of-type::before {
	margin-bottom : clamp(1.89rem, 5.04vw, 3.78rem);
	font-size : clamp(1.3rem, min(3.467vw, calc(5.395rem - 3.727vw)), 2.6rem);
}

@media (min-width : 912px) {
	main > article:not([class]) > section.philosophy ol li {
		font-size : 2em;
	}
	:where(main > article:not([class]) > section.philosophy ol li, article.about > section#philosophy ol li > p:first-of-type)::before {
		margin-left : -1.2em;
		font-size : 0.5em;
	}
	article.about > section#philosophy ol li > p:first-of-type::before {
		margin-bottom : 2.1rem;
		font-size : 2.0rem;
	}
}

/* _______________________________________ news */

:where(article > section.news, article.news.archive > section, article.news.detail > section:last-of-type) > ul {
	border-top : 2px solid #ddd9cc;
	width : 100%;
}

:where(article > section.news, article.news.archive > section, article.news.detail > section:last-of-type) > ul > li {
	padding : clamp(1.6rem, 4.267vw, 3.2rem) 0;
	border-bottom : 2px solid #ddd9cc;
}

:where(article > section.news, article.news.archive > section, article.news.detail > section:last-of-type) > ul > li > time {
	display : block;
	margin-bottom : 0.4rem;
	color : #9f9f9f;
	font-size : clamp(1.2rem, 3.2vw, 2.4rem);
	line-height : clamp(1.1rem, 2.933vw, 2.2rem);
	letter-spacing : 0.04em;
}

:where(article > section.news, article.news.archive > section, article.news.detail > section:last-of-type) > ul > li > a {
	display : block;
	transition : color 0.3s ease;
	font-size : clamp(1.4rem, 3.733vw, 2.8rem);
	line-height : clamp(2.1rem, 5.6vw, 4.2rem);
}

main > article:not([class]) > section.news > h4 {
	--news-heading-art-height : clamp(2.625rem, min(12.333vw, calc(183.33px - 12.112vw)), 9.25rem);
	--news-heading-size : clamp(1.3rem, min(3.467vw, calc(5.395rem - 3.727vw)), 2.6rem);
	--news-heading-spacing-extra : clamp(0px, max(calc(2.213vw - 6.4px), calc(5.155vw - 28.46px)), 18.5px);
	background-size : auto var(--news-heading-art-height);
	background-position : clamp(-2px, -0.267vw, -1px) calc(100% - 6px);
	font-size : var(--news-heading-size);
	line-height : var(--news-heading-size);
	font-weight : 900;
	letter-spacing : 0;
	padding-bottom : calc(var(--news-heading-art-height) + 1.1rem + var(--news-heading-spacing-extra));
	margin-bottom : clamp(1.25rem, 3.333vw, 3rem);
}

main > article:not([class]) > section.news > ul {
	width : min(100%, 89.333vw);
	margin-right : auto;
	margin-left : auto;
	border-top-width : 2px;
}

main > article:not([class]) > section.news > ul > li {
	border-bottom-width : 2px;
}

main > article:not([class]) > section.news > ul > li > time {
	font-size : clamp(1.2rem, min(3.2vw, calc(6.593rem - 5.59vw)), 2.4rem);
	line-height : clamp(1.1rem, min(2.933vw, calc(3.132rem - 1.242vw)), 2.2rem);
	font-weight : 900;
	font-style : italic;
	letter-spacing : 0.04em;
}

main > article:not([class]) > section.news > ul > li > a {
	font-size : clamp(1.4rem, min(3.733vw, calc(8.856rem - 8.075vw)), 2.8rem);
	line-height : clamp(2.0rem, min(5.6vw, calc(14.45rem - 13.665vw)), 4.2rem);
	font-weight : 900;
	letter-spacing : 0;
}

main > article:not([class]) > section.news {
	position : relative;
	margin-bottom : 0;
	padding-top : max(0rem, calc(7.5% - clamp(1.0rem, 2.667vw, 2.0rem)));
}

article > section.news > p.cta {
	display : flex;
	justify-content : center;
	margin-right : auto;
	margin-left : auto;
	margin-top : min(10.667vw, calc(23.873rem - 21.164vw));
	width : 90%;
}

article.news.archive > h3 {
	--news-archive-heading-art-height : clamp(3.65rem, 9.733vw, 7.3rem);
	--news-archive-heading-size : clamp(1.6rem, 1.2rem + 1.067vw, 2rem);
	margin-bottom : clamp(3.05rem, 8.133vw, 6.2rem);
	background-size : auto var(--news-archive-heading-art-height);
	padding-top : min(10.667vw, 8rem);
	font-size : var(--news-archive-heading-size);
	line-height : var(--news-archive-heading-size);
	font-weight : 900;
	letter-spacing : 0;
}

article.news.archive > section > ul {
	margin-right : auto;
	margin-left : auto;
	width : min(89.333vw, 100%);
}

article.news.archive > nav[aria-label$="ArchiveList"] {
	margin-top : clamp(4rem, 10.667vw, 8rem);
}

@media (min-width : 912px) {
	main > article:not([class]) > section.news {
		display : grid;
		grid-template-rows : auto 1fr;
		padding-bottom : 0;
	}
	main > article:not([class]) > section.news h4 {
		grid-column : 1;
		grid-row : 1;
	}
	main > article:not([class]) > section.news > p.cta {
		grid-column : 1;
		grid-row : 2;
		align-self : flex-start;
		justify-content : flex-start;
		margin : 0;
		width : 100%;
	}
	main > article:not([class]) > section.news > ul {
		grid-column : 2;
		grid-row : 1 / span 2;
		width : 100%;
		margin : 0;
	}
		main > article:not([class]) > section.news > ul > li {
			grid-template-columns : 9.0rem 1fr;
			padding : 0;
		}
	main > article:not([class]) > section.news > ul > li > time,
	main > article:not([class]) > section.news > ul > li > a {
		margin : 0;
		padding-top : 3.0rem;
		padding-bottom : 3.0rem;
	}
	main > article:not([class]) > section.news > ul > li > time {
		padding-left : 1.4rem;
	}
	main > article:not([class]) > section.news > ul > li > a {
		padding-left : 2.0rem;
	}
	main > article:not([class]) > section.news > h4 {
		--news-heading-art-height : 7.3rem;
		--news-heading-size : 2.0rem;
		--news-heading-spacing-extra : 1.85rem;
		background-position : calc(0% - 2px) calc(100% - 6px);
	}
	main > article:not([class]) > section.news > ul > li > time {
		font-size : 1.5rem;
		line-height : 2.0rem;
		padding-right : 0;
	}
	main > article:not([class]) > section.news > ul > li > a {
		font-size : 1.5rem;
		line-height : 2.0rem;
	}
	main > article:not([class]) > section.news > ul > li > :is(time, a) {
		font-size : 1.5rem;
	}
	article.news.archive > h3 {
		--news-archive-heading-art-height : 7.3rem;
		--news-archive-heading-size : 2rem;
		margin-bottom : 6.2rem;
		background-size : auto 7.3rem;
		padding-top : 8rem;
		font-size : 2rem;
		line-height : 2rem;
		font-weight : 900;
		letter-spacing : 0;
	}
	article.news.archive > section > ul {
		width : min(87rem, 100%);
	}
	article.news.archive > section > ul > li {
		grid-template-columns : 12rem minmax(0, 1fr);
	}
	article.news.archive > section > ul > li > :is(time, a) {
		padding-top : 3rem;
		padding-bottom : 3rem;
	}
	article.news.archive > section > ul > li > time {
		font-size : 2rem;
		line-height : 2rem;
	}
	article.news.archive > section > ul > li > a {
		font-size : 2rem;
		line-height : 3rem;
	}
}

@media (min-width : 912px) {
	:is(article > section.news, article.news.archive > section, article.news.detail > section:last-of-type) > ul > li {
		display : grid;
		align-items : start;
		padding : 0;
	}
	:is(article.news.archive > section, article.news.detail > section:last-of-type) > ul > li {
		grid-template-columns : 12rem minmax(0, 1fr);
	}
	article.news.archive > section > ul > li > :is(time, a) {
		margin : 0;
		padding-top : 3rem;
		padding-bottom : 3rem;
		font-size : 2.0rem;
	}
	article.news.detail > section:last-of-type > ul > li > :is(time, a) {
		margin : 0;
		padding-top : 3rem;
		padding-bottom : 3rem;
	}
	:is(article.news.archive > section, article.news.detail > section:last-of-type) > ul > li > time {
		padding-top : 3.5rem;
	}
	:is(article.news.archive > section, article.news.detail > section:last-of-type) > ul > li > a {
		padding-left : 2.0rem;
	}
	article.news.detail > section:last-of-type > ul > li > time {
		font-size : 2rem;
		line-height : 2rem;
	}
	article.news.detail > section:last-of-type > ul > li > a {
		font-size : 2.0rem;
		line-height : 3rem;
	}
}

/* _______________________________________ faq */

:is(article > section.faq, article.faq section) details {
	margin : 0 auto clamp(1.5rem, 4vw, 3.0rem);
	border : none;
	width : 100%;
}

:is(article > section.faq, article.faq section) details summary {
	display : flex;
	position : relative;
	align-items : center;
	--faq-toggle-inset : clamp(2rem, 5.6vw, 4.2rem);
	--faq-toggle-width : clamp(1.56rem, min(4.1613vw, calc(64.8px - 4.478vw)), 3.121rem);
	padding : 0 clamp(4.0rem, 2.976rem + 2.73vw, 6.4rem) 0 min(11.6vw, clamp(7.2rem, calc(15.6875rem - 9.317vw), 8.7rem));
	border : none;
	border-bottom : 2px solid #000000;
	background : #f4f2eb;
	color : #000000;
	font-size : clamp(1.4rem, min(3.733vw, calc(55.95px - 3.727vw)), 2.8rem);
	font-weight : 900;
	line-height : clamp(1.4rem, min(3.733vw, calc(55.95px - 3.727vw)), 2.8rem);
	letter-spacing : 0;
	min-height : clamp(5.1rem, min(13.6vw, calc(232.6px - 17.39vw)), 10.2rem);
}

:is(article > section.faq, article.faq section) details summary::before {
	position : absolute;
	top : min(50%, calc(var(--faq-summary-padding-block, 0px) + 0.5lh));
	left : clamp(1.4rem, 0.973rem + 1.139vw, 2.4rem);
	transform : translateY(-50%);
	background : url("../images/accessories/quest.png") no-repeat center / auto 116%;
	background-position : calc(50% - 0.6px) 50%;
	content : "";
	width : clamp(1.75rem, min(4.667vw, calc(81.58px - 6.211vw)), 3.5rem);
	height : clamp(2.15rem, min(5.733vw, calc(103.56px - 8.075vw)), 4.3rem);
}

:is(article > section.faq, article.faq section) details summary::after {
	position : absolute;
	top : min(50%, calc(var(--faq-summary-padding-block, 0px) + 0.5lh));
	right : var(--faq-toggle-inset);
	transform : translateY(-50%);
	background : url("../images/accessories/down.png") no-repeat center / contain;
	content : "";
	width : var(--faq-toggle-width);
	height : clamp(0.9rem, min(2.4vw, calc(36.63px - 2.484vw)), 1.8rem);
}

:is(article > section.faq, article.faq section) details[open] summary::after {
	background-image : url("../images/accessories/up.png");
}

:is(article > section.faq, article.faq section) details p {
	position : relative;
	overflow : hidden;
	padding : 0 clamp(2.0rem, 1.36rem + 1.707vw, 4.0rem) 0 clamp(4.4rem, 3.205rem + 3.187vw, 7.2rem);
	transition : max-height 0.3s ease, padding 0.3s ease;
	border : none;
	background : #ffffff;
	color : #3a2f28;
	font-size : clamp(1.3rem, min(3.467vw, calc(63.267px - 4.969vw)), 2.6rem);
	font-weight : 900;
	line-height : clamp(2.3rem, min(6.133vw, calc(111.217px - 8.696vw)), 4.6rem);
	letter-spacing : 0;
	max-height : 0;
}

:is(article > section.faq, article.faq section) details p::before {
	position : absolute;
	top : clamp(1.6rem, 1.088rem + 1.365vw, 2.4rem);
	left : clamp(1.4rem, 0.973rem + 1.139vw, 2.4rem);
	background : url("../images/accessories/answer.png") no-repeat center 29% / auto 146%;
	opacity : 0;
	transition : opacity 0.2s ease;
	content : "";
	width : clamp(1.9rem, min(5.067vw, calc(89.24px - 6.832vw)), 3.8rem);
	height : clamp(1.75rem, min(4.667vw, calc(81.58px - 6.211vw)), 3.5rem);
}

:is(article > section.faq, article.faq section) details[open] p {
	padding : clamp(1.6rem, 1.088rem + 1.365vw, 2.4rem) clamp(1rem, calc(4.35vw - 5.625px), 3.4rem) clamp(2.0rem, 1.36rem + 1.707vw, 3.2rem) clamp(4rem, calc(7.467vw + 1.2rem), 7.2rem);
	max-height : 60.0rem;
}

:is(article > section.faq, article.faq section) details[open] p::before {
	opacity : 1;
}

	@media (min-width : 912px) {
	:is(article > section.faq, article.faq section) details summary {
		--faq-toggle-inset : 4.2rem;
		--faq-toggle-width : 2.4rem;
		font-size : 2.2rem;
		line-height : 2.2rem;
		min-height : 7.4rem;
	}
	:is(article > section.faq, article.faq section) details p {
		font-size : 1.8rem;
		line-height : 3.2rem;
	}
	:is(article > section.faq, article.faq section) details summary::before {
		width : 2.5rem;
		height : 3rem;
	}
	:is(article > section.faq, article.faq section) details summary::after {
		width : 2.4rem;
		height : 1.4rem;
	}
	:is(article > section.faq, article.faq section) details p::before {
		width : 2.7rem;
		height : 2.5rem;
	}
	:is(article > section.faq, article.faq section) details[open] p {
		padding-right : 3.4rem;
		padding-left : 7.2rem;
	}
}


/* ===============================================
	index
================================================== */

body > .promotion {
	--promotion-copy-height : calc(min(clamp(64px, 17.066667vw, 128px), clamp(114px, calc(193.217391px - 8.695652vw), 128px)) + min(15.066667vw, max(0px, calc(639.4px - 70.186vw))));
	--promotion-copy-width : min(min(90.778vw, 680px), clamp(572.53536px, calc(1180.611677px - 66.748224vw), 680px));
	--promotion-photo-height : min(clamp(430px, 114.666667vw, 860px), clamp(392.666667px, calc(3037.018634px - 290.269151vw), 860px));
	--promotion-header-gap : min(clamp(10px, 2.666667vw, 20px), clamp(0px, calc(113.167702px - 12.42236vw), 20px));
	--promotion-loop-width : min(clamp(2467.690447px, 658.050786vw, 4935.380895px), clamp(2253.441354px, calc(17428.888071px - 1665.800957vw), 4935.380895px));
	position : relative;
	overflow : hidden;
	background : #ffffff;
	width : 100%;
	height : calc(var(--promotion-copy-height) + var(--promotion-photo-height) + var(--promotion-header-gap));
}

body > .promotion::before,
body > .promotion::after {
	position : absolute;
	left : 0;
	content : "";
	width : 100%;
}

body > .promotion::before {
	top : 0;
	background : url("../images/headline/catchphrase.png") no-repeat center / var(--promotion-copy-width) auto;
	height : var(--promotion-copy-height);
}

body > .promotion::after {
	top : var(--promotion-copy-height);
	background-image : url("../images/index/promotion.webp");
	background-repeat : repeat-x;
	background-position : 0 0;
	background-size : auto 100%;
	animation : promotion-loop 30s linear infinite;
	height : var(--promotion-photo-height);
}

@keyframes promotion-loop {
	to { background-position-x : calc(-1 * var(--promotion-loop-width)); }
}

body > aside {
	visibility : hidden;
	position : fixed;
	right : 0.5rem;
	bottom : 0.5rem;
	background : #fffacf;
	transform : translateY(40px);
	transition : 
		opacity 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
		transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94),
		visibility 0.4s;
	opacity : 0;
	max-width : 75%;
	z-index : 115;
}

body > aside.active {
	visibility : visible;
	transform : translateY(0);
	opacity : 1;
}

body > aside a {
	display : flex;
	align-items : center;
	gap : 2.0rem;
	padding : 1.5rem 3.0rem;
}

body > aside p {
	font-size : clamp(1.2rem, 0.855rem + 0.379vw, 1.4rem);
	line-height : 1.6;
}

body > aside img {
	display : block;
	width : clamp(5.5rem, 5.5rem + 1.467vw, 11rem);
	max-width : 11rem;
	height : auto;
}

article:has(> video) {
	display : grid;
	grid-template-columns : 1fr;
	grid-template-rows : 1fr;
	align-items : center;
	justify-items : center;
	margin-top : min(10vw, clamp(32px, calc(275.3px - 26.708vw), 75px));
}

article > video {
	grid-row : 1;
	grid-column : 1;
	background : url("../images/index/books_sp.webp") no-repeat center / contain;
	aspect-ratio : 910 / 1328;
	width : 100%;
	height : auto;
	margin-bottom : 130px;
	z-index : 1;
}

@media (min-width : 912px) {
	body > .promotion {
		--promotion-copy-height : min(12.5vw, 180px);
		--promotion-copy-width : min(62.778vw, 904px);
		--promotion-photo-height : min(43.055556vw, 620px);
		--promotion-header-gap : 0px;
		--promotion-loop-width : min(247.087868vw, 3558.065296px);
	}
	body > aside img {
	max-width : 7.5rem;
}
	article > video {
		background-image : url("../images/index/books_pc.webp");
		aspect-ratio : 1440 / 1132;
		margin-bottom : 155px;
	}
	article:has(> video) {
		margin-top : 32px;
	}
}

/* _______________________________________ index:sections */

main > article:not([class]) > section {
	overflow : hidden;
	margin-bottom : var(--index-section-boundary, 0px);
	padding : 7.5% 5%;
	width : 100%;
}

main > article:not([class]) > section > p {
	padding-bottom : 1.2rem;
}

@media (min-width : 912px) {
	main > article:not([class]) > section {
		padding : 7.5% 6.5%;
	}

	main > article:not([class]) > :is(
		section.philosophy,
		section.product,
		section.faq,
		section.news
	) {
		padding-right : clamp(5.9rem, calc(21.023vw - 13.274rem), 17.0rem);
		padding-left : clamp(5.9rem, calc(21.023vw - 13.274rem), 17.0rem);
	}
}

main > article:not([class]) > section:first-of-type {
	display : flex;
	grid-row : 1;
	grid-column : 1;
	align-self : start;
	flex-direction : column;
	align-items : center;
	margin-top : 43.8333vw;
	--index-section-boundary : clamp(131px, calc(18.8667vw + min(0px, calc(-20.3884vw + 152.9130px))), 141.5px);
	padding-right : 0;
	padding-left : 0;
	text-align : center;
	width : min(83.333%, 62.5rem);
	max-width : none;
	z-index : 2;
}

main > article:not([class]) > section:first-of-type > p:not(.cta) {
	padding-bottom : 0;
	font-size : clamp(1.3rem, 3.467vw, 2.6rem);
	font-weight : 900;
	line-height : 2;
	letter-spacing : 0;
}

main > article:not([class]) > section:first-of-type > p:not(.cta):first-of-type {
	margin-bottom : 0;
}

main > article:not([class]) > section:first-of-type > p.cta {
	margin-top : 4.1333vw;
	width : 100%;
}
main > article:not([class]) > section:first-of-type > p.cta > a {
	margin-right : auto;
	margin-left : auto;
	width : min(76.8%, 48.0rem);
	min-width : 0;
}

@media (min-width : 912px) {
	main > article:not([class]) > section:first-of-type {
		margin-top : calc(clamp(22.5rem, calc(22.5rem + 11.75rem * pow((100vw - 912px) / 528px, 3)), 34.25rem) + 20px - 5rem * pow(max(0, (1440px - 100vw) / 528px), 3));
		--index-section-boundary : clamp(131px, calc(-1.5217vw + 152.9130px), 139.0348px);
		width : min(90%, 57.5rem);
	}
	main > article:not([class]) > section:first-of-type > p:not(.cta) {
		font-size : clamp(1.8rem, 0.764rem + 1.136vw, 2.4rem);
	}
	main > article:not([class]) > section:first-of-type > p.cta {
		margin-top : clamp(2.0rem, calc(3.7879vw - 14.545px), 4.0rem);
		width : 100%;
	}
	main > article:not([class]) > section:first-of-type > p.cta > a {
		width : min(100%, 35.0rem);
	}
}

/* _______________________________________ index:philosophy */

main > article:not([class]) > section.philosophy {
	display : flex;
	position : relative;
	overflow : visible;
	flex-direction : column;
	align-items : center;
	margin-top : 0;
	--index-section-boundary : clamp(-0.5px, calc(-0.0667vw + max(0px, calc(0.1391vw - 1.0435px))), 0px);
	padding-top : calc(clamp(4.96rem, 13.233vw, 9.925rem) - clamp(0rem, calc(19.193vw - 14.395rem), 3.09rem));
	padding-bottom : min(69.093vw, 51.82rem);
	background : #f4f2eb url("../images/accessories/illust_01.png") no-repeat right 2.0rem bottom 2.5rem / calc(clamp(19.1rem, 50.933vw, 38.2rem) + clamp(0rem, calc(13.665vw - 10.249rem), 2.2rem)) auto;
	background-position : calc(100% - clamp(2rem, 5.333vw, 4rem)) calc(100% - clamp(3rem, 8vw, 6rem));
}

main > article:not([class]) > section.philosophy::before,
main > article:not([class]) > section.philosophy::after {
	position : absolute;
	top : 0;
	bottom : 0;
	pointer-events : none;
	background : #f4f2eb;
	content : "";
	width : max(0px, calc((100vw - 100%) / 2));
}

main > article:not([class]) > section.philosophy::before {
	right : 100%;
}

main > article:not([class]) > section.philosophy::after {
	left : 100%;
}

main > article:not([class]) > section.philosophy ol {
	align-self : flex-start;
	gap : calc(clamp(1.5rem, 4vw, 3.0rem) - clamp(0rem, calc(2.484vw - 1.863rem), 0.4rem));
	width : calc(clamp(30rem, 80vw, 60rem) - clamp(0rem, calc(43.478vw - 32.609rem), 7rem));
}

main > article:not([class]) > section.philosophy ol li {
	--philosophy-band-height : calc(clamp(3rem, 8vw, 6rem) - clamp(0rem, calc(4.969vw - 3.727rem), 0.8rem));
	--philosophy-band-padding-x : clamp(1rem, 2.667vw, 2rem);
	--philosophy-title-height : calc(clamp(2rem, 5.333vw, 4rem) - clamp(0rem, calc(3.106vw - 2.329rem), 0.5rem));
	--philosophy-band-padding-y : calc((var(--philosophy-band-height) - var(--philosophy-title-height)) / 2);
	padding : 0 var(--philosophy-band-padding-x) var(--philosophy-band-padding-y);
	background : linear-gradient(to top, #000000 var(--philosophy-band-height), transparent var(--philosophy-band-height));
	font-size : var(--philosophy-title-height);
}

main > article:not([class]) > section.philosophy ol li:nth-child(1) {
	width : calc(clamp(30rem, 80vw, 60rem) - clamp(0rem, calc(43.478vw - 32.609rem), 7rem));
}

main > article:not([class]) > section.philosophy ol li:nth-child(2) {
	width : calc(clamp(14rem, 37.333vw, 28rem) - clamp(0rem, calc(18.634vw - 13.976rem), 3rem));
}

main > article:not([class]) > section.philosophy ol li:nth-child(3) {
	width : calc(clamp(22rem, 58.667vw, 44rem) - clamp(0rem, calc(31.056vw - 23.292rem), 5rem));
}

main > article:not([class]) > section.philosophy ol li::before {
	margin-bottom : calc(1rem + var(--philosophy-band-padding-y));
	margin-left : calc(-1 * var(--philosophy-band-padding-x));
	font-size : calc(clamp(1.3rem, 3.467vw, 2.6rem) - clamp(0rem, calc(3.727vw - 2.795rem), 0.6rem));
	line-height : 1;
}

main > article:not([class]) > section.philosophy > p.cta {
	align-self : flex-start;
	margin-top : min(8.533vw, 6.4rem);
}

main > article:not([class]) > section.philosophy > p.cta > a {
	margin-top : 0;
	width : min(70vw, 48.0rem);
	min-width : 0;
}

@media (min-width : 912px) {
	main > article:not([class]) > section.philosophy {
		align-items : flex-start;
		--index-section-boundary : clamp(-0.3826px, calc(0.0725vw - 1.0435px), 0px);
		min-height : calc(clamp(43.2rem, 47.361vw, 68.2rem) + clamp(8rem, 10vw, 14rem) + clamp(0rem, calc(9.659vw - 8.809rem), 5.1rem));
		padding-top : clamp(6.84rem, calc(15.53vw - 7.323rem), 15rem);
		padding-bottom : 7.5%;
		background-position : calc(100% - clamp(4rem, calc(13.258vw - 8.09rem), 11rem)) calc(50% + 0.6rem);
		background-size : clamp(40.4rem, 44.306vw, 63.8rem) auto;
	}
	main > article:not([class]) > section.philosophy > h4 {
		margin-bottom : clamp(3rem, calc(3.598vw - 0.282rem), 4.9rem);
		padding-bottom : 8.4rem;
		background-position : left calc(100% + 1.1rem);
		background-size : auto 7.3rem;
	}
	main > article:not([class]) > section.philosophy > * {
		max-width : 48.5%;
	}
	main > article:not([class]) > section.philosophy ol {
		gap : 2.6rem;
		width : 53rem;
		max-width : none;
	}
	main > article:not([class]) > section.philosophy ol li {
		--philosophy-band-height : 5.2rem;
		--philosophy-band-padding-x : 2rem;
		--philosophy-title-height : 3.5rem;
		--philosophy-band-padding-y : 0.85rem;
	}
	main > article:not([class]) > section.philosophy ol li:nth-child(1) { width : 53rem; }
	main > article:not([class]) > section.philosophy ol li:nth-child(2) { width : 25rem; }
	main > article:not([class]) > section.philosophy ol li:nth-child(3) { width : 39rem; }
	main > article:not([class]) > section.philosophy ol li::before {
		margin-bottom : 1.85rem;
		font-size : 2rem;
		line-height : 2rem;
	}
	main > article:not([class]) > section.philosophy > p.cta > a {
		width : min(35vw, 35.0rem);
	}
}

/* _______________________________________ index:commitment */

main > article:not([class]) > section.commitment {
	display : flex;
	flex-direction : column;
	align-items : center;
	--index-section-boundary : clamp(23px, calc(12.7333vw + min(0px, calc(-23.2406vw + 174.3043px))), 95.5px);
	padding-top : 73vw;
	background : url("../images/index/books.webp") no-repeat center clamp(0px, 10.133vw, 7.6rem) / 136% auto;
	text-align : left;
}

main > article:not([class]) > section.commitment > p {
	margin-bottom : clamp(4.0rem, min(9.333vw, calc(20.89rem - 18.52vw)), 7.0rem);
	padding-bottom : 0;
	font-size : clamp(1.3rem, 3.467vw, 2.6rem);
	line-height : clamp(2.3rem, 6.133vw, 4.6rem);
	font-weight : 900;
	letter-spacing : 0;
	width : min(96.3%, calc(47.83vw + 29.13rem));
}

main > article:not([class]) > section.commitment > ul {
	align-items : center;
	gap : clamp(2.0rem, 5.333vw, 4.0rem);
	width : min(64vw, 48.0rem);
}

main > article:not([class]) > section.commitment > ul > li {
	width : 100%;
	max-width : none;
}

main > article:not([class]) > section.commitment > ul > li > a {
	width : 100%;
	min-width : 0;
}

@media (min-width : 912px) {
	main > article:not([class]) > section.commitment {
		--index-section-boundary : clamp(23px, calc(-10.5072vw + 174.3043px), 78.4783px);
		padding : clamp(49.2rem, calc(54.5455vw - 5.45px), 78.0rem) 2.0rem 8.0rem 2.0rem;
		background-position : 0 clamp(7.6rem, calc(8.9vw - 0.52rem), 12.3rem);
		background-size : contain;
		text-align : center;
	}
	main > article:not([class]) > section.commitment > p {
		margin-bottom : 4.0rem;
		font-size : 2.2rem;
		line-height : 3.85rem;
		width : min(90%, 72.7rem);
	}
	main > article:not([class]) > section.commitment > ul {
		gap : 5.0rem;
		width : min(90%, 75.0rem);
	}
	main > article:not([class]) > section.commitment > ul > li {
		flex : 1 1 0;
		width : auto;
		max-width : 35.0rem;
	}
}

/* _______________________________________ index:product */

main > article:not([class]) > section.product {
	display : grid;
	overflow : visible;
	position : relative;
	grid-template-columns : 100%;
	row-gap : 0;
	--index-section-boundary : clamp(143.5px, calc(19.1333vw + min(0px, calc(-12.2493vw + 91.8696px))), 191px);
	padding-top : 16.5%;
}

main > article:not([class]) > section.product > figure { position : relative; grid-row : 1; margin : 0 auto; width : min(81.333vw, 61.0rem); }
main > article:not([class]) > section.product > ul { grid-row : 2; gap : .2rem; margin-top : clamp(3.2rem, 8vw, 6.0rem); }
main > article:not([class]) > section.product > h4 {
	grid-row : 3;
	margin : 0 0 clamp(1.3rem, calc(10.494vw - 6.57rem), 3.0rem) 0;
	font-size : clamp(1.3rem, 3.467vw, 2.6rem);
	line-height : 1;
	font-weight : 900;
	letter-spacing : 0;
	background-position : left calc(100% + clamp(.65rem, .933vw, .7rem));
}
main > article:not([class]) > section.product > p:not(:has(a)) {
	grid-row : 4;
	margin-top : 0;
	font-size : clamp(1.3rem, 3.467vw, 2.6rem);
	line-height : 2;
	letter-spacing : 0;
	width : min(64vw, 48.0rem);
	margin-right : auto;
	margin-left : 0;
}
main > article:not([class]) > section.product > p.cta {
	grid-row : 5;
}
main > article:not([class]) > :is(section.product, section.log, section.news, section.faq) > p.cta > a {
	width : clamp(20rem, min(53.333vw, calc(1052px - 86.9565vw)), 40rem);
	min-width : 0;
}

main > article:not([class]) > section.product > figure::after {
	position : absolute;
	top : -17.5%;
	right : -15.5%;
	aspect-ratio : 228 / 231;
	background : url("../images/accessories/illust_04.png") no-repeat center center / contain;
	pointer-events : none;
	content : "";
	width : min(30.4vw, 37.377%);
	z-index : 2;
}

main > article:not([class]) > section.product > figure > img,
main > article:not([class]) > section.product > figure > ul {
	margin-right : auto;
	margin-left : auto;
	width : 100%;
}

main > article:not([class]) > section.product > figure > img {
	display : block;
	margin : 0 auto;
}

	main > article:not([class]) > section.product > figure > ul {
	display : flex;
	flex-direction : row;
	justify-content : space-between;
	gap : clamp(.75rem, 2vw, 1.5rem);
	margin : min(4vw, 3.0rem) auto 0 auto;
	padding : 0;
}

main > article:not([class]) > section.product > figure > ul > li {
	opacity : 0.7;
	width : calc((100% - clamp(3.0rem, 8vw, 6.0rem)) / 5);
}

@media (hover : none) {
	main > article:not([class]) > section.product > figure > ul > li:active { opacity : 1; }
}
@media (hover : hover) {
	main > article:not([class]) > section.product > figure > ul > li:hover { opacity : 1; }
}

main > article:not([class]) > section.product > figure > ul button {
	display : block;
	width : 100%;
	height : auto;
}

main > article:not([class]) > section.product > figure > ul img {
	width : 100%;
	height : auto;
}

main > article:not([class]) > section.product > figure > figcaption {
	display : none;
}

main > article:not([class]) > section.product > ul {
	display : flex;
	flex-direction : row;
	justify-content : flex-end;
	margin-right : 0;
	margin-bottom : 0;
	margin-left : auto;
	padding : 0;
	width : 100%;
}

main > article:not([class]) > section.product > ul > li {
	display : none;
	width : min(100%, 54.667vw);
	max-width : 41.0rem;
}

main > article:not([class]) > section.product > ul > li.active {
	display : block;
}

main > article:not([class]) > section.product > ul img {
	width : 100%;
	height : auto;
}

@media (min-width : 912px) {
	main > article:not([class]) > section.product {
		grid-template-columns : 61fr 41fr;
		grid-template-rows : repeat(4, auto);
		column-gap : clamp(4.0rem, 5.556vw, 8.0rem);
		row-gap : 0;
		--index-section-boundary : clamp(154.6522px, calc(6.8841vw + 91.8696px), 191px);
		padding-top : 14.0rem;
	}
	main > article:not([class]) > section.product > figure {
		grid-column : 1;
		grid-row : 1 / 5;
		width : min(100%, 61.0rem);
	}
	main > article:not([class]) > section.product > figure::after {
		top : -14.0rem;
		right : -6.85rem;
		width : 22.8rem;
		height : 23.1rem;
	}
	main > article:not([class]) > section.product > figure > img,
	main > article:not([class]) > section.product > figure > ul,
	main > article:not([class]) > section.product > ul,
	main > article:not([class]) > section.product > h4,
	main > article:not([class]) > section.product > p:not(:has(a)),
	main > article:not([class]) > section.product > p.cta {
		width : 100%;
	}
	main > article:not([class]) > section.product > ul {
		grid-column : 2;
		grid-row : 1;
		margin-top : 0;
		margin-bottom : clamp(2.5rem, calc(2.273vw + .427rem), 3.7rem);
	}
	main > article:not([class]) > section.product > ul {
		justify-content : flex-start;
	}
	main > article:not([class]) > section.product > ul > li {
		width : 100%;
		max-width : 100%;
	}
	main > article:not([class]) > section.product > h4 {
		grid-column : 2;
		grid-row : 2;
		align-self : flex-start;
		background-position : left calc(100% + clamp(.7rem, calc(1.326vw - .508rem), 1.4rem));
		font-size : 2.0rem;
		line-height : 1;
	}
	main > article:not([class]) > section.product > p:not(:has(a)) {
		grid-column : 2;
		grid-row : 3;
		margin-top : 0;
		font-size : 2.0rem;
		line-height : 2;
		letter-spacing : 0;
		width : 100%;
	}
	main > article:not([class]) > section.product > p.cta {
		grid-column : 2;
		grid-row : 4;
	}
	main > article:not([class]) > section.product > p.cta > a {
		width : 100%;
		min-width : 0;
	}
	main > article:not([class]) > section.log > p.cta > a {
		width : 26.0rem;
	}
}

/* _______________________________________ index:log */

main > article:not([class]) > section.log {
	--log-slider-padding-top : clamp(3.0rem, min(8vw, calc(19.043rem - 17.391vw)), 6.0rem);
	--index-section-boundary : clamp(126px, calc(25.1333vw + min(0px, calc(-34.1913vw + 256.4348px))), 188.5px);
	position : relative;
	overflow : visible;
	padding : calc(clamp(8.0rem, calc(6.5rem + 4.0vw), 9.5rem) - (var(--log-slider-padding-top) - 2.0rem)) 0 max(0rem, min(11.867vw, calc(50.36rem - 55.28vw)));
	background : #f7f4ed;
}

main > article:not([class]) > section.log::before,
main > article:not([class]) > section.log::after {
	position : absolute;
	left : 0;
	pointer-events : none;
	background-repeat : no-repeat;
	background-position : center;
	background-size : 910px auto;
	content : "";
	width : 100%;
	z-index : 1;
}

main > article:not([class]) > section.log::before {
	top : calc(-9.0rem + 1px);
	background-image : url("../images/accessories/section-top.png");
	height : 9.0rem;
}

main > article:not([class]) > section.log::after {
	bottom : calc(-9.1rem + 1px);
	background-image : url("../images/accessories/section-bottom.png");
	height : 9.1rem;
}

main > article:not([class]) > section.log h4 {
	position : relative;
	margin : 0 auto;
	width : 90%;
	z-index : 2;
}
main > article:not([class]) > section.log h4::after {
	position : absolute;
	right : -17vw;
	bottom : 0;
	aspect-ratio : 360 / 147;
	background : url("../images/accessories/illust_05.png") no-repeat center / contain;
	pointer-events : none;
	content : "";
	width : clamp(19.0rem, 48vw, 36.0rem);
	height : auto;
	z-index : 2;
}

main > article:not([class]) > section.log > p.cta {
	display : flex;
	position : relative;
	justify-content : center;
	margin-right : auto;
	margin-left : auto;
	width : 90%;
	max-width : 1440px;
	z-index : 2;
}


@media (min-width : 912px) {
	main > article:not([class]) > section.log {
		--log-slider-padding-top : 3.2rem;
		--index-section-boundary : clamp(126px, calc(-9.0580vw + 256.4348px), 173.8261px);
		overflow : visible;
		isolation : isolate;
		margin-right : calc(50% - 50vw);
		margin-left : calc(50% - 50vw);
		padding : 0 0 0;
		box-shadow : none;
		clip-path : none;
		width : auto;
	}

	main > article:not([class]) > section.log::before,
	main > article:not([class]) > section.log::after {
		display : block;
		left : 50%;
		transform : translateX(-50%);
		width : 100vw;
	}

	main > article:not([class]) > section.log::before {
		top : calc(-15.3rem + 1px);
		background-image : url("../images/accessories/section-top_large.png");
		background-size : max(1920px, 100vw) auto;
		height : 15.3rem;
	}

	main > article:not([class]) > section.log::after {
		bottom : calc(-15.2rem + 1px);
		background-image : url("../images/accessories/section-bottom_large.png");
		background-size : max(1920px, 100vw) auto;
		height : 15.2rem;
	}

	main > article:not([class]) > section.log h4 {
		margin : -5.2rem auto 0;
		width : min(90%, 110.0rem);
	}
	main > article:not([class]) > section.log h4::after {
		right : 0;
		bottom : clamp(-2.3rem, calc(4.36vw - 6.28rem), 0rem);
		width : 36.0rem;
		height : auto;
	}
}

/* ________________________ Log card family exterior */

:is(
	main > article:not([class]) > section.log > .card-slider > article,
	article.log.archive > section > article,
	article.log.detail > section:last-of-type > article
) {
	display : flex;
	overflow : hidden;
	position : relative;
	flex-direction : column;
	margin : 0;
	--log-card-tag-bottom-inset : clamp(.4rem, 1.067vw, .8rem);
	border : 0;
	border-radius : 10px;
	background : #ffffff;
	box-shadow : none;
}

:is(
	main > article:not([class]) > section.log > .card-slider > article,
	article.log.archive > section > article,
	article.log.detail > section:last-of-type > article
)::after {
	position : absolute;
	inset : 0;
	pointer-events : none;
	border : 1px solid #333333;
	border-radius : inherit;
	box-sizing : border-box;
	content : "";
	z-index : 2;
}

:is(
	main > article:not([class]) > section.log > .card-slider > article,
	article.log.archive > section > article,
	article.log.detail > section:last-of-type > article
) > a:first-child > img {
	display : block;
	margin : 0;
	aspect-ratio : 3 / 2;
	object-fit : cover;
	object-position : center;
	vertical-align : middle;
	width : 100%;
	height : auto;
}

:is(
	main > article:not([class]) > section.log > .card-slider > article,
	article.log.archive > section > article,
	article.log.detail > section:last-of-type > article
) > a:first-child {
	display : block;
	flex : 0 0 auto;
	padding : 0;
	width : 100%;
	line-height : 0;
}

main > article:not([class]) > section.log > .card-slider > article {
	align-self : flex-start;
}

main > article:not([class]) > section.log > .card-slider > article > a:not(:first-child) {
	display : flex;
	flex-direction : column;
	padding : clamp(1.9rem, min(5.067vw, calc(8.458rem - 6.211vw)), 3.8rem)
		clamp(2.0rem, min(5.333vw, calc(10.988rem - 9.317vw)), 4.0rem) 0;
}

main > article:not([class]) > section.log > .card-slider > article > a:not(:first-child) > time {
	display : block;
	margin-bottom : clamp(.35rem, .933vw, .7rem);
	color : #9f9f9f;
	font-family : var(--font-avenir);
	font-size : clamp(1.2rem, min(3.2vw, calc(7.058rem - 6.211vw)), 2.4rem);
	font-style : italic;
	font-weight : 900;
	line-height : clamp(1.2rem, min(3.2vw, calc(7.058rem - 6.211vw)), 2.4rem);
	letter-spacing : clamp(0px, calc(.348vw - 2.609px), .56px);
}

main > article:not([class]) > section.log > .card-slider > article > a:not(:first-child) > h5 {
	margin-bottom : clamp(.4rem, min(2vw, calc(6.624rem - 6.832vw)), 1.5rem);
	font-family : var(--font-base);
	font-size : clamp(1.4rem, min(3.733vw, calc(6.527rem - 4.969vw)), 2.8rem);
	font-style : normal;
	font-weight : 900;
	line-height : 1.5;
	letter-spacing : 0;
}

main > article:not([class]) > section.log > .card-slider > article > ul {
	display : flex;
	flex-direction : row;
	flex-wrap : wrap;
	gap : .4rem .8rem;
	padding : 0 clamp(2.0rem, min(5.333vw, calc(10.988rem - 9.317vw)), 4.0rem)
		calc(clamp(2.25rem, min(6vw, calc(13.817rem - 12.422vw)), 4.5rem) + var(--log-card-tag-bottom-inset));
	width : 100%;
}

main > article:not([class]) > section.log > .card-slider > article > ul > li > a {
	font-family : var(--font-base);
	font-size : clamp(1.1rem, min(2.933vw, calc(6.858rem - 6.211vw)), 2.2rem);
	font-style : normal;
	font-weight : 900;
	line-height : clamp(1.1rem, min(2.933vw, calc(6.858rem - 6.211vw)), 2.2rem);
	letter-spacing : clamp(0px, calc(.298vw - 2.236px), .48px);
}

:where(article.log.archive, article.log.detail > section:last-of-type) {
	--log-card-tag-bottom-inset : clamp(.4rem, 1.067vw, .8rem);
	--log-card-copy-padding : 1.5rem 1.5rem 0;
	--log-card-tag-padding : 0 1.5rem calc(1.5rem + var(--log-card-tag-bottom-inset));
	--log-card-date-size : clamp(1.1rem, 2.933vw, 2.2rem);
	--log-card-date-line-height : 1.8;
	--log-card-date-letter-spacing : normal;
	--log-card-title-size : clamp(1.3rem, 3.467vw, 2.6rem);
	--log-card-title-line-height : 1.615;
	--log-card-tag-size : clamp(1.1rem, 2.933vw, 2.2rem);
	--log-card-tag-line-height : 1.8;
	--log-card-tag-letter-spacing : normal;
	--log-card-content-grow : 1;
}

article.log.archive {
	--log-card-copy-padding : min(3.2vw, calc(1.4685rem + 1.242vw)) min(3.2vw, calc(1.4685rem + 1.242vw)) 0;
	--log-card-tag-padding : 0 min(3.2vw, clamp(2rem, calc(42.63px - 2.484vw), 2.4rem)) calc(min(3.2vw, clamp(2rem, calc(42.63px - 2.484vw), 2.4rem)) + var(--log-card-tag-bottom-inset));
	--log-card-date-size : min(clamp(1.1rem, 2.933vw, 2.2rem), clamp(1.2rem, calc(68.3px - 6.173vw), 2.2rem));
	--log-card-date-line-height : min(clamp(1.2rem, 3.2vw, 2.4rem), clamp(1.4rem, calc(70.3px - 6.173vw), 2.4rem));
	--log-card-date-letter-spacing : .04em;
	--log-card-title-size : min(clamp(1.3rem, 3.467vw, 2.6rem), clamp(1.6rem, calc(72.3px - 6.173vw), 2.6rem));
	--log-card-title-line-height : min(1.615em, clamp(2.4rem, calc(125.33px - 11.111vw), 4.2rem));
	--log-card-tag-size : min(clamp(1.1rem, 2.933vw, 2.2rem), clamp(1rem, calc(77.56px - 7.407vw), 2.2rem));
	--log-card-tag-line-height : min(clamp(1.1rem, 2.933vw, 2.2rem), clamp(1rem, calc(77.56px - 7.407vw), 2.2rem));
	--log-card-tag-letter-spacing : .04em;
	--log-card-content-grow : 0;
	--log-heading-art-height : clamp(4.2rem, 9.733vw, 7.3rem);
	--log-heading-art-gap : clamp(.55rem, 1.467vw, 1.1rem);
}

article.log.detail > section:last-of-type {
	--log-card-copy-padding : 2.4rem 2.4rem 0;
	--log-card-tag-padding : 0 2.4rem calc(2.4rem + var(--log-card-tag-bottom-inset));
	--log-card-date-size : clamp(1.1rem, 2.933vw, 2.2rem);
	--log-card-date-line-height : 1.091;
	--log-card-date-letter-spacing : normal;
	--log-card-title-size : clamp(1.3rem, 3.467vw, 2.6rem);
	--log-card-title-line-height : 1.615;
	--log-card-tag-size : clamp(1.1rem, 2.933vw, 2.2rem);
	--log-card-tag-line-height : 1;
	--log-card-tag-letter-spacing : normal;
	--log-card-content-grow : 0;
}

:is(
	article.log.archive > section > article,
	article.log.detail > section:last-of-type > article
) > a:not(:first-child) {
	display : flex;
	flex-direction : column;
	flex-grow : var(--log-card-content-grow);
	padding : var(--log-card-copy-padding);
}

:is(
	article.log.archive > section > article,
	article.log.detail > section:last-of-type > article
) > a:not(:first-child) > time {
	display : block;
	margin-bottom : .8rem;
	color : #9F9F9F;
	font-size : var(--log-card-date-size);
	line-height : var(--log-card-date-line-height);
	letter-spacing : var(--log-card-date-letter-spacing);
}

:is(
	article.log.archive > section > article,
	article.log.detail > section:last-of-type > article
) > a:not(:first-child) > h5 {
	flex-grow : var(--log-card-content-grow);
	margin-bottom : 1.5rem;
	font-size : var(--log-card-title-size);
	font-weight : 900;
	line-height : var(--log-card-title-line-height);
}

:is(
	article.log.archive > section > article,
	article.log.detail > section:last-of-type > article
) > ul {
	display : flex;
	flex-direction : row;
	flex-wrap : wrap;
	gap : 0.2rem 0.8rem;
	padding : var(--log-card-tag-padding);
	width : 100%;
}

article.log.archive > section > article > ul > li,
article.log.detail > section:last-of-type > article > ul > li {
	line-height : var(--log-card-tag-line-height);
}

:is(
	article.log.archive > section > article,
	article.log.detail > section:last-of-type > article
) > ul > li > a {
	font-size : var(--log-card-tag-size);
	line-height : var(--log-card-tag-line-height);
	letter-spacing : var(--log-card-tag-letter-spacing);
}

article.log.archive > h3 {
	background-size : auto var(--log-heading-art-height);
	padding-top : calc(var(--log-heading-art-height) + var(--log-heading-art-gap));
	margin-bottom : min(calc(7.6vw + 3px), calc(78.6px - 2.48vw));
	line-height : 1;
}

article.log.archive:has(> p) > h3 {
	margin-bottom : min(calc(5.067vw + 3px), calc(68.9px - 3.73vw));
}

article.log.archive > section,
article.log.detail > section:last-of-type {
	display : grid;
	align-items : start;
	grid-template-columns : repeat(2, minmax(0, 1fr));
	column-gap : max(clamp(1.5rem, 4vw, 3.0rem), calc(-1.63rem + 6.173vw));
	row-gap : clamp(2.5rem, calc(3.7px + 6.173vw), 6.0rem);
}

article.log.archive > section {
	align-items : start;
	margin-inline : auto;
}

article.log.archive > section > article {
	width : 100%;
	max-width : 34rem;
	justify-self : center;
}

article.log.archive > section > h4,
article.log.detail > section:last-of-type > h4,
article.log.detail > section:last-of-type > p {
	grid-column : 1 / -1;
}

@media (min-width : 912px) {
	:is(
		main > article:not([class]) > section.log > .card-slider > article,
		article.log.archive > section > article,
		article.log.detail > section:last-of-type > article
	) {
		--log-card-tag-bottom-inset : 0px;
	}
	:where(article.log.archive, article.log.detail > section:last-of-type) {
		--log-card-tag-bottom-inset : 0px;
	}
	:is(
		main > article:not([class]) > section.log > .card-slider > article,
		article.log.archive > section > article,
		article.log.detail > section:last-of-type > article
	)::after {
		border-width : 2px;
	}
	main > article:not([class]) > section.log > .card-slider > article > a:not(:first-child) {
		padding : 2.8rem 2.5rem 0;
	}
	main > article:not([class]) > section.log > .card-slider > article > a:not(:first-child) > time {
		margin-bottom : .8rem;
		font-size : 1.4rem;
		line-height : 1.4rem;
		letter-spacing : .04em;
	}
	main > article:not([class]) > section.log > .card-slider > article > a:not(:first-child) > h5 {
		margin-bottom : .4rem;
		font-family : var(--font-base);
		font-size : 2.0rem;
		font-style : normal;
		line-height : 3.0rem;
	}
	main > article:not([class]) > section.log > .card-slider > article > ul {
		padding : 0 2.5rem 2.5rem;
	}
	main > article:not([class]) > section.log > .card-slider > article > ul > li > a {
		font-size : 1.2rem;
		line-height : 1.2rem;
		letter-spacing : .04em;
	}
	article.log.archive {
		--log-card-copy-padding : 2.6rem 2.6rem 0;
		--log-card-tag-padding : 0 2.6rem 2.6rem;
		--log-card-date-size : clamp(1.2rem, 0.855rem + 0.379vw, 1.4rem);
		--log-card-date-line-height : 1.4rem;
		--log-card-title-size : clamp(1.6rem, 0.909rem + 0.758vw, 2rem);
	--log-card-title-line-height : 1.5;
		--log-card-tag-size : clamp(1rem, 0.655rem + 0.379vw, 1.2rem);
		--log-card-tag-line-height : clamp(1rem, 0.655rem + 0.379vw, 1.2rem);
	}
	article.log.archive > h3 {
		margin-bottom : 5.6rem;
	}
	article.log.archive:has(> p) > h3 {
		margin-bottom : 3.5rem;
	}
	article.log.detail > section:last-of-type {
		--log-card-copy-padding : 2rem 2rem 0;
		--log-card-tag-padding : 0 2rem 2rem;
		--log-card-date-size : clamp(1.2rem, 0.855rem + 0.379vw, 1.4rem);
		--log-card-date-line-height : 1;
		--log-card-title-size : clamp(1.6rem, 0.909rem + 0.758vw, 2rem);
		--log-card-title-line-height : 1.5;
		--log-card-tag-size : 1.2rem;
		--log-card-tag-line-height : 1.2rem;
	}
	article.log.archive > section,
	article.log.detail > section:last-of-type {
		column-gap : 4.0rem;
		row-gap : 6.0rem;
	}
	article.log.archive > section {
		grid-template-columns : repeat(auto-fit, minmax(28rem, 1fr));
		max-width : none;
	}
	article.log.detail > section:last-of-type {
		grid-template-columns : repeat(3, minmax(0, 1fr));
	}
	article.log.detail > section:last-of-type > article {
		width : 100%;
		max-width : 34rem;
		justify-self : center;
	}
}

/* ________________________ Log tag archive label */

article.log.archive > p {
	display : flex;
	justify-content : center;
	margin : 0 auto clamp(3rem, 8.267vw, 6.2rem);
	width : 100%;
}

article.log.archive > p > a {
	display : inline-block;
	padding : min(1.8vw, clamp(.9rem, calc(34.46px - 2.795vw), 1.35rem)) 1.6rem;
	background : #ffffff;
	color : #5786A3;
	font-size : min(3.6vw, clamp(1.8rem, calc(69px - 5.59vw), 2.7rem));
	line-height : 1;
	text-align : center;
	width : min(40vw, clamp(20rem, calc(76.6rem - 62.1vw), 30rem));
	letter-spacing : .04em;
}

@media (min-width : 912px) {
	article.log.archive > p {
		margin-bottom : 6.6rem;
	}
	article.log.archive > p > a {
		padding-block : 0.9rem;
		font-size : 1.8rem;
		width : 20rem;
	}
}

/* _______________________________________ index:faq */

main > article:not([class]) > section.faq {
	position : relative;
	--index-faq-summary-font-size : clamp(1.4rem, min(3.733vw, calc(55.95px - 3.727vw)), 2.8rem);
	--index-faq-summary-line-height : calc(var(--index-faq-summary-font-size) * 1.5);
	--index-faq-summary-min-height : clamp(5.1rem, min(13.6vw, calc(232.6px - 17.39vw)), 10.2rem);
	--faq-summary-padding-block : calc((var(--index-faq-summary-min-height) - var(--index-faq-summary-line-height) - 2px) / 2);
	--index-faq-text-column : min(11.6vw, clamp(7.2rem, calc(15.6875rem - 9.317vw), 8.7rem));
	--index-section-boundary : clamp(-75px, calc(18.4667vw + min(0px, calc(-49.4087vw + 370.5652px))), 138.5px);
	padding-top : max(0rem, calc(7.5% - clamp(1.0rem, 2.667vw, 2.0rem)));
}

main > article:not([class]) > section.faq details summary {
	min-height : var(--index-faq-summary-min-height);
	padding-right : calc(var(--faq-toggle-inset) + var(--faq-toggle-width) + clamp(0.8rem, 2vw, 1.6rem));
	padding-left : var(--index-faq-text-column);
	padding-top : var(--faq-summary-padding-block);
	padding-bottom : var(--faq-summary-padding-block);
	font-size : var(--index-faq-summary-font-size);
	line-height : var(--index-faq-summary-line-height);
}

main > article:not([class]) > section.faq details[open] > p::before {
	top : calc(clamp(1.6rem, 1.088rem + 1.365vw, 2.4rem) + 0.5lh);
	transform : translateY(-50%);
}

main > article:not([class]) > section.faq > h4 {
	--faq-heading-art-height : clamp(2.625rem, min(12.333vw, calc(183.33px - 12.112vw)), 9.25rem);
	--faq-heading-spacing-extra : clamp(0px, max(calc(2.213vw - 6.4px), calc(4.534vw - 23.805px)), 17.5px);
	position : relative;
	background-size : auto var(--faq-heading-art-height);
	background-position : clamp(-5px, -0.667vw, -2.5px) calc(100% - 6px);
	font-size : clamp(1.3rem, min(3.467vw, calc(53.95px - 3.727vw)), 2.6rem);
	font-weight : 900;
	line-height : clamp(1.3rem, min(3.467vw, calc(53.95px - 3.727vw)), 2.6rem);
	letter-spacing : 0;
	padding-bottom : calc(var(--faq-heading-art-height) + 1.1rem + var(--faq-heading-spacing-extra));
	margin-bottom : clamp(1.5rem, 4vw, 3.3rem);
}

main > article:not([class]) > section.faq details {
	width : min(89.333vw, 110rem);
	max-width : 100%;
}

main > article:not([class]) > section.faq h4::after {
	display : none;
	position : absolute;
	right : 0;
	bottom : 0;
	background : url("../images/accessories/illust_06.png") no-repeat center / contain;
	pointer-events : none;
	content : "";
	width : min(33.067vw, 24.8rem);
	height : min(32.667vw, 24.5rem);
	z-index : 4;
}

main > article:not([class]) > section.faq details {
	margin-bottom : clamp(2.5rem, 6.667vw, 5.0rem);
}

main > article:not([class]) > section.faq details[open] > p {
	padding-bottom : 0;
	padding-left : var(--index-faq-text-column);
}

article > section.faq > p.cta {
	display : flex;
	justify-content : center;
	margin-right : auto;
	margin-left : auto;
	width : 90%;
}

@media (min-width : 912px) {
	main > article:not([class]) > section.faq {
		--index-faq-summary-font-size : 2.2rem;
		--index-faq-summary-line-height : 3.3rem;
		--index-faq-summary-min-height : 7.4rem;
		--faq-summary-padding-block : calc((var(--index-faq-summary-min-height) - var(--index-faq-summary-line-height) - 2px) / 2);
		--index-section-boundary : clamp(-75px, calc(-30.9420vw + 370.5652px), 88.3739px);
		margin-right : auto;
		margin-left : auto;
		padding-top : 12.0rem;
	}
	main > article:not([class]) > section.faq details {
		margin-bottom : 3.0rem;
	}
	article > section.faq > p.cta {
		justify-content : flex-end;
		width : 100%;
	}
}

@media (min-width : 912px) {
	main > article:not([class]) > section.faq > h4 {
		--faq-heading-art-height : 7.3rem;
		--faq-heading-spacing-extra : 1.75rem;
		background-position : calc(0% - 5px) calc(100% - 6px);
		font-size : 2rem;
		line-height : 2rem;
	}
	main > article:not([class]) > section.faq h4::after {
		display : block;
		bottom : -2.1rem;
	}
	main > article:not([class]) > section.faq details {
		width : 100%;
	}
	main > article:not([class]) > section.faq > p.cta > a {
		width : 26rem;
	}
}


/* ===============================================
	about
================================================== */

article.about {
	overflow : visible;
	width : 100%;
	max-width : 1440px;
}

/* _______________________________________ about:headline */

article.about > h3 {
	overflow : hidden;
	margin : clamp(1.8rem, calc(11.8vw - 5.26rem), 5.5rem) auto clamp(4.0rem, 2.308rem + 4.511vw, 8.8rem);
	padding : 0;
	background : url("../images/headline/about.webp") no-repeat left 5vw center / auto 100%;
	text-indent : 100%;
	white-space : nowrap;
	width : 100%;
	max-width : 100%;
	height : min(83.47vw, calc(110.45rem - 64.2vw));
}

@media (min-width : 912px) {
	article.about > h3 {
		background-position : center center;
		background-size : contain;
		margin-top : 5.5rem;
		max-width : 109.4rem;
		height : auto;
		aspect-ratio : 1094 / 623;
	}
}

/* _______________________________________ about:sections */

article.about > section {
	margin : 0 auto clamp(5.6rem, 3.128rem + 6.592vw, 12.6rem);
	padding : 0 5%;
	width : 100%;
}

@media (min-width : 912px) {
	article.about > section {
		padding : 0;
		max-width : 106.0rem;
	}
}

/* _______________________________________ about:introduction */

article.about > section:first-of-type {
	--about-intro-content-width : clamp(33.5rem, min(89.333vw, calc(62.342rem + 6.211vw)), 68.0rem);
	--illust09-width : clamp(var(--about-intro-content-width), calc(var(--about-intro-content-width) + 80vw - 600px), 80rem);
	--about-intro-reserve-base : clamp(clamp(35.0rem, 94vw, 48.0rem), calc(89.5vw - 19.125rem), 61.6rem);
	--about-intro-copy-gap : 2.0rem;
	--about-intro-art-gap : 2.4rem;
	position : relative;
	margin-bottom : clamp(0rem, min(calc(1.067vw - 0.2rem), calc(3.395rem - 3.727vw)), 0.6rem);
	/* PNG alpha top is y=13/1398; reserve the scaled canvas-to-alpha distance and the 24px text/art gap, minus the last paragraph margin. */
	padding-bottom : max(var(--about-intro-reserve-base), calc(var(--illust09-width) * 1.03358209 + var(--about-intro-art-gap) - var(--about-intro-copy-gap)));
	background : url("../images/accessories/illust_09.png") no-repeat center bottom / var(--illust09-width) auto;
}

article.about > section:first-of-type > h4 {
	display : none;
}

article.about > section:first-of-type > p {
	margin-right : auto;
	margin-bottom : var(--about-intro-copy-gap);
	margin-left : auto;
	width : var(--about-intro-content-width);
	font-size : clamp(1.4rem, 3.733vw, 2.8rem);
	line-height : 1.93;
}

@media (min-width : 912px) {
	article.about > section:first-of-type {
		display : block;
		margin-right : max(0rem, calc((100% - 109.4rem) / 2));
		margin-bottom : clamp(5.0rem, max(31.624vw - 23.841rem, 38.686vw - 31.108rem), 24.6rem);
		margin-left : auto;
		padding-top : 0;
		padding-right : min(32.0rem, 29.250vw);
		padding-bottom : 0;
		padding-left : 0;
		background-image : url("../images/accessories/illust_08.png");
		background-position : right top;
		background-size : min(26.0rem, 23.766vw) auto;
		width : min(101.9rem, 93.144%);
		max-width : 101.9rem;
		min-height : min(80.4rem, 73.492vw);
	}

	article.about > section:first-of-type > p {
		margin-right : auto;
		margin-left : 0;
		max-width : 68.0rem;
		font-size : 2.4rem;
		line-height : 2;
		text-align : left;
	}
}

/* _______________________________________ about:philosophy */

article.about > section#philosophy {
	position : relative;
	margin-bottom : clamp(9.0rem, 24vw, 18.0rem);
	padding-bottom : calc(min(195.12vw, 146.3rem) + clamp(10.0rem, min(26.667vw, calc(43.148rem - 30.864vw)), 20.0rem));
	background : url("../images/about/leadcopy.webp") no-repeat center bottom / min(94.667vw, 71.0rem) auto;
}

article.about > section#philosophy::after {
	display : block;
	margin-top : clamp(2.5rem, 6.667vw, 5.0rem);
	background : url("../images/accessories/illust_11.png") no-repeat left top / contain;
	content : "";
	width : 48vw;
	max-width : 41.0rem;
	aspect-ratio : 960 / 824;
}

article.about > section#philosophy > h4 {
	margin-bottom : clamp(1.5rem, min(4vw, calc(5.795rem - 3.727vw)), 3.0rem);
	font-size : clamp(2.0rem, 5.333vw, 4.0rem);
	font-weight : 900;
	line-height : clamp(2.0rem, max(4vw, calc(-2.522rem + 8.696vw)), 5.4rem);
}

article.about > section#philosophy > h4 + p {
	margin-bottom : clamp(2.5rem, min(6.667vw, calc(7.329rem - 3.106vw)), 5.0rem);
	font-size : clamp(1.3rem, 3.467vw, 2.6rem);
	line-height : 1.77;
}

article.about > section#philosophy ol li {
	display : flex;
	flex-direction : column;
	align-items : flex-start;
	width : 100%;
}

article.about > section#philosophy ol li > p:last-of-type {
	margin-top : 1.2rem;
	color : #000000;
	font-size : clamp(1.3rem, 3.467vw, 2.6rem);
	font-weight : 900;
	line-height : 1.77;
}

@media (min-width : 912px) {
	article.about > section#philosophy {
		display : flex;
		flex-direction : column;
		align-items : flex-end;
		margin-bottom : 18.0rem;
		margin-right : auto;
		margin-left : auto;
		padding-right : clamp(0rem, 43.125vw - 48.3rem, 13.8rem);
		padding-bottom : calc(clamp(57.0rem, -24.2rem + 89.0vw, 104.0rem) + clamp(9.4rem, 10.31vw, 14.8rem));
		background : url("../images/accessories/illust_10.png") no-repeat calc(min(100vw - clamp(6rem, 26.25vw - 23.4rem, 14.4rem), 129.6rem) - clamp(0rem, 43.125vw - 48.3rem, 13.8rem) - clamp(57rem, 8.769rem + 52.885vw, 68rem) - clamp(26.6rem, -14.615rem + 45.192vw, 36rem) - clamp(1.6rem, 0.47rem + 1.063vw, 2rem)) top / clamp(26.6rem, -14.615rem + 45.192vw, 36rem) auto;
		width : min(calc(100% - clamp(6rem, 26.25vw - 23.4rem, 14.4rem)), 129.6rem);
		max-width : 129.6rem;
		min-height : clamp(70.49rem, 23.66rem + 51.34vw, 97.6rem);
	}

	article.about > section#philosophy::before {
		display : block;
		position : absolute;
		left : 50%;
		right : auto;
		bottom : 0;
		pointer-events : none;
		background : url("../images/about/leadcopy_large.webp") no-repeat center / contain;
		content : "";
		transform : translateX(-50%);
		width : clamp(71.0rem, -30.2rem + 111.0vw, 129.6rem);
		aspect-ratio : 1296 / 1040;
	}

	article.about > section#philosophy::after {
		display : none;
	}

	article.about > section#philosophy > * {
		width : clamp(57.0rem, 8.769rem + 52.885vw, 68.0rem);
		max-width : 68.0rem;
	}
	article.about > section#philosophy > h4 {
		font-size : 4.0rem;
		line-height : 5.4rem;
		margin-bottom : 2.4rem;
	}
	article.about > section#philosophy > h4 + p,
	article.about > section#philosophy ol li > p:last-of-type {
		font-size : 2.0rem;
		line-height : 1.75;
	}
	article.about > section#philosophy > h4 + p {
		margin-bottom : 4.5rem;
	}
	article.about > section#philosophy ol {
		gap : 4.0rem;
	}
	article.about > section#philosophy ol li > p:first-of-type {
		font-size : 3.5rem;
	}
}

/* _______________________________________ about:features */

article.about > section#features {
	position : relative;
	margin-bottom : clamp(6.0rem, 16vw, 12.0rem);
}

article.about > section#features > h4 {
	margin-right : auto;
	margin-bottom : clamp(1.5rem, min(4vw, calc(5.795rem - 3.727vw)), 3.0rem);
	margin-left : auto;
	font-size : clamp(2.0rem, 5.333vw, 4.0rem);
	font-weight : 900;
	line-height : clamp(2.0rem, max(4vw, calc(-2.522rem + 8.696vw)), 5.4rem);
	text-align : center;
}

article.about > section#features > h4 + p {
	margin-right : auto;
	margin-bottom : clamp(3.2rem, 2.071rem + 3.008vw, 6.4rem);
	margin-left : auto;
	width : clamp(33.5rem, min(89.333vw, calc(62.342rem + 6.211vw)), 68.0rem);
	font-size : clamp(1.3rem, 3.467vw, 2.6rem);
	line-height : 1.77;
	text-align : center;
}

article.about > section#features > figure {
	display : flex;
	flex-direction : column;
	margin : 0 auto clamp(2.0rem, min(12vw, calc(36.02rem - 36.03vw)), 9.0rem);
	width : 93.333%;
	max-width : 63.0rem;
}

article.about > section#features > figure:last-of-type {
	margin-bottom : 0;
}

article.about > section#features > figure img {
	display : block;
	object-fit : cover;
	width : 100%;
	height : auto;
	aspect-ratio : 630 / 424;
}

article.about > section#features > figure figcaption {
	padding : clamp(1.0rem, min(5.3vw, calc(11.33rem - 9.8vw)), 3.98rem) 0 0;
}

article.about > section#features > figure figcaption h5 {
	margin-bottom : clamp(0.8rem, min(2.133vw, calc(4.395rem - 3.727vw)), 1.6rem);
	font-size : clamp(1.6rem, 4.267vw, 3.2rem);
	font-weight : 900;
	line-height : clamp(2.25rem, 6vw, 4.5rem);
}

article.about > section#features > figure figcaption p {
	font-size : clamp(1.2rem, 3.2vw, 2.4rem);
	line-height : 1.75;
}

article.about > section#features > figure:nth-of-type(n + 2) figcaption p {
	margin-right : auto;
	margin-left : auto;
	width : min(100%, 82.4vw);
	max-width : 61.8rem;
}

@media (min-width : 912px) {
	article.about > section#features {
		display : grid;
		grid-template-columns : repeat(2, minmax(0, 42.8rem));
		justify-content : center;
		column-gap : clamp(4.5rem, 6.25vw, 9.0rem);
		row-gap : 0;
		width : clamp(71.0rem, -30.2rem + 111.0vw, 129.6rem);
		max-width : 129.6rem;
		margin-bottom : clamp(12.0rem, calc(5.682vw + 6.818rem), 15.0rem);
	}

	article.about > section#features > h4,
	article.about > section#features > h4 + p {
		grid-column : 1 / -1;
		justify-self : center;
		width : min(100%, 68.0rem);
	}

	article.about > section#features > h4 {
		margin-bottom : 2.4rem;
		font-size : 4.0rem;
		line-height : 5.4rem;
	}

	article.about > section#features > h4 + p {
		margin-bottom : clamp(3.2rem, 0.436rem + 3.03vw, 4.8rem);
		font-size : 2.0rem;
		line-height : 1.75;
	}

	article.about > section#features > figure {
		margin : 0 0 clamp(3.2rem, 0.436rem + 3.03vw, 4.8rem);
		width : 100%;
		max-width : 42.8rem;
	}

	article.about > section#features > figure:nth-of-type(-n + 2) {
		margin-bottom : clamp(3.2rem, calc(12.8vw - 8.48rem), 10.0rem);
	}

	article.about > section#features > figure:nth-of-type(n + 3) {
		margin-bottom : 0;
	}

	article.about > section#features > figure figcaption h5 {
		font-size : 2.8rem;
		line-height : 4.5rem;
		margin-bottom : 1.0rem;
	}

	article.about > section#features > figure figcaption {
		padding-top : 2.4rem;
	}

	article.about > section#features > figure figcaption p {
		margin-right : 0;
		margin-left : 0;
		width : 100%;
		max-width : none;
		font-size : 1.6rem;
		line-height : 1.75;
	}
}

/* _______________________________________ about:backnumber */

article.about > section.backnumber {
	position : relative;
	margin : 0 0 clamp(5.5rem, 14.667vw, 11.0rem);
	padding : clamp(5.0rem, 13.333vw, 10.0rem) 0 clamp(6.0rem, 16vw, 12.0rem);
	background : #F4F2EB;
	box-shadow : 0 0 0 100vmax #F4F2EB;
	clip-path : inset(0 -100vmax);
	width : 100%;
	max-width : none;
}

article.about > section.backnumber > h4 {
	display : block;
	margin : 0 auto clamp(3.0rem, 8vw, 6.0rem);
	padding : 0 10%;
	font-size : clamp(2.0rem, 5.333vw, 4.0rem);
	font-weight : 900;
	line-height : clamp(2.0rem, 5.333vw, 4.0rem);
	text-align : left;
	width : 100%;
	max-width : 100.0rem;
}

article.about > section.backnumber::before {
	position : absolute;
	top : var(--backnumber-dog-top, clamp(13.2rem, 11.859rem + 3.577vw, 17.0rem));
	left : var(--backnumber-dog-left, calc(10% + min(76vw, 57.0rem) - 21.0rem));
	right : auto;
	z-index : 10;
	pointer-events : none;
	transform : translateY(clamp(.4rem, 1.067vw, .8rem));
	background : url("../images/accessories/illust_12.png") no-repeat center / contain;
	content : "";
	width : min(33.333333vw, clamp(25.0rem, calc(11.9565rem + 17.3913vw), 27.8rem));
	height : min(12.666667vw, clamp(9.5rem, calc(4.8416rem + 6.21118vw), 10.5rem));
}

article.about > section.backnumber > .card-slider {
	padding : 0 10%;
	padding-bottom : clamp(3.25rem, 8.667vw, 6.5rem);
	gap : 0 clamp(1.5rem, 4vw, 3.0rem);
}

article.about > section.backnumber > .card-slider > figure {
	display : flex;
	flex : 0 0 min(76vw, 57.0rem);
	flex-direction : column;
	scroll-snap-align : center;
	border : none;
	border-radius : 1.6rem;
	background : #ffffff;
	box-shadow : 0 6px 0 0 #c9c9c9;
	min-height : clamp(45.4rem, 121.067vw, 90.8rem);
}

article.about > section.backnumber > .card-slider > figure > a:has(> img:only-child) {
	display : flex;
	align-items : flex-start;
	justify-content : center;
	padding : clamp(3.0rem, 8vw, 6.0rem) clamp(1.0rem, 2.667vw, 2.0rem) 0;
	width : 100%;
}

article.about > section.backnumber > .card-slider > figure img {
	display : block;
	object-fit : contain;
	width : clamp(12.0rem, 32vw, 24.0rem);
	max-width : none;
	height : clamp(16.0rem, 42.667vw, 32.0rem);
	max-height : none;
}

article.about > section.backnumber > .card-slider > figure figcaption {
	display : flex;
	flex-direction : column;
	flex-grow : 1;
	padding : clamp(2.4rem, 6.4vw, 4.8rem) clamp(2.25rem, 6vw, 4.5rem) clamp(3.0rem, 8vw, 6.0rem);
}

article.about > section.backnumber > .card-slider > figure figcaption h5 {
	margin-bottom : clamp(0.7rem, 1.867vw, 1.4rem);
	font-size : clamp(1.6rem, 4.267vw, 3.2rem);
	font-weight : 900;
	line-height : clamp(1.6rem, 4.267vw, 3.2rem);
}

article.about > section.backnumber > .card-slider > figure figcaption small {
	display : block;
	margin-bottom : clamp(1.5rem, 4vw, 3.0rem);
	color : #4D4D4D;
	font-size : clamp(1.1rem, 2.933vw, 2.2rem);
	font-weight : 900;
	line-height : clamp(1.1rem, 2.933vw, 2.2rem);
	letter-spacing : clamp(0px, calc(0.6832vw - 5.124px), 1.1px);
}

article.about > section.backnumber > .card-slider > figure figcaption p:not(:has(a)) {
	margin-bottom : clamp(2.0rem, 5.333vw, 4.0rem);
	font-size : clamp(1.1rem, 2.933vw, 2.2rem);
	line-height : clamp(1.95rem, 5.2vw, 3.9rem);
}

article.about > section.backnumber > .card-slider > figure figcaption p.cta {
	display : flex;
	justify-content : flex-end;
	margin-top : auto;
	width : 100%;
}

article.about > section.backnumber > .card-slider > figure figcaption p.cta > a {
	display : inline-flex;
	align-items : center;
	justify-content : space-between;
	overflow : visible;
	gap : 0;
	margin-top : 0;
	padding : 0;
	border : 0;
	border-bottom : 2px solid currentColor;
	background : transparent;
	color : #000000;
	font-size : min(3.2vw, clamp(2.0rem, calc(4.2634rem - 2.4845vw), 2.4rem));
	font-weight : 900;
	line-height : min(3.733333vw, clamp(2.0rem, calc(6.5267rem - 4.9689vw), 2.8rem));
	letter-spacing : normal;
	min-width : 0;
	width : min(27.066667vw, clamp(17.0rem, calc(35.6727rem - 20.4969vw), 20.3rem));
	max-width : none;
	height : min(5.333333vw, clamp(3.43086rem, calc(6.65125rem - 3.53503vw), 4.0rem));
}
article.about > section.backnumber > .card-slider > figure figcaption p.cta > a::before {
	display : none;
}
article.about > section.backnumber > .card-slider > figure figcaption p.cta > a::after {
	display : inline-block;
	align-self : auto;
	justify-content : initial;
	margin-left : 0;
	padding-left : 0;
	border-left : 0;
	background : url("../images/accessories/arrow.png") no-repeat center / contain;
	content : "";
	transform : translateX(0);
	transition : transform .25s ease;
	width : min(4.133333vw, clamp(2.6rem, calc(5.4292rem - 3.10559vw), 3.1rem));
	height : min(2.8vw, clamp(1.8rem, calc(3.4975rem - 1.86335vw), 2.1rem));
}

@media (hover : none) {
	article.about > section.backnumber > .card-slider > figure figcaption p.cta > a:active::after {
		transform : translateX(.8rem);
	}
}
@media (hover : hover) {
	article.about > section.backnumber > .card-slider > figure figcaption p.cta > a:hover::after {
		transform : translateX(.8rem);
	}
}

article.about > section.backnumber > nav > ul {
	display : flex;
	align-items : flex-end;
	justify-content : center;
	gap : 0 min(2.621vw, calc(4.5865rem - 3.494vw));
}
article.about > section.backnumber > nav > ul > li > button {
	display : flex;
	flex-direction : column;
	align-items : center;
	overflow : visible;
	font-family : var(--font-avenir);
	font-weight : 900;
	font-style : italic;
	padding : 0;
	border : none;
	background : transparent;
	text-indent : 0;
	white-space : nowrap;
	cursor : pointer;
	width : auto;
	height : auto;
}
article.about > section.backnumber > nav > ul > li > button > span:first-child {
	margin-bottom : min(1.4vw, calc(3.133rem - 2.778vw));
	color : #000000;
	font-size : min(3vw, calc(5.722rem - 4.63vw));
	line-height : min(3vw, calc(5.722rem - 4.63vw));
}
article.about > section.backnumber > nav > ul > li > button > span:last-child {
	display : flex;
	align-items : center;
	justify-content : center;
	border : clamp(1.5px, 0.4vw, 3px) solid #000000;
	border-radius : 50%;
	background : #FFFFBD;
	color : #000000;
	font-size : min(6vw, calc(11.444rem - 9.259vw));
	line-height : min(6vw, calc(11.444rem - 9.259vw));
	font-weight : 900;
	transition : background 0.3s ease, color 0.3s ease;
	width : min(10.045vw, calc(19.265rem - 15.642vw));
	height : min(10.045vw, calc(19.265rem - 15.642vw));
}
article.about > section.backnumber > nav > ul > li.is-active > button > span:last-child {
	background : #000000;
	color : #FFFFBD;
}

@media (min-width : 750px) {
	article.about > section.backnumber > nav > ul > li > button > span:last-child {
		border-width : clamp(2px, calc(7.658px - 0.621vw), 3px);
	}
}

@media (min-width : 912px) {
	article.about > section.backnumber {
		padding-bottom : 10.0rem;
		margin-bottom : 11.0rem;
	}

	article.about > section.backnumber::before {
		top : var(--backnumber-dog-top, clamp(11.8rem, 10.073rem + 1.894vw, 12.8rem));
		left : var(--backnumber-dog-left, calc((100% - min(90.0rem, 80vw)) / 2 + min(90.0rem, 80vw) - 31.0rem));
		right : auto;
		width : 27.8rem;
		height : 10.5rem;
	}

	article.about > section.backnumber > h4 {
		margin-bottom : 6.0rem;
		padding : 0;
		width : min(100.0rem, 80vw);
	}

	article.about > section.backnumber > .card-slider {
		padding : 0 calc((100vw - min(90.0rem, 80vw)) / 2);
		padding-bottom : 6.1rem;
		gap : 0 clamp(4.0rem, 4.514vw, 6.5rem);
	}
	article.about > section.backnumber > nav > ul {
		gap : 0 1.4rem;
	}
	article.about > section.backnumber > .card-slider > figure {
		display : grid;
		grid-template-columns : 24.0rem minmax(0, 48.0rem);
		align-items : stretch;
		justify-content : center;
		flex : 0 0 min(90.0rem, 80vw);
		column-gap : clamp(3.2rem, calc(4.545vw - 0.945rem), 5.6rem);
		padding-inline : clamp(2.0rem, calc(7.955vw - 5.255rem), 6.2rem);
		min-height : clamp(44.8rem, calc(7.197vw + 38.237rem), 48.6rem);
	}
	article.about > section.backnumber > .card-slider > figure > a:has(> img:only-child) {
		padding : clamp(3.0rem, calc(5.682vw - 2.182rem), 6.0rem) 0 0;
	}
	article.about > section.backnumber > .card-slider > figure img {
		width : 24.0rem;
		height : 32.0rem;
	}
	article.about > section.backnumber > .card-slider > figure figcaption {
		padding : clamp(3.0rem, calc(8.144vw - 4.427rem), 7.3rem) 0 clamp(3.0rem, calc(3.03vw + 0.237rem), 4.6rem);
	}
	article.about > section.backnumber > .card-slider > figure figcaption h5 {
		font-size : 3.2rem;
		line-height : 3.2rem;
	}
	article.about > section.backnumber > .card-slider > figure figcaption small {
		font-size : 2.2rem;
		line-height : 2.2rem;
	}
	article.about > section.backnumber > .card-slider > figure figcaption p:not(:has(a)) {
		font-size : 1.8rem;
		line-height : 3.5rem;
	}
	article.about > section.backnumber > .card-slider > figure figcaption p.cta > a {
		font-size : 2.0rem;
		line-height : 2.0rem;
		width : 17.0rem;
		height : 3.43086rem;
	}
	article.about > section.backnumber > .card-slider > figure figcaption p.cta > a::after {
		width : 2.6rem;
		height : 1.8rem;
	}

	article.about > section.backnumber > nav > ul > li > button > span:first-child {
		margin-bottom : 0.6rem;
		font-size : 1.5rem;
		line-height : 1.5rem;
	}

	article.about > section.backnumber > nav > ul > li > button > span:last-child {
		font-size : 3.0rem;
		line-height : 3.0rem;
		width : 5.0rem;
		height : 5.0rem;
	}
}

/* _______________________________________ about:activity */

article.about > section.activity {
	display : flex;
	flex-direction : column;
	align-items : center;
	margin-bottom : clamp(10.0rem, 26.667vw, 20.0rem);
}

article.about > section.activity > h4 {
	overflow : hidden;
	margin-bottom : clamp(4.0rem, 10.667vw, 8.0rem);
	background : url("../images/headline/activity.png") no-repeat center / contain;
	text-indent : 100%;
	white-space : nowrap;
	width : 100%;
	max-width : 50.3rem;
	height : auto;
	aspect-ratio : 503 / 171;
}

@media (min-width : 750px) {
	article.about > section.backnumber {
		padding-bottom : clamp(10.0rem, calc(21.315rem - 12.422vw), 12.0rem);
	}
	article.about > section.activity > h4 {
		margin-bottom : clamp(3.2rem, calc(22.907rem - 19.876vw), 8.0rem);
	}
}

article.about > section.activity > figure {
	display : flex;
	flex-direction : column;
	margin : 0 auto;
	width : min(100%, 67.0rem);
}
article.about > section.activity > figure img {
	display : block;
	margin : 0 auto;
	width : 100%;
	max-width : 51.0rem;
	height : auto;
}
article.about > section.activity > figure figcaption {
	padding-top : clamp(2.4rem, 1.554rem + 2.256vw, 4.8rem);
}
article.about > section.activity > figure figcaption p {
	margin-bottom : clamp(1.6rem, -1.661rem + 4.348vw, 2.3rem);
	font-size : clamp(1.2rem, 3.2vw, 2.4rem);
	line-height : 2;
}
article.about > section.activity > figure figcaption > p.cta {
	display : flex;
	justify-content : center;
	margin : clamp(3.25rem, 8.667vw, 6.5rem) 0 0;
	width : 100%;
}
article.about > section.activity > figure figcaption > p.cta > a {
	margin-top : 0;
	min-width : 0;
	width : 100%;
}

@media (min-width : 912px) {
	article.about > section.activity {
		display : block;
		width : min(90%, 109.8rem);
		max-width : 109.8rem;
		margin-bottom : clamp(20.0rem, calc(7.576vw + 13.091rem), 24.0rem);
	}

	article.about > section.activity > h4 {
		margin : 0 auto clamp(3.2rem, 2.071rem + 3.008vw, 6.4rem);
		background-image : url("../images/headline/activity_large.png");
		max-width : 77.8rem;
		aspect-ratio : 778 / 108;
	}

	article.about > section.activity > figure {
		display : grid;
		grid-template-columns : minmax(0, 51fr) minmax(0, 50fr);
		column-gap : 5.959%;
		align-items : start;
		margin : 0;
		width : min(100%, 107.4rem);
	}
	article.about > section.activity > figure img {
		margin : 0;
		max-width : none;
	}
	article.about > section.activity > figure figcaption {
		justify-self : end;
		padding-top : 0;
		width : min(100%, 50.0rem);
	}
	article.about > section.activity > figure figcaption p {
		font-size : 2.0rem;
		line-height : 2;
	}
	article.about > section.activity > figure figcaption > p.cta {
		justify-content : flex-start;
	}
}

/* _______________________________________ about:creator-message */

article.about > section:last-of-type {
	margin-bottom : 0;
	width : 100%;
}

article.about > section:last-of-type > h4 {
	display : inline-block;
	margin-bottom : clamp(2.5rem, 6.667vw, 5.0rem);
	padding-bottom : clamp(0.6rem, 1.6vw, 1.2rem);
	border-bottom : clamp(0.3rem, min(0.8vw, calc(1.532rem - 1.2422vw)), 0.6rem) solid #000000;
	font-size : clamp(1.5rem, min(4vw, calc(5.795rem - 3.727vw)), 3.0rem);
	font-weight : 900;
	line-height : clamp(1.5rem, min(4vw, calc(5.795rem - 3.727vw)), 3.0rem);
	text-align : left;
}

article.about > section:last-of-type > figure {
	display : flex;
	flex-direction : column;
	gap : 0;
	margin : 0 auto clamp(4.0rem, 2.589rem + 3.76vw, 8.0rem);
	padding : 0;
	background : #F4F2EB;
	width : min(100%, 67.0rem);
}
article.about > section:last-of-type > figure picture,
article.about > section:last-of-type > figure img {
	display : block;
	margin : 0;
	width : min(100%, 67.0rem);
	height : auto;
}
article.about > section:last-of-type > figure figcaption {
	padding : clamp(3.0rem, 8vw, 6.0rem);
	padding-top : clamp(2.35rem, 6.267vw, 4.7rem);
}
article.about > section:last-of-type > figure figcaption hgroup {
	display : flex;
	flex-direction : column;
	gap : clamp(0.2rem, 0.267vw, 0.4rem);
	margin-bottom : clamp(1.0rem, 2.667vw, 2.0rem);
}
article.about > section:last-of-type > figure figcaption h5 {
	color : #3A2F28;
	font-size : clamp(1.4rem, 3.733vw, 2.8rem);
	font-weight : 900;
}
article.about > section:last-of-type > figure figcaption hgroup p {
	color : #938D79;
	font-family : var(--font-avenir);
	font-size : clamp(0.9rem, 2.4vw, 1.8rem);
	font-style : italic;
	font-weight : 900;
}
article.about > section:last-of-type > figure figcaption > p {
	color : #3A2F28;
	font-size : clamp(1.0rem, 2.667vw, 2.0rem);
	line-height : 1.8;
	width : min(100%, 55.0rem);
}
article.about > section:last-of-type > figure figcaption > p + p {
	margin-top : 1.0rem;
}

article.about > section:last-of-type > section {
	position : relative;
	margin-left : -5.5556%;
	padding-right : 5.5556%;
	padding-bottom : clamp(16.0rem, 12.407rem + 12.782vw, 28.0rem);
	padding-left : calc(5.5556% + 2.4rem + clamp(1.6rem, 1.036rem + 1.504vw, 3.2rem));
	background : url("../images/about/thumbnail.webp") no-repeat center bottom / 100% auto;
	width : 111.1112%;
}

article.about > section:last-of-type > section > h5 {
	position : absolute;
	top : 0;
	left : clamp(5.5556%, calc(50% - 33.0rem), 12.5rem);
	overflow : hidden;
	background : url("../images/about/message.png") no-repeat center / contain;
	text-indent : 100%;
	white-space : nowrap;
	width : 2.4rem;
	height : 23.5rem;
}

article.about > section:last-of-type > section > p {
	margin : 0 0 clamp(1.6rem, calc(1.134rem + 0.621vw), 1.7rem) clamp(0px, calc(36vw - 24.2rem), 8.6rem);
	font-size : clamp(1.1rem, 2.933vw, 2.2rem);
	line-height : 2;
	width : min(100%, 60.0rem);
}

@media (min-width : 912px) {
	article.about > section:last-of-type {
		width : min(90%, 102.0rem);
	}
	article.about > section:last-of-type > h4 {
		border-bottom-width : 0.4rem;
		font-size : 2.4rem;
		line-height : 2.4rem;
		margin-bottom : 4.0rem;
	}

	article.about > section:last-of-type > figure {
		display : grid;
		grid-template-columns : 39.0rem 1fr;
		column-gap : 0;
		align-items : stretch;
		margin-bottom : 6.0rem;
		width : 100%;
	}
	article.about > section:last-of-type > figure figcaption {
		display : flex;
		flex-direction : column;
		justify-content : center;
		min-width : 0;
		padding : 0 clamp(2.0rem, calc(36.058vw - 30.885rem), 9.5rem);
		position : relative;
		top : -1.3rem;
	}
	article.about > section:last-of-type > figure figcaption hgroup {
		gap : 0.5rem;
		margin-bottom : 1.6rem;
	}
	article.about > section:last-of-type > figure figcaption h5 {
		font-size : 2.4rem;
	}
	article.about > section:last-of-type > figure figcaption hgroup p {
		font-size : 1.4rem;
	}
	article.about > section:last-of-type > figure figcaption > p {
		font-size : 1.6rem;
		line-height : 2.25;
		width : min(100%, 44.0rem);
	}
	article.about > section:last-of-type > figure figcaption > p + p {
		margin-top : 0.9rem;
	}

	article.about > section:last-of-type > section {
		margin-left : 0;
		padding-right : 0;
		padding-bottom : 28.3rem;
		padding-left : calc(2.4rem + clamp(1.6rem, 1.036rem + 1.504vw, 3.2rem));
		width : 100%;
	}
	article.about > section:last-of-type > section > p {
		margin : 0 0 1.7rem clamp(0px, calc(2.65vw - 24px), 14px);
		font-size : 1.6rem;
		line-height : 2.25;
		width : min(calc(100% - 8.4rem), 88.0rem);
	}

	article.about > section:last-of-type > section > h5 {
		left : 0;
	}
}


/* ===============================================
	faq
================================================== */

article.faq {
	--faq-answer-padding-top : min(clamp(1.75rem, 4.733vw, 3.55rem), clamp(2.4rem, calc(88.75px - 7.1vw), 3.55rem));
	--faq-summary-padding-block : min(clamp(1.5rem, 4vw, 3rem), clamp(2.5rem, calc(53.29px - 3.106vw), 3rem));
	--faq-details-gap : min(clamp(2.5rem, 6.667vw, 5rem), clamp(3rem, calc(143.17px - 12.38vw), 5rem));
	display : flex;
	flex-direction : column;
	align-items : center;
}

article.faq[class] > h3 {
	margin-top : 0;
	margin-bottom : clamp(3.7rem, min(9.867vw, calc(209.3px - 17.5vw)), 7.4rem);
	padding-top : calc(min(8.36vw, 6.27rem) + min(3.037vw, 2.278rem));
	background-size : auto min(9.733vw, 7.3rem);
	font-size : clamp(1.6rem, 1.2rem + 1.067vw, 2.0rem);
	font-weight : 900;
	line-height : clamp(1.6rem, 1.2rem + 1.067vw, 2.0rem);
	letter-spacing : 0px;
}

article.faq > section {
	width : 100%;
	margin-bottom : 0;
	padding : 0;
}
article.faq > section:not(:last-of-type) {
	width : min(100%, 89.333vw);
	margin-bottom : clamp(3.0rem, min(8vw, 6.4rem), 6.4rem);
}
article.faq > section:not(:last-of-type) > h4 {
	display : flex;
	align-items : center;
	justify-content : center;
	margin-bottom : clamp(1.5rem, min(4vw, 3.2rem), 3.2rem);
	color : #000000;
	font-size : clamp(1.5rem, min(4vw, calc(57.95px - 3.727vw)), 3.0rem);
	font-weight : 900;
	line-height : clamp(2.25rem, min(6vw, calc(86.93px - 5.59vw)), 4.5rem);
	letter-spacing : .08em;
	text-align : center;
}
article.faq > section:not(:last-of-type) > details > summary {
	padding-top : var(--faq-summary-padding-block);
	padding-right : clamp(5.0rem, min(12vw, 8.3rem), 8.3rem);
	padding-bottom : var(--faq-summary-padding-block);
	line-height : 1.5;
}
article.faq > section:not(:last-of-type) > details {
	margin-bottom : var(--faq-details-gap);
}
article.faq > section:not(:last-of-type) > details[open] > p {
	padding-top : var(--faq-answer-padding-top);
	padding-bottom : 0;
	padding-left : min(11.6vw, clamp(7.2rem, calc(15.6875rem - 9.317vw), 8.7rem));
	padding-right : calc(clamp(1rem, calc(4.35vw - 5.625px), 3.4rem) + clamp(4rem, calc(7.467vw + 1.2rem), 7.2rem) - min(11.6vw, clamp(7.2rem, calc(15.6875rem - 9.317vw), 8.7rem)));
}
article.faq > section:not(:last-of-type) > details[open] > p::before {
	top : calc(var(--faq-answer-padding-top) + 0.5lh - clamp(0.875rem, min(2.3335vw, calc(40.79px - 3.1055vw)), 1.75rem));
}
article.faq > section:not(:last-of-type) > h4::before,
article.faq > section:not(:last-of-type) > h4::after {
	margin : 0 clamp(0.5rem, 1.333vw, 1.0rem);
	content : "—";
}
article.faq > section:last-of-type {
	display : flex;
	flex-direction : column;
	align-items : center;
	width : 100%;
	margin-top : clamp(2.4rem, 1.12rem + 3.413vw, 5.6rem);
	text-align : center;
}
article.faq > section:last-of-type > h4 {
	display : none;
}
article.faq > section:last-of-type > p:not(:has(a)) {
	font-size : clamp(1.3rem, min(3.467vw, calc(53.95px - 3.727vw)), 2.6rem);
	font-weight : 900;
	line-height : clamp(1.95rem, min(5.2vw, calc(127.51px - 11.801vw)), 3.9rem);
	letter-spacing : 0.04em;
}

article.faq > section:last-of-type > p.cta {
	display : flex;
	justify-content : center;
	width : 100%;
	margin-top : clamp(2.0rem, min(5.333vw, 4.0rem), 4.0rem);
}
article.faq > section:last-of-type > p.cta > a {
	width : clamp(20.0rem, min(53.333vw, calc(1052.17px - 86.957vw)), 40.0rem);
	padding-left : min(clamp(2.0rem, 5.333vw, 4.0rem), clamp(2.4rem, calc(114.1px - 9.88vw), 4.0rem));
	min-width : 0;
	max-width : 100%;
}

@media (min-width : 912px) {
	article.faq[class] > h3 {
		margin-top : 0;
		margin-bottom : clamp(2.0rem, 5.333vw, 5.0rem);
		font-size : clamp(1.8rem, 1.455rem + 0.379vw, 2.0rem);
		line-height : clamp(1.8rem, 1.455rem + 0.379vw, 2.0rem);
	}
	article.faq > section:not(:last-of-type) {
		width : 100%;
	}
	article.faq {
		--faq-summary-padding-block : 2.5rem;
		--faq-details-gap : 3rem;
	}
	article.faq > section:not(:last-of-type) > h4 {
		font-size : 2.4rem;
		line-height : 3.6rem;
	}
	article.faq > section:last-of-type > p:not(:has(a)) {
		font-size : 2.0rem;
		line-height : 2.0rem;
	}
	article.faq > section:not(:last-of-type) > details[open] > p::before {
		top : calc(var(--faq-answer-padding-top) + (3.2rem - 2.5rem) / 2);
	}
	article.faq > section:last-of-type > p.cta > a {
		width : 26.0rem;
	}
}


/* ===============================================
	contact
================================================== */

article.contact {
	display : flex;
	flex-direction : column;
	align-items : center;
	width : 89.333%;
}

article[class].contact > h3 {
	width : 100%;
	margin-top : 0;
	margin-bottom : clamp(2.5rem, 6.667vw, 5.0rem);
	padding-top : calc(clamp(4.2rem, 9.733vw, 7.3rem) + 0.3rem);
}

article.contact > section {
	display : flex;
	flex-direction : column;
	align-items : flex-start;
	width : 100%;
	margin-bottom : clamp(3.0rem, 8vw, 6.0rem);
	padding : clamp(3.0rem, 8vw, 6.0rem) clamp(2.5rem, 6.667vw, 5.0rem);
	padding-bottom : clamp(4.0rem, min(10.667vw, calc(24.62rem - 22.16vw)), 8.0rem);
	border-radius : 1.6rem;
	background : #ffffff;
	box-shadow : 0 0.8rem 0 0 #c9c9c940;
}
article.contact > section > h4 {
	margin-bottom : clamp(1.6rem, 0.901rem + 1.866vw, 3.2rem);
	font-size : clamp(1.8rem, 4.8vw, 3.6rem);
	font-weight : 900;
	line-height : 1.45;
}
article.contact > section > p {
	font-size : clamp(1.3rem, 3.467vw, 2.6rem);
	line-height : 1.77;
}
article.contact > section > ul {
	--contact-list-indent : min(2.933vw, calc(4.995rem - 3.727vw));
	list-style : disc;
	width : 100%;
	margin : clamp(1.6rem, 1.041rem + 1.493vw, 3.2rem) 0;
	padding : 0;
}
article.contact > section > ul > li {
	position : relative;
	width : fit-content;
	max-width : 100%;
	padding-left : var(--contact-list-indent);
	font-size : clamp(1.3rem, 3.467vw, 2.6rem);
	line-height : 1.77;
	text-align : left;
}
article.contact > section > ul > li::marker {
	color : transparent;
}
article.contact > section > ul > li::before {
	position : absolute;
	top : 0;
	left : 0;
	width : var(--contact-list-indent);
	content : "•";
	text-align : center;
}

article.contact > section:first-of-type > p.cta {
	display : flex;
	justify-content : center;
	width : 100%;
	margin-top : clamp(2.4rem, 6.4vw, 4.8rem);
}
article.contact > section:first-of-type > p.cta > a {
	width : min(100%, clamp(36.0rem, calc(79.83rem - 30.435vw), 57.0rem));
	padding-left : clamp(2.2rem, 5.867vw, 4.4rem);
	min-width : 0;
}

article.contact > section:nth-of-type(n+2) > address {
	display : inline-block;
	margin-top : min(8.533vw, calc(11.99rem - 7.45vw));
	border-bottom : 2px solid #000000;
	color : #000000;
	font-family : var(--font-avenir);
	font-size : clamp(1.3rem, 3.467vw, 2.6rem);
	font-weight : 900;
	font-style : italic;
	line-height : 1;
}

article.contact > small {
	width : 100%;
	margin : 0 auto;
	color : #333333;
	font-size : clamp(1.2rem, 3.2vw, 2.4rem);
	font-weight : 900;
	line-height : 1.75;
}

@media (min-width : 912px) {
	article[class].contact {
		display : grid;
		grid-template-columns : repeat(2, minmax(0, 44rem));
		column-gap : clamp(3.0rem, 4.167vw, 6.0rem);
		row-gap : 6.0rem;
		padding-top : 5.4rem;
	}
	article[class].contact > h3 {
		grid-column : 1 / -1;
		margin-top : 0;
		margin-bottom : 0;
		padding-top : 8.4rem;
		line-height : 1;
	}
	article.contact > section {
		margin-bottom : 0;
		padding : clamp(4.0rem, 3.611vw, 5.2rem) clamp(4.0rem, 3.472vw, 5.0rem);
		padding-bottom : clamp(4.0rem, 4.861vw, 7.0rem);
		border-radius : 1.6rem;
		box-shadow : 0 0.6rem 0 0 #c9c9c940;
	}
	article.contact > section:first-of-type {
		grid-column : 1 / -1;
		align-items : center;
		text-align : center;
	}
	article.contact > section:first-of-type > p.cta > a {
		padding-left : clamp(2.9rem, calc(6.99rem - 2.84vw), 4.4rem);
	}
	article.contact > section > h4 {
		font-size : clamp(2.4rem, 0.918rem + 1.625vw, 3.2rem);
		line-height : 1.5;
	}
	article.contact > section:nth-of-type(n+2) {
		align-self : start;
		margin-bottom : 0;
	}
	article.contact > section > p,
	article.contact > section > ul > li {
		font-size : clamp(1.6rem, 1.255rem + 0.379vw, 1.8rem);
		line-height : 2;
	}
	article.contact > section > ul {
		margin : 1.6rem 0;
		--contact-list-indent : 1.6rem;
	}
	article.contact > section > ul > li {
		width : fit-content;
	}
	article.contact > section:nth-of-type(n+2) > address {
		margin-top : 5.2rem;
		font-size : 1.8rem;
	}
	article.contact > small {
		grid-column : 1 / -1;
		margin-top : 0;
		color : #333333;
		font-size : 1.6rem;
		line-height : 1.75;
	}
}


/* ===============================================
	log / news archive & detail
================================================== */

/* _______________________________________ archive pagination */

article.archive > nav[aria-label$="ArchiveList"] {
	margin : clamp(4.0rem, 2.589rem + 3.759vw, 8.0rem) auto 0;
	width : fit-content;
	max-width : min(100%, 86vw);
}

:is(article.log.archive, article.news.archive) > nav[aria-label$="ArchiveList"] {
	padding-block : min(1.067vw, clamp(.4rem, calc(2.652rem - 2.469vw), .8rem));
}

article.archive > nav[aria-label$="ArchiveList"] > ul {
	display : flex;
	align-items : center;
	flex-wrap : wrap;
	justify-content : center;
	column-gap : 1.0468em;
	width : 100%;
	font-size : min(6.4vw, clamp(2.4rem, calc(160px - 14.912vw), 4.8rem));
}

article.archive > nav[aria-label$="ArchiveList"] > ul > li {
	flex : 0 0 auto;
}

article.archive > nav[aria-label$="ArchiveList"] a {
	display : flex;
	align-items : center;
	justify-content : center;
	min-width : 0;
	min-height : 0;
	font-family : var(--font-avenir);
	font-size : min(6.4vw, clamp(2.4rem, calc(160px - 14.912vw), 4.8rem));
	line-height : 1.25;
	font-weight : 900;
	font-style : italic;
}

article.archive > nav[aria-label$="ArchiveList"] > ul > li > a[rel~="prev"],
article.archive > nav[aria-label$="ArchiveList"] > ul > li > a[rel~="next"] {
	width : min(6.933vw, clamp(2.6rem, calc(173.1px - 16.15vw), 5.2rem));
	height : min(4.8vw, clamp(1.8rem, calc(119.33px - 11.111vw), 3.6rem));
	line-height : 1;
}

article.archive > nav[aria-label$="ArchiveList"] a[title="…"] {
	width : min(5.333vw, clamp(2rem, calc(132.6px - 12.346vw), 4rem));
	height : min(5.333vw, clamp(2rem, calc(132.6px - 12.346vw), 4rem));
	font-size : min(5.333vw, clamp(2rem, calc(132.6px - 12.346vw), 4rem));
	line-height : 1;
}

@media (min-width : 912px) {
	article.archive > nav[aria-label$="ArchiveList"] > ul {
		font-size : 2.4rem;
	}
	article.archive > nav[aria-label$="ArchiveList"] a {
		font-size : 2.4rem;
	}
	article.archive > nav[aria-label$="ArchiveList"] > ul > li > a[rel~="prev"],
	article.archive > nav[aria-label$="ArchiveList"] > ul > li > a[rel~="next"] {
		width : 2.6rem;
		height : 1.8rem;
	}
	article.archive > nav[aria-label$="ArchiveList"] a[title="…"] {
		width : 2rem;
		height : 2rem;
		font-size : 2rem;
	}
	:is(article.log.archive, article.news.archive) > nav[aria-label$="ArchiveList"] {
		padding-block : .4rem;
	}
}

article.archive > nav[aria-label$="ArchiveList"] > ul > li > a:not([rel~="prev"]):not([rel~="next"]):not([title="…"]) {
	border-bottom : 2px solid transparent;
	transition : border-color .2s ease;
}

article.archive > nav[aria-label$="ArchiveList"] > ul > li > a:not([rel~="prev"]):not([rel~="next"]):not([title="…"])[aria-current="page"] {
	border-bottom-color : currentColor;
}
article.archive > nav[aria-label$="ArchiveList"] > ul > li > a[rel~="prev"],
article.archive > nav[aria-label$="ArchiveList"] > ul > li > a[rel~="next"] {
	transform : translateX(0);
	transition : transform .25s ease;
}

@media (hover : none) {
	article.archive > nav[aria-label$="ArchiveList"] > ul > li > a:not([rel~="prev"]):not([rel~="next"]):not([title="…"]):active {
		border-bottom-color : currentColor;
	}
	article.archive > nav[aria-label$="ArchiveList"] > ul > li > a[rel~="prev"]:active {
		transform : translateX(-.8rem);
	}
	article.archive > nav[aria-label$="ArchiveList"] > ul > li > a[rel~="next"]:active {
		transform : translateX(.8rem);
	}
}
@media (hover : hover) {
	article.archive > nav[aria-label$="ArchiveList"] > ul > li > a:not([rel~="prev"]):not([rel~="next"]):not([title="…"]):hover {
		border-bottom-color : currentColor;
	}
	article.archive > nav[aria-label$="ArchiveList"] > ul > li > a[rel~="prev"]:hover {
		transform : translateX(-.8rem);
	}
	article.archive > nav[aria-label$="ArchiveList"] > ul > li > a[rel~="next"]:hover {
		transform : translateX(.8rem);
	}
}

/* _______________________________________ detail commons */

article.detail > section:first-of-type {
	margin : 0 auto;
	padding : 0;
	width : 100%;
}

article.detail > section:last-of-type {
	margin-top : min(34.4vw, calc(89.531rem - 84.975vw));
}

article.detail > section:first-of-type > time {
	display : block;
	margin-bottom : clamp(1.2rem, 0.776rem + 1.128vw, 2.4rem);
	font-size : clamp(1.1rem, 2.933vw, 2.2rem);
}
article.detail > section:first-of-type > h5 {
	margin : clamp(3.2rem, 2.071rem + 3.008vw, 6.4rem) 0 1.8rem;
	font-size : clamp(1.6rem, min(4.267vw, calc(41.259px - 1.235vw)), 3.2rem);
	line-height : 1.5;
}
article.detail > section:first-of-type > p {
	font-size : clamp(1.3rem, min(3.467vw, calc(63.037px - 4.938vw)), 2.6rem);
	font-weight : 900;
	line-height : 2;
}
article.detail > section:first-of-type > p + p {
	margin-top : clamp(0.9rem, 2.4vw, 1.8rem);
}
article.detail > section:first-of-type > :is(h5, h6) + :is(p, ul, ol) {
	margin-top : 0;
}
article.detail > section:first-of-type > :is(ul, ol) + p {
	margin-top : clamp(0.9rem, 2.4vw, 1.8rem);
}

article.detail > section:first-of-type > figure {
	margin : clamp(3.2rem, 2.071rem + 3.008vw, 6.4rem) auto;
}
article.detail > section:first-of-type > figure > img {
	display : block;
	width : 100%;
	aspect-ratio : 3 / 2;
	object-fit : cover;
}

article.detail > section:first-of-type > p:has(> img:only-child) {
	margin : clamp(3.2rem, 2.071rem + 3.008vw, 6.4rem) auto;
}
article.detail > section:first-of-type > p:has(> img:only-child) > img {
	display : block;
	width : 100%;
	height : auto;
}

article.detail > section:first-of-type > small {
	display : block;
	margin-top : clamp(3.2rem, 2.071rem + 3.008vw, 6.4rem);
	font-size : clamp(1.0rem, 0.3004rem + 1.8657vw, 2.0rem);
	font-weight : 900;
	line-height : 2;
}

/* _______________________________________ CMS-ready tag set. */

article.detail > section:first-of-type > h6 {
	margin : clamp(2.4rem, 1.553rem + 2.256vw, 4.8rem) 0 1.8rem;
	font-size : clamp(1.6rem, min(4.267vw, calc(41.259px - 1.235vw)), 3.2rem);
	line-height : 1.5;
}
article.detail > section:first-of-type > :is(ul, ol) {
	margin : clamp(0.9rem, 2.4vw, 1.8rem) 0;
	padding-left : 1.0em;
	font-size : clamp(1.3rem, min(3.467vw, calc(63.037px - 4.938vw)), 2.6rem);
	font-weight : 900;
	line-height : 2;
}

article.detail > section:first-of-type > ul { list-style : disc; }
article.detail > section:first-of-type > ol { list-style : decimal; }
article.detail > section:first-of-type > :is(ul, ol) > li + li { margin-top : 0; }

article.detail > section:first-of-type blockquote {
	margin : clamp(2.4rem, 1.553rem + 2.256vw, 4.8rem) 0;
	padding : 1.6rem 2.0rem;
	border-left : 3px solid #ddd9cc;
	background : #f7f5f0;
	font-size : clamp(1.3rem, min(3.467vw, calc(63.037px - 4.938vw)), 2.6rem);
	font-weight : 900;
	line-height : 2;
}

article.detail > section:first-of-type blockquote > :first-child { margin-top : 0; }
article.detail > section:first-of-type blockquote > :last-child { margin-bottom : 0; }

article.detail > section:first-of-type strong { font-weight : 900; }
article.detail > section:first-of-type em { font-style : normal; font-weight : 900; }

article.detail > section:first-of-type > hr {
	margin : clamp(3.2rem, 2.071rem + 3.008vw, 6.4rem) 0;
	border : 0;
	border-top : 1px solid #ddd9cc;
}

article.detail > section:first-of-type > figure > figcaption {
	margin-top : clamp(1.2rem, 2.667vw, 2.0rem);
	font-size : clamp(1.0rem, 2.667vw, 2.0rem);
	font-weight : 900;
	line-height : 1.5;
}

@media (min-width : 912px) {
	article.detail > section:first-of-type {
		padding : 1.8rem 0 0;
		width : 100%;
		max-width : none;
	}
	article.detail > section:last-of-type {
		margin-top : clamp(8.0rem, 5.178rem + 7.519vw, 16.0rem);
	}

	article.detail > section:first-of-type > :is(h5, h6) {
		font-size : 3.0rem;
	}

	article.detail > section:first-of-type > :is(p, ul, ol),
	article.detail > section:first-of-type blockquote {
		font-size : 1.8rem;
		line-height : 2;
	}

	article.detail > section:first-of-type > small,
	article.detail > section:first-of-type > figure > figcaption {
		font-size : 1.3rem;
		line-height : 2;
	}
	article.detail > section:first-of-type > figure > figcaption {
		margin-top : 1.6rem;
	}
	article.log.detail > section:first-of-type > figure:first-of-type ~ *,
	article.news.detail > section:first-of-type > h4 ~ * {
		margin-right : auto;
		margin-left : auto;
		width : min(100%, 81rem);
	}
}

/* _______________________________________ OTHER series:archive link */

article.detail > section:last-of-type > p:has(> a:only-child):last-of-type > a {
	display : inline-flex;
	align-items : center;
	gap : clamp(1.4rem, 3.733vw, 2.8rem);
	padding-bottom : clamp(0.3rem, 0.8vw, 0.6rem);
	border-bottom : 2px solid currentColor;
	color : #000000;
	font-size : clamp(1.5rem, 4vw, 3.0rem);
	font-weight : 900;
	line-height : 1.4;
}

article.detail > section:last-of-type > p:has(> a:only-child):last-of-type > a::after {
	display : inline-block;
	background : url("../images/accessories/arrow.png") no-repeat center / contain;
	transform : translateX(0);
	transition : transform .25s ease;
	content : "";
	width : clamp(1.95rem, 5.2vw, 3.9rem);
	height : clamp(1.35rem, 3.6vw, 2.7rem);
}
@media (hover : none) {
	article.detail > section:last-of-type > p:has(> a:only-child):last-of-type > a:active::after {
		transform : translateX(.8rem);
	}
}
@media (hover : hover) {
article.detail > section:last-of-type > p:has(> a:only-child):last-of-type > a:hover::after {
	transform : translateX(.8rem);
}
}

@media (min-width : 912px) {
	article.detail > section:last-of-type > p:has(> a:only-child):last-of-type > a {
		gap : 2.0rem;
		padding-bottom : 0.4rem;
		font-size : 2.0rem;
	}
	article.detail > section:last-of-type > p:has(> a:only-child):last-of-type > a::after {
		width : 2.6rem;
		height : 1.8rem;
	}
}

/* _______________________________________ log detail */

article.log.detail > section:first-of-type > figure:first-of-type {
	--log-detail-frame-stroke : 2px;
	margin-top : 0;
	margin-bottom : clamp(5rem, 13.333vw, 12rem);
	position : relative;
	isolation : isolate;
	border : 0;
	background : #ffffff;
}

article.log.detail > section:first-of-type > figure:first-of-type::after {
	position : absolute;
	inset : 0;
	pointer-events : none;
	border : var(--log-detail-frame-stroke) solid #333333;
	box-sizing : border-box;
	content : "";
	z-index : 2;
}

article.log.detail > section:first-of-type > figure:first-of-type > figcaption {
	margin-top : 0;
	border-top : var(--log-detail-frame-stroke) solid #333333;
	padding : max(0px, calc(clamp(1rem, 2.667vw, 2rem) - var(--log-detail-frame-stroke))) clamp(1.5rem, 4.1vw, 3.1rem) clamp(2.4rem, 6.4vw, 4.8rem);
}

article.log.detail > section:first-of-type > figure:first-of-type h4 {
	margin-bottom : clamp(1rem, 2.933vw, 3rem);
	font-size : clamp(1.6rem, 4.267vw, 3.2rem);
	font-weight : 900;
	line-height : 1.5;
}

article.log.detail > section:first-of-type > figure:first-of-type ul {
	display : flex;
	flex-wrap : wrap;
	gap : 0.8rem 1em;
	font-size : clamp(1.1rem, 2.933vw, 2.2rem);
	line-height : clamp(1.1rem, 2.933vw, 2.2rem);
	letter-spacing : 0;
}

article.log.detail > section:first-of-type > figure:first-of-type ul > li,
article.log.detail > section:first-of-type > figure:first-of-type ul > li > a {
	line-height : inherit;
}

article.log.detail > section:first-of-type > time {
	font-family : var(--font-avenir);
	font-size : clamp(1.1rem, 2.933vw, 2.2rem);
	margin-bottom : clamp(1.25rem, 3.36vw, 2.4rem);
	font-style : italic;
	font-weight : 900;
	line-height : clamp(1.1rem, 2.933vw, 2.2rem);
	letter-spacing : 0.04em;
	color : #9f9f9f;
}

article.log.detail > section:first-of-type > h5 {
	font-weight : 900;
}

article.log.detail > section:first-of-type > small {
	font-size : clamp(1rem, 2.667vw, 2rem);
	line-height : 2;
}

@media (min-width : 912px) {
	article.log.detail > section:first-of-type > figure:first-of-type {
		--log-detail-frame-stroke : clamp(0.3rem, 0.278vw, 0.4rem);
		margin-bottom : 12rem;
	}
	article.log.detail > section:first-of-type > time {
		font-size : 2.4rem;
		line-height : 1.4rem;
	}
	article.log.detail > section:first-of-type > small {
		font-size : 1.3rem;
		line-height : 2;
	}
	article.log.detail > section:first-of-type > figure:first-of-type h4 {
		font-size : 3.2rem;
	}
	article.log.detail > section:first-of-type > figure:first-of-type > figcaption {
		padding : max(0px, calc(2.8rem - var(--log-detail-frame-stroke))) 2.4rem 4.8rem;
	}
	article.log.detail > section:first-of-type > figure:first-of-type ul {
		font-size : 1.8rem;
		line-height : 1.2rem;
		letter-spacing : 0.04em;
	}
}

article.log.detail > section:last-of-type > h4 {
	font-family : var(--font-avenir);
	font-size : clamp(2.5rem, 6.667vw, 5.0rem);
	font-weight : 900;
	font-style : italic;
	line-height : 1;
	letter-spacing : 0.1em;
}

article.log.detail > section:last-of-type > p:has(> a:only-child):last-of-type {
	justify-self : end;
	margin : 0;
}

@media (min-width : 912px) {
	article.detail > section:last-of-type > h4 {
		font-size : 4.0rem;
	}
	article.log.detail > section:last-of-type > h4 {
		grid-column : 1 / 3;
		grid-row : 1;
		font-size : 4rem;
	}
	article.log.detail > section:last-of-type > p:has(> a:only-child):last-of-type {
		grid-column : 3;
		grid-row : 1;
		align-self : center;
	}
}

/* _______________________________________ news detail */

article.news.detail > section:first-of-type > time {
	margin-bottom : clamp(0.6rem, 1.47vw, 1.4rem);
	font-size : clamp(1.1rem, min(2.933vw, calc(40.519px - 2.469vw)), 2.2rem);
	line-height : 1;
	letter-spacing : 0.04em;
}

article.news.detail > section:first-of-type > h4 {
	margin-bottom : clamp(3.2rem, 2.071rem + 3.008vw, 6.4rem);
	padding-bottom : clamp(1.6rem, 1.036rem + 1.504vw, 3.2rem);
	border-bottom : 2px solid #ddd9cc;
	font-size : clamp(1.6rem, 4.267vw, 3.2rem);
	line-height : 1.5;
}

@media (min-width : 912px) {
	article.news.detail > section:first-of-type > time {
		font-size : 1.8rem;
	}
	article.news.detail > section:first-of-type > h4 {
		font-size : 3.2rem;
	}
}

article.news.detail > section:last-of-type {
	display : grid;
	grid-template-columns : 1fr;
}

article.news.detail > section:last-of-type > h4 {
	grid-column : 1;
	grid-row : 1;
	font-family : var(--font-avenir);
	font-size : clamp(2.5rem, 6.667vw, 5.0rem);
	line-height : 1;
	font-weight : 900;
	font-style : italic;
	letter-spacing : 0.08em;
}

article.news.detail > section:last-of-type > ul {
	grid-column : 1 / -1;
	grid-row : 2;
	margin-top : clamp(1.6rem, 1.036rem + 1.504vw, 3.2rem);
}

article.news.detail > section:last-of-type > p:has(> a:only-child):last-of-type {
	grid-column : 1;
	grid-row : 3;
	justify-self : end;
	margin : 2.4rem 0 0;
}

@media (min-width : 912px) {
	article.news.detail > section:last-of-type {
		grid-template-columns : 1fr auto;
	}
	article.news.detail > section:last-of-type > h4 {
		font-size : 4.0rem;
	}
	article.news.detail > section:last-of-type > p:has(> a:only-child):last-of-type {
		grid-column : 2;
		grid-row : 1;
		align-self : center;
		justify-self : auto;
		margin : 0;
	}
}


main > article:not([class]) > h3 {
	display : none;
}

@media (min-width : 912px) {
	main > article:not([class]) > section.news > p.cta > a {
		width : 26rem;
		min-width : 0;
	}
}

:is(article.news.archive > section, article.news.detail > section:last-of-type) > ul > li > time,
:where(article > section.news) > ul > li > time,
:where(article > section.news, article.news.archive > section, article.news.detail > section:last-of-type) > ul > li > a {
	padding-right : 1.0rem;
	padding-left : 1.0rem;
}

@media (min-width : 912px) {
	article > section.news > ul > li > time,
	:is(article.news.archive > section, article.news.detail > section:last-of-type) > ul > li > time {
		padding-left : 1.2rem;
	}
	article > section.news > ul > li > time {
		padding-right : 1.2rem;
	}
	:is(article.news.archive > section, article.news.detail > section:last-of-type) > ul > li > time {
		padding-right : .6rem;
	}
	article > section.news > ul > li > a,
	:is(article.news.archive > section, article.news.detail > section:last-of-type) > ul > li > a {
		padding-left : 2.4rem;
		padding-right : 1.2rem;
	}
}

/* _______________________________________ detail editor content boundary */

article.detail > section:first-of-type > p.cta {
	display : flex;
	justify-content : center;
	margin : clamp(3.2rem, 6.4vw, 4.8rem) auto;
	width : 100%;
	max-width : 81rem;
}
article.detail > section:first-of-type > p.cta > a {
	width : 100%;
	min-width : 0;
}

:is(
	article.log.detail > section:first-of-type > figure:first-of-type ~ p:has(> img:only-child),
	article.news.detail > section:first-of-type > h4 ~ p:has(> img:only-child)
) {
	text-align : center;
}

@media (min-width : 912px) {
	main > article:not([class]) > section.news {
		grid-template-columns : 26fr 76.4fr;
		column-gap : clamp(3.0rem, 5.208vw, 7.5rem);
	}
}


/* ===============================================
	lower-page outer frame
================================================== */

:where(
	article.faq,
	article.log.archive,
	article.news.archive,
	article.detail,
	article.contact
) {
	margin-right : auto;
	margin-left : auto;
	padding-right : 0;
	padding-left : 0;
	width : 90%;
	max-width : none;
}

article.log.archive {
	width : 89.333%;
}

article.log.detail {
	width : 89.333%;
}

article.news.detail {
	width : 89.333%;
}

:is(article.news.archive, article.detail) > section {
	margin-right : 0;
	margin-left : 0;
	padding-right : 0;
	padding-left : 0;
	width : 100%;
	max-width : none;
}

@media (min-width : 912px) {
	:is(article.faq, article.log.archive) {
		width : min(90%, 110rem);
	}

	article.news.archive {
		width : min(90%, 88rem);
	}
	article.news.detail {
		width : min(89.333%, 87rem);
	}
	article.log.detail {
		width : min(89.333%, 110rem);
	}
	article.log.detail > section:first-of-type {
		width : min(100%, 87rem);
		margin-inline : auto;
	}
	article.log.detail > section:last-of-type {
		width : min(100%, 110rem);
	}

	article.contact {
		width : min(90%, 94rem);
	}

	article.detail > section:first-of-type,
	article.detail > section:last-of-type {
		width : 100%;
		max-width : none;
	}
}
