@charset "utf-8";
/*index*/

/*indexのみヘッダー処理*/
header{
	background-color: transparent;
	transition:0.3s;
}
main{
	margin-top: 0;
}
@media (min-width:768px) {
	main{
		margin-top: 0;
	}
}
/**/


.likeTtl01Wrap{
	width:90%;
	max-width:1520px;
	margin:0 auto 40px;
	text-align:left;
}
.likeTtl01{
	border-bottom: 1px dotted #000;
	font-size:clamp(40px,6vw,60px);
	font-family: "Cinzel", serif;
	font-weight: normal;
	text-align:left;
	display:flex;
	justify-content: flex-start;
	align-items: center;
	width:auto;
	line-height: 1.5;
}
.likeTtl01::before{
	content:"";
	display:flex;
	width:0.25em;
	height:0.25em;
	border-radius:0.05em;
	background-color:#000;
	margin-right:0.5em;
}
@media (min-width:768px){
	.likeTtl01{
		display:inline-flex;
		width:auto;
		margin-left:0;
		margin-right:auto;
	}
}
.likeTxt01{
	font-size:clamp(16px,1.8vw,18px);
	text-align:left;
	line-height: 2;
	font-family: "Noto Sans JP", sans-serif;
	margin-bottom:3em;
}
/**/

/*固定背景*/
body::before{
    content: "";
    display: block;
    position: fixed;
    top: 0;
    left: 0;
    z-index: -1;
    width: 100%;
    height: 100vh;
    background: url(../images/likes/mainbg_sp.jpg) center no-repeat;
    background-size: cover;
}
@media (min-width:768px){
	body::before{
	    background: url(../images/likes/mainbg.jpg) center no-repeat;
	}
}

/**/
.main01{
/*
	background-image: url(../images/likes/mainbg_sp.jpg);
	background-size:cover;
	background-position:center center;
	background-repeat: no-repeat;
*/
	padding-bottom:180px;
	padding-bottom:clamp(180px,18vw,220px);
}
@media (min-width:768px){
	.main01{
/*
		background-image: url(../images/likes/mainbg.jpg);
		*/
	}
}
.main01 .img01{
	width:90%;
	margin-left:5%;
	margin-top:-6vw;
	max-width:620px;
	position: relative;
	z-index:2;
}
@media (min-width:768px){
	.main01 .img01{
		width:35%;
		margin-left:10%;
		margin-top:-2vw;
		max-width:622px;
	}
}

.main01 .slide{
	width:100%;
	padding-top:clamp(140px,14vw,200px);
}
.main01 .slide .slick-slide{
	margin:0 6vw 0;
	box-shadow: 16px 16px 16px rgba(0, 0, 0, 0.16);
	border-radius:8px;
}
.main01 .slide img{
	border-radius:8px;
}
@media (min-width:640px){
	.main01 .slide .slick-slide{
		margin:0 2.5vw 0;
	}
}
/**/

/**/
.like01{
	width:90%;
	margin:0 auto;
	padding-bottom:min(15vw,120px);
}
.like01 .txtwrap{}
.like01 .txtwrap .ttl01{
	text-align:left;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-direction: column;
	margin-top:-10.5rem;
	height:10.5rem;
	position: absolute;
}
.like01 .txtwrap .ttl01 p{
	display: inline-block;
	background-color:#fff;
	padding:0.3em 0.5em;
	line-height: 1.5;
}
.like01 .txtwrap .ttl01 .txt01{
	font-size:2rem;
}
.like01 .txtwrap .ttl01 .txt02{
	font-size:3rem;
}
@media (min-width:768px){
	.like01 .txtwrap .ttl01{
		margin-top:-170px;
		height:170px;
	}
	.like01 .txtwrap .ttl01 p{
		padding:15px 40px;
	}
	.like01 .txtwrap .ttl01 .txt01{
		font-size:3.2rem;
	}
	.like01 .txtwrap .ttl01 .txt02{
		font-size:5.4rem;
	}
}
.like01 .txtwrap .txt03{
	text-align: left;
	font-size:1.6rem;
	line-height: 2;
	padding-top:2em;
	padding-bottom:2em;
	width:90%;
	margin-left:auto;
	margin-right:auto;
}
.like01 .img01{
	width:90%;
	margin-left:auto;
	margin-right:auto;

}
.like01 .img01 img{
	filter: drop-shadow(8px 8px 16px rgba(0,0,0,0.16));
}

