@charset "utf-8";

@import url(//fonts.googleapis.com/css?family=Open+Sans:400,400italic,600,600italic,700,700italic);

/* =Reset default browser CSS.
Based on work by Eric Meyer: http://meyerweb.com/eric/tools/css/reset/index.html
-------------------------------------------------------------- */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	border: 0;
	font-family: inherit;
	font-size: 100%;
	font-style: inherit;
	font-weight: inherit;
	margin: 0;
	outline: 0;
	padding: 0;
	vertical-align: baseline;
}

:focus {
	outline: 0;
}

ol, ul {
	list-style: none;
}

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

caption, th, td {
	font-weight: normal;
	text-align: left;
}

blockquote:before, blockquote:after,q:before, q:after {
	content: "";
}

blockquote, q {
	quotes: "" "";
}

a img {
	border: 0;
}

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

html {
    min-height: 100%;
    position: relative;
}

body {
	font-size: 13px;
	font-family: -apple-system, BlinkMacSystemFont, 'Helvetica Neue', 'Hiragino Sans', 'Hiragino Kaku Gothic ProN', '游ゴシック  Medium', meiryo, sans-serif;
    margin-bottom: 3em;
}

footer {
    bottom: 0;
    height: 3em;
    position: absolute;
    width: 100%;
}

/* リンク設定
------------------------------------------------------------*/
a {
	margin: 0;
	padding: 0;
	text-decoration: none;
	outline: 0;
	vertical-align: baseline;
	background: transparent;
	font-size: 100%;
	color: #624e24;
}

a:hover, a:active {
	-webkit-transition: opacity 1s;
	-moz-transition: opacity 1s;
	-o-transition: opacity 1s;
	outline: none;
	color: #927a49;
}


/**** Clearfix ****/
.nav .panel:before,nav .panel:after, nav#mainNav:before,nav#mainNav:after, .newsTitle:before,.newsTitle:after {
	content: "";
	display: table;
}

nav .panel:after,nav#mainNav:after,.newsTitle:after {
	clear: both;
}

nav .panel,nav#mainNav,.newsTitle {
	zoom: 1;
}


/* フォーム
------------------------------------------------------------*/
label {
	font-size: 70%;
	display: block;
}

input[type="text"], input[type="tel"], input[type="password"], textarea {
	vertical-align: middle;
	line-height: 30px;
	height: 30px;
	padding: 1px 5px;
	border: 1px solid #d4d4d7;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	font-size: 100%;
	color: #555;
	background: #fcfcfc;
}

textarea {
	height: auto;
	line-height: 1.5;
}

