/* CSS Document */

/* [ Header ]
===================================================================== */

#page_nav{
	width: 100%;
	height: 110px;
	background-color: #fff;
}
#page_nav .global_nav li a{
	color: #000;
}
.global_nav .out_link{
	padding-right: 12px;
	background: url(../img/common/icon_out_link.svg) right center no-repeat;
	background-size: 10px;
}
@media screen and (max-width: 960px){
	#page_nav{
		width: 100%;
		height: 100%;
	}
	.global_nav .out_link{
		padding: 0;
		background: url(../img/common/icon_out_link.svg) 76px center no-repeat;
		background-size: 10px;
	}
}

/* [ Bace ]
===================================================================== */

#main{
	width: 100%;
	position: relative;
	overflow: hidden;
}
#main .section{
	width: 900px;
	margin: 0 auto;
}

@media screen and (max-width: 960px){
	#main .section{
		width: 96%;
	}
}

/* [ Page header ] -------------------------------------------------- */

.page_header{
	position: relative;
	width: 100%;
	height: 350px;
	overflow: hidden;
	margin: 0 auto;
}

/* パンくず */
.bread_link{
	width: 100%;
	height: 50px;
	background-color: #000;
}
.bread_link dl{
	width: 100%;
	height: 50px;
	line-height: 50px;
	padding-left: 40px;
	text-align: left;
}
.bread_link dt{
	color: #777;
	font-size: 11px;
}
.bread_link dt a{
	color: #aaa;
	text-decoration: underline;
}
.bread_link dt a:hover{
	text-decoration: none;
}
.bread_link dt a.home{
	background: url(../img/common/icon_bread_home.svg) left top no-repeat;
	background-size: 13px;
	padding-left: 20px;
}
.bread_link dd{
	display: inline-block;
}

/* header visual */

.header_visual{
	position: relative;
	width: 100%;
	height: 300px;
	overflow: hidden;
}
.header_visual .title{
	color: #fff;
}
.header_visual .title p{
	padding-top: 120px;
	font-size: 75px;
}
.header_visual .title h1{
	padding-top: 50px;
	font-size: 21px;
	letter-spacing: 0.3em;
}

@media screen and (max-width: 960px){
	.page_header{
		height: 220px;
		margin-top: 60px;
	}
	.bread_link{
		display: none;
	}
	.header_visual{
		width: 100%;
		height: 220px;
	}
	.header_visual .title p{
		padding-top: 90px;
		font-size: 70px;
	}
	.header_visual .title h1{
		padding-top: 40px;
		font-size: 16px;
	}
}
@media screen and (max-width: 650px){
	.page_header{
		height: 200px;
	}
	.header_visual{
		height: 200px;
	}
	.header_visual .title p{
		padding-top: 86px;
		font-size: 46px;
	}
	.header_visual .title h1{
		padding-top: 20px;
		font-size: 14px;
	}
}

/* [ Advantage ]
===================================================================== */

.ad_page_header{
	position: relative;
	width: 100%;
	height: 50px;
	overflow: hidden;
	margin: 0 auto;
}
#advantage{
	position: relative;
	width: 100%;
	height: auto;
	padding: 0;
	margin: 0 auto;
}
.top_advantage{
	width: 100%;
	height: 800px;
	background: url(../img/advantage/bg_advantage.jpg) center center no-repeat;
	background-size: cover;
}
.top_advantage .inner{
	width: 1040px;
	margin: 0 auto;
}
.top_advantage .title{
	color: #fff;
}
.top_advantage .title p{
	padding-top: 120px;
	font-size: 75px;
}
.top_advantage .title h1{
	padding-top: 50px;
	font-size: 21px;
	letter-spacing: 0.3em;
}
.top_advantage .three_cont{
	position: relative;
	width: 100%;
	padding-top: 120px;
}
.top_advantage .three_cont ul{
	width: 1080px;
}
.top_advantage .three_cont li{
	position: relative;
	float: left;
	width: 320px;
	height: 360px;
	padding: 30px 26px;
	margin-right: 40px;
	color: #fff;
	background-color: rgba(80, 80, 80, 0.5);
	border-radius: 10px;
}
.top_advantage .three_cont img{
	position: absolute;
	left: 110px;
	top: -50px;
}
.top_advantage .three_cont li .tit{
	padding-top: 48px;
	font-weight: bold;
	font-size: 21px;
}
.top_advantage .three_cont li .txt{
	padding-top: 20px;
	text-align: left;
	color: #ccc;
}

#workflow{
	position: relative;
	width: 100%;
	min-width: 1040px;
	height: auto;
	padding: 0;
	margin: 0 auto;
}
#workflow .h_separator{
	width: 100%;
	height: 170px;
	overflow: hidden;
}
#workflow .h_separator h2{
	width: 100%;
    padding: 0;
	margin-top: 85px;
    text-align: center;
    border-top: 1px solid #ddd;
}
#workflow .h_separator h2 span{
    position: relative;
    top: -10px;
    padding: 10px 30px;
    font-size: 25px;
    letter-spacing: .1em;
    background-color: #fff;
}

#workflow .cont_body{
	position: relative;
	width: 100%;
	height: auto;
}
#workflow .cont_body .step_header{
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 140px;
	line-height: 140px;
	color: #fff;
	background-color: #343434;
}
#workflow .step_header h3.title{
	margin-left: -100px;
	font-size: 22px;
    letter-spacing: .2em;
}
#workflow .step_header h3.title span{
	padding: 12px 18px;
	margin-right: 24px;
	font-size: 14px;
    letter-spacing: .05em;
	color: #0099cc;
	border: 1px solid #0099cc;
}
#workflow .step_header dl.icon{
	position: absolute;
	right: 50px;
	top: -30px;
}
#workflow .step_header dl.icon dt{
	float: left;
	padding: 0 5px;
}

#workflow .cont_body .container{
	position: relative;
	width: 100%;
	height: 740px;
	overflow: hidden;
	color: #fff;
	z-index: 0;
}
#workflow .cont_body .container .cover{
	width: 100%;
	height: 100%;
	background: url(../img/advantage/step_bg_cover.png) left top repeat;
	z-index: 1;
}

#workflow .container .inner{
	width: 1040px;
	height: auto;
	margin: 0 auto;
}
#workflow .container .flow{
	float: left;
	width: 300px;
	padding-left: 100px;
}
#workflow .container .flow ul{
	float: left;
	width: 100%;
	padding-top: 100px;
}
#workflow .container .flow li{
	text-align: left;
	padding-left: 32px;
	margin: 0 0 100px -9px;
	font-size: 17px;
	background: url(../img/advantage/icon_flow.png) left center no-repeat;
}
#workflow .container .flow .border{
	width: 2px;
	height: 740px;
	background-color: #fff;
}
#workflow .container .l_content{
	position: relative;
	float: right;
	width: 740px;
	height: 740px;
	padding-top: 80px;
}
#workflow .l_content .step_item{
	width: 420px;
	height: auto;
	padding: 46px 30px;
	border: 1px solid #fff;
	border-radius: 10px;
}
#workflow .l_content .step_item h4{
	padding-bottom: 26px;
	margin-bottom: 22px;
	font-size: 26px;
	letter-spacing: .1em;
	background: url(../img/advantage/border_btm.gif) center bottom no-repeat;
}
#workflow .l_content .step_item p{
	text-align: left;
	font-size: 15px;
	line-height: 30px;
}

