/*::::::::::::::::::::  top  ::::::::::::::::::::*/
/* swiper-slide */
.topmain {
  z-index: 1;
  height: 80rem;
  width: 60rem;
}


.swiper-slide {
  text-align: center;
  overflow: hidden;
}

.top-main .n1 .slide-media {background: url("../img/top-slide-mb1.jpg") no-repeat; background-size: cover;}
.top-main .n2 .slide-media {background: url("../img/top-slide-mb2.jpg") no-repeat; background-size: cover;}
.top-main .n3 .slide-media {background: url("../img/top-slide-mb3.jpg") no-repeat; background-size: cover;}
.top-main .slide-media {height: 70rem}



 .slide-copy {
  position: absolute;
  bottom: 0;
  left: 0;
  color: #fff;
  width: 100%;
  height: 22rem;
  background: url("../img/top-slide-shade-mb.png") no-repeat center bottom;
  background-size: 100% 22rem;
  font-size: 3.6rem;
  line-height: 1.3;
  padding-top: 10rem;
  font-family: kozuka-gothic-pro, sans-serif;
  font-weight: 200;
  font-style: normal;
}

.swiper-container-mb {
  display: block; height: 80rem; width: 100%;
}

.swiper-pagination  {
display: none;
}

/*===== Tablet-PC =====*/
@media (min-width: 768px) {
.topmain {
  width: 100%; height: 70rem;
}
  .swiper-container {
    width: 100%;
    min-width: 112rem;
    height: 70rem;
  }


.top-main .n1 .slide-media {background: url("../img/top-slide-pc1.jpg") no-repeat center center; background-size: cover;}
.top-main .n2 .slide-media {background: url("../img/top-slide-pc2.jpg") no-repeat center center; background-size: cover;}
.top-main .n3 .slide-media {background: url("../img/top-slide-pc3.jpg") no-repeat center center; background-size: cover;}
.top-main .slide-media {height: 70rem}


  .swiper-pagination {
				display: block;
    position: relative !important;
    margin-top: -3.5rem;
  }

  .slide-copy {
    position: absolute;
    bottom: 0;
    left: 0;
    color: #fff;
    width: 100%;
    height: 24rem;
    background: url("../img/top-slide-shade.png") no-repeat center bottom;
    background-size: 100% 24rem;
    font-size: 4rem;
    line-height: 1;
    padding-top: 15rem;
  }
}
@media (min-width: 1400px) {
  .topmain {
    height: 70rem;
  }
}
/*.swiper-container {
  .swiper-slide {
    &[class*=-active] {
      .slide-media img {
        transition-delay: 0s;
        transform: scale(1.05);
      }
      .slide-copy {
        animation: sspc-fadeIn 2s .5s var(--easing) both;
      }
    }
  }
}

@keyframes sspc-fadeIn {
  0% {
    transform: scale(.5);
    opacity: 0;
    filter: blur(300px);
  }
  100% {
    transform: scale(1);
    opacity: 1;
    filter: blur(0);
  }
}
.swiper-fade {
  .swiper-slide {
    transition-property: opacity !important;
  }
}
*/
/*:::::::::: top-push ::::::::::*/
.content section#top-push {
  margin-top: 0 !important;
  padding-top: 3rem; padding-bottom: 6rem;
  background: url("../img/bg-tex1.jpg") top center;
  z-index: 100;
}

#top-push .dan {
padding-bottom: .5rem;
}
#top-push .dan .waku {
padding: 1.5rem 2rem;
border-bottom-left-radius: 0.5rem;
border-bottom-right-radius: 0.5rem;
filter: drop-shadow(0 0.2rem 0.5rem rgba(0, 0, 0, 0.1));
min-height: 33rem;
}


#top-push .dan h2 {
font-size: 2.8rem; text-align: left; line-height: 1.5;
margin: 0 0 1rem 0; padding: 0 0 0.3rem 4rem;
background: url("../img/bul-rainbow.svg") no-repeat left center;
background-size: 3.5rem auto;
}