input[type="submit"],input[type="reset"],input[type="button"] {
	padding: 3px 10px;
	background: #4f4d4d;
	background: -moz-linear-gradient(top, #4f4d4d 0%, #2e2c2c 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#4f4d4d), color-stop(100%,#2e2c2c));
	background: -webkit-linear-gradient(top, #4f4d4d 0%,#2e2c2c 100%);
	background: -o-linear-gradient(top, #4f4d4d 0%,#2e2c2c 100%);
	background: -ms-linear-gradient(top, #4f4d4d 0%,#2e2c2c 100%);
	background: linear-gradient(to bottom, #4f4d4d 0%,#2e2c2c 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#4f4d4d', endColorstr='#2e2c2c',GradientType=0 );
	border: 0;
	border-radius: 3px;
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	line-height: 1.5;
	font-size: 100%;
	color: #fff;
}

input[type="submit"]:hover,input[type="reset"]:hover,input[type="button"]:hover {
	background: #4f4d4d;
	background: -moz-linear-gradient(top, #2e2c2c 0%, #4f4d4d 100%);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#2e2c2c), color-stop(100%,#4f4d4d));
	background: -webkit-linear-gradient(top, #2e2c2c 0%,#4f4d4d 100%);
	background: -o-linear-gradient(top, #2e2c2c 0%,#4f4d4d 100%);
	background: -ms-linear-gradient(top, #2e2c2c 0%,#4f4d4d 100%);
	background: linear-gradient(to bottom, #2e2c2c 0%,#4f4d4d 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2e2c2c', endColorstr='#4f4d4d',GradientType=0 );
}

*:first-child+html input[type="submit"] {
	padding: 3px;
}


/* レイアウト
------------------------------------------------------------*/
#header {
	overflow: hidden;
}

#content {
	padding: 0 15px;
}

#sidebar {
	float: left;
	width: 265px;
	padding: 30px 0;
}

#footer {
	clear: both;
	padding-top: 20px;
	border-top: 1px solid #ccc;
}


/* ヘッダー
*****************************************************/

/* サイト説明文
----------------------------------*/
#header h1 {
	padding: 10px 0 0 3px;
	color: #b6a68a;
	font-size: 90%;
	font-weight: normal;
}


/* ロゴ (サイトタイトル)
----------------------------------*/
#header h2 {
	clear: both;
	float: left;
	color: #b6a68a;
	font-size: 160%;
	font-weight: bold;
}


/* コンタクトインフォメーション
----------------------------------*/
#headerInfo {
	float: right;
	text-align: left;
}

#headerInfo p {
	color: #b6a68a;
	font-size: 12px;
	font-weight: bold;
}

#headerInfo p.tel {
	background: url(../images/tel.png) no-repeat 0 4px;
	font-size: 16px;
}

#headerInfo p.address {
	background-image: url(../images/address.png);
}


/* トップページ　メイン画像
----------------------------------*/
#mainImg {
	line-height: 0;
	text-align: center;
	background: #242223;
	z-index: 0;
}


/* タイポグラフィ
*****************************************************/
h2.title {
	clear: both;
	margin: 30px 0 20px;
	padding: 5px 0;
	font-size: 110%;
	color: #252525;
	border-bottom: 3px solid #3c2f13;
}

h2.first {
	margin-top: 0;
}

.dateLabel {
	margin: -10px 0 10px;
	text-align: right;
	font: italic 1em "Palatino Linotype", "Book Antiqua", Palatino, serif;
}

.post p {
	padding-bottom: 15px;
}

.post ul {
	margin: 0 0 10px 10px;
}

.post ul li {
	margin-bottom: 5px;
	padding-left: 15px;
	background: url(../images/bullet.png) no-repeat 0 8px;
}

.post ol {
	margin: 0 0 10px 30px;
}

.post ol li {
	list-style: decimal;
}

.post h1 {
	margin: 20px 0;
	padding: 5px 0;
	font-size: 150%;
	color: #252525;
	border-bottom: 3px solid #3c2f13;
}

.post h2 {
	margin: 10px 0;
	padding-bottom: 2px;
	font-size: 130%;
	font-weight: normal;
	color: #252525;
	border-bottom: 2px solid #3c2f13;
}

.post h3 {
	margin: 10px 0;
	font-size: 120%;
	font-weight: normal;
	color: #2e2c2c;
	border-bottom: 1px solid #3c2f13;
}

.post blockquote {
	clear: both;
	padding: 10px 0 10px 15px;
	margin: 10px 0 25px 30px;
	border-left: 5px solid #ccc;
}

.post blockquote p {
	padding: 5px 0;
}

.post table {
	border: 1px #2e2c2c solid;
	border-collapse: collapse;
	border-spacing: 0;
	margin: 10px 0 20px;
}

.post table th {
	padding: 7px 10px 7px 5px;
	border: #2e2c2c solid;
	border-width: 0 0 1px 1px;
	font-weight: bold;
	color: #fff;
	background: #4f4d4d;
}

.post table td {
	padding: 7px 5px;
	border: 1px #2e2c2c solid;
	border-width: 0 0 1px 1px;
	background: #fff;
}

.post dt {
	font-weight: bold;
}

