@charset "UTF-8";






/* ----------------------------------------
	contentMain
---------------------------------------- */
.letter-inner {
	height: auto;
	background-color: #fff;
}
@media screen and (max-width: 1020px) {
    .letter-inner {
		width: 100%;
		height: auto;
    }
}


/* ---------------------------------------- */
.letteMain {
	position: relative;
	width: 1020px;
	margin: 0 auto;
	padding: 60px 0 0 0;
}
@media screen and (max-width: 1020px) {
    .letteMain {
		display: inline-block;
		width: 100%;
		padding: 40px 0 80px 0;
		overflow: hidden;
    }
}


/* ---------------------------------------- */
#wrap {
  position: relative;
	width: 1020px;
	height: 400px;
	margin: 0 auto;
  font-size: 14px;
	background: url(../images/letter/bg.jpg) repeat-x;
	background-size: auto 180px;
}
#wrap p {
  position: absolute;
  top: 220px;
  left: 550px;
	width: 460px;
}
@media screen and (max-width: 1020px) {
  #wrap {
		width: 100%;
		height: 560px;
		margin: 0 0 6% 0;
		background-size: auto 360px;
		/* overflow: hidden; */
    }
  #wrap p {
    position: inherit;
    top: 360px;
    left: 5%;
    width: 90%;
    font-size: 32px;
  }
}
.iphone #wrap p {
  font-size: 36px !important;
}
.android #wrap p {
  font-size: 34px !important;
}


.letterPhoto {
	position: absolute;
	top: 50px;
	left: -40px;
}
@media screen and (max-width: 1020px) {
  .letterPhoto {
		display: none;
    }
}
.letterTitle{
	position: absolute;
	top: 200px;
	left: 560px;
	width: 400px;
}
@media screen and (max-width: 1020px) {
  .letterTitle {
		position: relative;
		top: 170px;
		left: 5%;
		width: 96%;
    }
}
.letterLb {
	position: relative;
	top: 320px;
	left: 550px;
}
@media screen and (max-width: 1020px) {
  .letterLb {
		position: relative;
		top: 30px;
		left: 5%;
    }
}
.letterLb img {
	margin: 0 10px 0 0;
	padding: 4px;
	background: url(../images/letter/waku.png) no-repeat center center;
	float: left;
}
@media screen and (max-width: 1020px) {
  .letterLb img {
		width: 20%;
		margin: 0 30px 0 0;
		padding: 0;
		background: url(none);
		float: left;
    }
}
.letterMail {
	position: absolute;
	top: 520px;
	left: 550px;
	width: 240px;
}
@media screen and (max-width: 1020px) {
  .letterMail {
		position: relative;
		top: 0;
		left: 1%;
		width: 60%;
		margin: 60px 0 0 0;
    }
}
.letterContact {
	position: absolute;
	top: 544px;
	left: 550px;
	width: 240px;
}
@media screen and (max-width: 1020px) {
  .letterContact {
		position: relative;
		top: 0;
		left: 1%;
		width: 60%;
		margin: 20px 0 0 0;
    }
}


/* ---------------------------------------- */
.photoLb {
 	width: 100%;
	margin: 240px 0 0 0;
	font-size: 14px;
	text-align: center;
  clear: both;
}
.photoTitle {
	width: 400px;
  margin: 0 0 30px 0;
}
.photoLb ul {
  display: inline-block;
	margin: 0 0 100px 0;
}
.photoLb ul li {
 	width: 24%;
	margin: 0 1% 0 0;
	font-size: 12px;
	text-align: center;
	float: left;
}
.photoLb ul li img {
 	width: 100%;
	margin: 0 0 5px 0;
}
@media screen and (max-width: 1020px) {
  .photoLb {
 		width: 96%;
		margin: 120px 2% 0 2%;
  }
  .photoTitle {
    width: 96%;
    margin: 0 0 30px 0;
  }
    .photoLb ul {
		display: none;
    }
}
@media screen and (min-width: 1020px) {
	#visual {
		display: none;
	}
}
@media screen and (max-width: 1020px) {
	.screen img {
    margin: 2% 0 1% 0;
	}
	.screen p {
		font-size: 24px;
	}
}
.iphone .screen p {
  font-size: 28px !important;
}
.android .screen p {
  font-size: 12px !important;
}