#top-push .dan .ban {
height: 25rem; overflow: hidden;
}
/**/
#top-push .dan .linkbtn {
text-align: center; background: #eee;
border-bottom-left-radius: 0.3rem;
border-bottom-right-radius: 0.3rem;
}
#top-push .dan .linkbtn a {
display: inline-block; color: #333;
font-size: 1.8rem; line-height: 1; padding: 1.5rem 0 1.5rem 2rem;;
background: url("../img/bul-link1.svg") no-repeat left center;
background-size: 1rem auto;;
}
#top-push .dan .linkbtn a:hover {
color: #18588F;
}


/*news*/
section#top-push .headline {
margin-top: 3rem;
}
section#top-push .headline dl {
display: flex; flex-wrap: wrap; justify-content: space-between;
margin: 0; padding: 0 0 0 0;
}
section#top-push .headline dl dt {
width: 15rem;
background: #999; color: #fff; font-weight: normal;
padding: 1.1rem 0 1.1rem .5rem ; margin: 0 1.5rem 0.6rem 0; text-align: center; 
font-size: 1.4rem; line-height: 1;
position: relative;
border-bottom: none;
}
section#top-push .headline dl dt::after{
    content: '';
    position: absolute;
    top: 0;
    left: 100%;
    border-top: 1.8rem solid transparent; 
    border-bottom: 1.8rem solid transparent; 
    border-left: 1rem solid #999; 
}

section#top-push .headline dl dd {
width: 34rem;
font-size: 1.8rem; line-height: 1; padding-top: .8rem;
}
section#top-push .headline dl dd a {
display: block;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}

section#top-push .headline dl dt.cat-topic {background: #7B5342;}
section#top-push .headline dl dt.cat-topic::after {border-left-color: #7B5342;}

section#top-push .headline dl dt.cat-news {background: #868E98;}
section#top-push .headline dl dt.cat-news::after {border-left-color: #868E98;}

section#top-push .headline dl dt.cat-showroom {background: #A7BF30;}
section#top-push .headline dl dt.cat-showroom::after {border-left-color: #A7BF30;}

section#top-push .headline dl dt.cat-event {background: #DB6BC6;}
section#top-push .headline dl dt.cat-event::after {border-left-color: #DB6BC6;}

section#top-push .headline dl dt.cat-rainbow {background: #90379B;}
section#top-push .headline dl dt.cat-rainbow::after {border-left-color: #90379B;}

section#top-push .headline dl dt.cat-kitchen {background: #4191E0;}
section#top-push .headline dl dt.cat-kitchen::after {border-left-color: #4191E0;}

section#top-push .headline dl dt.cat-bath {background: #52B8CC;}
section#top-push .headline dl dt.cat-bath::after {border-left-color: #52B8CC;}

section#top-push .headline dl dt.cat-toilet {background: #4176E0;}
section#top-push .headline dl dt.cat-toilet::after {border-left-color: #4176E0;}

section#top-push .headline dl dt.cat-care {background: #C94249;}
section#top-push .headline dl dt.cat-care::after {border-left-color: #C94249;}

section#top-push .headline dl dt.cat-other {background: #AD651D;}
section#top-push .headline dl dt.cat-other::after {border-left-color: #AD651D;}

section#top-push .headline dl dt.cat-paint {background: #EB5C15;}
section#top-push .headline dl dt.cat-paint::after {border-left-color: #EB5C15;}

section#top-push .headline dl dt.cat-garden {background: #5EA240;}
section#top-push .headline dl dt.cat-garden::after {border-left-color: #5EA240;}

section#top-push .headline dl dt.cat-eco {background: #EAA915;}
section#top-push .headline dl dt.cat-eco::after {border-left-color: #EAA915;}

section#top-push .headline dl dt.cat-gaskiki {background: #B761AE;}
section#top-push .headline dl dt.cat-gaskiki::after {border-left-color: #B761AE;}

section#top-push .headline dl dt.cat-mizushuri {background: #44AEE3;}
section#top-push .headline dl dt.cat-mizushuri::after {border-left-color: #44AEE3;}

