/* CSS Document */
@charset "utf-8";
@import url(https://fonts.googleapis.com/earlyaccess/sawarabimincho.css);
@import url(https://fonts.googleapis.com/earlyaccess/sawarabigothic.css);
@import url('https://fonts.googleapis.com/css?family=EB+Garamond:400,500,600,700');
/* 
英字タイトル	font-family: 'EB Garamond', serif;
日本語ゴシック	font-family: 'Sawarabi Gothic';
日本語明朝	font-family: "Sawarabi Mincho";
*/

*{
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	letter-spacing: 0.1rem;
	line-height: 1.3rem;
	color: #353535;
	font-family: 'Sawarabi Gothic';
	font-weight: normal;
}

html {
	font-size: 74%; /* Base Font Size 12px */
	min-height: 100vh;
	height: 100%;
	overflow-x: hidden;
}

body {
	width: 980px;
	margin: 0 auto;
	height: 100%;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
	font-size: 1.2rem;  
}

a{
	text-decoration: none;
}
ul{
	list-style: none;
}
img{
	width: 100%;
}
button{
	border: none;
}

#wrap{
	width: 980px;
	height: 100%;
	display: block;
}

main{
	width: 100%;
}
#headbox{
	margin-bottom: 1.5rem;
}
header{
	background:#170000;
	display: flex;
	flex-wrap: wrap;
	margin:0 calc(((100vw - 100%) / 2) * -1);
	padding: 0 calc((100vw - 100%) / 2);
	justify-content: space-between;
}
/*エンブレムの場所　横幅↓*/
header .hbox{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 500px;
}
/*エンブレムの画像　横幅 ↓*/
header .shopmonth{
	display:block;
	width: 90px;
	margin: auto auto;
}
/*エンブレムの画像　横幅　長方形の時 ↓*/
header .shopmonth2{
	display:block;
	width: 180px;
	margin: auto auto;
}
header h1{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 110px;
}
header aside{
	display: block;
	width: 400px;
}
header aside ul{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	width: 100%;
	border-bottom: 1px solid #ffffff;
	padding: 0.9rem 0 0.7rem 0;
	margin-bottom: 1.1rem;
}
header aside ul li{
	display: block;
	font-size: 1.1rem;
}
header aside ul li a{
	color: #ffffff;
	letter-spacing: 0.01rem;
}
header aside ul li a:hover{
	color: #DCDCDC;
}
header aside ul li:last-child{
	border: none;
}
header aside .searchblock{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;	
	margin-bottom: 1rem;
}
a.cart{
	display: block;
	width: 85px;
	height: auto;
	padding: 0.1rem 0.6rem;
	border: 0;
	border-radius: 5px;
	background:#eeecb5;
}
.searchblock form.searchbox{
	width: 300px;
}
.searchblock form.searchbox h4{
	width: 100%;
	font-size: 1.0rem;
	color: #ffffff;
	font-family: 'EB Garamond', serif;
	padding-bottom: 0.1rem;
}
.searchblock form.searchbox button{
	width: 30px;
	height: 31px;
	padding: 0.2rem;
	border-radius: 5px;
	background:#eeecb5;
	cursor: pointer;
}
.searchblock form.searchbox input[type="text"]{
	vertical-align : middle;
	height: 30px;
	border: 0;
	border-radius: 2px;
	width: 253px;
	margin-top: -13px;
	padding: 0.5rem;
}
nav{
	margin: 0.5rem 0 1.2rem 0;
	background: #ffffff;
	margin:0 calc(((100vw - 100%) / 2) * -1);
	padding: 0 calc((100vw - 100%) / 2);
}
nav ul{
	display: flex;
	width: 100%;
	background: #ffffff;
	padding: 0.5rem 0;
}
nav ul li{
	width: calc(100% / 5);
	text-align: center;
	border-right: 1px solid #170000;
}
nav ul li:first-child{
	border-left: 1px solid #170000;
}
nav ul li a{
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: center;
	width: 100%;
	height: 100%;
	padding: 0.5rem;
	font-size: 1.5rem;
	line-height: 2rem;
	font-family: 'EB Garamond', serif;
	color: #170000;
	font-weight: 500;
	background-image: linear-gradient(rgba(0,0,0,0) 50%, rgba(232,232,232,1.00) 50%);
  	background-position: 0 0;
  	background-size: auto 200%;
}
nav ul li a:hover{
	transition: background .3s;
	background-position: 0 100%;
}
nav ul li a span{
	font-family: "Sawarabi Mincho";
	width: 100%;
	display: block;
	font-size: 1.2rem;
}

