@charset "utf-8";

/*
	File Name   : base.css
*/




/*======= general style ===============================================*/
* {
	margin: 0;
	padding: 0;
	font-style: normal;
}

html {
	font-size:14px;
	line-height: 1.5;
	height: 100%;
}

li {
	list-style: none;
}

figure{
	margin:0;
}

a:link {
	color:inherit;
	text-decoration:none;
}

a:visited {
	color:inherit;
}

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	font-size:0;
	clear: both;
	visibility:hidden;
}

@import url(//fonts.googleapis.com/css?family=Roboto+Slab:400,100,300,700);

#header h2,
#header h3,
#footer h2,
#footer h3
{
	font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}



/*======= body ========================================================*/
body {
	color: #222;
	font-family:Avenir , "Open Sans" , "Helvetica Neue" , Helvetica , Arial , Verdana , Roboto , "游ゴシック" , "Yu Gothic" , "游ゴシック体" , "YuGothic" , "ヒラギノ角ゴ Pro W3" , "Hiragino Kaku Gothic Pro" , "Meiryo UI" , "メイリオ" , Meiryo , "ＭＳ Ｐゴシック" , "MS PGothic" , sans-serif;
	font-size: 100%;
	/*background: url(/img/common/bg.png) 0 0 repeat;*/
	height: 100%;
	overflow-y:scroll;
}
.min{
	font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}

/*======= container ===================================================*/

/* 2016/06 edit start
---------------------------------*/
#container {
	width: 100%;
	height: 100%;
	min-height: 100%;
	position: relative;
	background: url(/img/common/bg.png) 0 0 repeat;
}
/* 2016/06 edit end
---------------------------------*/

body > div#container {
	height: auto;
}

/*======= header ========================================================*/

#headersimplel {
	/*height: 86px;*/
    background-color: #fff;
    box-shadow: 0px 5px 6px -5px rgba(0,0,0,0.3);
    box-sizing: border-box;
}

#headersimplel > div {
	/*width: 218px;*/
    margin: 0px auto 0px;
    box-sizing: border-box;
    padding: 16px 0px;
}
@media screen and (min-width: 1010px) {
	#headersimplel > div {
		padding: 16px 50px;
	}
}

#headersimplel > div img {
	/*width:100%;*/
	width: 65px;
}

/* header */

@media screen and (min-width: 1010px) {
	#header > div.header_min {
		padding:0px 50px;
	}
}
/* 6/6以降修正分 ここまで */

#header > div.header_min > div a img {
	width: 65px;
    float: left;
    margin: 10px 15px 0px 0px;
}

#header > div.header_min > div a:nth-of-type(2) {
    float: left;
    margin: 10px 0px 0px 0px;
	/* background:url(/img/common/truck_icon.png) no-repeat top; */
	background:url(/img/common/guide_icon.png) no-repeat top;
	position:relative;
	display:block;
	width: 60px;
	height:53px;	
}

#header > div.header_min > div a:nth-of-type(2) span {
	position:absolute;
	top: 42px;
    left: 0px;
	font-size: 10px;
    font-weight: bold;
	line-height:1em;
}
/* 9/6以降修正分 ここまで */

#header > div.header_min > div a img:hover {
	opacity:0.6;
	-webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

/* 6/6以降修正分 ここから */
#header > div.header_min > div > ul:nth-of-type(1) {
	float:left;
}

#header > div.header_min > div > ul:nth-of-type(1) > li {
	float:left;
	text-align:center;
	font-weight:bold;
	font-size:16px;
	font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
}

#header > div.header_min > div > ul:nth-of-type(1) > li a {
	display:block;
	padding: 0 7px;
}

#header > div.header_min > div > div > ul {
	float:right;
	font-size:10px;
	font-weight:bold;
}

#header > div.header_min > div > div > ul > li {
	width:72px;
	height:75px;
	position:relative;
	float:left;
}

#header > div.header_min > div > div > ul > li a {
	display: block;
    width: 100%;
    height: 100%;
    position: relative;
}

#header > div.header_min > div > div > ul > li:nth-of-type(1) {
	border-left:1px solid #d1d1d1;
}

#header > div.header_min > div > div > ul > li:nth-of-type(1):before {
	content: "";
    background-image: url(/img/common/recipe_ico.png);
    background-repeat: no-repeat;
    background-size: auto 26px;
    top: 18px;
    left: 25px;
    width: 24px;
    height: 26px;
    position: absolute;
}

