/*----------------------------- common style -----------------------------*/

#Container {
	width: 770px;
	margin: 0 auto 50px;
}
@media screen and (max-width:640px){
#Container { width:100%; margin: 0 auto 30px; }
}

#mainArea{
width:100%;
font-size:0.8em;
}

.header_btn{
text-align: right;
}

#mainArea a:hover img, #rightMenu a:hover img{
opacity: 0.7;
filter: alpha(opacity=70);
-ms-filter: "alpha(opacity=70)";
-moz-opacity:0.7;
-khtml-opacity: 0.7;
}

.co{
margin:0;
position:relative;
/*cursor:pointer;*/
overflow:hidden;
}
.coSub{
margin:0;
}

.c2infoArea{
margin-top:30px;
padding:30px 0 20px 0;
border-top:1px dotted #999;
}
/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------*/
@media screen and (min-width:641px){

/*----------------------------- title -----------------------------*/
#titleCo{
position: relative;
height:400px;
margin-bottom: 20px;
}

.spTitle {
	display: none;
}

#coNav {
overflow: hidden;
margin-bottom: 15px;
}
.co1Nav {
position: relative;
float: left;
width: 246px;
margin-right: 16px;
}
.co2Nav {
position: relative;
float: left;
width: 246px;
margin-right: 16px;
}
.co3Nav {
position: relative;
float: left;
width: 246px;
}
#coNav a {
display: block;
height: 282px;
}
#coNav a:hover img {
opacity: 1;
filter: alpha(opacity=100);
-ms-filter: "alpha(opacity=100)";
-moz-opacity: 1;
-khtml-opacity: 1;
}
#coNav .navText {
position: absolute;
background: #0A0930;
top: 157px;
width: 246px;
height: 176px;
}
#coNav h2 {
margin: 17px 0 15px;
text-align: center;
}
#coNav .titleText {
display: none;
margin-bottom: 18px;
text-align: center;
}
#coNav .click {
padding-bottom: 8px;
text-align: center;
}
#coNav .active {
position: absolute;
border: 3px solid #0A0930;
top: 0;
left: 0;
width: 240px;
height: 276px;
}

.coNote {
	font-size: 95%;
}

/*----------------------------- co1 -----------------------------*/
#co1 {
display: none;
background: #E5E5E5;
padding: 40px;
}
#co1 h3 {
margin-bottom: 20px;
}
#co1 p.title {
padding: 0 25px 45px;
font-size: 110%;
}
#co1 p.img01 {
padding-bottom: 42px;
text-align: center;
}
#co1 p.img02 {
padding-bottom: 48px;
text-align: center;
}
#co1 .img03 {
	overflow: hidden;
	margin-left: 25px;
}
#co1 .img03 .img03Left {
	float: left;
	width: 230px;
}
#co1 .img03 .img03Right {
	float: left;
	width: 410px;
}
#co1 .img03 .img03Right li {
	padding-bottom: 20px;
}
#co1 .img03 .img03Right img {
	float: left;
	margin-right: 11px;
	vertical-align: middle;
}
#co1 .img03 .img03Right .img03Title {
	float: left;
	font-weight: bold;
	font-size: 130%;
	line-height: 21px;
}
#co1 .img03 .img03Right p {
	clear: both;
	padding: 10px 0 3px;
	font-size: 110%;
}
#co1 .img03 .img03Right p.note {
	font-size: 95%;
	padding: 0 0 15px;
}
#co1 .img04 .title {
	padding-bottom: 25px;
}
#co1 .img04 .img {
	padding: 0 25px 10px;
}


