@font-face {
  font-family: 'Montserrat';
  src: url('../fonts/Montserrat/Montserrat-Bold.woff') format('woff');
  font-weight: 700;
}
@font-face {
  font-family: 'Noto Sans JP';
  src: url('../fonts/NotoSansJP/NotoSansJP-Regular.woff') format('woff');
  font-weight: 400;
}
@font-face {
  font-family: 'Noto Sans JP';
  src: url('../fonts/NotoSansJP/NotoSansJP-Medium.woff') format('woff');
  font-weight: 500;
}
@font-face {
  font-family: 'Noto Sans JP';
  src: url('../fonts/NotoSansJP/NotoSansJP-Bold.woff') format('woff');
  font-weight: 700;
}

html{
  font-size: 62.5%; /*62.5% = 16px;*/
}

body{
  /*font-family:  'Noto Sans JP', sans-serif;*/
  font-family: "A1 Gothic M", "Noto Sans JP", "Noto Sans CJK JP", "Noto Sans Japanese", メイリオ, Meiryo, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  min-height: 100vh;
  min-height: calc(var(--vh, 1vh) * 100);
}


img {
width:100%;
max-width: 100%;
height: auto;
}

.ttl-01{
 position: absolute;
 bottom: 3%;
 left: 3%;
 z-index: 10;
 background: #181818;
 border-radius: 8px;
 padding: 24px 28px;
 font-size: 2.4rem;
}

.ttl-01 h2{
 font-size: 2.4rem;
 margin: 0;
}

.ttl-01 h2 span{
 display: block;
 font-size: 1.6rem;
}


.fill {
    fill: #181818; 
}

.nav svg {
    width: 23px;
    height: 23px;
 transform: rotate(180deg);
}


ul{
  list-style: none;
  padding: 0;
  margin: 0;
}

.header {
display: flex;
color: #181818;
justify-content: space-between;	
align-items: center;
width: 94%;
z-index: 10;	
position: fixed;
top: 20px;
left: 150px; 
}


.header .p-header-logo {
    /*position: fixed;*/
    /*z-index: 500;*/
    width: 200px;
    height: 46px;
    padding: 10px 16px 0;
    background-color: #ffffff;
    border-radius: 8px;
}

.header div.nav {
background: #FFFFFF;
border: 1px solid #ECEAEA;
border-radius: 30px; 
padding: 13px 32px; 
font-size: 13px; 
}

.header div.nav a.g-btn {
color: #181818;
text-decoration: none;
margin-right: 1em;
}

.header div.nav a:last-child {
color: #BD2222;
text-decoration: none;
margin-left: 1em; 
}


.header h1 {
display: inline-block;
width: 410px;
margin: 0px 0 0px 24px;
}


/*　ハンバーガーボタン　*/
.header .hamburger a.btn_map img {
width: 50px;
}

.header .hamburger.active a.btn_map{
display: none;
}

.header .hamburger {
  display : block;
  position: fixed;
  z-index : 3;
right: 100px;
    bottom: 20px;
  /*width : 42px;
  height: 42px;*/
  /*cursor: pointer;*/
  /*text-align: center;*/
  /*background: rgba(2,104,177,0.9);*/
}
.header .hamburger span {
  display : block;
  position: absolute;
  /*width   : 30px;
  height  : 2px ;
  left    : 6px;*/
  /*background : #fff;*/
  /*-webkit-transition: 0.3s ease-in-out;
  -moz-transition   : 0.3s ease-in-out;
  transition        : 0.3s ease-in-out;*/
}
.header .hamburger span:nth-child(1) {
  top: 10px;
}
.header .hamburger span:nth-child(2) {
  top: 20px;
}
.header .hamburger span:nth-child(3) {
  top: 30px;
}

/* ナビ開いてる時のボタン */
.header .hamburger.active {
background: #fff; 
width : 42px;
height: 42px; 
/*top: 0;
right: 0; */
z-index : 501; 
    top: 40px;
    right: 40px; 
}