/* STEP 01 */

#step_1 .container{
	background: url(../img/advantage/step_1_bg.jpg) center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}
#step_1 #step_1_item{
	width: 480px;
	margin-left: 40px;
}
#step_1 #step_1_img div{
	position: absolute;
	right: 5%;
	bottom: 20%;
}

/* STEP 02 */

#step_2 .container{
	background: url(../img/advantage/step_2_bg.jpg) center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}
#step_2 #step_2_item{
	float: right;
	margin-right: 20px;
}
#step_2 #step_2_img div{
	position: absolute;
	right: 6%;
	bottom: 15%;
}
#step_2 #step_2_img div:first-child{
	float: left;
	left: -28%;
	bottom: 22%;
}

/* STEP 03 */

#step_3 .container{
	background: url(../img/advantage/step_3_bg.jpg) center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}
#step_3 #step_3_item{
}
#step_3 #step_3_img div{
	position: absolute;
	right: 6%;
	bottom: 14%;
}

/* STEP 04 */

#step_4 .container{
	background: url(../img/advantage/step_4_bg.jpg) center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}
#step_4 #step_4_item{
	float: right;
	margin-right: 20px;
}
#step_4 #step_4_img div{
	position: absolute;
	right: 10%;
	bottom: 25%;
}
#step_4 #step_4_img div:first-child{
	float: left;
	right: 50%;
	bottom: 15%;
}

/* STEP 05 */

#step_5 .container{
	background: url(../img/advantage/step_5_bg.jpg) center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}
#step_5 #step_5_item{
	float: left;
	margin-left: 50px;
}
#step_5 #step_5_img div{
	position: absolute;
	right: 0;
	bottom: 25%;
}

/* STEP 06 */

#step_6 .container{
	background: url(../img/advantage/step_6_bg.jpg) center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}
#step_6 #step_6_item{
	float: right;
	margin-right: 40px;
}
#step_6 #step_6_img div{
	position: absolute;
	right: 3%;
	bottom: 18%;
}
#step_6 #step_6_img div:first-child{
	float: left;
	left: -40%;
	bottom: 18%;
}

/* STEP 07 */

#step_7 .container{
	background: url(../img/advantage/step_7_bg.jpg) center center no-repeat;
	background-size: cover;
	background-attachment: fixed;
}
#step_7 #step_7_item{
	float: left;
	margin: 20px 0 0 20px;
}
#step_7 #step_7_img div{
	position: absolute;
	right: 5%;
	bottom: 22%;
}

@media screen and (max-width: 960px){
	.ad_page_header{
		display: none;
	}
	.top_advantage{
		height: auto;
		padding-bottom: 5%;
		margin-top: 60px;
	}
	.top_advantage .inner{
		width: 96%;
	}
	.top_advantage .title{
		width: 100%;
		height: 220px;
	}
	.top_advantage .title p{
		padding-top: 90px;
		font-size: 70px;
	}
	.top_advantage .title h1{
		padding-top: 40px;
		font-size: 16px;
	}
	.top_advantage .three_cont{
		padding-top: 5%;
	}
	.top_advantage .three_cont ul{
		width: 102%;
	}
	.top_advantage .three_cont li{
		width: 31%;
		height: auto;
		padding: 5% 2% 3%;
		margin-right: 2%;
	}
	.top_advantage .three_cont img{
		left: 31%;
	}
	.top_advantage .three_cont li .tit{
		padding-top: 15%;
		font-size: 18px;
	}
	.top_advantage .three_cont li .txt{
		padding-top: 5%;
	}
	#workflow{
		min-width: 100%;
	}
	#workflow .h_separator{
		height: 150px;
	}
	#workflow .h_separator h2{
		margin-top: 75px;
	}
	#workflow .cont_body .step_header{
		height: 120px;
		line-height: 120px;
	}
	#workflow .step_header dl.icon{
		right: 1%;
		top: -20px;
	}
	#workflow .cont_body .container,
	#workflow .container .flow .border,
	#workflow .container .l_content{
		height: 550px;
	}
	#workflow .container .inner{
		width: 100%;
	}
	#workflow .container .flow{
		width: 30%;
		padding-left: 5%;
	}
	#workflow .container .flow ul,
	#workflow .container .l_content{
		padding-top: 70px;
	}
	#workflow .container .flow li{
		margin: 0 0 80px -9px;
		font-size: 16px;
		font-weight: bold;
	}
	#workflow .container .l_content{
		width: 70%;
	}
	#workflow .l_content .step_item{
		padding: 5% 4%;
	}
	#workflow .l_content .step_item h4{
		font-size: 20px;
	}
	#workflow .l_content .step_item p{
		font-size: 14px;
		line-height: 26px;
	}
	
	#step_1 .container, #step_2 .container, #step_3 .container, #step_4 .container,
	#step_5 .container, #step_6 .container, #step_7 .container{ background-attachment: inherit; }
	
/* STEP 01 */
	#step_1 #step_1_item{
		width: 420px;
		margin: 0;
	}
	#step_1 #step_1_img div{
		width: 300px;
		right: 5%;
		bottom: 8%;
	}
/* STEP 02 */	
	#step_2 #step_2_item{
		width: 420px;
		margin-right: 2%;
	}
	#step_2 #step_2_img div{
		right: 1%;
		bottom: 8%;
	}
	#step_2 #step_2_img div:first-child{
		width: 270px;
		left: 0;
		bottom: 14%;
	}
/* STEP 03 */
	#step_3 #step_3_item{
		width: 420px;
	}
	#step_3 #step_3_img div{
		width: 330px;
		right: 3%;
		bottom: 8%;
	}
/* STEP 04 */
	#step_4 #step_4_item{
		width: 420px;
		margin-right: 2%;
	}
	#step_4 #step_4_img div{
		right: 10%;
		bottom: 20%;
	}
	#step_4 #step_4_img div:first-child{
		width: 210px;
		right: 60%;
		bottom: 5%;
	}
/* STEP 05 */
	#step_5 #step_5_item{
		margin-left: 0;
	}
	#step_5 #step_5_img div{
		width: 300px;
		right: 2%;
		bottom: 15%;
	}
/* STEP 06 */
	#step_6 #step_6_item{
		width: 420px;
		margin-right: 0;
	}
	#step_6 #step_6_img div{
		right: 0%;
		bottom: 5%;
	}
	#step_6 #step_6_img div:first-child{
		width: 300px;
		left: 0;
		bottom: 15%;
	}
