@charset "utf-8";

/* スマホ　start */

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


.movie-image-wrapper {
  width:100%;
	height:100%;
	min-height:300px;
  margin: 0px auto;
  text-align:center;
	background-size:cover;
	position:relative;
	background-repeat:no-repeat;
}
.movie-image.lazyloaded {
	background-image:url('../movie/images/movie-main-sp.webp');
  animation-name: fadein-top;
  animation-duration: 2s;
}
.movie-cp {
 width:80%;
 padding:0px;
 position:absolute;
 top:50%;
 left:50%;
 -webkit-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
 text-align:center;
 filter: drop-shadow(1px 1px 1px #333);
}



.contents-wrapper {
 width:90%;
 margin: 0 auto ;
 padding: 0;
 text-align:center;
}
.contents-wrapper:after {
 content: '';
 display: block;
 clear: both;
}


.movie-about-block {
  margin: 100px auto;
  padding: 0;
  text-align:center;
}
.movie-about-block:after {
  content: '';
  display: block;
  clear: both;
}
.movie-about-block h2  {
  margin: 0 auto;
  padding:40px 0 0 0;
  font-size:20px;
  text-align:left;
  color:#333;
  background-image:url('../images/about-title-bg.svg');
  background-repeat:no-repeat;
  background-position: left;
  background-size: 400px;
  height:100px;
}

.movie-about-sub {
  margin: 0px 0 0 0;
  padding:0;
  font-size:20px;
  text-align:left;
  font-weight:bold;
  display:block;
  color:#ff6600;
}
.movie-about-block p {
  margin: 20px 0 0 0;
  padding:0;
  font-size:17px;
  text-align:left;
  line-height:1.8;
}

.movie-about-image {
  margin: 0px 0 0 30px;
  padding:0;
  text-align:right;
  width:120px;
  float:right;
  vertical-align:top;
}

ul.movie-list li {
  margin: 20px 0 0 10px;
  padding:0 0 0 38px;
  font-size:18px;
  text-align:left;
  background: url('../images/mark.svg') left 0px top 2px no-repeat;
  background-size: 26px auto;
  font-weight:bold;
}

.movie-price-block {
  margin: 100px auto;
  padding: 0 0 60px 0;
  text-align:center;
}
.movie-price-block:after {
  content: '';
  display: block;
  clear: both;
}
.movie-price-block h2  {
  margin: 0 auto;
  padding:40px 0 0 0;
  font-size:24px;
  text-align:left;
  color:#333;
  background-image:url('../images/about-title-bg.svg');
  background-repeat:no-repeat;
  background-position: left;
  background-size: 400px;
  height:100px;
}
.movie-price-box {
  margin: 60px auto;
  padding: 0;
  text-align:center;
}
.movie-price-box:after {
  content: '';
  display: block;
  clear: both;
}
.movie-price-box h3  {
  margin: 0;
  font-size:18px;
  text-align:left;
  color:#ff6600;
}
.movie-price-block p  {
  margin: 10px 0 0 0;
  text-align:left;
}

.movie-price-table {
  border-collapse: collapse;
  width: 98%;
  margin:10px auto ;
  text-align:center;
}

.movie-price-table th {
  padding: 10px;
  border: 1px solid #999;
  text-align: center;
  width: 30%;
}
.movie-price-table td {
  padding: 10px;
  border: 1px solid #999;
  text-align:left;
}


.movie-order-table {
  border-collapse: collapse;
  width: 90%;
  margin:20px auto;
  text-align:center;
}
.movie-order-table td {
  padding: 5px;
  border: 1px solid #999;
  text-align:left;
  color:#333;
  display:block;
  width:100%;
  border-top:none;
}
.movie-order-table th {
  padding: 5px;
  text-align: center;
  display:block;
  color:#333;
  border: 1px solid #999;
  width:100%;
  border-bottom:none;
}
input, select, textarea {
font-size: 100%;
}
 .waku-long{width:90%;}
 .waku-50{width:90%;}
 .waku1{width:90%;}
 .waku-min{width:90px;}


.submit-block {
 margin: 40px auto;
 text-align:center;
 font-size:16px;
}
.submit-block p {
 margin: 40px auto;
 text-align:center;
 font-size:16px;
}
.submit {
 margin: 20px 0 0 0;
 text-align:center;
}

.submit-button {
  display       : inline-block;
  font-size     : 16px;
  text-align    : center;
  padding       : 8px 20px;
  background    : #159a8f; 
  color         : #fff;
  line-height   : 1em;
  transition    : .3s;
  border:none;
}
}
/* スマホ　end */