section#top-push .headline dl dt.cat-hojokin {background: #FF9300;}
section#top-push .headline dl dt.cat-hojokin::after {border-left-color: #FF9300;}

section#top-push .headline dl dt.cat-saiyou {background: #008BC9;}
section#top-push .headline dl dt.cat-saiyou::after {border-left-color: #008BC9;}



/*===== Tablet-PC =====*/
@media (min-width: 768px) {
section#top-push .headline {
margin-top: 0;
}
section#top-push .headline dl dt {
width: 14rem;
}
section#top-push .headline dl dd {
width: 33rem;
}
}









/*:::::::::: reform  ::::::::::*/
section.top-reform {
margin: 7rem 0 5rem 0;
}
.top-reform#re-kitchen h2 {background: url("../img/bul-kitchen.svg") no-repeat;}
.top-reform#re-bath h2 {background: url("../img/bul-bath.svg") no-repeat;}
.top-reform#re-toilet h2 {background: url("../img/bul-toilet.svg") no-repeat;}
.top-reform#re-care h2 {background: url("../img/bul-care.svg") no-repeat;}
.top-reform#re-other h2 {background: url("../img/bul-other.svg") no-repeat;}

.top-reform h2 {
width: 55rem; padding: 0 0 1.8rem 5rem; margin: 0 auto;
background-size: auto 4rem !important;
line-height: 1; font-size: 4rem;
}
.top-reform .split {
background: url("../img/bg-tex1.jpg") top center;
padding: 0;
}




.top-reform.top-reform#re-kitchen .split .left {background: url("../img/top-kitchen-right.svg") no-repeat; background-position: bottom right}
.top-reform.top-reform#re-kitchen .split .right {background: url("../img/top-kitchen-left.svg") no-repeat;}

.top-reform.top-reform#re-bath .split .left {background: url("../img/top-bath-left.svg") no-repeat;}
.top-reform.top-reform#re-bath .split .right {background: url("../img/top-bath-right.svg") no-repeat; background-position: bottom right}

.top-reform.top-reform#re-toilet .split .left {background: url("../img/top-toilet-right.svg") no-repeat; background-position: bottom right}
.top-reform.top-reform#re-toilet .split .right {background: url("../img/top-toilet-left.svg") no-repeat;}


.top-reform.top-reform#re-other .split .left {background: url("../img/top-other-left.svg") no-repeat;}
.top-reform.top-reform#re-other .split .right {background: url("../img/top-other-right.svg") no-repeat; background-position: bottom right}


.top-reform.top-reform#re-care .split .left {background: url("../img/top-care-right.svg") no-repeat; background-position: bottom right}
.top-reform.top-reform#re-care .split .right {background: url("../img/top-care-left.svg") no-repeat;}


.top-reform.top-reform .split .left,
.top-reform.top-reform .split.rvs .right {
padding: 5rem 0 0 0;
background-size: 100% auto !important;
}
.top-reform.top-reform .split .right,
.top-reform.top-reform .split.rvs .left {
padding: 0 0 5rem 0;
background-size: 60% auto !important;
}


.top-reform .split .pic {
background: #FFF; padding: 1rem;
filter: drop-shadow(0 0.2rem 0.3rem rgba(0, 0, 0, 0.2));
}
.top-reform .split .honbun h3 {
font-size: 2.8rem; line-height: 1.5;
}
.top-reform .split .honbun p {
font-size: 1.7rem; color: #6C7580; margin: 2.2rem 0;
}
.top-reform .split .btn {
margin-bottom: 0; text-align: center;
}
.top-reform .split .btn a {
min-width: 25rem;  width: 25rem;
}
.top-reform#re-kitchen .split .honbun .btn a {color: #2280C8; background-image: url("../img/bul-link-kitchen.svg")}
.top-reform#re-bath .split .honbun .btn a {color: #44C8E3; background-image: url("../img/bul-link-bath.svg")}
.top-reform#re-toilet .split .honbun .btn a {color: #4981F2; background-image: url("../img/bul-link-toilet.svg")}
.top-reform#re-care .split .honbun .btn a {color: #CB434A; background-image: url("../img/bul-link-care.svg")}
.top-reform#re-other .split .honbun .btn a {color: #AD651D; background-image: url("../img/bul-link-other.svg")}