.post dd {
	padding-bottom: 10px;
}

.post img {
	max-width: 100%;
	height: auto;
}

img.aligncenter {
	display: block;
	margin: 5px auto;
}

img.alignright, img.alignleft {
	padding: 4px;
	margin: 0 0 2px 7px;
	display: inline;
}

img.alignleft {
	margin: 0 7px 2px 0;
}

.alignright {
	float: right;
}

.alignleft {
	float: left;
}



/* サイドバー　ウィジェット
*****************************************************/
section.widget {
	padding-bottom: 20px;
	margin-bottom: 20px;
}

section.widget h3 {
	clear: both;
	margin: 0 0 10px;
	padding: 5px 0;
	font-size: 100%;
	font-weight: normal;
	color: #252525;
	border-bottom: 3px solid #3c2f13;
}

section.widget li {
	margin: 0 10px 10px 5px;
	border-bottom: 1px solid #bab48d;
}

section.widget a {
	display: block;
	padding-left: 15px;
	background: url(../images/arrow.png) no-repeat 0 50%;
}

section.widget a:hover {
	background-position: 3px 50%;
}

p.banner {
	padding-bottom: 15px;
}

#contactBanner {
	width: 265px;
	height: 30px;
	padding-top: 110px;
	background: url(../images/banners/banner_tel.jpg) no-repeat;
}

#contactBanner p.tel {
	display: inline;
	padding-left: 80px;
	margin-left: 30px;
	text-align: center;
	font-weight: bold;
	background: url(../images/tel.png) no-repeat;
}

#searchform input[type="text"] {
	line-height: 1.7;
	height: 24px;
	vertical-align: bottom;
}


/* 更新情報
-------------*/
.newsTitle {
	clear: both;
	margin: 15px 0 20px;
	padding: 5px 0;
	font-size: 100%;
	color: #252525;
	border-bottom: 3px solid #3c2f13;
}

.newsTitle h3 {
	float: left;
	font-weight: normal;
}

.newsTitle p {
	float: right;
	padding: 0 0 0 10px;
	font-size: .8em;
	background: url(../images/arrow.png) no-repeat 0 50%;
}

.news {
	padding-bottom: 40px;
}

.news p {
	clear: both;
	padding-bottom: 2px;
	border-bottom: 1px solid #bab48d;
}

.news p a {
	display: block;
	padding: 5px 0;
	color: #252525;
	font-style: italic;
	font: italic 110% "Palatino Linotype", "Book Antiqua", Palatino, serif;
}

.news a span {
	color: #624e24;
	font: normal 90% Arial, 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','ＭＳ Ｐゴシック',sans-serif;
}

.news span {
	padding-left: 10px;
}

.news a:hover span {
	color: #927a49;
}



/* フッター
*****************************************************/
#footerLogo {
	float: left;
	width: 265px;
}

#footerLogo img {
	max-width: 265px;
	height: auto;
}

#footer ul {
	float: right;
	width: 625px;
	font-size: 95%;
	padding-bottom: 20px;
}

#footer ul ul {
	padding-bottom: 0;
	width: auto;
}

#footer ul li {
	display: inline-block;
	vertical-align: text-top;
	text-align: left;
	padding: 5px 0;
	margin-left: 15px;
	background: url(../images/arrow.png) no-repeat 0 9px;
}

#footer ul li	a {
	display: block;
	padding: 0 0 0 12px;
	overflow: hidden;
}

#footer ul li	a:hover {
	text-decoration: underline;
}

#footer ul li li {
	display: block;
	padding: 0;
	margin-left: 5px;
	background: url(../images/arrow2.png) no-repeat 0 6px;
}

#footer ul li	li a {
	padding: 0 0 0 8px;
}

*:first-child+html #footer ul li {
	display: inline;
}

*:first-child+html #footer ul ul,*:first-child+html #footer ul li li a,*:first-child+html #footer ul li li {
	display: none;
}

