@charset "UTF-8";
/* ---------------------------------------------------------
_init.scss
最も最初に読み込まれるファイル。settingでmixinを使いたい場合などに利用
----------------------------------------------------------*/
/* ---------------------------------------------------------
サポートするブラウザの設定
  usage
  サポートするブラウザの値をtrueにします。
--------------------------------------------------------- */
/* ---------------------------------------------------------
ブラウザのベンダープリフィックス出力設定
  usage
  出力するブラウザの値をtrueにします。
--------------------------------------------------------- */
/* ---------------------------------------------------------
フォントサイズ＆単位指定
  http://www.skyward-design.net/blog/archives/000122.html

  usage
    _fn_fs(目的のサイズ, 継承したサイズ, 単位)
  return
    変換後のサイズ
----------------------------------------------------------*/
/* ---------------------------------------------------------
フォントサイズ指定（数値→％に変換）
  http://met.hanatoweb.jp/archives/250/

  usage
    _fn_fz(ピクセル換算のサイズ)
    _fn_fz(10) -> font-size: 77%;
  return
    変換後のサイズ（％）
----------------------------------------------------------*/
/* ---------------------------------------------------------
ホバー時に透過する
  usage
  a{
    @include _mx_hover_opacity;
  }
----------------------------------------------------------*/
/* ---------------------------------------------------------
フォントサイズpx->rem変換
  usage
  .test{
    @include _mx_font_size(14);
  }
  基準サイズは未指定なら16pxとする
----------------------------------------------------------*/
/* ---------------------------------------------------------
_setting.scss
Compassの設定、サイト全体のスタイルを定義する
--------------------------------------------------------- */
/* ---------------------------------------------------------
サイトのbaseとなるスタイルや変数を定義します。
！！！定数は大文字で記述！！！
--------------------------------------------------------- */
/* ---------------------------------------------------------
フォントファミリーの設定
  usage
  unquote($FONT_FAMILY1);
--------------------------------------------------------- */
@import url(//fonts.googleapis.com/css?family=PT+Sans+Narrow:400);
.font-family-pt_sans_narrow, .separateNameContainer .separateName {
  font-family: 'PT Sans Narrow', sans-serif;
}

/* ---------------------------------------------------------
テキスト設定
--------------------------------------------------------- */
/* ---------------------------------------------------------
リンクカラーの設定
  使用しない項目は$LINK_COLORの値に統一してください
--------------------------------------------------------- */
/* ---------------------------------------------------------
サイト幅・余白の設定
--------------------------------------------------------- */
/* ---------------------------------------------------------
その他設定
--------------------------------------------------------- */
/* ---------------------------------------------------------
_modules.scss
独自で定義したmixin, placeholderを読み込みます。
----------------------------------------------------------*/
/* ---------------------------------------------------------
疑似要素
  usage
  :before{ @include _mx_bfaf; }
  :after{ @include _mx_bfaf; }
----------------------------------------------------------*/
/* ---------------------------------------------------------
clearfix
  usage
  .aa{
    @extend %_pl_clearfix;
   }
----------------------------------------------------------*/
/* ---------------------------------------------------------
縦方向２色のグラデーション
  usage
  @include _mx_bg_gradient(背景色, グラデ初期色, グラデ最後の色);
----------------------------------------------------------*/
/* ---------------------------------------------------------
画像サイズの取得と出力
  usage
  @include _mx_imgSize("画像名.拡張子");
----------------------------------------------------------*/
/* ---------------------------------------------------------
背景画像をdataURI(date64)で出力する
  usage
  @include _mx_img64("画像名.拡張子");
----------------------------------------------------------*/
/* ---------------------------------------------------------
画像を1/2サイズで表示する
  usage
  @include _mx_halfImg("画像名.拡張子");
----------------------------------------------------------*/
/* ---------------------------------------------------------
背景画像を1/2サイズで表示する
  usage
  @include _mx_bg_halfImg("画像名.拡張子");
----------------------------------------------------------*/
/* ---------------------------------------------------------
リンクのアイコン[>]
  usage
  :before{
    @include _mx_link_arrow(#カラーコード, 方向[up,down,next,prev], 位置(right,left));
  }
----------------------------------------------------------*/
/* ---------------------------------------------------------
テキストリンクのスタイル
  usage
  @include _mx_txt_link(linkLine); //常に下線あり
  @include _mx_txt_link(hoverLine); //hover時に下線あり
  @include _mx_txt_link(noLine); //常に下線なし
----------------------------------------------------------*/
/* ---------------------------------------------------------
ノイズを付与
  usage
  div{
    @include _mx_noise();
  }
----------------------------------------------------------*/
/* ---------------------------------------------------------
_simple_styles_for_horizontal_rules.scss

[CSS]hr要素をおしゃれにスタイリングする8つのテクニック
HTMLは全デモ共通で、hr要素にclass名を付与するだけのシンプルな実装です。
 1:繊細なグラデーションを使ったデザインです。
 2:半透明のグラデーションを使ったデザインです。
 3:点線を使ったデザインです。
 4:ドロップシャドウを使ったデザインです。
 5:Cloud風のデザインです。
 6:埋め込んだようなデザインです。
 7:両サイトをフレアにしたデザインです。
 8:記号文字をアクセントにしたデザインです。

多種のhrを使いたい場合、親クラス名で切り替えるように設計する
8の場合のみ第２引数「記号文字」を使用

via: http://coliss.com/articles/build-websites/operation/css/css-simple-styles-for-horizontal-rules-by-css-tricks.html

scss usage
 @import "simple_styles_for_horizontal_rules";
 .test_hr{
   @include _mx_hr_style(3);
  }

css output
 .test_hr{
  border: 0;
  border-bottom: 1px dashed #ccc;
  background: #999;
 }
----------------------------------------------------------*/
/*csslint outline-none:false*/
.pure-button {
  font-family: inherit;
  font-size: 100%;
  *font-size: 90%;
  /*IE 6/7 - To reduce IE's oversized button text*/
  *overflow: visible;
  /*IE 6/7 - Because of IE's overly large left/right padding on buttons */
  padding: 0.5em 1em;
  color: #444;
  /* rgba not supported (IE 8) */
  color: rgba(0, 0, 0, 0.8);
  /* rgba supported */
  *color: #444;
  /* IE 6 & 7 */
  border: 1px solid #999;
  /*IE 6/7/8*/
  border: none transparent;
  /*IE9 + everything else*/
  background-color: #E6E6E6;
  text-decoration: none;
  border-radius: 2px;
  display: inline-block;
  text-align: center;
}

/*
.pure-button-hover,
.pure-button:hover,
.pure-button:focus {
  filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#00000000', endColorstr='#1a000000',GradientType=0);
  background-image: -webkit-gradient(linear, 0 0, 0 100%, from(transparent), color-stop(40%, rgba(0,0,0, 0.05)), to(rgba(0,0,0, 0.10)));
  background-image: -webkit-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10));
  background-image: -moz-linear-gradient(top, rgba(0,0,0, 0.05) 0%, rgba(0,0,0, 0.10));
  background-image: -o-linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10));
  background-image: linear-gradient(transparent, rgba(0,0,0, 0.05) 40%, rgba(0,0,0, 0.10));
}
*/
.pure-button:focus {
  outline: 0;
}

.pure-button-active,
.pure-button:active {
  box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.15) inset, 0 0 6px rgba(0, 0, 0, 0.2) inset;
}

.pure-button[disabled],
.pure-button-disabled,
.pure-button-disabled:hover,
.pure-button-disabled:focus,
.pure-button-disabled:active {
  border: none;
  background-image: none;
  filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
  filter: alpha(opacity=40);
  -khtml-opacity: 0.40;
  -moz-opacity: 0.40;
  opacity: 0.40;
  cursor: not-allowed;
  box-shadow: none;
}

.pure-button-hidden {
  display: none;
}

/* Firefox: Get rid of the inner focus border */
.pure-button::-moz-focus-inner {
  padding: 0;
  border: 0;
}

.pure-button-primary,
.pure-button-selected,
a.pure-button-primary,
a.pure-button-selected {
  background-color: #0078e7;
  color: #fff;
}

/* ---------------------------------------------------------
pure button設定 (YUI)
--------------------------------------------------------- */
.pure-button-success,
.pure-button-error,
.pure-button-warning,
.pure-button-secondary {
  border-radius: 0;
  border: none;
}

.pure-button-success {
  color: #fff;
  background: #464e54;
}

.pure-button-error {
  color: #fff;
  background: #ec6d71;
}

.pure-button-warning {
  color: #464e54;
  background: #eaeaea;
}

.pure-button-secondary {
  color: #eaeaea;
  background: #00b6b3;
}

.pure-button-return {
  color: #464e54;
  background: #eaeaea;
}

.pure-button-xsmall {
  font-size: 10px;
  font-size: 0.625rem;
}

.pure-button-small {
  font-size: 12px;
  font-size: 0.75rem;
}

.pure-button-large {
  font-size: 18px;
  font-size: 1.125rem;
}

.pure-button-xlarge {
  font-size: 20px;
  font-size: 1.25rem;
}

a.pure-button {
  text-decoration: none;
  -moz-transition-property: background-color;
  -o-transition-property: background-color;
  -webkit-transition-property: background-color;
  transition-property: background-color;
  -moz-transition-duration: 0.5s;
  -o-transition-duration: 0.5s;
  -webkit-transition-duration: 0.5s;
  transition-duration: 0.5s;
}

