@charset "UTF-8";
/* フォーム入力の流れ */
@import url(https://fonts.googleapis.com/earlyaccess/notosansjapanese.css);
#formFlow {
  padding: 0;
  background: none;
  margin-bottom: 2rem;
  /* img { max-width: 222px; } */
}

/* form > div {
	padding: 2rem!important;
} */
form .formContainer {
  padding: 2rem;
  margin-top: 5rem;
}

form .formContainer {
  background: #efefef;
  padding-bottom: 1rem !important;
  margin-bottom: 2rem;
}

form {
  margin: 0;
}
form dl {
  font-size: .8125rem;
  border-bottom: 1px dotted #bcbcbc;
  margin-bottom: .875rem;
}
form dl:last-child {
  border-bottom: none;
  margin-bottom: 0;
}
form dt {
  font-size: 1rem;
  /*font-weight: normal;*/
  margin-bottom: 1rem;
}
form dd,
form p,
form label {
  font-size: inherit;
}
form dd {
  margin-bottom: 1rem;
}
form dd > ul {
  letter-spacing: -.40em;
  /* 文字間を詰めて隙間を削除する */
}
form dd > ul li {
  display: inline-block;
  letter-spacing: normal;
  /* 文字間を通常に戻す */
  width: 33.3333%;
}
form dd ul, form dd ol {
  margin: 0;
  font-size: inherit;
  /*.btn {
  	margin-bottom: 1rem;
  }*/
}
form dd ul li input[type="text"],
form dd ul li input[type="file"],
form dd ul li select, form dd ol li input[type="text"],
form dd ol li input[type="file"],
form dd ol li select {
  display: inline-block;
}
form dd ul li span, form dd ol li span {
  display: inline-block;
  margin-right: .5rem;
}
form .submit {
  width: 25%;
  margin: 1rem auto 0;
}

@media screen and (max-width: 37.5em) {
  /* 600px 以下 */
  form .formContainer {
    padding: 1rem;
  }
  form .btn {
    margin-top: 1rem;
  }
}
/* 各項目設定 */
/*#damage {
	ol {
		margin: 0;
		span {
			display: inline-block;
			margin-right: .5rem;
			width: 5em;
		}
	}
}
*/
span.bodyitem {
  display: inline-block;
  margin-right: .5rem;
  width: 5em;
}

/* パーツ */
input {
  margin-right: 3px !important;
}

input[type="text"],
input[type="file"],
select {
  width: 65%;
  cursor: pointer;
}

textarea {
  width: 100%;
}

input[type="text"],
select,
textarea {
  border: 3px solid #CCCCCC;
  -moz-border-radius: 0.25rem;
  -webkit-border-radius: 0.25rem;
  border-radius: 0.25rem;
  padding: 6px;
  outline: none;
}
input[type="text"]:focus,
select:focus,
textarea:focus {
  border: solid 3px #1CA8DD;
  background-color: #DDF2FA;
}

input[type="file"],
input[type="checkbox"],
input[type="radio"],
select {
  margin: 0 0 0.5rem;
}

/* モーダルウィンドウ */
.modalArea {
  font-size: .75rem;
  margin-top: 1rem;
  /*margin-bottom: 1rem;*/
}

.reveal-modal {
  min-height: 0;
  background: #FFF;
  z-index: 300000;
}
.reveal-modal h3 {
  padding-left: .5em;
  border-left: solid 5px #000000;
}
.reveal-modal p {
  font-size: .875rem;
}
.reveal-modal table {
  width: 100%;
  margin-bottom: 0;
}
.reveal-modal table th, .reveal-modal table td {
  font-size: .75rem;
}
.reveal-modal table th {
  width: 50%;
}
.reveal-modal table td {
  font-weight: normal;
}
.reveal-modal table ul {
  margin: 0;
  font-size: inherit;
}

@media screen and (max-width: 37.5em) {
  /* 600px 以下 */
  .reveal-modal {
    padding: .9375rem;
  }
}
/* 必須・任意 */
.req,
.opt {
  margin-right: .5rem;
  color: #FFF;
  font-size: .75rem;
  font-weight: normal;
  padding: .125rem .25rem;
  -moz-border-radius: 0.15rem;
  -webkit-border-radius: 0.15rem;
  border-radius: 0.15rem;
}

.req {
  background: #e74c3c;
}

.opt {
  background: #3cd7e7;
}

@media screen and (max-width: 37.5em) {
  /* 600px 以下 */
  form > div {
    padding: 0.9375rem !important;
  }
  form dd > ul li {
    width: 50%;
  }
  form .submit {
    width: 80%;
  }

  /* パーツ */
  input[type="text"],
  input[type="file"],
  select {
    width: 100%;
  }
}
/* エラー */
.err p {
  font-weight: bold !important;
  color: rgba(255, 255, 255, 0.9);
  padding: .25rem 1rem;
  position: relative;
  background: #e74c3c;
  border: solid 4px #eb6d60;
  -moz-border-radius: 0.25rem;
  -webkit-border-radius: 0.25rem;
  border-radius: 0.25rem;
}
.err p:after, .err p:before {
  top: 100%;
  left: 10%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
}
.err p:after {
  border-color: rgba(231, 76, 60, 0);
  border-top-color: #e74c3c;
  border-width: 6px;
  margin-left: -6px;
}
.err p:before {
  border-color: rgba(231, 76, 60, 0);
  border-top-color: #eb6d60;
  border-width: 12px;
  margin-left: -12px;
}

.errBox {
  background-color: #e74c3c;
  border: solid 4px #eb6d60;
  padding: 1rem;
  margin-bottom: 2rem;
  -moz-border-radius: 0.25rem;
  -webkit-border-radius: 0.25rem;
  border-radius: 0.25rem;
}
.errBox h3, .errBox ul, .errBox p, .errBox a {
  color: rgba(255, 255, 255, 0.9);
}
.errBox h3 {
  font-size: 1rem;
}
.errBox ul, .errBox p {
  font-size: .875rem;
  margin-bottom: 1rem;
}

