@charset "utf-8";

/* Reset ------------------------------------------------------------------ */
:link,
:visited {
  text-decoration: none;
}

html,
body,
div,
ul,
ol,
li,
dl,
dt,
dd,
form,
fieldset,
input,
textarea,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
code,
p,
blockquote,
hr,
th {
  margin: 0;
  padding: 0;
}

h1 {
  font-size: 122%;
  font-weight: normal;
}

h2 {
  font-size: 115%;
  font-weight: normal;
}

h4 {
  font-size: 107%;
  font-weight: normal;
}

h5 {
  font-size: 92%;
  font-weight: normal;
}

h6 {
  font-size: 85%;
  font-weight: normal;
}

fieldset,
img,
abbr,
acronym {
  border: 0;
}

ol,
ul {
  list-style: none;
}

caption,
th {
  text-align: left;
}

q:before,
q:after {
  content: "";
}

hr {
  border: 0;
  height: 1px;
  background-color: #000;
  color: #000;
}
.w50 {
  width: 48%;
}
/* Utilities ----------------------------------------------------------------- */
#content-inner:after {
  content: " ";
  display: block;
  visibility: hidden;
  clear: both;
  height: 0.1px;
}

#content-inner {
  display: inline-block;
}

/* no ie mac \*/
*html #content-inner {
  height: 1%;
}

#content-inner {
  display: block;
}

/* */

/* ---------------------------------------------------------------------

ページ全体

--------------------------------------------------------------------- */

body {
  margin: 0;
  padding: 0;
  color: #333;
  font: 13px/1.6 "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro W3", "メイリオ", Meiryo, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
  *font-size: small; /* IE 7 */
  *font: x-small; /* IE 6以下 */
  background: url(img/back.gif) repeat;
}

.clear {
  clear: both;
}

/* ---------------------------------------------------------------------

画像

--------------------------------------------------------------------- */

.aligncenter {
  display: block;
  margin: 0 auto;
  padding: 0;
  font-size: 92%;
  text-align: center;
}

.alignleft {
  margin: 0 10px 10px 0;
  padding: 0;
  font-size: 92%;
  float: left;
  text-align: center;
}

.alignright {
  margin: 0 0 10px 10px;
  padding: 0;
  font-size: 92%;
  float: right;
}

.wp-caption {
  margin: 0;
  padding: 0;
}

.wp-caption-text {
  margin: 0;
  padding: 0;
  font-size: 92%;
  text-align: center;
}

/* ---------------------------------------------------------------------

ヘッダー

--------------------------------------------------------------------- */

#head {
  width: 950px;
  margin: 0;
  padding: 0;
}

#head h1 {
  margin: 10px 0 0 20px;
  padding: 0;
  position: absolute;
  color: #ffffff;
  font-weight: bold;
  font-size: 92%;
}

#head h2 {
  margin: 0;
  padding: 0;
}

.senri_img {
  margin: 0;
  padding: 0;
  text-align: center;
}

/* ---------------------------------------------------------------------

レイアウト

--------------------------------------------------------------------- */

.layout-tw #container {
  width: 950px;
  margin: 0 auto;
  padding: 0;
  text-align: left;
}

#container-inner {
  margin: 0;
  padding: 0;
}

.layout-tw #waku {
  width: 890px;
  margin: 0;
  padding: 0 30px;
  overflow: hidden;
  background: url(img/waku_back.gif) repeat-y;
}

#waku-inner {
  margin: 0;
  padding: 0;
}

.layout-tw #alpha {
  width: 655px;
  margin: 0;
  padding: 0 0 30px;
  overflow: hidden;
  background: #fff;
  float: right;
}

#alpha-inner {
  margin: 0;
  padding: 0;
}

.layout-tw #beta {
  width: 220px;
  margin: 0;
  padding: 0;
  float: left;
  overflow: hidden;
}

#beta-inner {
  margin: 0;
  padding: 0;
}

/* ---------------------------------------------------------------------

サイドメニュー

--------------------------------------------------------------------- */

.widget-main-menu {
  width: 220px;
  margin: 0;
  padding: 0;
  font-size: 92%;
  background: url(img/menu_back.gif) repeat-y;
}

.widget-main-menu .menu-content {
  margin: 0;
  padding: 0;
}

.widget-main-menu ul {
  margin: 0;
  padding: 0;
  list-style: none;
}

.widget-main-menu li {
  width: 220px;
  margin: 0;
  padding: 0;
}

