/*============================================================= price =============================================================*/
/*! #mainImg
------------------------------------------------- */
#mainImg { background: url("../img/bps/bg_main01_sp.png") center center no-repeat; background-size: cover; }

@media screen and (max-width: 599px) { #mainImg { margin-bottom: 187px !important; }
  #mainImg .mainIn { position: relative; padding: 0 10px; }
  #mainImg .mainIn h1 { color: #262626 !important; padding-top: 38px !important; text-align: left !important; filter: drop-shadow(2px 2px 3px #ffffff); } }

@media screen and (min-width: 600px) { #mainImg { background: url("../img/bps/bg_main01_pc.png") top center no-repeat; height: 500px !important; }
  #mainImg .mainIn { width: 1200px !important; margin: 0 auto !important; position: relative; }
  #mainImg .mainIn .tit { padding-top: 66px !important; font-size: 5.5rem !important; line-height: calc(66.95/55); color: #262626 !important; text-align: left !important; } }

@media screen and (max-width: 599px) {
  #mainImg .mainIn .copy {
     max-width: 304px;
    margin: 30px auto 0;
  }
}

@media screen and (min-width: 600px) {
  #mainImg .mainIn .copy {
    margin: 31px 0 0;
  }
}


/*! #contents 
------------------------------------------------- */
@media screen and (max-width: 599px) { .pc { display: none !important; } }

@media screen and (min-width: 600px) { .sp { display: none !important; } }

#main { padding: 0 10px; font-size: 1.2rem; line-height: 1.5; }