/* STEP 07 */
	#step_7 #step_7_item{
		width: 420px;
		margin: 0;
	}
	#step_7 #step_7_img div{
		right: 2%;
		bottom: 8%;
	}
}
@media screen and (max-width: 650px){
	.top_advantage{
		padding-bottom: 2%;
	}
	.top_advantage .title{
		height: 200px;
	}
	.top_advantage .title p{
		padding-top: 86px;
		font-size: 46px;
	}
	.top_advantage .title h1{
		padding-top: 20px;
		font-size: 14px;
	}
	.top_advantage .three_cont{
		padding-top: 0;
	}
	.top_advantage .three_cont ul{
		width: 100%;
	}
	.top_advantage .three_cont li{
		float: left;
		width: 100%;
		height: auto;
		padding: 5% 4%;
		margin: 0 0 20px;
	}
	.top_advantage .three_cont img{
		width: 68px;
		left: 3%;
		top: -10px;
	}
	.top_advantage .three_cont li .tit{
		padding-top: 5%;
	}
	#workflow .h_separator{
		height: 120px;
	}
	#workflow .h_separator h2{
		margin-top: 60px;
	}
	#workflow .h_separator h2 span{
		font-size: 20px;
	}
	#workflow .cont_body .step_header{
		height: 100px;
		line-height: 100px;
	}
	#workflow .step_header h3.title{
		margin-left: 0;
		font-size: 18px;
	}
	#workflow .step_header h3.title span{
		padding: 10px 18px;
		font-size: 12px;
	}
	#workflow .step_header dl.icon{
		display: none;
	}
	#workflow .cont_body .container,
	#workflow .container .flow .border,
	#workflow .container .l_content{
		height: auto;
	}
	#workflow .container .inner{
		width: 90%;
		overflow: hidden;
	}
	#workflow .container .flow{
		width: 100%;
		padding-left: 0;
	}
	#workflow .container .flow ul{
		padding-top: 5%;
	}
	#workflow .container .flow li{
		padding: 0 0 0 20px;
		margin: 0 0 10px;
		font-size: 13px;
		background: url(../img/advantage/icon_flow.png) left top no-repeat;
		background-size: 16px;
	}
	#workflow .container .l_content{
		width: 100%;
		padding-top: 3%;
	}
	#workflow .l_content .step_item{
		padding: 5%;
	}
	#workflow .l_content .step_item h4{
		padding-bottom: 5%;
		margin-bottom: 5%;
		font-size: 16px;
	}
	#workflow .l_content .step_item p{
		font-size: 13px;
		line-height: 20px;
	}
	
	#step_1 .container, #step_2 .container, #step_3 .container, #step_4 .container,
	#step_5 .container, #step_6 .container, #step_7 .container{ background-attachment: inherit; -webkit-background-attachment: inherit; }
	
	#step_1 #step_1_item, #step_2 #step_2_item, #step_3 #step_3_item, #step_4 #step_4_item,
	#step_5 #step_5_item, #step_6 #step_6_item, #step_7 #step_7_item{ width: 100%; margin: 0 auto 3%; }
	
	#step_1 #step_1_img div, #step_2 #step_2_img div, #step_3 #step_3_img div, #step_4 #step_4_img div,
	#step_5 #step_5_img div, #step_6 #step_6_img div, #step_7 #step_7_img div{ position: relative; width: 100%; height: auto;  margin: 3% auto 5%; text-align: center; top: auto; left: auto; right: auto; bottom: auto; }
	
/* STEP 01 */
	#step_1 #step_1_img div{
		width: 60%;
	}
/* STEP 02 */
	#step_2 #step_2_img div{
		width: 50%;
	}
	#step_2 #step_2_img div:first-child{
		width: 70%;
		margin: 0 0 -10% 10%;
	}
/* STEP 03 */
	#step_3 #step_3_img div{
		width: 60%;
	}
/* STEP 04 */
	#step_4 #step_4_img div{
		width: 50%;
		margin-left: 30%;
	}
	#step_4 #step_4_img div:first-child{
		width: 50%;
		margin: 0 0 -20% 10%;
		right: auto;
		bottom: auto;
	}
/* STEP 05 */
	#step_5 #step_5_img div{
		width: 60%;
	}
/* STEP 06 */
	#step_6 #step_6_img div{
		width: 60%;
		margin-left: 30%;
	}
	#step_6 #step_6_img div:first-child{
		width: 50%;
		margin: 0 0 -10% 10%;
		right: auto;
		bottom: auto;
	}
/* STEP 07 */
	#step_7 #step_7_img div{
		width: 60%;
	}
}

/* [ Trial space ]
===================================================================== */

#trial_visual{
	background: url(../img/trialspace/header_trial.jpg) center center no-repeat;
	background-size: cover;
}
#trialspace{
	position: relative;
	padding: 60px 0 40px;
	text-align: left;
}
#trialspace .read{
	padding-bottom: 60px;
}
#trialspace .plant_space{
	width: 100%;
	padding-bottom: 80px;
}
.plant_space .layout{
	position: relative;
	width: 900px;
}
.plant_space .layout .text{
	font-size: 12px;
	padding-bottom: 10px;
}
.plant_space .list_1, .plant_space .list_2{
	width: 900px;
}
.plant_space .list_1{
	padding-bottom: 20px;
}
.plant_space .list_1 li{
	border: 1px solid #ccc;
}
.plant_space .list_1 li img{
	vertical-align: middle;
}
.plant_space .list_1 .layout_1{
	float: left;
	width: 560px;
	margin-right: 20px;
}
.plant_space .list_1 .layout_2{
	float: right;
	width: 320px;
}
.plant_space .list_2 ul{
	width: 920px;
}
.plant_space .list_2 li{
	float: left;
	width: 270px;
	height: 210px;
	margin-right: 20px;
}
.plant_space .list_2 li img{
	width: 100%;
	height: auto;
}
.plant_space .list_2 li.tbl_layout{
	float: right;
	width: 320px;
}
.list_2 .tbl_layout table{
	width: 100%;
	height: auto;
	margin: 0 auto;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
}
.list_2 .tbl_layout th, .list_2 .tbl_layout td{
	padding: 4px 10px;
	text-align: left;
	border-right: 1px solid #ccc;
	border-bottom: 1px solid #ccc;
}
.list_2 .tbl_layout th{
	width: 110px;
	line-height: 20px;
	vertical-align: middle;
	color: #fff;
	background-color: #545454;
}
.list_2 .tbl_layout td{
	background-color: #f6f6f6;
}
#voltage{
	position: relative;
	width: 100%;
	height: auto;
	padding-bottom: 80px;
	background: url(../img/trialspace/bg_voltage.jpg) left top no-repeat;
}
#voltage .l_content{
	float: left;
	width: 220px;
	height: 184px;
}
#voltage .l_content h2{
	padding-top: 110px;
	text-align: center;
	font-size: 18px;
}
#voltage .r_content{
	float: right;
	width: 680px;
	height: 184px;
	padding: 26px 30px;
}
#voltage .r_content dl{
	line-height: 34px;
	font-size: 16px;
}
#voltage .r_content dt{
	float: left;
	width: 62%;
	letter-spacing: 0;
}
#voltage .r_content dd{
	float: left;
	width: 38%;
	font-weight: bold;
}

