/* -------sns icon--------- */
@font-face {
	font-family: 'sns_ico';
	src:
		url('../fonts/sns_ico.ttf?sij4de') format('truetype'),
		url('../fonts/sns_ico.woff?sij4de') format('woff'),
		url('../fonts/sns_ico.svg?sij4de#sns_ico') format('svg');
	font-weight: normal;
	font-style: normal;
}

i.snsIcon {
	font-family: 'sns_ico' !important;
	speak: never;
	font-style: normal;
	font-weight: normal;
	font-variant: normal;
	text-transform: none;
	line-height: 1;

	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;

	color: #000;
}

.icon-ap:before { content: "\e900";}
.icon-blo:before { content: "\e901";}
.icon-fb:before { content: "\e902";}
.icon-hp:before { content: "\e903";}
.icon-in:before { content: "\e904";}
.icon-line:before { content: "\e905";}
.icon-spo:before { content: "\e906";}
.icon-tt:before { content: "\e907";}
.icon-tw:before { content: "\e908";}
.icon-yt:before { content: "\e909";}
.icon-x:before { content: "\e90a";}

/* ////////////////////////////////////////////////////////////////////////////////

	Common

//////////////////////////////////////////////////////////////////////////////// */
html {
	scroll-behavior: smooth;
}
body {
	background-color: #7813cb;
  font-family: "Noto Sans JP", serif;
  font-optical-sizing: auto;
  font-weight: 500;
  font-style: normal;
  font-size: min(3.4vw, 16px);
  color: #fff;
  -webkit-text-size-adjust: 100%;
	-webkit-font-smoothing: antialiased;
  letter-spacing: 0.1em;
	line-height: 1.8;
  position: relative;
  /* overflow: hidden; */
}

section {
	padding: min(10vw, 100px) min(6vw, 64px);
}
.leadArea + section {
	padding-top: min(20vw, 200px);
}
.inner {
  max-width: 1080px;
  margin: auto;
  padding: min(10vw, 100px) min(6vw, 64px);
}
.bgWh {
	background-color: #fff;color: #000;
}

h2 {
	font-size: min(7.8vw, 48px);
	text-align: center;
	margin-bottom: min(4vw, 32px);
}
h2 img {
	width: auto;
	height: 1em;
}

img {
	width: 100%;
	vertical-align: middle;
}
li {
	list-style: none;
}
a {
	transition: all 0.5s ease;
	text-decoration: none;
	color: #fff;
}

*:focus {
  outline: none;
}
a img {
	border-style:none;
}
img {
    border-style:none;
}

.anim {
	opacity: 0;
	transition: all .4s ease-out;
}
.anim.on {
	opacity: 1;
}
@keyframes op {
	0% { opacity: 0;}
	100% { opacity: 1;}
}

.btnWrap {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: min(4vw, 32px);
	margin-top: min(4vw, 32px);
}
.btnWrap a,
.btnWrap span {
	width: 80%;
	max-width: 380px;
	min-width: fit-content;
	display: block;
	padding: 0.75em 0 0.92em;
	font-size: min(4.2vw, 24px);
	font-weight: bold;
	text-align: center;
	text-decoration: none;
	color: #fff;
	border-radius: min(2vw, 10px);
}

.listDisc,
.listAsterisk {
	list-style: none;
	padding-left: 1.2em;
	font-size: min(2.8vw, 14px);
	line-height: 1.4;
}
.listDisc > li,
.listAsterisk > li {
	text-indent: -1.2em;
}
.listDisc > li + li,
.listAsterisk > li + li {
	margin-top: 0.4em;
}
.listDisc > li:before,
.listAsterisk > li:before {
	margin-right: 0.2em;
}
.listDisc > li:before {
	content: "・";
}
.listAsterisk > li:before {
	content: "※";
}

.notice {
	color: #d50505;
}

@media (hover: hover) {
	a:hover {
		opacity: 0.6;
	}
}
@media screen and (min-width:821px) {
	.sp {display: none;}
}
@media screen and (max-width: 820px) {
  .pc {
    display: none;
  }
}


/* ----- BackGround Animation ----- */

body::before {
	display: block;
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: url(../images/bg_pc.jpg);
  background-size: cover;
  background-position: bottom;
  background-repeat: no-repeat;

	z-index: -2;
}
body::after {
	display: block;
	content: "";
	position: fixed;
	top: 0;
	left: 0;
	width: 100vw;
	height: 100vh;
	background: url(../images/bg_pc.jpg);
  background-size: cover;
  background-position: top;
  background-repeat: no-repeat;
	transform: scale(-1, -1);

	z-index: -2;
	animation: bgFade 25s ease-in-out infinite;
}
@keyframes bgFade {
	0% {opacity: 1;}
	50% {opacity: 0;}
	100% {opacity: 1;}
}
.waveImg {
	position: fixed;
	top: 0;
	left: 50%;
	opacity: 0.15;
	width: 90%;
	transform: translate(-50%, 0%);
	z-index: -1;

	animation: wave 50s ease-in-out infinite;
}
@keyframes wave {
	0% {transform: translate(-50%, 0%);}
	50% {transform: translate(-50%, var(--wave-height, -30%))}
	100% {transform: translate(-50%, 0%);}
}

