/* CSS Document */

.movBG {
	background: #fff;
	box-shadow: 0 0 30px rgba(200,200,200,0.2);
	padding: 40px;
	box-sizing: border-box;
	margin-bottom: 40px;
}

.youtubeMOV {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtubeMOV iframe {
  width: 100%;
  height: 100%;
}



@media screen and (max-width: 834px){
	

.movBG {
	background: #fff;
	box-shadow: 0 0 30px rgba(200,200,200,0.2);
	padding: 15px;
	box-sizing: border-box;
	margin-bottom: 20px;
}

.youtubeMOV {
  width: 100%;
  aspect-ratio: 16 / 9;
}
.youtubeMOV iframe {
  width: 100%;
  height: 100%;
}
	
}



/* オーバーレイ */
.office-modal-overlay {
    display: none;                /* 初期状態は非表示 */
    position: fixed;
    inset: 0;                     /* top, right, bottom, left: 0; と同じ */
    background: rgba(0,0,0,0.6);
    z-index: 9999;
    justify-content: center;
    align-items: center;
}

/* 表示状態 */
.office-modal-overlay.is-active {
    display: flex;
}

/* モーダル本体 */
.office-modal {
    background: #fff;
    max-width: 1000px;
    width: 90%;
    
    padding: 20px 24px 40px 24px;;
    position: relative;
    box-sizing: border-box;
}

.closeWRAP {
	   max-width: 800px;
	margin: auto;
}

/* 閉じるボタン */
.office-modal__close {
    position: absolute;
    top: -10px;
    right: 8px;
    border: none;
    background: transparent;
    font-size: 3rem;;
    cursor: pointer;
	background: #00b6c9;
	width: 60px;
	height: 60px;
	line-height: 50px;
	border-radius: 50%;
	color: #fff;
	z-index: 1;
}

/* モーダルの本文 */
.office-modal__body {
    max-height: 60vh;
    overflow-y: auto;
}


/* モーダルの本文 */
.office-modal__body h3 {
    margin-top: 0;
}

/* Googleマップをレスポンシブ気味に */
.office-modal-map iframe {
    width: 100%;
    height: 350px;
    max-width: 100%;
}

.modalTITLE {
	background: #071933;
	color: #fff;
	padding: 10px 20px;
	line-height: 1.6;
	font-size: clamp(1.7rem, 2vw, 2.2rem);
	margin-bottom: 10px;
	font-weight: bold;
}
.mapFRAME {
	margin-bottom: 10px;
}
.mapFRAME iframe {
	width: 100%;
	height: 450px;
}

.areaTITLE {
	border-bottom: 2px solid #071933;
	padding-bottom: 5px;
	margin-bottom: 10px;
	font-size: clamp(1.6rem, 1.7vw, 1.8rem);
	line-height: 1.6;
	font-weight: bold;
}
.accessLIST  {
	margin-left: 2rem;
	margin-bottom: 30px;
}
.accessLIST li {
	list-style-type: disc;
	line-height: 1.6;
}

@media screen and (max-width: 834px){
	

/* オーバーレイ */
.office-modal-overlay {
    display: none;                /* 初期状態は非表示 */
    position: fixed;
    inset: 0;                     /* top, right, bottom, left: 0; と同じ */
    background: rgba(0,0,0,0.6);
    z-index: 9999;
    justify-content: center;
    align-items: center;
}

/* 表示状態 */
.office-modal-overlay.is-active {
    display: flex;
}

/* モーダル本体 */
.office-modal {
    background: #fff;
    max-width: 1000px;
    width: 90%;
    
    padding: 15px 15px 30px 15px;
    position: relative;
    box-sizing: border-box;
}

.closeWRAP {
	   max-width: 800px;
	margin: auto;
}

/* 閉じるボタン */
.office-modal__close {
    position: absolute;
    top: -20px;
    right: 8px;
    border: none;
    background: transparent;
    font-size: 3rem;;
    cursor: pointer;
	background: #00b6c9;
	width: 60px;
	height: 60px;
	line-height: 50px;
	border-radius: 50%;
	color: #fff;
	z-index: 1;
}

/* モーダルの本文 */
.office-modal__body {
    max-height: 60vh;
    overflow-y: auto;
}


/* モーダルの本文 */
.office-modal__body h3 {
    margin-top: 0;
}

/* Googleマップをレスポンシブ気味に */
.office-modal-map iframe {
    width: 100%;
    height: 150px;
    max-width: 100%;
}

.modalTITLE {
	background: #071933;
	color: #fff;
	padding: 10px 20px;
	line-height: 1.6;
	font-size: clamp(1.7rem, 2vw, 2.2rem);
	margin-bottom: 10px;
	font-weight: bold;
}
.mapFRAME {
	margin-bottom: 10px;
}
.mapFRAME iframe {
	width: 100%;
	height: 200px;
}

.areaTITLE {
	border-bottom: 2px solid #071933;
	padding-bottom: 5px;
	margin-bottom: 10px;
	font-size: clamp(1.6rem, 1.7vw, 1.8rem);
	line-height: 1.6;
	font-weight: bold;
}
.accessLIST  {
	margin-left: 2rem;
	margin-bottom: 30px;
}
.accessLIST li {
	list-style-type: disc;
	line-height: 1.6;
}

}


#officeDetail .map {
	width: 100%;
	height: 450px;
	background-color: #eee;
	margin: 10px 3% 30px 0;
}
.mapBUTTON {
margin:40px 0 40px;
}