@charset "UTF-8";

html {
	font-size: 62.5%;
}

*{
	box-sizing:border-box;
}
img {
    width: auto;
    height: auto;
}

a {
    outline: none;
}


body {
    color: #111;
    margin: 0 auto;
	font-family: "Noto Sans JP", sans-serif !important;
	line-height:1.8;
}

.tit01{
	margin-bottom:25px;
	text-align:center;
}
.tit01 span{
	display:inline-block;
	padding:3px 40px;
	font-size:clamp(16px , 2.0vw , 18px);
	border:solid 1px #111;
}

/* ----------------------
 *.header
 * --------------------- */
.header{
}
.header h1{
	width:100%;
	max-width:780px;
	margin:0 auto;
	padding:10px 0 20px;
	line-height:0;
}
.header h1 img{
	width:100%;
	max-width:342px;
}
@media screen and (max-width: 780px) { /* smartphone */
	.header h1{
		max-width:calc( 100% - 30px);
	}
	.header h1 img{
		width:300px;
	}
}

/* ----------------------
 * mainTit
 * --------------------- */
 .mainTit{
	width:100%;
	max-width:780px;
	margin:0 auto 30px;
 }
 .mainTit .tit{
	 color:#af9857;
	font-size:clamp(21px , 2.7vw , 58px);
 }
 .mainTit .date{
	 color:#af9857;
	font-size:clamp(16px , 2.3vw , 24px);
 }
 .mainTit .date span{
	font-size:clamp(14px , 1.8vw , 16px);
 }
@media screen and (max-width: 798px) { /* smartphone */
	 .mainTit{
		max-width:calc( 100% - 30px);
	}
}
@media screen and (max-width: 400px) { /* smartphone */
	 .mainTit{
		 margin-bottom:15px;
	}
}

/* ----------------------
 *mainViusual 
 * --------------------- */
.mainViusual{
	background:url(../img/mainVisual_bk.png) no-repeat center center;
	background-size:cover;
	padding:clamp(15px , 1.9vw  ,45px);
	margin-bottom:clamp( 40px , 5.2vw , 95px);
}
.mainViusual h1{
	text-align:center;
	width:100%;
	max-width:798px;
	height:auto;
	margin:0 auto;
}
.mainViusual h1 img{
	width:100%;
	height:auto;
}
/*@media screen and (max-width: 798px) {
	.mainViusual h1{
		max-width:calc( 100% - 30px);
	}
}*/

/* ----------------------
 * titArea
 * --------------------- */
.titArea{
	display:flex;
	flex-wrap:wrap;
	gap:15px 3%;
	margin-bottom:clamp(25px , 3.2vw , 45px);
}
.titArea .pic{
	width:25%;
}
.titArea .pic img{
	width:100%;
	max-width:195px;
	height:auto;
}
.titArea .cnt{
	width:72%;
}
.titArea .cnt .tit{
	font-weight:bold;
	font-size:clamp(18px , 2.3vw , 24px);
	margin-bottom:15px;
}
.titArea .cnt .txt{
	font-size:clamp(14px , 1.8vw , 18px);
}
@media screen and (max-width: 450px) { /* smartphone */
	.titArea .pic{
		text-align:center;
		width:100%;
	}
	.titArea .cnt{
		width:100%;
	}
}
/* ----------------------
 * lineup__titarea 
 * --------------------- */
.lineup__titarea{
	margin-bottom:40px;
}
.lineup__tit{
	font-size:clamp(19px , 2.4vw , 36px);
	text-align:center;
	margin-bottom:clamp( 15px , 1.9vw , 20px);
}
.lineup__lead{
	font-size:clamp(14px , 1.8vw , 18px);
	text-align:center;
	line-height:2;
}
@media screen and (max-width: 767px) { /* smartphone */
	.lineup__lead{
	}
}
/* ----------------------
 * picGalley 
 * --------------------- */