/*----------------------------- co2 -----------------------------*/
#co2 {
display: none;
background: #E5E5E5;
padding: 40px;
}
#co2 h3 {
margin-bottom: 20px;
}
#co2 p.title {
padding: 0 25px 45px;
font-size: 110%;
}
#co2 p.title span {
	font-size: 80%;
	vertical-align: top;
}
#co2 p.img01 {
margin-top: -15px;
padding-bottom: 5px;
text-align: center;
}
#co2 p.note {
padding: 0 25px 40px;
}
#co2 .img02 {
padding: 0 0 60px;
}
#co2 .img02 .title {
	padding: 0 25px 25px;
}
#co2 .img02 .img {
	padding-left: 25px;
}
#co2 .img03 {
overflow: hidden;
padding: 0 24px 60px;
}
#co2 .img03 .img03Left {
	float: left;
	width: 330px;
	font-size: 110%;
}
#co2 .img03 .img03Left .note {
	display: block;
	font-size: 95%;
	margin-top: 15px;
}
#co2 .img03 .img03Right {
	float: right;
}

/*----------------------------- co3 -----------------------------*/
#co3 {
display: none;
background: #E5E5E5;
padding: 40px;
}
#co3 h3 {
margin-bottom: 20px;
}
#co3 p.title {
padding: 0 25px 30px;
font-size: 110%;
}
#co3 .rightImgList {
	overflow: hidden;
	margin-left: 5px;
}
#co3 .rightImgList li {
	float: left;
	padding-left: 18px;
}
#co3 .summary {
	margin: 40px 0 5px 25px;
	font-weight: bold;
	font-size: 95%;
}
#co3 table {
	border-top: 1px solid #777777;
	border-left: 1px solid #777777;
	width: 642px;
	margin: 0 auto 10px;
}
#co3 table th, #co3 table td {
	border-right: 1px solid #777777;
	border-bottom: 1px solid #777777;
	padding: 12px; 0
	font-size: 95%;
	text-align: center;
}
#co3 table th {
	background: #3F3F3F;
	color: #FFF;
	font-weight: bold;
}
#co3 table span {
	font-size: 80%;
	vertical-align: top;
}
#co3 table td {
	background: #FFF;
}
#co3 table td strong {
	font-weight: bold;
}
#co3 .tableNoteTitle {
	margin-left: 25px;
	font-size: 110%;
	font-weight: bold;
}
#co3 .tableNote {
	margin: 0 0 35px 25px;
}
#co3 .tableNote p {
	margin-left: 1.6em;
	font-size: 95%;
	text-indent: -1.6em;
}
#co3 .img01 {
	overflow: hidden;
	padding: 0 25px 60px;
}
#co3 .img01Left {
	float: left;
	width: 280px;
	font-size: 110%;
}
#co3 .img01Left .btn {
	margin-top: 30px;
}
#co3 .img01Right {
	float: right;
}
#co3 .img01Right img {
	margin-left: 10px;
}
#co3 .img03 {
	overflow: hidden;
	margin-bottom: 25px;
	padding: 0 25px 45px;
	border-bottom: 1px solid #CCC;
}
#co3 .img03Left {
	float: left;
	width: 345px;
	font-size: 110%;
}
#co3 .img03Left .btn {
	margin-top: 30px;
}
#co3 .img03Right {
	float: right;
}

.note {
font-size: 90%;
}

#coFootNav {
display: none;
overflow: hidden;
position: relative;
margin: 20px 0 8px;
}
#coFootNav a {
display: block;
background: #0A0930;
height: 122px;
}
#coFootNav .click {
padding-top: 12px;
text-align: center;
}
#coFootNav h2 {
margin-top: 15px;
text-align: center;
}


/*----------------------------- co4 -----------------------------*/
#co4{
background: #F8FAF9;
border: 1px solid #EAEAEA;
width: auto;
margin: 45px 0 30px;
padding: 25px 20px 25px 10px;
}
#co4 .navi .title {
margin-bottom: 20px;
padding-left: 10px;
text-align: center;
}
#co4 .navi ul {
overflow: hidden;
padding-bottom: 30px;
margin-top: -14px;
}
#co4 .navi li {
position: relative;
float: left;
margin: 14px 0 0 14px;
}
#co4 .navi li a.one {
position: absolute;
display: block;
width: 225px;
height: 35px;
top: 128px;
left: 65px;
}
#co4 .navi li a.two-left {
position: absolute;
display: block;
width: 155px;
height: 35px;
top: 128px;
left: 15px;
}
#co4 .navi li a.two-right {
position: absolute;
display: block;
width: 155px;
height: 35px;
top: 128px;
left: 185px;
}
#co4 .navi li a.three-left {
position: absolute;
display: block;
width: 115px;
height: 35px;
top: 128px;
left: 15px;
}
#co4 .navi li a.three-center {
position: absolute;
display: block;
width: 115px;
height: 35px;
top: 128px;
left: 140px;
}
#co4 .option .title {
border-top: 1px dotted #D3D3D3;
margin: 0 0 20px 10px;
padding-top: 20px;
text-align: center;
}
#co4 .option ul {
overflow: hidden;
}
#co4 .option li {
float: left;
margin-left: 14px;
}


