
/******************************************/
/*##################################################################################################*/

@media (min-width:768px) {
body { margin:0;padding:0;font-family:Arial,Helvetica,sans-serif;
	background-color:#fff;
	height:200%;
        width:100%;
	word-break: break-all;
	background:url(../img/con_bg01.jpg);
	background-repeat:repeat;

}
.top_img{
	margin-top:65px;
	padding:115px 0px 0px 0px;
        width:100%;
        height:175px;
	color:#ff0000;
	font-size:38px;
	font-weight:bold;
	font-family: "Hiragino Kaku Gothic ProN", "Osaka", Arial, sans-serif;
	text-align:center;
	display:block;
	background:url(../img/tran/top_img.jpg);
	background-repeat:no-repeat;
background-size:cover;
	position:relative;
	z-index:100;
}

.top_img .txtc{
	font-size:14px;
	font-weight:normal;
	color:#fff;
	text-align:center;

}

.tran_box{
	width:700px;
	margin:-62px auto 80px auto;
	padding:60px 100px 80px 100px;
	overflow: hidden;
	background-color:#fff;
	position:relative;
	z-index:101;
}
.rhr{
	width:100%;
	border:solid 1px #e60012;
	margin-top:20px;
}
.top_txt{
	margin-top:30px;
	font-size:16px;
	font-weight:normal;
	color:#000;
	text-align:left;

}

.midashi{
	width:100%;
	height:45px;
	margin:0px auto;
	padding:0px;
	text-align:center;
	font-size:28px;
	font-weight:bold;
	color:#000;
}

.img_box{
	width:700px
	height:180px;
	margin:20px auto 0px auto;
	text-align:center;
}

.tran_box .box{
	width:700px;
	height:310px;
	margin:40px auto 0px auto;
	padding:0px;
	display:block;
}
.tran_box .box .lbox{
	width:405px;
	height:310px;
	margin:0px;
	padding:0px;
	display:block;
	float:left;
}
.tran_box .box .rbox{
	width:275px;
	height:240px;
	margin:70px 0px 0px 20px;
	padding:0px;
	display:block;
	text-align:left;
	font-size:16px;
	color:#000;
	font-weight:normal;
	float:left;
}
.tran_box .box .rbox .mtxt{
	text-align:left;
	font-size:18px;
	font-weight:normal;
	color:#e10000;
}




.mr5{
margin-right:5%;
}
.ml5{
margin-left:5%;
}
.mr3{
margin-right:3%;
}

}

/******************************************/
/*##################################################################################################*/

@media screen and (min-width:768px) and ( max-width:1000px) {
body { margin:0;padding:0;font-family:Arial,Helvetica,sans-serif;
	background-color:#fff;
	height:200%;
        width:100%;
	word-break: break-all;
	background:url(../img/con_bg01.jpg);
	background-repeat:repeat;
}

.top_img{
	margin-top:65px;
	padding-top:10vw;
	width: 100vw;
	height: 20vw;
	color:#ff0000;
	font-size:32px;
	font-weight:bold;
	font-family: "Hiragino Kaku Gothic ProN", "Osaka", Arial, sans-serif;
	text-align:center;
	line-height:100%;
	display:block;
	background:url(../img/tran/top_img.jpg);
	background-repeat:no-repeat;
	/*background-size:cover;*/
	background-size:contain;
	position:relative;
	z-index:100;
}
.top_img .txtc{
	font-size:14px;
	font-weight:normal;
	color:#fff;
	text-align:center;

}


.tran_box{
	width:61%;
	margin:-60px auto 8% auto;
	padding:6% 10% 8% 10%;
	overflow: hidden;
	background-color:#fff;
	position:relative;
	z-index:101;
}
.rhr{
	width:100%;
	border:solid 1px #e60012;
	margin-top:20px;
}
.top_txt{
	margin-top:30px;
	font-size:16px;
	font-weight:normal;
	color:#000;
	text-align:left;

}

.midashi{
	width:100%;
	height:45px;
	margin:0px auto;
	padding:0px;
	text-align:center;
	font-size:28px;
	font-weight:bold;
	color:#000;
}

.img_box{
	width:100%
	height:180px;
	margin:20px auto 0px auto;
	text-align:center;
}

.tran_box .box{
	width:100%;
	height:auto;
	max-height:310px;
	margin:4% auto 0% auto;
	padding:0px;
	display:block;
}
.tran_box .box .lbox{
	width:56%;
	height:auto;
	max-height:310px;
	margin:0px;
	padding:0px;
	display:block;
	float:left;
}
.tran_box .box .lbox img{
	width:100%;
}
.tran_box .box .rbox{
	width:42%;
	margin:7% 0px 0px 2%;
	padding:0px;
	display:block;
	text-align:left;
	font-size:14px;
	color:#000;
	font-weight:normal;
	float:left;
}
.tran_box .box .rbox .mtxt{
	text-align:left;
	font-size:18px;
	font-weight:normal;
	color:#e10000;
}




.mr5{
margin-right:5%;
}
.ml5{
margin-left:5%;
}
.mr3{
margin-right:3%;
}
}

