@charset "UTF-8";
/*全て共通：hideエリアをはじめは非表示*/
.hide-area{
	display: none;
}

.modaal-close{
	height: 120px;
	width: 120px;
}
.modaal-close:after,
.modaal-close:before{
	background: rgb(168,0,168);
	height: 80px;
	left: 60px;
	top: 20px;
}
.modaal-close:focus:after,
.modaal-close:focus:before,
.modaal-close:hover:after,
.modaal-close:hover:before{
	background:#666;
}

/* MODAAL開いたときの背景 */
.cast_modaal_box{
	color: rgb(255,255,255);
}
.modaal-wrapper{
  background: url(../img/cast_bg.jpg) no-repeat center ;
	background-size: cover;
}
.modaal-wrapper{
  background-image: url(../img/cast_bg.jpg);
  background-color: #FCBB76;
  background-blend-mode: multiply;
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-attachment: fixed;
  color: rgb(255,255,255);
}
.modaal-container{
  background: rgba(255,255,255,0);
  box-shadow: none;
  font-family: 'Noto Serif JP', serif;
}
.modaal-content-container{
  padding: 100px 20px;
}
.cast_modaal_img{
  width: 50%;
  margin: 0 auto 50px;
  text-align: center;
}
.cast_modaal_img img{
  width: 100%;
	max-width: 350px;
}
.cast_modaal_txt{
  margin-top: 20px;
  line-height: 190%;
}

@media screen and (max-width: 912px){
  .modaal-wrapper{
		background-attachment: scroll;
		background-position: center top;
	}
	.cast_modaal_img img{
		max-width: 250px;
	}
}
@media screen and (max-width: 600px){
	.modaal-close{
		height: 50px;
		width: 50px;
	}
	.modaal-close:after,
	.modaal-close:before{
		height: 22px;
		left: 23px;
		top: 14px;
	}
  .modaal-content-container{
    padding: 60px 0;
  }
	.cast_modaal_txt{
		font-size: 15px;
	}
  .cast_modaal_img{
    width: 100%;
    margin: 0 auto 20px;
  }
}