/*
a.pure-button:link:hover,
a.pure-button[href]:hover {
  opacity: $OPACITY_VALUE;
  text-decoration: none;
  i{
    opacity: $OPACITY_VALUE;
    text-decoration: none;
  }
}
*/
a.pure-button:link:hover,
a.pure-button[href]:hover {
  text-decoration: none;
  border: none;
  opacity: 1;
}
a.pure-button:link:hover i,
a.pure-button[href]:hover i {
  text-decoration: none;
}

a.pure-button-success:link:hover,
a.pure-button-success[href]:hover {
  color: #464e54;
  background-color: #eaeaea;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2VhZWFlYSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2VhZWFlYSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #eaeaea), color-stop(100%, #eaeaea));
  background-image: -moz-linear-gradient(top, #eaeaea, #eaeaea);
  background-image: -webkit-linear-gradient(top, #eaeaea, #eaeaea);
  background-image: linear-gradient(to bottom, #eaeaea, #eaeaea);
}
a.pure-button-success:link:hover i,
a.pure-button-success[href]:hover i {
  color: #464e54;
  background-color: #eaeaea;
}

a.pure-button-return:link:hover,
a.pure-button-return[href]:hover,
a.pure-button-return.selected {
  color: #fff;
  background-color: #464e54;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzQ2NGU1NCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzQ2NGU1NCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background-size: 100%;
  background-image: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #464e54), color-stop(100%, #464e54));
  background-image: -moz-linear-gradient(top, #464e54, #464e54);
  background-image: -webkit-linear-gradient(top, #464e54, #464e54);
  background-image: linear-gradient(to bottom, #464e54, #464e54);
}
a.pure-button-return:link:hover i,
a.pure-button-return[href]:hover i,
a.pure-button-return.selected i {
  color: #fff;
  background-color: #464e54;
}

/*!
 *  Font Awesome 4.0.3 by @davegandy - http://fontawesome.io - @fontawesome
 *  License - http://fontawesome.io/license (Font: SIL OFL 1.1, CSS: MIT License)
 */
/* FONT PATH
 * -------------------------- */
@font-face {
  font-family: 'FontAwesome';
  src: url("../font/font-awesome/fontawesome-webfont.eot?v=4.0.3");
  src: url("../font/font-awesome/fontawesome-webfont.eot?#iefix&v=4.0.3") format("embedded-opentype"), url("../font/font-awesome/fontawesome-webfont.woff?v=4.0.3") format("woff"), url("../font/font-awesome/fontawesome-webfont.ttf?v=4.0.3") format("truetype"), url("../font/font-awesome/fontawesome-webfont.svg?v=4.0.3#fontawesomeregular") format("svg");
  font-weight: normal;
  font-style: normal;
}
.fa {
  display: inline-block;
  font-family: FontAwesome;
  font-style: normal;
  font-weight: normal;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

/* makes the font 33% larger relative to the icon container */
.fa-lg {
  font-size: 1.33333em;
  line-height: 0.75em;
  vertical-align: -15%;
}

.fa-2x {
  font-size: 2em;
}

.fa-3x {
  font-size: 3em;
}

.fa-4x {
  font-size: 4em;
}

.fa-5x {
  font-size: 5em;
}

.fa-fw {
  width: 1.28571em;
  text-align: center;
}

.fa-ul {
  padding-left: 0;
  margin-left: 2.14286em;
  list-style-type: none;
}
.fa-ul > li {
  position: relative;
}

.fa-li {
  position: absolute;
  left: -2.14286em;
  width: 2.14286em;
  top: 0.14286em;
  text-align: center;
}
.fa-li.fa-lg {
  left: -1.85714em;
}

.fa-border {
  padding: .2em .25em .15em;
  border: solid 0.08em #eee;
  border-radius: .1em;
}

.pull-right {
  float: right;
}

.pull-left {
  float: left;
}

.fa.pull-left {
  margin-right: .3em;
}
.fa.pull-right {
  margin-left: .3em;
}

.fa-spin {
  -webkit-animation: spin 2s infinite linear;
  -moz-animation: spin 2s infinite linear;
  -o-animation: spin 2s infinite linear;
  animation: spin 2s infinite linear;
}

@-moz-keyframes spin {
  0% {
    -moz-transform: rotate(0deg);
  }
  100% {
    -moz-transform: rotate(359deg);
  }
}
@-webkit-keyframes spin {
  0% {
    -webkit-transform: rotate(0deg);
  }
  100% {
    -webkit-transform: rotate(359deg);
  }
}
@-o-keyframes spin {
  0% {
    -o-transform: rotate(0deg);
  }
  100% {
    -o-transform: rotate(359deg);
  }
}
@-ms-keyframes spin {
  0% {
    -ms-transform: rotate(0deg);
  }
  100% {
    -ms-transform: rotate(359deg);
  }
}
@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}
.fa-rotate-90 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
}

.fa-rotate-180 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
  -webkit-transform: rotate(180deg);
  -moz-transform: rotate(180deg);
  -ms-transform: rotate(180deg);
  -o-transform: rotate(180deg);
  transform: rotate(180deg);
}

.fa-rotate-270 {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
  -webkit-transform: rotate(270deg);
  -moz-transform: rotate(270deg);
  -ms-transform: rotate(270deg);
  -o-transform: rotate(270deg);
  transform: rotate(270deg);
}

.fa-flip-horizontal {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
  -webkit-transform: scale(-1, 1);
  -moz-transform: scale(-1, 1);
  -ms-transform: scale(-1, 1);
  -o-transform: scale(-1, 1);
  transform: scale(-1, 1);
}

.fa-flip-vertical {
  filter: progid:DXImageTransform.Microsoft.BasicImage(rotation=$rotation);
  -webkit-transform: scale(1, -1);
  -moz-transform: scale(1, -1);
  -ms-transform: scale(1, -1);
  -o-transform: scale(1, -1);
  transform: scale(1, -1);
}

.fa-stack {
  position: relative;
  display: inline-block;
  width: 2em;
  height: 2em;
  line-height: 2em;
  vertical-align: middle;
}

.fa-stack-1x, .fa-stack-2x {
  position: absolute;
  left: 0;
  width: 100%;
  text-align: center;
}

.fa-stack-1x {
  line-height: inherit;
}

.fa-stack-2x {
  font-size: 2em;
}

.fa-inverse {
  color: #fff;
}

/* Font Awesome uses the Unicode Private Use Area (PUA) to ensure screen
   readers do not read off random characters that represent icons */
.fa-glass:before {
  content: "";
}

.fa-music:before {
  content: "";
}

.fa-search:before {
  content: "";
}

.fa-envelope-o:before {
  content: "";
}

.fa-heart:before {
  content: "";
}

.fa-star:before {
  content: "";
}

.fa-star-o:before {
  content: "";
}

.fa-user:before {
  content: "";
}

.fa-film:before {
  content: "";
}

.fa-th-large:before {
  content: "";
}

.fa-th:before {
  content: "";
}

.fa-th-list:before {
  content: "";
}

.fa-check:before {
  content: "";
}

.fa-times:before {
  content: "";
}

.fa-search-plus:before {
  content: "";
}

.fa-search-minus:before {
  content: "";
}

.fa-power-off:before {
  content: "";
}

.fa-signal:before {
  content: "";
}

.fa-gear:before,
.fa-cog:before {
  content: "";
}

.fa-trash-o:before {
  content: "";
}

.fa-home:before {
  content: "";
}

.fa-file-o:before {
  content: "";
}

.fa-clock-o:before {
  content: "";
}

.fa-road:before {
  content: "";
}

.fa-download:before {
  content: "";
}

.fa-arrow-circle-o-down:before {
  content: "";
}

.fa-arrow-circle-o-up:before {
  content: "";
}

.fa-inbox:before {
  content: "";
}

.fa-play-circle-o:before {
  content: "";
}

.fa-rotate-right:before,
.fa-repeat:before {
  content: "";
}

.fa-refresh:before {
  content: "";
}

.fa-list-alt:before {
  content: "";
}

.fa-lock:before {
  content: "";
}

.fa-flag:before {
  content: "";
}

.fa-headphones:before {
  content: "";
}

.fa-volume-off:before {
  content: "";
}

.fa-volume-down:before {
  content: "";
}

.fa-volume-up:before {
  content: "";
}

.fa-qrcode:before {
  content: "";
}

.fa-barcode:before {
  content: "";
}

.fa-tag:before {
  content: "";
}

.fa-tags:before {
  content: "";
}

.fa-book:before {
  content: "";
}

.fa-bookmark:before {
  content: "";
}

.fa-print:before {
  content: "";
}

.fa-camera:before {
  content: "";
}

.fa-font:before {
  content: "";
}

.fa-bold:before {
  content: "";
}

.fa-italic:before {
  content: "";
}

.fa-text-height:before {
  content: "";
}

.fa-text-width:before {
  content: "";
}

.fa-align-left:before {
  content: "";
}

.fa-align-center:before {
  content: "";
}

.fa-align-right:before {
  content: "";
}

.fa-align-justify:before {
  content: "";
}

.fa-list:before {
  content: "";
}

.fa-dedent:before,
.fa-outdent:before {
  content: "";
}

.fa-indent:before {
  content: "";
}

.fa-video-camera:before {
  content: "";
}

.fa-picture-o:before {
  content: "";
}

.fa-pencil:before {
  content: "";
}

.fa-map-marker:before {
  content: "";
}

.fa-adjust:before {
  content: "";
}

.fa-tint:before {
  content: "";
}

.fa-edit:before,
.fa-pencil-square-o:before {
  content: "";
}

.fa-share-square-o:before {
  content: "";
}

.fa-check-square-o:before {
  content: "";
}

.fa-arrows:before {
  content: "";
}

.fa-step-backward:before {
  content: "";
}

.fa-fast-backward:before {
  content: "";
}

.fa-backward:before {
  content: "";
}

.fa-play:before {
  content: "";
}

.fa-pause:before {
  content: "";
}

.fa-stop:before {
  content: "";
}

.fa-forward:before {
  content: "";
}

.fa-fast-forward:before {
  content: "";
}

.fa-step-forward:before {
  content: "";
}

.fa-eject:before {
  content: "";
}

.fa-chevron-left:before {
  content: "";
}

.fa-chevron-right:before {
  content: "";
}

.fa-plus-circle:before {
  content: "";
}

.fa-minus-circle:before {
  content: "";
}

.fa-times-circle:before {
  content: "";
}

.fa-check-circle:before {
  content: "";
}

.fa-question-circle:before {
  content: "";
}

.fa-info-circle:before {
  content: "";
}

.fa-crosshairs:before {
  content: "";
}

.fa-times-circle-o:before {
  content: "";
}

.fa-check-circle-o:before {
  content: "";
}

.fa-ban:before {
  content: "";
}

.fa-arrow-left:before {
  content: "";
}

.fa-arrow-right:before {
  content: "";
}

.fa-arrow-up:before {
  content: "";
}

.fa-arrow-down:before {
  content: "";
}

.fa-mail-forward:before,
.fa-share:before {
  content: "";
}

.fa-expand:before {
  content: "";
}

.fa-compress:before {
  content: "";
}

.fa-plus:before {
  content: "";
}

.fa-minus:before {
  content: "";
}

.fa-asterisk:before {
  content: "";
}

.fa-exclamation-circle:before {
  content: "";
}

.fa-gift:before {
  content: "";
}

.fa-leaf:before {
  content: "";
}

.fa-fire:before {
  content: "";
}

.fa-eye:before {
  content: "";
}

.fa-eye-slash:before {
  content: "";
}

.fa-warning:before,
.fa-exclamation-triangle:before {
  content: "";
}

.fa-plane:before {
  content: "";
}

.fa-calendar:before {
  content: "";
}

.fa-random:before {
  content: "";
}

.fa-comment:before {
  content: "";
}

.fa-magnet:before {
  content: "";
}

.fa-chevron-up:before {
  content: "";
}

.fa-chevron-down:before {
  content: "";
}

.fa-retweet:before {
  content: "";
}

.fa-shopping-cart:before {
  content: "";
}

.fa-folder:before {
  content: "";
}

.fa-folder-open:before {
  content: "";
}

.fa-arrows-v:before {
  content: "";
}

.fa-arrows-h:before {
  content: "";
}

.fa-bar-chart-o:before {
  content: "";
}

.fa-twitter-square:before {
  content: "";
}

.fa-facebook-square:before {
  content: "";
}

.fa-camera-retro:before {
  content: "";
}

.fa-key:before {
  content: "";
}

.fa-gears:before,
.fa-cogs:before {
  content: "";
}

.fa-comments:before {
  content: "";
}

.fa-thumbs-o-up:before {
  content: "";
}

.fa-thumbs-o-down:before {
  content: "";
}

.fa-star-half:before {
  content: "";
}

.fa-heart-o:before {
  content: "";
}

.fa-sign-out:before {
  content: "";
}

.fa-linkedin-square:before {
  content: "";
}

.fa-thumb-tack:before {
  content: "";
}

.fa-external-link:before {
  content: "";
}

.fa-sign-in:before {
  content: "";
}

.fa-trophy:before {
  content: "";
}

.fa-github-square:before {
  content: "";
}

.fa-upload:before {
  content: "";
}

.fa-lemon-o:before {
  content: "";
}

.fa-phone:before {
  content: "";
}

.fa-square-o:before {
  content: "";
}

.fa-bookmark-o:before {
  content: "";
}

.fa-phone-square:before {
  content: "";
}

.fa-twitter:before {
  content: "";
}

.fa-facebook:before {
  content: "";
}

.fa-github:before {
  content: "";
}

.fa-unlock:before {
  content: "";
}

.fa-credit-card:before {
  content: "";
}

.fa-rss:before {
  content: "";
}

.fa-hdd-o:before {
  content: "";
}

.fa-bullhorn:before {
  content: "";
}

.fa-bell:before {
  content: "";
}

.fa-certificate:before {
  content: "";
}

.fa-hand-o-right:before {
  content: "";
}

.fa-hand-o-left:before {
  content: "";
}

.fa-hand-o-up:before {
  content: "";
}

.fa-hand-o-down:before {
  content: "";
}

.fa-arrow-circle-left:before {
  content: "";
}

.fa-arrow-circle-right:before {
  content: "";
}

.fa-arrow-circle-up:before {
  content: "";
}

.fa-arrow-circle-down:before {
  content: "";
}

.fa-globe:before {
  content: "";
}

.fa-wrench:before {
  content: "";
}

.fa-tasks:before {
  content: "";
}

.fa-filter:before {
  content: "";
}

.fa-briefcase:before {
  content: "";
}

.fa-arrows-alt:before {
  content: "";
}

.fa-group:before,
.fa-users:before {
  content: "";
}

.fa-chain:before,
.fa-link:before {
  content: "";
}

.fa-cloud:before {
  content: "";
}

.fa-flask:before {
  content: "";
}

.fa-cut:before,
.fa-scissors:before {
  content: "";
}

.fa-copy:before,
.fa-files-o:before {
  content: "";
}

.fa-paperclip:before {
  content: "";
}

.fa-save:before,
.fa-floppy-o:before {
  content: "";
}

.fa-square:before {
  content: "";
}

.fa-bars:before {
  content: "";
}

.fa-list-ul:before {
  content: "";
}

.fa-list-ol:before {
  content: "";
}

.fa-strikethrough:before {
  content: "";
}

.fa-underline:before {
  content: "";
}

.fa-table:before {
  content: "";
}

.fa-magic:before {
  content: "";
}

.fa-truck:before {
  content: "";
}

.fa-pinterest:before {
  content: "";
}

.fa-pinterest-square:before {
  content: "";
}

.fa-google-plus-square:before {
  content: "";
}

.fa-google-plus:before {
  content: "";
}

.fa-money:before {
  content: "";
}

.fa-caret-down:before {
  content: "";
}

.fa-caret-up:before {
  content: "";
}

.fa-caret-left:before {
  content: "";
}

.fa-caret-right:before {
  content: "";
}

.fa-columns:before {
  content: "";
}

.fa-unsorted:before,
.fa-sort:before {
  content: "";
}

.fa-sort-down:before,
.fa-sort-asc:before {
  content: "";
}

.fa-sort-up:before,
.fa-sort-desc:before {
  content: "";
}

.fa-envelope:before {
  content: "";
}

.fa-linkedin:before {
  content: "";
}

.fa-rotate-left:before,
.fa-undo:before {
  content: "";
}

.fa-legal:before,
.fa-gavel:before {
  content: "";
}

.fa-dashboard:before,
.fa-tachometer:before {
  content: "";
}

.fa-comment-o:before {
  content: "";
}

.fa-comments-o:before {
  content: "";
}

.fa-flash:before,
.fa-bolt:before {
  content: "";
}

.fa-sitemap:before {
  content: "";
}

.fa-umbrella:before {
  content: "";
}

.fa-paste:before,
.fa-clipboard:before {
  content: "";
}

.fa-lightbulb-o:before {
  content: "";
}

.fa-exchange:before {
  content: "";
}

.fa-cloud-download:before {
  content: "";
}

.fa-cloud-upload:before {
  content: "";
}

.fa-user-md:before {
  content: "";
}

.fa-stethoscope:before {
  content: "";
}

.fa-suitcase:before {
  content: "";
}

.fa-bell-o:before {
  content: "";
}

.fa-coffee:before {
  content: "";
}

.fa-cutlery:before {
  content: "";
}

.fa-file-text-o:before {
  content: "";
}

.fa-building-o:before {
  content: "";
}

.fa-hospital-o:before {
  content: "";
}

.fa-ambulance:before {
  content: "";
}

.fa-medkit:before {
  content: "";
}

.fa-fighter-jet:before {
  content: "";
}

.fa-beer:before {
  content: "";
}

.fa-h-square:before {
  content: "";
}

.fa-plus-square:before {
  content: "";
}

.fa-angle-double-left:before {
  content: "";
}

.fa-angle-double-right:before {
  content: "";
}

.fa-angle-double-up:before {
  content: "";
}

.fa-angle-double-down:before {
  content: "";
}

.fa-angle-left:before {
  content: "";
}

.fa-angle-right:before {
  content: "";
}

.fa-angle-up:before {
  content: "";
}

.fa-angle-down:before {
  content: "";
}

.fa-desktop:before {
  content: "";
}

.fa-laptop:before {
  content: "";
}

.fa-tablet:before {
  content: "";
}

.fa-mobile-phone:before,
.fa-mobile:before {
  content: "";
}

.fa-circle-o:before {
  content: "";
}

.fa-quote-left:before {
  content: "";
}

.fa-quote-right:before {
  content: "";
}

.fa-spinner:before {
  content: "";
}

.fa-circle:before {
  content: "";
}

.fa-mail-reply:before,
.fa-reply:before {
  content: "";
}

.fa-github-alt:before {
  content: "";
}

.fa-folder-o:before {
  content: "";
}

.fa-folder-open-o:before {
  content: "";
}

.fa-smile-o:before {
  content: "";
}

.fa-frown-o:before {
  content: "";
}

.fa-meh-o:before {
  content: "";
}

.fa-gamepad:before {
  content: "";
}

.fa-keyboard-o:before {
  content: "";
}

.fa-flag-o:before {
  content: "";
}

.fa-flag-checkered:before {
  content: "";
}

.fa-terminal:before {
  content: "";
}

.fa-code:before {
  content: "";
}

.fa-reply-all:before {
  content: "";
}

.fa-mail-reply-all:before {
  content: "";
}

.fa-star-half-empty:before,
.fa-star-half-full:before,
.fa-star-half-o:before {
  content: "";
}

.fa-location-arrow:before {
  content: "";
}

.fa-crop:before {
  content: "";
}

.fa-code-fork:before {
  content: "";
}

.fa-unlink:before,
.fa-chain-broken:before {
  content: "";
}

.fa-question:before {
  content: "";
}

.fa-info:before {
  content: "";
}

.fa-exclamation:before {
  content: "";
}

.fa-superscript:before {
  content: "";
}

.fa-subscript:before {
  content: "";
}

.fa-eraser:before {
  content: "";
}

.fa-puzzle-piece:before {
  content: "";
}

.fa-microphone:before {
  content: "";
}

.fa-microphone-slash:before {
  content: "";
}

.fa-shield:before {
  content: "";
}

.fa-calendar-o:before {
  content: "";
}

.fa-fire-extinguisher:before {
  content: "";
}

.fa-rocket:before {
  content: "";
}

.fa-maxcdn:before {
  content: "";
}

.fa-chevron-circle-left:before {
  content: "";
}

.fa-chevron-circle-right:before {
  content: "";
}

.fa-chevron-circle-up:before {
  content: "";
}

.fa-chevron-circle-down:before {
  content: "";
}

.fa-html5:before {
  content: "";
}

.fa-css3:before {
  content: "";
}

.fa-anchor:before {
  content: "";
}

.fa-unlock-alt:before {
  content: "";
}

.fa-bullseye:before {
  content: "";
}

.fa-ellipsis-h:before {
  content: "";
}

.fa-ellipsis-v:before {
  content: "";
}

.fa-rss-square:before {
  content: "";
}

.fa-play-circle:before {
  content: "";
}

.fa-ticket:before {
  content: "";
}

.fa-minus-square:before {
  content: "";
}

.fa-minus-square-o:before {
  content: "";
}

.fa-level-up:before {
  content: "";
}

.fa-level-down:before {
  content: "";
}

.fa-check-square:before {
  content: "";
}

.fa-pencil-square:before {
  content: "";
}

.fa-external-link-square:before {
  content: "";
}

.fa-share-square:before {
  content: "";
}

.fa-compass:before {
  content: "";
}

.fa-toggle-down:before,
.fa-caret-square-o-down:before {
  content: "";
}

.fa-toggle-up:before,
.fa-caret-square-o-up:before {
  content: "";
}

.fa-toggle-right:before,
.fa-caret-square-o-right:before {
  content: "";
}

.fa-euro:before,
.fa-eur:before {
  content: "";
}

.fa-gbp:before {
  content: "";
}

.fa-dollar:before,
.fa-usd:before {
  content: "";
}

.fa-rupee:before,
.fa-inr:before {
  content: "";
}

.fa-cny:before,
.fa-rmb:before,
.fa-yen:before,
.fa-jpy:before {
  content: "";
}

.fa-ruble:before,
.fa-rouble:before,
.fa-rub:before {
  content: "";
}

.fa-won:before,
.fa-krw:before {
  content: "";
}

.fa-bitcoin:before,
.fa-btc:before {
  content: "";
}

.fa-file:before {
  content: "";
}

.fa-file-text:before {
  content: "";
}

.fa-sort-alpha-asc:before {
  content: "";
}

.fa-sort-alpha-desc:before {
  content: "";
}

.fa-sort-amount-asc:before {
  content: "";
}

.fa-sort-amount-desc:before {
  content: "";
}

.fa-sort-numeric-asc:before {
  content: "";
}

.fa-sort-numeric-desc:before {
  content: "";
}

.fa-thumbs-up:before {
  content: "";
}

.fa-thumbs-down:before {
  content: "";
}

.fa-youtube-square:before {
  content: "";
}

.fa-youtube:before {
  content: "";
}

.fa-xing:before {
  content: "";
}

.fa-xing-square:before {
  content: "";
}

.fa-youtube-play:before {
  content: "";
}

.fa-dropbox:before {
  content: "";
}

.fa-stack-overflow:before {
  content: "";
}

.fa-instagram:before {
  content: "";
}

.fa-flickr:before {
  content: "";
}

.fa-adn:before {
  content: "";
}

.fa-bitbucket:before {
  content: "";
}

.fa-bitbucket-square:before {
  content: "";
}

.fa-tumblr:before {
  content: "";
}

.fa-tumblr-square:before {
  content: "";
}

.fa-long-arrow-down:before {
  content: "";
}

.fa-long-arrow-up:before {
  content: "";
}

.fa-long-arrow-left:before {
  content: "";
}

.fa-long-arrow-right:before {
  content: "";
}

.fa-apple:before {
  content: "";
}

.fa-windows:before {
  content: "";
}

.fa-android:before {
  content: "";
}

.fa-linux:before {
  content: "";
}

.fa-dribbble:before {
  content: "";
}

.fa-skype:before {
  content: "";
}

.fa-foursquare:before {
  content: "";
}

.fa-trello:before {
  content: "";
}

.fa-female:before {
  content: "";
}

.fa-male:before {
  content: "";
}

.fa-gittip:before {
  content: "";
}

.fa-sun-o:before {
  content: "";
}

.fa-moon-o:before {
  content: "";
}

.fa-archive:before {
  content: "";
}

.fa-bug:before {
  content: "";
}

.fa-vk:before {
  content: "";
}

.fa-weibo:before {
  content: "";
}

.fa-renren:before {
  content: "";
}

.fa-pagelines:before {
  content: "";
}

.fa-stack-exchange:before {
  content: "";
}

.fa-arrow-circle-o-right:before {
  content: "";
}

.fa-arrow-circle-o-left:before {
  content: "";
}

.fa-toggle-left:before,
.fa-caret-square-o-left:before {
  content: "";
}

.fa-dot-circle-o:before {
  content: "";
}

.fa-wheelchair:before {
  content: "";
}

.fa-vimeo-square:before {
  content: "";
}

.fa-turkish-lira:before,
.fa-try:before {
  content: "";
}

.fa-plus-square-o:before {
  content: "";
}

/* Main menu wrapper */
.cbp-hsmenu-wrapper {
  position: relative;
}

/* Common style for all lists */
.cbp-hsmenu-wrapper ul {
  list-style: none;
  padding: 0;
  margin: 0 auto;
}

/* 100% width bar for menu */
.cbp-hsinner {
  /*	background: #47a3da; */
  position: relative;
  z-index: 100;
}

/* Main menu style */
.cbp-hsmenu-wrapper .cbp-hsmenu {
  /*	width: 90%; */
  max-width: 60em;
  /* 69em */
  margin: 0 0 0 20px;
  /* 0 auto */
  padding: 0 1.875em;
}

.cbp-hsmenu > li {
  display: inline-block;
}

.cbp-hsmenu > li:first-child {
  margin-left: 0;
}

/* Main menu link style */
.cbp-hsmenu > li > a {
  /*	color: #fff;
      font-size: 1.2em;
      line-height: 3em;*/
  display: inline-block;
  position: relative;
  z-index: 10000;
  outline: none;
}

.no-touch .cbp-hsmenu > li > a:hover,
.no-touch .cbp-hsmenu > li > a:focus,
.cbp-hsmenu > li.cbp-hsitem-open > a {
  /*	color: #02639d; */
}

/* Add an arrow to the main menu link if it has a submenu (not the only child) */
.cbp-hsmenu > li > a:not(:only-child):before {
  display: inline-block;
  /*	font-family: 'bpmenu';*/
  speak: none;
  font-style: normal;
  font-weight: normal;
  font-variant: normal;
  text-transform: none;
  line-height: 1;
  -webkit-font-smoothing: antialiased;
  /*	content: "\f107"; */
  font-size: 80%;
  margin-right: 0.3em;
  opacity: 0.4;
  vertical-align: middle;
}

.cbp-hsmenu > li.cbp-hsitem-open > a:not(:only-child):before {
  /*	content: "\f106"; */
}

/* Add a triangle to currently open menu item link */
.cbp-hsmenu > li.cbp-hsitem-open > a:after {
  top: 100%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: transparent;
  /*	border-top-color: #47a3da; */
  border-width: 10px;
  left: 50%;
  margin-left: -10px;
}

/* Submenu style */
.cbp-hssubmenu {
  position: absolute;
  left: 0;
  top: 100%;
  width: 100%;
  z-index: 0;
  text-align: center;
  /* for aligning the sub items */
  visibility: hidden;
}

.cbp-hssubmenu:before,
.cbp-hssubmenu:after {
  content: " ";
  display: table;
}

.cbp-hssubmenu:after {
  clear: both;
}

/* Let's allow 6 item in a row */
.cbp-hssubmenu > li {
  width: 16.2%;
  display: inline-block;
  vertical-align: top;
  box-shadow: -28px 0 0 -27px #ddd, 0 -28px 0 -27px #ddd;
  opacity: 0;
  -webkit-transition: opacity 0.1s 0s;
  -moz-transition: opacity 0.1s 0s;
  transition: opacity 0.1s 0s;
}

/* First 6 items don't have upper box shadow */
.cbp-hssubmenu > li:nth-child(-n+6) {
  box-shadow: -28px 0 0 -27px #ddd;
}

/* Every 7th item does not have a left box shadow */
.cbp-hssubmenu > li:nth-child(6n+1) {
  box-shadow: 0 -28px 0 -27px #ddd;
}

/* The first one does not have any box shadow */
.cbp-hssubmenu > li:first-child {
  box-shadow: none;
}

.cbp-hssubmenu > li a {
  display: block;
  text-align: center;
  /*	color: #a2a2a2; */
  outline: none;
  padding: 2em 1em 1em 1em;
}

.no-touch .cbp-hssubmenu > li a:hover,
.no-touch .cbp-hssubmenu > li a:focus {
  /*	color: #888; */
}

.cbp-hssubmenu > li a img {
  border: none;
  outline: none;
  display: inline-block;
  margin: 0;
  max-width: 100%;
  -webkit-transition: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  transition: opacity 0.2s;
}

.no-touch .cbp-hssubmenu > li a:hover img {
  opacity: 0.5;
}

.cbp-hssubmenu > li a span {
  display: block;
  min-height: 3em;
  margin-top: 0.4em;
}

.cbp-hsmenu > li.cbp-hsitem-open .cbp-hssubmenu {
  z-index: 1000;
  visibility: visible;
}

.cbp-hsmenu > li.cbp-hsitem-open > a {
  /* add LL */
  color: #00b6b3;
}

.cbp-hsmenu > li.cbp-hsitem-open .cbp-hssubmenu > li {
  opacity: 1;
  -webkit-transition: opacity 0.5s 0.1s;
  -moz-transition: opacity 0.5s 0.1s;
  transition: opacity 0.5s 0.1s;
}

/* Helper div for animating the background */
.cbp-hsmenubg {
  background: #f7f7f7;
  position: absolute;
  width: 100%;
  top: 100%;
  left: 0;
  z-index: 0;
  height: 0px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.2);
}

.no-touch .cbp-hsmenubg {
  -webkit-transition: height 0.3s;
  -moz-transition: height 0.3s;
  transition: height 0.3s;
}

.cbp-hsmenu .level1 > .category_body > a {
  width: 16.2%;
  padding: 10px;
  margin: 0 auto 20px;
  border: 1px solid #ccc;
  display: block;
}

.cbp-hsmenu .level2 {
  display: inline-block;
  vertical-align: top;
  width: 16.2%;
  margin-bottom: 20px;
}

.cbp-hsmenu .level2 > .category_body > a {
  padding: 10px;
  display: block;
  border: 1px solid #ccc;
}

/* ---------------------------------------------------------
_contents.scss
各ページコンテンツ関連のスタイルを設定します。
----------------------------------------------------------*/
/************************************************
 各ページコンテンツ用
************************************************ */
/* ==============================================
▼TOP
=============================================== */
/* メインイメージ
----------------------------------------------- */
#main_image {
  margin-bottom: 10px;
  text-align: center;
}

/* ==============================================
▼下層
=============================================== */
/* ==============================================
▼ガイド
=============================================== */
/* ◎◎について
----------------------------------------------- */
/* 特定商取引法
----------------------------------------------- */
/* お問い合わせ
----------------------------------------------- */
#undercolumn_contact {
  margin: 0 auto;
  width: 100%;
}

.zipimg img {
  vertical-align: middle;
}

/* ==============================================
▼MYページ
=============================================== */
/* 共通設定
----------------------------------------------- */
#mypagecolumn {
  width: 980px;
  margin: 0 auto;
}
#mypagecolumn h4 {
  margin: 10px auto;
  text-align: left;
  font-size: 1.9;
}

