@charset "utf-8";
/* CSS Document */


/* 全体への指示 */
body {
    font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", "sans-serif";
	font-size: 15px;
	background-color: black;
	margin: 0;
	padding: 0;
	min-width: 960px;
	-webkit-text-size-adjust: 100%;
}


h1 {
	font-size: 3.8rem;
	line-height: 4.3rem;
	letter-spacing: 5px;
	font-weight: lighter;
	color: #b8985a;
	font-family: 'EB Garamond', serif;
}

h2 {
	font-size: 2.5rem;
	line-height: 2.8rem;
	color: white;
	font-family: 'EB Garamond', serif;
}

h3 {
	font-size: 1.7rem;
	line-height: 2.0rem;
	color: white;
	font-family: 'EB Garamond', serif;
}


p {
	font-size: 1.7rem;
	line-height: 2.7rem;
	color: white;
	font-family: 'EB Garamond', serif;
	font-weight: 400;
}



.clearfix:after {
    content:" ";
    display:block;
    clear:both;
}

div.wrapper {
	overflow: hidden;
}


/*!
 * animate.css -http://daneden.me/animate
 * Version - 3.6.0
 * Licensed under the MIT license - http://opensource.org/licenses/MIT
 *
 * Copyright (c) 2018 Daniel Eden
 */

.animated {
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.animated.infinite {
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
}




/* メイン領域*/

main.main {
	display: block;
	margin: 0 auto;
}



/*========= LoadingのためのCSS ===============*/

/* Loading背景画面設定　*/
#splash {
    /*fixedで全面に固定*/
	position: fixed;
	width: 100%;
	height: 100%;
	z-index: 999;
	background:#333;
	text-align:center;
	color:#fff;
}

/* Loading画像中央配置　*/
#splash_logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

/* Loading アイコンの大きさ設定　*/
#splash_logo img {
	width: 600px;
}

/* fadeUpをするアイコンの動き */

.fadeUp{
animation-name: fadeUpAnime;
animation-duration:0.5s;
animation-fill-mode:forwards;
opacity: 0;
}

@keyframes fadeUpAnime{
  from {
    opacity: 0;
  }

  to {
    opacity: 1;
  }
}



/*========= レイアウトのためのCSS ===============*/

#splash {
    width:100%;
    height: 100vh;
    background: black;
    display: flex;
    justify-content: center;
    align-items: center;
    text-align: center;
	z-index: 9999999;
}

/*========= LoadingのためのCSSここまで ===============*/






/*ナビ領域*/

.site-header{
    background-color:rgba(0,0,0,0.50);
    display: flex;
    padding: 10px 0 10px 0;
    position: fixed;
    justify-content: space-between;
    width: 100%;
	z-index: 995;
}

.gnav {
	margin: 0 auto;
	width: 100%;
}

.gnav__menu{
    display: flex;
}

.gnav__menu__item {
	margin-right: 25px;
}

.gnav__menu__item img {
	height: 30px;
}

.gnav__menu__item img:hover {
	opacity:0.6 ;
	transition:0.5s ;
}

.gnav__menu__item a {
	text-decoration: none; 
	color: white;
	font-size: 25px;
	font-family: "Arial Black", Gadget, "sans-serif","HGP明朝E", "HGP明朝B";
}

.gnav__menu__item a:hover {
	color: #dfc174;
	text-decoration: underline;
	transition:0.5s ;
}

/*ナビ領域ここまで*/



    /*　PC　画面サイズが1001pxからはここを読み込む　*/

@media screen and (min-width:1001px) { 
	
div.mainER {
	padding-top: 80px;
	width: 100vw;
	min-width: 1000px;
	margin: 0 auto;
	position: relative;
}

div.mainimg {
	margin: 0 auto;
	width: 100%;
	text-align: center;
	background-image: url("../images/main.png");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding-bottom: calc(100%*1599/2500);
}

.jusho {
	width: 100%;
	min-width: 1000px;
	margin: 0 auto;
	position: absolute;
	bottom: 1%;
	right: -27.5%;
}

.jusho img {
	width: 47%;
}
	
div.date {
	padding-top: 75px;
	width: 1000px;
	min-width: 1000px;
	margin: 0 auto;
	text-align: center;
}

div.date img {
	width: 700px;
	border: 1px solid #b8985a;
}
	
div.date img:hover {
	opacity:0.6 ;
	transition:1.0s ;
}
	
}
    /*　PC　画面サイズが1001pxからはここを読み込む　*/



    /*　スマホ　画面サイズが1000pxまではここを読み込む　*/

@media screen and (max-width:1000px) { 
	
	
div.mainER {
	padding-top: 80px;
	width: 100vw;
	min-width: 1000px;
	margin: 0 auto;
	position: relative;
}

div.mainimg {
	margin: 0 auto;
	width: 100%;
	text-align: center;
	background-image: url("../images/main_tate.png");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding-bottom: calc(100%*1541/1100);
}

.jusho {
	display: none
}
	
div.date {
	padding-top: 25px;
	width: 1000px;
	min-width: 1000px;
	margin: 0 auto;
	text-align: center;
}

div.date img {
	width: 500px;
	border: 1px solid #b8985a;
}
	
}
	
    /*　スマホ　画面サイズが1000pxまではここを読み込む　*/





