body {
	background: #fff;
}

@media screen and (max-width: 767px) {
	.toggle-contents {
        background: rgba(0, 0, 0, 0.89);
	}
}


.footer-wrap {
	background: #000;
	padding-top: 10px;
}


img {
	max-width:100%;
	height:auto;
}

#contents {
	background:#fff;
}

#contents .wrapper {
	margin:0 auto;
	width:100%;
	max-width:100%;
}

#mv{
    background: url(../img/story/bg_ttl_sp.jpg) no-repeat 50% 0 #000;
    background-size: 100%;
    height: auto;
    padding-bottom:0;
    /*padding-bottom: 30px;*/
}

#story .path{
	fill:#000;
}
header a {
	color: #000;
}


#story .is-fixed .path{
	fill:#000;
}


.story_mv_area_wrap {
	background: url(../img/story/bg_ttl_bottom_sp.jpg) no-repeat 0 bottom;
	padding-bottom: 120px;
}

.story_mv_area{
    margin: 0 auto 40vw;
    padding-top: 20vw;
    position: relative;
    width: 90%;
    text-align:left;
}
.story_mv_area p{
	text-align:left;
    text-shadow: 
    black 1px 1px 10px, black -1px 1px 10px,
    black 1px -1px 10px, black -1px -1px 10px;
    font-size: 13px;
	color: rgb(255, 255, 255);
	line-height:1.7;
	max-width:940px;
	padding-bottom:1em;

}
#mv h1{
}
#mv h1:after{
    width: 100%;
}
.sub_txt{
	padding-top:20px;
    width: 100%;
    padding-bottom:20px;
}
/* story_cont01 */
.story_cont01{
    margin: 0 auto;
    text-align: left;
    /*width: 90%;*/
    width:100%;
}
.story_cont01 h2{
    color: #fff;
    font-size: 18px;
    margin-bottom: 20px;
	font-family: 'Noto Serif JP', serif;
	font-weight:700;
    text-shadow: 
    black 1px 1px 10px, black -1px 1px 10px,
    black 1px -1px 10px, black -1px -1px 10px;

}
.story_cont01 h2 span{
    color: #ffd900;
    display: block;
    font-size: 14px;
}

@media all and (-ms-high-contrast: none) {
  *::-ms-backdrop, .story_cont01 h2 span {
    /* IE11 縺ｫ縺ｮ縺ｿ驕ｩ逕ｨ縺輔ｌ繧� */
    font-style: normal;
  }
}

@supports (-ms-ime-align: auto) {
  /* Edge 縺ｮ縺ｿ驕ｩ逕ｨ縺輔ｌ繧� */
  .story_cont01 h2 span {
    font-style: normal;
  }
}


.story_cont01 h2:before{
    background-color: #ffd900;
    content: "";
    display: block;
    height: 3px;
    margin-bottom: 8px;
    width: 75px;
	box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.9);
}
.story_cont01 p{
    color: #fff;
    font-size: 13px;
    padding-bottom: 30px;
    line-height:1.7;
    text-shadow: 
    black 1px 1px 10px, black -1px 1px 10px,
    black 1px -1px 10px, black -1px -1px 10px;

}

.story_cont01 p .small{
    font-size: 11px;
}

.intro_cd{
    margin: 0 5px;
}

.intro_cd.sp{
	margin-bottom: 40px;
	padding: 0 5%;
}


.intro_cd img{
	max-width:100%;
}
.story_cont02 h2{
    color: #ffd900;
	font-family: 'Noto Serif JP', serif;
	font-weight:700;
    text-align:left;
}

.story_cont01_in{
	/*
	background: url(../img/story/bg_rosoku_sp.png) no-repeat right  bottom;
	*/
	padding:0 5%;
}

#storyBottom {
    background-image: url(../img/story/bg_bottom_sp.jpg);
    background-repeat:no-repeat;	
    background-position:center bottom;
    background-size:100% auto;
    background-color:#000;
    margin: 0;
    padding-bottom: 40px;
}