.header .hamburger.active span:nth-child(1) {
  top : 18px;
  left: 7px;
  -webkit-transform: rotate(-45deg);
  -moz-transform   : rotate(-45deg);
  transform        : rotate(-45deg);
 width   : 30px;
  height  : 2px;
 overflow: hidden;
 background : #BD2222;
}

.header .hamburger.active span:nth-child(2),
.header .hamburger.active span:nth-child(3) {
  top: 18px;
  -webkit-transform: rotate(45deg);
  -moz-transform   : rotate(45deg);
  transform        : rotate(45deg);
 width   : 30px;
  height  : 2px;
  left: 7px;
 overflow: hidden;
 background : #BD2222;
}
 
.header div.globalMenuSp{
display: block;
} 

.header div.globalMenuSp {
  position: fixed;
  z-index : 500;
  top  : 0;
  right : 0;
  color: #000;
  background: #fff;
  text-align: center;
  transform: translateY(-100%);
  transition: all 0.6s;
  width: 50%;
  height: 100%;
 padding: 40px;
     overflow: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 50px;
}

/*div.scroll{
 overflow:scroll;
}*/

.header div.globalMenuSp ul {
 background: rgba(255,255,255,0.8);
 margin: 40px auto 40px;
 padding: 0;
 width: 100%;
 display: flex;
 flex-wrap: wrap; 
 gap: 16px 24px;
 /*justify-content: space-around;*/
}

.header div.globalMenuSp ul li {
 /*flex-grow: 1;*/
  list-style-type: none;
  padding: 0;
  width: 168px;
border: 1px solid #ECEAEA;
border-radius: 40px;
font-weight: 700; 
}

.header div.globalMenuSp ul::before{
  content:"";
  display: block;
  width:23%;
  order:1;
}
.header div.globalMenuSp ul::after{
  content:"";
  display: block;
  width:23%;
}




.header div.globalMenuSp ul li a {
 font-size: 12px;
  display: block;
  color: #181818;
  padding: 0.5em 0;
  text-decoration :none;
}

.header div.globalMenuSp ul li a span {
margin-left: 10px;
}

/* このクラスを、jQueryで付与・削除する */
.header div.globalMenuSp.active {
  transform: translateY(0%);
} 

.header div.globalMenuSp h3{
padding: 1em 0; 
background: #181818;
/*width: 120px;*/
 width: 180px;
color: #fff;
text-align: center;
margin: 0.5em auto 0.5em;
font-size: 62.5%
}

.header div.globalMenuSp p{
color: #A6A3A3;
font-size: 13px;
text-align: left;
padding: 10px 0 35px; 
}

.header .map_box{
border: 1px solid #ECEAEA;
padding: 40px;
margin: 3em auto 0;
}

.header .map_box .map_box_wrapper{
  display : block;
  position: relative;
  width : 100%;
}

.header .map_box .map_box_wrapper:before{
  content: '';
  display : block;
  padding-top : 46.80656934%;
}

.header .map_box .map_box_wrapper img.map{
  width : 100%;
  height : 100%;
  position: absolute;
  top : 0px;
  left : 0px;
  display : block;
}

.header .map_box .map_box_wrapper .mappoint{
  width : 3.722627737%;
  height : 7.953216374%;
  position: absolute;
  display : block;
  cursor: pointer;
}

.mappoint_blue{
  background-image: url(../images/map-icon-blue.png);
  background-size: contain;
  background-repeat: no-repeat;
}

.mappoint_red{
  background-image: url(../images/map-icon-red-01.png);
  background-size: contain;
  background-repeat: no-repeat;
}

