@charset "utf-8";
/*==========================================
 共有
 ===========================================*/
* {
    -webkit-box-sizing: border-box;
       -moz-box-sizing: border-box;
         -o-box-sizing: border-box;
        -ms-box-sizing: border-box;
            box-sizing: border-box;
}
body {
  font-family: "游ゴシック体", "Yu Gothic", YuGothic, sans-serif;
}
body, html {
  width: 100%;
  height: 100%;
}
a {
  text-decoration: none;
  cursor: pointer;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
}
a:hover {
  text-decoration: none;
}
.fwb {
  font-weight: bold;
}
img {
  max-width: 100%;
  height: auto;
}
.yumincho {
  font-family: "Yu Mincho", "YuMincho";
}
.anton {
  font-family: 'Anton', sans-serif;
}
.m_plus_1p {
font-family: 'M PLUS 1p', sans-serif;
}
.none {
  display: none;
}
.sp_none {
  display: block;
}
.pc_none {
  display: none;
}
.br {
  display: inline-block;
  padding: 0;
}
.flex {
  display: flex;
}
.pc_flex {
  display: flex;
}
.sp_flex {
  display: inline-block;
}
@media screen and (max-width: 768px){
  .sp_none {
    display: none;
  }
  .pc_none {
    display: block;
  }
  .pc_flex {
    display: inline-block;
  }
  .sp_flex {
    display: flex;
  }
}
.wrap01 {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
}
.wrap02 {
  width: 100%;
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 3%;
}
.relative {
  position: relative;
}
/*==========================================
 ヘッダー
===========================================*/
.top_h1{
  text-align: center;
}
.top_h1 {
  padding: 20px 0;
}
.top_bg {
  background: url(../img/img_03.jpg)
}
.top_h1 a:hover {
  opacity: 0.7;
}
@media screen and (max-width:960px) {
  .top_h1 {
    padding: 20px 20% 20px 0;
  }
}
@media screen and (max-width: 768px) {
  .top_h1 {
    padding: 20px 0;
  }
}
/*==========================================
 ヘッダー　お問い合わせ
===========================================*/
.top_add {
  color: #fff;
  font-family: "Yu Mincho", "YuMincho";
  background: #414141;
  font-weight: bold;
  position: absolute;
  top: 0;
  right: 0;
  z-index: 10;
  margin: 0 1% 0 0;
  padding: 20px 20px;
}
.add_01 {
  font-size: 15px;
  font-weight: 500;
  letter-spacing: 3px;
  line-height:1.4em;
}
.add_02 {
  font-size: 15px;
  font-weight: 500;
  line-height:1.4em;
  margin: 4px 0 10px 0;
}
.add_03 {
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 3px;
  line-height:1.4em;
  text-align: center;
}
.add_03s {
  margin-right:8px; 
}
.add_04 {
  font-size: 18px;
  font-weight: 500;
  letter-spacing: 3px;
}
.add_04a {
  color: #414141;
  font-size: 18px;
  background: #eeeeee;
  padding: 10px 30px;
  margin-top: 16px;
  display: inline-block;
  font-weight: 500;
  transition: .3s all;
  text-decoration: none;
}
.add_04a:hover {
  opacity: 0.7;
}
.add_04s {
  margin-right:14px; 
}

@media screen and (min-width:768px) {
.add_02t a {
  cursor: default;
  pointer-events: none;
}
}
@media screen and (max-width: 768px) {

}
/*==========================================
 グローバルナビゲーション
===========================================*/
.pc_menu {
  max-width: 75%;
  width: 100%;
}
.pc_menu_li {
  /*flex-basis: 16%;*/
  margin-right: 3%;
}

.pc_menu_a {
  color: #fff;
  font-size: 18px;
font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  padding: 20px 20px;
  display: inline-block;
  letter-spacing: 0.1em;
  line-height: 1.5;
  position: relative;
}

