*{
  --gray-darker:  lighten(#000, 13.5%); // #222
  --gray-dark:    lighten(#000, 20%);   // #333
  --gray:         lighten(#000, 33.5%); // #555
  --gray-light:   lighten(#000, 46.7%); // #777
  --gray-lighter: lighten(#000, 93.5%); // #eee

  --brand-primary: darken(#428bca, 6.5%); // #337ab7
  --brand-success: #5cb85c;
  --brand-info:    #5bc0de;
  --brand-warning: #f0ad4e;
  --brand-danger:  #d9534f;

  font-family: 'Source Sans Pro', sans-serif;
  font-size: 18px;
  font-weight: bolder;

}

@media (max-width: 768px) {/*スマホの場合*/
/* ここにフォントサイズを記載 */
*{
  font-size: 16px;
}
}

body {
  letter-spacing: .05em /*1px*/
  headings-line-hight: 1.5;
  line-height: 1.65;
  letter-spacing: : .1em;
  text-align: justify;
  background-color: #fcf7f7;
}


p {
  color: #653110;
}

a {
  color: #653110;
}


.container {
    padding-left: 2%; /*50px;*/
    padding-right: 2%; /*50px;*/
    padding-top: 2.5em; /*50px;*/

}


/* Add a dark background color with a little bit see-through */
.navbar {
    margin-bottom: 0;
    background-color: #47403d;
    border: 0;
    font-size: 11px !important;
    letter-spacing: .2em; /*4px;*/
    opacity:0.9;
}

/*nav.navbar a.navbar-brand {
  color: #ffffff !important;
}*/


/* Add a gray color to all navbar links */
.navbar li a, .navbar .navbar-brand {
    color: #fcf7f7 !important;
}

.navbar .navbar-brand {
    font-family: helvetica !important;
    font-weight: bold;
    margin-top: -.5em; /*-10px;*/
}
.navbar .navbar-brand span{
    font-family: helvetica !important;
    font-weight: bold;
    font-size: 1.8em; /*36px;*/
    color: #e51f1f !important;
}

.navbar-nav li a{
    font-size: .7em;
}

/* On hover, the links will turn white */
.navbar-nav li a:hover {
    color: #fcf7f7 !important;
}

/* The active link */
.navbar-nav li.active a {
    color: #fcf7f7 !important;
    background-color:#29292c !important;
}

/* Remove border color from the collapsible button */
.navbar-default .navbar-toggle {
    border-color: transparent;
}

/* Dropdown */
.open .dropdown-toggle {
    color: #fcf7f7 ;
    background-color: #555 !important;
}

/* Dropdown links */
.dropdown-menu li a {
    color: #000 !important;
}

/* On hover, the dropdown links will turn red */
.dropdown-menu li a:hover {
    background-color: e51f1f !important;
}

#myCarousel {
  @media (min-width: 800px) {
    width: 100%;
  }
}


.carousel-inner img {
    width: 100%; /* Set width to 100% */
    margin: auto;
    max-width: 1000px;
}

.item img {
  width:100%;
  /*max-width: 1000px;*/
}

.fluid2 {
  padding:0;
  margin-top: 2.7em;
  max-width: 70em;
}

@media (max-width: 786px) {
  .fluid2 {
    padding:0;
    margin-top: 3em;
    max-width: 70em;
  }
}

h1.title {
  font-size: 2em;
  text-align: center;
}
h1.title span.bond {
  color: red;
  font-size: 1em;
}

/*Introduction*/

hr.style-one {
    border: 0;
    height: .05em; /*1px;*/
    background: #333;
    background-image: -webkit-linear-gradient(left, #ccc, #333, #ccc);
    background-image:    -moz-linear-gradient(left, #ccc, #333, #ccc);
    background-image:     -ms-linear-gradient(left, #ccc, #333, #ccc);
    background-image:      -o-linear-gradient(left, #ccc, #333, #ccc);
}

#intro span {
  color: #e51f1f;
}
.upperSpace {
  padding-top: 1.5em; /*30px;*/
}

.underSpace {
  padding-bottom: 4em; /*80px;*/
}

.h3 {
  color: #47403d;
  border-top: .05em /*1px*/ solid #47403d;
  margin:1.15em/*23px*/ 0 0;
  text-align: center;
  padding: 0;
  height: 1.2em/*24px*/;
}

.h2 {
    color: #47403d;
    border-top: .05em /*1px*/ solid #47403d;
    margin: 1.15em/*23px*/ 0 0;
    text-align: center;
    padding: 0;
    height: 1.2em; /*24px;*/
}


/*h1 {
    border-top: 1px solid black;
    margin:23px 0 0;
    text-align:center;
    padding:0; height:24px;
}*/

.h2 .addHr {
    position: relative;
    top: -.7em;/*-14px*/;
    padding: 0 1em;/*20px*/;
    background: #fcf7f7;
}

.h3 .addHr {
    position: relative;
    top: -.5em;/*-14px;*/
    padding: 0 1em/*20px*/;
    background: #fcf7f7;
    font-size: 1em;
}

.h4 {
  font-size: 1em;
  color: #dd3511;
}

#intro p .feat {
  font-size: 1.2em;/*18px;*/
  color: #e51f1f;
}

#intro .introImg {
  width: 100%;
  max-width: 100%;
  height: auto;
}

.positionImg {
  width: 100%;
  max-width: 50em;
}

#intro span.smallfont {
  font-size: .8em;
  color: inherit;
}

/*product*/
.img {
  width: 100%;
}

#product span.smallfont {
  font-size: .8em;
}

/*Instlation*/
#install p.setName{
  font-size: 1.5em; /*20px;*/
  font-weight: bold;
  color: #47403d !important;
}

#install .setName span.bond{
  font-size: 1em; /*20px;*/
  font-weight: bold;
  color: #e51f1f;
}

#install p.price{
  font-size: 1.2em; /*18px;*/
  font-weight: bold;
  color: #47403d !important;
}

#install .setName span{
  font-size: 1em; /*18px;*/
  font-weight: bold;
  color: #e51f1f;
}

#install .price span{
  font-size: 1.7em;/*28px;*/
  font-weight: bold;
  color: #e51f1f;
}

#install .price span.md{
  font-size: 1.3em;/*28px;*/
  font-weight: bold;
  color: #47403d;
}

#install p.small {
  font-size: .8em;
}

/*Contact*/
#contact p.ew {
  font-size: 1em; /*20px;*/

}

#contact .shopImg {
  padding-top: 1.15em; /*23px;*/
}

#contact a {
  color: #e51f1f;
}

#contact p.small{
  font-size: .8em;
}

#contact span.small, #contact a.small{
  font-size: 1em;
}


/* Add a dark background color to the footer */
footer {
    padding: 1.6em; /*32px;*/
    width: 100%;
    color: #47403d;
    background-color: #47403d;
}

footer a {
    color: #fdfdfd;
}

footer .footerHr {
    border-top: .2em /*4px*/ solid #fdfdfd !important;
}

footer p {
  font-size: .8em; /*16px;*/
  color: #fdfdfd !important;
}

footer a:hover {
    color: #777;
    text-decoration: none;
}

footer p span {
  color: #E31F21;
}
