@charset "utf-8";

/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++ */
/* ● お部屋ページ専用CSS                                  */
/*    ・ページ固有の処理を記述                             */
/* +++++++++++++++++++++++++++++++++++++++++++++++++++++++ */


/* --------------------------------------------------- */
/*   ページタイトル部                                  */
/* --------------------------------------------------- */
.PageTitleArea{
}

    /* - - LocalMenuList - - */
    .PageTitleArea .MenuList.LocalMenuList li {
      width: 20%;
    }
                /* + + + + + レスポンシブ + + + + +  */
                

                        /* bp2より広いディスプレイ用 */
                        body.rsbp-over-bp2.DetailPage  .PageTitleArea .MenuList.LocalMenuList li {
                          width: 25%;
                        }
                        /* bp2より狭いディスプレイ用 */
                        body.rsbp-under-bp2.DetailPage .PageTitleArea .MenuList.LocalMenuList li  p{
                          font-size: 90%;
                          transform: scale(0.95, 1);
                          letter-spacing: -0.05em;
                        }




/* RoomTypeListArea
--------------------------------------------------- */
.RoomTypeListArea.bg-wagara{
  margin-top: 100px;
  margin-bottom: 0;
  padding: 80px 0;
}
    .RoomTypeListArea.bg-wagara .RoomTypeListBlock{
      margin-top: -50px;
      text-align: center;
    }

    
    /* - - LocalMenuList （部屋タイプ一覧用） - - */
    .MenuList.LocalMenuList.RoomTypeList {
    }
        .MenuList.LocalMenuList.RoomTypeList li{
          width: 20%;
        }





/* --------------------------------------------------- */
/*   装飾部品                                          */
/* --------------------------------------------------- */

/* DecorationArea
--------------------------------------------------- */
.DecorationArea{
}
    /* 部屋タイプ画像用に高さを調整 */
    .DecorationArea.RoomTypeImageArea .ImageItem .Image{
      /*height: 500px;*/
    }

                /* + + + + + レスポンシブ + + + + +  */
                
                    /* bp2より狭いディスプレイ用 */
                    body.rsbp-under-bp2 .DecorationArea.bg-wagara::before,
                    body.rsbp-under-bp2 .DecorationArea.bg-wagara::after{
                      display: none;
                    }

    /* 和柄背景と隣接した場合の表示調整 */
    .bg-wagara-type3 + .DecorationArea::before{
      background-image: url(../../img/common/decoration/wagara_type3_btm.png)!important;
    }


                /* + + + + + レスポンシブ + + + + +  */

                    /* bp2より広いディスプレイ用 */
                    .rsbp-over-bp2 .bg-wagara + .deco-sakura-branch > .PageWidthSetter{
                      margin-top: 100px;
                    }
                    

/* --------------------------------------------------- */
/*   お部屋 冒頭部                                     */
/* --------------------------------------------------- */

/* IntroArea
--------------------------------------------------- */
.IntroArea{
  padding-bottom: 0;
}


/* IntroBlock
--------------------------------------------------- */
.IntroBlock{

}
    .IntroBlock .BlockHeader{
      margin: 0 0 30px;
    }







/* --------------------------------------------------- */
/*   お部屋紹介                                        */
/* --------------------------------------------------- */

/* RoomTypeArea
--------------------------------------------------- */
.RoomTypeArea{
}



/* RoomListBlock (一覧表示用)
--------------------------------------------------- */
.RoomListBlock{

}
    .RoomListBlock .BlockHeader{
    
    }
    .RoomListBlock .BlockHeader .Heading.Type2{
      text-align: center;
    }
    .RoomListBlock .BlockHeader .DefaultText{
      margin: 0 auto 2em;
      max-width: 850px;
    }
    .RoomListBlock .BlockHeader .FullImage{
      margin-bottom: 20px;
    }
    .RoomListBlock .BlockHeader .SknTplTextButton{
      margin-bottom: 25px;
    }



    /* - - お部屋一覧 - - */
    .RoomListBlock .RoomList{
      
    }
    .RoomListBlock .RoomList li{
    }
    .RoomListBlock .RoomList li > .inner{
      margin: 5px;
      padding: 0!important;
      background: #fff;
      border: 1px solid #ccc;
      display: block;
    }
    .RoomListBlock .RoomList li a{
    }
    .RoomListBlock .RoomList li a:hover{
      border: 1px solid #33c;
    }
    .RoomListBlock .RoomList li .TextItem{
      padding: 20px 20px;
      margin-bottom: 0;
    }
        .RoomListBlock .RoomList li .TextItem .RoomName.Heading{
          font-size: 150%;
          margin-bottom: 1em;
          position: relative;
          padding-bottom: 0.5em;
          border-bottom: 2px dotted;
        }
        .RoomListBlock .RoomList li .TextItem .RoomName .Label{
        }
        .RoomListBlock .RoomList li .TextItem .DefaultText{
          margin-bottom: 1em;
          text-align: center;
        }
    .RoomListBlock .RoomList li .ImageItem{
      margin-bottom: 0;
    }



    /* タグ */

    .TagTitle {
      position: relative;
      display: block;
      margin: 0 0 1em;
      text-shadow: 0 0 2px white;
      font-weight: 500;
    }
    .TagTitle:before{
      content: "─";
      font-family: "preset_icon";
      display: inline-block;
      margin-right: 0.5em;
      color: #bdb884;
    }
    .TagTitle:after{
      content: "─";
      font-family: "preset_icon";
      display: inline-block;
      margin-left: 0.5em;
      color: #bdb884;
    }
    .TagTitle span{
      position: relative;
      z-index: 2;
    }
    .TagList {
      list-style: none;
      font-size: 87.5%;
      display: -webkit-flex;
      display:     -ms-flex;
      display:         flex;
     -webkit-flex-wrap: nowrap;
         -ms-flex-wrap: nowrap;
             flex-wrap: nowrap;
     -webkit-flex-wrap: wrap;
         -ms-flex-wrap: wrap;
             flex-wrap: wrap;
    }
    .TagList li{
      padding: 0.2em 0.7em;
      border-radius: 0.25em;
      white-space: nowrap;
      margin: 2px;
      background: #f0f0f0;
    }