.widget-main-menu li a {
  display: block;
  width: 170px;
  margin: 0;
  padding: 10px 5px 9px 40px;
  background: url(img/menu_back.gif) no-repeat;
  text-decoration: none;
  font-weight: bold;
  border-bottom: 1px solid #abb880;
}

.widget-main-menu li a:link {
  color: #fff;
  text-decoration: none;
}

.widget-main-menu li a:visited {
  color: #fff;
  text-decoration: none;
}

.widget-main-menu li a:hover {
  color: #ffcc00;
  text-decoration: underline;
}

.widget-main-menu li a:active {
  color: #ffcc00;
  text-decoration: underline;
}

.widget-main-menu li li a {
  display: block;
  width: 170px;
  margin: 0;
  padding: 10px 5px 9px 40px;
  background: url(img/menu_back02.gif) no-repeat;
  text-decoration: none;
  font-weight: bold;
  border-bottom: 1px solid #abb880;
}

.widget-main-menu li li a:link {
  color: #fff;
  text-decoration: none;
}

.widget-main-menu li li a:visited {
  color: #fff;
  text-decoration: none;
}

.widget-main-menu li li a:hover {
  color: #ffcc00;
  text-decoration: underline;
}

.widget-main-menu li li a:active {
  color: #ffcc00;
  text-decoration: underline;
}

.treeview .hitarea {
  width: 16px;
  height: 16px;
  margin: 11px 0 0 10px;
  padding: 0;
  float: left;
  cursor: pointer;
  background: url(img/treeview-default.gif) -64px -25px no-repeat;
}

* html .treeview .hitarea {
  position: absolute;
}

*:first-child + html .treeview .hitarea {
  position: absolute;
}

.treeview .expandable-hitarea {
  background-position: -80px -3px;
}

/* ---------------------------------------------------------------------

パンくず

--------------------------------------------------------------------- */

.navi {
  width: 595px;
  margin: 0 auto;
  padding: 0;
  text-align: left;
  font-size: 85%;
}

/* ---------------------------------------------------------------------

投稿記事

--------------------------------------------------------------------- */

.archive-title {
  width: 515px;
  height: 29px;
  margin: 0 auto;
  padding: 21px 80px 0 20px;
  font-size: 107%;
  font-weight: bold;
  background: url(img/title.gif) no-repeat;
  color: #fff;
}

.archive-title a:link {
  color: #fff;
  text-decoration: none;
}

.archive-title a:visited {
  color: #fff;
  text-decoration: none;
}

.archive-title a:hover {
  color: #ff6600;
  text-decoration: underline;
}

.archive-title a:active {
  color: #ff6600;
  text-decoration: underline;
}

.asset-content {
  width: 595px;
  margin: 10px auto 0;
  padding: 0;
}

h3 {
  width: 570px;
  margin: 0 auto 10px;
  padding: 3px 10px;
  font-size: 107%;
  font-weight: bold;
  background: #ffd1b2;
  border-left: #ff6600 5px solid;
}

table.senri {
  width: 100%;
  margin: 0 0 10px;
  padding: 0;
  border-collapse: collapse;
}

table.senri th,
table.senri td.th {
  padding: 6px;
  border: 1px solid #ffcc00;
  background: #fff0b3;
  font-weight: bold;
  text-align: center;
}

table.senri td {
  padding: 6px 10px 6px;
  border: 1px solid #ffcc00;
}
table.senri.sp04 td {
  border: 0;
}
.red {
  color: #ff3300;
}
.panel-grid {
  margin-bottom: 0 !important;
}

.panel-grid img {
  max-width: 100%;
  height: auto;
}

.sp_only {
  display: none;
}

.right {
  float: right;
}

/* ---------------------------------------------------------------------

トップページ

--------------------------------------------------------------------- */

#top_news02 ul.new li {
  width: 580px;
  margin: 0 auto;
  padding: 10px;
  border: 1px dotted #003300;
}

#top_back01 {
  width: 625px;
  margin: 0;
  padding: 100px 0 40px 30px;
  background: url(img/top_back01.jpg) no-repeat;
}

#top_back02 {
  width: 625px;
  margin: 0;
  padding: 105px 0 35px 30px;
  background: url(img/top_back02.jpg) no-repeat;
}

#top_back03 {
  width: 625px;
  margin: 0;
  padding: 0 0 0 30px;
}

#top_news {
  width: 595px;
  margin: 10px auto 0;
  padding: 0;
}

ul.new {
  margin: 0;
  padding: 0;
  list-style: none;
}

ul.new li {
  width: 580px;
  margin: 0 auto 5px;
  padding: 0 5px 4px;
}

