@charset "utf-8";

/* page
-----------------------------------------------*/
.processCatch{
margin:0;
padding:0 0 20px 0;
clear:both;
}

.processListBox{
margin:0 0 15px 0;
padding:0;
background:transparent url(../images/process_list_bg02.jpg) no-repeat 0 100%;
width:691px;
clear:both;
}

.processListBox h3{
margin:0 0 10px 0;
padding:0 0 10px 0;
border-bottom:solid 3px #1B558C;
font-size:120%;
color:#1B558C;
clear:both;
}

.contentsLeft p.processListChatch{
margin:0;
padding:0;
font-weight:bold;
color:#666;
clear:both;
}

.processListLeft{
margin:0;
padding:10px 8px;
background:transparent url(../images/process_list_bg01.jpg) no-repeat -2px 0;
width:322px;
float:left;
}

.processListRight{
margin:0 0 0 14px;
padding:10px 8px;
background:transparent url(../images/process_list_bg01.jpg) no-repeat -2px 0;
width:323px;
float:left;
}

.processListImg{
margin:0 0 0 2px;
padding:0;
width:80px;
float:left;
}

.contentsLeft p.processListTxt{
margin:0 0 0 10px;
padding:0;
width:227px;
float:right;
}

.contentsLeft p.processListLink{
margin:8px 0 0 10px;
padding:0;
font-weight:bold;
width:227px;
float:right;
}

.contentsLeft p.processListLink a{
margin:0;
padding:0 0 0 15px;
background:transparent url(../images/process_arrow_anchor.gif) no-repeat 0 0;
}

.processLayout01{
margin:20px 0 30px 10px;
padding:0;
width:671px;
clear:both;
}

.processLayout01Left{
margin:0;
padding:0;
width:200px;
float:left;
}

.processLayout01Right{
margin:0 0 0 26px;
padding:0;
width:445px;
float:left;
}

.contentsLeft .processLayout01Right p{
margin:0;
padding:0;
clear:both;
}

.contentsLeft .processLayout01Right p.processLayout01Note{
margin:15px 0 0 0;
padding:0;
font-size:90%;
clear:both;
}

.processLayout01Link{
margin:10px 0 0 0;
padding:10px 0 5px 10px;
width:435px;
background:#F3F3F3;
clear:both;
}

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

.processLayout01Link li{
margin:0;
padding:0 15px 0 5px;
float:left;
display:inline;
font-size:90%;
}

.processLayout01Link li a{
margin:0;
padding:0 5px 0 15px;
background:transparent url(../../../../../common/images/arrow02.gif) no-repeat 0 0;
font-size:110%;
}

.processLayout02{
margin:20px 0 30px 10px;
padding:0;
width:671px;
clear:both;
}

.processLayout02Left{
margin:0;
padding:0;
width:340px;
float:left;
}

.processLayout02Right{
margin:38px 0 0 26px;
padding:0;
width:290px;
border:solid 1px #CCC;
float:left;
}

.processLayout02RightBg{
margin:0;
padding:10px 15px 15px 15px;
background:transparent url(../images/process_column_bg01.jpg) repeat-x 0 0;
clear:both;
}

.processLayout02RightBg h3{
margin:0 0 10px 0;
padding:0 0 10px 0;
border-bottom:solid 1px #CCC;
clear:both;
}

.processLayout02Right dl{
margin:5px 0 0 0;
padding:0;
width:260px;
clear:both;
}

.processLayout02Right dt{
margin:0;
padding:0;
float:left;
}

.processLayout02Right dd{
margin:0;
padding:0;
float:left;
}

.processColumn{
margin:20px 0 0 10px;
padding:2px;
width:665px;
border:solid 1px #CCC;
clear:both;
}

.processColumnBg{
margin:0;
padding:10px 15px 15px 15px;
background:transparent url(../images/process_column_bg01.jpg) repeat-x 0 0;
clear:both;
}

