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


.area ul {
	margin:0;
	padding:0;
	list-style:none;
}

.area ul li {
	width:30%;
	margin:1rem 0 1rem 1%;
	display:inline-block;
	/display:inline;
	vertical-align:top;
	text-align:center;
	padding:0;
}

.area ul li a:hover {
      opacity: 0.8;
    }

.area ul li a {
	display:block;
}

.area ul li a img {
      width: 100%;
    }

.modal {
      position: fixed;
      top: 0;
      left: 0;
      width: 100%;
      height: 100vh;
      background-color: rgba(0, 0, 0, 0.8);
      display: none;
    }

.bigimg {
      position: absolute;
      width: 80%;
      top: 80px;
      left: 0;
      right: 0;
      margin-right: auto;
      margin-left: auto;
    }

.close-btn {
      color: #fff;
      font-size: 40px;
      position: absolute;
      right:0;
      top: 0;
    }

.close-btn a {
      color: #fff;
      text-decoration: none;
    }
	
	
@media(min-width: 768px) {
	.modal {
		width:90%;
	}
	
	.bigimg {
		width:50%;
	}
}