@charset "utf-8";
/* -------------------------------------
     sp CSS
 (c) Copyright 2020 Sketches of Design
     version 2020-12-26
------------------------------------- */

/* 1280
--------------------------------------*/
@media screen and (max-width: 1280px) {

  main section .inner{
    max-width: 100%;
  }
  main section .inner,
  body#home #news-area .inner{
    padding: 60px 4%;
  }
  body#home #news-area .date span{
    font-size: 1.2rem;
  }
  footer{
    font-size: 1.3rem;
  }
  footer .ftmenu .title,
  body#home #news-area .item p,
  #hdmenu .menu ul,
  .gmenu-col li:not(.title) a{
    font-size: 1.4rem;
  }
  body#services-idx #lv02-01 p,
  body#home #service-area a,
  .gmenu-col .title a{
    font-size: 1.6rem;
  }
  body#home .slide .item p,
  body#home .slide .item h3{
    font-size: 3.0rem;
  }
  body#home .slide .item p em{
    font-size: 8.0rem;
  }
  .hd-main{
    padding: 20px 0 0 20px;
  }
  #hdmenu .menu ul{
    gap: 20px;
    font-size: 1.4rem;
  }
  body#home .slide .item{
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 0 20px 80px 20px;
  }
  body#home .slide .item h3{
    margin: 0;
  }
  body#home #content h2{
    margin: 0 0 40px 0;
  }
  body#home #service-area a{
    padding: 20px 0;
  }
  body#home .slide-wrapper{
    min-height: 500px;
  }
  body#home #recruit-area .lead{
    font-size: 4.8vw;
  }
  #contact-area .link a{
    padding: 40px 20px;
    font-size: 2.0rem;
    width: 400px;
  }
  footer .ftmenu{
    gap: 30px;
  }
  body.news #content #title{
    margin: 0 4%;
  }
  body.news #content #title .inner{
    padding: 40px 0 20px 0;
  }
  #main-pic .en{
    font-size: 9.8vw;
    bottom: -15px;
  }


}
/*  1024
--------------------------------------*/
@media screen and (max-width: 1024px) {

}

/*  960
--------------------------------------*/
@media screen and (max-width: 960px) {

  /* font */
  body#home #content h2 span{
    font-size: 4.8rem;
  }
  h1{
    font-size: 4.0rem;
  }
  h2{
    font-size: 3.0rem;
  }
  h3{
    font-size: 2.4rem;
  }
  body#services-idx #lv02-02 h4{
    font-size: 1.9rem;
  }
  body#services-idx #lv02-01 h3{
    font-size: 1.8rem;
  }
  body#home #content h2{
    font-size: 1.6rem;
  }
  body#realestate-idx #lv02-01 .address a,
  body#home #service-area a{
    font-size: 1.4rem;
  }
  main p,
  main dl,
  main table,
  main ul,
  #hdmenu nav ul li{
    font-size: 1.3rem;
  }
  footer .copy{
    font-size: 1.1rem;
  }


  /**/
  #hdmenu .menu ul{
    display: none;
  }
  footer .inner{
    padding: 40px 4%;
  }
  footer .ftmenu{
    margin-top: 40px;
    justify-content: space-between;
    width: 100%;
  }
  body#home #content h2 {
    margin: 0 0 10px 0;
  }
  body#home .slide-wrapper {
    min-height: 360px;
  }
  body#home #service-area a {
    padding: 15px 0;
  }
  body#home .slide .item p em {
    font-size: 7.0rem;
  }
  .gmenu .inner{
    display: block;
  }
  .gmenu-col li:not(.title){
    display: none;
  }
  body#company-idx .building{
    background-size: cover;
  }
  body#services-idx #lv02-01 .real_estate,
  body#services-idx #lv02-01 .construction{
    width: 100%;
  }
  body#services-idx #lv02-01 .construction{
    margin-bottom: 20px;
  }
  body#services-idx #lv02-01 h3{
    margin: 0 0 5px 0;
  }
  body#services-idx #lv02-01 p{
    padding: 10px;
  }
  body#services-idx #lv02-01 a{
    padding: 15px;
  }
  body#services-idx #lv02-02{
    background-size: 500px auto;
    background-position: right bottom;
  }
  body#company-idx #license .license-list {
    gap: 20px;
  }



}
/*  768
--------------------------------------*/
@media screen and (max-width: 768px) {


}
/*  667
--------------------------------------*/
@media screen and (max-width: 667px) {
  body#services-idx #lv02-01 p{
    font-size: 1.4rem;
  }
  body.news #content #title h2{
    font-size: 2.4rem;
  }
  header #b-logo img{
    height: 38px;
  }
  header #hdmenu .inner {
    height: 60px;
  }
  header.is-scrolled .hd-main,
  header .hd-main{
    padding: 0 0 0 10px;
  }
  body#home #about-area .inner,
  body#home .slide-wrapper,
  body#home #service-area .pic,
  body#home #service-area .inner,
  body#home #news-area .newslist,
  body#home #news-area .title-area{
    width: 100%;
  }
  body#home #news-area .title-area{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    background: none;
  }
  body#home #news-area .inner{
    background: url("../img/bg-home-news.webp") center right no-repeat;
    background-size: auto 560px;
  }
  #contact-area .inner {
    padding: 100px 0;
  }
  body#home #service-area{
    position: relative;
    background: none;
    z-index: 1;
    padding: 40px 4%;
  }
  body#home #service-area::before{
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: url("/img/p-home-service.webp") center/cover no-repeat;
    opacity: 0.2;
    z-index: -1;
  }
  body#home #service-area .inner{
    padding: 0;
  }
  body#home #about-area{
    background-size: cover;
  }
  body#home #about-area{
    padding: 0;
  }
  body#home #about-area .link{
    position: static;
    width: auto;
  }
  body#home #about-area .inner{
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    padding: 100px 4%;
  }
  body#home #recruit-area .lead{
    font-size: 6.0vw;
  }
  br.sp,
  body#home #recruit-area .lead br{
    display: block;
  }
  body#home #recruit-area .lead span{
    margin-right: 0;
  }
  footer .inner {
    padding: 40px 4% 0 4%;
  }
  footer .ftmenu{
    gap: 0;
  }
  footer .ftmenu div{
    margin-bottom: 40px;
    width: 50%;
  }
  body#company-idx .building{
    height: 300px;
  }
  body#company-idx #office{
    background-size: cover;
    background-attachment: scroll;
  }
  body#company-idx #welfare .welfare-list,
  body#company-idx #office .office-list{
    gap: 20px;
  }
  body#company-idx #welfare .card,
  body#company-idx #office .card{
    padding: 15px;
    width: calc(50% - 10px);
  }
  body#company-idx #welfare h3,
  body#company-idx #office h3{
    margin: 0 0 5px 0;
  }
  body#realestate-idx #lv02-01 .inner .box{
    padding: 20px;
  }
  body#realestate-idx #lv02-03 li{
    margin: 0 0 20px 0;
    width: calc(50% - 10px);
  }
  body#realestate-idx #lv02-01 .inner div {
    width: calc(33.33% - 15px);
  }
  .slider-wrap .arrow.prev { left: 0; }
  .slider-wrap .arrow.next { right: 0; }
  body.news #content #lv02-01 .inner{
    padding: 40px 4%;
  }
  #content .pagemenu li:first-child a::before,
  #content .pagemenu li:last-child a::after{
    display: none;
  }
  #content .pagemenu a{
    padding: 0 12px;
  }
  body#services-idx #lv02-02{
    background-size: 400px auto;
    background-position: right bottom;
  }
  body#services-idx #content h2{
    margin: 0 0 20px 0;
  }
  body#services-idx #lv02-02 .single{
    width: 45%;
  }
  body#services-idx #lv02-02 .gallery-block {
    width: calc(55% - 20px);
  }
  body#services-idx .thumb-grid .thumb{
    width: 25%;
  }
  body#services-idx #lv02-03 .inner {
    padding-bottom: 100px;
  }
  body#company-idx #license .license-list li{
    width: 50%;
  }
  body#company-idx #license .license-list {
    gap: 0;
  }
