@charset "UTF-8";
/* hanbom.com _ NEXON CREATOR _ KimJuyeon _ 230508 */

/* reset */
@import url(lib/reset.css);
/* library */
@import url(lib/swiper.min.css);
@import url(lib/aos.css);
/* beteast css */
@import url(_font.css);
@import url(_colors.css?t=1);
@import url(_vars.css);
@import url(_button.css);
@import url(_form.css?v=20240329);
@import url(_layout.css?v=20240329);
@import url(_global.css?v=202403229);

/* re01 : RE01, PR01 */
#content.re01				{padding-bottom: 0;}
#content.re01 .content-wrap		{max-width: 100%;padding: 0;}
#content.re01 .section			{overflow: hidden;}
#content.re01 .page-nav			{position: fixed; right: 35px; top: 50%; font-size: 18px; letter-spacing: -.04rem; text-align:right; z-index: 10;
	-webkit-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
}
#content.re01 .page-nav li + li			{margin-top: 20px;}
#content.re01 .page-nav a				{color: var(--gray); font-weight: bold;}
#content.re01 .page-nav li.no-show		{display: none}
#content.re01 .page-nav li.current a	{color: var(--blue); font-weight: 900;}
@media all and (min-width: 1200px) and (max-width: 1640px){
	#content.re01 .page-nav			{right: 20px; font-size: 14px;}
}
@media all and (max-width: 1199px){
	#content.re01 .page-nav				{display: none;}
}
/* re01 .section common */
#content.re01 .section-title		{font-size: 60px; font-weight: bold; line-height: 1.33;}
#content.re01 .title.large			{font-size: 48px; font-weight: bold;}
#content.re01 .section-title,
#content.re01 .title.large			{word-break: keep-all;}
#content.re01:not(.pr01) .btn.large.white		{display: block; width: 265px;}
#content.re01 .sticker				{position: absolute; display: block;}
@media all and (max-width: 1199px){
	#content.re01 .section-title		{font-size: 32px;}
	#content.re01 .title.large			{font-size: 32px;}
}
#content.re01 #zOne				{overflow: hidden; text-align: center;}
#zOne .ours-zone				{max-width: 1261px; margin: 0 auto; padding: 190px 0 283px;}
#zOne .ours-zone .bar				{display: block; height: 8px; margin-top: 12px; background: #fff;
	border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
}
#zOne .img-wrap .img					{position: relative; width: 100%;}
#zOne .ours-zone .img-wrap.creatorz		{overflow: visible; position: relative; width: 100%; max-width: 1261px; margin: 28px auto 0; }
#zOne .ours-zone .sticker.shape			{top: 134px; left: -8.8%; width: 25.69%;}
#zOne .ours-zone .sticker.globe			{top: -245px; left: 19.6%; width: 24.32%;}
#zOne .ours-zone .sticker.zbadge		{top: calc(100% + 32px); right: 5.47%; width: 28.23%;}
#zOne .ours-zone .title-wrap			{position: relative; text-align: left;}
#zOne .ours-zone .title-wrap strong		{display: block;}
#zOne .ours-zone .title-wrap .title.small	{font-size: 30px; font-weight: 900;}
#zOne .ours-zone .img-wrap + .title-wrap	{margin-top: 20px;}
#zOne .spin-area					{position: relative; margin: 0 auto 160px; width: 220px;}
#zOne .spin-area .arrow					{position: absolute; top: 50%; left: 50%; width: 48px; height: 48px;
	-webkit-transform: translate(-50%-50%);
	-ms-transform: translate(-50%-50%);
	-o-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
}
@media all and (min-width: 1200px){
	#zOne .ours-zone .section-title,
	#zOne .ours-zone .title-wrap			{padding-left: 5px; padding-right: 5px;}
}
@media all and (min-width: 1200px) and (max-width: 1640px){
	#zOne .ours-zone				{max-width: calc(100vw - 300px);}
}
@media all and (max-width: 1199px){
	#zOne .ours-zone			{padding: 60px 16px 240px;}
	#zOne .ours-zone .bar					{height: 4px; margin-top: 8px; margin-bottom: 20px; }

	#zOne .ours-zone .sticker.shape			{top: 18px; left: -77px; width: 188px;}
	#zOne .ours-zone .sticker.globe			{top: -140px; left: 142px; width: 149px;}
	#zOne .ours-zone .sticker.zbadge		{top: calc(100% + 71px); right: -82px; width: 231px;}

	#zOne .spin-area						{width: 42.667vw;}
	#zOne .spin-area .arrow					{width: 8.533vw; height: 8.533vw;}
	#zOne .ours-zone .title-wrap .title.small	{margin-top: 12px; font-size: 24px;}
}
#zOne .message .wrapper					{position: relative; max-width: 1420px; height: var(--vh100); margin: 0 auto;
	font-size: 36px;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-justify-content: center; -ms-flex-pack: center; justify-content: center;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
#zOne .message .bg-container			{position: absolute; top: 0; left: 0; right: 0; bottom: 0;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
}
#zOne .message .bg-container:after		{content: ''; position: absolute; left: 0; top: 0; right: 0; bottom: 0;
	background: linear-gradient(0deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0.4) 25%, rgba(0,0,0,0.4) 80%, rgba(0,0,0,1) 100%);
}
#zOne .message .bg-col					{width: 380px; overflow: hidden;}
#zOne .message .bg-col .img-wrap		{
	-webkit-animation: ticker1 60s linear infinite;
}
#zOne .message .bg-col:nth-of-type(1) .img-wrap	{margin-top: -132px;}
#zOne .message .bg-col:nth-of-type(2) .img-wrap	{margin-top: 150px;
	animation-direction: reverse;
}
#zOne .message .bg-col .img-wrap .img	{width: 100%}
#zOne .message .bg-col .img-wrap .img + .img	{margin-top : 120px;}
#zOne .message .text-wrap				{position: relative;}
#zOne .message .step02					{padding-top: 120px;}
@media all and (max-width: 1199px){
	#zOne .message .bg-col:nth-of-type(3)	{display: none;}
	#zOne .message .bg-col					{width: calc((100% - 64px)/2);}
	#zOne .message .bg-col:nth-of-type(1) .img-wrap	{margin-top: 0;}
	#zOne .message .bg-col:nth-of-type(2) .img-wrap	{margin-top: 160px;}
	#zOne .message .bg-col .img-wrap .img + .img	{margin-top : 64px;}
	#zOne .message .step02					{padding-top: 100px;}
}
@keyframes ticker1 {
	0% {
		-webkit-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); visibility: visible;
	}
	100% {
		-webkit-transform: translate3d(0, -50%, 0); transform: translate3d(0, -50%, 0);
	}
}

#zOne .waiting					{padding: 260px 0;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	-webkit-justify-content: center; -ms-flex-pack: center; justify-content: center;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
#zOne .waiting .article-title + p		{font-size: 30px; font-weight: 600;}
#zOne .waiting .timer-wrap				{padding-top: 60px;}
#zOne .waiting .timer					{height: 183px;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
}
#zOne .waiting .timer div				{position: relative;}
#zOne .waiting .timer div + div			{margin-left: 54px;}
#zOne .waiting .timer div + div:before	{content: ''; position: absolute; width: 6px; height: 34px; left: -27px; top: 52px; border: 6px solid #fff; border-width: 6px 0;}
#zOne .waiting .timer strong			{display: block; min-width: 130px; height: 150px; line-height: 1.33;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-justify-content: center; -ms-flex-pack: center; justify-content: center;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
	background-image: linear-gradient(to bottom, var(--blue) 0%, #d0002a
		50%, var(--blue) 50%, var(--blue) 100%);
}
#zOne .waiting .timer span				{display: block; padding-top: 12px; width: 100%; font-weight: 500; font-size: 18px; color: var(--gray);}
#zOne .waiting .timer .day strong		{width: 180px; }
#zOne .waiting .btn.large				{color: #000}
#zOne .waiting .timer-wrap + .btn.large	{margin-top: 80px;}
@media all and (max-width: 1199px){
	#zOne .waiting					{padding: 140px 0;}
	#zOne .waiting .article-title + p		{margin-top: 12px; font-size: 24px;}
	#zOne .waiting .timer					{width: 326px; height: 302px; margin: 0 auto;
		-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
	}
	#zOne .waiting .section-title			{font-size: 32px;}
	#zOne .waiting .timer div + div			{margin-left: 28px;}
	#zOne .waiting .timer div + div:before	{width: 4px; height: 28px; left: -15px; top: 36px; border-width: 4px 0;}
	#zOne .waiting .timer strong			{min-width: 90px; height: 100px;}
	#zOne .waiting .timer span				{margin-top: 8px; font-size: 14px;}
	#zOne .waiting .timer .day				{width: 100%; padding-bottom: 20px;}
	#zOne .waiting .timer .day strong		{width: 120px; margin-left: auto; margin-right: auto;}
	#zOne .waiting .timer div + div.hour	{margin-left: 0;}
	#zOne .waiting .timer div + div.hour:before	{display: none;}
	#zOne .waiting .timer-wrap + .btn.large	{margin-top: 60px;}
}

#content.re01 #for1st .wrapper			{position: relative;}
	#for1st .pannel .text-wrap			{
		display: -ms-flexbox; display: -webkit-flex; display: flex;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
		-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
	}
