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

html {
	font-size: 62.5%; /* -> 10px; */
    padding-top: constant(safe-area-inset-top);
    padding-bottom: constant(safe-area-inset-bottom);
    padding-left: constant(safe-area-inset-left);
    padding-right: constant(safe-area-inset-right);
    padding-top: env(safe-area-inset-top);
    padding-bottom: env(safe-area-inset-bottom);
    padding-left: env(safe-area-inset-left);
    padding-right: env(safe-area-inset-right);
	}
body{
	margin:0;
	padding:0;
	font-size: 1.0rem; /* -> 10px; */
	color:#353535;
	font-family: "Avenir", Verdana, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Lato", sans-serif, "メイリオ", "Meiryo";
    overscroll-behavior: none;
	}
ul,li,ol,dl,dt,dd{
	margin:0;
	padding:0;
	list-style:none;
	}
table,tr,td,th,p,h1,h2,h3,h4,h5,figure{
	margin:0;
	padding:0;
	}
img{
	max-width:100%;
	}
a{
	text-decoration:none;
	color:#AC55BA;
	}
.delet{
	text-decoration:line-through;
		}

/* 共通 */
.ViewWrap{
    position: relative;
    z-index: 1;
}
.Wrap{
	display:block;
	width:100%;
    background-color: #fff;
    padding-top:110px;
	}
.WrapMain{
	display:block;
    background-color: #fff;
	}
.p13{font-size:1.3rem;}
.p14{font-size:1.4rem;}
.p18{font-size:1.8rem;}
.p24{font-size:2.4rem;}
.p30{font-size:3.0rem;}
.pRed{color:#FF0040;}
.linethrough{
	text-decoration: line-through;
}

/* グローバルメニュー */
#head{
    /*fixedで上部固定*/
	position: fixed;
	height: 82px;
	width:100%;
    z-index: 999;/*最前面へ*/
	/*以下はレイアウトのためのCSS*/
	text-align: center;
	padding: 10px;
    border-bottom:1px solid #ccc;
	top: env(safe-area-inset-top);
	left: 0; /* 固定する位置 */
	background-color:#fff;
    transition:.5s;
    margin-top: env(safe-area-inset-top);
    padding-top: calc(env(safe-area-inset-top) + 10px);
}

/*　上に上がる動き　*/
#head.UpMove{
	animation: UpAnime 0.5s forwards;
}

@keyframes UpAnime{
  from {
    opacity: 1;
	transform: translateY(0);
  }
  to {
    opacity: 0;
	transform: translateY(-100%);
  }
}
/*　下に下がる動き　*/
#head.DownMove{
	animation: DownAnime 0.5s forwards;
}
@keyframes DownAnime{
  from {
  	opacity: 0;
	transform: translateY(-100%);
  }
  to {
  	opacity: 1;
	transform: translateY(0);
  }
}

.GlobalNavLogo{
	display:block;
	height:36px;
	}
.GlobalNavLogo img{
	height:36px;
	}
.GlobalNavList{
	display:table;
	table-layout:fixed;
	height:46px;
	width:100%;
	}
.GlobalNavList li{
	display:table-cell;
	vertical-align:middle;
	font-size:1.3rem;
	}
.GlobalNavList li img{
	width:18px;
	vertical-align:middle;
	}
.GlobalNavList li a{
	color:#353535;
	font-size:1.4rem;
	display:block;
	width:100%;
	font-weight:bold;
	line-height:4.6rem;
	}
.GlobalNavList li a:hover{
	color:#87E03E;
	}

/* index */
.TopImage{
    display: block;
    position: fixed;
    top:0;
    width:100%;
    max-width: 2000px;
    height:90vh;
    background-image: url("../img/top_2026.jpg");
    background-size: cover;
    background-position: 45% center;
    z-index: -999;
}
.IndexWrap{
    width:100%;
    margin-top:90vh;
    background-color: #fff;
}
.TopPickWrap{
	display:block;
	padding:15px 15px 0 15px;
	}
.TopPickWrap h1{
	font-size:2.5rem;
	font-weight:bold;
	line-height:4.8rem;
	text-align:center;
	padding:15px 0;
	}
.videoFlex {
	margin-bottom:20px;
}
@media screen and (min-width:600px){
	.TopPickVideo{
		display:flex;
		flex-wrap: nowrap;
		justify-content: center;
		align-items: flex-start;
	}
	.videoFlex{
		flex-basis:50%;
		padding:5px;
		}
}
.TopPickList{
	display:table;
	width:100%;
	border-bottom:1px solid #ccc;
	text-align:left;
	table-layout:fixed;
	}