.reverse-parallax-container {
	position: relative;
	/* height: 100%; */
	overflow: hidden;
	/* align-items: center;
	justify-content: center; */
}
.reverse-parallax-content {
	position: relative;
	z-index: 2;
}
.reverse-parallax-shapes {
	position: absolute;
	/* top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	pointer-events: none; */
	inset: 0;
  pointer-events: none;
  z-index: 1;

	opacity: 0;
  animation: op 2s ease-in-out 2.1s forwards;
}
.paraDeco {
	position: absolute;
	will-change: transform;
  transform: translate3d(0,0,0);
}
.parallaxDeco10 {
	width: 24.6vw;
	left: -10vw;
	opacity: 0.6;
}
.parallaxDeco11 {
	width: 29.4vw;
	left: 18vw;
}
.parallaxDeco12 {
	width: 30vw;
	left: 75vw;
}
.parallaxDeco13 {
	width: 27.9vw;
	left: 86vw;
}
.parallaxDeco14 {
	width: 26.8vw;
	right: 27vw;
}
.parallaxDeco15 {
	width: 24.4vw;
	left: 63vw;
}
.parallaxDeco16 {
	width: 44.3vw;
	left: 2vw;
}
.parallaxDeco17 {
	width: 24.6vw;
	left: -10vw;
	opacity: 0.6;
}
.parallaxDeco18 {
	width: 29.4vw;
	left: 18vw;
}
.parallaxDeco19 {
	width: 30vw;
	left: 75vw;
}
.parallaxDeco20 {
	width: 27.9vw;
	left: 86vw;
}
.parallaxDeco21 {
	width: 26.8vw;
	right: 27vw;
}
.parallaxDeco22 {
	width: 24.4vw;
	left: -3vw;
}
.parallaxDeco23 {
	width: 44.3vw;
	left: 62vw;
}


.slideInWrap {
	position: fixed;
	width: 100vw;
	height: 100vh;
	z-index: -1;

	opacity: 0;
  animation: op 2s ease-in-out 2.4s forwards;
}
.fixDeco {
	position: absolute;
	animation: floatUp 1.2s cubic-bezier(0.42, 0, 0.58, 1) infinite alternate;
	transform: rotate(0deg);
}
.fixDeco01 {
	width: 9.4vw;
	top: -3vh;
	left: 8vw;
	animation-delay: 0s;
}
.fixDeco02 {
	width: 6.4vw;
	top: 9vh;
	left: 25vw;
	animation-delay: 0.5s;
	--float-distance: -7px;
}
.fixDeco03 {
	width: 13.1vw;
	top: 67vh;
	left: 14vw;
	animation-delay: 0.8s;
	--float-distance: -10px;
}
.fixDeco04 {
	width: 9.9vw;
	top: 43vh;
	left: 84vw;
	animation-delay: 0s;
}
.fixDeco05 {
	width: 15.4vw;
	top: 82vh;
	left: 82vw;
	animation-delay: 0.5s;
	--float-distance: -7px;
}
.fixDeco06 {
	width: 7.9vw;
	top: 75vh;
	left: 56vw;
	animation-delay: 1.1s;
}
.fixDeco06_2 {
	width: 16.7vw;
	top: 36vh;
	left: 3vw;
	animation-delay: 0s;
}
.fixDeco07 {
	width: 8.9vw;
	top: 14vh;
	left: 60vw;
	animation-delay: 0.5s;
}
.fixDeco08 {
	width: 9vw;
	top: 62vh;
	left: 77vw;
	animation-delay: 0.8s;
	--float-distance: -10px;
}
@keyframes floatUp {
	0% { transform: translateY(0);}
	100% { transform: translateY(var(--float-distance, -5px));}
}

