@charset "utf-8";





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

#h2-wrapper {
	width:100%;
	height:140px;
	background: transparent url(../i/h2_bg.jpg) no-repeat center center ;
	background-size:auto 200px;
	overflow: hidden;
}



/*==========================================

	flow
 
===========================================*/

div.anchor{
	width:100%;
	height:90px;
	font-weight: normal;
	background: transparent url(../i/flow_anchor60.png) no-repeat center top;
	padding:0 0 0 0;
	margin:12px 0 25px 0;
	text-indent: -9999px;
	text-align: left;
}

img.card{
	width:400px;
	padding: 0px 0 0 0;
	margin:12px 0 15px 0;

}

img.t-point{
	width:272px;
	padding: 0px 0px 0 0;
	margin:0px 18px 0px 0;
	float:left;

}

p.t-point-description{
	padding: 12px 0 0 0px;
	margin:0px 0 0px 0px;
}



/*==========================================

	top-coating-other
 
===========================================*/
.top-coating-other-wrapper{
	width:100%;
	margin: 21px auto 21px auto;
	padding: 36px 0 9px 0;
	text-align: center;
	background: #f1f2ef;
}

.top-coating-other{
	width:90%;
	display: block;
	justify-content: center;
	margin: auto;
}

.top-coating-other-lead{
	width: 90%;
	margin: auto;
}

.top-coating-other{
	width:90%;
	display: block;
	justify-content: center;
	margin: auto;
}

.top-coating-other-col{
	width: 100%;
	margin: 21px 0px 54px 0px;
	text-align: left;
}


.to-detail-other{
	width: 100%;
	padding: 0 0 0 0;
	margin: 20px 0 0px 0;
	text-align: center;
}
.to-detail-other a{
	display: inline-block;
	width: 300px;
	font-size:15px;
	background: #595757;
	color:#fff;
	padding:10px 40px 10px 40px;
	text-decoration: none;
}

.to-detail-other a:hover{
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
 }





}/*//end  max-width: 480px ///////////////////////*/






@media only screen and (min-width: 481px) {




#h2-wrapper {
	width:100%;
	min-width: 960px;
	height:200px;
	background: transparent url(../i/h2_bg.jpg) no-repeat center center ;
	background-size: 100% auto;
}


/*==========================================

	flow
 
===========================================*/

div.anchor{
	width:100%;
	height:90px;
	font-weight: normal;
	background: transparent url(../i/flow_anchor60.png) no-repeat center top;
	padding:0 0 0 0;
	margin:12px 0 25px 0;
	text-indent: -9999px;
	text-align: left;
}

img.card{
	width:400px;
	padding: 0px 0 0 0;
	margin:12px 0 15px 0;

}

img.t-point{
	width:272px;
	padding: 0px 0px 0 0;
	margin:0px 18px 0px 0;
	float:left;

}

p.t-point-description{
	padding: 12px 0 0 0px;
	margin:0px 0 0px 0px;
}



/*==========================================

	top-coating-other
 
===========================================*/
.top-coating-other-wrapper{
	width:960px;
	margin: 45px auto 0px auto;
	padding: 36px 0 36px 0;
	text-align: center;
	background: #f1f2ef;
}

.top-coating-other{
	display: flex;
	justify-content: center;
}

.top-coating-other-col{
	width: 300px;
	margin: 21px 14px 0 12px;
	text-align: left;
}


.to-detail-other{
	width:100%;
	padding: 0 0 0 0;
	margin: 20px 0 0px 0;
	text-align: center;
}
.to-detail-other a{
	display: inline-block;
	width: 300px;
	font-size:15px;
	background: #595757;
	color:#fff;
	padding:10px 40px 10px 40px;
	text-decoration: none;
}

.to-detail-other a:hover{
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
 }


.coating-mainphoto{
	margin: 0 0 45px 0;
}

.coating-lead{
	margin: 0 auto 45px auto;
}

}/*//end  min-width: 769px ///////////////////////*/