@charset "utf-8";

/* page
-----------------------------------------------*/
.serviceLayout{
margin:0;
padding:0;
width:691px;
clear:both;
}
.serviceLayoutLeft{
margin:0;
padding:0;
width:360px;
float:left;
}
.serviceLayoutLeft h3{
margin:25px 0 0 0;
padding:0;
clear:both;
}

.serviceLayoutRight{
margin:25px 0 0 0;
padding:0;
width:270px;
float:right;
}


.contentsLeft p.serviceListLead{
margin:20px 0 0 0;
padding:0 0 0 20px;
background:transparent url(../images/icon_zoom.gif) no-repeat 0 2px;
clear:both;
}
.serviceList{
margin:20px 0 0 0;
padding:0;
width:691px;
clear:both;
}

.contentsLeft .serviceList p{
margin:5px 0 0 0;
padding:0;
clear:both;
}

.serviceList h3{
margin:0;
padding:0;
font-size:120%;
clear:both;
}

.serviceListLink a{
margin:0;
padding:0 0 0 15px;
background:transparent url(/common/images/arrow02.gif) no-repeat 0 1px;
clear:both;
}

.serviceListLeft{
margin:0;
padding:0;
width:325px;
float:left;
}
.serviceListRight{
margin:0;
padding:0;
width:325px;
float:right;
}
.serviceListImg{
margin:0;
padding:0;
width:153px;
float:left;
}
.serviceListTxt{
margin:0;
padding:0;
width:160px;
float:right;
}

.contentsLeft p.contentsLink01{
margin:20px 0 0 0;
padding:0 0 0 10px;
background:transparent url(../../../../common/images/arrow01.gif) no-repeat 0 5px;
clear:both;
}
.contentsLeft p.contentsLink01{
margin:20px 0 0 0;
padding:0 0 0 10px;
background:transparent url(../../../../common/images/arrow01.gif) no-repeat 0 5px;
clear:both;
}

*:first-child+html .contentsLeft p.contentsLink01{
background:transparent url(../../../../common/images/arrow01.gif) no-repeat 0 7px;
}

/**/

.serviceRelation{
margin:15px 0 0 10px;
padding:0;
width:671px;
clear:both;
}

.serviceRelationLeft{
margin:0;
padding:0;
width:145px;
float:left;
}

.serviceRelationRight{
margin:0 0 0 30px;
padding:0;
width:145px;
float:left;
}

.serviceRelationImg{
margin:0;
padding:0;
text-align:center;
clear:both;
}

.serviceRelation h3{
margin:20px 0 0 0;
padding:0;
font-size:120%;
clear:both;
}

.serviceRelation h3 a{
margin:0;
padding:0 0 0 10px;
background:transparent url(../../../../common/images/arrow01.gif) no-repeat 0 5px;
clear:both;
}

.serviceRelation p{
margin:10px 0 0 0;
padding:0;
clear:both;
}

.serviceTable{
margin:25px 0 0 10px;
padding:0;
width:671px;
clear:both;
border-top:solid 1px #CCC;
border-left:solid 1px #CCC;
}

.serviceTable th{
margin:0;
padding:10px;
background:#EFF9FE;
font-weight:normal;
border-right:solid 1px #CCC;
border-bottom:solid 1px #CCC;
text-align:center;
}

.serviceTable thead th{
margin:0;
padding:10px;
background:#DEEBFA;
color:#1B558C;
font-weight:bold;
border-right:solid 1px #CCC;
border-bottom:solid 1px #CCC;
text-align:center;
}

.serviceTable td{
margin:0;
padding:10px;
border-right:solid 1px #CCC;
border-bottom:solid 1px #CCC;
vertical-align:top;
width:40%;
}

.serviceTable td ul{
margin:0;
padding:0;
list-style:none;
}

.serviceTable td li{
margin:0;
padding:0 0 0 5px;
background:transparent url(../../../../common/images/dot.gif) no-repeat 0 8px;
}

.serviceTable td p{
margin:5px 0 0 0;
padding:0;
}

.spOnly {
	display: none;
}

@media screen and (max-width: 750px) {
	.pcOnly {
		display: none;
	}
	.spOnly {
		display: block;
	}
  .mainBox {
		padding: 0 10px;
	}

	.spTtl {
		padding: 30px 20px;
		background: #fff;
		border-top: solid 3px #1B558C;
		border-bottom: solid 1px #d9d9d9;
		font-size: 20px;
		font-weight: bold;
    line-height: 1.3;
	}

	.productNavi,
	.contentsImg,
	.contentsLeft,
	.contentsBox,
	.footstepBox,
  .serviceLayout {
		width: auto;
	}

  .serviceLayoutLeft {
    float: none;
  }
  .serviceLayoutRight {
    float: none;
    margin: 25px auto 0;
  }
  .serviceTable {
    width: auto;
    margin: 25px 0 0;
  }
  .serviceLayoutLeft h3 img {
    transform: scale(.8) translateX(-12%);
  }

  .serviceList {
    width: auto;
    margin: 0;
  }
  .serviceListLeft,
  .serviceListRight {
    float: none;
    display: flex;
    gap: 20px;
    width: auto;
    margin-top: 20px;
  }
  .serviceListImg,
  .serviceListTxt {
    float: none;
  }

  .serviceRelation {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    width: auto;
    margin: 15px 0 0;
  }
  .serviceRelationRight {
    float: none;
    display: inline-block;
    width: calc(100% / 2 - 10px);
    margin: 0;
  }

	.bottomTel-sp {
		margin: 0 15px 40px;
	}
}