@media screen and (max-width: 820px) {

	body::before {
		background: url(../images/bg_sp.jpg);
		background-size: cover;
		background-position: bottom;
		background-repeat: no-repeat;
	}
	body::after {
		background: url(../images/bg_sp.jpg);
		background-size: cover;
		background-position: top;
		background-repeat: no-repeat;
	}
	.waveImg {
		--wave-height: min(calc((207.1vw - 100vh)*-1));
	}

	.parallaxDeco10 {
		width: 35vw;
		left: -19vw;
	}
	.parallaxDeco11 {
		width: 41.8vw;
		left: -9vw;
	}
	.parallaxDeco12 {
		width: 42.6vw;
	}
	.parallaxDeco13 {
		width: 41.85vw;
		display: none;
	}
	.parallaxDeco14 {
		width: 64.8vw;
    right: 9vw;
	}
	.parallaxDeco15 {
		width: 34.7vw;
		left: 72vw;
	}
	.parallaxDeco16 {
		width: 63vw;
		left: -20vw;
	}
	.parallaxDeco17 {
		width: 35vw;
		/* left: -19vw; */
	}
	.parallaxDeco18 {
		width: 41.8vw;
		left: -9vw;
	}
	.parallaxDeco19 {
		width: 42.6vw;
	}
	.parallaxDeco20 {
		width: 41.85vw;
		display: none;
	}
	.parallaxDeco21 {
		width: 64.8vw;
    right: 9vw;
	}
	.parallaxDeco22 {
		width: 34.7vw;
		left: 72vw;
	}
	.parallaxDeco23 {
		width: 63vw;
		left: -20vw;
	}
	/* .parallaxDeco22 {
		width: 24.4vw;
		left: 63vw;
	} */

	.fixDeco01 {
		width: 13.3vw;
		top: 8.5vh;
    left: 22vw;
	}
	.fixDeco02 {
		width: 9.1vw;
		top: 26vh;
    left: 21.2vw;
	}
	.fixDeco03 {
		width: 24.4vw;
		top: 70vh;
    left: 3vw;
	}
	.fixDeco04 {
		/* width: 14.85vw; */
		display: none;
	}
	.fixDeco05 {
		/* width: 23.1vw; */
		display: none;
	}
	.fixDeco06 {
		width: 14.7vw;
		top: 63vh;
    left: 78vw;
	}
	.fixDeco06_2 {
		width: 23.7vw;
		top: 41vh;
		left: 3.6vw;
	}
	.fixDeco07 {
		width: 16.4vw;
		top: 17vh;
    left: 77vw;

	}
	.fixDeco08 {
		width: 15.3vw;
		top: 80vh;
    left: 86vw;
	}

}
/* ----- top visual ----- */
.fv {
  position: relative;
	padding-bottom: min(16vw, 160px);
}
.fv .link_official {
	display: block;
	position: absolute;
	top: min(6vw, 54px);
	left: 50%;
	transform: translateX(-50%);
  width: min(40vw, 380px);
	margin: auto;
	z-index: 1;
	opacity: 0;
  animation: op 1s ease-in-out 4s forwards;
}
.fv .pagetitle {
	position: absolute;
	top: 48vh;
	left: 50%;
	transform: translate(-50%, -50%);
  width: 95vh;
  max-width: 82%;
  opacity: 0;
  animation: op 2s ease-in-out 0.8s forwards;
	z-index: 1;
}
.fv .mvTextArea {
	text-align: center;
	font-weight: 600;
	font-size: min(4.2vw, 22px);
	padding-top: 76vh;
	opacity: 0;
  animation: op 1s ease-in-out 4s forwards;
}
.fv .mvTextArea p:first-child {
	display: inline-block;
	background: rgba(120, 19, 203, 0.7);
	font-size: min(6vw, 28px);
	line-height: 1.4;
	padding: 0.35em 0.8em 0.4em;
	margin-bottom: min(4vw, 40px);
}

.fv .entryBnr {
  position: fixed;
  right: 0;
  top: 0;
	z-index: 15;
	background-color: #7813cb;
	border-bottom-left-radius: min(4vw, 20px);
	opacity: 0;
/*  animation: op 1s ease-in-out 4s forwards;*/
}
.fv .entryBnr a {
	display: block;
	background-image: linear-gradient( -90deg, rgb(242,211,0) 6%, rgb(251,120,56) 100%);
	border-left: #fff solid 4px;
	border-bottom: #fff solid 4px;
	border-bottom-left-radius: min(4vw, 20px);
  box-shadow: 0px 10px 25px 0px rgba(4, 0, 0, 0.2);
	text-align: center;
	font-size: min(3vw, 16px);
	font-weight: 700;
	line-height: 1.2;
	padding: 1.2em 2.2em 1.4em 2.6em;
}
.fv .entryBnr a span {
	display: block;
	font-family: shackleton-wide, serif;
	font-weight: 400;
	font-style: normal;
	font-size: 2.2em;
}