#for1st .pannel						{font-size: 18px; font-weight: 500; line-height: 1.5;}
#for1st .panels .bar				{position: absolute; top: 0; left: 0; width: 4px; background-color: #000; z-index: 10;}
#for1st .pannel .cate				{font-weight: 600;}
#for1st .pannel .section-title		{font-weight: 600;}
#for1st .pannel .section-title + p:not(.fs-28)	{margin-top: 23px;}
#for1st .pannel .section-title + .fs-28			{margin-top: 20px;}
#for1st .pannel .bg-wrap			{background-color: var(--dark); background-position: center; background-repeat: no-repeat; background-size: auto calc(45.833vw - 120px);}
#for1st .pannel .bg-wrap.bg01		{background-image: url("../images/re01/bg_for1st01@2x.png");}
#for1st .pannel .bg-wrap.bg02		{background-image: url("../images/re01/bg_for1st02@2x.png");}
@media all and (min-width: 1200px){
	#for1st .panels .wrapper						{height: var(--vh100);}
	#for1st .pannel						{
		display: -ms-flexbox; display: -webkit-flex; display: flex;
	}
	#for1st .pannel > div				{position: absolute; width: 50%; height: var(--vh100);
	}
	#for1st .pannel .text-wrap			{left: 0; padding: calc( var(--header) + 5.208vw) 140px 5.208vw;
	}
	#for1st .pannel .section-title		{line-height: 1.33}
	#for1st .pannel .fs-28				{font-size: 28px;}
	#for1st .pannel .bg-wrap			{right: 0;}
}
@media all and (min-width: 1200px) and (max-width: 1640px){
	#for1st .pannel .section-title		{font-size:3.125vw}
}
@media all and (max-width: 1199px){
	#for1st .pannel .text-wrap,
	#for1st .pannel .bg-wrap			{min-height: 432px;}
	#for1st .pannel .text-wrap			{padding: 40px 0 32px; text-align: center;}
	#for1st .pannel .title-wrap			{padding: 28px 0 40px;}
	#for1st .pannel .section-title + p:not(.fs-28),
	#for1st .pannel .section-title + .fs-28			{margin-top: 8px;}
	#for1st .pannel .bg-wrap			{background-size: auto 354px;}
}
#content.re01 #creatorZ			{text-align: center;}
#creatorZ .wrapper							{position: relative; max-width: 1420px; height: var(--vh100); margin: 0 auto;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-justify-content: center; -ms-flex-pack: center; justify-content: center;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
#creatorZ .bg-container				{position: absolute; top: 0; left: 0; width: 100%; height: var(--vh100);
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-justify-content: center; -ms-flex-pack: center; justify-content: center;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
#creatorZ .bg-container .bg-txt		{font-size: 260px; font-weight: 500; line-height: normal; letter-spacing: -10.4px; color: #fff;}
#creatorZ .cards					{position: relative; width: 100%; max-width: 1388px; height: var(--vh100); margin: 0 auto;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
#creatorZ .card						{width: 390px; height: 540px; padding: 0 24px 80px; background-color: var(--card); background-position: center top; background-repeat: no-repeat; background-size: 100% auto;
	box-shadow: 0 0 50px 0 rgba(0, 0, 0, 0.6);
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	-webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end;
}
#creatorZ .card.card01				{background-image: url("../images/re01/bg_card01@2x.png");}
#creatorZ .card.card02				{background-image: url("../images/re01/bg_card02@2x.png");}
#creatorZ .card.card03				{background-image: url("../images/re01/bg_card03@2x.png");}
#creatorZ .card .card-title 		{font-size: 30px; font-weight: bold;}
#creatorZ .card .card-title + p		{margin-top: 20px; font-weight: 500;}
@media all and (min-width: 1200px){
	#creatorZ .card.card02				{margin-top: 147px;}
	#creatorZ .card.card03				{margin-top: 20px;}
	#creatorZ .card .card-title + p		{font-size: 18px;}
}
@media all and (min-width: 1200px) and (max-width: 1600px){ /* pxtovw 1584  */
	#creatorZ .bg-container .bg-txt		{font-size: 16.414vw; letter-spacing: -0.657vw;}
	#creatorZ .card						{width: 24.621vw; height: 34.091vw; padding: 2.273vw 1.5vw;}
}
@media all and (max-width: 1199px){
	#creatorZ,
	#creatorZ .wrapper					{height: fit-content;}
	#creatorZ .bg-container .bg-txt		{font-size: 100px;  letter-spacing: -4px; writing-mode: vertical-rl;}
	#creatorZ .cards					{width: 300px; max-width: 300px; height: fit-content; margin: 0 auto; padding: 100px 0;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	}
	#creatorZ .card						{width: 300px; height: 391px; margin: 0 auto; padding: 0 10px 45px;}
	#creatorZ .card +  .card			{margin-top: 100px;}
	#creatorZ .card .card-title 		{font-size: 24px;}
	#creatorZ .card .card-title + p		{margin-top: 16px;}
}
#howTo .everyone					{padding: 280px 140px 200px;}
#howTo .everyone .tag-line			{margin-top: 80px;}
#howTo .tag.bg-fff					{color: var(--neon-red);}
@media all and (min-width: 1200px) {
	#howTo .everyone .tag-line			{padding-right: 150px;}
}
@media all and (min-width: 1200px) and (max-width: 1640px){
	#howTo .everyone					{padding-left: 7.292vw; padding-right: 140px;}
}
@media all and (max-width: 1199px){
	#howTo .everyone					{padding: 120px 16px 100px;}
	#howTo .everyone .tag-line			{margin-top: 60px;}
}

#howTo .guideline					{padding: 180px calc(140px + 150px) 220px 140px; background-color: #08090b;
		display: -ms-flexbox; display: -webkit-flex; display: flex;
}
#howTo .guideline .section-title + .btn	{margin-top: 60px;}
#howTo .guideline ol li				{padding: 60px 0 80px; border-bottom: 1px solid var(--gray-dark);}
#howTo .guideline ol li:first-child {border-top: 1px solid var(--gray-dark);}
#howTo .guideline .step				{font-size: 14px; font-weight: 600; color: var(--blue);}
#howTo .guideline ol li p + p		{margin-top: 20px;}
#howTo .guideline .txt				{font-size: 18px; font-weight: 500; color: var(--gray);}
@media all and (min-width: 1200px){
	#howTo .guideline					{
		-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
	}
	#howTo .guideline .col-left			{width: 35%; max-width: 562px;}
	#howTo .guideline .col-right		{width: 48%; max-width: 799px;}
}
@media all and (min-width: 1200px) and (max-width: 1640px){
	#howTo .guideline					{padding-left: 7.292vw; padding-right: 140px;}
}
@media all and (max-width: 1199px){
	#howTo .guideline					{padding: 100px 16px;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	}
	#howTo .guideline .col-right		{margin-top: 80px;}
	#howTo .guideline ol li				{padding: 28px 0 40px; }
}
#cheer .marquee-inner > span		{font-size: 13.542vw; padding: 0 2vw; font-weight: 500;}
#cheer .title-wrap					{max-width: 1190px; margin: 160px auto 140px;}
#cheer .sticker-wrap				{position: relative; max-width: 1269px; margin: 0 auto 40px;}
#cheer .sticker-wrap:before			{content:''; display: block;}
#cheer .sticker-wrap:before			{padding-bottom: 36.24901497241923%;}
#cheer .sticker.withus				{top: 0; left: 8.211%; width: 30.260%;}
#cheer .sticker.arrow				{top: 53.870%; left: 18.440%; width: 9.456%;}
#cheer .sticker.growth				{top: 19.783%; left: 28.369%; width: 35.303%;}
#cheer .sticker.like				{top: 15.217%; left: 27.660%; width: 19.701%;}
#cheer .sticker.program				{top: 5.217%; right: 3.783%; width: 429;}
#cheer .sticker.frienz				{top: 17.826%; left: 0.039%; width: 27.266%;}
#cheer .sticker.my					{top: 5.000%; right: 18.519%; width: 38.061%;}
#cheer .sticker.zone				{top: 37.391%; right: 0; width: 23.562%;}
@media all and (max-width: 1199px){
	#cheer .marquee-inner > span		{font-size: 26.667vw;}
	#cheer .title-wrap					{margin-top: 100px; margin-bottom: 96px; padding-left: 16px; padding-right: 16px;}
	#cheer .sticker-wrap				{margin-bottom: 26.667vw;}
	#cheer .sticker-wrap:before			{padding-bottom: 86.13333333333334%;}

	#cheer .sticker.withus				{top: 0; left: 13.333%; width: 57.867%;}
	#cheer .sticker.arrow				{top: 30.960%; left: 25.867%; width: 15.733%;}
	#cheer .sticker.growth				{top: 51.703%; left: 40.533%; width: 52.533%;}
	#cheer .sticker.like				{top: 9.659%; left: 57.493%; width: 35.733%;}
	#cheer .sticker.program				{top: 41.486%; right: 36.560%; width: 59.733%;}
	#cheer .sticker.frienz				{top: 17.647%; left: 4.000%; width: 46.133%;}
	#cheer .sticker.my					{top: 23.220%; right: 4.533%; width: 64.000%;}
	#cheer .sticker.zone				{top: 66.254%; right: 37.333%; width: 44.800%;}
}

/* banner-challenge */
.banner-challenge	{padding: 160px 0 160px; text-align: center;
	background: var(--blue) url('../images/re01/bg_banner_challenge.svg') no-repeat 50% 50%;
	background-size: cover;
}
.banner-challenge .section-title + p	{margin-top: 16px; font-size: 18px;}
.banner-challenge p + .btn.large,
.banner-challenge p + .button-area		{margin: 40px auto 0; }
.banner-challenge p + .button-area		{gap: 20px;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-justify-content: center; -ms-flex-pack: center; justify-content: center;
}
.banner-challenge .button-area .btn.medium	{min-width: 229px;}
.banner-challenge p + .button-area .btn.large	{
	display: -ms-inline-flexbox; display: -webkit-inline-flex; display: inline-flex;
}
@media all and (max-width: 1199px){
	.banner-challenge	{padding: 110px 0 120px;
		background-image: url('../images/re01/bg_banner_challenge_mo.svg');
	}
	.banner-challenge p + .btn.large,
	.banner-challenge p + .button-area	{margin-top: 60px;}
	.banner-challenge p + .button-area		{gap: 8px;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
		-webkit-align-items: center; -ms-flex-align: center; align-items: center;
	}
	/*PR01*/
	.banner-challenge .button-area .btn.medium	{width: 245px;}
}

/* pr01 */
#content.re01.pr01 .page-nav a,
#content.re01.pr01 .page-nav li.current a		{color: #fff;}
#content.re01.pr01 .page-nav li:not(.current) a	{opacity: .6}
#content.pr01 .section-inner.pin-body							{font-size: 18px;}
#content.pr01 .section-inner.pin-body .fs-bigger				{font-size: 30px;}
#content.pr01 .marquee-wrap.line .marquee-inner > span			{text-transform: revert;}
@media all and (min-width: 1200px){
	#content.pr01 .section-inner.pin-body							{position: relative; margin: 0 auto 300px; max-width: 1640px;}
	#content.pr01 .section-inner.pin-body:after						{content: ""; display: block; clear: both;}
	#content.pr01 .section-inner.pin-body > div						{padding-top: 180px;}
	#content.pr01 .section-inner.pin-body .pin-left					{float: left; width: 30.729vw;}
	#content.pr01 .section-inner.pin-body .pin-content				{float: right; width: 48.71%; max-width: 799px;}
	#content.pr01 .section-inner.pin-body .pin{
		-webkit-transition: all .3s ease 0s;
		-moz-transition: all .3s ease 0s;
		-ms-transition: all .3s ease 0s;
		-o-transition: all .3s ease 0s;
		transition: all .3s ease 0s;
	}
	#content.pr01 .section-inner.pin-body .pin.pin-in				{position: fixed; top: 0;}
	#content.pr01 .section-inner.pin-body .pin.pin-out			{position: absolute; bottom:  0;}
	#content.pr01 .section-inner.pin-body .article-title		{word-break: break-word;}
}
@media all and (min-width: 1200px) and (max-width: 1680px){
	#content.pr01 .section-inner.pin-body							{padding-right: 140px; padding-left: 40px;}
	#content.pr01 .section-inner.pin-body .pin-left		{width: 36vw;}
}
@media all and (max-width: 1199px){
	#content.pr01 .section-inner				{padding-left: 16px; padding-right: 16px;}
	#content.pr01 .section-inner.pin-body				{padding-top: 120px;}
	#content.pr01 .section-inner.pin-body .fs-bigger				{font-size: 24px;}
}
#creatorZRed			{background: #FF5C13 url('../images/pr/bg_creatorz.svg') no-repeat center top; background-size: 100% auto;}
#creatorZRed .section-inner				{padding: 142px 0 240px;}
#creatorZRed .title-wrap				{margin: 0 auto; max-width: 1260px;}
#creatorZRed .title-wrap .article-title	{display: block;}
#creatorZRed .img-wrap					{position: relative; overflow: visible; margin-top: 20px;}
#creatorZRed .img-wrap .img				{position: relative; width: 100%;}
#creatorZRed .img-wrap .ico				{position: absolute; bottom: -252px; left: -75px; width: 324px; height: 324px; background-image: url('../images/pr/astroid_blue.svg');}
#creatorZRed .pre						{position: relative; margin-top: 11px;}
#creatorZRed .img-wrap.infinity			{width: 607px; margin: 200px auto 0;}
#creatorZRed .section-title				{text-align: center; max-width: 1000px; margin: 80px auto 0;}
#creatorZRed .section-title .icon-set	{gap: 10px;
	display: -ms-inline-flexbox; display: -webkit-inline-flex; display: inline-flex;
	-webkit-justify-content: center; -ms-flex-pack: center; justify-content: center;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