/*===== Tablet-PC =====*/
@media (min-width: 768px) {
.top-reform h2 {
width: 112rem;  margin: 0 auto 1.5rem auto; padding: 0 0 0 5rem; line-height: 1.2;
background-position: left bottom !important; background-size: auto 3.6rem !important;
}



.top-reform .split {
padding: 0;
}

.top-reform.top-reform#re-kitchen .split .left {background: url("../img/top-kitchen-left.svg") no-repeat;}
.top-reform.top-reform#re-kitchen .split .right {background: url("../img/top-kitchen-right.svg") no-repeat;}

.top-reform.top-reform#re-toilet .split .left {background: url("../img/top-toilet-left.svg") no-repeat;}
.top-reform.top-reform#re-toilet .split .right {background: url("../img/top-toilet-right.svg") no-repeat;}

.top-reform.top-reform#re-care .split .left {background: url("../img/top-care-left.svg") no-repeat;}
.top-reform.top-reform#re-care .split .right {background: url("../img/top-care-right.svg") no-repeat;}

.top-reform.top-reform .split .left,
.top-reform.top-reform .split.rvs .left {
background-size: 85% auto !important;
padding: 7rem 0 7rem 0 !important;
}
.top-reform.top-reform .split .right,
.top-reform.top-reform .split.rvs .right {
background-size: 45% auto !important; background-position: right bottom !important;
padding: 7rem 0 7rem 0 !important;
}
.top-reform .split .btn {
text-align: left;
}
.top-reform .split.rvs .btn {
text-align: left;
}
}




/*:::::::::: exterior ::::::::::*/

#top-exterior .col4 {
border-radius: 50%; border: 1rem solid #DEDEDE; background: #FFF;
height: 40rem; width: 40rem; margin: 1rem auto;
/*filter: drop-shadow(0 0.1rem 0.3rem rgba(0, 0, 0, 0.3));*/
background-size: 100% auto !important;
box-shadow:0 .2rem .3rem rgba(0,0,0,0.2);
}
#top-exterior .col4#top-paint {background:  url("../img/top-paint.jpg") no-repeat;}
#top-exterior .col4#top-garden {background:  url("../img/top-garden.jpg") no-repeat;}
#top-exterior .col4#top-eco {background:  url("../img/top-eco.jpg") no-repeat;}

#top-exterior .col4 h3 {
background: none; border: none; text-align: center; padding: 22rem 0 0 0;
font-size: 3.8rem;
}
#top-exterior .col4 h3 a {
text-decoration: none; color: #323940;
}
#top-exterior .col4 h3 a:hover {
color: #84C2F5;
}
#top-exterior .col4 .btn {
text-align: center;
}
#top-exterior .col4 .btn a {
min-width: 20rem; color: #FFF; background-image: url("../img/bul-link-shiro.svg");
}
#top-exterior .col4#top-paint .btn a {background-color: #C75C28;}
#top-exterior .col4#top-garden .btn a {background-color: #5EA240;}
#top-exterior .col4#top-eco .btn a {background-color: #EAA915;}

/*===== Tablet-PC =====*/
@media (min-width: 768px) {

#top-exterior .col4 {
height: 36rem; width: 36rem;
}
#top-exterior .col4 h3 {
font-size: 3.2rem; padding: 19rem 0 0 0;
}
}




/*:::::::::: banners ::::::::::*/
section#banners {
background: url("../img/bg-tex3.jpg") #777; 
}
section#banners .dan {
background: #FFF; padding: .9rem; border: .1rem solid #ccc;
box-shadow:0 .1rem .3rem rgba(0,0,0,0.2); margin: 2rem auto;
}