/******************************************/
/*##################################################################################################*/


@media (max-width:767px) {

body { margin:0;padding:0;font-family:Arial,Helvetica,sans-serif;
	background-color:#fff;
	height:200%;
        width:100%;
	word-break: break-all;
	background:url(../img/con_bg01.jpg);
	background-repeat:repeat;
}

.top_img{
	margin-top:65px;
	padding-top:10vw;
	width: 100vw;
	height: 20vw;
	color:#ff0000;
	font-size:20px;
	font-weight:bold;
	font-family: "Hiragino Kaku Gothic ProN", "Osaka", Arial, sans-serif;
	text-align:center;
	line-height:100%;
	display:block;
	background:url(../img/tran/top_img.jpg);
	background-repeat:no-repeat;
	/*background-size:cover;*/
	background-size:contain;
	position:relative;
	z-index:100;
}
.top_img .txtc{
	font-size:12px;
	font-weight:normal;
	color:#fff;
	text-align:center;

}


.tran_box{
	width:80%;
	margin:-6% auto 8% auto;
	padding:6% 5% 5% 5%;
	overflow: hidden;
	background-color:#fff;
	position:relative;
	z-index:101;
}
.rhr{
	width:100%;
	border:solid 1px #e60012;
	margin-top:20px;
}
.top_txt{
	margin-top:30px;
	font-size:12px;
	font-weight:normal;
	color:#000;
	line-height:180%;
	text-align:left;

}

.midashi{
	width:100%;
	margin:0px auto;
	padding:0px;
	text-align:center;
	font-size:16px;
	font-weight:bold;
	color:#000;
}

.img_box{
	width:90%;
	margin:5% auto 0% auto;
	text-align:center;
}
.img_box img{
	width:100%;
}


.tran_box .box{
	width:100%;
	margin:40px auto 0px auto;
	padding:0px;
	display:block;
}
.tran_box .box .lbox{
	width:100%;
	margin:5% auto 0% auto;
	padding:0px;
	display:block;
}
.tran_box .box .lbox img{
	width:100%;
}
.tran_box .box .rbox{
	width:100%;
	height:auto;
	margin:1% 0% 5% 0%;
	padding:0px;
	display:block;
	text-align:left;
	font-size:12px;
	color:#000;
	font-weight:normal;
	line-height:180%;


}
.tran_box .box .rbox .mtxt{
	text-align:left;
	font-size:13px;
	font-weight:normal;
	color:#e10000;
	line-height:180%;

}




.mr5{
margin-right:5%;
}
.ml5{
margin-left:5%;
}
.mr3{
margin-right:3%;
}

}

/*#######################################################################################*/




.clear{
	clear:both;
}
.list60{
width:60px;
padding:3px 2px;
}
.list130{
width:130px;
padding:3px 2px;
}
.list250{
width:270px;
padding:3px 2px;
}


