body {
  color: #683D18;
}

header {
    border-bottom: 5px solid #1B512D;
}


/*
mv
---------------------------------------------------*/
.mv {
  color: #fff;
}
.mv_wrap {
  display: flex;
}
.slider_blk {
  width: 60%;
  max-width: 100%;
  line-height: 0;
}
.slider_blk .slider img {
  width: 100%;
}
.slider {
  position: relative;
}
.slider .slide-prev {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 1.5rem;
  margin: auto;
  width: 15px;
  height: 15px;
  border-top: 2px solid #1B512D;
  border-right: 2px solid #1B512D;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
  z-index: 1;
  cursor: pointer;
  transition: .3s all;
}
.slider .slide-next {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 1.5rem;
  margin: auto;
  width: 15px;
  height: 15px;
  border-top: 2px solid #1B512D;
  border-right: 2px solid #1B512D;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  z-index: 1;
  cursor: pointer;
  transition: .3s all;
}
.slider .slide-prev:hover, .slider .slide-next:hover {
  border-top: 2px solid #fff;
  border-right: 2px solid #fff;
}
.catch_blk {
  background: url("../images/s_read_bg.jpg") no-repeat center / cover;
  width: 40%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-direction: column;
  text-align: center;
}
.catch_blk h2 {
  font-family: 'Noto Serif JP';
  font-size: 2rem;
  margin-bottom: 1rem;
  font-weight: 700;
}
.catch_blk p {
  font-family: 'Noto Serif JP';
  line-height: 2.2;
  font-weight: 300;
}
.catch_blk .btn a {
  margin-top: 3rem;
  position: relative;
  font-weight: 700;
  color: #1B512D;
  background: #fff;
  display: inline-block;
  text-align: center;
  padding: 0.5rem 0;
  width: 280px;
  max-width: 90%;
  box-sizing: border-box;
  transition: ease .3s;
  box-shadow: rgba(0, 0, 0, 0.5) 2px 4px 8px;
  line-height: 1.6;
  letter-spacing: .065rem;
  border: 1px solid #fff;
}
.btn a:hover {
  background: #1B512D;
  color: #fff;
}
.btn a::after {
  position: absolute;
  content: '';
  width: 16px;
  height: 16px;
  background: url("../images/arrows_r_gr.svg") no-repeat center / 16px;
  top: 0;
  bottom: 0;
  right: 1rem;
  margin: auto;
}
.btn a:hover::after {
  background: url("../images/arrows_r.svg") no-repeat center / 16px;
  z-index: 5;
}
/*
施工事例
---------------------------------------------------*/
.re_ttl {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.4rem;
  color: #1B512D;
  text-align: center;
  line-height: 1.4;
  font-weight: 700;
  letter-spacing: .1em;
  margin: 0 auto;
}
.top_case {
  margin: 5rem 0;
}
.s_list_box .re_ttl {}
.re_ttl_sub {
  font-family: 'Noto Serif JP', serif;
  font-size: 1.1rem;
  font-weight: 700;
  padding-top: 2px;
  text-align: center;
  color: #1B512D;
  margin: 0 auto 20px;
}
.s_list_box {
  width: 100%;
  margin: 0 auto 4rem;
}
.s_list_box ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  margin-left: -2rem;
}
.s_list_box ul li {
  width: calc(100% / 4 - 2rem);
  margin-left: 2rem;
  box-sizing: border-box;
  margin-bottom: 2rem;
}
.s_list_box ul li a {
  color: #683D18;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  transition: .3s all ease;
}
.s_list_box ul li a:hover {
  opacity: .7;
}
.s_list_cate {
  margin-top: .5rem;
  background: #1B512D;
  color: #fff;
  padding: .15rem 1rem;
  font-size: .9rem;
}
.s_list_ttl {
  margin: .6rem 0 .3rem;
  font-size: 1.2rem;
  font-weight: 700;
}
.s_list_txt {
  font-size: .9rem;
  line-height: 1.3;
  font-weight: 400;
  height:40px;
}
.s_list_box img{
object-fit:cover;
width:100%;
height:200px;
font-family: 'object-fit:cover;';
cursor: pointer;
transition:.3s;
margin:0 auto;
}