@media screen and (max-width: 960px){
	
	#trialspace{
		padding: 4% 0 10%;
	}
	#trialspace .read{
		padding-bottom: 5%;
	}
	#trialspace .plant_space{
		width: 100%;
		padding-bottom: 8%;
	}
	.plant_space .layout, .plant_space .list_1, .plant_space .list_2{
		width: 100%;
	}
	.plant_space .list_1{
		padding-bottom: 3%;
	}
	.plant_space .list_1 .layout_1{
		width: 62.4%;
		margin-right: 2%;
	}
	.plant_space .list_1 .layout_2{
		width: 35.6%;
	}
	.plant_space .list_2 ul{
		width: 102%;
	}
	.plant_space .list_2 li{
		float: left;
		width: 48%;
		height: auto;
		margin-right: 2%;
	}
	.plant_space .list_2 li img{
		width: 100%;
		height: auto;
	}
	.plant_space .list_2 li.tbl_layout{
		float: left;
		padding-top: 3%;
	}
	#voltage{
		padding-bottom: 0;
		background: url(../img/trialspace/bg_voltage.jpg) left top no-repeat;
		background-size: 100%;
	}
	#voltage .l_content{
		width: 25%;
	}
	#voltage .l_content h2{
		padding-top: 50%;
	}
	#voltage .r_content{
		width: 75%;
		padding: 2%;
	}
	#voltage .r_content dl{
		font-size: 13px;
		line-height: 240%;
	}
	#voltage .r_content dt{
		width: 65%;
	}
	#voltage .r_content dd{
		width: 35%;
	}
}
@media screen and (max-width: 650px){
	
	#trialspace{
		padding: 5% 0;
	}
	#trialspace .read{
		padding-bottom: 8%;
	}
	#trialspace .plant_space{
		padding-bottom: 14%;
	}
	.plant_space .list_2 li.tbl_layout{
		margin: 0 auto;
		width: 98%;
	}
	#voltage{
		padding-bottom: 8%;
		background: none;
	}
	#voltage .l_content{
		width: 100%;
		height: 40px;
		line-height: 40px;
		background-color: yellow;
		border: 1px solid #aaa;
	}
	#voltage .l_content h2{
		padding-top: 0;
		font-size: 14px;
	}
	#voltage .r_content{
		width: 100%;
		height: auto;
		padding: 4%;
		border-left: 1px solid #aaa;
		border-right: 1px solid #aaa;
		border-bottom: 1px solid #aaa;
	}
	#voltage .r_content dl{
		font-size: 13px;
		line-height: 26px;
	}
	#voltage .r_content dt, #voltage .r_content dd{
		border-bottom: 1px dotted #ddd;
		padding: 4px 0;
	}
	#voltage .r_content dt{
		width: 80%;
	}
	#voltage .r_content dd{
		width: 20%;
	}
}

/* [ Equipment ]
===================================================================== */

#equipment_visual{
	background: url(../img/equipment/header_equipment.jpg) center center no-repeat;
	background-size: cover;
}
#equipment{
	position: relative;
	padding: 60px 0 120px;
}
#equipment .design_tool{
	width: 100%;
	padding-bottom: 60px;
}
#equipment .tbl_body{
	padding-bottom: 50px;
}
table.three_column{
	width: 100%;
	height: auto;
	margin: 0 auto;
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
table.three_column th, table.three_column td{
	text-align: center;
	border-right: 1px solid #ddd;
}
table.three_column th{
	padding: 10px 24px;
	font-size: 13px;
	background-color: #eee;
}
table.three_column th:first-child{ width: 45%;}
table.three_column th:last-child{ width: 18%; }
table.three_column td:first-child{ text-align: left; }
table.three_column td.name{ font-weight: bold; }
table.three_column td{ padding: 6px 24px; }

.design_tool .youtube_area{
	width: 100%;
	overflow: hidden;
	padding: 20px 0 0;
}
.youtube_area .video_list{
	width: 960px;
}
.video_list li{
	float: left;
	width: 420px;
	margin-right: 60px;
	padding-bottom: 40px;
}
.video_list li .tit{
	padding-top: 8px;
}
.video_list .youtube{
	position: relative;
	width: 100%;
}
.video_list .youtube iframe{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
#equipment .machine_tool{
	width: 100%;
}
#equipment .gallery{
	width: 900px;
	height: auto;
	overflow: hidden;
	padding-top: 20px;
}
#equipment .gallery .photo_item{
	width: 930px;
	padding-bottom: 40px;
}
#equipment .gallery .photo_item li{
	float: left;
	width: 280px;
	margin-right: 30px;
}
#equipment .gallery .photo{
	width: 100%;
}
#equipment .gallery .caption{
	padding-top: 8px;
	text-align: left;
	font-size: 13px;
	line-height: 18px;
}

@media screen and (max-width: 960px){
	#equipment{
		padding: 4% 0 10%;
	}
	#equipment .design_tool{
		padding-bottom: 8%;
	}
	#equipment .tbl_body{
		padding-bottom: 4%;
	}
	.design_tool .youtube_area{
		padding: 2% 0 0;
	}
	.youtube_area .video_list{
		width: 104%;
	}
	.video_list li{
		width: 46%;
		margin-right: 4%;
		padding-bottom: 3%;
	}
	#equipment .gallery{
		width: 100%;
		padding-top: 2%;
	}
	#equipment .gallery .photo_item{
		width: 103%;
		padding-bottom: 2%;
	}
	#equipment .gallery .photo_item li{
		width: 30.33%;
		margin-right: 3%;
	}
}
@media screen and (max-width: 650px){
	#equipment{
		padding: 5% 0;
	}
	#equipment .design_tool, #equipment .machine_tool{
		padding-bottom: 8%;
	}
	table.three_column th{
		padding: 8px 8px;
		font-size: 12px;
	}
	table.three_column th:first-child{ width: 50%;}
	table.three_column td{
		padding: 8px 8px;
		border-bottom: 1px dotted #ddd;
	}
	#equipment .gallery .caption{
		font-size: 11px;
		line-height: 14px;
	}
}

/* [ Works ]
===================================================================== */

