﻿
/* CSS Document */
@import url('common1.css');
/* 共通 */
#topimage{
	overflow:hidden;
	text-align:center;
}
#tect .content{
	background:url(../image/bg.jpg) repeat-y;
	position:relative;
}
#tect .content:before{
	content:"";
	display:block;
	position:absolute;
	left:0;
	right:0;
	background:#ffffff;
	box-shadow: 0 0 5px rgba(0,0,0,.3);
	z-index:1;
	margin-right:auto;
	margin-left:auto;
}
#tect .content >.wrap{
	background:#ffffff;
	box-shadow: 0 0 5px rgba(0,0,0,.3);
}
#tect .section3 >.wrap{
	background:#fffded;
}
.tester_section >dt{
	line-height:0;
}
.pest{
	background-repeat:no-repeat;
	background-position:left top;
}
.pest dt{
	position:relative;
	font-weight:700;
}
.pest dt:after{
	content:"";
	display:block;
	height:2px;
	background:url(../image/border5.png) repeat-x;
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	margin:auto;
}
.section3 .pest{
	background-image:url(../image/s3_pest.png);
}
.section4 .pest{
	background-image:url(../image/s4_pest.png);
}
.section5 .pest{
	background-image:url(../image/s5_pest.png);
}
.section7{
	border-top:1px solid #c9dee5;
}
#tect .section6 .attention{
	font-size:0.857em;
	overflow:hidden;
	clear:both;
	text-align:left;
}
#tect .tag{
	text-align:center;
	line-height:1;
	color:#e4007f;
	font-weight:500;
	margin-top:20px;
}
#tect .tag span{
	display:inline-block;
	border:2px solid #e4007f;
	border-radius:20px;
	padding:3px 30px;
}
/*PC
----------------------------------------------------*/
@media screen and (min-width:1081px),print{
	.product_brand{
		width:980px;
		margin-right:auto;
		margin-left:auto;
	}
	#topimage{
		margin-bottom:70px;
	}
	#tect .content:before{
		display:block;
		width:954px;
		top:30px;
		bottom:13px;
		left:0;
		right:0;
	}
	#tect .content{
		padding:20px;
	}
	#tect .content >.wrap{
		padding:30px;
		position:relative;
		z-index:2;
	}
	.section_tle{
		width:370px;
	}
	#tect section{
		margin-bottom:50px;
	}
	#tect section >h4{
		margin-bottom:30px;
	}
	#tect section >h5{
		margin-bottom:30px;
	}
	#tect section figure{
		text-align:center;
		margin-top:15px;
		margin-bottom:15px;
	}
	.tester_section >dt{
		width:65px;
		margin-bottom:5px;
	}
	.section3 .pest{
		background-image:url(../image/s3_pest_pc.png);
		padding-top:10px;
	}
	.section4 .pest{
		background-image:url(../image/s4_pest_pc.png);
		padding-top:24px;
	}
	.section5 .pest{
		background-image:url(../image/s5_pest_pc.png);
		padding-top:24px;
	}
	.pest dt{
		padding-left:20px;
		margin-bottom:5px;
	}
	.pest dt:after{
		width:calc(100% - 115px);
	}
	#tect .content >.wrap >h3{
		padding-bottom:40px;
	}

	#tect .content >.wrap >h4{
		background:url(../image/tle_bg.png) no-repeat center;
		padding:9px 55px;
		text-align:center;
		margin-bottom:50px;
	}
	#tect .section3 >.wrap{
		padding:30px 40px;
		display:flex;
		flex-wrap:wrap;
		justify-content:space-between;
	}
	#tect .section3 .tester_section{
		width:390px;
	}
	#tect .section3 figure{
		display:flex;
		flex-wrap:wrap;
	}
	#tect .section3 figure >.image:first-of-type{
		width:260px;
		padding-right:14px;
	}
	#tect .section4,#tect .section5{
		width:410px;
		overflow:hidden;
	}
	#tect .section4{
		float:left;
		overflow:hidden;
		padding-right:20px;
		padding-left:20px;
	}
	#tect .section6{
		padding-right:20px;
		padding-left:20px;
	}
	#tect .section6 figure{
		display:flex;
		flex-wrap:wrap;
	}
	#tect .section6 figure >div{
		width:410px;
		margin-bottom:20px;
	}
	#tect .section6 figure >div:first-child{
		margin-right:20px;
	}
	#tect .section6 .attention dt{
		width:115px;
		float:left;
		overflow:hidden;
	}
	#tect .section6 .attention dd:first-of-type{
		margin-bottom:10px;
	}
	#tect .section6 .attention dd{
		overflow:hidden;
	}
	#tect .section7 figure{
		display:flex;
		padding-right:20px;
		padding-left:20px;
	}
	#tect .section7 figure >div:first-child{
		width:475px;
	}
	#tect .section7 figure >div:last-child{
		width:350px;
	}
	.section7{
		padding-top:50px;
	}
	
}
/*Tab
--------------------------------------------------*/
@media screen and (max-width:1080px) and (min-width:751px){
	#tect >article{
		margin:0 5%;
	}
	#tect >article{
		padding:3%;
	}
	#tect article section h4,#tect article section h5{
		width:60%;
	}
	#tect article section figure >.image{ 
		max-width:500px;
		margin-right:auto;
		margin-left:auto;
	}
	#tect article .section3 .tester1 figure{
		width:50%;
		margin-right:auto;
		margin-left:auto;
	}

}
/*Tab&Phone
--------------------------------------------------*/
@media screen and (max-width:1080px){
	#topimage{
		width:90%;
		margin:0 auto 7%;
	}
	#tect .content:before{
		width:95%;
		height:calc(99% + 5px);
		z-index: 1;
	}
	#tect >article >.wrap{
		padding:5%;
		position:relative;
		z-index: 5;
	}
	#tect .content >.wrap >h3{
		margin-bottom:5%;
	}
	#tect .content >.wrap >h4{
		background:url(../image/tle_bg_phone.png) no-repeat center /100% auto;
		text-align:center;
		padding-top:2%;
		padding-bottom:2%;
		margin-bottom:2em;
	}
	#tect article section{
		margin-bottom:7%;
	}
	#tect article section figure{
		text-align:center;
		margin-top:3%;
		margin-bottom:3%;
	}
	#tect section figure >div:last-child{
		margin-top:2%;
		margin-bottom:2%;
	}

	#tect article section h4,#tect article section h5{
		margin-bottom:5%;
	}
	#tect .section3 >.wrap{
		padding:5%;
	}
	#tect .tester_section >dt{
		width:4em;
		margin-bottom:1%;
	}
	#tect .attention dd{
		margin-bottom:1em;
		margin-top:1%;
	}
	#tect .pest{
		background-size:85px auto;
		padding-top:10px;
	}
	.pest dt:after{
		width:calc(100% - 7em);
	}
	.pest dt{
		margin-bottom:1%;
		padding-left:1em;
	}
	#tect .tester_section{
		margin-bottom:5%;
	}
	.section7{
		padding-top:7%;
	}
}
/*Phone
--------------------------------------------------*/
@media screen and (max-width:750px){
	#tect >article{
		padding:5%;
	}
}