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

/* ------------------------------ */
/* サイト全体ふわっと現れる */
.container{animation: fadeIn 2s ease 0s 1 normal;
-webkit-animation: fadeIn 2s ease 0s 1 normal;}
@keyframes fadeIn{0%{opacity:0}100%{opacity: 1}}
@-webkit-keyframes fadeIn{0%{opacity:0}100%{opacity:1}}
/* スクロールフェード表示 */
.fadein{opacity:0;transform: translateY(20px);transition:all 1s;}
/* ------------------------------ */
/* 基本設定 */
html,body{background-color:#FFF;color:#1a1a1a;
font-family:"游ゴシック体",YuGothic,"游ゴシック Medium","Yu Gothic Medium","游ゴシック","Yu Gothic",sans-serif;
letter-spacing:.08em;cursor:default;padding:0;margin:0;}
img{width:100%;height:auto;}
h2,h3,h4,h5,h6{font-weight:normal;padding:0;margin:0;}
a{color:#1a1a1a;text-decoration:none;outline:none;}
em{font-weight:bold;}
@media screen and (min-width:769px){
/* リンクをフェードさせる */
a{-webkit-transition:.3s ease-in-out;
-moz-transition:.3s ease-in-out;
-o-transition:.3s ease-in-out;
transition:.3s ease-in-out;}
a:hover{opacity:.7;filter:alpha(opacity=70);}}
/* ------------------------------ */
/* フォント設定 */
.text_01{font-weight:bold;}
.text_02{color:#D84347;font-weight:bold;}
/* ------------------------------ */
/* 非表示設定 */
@media screen and (min-width:769px){
.pc-non{display:none;}}
@media screen and (max-width:768px){
.sp-non{display:none;}}
/* ------------------------------ */

@media screen and (min-width:769px){
/* ------------------------------ */
/* ヘッダー */
header .main{
	width:100%;
	margin-bottom:60px;
}
/* ------------------------------ */
/* あらすじ */
.story .wrap{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
	width:90%;
	max-width:1060px;
	margin:0 auto 120px;
}
.story .img{
	width:24%;
	margin-right:10%;
}
.story .title{
	width:4%;
	margin-right:3%;
}
.story .info{
	width:58%;
	border-left:.04em dashed #00315a;
	box-sizing:border-box;
	color:#00315a;
	padding-left:6%;
}
.story .info h1{
	font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	font-size:1.2em;
	line-height:260%;
	margin-bottom:40px;
}
.story .info h1 span{
	display:block;
	font-size:1.8em;
}
.story .info p{
	font-size:.85em;
	line-height:180%;
	margin-bottom:20px;
}
/* ------------------------------ */
/* キャスト紹介 */
.cast{
	background:url("../images/line_01.svg") no-repeat bottom;
	padding-bottom:80px;
}
.cast .wrap_01,
.cast .wrap_02,
.cast .wrap_03{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	width:90%;
	max-width:1200px;
	padding-bottom:60px;
	margin:0 auto;
}
.cast .wrap_03{
	max-width:1000px;
}
.cast .wrap_01 .info{
	width:48%;
}
.cast .wrap_02 .info{
	width:30%;
}
.cast .wrap_03 .info{
	width:48%;
}
.cast .title{
	background:url("../images/icon_01.svg") no-repeat bottom;
	background-size:auto 20px;
	color:#00315a;
	font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	font-size:2.4em;
	font-weight:bold;
	letter-spacing:.1em;
	text-align:center;
	padding:0 0 38px;
	margin-bottom:60px;
}
.cast .info{
	text-align:center;
}
.cast .img{
	margin-bottom:12px;
}
.cast .name{
	font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	font-size:1.6em;
	font-weight:bold;
	letter-spacing:.05em;
	margin-bottom:12px;
}
.cast .text{
	display:inline-block;
	background-color:#00315a;
	border-radius:80px;
	color:#FFF;
	font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	font-size:.85em;
	line-height:140%;
	padding:3px 6%;
	margin:0 auto;
}
.cast .text span{
	display:inline-block;
	margin-left:3px;
}
/* ------------------------------ */
/* ロケ地MAP */
.map{
	background-color:#ededed;
}
.map .wrap{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	width:90%;
	max-width:1200px;
	margin:0 auto 60px;
}
.map .info{
	width:46%;
}
.map .info .title{
	display:inline-block;
	background:url("../images/icon_02.svg") no-repeat bottom;
	background-size:auto 12px;
	color:#00315a;
	font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	font-size:2.4em;
	font-weight:bold;
	letter-spacing:.1em;
	padding:0 0 24px;
	margin-bottom:30px;
}
.map .info .text{
	font-size:.95em;
	line-height:160%;
	margin-bottom:40px;
}
.map .minimap{
	width:52%;
	margin:-80px 0 0;
}
.map .location{
	width:24%;
	margin-bottom:40px;
}
.map .location_title{
	width:100%;
	background:url("../images/icon_02.svg") no-repeat bottom;
	background-size:auto 12px;
	color:#00315a;
	font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	font-size:2.2em;
	font-weight:bold;
	letter-spacing:.1em;
	text-align:center;
	padding:0 0 24px;
	margin-bottom:40px;
}
.map .location .img{
	margin-bottom:8px;
}
.map .location .name{
	font-size:.95em;
	font-weight:bold;
	margin-bottom:8px;
}
.map .location .address{
	font-size:.85em;
}
.uragawa{
	width:90%;
	max-width:1200px;
	padding-bottom:60px;
	margin:0 auto;
}
.uragawa .title{
	display:inline-block;
	color:#00315a;
	font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	font-size:2em;
	font-weight:bold;
	letter-spacing:.1em;
	margin-bottom:30px;
}
.uragawa .text{
	font-size:.85em;
	line-height:180%;
	margin-bottom:30px;
}
.uragawa .name{
	font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	font-size:1em;
	font-weight:bold;
	text-align:right;
	letter-spacing:.1em;
}
/* ------------------------------ */
/* 協賛企業一覧 */
.company{
	background-color:#272929;
}
.company .wrap_wrap{
	width:90%;
	max-width:1400px;
	padding:60px 0;
	margin:0 auto;
}
.company .title{
	font-family:"游明朝",YuMincho,"ヒラギノ明朝 ProN W3","Hiragino Mincho ProN","HG明朝E","ＭＳ Ｐ明朝","ＭＳ 明朝",serif;
	color:#FFF;
	font-size:1.2em;
	font-weight:bold;
	text-align:center;
	margin-bottom:60px;
}
.company .wrap{
	display:flex;
	flex-wrap:wrap;
	margin-bottom:10px;
}
.company .wrap p{
	display:inline-block;
	color:#FFF;
	font-size:.85em;
	line-height:150%;
	padding:2px 5px;
}
.company .wrap p img{
	width:auto;
	height:34px;
}
.company .wrap p.sub_title{
	width:100%;
}
/* ------------------------------ */
/* フッター */
footer{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	background-color:#00315a;
	align-items:center;
	padding:10px 10%;
}
footer .title{
	width:12%;
}
footer .copy{
	width:40%;
	color:#FFF;
	font-size:.75em;
	letter-spacing:.1em;
}
/* ------------------------------ */
}