@charset "UTF-8";

/*

works.css

*/

/**/
h2 { font-size: 30px;}
img { width: 100%;}

/**/
.works-list { max-width: calc(100% - 120px); margin: 0 auto 60px; display: grid; grid-template: repeat(2, 1fr) / repeat(5, 1fr); grid-auto-flow: dense;}
.works-list .thumbnail { }
.works-list .thumbnail img { width: 100%; height: 100%; object-fit: cover; vertical-align: top;}

.remodal-wrapper { z-index: 10010!important; background: #fff;}
.remodal-wrapper .remodal-close { position: fixed; left: auto; top: 15px; right: 15px; opacity: 0;}
.remodal-wrapper.remodal-is-opened .remodal-close { opacity: 1; transition: opacity .5s ease;}
.remodal-wrapper .remodal-close:before { font-size: 48px;}
.remodal-wrapper p { text-align: left; font-size: 13px; margin-bottom: 12px; letter-spacing: .01em; line-height: 1.6;}
.remodal-wrapper p strong { display: block; margin-top: 10px; font-size: 18px; font-weight: 600;}
.remodal-wrapper p small { font-size: 14px;}

@media screen and (max-width:991px) {
.works-list { grid-template: repeat(2, 1fr) / repeat(3, 1fr);}
}
@media screen and (max-width:767px) {
.works-list { max-width: calc(100% - 60px); margin: 0 auto 70px; grid-template: repeat(2, 1fr) / repeat(2, 1fr);}
	
.remodal-wrapper .remodal-close { top: 10px; right: 10px;}
}