@charset "utf-8";
/* CSS Document */

body {
    position: relative;
	background: #092a4b;
}

/* clearfix
--------------------- */
.clearfix:after {
    content: ".";
    display: block;
    height: 0px;
    clear: both;
    visibility: hidden;
    overflow: hidden;
    font-size: 0;
}

#wrap {
	min-width: 1200px;
}

/* content
------------------------------------------ */

#header_nav{
	background: #fff;
}

#lucrea_content {
    margin: 0;
    padding: 0;
	background: url("../images/lucrea_bg.jpg") no-repeat center fixed;
	background-size: cover;
	font-family: 'Noto Serif JP', serif;
	font-size: 18px;
	color: #fff;
	font-weight: 500;
	line-height: 1.8em;
    min-width: 1200px;
}
#lucrea_content p{
	font-size: 18px;
}

#lucrea_content ul,#lucrea_content ol{
	padding: 0;
	margin: 0;
	list-style: none;
}
/* PCでのみ表示
--------------------- */
#lucrea_content .pc_on { display: block!important;}
#lucrea_content .sp_on { display: none!important;}


/* メインエリア 
--------------- */
#lucrea_content #content_Main {	
	margin-bottom: 0.5rem;
	position:relative;	
	background-image: url("../images/mv_bg_left.png"),url("../images/mv_bg_right.png");
	background-position: left top,right top;
	background-repeat: no-repeat,no-repeat;
}

#lucrea_content #content_Main .mv_innr{
	background-image: url("../images/mv_bg_sparkle_left.png"),url("../images/mv_bg_sparkle_right.png");
	background-position: left 2% top 1rem,right 2% top 1rem;
	background-repeat: no-repeat,no-repeat;
}

#lucrea_content .mv_panel{
	width: 1212px;
	padding-bottom: 5rem;
	margin: 0 auto;
	text-align: center;
}

#lucrea_content .mv_text{
	position: absolute;
	bottom: 3.5rem;
    left: 0;
    right: 0;
	text-align: center;
	padding: 8rem 1.7rem;
	background: url("../images/mv_txt_bg.png") no-repeat center;
	z-index: 1;
	color: #e02d66;
	font-weight: bold;
	text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 5px #fff,0 0 8px #fff,0 0 10px #fff;
}
#lucrea_content .mv_text img{
	   width: 359px;
}

#lucrea_content .mv_panel ul{
	display: flex;
}

#lucrea_content .mv_panel li{
	margin: 0 6px;
}


/* ABOUT 
--------------- */
#lucrea_content .content_About{
	margin: 0 auto 4rem;
	width: 1000px;
}
#lucrea_content .content_About ul{
	display: flex;
	flex-wrap: wrap;
}

#lucrea_content .content_About li{
	width: 500px;
}

#lucrea_content .content_About h3 {
	margin: -1rem 0 0;
}

#lucrea_content .content_About h3 img{
	width:514px;
}

#lucrea_content .content_About .About_thumb.right img{
	width:460px;
	margin-left: 40px;
}
#lucrea_content .content_About .About_thumb.left img{
	width:460px;
	margin-right: 40px;
}


/* LINEUP
--------------- */

#lucrea_content .content_Lineup{
	margin: 0 auto 6rem;
	width: 1000px;
}

#lucrea_content .content_Lineup h2{
	text-align: center;
	margin-bottom: 3rem;
}
#lucrea_content .content_Lineup h2 img{
	width: 570px;
}

#lucrea_content ol.filters{
	display: flex;
	flex-wrap: wrap;
}
#lucrea_content .filters li{
	margin: 0.1rem 0.2rem;
}

#lucrea_content .filters img{
	width: 192px;
}


/* カテゴリリスト */
#lucrea_content .content_Lineup ol {
	list-style: none;
}
#lucrea_content .content_Lineup a {
	text-decoration: none;
	color: inherit;
	transition: all 0.2s;
}

#lucrea_content .content_Lineup .targets {
	margin-top: 2.5rem;
	display: flex;
	flex-wrap: wrap;
}