.day {
  width: 113px;
  margin: 0;
  padding: 0;
  float: left;
  color: #990000;
}

.new_text {
  width: 452px;
  margin: 0;
  padding: 0 0 0 15px;
  float: right;
  background: url(img/arrow.gif) 0 5px no-repeat;
}

/* 追加 2012.05.21 DP */
.box_top {
  width: 645px;
  margin: 0 0 0 10px;
  padding: 0;
  font-size: 92%;
  font-weight: bold;
}

.box_top ul {
  margin: 0;
  padding: 0;
}

.box_top ul li {
  margin: 0;
  padding: 0;
  float: left;
}

.box_top ul li img {
  vertical-align: bottom;
}

.box_top ul li.li_text01 {
  width: 115px;
}

.box_top ul li.li_text02 {
  width: 135px;
}

.box_top ul li.li_text03 {
  width: 115px;
  height: 170px;
  background: url(img/img10.jpg) 0 0 no-repeat;
}

.box_top ul li.li_text04 {
  width: 135px;
  height: 170px;
  background: url(img/img12.jpg) 0 0 no-repeat;
}

/*------------------------

追記140715

------------------------*/
.box_top_wrap a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -moz-opacity: 0.7;
}

.box_top_wrap p {
  font-weight: bold;
  font-size: 12px;
}

