@charset "UTF-8";
/* Scss Document */
/* variable */
/* Sass Document */
body {
  font-family: "Open Sans", "Helvetica Neue", Helvetica, "Arial", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
  font-size: 16px;
  line-height: 1.5;
  color: #333;
  background-color: #fff; }

/* button */
.btn-theme {
  background-color: #85B200;
  color: #fff; }

.btn-theme:hover {
  background-color: #729900; }

/*fix  modal : when popu up window*/
.modal-open {
  padding-right: 0px !important;
  overflow: auto; }

.modal {
  padding-right: 0px !important; }

.navbar {
  padding-right: 0 !important; }

/* Header title */
.navbar-brand img {
  vertical-align: middle;
  margin-right: 0.5em; }

/* Header menu*/
.navbar-dark .navbar-nav .nav-link {
  color: #ddd; }

.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .nav-link:hover {
  color: #fff; }

/* [INNER] content padding top */
body#inner {
  padding-top: 6rem; }

/* Headings and paragraphs */
h1 {
  font-size: 2rem; }

h2 {
  font-size: 2rem; }

h3 {
  font-size: 1.5rem; }

#top h2 {
  padding: 0 0 2rem 0;
  margin-bottom: 0;
  font-weight: bold; }
#top h3 {
  /*margin-bottom: 0;*/ }

#inner h1 {
  font-size: 2.5rem;
  margin-bottom: 2rem;
  font-weight: bold; }
#inner h2 {
  font-size: 1.75rem;
  font-weight: bold;
  margin-bottom: 1rem; }

p {
  margin-bottom: 0; }