/* 注意書き インデントあり */
.note {
  font-size: .6875rem;
}
.note a {
  text-decoration: underline;
}

/* テキストの装飾 */
.tfx-bold {
  font-weight: bold;
}

/*

div#horizontalTab.r-tabs > ul.r-tabs-nav > li.r-tabs-state-default.r-tabs-tab > a.r-tabs-anchor

*/
/* シュミレータ */
/* Before&After */
.r-tabs {
  position: relative;
}
.r-tabs .r-tabs-nav {
  margin: 0;
  padding: 0;
  /*border-bottom: 1px solid $tabs-borderColor;*/
  letter-spacing: -.4em;
}
.r-tabs .r-tabs-nav .r-tabs-tab {
  display: inline-block;
  margin: 0;
  list-style: none;
  width: 12.5%;
  /* リストの幅 */
  position: relative;
  /*top: 1px;*/
  letter-spacing: normal;
  text-align: center;
}
.r-tabs .r-tabs-nav .r-tabs-anchor {
  display: inline-block;
  background-color: #C2E0F4;
  /*margin-bottom: 3px;*/
  padding: 10px 0;
  color: #144b70;
  font-size: .75rem;
  font-weight: bold;
  width: 100%;
}
.r-tabs .r-tabs-nav .r-tabs-anchor:hover {
  background-color: white;
}
.r-tabs .r-tabs-nav .r-tabs-anchor span {
  font-size: .6875rem;
}
.r-tabs .r-tabs-nav .r-tabs-state-active {
  background-color: #FFFFFF;
  margin-bottom: -1px;
  /*border: 1px solid $tabs-borderColor;*/
  border-bottom: none;
  border-top: solid 4px #076BAF;
}
.r-tabs .r-tabs-nav .r-tabs-state-active .r-tabs-anchor {
  color: #144b70;
  background-color: #FFFFFF;
}

/* パネル */
.r-tabs-panel {
  display: none;
  /*border: 1px solid $tabs-borderColor;*/
  border-top: none;
  padding: 15px;
  background-color: #FFF;
}
.r-tabs-panel.r-tabs-state-active {
  display: block;
}

/* アコーディオン */
.r-tabs-accordion-title {
  display: none;
}
.r-tabs-accordion-title .r-tabs-anchor {
  display: block;
  padding: 10px;
  background-color: #C2E0F4;
  color: #144b70;
  text-decoration: none;
  margin-bottom: 1px;
}
.r-tabs-accordion-title.r-tabs-state-active .r-tabs-anchor {
  background-color: #FFFFFF;
  color: #144b70;
  /*margin-bottom: -1px;*/
  border-bottom: 1px solid #ecf0f1;
  margin-bottom: 0;
}

/* Accordion responsive breakpoint */
@media only screen and (max-width: 48em) {
  /* 768px以下 */
  .r-tabs .r-tabs-nav {
    display: none;
  }
  .r-tabs .r-tabs-panel {
    margin-bottom: 5px;
  }
  .r-tabs .r-tabs-accordion-title {
    display: block;
  }
}
/* クリックしても動かさない時 jsで指定 */
.r-tabs-nav .r-tabs-state-disabled,
.r-tabs-accordion-title.r-tabs-state-disabled {
  opacity: 0.5;
}

/* =======================================================

RESET
※normalize.scssを上書き

======================================================= */
html, body {
  font-size: 16px;
  /* IE8 fallback */
  font-size: 1rem;
  font-family: Verdana, "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  line-height: 1.8;
  color: #464646;
}

h1, h2, h3, h4, h5, h6 {
  font-weight: normal;
  margin: 0 0 2rem 0;
}
h1 em, h2 em, h3 em, h4 em, h5 em, h6 em {
  font-style: normal !important;
}
h1 em.colorRed, h2 em.colorRed, h3 em.colorRed, h4 em.colorRed, h5 em.colorRed, h6 em.colorRed {
  color: #e74c3c;
}

h2, h3 {
  font-family: "Noto Sans Japanese";
  font-weight: bold;
}

@media only screen and (min-width: 40.063em) {
  #rimowaArea h2 em {
    font-size: 3rem;
  }
}
a {
  text-decoration: none;
}

ul {
  margin: 0;
  padding: 0;
}

li {
  list-style: none;
}

dfn,
em {
  font-style: normal;
}

b {
  font-weight: normal;
}

mark {
  background: #f1c40f;
}

/* =======================================================

body

======================================================= */
body,
#copyright {
  background-image: url(../img/bg_body@2x.png);
  background-repeat: repeat-x;
  background-size: 72px 6px;
  padding-top: 6px;
}

/* =======================================================

header

======================================================= */
header {
  position: absolute;
  z-index: 10000;
  width: 100%;
}

.headerArea {
  height: 45px;
  /* a {
  	color: inherit;
  }
  */
}
.headerArea h1,
.headerArea p,
.headerArea ul li {
  display: inline-block;
  font-size: .75rem;
  line-height: 45px;
  margin: 0 1em;
  color: #999;
}
.headerArea h1 span,
.headerArea p span,
.headerArea ul li span {
  font-weight: bold;
}
.headerArea h1 {
  margin-right: 0;
}
.headerArea p {
  margin-left: 0;
}
.headerArea ul {
  float: right;
}
.headerArea i.fa-circle {
  color: #3498db;
}

/* ロゴ */
.logoArea {
  overflow: hidden;
  /*padding: $h_header 0;*/
}
.logoArea li {
  float: right;
}
.logoArea li:first-child {
  float: left;
}