#mynavi_area {
  text-align: center;
}
#mynavi_area .mynavi_list {
  margin-bottom: 20px;
}
#mynavi_area .mynavi_list a {
  color: #00b6b3;
  border: 1px solid #fff;
  padding: 5px;
}
#mynavi_area .mynavi_list li {
  padding-left: 15px;
  font-size: 1.9;
  display: inline-block;
}
#mynavi_area .mynavi_list .selected {
  border: 1px solid #00b6b3;
}
#mynavi_area .point_announce {
  margin-bottom: 30px;
  padding: 0 10px;
}
#mynavi_area .point_announce p {
  padding-left: 20px;
}

#mycontents_area .inforamtion {
  margin-bottom: 20px;
}

/* 購入履歴一覧/詳細
----------------------------------------------- */
#mycontents_area .mycondition_area {
  margin: 0 auto 20px 0;
  padding: 10px;
  width: 97%;
}
#mycontents_area .mycondition_area p {
  float: left;
}
#mycontents_area .mycondition_area .btn {
  margin-top: 15px;
  float: right;
}
#mycontents_area .detail_link {
  width: 100%;
  height: 40px;
  display: block;
  background-color: #eaeaea;
  line-height: 40px;
}

.add_address {
  margin-bottom: 20px;
}

/* 会員登録内容変更/退会
----------------------------------------------- */
#mycontents_area .message_area {
  margin: 30px auto;
  padding: 30px;
  text-align: center;
}
#mycontents_area .message_area p {
  margin-bottom: 20px;
}