#header > div.header_min > div > div > ul > li:nth-of-type(1):hover {
	opacity:0.6;
	-webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

#header > div.header_min > div > div > ul > li:nth-of-type(1) > a > span {
	position: absolute;
    bottom: 13px;
    left: 21px;
    line-height:normal;
}

#header > div.header_min > div > div > ul > li:nth-of-type(2) {
	border-left:1px solid #d1d1d1;
}

#header > div.header_min > div > div > ul > li:nth-of-type(2):before {
	content: "";
    background-image: url(/img/common/login_ico.png);
    background-repeat: no-repeat;
    background-size: auto 26px;
    top: 18px;
    left: 25px;
    width: 24px;
    height: 26px;
    position: absolute;
}

#header > div.header_min > div > div > ul > li:nth-of-type(2):hover {
	opacity:0.6;
	-webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

#header > div.header_min > div > div > ul > li:nth-of-type(2) > a > span {
	position: absolute;
    bottom: 13px;
    left: 15px;
    line-height:normal;
}

#header > div.header_min > div > div > ul > li:nth-of-type(3) {
	background-color:#b80000;
	color:#fff;
	position:relative;
}

#header > div.header_min > div > div > ul > li:nth-of-type(3):hover {
	opacity:0.6;
}

#header > div.header_min > div > div > ul > li:nth-of-type(3):before {
	background-image: url(/img/common/cart_ico.png);
    width: 28px;
    height: 23px;
    background-size: auto 23px;
    content: "";
    background-repeat: no-repeat;
    top: 19px;
    left: 18px;
    position: absolute;
}

#header > div.header_min > div > div > ul > li:nth-of-type(3) > a > span:nth-of-type(1) {
	position: absolute;
    bottom: 13px;
    left: 6px;
    line-height: normal;
}

#header > div.header_min > div > div > ul > li:nth-of-type(3) > a > span:nth-of-type(2) {
    top: 12px;
    right: 14px;
    z-index: 5;
    position: absolute;
    line-height: 20px;
    font-size: 12px;
    text-align: center;
    font-weight: initial;
	width: 22px;
    height: 22px;
	background-image:url(/img/main/cart_back.png)
}

#header .header_min_right {
	float:right;
}

#mypage_btn:before {
	content: "";
    background-image:url(/img/common/mypage_btn.png);
    background-repeat: no-repeat;
    background-size: 21px;
    top: 21px;
    left: 25px;
    width: 21px;
    height: 21px;
    position: absolute;
}

#mypage_btn:hover {
	cursor:pointer;
}

#mypage_btn span {
	left:10px;
}

#mypagep_box {
	position: fixed;
    top: 74px;
    right: 20px;
    background-color: #fff;
    width: 430px;
    z-index: 9900;
    border: 1px solid #cccccc;
    box-sizing: border-box;
	padding:19px;
	display:none;
}

#mypagep_box:before , #mypagep_box:after {
	position: absolute;
    right: 117px;
    top: -39px;
    border: solid transparent;
    content: '';
    height: 0;
    width: 0;
    border-width: 19px;
}

#mypagep_box:after {
	border-bottom-color: #FFFFFF;
    margin: 1px 0 0 -14px;
}

#mypagep_box:before {
    border-bottom-color: #cccccc;
    margin-left: -14px;
}

#mypagep_box > ul:nth-of-type(1) {
	margin: 0px auto 20px;
    width: 272px;
}

#mypagep_box > ul:nth-of-type(1) li {
	float:left;
	width:130px;
	height:36px;
	line-height:36px;
	text-align:center;
	color:#fff;
	background-color:#555555;
	margin:0px 12px 0px 0px;
}

#mypagep_box > ul:nth-of-type(1) li:last-child {
	margin:0px;
}

#mypagep_box > ul:nth-of-type(1) li a {
	display:block;
}

#mypagep_box > ul:nth-of-type(1) li a:hover {
	text-decoration:none;
}

#mypagep_box > ul:nth-of-type(1) li:hover {
	opacity: 0.6;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

#mypagep_box > ul:nth-of-type(2) {
	border:2px solid #555;
	margin:0px auto 0px;
	box-sizing:border-box;
}

#mypagep_box > ul:nth-of-type(2) li {
	float:left;
	box-sizing:border-box;
	width:33.3%;
	text-align:center;
	height:53px;
	line-height:53px;
	border-right:2px solid #555;
}

#mypagep_box > ul:nth-of-type(2) li:last-child {
	border:none;
}