.storyLb {
 	width: 100%;
	margin: 240px 0 0 0;
  font-size: 14px;
  text-align: center;
}
.storyTitle {
	width: 400px;
  margin: 0 0 30px 0;
}
.story-inner {
	width: 960px;
	margin: 0 0 20px 0;
  text-align: left;
}
.story-inner p {
  margin: 0 0 20px 100px;
}
@media screen and (max-width: 1020px) {
  .storyLb {
 		width: 96%;
		margin: 200px 2% 0 2%;
    text-align: center;
  }
  .storyTitle {
    width: 96%;
    margin: 0 0 30px 0;
  }
  .story-inner {
    width: 96%;
    margin: 0 2% 6% 2%;
  }
  .story-inner p {
    margin: 0 0 4% 0;
    font-size: 32px;
  }
  .story-inner p br {
    display: none;
  }
}
.iphone .story-inner p {
  font-size: 36px !important;
}
.android .story-inner p {
  font-size: 12px !important;
}


.castLb {
 	width: 100%;
	margin: 240px 0 0 0;
	font-size: 14px;
  text-align: center;
}
.castLbSP {
 	display: none;
}
.castTitle {
	width: 400px;
  margin: 0 0 30px 0;
}
.cast {
  display: inline-block;
	width: 960px;
	margin: 0 0 20px 0;
  clear: both;
  text-align: left;
}
.castPhoto {
	width: 240px;
	margin: 0 20px 0 0;
  float: left;
}
.castLb p span {
  display: inline-block;
  margin: 0 0 10px 0;
  color: #000;
  font-size: 18px;
  font-style: italic;
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif"
}
.castLb p span span {
  font-size: 14px;
}
.castLb .featherlight-sample {
    display: none;
  }
@media screen and (max-width: 1020px) {
  .castLb {
    display: none;
 		width: 96%;
		margin: 120px 2% 0 2%;
    text-align: center;
  }
  .castLbSP {
    display: inherit;
 		width: 96%;
		margin: 150px 2% 0 2%;
    text-align: center;
  }
  .castLbSP .castTitle {
    width: 96%;
    margin: 120px 0 30px 0;
  }
  .castLbSP .cast {
    display: inline;
    width: 44%;
    margin: 0 3% 6% 3%;
    clear: inherit;
    text-align: left;
    float: left;
  }
  .castLbSP .castPhoto {
    width: 100%;
    margin: 0 20px 0 0;
    float: left;
  }
  .castLbSP .featherlight-sample {
    display: none;
  }
}

.bannerLb {
 	width: 100%;
	margin: 240px 0 0 0;
	font-size: 14px;
  text-align: center;
}
.bannerTitle {
	width: 400px;
  margin: 0 0 30px 0;
}
.bannerLb-inner {
 	width: 520px;
	margin: 0 auto;
}
.banner {
  display: inline-block;
	margin: 0 20px 20px 0;
	font-size: 12px;
  text-align: center;
  float: left;
}
@media screen and (max-width: 1020px) {
  .bannerLb {
 	  width: 100%;
	  margin: 180px auto 240px;
    text-align: center;
  }
  .bannerTitle {
    width: 96%;
    margin: 0 0 30px 0;
  }
  .bannerLb-inner {
 		width: 90%;
		margin: 30px 5% 0 5%;
  }
  .bannerLb-inner img {
 		width: 100%;
  }
  .banner {
    display: inline;
    width: 46%;
    margin: 0 2% 6% 2%;
    font-size: 28px;
    text-align: center;
    white-space: nowrap;
    clear: inherit;
    float: left;
  }
}

