#mainimage {
	position: relative;
}

#mainimage_catch {
	max-width: 1200px;
	width: 62.5dvw;
	position: absolute;
	z-index: 2;
	color: #fff;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

#mainimage_catch .eng {
	color: #fff;
	font-size: clamp(180px, 13dvw, 250px);
	mix-blend-mode: color-dodge;
	line-height: 0.9em;
	white-space: nowrap;
}

#mainimage_catch h2 {
	position: absolute;
	text-align: right;
	font-size: clamp(20px, 1.5625dvw, 30px);
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 100%;
	line-height: 1.5em;
}

#mainimage_img {
	width: 100%;
	height: 90dvh;
}

#mainimage_img img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#mainimage_link {
	display: flex;
	gap: 40px;
	justify-content: center;
	position: relative;
	margin-bottom: 15px;
	z-index: 3;
}

#mainimage_link li {
	width: 380px;
	border: 4px solid #00ca41;
	height: 100px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
	top: -30px;
	border-radius: 10px;
	background: #fff;
	color: #ff9600;
	font-size: 24px;
	box-shadow: 0 6px 0px #bfbfbf;
}

#mainimage_link li strong {
	display: block;
	font-size: 32px;
	color: #f20025;
}

#mainimage_link li a {
	text-decoration: none;
	color: #ff9600;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 100%;
}

#top1 {
	background: #000;
	padding: 0;
	margin: 0 auto 80px;
}

#top1 article {
	padding: 10px 0;
	background: #000 url('../../../../media2025/bg_campaign.webp');
	background-repeat: repeat-y;
	background-size: 100vw auto;
}

#top1 article .inner{
	width: 960px;
	min-height: 200px;
	border-radius: 10px;
	margin: 0 auto;
	background: #eee;
	padding: 20px;
	line-height: 1.6;
}

#top1 article .inner iframe{
	margin: 10px auto;
}

#top1 article img {
	display: block;
}
#top1 h4{
	font-size:30px;
	margin-bottom:15px;
}

main {
	width: 100%;
	overflow-x: hidden;
	line-height: 1.8em;
}

main h2 {
	text-align: center;
	position: relative;
	padding: 50px 0 0;
	margin-bottom: 25px;
}

main h2 .eng {
	font-size: clamp(50px, 4.1666dvw, 80px);
	white-space: nowrap;
	color: #eeeeee;
	width: 100%;
	top: 0;
	left: 0;
	position: absolute;
	z-index: 1;
	line-height: 1em;
}

main h2 .jp {
	font-size: 36px;
	color: #313131;
	position: relative;
	z-index: 2;
}

#mainimage_catch p div{
	perspective: 15cm;
}

main h3 {
	font-size: 24px;
	text-align: center;
	color: #00ae21;
	margin-bottom: 40px;
}

#top2 {
	margin: 0 auto 130px;
}

#top2 ul {
	width: 1100px;
	margin: 0 auto 60px;
	padding: 0;
	list-style: none;
	display: flex;
	gap: 20px;
}

#top2 ul li {
	width: calc((100% - 60px) / 4);
	text-align: center;
	font-size: 24px;
}

#top2 ul li img {
	display: block;
	margin-bottom: 20px;
}

#top2 p {
	color: #ff0028;
	font-size: 24px;
	text-align: center;
}

#top3 {
	position: relative;
	margin: 0 auto 130px;
}

#top3 article {
	width: 1260px;
	margin: 0 auto;
	display: flex;
	gap: 20px;
	position: relative;
	z-index: 5;
}

#top3 article dl {
	width: calc((100% - 60px) / 4);
	border: 2px solid #282828;
	border-radius: 10px;
	background: #fff;
	padding: 40px 20px;
	box-sizing: border-box;
	flex: none;
}

#top3 article dl dt {
	font-size: 36px;
	text-align: center;
	margin-bottom: 40px;
	font-weight: bold;
}

#top3 article dl dt img {
	display: block;
	margin: 40px auto 0;
	width: 100px;
	height: 118px;
	object-fit: contein;
}

#top3 dd h4 {
	color: #00ae21;
	text-align: center;
	font-size: 24px;
	margin-bottom: 40px;
	height: 98px;
}

#top3_bg {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: url('../images/bg1.svg') no-repeat center center;
	z-index: 1;
}

