.modal_overlay { display: none; z-index: 9998; position: fixed; width: 100%; height: 100%; /* background: rgba(0, 0, 0, 0.7);  */cursor: pointer; background:  url(../images/index/welcome/bg_02.png) no-repeat center center; background-size: cover;}
/* .modal_overlay{background:  url(../images/index/welcome/bg_02.png) no-repeat center center; background-size: cover;} */
#modal { display: none; width: 92%; /* max-width: 1200px; */ max-width: 890px; height: 80%; margin: auto; left: 0; top: 0; bottom: 0; right: 0; position: fixed; z-index: 9999; }
#modal .close { position: absolute; z-index: 1; right: 50px; top: 40px; cursor: pointer; }
#modal iframe { /* border-radius: 10px; */ position: relative; z-index: 0; width: 100%; height: 100%; left: 0; top: 0; border: none; }

#modal2 { display: none; width: 92%; max-width: 640px; height: 600px; margin: auto; left: 0; top: 0; bottom: 0; right: 0; position: fixed; z-index: 9999; }
#modal2 .close { position: absolute; z-index: 1; right: 50px; top: 40px; cursor: pointer; }

#youtube_modal { box-sizing: border-box; padding: 30px 0; overflow: auto; display: flex; justify-content: center; flex-wrap: wrap; align-items: center; z-index: 9999; position: fixed; left: 0; top: 0; width: 100%; height: 100%; }
#youtube_modal .box { height: 80vh; width: 94%; max-width: 1000px; max-height: 850px; position: relative; }
#youtube_modal .box .close { position: absolute; top: 30px; right: 30px; z-index: 2; }
#youtube_modal .box iframe { z-index: 1; position: relative; width: 100%; height: 100%; border: none; }
#youtube_modal .overlay { z-index: 0; position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.7); cursor: pointer; }


@media only screen and (max-width: 768px) {
	
	#modal .close { width: 30px; height: auto; right: 30px; top: 30px;}
	#modal2 .close { width: 30px; height: auto; right: 30px; top: 30px;}
	#modal2 { height: 70%; }
	#youtube_modal .close { width: 30px; height: auto; }
}