@charset "utf-8";
/* CSS Document */

body{
	background:url(../img/fabric-1-light.jpg) #F0EDE8 fixed; 
	margin:0; 
	padding:0;
	font-family: "Times New Roman", ten-mincho, "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "メイリオ", Meiryo, serif;
	font-weight: 400;
	font-style: normal;
	padding-top: 50px;	
}
a{
	color:#993e0c;	
	text-decoration:none;
}
a:link{
	color:#993e0c;
	text-decoration:none;
}
a:visited{
	color:#7e6b5a;
	text-decoration:none;
}
a:hover{
	color:#d35331;
	text-decoration:none;
}  
hr{
	border:none;
}

.pc { display: block !important; }
.sp { display: none !important; }

/*ふわっと*/
#loader-bg {
    background:url(../img/fabric-1-light.jpg) #F0EDE8 fixed; 
    height: 100%;
    width: 100%;
    position: fixed;
    top: 0px;
    left: 0px;
    z-index: 10000;
}
#loader-bg img {	
    position: fixed;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    z-index: 10000 !important; ;
}
.leftt{float:left;}
.rightt{float:right;}

/*---------構　造---------*/
.container{
	background-color:#ffffff;
}
nav .container{
	background:none;
}
.container-header{
	background: url(../img/header1.jpg) center top no-repeat #faf2e3;
	background-size: cover;
}
/*---------ナビ---------*/
/*ナビ色一括変換*/
.navbar-default {
  background-color: #211613;
  border-color: #211613;
}
.navbar-default .navbar-brand {
  color: #dbdbdb;
}
.navbar-default .navbar-brand:hover,
.navbar-default .navbar-brand:focus {
  color: #ffffff;
}
.navbar-default .navbar-text {
  color: #dbdbdb;
}
.navbar-default .navbar-nav > li > a {
  color: #dbdbdb;
}
.navbar-default .navbar-nav > li > a:hover,
.navbar-default .navbar-nav > li > a:focus {
  color: #ffffff;
  background-color: #4f1b1d;
}
.navbar-default .navbar-nav > li > .dropdown-menu {
  background-color: #211613;
  border-top:1px solid #211613;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > a {
  color: #dbdbdb;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav > li > .dropdown-menu > li > a:focus {
  color: #ffffff;
  background-color: #4f1b1d;
}
.navbar-default .navbar-nav > li > .dropdown-menu > li.divider {
  background-color: #4f1b1d;
}
.navbar-default .navbar-nav .open .dropdown-menu > .active > a,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
  color: #ffffff;
  background-color: #4f1b1d;
}
.navbar-default .navbar-nav > .active > a,
.navbar-default .navbar-nav > .active > a:hover,
.navbar-default .navbar-nav > .active > a:focus {
  color: #ffffff;
  background-color: #4f1b1d;
}
.navbar-default .navbar-nav > .open > a,
.navbar-default .navbar-nav > .open > a:hover,
.navbar-default .navbar-nav > .open > a:focus {
  color: #ffffff;
  background-color: #4f1b1d;
}
.navbar-default .navbar-toggle {
  border-color: #4f1b1d;
}
.navbar-default .navbar-toggle:hover,
.navbar-default .navbar-toggle:focus {
  background-color: #4f1b1d;
}
.navbar-default .navbar-toggle .icon-bar {
  background-color: #dbdbdb;
}
.navbar-default .navbar-collapse,
.navbar-default .navbar-form {
  border-color: #dbdbdb;
  border-color: #211613;
}
.navbar-default .navbar-link {
  color: #dbdbdb;
}
.navbar-default .navbar-link:hover {
  color: #ffffff;
  background-color: #4f1b1d;
}