.processColumnLeft{
margin:15px 0 0 0;
padding:0;
width:93px;
float:left;
}

.processColumnRight{
margin:15px 0 0 12px;
padding:0;
width:530px;
float:left;
}

.contentsLeft .processColumnRight p{
margin:0;
padding:0;
clear:both;
}

.contentsLeft .processColumnRight p.processColumnLink{
margin:10px 0 0 0;
padding:0;
clear:both;
}

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

.processFlow{
margin:15px 0 0 0;
padding:0;
width:691px;
clear:both;
}

.processFlowLeft{
margin:0;
padding:0;
width:153px;
float:left;
}

.processFlowRight{
margin:0 0 0 26px;
padding:0;
width:153px;
float:left;
}

.processFlow h4{
margin:5px 0 0 0;
padding:0;
font-weight:normal;
clear:both;
}

.contentsLeft .processFlow p{
margin:5px 0 0 0;
padding:0;
}

.contentsLeft p.processFlowNote{
margin:10px 0 0 0;
padding:0;
font-size:90%;
}


/**/
.bottomInfo01{
margin:0;
padding:5px 0 10px 0;
height:83px;
width:691px;
_overflow:hidden;
clear:both;
}

.bottomInfo02{
margin:25px 0 0 0;
padding:5px 0 10px 0;
height:83px;
width:691px;
_overflow:hidden;
clear:both;
}

.pagetopBtn02{
margin:0 0 30px 0;
padding:0;
text-align:right;
clear:both;
}

.pagetopBtn02 a{
margin:0;
padding:0 0 0 15px;
font-size:90%;
background:transparent url(../../../../../common/images/arrow_up.gif) no-repeat 0 0;
clear:both;
}


/**/
.productLineupBtn{
margin:20px 0 0 0;
padding:0;
clear:both;
}

.productLineupBtn ul{
margin:20px 0 0 10px;
padding:0;
width:671px;
clear:both;
}

.productLineupBtn li{
margin:0;
padding:0 0 0 31px;
float:left;
display:inline;
}

.productLineupBtn li.head{
margin:0;
padding:0;
float:left;
display:inline;
}

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

.productLineupLeft{
margin:0;
padding:0 0 0 35px;
width:180px;
float:left;
}

.productLineupRight{
margin:0 0 0 30px;
padding:0;
width:180px;
float:left;
}

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

.productLineup h3{
margin:20px 0 0 0;
padding:0 0 0 10px;
font-size:120%;
background:transparent url(../../../../../common/images/arrow01.gif) no-repeat 0 5px;
clear:both;
}

.productLineup h3 a{
margin:0;
padding:0;
clear:both;
}

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

.spOnly {
	display: none;
}

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

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

  .productNavi,
	.contentsImg,
	.contentsLeft,
  .contentsLeft p.contentsLead,
	.contentsBox,
	.footstepBox,
  .serviceLayout,
  .processLayout02,
  .processFlow {
		width: auto;
	}

  .processLayout02Left,
  .processLayout02Right {
    float: none;
  }
  .processLayout02Right {
    width: 340px;
    margin: 20px 0 0 0;
  }
  .processFlow {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 15px;
  }
  .processFlowLeft,
  .processFlowRight {
    width: auto;
    float: none;
    margin: 0;
  }
  .processFlowImg img {
    width: 100%;
    height: auto;
  }

  .productLineup {
		width: auto;
	}
	.productLineupLeft,
	.productLineupRight {
		float: none;
		width: auto;
		margin: 0 auto 20px;
	}
  .productLineupLeft {
    padding: 0;
  }
	.productLineupImg {
		margin-bottom: 10px;
	}
	.productLineupImg img {
		width: 80%;
		height: auto;
		margin: 0 auto;
	}
	.productLineup h3,
	.productLineup p {
		width: 80%;
		margin: 0 auto;
	}
}