@import url("https://use.typekit.net/bnf7jzd.css");

@media (max-width: 767px) {
	.lp * {
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}
}

/* ==========================================================================
Typograpgy
========================================================================== */
.masterpiece {
	/*
		ATOMIC SETTINGS/EXTEND CLASSES
	========================================================================== 
	*/
	color: #343434;
}
.masterpiece .credit_main {
	font-family: classico-urw, toppan-bunkyu-mincho-pr6n, sans-serif;
	font-weight: 400;
	font-style: normal;
	-webkit-font-feature-settings: "palt";
	font-feature-settings: "palt";
	color: #525252;
	letter-spacing: 0.14em;
}

/* ==========================================================================
Base
========================================================================== */
.breadlist.lp {
    margin: 6rem auto;
    width: 90rem;
    font-size: 1.2rem;
}

.masterpiece{
	width: 100%;
	max-width: 90rem;
	margin: 0 auto;
	margin-top: 5rem;
}

.masterpiece .break-pc{
	display: block;
}

.masterpiece .break-sp{
	display: none;
}

.masterpiece__caption{
	margin-bottom: 9rem;
}

.masterpiece__ttl{
	margin-bottom: 3.4rem;
    font-size: 3rem;
    font-weight: 500;
    line-height: 1.6;
    text-align: center;
    letter-spacing: 0.18em;
}

.masterpiece__subttl{
	font-size: 1.4rem;
    text-align: center;
    letter-spacing: 0.085em;
    line-height: 2.2;
}

.masterpiece__subttl.masterpiece__subttl--1{
	margin-bottom: 1.4rem;
}

.masterpiece__subttl.masterpiece__subttl--2{
	letter-spacing: 0.025em;
}

.masterpeice__content-ttl{
	width: 100%;
    max-width: 68rem;
    margin: 0 auto;
    margin-bottom: 5rem;
}

.masterpeice__content-ttl .content-ttl-number{
	text-align: left;
}

.masterpeice__content-ttl .content-ttl{
	text-indent: 1rem;
}

.masterpiece__content-one{
	display: flex;
	flex-direction: column;
	margin-bottom: 14.4rem;
}

.masterpiece__content-one-img-wrap{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
	margin-bottom: 2rem;
}

.masterpiece__content-one-img{
	width: 100%;
	max-width: 44rem;
}

.masterpiece__content-one-link{
	margin-left: auto;
	margin-bottom: 4.1rem;
	text-align: right;
}

.masterpiece__content-one-link--1{
	margin-bottom: 0.5rem;
}

.masterpiece__content-one-link img{
	width: 100%;
	max-width: 4.5rem;
	margin-left: 2rem;
}

.masterpiece__content-one-link a{
	font-size: 1.2rem;
}

.masterpiece__content-one-text p{
	font-size: 1.4rem;
	line-height: 2.1;
	letter-spacing: 0.02em;
}

.masterpiece__content-one-text .masterpiece__content-one-text--1{
	margin-bottom: 1.6rem;
}

.masterpiece__content-two{
	margin-bottom: 15rem;
}

.masterpiece__content-two-img-wrap{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
	margin-bottom: 5rem;
}

.masterpiece__content-two-img,
.masterpiece__content-two-img-inner{
	width: 100%;
	max-width: 44rem;
}

.masterpiece__content-two-img-inner div:nth-child(1){
	display: block;
	margin-bottom: 2rem;
}

.masterpiece__content-two-ttl{
	width: 100%;
	max-width: 50rem;
	margin-bottom: 2.3rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid #343434;
	font-size: 1.8rem;
	text-align: left;
}

.masterpiece__content-two-text p{
	font-size: 1.4rem;
	line-height: 2.1;
	letter-spacing: 0.03em;
}

.masterpiece__content-three{
	margin-bottom: 13.8rem;
}

.masterpiece__content-three-img-wrap{
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	align-items: center;
	margin-bottom: 4.7rem;
}

.masterpiece__content-three-img{
	width: 100%;
	max-width: 44rem;
}

.masterpiece__content-three-ttl{
	width: 100%;
	max-width: 50rem;
	margin-bottom: 2.3rem;
	padding-bottom: 1rem;
	border-bottom: 1px solid #343434;
	font-size: 1.8rem;
	text-align: left;
}

.masterpiece__content-three-text p{
	font-size: 1.4rem;
	line-height: 2.1;
	letter-spacing: 0.028em;
}

.masterpiece__collection{
	margin-bottom: 10rem;
}

.masterpiece__collection-ttl{
	margin-bottom: 3rem;
	font-size: 2.8rem;
	text-align: center;
	letter-spacing: 0.1em;
}

.masterpiece__collection-img-wrap{
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 2rem;
}

.masterpiece__collection-img-wrap img{
	width: 100%;
	max-width: 44rem;
}

.masterpiece__collection-link-wrap{
	margin-left: auto;
	margin-bottom: 2rem;
	text-align: right;
}

.masterpiece__collection-link-wrap--1{
	margin-bottom: 0.5rem;
}

.masterpiece__collection-link-wrap img{
	width: 100%;
	max-width: 4.5rem;
	margin-left: 2rem;
}

.masterpiece__collection-link-wrap a{
	font-size: 1.2rem;
}

.btnViewAll{
	width: 100%;
	max-width: 46rem;
	margin: 0 auto;
	margin-bottom: 10rem;
}

.btnViewAll a{
	display: block;
}

@media screen and (min-width: 768px) and (max-width: 920px) {
	html{
		font-size: calc(10*(100vw/920));
	}
}

