@charset "utf-8";

/* --------------------------------
	common
-------------------------------- */
/* reset
--------------- */
* {
	box-sizing: border-box;
}
body {
	color: #000;
	font-feature-settings: "palt";
	font-size: 16px;
	line-height: 1.5;
}
a {
	color: inherit;
	text-decoration: none;
	transition: opacity 0.2s ease-out;
}
a:hover {
	opacity: 0.7;
}
img {
	vertical-align: top;
}
a img {
	vertical-align: top;
}
@media screen and (max-width: 768px) {
	body {
		font-size: 13px;
	}
	a {
		transition: none;
	}
	a:hover {
		opacity: 1;
	}
}

/*非表示設定*/
.invisible {
	display: none;
}


/* header */
#header {
	position: fixed;
	z-index: 1000;
	/* transition: all 0.5s ease 0.1s; */
}
#header.bg {
	background: rgba(255,255,255,1);
}

/* contents-wrap
--------------- */
#contents-wrap {
	padding-top: 8.75em;
}
#contents-wrap .container {
	max-width: 750px;
	margin-right: auto;
	margin-left: auto;
}
#contents-wrap .categoryTitle {
	text-align: center;
}
#contents-wrap .vol {
	margin-top: 1.56em;
	text-align: center;
}
#contents-wrap .vol img {
	max-width: 83px;
}
#contents-wrap .mainTitle {
	margin-top: 3.12em;
	text-align: center;
}
#contents-wrap .mainTitle > p {
	font-family: "Noto Sans CJK JP", sans-serif;
	font-weight: 800;
	line-height: 1.4;
	font-size: 44px;
}
#contents-wrap .collectionTitle {
	margin-top: 3.12em;
	text-align: center;
}
#contents-wrap .collectionTitle img {
	max-width: 322px;
}
@media screen and (max-width: 768px) {
	#contents-wrap {
		padding-right: 6%;
		padding-left: 6%;
	}
	#contents-wrap .categoryTitle {
		width: 72.5%;
		margin-right: auto;
		margin-left: auto;
	}
	#contents-wrap .vol img {
		width: 15%;
	}
	#contents-wrap .mainTitle > p {
		font-size: 19px;
	}
	#contents-wrap .mainTitle img {
		max-width: 320px;
	}
	#contents-wrap .collectionTitle {
		margin-top: 2em;
	}
	#contents-wrap .collectionTitle img {
		width: 70%;
	}
}

/* toc
--------------- */
#contents-wrap .thumb {
	margin-top: 5em;
	display: flex;
	flex-direction: column;
	align-items: center;
}
#contents-wrap .thumb * {
	box-sizing: content-box;
}
#contents-wrap .thumb ul {
	display: flex;
	justify-content: center;
}
#contents-wrap .thumb ul ~ ul {
	margin-top: 48px;
}
#contents-wrap .thumb ul li + li {
	margin-left: 1.125em;
}
@media screen and (max-width: 768px) {
	#contents-wrap .thumb {
		margin-top: 3em;
	}
	#contents-wrap .thumb ul ~ ul {
		margin-top: 2em;
	}
}