#copyright {
	clear: both;
	padding: 5px;
	text-align: center;
	font-style: normal;
	font-size: 85%;
	zoom: 1;
}


/* page navigation
------------------------------------------------------------*/
.pagenav {
	clear: both;
	width: 100%;
	height: 30px;
	margin: 5px 0 20px;
}

.prev {
	float: left;
}

.next {
	float: right;
}

#pageLinks {
	clear: both;
	color: #4f4d4d;
	text-align: center;
}


/* トップページ 最新記事3件 + お勧め商品
------------------------------------------------------------*/
.thumbWrap {
	width: 100%;
}

.thumbWrap li {
	float: left;
	width: 400px;
	margin: 0 5px 0 0;
	padding: 2px 0 40px;
	background: none;
}


/* 最新記事リンク */
ul.thumb h3 {
	margin-top: 10px;
	padding: 1px;
	font-weight: normal;
	font-size: 100%;
	text-align: center;
	background: #fff;
	border: 1px solid #bcbcbc;
}

ul.thumb h3 span {
	display: block;
	padding: 2px 3px;
	background: #dedabc;
}

ul.thumb h3:hover {
	background: #f1efe4;
}

ul.thumb h3:hover span {
	background: #e3dfc4;
}

.search_box p {
	float: left;
	margin-right: 10px;
}

.drawer-nav {
	z-index: 501 !important;
}

.drawer-overlay {
	z-index: 500 !important;
}

.drawer-hamburger {
	z-index: 501 !important;
}

.htid {
	background-color: black !important;
}

.noTitleDialog .ui-dialog-titlebar {
	display: none;
}

#msgarea {
	display: none;
	min-height: 1.5em;
	margin: 5px 0;
	padding: 5px 20px;
}

.ui-dialog {
	z-index: 9999 !important;
}

.zebraStyle tbody td {
	color: #404040 !important;
}

.zebraStyle > tbody > tr:nth-child(2n+1) > td {
	background: lightgoldenrodyellow;
}

.ui-widget-overlay {
	cursor: wait;
}

.colHeader {
	font-weight: bold !important;
}

.hiddenColumn {
	width: 0px !important;
	display: none;
}

.readonly {
	background-color: whitesmoke !important;
}

.currentCol {
	background-color: yellow !important;
}

.currentRow {
	background-color: yellow !important;
}

input:focus, select:focus, textarea:focus {
	background-color: lightyellow;
}

.ui-datepicker {
	z-index: 1000 !important;
}

.relative {
	position: relative;
	margin: 0;
}

.imgcaption0 {
	position: absolute;
	color: #fff;
	width: 100%;
	height: 1em;
	top: -6em;
	bottom: 0;
	margin: auto;
	font-size: 200%;
}

.imgcaption1 {
	position: absolute;
	color: #fff;
	width: 100%;
	height: 1em;
	top: 0;
	bottom: 0;
	margin: auto;
	font-size: 500%;
}

.imgcaption2 {
	position: absolute;
	color: #fff;
	width: 100%;
	height: 1em;
	top: 10em;
	bottom: 0;
	margin: auto;
}

.shopnow {
	cursor: pointer;
	color: white;
	padding: 5px;
	border: 4px double #fff;
}

.shopnow:hover {
	color: black;
	border: 4px double black;
}

@media only screen and (max-width: 644px) {
    .imgcaption0 {
        font-size: 100%;
    }
    .imgcaption1 {
        font-size: 100%;
    }
}

/* 画像ホバーエフェクト
------------------------------------------------------------*/
.imglist figure {
	position: relative;
	overflow: hidden;
	margin: 0;
	padding: 0;
}

.imglist figcaption {
	position: absolute;
	margin: 0;
	padding: 0;
	top: 0;
	left: 0;
	z-index: 2;
	width: 100%;
	height: 300px;
	background: rgba(0,0,0,.6);
	-webkit-transition: .3s;
	transition: .3s;
	opacity: 0;
}

