@charset "UTF-8";
/*************************************************
path:/cmn_jp_v1/css/module2015-chase-add.css

make:15.05.08
update:15.06.23

description:
2015年リニューアル用の新規開発モジュール
・2015年以前のスタイルに影響されたくない場合は、作成するモジュールの親要素のクラス名にmodule2015-chaseを指定することで旧スタイルがリセットされます。
*************************************************/

/*▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼ コメントフォーマット ▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼▼*/

/* ============================================================*
* 【style.css Index】
*  Leve l
*   #Level 2
*    #Level 3
*============================================================ */

/* ===============================================
#
=============================================== */

/* -----------------------------
#
-------------------------------- */

/*
----------------------- */

/*  */

/*▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲ コメントフォーマット ▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲▲*/

/* ============================================================*
* 要素内アイコン絶対配置
*============================================================ */
.iconPR {
  position: relative;
}
.iconPR-tr {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 46px;
  height: 46px;
}
.iconPR-tr_recommendation {
  background-image: url(/-/Media/Ricoh/Sites/co_jp/cmn_jp_v1/img/icon-thumb_mn-recommendation_r.png);
}
.iconPR-tr_new {
  background-image: url(/-/Media/Ricoh/Sites/co_jp/cmn_jp_v1/img/icon-thumb_mn-new_r.png);
}

.iconPR-tl {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 46px;
  height: 46px;
}
.iconPR-tl_recommendation {
  background-image: url(/-/Media/Ricoh/Sites/co_jp/cmn_jp_v1/img/icon-thumb_mn-recommendation_l.png);
}
.iconPR-tl_new {
  background-image: url(/-/Media/Ricoh/Sites/co_jp/cmn_jp_v1/img/icon-thumb_mn-new_l.png);
}

.iconPR-tr_large {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  width: 69px;
  height: 69px;
}
.iconPR-tr_new_large {
  background-image: url(/-/Media/Ricoh/Sites/co_jp/cmn_jp_v1/img/icon-thumb_mn-new_r_large.png);
}

@media (max-width: 640px) {



}


/* ============================================================*
* プロジェクタートップ 一覧
*============================================================ */
.lineup-item-wrapper .thumb_txt {
  padding: 16px 24px 24px 16px;
  background: url(/-/Media/Ricoh/Common/cmn_v1/img/icon_s_right_01.png) no-repeat 100% 50%;
}
.lineup-item-wrapper .thumb_txt .ttl {
  margin-bottom: 16px;
}
.lineup-item-wrapper .icon-display-size {
  margin-top: 15px;
}
.lineup-item-wrapper .icon-display-size + .icon-display-size {
  margin-top: 0;
}
.lineup-item-wrapper .icon-display-size li {
  float: left;
  margin-bottom: 6px;
}
.lineup-item-wrapper .icon-display-size li + li {
  margin-left: 6px;
}
.lineup-item-wrapper .icon-display-size img {
  width: auto;
}
.lineup-item-wrapper .nml {
  border-top: 1px solid #dedede;
}
.lineup-item-wrapper .nml th {
  padding: 5px;
  text-align: center;
  background: #f3f3f3;
  font-size: 14px;
  vertical-align: middle;
  border-right: 1px solid #dedede;
  border-bottom: 1px solid #dedede;
}
.lineup-item-wrapper .nml td {
  border-right: 1px solid #dedede;
  line-height: 1.2;
  vertical-align: middle;
  padding: 8px;
}
.lineup-item-wrapper .nml strong {
  font-size: 20px;
  font-weight: bold;
}


/* ============================================================*
*  .item-point-color
*============================================================ */
.item-point-color.cate03 {
  background: #d94355;
}


