@charset "utf-8";

:root {
	/* base */
	--cts-gutter: 20px;

	/* font */
	/* Noto Sans JP
	Noto Sans JP Regular 400
	Noto Sans JP Medium 500
	Noto Sans JP Bold 600
	Noto Sans JP Black 900
	*/

	--cts-font-size: clamp(13px,3.47vw,16px);
	--cts-font-ls: .025em;/*letter-spacing*/
	--cts-font-lis-02: .05em;

	/* color */
	--cts-color: #000;
}


/* LP共通汎用
____________________*/
img {
	image-rendering: -webkit-optimize-contrast;
}
.sp {
	display: none;
}


/* /illustration/activities/illust-contest_03/
____________________*/
.illust-contest {
	color: #000;
}
.illust-contest__itemwrap {
	display: flex;
	margin-block-start: clamp(20px,5.33vw,35px);
	text-align: center;
}
.illust-contest__itemwrap.__mbs50 {
	margin-block-start: clamp(25px,6.67vw,50px);
}
.illust-contest__item {
	width: 50%;
	padding: clamp(20px,5.33vw,50px) clamp(10px,2.67vw,55px) clamp(20px,5.33vw,55px);
}
.illust-contest__item--light {
	background: linear-gradient(180deg, #FFFCE8 0%, #FFF08B 65%, #FFC84A 100%);
	color: #000;
}
.illust-contest__item--dark {
	background: linear-gradient(180deg, #7626DE 0%, #3E0B8B 65%, #12003D 100%);
	color: #fff;
}
.p-activity-article .illust-contest__item h3 {
	font-size: clamp(15px,4vw,20px);
}
.p-activity-article .illust-contest__item--dark h3 {
	color: #fff;
}
.illust-contest__itemimg {
	margin-block-start: clamp(15px,4vw,25px);
	margin-inline: auto;
}
.illust-contest__item--judge .illust-contest__itemimg {
	max-width: 250px;
}
.illust-contest__item--judge a {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	margin-block-start: clamp(10px,2.67vw,15px);
	font-size: clamp(17px,4.53vw,24px);
	font-weight: 600;
	text-decoration: none;
	opacity: 1;
	transition: all .3s;
}
.illust-contest__item--judge a:hover {
	opacity: .7;
}
.illust-contest__item--judge a::after {
	content: none;
}
.illust-contest__item--judge a img {
	width: 1em;
	height: auto;
	position: absolute;
	right: 0;
}
.illust-contest__item--judge.illust-contest__item--light a {
	border-bottom: 1px solid #000;
	color: #000;
}
.illust-contest__item--judge.illust-contest__item--dark a {
	border-bottom: 1px solid #fff;
	color: #fff;
}
.illust-contest__item--light {
	background: linear-gradient(180deg, #FFFCE8 0%, #FFF08B 65%, #FFC84A 100%);
}
.illust-contest__itemlist {
	margin-block-start: clamp(15px,4vw,28px);
	text-align: left;
	letter-spacing: .025em;
}
.illust-contest__itemlist li {
	padding-inline-start: 1.5em;
	text-indent: -1.5em;
}
.illust-contest__itemlist li::before {
	content: "■";
	margin-inline-end: .5em;
}
.illust-contest__heading {
	display: flex;
	align-items: center;
	margin-block-end: clamp(20px,5.33vw,30px);
	font-size: clamp(20px,5.33vw,30px);
	font-weight: 500;
	text-align: center;
}
.illust-contest__heading::before,
.illust-contest__heading::after {
	content: "";
	flex-grow: 1;
	height: 1px;
	background-color: #999;
}
.illust-contest__heading::before {
	margin-inline-end: 1.5em;
}
.illust-contest__heading::after {
	margin-inline-start: 1.5em;
}
.p-activity-article .illust-contest__itemimg .__modal a {
	display: inline-block;
}
.illust-contest__awardlink {
	display: inline-block;
	margin-block-start: clamp(10px,2.67vw,20px);
	font-size: clamp(16px,4.27vw,22px);
	text-decoration: none;
	opacity: 1;
	transition: all .3s;
}
.illust-contest__awardlink:hover {
	opacity: .7;
}
.illust-contest__item--light .illust-contest__awardlink {
	color: #000;
}
.illust-contest__item--dark .illust-contest__awardlink {
	color: #fff;
}
.illust-contest__awardname {
	font-size: clamp(15px,4vw,20px);
}
.illust-contest__awardtxt {
	margin-block-start: clamp(15px,4vw,27px);
	font-size: clamp(13px,3.47vw,16px);
	text-align: left;
	letter-spacing: .025em;
}
.p-activity-article h2.__mbs100 {
	margin-block-start: clamp(50px,13.33vw,100px);
}
.illust-contest__itemwrap--other {
	margin-block-start: clamp(50px,13.33vw,100px);
}
.illust-contest__item--other {
	padding: 0;
}
.illust-contest__otherwrap .illust-contest__itemimg {
	height: 100%;
	padding: clamp(20px,5.33vw,50px) clamp(10px,2.67vw,55px) clamp(20px,5.33vw,55px);
	background: linear-gradient(180deg, #FEFEFE 0%, #F1F1F1 65%, #C2C2C2 100%);
}
.illust-contest__sameheight01 .__middle {
	display: flex;
	justify-content: center;
	align-items: center;
	height: 100%;
}
a.noicon {
	opacity: 1;
	transition: all .3s;
}
a.noicon:hover {
	opacity: .7
}
a.noicon::after {
	content: none;
}
.illust-camp {
	margin-block-start: clamp(15px,4vw,30px);
}
.illust-camp h2 {
	font-size: clamp(20px,5.33vw,30px);
}
.illust-camp__lead {
	margin-block-start: clamp(7px,1.87vw,15px);
	font-size: clamp(16px,4.27vw,20px);
	font-weight: 600;
	text-align: center;
	color: #000;
}
.illust-camp__img {
	margin-block-start: clamp(20px,5.33vw,40px);
}
.illust-camp__use {
	margin-block-start: clamp(20px,5.33vw,45px);
	font-size: clamp(16px,4.27vw,20px);
	text-align: center;
}
.illust-camp__use dt {
	font-weight: 600;
}
.illust-camp__copy {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: clamp(15px,4vw,27px);
	background: #E1E3E8;
	margin-block-start: clamp(15px,4vw,25px);
	padding: clamp(15px,4vw,32px) 10px;
}
.illust-camp__couponcodewap {
	width: clamp(250px,85vw,400px);
	background: #FF5500;
	padding: clamp(13px,3.47vw,17px) 5px clamp(17px,4.53vw,25px);
	color: #fff;
}
.illust-camp__couponcodewap h4 {
	font-size: clamp(15px,4vw,18px);
	text-align: center;
}
.illust-camp__couponcodeinner {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: clamp(20px,5.33vw,45px);
	margin-block-start: clamp(10px,2.67vw,15px);
}
.illust-camp__couponcode {
	font-size: clamp(20px,5.33vw,24px);
	font-weight: 900;
	letter-spacing: .15em;
}
.illust-camp__couponcopy {
	position: relative;
	width: clamp(100px,26.67vw,118px);
	bottom: 0;
	background: #FFF1E9;
	border: 2px solid #6E2500;
	border-radius: 50px;
	padding: clamp(4px,1.07vw,5px) 0 clamp(8px,2.13vw,10px);
	font-size: clamp(15px,4vw,18px);
	font-weight: 600;
	text-align: center;
	color: #6E2500;
	line-height: 1;
	cursor: pointer;
	box-shadow: 0px 3px 6px #0000006b;
	opacity: 1;
	transition: all .3s;
}
.illust-camp__couponcopy:hover {
	bottom: -2px;
	box-shadow: 0px 1px 1px #0000006b;
	opacity: .7;
}
.illust-camp__note {
	font-size: clamp(12px,3.2vw,14px);
}
.illust-camp__note li {
	padding-left: 1em;
	text-indent: -1em;
}
.illust-camp__note li::before {
	content: "※";
}
.illust-camp__usedetail {
	font-size: clamp(14px,3.73vw,16px);
	margin-block-start: clamp(15px,4vw,25px);
	text-align: center;
}
.illust-camp__usedetail a {
	color: #0995EC;
	opacity: 1;
	transition: all .3s;
}
.illust-camp__usedetail a:hover {
	opacity: .7;
}
.illust-camp__usedetail a::after {
	content: none;
}
.illust-contest__productlink {
	text-align: center;
}
.illust-contest__productlinkinner {
	display: inline-block;
	margin-block-start: clamp(20px,5.33vw,27px);
	opacity: 1;
	transition: all .3s;
}
.illust-contest__productlinkinner:hover {
	opacity: .7;
}
a.illust-contest__productlinkinner::after {
	content: none;
}
.p-activity-article__body._border._noborder {
	border: none;
}


@media (max-width: 768px) {
	.pc {
		display: none;
	}
	.sp {
		display: block;
	}
	.illust-contest__itemwrap {
		flex-wrap: wrap;
		gap: clamp(25px,6.67vw,40px);
	}
	.illust-contest__item {
		width: clamp(300px,100%,500px);
		margin-inline: auto;
	}
	.illust-contest__item--judge .illust-contest__itemimg {
		width: 55vw;
	}
	.illust-contest__item--judge a img {
		width: clamp(20px,5.37vw,25px);
	}
	.p-activity-article .illust-contest__itemimg .__modal a {
		max-width: 75vw;
		margin-inline: auto;
	}
	.illust-camp__copy {
		flex-wrap: wrap;
	}
	.illust-camp__usedetail a {
		display: block;
	}
}



/* クーポンコード */
#copyMsg {
	position: fixed;
	display: none;
	width: 20em;
	top: calc(var(--header-total-height-pc) * 1px + 3vw);
	left: 50%;
	background: var(--illustration-key-color);
	padding: 1em 1.5em;
	border: 1px solid rgba(255,255,255,.7);
	border-radius: 50px;
	font-size: clamp(14px,3.73vw,18px);
	text-align: center;
	color: #fff;
	z-index: 1000;
	transform: translateX(-50%);
	transition: all 3s;
	box-shadow: 0px 0px 10px #fff;
}
#copyMsg.fadeout {
	animation: fadein 3s ease-in .2s 1 forwards;
	z-index: 500;
	display: inline;
}
@keyframes fadein {
	0% {
		opacity: 9;
	}
	50% {
		opacity: 8;
	}
	100% {
		opacity: 0;
    }
}