@media (max-width: 767px) {
.navbar-default .navbar-nav .open .dropdown-menu > li > a {
color: #dbdbdb;
}
.navbar-default .navbar-nav .open .dropdown-menu > li > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > li > a:focus {
color: #ffffff;
background-color: #4f1b1d;
}
.navbar-default .navbar-nav .open .dropdown-menu > .active > a,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:hover,
.navbar-default .navbar-nav .open .dropdown-menu > .active > a:focus {
color: #ffffff;
background-color: #4f1b1d;
}

/* navbar ハンバーガー四角枠 */
.navbar-default .navbar-toggle {
background-color: #4f1b1d;

}
/* navbar ハンバーガー三本線 */
.navbar-default .navbar-toggle .icon-bar {
background-color: #ffffff;
}
  
  
}
/*ナビ色一括変換ここまで*/


.navbar li{
	letter-spacing:0.2em;
}

.dropdown-menu li {
	opacity:0.7;
}

.dropdown-menu li a{
	display:block;
	font-size:16px;
	line-height:40px;
	height:40px;
}
@media only screen and (min-width : 768px) {
    /* デスクトップ表示ではホバー操作でドロップダウンを表示 */
    .dropdown:hover .dropdown-menu {
        display: block;
    }
}

/*ナビバー両脇トル*/

.navbar-default {
  border: none;
}
.navbar-default .navbar-collapse {
  background-color: #211613;
  padding-right: 40px;
}
@media (min-width: 768px) {
  .navbar-default {
    background-color: transparent;!important
  }
}


.navbar-brand{
	padding-left:40px;
}
.navbar-default .navbar-toggle {
	margin-right:40px;

}
/* navbar ハンバーガー三本線 */
.navbar-default .navbar-toggle .icon-bar {

}
@media only screen and (max-width : 767px) {
.dropdown-menu{
	padding-left:1em;
}
.nav{
	padding-left:3em;
	padding-right:1.5em;
}
}

 /*ナビバー両脇トルここまで*/
 




/* navbar for iPad (bootstrap) */
@media (max-width: 991px) {
	
.navbar-default .navbar-nav > li > a,
.dropdown:hover .dropdown-menu a  {
  font-size:11px;
  letter-spacing:0em;
}
.navbar-header img{
	width:60%;
}
	
}


  
/*---------トップ---------*/
.news{
	margin-top:4.5em;
	margin-bottom:4.5em;
}
.news-field{
	padding:5px 10px 10px 30px;
	padding:5px 30px 10px 30px;
}


.top_products_l{
	padding-top:10em;
	margin-bottom:4em;
}
.top_products_l .top_cate_title{
	padding-right:15%;
}
.top_products_r .top_cate_title{
	padding-left:15%;
}

.top_cate_title{	
	padding-bottom:0.5em;
	border-bottom:1px solid #000;
}
.top_teshigoto{
	margin-top:5%;
	margin-bottom:8%;
} 


/*---------トップの中の新着---------*/

/* clearfix */
.clearfix:after { content:"."; display:block; clear:both; height:0; visibility:hidden; }
.clearfix { display:inline-block; }

/* for macIE \*/
* html .clearfix { height:1%; }
.clearfix { display:block; }

ul#newsList{
	margin:0 0 15px;
	padding:0;
}
ul#newsList li{
	color:#666;
	font-size:12px;
	margin:0;
	padding:5px 0px 18px 0px;
	margin-bottom:3px;
	line-height:120%;
	list-style-type:none;
}
.cat-0 .catName{
	background-color:#006839;

}
.cat-1 .catName{
	background-color:#766456;
}
.cat-2 .catName{
	background-color:#211613;
}
.cat-3 .catName{
	background-color:#6B9447;
}
.catName{
	display:inline-block;
	width:9em;
	text-align:center;
	letter-spacing:0.1em;
	padding:3px 8px;
	padding:7px 8px;
	color:#fff;
	font-size:11pt;
	line-height:100%;
	margin:0 2px;
}
.up_ymd{
	font-size:14pt;
	color:#999;
	padding:8px 8px;
	display:inline-block;
}
.title{
	display:inline-block;
	word-wrap: break-word;
	font-size:13pt;
	color:#999;
	padding:3px 8px;
	line-height:1.4em;	
}
.newMark{
	display:inline-block;
}
.comment{
	display:block;
	padding:3px 0;
	float:left;
	overflow:hidden;
	font-size:15px;
	line-height:1.5em;
}

