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

/* ------▼▼▼▼*  -------------------------------------------------------------------------------------------------------------------------- */
*{ margin: 0; padding: 0; font-size: 13px; font-family: 'ヒラギノ角ゴ Pro W3','Hiragino Kaku Gothic Pro','メイリオ',Meiryo,'ＭＳ Ｐゴシック','MS PGothic',sans-serif;}
a{ text-decoration : none; color: #000; }

a{ display: block; text-decoration: none; color: #000; 
            -webkit-transition: all 0.2s ease; -moz-transition: all 0.2s ease; -o-transition: all 0.2s ease; }
a:hover{ color: rgb(238,141,152); }
body{ font-size: 14px; }
html, body{ height:100%; }
li{list-style-type:none;}


/* ------▼▼▼▼#container   -------------------------------------------------------------------------------------------------------------------------- */
#container{ width: 100%; height: 950px; background-color: rgba(159,109,104,0.4); position: relative; overflow: hidden; }

/* ------▼▼▼header   -------------------------------------------------------------------------------------------------------------------------- */
header{ width: 100%; height: 100px; background-image: url(./img/headerBack.jpg); position: relative; }
#companyName{ width: 1100px; left: 0; right: 0; position: absolute; margin: auto; }
#companyName img{ margin: 20px 0 0 50px; width: 280px; }
#companyName h4{ color: #fff; font-size: 25px; margin: 15px 0 0 50px; text-shadow: 1px 1px 3px #000; letter-spacing: 2px;  }
.pageTitle{  width: 1100px; left: 0; right: 0; position: absolute; margin: auto; }
.pageTitle h5{ color: #fff; font-size: 18px; margin: 58px 0 0 50px; text-shadow: 1px 1px 3px #000; letter-spacing: 2px;  }

/* ------▼▼▼nav -------------------------------------------------------------------------------------------------------------------------- */
nav{ width: 100%; height: 50px; background-color: #2e0c09; }
nav ul{ width: 810px; margin-left: 150px; }
nav ul li{ float: left; margin-top: 15px; width: 90px; text-align: center;   }
nav ul li a{ color: #fff; font-size: 14px; }
nav ul li:nth-child(3){ background-color: rgba(255,255,255,0.1); width: 90px; height: 50px; margin-top: 2px;  }
nav ul li:nth-child(3) a{ color: #fff; font-size: 14px;  margin-top: 13px;}

/* ------▼▼▼#main   -------------------------------------------------------------------------------------------------------------------------- */
#main{ width: 1100px; left: auto; right :auto;  
    left: 0;
    right: 0;
    position: absolute;
    margin: auto;
	 
}
#main:after {
  content: '';
  display: table;
  clear: both;
}
/* ------▼▼#left_column   ----------------------------------------------------------------------------------------------------------- */
#left_column{ float: left; width: 285px;  position: relative; }


/* ------▼#left_topSpace   --------------------------------------------------------------------------------------------- */
#left_topSpace{ padding-top: 25px; position: relative;  width: 285px; height: 470px; background-color: rgba(255,255,255,0.65); border-radius: 5px; margin-top: 15px; margin-left: 15px;  z-index: 1;}
.goodsTitle{ border-top: solid 1px #2e0c09; border-bottom: solid 1px #2e0c09; margin: 0px 20px 0 20px; }
.goodsTitle p{ font-size: 15px; color: #2e0c09; text-align: center; }

.goods_1{ position: relative; margin: 30px 0 0 20px; width: 250px; height: 260px; z-index: 6; }
.goods_1 a{ display: block; font-size: 14px; color: #000; width: 150px; height: 18px; margin-bottom: 3px;  padding-left: 15px; border-radius: 0 4px 4px 0; background-color: rgba(255,255,255,0.4); }
.goods_1 a:hover{ color: #F69; }
.goodsPhoto_space{ position: absolute; width: 245px; height: 280px; top: 68px; left: 20px; overflow: hidden; z-index: 5; }
.goodsPhoto{ display: none; position: absolute; z-index: 2; }

.goods_2{ position: relative; width : 245px; height: 23px; border-radius: 3px; background-color: #fff; margin-top: 18px; margin-left: 20px;  
box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3);
-moz-box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3);
-webkit-box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3);
-webkit-transition: all 2.5s ease; -moz-transition: all 2.5s ease; -o-transition: all 2.5s ease; 
}
.goods_2:hover{ background-color: rgba(101,6,12,1); color: #fff;}
.goods_2:hover a{ color: #fff;}

.goods_3{ position: relative; width : 245px; height: 23px; border-radius: 3px; background-color: #fff; z-index: 3; margin-top: 5px; margin-left: 20px; 
box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3);
-moz-box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3);
-webkit-box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3); 
-webkit-transition: all 2.5s ease; -moz-transition: all 2.5s ease; -o-transition: all 2.5s ease; 
}
.goods_3:hover{ background-color: rgba(101,6,12,1); color: #fff;}
.goods_3:hover a{ color: #fff;}

.goods_4{ position: relative; width : 245px; height: 23px; border-radius: 3px; background-color: #fff; z-index: 3; margin-top: 5px; margin-left: 20px; 
box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3);
-moz-box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3);
-webkit-box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3); 
-webkit-transition: all 2.5s ease; -moz-transition: all 2.5s ease; -o-transition: all 2.5s ease; 
}
.goods_4:hover{ background-color: rgba(101,6,12,1); color: #fff;}
.goods_4:hover a{ color: #fff;}

.goods_5{ position: relative; width : 245px; height: 23px; border-radius: 3px; background-color: #fff; z-index: 3; margin-top: 5px; margin-left: 20px; 
box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3);
-moz-box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3);
-webkit-box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3); 
-webkit-transition: all 1.5s ease; -moz-transition: all 1.5s ease; -o-transition: all 1.5s ease; 
}
.goods_5:hover{ background-color: rgba(101,6,12,1); color: #fff;}
.goods_5:hover a{ color: #fff;}

.goods_6{ position: relative; width : 245px; height: 23px; border-radius: 3px; background-color: #fff; z-index: 3; margin-top: 5px; margin-left: 20px; 
box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3);
-moz-box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3);
-webkit-box-shadow:1px 1px 1px 0px rgba(101,33,57,0.3); 
-webkit-transition: all 1.5s ease; -moz-transition: all 1.5s ease; -o-transition: all 1.5s ease; 
}
.goods_6:hover{ background-color: rgba(101,6,12,1); color: #fff;}
.goods_6:hover a{ color: #fff;}

.goodsOther{ line-height: 23px; text-align: center; font-size: 15px;  }

.leftBack_photo{ position: absolute; top: 68px; left: 20px; width: 245px; height: 280px; z-index: 2; overflow: hidden; }


/* ------▼.left_navFlaot  --------------------------------------------------------------------------------------------- */
#left_navFloat{ display: none; width: 285px; height: 480px; margin-top: 15px; background-color: rgba(255,255,255,0.65); border-radius: 5px; z-index: 1;padding-top: 25px; margin-left: 15px; position: fixed; top: 0; }

.topNav{ position: absolute; top: 78px; left: 215px; width: 50px; height: 25px; line-height: 25px; border-radius: 5px 0 0 5px; background-color: rgba(74,8,11,1); z-index: 7; }
.topNav:hover{ background-color: rgba(74,8,11,0.5) }
.topNav a{ display: block; text-align: center; color: #fff; font-size: 14px;  }
.topNav a:hover{ color: rgb(238,141,152); }


/* ------▼▼#right_column   ----------------------------------------------------------------------------------------------------------- */
#right_column{ float: right; width: 780px; margin-top: 15px; border-radius: 5px; background-color: rgba(255,255,255,0.65); position: relative; } 

/* ------▽▽.productOne   ----------------------------------------------------------------------------------------------------------- */
.productContainer{ padding-top: 35px; }
.productOne{ position: relative; width: 735px; height: 255px; margin: 0 0 5px 30px; }
.product_left{ float: left; width: 200px; height: 200px; overflow: hidden;}
.product_left img{ height: 200px; }
.product_right{ float: left;   width: 530px; height: 230px; }               
.product_right .product_title{ width: 530px; height: 30px; }  
.product_right .product_title p{ margin: 5px 0 0 15px; font-size: 18px; }
.product_right .product_info{ width: 500px; height: 160px; padding: 10px 15px 10px 15px; }               
.product_right .product_info p{ font-size: 14px; }
.product_coment{ clear: both; padding: 12px 15px 8px 0; position: relative; }
.product_coment .kodawari{ position: absolute; top: 13px; left: -5px; height: 35px; }
.product_coment .product_comentSpace{ width: 720px; height: 45px; margin-left: 0px; border-radius: 3px; background-color: #CCC; padding-top: 5px; }
.product_coment .product_comentSpace p{ width: 585px; height: 50px;margin-left: 110px; font-size: 13px;　}

/* ------▽▽.categoryTitle   ----------------------------------------------------------------------------------------------------------- */

.category_bean{ width: 780px; height: 32px; background-color: #4a080b; margin-bottom: 5px; border-radius: 5px 5px 0 0; padding-top: 9px; }
.category_bean h2{ color: #fff; font-size: 18px; text-align: center; }

.category_top{ width: 780px; height: 32px; background-color: #4a080b; margin-top: 50px; margin-bottom: 5px; padding-top: 9px; }
.category_top h2{ color: #fff; font-size: 18px; text-align: center; }

.categoryTitle_end{ width: 780px; height: 22px; margin-top: 130px; background-color: #4a080b; margin-bottom: 0px; border-radius:  0 0 5px 5px; }

.titleBorder_1{ width: 780px; border: solid 0.5px rgba(74,8,11,0.7); margin-top: -3px; }
.titleBorder_2{ width: 780px; border: solid 1px rgba(80,33,111,0.5); margin-top: 2px; }
/* .titleBorder_3{  width: 780px; border: solid 1px rgba(32,98,52,0.4); margin-top: 2px; } */

.sarasianLink_1{ position: absolute; top: 172px; left: 365px; color: #4a080b; }
.yamariLink_2{ position: absolute; top: 46px; left: 290px; color: #4a080b; }

.clear{ clear: both; }

/* ------▼▼▼footer   ----------------------------------------------------------------------------------------------------------- */
footer{  width: 100%; height: 50px; padding-top: 30px; background-color: #2e0c09; position: relative; }
footer p{ font-size: 14px; color: #fff; text-align: center; }

/* ------▼▼▼page-top   ----------------------------------------------------------------------------------------------------------- */
#page-top{ position: fixed; bottom: 80px; right: 0px;  }
#page-top a{ background-color: #2e0c09;  text-decoration: none; color: #fff; width: 80px; padding: 30px 0; text-align: center; display: block; border-radius: 5px 0 0 5px; font-size: 12px; }
#page-top a:hover{ text-decoration: none; background: #999; }