.storyBottom_in {
	padding:0 5%;
}

    
.colorHeading {
    font-size: 18px;
    line-height: 1.53;
    margin: 0 auto 20px;
    color: #ffd900;
    font-family: 'Noto Serif JP', serif;
    font-weight: 700;
    text-align: left;
    text-shadow: black 1px 1px 10px, black -1px 1px 10px, black 1px -1px 10px, black -1px -1px 10px;
	background: none;
}

#storyBottom .colorHeading {
	padding: 0 5%;
}

.color {
	color: #ffd900;
}

.story_mv_area .txt {
	margin-top: 50px;
}

.txt_mv {
	padding: 0 5%;
    margin-top: 13%;
}

@media (orientation: landscape){
	.story_mv_area p{
		font-size:15px;
	}
	.story_cont01 p{
		font-size:15px;
	}
	.story_mv_area{
		margin:0 auto 80vw;
	}
}

@media screen and (min-width: 767px) {
	
	.footer-wrap {
		padding-top: 50px;
	}
	
	.toggle-contents {
		background: url(../img/story/bg_menu.png) no-repeat center  0;
	}
	#story .path{
		fill:#fff;
	}
	header a {
		color: #fff;
	}
	.is-fixed a{
		color:#000;
	}
    #contents {
    	padding-top:0;
    	padding-bottom:80px;
    	background:#fff;
    }
    #contents .wrapper {
    	margin:0 auto;
    }
    
    .txt_mv {
	    width: 100%;
	    max-width: 980px;
	    margin: 10% auto 0;
	    text-align: left;
	    padding: 0;
    }
    
    
    .txt_mv img {
		max-width: 780px;
		height: auto;
		margin-bottom: 4%;
	}
	
	.story_mv_area_wrap {
		background: none;
		padding-bottom: 0;
	}
	
	.storyBottom_in {
		padding:0;
	}
    
    /*
    #mv{
        background-image: url(../img/story/bg_bottom.jpg),url(../img/story/bg_ttl_pc.png);
        background-repeat:no-repeat,no-repeat;	
        background-position:center bottom , 50% 0;
        background-size:100% auto,100% auto;
        background-color:#000;
        margin: 0;
        padding-bottom: 260px;
    }
    */

/*
    #mv{
        background-image: url(../img/story/bg_ttl_pc.png);
        background-repeat:no-repeat;	
        background-position:50% 0;
        background-size:100% auto;
        background-color:#000;
        margin: 0;
        padding-bottom: 100px;
    }
*/


	#mv{
        background-image: url(../img/story/bg_ttl_pc_top.png);
        background-repeat:no-repeat;	
        background-position:50% 0;
        background-size:100% auto;
        background-color:#000;
        margin: 0;
        padding-bottom: 0;
    }
    
    .story_mv_area_wrap {
        background-image: url(../img/story/bg_ttl_pc_btm.png);
        background-repeat:no-repeat;	
        background-position:center bottom;
        background-size:100% auto;
        margin: 0;
        padding-bottom: 150px;
    }

   
    .story_mv_area{
        /*margin: 0 auto 470px;
        padding-top: 225px;
        */
        margin:0 auto 21%;
        padding-top:2%;
        width: 92%;
        max-width: 980px;
        background: none;
    }

	.story_mv_area p{
		text-align:left;
		font-size: 18px;
		color: rgb(255, 255, 255);
		line-height: 2.667;
		padding-left:20px;
		padding-bottom:0em;

	}

    #mv h1{
        margin-bottom:30px;
        margin-left:20px;
        display:inline-block;
    }
    #mv h1:after{
        width: 134px;
    }
    .sub_txt{
        width: 100%;
        max-width: 898px;
    }
    
    #storyBottom {
	    background-image: url(../img/story/bg_bottom.jpg);
	    background-repeat:no-repeat;	
        background-position:center bottom;
        background-size:100% auto;
        background-color:#000;
        margin: 0;
        padding-bottom: 140px;
    }
    
    #storyBottom .colorHeading {
		padding: 0;
	}
    
    
    .story_cont01{
        max-width: 980px;
        width:100%;
    }
    .story_cont01 h2{
        font-size: 26px;
        margin-bottom: 30px;
    }
    .story_cont01 h2 span{
        font-size: 18px;
    }
    .story_cont01 h2:before{
        width: 68px;
    }
    .story_cont01 p{
        font-size: 18px;
        padding-bottom: 50px;
        line-height:2.5;
    }
    .story_cont01 p .small{
        font-size: 14px;
    }
    
    .intro_cd{
        margin: 0 auto 200px;
    }
    .story_cont01_in{
    	background:none;
    	padding:0;
    }
    
    .colorHeading {
	    font-size: 30px;
	    line-height: 1.53;
	    margin: 0 auto 45px;
	    color: #ffd900;
	    font-family: 'Noto Serif JP', serif;
	    font-weight: 700;
	    text-align: left;
	    text-shadow: black 1px 1px 10px, black -1px 1px 10px, black 1px -1px 10px, black -1px -1px 10px;
		background: none;
    }
    
}