#works_visual{
	background: url(../img/works/header_works.jpg) center center no-repeat;
	background-size: cover;
}
#works{
	position: relative;
	padding: 60px 0 120px;
}
#works .facility_1{
	margin-bottom: 40px;
}
.facility_1 .products{
	width: 100%;
	padding-bottom: 40px;
}
.facility_1 .product_list{
	display: table;
	width: 100%;
	padding-bottom: 30px;
	text-align: left;
}
.facility_1 .product_list dl{
	display: table-cell;
	padding: 0 0 0 10px;
}
.facility_1 .product_list dl.list{
	border-right: 1px dotted #aaa;
}
.facility_1 .product_list dt{
	padding: 10px 0 10px 4px;
	font-weight: bold;
}
.facility_1 .product_list dd{
	padding-bottom: 10px;
}
#works .gallery{
	width: 900px;
	height: auto;
	overflow: hidden;
}
#works .gallery .photo_item{
	width: 930px;
}
#works .gallery .photo_item li{
	float: left;
	width: 280px;
	margin-right: 30px;
}
#works .gallery .caption{
	padding-top: 8px;
	text-align: left;
	font-size: 13px;
	line-height: 18px;
}
.facility_2 .products{
	width: 100%;
}
.facility_2 .product_list{
	width: 930px;
	padding-bottom: 30px;
	text-align: left;
}
.facility_2 .product_list dl{
	float: left;
	width: 280px;
	margin-right: 30px;
}

@media screen and (max-width: 960px){
	#works{
		padding: 4% 0 10%;
	}
	#works .facility_1{
		margin-bottom: 6%;
	}
	.facility_1 .products{
		padding-bottom: 4%;
	}
	.facility_1 .product_list{
		padding-bottom: 3%;
	}
	.facility_1 .product_list dl{
		padding: 0 2px 0 8px;
	}
	.facility_1 .product_list dt{
		font-size: 14px;
		padding: 2% 0;
	}
	.facility_1 .product_list dd{
		padding-bottom: 2%;
	}
	#works .gallery{
		width: 100%;
	}
	#works .gallery .photo_item{
		width: 101%;
	}
	#works .gallery .photo_item li{
		width: 32.33%;
		margin-right: 1%;
	}
	#works .gallery .caption{
		font-size: 12px;
		line-height: 16px;
	}
	.facility_2 .products{
		width: 100%;
	}
	.facility_2 .product_list{
		width: 101%;
		padding-bottom: 5%;
	}
	.facility_2 .product_list dl{
		width: 32.33%;
		margin-right: 1%;
	}
}
@media screen and (max-width: 650px){
	#works{
		padding: 5% 0;
	}
	#works .facility_1{
		margin-bottom: 4%;
	}
	.facility_1 .products, .facility_2 .products{
		padding-bottom: 8%;
	}
	.facility_1 .product_list, .facility_2 .product_list{
		display: block;
		padding-bottom: 3%;
	}
	.facility_1 .product_list dl, .facility_2 .product_list dl{
		display: block;
		width: 100%;
		padding: 0;
	}
	.facility_1 .product_list dl.list{
		border-right: none;
		border-bottom: 1px dotted #aaa;
	}
	.facility_1 .product_list dt{
		font-size: 13px;
	}
	#works .gallery .caption{
		font-size: 11px;
		line-height: 14px;
	}
}

/* [ Company ]
===================================================================== */

#company_visual{
	background: url(../img/company/header_company.jpg) center 65% no-repeat;
	background-size: cover;
}
.company_nav{
	width: 900px;
	height: 100px;
	overflow: hidden;
	margin: 0 auto 60px;
}
.company_nav ul{
	width: 920px;
	padding-top: 40px;
}
.company_nav li{
	float: left;
	width: 210px;
	height: 54px;
	line-height: 54px;
	margin-right: 20px;
}
.company_nav li a, .company_nav .current{
	border-radius: 27px;
}
.company_nav li a{
	display: block;
	color: #545454;
	background-color: #eee;
}
.company_nav .current{
	color: #fff;
	background: #343434;
}
.company_nav li a:hover{ background: #777; color: #fff;  }
.company_nav li a { text-decoration: none; outline: none; }
.company_nav li a::before, .company_nav li a::after { position: absolute; z-index: -1; display: block; content: ''; }
.company_nav li a, .company_nav li a::before,.company_nav li a::after { -webkit-transition: all .2s; transition: all .2s; }

@media screen and (max-width: 960px){
	#company_visual{
		background: url(../img/company/header_company.jpg) center 60% no-repeat;
		background-size: cover;
	}
	.company_nav{
		width: 96%;
		margin: 0 auto 6%;
	}
	.company_nav ul{
		width: 102%;
		padding-top: 5%;
	}
	.company_nav li{
		width: 23%;
		margin-right: 2%;
	}
}
@media screen and (max-width: 650px){
	.company_nav{
		height: auto;
		margin: 0 auto 10%;
	}
	.company_nav ul{
		width: 101%;
		padding-top: 5%;
	}
	.company_nav li{
		width: 24%;
		height: 40px;
		line-height: 40px;
		margin-right: 1%;
	}
	.company_nav li a, .company_nav .current{
		border-radius: 20px;
	}
}

/* [ 理念 ] -------------------------------------------------- */

#philosophy{
	position: relative;
}
.philosophy_body{
	width: 100%;
	padding: 0 0 120px;
	background: url(../img/company/vision_bg.jpg) center bottom no-repeat;
	background-size: 100%;
	font-family: 'UD新ゴ R','UD Shin Go Regular',sans-serif;
}
#philosophy .section{
	position: relative;
	padding-bottom: 80px;
}
#philosophy .text-area{
	width: 700px;
	height: auto;
	margin: 0 auto;
}
#philosophy .text-area img{
	display: block;
	width: 100%;
	height: auto;
}
#philosophy .text-area img:last-child{
	padding-top: 50px;
}
#philosophy #system img{
	width: 760px;
	padding-top: 2%;
}
#philosophy #credo img,
#philosophy #vision .text-area img:first-child{
	width: 260px;
}
#philosophy #credo img:last-child{
	width: 330px;
}
#philosophy #mission img:last-child{
	width: 380px;
}
#philosophy #vision .text-area img:last-child{
	width: 396px;
}
#philosophy #value .text-area img:last-child,
#philosophy #action .text-area img:last-child{
	padding-top: 0;
}
#philosophy #action .text-area img{
	width: 350px;
}
@media screen and (max-width: 960px){
	.philosophy_body{
		padding: 0 0 10%;
	}
	#philosophy .section{
		padding-bottom: 8%;
	}
	#philosophy .text-area{
		width: 70%;
	}
	#philosophy #system img{
		width: 90%;
	}
	#philosophy .text-area img:last-child{
		padding-top: 8%;
	}
	#philosophy #credo img,
	#philosophy #vision .text-area img:first-child{
		width: 220px;
	}
}
@media screen and (max-width: 650px){
	.philosophy_body{
		padding: 0;
	}
	#philosophy .section{
		padding-bottom: 15%;
	}
	#philosophy .text-area{
		width: 90%;
	}
	#philosophy #system img{
		width: 100%;
	}
	#philosophy #credo img,
	#philosophy #vision .text-area img:first-child{
		width: 120px;
	}
	#philosophy #credo img:last-child{
		width: 260px;
	}
	#philosophy #mission img:last-child{
		width: 250px;
	}
	#philosophy #vision .text-area img:last-child{
		width: 306px;
	}
	#philosophy #action .text-area img{
		width: 282px;
	}
}

/* [ 会社概要 ] -------------------------------------------------- */

