@charset "utf-8";
/* CSS Document */
html{scroll-padding-top: 150px;font-size: 16px;}
.global_nav{background: #fff;font-size: 1.313rem;}
.global_nav nav{display: block;}
section{padding: 0 0 5rem;}
section:first-of-type{padding-top: 5rem}
section{width:100%;height:auto;position: relative;}
.content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 2rem 2rem 2rem;
  width: 100%;
  background-color:#fff;
  color:#231815;
  border: 30px solid #CD2A2B;
  box-shadow: inset 0 0 0 1px #000000; /* 内側に黒1px */
}

.content-item {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 2rem;
  width: 100%;
}
.content900{max-width:900px;width: 100%;margin: 0 auto;}
h1{padding-top: 85px;}
h2, .online h3{margin: 0 auto; text-align: center;margin-top:7.25rem;}
h2 span{
    margin:2% 0 0;
    padding: 0;
    display: block;
    color:#CD2A2B;
  border-top:1px solid #CD2A2B;
  font-size: 1.5625rem;
  font-weight:700;
}

#gaiyo h2,#schedule h2,#tokuten h2,#item h2,#attention h2,.online h3,#X h3{
  font-family:"BIZ UDPMincho", serif;
  font-weight: 700;
	width:100%;
	max-width:7em;
	height:auto;
	min-height:94px;
	line-height: 1em;
	color:#CD2A2B;
	font-size:2.5rem;
  margin:2rem auto;
 }

#tokuten h2{color:#fff;}
#tokuten h2 span{
  color:#fff;
  border-top:1px solid #fff;
}

.br430, .br650, .br750{display: none;}
.none1050{display: block;}
/*color*/
/*.h2-beige{border-bottom: 8px dotted #D6C2A5;}
.h2-red{border-bottom: 8px dotted #E8404D;}*/
.flx, dl{display: flex;}

/*font*/
.f25{font-size: 1.5625rem;text-align: center;margin: 0.5rem 0 2rem;line-height: 2.5rem;}
.f24{font-size: clamp(1.25rem, 2.5vw, 1.5rem);}
.f23{font-size: 1.4375rem;}
.f22{font-size: 1.375rem;}
.f21{font-size: 1.5rem;letter-spacing: 0.21px;}
.f20{font-size: 1.25rem;line-height: 1.75rem;}
dt, .f18, .prices1{font-size: 1.125rem;}
.term1, .f17{font-size: 1.063rem;}
.f14{font-size: 0.875rem;font-weight: 600;letter-spacing: 0.14px;line-height: 1.5rem;margin-top: 1rem;}
.spli2 a, .spli2 a:visited {color: #051129; font-size: 1.2rem;}

/*背景*/
#gaiyo,#tokuten,#attention{position: relative;}

.bg1{
  background-color: #202020; /* 明るい土台 */
  background-image:url("../img/grade_top.png"),url("../img/smog_long.png");
  background-repeat:no-repeat,no-repeat;
  background-position: center top,center top;
  background-size: auto,cover;
  background-blend-mode: normal,multiply;
}

.bg2{
  background-image:url("../img/item_bg.png");
  background-repeat: repeat-y;
  background-size:contain;
  background-position: top center;
}
.bg3{
  background-image:url("../img/grade_bottom.png");
  background-repeat: repeat-y;
  background-size:auto;
  background-position: center bottom;
}


/*本文*/
#gaiyo p,.text p{text-align: center;font-weight: 400;line-height: 2.19rem;}

/*schedule*/
#schedule{
	background-color: #000;
  max-width:1200px;
  margin:0 auto;
}

