@charset "utf-8";
/* CSS Document

1 top-header　メインイメージ
2 top-concept　コンセプト
3 top-tower, top-shop　店舗紹介
4 top-pickup　こだわり
5 top-gift　ギフト（商品ラインナップ）

*/
 
/* ===================== 1 top-header ===================== */

/* topメイン　背景bgswitcher */
.header-container {
	width: 100%;
	height: 600px;
	margin: 0 auto;
	padding: 0;
	background-repeat:no-repeat;
	background-position:center center;
	background-size:cover;
}

/* topメイン　h1 */
.top-header {
	display: flex;
	gap: 2em;
	padding-top: 240px;
	color: #800080;
	position: relative;
}


.top-header-logoarea {
	width: 120px;
	height: auto;
}

.top-h1 {
	text-shadow:
	0px 0px 5px #fff,0px 0px 5px #fff,0px 0px 5px #fff,0px 0px 5px #fff,
	0px 0px 10px #fff,0px 0px 10px #fff,0px 0px 10px #fff,0px 0px 10px #fff,
	0px 0px 30px #fff,0px 0px 30px #fff,0px 0px 30px #fff,0px 0px 30px #fff;
	letter-spacing: 2px;
	font-size: 45px;
}

.h1-txt {
	text-shadow:
	0px 0px 5px #fff,0px 0px 5px #fff,0px 0px 5px #fff,0px 0px 5px #fff,
	0px 0px 10px #fff,0px 0px 10px #fff,0px 0px 10px #fff,0px 0px 10px #fff,
	0px 0px 30px #fff,0px 0px 30px #fff,0px 0px 30px #fff,0px 0px 30px #fff;
	letter-spacing: 4px;
	font-weight: 600;
	font-size: 20px;
}

.top-header-bnr {
	position: absolute;
	bottom: 2em;
	right: 2em;
	width: 35%;
	max-width: 200px;
	margin: 0 0 0 auto;
}

@media(max-width:768px){

.top-header {
	flex-direction: column;
	gap:1em;
	text-align: center;
	padding-top: 150px;
}

.top-header-logoarea {
	margin: 0 auto;
}

}

@media(max-width:500px){

.header-container {
	height: 400px;
}

.top-header {
	padding-top: 80px;
}

.top-h1 {
	line-height: 1.2em;
	font-size: 1.8em;
}

.h1-txt {
	line-height: 1.4em;
	padding-top: 1em;
	font-size: 1em;
}

.top-header-bnr {
	position: absolute;
	bottom: 0em;
	right: 0em;
	width: 35%;
	max-width: 200px;
	margin: 0 0 0 auto;
}

}



/* ===================== 2 top-concept ===================== */

.top-concept {
	width: 100%;
	margin: 0 auto;
	background-color: #370037;
	text-align: center;
	padding: 1em 0;
	color: #ffc;
}

.top-h2 {
	font-size: 1.4em;
	color: #fff;
	font-weight: 600;
}

@media(max-width:500px){

.top-h2 {
	font-size: 1.2em;
}

.top-concept .sp-txt-br {
	display: none;
}

.top-concept {
	font-size: .9em;
}

}


/* ===================== 3 top-tower, top-shop ===================== */

.top-tower {
	width: 100%;
	margin: 0 auto;
	padding: 70px 0;
	background-image: url("../img/bg_tower.jpg");
	background-position: bottom left;
	background-repeat: no-repeat;
	background-size: cover;
	text-shadow:
	0px 0px 10px #fff,0px 0px 10px #fff,0px 0px 10px #fff,0px 0px 10px #fff,
	0px 0px 30px #fff,0px 0px 30px #fff,0px 0px 30px #fff,0px 0px 30px #fff;
}

.top-tower-box {
	display: grid;
	grid-template-columns: 55% 40%;
	gap: 5%;
	box-sizing: border-box;
}

.top-tower-ttl {
	font-size: 1.8em;
	color: #800080;
	font-weight: 600;
	padding-bottom: 1em;
	line-height: 1.5em;
}

.cl-violet {
	color: #800080;
	font-weight: 600;
}

.top-shop {
	width: 100%;
	margin: 0 auto;
	padding: 70px 0;
	background-image: url("../img/bg_shop.jpg");
	background-position: bottom right;
	background-repeat: no-repeat;
	background-size: cover;
	text-shadow:
	0px 0px 10px #fff,0px 0px 10px #fff,0px 0px 10px #fff,0px 0px 10px #fff,
	0px 0px 30px #fff,0px 0px 30px #fff,0px 0px 30px #fff,0px 0px 30px #fff;
}

.top-shop-box {
	display: grid;
	grid-template-columns: 40% 55%;
	gap: 5%;
	box-sizing: border-box;
}

.shop-txt {
	order: 2;
}

.shop-img {
	order: 1;
	text-align: center;
}


@media (max-width:768px) {

.top-tower {
	background-position: bottom left -100px;
	background-size: auto;
	padding: 2em 0 70px;
}

.top-shop {
	background-position: bottom right -150px;
	background-size: auto;
	padding: 2em 0 70px;
}

.top-tower-box,
.top-shop-box {
	grid-template-columns: repeat(1, 1fr);
	gap: 1em;;
}

.tower-txt {
	order: 2;
}

.tower-img {
	order: 1;
	text-align: center;
}

}



@media(max-width:500px){

.top-tower-ttl {
	font-size: 1.6em;
}

}



/* ===================== 4 top-pickup ===================== */

.top-pickup {
	width: 100%;
	margin: 0 auto;
	padding-bottom: 3em;
	background-color: #f1eeeb;
}

.top-pickup-ttl {
	width: 100%;
	margin: 0 auto 1em;
	background-image: url("../img/bg_sign.gif");
	background-repeat: repeat-x;
	background-size: contain;
	background-position: center center;
	text-align: center;
	color: #fff;
	font-size: 1.8em;
}

.top-h3 {
	background-color: #606;
	font-weight: 600;
	padding: .5em 0;
}

.top-pickup-ul {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 4em;
	justify-content: center;
}

.top-pickup-li-ttl {
	font-size: 25px;
	color: #800080;
	font-weight: 600;
	text-align: center;
	padding: .5em 0 .2em;
	line-height: 1.4em;
}


@media (max-width:768px) {

.top-pickup-ul {
	grid-template-columns: repeat(1, 1fr);
	gap: 2em;
}

}

@media(max-width:500px){

.top-pickup-ttl {
	font-size: 1.5em;
}

}



/* ===================== 5 top-gift ===================== */

.top-gift-txt {
	text-align: center;
}

.top-gift-box {
	width: 100%;
	margin: 4em auto;
	padding: 0 0 3em;
	background-color: #f1eeeb;
}

.top-gift-box-ttl {
	margin-top: -60px;
}


/* slick slider */

    .slider {
        width: 100%;
        margin: 2em auto 0;
    }

    .slick-slide {
      margin: 0px 5px;
    }

    .slick-slide img {
      width:auto;
	  height:450px;
    }
	
	.slide_target {
  	pointer-events: none;
	}

.top-gift-box .sld-name {
	width: 100%;
	background-color: #000;
	color: #fff;
	font-weight: 400;
	text-align: center;
}


@media (max-width:500px) {

.top-gift-box-ttl {
	margin-top: -35px;
	width: 80%;
}

.slick-slide img {
      width:auto;
	  height:400px;
    }

}



/* END */