.pagettl{
 background: url(../img/flow/pagephoto.jpg) no-repeat center center;
}

.box{
 display: flex;
 justify-content: space-between;
 position: relative;
 padding: 50px 0px;
}
.box:before{
 display: block;
 content: "";
 border-left: solid 2px #F6B000;
 position: absolute;
 left: 30px;
 top: 70px;
 height: 100%;
}
.box.final:before{
 display: none;
}
.box .pageSttl{
 border-bottom: solid 1px #0094D7;
}
.box .pageSttl span{
 background: #0094D7;
 color: #fff;
 padding: 2px 8px;
 font-size: 90%;
 display: inline-block;
 font-weight: normal;
}
.box .txt{
 width: 62%;
 position: relative;
}
.box .txt .step{
 width: 60px;
}
.box .txt .time{
 width: 60px;
}
.box .txt .name{
 width: calc( 100% - 120px );
}
.box .inner{
 padding: 15px 0px 0px 80px;
 line-height: 1.75em;
}
.box .img{
 width: 35%;
}
.box h2{
 display: flex;
 align-items: center;
 gap: 15px;
 color: #00508D;
}

#sec_docs .ttl span{
 position: relative;
 display: inline-block;
}
#sec_docs .ttl span:before{
 width: 1em;
 height: 1em;
 display: block;
 content: "";
 position: absolute;
 background: #F6B000;
 border-radius: 50%;
 left: -1.5em;
 top: calc( 50% - 0.5em );
}
#sec_docs .ttl span:after{
 width: 1em;
 height: 1em;
 display: block;
 content: "";
 position: absolute;
 background: #F6B000;
 border-radius: 50%;
 right: -1.5em;
 top: calc( 50% - 0.6em );
}

#sec_btm{
 padding-top: 150px;
 background: url(../img/flow/btmimg.jpg) no-repeat center top;
 padding-bottom: 150px;
}
#sec_btm .inner{
 max-width: 800px;
 margin: 0 auto;
 text-align: center;
}
#sec_btm .inner p{
 margin-left: 15px;
 margin-right: 15px;
}

#main .toggle{
 margin-bottom: 50px;
}
#main .toggleBtn {
 background: #fff;
 padding: 20px 50px 20px 20px;
 cursor: pointer;
 position: relative;
 display: flex;
 align-items: center;
}
#main .toggleBtn .icon{
 width: 40px;
 height: 40px;
 background: #00508D;
 position: absolute;
 right: 10px;
 top: calc( 50% - 20px );
 display: flex;
 justify-content: center;
 align-items: center;
}
#main .toggleBtn .icon svg{
 fill:#fff;
 width: 30px;
}
#main .toggleBtn .icon .on{
 display: none;
}
#main .toggleBtn.active .icon .off{
 display: none;
}
#main .toggleBtn.active .icon .on{
 display: block;
}
#main .toggleBtn .num{
 background: #F6B000;
 color: #fff;
 padding: 4px 8px;
 margin-right: 10px;
 display: flex;
 align-items: center;
}
#main .toggleBtn .txt{
 color: #20669B;
}
#main .toggleArea{
 text-align: center;
 margin-top: 30px;
 max-width: 545px;
 margin-left: auto;
 margin-right: auto;
}
#main .toggleArea p{
 text-align: left;
 line-height: 1.75em;
}

/*
===================================================
	tb small
===================================================
*/
@media screen and (max-width: 750px) {
 .box{
  display: block;
  padding: 50px 0px;
 }
 .box:before{
  display: block;
  content: "";
  border-left: solid 2px #F6B000;
  position: absolute;
  left: 21px;
  top: 70px;
  height: 100%;
 }
 .box.final:before{
  display: none;
 }
 .box .txt{
  width: 100%;
  position: relative;
 }
 .box .txt .step{
  width: 50px;
 }
 .box .txt .time{
  width: 50px;
 }
 .box .txt .name{
  width: calc( 100% - 60px );
  font-size: 80%;
 }
 .box .inner{
  padding: 15px 0px 0px 40px;
  line-height: 1.75em;
 }
 .box .img{
  margin-top: 1em;
  width: auto;
  text-align: center;
  padding-left: 30px;
 }
 .box h2{
  display: flex;
  align-items: center;
  gap: 10px;
  color: #00508D;
 }
}

/*
===================================================
	sp
===================================================
*/
@media screen and (max-width: 640px) {
 .pagettl{
  background: url(../img/flow/pagephoto.jpg) no-repeat center center;
  background-size: cover;
 }

 #sec_btm{
  padding-top: 50px;
  background: url(../img/flow/btmimg.jpg) no-repeat center top;
  padding-bottom: 40px;
  background-size: 150% auto;
 }

 #main .toggle{
  margin-bottom: 30px;
 }
 #main .toggleBtn {
  background: #fff;
  padding: 10px 40px 10px 10px;
  cursor: pointer;
  position: relative;
 }
 #main .toggleBtn .icon{
  width: 30px;
  height: 30px;
  background: #00508D;
  position: absolute;
  right: 7px;
  top: calc( 50% - 15px );
  display: flex;
  justify-content: center;
  align-items: center;
 }
 #main .toggleBtn .icon svg{
  fill:#fff;
  width: 20px;
 }

}