/*----------------------------- spec -----------------------------*/
#rmSpec{
background: #EFEFEF;
}
#rmSpec h4{
background: #1C1C1C;
padding: 26px 30px;
}
#rmSpec .product {
	margin: 40px 40px 20px;
}
#rmSpec .productNote {
	float: left;
	width: 410px;
	margin-left: 40px;
	padding-bottom: 40px;
}
#rmSpec .productNote p{
	font-size: 80%;
	text-indent: -1em;
	margin-left: 1em;
}
#rmSpec .productNote p.alert {
	margin-bottom: 5px;
	color: #EC3339;
}
#rmSpec .download {
	float: right;
	width: 262px;
	margin: -3px 40px 0 0;
	border: 1px solid #010101;
	background: #FFF;
}
#rmSpec .download ul {
	display: block;
	margin: 10px 10px 5px;
}
#rmSpec .download ul li {
	float: left;
	width: 121px;
	text-align: center;
}
#rmSpec .download ul li a:hover {
	text-decoration: underline;
}
#rmSpec .download .note {
	margin-bottom: 10px;
	padding: 0;
	font-size: 80%;
	text-align: center;
}
#rmSpec table{
clear: both;
width: 690px;
margin:0 auto 10px;
border-top:solid 1px #000;
border-left:solid 1px #000;
border-collapse:collapse;
background-color:#fff;
}
#rmSpec th{
width: 680px;
padding:5px 10px;
border-right:solid 1px #333;
border-bottom:solid 1px #333;
background:#DBDBDB;
font-weight:bold;
}
#rmSpec td{
padding:5px 10px;
border-right:solid 1px #333;
border-bottom:solid 1px #333;
font-size: 12px;
}
#rmSpec td span{
margin-left: 2px;
font-size: 70%;
vertical-align: top;
}
#rmSpec .note {
	padding: 0 40px 30px;
}

/*----------------------------- report -----------------------------*/
.popupBox {
display: none;
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
z-index: 1000;
}
.popupBox .bg{
cursor: pointer;
}
.popupBox .bg img{
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
.popup01 {
display: none;
position: absolute;
background: #0A0532;
width: 640px;
padding: 30px 25px 25px;
color: #FFF;
}
.popup01 .title {
margin-bottom: 22px;
}
.popup01 .text {
margin-bottom: 25px;
font-size: 110%;
line-height: 1.6;
}
.popup02 {
display: none;
position: absolute;
background: #0A0532;
width: 640px;
padding: 30px 25px 25px;
color: #FFF;
}
.popup02 .title {
margin-bottom: 22px;
}
.popup02 .text {
margin-bottom: 20px;
font-size: 110%;
line-height: 1.6;
}
.popup03 {
display: none;
position: absolute;
background: #0A0532;
width: 640px;
padding: 30px 25px 25px;
color: #FFF;
}
.popup03 .title {
margin-bottom: 22px;
}
.popup03 .text {
margin-bottom: 25px;
font-size: 110%;
line-height: 1.6;
}
.popupBox .close{
position: absolute;
}
#mainArea .popupBox .close:hover{
top: 79px;
}
#mainArea .popupBox .close:hover img {
opacity: 1;
filter: alpha(opacity=100);
-ms-filter: "alpha(opacity=100)";
-moz-opacity:1;
-khtml-opacity: 1;
}


