@charset "UTF-8";
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap");

@font-face {
  font-family: 'Noto Sans JP Local';
  src: local('Noto Sans JP'), local('NotoSansJP-Regular');
}

/* =========================================================
   Base
========================================================= */
/* elements
----------------------------------------------- */
body {
  width: 100%;
  height: 100%;
  line-height: 1.5;
  margin: 0;
  color: #333;
  font-size: 87.5%;
  font-weight: normal;
  font-family: -apple-system, BlinkMacSystemFont, "Noto Sans JP Local", "Noto Sans JP", sans-serif;
  word-break: break-word;
  overflow-wrap: break-word;
  -webkit-text-size-adjust: 100%;
}
img {
  max-width: 100%;
  vertical-align: bottom;
}
video, audio, label {
  vertical-align: middle;
}
a img {
  vertical-align: middle;
}
img.external {
  margin: 0 0.25em;
}
.maps img, #map_canvas img, #canvas img {
  max-width: none;
}
#map_canvas {
  width: 100% !important;
}
input, textarea {
  max-width: 100%;
}
input[type="text"], input[type="number"], textarea {
  padding: 10px 5px;
}
input[type="text"] {
  width: 50%;
  height: 2.5em;
}
#bike_valuation_valuation_customer_email {
  width: 100%;
}
select, input[type="number"] {
  max-width: 100%;
  height: 2.5em;
}
.ui-datepicker select {
  height: auto;
}
textarea {
  width: 100%;
}
p {
  margin: 0;
}
em {
  font-style: normal;
}
pre {
  font-family: -apple-system, BlinkMacSystemFont, "Source Han Code JP", Osaka-mono, "Noto Sans JP", monospace;
  white-space: pre-wrap;
  word-wrap: break-word;
  overflow: auto;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
  empty-cells: show;
}
rp, rt {
  font-size: 80%;
  text-decoration: none;
}
ul {
  margin: 0;
  padding: 0;
  list-style-position: outside;
  list-style-type: none;
}
ol {
  margin: 0;
  padding: 0;
  list-style-position: outside;
}
li {
  margin: 0;
  padding: 0;
  list-style-position: outside;
}
a {
  background-color: transparent;
  color: #0333a2;
  text-decoration: underline;
  word-break: break-word;
}
a:visited {
  color: #0333a2;
  background-color: transparent;
}
a:hover, a:focus {
  color: #003399;
  background-color: transparent;
  text-decoration: none;
}
a[name] {
  color: #333;
  text-decoration: none;
}
a img:hover {
  opacity: 0.9;
}
h1, h2, h3, h4, h5, h6 {
  margin: 0;
  padding: 0;
  font-size: 120%;
  font-weight: bold;
}
address {
  font-style: normal;
}
iframe {
  width: 100%;
  border: 0;
}
ins {
  background-color: #ff9;
  color: #333;
  text-decoration: none;
}

/* =========================================================
   Common Classes.
========================================================= */
/* Icons.
----------------------------------------------- */
.iconFile, .iconDefault {
  min-height: 16px;
  padding-left: 22px;
  background: url("/_common/images/icons/default.png") no-repeat left center;
}
.iconBmp {
  background-image: url("/_common/images/icons/bmp.png");
}
.iconCsv, .iconTxt {
  background-image: url("/_common/images/icons/default.png");
}
.iconDoc, .iconDocx, .iconRtf {
  background-image: url("/_common/images/icons/doc.png");
}
.iconGif {
  background-image: url("/_common/images/icons/gif.png");
}
.iconJpg, .iconJpe, .iconJpeg {
  background-image: url("/_common/images/icons/jpg.png");
}
.iconJtd {
  background-image: url("/_common/images/icons/jtd.png");
}
.iconLzh {
  background-image: url("/_common/images/icons/lzh.png");
}
.iconPdf {
  background-image: url("/_common/images/icons/pdf.png");
}
.iconPng {
  background-image: url("/_common/images/icons/png.png");
}
.iconPpt, .iconPptx {
  background-image: url("/_common/images/icons/ppt.png");
}
.iconXls, .iconXlsx {
  background-image: url("/_common/images/icons/xls.png");
}
.iconZip {
  background-image: url("/_common/images/icons/zip.png");
}