.imglist figcaption h3,
.imglist figcaption p {
	position: absolute;
	left: -100%;
	width: 300px;
	-webkit-transition: .3s;
	transition: .3s;
	color: white;
}

.imglist figcaption h3 {
	top: 40%;
	font-size: 200%;
}

.imglist figcaption p {
	top: 50%;
}

.imglist figure:hover figcaption {
	opacity: 1;
}

.imglist figure:hover figcaption h3,
.imglist figure:hover figcaption p {
	left: 20px;
}

.imglist figure:hover figcaption h3 {
	-webkit-transition-delay: .2s;
	transition-delay: .2s;
}

.imglist figure:hover figcaption p {
	-webkit-transition-delay: .5s;
	transition-delay: .5s;
}

.grid-item {
	width: 300px;
	height: 300px;
}

.grid-item--width2 {
	width: 600px;
}

.grid-item--width3 {
	width: 900px;
}

.grid-item--width4 {
	width: 1200px;
}

.grid-item--height2 {
    height: 600px;
}

.grid-item--height3 {
    height: 900px;
}

.grid-item--height4 {
    height: 1200px;
}

.products-swiper-container {
	width: 300px;
	height: 300px;
	padding: 50px;
}

.products-swiper-slide {
	background-position: center;
	background-size: cover;
	width: 300px;
	height: 300px;
}

/* 上下左右中央揃え */
.flexiblebox {
	display: -webkit-flex;
	display: flex;
	-webkit-align-items: center;
 /* 縦方向中央揃え（Safari用） */
	align-items: center;
 /* 縦方向中央揃え */
	-webkit-justify-content: center;
 /* 横方向中央揃え（Safari用） */
	justify-content: center;
 /* 横方向中央揃え */;
}

.buttons_area button{
    min-width: 110px;
    margin-top: 5px;
    padding: 3px 0;
    font-size: 90%;
}

.ui-dialog-buttonset button{
    min-width: 100px;
}


/* Handsontable */
.handsontable td a{
    color: blue;
    text-decoration: underline;
}
.handsontable{
    font-size: 95% !important;
}
.handsontable .stock_num{
    font-weight: bold;
    color: gray;
}
.handsontable th, .handsontable td{
    line-height: 25px;
}

/* select2 */
.select2-container .select2-selection--single{
    height: 33px !important;
    height: 33px !important;
}
.select2-container--default .select2-selection--single .select2-selection__rendered{
    line-height: 33px !important;
}
.select2-container--default .select2-selection--single .select2-selection__arrow{
    height: 30px !important;
}

/* selectmenu */
.ui-selectmenu-button.ui-button{
    width: initial;
    width: auto;
    height: 22px;
}
.ui-selectmenu-menu{
    z-index: 200;
}

/* pivot */
.pvtAxisLabel{
    text-align: center;
}
.pvtRowLabel, .pvtAxisLabel, .pvtColLabel{
    white-space: nowrap;
}
.pvtAggregator{
    width: 100px;
}
.pvtAttrDropdown{
    width: 150px;
}
.pvtUi {
    display: block;
    overflow: auto;
}
.pvtTable th{
    font-weight: bold;
    vertical-align: middle;
}
.pvtRowLabel{
    vertical-align: text-top !important;
}
.pvtTotal, .pvtGrandTotal{
    background-color: whitesmoke !important;
}

#jan_inputbox{
    ime-mode: disabled;
    text-align: center;
    width: 14em;
}


/* 条件付き書式用
------------------------------------------------------------*/
.confmt_qty_alert{
    background-color: khaki !important;
}

.confmt_stockout_alert{
    background-color: red !important;
    color: white !important;
}


/* 商品情報ダイアログ表示用
------------------------------------------------------------*/
.product_info{
    cursor: pointer;
    text-decoration: underline;
}