#mypagep_box > ul:nth-of-type(2) li:nth-of-type(2) , #mypagep_box > ul:nth-of-type(2) li:nth-of-type(3) {
	line-height:1.3;
	padding: 9px 0px 0px;
}

#mypagep_box > ul:nth-of-type(2) li a {
	display:block;
}

#mypagep_box .mypagepbnr_box img:hover {
	opacity: 0.6;
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
}

#mypagep_box #mypageclose_btn {
	position:absolute;
	top: -14px;
    right: -14px;
}

#mypagep_box #mypageclose_btn:hover {
	cursor:pointer;
}

#header > div.header_min > div > form {
	margin:16px 0px;
}

#header > div.header_min > div > form > input[type="text"] {
	width:168px;
}


/*======= contents ====================================================*/


#contents {
	width: 950px;
	margin: 0 auto;
	padding: 20px 15px;
	position: relative;
}


/*======= footer ======================================================*/

.fottertop_box {
	background-image:url(/img/common/footer_back.png);
	background-position:top center;
	color:#fff;
	height:125px;
}

.fottertop_box p {
	font-family:"Roboto Slab" , Garamond , "Times New Roman" , "游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	float:left;
	font-size:22px;
	margin:40px 0px 0px 0px;
}

.fottertop_box  > div {
	width:950px;
	margin:0px auto;
}

.fottertop_box  > div > div {
	float:right;
}

.fottertop_box  > div > div > div {
	float: left;
    border-top: 1px solid #fff;
    margin: 37px 15px 0px 0px;
    border-bottom: 1px solid #fff;
    padding: 14px 0px;
}

.fottertop_box  > div > div > ul {
	float:left;
    margin: 33px 0px 0px 0px;
}

.fottertop_box > div > div > ul > li:nth-of-type(1) {
	font-size:40px;
	font-family:"游明朝" , "Yu Mincho" , "游明朝体" , "YuMincho" , "ヒラギノ明朝 Pro W3" , "Hiragino Mincho Pro" , "HiraMinProN-W3" , "HGS明朝E" , "ＭＳ Ｐ明朝" , "MS PMincho" , serif;
	line-height: 1.0;
	font-weight:bold;
}

.fottertop_box  > div > div > ul > li:nth-of-type(2) {
	font-size:10px;
}

.footer_bottom {
	height:60px;
	line-height:60px;
	background-color:#fff;
}

.footer_bottom ul {
	width:950px;
	margin:0px auto ;
}

.footer_bottom ul li {
	float:left;
}



.footer_bottom ul img {
	width:163px;
	float:left;
	vertical-align:middle;
	margin: 20px 25px 0px 0px;
}

/* mxslider */

.recentcheck_box {
	background-color:#fff;
}

.recentcheck_box > div {
	width: 940px;
    margin: 0px auto 0px;
    padding: 40px 0px 35px 0px;
}

.recentcheck_box > div > div {
	margin:0px 0px 20px;
}

.recentcheck_box > div > div > h2 {
	float:left;
}

.recentcheck_box > div > div > a {
	float:right;
	position:relative;
	padding:6px 0px 0px 25px;
}

.recentcheck_box > div > div > a:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 77px;
    background-image: url(/img/common/co_ico.png);
    background-repeat: no-repeat;
    background-size: 16px;
    margin: -8px 0px 0px 0px;
    width: 16px;
    height: 16px;
}

.recentcheck_box > div > ul > li {
	float:left;
	width:86px;
	margin:0px 20.7px 0px 0px;
	box-sizing:border-box;
}

.recentcheck_box > div > ul > li:last-child {
	margin:0px;
}

.recentcheck_box > div > ul > li img {
	width:100%;
}

.recentcheck_box > div > ul > li img:hover {
    -webkit-transition: all .3s ease-out;
    transition: all .3s ease-out;
    opacity: 0.6;
}

.recentcheck_box h2 {
}

.recentcheck_box > div > div > div > ul > li > a:hover img {
}

.mxslider {
	position:relative;
}

.mxslider > div > ul {
    width: 1415%;
    position: relative;
    right: 0px;
}

.mxslider > div > ul > li {
	float:left;
	margin:0px 20px 0px 0px;
	width:160px;
}

.mxslider > div > ul > li > a > ul > li:nth-of-type(3) {
	color:#b60000;
}

.mxslider_sub > div > ul > li {
	margin:0px;
}

.mxslider > div > ul > li img {
	width:100%;
}

.mxslider_in {
	overflow:hidden;
}