/* System
----------------------------------------------- */
/* pagination
---------------------- */
.pagination {
  margin-top: 20px;
  text-align: center;
}

.pagination a,
.pagination em,
.pagination span {
  display: inline-block;
  padding: 0 6px;
  vertical-align: middle;
}

.pagination .current {
  padding: 0 3px;
  font-size: 150%;
  font-weight: bold;
}

/* back
---------------------- */
.back {
  margin-top: 20px;
  text-align: center;
}
.back a {
  display: block;
  width: 95px;
  margin: 0 auto;
  padding: 5px 0;
  border: 1px solid #bbb;
  background-color: #fde7e9;
}

/* doc-classification
----------------------------------------------- */
/* RSS Atom
---------------------- */
.latest {
  position: relative;
  margin-bottom: 30px;
}
.latest .feed {
  position: absolute;
  top: 12px;
  right: 10px;
  float: right;
  height: 13px;
  background-color: transparent;
}
.latest .feed li {
  padding: 0;
  background: none;
}
.feed li {
  display: inline;
}
.feed a.feedRss {
  display: inline-block;
  width: 38px;
  height: 15px;
  background: url("../images/ic-rss.jpg") no-repeat left top;
  text-indent: 50px;
  overflow: hidden;
}
.feed a.feedAtom {
  display: inline-block;
  width: 34px;
  height: 15px;
  background: url("../images/ic-atom.jpg") no-repeat left top;
  text-indent: 50px;
  overflow: hidden;
}
.feed a:hover {
  opacity: 0.9;
}

/* midashi
----------------------------------------------- */
.body::after {
  content: "";
  display: block;
  clear: both;
}
.summary {
  padding: 0 0 20px;
}
.temp1 .thumb {
  float: left;
}
.temp2 .thumb {
  float: right;
}
.temp3, .temp4 {
  display: flex;
  justify-content: space-around;
  align-items: flex-end;
}
/*.temp3 dl, .temp4 dl {
  margin: 0 5px;
}*/
.temp3 dl {
  flex-basis: calc(50% - 5px);
}
.temp3 dl dt, .temp4 dl dt {
  margin-bottom: 10px;
  text-align: center;
}
.temp3 dl dd, .temp4 dl dd {
  text-align: center;
}
table.temp5 {
  width: 100%;
}
.temp4 dl {
  flex-basis: calc(33.33% - 6.66px);
}
.adobeReader, .temp7 {
  clear: both;
  margin: 0 0 20px;
  padding: 10px 20px 10px 196px;
  border: 1px solid #ffaaaa;
  background: #fff3f3 url("../images/adobe_bn.png") no-repeat scroll 20px center;
}
.body h2, .summary h2, .maps h2, .rels h2, .tags h2 {
  margin: 0 0 10px;
  padding: 0 5px 5px 0;
  border-bottom: 2px solid #000;
  font-size: 120%;
}
.body h3, .summary h3, .maps h3 {
  margin: 0 10px 10px 0;
  padding: 0;
  font-size: 100%;
}
.body h2:not(:first-child), .summary h2:not(:first-child),
.body h3:not(:first-child), .summary h3:not(:first-child) {
  margin-top: 20px;
}
.body h4 {
  margin: 10px;
  padding: 0 0 0 5px;
  border-left: 5px solid #008bff;
  color: #003366;
  font-size: 110%;
  font-weight: normal;
}
.body p {
  margin-bottom: 1em;
}
.body ul {
  margin: 0 0 15px 10px;
  list-style-type: none;
}
.body ul li {
  padding-left: 12px;
  background: url("../images/ic-list04.gif") no-repeat left 0.5em;
}
.body ul.chushaku li {
  margin: 0 0 0 0;
  background-image: none;
}
.body ol {
  margin: 0 0 15px 35px;
}
.body table,
.summary table {
  border: 1px solid #999;
  margin: 0 0 15px 0;
}
.body th, .body td,
.summary th, .summary td {
  padding: 10px;
  border: 1px solid #999;
  vertical-align: middle;
}
.body th,
.summary th {
  background-color: #eee;
  text-align: center;
}
.body .warning,
.summary .warning {
  color: #ee0000;
  font-weight: bold;
}
.body table.noBorder,
.body table.noBorder th,
.body table.noBorder td {
  border: none;
}
.gray {
  background-color: #e1e1e1;
}
.body img.border {
  padding: 3px;
  border:1px solid #ccc;
}
.body div.gmap {
  margin: 0 0 2em;
}
.body div.gmap iframe {
  width: 100%;
  max-width: 100%;
}