.thumbNailWrap{
	display:block;
	width:110px;
	float:left;
	height:80px;
	overflow:hidden;
}
.tonews{
	display:inline-block;
	margin-top:40px;

	line-height:15px;
	text-align:right;
}
	



	
	
/*お知らせ一覧・個別*/	
#newsWrap{
	background-color:#fcfcfc;
	background:none;
}
ul#newsList li{
	border-bottom:1px solid #ddd;
	margin-bottom:2em;
	padding-bottom:3em;
}
#newsWrap h1.title{
	font-size:20px;
	}
#newsWrap h2{
	font-size:24px;
	padding:5px 10px 20px 10px;
	margin:10px 0px 20px 0;
}


/* Pager style（外部化可） */
.pager{
	text-align:right;
	padding:10px;
	clear:both;
}
/*ページャーボタン*/
.pager a{
    border: 1px solid #999;
    border-radius: 5px 5px 5px 5px;
    color: #333;
    font-size: 12px;
    padding: 3px 7px 2px;
    text-decoration: none;
	margin:0 1px;
}

/*現在のページのボタン*/
.pager a.current{
    background: #999;
    border: 1px solid #999;
    border-radius: 5px 5px 5px 5px;
    color: #fff;
    font-size: 12px;
    padding: 3px 7px 2px;
	margin:0 1px;
    text-decoration: none;
}

.pager a:hover{
    background:#999;
    color: #fff;
}

.overPagerPattern{
	padding:0 2px ;	
}
.detailText{
	padding:5px 10px 20px 10px;
	font-size:17px;
	line-height:26px;
}
.detailUpfile{
	margin:5px 0 35px;
	text-align:center;
}
.backORcloseBtn{
	text-align:center;
	line-height:100%;
	margin-top:15px;
}
.backORcloseBtn a{
	display:inline-block;
	padding:4px 15px;
	border:1px solid #aaa;
	color:#999;
	border-radius:6px;
	text-decoration:none;
	font-size:12px;
}
.detailUpfile img{
	max-width:100%;
	height:auto;
}
.pNav{
	font-size:11px;	
}
	
	
	
	
/*---------トップの中のh1箱---------*/
.ranking, .products{
	padding:0px 100px 50px 100px;
}
.ranking h1, .products h1{
	text-align:center;
	padding:1em;
}
.products h1{
	text-align:center;
	padding:0em;
}


/*---------トップの中のランキング---------*/

