@charset "utf-8";

:root {
  --MainWidth: 1000px;
  --MainColor: #af995b !important;
  --MainShadow: 0 0 4px rgb(0 0 0 / 30%);
  --MainPadding: 60px 0 80px 0;
  --PaleColor: #ede2b9 !important;
  --PickupColor: #fa2727;
}

.header_change{position: fixed !important;transition: .5s;width: 100%;z-index: 1000;background-color: #fff;}
.header_change .Sub{
    display: none !important;
}
.header_change.show{top: 0;border: none;}
.header_change.show:after{}


article .btn{}
article .btn a{
	position: relative;
	display: inline-block;
	text-decoration: none;
	padding: 15px 80px;
	background-color: var(--MainColor);
	color: #fff;
	border-radius: 3px;
	}
article .btn a:after{position: absolute;right: 8px; top:50%; margin-top:-0.5em;content:"\f105"; font-family:FontAwesome; line-height: 1}
article .btn a:hover{
    background-color: #897640;
}
article .photo .caption{
    line-height: 1.4;
    font-size: 12px;
    text-align: right;
    padding-top: 3px;
}
.CommonTtl{
	text-align: center;
	position: relative;
	color: var(--MainColor);
	width: var(--MainWidth);
	margin: 0 auto;
	margin-bottom: 35px;
}

article strong.pickup{
    color: var(--PickupColor);
    font-weight: bold;
    font-size: 17px;
}
.CommonTtl:before{content:"";width: 50px;display: block;border-top: 2px solid var(--MainColor);margin: 0 auto;margin-bottom: 35px;}
.CommonTtl .main{
	font-size: 30px;
	padding-bottom: 15px;
}
.CommonTtl .FontEn{
	font-size: 14px;
	font-weight: normal;
	letter-spacing: 1px;
}

.CommonMainTxt{
	width: var(--MainWidth);
	margin: 0 auto;
	text-align: center;
	font-size: 16px;
	line-height: 1.9;
	margin-bottom: 40px;
	position: relative;
	color: var(--MainColor);
}
.CommonList li{padding-left:16px;line-height: 1.7;}
.CommonList li:before{content:"\f0c8";display:block;float:left;margin-left: -13px;width:1em;text-align:center;margin-top: 3px;font-family:FontAwesome;font-size: 10px;color: var(--MainColor);}

/*--------------------------------------------MV*/
#MV{background-image:url(../images/MV.jpg);/* padding: 70px 0px; */position: relative;padding-bottom: 60px;background-size: cover;background-position: center;}
#MV:before{content: "";background-color: rgb(0 0 0 / 50%);position: absolute;top: 0;left: 0;width: 100%;height: 100%;}
#MV .MVbox{width: 870px;margin: 35px auto 0 auto;background-color: rgb(0 0 0 / 40%);padding: 30px;box-sizing: border-box;position: relative;color: #fff;text-align: center;border: 1px solid rgb(225 202 91 / 70%);border-radius: 3px;}
#MV .MVbox:before{content: "";background-image: url(../images/MV_icon.png);position: absolute;width: 170px;height: 160px;display: block;top: -10px;left: -15px;background-position: center;background-repeat: no-repeat;background-size: contain;}
#MV .MVbox h1{
	padding-bottom: 20px;
}
#MV .MVbox h1 .sub{
	font-size: 19px;
	padding-bottom: 2px;
}
#MV .MVbox h1 .main{
	font-size: 30px;
}
#MV .MVbox .txt{
	line-height: 2.2;
	letter-spacing: 1px;
}
#MV .MVbox .btn{
	margin-top: 20px;
}
#MV .MVbox .btn a{border: 2px solid #d6bf7a;font-weight: bold;border-radius: 100px;color: #d6bf7a;}
#MV .MVbox .btn a:hover{
	background-color: #d6bf7a;
	color: #fff;
}


