@charset "utf-8";

@import url("../../style/variables.css");/*変数定義*/
	
:root{
}

#gaikan{
  width: min(640px,100%);
	margin:0 auto;
  border-radius: 10px;
  overflow: hidden;
}

dl#prf{
  width:min(760px,100%);
  margin:50px auto 0 auto;
  display:grid;
  grid-template-columns: 10em 1fr;
  border-bottom:1px solid silver;
  > *{
    border-top:1px solid silver;
    padding:1em 1em;
  }
  dt{
    &:nth-of-type(odd){
      background:#f2f2f2;
    }
  }
  dd{
    text-align: left;
    &:nth-of-type(odd){
      background:#f2f2f2;
    }
  }
  @media (max-width: 768px) {
    display:block;
    > *{
      border-top:none;
      padding:0;
    }
    dt{
      text-align: left;
      padding:.5em .5em 0 .5em;
      font-weight: 500;
    }
    dd{
      padding:0 .5em .5em .5em;
    }
    
  }
}

#room_ph{
  margin:50px auto 0 auto;
  display:grid;
  grid-template-columns: repeat(3,1fr);
  gap:20px;
  img{
    border-radius: 10px;
  }
  figcaption{
    margin:.5em auto 0 auto;
  }
  @media (max-width: 768px) {
    grid-template-columns: repeat(auto-fill,minmax(min(200px,100%),1fr));
  }
}

#access{
	> div{		
		p{
			width: min(640px,100%);
			margin:0 auto;
      text-align: left;
		}
		iframe{
			margin:30px auto 0 auto;
			width:100%;
			height:min(600px,90vh);
		}
	}
}