/* 登録カード一覧・編集 20141126add LL
----------------------------------------------- */
.fr_registed_card_list > li {
  display: inline-block;
  margin-right: 24px;
  margin-bottom: 24px;
}

.fr_registed_card_list > li:nth-child(3n) {
  margin-right: 0;
}

.fr_registed_card_list_item {
  background-color: #F7F7F7;
  border: 1px solid #ccc;
  width: 300px;
  height: 150px;
  border-radius: 10px;
  position: relative;
}

.fr_registed_card_list_item_no {
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 250px;
  height: 16px;
  margin: auto;
  text-align: center;
  font-size: 16px;
}

.fr_registed_card_list_item_exp {
  position: absolute;
  top: 70px;
  left: 0;
  right: 0;
  bottom: 0;
  width: 250px;
  height: 16px;
  margin: auto;
  text-align: center;
  font-size: 16px;
}

.fr_registed_card_list_item_name {
  position: absolute;
  top: 115px;
  left: 0;
  right: 0;
  bottom: 0;
  width: 250px;
  height: 16px;
  margin: auto;
  text-align: center;
  font-size: 16px;
}

.fr_registed_card_list_item_delete {
  position: absolute;
  top: 10px;
  right: 10px;
}

.fr_registed_card_list_item_select {
  display: none;
}