.pc_menu_a::after{
position: absolute;
bottom: 15px;
left: 50%;
content: '';
width: 0;
height: 3px;
background-color: #fff;
transition: .3s;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.pc_menu_a:hover::after{
width: 60px;
}
li.pc_menu_li a {
  text-decoration: none;
}
@media screen and (max-width:960px) {
  .pc_menu_li {
  margin-right: 1%;
}
.pc_menu_a {
  font-size: 16px;
  padding: 20px 10px;

}
  
}
/*==========================================
 ヘッダー　スライダー
===========================================*/
#slide {
  opacity: 0;
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 1140px;
  margin: 0 auto 0px;
  -webkit-transition: all 0.0s;
  transition: all 0.0s;
}
.sp-arrows {
  z-index: 9999;
}
.sp-previous-arrow::before {
  border: 1px #ccc solid;
  border-bottom: none;
}
.sp-previous-arrow::after {
  border: 1px #ccc solid;
  border-top: none;
}
.sp-next-arrow::before {
  border: 1px #ccc solid;
  border-bottom: none;
}
.sp-next-arrow::after {
  border: 1px #ccc solid;
  border-top: none;
}
.sp-thumbnail-container {
  padding: 16px 1% 0 0%;
}
.slide_fig {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  z-index: 1000;
}
/*==========================================
 中ページ 共通
===========================================*/
.ttl_h1 {
  font-size : 28px;
  font-weight: bold;
  text-align: center;
  font-family: "Yu Mincho", "YuMincho";
  margin: 80px 0 40px 0;
}
.breadcrumb {
  color: #000;
  font-size: 14px;
  margin: 40px 0 0 2%;
}
.breadcrumb a {
  color: #000;
}
.breadcrumb a:hover {
  color: #999;
}
.breadcrumb_s {
    margin: 0 10px;
}