#creatorZRed .section-title .icon-set + .icon-set		{margin-left: 16px;}
#creatorZRed .section-title div			{margin-top: 20px; letter-spacing: -3px;}
#creatorZRed .text-wrap					{margin-top: 80px; font-size: 30px; text-align: center;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
@media all and (min-width: 1200px) and (max-width: 1480px){
	#creatorZRed .section-inner				{margin: 0 auto; max-width: 76.829vw;}
}
@media all and (max-width: 1199px){
	#creatorZRed			{background-image: url('../images/pr/bg_creatorz_mo.svg');}
	#creatorZRed .section-inner				{padding-top: 60px; padding-bottom: 128px;}
	#creatorZRed .img-wrap .ico				{width: 137px; height: 136px; bottom: -106px; left: calc((50% - 3.3%) - 137px);}
	#creatorZRed .pre						{display: block; width: 167px; margin: 20px auto 0;}
	#creatorZRed .section-title				{margin-top: 100px;}
	#creatorZRed .section-title div			{letter-spacing: -1.6px;}
	#creatorZRed .icon-set .ico				{width: 40px; height: 40px;}
	#creatorZRed .img-wrap.infinity			{max-width: 75.73vw; margin-top: 80px;}
	#creatorZRed .text-wrap					{margin-top: 40px; font-size: 24px;}
}
#program								{padding: 200px 0 300px; font-size: 18px;}
#program .section-inner > .title.large	{text-align: center;}
#program .title.large .img-wrap			{width: 100%; max-width: 603px; margin: 0 auto 20px;}
#program .title.large .img-wrap .img	{width: 100%;}
#program .book							{width: 86%; max-width: 1640px; margin: 60px auto 0;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
}
#program .book > div					{width: 50%; padding: 4.167vw 8% 5.208vw 8.5%;}
#program .book .book-left				{position:relative; background: #ff3400; overflow: visible;}
#program .book .book-right				{color: #000; background: #f3f3f3;}
#program .book .title.small				{font-size: 30px;}
#program .book .title.small + .title.large	{margin-top: 40px;}
#program .book .btn.bdr-white			{padding: 9px 19px; font-size: 18px; font-weight: 500; cursor: none; border-width: 1.5px;
	border-radius: 50px;
	-moz-border-radius: 50px;
	-webkit-border-radius: 50px;
}
#program .book .img-wrap .img			{width: 100%;}
#program .book .book-left .img-wrap		{position: absolute; left: 0; bottom: -95px; width: 100%;}
#program .book .book-right .img-wrap	{margin-top: 80px;width: 315px;}
#program .book .book-right .btn			{margin-top: 103px; width: 360px; padding-bottom: 15px; font-size: 30px; border-bottom: 4px solid #000;
	-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
}
#program .section-inner ul				{width: 86%; max-width: 1640px; margin: 192px auto 0;}
#program .section-inner ul li			{height: 420px; padding: 0 0 80px 93px; border-bottom: 4px solid #fff; background-repeat: no-repeat; background-position: right bottom; background-size: 48% auto;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-align-items: flex; -ms-flex-align: center; align-items: center;
	-webkit-align-items: flex-end; -ms-flex-align: end; align-items: flex-end;
}
#program .section-inner ul li:nth-of-type(1){background-image: url('../images/pr/li_program01@2x.png');}
#program .section-inner ul li:nth-of-type(2){background-image: url('../images/pr/li_program02@2x.png');}
#program .section-inner ul li:nth-of-type(3){background-image: url('../images/pr/li_program03@2x.png');}
#program .section-inner ul p			{margin-top: 20px; opacity: .6;}
@media all and (min-width: 1200px) and (max-width: 1680px){
	#program .book,
	#program .section-inner ul							{width: calc(100% - 280px);}
}
@media all and (max-width: 1199px){
	#program								{padding: 100px 0 114px;}
	#program .book							{width: calc(100% + 32px); margin: 40px -16px 0;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	}
	#program .book > div					{width: 100%; padding: 48px 22px 60px 28px; }
	#program .book .book-left				{padding-bottom: 363px;}
	#program .book .title.small				{font-size: 24px;}
	#program .book .title.small + .title.large	{margin-top: 20px;}
	#program .book .img-wrap .img			{max-width: 343px;}
	#program .book .book-left .img-wrap		{bottom: -17px; padding: 0 16px;}
	#program .book .book-right .img-wrap	{margin-top: 20px; width: 240px;}
	#program .book .book-right .btn			{margin-top: 150px; width: 222px; padding-bottom: 12px; font-size: 24px;}
	#program .book .ico.arrow-black			{width: 24px; height: 24px;}
	#program .section-inner ul				{width: 100%; margin-top: 20px;}
	#program .section-inner ul li			{height: fit-content; padding: 100px 0 320px; background-size:auto 300px; background-position: center bottom;}
	#program .section-inner ul li:nth-of-type(1){background-image: url('../images/pr/li_program01_mo@2x.png');}
	#program .section-inner ul li:nth-of-type(2){background-image: url('../images/pr/li_program02_mo@2x.png');}
	#program .section-inner ul li:nth-of-type(3){background-image: url('../images/pr/li_program03_mo@2x.png');}
}
@media (orientation: portrait) {
	#program .book .btn.bdr-white			{margin-top: 12px}
}

#step > .section-inner						{padding: 180px 0 300px;}
#step > .section-inner > .title.large		{text-align: center;}
#step .step							{position: relative; width: 86%; max-width: 1640px; margin: 80px auto 0;}/* height: 311 + 2469 + 354 = 3134px */
#step .step:before					{position: absolute; content: ''; clear: both; display: block; left: 140px; top: 10.56%/*311px*/; width: 98.24%; max-width: 1611px; height: 100%; background: url('../images/pr/step-line.svg') no-repeat center top; background-size: 100% 78%;}
#step .step li:after				{content: ''; clear: both; display: block;}
#step .card					{position: relative; width: 100%; max-width: 660px; padding: 30px 30px 80px; font-size: 18px; color: #212121; background-color: #fff;}
#step .card .img-wrap			{margin-left: -30px; margin-right: -30px;}
#step .card .img-wrap .img		{width: 100%;}
#step .card .text-wrap			{text-align: center;}
#step .card .article-title + p	{margin: 20px 0 25px; font-weight: 500;}
#step .card .text-wrap .button-area	{margin-top: 25px;}
#step .card .button-area .btn.blue	{display:block; width: 100%; max-width: 457px; margin: 0 auto;}
#step .card.step04 .speech-bubble	{position: absolute; right: -139px; bottom: 202px; width: 222px; height: 226px; padding: 36px; color: #fff; font-weight: bold; text-align: center; background: transparent url('../images/pr/Union.svg'); background-size: cover;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-justify-content: center; -ms-flex-pack: center; justify-content: center;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
@media all and (min-width: 1200px){
	#step .card.step01				{margin-left: 140px;}
	#step .card.step02				{float: right; margin-top: -437px;}
	#step .card.step03				{float: right; margin-top: 180px; margin-right: 140px;}
	#step .card.step04				{margin-top: -340px;}
	#step .card.step05				{float: right; margin-top: -120px;}
	#step .card .button-area .btn.blue	{height: 87px; line-height: 87px}
	#step .card .text-wrap p:last-child	{margin-bottom: 36px;}
}
@media all and (min-width: 1200px) and (max-width: 1919px){
	#step .step							{width: 80%; max-width: calc(100% - 280px);}
}
@media all and (min-width: 1200px) and (max-width: 1800px){
	#step .card					{width: 45%;}
	#step .card.step01				{margin-left: 4.25%;}
	#step .card.step03				{ margin-top: 5.7%; margin-right: 4.25%;}
}
@media all and (max-width: 1199px){
	#step > .section-inner						{padding-top: 120px; padding-bottom: 120px;}
	#step .step							{width: 100%; margin-top: 40px; }
	#step .step:before					{left: 0; top: 124.533vw; width: 100%; height: 100%; background-image: url('../images/pr/step-line_mo.svg'); background-size: 64.800vw auto;}
	#step .step li + li					{margin-top: 60px;}
	#step .card					{margin: 0 auto; padding: 28px 24px 60px;}
	#step .card .text-wrap			{margin-top: 20px;}
	#step .card .img-wrap			{margin-left: -24px; margin-right: -24px;}
	#step .card .article-title + p	{margin-bottom: 0;}
	#step .card.step04 .speech-bubble	{right: -25px; bottom: 229px; width: 166px; height: 168px; padding: 16px; font-size: 16px;}
	#step > .section-inner > .button-area 	{margin-top: 60px;}
}
#tier .pin-left .section-title + p	{margin-top: 40px;}
#tier .pin-left p.op-50			{opacity: .5;}
#tier .pin-left p + p			{margin-top: 20px;}
#tier .pin-left p.fs-bigger + p.fc-b3	{margin-top: 40px;}
#tier .pin-content .img-wrap	{width: 28.78%;}
#tier .pin-content .img-wrap .img	{width: 100%;}
#tier .pin-content ul li		{padding: 40px 0 112px; border-top: 1px solid var(--gray-dark);}
#tier .pin-content li > .bundle-both-top	{gap: 9.3%}
#tier .pin-content .text-wrap	{width: 57.82%}
#tier .pin-content .dt			{padding: 20px 0 10px;}
#tier .pin-content .dd			{font-weight: 500;}
#tier .pin-content .dd + .dt	{margin-top: 10px;}
@media all and (max-width: 1199px){
	#tier 							{padding-bottom: calc(118px - 60px);}
	#tier .pin-left					{padding-bottom: 80px;}
	#tier .pin-content li > .bundle-both-top	{gap: 32px;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	}
	#tier .pin-content .img-wrap	{width: 160px; margin: 0 auto;}
	#tier .pin-content .text-wrap	{width: 100%;}
	#tier .pin-content ul li		{padding-bottom: 60px;}
	#tier .pin-left p.fc-b3 + p.fc-b3	{margin-top: 16px;}
}
#zPoint .pin-content .img-wrap,
#zPoint .pin-content .img-wrap .img		{width: 100%;}
#zPoint .pin-content > div		{border-bottom: 1px solid var(--gray-dark);}
#zPoint .pin-content > div:not(.img-wrap)		{border-bottom: 1px solid var(--gray-dark); padding: 60px 0;}
#zPoint .pin-content .article-title + p			{margin-top: 40px;}
#zPoint .pin-content .guide		{font-size: 18px;}
#zPoint .pin-content .guide ul li	{padding-left: 18px; text-indent: -18px;}
#zPoint .pin-content .guide ul li:before		{content:"\2022"; padding: 0 4px 0 6px;  font-size: 14px; line-height: 1; vertical-align:middle;}
@media all and (max-width: 1199px){
	#zPoint .pin-left					{padding-bottom: 60px;}
	#zPoint .pin-content .img-wrap		{padding-bottom: 20px;}
}