.reveal-bg::before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: #fff;
	z-index: 2;
	transition: transform 0.7s ease-in;
	transform: translateX(0);
}

.reveal-bg.reveal::before {
	transform: translateX(100%);
}

#top3 .more {
	padding: 40px 0 0;
	position: relative;
	z-index: 5;
}

#top3 .more a {
	width: 380px;
	border: 4px solid #00ca41;
	height: 100px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
	border-radius: 10px;
	background: #fff;
	color: #ff9600;
	font-size: 24px;
	box-shadow: 0 6px 0px #bfbfbf;
	font-size: 32px;
	color: #f20025;
	text-decoration: none;
	margin: 0 auto;
}

#top_works {
	padding: 0 2dvw;
	margin-bottom: 130px;
}

#top_works article {
	display: flex;
	gap: 2dvw;
}

#top_works article dl {
	width: calc((100% - 8dvw) / 5);
	border: 2px solid #282828;
	border-radius: 10px;
	background: #fff;
	padding: 20px 20px 60px;
	position: relative;
	box-sizing: border-box;
}

#top_works article dt {
	height: calc(((96dvw - 8dvw) / 5) - 50px);
}
#top_works article dt img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	position:relative;
	z-index:1;
}
#top_works article dt a{
	display:block;
	position:relative;
	width: 100%;
	height: 100%;
}

#top_works article dt .after{
	position:absolute;
	top:4px;
	left:5px;
	background:#cc0000;
	color:#fff;
	z-index:2;
	font-size:13px;
	font-weight:bold;
	width:62px;
	text-align:center;
	line-height:1.5em;
}

.works_comment_header {
	display: flex;
	gap: 10px;
	color: #00ae21;
	line-height: 30px;
	margin-bottom: 20px;
}

.works_comment_header .cat {
	padding: 0 10px;
	color: #fff;
	background: #00ae21;
}

.works_comment_more {
	position: absolute;
	z-index: 2;
	bottom: -30px;
	left: 0;
	width: 100%;
}

.works_comment_more a {
	width: 200px;
	border: 4px solid #00ca41;
	height: 60px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
	border-radius: 30px;
	background: #fff;
	color: #ff9600;
	font-size: 24px;
	box-shadow: 0 6px 0px #bfbfbf;
	font-size: 24px;
	color: #f20025;
	text-decoration: none;
	margin: 0 auto;
}

#top_works .more ul {
	padding: 100px 0 0;
	list-style: none;
	display: flex;
	gap: 20px;
	justify-content: center;
}

#top_works .more a {
	width: 380px;
	border: 4px solid #00ca41;
	height: 100px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
	border-radius: 10px;
	background: #fff;
	color: #ff9600;
	font-size: 24px;
	box-shadow: 0 6px 0px #bfbfbf;
	font-size: 26px;
	text-decoration: none;
	margin: 0 auto;
}

#top_works .more a strong {
	color: #f20025;
	font-size: 32px;
}

#top4 {
	position: relative;
	margin: 0 auto 130px;
}

#top4-1 {
	text-align: center;
	margin-bottom: 110px;
	position: relative;
	z-index: 5;
}

#top4-2 {
	width: 1100px;
	margin: 0 auto;
	display: flex;
	flex-wrap: wrap;
	gap: 40px;
	position: relative;
	z-index: 5;
}

#top4-2 dl {
	width: calc((100% - 80px) / 3);
	border: 2px solid #282828;
	border-radius: 10px;
	background: #fff;
	padding: 30px 20px;
	position: relative;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
}

#top4-2 dt {
	color: #00ae21;
	margin: 0 auto 20px;
	text-align: center;
	font-size: 24px;
	font-weight: bold;
}

#top4-2 figure {
	border: 4px solid #00ae21;
	display: block;
	margin: 0 auto 20px;
	width: 220px;
	height: 220px;
	border-radius: 50%;
	overflow: hidden;
}

#top4-2 figure img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#top4-2 .comment {
	margin-bottom: 20px;
}

#top4-2 .comment h4 {
	font-size: 20px;
	color: #ff0027;
	text-align: center;
	margin-bottom: 20px;
}

#top4-2 dl .morelink {
	margin-top: auto;
}