/*==========================================
 コンテンツ共通
===========================================*/
.sec_bg{
  background: url(../img/img_05.jpg);
}
/*==========================================
 コンテンツ共通 ボタン
===========================================*/
.tp_sec_btn{
  text-align: center;
  
}
.tp_sec_btn a{
  display: inline-block;
padding: 14px 4%;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  letter-spacing: 0.1em;
  background: #fff;
  border: 1px solid #000;
  color: #000;
}
.tp_sec_btn a:hover{
background: #000;
  color: #fff;
}
/*==========================================
 コンテンツ共通 ボタン hover
===========================================*/
/* Flashing */
.hover13 a{
  
}
.hover13 a:hover{
	opacity: 1;
	-webkit-animation: flash 1.5s;
	animation: flash 1.5s;
}
@-webkit-keyframes flash {
	0% {
		opacity: .4;
	}
	100% {
		opacity: 1;
	}
}
@keyframes flash {
	0% {
		opacity: .4;
	}
	100% {
		opacity: 1;
	}
}
/*==========================================
 メインコンテンツ 共通見出し
===========================================*/
.tp_sec_ttl{
  position: relative;
  text-align: center;
  font-size: 24px;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  letter-spacing: 0.1em;
  line-height: 1.3;
  font-weight: bold;
  margin: 30px 0 45px;

}
.tp_sec_ttl::before{
content: "";
  position: absolute;
  top:43%;
  left: 0;
  width: 41%;
  height: 1px;
  background: #000;
  z-index: 0;
}
.tp_sec_ttl::after{
content: "";
  position: absolute;
  top: 43%;
  right: 0;
  width: 41%;
  height: 1px;
  background: #000;
  z-index: 0;
}
.tp_sec_ttl_span{
  display: inline-block;
  position: relative;
  z-index: 0;
    -webkit-writing-mode: vertical-rl;
      -ms-writing-mode: tb-rl;
          writing-mode: vertical-rl;
}
.tp_sec_ttl_span::before{
content: "";
  position: absolute;
  top: 50%;
left: 50%;
-webkit-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
width: 65px;
height: 65px;
  background: url(../img/img_21.png) no-repeat center center;
  z-index: -100;
}
.tp_sec_ttl_span02{
  display: inline-block;
  text-indent: 1em;
}
/*==========================================
 フッター
===========================================*/
.footer_bg{
    background: #1b1b1b;
  color: #fff;
  padding: 50px 0;
}
.footer_area{
font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  font-weight: bold;
  letter-spacing: 0.1em;
}
.footer_ttl{
  margin-bottom: 30px;
  padding: 0 2%;
  line-height: 1.4;
}
.footer_flex_a{
  display: flex;
  width: 100%;
  padding: 0 2% 30px;
  margin-bottom: 20px;
  border-bottom: 1px solid #fff;
  justify-content: space-between;
  
}
.footer_flex_b{
  display: flex;
  flex-basis: 76%;
  width: 100%;
  align-items: center;
}
.footer_flex_01{
  margin-right: 40px;
}
.footer_flex_02{
  font-size: 18px;
  letter-spacing: 0.1em;
  font-weight: bold;
  margin-right: 40px;
}
.footer_post{
  margin-bottom: 20px;
}
.footer_address{
  line-height: 1.5;
}
.footer_flex_03{
  flex-basis: 24%;
  width: 100%;
  max-width: 260px;
}
.footer_tel{
  font-size: 24px;
  letter-spacing: 0.2em;
  margin-bottom: 20px;
}
.footer_tel a{
display: inline-block;
  color: #fff;
}
.footer_contect_btn{

}
.footer_contect_btn a{
  display: inline-block;
  font-size: 18px;
  letter-spacing: 0.1em;
  color: #000;
  background: #fff;
  border: 1px solid #fff;
  padding: 6px 2%;
width: 100%;
text-align: center;
}
.footer_contect_btn a:hover{    
  color: #fff;
  background: #000;
}
.footer_siteList_ul{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
}
.footer_siteList_li{
  
}
.footer_siteList_li a{
  display: inline-block;
  color: #fff;
  padding: 10px 16px;
  position: relative;
  text-decoration: none;
}
.footer_siteList_li a::after{
position: absolute;
bottom: 3px;
left: 50%;
content: '';
width: 0;
height: 3px;
background-color: #fff;
transition: .3s;
-webkit-transform: translateX(-50%);
transform: translateX(-50%);
}
.footer_siteList_li a:hover::after {
    width: 40px;
}
.footer_logo a:hover {
  opacity: 0.7;
}
@media screen and (min-width:768px) {
.footer_tel a {
  cursor: default;
  pointer-events: none;
}
}
@media screen and (max-width:768px) {
  .footer_flex_a{
    display: block;
    border-bottom: none;
    margin-bottom: 0;
  }
  .footer_flex_b{
    justify-content: center;
    margin-bottom: 30px;
  }
  .footer_flex_02{
    margin-right: 0;
  }
  .footer_flex_03{
    margin: 0 auto;
  }
  .footer_flex_01{
    margin-right: 0;
    margin-bottom: 30px;
  }
}
@media screen and (max-width:1120px) {
  .footer_tel {
    letter-spacing: 0.1em;
    text-align: center;
    font-size: 20px;
  }
}
@media screen and (max-width:768px) {
  .footer_siteList_ul {
    display: none;
  }
}
@media screen and (max-width:768px) {
  .footer_flex_b{
    display: block;
    text-align: center;
  }
}
/*==========================================
 コピーライト
===========================================*/
.copylight_area{
  text-align: center;
  background: url(../img/img_05.jpg);
  padding: 10px 0;
  font-family: "游明朝体", "Yu Mincho", YuMincho, "ヒラギノ明朝 ProN W6", "HiraMinProN-W6", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  letter-spacing: 0.1em;
  font-weight: bold;
}
.copylight_area small{
  font-size: 16px;

}
.copylight_area small a:hover{
  color: #999;
}
.copylight_area a{
  color: #000;
}
@media screen and (max-width:768px) {
  .copylight_area{
    padding-bottom: 65px;
  }
  .copylight_area small {
    font-size: 12px;
  }
}
/*==========================================
 受注アップコンテンツ
===========================================*/
/*住まいと建築の豆知識*/
.iframe_knowledge {
  width: 100%;
  height: 2400px;
  background: #fff;
}
@media screen and (max-width: 768px) {
  .iframe_knowledge {
    height: 2000px;
  }
}
/*省エネ住宅ポイント制度*/
.iframe_eco {
  width: 100%;
  height: 1900px;
  background: #fff;
}
@media screen and (max-width: 768px) {
  .iframe_eco {
    height: 2100px;
  }
}
/*住宅ローン減税＆住まい給付金*/
.iframe_loan {
  width: 100%;
  height: 2450px;
  border: none;
}
@media screen and (max-width: 768px) {
  .iframe_loan {
    height: 2500px;
  }
}
/*改正省エネ基準*/
.iframe_energy {
  width: 100%;
  height: 3500px;
  border: none;
}
@media screen and (max-width: 768px) {
  .iframe_energy {
    height: 4300px;
  }
}
/*ハウスドクター*/
.iframe_house {
  width: 100%;
  height: 2200px;
}
@media screen and (max-width: 768px) {
  .iframe_house {
    height: 2400px;
  }
}
/*太陽光発電システム*/
.iframe_solar {
  width: 100%;
  height: 3600px;
}
@media screen and (max-width: 768px) {
  .iframe_solar {
    height: 3600px;
  }
}
/*地元工務店の強み①（工務店で家を建てるメリット）*/
.iframe_strength1 {
  width: 100%;
  height: 2950px;
  border: none;
}
@media screen and (max-width: 768px) {
  .iframe_strength1 {
    height: 3300px;
  }
}
/*==========================================
 自社CMS
===========================================*/
/*一覧*/
h3.inner-tit {
  font-size: 20px;
  font-weight: bold;
  font-family: "Yu Mincho", "YuMincho";
  margin: 20px 0 10px 0;
}
#kaiso {
  margin: 0 2%;
}
#kaiso a {
  color: #000;
  text-decoration: none;
}
#kaiso a:hover {
  color: #999;
}
body .responsive-wrap .triple li div.img-box img:hover {
  opacity: 0.8;
  transition: .3s all;
}
@media screen and (max-width: 768px) {
  h3.inner-tit {
    font-size: 16px;
    margin: 10px 0 5px 0;
  }
}
/*詳細*/
.page_title_bg {
  font-size: 28px;
  font-weight: bold;
  text-align: center;
  font-family: "Yu Mincho", "YuMincho";
  margin: 80px 0 40px 0;
}
.Template-reform-detail-list-outer {
  width: 100%;
}
ul.single {
  width: 100%;
}
ul.third {
  width: 100%;
}
ul.third li:nth-child(1) {
  width: 31.33%;
  padding-right: 0;
  margin-right: 3%;
}
ul.third li:nth-child(2) {
  width: 31.33%;
  padding-right: 0;
  margin-right: 3%;
}
ul.third li:nth-child(3) {
  width: 31.33%;
}
.responsive-article {
  width: 100%;
  padding: 0 0 10px 0;
}
.responsive-article .single li div.img-box img:hover {
  transition: .3s all;
  opacity: 0.8;
}
.responsive-article img:hover {
  transition: .3s all;
  opacity: 0.8;
}
.itemText a {
  color: #000;
  text-decoration: underline;
}
.itemText a:hover {
  color: #999;
}
ul.second {
  width: 100%;
}
ul.second li:first-child {
  width: 50%;
}
ul.second li:last-child {
  width: 50%;
}
ul.fourth {
  width: 100%;
}
ul.fourth li:nth-child(1) {
  width: 25%;
}
ul.fourth li:nth-child(2) {
  width: 25%;
}
ul.fourth li:nth-child(3) {
  width: 25%;
}
ul.fourth li:nth-child(4) {
  width: 24%;
}


@media all and (-ms-high-contrast: none){
.responsive-wrap ul li h3.inner-tit {
	padding-top:8px;
}
}

/*==========================================
 三点リーダー
===========================================*/
.ellipsis {
  position: relative;
  overflow: hidden;
  line-height: 20px;
  height:1rem;
}

.ellipsis:before, .ellipsis:after {
  position: absolute;
  background: #292b27;
}

.ellipsis:before {
  content: "･･･";
  bottom: 0;
  right: 0;
  width:32px;
}

.ellipsis:after {
  content: "";
  width: 100%;
  height: 100%;
}