@media screen and (max-width: 767px){
	.breadlist.lp {
		line-height: calc(40 * (100vw / 750));
		font-size: calc(20 * (100vw / 750));
		margin: calc(25 * (100vw / 750)) 0;
		width: 100%;
		text-align: left;
		padding: 0;
	}

	.masterpiece {
		margin-top: calc(48*(100vw/750));
	}

	.masterpiece .break-pc{
		display: none;
	}
	
	.masterpiece .break-sp{
		display: block;
	}

	.masterpiece__caption {
		margin-bottom: calc(80*(100vw/750));
	}

	.masterpiece__ttl {
		margin-bottom: calc(36*(100vw/750));
		font-size: calc(34*(100vw/750));
		line-height: 1.7;
	}

	.masterpiece__subttl {
		font-size: calc(22*(100vw/750));
		line-height: 1.5;
		letter-spacing: 0;
	}

	.masterpiece__subttl.masterpiece__subttl--1{
		margin-bottom: calc(13*(100vw/750));
	}

	.masterpeice__content-ttl .content-ttl-number{
		font-size: calc(40*(100vw/750));
	}

	.masterpeice__content-ttl {
		max-width: calc(600*(100vw/750));
		margin-bottom: calc(50*(100vw/750));
		font-size: calc(25*(100vw/750));
	}

	.masterpiece__content-one {
		margin-bottom: calc(150*(100vw/750));
	}

	.masterpiece__content-one-img-wrap {
		justify-content: center;
		order: 1;
		margin-bottom: calc(50*(100vw/750));
	}

	.masterpiece__content-one-img {
		max-width: calc(550*(100vw/750));
	}

	.masterpiece__content-one-img-wrap div:nth-child(1){
		margin-bottom: calc(10*(100vw/750));
	}

	.masterpiece__content-one-link {
		order: 2;
		margin-bottom: 0;
	}

	.masterpiece__content-one-link--1 {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		margin-bottom: calc(25*(100vw/750));
	}

	.masterpiece__content-one-link--2{
		display: flex;
		justify-content: flex-end;
		align-items: center;
	}

	.masterpiece__content-one-link img {
		max-width: calc(70*(100vw/750));
		margin-left: calc(20*(100vw/750));
	}

	.masterpiece__content-one-link a {
		font-size: calc(22*(100vw/750));
	}

	.masterpiece__content-one-text{
		order: 1;
	}

	.masterpiece__content-one-text p {
		font-size: calc(22*(100vw/750));
		line-height: 1.6;
		letter-spacing: 0.12em;
	}

	.masterpiece__content-one-text .masterpiece__content-one-text--1 {
		margin-bottom: calc(30*(100vw/750));
	}

	.masterpiece__content-one-text .masterpiece__content-one-text--2 {
		margin-bottom: calc(50*(100vw/750));
	}

	.masterpiece__content-two {
		margin-bottom: calc(150*(100vw/750));
	}

	.masterpiece__content-two-img-wrap {
		justify-content: center;
		margin-bottom: calc(50*(100vw/750));
	}

	.masterpiece__content-two-img,
	.masterpiece__content-two-img-inner {
		max-width: calc(550*(100vw/750));
		margin: 0 auto;
	}

	.masterpiece__content-two-img-inner{
		margin-top: calc(10*(100vw/750));
	}

	.masterpiece__content-two-img-inner div:nth-child(1){
		display: block;
		margin-bottom: calc(10*(100vw/750));
	}

	.masterpiece__content-two-ttl {
		max-width: calc(400*(100vw/750));
		margin-bottom: calc(30*(100vw/750));
		padding-bottom: calc(10*(100vw/750));
		font-size: calc(22*(100vw/750));
		font-weight: 500;
	}

	.masterpiece__content-two-text p {
		font-size: calc(22*(100vw/750));
		line-height: 1.6;
		letter-spacing: 0.12em;
	}

	.masterpiece__content-three {
		margin-bottom: calc(150*(100vw/750));
	}

	.masterpiece__content-three-img-wrap {
		justify-content: center;
		margin-bottom: calc(50*(100vw/750));
	}

	.masterpiece__content-three-img {
		max-width: calc(550*(100vw/750));
	}

	.masterpiece__content-three-img:nth-child(1){
		margin-bottom: calc(10*(100vw/750));
	}

	.masterpiece__content-three-ttl {
		max-width: calc(400*(100vw/750));
		margin-bottom: calc(30*(100vw/750));
		padding-bottom: calc(10*(100vw/750));
		font-size: calc(22*(100vw/750));
		font-weight: 500;
	}

	.masterpiece__content-three-text p {
		font-size: calc(22*(100vw/750));
		line-height: 1.6;
		letter-spacing: 0.14em;
	}

	.masterpiece__collection {
		margin-bottom: calc(100*(100vw/750));
	}

	.masterpiece__collection-ttl {
		margin-bottom: calc(30*(100vw/750));
		font-size: calc(25*(100vw/750));
	}

	.masterpiece__collection-img-wrap {
		margin-bottom: calc(20*(100vw/750));
	}

	.masterpiece__collection-img-wrap img {
		max-width: calc(315*(100vw/750));
	}

	.masterpiece__collection-link-wrap {
		display: flex;
		justify-content: flex-end;
		align-items: center;
		margin-bottom: calc(50*(100vw/750));
	}

	.masterpiece__collection-link-wrap a {
		font-size: calc(22*(100vw/750));
	}

	.masterpiece__collection-link-wrap img {
		max-width: calc(70*(100vw/750));
		margin-left: calc(20*(100vw/750));
	}

	.btnViewAll {
		max-width: calc(460*(100vw/750));
		margin-bottom: calc(100*(100vw/750));
	}
}