.tenpo-wrap{margin: 4rem 0 4rem;}
.tenpo-wrap div{margin-bottom:2rem;}
.tenpo-wrap table{max-width:900px;width:100%;border:1px solid #000;border-collapse:collapse;}
.tenpo-wrap th{background-color:#000;color:#fff;padding:2%;}
.tenpo-wrap th.f22 span{font-size:120%;}
.tenpo-wrap td{width:100%;padding:2%;}

.tenpo-wrap td div{
  width:100%;
  background-color:#B197C6;
  margin-bottom: 1rem;
  padding-bottom: 1em;
}
.tenpo-wrap td div h3{
  text-align: center;
  color:#fff;
  padding:1em 0;
}
.tenpo-wrap td div ul{
   justify-content: center;
}

.tenpo-wrap.flx{justify-content: space-between;}
.tenpo-wrap.flx, .tenpo-wrap.flx dl{align-items: center;}
.tenpo-wrap li a{background: #5E358E;color:#fff;box-shadow: 0px 3px #00000029;padding: 0.75rem 0;display: inline-block;width:100%;text-align: center;}
.tenpo-wrap li{margin-right: 1.25rem;width:27.778%;}
.tenpo-wrap li:last-of-type{margin-right: 0;}
.tenpo-wrap li a:active {box-shadow: none;position: relative;top: 3px;}
.tenpo-wrap .map a::before {
  font-family: "Font Awesome 5 Free";
  content: "\f3c5";
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
	padding-right: 0.2rem;
}
.tenpo-wrap .link a::after {
  font-family: "Font Awesome 5 Free";
  content: "\f08e";
	  font-weight: 900;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
	padding-left: 0.5rem;
}

.online div.onlineshop{width:100%;padding:0;}

/*online*/
/*.online .f25{padding-top: 1.25rem;}*/
.online h3{max-width:485px;width: 100%;display: flex;align-items: center;justify-content: center;}
.online dl{/*max-width: 718px;*/width: 100%;margin: 0 auto;align-items: center;margin-bottom: 0.625rem;}
.online dt{background-color:#5E358E;color:#fff;padding: 0.75rem;width: 177px;text-align: center;margin-right: 2rem;}
.online dd span{font-size: 120%;}
.online .text{text-align: center;margin-bottom:2em;}
.online a,#X a{text-decoration: underline;}
.online .shop-banner img{display: block;margin:0 auto;}
.online ul.f14{max-width:704px;margin:1em auto;}

/*X*/
#X {background-color:#CD2A2B;color:#fff;position: relative;padding: 4rem 0 5rem;max-width: 600px;margin: 2.1875rem auto;}
#X h3{margin: 0 auto;padding-bottom: 2rem;text-align: center;color:#fff;}
#X h3 img{max-width:121px;width:100%;}
#X p{max-width: 300px;margin: 0 auto;text-align: center;}

/*tokuten*/
#tokuten .content{background-color:#CD2A2B;color:#fff;box-shadow:none;}
.toku-img{padding-top: 1.125rem;background-color:#fff;}
.toku-img img{max-width: 900px;width: 100%;margin: 0 auto;}
/*item*/
#item ul {display: flex;flex-wrap: wrap;justify-content: space-between;max-width: 1100px;margin: 0 auto;width: 100%;padding-top: 1.5rem;}
#item li {width: calc(96%/4);margin-bottom: 2rem;position: relative;}
.term1 {background: #EBD8BD;text-align: center;margin: 0.5rem 0;border-radius: 8px;line-height: 1.875rem;height: 81px;padding: 0.5rem 0;}

#item ul li .flag{
	position: absolute;
  background: #5E358E;
	color: #fff;
  border-radius: 1rem;
  top: 27%;
  left: 50%;
  transform:translateX(-50%);
  width: 150px;
  height: auto;
  line-height: 1.1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  z-index: 2;
  font-size: 0.75rem;
}

.item__text{
	width:100%;
	min-height:14.0625rem;
	padding:3%;
	position: relative;
	background-color:#8A6BAD;
	color:#fff;
}
.item__text p{
	font-weight: 400;
	font-style: normal;
	text-align: center;
	font-size: 1rem;
	letter-spacing: 0;
	line-height: 1.375rem;
	color: #fff;
}
.condition {
	margin:0 auto;
	padding-bottom:2%;
	border-bottom: 1px solid #ccc;
}
.itemname_box{
	margin: 1.75rem auto;
	font-size: 1rem;
}
.itemname_box span{
	background-color: #DA292A;
	padding:1%;
	display: block;
	position: absolute;
	top: 63%;
    left: 50%;
    transform: translate(-50%, -50%);
	width:80%;
}
.itemname {
	margin-bottom: 1rem;
	height: 8.1rem;
}
.item__text .price-right {
	text-align: right;
	margin: 0 auto;
	max-width: 161px;
}
.price-tax {
	padding-right: 0.5rem;
}

dl.price-box{
	font-weight: 400;
	font-style: normal;
	display: flex;
	flex-wrap: wrap;
	position: absolute;
	bottom:3%;
	left:0;
	right:0;
	margin:auto;
	padding:0 2%;
}
.price-box dt{
	width:40%;
	text-align: right;
	line-height: 1.6875rem;
}
.price-box dd{
	width:60%;
	text-align: right;
	line-height: 1.6875rem;
}
.item__text .rprice{
	font-size: 1rem;
}
.item__text .ryomoku,.item__text .rprice span,.item__text .price span{
	font-size:clamp(0.65rem, 2vw, 0.7rem);
}
.item__text .price{
	width:100%;
	font-size:1rem;
	position: absolute;
	bottom: 8%;
    left: 50%;
    transform: translate(-50%, 0);
}



/*attention*/
#attention{padding:5rem 0;}
#attention .content900 > img{max-width: 366px;margin: 0 auto;display: block;margin-top: 2.5rem;}
#attention ul{max-width: 900px;margin: 0 auto;letter-spacing: 0.18px;line-height: 2rem;font-weight: 600;}
.copyright{max-width: 1200px;margin: 0 auto;width: 94%;font-weight:200;}
footer {background: #fff;color: #231815;}

.top1 {position: fixed; bottom: 7%; max-width: 90px; z-index:6;right: calc(50.5% - 900px);}
.top2 {margin-right: auto;margin-left: 0px;display: block;text-shadow: none;}
.top2 a {float: right;/*color: #D3B572;
border: #D3B572 solid 3px; border-radius: 50%;background: rgba(255,255,255,0.85); padding: 10px;*/}
.top2 span {display: block;}
.top2 i {font-size: 1.6rem;color: #fff;}

/*発売予定
.sale {position: relative;}
.sale .date-pre {
    top: 0%;
    right: 0%;
    font-size: 0.8rem;
    padding: 0.1rem 0.4rem 0.2rem;
    position: absolute;
    background: #932e44;
    font-weight: 700;
    color: #fff;
    z-index: 1;
    text-align: center;
}*/

@media screen and (max-width:1799px) {
	.top1 {position: fixed; bottom: 7%; max-width: 90px; right: 3%;z-index:2;}
	#gaiyo::before {top: 1.5%;height: 1.5%;}
}


@media screen and (max-width:1200px) {
	.term1{font-size: 0.9rem;line-height: 1.5rem;height: 70px;padding: 0.75rem 0;}
	/*.content900{width: 90%;}*/
}
@media screen and (max-width:1050px) {
	.tenpo-wrap.flx{display: block;padding: 1.5rem 0 2.5rem;}
	.tenpo-wrap h3, .tenpo-wrap h3.moyuk{line-height: 2.8rem;height: auto;max-width: 610px;width:100%;padding-top: 0;margin: 0 auto;}
	.none1050{display: none;}
	.tenpo-wrap.flx, .tenpo-wrap.flx dl ,.tenpo-wrap ul {justify-content: center;max-width: 610px;margin:1em auto;}
	.tenpo-wrap > div{padding-right: 0;}
	.tenpo-wrap li a {width: 190px;}
	.tenpo-wrap dd {max-width: 510px;}


}
@media screen and (max-width:1000px) {
	#item li {width: calc(96% / 3);}
	#item ul{width: 90%;}
}
@media screen and (max-width:900px){
	
	html{font-size: 14px;}
	.tenpo-wrap dt{width: 111px;}
	
	h2, h3{font-size: 1.5rem;}
	.term1{height: 63px;}
	
	#gaiyo::before {top: 1%;}
}

@media screen and (max-width:800px){
	
	
	/*#item .content {padding: 4rem 2rem;}*/
	/*.tenpo-wrap {border: 5px solid #C3CFEC;border-radius: 24px;}*/
	.tenpo-wrap{margin-bottom: 1rem;}
	.tenpo-wrap li a ,.li-blank{width: 175px;}
	.tenpo-wrap dd {max-width: 460px;}

	
}
@media screen and (max-width:750px){
  .global_nav nav{background: #000;}
	/*.sale .date-pre {padding: 0.4rem 0.4rem 0.7rem;}*/
	h1{padding-top: 70px;}
	#item li {width: calc(96% / 2);}
	#item ul{width: 98%;}
	.br750{display: block;}
	.online dl{max-width: 400px;}
	.block750{display: none;}
	/*section:first-of-type {padding: 4.5rem 0;}*/
}

@media screen and (max-width:700px){
	html{scroll-padding-top: 50px;}
	.tenpo-wrap.flx dl{flex-direction: column;}
	.tenpo-wrap dt{padding: 0.68rem 0 0.5rem;text-align: center;color:#fff;}
	.tenpo-wrap dd{padding-bottom: 0;max-width: 380px;margin: 0 auto;text-align: center;padding-left: 0;}
	.tenpo-wrap ul{display: block;}
	.tenpo-wrap li{text-align: center;margin: 0 auto;padding: 0.5rem 0;width:auto;}
	.li-blank{display: none;}
	
	/*.tenpo-wrap h3, .tenpo-wrap h3.moyuk{background: #C3CFEC;border-radius: 24px;padding: 0.68rem 1.68rem;max-width: 220px;}*/
	#X::before{
	  width: 67px;
	  height: 64px;
		left: 4rem;
		top: 2rem;
		
	}
	#X::after{
	  width: 93px;
	  height: 91px;  
	  right: 2rem;
		bottom: 2rem;
	}
	#gaiyo::before {top: 0.8%;height: 1%;}

}
@media screen and (max-width:650px){
	.br650{display: block;}
  #attention .content900 > img{max-width: 230px;}
  .online h3{margin-top:0;}  

}
@media screen and (max-width:550px){
	#gaiyo::before {top: 0.6%;height: 0.8%;}
}

@media screen and (max-width:500px){
	
	html{scroll-padding-top: 40px;}
	html {font-size: 12px;}
  .content{
    padding: 0 1rem 1rem 1rem;
    border: 15px solid #CD2A2B;
  }
  
	
	h1{padding-top: 55px;}
	.nav1{height: 55px!important;}
	.f25{font-size: 1.4rem;line-height: 2.25rem;}
	.f14, .term1{font-size: 1rem;}
	#schedule dl {flex-direction: column;margin-bottom: 1.5rem;}
	#schedule dl dt{margin-bottom: 0.5rem;}
	.tenpo-wrap dt{width: 95px;}
	.tenpo-wrap dd{max-width: 320px;border-bottom: 1px solid #fff;}
	.tenpo-wrap {margin-top: 0;}
	#X::before{ width: 53px;height: 50px;left: 2rem;top: 2rem;}
	#X::after{width: 74px;height: 70px;right: 1rem;bottom: 2rem;}
	#X {padding: 4rem 0 6rem;margin-top: 4.375rem;}
	.term1{height: 53px;}
	
	.online dt{margin-right: 0;}
	/*.tenpo-wrap h3, .tenpo-wrap h3.moyuk{max-width: 185px;}*/
	#item ul {padding-top: 0;}

}
@media screen and (max-width:460px){
	
	html{scroll-padding-top: 80px;}


	
}
@media screen and (max-width:430px){
	.br430{display: block;}
  
	.tenpo-wrap.flx {padding-top: 0;}
	.tenpo-wrap.ikebukuro{padding-bottom: 0;}
	
}
@media screen and (max-width:420px){
	
}
@media screen and (max-width:380px){
	
}