[value="All"]:checked ~ .targets [data-category] {
  display: block;
}
[value="shinycolors"]:checked ~ .targets .target:not([data-category~="shinycolors"]), 
[value="umamusume"]:checked ~ .targets .target:not([data-category~="umamusume"]), 
[value="shamanking"]:checked ~ .targets .target:not([data-category~="shamanking"]), 
[value="p5r"]:checked ~ .targets .target:not([data-category~="p5r"]), 
[value="pricone"]:checked ~ .targets .target:not([data-category~="pricone"]), 
[value="aikatsu"]:checked ~ .targets .target:not([data-category~="aikatsu"]) , 
[value="yugioh"]:checked ~ .targets .target:not([data-category~="yugioh"]) , 
[value="tensei"]:checked ~ .targets .target:not([data-category~="tensei"]) , 
[value="sao"]:checked ~ .targets .target:not([data-category~="sao"]) , 
[value="others"]:checked ~ .targets .target:not([data-category~="others"]) {
  display: none;
}

/*  ラジオボタン非表示 */
#lucrea_content input[type="radio"] {
  position: absolute;
  left: -9999px;
}
/*  カテゴリ */
#lucrea_content .content_Lineup .filters {
  margin-bottom: 2rem;
}
#lucrea_content .content_Lineup .filters * {
  display: inline-block;
}
#lucrea_content .content_Lineup .filters label {
  cursor: pointer;
  transition: all 0.2s;
}
#lucrea_content .content_Lineup .filters label:hover,.content_Lineup a:hover {
  opacity: .7;
}

/*  商品リスト */
#lucrea_content .targets li.target.is-hidden {
	opacity: 0;
    height: 0;
    margin: 0;
	pointer-events: none;
}

#lucrea_content li.target{
	opacity: 1;
	transition: all 0.4s ease 0s;
	width: 225px;
	margin: 1rem auto 1rem auto;
	position: relative;
	line-height: 1.6em;
}
#lucrea_content li.target img{
	width: 225px;
	border: solid 1px #fff;
	box-shadow:0 1px 5px #051526,0 1px 15px #051526;
}
#lucrea_content li.target p{
	text-shadow:0 1px 5px #051526,0 1px 10px #051526;
	margin: 0.6em 0 1em;
}
#lucrea_content .new-item{
	background: linear-gradient(rgb(255, 100, 93), rgb(253, 17, 17));
	color: #fff;
	padding: 5px 10px;
	margin-bottom: 0!important;
	font-size: 12px;
	line-height: 1em;
	text-align: center;
	display: inline-block;
	text-shadow: none!important;
    border-radius: 7 px;
}
#lucrea_content li.target .new-item img{
	width: 70px;
	border: none;
	box-shadow: none;
}
#lucrea_content li.target .label{
	background: #ff61c2;
	color: #fff;
	padding: 5px 10px;
	margin-bottom: 0;
	font-size: 12px;
	line-height: 1em;
	text-align: center;
	display: inline-block;
	text-shadow: none;
    border-radius: 7 px;
}
#lucrea_content .more{
	text-align: center;
    margin-top: 30px;
	cursor: pointer;
}

