/*まずはお決まりのボックスサイズ算出をborer-boxに */
html {
  -webkit-box-sizing: border-box;
  box-sizing: border-box;
  font-size: 62.5%;/*rem算出をしやすくするために*/
}


/* 事業内容（土木・管工事、一般建築工事）ボタンの基本情報 */
.btn,
a.btn {
  background: #fff;
  font-size: 1rem;
  font-weight: 700;
  line-height: 1;
  position: relative;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: #c4131b;
  border-radius: 0.5rem;
}

/* 事業内容（土木・管工事）ボタンの情報 */
a.btn--red {
  color: #fff;
  background-color: #c4131b;
}

a.btn--red:hover {
  color: #fff;
  background: #c4131b;
}

a.btn--red.btn--cubic {
  border-bottom: 5px solid #920a10;
}

a.btn--red.btn--cubic:hover {
  margin-top: 3px;
  border-bottom: 2px solid #920a10;
}

/* 事業内容（一般建築工事）ボタンの情報 */
a.btn--green {
  color: #fff;
  background-color: #094;
}

a.btn--green:hover {
  color: #fff;
  background: #00a349;
}

a.btn--green.btn--cubic {
  border-bottom: 5px solid #00662d;
}

a.btn--green.btn--cubic:hover {
  margin-top: 3px;
  border-bottom: 2px solid #00662d;
}

a.btn-c {
  font-size: 2rem;
  position: relative;
  padding: 1.5rem 3rem 1.5rem 2rem;
}

a.btn-c i.fa {
  margin-right: 1rem;
}


.button {
  line-height: 1.4;
  position: relative;
  display: inline-block;
  user-select: none;
  text-align: center;
  vertical-align: middle;
  text-decoration: none;

  color: #fff;
  padding: 0.2rem 0.2rem;
}

/* 土木・管工事のボタン(赤) */
.button--heading0,
a.button--heading0 {
  color: #fff;
  border: 2px solid #c4131b;
  background-color: #c4131b;
  padding: 0.2rem 0.2rem;
}
.button--heading0:hover,
a.button--heading0:hover {
  color: #c4131b;
  border: 2px solid #c4131b;
  background: #fff;
  padding: 0.2rem 0.2rem;
}

/* 一般建築工事のボタン(緑) */
.button--heading00,
a.button--heading00 {
  color: #fff;
  border: 2px solid #389038;
  background-color: #389038;
  padding: 0.2rem 0.2rem;
}
.button--heading00:hover,
a.button--heading00:hover {
  color: #389038;
  border: 2px solid #389038;
  background: #fff;
  padding: 0.2rem 0.2rem;
}

/* 見出しの縦棒 */
heading1 {
  font-size: 20px;
  font-weight: bold;
  margin-left: 2px;
  padding: 1rem 2rem;
  border-left: 4px solid #77787c;
}

/* 土木・管工事の見出し(囲み線・塗り赤) */
heading2 {
  color: #fff;
  padding: 0.2rem 0.2rem;
  border: 2px solid #c4131b;
  background: #c4131b;
}

/* 一般建築工事の見出し(囲み線・塗り緑) */
heading21 {
  color: #fff;
  padding: 0.2rem 0.2rem;
  border: 2px solid #389038;
  background: #389038;
}


/* 新築・住宅の見出し(囲み線・塗り） */
heading3 {
  color: #fff;
  padding: 0.2rem 0.2rem;
  border: 2px solid #D4987E;
  background: #D4987E;
}

/* 新築・住宅の見出し(囲み線) */
heading31 {
  color: #D4987E;
  padding: 0.2rem 0.2rem;
  border: 2px solid #D4987E;
  background: #fff;
}


/* 増改築・住宅の見出し(囲み線・塗り) */
heading4 {
  color: #fff;
  padding: 0.2rem 0.2rem;
  border: 2px solid #CB4829;
  background: #CB4829;
}

/* 増改築・住宅の見出し(囲み線) */
heading41 {
  color: #CB4829;
  padding: 0.2rem 0.2rem;
  border: 2px solid #CB4829;
  background: #fff;
}

/* 新築・店舗の見出し(囲み線・塗り) */
heading5 {
  color: #fff;
  padding: 0.2rem 0.2rem;
  border: 2px solid #F5B090;
  background: #F5B090;
}

/* 新築・店舗の見出し(囲み線) */
heading51 {
  color: #F5B090;
  padding: 0.2rem 0.2rem;
  border: 2px solid #F5B090;
  background: #fff;
}

/* 新築・事務所の見出し(囲み線・塗り) */
heading6 {
  color: #fff;
  padding: 0.2rem 0.2rem;
  border: 2px solid #8DA3C4;
  background: #8DA3C4;
}

/* 新築・事務所の見出し(囲み線) */
heading61 {
  color: #8DA3C4;
  padding: 0.2rem 0.2rem;
  border: 2px solid #8DA3C4;
  background: #fff;
}

/* 新築・レストランの見出し(囲み線・塗り) */
heading7 {
  color: #fff;
  padding: 0.2rem 0.2rem;
  border: 2px solid #B7AA00;
  background: #B7AA00;
}

/* 新築・レストランの見出し(囲み線) */
heading71 {
  color: #B7AA00;
  padding: 0.2rem 0.2rem;
  border: 2px solid #B7AA00;
  background: #fff;
}

/* 新築・倉庫の見出し(囲み線・塗りエメラルド) */
heading8 {
  color: #fff;
  padding: 0.2rem 0.2rem;
  border: 2px solid #AC6A00;
  background: #AC6A00;
}

/* 新築・倉庫/一般建築工事の見出し(囲み線・エメラルド) */
heading81 {
  color: #AC6A00;
  padding: 0.2rem 0.2rem;
  border: 2px solid #AC6A00;
  background: #fff;
}

/* 太陽光発電の見出し(囲み線・塗り青) */
heading9 {
  color: #fff;
  padding: 0.2rem 0.2rem;
  border: 2px solid #945E8D;
  background: #945E8D;
}

/* 太陽光発電の見出し(囲み線・青) */
heading91 {
  color: #945E8D;
  padding: 0.2rem 0.2rem;
  border: 2px solid #945E8D;
  background: #fff;
}