/* clearfix
----------------------------------------------- */
.clearfix::after {
  content: "";
  clear: both;
  display: block;
}

/* img float
---------------------- */
.img-right::after,
.img-left::after {
  content: "";
  clear: both;
  display: block;
}
.img-right,
.img-left {
  margin-bottom: 30px;
}
.img-right img {
  float: right;
  margin-left: 30px;
}
.img-left img {
  float: left;
  margin-right: 30px;
}
.img-left h2 {
  margin-left: 260px;
}

/* Form relation
----------------------------------------------- */
div.submitters {
  margin: 0;
  text-align: center;
}
div.submitters input, div.submitters a {
  margin: 20px 10px 10px;
}
dl.inquiry dd a,
dl.inquiry dd input[type="submit"],
.simulationForm button,
.valuationsForm input[type="submit"],
div.submitters input {
  width: 11em;
  height: 3.4em;
  padding: 0;
  border: 0;
  border-radius: 4px;
  background: linear-gradient(to bottom, #767676 0%, #333333 50%, #101010 51%, #303030 100%);
  color: #fff;
  font-size: 150%;
  font-weight: 500;
  text-align: center;
  text-decoration: none;
  text-shadow: black 2px 2px 0, black -2px 2px 0, black 2px -2px 0, black -2px -2px 0;
  vertical-align: middle;
  cursor: pointer;
}
.sp dl.inquiry dd a,
.sp dl.inquiry dd input[type="submit"],
.sp .simulationForm button,
.sp .valuationsForm input[type="submit"],
.sp div.submitters input {
  font-weight: bold;
}
dl.inquiry dd a,
dl.inquiry dd input[type="submit"],
.simulationForm button,
.valuationsForm input[type="submit"] {
  display: block;
  width: 100%;
  height: auto;
  margin: 0 0 10px auto;
  padding: 20px 0;
  border: 1px solid #999;
  font-size: 130%;
}
dl.inquiry dd a:hover,
dl.inquiry dd input[type="submit"]:hover,
.simulationForm button:hover,
.valuationsForm input[type="submit"]:hover,
div.submitters input:hover {
  opacity: 0.9;
}

/* =========================================================
   Pieces
========================================================= */
/* piece
----------------------------------------------- */
#main .piece {
  margin-bottom: 20px;
}

/* header-navi
----------------------------------------------- */
#headerNavi {
  background-color: #000;
}
#headerNavi .pieceBody {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  max-width: 100%;
  min-height: 38px;
  margin: 0 auto;
  padding: 5px 0;
  color: #fff;
  font-size: 90%;
}
#headerNavi .pieceBody > div {
  margin-left: 10px;
}
#headerNavi .pieceBody > div,
#headerNavi ul {
  display: flex;
  align-items: center;
}
#headerNavi li:not(.translate) {
  line-height: 1;
  border-right: 1px dotted #fff;
}
#headerNavi li.translate + li {
  border-left: 1px dotted #fff;
}
#headerNavi li:not(.translate) a {
  display: block;
  padding: 0 10px;
  color: #fff;
}
#headerNavi li.translate {
  margin: 0 10px;
}
#headerNavi li.translate img {
  max-width: none;
}

/* common header
----------------------------------------------- */
#commonHeader {
  margin: 0 auto;
  padding: 10px 0;
}
#commonHeader .pieceBody {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
}
#commonHeader ul {
  display: flex;
}
#commonHeader ul {
  margin-left: auto;
}
#commonHeader li:not(:last-child) {
  margin-right: 10px;
}

/* global navi
----------------------------------------------- */
#globalNavi {
  margin-bottom: 10px;
}
#globalNavi ul {
  display: flex;
  position: relative;
  margin: 0 auto;
}
#globalNavi li {
  flex: 1 1 0%;
}
#globalNavi li a {
  display: block;
  position: relative;
  font-size: 115%;
  text-decoration: none;
}