/* 企画進行中
--------------- */
#lucrea_content .content_kikaku {
    margin: 0 auto 6rem;
}
#lucrea_content .content_kikaku h2{
	width: 1000px;
	text-align: center;
    margin: 0 auto 3rem;
}
#lucrea_content .content_kikaku .kikaku_slider-wrap{
	position: relative;
}
#lucrea_content .content_kikaku .slick-track{
	display: flex!important;
}
#lucrea_content .content_kikaku .kikaku_slide{
	display: inline-block;
	background: #fff;
	background: linear-gradient(135deg, transparent 10px, #fff 0) top left,
	linear-gradient(-135deg, transparent 10px, #fff 0) top right,
	linear-gradient(-45deg, transparent 10px, #fff 0) bottom right,
	linear-gradient(45deg, transparent 10px, #fff 0) bottom left;
	background-size: 51% 51%;
	background-repeat: no-repeat;
	padding: 30px;
	margin-right: 1vw!important;
	margin-left: 1vw!important;
	height: auto;
}
#lucrea_content .content_kikaku .kikaku_slide a{
	color: #000;
	text-decoration: none;
}
#lucrea_content .content_kikaku .kikaku_slide .label{
	color: #fff;
	font-size: 14px;
	line-height: 1em;
	display: inline-block;
	padding: 7px 10px;
	margin: 10px 0 0;
	text-align: center;	
}
#lucrea_content .content_kikaku .kikaku_slide .label._event{
	background: #066fda;
}
#lucrea_content .content_kikaku .kikaku_slide .txt{
	font-size: 16px;
	line-height: 1.5;
	margin-top: 10px;
}
#lucrea_content .content_kikaku .kikaku_slide img{
	max-width: 100%;
}
#lucrea_content .content_kikaku .slide-arrow{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	background: url(/megahobby/event/lucrea/images/arrow.png) no-repeat center center;
	background-size: contain;
	width: 70px;
	height: 70px;
	z-index: 10;
	cursor: pointer;
	transition: all .2s;
}
#lucrea_content .content_kikaku .slide-arrow:hover{
	opacity: .8;
}
#lucrea_content .content_kikaku ._prev{
	left: calc(50% - 300px);
}
#lucrea_content .content_kikaku ._next{
	right: calc(50% - 300px);
	transform: translateY(-50%) rotate(180deg);
}
#lucrea_content .content_kikaku .slide-dots {
    display: flex!important;
    justify-content: center;
	margin: 15px 0!important;
}
#lucrea_content .content_kikaku .slide-dots li {
    width: 10px;
    height: 10px;
    margin: 0 5px;
    background: #fff;
    border-radius: 50%;
    cursor: pointer;
}
#lucrea_content .content_kikaku .slide-dots li:hover,
#lucrea_content .content_kikaku .slide-dots li.slick-active {
    background: #328dbe;
}
#lucrea_content .content_kikaku .slide-dots li button {
    display: none;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    outline: none;
    padding: 0;
    border: none;
    background-color: transparent;
}

/* コピーライト
--------------- */
#lucrea_content .copywrap{
	width: 900px;
    margin: 0 auto;
	padding-bottom: 4rem;
    text-align: center;
	line-height: 1.8em;
	font-size: 0.8rem;
	font-family: sans-serif;
}

#lucrea_content .copywrap span {
    display: inline-block;
    color: #FFF;    
	font-weight: 400;
	margin-right: 1em;
}

/* ポップアップ
--------------- */
#lucrea_content .bg_popup {
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 9999;
    width: 100vw;
    height: 100vh;
    background-color: rgba(0, 0, 0, 0.5);
    opacity: 0;
    visibility: hidden;
    transition: 0.3s;
}

#lucrea_content .bg_popup.js_active {
    opacity: 1;
    visibility: visible;
}

#lucrea_content .popup {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateX(-50%) translateY(-50%);
    cursor: pointer;
}

#lucrea_content .popup_content {
    text-align: center;
}
#lucrea_content .popup_content img{
    max-height: 90vh;
}

#lucrea_content .close {
  display: inline-block;
  vertical-align: middle;
  color: #fff;
  line-height: 1;
  width: 2em;
  height: 0.1em;
  background: currentColor;
  border-radius: 0.1em;
  position: relative;
  transform: rotate(45deg);
  margin-bottom: 1em;
  float: right;
}

#lucrea_content .close::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: inherit;
  border-radius: inherit;
  transform: rotate(90deg);
}



/*========================================================================================
【共用フッター】
========================================================================================*/
footer {width: 100%; position: relative !important; z-index: 999;}
footer #box_inner { max-width: 1200px; width: 100%; margin: 0 auto; position:relative;}
footer #box_inner #footer_sns {position: absolute; top:90px; left:0;}
footer #box_inner #footer_sns .fb-like{ margin: 0 10px 0 0;}
footer #box_inner #footer_sns .fb_iframe_widget > span{vertical-align: baseline !important; margin-bottom: -8px;}



/* ==========================================
TAB
==========================================*/