/* 600px以下で出現するナビ */
#hNav {
  margin: 15px;
  overflow: hidden;
}
#hNav li {
  float: left;
  margin-right: 15px;
}
#hNav li:last-child {
  float: right;
  margin-right: 0;
}
#hNav li img {
  max-height: 36px;
}

@media screen and (max-width: 48em) {
  /* 768px 以下 */
  .headerArea p {
    display: none;
  }
}
@media screen and (max-width: 37.5em) {
  /* 600px 以下 */
  .headerArea,
  .logoArea {
    display: none;
  }
}
/* =======================================================

.cbp-af-header

======================================================= */
.cbp-af-header {
  position: fixed;
  top: 138px;
  left: 0;
  width: 100%;
  z-index: 20000;
  /*height: 230px;*/
  overflow: hidden;
  -moz-transition-property: top;
  -o-transition-property: top;
  -webkit-transition-property: top;
  transition-property: top;
  -moz-transition-duration: 0.4s;
  -o-transition-duration: 0.4s;
  -webkit-transition-duration: 0.4s;
  transition-duration: 0.4s;
  /* スクロール時 */
}
.cbp-af-header.cbp-af-header-shrink {
  position: fixed;
  top: 0;
  left: 0;
  box-shadow: 0px 5px 3px -3px rgba(0, 0, 0, 0.3);
  -moz-transition-property: top;
  -o-transition-property: top;
  -webkit-transition-property: top;
  transition-property: top;
  -moz-transition-duration: 0.2s;
  -o-transition-duration: 0.2s;
  -webkit-transition-duration: 0.2s;
  transition-duration: 0.2s;
}

/* =======================================================

コンバージョン固定バナー

======================================================= */
#conversion {
  position: fixed;
  right: 0;
  bottom: 80px;
  z-index: 50000;
}
#conversion li {
  margin-top: .625rem;
}

@media screen and (max-width: 64em) {
  /* 1024px 以下 */
  #conversion {
    display: none;
  }
}
/* =======================================================

ナビゲーション

======================================================= */
nav {
  border-top: #F2EFEF solid 1px;
  border-bottom: #F2EFEF solid 1px;
  background: #FFF;
  padding: 15px 0;
}
nav ul {
  overflow: hidden;
}
nav li {
  width: 20%;
  /* width: 16.6666%; */
  text-align: center;
  float: left;
  /*background: #CF6;*/
}
nav li a {
  display: block;
}

@media screen and (max-width: 37.5em) {
  /* 600px 以下 */
  nav {
    display: none;
  }
}
/* =======================================================

キャッチ / シミュレータ

======================================================= */
#catch {
  /*margin-top: $h_header*3 + $h_logo;*/
  padding-top: 215px;
  margin-bottom: 60px;
}
#catch h2 {
  margin-bottom: 1rem;
  color: #FFF;
}
#catch .catch-inner {
  background: #3498db;
  /*background-image: url(../img/bg_simulator.png);
  background-size: 440px 71px;
  background-repeat: no-repeat;
  background-position: right bottom;*/
  /*padding: 2rem 0;*/
}
#catch .catch-inner > p {
  text-align: center;
  margin-bottom: 0;
}
#catch .catch-inner > .row {
  max-width: 75em;
  padding: 2rem 0;
}
#catch .catch-inner li:last-child {
  padding-bottom: 0;
}
#catch.toppage {
  margin-bottom: 0;
}
#catch.toppage .catch-inner {
  background: #3498db;
}

.bnrArea img {
  animation: ath-logo 2.5s 1 ease forwards;
}
@keyframes ath-logo {
  0% {
    opacity: 0;
    transform: translateY(100px);
  }
  50% {
    opacity: 0;
  }
  100% {
    opacity: 1;
    transform: translateY(0);
  }
}
@media screen and (max-width: 48em) {
  .bnrArea {
    /* 768px 以下 */
    margin-top: 1.25rem;
  }
}

.sim-step ul li {
  margin-bottom: 1rem;
}

@media screen and (max-width: 48em) {
  /* 768px 以下 */
  #catch .catch-inner {
    background-image: none;
  }
  #catch .catch-inner > .row {
    background-image: none;
  }
}
body.inner #catch .catch-inner {
  background-image: none;
}
body.inner #catch .catch-inner > .row {
  max-width: 63em;
  padding: 0;
  background-image: none;
}
body.inner #catch .catch-inner h2 {
  margin: 3rem 0;
  text-align: center;
}

@media screen and (max-width: 48em) {
  /* 768px 以下 */
  body.inner #catch .catch-inner {
    /*background: none;*/
  }
  body.inner #catch .catch-inner h2 {
    margin: 1.5rem 0;
  }
}
/* シミュレータ */
#simulator {
  margin-bottom: 1rem;
}
#simulator > div {
  background: #2383c4;
  padding: 1rem;
  -moz-border-radius: 0.5rem;
  -webkit-border-radius: 0.5rem;
  border-radius: 0.5rem;
  /*border: solid 5px #FFFFFF;*/
}
#simulator form {
  margin-bottom: 1rem;
}
#simulator form > div {
  font-size: .875rem;
  background: none;
  padding: 0 !important;
  margin-bottom: 0;
}
#simulator form p:last-child {
  margin-bottom: 0;
}
#simulator .selectArea h3 {
  font-size: .875rem;
  font-weight: bold;
  margin-bottom: 1rem;
}
#simulator .selectArea ul, #simulator .selectArea ol {
  letter-spacing: -.4em;
}
#simulator .selectArea ul li, #simulator .selectArea ol li {
  display: inline-block;
  font-size: .75rem;
  letter-spacing: normal;
}
#simulator .selectArea ul.select-0 li, #simulator .selectArea ol.select-0 li {
  width: 33.3333%;
}
#simulator .selectArea ul.select-1 li, #simulator .selectArea ol.select-1 li {
  width: 50%;
}
#simulator .selectArea ul.select-2 li, #simulator .selectArea ol.select-2 li {
  width: 100%;
}
@media screen and (max-width: 48em) {
  #simulator .selectArea ul, #simulator .selectArea ol {
    /* 768px 以下 */
  }
  #simulator .selectArea ul h3, #simulator .selectArea ol h3 {
    margin-top: 1em;
  }
  #simulator .selectArea ul.select-0 li, #simulator .selectArea ol.select-0 li {
    width: 50%;
  }
  #simulator .selectArea ul.select-1 li, #simulator .selectArea ol.select-1 li {
    width: 100%;
  }
  #simulator .selectArea ul.select-2 li, #simulator .selectArea ol.select-2 li {
    width: 50%;
  }
}