.fr_registed_card_list_item_select:checked + .fr_registed_card_list_item {
  border: 1px solid #00b6b3;
  color: #00b6b3;
}

/* ==============================================
▼会員登録
=============================================== */
div#undercolumn_entry {
  width: 100%;
}
div#undercolumn_entry .kiyaku_text {
  margin: 20px auto;
  padding: 10px;
  width: 94%;
}

/* ==============================================
▼ログイン
=============================================== */
#undercolumn_login, #login_area .block_body, #search_area {
  margin: 0 auto;
  width: 100%;
}
#undercolumn_login .login_area, #login_area .block_body .login_area, #search_area .login_area {
  margin-bottom: 40px;
  width: 430px;
  height: 480px;
  float: left;
  border: 1px solid #eee;
  padding: 20px;
}
#undercolumn_login .login_area:last-child, #login_area .block_body .login_area:last-child, #search_area .login_area:last-child {
  margin-left: 20px;
}
#undercolumn_login .separateNameContainer, #login_area .block_body .separateNameContainer, #search_area .separateNameContainer {
  margin-top: 20px;
  margin-bottom: 40px;
}
#undercolumn_login .inputbox, #login_area .block_body .inputbox, #search_area .inputbox {
  width: 240px;
  margin: 15px auto;
}
#undercolumn_login .inputbox .btn_area, #login_area .block_body .inputbox .btn_area, #search_area .inputbox .btn_area {
  margin-bottom: 20px;
}
#undercolumn_login .inputbox .login_memory, #login_area .block_body .inputbox .login_memory, #search_area .inputbox .login_memory {
  margin: 2px 0 10px;
}
#undercolumn_login .inputbox .login_memory label, #login_area .block_body .inputbox .login_memory label, #search_area .inputbox .login_memory label {
  cursor: pointer;
}
#undercolumn_login .notes > li, #login_area .block_body .notes > li, #search_area .notes > li {
  list-style-type: none;
  text-indent: -1em;
  margin-bottom: 10px;
  font-size: 12px;
}
#undercolumn_login .notes > li a, #login_area .block_body .notes > li a, #search_area .notes > li a {
  color: #00b6b3;
}
#undercolumn_login .notes > li:before, #login_area .block_body .notes > li:before, #search_area .notes > li:before {
  display: inline;
  content: "※";
}
#undercolumn_login .pure-button, #login_area .block_body .pure-button, #search_area .pure-button {
  width: 212px;
}