/*------------------------------------------menuArea*/
.menuArea{}
.menuArea .humb{display: none}
.menuArea .Inner{
	padding: 19px 0;
	/* box-shadow: 0 0 6px rgb(0 0 0 / 50%); */
}
.menuArea .Inner ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width: var(--MainWidth);
    margin: 0 auto;
}
.menuArea .Inner li{text-align:center;/* width: 16%; */font-weight: bold;line-height: 1;font-size: 15px;position: relative;}
.menuArea .Inner li + li{}
.menuArea .Inner li + li:before{content:"";border-left: 1px solid #cfcfcf;position: absolute;width: 1px;height: 100%;top: 0;left: -27px;}
.menuArea .Inner li a{text-decoration:none;display:block;color: #fff;}
.menuArea .Inner li a:hover{color: #bda662;}
.menuArea .Inner li a:after{content:"\f107";font-family:FontAwesome;display: block;font-weight: normal;font-size: 20px;padding-top: 1px;}

.menuArea.header_change{
	background-color: rgb(0 0 0 / 70%);
}
.menuArea.header_change .Inner{
}
.menuArea.header_change .Inner li a:after{
	content: none;
}

/*-------------------------------------MainTxt*/
#MainTxt{
    width: var(--MainWidth);
    margin: 0 auto;
    font-size: 15px;
    line-height: 1.9;
    margin-bottom: 30px;
}
#MainTxt p.txt{}
#MainTxt p.txt .pickup{ display:inline-block; border: 1px solid #CCC; padding: 10px; margin-top: 15px; font-size: 14px; }
#MainTxt .btn{
    width: 60%;
    margin: 0 auto;
}
#MainTxt .btn a{
    display: block;
    text-decoration: none;
    text-align: center;
    background-color: #bda661;
    border: 2px solid #bda661;
    color: #fff;
    border-radius: 100px;
    padding: 10px;
    position: relative;
}
#MainTxt .btn a:after{position: absolute;right: 8px; top:50%; margin-top:-0.5em;content:"\f105"; font-family:FontAwesome; line-height: 1}
#MainTxt .btn a:hover{
    background-color: #fff;
    color: #bda661;
}


/*-------------------------------------license*/
#license{
	background-image: linear-gradient(135deg, #fdfcfb 0%, #e2d1c3 100%);
	padding: var(--MainPadding);
}
#license .Inner{
	margin: 0 auto;
	width: var(--MainWidth);
}

#license h2{}
#license h2:before{
}

#license .CardList{
    display: flex;
    column-gap: 40px;
    margin-bottom: 40px;
}
#license .CardList dl{}
#license .CardList dl + dl{}
#license .CardList dt{
    line-height: 0;
    margin-bottom: 10px;
}
#license .CardList dt img{
    width: 100%;
}
#license .CardList dd{}
#license .CardList dd strong{
    display: block;
    font-size: 20px;
    text-align: center;
    padding-bottom: 5px;
    color: var(--MainColor);
}
#license .Info{
    background-color: #fff;
    box-shadow: var(--MainShadow);
    padding: 30px;
}
#license .Info dl{
    display: flex;
    flex-wrap: wrap;
}
#license .Info dt{width:12em;padding:10px;text-align:center;display: flex;justify-content: center;font-weight: bold;align-items: center;color: var(--MainColor);font-size: 14px;background-color: #efeae4;}
#license .Info dd{padding-left: 15px;font-size: 14px;flex: 1;line-height: 1.8;align-self: center;} 
#license .Info dd ul{}
#license .Info dd li{margin-top: 5px;}
#license .Info dd li + li{
}
#license .Info dd li strong{
    display: block;
    color: var(--MainColor);
}
#license .Info dd li em{
    font-weight: bold;
}
#license .Info dd li:before{}
#license .Info dl + dl{margin-top: 20px;}

#license .Info ul.atte{border: 2px solid #ffff;padding: 20px;margin-top: 30px;color: #fff;}
#license .Info ul.atte li{}
#license .Info ul.atte li + li{ padding-top:2px;}
#license .Info ul.atte li strong{
	color: #fff6a1;
	font-size: 15px;
}


/*-------------------------------------Benefits*/
#Benefits{padding: var(--MainPadding);background: linear-gradient(to bottom, rgba(255, 255, 255, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%), radial-gradient(at top center, rgba(255, 255, 255, 0.40) 0%, rgba(0, 0, 0, 0.40) 120%) #7c7c7c;background-blend-mode: multiply,multiply;}
#Benefits h2{color: #fff;}
#Benefits h2:before{border-color: #fff;}
#Benefits .CommonMainTxt{
    color: #fff;
}
#Benefits .Inner{
	width: var(--MainWidth);
	margin: 0 auto;
}