.fv .entryBnr.end {
  position: fixed;
  right: 0;
  top: 0;
	z-index: 15;
	background-color: #7813cb;
	border-bottom-left-radius: min(4vw, 20px);
	opacity: 0;
/*  animation: op 1s ease-in-out 4s forwards;*/
}
.fv .entryBnr.end a,
.fv .entryBnr.end > span {
	display: block;
	background: rgba(255,255,255,0.8);
	border-left: #fff solid 4px;
	border-bottom: #fff solid 4px;
	border-bottom-left-radius: min(4vw, 20px);
  box-shadow: 0px 10px 25px 0px rgba(4, 0, 0, 0.2);
	text-align: center;
	font-size: min(3vw, 14px);
	font-weight: 700;
	line-height: 1.2;
  letter-spacing: 0.04em;
	padding: 1.2em 2.2em 1.4em 2.6em;
  color: #000;
  font-feature-settings: "palt";
}
.fv .entryBnr.end span > span {
	display: block;
	font-family: shackleton-wide, serif;
	font-weight: 400;
	font-style: normal;
  font-size: 1.6em;
  line-height: 1.6;
  background: linear-gradient(90deg, #e7714d 0%, #cb2f96 36%, #3c149d 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}


.fv .resultBnr {
  position: fixed;
  right: 0;
  top: 0;
	z-index: 15;
	border-bottom-left-radius: min(4vw, 20px);
  transition: all 0.4s ease-out;
}
.fv .resultBnr a {
	display: block;
	background-image: linear-gradient( -60deg, #e7714d 0%, #cb2f96 36%, #3c149d 100%);
	border-left: #fff solid 4px;
	border-bottom: #fff solid 4px;
	border-bottom-left-radius: min(4vw, 20px);
  box-shadow: 0px 10px 25px 0px rgba(4, 0, 0, 0.2);
	text-align: center;
	font-size: min(5.6vw, 24px);
	font-weight: 700;
  font-feature-settings: "palt";
	line-height: 1.2;
	padding: min(3vw, 15px) min(6vw, 30px);
  
	opacity: 0;
  animation: op 1s ease-in-out 4s forwards;
}
.fv .resultBnr a .ssLogo {
	display: block;
  width: 160px;
  line-height: 0;
  margin: 0 auto min(2vw, 10px);
}
.fv .resultBnr a .subTxt {
	display: block;
  font-size: min(2.8vw, 12px);
  margin-bottom: min(1vw, 5px);
}


.snsBtn {
  position: absolute;
  top: 140px;
  right: 25px;
	opacity: 0;
  animation: op 1s ease-in-out 4s forwards;
}
.snsBtn a {
  background-color: rgba(255, 255, 255, 0.20);
  backdrop-filter: blur(5px);
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  width: 50px;
  aspect-ratio: 1/1;
}
.snsBtn a i.snsIcon {
  color: #fff;
  font-size: 22px;
}


.badgeResult {
  line-height: 0;
  position: absolute;
  top: 100vh;
  right: min(3vw, 20px);
  width: min(28vw, 180px);
  transform: translateY(-100%);
  z-index: 100;
}

@media screen and (max-width: 820px) {

	.fv {
		height: 100vh;
	}
	.fv .link_official {
		top: 22.5vh;
    width: min(59.6vw, 380px);
  	animation: op 2s ease-in-out 1.8s forwards;
	}
	.fv .pagetitle {
		width: 84vw;
		top: 28.2vh;
		transform: translate(-50%, 0);
	}
	.fv .mvTextArea {
		padding: 0;
    position: absolute;
    top: 50vh;
    left: 50%;
    transform: translateX(-50%);
    width: 100%;
		font-size: min(3.2vw, 22px);
		animation: op 2s ease-in-out 1.8s forwards;
	}
	.fv .mvTextArea p:first-child {
		box-decoration-break: clone;
		-webkit-box-decoration-break: clone;
    display: inline;
    padding: 0.05em 0.4em 0.1em;
		font-size: min(4.8vw, 28px);
    line-height: 1.8;
		margin-bottom: 0;
	}
	.fv .mvTextArea p:last-child {
		margin-top: min(4vw, 40px);
	}

	.fv .entryBnr,
	.fv .entryBnr.end {
		top: auto;
		bottom: 4vw;
		left: 50%;
		transform: translateX(-50%);
		width: fit-content;
		border-radius: min(2vw, 10px);
		transition: all 0.4s ease-out;
    
    opacity: 0;
    pointer-events: none;
	}
  .fv .entryBnr.on {
    opacity: 1;
    pointer-events: auto;
  }
	.fv .entryBnr a,
	.fv .entryBnr.end > span {
		width: 66.7vw;
		border: #fff solid 2px;
		border-radius: min(2vw, 10px);
		padding: 0.4em 0 1em;
	}

	.fv .resultBnr {
		top: auto;
		bottom: 4vw;
		left: 50%;
		transform: translateX(-50%);
		width: fit-content;
		border-radius: min(2vw, 10px);
	}
  .fv .resultBnr.off {
    opacity: 0 !important;
    pointer-events: none;
  }
	.fv .resultBnr a {
		width: 66.7vw;
		border: #fff solid 2px;
		border-radius: min(2vw, 10px);
	}
  
  .snsBtn {
    top: 15px;
    right: 15px;
  }
  .snsBtn a {
    width: 40px;
  }
  .snsBtn a i.snsIcon {
    font-size: 18px;
  }
  
  .badgeResult {
    top: 98vh;
  }
}


/* ----- leadArea ----- */

.leadArea {
	position: relative;
  background-color: rgba(120, 19, 203, 0.7);
	padding: min(10vw, 100px) min(6vw, 64px);
}
.leadArea .inner {
	padding: min(3vw, 24px) min(4vw, 64px);
}
.leadArea h3 {
  text-align: center;
  font-size: min(5.4vw, 36px);
  margin-bottom: min(6vw, 40px);
  line-height: 1.7;
}
.leadArea p {
	font-size: min(3.4vw, 16px);
	line-height: 2.2;
	letter-spacing: 0.06em;
}
.leadArea p + p {
	margin-top: 1.5em;
}
.leadArea p span.bg {
	background-color: #da4ff8;
}
.leadArea p span:not(.bg) {
	color: #ffe000;
}

@media screen and (max-width: 820px) {
  
  .leadArea {
    padding: min(10vw, 100px) min(2vw, 10px);
  }
  .leadArea p {
    letter-spacing: 0.02em;
  }
  
}


/* ----- description ----- */

#description,
#flow {
  background-color: rgba(120,19,203,0.60);
}

#description h3,
#flow .flowList > div:not(.flow04) h3 {
	background-image: linear-gradient( -90deg, rgb(255,87,92) 6%, rgb(143,69,206) 100%);
	color: #fff;
	text-align: center;
	font-size: min(4.6vw, 24px);
	font-weight: 700;
	padding: 0.1em 0 0.2em;
}

#description .inner {
	padding: 0;
}
.descFlex {
	display: grid;
	/* grid-template-columns: 1fr 1fr; */
	gap: min(4vw, 32px);
}
.descFlex > li {
	display: flex;
	flex-direction: column;
	padding: min(4vw, 32px);
	background-color: #fff;
	color: #000;
}
.descFlex > li p {
	display: flex;
	justify-content: center;
	align-items: center;
	flex-wrap: wrap;
	flex-grow: 1;
	text-align: center;
	font-weight: 700;
}
.descFlex > li:nth-of-type(1) > p {
	font-size: min(4vw, 24px);
}
.descFlex > li:nth-of-type(1) > p.endTxt {
  color: #da4ff8;
  font-size: min(3.8vw, 20px);
}
.descFlex > li:nth-of-type(2) > p {
	font-size: min(3.2vw, 18px);
	line-height: 1.6;
}
.descFlex > li:nth-of-type(2) > p + p {
	margin-top: 0.6em;
}
.descFlex > li p .bg {
	background-color: #da4ff8;
	color: #fff;
	padding: 0 0.4em;
	margin: 0 0.4em;
	font-size: 0.8em;
}
.descFlex h3 {
	margin-bottom: 1em;
}
/* .descFlex > li .title {
	font-size: min(4.2vw, 20px);
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	color: #016133;
	margin-bottom: 1em;
} */
.descFlex .listDisc span {
	font-size: min(2.8vw, 14px);
}
.descFlex .noticeWrap {
	border: #c537e4 solid 2px;
	padding: min(2vw, 20px);
	margin-top: min(4vw, 32px);
}
.descFlex .noticeWrap p {
	font-size: min(3vw, 16px);
}
.descFlex .noticeWrap p span {
	color: #da4ff8;
}