/* re02 */
#content.re02 .content-wrap	{max-width: calc(1080px + 32px);}
#content.re02 .top-visual	{background-image: url("../images/top/re02@2x.png");}
@media (orientation: portrait) {
	#content.re02 .top-visual	{background-image: url("../images/top/re02_mo@2x.png");}
}

#content.re02 .message-box	{padding-top: 240px;}
#content.re02 .message-box p	{margin-top: 10px;}
#content.re02 .message-box .button-area	{text-align: left;}
@media all and (max-width: 1199px){
	#content.re02 .message-box	{padding-top: 120px;}
}

/* id01 */
#content.id01 .content-wrap	{max-width: calc(520px + 32px); padding-top: 160px;}
#content.id01 .agree-form	{margin-top: 60px;}
@media all and (max-width: 1199px){
	#content.id01 .content-wrap	{padding-top: 60px;}
	#content.id01 .agree-form	{margin-top: 40px;}
}

/* id02 */
#content.id02 .content-wrap	{max-width: calc(520px + 32px); padding-top: 160px;}
#content.id02 .youtube-form	{margin-top: 60px; border-top: 2px solid #000;}
@media all and (max-width: 1199px){
	#content.id02 .content-wrap	{padding-top: 60px;}
	#content.id02 .youtube-form	{margin-top: 40px;}
}

/* #content.article : IN11, IN22, CR22  */
#content.article			{text-align: left;}

/* #content.news : IN01, IN02, IN03 */
#content.news .top-visual	{background-image: url("../images/top/news@2x.png");}
@media (orientation: portrait) {
	#content.news .top-visual	{background-image: url("../images/top/news_mo@2x.png");}
}

/* #content.creator : CR01, CR02 */
#content.creator .top-visual	{background-image: url("../images/top/creator@2x.png");}
@media (orientation: portrait) {
	#content.creator .top-visual	{background-image: url("../images/top/creator_mo@2x.png");}
}
#content.creator .banner-wrap .guide	{margin-top: 12px;}
#content.creator .banner-wrap .bundle-both					{gap: 20px;}
#content.creator .banner-wrap .btn.medium:not(.underline)	{min-width: 196px; height: 50px;}
@media (orientation: portrait) {
	#content.creator .banner-wrap .bundle-both	{gap: 12px;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
		-webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start;
	}
}
/* #content.creator : CR01 */
#content.creator.cr01 .top-visual + main	{margin-top: 80px;}
#content.creator.cr01 .banner-wrap			{padding-bottom: calc(80px - 16px);}
.banner-support								{font-size: 18px;
	display: -webkit-flex; display: flex;
	-webkit-flex-direction: column; flex-direction: column;
}
.banner-support .bg-title					{min-height: 244px; padding: 77px 5.88% 68px; background: url("../images/cr/banner-support@2x.png") no-repeat center bottom; background-size: auto 100%;}
.banner-support .item.point					{width: 100%; padding: 25px 5.88%; color: #fff; background-image: linear-gradient(263deg, #ff7223 22%, #ee3c24 84%);
	display: -webkit-flex; display: flex;
	-webkit-justify-content: space-between; justify-content: space-between;
	-webkit-align-items: center; align-items: center;
}
.banner-support .item.point > .bundle-left		{width: calc(100% - 196px); gap: 17.92%;}
.banner-support .item.point .bundle-left-top	{gap: 16px;}
.banner-support .item.point .point			{font-size: 60px; line-height: 1.33;}
.banner-support .item.point .unit			{font-size: 18px; padding-top: 12px;}
@media all and (max-width: 1199px){
	#content.creator.cr01 .top-visual + main	{margin-top: 60px;}
	.banner-support .bg-title 					{padding: 0;}
	.banner-support .item.point					{padding: 32px 28px;
		-webkit-align-items: flex-start; align-items: flex-start;
		gap: 16px;
	}
	.banner-support .item.point > .bundle-left		{width: 100%;
		-webkit-align-items: flex-start; align-items: flex-start;
	}
	.banner-support .item.point .bundle-left-top	{gap: 12px}
	.banner-support .item.point .point			{font-size: 36px; line-height: 1.5;}
	.banner-support .item.point .unit			{font-size: 14px; padding-top: 9px;}
}
@media all and (max-width: 760px){
	.banner-support .item.point					{
		-webkit-flex-direction: column; flex-direction: column;
		gap: 16px;
	}
	.banner-support .item.point > .bundle-left		{gap: 0;
		-webkit-flex-direction: column; flex-direction: column;
		-webkit-justify-content: flex-start; justify-content: flex-start;
	}
}
@media (orientation: portrait) and (max-width: 767px) {
	.banner-support .bg-title					{height: 279px; background-image: url("../images/cr/banner-support_mo@2x.png"); background-size: auto 164px;}
}

/* #content.creator : CR02 */
#content.creator.cr02 .banner-wrap	{padding-top: 40px; padding-bottom: calc(80px - 16px);}
.banner-ad								{color: #fff; padding: 50px 5.8% 48px 11.76%; background: #000 url("../images/cr/bg_banner_ad@2x.png") no-repeat left top; background-size: auto 100%;
	display: -webkit-flex; display: flex;
	-webkit-flex-direction: column; flex-direction: column;
	-webkit-justify-content: flex-end; justify-content: flex-end;
}
.banner-ad .bundle-both					{margin-top: 16px;
	-webkit-align-items: flex-end; align-items: flex-end;
}
.banner-ad .fs-30						{font-size: 32px;}
.banner-ad .fs-30 + p					{margin-top: 4px;}
@media (orientation: portrait) {
	.banner-ad								{padding: 36px 28px; background-image: url("../images/cr/bg_banner_ad_mo@2x.png"); background-size: 100% auto;}
	#content.creator .banner-wrap .banner-ad .bundle-both	{gap: 16px;}
}
@media all and (max-width: 767px){
	.banner-ad .fs-30						{font-size: 28px;}
}
@media (orientation: portrait) and (max-width: 767px) {
	.banner-ad								{min-height: 461px;}
	.banner-ad .bundle-both > p				{word-break: keep-all;}
}
/* #content.my : MY 01~07*/
#content.my > .content-wrap	{padding-top: 120px;}
#content.my > .content-wrap	.article-title	{width: 100%; margin-bottom: 60px;}
#content.my .apply-form		{margin-top: 0;}
#content.my .my-info + .apply-form{margin-top: 40px;}
#content.my #myNavSwiper	{margin-left: 0; margin-right: 0;}
#content.my .bundle-both.card-wrap		{gap: 20px;
	align-items: stretch;
}
#content.my .apply-form + .section		{margin-top: 80px; padding-top: 32px; border-top: 2px solid #000; }
#content.my .my-content > .support-status + .ta-r	{margin-top: 12px}
#content.my .my-content					{position: relative;}
@media all and (min-width: 1200px){
	#content.my > .content-wrap	{
		display: -ms-flexbox; display: -webkit-flex; display: flex;
		-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
		-webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap;
	}
	#content.my #myNavSwiper						{width: 20.58%; max-width: 280px; border-top: 2px solid #000}
	#content.my #myNavSwiper .swiper-wrapper		{height: auto; padding: 40px 0;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	}
	#content.my #myNavSwiper .swiper-slide + .swiper-slide	{margin-top: 24px;}
	#content.my > .content-wrap	.my-content		{width: 69.11%; max-width: 940px;}
	#content.my .my-content > .out{position: absolute;}
	#content.my .my-content > .guide.out{top: -49px;}
	#content.my .my-content > .bundle-both.out{top: -56px; width: 100%;}
}
@media all and (max-width: 1199px){
	#content.my > .content-wrap	{padding-top: 60px;}
	#content.my > .content-wrap	.article-title		{margin-bottom: 40px;}

	#content.my #myNavSwiper						{margin-right: -16px;}
	#content.my #myNavSwiper						{margin-bottom: 32px;}
	#content.my .my-content > .guide.out			{margin-bottom: 32px;}
	#content.my .my-content > .bundle-both.out		{margin-bottom: 16px;}
	#content.my .button-area.center-box .btn.medium:not(.underline)	{min-width: 50%;}
}
@media all and (min-width: 768px){
	#content.my .bundle-both.card-wrap > div:nth-of-type(1)	{width: calc((100% - 40.42%) - 20px);}
	#content.my .bundle-both.card-wrap > div:nth-of-type(2)	{width: 40.42%;}
	#content.my .my-content > .bundle-both.out > .bundle-left	{gap: 32px;}
}
@media all and (max-width: 767px){
	#content.my .apply-form + .section		{margin-top: 60px; padding-top: 28px;}
	#content.my .bundle-both.card-wrap,
	#content.my .my-content > .bundle-both.out		{
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	}
	#content.my .my-content > .bundle-both.out		{gap: 16px;
		-webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start;
	}
	#content.my .my-content > .bundle-both.out > .bundle-left	{gap: 24px;}
}
#content.my .point-box	{min-height: 140px; background-image:url(../images/top/bg-point@2x.png); background-repeat: no-repeat; background-position: right bottom; background-size: auto 100%;}
@media (orientation: portrait) {
	#content.my .point-box .bundle-left			{gap: 20px;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
		-webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start;
	}
}
#content.my .no-card					{overflow: hidden; color: #fff; background: #000 url(../images/my/bg_nocard_cr@2x.png) no-repeat right top; background-size: contain;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	-webkit-justify-content: flex-end; -ms-flex-pack: end; justify-content: flex-end;
	border-radius: 2px;
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;
}
#content.my .no-card .title,
#content.my .no-card > .btn				{font-size: 18px;}
#content.my .no-card .txt				{font-weight: 500; color: var(--gray);}
#content.my .no-card > .btn:after		{content:''; width: 0; height: 0; margin-left: 13px; border-style: solid; border-width: 4px 0 4px 6px; border-color: transparent transparent transparent #fff;}
#content.my .no-card .title + .txt		{margin-top:8px;}
#content.my .no-card .txt + .btn		{margin-top:20px;}
#content.my .no-card.incubating			{background-image: url(../images/my/bg_nocard_in@2x.png);}
/* MY01 : #content.my-home */
#content.my-home .support-status .sub-title {margin-bottom: 20px;}
#content.my-home .item.channel.bg-cards		{min-height: 160px;color: #fff;}
#content.my-home .item.channel.bg-cards .item.point	{color: #fff; padding-bottom: 0;}
#content.my-home .item.channel.bg-cards .item.point .point	{font-size: 48px;}
#content.my-home .item.channel.bg-cards		{min-height: 160px;}
#content.my-home .no-card						{height: 160px; padding: 54px 32px 23px;}
@media all and (min-width: 1200px){
	#content.my-home .item.channel.bg-cards:before	{background-image: url(../images/my/bg_cards_long@2x.png);}
	#content.my-home .item.channel.bg-cards .item.point .unit	{padding-top: 15px;}
	#content.my-home .no-card.incubating			{position: relative; background-image: url(../images/my/bg_nocard_long@2x.png);}
	#content.my-home .no-card .txt + .btn 			{position: absolute; right: 32px; bottom: 23px; margin-top: 0}
}
@media all and (max-width: 1199px){
	#content.my-home .item.channel.bg-cards,
	#content.my-home .no-card					{height: 280px;}
	#content.my-home .item.channel.bg-cards .item.point .point	{font-size: 32px;}
}
/* MY07 : #content.my-frenz */
#content.my-frenz .bundle-both.card-wrap		{margin-top: 20px;}
#content.my-frenz .item.channel.bg-cards		{min-height: 280px;}
#content.my-frenz .no-card						{height: 280px; padding: 40px 48px;}
#content.my #pointSwiper						{margin-top: 16px;}
@media all and (min-width: 768px){
	#pointSwiper .swiper-slide.wide					{width: calc(100% - 40.42%);}
	#pointSwiper .swiper-slide:not(.wide)			{width: 40.42%;}
	#pointSwiper .swiper-slide + .swiper-slide:before	{position: absolute; top: 21px; left: 0; height: calc( 100% - 21px - 21px); content: ''; width: 1px; opacity: 0.3; background-color: #fff; z-index: 1;
		border-radius: 2px;
		-moz-border-radius: 2px;
		-webkit-border-radius: 2px;
	}
	#content.my-frenz .item.point .point 			{font-size: 48px;}
	#content.my-frenz .item.point .item.point .unit {padding-top: 15px;}
}
@media all and (max-width: 767px){
	#content.my-frenz 								{overflow-x: hidden;}
	#content.my-frenz .bundle-both.card-wrap		{margin-top: 66px;}
	#content.my .no-card						{width: 100%; padding-left: 28px; padding-right: 28px;}
	#content.my-frenz .item.channel.bg-cards		{margin-top: 36px;}
	#content.my-frenz .item.bdr-box.channel .item-fnc	{gap: 16px;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
		-webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start;
	}
	#content.my-frenz .item.bdr-box.channel .item-fnc .bundle-left{width: 100%; gap: 9px;}
	#content.my-frenz .item.bdr-box.channel .item-fnc .bundle-left .btn{
		-webkit-flex: 1; -ms-flex: 1; flex: 1;
	}

	#content.my-frenz .bundle-both.card-wrap .item.bdr-box.channel .text-wrap > .btn.xsmall{position: static;width: 100%;margin-top: 20px;}
}

