@charset "utf-8";

/*====================================================================================================

  リブ

====================================================================================================*/

/*----------------------------------------------------------------------------------------------------

  ページタイトル
  
----------------------------------------------------------------------------------------------------*/

.s-pgTtl__hdline {
  background-color:#ff93ae;
}

@media print,screen and (min-width:641px) {
  .s-pgTtl__hdline {
    padding-left:120px;
    padding-top:70px;
    padding-bottom:70px;
  }
  
  .s-pgTtl__hdline img {
    width:280px;
  }
  
  #s-pgTtl p {
    padding-top:50px;
  }
}

@media screen and (max-width:640px) {
  .s-pgTtl__hdline img {
    max-width:280px;
    width:50%;
  }
}


/*----------------------------------------------------------------------------------------------------

  特徴
  
----------------------------------------------------------------------------------------------------*/

.tokuchoList-spec .s-tokucho__box:before { background-image:url(../image/rakumama/icon_spec.svg); }
.tokuchoList-topclass .s-tokucho__box:before { background-image:url(../image/rakumama/icon_topclass.svg); }
.tokuchoList-solar .s-tokucho__box:before { background-image:url(../image/rakumama/icon_solar.svg); }
.tokuchoList-allE .s-tokucho__box:before { background-image:url(../image/rakumama/icon_allE.svg); }
.tokuchoList-yukadan .s-tokucho__box:before { background-image:url(../image/rakumama/icon_yukadan.svg); }
.tokuchoList-window .s-tokucho__box:before { background-image:url(../image/rakumama/icon_window.svg); }
.tokuchoList-dannetsu .s-tokucho__box:before { background-image:url(../image/rakumama/icon_dannetsu.svg); }
.tokuchoList-ZEH .s-tokucho__box:before { background-image:url(../image/rakumama/icon_ZEH.svg); }


/*----------------------------------------------------------------------------------------------------

  大写真
  
----------------------------------------------------------------------------------------------------*/

@media screen and (max-width:640px) {
  .photoB {
    padding-left:6%;
    padding-right:6%;
  }
}


/*----------------------------------------------------------------------------------------------------

  間取り
  
----------------------------------------------------------------------------------------------------*/

.madori-mkr1 {
  margin-left:0.5rem;
  margin-right:0.5rem;
}

.madori-mkr2 {
  margin-right:0.5rem;
}

.madoriPoint {
  text-align:left;
  position:relative;
}

.madoriPoint__label {
  display:inline-block;
  line-height:1;
  background-color:#f6a53e;
  color:#fff;
  padding:1rem;
}

.madoriPoint__list {
  list-style:none;
  counter-reset:s-number;
}

.madoriPoint__list li {
  line-height:1.5;
  counter-increment:s-number;
  position:relative;
  padding-left:2em;
}

.madoriPoint__list li:not(:first-child) {
  margin-top:0.8em;
}

.madoriPoint__list li:before {
  font-size:0.8em;
  content:counter(s-number);
  font-style:normal;
  text-align:center;
  display:inline-block;
  position:absolute;
  left:0;
  top:0;
  background-color:#f6a53e;
  border:1px solid #f6a53e;
  color:#fff;
  line-height:1.65em;
  width:1.8em;
  height:1.8em;
  z-index:2;
  border-radius:100%;
}

@media print,screen and (min-width:641px) {
  .madori-lo {
    width:1180px;
    margin-left:auto;
    margin-right:auto;
    padding-top:90px;
  }
  
  .madori-txt01,
  .madori-txt02 {
    line-height:2;
  }
  
  .madori-txt01 {
    font-size:1.8em;
  }
  
  .madori-txt02 {
    font-size:1.2em;
    padding-top:30px;
    padding-bottom:70px;
  }
  
  .madori-img {
    width:940px;
  }
  
  .madoriPoint {
    padding-left:120px;
    margin-top:-36px;
  }
  
  .madoriPoint__list {
    padding-top:30px;
    font-size:1.1em;
  }
}

@media screen and (max-width:640px) {
  .madori-lo {
    padding-top:10%;
    padding-left:6%;
    padding-right:6%;
  }
  
  .madori-txt01 {
    font-size:4.8vw;
  }
  
  .madori-txt02 {
    text-align:left;
    padding-top:5%;
    font-size:1.1em;
    padding-bottom:10%;
  }
  
  .madoriPoint {
    padding-bottom:2%;
  }
  
  .madoriPoint__label {
    font-size:1.3em;
  }

  .madoriPoint__list {
    padding-top:1.5em;
  }
}

@media screen and (max-width:500px) {
  .madoriPoint__label {
    font-size:4.4vw;
  }
}


/*----------------------------------------------------------------------------------------------------

  エアコン＋床暖房システム
  
----------------------------------------------------------------------------------------------------*/