.picGalley{
	display:flex;
	flex-wrap:wrap;
	gap:40px 40px;
}
.picGalley li{
	width:calc( (100% - 40px) / 2);
}
.picGalley li .pic{
	text-align:center;
	margin-bottom:10px;
}
.picGalley li .pic img{
	display:block;
	width:100%;
	height:auto;
}
.picGalley li .tit{
	text-align:center;
	font-size:clamp(14px , 1.8vw , 18px);
}
@media screen and (max-width: 767px) { /* smartphone */
	.picGalley{
		gap:20px 20px;
	}
	.picGalley li{
		width:calc( (100% - 20px) / 2);
	}
}
@media screen and (max-width: 400px) { /* smartphone */
	.picGalley{
		gap:20px 10px;
	}
	.picGalley li{
		width:calc( (100% - 0px) / 1);
	}
}








/* ----------------------
 * content
 * --------------------- */
.content {
	width: 100%;
    max-width: 798px;
    margin: 0px auto;
	color: #12265C;
	box-sizing: border-box;
}
@media screen and (max-width: 798px) {
	 .content {
		padding: 0 15px;
	}
}
.content img {
	max-width: 100%;
}

.content__inner__01 {
	margin-bottom: 100px;
}
@media screen and (max-width: 798px) {
	 .content__inner__01 {
		margin-bottom: 75px;
	}
}
.content__inner__02 {
	margin-bottom: 50px;
}
@media screen and (max-width: 798px) {
	 .content__inner__02 {
		margin-bottom: 30px;
	}
}
.content__inner__02 .title__area {
	display: flex;
	flex-direction: column-reverse;
}
.content__inner__02 .title__area h2 {
	font-size: 3rem;
	margin-bottom: 40px;
}
@media screen and (max-width: 798px) {
	 .content__inner__02 .title__area h2 {
		 font-size: 2.4rem;
		 margin-bottom: 30px;
	}
}
.content__inner__02 .title__area p {
	font-family: "Marcellus", serif;
    font-weight: 400;
	font-style: normal;
    font-size: 1.6rem;
    line-height: 1;
    letter-spacing: 0.05em;
    margin: 0;
}
.cont02__box01 {
	display: flex;
	background: #F2EEE8;
	padding: 15px 30px;
	border-radius: 50px;
	margin-bottom: 10px;
}
@media screen and (max-width: 798px) {
	 .cont02__box01 {
		 flex-direction: column;
		 padding: 10px 20px;
		 border-radius: 5px;
		 margin-bottom: 5px;
	}
}
.cont02__box01 p {
	font-size: 1.6rem;
}
@media screen and (max-width: 798px) {
	 .cont02__box01 p {
		font-size: 1.4rem;
	}
}
.cont02__box01 p:first-child {
	color: #99826B;
	font-weight: 600;
	width: 20%;
}
.cont02__box01 p:last-child {
	width: 75%;
}
@media screen and (max-width: 798px) {
	.cont02__box01 p:first-child,
	.cont02__box01 p:last-child{
		width: 100%;
	}
}

.content__inner__03 {
	margin-bottom: 100px;
}
@media screen and (max-width: 798px) {
	 .content__inner__03 {
		margin-bottom: 75px;
	}
}
.content__inner__03 .title__area {
	display: flex;
	flex-direction: row-reverse;
	align-items: center;
	justify-content: flex-end;
}
.content__inner__03 .title__area h2 {
	font-size: 1.8rem;
	font-weight: 600;
}
@media screen and (max-width: 798px) {
	 .content__inner__03 .title__area h2 {
		 line-height: 120%;
		 letter-spacing: 1.1px;
	}
}
@media screen and (min-width: 799px) {
	 .content__inner__03 .title__area h2 br {
		 display: none;
	}
}
.content__inner__03 dl {
    width: 90px;
    height: 90px;
    color: #fff;
    background: #12265C;
    border-radius: 50%;
    display: flex;
	flex-direction: column;
    justify-content: center;
    align-items: center;
	margin-right: 20px;
	z-index: 10;
}
@media screen and (max-width: 798px) {
	 .content__inner__03 dl {
		 width: 70px;
		 height: 70px;
		 margin-right: 10px;
	}
}
.content__inner__03 dl dt {
    font-size: 1.8rem;
	display: block;
	line-height: 110%;
}
@media screen and (max-width: 798px) {
	 .content__inner__03 dl dt {
		 font-size: 1.6rem;
	}
}
.content__inner__03 dl dd {
    font-size: 3.6rem;
	display: block;
	font-family: "EB Garamond", serif;
	font-optical-sizing: auto;
	line-height: 100%;
}
@media screen and (max-width: 798px) {
	 .content__inner__03 dl dd {
		 font-size: 2.8rem;
	}
}
.content__inner__03 .pic__01 {
	margin: -10px 0 15px;
	display: block;
	z-index: 1;
}
@media screen and (max-width: 798px) {
	 .content__inner__03 .pic__01 {
		 margin-top: -5px;
	}
}
.content__inner__03 .pic__02 {
	margin: 20px 0 15px;
}

