@charset "UTF-8";
@media screen and (min-width: 641px), screen and (orientation: landscape) { #h2-title { background: url(../images/house/h2.jpg) top center no-repeat; }
  #h2-title h2 { color: #fff; text-shadow: 2px 2px 44px #000000,-1px -2px 48px #000000,17px -5px 43px #000000,-2px 10px 43px #000000,-8px -1px 42px #000000,32px 4px 43px #000000,11px 4px 42px #000000,-14px 2px 40px #000000,21px 3px 22px #000000; letter-spacing: 3px; }
  .page-house { font-size: 16px; line-height: 2.65; }
  .dis-b { display: block; }
  .page-deco { position: absolute; left: -182px; top: -16px; }
  .rel-Box { margin-top: 48px; width: 255px; margin-left: auto; margin-right: auto; position: relative; margin-bottom: 24px; }
  #h3-title .f-min_02 { color: #000000; font-size: 16px; font-weight: bold; letter-spacing: 3px; }
  #h3-title .mb-01 { margin-bottom: 43px; }
  #in-main-contents { background-image: url(../images/house/contents-bg.jpg); background-repeat: repeat-y; background-position: center -440px; background-color: #22222a; }
  #in-main-contents #inner-box { width: 1100px; padding: 0px 0px 0px 0px; background-color: #fff; margin-bottom: 125px; }
  /* Ten -------------------------------------*/
  .ten { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; }
  .ori { -webkit-box-lines: multiple; -moz-box-lines: multiple; -webkit-flex-wrap: wrap; -moz-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
  .ten-ce { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-pack: justify; -ms-flex-pack: justify; -webkit-justify-content: space-between; justify-content: space-between; }
  .ten-txt-ce { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
  .ten-mce { display: -webkit-box; display: -webkit-flex; display: -moz-flex; display: -ms-flex; display: -o-flex; display: flex; -webkit-box-pack: center; -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center; }
  .ten-u { display: -webkit-box; display: -moz-box; display: -webkit-flexbox; display: -moz-flexbox; display: -ms-flexbox; display: -webkit-flex; display: -moz-flex; display: flex; -webkit-box-align: end; -moz-box-align: end; -ms-flex-align: end; -webkit-align-items: flex-end; -moz-align-items: flex-end; align-items: flex-end; }
  .order { -webkit-box-ordinal-group: -1; -moz-box-ordinal-group: -1; -webkit-flex-order: -1; -moz-flex-order: -1; -webkit-order: -1; -moz-order: -1; order: -1; }
  .ten-t { -webkit-box-direction: normal; -moz-box-direction: normal; -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column; -moz-flex-direction: column; flex-direction: column; }
  .ten-ue { -webkit-box-align: start; -moz-box-align: start; -ms-flex-align: start; -webkit-align-items: flex-start; -moz-align-items: flex-start; align-items: flex-start; }
  .ten-o { -webkit-box-ordinal-group: -1; -moz-box-ordinal-group: -1; -webkit-flex-order: -1; -moz-flex-order: -1; -webkit-order: -1; -moz-order: -1; order: -1; }
  .ten-rt { display: -webkit-box; display: -moz-box; display: -webkit-flexbox; display: -moz-flexbox; display: -ms-flexbox; display: -webkit-flex; display: -moz-flex; display: flex; -webkit-box-direction: reverse; -moz-box-direction: reverse; -webkit-box-orient: vertical; -moz-box-orient: vertical; -webkit-flex-direction: column-reverse; -moz-flex-direction: column-reverse; flex-direction: column-reverse; }
  /* lead-Box -------------------------------------*/
  #lead-Box { background-color: #fff; background-image: url(../images/house/bg-01.png); background-repeat: no-repeat; background-position: center 0; padding-top: 56px; padding-bottom: 115px; border-bottom: 3px solid #22222a; }
  #lead-Box .ttl { text-align: center; margin-bottom: 32px; }
  #lead-Box .pic { text-align: center; margin-bottom: 27px; }
  #lead-Box .txt { width: 850px; margin-left: auto; margin-right: auto; }
  /* concept-Box -------------------------------------*/
  #concept-Box { background-image: url(../images/house/bg-ptn-01.jpg); background-repeat: repeat-y; padding-top: 56px; padding-left: 50px; padding-right: 50px; padding-bottom: 22px; position: relative; margin-bottom: 56px; }
  #concept-Box .Box-deco-l { top: -76px; position: absolute; left: 0px; }
  #concept-Box .Box-deco-r { top: -201px; position: absolute; right: 0; }
  #concept-Box .ttl { text-align: center; padding-top: 16px; padding-bottom: 14px; border-top: 4px solid #22222a; border-bottom: 4px solid #22222a; width: 488px; margin-left: auto; margin-right: auto; position: relative; background-color: #fff; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 35px; font-weight: 600; color: #0a090a; line-height: 1.6; letter-spacing: 2px; margin-bottom: 56px; }
  #concept-Box .ttl .deco-l { position: absolute; left: -28px; top: -4px; }
  #concept-Box .ttl .deco-r { position: absolute; right: -28px; top: -4px; }
  #concept-Box .ttl .deco { position: absolute; right: -61px; top: 14px; }
  #concept-Box .ttl strong { color: #aa7000; }
  .Box-01 { background-color: #fff; margin-bottom: 48px; }
  .Box-01 .Box-l { width: 380px; position: relative; }
  .Box-01 .Box-l .deco { position: absolute; top: -106px; left: 70px; }
  .Box-01 .ttl-02 { width: 102px; background-color: #003044; padding-top: 40px; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; color: #ffffff; font-size: 30px; font-weight: 600; letter-spacing: 3px; text-align: center;}
  .Box-01 .pic-01 { width: 276px; }
  .Box-01 .Box-r { font-size: 16px; color: #0a090a; padding: 40px 32px 48px 56px; width: 622px;}
  .Box-02 { background-color: #fff; margin-bottom: 40px; position: relative; }
  .Box-02 .Box-deco { position: absolute; bottom: -53px; right: 158px; z-index: 100; }
  .Box-02 .Box-r { width: 380px; position: relative; z-index: 10; }
  .Box-02 .Box-r .deco { position: absolute; top: -73px; right: 18px; z-index: -1; }
  .Box-02 .ttl-02 { width: 102px; background-color: #003044; padding-top: 40px; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; color: #ffffff; font-size: 30px; font-weight: 600; letter-spacing: 2.2px; text-align: center;}
  .Box-02 .pic-01 { width: 276px; }
  .Box-02 .Box-l { font-size: 16px; color: #0a090a; padding: 42px 64px 48px 42px; width: 622px; }
  .Box-02 .Box-l .w-01 { width: 455px; }
  .Box-02 .Box-l .str-01 { color: #00577c; font-size: 24px; font-weight: 600; line-height: 1.6; letter-spacing: 2px; }
  /* flow-Box -------------------------------------*/
  #flow-Box { padding-bottom: 80px; background-image: url(../images/house/bg-ptn-04.jpg); background-position: 0 bottom; background-repeat: repeat-x; }
  #flow-Box .mb-01 { margin-bottom: 160px; }
  #flow-Box .mb-02 { margin-bottom: 160px; }
  #flow-Box .mb-03 { margin-bottom: 160px; }
  #flow-Box .mb-04 { margin-bottom: 160px; }
  #flow-Box .mb-05 { margin-bottom: 150px; }
  #flow-Box .mb-06 { margin-bottom: 230px; }
  #flow-Box .mb-07 { margin-bottom: 0; margin-left: 100px; }
  #flow-Box .mb-08 { margin-bottom: 160px; }
  #flow-Box .mb-09 { margin-bottom: 160px; }
  #flow-Box .mb-10 { margin-bottom: 160px; }
  #flow-Box .mb-11 { margin-bottom: 150px; }
  #flow-Box .mb-12 { margin-bottom: 230px; }
  #flow-Box .rel-Box-01 { position: relative; }
  #flow-Box .rel-Box-01 .Box-deco-l { position: absolute; left: 9px; top: -163px; }
  #flow-Box .rel-Box-01 .Box-deco-r { position: absolute; right: 23px; top: -107px; }
  #flow-Box .rel-Box-02 { position: relative; }
  #flow-Box .rel-Box-02 .Box-deco { position: absolute; right: 18px; top: -68px; }
  #flow-Box .ttl-01 { background-image: url(../images/house/deco-06.png), url(../images/house/deco-05.png), url(../images/house/bg-ptn-02.jpg); background-repeat: no-repeat,no-repeat,repeat-y; background-position: 120px center,right 127px top 21px,0 0; text-align: center; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; color: #ffffff; font-size: 38px; font-weight: 600; padding-top: 14px; padding-bottom: 3px; letter-spacing: 5px; }
  #flow-Box .p-Box { padding-left: 85px; padding-right: 85px; padding-top: 43px; }
  #flow-Box .bd-Box { border: 15px solid #00577c; border-bottom: 0; padding: 65px 60px 0; background-image: url(../images/house/flow-bg.png), url(../images/house/bg-ptn-03.jpg); background-repeat: no-repeat,repeat-y; }
  #flow-Box .bd-Box2 { border: 15px solid #00577c; border-top: 0; padding: 150px 60px 65px; background-image: url(../images/house/flow-bg2.png), url(../images/house/bg-ptn-03.jpg); background-repeat: no-repeat,repeat-y; margin-bottom: 64px; }
  #flow-Box .step-list li { width: 635px; border: 1px solid #26262f; background-color: #fff; padding: 50px 20px 20px 20px; position: relative; }
  #flow-Box .step-list li:nth-child(2n) { margin-left: auto; }
  #flow-Box .bd-Box2 .step-list li:last-child { width: 777px; }
  #flow-Box .bd-Box2 .step-list li:last-child .Box-l { width: 262px; margin-right: 38px; }
  #flow-Box .bd-Box2 .step-list li:last-child .Box-r { width: 406px; }
  #flow-Box .step-list li .ttl { width: 180px; position: absolute; text-align: center; margin-left: auto; margin-right: auto; left: 0; right: 0; top: -23px; background-image: url(../images/house/ttl-bg.png); height: 52px; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; color: #ffffff; font-size: 20px; font-weight: 600; letter-spacing: 1px; }
  #flow-Box .step-list li .c-Box { line-height: 2; font-size: 14px; }
  #flow-Box .step-list li .c-Box .ttl-02 { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; color: #090909; font-size: 26px; font-weight: 700; line-height: 28px; margin-bottom: 16px; padding-top: 8px; }
  #flow-Box .step-list li .Box-l { width: 220px; }
  #flow-Box .step-list li .Box-r { width: 345px; }
  #flow-Box .o-txt-01 { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; color: #0a090a; font-size: 25px; font-weight: 700; line-height: 1.8; text-align: center; }
  #flow-Box .o-txt-Box { width: 845px; margin-left: auto; margin-right: auto; background-image: url(../images/house/ttl-l-02.png), url(../images/house/ttl-r-02.png); background-repeat: no-repeat,no-repeat; background-position: left 10px, right 10px; padding-left: 120px; padding-right: 120px; text-align: center; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; font-size: 36px; font-weight: 700; line-height: 1.7; color: #0a090a; margin-bottom: 56px; }
  #flow-Box .o-txt-Box strong { color: #00577c; }
  #flow-Box .o-pic { position: relative; }
  #flow-Box .o-pic .Box-deco-l { position: absolute; left: -50px; bottom: -35px; }
  #flow-Box .o-pic .Box-deco-r { position: absolute; right: -16px; top: -22px; }
  /* nav-area -------------------------------------*/
  #nav-area { padding-top: 37px; padding-bottom: 70px; text-align: center; background-color: #003d57; color: #fff; }
  #nav-area .h4-Box { margin-bottom: 8px; }
  #nav-area .deco-ttl { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 22px; font-weight: 400; padding-left: 2em; padding-right: 2em; letter-spacing: 1.5px; background-image: url(../images/house/ttl-l-03-l.png), url(../images/house/ttl-l-03-r.png); background-position: left 15px, right 15px; background-repeat: no-repeat,no-repeat; display: inline-block; } }
		
		
@media screen and (orientation: portrait) and (max-width: 640px) { #h2-title { background: url(../images/house/h2.jpg) top center no-repeat; }
  #h2-title h2 { color: #fff; text-shadow: 2px 2px 44px #000000,-1px -2px 48px #000000,17px -5px 43px #000000,-2px 10px 43px #000000,-8px -1px 42px #000000,32px 4px 43px #000000,11px 4px 42px #000000,-14px 2px 40px #000000,21px 3px 22px #000000; letter-spacing: 3px; }
  .page-house { font-size: 16px; line-height: 2.65; }
  .dis-b { display: block; }
  .page-deco { position: absolute; left: -182px; top: -16px; }
  .rel-Box { margin-top: 48px; width: 100%; margin-left: auto; margin-right: auto; position: relative; margin-bottom: 24px; }
  #h3-title .f-min_02 { color: #000000; font-size: 16px; font-weight: bold; letter-spacing: 3px; }
  #h3-title .mb-01 { margin-bottom: 43px; }
  #in-main-contents { background-image: url(../images/house/contents-bg.jpg); background-repeat: repeat-y; background-position: center -440px; background-color: #22222a; }
  #in-main-contents #inner-box { width: 100%; padding: 0px 0px 0px 0px; background-color: #fff; margin-bottom: 0px; }
  /* lead-Box -------------------------------------*/
  #lead-Box { background-color: #fff; background-image: url(../images/house/bg-01.png); background-repeat: no-repeat; background-position: center 0; padding-top: 8%; padding-bottom: 12%; border-bottom: 3px solid #22222a; padding-left: 5%; padding-right: 5%; }
  #lead-Box .ttl { text-align: center; margin-bottom: 32px; }
  #lead-Box .pic { text-align: center; margin-bottom: 27px; }
  #lead-Box .txt { width: 100%; margin-left: auto; margin-right: auto; }
  /* concept-Box -------------------------------------*/
  #concept-Box { background-image: url(../images/house/bg-ptn-01.jpg); background-repeat: repeat-y; padding: 8% 5%; position: relative; margin-bottom: 56px; }
  #concept-Box .Box-deco-l { top: -76px; position: absolute; left: 0px; }
  #concept-Box .Box-deco-r { top: -201px; position: absolute; right: 0; }
  #concept-Box .ttl { text-align: center; padding-top: 16px; padding-bottom: 14px; border-top: 4px solid #22222a; border-bottom: 4px solid #22222a; width: 100%; margin-left: auto; margin-right: auto; position: relative; background-color: #fff; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 2.2rem; font-weight: 600; color: #0a090a; line-height: 1.6; letter-spacing: 2px; margin-bottom: 8%; padding-left: 5%; padding-right: 5%; }
  #concept-Box .ttl .deco-l { position: absolute; left: -28px; top: -4px; }
  #concept-Box .ttl .deco-r { position: absolute; right: -28px; top: -4px; }
  #concept-Box .ttl .deco { position: absolute; right: -61px; top: 14px; }
  #concept-Box .ttl strong { color: #aa7000; }
  .Box-01 { background-color: #fff; margin-bottom: 48px; }
  .Box-01 .Box-l { width: 100%; position: relative; }
  .Box-01 .Box-l .deco { position: absolute; top: -106px; left: 70px; }
  .Box-01 .ttl-02 { width: 100%; background-color: #003044; padding: 3% 5% 4%; color: #ffffff; font-size: 2.2rem; font-weight: 600; letter-spacing: 3px; writing-mode: inherit; writing-mode: initial; writing-mode: unsel; line-height: 1.5; text-align: center; display: block; }
  .Box-01 .ttl-02:before { content: url(../images/shop/icon03.png); display: block; text-align: center; margin-bottom: 2%; }
  .Box-01 .pic-01 { width: 100%; }
  .Box-01 .Box-r { font-size: 16px; color: #0a090a; padding: 5%; }
  .Box-02 { background-color: #fff; margin-bottom: 40px; position: relative; }
  .Box-02 .Box-deco { position: absolute; bottom: -53px; right: 158px; z-index: 100; }
  .Box-02 .Box-r { width: 100%; position: relative; z-index: 10; }
  .Box-02 .Box-r .deco { position: absolute; top: -73px; right: 18px; z-index: -1; }
  .Box-02 .ttl-02 { width: 100%; background-color: #003044; padding: 3% 5% 4%; color: #ffffff; font-size: 2.2rem; font-weight: 600; letter-spacing: 3px; writing-mode: inherit; writing-mode: initial; writing-mode: unsel; line-height: 1.5; text-align: center; display: block; }
  .Box-02 .ttl-02:before { content: url(../images/shop/icon03.png); display: block; text-align: center; margin-bottom: 2%; }
  .Box-02 .pic-01 { width: 100%; }
  .Box-02 .Box-l { font-size: 16px; color: #0a090a; padding: 5% 5%; }
  .Box-02 .Box-l .w-01 { width: 100%; }
		
  .Box-02 .Box-l .str-01 { color: #00577c; font-size: 2rem; font-weight: 600; line-height: 1.6; letter-spacing: 2px; 
		
		}
  /* flow-Box -------------------------------------*/
  #flow-Box { padding-bottom: 5%; background-image: none; background-position: 0 bottom; background-repeat: repeat-x; }
  #flow-Box .mb-01 { margin-bottom: 0%; margin-bottom: 30%; }
  #flow-Box .mb-01:after { bottom: -17%; position: absolute; content: url("../images/shop/icon02.png"); left: 0; right: 0; text-align: center; margin-left: auto; margin-right: auto; }
  #flow-Box .mb-02 { margin-bottom: 30%; }
  #flow-Box .mb-02:after { bottom: -18%; position: absolute; content: url("../images/shop/icon02.png"); left: 0; right: 0; text-align: center; margin-left: auto; margin-right: auto; }
  #flow-Box .mb-03 { margin-bottom: 30%; }
  #flow-Box .mb-03:after { bottom: -38%; position: absolute; content: url("../images/shop/icon02.png"); left: 0; right: 0; text-align: center; margin-left: auto; margin-right: auto; }
  #flow-Box .mb-04 { margin-bottom: 30%; }
  #flow-Box .mb-04:after { bottom: -18%; position: absolute; content: url("../images/shop/icon02.png"); left: 0; right: 0; text-align: center; margin-left: auto; margin-right: auto; }
  #flow-Box .mb-05 { margin-bottom: 30%; }
  #flow-Box .mb-05:after { bottom: -38%; position: absolute; content: url("../images/shop/icon02.png"); left: 0; right: 0; text-align: center; margin-left: auto; margin-right: auto; }
  #flow-Box .mb-06 { margin-bottom: 30%; }
  #flow-Box .mb-06:after { bottom: -18%; position: absolute; content: url("../images/shop/icon02.png"); left: 0; right: 0; text-align: center; margin-left: auto; margin-right: auto; }
  #flow-Box .mb-07 { margin-bottom: 0%; margin-left: 0px; }
  #flow-Box .mb-08 { margin-bottom: 30%; }
  #flow-Box .mb-08:after { bottom: -18%; position: absolute; content: url("../images/shop/icon02.png"); left: 0; right: 0; text-align: center; margin-left: auto; margin-right: auto; }
  #flow-Box .mb-09 { margin-bottom: 30%; }
  #flow-Box .mb-09:after { bottom: -37%; position: absolute; content: url("../images/shop/icon02.png"); left: 0; right: 0; text-align: center; margin-left: auto; margin-right: auto; }
  #flow-Box .mb-10 { margin-bottom: 30%; }
  #flow-Box .mb-10:after { bottom: -44%; position: absolute; content: url("../images/shop/icon02.png"); left: 0; right: 0; text-align: center; margin-left: auto; margin-right: auto; }
  #flow-Box .mb-11 { margin-bottom: 30%; }
  #flow-Box .mb-11:after { bottom: -14%; position: absolute; content: url("../images/shop/icon02.png"); left: 0; right: 0; text-align: center; margin-left: auto; margin-right: auto; }
  #flow-Box .mb-12 { margin-bottom: 30%; }
  #flow-Box .mb-12:after { bottom: -17%; position: absolute; content: url("../images/shop/icon02.png"); left: 0; right: 0; text-align: center; margin-left: auto; margin-right: auto; }
  #flow-Box .rel-Box-01 { position: relative; }
  #flow-Box .rel-Box-01 .Box-deco-l { position: absolute; left: 9px; top: -163px; }
  #flow-Box .rel-Box-01 .Box-deco-r { position: absolute; right: 23px; top: -107px; }
  #flow-Box .rel-Box-02 { position: relative; }
  #flow-Box .rel-Box-02 .Box-deco { position: absolute; right: 18px; top: -68px; }
  #flow-Box .ttl-01 { background-image: url(../sp-images/bg-common/bg-ptn-02.jpg); font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; color: #fff; font-size: 2.0rem; padding-top: 6%; padding-bottom: 6%; font-weight: bold; letter-spacing: 1px; text-align: center; padding-left: 5%; padding-right: 5%; line-height: 1.4; }
  #flow-Box .p-Box { padding-top: 8%; padding-left: 5%; padding-right: 5%; }
  #flow-Box .bd-Box { border: 8px solid #00577c; border-bottom: 0; padding: 10% 5% 0; background-image: none, url(../images/house/bg-ptn-03.jpg); background-repeat: no-repeat,repeat-y; }
  #flow-Box .bd-Box .sp-mb-02 { padding-bottom: 8%; padding-top: 2%; }
  #flow-Box .bd-Box2 { border: 8px solid #00577c; border-top: 0; padding: 5% 5% 8%; background-image: none, url(../images/house/bg-ptn-03.jpg); background-repeat: no-repeat,repeat-y; margin-bottom: 64px; }
  #flow-Box .step-list li { width: 100%; border: 1px solid #26262f; background-color: #fff; padding: 50px 20px 20px 20px; position: relative; }
  #flow-Box .step-list li:nth-child(2n) { margin-left: auto; }
  #flow-Box .bd-Box2 .step-list li:last-child { width: 100%; }
  #flow-Box .bd-Box2 .step-list li:last-child .Box-l { width: 100%; margin-right: 38px; }
  #flow-Box .bd-Box2 .step-list li:last-child .Box-r { width: 100%; }
  #flow-Box .step-list li .ttl { width: 180px; position: absolute; text-align: center; margin-left: auto; margin-right: auto; left: 0; right: 0; top: -23px; background-image: url(../images/house/ttl-bg.png); height: 52px; font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; color: #ffffff; font-size: 20px; font-weight: 600; letter-spacing: 1px; }
  #flow-Box .step-list li .c-Box { line-height: 2; font-size: 14px; }
  #flow-Box .step-list li .c-Box .ttl-02 { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; color: #090909; font-size: 2.2rem; font-weight: 700; line-height: 28px; margin-bottom: 3%; padding-top: 8px; }
  #flow-Box .step-list li .Box-l { width: 100%; margin-bottom: 5%; text-align: center; }
  #flow-Box .step-list li .Box-r { width: 100%; }
  #flow-Box .o-txt-01 { font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; color: #0a090a; font-size: 2rem; font-weight: 700; line-height: 1.8; text-align: left; }
  #flow-Box .o-txt-Box { width: 100%; margin-left: auto; margin-right: auto; background-image: none, none; background-repeat: no-repeat,no-repeat; background-position: left 10px, right 10px; padding-left: 0px; padding-right: 0px; text-align: center; font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", "游ゴシック","Yu Gothic", YuGothic, "ヒラギノ角ゴ Pro", "Hiragino Kaku Gothic Pro",  Verdana, Meiryo, Osaka, 'ＭＳ Ｐゴシック', 'MS PGothic', sans-serif; font-size: 2.2rem; font-weight: 700; line-height: 1.7; color: #0a090a; margin-bottom: 5%; }
  #flow-Box .o-txt-Box strong { color: #00577c; }
  #flow-Box .o-pic { position: relative; }
  #flow-Box .o-pic .Box-deco-l { position: absolute; left: -50px; bottom: -35px; }
  #flow-Box .o-pic .Box-deco-r { position: absolute; right: -16px; top: -22px; }
  #flow-Box .sp-mb-01 { margin-bottom: 5%; }
  /* nav-area -------------------------------------*/
  #nav-area { padding: 5%; text-align: center; background-color: #003d57; color: #fff; }
  #nav-area .h4-Box { margin-bottom: 8px; }
  #nav-area .deco-ttl { font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; font-size: 22px; font-weight: 400; padding-left: 0; padding-right: 0; letter-spacing: 1.5px; background-image: none, none; background-position: left 15px, right 15px; background-repeat: no-repeat,no-repeat; display: inline-block; }
  .sp-c-ttl-01 { background-image: url(../sp-images/bg-common/bg-ptn-02.jpg); font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3","Sawarabi Mincho","Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif; color: #fff; font-size: 2.0rem; padding-top: 6%; padding-bottom: 6%; font-weight: bold; letter-spacing: 1px; text-align: center; padding-left: 5%; padding-right: 5%; line-height: 1.4; } }
@media screen and (orientation: portrait) and (max-width: 380px) { #flow-Box .mb-01:after { bottom: -16%; }
  #flow-Box .mb-02:after { bottom: -16%; }
  #flow-Box .mb-03:after { bottom: -33%; }
  #flow-Box .mb-04:after { bottom: -16%; }
  #flow-Box .mb-05:after { bottom: -35%; }
  #flow-Box .mb-06:after { bottom: -17%; }
  #flow-Box .mb-07 { margin-bottom: 0%; margin-left: 0px; }
  #flow-Box .mb-08:after { bottom: -17%; }
  #flow-Box .mb-09:after { bottom: -37%; }
  #flow-Box .mb-10:after { bottom: -42%; }
  #flow-Box .mb-11:after { bottom: -13%; }
  #flow-Box .mb-12:after { bottom: -15%; } }
@media screen and (orientation: portrait) and (max-width: 330px) { #flow-Box .mb-01:after { bottom: -14%; }
  #flow-Box .mb-02:after { bottom: -15%; }
  #flow-Box .mb-03:after { bottom: -25%; }
  #flow-Box .mb-04:after { bottom: -15%; }
  #flow-Box .mb-05:after { bottom: -33%; }
  #flow-Box .mb-06:after { bottom: -17%; }
  #flow-Box .mb-07 { margin-bottom: 0%; margin-left: 0px; }
  #flow-Box .mb-08:after { bottom: -15%; }
  #flow-Box .mb-09:after { bottom: -28%; }
  #flow-Box .mb-10:after { bottom: -39%; }
  #flow-Box .mb-11:after { bottom: -11%; }
  #flow-Box .mb-12:after { bottom: -13%; } }