/* breadCrumbs
----------------------------------------------- */
#breadCrumbs {
  margin-bottom: 10px;
}
#breadCrumbs .pieceBody {
  font-size: 90%;
}
#breadCrumbs ol {
  display: flex;
  flex-wrap: wrap;
  list-style-type: none;
}
#breadCrumbs li:not(:last-child)::after {
  content: ">";
  margin: 0 0.25em;
}

/* page-title
----------------------------------------------- */
#pageTitle.piece {
  margin-bottom: 10px;
}
#pageTitle h1 {
  padding: 8px 20px 12px;
  color: #fff;
  font-size: 150%;
}

/* pieceHeader
----------------------------------------------- */
.pieceHeader, #pageTitle .pieceBody {
  position: relative;
  background-color: #565656;
  background-image: linear-gradient(45deg, #4d4d4d 25%, #4d4d4d 25%, transparent 25%, transparent 75%, #4d4d4d 75%, #4d4d4d 75%),
  linear-gradient(-135deg, #4d4d4d 25%, #4d4d4d 25%, transparent 25%, transparent 75%, #4d4d4d 75%, #4d4d4d 75%);
  background-position: left top, 10px 10px;
  background-size: 20px 20px;
}
.pieceHeader::after,
#pageTitle .pieceBody::after {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(to bottom, transparent 0%, transparent 50%, rgba(0,0,0,0.35) 50%, rgba(0,0,0,0.9) 100%);
  z-index: 0;
}
.pieceHeader h2,
#pageTitle h1 {
  position: relative;
  color: #fff;
  text-shadow: black 1px 1px 0, black -1px 1px 0, black 1px -1px 0, black -1px -1px 0;
  z-index: 1;
}

/* valuations
----------------------------------------------- */
#valuations {
  margin-bottom: 10px;
}
#valuations .pieceContainer {
  border: 1px solid #999;
}
#valuations h2 {
  padding: 6px 0;
  text-align: center;
}
#valuations .pieceBody {
  padding: 0 15px 10px;
}
#valuations .submit input {
  display: block;
  position: relative;
  width: 204px;
  height: 38px;
  margin: 10px auto 0;
  border: 0;
  background: url("../images/submit.png") no-repeat left top;
  cursor: pointer;
  text-indent: 204px;
  white-space: nowrap;
  overflow: hidden;
}
#valuations select {
  width: 100%;
  height: auto;
}
#valuations dt {
  font-weight: 500;
}

/* bnCampaign
----------------------------------------------- */
#bnCampaign,
#bnFeature {
  margin-bottom: 20px;
}
#bnCampaign ul,
#bnFeature ul {
  display: flex;
  justify-content: space-between;
}

/* bnFeature
----------------------------------------------- */
#bnFeature .pieceHeader {
  padding: 14px 0;
  text-align: center;
}
#bnFeature h2 {
  position: relative;
  font-size: 180%;
}
#bnFeature h2 img {
  position: absolute;
  left: 5px;
  top: -25px;
}
#bnFeature .pieceBody {
  padding: 0 20px 20px;
  background-color: #000;
}

/* bnSide
----------------------------------------------- */
#bnSide ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}
#bnSide li {
  margin-bottom: 20px;
}

