@charset "utf-8";
/* CSS Document */

/*==================================
	base
==================================*/
* {
	box-sizing: border-box;
}
body {
	font-family: 'Noto Serif Japanese', serif, sans-serif;
	font-size:14px;
	color:#1b0e00;
	background:#f8f8f8;
	height: 100%;
	width: 100%;
	min-width: 1100px;
	line-height: 140%;
}
ul, li, dl, dt, dd {
	list-style: none;
}
img {
    vertical-align: bottom;
}
a {
	color: #353a3f;
	transition: 0.8s;
	text-decoration: none;
	display: block;
}
a:hover {
	transition: 0.8s;
	opacity:0.5;
}
.arrow {display: inline-block; padding-left: 5px;}
.w100 { width: 100%;}
/*==================================
	PCSP
==================================*/
.pcOnly {display: block;}
.spOnly {display: none;}

@media screen and (max-width: 750px) {
.pcOnly {display: none;}
.spOnly {display: block;}
}

/*==================================
	font
==================================*/

.font24 {font-size:24px;}
.font12 {font-size:12px;}
.font_red {color:#ed7d4b; }

/*==================================
	header
==================================*/
header {position: fixed;width: 100%;z-index: 100;top: 0; background:#f8f8f8;height: 100px; margin: 0 auto; font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;}

header nav {position: relative; width: 100%; max-width: 1200px; margin: 0 auto; top: 15px;background:#f8f8f8;}
header nav .logo  {width: 344px; position: absolute; left: 0; right: 0; margin: 0 auto;}
header nav .logo img  {width: 100%;}
header nav a {display: block;}
header nav ul {display: flex; position: absolute; right: 0; top: 20px;}
header nav ul li:first-child {margin: 10px 40px 0 0;}
header nav .mypage {font-weight: 600;}
header nav .mypage a {padding-left: 35px;}
header nav .mypage .mypageicon {position: relative;}
header nav .mypage .mypageicon img {position: absolute; left: 0; top:-2px; width: 25px; }
header nav .cart {width: 180px; color: #fff; background: #ed7d4b; border-radius:5px; position: relative; font-weight: 600;}
header nav .cart a {color: #fff; padding: 10px 25px;}
header nav .cart .carticon img {position: absolute; right:30px; top: 8px; width: 25px; }

header #headerTelBox { position: absolute; left: 0; top: 1px;}
header #headerTelBox .txt { font-size: 15px; font-weight: bold; margin-bottom: 5px;}
header #headerTelBox .tel { font-size: 25px; font-weight: bold;line-height: 1.0;}
header #headerTelBox .tel img { width: 1.2em; vertical-align: -1px; margin-right: 6px;}
header #headerTelBox .time { font-size: 13px; margin-top: 2px; text-align: right;}


/*header nav #search {position: absolute; left: 0; top:20px;}
header nav #search input {padding: 9px 8px 10px 15px; border: solid 1px #dadada; border-radius: 4px 0 0 4px; -webkit-appearance: none; box-sizing: border-box;}
header nav #search .btn-white {position: relative; padding: 6px 28px 5px 12px; border: solid 1px #dadada; border-left: none; box-sizing: border-box; background: #ececec; line-height: 1.8;}
header nav #search .cartdown {position: absolute; top:15px; right: 10px; width: 0;height: 0; border-left: 6px solid transparent; border-right: 6px solid transparent; border-top: 6px solid black;}
header nav #search .btn-primary {background: #1b0e00; width:40px; padding:8px 10px 10px 10px; border-radius: 0 4px 4px 0;border: solid 1px #1b0e00;}
header nav #search img {width: 17px; }*/

@media screen and (max-width: 1200px) {
	header {padding: 0 5%;}
}

@media screen and (max-width: 1200px) {
header {padding: 0 5%;}
header nav {width:1000px;}
header nav .logo {width: 300px;}
}


/*==================================
	footer
==================================*/
footer {background: #f8f8f8; background-position: right;font-family: "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック体", "YuGothic", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", "Meiryo", "verdana", sans-serif;}
footer .footerInnerBlock {}
footer .menuBlock {padding: 30px 0; border-bottom: solid #dadada 1px; border-top: solid #1b0e00 3px;}
footer .menuBlock ul {margin-right: 30px; display: flex; flex-flow: row wrap; justify-content: center;}
footer .menuBlock ul li {margin-right:45px; }
footer .menuBlock ul li:last-child {margin-left: 25px;}
footer .menuBlock ul li a {text-decoration: none; display: block;}
footer .storeInfo {width: 1000px; margin: 60px auto;display: flex;justify-content: space-between;}
footer .address {width: 500px; display: flex;}
footer .address .add {margin-left: 40px; font-size: 12px; line-height: 1.9; padding-top: 5px;}
footer .footerSNSBtn {width: 360px; height: 80px; display: flex; background: #fff; padding: 15px 30px 15px 35px; color:#1b0e00; margin-top: 5px; border: solid 1px #dadada; box-sizing: border-box;}
footer .footerSNSBtn p {margin-top: 15px;font-size: 14px;}
footer .footerSNSBtn ul {display: flex; flex-flow: row wrap;}
footer .footerSNSBtn ul li {margin-left: 10px;}
footer .footerSNSBtn ul li:first-child {margin-left: 25px;}
footer p.copy {margin: 0; color: #fff; padding: 20px; text-align: center; background: #1b0e00; font-size: 10px;}



@media screen and (max-width: 750px) {

/*==================================
	base
==================================*/
body {min-width: 100%;}
.arrow::before {top:10px;}	

/*==================================
	font
==================================*/
.font24 {font-size:120%;}
.font12 {font-size:60%;}

/*==================================
	header
==================================*/
header {height: 64px; width: 100%; padding: 0 3%;}
header nav {width: 100%; height: auto; top: 10px;}
header nav .logo {width: 44%; max-width: 180px; display: inline-block; z-index: 100; /*right: 50%; transform: translate(-50%, 0); position: initial;*/ text-align: center;}
header nav ul {top:0;}
header nav ul li:first-child {margin: 10px 8px; }
header nav .cart {width: 50%;}
header nav .cart .carticon img {padding-left:0; position: initial;}
header nav .cart a {padding: 10px;}
    
header #headerTelBox { left: -1%; top:-2px;}
header #headerTelBox a { color: inherit; text-decoration: none;}
header #headerTelBox .txt { font-size: 12px; line-height: 1.5; font-weight: bold; margin-bottom: 0;}
header #headerTelBox .tel { font-size: 22px; font-weight: bold;line-height: 1.0;}
header #headerTelBox .tel img { width: 1em; vertical-align: -1px; margin-right: 6px;}
header #headerTelBox .time { font-size: 10px; margin-top: 0; text-align: left; line-height: 1.5;}

main #mv .mvbox {margin-top: 64px !important;}
#contentPage main {margin-top: 64px !important;}
    
/*header nav #search {width: 90%; right: 0; margin: 3% auto; top:50px; position: fixed;}
header nav #search input {width: 80%; padding: 12px 8px 12px 15px; margin-bottom: 0; height: 40px;}
header nav #search .btn-primary {width: 20%; padding: 8px 10px 10px 10px; height: 40px;}*/
	

/*==================================
	footer
==================================*/
footer .menuBlock {padding: 10% 0;}
footer .menuBlock ul {margin-right: 0; display: flex; flex-wrap: wrap;width: 85%; margin: 0 auto; justify-content: initial;}
footer .menuBlock ul li {margin-right: 0; font-size: 100%;width: 46%; margin-left: 8%;}
footer .menuBlock ul li:nth-child(n+3) { margin-top: 3%;}
footer .menuBlock ul li:nth-child(2n+1) { margin-left: 0;}
footer .storeInfo {width: 90%; display: block; text-align: center; margin: 10% auto;}
footer .address {width: 100%; margin: 0 auto 5% auto;}
footer .address .add {margin-left: 5%; font-size: 90%; text-align: left; padding-top: 0;}
footer .footerSNSBtn {width: 100%; margin: 0 auto; display: block; height: auto;}
footer .footerSNSBtn ul {justify-content: space-evenly; margin-top: 3%;}
footer .footerSNSBtn ul li:first-child {margin-left: 0;}
footer .footerSNSBtn p {margin-top:0;}
	
}

@media screen and (max-width: 420px) {
header #headerTelBox { left: -1%; top:0;}
header #headerTelBox .txt { font-size: 2.2vw; line-height: 1.6; font-weight: bold; margin-bottom: 1px;}
header #headerTelBox .tel { font-size: 3.5vw; font-weight: bold;line-height: 1.0;}
header #headerTelBox .tel img { display: none;}
header #headerTelBox .time { font-size: 1.8vw; margin-top: 1px; text-align: left; line-height: 1.5;}
}