/* ============================================================*
* プロジェクターカテゴリトップ 一覧
*============================================================ */
.lineup-item-tbl {
  margin-bottom: 24px;
}
.lineup-item-tbl .lineup-item-tbl-ttl {
  margin-bottom: 8px;
}
.lineup-item-tbl .lineup-item-tbl-ttl a {
  font-weight: bold;
}
.lineup-item-tbl .lineup-item-tbl-ttl .icon-stock {
  border: 1px solid #cf142b;
  background: #fff;
  color: #cf142b;
  font-size: 14px;
}
.lineup-item-tbl .lineup-item-tbl-box {
  border: #dedede 1px solid;
  width: 100%;
}
.lineup-item-tbl .img_l {
  width: 24%;
  border-right: #dedede 1px solid;
  float: left;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.lineup-item-tbl .img_l .img_l-inner {
  display:table-cell;
  vertical-align:middle;
  text-align: center;
}
.lineup-item-tbl .img_l img {
  width: 100%;
  height: auto;
  vertical-align: middle;
}
.lineup-item-tbl .thum_box {
  float: right;
  width: 76%;
}
.lineup-item-tbl .thum_box-tbl_cell {
  width: 16%;
  float: left;
  border-right: #dedede 1px solid;
  text-align: center;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.lineup-item-tbl .thum_box-tbl_cell_last-child {
  width: 20%;
  border-right: none;
}
.lineup-item-tbl .thum_box-tbl_ttl {
  background: #f3f3f3;
  border-bottom: #dedede 1px solid;
  padding: 12px 0;
  font-size: 14px;
}
.lineup-item-tbl .thum_box-tbl_cont {
  padding: 16px 8px;
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.lineup-item-tbl .thum_box-tbl_cont-inner {
  font-size: 14px;
}
.lineup-item-tbl .thum_box-tbl_cont-inner strong {
  font-size: 20px;
}
.lineup-item-tbl .thum_box-tbl_cont-inner .lb_ico {
  color: #333;
  margin: 0;
  width: 100%;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
}
.lineup-item-tbl .thum_box-tbl_cont-inner .icon-resolution {
  width: 100%;
  height: auto;
}
.lineup-item-tbl .opt01 {
  background: #ee9193;
}
.lineup-item-tbl .opt02 {
  background: #74bde7;
}
.lineup-item-tbl .opt03 {
  background: #b7d24e;
}
.lineup-item-tbl .opt04 {
  background: #f8bf56;
}
.lineup-item-tbl .opt05 {
  background: #4bbdcd;
}

@media (max-width: 640px) {
.lineup-item-tbl .rsp_clr_b {
  clear: both;
}
.lineup-item-tbl .img_l,
.lineup-item-tbl .thum_box {
  width: 100%;
  float: none;
}
.lineup-item-tbl .img_l {
  border-right: none;
}
.lineup-item-tbl .img_l .img_l-inner {
  display: block;
  vertical-align: bottom;
}
.lineup-item-tbl .img_l img {
  width: 100%;
  max-width: 100%;
  height: auto;
}
.lineup-item-tbl .thum_box img {
  width: 100%;
  max-width: 76px;
  height: auto;
}
.lineup-item-tbl .thum_box-tbl_cell {
  width: 33%;
}
.lineup-item-tbl .tbl-height_sp_1 {
  border-top: #dedede 1px solid;
  border-bottom: #dedede 1px solid;
}
.lineup-item-tbl .thum_box-tbl_cell_last-child,
.lineup-item-tbl .thum_box-tbl_cell_last-child_s {
  width: 34%;
  border-right: none;

}
.lineup-item-tbl .thum_box-tbl_cont-inner strong {
  font-size: 16px;
}
}


/* ============================================================*
* テキストと画像の左右レイアウト
*============================================================ */
.hTc {
  display: table;
  width: 100%;
  box-sizing: border-box;
}
.hTc-cell {
  display: table-cell;
}
.hTc-cell_img {
  vertical-align: middle;
  width: 30%;
}
.hTc-cell_img_l {
  text-align: left;
  padding-right: 32px;
}
.hTc-cell_img_r {
  text-align: right;
  padding-left: 32px;
}
.hTc-cell_txt {
  vertical-align: top;
}

@media (max-width: 640px) {
  .hTc-cell {
    display: block;
  }
  .hTc-cell_img {
    width: 100%;
    margin-bottom: 8px;
  }
  .hTc-cell_img_l {
    text-align: left;
    padding-right: 0px;
  }
  .hTc-cell_img_r {
    text-align: left;
    padding-left: 0px;
  }
  .hTc-cell_img img {
    max-width: 100%;
  }
}


.flotBox {
  overflow: hidden;
  margin-bottom: 16px;
}
.flotBox-l {
  float: left;
}
.flotBox-r {
  float: right;
}
.flotBox-img {
  box-sizing: border-box;
}
.flotBox-l.flotBox-img {
  padding-right: 40px;
}
.flotBox-r.flotBox-img {
  padding-left: 40px;
}
.flotBox-img {
  text-align: center;
}

@media (max-width: 640px) {
  .flotBox-l {
    margin-bottom: 16px;
  }
  .flotBox-l,.flotBox-r {
    float: none !important;
    width: 100% !important;
  }
  .flotBox-l.flotBox-img,
  .flotBox-r.flotBox-img {
    padding-right: 0;
    padding-left: 0;
  }
}

/* ============================================================*
* 画像の上にテキストを載せる
*============================================================ */
.imgTxt {
  position: relative;
  margin-bottom: 16px;
}
.imgTxt-title,
.imgTxt-subTitle,
.imgTxt-txt {
  position: absolute;
}
@media (max-width: 640px) {
  .imgTxt {
    margin-bottom: 24px;
  }
  .imgTxt-img {
    display: block;
    margin-bottom: 24px;
  }
  .imgTxt-title,
  .imgTxt-subTitle,
  .imgTxt-txt {
    position: static;
    margin-bottom: 16px;
  }
}

/* ============================================================*
* タブのサイドにウィンドウ幅分の横線を表示する
*============================================================ */
.ms_tabs { margin: 1em 0; border-bottom: 1px solid #dedede; }
.ms_tabs ul { position: relative; top: 1px; display: table; table-layout: fixed; margin: 0 auto; padding: 0 8px; max-width: 1024px; width: 100%; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing: border-box; }
.ms_tabs li { display: table-cell; border-top: 1px solid #dedede; border-right: 1px solid #dedede; border-bottom: 1px solid #dedede; background: #f3f3f3; border-radius: 0 3px 0 0; word-break: break-all; }
.ms_tabs li:first-child { border-left: 1px solid #dedede; border-radius: 3px 0 0 0; }
.ms_tabs li.act { border-bottom: 1px solid #fff; background: #fff; }
.ms_tabs span, .ms_tabs a { display: block; padding: 8px 16px; color: #6c7074; font-weight: bold; }

/* ============================================================*
* 画像のモーダル表示
*============================================================ */
.newWinModalImg_off {
  cursor: default;
}
.smallImageWrapper .newWinModalImg .bn_ico {
  display: none !important;
}

@media (max-width: 640px) {
  .newWinModalImg .bn_ico {
    display: none !important;
  }
  .newWinModalImg.banner_mn {
    border: none;
    margin-bottom: 8px;
  }
}

.newWinModalYoutube_iframe {
  position:relative;
  width:100%;
  padding-top:56.25%;
}
.newWinModalYoutube_iframe iframe {
  position:absolute;
  top:0;
  right:0;
  width:100%;
  height:100%;
}

/* ============================================================*
* タブのリンクカラーを通常のリンクカラーに変更
*============================================================ */
.tabLinkNomal li a {
  color: #0000cc;
}