.detail_btn {
  text-align: center;
  margin: .6rem auto;
  position: relative;
  font-weight: 400;
  font-size: 0.9rem;
  background: #1B512D;
  color: #fff;
  display: inline-block;
  padding: .2rem 0;
  width: 100%;
  border: 1px solid #1B512D;
  border-radius: .3rem;
}
.more_btn {
  text-align: center;
  margin: 3rem auto 7rem;
}
.more_btn a {
  position: relative;
  background: #1B512D;
  color: #fff;
  display: inline-block;
  text-align: center;
  padding: .5rem 1.5rem .5rem 1rem;
  width: 300px;
  transition: ease .3s;
  box-shadow: rgba(0, 0, 0, 0.5) 2px 4px 8px;
  border: 1px solid #1B512D;
}
.more_btn a:hover {
  background: #fff;
  color: #1B512D;
}
.more_btn a::after {
  position: absolute;
  content: '';
  width: 16px;
  height: 16px;
  background: url("../images/arrows_r.svg") no-repeat center / 16px;
  top: 0;
  bottom: 0;
  right: 1rem;
  margin: auto;
}
.more_btn a:hover::after {
  background: url("../images/arrows_r_gr.svg") no-repeat center / 16px;
  z-index: 5;
}
/*
家づくりの流れ
---------------------------------------------------*/
.top_flow {
  padding: 3rem 0 4rem;
  background: #1B512D url("../images/s_flow_bg.jpg") no-repeat center / cover;
  background-blend-mode: multiply;
  text-align: center;
  color: #fff;
}
.top_flow .re_ttl {
  color: #fff;
}
.top_flow .subtxt {
  margin: 1rem auto 1.5rem;
}
.top_skbtn a {
  position: relative;
  font-weight: 700;
  color: #1B512D;
  background: #fff;
  display: inline-block;
  text-align: center;
  padding: 0.6rem 0;
  width: 280px;
  box-sizing: border-box;
  transition: .3s;
  box-shadow: rgba(0, 0, 0, 0.5) 2px 4px 8px;
  line-height: 1.6;
  letter-spacing: .065rem;
  border: 1px solid #fff;
  border-radius: .3rem;
}
.top_skbtn a:hover {
  background: #1B512D;
  color: #fff;
}
.top_skbtn a::after {
  position: absolute;
  content: '';
  width: 16px;
  height: 16px;
  background: url("../images/arrows_r_gr.svg") no-repeat center / 16px;
  top: 0;
  bottom: 0;
  right: 1rem;
  margin: auto;
}
.top_skbtn a:hover::after {
  background: url("../images/arrows_r.svg") no-repeat center / 16px;
  z-index: 5;
}
/*
FAQ
---------------------------------------------------*/
.top_faq {
  padding: 3rem 0 4rem;
  background: #D1DDD3;
  text-align: center;
}
.top_faq img {
  padding: 2rem 0 1.5rem;
  max-width: 60%;
}
/*
お問い合わせ
---------------------------------------------------*/
.contact {}
.con_btn a {
  background: #1B512D;
  color: #fff;
}
.con_btn a::after {
  background: url(../images/arrows_r.svg) no-repeat center / 16px;
}
.con_btn a:hover::after {
  background: url("../images/arrows_r_gr.svg") no-repeat center / 16px;
}
.con_btn a:hover span {
  color: #1B512D;
}
.con_btn a::before {
  background: #fff;
}
.contact .tel a {
  color: #fff;
}

.con_btn a:hover span::before{
	background:url("../images/mail_ico_gr.svg") no-repeat center / contain;
}