/* 結果表示 */
.result {
  color: #FFFFFF;
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
  /* 結果 */
  /* 注意書 */
}
.result span {
  letter-spacing: .125em;
  display: inline-block;
  text-align: center;
  margin: 0 .5rem 0 0;
  width: 8em;
  -moz-border-radius: 0.2rem;
  -webkit-border-radius: 0.2rem;
  border-radius: 0.2rem;
}
.result p {
  margin-bottom: .5rem;
}
.result em {
  color: #e74c3c;
  display: inline-block;
  padding: 0 .5rem;
  margin: 0 .25rem;
  font-size: 2rem;
  font-weight: normal;
  line-height: 1.4;
  background: #FFFFFF;
  border: solid 2px #CCCCCC;
  -moz-border-radius: 0.2rem;
  -webkit-border-radius: 0.2rem;
  border-radius: 0.2rem;
}
.result ul.indent li,
.result ol.indent li {
  opacity: .85;
  font-size: .6875rem;
}
.result ul.indent li a,
.result ol.indent li a {
  color: #FF0;
  font-weight: bold;
  border-bottom: dotted 1px #FF0;
}

form .result {
  color: inherit;
}
form .result p span {
  color: #FFF;
}

@media screen and (max-width: 48em) {
  /* 768px 以下 */
  .result p {
    font-size: .875rem;
  }
}
@media screen and (max-width: 37.5em) {
  /* 600px 以下 */
  #catch {
    padding-top: 66px;
    margin-bottom: 30px;
  }
  #catch #simulator > div {
    background: none;
    padding: 0;
  }
  #catch .btn {
    margin-top: 1rem;
  }
  #catch .btn:first-child {
    margin-top: 0;
  }

  .result {
    /* 結果 */
  }
  .result p {
    margin-bottom: 1rem;
  }
  .result span {
    display: block;
    width: 100%;
    margin-bottom: 1rem;
  }
  .result em {
    font-size: 1.5rem;
  }
}
/* =======================================================

お知らせ・至急注意事項

======================================================= */
#newsArea {
  background: #ECF0F1;
  margin-bottom: 60px;
  padding: 1rem 0;
}
#newsArea .newsBox p {
  font-size: .875rem;
  margin: 0;
}
#newsArea .newsBox p span {
  letter-spacing: 1;
  margin-right: 1em;
  font-size: .6875rem;
  font-weight: normal;
  background: #E84D3D;
  padding: .125rem 1em;
  color: #FFF;
}
#newsArea .newsBox p em {
  font-weight: bold;
}
#newsArea .newsBox p em.newsStyle-1 {
  color: #E84D3D;
  letter-spacing: 3;
  font-size: 2rem;
  /* background: #FF0; */
  padding: 0 .25em;
}
#newsArea .newsBox p a {
  color: inherit;
  text-decoration: underline;
  font-weight: bold;
}

@media screen and (max-width: 37.5em) {
  #newsArea .newsBox p {
    font-size: .75rem;
  }
  #newsArea .newsBox p em {
    font-size: 1rem;
  }
}
/* 下層ページにお知らせを設置する */
.inner #newsArea {
  margin-top: -60px;
}

@media screen and (max-width: 37.5em) {
  .inner #newsArea {
    margin-top: -30px;
  }
}
.cautionBox {
  background-color: #E84C3D;
  border: 8px solid #d82a1a;
  color: #FFF;
  padding: 2rem;
  margin: 1rem 0;
}
.cautionBox h4 {
  color: inherit;
  font-weight: bold;
}

/* =======================================================

メインカラム

======================================================= */
.main {
  /*padding-top: $h_header*3 + $h_logo + 100px;*/
}
.main > section {
  margin: 0 0 3.75rem 0;
}
.main > section > section {
  background: #ecf0f1;
  padding: 1.875rem;
}

h1 small,
h2 small,
h3 small,
h4 small {
  display: block;
  padding: .5em 0;
}
h1 em,
h2 em,
h3 em,
h4 em {
  font-style: italic;
}
h1 i,
h2 i,
h3 i,
h4 i {
  color: #e74c3c;
}

footer h3 small {
  display: inline-block;
}

#flow h4 i {
  color: #1abc9c;
}

/* コンバージョンボタン */
.cv {
  margin-top: 3.75rem !important;
}
.cv > section {
  background: #FFF !important;
  border: solid 1px #E6E0E0;
  -moz-border-radius: 7px;
  -webkit-border-radius: 7px;
  border-radius: 7px;
}
.cv h2 {
  font-size: 1rem;
  margin-bottom: 1rem;
}
.cv p {
  font-size: .875rem;
  margin-bottom: 1rem;
}
.cv p em {
  color: #000;
  font-weight: bold;
}
.cv li {
  margin-top: .5rem;
}
.cv > section > div {
  position: relative;
  z-index: 2000;
}
.cv .gatspose {
  position: absolute;
  bottom: 0;
  right: 1.875rem;
  z-index: 1000;
}