.mxnext {
	position: absolute;
    top: 60px;
    right: -55px;
    background: url(/sp/img/common/next_ico.png) no-repeat;
    background-size: 40px;
    width: 40px;
    height: 40px;
    text-indent: -9999px;
    z-index: 999;
}

.mxslider_sub .mxnext {
	top: 50%;
    margin: -20px 0px 0px 0px;
    right: 0px;
    background: url(/sp/img/common/sliderright_btn.png) no-repeat;
    width: 40px;
    background-size: 40px;
}

.mxprev {
	position: absolute;
    top: 60px;
    left: -55px;
    display: none;
    background: url(/sp/img/common/prev_ico.png) no-repeat;
    background-size: 40px;
    width: 40px;
    height: 40px;
    text-indent: -9999px;
    z-index: 999;
}

.mxslider_sub .mxprev {
	top: 50%;
    margin: -20px 0px 0px 0px;
    left: 0px;
    background: url(/sp/img/common/sliderleft_btn.png) no-repeat;
    width: 40px;
    background-size: 40px;
}

.mxallpre {
    position: absolute;
    top: 60px;
    right: -55px;
    display: none;
    background: url(/sp/img/common/allback_ico.png) no-repeat;
    background-size: 40px;
    width: 40px;
    height: 40px;
    text-indent: -9999px;
    z-index: 999;
}

.mxslider_sub .mxallpre {
	top: 50%;
    margin: -20px 0px 0px 0px;
    right: 0px;
    background: url(/sp/img/common/sliderlall_btn.png) no-repeat;
    width: 40px;
    background-size: 40px;
}

.navul {
	position:absolute;
	bottom:10px;
	left:50%;
	z-index:9800;
}

.navul li {
	float: left;
    border-radius: 50%;
    width: 10px;
    height: 10px;
    background-color: #4e4d4d;
    text-indent: -9999px;
    margin: 0px 5px 0px 0px;
}

.navul li.onc {
	background-color:#fff;
}

/* pagetop */
#pagetop {
	position: fixed;
    bottom: -100px;
    right: 15px;
    -webkit-transition: all .5s ease-out;
    transition: all .5s ease-out;
}

/*--------------------------------------------------
		!important
--------------------------------------------------*/
/*-- margin --*/
.mrgT0{margin-top: 0 !important;}
.mrgT5{margin-top: 5px !important;}
.mrgT10{margin-top: 10px !important;}
.mrgT15{margin-top: 15px !important;}
.mrgT20{margin-top: 20px !important;}
.mrgT25{margin-top: 25px !important;}
.mrgT30{margin-top: 30px !important;}
.mrgT75{margin-top: 75px !important;}

.mrgR0{margin-right: 0 !important;}
.mrgR5{margin-right: 5px !important;}
.mrgR10{margin-right: 10px !important;}
.mrgR15{margin-right: 15px !important;}
.mrgR20{margin-right: 20px !important;}
.mrgR25{margin-right: 25px !important;}
.mrgR30{margin-right: 30px !important;}

.mrgB0{margin-bottom: 0 !important;}
.mrgB5{margin-bottom: 5px !important;}
.mrgB10{margin-bottom: 10px !important;}
.mrgB15{margin-bottom: 15px !important;}
.mrgB20{margin-bottom: 20px !important;}
.mrgB25{margin-bottom: 25px !important;}
.mrgB30{margin-bottom: 30px !important;}
.mrgB40{margin-bottom: 40px !important;}
.mrgB50{margin-bottom: 50px !important;}
.mrgB60{margin-bottom: 60px !important;}
.mrgB80{margin-bottom: 80px !important;}

.mrgL5{margin-left: 5px !important;}
.mrgL10{margin-left: 10px !important;}
.mrgL15{margin-left: 15px !important;}
.mrgL20{margin-left: 20px !important;}
.mrgL23{margin-left: 23px !important;}
.mrgL25{margin-left: 25px !important;}
.mrgL30{margin-left: 30px !important;}
.mrgL30{margin-left: 30px !important;}

.mrgB_50{margin-bottom: -50px !important;}
.mrgT_50{margin-top: -50px !important;}

/*-- padding --*/
.pad10 {padding: 20px!important;}
.pad20 {padding: 20px!important;}

.naiblink {
	margin-top: -80px !important;
	padding-top: 80px !important;
}

.colorBlack {color: #000000 !important;}
.colorRed {color: #FF0000 !important;}
.colorWhite {color: #FFFFFF !important;}

.bgColorFff {background-color:#FFF !important;}