div.topbox {
	width: 1000px;
	height: 30px;
	margin: 0 auto;
	padding: 50px 0 75px 0;
}

div.topbox ul { 
	position: relative;
	left: 50%; 
	float: left;
}

div.topbox ul li{ 
	position: relative; 
	left: -50%; 
	float: left;
	list-style: none; 
	margin-right: 40px;
}

.topbox ul li:last-child {
	margin-right: 0;
}

.tw {
	float: left;
	margin-right: 10px;
}

.eigacom {
	float: left;
}

.button {
	margin: 0 auto;
	width: 1000px;
	text-align: center;
	position: relative; 
	overflow: hidden;
	padding: 50px 0 50px 0;
}

.button a img { 
	width: 200px;
}


.button a:hover {
	opacity:0.6 ;
	transition:1.0s ;
}

.twitter {
	position: absolute;
	top: 15px;
	right: 15px;
	text-align: center;
	display: block;
}
	
div.twitter img {
	width: 100px		
}


div.twitter img:hover {
	opacity:0.6 ;
	transition:1.0s ;
}	

/* メイン領域ここまで*/





/*予告ここから*/

.trailerBOX {
	width: 1000px;
	margin: 0 auto;
	text-align: center;
	padding: 50px 0 75px 0;
}

.trailerBOX iframe {
	width: 900px;
	height: 506.25px;
}



/*予告ここまで*/



/*イントロここから*/


.infoER02 {
	width: 100vw;
	min-width: 1000px;
	margin: 0 auto;
}

.infoimg02 {
	margin: 0 auto;
	width: 100%;
	text-align: center;
	background-image: url("../images/infophoto.png");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding-bottom: calc(100%*1690/1200);
}


.Intro {
	width: 100vw;
	min-width: 1000px;
	margin: 0 auto;
	padding-top: 50px;
}


.introread {
	text-align: center;
}

.introread a img {
	padding: 25px 0;
	width: 900px;
}


.IntroText {
	width: 900px;
	margin: 0 auto;
	padding: 50px 0 75px 0;
}

.IntroText p {
	width: 900px;
}

.IntroText img {
	width: 900px;

}

.IntroText h1 {
	text-align: center;
}

.read_image {
	width: 1000px;
	min-width: 1000px;
	margin: 0 auto;
	text-align: center;
	padding: 50px 0 75px 0;
}

.read_image img {
	width: 900px;
}


.infoER {
	width: 100%;
	min-width: 1000px;
	margin: 0 auto;
	text-align: center;
}

.infoER video {
	width: 900px;
	border-radius: 15px;
	border: 4px solid #b8985a;
}




/*ストーリーここから*/

.storyER {
	width: 100vw;
	min-width: 1000px;
	margin: 0 auto;
}

.StoryText {
	width: 900px;
	margin: 0 auto;
	padding: 75px 0;
	text-align: center;
}

.StoryText a img {
	padding-bottom: 40px;
	width: 400px;
}


#Story p {
	width: 900px;
	text-align: left;
	padding-bottom: 50px;
}

.storyphoto {
	text-align: center;
	padding-bottom: 60px;
}

.storyphoto a img {
	width: 900px;
	border-radius: 15px;
	border: 4px solid #b8985a;
}


/*コメントここから*/

.storyER {
	width: 100vw;
	min-width: 1000px;
	margin: 0 auto;
}

.CommentText {
	width: 900px;
	margin: 0 auto;
	padding: 75px 0;
}

.CommentRead01 {
	text-align: center;
}

.CommentRead01 a img {
	padding-bottom: 40px;
	width: 600px;
}

.CommentRead02 {
	text-align: center;
}

.CommentRead02 a img {
	padding-bottom: 40px;
	width: 900px;
}


#Comment p {
	width: 900px;
}








.footerER {
	width: 100vw;
	min-width: 1000px;
	margin: 0 auto;
	position: relative;
}

.footerIG {
	margin: 0 auto;
	width: 100%;
	text-align: center;
	background-image: url("../images/info00.png");
	background-position: center;
	background-repeat: no-repeat;
	background-size: cover;
	padding-bottom: calc(100%*591/1500);
}



footer {
	margin: 0 auto;
	background-color: black;
}


.billingAR {
	width: 1000px;
	margin: 0 auto;
	text-align: center;
}

.billingAR img {
	width: 800px;
	padding: 50px 0 0 0;
}

.eirin {
	width: 1000px;
	margin: 0 auto;
	text-align: center;
}

.eirin img {
	width: 200px;
	padding: 50px 0;
}

.kw_logo {
	width: 1000px;
	margin: 0 auto;
	text-align: center;
	padding: 0 0 100px 0;
}

.kw_logo img {
	width: 100px;
}

.kw_logo ul li:last-child {
	margin-right: 0;
}