@charset "UTF-8";
/* CSS Document */

.hhc,.hhc *{ margin:0; padding: 0;}
.hhc{ height:600px; overflow: hidden; position: relative;}

.hhc .bill-arrow-left{ display: block; margin: auto; padding: 0; position: absolute; top: 0; bottom: 0; left: 20px; z-index: 9999;}
.hhc .bill-arrow-right{ display: block; margin: auto; padding: 0; position: absolute; top: 0; bottom: 0; right: 20px; z-index: 9999;}

.hhc .item{ height:600px; position: relative; overflow: hidden; background: no-repeat center center; background-size: cover;}
.hhc .item .inner{ margin: 0 auto; width:1000px; height: 100%; position: relative; }
.hhc .title{ margin:auto; padding: 0; position:absolute;}

.hhc .item00{ background-image: url("billboard/202205/billboard01.jpg");} /*キッチンがひろいほうがいいな*/
.hhc .item00 .title{ display: block; top: 0; bottom: 0;	right: 50px;}

.hhc .item01{ background-image: url(billboard/202205/billboard02.jpg);}/* 人と住まいとまちづくり */
.hhc .item01 .title{ display: block; width:auto; height: 360px; top: 0; bottom: 0; right: 0;}

.hhc .item02{ background-image: url(img2017/bill2017-03.jpg);}/* ポコタウン */
.hhc .item02 .title{ display: block; width:auto; height: 360px; top: 0; bottom: 0;	right: 20px;}

.hhc .item03{ background-image: url("billboard/202205/billboard-chumon02.jpg");}/* 注文住宅 */
.hhc .item03 .title{ display: block; width:auto; height: 330px; top: 0; bottom: 0; right: -50px;}

.hhc .item06{ background-image: url("billboard/202205/billboard-tateuri.jpg");}/* 建売 */
.hhc .item06 .title{ display: block; width:auto; height: 330px; top: 0; bottom: 0; left: 20px;}

.hhc .item04{ background-image: url(billboard/202205/billboard-mansion.jpg);}/*  マンション分譲*/
.hhc .item04 .title{ display: block; width: auto; height: 360px; top: 0; bottom: 0; left: 20px;}

.hhc .item05{ background-image: url(billboard/202205/billboard-chintai.jpg);}/* 賃貸売買 */
.hhc .item05 .title{ display: block; width: auto; height: 360px; top: 0; bottom: 0; right: 0;}

@media only screen and (max-width:480px){  /* over write */
  .hhc{ margin-top:80px; height:180px; overflow: hidden; }
  .hhc .item{ height:180px;}
  .hhc .item .inner{ width:97%; position: relative;}

  .hhc .title{ display:block; max-width: 100%; max-height: 70%; width: auto;}
  .hhc .title img{ }
  .hhc .bill-arrow-left{ display:none !important;}
  .hhc .bill-arrow-right{ display:none !important;}

  .hhc .item00 .title{ top: 0; bottom: 0;	right: 2.0em;; max-height: 95%;}
  .hhc .item01 .title{ top: 0; bottom: 0; right: 0; }
  .hhc .item02 .title{ top: 0; bottom: 0;	right: 0; }
  .hhc .item03 .title{ top: 0; bottom: 0; right: 0; }
  .hhc .item06 .title{ top: 0; bottom: 0; left: 0; }
  .hhc .item04 .title{ top: 0; bottom: 0; left: 0; }
  .hhc .item05 .title{ top: 0; bottom: 0; right: 0; }
}