.TopPickList a:hover{
	width:100%;
	opacity:0.5;
	}
.TopPickList:first-child{
	border-top:1px solid #ccc;
	}
.TopPickList dt{
	display:table-cell;
	overflow: hidden;
	width:150px;
	height:75px;
	position: relative;
/*	padding:10px 0;*/
	}
.TopPickList dt img {
	width: 100%;
	height: 75px;
    object-fit: cover;
}
.TopPickList dd{
	display:table-cell;
	padding:10px;
	vertical-align:top;
	color:#353535;
	position:relative;
	font-size:1.4rem;
	}
.TopPickList dt a,.TopPickList dd a{
	width:100%;
	}
.TopPickList dt a:hover,.TopPickList dd a:hover{
	opacity:0.5;
	}

.TopPickListCate{
	color:#AC55BA;
	}
.TopPickListCate span{
	color:#777777;
	}
	
.TopPickColl{
	display:block;
	padding:15px 10px 0 10px;
}

.TopPickColl h1{
	font-size:2.5rem;
	font-weight:bold;
	line-height:4.8rem;
	text-align:center;
	padding:15px 0;
	}
.TopPickThumb{
	display:table;
	table-layout:fixed;
	width:100%;
	margin:0;
	}
.TopPickThumb li{
	display:table-cell;
	padding:5px;
	position:relative;
	}
.TopPickThumb li a .mask {
	width:calc(100% - 10px);
	height:calc(100% - 15px);
	position:absolute;	/* 絶対位置指定 */
	top:5px;
	left:5px;
	opacity:0;	/* マスクを表示しない */
	background-color:rgba(0,0,0,0.4);	/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition:all 0.2s ease;
}
.TopPickThumb li a:hover .mask {
	opacity:1;	/* マスクを表示する */
}
.TopPickThumb li a .caption {
	font-size:1.2rem;
	text-align:center;
	color:#fff;
	width:100%;
	height:100%;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
	-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
 	justify-content: center; /* 横方向中央揃え */
	vertical-align: middle;
}
.VideoWrap{
	display:block;
	padding:5px;
	max-width:400px;
	margin:15px auto;
	}
.Video{
	position:relative;
	width:100%;
	height:0;
	padding-top:56.25%;
	margin:0 auto;
	}
.Video iframe{
	position:absolute;
	top:0;
	right:0;
 	width:100%;
 	height:100%;
	}
.Base {
	max-width: 100%;
	display:block;
	text-align:center;
	margin-bottom:15px;
}
.Base iframe{
	width:100%;
	max-width:350px;
	display:block;
	margin:0 auto;
	}

.TopPickAbout{
	display:block;
	padding:15px 15px 0 15px;
	}
.TopPickAbout h1{
	font-size:2.5rem;
	font-weight:bold;
	line-height:4.8rem;
	text-align:center;
	padding:15px 0;
	}
.TopPickAbout p{
	font-size:1.5rem;
	margin-bottom:0.5em;
	}
p.midashi{
	font-size:1.8rem;
	color:#F2AAC3;
	margin-bottom:10px;
	text-align:center;
	vertical-align:center;
	}
.StoreList li{
	list-style-type: disc;
	font-size:1.5rem;
	margin-left:32px;
	margin-bottom:0.5em;
	}

.TopInsta{
	display:block;
	background-color:#353535;
	margin:30px 0 -29px 0;
	padding:15px 15px 15px 15px;
	text-align:center;
	}
.TopInsta h1{
	font-size:2rem;
	font-weight:bold;
	color:#fff;
	}	
.TopInsta p{
	font-size:1.4rem;
	margin-bottom:10px;
	color:#fff;
	}
#instafeed.brand {
	display:-webkit-flex;
	display: flex;
	flex-shrink:1;
	-webkit-flex-direction:row; /* Safari */
  	flex-direction:row;
    justify-content: flex-start;
	-webkit-flex-wrap:row; /* Safari */
    flex-wrap: unwrap;
	}
.flexitem {
	 background-color:#fff;
	}
.SNS-Thumb {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 50px;
    height: 36px;
}
.SNS-Thumb img {
    height: 36px;
}

/* サブページ */
.SubWrap{
	display:block;
	padding:0 15px 15px 15px;
	}