#content .my-info{display: -ms-flexbox; display: -webkit-flex; display: flex;
	padding: 28px 40px;background-color: #000;}
#content .my-info .hello{font-size: 28px;font-weight: 500;color: #fff}
#content .my-info .hello strong{font-size: 28px;color: #fff}
#content .my-info .info-wrap{display: -ms-flexbox; display: -webkit-flex; display: flex;
	}
#content .my-info .info-wrap dl dt{color: var(--gray-dark);font-size: 16px;font-weight: 500;}
#content .my-info .info-wrap dl dd{margin-top: 8px;font-size: 28px;font-weight: 500;color: #fff;}

@media all and (min-width: 768px){
	#content .my-info{-webkit-align-items: center; -ms-flex-align: center; align-items: center;}
	#content .my-info .hello{width: 49%;}
	#content .my-info .info-wrap{width: 51%;padding-left: 40px;border-left: 1px solid rgba(255,255,255,0.3);}
	#content .my-info .info-wrap dl:nth-child(1){width: 43%;}
	#content .my-info .info-wrap dl:nth-child(2){width: 30%;}
	#content .my-info .info-wrap dl:nth-child(3){width: 27%;}
}
@media all and (max-width: 767px){
		#content .my-info{-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
			padding: 28px;
		}
		#content .my-info .hello{padding: 12px 0 40px;font-size: 24px;}
		#content .my-info .hello strong{font-size: 24px;}
		#content .my-info .info-wrap{padding-top: 24px;border-top: 1px solid rgba(255,255,255,0.3);}
		#content .my-info .info-wrap dl + dl{margin-left: 30px;}
		#content .my-info .info-wrap dl dd{margin-top: 4px;font-size: 24px;}
}


/* MY03 : #content.my03 */
#content.my03 .data-table td		{padding-left: 0; padding-right: 0;}
#content.my03 .extend-area.mission	{max-width: 291px;}
#content.my03 .extend-area.reward	{max-width: 205px;}

/* MY05 : #content.my-balance */
#content.my-balance .point-box .item.point			{padding: 28px 40px 16px;}
#content.my-balance .point-box .item.point .point	{font-size: 48px;}
#content.my-balance .point-box .bundle-left			{gap: 100px;}
#content.my-balance .point-box + .guide			{margin-top: 14px;}
#content.my-balance .guide + .guide				{margin-top: 4px;}
#content.my-balance .title-group				{margin-top: 40px;}
#content.my-balance .data-table					{margin-top: 28px;}
@media all and (max-width: 1199px){
	#content.my-balance .data-table					{margin-top: 32px;}
	#content.my-balance .point-box .bundle-left			{gap: 20px;}
}
@media (orientation: portrait) and (max-width: 767px){
	#content.my-balance .point-box	{height: 280px; background-image: url(../images/top/bg-point_mo@2x.png); background-size: cover;}
	#content.my-balance .point-box .item.point			{padding: 32px;}
	#content.my-balance .point-box .item.point .point	{font-size: 36px;}
}

/* MY55 : #content.my-balance-form */
#content.my-balance-form .apply-form fieldset	{position: relative;}
#content.my-balance-form .apply-form .member-class	{border-top: 0 none; padding-top: 0; position: absolute; top: -45px; right: 0; min-width: fit-content; gap: 32px;}
.hidden[data-visible]	{display: none !important;}

/* MY06 : #content.my-ad */
#content.my-ad .item.bdr-box.channel			{padding-top: 32px;}
#content.my-ad .item.channel:not(.bg-cards) .item-fnc			{margin-top: 20px; min-height: 59px;}
#content.my-ad .point-box						{background-image: url(../images/top/bg-point-ad@2x.png); }
#content.my-ad .point-box .item.point			{padding: 31px 32px 29px;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
}
#content.my-ad .point-box .item.point .point	{font-size: 36px;}
#content.my-ad .title-group						{margin-top: 40px;}
#content.my-ad .data-table a.title				{max-width: 320px;}
@media all and (min-width: 1200px){
	#content.my-ad	.title-group .btn				{min-width: 149px;}
	#content.my-ad .item.bdr-box.channel > .bundle-left		{gap: 24px;}
	#content.my-ad .point-box .item.point			{height: 193px;
		-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
	}
}
@media all and (max-width: 1199px){
	#content.my-ad .data-table						{margin-top: 32px;}
	#content.my-ad .point-box .item.point			{gap: 12px;}
	#content.my-ad .point-box .item.point .bundle-both			{gap: 20px;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
		-webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch;
	}
	#content.my-ad .point-box .item.point .point	{font-size: 26px;}
}
@media (orientation: portrait) {
	#content.my-ad .point-box	{height: 200px; background-image: url(../images/top/bg-point_mo@2x.png); background-size: cover;}
}
/* MY08 : #content.creator-noti */
#content.creator-noti .textarea	{min-height: 400px;}
@media all and (max-width: 767px){
	#content.creator-noti .textarea	{min-height: 280px;}
}

#content.fr03 > .content-wrap	{padding-top: 120px; max-width: calc(1080px + 32px);}
#content.fr03 .article-title + p	{margin-top: 12px;}
#content.fr03 p + .guide			{margin-top: 56px;}
@media all and (max-width: 1199px){
	#content.fr03 > .content-wrap	{padding-top: 80px;;}
	#content.fr03 .article-title + p	{margin-top: 15px;}
	#content.fr03 p + .guide			{margin-top: 32px;}
}