@media screen and (max-width: 48em) {
  /* 768px 以下 */
  .main > section p,
  .main > section ul,
  .main > section li {
    font-size: .875rem;
  }
  .main > section > section {
    padding: .9375rem;
  }

  .cv {
    display: none;
  }
}
/* デバイス紹介 */
.smh {
  background: #34495e;
  color: #ecf0f1;
}
.smh dl, .smh dt, .smh dd {
  margin: 1rem 0;
}
.smh dl {
  overflow: hidden;
  font-size: .875rem;
}
.smh dl dt {
  float: left;
  margin-right: 1rem;
}
.smh dl dt img {
  max-height: 80px;
}
.smh dl dd img {
  float: right;
  margin-left: 1em;
  max-width: 80px;
}
.smh dl dd span {
  font-size: .6875rem;
}

@media screen and (max-width: 48em) {
  /* 768px 以下 */
  .smh dl {
    font-size: .75rem;
  }
  .smh dl dd img {
    display: none;
  }
}
@media screen and (max-width: 37.5em) {
  /* 600px 以下 */
  .smh dl dt {
    float: none;
    margin-right: 0;
    text-align: center;
  }
}
/* パンくず */
.bread {
  background: #2c3e50;
}
.bread li {
  float: left;
  padding: .5rem 0;
}
.bread li, .bread p {
  font-size: .75rem;
}
.bread p {
  margin-bottom: 0;
  text-align: right;
  padding: .5rem .9375rem;
}
.bread p a {
  margin-right: 0;
}
.bread li,
.bread a,
.bread i {
  color: #ecf0f1;
}
.bread a, .bread i {
  margin-right: .5em;
}

@media screen and (max-width: 37.5em) {
  /* 600px 以下 */
  .bread li {
    font-size: .6875rem;
  }
}
/* Before & After */
.case img,
img.radius {
  -moz-border-radius: 0.3125rem;
  -webkit-border-radius: 0.3125rem;
  border-radius: 0.3125rem;
}

.segment {
  margin-top: -0.5rem !important;
}
.segment li {
  font-size: .875rem;
  margin-top: .5rem;
}
.segment li:last-child span {
  background: #f39c12;
}
.segment span {
  display: inline-block;
  margin-right: 1em;
  text-align: center;
  width: 8em;
  background: #3498db;
  color: #FFF;
  -moz-border-radius: 0.15rem;
  -webkit-border-radius: 0.15rem;
  border-radius: 0.15rem;
}

@media screen and (max-width: 48em) {
  /* 768px 以下 */
  .case img {
    margin-bottom: .5rem;
  }
}
/* flow */
#flow .indent {
  margin-bottom: 2rem;
}
#flow .Grid-box .columns > div {
  padding: 1rem;
  background: #ecf0f1;
  margin-bottom: 1rem;
}
#flow .Grid-box .columns > div a {
  font-size: .75rem;
}
#flow .Grid-box .columns > div h4 {
  margin: 1rem 0;
}
#flow .Grid-box .columns > div p {
  margin: 1rem 0 0 0;
}
#flow .Grid-box .columns:nth-child(1) > div {
  border-top: solid 5px #1abc9c;
}
#flow .Grid-box .columns:nth-child(2) > div {
  border-top: solid 5px #2ecc71;
}
#flow .Grid-box .columns:nth-child(3) > div {
  border-top: solid 5px #3498db;
}

.flowImg {
  margin-left: -23px;
  letter-spacing: -.4em;
}
.flowImg li {
  display: inline-block;
  margin-left: 23px;
  margin-bottom: 1rem;
  letter-spacing: normal;
}

#flow .lv1, #globetrotter .lv1 {
  padding: 1rem;
  background: #ecf0f1;
  border: solid 6px #e3e9eb;
}
#flow .lv1 a, #globetrotter .lv1 a {
  font-size: .75rem;
}
#flow .lv1 h5, #globetrotter .lv1 h5 {
  margin-bottom: 0;
  font-weight: bold;
}

/* sitemap */
#sitemap ul li ul {
  margin-left: 0;
  margin-bottom: 1rem;
}
#sitemap ul li ul li {
  font-size: .75rem;
}

/* =======================================================

フッター

======================================================= */
.goto .scroll img {
  vertical-align: bottom;
}

footer {
  padding: 2.5rem 0;
}

.f-contact h3, .f-contact ul {
  text-align: center;
}
.f-contact h3 {
  margin-bottom: 1.25rem;
}
.f-contact small {
  font-size: 70%;
}

@media screen and (max-width: 37.5em) {
  /* 600px 以下 */
  .f-contact ul li {
    text-align: left;
  }
}
/* ブランド名選択はすべてお見積りに誘導 */
.brand {
  /*margin-top: 1.25rem;*/
}
.brand > section {
  margin-top: 1.25rem;
}
.brand h3 {
  font-size: 1rem;
  margin-bottom: 0;
}
.brand h3 small {
  font-size: 80%;
  margin-left: 1em;
}
.brand ul {
  letter-spacing: -.4em;
  /*margin-left: -1em;*/
}
.brand li {
  display: inline-block;
  letter-spacing: normal;
  /* 文字間を通常に戻す */
  font-size: .6875rem;
  margin-left: -1em;
  padding-right: 1em;
  /*a {
  	padding: 0 1em;
  	border-right: dotted 1px #666;
  }*/
}
.brand li span {
  padding: 0 1em;
  border-right: dotted 1px #666;
}
.brand li:last-child {
  border-right: none;
}

/* =======================================================

コピーライト

======================================================= */
#copyright small {
  text-align: center;
  padding: .25rem;
}