/* story_cont02 */
.sec_cont{
    margin: 0 auto;
    padding: 30px 0;
    width: 90%;
}
.sec_cont h2{
    font-size: 20px;
    line-height: 35px;
    margin: 0 auto 25px;
    text-align: left;
    /*font-style: italic;*/
}
@media all and (-ms-high-contrast: none) {
  *::-ms-backdrop, .sec_cont h2 {
    /* IE11 縺ｫ縺ｮ縺ｿ驕ｩ逕ｨ縺輔ｌ繧� */
    font-style: normal;
  }
}

@supports (-ms-ime-align: auto) {
  /* Edge 縺ｮ縺ｿ驕ｩ逕ｨ縺輔ｌ繧� */
  .sec_cont h2 {
    font-style: normal;
  }
}

.sec_cont p{
    font-size: 14px;
    line-height: 32px;
    margin: 0 auto 25px;
    text-align: left;
}
.sec_cont .pict li{
    width: 100%;
}
.sec_cont .pict li:first-child{
    margin-bottom: 20px;
}
.sec_cont .pict li.note{
    font-size: 12px;
    margin: 10px auto 0;
    text-align: center;
    width: 100%;
}
.story_cont02 h2{
    text-shadow: 
    black 1px 1px 10px, black -1px 1px 10px,
    black 1px -1px 10px, black -1px -1px 10px;

    background: none;
    color: #ffd900;
	font-family: 'Noto Serif JP', serif;
	font-weight:700;
    text-align:left;
   }


.story_cont02 p{
	color:#fff;
	text-shadow: 0px 0px 11.4px rgba(0, 0, 0, 0.25), 0px 0px 11.4px rgba(0, 0, 0, 0.25), 0px 0px 11.4px rgba(0, 0, 0, 0.25), 0px 0px 11.4px rgba(0, 0, 0, 0.25);
}
.sec_cont p span{
	font-weight:bold;
	color:#ffd900;
}	

.story_cont02{
	background: url(../img/story/bg01_sp.png) no-repeat 0 0 ;
	background-size:cover;
	margin-bottom:35px;
}
.block_flex .pic figure{
	width:100%;
	margin:0;
	padding:0;
}
.block_flex .pic figure img{
	width:100%;
}
.block_flex .pic figcaption{
	text-align:center;
	color:#fff;
	font-size:14px;
	line-height:1.4;
	padding-top:10px;
	padding-bottom:20px;
	
}