#outline{
	position: relative;
	padding: 0 0 120px;
}
table.two_column{
	width: 100%;
	height: auto;
	margin: 0 auto;
	border-top: 1px solid #ddd;
	border-left: 1px solid #ddd;
}
table.two_column th, 
table.two_column td{
	padding: 16px 24px;
	text-align: left;
	border-right: 1px solid #ddd;
	border-bottom: 1px solid #ddd;
}
table.two_column th{
	width: 180px;
	background-color: #f6f6f6;
	vertical-align: top;
}
table.two_column td{
	width: 860px;
	background-color: #fff;
}
table.two_column a{
	color: #0099cc;
}
table.two_column a:hover{
	text-decoration: underline;
}
table.two_column dl{
	margin-bottom: 10px;
}
table.two_column dt{
	font-weight: bold;
}

@media screen and (max-width: 960px){
	#outline{
		padding: 0 0 10%;
	}
}
@media screen and (max-width: 650px){
	#outline{
		padding: 0 0 15%;
	}
	table.two_column th, table.two_column td{
		float: left;
		width: 100%;
		padding: 10px 10px;
		font-size: 13px;
	}
}

/* [ これまでの歩み ] -------------------------------------------------- */

#ayumi{
	position: relative;
	padding: 0 0 120px;
}
table.two_column_border{
	width: 100%;
	height: auto;
	margin: 0 auto;
	border-top: 1px solid #ddd;
}
table.two_column_border th, 
table.two_column_border td{
	padding: 16px 0;
	text-align: left;
	border-bottom: 1px solid #ddd;
}
table.two_column_border th{
	width: 200px;
	vertical-align: top;
}
table.two_column_border td{
	width: 840px;
}

@media screen and (max-width: 960px){
	#ayumi{
		padding: 0 0 10%;
	}
	table.two_column_border th{
		width: 22%;
	}
	table.two_column_border td{
		width: 78%;
	}
}
@media screen and (max-width: 650px){
	#ayumi{
		padding: 0 0 15%;
	}
	table.two_column_border{
		border-top: 1px solid #ddd;
	}
	table.two_column_border th, table.two_column_border td{
		float: left;
		width: 100%;
		padding: 0;
		border-bottom: none;
	}
	table.two_column_border th{
		font-size: 13px;
		padding: 4% 0 0;
	}
	table.two_column_border td{
		border-bottom: 1px solid #ddd;
		padding: 1% 0 4%;
	}
}

/* [ アクセス ] -------------------------------------------------- */

#access{
	position: relative;
	padding: 0 0 120px;
}
#access .section{
	padding-bottom: 60px;
	margin-bottom: 60px;
	border-bottom: 1px dotted #000;
}
#access .section h3.title{
	padding: 2px 0 2px 34px;
	margin-bottom: 30px;
	font-size: 20px;
	text-align: left;
	background: url(../img/company/icon_pin.svg) left top no-repeat;
}
#access .address, #access .access{
	width: 430px;
	height: auto;
	text-align: left;
}
#access .address{ float: left; }
#access .access{ float: right; }

#access .address p{
	padding-top: 20px;
}

/* google map */

.googlemap{
	margin-top: 20px;
}
.googlemap a{
	display: block;
	width: 100%;
	height: 60px;
	line-height: 60px;
	padding-left: 20px;
	font-weight: bold;
	color: #343434;
}
.googlemap a span{
	font-size: 15px;
	padding-left: 20px;
}
.googlemap a { position: relative; display: inline-block; text-align: center; text-decoration: none; outline: none; overflow: hidden; transition: all .5s; }
.googlemap a::before, .googlemap a::after { position: absolute; display: block; content: ''; width: 100%; height: 100%; transition: all .5s; }
.googlemap a::before { top: 0; left: 0; border-top: 2px solid #343434; border-left: 2px solid #343434; }
.googlemap a::after { right: 0; bottom: 0; border-right: 2px solid #343434; border-bottom: 2px solid #343434; }
.googlemap a:hover { transition: all .6s; background-color: #343434; color: #fff; }
.googlemap a:hover::before, .googlemap a:hover::after { width: 0; height: 0; opacity: 0; transition: all .6s; }

#access .access{
	border: 1px solid #333;
	padding: 26px 20px 0 26px;
}
#access .access .car{ background: url(../img/company/icon_car.svg) left top no-repeat; }
#access .access .public_transport{ background: url(../img/company/icon_public_transport.svg) left top no-repeat; }

#access .access h4{
	padding-left: 40px;
	padding-bottom: 20px;
}
#access .access dl{
	padding-bottom: 26px;
	color: #545454;
}
#access .access dt{
	float: left;
	font-size: 80%;
	padding-right: 2px;
}
#nitta .txt{
	text-align: left;
	margin-bottom: 20px;
}
@media screen and (max-width: 960px){
	#access{
		width: 96%;
		padding: 0 0 10%;
		margin: 0 auto;
	}
	#access .section{
		width: 103%;
		padding-bottom: 5%;
		margin-bottom: 5%;
	}
	#access .section h3.title{
		padding: 2px 0 4px 34px;
		margin-bottom: 3%;
	}
	#access .address, #access .access{
		width: 47%;
		margin-right: 3%;
	}
	#access .address p{
		padding-top: 3%;
	}
	.googlemap{
		margin-top: 3%;
	}
	#access .access{
		padding: 3% 2% 1%;
	}
	#nitta .txt{
		width: 98%;
		margin: 0 auto 2%;
	}
}
@media screen and (max-width: 650px){
	#access .section{
		width: 100%;
		padding-bottom: 5%;
		margin-bottom: 8%;
	}
	#access .section h3.title{
		padding: 1px 0 4px 26px;
		font-size: 16px;
		background: url(../img/company/icon_pin.svg) left top no-repeat;
		background-size: 18px;
	}
	#access .address, #access .access{
		float: left;
		width: 100%;
		margin-right: 0;
	}
	#access .address p, #access .access h4, #access .access dd{
		font-size: 13px;
		line-height: 22px;
	}
	.googlemap{
		margin-top: 5%;
	}
	#access .address{
		margin-bottom: 8%;
	}
	.googlemap a{
		height: 54px;
		line-height: 50px;
	}
	#access .access{
		border: none;
		padding: 0;
	}
	#nitta .txt{
		width: 100%;
	}
}


/* [ Privacy, Term ]
===================================================================== */

.header_txt{
	position: relative;
	width: 100%;
	height: 300px;
	overflow: hidden;
}
.header_txt .title p{
	padding-top: 120px;
	font-size: 75px;
	letter-spacing: 0.02em;
}
.header_txt .title h1{
	padding-top: 50px;
	font-size: 21px;
	letter-spacing: 0.3em;
}
#privacy, #term{
	padding: 0 0 40px;
	text-align: left;
}
#privacy .read, #term .read, #privacy .list_body, #term .list_body{
	padding-bottom: 60px;
}
#privacy .list_body a, #term .list_body a{
	color: #0099cc;
	text-decoration: underline;
}
#privacy .list_body a:hover, #term .list_body a:hover{
	text-decoration: none;
}
#privacy .list_body h3{
	padding: 20px 0 10px;
}
#privacy .list_body dt{
	padding-bottom: 10px;
	font-weight: bold;
	font-size: 15px;
	color: #000;
}
#privacy .list_body dd{
	padding: 0 0 30px 20px;
}

