@charset "UTF-8";
/* CSS Document */
body {
  color: #3e3a39;
  font-size: 20px;
  font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
  line-height: 48px;
  text-align: center;
  overflow-wrap: break-word;
  margin: 0;
  padding: 0;
}
h2, h3, h4 {
  text-align: left;
}
a {
  color: #3e3a39;
  text-decoration: none;
}
a:hover {
  color: #3e3a39;
  text-decoration: underline;
}
img {
  margin: 0;
  padding: 0;
  border: none;
}
#container {
  min-width: 1110px;
  max-width: 1920px;
  width: auto;
  margin: 0 auto;
  text-align: center;
}
#contents {
  width: 100%;
  margin: 0 auto;
  text-align: center;
}
/****************************************************************************

	コンテンツ設定

*****************************************************************************/
/*	ヘッダー

----------------------------------------------------------------------------*/
#header {
  width: 100%;
  background-color: #fff;
  padding: 9px 0;
  position: fixed;
  top: 0;
  left: 0;
  z-index: 600;
}
#header2 {
  display: none;
}
#header_in {
  min-width: 1110px;
  max-width: 1920px;
  width: 100%;
  margin: auto;
}
.head_logo {
  width: 200px;
  margin: 0 0 0 30px;
  float: left;
}
.head_logo img {
  width: 100%;
  height: auto;
}
.head_logo_inst {
  width: 62px;
  margin: 0 0 0 10px;
  float: left;
}
.head_logo_inst img {
  width: 100%;
  height: auto;
}
.h1 {
  paddning: 13px 0 0 0;
  font-size: 12px;
  line-height: 30px;
  height: 30px;
  text-align: center;
  color: #4d4d4d;
}
.pc {
  display: inline;
}
.sm {
  display: none;
}
/*	グローバルナビ

----------------------------------------------------------------------------*/
.navi {
  margin: 0;
  padding: 0;
}
.navi ul:before, .navi ul:after {
  content: "";
  display: table;
}
.navi ul:after {
  clear: both;
}
.navi ul {
  margin: 0;
  padding: 0;
  float: right;
}
.navi li {
  list-style: none;
  display: inline-block;
}
.navi li a {
  margin: 0 15px 0 0;
  padding: 22px 0;
  float: left;
  font-size: 14px;
  line-height: 1em;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  background-image: url(../img/common/navi_bar.png);
  background-repeat: no-repeat;
  background-position: bottom center;
  background-size: 0% 2px;
  -webkit-transition: all 0.4s ease 0s;
  -moz-transition: all 0.4s ease 0s;
  -o-transition: all 0.4s ease 0s;
  -ms-transition: all 0.4s ease 0s;
  transition: all 0.4s ease 0s;
}
.navi li a:hover {
  text-decoration: none;
  background-size: 100% 2px;
}
.home .p1 a {
  background-size: 100% 2px;
}
.concrete .navi .p2 a {
  background-size: 100% 2px;
}
.sugiita .navi .p3 a {
  background-size: 100% 2px;
}
.gallery .navi .p4 a {
  background-size: 100% 2px;
}
.design .navi .p5 a {
  background-size: 100% 2px;
}
.company .navi .p6 a {
  background-size: 100% 2px;
}
.catalog_form .navi .p6 a {
  background-size: 100% 2px;
}
.catalog_download .navi .p6 a {
  background-size: 100% 2px;
}
.contact .navi .p7 a {
  background-size: 100% 2px;
}
.catalog_form .navi .p7 a {
  background-size: 100% 2px;
}
.catalog_download .navi .p7 a {
  background-size: 100% 2px;
}
.mortar .navi .p8 a {
  background-size: 100% 2px;
}
.sugiita_panel .navi .p9 a {
  background-size: 100% 2px;
}
/*	グローバルナビ (スマホ用)

----------------------------------------------------------------------------*/
#category_list {
  display: none;
}
ul.menu_second_level {
  visibility: hidden;
  opacity: 0;
  z-index: 1;
}
.nav ul > li.menu_first_level {
  position: relative;
}
li.menu_first_level ul.menu_second_level {
  position: absolute;
  top: 70px;
  -webkit-transition: all .2s ease;
  transition: all .2s ease;
  margin-top: 5px;
}
li.menu_first_level ul.menu_second_level li {
  display: block;
  margin-right: 20px;
}
li.menu_first_level ul.menu_second_level a {
  width: 100%;
  background-color: #fff;
  font-size: 13px;
}
li.menu_first_level:hover ul.menu_second_level {
  visibility: visible;
  opacity: 1;
}
/*	カタログダウンロードアイコン

----------------------------------------------------------------------------*/
.catalog_download_icon {
  position: fixed;
  right: 10px;
  bottom: 10px;
  z-index: 10000;
}
/*	フッター

----------------------------------------------------------------------------*/
#footer {
  padding: 0;
  text-align: center;
  margin: 0;
}
.foot_link {
  border-top: 2px solid #3e3a39;
  border-bottom: 2px solid #3e3a39;
  margin: 74px auto;
  padding: 18px 0;
}
.foot_link.bl {
  border-top: 2px solid #3e3a39;
  border-bottom: 2px solid #3e3a39;
  margin: 0 auto;
  padding: 18px 0;
}
.footer_blog {
  width: 100%;
  background-image: url(../img/common/foot_blogback.jpg);
  background-repeat: no-repeat;
  background-position: center;
  margin: 0 auto;
  color: #FFFFFF;
}
.footer_blog_in {
  position: relative;
  width: 100%;
  padding: 60px 0;
  font-size: 18px;
  line-height: 18px;
  text-align: center;
  top: 0;
  z-index: 2;
}
.footer_blog_in .lead {
  margin: 0 auto;
}
.footer_blog .bt {
  width: 240px;
  margin: 35px auto 0 auto;
}
.price_link {
  width: 100%;
  background-image: url(../img/design/img_06.png);
  background-repeat: no-repeat;
  background-position: center;
  margin: 0 auto;
  color: #FFFFFF;
}
.price_link_in {
  position: relative;
  width: 100%;
  padding: 60px 0;
  font-size: 18px;
  line-height: 18px;
  text-align: center;
  color: #fff;
  top: 0;
  z-index: 2;
}
.price_link_in .lead {
  margin: 0 auto;
}
.price_link .bt {
  width: 240px;
  margin: 35px auto 0 auto;
}
.foot_link ul:before, .foot_link ul:after {
  content: "";
  display: table;
}
.foot_link ul:after {
  clear: both;
}
.foot_link ul {
  width: 100%;
}
.foot_link .mid {
  border-right: 2px solid #3e3a39;
  border-left: 2px solid #3e3a39;
}
.foot_link li {
  width: 33%;
  padding: 15px 0 0 0;
  background-color: #fff;
  position: relative;
  overflow: hidden;
  float: left;
}
.foot_link li a::after {
  position: absolute;
  /*z-index: -1;*/
  display: block;
  content: '';
  top: 100%;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.1);
  left: 0;
}
.foot_link li a:hover::after {
  animation: anim_btn_color .5s ease forwards;
}
.foot_link li a:hover {
  cursor: pointer;
}
.foot_logo {
  width: 356px;
  margin: 0 auto 56px auto;
}
.foot_add {
  font-size: 18px;
  line-height: 40px;
  text-align: center;
  margin: 0 auto 56px auto;
}
.foot_add .name {
  font-size: 20px;
  line-height: 1em;
  margin: 0 0 15px 0;
}
.foot_add .name img {
  margin: 3px 0 0 0.5em;
}
.foot_add .telno {
  font-size: 22px;
}
#footer_copy {
  height: 60px;
  font-size: 18px;
  line-height: 20px;
  padding: 0;
  text-align: center;
}
#footer .page_top {
  position: relative;
  overflow: hidden;
  margin: 0 0 60px 0;
}
#footer .page_top::after {
  position: absolute;
  /*z-index: -1;*/
  display: block;
  content: '';
  top: 100%;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.1);
  left: 0;
}
#footer .page_top:hover::after {
  animation: anim_btn_color .5s ease;
}
#footer .page_top:hover {
  cursor: pointer;
}
/*	共通

----------------------------------------------------------------------------*/
.center {
  text-align: center;
}
.clear {
  clear: both;
  overflow: hidden;
  margin: auto;
}
.int10 {
  text-indent: -1em;
  padding-left: 1em;
}
.bt_deco a {
  border: 1px solid #fff;
  padding: 18px 0;
  text-align: center;
  text-decoration: none;
  font-size: 24px;
  line-height: 1em;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  color: #fff;
  display: block;
  position: relative;
  overflow: hidden;
}
.bt_deco a::after {
  position: absolute;
  /*z-index: -1;*/
  display: block;
  content: '';
  top: 100%;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.3);
  left: 0;
}
.bt_deco a:hover::after {
  animation: anim_btn_color .5s ease forwards;
}
.bt_deco a:hover {
  cursor: pointer;
}
.bt_deco_pane a {
  border: 1px solid #fff;
  padding: 18px 0;
  text-align: center;
  text-decoration: none;
  font-size: 24px;
  line-height: 1em;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  color: #fff;
  display: block;
  position: relative;
  overflow: hidden;
  width: 50%;
  margin: auto;
}
.bt_deco_pane a::after {
  position: absolute;
  /*z-index: -1;*/
  display: block;
  content: '';
  top: 100%;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.3);
  left: 0;
}
.bt_deco_pane a:hover::after {
  animation: anim_btn_color .5s ease forwards;
}
.bt_deco_pane a:hover {
  cursor: pointer;
}
.bt_deco_pre a {
  border: 2px solid #fff;
  padding: 18px 0;
  text-align: center;
  text-decoration: none;
  font-size: 24px;
  font-weight: bold;
  line-height: 1em;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  color: #fff;
  display: block;
  position: relative;
  overflow: hidden;
}
.bt_deco_pre a::after {
  position: absolute;
  /*z-index: -1;*/
  display: block;
  content: '';
  top: 100%;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.3);
  left: 0;
}
.bt_deco_pre a:hover::after {
  animation: anim_btn_color .5s ease forwards;
}
.bt_deco_pre a:hover {
  cursor: pointer;
}
@keyframes anim_btn_color {
  0% {
    top: 100%;
  }
  40% {
    top: 0;
  }
  60% {
    top: 0;
  }
  100% {
    top: 0;
  }
}
.fade-in {
  transition: opacity 2s;
  -moz-transition: opacity 2s;
  -webkit-transition: opacity 2s;
  -o-transition: opacity 2s;
}
.title {
  width: 660px;
  font-size: 40px;
  line-height: 1.5em;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  text-align: center;
  padding: 15px 0;
  margin: 20px auto;
  border-bottom: 1px solid #3e3a39;
}
.title_showroom {
  width: 660px;
  font-size: 40px;
  line-height: 1.5em;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  text-align: center;
  padding: 15px 0;
  margin: auto;
  border-bottom: 1px solid #3e3a39;
}
.lead {
  font-size: 40px;
  line-height: 1.5em;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
}
.lead_s {
  font-size: 36px;
  line-height: 45px;
  letter-spacing: -0.05em;
  text-align: center;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
}
.lead_l {
  font-size: 52px;
  line-height: 65px;
  letter-spacing: -0.05em;
  text-align: center;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  margin: 0 0 20px 0;
}
.lead_l_pane {
  font-size: 48px;
  line-height: 65px;
  letter-spacing: -0.05em;
  text-align: center;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  margin: 0 0 20px 0;
}
.note {
  font-size: 80%;
}
/*　TOP

----------------------------------------------------------*/
.mid_navi {
  margin: 30px auto 120px auto;
  font-size: 16px;
  line-height: 2em;
  text-align: center;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
}
.top_title {
  width: 400px;
  margin: 80px auto 50px auto;
}
.top_title_aa {
  width: 100%;
  margin: 50px auto;
}
.top_comm {
  width: 600px;
  margin: 0 auto 90px auto;
  font-size: 20px;
  line-height: 36px;
  text-align: left;
}
.top_comm_w {
  width: 900px;
  margin: 0 auto 90px auto;
  font-size: 20px;
  line-height: 36px;
  text-align: left;
}
.top_sect01 {
  width: 100%;
  height: 640px;
  overflow: hidden;
  position: relative;
}
.top_sect01 img {
  position: absolute;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  top: 0;
  left: 0;
  z-index: 1;
}
.top_sect01_aa {
  width: 100%;
  height: 640px;
  overflow: hidden;
  position: relative;
}
.top_sect01_aa img {
  position: absolute;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  bottom: 0;
  left: 0;
  z-index: 1;
}
.top_sect_in {
  position: relative;
  width: 100%;
  padding: 60px 0;
  font-size: 18px;
  line-height: 32px;
  text-align: center;
  color: #fff;
  top: 0;
  z-index: 2;
}
.top_sect_in .lead {
  margin: 0 auto 50px auto;
}
.top_sect_in .bt {
  width: 240px;
  margin: 60px auto 0 auto;
}
.top_sect_in .bt_pre {
  width: 240px;
  margin: 200px auto 0 auto;
  background-color: rgba(0, 0, 0, 0.3);
}
.top_sect02 {
  width: 100%;
  padding: 60px 0;
  background-color: #e3e1e5;
  margin: 80px auto 0 auto;
}
.top_sect03 {
  width: 100%;
  padding: 60px 0;
  background-color: #e3e1e5;
  background-image: url(../img/top/img_04_back.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  margin: 80px auto 0 auto;
}
.top_sect_in2 {
  width: 1360px;
  margin: auto;
}
.top_sect_in2 .img {
  width: 47%;
  height: 490px;
  margin: 0 0 0 3%;
  overflow: hidden;
  position: relative;
  float: right;
}
.top_sect_in2 .img img {
  position: absolute;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  top: 0;
  left: 0;
  z-index: 1;
}
.top_sect_in2 .left {
  width: 50%;
  padding: 60px 0 0 0;
  float: left;
}
.top_sect_in2 .lead {
  margin: 0 auto 60px auto;
}
.top_sect_in2 .text {
  width: 86%;
  margin: 0 7% 60px 7%;
  font-size: 18px;
  line-height: 32px;
  text-align: center;
}
.top_sect_in2 .left .bt a {
  width: 240px;
  margin: 0 auto 0 auto;
  border: 2px solid #3e3a39;
  padding: 18px 0;
  text-align: center;
  text-decoration: none;
  font-size: 24px;
  line-height: 1em;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  color: #3e3a39;
  background-image: url(../img/common/link_icon.png);
  background-repeat: no-repeat;
  background-position: 80% center;
  display: block;
  position: relative;
  overflow: hidden;
}
.top_sect_in2 .left .bt a::after {
  position: absolute;
  /*z-index: -1;*/
  display: block;
  content: '';
  top: 100%;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.15);
  left: 0;
}
.top_sect_in2 .left .bt a:hover::after {
  animation: anim_btn_color .5s ease;
}
.top_sect_in2 .left .bto a:hover {
  cursor: pointer;
}
.top_sect_in2 .name {
  font-size: 28px;
  text-align: center;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
}
.top_sect_in2 .name span {
  font-size: 20px;
  padding-right: 1em;
}
.youtube_box {
  max-width: 1000px;
  margin: 10px auto 80px;
}
@media screen and (max-width: 1359px) {
  .top_sect_in2 {
    width: 90%;
    margin: 0 5% 0 5%;
  }
  .top_sect_in2 .img img {
    position: absolute;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    top: -10%;
    left: -20%;
    z-index: 1;
  }
  .navi ul:first-child {
    width: 100%;
  }
  .youtube_box {
    margin: 10px 5px 40px;
  }
}
.top_appendix {
  margin-top: 40px;
  font-size: 75%;
  line-height: 1.5em;
}
/*　コンクリート打ち放し調/杉板浮造り調

----------------------------------------------------------*/
.sect_01 {
  width: 100%;
  height: 640px;
  position: relative;
}
.sect_01_in {
  width: 50%;
  height: 640px;
  overflow: hidden;
  position: relative;
  float: left;
}
.sect_01_in img {
  position: absolute;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  top: 0;
  left: 0;
  z-index: -1;
}
.sect_01_in .bt_l {
  width: 240px;
  position: absolute;
  right: 23%;
  bottom: 80px;
  z-index: 2;
}
.sect_01_in .bt_r {
  width: 240px;
  position: absolute;
  left: 23%;
  bottom: 80px;
  z-index: 2;
}
.bt_m {
  width: 240px;
  position: absolute;
  left: 50%;
  bottom: 80px;
  margin-left: -120px;
  z-index: 2;
}
.bt_m.t {
  width: 290px;
  position: absolute;
  left: 50%;
  bottom: 150px;
  margin-left: -120px;
  z-index: 2;
}
.bt_m.b {
  width: 290px;
  position: absolute;
  left: 50%;
  bottom: 50px;
  margin-left: -120px;
  z-index: 2;
}
.sect_02 {
  width: 100%;
  height: 812px;
  overflow: hidden;
  position: relative;
}
.sect_02 img {
  position: absolute;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  top: 0;
  left: 0;
  z-index: -1;
}
.sect_03 {
  width: 100%;
  height: 1036px;
  overflow: hidden;
  position: relative;
}
.sect_03 img {
  position: absolute;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  top: 0;
  left: 0;
  z-index: -1;
}
.sect_04 {
  width: 100%;
  height: 640px;
  overflow: hidden;
  position: relative;
}
.sect_04 img {
  position: absolute;
  min-width: 100%;
  min-height: 100%;
  width: auto;
  height: auto;
  top: 0;
  left: 0;
  z-index: -1;
}
.text_wrap {
  position: absolute;
  width: 100%;
  left: 0;
  top: 0;
  z-index: 3;
}
.text_wrap .text_box {
  margin: auto;
  font-size: 18px;
  line-height: 32px;
  text-align: left;
  color: #fff;
}
.concrete_sect_01 {
  width: 650px;
  padding-top: 160px;
}
.concrete_sect_03 {
  width: 240px;
  padding-top: 617px;
}
.concrete_sect_04 {
  width: 240px;
  padding-top: 830px;
}
.sugiita_sect_01 {
  width: 450px;
  padding-top: 160px;
}
.sugiita_sect_01b {
  width: 560px;
  padding-top: 160px;
}
.sugiita_sect_02 {
  width: 530px;
  padding-top: 92px;
}
.sugiita_sect_03 {
  width: 530px;
  padding-top: 112px;
}
.sugiita_sect_04 {
  width: 910px;
  padding-top: 676px;
}
.concrete_cont {
  width: 100%;
  background-color: #e0dee2;
  background-image: url(../img/concrete/cont_back.jpg);
  background-repeat: no-repeat;
  background-position: center top;
  padding: 200px 0 50px 0;
}
.sugiita_cont {
  width: 100%;
  background-color: #e0dee2;
  background-image: url(../img/sugiita/cont_back.jpg);
  background-repeat: no-repeat;
  background-position: center top;
  padding: 200px 0 50px 0;
}
.cont_in {
  width: 1260px;
  margin: auto;
}
.cont_in .top_text {
  width: 520px;
  padding: 0 20px 0 720px;
  margin: 0 0 80px 0;
  font-size: 18px;
  line-height: 32px;
  text-align: left;
}
.cont_in .top_text .lead {
  margin: 0 0 20px 0;
}
.cont_in .img_title {
  width: 1186px;
  font-size: 40px;
  line-height: 1.5em;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  text-align: center;
  padding: 15px 0;
  margin: 40px auto;
  border-bottom: 1px solid #3e3a39;
}
.cont_contact {
  width: 910px;
  margin: 0 auto 70px auto;
}
.cont_contact table {
  border-collapse: separate;
  border-spacing: 10px 15px;
  width: 100%;
}
.cont_contact th {
  width: 190px;
  padding: 0px 10px 0px 10px;
  font-size: 18px;
  text-align: left;
  vertical-align: top;
  background-color: #e0dee2;
}
.cont_contact td {
  padding: 0 0 0 0;
  text-align: left;
}
.cont_contact .comm {
  width: 650px;
  margin: auto;
  font-size: 18px;
  line-height: 29px;
  text-align: left;
}
.sugiita_cont .sugi_imgcen {
  text-align: center;
  max-width: 1683px;
  margin: auto;
  width: 100%;
}
.sugiita_cont .sugi_imgcen_c {
  text-align: center;
  max-width: 1433px;
  margin: auto;
  width: 100%;
}
.sugi_img22 {
  margin: 20px auto;
}
.sugi_img22 img {
  width: auto;
  max-width: 100%;
  height: auto;
}
.sugi_img23 {
  margin: 10px auto;
}
.sugi_img32 {
  margin: 10px auto 0px;
}
.sugi_img32_a {
  text-align: right;
  font-size: 14px;
  margin-right: 10px;
}
.sugi_img38 {
  margin: 10px auto 0px;
  text-align: center;
}
.sugi_reia {
  width: 70%;
  margin: auto;
}
.sugi_reia li {
  float: left;
  width: 50%;
  margin: 2.5% 0;
  text-align: center;
}
.sugi_reia li img {
  max-width: 350px;
  height: auto;
}
.sugi_reia_b {
  width: 90%;
  margin: auto;
}
.sugi_reia_b li {
  float: left;
  width: 33%;
  margin: 2.5% 0;
  text-align: center;
}
.sugi_reia_b li img {
  max-width: 350px;
  height: auto;
}
.sugi_reia_mi {
  width: 100%;
  margin: auto;
}
.sugi_reia_mi li {
  float: left;
  width: 33%;
  margin: 2.5% 0;
  text-align: center;
  font-size: 16px;
}
.sugi_reia_mi li img {
  max-width: 280px;
  height: auto;
}
.sugi_reia_mi.img_cen {
  width: 40%;
  margin: auto;
  font-weight: bold;
}
.sugi_reia_mi.img_cen li {
  float: left;
  width: 100%;
  margin: 2.5% 0;
  text-align: center;
  font-size: 16px;
}
.sugi_reia_mi.img_cen li img {
  max-width: 360px;
  height: auto;
}
.box_bb {
  max-width: 200px;
  height: auto;
  margin: 10px auto 0;
}
.sugi_reia_mib {
  width: 70%;
  margin: auto;
}
.sugi_reia_mib li {
  float: left;
  width: 50%;
  margin: 2.5% 0;
  text-align: center;
  font-size: 16px;
}
.sugi_reia_mib li img {
  max-width: 280px;
  height: auto;
}
.sugi_pane {
  width: 90%;
  margin: auto;
}
.sugi_pane li {
  float: left;
  width: 50%;
  margin: 2.5% 0;
  text-align: center;
}
.sugi_pane li img {
  max-width: 400px;
  height: auto;
}
.sugi_pane li.aaa {
  float: left;
  width: 65%;
  margin: 2.5% 0;
  text-align: center;
}
.sugi_pane li.aaa img {
  max-width: 530px;
  height: auto;
}
.sugi_pane li.bbb {
  float: left;
  width: 35%;
  margin: 2.5% 0;
  text-align: center;
}
.sugi_pane li.bbb img {
  max-width: 236px;
  height: auto;
}
.contents_text {
  width: 30%;
  margin: 0 auto 20px;
  font-weight: bold;
  border: solid #000000 1px;
  text-align: center;
  padding: 4px;
}
.contents_a {
  width: 100%;
  max-width: 1200px;
  margin: 30px auto;
  line-height: 35px;
}
.contents_a img {
  width: 100%;
}
.contents_a_mb {
  width: 100%;
  max-width: 1200px;
  margin: 0 auto 20px;
  line-height: 35px;
}
.contents_a_mb img {
  width: 100%;
}
.text-center {
  text-align: center;
}
.flexbox {
  display: flex;
}
.box1 {
  width: 30%;
  margin: auto;
}
.box_inn {
  width: 74%;
  margin: 10px auto 0;
}
.patent_ss {
  width: 100%;
  text-align: center;
  margin: 60px auto;
}
.patentlink {
  display: block;
  margin-top: -120px;
  padding-top: 120px;
}
.box2 {
  width: 30%;
  margin: auto;
}
.box3 {
  width: 30%;
  margin-left: 20px;
}
.box4 {
  width: 40%;
  margin: auto;
  font-weight: bold;
}
.tex_cen {
  text-align: center;
}