/* Main area (Top image)*/
main {
  background-attachment: scroll;
  background-image: url("../images/mainimage_back.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100vh;
  flex-direction: column; }
  main > div {
    height: 50%;
    display: flex;
    justify-content: center; }
    main > div img {
      width: auto;
      height: 80%; }
    main > div h1 {
      font-weight: bold;
      color: #000;
      line-height: 125%; }
      main > div h1 span {
        /*font-weight: normal;*/
        color: #f00;
        font-size: 1.2rem; }

/* Catch copy */
.catch_copy {
  padding: 1.6rem 15px;
  background-attachment: scroll;
  background-image: url("../images/catch_copy_back.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  border-top: #fff solid 0px; }
  .catch_copy p {
    margin-bottom: 0;
    font-size: 1.6rem; }
    .catch_copy p span {
      color: #85B200; }

/* About espuma */
.about_espuma {
  padding: 4rem 0 2rem 0;
  background-attachment: scroll;
  background-image: url("../images/about_espuma_back.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  color: #fff;
  text-shadow: 3px 3px 3px #000000;
  border-top: #111 solid 0px;
  border-bottom: #111 solid 0px; }
  .about_espuma h2 {
    margin-bottom: 2rem; }
  .about_espuma div {
    margin-bottom: 2rem; }
    .about_espuma div img {
      width: 100%;
      height: auto;
      border-radius: 50%; }
    .about_espuma div h3 {
      margin: 1.5rem 0; }

/* More espuma */
.more_espuma {
  padding: 0 0 2rem 0;
  background-color: #eee; }
  .more_espuma .triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 25px 25px 0 25px;
    border-color: #111 transparent transparent transparent;
    margin: 0 auto 2rem auto; }
  .more_espuma h2 {
    font-weight: normal; }
  .more_espuma a {
    display: block;
    width: 100%;
    height: auto;
    text-decoration: none;
    color: #333;
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.1);
    margin-bottom: 2rem; }
    .more_espuma a .more_espuma_linkbox {
      background-color: #fff;
      width: 100%;
      height: auto; }
      .more_espuma a .more_espuma_linkbox p.linkbox_title {
        background-color: #222;
        color: #fff;
        padding: 0.5rem 0.5rem; }
      .more_espuma a .more_espuma_linkbox img {
        width: 95%;
        height: auto;
        border: #ddd solid 1px;
        display: block;
        margin: 2.5% auto; }
      .more_espuma a .more_espuma_linkbox p.file_size {
        padding-bottom: 2.5%; }
  .more_espuma a:hover {
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2); }

/* Product spec */
.product_spec {
  background-color: #fff;
  padding: 4rem 0; }
  .product_spec div img {
    width: 90%;
    height: auto;
    margin: 5% 0; }
  .product_spec div ul {
    list-style: none;
    padding: 0;
    margin-bottom: 2rem; }
    .product_spec div ul li {
      margin-left: 1em;
      text-indent: -1em;
      font-weight: bold; }
    .product_spec div ul ul {
      padding-left: 0em;
      margin-bottom: 1em; }
      .product_spec div ul ul li {
        margin-left: 3em;
        text-indent: -3em;
        font-weight: normal; }
  .product_spec div .spec_notes {
    margin-bottom: 2rem; }
    .product_spec div .spec_notes p {
      font-size: 0.8rem;
      /*margin-bottom: 0;*/
      margin-left: 1em;
      text-indent: -1em; }
  .product_spec div button {
    width: auto; }

/* For initial installation */
.for_init {
  padding: 0 15px 4rem 15px;
  background-attachment: scroll;
  background-image: url("../images/for_init_back.jpg");
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  color: #fff; }
  .for_init .triangle {
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 25px 25px 0 25px;
    border-color: #fff transparent transparent transparent;
    margin: 0 auto 2rem auto; }
  .for_init h2 {
    font-weight: normal; }
  .for_init .item_box .item_box_back div {
    padding: 0.75rem;
    font-weight: bold;
    font-size: 1.25rem; }
  .for_init .item_box .item_box_back:nth-child(odd) {
    background-color: #fff;
    border: #fff solid 2px;
    border-radius: 15px;
    opacity: 0.8; }
    .for_init .item_box .item_box_back:nth-child(odd) div {
      color: #111;
      text-align: center; }
  .for_init .item_box .item_box_back:nth-child(even) div {
    color: #fff; }
  .for_init .for_init_notes {
    font-size: 0.8rem;
    margin: 2rem 0 0; }

/* Q and A */
.q_and_a {
  background-color: #fff;
  padding: 4rem 0; }
  .q_and_a h2 {
    margin-bottom: 2rem; }
  .q_and_a div.card {
    margin-bottom: 1rem; }
    .q_and_a div.card div.card-header {
      background-color: #f7f7f7;
      padding: 0; }
      .q_and_a div.card div.card-header .btn {
        padding: .75rem 1.25rem;
        width: 100%;
        text-align: left;
        white-space: normal; }
      .q_and_a div.card div.card-header .btn-link {
        color: #333; }
    .q_and_a div.card div.card-header:hover {
      background-color: #efefef; }
    .q_and_a div.card .card-body ul {
      padding-left: 1em;
      margin-bottom: 0; }
    .q_and_a div.card .card-body p {
      /*margin-bottom: 0;*/
      /*margin-left: 1.5em;
      text-indent: -1.5em;*/ }
  .q_and_a div.card:last-of-type {
    margin-bottom: 0; }

.btn-link.focus,
.btn-link:focus {
  text-decoration: none; }

.btn-link:hover {
  text-decoration: none; }

.accordion .card:first-of-type {
  border-bottom: 1px solid rgba(0, 0, 0, 0.125); }

.accordion .card:not(:first-of-type):not(:last-of-type) {
  border-bottom: 1px solid rgba(0, 0, 0, 0.125); }

/* Sell area */
.cell_area {
  padding: 4rem 0;
  background-color: #85B200;
  color: #fff; }
  .cell_area .sell_area_title h2 {
    padding-top: 0.5rem; }
  .cell_area .sell_area_title p.cell_notes {
    font-size: 0.8rem;
    margin-bottom: 1rem; }
  .cell_area img {
    width: 90%;
    height: auto; }

/* Buy espuma */
.buy_espuma {
  background-color: #fff;
  padding: 4rem 0; }
  .buy_espuma .attention {
    padding: 1rem;
    margin-bottom: 2rem;
    background-color: #FFF8F7;
    border: #FDDFE2 solid 1px; }
    .buy_espuma .attention p {
      margin-bottom: 1rem;
      font-size: 1.25rem; }
    .buy_espuma .attention ul {
      margin: 0;
      padding-left: 1rem; }
      .buy_espuma .attention ul li {
        color: #F00; }
        .buy_espuma .attention ul li p {
          font-size: 1rem;
          margin-bottom: 0;
          margin-left: 0.5rem;
          text-indent: -1rem; }

/* Contact */
.contact {
  padding: 4rem 0 2rem;
  background-color: #eee; }
  .contact h2 {
    padding-bottom: 2rem; }
  .contact .contact_box {
    margin-bottom: 2rem; }
  .contact div.icon {
    font-size: 1.875rem;
    padding: 0.5rem 0.5rem 0 0.5rem; }
  .contact div.data address, .contact div.data p {
    margin: 0; }
  .contact div.data address {
    font-size: 1.75rem; }
  .contact div.data p {
    font-size: 0.75rem; }
  .contact .btn {
    background-color: #fff;
    /*font-size: 1.375rem;*/
    /*padding: 0.75rem;*/ }
    .contact .btn i {
      /*font-size: 1.5rem;*/ }
  .contact .btn:hover {
    background-color: #333;
    color: #fff; }

/* privacy policy (modal) */
.modal-header .close {
  padding: 0;
  margin: 0; }

.modal-body p {
  font-size: 0.875rem;
  margin-bottom: 0.875rem; }
.modal-body ul li {
  font-size: 0.875rem; }

.modal-footer {
  justify-content: center; }

/* Page top button */
#page-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-size: 0.875rem;
  opacity: 0.75;
  z-index: 99; }

#page-top a {
  background: #666;
  text-decoration: none;
  color: #fff;
  width: auto;
  padding: 0.5rem;
  text-align: center;
  display: block;
  border-radius: 0.5rem; }

#page-top a:hover {
  text-decoration: none;
  background: #999; }

/* footer */
footer {
  background-color: #333;
  color: #fff; }
  footer p {
    /*margin-bottom: 0;*/ }
  footer p.footer_catch {
    font-size: 1.25rem;
    padding: 4rem 0; }
  footer .table {
    margin-bottom: 1rem; }
    footer .table th, footer .table td {
      color: #ccc;
      display: block; }
    footer .table th {
      background-color: #555; }
  footer .map_box {
    margin-bottom: 1rem;
    height: 300px; }
  footer .ext_link {
    color: #ccc; }
    footer .ext_link a {
      color: #ccc;
      text-decoration: underline; }
  footer .footer_logo {
    margin: 1rem 0; }
  footer .copy_right {
    padding: 0 0 1rem 0; }
  footer p small {
    color: #aaa;
    font-size: 0.75rem; }

/* ---------------Media Queries--------------- */
@media (min-width: 768px) {
  main {
    background-attachment: fixed; }
    main > div h1 {
      font-size: 3rem; }
      main > div h1 span {
        font-size: 2rem; }

  .catch_copy {
    background-attachment: fixed;
    padding: 2.4rem 15px; }
    .catch_copy p {
      font-size: 2.4rem; }

  .about_espuma {
    background-attachment: fixed; }

  .product_spec {
    padding: 4rem 0; }
    .product_spec div img {
      margin-top: -4rem;
      margin-bottom: 0; }

  .for_init {
    background-attachment: fixed; }

  .cell_area .sell_area_title {
    height: 100%; }

  .buy_espuma .buy_espuma_illust {
    height: 100%; }

  .contact div.icon {
    font-size: 2.75rem;
    padding: 0.5rem 1rem 0 1rem; }
  .contact div.data address {
    font-size: 1.8rem; }
  .contact div.data p {
    font-size: 0.8rem; }
  .contact .btn {
    font-size: 1.375rem;
    padding: 0.75rem; }
    .contact .btn i {
      font-size: 1.5rem; }
  .contact .contact_tel,
  .contact .contact_form {
    height: 100%; }

  footer .table th, footer .table td {
    display: table-cell; }
  footer .table th {
    background-color: transparent; }
  footer .map_box {
    height: auto; } }
@media (min-width: 992px) {
  main > div {
    height: 100%; }
    main > div img {
      width: 545px;
      height: 490px; }

  .product_spec {
    padding: 4rem 0; }
    .product_spec div button {
      width: 12rem; }

  .contact a {
    text-decoration: none;
    color: #333; } }
