@charset "utf-8";
/* CSS Document */

/*===========================================
	autoIcon 
=============================================*/
.autoIcon{
  vertical-align: middle;
  height: auto;
  max-height: 1.2em;
}

/*===========================================
	annotationBox 
=============================================*/
.annotationBox{
  margin-top:-20px;
}
.annotationBox li{
  list-style:none;
  padding-left:1.3em;
  text-indent:-1.3em;
}
.annotationText{
  font-size:88%;
}
.annotationList{
  padding-left:30px;
  font-size:88%;
}

.trademark{
  list-style:none;
  line-height:2.0;
  font-size:88%;
}

/*===========================================
	accordion 
=============================================*/
.accordionWrap{
  display:none;
}
.accordion a{
  padding:3px 25px 3px 0;
  color:#333;
  background-image:url(../images/st_open.png);
  background-position:100% 50%;
  background-repeat:no-repeat;
} 
.accordion a:hover{
  text-decoration:none;
}

/*===========================================
	OnepointArea 
=============================================*/
div.OnepointArea div.OnepointBox {
	width: 680px;
	margin: 0px auto;
	padding: 0px;
	clear:both;
}
.ico_Onepoint {
	height:25px;
	margin: 0px;
	padding: 4px 0px 0px 32px;
	background:url(../images/ico_onepoint.gif) no-repeat 0px 0px;
	font-weight:bold;
	color:#4C96C8;
}

/*===========================================
	WarningArea 
=============================================*/
div.WarningArea {
	width: auto;
	/*margin: 15px 0px 0px 0px;*/
  margin:15px 0 0 20px;
	padding: 15px;
	background:#FFFFCC;
	border:#999999 2px solid;
	clear:both;
}
div.WarningArea div.WarningBox {
	width: auto;
	margin: 0;
	padding: 0;
}
div.WarningArea div.WarningBox div.leftArea {
	margin: 0px;
	padding: 0px;
	float:left;
}
div.WarningArea div.WarningBox div.rightArea {
	margin: 0px 0px 0px 30px;
	padding: 0px;
	float:left;
}
div.WarningArea_one{
  margin:15px 0 0 45px;
}
div.WarningArea_one ul{
  padding-left:20px;
}


div.WarningArea_min {
	width: auto;
	/*margin: 15px 0px 0px 0px;*/
  margin:15px 0 0 70px;
	padding: 15px;
	background:#FFFFCC;
	border:#999999 2px solid;
	clear:both;
}
div.WarningArea_min div.WarningBox {
	width: auto;
	margin: 0;
	padding: 0;
}
div.WarningArea_min div.WarningBox div.leftArea {
	margin: 0px;
	padding: 0px;
	float:left;
}
div.WarningArea_min div.WarningBox div.rightArea {
	margin: 0px 0px 0px 30px;
	padding: 0px;
	float:left;
}
.ico_Warning {
	height:25px;
	margin: 0px;
	padding: 4px 0px 0px 33px;
	background:url(../images/ico_warning.gif) no-repeat 0px 0px;
	font-weight:bold;
}