#top4-2 dl .morelink a {
	width: 100%;
	border: 4px solid #00ca41;
	height: 60px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
	border-radius: 30px;
	background: #fff;
	box-shadow: 0 6px 0px #bfbfbf;
	color: #f20025;
	text-decoration: none;
	margin: 0 auto;
}

#top4 .more {
	padding: 50px 0 0;
	position: relative;
	z-index: 5;
}

#top4 .more a {
	display: block;
	margin: 0 auto;
	width: 380px;
	border: 4px solid #00ca41;
	line-height: 100px;
	box-sizing: border-box;
	text-align: center;
	position: relative;
	border-radius: 10px;
	background: #fff;
	color: #f20025;
	font-size: 24px;
	box-shadow: 0 6px 0px #bfbfbf;
	font-size: 36px;
	text-decoration: none;
	margin: 0 auto;
	font-weight: bold;
}

#top4 .more a small {
	font-size: 30px;
}

dd.pickup {
	width: 90px;
	height: 90px;
	border: 1px solid #ff1414;
	padding: 1px;
	box-sizing: border-box;
	border-radius: 50%;
	position: absolute;
	top: -10px;
	left: -10px;
}

.pickup_inner {
	width: 100%;
	height: 100%;
	border-radius: 50%;
	background: #ff1414;
	color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
	transform: rotate(-10deg);
}

#top4_bg {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: url('../images/bg2.svg') no-repeat center center;
	z-index: 1;
}

#top_blog {
	padding: 0 2dvw;
	margin-bottom: 130px;
}

#top_blog article {
	display: flex;
	gap: 2dvw;
}

#top_blog article dl {
	width: calc((100% - 8dvw) / 5);
	border: 2px solid #282828;
	border-radius: 10px;
	background: #fff;
	padding: 20px 20px 60px;
	position: relative;
	box-sizing: border-box;
}

#top_blog article dt {
	height: calc(((96dvw - 8dvw) / 5) - 50px);
}

#top_blog article dt img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

#top_blog article dd.comment {
	font-size: 16px;
}

#top_blog article dd.comment time {
	display: block;
	text-align: right;
	padding: 10px 0;
	color: #666666;
}

#top_blog article dd.comment h4 {
	color: #00ae21;
}

#top_blog .morelink {
	position: absolute;
	z-index: 2;
	bottom: -30px;
	left: 0;
	width: 100%;
}

#top_blog .morelink a {
	width: 200px;
	border: 4px solid #00ca41;
	height: 60px;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	position: relative;
	border-radius: 30px;
	background: #fff;
	color: #ff9600;
	font-size: 24px;
	box-shadow: 0 6px 0px #bfbfbf;
	font-size: 24px;
	color: #f20025;
	text-decoration: none;
	margin: 0 auto;
}

#top_blog .more {
	padding: 50px 0 0;
}

#top_blog .more a {
	display: block;
	margin: 0 auto;
	width: 380px;
	border: 4px solid #00ca41;
	line-height: 100px;
	box-sizing: border-box;
	text-align: center;
	position: relative;
	border-radius: 10px;
	background: #fff;
	color: #f20025;
	font-size: 24px;
	box-shadow: 0 6px 0px #bfbfbf;
	font-size: 36px;
	text-decoration: none;
	margin: 0 auto;
	font-weight: bold;
}

#top_blog .more a small {
	font-size: 30px;
}

#top5 {
	margin: 0 auto 130px;
	position: relative;
}

#top5 article {
	position: relative;
	z-index: 5;
}

#top5 ul {
	list-style: none;
	display: flex;
	gap: 20px;
	width: 1100px;
	margin: 0 auto;
}

#top5 ul li {
	width: 260px;
	height: 260px;
	border-radius: 50%;
	flex: none;
	display: flex;
	align-items: center;
	justify-content: center;
	color: #fff;
	background: #ff0027;
	font-size: 24px;
	text-align: center;
	position: relative;
}

#top5 ul li:nth-child(1)::after {
	content: "";
	position: absolute;
	bottom: 30px;
	left: 73%;
	border-style: solid;
	border-width: 30px 20px 0 20px;
	border-color: #ff0027 transparent transparent;
	translate: -50% 100%;
	transform: skew(39deg);
	transform-origin: top;
}