.SubWrap h1{
	font-size:2rem;
	font-weight:bold;
	line-height:1.35em;
	text-align:center;
	margin:30px 0 15px 0;
	}
.SubWrap h2{
	font-size:1.8rem;
	font-weight:bold;
	line-height:1.35em;
	text-align:center;
	border-bottom:1px dashed #ccc;
	margin:30px 0 15px 0;
	
	}
.SubWrap .txt{
	font-size:1.4rem;
	line-height:1.8em;
	margin-bottom:1em;
	}
.SubWrap blockquote{
	font-size:1.4rem;
	line-height:1.8em;
}
.SubWrap .columnMidashi{
    font-size: 16px;
    border-bottom: 1px dashed #ccc;
    padding-bottom:4px;
    margin-bottom:1em;
}
.column-img-top {
    text-align: center;
}
.column-img-top img {
    margin-left: auto;
    margin-right: auto;
}
.column-box {
	border: 1px solid #ddd;
	border-radius: 6px;
	background-color: #eee;
	counter-reset: #888;
	padding: 12px;
	font-size: 1.4rem;
	line-height: 1.8em;
	margin-bottom: 1rem;
}	
.BreadNav{
	display:block;
	text-align:legft;
	padding:15px 0 0 0;
	color:#777;
	}
.SubWrap figure{
	margin:15px 0;
	}
.SubWrap figcaption{
	font-size:1.2rem;
	color:#777;
	}
.SubWrap figure .img-clumn{
	object-fit: contain;
	 }
.SubWrap figure .imgList{
	display: -moz-flex;
	display: -ms-flex;
	display: -o-flex;
	display: -webkit-flex; /* Safari */
  	display: flex;
  	-webkit-flex-wrap:wrap; /* Safari */
  	flex-wrap:wrap;
	-webkit-justify-content:space-around; /* Safari */
	justify-content:space-around;
	}
.SubWrap figure .imgList li{	
	width:230px;
	}
.SubWrap figure .imgList li img{	
	width:230px;
	}
.SubWrap p.TopPickListCate{
	font-size:1.2rem;
	margin-bottom:0;
	}
.SubWrap .TopPickList dd p{
	margin-bottom:0;
	font-size:1.4rem;
	}
.EventArchive{
	font-size:1.4rem;
	display:table;
	width:100%;
	margin-bottom:0.5em;
	text-align:left;
	}
.EventArchive dt{
	display:table-cell;
	width:8em;
	vertical-align:top;
}
.EventArchive dd{
	display:table-cell;
	vertical-align:top;
}
	
.EventData{
	font-size:1.4rem;
	display:table;
	width:100%;
	margin-bottom:1em;
	text-align:left;
	line-height:1.8em;
	}
.EventData dt{
	display:table-cell;
	width:5em;
	vertical-align:top;
}
.EventData dd{
	display:table-cell;
	vertical-align:top;
}	

.columnBox{
    background-color:#eee;
	display: block;
	padding:15px;
	margin-bottom:15px;
	font-size: 1.4rem;
    line-height: 1.8em;
}
.TopPickListFlex{
	display: block;
	margin-top: 30px;
}
.footShopColl{
	display:block;
	padding:15px 10px 0 10px;
}

.footShopColl h2{
	font-size:2rem;
	font-weight:bold;
	line-height:4rem;
	text-align:center;
	padding:15px 0;
	}
.footShopThumb{
	display:table;
	table-layout:fixed;
	width:100%;
	margin:0;
	}
.footShopThumb li{
	display:table-cell;
	padding:5px;
	position:relative;
	}
.footShopThumb li a .mask {
	width:calc(100% - 10px);
	height:calc(100% - 15px);
	position:absolute;	/* 絶対位置指定 */
	top:5px;
	left:5px;
	opacity:0;	/* マスクを表示しない */
	background-color:rgba(0,0,0,0.4);	/* マスクは半透明 */
	-webkit-transition:	all 0.2s ease;
	transition:all 0.2s ease;
}
.footShopThumb li a:hover .mask {
	opacity:1;	/* マスクを表示する */
}
.footShopThumb li a .caption {
	font-size:1.2rem;
	text-align:center;
	color:#fff;
	width:100%;
	height:100%;
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center; /* 縦方向中央揃え（Safari用） */
	align-items: center; /* 縦方向中央揃え */
	-webkit-justify-content: center; /* 横方向中央揃え（Safari用） */
 	justify-content: center; /* 横方向中央揃え */
	vertical-align: middle;
}
.topInfoList{
	margin:20px 0 10px 0;
	font-size: 1.6rem;
	line-height: 1.8em;
	text-align: left;
}
.topInfoList li{
	list-style: disc;
	margin:0 0 10px 1.5em;
	border-bottom:1px dotted #ccc;
}	
.topInfoList li a{
	color:#353535;
}	
.topInfoList li a:hover{
	color: #AC55BA;
}