@media screen and (max-width: 820px) {
	.descFlex {
		grid-template-columns: 1fr;
	}
	.descFlex > li:nth-child(3) {
		grid-column: 1;
	}
}

/* ----- flow ----- */

#flow .flowList > div:not(.flow04) h3 {
	padding: 0.1em 0 0.2em;
	margin-bottom: min(4vw, 40px);
}
#flow .inner {
	padding: 0;
}
.flowList > div:not(:last-child) {
	position: relative;
	clip-path: polygon(0 0, 100% 0, 100% calc(100% - min(3vw, 30px)), calc(50% + min(4.4vw, 44px)) calc(100% - min(3vw, 30px)), 50% 100%, calc(50% - min(4.4vw, 44px)) calc(100% - min(3vw, 30px)), 0 calc(100% - min(3vw, 30px)));
	background-color: #fff;
	padding-bottom: min(3vw, 30px);
	margin-bottom: min(2vw, 16px);
}
.flowList > div:not(.flow04) > div {
	position: relative;
	z-index: 1;
	padding: min(6vw, 40px) 5% min(7vw, 60px);
}
.flowList p.date {
	display: flex;
	align-items: center;
	gap: min(2vw, 10px);
	font-family: shackleton-wide, serif;
	font-weight: 400;
	font-style: normal;
	font-size: min(7.6vw, 40px);
	letter-spacing: 0.01em;
  font-weight: 600;
  font-style: normal;
}
.flowList p.date span {
	font-size: 0.4em;
	font-weight: 400;
	padding-top: 0.2em;
}