#top5 ul li:nth-child(2)::after {
	content: "";
	position: absolute;
	bottom: 10px;
	left: 45%;
	border-style: solid;
	border-width: 30px 20px 0 20px;
	border-color: #ff0027 transparent transparent;
	translate: -50% 100%;
	transform: skew(-24deg);
	transform-origin: top;
}

#top5 ul li:nth-child(3)::after {
	content: "";
	position: absolute;
	bottom: 38px;
	left: 78%;
	border-style: solid;
	border-width: 30px 20px 0 20px;
	border-color: #ff0027 transparent transparent;
	translate: -50% 100%;
	transform: skew(45deg);
	transform-origin: top;
}

#top5 ul li:nth-child(4)::after {
	content: "";
	position: absolute;
	top: 10px;
	left: 60%;
	border-style: solid;
	border-width: 0 20px 30px 20px;
	border-color: transparent transparent #ff0027;
	translate: -50% -100%;
	transform: skew(-40deg);
	transform-origin: bottom;
}

#top5 .more {
	padding: 100px 0 0;
	position: relative;
	z-index: 5;
}

#top5 .more a {
	display: block;
	margin: 0 auto;
	width: 380px;
	border: 4px solid #00ca41;
	line-height: 100px;
	box-sizing: border-box;
	text-align: center;
	position: relative;
	border-radius: 10px;
	background: #fff;
	color: #f20025;
	font-size: 24px;
	box-shadow: 0 6px 0px #bfbfbf;
	font-size: 36px;
	text-decoration: none;
	margin: 0 auto;
	font-weight: bold;
}

#top5 .more a small {
	font-size: 30px;
}

#top5_bg {
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	background: url('../images/bg3.svg') no-repeat center center;
	z-index: 1;
}

#top6 {
	margin: 0 auto 130px;
}

#top6 article {
	color: #00ae21;
	font-size: 24px;
	text-align: center;
	font-weight: bold;
}

#top6 .more {
	padding: 100px 0 0;
	position: relative;
	z-index: 5;
}

#top6 .more a {
	display: block;
	margin: 0 auto;
	width: 820px;
	border: 4px solid #00ca41;
	line-height: 100px;
	box-sizing: border-box;
	text-align: center;
	position: relative;
	border-radius: 10px;
	background: #fff;
	color: #f20025;
	font-size: 24px;
	box-shadow: 0 6px 0px #bfbfbf;
	font-size: 36px;
	text-decoration: none;
	margin: 0 auto;
	font-weight: bold;
}

#top6 .more a small {
	font-size: 30px;
}

#top7 {
	background: #00ae21;
	color: #fff;
}

#top7 article {
	padding: 45px 0 40px;
	width: 1100px;
	margin: 0 auto;
	display: flex;
	position: relative;
}

#top7_l {
	width: 660px;
	flex: none;
	font-size: 36px;
	text-align: center;
	line-height: 1.8em;
}

#top7_r {
	width: calc(100% - 660px);
	flex: none;
	font-size: 36px;
	text-align: center;
	font-weight: bold;
	padding: 75px 0 0;
}

#top7 .more {
	padding: 40px 0 0;
}

#top7 .more a {
	display: block;
	margin: 0 auto;
	border: 4px solid #fff;
	line-height: 100px;
	box-sizing: border-box;
	text-align: center;
	position: relative;
	border-radius: 10px;
	background: #00ae21;
	color: #fff;
	font-size: 24px;
	box-shadow: 0 6px 0px #008219;
	font-size: 36px;
	text-decoration: none;
	margin: 0 auto;
	font-weight: bold;
}

#top7 .more a small {
	font-size: 30px;
}

#chara1 {
	position: absolute;
	bottom: 10px;
	left: 0;
	display: block;
}

#chara2 {
	position: absolute;
	top: 10px;
	right: 0;
	display: block;
}

.more a:hover,
.works_comment_more a:hover,
.morelink a:hover {
	background: #00ca41 !important;
	color: #fff !important;
}


#instagram{
	background-color: #f3f3f3;
	display: flex;
	flex-flow: row wrap;
	gap: 40px;
	list-style: none;
	margin: 0 0 80px;
}

#instagram li{
	width: calc((100vw - 160px) / 4);
}

#instagram li img{
	width: 100%;
	height: calc((100vw - 160px) / 4);
	object-fit: cover;
}

#instagram li .like{
	display: none;
}