@media screen and (max-width: 960px){
	.header_txt{
		height: 220px;
	}
	.header_txt .title p{
		padding-top: 90px;
		font-size: 70px;
	}
	.header_txt .title h1{
		padding-top: 40px;
		font-size: 16px;
	}
	#privacy, #term{
		padding: 0 0 5%;
	}
	#privacy .read, #term .read, #privacy .list_body, #term .list_body{
		padding-bottom: 6%;
	}
	#privacy .list_body dt{
		padding-bottom: 1%;
		font-size: 14px;
	}
	#privacy .list_body dd{
		padding: 0 0 3% 20px;
	}
}
@media screen and (max-width: 650px){
	.header_txt{
		height: 200px;
	}
	.header_txt .title p{
		padding-top: 80px;
		font-size: 46px;
	}
	.header_txt .title h1{
		padding-top: 20px;
		font-size: 14px;
	}
	#privacy, #term{
		padding: 0 0 8%;
	}
	#privacy .read, #term .read, #privacy .list_body, #term .list_body{
		padding-bottom: 8%;
	}
	#privacy .list_body dt{
		font-size: 13px;
	}
}


/* [ Contact, Partner ]
===================================================================== */

#contact_visual{
	background: url(../img/contents/header_contact.jpg) center center no-repeat;
	background-size: cover;
}
#partner_visual{
	background: url(../img/contents/header_partner.jpg) center center no-repeat;
	background-size: cover;
}
#contact, #partner{
	position: relative;
	padding: 60px 0 120px;
	text-align: left;
}
#partner .read{
	padding-bottom: 60px;
}
.contact_form{
	position: relative;
	width: 100%;
	height: auto;
}
.contact_form .txt{
	padding-bottom: 40px;
}
.contact_form .hissu{
	color: red;
}
.contact_form table{
	width: 100%;
	height: auto;
}
.contact_form table tr{
}
.contact_form table th, .contact_form table td{
	padding: 12px 0;
	text-align: left;
}
.contact_form table th{
	width: 25%;
	vertical-align: middle;
}
.contact_form table td{
	width: 75%;
}
.contact_form td input,
.contact_form td textarea{
	width: 100%;
	padding: 16px 20px;
	border: solid 1px #ddd;
}

.contact_form td input[type="radio"]{ width: auto; vertical-align: middle; }

/* ラジオボタン/partner */
.contact_form td .wpcf7-list-item-label{ margin-right: 20px; }

/* ラジオボタン/contact */
.contact_form td .contact-radio-btn label{ display: inline-block; width: 100%; padding-bottom: 2px; }

.contact_form .check{
	width: 100%;
	padding: 30px 0;
	text-align: center;
	font-weight: bold;
}
.contact_form .check input{
	margin: 0 6px;
	font-size: 16px;
}
.contact_form .send_btn{
	width: 430px;
	height: 80px;
	margin: 0 auto 30px;
	text-align: center;
}
.contact_form .send_btn input{
	width: 430px;
	height: 80px;
	color: #fff;
	font-size: 18px;
	letter-spacing: .2em;
	border: none;
	background-color: #343434;
}
.contact_form .send_btn input:hover{ background-color: #000; }

@media screen and (max-width: 960px){
	#contact, #partner{
		padding: 4% 0 6%;
	}
	#partner .read{
		padding-bottom: 5%;
	}
	.contact_form .txt{
		padding-bottom: 5%;
	}
	.contact_form table th,
	.contact_form table td{
		padding: 2% 0;
	}
	.contact_form td input,
	.contact_form td textarea{
		padding: 3% 2%;
	}
	/* ラジオボタン/contact */
	.contact_form td .contact-radio-btn label{
		font-weight: bold;
	}	
	.wpcf7-list-item-label{
	}
	.contact_form .check{
		padding: 5% 0;
	}
	.contact_form .send_btn{
		margin: 0 auto 5%;
	}
	.contact_form .send_btn input{
		font-weight: bold;
	}

}
@media screen and (max-width: 650px){
	#contact_visual{
		background: url(../img/contents/header_contact.jpg) 30% center no-repeat;
		background-size: cover;
	}
	#contact, #partner{
		padding: 6% 0 10%;
	}
	#partner .read{
		padding-bottom: 8%;
	}
	.contact_form table th, .contact_form table td{
		float: left;
		width: 100%;
	}
	.contact_form table th{
		font-size: 14px;
		padding: 0 0 2%;
	}
	.contact_form table td{
		font-size: 13px;
		padding: 0 0 5%;
	}
	.contact_form td input,
	.contact_form td textarea{
		padding: 4% 2%;
	}
	.contact_form .check{
		padding: 5% 0 10%;
	}
	.contact_form .send_btn{
		width: 100%;
		height: 70px;
	}
	.contact_form .send_btn input{
		width: 100%;
		height: 70px;
		font-size: 18px;
	}
}

/* [ News ]
===================================================================== */

/* 個別ページ */
#posts{
	width: 100%;
	text-align: left;
}
#posts .post_wrap{
	position: relative;
	width: 760px;
	height: auto;
	overflow: hidden;
	margin: 0 auto;
}
#posts .post_wrap .post{
	width: 100%;
	padding-bottom: 100px;
}
#posts .post .cat{
	padding-bottom: 20px;
	font-weight: bold;
	font-size: 12px;
	color: #6e6e6e;
}
#posts .post .cat .dete{
	padding-left: 20px;
}
#posts .post p{
	line-height: 28px;
}
#posts .post_body a{
	color: #0099cc;
	text-decoration: underline;
}
#posts .post_body a:hover{
	text-decoration: none;
}
.post_body .alignright{
	float: right;
	padding-left: 20px;
}
.post_body .alignleft{
	float: left;
	padding-right: 20px;
}
.post_body .aligncenter{
	display: block;
	text-align: center;
	margin: 0 auto;
	padding: 20px 0;
}
#posts #gallery-1 img{
	border: 1px solid #fff;
}

@media screen and (max-width: 960px){
	#posts .post_wrap{
		width: 100%;
	}
	#posts .post_wrap .post{
		padding-bottom: 10%;
	}
	#posts .post .cat{
		padding-bottom: 2%;
		font-size: 13px;
	}
	#posts .post p{
		line-height: 22px;
	}
}
@media screen and (max-width: 650px){
	#posts .post_wrap .post{
		padding-bottom: 10%;
	}
	#posts .post .cat{
		padding-bottom: 3%;
	}
	#posts .post p{
		font-size: 14px;
		line-height: 24px;
	}
	.post_body .alignright, .post_body .alignleft, .post_body .aligncenter{
		float: none;
		width: 100%;
		height: auto;
		padding: 20px 0;
	}
}