/** Section Common **/
section,
article{
	padding: 8rem 0;
}
.grayback{
	background: #e7e7e7;
	margin:0 calc(((100vw - 100%) / 2) * -1);
	padding: 8rem calc((100vw - 100%) / 2);
}
a.andmore{
	width: 40%;
	display:block;
	margin: 0 auto;
	padding: 1.5rem 0;
	box-shadow: 0px 1px 1px 1px hsla(0,0%,68%,0.60);
	font-weight: 500;
	background-color: #b5b5b5;
	background-image: url(../img/parts/arrow-white.png) , url(../img/parts/srtipeback-wh.png);
	background-repeat: no-repeat , repeat;
	background-size: 6px , auto;
	background-position: 95% 50% , center;
	font-family: 'EB Garamond', serif;
	font-size: 1.8rem;
	color: #ffffff;
	text-align: center;
}
.andmore:hover{
	background-color: transparent;
	background-color: #686868;
	background-repeat: no-repeat , repeat;
	background-size: 6px , auto;
	background-position: 95% 50% , center;
	transition: 0.4s ease all;
	box-shadow: none;
	cursor: pointer;
}

section.grayback a.andmore{
	background-color: transparent;
	background-image: url(../img/parts/arrow-gray.png) , url(../img/parts/srtipeback-gr.png);
	background-repeat: no-repeat , repeat;
	background-size: 6px , auto;
	background-position: 95% 50% , center;
	border: 1px solid #515151;
	color: #353535;	
}
section.grayback a.andmore:hover{
	background-color: transparent;
	background-image: url(../img/parts/arrow-white.png) , url(../img/parts/srtipeback-wh.png);
	background-repeat: no-repeat , repeat;
	background-size: 6px , auto;
	background-position: 95% 50% , center;
	border: 1px solid hsla(0,0%,70%,1.00);
	transition: 0.4s ease all;
	box-shadow: none;
	transition: 0.4s ease all;
	color: hsla(0,0%,70%,1.00);
}

h2{
	width: auto;
	font-size: 2.0rem;
	font-family: 'EB Garamond', serif;
	font-weight: 500;
	clear: both;
	letter-spacing: 0.01rem;
	border-bottom: 1px solid #170000;
	color: #170000;
	padding: 0 0 0.5rem 1rem;
}
h2 span{
	font-family: 'Sawarabi Gothic';
	font-size: 1.4rem;
}

.newitem a,
.pickupitem a,
.itemlist a,
.bannerblock a{
	color: rgba(31,31,31,1.00);}

.newitem a:hover,
.pickupitem a:hover,
.itemlist a:hover,
.bannerblock a:hover{
	opacity: 0.7;
	filter: alpha(opacity=70);
	-moz-opacity: 0.7;
	transition: 0.3s ease-in-out;
}

/* New Item Erea */

#new h2 time{
	float: right;
	display: inline-block;
	margin: 0 auto 0 auto;
	font-size: 1.2rem;
}

.newitem{
	display: block;
	margin: 1.5rem 0 5rem 0;
}
.cf::after {
  content:"";
  display:table;
  clear:both;
}
.newitem a{
	display: block;
	float: left;
	width: 16.4%;
	margin-right: 4rem;
}
.newitem a img{
	display: block;
	border: 1px solid #f2f2f2;
}
.newitem a:nth-of-type(1){
	width: 35%;
}
.newitem a:nth-of-type(2),
.newitem a:nth-of-type(3),
.newitem a:nth-of-type(4){
	margin-bottom: 1.7rem;
}
.newitem a:nth-of-type(4),
.newitem a:nth-of-type(7){
	margin-right: 0;
}

/* Pick up */
.pickupitem{
	width: 100%;
	display: flex;
	justify-content: space-between;
	margin-bottom: 5rem;
	margin-top: 3rem;
}
.pickupitem a{
	display: block;
	width: 28%;
	text-align: center;
	font-size: 1.25rem;
	line-height: 1.5rem;
}
.pickupitem a img{
	display: block;
	margin-bottom: 1.2rem;
}