#Benefits .zyoken{
    border: 3px solid #fff;
    padding: 15px;
    color: #fff;
    display: flex;
    margin-bottom: 60px;
    border-radius: 3px;
}
#Benefits .zyoken dt{
    background-color: #fff;
    color: #818181;
    font-weight: bold;
    padding: 10px;
    width: 6em;
    text-align: center;
    margin-right: 20px;
    display: flex;
    font-size: 16px;
    justify-content: center;
    align-items: center;
}
#Benefits .zyoken dd{
    flex: 1;
}
#Benefits .zyoken dd strong{
    font-size: 18px;
    display: block;
    color: var(--PaleColor);
    padding-bottom: 4px;
}
#Benefits .zyoken dd .atte{
    font-size: 13px;
    padding-top: 5px;
}

#Benefits .BenefitsList{
    margin-bottom: 60px;
}
#Benefits .BenefitsList .Tab{margin-left: 15px;margin-bottom: -5px;position: relative;z-index: 2;}
#Benefits .BenefitsList .Tab ul{
    display: flex;
    column-gap: 10px;
}
#Benefits .BenefitsList .Tab li{
    padding: 8px 20px 13px 20px;
    font-weight: bold;
    box-shadow: var(--MainShadow);
    background-color: var(--MainColor);
    color: #fff;
    -webkit-transition: all .3s ease-out;
}
#Benefits .BenefitsList .Tab li.select{
    background-color: #fff;
    margin-top: -10px;
    padding-top: 12px;
    color: var(--MainColor);
}
#Benefits .BenefitsList .Tab li:hover{
    cursor: pointer;
    background-color: #c5b681;
}
#Benefits .BenefitsList .Tab li.select:hover{
    background-color: #fff;
    color: var(--MainColor);
}
#Benefits .BenefitsList .TabEntryWrap{
    position: relative;
    background-color: #fff;
    border-radius: 3px;
}
#Benefits .BenefitsList .TabEntryWrap:before{content:"";position: absolute;width: 100%;height: 11px;background-color: #fff;top: 0;left: 0;z-index: 2;border-radius: 3px 3px 0 0;}
#Benefits .BenefitsList .TabEntry{
    padding: 20px 30px 30px 30px;
    box-shadow: var(--MainShadow);
    position: relative;
    opacity: 0;
    transform: translateY(10px);
    transition: opacity 0.4s ease, transform 0.4s ease; /* ここでアニメーション時間を調整 */
    display: none;
    border-radius: 3px;
}
#Benefits .BenefitsList .TabEntry.is-active{
	
display: block; /* 表示 */
	
opacity: 1;
	
transform: translateY(0);
}
#Benefits .BenefitsList .TabEntry h3{
    display: flex;
    white-space: nowrap;
    align-items: center;
    margin-bottom: 7px;
    color: var(--MainColor);
    font-size: 23px;
}
#Benefits .BenefitsList .TabEntry h3:after{content:"";width: 100%;height: 1px;background-color: var(--MainColor);margin-left: 6px;}
#Benefits .BenefitsList .TabEntry .point{
    font-size: 16px;
    font-weight: bold;
    color: var(--MainColor);
    padding-bottom: 12px;
}
#Benefits .BenefitsList .TabEntry dl{
    border: 1px solid #ccc;
    padding: 10px;
}
#Benefits .BenefitsList .TabEntry dl + dl{
    margin-top: 10px;
}
#Benefits .BenefitsList .TabEntry dt{
    font-weight: bold;
    font-size: 16px;
    padding-bottom: 1px;
}
#Benefits .BenefitsList .TabEntry dd{}
#Benefits .BenefitsList .TabEntry dd ul{
    display: flex;
    flex-wrap: wrap;
}
#Benefits .BenefitsList .TabEntry dd li{
    width: 48%;
    margin-top: 2px;
}
#Benefits .BenefitsList .TabEntry dd li + li{}
#Benefits .BenefitsList .TabEntry dd li:before{}


