@charset "UTF-8";
/*-------------------------------------------------------------------

/css/common.css

--------------------------------------------------------------------*/
/*---------- 基本 ----------*/
body {
  margin: 0;
  font-family: 'meiryo', 'Hiragino Kaku Gothic Pro', sans-serif;
  background-color: #fff;
  font-size: 16px;
  line-height: 1.75;
}
p, h1, h2, h3, h4, h5, h6, ul, li, hr, form  {
  margin: 0;
  padding: 0;
}
hr {
  border: 0;
  border-top: dotted 1px #ccc;
}
a {
  text-decoration: none;
  color: #000;
}
a:hover {
  opacity: 0.7;
}
i {
  color: #ccc;
  padding-right: 5px;
}
.textlink {
  color: #005cad;
  text-decoration: underline;
}
.red {
  color: #cc0000;
}
.lk {
  color: #666;
}
.note {
  font-size: 0.8em;
}
i {
  color: #cc0000;
  font-weight: bold;
}
/*---------- フォーム ----------*/
input, textarea, select {
  font-family: 'meiryo', 'Hiragino Kaku Gothic Pro', sans-serif;
}
input, select {
  padding: 4px 0;
}
input#width, input#height {
  width: 60px;
}
input#company, input#post {
  width: 220px;
}
input#name {
  width: 150px;
}
input#zipcode {
  width: 100px;
}
input#address, input#url1, input#url2, input#url3, input#url4, input#url5, textarea#delivery, textarea#message {
  width: 98%;
}
input#address2 {
  width: 200px;
}
input#email, input#tel {
  width: 160px;
}
input#delivery_m, input#delivery_d {
  width: 25px;
}
textarea#delivery {
  height: 5em;
}
textarea#message {
  height: 10em;
}
.required {
  background-color: #cc0000;
  color: #fff;
  font-weight: bold;
  font-size: 14px;
  padding: 0 5px;
  border-radius: 3px;
}
.main form {
  border: solid 2px #ccc;
}
.main form .formname {
  background-color: #eee;
}
.main .formbutton {
  text-align: center;
  margin-top: 20px;
}
.main .formbtn_area:after {
  content: ""; display: block; clear: both;
}
.main .formbtn_area li {
  float: left;
}
.main .formbtn_area .submitbtn {
  height: auto;
}
.main .formbtn_area a:hover {
  opacity: 1;
}
.main .formbtn_area_3buttons:after {
  content: ""; display: block; clear: both;
}
.main .formbtn_area_3buttons ul {
  float: left;
}
.main .backbtn_first a:hover, .main form .backbtn_before a:hover {
  opacity: 1;
}
/*---------- テキスト ----------*/
h2 {
  border-bottom: dotted 1px #ccc;
  margin-bottom: 10px;
}
h3, .description, .note_box {
  margin-bottom: 20px;
}
/*---------- 領域 ----------*/
.image_area {
 display: inline-block;
}
.image_area, .ffftp {
  margin-bottom: 25px;
}
.linklist_nf {
  margin-bottom: 25px;
  line-height: 2.5;
}
/*---------- リスト ----------*/
ul {
  list-style: none;
}
.listline {
  text-indent:-1em;
  padding-left:1em;
}
/*---------- ボタン ----------*/
li.link_btn {
  background: #eee;
  color: #111;
  border: solid 1px #fff;
  padding: 10px;
  -moz-box-shadow: 0px 0px 2px rgba(000,000,000,0.3);
  -webkit-box-shadow: 0px 0px 2px rgba(000,000,000,0.3);
}
/*---------- テーブル ----------*/
.table {
  display: table;
  border: solid 1px #ccc;
  margin-bottom: 20px;
}
.tr {
  display: table-row;
}
.th {
  display: table-cell;
  border: solid 1px #ccc;
  background-color: #eee;
}
.td {
  display: table-cell;
  border: solid 1px #ccc;
}
/*---------- ラベル ----------*/
.label {
  display: inline;
  background-color: #ffcc00;
  font-size: 14px;
  padding: 1px 5px;
  border-radius: 3px;
}
/*---------- リンクリスト ----------*/
.main .linklist:after {
  content: ""; display: block; clear: both;
}
.main .linklist {
  border-top: dotted 1px #ccc;
  border-bottom: dotted 1px #ccc;
  margin-bottom: 15px;
  padding: 10px 0;
}
.main .linklist li {
  line-height: 2.5;
  float: left;
}