@media screen and (max-width: 980px){

	#lucrea_content {
		background: none;
		min-width: none;
	}


	#lucrea_content:after{
		content: "";
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		z-index: -1;
		width: 100%;
		min-height: 150vh;
		background: url("../images/lucrea_bg_sp.jpg") center no-repeat;
		background-size: cover;
	}
	
}

/* ==========================================
スマートフォン
==========================================*/
@media screen and (min-width: 320px) and (max-width: 767px){
	
	#header_nav_sp{
		background: #fff;
	}

	#wrap {
		min-width: 100%;
	}

	#lucrea_content {
		width: 100%;
		min-width: 0px;
		background: none;
	}
	#lucrea_content:after{
		content: "";
		display: block;
		position: fixed;
		top: 0;
		left: 0;
		z-index: -1;
		width: 100%;
		min-height: 110vh;
		background: url("../images/lucrea_bg_sp.jpg") center no-repeat #092a4b;
		background-size: cover;
	}
	#lucrea_content p{
		font-size: 16px;
	}
	#lucrea_content img { width: 100%;}
	
	.toggle {
		background-color: rgba(255,255,255,0.7);
	}

/* SPでのみ表示
--------------------- */
	#lucrea_content .pc_on { display: none!important;}
	#lucrea_content .sp_on { display: block!important;}


/* メインエリア 
--------------- */
	#lucrea_content #content_Main {
		background-image: none;
		margin-bottom: 2rem;
	}

	#lucrea_content #content_Main .mv_innr{
		background-image: none;
	}

	#lucrea_content .mv_panel{
		width: 100%;
	}

	#lucrea_content .mv_text{
		bottom: -4rem;
		left: 0;
		right: 0;
		margin: auto;
		text-align: center;
		background: url("../images/mv_txt_bg_sp.png") no-repeat center;
		padding: 20% 21% 24%;
		background-size: 98%;
	}
	#lucrea_content .mv_text p{
		font-size: 3vw;
		line-height: 1.7em;
		text-shadow:0 0 3px #fff,0 0 8px #fff;
	}
	#lucrea_content .mv_text img{
		   width: 70%;
	}

	#lucrea_content .mv_panel li{
		margin: 0 4px;
	}


/* ABOUT 
--------------- */
	#lucrea_content .content_About{
		margin: 0 auto 4rem;
		width: 88%;
	}
	#lucrea_content .content_About ul{
		display: flex;
		flex-wrap: wrap;
	}

	#lucrea_content .content_About li{
		width: 100%;
	}

	#lucrea_content .content_About h3 {
		margin: 0 0 -2rem;
	}

	#lucrea_content .content_About h3 img{
		width:100%;
	}

	#lucrea_content .content_About .About_thumb{
		margin:0 auto;
		text-align: center;
	}

	#lucrea_content .content_About .About_thumb img{
		width: 100%!important;
	}
	#lucrea_content .content_About .About_thumb.right img{
		margin-left: 0;
	}


/* LINEUP
--------------- */

	#lucrea_content .content_Lineup{
		margin: 0 auto 4rem;
		width: 88%;
	}

	#lucrea_content .content_Lineup h2{
		text-align: center;
		margin-bottom: 1rem;
	}
	#lucrea_content .content_Lineup h2 img{
		width: 100%;
	}
	#lucrea_content .filters li{
		margin: 0 1%;
		width: 31.2%;
	}
	#lucrea_content .filters li.sp_on{
		width: 100%;
	}

	#lucrea_content .filters img{
		width: 100%;
	}
	#lucrea_content .content_Lineup .filters label:hover{
		opacity: 1;
	}

	/* カテゴリリスト */
	#lucrea_content .content_Lineup .targets {
		margin-top: 0;
	}

	/*  カテゴリ */
	#lucrea_content .content_Lineup .filters {
	  margin-bottom: 0.5rem;
	}

	/*  商品リスト */

	#lucrea_content li.target{
		width: 44%;
		margin: 2% 3% 3% 3%;
	}
	
	#lucrea_content li.target img{
		width: 100%;
	}
	
	#lucrea_content li.target p{
		margin: 0.2em 0 1em;
	}
	#lucrea_content li.target .new-item img{
		width: 60%;
	}
	#lucrea_content .more{
		width: 70%;
        margin: 10px auto 0;
	}