.sugiita_btn{
    position: relative;
    border: 1px solid #3e3a39;
    background-color: #3e3a39;
    margin: 100px auto;
    width: 90%;
    max-width: 910px;
}

.sugiita_btn a{
    display: block;
    width: 100%;
    padding: 20px 0;/*上下余白指定*/
    text-align: center;/*テキスト中央寄せ*/
    color: #FFFFFF;
    font-size: 24px;
    text-decoration: none;
    position: relative;
}
.sugiita_btn a:after{
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 0;
    background-color: rgba(255, 255, 255, 0.3);
    content: "";
    transition: 0.3s;
}
.sugiita_btn a:hover:after{
    height: 100%;
}

.sugiita_btn .txt30 {
    font-size: 125%;
}
.sugiita_icon{
    position: absolute;
    top: 50%;
    right: 43px;/*右からの距離*/
    width: 27px;/*アイコンの横幅指定*/
    transform: translateY(-50%);/*この指定で上下中央に*/
}
.sugiita_btn a br{
    display: none;
}



@media screen and (max-width: 767px) {
  .contents_a {
    line-height: 20px;
  }
  .contents_a_mb {
    line-height: 20px;
  }
  .flexbox {
    display: block;
  }
  .flexbox .box1 {
    width: 80%;
    margin: 10px auto;
    max-width: 350px;
  }
  .flexbox .box2 {
    width: 80%;
    margin: 10px auto;
    max-width: 350px;
  }
  .flexbox .box3 {
    width: 80%;
    margin: 10px auto;
    max-width: 350px;
  }
  .flexbox .box4 {
    width: 80%;
    margin: 10px auto;
    max-width: 350px;
  }
	
.sugiita_btn{
    margin: 40px auto;
}	
	
	
	
    .sugiita_btn a{
        box-sizing: border-box;
        font-size: 15px;
        padding-right: 50px
    }
    .sugiita_icon{
        right: 15px;/*右からの距離*/
        width: 20px;/*アイコンの横幅指定*/
    }
}
@media screen and (max-width: 480px) {
    .sugiita_btn a br{
        display: inline-block;
    }

}