@media (min-width:768px){
	.like01{
		display:flex;
		justify-content: space-between;
		align-items: flex-start;
		flex-direction: row-reverse;
		margin:0 auto;
		max-width:1200px;
	}
	.like01 .txtwrap{
		width:calc(64% / 1.2);
	}
	.like01 .txtwrap .txt03{
		padding-top:70px;
		font-size:min(2.4rem,24px);
		line-height: 2.5;
	}
	.like01 .img01{
		width:calc(48% / 1.2);
		padding-top:70px;
	}
}

.like02{
	width:90%;
	margin:0 auto;
	max-width:1200px;
}
.movie{
	position: relative;
	width: 100%;
	margin:0 auto;
}
.movie video{
	width: 100%;
}
.movie .play-btn{
	display: block;
	width: 10%;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translateY(-50%) translateX(-50%);
	-webkit- transform: translateY(-50%) translateX(-50%);
	cursor: pointer;
}
.movie .play-btn.playActive{display:none;}


.like03{
	width:90%;
	margin:0 auto;
	max-width:1200px;
}
.like03 .img01{
	width:90%;
	margin:0 auto;
}
@media (min-width:768px){
	.like03 .img01{
		width:100%;
	}
}
.like03 .txt01{
	font-size:clamp(20px,3.2vw,32px);
	max-width:660px;
	margin:0 auto 50px;
	padding:1em 0;
	position: relative;
	line-height: 2;
}
.like03 .txt01::before,
.like03 .txt01::after{
	content: "";
	position: absolute;
	display: block;
	width:clamp(40px,5vw,50px);
	height:clamp(40px,5vw,50px);
}
.like03 .txt01::before{
	left:0;
	top:0;
	border-top:1px solid #000;
	border-left:1px solid #000;
}
.like03 .txt01::after{
	right:0;
	bottom:0;
	border-bottom:1px solid #000;
	border-right:1px solid #000;
}
.like03 .txt02{
	font-family: "Noto Sans JP", sans-serif;
	font-size:clamp(16px,2vw,20px);
	line-height: 2.4;
}
.like03 .em01{
	font-weight: bold;
}
.like03 .em02{
	border-bottom: 1px solid #000;
}



.lifestyle{
	background-image: url(../images/likes/style_bg.png);
	background-position: top right 5%;
	background-repeat: no-repeat;
	background-size:35% auto;
}
@media (min-width:768px){
	.lifestyle{
		background-position: top right 15%;
		background-size:26% auto;
	}
}
/**/
.styleNav{
	width:90%;
	max-width:1200px;
	margin:40px auto 25px;
	display: flex;
	justify-content: flex-start;
	align-items: flex-start;
	flex-wrap: wrap;
}
.styleNav li{
	width:33.3%;
	cursor: pointer;
	transition-duration: 0.2s;
}
.styleNav li:hover{
	opacity:0.7;
}
	@media (min-width:640px){
	.styleNav{
		margin:40px auto 80px;
	}
	.styleNav li{
		width:20%;
	}
}
/**/
.styleSlide{
	width:100%;
	margin:0 auto;
}
.styleSlide li{
	text-align:left;
	margin-left:5vw;
	margin-right:5vw;
}
.styleSlide li .img{
	box-shadow: 16px 16px 32px rgba(0, 0, 0, 0.16);
}
.styleSlide li .img.dammy{
	background-color:#eee;
	aspect-ratio: 8 / 4.8;
}
.styleSlide li .logo{
	background-color:#fff;
	display:inline-block;
	padding:10px;
	margin-top:-15px;
}
.styleSlide li .logo img{
	width:auto;
	height:20px;
}
.styleSlide li .txt{
	font-size:clamp(14px,2vw,20px);
	line-height: 2;
	font-family: "Noto Sans JP", sans-serif;
}
@media (min-width:640px){
	.styleSlide li{
		margin-left:2.6vw;
		margin-right:2.6vw;
	}
	.styleSlide li .logo{
		padding:15px 20px;
	}
	.styleSlide li .logo img{
		width:auto;
		height:40px;
	}
	.styleSlide li .txt{
		margin-top:1.5em;
	}
}
/**/