.flowList .flow01 {
	display: flex;
	justify-content: center;
	gap: min(2vw, 16px);
	font-family: shackleton-wide, serif;
	color: #c537e4;
	font-size: min(7.6vw, 40px);
	line-height: 1.2;
}
.flowList .flow02,
.flowList .flow03 {
	display: grid;
	grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
	gap: min(3vw, 24px);
}
.flowList .flow02 > div p.date,
.flowList .flow03 > div p.date {
	justify-content: center;
	line-height: 1;
	padding: min(4vw, 24px) 0;
}
.flowList .flow02 > div p.date {
	flex-direction: column;
	gap: 0;
	background-color: #e2bfff;
	color: #7813cb;
}
.flowList .flow03 > div p.date {
	background-color: #f4c3ff;
	color: #c537e4;
}
.flowList .flow02 > div p.date + p,
.flowList .flow03 > div p.date + p {
	padding: min(1vw, 6px);
	font-size: min(4.2vw, 18px);
	font-weight: 600;
	text-align: center;
}
.flowList .flow02 > div p.date + p {
	background-color: #7813cb;
}
.flowList .flow03 > div p.date + p {
	background-color: #c537e4;
}
.flowList .flow04 {
	position: relative;
}
.flowList .flow04 > img {
	position: absolute;
	width: 100%;
	height: 100%;
	object-fit: cover;
	z-index: -1;
}
.flowList .flow04 > div {
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	align-items: center;
	gap: min(10vw, 80px);
	width: 100%;
	height: 100%;
	padding: min(6vw, 40px) min(4vw, 40px) min(8vw, 40px);
}
.flowList .flow04 .showtime {
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	width: 100%;
}
.flowList .flow04 h3 {
	font-size: min(6vw, 26px);
	margin-bottom: 10px;
}
.flowList .flow04 .flow04Date {
	display: flex;
	justify-content: center;
	gap: 2px;
	margin-bottom: min(2vw, 10px);
}
.flowList .flow04 .flow04Date p.date {
	font-size: min(7.6vw, 46px);
}
.flowList .flow04 .flow04Line {
	display: block;
	width: 100%;
	height: 2px;
	background-color: #fff;
	margin-bottom: min(6vw, 40px);
}
.flowList .flow04 .textImg {
	width: min(80%, 460px);
	margin: 0 auto;
}

.flowList .flow04 .privilege {
	position: relative;
	width: 100%;
	border: #fff solid 2px;
	text-align: center;
	font-size: min(3.36vw, 20px);
	font-weight: 700;
	padding: min(6vw, 40px) min(4vw, 32px) min(4vw, 32px);
}
.flowList .flow04 .privilege .privilegeBadge {
	position: absolute;
	top: 0;
	left: 50%;
	transform: translate(-50%, -50%);
	display: flex;
	justify-content: center;
	align-items: center;
	width: min(16vw, 80px);
	aspect-ratio: 1/1;
}
.flowList .flow04 .privilege .privilegeBadge img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.flowList .flow04 .privilege .privilegeBadge::before {
	content: "さらに";
	z-index: 1;
	letter-spacing: 0;
	font-size: min(3.2vw, 16px);
}
.flowList .flow04 .privilege .flow04Date p.date {
	font-size: min(5.4vw, 32px);
}
.flowList .flow04 .privilege p.strong {
	font-size: 1.25em;
}
.flowList .flow04 .privilege > p {
	line-height: 1.4;
}
.flowList .flow04 .privilege > p + p {
	margin-top: min(2vw, 10px);
}
.flowList .flow04 .privilege > p.strong span {
	color: #f4c3ff;
}
.flowList .flow04 .privilege .blankBtn {
	display: flex;
	align-items: center;
	gap: 0.6em;
	width: fit-content;
	font-size: min(3vw, 14px);
	letter-spacing: 0.06em;
	border: #f4c3ff solid 2px;
	border-radius: min(2vw, 10px);
	padding: 1em 1.6em;
	margin: min(4vw, 32px) auto 0;
}
.flowList .flow04 .privilege .blankBtn img {
	width: 0.6em;
	padding-top: 0.2em;
}

@media screen and (max-width: 820px) {

	.flowList .flow04 .flow04Date p.date {
		font-size: min(6.8vw, 64px);
	}
	.flowList .flow04 .privilege .flow04Date p.date {
		font-size: min(5.6vw, 44.8px);
	}
}