/* FR02 : #content.frenz */
.fc-roulette					{color: #fb2d13;}
.fc-purple						{color: #a668ff;}
.fc-yellow						{color: #f7c12d;}
#content.roulette				{padding-bottom: 0;}
#content.roulette > .content-wrap	{max-width: 100%; padding: 0; font-size: 18px;}
#content.roulette .section			{text-align: center;}
#content.roulette .fs-60 + .fs-30	{margin-top: 8px;}
#content.roulette .img-wrap .img	{width: 100%;}
#content.roulette .marquee-wrap.line .marquee-inner > span		{font-size: 48px; font-weight: 500;}
@media all and (max-width: 1199px){
	#content.roulette .article-title + .fs-30	{margin-top: 12px;}
}
#content.roulette:not(.y2024) .section.roulette-top				{padding: 138px 0 0; background: #000 url(../images/roulette/bg_roulette_top.svg) no-repeat top center; background-size: 100% auto;}
#content.roulette .roulette-top .img-wrap.title			{width: 100%; max-width: 1436px; margin: 30px auto 0;}
#content.roulette .roulette-top .title + p				{margin-top: 64px;}
#content.roulette .roulette-top .fs-30 strong			{color: #fb2c13;}
#content.roulette .roulette-top .period 				{width: fit-content; margin: 40px auto 0; padding: 10px 19px; border: 2px solid #fff; border-width: 2px 0; font-weight: 600;}
#content.roulette .roulette-top .img-wrap.visual		{width: 100%; margin-top: 111px;}
#content.roulette .roulette-top .marquee-wrap.line		{border: 0 none; background: #fb2d13; color: #000;}
#content.roulette .roulette-top .marquee-wrap.line .marquee-inner				{padding: 35px 0 37px;}
@media all and (max-width: 1199px){
	#content.roulette:not(.y2024) .section.roulette-top				{padding: 80px 16px 0; background-image: url(../images/roulette/bg_roulette_top_mo.svg) }
	#content.roulette .roulette-top .img-wrap.title			{margin-top: 0;}
	#content.roulette .roulette-top .title + p				{margin-top: 10px;}
	#content.roulette .roulette-top .period 				{margin-top: 24px; padding: 12px 7px;}
	#content.roulette .roulette-top .img-wrap.visual		{width: calc(100% + 32px); margin: 67px -16px 0;}
	#content.roulette .roulette-top .marquee-wrap.line		{width: calc(100% + 32px); margin-left: -16px; margin-right: -16px;}
	#content.roulette .roulette-top .marquee-wrap.line .marquee-inner				{padding: 16px 0;}
	#content.roulette .roulette-top .marquee-wrap.line .marquee-inner > span		{font-size: 32px; font-weight: 500;}
}
@media all and (max-width: 374px){
	#content.roulette .roulette-top .period 				{font-size: 16px;}
}
#content.roulette .part-in							{padding: 160px 0 200px;}
#content.roulette .part-in .card						{background: var(--card);}
@media all and (max-width: 767px){
	#content.roulette .part-in							{padding: 80px 0 100px;}
	#content.roulette .part-in .bundle-both					{
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	}
}
#content.roulette .part-in:not(.ver2) .article-title				{margin-bottom: 40px;}
#content.roulette .part-in:not(.ver2) .content-wrap + .article-title	{margin-top: 80px;}
#content.roulette .part-in:not(.ver2) .card.banner					{height: 140px; padding: 0 140px; text-align: left; background: var(--card) url(../images/roulette/bg_start@2x.png) no-repeat right bottom; background-size: 100% auto;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
#content.roulette .part-in:not(.ver2) .bundle-both					{gap: 40px;
	-webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch;
}
#content.roulette .part-in:not(.ver2) .bundle-both .card			{padding-bottom: 47px;}
@media all and (max-width: 767px){
	#content.roulette .part-in:not(.ver2) .article-title				{margin-bottom: 20px;}
	#content.roulette .part-in:not(.ver2) .card.banner					{height: fit-content; padding: 40px 28px 167px; background-image: url(../images/roulette/bg_start_mo@2x.png);}
	#content.roulette .part-in:not(.ver2) .bundle-both .card			{padding: 20px 0 40px;}
	#content.roulette .part-in:not(.ver2) .card .fs-30					{margin-top: 20px;}
	#content.roulette .part-in:not(.ver2) .bundle-both					{gap: 20px;}
}
#content.roulette .part-in.ver2						{text-align: left}
#content.roulette .part-in.ver2 .card + .card		{margin-top: 24px}
#content.roulette .part-in.ver2 .card .banner-title		{font-size: 36px;}
#content.roulette .part-in.ver2 .card .badge		{min-width: 101px; height: 43px; font-size: 18px; line-height: 41px;border: solid 1px rgba(255, 255, 255, 0.8);}
@media all and (min-width: 768px){
	#content.roulette .part-in.ver2 .card				{padding: 0 7.35% 0 8.8%;}
	#content.roulette .part-in.ver2 .card .text-wrap	{width: 54%; padding: 48px 0;}
	#content.roulette .part-in.ver2 .card .text-wrap p + p	{margin-top: 32px;}
	#content.roulette .part-in.ver2 .card .img-wrap		{width: 45.62%; max-width: 520px;}
}
@media all and (max-width: 767px){
	#content.roulette .part-in.ver2 .card				{padding: 40px 0 24px;}
	#content.roulette .part-in.ver2 .card .banner-title		{font-size: 32px;}
	#content.roulette .part-in.ver2 .bundle-both					{gap: 24px;}
	#content.roulette .part-in.ver2 .bundle-both > div				{width: 100%}
	#content.roulette .part-in.ver2 .card .text-wrap		{padding: 0 28px;}
	#content.roulette .part-in.ver2 .card .text-wrap p + p	{margin-top: 24px;}
}
@media all and (max-width: 1340px){
	#content.roulette .part-in.ver2 .fc-yellow			{display: block;}
}
/* #content.roulette .spin */
#content.roulette .spin								{overflow: hidden; position: relative; padding: 200px 0 173px; color: #000; background-image: linear-gradient(137deg, #d8cef3 -13%, #e1dbf3 -13%, #f0f0f0 48%, #f4e1dc 109%);}
#content.roulette .pang 								{margin: -18px auto 0; padding: 96px 0 63px; background: transparent url(../images/roulette/bg_pang.svg) no-repeat top center; background-size: 1240px auto;}
#content.roulette .roulette								{position: relative; width: 80%; max-width: 628px; margin: 0 auto; overflow: visible;
	-webkit-backface-visibility: hidden; -moz-backface-visibility: hidden;
}
#content.roulette .roulette .img.rboard					{width: 100%; transform-origin: center;}
#content.roulette .roulette .niddle						{position: absolute; top: -5%; left: 50%; width: 9%; z-index: 3;
	-webkit-transform: translateX(-50%);
			transform: translateX(-50%);
}
#content.roulette .roulette .btn						{position: absolute; top: 50%; left: 50%; width: 25.47%;
	-webkit-transform: translate(-50%, -50%);
			transform: translate(-50%, -50%);
}
#content.roulette .spin .counting						{width: fit-content; margin: 0 auto 12px; padding: 20px 60px; font-weight: bold; color: #fff; background: var(--card);}
#content.roulette .spin .overlay						{position: absolute;}
#content.roulette .spin .overlay.active					{z-index: 4;}
@media all and (max-width: 1199px){
	#content.roulette .spin								{padding: 100px 0;}
	#content.roulette .pang 								{margin-top: 10px; padding: 40px 0;}
	#content.roulette .roulette								{width: 91.46%;}
	#content.roulette .spin .counting						{margin-bottom: 20px;}
}
#content.roulette .prize							{padding: 200px 0 210px; background: #fff linear-gradient(128deg, #fe4416 24%, #fe4416 24%, #f81b43 95%);}
#content.roulette .prize .content-wrap.bundle-both		{margin-top: 83px;
	-webkit-flex-wrap: wrap; flex-wrap: wrap;
}
#content.roulette .prize .card							{position: relative; padding-bottom: 40px; font-weight: 500; color: #000; background: #fff;}
#content.roulette .prize .card .circle					{position: absolute; right: 20px; top: 20px; width: 72px; height: 72px; color: #fff; font-weight: 600;background-image: linear-gradient(146deg, #ff3f25 15%, #ce004a 93%);
	border-radius: 72px;
	-moz-border-radius: 72px;
	-webkit-border-radius: 72px;
}
@media all and (min-width: 768px){
	#content.roulette .prize .card .circle.wide				{right: 24px; top: 24px;}
}
@media all and (max-width: 767px){
	#content.roulette .prize							{padding: 100px 0 110px; background-image: linear-gradient(171deg, #fe4416 18%, #fe4416 18%, #f81b43 94%);}
	#content.roulette .prize .content-wrap.bundle-both		{gap: 20px; margin-top: 40px;}
	#content.roulette .prize .card,
	#content.roulette .prize .card.wide						{width: 100%;}
	#content.roulette .prize.wide .img-wrap					{margin-bottom: 20px;}
	#content.roulette .prize .card .circle					{position: absolute; auto; right: 16px; top: 16px;}
}
#content.roulette .prize:not(.ver2) .content-wrap.bundle-both		{gap: 40px;}
#content.roulette .prize:not(.ver2) .card							{width: calc((100% - 80px)/3);}
#content.roulette .prize:not(.ver2) .card.wide						{width: calc(50% - 20px);}

@media all and (min-width: 768px){
	#content.roulette .prize.ver2 .content-wrap.bundle-both		{gap: 23px;}
	#content.roulette .prize.ver2 .card							{width: calc((100% - 46px)/3);}
}
/* .marquee-wrap.line */
@media all and (max-width: 1199px){
	#content.roulette .marquee-wrap.line.check-point .marquee-inner				{padding: 16px;}
	#content.roulette .marquee-wrap.line.check-point .marquee-inner > span		{font-weight: 500;}
}
#content.roulette .bg-game							{padding: 200px 0; background: #000 url(../images/roulette/bg_checkpoint.png) no-repeat top center; background-size:cover;}
#content.roulette .bg-game .tips .guide 				{font-size: 16px;}
#content.roulette .bg-game .tip-box						{margin-bottom: 20px; padding: 48px 80px; background: rgba(255, 255, 255, .15);}
#content.roulette .tip-box h3							{position: relative; overflow: visible; padding-bottom: 20px; margin-bottom: 24px; border-bottom: 2px solid #fff;}
#content.roulette .tip-box .tip-bubble					{position: absolute; left: -102px; top: -85px; width: 102px; height: 103px; background: transparent url(../images/roulette/bg_tip-bubble.svg) no-repeat center; background-size: 100% auto;
}
#content.roulette .tip-box .tip-bubble span 			{font-size: 18px; font-weight: bold;
	-moz-transform: rotate(-349.49deg);
	-webkit-transform: rotate(-349.49deg);
	-o-transform: rotate(-349.49deg);
	-ms-transform: rotate(-349.49deg);
	transform: rotate(-349.49deg);
}
#content.roulette .tip-box .fc-point					{color: #ff3519;}
#content.roulette .tip-box .mission 					{margin-top: 20px;}
#content.roulette .tip-box .guide 						{margin-top: 24px; color: var(--gray);}
#content.roulette .tip-box .guide:not(.box) p + p		{margin-top: 4px;}
#content.roulette .tip-box  + .guide 					{color: #fff; padding-left: 10px; text-indent: -10px;}
#content.roulette .bg-game .achievement					{margin-top: 108px;}
@media all and (max-width: 1199px){
	#content.roulette .bg-game							{overflow: hidden; padding: 157px 0 99px; background-image: url(../images/roulette/bg_checkpoint_mo.png);}
	#content.roulette .bg-game .tip-box						{margin-bottom: 16px; padding: 52px 24px;}
	#content.roulette .bg-game .achievement					{margin-top: 80px;}
	#content.roulette .tip-box .tip-bubble					{left: -20px; top: -112px; width: 88px; height: 88px;}
	#content.roulette .tip-box h3.fs-30 					{font-size: 30px;}
}
#content.roulette .progress-wrap							{margin-top: 40px; padding-top: 156px; font-size: 16px;}
#content.roulette .progress-wrap .progress,
#content.roulette .progress-wrap .progress .progress-bar	{overflow: visible;}
#content.roulette .progress-wrap .progress:before,
#content.roulette .progress-wrap .progress-bar	{position: absolute; height: 10px; background-image: linear-gradient(91deg, rgba(166, 74, 218, 1) 17%, rgba(255, 163, 111, 1) 75%); background-size: 100%;
	border-radius: 999px;
	background-size: 85vw;}