.hd-main{
  gap: 20px;
}


}
/*  480
--------------------------------------*/
@media screen and (max-width: 480px) {

  body#services-idx #lv02-01 p,
  #content .pagemenu a{
    font-size: 1.2rem;
  }
  body#home #content h2{
    font-size: 1.4rem;
  }
  body#contact-idx #lv02-01 dl,
  body#contact-idx #lv02-01 p{
    font-size: 1.6rem;
  }
  body#home .slide .item p,
  body#home .slide .item h3 {
    font-size: 2.4rem;
  }
  body#home #content h2 span {
    font-size: 3.8rem;
  }
  body#home .slide .item p em {
    font-size: 5.0rem;
  }
  #contact-area .inner {
    padding: 100px 4%;
  }
  body#realestate-idx #lv02-01 .inner div,
  body#company-idx #welfare .card,
  body#company-idx #office .card,
  body#realestate-idx #lv02-01 .inner div,
  #contact-area .link,
  #contact-area .link a{
    width: 100%;
  }
  .hamburger,
  .hd-side .btn-ins,
  .hd-side .btn-x{
    width: 40px;
  }
  .hd-side .btn-recruit{
    padding: 0 10px;
  }
  .hd-main{
    gap: 0;
  }
  body#home #recruit-area .inner {
    padding: 40px 4% 0 4%;
  }
  main section .inner,
  body#home #news-area .inner {
    padding: 40px 4%;
  }
  body#company-idx .building{
    height: 300px;
    background-attachment: scroll;
  }
  body#company-idx #history dt{
    padding: 15px 0 0 0;
    width: 100%;
  }
  body#company-idx #history dd{
    margin: 0;
    padding: 5px 0 15px 0;
  }
  body#company-idx #history dt::after{
    display: none;
  }
  body#company-idx #welfare .welfare-list,
  body#company-idx #office .office-list{
    gap: 10px;
  }
  #main-pic{
    padding: 100px 4%;
  }
  body#realestate-idx #lv02-01 .inner div:not(.box){
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
  }
  body#realestate-idx #lv02-01 .inner .images{
    width: calc(40% - 20px);
  }
  body#realestate-idx #lv02-01 .inner .address{
    width: 60%;
    text-align: left;
  }
  .slider-wrap .arrow.prev { left: -10px; }
  .slider-wrap .arrow.next { right: -10px; }

  body#services-idx #lv02-01 p {
    padding: 10px 5px;
  }
  body#services-idx #lv02-03 .inner {
    padding-bottom: 60px;
  }
  #main-pic .en{
    bottom: -6px;
  }
  
body#home #main-pic{
  background-position: 0 center;
}


}