/* 玄関 */
.mappoint_01{top : 56.23781676%;left : 7.253649635%;}
/* コミュニティリビング1 */
.mappoint_02{top : 51.82724252%;left : 16.17418351%;}
/* コミュニティリビング2 */
.mappoint_03{top : 51.82724252%;left : 29.23794712%;}
/* グリーンサロン */
.mappoint_04{top : 67.64132554%;left : 18.24817518%;}
/* ダイニング */
.mappoint_05{top : 56.82261209%;left : 37.59124088%;}
/* キッチン */
.mappoint_06{top : 36.64717349%;left : 37.59124088%;}
/* パウダールーム */
.mappoint_07{top : 8.674463938%;left : 35.58394161%;}
/* 主寝室 */
.mappoint_08{top : 18.81091618%;left : 5.018248175%;}
/* フィッティングルーム */
.mappoint_09{top : 35.47758285%;left : 7.436131387%;}
/* リビング */
.mappoint_10{top : 33.33333333%;left : 75.59306569%;}
/* キッチン */
.mappoint_11{top : 16.66666667%;left : 67.15328467%;}
/* 主寝室 */
.mappoint_12{top : 50.7797271%;left : 91.33211679%;}
/* 洋室 */
.mappoint_13{top : 60.81871345%;left : 57.48175182%;}
/* プレイルーム */
.mappoint_14{top : 70.27290448%;left : 68.20255474%;}
/* ロフト */
.mappoint_15{top : 34.88372093%;left : 90.51321928%;}




.v_screen{
  display: none;
}



@media screen and  (max-width:1502px) {
.header div.globalMenuSp ul {
 background: rgba(255,255,255,0.8);
 margin: 40px auto 40px;
 padding: 0;
 width: 100%;
 display: flex;
 flex-wrap: wrap; 
 gap: 16px 24px;
 justify-content: space-around;
}
} 

/*@media screen and  (max-width:1115px) {*/
@media screen and  (max-width:1311px) {
.header div.globalMenuSp ul {
 background: rgba(255,255,255,0.8);
 margin: 40px auto 40px;
 padding: 0;
 width: 100%;
 display: flex;
 flex-wrap: wrap; 
 gap: 16px 24px;
 justify-content: space-around;
}
 
.header div.globalMenuSp ul::before{
  content:none;
  display: block;
  width:0%;
  order:1;
}
.header div.globalMenuSp ul::after{
  content:none;
  display: block;
  width:0%;
} 
 
 

} 



/* スマホ横 */
@media  only screen and (min-width: 0px) and (max-width:1023px) and (orientation: landscape){ 
.p-header-menu-trigger--pc {
    display: none!important;
}
 
.p-header-menu-trigger--sp {
    display: inline-block!important;
} 
 
header h1 .logo{
width: 70%;
margin-left: 0.5em;
}

header .btn_theater{
background: #b71c25;
border-radius: 14px;
text-align: center;
color: #fff;
padding: 0.3em 1.5em;
height: 1.5em;
text-decoration: none;
margin-top: 0em;
margin-right: 0.5em; 
overflow: hidden;
display: block;
font-size: 14px;
}
 
.header div.globalMenuSp {
    position: fixed;
    z-index: 500;
    top: 0;
    right: 0;
    color: #000;
    background: #fff;
    text-align: center;
    transform: translateY(-100%);
    transition: all 0.6s;
    width: 100%;
    height: 100%;
    padding: 40px;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
    margin-bottom: 50px;
} 
 
.header .hamburger.active {
    background: #fff;
    width: 42px;
    height: 42px;
    z-index: 501;
    top: 20px;
    left: 20px;
} 
  
/*.header .hamburger {
    display: block;
    position: fixed;
    z-index: 3;
    right: 76px;
    bottom: 14px;
}*/ 
 
.v_screen{
  display: none;
} 
 
 
.c-page-nav {
  display: none;
} 
 
}


/* スマホ縦 */
@media only screen and (min-width: 0px) and (max-width:899px) and (orientation: portrait){
.v_screen{
    display: block;
    position: fixed;
    z-index: 2000;
    top:0;
    height: 100%;
    background-color: #fff;
}

.v_screen div{
    position: relative;
    top: 50%;
    transform: translateY(-50%);
}

.v_screen img{width: 100vw;}
body#screen  {
background-image: none;
background-repeat: no-repeat;
background-size: 100vw;
background-color: #fff;
} 
 
}