/* PC　start */
@media screen and (min-width: 769px) {


.movie-image-wrapper {
  width:100%;
	height:100%;
	min-height:900px;
  margin: 0px auto;
  text-align:center;
	background-size:cover;
	position:relative;
	background-repeat:no-repeat;
}
.movie-image.lazyloaded {
	background-image:url('../movie/images/movie-main.webp');
  animation-name: fadein-top;
  animation-duration: 2s;
}
.movie-cp {
 width:50%;
 padding:30px;
 min-width:300px;
 position:absolute;
 top:50%;
 left:50%;
 -webkit-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
 text-align:center;
 filter: drop-shadow(1px 1px 1px #333);
}



.contents-wrapper {
 width:80%;
 min-width:960px;
 max-width:1400px;
 margin: 0 auto ;
 padding: 0;
 text-align:center;
}
.contents-wrapper:after {
 content: '';
 display: block;
 clear: both;
}


.movie-about-block {
  margin: 100px auto;
  padding: 0;
  text-align:center;
}
.movie-about-block:after {
  content: '';
  display: block;
  clear: both;
}
.movie-about-block h2  {
  margin: 0 auto;
  padding:40px 0 0 0;
  font-size:24px;
  text-align:left;
  color:#333;
  background-image:url('../images/about-title-bg.svg');
  background-repeat:no-repeat;
  background-position: left;
  background-size: 400px;
  height:100px;
}

.movie-about-sub {
  margin: 0px 0 0 0;
  padding:0;
  font-size:20px;
  text-align:left;
  font-weight:bold;
  display:block;
  color:#ff6600;
}
.movie-about-block p {
  margin: 20px 0 0 0;
  padding:0;
  font-size:17px;
  text-align:left;
  line-height:1.8;
}

.movie-about-image {
  margin: 0px 0 0 30px;
  padding:0;
  text-align:right;
  width:360px;
  float:right;
  vertical-align:top;
}

ul.movie-list li {
  margin: 20px 0 0 10px;
  padding:0 0 0 38px;
  font-size:18px;
  text-align:left;
  background: url('../images/mark.svg') left 0px top 2px no-repeat;
  background-size: 26px auto;
  font-weight:bold;
}

.movie-price-block {
  margin: 100px auto;
  padding: 0 0 60px 0;
  text-align:center;
}
.movie-price-block:after {
  content: '';
  display: block;
  clear: both;
}
.movie-price-block h2  {
  margin: 0 auto;
  padding:40px 0 0 0;
  font-size:24px;
  text-align:left;
  color:#333;
  background-image:url('../images/about-title-bg.svg');
  background-repeat:no-repeat;
  background-position: left;
  background-size: 400px;
  height:100px;
}
.movie-price-box {
  margin: 60px auto;
  padding: 0;
  text-align:center;
}
.movie-price-box:after {
  content: '';
  display: block;
  clear: both;
}
.movie-price-box h3  {
  margin: 0;
  font-size:18px;
  text-align:left;
  color:#ff6600;
}
.movie-price-block p  {
  margin: 10px 0 0 0;
  text-align:left;
}

.movie-price-table {
  border-collapse: collapse;
  width: 98%;
  margin:10px auto ;
  text-align:center;
}

.movie-price-table th {
  padding: 10px;
  border: 1px solid #999;
  text-align: center;
  width: 30%;
}
.movie-price-table td {
  padding: 10px;
  border: 1px solid #999;
  text-align:left;
}


.movie-order-table {
  border-collapse: collapse;
  width: 90%;
  margin:20px auto;
  text-align:center;
}
.movie-order-table td {
  padding: 5px;
  border: 1px solid #999;
  vertical-align:middle;
  text-align:left;
  color:#000;
}
.movie-order-table th {
  padding: 5px;
  text-align: center;
  vertical-align:middle;
  width: 25%;
  color:#000;
  border: 1px solid #999;
}
input, select, textarea {
font-size: 100%;
}
@media only screen and (min-width : 768px){
 .waku-long{width:30%;}
 .waku-50{width:50%;}
 .waku1{width:100%;}
 .waku-min{width:50px;}
}

.submit-block {
 margin: 40px auto;
 text-align:center;
 font-size:16px;
}
.submit-block p {
 margin: 40px auto;
 text-align:center;
 font-size:16px;
}
.submit {
 margin: 20px 0 0 0;
 text-align:center;
}

.submit-button {
  display       : inline-block;
  font-size     : 16px;
  text-align    : center;
  padding       : 8px 20px;
  background    : #159a8f; 
  color         : #fff;
  line-height   : 1em;
  transition    : .3s;
  border:none;
}
.submit-button:hover {
  color         : #fff;
  background    : #ff9900;
}


}
/* PCメイン　end */