.ranking{
 	background: linear-gradient(#f5f5f5, #ffffff), linear-gradient(#ffffff,#f5f5f5);
    background-position: left top, left bottom;
    background-repeat: repeat-x, repeat-x;
    background-size: auto 130px,auto 130px;
	padding:50px 100px 100px 100px;
}
.ranking i{
	display:inline-block;
	background-color:#E6CA79;
	width:24px;
	height:24px;
	line-height:24px;
	font-size:18px;
	margin-right:10px;
}
.ranking em{
	display:inline-block;
	margin-top:10px;
	font-size:18px;
}
	
.swiper-container {
	width: 100%;
	height: 100%;
}
.swiper-slide {
	text-align: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	-webkit-justify-content: center;
	justify-content: center;
	-webkit-box-align: center;
	-ms-flex-align: center;
	-webkit-align-items: center;
	align-items: center;
}	




/*---------トップの中のお問い合わせ---------*/
.flex{
	display:flex;
	justify-content: space-around;
}
.totel, .tomail{
	border:1px solid #006839;
	width:45%;
}	
.tomail{
	background-color:#006839;
}	
.totel:hover, 
.tomail:hover {
	opacity: 0.8;
}

/*ボタンエフェクト基礎/固定*/
.totel, .tomail {
  display: inline-block;
  text-decoration: none;
  outline:;
}
.totel::before,
.totel::after,
.tomail::before,
.tomail::after {
  position: absolute;
  z-index: -1;
  display: block;
  content: '';
}
.totel, .tomail,
.totel::before,
.totel::after,
.tomail::before,
.tomail::after {
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  -webkit-transition: all .3s;
  transition: all .3s;
}

/*ボタンエフェクト基礎/固定ここまで*/



	
@media (min-width: 992px) {

  .rankingbox .swiper-wrapper {
    flex-wrap: wrap;
    justify-content: space-between;
  }
  .rankingbox .swiper-slide {
    width: 33.3%;
    padding: 0px;
  }
  .rankingbox .swiper-button-prev,
  .rankingbox .swiper-button-next,
  .rankingbox .swiper-pagination {
    display: none;
  }
}

/*------フッター----*/


.footer{
	clear:both;
	padding:50px 0px 10px 0px;
	color:#fff;		
	background-color:#231815;
	font-size:12px;
}
.footer .left_box{
	line-height:1.8em;
	margin-bottom:2%;
	letter-spacing:0.5em;
	font-size:14px;
	padding:1em 0em;
} 
.footer .center_box{
	line-height:1.8em;
	margin-bottom:2%;
	border-right:1px solid  #888;
	border-left:1px solid  #888;
	text-align:center;
	letter-spacing:0.1em;
} 
.footer .center_box img{
	width:35%;
	height:35%;
} 

.footer .center_box p{
	font-size:15px;
	border:1px solid #888;
	width:80%;
	margin:1em auto;
	padding:0.2em;
} 
.footer .center_box p a{
	display:block;
	width:100%;
} 
.footer .center_box p a:hover{
	color:#aaa;
} 

.footer .right_box{
	text-align:right;
}

.footer .right_box p{
	margin-top:2em;
	text-align:right;
}
.footer .center_box h4{
	font-size:16px;
	letter-spacing:0.2em;
	padding:0.5em;
	
}
.footer_navi{
	margin-bottom:2%;
	padding-left:1em;
	letter-spacing:0em;
}  
.footer_navi li{
	display: inline;
} 
.footer a:link,
.footer a:visited{
	color:#fff;
}
.copyright{
	text-align:center;
	margin:1em auto;
	display:block;
	color:#fff;
	letter-spacing:0.1em;
}




/*------商品紹介各ページ----*/
nav#products{
 	/*border-bottom: 3px dotted red;*/
}
nav#products ul{
	display:flex;
	justify-content: center;
}
nav#products ul li{
	padding:10px 30px;
	letter-spacing:0.3em;
	border-bottom: 1px solid #ddd;
}
nav#products ul li a{
	display:block;
	color:#000;
}
nav#products ul li.current{
	
	border-bottom: 1px solid #6A9348;
}
nav#products ul li.current a{
	
}
nav#products ul li a:hover{
}
nav#products ul li:hover{
	border-bottom: 1px solid #6A9348;
	
	color:#363;
	
}

/*---------各カテゴリページ共通---------*/

/*両脇に線*/
.d-border {
  display: flex;
  align-items: center;
  
}
.d-border span {
  margin-left: 2em;
  margin-right: 2em;
}
.d-border::before, .d-border::after {
  content: '';
  border-bottom: 1px solid #000;
  flex: 1 1 auto;
}
/*両脇に線ここまで*/



.b-left{
	border-left:1px solid #666;
}
.b-right{
	border-right:1px solid #666;
}
.under_box{
	margin-top:10%;
	margin-bottom:5%;
}
.under_title{
}
.under_title p{
	margin-bottom:5%;
}
.b-left p{
	padding-left:1em;
	padding-right:5em;
}
.b-right p{
	padding-left:5em;
	padding-right:1em;
}



/*---------お問い合わせ---------*/
table.mailform{
	width:60%;
	margin:30px auto;
	border:none;
}
.mailform tr{
	display:block;
	padding:20px;
	border-bottom:1px solid #eee;
	display:flex;
}

.mailform th,
.mailform td{
	display:block;
}
.mailform th{
	width:30%;
}
.mailform td{
	width:60%;
}


.mailform td input{
	border:1px solid #e3e3e3;	
}
.mailform select{
	height:2em;
	line-height:2em;	
}

.mailform span{
	font-size:12px;
	color:#930;
}