.box_top02 {
  width: 288px;
  height: 190px;
  float: left;
  margin: 0;
  background-image: url(img/img02.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.box_top02 .btn {
  padding-top: 155px;
  padding-left: 60px;
}

.box_top03 {
  width: 200px;
  height: 190px;
  float: left;
  margin: 0;
  background-image: url(img/img03.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.box_top03 .btn {
  padding-top: 155px;
  padding-left: 10px;
}

.box_top04 {
  width: 147px;
  height: 190px;
  float: left;
  margin: 0;
  background-image: url(img/img04.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.box_top04 {
  width: 167px;
  height: 190px;
  float: left;
}

.box_top04 p {
  padding-top: 20px;
  padding-left: 0;
  padding-bottom: 10px;
}

.box_top05 {
  width: 318px;
  height: 308px;
  float: left;
  margin: 0;
  background-image: url(img/img05.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.box_top05 p {
  padding-top: 200px;
  padding-left: 30px;
}

.box_top05 .btn {
  padding-top: 5px;
  padding-left: 30px;
}

.box_top06 {
  width: 317px;
  height: 308px;
  float: left;
  margin: 0;
  background-image: url(img/img06.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.box_top06 p {
  padding-top: 160px;
  padding-left: 170px;
}

.box_top06 .btn {
  padding-top: 5px;
  padding-left: 170px;
}

.box_top07 {
  width: 332px;
  height: 242px;
  float: left;
  margin: 0;
  background-image: url(img/img07.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.box_top07 p {
  padding-top: 160px;
  padding-left: 70px;
}

.box_top07 .btn {
  padding-top: 5px;
  padding-left: 120px;
}

.box_top08 {
  width: 303px;
  height: 242px;
  float: left;
  margin: 0;
  background-image: url(img/img08.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.box_top08 p {
  padding-top: 160px;
  padding-left: 70px;
}

.box_top08 .btn {
  padding-top: 5px;
  padding-left: 100px;
}

.box_top10 {
  width: 248px;
  height: 436px;
  float: left;
  margin: 0;
  background-image: url(img/img10.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.box_top10 .btn {
  padding-top: 320px;
  padding-left: 60px;
}

.box_top11 {
  width: 387px;
  height: 194px;
  float: left;
  margin: 0;
  background-image: url(img/img11.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}

.box_top11 .btn {
  padding-top: 165px;
  padding-left: 200px;
}
.box_top12 {
  width: 387px;
  height: 242px;
  float: left;
  margin: 0;
  background-image: url(img/img12.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}
.box_top12 p {
  width: 200px;
  float: left;
  margin: 0;
  padding-top: 140px;
  padding-left: 10px;
}

.box_top12 .btn {
  padding-top: 210px;
  padding-left: 193px;
}
.box_top13 {
  width: 288px;
  height: 359px;
  float: left;
  margin: 0;
  background-image: url(img/img13.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}
.box_top13 p {
  padding-top: 250px;
  padding-left: 15px;
}

.box_top13 .btn {
  padding-top: 5px;
  padding-left: 75px;
}
.box_top14 {
  width: 347px;
  height: 359px;
  float: left;
  margin: 0;
  background-image: url(img/img14.jpg);
  background-repeat: no-repeat;
  background-position: left top;
}
.box_top14 p {
  padding-top: 270px;
  padding-left: 15px;
}

.box_top14 .btn {
  padding-top: 5px;
  padding-left: 85px;
}

/* ---------------------------------------------------------------------

フッター

--------------------------------------------------------------------- */

#footer {
  width: 920px;
  margin: 0 auto;
  padding: 10px 15px 10px;
  font-size: 85%;
}

#footer_left {
  margin: 0;
  padding: 0;
  float: left;
  color: #fff;
  font-weight: bold;
}

#footer_right {
  margin: 0;
  padding: 0;
  float: right;
}

/* ---------------------------------------------------------------------

リンク

--------------------------------------------------------------------- */

a:link {
  color: #006600;
  text-decoration: underline;
}

a:visited {
  color: #006600;
  text-decoration: underline;
}

a:hover {
  color: #ff6600;
  text-decoration: underline;
}

a:active {
  color: #ff6600;
  text-decoration: underline;
}

/* ---------------------------------------------------------------------

float 解除

--------------------------------------------------------------------- */

/*IE7以外のモダンブラウザ向け*/
.clearfix:after {
  content: ".";
  display: block;
  clear: both;
  visibility: hidden;
  height: 0;
}

/*IE7およびMacIE5向け*/
.clearfix {
  display: inline-block;
}

/*End hide from IE-mac*/ /*IE6以前向け*/
.clearfix {
  display: block;
}

/* ---------------------------------------------------------------------

プリント

--------------------------------------------------------------------- */

@media print {
  * {
    position: static !important;
    overflow: visible !important;
  }
}

/* ---------------------------------------------------------------------

非表示

--------------------------------------------------------------------- */

.hidden {
  display: none;
  visibility: hidden;
}
.hidden-desktop {
  display: none !important;
}
.hidden-phone {
  display: inline-block !important;
}

/* ---------------------------------
新トップページ用
---------------------------------- */
html {
  scroll-behavior: smooth;
}

.home h2 {
  text-align: center;
  padding-top: 10px;
}

.home h2.dot-line {
  border-top: 5px dotted #ccc;
  margin: 0 20px;
}

.home h2.archive-title {
  text-align: left;
  margin-bottom: 1em;
}

.home h2 img:not(header h2 img) {
  max-width: 580px;
}

.home p {
  font-size: 1.15em;
}

.home p.title-follow {
  text-align: center;
  margin-bottom: 2em;
}

a.btn:hover {
  filter: brightness(1.25);
}

header {
  padding-top: 10px;
}

header p {
  color: #fff;
  white-space: nowrap;
  font-size: 1.25em;
}

.home .top-anchor {
  display: flex;
  gap: 10px;
  justify-content: center;
  margin-top: 10px;
}

.home .top-anchor li a:hover {
  filter: brightness(1.25);
}

.home .top-anchor li img {
  width: 151px;
  height: 40px;
}

/* 商品説明を横に並べる */
.home .item {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 635px;
  margin: 0 auto;
  padding: 20px 0;
  border-bottom: 1px solid #ddd;
}

.home .item-last {
  border-bottom: none;
}

.home .item ul {
  width: 317px;
  text-align: center;
  margin: 0 auto;
}

.home .item ul:first-child {
  border-right: 1px solid #ddd;
}

.home .item h3 {
  text-align: center;
  width: 200px !important;
  width: inherit;
  margin: 0 auto 1em;
  padding: 0;
  font-size: 1.35em;
  font-weight: bold;
  background: none;
  border-left: none;
  letter-spacing: 0.05em;
}

/* 商品説明を包有する枠 */
.home .box {
  width: 200px;
  text-align: center;
  margin: 0 auto;
  position: relative;
  z-index: 2;
}

/* 商品画像 */
.home .box img.item-photo {
  width: 200px;
  height: 200px;
  object-fit: contain;
  margin-bottom: 30px;
}

.home .box h4 {
  font-size: 1.15em;
  font-weight: bold;
}

.home .box p.price {
  color: #ff6300;
  font-size: 1.25em;
  font-weight: bold;
}

.home .box a.btn {
  display: block;
  margin-top: 5px;
}

.home .box a.btn img {
  width: 200px;
}

.home ul.others {
  display: flex;
  gap: 6px;
  justify-content: center;
  width: 200px;
  margin: 10px auto 0;
  position: absolute;
  z-index: 2;
}

.home ul.others li a {
  border: 1px solid #999;
  height: 30px;
  border-radius: 5px;
  display: block;
  transition: all 0.3s;
}

.home ul.others li a:hover {
  background-color: #ffd0b3;
}

.home ul.others li img {
  width: 60px;
}

/* サンプル集 */
.home .sample {
  text-align: center;
  margin-bottom: 50px;
}

.home .sample ul {
  display: flex;
  justify-content: space-evenly;
}

.home .sample li img {
  width: 180px;
  height: 180px;
  margin-bottom: 0.5em;
  object-fit: contain;
}

.home .sample h4 {
  font-size: 1.25em;
  font-weight: bold;
  margin-bottom: 1.5em;
}

.home .sample a.btn {
  display: block;
  margin: 5px auto 0;
  width: 230px;
}

.home .sample a.btn img {
  width: 230px;
}

/* 新着情報 */
.home .new li {
  margin-bottom: 10px !important;
}

/* ---------------------------------
カルーセル用
---------------------------------- */
/* カルーセル全体 */
.home .carousel {
  /* 水平方向中央寄せ */
  display: flex;
  justify-content: center;
}
/* カルーセル内容 */
.home .contains {
  /* サイズは自由に変更してください。*/
  /* 下の.slideも同じサイズにしてください。 */
  width: 317px;
  height: 390px;
  overflow: hidden;
  position: relative;
  padding: 0;
  list-style: none;
}
/* スライド切り換え用ラジオボタンは常に非表示 */
.home .slide_select {
  display: none;
}
/* 各スライド */
.home .slide {
  /* サイズは自由に変更してください。*/
  /* 上の.containsも同じサイズにしてください。 */
  width: 317px;
  height: 390px;
  position: absolute;
  /* スライドの初期値は選択されていないので透明にしておく */
  opacity: 0;
}
/* 前へ次へボタン */
.home .scroll_button {
  position: absolute;
  display: block;
  height: 20px;
  width: 20px;
  /* 縦中央から20px上の位置 */
  top: 45%;
  margin-top: -20px;
  /* 上辺と右辺のみ幅5pxの枠線 */
  border-width: 5px 5px 0 0;
  border-style: solid;
  border-color: #ff6300;
  cursor: pointer;
  /* 普段はボタンはやや薄くする */
  opacity: 0.4;
  /* スライドよりも前面にする */
  z-index: 3;
}
/* ホバー時にボタンを強調 */
.home .scroll_button:hover {
  opacity: 1;
}
/* 前へボタン */
.home .scroll_prev {
  left: 30px;
  /* 上辺と右辺の枠線を回転して"＜"にする */
  transform: rotate(-135deg);
}
/* 次へボタン */
.home .scroll_next {
  right: 30px;
  /* 上辺と右辺の枠線を回転して"＞"にする */
  transform: rotate(45deg);
}
/* スライド移動ボタンエリア */
.home .move_controler {
  position: absolute;
  top: 205px;
  width: 100%;
  text-align: center;
}
/* スライド移動の各ボタン */
.home .button_move {
  display: inline-block;
  height: 8px;
  width: 8px;
  margin: 0 2px;
  border-radius: 100%;
  cursor: pointer;
  /* 普段はやや薄くする */
  opacity: 0.5;
  /* スライドより前面にする */
  z-index: 2;
}
/* ホバー時はやや明るくする */
.home .button_move:hover {
  opacity: 0.75;
}
/* スライド移動ボタンの色 */
.home .button_move {
  background-color: #aaa;
}
/* 1番目のスライド選択時 */
/* 1番目のスライドの透明度を0にして表示する */
.home .slide_select:nth-of-type(1):checked ~ .slide:nth-of-type(1) {
  opacity: 1;
}
/* 1番目のスライドの前へ次へボタンの領域を */
.home .slide_select:nth-of-type(1):checked ~ .move_controler .button_move:nth-of-type(1) {
  opacity: 1;
}
.home .slide_select:nth-of-type(2):checked ~ .slide:nth-of-type(2) {
  opacity: 1;
}
.home .slide_select:nth-of-type(2):checked ~ .move_controler .button_move:nth-of-type(2) {
  opacity: 1;
}
.home .slide_select:nth-of-type(3):checked ~ .slide:nth-of-type(3) {
  opacity: 1;
}
.home .slide_select:nth-of-type(3):checked ~ .move_controler .button_move:nth-of-type(3) {
  opacity: 1;
}
.home .slide_select:nth-of-type(4):checked ~ .slide:nth-of-type(4) {
  opacity: 1;
}
.home .slide_select:nth-of-type(4):checked ~ .move_controler .button_move:nth-of-type(4) {
  opacity: 1;
}