/* Banner Block */
.bannerblock{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.bannerblock a{
	flex-basis: 49.5%;
	margin-bottom: 1.5rem;
}
.bannerblock a:nth-of-type(1){
	flex-basis: 100%;
}

/* Normal Item List */
.itemlist{
	width: 100%;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
	padding: 0;
	margin: 3rem 0;
}
.itemlist a{
	width: 22%;
	display: block;
	text-align: center;
	margin-right: 4%;
	margin-bottom: 5%;
	line-height: 1.5rem;
	font-size: 1.0rem;
}
.itemlist a img{
	border: 1px hsla(0,0%,93%,1.00);
}
section.grayback .itemlist a img{
	border: none;	
}
.itemlist a:nth-of-type(4),
.itemlist a:nth-of-type(8){
	margin-right: 0;
}

/* Q&A */
article h2,
footer h2{
	text-align: center;
	border: none;
	line-height: 4rem;
	font-size: 3rem;
	letter-spacing: 0.5rem;
}
article h2 span,
footer h2 span{
	font-size: 1.1rem;
	display: block;
}
.questionlist{
	margin: 2.6rem 0;
	width: 100%;
	padding: 0;
	display: flex;
	justify-content: space-around;
	flex-wrap: wrap;
}
.questionlist li{
	display: flex;
	justify-content: center;
	align-items: center;
	width: 30%;
	background: #ffffff url(../img/parts/arrow-gray.png) no-repeat 97% 50%;
	background-size: 5px;
	border: 1px solid #3d3d3d;
	margin-bottom: 1.5rem;
}
.questionlist li a{
	width: 100%;
	display: block;
	padding: 1.5rem 1.6rem 1.5rem 1.0rem;
	line-height: 1.5rem;
	color: #3d3d3d;
}
.questionlist li:hover{
	transition: 0.4s ease all;
	border: 1px solid hsla(0,0%,88%,1.00);
	background: hsla(0,0%,88%,1.00) url(../img/parts/arrow-white.png) no-repeat 97% 50%;
	background-size: 5px;
}
/* PC footer */
footer{
	margin:0 calc(((100vw - 100%) / 2) * -1);
	padding: 4rem calc((100vw - 100%) / 2);
	background: url(../img/parts/stripeback-l.png);
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	border-bottom: 50px solid #170000;
}
footer h2{
	width: 100%;
	display: block;
	margin-bottom: 2.8rem;
	line-height: 2.5rem;
}
footer h3{
	font-family: 'Sawarabi Gothic';
	font-weight: 400;
	font-size: 1.4rem;
	margin:0.7rem 0 0.6rem 0;
}
.left-content,
.right-content{
	padding: 1.5rem;
	width: calc(100% / 2);
	background: #ffffff;
	box-sizing: border-box;
}
.left-content pre,
.right-content pre{
	width: 100%;
	white-space: pre-wrap;
	margin-bottom: 2rem;
	letter-spacing: 0.02rem;
	line-height: 1.5rem;
}
.left-content pre span,
.right-content pre span{
	display: block;
	font-size: 1.0rem;
	letter-spacing: 0.05rem;
	margin-top: 0.9rem;
}
footer .left-content img{
	width: 80%;
}
footer .right-content img{
	width: auto;
}
.bluetext{
	color: hsla(198,100%,37%,1.00);
}
.redtext{
	color: hsla(0,100%,39%,1.00);
}

@media screen and (max-width:480px){
    /*　画面サイズが600pxから960pxまではここを読み込む　*/
	body {
	width: 96%;
	}
	#wrap{
	width: 100%;
	height: 100%;
	display: block;
	margin-top: 110px;
	}
	#headbox{
		width: 100%;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 10;
		background: #ffffff;
	}
	header{
	background:#170000;
	margin:0;
	padding: 0 calc((100vw - 100%) / 2);
	width: 100%;
	}
	.headerblock{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-end;
		padding: 0.2rem 0.5rem;
	}
	.shopmonth-box{
		display: block;
		width: 12rem;
		margin-right: auto;
	}
	.shopmonth-sp{
		width: 4.3rem;
		display: inline-block;
		margin-left: 5px;
	}
	header h1{
		display: inline-block;
		width: 6rem;
	}
	a.cart,
	.searchbutton{
		border: 0;
		border-radius: 5px;
		background:#eeecb5;
		padding: 0.15rem;
	}
	a.cart img,
	.searchbutton img{
		width: 96%;
	}
	.searchbutton,
	a.cart{
		width: 2.8rem;
		padding: 0.2rem;
		margin-right: 1.2rem;
	}
	a.cart{
		margin: 0;
	}
	nav{
		margin: 0;
	}
	nav ul{
	display: flex;
	width: 100%;
	background: #ffffff;
	margin: 0;
	padding:0 0 0.2rem 0;
	}
	nav ul li{
	width: calc(100% / 5);
	padding: 0.2rem 0;
	text-align: center;
	border-right: 1px solid #170000;
	}
	nav ul li:first-child{
	border-left: none;
	}
	nav ul li:last-child{
	border-right: none;
	}
	nav ul li a{
	font-size: 3vw;
	letter-spacing: 0.02rem;
	line-height: 1rem;
	padding: 0;
	color: #170000;
	background: #ffffff;
	}
	nav ul li a:hover{
	background: #ffffff;
	}
	nav ul li a span{
	font-size: 2.5vw;
	letter-spacing: 0.01rem;
	align-items: center;
	margin: 0;
	}
	
	/* SP用 Section設定 */
	section,
	article{
	padding: 2rem 0 !important;
	margin-bottom: 2rem;
	}
	.grayback{
	margin:0 calc(((100vw - 100%) / 2) * -1);
	padding: 2rem calc((100vw - 100%) / 2) !important;
	}
	a.andmore{
	width: 86%;
	font-size: 6vw;
	padding: 1.1rem 0;
	}

	h2{
	width: 100%;
	font-size: 5vw;
	letter-spacing: -0.04rem;
	padding: 0 0 0.5rem 0;
	}
	h2 span{
		font-size: 3vw;
	}
	
	/* SP用 Item Search */
	#spsearchbox h2{
		border: none;
		text-align: center;
	}
	#spsearchbox h3{
		font-family: 'EB Garamond', serif;
		font-size: 4vw;
		color: #170000;
		text-align: center;
	}
	#spsearchbox form.searchbox{
		width: 90%;
		height: auto;
		display: flex;
		justify-content: space-around;
		margin: 0.8rem auto 1.4rem auto;
	}
	#spsearchbox form.searchbox button{
		width: 9vw;
		height: auto;
		padding: 0.2rem;
		border-radius: 2px;
		background:rgba(23,0,0,1.00);
		cursor: pointer;
	}
	#spsearchbox form.searchbox input[type="text"]{
		vertical-align : middle;
		height: auto;
		border: 0;
		border-radius: 2px;
		width: 75vw;
		padding: 0.5rem;
		border: 1px solid rgba(23,0,0,1.00);
		font-size: 16px;
	}
	#spsearchbox ul{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around; 
		margin-top: 1rem;
	}
	#spsearchbox ul li{
		display: flex;
		justify-content: center;
		align-items: center;
		width: 30%;
		background: #ffffff;
		border-radius: 2px;
		box-shadow: 0 1.5px 2px 0.2px rgba(87,87,87,0.44);
		margin-bottom: 0.8rem;
	}
	#spsearchbox ul li a{
		width: 100%;
		text-align: center;
		padding: 0.6rem;
	}
	 /* SP用 NewItem*/
	.newitem{
		width: 100%;
		display: grid;
		margin: 1rem 0 2.5rem 0;
		grid-template-columns: 24.5% 24.5% 1fr 1fr;
		grid-template-rows: 1fr 1fr;
		grid-gap: 0.3rem;
	}
	.newitem a{
		float: none;
		margin: 0;
		width: 100%;
	}
	.newitem a img{
		display: block;
	}
	.newitem a:nth-of-type(1){
		grid-column: 1/3;
		grid-row: 1/3;
		width: 100%;
	}
	.newitem a:nth-of-type(2){
		grid-column: 3;
		grid-row: 1;
		width: 100%;
		margin: 0;
	}
	.newitem a:nth-of-type(3){
		grid-column: 3;
		grid-row: 2;
		width: 100%;
		margin: 0;
	}
	.newitem a:nth-of-type(4){
		grid-column: 4;
		grid-row: 1;
		width: 100%;
		margin: 0;
	}
	.newitem a:nth-of-type(5){
		grid-column: 4;
		grid-row: 2;
		width: 100%;
	}
	.newitem a:nth-of-type(6),
	.newitem a:nth-of-type(7){
		display: none;
	}

	/* Pick up */
	.pickupitem{
		margin-bottom: 2.5rem;
		margin-top: 1.2rem;
	}
	.pickupitem a{
		width: 28%;
		font-size: 1.1rem;
		line-height: 1.5rem;
		word-break: break-all;
		letter-spacing: -0.05rem;
	}
	.pickupitem a img{
		margin-bottom: 1.2rem;
	}

	/* Banner Block */
	.bannerblock a{
		flex-basis: 100%;
		margin-bottom: 0.2rem;
	}
	.bannerblock a:nth-of-type(2),
	.bannerblock a:nth-of-type(3){
		flex-basis: 49.5%;
	}

	/* Normal Item List */
	.itemlist{
		padding: 0;
		margin: 1.5rem 0;
	}
	.itemlist a{
		width: 30%;
		margin-right: 0%;
		margin-bottom: 5%;
		line-height: 1.5rem;
		font-size: 1.0rem;
		letter-spacing: -0.05rem;
	}
	.itemlist a:nth-of-type(4){
		margin-right: 0%;
	}
	.itemlist a:nth-of-type(7),
	.itemlist a:nth-of-type(8){
		display: none;
	}
	/* Q&A */
	article h2{
		line-height: 3.5rem;
		font-size: 6vw;
		letter-spacing: 0.5rem;
		width:auto;
	}
	article h2 span{
		font-size: 3vw;
	}
	.questionlist{
		margin: 1.3rem 0;
		width: 100%;
		padding: 0;
	}
	.questionlist li{
		width: 48%;
		margin-bottom: 0.8rem;
	}
	.questionlist li a{
		padding: 0.5rem 0.85rem 0.5rem 0.2rem;
		line-height: 1.2rem;
		font-size: 3.5vw;
	}
	.questionlist li:last-child{
		display: none;
	}
	footer{
		margin:0 calc(((100vw - 100%) / 2) * -1);
		padding: 1.5rem calc((100vw - 100%) / 2);
		background: #170000;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around;
		border: none;
	}
	footer h4{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 20vw;
		text-align: center;
	}
	footer ul.asidelist{
		width: 70%;
		display: flex;
		flex-wrap: wrap;
		justify-content:flex-end;
	}
	footer ul.asidelist li{
		display: block;
		width: 45%;
		margin: 0.2rem;
	}
	footer ul.asidelist li a{
		display: block;
		text-align: center;
		width: 100%;
		color: #eeecb5;
		border: 1px solid #eeecb5;
		font-size: 2.5vw;
		letter-spacing: 0.02rem;
		padding: 0.4rem 0;
	}
}

