@charset "Shift_JIS";
@import url(https://fonts.googleapis.com/earlyaccess/sawarabimincho.css);

/*---------------------------------------------------------- Reset */
html{color:#000;background:#fff}blockquote,body,code,dd,div,dl,dt,fieldset,form,h1,h2,h3,h4,h5,h6,input,legend,li,ol,p,pre,td,textarea,th,ul,figure{margin:0;padding:0}table{border-collapse:collapse;border-spacing:0}fieldset,img{border:0}address,caption,cite,code,dfn,em,strong,th,var{font-style:normal;font-weight:400}li{list-style:none}caption,th{text-align:left}h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:400}q:after,q:before{content:''}abbr,acronym{border:0;font-variant:normal}sup{vertical-align:text-top}sub{vertical-align:text-bottom}input,select,textarea{font-family:inherit;font-size:inherit;font-weight:inherit}legend{color:#000}ol li{margin-left: 0;list-style: none;}

/*---------------------------------------------------------- ”Ä—pƒNƒ‰ƒX */
.mt0{ margin-top: 0px !important;}
.mb0{ margin-bottom: 0px !important;}
.pt0{ padding-top: 0px !important;}
.pb0{ padding-bottom: 0px !important;}
.mt5{ margin-top: 5px !important;}
.mb5{ margin-bottom: 5px !important;}
.pt5{ padding-top: 5px !important;}
.pb5{ padding-bottom: 5px !important;}
.mt10{ margin-top: 1.33% !important;}
.mb10{ margin-bottom: 1.33% !important;}
.pt10{ padding-top: 1.33% !important;}
.pb10{ padding-bottom: 1.33% !important;}
.mt15{ margin-top: 15px !important;}
.mb15{ margin-bottom: 15px !important;}
.pt15{ padding-top: 15px !important;}
.pb15{ padding-bottom: 15px !important;}
.mt20{ margin-top: 2.7% !important;}
.mb20{ margin-bottom: 2.7% !important;}
.pt20{ padding-top: 2.7% !important;}
.pb20{ padding-bottom: 2.7% !important;}
.mt25{ margin-top: 25px !important;}
.mb25{ margin-bottom: 25px !important;}
.pt25{ padding-top: 25px !important;}
.pb25{ padding-bottom: 25px !important;}
.mt30{ margin-top: 4% !important;}
.mb30{ margin-bottom: 4% !important;}
.pt30{ padding-top: 4% !important;}
.pb30{ padding-bottom: 4% !important;}
.mt35{ margin-top: 35px !important;}
.mb35{ margin-bottom: 35px !important;}
.pt35{ padding-top: 35px !important;}
.pb35{ padding-bottom: 35px !important;}
.mt40{ margin-top: 5.33% !important;}
.mb40{ margin-bottom: 5.33% !important;}
.pt40{ padding-top: 5.33% !important;}
.pb40{ padding-bottom: 5.33% !important;}
.mb50{ margin-bottom: 6.67% !important;}
.pb50{ padding-bottom: 6.67% !important;}
.mb60{ margin-bottom: 8% !important;}
.pb60{ padding-bottom: 8% !important;}
.mb70{ margin-bottom: 9.33% !important;}
.mb80{ margin-bottom: 10.66% !important;}
.pb80{ padding-bottom: 10.66% !important;}
.mb100{ margin-bottom: 13.33% !important;}
.mb110{ margin-bottom: 14.33% !important;}
.tac{text-align: center;}
.tar{text-align: right;}
.tal{text-align: left;}
.ma{margin: auto;}
.marker{ background-color: #ffff00;}
.cmt_small{font-size: 3.2vw;text-indent: -1em;padding-left: 1em;}
.fl{float: left;}
.fr{float: right;}
.cfx::after{
	content:"";
	display:block;
	clear:both;
}
.bold{
	font-weight: bold;
}
.c01{color: #e4b824 !important;}
.c02{color: #700004 !important;}
.mincho{font-family: "Ÿà–¾’©", YuMincho,"Sawarabi Mincho", "ƒqƒ‰ƒMƒm–¾’© ProN W3", "Hiragino Mincho ProN", "HG–¾’©E", "‚l‚r ‚o–¾’©", serif!important;}

/*------------------------------------------------------- ƒtƒHƒ“ƒg�Ý’è */
.navitopicpath_,
.GenreStyle_,
.container_{
	padding: 0!important;
}
h2.genre_name_,
h2.common_headline2_,
div#genre_common_box,
.rightmenuframe_{
	display: none;
}
.tdu{
	text-decoration: underline;
}
main{
	font-size: 4vw;
	line-height: 1.6;
	font-family: "ŸàƒSƒVƒbƒN", "Yu Gothic", YuGothic,ƒqƒ‰ƒMƒmŠpƒS Pro W3,Hiragino Kaku Gothic Pro,ƒ�ƒCƒŠƒI,Meiryo,Osaka,‚l‚r ‚oƒSƒVƒbƒN,MS PGothic,sans-serif;
}
.f54{font-size: 7.2vw;}
.f46{font-size: 1.49em;}
.f44{font-size: 1.38em;}
.f42{font-size: 1.31em;}
.f40{font-size: 1.25em;}
.f38{font-size: 1.19em;}
.f36{font-size: 1.13em;}
.f34{font-size: 1.06em;}
.f32{font-size: 1em;}
.f30{font-size: .94em;}
.f28{font-size: .88em;}
.f26{font-size: .81em;}
.f25{font-size: .78em;}
.f24{font-size: .75em;}
.f22{font-size: .69em;}
.f20{font-size: .62em;}
.f18{font-size: .56em;}
@media (min-width: 750px){
	main{font-size: 30px;}
	.f54{font-size: 54px;}
	.f46{font-size: 46px;}
	.f44{font-size: 44px;}
	.f42{font-size: 42px;}
	.f40{font-size: 40px;}
	.f38{font-size: 38px;}
	.f36{font-size: 36px;}
	.f34{font-size: 34px;}
	.f32{font-size: 32px;}
	.f30{font-size: 30px;}
	.f28{font-size: 28px;}
	.f26{font-size: 26px;}
	.f25{font-size: 25px;}
	.f24{font-size: 24px;}
	.f22{font-size: 22px;}
	.f20{font-size: 20px;}
	.f18{font-size: 18px;}
}
.red{
	color: #ef0808;
}
main .fv a:link,main .fv a:visited{
	color: inherit;
	text-decoration: underline;
}
div.container_ div.contents_, div.container_ div.contents_ div.mainframe_, div.container_ div.contents_ div.mainframe_ .event_ .goods_, div.container_ div.mainframe_, div.container_ div.mainframe_ .event_ .goods_{width: 100%;}

/*---------------------------------------------------------- Šî–{�Ý’è */
main a:link,main a:visited{
	color: inherit;
	text-decoration: none;
}
main *{box-sizing: border-box;}
main img{
	width: 100%;
	height: auto;
	vertical-align: bottom;
}
main{
	max-width: 750px;
	margin: 0 auto;
	color: #fff;
	overflow: hidden;
	background: #171717;
	display: block;
	border-bottom: 0.07em solid #efefef;
}
.main_wrap{
	width: 100%;
	background-color: #000;
	background-image: url(/img/genre/02002401/bg001.jpg);
	background-attachment: fixed;
	background-size: cover;
	background-position: center;
}
@media(max-width:979px){
	.main_wrap{background-image: none;}
	}
.sale_before p.bt a{
	background-color: #d2d2d2;
	box-shadow: 0 .2em #999;
	padding: .9em;
	pointer-events: none;
}
.sale_before p.bt a::before{
	display: none;
}
.sale_before p.bt a:hover{
	opacity: 1;
}
.sale_after{
	background: #fff;
}
.sale_after p{
	width: 100%;
	margin: 5% auto;
	text-align: center;
	background: #ccc;
	padding: 5em 1em;
	color: #000;
}
.cmt{
	color: #666;
	text-indent: -1em;
	padding-left: 1em;
	font-size: .75em;
}
a:hover{
	opacity: 0.85;
}
sup{
	font-size: .5em;
}
main section{
	background: #fff;
	position: relative;
}
.ttl .item{
	position: relative;
	top: -.4em;
}
.ttl h2{
	margin-top: -1em;
}
.w690{
	width: 92%;
	margin: auto;
}
.w710{
	width: 94.66%;
	margin: auto;
}
.acc_bt_b a{
	margin: 8% auto;
}
.lazy{
	transition: 0.3s;
}
img{
	max-width: 100%;
}
mark{
	color: #bc0c00;
	background-color: rgba(255,235,105,0.8);
}

/*------------------------------------------------ product_introduction */
.product_introduction [class^="item"] .txt{
	text-align: justify;
	text-align-last: left;
}
.product_introduction [class^="item"] [class^="area"]{
	position: relative;
	margin: 6.66% 6.66% 8%;
	color: #fff;
}
.product_introduction [class^="item"] [class^="area"] .img{
	margin-bottom: 4%;
}
.product_introduction [class^="item"] [class^="area"] .cmt{
	color: #fff;
}
.product_introduction [class^="item"] [class^="area"]  h3{
	text-align: center;
	color: #fff;
	font-weight: bold;
	margin-bottom: 2.66%;
}

/*--- item01 ---*/
.product_introduction .item01 .area01,
.product_introduction .item01 .area02{
	margin: 8% 6.66% 0%;
}
.product_introduction .item01 [class^="area"] .txt{
	margin-top: 3%;
}
.product_introduction .item01 [class^="area"] .txt p:first-of-type{
	text-align: center;
	text-align-last: center;
	margin-bottom: 1.66%;
}
.product_introduction .item01 .area03 .img{
	margin: 8% 2.66% 0% 6.66%;
}
.product_introduction .item01 .area03 .txt{
	margin: 3% 6.66% 8%;
}
.product_introduction .item01 .area03 .cmt{
	text-align: center;
	text-align-last: center;
	margin-top: 4%;
}
.product_introduction .item01{
	background-image: url(/img/genre/02002401/confetti001.png), url(/img/genre/02002401/confetti002.png), url(/img/genre/02002401/confetti003.png), url(/img/genre/02002401/confetti004.png), url(/img/genre/02002401/confetti005.png), url(/img/genre/02002401/confetti001.png);
	background-position: left 1% top 20%, right 3% top 36%, left 4% bottom 46.5%, right 4% bottom 30%, right 2% bottom 48.7%, left 5% bottom 27%;
	background-size: 7% auto;
	background-repeat: no-repeat;
}
/*.product_introduction .item01 .ofr img{
	margin-top: -2.66%;
}*/

/*--- item02 ---*/
.product_introduction .item02 .area01 .img{
	width: 43.3%;
	margin: 0 0 0 auto;
}
.product_introduction .item02 .area01 .txt{
	width: 48.2%;
	margin: -44.8% auto 0 0;
}
.product_introduction .item02 .area02 .img{
	width: 100%;
	margin: 15% auto 2.66%;
}
.product_introduction .item02 .area02 .txt{
	margin: 0 0;
}
.product_introduction .item02 .area03 .img{
	width: 50.3%;
	margin: 15% 0 0 0;
}
.product_introduction .item02 .area03 .txt{
	width: 45%;
	margin: -52% 0 0 auto;
}
.product_introduction .item02 .area03 .txt p+p{
	margin-top: 4%;
}
.product_introduction .item02 .area04 .img{
	margin: 0 0 10% 5%;
	width:100%;
}
.product_introduction .item02 .area04 .txt{
	width: 80%;
	margin: 15% 0 0 auto;
}
.product_introduction .item02 .area04{
	display: flex;
	flex-direction: row-reverse;
	justify-content: space-between;
	align-items: flex-end;
}

.product_introduction .item02 .area05{
	margin: 0 0 15%;
}
.product_introduction .item02{
	background-image: url(/img/genre/02002401/confetti002.png), url(/img/genre/02002401/confetti003.png), url(/img/genre/02002401/confetti005.png), url(/img/genre/02002401/confetti004.png), url(/img/genre/02002401/confetti005.png), url(/img/genre/02002401/confetti005.png);
	background-position: right 4% top 32.5%, left 2% bottom 57.5%, right 3% top 49%, left 2% bottom 40%, right 2% bottom 30%, left 2% bottom 17.5%;
	background-size: 7% auto;
	background-repeat: no-repeat;
}

/*------------------------------------------------ ofr */
.ofr{
	background-color: #fff;
	padding-bottom: 8%;
}
.ofr .bt a{
	display: block;
	background-color: #ffa500;
	color: #fff;
	font-size: 1.5em;
	font-weight: bold;
	text-align: center;
	padding: .9em 0 .9em .7em;
	border-radius: .16em;
	line-height: 1;
	margin: 0 2.66% 3%;
	box-shadow: 0 .2em #a05f1f;
	position: relative;
}
.ofr .bt a::before{
	display: block;
	content: '�¥';
	position: absolute;
	font-size: .35em;
	transform: rotate(30deg);
	top: 0;
	bottom: 0;
	margin: auto;
	height: 1em;
	left: 10em;
}
.ofr .bt a:hover{
	opacity: .9;
	text-decoration:none;
}
.ofr .cmt{
	margin: 0 2.66%;
}
/*
.ofr .code_area{
	text-align: center;
	margin-top: .5em;
}
.ofr .code_area_1{
	color: #000;
}
.ofr .code_area_2{
	font-weight: bold;
	background: #d9ba50;
	color: #bc0c00;
	width: 86.8%;
	margin: auto;
	padding: .5%;
}
*/