/**/
.colorselect{
	background-image: url(../images/likes/color_bg.png);
	background-position: top right 5%;
	background-repeat: no-repeat;
	background-size:35% auto;
}
@media (min-width:768px){
	.colorselect{
		background-position: top right 15%;
		background-size:26% auto;
	}
}
.colorWrap01{
	width:90%;
	max-width:1200px;
	margin:0 auto;
}
.colorWrap01 .unit01{
	background-color:#fff;
	margin-bottom:40px;
	text-align:center;
	padding-bottom:clamp(25px,5vw,50px);
}
.colorWrap01 .unit01 .img{
	width:100%;
	margin-bottom:clamp(20px,4vw,40px);
}
.colorWrap01 .unit01 .logo{
	width:auto;
	height:clamp(80px,14vw,140px);
	margin-bottom:clamp(16px,3vw,32px);
}
.colorWrap01 .unit01 .logo img{
	width:auto;
	height:clamp(80px,14vw,140px);
}
.colorWrap01 .unit01 .txt01{
	font-size:clamp(22px,3vw,30px);
	color:#493A00;
	margin-bottom:0.5em;
}
.colorWrap01 .unit01 .txt02{
	font-size:clamp(16px,2vw,20px);
	font-family: "Noto Sans JP", sans-serif;
}

@media (min-width:768px){
	.colorWrap01{
		display: flex;
		justify-content: space-between;
		align-items: stretch;
	}
	.colorWrap01 .unit01{
		width:48%;
	}
}


.premiumWrap01{
	width:90%;
	max-width:1200px;
	margin:0 auto;
	padding:30px;
	background-color:#fff;
}
.premiumWrap01 .unit01{
	padding-bottom:30px;
	margin-bottom:25px;
	border-bottom:1px solid #206464;
	text-align:center;
}
.premiumWrap01 .unit01:last-of-type{
	padding-bottom:0;
	margin-bottom:0;
	border-bottom:0;
}
.premiumWrap01 .unit01 .logo{
	width:auto;
	height:clamp(130px,20vw,200px);
	margin-bottom:clamp(15px,3vw,30px);
}
.premiumWrap01 .unit01 .logo img{
	width:auto;
	height:clamp(130px,20vw,200px);
}
.premiumWrap01 .unit01 .txt01{
	font-size:20px;
	color:#548686;
	margin-bottom:0.5em;
}
.premiumWrap01 .unit01 .txt02{
	font-size:16px;
	font-family: "Noto Sans JP", sans-serif;
}

@media (min-width:768px){
	.premiumWrap01{
		display: flex;
		justify-content: space-between;
		align-items: stretch;
		padding:40px 0;
	}
	.premiumWrap01 .unit01{
		width:25%;
	}
	.premiumWrap01 .unit01{
		padding-bottom:0;
		margin-bottom:0;
		border-bottom:0;
		border-right:1px solid #206464;
	}
	.premiumWrap01 .unit01:last-of-type{
		padding-bottom:0;
		margin-bottom:0;
		border-bottom:0;
		border-right:0;
	}
	.premiumWrap01 .unit01 .txt01{
		font-size:20px;
		height:4em;
		line-heigt:2em;
		display: flex;
		justify-content: center;
		align-items: center;
	}
}