/* 企画進行中
--------------- */

	#lucrea_content .content_kikaku h2{
		margin: 0 auto 2rem;
		width: 88%;
	}
	#lucrea_content .content_kikaku .kikaku_slide{
		padding: 20px;
	}
	#lucrea_content .content_kikaku .slide-arrow{
		width: 50px;
		height: 50px;
	}
	#lucrea_content .content_kikaku ._prev{
		left: 20px;
	}
	#lucrea_content .content_kikaku ._next{
		right: 20px;
	}

/* コピーライト
--------------- */
	#lucrea_content .copywrap{
		width: 88%;
		font-size: 0.6em;
	}
	

/* ポップアップ
--------------- */
#lucrea_content .bg_popup {
    height: 120vh;
}
	
#lucrea_content .popup {
	top: 40%;
	width: 90%;
}



/*=====================================================
【SP】【共用フッター】
=====================================================*/
footer { background: #000; margin: 0; padding: 3% 0; box-sizing: border-box;}
footer #box_inner {max-width: 100%; width: 100%; margin: 0 auto; position:relative;}
footer #box_inner #footer_sns {position: inherit; top: inherit; left: inherit; margin: 2% 0 0 0; text-align: center;}
footer #box_inner #footer_sns .fb-like{ margin: 0 10px 0 0;}
footer #box_inner #footer_sns .fb_iframe_widget > span{vertical-align: baseline !important;}
footer .box { width: 100% !important;}
.groupLogo{position: static;}
}

/* 20250604更新
--------------- */
#lucrea_content .mv_text{
	width: 506px;
	margin: 0 auto;
}

#lucrea_content .mv_text img:first-child{
	margin-bottom: 10px;
}

#lucrea_content .mv_text h2{
	display: inline-block;
	position: relative;
	font-size: 45px;
	color: #eb6d95;
	margin-top: 37px;
}

#lucrea_content .mv_text h2:before{
	content: "";
	background: url(../images/tit_star.png)no-repeat top center;
	width: 36px;
	height: 43px;
	position: absolute;
	top: 50%;
	left: -51px;
	transform: translateY(-50%);
}

#lucrea_content .mv_text h2:after{
	content: "";
	background: url(../images/tit_star.png)no-repeat top center;
	width: 36px;
	height: 43px;
	position: absolute;
	top: 50%;
	right: -41px;
	transform: translateY(-50%);
}

.content_About h2{
	text-align: center;
}

#lucrea_content .content_Lineup h2 img{
	width: auto;
}

.content_Lineup section + section{
	margin-top: 105px;
}

.kikaku_slider-wrap ._cs{
	text-align: center;
}

#lucrea_content .content_kikaku h2{
	margin-bottom: 1rem;
}

@media screen and (min-width: 320px) and (max-width: 767px) {
	#lucrea_content #content_Main {
		margin-bottom: 4rem;
	}

	#lucrea_content .mv_text {
		width: 57%;
		padding: 21% 21% 24%;
	}

	#lucrea_content .mv_text img:first-child {
		margin-bottom: 3%;
	}

	#lucrea_content .mv_text img:nth-child(2) {
		width: 80%;
	}

	#lucrea_content .mv_text h2{
		font-size: 1.4em;
		margin-top: 3%;
	}

	#lucrea_content .mv_text h2:before{
		background-size: cover;
		width: 18px;
		height: 21.5px;
		left: -1em;
	}

	#lucrea_content .mv_text h2:after{
		background-size: cover;
		width: 18px;
		height: 21.5px;
		right: -1em;
	}

	.content_About h2 {
		margin-bottom: -1rem;
	}

	#lucrea_content .content_Lineup h2 img{
		width: 100%;
	}

	.content_Lineup section + section {
		margin-top: 15%;
	}

	#lucrea_content .content_kikaku h2 {
		margin: 0 auto;
	}

	.kikaku_slider-wrap ._cs {
		width: 75%;
		margin: 0 auto;
	}
}