/* ==============================================
▼エラー
=============================================== */
#undercolumn_error .message_area {
  width: 80%;
  margin: 30px auto;
  padding: 30px;
  text-align: center;
}
#undercolumn_error .message_area .error {
  padding: 120px 0;
}

/* お客様情報入力
----------------------------------------------- */
.flow_area {
  margin: 0 0 20px 0;
  position: relative;
  height: 50px;
}
.flow_area img {
  display: none;
}
.flow_area ul {
  margin: 0;
  padding: 0;
  position: absolute;
  left: 0;
  bottom: 0;
  list-style: none;
}
.flow_area ul li {
  float: left;
  height: 50px;
  line-height: 50px;
  position: relative;
  font-size: 14px;
  padding: 0 40px;
  text-align: center;
  margin-left: 25px;
  background: #eaeaea;
  color: #464e54;
}
.flow_area ul li:first-of-type {
  margin-left: 0;
}
.flow_area ul li:after {
  content: "";
  float: right;
  position: absolute;
  top: 0;
  right: -25px;
  width: 0;
  height: 0;
  border-color: transparent transparent transparent #eaeaea;
  border-style: solid;
  border-width: 25px 0 25px 25px;
}
.flow_area ul li:nth-child(2) {
  padding: 0;
}
.flow_area .selected_flow {
  background: #00b6b3;
  color: #fff;
}
.flow_area .selected_flow i {
  color: #fff;
}
.flow_area .selected_flow:after {
  border-color: transparent transparent transparent #00b6b3;
}

#undercolumn_customer th em {
  font-weight: bold;
}

/* お支払い方法・お届け時間等の指定
----------------------------------------------- */
#undercolumn_shopping {
  /* 日曜 */
  /* 土曜 */
}
#undercolumn_shopping .pay_area {
  width: 100%;
  margin: 40px auto 60px;
}
#undercolumn_shopping .pay_area .point_announce {
  padding: 20px;
}
#undercolumn_shopping .pay_area .point_announce li {
  margin-bottom: 5px;
}
#undercolumn_shopping .pay_area p {
  margin-bottom: 20px;
}
#undercolumn_shopping .pay_area02 {
  margin: 40px auto 60px;
}
#undercolumn_shopping .pay_area02 .txtarea {
  margin: 5px 0 0 0;
  padding: 2px;
  width: 99%;
  height: 150px;
}
#undercolumn_shopping .pay_area02 .select-msg {
  margin-bottom: 10px;
}
#undercolumn_shopping .picker__table th,
#undercolumn_shopping .picker__table td {
  text-align: center;
}
#undercolumn_shopping .picker__weekday:first-child,
#undercolumn_shopping .picker__table tr td:first-child {
  color: #ec6d71;
}
#undercolumn_shopping .picker__weekday:last-child,
#undercolumn_shopping .picker__table tr td:last-child {
  color: #6f6fed;
}

.fr_periodic_list_border_top th,
.fr_periodic_list_border_top td {
  border-top: 2px solid #00b6b3;
}

/* お届け先の指定
----------------------------------------------- */
#address_area {
  margin-bottom: 10px;
  width: 100%;
}
#address_area .information {
  width: 66%;
  float: left;
}
#address_area .add_multiple {
  padding: 15px 10px;
  float: right;
  width: 30%;
  text-align: center;
}
#address_area .add_multiple p {
  margin-bottom: 10px;
}

#undercolumn_shopping .checked_state {
  background-color: rgba(0, 182, 179, 0.1);
}
#undercolumn_shopping .tr_selectable th, #undercolumn_shopping .tr_selectable td {
  cursor: pointer;
}
#undercolumn_shopping .tr_selectable td label {
  width: 100%;
  height: 100%;
  display: block;
}

/* ==============================================
▼店舗一覧
=============================================== */
.fr_category_menu_dot {
  font-size: 16px;
}

.shop_category {
  margin: 0 auto 60px;
  text-align: center;
}
.shop_category li {
  display: inline-block;
  padding: 10px;
  background-color: #eaeaea;
  margin: 0 10px 10px 0;
  width: 20%;
}
.shop_category li a {
  display: block;
  padding: 10px 0;
  border: 1px solid #eaeaea;
  text-align: center;
}
.shop_category li a:hover {
  border-style: solid;
  border-width: 1px;
  border-color: #464e54 #eaeaea;
  text-decoration: none;
}

.shoplist_row_view1 .shoplist_category_row {
  margin: 60px 0 20px;
}
.shoplist_row_view1 .shoplist_category_row h3 {
  border-top: 1px solid #00b6b3;
  display: inline-block;
  width: 100%;
  margin-bottom: 14px;
  text-align: center;
}
.shoplist_row_view1 .shoplist_category_row h3 span {
  display: block;
  color: #00b6b3;
  font-size: 16px;
  text-transform: uppercase;
  background-color: #fff;
  width: 200px;
  margin: -12px auto 0 auto;
}
.shoplist_row_view1 .shoplist_item_row {
  margin: 0 0 60px;
}
.shoplist_row_view1 .shoplist_item_row h3 {
  font-size: 20px;
  line-height: 1em;
  letter-spacing: 1px;
  text-align: center;
  margin-bottom: 10px;
}
.shoplist_row_view1 .shoplist_item_row .shoplist_name {
  border-bottom: 1px solid #464e54;
  padding-bottom: 10px;
  margin-bottom: 10px;
}
.shoplist_row_view1 .shoplist_item_row dl {
  overflow: hidden;
  zoom: 1;
}
.shoplist_row_view1 .shoplist_item_row dl dt {
  width: 500px;
  height: 300px;
  float: left;
  clear: both;
  overflow: hidden;
  position: relative;
}
.shoplist_row_view1 .shoplist_item_row dl dt img {
  clip: rect(0, 500px, 300px, 0);
  position: absolute;
}
.shoplist_row_view1 .shoplist_item_row dl dd {
  padding: 0 0 5px 520px;
}

.shoplist_row_view2 .shoplist_category_row th {
  color: #00b6b3;
}
.shoplist_row_view2 .shoplist_category_row:not(:nth-of-type(1)) th {
  padding-top: 60px;
}
.shoplist_row_view2 .shoplist_item_row h3 {
  font-size: 20px;
  margin-bottom: 20px;
}
.shoplist_row_view2 .shop_image {
  max-width: 200px;
  max-height: 200px;
}
.shoplist_row_view2 .shop_detail_link {
  width: 100%;
  height: 200px;
  display: block;
  background-color: #eaeaea;
  line-height: 200px;
}

#shop_detail_area .shop_detail_left {
  float: left;
}
#shop_detail_area .shop_detail_right {
  float: right;
  width: 342px;
}
#shop_detail_area .shop_detail_right .pure-button {
  width: 300px;
  padding-top: 20px;
  padding-bottom: 20px;
}
#shop_detail_area .shop_text {
  margin-bottom: 20px;
}
#shop_detail_area .shop_image {
  margin-bottom: 20px;
  height: 300px;
  overflow: hidden;
  position: relative;
}
#shop_detail_area .shop_image img {
  clip: rect(0, 980px, 300px, 0);
  position: absolute;
}
#shop_detail_area .shop_latlng {
  margin-bottom: 20px;
}

/* ==============================================
▼新着情報一覧
=============================================== */
#undercolumn_entry .news_date, #news_detail_area .news_date {
  color: #b5b8ba;
  font-size: 12px;
}

#undercolumn_entry .shoplist_row_view2 .shop_detail_link {
  height: 50px;
  line-height: 58px;
}
#undercolumn_entry .photoR {
  float: right;
}
#undercolumn_entry .photoL {
  float: left;
}
#undercolumn_entry .fr_news_pager a {
  display: block;
  background-color: #eaeaea;
  padding: 10px 20px;
  margin: 0 8px;
}

#news_detail_area .news_title {
  font-size: 20px;
  margin-bottom: 10px;
}
#news_detail_area .news_date {
  margin-bottom: 20px;
}
#news_detail_area .news_comment {
  margin-bottom: 10px;
}
#news_detail_area .news_url {
  margin-bottom: 20px;
}

.separateNameContainer {
  clear: both;
  height: 1px;
  background-color: #464e54;
  text-align: center;
  margin: 0 1.15385em 20px;
}
.separateNameContainer .separateName {
  display: inline;
  position: relative;
  top: -9px;
  margin: auto;
  padding: 0 10px;
  line-height: 2px;
  text-transform: uppercase;
  letter-spacing: 2px;
  text-align: center;
  font-size: 14px;
  color: #00b6b3;
  background-color: #fff;
}

.fr_leftline_title {
  padding-left: 5px;
  border-left: 3px solid #00b6b3;
}