/* ----- howEntry ----- */
#howEntry {
	padding: 0 !important;
	background: #fff;
}
#howEntry h2 span {
	font-family: shackleton-wide, serif;
	font-weight: 400;
	font-style: normal;
	font-size: min(18vw, 140px);
	line-height: 1.2;
	background: linear-gradient(-80deg, #e7714d 1%, #cb2f96 36%, #3c149d 100%);
	-webkit-background-clip:text;
	-webkit-text-fill-color: transparent;
}
#howEntry h3 {
	font-size: min(4.2vw, 24px);
	margin-bottom: min(3vw, 24px);
}
#howEntry .textArea {
	padding-bottom: min(8vw, 48px);
	border-bottom: #bbb solid 1px;
	margin-bottom: min(8vw, 40px);
}
#howEntry .textArea p {
	font-size: min(3.8vw, 18px);
	text-align: center;
}
#howEntry .textArea .pinkTxt {
	color: #ca2f96;
	font-weight: 600;
}
#howEntry .textArea .note {
	font-size: min(2.8vw, 14px);
	margin-top: 1.5em;
	font-weight: 500;
}
#howEntry .textArea .note:not(.link) {
	color: #000;
}
#howEntry .textArea .note.link a {
	color: #ca2f96;
	text-decoration: underline;
}
#howEntry .textArea .spotuBtn {
	position:relative;
  display:block;
  padding:16px 40px;
	width: 200px;
	margin: min(6vw, 32px) auto 0;
}
#howEntry .textArea .spotuBtn::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	border-radius: min(2vw, 10px);
	border: 2px solid transparent;
	background: linear-gradient(-80deg, #e7714d 1%, #cb2f96 36%, #3c149d 100%) border-box border-box;
	-webkit-mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0) border-box;
	-webkit-mask-composite: destination-out;
	mask: linear-gradient(#fff 0 0) padding-box, linear-gradient(#fff 0 0) border-box;
	mask-composite: exclude;
}
#howEntry .textArea .btnWrap a,
#entryModal .btnWrap a {
	background: linear-gradient(-80deg, #e7714d 1%, #cb2f96 36%, #3c149d 100%);
	box-shadow: 0px 10px 25px 0px rgba(4, 0, 0, 0.2);
}
#howEntry .textArea .btnWrap span.end {
  background: #fff;
  border: #000 solid 2px;
  color: #000;
	box-shadow: none;
  font-feature-settings: "palt";
}
#howEntry .textArea .btnWrap span {
	background-color: #c7c7c7;
}
#howEntry .textArea .notice + .btnWrap {
	margin-top: min(1vw, 6px);
}
#howEntry .textArea .notice {
	margin-top: min(4vw, 32px);
}
#howEntry .listAsterisk + p {
	font-size: min(3.2vw, 16px);
	margin-top: 0.5em;
	text-align: left;
}
/* #howEntry .info {
	display: block;
	text-align: center;
	color: #000;
	font-size: min(2.8vw, 14px);
	text-decoration: underline;
	margin-top: 1em;
} */

#entryModal {
	height: 100%;
	background-color: #fff;
	border-radius: min(4vw, 40px);
	display: flex;
	flex-direction: column;
	justify-content: center;
}
#entryModal .logoSoptU {
	width: min(42.8%, 380px);
	margin: 0 auto;
}
#entryModal .logoSoptU + p {
	color: #000;
	text-align: center;
	font-size: min(3.8vw, 18px);
	font-weight: 700;
	margin-top: 1em;
}
#entryModal .btnWrap {
	margin-top: min(6vw, 56px);
}
#entryModal .btnWrap a {
	font-size: min(3.8vw, 18px);
	padding: 1em 0 1.4em;
}

#cboxClose {
	background-color: #b5459b;
	border-radius: 100%;
	width: 50px;
	height: 50px;
	top: -10px;
	right: -10px;
}
#cboxClose:before,
#cboxClose:after {
	width: 40%;
	height: 1.5px;
}


/* ----- footer ----- */
footer {
	background-color: #fff;
	position: relative;
  padding-bottom: min(12vw, 120px);
}
footer .summersonic {
  width: min(42%, 394px);
  display: block;
  margin: auto;
}
footer .logo_list {
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
	gap: min(4vw, 40px);
  margin: min(6vw, 64px) auto min(14vw, 100px);
}
footer .logo_list .creativeman {
  width: min(25.5%, 264px);
}
footer .logo_list .eplus {
  width: min(25.5%, 180px);
}
footer .logo_list li img {
  width: 100%;
}
footer .copy {
	color: #000;
  text-align: center;
  font-size: min(2.4vw, 13px);
  font-family: "Antonio", sans-serif;
  font-optical-sizing: auto;
  font-weight: 600;
  letter-spacing: 0;
}

/* @media screen and (min-width: 821px) {
  footer .creativeman {
    width: 30.1%;
  }
  footer .summersonic {
    width: 27.1%;
  }
  footer .eplus {
    width: 22.8%;
  }
} */