/* お知らせ一覧ページ */

#posts_list{
	width: 1040px;
	height: auto;
	overflow: hidden;
	padding: 0 0 120px;
	margin: 0 auto;
	text-align: left;
}
#posts_list .news_area{
	width: 1040px;
}
#posts_list ul{
	position: relative;
	padding-bottom: 80px;
}
#posts_list li{
	position: relative;
	float: left;
	width: 260px;
	height: auto;
	padding-top: 20px;
	overflow: hidden;
	border-right: 1px solid #fff;
	text-align: left;	
}
#posts_list li:hover{ opacity: 0.8; filter:alpha(opacity=80); -moz-opacity: 0.8; }
#posts_list li { text-decoration: none; outline: none; }
#posts_list li::before, #posts_list li::after { position: absolute; z-index: -1; display: block; content: ''; }
#posts_list li, #posts_list li::before, #posts_list li::after { -webkit-transition: all .2s; transition: all .2s; }

#posts_list li a{
	display: block;
}
#posts_list .update{
	position: absolute;
	top: 0;
	left: 0;
	z-index: 4;
}
#posts_list li .thumb{
    width: 260px;
    height: 158px;
    position: relative;
    overflow: hidden;
    z-index: 1;
}
#posts_list li .cover{
	position: absolute;
    left: 50%;
    top: 50%;
    width: 100%;
    height: 100%;
    margin: -80px 0 0 -50%;
    text-align: center;
}
#posts_list li .cover img{
    vertical-align: bottom;
    min-width: 100%;
    min-height: 158px;
}
#posts_list li .cover img:hover{
	opacity: 10;
}
#posts_list li .caption{
	width: 260px;
	height: 140px;
	padding: 16px 20px 0;
}
#posts_list li:nth-child(odd) .caption{ background-color: #fafafa; }
#posts_list li:nth-child(even) .caption{ background-color: #f3f3f3; }

#posts_list li .caption .cat{
	font-weight: bold;
	font-size: 13px;
	color: #6e6e6e;
}
#posts_list li .caption .dete{
	padding-left: 10px;
	font-size: 13px;
}
#posts_list li .caption .title{
	font-size: 14px;
	line-height: 22px;
	padding: 6px 0 0;
}

@media screen and (max-width: 960px){
	#posts_list{
		width: 96%;
		padding: 0 0 15%;
	}
	#posts_list .news_area{
		width: 100%;
	}
	#posts_list ul{
		padding-bottom: 0;
	}
	#posts_list li{
		width: 100%;
		padding-top: 0;
		border-right: none;
		border-bottom: 1px solid #fff;
	}
	#posts_list li .thumb{
		float: left;
	    width: 27%;
	    height: 120px;
	}
	#posts_list li .cover{
	    margin: -60px 0 0 -50%;
	}
	#posts_list li .cover img{
	    min-width: 200px;
	    min-height: 120px;
	}
	#posts_list li .caption{
		float: right;
		width: 73%;
	    height: 120px;
		padding: 2% 3% 0;
	}
}
@media screen and (max-width: 650px){
	#posts_list{
		padding: 0 0 20%;
	}
	#posts_list .update{
		right: 1%;
		bottom: 2%;
		width: 40px;
	}
	#posts_list li .thumb{
	    width: 38%;
		height: 90px;
	}
	#posts_list li .cover{
	    margin: -45px 0 0 -50%;
	}
	#posts_list li .cover img{
	    min-width: 100px;
	    min-height: 90px;
	}
	#posts_list li .caption{
		width: 62%;
		height: 90px;
		padding: 10px 14px 0;
	}
	#posts_list li .caption .cat, #posts_list li .caption .dete{
		font-size: 11px;
	}
	#posts_list li .caption .title{
		font-size: 12px;
		line-height: 18px;
	}
}

/* カテゴリーメニュー */

.news_nav{
	width: 900px;
	height: 100px;
	overflow: hidden;
	margin: 0 auto 60px;
}
.news_nav ul{
	width: 920px;
	padding-top: 40px;
}
.news_nav li{
	float: left;
	width: 210px;
	height: 54px;
	line-height: 54px;
	margin-right: 20px;
}
.news_nav li a, .news_nav .current{
	border-radius: 27px;
}
.news_nav li a{
	display: block;
	color: #545454;
	background-color: #eee;
}
.news_nav .current{
	color: #fff;
	background: #343434;
}
.news_nav li a:hover{ background: #777; color: #fff;  }
.news_nav li a { text-decoration: none; outline: none; }
.news_nav li a::before, .company_nav li a::after { position: absolute; z-index: -1; display: block; content: ''; }
.news_nav li a, .news_nav li a::before, .news_nav li a::after { -webkit-transition: all .2s; transition: all .2s; }

@media screen and (max-width: 960px){
	.news_nav{
		width: 96%;
		margin: 0 auto;
	}
	.news_nav ul{
		width: 102%;
		padding-top: 0;
	}
	.news_nav li{
		width: 23%;
		margin-right: 2%;
	}
}
@media screen and (max-width: 650px){
	.news_nav{
		height: auto;
		padding-bottom: 10%;
	}
	.news_nav ul{
		width: 101%;
	}
	.news_nav li{
		width: 24%;
		height: 40px;
		line-height: 40px;
		margin-right: 1%;
	}
	.news_nav li a, .news_nav .current{
		border-radius: 20px;
	}
}

/* ページネーション */

.post_footer{
	width: 100%;
	margin: 0 auto;
	text-align: center;
}
#pagination{
	position: relative;
	width: 100%;
	height: auto;
	font-size: 12px;
	line-height: 20px;
	padding: 20px 0 120px;
	margin: 0 auto;
	text-align: center;
	border-top: 1px solid #ddd;
}
#pagination span, #pagination a{
	display: inline-block;
	width: auto;
	padding: 10px;
	color: #555;
}
#pagination a{ text-decoration: underline; }
#pagination a:hover{ text-decoration: none; }
#pagination .current{ color: #aaa; }

#posts .pager{
	position: relative;
	width: 100%;
	height: auto;
	padding: 20px 0 120px;
	margin: 0 auto;
	text-align: center;
	border-top: 1px solid #ddd;
}
#posts .pager div{
	display: inline-block;
	font-size: 12px;
}
#posts .pager div a{ text-decoration: underline; color: #545454; }
#posts .pager div a:hover{ text-decoration: none; }
#posts .pager .prev{ float: left; }
#posts .pager .next{ float: right; }

@media screen and (max-width: 960px){
	#pagination{
		margin-top: 5%;
		padding: 2% 0 10%;
	}
	#posts .pager{
		padding: 3% 0 10%;
	}
}
@media screen and (max-width: 650px){
	#pagination{
		margin-top: 10%;
		padding: 5% 0 10%;
	}
	#posts .pager{
		padding: 6% 0 20%;
	}
}