#contents .wrapper .sp img{
	width:100%;
}
@media screen and (min-width: 787px) {
    .story_cont02{
		background-image: -moz-linear-gradient( 90deg, rgb(153,17,21) 25%, rgb(0,0,0) 100%);
		background-image: -webkit-linear-gradient( 90deg, rgb(153,17,21) 25%, rgb(0,0,0) 100%);
		background-image: -ms-linear-gradient( 90deg, rgb(153,17,21) 25%, rgb(0,0,0) 100%);

    }
    .sec_cont{
        padding: 90px 0;
        max-width: 980px;
        width:100%;
    }
    .sec_cont h2{
        font-size: 30px;
        line-height: 1.53;
        margin: 0 auto 45px;
        
    }
    .sec_cont p{
        font-size: 16px;
        line-height: 2.125;
        margin: 0 auto 45px;
        text-align: left;
        color:#fff;
		text-shadow: 0px 0px 11.4px rgba(0, 0, 0, 0.25), 0px 0px 11.4px rgba(0, 0, 0, 0.25), 0px 0px 11.4px rgba(0, 0, 0, 0.25), 0px 0px 11.4px rgba(0, 0, 0, 0.25);

    }
    .sec_cont p span{
    	font-weight:bold;
    	color:#ffd900;
    }
    .sec_cont .pict{
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .sec_cont .pict li{
        width: 49%;
    }
    .sec_cont .pict li:first-child{
        margin: 0;
    }
    .sec_cont .pict li.note{
        font-size: 15px;
        margin: 20px auto 0;
    }

    .block_flex{
    	display:flex;
    }
    .block_flex .txt{
    	width:49%;
    }
    .block_flex .pic{
    	width:50%;
    	padding-left:25px;
    }
    .block_flex .pic figcaption{
    	text-align:center;
    	color:#fff;
    	font-size:14px;
    	line-height:1.4;
    	padding-top:10px;
    }
}

/* story_cont03 */
.story_cont03{
    background: url(../img/story/bg01_sp.jpg) repeat;
    margin-bottom: 30px;
}
.story_cont03 h2{
    color: #fff;
}
.story_cont03 p{
    color: #fff;
    text-align: left;
}
.story_cont03 p strong{
    color: #faf205;
}
.story_cont03 .pict li.note{
    color: #fff;
}
.message_area{
    background: url(../img/story/bg02_sp.png) no-repeat 50% 0;
    background-size: 100% 100%;
    box-sizing: border-box;
    margin: 0 auto 30px;
    padding: 14% 12% 14%;
    width: 100%;
}
.message{
    background: url(../img/story/message_line_sp.png) repeat;
    font-size: 12px;
    margin-bottom: 10px;
    line-height: 28px;
    color: #333;
}
.message sup{
    color: #ca002c;
    font-size: 70%;
}
.author{
    font-size: 16px;
    font-weight: bold;
    text-align: right;
    color: #333;
}
.author:before{
    background-color: #333;
    content: "";
    display: inline-block;
    height: 1px;
    margin-right: 10px;
    vertical-align: middle;
    width: 20px;
}
.archive_link a{
    color: #ca002c;
    font-size: 12px;
    text-decoration: underline;
}
.archive_link a:hover{
    text-decoration: none;
}
@media screen and (min-width: 787px) {
    .story_cont03{
        background: url(../img/story/bg01.jpg) repeat;
        margin-bottom: 90px;
        background-size: cover;
    }
    .message_area{
        background: url(../img/story/bg02.png) no-repeat 50% 0;
        background-size: 100% 100%;
        margin: 120px auto 30px;
        padding: 110px 9em 100px;
		width: 100%;
		max-width: 1180px;
		position:relative;
    }
    /*
    .message_area:after{
    	content:"";
    	position:absolute;
    	top:-100px;
    	right:-5%;
    	background: url(../img/story/hane.png) no-repeat 0 0 ;
    	background-size:100% auto;
    	width:198px;
    	height:253px;
    	z-index:1;
    }
    */
    .message{
        background: url(../img/story/message_line.png) repeat;
        font-size: 18px;
        margin-bottom: 35px;
        line-height: 40px;
        color: #333;
    }
    
    .message_area_image {
	    position: absolute;
		right: 110px;
	    bottom: 170px;
    }
    
    .author_area{
        display: flex;
        justify-content: space-between;
        flex-flow: row-reverse;
        align-items: center;
    }
    .author{
        font-size: 22px;
		color: #333;
    }
    .author:before{
        margin-right: 10px;
        width: 30px;
    }
    .archive_link a{
        font-size: 16px;
    }
    
    .story_cont03 p{
	    text-align: center;
	}
}


@media screen and (min-width: 1060px) {
    .sub_txt{
        width: 691px;
    }	
	
}