.sponsorshipLb {
 	width: 100%;
	margin: 240px 0 0 0;
	font-size: 14px;
  text-align: center;
}
.sponsorshipLb p.read br {
 	display: none;
}
.sponsorshipTitle {
	width: 400px;
  margin: 0 0 30px 0;
}
.sponsorship-inner {
	width: 960px;
	margin: 30px 0 20px 0;
  text-align: left;
}
.sponsorship-inner .detail {
  display: inline-block;
  width: 100%;
  margin: 0 0 0 100px;
  text-align: center;
  clear: both;
}
.sponsorship-inner .detail p {
  text-align: left;
  white-space: nowrap;
  float: left;
}
.sponsorship-inner span.bronze {
  display: block;
  margin: 0 10px 5px 0;
  padding: 15px 20px 15px 20px;
  color: #fff;
  font-size: 16px;
  background-color: #a36b21;
  float: left;
}
.sponsorship-inner span.silver {
  display: block;
  margin: 0 10px 5px 0;
  padding: 15px 20px 15px 20px;
  color: #444;
  font-size: 16px;
  background-color: #c0c0c0;
  float: left;
}
.sponsorship-inner span.gold {
  display: block;
  margin: 0 10px 5px 0;
  padding: 15px 20px 15px 20px;
  color: #444;
  font-size: 16px;
  background-color: #ffd700;
  float: left;
}
.sponsorshipBtn {
	width: 1020px;
	margin: 30px 0 20px 0;
  text-align: center;
  clear: both;
}
.sponsorshipBtn .fBtn {
  display: block;
  width: 160px;
  margin: 0 auto;
  padding: 10px 20px 10px 20px;
  color: #fff;
  font-size: 16px;
  background-color: #000;
  float: none;
}
.sponsorshipBtn .fBtn a {
  color: #fff;
}

@media screen and (max-width: 1020px) {
  .sponsorshipLb {
 		width: 96%;
		margin: 80px 2% 0 2%;
    font-size: 24px;
    text-align: center;
  }
  .sponsorshipLb p.read br {
    display: inherit;
  }
  .sponsorshipTitle {
    width: 96%;
    margin: 0 0 30px 0;
  }
  .sponsorship-inner {
    width: 96%;
    margin: 4% 2% 6% 2%;
    text-align: left;
  }
  .sponsorship-inner .detail {
    display: inline-block;
    width: 100%;
    margin: 10px 0 0 0;
    text-align: center;
    clear: both;
  }
  .sponsorship-inner .detail p {
    width: 100%;
    font-size: 26px;
    white-space: inherit;
    float: left;
    line-height: 1.3;
  }
  .sponsorship-inner span.bronze {
    margin: 0 10px 10px 0;
    padding: 40px;
    color: #fff;
    font-size: 34px;
    background-color: #a36b21;
    float: left;
  }
  .sponsorship-inner span.silver {
    margin: 0 10px 10px 0;
    padding: 40px;
    color: #444;
    font-size: 34px;
    background-color: #c0c0c0;
    float: left;
  }
  .sponsorship-inner span.gold {
    margin: 0 10px 10px 0;
    padding: 40px;
    color: #444;
    font-size: 34px;
    background-color: #ffd700;
    float: left;
  }
  .sponsorshipBtn {
 		width: 96%;
		margin: 80px 2% 0 2%;
    font-size: 24px;
    text-align: center;
    clear: both;
  }
  .sponsorshipBtn .fBtn {
    display: block;
    width: 300px;
    margin: 0 auto;
    padding: 20px 30px 20px 30px;
    color: #fff;
    font-size: 32px;
    background-color: #000;
    float: none;
  }
}
.iphone .sponsorshipLb p {
  font-size: 28px !important;
}
.iphone .sponsorship-inner .detail p {
  font-size: 28px !important;
}
.iphone .sponsorship-inner span.bronze,
.iphone .sponsorship-inner span.silver,
.iphone .sponsorship-inner span.gold {
  font-size: 40px !important;
}
.iphone .sponsorshipBtn .fBtn {
  font-size: 36px !important;
}
.android .sponsorshipLb p {
  font-size: 12px !important;
}
.android .sponsorship-inner .detail p {
  font-size: 32px !important;
}