/* =======================================================

修理事例
repair/

======================================================= */
#repairDIY,
#repairHIDE {
  border-width: 40px;
  border-style: solid;
}
#repairDIY .r-tabs-tab,
#repairHIDE .r-tabs-tab {
  width: 33.333%;
}

#repairDIY {
  border-color: #f39c12;
}

#repairHIDE {
  border-color: #2980B9;
}

#repairHIDE.arrow_box_section {
  position: relative;
  background: inherit;
}
#repairHIDE.arrow_box_section:after {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(41, 128, 185, 0);
  border-top-color: #2980B9;
  border-width: 100px;
  margin-left: -100px;
}

@media screen and (max-width: 48em) {
  /* 768px 以下 */
  #repairDIY,
  #repairHIDE {
    border-width: 10px;
  }

  #repairHIDE.arrow_box_section:after {
    border-width: 50px;
    margin-left: -50px;
  }
}
/* =======================================================

リモワ品質
special/quality.html

======================================================= */
#qualityArea h3 {
  font-size: 2.3125rem;
}

/* =======================================================

サイドから表示のメニュー
======================================================= */
.off-canvas-list a {
  font-size: .875rem;
}

/* =======================================================
矢印吹き出し
======================================================= */
.arrow_box_1 {
  position: relative;
  background: #2c3e50;
}
.arrow_box_1:after {
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(44, 62, 80, 0);
  border-left-color: #2c3e50;
  border-width: 5px;
  margin-top: -5px;
}
@media screen and (max-width: 37.5em) {
  .arrow_box_1 {
    /* 600px 以下 */
    position: relative;
    background: #2c3e50;
  }
  .arrow_box_1:after {
    top: 100%;
    left: 50%;
    border: solid transparent;
    content: " ";
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border-color: rgba(44, 62, 80, 0);
    border-top-color: #2c3e50;
    border-width: 12px;
    margin-left: -12px;
  }
}

.arrow_box_2 {
  position: relative;
  background: #999999;
}
.arrow_box_2:after {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(153, 153, 153, 0);
  border-top-color: #999999;
  border-width: 12px;
  margin-left: -12px;
}

.arrow_box_3 {
  position: relative;
  background: #999999;
}
.arrow_box_3:after {
  top: 100%;
  left: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(153, 153, 153, 0);
  border-top-color: #999999;
  border-width: 5px;
  margin-left: -5px;
}

.arrow_box_4 {
  position: relative;
  background: #FFF;
}
.arrow_box_4:after {
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-color: rgba(255, 255, 255, 0);
  border-left-color: #FFF;
  border-width: 32px;
  margin-top: -32px;
}

/* sectionに下矢印を付ける */
/* =======================================================
テーブル
======================================================= */
/* tableタグ使用 */
#pricelist,
#brandList {
  margin-top: 1.25rem;
  /*
  th,td {
  	&:nth-child(2) { background: #e74c3c; color: #FFF;}
  }
  */
}
#pricelist table,
#brandList table {
  width: 100%;
}
#pricelist th,
#brandList th {
  width: 20%;
}
#pricelist th span,
#brandList th span {
  display: inline-block;
  padding: 0 .5em;
  color: #FFF;
  background: #E74C3C;
  margin-left: .5em;
  font-size: .75rem;
  font-weight: normal;
}

/* dlタグ使用 */
dl.table {
  display: table;
  width: 100%;
  margin-bottom: 0;
}
dl.table dt, dl.table dd {
  display: table-cell;
  vertical-align: middle;
  text-align: left;
}

dl.tablestyle-1 {
  border: solid 1px #DDD;
  margin-top: -1px;
}
dl.tablestyle-1:nth-child(2n+1) {
  background: #F9F9F9;
}
dl.tablestyle-1 dt {
  width: 30%;
  border-right: solid 1px #DDD;
}
dl.tablestyle-1 dt, dl.tablestyle-1 dd {
  padding: .5rem 1rem;
}

dl.tablestyle-2 dt {
  width: 50%;
}
dl.tablestyle-2 dt, dl.tablestyle-2 dd {
  vertical-align: top;
}
dl.tablestyle-2 i.fa-circle {
  color: #2980b9;
}

dl.tablestyle-3 dt {
  width: 30%;
}
dl.tablestyle-3 dt, dl.tablestyle-3 dd {
  vertical-align: top;
}

@media screen and (max-width: 37.5em) {
  /* 600px 以下 */
  #pricelist th, #pricelist td {
    font-size: .75rem;
  }
  #pricelist th span {
    font-size: .625rem;
    margin-left: 0;
  }

  dl.table {
    font-size: .875rem;
  }
  dl.table dt, dl.table dd {
    display: block;
    width: 100%;
    margin-bottom: 0;
  }
  dl.table.tablestyle-1 dt {
    border: none;
  }
  dl.table.tablestyle-2 dt, dl.table.tablestyle-3 dt {
    vertical-align: middle;
    margin-bottom: 1rem;
  }
}
/* =======================================================
グーグルマップ
======================================================= */
#canvas {
  height: 400px;
  width: 100%;
}

@media screen and (max-width: 48em) {
  /* 768px 以下 */
  #canvas {
    height: 220px;
  }
}
/* =======================================================
ボタン
======================================================= */
/* ボタン構造 */
.btn {
  display: block;
  width: 100%;
  margin: 0 auto;
  font-size: 0.875rem;
  text-align: center;
  text-decoration: none;
  color: #FFFFFF !important;
  padding: 1em 0;
  -moz-border-radius: 0.3rem;
  -webkit-border-radius: 0.3rem;
  border-radius: 0.3rem;
  /* アイコン */
}
.btn a {
  display: block;
}
.btn span {
  display: inline-block;
  margin-right: .5rem;
  line-height: 1.4;
  padding: 0 .5rem;
  color: #464646;
  /*background: #E74C3C;*/
  background: #FFF;
  -moz-border-radius: 0.15rem;
  -webkit-border-radius: 0.15rem;
  border-radius: 0.15rem;
}