@media screen and (min-width: 600px) { #main { font-size: 1.6rem; line-height: 1.625; } }

@media (min-width: 600px) { #main { padding: 0 0 10px; margin: auto; width: 1200px; } }

#main .mod_tit02 { margin-bottom: 15px; }

@media screen and (min-width: 600px) { #main .mod_tit02 { margin-bottom: 37px; } }

#main .table01 { margin: 0 0 10px 0; width: 100%; border-collapse: collapse; }

@media (min-width: 600px) { #main .table01 { margin: 40px 0 10px 0; } }

#main .table01 th, #main .table01 td { border-collapse: collapse; border: 1px solid #c4c4c5; vertical-align: middle; }

#main .table01 th { padding: 11px; font-size: 1.4rem; line-height: calc(38/28); text-align: center; color: #fff; background: #1b519e; }

@media (min-width: 600px) { #main .table01 th { font-size: 1.9rem; padding: 27px 0; } }

#main .table01 td { padding: 8px 10px; font-size: 1.2rem; }

@media (min-width: 600px) { #main .table01 td { padding: 24px 28px; font-size: 1.6rem; vertical-align: top; } }

#main .table01 .th01 { height: 50px; vertical-align: middle; box-sizing: border-box; }

@media (max-width: 599px) { #main .table01 .txt03 { display: none; } }

@media (min-width: 600px) { #main .table01 .txt04 { display: none; } }

#main .table01 td.td01 { width: 90px; font-size: 1.4rem; box-sizing: border-box; }

#main .table01 td.td02 { width: 50%; font-size: 1.4rem; box-sizing: border-box; }

@media (min-width: 600px) { #main .table01 .th01 { height: 80px; }
  #main .table01 td.td02 { width: 240px; font-size: 1.9rem; height: 125px; } }

#main .table01 td.price { padding: 8px 10px; font-size: 1.5rem; line-height: 1.2; text-align: right; }

@media (min-width: 600px) { #main .table01 td.price { padding: 30px; font-size: 2.2rem; text-align: left; height: 110px; box-sizing: border-box; } }

#main .txtSmall, #main .table01 td.price .tax { font-size: 1.2rem; }

#main .txtStrong { font-weight: 700; }

@media (min-width: 600px) { #main .table01 td.price .tax, #main .txtSmall { font-size: 1.6rem; } }

#main .txtColor01 { display: block; margin: 10px 0 5px; font-size: 1.2rem; color: #1b519e; }

@media (min-width: 600px) { #main .txtColor01 { margin: 20px 0 5px; font-size: 1.6rem; } }

#main .txt01 { margin-top: 5px; }

#main .txt02 { font-size: 1.2rem; line-height: calc(36/24); }

@media (min-width: 600px) { #main .txt02 { margin-top: 15px; font-size: 1.6rem; } }

@media (min-width: 600px) { .bps01 { width: 240px; box-sizing: border-box; }
  .bps02 { width: 480px; box-sizing: border-box; }
  #main .table01 td.bps04 { font-size: 1.9rem; vertical-align: middle; } }

@media screen and (min-width: 600px) { .table03 td.price { vertical-align: middle !important; } }

/* mod - contents */
#bpsIntro .topBox { margin-bottom: 28px; }

#bpsIntro .topBox .img { margin-bottom: 10px; }

#bpsIntro .list01 { padding-bottom: 4px; }

#bpsIntro .list01 li { margin-bottom: 21px; }

#bpsIntro .list01 li .img { float: left; width: 40%; margin: 0 10px 5px 0; }

#bpsIntro .list01 li .box h3 { font-size: 1.5rem; font-family: "Noto Serif CJKjp"; display: inline-block; color: #1b519e; background-image: linear-gradient(to top, #ddecf7 40%, transparent 40%); margin: -5px 0 3px; }

#bpsIntro .list02 { padding-bottom: 18px; }

#bpsIntro .list02 li { border: 1px solid #d9dde2; margin-bottom: 10px; }

#bpsIntro .list02 li h3 { text-align: center; background: #eceef0; font-size: 1.5rem; padding: 5px 0; padding: 10px 0; font-weight: 500; }

#bpsIntro .list02 li:last-child h3 { color: #fff; background: #1b519e; }

#bpsIntro .list02 li:last-child .img { text-align: center; }

#bpsIntro .mod_box01 { margin: 20px 0 20px; padding: 15px 15px 5px; background: #eceef0; }

#bpsIntro .mod_box01 h3 { position: relative; margin-bottom: 25px; font-size: 1.8rem; font-weight: 600; font-family: "Noto Serif CJKjp"; text-align: center; }

#bpsIntro .mod_box01 h3::after { position: relative; display: block; margin: auto; content: ""; bottom: -5px; width: 200px; height: 1px; border-top: 2px solid #1b519e; }

#bpsIntro .mod_box01 .box { background: #fff; padding: 20px; margin-bottom: 13px; }

#bpsIntro .mod_box01 .box h4 { margin-bottom: 3px; font-size: 1.4rem; font-weight: 500; }

#bpsIntro .mod_box01 .box h4 span { background: #1b519e; color: #fff; font-size: 1.2rem; padding: 1px 3px; display: block; width: 73px; text-align: center; margin-bottom: 6px; }

#bpsIntro .mod_box01 .list li { margin-bottom: 17px; }

#bpsIntro .mod_box01 .list li h4 { font-family: "Noto Serif CJKjp"; font-size: 1.6rem; margin-bottom: 8px; }

#bpsIntro .mod_box01 .list li span { color: #1b519e; padding-right: 5px; }

@media screen and (min-width: 600px) { #bpsIntro .topBox { margin-bottom: 92px; }
  #bpsIntro .topBox .img { margin: 0 0 0 50px; float: right; }
  #bpsIntro .list01 { padding-bottom: 72px; }
  #bpsIntro .list01 li { margin-bottom: 12px; }
  #bpsIntro .list01 li .img { float: left; width: auto; margin: 3px 30px 5px 0; }
  #bpsIntro .list01 li .box h3 { font-size: 2.3rem; font-family: "Noto Serif CJKjp"; display: inline-block; color: #1b519e; background-image: none; margin: -1px 0 6px; }
  #bpsIntro .list02 { padding-bottom: 0; }
  #bpsIntro .list02 li { border: 1px solid #d9dde2; float: left; width: 580px; margin-bottom: 0; }
  #bpsIntro .list02 li h3 { text-align: center; background: #eceef0; font-size: 1.9rem; padding: 25px 0; font-weight: 500; }
  #bpsIntro .list02 li:last-child { float: right; }
  #bpsIntro .list02 li:last-child h3 { color: #fff; background: #1b519e; }
  #bpsIntro .list02 li:last-child .img { text-align: center; }
  #bpsIntro .mod_box01 { margin: 36px 0 83px; padding: 36px 40px 52px; background: #eceef0; }
  #bpsIntro .mod_box01 h3 { position: relative; margin-bottom: 55px; font-size: 3rem; font-weight: 600; font-family: "Noto Serif CJKjp"; text-align: center; }
  #bpsIntro .mod_box01 h3::after { position: relative; display: block; margin: auto; content: ""; bottom: -5px; width: 320px; height: 1px; border-top: 2px solid #1b519e; }
  #bpsIntro .mod_box01 .box { background: #fff; padding: 52px 39px; margin: 0 10px 19px; }
  #bpsIntro .mod_box01 .box h4 { margin-bottom: 17px; font-size: 1.6rem; font-weight: 500; }
  #bpsIntro .mod_box01 .box h4 span { background: #1b519e; color: #fff; font-size: 1.6rem; padding: 2px 3px 4px; display: inline-block; width: 122px; text-align: center; margin: 0 13px -3px 0; }
  #bpsIntro .mod_box01 .list li { width: 350px; margin-bottom: 0; float: left; margin-left: 30px; }
  #bpsIntro .mod_box01 .list li:first-child { margin-left: 0; }
  #bpsIntro .mod_box01 .list li h4 { font-family: "Noto Serif CJKjp"; font-size: 2.3rem; margin-bottom: 13px; }
  #bpsIntro .mod_box01 .list li span { color: #1b519e; padding-right: 5px; } }

#bpsList { padding-top: 8px; }

#bpsList h2 { margin-bottom: 31px !important; }

#bpsList .flow { padding-bottom: 13px; }

#bpsList .flow li { margin-bottom: 47px; position: relative; border: 1px solid #c4c4c5; border-top: 2px solid  #1b519e; padding-left:50px; }

@media (min-width: 600px) { #bpsList .flow { margin-top: 50px; padding-bottom: 73px; }
  #bpsList .flow li { margin-bottom: 65px; padding-left: 105px; min-height: 236px; height: auto; }
  #bpsList .flow li .pic01 { position: absolute; right: 0; } }

#bpsList .flow li:last-child { margin-bottom: 15px; }

#bpsList #main .txt01 { margin: 10px 0 30px; font-size: 1.2rem; }

#bpsList .flow li:after { position: absolute; display: block; content: ""; width: 0; height: 0; bottom: -60px; left: calc(50% - 40px); border: 40px solid transparent; border-top: 20px solid #1b519e; }

@media (min-width: 600px) { #bpsList .flow li:after { bottom: -75px; left: calc(50% - 50px); border: 50px solid transparent; border-top: 25px solid #1b519e; } }

#bpsList .flow li:last-child:after { display: none; }

#bpsList .flow li:before { position: absolute; display: block; content: ""; width: 45px; height: 45px; top: -15px; left: 10px; font-family: "Noto Serif CJKjp"; font-size: 2.2rem; line-height: 2; text-align: center; color: #fff; background: #2d8dd0; border-radius: 50%; -webkit-border-radius: 50%; -moz-border-radius: 50%; border: 1px solid #fff; box-shadow: 0 0 0 1px #2d8dd0, 0 0 0 2px #2d8dd0; }

@media (min-width: 600px) { #bpsList .flow li:before { width: 76px; height: 76px; top: -15px; left: 10px; font-size: 3.466rem; line-height: 2; box-shadow: 0 0 0 1px #2d8dd0, 0 0 0 3px #2d8dd0; } }

#bpsList .flow .flow01:before { content: "01"; }

#bpsList .flow .flow02:before { content: "02"; }

#bpsList .flow .flow03:before { content: "03"; }

#bpsList .flow .flow04:before { content: "04"; }

#bpsList .flow .flow05:before { content: "05"; }

#bpsList .flow .flow06:before { content: "06"; }

#bpsList .flow .flow07:before { content: "07"; }

#bpsList .flow .tit01 { margin: 15px 15px 0; padding: 0 0 6px; font-family: "Noto Serif CJKjp"; font-size: 1.8rem; font-weight: 600; letter-spacing: 0.15em; border-bottom: 1px dashed #a6a6a6; }

#bpsList .flow .txt { margin: 5px 15px 20px; }

@media (min-width: 600px) { #bpsList .flow .tit01 { margin: 60px 0 15px; padding: 0 0 10px; width: 715px; font-size: 3.0rem; }
  #bpsList .flow .txt { margin: 15px 0 0; padding: 0; width: 715px; font-size: 1.6rem; } }

#bpsList > .box { margin: -8px 0 15px; background: #eceef0; }

#bpsList > .box h3 { font-size: 1.6rem; font-family: "Noto Serif CJKjp"; border-bottom: 2px solid #fff; padding: 15px 20px 18px; }

#bpsList > .box .list { padding: 8px 10px 15px 20px; }

#bpsList > .box .list li { position: relative; padding: 7px 0 0px 18px; }

#bpsList > .box .list li::before { position: absolute; top: 11px; left: 0; content: ""; width: 10px; height: 10px; background: #1b519e; }

#bpsList .sub { margin: -6px 0 36px; }

@media screen and (min-width: 600px) { #bpsList > .box { margin: 0 0 0; background: #eceef0; }
  #bpsList > .box h3 { font-size: 2.3rem; font-family: "Noto Serif CJKjp"; border-bottom: 0; border-right: 2px solid #fff; padding: 45px 0 45px 50px; float: left; width: 190px; }
  #bpsList > .box .list { padding: 29px 0 0 0; float: right; width: 958px; }
  #bpsList > .box .list li { position: relative; padding: 7px 0 0px 18px; display: inline-block; min-width: 407px; }
  #bpsList > .box .list li::before { position: absolute; top: 13px; left: 0; content: ""; width: 12px; height: 12px; background: #1b519e; }
  #bpsList .sub { margin: 17px 0 113px; } }