/*　gallery

----------------------------------------------------------*/
.page_title {
  width: 660px;
  font-size: 40px;
  line-height: 1.5em;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  text-align: center;
  padding: 15px 0;
  margin: 0 auto 30px auto;
  border-bottom: 1px solid #fff;
  color: #fff;
}
.page_comm {
  width: 660px;
  margin: auto;
  font-size: 18px;
  line-height: 32px;
  text-align: center;
  color: #fff;
}
.page_comm.pane {
  width: 800px;
  margin: auto;
  font-size: 18px;
  line-height: 32px;
  text-align: center;
  color: #fff;
}
.gallery .head_img {
  padding: 40px 0;
  background-image: url(../img/gallery/head_img.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  overflow: hidden;
}
.gallery_tab {
  width: 710px;
  margin: 500px auto;
  background-color: rgba(0, 0, 0, 0.6);
  color: #fff;
  text-align: center;
  padding: 35px 0;
}
.gallery_tab .bt {
  width: 326px;
  margin: 0 auto;
}
.gallery_tab_pane {
  width: 910px;
  margin: 500px auto;
  background-color: rgba(0, 0, 0, 0.6);
  color: #fff;
  text-align: center;
  padding: 35px 0;
}
.gallery_tab_pene .bt {
  width: 326px;
  margin: 0 auto;
}
.gallery_sect_01 {
  background-image: url(../img/gallery/img_01.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto 100%;
  overflow: hidden;
}
.gallery_sect_02 {
  background-image: url(../img/gallery/img_02.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto 100%;
  overflow: hidden;
}
.gallery_sect_03 {
  background-image: url(../img/gallery/img_05.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: auto 100%;
  overflow: hidden;
}
.patent {
  width: 100%;
  margin: 20px auto -70px;
  text-align: center;
}
.patent_b {
  width: 100%;
  max-width: 1708px;
  margin: 90px auto 40px;
  text-align: center;
}
.patent_c {
  width: 100%;
  max-width: 1568px;
  margin: 90px auto 40px;
  text-align: center;
}
.patent_c img {
  width: auto;
  max-width: 100%;
  height: auto;
}
.sugi41 {
  width: 100%;
  margin: 30px auto;
  text-align: center;
}
.no_title {
  background: linear-gradient(180deg, #fff 0%, #fff 50%, #e0dee2 50%, #e0dee2 100%);
  justify-content: center;
  align-items: center;
  display: inline-block;
  padding: 10px;
  margin-bottom: 25px;
}
.no_title p {
  font-size: 18px;
  font-weight: bold;
  vertical-align: middle;
  text-indent: -2.3em;
  padding-left: 2.3em;
}
.no_title02 {
  background: linear-gradient(180deg, #fff 0%, #fff 35%, #e0dee2 35%, #e0dee2 100%);
  justify-content: center;
  align-items: center;
  display: inline-block;
  padding: 10px;
  margin-bottom: 15px;
  line-height: 20px;
}
.no_title02 p {
  font-size: 18px;
  font-weight: bold;
  vertical-align: middle;
  text-indent: -3.3em;
  padding-left: 3.3em;
}
.no_title02 img {
  margin-right: 20px;
  vertical-align: middle;
}
.title_txt {
  font-size: 18px;
  font-weight: bold;
}
.no_title img {
  margin-right: 20px;
  vertical-align: middle;
}
.sugi_img42 {
  margin: 0 auto 100px;
}
.font_28 {
  font-size: 28px;
}
.font_14 {
  font-size: 14px;
  margin-right: 5px;
}
.sugi_cen {
  text-align: center;
}
.sugi_box1 {
  margin-left: 180px;
}
.sugi_sub {
  width: 100%;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  max-width: 1130px;
}
.sugi_sub li {
  width: 32%;
  margin-bottom: 20px;
  line-height: 34px;
  font-size: 18px;
}
.sugi_sub li p {
  font-size: 22px;
  font-weight: bold;
}
.sugi_sub li span {
  background-color: #c00d23;
  color: #FFFFFF;
  box-sizing: border-box;
  padding-left: 5px;
  padding-right: 5px;
  padding-top: 3px;
  margin-left: 10px;
}
.sub01 {
  letter-spacing: -0.05em;
}
.sub02 {
  font-size: 14px;
  color: #FF0004;
  margin-left: 120px;
  margin-top: -6px;
}
.sugi_sub02 {
  width: 100%;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  max-width: 1130px;
}
.sugi_sub02 li {
  width: 46%;
  margin-bottom: 20px;
}
.sugi_sub03 {
  width: 100%;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  max-width: 1400px;
}
.sugi_sub03 li {
  margin-bottom: 20px;
  width: 46%;
}
.sugi_sub03 li:first-child {
  text-align: right;
  width: 47%;
}
.sugi_sub03 li .font16 {
  font-size: 16px;
  color: #6f6f6f;
}
.sugi_sub03 .txt {
  font-size: 14px;
  color: #6f6f6f;
  line-height: 22px;
  margin: 10px 20px 20px 0;
}
@media screen and (max-width: 767px) {
  .no_title {
    background: linear-gradient(180deg, #fff 0%, #fff 30%, #e0dee2 30%, #e0dee2 100%);
    padding: 5px;
    margin-bottom: 0;
    width: 100%;
    margin-top: 15px;
  }
  .no_title img {
    margin-right: 5px;
    width: 10%;
  }
  .sugi_img42 {
    margin: 0 auto 50px;
  }
  .sugi_sub li {
    width: 90%;
    margin: 0 auto 20px;
  }
  .sugi_box1 {
    margin-left: 0;
  }
  .font_28 {
    font-size: 20px;
  }
  .sugi_sub li p {
    font-size: 20px;
  }
  .sugi_sub li {
    line-height: 30px;
  }
  .sugi_sub02 li {
    width: 90%;
    margin: 0 auto 20px;
  }
  .sugi_sub03 li {
    margin-bottom: 20px;
    width: 90%;
    margin: 0 auto 20px;
  }
  .sugi_sub03 li:first-child {
    text-align: center;
    width: 90%;
    margin: 0 auto 20px;
  }
  .no_title02 {
    background: linear-gradient(180deg, #fff 0%, #fff 30%, #e0dee2 30%, #e0dee2 100%);
    padding: 5px;
    margin-bottom: 15px;
    width: 100%;
  }
  .no_title02 img {
    margin-right: 5px;
    width: 10%;
  }
  .no_title02 p {
    text-indent: -2em;
    padding-left: 2em;
  }
  .sugi_sub03 .txt {
    font-size: 14px;
    color: #6f6f6f;
    line-height: 22px;
    margin: 10px 0 0 0;
  }
  .sugi_cen {
    margin-bottom: 20px;
  }
}
/******************ビフォー　アフター****************************/
.gallery_sect_02 {}
.gallery_sect_02 {
  overflow-x: hidden;
}
.gallery_inline_wrap {
  display: none;
  overflow-x: hidden;
  position: relative;
}
.gallery_inline {
  width: 800px;
  margin: auto;
  font-size: 13px;
  line-height: 24px;
  color: #fff;
}
.gallery_inline .img {
  width: 490px;
  margin: 100px auto;
  position: relative;
}
.gallery_inline .imgs {
  width: 800px;
  margin: 100px auto;
  position: relative;
}
.gallery_inline .img_sub {
  width: auto;
  height: auto;
  margin: 0;
  position: absolute;
  top: -60px;
  left: -40px;
  z-index: 2;
  display: none;
}
.gallery_inline .img_sub img {
  -webkit-box-shadow: #000 10px 10px 5px;
  -moz-box-shadow: #000 10px 10px 5px;
  box-shadow: #000 10px 10px 5px;
}
.gallery_bt {
  border: 1px solid #fff;
  padding: 18px 0;
  text-align: center;
  text-decoration: none;
  font-size: 24px;
  line-height: 1em;
  font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  color: #fff;
  display: block;
  width: 70%;
  position: absolute;
  bottom: 44px;
  left: 15%;
  z-index: 3;
  overflow: hidden;
}
.gallery_bt::after {
  position: absolute;
  /*z-index: -1;*/
  display: block;
  content: '';
  top: 100%;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.3);
  left: 0;
}
.gallery_bt:hover::after {
  animation: anim_btn_color2 .3s ease forwards;
}
.gallery_bt:hover + .img_sub {
  animation: anim_btn_img 1.5s ease forwards;
  display: block;
}
@keyframes anim_btn_color2 {
  0% {
    top: 100%;
  }
  100% {
    top: 0;
  }
}
@keyframes anim_btn_img {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
/*　gallery-2  リニューアル　2020.7

----------------------------------------------------------*/
.g-ttl {
  width: 100%;
  text-align: center;
  padding: 150px 0;
  color: #fff;
  margin-top: 20px;
}
.bg-sec01 {
  background: url(../img/gallery2/bg_ttl01.jpg) center top no-repeat;
}
.bg-sec02 {
  background: url(../img/gallery2/bg_ttl02.jpg) center top no-repeat;
}
.bg-sec03 {
  background: url(../img/gallery2/bg_ttl03.jpg) center top no-repeat;
}
.g-list {
  width: 100%;
  margin-top: 3px;
  margin-bottom: 100px;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-around;
}
.g-list li {
  width: 24.75%;
  height: 19vw;
  margin-bottom: 0.25%;
  overflow: hidden;
  position: relative;
}
.g-list li a {
  display: block;
}
.g-list li img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: auto;
  height: 130%;
  transition: 0.2s;
}
.g-list li a:hover img {
  height: 120%;
  width: auto;
}
.g-list .name {
  position: absolute;
  left: 0;
  bottom: 0;
  width: 94%;
  padding: 3%;
  background: url(../img/gallery/bg_name.png);
  color: #fff;
  font-size: 75%;
  line-height: 1.2em;
  text-align: left;
}
@media screen and (max-width: 767px) {
  .g-ttl {
    padding: 50px 0;
  }
  .bg-sec01, .bg-sec02, .bg-sec03 {
    background-size: cover;
  }
  .g-list {
    margin-bottom: 30px;
  }
  .g-list li {
    width: 49.75%;
    height: 35vw;
  }
  .g-list li.sub {
    display: none;
  }
  .g-list .name {
    font-size: 13px;
    line-height: 1.2em;
  }
}
/*　設計事務所様へ

----------------------------------------------------------*/
.design .head_img {
  padding: 160px 0;
  background-image: url(../img/design/head_img.jpg);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  overflow: hidden;
}
.design .text_wrap {
  position: absolute;
  width: 100%;
  left: 0;
  top: 30%;
  z-index: 3;
  font-size: 18px;
  line-height: 32px;
  text-align: center;
  color: #fff;
}
.design .text_wrap.a {
  position: absolute;
  width: 100%;
  left: 0;
  top: 15%;
  z-index: 3;
  font-size: 18px;
  line-height: 32px;
  text-align: center;
  color: #fff;
}
.design .wrap {
  height: 640px;
  position: relative;
}
.design .text_wrap_pane {
  position: absolute;
  width: 100%;
  left: 0;
  top: 30%;
  z-index: 3;
  font-size: 18px;
  line-height: 32px;
  text-align: center;
  color: #fff;
  background-color: rgba(0, 0, 0, 0.3);
}
.design .text_wrap_pene.a {
  position: absolute;
  width: 100%;
  left: 0;
  top: 15%;
  z-index: 3;
  font-size: 18px;
  line-height: 32px;
  text-align: center;
  color: #fff;
}
.design .wrap_pene {
  height: 640px;
  position: relative;
}
/*　会社概要

----------------------------------------------------------*/
/*.company #contents {

	background-image: url(../img/company/img_01.jpg);

	background-repeat: no-repeat;

	background-position: top center;

	background-size: cover;

	padding: 0 0 5px 0;

}*/
.show_link {
  width: 100%;
  margin-top: -100px;
  padding-top: 100px;
}
.map_title {
  background-image: url(../img/company/arrow.png);
  background-repeat: no-repeat;
  background-position: center bottom;
  padding-bottom: 1px;
}
.comp_table {
  width: 1070px;
  margin: 0 auto 70px auto;
}
.comp_table table {
  border-collapse: separate;
  border-spacing: 10px 15px;
  width: 100%;
}
.comp_table th {
  width: 140px;
  padding: 10px 60px;
  font-size: 20px;
  text-align: left;
  background-color: #e3e1e5;
}
.comp_table td {
  font-size: 18px;
  line-height: 36px;
  padding: 10px 0 10px 60px;
  text-align: left;
}
.comp_map {
  width: 100%;
  height: 590px;
  margin: 5px auto 30px auto;
}
.hyouka_a {
  width: 100%;
  max-width: 1070px;
  margin: auto;
  font-size: 90%;
  line-height: 1.4em;
}
.news01 {
  width: 80%;
  margin: auto;
}
.news01 li {
  float: left;
  width: 50%;
  margin: 2.5% 0;
  text-align: center;
}
.news01 li img {
  max-width: 350px;
  height: auto;
  border: solid 1px #999999;
  box-sizing: border-box;
}
.com-slid {
  max-width: 1070px;
  margin: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
.com-slid li {
  max-width: 510px;
  margin: 2.5% 0;
}
.com-slid li p {
  text-align: left;
}
.news_img {
  width: 100%;
  max-width: 500px;
  margin: 20px auto;
  text-align: center;
}
.news_info {
  width: 100%;
  max-width: 500px;
  margin: 20px auto;
  text-align: center;
}
.news_img img {
  max-width: 90%;
  height: auto;
  border: solid 1px #999999;
  box-sizing: border-box;
}
/*　カタログダウンロード

----------------------------------------------------------*/
.catalog_download #contents {
  background-color: rgba(64, 61, 60, 0.5);
  color: #fff;
  position: relative;
}
.catalog_download_bg {
  position: absolute;
  bottom: 0;
  right: 0;
  z-index: -1;
}
.catalog_download #contents .top_text {
  font-size: 25px;
}
.catalog_download_contents {
  width: 98%;
  margin: 0 auto;
  display: flex;
  justify-content: space-evenly;
  flex-wrap: wrap;
  margin-top: 30px;
}
.catalog_download_contents:after {
  content: "";
  display: block;
  width: 550px;
  height: 0;
}
.catalog_each {
  display: flex;
  width: 550px;
  margin-bottom: 50px;
}
.catalog_each_right {
  width: 50%;
  margin-left: 5%;
}
.catalog_each_left {
  width: 45%;
}
.catalog_each_left img {
  width: 100%;
}
.catalog_each_right h2 {
  font-size: 25px;
  line-height: 150%;
  margin-bottom: 15px;
}
.catalog_each_right h2 span {
  font-size: 17px;
  line-height: 100%;
}
.catalog_each_right p {
  text-align: left;
  font-size: 18px;
  line-height: 150%;
}
.catalog_each_right a {
  display: block;
  padding: 10px;
  margin-top: 25px;
  font-size: 18px;
  line-height: 200%;
  background-color: #9B1527;
  color: #fff;
}
.catalog_each_right a img {
  vertical-align: middle;
  max-width: 36px;
}
/*　カタログ請求フォーム

----------------------------------------------------------*/
.catalog_form #contents {
  background-color: rgba(64, 61, 60, 0.5);
  color: #fff;
  position: relative;
}
.catalog_form .contact_table th {
  vertical-align: top;
  line-height: 120%;
  width: 265px;
}
.catalog_form .contact_table th span {
  font-size: 16px;
  line-height: 16px;
}
.catalog_form .contact_table td input[type="checkbox"] {
  width: 20px;
  height: 20px;
  vertical-align: middle;
}
.catalog_gallery {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.catalog_gallery li {
  margin-right: 5px;
}
.catalog_gallery li:last-child {
  margin-right: 0;
}
.catalog_form #contents .contact_table form {
  position: relative;
}
.catalog_form_bg {
  position: absolute;
  bottom: 60px;
  right: 0;
  z-index: -1;
}
.catalog_txt {
  text-align: center;
  width: 95%;
  margin: auto;
  font-size: 18px;
  line-height: 180%;
}
/*　お問い合わせ

----------------------------------------------------------*/
.head_toi {
  padding-top: 160px;
}
.contact #contents {
  background-image: url(../img/contact/back.jpg);
  background-repeat: no-repeat;
  background-position: top center;
  background-size: cover;
}
.contact_tel {
  width: 660px;
  margin: 30px auto;
  font-size: 18px;
  line-height: 20px;
  text-align: center;
}
.contact_name {
  font-size: 30px;
  text-align: center;
  margin: auto;
  color: #fff;
}
.contact_time {
  width: 470px;
  margin: 0 auto 50px auto;
  padding: 0 0 0 190px;
  font-size: 18px;
  line-height: 30px;
  text-align: left;
  color: #fff;
}
.contact_table .comm {
  width: 660px;
  margin: 30px auto;
  font-size: 18px;
  line-height: 29px;
  text-align: left;
}
.contact_table {
  padding: 0;
  margin: 30px auto 0;
  padding: 50px 0;
  color: #fff;
}
.contact_table table {
  width: 890px;
  margin: auto;
}
.contact_table th {
  width: 205px;
  padding: 9px 0 9px 0;
  font-size: 18px;
  text-align: left;
  vertical-align: top;
}
.contact_table td {
  padding: 9px 0 9px 0;
  text-align: left;
}
.submit_btn {
  width: 288px;
  margin: 36px auto 36px auto;
  font-size: 22px;
  line-height: 1em;
  padding: 20px 0;
  text-align: center;
  color: #fff;
  background-color: #cf0000;
  border: none;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  display: block;
  position: relative;
  overflow: hidden;
}
.submit_btn.a {
  width: 500px;
  margin: 36px auto 36px auto;
  font-size: 22px;
  line-height: 1em;
  padding: 20px 0;
  text-align: center;
  color: #fff;
  background-color: #303030;
  border: none;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  display: block;
  position: relative;
  overflow: hidden;
}
.submit_btn.b {
  width: 500px;
  margin: 20px auto 36px auto;
  font-size: 22px;
  line-height: 1em;
  padding: 20px 0;
  text-align: center;
  color: #fff;
  background-color: #303030;
  border: none;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  display: block;
  position: relative;
  overflow: hidden;
}
.submit_btn::after {
  position: absolute;
  /*z-index: -1;*/
  display: block;
  content: '';
  top: 100%;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.3);
  left: 0;
}
.submit_btn:hover::after {
  animation: anim_btn_color .5s ease;
}
.submit_btn:hover {
  cursor: pointer;
}
.return_btn {
  width: 288px;
  margin: 36px auto 36px auto;
  font-size: 22px;
  line-height: 1em;
  padding: 20px 0;
  text-align: center;
  color: #fff;
  background-color: #cf0000;
  border: none;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  display: block;
  position: relative;
  overflow: hidden;
}
.return_btn::after {
  position: absolute;
  /*z-index: -1;*/
  display: block;
  content: '';
  top: 100%;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.3);
  left: 0;
}
.return_btn:hover::after {
  animation: anim_btn_color .5s ease;
}
.return_btn:hover {
  cursor: pointer;
}
.confirm_btn {
  width: 288px;
  margin: 36px auto 36px auto;
  font-size: 22px;
  line-height: 1em;
  padding: 20px 0;
  text-align: center;
  color: #fff;
  background-color: #cf0000;
  border: none;
  -webkit-border-radius: 6px;
  -moz-border-radius: 6px;
  border-radius: 6px;
  display: block;
  position: relative;
  overflow: hidden;
}
.confirm_btn::after {
  position: absolute;
  /*z-index: -1;*/
  display: block;
  content: '';
  top: 100%;
  width: 100%;
  height: 100%;
  background-color: rgba(255, 255, 255, 0.3);
  left: 0;
}
.confirm_btn:hover::after {
  animation: anim_btn_color .5s ease;
}
.confirm_btn:hover {
  cursor: pointer;
}
.form_style {
  width: 96%;
  height: auto;
  padding: 2% 2%;
  vertical-align: middle;
  font-size: 16px;
}
.form_style_s {
  width: 50%;
  height: auto;
  padding: 2% 2%;
  vertical-align: middle;
  font-size: 16px;
}
.form_style_tarea {
  width: 96%;
  height: 160px;
  padding: 2% 2%;
  font-size: 16px;
}
.strong {
  font-weight: bold;
}
.under {
  text-decoration: underline;
}
.ml_1em {
  margin-left: 1em;
}
@media screen and (max-width: 1500px) {
  .sugi_reia_b {
    width: 75%;
    margin: auto;
  }
  .sugi_reia_b li {
    float: left;
    width: 30%;
    margin: 2.5% 0;
    text-align: center;
  }
  .sugi_reia_b li img {
    max-width: 300px;
    height: auto;
  }
}
/* ===========横幅767px以下================ */
@media screen and (max-width: 767px) {
  /****************************************************************************

	body設定

*****************************************************************************/
  body {
    color: #000;
    font-size: 20px;
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
    line-height: 48px;
    text-align: center;
    overflow-wrap: break-word;
    -webkit-text-size-adjust: 100%;
  }
  h2, h3, h4 {
    text-align: left;
  }
  a {
    color: #000;
    text-decoration: none;
  }
  a:hover {
    color: #000;
    text-decoration: underline;
  }
  img {
    margin: 0;
    padding: 0;
    width: 100%;
    height: auto;
  }
  .news_info img {
    width: 90%;
  }
  #container {
    min-width: 100%;
    max-width: 100%;
    width: auto;
    margin: 0 auto;
    text-align: center;
  }
  #contents {
    width: 100%;
    margin: 0 auto;
    text-align: center;
  }
  /****************************************************************************

	コンテンツ設定

*****************************************************************************/
  /*	ヘッダー

----------------------------------------------------------------------------*/
  #header {
    display: none;
    width: 100%;
    margin: auto;
    padding: 0;
  }
  #header2 {
    width: 100%;
    margin: auto;
    padding: 0;
    display: block;
  }
  #header_in {
    display: none;
    min-width: 100%;
    max-width: 100%;
    width: 100%;
    margin: auto;
  }
  .head_logo {
    width: 40%;
    margin: 1% 2% 0 2%;
    text-align: left;
  }
  .head_logo_inst {
    width: 10%;
    margin: 2.5% 1% 0 1%;
    text-align: left;
  }
  .h1 {
    display: none;
    paddning: 13px 0 0 0;
    font-size: 12px;
    line-height: 15px;
    height: 30px;
    text-align: left;
    color: #4d4d4d;
  }
  .list_close {
    width: 12.5%;
    margin: 0;
    float: right;
    z-index: 1000;
  }
  .open_menu {
    width: 12.5%;
    margin: 0;
    float: right;
    z-index: 1000;
  }
  .pc {
    display: none;
  }
  .sm {
    display: inline;
  }
  .sm_pt15 {
    padding-bottom: 15px;
  }
  /*	グローバルナビ

----------------------------------------------------------------------------*/
  .navi {
    display: none;
  }
  /*	グローバルナビ(スマホ用)

----------------------------------------------------------------------------*/
  #category_list {
    display: none;
    width: 100%;
    position: absolute;
    z-index: 999;
    top: 0;
    left: 0;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    -o-box-sizing: border-box;
    -ms-box-sizing: border-box;
    box-sizing: border-box;
  }
  #category_list > ul {
    margin-top: 12.5%;
    width: 100%;
    background-color: #eee;
  }
  #category_list li a {
    font-size: 20px;
    line-height: 40px;
    font-weight: bold;
    text-decoration: none;
    color: #000;
    background-image: url(img/common/icon.png);
    background-repeat: no-repeat;
    background-position: 95%;
    text-align: left;
    padding-left: 5%;
    padding-top: 4%;
    padding-bottom: 4%;
    border-bottom: 1px solid #000;
    display: block;
  }
  #category_list li a:hover {
    background-color: #c2c2c2;
    text-decoration: none;
  }
  /*	カタログダウンロードアイコン

----------------------------------------------------------------------------*/
  .catalog_download_icon {
    position: fixed;
    right: 0;
    bottom: 85px;
    z-index: 10000;
    width: 85px;
  }
  /*	フッター

----------------------------------------------------------------------------*/
  #footer {
    padding: 0;
    text-align: center;
    margin: 0;
  }
  .foot_link {
    border-top: 1px solid #3e3a39;
    border-bottom: 1px solid #3e3a39;
    margin: 8% auto;
    padding: 0 0;
  }
  foot_link.bl {
    border-top: 1px solid #3e3a39;
    border-bottom: 1px solid #3e3a39;
    margin: 0 auto;
    padding: 0 0;
  }
  .footer_blog_in {
    position: relative;
    width: 90%;
    padding: 6% 5%;
    font-size: 16px;
    line-height: 26px;
    text-align: center;
    color: #fff;
    top: 0;
    z-index: 2;
  }
  .footer_blog_in .lead {
    margin: 0 auto 2% auto;
  }
  .footer_blog_in .bt {
    width: 60%;
    margin: 6% 15% 0 15%;
    padding: 3% 5%;
    font-size: 18px;
    line-height: 1em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  }
  .price_link_in {
    position: relative;
    width: 90%;
    padding: 6% 5%;
    font-size: 16px;
    line-height: 26px;
    text-align: center;
    color: #fff;
    top: 0;
    z-index: 2;
  }
  .price_link_in .lead {
    margin: 0 auto 2% auto;
  }
  .price_link_in .bt {
    width: 60%;
    margin: 6% 15% 0 15%;
    padding: 3% 5%;
    font-size: 18px;
    line-height: 1em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  }
  .foot_link ul:before, .foot_link ul:after {
    content: "";
    display: table;
  }
  .foot_link ul:after {
    clear: both;
  }
  .foot_link ul {
    width: 100%;
  }
  .foot_link .mid {
    border-right: none;
    border-left: none;
    border-top: 1px solid #3e3a39;
    border-bottom: 1px solid #3e3a39;
  }
  .foot_link li {
    width: 50%;
    padding: 5% 25% 0 25%;
    background-color: #fff;
    position: relative;
    overflow: hidden;
    float: left;
  }
  .foot_link li::after {
    position: absolute;
    /*z-index: -1;*/
    display: block;
    content: '';
    top: 100%;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.1);
    left: 0;
  }
  .foot_link li:hover::after {
    animation: anim_btn_color .5s ease;
  }
  .foot_link li:hover {
    cursor: pointer;
  }
  .foot_logo {
    width: 70%;
    margin: 0 15% 5% 15%;
  }
  .foot_add {
    font-size: 14px;
    line-height: 24px;
    text-align: center;
    margin: 0 auto 5% auto;
  }
  .foot_add .name {
    font-size: 18px;
    line-height: 1em;
    margin: 0 0 2% 0;
  }
  .foot_add .name img {
    height: 15px;
    width: auto;
    margin: 3px 0 0 0.5em;
  }
  .foot_add .telno {
    font-size: 18px;
  }
  #footer_copy {
    height: 40px;
    font-size: 18px;
    line-height: 20px;
    padding: 0;
    text-align: center;
  }
  #footer .page_top {
    position: fixed;
    overflow: hidden;
    margin: 0 0 0 0;
    width: 60px;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    background-color: rgba(255, 255, 255, 0.3);
    bottom: 20px;
    right: 2%;
    z-index: 300;
  }
  #footer .page_top img {
    width: 90%;
    height: auto;
    margin: 5%;
  }
  /*	共通

----------------------------------------------------------------------------*/
  .bt_deco a {
    margin: auto;
    border: 1px solid #fff;
    padding: 3% 5%;
    text-align: center;
    text-decoration: none;
    font-size: 18px;
    line-height: 1em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
    color: #fff;
    position: relative;
    overflow: hidden;
  }
  .bt_deco_pane a {
    margin: auto;
    border: 1px solid #fff;
    padding: 3% 5%;
    text-align: center;
    text-decoration: none;
    font-size: 18px;
    line-height: 1em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
    color: #fff;
    position: relative;
    overflow: hidden;
  }
  .bt_deco_pre a {
    margin: auto;
    border: 1px solid #fff;
    padding: 3% 5%;
    text-align: center;
    text-decoration: none;
    font-size: 18px;
    line-height: 1em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
    color: #fff;
    position: relative;
    overflow: hidden;
  }
  .title {
    width: 80%;
    font-size: 20px;
    line-height: 1.5em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
    text-align: center;
    padding: 15px 0;
    margin: 4% 10%;
    border-bottom: 1px solid #3e3a39;
  }
  .title_showroom {
    width: 80%;
    font-size: 20px;
    line-height: 1.5em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
    text-align: center;
    padding: 15px 0;
    margin: 4% 10%;
    border-bottom: 1px solid #3e3a39;
  }
  .lead {
    font-size: 20px;
    line-height: 1.5em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  }
  .lead_s {
    font-size: 18px;
    line-height: 30px;
    letter-spacing: -0.05em;
    text-align: center;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  }
  .lead_l {
    font-size: 20px;
    line-height: 36px;
    letter-spacing: -0.05em;
    text-align: center;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
    margin: 0 0 20px 0;
  }
  .lead_l_pane {
    font-size: 20px;
    line-height: 36px;
    letter-spacing: -0.05em;
    text-align: center;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
    margin: 0 0 20px 0;
  }
  /*　TOP

----------------------------------------------------------*/
  .mid_navi {
    display: none;
    margin: 30px auto 120px auto;
    font-size: 16px;
    line-height: 2em;
    text-align: center;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  }
  .top_title {
    width: 70%;
    margin: 5% 15%;
  }
  .top_title_aa {
    width: 100%;
    margin-top: 0;
    margin-bottom: 20px;
    margin-left: 10px;
  }
  .top_comm_w, .top_comm {
    width: 80%;
    margin: 10% 10% 10% 10%;
    font-size: 16px;
    line-height: 26px;
    text-align: left;
  }
  .top_sect01 {
    width: 100%;
    height: auto;
    padding: 5% 0;
    overflow: hidden;
    position: relative;
  }
  .top_sect01 img {
    position: absolute;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    top: 0;
    left: 0;
    z-index: 1;
  }
  .top_sect01_aa {
    width: 100%;
    height: auto;
    padding: 5% 0;
    overflow: hidden;
    position: relative;
  }
  .top_sect01_aa img {
    position: absolute;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
    top: 0;
    left: 0;
    z-index: 1;
  }
  .top_sect_in {
    position: relative;
    width: 90%;
    padding: 6% 5%;
    font-size: 16px;
    line-height: 26px;
    text-align: left;
    color: #fff;
    top: 0;
    z-index: 2;
  }
  .top_sect_in .lead {
    margin: 0 auto 5% auto;
  }
  .top_sect_in .bt {
    width: 60%;
    margin: 6% 15% 0 15%;
    padding: 3% 5%;
    font-size: 18px;
    line-height: 1em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  }
  .top_sect_in .bt_pre {
    width: 60%;
    margin: 6% 15% 0 15%;
    padding: 3% 5%;
    font-size: 18px;
    line-height: 1em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  }
  .top_sect02 {
    width: 100%;
    padding: 6% 0;
    background-color: #e3e1e5;
    margin: 8% auto 0 auto;
  }
  .top_sect03 {
    width: 100%;
    padding: 6% 0;
    background-color: #e3e1e5;
    background-image: url(../img/top/img_04_back.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    margin: 8% auto 0 auto;
  }
  .top_sect_in2 {
    width: 96%;
    margin: 0 2%;
  }
  .top_sect_in2 .img {
    text-align: center;
    width: 100%;
    height: auto;
    /*	overflow: hidden; */
    /*	position: relative; */
    /*	float: right; */
    /*	background-image: url(../img/top/img_03.png); 

	background-repeat: no-repeat;

	background-position: center;

	background-size: auto 100%; */
  }
  .top_sect_in2 .img img {
    width: auto;
    max-width: 100%;
    height: auto;
    position: static;
    min-height: auto;
    min-width: auto;
    /* position: absolute;

	min-width: 100%; 

  	min-height: 100%;

	width: auto;

  	height: 100%;

	top: 0; 

	left: -15%;

  	z-index: 1; */
  }
  .top_sect_in2 .left {
    width: 100%;
    padding: 6% 0 0 0;
    float: left;
  }
  .top_sect_in2 .lead {
    margin: 0 auto 6% auto;
  }
  .top_sect_in2 .text {
    width: 86%;
    margin: 0 7% 6% 7%;
    font-size: 18px;
    line-height: 32px;
    text-align: left;
  }
  .top_sect_in2 .left .bt a {
    width: 60%;
    margin: 6% 15% 0 15%;
    padding: 3% 5%;
    font-size: 18px;
    line-height: 1em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
    background-image: url(../img/common/link_icon.png);
    background-repeat: no-repeat;
    background-position: 80% center;
    border: 2px solid #3e3a39;
  }
  .top_sect_in2 .name {
    font-size: 22px;
    text-align: center;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
  }
  .top_sect_in2 .name span {
    font-size: 18px;
    padding-right: 1em;
  }
  .top_appendix {
    text-align: left;
  }
  /*　コンクリート打ち放し調/杉板浮造り調

----------------------------------------------------------*/
  .sect_01 {
    width: 100%;
    height: auto;
    position: relative;
  }
  .sect_01_in {
    width: 100%;
    height: 250px;
    overflow: hidden;
    position: relative;
    float: left;
    margin: 0 0 5% 0;
  }
  .sect_01_in img {
    position: absolute;
    min-width: 100%;
    min-height: 100%;
    width: 100%;
    height: auto;
    top: 0;
    left: 0;
    margin: 0 0 0 0;
    z-index: -1;
  }
  .sect_01_in .bt_l {
    width: 80%;
    position: absolute;
    right: 10%;
    bottom: 12%;
    z-index: 2;
  }
  .sect_01_in .bt_r {
    width: 80%;
    position: absolute;
    left: 10%;
    bottom: 12%;
    z-index: 2;
  }
  .sect_02 {
    width: 100%;
    height: 360px;
    overflow: hidden;
    position: relative;
    margin: 0 0 5% 0;
  }
  .sect_02 img {
    position: relative;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: 100%;
    top: 0;
    left: 0;
    z-index: -1;
    margin: 0 0 0 0;
  }
  .bt_m {
    width: 80%;
    position: absolute;
    left: 10%;
    bottom: 8%;
    margin-left: 0;
    z-index: 2;
  }
  .sect_03 {
    width: 100%;
    height: auto;
    overflow: hidden;
    position: relative;
    margin: 0 0 5% 0;
  }
  .sect_03 img {
    position: relative;
    min-width: 100%;
    min-height: auto;
    width: 100%;
    height: auto;
    top: 0;
    left: 0;
    z-index: -1;
  }
  .text_wrap {
    position: relative;
    width: 100%;
    left: 0;
    top: 0;
    z-index: 3;
    margin: 0 0 5% 0;
  }
  .text_wrap .text_box {
    margin: auto;
    font-size: 14px;
    line-height: 24px;
    text-align: left;
    color: #000;
  }
  .concrete_sect_01 {
    width: 80%;
    padding-top: 5%;
  }
  .concrete_sect_03 {
    width: 80%;
    padding-top: 10%;
  }
  .concrete_sect_04 {
    width: 80%;
    padding-top: 10%;
  }
  .sugiita_sect_01 {
    width: 80%;
    padding-top: 5%;
  }
  .sugiita_sect_01b {
    width: 80%;
    padding-top: 5%;
  }
  .sugiita_sect_02 {
    width: 80%;
    padding-top: 10%;
  }
  .sugiita_sect_03 {
    width: 80%;
    padding-top: 10%;
  }
  .sugiita_sect_04 {
    width: 80%;
    padding-top: 10%;
  }
  .concrete_cont {
    width: 100%;
    background-color: #e0dee2;
    background-image: url(../img/concrete/cont_back.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% auto;
    padding: 10% 0 5% 0;
    font-size: 14px;
    line-height: 24px;
  }
  .sugiita_cont {
    width: 100%;
    background-color: #e0dee2;
    background-image: url(../img/sugiita/cont_back.jpg);
    background-repeat: no-repeat;
    background-position: center top;
    background-size: 100% auto;
    padding: 10% 0 5% 0;
    font-size: 14px;
    line-height: 24px;
  }
  .cont_in {
    width: 96%;
    margin: 0 2%;
  }
  .cont_in .top_text {
    width: 90%;
    padding: 0 5% 0 5%;
    margin: 0 0 8% 0;
    font-size: 14px;
    line-height: 24px;
    text-align: left;
  }
  .cont_in .top_text .lead {
    margin: 20% 0 2% 0;
  }
  .cont_in .img_title {
    width: 80%;
    font-size: 20px;
    line-height: 1.5em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
    text-align: center;
    padding: 2% 0;
    margin: 4% 10%;
    border-bottom: 1px solid #3e3a39;
  }
  .cont_contact {
    width: 90%;
    margin: 0 5% 7% 5%;
  }
  .cont_contact table {
    border-collapse: separate;
    border-spacing: 0 0;
    width: 100%;
  }
  .cont_contact th {
    width: 96%;
    padding: 2% 2% 2% 2%;
    font-size: 14px;
    line-height: 24px;
    text-align: left;
    vertical-align: top;
    background-color: #e0dee2;
    float: left;
  }
  .cont_contact td {
    width: 96%;
    padding: 2% 2% 2% 2%;
    text-align: left;
    float: left;
    font-size: 14px;
    line-height: 24px;
  }
  .cont_contact .comm {
    width: 90%;
    margin: 0 5%;
    font-size: 14px;
    line-height: 24px;
    text-align: left;
  }
  /*　gallery

----------------------------------------------------------*/
  .page_title {
    width: 80%;
    font-size: 20px;
    line-height: 1.5em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
    text-align: center;
    padding: 5px 0 15px 0;
    margin: 2% 10%;
    border-bottom: 1px solid #fff;
    color: #fff;
  }
  .page_comm {
    width: 80%;
    margin: auto;
    font-size: 12px;
    line-height: 20px;
    text-align: center;
    color: #fff;
  }
  .page_comm.pane {
    width: 84%;
    margin: auto;
    font-size: 12px;
    line-height: 20px;
    text-align: center;
    color: #fff;
  }
  .gallery .head_img {
    padding: 1% 0 4% 0;
    background-image: url(../img/gallery/head_img.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    overflow: hidden;
  }
  .gallery_tab {
    width: 80%;
    margin: 50% 8%;
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
    text-align: center;
    padding: 5% 2%;
  }
  .gallery_tab .bt {
    width: 90%;
    margin: 0 5%;
  }
  .gallery_tab_pane {
    width: 80%;
    margin: 50% 8%;
    background-color: rgba(0, 0, 0, 0.6);
    color: #fff;
    text-align: center;
    padding: 5% 2%;
  }
  .gallery_tab_pane .bt {
    width: 90%;
    margin: 0 5%;
  }
  .gallery_sect_01 {
    background-image: url(../img/gallery/img_01.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    overflow: hidden;
  }
  .gallery_sect_02 {
    background-image: url(../img/gallery/img_01.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    overflow: hidden;
  }
  /******************ビフォー　アフター****************************/
  .gallery_inline {
    width: 80%;
    margin: 0 auto;
    font-size: 12px;
    line-height: 18px;
  }
  .gallery_inline .img {
    width: 100%;
    margin: 10% 0 30% 0;
    position: relative;
  }
  .gallery_inline .img img {
    margin-bottom: 5%;
  }
  .gallery_inline .img_sub {
    width: 80%;
    height: auto;
    margin: 0;
    position: absolute;
    top: 10%;
    left: -5%;
    z-index: 2;
    display: none;
  }
  .gallery_bt {
    border: 1px solid #fff;
    padding: 3% 5%;
    text-align: center;
    text-decoration: none;
    font-size: 18px;
    line-height: 1em;
    font-family: "ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "serif";
    color: #fff;
    display: block;
    width: 70%;
    position: absolute;
    bottom: -60px;
    left: 10%;
    z-index: 3;
    overflow: hidden;
  }
  .gallery_bt::after {
    position: absolute;
    /*z-index: -1;*/
    display: block;
    content: '';
    top: 100%;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.3);
    left: 0;
  }
  .gallery_bt:hover::after {
    animation: anim_btn_color2 .3s ease forwards;
  }
  .gallery_bt:hover + .img_sub {
    animation: anim_btn_img 1.5s ease forwards;
    display: block;
  }
  @keyframes anim_btn_color2 {
    0% {
      top: 100%;
    }
    100% {
      top: 0;
    }
  }
  @keyframes anim_btn_img {
    0% {
      opacity: 0;
    }
    100% {
      opacity: 1;
    }
  }
  /*　設計事務所様へ

----------------------------------------------------------*/
  .design .head_img {
    padding: 1% 0 4% 0;
    background-image: url(../img/design/head_img.jpg);
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
    overflow: hidden;
  }
  .design .text_wrap {
    position: absolute;
    width: 96%;
    left: 2%;
    top: 10%;
    z-index: 3;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.03em;
    text-align: center;
    color: #fff;
    padding-bottom: 50px;
  }
  .design .text_wrap_pane {
    position: absolute;
    width: 96%;
    left: 2%;
    top: 10%;
    z-index: 3;
    font-size: 14px;
    line-height: 24px;
    letter-spacing: -0.03em;
    text-align: center;
    color: #fff;
    padding-bottom: 50px;
    background-color: rgba(0, 0, 0, 0.5);
  }
  .design .sect_01 {
    width: 100%;
    height: auto;
    position: relative;
  }
  .design .sect_01_in {
    width: 100%;
    height: 300px;
    overflow: hidden;
    position: relative;
    float: left;
    margin: 0 0 5% 0;
  }
  .design .sect_01_in img {
    position: absolute;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: 100%;
    top: 0;
    left: 0;
    margin: 0 0 0 0;
    z-index: -1;
  }
  .design .sect_01_in .bt_l {
    width: 80%;
    position: absolute;
    right: 10%;
    bottom: 12%;
    z-index: 2;
  }
  .design .sect_01_in .bt_r {
    width: 80%;
    position: absolute;
    left: 10%;
    bottom: 12%;
    z-index: 2;
  }
  .design .wrap {
    height: 700px;
    position: relative;
  }
  /*　会社概要

----------------------------------------------------------*/
  /*.company #contents {

	background-image: url(../img/company/img_01.jpg);

	background-repeat: no-repeat;

	background-position: top center;

	background-size: cover;

	padding: 1px 0 5px 0;

}*/
  .map_title {
    background-image: url(../img/company/arrow.png);
    background-repeat: no-repeat;
    background-position: center bottom;
    background-size: 8% auto;
    padding-bottom: 1px;
  }
  .comp_table {
    width: 90%;
    margin: 0 5% 7% 5%;
  }
  .comp_table table {
    border-collapse: separate;
    border-spacing: 0 0;
    width: 100%;
  }
  .comp_table th {
    width: 96%;
    padding: 2% 2%;
    font-size: 14px;
    line-height: 24px;
    text-align: left;
    background-color: #e3e1e5;
    float: left;
  }
  .comp_table td {
    width: 96%;
    font-size: 14px;
    line-height: 24px;
    padding: 2% 2% 2% 2%;
    text-align: left;
    float: left;
  }
  .comp_map {
    width: 100%;
    height: 200px;
    margin: 0 auto 3% auto;
  }
  .news01 {
    width: 100%;
  }
  .news01 li {
    float: none;
    width: 100%;
    margin: 10px 0;
    text-align: center;
  }
  .com-slid {
    width: 100%;
  }
  .sp-pad20 {
    padding: 0 20px;
  }
  .sp-mar20 {
    margin: 0 auto 10px;
  }
  .com-slid li {
    float: none;
    width: 100%;
    text-align: center;
    padding: 0 20px 20px 20px;
  }
  .sugi_reia {
    width: 100%;
  }
  .hyouka_a p {
    font-size: 14px;
    text-align: left;
    padding: 0 20px;
  }
  .sugi_reia li {
    float: none;
    width: 100%;
    margin: 10px 0;
    text-align: center;
  }
  .sugi_reia_b {
    width: 100%;
  }
  .sugi_reia_b li {
    float: none;
    width: 100%;
    margin: 10px 0;
    text-align: center;
  }
  .sugi_reia_mi {
    width: 100%;
  }
  .sugi_reia_mi li {
    float: none;
    width: 100%;
    margin: 10px 0;
    text-align: center;
    font-size: 14px;
  }
  .sugi_reia_mi.img_cen {
    float: none;
    width: 100%;
    margin: 10px 0;
    text-align: center;
    font-size: 14px;
  }
  .sugi_reia_mi.img_cen li img {
    max-width: 280px;
  }
  .sugi_reia_mib {
    width: 100%;
  }
  .sugi_reia_mib li {
    float: none;
    width: 100%;
    margin: 10px 0;
    text-align: center;
    font-size: 14px;
  }
  .sugi_pane {
    width: 100%;
  }
  .sugi_pane li {
    float: none;
    width: 100%;
    margin: 10px 0;
    text-align: center;
  }
  .sugi_pane li.aaa {
    float: none;
    width: 100%;
    margin: 10px 0;
    text-align: center;
  }
  .sugi_pane li.bbb {
    float: none;
    width: 100%;
    margin: 10px 0;
    text-align: center;
  }
  .show_link {
    margin-top: 0;
    padding-top: 0;
  }
  /*　お問い合わせ

----------------------------------------------------------*/
  .head_toi {
    padding-top: 10%;
  }
  .contact #contents {
    background-image: url(../img/contact/back.jpg);
    background-repeat: no-repeat;
    background-position: top center;
    background-size: cover;
    padding: 1px 0;
  }
  .contact_tel {
    width: 80%;
    margin: 3% 10%;
    font-size: 14px;
    line-height: 20px;
    text-align: center;
  }
  .contact_name {
    font-size: 20px;
    text-align: center;
    margin: auto;
    color: #fff;
  }
  .contact_time {
    width: 90%;
    margin: 0 0 5% 0;
    padding: 0 5% 0 5%;
    font-size: 14px;
    line-height: 24px;
    text-align: center;
    color: #fff;
  }
  .contact_table .comm {
    width: 80%;
    margin: 3% 10%;
    font-size: 14px;
    line-height: 24px;
    text-align: left;
  }
  .contact_table {
    padding: 0;
    margin: 3% auto;
    padding: 5% 0;
    color: #fff;
  }
  .contact_table table {
    width: 90%;
    margin: 0 5%;
  }
  .contact_table th {
    width: 96%;
    padding: 2% 2%;
    font-size: 14px;
    line-height: 24px;
    text-align: left;
    vertical-align: top;
    float: left;
    border: 1px solid #fff;
  }
  .catalog_form .contact_table th span {
    font-size: 12px;
  }
  .contact_table td {
    font-size: 14px;
    line-height: 24px;
    width: 96%;
    padding: 2% 2%;
    text-align: left;
    float: left;
  }
  .submit_btn {
    width: 70%;
    margin: 3% 15% 3% 15%;
    font-size: 22px;
    line-height: 1em;
    padding: 5% 0;
    text-align: center;
    color: #fff;
    background-color: #cf0000;
    border: none;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    display: block;
    position: relative;
    overflow: hidden;
  }
  .submit_btn.a {
    width: 70%;
    margin: 3% 15% 3% 15%;
    font-size: 22px;
    line-height: 1em;
    padding: 5% 0;
    text-align: center;
    color: #fff;
    background-color: #303030;
    border: none;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    display: block;
    position: relative;
    overflow: hidden;
  }
  .submit_btn::after {
    position: absolute;
    /*z-index: -1;*/
    display: block;
    content: '';
    top: 100%;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.3);
    left: 0;
  }
  .submit_btn:hover::after {
    animation: anim_btn_color .5s ease;
  }
  .submit_btn:hover {
    cursor: pointer;
  }
  .catalog_txt {
    text-align: left;
    width: 90%;
    font-size: 12px;
    line-height: 180%;
  }
  .return_btn {
    width: 70%;
    margin: 3% 15% 3% 15%;
    font-size: 22px;
    line-height: 1em;
    padding: 5% 0;
    text-align: center;
    color: #fff;
    background-color: #cf0000;
    border: none;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    display: block;
    position: relative;
    overflow: hidden;
  }
  .return_btn::after {
    position: absolute;
    /*z-index: -1;*/
    display: block;
    content: '';
    top: 100%;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.3);
    left: 0;
  }
  .return_btn:hover::after {
    animation: anim_btn_color .5s ease;
  }
  .return_btn:hover {
    cursor: pointer;
  }
  .confirm_btn {
    width: 70%;
    margin: 3% 15% 3% 15%;
    font-size: 22px;
    line-height: 1em;
    padding: 5% 0;
    text-align: center;
    color: #fff;
    background-color: #cf0000;
    border: none;
    -webkit-border-radius: 6px;
    -moz-border-radius: 6px;
    border-radius: 6px;
    display: block;
    position: relative;
    overflow: hidden;
  }
  .confirm_btn::after {
    position: absolute;
    /*z-index: -1;*/
    display: block;
    content: '';
    top: 100%;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.3);
    left: 0;
  }
  .confirm_btn:hover::after {
    animation: anim_btn_color .5s ease;
  }
  .confirm_btn:hover {
    cursor: pointer;
  }
  .form_style {
    width: 96%;
    height: auto;
    padding: 2% 2%;
    vertical-align: middle;
    font-size: 16px;
  }
  .form_style_s {
    width: 96%;
    height: auto;
    padding: 2% 2%;
    vertical-align: middle;
    font-size: 16px;
  }
  .form_style_tarea {
    width: 96%;
    height: 160px;
    padding: 2% 2%;
    font-size: 16px;
  }
  /* ===========横幅600px以下================ */
  @media screen and (max-width: 600px) {
    .catalog_each {
      display: block;
    }
    .catalog_each_left {
      margin: 0 auto;
    }
    .catalog_each_right {
      width: 80%;
      margin: 0 auto;
    }
    .catalog_each_right a {
      font-size: 14px;
    }
  }
  /* パソコンで見たときは"pc"のclassがついた画像が表示される */
  .pc {
    display: block !important;
  }
  .sp {
    display: none !important;
  }
  /* スマートフォンで見たときは"sp"のclassがついた画像が表示される */
  @media only screen and (max-width: 767px) {
    .pc {
      display: none !important;
    }
    .sp {
      display: block !important;
    }
    .com-room .bx-wrapper .bx-pager.bx-default-pager a {
      width: 10px;
      height: 10px;
      margin: 0 6px;
    }
    .com-room .bx-wrapper .bx-pager {
      bottom: -35px;
    }
  }