/* グラデーションの方向 */
/* 個別ボタン style */
.btn-1 {
  border: 1px solid #AA1A36;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2Y5NTA3MSIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2M1MWQ0MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #f95071), color-stop(100%, #c51d40));
  background: -moz-linear-gradient(top, #f95071, #c51d40);
  background: -webkit-linear-gradient(top, #f95071, #c51d40);
  background: linear-gradient(to bottom, #f95071, #c51d40);
  background: -ms-linear-gradient(top, #F95071, #C51D40);
  /* IE10+ */
  *zoom: 1;
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFF95071', endColorstr='#FFC51D40');
  /* IE9- */
}
.btn-1:hover {
  border: 1px solid #AA1A36;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2M1MWQ0MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2Y5NTA3MSIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #c51d40), color-stop(100%, #f95071));
  background: -moz-linear-gradient(top, #c51d40, #f95071);
  background: -webkit-linear-gradient(top, #c51d40, #f95071);
  background: linear-gradient(to bottom, #c51d40, #f95071);
  background: -ms-linear-gradient(top, #C51D40, #F95071);
  /* IE10+ */
  *zoom: 1;
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFC51D40', endColorstr='#FFF95071');
  /* IE9- */
}

.btn-2 {
  border: 1px solid #8bcf54;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2E5ZGI4MCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iIzk2YzU2ZiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #a9db80), color-stop(100%, #96c56f));
  background: -moz-linear-gradient(top, #a9db80, #96c56f);
  background: -webkit-linear-gradient(top, #a9db80, #96c56f);
  background: linear-gradient(to bottom, #a9db80, #96c56f);
  background: -ms-linear-gradient(top, #a9db80, #96c56f);
  /* IE10+ */
  *zoom: 1;
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFA9DB80', endColorstr='#FF96C56F');
  /* IE9- */
}
.btn-2:hover {
  border: 1px solid #74bf36;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iIzk2YzU2ZiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2E5ZGI4MCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #96c56f), color-stop(100%, #a9db80));
  background: -moz-linear-gradient(top, #96c56f, #a9db80);
  background: -webkit-linear-gradient(top, #96c56f, #a9db80);
  background: linear-gradient(to bottom, #96c56f, #a9db80);
  background: -ms-linear-gradient(top, #96c56f, #a9db80);
  /* IE10+ */
  *zoom: 1;
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FF96C56F', endColorstr='#FFA9DB80');
  /* IE9- */
}

.btn-3 {
  border: 1px solid #91b41a;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2I2ZTAyNiIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2FiZGMyOCIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #b6e026), color-stop(100%, #abdc28));
  background: -moz-linear-gradient(top, #b6e026, #abdc28);
  background: -webkit-linear-gradient(top, #b6e026, #abdc28);
  background: linear-gradient(to bottom, #b6e026, #abdc28);
  background: -ms-linear-gradient(top, #b6e026, #abdc28);
  /* IE10+ */
  *zoom: 1;
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFB6E026', endColorstr='#FFABDC28');
  /* IE9- */
}
.btn-3:hover {
  border: 1px solid #718c14;
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSIwJSIgc3RvcC1jb2xvcj0iI2FiZGMyOCIvPjxzdG9wIG9mZnNldD0iMTAwJSIgc3RvcC1jb2xvcj0iI2I2ZTAyNiIvPjwvbGluZWFyR3JhZGllbnQ+PC9kZWZzPjxyZWN0IHg9IjAiIHk9IjAiIHdpZHRoPSIxMDAlIiBoZWlnaHQ9IjEwMCUiIGZpbGw9InVybCgjZ3JhZCkiIC8+PC9zdmc+IA==');
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #abdc28), color-stop(100%, #b6e026));
  background: -moz-linear-gradient(top, #abdc28, #b6e026);
  background: -webkit-linear-gradient(top, #abdc28, #b6e026);
  background: linear-gradient(to bottom, #abdc28, #b6e026);
  background: -ms-linear-gradient(top, #abdc28, #b6e026);
  /* IE10+ */
  *zoom: 1;
  filter: progid:DXImageTransform.Microsoft.gradient(gradientType=0, startColorstr='#FFABDC28', endColorstr='#FFB6E026');
  /* IE9- */
}

.btn-4 {
  background: #f39c12;
  border-bottom: 4px solid #c87f0a;
}
.btn-4:hover {
  background: #c87f0a;
  border-bottom: 4px solid #b06f09;
}

.btn-5 {
  background: #1abc9c;
  border-bottom: 4px solid #12846e;
}
.btn-5:hover {
  background: #16a085;
  border-bottom: 4px solid #0e6856;
}
.btn-5 a {
  color: #FFF;
}

.btn-6 {
  /* flat gray */
  background: #ecf0f1;
  border-bottom: 4px solid #c0cdd1;
}
.btn-6:hover {
  background: #e3e9eb;
  border-bottom: 4px solid #b1c2c6;
}

.btn-7 {
  /* flat red */
  background: #e74c3c;
  border-bottom: 4px solid #d62c1a;
}
.btn-7:hover {
  background: #c0392b;
  border-bottom: 4px solid #962d22;
}

.btn-8 {
  /* flat blue */
  background: #2980B9;
  border-bottom: 4px solid #20638f;
}
.btn-8:hover {
  background: #246FA0;
  border-bottom: 4px solid #1b5276;
}

/* =======================================================
その他指定
======================================================= */
/* インデント */
.indent {
  margin-left: 1em;
}
.indent li {
  text-indent: -1em;
  font-size: .75rem;
}
@media screen and (max-width: 48em) {
  .indent {
    /* 768px 以下 */
  }
  .indent li {
    font-size: 0.6875rem !important;
  }
}

/*
写真の周りにテキストを回り込ます。
使用する画像サイズはすべて統一すること
*/
.photoArea {
  overflow: hidden;
}
.photoArea img {
  display: block;
  width: 100%;
  max-width: 222px;
}
.photoArea img.imgLeft {
  float: left;
  margin-right: 1em;
}
.photoArea img.imgRight {
  float: right;
  margin-left: 1em;
}

@media screen and (max-width: 37.5em) {
  /* 600px 以下 */
  .photoArea img {
    max-width: 144px;
  }
}
@media screen and (min-width: 22.5625rem) {
  /* 361px以上 */
  .thumbnail .photoArea img {
    max-width: 144px;
  }
}
/* アイコンの見せ方 */
.iconstyle-1 {
  margin-bottom: 1rem;
}
.iconstyle-1 li {
  display: inline-block;
  width: 11em;
  background: #bdc3c7;
  padding: .25rem 0;
  text-align: center;
  font-size: .875rem;
  font-weight: bold;
  margin-bottom: 2px;
  /*border: solid 4px #3498db;
  background: #ecf0f1;
  padding: .5rem 0;
  color: #2980b9;*/
}
@media screen and (max-width: 37.5em) {
  .iconstyle-1 {
    /* 600px 以下 */
  }
  .iconstyle-1 li {
    width: 49%;
  }
}

.iconColor-red {
  color: #e74c3c;
}

.iconColor-green {
  color: #1abc9c;
}

.iconMargin {
  margin: 0;
}
.iconMargin i {
  margin: .5em 0;
}

/* テキストにマーカー */
.marker_lemon {
  background: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0idXRmLTgiPz4gPHN2ZyB2ZXJzaW9uPSIxLjEiIHhtbG5zPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyI+PGRlZnM+PGxpbmVhckdyYWRpZW50IGlkPSJncmFkIiBncmFkaWVudFVuaXRzPSJvYmplY3RCb3VuZGluZ0JveCIgeDE9IjAuNSIgeTE9IjAuMCIgeDI9IjAuNSIgeTI9IjEuMCI+PHN0b3Agb2Zmc2V0PSI1MCUiIHN0b3AtY29sb3I9IiMwMDAwMDAiIHN0b3Atb3BhY2l0eT0iMC4wIi8+PHN0b3Agb2Zmc2V0PSI1MCUiIHN0b3AtY29sb3I9IiNmZmZmNjYiLz48L2xpbmVhckdyYWRpZW50PjwvZGVmcz48cmVjdCB4PSIwIiB5PSIwIiB3aWR0aD0iMTAwJSIgaGVpZ2h0PSIxMDAlIiBmaWxsPSJ1cmwoI2dyYWQpIiAvPjwvc3ZnPiA=');
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(50%, rgba(0, 0, 0, 0)), color-stop(50%, #ffff66));
  background: -moz-linear-gradient(rgba(0, 0, 0, 0) 50%, #ffff66 50%);
  background: -webkit-linear-gradient(rgba(0, 0, 0, 0) 50%, #ffff66 50%);
  background: linear-gradient(rgba(0, 0, 0, 0) 50%, #ffff66 50%);
  display: inline;
}

/* メーカーのリスト */
.productList {
  text-align: center;
}
.productList span {
  background: #efefef;
  width: 100%;
  display: inline-block;
  font-size: .75rem;
  padding: .5rem 0;
  margin-bottom: 5px;
  border: #3498DB solid 5px;
}

/* 涙マーク アイコン */
.fa.cry,
.fa.cry-half {
  color: #3498DB;
}

.fa.cry-half {
  font-size: .5em;
  margin-bottom: -2.5em;
  /* 表示が怪しかったら削除 */
}

/* マージン パディング */
.mb {
  margin-bottom: 1em;
}

.mtb5 {
  margin: 5em 0;
}

.pd-tb3 {
  padding: 3em 0;
}

.pd-t3 {
  padding-top: 3em;
}

/* まとめ 枠線やエリアで囲む時 */
.matome_1 {
  background: #FFF;
  padding: 1em;
  margin-bottom: 5em;
}

/* 囲むようなアイコン */
.surround__item {
  text-align: center;
  display: inline-block;
  width: 100%;
  font-size: .875rem;
  padding: 1em .5em;
  color: #fff;
}

.surround-1 {
  background-color: #3498db;
}

/* =======================================================
グローバルナビの動き
======================================================= */
@-webkit-keyframes wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  33.3% {
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
@keyframes wobble-horizontal {
  16.65% {
    -webkit-transform: translateX(8px);
    transform: translateX(8px);
  }
  33.3% {
    -webkit-transform: translateX(-6px);
    transform: translateX(-6px);
  }
  49.95% {
    -webkit-transform: translateX(4px);
    transform: translateX(4px);
  }
  66.6% {
    -webkit-transform: translateX(-2px);
    transform: translateX(-2px);
  }
  83.25% {
    -webkit-transform: translateX(1px);
    transform: translateX(1px);
  }
  100% {
    -webkit-transform: translateX(0);
    transform: translateX(0);
  }
}
.wobble-horizontal {
  display: inline-block;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
  box-shadow: 0 0 1px transparent;
}

.wobble-horizontal:hover, .wobble-horizontal:focus, .wobble-horizontal:active {
  -webkit-animation-name: wobble-horizontal;
  animation-name: wobble-horizontal;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-timing-function: ease-in-out;
  animation-timing-function: ease-in-out;
  -webkit-animation-iteration-count: 1;
  animation-iteration-count: 1;
}