#rightMenu{
position:fixed;
right:0;
top:50%;
margin-top:-178px;
z-index:1000;
}
.spMenu{
	display: none;
}
#rightMenu .close {
	display: none;
}
}


/*-------------------------------------------------------------------------------------------------------------------------------------------------------------------*/

@media screen and (max-width:640px){
	#Contents_all{ width:300px; margin: 0; }
	#Contents{ width:300px; margin: 0 auto; }
	.w770{ width:300px; }
	.co{ width:300px; }
	.imgChange {
		width: 100%;
	}
	strong {
		font-weight: bold;
	}
	
	#coNav {
		display: none;
	}
	
	#co1 {
		display: block;
		background: #E5E5E5;
		margin-top: 10px;
	}
	#co1 .spTitle {
		width: 235px;
		margin: 30px auto;
	}
	#co1 h3 {
		margin-bottom: 12px;
		text-align: center;
	}
	#co1 h3 img {
		width: 290px;
	}
	#co1 .title {
		padding: 0 15px 20px;
		font-size: 110%;
	}
	#co1 .img01 {
		display: none;
	}
	#co1 .img02 {
		margin-bottom: 23px;
		text-align: center;
	}
	#co1 .img02 img {
		width: 261px;
	}
	#co1 .img03Left {
		text-align: center;
	}
	#co1 .img03Left img {
		width: 197px;
	}
	#co1 .img03Right img {
		display: block;
		float: left;
		width: 22px;
		margin-right: 7px;
	}
	#co1 .img03Right {
		padding: 0 15px;
	}
	#co1 .img03Right li {
		margin-top: 20px;
	}
	#co1 .img03Right .img03Title {
		font-size: 120%;
		font-weight: bold;
	}
	#co1 .img03Right p {
		clear: both;
		margin-top: 10px;
		font-size: 110%;
	}
	#co1 .img03Right p.note {
		margin-top: 0;
		padding-bottom: 22px;
		font-size: 95%;
	}
	#co1 .img04 .img {
		padding-bottom: 22px;
		text-align: center;
	}
	#co1 .img04 .img img {
		width: 282px;
	}
	
	#co2 {
		display: block;
		background: #E5E5E5;
		margin-top: 30px;
	}
	#co2 {
		margin-top: 30px;
	}
	 #co2 .spTitle {
		width: 265px;
		margin: 30px auto;
	}
	#co2 h3 {
		margin-bottom: 12px;
		text-align: center;
	}
	#co2 h3 img {
		width: 290px;
	}
	#co2 .title {
		padding: 0 15px 20px;
		font-size: 110%;
	}
	#co2 .img01 {
		margin-bottom: 10px;
		text-align: center;
	}
	#co2 .img01 img {
		width: 290px;
	}
	#co2 .note {
		padding: 0 0 20px;
		font-size: 90%;
	}
	#co2 .img02 {
		padding: 0 0 25px;
	}
	#co2 .img02 .img img {
		width: 290px;
		margin-left: 15px;
	}
	#co2 .img03 {
		padding: 0 15px 25px;
		font-size: 110%;
	}
	#co2 .img03 .img03Left span {
		display: block;
		padding: 0;
		margin: 5px 0 0;
	}
	#co2 .img03 .img03Right {
		padding-top: 20px;
		text-align: center;
	}
	#co2 .img03 .img03Right img {
		width: 210px;
	}

	#co3 {
		display: block;
		background: #E5E5E5;
		margin-top: 30px;
	}
	#co3 {
		margin-top: 30px;
	}
	 #co3 .spTitle {
		width: 206px;
		margin: 30px auto;
	}
	#co3 h3 {
		margin-bottom: 12px;
		text-align: center;
	}
	#co3 h3 img {
		width: 290px;
	}
	#co3 .title {
		padding: 0 15px 20px;
		font-size: 110%;
	}
	#co3 .rightImgList {
		padding: 0 15px 10px;
		text-align: center;
	}
	#co3 .rightImgList li {
		display: inline;
		margin: 0 6px;
	}
	#co3 .rightImgList img {
		width: 129px;
		padding-bottom: 10px;
	}
	#co3 .summary {
		margin: 0 0 5px 15px;
		font-weight: bold;
	}
	#co3 .rightTable {
		margin: 0 15px 10px;
		border-top: 1px solid #777;
		border-left: 1px solid #777;
	}
	#co3 .rightTable tr {
		display: block;
		float: left;
	}
	#co3 .rightTable th {	
		display: block;
		background: #3F3F3F;
		border-right: 1px solid #777;
		border-bottom: 1px solid #777;
		width: 80px;
		padding: 12px 10px;
		color: #FFF;
		font-size: 80%;
		font-weight: bold;
		text-align: center;
	}
	#co3 .rightTable td {
		display: block;
		background: #FFF;
		border-right: 1px solid #777;
		border-bottom: 1px solid #777;
		width: 62px;
		padding: 12px 10px;
		font-size: 80%;
		text-align: center;
	}
	#co3 .rightTable td.fileTd span {
		display: block;
		padding-top: 8px;
	}
	#co3 .rightTable th span {
		font-size: 90%;
	}
	#co3 .tableNoteTitle {
		padding: 0 15px;
		font-size: 110%;
		font-weight: bold;
	}
	#co3 .tableNote {
		padding: 0 15px 25px;
		font-size: 90%;
	}
	#co3 .img01Left, #co3 .img03Left {
		padding: 0 15px;
		font-size: 90%;		
	}
	#co3 .img01Left .btn, #co3 .img03Left .btn {
		margin: 10px 0 15px;
		text-align: center;
	}
	#co3 .img01Left .btn img, #co3 .img03Left .btn img {
		width: 225px;
	}
	#co3 .img01Right, #co3 .img03Right {
		margin-bottom: 35px;
		text-align: center;
	}
	#co3 .img01Right img {
		width: 123px;
		margin: 0 10px;
	}
	#co3 .img03Right img {
		width: 256px;
	}
	#co3 .img03Right {
		margin: 0 15px 30px;
		padding-bottom: 30px;
		border-bottom: 1px solid #CCC;
	}
	
	.coNote {
		padding: 0 15px 15px;
		font-size: 90%;
	}
	#coFootNav {
		display: none;
	}
	.note {
		margin: 15px 15px 20px;
		font-size: 90%;
	}
	
	#co4 {
		background: #F8FAF9;
		border: 1px solid #EAEAEA;
		margin: 0 auto;
		padding: 20px 10px 0;
		width: 280px;
	}
	#co4 .title {
		margin-bottom: 20px;
		text-align: center;
	}
	#co4 .navi .title img {
		width: 265px;
	}
	#co4 .navi li {
		position: relative;
	}
	#co4 .navi li a.one {
	position: absolute;
	display: block;
	width: 174px;
	height: 28px;
	top: 102px;
	left: 52px;
	}
	#co4 .navi li a.two-left {
	position: absolute;
	display: block;
	width: 124px;
	height: 28px;
	top: 102px;
	left: 12px;
	}
	#co4 .navi li a.two-right {
	position: absolute;
	display: block;
	width: 124px;
	height: 28px;
	top: 102px;
	left: 145px;
	}
	#co4 .navi li a.three-left {
	position: absolute;
	display: block;
	width: 90px;
	height: 28px;
	top: 102px;
	left: 12px;
	}
	#co4 .navi li a.three-center {
	position: absolute;
	display: block;
	width: 90px;
	height: 28px;
	top: 102px;
	left: 110px;
	}
	#co4 .naviList li {
		margin-bottom: 20px;
	}
	#co4 .naviList img {
		width: 280px;
	}
	#co4 .option {
		border-top: 1px dotted #D3D3D3;
		padding-top: 20px;
	}
	#co4 .option .title img {
		width: 262px;
	}
	#co4 .optionList li {
		margin-bottom: 20px;
	}
	#co4 .optionList img {
		width: 280px;
	}
	
	/*----------------------------- spec -----------------------------*/
	#rmSpec{
	background: #EFEFEF;
	}
	#rmSpec h4{
	background: #1C1C1C;
	padding: 26px 15px;
	}
	#rmSpec h4 img {
		width: 42px;
	}
	#rmSpec .product {
		margin: 20px 0 15px;
		text-align: center;
	}
	#rmSpec .product img {
		width: 294px;
	}
	#rmSpec .productNote {
		margin: 0 15px 15px;
	}
	#rmSpec .productNote p {
		font-size: 80%;
		text-indent: -1em;
		margin-left: 1em;
	}
	#rmSpec .productNote p.alert {
		margin-bottom: 5px;
		color: #EC3339;
	}
	#rmSpec .download {
		border: 1px solid #010101;
		background: #FFF;
		margin: 0 10px;
	}
	#rmSpec .download ul {
		display: block;
		margin: 10px 10px 5px;
	}
	#rmSpec .download ul li {
		float: left;
		width: 50%;
		text-align: center;
	}
	#rmSpec .download .note {
		margin-bottom: 10px;
		padding: 0;
		font-size: 80%;
		text-align: center;
		line-height: 1.3;
	}
	#rmSpec table{
	width: 300px;
	margin:20px auto 10px;
	border-top:solid 1px #000;
	border-left:solid 1px #000;
	border-collapse:collapse;
	background-color:#fff;
	}
	#rmSpec th{
	width: 114px;
	padding:5px 10px;
	border-right:solid 1px #333;
	border-bottom:solid 1px #333;
	background:#DBDBDB;
	font-weight:bold;
	}
	#rmSpec td{
	padding:5px 10px;
	border-right:solid 1px #333;
	border-bottom:solid 1px #333;
	font-size: 12px;
	}
	#rmSpec td span{
	margin-left: 2px;
	font-size: 70%;
	vertical-align: top;
	}
	#rmSpec .note {
		margin: 0;
		padding: 15px;
	}
		
	/*----------------------------- report -----------------------------*/
	.popupBox {
	display: none;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 1000;
	}
	.popupBox .bg{
	cursor: pointer;
	}
	.popupBox .bg img{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	}
	.popup01 {
	display: none;
	position: absolute;
	background: #0A0532;
	width: 266px;
	left: 5px;
	padding: 15px 12px;
	color: #FFF;
	}
	.popup01 .title {
	margin-bottom: 10px;
	}
	.popup01 .title img {
		width: 255px;
	}
	.popup01 .text {
	margin-bottom: 10px;
	font-size: 110%;
	line-height: 1.6;
	}
	.popup02 {
	display: none;
	position: absolute;
	background: #0A0532;
	width: 266px;
	left: 5px;
	padding: 15px 12px;
	color: #FFF;
	}
	.popup02 .title {
	margin-bottom: 10px;
	}
	.popup02 .title img {
		width: 258px;
	}
	.popup02 .text {
	margin-bottom: 10px;
	font-size: 110%;
	line-height: 1.6;
	}
	.popup03 {
	display: none;
	position: absolute;
	background: #0A0532;
	width: 266px;
	left: 5px;
	padding: 15px 12px;
	color: #FFF;
	}
	.popup03 .title {
	margin-bottom: 10px;
	}
	.popup03 .title img {
		width: 175px;
	}
	.popup03 .text {
	margin-bottom: 10px;
	font-size: 110%;
	line-height: 1.6;
	}
	.popupBox .close{
	position: absolute;
	width: 22px;
	}
	#mainArea .popupBox .close img {
	width: 22px;
	}
	#mainArea .popupBox .close:hover {
	top: auto;
	}
	#mainArea .popupBox .close:hover img {
	opacity: 1;
	filter: alpha(opacity=100);
	-ms-filter: "alpha(opacity=100)";
	-moz-opacity:1;
	-khtml-opacity: 1;
	}
	.spMenu{
	position:fixed;
	right:0;
	top:0;
	z-index:200;
	}
	.spMenu img {
		width: 44px;
	}
	#rightMenu{
	display: none;
	position:fixed;
	right:0;
	top:50%;
	margin-top:-178px;
	z-index:200;
	}
}