@charset "UTF-8";
*{
margin: 0;
padding: 0;
}

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

header{
position: relative;
background:url(../material/pagetop/gallery.png)no-repeat;
width: 1280px;
height: 560px;
margin: 0 auto;
}

.header-txt{
position: absolute;
top: 50%;;
left: 50%;
transform: translate(-50%,-50%);
}

body{
margin: 0 auto;
background:#fdfdfd;
font-family: 'Noto Sans', sans-serif,YuGothic,'Yu Gothic','Hiragino Kaku Gothic ProN','ヒラギノ角ゴ ProN W3','Helvetica','Arial';
}

h1{
font-size: 24px;
color: #707070;
text-align: center;
border-bottom: 1px solid #707070;
}

p{
font-size: 13px;
color: #707070;
}

.wrapper{
width: 1000px;
margin: 0 auto;
}

.gallery-list{
width: 100%;
margin: 100px auto;
overflow: hidden;
}

.gallery-list-box{
width: 1024px;
margin: 20px 0 0 -20px;
}

.gallery-list-box:after {
display: block;
clear: both;
content: "";
}

.gallery-list-box ul{
list-style: none;
}

.gallery-list-box ul li{
width: 240px;
height: 320px;
margin: 8px;
float: left;
}

.gallery-shadow img{
width: 100%;
height: 100%;
object-fit: cover;
}

.gallery-shadow{
position: relative;
width: 240px;
height: 320px;
}

.gallery-shadow:hover img{
-webkit-filter: brightness(0.8);
-moz-filter: brightness(0.8);
-o-filter: brightness(0.8);
-ms-filter: brightness(0.8);
filter: brightness(0.8);
}

.gallery-shadow::after{
position: absolute;
content: "";
top: 0;
bottom: 0;
left: 0;
right: 0;
width: 100%;
height: 100%;
box-shadow: 3px 3px 6px -2px #555;
}
.lightbox .lb-image {
  border-radius: 1px;
  /*border: 4px solid white;*/
  border: none;
}

.lb-outerContainer {
  border-radius: 1px;
  background-color: white;
}

.lb-nav a.lb-prev{
position: absolute;
left: -80px;
opacity: 1;
}

.lb-nav a.lb-next{
position: absolute;
right: -80px;
opacity: 1;
}