/*----------------------BenefitsPoint*/
#Benefits .BenefitsPoint{
    padding-bottom: 1px;
}
#Benefits .BenefitsPoint + .BenefitsPoint{}
#Benefits .BenefitsPoint + .BenefitsPoint:before{content: "◆◆◆";display: block;width: 100%;font-size: 10px;letter-spacing: 2px;color: #fff;text-align: center;margin-top: 20px;margin-bottom: 20px;}
#Benefits .BenefitsPoint h3{
    color: #fff;
    text-align: center;
    font-size: 26px;
    margin-bottom: 30px;
}

#Benefits .BenefitsPoint .icon{
    display: flex;
    column-gap: 5px;
    margin-bottom: 10px;
}
#Benefits .BenefitsPoint .icon span{
    display: inline-block;
    font-size: 13px;
    line-height: 1;
    padding: 5px 7px;
    /* border: 1px solid rgb(255 255 255 / 60%); */
    border-radius: 3px;
    color: #fff;
}
#Benefits .BenefitsPoint .icon span + span{}
#Benefits .BenefitsPoint .icon .premium{
    background-color: #998245;
}
#Benefits .BenefitsPoint .icon .platinum{
    background-color: #313131;
}
#Benefits .BenefitsPoint .icon .standard{
    background-color: #838383;
}
#Benefits .BenefitsPoint .Pickup{position: relative;display: flex;/* color: #fff; */padding: 25px;border: 1px solid #fff;border-radius: 3px;margin-bottom: 30px;background-color: #ebebeb;box-shadow: var(--MainShadow);}

#Benefits .BenefitsPoint .Pickup + .Pickup{
}
#Benefits .BenefitsPoint .Pickup .box{
	flex: 1;
	position: relative;
	z-index: 1;
}
#Benefits .BenefitsPoint .Pickup .box .point{
	/* transform: skew(8deg,-5deg); */
	background-color: #b29a57;
	color: #fff;
	font-weight: bold;
	/* position: absolute; */
	/* top: -9px; */
	/* left: -16px; */
	padding: 1px 8px;
	font-size: 15px;
	width: fit-content;
}
#Benefits .BenefitsPoint .Pickup .box dl{
    color: #000;
}
#Benefits .BenefitsPoint .Pickup .box dt{
	font-size: 21px;
	display: inline-block;
	margin-bottom: 8px;
}
#Benefits .BenefitsPoint .Pickup .box dd{
	line-height: 1.9;
	font-size: 14px;
	letter-spacing: 1px;
}
#Benefits .BenefitsPoint .Pickup .box dd + dd{
	margin-top: 10px;
}
#Benefits .BenefitsPoint .Pickup .box dd .title{
	font-weight: bold;
	font-size: 15px;
}
#Benefits .BenefitsPoint .Pickup .box dd strong{color: var(--MainColor);}
#Benefits .BenefitsPoint .Pickup .box dd .topic{
	border: 2px solid #ccc;
	padding: 5px 10px 10px 10px;
	font-size: 13px;
	margin-top: 5px;
}
#Benefits .BenefitsPoint .Pickup .box dd .topic a{
	display: inline-block;
	background-color: #bda662;
	color: #fff;
	font-weight: bold;
	padding: 0 18px 0 6px;
	border-radius: 2px;
	margin-top: 5px;
	text-decoration: none;
	position: relative;
}
#Benefits .BenefitsPoint .Pickup .box dd .topic a:hover{
	background-color: #a28d51;
}
#Benefits .BenefitsPoint .Pickup .box dd .topic a:after{position: absolute;right: 8px; top:50%; margin-top:-0.5em;content:"\f105"; font-family:FontAwesome; line-height: 1}
#Benefits .BenefitsPoint .Pickup .box dd.special{
	line-height: 1.4;
	background-color: rgb(0 0 0 / 20%);
	padding: 15px;
	border-radius: 3px;
}
#Benefits .BenefitsPoint .Pickup .box dd.special .title{
  position: relative;
  padding: 3px 12px;
  background: #b89bad;
  display: inline-block;
  font-size: 14px;
  margin-bottom: 13px;
  border-radius: 2px;
}

#Benefits .BenefitsPoint .Pickup .box dd.special .title:after {
  position: absolute;
  content: '';
  top: 100%;
  left: 30px;
  border: 8px solid transparent;
  border-top: 8px solid #b89bad;
  width: 0;
  height: 0;
}
#Benefits .BenefitsPoint .Pickup .box dd.special strong{
	color: #e4c2d7;
	font-size: 14px;
	display: inline-block;
	margin-top: 4px;
}
#Benefits .BenefitsPoint .Pickup .box dd.special strong em{
	font-size: 130%;
}