/* ==============================================
▼markdown
=============================================== */
.markdown > *:first-child {
  margin-top: 0 !important;
}
.markdown > *:last-child {
  margin-bottom: 0 !important;
}
.markdown a {
  color: #4183C4;
  text-decoration: none;
}
.markdown a.absent {
  color: #cc0000;
}
.markdown a.anchor {
  display: block;
  padding-left: 30px;
  margin-left: -30px;
  cursor: pointer;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
}
.markdown h1, .markdown h2, .markdown h3, .markdown h4, .markdown h5, .markdown h6 {
  margin: 20px 0 10px;
  padding: 0;
  font-weight: bold;
  -webkit-font-smoothing: antialiased;
  cursor: text;
  position: relative;
}
.markdown h2:first-child, .markdown h1:first-child, .markdown h1:first-child + h2, .markdown h3:first-child, .markdown h4:first-child, .markdown h5:first-child, .markdown h6:first-child {
  margin-top: 0;
  padding-top: 0;
}
.markdown h1:hover a.anchor, .markdown h2:hover a.anchor, .markdown h3:hover a.anchor, .markdown h4:hover a.anchor, .markdown h5:hover a.anchor, .markdown h6:hover a.anchor {
  text-decoration: none;
}
.markdown h1 tt, .markdown h1 code {
  font-size: inherit;
}
.markdown h2 tt, .markdown h2 code {
  font-size: inherit;
}
.markdown h3 tt, .markdown h3 code {
  font-size: inherit;
}
.markdown h4 tt, .markdown h4 code {
  font-size: inherit;
}
.markdown h5 tt, .markdown h5 code {
  font-size: inherit;
}
.markdown h6 tt, .markdown h6 code {
  font-size: inherit;
}
.markdown h1 {
  font-size: 28px;
  color: black;
}
.markdown h2 {
  font-size: 24px;
  border-bottom: 1px solid #cccccc;
  color: black;
}
.markdown h3 {
  font-size: 18px;
}
.markdown h4 {
  font-size: 16px;
}
.markdown h5 {
  font-size: 14px;
}
.markdown h6 {
  color: #777777;
  font-size: 14px;
}
.markdown p, .markdown blockquote, .markdown ul, .markdown ol, .markdown dl, .markdown li, .markdown table, .markdown pre {
  margin: 15px 0;
}
.markdown hr {
  border: 0;
  height: 1px;
  background-image: -webkit-linear-gradient(left, transparent, rgba(0, 0, 0, 0.75), transparent);
  background-image: -moz-linear-gradient(left, transparent, rgba(0, 0, 0, 0.75), transparent);
  background-image: -ms-linear-gradient(left, transparent, rgba(0, 0, 0, 0.75), transparent);
  background-image: -o-linear-gradient(left, transparent, rgba(0, 0, 0, 0.75), transparent);
}
.markdown body > h2:first-child {
  margin-top: 0;
  padding-top: 0;
}
.markdown body > h1:first-child {
  margin-top: 0;
  padding-top: 0;
}
.markdown body > h1:first-child + h2 {
  margin-top: 0;
  padding-top: 0;
}
.markdown body > h3:first-child, .markdown body > h4:first-child, .markdown body > h5:first-child, .markdown body > h6:first-child {
  margin-top: 0;
  padding-top: 0;
}
.markdown a:first-child h1, .markdown a:first-child h2, .markdown a:first-child h3, .markdown a:first-child h4, .markdown a:first-child h5, .markdown a:first-child h6 {
  margin-top: 0;
  padding-top: 0;
}
.markdown h1 p, .markdown h2 p, .markdown h3 p, .markdown h4 p, .markdown h5 p, .markdown h6 p {
  margin-top: 0;
}
.markdown li p.first {
  display: inline-block;
}
.markdown ul, .markdown ol {
  padding-left: 30px;
}
.markdown ul li {
  list-style-type: disc;
}
.markdown ol li {
  list-style-type: decimal;
}
.markdown ul :first-child, .markdown ol :first-child {
  margin-top: 0;
}
.markdown ul :last-child, .markdown ol :last-child {
  margin-bottom: 0;
}
.markdown dl {
  padding: 0;
}
.markdown dl dt {
  font-size: 14px;
  font-weight: bold;
  font-style: italic;
  padding: 0;
  margin: 15px 0 5px;
}
.markdown dl dt:first-child {
  padding: 0;
}
.markdown dl dt > :first-child {
  margin-top: 0;
}
.markdown dl dt > :last-child {
  margin-bottom: 0;
}
.markdown dl dd {
  margin: 0 0 15px;
  padding: 0 15px;
}
.markdown dl dd > :first-child {
  margin-top: 0;
}
.markdown dl dd > :last-child {
  margin-bottom: 0;
}
.markdown blockquote {
  border-left: 4px solid #dddddd;
  padding: 0 15px;
  color: #777777;
}
.markdown blockquote > :first-child {
  margin-top: 0;
}
.markdown blockquote > :last-child {
  margin-bottom: 0;
}
.markdown table {
  padding: 0;
}
.markdown table tr {
  border-top: 1px solid #cccccc;
  background-color: white;
  margin: 0;
  padding: 0;
}
.markdown table tr:nth-child(2n) {
  background-color: #f8f8f8;
}
.markdown table tr th {
  font-weight: bold;
  border: 1px solid #cccccc;
  margin: 0;
  padding: 6px 13px;
  color: #fff;
  background-color: #464e54;
}
.markdown table tr td {
  border: 1px solid #cccccc;
  margin: 0;
  padding: 6px 13px;
}
.markdown table tr th :first-child, .markdown table tr td :first-child {
  margin-top: 0;
}
.markdown table tr th :last-child, .markdown table tr td :last-child {
  margin-bottom: 0;
}
.markdown img {
  max-width: 100%;
}
.markdown span.frame {
  display: block;
  overflow: hidden;
}
.markdown span.frame > span {
  border: 1px solid #dddddd;
  display: block;
  float: left;
  overflow: hidden;
  margin: 13px 0 0;
  padding: 7px;
  width: auto;
}
.markdown span.frame span img {
  display: block;
  float: left;
}
.markdown span.frame span span {
  clear: both;
  color: #333333;
  display: block;
  padding: 5px 0 0;
}
.markdown span.align-center {
  display: block;
  overflow: hidden;
  clear: both;
}
.markdown span.align-center > span {
  display: block;
  overflow: hidden;
  margin: 13px auto 0;
  text-align: center;
}
.markdown span.align-center span img {
  margin: 0 auto;
  text-align: center;
}
.markdown span.align-right {
  display: block;
  overflow: hidden;
  clear: both;
}
.markdown span.align-right > span {
  display: block;
  overflow: hidden;
  margin: 13px 0 0;
  text-align: right;
}
.markdown span.align-right span img {
  margin: 0;
  text-align: right;
}
.markdown span.float-left {
  display: block;
  margin-right: 13px;
  overflow: hidden;
  float: left;
}
.markdown span.float-left span {
  margin: 13px 0 0;
}
.markdown span.float-right {
  display: block;
  margin-left: 13px;
  overflow: hidden;
  float: right;
}
.markdown span.float-right > span {
  display: block;
  overflow: hidden;
  margin: 13px auto 0;
  text-align: right;
}
.markdown code, .markdown tt {
  margin: 0 2px;
  padding: 0 5px;
  white-space: nowrap;
  border: 1px solid #eaeaea;
  background-color: #f8f8f8;
  border-radius: 3px;
}
.markdown pre code {
  margin: 0;
  padding: 0;
  white-space: pre;
  border: none;
  background: transparent;
}
.markdown .highlight pre {
  background-color: #f8f8f8;
  border: 1px solid #cccccc;
  font-size: 13px;
  line-height: 19px;
  overflow: auto;
  padding: 6px 10px;
  border-radius: 3px;
}
.markdown pre {
  background-color: #f8f8f8;
  border: 1px solid #cccccc;
  font-size: 13px;
  line-height: 19px;
  overflow: auto;
  padding: 6px 10px;
  border-radius: 3px;
}
.markdown pre code, .markdown pre tt {
  background-color: transparent;
  border: none;
}
.markdown strong {
  font-weight: bold;
}
.markdown em {
  font-style: italic;
}

.fr_facebook {
  background-color: #3B5998;
  color: #fff;
}

.fr_facebook_txt {
  color: #3B5998;
}

.fr_twitter {
  background-color: #55ACEE;
  color: #fff;
}

.fr_twitter_txt {
  color: #55ACEE;
}

/* ---------------------------------------------------------
_bloc.scss
ブロック関連のスタイルを設定します。
----------------------------------------------------------*/
/************************************************
 ブロック用
************************************************ */
/*** 目次 ***

▼ブロック共通
リスト
タイトル
ヘッダー上、フッター下のブロックエリア

▼各機能ブロックの指定
-新着情報
-現在のカートの中
-カテゴリ
-ガイドリンク
-ログイン（サイド用）
-検索
-カレンダー
-おすすめ商品
    *メインカラム用 1カラム時 [one_maincolumn]
    *メインカラム用 2カラム時 [two_maincolumn_left]
                              [two_maincolumn_right]
    *メインカラム用 3カラム時 [three_maincolumn]
    *サイドカラム用           [side_column]
    *商品詳細のオススメ商品   [whobought_area]
 */
/* ==============================================
ブロック共通
/* ============================================= */
#container .block_body {
  background-color: #fff;
}

.side_column .block_body,
.main_column .block_body {
  margin: 0 auto;
  width: 980px;
}
.main_column #news_area .block_body {width: 785px;}/*181002 追加*/


#login_area .block_body,
#search_area .block_body,
#calender_area .block_body,
#category_area .block_body {
  margin-bottom: 40px;
}

/* リスト
----------------------------------------------- */
/* ログイン 検索条件 */
#container .block_outer .block_body dl.formlist {
  margin-bottom: 8px;
}
#container .block_outer .block_body dl.formlist dd {
  margin-bottom: 5px;
}
#container .block_outer .block_body dl.formlist dt {
  margin-bottom: 3px;
}
#container .block_outer .block_body dl.formlist span {
  vertical-align: top;
}