/*
コンテンツヘッダー
---------------------------------------------------*/
.s_head {
  background: url("../images/s_head_bg.png") no-repeat center / cover;
  padding:80px 0;
}
.s_head_box {
  background: #fff;
  color: #1B512D;
  width: 330px;
  text-align: center;
  margin: 0 auto;
  outline: 1px solid #fff;
  outline-offset: 5px;
  opacity: .9;
  line-height: 1.3;
  padding: .5rem 0 .6rem 0;
}
.s_head h2 {
  font-family: 'Noto Serif JP', serif;
  font-size: 2.4rem;
  font-weight: 700;
  letter-spacing: .1em;
}
.s_head .head_line {
  font-family: 'Noto Serif JP', serif;
  font-size: 1rem;
  font-weight: 700;
  display: flex;
  align-items: center;
  justify-content: center;
}
.head_line:before, .head_line:after {
  border-top: 1px solid;
  content: "";
  width: 1.5em;
  color: #1B512D;
}
.head_line:before {
  margin-right: .5em;
}
.head_line:after {
  margin-left: .5em;
}

/*
ページャー
---------------------------------------------------*/
.pagebar {
  margin-top: 30px;
  display: flex;
  justify-content: center;
}
.pagebar li a {
  text-decoration: none;
  color: #1B512D;
  display: inline-block;
  vertical-align: middle;
  width: 2em;
  height: 2em;
  border-radius: 50%;
  text-align: center;
  line-height: 1.8em;
  border:#1B512D 1px solid;
  box-sizing: border-box;
  margin: 0 .25em;
}
.pagebar li.this-page {
  background: #1B512D;
  color: #fff;
  display: inline-block;
  vertical-align: middle;
  width: 2em;
  height: 2em;
  border-radius: 50%;
  text-align: center;
  line-height: 1.8em;
  margin: 0 .25em;
}
.pagebar li.prev a, .pagebar li.next a {
  margin: 0 1em;
  width: auto;
  height: auto;
  border-radius: 0;
  border: none;
  font-weight: bold;
}
.pagebar li.prev a:hover, .pagebar li.next a:hover {
  background: none;
  color: #1B512D;
  opacity: .7;
}
.pagebar li a:hover {
  background: #1B512D;
  color: #fff;
}

/*
詳細
---------------------------------------------------*/
h3.s_detail_ttl{
text-align:center;
font-size:2.2rem;
font-weight:700;
}
.s_detail_sub{
text-align:center;
font-size:1.2rem;
}
.s_detail_body{
width:100%;
border-top:1px solid #683D18;
margin:20px 0;
padding:20px 0;
}

.s_detail_name:first-of-type{
	margin-top: 0;
}

.s_detail_name{
	font-weight: bold;
	margin: 20px 0 5px 0;
}

.s_detail_list dt {
  float: left;
}

.s_detail_list dd {
  margin: 0 0 .25em 6em;
}

.s_detail_list dd a {
	color: #683D18;
	text-decoration: underline;
}

.s_detail_list dd a:hover {
	text-decoration: none;
}

.slider_dt {
  position: relative;
  margin:0 0 3rem 0;
}
.slider_dt .slide-prev {
  position: absolute;
  top: 0;
  bottom: 0;
  left: 1.5rem;
  margin: auto;
  width: 15px;
  height: 15px;
  border-top: 2px solid #1B512D;
  border-right: 2px solid #1B512D;
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
  z-index: 1;
  cursor: pointer;
  transition: .3s all;
}
.slider_dt .slide-next {
  position: absolute;
  top: 0;
  bottom: 0;
  right: 1.5rem;
  margin: auto;
  width: 15px;
  height: 15px;
  border-top: 2px solid #1B512D;
  border-right: 2px solid #1B512D;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  z-index: 1;
  cursor: pointer;
  transition: .3s all;
}
.slider_dt .slide-prev:hover, .slider_dt .slide-next:hover {
opacity:.7;
}
.slick-img img{
margin:0 auto;
width:900px;
height:578px;
object-fit:contain;
font-family:'object-fit:contain;';
}
.s_detail_cap{
width:900px;
margin:.3rem auto;
font-size:.9rem;
line-height:1.4;
}
.thumbnail{
width:900px;
margin:0 auto 3rem;
}