/* look
--------------- */
#contents-wrap .look {
	max-width: 660px;
	margin-top: 10.6em;
	margin-right: auto;
	margin-left: auto;
}
#contents-wrap .look .lookTitle {
	text-align: center;
}
#contents-wrap .look .lookTitle img {
	width: 106px;
}
#contents-wrap .look .lookImage {
	margin-top: 2.8em;
	text-align: center;
}
#contents-wrap .look .lookCopy {
	margin-top: 2em;
	padding-bottom: 1.3em;
	border-bottom: 3px solid black;
	font-size: 27px;
	font-weight: bold;
	text-align: center;
	line-height: 1.4;
}
#contents-wrap .look .lookDetail {
	margin-top: 2.5em;
}
#contents-wrap .look .lookDetail.oneItem {
	text-align: center;
}
#contents-wrap .look .lookDescription,
#contents-wrap .look .lookInfo {
	margin-top: 2.5em;
	font-size: 18px;
	font-weight: bold;
	line-height: 1.8;
	word-break: break-all;
}
#contents-wrap .look .lookInfo p > span.pcVisible {
	visibility: visible;
}
#contents-wrap .look .lookInfo p + p {
	margin-top: 1em;
}
#contents-wrap .look .lookInfo img {
	vertical-align: middle;
	padding-right: 5px;
}
#contents-wrap .look .lookInfo p.onlineStore {
	margin-top: .5em;
}
#contents-wrap .look .lookInfo p.onlineStore a img {
	padding: 0;
	max-width: 309px;
	width: 41.2vw;
}
#contents-wrap .look .lookInfo p.store {
	margin-top: 0;
}
@media screen and (max-width: 768px) {
	#contents-wrap .look {
		margin-top: 5em;
	}
	#contents-wrap .look .lookTitle img {
		width: 53px;
	}
	#contents-wrap .look .lookImage {
		margin-top: 1.84em;
	}
	#contents-wrap .look .lookCopy {
		font-size: 13px;
	}
	#contents-wrap .look .lookDetail {
		margin-top: 2em;
	}
	#contents-wrap .look .lookDescription,
	#contents-wrap .look .lookInfo {
		margin-top: 1.25em;
		font-size: 13.5px;
		line-height: 1.6;
	}
	#contents-wrap .look .lookInfo {
		font-size: 12px;
		line-height: 2.2;
	}
	#contents-wrap .look .lookInfo p > span.pcVisible {
		visibility: hidden;
	}
	#contents-wrap .look .lookInfo img {
		width: auto;
		height: 15px;
		padding: 0;
	}
	#contents-wrap .look .lookInfo p.onlineStore a img {
		max-width: 450px;
		width: 50vw;
		height: auto;
	}
	#contents-wrap .look#look04 .lookDetail.oneItem img {
		width: 42vw;
	}
}

/* next
--------------- */
.next {
	margin-top: 8em;
	text-align: center;
}
@media screen and (max-width: 768px) {
	.next {
		margin-top: 5em;
	}
	.next img {
		max-width: 180px;
	}
}

/* bnr
--------------- */
.bnr {
	margin-top: 8em;
	text-align: center;
}
.bnr li + li {
	margin-top: 3em;
}
@media screen and (max-width: 768px) {
	.bnr {
		margin-top: 5em;
	}
	.bnr li + li {
		margin-top: 1.8em;
	}
}

/* note
--------------- */
.note {
	max-width: 660px;
	margin-top: 4em;
	margin-right: auto;
	margin-left: auto;
	padding-top: 1.5em;
	border-top: 2px solid black;
	font-size: 18px;
	line-height: 1.6;
}
.note p {
	margin-bottom: 1em;
	padding: 0.5em 2em;
	border: solid 1px #000;
	display: inline-block;
}
.note ul li {
	padding-left: 1em;
	text-indent: -1em;
}
@media screen and (max-width: 768px) {
	.note {
		margin-top: 5em;
		padding-top: 1.5em;
		font-size: 10px;
	}
}

/* show  */
.pc {
	display: block;
}
br.pc,
img.pc {
	display: inline;
}
.sp {
	display: none;
}
@media screen and (max-width: 768px) {
	.pc {
		display: none;
	}
	br.pc,
	img.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	br.sp,
	img.sp {
		display: inline;
	}
}

/* footer */
#footer {
	margin-top: 110px;
	padding: 70px 0;
	border-top: 4px solid;
}
#btn_top {
	position: absolute;
	left: 50%;
	margin: 0;
	margin-left: -565px;
}
#footer .copyright {
	display: flex;
	flex-direction: column;
	padding: 0;
	text-align: center;
}
#footer .copyright span {
	display: block;
	padding-top: 0;
}
#footer .copyright img {
	padding-right: 0;
}
@media screen and (max-width: 768px) {
	#footer {
		margin-top: 14.667vw;
		padding: 9.333vw 0;
		border-top: 0.533vw solid;
	}
}

/* archives */
.archives {
	border-bottom: solid 1px #000;
	margin-bottom: 50px;
	padding-bottom: 35px;
	text-align: center;
}
.archives .txt {
	margin-top: 20px;
	font-size: 27px;
	font-weight: 700;
}
@media screen and (max-width: 768px) {
	.archives {
		margin-bottom: 6.51vw;
		padding-bottom: 4.557vw;
	}
	.archives .ttl {
		width: 40%;
		margin: auto;
	}
	.archives .txt {
		margin-top: 2.604vw;
		font-size: 3.2vw;
	}
}