/*

 # mazuda_ucar_sp (v1.0.2rc3) 2013-07-16

 * mazuda u-car smartphone site

 * http://www.mazda.co.jp/purchase/ucar/

 * Copyright (c) 2013 Mazda Motor Corporation.

 */

@charset "UTF-8";

body,

header, hgroup, footer, section, article, aside, nav, div,

h1, h2, h3, h4, h5, h6,

p, blockquote, address, pre,

ol, ul, li, dl, dt, dd,

table, tr, th, td,

img, object, param, embed, script, noscript,

form, fieldset, input, textarea, select, button, legend, label,

cite, q, em, strong, span, abbr, code,

figure, figcaption, time {

  margin: 0;

  padding: 0;

  line-height: 1;

  letter-spacing: 0;

  font-style: normal;

}



body {

  -webkit-text-size-adjust: 100%;

  -moz-text-size-adjust: 100%;

  -ms-text-size-adjust: 100%;

  -o-text-size-adjust: 100%;

  text-size-adjust: 100%;

  background: white;

  font-size: 14px;

  font-family: Helvetica, Arial, "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", sans_serif;

}



img {

  -ms-interpolation-mode: bicubic;

}



img, object, embed, param {

  vertical-align: bottom;

  border: none;

}



object, embed, param {

  outline: none;

}



h1, h2, h3, h4, h5, h6 {

  font-size: 14px;

}



p, blockquote, address, pre, li, dt, dd {

  font-size: 14px;

}



th, td, caption {

  font-size: 14px;

}



input, select, textarea, button {

  line-height: 1.5;

  vertical-align: middle;

  font-size: 14px;

  font-family: Helvetica, Arial, "Hiragino Kaku Gothic Pro", Osaka, "ＭＳ Ｐゴシック", sans_serif;

}



button,

input[type=button],

input[type=submit],

input[type=reset] {

  cursor: pointer;

}



optgroup {

  font-style: normal;

}



fieldset {

  border: none;

}



legend, cite, q, em, strong, span, abbr, code {

  font-size: inherit;

}



abbr {

  text-transform: uppercase;

  text-decoration: none;

}



br {

  letter-spacing: 0 !important;

}



hr {

  clear: both;

}



header, hgroup, footer, section, article, aside, nav, figure {

  display: block;

}



.ie body, .ie div, .ie fieldset, .ie dl,

.ie header, .ie hgroup, .ie footer, .ie section, .ie article, .ie aside, .ie nav, .ie figure,

.ie .inner, .ie .header, .ie .footer, .ie .section, .ie .article, .ie .aside, .ie .nav, .ie .wrapper, .ie .wrap {

  zoom: 1;

}



h1, h2, h3, h4, h5, h6,

p, blockquote, address, pre,

ol, ul, li, dl, dt, dd, th, td,

a, span, q, em, strong, b {

  -webkit-user-select: text;

  -moz-user-select: text;

  -ms-user-select: text;

  -o-user-select: text;

  user-select: text;

}



a {

  -webkit-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -moz-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -ms-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -o-tap-highlight-color: rgba(0, 160, 218, 0.7);

  tap-highlight-color: rgba(0, 160, 218, 0.7);

}



/*

# Icon Class



アイコンの抽象クラス `%Icon` と `%IconAfter` の2種類を用意。

通常は `:before` 擬似要素を使用した `%Icon` を継承し、

併用する場合は `:after` 擬似要素を使用した `%IconAfter` を継承する。



#### [Options]



 - `.icon-star-bf-{colorscheme}` スターアイコン

 - `.icon-link-arrow-bf-{colorscheme}` テキストリンク用のアローアイコン

 - `.icon-btn-arrow-bf-{colorscheme}` ボタン用のアローアイコン

 - `.icon-home-bf-{colorscheme}` ホームアイコン

 - `.icon-pagetop-bf-{colorscheme}` ページトップアイコン

 - `.icon-plus-bf-{colorscheme}` プラスアイコン

 - `.icon-minus-bf-{colorscheme}` マイナスアイコン

 - `.icon-calculator-bf-{colorscheme}` 電卓アイコン

 - `.icon-phone-bf-{colorscheme}` 電話アイコン

 - `.icon-bang-bf-{colorscheme}` 「！」アイコン

 - `.icon-return-bf-{colorscheme}` リターンアイコン

 - `.icon-plus-circle-af-{colorscheme}` サークル付きのプラスアイコン

 - `.icon-minus-circle-af-{colorscheme}` サークル付きのマイナスアイコン

*/

[class*="icon-star-bf-"]:before, [class*="icon-link-arrow-bf-"]:before, [class*="icon-btn-arrow-bf-"]:before, [class*="icon-home-bf-"]:before, [class*="icon-pagetop-bf-"]:before, [class*="icon-plus-bf-"]:before, [class*="icon-minus-bf-"]:before, [class*="icon-calculator-bf-"]:before, [class*="icon-phone-bf-"]:before, [class*="icon-bang-bf-"]:before, [class*="icon-return-bf-"]:before, [class*="icon-star-af-"]:after, [class*="icon-link-arrow-af-"]:after, [class*="icon-btn-arrow-af-"]:after, [class*="icon-home-af-"]:after, [class*="icon-pagetop-af-"]:after, [class*="icon-plus-af-"]:after, [class*="icon-minus-af-"]:after, [class*="icon-calculator-af-"]:after, [class*="icon-phone-af-"]:after, [class*="icon-bang-af-"]:after, [class*="icon-return-af-"]:after, [class*="icon-plus-circle-af-"]:after, [class*="icon-minus-circle-af-"]:after {

  display: inline-block;

  width: 24px;

  height: 24px;

  background-repeat: no-repeat;

  -webkit-background-size: cover;

  -moz-background-size: cover;

  -ms-background-size: cover;

  -o-background-size: cover;

  background-size: cover;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

}



/*

## Icon Color Scheme



アイコンのカラースキーム設定



#### [Options]



- `.{iconname}-white` ホワイト

- `.{iconname}-litegrey` ライトグレー

- `.{iconname}-grey` グレー

- `.{iconname}-black` ブラック

- `.{iconname}-blue` ブルー

- `.{iconname}-red` レッド



*/

[class*="icon-"][class*="-bf-white"]:before,

[class*="icon-"][class*="-af-white"]:after {

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAiYAAAAyCAYAAABoFhDiAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpCQUNCMkYyQjI3MjA2ODExODIyQUYwRkI5QzAwNDEzQiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2QUI5NTVGQTk4RTUxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2QUI5NTVGOTk4RTUxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDI4MDExNzQwNzIwNjgxMTgyMkFDMzQ2QTZFMTk2QzMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QkFDQjJGMkIyNzIwNjgxMTgyMkFGMEZCOUMwMDQxM0IiLz4gPC9yZGY6RGVzY3Jp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);

}



[class*="icon-"][class*="-bf-litegrey"]:before,

[class*="icon-"][class*="-af-litegrey"]:after {

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAiYAAAAyCAYAAABoFhDiAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpCQUNCMkYyQjI3MjA2ODExODIyQUYwRkI5QzAwNDEzQiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2QUI5NTVGRTk4RTUxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2QUI5NTVGRDk4RTUxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDI4MDExNzQwNzIwNjgxMTgyMkFDMzQ2QTZFMTk2QzMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QkFDQjJGMkIyNzIwNjgxMTgyMkFGMEZCOUMwMDQxM0IiLz4gPC9yZGY6RGVzY3Jp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);

}



[class*="icon-"][class*="-bf-grey"]:before,

[class*="icon-"][class*="-af-grey"]:after {

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAiYAAAAyCAYAAABoFhDiAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpCQUNCMkYyQjI3MjA2ODExODIyQUYwRkI5QzAwNDEzQiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2QUM4MjgyNTk4RTUxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2QUM4MjgyNDk4RTUxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDI4MDExNzQwNzIwNjgxMTgyMkFDMzQ2QTZFMTk2QzMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QkFDQjJGMkIyNzIwNjgxMTgyMkFGMEZCOUMwMDQxM0IiLz4gPC9yZGY6RGVzY3Jp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);

}



[class*="icon-"][class*="-bf-black"]:before,

[class*="icon-"][class*="-af-black"]:after {

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAiYAAAAyCAYAAABoFhDiAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpCQUNCMkYyQjI3MjA2ODExODIyQUYwRkI5QzAwNDEzQiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2QUM4MjgyOTk4RTUxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2QUM4MjgyODk4RTUxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDI4MDExNzQwNzIwNjgxMTgyMkFDMzQ2QTZFMTk2QzMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QkFDQjJGMkIyNzIwNjgxMTgyMkFGMEZCOUMwMDQxM0IiLz4gPC9yZGY6RGVzY3Jp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);

}



[class*="icon-"][class*="-bf-blue"]:before,

[class*="icon-"][class*="-af-blue"]:after {

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAiYAAAAyCAYAAABoFhDiAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpCQUNCMkYyQjI3MjA2ODExODIyQUYwRkI5QzAwNDEzQiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2QUM4MjgyRDk4RTUxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2QUM4MjgyQzk4RTUxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDI4MDExNzQwNzIwNjgxMTgyMkFDMzQ2QTZFMTk2QzMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QkFDQjJGMkIyNzIwNjgxMTgyMkFGMEZCOUMwMDQxM0IiLz4gPC9yZGY6RGVzY3Jp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);

}



[class*="icon-"][class*="-bf-red"]:before,

[class*="icon-"][class*="-af-red"]:after {

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAiYAAAAyCAYAAABoFhDiAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpCQUNCMkYyQjI3MjA2ODExODIyQUYwRkI5QzAwNDEzQiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDozNzg1MTBFRTk4RTcxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDozNzg1MTBFRDk4RTcxMUUyQjM5Q0NFQzcxOTlFOEQ2RSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDI4MDExNzQwNzIwNjgxMTgyMkFDMzQ2QTZFMTk2QzMiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6QkFDQjJGMkIyNzIwNjgxMTgyMkFGMEZCOUMwMDQxM0IiLz4gPC9yZGY6RGVzY3Jp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);

}



/*

## .icon-star-bf-{colorscheme}



スターアイコン



#### [Option]



- `icon-star-af-{colorscheme}` :after 擬似要素バージョン





	<span class="icon-star-bf-white">テキスト</span>

	<span class="icon-star-bf-litegrey">テキスト</span>

	<span class="icon-star-bf-grey">テキスト</span>

	<span class="icon-star-bf-black">テキスト</span>

	<span class="icon-star-bf-blue">テキスト</span>

	<span class="icon-star-bf-red">テキスト</span>

*/

[class*="icon-star-bf-"]:before {

  content: "";

  background-position: 0 50%;

}



[class*="icon-star-af-"]:after {

  content: "";

  background-position: 0 50%;

}



/*

## .icon-link-arrow-bf-{colorscheme}



テキストリンク用のアローアイコン



#### [Option]



- `icon-link-arrow-af-{colorscheme}` :after 擬似要素バージョン





	<span class="icon-link-arrow-bf-white">テキスト</span>

	<span class="icon-link-arrow-bf-litegrey">テキスト</span>

	<span class="icon-link-arrow-bf-grey">テキスト</span>

	<span class="icon-link-arrow-bf-black">テキスト</span>

	<span class="icon-link-arrow-bf-blue">テキスト</span>

	<span class="icon-link-arrow-bf-red">テキスト</span>

*/

[class*="icon-link-arrow-bf-"]:before {

  content: "";

  background-position: -24px 50%;

}



[class*="icon-link-arrow-af-"]:after {

  content: "";

  background-position: -24px 50%;

}



/*

## .icon-btn-arrow-bf-{colorscheme}



ボタン用のアローアイコン



#### [Option]



- `icon-btn-arrow-af-{colorscheme}` :after 擬似要素バージョン





	<span class="icon-btn-arrow-bf-white">テキスト</span>

	<span class="icon-btn-arrow-bf-litegrey">テキスト</span>

	<span class="icon-btn-arrow-bf-grey">テキスト</span>

	<span class="icon-btn-arrow-bf-black">テキスト</span>

	<span class="icon-btn-arrow-bf-blue">テキスト</span>

	<span class="icon-btn-arrow-bf-red">テキスト</span>

*/

[class*="icon-btn-arrow-bf-"]:before {

  content: "";

  background-position: -48px 50%;

}



[class*="icon-btn-arrow-af-"]:after {

  content: "";

  background-position: -48px 50%;

}



/*

## .icon-home-bf-{colorscheme}



ホームアイコン



#### [Option]



- `icon-home-af-{colorscheme}` :after 擬似要素バージョン





	<span class="icon-home-bf-white">テキスト</span>

	<span class="icon-home-bf-litegrey">テキスト</span>

	<span class="icon-home-bf-grey">テキスト</span>

	<span class="icon-home-bf-black">テキスト</span>

	<span class="icon-home-bf-blue">テキスト</span>

	<span class="icon-home-bf-red">テキスト</span>

*/

[class*="icon-home-bf-"]:before {

  content: "";

  background-position: -72px 50%;

}



[class*="icon-home-af-"]:after {

  content: "";

  background-position: -72px 50%;

}



/*

## .icon-pagetop-bf-{colorscheme}



ページトップアイコン



#### [Option]



- `icon-pagetop-af-{colorscheme}` :after 擬似要素バージョン





	<span class="icon-pagetop-bf-white">テキスト</span>

	<span class="icon-pagetop-bf-litegrey">テキスト</span>

	<span class="icon-pagetop-bf-grey">テキスト</span>

	<span class="icon-pagetop-bf-black">テキスト</span>

	<span class="icon-pagetop-bf-blue">テキスト</span>

	<span class="icon-pagetop-bf-red">テキスト</span>

*/

[class*="icon-pagetop-bf-"]:before {

  content: "";

  background-position: -96px 50%;

}



[class*="icon-pagetop-af-"]:after {

  content: "";

  background-position: -96px 50%;

}



/*

## .icon-plus-bf-{colorscheme}



プラスアイコン



#### [Option]



- `icon-plus-af-{colorscheme}` :after 擬似要素バージョン





	<span class="icon-plus-bf-white">テキスト</span>

	<span class="icon-plus-bf-litegrey">テキスト</span>

	<span class="icon-plus-bf-grey">テキスト</span>

	<span class="icon-plus-bf-black">テキスト</span>

	<span class="icon-plus-bf-blue">テキスト</span>

	<span class="icon-plus-bf-red">テキスト</span>

*/

[class*="icon-plus-bf-"]:before {

  content: "";

  background-position: -120px 50%;

}



[class*="icon-plus-af-"]:after {

  content: "";

  background-position: -120px 50%;

}



/*

## .icon-minus-bf-{colorscheme}



マイナスアイコン



#### [Option]



- `icon-minus-af-{colorscheme}` :after 擬似要素バージョン





	<span class="icon-minus-bf-white">テキスト</span>

	<span class="icon-minus-bf-litegrey">テキスト</span>

	<span class="icon-minus-bf-grey">テキスト</span>

	<span class="icon-minus-bf-black">テキスト</span>

	<span class="icon-minus-bf-blue">テキスト</span>

	<span class="icon-minus-bf-red">テキスト</span>

*/

[class*="icon-minus-bf-"]:before {

  content: "";

  background-position: -144px 50%;

}



[class*="icon-minus-af-"]:after {

  content: "";

  background-position: -144px 50%;

}



/*

## .icon-calculator-bf-{colorscheme}



電卓アイコン



#### [Option]



- `icon-calculator-af-{colorscheme}` :after 擬似要素バージョン





	<span class="icon-calculator-bf-white">テキスト</span>

	<span class="icon-calculator-bf-litegrey">テキスト</span>

	<span class="icon-calculator-bf-grey">テキスト</span>

	<span class="icon-calculator-bf-black">テキスト</span>

	<span class="icon-calculator-bf-blue">テキスト</span>

	<span class="icon-calculator-bf-red">テキスト</span>

*/

[class*="icon-calculator-bf-"]:before {

  content: "";

  background-position: -168px 50%;

}



[class*="icon-calculator-af-"]:after {

  content: "";

  background-position: -168px 50%;

}



/*

## .icon-phone-bf-{colorscheme}



電話アイコン



#### [Option]



- `.icon-phone-af-{colorscheme}` :after 擬似要素バージョン





	<span class="icon-phone-bf-white">テキスト</span>

	<span class="icon-phone-bf-litegrey">テキスト</span>

	<span class="icon-phone-bf-grey">テキスト</span>

	<span class="icon-phone-bf-black">テキスト</span>

	<span class="icon-phone-bf-blue">テキスト</span>

	<span class="icon-phone-bf-red">テキスト</span>

*/

[class*="icon-phone-bf-"]:before {

  content: "";

  background-position: -192px 50%;

}



[class*="icon-phone-af-"]:after {

  content: "";

  background-position: -192px 50%;

}



/*

## .icon-bang-bf-{colorscheme}



「！」アイコン



#### [Option]



- `.icon-bang-af-{colorscheme}` :after 擬似要素バージョン





	<span class="icon-bang-bf-white">テキスト</span>

	<span class="icon-bang-bf-litegrey">テキスト</span>

	<span class="icon-bang-bf-grey">テキスト</span>

	<span class="icon-bang-bf-black">テキスト</span>

	<span class="icon-bang-bf-blue">テキスト</span>

	<span class="icon-bang-bf-red">テキスト</span>

*/

[class*="icon-bang-bf-"]:before {

  content: "";

  background-position: -216px 50%;

}



[class*="icon-bang-af-"]:after {

  content: "";

  background-position: -216px 50%;

}



/*

## .icon-return-bf-{colorscheme}



リターンアイコン



#### [Option]



- `.icon-return-af-{colorscheme}` :after 擬似要素バージョン





	<span class="icon-return-bf-white">テキスト</span>

	<span class="icon-return-bf-litegrey">テキスト</span>

	<span class="icon-return-bf-grey">テキスト</span>

	<span class="icon-return-bf-black">テキスト</span>

	<span class="icon-return-bf-blue">テキスト</span>

	<span class="icon-return-bf-red">テキスト</span>

*/

[class*="icon-return-bf-"]:before {

  content: "";

  background-position: -240px 50%;

}



[class*="icon-return-af-"]:after {

  content: "";

  background-position: -240px 50%;

}



/*

## .icon-plus-circle-af-{colorscheme}



サークル付きのプラスアイコン



	<span class="icon-plus-circle-af-white">テキスト</span>

	<span class="icon-plus-circle-af-litegrey">テキスト</span>

	<span class="icon-plus-circle-af-grey">テキスト</span>

	<span class="icon-plus-circle-af-black">テキスト</span>

	<span class="icon-plus-circle-af-blue">テキスト</span>

	<span class="icon-plus-circle-af-red">テキスト</span>

*/

[class*="icon-plus-circle-af-"]:after {

  content: "";

  background-position: -120px 50%;

  background-color: white;

  -webkit-box-shadow: inset rgba(0, 0, 0, 0.4) 1px 1px 2px;

  -moz-box-shadow: inset rgba(0, 0, 0, 0.4) 1px 1px 2px;

  -ms-box-shadow: inset rgba(0, 0, 0, 0.4) 1px 1px 2px;

  -o-box-shadow: inset rgba(0, 0, 0, 0.4) 1px 1px 2px;

  box-shadow: inset rgba(0, 0, 0, 0.4) 1px 1px 2px;

  -webkit-border-radius: 17px;

  -moz-border-radius: 17px;

  -ms-border-radius: 17px;

  -o-border-radius: 17px;

  border-radius: 17px;

}



/*

## .icon-plus-circle-af-{colorscheme}



サークル付きのアイナスアイコン



	<span class="icon-plus-circle-af-white">テキスト</span>

	<span class="icon-plus-circle-af-litegrey">テキスト</span>

	<span class="icon-plus-circle-af-grey">テキスト</span>

	<span class="icon-plus-circle-af-black">テキスト</span>

	<span class="icon-plus-circle-af-blue">テキスト</span>

	<span class="icon-plus-circle-af-red">テキスト</span>

*/

[class*="icon-minus-circle-af-"]:after {

  content: "";

  background-position: -144px 50%;

  background-color: white;

  -webkit-box-shadow: inset rgba(0, 0, 0, 0.4) 1px 1px 2px;

  -moz-box-shadow: inset rgba(0, 0, 0, 0.4) 1px 1px 2px;

  -ms-box-shadow: inset rgba(0, 0, 0, 0.4) 1px 1px 2px;

  -o-box-shadow: inset rgba(0, 0, 0, 0.4) 1px 1px 2px;

  box-shadow: inset rgba(0, 0, 0, 0.4) 1px 1px 2px;

  -webkit-border-radius: 17px;

  -moz-border-radius: 17px;

  -ms-border-radius: 17px;

  -o-border-radius: 17px;

  border-radius: 17px;

}



/*

# Layouts



レイアウトのための汎用クラス

*/

/*

## .margin- & .padding-



汎用の margin、padding 設定用クラス



- `margin-{px}{direction}` {px} に余白のピクセル数、{direction} に余白の方向（top|left|right|bottom）を指定して設定する

*/

.margin-0top {

  margin-top: 0px !important;

}



.padding-0top {

  padding-top: 0px !important;

}



.margin-0left {

  margin-left: 0px !important;

}



.padding-0left {

  padding-left: 0px !important;

}



.margin-0bottom {

  margin-bottom: 0px !important;

}



.padding-0bottom {

  padding-bottom: 0px !important;

}



.margin-0right {

  margin-right: 0px !important;

}



.padding-0right {

  padding-right: 0px !important;

}



.margin-5top {

  margin-top: 5px !important;

}



.padding-5top {

  padding-top: 5px !important;

}



.margin-5left {

  margin-left: 5px !important;

}



.padding-5left {

  padding-left: 5px !important;

}



.margin-5bottom {

  margin-bottom: 5px !important;

}



.padding-5bottom {

  padding-bottom: 5px !important;

}



.margin-5right {

  margin-right: 5px !important;

}



.padding-5right {

  padding-right: 5px !important;

}



.margin-10top {

  margin-top: 10px !important;

}



.padding-10top {

  padding-top: 10px !important;

}



.margin-10left {

  margin-left: 10px !important;

}



.padding-10left {

  padding-left: 10px !important;

}



.margin-10bottom {

  margin-bottom: 10px !important;

}



.padding-10bottom {

  padding-bottom: 10px !important;

}



.margin-10right {

  margin-right: 10px !important;

}



.padding-10right {

  padding-right: 10px !important;

}



.margin-15top {

  margin-top: 15px !important;

}



.padding-15top {

  padding-top: 15px !important;

}



.margin-15left {

  margin-left: 15px !important;

}



.padding-15left {

  padding-left: 15px !important;

}



.margin-15bottom {

  margin-bottom: 15px !important;

}



.padding-15bottom {

  padding-bottom: 15px !important;

}



.margin-15right {

  margin-right: 15px !important;

}



.padding-15right {

  padding-right: 15px !important;

}



.margin-20top {

  margin-top: 20px !important;

}



.padding-20top {

  padding-top: 20px !important;

}



.margin-20left {

  margin-left: 20px !important;

}



.padding-20left {

  padding-left: 20px !important;

}



.margin-20bottom {

  margin-bottom: 20px !important;

}



.padding-20bottom {

  padding-bottom: 20px !important;

}



.margin-20right {

  margin-right: 20px !important;

}



.padding-20right {

  padding-right: 20px !important;

}



.margin-25top {

  margin-top: 25px !important;

}



.padding-25top {

  padding-top: 25px !important;

}



.margin-25left {

  margin-left: 25px !important;

}



.padding-25left {

  padding-left: 25px !important;

}



.margin-25bottom {

  margin-bottom: 25px !important;

}



.padding-25bottom {

  padding-bottom: 25px !important;

}



.margin-25right {

  margin-right: 25px !important;

}



.padding-25right {

  padding-right: 25px !important;

}



.margin-30top {

  margin-top: 30px !important;

}



.padding-30top {

  padding-top: 30px !important;

}



.margin-30left {

  margin-left: 30px !important;

}



.padding-30left {

  padding-left: 30px !important;

}



.margin-30bottom {

  margin-bottom: 30px !important;

}



.padding-30bottom {

  padding-bottom: 30px !important;

}



.margin-30right {

  margin-right: 30px !important;

}



.padding-30right {

  padding-right: 30px !important;

}



.margin-35top {

  margin-top: 35px !important;

}



.padding-35top {

  padding-top: 35px !important;

}



.margin-35left {

  margin-left: 35px !important;

}



.padding-35left {

  padding-left: 35px !important;

}



.margin-35bottom {

  margin-bottom: 35px !important;

}



.padding-35bottom {

  padding-bottom: 35px !important;

}



.margin-35right {

  margin-right: 35px !important;

}



.padding-35right {

  padding-right: 35px !important;

}



.margin-40top {

  margin-top: 40px !important;

}



.padding-40top {

  padding-top: 40px !important;

}



.margin-40left {

  margin-left: 40px !important;

}



.padding-40left {

  padding-left: 40px !important;

}



.margin-40bottom {

  margin-bottom: 40px !important;

}



.padding-40bottom {

  padding-bottom: 40px !important;

}



.margin-40right {

  margin-right: 40px !important;

}



.padding-40right {

  padding-right: 40px !important;

}



.margin-45top {

  margin-top: 45px !important;

}



.padding-45top {

  padding-top: 45px !important;

}



.margin-45left {

  margin-left: 45px !important;

}



.padding-45left {

  padding-left: 45px !important;

}



.margin-45bottom {

  margin-bottom: 45px !important;

}



.padding-45bottom {

  padding-bottom: 45px !important;

}



.margin-45right {

  margin-right: 45px !important;

}



.padding-45right {

  padding-right: 45px !important;

}



.margin-50top {

  margin-top: 50px !important;

}



.padding-50top {

  padding-top: 50px !important;

}



.margin-50left {

  margin-left: 50px !important;

}



.padding-50left {

  padding-left: 50px !important;

}



.margin-50bottom {

  margin-bottom: 50px !important;

}



.padding-50bottom {

  padding-bottom: 50px !important;

}



.margin-50right {

  margin-right: 50px !important;

}



.padding-50right {

  padding-right: 50px !important;

}



/*

## .fontsize-



汎用の fontsize 設定用クラス



- `.fontsize-{px}` {size} にフォントのピクセル数を指定して設定する（ピクセル数は 8px 〜 30px まで偶数単位を指定可）

*/

.fontsize-8 {

  font-size: 8px !important;

}



.fontsize-10 {

  font-size: 10px !important;

}



.fontsize-12 {

  font-size: 12px !important;

}



.fontsize-14 {

  font-size: 14px !important;

}



.fontsize-16 {

  font-size: 16px !important;

}



.fontsize-18 {

  font-size: 18px !important;

}



.fontsize-20 {

  font-size: 20px !important;

}



.fontsize-22 {

  font-size: 22px !important;

}



.fontsize-24 {

  font-size: 24px !important;

}



.fontsize-26 {

  font-size: 26px !important;

}



.fontsize-28 {

  font-size: 28px !important;

}



.fontsize-30 {

  font-size: 30px !important;

}



/*

# Btn Class



ボタンのスタイルの抽象クラス



#### [Use]



- `Icon Class`



#### [Options]



- `.btn` 基本的なボタンのスタイル

- `.btn-convex` 基本的なボタンのスタイル（凸バージョン）

- `.btn-favorite-check` 「お気に入りを見る」ボタン

- `.btn-primary` 重要度の高い遷移に使用されるボタン

- `.btn-dropdown-view` ドロップダウンボタン

- `.btn-overflow-ellipsis` 文字数が多い場合に省略記号を用いて短縮する（どれかのオプションと併用）

- `.btn-inline` インラインで使用する際のオプション（どれかのオプションと併用）

*/

.btn, .btn-convex, .btn-favorite-check, .btn-primary, .btn-dropdown-view, .btn-dropdown-view-mini, .btn-heading, .btn-result-heading, .btn-favorite-register, .btn-estimate, .btn-pagergroup, .btn-map, .btn-call, .btn-spec-view, .btn-form-view, [class^="btn-mainvisual-pager-"], [class^="btn-nintei"], [class^="btn-special-feature"], [class^="btn-special-search"] {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  width: 100%;

  text-align: left;

  line-height: 1.5;

  display: block;

  width: 100%;

  height: 100%;

  text-decoration: none;

  color: black;

  /*border: 1px solid #b1b1b1;*/

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  -ms-border-radius: 4px;

  -o-border-radius: 4px;

  border-radius: 4px;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  -o-user-select: none;

  user-select: none;

  /*-webkit-box-shadow: inset white 0 1px 0, inset white 1px 0 0, inset white -1px 0 0;

  -moz-box-shadow: inset white 0 1px 0, inset white 1px 0 0, inset white -1px 0 0;

  -ms-box-shadow: inset white 0 1px 0, inset white 1px 0 0, inset white -1px 0 0;

  -o-box-shadow: inset white 0 1px 0, inset white 1px 0 0, inset white -1px 0 0;

  box-shadow: inset white 0 1px 0, inset white 1px 0 0, inset white -1px 0 0;*/

}

[type="button"].btn, [type="button"].btn-convex, [type="button"].btn-favorite-check, [type="button"].btn-primary, [type="button"].btn-dropdown-view, [type="button"].btn-dropdown-view-mini, [type="button"].btn-heading, [type="button"].btn-result-heading, [type="button"].btn-favorite-register, [type="button"].btn-estimate, [type="button"].btn-pagergroup, [type="button"].btn-map, [type="button"].btn-call, [type="button"].btn-spec-view, [type="button"].btn-form-view, [type="button"][class^="btn-mainvisual-pager-"], [type="button"][class^="btn-nintei"], [type="button"][class^="btn-special-feature"], [type="button"][class^="btn-special-search"], .btn [type="submit"], .btn-convex [type="submit"], .btn-favorite-check [type="submit"], .btn-primary [type="submit"], .btn-dropdown-view [type="submit"], .btn-dropdown-view-mini [type="submit"], .btn-heading [type="submit"], .btn-result-heading [type="submit"], .btn-favorite-register [type="submit"], .btn-estimate [type="submit"], .btn-pagergroup [type="submit"], .btn-map [type="submit"], .btn-call [type="submit"], .btn-spec-view [type="submit"], .btn-form-view [type="submit"], [class^="btn-mainvisual-pager-"] [type="submit"], [class^="btn-nintei"] [type="submit"], [class^="btn-special-feature"] [type="submit"], [class^="btn-special-search"] [type="submit"], .btn [type="reset"], .btn-convex [type="reset"], .btn-favorite-check [type="reset"], .btn-primary [type="reset"], .btn-dropdown-view [type="reset"], .btn-dropdown-view-mini [type="reset"], .btn-heading [type="reset"], .btn-result-heading [type="reset"], .btn-favorite-register [type="reset"], .btn-estimate [type="reset"], .btn-pagergroup [type="reset"], .btn-map [type="reset"], .btn-call [type="reset"], .btn-spec-view [type="reset"], .btn-form-view [type="reset"], [class^="btn-mainvisual-pager-"] [type="reset"], [class^="btn-nintei"] [type="reset"], [class^="btn-special-feature"] [type="reset"], [class^="btn-special-search"] [type="reset"] {

  -webkit-appearance: button;

  -moz-appearance: button;

  -ms-appearance: button;

  -o-appearance: button;

  appearance: button;

  -webkit-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -moz-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -ms-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -o-tap-highlight-color: rgba(0, 160, 218, 0.7);

  tap-highlight-color: rgba(0, 160, 218, 0.7);

}

[class*="icon-"].btn, [class*="icon-"].btn-convex, [class*="icon-"].btn-favorite-check, [class*="icon-"].btn-primary, [class*="icon-"].btn-dropdown-view, [class*="icon-"].btn-dropdown-view-mini, [class*="icon-"].btn-heading, [class*="icon-"].btn-result-heading, [class*="icon-"].btn-favorite-register, [class*="icon-"].btn-estimate, [class*="icon-"].btn-pagergroup, [class*="icon-"].btn-map, [class*="icon-"].btn-call, [class*="icon-"].btn-spec-view, [class*="icon-"].btn-form-view, [class*="icon-"][class^="btn-mainvisual-pager-"], [class*="icon-"][class^="btn-nintei"], [class*="icon-"][class^="btn-special-feature"], [class*="icon-"][class^="btn-special-search"] {

  position: relative;

}

[class*="icon-"].btn:before, [class*="icon-"].btn-convex:before, [class*="icon-"].btn-favorite-check:before, [class*="icon-"].btn-primary:before, [class*="icon-"].btn-dropdown-view:before, [class*="icon-"].btn-dropdown-view-mini:before, [class*="icon-"].btn-heading:before, [class*="icon-"].btn-result-heading:before, [class*="icon-"].btn-favorite-register:before, [class*="icon-"].btn-estimate:before, [class*="icon-"].btn-pagergroup:before, [class*="icon-"].btn-map:before, [class*="icon-"].btn-call:before, [class*="icon-"].btn-spec-view:before, [class*="icon-"].btn-form-view:before, [class*="icon-"][class^="btn-mainvisual-pager-"]:before, [class*="icon-"][class^="btn-nintei"]:before, [class*="icon-"][class^="btn-special-feature"]:before, [class*="icon-"][class^="btn-special-search"]:before {

  position: absolute;

  top: 50%;

  right: 5px;

  margin-top: -12px;

}
.form-view .form-view-group-action-narrow [class*="icon-return-bf-white"].btn {
  line-height: 2;
}
[class*="icon-return-bf-white"].btn:before {
  display: block !important;
  position: absolute;
  margin-top: -12px;
  top: 50%;
}

.btn-overflow-ellipsis.btn, .btn-overflow-ellipsis.btn-convex, .btn-overflow-ellipsis.btn-favorite-check, .btn-overflow-ellipsis.btn-primary, .btn-overflow-ellipsis.btn-dropdown-view, .btn-overflow-ellipsis.btn-dropdown-view-mini, .btn-overflow-ellipsis.btn-heading, .btn-overflow-ellipsis.btn-result-heading, .btn-overflow-ellipsis.btn-favorite-register, .btn-overflow-ellipsis.btn-estimate, .btn-overflow-ellipsis.btn-pagergroup, .btn-overflow-ellipsis.btn-map, .btn-overflow-ellipsis.btn-call, .btn-overflow-ellipsis.btn-spec-view, .btn-overflow-ellipsis.btn-form-view, .btn-overflow-ellipsis[class^="btn-mainvisual-pager-"], .btn-overflow-ellipsis[class^="btn-nintei"], .btn-overflow-ellipsis[class^="btn-special-feature"], .btn-overflow-ellipsis[class^="btn-special-search"] {

  overflow: hidden;

  white-space: nowrap;

  -webkit-text-overflow: ellipsis;

  -moz-text-overflow: ellipsis;

  -ms-text-overflow: ellipsis;

  -o-text-overflow: ellipsis;

  text-overflow: ellipsis;

}

.btn-inline.btn, .btn-inline.btn-convex, .btn-inline.btn-favorite-check, .btn-inline.btn-primary, .btn-inline.btn-dropdown-view, .btn-inline.btn-dropdown-view-mini, .btn-inline.btn-heading, .btn-inline.btn-result-heading, .btn-inline.btn-favorite-register, .btn-inline.btn-estimate, .btn-inline.btn-pagergroup, .btn-inline.btn-map, .btn-inline.btn-call, .btn-inline.btn-spec-view, .btn-inline.btn-form-view, .btn-inline[class^="btn-mainvisual-pager-"], .btn-inline[class^="btn-nintei"], .btn-inline[class^="btn-special-feature"], .btn-inline[class^="btn-special-search"] {

  display: inline-block;

}



/*

## .btn



基本的なボタンのスタイル



	<a href="#" class="btn">テキスト</a>

	<button class="btn">テキスト</button>

	<input type="button" class="btn" value="テキスト" />

	<a href="#" class="btn icon-btn-arrow-bf-blue">テキスト</a>

	<button class="btn icon-btn-arrow-bf-blue">テキスト</button>

	<input type="button" class="btn icon-btn-arrow-bf-blue" value="テキスト" />

*/

.btn {

  padding: 12px 12px 10px 12px;

  /*background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e5e5e5),color-stop(100%, #ffffff));

  background-image: -webkit-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -moz-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -ms-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -o-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: linear-gradient(to bottom, #e5e5e5 0%,#ffffff 100%);*/
  background: #000;
  color: #fff;

}

.form-view-item .form__grid__cell .btn {
  background: #fff;
  color: #000;
}


/*

## .btn-convex



基本的なボタンのスタイル（凸バージョン）



	<a href="#" class="btn-convex">テキスト</a>

	<button class="btn-convex">テキスト</button>

	<input type="button" class="btn-convex" value="テキスト" />

	<a href="#" class="btn-convex icon-btn-arrow-bf-blue">テキスト</a>

	<button class="btn-convex icon-btn-arrow-bf-blue">テキスト</button>

	<input type="button" class="btn-convex icon-btn-arrow-bf-blue" value="テキスト" />

*/

.btn-convex {

  padding: 12px 12px 10px 12px;

  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #e5e5e5),color-stop(100%, #ffffff));

  background-image: -webkit-linear-gradient(bottom, #e5e5e5 0%,#ffffff 100%);

  background-image: -moz-linear-gradient(bottom, #e5e5e5 0%,#ffffff 100%);

  background-image: -ms-linear-gradient(bottom, #e5e5e5 0%,#ffffff 100%);

  background-image: -o-linear-gradient(bottom, #e5e5e5 0%,#ffffff 100%);

  background-image: linear-gradient(to top, #e5e5e5 0%,#ffffff 100%);

  -webkit-box-shadow: inset white 0 -1px 0, inset white 1px 0 0, inset white -1px 0 0;

  -moz-box-shadow: inset white 0 -1px 0, inset white 1px 0 0, inset white -1px 0 0;

  -ms-box-shadow: inset white 0 -1px 0, inset white 1px 0 0, inset white -1px 0 0;

  -o-box-shadow: inset white 0 -1px 0, inset white 1px 0 0, inset white -1px 0 0;

  box-shadow: inset white 0 -1px 0, inset white 1px 0 0, inset white -1px 0 0;

}



/*

## .btn-favorite-check



「お気に入りを見る」ボタン



	<a href="#" class="btn-favorite-check icon-star-bf-white">お気に入り</a>

*/

.btn-favorite-check {

  width: 60px;
  height: 50px;
  padding-top: 30px;
  letter-spacing: -0.13em;
  text-align: center;
  color: #b4b4b4;
  font-size: 8px;
  font-weight: bold;
  background-color: #494949;
  border: none;
  box-shadow: none;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  -o-border-radius: 3px;
  -ms-border-radius: 3px;

}

.btn-favorite-check[class*="icon-"]:before {

  position: absolute;

  top: 19px;

  left: 50%;

  margin-left: -12px;

}



/*

## .btn-primary



重要度の高い遷移に使用されるボタン

光の表現は `:after` 擬似要素で生成しているため空要素である `<input>` では使用できない。



#### [Options]



- `.btn-primary-search` トップページの検索ボタン

- `.btn-primary-no-glow` グロー処理なしのプライマリボタン（グラデーションの方向も逆）





	<a href="#" class="btn-primary">テキスト</a>

	<button class="btn-primary">テキスト</button>

	<input type="button" class="btn-primary" value="テキスト" />



	<a href="#" class="btn-primary btn-primary-search">検索</a>

	<button class="btn-primary btn-primary-search">検索</button>

	<input type="button" class="btn-primary btn-primary-search" value="検索" />



*/

.btn-primary {

  overflow: hidden;

  position: relative;

  padding: 12px 12px 10px 12px;

  color: white;

  border: 0;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #008BD1),color-stop(30%, #008BD1),color-stop(80%, #00B6E5),color-stop(100%, #00B6E5));

  background-image: -webkit-linear-gradient(top, #008BD1 0%,#008BD1 30%,#00B6E5 80%,#00B6E5 100%);

  background-image: -moz-linear-gradient(top, #008BD1 0%,#008BD1 30%,#00B6E5 80%,#00B6E5 100%);

  background-image: -ms-linear-gradient(top, #008BD1 0%,#008BD1 30%,#00B6E5 80%,#00B6E5 100%);

  background-image: -o-linear-gradient(top, #008BD1 0%,#008BD1 30%,#00B6E5 80%,#00B6E5 100%);

  background-image: linear-gradient(to bottom, #008BD1 0%,#008BD1 30%,#00B6E5 80%,#00B6E5 100%);

  -webkit-box-shadow: inset rgba(255, 255, 255, 0.2) 0 0 5px;

  -moz-box-shadow: inset rgba(255, 255, 255, 0.2) 0 0 5px;

  -ms-box-shadow: inset rgba(255, 255, 255, 0.2) 0 0 5px;

  -o-box-shadow: inset rgba(255, 255, 255, 0.2) 0 0 5px;

  box-shadow: inset rgba(255, 255, 255, 0.2) 0 0 5px;

}

.btn-primary:after {

  content: "";

  position: absolute;

  top: -45px;

  left: 50%;

  display: block;

  width: 100px;

  height: 100px;

  margin-left: -50px;

  background-image: -webkit-gradient(radial, 50% 50%, 0, 50% 50%, 30, color-stop(0px, rgba(255, 255, 255, 0.7)), color-stop(30px, rgba(255, 255, 255, 0)));

  background-image: -webkit-radial-gradient(50% 50%, rgba(255, 255, 255, 0.7) 0px, rgba(255, 255, 255, 0) 30px);

  background-image: -moz-radial-gradient(50% 50%, rgba(255, 255, 255, 0.7) 0px, rgba(255, 255, 255, 0) 30px);

  background-image: -ms-radial-gradient(50% 50%, rgba(255, 255, 255, 0.7) 0px, rgba(255, 255, 255, 0) 30px);

  background-image: -o-radial-gradient(50% 50%, rgba(255, 255, 255, 0.7) 0px, rgba(255, 255, 255, 0) 30px);

  background-image: radial-gradient(50% 50%, rgba(255, 255, 255, 0.7) 0px, rgba(255, 255, 255, 0) 30px);

}

.btn-primary.btn-primary-search {

  width: 58px;

  height: 30px;

  padding: 0;

  line-height: 30px;

  letter-spacing: 0.2em;

  text-align: center;

  text-indent: 0.1em;

}

.btn-primary.btn-primary-no-glow {

  /*text-shadow: rgba(0, 0, 0, 0.2) 1px 1px 0;

  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #008BD1),color-stop(100%, #00B6E5));

  background-image: -webkit-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: -moz-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: -ms-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: -o-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: linear-gradient(to top, #008BD1 0%,#00B6E5 100%);*/
  background: #000;
  color: #fff;

}

.btn-primary.btn-primary-no-glow:after {

  display: none;

}

.btn-primary.btn-primary-no-glow[class*="icon-"] {

  position: relative;

}

.btn-primary.btn-primary-no-glow[class*="icon-"]:after, .btn-primary.btn-primary-no-glow[class*="icon-"]:before {

  display: block !important;

  position: absolute;

}

.btn-primary.btn-primary-no-glow[class*="icon-"]:before {

  z-index: 5;

  left: 4px;

  top: 50%;

  margin-top: -13px;

}

.btn-primary.btn-primary-no-glow[class*="icon-"]:after {

  opacity: 0.2;

  z-index: 1;

  left: 5px;

  top: 50%;

  width: 24px;

  height: 24px;

  margin-top: -12px;

  margin-left: 0;

}



/*

## .btn-dropdown-view



ドロップダウンボタン



#### [Use]



- `.icon-btn-arrow-bf-{colorscheme}`

- `.icon-plus-circle-af-{colorscheme}`

- `.icon-minus-circle-af-{colorscheme}`



#### [Option]



- `.btn-dropdown-view-opened` 開いた状態のオプションスタイル





	<a href="#" class="btn-dropdown-view icon-btn-arrow-bf-blue icon-plus-circle-af-grey">テキスト</a>

	<a href="#" class="btn-dropdown-view btn-dropdown-view-opened icon-btn-arrow-bf-blue icon-minus-circle-af-grey">テキスト</a>

*/

.btn-dropdown-view {

  padding: 15px 30px 15px 32px;

  line-height: 1.2;

  color: #b1b1b1;

  border: 0;

  border-top: 1px solid black;

  border-bottom: 1px solid #787878;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  -ms-box-shadow: none;

  -o-box-shadow: none;

  box-shadow: none;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #787878),color-stop(1%, #787878),color-stop(2%, #3B3B3B),color-stop(10%, #3B3B3B),color-stop(100%, #000000));

  background-image: -webkit-linear-gradient(top, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: -moz-linear-gradient(top, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: -ms-linear-gradient(top, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: -o-linear-gradient(top, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: linear-gradient(to bottom, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  -webkit-border-radius: 0;

  -moz-border-radius: 0;

  -ms-border-radius: 0;

  -o-border-radius: 0;

  border-radius: 0;

}

.btn-dropdown-view[class*="icon-"]:before {

  position: absolute;

  top: 50%;

  right: 5px;

  margin-top: -12px;

  -webkit-transform: rotate(-90deg);

  -moz-transform: rotate(-90deg);

  -ms-transform: rotate(-90deg);

  -o-transform: rotate(-90deg);

  transform: rotate(-90deg);

}

.btn-dropdown-view[class*="icon-"]:after {

  position: absolute;

  top: 50%;

  left: 5px;

  margin-top: -12px;

  -webkit-transform: scale(0.7, 0.7);

  -moz-transform: scale(0.7, 0.7);

  -ms-transform: scale(0.7, 0.7);

  -o-transform: scale(0.7, 0.7);

  transform: scale(0.7, 0.7);

}

.btn-dropdown-view.btn-dropdown-view-opened {

  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #3B3B3B),color-stop(10%, #3B3B3B),color-stop(98%, #000000),color-stop(99%, #787878),color-stop(100%, #787878));

  background-image: -webkit-linear-gradient(bottom, #3B3B3B 0%,#3B3B3B 10%,#000000 98%,#787878 99%,#787878 100%);

  background-image: -moz-linear-gradient(bottom, #3B3B3B 0%,#3B3B3B 10%,#000000 98%,#787878 99%,#787878 100%);

  background-image: -ms-linear-gradient(bottom, #3B3B3B 0%,#3B3B3B 10%,#000000 98%,#787878 99%,#787878 100%);

  background-image: -o-linear-gradient(bottom, #3B3B3B 0%,#3B3B3B 10%,#000000 98%,#787878 99%,#787878 100%);

  background-image: linear-gradient(to top, #3B3B3B 0%,#3B3B3B 10%,#000000 98%,#787878 99%,#787878 100%);

}

.btn-dropdown-view.btn-dropdown-view-opened[class*="icon-"]:before {

  -webkit-transform: rotate(90deg);

  -moz-transform: rotate(90deg);

  -ms-transform: rotate(90deg);

  -o-transform: rotate(90deg);

  transform: rotate(90deg);

}



/*

## .btn-dropdown-view-mini



ドロップダウンボタン（`.dropdown-view-mini` に対応）



#### [Use]



- `.icon-plus-circle-af-{colorscheme}`

- `.icon-minus-circle-af-{colorscheme}`



#### [Option]



- `.btn-dropdown-view-mini-opened` 開いた状態のオプションスタイル





	<a class="btn-dropdown-view-mini icon-minus-circle-af-blue" href="javascript:void(0);">テキスト</a>

	<a class="btn-dropdown-view-mini icon-plus-circle-af-blue" href="javascript:void(0);">テキスト</a>

*/

.btn-dropdown-view-mini {

  padding: 7px 10px 7px 32px;

  line-height: 1.2;

  color: white;

  background: #008bd1;

  border: 0;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  -ms-box-shadow: none;

  -o-box-shadow: none;

  box-shadow: none;

  -webkit-border-radius: 0;

  -moz-border-radius: 0;

  -ms-border-radius: 0;

  -o-border-radius: 0;

  border-radius: 0;

}

.btn-dropdown-view-mini[class*="icon-"]:after {

  position: absolute;

  top: 50%;

  left: 5px;

  margin-top: -12px;

  -webkit-transform: scale(0.7, 0.7);

  -moz-transform: scale(0.7, 0.7);

  -ms-transform: scale(0.7, 0.7);

  -o-transform: scale(0.7, 0.7);

  transform: scale(0.7, 0.7);

}



/*

## .btn-heading



`heading` 内での使用されるボタン。文字要素は表示させずアイコンを表示させる。



#### [Use]



- `.icon-btn-arrow-bf-{colorscheme}`

- `.icon-btn-arrow-af-{colorscheme}`



#### [Require]



- Icon Class



`.icon-{type}-bf-{colorscheme}` でメインのカラー、`.icon-{type}-af-{colorscheme}` でドロップシャドウとなるカラーをしていする



#### [Option]



- `.btn-heading-left` 左配置ボタンのオプションスタイル

- `.btn-heading-right` 右配置ボタンのオプションスタイル





	<header class="heading-blue">

		<a class="btn-heading btn-heading-left icon-btn-arrow-bf-white icon-btn-arrow-af-black" href="#">戻る</a>

		<a class="btn-heading btn-heading-right icon-btn-arrow-bf-white icon-btn-arrow-af-black" href="#">進む</a>

	</header>



	<header class="heading-darkblue">

		<a class="btn-heading btn-heading-left icon-btn-arrow-bf-white icon-btn-arrow-af-black" href="#">戻る</a>

		<a class="btn-heading btn-heading-right icon-btn-arrow-bf-white icon-btn-arrow-af-black" href="#">進む</a>

	</header>

*/

.btn-heading {

  display: block;

  position: absolute !important;

  top: 0;

  width: 30px;

  height: 100%;

  padding: 0;

  line-height: 100%;

  vertical-align: middle;

  text-align: right;

  line-height: 1.2;

  letter-spacing: 0;

  color: transparent;

  background-image: none;

  font-size: 12px;

  border-top: 0;

  border-bottom: 0;

  border-color: rgba(255, 255, 255, 0.3);

  -webkit-border-radius: 0;

  -moz-border-radius: 0;

  -ms-border-radius: 0;

  -o-border-radius: 0;

  border-radius: 0;

}

.btn-heading.btn-heading-left {

  left: 0;

  border-left: 0;

  -webkit-box-shadow: inset rgba(0, 0, 0, 0.1) -1px 0 0;

  -moz-box-shadow: inset rgba(0, 0, 0, 0.1) -1px 0 0;

  -ms-box-shadow: inset rgba(0, 0, 0, 0.1) -1px 0 0;

  -o-box-shadow: inset rgba(0, 0, 0, 0.1) -1px 0 0;

  box-shadow: inset rgba(0, 0, 0, 0.1) -1px 0 0;

}

.btn-heading.btn-heading-left[class*="-arrow-"]:before, .btn-heading.btn-heading-left[class*="-arrow-"]:after {

  -webkit-transform: rotate(180deg);

  -moz-transform: rotate(180deg);

  -ms-transform: rotate(180deg);

  -o-transform: rotate(180deg);

  transform: rotate(180deg);

}

.btn-heading.btn-heading-left:before {

  margin-left: -12px;

}

.btn-heading.btn-heading-left:after {

  margin-left: -11px;

}

.btn-heading.btn-heading-right {

  right: 0;

  border-right: 0;

  -webkit-box-shadow: rgba(0, 0, 0, 0.1) -1px 0 0;

  -moz-box-shadow: rgba(0, 0, 0, 0.1) -1px 0 0;

  -ms-box-shadow: rgba(0, 0, 0, 0.1) -1px 0 0;

  -o-box-shadow: rgba(0, 0, 0, 0.1) -1px 0 0;

  box-shadow: rgba(0, 0, 0, 0.1) -1px 0 0;

}

.btn-heading.btn-heading-right:before {

  margin-left: -11px;

}

.btn-heading.btn-heading-right:after {

  margin-left: -10px;

}

.btn-heading[class*="icon-"]:before, .btn-heading[class*="icon-"]:after {

  position: absolute;

  top: 50%;

  left: 50%;

}

.btn-heading[class*="icon-"]:before {

  z-index: 5;

  margin-top: -12px;

}

.btn-heading[class*="icon-"]:after {

  z-index: 4;

  margin-top: -11px;

  opacity: 0.2;

}



/*

## .btn-result-heading



`result-heading` 内での使用されるボタン。



#### [Use]



- Icon Class



### [Option]



- `.btn-result-heading-pressed` 押された状態のスタイル





	<header class="result-heading">

		<p class="result-heading-label"><b>1234件</b>がヒット</p>

		<a class="btn-result-heading icon-btn-arrow-bf-blue" href="#">絞り込み</a>

		<a class="btn-result-heading btn-result-heading-pressed icon-btn-arrow-bf-blue" href="#">並び替え</a>

	</header>



*/

.btn-result-heading {

  width: 80px;

  height: auto;

  padding: 10px 0 0;

  text-align: center;

  line-height: 1.2;

  letter-spacing: 0;

  color: white;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3B3B3B),color-stop(10%, #3B3B3B),color-stop(100%, #000000));

  background-image: -webkit-linear-gradient(top, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: -moz-linear-gradient(top, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: -ms-linear-gradient(top, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: -o-linear-gradient(top, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: linear-gradient(to bottom, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  border-top: 0;

  border-bottom: 0;

  border-right: 0;

  border-color: black;

  -webkit-box-shadow: inset #444444 1px 0 0;

  -moz-box-shadow: inset #444444 1px 0 0;

  -ms-box-shadow: inset #444444 1px 0 0;

  -o-box-shadow: inset #444444 1px 0 0;

  box-shadow: inset #444444 1px 0 0;

  -webkit-border-radius: 0;

  -moz-border-radius: 0;

  -ms-border-radius: 0;

  -o-border-radius: 0;

  border-radius: 0;

}

.btn-result-heading.btn-result-heading-pressed {

  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #3B3B3B),color-stop(10%, #3B3B3B),color-stop(100%, #000000));

  background-image: -webkit-linear-gradient(bottom, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: -moz-linear-gradient(bottom, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: -ms-linear-gradient(bottom, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: -o-linear-gradient(bottom, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: linear-gradient(to top, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

}

.btn-result-heading[class*="icon-"]:after, .btn-result-heading[class*="icon-"]:before {

  left: 50%;

  top: 0;

  margin-top: 24px;

  margin-left: -12px;

  -webkit-transform: rotate(90deg);

  -moz-transform: rotate(90deg);

  -ms-transform: rotate(90deg);

  -o-transform: rotate(90deg);

  transform: rotate(90deg);

}



/*

## .btn-favorite-register



お気に入りリスト登録ボタンのスタイル



#### [Use]



- Icon Class





	<a class="btn-favorite-register icon-star-bf-white icon-star-af-black" href="#">お気に入りリストに登録</a>



*/

.btn-favorite-register {

  padding: 10px 10px 10px 30px;

  text-shadow: rgba(0, 0, 0, 0.2) 1px 1px 0;

  letter-spacing: 0;

  color: white;

  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #008BD1),color-stop(100%, #00B6E5));

  background-image: -webkit-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: -moz-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: -ms-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: -o-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: linear-gradient(to top, #008BD1 0%,#00B6E5 100%);

  border: 0;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  -ms-box-shadow: none;

  -o-box-shadow: none;

  box-shadow: none;

}

.btn-favorite-register[class*="icon-"] {

  position: relative;

}

.btn-favorite-register[class*="icon-"]:after, .btn-favorite-register[class*="icon-"]:before {

  position: absolute;

}

.btn-favorite-register[class*="icon-"]:before {

  z-index: 5;

  left: 6px;

  top: 50%;

  margin-top: -13px;

}

.btn-favorite-register[class*="icon-"]:after {

  opacity: 0.2;

  z-index: 1;

  left: 7px;

  top: 50%;

  margin-top: -12px;

}



@media only screen and (max-device-width: 320px) and (orientation: portrait) {

  .btn-favorite-register {

    text-align: left;

  }

}

@media only screen and (max-device-width: 480px) and (orientation: landscape) {

  .btn-favorite-register {

    text-align: center;

    padding-left: 10px;

  }

}

/*

## .btn-estimate



お問合せ・お見積りボタンのスタイル



#### [Option]



- `.btn-estimate-action` `.action-navi` 内で使用するスタイル



#### [Use]



- Icon Class





	<a class="btn-estimate icon-calculator-bf-white icon-calculator-af-black" href="#">お問合せ・お見積り</a>

	<a class="btn-estimate btn-estimate-action icon-calculator-bf-white icon-calculator-af-black" href="#">お問合せ・お見積り</a>



*/

.btn-estimate {

  padding: 10px;

  text-shadow: rgba(0, 0, 0, 0.2) 1px 1px 0;

  color: white;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFAC00),color-stop(50%, #FFAC00),color-stop(51%, #FF7F00),color-stop(100%, #FFC547));

  background-image: -webkit-linear-gradient(top, #FFAC00 0%,#FFAC00 50%,#FF7F00 51%,#FFC547 100%);

  background-image: -moz-linear-gradient(top, #FFAC00 0%,#FFAC00 50%,#FF7F00 51%,#FFC547 100%);

  background-image: -ms-linear-gradient(top, #FFAC00 0%,#FFAC00 50%,#FF7F00 51%,#FFC547 100%);

  background-image: -o-linear-gradient(top, #FFAC00 0%,#FFAC00 50%,#FF7F00 51%,#FFC547 100%);

  background-image: linear-gradient(to bottom, #FFAC00 0%,#FFAC00 50%,#FF7F00 51%,#FFC547 100%);

  border: 0;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  -ms-box-shadow: none;

  -o-box-shadow: none;

  box-shadow: none;

}

.btn-estimate[class*="icon-"] {

  position: relative;

  padding-left: 30px;

  letter-spacing: 0;

}

.btn-estimate[class*="icon-"]:after, .btn-estimate[class*="icon-"]:before {

  position: absolute;

}

.btn-estimate[class*="icon-"]:before {

  z-index: 5;

  left: 6px;

  top: 50%;

  margin-top: -13px;

}

.btn-estimate[class*="icon-"]:after {

  opacity: 0.2;

  z-index: 1;

  left: 7px;

  top: 50%;

  margin-top: -12px;

}

.btn-estimate.btn-estimate-action {

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFAC00),color-stop(100%, #FF7F00));

  background-image: -webkit-linear-gradient(top, #FFAC00 0%,#FF7F00 100%);

  background-image: -moz-linear-gradient(top, #FFAC00 0%,#FF7F00 100%);

  background-image: -ms-linear-gradient(top, #FFAC00 0%,#FF7F00 100%);

  background-image: -o-linear-gradient(top, #FFAC00 0%,#FF7F00 100%);

  background-image: linear-gradient(to bottom, #FFAC00 0%,#FF7F00 100%);

}



@media only screen and (max-device-width: 320px) and (orientation: portrait) {

  .btn-estimate {

    text-align: left;

  }

}

@media only screen and (max-device-width: 480px) and (orientation: landscape) {

  .btn-estimate {

    text-align: center;

    padding-left: 10px;

  }

}

/*

## .btn-pagergroup



`.pagergroup` 内部で使用されるボタン



#### [Use]



- Icon Class



### [Option]



- `btn-pagergroup-back` 戻るボタン表示のオプション





	<a class="btn-pagergroup btn-pagergroup-back" href="#">最初</a>

	<a class="btn-pagergroup btn-pagergroup-back icon-btn-arrow-bf-blue" href="#">前へ</a>

	<a class="btn-pagergroup icon-btn-arrow-bf-blue" href="#">次へ</a>

	<a class="btn-pagergroup" href="#">最後</a>



*/

.btn-pagergroup {

  padding: 10px 5px 8px 5px;

  text-align: center;

  color: #008bd1;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e5e5e5),color-stop(100%, #ffffff));

  background-image: -webkit-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -moz-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -ms-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -o-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: linear-gradient(to bottom, #e5e5e5 0%,#ffffff 100%);

}

.btn-pagergroup[class*="icon-"] {

  position: relative;

  color: transparent;

}

.btn-pagergroup[class*="icon-"]:before {

  left: 50%;

  margin-left: -12px;

}

.btn-pagergroup.btn-pagergroup-back:before {

  -webkit-transform: rotate(180deg);

  -moz-transform: rotate(180deg);

  -ms-transform: rotate(180deg);

  -o-transform: rotate(180deg);

  transform: rotate(180deg);

}



/*

## .btn-map



「MAP」ボタン





	<a class="btn-map" href="#">MAP</a>



*/

.btn-map {

  display: inline-block;

  width: auto;

  width: 80px;

  padding: 5px;

  text-align: center;

  text-shadow: rgba(0, 0, 0, 0.2) 1px 1px 0;

  letter-spacing: 0;

  color: white;

  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #008BD1),color-stop(100%, #00B6E5));

  background-image: -webkit-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: -moz-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: -ms-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: -o-linear-gradient(bottom, #008BD1 0%,#00B6E5 100%);

  background-image: linear-gradient(to top, #008BD1 0%,#00B6E5 100%);

  font-size: 14px;

  border: 0;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  -ms-box-shadow: none;

  -o-box-shadow: none;

  box-shadow: none;

}



/*

## .btn-call



「電話する」ボタン



#### [Oprion]



- `.btn-call-action` `.action-navi` 内で使用されるスタイル





	<a class="btn-call" href="tel:xxx-xxxx-xxxx">電話する</a>

	<a class="btn-call btn-call-action icon-phone-bf-white icon-phone-af-black" href="tel:xxx-xxxx-xxxx">電話する</a>



*/

.btn-call {

  display: inline-block;
  width: auto;
  width: 80px;
  padding: 5px;
  text-align: center;
  letter-spacing: 0;
  color: white;
  background-color: #000;
  font-size: 14px;
  border-radius: 4px;

}

.btn-call[class*="icon-"] {

  position: relative;

}

.btn-call[class*="icon-"]:after, .btn-call[class*="icon-"]:before {

  position: absolute;

}

.btn-call[class*="icon-"]:before {

  z-index: 5;

  left: 10px;

  top: 50%;

  margin-top: -12px;

}

.btn-call[class*="icon-"]:after {

  opacity: 0.2;

  z-index: 1;

  left: 11px;

  top: 50%;

  margin-top: -11px;

}

.btn-call.btn-call-action {

  padding: 10px;

}



/*

## .btn-spec-view



SpecView 用の見出しボタン



#### [Use]



- `.icon-btn-arrow-bf-{colorscheme}`

- `.icon-plus-circle-af-{colorscheme}`

- `.icon-minus-circle-af-{colorscheme}`



#### [Option]



- `.btn-spec-view-opened` 開いた状態のオプションスタイル





#### [state:default]



	<header class="spec-view-header">

		<h1 class="spec-view-label-control"><a class="btn-spec-view icon-btn-arrow-bf-blue icon-plus-circle-af-blue" href="#">テキスト</a></h1>

	</header>





#### [state:opened]



	<header class="spec-view-header">

		<h1 class="spec-view-label-control"><a class="btn-spec-view btn-spec-view-opened icon-btn-arrow-bf-blue icon-minus-circle-af-blue" href="#">テキスト</a></h1>

	</header>



*/

.btn-spec-view {

  padding: 10px 10px 8px 30px;

  border: 0;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  -ms-box-shadow: none;

  -o-box-shadow: none;

  box-shadow: none;

  color: #3f3f3f;

  background: transparent;

  -webkit-border-radius: 0;

  -moz-border-radius: 0;

  -ms-border-radius: 0;

  -o-border-radius: 0;

  border-radius: 0;

}

.btn-spec-view[class*="icon-"]:before {

  position: absolute;

  top: 50%;

  right: 5px;

  margin-top: -12px;

  -webkit-transform: rotate(-90deg);

  -moz-transform: rotate(-90deg);

  -ms-transform: rotate(-90deg);

  -o-transform: rotate(-90deg);

  transform: rotate(-90deg);

}

.btn-spec-view[class*="icon-"]:after {

  position: absolute;

  top: 50%;

  left: 5px;

  margin-top: -12px;

  -webkit-transform: scale(0.7, 0.7);

  -moz-transform: scale(0.7, 0.7);

  -ms-transform: scale(0.7, 0.7);

  -o-transform: scale(0.7, 0.7);

  transform: scale(0.7, 0.7);

}

.btn-spec-view.btn-spec-view-opened[class*="icon-"]:before {

  -webkit-transform: rotate(90deg);

  -moz-transform: rotate(90deg);

  -ms-transform: rotate(90deg);

  -o-transform: rotate(90deg);

  transform: rotate(90deg);

}



/*

## .btn-form-view



FormView 用の見出しボタン



#### [Use]



- `.icon-btn-arrow-bf-{colorscheme}`

- `.icon-plus-circle-af-{colorscheme}`

- `.icon-minus-circle-af-{colorscheme}`





#### [state:default]



	<header class="form-view-header">

		<h1 class="form-view-label-control"><a class="btn-form-view icon-plus-circle-af-blue" href="#">テキスト</a></h1>

	</header>



#### [state:opened]



	<header class="form-view-header">

		<h1 class="form-view-label-control"><a class="btn-form-view icon-minus-circle-af-blue" href="#">テキスト</a></h1>

	</header>



*/

.btn-form-view {

  padding: 10px 10px 8px 30px;

  border: 0;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  -ms-box-shadow: none;

  -o-box-shadow: none;

  box-shadow: none;

  color: #3f3f3f;

  background: transparent;

  -webkit-border-radius: 0;

  -moz-border-radius: 0;

  -ms-border-radius: 0;

  -o-border-radius: 0;

  border-radius: 0;

}

.btn-form-view[class*="icon-"]:before {

  position: absolute;

  top: 50%;

  right: 5px;

  margin-top: -12px;

  -webkit-transform: rotate(-90deg);

  -moz-transform: rotate(-90deg);

  -ms-transform: rotate(-90deg);

  -o-transform: rotate(-90deg);

  transform: rotate(-90deg);

}

.btn-form-view[class*="icon-"]:after {

  position: absolute;

  top: 50%;

  left: 5px;

  margin-top: -12px;

  -webkit-transform: scale(0.7, 0.7);

  -moz-transform: scale(0.7, 0.7);

  -ms-transform: scale(0.7, 0.7);

  -o-transform: scale(0.7, 0.7);

  transform: scale(0.7, 0.7);

}

.btn-form-view.btn-form-view-opened[class*="icon-"]:before {

  -webkit-transform: rotate(90deg);

  -moz-transform: rotate(90deg);

  -ms-transform: rotate(90deg);

  -o-transform: rotate(90deg);

  transform: rotate(90deg);

}

.btn-form-view.btn-form-view-minimal {

  padding-top: 0;

  padding-bottom: 0;

  padding-right: 0;

  color: #000;

}



/*

## .btn-mainvisual-pager-{direction}



Mainvisual 用のページ切り替えボタン



#### [Use]



- `.icon-btn-arrow-bf-{colorscheme}`



#### [Option]



- `.btn-mainvisual-pager-prev` 前のページボタンの位置のスタイル

- `.btn-mainvisual-pager-next` 次のページボタンの位置のスタイル





	<a class="btn-mainvisual-pager-prev icon-btn-arrow-bf-white" href="#">前へ</a>

	<a class="btn-mainvisual-pager-next icon-btn-arrow-bf-white" href="#">次へ</a>

*/

[class^="btn-mainvisual-pager-"] {

  width: auto;

  height: auto;

  padding: 10px 5px 8px 5px;

  text-align: center;

  color: white;

  background: rgba(63, 63, 63, 0.8);

  border: 0;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  -ms-box-shadow: none;

  -o-box-shadow: none;

  box-shadow: none;

}

[class^="btn-mainvisual-pager-"][class*="icon-"] {

  position: relative;

  color: transparent;

}

[class^="btn-mainvisual-pager-"][class*="icon-"]:before {

  left: 50%;

  margin-left: -12px;

}

[class^="btn-mainvisual-pager-"][class*="-pager-prev"] {

  left: 10px;

}

[class^="btn-mainvisual-pager-"][class*="-pager-prev"]:before {

  -webkit-transform: rotate(180deg);

  -moz-transform: rotate(180deg);

  -ms-transform: rotate(180deg);

  -o-transform: rotate(180deg);

  transform: rotate(180deg);

}

[class^="btn-mainvisual-pager-"][class*="-pager-next"] {

  right: 10px;

}



/*

## .btn-nintei



「マツダ認定 U-car を検索する」ボタン



	<a class="btn-nintei" href="#">マツダ認定U-carを検索する</a>

*/

[class^="btn-nintei"] {

  position: relative;

  width: auto;

  height: auto;

  padding: 12px 10px 12px 35px;

  text-align: center;

  color: white;

  letter-spacing: 0.04em;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3c4c94),color-stop(50%, #2e3987),color-stop(51%, #0b0e67),color-stop(100%, #131868));

  background-image: -webkit-linear-gradient(top, #3c4c94 0%,#2e3987 50%,#0b0e67 51%,#131868 100%);

  background-image: -moz-linear-gradient(top, #3c4c94 0%,#2e3987 50%,#0b0e67 51%,#131868 100%);

  background-image: -ms-linear-gradient(top, #3c4c94 0%,#2e3987 50%,#0b0e67 51%,#131868 100%);

  background-image: -o-linear-gradient(top, #3c4c94 0%,#2e3987 50%,#0b0e67 51%,#131868 100%);

  background-image: linear-gradient(to bottom, #3c4c94 0%,#2e3987 50%,#0b0e67 51%,#131868 100%);

  border: 1px solid black;

  font-weight: bold;

  font-size: 16px;

  -webkit-box-shadow: inset rgba(255, 255, 255, 0.3) 0 1px 0, inset rgba(255, 255, 255, 0.3) 0 -1px 0;

  -moz-box-shadow: inset rgba(255, 255, 255, 0.3) 0 1px 0, inset rgba(255, 255, 255, 0.3) 0 -1px 0;

  -ms-box-shadow: inset rgba(255, 255, 255, 0.3) 0 1px 0, inset rgba(255, 255, 255, 0.3) 0 -1px 0;

  -o-box-shadow: inset rgba(255, 255, 255, 0.3) 0 1px 0, inset rgba(255, 255, 255, 0.3) 0 -1px 0;

  box-shadow: inset rgba(255, 255, 255, 0.3) 0 1px 0, inset rgba(255, 255, 255, 0.3) 0 -1px 0;

}

[class^="btn-nintei"]:after {

  content: "";

  display: inline-block;

  position: absolute;

  top: 50%;

  left: 15px;

  width: 33px;

  height: 32px;

  margin-top: -17px;

  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEIAAAA+CAYAAACftM1SAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpGQzdGMTE3NDA3MjA2ODExODA4MzlFRTA5NUY2MUZEMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4QzA1NERBMkE2NTgxMUUyQjI4RENCQzg5RUJGNUU2QiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4QzA1NERBMUE2NTgxMUUyQjI4RENCQzg5RUJGNUU2QiIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NzEzQjhDQTYxMTIwNjgxMTgyMkFEODczRDk4RkFEN0IiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RkM3RjExNzQwNzIwNjgxMTgwODM5RUUwOTVGNjFGRDEiLz4gPC9yZGY6RGVzY3Jp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) 0 0 no-repeat;

  -webkit-background-size: 33px 32px;

  -moz-background-size: 33px 32px;

  -ms-background-size: 33px 32px;

  -o-background-size: 33px 32px;

  background-size: 33px 32px;

}



@media only screen and (max-device-width: 480px) and (orientation: landscape) {

  [class^="btn-nintei"] {

    padding-left: 10px;

  }

}

/*

## .btn-special-feature



特集ページの特徴の項目へリンクするアンカーボタン



	<a class="btn-special-feature" href="#">{{ 車種名 }}の特徴</a>

*/

[class^="btn-special-feature"] {

  counter-increment: special-main-view-features;

  position: relative;

  width: auto;

  height: auto;

  padding: 12px 10px 12px 50px;

  text-align: left;

  color: white;

  letter-spacing: 0.04em;

  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #00CFE5),color-stop(35%, #007CD1),color-stop(67%, #005BA6),color-stop(100%, #007CD1));

  background-image: -webkit-linear-gradient(bottom, #00CFE5 0%,#007CD1 35%,#005BA6 67%,#007CD1 100%);

  background-image: -moz-linear-gradient(bottom, #00CFE5 0%,#007CD1 35%,#005BA6 67%,#007CD1 100%);

  background-image: -ms-linear-gradient(bottom, #00CFE5 0%,#007CD1 35%,#005BA6 67%,#007CD1 100%);

  background-image: -o-linear-gradient(bottom, #00CFE5 0%,#007CD1 35%,#005BA6 67%,#007CD1 100%);

  background-image: linear-gradient(to top, #00CFE5 0%,#007CD1 35%,#005BA6 67%,#007CD1 100%);

  border: 1px solid #0b4cad;

  font-weight: normal;

  font-size: 16px;

  -webkit-box-shadow: inset #00b5e4 0 1px 1px;

  -moz-box-shadow: inset #00b5e4 0 1px 1px;

  -ms-box-shadow: inset #00b5e4 0 1px 1px;

  -o-box-shadow: inset #00b5e4 0 1px 1px;

  box-shadow: inset #00b5e4 0 1px 1px;

}

[class^="btn-special-feature"]:after, [class^="btn-special-feature"]:before {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  display: inline-block;

  position: absolute;

  top: 50%;

  -webkit-border-radius: 5px;

  -moz-border-radius: 5px;

  -ms-border-radius: 5px;

  -o-border-radius: 5px;

  border-radius: 5px;

}

[class^="btn-special-feature"]:after {

  content: counter(special-main-view-features);

  left: 10px;

  width: 30px;

  height: 30px;

  margin-top: -15px;

  line-height: 28px;

  text-align: center;

  text-indent: -0.1em;

  border: 1px solid #3f3f3f;

  font-weight: normal;

  font-size: 20px;

  font-style: italic;

  font-family: Helvetica, Arial, sans-serif;

  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #000000),color-stop(34%, #000000),color-stop(100%, #454545));

  background-image: -webkit-linear-gradient(bottom, #000000 0%,#000000 34%,#454545 100%);

  background-image: -moz-linear-gradient(bottom, #000000 0%,#000000 34%,#454545 100%);

  background-image: -ms-linear-gradient(bottom, #000000 0%,#000000 34%,#454545 100%);

  background-image: -o-linear-gradient(bottom, #000000 0%,#000000 34%,#454545 100%);

  background-image: linear-gradient(to top, #000000 0%,#000000 34%,#454545 100%);

}

[class^="btn-special-feature"]:before {

  content: "";

  left: 8px;

  width: 34px;

  height: 34px;

  margin-top: -17px;

  opacity: 0.3;

  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #333333),color-stop(30%, #333333),color-stop(100%, #444444));

  background-image: -webkit-linear-gradient(bottom, #333333 0%,#333333 30%,#444444 100%);

  background-image: -moz-linear-gradient(bottom, #333333 0%,#333333 30%,#444444 100%);

  background-image: -ms-linear-gradient(bottom, #333333 0%,#333333 30%,#444444 100%);

  background-image: -o-linear-gradient(bottom, #333333 0%,#333333 30%,#444444 100%);

  background-image: linear-gradient(to top, #333333 0%,#333333 30%,#444444 100%);

}



/*

## .btn-special-search



特集ページの U-car 検索ボタン



	<a class="btn-special-search" href="#">{{ 車種名 }}のU-carを検索</a>

*/

[class^="btn-special-search"] {

  position: relative;

  width: auto;

  height: auto;

  padding: 8px 10px 8px 35px;

  text-align: center;

  color: white;

  letter-spacing: -0.03em;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #454545),color-stop(50%, #000000),color-stop(100%, #000000));

  background-image: -webkit-linear-gradient(top, #454545 0%,#000000 50%,#000000 100%);

  background-image: -moz-linear-gradient(top, #454545 0%,#000000 50%,#000000 100%);

  background-image: -ms-linear-gradient(top, #454545 0%,#000000 50%,#000000 100%);

  background-image: -o-linear-gradient(top, #454545 0%,#000000 50%,#000000 100%);

  background-image: linear-gradient(to bottom, #454545 0%,#000000 50%,#000000 100%);

  border: 1px solid #3f3f3f;

  font-weight: normal;

  font-size: 16px;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  -ms-box-shadow: none;

  -o-box-shadow: none;

  box-shadow: none;

}

[class^="btn-special-search"]:before {

  content: "";

  display: inline-block;

  position: relative;

  width: 20px;

  height: 20px;

  top: 4px;

  margin-left: -30px;

  margin-right: 3px;

  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACgAAAAoCAYAAACM/rhtAAADbUlEQVR42sWYz2sTURDHGxEULFKVqqUV05N6kaKgIEV68dfNg6DH3hQELfgH6MWrVpEeFC9ivXhooodYoumPNAlFalrSJA1p2oMNoXgwaiW/mq7fgQmEIbub3besAwPN7r55nzdvZt68dlgVTdMGOlwSzGX6gRc6Ap3WWssidJSgXQXEi656vT6uWZBisfhzfn7+td/v3+80oHw4tLOz81uzKaurqwuA7HUckB8MmwFsbW39Mftmc3NzHZCHnANkz+lNWC6XS6FQKIZJpxoaCATCy8vLaT3gjY2NCL7zqANyzGFbDT2D+Ioz3BFoJ+tF6LtMJpM1GDPoBOBoO0nAgLubjeD3Hui9cDj8dXt7uybDAe9eQT22Acl7gsUIcELHFoFew5an5Lh4PJ7AuwsqgCNGYOQVmoS990AakZC0kObxPyB4/kIFcNoIkBKB4XztZObKysobuUAef8IuYFEG9ndII3thOAR9DO1rxygtQsYixSee37EHKIRXG5ydnX0O793F3wetGkZyrLfI5pdOAX6BHu9QkFKplGwBOOkU4KRqga1UKks6NdSjDMgnRp8KIBqNvy1i0OdIFtOpAGNXFar/gE5cP3SkDnLmPlLw3ltZBxnwnF1AryZkbW0tR2euDYNDOnV0HOqxBchlISgNo+DSqvda2VpuOORukJ1bSs1CoVA4LYsrSS6Xi8J4txjXdpPbdET2KPeD2Wz2o06D+iufzz+rVqsHWhi4DvXp9ZDUMwLuE4WRMiAMnaF40QykVqtlOeuhJObddwbCP4dVAT3QTsReiLfbunDWmjQeg0qXJioHVKy5bTIUuaWNE0PshEy+GXKG0rWT2/kbmHChAKHJ9XpF8lhTMnymcYjX2220cFfsAErQfujTxiWJPNRQeYni7/rZcFEzkWQyuYjvj9kGlNsOHWMQqWP0XtZEeLdiBplOp2mR3UqAMomk6sVTIpG4L5LNCPKwRUB1odtfNBqdaAcylUpRt+N1FZAhj0YikSBDmsUkVYBTrgIyZK8FyCV8f9JVQIbsswD5jTopAeiaJwNmkNw0071oFwO6CtmNxPlgBsl36bMM6DpkVywWe08QenB8h7kpAF2F3CcgJdwU9LzrgPK8x3b7GVLCPYF61AHVIXvm5uZmqBkhOPk/IAb875CXxdl+qbkO/gMde0oPFVs8cAAAAABJRU5ErkJggg==) 0 0 no-repeat;

  -webkit-background-size: 20px 20px;

  -moz-background-size: 20px 20px;

  -ms-background-size: 20px 20px;

  -o-background-size: 20px 20px;

  background-size: 20px 20px;

}



/*

## .wrapper-btn-special-search



特集ページの U-car 検索ボタン の外枠を表示する。（Btn クラスではない。）



	<p class="wrapper-btn-special-search"><a class="btn-special-search" href="#">{{ 車種名 }}のU-carを検索</a></p>

*/

.wrapper-btn-special-search {

  display: block;

  position: relative;

  overflow: hidden;

  padding: 3px;

  height: 100%;

  -webkit-border-radius: 6px;

  -moz-border-radius: 6px;

  -ms-border-radius: 6px;

  -o-border-radius: 6px;

  border-radius: 6px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #a1a1a1),color-stop(100%, #e7e7e7));

  background-image: -webkit-linear-gradient(top, #a1a1a1 0%,#e7e7e7 100%);

  background-image: -moz-linear-gradient(top, #a1a1a1 0%,#e7e7e7 100%);

  background-image: -ms-linear-gradient(top, #a1a1a1 0%,#e7e7e7 100%);

  background-image: -o-linear-gradient(top, #a1a1a1 0%,#e7e7e7 100%);

  background-image: linear-gradient(to bottom, #a1a1a1 0%,#e7e7e7 100%);

}



/*

# TextField Class



テキスト入力フィールドの抽象クラス



#### [Options]



 - `.textfield` 基本的なボタンのスタイル

 - `.btn-inline` インラインで使用する際のオプション（どれかのオプションと併用）

*/

.textfield, .textfield-minimal {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  padding: 5px;

  text-align: left;

  line-height: 1.5;

  display: block;

  color: black;

  border: 1px solid #b1b1b1;

  outline: none;

  -webkit-transition-property: all;

  -moz-transition-property: all;

  -ms-transition-property: all;

  -o-transition-property: all;

  transition-property: all;

  -webkit-transition-duration: 0.3s;

  -moz-transition-duration: 0.3s;

  -ms-transition-duration: 0.3s;

  -o-transition-duration: 0.3s;

  transition-duration: 0.3s;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  -ms-border-radius: 4px;

  -o-border-radius: 4px;

  border-radius: 4px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #dddddd),color-stop(30%, #ffffff),color-stop(100%, #ffffff));

  background-image: -webkit-linear-gradient(top, #dddddd 0%,#ffffff 30%,#ffffff 100%);

  background-image: -moz-linear-gradient(top, #dddddd 0%,#ffffff 30%,#ffffff 100%);

  background-image: -ms-linear-gradient(top, #dddddd 0%,#ffffff 30%,#ffffff 100%);

  background-image: -o-linear-gradient(top, #dddddd 0%,#ffffff 30%,#ffffff 100%);

  background-image: linear-gradient(to bottom, #dddddd 0%,#ffffff 30%,#ffffff 100%);

  -webkit-box-shadow: inset rgba(0, 0, 0, 0.1) 1px 0 2px, inset rgba(0, 0, 0, 0.1) -1px 0 2px;

  -moz-box-shadow: inset rgba(0, 0, 0, 0.1) 1px 0 2px, inset rgba(0, 0, 0, 0.1) -1px 0 2px;

  -ms-box-shadow: inset rgba(0, 0, 0, 0.1) 1px 0 2px, inset rgba(0, 0, 0, 0.1) -1px 0 2px;

  -o-box-shadow: inset rgba(0, 0, 0, 0.1) 1px 0 2px, inset rgba(0, 0, 0, 0.1) -1px 0 2px;

  box-shadow: inset rgba(0, 0, 0, 0.1) 1px 0 2px, inset rgba(0, 0, 0, 0.1) -1px 0 2px;

  -webkit-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -moz-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -ms-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -o-tap-highlight-color: rgba(0, 160, 218, 0.7);

  tap-highlight-color: rgba(0, 160, 218, 0.7);

  -webkit-appearance: none;

  -moz-appearance: none;

  -ms-appearance: none;

  -o-appearance: none;

  appearance: none;

}

.textfield:focus, .textfield-minimal:focus {

  border: 1px solid #008bd1;

  -webkit-box-shadow: inset rgba(0, 0, 0, 0.1) 1px 0 2px, inset rgba(0, 0, 0, 0.1) -1px 0 2px, #008bd1 0 0 4px;

  -moz-box-shadow: inset rgba(0, 0, 0, 0.1) 1px 0 2px, inset rgba(0, 0, 0, 0.1) -1px 0 2px, #008bd1 0 0 4px;

  -ms-box-shadow: inset rgba(0, 0, 0, 0.1) 1px 0 2px, inset rgba(0, 0, 0, 0.1) -1px 0 2px, #008bd1 0 0 4px;

  -o-box-shadow: inset rgba(0, 0, 0, 0.1) 1px 0 2px, inset rgba(0, 0, 0, 0.1) -1px 0 2px, #008bd1 0 0 4px;

  box-shadow: inset rgba(0, 0, 0, 0.1) 1px 0 2px, inset rgba(0, 0, 0, 0.1) -1px 0 2px, #008bd1 0 0 4px;

}

[type="text"].textfield, [type="text"].textfield-minimal, [type="search"].textfield, [type="search"].textfield-minimal {

  vertical-align: middle;

}

[type="text"].textfield::-webkit-input-placeholder, [type="text"].textfield-minimal::-webkit-input-placeholder, [type="search"].textfield::-webkit-input-placeholder, [type="search"].textfield-minimal::-webkit-input-placeholder {

  vertical-align: bottom;

}

[type="text"].textfield:-moz-placeholder, [type="text"].textfield-minimal:-moz-placeholder, [type="search"].textfield:-moz-placeholder, [type="search"].textfield-minimal:-moz-placeholder {

  vertical-align: middle;

}

[type="text"].textfield::-moz-placeholder, [type="text"].textfield-minimal::-moz-placeholder, [type="search"].textfield::-moz-placeholder, [type="search"].textfield-minimal::-moz-placeholder {

  vertical-align: middle;

}

[type="text"].textfield::placeholder, [type="text"].textfield-minimal::placeholder, [type="search"].textfield::placeholder, [type="search"].textfield-minimal::placeholder {

  vertical-align: middle;

}



/*

## .textfield



テキストフィールドの基本的なスタイル



	<input type="text" class="textfield" />

	<textarea class="textfield"></textarea>

*/

.textfield {

  width: 50%;

}



/*

## .textfield-minimal



テキストフィールドの基本的なスタイル



	<input type="text" class="textfield" />

	<textarea class="textfield"></textarea>

*/

.textfield-minimal {

  width: 50%;

  padding: 2px;

  background: white;

  -webkit-box-shadow: none;

  -moz-box-shadow: none;

  -ms-box-shadow: none;

  -o-box-shadow: none;

  box-shadow: none;

  -webkit-border-radius: 0;

  -moz-border-radius: 0;

  -ms-border-radius: 0;

  -o-border-radius: 0;

  border-radius: 0;

}



/*

# TabSelect Class



タブセレクト型入力フィールドの抽象クラス

`[type="checkbox"]`、`[type="radio"]` 要素のラッパー



#### [Options]



 - `.tabselect` 基本的なタブセレクト型入力フィールドのスタイル



#### [Contents]



- `tabselect-item` タブセレクトボタン（`<input>` を内包。`checkbox`、`radio` 両方に対応）

- `tabselect-item-checked` タブセレクトボタンの選択時の表示



*/

.tabselect {

  display: table;

}

.tabselect [class^="tabselect-item"] {

  display: table-cell;

  width: 45px;

  padding: 7px;

  text-shadow: rgba(0, 0, 0, 0.5) 1px 1px 0;

  text-align: center;

  color: white;

  border: 1px solid #2f3740;

  border-right: 0;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #BAC7D9),color-stop(25%, #A6B5CA),color-stop(50%, #879BB3),color-stop(51%, #7F94B0),color-stop(100%, #7E94B0));

  background-image: -webkit-linear-gradient(top, #BAC7D9 0%,#A6B5CA 25%,#879BB3 50%,#7F94B0 51%,#7E94B0 100%);

  background-image: -moz-linear-gradient(top, #BAC7D9 0%,#A6B5CA 25%,#879BB3 50%,#7F94B0 51%,#7E94B0 100%);

  background-image: -ms-linear-gradient(top, #BAC7D9 0%,#A6B5CA 25%,#879BB3 50%,#7F94B0 51%,#7E94B0 100%);

  background-image: -o-linear-gradient(top, #BAC7D9 0%,#A6B5CA 25%,#879BB3 50%,#7F94B0 51%,#7E94B0 100%);

  background-image: linear-gradient(to bottom, #BAC7D9 0%,#A6B5CA 25%,#879BB3 50%,#7F94B0 51%,#7E94B0 100%);

  overflow: hidden;

  white-space: nowrap;

  -webkit-text-overflow: ellipsis;

  -moz-text-overflow: ellipsis;

  -ms-text-overflow: ellipsis;

  -o-text-overflow: ellipsis;

  text-overflow: ellipsis;

}

.tabselect [class^="tabselect-item"]:first-of-type {

  -webkit-border-radius: 4px 0 0 4px;

  -moz-border-radius: 4px 0 0 4px;

  -ms-border-radius: 4px 0 0 4px;

  -o-border-radius: 4px 0 0 4px;

  border-radius: 4px 0 0 4px;

}

.tabselect [class^="tabselect-item"]:last-of-type {

  border-right: 1px solid #2f3740;

  -webkit-border-radius: 0 4px 4px 0;

  -moz-border-radius: 0 4px 4px 0;

  -ms-border-radius: 0 4px 4px 0;

  -o-border-radius: 0 4px 4px 0;

  border-radius: 0 4px 4px 0;

}

.tabselect [class^="tabselect-item"] > input {

  position: absolute;

  left: -9999px;

  visibility: hidden;

}

.tabselect .tabselect-item-checked {

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #628DCB),color-stop(25%, #3E6BB2),color-stop(50%, #164496),color-stop(51%, #063288),color-stop(100%, #09388A));

  background-image: -webkit-linear-gradient(top, #628DCB 0%,#3E6BB2 25%,#164496 50%,#063288 51%,#09388A 100%);

  background-image: -moz-linear-gradient(top, #628DCB 0%,#3E6BB2 25%,#164496 50%,#063288 51%,#09388A 100%);

  background-image: -ms-linear-gradient(top, #628DCB 0%,#3E6BB2 25%,#164496 50%,#063288 51%,#09388A 100%);

  background-image: -o-linear-gradient(top, #628DCB 0%,#3E6BB2 25%,#164496 50%,#063288 51%,#09388A 100%);

  background-image: linear-gradient(to bottom, #628DCB 0%,#3E6BB2 25%,#164496 50%,#063288 51%,#09388A 100%);

}



/*

## .tabselect



基本的なタブセレクト型入力フィールドのスタイル





	<div class="tabselect">

		<label class="tabselect-item-checked"><input type="radio" value="" name="radio++++++" checked="checked" />radio</label>

		<label class="tabselect-item"><input type="radio" value="" name="radio++++++" />radio</label>

		<label class="tabselect-item"><input type="radio" value="" name="radio++++++" />radio</label>

	</div>



	<div class="tabselect">

		<label class="tabselect-item-checked"><input type="checkbox" value="" name="checkbox++++++" checked="checked" />checkbox</label>

		<label class="tabselect-item"><input type="checkbox" value="" name="checkbox++++++" />checkbox</label>

		<label class="tabselect-item"><input type="checkbox" value="" name="checkbox++++++" />checkbox</label>

	</div>



	<script>

		// `.tabselect` の Javascript での実装例。（要jQuery）

		// `.tabselect-item` がクリックされたタイミングで内包する `input` 要素の `checked` 属性値をチェックし、表示を切り替える。

		// `[type="checkbox"]`、`[type="radio"]` のそれぞれに対応。

		// `onreset`、`onsubmit` 対応は別途必要。

		jQuery(function($){

			var tabselects  = $('.tabselect'),

			    cl_normal   = 'tabselect-item',

			    cl_checked  = 'tabselect-item-checked',

			    str_checked = 'checked';



			$.each(tabselects,function(){

				var tabselect = $(this),

				    btns      = tabselect.find('[class*=-item]'),

				    inputs    = btns.find('input');



				btns.on('click',function(e){

					var btn       = $(this),

					    input     = btn.find('input'),

					    type      = input.attr('type'),

					    ischecked = (input.attr(str_checked) === str_checked ? true : false);



					if(type === "checkbox"){

						if(ischecked){

							btn.addClass(cl_normal).removeClass(cl_checked);

							input.removeAttr(str_checked);

						}

						else{

							btn.addClass(cl_checked).removeClass(cl_normal);

							input.attr(str_checked,str_checked);

						}

					}

					else {

						if(!ischecked){

							btns.addClass(cl_normal).removeClass(cl_checked);

							inputs.removeAttr(str_checked);

							btn.addClass(cl_checked).removeClass(cl_normal);

							input.attr(str_checked,str_checked);

						}

					}



					e.preventDefault();

				});

			});

		});

	</script>



*/

/*

# FieldGroup Class



フィールドグループの抽象クラス



#### [Use]



- `Btn Class`

- `TextField Class`



#### [Options]



 - `.fieldgroup` 基本的なフィールドグループのスタイル

 - `.fieldgroup-search` 検索入力欄と検索ボタンのグループスタイル

*/

/*

## .fieldgroup-search



検索入力欄と検索ボタンのグループスタイル



#### [Use]



- `.textfield`

- `.btn-primary.btn-primary-search`





	<fieldset class="fieldgroup-search">

		<input type="search" name="input*****" placeholder="検索文字入力" class="textfield" />

		<button type="submit" name="input****" class="btn-primary btn-primary-search btn-overflow-ellipsis">検索</button>

	</fieldset>

*/

.fieldgroup-search {

  overflow: hidden;

  position: relative;

  padding-right: 70px;

}

.fieldgroup-search .textfield {

  width: 100%;

  height: 30px;

}

.fieldgroup-search .btn-primary-search {

  position: absolute;

  top: 0;

  right: 0;

}



@media screen and (min-width: 0px) and (max-device-width: 320px) and (orientation: portrait) {

  .fieldgroup-search .textfield {

    width: 225px;

  }

}

/*

# FormView Class



フォームスタイルの抽象クラス。



#### [Options]



 - `.form-view` 基本的なフォームのスタイル



#### [Use]



- TextField Class

- Icon Class



#### [Contents]



- `.form-view-header` ヘッダー

- `.form-view-header-blueline` ヘッダー（区切り線がブルーのバージョン）

- `.form-view-label` 見出し

- `.form-view-label-control` 見出し（`.btn-form-view` を内包する）

- `.form-view-required` 必須項目のラベル

- `.form-view-any` 任意項目のラベル

- `.form-view-item` 入力項目のラッパー

- `.form-view-item-noline` 入力項目のラッパー（ライン無しバージョン）

- `.form-view-item-label` 各入力項目の見出し

- `.form-view-item-label-b` 各入力項目の見出し（黒）

- `.form-view-group` フィールドパーツのラッパー（内包するフィールドがひとつのケース）

- `.form-view-group-action` アクションボタンのラッパー

- `.form-view-group-action-narrow` アクションボタンのラッパー（ボタン狭め）

- `.form-view-group-range` フィールドパーツのラッパー（範囲を指定するフィールドの組み合わせ）

- `.form-view-group-color` フィールドパーツのラッパー（カラーを指定するフィールドの組み合わせ）

- `.form-view-field-color-{colorscheme}` カラーを指定するチェックボックスの `<label>`

- `.form-view-group-ckeckbox` フィールドパーツのラッパー（チェックボックスのフィールドの組み合わせ）

- `.form-view-field-checkbox` チェックボックスの `<label>` （1行表示専用）

- `.form-view-field-checkbox-multiline` チェックボックスの `<label>` （2行表示専用）

- `.form-view-group-tabselect` タブセレクトボタンのラッパー

- `.form-view-group-complete` 完了画面用のパーツグループ

- `.form-view-group-complete-box` 完了画面用のパーツグループ内で情報をまとめるボックス

- `.form-view-group-alert` 警告表示用のパーツグループ

- `.form-view-group-agreement` 同意事項表示用のパーツグループ

- `.form-view-text-attention` テキストカラーを注意色にするオプション

- `.form-view-text-status` フォームの状態を表すテキスト



*/

.form-view {

  position: relative;

  padding-bottom: 10px;

}

.form-view input[type="checkbox"],

.form-view input[type="radio"],

.form-view select,

.form-view label {

  -webkit-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -moz-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -ms-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -o-tap-highlight-color: rgba(0, 160, 218, 0.7);

  tap-highlight-color: rgba(0, 160, 218, 0.7);

}
/*
.form-view:before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

  width: 100%;

  height: 44px;

  border-top: 1px solid white;

  -webkit-box-shadow: inset white 0 -5px 1px;

  -moz-box-shadow: inset white 0 -5px 1px;

  -ms-box-shadow: inset white 0 -5px 1px;

  -o-box-shadow: inset white 0 -5px 1px;

  box-shadow: inset white 0 -5px 1px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #CCCCCC),color-stop(90%, #FFFFFF),color-stop(100%, #FFFFFF));

  background-image: -webkit-linear-gradient(top, #CCCCCC 0%,#FFFFFF 90%,#FFFFFF 100%);

  background-image: -moz-linear-gradient(top, #CCCCCC 0%,#FFFFFF 90%,#FFFFFF 100%);

  background-image: -ms-linear-gradient(top, #CCCCCC 0%,#FFFFFF 90%,#FFFFFF 100%);

  background-image: -o-linear-gradient(top, #CCCCCC 0%,#FFFFFF 90%,#FFFFFF 100%);

  background-image: linear-gradient(to bottom, #CCCCCC 0%,#FFFFFF 90%,#FFFFFF 100%);

}*/

.form-view:last-of-type {

  border-top: 1px solid #cccccc;

}

.form-view > .form-view:last-of-type {

  border-top: 0;

}

.form-view a {

  color: #fff;

}

.form-view [class^="carlist-item"] {

  position: relative;

  z-index: 5;

}

.form-view [class^="form-view-header"] {

  position: relative;

  z-index: 1;

  border-top: 1px solid #cccccc;

}

.form-view [class^="form-view-header"][class*="-header-blueline"] {

  border-top: 3px solid #000;

}

.form-view .form-view-required {

  position: absolute;

  right: 10px;

  top: 10px;

  padding: 4px 6px;

  color: white;

  background: #696969;

  font-weight: normal;

  font-size: 12px;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

}

.form-view .form-view-any {

  position: absolute;

  right: 10px;

  top: 10px;

  padding: 4px 6px;

  color: #5b4910;

  background: #ffbe00;

  font-weight: normal;

  font-size: 12px;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

}

.form-view [class*="form-view-label"] {

  color: black;

  padding: 10px 10px 0;

  line-height: 1.5;

  letter-spacing: 0.04em;

  border-top: 1px solid white;

}

.form-view [class*="form-view-label"] a {

  color: black;

}

.form-view .form-view-label-control {

  padding: 0;

}

.form-view .form-view-required + [class*="form-view-label"] {

  padding-right: 4em;

}

.form-view .form-view-text-attention {

  color: #be0000;

}

.form-view .form-view-text-status {

  position: relative;

  z-index: 5;

  padding: 20px 10px 8px;

  line-height: 1.2;

  letter-spacing: 0;

}

.form-view .form-view-item {

  position: relative;

  z-index: 1;

  min-height: 44px;

  padding-bottom: 10px;

  border-top: 1px solid #cccccc;

}

.form-view .form-view-item:first-of-type {

  border-top: 0;

}

.form-view .form-view-item.form-view-item--no-border {

  border: 0;

}

.form-view .form-view-item > p {

  line-height: 1.2;

  letter-spacing: 0;

}

.form-view .form-view-item-noline {

  position: relative;

  z-index: 1;

  min-height: 44px;

  padding-bottom: 10px;

}

.form-view .form-view-item-noline > p {

  line-height: 1.2;

  letter-spacing: 0;

}

.form-view .form-view-item-noline + .form-view-item-noline {

  margin-top: -10px;

}

.form-view .form-view-item-label {

  display: block;

  padding: 10px 10px 0;

  color: #008bd1;

}

.form-view .form-view-item-label-b {

  display: block;

  position: relative;

  margin-top: 10px;

  padding: 3px 10px 3px 10px;

  font-size: 12px;

}

.form-view .form-view-item-label-b > .form-view-any {

  top: 0;

  right: 10px;

}

.form-view [class^="form-view-group"] {

  padding: 10px 10px 0;

}

.form-view .form-view-group > p {

  line-height: 1.2;

  letter-spacing: 0;

  color: #8b8b8b;

}

.form-view .form-view-group > select {

  display: block;

  width: 100%;

}

.form-view .form-view-group > .textfield {

  display: block;

  width: 100%;

}

.form-view .form-view-group > label {

  line-height: 1.2;

  letter-spacing: 0;

  vertical-align: middle;

}

.form-view .form-view-group > label [type="checkbox"], .form-view .form-view-group > label [type="radio"] {

  display: inline-block;

  margin: 0 5px 0 0;

  vertical-align: middle;

}

.form-view .form-view-group > table {

  width: 100%;

  border-collapse: collapse;

  border: 1px solid #b1b1b1;

}

.form-view .form-view-group > table th, .form-view .form-view-group > table td {

  padding: 5px 3px;

  line-height: 1.2;

  letter-spacing: 0;

  font-weight: normal;

  font-size: 9.6px;

  border-bottom: 1px solid #b1b1b1;

}

.form-view .form-view-group > table th {

  width: 9em;

  height: 2.5em;

  text-align: left;

  background: #eeeeee;

  border-left: 1px solid #b1b1b1;

}

.form-view .form-view-group > table td {

  height: 2.5em;

  padding: 5px;

  text-align: left;

  font-size: 12px;

}

.form-view .form-view-group > table td > p {

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

}

.form-view .form-view-group > table td strong {

  line-height: 1.2;

  letter-spacing: 0;

  color: #be0000;

  font-size: 12px;

  font-weight: normal;

}

.form-view .form-view-group-alert {

  position: relative;

  margin: 7px 10px 0;

  padding: 5px 5px 5px 35px;

  color: #be0000;

  background: #ffc400;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

}

.form-view .form-view-group-alert:before {

  position: absolute;

  left: 5px;

  top: 50%;

  margin-top: -12px;

  background-color: white;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

}

.form-view .form-view-group-alert strong {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  display: block;

  min-height: 24px;

  padding: 5px 0;

  line-height: 1.2;

  letter-spacing: 0;

  font-weight: normal;

  font-size: 12px;

}

.form-view .form-view-group-complete > p {

  line-height: 1.5;

  letter-spacing: 0;

}

.form-view .form-view-group-complete > ul {

  padding-top: 10px;

  list-style: none;

}

.form-view .form-view-group-complete > ul > li {

  position: relative;

  padding-left: 1em;

  padding-top: 5px;

  line-height: 1.5;

  letter-spacing: 0;

  font-size: 12px;

}

.form-view .form-view-group-complete > ul > li:before {

  content: "※";

  display: block;

  position: absolute;

  left: 0;

  width: 1em;

  height: 1em;

  line-height: 1em;

}

.form-view .form-view-group-complete .form-view-group-complete-box {

  margin-top: 10px;

  padding: 10px 20px 8px;

  background: #eeeeee;

}

.form-view .form-view-group-complete .form-view-group-complete-box > p {

  line-height: 1.5;

  letter-spacing: 0;

  font-size: 12px;

}

.form-view [class^="form-view-group-minimal"] {

  margin: 0 10px 0;

  padding: 5px 10px 10px;

  background: #fff;

  font-size: 12px;

}

.form-view-group-minimal.border-minimal {
  border: 1px solid #b1b1b1;
  padding-top: 5px;
  padding-bottom: 5px;
  background: #eee;
}

.form-view [class^="form-view-group-minimal"] .textfield-minimal {

  width: 100%;

}

.form-view [class^="form-view-group-minimal"] > .textfield-minimal {

  margin-top: 5px;

}

.form-view [class^="form-view-group-minimal"] > .textfield-minimal:first-of-type {

  margin-top: 0;

}

.form-view [class^="form-view-group-minimal"] dl {

  display: table;

  width: 100%;

  margin-top: 5px;

}

.form-view [class^="form-view-group-minimal"] dl:first-of-type {

  margin-top: 0;

}

.form-view [class^="form-view-group-minimal"] dl dt, .form-view [class^="form-view-group-minimal"] dl dd {

  display: table-cell;

  vertical-align: top;

}

.form-view [class^="form-view-group-minimal"] dl dt {

  width: 13%;

  padding-top: 0.4em;

}

.form-view [class^="form-view-group-minimal"] dl dd {

  width: 87%;

}

.form-view .form-view-group-minimal-postalcode fieldset .textfield-minimal {

  display: inline-block;

  width: 25%;

  margin: 0 7px;

}

.form-view .form-view-group-minimal-postalcode fieldset .textfield-minimal:first-of-type {

  margin-left: 0;

}

.form-view .form-view-group-minimal-postalcode fieldset .btn {

  display: inline-block;

  width: 30%;

  margin-top: 0;

  padding: 2px;

}

.form-view .form-view-group-minimal-postalcode .btn {

  width: auto;

  margin-top: 5px;

  padding: 2px 15px;

  text-align: center;

}

.form-view .form-view-group-minimal-phone .textfield-minimal {

  display: inline-block;

  width: 29%;

  margin: 0 7px;

}

.form-view .form-view-group-minimal-phone .textfield-minimal:first-of-type {

  margin-left: 0;

}

.form-view .form-view-group-minimal-phone .textfield-minimal:last-of-type {

  margin-right: 0;

}

.form-view .form-view-group-minimal-radio {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

}

.form-view .form-view-group-minimal-radio > label {

  display: inline-block;

  width: 45%;

  vertical-align: middle;

}

.form-view .form-view-group-minimal-radio > label input[type="radio"] {

  display: inline-block;

  margin-top: -3px;

  margin-right: 5px;

  vertical-align: middle;

}

.form-view .form-view-group-agreement {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  overflow: auto;

  height: 160px;

  margin: 10px 10px 0;

  padding: 5px;

  border: 1px solid #b1b1b1;

}

.form-view .form-view-group-agreement h2, .form-view .form-view-group-agreement p, .form-view .form-view-group-agreement li, .form-view .form-view-group-agreement a {

  line-height: 1.5;

  letter-spacing: 0.04em;

  font-size: 12px;

  font-weight: normal;

}

.form-view .form-view-group-agreement > h2 {

  padding-top: 15px;

}

.form-view .form-view-group-agreement > h2:first-of-type {

  padding-top: 0;

}

.form-view .form-view-group-agreement > ol, .form-view .form-view-group-agreement > ul {

  padding-top: 15px;

}

.form-view .form-view-group-agreement > ol {

  counter-reset: form-view-group-agreement;

}

.form-view .form-view-group-agreement > ol li {

  counter-increment: form-view-group-agreement;

}

.form-view .form-view-group-agreement > ol li:before {

  content: "(" counter(form-view-group-agreement) ")";

  display: inline-block;

  padding: 0 3px 0 0;

}

.form-view [class^="form-view-group-action"] {

  display: -webkit-box;

  display: -moz-box;

  display: -ms-box;

  display: -o-box;

  display: box;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  width: 100%;

  height: auto;

  padding: 10px 5px 0;

}

.form-view [class^="form-view-group-action"]:last-of-type {

  margin-bottom: -10px;

}

.form-view [class^="form-view-group-action"] [class^="btn"] {

  -webkit-box-flex: 1;

  -moz-box-flex: 1;

  -ms-box-flex: 1;

  -o-box-flex: 1;

  box-flex: 1;

  display: block;

  width: auto;

  height: auto;

  margin: 0 5px;

  text-align: center;

  padding: 8px 5px 8px 5px;

}

.form-view [class^="form-view-group-action"] .btn {

  width: 40%;

  color: #fff;

  background-color: #555;

}

.form-view [class^="form-view-group-action"] .btn[class*="icon-"] {

  padding-left: 20px;

}

.form-view [class^="form-view-group-action"] .btn[class*="icon-"]:before {

  left: 10px;

}

.form-view [class^="form-view-group-action"] .btn-primary {

  width: 50%;

}

.form-view [class^="form-view-group-action"] [class^="btn"]:only-child {

  width: 100%;

  text-shadow: rgba(0, 0, 0, 0.3) 1px 1px 0;

}

.form-view .form-view-group-action-narrow [class^="btn"] {

  padding: 7px 5px 7px 5px;

  line-height: 1.2;

  letter-spacing: 0;

}

.form-view .form-view-group-range > .textfield, .form-view .form-view-group-range > select, .form-view .form-view-group-range > span {

  display: inline-block;

  vertical-align: middle;

}

.form-view .form-view-group-range > select, .form-view .form-view-group-range .textfield {

  width: 45%;

}

.form-view .form-view-group-color {

  padding-top: 3px;

}

.form-view .form-view-group-color > [class^="form-view-field-color-"] {

  display: inline-block;

  margin: 7px 2px 0;

  width: 52px;

  padding: 10px 0;

  text-indent: -9999px;

  text-align: center;

  color: transparent;

  font-size: 0;

  border: 1px solid black;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  overflow: hidden;

  white-space: nowrap;

  -webkit-text-overflow: ellipsis;

  -moz-text-overflow: ellipsis;

  -ms-text-overflow: ellipsis;

  -o-text-overflow: ellipsis;

  text-overflow: ellipsis;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

  -webkit-box-shadow: inset rgba(255, 255, 255, 0.3) 2px 2px 2px, inset rgba(0, 0, 0, 0.3) -2px -2px 2px;

  -moz-box-shadow: inset rgba(255, 255, 255, 0.3) 2px 2px 2px, inset rgba(0, 0, 0, 0.3) -2px -2px 2px;

  -ms-box-shadow: inset rgba(255, 255, 255, 0.3) 2px 2px 2px, inset rgba(0, 0, 0, 0.3) -2px -2px 2px;

  -o-box-shadow: inset rgba(255, 255, 255, 0.3) 2px 2px 2px, inset rgba(0, 0, 0, 0.3) -2px -2px 2px;

  box-shadow: inset rgba(255, 255, 255, 0.3) 2px 2px 2px, inset rgba(0, 0, 0, 0.3) -2px -2px 2px;

}

.form-view .form-view-group-color > [class^="form-view-field-color-"] > input {

  display: block;

  margin: 0 auto;

}

.form-view .form-view-group-color .form-view-field-color-white {

  background: white;

}

.form-view .form-view-group-color .form-view-field-color-black {

  background: black;

}

.form-view .form-view-group-color .form-view-field-color-grey {

  background: gray;

}

.form-view .form-view-group-color .form-view-field-color-ivory {

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #FFFFFF),color-stop(50%, #B2AD9D),color-stop(51%, #C5C1B6),color-stop(100%, #FFFFFF));

  background-image: -webkit-linear-gradient(top, #FFFFFF 0%,#B2AD9D 50%,#C5C1B6 51%,#FFFFFF 100%);

  background-image: -moz-linear-gradient(top, #FFFFFF 0%,#B2AD9D 50%,#C5C1B6 51%,#FFFFFF 100%);

  background-image: -ms-linear-gradient(top, #FFFFFF 0%,#B2AD9D 50%,#C5C1B6 51%,#FFFFFF 100%);

  background-image: -o-linear-gradient(top, #FFFFFF 0%,#B2AD9D 50%,#C5C1B6 51%,#FFFFFF 100%);

  background-image: linear-gradient(to bottom, #FFFFFF 0%,#B2AD9D 50%,#C5C1B6 51%,#FFFFFF 100%);

}

.form-view .form-view-group-color .form-view-field-color-gold {

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #F1E57F),color-stop(10%, #F2E89D),color-stop(50%, #B48722),color-stop(51%, #3D2C0E),color-stop(100%, #97772A));

  background-image: -webkit-linear-gradient(top, #F1E57F 0%,#F2E89D 10%,#B48722 50%,#3D2C0E 51%,#97772A 100%);

  background-image: -moz-linear-gradient(top, #F1E57F 0%,#F2E89D 10%,#B48722 50%,#3D2C0E 51%,#97772A 100%);

  background-image: -ms-linear-gradient(top, #F1E57F 0%,#F2E89D 10%,#B48722 50%,#3D2C0E 51%,#97772A 100%);

  background-image: -o-linear-gradient(top, #F1E57F 0%,#F2E89D 10%,#B48722 50%,#3D2C0E 51%,#97772A 100%);

  background-image: linear-gradient(to bottom, #F1E57F 0%,#F2E89D 10%,#B48722 50%,#3D2C0E 51%,#97772A 100%);

}

.form-view .form-view-group-color .form-view-field-color-silver {

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #F1F1F1),color-stop(10%, #F8F8F8),color-stop(50%, #B6B6B6),color-stop(51%, #3C3C3C),color-stop(100%, #BABABA));

  background-image: -webkit-linear-gradient(top, #F1F1F1 0%,#F8F8F8 10%,#B6B6B6 50%,#3C3C3C 51%,#BABABA 100%);

  background-image: -moz-linear-gradient(top, #F1F1F1 0%,#F8F8F8 10%,#B6B6B6 50%,#3C3C3C 51%,#BABABA 100%);

  background-image: -ms-linear-gradient(top, #F1F1F1 0%,#F8F8F8 10%,#B6B6B6 50%,#3C3C3C 51%,#BABABA 100%);

  background-image: -o-linear-gradient(top, #F1F1F1 0%,#F8F8F8 10%,#B6B6B6 50%,#3C3C3C 51%,#BABABA 100%);

  background-image: linear-gradient(to bottom, #F1F1F1 0%,#F8F8F8 10%,#B6B6B6 50%,#3C3C3C 51%,#BABABA 100%);

}

.form-view .form-view-group-color .form-view-field-color-red {

  background: red;

}

.form-view .form-view-group-color .form-view-field-color-blue {

  background: blue;

}

.form-view .form-view-group-color .form-view-field-color-green {

  background: green;

}

.form-view .form-view-group-color .form-view-field-color-wine {

  background: brown;

}

.form-view .form-view-group-color .form-view-field-color-yellow {

  background: yellow;

}

.form-view .form-view-group-color .form-view-field-color-orange {

  background: orange;

}

.form-view .form-view-group-color .form-view-field-color-pink {

  background: pink;

}

.form-view .form-view-group-color .form-view-field-color-purple {

  background: purple;

}

.form-view .form-view-group-color .form-view-field-color-other {

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACAAAAAgCAMAAABEpIrGAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2NDQ3NUJGOTk0NTcxMUUyOTk5MkNENEQyRURFNTQ2QSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2NDQ3NUJGQTk0NTcxMUUyOTk5MkNENEQyRURFNTQ2QSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjY0NDc1QkY3OTQ1NzExRTI5OTkyQ0Q0RDJFREU1NDZBIiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjY0NDc1QkY4OTQ1NzExRTI5OTkyQ0Q0RDJFREU1NDZBIi8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+MSsDwAAAAAZQTFRF////AAAAVcLTfgAAABxJREFUeNpiYEQDDOhgVMGIUjAaLqMKkABAgAEAJFwCAQwZI2IAAAAASUVORK5CYII=);

  -webkit-background-size: 16px 16px;

  -moz-background-size: 16px 16px;

  -ms-background-size: 16px 16px;

  -o-background-size: 16px 16px;

  background-size: 16px 16px;

}

.form-view .form-view-item-label + .form-view-group-tabselect {

  position: absolute;

  right: 0;

  top: 0;

}

.form-view .form-view-group-checkbox {

  margin-bottom: -11px;

  padding: 0;

}

.form-view .form-view-group-checkbox:after {

  content: "";

  display: block;

  visibility: hidden;

  clear: both;

  height: 0;

}

.form-view .form-view-group-checkbox [class^="form-view-field-checkbox"] {

  display: block;

  position: relative;

  float: left;

  width: 50%;

  padding: 17px 2px 17px 35px;

  vertical-align: bottom;

  border-right: 1px solid #b1b1b1;

  border-bottom: 1px solid #b1b1b1;

  font-size: 12px;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  overflow: hidden;

  white-space: nowrap;

  -webkit-text-overflow: ellipsis;

  -moz-text-overflow: ellipsis;

  -ms-text-overflow: ellipsis;

  -o-text-overflow: ellipsis;

  text-overflow: ellipsis;

}

.form-view .form-view-group-checkbox [class^="form-view-field-checkbox"]:nth-of-type(even) {

  border-right: 0;

}

.form-view .form-view-group-checkbox [class^="form-view-field-checkbox"]:last-of-type:nth-of-type(odd) {

  width: 100%;

  border-right: 0;

}

.form-view .form-view-group-checkbox [class^="form-view-field-checkbox"] > input {

  position: absolute;

  left: 12px;

  top: 50%;

  width: 16px;

  height: 16px;

  margin-top: -8px;

}

.form-view .form-view-group-checkbox .form-view-field-checkbox-multiline {

  padding: 11px 2px 11px 38px;

}

.form-view .form-view-item-b {

  position: relative;

  margin: 0 10px;

  padding: 7px;

}

.form-view .form-view-item-b:before {

  /*content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

  width: 100%;

  height: 44px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #CCCCCC),color-stop(90%, #FFFFFF),color-stop(100%, #FFFFFF));

  background-image: -webkit-linear-gradient(top, #CCCCCC 0%,#FFFFFF 90%,#FFFFFF 100%);

  background-image: -moz-linear-gradient(top, #CCCCCC 0%,#FFFFFF 90%,#FFFFFF 100%);

  background-image: -ms-linear-gradient(top, #CCCCCC 0%,#FFFFFF 90%,#FFFFFF 100%);

  background-image: -o-linear-gradient(top, #CCCCCC 0%,#FFFFFF 90%,#FFFFFF 100%);

  background-image: linear-gradient(to bottom, #CCCCCC 0%,#FFFFFF 90%,#FFFFFF 100%);*/

}

.form-view .form-view-item-b__grid {

  display: table;

  table-layout: fixed;

  position: relative;

  z-index: 1;

}

.form-view .form-view-item-b__grid__cell-a {

  display: table-cell;

  width: 60px;

  min-width: 60px;

  vertical-align: middle;

}

.form-view .form-view-item-b__grid__cell-b {

  display: table-cell;

  width: 100%;

  vertical-align: top;

}

.form-view .form-view-item-b__label {

  padding-bottom: 3px;

  line-height: 1.2;

  font-size: 11px;

}

.form-view .form-view-item-b__label + .form-view-required {

  position: relative;

  right: auto;

  top: auto;

  font-size: 11px;

}

.form-view .form-view-item-b__grid__cell-b [class^="form-view-group-minimal"] {

  margin: 0;

  padding: 6px;

}

.form-view .form-view-item-b__grid__cell-b .form-view-group-minimal-phone .textfield-minimal {

  width: 26.8%;

}

.form-view .form-view-item-b__grid__cell-b .form-view-group-minimal-phone .note {

  padding-bottom: 5px;

  line-height: 1.2;

  font-size: 11px;

}

.form-view .form__grid {

  display: table;

  table-layout: fixed;

  position: relative;

  z-index: 1;

}

.form-view .form__grid--fit-width {

  width: 100%;

}

.form-view .form__grid__cell {

  display: table-cell;

  padding-left: 5px;

  vertical-align: middle;

  text-align: right;

  font-size: 12px;

  white-space: nowrap;

}

.form-view .form__grid__cell:first-child {

  padding-left: 0;

}

.form-view .form__grid__cell--phone-message {

  text-align: left;

  line-height: 1.5;

  font-size: 12px;

}

.form-view .form__grid__cell--phone-btn {

  min-width: 120px;

  width: 120px;

}

.form-view .form__grid__cell .btn {

  padding: 1px 5px;

  line-height: 1.2;

  font-size: 10px;

}

.form-view .form__grid__cell .btn-call {

  width: 100%;

  height: 40px;

/*  color: #fff;*/

  padding-left: 30px;

  line-height: 30px;

  vertical-align: middle;

  box-shadow: rgba(0,0,0,0.2) 0 1px 0;

}

.form-view .form__grid__cell label.btn {

  display: block;

  width: 100%;

  padding: 7px;

  line-height: 1.2;

  font-size: 12px;

}

.form-view .form__grid__cell label.btn input {

  margin-right: 5px;

}





@media only screen and (orientation: landscape) {

  .form-view .form-view-group-checkbox .form-view-field-checkbox-multiline {

    padding: 17px 2px 17px 38px;

  }

  .form-view .form-view-group-checkbox .form-view-field-checkbox-multiline br {

    display: none;

  }

}

@media only screen and (device-aspect-ratio: 40 / 71) and (orientation: landscape) {

  .form-view .form-view-group-minimal .textfield-minimal {

    width: 50%;

  }

  .form-view .form-view-group-minimal-phone .textfield-minimal {

    width: 80px;

  }

}

/*

## .form-view



基本的なフォームのスタイル



#### [case:group]



	<section class="form-view">

		<header class="form-view-header">

			<h1 class="form-view-label">label</h1>

		</header>



		<div class="form-view-item">

			<label class="form-view-item-label">label</label>

			<div class="form-view-group">

				<input type="text" class="textfield" value="" name="input****" />

			</div>

		</div>



		<div class="form-view-item">

			<label class="form-view-item-label">label</label>

			<div class="form-view-group">

				<select name="input****">

					<option value="">option1</option>

					<option value="">option2</option>

					<option value="">option3</option>

					<option value="">option4</option>

					<option value="">option5</option>

				</select>

			</div>

		</div>



		<div class="form-view-item">

			<label class="form-view-item-label">label</label>

			<div class="form-view-group">

				<label><input type="checkbox" name="input*****" />支払い総額で絞り込む</label>

			</div>

		</div>



		<div class="form-view-item">

			<label class="form-view-item-label">label</label>

			<div class="form-view-group">

				<p>テキストテキスト</p>

			</div>

		</div>



		<div class="form-view-item-noline">

			<div class="form-view-group">

				<table>

					<tbody>

						<tr>

							<th>テキストテキスト</th>

							<td>テキストテキストテキストテキストテキストテキスト</td>

						</tr>

						<tr>

							<th>テキストテキスト</th>

							<td>テキストテキストテキストテキストテキストテキスト</td>

						</tr>

					<tbody>

				</table>

			</div>

		</div>

	</section>



#### [case:group-action]



	<section class="form-view">

		<div class="form-view-item">

			<div class="form-view-group-action">

				<button class="btn">reset</a>

				<button class="btn-primary btn-primary-no-glow">submit</a>

			</div>

		</div>

	</section>



	<section class="form-view">

		<div class="form-view-item">

			<div class="form-view-group-action-narrow">

				<button class="btn">reset</a>

				<button class="btn-primary btn-primary-no-glow">submit<br />multiline</a>

			</div>

		</div>

	</section>



#### [case:group-tabselect]



	<section class="form-view">

		<header class="form-view-header">

			<h1 class="form-view-label">label</h1>

		</header>



		<div class="form-view-item">

			<label class="form-view-item-label">label</label>

			<div class="form-view-group-tabselect">

				<div class="tabselect">

					<label class="tabselect-item-checked"><input type="radio" value="" name="radio++++++" checked="checked" />radio1</label>

					<label class="tabselect-item"><input type="radio" value="" name="radio++++++" />radio2</label>

					<label class="tabselect-item"><input type="radio" value="" name="radio++++++" />radio3</label>

				</div>

			</div>

		</div>

	</section>





#### [case:group-range]



	<section class="form-view">

		<header class="form-view-header">

			<h1 class="form-view-label">label</h1>

		</header>



		<div class="form-view-item">

			<label class="form-view-item-label">label</label>

			<div class="form-view-group-range">

				<select name="input*******">

					<option value="">下限なし</option>

				</select>

				<span>〜</span>

				<select name="input*******">

					<option value="">上限なし</option>

				</select>

			</div>

		</div>

	</section>



#### [case:group-color]



	<section class="form-view">

		<header class="form-view-header">

			<h1 class="form-view-label">label</h1>

		</header>



		<div class="form-view-item">

			<label class="form-view-item-label">label</label>

			<div class="form-view-group-color">

				<label class="form-view-field-color-white"><input type="checkbox" value="" name="inputcolor*******" />ホワイト系</label>

				<label class="form-view-field-color-black"><input type="checkbox" value="" name="inputcolor*******" />ブラック系</label>

				<label class="form-view-field-color-grey"><input type="checkbox" value="" name="inputcolor*******" />グレー系</label>

				<label class="form-view-field-color-ivory"><input type="checkbox" value="" name="inputcolor*******" />アイボリー系</label>

				<label class="form-view-field-color-gold"><input type="checkbox" value="" name="inputcolor*******" />ゴールド系</label>

				<label class="form-view-field-color-silver"><input type="checkbox" value="" name="inputcolor*******" />シルバー系</label>

				<label class="form-view-field-color-red"><input type="checkbox" value="" name="inputcolor*******" />レッド系</label>

				<label class="form-view-field-color-blue"><input type="checkbox" value="" name="inputcolor*******" />ブルー系</label>

				<label class="form-view-field-color-green"><input type="checkbox" value="" name="inputcolor*******" />グリーン系</label>

				<label class="form-view-field-color-wine"><input type="checkbox" value="" name="inputcolor*******" />ワイン系</label>

				<label class="form-view-field-color-yellow"><input type="checkbox" value="" name="inputcolor*******" />イエロー系</label>

				<label class="form-view-field-color-orange"><input type="checkbox" value="" name="inputcolor*******" />オレンジ系</label>

				<label class="form-view-field-color-pink"><input type="checkbox" value="" name="inputcolor*******" />ピンク系</label>

				<label class="form-view-field-color-purple"><input type="checkbox" value="" name="inputcolor*******" />パープル系</label>

				<label class="form-view-field-color-other"><input type="checkbox" value="" name="inputcolor*******" />その他</label>

			</div>

		</div>

	</section>



#### [case:group-checkbox]



	<section class="form-view">

		<header class="form-view-header">

			<h1 class="form-view-label">label</h1>

		</header>



		<div class="form-view-item">

			<label class="form-view-item-label">label</label>

			<div class="form-view-group-checkbox">

				<label class="form-view-field-checkbox"><input type="checkbox" value="" name="input*******" />checkbox1</label>

				<label class="form-view-field-checkbox"><input type="checkbox" value="" name="input*******" />checkbox2</label>

				<label class="form-view-field-checkbox-multiline"><input type="checkbox" value="" name="input*******" />checkbox3<br />(multi line)</label>

				<label class="form-view-field-checkbox-multiline"><input type="checkbox" value="" name="input*******" />checkbox4<br />(multi line)</label>

				<label class="form-view-field-checkbox"><input type="checkbox" value="" name="input*******" />checkbox5</label>

			</div>

		</div>

	</section>



#### [case:group-minimal]



	<section class="form-view">

		<header class="form-view-header-blueline">

			<strong class="form-view-required">必須</strong>

			<h1 class="form-view-label">label</h1>

		</header>



		<div class="form-view-item">

			<div class="form-view-group-minimal">

				<dl>

					<dt>姓</dt>

					<dd><input type="text" class="textfield-minimal" placeholder="[全角] 例：松田" value="" name="input******" /></dd>

				</dl>

				<dl>

					<dt>名</dt>

					<dd><input type="text" class="textfield-minimal" placeholder="[全角] 例：太郎" value="" name="input******" /></dd>

				</dl>

			</div>

		</div>



		<div class="form-view-item">

			<div class="form-view-group-minimal-postalcode">

				<dl>

					<dt>〒</dt>

					<dd>

						<fieldset><input type="text" class="textfield-minimal" value="" name="input******" />-<input type="text" class="textfield-minimal" value="" name="input******" /><button type="button" class="btn">住所検索</button></fieldset>

						<button type="button" class="btn">郵便番号がご不明な方</button>

					</dd>

				</dl>

			</div>

		</div>



		<div class="form-view-item">

			<div class="form-view-group-minimal">

				<select name="input****">

					<option value="">都道府県</option>

				</select>

				<input type="text" class="textfield-minimal margin-5top" placeholder="市町村まで" value="" name="input******" />

				<input type="text" class="textfield-minimal" placeholder="番地まで" value="" name="input******" />

				<input type="text" class="textfield-minimal" placeholder="マンション名など" value="" name="input******" />

			</div>

		</div>



		<div class="form-view-item">

			<div class="form-view-group-minimal">

				<input type="text" class="textfield-minimal" placeholder="[半角] 例：demio@mazda.co.jp" value="" name="input******" />

			</div>

		</div>



		<div class="form-view-item">

			<div class="form-view-group-minimal-phone">

				<input type="text" class="textfield-minimal" value="" placeholder="[半角]" name="input******" />-<input type="text" class="textfield-minimal" value="" placeholder="[半角]" name="input******" />-<input type="text" class="textfield-minimal" value="" placeholder="[半角]" name="input******" />

			</div>

		</div>



		<div class="form-view-item">

			<div class="form-view-group-minimal-radio">

				<label><input type="radio" value="" name="radio*****" />受け取ります</label>

				<label><input type="radio" value="" name="radio*****" />受け取りません</label>

			</div>

			<div class="form-view-group-alert icon-bang-bf-red">

				<strong>アラート</strong>

			</div>

		</div>



	</section>



#### [case:group-agreement]



	<section class="form-view">



		<header class="form-view-header-blueline">

			<h1 class="form-view-label">label</h1>

		</header>



		<div class="form-view-item">

			<p class="padding-15top padding-10left padding-10right fontsize-12">テキストテキストテキストテキストテキストテキスト。</p>



			<section class="form-view-group-agreement">

				<h2>【見出し】</h2>

				<p>テキストテキストテキストテキストテキストテキストテキストテキスト。</p>



				<ol>

					<li>テキストテキストテキストテキストテキストテキストテキストテキスト。テキストテキストテキストテキストテキストテキストテキストテキスト。</li>

					<li>テキストテキストテキストテキストテキストテキストテキストテキスト。</li>

				</ol>



				<h2>【見出し】</h2>

				<p>テキストテキストテキストテキストテキストテキストテキストテキスト。</p>



				<ol>

					<li>テキストテキストテキストテキストテキストテキストテキストテキスト。テキストテキストテキストテキストテキストテキストテキストテキスト。</li>

					<li>テキストテキストテキストテキストテキストテキストテキストテキスト。</li>

				</ol>

			</section>



		</div>



	</section>



*/

/*

# ListView Class



リストのスタイルの抽象クラス



#### [Options]



 - `.list-view` 基本的なリストスタイル

 - `.list-view-heading` 見出しとしても使用されるリストスタイル（グラデーションが若干濃い）

 - `.list-view-black` リストビューのブラックバージョン

 - `.list-view-grey` リストビューのグレーバージョン

 - `.list-view-indented` リストアイテムをインデントしたスタイル（他のオプションと併用。`.list-view-item-heading` はインデントされない）



#### [Contents]



 - `.list-view-item` 内部に`<a>`要素を持つリストアイテム

 - `.list-view-item-block` 内部にコンテンツを持つリストアイテム

 - `.list-view-item-heading` リスト内の見出しとして使用されるリストアイテム

 - `.icon-btn-arrow-bf-{colorscheme}` ボタン用のアローアイコンと表示する

 - `.list-view-item-count` カウントを表示する

 - `.list-view-item-headinglink` リスト内見出し `.list-view-item-heading` 内にリンクを設置する場合に使用



*/

.list-view > ul, .list-view-heading > ul, .list-view-black > ul, .list-view-grey > ul {

  list-style: none;

}

.list-view .list-view-item, .list-view-heading .list-view-item, .list-view-black .list-view-item, .list-view-grey .list-view-item {

  width: 100%;

  text-align: left;

  line-height: 1.5;

  font-size: 14px;

}

.list-view .list-view-item a, .list-view-heading .list-view-item a, .list-view-black .list-view-item a, .list-view-grey .list-view-item a, .list-view .list-view-item label, .list-view-heading .list-view-item label, .list-view-black .list-view-item label, .list-view-grey .list-view-item label {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  position: relative;

  display: block;

  width: 100%;

  height: 100%;

  line-height: 1.5;

  vertical-align: middle;

  padding: 15px 30px 11px 12px;

  text-decoration: none;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  -o-user-select: none;

  user-select: none;

}

.list-view .list-view-item a [type="radio"], .list-view-heading .list-view-item a [type="radio"], .list-view-black .list-view-item a [type="radio"], .list-view-grey .list-view-item a [type="radio"], .list-view .list-view-item a [type="checkbox"], .list-view-heading .list-view-item a [type="checkbox"], .list-view-black .list-view-item a [type="checkbox"], .list-view-grey .list-view-item a [type="checkbox"], .list-view .list-view-item label [type="radio"], .list-view-heading .list-view-item label [type="radio"], .list-view-black .list-view-item label [type="radio"], .list-view-grey .list-view-item label [type="radio"], .list-view .list-view-item label [type="checkbox"], .list-view-heading .list-view-item label [type="checkbox"], .list-view-black .list-view-item label [type="checkbox"], .list-view-grey .list-view-item label [type="checkbox"] {

  display: inline-block;

  margin-top: -4px;

  margin-right: 5px;

  vertical-align: middle;

}

.list-view .list-view-item label, .list-view-heading .list-view-item label, .list-view-black .list-view-item label, .list-view-grey .list-view-item label {

  -webkit-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -moz-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -ms-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -o-tap-highlight-color: rgba(0, 160, 218, 0.7);

  tap-highlight-color: rgba(0, 160, 218, 0.7);

}

.list-view .list-view-item-block, .list-view-heading .list-view-item-block, .list-view-black .list-view-item-block, .list-view-grey .list-view-item-block {

  position: relative;

  padding: 15px 12px 13px 12px;

  line-height: 1.5;

}

.list-view .list-view-item-heading, .list-view-heading .list-view-item-heading, .list-view-black .list-view-item-heading, .list-view-grey .list-view-item-heading {

  position: relative;

  padding: 10px 12px 8px 12px;

  color: white;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #000000),color-stop(100%, #3B3B3B));

  background-image: -webkit-linear-gradient(top, #000000 0%,#3B3B3B 100%);

  background-image: -moz-linear-gradient(top, #000000 0%,#3B3B3B 100%);

  background-image: -ms-linear-gradient(top, #000000 0%,#3B3B3B 100%);

  background-image: -o-linear-gradient(top, #000000 0%,#3B3B3B 100%);

  background-image: linear-gradient(to bottom, #000000 0%,#3B3B3B 100%);

}

.list-view .list-view-item-count, .list-view-heading .list-view-item-count, .list-view-black .list-view-item-count, .list-view-grey .list-view-item-count, .list-view .list-view-item-headinglink, .list-view-heading .list-view-item-headinglink, .list-view-black .list-view-item-headinglink, .list-view-grey .list-view-item-headinglink {

  display: inline-block;

  position: absolute;

  top: 50%;

  right: 10px;

  height: 14px;

  margin-top: -7px;

  line-height: 14px;

  text-align: right;

  overflow: hidden;

  white-space: nowrap;

  -webkit-text-overflow: ellipsis;

  -moz-text-overflow: ellipsis;

  -ms-text-overflow: ellipsis;

  -o-text-overflow: ellipsis;

  text-overflow: ellipsis;

}

.list-view .list-view-item-headinglink, .list-view-heading .list-view-item-headinglink, .list-view-black .list-view-item-headinglink, .list-view-grey .list-view-item-headinglink {

  color: white;

  text-decoration: none;

}

.list-view [class*="icon-"] .list-view-item-count, .list-view-heading [class*="icon-"] .list-view-item-count, .list-view-black [class*="icon-"] .list-view-item-count, .list-view-grey [class*="icon-"] .list-view-item-count {

  right: 35px;

}

.list-view [class*="icon-"]:before, .list-view-heading [class*="icon-"]:before, .list-view-black [class*="icon-"]:before, .list-view-grey [class*="icon-"]:before {

  position: absolute;

  top: 50%;

  right: 5px;

  margin-top: -12px;

}

.list-view-indented.list-view .list-view-item a, .list-view-indented.list-view-heading .list-view-item a, .list-view-indented.list-view-black .list-view-item a, .list-view-indented.list-view-grey .list-view-item a, .list-view-indented.list-view .list-view-item label, .list-view-indented.list-view-heading .list-view-item label, .list-view-indented.list-view-black .list-view-item label, .list-view-indented.list-view-grey .list-view-item label, .list-view-indented.list-view .list-view-item-block, .list-view-indented.list-view-heading .list-view-item-block, .list-view-indented.list-view-black .list-view-item-block, .list-view-indented.list-view-grey .list-view-item-block {

  padding-left: 30px;

}



/*

## .list-view



基本的なリストのスタイル



	<nav class="list-view">

		<ul>

			<li class="list-view-item-heading">見出し</li>

			<li class="list-view-item"><a href="#">アイテム</a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

			<li class="list-view-item-block">

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

			</li>

			<li class="list-view-item-heading">見出し<a class="list-view-item-headinglink" href="#page-top">▲上へ戻る</a></li>

			<li class="list-view-item"><a href="#">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><label class="icon-btn-arrow-bf-blue"><input type="checkbox" value="" name="input++++++" />checkbox<span class="list-view-item-count">すべて(1234 台)</span></label></li>

		</ul>

	</nav>



#### [state:indented]



	<nav class="list-view list-view-indented">

		<ul>

			<li class="list-view-item-heading">見出し</li>

			<li class="list-view-item"><a href="#">アイテム</a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

			<li class="list-view-item-block">

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

			</li>

			<li class="list-view-item-heading">見出し<a class="list-view-item-headinglink" href="#page-top">▲上へ戻る</a></li>

			<li class="list-view-item"><a href="#">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><label class="icon-btn-arrow-bf-blue"><input type="checkbox" value="" name="input++++++" />checkbox<span class="list-view-item-count">すべて(1234 台)</span></label></li>

		</ul>

	</nav>

*/

.list-view .list-view-item a, .list-view .list-view-item label, .list-view .list-view-item-block, .list-view-heading .list-view-item .list-view a, .list-view-heading .list-view-item .list-view label, .list-view-black .list-view-item .list-view a, .list-view-black .list-view-item .list-view label, .list-view-grey .list-view-item .list-view a, .list-view-grey .list-view-item .list-view label {

  position: relative;

  color: black;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e5e5e5),color-stop(100%, #ffffff));

  background-image: -webkit-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -moz-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -ms-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -o-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: linear-gradient(to bottom, #e5e5e5 0%,#ffffff 100%);

  border-top: 1px solid #dddddd;

}

.list-view .list-view-item a:after, .list-view .list-view-item label:after, .list-view .list-view-item-block:after, .list-view-heading .list-view-item .list-view a:after, .list-view-heading .list-view-item .list-view label:after, .list-view-black .list-view-item .list-view a:after, .list-view-black .list-view-item .list-view label:after, .list-view-grey .list-view-item .list-view a:after, .list-view-grey .list-view-item .list-view label:after {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 1px;

  background: white;

}

.list-view .list-view-item:last-of-type {

  border-bottom: 1px solid #e4e4e4;

}

.list-view .list-view-item-block:last-of-type {

  border-bottom: 1px solid #e4e4e4;

}

.list-view .list-view-item-count {

  color: #212121;

}



/*

## .list-view-heading



見出しとしても使用されるリストスタイル（グラデーションが若干濃い）



	<nav class="list-view-heading">

		<ul>

			<li class="list-view-item-heading">見出し</li>

			<li class="list-view-item"><a href="#">アイテム</a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

			<li class="list-view-item-block">

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

			</li>

			<li class="list-view-item-heading">見出し<a class="list-view-item-headinglink" href="#page-top">▲上へ戻る</a></li>

			<li class="list-view-item"><a href="#">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><label class="icon-btn-arrow-bf-blue"><input type="checkbox" value="" name="input++++++" />checkbox<span class="list-view-item-count">すべて(1234 台)</span></label></li>

		</ul>

	</nav>



#### [state:indented]



	<nav class="list-view-heading list-view-indented">

		<ul>

			<li class="list-view-item-heading">見出し</li>

			<li class="list-view-item"><a href="#">アイテム</a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

			<li class="list-view-item-block">

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

			</li>

			<li class="list-view-item-heading">見出し<a class="list-view-item-headinglink" href="#page-top">▲上へ戻る</a></li>

			<li class="list-view-item"><a href="#">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><label class="icon-btn-arrow-bf-blue"><input type="checkbox" value="" name="input++++++" />checkbox<span class="list-view-item-count">すべて(1234 台)</span></label></li>

		</ul>

	</nav>

*/

.list-view .list-view-item .list-view-heading a, .list-view .list-view-item .list-view-heading label, .list-view-heading .list-view-item a, .list-view-heading .list-view-item label, .list-view-heading .list-view-item-block, .list-view-black .list-view-item .list-view-heading a, .list-view-black .list-view-item .list-view-heading label, .list-view-grey .list-view-item .list-view-heading a, .list-view-grey .list-view-item .list-view-heading label {

  position: relative;

  color: black;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #C5C5C5),color-stop(100%, #EEEEEE));

  background-image: -webkit-linear-gradient(top, #C5C5C5 0%,#EEEEEE 100%);

  background-image: -moz-linear-gradient(top, #C5C5C5 0%,#EEEEEE 100%);

  background-image: -ms-linear-gradient(top, #C5C5C5 0%,#EEEEEE 100%);

  background-image: -o-linear-gradient(top, #C5C5C5 0%,#EEEEEE 100%);

  background-image: linear-gradient(to bottom, #C5C5C5 0%,#EEEEEE 100%);

  border-top: 1px solid #e4e4e4;

  border-bottom: 1px solid white;

}

.list-view .list-view-item .list-view-heading a:after, .list-view .list-view-item .list-view-heading label:after, .list-view-heading .list-view-item a:after, .list-view-heading .list-view-item label:after, .list-view-heading .list-view-item-block:after, .list-view-black .list-view-item .list-view-heading a:after, .list-view-black .list-view-item .list-view-heading label:after, .list-view-grey .list-view-item .list-view-heading a:after, .list-view-grey .list-view-item .list-view-heading label:after {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 1px;

  background: white;

}

.list-view .list-view-item .list-view-heading a:first-of-type, .list-view .list-view-item .list-view-heading label:first-of-type, .list-view-heading .list-view-item a:first-of-type, .list-view-heading .list-view-item label:first-of-type, .list-view-heading .list-view-item-block:first-of-type, .list-view-black .list-view-item .list-view-heading a:first-of-type, .list-view-black .list-view-item .list-view-heading label:first-of-type, .list-view-grey .list-view-item .list-view-heading a:first-of-type, .list-view-grey .list-view-item .list-view-heading label:first-of-type {

  border-top: 0;

}

.list-view-heading .list-view-item-count {

  color: #212121;

}



/*

## .list-view-black



リストビューのブラックバージョン



	<nav class="list-view-black">

		<ul>

			<li class="list-view-item-heading">見出し</li>

			<li class="list-view-item"><a href="#">アイテム</a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-litegrey">アイテム</a></li>

			<li class="list-view-item-block">

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

			</li>

			<li class="list-view-item-heading">見出し<a class="list-view-item-headinglink" href="#page-top">▲上へ戻る</a></li>

			<li class="list-view-item"><a href="#">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-litegrey">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><label class="icon-btn-arrow-bf-litegrey"><input type="checkbox" value="" name="input++++++" />checkbox<span class="list-view-item-count">すべて(1234 台)</span></label></li>

		</ul>

	</nav>



#### [state:indented]



	<nav class="list-view-black list-view-indented">

		<ul>

			<li class="list-view-item-heading">見出し</li>

			<li class="list-view-item"><a href="#">アイテム</a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

			<li class="list-view-item-block">

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

			</li>

			<li class="list-view-item-heading">見出し<a class="list-view-item-headinglink" href="#page-top">▲上へ戻る</a></li>

			<li class="list-view-item"><a href="#">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><label class="icon-btn-arrow-bf-litegrey"><input type="checkbox" value="" name="input++++++" />checkbox<span class="list-view-item-count">すべて(1234 台)</span></label></li>

		</ul>

	</nav>

*/

.list-view .list-view-item .list-view-black a, .list-view .list-view-item .list-view-black label, .list-view-heading .list-view-item .list-view-black a, .list-view-heading .list-view-item .list-view-black label, .list-view-black .list-view-item a, .list-view-black .list-view-item label, .list-view-black .list-view-item-block, .list-view-grey .list-view-item .list-view-black a, .list-view-grey .list-view-item .list-view-black label {

  color: #b1b1b1;

  background: black;

  border-top: 1px solid #b1b1b1;

}

.list-view-black .list-view-item:first-of-type, .list-view-black list-view-item-block:first-of-type {

  border-top: 0;

}

.list-view-black .list-view-item:first-of-type a, .list-view-black .list-view-item:first-of-type label {

  border-top: 0;

}

.list-view-black .list-view-item-block:first-of-type {

  border-top: 0;

}

.list-view-black .list-view-item-count {

  color: white;

}



/*

## .list-view-grey



リストビューのグレーバージョン



	<nav class="list-view-grey">

		<ul>

			<li class="list-view-item-heading">見出し</li>

			<li class="list-view-item"><a href="#">アイテム</a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

			<li class="list-view-item-block">

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

			</li>

			<li class="list-view-item-heading">見出し<a class="list-view-item-headinglink" href="#page-top">▲上へ戻る</a></li>

			<li class="list-view-item"><a href="#">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><label class="icon-btn-arrow-bf-blue"><input type="checkbox" value="" name="input++++++" />checkbox<span class="list-view-item-count">すべて(1234 台)</span></label></li>

		</ul>

	</nav>



#### [state:indented]



	<nav class="list-view-grey list-view-indented">

		<ul>

			<li class="list-view-item-heading">見出し</li>

			<li class="list-view-item"><a href="#">アイテム</a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

			<li class="list-view-item-block">

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

			</li>

			<li class="list-view-item-heading">見出し<a class="list-view-item-headinglink" href="#page-top">▲上へ戻る</a></li>

			<li class="list-view-item"><a href="#">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム<span class="list-view-item-count">189 台</span></a></li>

			<li class="list-view-item"><label class="icon-btn-arrow-bf-blue"><input type="checkbox" value="" name="input++++++" />checkbox<span class="list-view-item-count">すべて(1234 台)</span></label></li>

		</ul>

	</nav>

*/

.list-view .list-view-item .list-view-grey a, .list-view .list-view-item .list-view-grey label, .list-view-heading .list-view-item .list-view-grey a, .list-view-heading .list-view-item .list-view-grey label, .list-view-black .list-view-item .list-view-grey a, .list-view-black .list-view-item .list-view-grey label, .list-view-grey .list-view-item a, .list-view-grey .list-view-item label, .list-view-grey .list-view-item-block {

  color: #b1b1b1;

  background: #4a4a4a;

  border-top: 1px solid #787878;

}

.list-view-grey .list-view-item:first-of-type, .list-view-grey list-view-item-block:first-of-type {

  border-top: 0;

}

.list-view-grey .list-view-item:first-of-type a, .list-view-grey .list-view-item:first-of-type label {

  border-top: 0;

}

.list-view-grey .list-view-item-block:first-of-type {

  border-top: 0;

}

.list-view-grey .list-view-item-count {

  color: white;

}



/*

# InlineMenu Class



インラインメニュの抽象クラス



#### [Options]



 - `.inline-menu` 基本的なインラインメニュのスタイル

 - `.inline-menu-black` インラインメニュのブラックバージョン

 - `.inline-menu-tab` インラインメニュのタブスタイルバージョン

 - `.inline-menu-has4item` 内部に4つ以上のメニュを保つ場合のオプションクラス（どれかのオプションと併用）

 - `.inline-menu-has5item` 内部に5つ以上のメニュを保つ場合のオプションクラス（どれかのオプションと併用）

 - `.inline-menu-overflow-ellipsis` 文字数が多い場合に省略記号を用いて短縮する（どれかのオプションと併用）

 - `.inline-menu-followed-scrolling` スクロール追従時のスタイル（他のオプションと併用）



#### [Contents]



 - `.inline-menu-item` 内部に`<a>`要素を持つリストアイテム



*/

.inline-menu, .inline-menu-black, .inline-menu-tab {

  display: -webkit-box;

  display: -moz-box;

  display: -ms-box;

  display: -o-box;

  display: box;

  overflow: hidden;

  width: 100%;

}

.inline-menu [class^="inline-menu-item"], .inline-menu-black [class^="inline-menu-item"], .inline-menu-tab [class^="inline-menu-item"] {

  -webkit-box-flex: 1;

  -moz-box-flex: 1;

  -ms-box-flex: 1;

  -o-box-flex: 1;

  box-flex: 1;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  width: 33%;

  padding: 15px 5px 11px 5px;

  text-align: center;

  vertical-align: middle;

  line-height: 1.5;

  font-size: 14px;

}

.inline-menu a[class^="inline-menu-item"], .inline-menu-black a[class^="inline-menu-item"], .inline-menu-tab a[class^="inline-menu-item"] {

  text-decoration: none;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  -o-user-select: none;

  user-select: none;

}

.inline-menu [class*="icon-"], .inline-menu-black [class*="icon-"], .inline-menu-tab [class*="icon-"] {

  position: relative;

}

.inline-menu [class*="icon-"]:before, .inline-menu-black [class*="icon-"]:before, .inline-menu-tab [class*="icon-"]:before {

  display: inline-block;

  margin-right: 5px;

  margin-top: -3px;

  vertical-align: middle;

  font-size: 25px;

}

.inline-menu-has4item.inline-menu [class^="inline-menu-item"], .inline-menu-has4item.inline-menu-black [class^="inline-menu-item"], .inline-menu-has4item.inline-menu-tab [class^="inline-menu-item"] {

  width: 25%;

}

.inline-menu-has5item.inline-menu [class^="inline-menu-item"], .inline-menu-has5item.inline-menu-black [class^="inline-menu-item"], .inline-menu-has5item.inline-menu-tab [class^="inline-menu-item"] {

  width: 20%;

}

.inline-menu-overflow-ellipsis.inline-menu [class^="inline-menu-item"], .inline-menu-overflow-ellipsis.inline-menu-black [class^="inline-menu-item"], .inline-menu-overflow-ellipsis.inline-menu-tab [class^="inline-menu-item"] {

  display: block;

  overflow: hidden;

  white-space: nowrap;

  -webkit-text-overflow: ellipsis;

  -moz-text-overflow: ellipsis;

  -ms-text-overflow: ellipsis;

  -o-text-overflow: ellipsis;

  text-overflow: ellipsis;

}

.inline-menu:not(.inline-menu-overflow-ellipsis) [class^="inline-menu-item"], .inline-menu-black:not(.inline-menu-overflow-ellipsis) [class^="inline-menu-item"], .inline-menu-tab:not(.inline-menu-overflow-ellipsis) [class^="inline-menu-item"] {

  display: table-cell;

  word-break: break-all;

  word-wrap: break-word;

}

.inline-menu-followed-scrolling.inline-menu, .inline-menu-followed-scrolling.inline-menu-black, .inline-menu-followed-scrolling.inline-menu-tab {

  position: fixed;

  z-index: 10;

  top: 0;

  left: 0;

  width: 100%;

}



/*

## .inline-menu



基本的なインラインメニュのスタイル



	<nav class="inline-menu">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

	</nav>



#### .inline-menu-has4item オプション



	<nav class="inline-menu inline-menu-has4item">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

	</nav>



#### .inline-menu-has5item オプション



	<nav class="inline-menu inline-menu-has5item">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

	</nav>



#### .inline-menu-overflow-ellipsis オプション



	<nav class="inline-menu inline-menu-overflow-ellipsis">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">長いアイテム名長いアイテム名長いアイテム名長いアイテム名長いアイテム名</a>

	</nav>

*/

.inline-menu [class^="inline-menu-item"] {

  color: black;

  border-top: 1px solid #e4e4e4;

  border-right: 1px solid #e4e4e4;

  border-left: 1px solid white;

}

.inline-menu [class^="inline-menu-item"]:first-of-type {

  border-left: 0;

}

.inline-menu [class^="inline-menu-item"]:last-of-type {

  border-right: 0;

}

.inline-menu a[class^="inline-menu-item"] {

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #e5e5e5),color-stop(100%, #ffffff));

  background-image: -webkit-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -moz-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -ms-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: -o-linear-gradient(top, #e5e5e5 0%,#ffffff 100%);

  background-image: linear-gradient(to bottom, #e5e5e5 0%,#ffffff 100%);

}

.inline-menu a[class^="inline-menu-item"]:after {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 1px;

  background: white;

}

.inline-menu [class*="icon-"]:before {

  color: #008bd1;

}



/*

## .inline-menu-black



インラインメニュのブラックバージョン



	<nav class="inline-menu-black">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

	</nav>



#### .inline-menu-has4item オプション



	<nav class="inline-menu-black inline-menu-has4item">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

	</nav>



#### .inline-menu-has5item オプション



	<nav class="inline-menu-black inline-menu-has5item">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

	</nav>



#### .inline-menu-overflow-ellipsis オプション



	<nav class="inline-menu-black inline-menu-overflow-ellipsis">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">長いアイテム名長いアイテム名長いアイテム名長いアイテム名長いアイテム名</a>

	</nav>

*/

.inline-menu-black [class^="inline-menu-item"] {

  color: #b1b1b1;

  background: #212121;

  border-top: 1px solid #424242;

  border-right: 1px solid #424242;

  border-bottom: 1px solid #424242;

}

.inline-menu-black [class^="inline-menu-item"]:last-of-type {

  border-right: 0;

}

.inline-menu-black [class*="icon-"]:before {

  color: white;

}



/*

## .inline-menu-tab



インラインメニュのタブスタイルバージョン



#### [Contents Option]



- `.inline-menu-item-wide` アイテムの幅を広げるオプション（`.inline-menu-tab` 独自オプション）

- `.inline-menu-item-pressed` アイテムがアクティブの状態のオプション（`.inline-menu-tab` 独自オプション）





	<nav class="inline-menu-tab">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

	</nav>



#### .inline-menu-has4item オプション



	<nav class="inline-menu-tab inline-menu-has4item">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

	</nav>



#### .inline-menu-has5item オプション



	<nav class="inline-menu-tab inline-menu-has5item">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

	</nav>



#### .inline-menu-overflow-ellipsis オプション



	<nav class="inline-menu-tab inline-menu-overflow-ellipsis">

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">アイテム</a>

		<a class="inline-menu-item" href="#">長いアイテム名長いアイテム名長いアイテム名長いアイテム名長いアイテム名</a>

	</nav>



#### .inline-menu-tab 独自オプション使用時



	<nav class="inline-menu-tab inline-menu-overflow-ellipsis">

		<a class="inline-menu-item" href="#">ア</a>

		<a class="inline-menu-item" href="#">カ</a>

		<a class="inline-menu-item" href="#">サ</a>

		<a class="inline-menu-item" href="#">タ</a>

		<a class="inline-menu-item" href="#">ナ</a>

		<a class="inline-menu-item" href="#">ハ</a>

		<a class="inline-menu-item" href="#">マ</a>

		<a class="inline-menu-item-pressed" href="#">ヤ</a>

		<a class="inline-menu-item" href="#">ラ</a>

		<a class="inline-menu-item" href="#">ワ</a>

		<a class="inline-menu-item-wide" href="#">英数</a>

	</nav>

*/

.inline-menu-tab [class^="inline-menu-item"] {

  padding-left: 2px;

  padding-right: 2px;

  color: white;

  border-right: 1px solid black;

  border-left: 1px solid #444444;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #787878),color-stop(1%, #787878),color-stop(2%, #3B3B3B),color-stop(10%, #3B3B3B),color-stop(100%, #000000));

  background-image: -webkit-linear-gradient(top, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: -moz-linear-gradient(top, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: -ms-linear-gradient(top, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: -o-linear-gradient(top, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: linear-gradient(to bottom, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

}

.inline-menu-tab [class^="inline-menu-item"]:first-of-type {

  border-left: 0;

}

.inline-menu-tab [class^="inline-menu-item"]:last-of-type {

  border-right: 0;

}

.inline-menu-tab [class^="inline-menu-item-wide"] {

  -webkit-box-flex: 0;

  -moz-box-flex: 0;

  -ms-box-flex: 0;

  -o-box-flex: 0;

  box-flex: 0;

  width: 15%;

}

.inline-menu-tab .inline-menu-item-pressed,

.inline-menu-tab .inline-menu-item-wide-pressed {

  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #787878),color-stop(1%, #787878),color-stop(2%, #3B3B3B),color-stop(10%, #3B3B3B),color-stop(100%, #000000));

  background-image: -webkit-linear-gradient(bottom, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: -moz-linear-gradient(bottom, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: -ms-linear-gradient(bottom, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: -o-linear-gradient(bottom, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

  background-image: linear-gradient(to top, #787878 0%,#787878 1%,#3B3B3B 2%,#3B3B3B 10%,#000000 100%);

}

.inline-menu-tab [class*="icon-"]:before {

  color: white;

}



/*

# CarlistItem Class



物件アイテムスタイルの抽象クラス



#### [Use]



- `Icon Class`

- `Btn Class`



#### [Options]



- `.carlist-item` 基本的な物件アイテムのスタイル

- `.carlist-item-blueline` 基本的な物件アイテムのブルーラインがついたバージョン

- `.carlist-item-noline` 基本的な物件アイテムのラインのないバージョン

- `.carlist-item-checkable` 基本的な物件アイテムのチェックボックスが含まれるバージョン



#### [Contents]



- `.carlist-item-container` 内容を包みここみリンク

- `.carlist-item-header` 物件のヘッダー

- `.carlist-item-brandname` 会社名

- `.carlist-item-name` 車種名

- `.carlist-item-data` データ部分のラッパー

- `.carlist-item-thumb` クルマのサムネイルのラッパー

- `.carlist-item-thumb-new` クルマのサムネイルのラッパー（NEW 表示付き）

- `.carlist-item-spec` スペック用のテーブルのラッパー

- `.carlist-item-spec-box` スペック表示用のボックス

- `.carlist-item-spec-shopname` スペックテーブル内の店舗名

- `.carlist-item-footer` 物件のフッター

- `.carlist-item-remarks` 備考欄

- `.carlist-item-mark-certified` マツダ認定U-Car マーク

- `.carlist-item-mark-guaranteed` 保証付マーク

- `.carlist-item-mark-skyactive` スカイアクティブマーク

- `.carlist-item-btngroup` ボタンのラッパー

- `.carlist-item-field-check` チェックボックスを含むパーツ

- `.btn-favorite-register` お気に入りリスト登録ボタン

- `.btn-estimate` お問合わせ・お見積りボタン



*/

.carlist-item, .carlist-item-blueline, .carlist-item-noline, .carlist-item-checkable {

  border-top: 1px solid white;

}

.carlist-item .carlist-item-container, .carlist-item-blueline .carlist-item-container, .carlist-item-noline .carlist-item-container, .carlist-item-checkable .carlist-item-container {

  display: block;

  width: 100%;

  text-decoration: none;

  color: black;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

}

.carlist-item .carlist-item-container:after, .carlist-item-blueline .carlist-item-container:after, .carlist-item-noline .carlist-item-container:after, .carlist-item-checkable .carlist-item-container:after {

  content: "";

  display: block;

  visibility: hidden;

  clear: both;

  height: 0;

}

.carlist-item .carlist-item-field-check, .carlist-item-blueline .carlist-item-field-check, .carlist-item-noline .carlist-item-field-check, .carlist-item-checkable .carlist-item-field-check {

  position: relative;

  text-align: right;

  margin-bottom: -5px;

  padding: 5px 10px 0;

}

.carlist-item .carlist-item-field-check:before, .carlist-item-blueline .carlist-item-field-check:before, .carlist-item-noline .carlist-item-field-check:before, .carlist-item-checkable .carlist-item-field-check:before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

  width: 100%;

  height: 44px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #CCCCCC),color-stop(100%, #FFFFFF));

  background-image: -webkit-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -moz-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -ms-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -o-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: linear-gradient(to bottom, #CCCCCC 0%,#FFFFFF 100%);

}

.carlist-item .carlist-item-field-check [type="checkbox"], .carlist-item-blueline .carlist-item-field-check [type="checkbox"], .carlist-item-noline .carlist-item-field-check [type="checkbox"], .carlist-item-checkable .carlist-item-field-check [type="checkbox"], .carlist-item .carlist-item-field-check [type="radio"], .carlist-item-blueline .carlist-item-field-check [type="radio"], .carlist-item-noline .carlist-item-field-check [type="radio"], .carlist-item-checkable .carlist-item-field-check [type="radio"] {

  position: absolute;

  z-index: 5;

  width: 15px;

  height: 15px;

  top: 50%;

  left: 10px;

  margin-top: -7px;

  -webkit-transform-origin: 0 50%;

  -moz-transform-origin: 0 50%;

  -ms-transform-origin: 0 50%;

  -o-transform-origin: 0 50%;

  transform-origin: 0 50%;

  -webkit-transform: scale(1.3, 1.3);

  -moz-transform: scale(1.3, 1.3);

  -ms-transform: scale(1.3, 1.3);

  -o-transform: scale(1.3, 1.3);

  transform: scale(1.3, 1.3);

}

.carlist-item .carlist-item-field-check [class^="btn"], .carlist-item-blueline .carlist-item-field-check [class^="btn"], .carlist-item-noline .carlist-item-field-check [class^="btn"], .carlist-item-checkable .carlist-item-field-check [class^="btn"] {

  display: inline-block;

  position: relative;

  z-index: 5;

  width: 80px;

  padding: 7px 10px;

  text-align: center;

}

.carlist-item .carlist-item-header, .carlist-item-blueline .carlist-item-header, .carlist-item-noline .carlist-item-header, .carlist-item-checkable .carlist-item-header {

  display: table;

  position: relative;

  width: 100%;

  padding: 10px 0;

}

.carlist-item .carlist-item-header[class*="icon-"]:after, .carlist-item-blueline .carlist-item-header[class*="icon-"]:after, .carlist-item-noline .carlist-item-header[class*="icon-"]:after, .carlist-item-checkable .carlist-item-header[class*="icon-"]:after {

  content: "";

  display: table-cell;

  right: 0;

  width: 13px;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #008BD1),color-stop(100%, #00B6E5));

  background-image: -webkit-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: -moz-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: -ms-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: -o-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: linear-gradient(to bottom, #008BD1 0%,#00B6E5 100%);

}

.carlist-item .carlist-item-header[class*="icon-"]:before, .carlist-item-blueline .carlist-item-header[class*="icon-"]:before, .carlist-item-noline .carlist-item-header[class*="icon-"]:before, .carlist-item-checkable .carlist-item-header[class*="icon-"]:before {

  position: absolute;

  right: 4px;

  top: 50%;

  margin: -12px 0 0 0;

}

.carlist-item .carlist-item-brandname, .carlist-item-blueline .carlist-item-brandname, .carlist-item-noline .carlist-item-brandname, .carlist-item-checkable .carlist-item-brandname {

  display: table-cell;

  width: 75px;

  vertical-align: middle;

  line-height: 1.2;

  text-align: center;

  color: white;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

  background-color: #000;

}

.carlist-item .carlist-item-name, .carlist-item-blueline .carlist-item-name, .carlist-item-noline .carlist-item-name, .carlist-item-checkable .carlist-item-name {

  display: table-cell;

  height: 2.3em;

  padding: 5px;

  vertical-align: top;

  line-height: 1.2;

  font-weight: normal;

}

.carlist-item .carlist-item-data, .carlist-item-blueline .carlist-item-data, .carlist-item-noline .carlist-item-data, .carlist-item-checkable .carlist-item-data {

  display: table;

  position: relative;

  width: 100%;

  padding: 0;

}

.carlist-item [class^="carlist-item-thumb"], .carlist-item-blueline [class^="carlist-item-thumb"], .carlist-item-noline [class^="carlist-item-thumb"], .carlist-item-checkable [class^="carlist-item-thumb"] {

  display: table-cell;

  width: 120px;

  padding-right: 5px;

}

.carlist-item [class^="carlist-item-thumb"] img, .carlist-item-blueline [class^="carlist-item-thumb"] img, .carlist-item-noline [class^="carlist-item-thumb"] img, .carlist-item-checkable [class^="carlist-item-thumb"] img {

  width: 120px;

  height: auto;

}

.carlist-item .carlist-item-thumb-new:after, .carlist-item-blueline .carlist-item-thumb-new:after, .carlist-item-noline .carlist-item-thumb-new:after, .carlist-item-checkable .carlist-item-thumb-new:after {

  content: "NEW";

  display: block;

  position: absolute;

  top: 0;

  left: 10px;

  padding: 3px;

  color: white;

  background: #e20000;

  font-size: 12px;

}

.carlist-item .carlist-item-spec, .carlist-item-blueline .carlist-item-spec, .carlist-item-noline .carlist-item-spec, .carlist-item-checkable .carlist-item-spec {

  display: table-cell;

  vertical-align: top;

}

.carlist-item .carlist-item-spec table, .carlist-item-blueline .carlist-item-spec table, .carlist-item-noline .carlist-item-spec table, .carlist-item-checkable .carlist-item-spec table {

  width: 100%;

  border-collapse: collapse;

  border: 1px solid #b1b1b1;

}

.carlist-item .carlist-item-spec th, .carlist-item-blueline .carlist-item-spec th, .carlist-item-noline .carlist-item-spec th, .carlist-item-checkable .carlist-item-spec th, .carlist-item .carlist-item-spec td, .carlist-item-blueline .carlist-item-spec td, .carlist-item-noline .carlist-item-spec td, .carlist-item-checkable .carlist-item-spec td {

  padding: 2px 2px;

  font-weight: normal;

  font-size: 9.6px;

  border-bottom: 1px solid #b1b1b1;

}

.carlist-item .carlist-item-spec th, .carlist-item-blueline .carlist-item-spec th, .carlist-item-noline .carlist-item-spec th, .carlist-item-checkable .carlist-item-spec th {

  // width: 2.2em;
  width: 4.5em;

  text-align: left;

  background: #eeeeee;

  border-left: 1px solid #b1b1b1;

}

.carlist-item .carlist-item-spec td, .carlist-item-blueline .carlist-item-spec td, .carlist-item-noline .carlist-item-spec td, .carlist-item-checkable .carlist-item-spec td {

  text-align: right;

}

.carlist-item .carlist-item-spec td b, .carlist-item-blueline .carlist-item-spec td b, .carlist-item-noline .carlist-item-spec td b, .carlist-item-checkable .carlist-item-spec td b {

  font-size: 12.6px;

  font-weight: normal;

}

.carlist-item .carlist-item-spec td strong, .carlist-item-blueline .carlist-item-spec td strong, .carlist-item-noline .carlist-item-spec td strong, .carlist-item-checkable .carlist-item-spec td strong {

  color: #be0000;

  font-size: 12.6px;

  font-weight: normal;

}

.carlist-item .carlist-item-spec .carlist-item-spec-shopname, .carlist-item-blueline .carlist-item-spec .carlist-item-spec-shopname, .carlist-item-noline .carlist-item-spec .carlist-item-spec-shopname, .carlist-item-checkable .carlist-item-spec .carlist-item-spec-shopname {

  padding: 2px;

  text-align: left;

  line-height: 1.2;

  font-size: 12px;

}

.carlist-item .carlist-item-spec .carlist-item-spec-box, .carlist-item-blueline .carlist-item-spec .carlist-item-spec-box, .carlist-item-noline .carlist-item-spec .carlist-item-spec-box, .carlist-item-checkable .carlist-item-spec .carlist-item-spec-box {

  padding: 3px 8px 8px;

  background: #eeeeee;

}

.carlist-item .carlist-item-spec .carlist-item-spec-box > p, .carlist-item-blueline .carlist-item-spec .carlist-item-spec-box > p, .carlist-item-noline .carlist-item-spec .carlist-item-spec-box > p, .carlist-item-checkable .carlist-item-spec .carlist-item-spec-box > p {

  padding-top: 5px;

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

}

.carlist-item .carlist-item-footer, .carlist-item-blueline .carlist-item-footer, .carlist-item-noline .carlist-item-footer, .carlist-item-checkable .carlist-item-footer {

  display: table;

  width: 100%;

  padding: 5px 10px 15px;

}

.carlist-item .carlist-item-remarks, .carlist-item-blueline .carlist-item-remarks, .carlist-item-noline .carlist-item-remarks, .carlist-item-checkable .carlist-item-remarks {

  display: table-cell;

  width: 120px;

  padding-right: 5px;

  vertical-align: top;

}

.carlist-item .carlist-item-access-count, .carlist-item-blueline .carlist-item-access-count, .carlist-item-noline .carlist-item-access-count, .carlist-item-checkable .carlist-item-access-count {

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

}

.carlist-item .carlist-item-access-count strong, .carlist-item-blueline .carlist-item-access-count strong, .carlist-item-noline .carlist-item-access-count strong, .carlist-item-checkable .carlist-item-access-count strong {

  color: #be0000;

  font-size: 12.6px;

  font-weight: normal;

}

.carlist-item [class^="carlist-item-mark-"] + .carlist-item-access-count, .carlist-item-blueline [class^="carlist-item-mark-"] + .carlist-item-access-count, .carlist-item-noline [class^="carlist-item-mark-"] + .carlist-item-access-count, .carlist-item-checkable [class^="carlist-item-mark-"] + .carlist-item-access-count {

  padding-top: 5px;

}

.carlist-item [class^="carlist-item-mark-"], .carlist-item-blueline [class^="carlist-item-mark-"], .carlist-item-noline [class^="carlist-item-mark-"], .carlist-item-checkable [class^="carlist-item-mark-"] {

  overflow: hidden;

  width: 120px;

  height: 20px;

  margin-top: 5px;

  color: transparent;

  background-image: url(data:image/png;base64,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);

  -webkit-background-size: cover;

  -moz-background-size: cover;

  -ms-background-size: cover;

  -o-background-size: cover;

  background-size: cover;

}

.carlist-item [class^="carlist-item-mark-"]:first-of-type, .carlist-item-blueline [class^="carlist-item-mark-"]:first-of-type, .carlist-item-noline [class^="carlist-item-mark-"]:first-of-type, .carlist-item-checkable [class^="carlist-item-mark-"]:first-of-type {

  margin-top: 0;

}

.carlist-item .carlist-item-mark-certified, .carlist-item-blueline .carlist-item-mark-certified, .carlist-item-noline .carlist-item-mark-certified, .carlist-item-checkable .carlist-item-mark-certified {

  background-position: 0 0;

}

.carlist-item .carlist-item-mark-guaranteed, .carlist-item-blueline .carlist-item-mark-guaranteed, .carlist-item-noline .carlist-item-mark-guaranteed, .carlist-item-checkable .carlist-item-mark-guaranteed {

  background-position: 0 -20px;

}

.carlist-item .carlist-item-mark-skyactive, .carlist-item-blueline .carlist-item-mark-skyactive, .carlist-item-noline .carlist-item-mark-skyactive, .carlist-item-checkable .carlist-item-mark-skyactive {

  background-position: 0 0;

  background-image: url(data:image/png;base64,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);

}

.carlist-item .carlist-item-btngroup, .carlist-item-blueline .carlist-item-btngroup, .carlist-item-noline .carlist-item-btngroup, .carlist-item-checkable .carlist-item-btngroup {

  display: table-cell;

  width: 100%;

  vertical-align: top;

}

.carlist-item .carlist-item-btngroup [class*="btn-"], .carlist-item-blueline .carlist-item-btngroup [class*="btn-"], .carlist-item-noline .carlist-item-btngroup [class*="btn-"], .carlist-item-checkable .carlist-item-btngroup [class*="btn-"] {

  margin-top: 5px;

  font-size: 11.9px;

}

.carlist-item .carlist-item-btngroup [class*="btn-"]:first-of-type, .carlist-item-blueline .carlist-item-btngroup [class*="btn-"]:first-of-type, .carlist-item-noline .carlist-item-btngroup [class*="btn-"]:first-of-type, .carlist-item-checkable .carlist-item-btngroup [class*="btn-"]:first-of-type {

  margin-top: 0;

}

.carlist-item .carlist-item-btngroup .btn-favorite-register, .carlist-item-blueline .carlist-item-btngroup .btn-favorite-register, .carlist-item-noline .carlist-item-btngroup .btn-favorite-register, .carlist-item-checkable .carlist-item-btngroup .btn-favorite-register {

  letter-spacing: -0.05em;

  padding-right: 0px;

}



/*

## .carlist-item



基本的な物件アイテムのスタイル





	<article class="carlist-item">

		<a class="carlist-item-container" href="#">

			<header class="carlist-item-header icon-btn-arrow-bf-white">

				<p class="carlist-item-brandname">ブランド名</p>

				<h1 class="carlist-item-name">車種名</h1>

			</header>



			<div class="carlist-item-data">

				<figure class="carlist-item-thumb"><img src="{サムネイル画像パス}" width="240" height="180" alt="車種名" /></figure>

				<div class="carlist-item-spec">

					<table>

						<tbody>

							<tr>

								<th scope="row">本体</th>

								<td><strong>99.9</strong>万円</td>

								<th scope="row">総額</th>

								<td><b>99.9</b>万円</td>

							</tr>

							<tr>

								<th scope="row">年式</th>

								<td><b>9999</b>年</td>

								<th scope="row">走行</th>

								<td><b>0.9万</b>km</td>

							</tr>

							<tr>

								<th scope="row">車検</th>

								<td><b>'99.09</b></td>

								<th scope="row">修復</th>

								<td><b>なし</b></td>

							</tr>

							<tr>

								<th scope="row">店舗</th>

								<td colspan="3">

									<p class="carlist-item-spec-shopname">取り扱い店舗名</p>

								</td>

							</tr>

						</tbody>

					</table>

				</div>

			</div>

		</a>



		<footer class="carlist-item-footer">

			<div class="carlist-item-remarks">

				<p class="carlist-item-mark-certified">マツダ認定U-Car</p>

				<p class="carlist-item-mark-guaranteed">保証付</p>

				<p class="carlist-item-access-count">アクセス数 999 回<br />現在 <strong>99</strong> 人が検討中</p>

			</div>



			<fieldset class="carlist-item-btngroup">

				<a class="btn-favorite-register icon-star-bf-white icon-star-af-black" href="#">お気に入りリストに登録</a>

				<a class="btn-estimate icon-calculator-bf-white icon-calculator-af-black" href="#">お問合せ・お見積り</a>

			</fieldset>

		</footer>

	</article>



*/

/*

## .carlist-item-blueline



基本的な物件アイテムのブルーラインがついたバージョン





	<article class="carlist-item-blueline">

		<a class="carlist-item-container" href="#">

			<header class="carlist-item-header icon-btn-arrow-bf-white">

				<p class="carlist-item-brandname">ブランド名</p>

				<h1 class="carlist-item-name">車種名</h1>

			</header>



			<div class="carlist-item-data">

				<figure class="carlist-item-thumb"><img src="{サムネイル画像パス}" width="240" height="180" alt="車種名" /></figure>

				<div class="carlist-item-spec">

					<table>

						<tbody>

							<tr>

								<th scope="row">本体</th>

								<td><strong>99.9</strong>万円</td>

								<th scope="row">総額</th>

								<td><b>99.9</b>万円</td>

							</tr>

							<tr>

								<th scope="row">年式</th>

								<td><b>9999</b>年</td>

								<th scope="row">走行</th>

								<td><b>0.9万</b>km</td>

							</tr>

							<tr>

								<th scope="row">車検</th>

								<td><b>'99.09</b></td>

								<th scope="row">修復</th>

								<td><b>なし</b></td>

							</tr>

							<tr>

								<th scope="row">店舗</th>

								<td colspan="3">

									<p class="carlist-item-spec-shopname">取り扱い店舗名</p>

								</td>

							</tr>

						</tbody>

					</table>

				</div>

			</div>

		</a>



		<footer class="carlist-item-footer">

			<div class="carlist-item-remarks">

				<p class="carlist-item-mark-certified">マツダ認定U-Car</p>

				<p class="carlist-item-mark-guaranteed">保証付</p>

				<p class="carlist-item-access-count">アクセス数 999 回<br />現在 <strong>99</strong> 人が検討中</p>

			</div>



			<fieldset class="carlist-item-btngroup">

				<a class="btn-favorite-register icon-star-bf-white icon-star-af-black" href="#">お気に入りリストに登録</a>

				<a class="btn-estimate icon-calculator-bf-white icon-calculator-af-black" href="#">お問合せ・お見積り</a>

			</fieldset>

		</footer>

	</article>



*/

.carlist-item-blueline {

  border-top: 3px solid #000;
  padding: 0 10px;

}

.carlist-item-blueline .carlist-item-header {

  border-top: 1px solid white;

}



/*

## .carlist-item-noline



基本的な物件アイテムのラインのないバージョン





	<article class="carlist-item-blueline">

		<a class="carlist-item-container" href="#">

			<header class="carlist-item-header icon-btn-arrow-bf-white">

				<p class="carlist-item-brandname">ブランド名</p>

				<h1 class="carlist-item-name">車種名</h1>

			</header>



			<div class="carlist-item-data">

				<figure class="carlist-item-thumb"><img src="{サムネイル画像パス}" width="240" height="180" alt="車種名" /></figure>

				<div class="carlist-item-spec">

					<table>

						<tbody>

							<tr>

								<th scope="row">本体</th>

								<td><strong>99.9</strong>万円</td>

								<th scope="row">総額</th>

								<td><b>99.9</b>万円</td>

							</tr>

							<tr>

								<th scope="row">年式</th>

								<td><b>9999</b>年</td>

								<th scope="row">走行</th>

								<td><b>0.9万</b>km</td>

							</tr>

							<tr>

								<th scope="row">車検</th>

								<td><b>'99.09</b></td>

								<th scope="row">修復</th>

								<td><b>なし</b></td>

							</tr>

							<tr>

								<th scope="row">店舗</th>

								<td colspan="3">

									<p class="carlist-item-spec-shopname">取り扱い店舗名</p>

								</td>

							</tr>

						</tbody>

					</table>

				</div>

			</div>

		</a>



		<footer class="carlist-item-footer">

			<div class="carlist-item-remarks">

				<p class="carlist-item-mark-certified">マツダ認定U-Car</p>

				<p class="carlist-item-mark-guaranteed">保証付</p>

				<p class="carlist-item-access-count">アクセス数 999 回<br />現在 <strong>99</strong> 人が検討中</p>

			</div>



			<fieldset class="carlist-item-btngroup">

				<a class="btn-favorite-register icon-star-bf-white icon-star-af-black" href="#">お気に入りリストに登録</a>

				<a class="btn-estimate icon-calculator-bf-white icon-calculator-af-black" href="#">お問合せ・お見積り</a>

			</fieldset>

		</footer>

	</article>



*/

.carlist-item-noline {

  border-top: 0;

}

.carlist-item-noline .carlist-item-header {

  padding-top: 5px;

  background: transparent;

}



/*

## .carlist-item-checkable



基本的な物件アイテムのチェックボックスが含まれるバージョン





	<article class="carlist-item-checkable">

		<div class="carlist-item-field-check">

			<input type="checkbox" value="" name="inpit*******" />

			<button type="button" class="btn">削除</button>

		</div>

		<a class="carlist-item-container" href="#">

			<header class="carlist-item-header icon-btn-arrow-bf-white">

				<p class="carlist-item-brandname">ブランド名</p>

				<h1 class="carlist-item-name">車種名</h1>

			</header>



			<div class="carlist-item-data">

				<figure class="carlist-item-thumb"><img src="{サムネイル画像パス}" width="240" height="180" alt="車種名" /></figure>

				<div class="carlist-item-spec">

					<table>

						<tbody>

							<tr>

								<th scope="row">本体</th>

								<td><strong>99.9</strong>万円</td>

								<th scope="row">総額</th>

								<td><b>99.9</b>万円</td>

							</tr>

							<tr>

								<th scope="row">年式</th>

								<td><b>9999</b>年</td>

								<th scope="row">走行</th>

								<td><b>0.9万</b>km</td>

							</tr>

							<tr>

								<th scope="row">車検</th>

								<td><b>'99.09</b></td>

								<th scope="row">修復</th>

								<td><b>なし</b></td>

							</tr>

							<tr>

								<th scope="row">店舗</th>

								<td colspan="3">

									<p class="carlist-item-spec-shopname">取り扱い店舗名</p>

								</td>

							</tr>

						</tbody>

					</table>

				</div>

			</div>

		</a>



		<footer class="carlist-item-footer">

			<div class="carlist-item-remarks">

				<p class="carlist-item-mark-certified">マツダ認定U-Car</p>

				<p class="carlist-item-mark-guaranteed">保証付</p>

				<p class="carlist-item-access-count">アクセス数 999 回<br />現在 <strong>99</strong> 人が検討中</p>

			</div>



			<fieldset class="carlist-item-btngroup">

				<a class="btn-favorite-register icon-star-bf-white icon-star-af-black" href="#">お気に入りリストに登録</a>

				<a class="btn-estimate icon-calculator-bf-white icon-calculator-af-black" href="#">お問合せ・お見積り</a>

			</fieldset>

		</footer>

	</article>



*/

.carlist-item-checkable .carlist-item-header {

  padding-top: 10px;

  background: transparent;

}



/*

# SpecView Class



物件詳細の仕様表示の抽象クラス



#### [Use]



- `Icon Class`

- `Btn Class`



#### [Options]



- `.spec-view` 基本的な物件詳細の仕様表示のスタイル

- `.spec-view-no-gradient` グラーデーションのない仕様表示のスタイル



#### [Contents]



- `.spec-view-header` SpecViewのヘッダー

- `.spec-view-label` SpecViewの見出し

- `.spec-view-label-control` SpecViewの見出し（`.btn-spec-view` を内包する）

- `.spec-view-container` SpecView のコンテナ

- `.spec-view-note` 注意書きを記載する際のテキスト

- `.spec-view-table` SpecView 内のテーブル

- `.spec-view-address` 住所表記の address タグクラス（`.btn-map` を内包する）

- `.spec-view-address` 電話番号表記の address タグクラス（`.btn-call` を内包する）

- `.spec-view-topagetop` 「▲ページ上部へ」テキストリンク

- `.spec-view-btngroup` ボタンのラッパー

- `.spec-view-access-count` アクセスカウント表示

- `.spec-view-price` 価格表示

- `.dropdown-view-mini` ドロップダウン表示



*/

.spec-view, .spec-view-no-gradient {

  position: relative;

}

.spec-view:before, .spec-view-no-gradient:before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

  width: 100%;

  height: 44px;

  border-top: 1px solid white;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #CCCCCC),color-stop(100%, #FFFFFF));

  background-image: -webkit-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -moz-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -ms-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -o-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: linear-gradient(to bottom, #CCCCCC 0%,#FFFFFF 100%);

}

.spec-view .spec-view-header, .spec-view-no-gradient .spec-view-header {

  position: relative;

  z-index: 1;

  border-top: 3px solid #008bd1;

}

.spec-view [class*="spec-view-label"], .spec-view-no-gradient [class*="spec-view-label"] {

  color: #3f3f3f;

  padding: 10px 10px 8px;

  line-height: 1.5;

  letter-spacing: 0.04em;

  border-top: 1px solid white;

}

.spec-view .spec-view-label-control, .spec-view-no-gradient .spec-view-label-control {

  padding: 0;

}

.spec-view .spec-view-container, .spec-view-no-gradient .spec-view-container {

  position: relative;

  z-index: 1;

  padding: 10px;

}

.spec-view .spec-view-note, .spec-view-no-gradient .spec-view-note {

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 9.6px;

}

.spec-view .spec-view-table, .spec-view-no-gradient .spec-view-table {

  width: 100%;

  border-collapse: collapse;

  border: 1px solid #b1b1b1;

}

.spec-view .spec-view-table th, .spec-view-no-gradient .spec-view-table th, .spec-view .spec-view-table td, .spec-view-no-gradient .spec-view-table td {

  padding: 5px 3px;

  line-height: 1.2;

  letter-spacing: 0;

  font-weight: normal;

  font-size: 9.6px;

  border-bottom: 1px solid #b1b1b1;

}

.spec-view .spec-view-table th, .spec-view-no-gradient .spec-view-table th {

  width: 65px;

  height: 2.5em;

  text-align: center;

  background: #eeeeee;

  border-left: 1px solid #b1b1b1;

}

.spec-view .spec-view-table td, .spec-view-no-gradient .spec-view-table td {

  height: 2.5em;

  padding: 5px;

  text-align: left;

  font-size: 12px;

}

.spec-view .spec-view-table td > p, .spec-view-no-gradient .spec-view-table td > p {

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

}

.spec-view .spec-view-table td strong, .spec-view-no-gradient .spec-view-table td strong {

  line-height: 1.2;

  letter-spacing: 0;

  color: #be0000;

  font-size: 12px;

  font-weight: normal;

}

.spec-view .spec-view-table td > table, .spec-view-no-gradient .spec-view-table td > table {

  border-collapse: collapse;

  border: 0;

}

.spec-view .spec-view-table td > table th, .spec-view-no-gradient .spec-view-table td > table th, .spec-view .spec-view-table td > table td, .spec-view-no-gradient .spec-view-table td > table td {

  line-height: 1.5;

  letter-spacing: 0.04em;

  text-align: left;

  vertical-align: top;

  border-left: 0;

  border-bottom: 4px solid white;

}

.spec-view .spec-view-table td > table tr:last-of-type th, .spec-view-no-gradient .spec-view-table td > table tr:last-of-type th, .spec-view .spec-view-table td > table tr:last-of-type td, .spec-view-no-gradient .spec-view-table td > table tr:last-of-type td {

  border-bottom: 0;

}

.spec-view .spec-view-note + .spec-view-table, .spec-view-no-gradient .spec-view-note + .spec-view-table {

  margin-top: 5px;

}

.spec-view [class^="spec-view-address"], .spec-view-no-gradient [class^="spec-view-address"] {

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

}

.spec-view .spec-view-address > .btn-map, .spec-view-no-gradient .spec-view-address > .btn-map {

  display: block;

  margin-top: 5px;

}

.spec-view .spec-view-address-phone, .spec-view-no-gradient .spec-view-address-phone {

  line-height: 1.2;

  font-size: 18px;

  vertical-align: middle;

}

.spec-view .spec-view-address-phone > .btn-call, .spec-view-no-gradient .spec-view-address-phone > .btn-call {

  margin-left: 5px;

  vertical-align: 8%;

}

.spec-view .spec-view-topagetop, .spec-view-no-gradient .spec-view-topagetop {

  padding: 10px 10px 10px;

  text-align: right;

}

.spec-view .spec-view-topagetop a, .spec-view-no-gradient .spec-view-topagetop a {

  color: #008bd1;

  font-size: 12px;

}

.spec-view .spec-view-btngroup, .spec-view-no-gradient .spec-view-btngroup {

  padding: 20px 0 0;

}

.spec-view .spec-view-btngroup [class*="btn-"], .spec-view-no-gradient .spec-view-btngroup [class*="btn-"] {

  margin-top: 5px;

  text-align: center;

  padding-left: 10px;

}

.spec-view .spec-view-btngroup [class*="btn-"]:first-of-type, .spec-view-no-gradient .spec-view-btngroup [class*="btn-"]:first-of-type {

  margin-top: 0;

}

.spec-view .spec-view-btngroup:first-child, .spec-view-no-gradient .spec-view-btngroup:first-child {

  padding-top: 5px;

}

.spec-view .spec-view-access-count, .spec-view-no-gradient .spec-view-access-count {

  padding: 10px;

  line-height: 1.2;

  letter-spacing: 0;

  background: #eeeeee;

  font-size: 12px;

}

.spec-view .spec-view-access-count strong, .spec-view-no-gradient .spec-view-access-count strong {

  color: #be0000;

  font-weight: normal;

}

.spec-view .spec-view-btngroup + .spec-view-access-count, .spec-view-no-gradient .spec-view-btngroup + .spec-view-access-count {

  margin-top: 5px;

}

.spec-view .spec-view-price, .spec-view-no-gradient .spec-view-price {

  display: table;

  width: 100%;

}

.spec-view .spec-view-price dt, .spec-view-no-gradient .spec-view-price dt, .spec-view .spec-view-price dd, .spec-view-no-gradient .spec-view-price dd {

  display: table-cell;

  padding: 5px 0 5px;

  font-size: 12px;

}

.spec-view .spec-view-price dt, .spec-view-no-gradient .spec-view-price dt {

  width: 60%;

}

.spec-view .spec-view-price dt a, .spec-view-no-gradient .spec-view-price dt a {

  color: #008bd1;

  -webkit-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -moz-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -ms-tap-highlight-color: rgba(0, 160, 218, 0.7);

  -o-tap-highlight-color: rgba(0, 160, 218, 0.7);

  tap-highlight-color: rgba(0, 160, 218, 0.7);

}

.spec-view .spec-view-price dd, .spec-view-no-gradient .spec-view-price dd {

  width: 40%;

  text-align: right;

}

.spec-view .spec-view-price dd b, .spec-view-no-gradient .spec-view-price dd b, .spec-view .spec-view-price dd strong, .spec-view-no-gradient .spec-view-price dd strong {

  margin-right: 5px;

  font-weight: normal;

  font-size: 20px;

}

.spec-view .spec-view-price dd strong, .spec-view-no-gradient .spec-view-price dd strong {

  color: #be0000;

}

.spec-view .dropdown-view-mini, .spec-view-no-gradient .dropdown-view-mini {

  padding-top: 20px;

}

.spec-view .dropdown-view-mini:first-child, .spec-view-no-gradient .dropdown-view-mini:first-child {

  padding-top: 5px;

}

.spec-view .dropdown-view-mini .dropdown-view-container > p, .spec-view-no-gradient .dropdown-view-mini .dropdown-view-container > p {

  margin-top: 15px;

  padding-left: 5px;

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

  border-left: 3px solid #b1b1b1;

}

.spec-view .dropdown-view-mini .dropdown-view-container > p:first-child, .spec-view-no-gradient .dropdown-view-mini .dropdown-view-container > p:first-child {

  margin-top: 10px;

}



/*

## .spec-view



基本的な物件詳細の仕様表示のスタイル



#### [example:price]



	<section class="spec-view">



		<div class="spec-view-container">

			<dl class="spec-view-price">

				<dt>本体価格（消費税込み）<a href="#">？</a></dt>

				<dd><strong>999.9</strong>万円</dd>

			</dl>

			<dl class="spec-view-price">

				<dt>支払総額（消費税込み）<a href="#">？</a></dt>

				<dd><b>999.9</b>万円</dd>

			</dl>

			<fieldset class="spec-view-btngroup">

				<a class="btn-estimate icon-calculator-bf-white icon-calculator-af-black" href="#">お問合せ・お見積り</a>

				<a class="btn-favorite-register icon-star-bf-white icon-star-af-black" href="#">お気に入りリストに登録</a>

			</fieldset>

			<p class="spec-view-access-count">アクセス数 999 回　現在 <strong>99</strong> 人が検討中</p>

		</div>



		<p class="spec-view-topagetop"><a href="#page-top">▲ページ上部へ</a></p>



	</section>





#### [example:shop]



	<section class="spec-view">



		<header class="spec-view-header">

			<h1 class="spec-view-label-control"><a class="btn-spec-view btn-spec-view-opened icon-btn-arrow-bf-blue icon-minus-circle-af-blue" href="javascript:void(0);">見出し</a></h1>

		</header>



		<div class="spec-view-container">

			<p class="spec-view-note">※注意書きテキスト</p>

			<table class="spec-view-table">

				<tbody>

					<tr>

						<th scope="row">テキスト</th>

						<td>テキストテキストテキストテキスト</td>

					</tr>

					<tr>

						<th scope="row">テキスト</th>

						<td>

							<table>

								<tbody>

									<tr>

										<th scope="row">テキスト</th>

										<td>テキストテキストテキスト</td>

									</tr>

									<tr>

										<th scope="row">テキスト</th>

										<td>テキストテキストテキスト</td>

									</tr>

								</tbody>

							</table>

						</td>

					</tr>

					<tr>

						<th scope="row">テキスト</th>

						<td>

							<p>テキストテキストテキストテキスト</p>

							<p><strong>※テキストテキストテキストテキストテキスト</strong></p>

						</td>

					</tr>

					<tr>

						<th scope="row">テキスト</th>

						<td><address class="spec-view-address">〒000-0000<br />東京都千代田区1-1-1<a class="btn-map" href="#">MAP</a></address></td>

					</tr>

					<tr>

						<th scope="row">テキスト</th>

						<td><address class="spec-view-address-phone">xxx-xxxx-xxxx<a class="btn-call" href="tel:xxx-xxx-xxxx">電話する</a></address></td>

					</tr>

				</tbody>

			</table>

		</div>



		<p class="spec-view-topagetop"><a href="#page-top">▲ページ上部へ</a></p>



	</section>



*/

/*

## .spec-view-no-gradient



基本的な物件詳細の仕様表示のスタイル



#### [example:attention]



	<section class="spec-view spec-view-no-gradient">



		<div class="spec-view-container">

			<fieldset class="spec-view-btngroup">

				<a class="btn-estimate icon-calculator-bf-white icon-calculator-af-black" href="#">お問合せ・お見積り</a>

				<a class="btn-favorite-register icon-star-bf-white icon-star-af-black" href="#">お気に入りリストに登録</a>

			</fieldset>

			<p class="spec-view-access-count">アクセス数 999 回　現在 <strong>99</strong> 人が検討中</p>



			<section class="dropdown-view-mini">

				<h1 class="dropdown-view-label"><a class="btn-dropdown-view-mini icon-plus-circle-af-blue" href="javascript:void(0);">ご注意事項</a></h1>

				<div class="dropdown-view-container">

					<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>

					<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>

					<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>

					<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>

					<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>

					<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>

				</div>

			</section>

		</div>



	</section>



*/

.spec-view-no-gradient {

  border-top: 1px solid #b1b1b1;

}

.spec-view-no-gradient:before {

  content: none;

  display: none;

}



/*

# BtnGroup Class



ボタンをまとめたレイアウトコンポーネント



#### [Options]



- `.btngroup` 最も基本的なボタングループスタイル

- `.btngroup-oblique` 背景に斜線のテクスチャを敷いたスタイル

- `.btngroup-panel` パネル表示にする際ののオプション（他のオプションと併用）



#### [Use]



- `Icon Class`

- `Btn Class`



#### [Contents]



- `.btngroup-item` ボタングループのアイテム（パネル表示の際は1行毎に `<ul>` で分割する）

*/

.btngroup, .btngroup-oblique {

  padding: 0 10px 10px;

}

.btngroup ul, .btngroup-oblique ul, .btngroup ol, .btngroup-oblique ol {

  list-style: none;

}

.btngroup .btngroup-item, .btngroup-oblique .btngroup-item {

  padding: 10px 0 0;

}



/*

## .btngroup



最も基本的なボタングループスタイル



	<nav class="btngroup">

		<ul>

			<li class="btngroup-item"><a href="#" class="btn icon-btn-arrow-bf-blue">テキスト</a></li>

			<li class="btngroup-item"><a href="#" class="btn">テキスト</a></li>

			<li class="btngroup-item"><a href="#" class="btn">テキスト</a></li>

		</ul>

	</nav>

*/

/*

## .btngroup-oblique



背景に斜線のテクスチャを敷いたスタイル



	<nav class="btngroup-oblique">

		<ul>

			<li class="btngroup-item"><a href="#" class="btn icon-btn-arrow-bf-blue">テキスト</a></li>

			<li class="btngroup-item"><a href="#" class="btn">テキスト</a></li>

			<li class="btngroup-item"><a href="#" class="btn">テキスト</a></li>

		</ul>

	</nav>

*/

.btngroup-oblique {

  background: #f1f1f1 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAMAAADXEh96AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpFQUZDOTM4NzgzMDYxMUUyQTEwMURGMDA4NzAwQjkyNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpFQUZDOTM4ODgzMDYxMUUyQTEwMURGMDA4NzAwQjkyNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkVBRkM5Mzg1ODMwNjExRTJBMTAxREYwMDg3MDBCOTI2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkVBRkM5Mzg2ODMwNjExRTJBMTAxREYwMDg3MDBCOTI2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+eXOqMwAAAAZQTFRFysrK////r/9cFwAAAAJ0Uk5T/wDltzBKAAAAGUlEQVR42mJgYGAEAgYoBWIhUwgZBoAAAwACIgAZsTytyAAAAABJRU5ErkJggg==) 0 0 repeat;

  -webkit-background-size: 3px 3px;

  -moz-background-size: 3px 3px;

  -ms-background-size: 3px 3px;

  -o-background-size: 3px 3px;

  background-size: 3px 3px;

}



/*

# PanelBtnGroup Class



ボタンをパネル状にまとめたレイアウトコンポーネント



#### [Options]



- `.panelbtngroup` 最も基本的なボタングループスタイル

- `.panelbtngroup-oblique` 背景に斜線のテクスチャを敷いたスタイル

- `.panelbtngroup-tab` タブスタイルのボタングループ（他のオプションと併用。1行のみサポート）



#### [Use]



- `Icon Class`

- `Btn Class`



#### [Contents]



- `.panelbtngroup-row` ボタングループのアイテムの1行分のラッパー

- `[class*="btn"]` テキストが2行表示の場合は <br /> で適宜改行し、`.panelbtngroup-btn-multiline` オプションを付加する。



*/

.panelbtngroup, .panelbtngroup-oblique {

  padding: 6px 8px 10px;

}

.panelbtngroup .panelbtngroup-row, .panelbtngroup-oblique .panelbtngroup-row {

  display: -webkit-box;

  display: -moz-box;

  display: -ms-box;

  display: -o-box;

  display: box;

  width: 100%;

  padding-top: 4px;

}

.panelbtngroup .panelbtngroup-row [class*="btn"], .panelbtngroup-oblique .panelbtngroup-row [class*="btn"] {

  -webkit-box-flex: 1;

  -moz-box-flex: 1;

  -ms-box-flex: 1;

  -o-box-flex: 1;

  box-flex: 1;

  display: block;

  width: 25%;

  height: auto;

  padding: 18px 2px;

  margin: 0 2px 0;

  line-height: 1.2;

  text-align: center;

  vertical-align: middle;

  color: #008bd1;

}

.panelbtngroup .panelbtngroup-row [class*="btn"].panelbtngroup-btn-multiline, .panelbtngroup-oblique .panelbtngroup-row [class*="btn"].panelbtngroup-btn-multiline {

  padding: 10px 2px 10px;

}

.panelbtngroup-tab.panelbtngroup, .panelbtngroup-tab.panelbtngroup-oblique {

  padding: 0 4px 0;

}

.panelbtngroup-tab.panelbtngroup .panelbtngroup-row, .panelbtngroup-tab.panelbtngroup-oblique .panelbtngroup-row {

  overflow: hidden;

}

.panelbtngroup-tab.panelbtngroup .panelbtngroup-row [class*="btn"], .panelbtngroup-tab.panelbtngroup-oblique .panelbtngroup-row [class*="btn"] {

  position: relative;

  margin: 0 4px;

  color: black;

}

.panelbtngroup-tab.panelbtngroup .panelbtngroup-row .btn, .panelbtngroup-tab.panelbtngroup-oblique .panelbtngroup-row .btn {

  padding-top: 12px;

  padding-bottom: 10px;

  bottom: -10px;

}

.panelbtngroup-tab.panelbtngroup .panelbtngroup-row .btn-convex, .panelbtngroup-tab.panelbtngroup-oblique .panelbtngroup-row .btn-convex {

  padding-top: 15px;

  padding-bottom: 15px;

  bottom: -3px;

}



@media only screen and (orientation: landscape) {

  .panelbtngroup .panelbtngroup-row [class*="btn"].panelbtngroup-btn-multiline, .panelbtngroup-oblique .panelbtngroup-row [class*="btn"].panelbtngroup-btn-multiline {

    padding: 18px 2px;

  }

  .panelbtngroup .panelbtngroup-row [class*="btn"].panelbtngroup-btn-multiline br, .panelbtngroup-oblique .panelbtngroup-row [class*="btn"].panelbtngroup-btn-multiline br {

    display: none;

  }

}

/*

## .panelbtngroup



最も基本的なパネルボタングループスタイル



	<nav class="panelbtngroup">

		<div class="panelbtngroup-row">

			<a href="#" class="btn panelbtngroup-btn-multiline">アイテム<br />（2行表示）</a>

			<a href="#" class="btn">アイテム</a>

			<a href="#" class="btn panelbtngroup-btn-multiline">アイテム<br />（2行表示）</a>

			<a href="#" class="btn">アイテム</a>

		</div>

		<div class="panelbtngroup-row">

			<a href="#" class="btn panelbtngroup-btn-multiline">アイテム<br />（2行表示）</a>

			<a href="#" class="btn">アイテム</a>

			<a href="#" class="btn panelbtngroup-btn-multiline">アイテム<br />（2行表示）</a>

			<a href="#" class="btn">アイテム</a>

		</div>

	</nav>



#### [option;tab]



	<nav class="panelbtngroup panelbtngroup-tab">

		<div class="panelbtngroup-row">

			<a href="#" class="btn">タブ１</a>

			<a href="#" class="btn-convex">タブ2</a>

		</div>

	</nav>



*/

/*

## .panelbtngroup-oblique



背景に斜線のテクスチャを敷いたスタイル



	<nav class="panelbtngroup-oblique">

		<div class="panelbtngroup-row">

			<a href="#" class="btn panelbtngroup-btn-multiline">アイテム<br />（2行表示）</a>

			<a href="#" class="btn">アイテム</a>

			<a href="#" class="btn panelbtngroup-btn-multiline">アイテム<br />（2行表示）</a>

			<a href="#" class="btn">アイテム</a>

		</div>

		<div class="panelbtngroup-row">

			<a href="#" class="btn panelbtngroup-btn-multiline">アイテム<br />（2行表示）</a>

			<a href="#" class="btn">アイテム</a>

			<a href="#" class="btn panelbtngroup-btn-multiline">アイテム<br />（2行表示）</a>

			<a href="#" class="btn">アイテム</a>

		</div>

	</nav>



#### [option;tab]



	<nav class="panelbtngroup-oblique panelbtngroup-tab">

		<div class="panelbtngroup-row">

			<a href="#" class="btn">タブ１</a>

			<a href="#" class="btn-convex">タブ2</a>

		</div>

	</nav>



*/

.panelbtngroup-oblique {

  background: #f1f1f1 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAMAAADXEh96AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpFQUZDOTM4NzgzMDYxMUUyQTEwMURGMDA4NzAwQjkyNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpFQUZDOTM4ODgzMDYxMUUyQTEwMURGMDA4NzAwQjkyNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkVBRkM5Mzg1ODMwNjExRTJBMTAxREYwMDg3MDBCOTI2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkVBRkM5Mzg2ODMwNjExRTJBMTAxREYwMDg3MDBCOTI2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+eXOqMwAAAAZQTFRFysrK////r/9cFwAAAAJ0Uk5T/wDltzBKAAAAGUlEQVR42mJgYGAEAgYoBWIhUwgZBoAAAwACIgAZsTytyAAAAABJRU5ErkJggg==) 0 0 repeat;

  -webkit-background-size: 3px 3px;

  -moz-background-size: 3px 3px;

  -ms-background-size: 3px 3px;

  -o-background-size: 3px 3px;

  background-size: 3px 3px;

}



/*

# LinkGroup Class



テキストリンクをまとめたレイアウトコンポーネント



#### [Options]



 - `.linkgroup` 最も基本的なリンクグループスタイル

 - `.linkgroup-oblique` 背景に斜線のテクスチャを敷いたスタイル



#### [Use]



- `Icon Class`



#### [Contents]



 - `.linkgroup-item` ボタングループのアイテム

*/

.linkgroup, .linkgroup-oblique {

  padding: 10px;

}

.linkgroup ul, .linkgroup-oblique ul, .linkgroup ol, .linkgroup-oblique ol {

  padding: 0 7px 7px 7px;

  list-style: none;

  line-height: 1;

  background: white;

  border: 1px solid #b1b1b1;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  -ms-border-radius: 4px;

  -o-border-radius: 4px;

  border-radius: 4px;

}

.linkgroup .linkgroup-item, .linkgroup-oblique .linkgroup-item {

  display: inline-block;

  padding-top: 7px;

  vertical-align: middle;

  font-size: 14px;

}

.linkgroup .linkgroup-item a, .linkgroup-oblique .linkgroup-item a {

  vertical-align: middle;

  color: #008bd1;

}

.linkgroup .linkgroup-item[class*="icon-"]:before, .linkgroup-oblique .linkgroup-item[class*="icon-"]:before {

  display: inline-block;

  margin: -3px -5px 0 -5px;

  vertical-align: middle;

  color: #008bd1;

  font-size: 20px;

}



/*

## .btngroup



最も基本的なボタングループスタイル



	<nav class="linkgroup">

		<ul>

			<li class="linkgroup-item icon-link-arrow-bf-white"><a href="#">アイテム</a></li>

			<li class="linkgroup-item icon-link-arrow-bf-litegrey"><a href="#">アイテム</a></li>

			<li class="linkgroup-item icon-link-arrow-bf-grey"><a href="#">アイテム</a></li>

			<li class="linkgroup-item icon-link-arrow-bf-black"><a href="#">アイテム</a></li>

			<li class="linkgroup-item icon-link-arrow-bf-blue"><a href="#">アイテム</a></li>

		</ul>

	</nav>

*/

/*

## .btngroup-oblique



背景に斜線のテクスチャを敷いたスタイル



	<nav class="linkgroup-oblique">

		<ul>

			<li class="linkgroup-item icon-link-arrow-bf-white"><a href="#">アイテム</a></li>

			<li class="linkgroup-item icon-link-arrow-bf-litegrey"><a href="#">アイテム</a></li>

			<li class="linkgroup-item icon-link-arrow-bf-grey"><a href="#">アイテム</a></li>

			<li class="linkgroup-item icon-link-arrow-bf-black"><a href="#">アイテム</a></li>

			<li class="linkgroup-item icon-link-arrow-bf-blue"><a href="#">アイテム</a></li>

		</ul>

	</nav>

*/

.linkgroup-oblique {

  background: #f1f1f1 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAMAAADXEh96AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpFQUZDOTM4NzgzMDYxMUUyQTEwMURGMDA4NzAwQjkyNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpFQUZDOTM4ODgzMDYxMUUyQTEwMURGMDA4NzAwQjkyNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkVBRkM5Mzg1ODMwNjExRTJBMTAxREYwMDg3MDBCOTI2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkVBRkM5Mzg2ODMwNjExRTJBMTAxREYwMDg3MDBCOTI2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+eXOqMwAAAAZQTFRFysrK////r/9cFwAAAAJ0Uk5T/wDltzBKAAAAGUlEQVR42mJgYGAEAgYoBWIhUwgZBoAAAwACIgAZsTytyAAAAABJRU5ErkJggg==) 0 0 repeat;

  -webkit-background-size: 3px 3px;

  -moz-background-size: 3px 3px;

  -ms-background-size: 3px 3px;

  -o-background-size: 3px 3px;

  background-size: 3px 3px;

}



/*

# Heading Class



見出し用の抽象クラス



#### [Options]



 - `.heading-darkblue` 見出しスタイルのダークブルーバージョン

 - `.heading-narrow-blue` 高さが狭い見出しスタイルのブルーバージョン

 - `.heading-label-letterpressed` 見出しのテキストをレタープレス処理にするオプション（他のオプションと併用）

 - `.heading-with-zoomzoom` ZOOM-ZOOMロゴを表示（他のオプションと併用）



#### [Contents]



- `.heading-label` 見出しのメインテキスト

- `.heading-label-option` 見出しのメインテキスト内のオプションテキスト

- `.heading-label-sub` 見出し内のサブテキスト

- `.btn-heading` 見出し内のボタン。`.btn-heading-left`、`.btn-heading-left` オプションで位置を調整。（heading-labelよりも先に記述することで適切な表示になる）

- `.heading-normalbtn-container` 見出し内に通常のボタンを追加する場合のオプション（融通がきく使用ではないため、使用の際は注意）



*/

.heading-darkblue, .heading-blue, .heading-narrow-blue {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  display: table;

  position: relative;

  width: 100%;

  padding: 0 10px 0;

}

.heading-darkblue .heading-label, .heading-blue .heading-label, .heading-narrow-blue .heading-label {

  display: table-cell;

  padding: 0;

  line-height: 1.2;

  letter-spacing: 0;

  font-weight: bold;

}

.heading-darkblue .btn-heading-left ~ .heading-label, .heading-blue .btn-heading-left ~ .heading-label, .heading-narrow-blue .btn-heading-left ~ .heading-label {

  padding-left: 25px;

}

.heading-darkblue .btn-heading-right ~ .heading-label, .heading-blue .btn-heading-right ~ .heading-label, .heading-narrow-blue .btn-heading-right ~ .heading-label {

  padding-right: 25px;

}

.heading-darkblue .heading-label-option, .heading-blue .heading-label-option, .heading-narrow-blue .heading-label-option {

  color: #d2e9f3;

  line-height: 1.2;

  letter-spacing: 0;

  font-weight: normal;

}

.heading-darkblue .heading-label-sub, .heading-blue .heading-label-sub, .heading-narrow-blue .heading-label-sub {

  display: table-cell;

  padding: 0;

  text-align: right;

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

}

.heading-darkblue .btn-heading-left ~ .heading-label-sub, .heading-blue .btn-heading-left ~ .heading-label-sub, .heading-narrow-blue .btn-heading-left ~ .heading-label-sub {

  padding-left: 25px;

}

.heading-darkblue .btn-heading-right ~ .heading-label-sub, .heading-blue .btn-heading-right ~ .heading-label-sub, .heading-narrow-blue .btn-heading-right ~ .heading-label-sub {

  padding-right: 25px;

}

.heading-label-letterpressed.heading-darkblue .heading-label, .heading-label-letterpressed.heading-blue .heading-label, .heading-label-letterpressed.heading-narrow-blue .heading-label, .heading-label-letterpressed.heading-darkblue .heading-label-sub, .heading-label-letterpressed.heading-blue .heading-label-sub, .heading-label-letterpressed.heading-narrow-blue .heading-label-sub {

  text-shadow: rgba(0, 0, 0, 0.7) 0 -1px 1px;

}

.heading-with-zoomzoom.heading-darkblue, .heading-with-zoomzoom.heading-blue, .heading-with-zoomzoom.heading-narrow-blue {

  overflow: hidden;

}

.heading-with-zoomzoom.heading-darkblue:after, .heading-with-zoomzoom.heading-blue:after, .heading-with-zoomzoom.heading-narrow-blue:after {

  content: "";

  display: block;

  position: absolute;

  bottom: 0;

  right: -10px;

  width: 140px;

  height: 100%;

  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARcAAACMCAYAAABWBe3gAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpGNzdGMTE3NDA3MjA2ODExODIyQUUzRTAxRjAwQ0U0MCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo5Mjg1QjZGRThENDYxMUUyOTNBMEJCM0I0ODAzMzIyNyIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo5Mjg1QjZGRDhENDYxMUUyOTNBMEJCM0I0ODAzMzIyNyIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MDE4MDExNzQwNzIwNjgxMTgwODNBOUUzRUZFOEMxMTQiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6Rjc3RjExNzQwNzIwNjgxMTgyMkFFM0UwMUYwMENFNDAiLz4gPC9yZGY6RGVzY3Jp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) 0 -27px no-repeat;

  -webkit-background-size: 140px 70px;

  -moz-background-size: 140px 70px;

  -ms-background-size: 140px 70px;

  -o-background-size: 140px 70px;

  background-size: 140px 70px;

}

.global-header + [class*="-blue"].heading-darkblue, .global-header + [class*="-blue"].heading-blue, .global-header + [class*="-blue"].heading-narrow-blue {

  border-top: 1px solid #666666;

}

.heading-darkblue .heading-normalbtn-container, .heading-blue .heading-normalbtn-container, .heading-narrow-blue .heading-normalbtn-container {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  position: absolute;

  right: 0;

  top: 0;

  width: auto;

  height: 100%;

  padding: 5px 10px 5px 0;

  vertical-align: middle;

}

.heading-darkblue .btn, .heading-blue .btn, .heading-narrow-blue .btn, .heading-darkblue .btn-call, .heading-blue .btn-call, .heading-narrow-blue .btn-call {

  padding-top: 10px;

  padding-bottom: 10px;

}

.heading-darkblue .btn-call, .heading-blue .btn-call, .heading-narrow-blue .btn-call {

  width: 100px;

  padding-left: 35px;

  -webkit-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 1px;

  -moz-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 1px;

  -ms-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 1px;

  -o-box-shadow: rgba(0, 0, 0, 0.2) 0 1px 1px;

  box-shadow: rgba(0, 0, 0, 0.2) 0 1px 1px;

}



/*

## .heading-darkblue



見出しスタイルのダークブルーバージョン



	<header class="heading-darkblue">

		<h1 class="heading-label">見出し</h1>

		<p class="heading-label-sub">サブテキスト</p>

	</header>



	<header class="heading-darkblue heading-label-letterpressed">

		<h1 class="heading-label">見出し</h1>

		<p class="heading-label-sub">サブテキスト</p>

	</header>



	<header class="heading-darkblue heading-with-zoomzoom">

		<h1 class="heading-label">見出し</h1>

	</header>



	<header class="heading-darkblue">

		<a class="btn-heading btn-heading-left icon-btn-arrow-bf-white icon-btn-arrow-af-black" href="">戻る</a>

		<a class="btn-heading btn-heading-right icon-btn-arrow-bf-white icon-btn-arrow-af-black" href="#">進む</a>

		<h1 class="heading-label">見出し</h1>

		<p class="heading-label-sub">サブテキスト</p>

	</header>

*/

.heading-darkblue {

  padding-top: 11px;

  padding-bottom: 9px;

  color: white;

  border-bottom: 1px solid #629dd1;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #00428B),color-stop(10%, #0060B5),color-stop(100%, #3681C5));

  background-image: -webkit-linear-gradient(top, #00428B 0%,#0060B5 10%,#3681C5 100%);

  background-image: -moz-linear-gradient(top, #00428B 0%,#0060B5 10%,#3681C5 100%);

  background-image: -ms-linear-gradient(top, #00428B 0%,#0060B5 10%,#3681C5 100%);

  background-image: -o-linear-gradient(top, #00428B 0%,#0060B5 10%,#3681C5 100%);

  background-image: linear-gradient(to bottom, #00428B 0%,#0060B5 10%,#3681C5 100%);

}



/*

## .heading-blue



見出しスタイルのブルーバージョン



	<header class="heading-blue">

		<h1 class="heading-label">見出し</h1>

		<p class="heading-label-sub">サブテキスト</p>

	</header>



	<header class="heading-blue heading-label-letterpressed">

		<h1 class="heading-label">見出し</h1>

		<p class="heading-label-sub">サブテキスト</p>

	</header>



	<header class="heading-blue heading-with-zoomzoom">

		<h1 class="heading-label">見出し</h1>

	</header>



	<header class="heading-blue">

		<a class="btn-heading btn-heading-left icon-btn-arrow-bf-white icon-btn-arrow-af-black" href="">戻る</a>

		<a class="btn-heading btn-heading-right icon-btn-arrow-bf-white icon-btn-arrow-af-black" href="#">進む</a>

		<h1 class="heading-label">見出し</h1>

		<p class="heading-label-sub">サブテキスト</p>

	</header>

*/

.heading-blue {

  padding-top: 11px;

  padding-bottom: 9px;

  color: white;

  background-color: #202020;

}



/*

## .heading-narrow-blue



基本的な見出しスタイルのブルーバージョン



	<header class="heading-narrow-blue">

		<h1 class="heading-label">見出し</h1>

		<p class="heading-label-sub">サブテキスト</p>

	</header>



	<header class="heading-narrow-blue heading-label-letterpressed">

		<h1 class="heading-label">見出し</h1>

		<p class="heading-label-sub">サブテキスト</p>

	</header>



	<header class="heading-narrow-blue heading-with-zoomzoom">

		<h1 class="heading-label">見出し</h1>

	</header>



	<header class="heading-narrow-blue">

		<a class="btn-heading btn-heading-left icon-btn-arrow-bf-white icon-btn-arrow-af-black" href="">戻る</a>

		<a class="btn-heading btn-heading-right icon-btn-arrow-bf-white icon-btn-arrow-af-black" href="#">進む</a>

		<h1 class="heading-label">見出し</h1>

		<p class="heading-label-sub">サブテキスト</p>

	</header>

*/

.heading-narrow-blue {

  padding-top: 8px;

  padding-bottom: 6px;

  color: white;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #008BD1),color-stop(100%, #00B6E5));

  background-image: -webkit-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: -moz-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: -ms-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: -o-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: linear-gradient(to bottom, #008BD1 0%,#00B6E5 100%);

}



/*

# HeadingSup Class



見出しの補足情報を表示する領域



#### [Option]



- `.headingsup-blue` Heading Class の `.heading-blue` に対応したスタイル



#### [Contents]



- `.headingsup-message` メッセージ



*/

.headingsup-blue {

  position: relative;

  z-index: 5;

  margin-top: -1px;

  padding-bottom: 5px;

}

.headingsup-blue .headingsup-message {

  padding: 10px 10px 8px;

  line-height: 1.2;

  letter-spacing: 0;

  color: white;

  font-size: 12px;

}



/*

## .headingsup-blue



`.heading-blue` に対応したスタイル



	<header class="headingsup-blue">

		<p class="headingsup-message">あああああああああ■あああああああああ■あああああああああ■あああああああああ■あああああああああ■あああああああああ■あああああああああ■あああああああああ■</p>

	</header>



*/

.headingsup-blue {

  margin-top: -1px;

  background: #00b6e5;

}

.headingsup-blue .headingsup-message {

  background: #008ad0;

}



/*

# DropdownView Class



ドロップダウンビューの抽象クラス



#### [Options]



 - `.dropdown-view` 基本的なドロップダウンビューのスタイル

 - `.dropdown-view-mini` コンテンツ内部で使用するためのドロップダウンスタイル



#### [Contents]



 - `.dropdown-view-label` 見出し。 `btn-dropdown-view` を内包する。

 - `.dropdown-view-container` コンテンツのラッパー

*/

.dropdown-view .dropdown-view-label, .dropdown-view-mini .dropdown-view-label {

  font-weight: normal;

}

.dropdown-view .list-view-item a, .dropdown-view-mini .list-view-item a, .dropdown-view .list-view-item-block, .dropdown-view-mini .list-view-item-block {

  padding-left: 30px;

}



/*

## .dropdown-view



基本的なドロップダウンビューのスタイル





#### [State:open]



	<section class="dropdown-view">



		<h1 class="dropdown-view-label"><a href="javascript:void(0);" class="btn-dropdown-view icon-btn-arrow-bf-blue icon-plus-circle-af-grey">ドロップダウンラベル</a></h1>



		<nav class="list-view-grey">

			<ul>

				<li class="list-view-item "><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

				<li class="list-view-item "><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

				<li class="list-view-item "><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

				<li class="list-view-item "><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

				<li class="list-view-item-block">

					<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

					<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

					<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				</li>

				<li class="list-view-item"><a href="#">アイテム<span class="list-view-item-count">189 台</span></a></li>

				<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム<span class="list-view-item-count">189 台</span></a></li>

			</ul>

		</nav>



	</section>



#### [State:close]



	<section class="dropdown-view">



		<h1 class="dropdown-view-label"><a href="javascript:void(0);" class="btn-dropdown-view btn-dropdown-view-opened icon-btn-arrow-bf-blue icon-minus-circle-af-grey">ドロップダウンラベル</a></h1>



		<nav class="list-view-grey" style="display:none;">

			<ul>

				<li class="list-view-item "><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

				<li class="list-view-item "><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

				<li class="list-view-item "><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

				<li class="list-view-item "><a href="#" class="icon-btn-arrow-bf-blue">アイテム</a></li>

				<li class="list-view-item-block">

					<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

					<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

					<p>コンテンツコンテンツコンテンツコンテンツコンテンツ</p>

				</li>

				<li class="list-view-item"><a href="#">アイテム<span class="list-view-item-count">189 台</span></a></li>

				<li class="list-view-item"><a href="#" class="icon-btn-arrow-bf-blue">アイテム<span class="list-view-item-count">189 台</span></a></li>

			</ul>

		</nav>



	</section>

*/

/*

## .dropdown-view-mini



コンテンツ内部で使用するためのドロップダウンスタイル





#### [State:open]



	<section class="dropdown-view-mini">

		<h1 class="dropdown-view-label"><a class="btn-dropdown-view-mini icon-plus-circle-af-blue" href="javascript:void(0);">opened</a></h1>

		<div class="dropdown-view-container">



			some objects



		</div>

	</section>





#### [State:close]



	<section class="dropdown-view-mini">

		<h1 class="dropdown-view-label"><a class="btn-dropdown-view-mini icon-minus-circle-af-blue" href="javascript:void(0);">closed</a></h1>

		<div class="dropdown-view-container" style="display:none;">



			some objects



		</div>

	</section>



*/

.dropdown-view-mini .dropdown-view-container {

  padding: 0 10px 10px;

  border: 1px solid #b1b1b1;

  border-top-color: transparent;

}



/*

# ResultHeading Class



検索結果の見出しの抽象クラス。



#### [Options]



- `.result-heading` 基本的な検索結果見出しのスタイル

- `.result-heading-followed-scrolling` スクロール追従時のスタイル（他のオプションと併用）



#### [Contents]



 - `.result-heading-label` 見出し。

 - `.btn-result-heading` 見出し内のボタン。`.btn-result-heading-pressed` オプションクラス指定で押された状態。



*/

.result-heading {

  display: -webkit-box;

  display: -moz-box;

  display: -ms-box;

  display: -o-box;

  display: box;

  width: 100%;

  color: #eeeeee;

  border: 0;

  border-top: 1px solid #787878;

  border-bottom: 1px solid #787878;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3B3B3B),color-stop(10%, #3B3B3B),color-stop(100%, #000000));

  background-image: -webkit-linear-gradient(top, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: -moz-linear-gradient(top, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: -ms-linear-gradient(top, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: -o-linear-gradient(top, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

  background-image: linear-gradient(to bottom, #3B3B3B 0%,#3B3B3B 10%,#000000 100%);

}

.result-heading .result-heading-label {

  -webkit-box-flex: 1;

  -moz-box-flex: 1;

  -ms-box-flex: 1;

  -o-box-flex: 1;

  box-flex: 1;

  width: 45%;

  padding: 17px 0;

  text-align: center;

  line-height: 1.2;

  letter-spacing: 0.04em;

  font-weight: normal;

  font-size: 12px;

}

.result-heading .result-heading-label b {

  padding-right: 5px;

  font-weight: normal;

  font-size: 16px;

}

.result-heading .btn-result-heading {

  -webkit-box-flex: 1;

  -moz-box-flex: 1;

  -ms-box-flex: 1;

  -o-box-flex: 1;

  box-flex: 1;

  color: #eeeeee;

}

.result-heading-followed-scrolling.result-heading {

  position: fixed;

  z-index: 10;

  top: 0;

  left: 0;

  width: 100%;

}



/*

## .result-heading



基本的な検索結果見出しのスタイル





#### [state:normal]



	<header class="result-heading">

		<p class="result-heading-label"><b>1234件</b>がヒット</p>

		<a class="btn-result-heading icon-btn-arrow-bf-blue" href="#">絞り込み</a>

		<a class="btn-result-heading icon-btn-arrow-bf-blue" href="#">並び替え</a>

	</header>





#### [state:pressed]



	<header class="result-heading">

		<p class="result-heading-label"><b>1234件</b>がヒット</p>

		<a class="btn-result-heading btn-result-heading-pressed icon-btn-arrow-bf-blue" href="#">絞り込み</a>

		<a class="btn-result-heading btn-result-heading-pressed icon-btn-arrow-bf-blue" href="#">並び替え</a>

	</header>





#### [state:followed-scrolling]



	<header class="result-heading result-heading-followed-scrolling">

		<p class="result-heading-label"><b>1234件</b>がヒット</p>

		<a class="btn-result-heading icon-btn-arrow-bf-blue" href="#">絞り込み</a>

		<a class="btn-result-heading icon-btn-arrow-bf-blue" href="#">並び替え</a>

	</header>



*/

/*

# FlowView Class



フロー表示の抽象クラス。



#### [Options]



- `.flow-view` 基本的なフロー表示のスタイル



#### [Contents]



- `.flow-view-container` 各項目 `.flow-view-item` のラッパー

- `.flow-view-item` フローの各流れ



*/

.flow-view, .flow-view-oblique {

  display: table;

  width: 100%;

  padding: 5px 0;

}

.flow-view .flow-view-item, .flow-view-oblique .flow-view-item, .flow-view .flow-view-item-active, .flow-view-oblique .flow-view-item-active {

  padding: 10px 5px;

  counter-increment: flow-view;

}

.flow-view .flow-view-item:before, .flow-view-oblique .flow-view-item:before, .flow-view .flow-view-item-active:before, .flow-view-oblique .flow-view-item-active:before {

  content: counter(flow-view) ".";

  display: inline-block;

  padding: 0 3px 0 0;

}

.flow-view .flow-view-container, .flow-view-oblique .flow-view-container {

  display: table-row;

  list-style: none;

  counter-reset: flow-view;

}

.flow-view [class^="flow-view-item"], .flow-view-oblique [class^="flow-view-item"] {

  display: table-cell;

  text-align: center;

  vertical-align: middle;

}

.flow-view .flow-view-item, .flow-view-oblique .flow-view-item {

  color: #8b8b8b;

  background: rgba(177, 177, 177, 0.4);

}

.flow-view .flow-view-item-active, .flow-view-oblique .flow-view-item-active {

  color: white;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #008BD1),color-stop(100%, #00B6E5));

  background-image: -webkit-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: -moz-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: -ms-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: -o-linear-gradient(top, #008BD1 0%,#00B6E5 100%);

  background-image: linear-gradient(to bottom, #008BD1 0%,#00B6E5 100%);

  border-top: 1px solid #008ad0;

  border-bottom: 1px solid #008ad0;

}

.flow-view [class^="flow-view-span"], .flow-view-oblique [class^="flow-view-span"] {

  display: table-cell;

  width: 25px;

  text-align: center;

  vertical-align: middle;

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJYAAABGCAYAAAAuP23NAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpGNzdGMTE3NDA3MjA2ODExODIyQUZFOTg4QTc5MDhGOCIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo0RUFFQTk4NDk4M0UxMUUyQkExOUE5Rjc1ODhCRUIyQiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo0RUFFQTk4Mzk4M0UxMUUyQkExOUE5Rjc1ODhCRUIyQiIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6Rjc3RjExNzQwNzIwNjgxMTgyMkFGRTk4OEE3OTA4RjgiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6Rjc3RjExNzQwNzIwNjgxMTgyMkFGRTk4OEE3OTA4RjgiLz4gPC9yZGY6RGVzY3Jp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);

  background-position: -50px 0;

  -webkit-background-size: 75px 100%;

  -moz-background-size: 75px 100%;

  -ms-background-size: 75px 100%;

  -o-background-size: 75px 100%;

  background-size: 75px 100%;

}

.flow-view [class^="flow-view-span"][class*="-span-prev-active"], .flow-view-oblique [class^="flow-view-span"][class*="-span-prev-active"] {

  background-position: 0 0;

}

.flow-view [class^="flow-view-span"][class*="-span-next-active"], .flow-view-oblique [class^="flow-view-span"][class*="-span-next-active"] {

  background-position: -25px 0;

}



/*

## .flow-view



基本的なフロー表示のスタイル



	<div class="flow-view">

		<ol class="flow-view-container">

			<li class="flow-view-item">フロー</li>

			<li class="flow-view-span">&nbsp;</li>

			<li class="flow-view-item">フロー</li>

			<li class="flow-view-span-prev-active">&nbsp;</li>

			<li class="flow-view-item-active">フロー</li>

			<li class="flow-view-span-next-active">&nbsp;</li>

			<li class="flow-view-item">フロー</li>

		</ol>

	</div>

*/

/*

## .flow-view-oblique



背景に斜線のテクスチャを敷いたスタイル



	<div class="flow-view-oblique">

		<ol class="flow-view-container">

			<li class="flow-view-item">フロー</li>

			<li class="flow-view-span">&nbsp;</li>

			<li class="flow-view-item">フロー</li>

			<li class="flow-view-span-prev-active">&nbsp;</li>

			<li class="flow-view-item-active">フロー</li>

			<li class="flow-view-span-next-active">&nbsp;</li>

			<li class="flow-view-item">フロー</li>

		</ol>

	</div>

*/

.flow-view-oblique {

  background: #f1f1f1 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAMAAADXEh96AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpFQUZDOTM4NzgzMDYxMUUyQTEwMURGMDA4NzAwQjkyNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpFQUZDOTM4ODgzMDYxMUUyQTEwMURGMDA4NzAwQjkyNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkVBRkM5Mzg1ODMwNjExRTJBMTAxREYwMDg3MDBCOTI2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkVBRkM5Mzg2ODMwNjExRTJBMTAxREYwMDg3MDBCOTI2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+eXOqMwAAAAZQTFRFysrK////r/9cFwAAAAJ0Uk5T/wDltzBKAAAAGUlEQVR42mJgYGAEAgYoBWIhUwgZBoAAAwACIgAZsTytyAAAAABJRU5ErkJggg==) 0 0 repeat;

  -webkit-background-size: 3px 3px;

  -moz-background-size: 3px 3px;

  -ms-background-size: 3px 3px;

  -o-background-size: 3px 3px;

  background-size: 3px 3px;

}



/*

# ActionNavi Class



アクションナビの抽象クラス。



#### [Options]



- `.action-navi` 基本的なアクションナビのスタイル

- `.action-navi-followed-scrolling` スクロール追従時のスタイル（他のオプションと併用）



#### [Contents]



- `.btn-call` 電話するボタン

- `.btn-estimate` お問合せ・お見積りボタン

- `.btn` 基本的なボタンのスタイル

- `.btn-primary` 重要度の高い遷移に使用されるボタン

- `.action-navi-multiline-btn` ボタンに追加で付与することで2行の文字が入る場合に対応



*/

.action-navi {

  display: -webkit-box;

  display: -moz-box;

  display: -ms-box;

  display: -o-box;

  display: box;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  width: 100%;

  padding: 10px 5px;

  background: rgba(0, 0, 0, 0.8);

}

.action-navi-followed-scrolling.action-navi {

  position: fixed;

  z-index: 10;

  bottom: 0;

  left: 0;

  width: 100%;

}

.action-navi [class*="btn-"], .action-navi .btn {

  -webkit-box-flex: 1;

  -moz-box-flex: 1;

  -ms-box-flex: 1;

  -o-box-flex: 1;

  box-flex: 1;

  display: block;

  width: 47%;

  height: auto;

  margin: 0 5px;

  text-align: center;

  padding: 15px 5px 15px 5px;

}

.action-navi [class*="btn-"].action-navi-multiline-btn, .action-navi .btn.action-navi-multiline-btn {

  padding: 9px 5px;

  line-height: 1.2;

  letter-spacing: 0;

}

.action-navi .btn-primary {

  text-shadow: rgba(0, 0, 0, 0.3) 1px 1px 0;

}

.action-navi .btn-estimate-action {

  padding-left: 25px;

}

.action-navi .btn-estimate-action[class*="icon-"] {

  letter-spacing: -0.15em;

}

.action-navi .btn-estimate-action:after, .action-navi .btn-estimate-action:before {

  -webkit-transform: scale(1.2, 1.2);

  -moz-transform: scale(1.2, 1.2);

  -ms-transform: scale(1.2, 1.2);

  -o-transform: scale(1.2, 1.2);

  transform: scale(1.2, 1.2);

}



@media only screen and (max-device-width: 480px) and (orientation: landscape) {

  .action-navi [class*="btn-"] {

    text-align: center;

    padding: 15px 5px 15px 5px;

  }

}

/*

## .action-navi



基本的なアクションナビのスタイル



	<nav class="action-navi">

		<a class="btn-estimate btn-estimate-action" href="#">お問合せ・お見積り</a>

		<a class="btn-call btn-call-action" href="tel:xxx-xxxx-xxxx">電話する</a>

	</nav>



	<nav class="action-navi">

		<button type="reset" class="btn">条件クリア</a>

		<button type="submit" class="btn-primary btn-primary-no-glow">条件決定</a>

	</nav>



*/

/*

# PagerGroup Class



ページャーの抽象クラス。



#### [Options]



- `.pagergroup` 基本的なページャーのスタイル

- `.pagergroup-oblique` 背景に斜線のテクスチャを敷いたスタイル



#### [Contents]



- `.btn-pagergroup` ページャー用ボタン。`btn-pagergroup-back` オプションを追加で戻るボタン表示

- `.pagergroup-count` ページャーのカウント表示



*/

.pagergroup, .pagergroup-oblique {

  display: -webkit-box;

  display: -moz-box;

  display: -ms-box;

  display: -o-box;

  display: box;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  width: 100%;

  padding: 4px 2px;

}

.pagergroup .btn-pagergroup, .pagergroup-oblique .btn-pagergroup {

  -webkit-box-flex: 1;

  -moz-box-flex: 1;

  -ms-box-flex: 1;

  -o-box-flex: 1;

  box-flex: 1;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  margin: 0 2px;

}

.pagergroup .pagergroup-count, .pagergroup-oblique .pagergroup-count {

  -webkit-box-flex: 0;

  -moz-box-flex: 0;

  -ms-box-flex: 0;

  -o-box-flex: 0;

  box-flex: 0;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  margin: 0 2px 0;

  padding: 10px 33px 8px;

  text-align: center;

  line-height: 1.5;

  letter-spacing: 0.04em;

  color: white;

  background: #3f3f3f;

  -webkit-border-radius: 4px;

  -moz-border-radius: 4px;

  -ms-border-radius: 4px;

  -o-border-radius: 4px;

  border-radius: 4px;

}

.carlist-item + .pagergroup, .carlist-item + .pagergroup-oblique {

  border-top: 1px solid #bbbbbb;

}



/*

## .pagergroup



基本的なページャーのスタイル





	<nav class="pagergroup">

		<a class="btn-pagergroup btn-pagergroup-back" href="#">最初</a>

		<a class="btn-pagergroup btn-pagergroup-back icon-btn-arrow-bf-blue" href="#">前へ</a>

		<p class="pagergroup-count">1p/2p</p>

		<a class="btn-pagergroup icon-btn-arrow-bf-blue" href="#">次へ</a>

		<a class="btn-pagergroup" href="#">最後</a>

	</nav>



*/

/*

## .pagergroup-oblique



背景に斜線のテクスチャを敷いたスタイル





	<nav class="pagergroup-oblique">

		<a class="btn-pagergroup btn-pagergroup-back" href="#">最初</a>

		<a class="btn-pagergroup btn-pagergroup-back icon-btn-arrow-bf-blue" href="#">前へ</a>

		<p class="pagergroup-count">1p/2p</p>

		<a class="btn-pagergroup icon-btn-arrow-bf-blue" href="#">次へ</a>

		<a class="btn-pagergroup" href="#">最後</a>

	</nav>



*/

.pagergroup-oblique {

  background: #f1f1f1 url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAYAAAAGCAMAAADXEh96AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDpFQUZDOTM4NzgzMDYxMUUyQTEwMURGMDA4NzAwQjkyNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDpFQUZDOTM4ODgzMDYxMUUyQTEwMURGMDA4NzAwQjkyNiI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOkVBRkM5Mzg1ODMwNjExRTJBMTAxREYwMDg3MDBCOTI2IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOkVBRkM5Mzg2ODMwNjExRTJBMTAxREYwMDg3MDBCOTI2Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+eXOqMwAAAAZQTFRFysrK////r/9cFwAAAAJ0Uk5T/wDltzBKAAAAGUlEQVR42mJgYGAEAgYoBWIhUwgZBoAAAwACIgAZsTytyAAAAABJRU5ErkJggg==) 0 0 repeat;

  -webkit-background-size: 3px 3px;

  -moz-background-size: 3px 3px;

  -ms-background-size: 3px 3px;

  -o-background-size: 3px 3px;

  background-size: 3px 3px;

}



/*

# GlobalHeader Class



サイト共通のヘッダー



#### [Use]



- `.btn-favorite-check`



#### [Contents]



- `.global-header-logo` グローバルヘッダーlogo

*/

.global-header {

    position: relative;
    width: 100%;
    height: 50px;
    background-color: #000;

}

.global-header .btn-favorite-check {

  position: absolute;

  top: -5px;

  right: 5px;

}

.global-header .global-header-logo {

  position: absolute;
  top: 10px;
  left: 50%;
  width: 114px;
  height: 30px;
  margin-left: -57px;

}

.global-header .global-header-logo a {

  display: block;

  width: 100%;

  height: 100%;

  text-decoration: none;

  color: transparent;

  background-image: url(../img/logo_ucar.jpg);

  -webkit-background-size: 114px 30px;

  -moz-background-size: 114px 30px;

  -ms-background-size: 114px 30px;

  -o-background-size: 114px 30px;

  background-size: 114px 30px;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  -o-user-select: none;
  background-repeat: no-repeat;

  user-select: none;

}

.global-header .global-mazda-logo {
  position: absolute;
  top: 10px;
  left: 10px;
}

.global-header .global-mazda-logo a {
  display: block;
  width: 33px;
}

.global-header .global-mazda-logo a img {
  width: 33px;
}

/*

## .global-header



デフォルトのヘッダー



	<header class="global-header">

		<h1 class="global-header-logo"><a href="#">マツダ公式中古車検索サイト　Mazda U-car Search</a></h1>

		<a href="#" class="btn-favorite-check icon-star-bf-white">お気に入り</a>

	</header>

*/

/*

# GlobalFooter Class



サイト共通のフッター



#### [Use]



- `.inline-menu-black`



#### [Contents]



 - `.global-footer-copyright` コピーライト

*/

.global-footer .global-footer-copyright {

  padding: 20px 15px 20px;

  text-align: center;

  color: white;

  background: #212121;

  font-size: 12px;

  font-family: Helvetica, Arial, sans_serif;

}



/*

## .global-footer



デフォルトのフッター



	<footer class="global-footer">



		<nav class="inline-menu-black inline-menu-overflow-ellipsis">

			<a class="inline-menu-item icon-home-bf-litegrey" href="index.html">HOME</a>

			<a class="inline-menu-item icon-pagetop-bf-litegrey" href="#page-top">ページトップへ</a>

		</nav>



		<p class="global-footer-copyright">(c) Copyrights. All rights reserved.</p>



	</footer>

*/

.global-footer {

  background: #212121;

}



/*

# Mainvisual Class



メインビジュアル



#### [Option]



- `.mainvisual` デフォルトのメインビジュアル

- `.mainvisual-cardetail` 物件詳細ページにおけるメインビジュアル



#### [Contents]



- `.mainvisual-container` メインビジュアル内部のラッパー

- `.mainvisual-message` メインビジュアル内部に表示するメッセージ

- `.mainvisual-count` メインビジュアル内部に表示するカウント表示



*/

.mainvisual, .mainvisual-cardetail {

  overflow: hidden;

  width: 100%;

  text-align: center;

  background: black;

}

.mainvisual .mainvisual-container, .mainvisual-cardetail .mainvisual-container {

  height: 100%;

  display: inline-block;

}



/*

## .mainvisual



デフォルトのメインビジュアル



	<figure class="mainvisual">

		<div class="mainvisual-container">some objects</div>

	</figure>



*/

.mainvisual {

  height: 160px;

}



/*

## .mainvisual-cardetail



物件詳細ページにおけるメインビジュアル



	<figure class="mainvisual-cardetail">

		<div class="mainvisual-container"><div style="width:320px;height:225px;display:inline-block;line-height:225px;">some objects</div></div>

		<p class="mainvisual-message">{メッセージ本文}</p>

		<p class="mainvisual-count">1/10</p>

	</figure>



	<figure class="mainvisual-cardetail">

		<div class="mainvisual-container">

			<div style="width:320px;height:225px;display:inline-block;line-height:225px;">some objects</div>

			<a class="btn-mainvisual-pager-prev icon-btn-arrow-bf-white" href="#">前へ</a>

			<a class="btn-mainvisual-pager-next icon-btn-arrow-bf-white" href="#">次へ</a>

		</div>

		<p class="mainvisual-message">{メッセージ本文}</p>

		<p class="mainvisual-count">2/10</p>

	</figure>



*/

.mainvisual-cardetail {

  position: relative;

  padding: 5px 0 0;

  border-top: 1px solid #787878;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #3B3B3B),color-stop(2%, #3B3B3B),color-stop(10%, #000000),color-stop(100%, #000000));

  background-image: -webkit-linear-gradient(top, #3B3B3B 0%,#3B3B3B 2%,#000000 10%,#000000 100%);

  background-image: -moz-linear-gradient(top, #3B3B3B 0%,#3B3B3B 2%,#000000 10%,#000000 100%);

  background-image: -ms-linear-gradient(top, #3B3B3B 0%,#3B3B3B 2%,#000000 10%,#000000 100%);

  background-image: -o-linear-gradient(top, #3B3B3B 0%,#3B3B3B 2%,#000000 10%,#000000 100%);

  background-image: linear-gradient(to bottom, #3B3B3B 0%,#3B3B3B 2%,#000000 10%,#000000 100%);

}

.mainvisual-cardetail .mainvisual-container {

  position: relative;

  width: 100%;

  text-align: center;

}

.mainvisual-cardetail .mainvisual-message {

  padding: 15px 5px 15px;

  text-align: left;

  line-height: 1.5;

  letter-spacing: 0.04em;

  color: white;

  font-size: 12px;

  font-weight: normal;

}

.mainvisual-cardetail .mainvisual-count {

  position: absolute;

  right: 10px;

  top: 10px;

  padding: 8px;

  color: white;

  background: rgba(63, 63, 63, 0.8);

  font-size: 16px;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

}

.mainvisual-cardetail [class^="btn-mainvisual-pager-"] {

  position: absolute !important;

  bottom: 10px;

}



/*

# IntroductionView Class



ページの導入部分のスタイルの抽象クラス。



#### [Options]



- `.introduction-view` 基本的なページの導入部分のスタイル



#### [Contents]



 - `.introduction-view-logo-{logotype}` ロゴのラッパー `{logotype}` に内包するロゴ画像のタイプを設定

 - `.introduction-view-box` 角丸背景灰色のボックス

*/

.introduction-view {

  position: relative;

  padding: 10px 10px 0;

}

.introduction-view:before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

  width: 100%;

  height: 44px;

  border-top: 1px solid white;

  -webkit-box-shadow: inset white 0 -1px 2px;

  -moz-box-shadow: inset white 0 -1px 2px;

  -ms-box-shadow: inset white 0 -1px 2px;

  -o-box-shadow: inset white 0 -1px 2px;

  box-shadow: inset white 0 -1px 2px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #CCCCCC),color-stop(100%, #FFFFFF));

  background-image: -webkit-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -moz-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -ms-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -o-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: linear-gradient(to bottom, #CCCCCC 0%,#FFFFFF 100%);

}

.introduction-view [class^="introduction-view-logo"],

.introduction-view .introduction-view-box {

  position: relative;

  z-index: 1;

}

.introduction-view [class^="introduction-view-logo"] {

  padding: 5px 0 0;

  text-align: center;

}

.introduction-view .introduction-view-logo-mazudaucar {

  padding-top: 10px;

}

.introduction-view .introduction-view-logo-nintei {

  display: table;

  width: 100%;

  padding: 0;

}

.introduction-view .introduction-view-logo-nintei [class^="introduction-view-logo-nintei-"] {

  display: table-cell;

  vertical-align: middle;

}

.introduction-view .introduction-view-logo-nintei .introduction-view-logo-nintei-img {

  width: 58px;

}

.introduction-view .introduction-view-logo-nintei .introduction-view-logo-nintei-text {

  text-align: left;

  padding-left: 10px;

  text-indent: -0.5em;

  line-height: 1.2;

  letter-spacing: 0;

  color: #1a1265;

  font-weight: bold;

  font-size: 15.2px;

}

.introduction-view .introduction-view-box {

  margin-top: 10px;

  padding: 10px;

  background: #eeeeee;

  -webkit-border-radius: 2px;

  -moz-border-radius: 2px;

  -ms-border-radius: 2px;

  -o-border-radius: 2px;

  border-radius: 2px;

}

.introduction-view .introduction-view-box p {

  line-height: 1.3;

  letter-spacing: 0;

}

.introduction-view .introduction-view-note {

  padding-top: 10px;

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

}

.introduction-view [class^="btn"] {

  margin-top: 10px;

}

.introduction-view .btn {

  color: #008bd1;

}



/*

## .introduction-view



基本的なページの導入部分のスタイル



	<section class="introduction-view">

		<h1 class="introduction-view-logo-mazudaucar">{ロゴ画像}</h1>

		<div class="introduction-view-box">

			<p>テキストテキストテキストテキストテテキストテキストテキストテキストテテキストテキストテキストテキストテテキストテキストテキストテキストテ</p>

		</div>

	</section>

*/

.introduction-view {

  display: inherit;

}



/*

# Guide Objects



「マツダU-CAR SEARCH について」に使用されている要素の定義





## .guide-view



「マツダU-CAR SEARCH について」に使用されているコーナーのフォーマット



#### [Options]



 - `.guide-view-icon-car` ヘッダーにクルマのみのアイコンを表示するスタイル

 - `.guide-view-icon-map` ヘッダーに地図のアイコンを表示するスタイル

 - `.guide-view-icon-pc` ヘッダーにPCのアイコンを表示するスタイル



#### [Contents]



 - `.guide-view-header` タイトルを含むヘッダー

 - `.guide-view-title` ヘッダー内で使用するタイトル `<b>` で囲んだ箇所は太字になり、`<sup>` で囲んだ文字は上付き文字になる

 - `.guide-view-container` 内容のコンテナ

 - `.guide-view-description` コーナーの概要説明

 - `.guide-view-note` コーナーの補足情報





### [default]



	<section class="guide-view">

		<header class="guide-view-header">

			<h1 class="guide-view-title">テキストテキスト<br />テキストテキスト<b>テキストテキスト</b></h1>

		</header>



		<div class="guide-view-container">

			<p class="guide-view-description">テキストテキストテキストテキストテキストテキストテキストテキスト</p>

			<a href="#" class="btn icon-btn-arrow-bf-blue">テキストテキストテキストテキスト</a>

		<p class="guide-view-note">テキストテキストテキストテキストテ</p>

		</div>

	</section>



### [option:guide-view-icon-car]



	<section class="guide-view guide-view-icon-car">

		<header class="guide-view-header">

			<h1 class="guide-view-title">テキストテキスト<br />テキストテキスト<b>テキストテキスト</b></h1>

		</header>



		<div class="guide-view-container">

			<p class="guide-view-description">テキストテキストテキストテキストテキストテキストテキストテキスト</p>

			<a href="#" class="btn icon-btn-arrow-bf-blue">テキストテキストテキストテキスト</a>

		<p class="guide-view-note">テキストテキストテキストテキストテ</p>

		</div>

	</section>



#### [option:guide-view-icon-map]



	<section class="guide-view guide-view-icon-map">

		<header class="guide-view-header">

			<h1 class="guide-view-title">テキストテキスト<br />テキストテキスト<b>テキストテキスト</b></h1>

		</header>



		<div class="guide-view-container">

			<p class="guide-view-description">テキストテキストテキストテキストテキストテキストテキストテキスト</p>

			<a href="#" class="btn icon-btn-arrow-bf-blue">テキストテキストテキストテキスト</a>

		<p class="guide-view-note">テキストテキストテキストテキストテ</p>

		</div>

	</section>



#### [option:guide-view-icon-pc]



	<section class="guide-view guide-view-icon-pc">

		<header class="guide-view-header">

			<h1 class="guide-view-title">テキストテキスト<br />テキストテキスト<b>テキストテキスト</b></h1>

		</header>



		<div class="guide-view-container">

			<p class="guide-view-description">テキストテキストテキストテキストテキストテキストテキストテキスト</p>

			<a href="#" class="btn icon-btn-arrow-bf-blue">テキストテキストテキストテキスト</a>

		<p class="guide-view-note">テキストテキストテキストテキストテ</p>

		</div>

	</section>

*/

.guide-view {

  position: relative;

  padding: 15px 10px 25px;

}

.guide-view:after {

  content: "";

  position: absolute;

  bottom: 0;

  left: 0;

  width: 100%;

  height: 5px;

  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAQAAAAECAMAAACeL25MAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyRpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENTNiAoTWFjaW50b3NoKSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo2N0FFRDcwMUE1QjkxMUUyODA3RUZCM0IxN0JEMkQ4OSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo2N0FFRDcwMkE1QjkxMUUyODA3RUZCM0IxN0JEMkQ4OSI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjY3QUVENkZGQTVCOTExRTI4MDdFRkIzQjE3QkQyRDg5IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjY3QUVENzAwQTVCOTExRTI4MDdFRkIzQjE3QkQyRDg5Ii8+IDwvcmRmOkRlc2NyaXB0aW9uPiA8L3JkZjpSREY+IDwveDp4bXBtZXRhPiA8P3hwYWNrZXQgZW5kPSJyIj8+jBHpKAAAAAZQTFRFAHjL////zTdd1AAAAAJ0Uk5T/wDltzBKAAAAFUlEQVR42mJgYGRkBGEQwQBhAQQYAACaAA8lbQJhAAAAAElFTkSuQmCC) 0 0 repeat;

  -webkit-background-size: 2px 2px;

  -moz-background-size: 2px 2px;

  -ms-background-size: 2px 2px;

  -o-background-size: 2px 2px;

  background-size: 2px 2px;

}

.guide-view .guide-view-header {

  display: table;

  width: 100%;

}

.guide-view .guide-view-header:before {

  content: "";

  display: table-cell;

  width: 6px;

  height: 100%;

  background: #008bd1;

  -webkit-border-radius: 2px;

  -moz-border-radius: 2px;

  -ms-border-radius: 2px;

  -o-border-radius: 2px;

  border-radius: 2px;

}

.guide-view .guide-view-header:after {

  content: "";

  display: table-cell;

  width: 64px;

  height: 64px;

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAZ4AAACKCAMAAACtktwEAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpGQzdGMTE3NDA3MjA2ODExODA4MzlFRTA5NUY2MUZEMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo5NUY1ODQyN0E1QkQxMUUyODA3RUZCM0IxN0JEMkQ4OSIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo5NUY1ODQyNkE1QkQxMUUyODA3RUZCM0IxN0JEMkQ4OSIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6RkQ3RjExNzQwNzIwNjgxMTgwODM5RUUwOTVGNjFGRDEiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RkM3RjExNzQwNzIwNjgxMTgwODM5RUUwOTVGNjFGRDEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5brNImAAADAFBMVEWa2PRluNw9sONAsuW74vTE5fMRjsUMisJVs9xQvvAemM7U7PeEy+ocls1KuuxYxPQhmtDZ8Pp0wuVizPwon9SL1PWl2/Or3PEwptqJzetju+J8yu1Iueshmc7j8/pbyPfQ6vVbuuVNvO4upNgKicGx3vImntRSwPFyxek2q94alcyU0u1rvOBFtuh5xOV2zPJMtOJDtOZjwu2a0+zL6/mi1u1CtOar2e0zotMTkMcknNHZ7vgEhL04rN9VueW24PNswOVUu+pcvunp9fo6o9KSzuhErdvM6fZrwulStOA8r+JGtufC6PlMsN3J6PXq9vus4PhKrtp30vmz3O7e8fnt+P0on9U6ruHY8PoZlMv4/P7I5vRax/YXksmBxeMtotbR7fmLy+czqNyN0O4qm80Hhr9cyPdfwOw5rOBVwvN5xuk0qdxOvO6DyOYqodZKqtVtyvNeyflBsOJFseFhxvNgyvoxnMxOuOe65PdxvuAPjMReyvmw4vhNuekZkcUelck6q93Z7fYso9ht0f07rN5Wr9bq9/w9rd4yp9oWkcghlspAptM5qNnV7ffs9/xFqNQnntIWksmBzvBiyPZlzfxOve/S6/al2O48qdlUwfJfyvpWw/Npz/wlnNAtoNM1ptna8fs7ruIpoNVJt+hgy/s2qNp0yO2q1+vP6PM5odBoxvDU7vnG5/ZFs+QWj8Rbtt9dwu9Ar+BEtedPvu8Jhr44ptcQjMMxn9A3qtwRir9ivufW7voIh8AxpNe/5fYzptglms/U7vpnzvwYjsIzpddbwvBfw/Ha8PkroNMlndIQisEGhb0jnNE1qt0rotctpNjW7vjc8vzX7vhXxPRHuOpMu+3W7fgYk8o3q98VkchMvO0Ghb5Ht+k/qNcFhb7Y7/np9vs5reAvptpZxfUUjMLP6/jW7vmf2PFaxvU/rNtdyvnX7vk3qdt+yOgOi8MsodWo3/fT6/Z5weDV8v8LiL5Xv+1bx/ak3fdnv+cwptkck8ek1Olly/dGpc8vpdn///+FOvocAAABAHRSTlP///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////8AU/cHJQAAMVlJREFUeNq8nXtclNW+/wccEmU0RRhuMTnZJDqAowNiFgyC3BTGEJSdJHFxm5eUgp1CZrq9gRhqnBTNMhU1LxgbO+o+pJOnbRfPERTzgmUbqU3o74S77e+XcWofPeu5r7WetZ7nGaTf95Xmn9/Xen8/a33X51lrje7+/fuz3vdY8pd/w+JvUnzAxet8/MLGCiiq2DgtxbtMbAaxU4jnJ0yYcOrUGSH2gfiBiZUg0nz1s+6zMat2bdXvn0bjr78X4+TjXPQHcRvEq0w8xMeTTKxnYvbVq1efBTF69CAmBnIROmTIkHMgzoJ44gk/P789bLS0tKwawUXgPu9IMZPoTSue1pzJq+5kMmQInImfkMliJpPzTAQGBv7Z1s1mort/f8avxUte/394LlIqv1cdlGtoKlAyQ4RcxEHxEweFTeUeyKWx1NfKjsofPU68/upfsTH5WhoTwqAcPy4blNnEQQnlEpk4EUlkMRiUVQyeeyACK29lmINMTCbZa5c8dPtpTZncxjN5UszkTT4TPpFBUiJIJjOlTJgRYYbkh0ab2W5i8JiOP/700+pwHleGs/6qkAmUSygFDlMoIpxKEIV/Lm0HdG6f1JKJ5jIZBIuHXiascphMmGQKY0vAqBz4t/98+ukHVvGb6tpBVSxoh8mjsLCiZMZ93ayk/oqDclLboMjwqGiHxTNCwtNomDWr4eTXT6tXLDyfiNJ5SKIzW2Fmm4jNJ5J2AoVMmjuCZs36n3+V4flaYyZPyjOBpcOL+BwqHUw7IBOAp22NfZbu1/+Rw/maSOc2noqkYmXtTFTTTmHhwuY0ffSJPlWxNu20QNopLGQzMeujVzyYilW0M0RBO9/CmcTrdWuXKMj4JEk78kJhZ3sej0RHnGTP4tM9WydcoXB4Fi5sLjVs+qC3FaumnSGwdp6gaocb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);

  background-repeat: no-repeat;

  -webkit-background-size: 192px 64px;

  -moz-background-size: 192px 64px;

  -ms-background-size: 192px 64px;

  -o-background-size: 192px 64px;

  background-size: 192px 64px;

}

.guide-view .guide-view-title {

  display: table-cell;

  padding: 0 0 0 10px;

  vertical-align: middle;

  line-height: 1.2;

  letter-spacing: 0;

  color: #666666;

  font-weight: normal;

  font-size: 12px;

}

.guide-view .guide-view-title b {

  display: block;

  padding-top: 3px;

  color: black;

  font-size: 16px;

}

.guide-view .guide-view-title sup {

  text-align: left;

  font-size: 10px;

}

.guide-view .guide-view-container {

  padding: 5px 0 0;

}

.guide-view .guide-view-container .btn {

  margin-top: 10px;

  color: #008bd1;

}

.guide-view .guide-view-description {

  padding-top: 10px;

  line-height: 1.3;

  letter-spacing: 0;

}

.guide-view .guide-view-note {

  padding-top: 10px;

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

}

.guide-view.guide-view-icon-car .guide-view-header {

  position: relative;

}

.guide-view.guide-view-icon-car .guide-view-header:after {

  background-position: 0 50%;

}

.guide-view.guide-view-icon-map .guide-view-header {

  position: relative;

}

.guide-view.guide-view-icon-map .guide-view-header:after {

  background-position: -64px 50%;

}

.guide-view.guide-view-icon-pc .guide-view-header {

  position: relative;

}

.guide-view.guide-view-icon-pc .guide-view-header:after {

  background-position: -128px 50%;

}

.guide-view:last-of-type {

  padding-bottom: 30px;

}

.guide-view:last-of-type:after {

  display: none;

}



/*

# Nintei Objects



「マツダ認定U-carとは」に使用されている要素の定義





## .nintei-view



「マツダ認定U-carとは」に使用されているコーナーのフォーマット



#### [Use]



- `.btn-nintei`



#### [Options]



 - `.nintei-view`



#### [Contents]



 - `.nintei-view-header` タイトルを含むヘッダー

 - `.nintei-view-title` ヘッダー内で使用するタイトル

 - `.nintei-view-point-{count}` ヘッダー内で使用するポイント表示

 - `.nintei-view-container` 内容のコンテナ

 - `.nintei-view-description` コーナーの概要説明

 - `.nintei-view-checklist` チェックリスト表示

 - `.nintei-view-checklist-item` チェックリストのアイテム

 - `.nintei-view-checklist-item-oneline` チェックリストのアイテム（1行版）

 - `.nintei-view-corner` 「6つの安心・信頼」の各コーナー

 - `.nintei-view-corner-title` 「6つの安心・信頼」の各コーナーのタイトル

 - `.nintei-view-corner-pict` 「6つの安心・信頼」の各コーナーのイメージ





	<section class="nintei-view">

		<header class="nintei-view-header">

			<p class="nintei-view-point-1">ポイント1</p>

			<h1 class="nintei-view-title">テキストテキストテキスト<br />テキストテキストテキスト</h1>

		</header>



		<div class="nintei-view-container">

			<p class="nintei-view-description">テキストテキストテキストテキストテキストテキストテキストテキスト</p>

			<ul class="nintei-view-checklist">

				<li class="nintei-view-checklist-item">テキストテキスト<br />テキスト</li>

				<li class="nintei-view-checklist-item">テキストテキスト<br />テキスト</li>

			</ul>

			<ul class="nintei-view-checklist">

				<li class="nintei-view-checklist-item">テキストテキスト<br />テキスト</li>

				<li class="nintei-view-checklist-item-oneline">テキスト</li>

			</ul>



			<section class="nintei-view-corner">

				<h1 class="nintei-view-corner-title">テキストテキスト</h1>

				<figure class="nintei-view-corner-pict">{イメージ}</figure>

				<p class="nintei-view-description">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>

				<ul class="ninte-view-notes">

					<li>テキストテキストテキストテキストテキストテキストテキストテキスト</li>

					<li>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</li>

				</ul>

			</section>

		</div>

	</section>

*/

.nintei-view {

  position: relative;

  padding: 20px 10px 0;

}

.nintei-view .nintei-view-header {

  display: table;

  position: relative;

  width: 100%;

  height: 80px;

  background: #d9d9ea;

  border: 1px solid #b1b1b1;

  border-bottom: 0;

  -webkit-border-radius: 3px 3px 0 0;

  -moz-border-radius: 3px 3px 0 0;

  -ms-border-radius: 3px 3px 0 0;

  -o-border-radius: 3px 3px 0 0;

  border-radius: 3px 3px 0 0;

}

.nintei-view .nintei-view-title {

  display: table-cell;

  padding-left: 95px;

  vertical-align: middle;

  line-height: 1.2;

  letter-spacing: 0;

  color: #1a1265;

  font-weight: bold;

  font-size: 17.1px;

}

.nintei-view [class^="nintei-view-point-"] {

  position: absolute;

  top: 50%;

  left: 10px;

  margin-top: -35px;

  width: 70px;

  height: 70px;

  line-height: 30px;

  text-align: center;

  color: transparent;

  background-repeat: no-repeat;

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAARgAAACMCAYAAACnDrZtAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpGQzdGMTE3NDA3MjA2ODExODA4MzlFRTA5NUY2MUZEMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4NzBGMzEyM0E2NkIxMUUyQjI4RENCQzg5RUJGNUU2QiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4NzBGMzEyMkE2NkIxMUUyQjI4RENCQzg5RUJGNUU2QiIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NzEzQjhDQTYxMTIwNjgxMTgyMkFEODczRDk4RkFEN0IiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RkM3RjExNzQwNzIwNjgxMTgwODM5RUUwOTVGNjFGRDEiLz4gPC9yZGY6RGVzY3Jp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);

  -webkit-background-size: 140px 70px;

  -moz-background-size: 140px 70px;

  -ms-background-size: 140px 70px;

  -o-background-size: 140px 70px;

  background-size: 140px 70px;

}

.nintei-view .nintei-view-point-1 {

  background-position: 0 0;

}

.nintei-view .nintei-view-point-2 {

  background-position: -70px 0;

}

.nintei-view .nintei-view-container {

  padding: 1px 0 10px;

  background: #f2f2f2;

  border: 1px solid #b1b1b1;

  border-top: 0;

  -webkit-border-radius: 0 0 3px 3px;

  -moz-border-radius: 0 0 3px 3px;

  -ms-border-radius: 0 0 3px 3px;

  -o-border-radius: 0 0 3px 3px;

  border-radius: 0 0 3px 3px;

}

.nintei-view .nintei-view-description {

  padding: 10px 10px 0;

  line-height: 1.3;

  letter-spacing: 0;

}

.nintei-view .ninte-view-notes {

  padding: 10px 10px;

  list-style: none;

}

.nintei-view .ninte-view-notes li {

  position: relative;

  padding-left: 1em;

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

}

.nintei-view .ninte-view-notes li:before {

  content: "※";

  display: inline-block;

  position: absolute;

  left: 0;

  top: 0;

  width: 1em;

  text-align: center;

}

.nintei-view .nintei-view-checklist {

  display: -webkit-box;

  display: -moz-box;

  display: -ms-box;

  display: -o-box;

  display: box;

  list-style: none;

  padding: 10px 15px 0;

}

.nintei-view .nintei-view-checklist [class^="nintei-view-checklist-item"] {

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  position: relative;

  width: 50%;

  padding: 10px;

  text-align: center;

  line-height: 1.2;

  letter-spacing: 0;

  background: white;

  font-weight: bold;

  font-size: 10px;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

  -webkit-box-shadow: rgba(0, 0, 0, 0.1) 1px 1px 5px;

  -moz-box-shadow: rgba(0, 0, 0, 0.1) 1px 1px 5px;

  -ms-box-shadow: rgba(0, 0, 0, 0.1) 1px 1px 5px;

  -o-box-shadow: rgba(0, 0, 0, 0.1) 1px 1px 5px;

  box-shadow: rgba(0, 0, 0, 0.1) 1px 1px 5px;

}

.nintei-view .nintei-view-checklist [class^="nintei-view-checklist-item"]:nth-of-type(even) {

  right: -5px;

}

.nintei-view .nintei-view-checklist [class^="nintei-view-checklist-item"]:nth-of-type(odd) {

  left: -5px;

}

.nintei-view .nintei-view-checklist [class^="nintei-view-checklist-item"]:before {

  content: "";

  display: block;

  position: absolute;

  left: -5px;

  top: -5px;

  width: 25px;

  height: 24px;

  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAwCAYAAABT9ym6AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpGQzdGMTE3NDA3MjA2ODExODA4MzlFRTA5NUY2MUZEMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo4NzA3MEEyOUE2NkIxMUUyQjI4RENCQzg5RUJGNUU2QiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo4NzA3MEEyOEE2NkIxMUUyQjI4RENCQzg5RUJGNUU2QiIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NzEzQjhDQTYxMTIwNjgxMTgyMkFEODczRDk4RkFEN0IiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RkM3RjExNzQwNzIwNjgxMTgwODM5RUUwOTVGNjFGRDEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz4uupGvAAAEHElEQVR42tSaaUgVURTHx9KwEitaqIgCsQ3yQwtJmVsZ5Z5G2UIbESW2iVS2QkGZiJVWFFSEFRTtPDVNbbPVUPvQ1yhaTELaJAz0PV//g+fJoO+9mXvfMq8DP0Zn7r0z/7nbOWeen9VqVUTsbtkbxUhblDRV/SzJODTiXJO/aEOdnYrhdtv0ZjwOZ8A8MIrOSQixGqnB7+bdxiwcC0AgPQ5okRRimIih4DyNLtW5b0vTp1n+px4JA2VgbI/zX2x/iAuxeF1EHLgFgu1c+ywtxOLdHlkFLoAAB9eb5YVYvCZkHc+JPk7KfHNBiFdErAXnNESQ/fblHlnBPdFXR9m/viokXEAEWYe8ELPHhISCUtBfoE5/X5sjg0A5GC5Yb4S0ELP7e8QPXAITJOqG+NIc2QtSXNjxu96GqBt/JP+5O0VEgwcCk7uXo0E+2J5dEb+MHFpDQIkLIhTeZ8iFuWnkqnUWjHNDOyulhJjNbhGxDCx1QzvvQINRq9YwUOxiG01gH7iSnxdlNkpIscR+oTZaqrcXFkT/VJ/0tpBYsFyyLvlVmUXHY0rsXZQREoTDQe7eYwJVKaY4LSniK0gCDlM4QkI2Zj7M4IcfDb6zg9eqs/pWMFlCxFuQqI4GpYWs3/BgIg6neM1WJwOyuXe0bCQ4ICHiFYgHv7QKOhWyZl0NeZf7QQ7oZ6cICTkJfmjc56iDmNuZPQSp4I+ewg6FrFxVTY0UaWxa5LXuALudlKHU4GpBEc8AZRHb9FboJSRjeVUIL5GJOtvYAk6o4+ee7hl7uHqtnid2m4jybiGLl9ynzN1OkCsY3AzkOtl2rs0BCwUndoI6FhcSkppWuYAnc6jk8rgJFCqqhBlbnqC7Qc/RIvMA/onJlfRGI8FgFza6QHYZNqnOLeAe0WMtvDo1S0dntnhkYXzFAB4eNEyCJNqiRAAt0x/4/1p+QVpGc2EuqNNzk8qKeOdCbBY3/x6l6Q/R9iE4SRWOLygnFcErj2ZUANKBSe8NaqoT9AmxWUxsOflFFwVjBnqwKSBfZ/iay2V12+NHiWJCyCKjyoLZDVkicK+n3CNaWULyYteIjt+ntUniQmw2a3bpNqXr40qAm6LDBp4/f0UrvnyRLC+EbGZ46Wwc7qhzSZJGK9QM8Emm8us6F4WQTZ9uol2fEmmTJEVYeMOrku7KhhSHWQiRRt5bLNYIUEv5LQkOgyrJuk5zajIJuh+8ed3mTU+vPeFl3SMmm/tt4+X1OrvaWtbKK5TFh4R0d287L8vXeFNzZpvBR8WD5uo3xA5OJpicDLMb4LLiYXPHV9127pH7dpzE5h6OpA8Jsf9Vt42DIdrVw1Tnc3SEwUYJcXjpN+8RL8EYjrmvKl4yd//ygQKrNFANshQvmid+i1LPw+uLN4X8E2AABHKS4uW9I/AAAAAASUVORK5CYII=) 0 0 no-repeat;

  -webkit-background-size: 25px 24px;

  -moz-background-size: 25px 24px;

  -ms-background-size: 25px 24px;

  -o-background-size: 25px 24px;

  background-size: 25px 24px;

}

.nintei-view .nintei-view-checklist .nintei-view-checklist-item-oneline {

  padding: 17px 10px 10px;

}

.nintei-view .nintei-view-corner {

  position: relative;

  margin: 10px 10px 0;

  padding: 0 0 10px;

  background: white;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

}

.nintei-view .nintei-view-corner-title {

  position: relative;

  z-index: 3;

  padding: 15px 10px;

  text-align: center;

  color: #1a1265;

  background: white;

  font-size: 16px;

}

.nintei-view .nintei-view-corner-title:after {

  content: "";

  display: block;

  position: absolute;

  bottom: -14px;

  left: 0;

  width: 100%;

  height: 14px;

  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAjQAAAAcCAYAAAB26yVxAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpGQzdGMTE3NDA3MjA2ODExODA4MzlFRTA5NUY2MUZEMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo1QjJFQTE0NEE2OEExMUUyQjI4RENCQzg5RUJGNUU2QiIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo1QjJFQTE0M0E2OEExMUUyQjI4RENCQzg5RUJGNUU2QiIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NzEzQjhDQTYxMTIwNjgxMTgyMkFEODczRDk4RkFEN0IiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RkM3RjExNzQwNzIwNjgxMTgwODM5RUUwOTVGNjFGRDEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz7JF7eJAAAESElEQVR42uyd23LDIAxErcn/f7P62mbaaWy0qxWsHhMQAgQ65mLHdV1xYSUIeWMhTQDyxaKOO78HwIYA2Xq33Sr78U5/502/fZLn3Z4EjsXf9GbB+FSU/KDO1eVFYRlZlD6/+eVqmblgQ1WeO79nYd47v6HsR7UpOh1j/P2QF2lCC3C+1XRPgyw78LNAhwEpsdCnQfSbIPo7Ss8OduSlI9moJ4XSqIHMpzBTBReoOnT4ZA4ch39OVKqrNFGcdjWNOtygV1FYqzGrwBJAv4yGcaAOPDtJCulE50vg/12wkyK60eDG7OdOX74lL+LEGKT8Femqg+0E0Iiiuj4FnCpQQcBM5yqNwWU/0GEEBeY2AwtskGByt0wlYEGDTE4Zo6wVGnaAqDxPURnQp8ANIs8qKFYDzRM/DKK/G3zmgQqqHOQTdEXQQ6z0KG1bVcPNKsgwVm3YAF4yxpgrNB2BoSIAss96BDh9NfR0QwwKYKLJxw0oZwCQ6pmHjm0oFfBRLaPS93LYOLklXUDDDBiM1RpEXgaoIGxDtyUKTBQARlk666e25J1iOrueyrMpP2P1BgEl+XB8ZYNPTtlm+mFv15ZTRwBhnr9gbskwt8WQYIeCjxD3SwPTkMlSUG+C83TflmKBSNd/jP+f+koKjpePgUZhMmXdHmFe6Y3N/1MFmekQY3g5E3SYQWQa2CDBIcnlrequTDMJYv4tYxegQT+5s856dL50TuWsi9q7YULU16+D7FJ7GpwGPJ3vu2EFaLWzPWzY6wIZ1jj8SP9LdKJjBp9KsGHd1Alx/QgwCVH/6RgzXsGZD0oKh4tVr4GrgIYCyKBhZquHCeatj67JO4TaRQF4EHoQAPM0j7ePzgakPMi+jidrVHql1Z5qm3a5Sp3q42YC0FSVrfK2YgQAqKdjgYn6Venp4NBlfw5vtxTWywqM01eDutOt9FduMA7LgUZlkuv8Tg4yTzTrVfpcwAnvgHn/cKC3kQwtd8uLq/+JW+FsB0JvCtjZDTBdfr31xK8OOYygraR7KqTEID883cbJoKFoY/ehT8VArqY/h/fxNkCzO+R0BtOOw62dB2onfv9oR0CYUqfcsO1zYBmdwXgCaHXnVRw7kPJfQIOVJsUd4KYbOGKT9p8WzL0VZYjqsmXye3a64aWq/U5/A7DsZHlKoFBaqTjlxk8cNI4sBqVJ5e+0GqSsRxlaaPY4EOyzCjBJZ17cLaG89oAOg9OZsDGxDjlM90SwSPua7gR58ttTw7pH+YXBwnIiRO3w0rYc3DYGmMETs2+M9JUX7muDi8XBY4BdO4KEb+YdNGGH7R3XVuH+sliODX5KtqbbYEtbt528/TZWt6tBxWIZHpyG2J9uU0/yrt9Z9TFM/N0m6TYyMLiNbLPr40Djup/brwYAi8VBz3U0XDsouM3cThaLxUHX7eSgY3H/WCwWiyHD4oBpcR9ZLBaLYcZSJV8CDAD5tpdLnwp9wgAAAABJRU5ErkJggg==) 50% 100%;

  -webkit-background-size: cover;

  -moz-background-size: cover;

  -ms-background-size: cover;

  -o-background-size: cover;

  background-size: cover;

}

.nintei-view .nintei-view-corner-pict {

  padding: 15px 0 0;

  text-align: center;

}

.nintei-view > .btn-nintei {

  margin: 15px 0 15px;

}

[class^="introduction-view"] + .nintei-view {

  padding-top: 30px;

}



/*

# Guarantee Objects



「マツダならではの安心保証」に使用されている要素の定義





## .guarantee-view



「マツダならではの安心保証」に使用されているコーナーのフォーマット



#### [Options]



 - `.guarantee-view` 基本的なスタイル

 - `.guarantee-view-blueline` ブルーのラインがついたスタイル



#### [Contents]



 - `.guarantee-view-header` タイトルを含むヘッダー

 - `.guarantee-view-label` ヘッダー内で使用するコーナーのラベル

 - `.guarantee-view-logo-group` ロゴを含むコーナーのヘッダー

 - `.guarantee-view-logo` ロゴ

 - `.guarantee-view-logo-copy` ロゴのセットで表示されるコピー。`<b>` でマークアップした箇所を強調表示する。

 - `.guarantee-view-container` 内容のコンテナ

 - `.guarantee-view-description` コーナーの概要説明

 - `.guarantee-view-notes` コーナーの補足情報（複数）

 - `.guarantee-view-notes-large` コーナーの補足情報（複数・文字サイズ大）

 - `.guarantee-view-pict` コーナー内の図説など

 - `.guarantee-view-table` 表のスタイル

 - `.guarantee-view-table-price` 価格表のスタイル

 - `.guarantee-view-box` ボックス（コンテンツ内に並列のセクションを含む場合は `<div>`でマークアップし、`<section>` で内容を仕切る）





	<section class="guarantee-view guarantee-view-blueline">



		<header class="guarantee-view-logo-group">

			<p class="guarantee-view-logo-copy">テキスト<br /><b>テキスト</b>テキストテキスト</p>

			<h1 class="guarantee-view-logo">{ロゴ画像}</h1>

		</header>



		<div class="guarantee-view-container">

			<p class="guarantee-view-description">テキストテキストテキストテキストテキストテキスト</p>

			<figure class="guarantee-view-pict">{イメージ}</figure>

			<ul class="guarantee-view-notes">

				<li>テキストテキストテキストテキスト</li>

				<li>テキストテキストテキストテキスト</li>

				<li>テキストテキストテキストテキストテキスト</li>

			</ul>

		</div>



		<section class="guarantee-view">

			<header class="guarantee-view-header">

				<h1 class="guarantee-view-label">テキストテキストテキストテキストテキストテキスト</h1>

			</header>



			<div class="guarantee-view-container">

				<div class="guarantee-view-table-price">

					<table>

						<colgroup>

							<col width="19%">

							<col width="27%">

							<col width="27%">

							<col width="27%">

						</colgroup>

						<thead>

							<tr>

								<th>テキストテキスト</th>

								<th>テキストテキスト</th>

								<th>テキストテキスト</th>

								<th>テキストテキスト</th>

							</tr>

						</thead>

						<tbody>

							<tr>

								<th>テキストテキスト</th>

								<td>9,999円</td>

								<td>9,999円</td>

								<td>9,999円</td>

							</tr>

						</tbody>

					</table>

				</div>



				<ul class="guarantee-view-notes">

					<li>テキストテキストテキストテキスト</li>

					<li>テキストテキストテキストテキストテキストテキスト</li>

				</ul>



				<div class="guarantee-view-box">

					<section>

						<h1>テキストテキスト</h1>

						<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>

					</section>



					<section>

						<h1>テキストテキスト</h1>

						<p>テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>

					</section>

				</div>



				<a href="#" class="btn icon-btn-arrow-bf-blue">label</a>

			</div>

		</section>



	</section>



*/

.guarantee-view {

  position: relative;

  border-top: 1px solid #dddddd;

}

.guarantee-view:before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

  width: 100%;

  height: 44px;

  border-top: 1px solid white;

  -webkit-box-shadow: inset white 0 -1px 2px;

  -moz-box-shadow: inset white 0 -1px 2px;

  -ms-box-shadow: inset white 0 -1px 2px;

  -o-box-shadow: inset white 0 -1px 2px;

  box-shadow: inset white 0 -1px 2px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #CCCCCC),color-stop(100%, #FFFFFF));

  background-image: -webkit-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -moz-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -ms-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -o-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: linear-gradient(to bottom, #CCCCCC 0%,#FFFFFF 100%);

}

.guarantee-view .guarantee-view-header {

  position: relative;

  z-index: 1;

}

.guarantee-view .guarantee-view-label {

  padding: 10px 10px 8px;

  line-height: 1.5;

  letter-spacing: 0.04em;

  border-top: 1px solid white;

}

.guarantee-view .guarantee-view-logo-group {

  position: relative;

  z-index: 1;

  padding: 15px 0 0;

  text-align: center;

  color: #008bd1;

}

.guarantee-view .guarantee-view-logo {

  padding: 7px 0 0;

}

.guarantee-view .guarantee-view-logo-copy {

  line-height: 1.5;

  letter-spacing: 0.04em;

  font-weight: bold;

  font-size: 16px;

}

.guarantee-view .guarantee-view-logo-copy b {

  margin: 0 3px 0;

  padding: 1px 3px 0px;

  display: inline-block;

  color: white;

  background: #008bd1;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

}

.guarantee-view .guarantee-view-description {

  padding: 10px 10px 0;

  line-height: 1.3;

  letter-spacing: 0;

}

.guarantee-view .guarantee-view-logo-group + .guarantee-view-description {

  padding-top: 0;

}

.guarantee-view [class^="guarantee-view-notes"] {

  padding: 10px 10px 0;

  list-style: none;

}

.guarantee-view [class^="guarantee-view-notes"] li {

  position: relative;

  padding-left: 1em;

  line-height: 1.2;

  letter-spacing: 0;

  color: #3f3f3f;

  font-size: 12px;

}

.guarantee-view [class^="guarantee-view-notes"] li:before {

  content: "※";

  display: inline-block;

  position: absolute;

  left: 0;

  top: 0;

  width: 1em;

  text-align: center;

}

.guarantee-view .guarantee-view-notes-large li {

  line-height: 1.3;

  color: black;

  font-size: 14px;

}

.guarantee-view .guarantee-view-pict {

  padding: 15px 10px 0;

  text-align: center;

}

.guarantee-view [class^="guarantee-view-table"] {

  padding: 10px 10px 0;

}

.guarantee-view [class^="guarantee-view-table"] table {

  width: 100%;

  border-collapse: collapse;

  border: 1px solid #b1b1b1;

}

.guarantee-view [class^="guarantee-view-table"] table th, .guarantee-view [class^="guarantee-view-table"] table td {

  padding: 7px 3px;

  line-height: 1.2;

  letter-spacing: 0;

  font-weight: normal;

  font-size: 9.6px;

  border: 1px solid #b1b1b1;

}

.guarantee-view [class^="guarantee-view-table"] table thead th {

  text-align: center;

  background: #eeeeee;

  border-left: 1px solid #b1b1b1;

}

.guarantee-view [class^="guarantee-view-table"] table td {

  height: 2.5em;

  padding: 5px;

  text-align: left;

  font-size: 9.6px;

}

.guarantee-view [class^="guarantee-view-table"] table td > p {

  padding: 0 15px;

  font-size: inherit;

  line-height: 1.2;

  letter-spacing: 0;

}

.guarantee-view [class^="guarantee-view-table"] table td strong {

  line-height: 1.2;

  letter-spacing: 0;

  color: #be0000;

  font-size: inherit;

  font-weight: normal;

}

.guarantee-view .guarantee-view-table-price tbody td {

  text-align: right;

}

.guarantee-view .guarantee-view-table-price tbody th {

  text-align: left;

}

.guarantee-view .guarantee-view-table-price tbody td, .guarantee-view .guarantee-view-table-price tbody th {

  padding-left: 5px;

  padding-right: 5px;

}

.guarantee-view .guarantee-view-table-price thead th {

  padding-left: 2px;

  padding-right: 2px;

  font-size: 8px;

}

.guarantee-view .guarantee-view-box {

  margin: 20px 10px 0;

  padding: 15px;

  background: #eeeeee;

  -webkit-border-radius: 2px;

  -moz-border-radius: 2px;

  -ms-border-radius: 2px;

  -o-border-radius: 2px;

  border-radius: 2px;

}

.guarantee-view .guarantee-view-box h1 {

  font-weight: normal;

  font-size: 16px;

}

.guarantee-view .guarantee-view-box p {

  padding-top: 10px;

  line-height: 1.3;

  letter-spacing: 0;

}

.guarantee-view .guarantee-view-box p strong {

  color: #be0000;

  font-weight: normal;

}

.guarantee-view .guarantee-view-box section {

  padding: 15px 0;

  border-top: 1px solid white;

  border-bottom: 1px solid #b1b1b1;

}

.guarantee-view .guarantee-view-box section:first-of-type {

  padding-top: 0;

  border-top: 0;

}

.guarantee-view .guarantee-view-box section:last-of-type {

  padding-bottom: 0;

  border-bottom: 0;

}

.guarantee-view .guarantee-view-container {

  position: relative;

  z-index: 1;

  padding-bottom: 20px;

}

.guarantee-view .guarantee-view-container .guarantee-view-description:first-child {

  padding-top: 0;

}

.guarantee-view .guarantee-view-container [class^="guarantee-view-notes"]:first-child {

  padding-top: 0;

}

.guarantee-view .guarantee-view-container .btn {

  width: auto;

  margin: 10px 10px 0;

  color: #008bd1;

}

.guarantee-view .guarantee-view-container .btn[href^="#guarantee-"]:before {

  -webkit-transform: rotate(90deg);

  -moz-transform: rotate(90deg);

  -ms-transform: rotate(90deg);

  -o-transform: rotate(90deg);

  transform: rotate(90deg);

}

.guarantee-view .guarantee-view-container .guarantee-view-box + .btn {

  margin-top: 20px;

}

.guarantee-view.guarantee-view-blueline {

  border-top: 3px solid #008bd1;

}



.introduction-view + [class^="guarantee-view"] {

  margin-top: 20px;

}



/*

# FAQ Objects



「よくあるご質問」に使用されている要素の定義





## .faq-view



「よくあるご質問」に使用されているコーナーのフォーマット



#### [Options]



 - `.faq-view` 基本的なスタイル



#### [Contents]



 - `.faq-view-header` QAの内容を含むヘッダー

 - `.faq-view-question` 質問内容

 - `.faq-view-answer` 回答

 - `.faq-view-container` 内容のコンテナ

 - `.faq-view-description` コーナーの概要（QAの内部で使われる場合は詳しい回答の内容）

 - `.faq-view-pict` コーナー内の図説

 - `.faq-view-notes` コーナー内の補足情報

 - `.faq-view-examples` コーナー内の事例表記のためのスタイル

 - `.faq-view-indexlist` コーナーの索引リスト

 - `.faq-view-topagetop` 「▲ページ上部へ」のリンク

 - `.faq-view-backlink` 「戻る」リンクボタンのラッパー





	<section class="faq-view">

		<p class="faq-view-description">さわやかプラスに関する、よくあるご質問をまとめました。</p>

		<ul class="faq-view-indexlist">

			<li><a href="#" class="btn icon-btn-arrow-bf-blue">label</a></li>

			<li><a href="#" class="btn icon-btn-arrow-bf-blue">label</a></li>

		</ul>

	</section>



	<section class="faq-view">



		<header class="faq-view-header">

			<p class="faq-view-question">質問文質問文質問文質問文質問文質問文質問文</p>

			<p class="faq-view-answer">回答文回答文回答文回答文回答文回答文回答文回答文</p>

		</header>



		<div class="faq-view-container">

			<p class="faq-view-description">テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト</p>

			<ol class="faq-view-example">

				<li>テキストテキストテキストテキスト</li>

				<li>テキストテキストテキストテキストテキストテキスト</li>

			</ol>

			<ul class="faq-view-example">

				<li>テキストテキストテキストテキスト</li>

				<li>テキストテキストテキストテキストテキストテキスト</li>

			</ul>

			<ul class="faq-view-notes">

				<li>テキストテキストテキストテキストテキストテキストテキスト</li>

			</ul>

			<figure class="faq-view-pict">{イラスト等}</figure>

		</div>



		<p class="faq-view-topagetop"><a href="#page-top">▲ページ上部へ</a></p>

	</section>



	<section class="faq-view">

		<p class="faq-view-backlink"><a href="#" class="btn icon-btn-arrow-bf-blue">戻る</a></p>

	</section>



*/

.faq-view {

  position: relative;

  padding: 10px 10px 15px;

  border-top: 1px solid #cccccc;

}

.faq-view:before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

  width: 100%;

  height: 44px;

  border-top: 1px solid white;

  -webkit-box-shadow: inset white 0 -1px 2px;

  -moz-box-shadow: inset white 0 -1px 2px;

  -ms-box-shadow: inset white 0 -1px 2px;

  -o-box-shadow: inset white 0 -1px 2px;

  box-shadow: inset white 0 -1px 2px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #CCCCCC),color-stop(100%, #FFFFFF));

  background-image: -webkit-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -moz-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -ms-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -o-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: linear-gradient(to bottom, #CCCCCC 0%,#FFFFFF 100%);

}

.faq-view .faq-view-header {

  position: relative;

  z-index: 1;

}

.faq-view .faq-view-header p {

  position: relative;

  min-height: 36px;

  padding-left: 46px;

  line-height: 1.3;

  letter-spacing: 0;

}

.faq-view .faq-view-header p:before {

  content: "";

  display: block;

  position: absolute;

  left: 0;

  top: 0;

  width: 36px;

  height: 36px;

  color: transparent;

  background-repeat: no-repeat;

  background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAEgAAACQCAMAAACcXt03AAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2hpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMy1jMDExIDY2LjE0NTY2MSwgMjAxMi8wMi8wNi0xNDo1NjoyNyAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDpGQzdGMTE3NDA3MjA2ODExODA4MzlFRTA5NUY2MUZEMSIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDo5NTE2NDJGMUE5OUQxMUUyQkNFRTg3NzJBODI0NjNCMCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDo5NTE2NDJGMEE5OUQxMUUyQkNFRTg3NzJBODI0NjNCMCIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M2IChNYWNpbnRvc2gpIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6NzczRjFFMEMzNzIwNjgxMTgwODNEQ0IzODZBNDIwNTUiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6RkM3RjExNzQwNzIwNjgxMTgwODM5RUUwOTVGNjFGRDEiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz5ojPlbAAADAFBMVEXZ7NlWq/M2qDbK4ftgumBWtlZHo/JStFL2+/ZErkQUiu5auFpPp/Iaje9vtvQdju9Ps09OpvLD4sNttfQ6qjpyw3Iej+9Yt1hnvWdpvmkulvBswGxCoPHI5Mg8qzwqlPBxwnEgkO9JsEk0mvBKsUpuwW4xmPBns/S01PjB3PlAn/E/rD+nzfdKpPLj8eOi06J0w3Reul58u/We0J4+n/Hn8v283PphsPTs8/2eyvdIpPKr0Pg6nPGTzZO73btarPP2+f6Tw/Z/wn9os/TS5fuMwvbi7vxQs1AymfA2m/FYq/NMskw5nPGNvvVqv2qYzZjt9u2x2bFRslGo1qgike9JofFrtPRUqfMslvCOyo6DuvVUtVRiu2JArUDZ6fxkrvNzv3NFovFfrvPf7fw9mvBctFxCofFLrktuvW7W5vtorfNir/TX5/tmumYVie5vtPRhsPN/uPVzt/UtlfD///8poyknoicTie4moSYspCx2uvWByYF/yH9yuPV+yH53xXcooigSie4Wiu4Wi+4Xi+4qoyoroysZjO8SiO4YjO4upS6DyoMtpS0vpS8wpjAxpjEypzJ3uvWCyoJ3u/UZjOcloSUzpzM0pzSCyYJ1ufV0ufWAyYBzufVxt/Vwt/Qmk+99x30lku98x3wnk/A1qDV7x3sjke96xnpNpvI3qTc7nfE9nvFBoPF7xntMpfJSqPIplPB4xXh5xnlduV1jvGNFr0U3m/FkvGR2xHZZrPN1xHVDrkNCrUJcuFxptPRlvGVeuV5rwGtksfRRqPJlsvRdrvNgr/NnvmdTqfJbrfNlvWVTqfNVqvNEovJcuVxZt1lVtlUpoilwwXBLsku41/kYjOp7tvQvl/B3xHczmfArpCsrlfCJxolXtVdgt2DJ58nw9v5OsE53ufVDofFGovKFxoVJpPJnr/RWpfKByIFyufV0uPVgp/I5qjkXjO7Q59DS6dJ8wXwok/CXyfeZzPhovWhrvGuFy4Vss/Su2K5iqPJ6xXrY6fwnlO9TqPL///9glTvTAAABAHRSTlP///////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////////8AU/cHJQAABktJREFUeNqs2XlcFGUYwPEHFhEFbUM0lgTlcGWBwJNAc4GMQ1YQ01AuRSE0Q9JcK8uDslM7LDvtMJU00Lxiwds0wTDMVBTJEkszO83oztp2552ZnZ193ll2Z75/6OzMvL/PzuzuO68fwZzWsVK2VJUZ0oY8L1fPOU1NKvj1QXlW5U5PssiFlfIyA5t2MpLgNRkWcRkLWOW2RYeSMm3gDTd9N3CnhxAscs++Jg8PBUK9GprF4E3X9WxsdgRvuexQ8yQE9HRRbtJHKFdDc/7bgoNersjN/JDGpdCcLX5UkOtEakdLfHxMx1e5uaMz/STAPikjrxk553X3XC8FRtNFJhvt3Pbnu3QwkOb7EqNYcuJmKjhEce9wIyLR5ZCgM7ykxHaNKZco4CAunh1YknjwYPOIEfz9Ss4cgYObUUPYzkjLtp+3VWYa2aPyxlFCKr7TuPkiwZW+uYiCRkwvciEljY0Nl6Zx8kkochoKpmNi2Ds7PeniBZspzM6ECyhowJArO9/gcbRMoIPkp5ZhoAlDPnvVpLJNQlNJKHUTBg+RES1RIuxNisLATsRoMiJrmAj53FqGYSATkUpCczeKkLs9ZSMGPBBcqEaEDdVgAHmyNLsVwh4tXGisCBsai4GPEXez38c6kQTyu6nDAPZo8TPiI4xSIWwiryGf87Vwe6dJ6HQ4BgsNC28hQ+6wP5fdG46HHKfxTW1tWexNarNDbpGqDQUOk+8FrQWZRhK0QilsXYtyCHlnWHfryCCd4MxZJJ6spYRusued0Wp1mZ1qW1o5bMeY2IoD0dQ7JogYyZYSUvpaX85i36IxLYhCFKqZzEmzPRbLBduXJ1OA3QwedZYXlYY8H5NnnaWBowJl8/rZRJU7dMqj+lGBcALXbrWTkmCfyd8qAfra1K0Ty9fxLdXldZLANn1v/Hc1JpItRZaulgK26XveGhx3r5J1+aVrqICfdLXrKUoFn19CeWRMDHoWHxq7nqo00u6m6/AQN+f+EiphrvDz+xs9hQtpQ6Vl8am78BPgFkZdaB9n5urIzzYLPwzkGbC1T2f8kBWjU1GOATNza6+TDcZYTVQgZJ24g3rIx4T6KBGyPADWPaEAyMjQ9nhKAaDVrn9UCaBt/WmpEqB14iOKgKCl3RUBod0VCnW/XxlQoUynAoIeVsRZiK94UgEV8WDWaU+9KNOpVp0ZzLFxy2Ub1W6G2D9ekGvDAI2mHeJelefbM9kaix2w/CE5Fg7SBDJ+A0UyFvC62xb3PhxoAwvdtHhQ4H4hd0NnNPvtwWJ3bM+uF3MntHZArSN422W96wsRsNZF2zSFKHjHNScKvXDwniu2BXrRwAYXnPCig+2dtiTwAwmwrbP6e70vBZZ0UvZeaZ0M7ar3dQJ2dEb/wb5OQ7uc0cfGxgLkHXMCBjmTwyyK229wAno7MYEs031md5HmNATsgj/OWai/tH+4fznEFkhzEjrwF/9vmWInoQFSNAU5fMi/qyTJUGDXq8yNDmb+dD90JD2dSQSPYt7SqHQpcCNVbbpa7cMUyF8/q6XAAZpay9GhzDWp1cwbM86UDGVTFBosmC9RsMFArm2CQQItVGuIiIj4ndwbyxZzbTkREkCDYjoR4/nh5Nq+lgodxtQbwqyYL5HeukWuLTiMDgIRbIeMLma2mWvzOeZa6IjBxGCuJ0ewbRxqooIjjtLJoS+YsXryIo/8ciVCDsuK+oJuBJmJitlX5Ec3uxsNOCwrfHezYpmh41nklX43DYgXA3t37yGKsf+E8tlDIw55mYpYeixkzCuiANEjPCya44OGrkRTiELp/IFxRtzttNBgoS7RIZwrzLBxt/Ly2IdACA6ECwFfW+ccMyrH7lTHXcKjnwiYAnhk0tcHCLAXOzMABYLHt1qwn3z/zglP/ZJ9CDgNdQmo5l0lv4hqO/7kqzSjGiMIFTmMibM/93PylsbhIX4VEOZpM4N8ie70tEf2gieGD3X1rLK5Clb6KpE4ZjfMqEIAtwgIeUUeLhTxskzwKaOgaoVMQNYS0c/JRUInn5UNmKVE9TOyMSHTMvmsofQVT8sHlqVN0QIFgFptWKZQKORxJYD65ILHlADqkPmKgIjPFAr9WKkMmH+fMqBSmU4lFD2giGjwP65E57g/mNtNlS/JVGkKNv8vwAAGUjJRvraavAAAAABJRU5ErkJggg==);

  -webkit-background-size: 36px 72px;

  -moz-background-size: 36px 72px;

  -ms-background-size: 36px 72px;

  -o-background-size: 36px 72px;

  background-size: 36px 72px;

}

.faq-view .faq-view-question {

  color: #008bd1;

}

.faq-view .faq-view-question:before {

  background-position: 0 0;

}

.faq-view .faq-view-answer {

  margin-top: 10px;

  color: #00a23d;

}

.faq-view .faq-view-answer:before {

  background-position: 0 -36px;

}

.faq-view .faq-view-description {

  position: relative;

  z-index: 1;

  padding-top: 10px;

  line-height: 1.3;

  letter-spacing: 0;

}

.faq-view .faq-view-pict {

  padding-top: 10px;

  text-align: center;

}

.faq-view .faq-view-notes {

  padding: 10px 0 0;

  list-style: none;

}

.faq-view .faq-view-notes li {

  position: relative;

  padding-left: 1em;

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

}

.faq-view .faq-view-notes li:before {

  content: "※";

  display: inline-block;

  position: absolute;

  left: 0;

  top: 0;

  width: 1em;

  text-align: center;

}

.faq-view .faq-view-examples {

  padding: 10px 0 0;

  list-style: none;

}

.faq-view .faq-view-examples li {

  position: relative;

  padding-left: 1em;

  line-height: 1.3;

  letter-spacing: 0;

}

.faq-view .faq-view-examples li:before {

  content: "・";

  display: inline-block;

  position: absolute;

  left: 0;

  top: 0;

  width: 1em;

  text-align: center;

}

.faq-view ol.faq-view-examples {

  counter-reset: faq-view-examples;

}

.faq-view ol.faq-view-examples li {

  padding-left: 1.5em;

  counter-increment: faq-view-examples;

}

.faq-view ol.faq-view-examples li:before {

  content: counter(faq-view-examples) ".";

  width: 1.5em;

}

.faq-view .faq-view-indexlist {

  padding-top: 15px;

  padding-bottom: 5px;

  list-style: none;

}

.faq-view .faq-view-indexlist li {

  padding-top: 7px;

}

.faq-view .faq-view-indexlist .btn {

  padding-right: 30px;

}

.faq-view .faq-view-indexlist .btn:before {

  -webkit-transform: rotate(90deg);

  -moz-transform: rotate(90deg);

  -ms-transform: rotate(90deg);

  -o-transform: rotate(90deg);

  transform: rotate(90deg);

}

.faq-view .faq-view-topagetop {

  padding: 20px 0 0;

  text-align: right;

}

.faq-view .faq-view-topagetop a {

  color: #008bd1;

}

.faq-view .faq-view-backlink {

  margin-bottom: -5px;

}

.faq-view .faq-view-backlink .btn {

  padding-left: 30px;

}

.faq-view .faq-view-backlink .btn:before {

  left: 5px;

  -webkit-transform: rotate(180deg);

  -moz-transform: rotate(180deg);

  -ms-transform: rotate(180deg);

  -o-transform: rotate(180deg);

  transform: rotate(180deg);

}

.faq-view .btn {

  color: #008bd1;

}

.faq-view .faq-view-container {

  position: relative;

  z-index: 1;

}

.faq-view .faq-view-container .faq-view-description,

.faq-view .faq-view-container .faq-view-notes,

.faq-view .faq-view-container .faq-view-examples {

  padding-left: 46px;

}

.faq-view:first-of-type {

  padding-top: 15px;

  border-top: 0;

}



/*

# Special Objects



「特集ページ」に使用されている要素の定義





## .special-main-view



特集ページのメインビジュアル＋リードエリア



#### [Options]



 - `.special-main-view` 基本的なスタイル



#### [Contents]



 - `.special-main-view-visual` 特集ページのメインビジュアル

 - `.special-main-view-title` 特集ページのメインビジュアルのタイトル

 - `.special-main-view-lead` 特集ページのメインビジュアルのリード

 - `.special-main-view-features` 特集ページの特徴の項目へリンクするアンカーボタンナビ





	<section class="special-main-view">



		<figure class="special-main-view-visual"><img src="../img/special_axela_mainvisual.png" alt="" width="640" height="396" /></figure>



		<h1 class="special-main-view-title"><img src="../img/special_axela_title.png" alt="MAZDA アクセラ U-car 特集" width="207" height="41" /></h1>



		<p class="special-main-view-lead">世界で高い評価を得ているスポーツ・コンパクトカーのアクセラに、革新的な新世代技術SKYACTIV TECHNOLOGYを搭載。<br />走り、燃費、スタイルの全てを磨き抜いた人気のアクセラのU-carをご紹介します。</p>



		<nav class="special-main-view-features">

			<a href="#" class="btn-special-feature">アクセラの特徴</a>

			<a href="#" class="btn-special-feature">アクセラの歴代ラインアップ</a>

			<a href="#" class="btn-special-feature">マツダU-car保証</a>

		</nav>



	</section>



*/

.special-main-view {

  position: relative;

  padding: 100px 0 15px;

  background: #008bd1;

  border-top: 1px solid white;

}

.special-main-view:after {

  content: "";

  display: block;

  position: absolute;

  z-index: 0;

  bottom: 0;

  left: 0;

  width: 100%;

  height: 50px;

  background-image: -webkit-gradient(linear, left bottom, left top, color-stop(0%, #00CFE5),color-stop(42%, #008BD1),color-stop(100%, #008BD1));

  background-image: -webkit-linear-gradient(bottom, #00CFE5 0%,#008BD1 42%,#008BD1 100%);

  background-image: -moz-linear-gradient(bottom, #00CFE5 0%,#008BD1 42%,#008BD1 100%);

  background-image: -ms-linear-gradient(bottom, #00CFE5 0%,#008BD1 42%,#008BD1 100%);

  background-image: -o-linear-gradient(bottom, #00CFE5 0%,#008BD1 42%,#008BD1 100%);

  background-image: linear-gradient(to top, #00CFE5 0%,#008BD1 42%,#008BD1 100%);

}

.special-main-view .special-main-view-visual {

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

  width: 100%;

}

.special-main-view .special-main-view-visual img {

  display: block;

  width: 100%;

  height: auto;

}

.special-main-view .special-main-view-title {

  position: relative;

  z-index: 1;

  padding: 0 10px 0;

  color: white;

}

.special-main-view .special-main-view-lead {

  position: relative;

  z-index: 1;

  padding: 5px 10px 0;

  line-height: 1.2;

  letter-spacing: 0;

  word-break: break-all;

  word-wrap: break-word;

  color: white;

  font-size: 12px;

}

.special-main-view .special-main-view-features {

  position: relative;

  z-index: 1;

  padding: 3px 10px 0;

  counter-reset: special-main-view-features;

}

.special-main-view .special-main-view-features .btn-special-feature {

  margin-top: 7px;

}



@media only screen and (orientation: landscape) {

  .special-main-view {

    padding-top: 150px;

  }

}

/*

## .special-btn-view



特集ページのボタンのみを格納するエリア



#### [Options]



 - `.special-btn-view` 基本的なスタイル



#### [Contents]



 - `.btn-special-search` 特集ページの U-car 検索ボタン





	<nav class="special-btn-view">

		<a class="btn-special-search" href="#">アクセラのU-carを検索</a>

	</nav>

*/

.special-btn-view {

  position: relative;

  padding: 15px 10px;

  background: white;

  border-top: 1px solid #cccccc;

}

.special-btn-view:before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

  width: 100%;

  height: 44px;

  border-top: 1px solid white;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #CCCCCC),color-stop(100%, #FFFFFF));

  background-image: -webkit-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -moz-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -ms-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -o-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: linear-gradient(to bottom, #CCCCCC 0%,#FFFFFF 100%);

}



/*

## .special-corner-view



特集ページのコーナー



#### [Options]



 - `.special-corner-view` 基本的なスタイル



#### [Contents]



 - `.special-corner-view-header` 特集ページのコーナーのヘッダー

 - `.special-corner-view-label` 特集ページのコーナーのラベル

 - `.special-corner-view-container` 特集ページのコーナーのコンテナ

 - `.special-corner-view-container-nogradient`  特集ページのコーナーのコンテナ（グラデーションなし）

 - `.special-corner-view-item-logo` 特集ページのコーナー内パーツ（車種ロゴ）

 - `.special-corner-view-item-image` 特集ページのコーナー内パーツ（メイン写真）

 - `.special-corner-view-item-table` 特集ページのコーナ内パーツ（スペックテーブル）

 - `.special-corner-view-item-feature` 特集ページのコーナー内パーツ（特徴アイテム）

 - `.special-corner-view-item-feature-header` 特集ページのコーナー内パーツ（特徴アイテムヘッダー）

 - `.special-corner-view-item-feature-label` 特集ページのコーナー内パーツ（特徴アイテム見出し）

 - `.special-corner-view-item-feature-image` 特集ページのコーナー内パーツ（特徴アイテム写真）

 - `.special-corner-view-item-feature-imagefix` 特集ページのコーナー内パーツ（特徴アイテム写真の横幅FIX版）

 - `.special-corner-view-item-feature-description` 特集ページのコーナー内パーツ（写真アイテム概要）

 - `.special-corner-view-item-history` 特集ページのコーナー内パーツ（歴代ラインナップ）

 - `.special-corner-view-item-history-noarrow` 特集ページのコーナー内パーツ（歴代ラインナップ、矢印なし版）

 - `.special-corner-view-item-history-header` 特集ページのコーナー内パーツ（歴代ラインナップヘッダー）

 - `.special-corner-view-item-label` 特集ページのコーナー内パーツ（歴代ラインナップ見出し）

 - `.special-corner-view-item-history-image` 特集ページのコーナー内パーツ（歴代ラインナップ写真）

 - `.special-corner-view-item-history-name` 特集ページのコーナー内パーツ（歴代ラインナップ車種名）

 - `.special-corner-view-item-history-footer` 特集ページのコーナー内パーツ（歴代ラインナップフッター）

 - `.special-corner-view-item-lead` 特集ページのコーナー内パーツ（リード）

 - `.special-corner-view-item-nintei-logo` 特集ページのコーナー内パーツ（認定U−carロゴ）

 - `.special-corner-view-item-guarantees` 特集ページのコーナー内パーツ（さわやか保証の説明枠）

 - `.special-corner-view-item-guarantee` 特集ページのコーナー内パーツ（さわやか保証の説明枠内の各項目）

 - `.special-corner-view-notes` 特集ページのコーナーの注釈

 - `.special-corner-view-topagetop` 特集ページのコーナーのページトップリンク

*/

.special-corner-view {

  counter-increment: special-corner-view;

}

.special-corner-view .special-corner-text-narrow {

  letter-spacing: -0.1em;

}

.special-corner-view .special-corner-view-header {

  display: table;

  position: relative;

  z-index: 3;

  width: 100%;

  height: 55px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #008BD1),color-stop(58%, #008BD1),color-stop(100%, #00CFE5));

  background-image: -webkit-linear-gradient(top, #008BD1 0%,#008BD1 58%,#00CFE5 100%);

  background-image: -moz-linear-gradient(top, #008BD1 0%,#008BD1 58%,#00CFE5 100%);

  background-image: -ms-linear-gradient(top, #008BD1 0%,#008BD1 58%,#00CFE5 100%);

  background-image: -o-linear-gradient(top, #008BD1 0%,#008BD1 58%,#00CFE5 100%);

  background-image: linear-gradient(to bottom, #008BD1 0%,#008BD1 58%,#00CFE5 100%);

}

.special-corner-view .special-corner-view-header:before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

  width: 100%;

  height: 3px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #0f49a9),color-stop(100%, #008BD1));

  background-image: -webkit-linear-gradient(top, #0f49a9 0%,#008BD1 100%);

  background-image: -moz-linear-gradient(top, #0f49a9 0%,#008BD1 100%);

  background-image: -ms-linear-gradient(top, #0f49a9 0%,#008BD1 100%);

  background-image: -o-linear-gradient(top, #0f49a9 0%,#008BD1 100%);

  background-image: linear-gradient(to bottom, #0f49a9 0%,#008BD1 100%);

}

.special-corner-view .special-corner-view-label {

  display: table-cell;

  padding: 0 5px 0 60px;

  vertical-align: middle;

  color: white;

  font-size: 15.2px;

}

.special-corner-view .special-corner-view-label:before, .special-corner-view .special-corner-view-label:after {

  position: absolute;

  left: 10px;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  display: block;

  width: 42px;

  height: 60px;

  top: 7px;

  text-indent: -0.2em;

  line-height: 45px;

  text-align: center;

  font-size: 32px;

  font-style: italic;

  font-family: Helvetica, Arial, sans-serif;

}

.special-corner-view .special-corner-view-label:before {

  content: counter(special-corner-view);

  color: #008bd1;

  background: transparent url(data:image/png;base64,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) 0 0 no-repeat;

  -webkit-background-size: 42px 60px;

  -moz-background-size: 42px 60px;

  -ms-background-size: 42px 60px;

  -o-background-size: 42px 60px;

  background-size: 42px 60px;

}

.special-corner-view .special-corner-view-label:after {

  content: counter(special-corner-view);

  color: #00cce4;

  -webkit-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjNFMjcwNjY0RTJCRTExRTJBQjY4RDVEQTNEQjRCQzdGIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjNFMjcwNjY1RTJCRTExRTJBQjY4RDVEQTNEQjRCQzdGIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTAwNTEwRkZFMkJEMTFFMkFCNjhENURBM0RCNEJDN0YiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTAwNTExMDBFMkJEMTFFMkFCNjhENURBM0RCNEJDN0YiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz43hmgmAAAAZElEQVR42uzayw0AEBBAQeLXf8c04ChhzSYKmDwnNqUgk9cpESAV5EJIVUSRM5CmiCIgIE9BuiKKgICAgIAEggxFFFHE1VIEBAQEBOQbiOcgRUBA3oL4elPkEMTCgCIg+5kCDADiwgG+YLGhtwAAAABJRU5ErkJggg==);

  -moz-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjNFMjcwNjY0RTJCRTExRTJBQjY4RDVEQTNEQjRCQzdGIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjNFMjcwNjY1RTJCRTExRTJBQjY4RDVEQTNEQjRCQzdGIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTAwNTEwRkZFMkJEMTFFMkFCNjhENURBM0RCNEJDN0YiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTAwNTExMDBFMkJEMTFFMkFCNjhENURBM0RCNEJDN0YiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz43hmgmAAAAZElEQVR42uzayw0AEBBAQeLXf8c04ChhzSYKmDwnNqUgk9cpESAV5EJIVUSRM5CmiCIgIE9BuiKKgICAgIAEggxFFFHE1VIEBAQEBOQbiOcgRUBA3oL4elPkEMTCgCIg+5kCDADiwgG+YLGhtwAAAABJRU5ErkJggg==);

  -ms-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjNFMjcwNjY0RTJCRTExRTJBQjY4RDVEQTNEQjRCQzdGIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjNFMjcwNjY1RTJCRTExRTJBQjY4RDVEQTNEQjRCQzdGIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTAwNTEwRkZFMkJEMTFFMkFCNjhENURBM0RCNEJDN0YiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTAwNTExMDBFMkJEMTFFMkFCNjhENURBM0RCNEJDN0YiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz43hmgmAAAAZElEQVR42uzayw0AEBBAQeLXf8c04ChhzSYKmDwnNqUgk9cpESAV5EJIVUSRM5CmiCIgIE9BuiKKgICAgIAEggxFFFHE1VIEBAQEBOQbiOcgRUBA3oL4elPkEMTCgCIg+5kCDADiwgG+YLGhtwAAAABJRU5ErkJggg==);

  -o-mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjNFMjcwNjY0RTJCRTExRTJBQjY4RDVEQTNEQjRCQzdGIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjNFMjcwNjY1RTJCRTExRTJBQjY4RDVEQTNEQjRCQzdGIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTAwNTEwRkZFMkJEMTFFMkFCNjhENURBM0RCNEJDN0YiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTAwNTExMDBFMkJEMTFFMkFCNjhENURBM0RCNEJDN0YiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz43hmgmAAAAZElEQVR42uzayw0AEBBAQeLXf8c04ChhzSYKmDwnNqUgk9cpESAV5EJIVUSRM5CmiCIgIE9BuiKKgICAgIAEggxFFFHE1VIEBAQEBOQbiOcgRUBA3oL4elPkEMTCgCIg+5kCDADiwgG+YLGhtwAAAABJRU5ErkJggg==);

  mask-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAAyNpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuNS1jMDE0IDc5LjE1MTQ4MSwgMjAxMy8wMy8xMy0xMjowOToxNSAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvIiB4bWxuczp4bXBNTT0iaHR0cDovL25zLmFkb2JlLmNvbS94YXAvMS4wL21tLyIgeG1sbnM6c3RSZWY9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9zVHlwZS9SZXNvdXJjZVJlZiMiIHhtcDpDcmVhdG9yVG9vbD0iQWRvYmUgUGhvdG9zaG9wIENDIChNYWNpbnRvc2gpIiB4bXBNTTpJbnN0YW5jZUlEPSJ4bXAuaWlkOjNFMjcwNjY0RTJCRTExRTJBQjY4RDVEQTNEQjRCQzdGIiB4bXBNTTpEb2N1bWVudElEPSJ4bXAuZGlkOjNFMjcwNjY1RTJCRTExRTJBQjY4RDVEQTNEQjRCQzdGIj4gPHhtcE1NOkRlcml2ZWRGcm9tIHN0UmVmOmluc3RhbmNlSUQ9InhtcC5paWQ6MTAwNTEwRkZFMkJEMTFFMkFCNjhENURBM0RCNEJDN0YiIHN0UmVmOmRvY3VtZW50SUQ9InhtcC5kaWQ6MTAwNTExMDBFMkJEMTFFMkFCNjhENURBM0RCNEJDN0YiLz4gPC9yZGY6RGVzY3JpcHRpb24+IDwvcmRmOlJERj4gPC94OnhtcG1ldGE+IDw/eHBhY2tldCBlbmQ9InIiPz43hmgmAAAAZElEQVR42uzayw0AEBBAQeLXf8c04ChhzSYKmDwnNqUgk9cpESAV5EJIVUSRM5CmiCIgIE9BuiKKgICAgIAEggxFFFHE1VIEBAQEBOQbiOcgRUBA3oL4elPkEMTCgCIg+5kCDADiwgG+YLGhtwAAAABJRU5ErkJggg==);

}

.special-corner-view [class^="special-corner-view-container"] {

  position: relative;

  padding: 15px 10px 0;

  background: white;

  border-top: 1px solid #cccccc;

}

.special-corner-view [class^="special-corner-view-container"]:before {

  content: "";

  display: block;

  position: absolute;

  top: 0;

  left: 0;

  z-index: 0;

  width: 100%;

  height: 44px;

  border-top: 1px solid white;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #CCCCCC),color-stop(100%, #FFFFFF));

  background-image: -webkit-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -moz-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -ms-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: -o-linear-gradient(top, #CCCCCC 0%,#FFFFFF 100%);

  background-image: linear-gradient(to bottom, #CCCCCC 0%,#FFFFFF 100%);

}

.special-corner-view [class^="special-corner-view-container"]:first-of-type:after {

  content: "";

  display: block;

  position: absolute;

  top: 2px;

  left: 0;

  z-index: 0;

  width: 100%;

  height: 1px;

  background: white;

}

.special-corner-view .special-corner-view-container-nogradient {

  border-top: 0;

}

.special-corner-view .special-corner-view-container-nogradient:before {

  display: none;

}

.special-corner-view .special-corner-view-item-logo {

  position: relative;

  z-index: 1;

  text-align: center;

}

.special-corner-view .special-corner-view-item-image {

  position: relative;

  z-index: 1;

  padding: 10px 0 0;

  text-align: center;

}

.special-corner-view .special-corner-view-item-table {

  width: 100%;

  margin-top: 10px;

  border-collapse: collapse;

}

.special-corner-view .special-corner-view-item-table th, .special-corner-view .special-corner-view-item-table td {

  padding: 5px;

  line-height: 1.2;

  letter-spacing: 0;

  border: 1px solid white;

}

.special-corner-view .special-corner-view-item-table th {

  width: 80px;

  color: white;

  background: #008bd1;

  font-weight: normal;

}

.special-corner-view .special-corner-view-item-table td {

  background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, #f2f2f2),color-stop(100%, #eeeeee));

  background-image: -webkit-linear-gradient(left, #f2f2f2 0%,#eeeeee 100%);

  background-image: -moz-linear-gradient(left, #f2f2f2 0%,#eeeeee 100%);

  background-image: -ms-linear-gradient(left, #f2f2f2 0%,#eeeeee 100%);

  background-image: -o-linear-gradient(left, #f2f2f2 0%,#eeeeee 100%);

  background-image: linear-gradient(to right, #f2f2f2 0%,#eeeeee 100%);

}

.special-corner-view .special-corner-view-item-feature {

  margin-top: 10px;

  background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, #f2f2f2),color-stop(100%, #eeeeee));

  background-image: -webkit-linear-gradient(left, #f2f2f2 0%,#eeeeee 100%);

  background-image: -moz-linear-gradient(left, #f2f2f2 0%,#eeeeee 100%);

  background-image: -ms-linear-gradient(left, #f2f2f2 0%,#eeeeee 100%);

  background-image: -o-linear-gradient(left, #f2f2f2 0%,#eeeeee 100%);

  background-image: linear-gradient(to right, #f2f2f2 0%,#eeeeee 100%);

}

.special-corner-view .special-corner-view-item-feature .special-corner-view-item-feature-header {

  position: relative;

  display: table;

  width: 100%;

  height: 50px;

  background-image: -webkit-gradient(linear, left top, right top, color-stop(0%, #ffffff),color-stop(100%, #CCCCCC));

  background-image: -webkit-linear-gradient(left, #ffffff 0%,#CCCCCC 100%);

  background-image: -moz-linear-gradient(left, #ffffff 0%,#CCCCCC 100%);

  background-image: -ms-linear-gradient(left, #ffffff 0%,#CCCCCC 100%);

  background-image: -o-linear-gradient(left, #ffffff 0%,#CCCCCC 100%);

  background-image: linear-gradient(to right, #ffffff 0%,#CCCCCC 100%);

}

.special-corner-view .special-corner-view-item-feature .special-corner-view-item-feature-header:before, .special-corner-view .special-corner-view-item-feature .special-corner-view-item-feature-header:after {

  display: block;

  -webkit-box-sizing: border-box;

  -moz-box-sizing: border-box;

  -ms-box-sizing: border-box;

  -o-box-sizing: border-box;

  box-sizing: border-box;

  position: absolute;

  top: 0;

  left: 0;

  width: 44px;

  height: 100%;

  font-weight: bold;

  text-shadow: rgba(0, 0, 0, 0.3) 0px 0px 3px;

}

.special-corner-view .special-corner-view-item-feature .special-corner-view-item-feature-header:before {

  content: "特徴";

  padding: 5px 0 5px 8px;

  letter-spacing: 0.5em;

  text-indent: 0.16em;

  color: white;

  background: #008bd1;

  font-size: 10px;

}

.special-corner-view .special-corner-view-item-feature .special-corner-view-item-feature-header:after {

  padding-top: 15px;

  text-align: center;

  text-indent: -0.2em;

  color: white;

  font-size: 30px;

  font-style: italic;

  font-family: Helvetica, Arial, sans-serif;

}

.special-corner-view .special-corner-view-item-feature:nth-of-type(1) .special-corner-view-item-feature-header:after {

  content: "1";

}

.special-corner-view .special-corner-view-item-feature:nth-of-type(2) .special-corner-view-item-feature-header:after {

  content: "2";

}

.special-corner-view .special-corner-view-item-feature:nth-of-type(3) .special-corner-view-item-feature-header:after {

  content: "3";

}

.special-corner-view .special-corner-view-item-feature:nth-of-type(4) .special-corner-view-item-feature-header:after {

  content: "4";

}

.special-corner-view .special-corner-view-item-feature .special-corner-view-item-feature-label {

  display: table-cell;

  padding-left: 50px;

  letter-spacing: -0.05em;

  vertical-align: middle;

  font-size: 14px;

}

.special-corner-view .special-corner-view-item-feature .special-corner-view-item-feature-image {

  text-align: center;

}

.special-corner-view .special-corner-view-item-feature .special-corner-view-item-feature-imagefix {

  text-align: center;

}

.special-corner-view .special-corner-view-item-feature .special-corner-view-item-feature-imagefix img {

  display: block;

  width: 100%;

  height: auto;

}

.special-corner-view .special-corner-view-item-feature .special-corner-view-item-feature-description {

  padding: 10px;

  line-height: 1.2;

  letter-spacing: 0;

}

.special-corner-view .special-corner-view-item-history,

.special-corner-view .special-corner-view-item-history-noarrow {

  position: relative;

  z-index: 1;

  margin-bottom: 41px;

  border: 1px solid #008bd1;

}

.special-corner-view .special-corner-view-item-history .special-corner-view-item-history-header,

.special-corner-view .special-corner-view-item-history-noarrow .special-corner-view-item-history-header {

  display: table;

  width: 100%;

  height: 40px;

  background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #008BD1),color-stop(50%, #008BD1),color-stop(100%, #00CFE5));

  background-image: -webkit-linear-gradient(top, #008BD1 0%,#008BD1 50%,#00CFE5 100%);

  background-image: -moz-linear-gradient(top, #008BD1 0%,#008BD1 50%,#00CFE5 100%);

  background-image: -ms-linear-gradient(top, #008BD1 0%,#008BD1 50%,#00CFE5 100%);

  background-image: -o-linear-gradient(top, #008BD1 0%,#008BD1 50%,#00CFE5 100%);

  background-image: linear-gradient(to bottom, #008BD1 0%,#008BD1 50%,#00CFE5 100%);

}

.special-corner-view .special-corner-view-item-history .special-corner-view-item-label,

.special-corner-view .special-corner-view-item-history-noarrow .special-corner-view-item-label {

  display: table-cell;

  vertical-align: middle;

  text-align: center;

  color: white;

}

.special-corner-view .special-corner-view-item-history .special-corner-view-item-history-image,

.special-corner-view .special-corner-view-item-history-noarrow .special-corner-view-item-history-image {

  padding: 15px 0 0;

  text-align: center;

}

.special-corner-view .special-corner-view-item-history .special-corner-view-item-history-name,

.special-corner-view .special-corner-view-item-history-noarrow .special-corner-view-item-history-name {

  padding: 10px 10px 0;

  text-align: center;

  color: #008bd1;

  font-weight: bold;

}

.special-corner-view .special-corner-view-item-history .special-corner-view-item-history-footer,

.special-corner-view .special-corner-view-item-history-noarrow .special-corner-view-item-history-footer {

  margin-top: 20px;

  padding: 13px 25px;

  background-image: -webkit-gradient(linear, right top, left top, color-stop(0%, #B1B1B1),color-stop(100%, #D7D7D7));

  background-image: -webkit-linear-gradient(right, #B1B1B1 0%,#D7D7D7 100%);

  background-image: -moz-linear-gradient(right, #B1B1B1 0%,#D7D7D7 100%);

  background-image: -ms-linear-gradient(right, #B1B1B1 0%,#D7D7D7 100%);

  background-image: -o-linear-gradient(right, #B1B1B1 0%,#D7D7D7 100%);

  background-image: linear-gradient(to left, #B1B1B1 0%,#D7D7D7 100%);

  -webkit-box-shadow: inset rgba(0, 0, 0, 0.4) 0 2px 2px;

  -moz-box-shadow: inset rgba(0, 0, 0, 0.4) 0 2px 2px;

  -ms-box-shadow: inset rgba(0, 0, 0, 0.4) 0 2px 2px;

  -o-box-shadow: inset rgba(0, 0, 0, 0.4) 0 2px 2px;

  box-shadow: inset rgba(0, 0, 0, 0.4) 0 2px 2px;

}

.special-corner-view .special-corner-view-item-history:after,

.special-corner-view .special-corner-view-item-history-noarrow:after {

  content: "";

  display: block;

  position: relative;

  margin: 0 auto -36px;

  width: 176px;

  height: 36px;

  background: url(data:image/png;base64,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) 0 0 no-repeat;

  -webkit-background-size: 176px 36px;

  -moz-background-size: 176px 36px;

  -ms-background-size: 176px 36px;

  -o-background-size: 176px 36px;

  background-size: 176px 36px;

}

.special-corner-view .special-corner-view-item-history-noarrow {

  margin-bottom: 0;

}

.special-corner-view .special-corner-view-item-history-noarrow:after {

  display: none;

}

.special-corner-view .special-corner-view-item-lead {

  position: relative;

  z-index: 1;

  line-height: 1.2;

  letter-spacing: 0;

}

.special-corner-view .special-corner-view-item-nintei-logo {

  text-align: center;

  padding: 15px 0 15px;

}

.special-corner-view .special-corner-view-item-guarantees {

  margin-top: 15px;

  padding: 0 12px 12px;

  border: 1px solid #008bd1;

  background-image: -webkit-gradient(linear, right top, left top, color-stop(0%, #B1B1B1),color-stop(100%, #D7D7D7));

  background-image: -webkit-linear-gradient(right, #B1B1B1 0%,#D7D7D7 100%);

  background-image: -moz-linear-gradient(right, #B1B1B1 0%,#D7D7D7 100%);

  background-image: -ms-linear-gradient(right, #B1B1B1 0%,#D7D7D7 100%);

  background-image: -o-linear-gradient(right, #B1B1B1 0%,#D7D7D7 100%);

  background-image: linear-gradient(to left, #B1B1B1 0%,#D7D7D7 100%);

  -webkit-box-shadow: inset rgba(0, 0, 0, 0.4) 0 2px 2px;

  -moz-box-shadow: inset rgba(0, 0, 0, 0.4) 0 2px 2px;

  -ms-box-shadow: inset rgba(0, 0, 0, 0.4) 0 2px 2px;

  -o-box-shadow: inset rgba(0, 0, 0, 0.4) 0 2px 2px;

  box-shadow: inset rgba(0, 0, 0, 0.4) 0 2px 2px;

}

.special-corner-view .special-corner-view-item-guarantees .special-corner-view-item-guarantee {

  position: relative;

  margin-top: 12px;

  padding: 8px 8px 20px;

  background: white;

  -webkit-border-radius: 3px;

  -moz-border-radius: 3px;

  -ms-border-radius: 3px;

  -o-border-radius: 3px;

  border-radius: 3px;

  -webkit-box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 0;

  -moz-box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 0;

  -ms-box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 0;

  -o-box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 0;

  box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 0;

}

.special-corner-view .special-corner-view-item-guarantees .special-corner-view-item-guarantee:after {

  content: "";

  display: block;

  visibility: hidden;

  clear: both;

  height: 0;

}

.special-corner-view .special-corner-view-item-guarantees .special-corner-view-item-guarantee:before {

  content: "";

  position: absolute;

  z-index: 5;

  left: 50%;

  bottom: -26px;

  width: 41px;

  height: 41px;

  margin-left: -20px;

  background: url(data:image/png;base64,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) 0 0 no-repeat;

  -webkit-background-size: 41px 41px;

  -moz-background-size: 41px 41px;

  -ms-background-size: 41px 41px;

  -o-background-size: 41px 41px;

  background-size: 41px 41px;

}

.special-corner-view .special-corner-view-item-guarantees .special-corner-view-item-guarantee:last-of-type {

  padding-bottom: 8px;

}

.special-corner-view .special-corner-view-item-guarantees .special-corner-view-item-guarantee:last-of-type:before {

  display: none;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayaka .special-guarantee-sawayaka-title {

  text-align: center;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayaka .special-guarantee-sawayaka-item {

  padding: 10px 5px;

  border-top: 1px solid #b1b1b1;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayaka .special-guarantee-sawayaka-item h1 {

  text-align: center;

  letter-spacing: -0.05em;

  color: #008bd1;

  font-size: 15.4px;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayaka .special-guarantee-sawayaka-item h1 sup {

  font-size: 10px;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayaka .special-guarantee-sawayaka-item dl dt {

  padding: 10px 0 0;

  font-weight: bold;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayaka .special-guarantee-sawayaka-item dl dd {

  line-height: 1.2;

  letter-spacing: 0;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayaka .special-guarantee-sawayaka-item:last-of-type {

  border-bottom: 1px solid #b1b1b1;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayakaplus {

  display: table;

  width: 100%;

  padding: 10px 3px;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayakaplus .special-guarantee-sawayakaplus-title {

  display: table-cell;

  vertical-align: middle;

  text-align: center;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayakaplus p {

  display: table-cell;

  text-align: center;

  vertical-align: middle;

  line-height: 1.2;

  letter-spacing: 0;

  font-size: 12px;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayakaplus p b {

  display: inline-block;

  padding-top: 5px;

  letter-spacing: 0;

  color: #008bd1;

  font-size: 14.7px;

}

.special-corner-view .special-corner-view-item-guarantees #special-guarantee-sawayakaplus p b small {

  font-size: 12px;

}

.special-corner-view .special-corner-view-notes {

  padding: 10px 0 0;

  list-style: none;

}

.special-corner-view .special-corner-view-notes li {

  position: relative;

  padding-left: 1em;

  line-height: 1.3;

  letter-spacing: 0;

  font-size: 12px;

}

.special-corner-view .special-corner-view-notes li:before {

  display: inline-block;

  position: absolute;

  left: 0;

  top: 0;

  text-align: center;

}

.special-corner-view ul.special-corner-view-notes li {

  padding-left: 1.5em;

}

.special-corner-view ul.special-corner-view-notes li:before {

  content: "※";

  width: 1.5em;

}

.special-corner-view ol.special-corner-view-notes {

  counter-reset: special-corner-view-notes;

}

.special-corner-view ol.special-corner-view-notes li {

  padding-left: 1.5em;

  counter-increment: special-corner-view-notes;

}

.special-corner-view ol.special-corner-view-notes li:before {

  content: "*" counter(special-corner-view-notes);

  width: 1.5em;

}

.special-corner-view .special-corner-view-topagetop {

  padding: 10px 10px 10px;

  text-align: right;

}

.special-corner-view .special-corner-view-topagetop a {

  color: #008bd1;

  font-size: 12px;

}

/* お取り寄せ車両・マツダ公式中古車サイト限定車アイコン追加 */
.form-view .form-view-icn-list{
  margin: 5px 0 0;
  padding: 0;
  list-style: none;
  display: flex;
}
.form-view .form-view-icn-list li{
  margin: 0 5px 0 0;
}
.form-view .form-view-icn-list li:last-child{
  margin: 0;
}
.form-view .form-view-icn-list li img{
  max-width: 123px;
  width: 100%;
  max-height: 31px;
}