.danboPoint {
  text-align:left;
}

.danboPoint__label {
  display:inline-block;
  line-height:1;
  background-color:#20be5f;
  color:#fff;
  padding:1rem;
}

.danboPoint__list {
  margin-left:2.2rem;
  padding-top:0.75em;
}

.danboPoint__list li {
  padding-top:0.25em;
}

@media print,screen and (min-width:641px) {
  .danboPoint {
    width:590px;
    float:left;
    padding-left:60px;
    padding-right:60px;
  }
  
  .danboPhoto {
    width:470px;
    float:right;
    margin-right:60px;
    margin-top:-80px;
  }
}

@media screen and (max-width:640px) {
  .danbo {
    padding-left:6%;
    padding-right:6%;
    padding-bottom:10%;
  }
  
  .danboPhoto {
    width:100%;
    position:relative;
    height:-webkit-calc(260 / 640 * 100vw);
    height:calc(260 / 640 * 100vw);
    overflow:hidden;
    margin-top:2%;
  }
  
  .danboPhoto img {
    position:absolute;
    left:50%;
    top:50%;
    transform:translate(-50%,-50%);
    overflow:hidden;
  }
  
  .danboPoint {
    padding-top:8%;
  }
  
  .danboPoint__label {
    font-size:1.3em;
  }
}

@media screen and (max-width:500px) {
  .danboPoint__label {
    font-size:4.4vw;
  }
}


/*----------------------------------------------------------------------------------------------------

  W断熱工法
  
----------------------------------------------------------------------------------------------------*/

.dannetsu__ttl {
  font-weight:700;
  font-size:1.7em;
  text-align:center;
  line-height:1.6;
  padding-top:0.7em;
  padding-bottom:0.7em;
}

.dannetsu__ttl .em {
  font-size:0.7em;
}

.koho,
.dannetsu {
  text-align:center;
}

.dannetsu p {
  text-align:left;
}

@media print,screen and (min-width:641px) {
  .koho {
    width:590px;
    float:left;
    border-right:1px solid #eaeae9;
    padding-left:30px;
    padding-right:30px;
    text-align:center;
  }
  
  .dannetsu {
    width:590px;
    float:right;
    padding-left:60px;
    padding-right:60px;
  }
}

@media screen and (max-width:640px) {
  .koho,
  .dannetsu {
    padding-left:6%;
    padding-right:6%;
  }
  
  .dannetsu {
    padding-top:10%;
    padding-bottom:10%;
  }
}


/*----------------------------------------------------------------------------------------------------

  ヒートポンプ式 温水暖房システム
  
----------------------------------------------------------------------------------------------------*/

@media print,screen and (min-width:641px) {
  .heatPump-colL {
    width:530px;
    float:left;
    margin-left:60px;
  }
  
  .heatPump-colR {
    width:470px;
    float:right;
    margin-right:60px;
    margin-top:-36px;
    text-align:left;
  }
}

@media screen and (max-width:640px) {
  .heatPump-colL,
  .heatPump-colR {
    padding-left:6%;
    padding-right:6%;
  }
  
  .heatPump-colL {
    padding-top:2%;
  }
  
  .heatPump-colR {
    padding-top:8%;
    padding-bottom:10%;
  }
}


/*----------------------------------------------------------------------------------------------------

  ZEH
  
----------------------------------------------------------------------------------------------------*/

.zeh-hdline,
.zeh-img {
  line-height:1;
}

.zeh-ct {
  text-align:left;
}

@media print,screen and (min-width:641px) {
  .zeh-lo {
    margin-top:-25px;
    padding-bottom:115px;
    width:1180px;
    margin-left:auto;
    margin-right:auto;
  }
  
  .zeh-hdline {
    padding-bottom:60px;
  }
  
  .zeh-img {
    padding-top:60px;
    margin-bottom:20px;
  }
  
  .zeh-ct p {
    line-height:1.8;
  }

  .zeh-ct p:not(:first-child) {
    padding-top:2em;
  }
}

@media screen and (max-width:640px) {
  .zeh-lo {
    padding-top:10%;
    padding-bottom:10%;
    padding-left:6%;
    padding-right:6%;
  }
  
  .zeh-hdline {
    margin-bottom:8%;
    background:url(../image/rakumama/zeh_hdline_sp.gif) no-repeat center center;
    background-size:contain;
    height:-webkit-calc(230 / 640 * 100vw);
    height:calc(230 / 640 * 100vw);
  }
  
  .zeh-img {
    margin-top:5%;
    background:url(../image/rakumama/zeh_sp.gif) no-repeat center center;
    background-size:contain;
    height:-webkit-calc(380 / 640 * 100vw);
    height:calc(380 / 640 * 100vw);
  }

  .zeh-ct p:not(:first-child) {
    padding-top:1.5em;
  }
}