.theaterLb {
 	width: 100%;
	margin: 240px 0 0 0;
  font-size: 14px;
  text-align: center;
}
.theaterTitle {
	width: 400px;
  margin: 0 0 30px 0;
}
.theater-inner {
	width: 100%;
	margin: 0 0 20px 0;
  text-align: left;
}
.theater-inner img {
	width: 280px;
	margin: 0 20px 0 0;
  padding: 3px;
  border: solid 1px #cecece;
  float: left;
}
.theater-inner .theaterDetail {
	width: 700px;
  float: right;
}
.theater-inner p.line {
  padding: 15px 0 15px 0;
	border-bottom: dotted 2px #ccc;
}
/* .theater-inner p.line br {
  display: none;
} */
.theater-inner p.line a {
	color: #2baa3f;
}
@media screen and (max-width: 1020px) {
  .theaterLb {
 		width: 96%;
		margin: 280px 2% 0 2%;
    text-align: center;
  }
  .theaterTitle {
    width: 96%;
    margin: 0 0 30px 0;
  }
  .theater-inner {
    width: 96%;
    margin: 0 2% 6% 2%;
  }
  .theater-inner img {
    width: 80%;
    margin: 0 10% 2% 10%;
    padding: 1%;
    border: solid 1px #aaa;
    float: none;
  }
  .theater-inner a {
    pointer-events: none;
  }
  .theater-inner .theaterDetail a {
    pointer-events: auto;
  }
  .theater-inner .theaterDetail {
    width: inherit;
    float: none;
  }
  .theater-inner p.line {
    padding: 2% 0 2% 0;
    border-bottom: dotted 2px #aaa;
  }
  .theater-inner p.line br {
    display: inherit;
  }
  .theater-inner p.line a {
	color: #2baa3f;
  }
}
.iphone .theater-inner p {
  font-size: 36px !important;
}
.android .theater-inner p {
  font-size: 12px !important;
}




.infoLb {
 	width: 100%;
	margin: 40px 0 0 0;
  font-size: 14px;
  text-align: center;
}
.infoBtn {
	width: 1020px;
	margin: 30px 0 20px 0;
  text-align: center;
  clear: both;
}
.infoBtn .eBtn {
  display: block;
  width: 300px;
  margin: 0 auto;
  padding: 10px 20px 10px 20px;
  color: #fff;
  font-size: 16px;
  background-color: #000;
  float: none;
}
.infoBtn .eBtn a {
  color: #fff;
}
@media screen and (max-width: 1020px) {
  .infoLb {
 		width: 96%;
		margin: 80px 2% 0 2%;
    text-align: center;
  }
  .infoBtn {
 		width: 96%;
		margin: 80px 2% 0 2%;
    font-size: 20px;
    text-align: center;
    clear: both;
  }
  .infoBtn .eBtn {
    display: block;
    width: 80%;
    margin: 0 auto;
    padding: 20px 30px 20px 30px;
    color: #fff;
    font-size: 14px !important;
    background-color: #000;
    float: none;
  }
}
.iphone .infoBtn .eBtn {
  font-size: 36px !important;
}







.aboutLb {
 	width: 100%;
	margin: 240px 0 0 0;
	font-size: 14px;
  text-align: left;
  clear: both;
}
.aboutLb-inner {
 	width: 85%;
	margin: 0 auto;
}
.aboutLb-inner dl dt {
 	width: 25%;
  padding: 7px 0 6px 0;
  white-space: nowrap;
  float: left;
}
.aboutLb-inner dl dd {
 	width: 75%;
  padding: 6px 0 6px 0;
 	border-bottom: solid 1px #ccc;
  white-space: nowrap;
  float: right;
}
.aboutLb-inner dl dd p {
 	width: 100%;
}
.aboutLb-inner dl dd span {
	font-size: 12px;
}
@media screen and (max-width: 1020px) {
  .aboutLb {
 	  width: 100%;
	  margin: 240px auto 40px;
    font-size: 24px;
    text-align: left;
  }
  .aboutLb-inner {
 		width: 92%;
		margin: 80px 4% 0 4%;
  }
  .aboutLb-inner dl dt {
 		width: 100%;
 		padding: 1% 0 0 0;
 		white-space: inherit;
 		float: none;
  }
  .aboutLb-inner dl dt br {
 		display: none;
  }
  .aboutLb-inner dl dd {
 		width: 100%;
 		padding: 0 0 1% 0;
 		border-bottom: solid 1px #ccc;
 		white-space: inherit;
 		float: none;
  }
  .aboutLb-inner dl dd br {
 		display: none;
  }
}
.iphone .aboutLb-inner dl dt,
.iphone .aboutLb-inner dl dd {
  font-size: 24px !important;
}
.iphone .aboutLb-inner dd span {
  font-size: 23px !important;
}
.android .aboutLb-inner dl dt,
.android .aboutLb-inner dl dd {
  font-size: 13px !important;
}
.android .aboutLb-inner dd span {
  font-size: 11px !important;
}