.catMenu{}
.catMenu a{ display:block; margin: 0; padding: 56.25% 0 0 0; position: relative; overflow: hidden; border-radius: 5px;}
.catMenu a img{ display:block; margin: auto; padding: 0; width: 100%; height: auto; position: absolute;  right: 0; bottom: 0; left: 0; transition: transform 0.5s linear;}
.catMenu a span{ display:block; margin: 0; padding: 0.3em 0; text-align: center; background: rgba(0,0,0,0.5); color: #FFFFFF; position: absolute; left: 0; right: 0; bottom: 0;}
.catMenu a:hover img{ transform:scale(1.05,1.05);}

/*
.catMenu_estate a{ padding:25% 0 0 0;}
.catMenu_estate a img{ top: 0; right: 0; bottom: 0; left: 0;}
.catMenu_estate a span{ background:none; font-size:250%; line-height: 1.3; bottom: auto; left: auto; right: 3.0em; top: 3.0em; letter-spacing: 3px; text-shadow: 2px 2px 2px rgba(0,0,0,0.7);}
*/
.catMenu_estate{}
.catMenu_estate a{ display:block; margin: 0; padding: 25% 0 0 0; position: relative; overflow: hidden; border-radius: 5px;}
.catMenu_estate img.item01{ display:block; margin: auto; padding: 0; width: 100%; height: auto; position: absolute;  right: 0; bottom: 0; left: 0; top: 0; transition: transform 0.5s linear; z-index: 0;}
.catMenu_estate img.item02{ display:block; margin: auto 0; padding: 0;  position: absolute;  right: 3em; bottom: 0; top: 0; z-index: 3;}



.btn-poco{ font-size:114%; padding: 0.7em 3.0em; border-radius: 20px;}


.sec01{ width:850px; margin-top: 4.0em;}
.sec01 .body{ margin-top: 1.5em !important; font-size:129%; line-height: 1.8;}

.section-group{ padding: 2.0em 0; background:#DFF2FC;}
.section-group .mb{ width:900px;}
.section-group .body{ margin: 0; font-size:93%; line-height: 1.5;}
.group-item a{ display:block; background: #FFFFFF; }
.linkLogoNavi .text:after{ border:none !important;}

.section-cm{}
.section-cm .youtube-wrapper{ width:50%; margin: 0 auto;}

.info{}
.info ul li{}
.info time{ margin: 0; padding: 0; display:block; width: 80px; float: left;}
.info .category{ margin: 0; padding: 0; display:block; width: 10em; float: left;}
.info a{ display:block; margin: 0; padding: 0;}

.section-pickup{ background:#E9E9D6; padding: 2.0em 0;}
.section-pickup .mb{ padding:0;}

.pickup li{ float:left; margin: 0 1.0em;}
.pickup a{ margin:0; padding: 0 0 1.0em 0; display:block; background:#FFFFFF; border-radius: 5px; width: 390px; color: #4d4d4d; text-decoration: none;}
.pickup .image{ margin:0; padding: 56.25% 0 0 0; position: relative; overflow: hidden; border-radius: 5px 5px 0 0;}
.pickup .image img{ display:block; margin: auto; padding: 0; width: 100%; height: auto; position: absolute; top: 0; right: 0; bottom: 0; left: 0;}
.pickup .category{ margin: 0.5em 1.0em 0 1.0em; padding: 0;}
.pickup .title{ margin:0.5em 1.0em 0 1.0em; padding: 0; font-size: 114%; font-weight: 200;}
.pickup .body{ margin:0.5em 1.0em 0 1.0em; padding: 0; line-height: 1.5; font-weight: 200;}


@media only screen and (max-width:480px){  /* over write */
  
 
 .sec01{ width:auto;}
 .sec01 .body{ margin-top: 0; font-size:100%; line-height: 1.8;}
 
  .catMenu a,.catMenu_estate a{ padding: 40% 0 0 0;}
  
  .catMenu a img{ margin: auto; top:0; right: 0; bottom: 0; left: 0;}
  .catMenu .catMenuBottom a img{ margin: 0 auto; top:auto; right: 0; bottom: 0; left: 0;}
  /*.catMenu a img{ display:block; margin: auto; padding: 0; width: 100%; height: auto; position: absolute;  right: 0; bottom: 0; left: 0; transition: transform 0.5s linear;}*/
  
  
 .catMenu a span{ font-size:100%;}
  
  .catMenu_estate{}
.catMenu_estate a{ display:block; margin: 0; padding: 40% 0 0 0; position: relative; overflow: hidden; border-radius: 5px;}
.catMenu_estate img.item01{ display:block; margin: auto; padding: 0; width: 100%; height: auto; position: absolute;  right: 0; bottom: 0; left: 0; top: 0; transition: transform 0.5s linear; z-index: 0;}
.catMenu_estate img.item02{ display:block; margin: auto 0; padding: 0;  position: absolute;  right: 10px; bottom: 0; top: 0; z-index: 3; width:50%; height: auto;}
  
  .catMenu_estate_sp a{ padding:56.25% 0 0 0;}
  
 
 .section-group .mb{ width:auto; padding: 0;}
 .section-group .group-item{ margin-top:0;}
 .section-group .group-item li{ margin-top:0.5em;}
 .section-group .group-item li p{ margin-top:0;}
 
 .info{}
.info ul li{}
.info time{ margin: 0; padding: 0; display:block; width: 80px; float: left;}
.info .category{ margin: 0; padding: 0; display:block; width: 90px; float: left;}
.info a{ display:block; margin: 0 0 0 0; padding: 0.5em 0 0 0; clear: both;}

 .section-pickup{ padding: 0:}
 .section-pickup .section-title{ margin-top:0;}
 .section-pickup .mb{ margin-top:0;}
 .pickup{ margin-top:0;}
 .pickup a{ width:300px;}

}