.box__link {
	background: #E5DDD3;
	width: 798px;
	padding: 50px;
	margin: 0 auto;
}
@media screen and (max-width: 798px) {
	 .box__link {
		 width: 100%;
		 box-sizing: border-box;
		 padding: 30px 15px;
	}
}
.box__link a img {
	width: 100%;
}
.box__link a:hover img {
	opacity: 0.7;
}


.txt__01 {
	font-size: 1.8rem;
	line-height: 2;
}
@media screen and (max-width: 798px) {
	.txt__01 {
		font-size: 1.6rem;
		line-height: 1.6;
	}
}
.txt__02 {
	font-size: 1.4rem;
	line-height: 1.6;
}
@media screen and (max-width: 798px) {
	.txt__02 {
		font-size: 1.3rem;
		line-height: 1.5;
	}
}











/* ----------------------
 * daily
 * --------------------- */
 .daily {
	 margin-bottom:clamp(50px  , 6.5vw , 100px);
 }
 .daily .inner{
	width:100%;
	max-width:780px;
	margin:0 auto;
 }

/* ----- */
.daily-pics-lst{
	display:flex;
	flex-wrap:wrap;
	gap:25px 30px;
}
.daily-pics-lst li{
	width:calc( (100% - 60px) / 3);
}
.daily-pics-lst li img{
	width:100%;
	height:auto;
}

@media screen and (max-width: 798px) { /* smartphone */
	 .daily .inner{
		max-width:calc( 100% - 30px);
	}

	.daily-pics-lst{
		display:flex;
		flex-wrap:wrap;
		gap:10px 10px;
	}
	.daily-pics-lst li{
		width:calc( (100% - 30px) / 3);
	}

}
/* ----------------------
 * create3D
 * --------------------- */
 .create3D {
	 margin-bottom:clamp(50px  , 6.5vw , 100px);
 }
 .create3D .inner{
	width:100%;
	max-width:780px;
	margin:0 auto;
 }
 /* ---- */
.create3D .imgCenter{
	margin-bottom:20px;
	position:relative;
}
.create3D .imgCenter:before{
	content:"";
	display:block;
	width:11.5%;
	height:86px;
	background:url("../img/mainImage_3d_label.png") no-repeat center top;
	background-size:100% auto;
	position:absolute;
	right:10%;
	top:-10%;
	z-index:10;
}
.create3D .imgCenter img{
	position:relative;
	width:100%;
	height:auto;
	z-index:1;
}
.create3D .txt{
	font-size:clamp(14px , 1.8vw , 18px);
}

@media screen and (max-width: 798px) { /* smartphone */
	 .create3D .inner{
		max-width:calc( 100% - 30px);
	}
}
@media screen and (max-width: 798px) { /* smartphone */
	.create3D .imgCenter:before{
		width:50px;
	}
}
/* ----------------------
 * newstyle
 * --------------------- */
 .newstyle {
	 margin-bottom:clamp(50px  , 6.5vw , 100px);
 }
 .newstyle .inner{
	width:100%;
	max-width:780px;
	margin:0 auto;
 }