#Benefits .BenefitsPoint .Pickup .photo{
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	width: 380px;
	line-height: 0;
	margin-left: 30px;
}

#Benefits .BenefitsPoint .Pickup .photo img{
	width: 100%;
}
#Benefits .BenefitsPoint .Pickup .detail{
    display: flex;
    justify-content: space-around;
    align-items: flex-start;
    margin-top: 15px;
    background-color: #fff;
    padding: 20px;
    border-radius: 3px;
}

#Benefits .BenefitsPoint .Pickup .detail .discount{}
#Benefits .BenefitsPoint .Pickup .detail .discount .ItemBox{
}
#Benefits .BenefitsPoint .Pickup .detail .discount .ItemBox + .ItemBox{
    margin-top: 20px;
}
#Benefits .BenefitsPoint .Pickup .detail .discount .ItemBox .ttl{
    font-weight: bold;
    font-size: 15px;
    margin-bottom: 7px;
    line-height: 1.5;
}
#Benefits .BenefitsPoint .Pickup .detail .discount .ItemBox .ate{
    font-size: 12px;
    line-height: 1;
}

#Benefits .BenefitsPoint .Pickup .detail .list{
    width: 330px;
    border-top: 1px solid #dfd09a;
    border-right: 1px solid #dfd09a;
    margin-top: 8px;
}
#Benefits .BenefitsPoint .Pickup .detail .list dl{
    display: flex;
}
#Benefits .BenefitsPoint .Pickup .detail .list dt{
    border-left: 1px solid #dfd09a;
    border-bottom: 1px solid #dfd09a;
    padding: 8px 10px;
    width: 11em;
    text-align: center;
    background-color: var(--PaleColor);
    font-size: 14px;
    margin-bottom: 0;
    display: initial;
}
#Benefits .BenefitsPoint .Pickup .detail .list dd{
    border-left: 1px solid #dfd09a;
    border-bottom: 1px solid #dfd09a;
    padding: 8px 10px;
    flex: 1;
    text-align: center;
    font-size: 14px;
    line-height: 1.5;
}
#Benefits .BenefitsPoint .Pickup .detail .list dl + dl{}
#Benefits .BenefitsPoint .Pickup .detail .zyoken{
    flex: 1;
    display: block;
    border: none;
    padding: 0;
    padding-left: 30px;
}
#Benefits .BenefitsPoint .Pickup .detail .zyoken dt{
    font-weight: bold;
    font-size: 15px;
    border-bottom: none;
    margin-bottom: 5px;
    background-color: inherit;
    padding: 0;
    margin: 0;
    width: auto;
    margin-bottom: 5px;
}
#Benefits .BenefitsPoint .Pickup .detail .zyoken dd + dt{
    margin-top: 15px;
}
#Benefits .BenefitsPoint .Pickup .detail .zyoken dd{
    line-height: 1.5;
}
#Benefits .BenefitsPoint .Pickup .detail .zyoken ul{
    font-size: 13px;
}
#Benefits .BenefitsPoint .Pickup .detail .zyoken li{padding-left: 16px;}
#Benefits .BenefitsPoint .Pickup .detail .zyoken li + li{
    padding-top: 5px;
}
#Benefits .BenefitsPoint .Pickup .detail .zyoken li:before{content:"\f058";display:block;float:left;margin-left: -16px;width:1em;text-align:center;font-family:FontAwesome;}


#Benefits .BenefitsPoint .Other{
	display: flex;
	flex-wrap: wrap;
	margin-top: 30px;
	justify-content: space-between;
}
#Benefits .BenefitsPoint .Other:after{content:"";width: 30%;}
#Benefits .BenefitsPoint .Other dl{
	width: 48.5%;
	padding: 25px;
	box-sizing: border-box;
	margin-bottom: 30px;
	position: relative;
	border: 1px solid #fff;
	border-radius: 3px;
	background-color: #ebebeb;
	box-shadow: var(--MainShadow);
}

