/* ヘッダー二段デザイン用カスタマイズ
ヘッダーが画像のみの場合、ここから下のCSSは丸ごと不要です
2025.04 S社風のヘッダー画像のみに合わせて、S社用local.cssからh1関連を上書き */

#SMP_STYLE .body,
html#SMP_STYLE body.body div.body_tbl{
  background:#fff !important;
}

html#SMP_STYLE body h1.header span:first-child{
  display:block;
  max-width:900px;
  width:100%;
  margin:0 auto;
  background-color:#000;
  line-height:65px;
  padding-left:25px;
  text-align:left;
}

html#SMP_STYLE body h1.header span:last-child{
  width:100%;
  background: linear-gradient(to bottom, #383838, #181818);
  margin:0 auto;
  line-height:34px;
  font-weight:normal;
  display:block;
  font-size:28px;
  padding:0;
}

html#SMP_STYLE body h1.header img{
  max-width:900px;
  height:auto;
  vertical-align:middle;
}

html#SMP_STYLE body h1.header span:last-child img{
width:100%;
  vertical-align:bottom;
}

div.footer{
  line-height:1.5;
  padding:0;
}
div.footer div.wrap ul{
  display:block;
}
div.footer ul,
div.footer ul li{
  list-style:none outside;
  display:inline-block;
  vertical-align:top;
  padding:0 10px;
}

div.footer ul li{
  border-left:1px solid #fff;
}
div.footer ul li:first-child{
  border:none;
}
div.footer div.wrap{
  text-align:center;
  padding:10px;
}
div.footer div.wrap > span{
  font-family:verdana;
  display:inline-block;
  text-align:left;
}

@media screen and (max-width: 640px){
  html#SMP_STYLE body h1.header span:first-child{
  line-height:65px;
  }

  html#SMP_STYLE body h1.header span:last-child{
    font-weight:normal;
    display:block;
    font-size:4.8vw;
    line-height:5vw;
    padding:0;
  }

  div.footer ul li{
    padding:2px 0 0 0;
    border-left:none;
    border-top:1px dotted #fff;
    display:block;
  }
  div.footer div.wrap ul{
    display:inline-block;
    margin-bottom:5px;
  }
}



/* --------------- color grayscale --------------- */

html#SMP_STYLE body.body div.body_tbl{
  background-color:#ecf1fb;
}

html#SMP_STYLE body h1.header{
  background-color:#000;
}

ul#step li{
  background-color:#a6569f;
}

ul#step li:before{
  border-left-color:#ecf1fb;
}

ul#step li:after{
  border-left-color:#a6569f;
}

ul#step li.current{
  background-color:#557ccd;
}

ul#step li.current:after{
  border-left-color:#557ccd;
}

html#SMP_STYLE input.submit,
a.btn{
  background:#557ccd;
  border:2px solid #557ccd;
}

a.btn.gray{
  background:#a6569f;
  border:2px solid #a6569f;
}

#SMP_STYLE input.submit[value*="戻る"],
#SMP_STYLE a.btn.return {
  color:#557ccd;
  background-color:#fff;
  border:2px solid #557ccd;
}
#SMP_STYLE input.submit + .button_arrow{
  border-left-color:#557ccd;
  border-bottom-color:#557ccd;
}
div.footer{
  background-color:#000;
  color:#fff;
}

div.footer a{
  color:#fff;
}