/* recentPurchase
----------------------------------------------- */
.piece[id^="recent"] .pieceHeader {
  padding: 10px 0;
  text-align: center;
}
#recentPurchase .docs,
.purchase .contentGpArticleDocs .docs ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin-bottom: 15px;
}
#recentPurchase .docs li,
.purchase .contentGpArticleDocs .docs li {
  flex-basis: calc(50% - 7.5px);
  margin-top: 15px;
}
.docs a.doc_link {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: relative;
  height: 100%;
  padding: 15px 30px;
  border: 1px solid #ccc;
  border-radius: 6px;
  background: linear-gradient(to bottom, #eee 0%, #fff 100%);
  color: inherit;
  text-decoration: none;
  overflow: hidden;
}
.docs a.doc_link::before {
  content: "";
  position: absolute;
  left: 0;
  top: 0;
  width: 5px;
  height: 100%;
  background-color: #1a32b0;
}
.docs a.doc_link:hover {
  background: linear-gradient(to bottom, rgba(238,238,238,0.6) 0%, rgba(255,255,255,0.6) 100%);
}
.docs a.doc_link .body {
  flex-basis: calc(100% - 130px);
}
.docs a.doc_link .body img {
  display: none;
}
.docs a.doc_link .body p {
  margin: 0;
}
.docs a.doc_link .image {
  flex-basis: 120px;
}
.docs + .more {
  margin-bottom: 20px;
  text-align: center;
}
.docs + .more a {
  display: block;
  padding: 5px;
  background-color: #eee;
  color: inherit;
  text-decoration: none;
}
.docs + .more a:hover {
  background-color: rgba(238,238,238,0.8);
}

/* recentNews
----------------------------------------------- */
#recentNews .docs,
.news .contentGpArticleDocs .docs {
  margin-top: 15px;
}
#recentNews .docs li:not(:last-child),
.news .contentGpArticleDocs .docs li {
  margin-bottom: 5px;
  padding-bottom: 5px;
  border-bottom: 1px dotted #ccc;
}
#recentNews .docs li .date,
.news .contentGpArticleDocs .docs li .date {
  display: inline-block;
  line-height: 1.3;
  width: 9em;
  padding-left: 0.5em;
  border-left: 3px solid #1930b0;
}
#recentNews .docs li a,
.news .contentGpArticleDocs .docs li a {
  text-decoration: none;
}
#recentNews .docs li a:hover,
.news .contentGpArticleDocs .docs li a:hover {
  text-decoration: underline;
}

/* smart switch
----------------------------------------------- */
#smartSwitch {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 15px 10px;
}
#google_translate_element {
  flex-basis: 128px;
}
#smartSwitch .switch {
  flex-basis: calc(100% - 138px);
}
#smartSwitch .switch a {
  display: block;
  text-align: center;
  text-decoration: none;
}
#smartSwitch a.pc {
  /*margin: 15px 10px;*/
  border: 2px solid #ccc;
  color: #000;
}
#smartSwitch a.sp {
  margin: 0 0 20px;
  background-color: #e81414;
  color: #fff;
  font-size: 185%;
}
#smartSwitch a span {
  display: inline-block;
}
#smartSwitch a.pc span {
  padding: 8px 0 8px 20px;
  background: url("../images/ic-pc.png") no-repeat left center;
  background-size: 15px 14px;
}
#smartSwitch a.sp span {
  padding: 20px 30px;
  background: url("../images/ic-smartphone.png") no-repeat left center;
}
#pageHeader #smartSwitch .switch {
  flex-basis: 100%;
}
#pageHeader #smartSwitch a.sp {
  margin: 0;
}
#pageHeader #smartSwitch {
  padding: 0;
}
.sp #pageHeader #smartSwitch {
  display: block;
}
@media only screen and (max-width: 400px) {
  #footerSwitch {
    padding: 10px 0 0;
    text-align: center;
  }
  #google_translate_element {
    float: none;
  }
  #smartSwitch .switch {
    margin: 0;
  }
}
/* スマートフォンのとき、動的ページの「PCサイトに表示切り替え」を非表示にする
----------------------------------------------- */
.dir-valuations #smartSwitch {
  justify-content: space-around;
}
.dir-valuations #smartSwitch .switch {
  display: none;
}

/* common-footer
----------------------------------------------- */
#commonFooter {
  background-color: #eee;
  font-size: 90%;
}
#commonFooter .pieceBody {
  display: flex;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
}
#commonFooter ul {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  line-height: 1;
}
#commonFooter li:not(.copyright):not(:first-child) {
  margin-left: 5px;
  padding-left: 5px;
  border-left: 1px solid #000;
}
#commonFooter li a {
  display: block;
  color: #000;
  text-decoration: none;
}
#commonFooter li a:hover {
  text-decoration: underline;
}
#commonFooter small {
  font-size: 90%;
}

/* page-top
----------------------------------------------- */
.pagetop {
  text-align: right;
}
.pagetop a::before {
  content: "▲";
}

