@charset "UTF-8";

worksList {
overflow: hidden;
}
.worksList:after {
content: "";
display: table;
clear: both;
}
.worksList li {
margin: 0 12px 20px 0;
padding: 20px 14px;
text-align: center;
position: relative;
background-color: #F8F8F4;
box-shadow: rgba(0, 0, 0, 0.3) 1px 1px 0px;
vertical-align: top;
box-sizing: border-box;
float:left;
}
.worksList > li {
width : -webkit-calc((100% - 48px) / 4);
width : calc((100% - 48px) / 4);
}
.worksList > li:nth-child(4n) {
margin-right:0;
}
.worksList li .image{
display:block;
max-width:120px;
margin:0 auto 10px auto;
}
.worksList li img {
width:100%;
height:auto;
}
.worksList .text_wrap{
text-align:left;
padding-top: 8px;
}
.worksList .text_wrap h3,
.worksList .text_wrap .sub_title{
font-size: 14px;
font-size: 0.875rem;
margin-bottom:2px;
}
.worksList .text_wrap h3,
.worksList .text_wrap .sub_title{
font-weight:bold;
}
.worksList .text_wrap .site_url{
word-break:break-all;
font-size: 13px;
font-size: 0.8125rem;
}
.worksList .text_wrap .text{
font-size: 13px;
font-size: 0.8125rem;
margin-bottom:0;
}
.three_col .worksList > li {
width : -webkit-calc((100% - 24px) / 3);
width : calc((100% - 24px) / 3);
}
.three_col .worksList > li:nth-child(4n) {
margin-right:12px;
}
.three_col .worksList > li:nth-child(3n) {
margin-right:0;
}
.three_col .worksList li .image{
max-width:248px;
margin:0 auto;
}
.three_col .worksList li img {
width:100%;
height:auto;
}


@media screen and (max-width: 960px) {
.worksList > li {
width : -webkit-calc((100% - 12px) / 2);
width : calc((100% - 18px) / 2);
}
.worksList > li:nth-child(2n) {
margin-right:0;
}
.three_col .worksList > li {
width : -webkit-calc((100% - 12px) / 2);
width : calc((100% - 18px) / 2);
}
.three_col .worksList > li:nth-child(3n) {
margin-right:12px;
}
.three_col .worksList > li:nth-child(2n) {
margin-right:0;
}

}
@media screen and (max-width: 640px) {
.worksList li,
.three_col .worksList li{
margin: 0 0 20px;
width: 100%;
}
.worksList li:nth-child(odd) ,
.worksList li:nth-child(even),
.three_col .worksList li:nth-child(odd) ,
.three_col .worksList li:nth-child(even){
margin-right:0;
}

}








.three_col .gl4m1 > li {
margin: 0 0.7% 20px 0.7%;
padding: 20px 0 60px;
width: calc((100% - 4.2% ) / 3);
}
.three_col .gl4m1 > li:nth-child(3n+1){
margin-left:0;
}
.three_col .gl4m1 > li .text_wrap{
padding:14px;
text-align:left;
}
.three_col .gl4m1 > li .text_wrap h3{
margin-bottom:4px;
font-weight:bold;
}
.three_col .gl4m1 > li .text_wrap p{
margin:0;
padding:0;
}
.three_col .gl4m1 > li .text_wrap p:last-child{
margin:0;
}
.three_col .gl4m1 > li .text_wrap .sub_title{
font-weight:bold;
}
.three_col .gl4m1 > li .text_wrap .capTxt{
font-size:13px;
}

.three_col .gl4m1 > li .text_wrap p.site_url{
word-break:break-all;
}

@media screen and (max-width: 980px) {
.three_col .gl4m1 > li{
margin: 0 0.7% 20px 0.7%;
width: calc((100% - 2.8% ) / 2);
}
.three_col .gl4m1 > li:nth-child(odd) {
margin-left:0;
}
.three_col .gl4m1 > li:nth-child(even) {
margin: 0 0.7% 20px 0.7%;
}
}
@media screen and (max-width: 640px) {
.three_col .gl4m1 > li {
margin: 0 0.7% 20px 0.7%;
width: 100%;
}
.three_col .gl4m1 > li:nth-child(odd) ,
.three_col .gl4m1 > li:nth-child(even){
margin-left:0;
}
}

header{
	top: 0;
	z-index: 100;
}