﻿@charset "utf-8";
/* CSS Document */#outer {
  width: 1260px;
  margin: 0 auto;
}
a {
  color: #006699;
}
html {
  height: 100%;
}
body {
  height: 100%;
  font-family: "Yu Gothic Medium", "游ゴシック Medium", "游ゴシック体", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, sans-serif;
}
/* 全体レイアウト */.page-blog .pane-contents {
  padding-top: 50px;
  text-align: left;
}
.page-bloglist .pane-contents {
  padding-top: 0px;
  text-align: left;
}
.block-simpleblog-detail--article-no-data {
  margin-bottom: 100px;
}
/* 左レイアウト */.pane-left-menu {
  margin: 0 60px 0 0;
}
#js-staffblog-newarticle ul li {
  margin-bottom: 10px;
}
/* 左レイアウト　一番上調整*/h2.block-simpleblog-left-menu--newarticle-title:first-of-type {
  margin-top: 0;
  border-top: none;
  padding: 0 0 16px;
}
/* 左レイアウト　タグ表示*/.block-simpleblog-left-menu--tag-item,
.block-simpleblog-detail--article-tag {
  padding: 5px;
  border-radius: 10px;
  background: #ffffff;
  border: solid 1px #cccccc;
  word-break: break-word;
}
/* フッターコピーライト */#copyright {
  color: #555555;
  background-color: #eeeeee;
}
/* 簡易ブログ記事画面　内容調整 */.block-simpleblog-list--filter span.block-simpleblog-list--filter-title {
  display: none;
}
/* 簡易ブログ記事画面　各記事調整 */.block-simpleblog-list--simpleblogs li {
  width: 25%;
}
.block-simpleblog-list--simpleblog-thumbnail figure {
  height: 210px;
}
/* ヘッダー調整　全国・問い合わせ部分上書き用 */#hnav_contact > li > a {
  width: initial;
  width: auto;
}
#hnav_customer li.blogtop_ a {
  background: url(file:///C|/Users/121114/Desktop/DX%E6%8E%A8%E9%80%B2%E9%83%A8/img/usr/common/icon_blog.png) center 12px no-repeat;
}
.pane-footer {
  width: 100%;
  bottom: 0;
}
.user_detail {
  background: gray;
  padding: 1rem 2rem;
}
/*シモジマ監修部分*/p.column_kansyu {
  border: 2px dashed #c8e6cb;
  padding: 10px;
  text-align: center;
}
p.column_kansyu a {
  text-decoration: none; /* 通常時の下線をなくす */
}
p.column_kansyu a:hover {
  text-decoration: underline; /* マウスを当てたとき下線を表示 */
}
/* 目次の全体スタイル */#toc {
  border: 2px solid #d7edd9;
  padding: 10px;
  width: 90%;
  max-width: 600px;
  background: #fdfffe;
  white-space: normal !important;
  text-align: left;
  margin: 0 auto 1rem;
}
/* 目次のタイトル */.toc-title {
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  padding: 6px;
  background: #EAFAEA;
  border-radius: 5px;
  margin: auto;
  width: 100%;
  justify-content: center;
  color: #000 !important;
}
/* 開く・閉じるテキストのスタイル */.toggle-text {
  margin-left: 10px;
  /* 目次タイトルとの間にスペース */
}
.toggle-text:hover {
  text-decoration: underline;
}
.open-text {
  display: inline;
}
.close-text {
  display: none;
}
/* チェックボックスがONのとき「開く」を非表示、「閉じる」を表示 */.toc-checkbox:checked + .toc-title .open-text {
  display: none;
}
.toc-checkbox:checked + .toc-title .close-text {
  display: inline;
}
/* チェックボックスの非表示（開閉制御用） */.toc-checkbox {
  display: none;
}
/* 目次の内容部分（デフォルトは表示） */.toc-content {
  display: block;
  margin-top: 10px;
  transition: all 0.3s ease-in-out;
}
/* チェックボックスがオフの時は非表示 */.toc-checkbox:not(:checked) ~ .toc-content {
  display: none;
}
/* 目次リストのスタイル */.toc-list {
  list-style: none;
  padding-left: 0;
  text-align: left;
  /* 目次リストは左揃え */
}
.toc-list li {
  margin: 5px 0;
  padding-left: 10px;
  list-style: none;
  /* 番号なしリストにする */
}
/* リンクのデザイン */.toc-list a {
  text-decoration: none;
  color: #000;
  font-size: 1em;
}
.toc-list a:hover {
  text-decoration: underline;
  color: #005f99;
}
/* ネストされたリストのデザイン */.toc-list ol {
  list-style: none;
  /* ネストされたリストも番号なしにする */padding-left: 15px;
}
.block-simpleblog-detail--article-body-image {
  margin-bottom: 15px;
}
/* 文字強調 */.mojiline {
  background: linear-gradient(transparent 70%, #ffe569 30%);
  font-weight: bold;
}
/* アイコン */.link-with-icon {
  display: inline-flex;
  /* 横並びにするためにflexboxを使用 */align-items: center;
  /* アイコンと文字を垂直に中央揃え */
}
.icon {
  width: 20px;
  /* アイコン画像の幅 */height: 20px;
  /* アイコン画像の高さ */margin-right: 8px;
  /* アイコンと文字の間隔 */
}
/* 簡易ブログ記事画面　記事中身用 */h2.column_subtitle {
  border-left: solid 5px #e60013;
  font-weight: bold;
  padding-left: 1rem;
  font-size: 18px;
}
h3.column_subtitle {
  display: inline-block;
  font-size: 15px;
  font-weight: bold;
  width: 100%;
  background-color: #EAFAEA;
  padding: 5px;
}
h4.column_subtitle {
  display: inline-block;
  font-size: 15px;
  font-weight: bold;
}
h4.column_subtitle:before {
  content:"●";
}
.user_img2item {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  margin: 30px auto 0;
}
.user_img2item .item {
  width: 49%;
  margin-bottom: 10px;
}
.user_img2item_sp1 {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  width: 100%;
  margin: 10px auto 0;
}
.user_img2item_sp1 .item {
  width: 49%;
  margin-bottom: 10px;
}
.block-simpleblog-detail--article-goods-list:before {
  content: 'この記事で紹介したオススメ商品';
  display: block;
  border-left: solid 5px #e60013;
  font-weight: bold;
  padding-left: 1rem;
  font-size: 18px;
}
.block-simpleblog-detail--article-body1 {
  margin-bottom: 100px;
}
.block-simpleblog-detail--article-body1 h1 {
  line-height: 1.2;
}
.block-simpleblog-detail--article-staff-name {
  vertical-align: middle;
  display: table-cell;
}
.block-simpleblog-detail--article-staff-name:before {
  content: 'オンラインスタッフ：';
}
span.s_text {
  font-size: 12px;
}
/* 簡易ブログ記事画面　タイトル用 */h1.block-simpleblog-list--title {
  padding: 7rem 0;
  text-align: center;
  background-image: url(/img/simpleblog/blog_bg.jpg);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  border: solid #cccccc 1px;
}
/* 簡易ブログ記事画面　目次用*/.toc {
  margin: 0 auto 2rem;
  padding: 1em;
  background-color: #cccccc;
}
/*-- base style --*/.toc li:before {
  margin-right: 5em;
  padding: 1em 5em;
  text-align: center;
  border-radius: 4px;
}
.toc li {
  padding-left: 1em;
  font-weight: bold;
}
.toc li ol li {
  padding-left: 1em;
}
.toc li ol li ol li {
  padding-left: 1em;
}
.toc li ol {
  margin: 0 0 1em 1.7em;
}
.toc li ol li ol {
  margin-left: 3em;
}
/*-- font-color & background --*/.toc li:before {
  color: #fff;
  background-color: #444;
}
.toc li ol li {
  font-weight: normal;
}
/* 他サイトアイコン表示 */.block-simpleblog-detail--article-body1 a._othersite::after {
  content:url('/img/simpleblog/ico_blank.png');
  margin:0px 5px;
}
/*tableタグ*/table.blog {
  width: 100%;
  border-collapse: collapse;
  border-spacing: 0;
}
table.blog th {
  font-weight: bold;
  padding: 5px;
  background: #fffbda;
  border: solid 1px #dddddd;
}
table.blog td {
  padding: 5px;
  border: solid 1px #dddddd;
}
/*カテゴリへのリンク（いままでの）*//*a._catebtn{position: relative;display: block;padding: 10px 15px;color: #ffffff!important;background-color: #139767;border-radius: 0.5em;font-size: 1.5em;font-weight: bold;text-align: center;}*//*a._catebtn::before{content: '';width: 8px;height: 8px;margin-top: -5px;border-top: solid 2px #ffffff;border-right: solid 2px #ffffff;transform: rotate(45deg);position: absolute;top: 50%;right: 2%;}*//*a._catebtn:visited{color: #ffffff;}*//*カテゴリへのリンク（新しいほう）*/a._catebtn {
  position: relative;
  display: block;
  text-align: center;
  vertical-align: middle;
  width: 700px;
  margin: auto;
  padding: 1rem 4rem;
  font-weight: bold;
  border-radius: 100vh;
  border-bottom: 7px solid #0C6746;
  background: #139767;
  color: #ffffff!important;
  font-size: 1.5em;
}
a._catebtn:hover {
  margin-top: 6px;
  border-bottom: 1px solid #139767;
  color: #fff;
}
/*a._catebtn::before{content: '';width: 8px;height: 8px;margin-top: -5px;border-top: solid 2px #ffffff;border-right: solid 2px #ffffff;transform: rotate(45deg);position: absolute;top: 50%;right: 2%;}*//*ランキング*/.block-simpleblog-detail--article-body1 .blogrank {
  width: 100%;
  display: flex;
  justify-content: space-between;
}
.block-simpleblog-detail--article-body1 .blogrank .b_item {
  width: 19%;
  font-weight: bold;
  text-align: center;
}
.block-simpleblog-detail--article-body1 .blogrank .b_item p {
  text-align: left;
}
.block-simpleblog-detail--article-body1 .blogrank .b_item img {
  width: 100%;
}
.block-simpleblog-detail--article-body1 .blogrank .b_item._01::before {
  content: url('/img/lp/ico_rank01.png');
  width: 100%;
  margin-bottom: 10px;
}
.block-simpleblog-detail--article-body1 .blogrank .b_item._02::before {
  content: url('/img/lp/ico_rank02.png');
  width: 100%;
  margin-bottom: 10px;
}
.block-simpleblog-detail--article-body1 .blogrank .b_item._03::before {
  content: url('/img/lp/ico_rank03.png');
  width: 100%;
  margin-bottom: 10px;
}
.block-simpleblog-detail--article-body1 .blogrank .b_item._04::before {
  content: url('/img/lp/ico_rank04.png');
  width: 100%;
  margin-bottom: 10px;
}
.block-simpleblog-detail--article-body1 .blogrank .b_item._05::before {
  content: url('/img/lp/ico_rank05.png');
  width: 100%;
  margin-bottom: 10px;
}
/*ここから特集ページバナー追記*/ul.tokusyu {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  box-sizing: border-box;
  width: 100%;
  list-style: none;
  margin: 0 auto;
}
ul.tokusyu li {
  width: 23%;
  margin-bottom: 10px;
}
ul.tokusyu li img {
  width: 100%;
  height: auto;
}
ul.tokusyu::before {
  content: "";
  display: block;
  width: 23%;
  order: 1;
}
ul.tokusyu::after {
  content: "";
  display: block;
  width: 23%;
}
ul.tokusyu li:hover {
  opacity: 0.7;
}