@media screen and (min-width:481px) and ( max-width:800px) {
    body {
	width: 96%;
	}
	#wrap{
	width: 100%;
	height: 100%;
	display: block;
	margin-top: 130px;
	}
	#headbox{
	width: 100%;
	background: #ffffff;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 10;
	}

	header{
	background:#170000;
	margin:0;
	padding: 0 calc((100vw - 100%) / 2);
	width: 100%;
	}
	.headerblock{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		align-items: center;
		justify-content: flex-end;
		padding: 0.2rem 0.5rem;
	}
	header .hbox{
		display: flex;
		flex-wrap: wrap;
		justify-content: space-evenly;
		width: 19rem;
	}
	header h1{
		display: block;
		width: 6rem;
		margin-right: auto;
	}
	header .shopmonth{
		display: block;
		width: 6rem;
		margin: auto auto;
	}
	.shopmonth-box{
		display: flex;
		justify-content:space-evenly;
		width: 12rem;
		margin-right: auto;
	}
	.shopmonth-sp{
		width: 4.3rem;
		display: inline-block;
		margin-left: 5px;
	}
	.cart,
	.searchbutton{
		border: 0;
		border-radius: 5px;
		background:#eeecb5;
		padding: 0.15rem;
	}
	a.cart img,
	.searchbutton img{
		width: 96%;
	}
	.searchbutton,
	a.cart{
		width: 2.8rem;
		padding: 0.2rem;
		margin-right: 1.2rem;
	}
	a.cart{
		margin: 0;
	}
	nav{
		margin: 0;
	}
	nav ul{
	display: flex;
	width: 100%;
	background: #ffffff;
	padding:0 0 0.2rem 0;
	}
	nav ul li{
	width: calc(100% / 5);
	text-align: center;
	border-right: 1px solid #170000;
	}
	nav ul li:first-child{
	border-left: none;
	}
	nav ul li:last-child{
	border-right: none;
	}
	nav ul li a{
	font-size: 1.9vw;
	letter-spacing: 0.02rem;
	line-height: 1.3rem;
	color: #170000;
	padding: 0;
	background: #ffffff;
	}
	nav ul li a:hover{
		background: #ffffff;
	}
	nav ul li:nth-child(1) a,
	nav ul li:nth-child(2) a,
	nav ul li:nth-child(3) a,
	nav ul li:nth-child(4) a{
		padding-top: 0rem;
	}
	nav ul li a span{
	font-size: 1.6vw;
	letter-spacing: 0.01rem;
	align-items: center;
	margin: 0;
	}

	section,
	article{
	padding: 2rem 0;
	margin-bottom: 2rem;
	}
	.grayback{
	margin:0 calc(((100vw - 100%) / 2) * -1) 2rem calc(((100vw - 100%) / 2) * -1);
	padding: 4rem calc((100vw - 100%) / 2);
	}
	a.andmore{
	width: 37%;
	font-size: 3vw;
	padding: 1.1rem 0;
	}
	.newitem{
		width: 100%;
		display: grid;
		margin: 1rem 0 2.5rem 0;
		grid-template-columns: 25% 25% 1fr 1fr;
		grid-template-rows: 1fr 1fr;
		grid-gap: 0.2rem;
	}
	.newitem a{
		float: none;
		margin: 0;
		width: 100%;
	}
	.newitem a:nth-of-type(1){
		grid-column: 1/3;
		grid-row: 1/3;
		width: 100%;
	}
	.newitem a:nth-of-type(2){
		grid-column: 3;
		grid-row: 1;
		width: 100%;
		margin: 0;
	}
	.newitem a:nth-of-type(3){
		grid-column: 3;
		grid-row: 2;
		width: 100%;
		margin: 0;
	}
	.newitem a:nth-of-type(4){
		grid-column: 4;
		grid-row: 1;
		width: 100%;
		margin: 0;
	}
	.newitem a:nth-of-type(5){
		grid-column: 4;
		grid-row: 2;
		width: 100%;
	}
	.newitem a:nth-of-type(6),
	.newitem a:nth-of-type(7){
		display: none;
	}
	#spsearchbox h2{
		border: none;
		text-align: center;
	}
	#spsearchbox h3{
		font-family: 'EB Garamond', serif;
		font-size: 4vw;
		color: #170000;
		text-align: center;
	}
	#spsearchbox form.searchbox{
		width: 90%;
		height: auto;
		display: flex;
		justify-content: space-around;
		margin: 0.8rem auto 1.4rem auto;
	}
	#spsearchbox form.searchbox button{
		width: 9vw;
		height: auto;
		padding: 0.2rem;
		border-radius: 2px;
		background:rgba(23,0,0,1.00);
		cursor: pointer;
	}
	#spsearchbox form.searchbox input[type="text"]{
		vertical-align : middle;
		height: auto;
		border: 0;
		border-radius: 2px;
		width: 75vw;
		padding: 0.5rem;
		border: 1px solid rgba(23,0,0,1.00);
	}
	#spsearchbox ul{
		width: 100%;
		display: flex;
		flex-wrap: wrap;
		justify-content: space-around; 
		margin-top: 1rem;
	}
	#spsearchbox ul li{
		display: flex;
		justify-content: center;
		align-items: center;
		width: 30%;
		background: #ffffff;
		border-radius: 2px;
		box-shadow: 0 1.5px 2px 0.2px rgba(87,87,87,0.44);
		margin-bottom: 0.8rem;
	}
	#spsearchbox ul li a{
		width: 100%;
		text-align: center;
		padding: 0.6rem;
	}

	.bannerblock a{
	flex-basis: 100%;
	margin-bottom: 0.2rem;
	}
	.bannerblock a:nth-of-type(2),
	.bannerblock a:nth-of-type(3){
		flex-basis: 49.5%;
	}


	
	footer{
	margin:0 calc(((100vw - 100%) / 2) * -1);
	padding: 1.5rem calc((100vw - 100%) / 2);
	background: #170000;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-around;
		border: none;
	}
	footer h4{
		display: flex;
		align-items: center;
		justify-content: center;
		width: 20vw;
		text-align: center;
	}
	footer ul.asidelist{
		width: 70%;
		display: flex;
		flex-wrap: wrap;
		justify-content:flex-end;
	}
	footer ul.asidelist li{
		display: block;
		width: 45%;
		margin: 0.2rem;
	}
	footer ul.asidelist li a{
		display: block;
		text-align: center;
		width: 100%;
		color: #eeecb5;
		border: 1px solid #eeecb5;
		font-size: 2.5vw;
		letter-spacing: 0.02rem;
		padding: 0.4rem 0;
	}

}