/*===========================================
	stepArea
=============================================*/
.stepArea {
  padding: 0 15px 10px 15px;
}
.stepArea dt {
  width:100px;
  font-weight:bold;
  color:#666666;
  float:left;
}
.stepArea dd {
  width:600px;
  padding-bottom:15px;
  background:url(../images/step_arrow.gif) 50% 90% no-repeat;
  float:right;
}
.stepArea dd.stepLast {
  background:none;
}
.stepArea dd a {
  display:block;
  padding:5px 20px;
  text-decoration:none;
  border:1px solid #ccc;
  background: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #fefefe), color-stop(100%, #f8f8f8));
  background: -webkit-linear-gradient(bottom, #fefefe, #f8f8f8);
	background: -webkit-gradient(linear, left top, left bottom, from(#fefefe), to(#f8f8f8));　
  background: -moz-linear-gradient(bottom, #fefefe, #f8f8f8);
  background: -o-linear-gradient(bottom, #fefefe, #f8f8f8);
  background: linear-gradient(bottom, #fefefe, #f8f8f8);
  background: linear-gradient(to bottom, #fefefe, #f8f8f8);
  position: relative;
	*zoom: 1;
}
:root .stepArea dd a{
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#fffefefe', endColorstr='#fff8f8f8') \0/; /* IE9 */
}
.stepArea dd a:hover {
  background: -webkit-gradient(linear, 50% 100%, 50% 0%, color-stop(0%, #ffffff), color-stop(100%, #fcfcfc));
  background: -webkit-linear-gradient(bottom, #ffffff, #fcfcfc);
	background: -webkit-gradient(linear, left top, left bottom, from(#ffffff), to(#fcfcfc));　
  background: -moz-linear-gradient(bottom, #ffffff, #fcfcfc);
  background: -o-linear-gradient(bottom, #ffffff, #fcfcfc);
  background: linear-gradient(bottom, #ffffff, #fcfcfc);
  background: linear-gradient(to bottom, #ffffff, #fcfcfc);
}
:root .stepArea dd a{
	filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#ffffffff', endColorstr='#fffcfcfc') \0/; /* IE9 */
}

.stepArea02 {
  padding-left:22px;
}

.stepAreaInList ul {
  padding-left:35px;
}
.stepAreaInList ol {
  padding-left:30px;
  list-style:none;
}
.stepAreaInList ol span {
  font-weight:bold;
}

.wifiImageArea {
  margin-top:15px;
  padding-left:20px;
}
.wifiImageArea ul {
  width:540px;
  margin-left:-20px;
  list-style:none;
}
.wifiImageArea li {
  width:150px;
  float:left;
  margin-left:20px;
  *display:inline;
}

div.relatArea{
  width:auto;
  margin:15px 0 0 45px;
}
div.relatArea div.relatBox {
  width: auto;
  margin: 0;
  padding: 0 15px;
}

.otherIn .OnepointArea {
  width:633px;
  margin-top:15px;
}
.otherIn .OnepointArea div.OnepointBox {
  width:633px;
}
.otherIn .OnepointArea ul {
  padding-left:18px;
}
.otherIn .relatArea {
  width:663px;
}
.otherIn .relatArea div.relatBox {
  width:633px;
}
.otherIn .WarningArea {
  width:auto;
  margin:15px 0 0 45px;
  padding:15px;
}
.otherIn .WarningArea div.WarningBox {
  width:auto;
}

.numText {
	font-weight:bold;
	padding: 0 0px 5px 1.5em;
  text-indent:-1.5em;
}
.numText_no {
  padding-left:1.5em;
}
div.pregArea_02 div.pregBox ol.list_pregbox {
	margin: 5px 0 0 20px;
	padding: 0;
	font-weight: bold;
}
div.pregArea_02 div.pregBox ol.list_pregbox li {
	list-style-type:decimal;
	margin-bottom: 10px;
}
div.pregArea_02 div.pregBox ol.list_pregbox li p {
	font-weight: normal;
}
div.pregArea_02 div.pregBox ol.list_pregbox li p.sub {
	font-weight: normal;
	font-size: 90%;
	margin-bottom: 5px;
}

div.pregArea_02 .rightArrow {
  padding-right:26px;
  background:url(../images/ico_arrow01.gif) 100% 50% no-repeat;
}

.infoBox01 dl {
  padding-bottom:20px;
}
.captionText {
  margin-top:20px;
  padding-left:13px;
}

/*===========================================
	pregArea_02
=============================================*/
div.pregArea_02 {
	width: 740px;
	margin: 15px auto 0px auto;
	padding: 0px;
	clear:both;
}
div.pregArea_02 div.topArea {
	width: 720px;
	margin: 0px auto;
	padding: 0px 0px 20px 0px;
	border-bottom:#999 dotted 1px;
}
div.pregArea_02 div.topArea ul.topBox {
	margin: 0px;
	padding: 0px;
	list-style:none;
}
div.pregArea_02 div.topArea ul.topBox li.txt {
	width:450px;
	margin: 0px;
	padding: 0px;
	float:left;
}
div.pregArea_02 div.topArea ul.topBox li.img {
	width:250px;
	margin: 0px;
	padding: 0px;
	float: right;
	text-align:center;
}
div.pregArea_02 div.pregBox {
	width: 720px;
	margin: 20px auto 0px auto;
	padding: 0px 0px 20px 0px;
	border-bottom:#999 dotted 1px;
	clear:both;
}
div.pregArea_02 div.pregBox div.LeftArea {
	width: 350px;
	margin: 0px;
	padding: 0px;
	float:left;
}
div.pregArea_02 div.pregBox div.RightArea {
	width: 330px;
	margin: 0px;
	padding: 0px;
	float:right;
	text-align:center;
}
div.pregArea_02 div.pregBox div.miniBox {
	width: 675px;
	margin: 30px 0px 0px 45px;
	padding: 0px;
	clear:both;
}
div.pregArea_02 div.pregBox div.miniBox div.LeftArea {
	width: 325px;
	margin: 0px;
	padding: 0px;
	float:left;
}
div.pregArea_02 div.pregBox div.miniBox div.RightArea {
	width: 330px;
	margin: 0px;
	padding: 0px;
	float: right;
  text-align:center;
}
div.pregArea_02 div.pregBox div.img-center {
	margin: 10px 0px 0px 0px;
	padding: 0px;
	text-align:center;
}

/*===========================================
	burette
=============================================*/
.burette{
  list-style:disc;
  padding-left:1.3em;
}

/*===========================================
	bar
=============================================*/
.bar_no01 {
	margin: 0px;
	padding: 5px 0px 5px 45px;
	background:url(../images/bar_no01.gif) no-repeat;
	font-weight:bold;
	font-size:120%;
}
.bar_no02 {
	margin: 0px;
	padding: 5px 0px 5px 45px;
	background:url(../images/bar_no02.gif) no-repeat;
	font-weight:bold;
	font-size:120%;
}
.bar_no03 {
	margin: 0px;
	padding: 5px 0px 5px 45px;
	background:url(../images/bar_no03.gif) no-repeat;
	font-weight:bold;
	font-size:120%;
}
.bar_no04 {
	margin: 0px;
	padding: 5px 0px 5px 45px;
	background:url(../images/bar_no04.gif) no-repeat;
	font-weight:bold;
	font-size:120%;
}
.bar_no05 {
	margin: 0px;
	padding: 5px 0px 5px 45px;
	background:url(../images/bar_no05.gif) no-repeat;
	font-weight:bold;
	font-size:120%;
}
.bar_no06 {
	margin: 0px;
	padding: 5px 0px 5px 45px;
	background:url(../images/bar_no06.gif) no-repeat;
	font-weight:bold;
	font-size:120%;
}
.bar_no07 {
	margin: 0px;
	padding: 5px 0px 5px 45px;
	background:url(../images/bar_no07.gif) no-repeat;
	font-weight:bold;
	font-size:120%;
}
.bar_no08 {
	margin: 0px;
	padding: 5px 0px 5px 45px;
	background:url(../images/bar_no08.gif) no-repeat;
	font-weight:bold;
	font-size:120%;
}
.bar_no09 {
	margin: 0px;
	padding: 5px 0px 5px 45px;
	background:url(../images/bar_no09.gif) no-repeat;
	font-weight:bold;
	font-size:120%;
}
.bar_no10 {
	margin: 0px;
	padding: 5px 0px 5px 45px;
	background:url(../images/bar_no10.gif) no-repeat;
	font-weight:bold;
	font-size:120%;
}
.bar_no11 {
	margin: 0px;
	padding: 5px 0px 5px 45px;
	background:url(../images/bar_no11.gif) no-repeat;
	font-weight:bold;
	font-size:120%;
}

.bar_no01-s {
	margin: 5px 0px 0px 0px;
	padding: 0px 0px 0px 30px;
	background:url(../images/bar_no01-s.gif) no-repeat;
}
.bar_no02-s {
	margin: 15px 0px 0px 0px;
	padding: 0px 0px 0px 30px;
	background:url(../images/bar_no02-s.gif) no-repeat;
}

/*===========================================
	ico
=============================================*/
.ico_Warning {
	margin: 0px;
	padding: 4px 0px 5px 33px;
	background:url(../images/ico_warning.gif) no-repeat 0px 0px;
	font-weight:bold;
}
.ico_Square {
	padding: 0px 0px 5px 13px;
	background:url(../images/ico_square.gif) no-repeat 0px 5px;
	font-weight:bold;
}
.ico_Onepoint {
	margin: 0px;
	padding: 4px 0px 5px 32px;
	background:url(../images/ico_onepoint.gif) no-repeat 0px 0px;
	font-weight:bold;
	color:#4C96C8;
}

/*===========================================
	OnepointArea 
=============================================*/
div.OnepointArea {
  width:auto;
  margin:15px 0 0 20px;
	padding: 15px;
  background:#F0FAFA;
	border:#4C96C8 2px solid;
	clear:both;
}
div.OnepointArea ul{
  padding-left:20px;
}
div.OnepointArea li{
  list-style:disc;
}
div.OnepointArea div.OnepointBox {
  width: auto;
  margin: 0;
  padding: 0;
  clear: both;
}
div.OnepointArea_one{
  margin:15px 0 0 45px;
}



div.OnepointArea_min {
  width:auto;
  margin:15px 0 0 70px;
	padding: 15px;
  background:#F0FAFA;
	border:#4C96C8 2px solid;
	clear:both;
}
div.OnepointArea_min li{
  list-style:none;
}
div.OnepointArea_min div.OnepointBox {
  width: auto;
  margin: 0;
  padding: 0;
  clear: both;
}

/*===========================================
	font11
=============================================*/
.font11 {
	font-size:11px;
}
.font15 {
	font-size:15px;
}


@media (max-width: 640px) {
	
/*===========================================
	pregArea_01
=============================================*/
div.MainArea{
  width:100%;
}
ul.sNavi_Area{
  width:100%;
}
.annotationBox{
  margin-top:15px;
}
.stepArea dd{
  width:100%;
}
div.OnepointArea{
  margin-left:0;
}
div.relatArea{
  margin-left:0;
}
div.WarningArea{
  margin-left:0;
}
.wifiImageArea ul{
  width:auto;
}
div.pregArea_02 div.pregBox ol.list_pregbox{
  margin: 5px 0 0 35px;
}
.stepArea02{
  padding-left:0;
}
.stepArea dt{
  margin-bottom:10px;
}
.numText{
  margin-top:10px;
}
div.pregArea_02 div.pregBox div.miniBox div.RightArea{
  text-align:left;
}
div.relatArea div.relatBox img{
  display:block;
}
.wifiImageArea li{
  float:none;
  margin-top:10px;
}
.wifiImageArea li:first-child{
  margin-top:0;
}


div.pregArea_01 {
	width:auto;
}
div.pregArea_01 div.mq-img img {
    height: auto;
    width: 100%;
}


/*===========================================
	pregArea_02
=============================================*/
div.pregArea_02 {
	width: auto;
}
div.pregArea_02 div.topArea {
	width: auto;
}
div.pregArea_02 div.topArea ul.topBox li.txt {
	width: auto;
	float: none;
}
div.pregArea_02 div.topArea ul.topBox li.img {
	margin-top:10px;
	width: auto;
	float: none;
}

div.pregArea_02 div.pregBox div.imgArea {
	margin: 10px 0px 0px 0px;
}
div.pregArea_02 div.pregBox div.imgArea img {
	width: 100%;
	height:auto;
}
div.pregArea_02 div.pregBox div.imgArea2 {
	margin: 10px 0px 0px 0px;
}
div.pregArea_02 div.pregBox div.imgArea2 img {
	width: 100%;
	height:auto;
}
div.pregArea_02 div.pregBox {
	width: auto;
}
div.pregArea_02 div.pregBox div.LeftArea {
	width: auto;
	margin: 15px 0px 0px 0px;
	padding: 0px;
	float: none;
}
div.pregArea_02 div.pregBox div.RightArea {
	width: auto;
	margin: 15px 0px 0px 0px;
	padding: 0px;
	float: none;
}
div.pregArea_02 div.pregBox div.RightArea img {
	max-width: 100%;
	height:auto;
}
div.pregArea_02 div.pregBox div.miniBox {
	width: auto;
	margin:0px;
	padding:0px;
}
div.pregArea_02 div.pregBox div.miniBox div.LeftArea {
	width: auto;
	margin: 10px 0px 0px 0px;
	padding: 0px;
	float: none;
}
div.pregArea_02 div.pregBox div.miniBox div.RightArea {
	width: auto;
	margin: 10px 0px 0px 0px;
	padding: 0px;
	float: none;
}
div.pregArea_02 div.pregBox div.img-center img {
	max-width:100%;
	height:auto;
}

.ml_45 {
	margin-left:0px;
}
div.pregArea_02 div.pregBox div.miniBox2 {
	margin: 0px 0px 0px 0px;
}


/*===========================================
	lineArea 
=============================================*/
div.lineArea div.LeftArea-1 {
	width: auto;
	float:none;
	margin-top:10px;
}
div.lineArea div.RightArea-1 {
	width: auto;
	float:none;
	text-align:center;
	margin-top:10px;
}
div.lineArea div.detailArea div.LeftArea-2 {
	margin-top:10px;
	width: auto;
	float:none;
}
div.lineArea div.detailArea div.RightArea-2 {
	width: auto;
	float:none;
	text-align:center;
}
div.lineArea div.detailArea div.RightArea-2 img {
	width: 100%;
	height:auto;
}



/*===========================================
	GrayTbl
=============================================*/
table.GrayTbl {
	font-size:12px;
}
table.GrayTbl th {
    padding: 5px;
}
table.GrayTbl td {
    padding: 5px;
}


/*===========================================
	bar
=============================================*/
.bar_no01 {
	background-size:20px;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 30px;
	font-size:100%;
}
.bar_no02 {
	background-size:20px;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 30px;
	font-size:100%;
}
.bar_no03 {
	background-size:20px;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 30px;
	font-size:100%;
}
.bar_no04 {
	background-size:20px;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 30px;
	font-size:100%;
}
.bar_no05 {
	background-size:20px;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 30px;
	font-size:100%;
}
.bar_no06 {
	background-size:20px;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 30px;
	font-size:100%;
}
.bar_no07 {
	background-size:20px;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 30px;
	font-size:100%;
}
.bar_no08 {
	background-size:20px;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 30px;
	font-size:100%;
}
.bar_no09 {
	background-size:20px;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 30px;
	font-size:100%;
}
.bar_no10 {
	background-size:20px;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 30px;
	font-size:100%;
}
.bar_no11 {
	background-size:20px;
	margin: 0px 0px 10px 0px;
	padding: 0px 0px 0px 30px;
	font-size:100%;
}


}