/*---------お問い合わせ---------*/
table.company-about{
	width:50%;
	margin:30px auto;
	border:none;
}
.company-about tr{
	display:block;
	padding:15px;
	border-bottom:1px solid #eee;
	display:flex;
}

.company-about th,
.company-about td{
	display:block;
}
.company-about th{
	width:30%;
}
.company-about td{
	width:60%;
}

/*---お問い合わせ送信後---*/
.outer{
  display: table;
  width: 100%;
  text-align:center;
}
.inner{
  display: table-cell;
  vertical-align: middle;
  height:100%;
  height:30em;
  height: 100vh;
}

/* mdサイズ、ワイドスクリーン : Large Devices, Wide Screens */
@media only screen and (max-width : 1199px) {

.fixed{
	max-width: 960px;
}
.news img{
 	max-width: 100%;
  	height: auto;
}

}

/* smサイズ、デスクトップ : Medium Devices, Desktops */
@media only screen and (max-width : 991px) {



.ranking, .products{
	padding:50px 20px 50px 20px;
}
.news .b-left	{
	border-left:none;
}

.fixed{
	max-width: 744px;
}	
.footer .center_box img{
	width:100%;
	height:100%;
} 

.footer .footer_navi{	
	font-size:14px;
} 	
.footer .copyright{
	font-size:12px;
}

}
 
/* xsサイズ、スマホ横持ち、タブレット : Small Devices, Tablets */
@media only screen and (max-width : 767px) {
	
.ranking, .products{
	padding:50px 20px 50px 20px;
}

.flex{
	display:block;
}
.totel, .tomail{
	border:1px solid #006839;
	width:100%;
}	

.top_products_l, .top_products_r{
	padding-top:0em;
	margin-bottom:2em;
}


nav#products ul li{
	padding:0;

	letter-spacing:0em;	
}



.footer .left_box{
	text-align:center;
	border-bottom:1px solid #888;
}
.footer .center_box{
	border-bottom:1px solid #888;
}
.footer .right_box{
	text-align:center;
} 
.footer .center_box img{
	width:30%;
	height:30%;
} 
.footer .footer_navi{	
	text-align: center;
} 

.footer .center_box p{
	width:60%;
	padding:1em;
} 
.mailform tr,
.company-about tr{
	display:block;
}

table.company-about{
	width:80%;
}

.company-about th,
.company-about td,
.mailform th,
.mailform td{
	display:block;
	width:100%;
}





}
 
/* xxsサイズ :　スマホ縦持ち Extra Small Devices, Phones */  
@media only screen and (max-width : 479px) {
.pc { display: none !important; }
.sp { display: block !important; }


.nav_list li {
 width:25%;
}
hr{
	border-bottom:1px solid #ddd;
}


.top_products_l .top_cate_title{
	padding-right:0%;
}
.top_products_r .top_cate_title{
	padding-left:5%;
}

.top_cate_title{

	padding-bottom:0.5em;
}

.top_cate_title img{
	width:90%;
	height:90%;
}
.footer .center_box img{
	width:50%;
	height:50%;
} 
.under_title{
	margin-top:0%;
}	
.under_box{
	margin-bottom:20%;
}
.b-left{
	border-left:none;
}
.b-right{
	border-right:none;
}
	
}
 
/* カスタム, iPhone Retinaディスプレイ */ 
@media only screen and (max-width : 320px) {

}



/*---------モーダル練習---------*/
#modal-content {
	width: 50% ;
	margin: 0 ;
	padding: 10px 20px ;
	border: 2px solid #aaa ;
	background: #fff ;
	position: fixed ;
	display: none ;
	z-index: 2 ;
}
  
#modal-overlay {
	z-index: 1 ;
	display: none ;
	position: fixed ;
	top: 0 ;
	left: 0 ;
	width: 100% ;
	height: 120% ;
	background-color: rgba( 0,0,0, 0.75 ) ;
}

.button-link {
	color: #00f ;
	text-decoration: underline ;
}
 
.button-link:hover {
	cursor: pointer ;
	color: #f00 ;
}