#content.roulette .progress-wrap .progress					{position: relative; width: 100%;}
#content.roulette .progress-wrap .progress:before			{content:''; display: block; width: 100%; height: 10px; opacity: .3;}
#content.roulette .progress-wrap .progress .progress-bar	{width: 0;}
#content.roulette .progress-wrap .progress .point-wrap		{position: absolute; overflow: visible; top: -4px; width: 100%;}
#content.roulette .progress-wrap .progress .point-wrap .point	{position: relative; overflow: visible; width: 18px; height: 18px;}
#content.roulette .progress-wrap .progress .point-wrap .flag		{position: absolute; top: -60px; display: block; height: 36px; padding: 6px 0; font-size: 16px; background-repeat: no-repeat; background-position: left top; background-size: auto 36px; text-align: center;}
#content.roulette .progress-wrap .progress .point-wrap .flag span		{font-weight: 600;}
#content.roulette .progress-wrap .progress .point-wrap .flag:not(.on)	{opacity: .3}
#content.roulette .progress-wrap .progress .point-wrap .flag.start		{left:0; width: 89px; background-image: url(../images/roulette/bg_point_start.svg);}
#content.roulette .progress-wrap .progress .point-wrap .flag.end		{right: 0; width: 177px; background-image: url(../images/roulette/bg_point_end.svg);}
#content.roulette .progress-wrap .progress .line			{position: absolute; left: 50%; top: 18px; content:''; display: block; width: 1px; height: 20px; border-left: 1px dotted var(--gray-dark);}
#content.roulette .progress-wrap .progress .legend			{position: absolute; left: 50%; top: 41px; display: block; width: 49px; text-align: center;
	-webkit-transform: translateX(-50%);
			transform: translateX(-50%);
}
#content.roulette .progress-wrap .progress .point-wrap .ico.circle	{display: block; width: 18px; height: 18px; background: var(--gray-dark);
		border-radius: 999px;
}
#content.roulette .progress-wrap .progress .point-wrap .ico.circle.on	{background: #fff;}
#content.roulette .progress-wrap .progress .progress-bar .imhere		{overflow: visible; position: absolute; top: -156px; width: 107px; right: 0; z-index: 5;
	-webkit-transform: translateX(50%);
			transform: translateX(50%);
}
#content.roulette .progress-wrap .progress .profile.card		{position: relative; height: 132px; padding: 19px 0; gap: 4px; border: solid 1px #292929; background: var(--card);
	box-shadow: 10px 10px 40px 0 rgba(0, 0, 0, 0.25);
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
#content.roulette .progress-wrap .progress .profile.card .img-wrap		{margin-bottom: 4px;}
@media (orientation: portrait) {
	#content.roulette .progress-wrap .progress,
	#content.roulette .progress-wrap .progress .progress-bar	{
		background-size: 500px;
	}
	#content.roulette .progress-wrap							{margin-top: 60px; padding-top: 0; width: 500px; height: 500px;}
	#content.roulette .progress									{
		-moz-transform: rotate(90deg);
		-webkit-transform: rotate(90deg);
		-o-transform: rotate(90deg);
		-ms-transform: rotate(90deg);
		transform: rotate(90deg);

		transform-origin: 10px 10px;
	}
	#content.roulette .progress-wrap .progress .legend,
	#content.roulette .progress-wrap .progress .profile.card,
	#content.roulette .progress-wrap .progress .flag{
		-moz-transform: rotate(-90deg);
		-webkit-transform: rotate(-90deg);
		-o-transform: rotate(-90deg);
		-ms-transform: rotate(-90deg);
		transform: rotate(-90deg);
	}
	#content.roulette .progress-wrap .progress .progress-bar .imhere			{top: -73px; width: 48px;}
	#content.roulette .progress-wrap .progress .profile.card		{min-width: 171px; height: 48px; padding: 12px 18px; gap: 8px;
		-webkit-flex-direction: row; flex-direction: row;
		transform-origin: 24px;
	}
	#content.roulette .progress-wrap .progress .profile.card .img-wrap		{display: none;}
	#content.roulette .progress-wrap .progress .line			{height: 8px}
	#content.roulette .progress-wrap .progress .legend			{left: -80%; text-align: right;}
	#content.roulette .progress-wrap .progress .point-wrap .flag.start	{top: -82px; left: -37px;}
	#content.roulette .progress-wrap .progress .point-wrap .flag.end	{top: -126px; right: -81px; background-image: url(../images/roulette/bg_point_end_mo.svg);}
}
#content.roulette .precaution						{padding: 80px 0;}
#content.roulette .precaution h3,
#content.roulette .precaution .guide					{font-size: 16px;}
#content.roulette .precaution h3						{color: var(--gray-dark); font-weight: bold;}
#content.roulette .precaution .guide					{margin-top: 20px;}
#content.roulette .precaution .guide:not(.box) p + p	{margin-top: 8px;}


#content.accept-mail								{min-height: calc(var(--vh100) - 132px); padding-top: 100px;
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-justify-content: center; -ms-flex-pack: center; justify-content: center;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
#content.accept-mail .content-wrap						{width: 100%;}
#content.accept-mail .page-title + p.en					{margin-top: 12px;}
#content.accept-mail p.en + p							{margin-top: 60px;}
#content.accept-mail .button-area						{margin: 40px 0;}
@media all and (min-width: 768px){
	#content.accept-mail .content-wrap						{max-width: calc(520px + 32px);}
}
@media all and (max-width: 767px){
	#content.accept-mail p.en + p							{margin-top: 40px;}
	#content.accept-mail .button-area						{margin: 32px 0;}
}










/* 															common 															*/
/* common margin */
.title-group + .data-list,
.title-group + .no-result	{margin-top: 40px;}
.title-group + .guide		{margin-top: 28px;}
@media all and (max-width: 1199px){
	.title-group + .data-list,
	.title-group + .no-result	{margin-top: 32px;}
}










/* 															popup 															*/
.popup-body .button-area			{margin-top: 40px}
.popup-body .guide.box,
.popup-body .popup-title.ta-c + p	{margin-top: 20px;}
@media all and (min-width: 1200px){
	#popSupported .popup-body,
	#popLeaveFr .popup-body,
	#popCancelSu .popup-body,
	#popCancelIn .popup-body					{overflow-y: hidden}
}
/* #popPrivacy */
#popPrivacy .popup				{max-width: 854px; max-height: 600px; --pop-height: 600px;}
#popPrivacy .rwd-table			{font-size: 14px; color: var(--gray-dark);}
@media all and (min-width: 1200px){
	#popPrivacy .rwd-table			{margin-bottom: 16px;}
	#popPrivacy .rwd-table tr td:nth-child(1){width: 25.8%;}
	#popPrivacy .rwd-table tr td:nth-child(2),
	#popPrivacy .rwd-table tr td:nth-child(3){width: 37.1%;}
}
@media (orientation: portrait) {
	#popPrivacy .popup				{max-height: 583px; --pop-height: 583px;}
}

/* #popAds */
#popAds .popup				{max-height: 490px; --pop-height: 490px;}
@media (orientation: portrait) {
	#popAds .popup				{max-height: 500px; --pop-height: 500px;}
}

/* #popAdsV2 */

/* #popCreatorRules */
#popCreatorRules .popup				{max-width: 854px; max-height: 600px; --pop-height: 600px;}
@media (orientation: portrait) {
	#popCreatorRules .popup				{max-height: 583px; --pop-height: 583px;}
}

/* #popSupport */
#popSupport .field					{margin-bottom: 0;}
#popSupport .guide.box + .check-wrap	{margin-top: 12px;}
#popSupport .check-wrap				{font-size: 14px; min-height: 21px; line-height: 21px;}
#popSupport .check-wrap .bundle-both .btn{-webkit-align-items: center; align-items: center; }
#popSupport .check-wrap .checkbox	{margin:0}
@media (orientation: portrait) {
	#popSupport .popup				{max-height: calc(var(--vh100) - 4vw); --pop-height: 592px;}
}

/* #popSupported */
#popSupported .popup			{max-height: 492px; --pop-height: 492px;}
#popSupported .popup-body > p + p	{margin-top: 12px;}
@media (orientation: portrait) {
	#popSupported .popup			{max-height: calc(var(--vh100) - 4vw); --pop-height: 508px;}
	#popSupported .popup-body		{padding-top: 24px;}
}

/* #popSupportCom */
#popSupportCom .popup			{max-height: 304px; --pop-height: 304px;}
#popSupportCom .popup-body		{overflow-y: hidden;}
@media (orientation: portrait) {
	#popSupportCom .popup			{max-height: 272px; --pop-height: 272px;}
	#popSupportCom .popup-body		{padding-top: 24px;}
}

/* #popMission */
#popMission .popup				{max-height: 717px; --pop-height: 717px;}
#popMission .popup .support-form,
#popMission .field-group + .ta-c,
#popMission .field + .field			{margin-top: 28px;}
#popMission .support-form p + .field-group	{margin-top: 12px;}
#popMission .field-group			{border-top: solid 2px #000;}
#popMission .field-group > .popup-title	{padding: 20px 0 32px;}
#popMission .field-group + .field-group			{margin-top: 40px;}
#popMission .field-group.new-certification > .popup-title	{padding: 16px 0 31px;}
#popMission .field					{margin-bottom: 0;}
#popMission .ta-c + .guide			{margin-top: 40px;}
#popMission .ta-c .btn				{gap: 8px;}
@media (orientation: portrait) {
	#popMission .popup					{max-height: calc(var(--vh100) - 4vw);}
}

/* #popMissionCoupon */
#popMissionCoupon .popup			{height: calc(var(--vh100) - 4vw); max-height: 720px; --pop-height: 720px;}
#popMissionCoupon .support-form			{margin-top:28px;}
#popMissionCoupon .field				{margin-bottom: 0;}
#popMissionCoupon .field + .field		{margin-top: 28px;}
@media (orientation: portrait) {
	#popMissionCoupon .popup				{max-height: calc(var(--vh100) - 4vw); --pop-height: calc(var(--vh100) - 4vw);}
}

/* #popLeave */
@media (orientation: portrait) {
	#popLeave .popup				{max-height: calc(var(--vh100) - 4vw);}
}
@media (orientation: portrait) and (max-height: 640px) {
	#popLeave .popup				{--pop-height: calc(var(--vh100) - 4vw);}
}

/* #popNoCreater */
#popNoCreater .popup-header		{height: 60px;}
#popNoCreater .popup-body		{height: calc(var(--pop-height) - 60px);}

