@charset "utf-8";
/*
=======================================
	Reset CSS
=======================================
*/
html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
abbr, address, cite, code,
del, dfn, em, img, ins, kbd, q, samp,
small, strong, sub, sup, var,
b, i,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, figcaption, figure, 
footer, header, main, menu, nav, section, summary,
time, mark, audio, video{
	margin:0;
	padding:0;
}

article,aside,details,figcaption,figure,
footer,header,main,menu,nav,section{
	display:block;
}

html{
	-webkit-text-size-adjust: 100%;
}

body{
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", HelveticaNeue, "Segoe UI", "游ゴシック体", YuGothic, "Yu Gothic M", "游ゴシック Medium", "Yu Gothic Medium", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN W3", HiraKakuProN-W3, "ヒラギノ角ゴ ProN", "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	background: #FFFFE0;
	-webkit-animation: fadeIn 2s ease 0s 1 normal;
	letter-spacing: 3px;
}

@keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}

@-webkit-keyframes fadeIn {
    0% {opacity: 0}
    100% {opacity: 1}
}


img{
	border: 0;
	max-width: 100%;
	height: auto;
}

ul,ol{
	list-style-type: none;
}

table {
	border-collapse: collapse; 
	border-spacing: 0;
}

img, input, select, textarea { 
	vertical-align: middle;
}

a{
	text-decoration:none;
	transition : all 0.5s linear 0s;
	}

a:hover img{
	opacity:0.8;}


/*
=========================================
	Base Layout
=========================================
*/
/*ALL and Smart Phone*/

.cd-container{
	max-width:940px;
	padding-left: 10px;
	padding-right: 10px;
	margin: 0 auto;
}

.cd-container:after{
	content:"";
	display: block;
	clear:both;
	}

/*スマホ用のcssを記述*/

/* スライドショー */

	.bxslider4 .bxslider {
		max-width: 1000px;
		width: 100%;
		margin: 0 auto;
	}
	.bxslider4 ul li img {
		width: 100%;
		height: auto;
	}
	.bxslider4 .bxslider_caption {
		opacity: 0;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		background: rgba(0,0,0,0.8);
		color: #fff;
	}
	.bxslider4 .bxslider_caption > div {
		padding: 10px;
		font-size:0.8em;
	}
	.bxslider4 .bxslider_caption h4 {
		font-size: 1.1em;
		font-weight: bold;
	}

ul#menu {
	width:100%; height:100%; 	/*メインメニュー部分の幅と高さ*/
	text-align:center;
	margin:0 auto;
	margin-bottom:32px;
	}

#menu li {
	list-style-type:none;		/*リストマーカー無しにする*/
	display:inline;			/*リスト項目をインライン表示にする*/
}
#menu li a {
	color:#ffffff;			/*文字色*/
	font-family:'Yu Gothic','YuGothic';
	font-size:1.5em;
	display:block;			/*リンク部分をブロック表示にする*/
	width:100%; height:60px;	/*幅と高さ*/
	text-align:center;		/*テキストをセンター揃えにする*/
	text-decoration:none;		/*リンク部分を下線無しにする*/
	line-height:60px;
	font-weight:bold;
	}

#menu .kitchen a{
	background:url(item/cap_A.jpg) no-repeat;
	background-size:100%;
	}

#menu .stationary a{
	background:url(item/magnet_03..jpg) no-repeat;
	background-size:100%;
	}

#menu .goods a{
	background:url(item/candle_01.jpg) no-repeat;
	background-size:100%;
	}

#menu li a:hover {
	opacity:0.6;}

#menu li a{
	background:#708090;}


/*ドロップダウンメニューここまで*/

h2{
text-indent:100%;
white-space:nowrap;
overflow:hidden;
}

#header{
	margin:0 auto;
	text-align: center;
	}

#first_comment{
	margin:0 auto;
	text-align: center;
	}

#info p{
	margin-bottom:10px;}

#info img{
	margin-top:20px;
	margin-bottom:20px;
	}

#googlemap{
	margin:0 auto;}

#last_comment{
	margin-top:50px;
	text-align:center;
	}

#footer{
	clear: both;
	margin-top:50px;
	}

#footer_menu{
	position: fixed;
	right:0;
	bottom:0;
	}

#footer_menu img{
	max-width:100px;}

#logo_bottom{
	padding:0;
	margin-bottom:30px;
	text-align:center;
	}

#copyright{
	font-size: 1.1em;
	text-align:center;
	}

/*商品一覧アイテムリスト*/
ul{
	overflow:hidden;
	text-align:center;
	margin:0 auto;
	}

.itemlist {
margin: 0 auto;
}

.itemlist li {
padding: 10px 10px 15px 10px ;
}
.itemlist dl,
.itemlist dd {
margin: 0;
}
.itemlist dl {
text-align: right;
}
.itemlist dt,
.itemlist .txt {
text-align: left;
	font-family:'Yu Gothic','YuGothic';
}
.itemlist dt {
font-size: 1.5em;
font-weight: 700;
}
.itemlist dd {
margin-top: .2em;
font-size: 1em;
padding-top:10px 10px 20px 10px;
}
.itemlist img {
width: 100%;
height: auto;
max-width:100%;
height:auto;
}
.itemlist{
	list-style:none;
	}

.itemlist li img{
	width:400px;
	height:320px;}

@media screen and (max-width: 800px) {
.itemlist li { width: 50%; }
}
@media screen and (max-width: 400px) {
.itemlist li { width: auto; }
}

.itemlist{
	text-align:center;}

dt span{
	font-size: 0.5em;/*フォントサイズ*/
	color:#cc0066;}


.ribbon {
    display: inline-block;
    position: relative;
    height: 60px;
    width:100%;
    line-height: 60px;
    vertical-align: middle;
    text-align: center;
    padding: 0;
    font-size: 1.5em;/*フォントサイズ*/
    background: #62c1ce;/*背景色*/
    color: #FFF;/*文字色*/
    box-sizing: border-box;
}

.ribbon h3 {
    vertical-align: middle;
    margin:auto 0;
    border-top: dashed 1px #FFF;/*上の破線*/
    border-bottom: dashed 1px #FFF;/*下の破線*/
    line-height: 46px;
}

.ribbon:before, .ribbon:after{
  position: absolute;
  content: '';
  width: 0px;
  height: 0px;
  z-index: 2;
}

.ribbon:before{/*左端の山形*/
  top: 0;
  left: 0;
  border-width: 30px 0px 30px 15px;
  border-color: transparent transparent transparent #FFFFE0;
  border-style: solid;
}

.ribbon:after{/*右端の山形*/
  top: 0;
  right: 0;
  border-width: 30px 15px 30px 0px;
  border-color: transparent #FFFFE0 transparent transparent;
  border-style: solid;
}


.checkpoint {
    position: relative;
    margin: 2em 0;
    padding: 0.5em 1em;
    border: solid 3px #62c1ce;
    width:100%;
    
}
.checkpoint .box-title {
    position: absolute;
    display: inline-block;
    top: -27px;
    left: -3px;
    padding: 0 9px;
    height: 25px;
    line-height: 25px;
    vertical-align: middle;
    font-size: 17px;
    background: #62c1ce;
    color: #ffffff;
    font-weight: bold;
    border-radius: 5px 5px 0 0;
}
.checkpoint p {
    margin: 0; 
    padding: 0;
    text-align:left;
    font-size: 0.9em;

}