#Benefits .BenefitsPoint .Other dt{
    margin-bottom: 10px;
}
#Benefits .BenefitsPoint .Other dt .title{
    font-size: 20px;
    line-height: 1.4;
}
#Benefits .BenefitsPoint .Other dd{line-height: 1.9;font-size: 14px;letter-spacing: 1px;}
#Benefits .BenefitsPoint dd .Ssize{
	font-size: 13px;
	line-height: 1.8;
	display: block;
}
#Benefits .BenefitsPoint .Other dd ul{}
#Benefits .BenefitsPoint .Other dd li{}
#Benefits .BenefitsPoint .Other dd li + li{
	margin-top: 10px;
}



/*-------------------------------------Rewards*/
#Rewards{
	padding: var(--MainPadding);
	background-image: conic-gradient(from 45deg at 50% 50%, #eeecec 90deg, transparent 90deg 180deg, #eeecec 180deg 270deg, transparent 270deg);
	background-size: 48px 48px;
	background-color: #f2f2f2;
}

#Rewards .Intro{
	width: var(--MainWidth);
	margin: 0 auto;
	margin-top: 40px;
	border: 1px solid #ccc;
	padding: 35px;
	box-sizing: border-box;
	background: linear-gradient(to bottom, rgba(226,226,226,1) 0%,rgba(219,219,219,1) 50%,rgba(254,254,254,1) 100%);
	position: relative;
	display: flex;
	justify-content: space-between;
	margin-bottom: 20px;
}
#Rewards .Intro:before{content:"";position: absolute;width: calc(100% - 2px);height: calc(100% - 2px);top: 0;left: 0;border: 1px solid #fff;}
#Rewards .Intro .Main{
    flex: 1;
    position: relative;
    z-index: 2;
}

#Rewards .Intro dl{
}
#Rewards .Intro dl + dl{
	margin-top: 20px;
}
#Rewards .Intro dt{font-size: 17px;margin-bottom: 6px;background: linear-gradient(135deg, rgba(151, 137, 98, 1) 0%, rgba(198, 178, 129, 1) 100%);color: #fff;text-align: center;padding: 3px 0;}
#Rewards .Intro dd{
	font-size: 15px;
}
#Rewards .Intro dd .atte{
    font-size: 13px;
    display: inline-block;
    padding-top: 4px;
}
#Rewards .Intro dd ul{
    margin-top: 5px;
}
#Rewards .Intro dd li{}
#Rewards .Intro dd li + li{
    margin-top: 3px;
}
#Rewards .Intro dd li:before{
    margin-top: 4px;
}
#Rewards .Intro dd li strong{
    color: var(--MainColor);
}

#Rewards .Intro .photo{width: 360px;margin-left: 30px;position: relative;z-index: 2;}
#Rewards .Intro .photo img{
    width: 100%;
}
#Rewards .Intro .photo .caption{
    font-size: 12px;
    text-align: right;
}
#Rewards .Attention{
	position: relative;
	font-size: 14px;
	line-height: 1.8;
	width: var(--MainWidth);
	margin: 0 auto;
}
#Rewards .Attention ul{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    margin-top: 4px;
}
#Rewards .Attention li{width: 48%;}
/*-------------------------------------Event*/
#Event{
	background-color: #e7e7e7;
	padding: var(--MainPadding);
}
#Event .Inner{
	width: var(--MainWidth);
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
}
#Event .Inner .Entry{background-color: #fff;box-shadow: 0 0 4px rgb(0 0 0 / 40%);width: 31%;}
#Event .Inner .Entry + .Entry{
}
#Event .Inner .Entry .photo{
	width: 100%;
	line-height: 0;
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	height: 200px;
}
#Event .Inner .Entry .photo img{
	width: 100%;
}
#Event .Inner .Entry .Main{
	flex: 1;
	align-self: center;
	padding: 20px;
}
#Event .Inner .Entry .Main .data{
	display: flex;
	margin-bottom: 10px;
	align-items: center;
}
#Event .Inner .Entry .Main .data li{
	font-weight: bold;
}
#Event .Inner .Entry .Main .data li.icon{
	background-color: #e3e3e3;
	font-size: 12px;
	padding: 4px 7px;
	line-height: 1;
	margin-right: 8px;
	font-weight: normal;
}
#Event .Inner .Entry .Main h3{
	font-size: 15px;
	padding-bottom: 6px;
}
#Event .Inner .Entry .Main .txt{
	font-size: 14px;
	line-height: 1.8;
}