/* ==============================================
▼ヘッダー上、フッター下のブロックエリア
=============================================== */
#topcolumn {
  margin: 0 auto;
  clear: both;
}

#bottomcolumn {
  margin: 0 auto;
  clear: both;
}

/* ***********************************************
▼各機能ブロックの指定
/*********************************************** */
/* ===============================================
▼新着情報
=============================================== */
#news_area {
  margin-bottom: 10px;
}
#news_area .block_body {
  padding: 10px;
}
#news_area .news_contents {
  padding-right: 10px;
}
#news_area dl.newslist, #news_area dl.newslist2 {
  clear: both;
}
#news_area dl.newslist dt, #news_area dl.newslist2 dt {
  float: left;
  clear: both;
  padding: 0 10px 10px 0;
}
#news_area dl.newslist dd, #news_area dl.newslist2 dd {
  margin: 0;
  padding: 0 0 10px 20px;
}
#news_area dl.newslist a, #news_area dl.newslist2 a {
  text-decoration: underline;
}
#news_area dl.newslist2 dd {
  margin-left: 121px;
}
#news_area .ticker {
  margin: 0 auto;
  padding: 10px;
  text-align: left;
  position: relative;
  overflow: hidden;
  border: 1px solid #eaeaea;
}
#news_area .news_list3 {
  width: 100%;
  position: relative;
}
#news_area .news_list3 li {
  width: 100%;
  display: none;
}
#news_area .new_mark {
  color: #00b6b3;
  border: 1px solid #00b6b3;
  padding: 2px 2px 0;
  margin-left: 5px;
  line-height: 12px;
  font-size: 12px;
}
#news_area .more a {
  padding: 5px 10px;
  font-size: 10px;
  color: #464e54;
  background-color: #eaeaea;
  text-decoration: none;
  display: inline-block;
  float: right;
}
#news_area .more a:hover {
  color: #eaeaea;
  background-color: #464e54;
}
#news_area dl.end {
  padding: 10px 0;
  background: url("") no-repeat bottom;
}

/* ===============================================
▼現在のカートの中
=============================================== */
#cart_area .information {
  padding: 10px;
}
#cart_area .postage {
  margin-top: 10px;
  padding-top: 10px;
}
#cart_area .postage .point_announce {
  padding: 2px 0 2px 20px;
}
#cart_area .total_quantity {
  display: inline-table;
}
#cart_area .total_quantity > span {
  display: table-cell;
  vertical-align: middle;
  width: 20px;
  height: 20px;
  -webkit-border-radius: 50%;
  /* 50%でもOK */
  -moz-border-radius: 50%;
  border-radius: 50%;
  background-color: #fff;
  /* 円の色 */
}

/* ===============================================
▼カテゴリ
=============================================== */
#category_area .category_body {
  padding: 0 20px;
}
#category_area [class^="level"] {
  margin-left: 5px;
}

/* ===============================================
▼ガイドリンク
=============================================== */
#guide_area {
  margin-top: 1em;
  border: none;
}

#guide_area li {
  margin-bottom: 5px;
  letter-spacing: -0.05em;
}

ul.button_like li {
  margin: 0;
  padding: 0 0 1px 0;
}
ul.button_like li a {
  margin: 0;
  padding: 10px 15px 10px 10px;
  display: block;
  text-decoration: none;
  outline: none;
}

/* ===============================================
▼ログイン（サイド用）
※ヘッダー用はbloc_alpha.css内に記述
=============================================== */
#login_area .block_body .inputbox {
  width: 250px;
}
#login_area .block_body .notes {
  width: 80%;
  margin: 0 auto;
}

/* ===============================================
▼検索
=============================================== */
#search_area .inputbox li {
  text-align: center;
  margin-bottom: 10px;
}
#search_area .status li {
  text-align: left;
  margin-bottom: 3px;
}

/* ===============================================
▼カレンダー
=============================================== */
.calender {
  margin: 0 10%;
}
.calender .information {
  margin-left: 10px;
  font-size: 12px;
  color: #ec6d71;
  text-align: center;
}

.calender_nav {
  text-align: center;
}
.calender_nav li {
  display: inline-block;
  margin-left: 5px;
}
.calender_nav li:first-child {
  margin-left: 0;
}

.calender_list td,
.calender_list th {
  padding: 3px;
  text-align: center;
}
.calender_list td:last-child,
.calender_list th:last-child,
.calender_list td:last-child > a {
  color: #6f6fed;
}
.calender_list td:first-child,
.calender_list th:first-child,
.calender_list td:first-child > a {
  color: #ec6d71;
}
.calender_list .off,
.calender_list .off > a {
  color: #ec6d71;
}
.calender_list .today {
  font-weight: bold;
  background: -webkit-gradient(linear, left top, right bottom, from(#ddd), color-stop(0.25, #ddd), color-stop(0.25, transparent), color-stop(0.5, transparent), color-stop(0.5, #ddd), color-stop(0.75, #ddd), color-stop(0.75, transparent), to(transparent));
  background: -moz-linear-gradient(-45deg, #ddd 25%, transparent 25%, transparent 50%, #ddd 50%, #ddd 75%, transparent 75%, transparent);
  background: linear-gradient(-45deg, #dddddd 25%, rgba(0, 0, 0, 0) 25%, rgba(0, 0, 0, 0) 50%, #dddddd 50%, #dddddd 75%, rgba(0, 0, 0, 0) 75%, rgba(0, 0, 0, 0));
  background-size: 4px 4px;
}
.calender_list .is_link > a {
  text-decoration: underline;
}
.calender_list .is_link > a:hover {
  text-decoration: none;
}
.calender_list .is_match {
  background-color: rgba(70, 78, 84, 0.1);
}

/* ===============================================
▼アーカイブ
=============================================== */
.archive {
  margin: 0 10%;
}

/* ===============================================
▼最近見た商品
=============================================== */
#arrCheckItems, #recommend_area, #arrEasyRecommend {
  width: 100%;
  margin-bottom: 60px;
}
#arrCheckItems .product_item_wrap, #recommend_area .product_item_wrap, #arrEasyRecommend .product_item_wrap {
  width: 980px;
  margin: 0 auto;
}
#arrCheckItems .product_item_link, #recommend_area .product_item_link, #arrEasyRecommend .product_item_link {
  width: 140px;
  padding: 8px;
  display: inline-block;
  border: 1px solid #fff;
  vertical-align: top;
}
#arrCheckItems .product_item_link:hover, #recommend_area .product_item_link:hover, #arrEasyRecommend .product_item_link:hover {
  border-color: #00b6b3;
}
#arrCheckItems .product_item_link, #recommend_area .product_item_link, #arrEasyRecommend .product_item_link, #arrCheckItems .product_item_link::before, #recommend_area .product_item_link::before, #arrEasyRecommend .product_item_link::before, #arrCheckItems .product_item_link::after, #recommend_area .product_item_link::after, #arrEasyRecommend .product_item_link::after {
  -webkit-transition: all .3s;
  transition: all .3s;
}
#arrCheckItems .product_item img, #recommend_area .product_item img, #arrEasyRecommend .product_item img {
  max-width: 140px;
  max-height: 140px;
}
#arrCheckItems .productImage, #recommend_area .productImage, #arrEasyRecommend .productImage {
  text-align: center;
}

/* サイドカラム用 */
.side_column #recommend_area .block_body .productContents {
  clear: both;
}

/* おすすめ商品
----------------------------------------------- */
/* レコメンドエンジン（EasyRecommend）
----------------------------------------------- */
/* ---------------------------------------------------------
_bloc_alpha.scss
追加ブロック関連のスタイルを設定します。
----------------------------------------------------------*/
/* ログイン（ヘッダー用）
----------------------------------------------- */
#header_login_area ul.formlist li {
  display: inline;
}

/* ***********************************************
追加ブロック
************************************************ */
/* 共通
----------------------------------------------- */
#container .block_outer #banner_area .block_body {
  border: none;
}

/* 【メイン】バナーエリア_02
----------------------------------------------- */
.main_column .block_outer #banner_area .block_body ul {
  width: 100%;
}
.main_column .block_outer #banner_area .block_body ul li {
  float: left;
}
.main_column .block_outer #banner_area .block_body ul li.sub_01 {
  padding-right: 8px;
}

/* 【サイド】バナーエリア_01
----------------------------------------------- */
/* 【サイド】バナーエリア_02
----------------------------------------------- */
#leftcolumn .block_outer #banner_area .block_body ul li,
#rightcolumn .block_outer #banner_area .block_body ul li {
  margin-bottom: 8px;
}

/* パンくず
----------------------------------------------- */
#topicpath_area {
  width: 980px;
  margin: 0 auto;
}

#topicpath li {
  display: inline-block;
}
#topicpath li::after {
  margin: 0 5px;
  content: ">";
}
#topicpath li:last-child {
  color: #b5b8ba;
}
#topicpath li:last-child::after {
  content: "";
}

/************************************************
 ポップアップウィンドウ
************************************************ */
/* 共通
----------------------------------------------- */
#windowcolumn {
  padding: 20px;
}

/* お客様の声の書き込み、新しいお届け先の追加・変更
----------------------------------------------- */
#window_area #forgot .forgot_txt {
  width: 60%;
  border: 1px solid #ec6d71;
  text-align: center;
  padding: 20px 0;
  margin: 20px auto;
  font-size: 20px;
}