.thumbnail-img img{
object-fit:cover;
width:168px;
height:168px;
font-family: 'object-fit:cover;';
cursor: pointer;
transition:.3s;
margin:0 auto;
}
.thumbnail-img img:hover{
opacity:.7;
}
@media screen and (max-width: 1440px) {}
@media screen and (min-width: 769px) {}
@media screen and (max-width: 768px) {
  .mv_wrap {
    flex-direction: column;
  }
  .slider_blk, .catch_blk {
    width: 100%;
  }
  .catch_blk {
    padding: 2rem 0 3rem;
  }
  .catch_blk h2 {
    font-size: 1.6rem;
    margin-bottom: 0.5rem;
  }
  .catch_blk p {
    padding: 0 2rem;
    text-align: justify;
    font-size: .8rem;
  }
  .catch_blk .btn a {
    margin-top: 2rem;
  }
  .btn a {
    width: 260px;
  }
  .btn a::after {
    right: 1rem;
  }
  .s_list_box ul {
    margin-left: -1rem;
  }
  .s_list_box ul li {
    width: calc(100% / 2 - 1rem);
    margin-left: 1rem;
	margin-bottom: 1rem;
  }
  .s_list_cate, .s_list_txt {
    font-size: .8rem;
  }
  .re_ttl {
    font-size: 1.9rem;
  }
  .s_list_ttl {
    font-size: 1rem;
  }
  .s_list_txt {
    font-size: .8rem;
	height:34px;
  }
  .top_flow .subtxt {
    font-size: .9rem;
  }
  .top_case {
  margin: 3rem 0;
}
.s_list_box img{
height:150px;
}

h3.s_detail_ttl{
font-size:1.7rem;
}
.s_detail_sub{
font-size:.9rem;
}
.s_detail_body{
font-size:.8rem;
}

	
.s_detail_cap{
width:100%;
font-size:.8rem;
line-height:1.3;
}
.thumbnail{
width:100%;
margin:0 auto 3rem;
}
.thumbnail-img img{
object-fit:cover;
width:80px;
height:80px;
}
.slider_dt {
  margin:0 0 1rem 0;
}
.slider_dt .slide-prev {
  position: absolute;
  top:-15%;
  bottom: 0;
  left: 1rem;
  margin: auto;
  width: 15px;
  height: 15px;
visibility:hidden;
}
.slider_dt .slide-next {
  position: absolute;
  top:-15%;
  bottom: 0;
  right: 1rem;
  margin: auto;
  width: 15px;
  height: 15px;
visibility:hidden;
}
.slick-img img{
margin:0 auto;
width:100%;
height:289px;
object-fit:contain;
font-family:'object-fit:contain;';
}

.more_btn {
  margin:1rem auto 2rem;
  font-size:.9rem;
}
.more_btn a {
  padding: .5rem 1.5rem .5rem 1rem;
  width:80%;
  }


/*
コンテンツヘッダー
---------------------------------------------------*/
.s_head {
  padding:50px 0;
}
.s_head_box {
  width: 260px;
  padding: .5rem 0 .6rem 0;
}
.s_head h2 {
  font-size:1.9rem;
}
.s_head .head_line {
  font-size: 1rem;
}
}
@media screen and (max-width: 480px) {
.s_head h2 {
  font-size:1.7rem;
}
.s_head .head_line {
  font-size:.9rem;
}
.catch_blk p {
    padding: 0 1.2rem;
    font-size: .8rem;
  }
.s_list_ttl {
font-size:.9rem;
line-height:1.2;
text-align:justify;
}


h3.s_detail_ttl{
font-size:1.4rem;
}
.slick-img img{
margin:0 auto;
width:100%;
height:200px;
object-fit:contain;
font-family:'object-fit:contain;';
}
.thumbnail-img img{
object-fit:cover;
width:55px;
height:55px;
}
}