/*----------------------------------------Mailmagazine*/
#Mailmagazine{background-image:url(../images/mailmagazin_bg.webp);position: relative;background-position: center top;background-size: cover;background-repeat: no-repeat;padding: var(--MainPadding);}
#Mailmagazine:before{content:"";background-color: rgb(255 255 255 / 80%);width: 100%;height: 100%;position: absolute;top: 0;}
#Mailmagazine h2{width: auto;}

#Mailmagazine .Inner{
	width: 890px;
	margin: 0 auto;
	position: relative;
	padding-top: 20px;
	display: flex;
	justify-content: space-between;
}
#Mailmagazine .Inner .Main{
    flex: 1;
    align-self: center;
}
#Mailmagazine .Inner .Main .txt{
    font-size: 15px;
    line-height: 1.8;
}
#Mailmagazine .Inner .Main .txt + .txt{
    margin-top: 1em;
}
#Mailmagazine .Inner .Main .txt strong{
    display: block;
}
#Mailmagazine .Inner .Main .btn{
    margin-top: 40px;
    margin-bottom: 40px;
    text-align: center;
}
#Mailmagazine .Inner .Main .btn a{font-weight: bold;font-size: 16px;padding: 20px 100px;}
#Mailmagazine .Inner .Main .btn strong{
    display: block;
    color: var(--MainColor);
    padding-top: 3px;
    font-size: 15px;
}
#Mailmagazine .Inner .Main .atte{
    /* border: 2px solid #979797; */
    padding: 13px 15px;
    font-size: 15px;
    background-color: rgb(255 255 255 / 80%);
}
#Mailmagazine .Inner .photo{
    width: 290px;
    margin-left: 60px;
}
#Mailmagazine .Inner .photo .img{}
#Mailmagazine .Inner .photo .img img{
    width: 100%;
}
#Mailmagazine .Inner .photo .btn{}
#Mailmagazine .Inner .photo .btn a{
    display: block;
    padding: 10px 20px;
    text-align: center;
    margin: 0 20px;
    margin-top: 10px;
    background-color: inherit;
    border: 2px solid var(--MainColor);
    color: var(--MainColor);
    font-weight: bold;
    font-size: 13px;
}
#Mailmagazine .Inner .photo .btn a:hover{
    background-color: var(--MainColor);
    color: #fff;
}
/*-------------------------------------flow*/
#flow{padding: var(--MainPadding);}
#flow .Inner{
	width: var(--MainWidth);
	margin: 0 auto;
	background-color: #f3f3f3;
	padding: 30px;
	box-sizing: border-box;
}
#flow .Inner + .Inner{
    margin-top: 50px;
    background-color: #f1ede6;
}
#flow .Inner h3{
    text-align: center;
    font-size: 22px;
    display: flex;
    justify-content: center;
    align-items: center;
    column-gap: 5px;
    margin-bottom: 20px;
}
#flow .Inner h3 .icon{
    display: inline-block;
    font-size: 13px;
    line-height: 1;
    padding: 5px 7px;
    /* border: 1px solid rgb(71 64 64 / 60%); */
    border-radius: 2px;
    color: #fff;
    font-weight: normal;
    }
