@charset "utf-8";
/* CSS Document */


/* -----   ストーリー場面写切り替え  -----------------------------------------------------*/

.story-box{
	position:relative;
	overflow:hidden;
	font-size:100%;
	font-weight:700;
	line-height:1.8;
	margin-bottom: 50px;
}

img { vertical-align: bottom; }

:focus { outline: 0; }

.mod-image {
  position: relative;
  width: 100%;
}
.mod-image img{
}

.mod-image .main { width: 100%; margin-bottom:10px; }
.mod-image .main img{
	width:100%;
	border:rgba(48,113,185,1.00) 1px solid;
	height:auto;
}
.mod-image .main li {
	display: none;
	position: absolute;
}

.mod-image .thumb {
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	overflow: hidden; _zoom: 1; 
}

.mod-image .thumb li { 
	position: relative; 
	width: 48.5%;
	background: #fff; 
	cursor: pointer; 
	margin: 1px;
	margin-bottom: 3.5%;
}


.mod-image .thumb img { 
	width:100%;
	height:auto;
	background: #000; 
	opacity: 0.8; 
	-moz-opacity: 0.8; 
	-webkit-opacity: 0.8; 
	filter: alpha(opacity=80); 
	border:rgba(48,113,185,1.00) 1px solid;
	box-sizing: border-box;
}


.mod-image .thumb .current {
	position: absolute;
	top: 0;
	width: 100%;
	height:auto;
	opacity: 0;
	-moz-opacity: 0;
	-webkit-opacity: 0;
	filter: alpha(opacity=0);
}



/* 〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓
   スマホ版
   〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓〓 */

@media screen and (max-width: 480px) {



/* -----   ストーリー場面写切り替え  -----------------------------------------------------*/
.mod-image {
  position: relative;
  width: 98%;
}


.mod-image .thumb .center{
}

.mod-image .thumb .m_right{
}
  
.mod-image .thumb li { 
	position: relative; 
	background: #fff; 
	cursor: pointer; 
}

.mod-image .thumb li{
    margin-bottom: 10px;
}



.mod-image .thumb img { 
	width:100%;
	height:auto;
	top: 0; 
	background: #000; 
	opacity: 0.8; 
	-moz-opacity: 0.8; 
	-webkit-opacity: 0.8; 
	filter: alpha(opacity=80); 
}




.mod-image .thumb .current {
	position: absolute;
	top: 0;
	width: 233px;
	height: 129px;
	opacity: 0;
	-moz-opacity: 0;
	-webkit-opacity: 0;
	filter: alpha(opacity=0);
}


}