/*---------- イメージ ----------*/
img {
  border: none;
}
img.question {
  margin-left: 10px;
  vertical-align: middle;
}
img.circle_num {
  margin: 0 4px -4px 0;
}
.main .image_area img {
  height: auto;
  vertical-align: text-bottom;
}
/*---------- 補足ボックス ----------*/
.main .note_box {
  padding: 15px;
  background-color: #eee;
  font-size: 14px;
  border-radius: 3px;
}
/*---------- ページトップ ----------*/
.pagetop {
  background-color: #005cad;
  border-bottom: solid 5px #ffcc00;
}
.navabout a, .navcontact a {
  color: #fff;
}
/*---------- ロゴ領域 ----------*/
.logo_area:after {
  content: ""; display: block; clear: both;
}
/*---------- ナビゲーション ----------*/
.nav a {
  display: block;
}
.nav a:hover {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f9f9f9+47,ededed+100;White+3D+%231 */
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top,  #ededed 0%, #f9f9f9 47%, #fff 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#ededed), color-stop(47%,#f9f9f9), color-stop(100%,#fff)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #ededed 0%,#f9f9f9 47%,#fff 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #ededed 0%,#f9f9f9 47%,#fff 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #ededed 0%,#f9f9f9 47%,#fff 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #ededed 0%,#f9f9f9 47%,#fff 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ededed', endColorstr='#fff',GradientType=0 ); /* IE6-9 */
}
.nav li {
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+0,f9f9f9+47,ededed+100;White+3D+%231 */
  background: #ffffff; /* Old browsers */
  background: -moz-linear-gradient(top,  #fff 0%, #f9f9f9 47%, #ededed 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#fff), color-stop(47%,#f9f9f9), color-stop(100%,#ededed)); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  #ffffff 0%,#f9f9f9 47%,#ededed 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  #ffffff 0%,#f9f9f9 47%,#ededed 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  #ffffff 0%,#f9f9f9 47%,#ededed 100%); /* IE10+ */
  background: linear-gradient(to bottom,  #ffffff 0%,#f9f9f9 47%,#ededed 100%); /* W3C */
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed',GradientType=0 ); /* IE6-9 */
}
/*---------- パンくず ----------*/
.breadcrumb {
  font-size: 14px;
}
.breadcrumb i {
  color: #ccc;
}
/*---------- ステップラベル ----------*/
.steplabel {
  margin: 15px auto 5px auto;
}
.steplabel .label {
  width: 80px;
  color: #fff;
  background-color: #cc0000;
  font-size: 14px;
  font-weight: bold;
  text-align: center;
  border-radius: 3px;
}
/*---------- コンテナ ----------*/
.container {
  margin: 0 auto;
}
/*---------- メイン ----------*/
.main {
  margin-bottom: 20px;
}
.main h1 {
  margin-bottom: 10px;
  font-size: 28px;
  padding-left: 10px;
  border-left: solid 5px #cc0000;
}
.main h3.command {
  border-bottom: dotted 1px #666;
  border-left: solid 5px #cc0000;
}
.main h3.subhead {
  border-left: solid 5px #ff5500;
}
.main h4.subhead {
  border-left: solid 5px #ffcc00;
}
.main .border_box {
  padding: 15px;
  border: solid 1px #ccc;
  border-radius: 3px;
}
/*---------- ボトムナビ ----------*/
.navmove:after {
  content: ""; display: block; clear: both;
}
.navmove li {
  float: left;
}
.navmove a {
  border: solid 1px #666;
  padding: 4px 9px;
  color: #333;
  border-radius: 3px;
}
.navmove a:hover {
  background-color: #333;
  color: #fff;
}
/*---------- フッター ----------*/
.footer {
  border-top: solid 1px #eee;
  padding: 15px 5%;
  font-size: 14px;
}
.footer_inner { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing :border-box;
  margin: 0 auto;
}
/*-------------------------------------------------------------------

                                                        トップページ

--------------------------------------------------------------------*/
.topimage_box {
  height: 324px;
}
.topcopy_area {
  display: inline-block;
}
.topcopy_area h1, .topcopy_area p {
  color: #fff;
  text-align: left;
}
.label_box {
  margin-bottom: 25px;
}
.label_box .splabel {
  border-radius: 5px;
  background-color: rgba(204, 0, 0, 0.8);
  float: left;
}
.label_box .splabel p {
  color: #fff;
  font-size: 12px;
  line-height: 1;
}
.spec_box h3 {
  border-left: solid 5px #cc0000;
  padding-left: 8px;
}
.spec_box h3 {
  margin-bottom: 10px;
}
.spec_box .th {
  white-space: nowrap;
  font-size: 14px;
  background-color: cornsilk;
}
.spec_box .td {
  font-size: 14px;
}
.hl_info {
  background-color: #ff5500;
  color: #fff;
  font-size: 14px;
  padding: 2px 10px;
  float: left;
}
.hl_day {
  border: solid 1px #ff5500;
  font-size: 14px;
  font-family: arial;
  margin-right: 10px;
  float: left;
}
h1.tophead {
  font-size: 28px;
  border-left: solid 5px #cc0000;
  padding-left: 0.5em;
  margin-bottom: 5px;
}
.ftbox { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing :border-box;
  text-align: center;
  margin-bottom: 25px;
}
.ftbox_inner {
  margin: 0 auto;
}
.ftbox_inner h1 {
  border-bottom: dotted 1px #ccc;
}
.ftbox_inner p {
  margin: 10px;
}
.ftbox_1, .ftbox_2, .ftbox_3, .ftbox_4, .ftbox_5, .ftbox_6 { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing :border-box;
  background-color: #fff;
  border: solid 1px #ccc;
}
.ftbox h1 {
  color: #000;
  font-weight: bold;
  font-size: 20px;
  border-left: solid #ff5500 4px;
  padding-left: 8px;
  text-align: left;
  font-family: 'meiryo', 'Hiragino Kaku Gothic Pro', sans-serif;
}
.ftbox h1 span {
  font-size: 0.75em;
}
.ftbox p {
  text-align: left;
  font-size: 14px;
}
.ftbox p.ftbox_caption {
  margin-top: 0;
  font-size: 14px;
  text-align: center;
}
.ftbox img {
  height: auto;
}
.spbox { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing :border-box;
  border: solid 1px #ccc;
  margin-bottom: 25px;
  text-align: center;
}
.spbox_inner {
  margin: 0 auto;
}
.spbox_inner p {
  margin: 0 10px 10px 10px;
}
.spbox_1, .spbox_2, .spbox_3 {
 -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing :border-box;
}
.spbox img {
  height: auto;
}
/*-------------------------------------------------------------------

                                                        ご利用ガイド

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

                                                          マテリアル

--------------------------------------------------------------------*/
h1.material_name {
  font-size: 24px;
}
.materialtype_description, .material_description {
  margin: 0 0 20px 0.7em;
  border-bottom: dotted 1px #ccc;
  padding-bottom: 15px;
}
.main .spec_table {
  width: 100%;
  border: solid 2px #ccc;
}
.main .specname {
  background-color: #eee;
  border-bottom: solid 1px #ccc;
}
.main .specval {
  border-bottom: solid 1px #ccc;
}
.main .specval img {
  height: auto;
  vertical-align: bottom;
  border: solid 1px #ccc;
  background-color: #fefefc;
  -moz-box-shadow: 2px 2px 2px #e9e9e9;
  -webkit-box-shadow: 2px 2px 2px #e9e9e9;
  box-shadow: 2px 2px 2px #e9e9e9;
}
/*-------------------------------------------------------------------

                                                              価格表

--------------------------------------------------------------------*/
.main .price_table:after {
  content: ""; display: block; clear:both;
}
.main .price_table {
  border: solid 1px #ccc;
  margin-bottom: 25px;
}
.main .price_tr  { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing :border-box;
  width: 50%;
  float: left;
}
.main .price_table_title {
  border: solid 1px #ccc;
  background-color: #eee;
  font-weight: bold;
}
.main .price_th { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing :border-box;
  background-color: #ffffee;
  border: solid 1px #ccc;
  font-weight: bold;
  float: left;
}
.main .price_th span {
  font-weight: normal;
  font-size: 12px;
  margin-left: 3px;
}
.main .price_td { -moz-box-sizing: border-box; -webkit-box-sizing: border-box; box-sizing :border-box;
  border: solid 1px #ccc;
  text-align: center;
  float: left;
}
/*-------------------------------------------------------------------

                                                  データ作成上の注意

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

                                                          ご入稿方法

--------------------------------------------------------------------*/
.ffftp_set_area {
  background-color: cornsilk;
  border-radius: 3px;
}
.ffftp_name {
  font-weight: bold;
}
.send_datamedia {
  display: inline-block;
  padding: 10px 15px;
  border: solid 1px #ccc;
  background-color: cornsilk;
  border-radius: 3px;
  margin-bottom: 20px;
}

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

                                                お見積もり・出力予約

--------------------------------------------------------------------*/
.main .totalprice {
  font-weight: bold;
  font-size: 18px;
  border-bottom: solid 1px #000;
  margin-bottom: 25px;
}
.main .estimate form {
  border: none;
}
.main .est_totalbox:after, .est_specbox:after, .est_pricebox:after {
  content: ""; display: block; clear: both;
}
.main .est {
  border: solid 1px #000;
  padding: 15px;
  margin-bottom: 20px;
  border-radius: 3px;
}
.main .est .est_num, .main .est .est_prod, .main .est .est_price, .main .est .est_prices, .main .est .est_subtotal, .est_tax, .est_total, .main .est .est_subtotal_price, .est_tax_price, .est_total_price {
  float: left;
}
.main .est_specbox {
  padding-bottom: 5px;
}
.main .est_pricebox {
  border-bottom: dotted 1px #ccc;
  padding: 5px 0;
}
.main .est_totalbox {
  padding-top: 5px;
}

.main .lastchk_client {
  border: solid 1px #000;
  padding: 15px;
  margin-bottom: 25px;
  border-radius: 3px;
}
/*-------------------------------------------------------------------

                                                    ご利用にあたって

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

                                                            サポート

--------------------------------------------------------------------*/
.main .a4sample_info h4 {
  background-color: #e4e4e4;
  padding: 5px 10px;
  border: solid 1px #ccc;
  border-bottom: none;
}
.main .a4sample_media {
  font-size: 14px;
  padding: 5px 10px;
  border: solid 1px #ccc;
  margin-bottom: 20px;
}
.question_area:after {
  content: "";
  display: block;
  clear: both;
}
.answer_area:after {
  content: ""; display: block; clear: both;
}
.question_area {
  border-top: dotted 1px #ccc;
  padding: 15px 0 10px 0;
}
.answer_area {
  padding-bottom: 15px;
}
.question_area .q {
  font-size: 24px;
  color: #cc0000;
  margin-top: -5px;
  float: left;
}
.question_area .question {
  float: left;
}
.answer_area .a {
  font-size: 24px;
  color: #005cad;
  margin-top: -5px;
  float: left;
}
.answer_area .answer {
  float: left;
}
.question {
  font-weight: bold;
}
.answer a {
  text-decoration: underline;
}
/*-------------------------------------------------------------------

                                                                特集

--------------------------------------------------------------------*/
.yatte_head {
  background-repeat: no-repeat;
}
.reso-table {
  display: table;
  table-layout: fixed;
  margin-bottom: 20px;
  border-right: solid 1px #ccc;
  border-bottom: solid 1px #ccc;
}
.reso-table_inner {
  display: table-row;
}
.reso-table_ttl {
  display: table-cell;
  border: solid 1px #ccc;
  border-right: none;
  border-bottom: none;
  background-color: #efefef;
}
.reso-table_val {
  display: table-cell;
  border: solid 1px #ccc;
  border-right: none;
  border-bottom: none;
}
.sp_ff {
  border: solid 1px #ccc;
  margin-bottom: 20px;
}
.sp_ff img {
  width: 100px;
  height: auto;
}
.sp_ff h2.ps {
  border-left: solid 5px #24caff;
  padding-left: 0.4em;
}
.sp_ff h2.ai {
  border-left: solid 5px #ff7a19;
  padding-left: 0.4em;
}
.yattemiyou_index {
  border: solid 5px #ccc;
  background-color: #fffbe5;
}
.sp_label {
  display: inline;
  background-color: #cc0000;
  color: #fff;
  padding: 2px 6px;
  border-radius: 3px;
}
.sp_title_number img {
  vertical-align: middle;
  margin: -5px 5px 0 0;
}
/*-------------------------------------------------------------------

                                                            新着情報

--------------------------------------------------------------------*/
.headline_area:after {
  content: ""; display: block; clear: both;
}
.headline_area {
  border-top: dotted 1px #ccc;
  padding-bottom: 10px;
}
.yyyymmdd {
  display: inline-block;
  background-color: #999;
  color: #fff;
  font-size: 10px;
  padding: 0 5px;
  margin-top: 10px;
  border-radius: 3px;
}
.news_table {
  display: table;
  border: solid 1px #ccc;
  margin-bottom: 20px;
}
.news_tr {
  display: table-row;
}
.news_th {
  display: table-cell;
  border: solid 1px #ccc;
  padding: 5px 10px;
  background-color: #eee;
  white-space: nowrap;
}
.news_td {
  display: table-cell;
  border: solid 1px #ccc;
  padding: 5px 10px;
}
.news_th_blue {
  display: table-cell;
  border: solid 1px #ccc;
  padding: 5px 10px;
  background-color: #eee;
  font-weight: bold;
  color: #005cad;
}
.news_td_blue {
  display: table-cell;
  border: solid 1px #ccc;
  padding: 5px 10px;
  font-weight: bold;
  color: #005cad;
}
.news_th_red {
  display: table-cell;
  border: solid 1px #ccc;
  padding: 5px 10px;
  background-color: #eee;
  font-weight: bold;
  color: #cc0000;
}
.news_td_red {
  display: table-cell;
  border: solid 1px #ccc;
  padding: 5px 10px;
  font-weight: bold;
  color: #cc0000;
}