#flow .Inner h3 .icon.standard{background-color: #828282;}
#flow .Inner h3 .icon.premium{
    background-color: #938249;
}
#flow .Inner h3 span + span{
    color: var(--MainColor);
}
#flow .Inner.standard h3 span + span{
    color: #666;
}
#flow .Inner .Entry{
	border: 3px solid #d9c7a1;
	padding: 30px;
	box-sizing: border-box;
	text-align: center;
	position: relative;
}
#flow .Inner.standard .Entry{border: 3px solid #ccc;}
#flow .Inner .Entry:nth-of-type(3),
#flow .Inner .Entry:nth-of-type(4){}
#flow .Inner .Entry + .Entry{margin-top: 70px;}
#flow .Inner .Entry + .Entry:before{content: "\f107";font-family:FontAwesome;position: absolute;top: -64px;left: 50%;font-size: 40px;transform: translate(-50%, 0%);color: #bda661;}
#flow .Inner.standard .Entry + .Entry:before{
    color: #666;
}
#flow .Inner .Entry:nth-of-type(3),
#flow .Inner .Entry:nth-of-type(4){
	margin-top: 80px;
}
#flow .Inner .Entry:nth-of-type(3):before,
#flow .Inner .Entry:nth-of-type(4):before{}
#flow .Inner .Entry .icon{
	text-align: center;
	display: inline-block;
	background-color: #f0ede6;
	color: #bda661;
	font-size: 21px;
	letter-spacing: 0;
	line-height: 1;
	position: absolute;
	top: -30px;
	left: 30px;
	padding: 0px 10px;
}
#flow .Inner.standard .Entry .icon{
    color: #666;
    background-color: #f3f3f3;
}
#flow .Inner .Entry .icon strong{
	font-weight: normal;
	font-size: 40px;
	font-style: italic;
}
#flow .Inner .Entry dl{
	text-align: left;
}
#flow .Inner .Entry dt{
	font-weight: bold;
	padding-bottom: 10px;
	line-height: 1.4;
	font-size: 18px;
	color: #bda661;
}
#flow .Inner.standard .Entry dt{
    color: #666;
}
#flow .Inner .Entry dd{text-align: left;font-size: 15px;}
#flow .Inner .Entry dd ul{margin-top: 4px;}
#flow .Inner .Entry dd li{
}
#flow .Inner .Entry dd .btn{
    margin-top: 10px;
}
#flow .Inner .Entry dd strong{}
#flow .Inner .Entry .deco{
	position: absolute;
	font-size: 14px;
	font-weight: bold;
	line-height: 1.4;
	color: #bda661;
	top: -64px;
	left: 50%;
	transform: translate(-50%, 0px);
}

#flow .Order{
	width: var(--MainWidth);
	margin: 0 auto;
	margin-top: 60px;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
#flow .Order h3{
	text-align: center;
	font-size: 25px;
	width: 100%;
	padding-bottom: 26px;
}
#flow .Order .Entry{
	text-align: center;
	background-color: #666;
	width: 49%;
	color: #fff;
	padding: 30px;
	box-sizing: border-box;
	border-radius: 3px;
}
#flow .Order .Entry + .Entry{background-color: var(--MainColor);}
#flow .Order .Entry dl{}
#flow .Order .Entry dt{
	font-size: 17px;
	margin-bottom: 10px;
}
#flow .Order .Entry dd{}
#flow .Order .Entry dd a{
	border: 2px solid #fff;
	border-radius: 3px;
	color: #fff;
	font-weight: bold;
	font-size: 17px;
	display: block;
	padding: 15px;
	background-color: inherit;
}
#flow .Order .Entry dd a:hover{
	background-color: #fff;
	color: var(--MainColor);
}
#flow .Order .Entry dd a:before{position: absolute;left: 8px;top:50%;margin-top:-0.5em;/* content:"\f105"; */font-family:FontAwesome;line-height: 1;font-weight: normal;}
#flow .Order .Entry dd.mail a:before{content:"\f0e0"}
#flow .Order .Entry dd.shop a:before{content:"\f007"}

/*-------------------------------------faq*/
#faq{background-color: #ededed;padding: var(--MainPadding);}
#faq .Inner{
	width: var(--MainWidth);
	margin: 0 auto;
}

#faq dl{}
#faq dt{line-height:1.6;padding-left: 25px;color: #bda661;font-size: 18px;padding-bottom:5px;font-weight: bold;}
#faq dt:before{display:block;margin-left: -29px;width:30px;text-align:center;content:"Q";font-family: 'Cormorant SC', serif;line-height:1.4;color: #bda661;position: absolute;}
#faq dd{padding-left: 25px;font-size: 15px;}
#faq dd:before{display:block;margin-left: -29px;width:30px;text-align:center;content:"A";font-family: 'Cormorant SC', serif;font-size: 17px;line-height:1.4;color: #6d7072;position: absolute;}

#faq dd + dt{ border-top: 1px solid #CCCCCC; padding-top:25px; margin-top:25px; border-right-color: #ebeced; border-bottom-color: #ebeced; border-left-color: #ebeced; }