.newstyle .picGalley li .pic{
	border:solid 1px #111;
}

@media screen and (max-width: 798px) { /* smartphone */
	 .newstyle .inner{
		max-width:calc( 100% - 30px);
	}
}
/* ----------------------
 * ecowood
 * --------------------- */
 .ecowood {
	 margin-bottom:clamp(50px  , 6.5vw , 100px);
 }
 .ecowood .inner{
	width:100%;
	max-width:780px;
	margin:0 auto;
 }
@media screen and (max-width: 798px) { /* smartphone */
	 .ecowood .inner{
		max-width:calc( 100% - 30px);
	}
}
/* ----------------------
 * workshop
 * --------------------- */
 .workshop {
	 margin-bottom:clamp(50px  , 6.5vw , 100px);
 }
 .workshop .inner{
	width:100%;
	max-width:780px;
	margin:0 auto;
 }
@media screen and (max-width: 798px) { /* smartphone */
	 .workshop .inner{
		max-width:calc( 100% - 30px);
	}
}
/* ----------------------
 * shopArea
 * --------------------- */
 .shopArea {
	 margin-bottom:clamp(50px  , 6.5vw , 100px);
 }
 .shopArea .inner{
	width:100%;
	max-width:780px;
	margin:0 auto;
 }
.shopArea_main{
	margin-bottom:30px;
}
.shopArea_main img{
	width:100%;
	height:auto;
}
/* ----- */
.shopLst{
	padding:0 20px;
	display:flex;
	flex-wrap:wrap;
	gap:45px 20px;
}
.shopLst li{
	width:calc( ( 100% - 60px) / 4 );
}
.shopLst li a{
	color:#111;
	text-decoration:none;
}
.shopLst li .tit{
	margin-bottom:10px;
	font-size:clamp(12px , 1.5vw , 14px);
}
.shopLst li .tit .en{
	display:block;
	text-align:center;
}
.shopLst li .tit .ja{
	display:block;
	text-align:center;
}
.shopLst li .pic{
}
.shopLst li .pic img{
	width:100%;
	height:auto;
}

@media screen and (max-width: 798px) { /* smartphone */
	 .shopArea .inner{
		max-width:calc( 100% - 30px);
	}
	.shopLst{
		padding:0 5px;
		gap:25px 5px;
	}
	.shopLst li{
		width:calc( ( 100% - 10px) / 3 );
	}

	.shopLst a[href="/shop/yokohamamotomachi/"] .en{
		letter-spacing:-1px;
	}
}

@media screen and (max-width: 450px) { /* smartphone */
	.shopLst{
		gap:25px 10px;
	}
	.shopLst li{
		width:calc( ( 100% - 10px) / 2 );
	}
	.shopLst a[href="/shop/yokohamamotomachi/"] .en{
		letter-spacing:normal;
	}
}

/* ----------------------
 * footerArea
 * --------------------- */
.footerArea{
}
.footerArea .inner{
	width:100%;
	max-width:780px;
	margin:0 auto;
}
/* ----- */
.footerArea .pageTop{
	text-align:center;
	padding:clamp( 30px , 3.9vw , 100px) 0;
}
.footerArea .pageTop img{
	width:100%;
	max-width:77px;
}
/* ----- */
.footerArea .links{
	text-align:center;
	margin-bottom:20px;
}
.footerArea .links li{
	display:inline-block;
	padding-right:1em;
}
.footerArea .links li:last-child{
	padding-right:0;
}
/* ----- */
.footerArea .txt{
	text-align:center;
}
.footerArea .txt span{
	font-weight:bold;
}
.footerArea address{
	margin-top:15px;
	border-top:solid 1px #ccc;
	padding:20px 15px;
	text-align:center;
}

@media screen and (max-width: 780px) { /* smartphone */
	.footerArea .inner{
		max-width:calc( 100% - 30px);
	}
}
@media screen and (max-width: 400px) { /* smartphone */
	.footerArea .pageTop img{
		max-width:50px;
	}
}