/* =========================================================
   Contents
========================================================= */
/* body
----------------------------------------------- */
.contentGpArticleDoc > div:not(.date) {
  margin-bottom: 20px;
}

/* contentGpArticleDoc
----------------------------------------------- */
.contentGpArticleDoc .date {
  margin-bottom: 1em;
  text-align: right;
}

/* sitemap
----------------------------------------------- */
.sitemap li.level1 {
  margin-bottom: 5px;
  padding-bottom: 5px;
  border-bottom: 1px dotted #ccc;
}
.sitemap a.level1 {
  display: inline-block;
  line-height: 1.3;
  margin-right: 1em;
  padding-left: 0.5em;
  border-left: 3px solid #1930b0;
  text-decoration: none;
}
.sitemap a.level1:hover {
  text-decoration: underline;
}
.sitemap li.level2 {
  display: none;
}

/* valuation_calc result
----------------------------------------------- */
.body ul.asterisk {
  margin: 0 0 15px;
}
.body ul.asterisk li {
  padding: 0 0 0 1em;
  background: none;
  text-indent: -1em;
}
.body ul.asterisk li::before {
  content: "※";
}
div.valuation,
dl.valuation {
  margin-bottom: 1em;
  padding: 20px;
  border: 1px solid #999;
}
.valuation dl,
dl.valuation,
dl.inquiry {
  letter-spacing: -0.4em;
}
.valuation dl:first-child {
  border-bottom: 1px solid #999;
}
.valuation dl dt,
.valuation dl dd,
dl.valuation dt,
dl.valuation dd,
dl.inquiry dt,
dl.inquiry dd {
  display: inline-block;
  vertical-align: middle;
  letter-spacing: normal;
}
.valuation dl dt,
dl.valuation dt,
dl.inquiry dt {
  width: 55%;
}
.valuation dl dd,
dl.valuation dd,
dl.inquiry dd {
  width: 45%;
}
.valuation dl dt,
dl.valuation dt {
  font-size: 150%;
}
.valuation dl dd,
dl.valuation dd {
  font-size: 180%;
  text-align: right;
}
dl.inquiry dt {
  font-size: 115%;
}
dl.inquiry dd {
  text-align: right;
}
dl.inquiry span {
  display: block;
}
dl.inquiry dt a {
  display: inline-block;
  vertical-align: top;
}
.valuationsForm input[type="submit"] {
  width: auto;
  margin: 0 auto;
  padding: 20px 40px;
}

/* valuation_calc commit
----------------------------------------------- */
.valuationsForm table,
.simulationForm table {
  width: 100%;
}
.valuationsForm th {
  width: 12em;
  text-align: left;
}
@media only screen and (max-width: 600px) {
  .valuationsForm table,
  .simulationForm table {
    table-layout: fixed;
  }
}
.simulationForm th {
  width: 6em;
  text-align: left;
}
.valuationsForm td input#address {
  width: 99%;
}
.valuationsForm td textarea {
  height: 10em;
}
.required {
  display: inline-block;
  color: #ee0000;
  vertical-align: middle;
}
.valuationsForm table p {
  margin: 0;
}
.valuationsForm table ul {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
}
.valuationsForm table li {
  margin: 0 1em 0 0;
  padding: 0;
  background: none;
}
.valuationsForm table.personal li.available dl dt,
.valuationsForm table.personal li.available dl dd {
  display: inline-block;
  vertical-align: middle;
}
#bike_valuation_valuation_customer_email {
  width: 100%;
}
.surveyForm button[type="submit"],
.surveyForm input[type="submit"] {
  display: block;
  margin: 20px auto 0;
}
#bike_valuation_valuation_customer_age {
  margin-right: 0.5em;
}
.available_about, .available_detail {
  display: inline-block;
  max-width: 48%;
  vertical-align: middle;
}
.available_about {
  margin-right: 1em;
}
/* =========================================================
   direct
========================================================= */
/* common
----------------------------------------------- */
.temp1 .thumb {
  margin: 0 1em 1em 0;
}
.temp2 .thumb {
  margin: 0 0 1em 1em;
}
ul.flex-between {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0;
}
ul.flex-between li {
  margin: 0 0 1em;
  padding: 0;
  background: none;
}
dl.point {
  display: flex;
  flex-wrap: wrap;
}
dl.point dt {
  width: 5.5em;
  font-weight: bold;
}
dl.point dd {
  width: calc(100% - 5.5em);
}
dl.dot {
  display: flex;
  flex-wrap: wrap;
  margin-bottom: 1em;
}
dl.dot dt {
  width: 15em;
  background: url("../images/dot.svg") repeat-x right center;
}
dl.dot dt span {
  display: inline-block;
  padding-right: 0.25em;
  background-color: #fff;
}
dl.dot dd {
  width: calc(100% - 15em);
}
.body span.more {
  display: inline-block;
  margin: 0;
  padding: 0;
  background-color: transparent;
  text-align: left;
  text-indent: 0;
}
.body div.notice {
  margin: 1.5em 0;
  text-align: center;
}
.body div.notice > p {
  display: inline-block;
  text-align: left;
}

