@charset "utf-8";

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

.sisetu_catch{/*施設説明内　キャッチ*/
	display:grid;
	grid-template-columns: 2fr 3fr;
	gap:20px;
	> figure , > a{
		display:block;
			aspect-ratio: 3 / 2;
			position:relative;
			overflow: hidden;
			border-radius: 10px;
			background:#f2f2f2;
			img{
				min-width:100%;
				min-height:100%;
				object-fit: cover;
				position: absolute;
				top: 50%;
				transform: translate(-50%, -50%);
			}
	}
	> a{
		&::after{
			content:url(../grp/icon_youtube.png);
			position: absolute;
    	top: 50%;
    	left: 50%;
    	transform: translate(-50%, -50%);
    	-webkit-transform: translate(-50%, -50%);
    	-ms-transform: translate(-50%, -50%);
		}
		&:hover{
			img{
				opacity: .75;
			}
		}
	}
	div{
		h3{
			text-align: left;
			font-size: 1.2rem;
			font-weight: 600;
			color:rgb(var(--mainColor));
		}
		p{
			margin:.5em auto 0 auto;
			text-align: left;
		}
	}
	@container (max-width: 630px) {
		display:block;
		> figure , > a{
			width:min(400px,100%);
			margin:0 auto;
		}
		div{
			margin:20px auto 0 auto;
		}
	}
}

#house,#dantai{
  border:2px solid #333;
  padding:20px;
  border-radius: 15px;
  margin:30px auto 0 auto;
  > p{
    text-align: left;
  }
  section.sisetu_pay{
    width:auto !important;
    table{
      th{
        width:30%;
      }
    }
    > aside{
      font-size: 1rem;
      color:rgb(var(--baceFontColor));
    }
  }

  section.etc{
    margin:30px auto 0 auto;

    h3{
      text-align: left;
      font-weight: 500;

      font-size: 1.3rem;
    }
    ul{
      display:flex;
      justify-content: start;
			flex-wrap:wrap;
      gap:.3em 1em;
      margin:10px auto 0 auto;
      li{
        margin:0 0 0 2em;
        list-style:disc;
        font-size: 1.1rem;
      }
    }
    > aside{
      margin:10px auto 0 auto ;
      text-align: left;
    }
  }
}