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

.contents.works {
	width: 100%;
	height: 100%;
	margin: 430px 0 0;
	padding: 0;
	float: left;
	background-color: #FFF;
}


.contents.works .works_list {
	width: 100%;
	margin: 0;
	padding: 0;
	float: left;
	background: -webkit-linear-gradient(left, #FFF, #FFF 50%, #F5F8FC 50%, #F5F8FC 100%);
	background: -o-linear-gradient(left, #FFF, #FFF 50%, #F5F8FC 50%, #F5F8FC 100%);
	background: linear-gradient(to right, #FFF, #FFF 50%, #F5F8FC 50%, #F5F8FC 100%);
}

.contents.works .works_list.second {
	padding: 0 0 100px;
	background: #FFF;
	background-image: url("../images/works/bg-yellow.jpg");
	background-repeat: no-repeat;
	background-position: bottom right 20vw;
}

.contents.works .works_list .main {
	width: 100%;
	height: 460px;
	margin: 0;
	padding: 0;
	float: left;
	background-image: url("../images/works/main.jpg");
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
}

.contents.works .works_list h2 {
	font-size: 250%;
	letter-spacing: 0.4em;
	text-align: center;
	color: #FFF;
	margin: 120px 0 0;
}

.contents.works .works_list .main dl { margin: 20px 0 50px; }

.contents.works .works_list .main dl dt {
	font-size: 120%;
	font-weight: 700;
	letter-spacing: 0;
	text-align: center;
	color: #FFF;
}

.contents.works .works_list .main dl dd {
	width: 60px;
	height: 3px;
	background-color: #FFF;
	margin: 10px auto 0;
}


.contents.works .works_list .glid-left {
	width: 20%;
	margin: 0;
	padding: 0;
	float: left;
}

.contents.works .works_list .footprint01 {
	width: 70%;
	float: left;
	margin: 100px 15% 0;
}

.contents.works .works_list .footprint02 {
	width: 100%;
	float: left;
	margin: 100px 0 0;
}

.contents.works .works_list .footprint03 {
	width: 70%;
	float: left;
	margin: 100px 15% 0;
	text-align: right;
}

.contents.works .works_list .footprint04 {
	width: 100%;
	float: left;
	margin: 10px 0 0;
	text-align: right;
}

.contents.works .works_list .footprint05 {
	width: 70%;
	float: left;
	margin: 100vh 15% 0;
}

.contents.works .works_list .footprint06 {
	width: 70%;
	float: left;
	margin: 10px 15% 0;
}

.contents.works .works_list .serv_bg_right {
	width: 100%;
	float: left;
	margin: 20px 0 0;
	text-align: right;
}

.contents.works .works_list .glid-mid {
	width: 60%;
	margin: -150px 0 0;
	padding: 50px 0 0;
	float: left;
	background-color: #FFF;
}

.contents.works .works_list.second .glid-mid {
	width: 60%;
	margin: 0;
	padding: 0;
	float: left;
	background-color: #FFF;
}

.contents.works .works_list .glid-mid .wrapper {
	width: 80%;
	margin: 0 10%;
	padding: 0;
	float: left;
}

.contents.works .works_list .glid-right {
	width: 20%;
	margin: 0;
	padding: 0;
	float: right;
}

.contents.works .works_list table {
	width: 100%;
	margin: 50px 0 0;
	padding: 0;
	border-top: #707070 1px solid;
	border-left: #707070 1px solid;
	border-right: #707070 1px solid;
	letter-spacing: 0;
}

.contents.works .works_list.second table {
	margin: 0 0 50px;
	border-top: none;
}

.contents.works .works_list table td {
	border-bottom: #707070 1px solid;
}

.contents.works .works_list table td:nth-of-type(1) {
	width: 17em;
}

.contents.works .works_list table td:nth-of-type(2) {
	border-left: #707070 1px solid;
}

.contents.works .works_list table tr:nth-child(even) {
	background: #FFF;
}

.contents.works .works_list table tr:nth-child(odd) {
	background: #F5F8FC;
}

/* **************************************************************** */
/*  RESPONSIVE  RAYOUT  MAX-WIDTH 1300px */
/* **************************************************************** */
@media only screen and (max-width:1300px){

.contents.works .works_list h2 { font-size: 180%; }

.contents.works .works_list .glid-mid,
.contents.works .works_list.second .glid-mid { width: 80%; }

.contents.works .works_list .glid-mid .wrapper { width: 90%;margin: 0 5%; }

.contents.works .works_list .glid-right,
.contents.works .works_list .glid-left { width: 10%; }

}

/* **************************************************************** */
/*  RESPONSIVE  RAYOUT  MAX-WIDTH 980px */
/* **************************************************************** */
@media only screen and (max-width:980px){

.contents.works .works_list h2 { letter-spacing: 0; }

}

/* **************************************************************** */
/*  RESPONSIVE  RAYOUT  MAX-WIDTH 780px */
/* **************************************************************** */
@media only screen and (max-width:780px){

.contents.works .works_list table td:nth-of-type(1),
.contents.works .works_list table td:nth-of-type(2) { width: 100%;float: left;border-left: none;}
.contents.works .works_list table tr:nth-child(odd) { background: #FFF; }
.contents.works .works_list table td:nth-of-type(1) { background-color: #00719d;color: #FFF;text-align: center; }

}

/* ************************************************** */
/*         width    580px    */
/* ************************************************** */

@media screen and (max-width:580px) {

.contents.works { margin: 400px 0 0; }

}

/* ************************************************** */
/*         width    480px    */
/* ************************************************** */

@media screen and (max-width:480px) {

.contents.works { margin: 85vw 0 0; }

}