.artistWrap {
  padding: min(10vw, 100px) min(6vw, 64px);
}
.artistWrap .inner {
  padding: min(10vw, 80px) min(6vw, 64px);
}
.artistWrap .titleTop {
  text-align: center;
  font-size: min(3.6vw, 28px);
  font-weight: bold;
  letter-spacing: 0.04em;
}

.artistWrap h2 {
  line-height: 1.2;
}

.result2Box .artistWrap {
  border: #fff solid 1px;
}

.artistsBlock + .artistsBlock {
  margin-top: min(8vw, 60px);
}
.artistsBlock h3 {
  font-family: "Antonio", sans-serif;
  margin-bottom: min(4vw, 20px);
  display: flex;
  align-items: center;
  gap: min(4vw, 20px);
  font-size: min(4.6vw, 34px);
}
.artistsBlock h3 .areaTag {
  padding: 0 0 min(0.6vw, 3px);
  font-size: 0.6em;
  width: 5.5em;
  display: block;
  text-align: center;
}
.artistsBlock h3 .areaTag.tokyo {
  background-color: #00a2ff;
}
.artistsBlock h3 .areaTag.osaka {
  background-color: #ff921e;
}
.artistsBlock h3 .areaTag.korea {
  background-color: #f3002e;
}
.artistsBlock .artistProfile {
  background-color: #fff;
  display: flex;
  justify-content: space-between;
  color: #000;
  padding: min(7vw, 50px);
}
.artistsBlock .artistProfile + .artistProfile {
  margin-top: min(6vw, 30px);
}
.artistsBlock .artistProfile .txt {
  width: 54%;
}
.artistsBlock .artistProfile .txt .stageName {
  font-family: "Antonio", sans-serif;
  font-size: min(4.2vw, 22px);
  letter-spacing: 0.02em;
  line-height: 1.4;
  border-bottom: #bbb solid 1px;
  padding-bottom: min(3vw, 15px);
  margin-bottom: min(5vw, 25px);
  display: flex;
  align-items: center;
  gap: min(4vw, 20px);
}
.artistsBlock .artistProfile .txt .stageName .stageLogo {
  display: block;
  width: 1.8em;
  padding-top: 0.1em;
}
.artistsBlock .artistProfile .txt h4 {
  font-size: min(5.2vw, 24px);
  margin-bottom: min(4vw, 20px);
}
.artistsBlock .artistProfile .txt p {
  font-size: min(3.2vw, 14px);
  letter-spacing: 0.04em;
}
.artistsBlock .artistProfile .txt .siteLink {
  display: block;
  width: fit-content;
  background-color: #000;
  margin-top: min(6vw, 30px);
  border-radius: 6px;
  padding: min(2vw, 10px) min(7vw, 40px) min(2.1vw, 13px);
}

.artistsBlock .artistProfile .img {
  width: 40%;
}
.artistsBlock .artistProfile .img .artistPhoto {
  width: 100%;
  aspect-ratio: 920/640;
}
.artistsBlock .artistProfile .img .artistPhoto img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.artistsBlock .artistProfile .artistSns {
  margin-top: min(7vw, 50px);
  display: flex;
  justify-content: center;
  gap: min(4vw, 20px);
}
.artistsBlock .artistProfile .txt .artistSns {
  justify-content: flex-start;
}
.artistsBlock .artistProfile .artistSns li a {
  color: #000;
  font-size: min(3vw, 11px);
  letter-spacing: 0.02em;
  text-align: center;
}
.artistsBlock .artistProfile .artistSns li a i {
  font-size: min(5vw, 25px);
  display: block;
}
.artistsBlock .artistProfile .artistSns li a .icon-sc {
  width: 35px;
  object-fit: contain;
  display: inline-block;
  vertical-align: baseline;
}

.artistsBlock .artistProfile .profileBtnWrap {
  display: flex;
  align-items: center;
  margin-top: min(6vw, 30px);
  gap: min(6vw, 30px);
}
.artistsBlock .artistProfile .profileBtnWrap .siteLink {
  margin-top: 0;
}
.artistsBlock .artistProfile .profileBtnWrap .artistSns {
  margin-top: 0;
}


@media screen and (max-width: 820px) {
  
  #result2.artistWrap {
    padding: min(10vw, 100px) min(3vw, 64px);
  }
  #result2 .result2Box .artistWrap {
    padding: min(4vw, 20px) min(3vw, 15px);
  }
  .artistWrap .inner {
    padding: min(10vw, 80px) 0;
  }
  
  .artistsBlock h3 {
    line-height: 1.4;
  }
  .artistsBlock .artistProfile {
    flex-direction: column;
    gap: min(8vw, 60px);
  }
  .artistsBlock .artistProfile .txt {
    width: 100%;
  }
  .artistsBlock .artistProfile .img {
    width: 100%;
  }
  
  .artistsBlock .artistProfile .txt .stageName .stageLogo {
    width: 2.2em;
  }
  
  
}