.diaryLb {
  display: inline-block;
 	width: 100%;
	margin: 240px 0 0 0;
  font-size: 14px;
  text-align: center;
}
.diarytTitle {
	width: 400px;
  margin: 0 0 30px 0;
}
.sdiary-inner {
	width: 960px;
	margin: 0 0 20px 0;
  text-align: left;
}
.diaryPhoto {
	width: 350px;
	height: 350px;
  margin: 0 40px 0  30px;
  float: left;
}
.diaryPhoto img {
	width: 100%;
	height: 100%;
  object-fit: cover;
}
.diaryDate {
  width: 520px;
  text-align: left;
  float: left;
}
.diaryTitle {
  width: 520px;
  margin: 10px 0 0 0;
  font-size: 20px;
  text-align: left;
  float: left;
}
.diaryTitle a {
  color: #000;
}
.diaryArticle {
  width: 520px;
  margin: 20px 0 0 0;
  font-size: 14px;
  text-align: left;
  float: left;
}
.diaryMore {
  width: 520px;
  margin: 10px 0 0 0;
  font-size: 14px;
  text-align: left;
  float: left;
}
@media screen and (max-width: 1020px) {
  .diaryLb {
 		width: 92%;
		margin: 280px 4% 0 4%;
    text-align: center;
  }
  .diarytTitle {
    width: 96%;
    margin: 0 0 30px 0;
  }
  .diary-inner {
    width: 92%;
    margin: 0 4% 6% 4%;
  }
  .diaryPhoto {
 		width: 100%;
 		height: 60%;
 		margin: 0 0 4% 0;
 		float: none;
  }  
  .diaryPhoto img {
 		width: 100%;
 		height: 100%;
 		object-fit: cover;
  }
  .diaryDate {
 		width: 100%;
 		font-size: 20px;
 		text-align: left;
 		float: none;
  }
  .diaryTitle {
 		width: 100%;
 		margin: 10px 0 0 0;
 		font-size: 36px;
 		text-align: left;
 		float: none;
  }
  .diaryTitle a {
 		color: #000;
  }
  .diaryArticle {
 		width: 100%;
 		margin: 20px 0 0 0;
 		font-size: 24px;
 		text-align: left;
 		float: none;
  }
  .diaryMore {
 		width: 100%;
 		margin: 10px 0 0 0;
 		font-size: 20px;
 		text-align: left;
 		float: none;
  }
}
.iphone .diaryDate {
  font-size: 36px !important;
}
.iphone .diaryTitle {
  font-size: 46px !important;
}
.iphone .diaryArticle {
  font-size: 36px !important;
}
.iphone .diaryMore {
  font-size: 36px !important;
}
.android .diaryDate {
  font-size: 26px !important;
}
.android .diaryTitle {
  font-size: 46px !important;
}
.android .diaryArticle {
  font-size: 30px !important;
}
.android .diaryMore {
  font-size: 30px !important;
}





/* ---------------------------------------- */
.letter-bottom {
	min-height: 240px;
	background: url('../images/common/bgFooter.jpg') #fff center bottom no-repeat;
	background-size: cover;
}
@media screen and (max-width: 1020px) {
    .letter-bottom {
		height: 280px;
		background: url('../images/common/bgFooterSp.jpg') #fff center top no-repeat;
    	background-size: auto 180px;
    }
}
/* @media screen and (max-height: 800px) {
    .letter-bottom {
		background : url(none) #fff;
    }
} */