/* .popup.congrats : #popCon, #popCon4, #popCon5 */
.popup.congrats		{background: linear-gradient(63deg, rgb(56, 44, 37) 0%, rgb(21, 22, 27) 50%, rgb(39, 33, 51) 100%); color: #fff;}
.popup.congrats .popup-header		{height: 60px; padding: 0;}
.popup.congrats .popup-header .btn.btn-close .svg path	{fill: #fff;}
.popup.congrats .popup-body		{padding: 0 60px 60px;}
.popup.congrats .img-wrap		{width: 270px; height: 210px; margin: 0 auto 40px;}
.popup.congrats .img-wrap img	{width: 100%;}
.popup.congrats .popup-body > p + p,
.popup.congrats .code-box + .guide	{margin-top: 20px;}
.popup.congrats .code-box		{height: 64px; margin-top: 40px; padding: 0 16px; background-color: rgba(255, 255, 255, 0.16);}
.popup.congrats .code-box .bundle-left	{gap: 12px; font-weight: 500;}
.popup.congrats .code-box .btn	{width: 77px;}
@media (orientation: portrait) {
	.popup.congrats .popup-body		{padding-left: 24px; padding-right: 24px;}
	.popup.congrats .img-wrap		{width: 217px; height: 170px;}
}
@media (max-width: 374px) {
	.popup.congrats .code-box .bundle-left	{font-size: 14px;}
}

/* #popCon */

/* #popCongrat4 */
#popCon4 .popup				{max-width: 614px;}

/* #popCongrat5 */
#popCon5 .popup				{max-width: 520px; height: 689px; --pop-height: 689px;}
#popCon5 .popup.congrats .img-wrap	{margin-bottom: 20px;}
#popCon5 .popup-body		{height: calc(var(--pop-height) - 60px); padding-bottom: 60px;}
@media (orientation: portrait), (max-height: 715px) {
	#popCon5 .popup				{--pop-height: calc(var(--vh100) - 4vw);}
	#popCon5 .popup-body		{padding-bottom: 40px;}
}

/* #popCCon */
#popCCon .popup		{background: linear-gradient(63deg, rgb(56, 44, 37) 0%, rgb(21, 22, 27) 50%, rgb(39, 33, 51) 100%); color: #fff;}
#popCCon .popup-header		{height: 80px; padding: 0;}
#popCCon .popup-header .btn.btn-close .svg path	{fill: #fff;}
#popCCon .popup-body		{height: calc(var(--pop-height) - 80px); padding-bottom: 80px;}
#popCCon .popup-body p + p	{margin-top: 20px;}

/* #popFirst */
#popFirst .popup		{max-width: 460px;}
#popFirst .popup-body		{height: calc(var(--pop-height) - 63px); padding: 0;}
#popFirst .popup-footer		{height: 63px; padding: 19px 30px; border: solid 1px var(--gray-light); background-color: var(--bg-guide);}
#popFirst .popup-footer .btn	{font-weight: 500;}
#popFirst .img-wrap			{height: 449px;  background: #e7e7e7;}

/* #popEvent */
#popEvent .popup				{max-height: 511px; --pop-height: 511px;}
@media (orientation: portrait) {
	#popEvent .popup				{max-height: 500px; --pop-height: 500px;}
}

/* #popPointPrivacy */
#popPointPrivacy .popup				{max-width: 600px;}
#popPointPrivacy .rwd-table			{font-size: 14px; color: var(--gray-dark);}

/* #popIdPrivacy */
#popIdPrivacy .popup				{max-width: 854px;}
#popIdPrivacy .rwd-table			{font-size: 14px; color: var(--gray-dark);}
@media all and (min-width: 1200px){
	#popIdPrivacy .rwd-table			{margin-bottom: 16px;}
	#popIdPrivacy .rwd-table tr td:nth-child(1){width: 25.8%;}
	#popIdPrivacy .rwd-table tr td:nth-child(2),
	#popIdPrivacy .rwd-table tr td:nth-child(3){width: 37.1%;}
}

/* #popEntrust */
#popEntrust .rwd-table			{font-size: 14px; color: var(--gray-dark);}
@media all and (min-width: 1200px){
	#popEntrust .rwd-table			{margin-bottom: 16px;}
}

/* #popComing */
#popComing .popup				{max-width: 460px; --pop-height: 520px; background: #000 url('../images/com/bg_comingsoon@2x.png') no-repeat 50% 50%; background-size: 100% auto;}
#popComing .popup-body				{height: calc(var(--pop-height) - 16px); padding: 0;}
#popComing .btn.btn-close .svg path	{fill: #fff;}
#popComing .popup-header			{height: 16px; padding: 0;}
#popComing .popup-body				{padding-bottom: 0;}
#popComing .popup-title,
#popComing .popup p					{color: #fff;}
#popComing .popup-title				{font-size: 36px; font-weight: bold;}
#popComing .popup p					{margin: 12px 0 40px;}
@media (orientation: portrait){
	#popComing .popup				{max-width: 343px; --pop-height: 510px; background-image: url('../images/com/bg_comingsoon_mo@2x.png'); background-size: auto 100%}
	#popComing .popup-body				{height: calc(var(--pop-height) - 6px);}
	#popComing .popup-header			{height: 6px;}
	#popComing .popup-title				{font-size: 32px;}
}

/* #popSubscribe */
#popSubscribe .popup .button-area						{gap: 8px;}
#popSubscribe .popup .button-area .btn.medium:not(.underline)	{width: calc((100% - 8px)/2); min-width: calc((100% - 8px)/2); padding: 0 10px}
@media (orientation: portrait) {
	#popSubscribe .popup				{max-height: 503px; --pop-height: 503px;}
}

/* #popCreatorNoti */
#popCreatorNoti .noti-area				{overflow-y: auto; max-height: 240px;  margin: 16px 0 40px; padding: 20px; font-size: 14px; font-weight: 500; color: var(--gray-dark); background: var(--bg-guide);}

/* #eventLoading */
#eventLoading .loading-image	{width: 240px; height: 240px; margin-top: 68px;
	background-image: url("../images/roulette/img_loading_01@2x.png"); background-position: center; background-size: 100% 100%;
	-webkit-animation: eventLoding 1s infinite;
		-moz-animation: eventLoding 1s infinite;
		-o-animation: eventLoding 1s infinite;
		animation: eventLoding 1s infinite;
}
@keyframes eventLoding {
	0% {
		background-image: url("../images/roulette/img_loading_01@2x.png");
	}
	33% {
		background-image: url("../images/roulette/img_loading_02@2x.png");
	}
	66% {
		background-image: url("../images/roulette/img_loading_03@2x.png");
	}
	99%{
		background-image: url("../images/roulette/img_loading_01@2x.png");
	}
}
@media (orientation: portrait) {
	#eventLoading .loading-image	{width: 150px; height: 150px; margin-top: 0;}
}


/* .pop-game-info */
.pop-game-info .popup{max-width: 280px;}
.pop-game-info .popup-header{height: auto;padding: 24px 20px 0;}
.pop-game-info .popup-header .ico.search2{margin-right: 2px;vertical-align: -5px;}
.pop-game-info .popup-body{padding: 0 20px 24px;}
.pop-game-info .popup-body .data-table2 tbody tr th{width: 80px;}
@media all and (min-width: 1200px){
	#content.cr02 .pop-game-info .popup{max-width: 440px;min-height: 182px;}
	#content.cr02 .pop-game-info .data-table2 tbody{display: flex; flex-wrap: wrap;}
	#content.cr02 .pop-game-info .data-table2 tbody tr{width: 50%;}
	#content.cr02 .pop-game-info .data-table2 tbody tr th{box-sizing: border-box;}
	#content.cr02 .pop-game-info .data-table2 tr:nth-child(2) th,
	#content.cr02 .pop-game-info .data-table2 tr:nth-child(4) th{border-left: 1px solid var(--gray-light);}
	#content.cr02 .pop-game-info .data-table2 tbody tr td{width: 120px; box-sizing: border-box;}
}


/* #popSponsor */
#popSponsor .field:not(.bundle-both)	{margin-bottom: 0;}
#popSponsor .button-area				{margin-top: 40px;}
#popSponsor .search-form,
#popSponsor .search-form + .sub-title	{margin-top: 48px;}
#popSponsor .sub-title + p				{margin-top: 20px;}
#popSponsor .search-box					{width: 100%;}


/* CR03 */
#content.cr03					{padding-top: 210px;}
#content.cr03 .my-info			{padding: 28px 80px; border-radius: 2px; background-image: linear-gradient(96deg, #feed78 8%, #fed771 79%); gap: 40px;
}
#content.cr03 .my-info .item.channel	{
	display: -ms-flexbox; display: -webkit-flex; display: flex;
	-webkit-align-items: center; -ms-flex-align: center; align-items: center;
}
#content.cr03 .my-info .info-wrap		{width: fit-content; gap: 64px; padding-top: 3px; border-color: rgba(179,179,179, 0.3);}
#content.cr03 .sub-title				{margin-top: 32px;}
#content.cr03 .textarea					{overflow-y: auto; max-height: 170px; margin-top: 20px; padding: 36px 32px; color: #000; border-radius: 2px; }
@media all and (min-width: 1200px){
	#content.cr03 .my-info					{
		-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
	}
	#content.cr03 .my-info .info-wrap		{padding-bottom: 3px;}
}
@media all and (max-width: 1199px){
	#content.cr03 .my-info					{gap: 32px;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
	}
	#content.cr03 .my-info .info-wrap		{padding-top: 24px; padding-left: 0; border-left: 0 none; border-top: 1px solid rgba(179,179,179, 0.3);
		-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
	}
}
@media all and (min-width: 768px) {
	#content.cr03 .my-info .item.channel	{width: 100%; max-width: 519px;
		-webkit-justify-content: space-between; -ms-flex-pack: justify; justify-content: space-between;
	}
	#content.cr03 .my-info .info-wrap		{width: 100%; max-width: 542px;}
}
@media all and (max-width: 767px){
	#content.cr03					{padding-top: 140px;}
	#content.cr03 .my-info			{padding: 40px 28px 28px; gap: 20px;
		-webkit-align-items: stretch; -ms-flex-align: stretch; align-items: stretch;
	}
	#content.cr03 .my-info .item.channel	{gap: 16px;
		-webkit-flex-direction: column; -ms-flex-direction: column; flex-direction: column;
		-webkit-align-items: flex-start; -ms-flex-align: start; align-items: flex-start;
	}
	#content.cr03 .my-info .info-wrap		{width: 100%;}
	#content.cr03 .textarea					{max-height: 344px; padding: 28px 20px;}
}
#content.cr03 .item.channel .bundle-left		{min-width: 213px; gap: 16px;}
#content.cr03 .item.channel .channel-info p + p	{margin-top: 4px;}
#content.cr03 .item.channel .btn.small			{width: 196px; height: 50px; line-height: 50px;}
#content.cr03 .item.channel .title				{font-size: 24px;}
#content.cr03 .my-info .info-wrap dl			{width: auto; min-width: 40px;}
#content.cr03 .my-info .info-wrap dl dt			{color: #000;}
#content.cr03 .my-info .info-wrap dl dd			{color: #000;}
@media all and (max-width: 767px){
	#content.cr03 .item.channel .creator-code		{font-size: 16px;}
	#content.cr03 .my-info .info-wrap dl + dl		{margin-left: 0;}
	#content.cr03 .my-info .info-wrap dl dt			{font-size: 14px;}
	#content.cr03 .my-info .info-wrap dl dd			{font-size: 22px;}
}