@charset "UTF-8";

/*共通--------------------------------------------------------------*/
/* ※ header, nav はリセット対象から除外（common_header.php は common.css で制御） */
body, div, span, object, iframe,h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code,del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, figcaption, figure, footer, hgroup, menu, section, summary,
time, mark, audio, video { margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; }
address { font-style:normal; }
body { line-height:1.5; letter-spacing:normal;}
article,aside,details,figcaption,figure,
footer,header,hgroup,menu,nav,section { display:block; }
nav ul { list-style:none; }
blockquote, q { quotes:none; }
blockquote:before, blockquote:after,q:before, q:after { content:''; content:none; }
 a { margin:0; padding:0; font-size:100%; vertical-align:baseline; background:transparent; }
ins { background-color:#ff9; color:#000; text-decoration:none; }
mark { background-color:#ff9; color:#000; font-style:italic; font-weight:bold; }
del { text-decoration: line-through; }
abbr[title], dfn[title] {    border-bottom:1px dotted; cursor:help; }
hr { display:block; height:1px; border:0; border-top:1px solid #cccccc; margin:1em 0; padding:0; }
table { border-collapse: collapse; border-spacing: 0; }
li { list-style:none; }
label { cursor:pointer; }
img { vertical-align: bottom; }
.left { float:left;}
.right { float:right;}
.cf:after,
#flow li:after,
section:after,
header:after,
div:after,
dl:after,
ul:after { content: ""; display: block; clear: both;}
.bd1 { border:solid 1px #ff0;}
.bd2 { border:solid 1px #0ff;}
.bd3 { border:solid 1px #f0f;}
.focus { background: #FFEFF0 !important; color:#333 }
.ic_blank { background-image: url(../img/icon_blank2.png) ; background-repeat:no-repeat; background-position:right; padding-right:13px; background-size:10px;}
.link { padding-left:16px; background-image:url(../img/icon_arw.png); background-repeat:no-repeat; background-position:left 4px;}
.sdw { background-image:url(../img/sdw_box.png); background-repeat:no-repeat; background-position:center; height:20px;}
input.myError { border:solid 2px red; }
label.myError { color:#FF0000; display:block; padding:2px 0 0 2px;}
textarea.myError { background-color:#CCFFFF;}
#form_type1 input[type=text].myError {border:solid 2px red!important;}
.disabled { display:none;}
input[type="image"][disabled] { opacity:0.4; cursor: default;}
input[type="image"][disabled]:hover { opacity:0.4; cursor: default;}
input[type="image"]:hover { opacity:0.8;}
.displaynone { display:none;}
.f12 { font-size:12px;}
.fwn { font-weight:normal;}
.at11666 { font-size:11px; color:#666; padding-top:10px;}
/*20160218*/
.pagetitle { background:#fafaf8; border-top:#f5f5f5 solid 1px; border-bottom:#e2e2e2 solid 1px; height:70px;}
.pagetitle h2 { font-size:20px; width:980px; margin:0 auto; font-weight:bold; color:#333; padding-top:22px; text-align:left;}
.pagetitle h2 span { font-size:12px; background:#FFD835; border-radius:5px; padding:3px 6px 2px; margin-left:8px; position:relative; top:-2px;}
.pagetitle h2 span.lease { background:#FFD835;}
#wrapper { width:920px; margin:0 auto; text-align:left; padding:0px 0 60px; font-size:14px; color:#333;}
.txt_1byte,.numonly  {ime-mode:disabled!important;}

/*Webお見積もり*/
#content { padding:10px 0;}
article { padding-top:40px;}
article h3 { font-size:20px; background-image: url(../img/icon_h3.jpg); background-repeat:no-repeat; background-size:6px 20px; background-position:left center; padding-left:15px; }
article p.txt { padding-top:15px;}
.mitumori article #inputsup { padding:20px 25px; width:660px; margin: 0 auto; background:#f8f8f8; border: solid 2px #ddd; border-radius:10px; margin-top:30px;}
.mitumori article #inputsup h4 { font-size:18px; padding-bottom:5px;}
.mitumori article #inputsup dl {font-size:16px; border-bottom: dotted 1px #D0D0D0; padding:8px 0 7px;}
.mitumori article #inputsup dl dt { float:left}
.mitumori article #inputsup dl dt strong { color:#FF8A00}
.mitumori article #inputsup dl dd { float:right; color:#333; font-size:14px; } 
.mitumori article #inputsup p { font-size:11px; padding-top:15px; line-height:1.6}
.mitumori article #inputsup .btn { text-align:center;}
.mitumori .suryou_arw { height:40px; background-image:url(../img/mitu_arw.jpg); background-position:center; background-repeat:no-repeat; background-size:30px 16px;}
.mitumori article input[type=text] { text-align:center; vertical-align:middle; margin:-2px 0 0 0; border:solid 1px #D0D0D0; background:#f5f5f5; padding:5px 0px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -webkit-appearance:none; box-shadow:none; margin:0 8px 0 0; font-size:12px; color:#333;ime-mode:active; width:40px; position:relative;}
.mitumori article #inputsup input[type=text] { background:#fff;}
.mitumori article input[type=radio]{ margin-right:6px; }
.mitumori table.type01 { width:860px; margin:0 auto; }
.mitumori table.type01 th {text-align:center;}
.mitumori table.type01 td.nam { padding-left:15px;}
.mitumori table.type01 th.num { width:100px;}
.mitumori table.type01 th.tan,
.mitumori table.type01 th.pri { width:110px;}
.mitumori table.type01 td.tan,
.mitumori table.type01 td.pri { text-align:right;}
.mitumori table.type01 td.num { text-align:center;}
.mitumori table.type01 td strong { font-size:15px; font-weight:bold;}
.mitumori table.type01 td .link { font-size:12px;}
.mitumori table.type01 td,
.mitumori table.type01 th {height:45px; font-size:14px; }
.mitumori table.type01 td.total { background:#FFF4E5; text-align:right; font-weight:bold;}

/*資料請求*/
.siryouseikyuu article div.left { width:70%;}
.siryouseikyuu article ul { background:#F5F5F5; border:solid 1px #EEEEEE; padding:10px 0px 20px 10px; width:920px; margin-top:20px;}
.siryouseikyuu article ul li:first-child { margin-left:0px; width:220px;}
.siryouseikyuu article ul li { width:219px; margin-left:10px; float:left;}
.siryouseikyuu article ul li a { display:block; width:100%; position:relative; padding:18px 0; font-size:15px; font-weight:bold; border:solid 1px #ccc; background:#fff; text-align:center; color:#333;}
.siryouseikyuu article ul li a:hover { text-decoration:none; opacity:1; background:#FFF4E5}
.siryouseikyuu article ul li p { font-size:12px;  padding:10px 3px 0;}
.siryouseikyuu article ul li a span { background-image:url(../img/icon_link.png); background-repeat:no-repeat; background-size: 12px; background-position:right 5px; padding-right:18px;padding-left:8px;}
.siryouseikyuu article ul li a.pdf span { background-image:url(../img/icon_pdf.png); background-size: 15px; background-position:right 2px; }
.siryouseikyuu article ul li a.pdf p { position:absolute; font-weight:normal; left:0; right:0; top:27px; font-size:10px; color:#666}

/*リース*/
.order_lease table.type01 { width:860px; margin:30px auto 0;}
.order_lease table.type01 td, .order_lease table.type01 th {height:40px; font-size:14px; text-align:center;}
.order_lease article ul { background:#F5F5F5; border:solid 1px #EEEEEE; padding:10px 0px 10px 0px; width:920px; margin-top:20px;}
.order_lease article ul li:first-child { margin-left:10px;}
.order_lease article ul li { width:227px; margin:0; height:240px;float:left; background-repeat:no-repeat;}
.order_lease article ul li h4 { font-weight:bold; font-size:16px; padding:12px 0 5px 15px;}
.order_lease article ul li h4 strong { color:#ff8400; font-size:17px; padding-right:8px;}
.order_lease article ul li p { font-size:12px; padding:0 20px 0 15px; line-height:1.4;}
.order_lease article ul li.step1 { background-image:url(../img/lease_step1.jpg); }
.order_lease article ul li.step2 { background-image:url(../img/lease_step2.jpg); }
.order_lease article ul li.step3 { background-image:url(../img/lease_step3.jpg); }
.order_lease article ul li.step4 { background-image:url(../img/lease_step4.jpg); width:219px;}
.order_lease article ul li.step4 p { padding:0 15px;}

/*キャンペーン*/
.order_lease article ul li.step1-1 { background-image:url(../img/campaign_step1.jpg); }
.order_lease article ul li.step1-2 { background-image:url(../img/campaign_step2.jpg); }
.order_lease article ul li.step1-3 { background-image:url(../img/campaign_step3.jpg); }
.order_lease article ul li.step1-4 { background-image:url(../img/campaign_step4.jpg); width:219px;}
.order_lease article ul li.step1-4 p { padding:0 15px;}


/*フォームエリア*/
#content_form { background-image:url(../img/bg_formarea.jpg); background-repeat:repeat-x; padding-bottom:40px;}
#content_form #form_title { padding:50px 0 25px; border-top:1px solid #ddd;}
#content_form #form_title h3 { font-size:30px;}
#content_form #form_title p { font-size:14px; padding-top:15px}
.postdata { visibility:hidden; height:0px;}

/*アンケートキャンペーン--------------------------------------------------------------*/
#questionnaire_cp h1 { line-height:120%}
#login #form input[type=text]{ margin-left:9px; margin-right:23px;}
#login #form input[type=password]{ margin-left:5px;}
#login #form input[type=submit] { margin:0 0 0 0px;}
#questionnaire_cp #wrapper { width:920px; height:auto; margin:0 auto; color:#333;}
#questionnaire_cp #main { padding:40px 0 0px;}
#questionnaire_cp #main .title_area { text-align:center;}
#questionnaire_cp #main .title_area h3 { font-size:22px;}
#questionnaire_cp #content p.txt { font-size:15px; padding-top:12px; text-align:center; line-height:160%}
#questionnaire_cp #content p.txt strong { display: inline-block; font-size:20px; padding-bottom:12px; padding-top:5px; line-height:1.45}
#questionnaire_cp .cp_price { margin:25px auto 0; width:600px; background:#f5f5f5; padding:10px 10px 15px; border: solid 1px #eaeaea;}
#questionnaire_cp .cp_price table{ background:white; width:100%;}
#questionnaire_cp .cp_price table tr { border-top:solid 2px #f5f5f5;}
#questionnaire_cp .cp_price table tr.total {background:#FFF4E3;} 
#questionnaire_cp .cp_price table tr:first-child { border-top:none;}
#questionnaire_cp .cp_price table th { height:60px; vertical-align:middle;padding-left:20px; }
#questionnaire_cp .cp_price table td { vertical-align:middle; padding-right:15px; text-align: right;}
#questionnaire_cp .cp_price table .item { font-size:22px; font-weight:bold;}
#questionnaire_cp .cp_price table .x1 { font-size:18px; font-weight:normal; padding-left:3px;}
#questionnaire_cp .cp_price table .link { font-size:12px; padding-left:16px; background-image:url(../img/icon_arw.png); background-repeat:no-repeat; background-position:left 3px;}
#questionnaire_cp .cp_price table .link:hover { opacity:0.75}
#questionnaire_cp .cp_price table .link a { color:#006cd8; font-weight:normal; }
#questionnaire_cp .cp_price table .price { font-size:26px; color:#000000; font-weight:bold;}
#questionnaire_cp .cp_price table .yen { font-size:16px; font-weight:bold; font-weight:bold; padding:0 2px 0 2px;}
#questionnaire_cp .cp_price table .komi { font-size:19px;font-weight: bold;}
#questionnaire_cp .cp_price table .komi_price { font-size:18px;font-weight: bold; color:#000000;}
#questionnaire_cp .cp_price table .title { padding-right:0px;}
#questionnaire_cp .cp_price_txt2 { font-size:12px; text-align:center;}
#questionnaire_cp #main .check { font-size:14px; font-weight:bold; text-align:center; padding:20px 0 15px;}
#questionnaire_cp #main .check label { padding:0 6px;}
#questionnaire_cp #main .txtarea { font-size:12px; padding:0 6px;}
#questionnaire_cp #main .check label input[type=radio] { margin-right:7px; }

.re1602 #foot_navi2 { font-size:12px;}
.re1602 #foot_navi2 .contents_wrap .fn2_box { width:230px; margin: 0 0 0 20px;}
.re1602 #foot_navi2 .contents_wrap .fn2_box:first-child { margin-left:0px;}
.re1602 #foot_navi2 .contents_wrap .fn2_box h3 { padding-bottom:4px; margin-bottom:8px;}
.re1602 #foot_navi2 .contents_wrap .fn2_box li { line-height:1.6}

/*フォーム(id=form_type1)--------------------------------------------------------------*/
#form_type1 { margin-bottom:50px;}
#form_type1:last-child { margin-bottom:0px;}
#form_type1 input, #form_type1 select { vertical-align:middle; margin:-2px 0 0 0;}
#form_type1 input[type=text], #form_type1 textarea{ border:solid 1px #D0D0D0; background:#f5f5f5; padding:5px 10px; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -webkit-appearance:none; box-shadow:none; margin:0; font-size:12px; color:#333;ime-mode:active}
#form_type1 select { padding:4px 5px 5px 5px; width:150px;} 
#form_type1 input[type=radio],
#form_type1 input[type=checkbox] { margin-right:6px; }
#form_type1 .title_area { border-bottom: solid 3px #444; margin-bottom:5px; padding-bottom:8px;}
#form_type1 .title_area h3 { font-size:22px; float:left;}
#form_type1 .title_area h4 { font-size:20px; float:left;}
#form_type1 .title_area span { padding:7px 0 0 10px; display:inline-block; float:left; font-size:12px;}
#form_type1 .title_area span label { padding-left:17px}
#form_type1 .title_area p.txt { float:left; font-size:11px; background:#f5f5f5; padding:6px 8px 5px; margin-left:20px; line-height:120%} 
#form_type1 dl { border-bottom: dotted 1px #d0d0d0; padding:10px 0 10px;}
#form_type1 dl dt { float:left; width:30%; font-weight:bold; font-size:14px; padding-top:3px;}
#form_type1 dl dt p.right { width:240px;}
#form_type1 dl dt span { color:white; padding:1px 4px; margin-right:8px; position:relative; top:-1px; background:#ff5f80; font-size:10px; border-radius: 3px;  -webkit-border-radius: 3px; -moz-border-radius: 3px;}
#form_type1 dl dt span.free {background:#B5B5BA;} 
#form_type1 dl dd { float:right; width:68%; color: #333; font-size:13px}
#form_type1 dl dd .size_SS { width:150px;}
#form_type1 dl dd .size_S { width:200px;}
#form_type1 dl dd .size_M { width:380px;}
#form_type1 dl dd .size_L { width:600px;}
#form_type1 dl dd .come { font-size:11px; color: #333;}
#form_type1 dl dd p.txt { margin-top:5px;}
#form_type1 dl dd label { margin-right:14px;}

#form_type1 dl dd span.txt { padding-left:10px;}
#form_type1 dl dd.radio_box { padding-top:2px;}
#form_type1 dl dd.radio_box label { margin-right:20px; }
#form_type1 dl dd.check_box { padding-bottom:2px;}
#form_type1 dl dd.check_box label { margin-top:3px; display:block;}
#pp_area { width:70%; margin:0 auto 50px; }
#pp_area .slide_btn { font-size:13px; padding:9px 0 8px; background-color:#888; background-size:20px; background-repeat:no-repeat; background-position:98.5% center; color:white; text-align:center; }
#pp_area .slide_btn.open { background-image:url(../img/icon_open.png); }
#pp_area .slide_btn.close { background-image:url(../img/icon_close.png); }
#pp_area .slide_btn:hover { opacity:0.9}
#pp_area .slide_box { border:solid 1px #ccc; border-top:none; padding:15px 20px; font-size:12px; }
#pp_area .slide_box h4 { font-size:14px;}
#form_type1.btn_area  { width:330px; margin:0 auto;}
#form_type1.btn_area li { margin-bottom:15px;}
#form_type1.btn_area li.check { width:330px; border:solid 1px #D0D0D0; background:#f5f5f5; text-align:center; font-size:12px; font-weight:bold;}
#form_type1.btn_area li.check label { width:100%; height:100%; display:block; padding:15px 0;}
#form_type1.btn_area li.check label:hover{ background:#FFECEF}
#form_type1.btn_area li.submit a:hover { opacity:0.75;}
#form_type1.btn_area li.check span { color:white; padding:1px 4px; margin-right:8px; position:relative; top:-1px; background:#ff5f80; font-size:10px; border-radius: 3px;  -webkit-border-radius: 3px; -moz-border-radius: 3px;}
#questionnaire_cp.page_check #form_type1 { margin-bottom:40px} 
#questionnaire_cp.page_check #form_type1:first-child { margin-top:40px;}
#questionnaire_cp.page_check #form_type1 .title_area h3 { font-size:18px;}
#questionnaire_cp.page_check #form_type1 dl { padding:4px 0; }
#questionnaire_cp.page_check #form_type1 dl dt { padding:4px 0; font-size:12px}
#questionnaire_cp.page_check #form_type1 dl dd { padding:4px 0; font-size:12px; }
#questionnaire_cp.page_check #form_type1.btn_area { width:540px; text-align:center;}
#questionnaire_cp.page_check #form_type1.btn_area li { display:inline; padding:10px;}
#questionnaire_cp #form_type1.btn_area small { display: block; padding:8px; font-size:12px; text-align:center}

/*table(class="type01")*/
table.type01 { border-left:solid 1px #ccc; border-top:solid 1px #ccc; }
table.type01 tr {}
table.type01 th {background:#f8f8f8; }
table.type01 td { padding:0 10px;}
table.type01 td,
table.type01 th {border-right:solid 1px #ccc; border-bottom:solid 1px #ccc; vertical-align:middle;}
table.type01 td.total { background:#FFF4E5;}


/* ==========================================================================
   レスポンシブ対応 (768px以下)
   ========================================================================== */
@media screen and (max-width: 768px) {

  /* --- 共通 --- */
  img { max-width: 100%; height: auto; }
  * { box-sizing: border-box; }

  /* --- ページタイトル --- */
  .pagetitle { height: auto; padding: 15px; }
  .pagetitle h2 { width: auto; font-size: 17px; padding-top: 0; }

  /* --- メインコンテナ (#wrapper) --- */
  #wrapper { width: auto; padding: 15px 15px 40px; }
  #wrapper > br { display: none; }
  #wrapper > h1 { font-size: 14px; text-align: center; }
  #wrapper > h1 a { word-break: break-all; }

  /* --- 見出し --- */
  article { padding-top: 25px; }
  article h3 { font-size: 17px; line-height: 1.4; }
  article h4.txt { font-size: 13px; line-height: 1.5; }
  article p.txt { font-size: 13px; line-height: 1.6; }

  /* --- 入力補助ボックス (#inputsup) --- */
  .mitumori article #inputsup {
    width: auto;
    padding: 15px;
    margin-top: 20px;
  }
  .mitumori article #inputsup h4 { font-size: 16px; }
  .mitumori article #inputsup dl { font-size: 14px; }
  .mitumori article #inputsup dl dt {
    float: none;
    margin-bottom: 5px;
  }
  .mitumori article #inputsup dl dd {
    float: none;
    text-align: left;
    font-size: 14px;
  }
  .mitumori article #inputsup .btn img {
    max-width: 100%;
    height: auto;
  }

  /* --- 見積テーブル → カードレイアウト --- */
  .mitumori table.type01,
  .order_lease table.type01 { width: 100%; }

  .mitumori table.type01 thead,
  .order_lease table.type01 thead { display: none; }

  .mitumori table.type01 tr,
  .order_lease table.type01 tr {
    display: block;
    border: solid 1px #ccc;
    border-bottom: none;
    padding: 10px 12px;
  }
  .mitumori table.type01 tr:last-child,
  .order_lease table.type01 tr:last-child {
    border-bottom: solid 1px #ccc;
  }

  .mitumori table.type01 td,
  .mitumori table.type01 th,
  .order_lease table.type01 td,
  .order_lease table.type01 th {
    display: block;
    width: 100%;
    border: none;
    height: auto;
    text-align: left !important;
    padding: 3px 0;
  }
  .mitumori table.type01 td.nam {
    padding-left: 0;
    font-size: 14px;
    padding-bottom: 6px;
    border-bottom: dotted 1px #eee;
  }
  .mitumori table.type01 td.num,
  .mitumori table.type01 td.tan,
  .mitumori table.type01 td.pri {
    font-size: 13px;
    padding: 4px 0;
  }
  .mitumori table.type01 td.num::before { content: "数量："; font-weight: bold; }
  .mitumori table.type01 td.tan::before { content: "単価(税込)："; font-weight: bold; }
  .mitumori table.type01 td.pri::before { content: "金額(税込)："; font-weight: bold; }
  .mitumori table.type01 td.total {
    text-align: center !important;
    font-size: 16px;
    padding: 12px 0;
  }

  /* --- お客様情報 フォームエリア --- */
  #content_form { padding-bottom: 25px; }
  #content_form #form_title { padding: 30px 15px 15px; }
  #content_form #form_title h3 { font-size: 20px; }
  #content_form #form_title p { font-size: 13px; }

  /* --- フォーム (#form_type1) --- */
  #form_type1 { margin-bottom: 30px; }
  #form_type1 .title_area h3 { font-size: 18px; float: none; }
  #form_type1 .title_area h4 { font-size: 16px; float: none; }
  #form_type1 .title_area span { float: none; display: block; padding: 5px 0 0; }
  #form_type1 .title_area p.txt { float: none; margin-left: 0; margin-top: 5px; }

  /* dt/dd を縦並びに */
  #form_type1 dl dt {
    float: none;
    width: 100%;
    padding-bottom: 5px;
    font-size: 13px;
  }
  #form_type1 dl dd {
    float: none;
    width: 100%;
    font-size: 14px;
  }

  /* 入力フィールドをフル幅に */
  #form_type1 dl dd .size_SS,
  #form_type1 dl dd .size_S,
  #form_type1 dl dd .size_M,
  #form_type1 dl dd .size_L {
    width: 100%;
    box-sizing: border-box;
    font-size: 16px; /* iOS拡大防止 */
  }
  #form_type1 input[type=text],
  #form_type1 textarea {
    font-size: 16px; /* iOS拡大防止 */
    padding: 8px 10px;
  }

  /* 送信ボタン */
  #form_type1.btn_area { width: auto; padding: 0 15px; }
  .btn_area .submit { text-align: center; }
  .btn_area .submit input[type=image] {
    width: 100%;
    max-width: 332px;
    height: auto;
  }

  /* --- リース・キャンペーン --- */
  .order_lease article ul {
    width: auto;
    padding: 10px;
  }
  .order_lease article ul li {
    float: none;
    width: 100%;
    height: auto;
    margin: 0 0 10px;
    padding-bottom: 15px;
    background-size: contain;
  }
  .order_lease article ul li:first-child { margin-left: 0; }

  /* --- 資料請求 --- */
  .siryouseikyuu article ul {
    width: auto;
    padding: 10px;
  }
  .siryouseikyuu article ul li,
  .siryouseikyuu article ul li:first-child {
    float: none;
    width: 100%;
    margin: 0 0 10px;
  }

  /* --- アンケートキャンペーン --- */
  #questionnaire_cp #wrapper { width: auto; padding: 15px; }
  #questionnaire_cp .cp_price { width: auto; }
  #questionnaire_cp .cp_price table .item { font-size: 16px; }
  #questionnaire_cp .cp_price table .price { font-size: 20px; }
  #questionnaire_cp.page_check #form_type1.btn_area { width: auto; }
  #questionnaire_cp.page_check #form_type1.btn_area li { display: block; padding: 5px 0; }

  /* --- フッターナビ --- */
  .re1602 #foot_navi2 .contents_wrap .fn2_box {
    width: 100%;
    margin: 0 0 15px;
  }
}