.buttonOut{
	display: block;
	font-size: 1.5rem;
	background-color: #fff;
	color: #AC55BA;
	line-height: 3em;
	padding: 0 15px;
	margin: 0 auto;
	text-align: center;
	border-radius: 3rem;
	border:1px solid  #AC55BA;
	margin-bottom:15px;
	max-width:300px;
}
.buttonOut:hover{
	background-color: #AC55BA;
	color: #fff;
}

/* フッター */
.FooterWrap{
	display:block;
	padding:30px 0;
	margin-top:30px;
	background-color:#353535;
	color:#fff;
	text-align:center;
	}

/*トップへ戻るボタン*/
#page-top {
    position: fixed;
    bottom: 20px;
    right: 20px;
    font-size: 80%;
}

#page-top a {
    display: block;
    background: #666;
    color: #fff;
    width: 80px;
    text-align: center;
    text-decoration: none;
    border-radius: 20px;
	font-size:1.2rem;
	line-height:50px;
}
#page-top a:hover {
    background-color:#999999;
    text-decoration: none;
}

@media screen and (min-width:768px){
	#head{
		height:106px;
		}
	.GlobalNavLogo{
		height:50px;
		margin-top:10px;
		}
	.Wrap{
		text-align:center;
		display:flex;
		flex-flow: column nowrap;
        padding-top:130px;
		}
	.WrapMain{
		width:800px;
        margin:0 auto;
		}
	footer{
		margin-top:auto;
		}
	.GlobalNavList li a{
		font-size:1.6rem;
		}
    .TopImage{
        background-position: center center;
    }
	.TopPickWrap h1{
		font-size:2.5rem;
		line-height:6rem;
		}
	.TopPickListFlex{
		display: -webkit-flex;
		display: -moz-flex;
		display: -ms-flex;
		display: -o-flex;
		display: flex;
		webkit-flex-wrap: wrap; /* Safari */
		flex-wrap:wrap;
		-webkit-justify-content: space-around; /* Safari */
		justify-content: space-around;
		}
	.TopPickList{
		display:block;
		border:1px solid #ccc;
		width:248px;
		margin-bottom:20px;
	}
	.TopPickList dt{
		display:display;
		width:248px;
		float:left;
		}
	.TopPickList dd{
		display:display;
		width:218px;
		float:left;
		border-top:1px solid #ccc;
		padding:15px;
		min-height:57px;
		}
	.TopPickColl h1{
		font-size:2.5rem;
		line-height:6rem;
		}
	.TopPickThumb li a .caption{
		font-size:1.4rem;
		}
	.TopPickAbout h1{
		font-size:2.5rem;
		line-height:6rem;
		}
	.TopPickAbout p{
		font-size:1.6rem;
		line-height:1.8em;
		}
	.StoreList li{
		list-style-type:none;
		}
	.TopInsta{
		margin:30px 0 30px 0;
		}
	.TopInsta h1{
		font-size:2.5rem;
		}
	p.midashi{
		font-size:2rem;
		text-align:center!important;
		}

	/* サブページ */	
	.SubWrap{
		width:700px;
		text-align:left;
		margin:0 auto;
		display:block;
		}
	.SubWrap h1{
		font-size:2.2rem;
		}
	.SubWrap .txt{
		font-size:1.6rem;
		}
	.BreadNav{
		font-size:1.2rem;
		}
	.SubWrap figure{
		margin:16px 0;
		}
	.SubWrap .TopPickList{
		width:215px;
		margin-top:20px;
		}
	.SubWrap .TopPickList dt{
		width:215px;
		}
	.SubWrap .TopPickList dd{
		width:185px;
		}
	.SubWrap .TopPickList dd p{
		font-size:1.4rem;
		}
	.SubWrap .TopPickList dd p.TopPickListCate{
		font-size:1rem;
		}
	.SubWrap .BreadNav p{
		font-size:1.2rem;
		}	
	.EventArchive{
		font-size:1.6rem;
	}
	.EventData{
		font-size:1.6rem;
		width:calc(100% - 30px);
		margin:0 auto 1em auto;
		}
}