/* reason
----------------------------------------------- */
h2.ribbon-blue,
h2.ribbon-blue-arrow,
h2.ribbon-green,
h3.ribbon-green {
  line-height: 50px;
  margin-right: 0;
  padding: 0;
  border: 0;
  background-position: left center;
  background-repeat: no-repeat;
  background-size: cover;
  font-size: 150%;
  text-align: center;
}
h2.ribbon-blue,
h2.ribbon-blue-arrow {
  display: flex;
  justify-content: space-between;
}
h2.ribbon-blue {
  background-image: url("../images/ribbon-blue.svg");
}
h2.ribbon-blue-arrow {
  background-image: url("../images/ribbon-blue-arrow.svg");
  color: #fff;
}
h2.ribbon-green {
  background-image: url("../images/ribbon-green.svg");
}
h3.ribbon-green {
  display: inline-block;
  width: 15.5em;
  padding: 0 1em;
  background-image: url("../images/ribbon-green-short.svg");
  color: #fff;
  text-align: left;
}
h2.ribbon-blue span,
h2.ribbon-blue-arrow span {
  display: inline-block;
}
h2.ribbon-blue span:first-child {
  width: 4em;
}
h2.ribbon-blue-arrow span:first-child {
  width: 9em;
}
h2.ribbon-blue span:nth-child(2),
h2.ribbon-blue-arrow span:nth-child(2) {
  padding-right: 20px;
}
h2.ribbon-blue span:nth-child(2) {
  width: calc(100% - 4em);
}
h2.ribbon-blue-arrow span:nth-child(2) {
  width: calc(100% - 9em - 110px);
}

/* quality
----------------------------------------------- */
ul.table {
  display: flex;
  flex-wrap: wrap;
  margin: 0 0 20px;
  border-left: 1px solid #333;
  border-top: 1px solid #333;
}
ul.table li {
  width: 50%;
  padding: 1em;
  border-right: 1px solid #333;
  border-bottom: 1px solid #333;
  background: none;
}
ul.table h2 {
  margin-top: 0 !important;
}
ul.table .temp2 .thumb {
  width: 37%;
}

/* qa
----------------------------------------------- */
div.anchor,
div.question li {
  margin: 0 0 1em;
  padding: 1em;
  border: 1px solid #333;
}
div.anchor {
  margin-bottom: 2em;
}
ul.question,
div.question ul {
  margin: 0 0 1em;
}
ul.question li a::before,
div.question li h3::before {
  content: "Q：";
}
div.question li p::before {
  content: "A：";
}
ul.question li,
div.question li {
  background: none;
}
ul.question li,
div.question li h3 {
  padding-left: 1.7em;
  text-indent: -1.7em;
}
div.question li h3 {
  margin: 0 0 1em;
  font-weight: normal;
}
div.question li p {
  margin-bottom: 0;
  padding-left: 1.6em;
  text-indent: -1.6em;
}

/* line
----------------------------------------------- */
.noMargin {
  margin-bottom: 0 !important;
}
ul.disc {
  margin: 0 0 1em;
}
ul.disc li::before {
  content: "・";
}
ul.disc li {
  padding-left: 1em;
  background: none;
  text-indent: -1em;
}