@charset "UTF-8";
/* mixin
------------------------------*/
html,
body,
body div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
  margin: 0;
  padding: 0;
  border: 0;
  vertical-align: baseline;
  font-weight: normal;
  font-style: normal;
}

body {
  padding: 0;
  font-size: 22px;
  line-height: 1.5em;
  font-family: "M PLUS 1p", "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ";
  color: #464547;
  font-weight: 500;
}

/*\*/
* html div {
  height: 1em;
}

div {
  display: block;
}

/**/
/* clearfix
------------------------------*/
.clearfix:after {
  clear: both;
  height: 0;
  visibility: hidden;
  display: block;
  content: ".";
}

.clearfix {
  display: inline-block;
}

/* Hides from IE-mac \*/
* html .clearfix {
  height: 1%;
}

/* End hide from IE-mac */
.clearfix {
  display: block;
}

/* clear */
.clear {
  clear: both;
}

p,
ul {
  display: block;
}

p {
  margin-bottom: 20px;
  font-weight: 500;
}

img {
  line-height: 0;
  margin: 0;
  padding: 0;
  vertical-align: bottom;
}

.R {
  text-align: right;
}

.L {
  text-align: left;
}

.C {
  text-align: center !important;
}

.fl {
  float: left;
}

.fr {
  float: right;
}

p.read {
  margin-bottom: 40px;
}

@media (max-width: 760px) {
  body {
    font-size: 14px;
    line-height: 1.5em;
    -webkit-text-size-adjust: 100%;
  }
  img {
    width: 100%;
  }
}
li {
  list-style: none;
}

h1,
h2,
h3 {
  font-weight: bold;
}

h2 {
  font-size: 32px;
  color: #fe8402;
  font-weight: bold;
  line-height: 1.8em;
}

.smp {
  display: none;
}

.pc {
  display: block;
}

@media screen and (max-width: 1024px) {
  .smp {
    display: block;
  }
  .pc {
    display: none;
  }
}
a {
  color: #464547;
  text-decoration: none;
}

a:hover {
  text-decoration: underline;
}

a:hover img {
  opacity: 0.7;
  filter: alpha(opacity=70);
  -ms-filter: "alpha(opacity=70)";
}

b {
  color: #fe8402;
}

header,
footer {
  width: 1200px;
  margin: 0 auto;
}

.point p,
.ex p,
.area p,
.area table {
  transform: rotate(0.001deg);
}

/*header*/
header {
  position: relative;
}
header p {
  position: absolute;
  top: 20px;
  right: 20px;
  display: flex;
  align-items: flex-end;
  width: 590px;
  justify-content: space-between;
}
header .cta {
  position: absolute;
  bottom: 85px;
  left: 642px;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
}

#form header {
  position: static;
}

/* headerスマホ */
@media screen and (max-width: 1024px) {
  header,
  article,
  footer {
    width: 100%;
  }
  header .cta {
    bottom: 4.5vw;
    left: 15px;
    right: 15px;
    justify-content: space-between;
  }
  header .cta .bt01 {
    width: 40%;
    margin: 0;
    position: absolute;
    bottom: 12px;
    left: 36px;
  }
  header .cta .bt02 {
    width: 47%;
    position: absolute;
    bottom: 7px;
    right: -3px;
  }
  header .cta img {
    width: 100%;
  }
}
/*コンテンツ*/
h2 {
  font-size: 80px;
  color: #02ac4d;
  font-weight: bold;
  margin-bottom: 60px;
  border-bottom: 10px #f9d902 dashed;
  line-height: 1.4em;
  display: inline-block;
}
h2 img {
  vertical-align: sub;
}

article {
  width: 1200px;
  text-align: center;
  margin: -65px auto 0 auto;
}
article.nosp {
  margin: 0 auto 0 auto;
}

.in {
  width: 1200px;
  margin: 0 auto;
}

i {
  font-size: 80%;
}

b {
  color: #fe8402;
  font-weight: bold;
}

em {
  font-style: normal;
}

section {
  width: 100%;
  margin: 0 auto;
}

.caution {
  position: relative;
  text-align: left;
  font-size: 38px;
  line-height: 1.6em;
  width: 84%;
  margin: 20px auto 30px auto;
  height: 120px;
}
.caution:before {
  content: "";
  display: inline-block;
  background-image: url(../images/mark_caution.png);
  background-size: contain;
  vertical-align: middle;
  position: absolute;
  top: 0;
  width: 134px;
  height: 120px;
}
.caution span {
  display: block;
  position: absolute;
  left: 150px;
  font-weight: bold;
}
.caution span em {
  background-color: #fdfe9c;
  font-weight: bold;
}

.entry a {
  position: absolute;
  bottom: 105px;
  right: 33px;
}
.entry.msp {
  margin: -180px 0 60px 0;
}
.entry.space {
  margin: -90px 0 50px 0;
}
.entry.space-middle {
  margin: 40px 0;
}

.imgbx {
  margin: -60px auto 110px auto;
  text-align: center;
}
.imgbx img {
  margin: 0 auto;
}

.imgbx.nosp {
  margin: 90px auto 20px auto;
}
@media screen and (max-width: 1024px) {
  .imgbx.nosp {
    margin: 6vw auto 16vw auto;
  }
}

/*4つの強み*/
.point .box {
  display: flex;
  justify-content: space-between;
  margin-bottom: 40px;
}
.point .box h3 {
  font-size: 44px;
  color: #02ac4d;
  margin-bottom: 30px;
  display: flex;
  align-items: flex-start;
}
.point .box h3 span {
  font-weight: bold;
  line-height: 1.2em;
}
.point .box h3 span.ssp {
  line-height: 2em;
}
.point .box h3 img {
  vertical-align: sub;
  margin-right: 15px;
}
.point .box .tx {
  width: 46%;
  text-align: left;
  padding: 30px 0 0 0;
}
.point .box:nth-child(odd) {
  flex-flow: row-reverse nowrap;
}
.point .imgbx {
  margin: 0 auto 0 auto;
}

/*施工事例*/
.ex {
  margin: -100px 0 0 0;
  padding: 70px 0 100px 0;
}
.ex .in {
  width: 90%;
  margin: 0 auto;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.ex .in .box {
  width: 510px;
  margin-bottom: 50px;
}
.ex .in .box .imbx {
  height: 309px;
  text-align: center;
  overflow: hidden;
}
.ex .in .box .imbx h3 {
  font-size: 60px;
  color: #FFFFFF;
  line-height: 1.1em;
  text-shadow: 0px 0px 20px #000000;
  margin: -210px auto 0 auto;
}
.ex .in .box .imbx h3.ssp {
  margin: -190px auto 0 auto;
}
.ex .in .box .imbx h3.sssp {
  margin: -190px auto 0 auto;
}
.ex .in .box .tx {
  background-color: #02b757;
  color: #FFFFFF;
  padding: 30px 35px;
  text-align: left;
  height: 300px;
}
.ex .in .box .tx b {
  font-size: 120%;
  position: relative;
  color: #FFFFFF;
  margin: 0 0 10px 45px;
  display: block;
}
.ex .in .box .tx b:before {
  position: absolute;
  content: url("../images/ex_mark.png");
  top: 2px;
  left: -43px;
  width: 41px;
  height: 36px;
}

/*よくある質問*/
.faq {
  width: 90%;
  margin-bottom: 80px;
}
.faq dl {
  margin-bottom: 40px;
  text-align: left;
}
.faq dl dt {
  border: 5px solid #d6d7d7;
  padding: 30px 30px 20px 30px;
  font-size: 120%;
  border-radius: 30px;
  -webkit-border-radius: 30px;
  -moz-border-radius: 30px;
}
.faq dl dt p {
  margin-left: 85px;
  position: relative;
  padding-top: 10px;
}
.faq dl dt p:before {
  content: url("../images/faq_mark.png");
  position: absolute;
  top: -5px;
  left: -80px;
  width: 65px;
  height: 65px;
}
.faq dl dt p span {
  display: block;
  position: absolute;
  cursor: pointer;
  right: 0;
  top: -5px;
  width: 61px;
  height: 61px;
  margin-right: 5px;
  background: url(../images/bt_plus.png) no-repeat;
}
.faq dl dt p.active span {
  background: url(../images/bt_minus.png) no-repeat;
}
.faq dl dt.ssp p:before {
  top: 10px;
}
.faq dl dt.ssp span {
  top: 10px;
}
.faq dl dd {
  display: none;
  padding: 20px 0;
  padding: 20px 40px;
}

/*対応エリア*/
.area {
  width: 90%;
  margin: 0 auto 80px auto;
}
.area h2 {
  margin-bottom: 20px;
}
.area p {
  margin-bottom: 50px;
}
.area table {
  margin: 50px auto 0 auto;
}
.area table th,
.area table td {
  padding: 20px;
}
.area table th {
  background-color: #efefef;
  border-bottom: 2px solid #FFFFFF;
}
.area table td {
  text-align: left;
}

/* コンテンツスマホ */
@media (max-width: 760px) {
  h2 {
    font-size: 30px;
    margin-bottom: 30px;
    border-bottom: 5px #f9d902 dashed;
  }
  h2 img {
    width: 30px;
  }
  article {
    margin: -40px auto 50px auto;
    width: 100%;
  }
  .in {
    width: 100%;
  }
  section {
    width: 100%;
    padding: 0;
    margin: 0 auto 0 auto;
  }
  section p.ttl {
    font-size: 95%;
    letter-spacing: 0.1em;
    margin-bottom: 30px;
  }
  .imgbx {
    margin: -40px auto 60px auto;
  }
  .imgbx.nosp {
    margin: 50px auto 60px auto;
  }
}
@media (max-width: 760px) and (max-width: 760px) {
  .imgbx.nosp {
    margin: 6vw auto 16vw auto;
  }
}
@media (max-width: 760px) {
  .caution {
    font-size: 15px;
    height: 60px;
    margin: 10px auto 30px auto;
    width: 94%;
  }
  .caution:before {
    width: 67px;
    height: 60px;
    top: 5px;
  }
  .caution span {
    left: 80px;
  }
  .entry {
    background: url("../images/entry_bg_sp_new.png") no-repeat top;
    background-size: contain;
    position: relative;
    height: 290px;
    margin-bottom: 60px;
  }
  .entry a {
    position: absolute;
  }
  .entry a.bt01 {
    width: 37%;
    bottom: 79px;
    left: 50px;
  }
}
@media (max-width: 760px) and (max-width: 760px) {
  .entry a.bt01 {
    bottom: 9.5vw;
    left: 13.5vw;
  }
}
@media (max-width: 760px) {
  .entry a.bt02 {
    width: 45%;
    bottom: 72px;
    right: 10px;
  }
}
@media (max-width: 760px) and (max-width: 760px) {
  .entry a.bt02 {
    bottom: 8vw;
    right: 2vw;
  }
}
@media (max-width: 760px) {
  .entry.msp {
    margin: -80px 0 0 0;
  }
}
@media (max-width: 760px) and (max-width: 760px) {
  .entry.msp {
    margin: -19vw 0 8vw 0;
  }
}
@media (max-width: 760px) {
  .entry.ssp {
    margin: -15px 0 40px 0;
  }
}
@media (max-width: 760px) and (max-width: 760px) {
  .entry.ssp {
    margin: 0 0 20vw 0;
  }
}
@media (max-width: 760px) {
  .entry.space {
    margin: -40px 0 0 0;
  }
}
@media (max-width: 760px) and (max-width: 760px) {
  .entry.space {
    margin: -10vw 0 8vw 0;
  }
}
@media (max-width: 760px) and (max-width: 760px) {
  .entry {
    height: 66vw;
  }
}
@media (max-width: 760px) {
  .point .box {
    display: block;
  }
  .point .box img {
    width: 80%;
    margin: 0 auto;
  }
  .point .box h3 {
    font-size: 22px;
    margin-bottom: 15px;
  }
  .point .box h3 img {
    width: 33px;
    margin: 0 10px 0 0;
  }
  .point .box h3 img.s {
    width: 6.5%;
  }
  .point .box .tx {
    width: 90%;
    margin: 0 auto;
    padding: 0 0 0 0;
  }
  .point .box:nth-child(odd) h3 img {
    margin: 0 10px 0 0;
  }
  .point .box:nth-child(even) h3 {
    flex-flow: row-reverse nowrap;
    align-items: flex-start;
  }
  .point .box:nth-child(even) h3 img {
    margin: 0 0 0 10px;
  }
  .point .box:nth-child(even) .tx span {
    text-align: right;
  }
  .ex {
    padding: 45px 0 60px 0;
  }
  .ex .in {
    width: 90%;
  }
  .ex .in .box {
    margin: 0 auto 20px auto;
  }
  .ex .in .box .imbx {
    height: 170px;
  }
  .ex .in .box .imbx h3 {
    font-size: 26px;
    margin: -110px auto 0 auto;
    font-weight: bold;
  }
  .ex .in .box .imbx h3.ssp {
    margin: -110px auto 0 auto;
  }
  .ex .in .box .imbx h3.sssp {
    margin: -110px auto 0 auto;
  }
  .ex .in .box .tx {
    height: auto;
    padding: 20px;
    padding: 15px 15px 5px 15px;
  }
  .ex .in .box .tx b {
    margin-bottom: 15px;
    font-size: 120%;
    line-height: 1.5em;
  }
  .ex .in .box .tx b span.active {
    background: url(../images/bt_minus_sp.png) no-repeat;
    background-size: 31px 31px;
  }
  .ex .in .box .tx p {
    display: none;
  }
  .ex .in .box .tx span {
    display: block;
    position: absolute;
    right: 0;
    top: 0;
    width: 31px;
    height: 31px;
    margin-right: 5px;
    background: url(../images/bt_plus.png) no-repeat;
    background-size: 31px 31px;
  }
  .area {
    margin: 0 auto 40px auto;
  }
  .area img {
    width: 90%;
  }
  .area p {
    margin-bottom: 20px;
  }
  .area table {
    margin: 20px auto 0 auto;
  }
  .area table th,
  .area table td {
    width: 90%;
    padding: 5%;
  }
  .faq {
    margin-bottom: 40px;
  }
  .faq dl {
    margin-bottom: 14px;
  }
  .faq dl dt {
    padding: 15px 25px 0px 25px;
    font-size: 110%;
    border: 3px solid #d6d7d7;
    border-radius: 20px;
    -webkit-border-radius: 20px;
    -moz-border-radius: 20px;
  }
  .faq dl dt p {
    margin-left: 30px;
    padding: 0 20px 0 0;
  }
  .faq dl dt p span {
    right: -20px;
    top: 16%;
    width: 31px;
    height: 31px;
    margin-right: 5px;
    background-size: 31px 31px;
  }
  .faq dl dt p:before {
    content: "";
    display: inline-block;
    background-image: url(../images/faq_mark.png);
    background-size: contain;
    vertical-align: middle;
    position: absolute;
    top: 0;
    left: -40px;
    width: 32px;
    height: 32px;
  }
  .faq dl dt p.active span {
    background-size: 31px 31px;
  }
  .faq dl dt.ssp p:before {
    top: 0;
  }
  .faq dl dt.ssp span {
    top: 0;
  }
  .faq dl dd {
    padding: 15px 15px 5px 15px;
  }
  .faq dl:nth-child(4) dt p span {
    top: 37%;
  }
}
@media (max-width: 760px) {
  /**/
  /* tableスマホ */
  table {
    border-left: none;
    width: 100%;
  }
  table td,
  table th {
    width: 100%;
    border-right: none;
    display: block;
  }
  table th {
    background-color: #f7f7f7;
    border-bottom: none;
    padding: 15px 0;
  }
  table td {
    background-color: #ffffff;
    padding: 20px 0;
    text-align: center;
  }
  .bt_contact {
    width: 80%;
    margin: 0 auto 40px auto;
  }
  .bt_contact img {
    margin-bottom: 10px;
  }
  .option img {
    margin: 0 auto;
  }
  .worry {
    padding: 30px 0 0 0;
    margin-bottom: 70px;
  }
  .info {
    margin-bottom: 40px;
    background: url(../images/bg01_sp.png) no-repeat top center;
    background-size: cover;
    padding: 10px 0 20px 0;
  }
  .info h1 {
    margin: -60px 0 70px 0;
  }
  .info h1 b {
    font-size: 36px;
  }
  .info img.s {
    width: 250px;
  }
  .info p {
    font-size: 16px;
    padding: 0 20px;
    line-height: 1.7em;
  }
  .info p b {
    font-size: 18px;
    text-align: center;
  }
  .info b {
    font-size: 20px;
  }
  .info i {
    margin-left: 20px;
  }
  .info .read {
    text-align: left;
    padding: 0 16px 0 24px;
  }
}
/*footer*/
footer {
  background: url(../images/grid_green.png) repeat;
}
footer .in {
  background: url(../images/footline.png) no-repeat top;
}
footer .in p {
  color: #FFFFFF;
  padding: 100px 0 70px 0;
  text-align: center;
  font-size: 14px;
  margin-bottom: 0;
}

.footnav_pc {
  position: fixed;
  bottom: 0;
  left: 0;
  z-index: 9;
  padding: 15px 0 45px 0;
  display: none;
  overflow: hidden;
  background-color: rgba(25, 163, 75, 0.8);
  width: 100%;
}
.footnav_pc div {
  justify-content: center;
  display: flex;
  align-items: end;
}
.footnav_pc div a {
  display: inline-block;
  margin-left: 10px;
}
.footnav_pc div img {
  margin-left: 55px;
}

#pagetop {
  position: fixed;
  right: 60px;
  bottom: 100px;
  z-index: 9999;
  background: url(../images/pagetop.png) no-repeat top;
  background-size: 90px 169px;
  width: 90px;
  height: 169px;
  cursor: pointer;
}

/* footerスマホ */
@media (max-width: 760px) {
  #pagetop {
    right: 10px;
    bottom: 96px;
    background-size: 58px 109px;
    width: 58px;
    height: 109px;
  }
  footer {
    background: url(../images/grid_green_sp.png) repeat;
  }
  footer .in {
    background: url(../images/footline_sp.png) no-repeat top;
    background-size: contain;
  }
  footer .in p {
    padding: 50px 0 35px 0;
  }
  .footnav {
    text-align: center;
    position: fixed;
    bottom: 0;
    left: 0;
    display: block;
    padding: 15px 0;
    z-index: 9999999;
    overflow: hidden;
    background-color: rgba(25, 163, 75, 0.8);
  }
  .footnav a {
    display: inline-block;
    width: 48%;
    margin-left: 5px;
  }
  .footnav a:first-child {
    width: 45%;
  }
  .footnav_pc {
    display: none !important;
  }
}
.line label {
  display: inline-block;
  margin-left: 18px;
  font-size: 20px;
}
.line label input[type=checkbox] {
  width: 20px;
  height: 20px;
  vertical-align: top;
}

/*新施工事例*/
.soudan .in {
  text-align: left;
}
.soudan .box {
  position: relative;
  min-height: 200px;
  width: 990px;
  margin: 30px auto 70px auto;
  box-sizing: border-box;
  border: 20px solid #fbda03;
  border-radius: 14px;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
}
.soudan .box h3 {
  position: absolute;
  top: -50px;
  left: 20px;
  width: 394px;
}
.soudan .box h3 img {
  width: 100%;
}
.soudan .box p {
  font-size: 40px;
  padding: 50px 0 20px 108px;
  line-height: 1.3em;
}
.soudan .box p b {
  color: #02ac4d;
  display: block;
}
.soudan .box .illust {
  position: absolute;
  bottom: 0;
  right: 30px;
  width: 223px;
}
.soudan .box .illust2 {
  position: absolute;
  bottom: 0;
  right: 30px;
  width: 271px;
}
.soudan .box2 {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  width: 990px;
  margin: 0 auto 55px auto;
}
.soudan .box2 .bx {
  width: 45%;
  font-size: 30px;
}
.soudan .box2 .bx img {
  width: 100%;
}
.soudan .box2 .bx b {
  color: #3e3f3f;
}
.soudan .box2 .bx em {
  position: relative;
  display: inline-block;
  padding: 15px 30px;
  text-align: center;
  color: #FFFFFF;
  background-color: #3e3f3f;
  margin: -20px 20px 0 0;
}
.soudan .box2 .bx em:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  transform: translateX(-50%);
  border-top: 15px solid #3e3f3f;
  border-right: 15px solid transparent;
  border-left: 15px solid transparent;
}
.soudan .box2 .bx.after b {
  color: #02ac4d;
}
.soudan .box2 .bx.after em {
  background-color: #02ac4d;
}
.soudan .box2 .bx.after em:before {
  border-top: 15px solid #02ac4d;
}
.soudan .slider {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.soudan .slider li {
  width: 306px;
  padding: 30px 0 0 0;
  position: relative;
  margin: 0 15px;
}
.soudan .slider li img {
  width: 100%;
}
.soudan .slider em {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  padding: 10px 20px;
  font-size: 22px;
  background-color: #02ac4d;
  color: #FFFFFF;
}
.soudan .slider.slick-slider .slick-track,
.soudan .slider .slick-slider .slick-list {
  background: #fff;
}
.soudan .slider.slick-initialized .slick-slide {
  opacity: 0.6;
  /* 両サイドの画像を透過 */
}
.soudan .slider.slick-initialized .slick-slide.slick-active {
  opacity: 1;
  /* センター画像を非透過 */
}
.soudan .slider .slick-prev::before {
  content: "";
  display: inline-block;
  width: 45px;
  height: 44px;
  background: url(../images/arrow.png) no-repeat top;
  background-size: 45px 44px;
  transform: scale(-1, 1);
}
.soudan .slider .slick-next::before {
  content: "";
  display: inline-block;
  width: 45px;
  height: 44px;
  background: url(../images/arrow.png) no-repeat top;
  background-size: 45px 44px;
}
.soudan .slider .slick-prev {
  left: 85px;
  z-index: 999;
}
.soudan .slider .slick-next {
  right: 110px;
  z-index: 999;
}
.soudan {
  /*slider*/
}
.soudan .btbox {
  margin-bottom: 70px;
  width: 990px;
  margin: 0 auto 140px auto;
}
.soudan .btbox b {
  color: #02ac4d;
}
.soudan .btbox .col,
.soudan .btbox i {
  color: #fe8402;
}
.soudan .btbox i {
  font-size: 120%;
}
.soudan .btbox p,
.soudan .btbox ul {
  margin-bottom: 30px;
}
.soudan .btbox p.c {
  text-align: center;
}
.soudan .btbox p.c img {
  width: 389px;
}
.soudan .btbox .bt {
  display: block;
  text-align: center;
  padding: 30px 0 40px 0;
  color: #02ac4d;
  font-size: 40px;
  background: #fbda03;
  font-weight: bold;
  cursor: pointer;
  border-radius: 14px;
  -webkit-border-radius: 14px;
  -moz-border-radius: 14px;
  text-shadow: 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff, 0 0 6px #fff;
}
.soudan .btbox .bt:hover {
  text-decoration: none;
}
.soudan .btbox .bx {
  border-bottom: 10px solid #fbda03;
  border-right: 10px solid #fbda03;
  border-left: 10px solid #fbda03;
  padding: 44px;
  background: url("../images/bg_grid.png") repeat;
  margin-top: -10px;
}
.soudan .btbox ul li {
  list-style: disc;
  margin-left: 1em;
}
.soudan .btbox label {
  position: relative;
}
.soudan .btbox label:after {
  content: "";
  position: absolute;
  top: 26px;
  right: 60px;
  display: block;
  width: 45px;
  height: 44px;
  background: url(../images/arrow.png) no-repeat top;
  background-size: 45px 44px;
  transform: rotate(90deg);
}
.soudan .btbox input:checked ~ label:after {
  content: "";
  transform: rotate(-90deg);
}
.soudan .btbox input {
  display: none;
}
.soudan .btbox .bx {
  display: none;
}
.soudan .btbox input:checked ~ .bx {
  display: block;
}
.soudan {
  /*btbox*/
}

/*soudan*/
@media screen and (max-width: 1024px) {
  .soudan .box,
  .soudan .box2,
  .soudan .btbox {
    width: 90%;
  }
  .soudan .box {
    min-height: 26.316vw;
    margin: 1vw auto 7vw auto;
    border: 10px solid #fbda03;
  }
  .soudan .box h3 {
    top: -5vw;
    left: 2.632vw;
    width: 40vw;
  }
  .soudan .box p {
    font-size: 4.2vw;
    padding: 6.579vw 0 2.632vw 5vw;
    line-height: 1.3em;
  }
  .soudan .box .illust {
    position: absolute;
    bottom: 0;
    right: 3.947vw;
    width: 28vw;
  }
  .soudan .box .illust2 {
    position: absolute;
    bottom: 0;
    right: 2.5vw;
    width: 33vw;
  }
  .soudan .box2 {
    margin: 0 auto 7vw auto;
  }
  .soudan .box2 .bx {
    width: 47%;
    font-size: 3.5vw;
  }
  .soudan .box2 .bx em {
    display: block;
    padding: 1.974vw 3.947vw;
    margin: 0 0 3vw 0;
  }
  .soudan .box2 .bx em:before {
    content: "";
    position: absolute;
    top: 98%;
    left: 50%;
    transform: translateX(-50%);
    border-top: 10px solid #3e3f3f;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
  }
  .soudan .box2 .bx.after em:before {
    border-top: 10px solid #02ac4d;
    border-right: 10px solid transparent;
    border-left: 10px solid transparent;
  }
  .soudan .slick-dotted.slick-slider {
    margin-bottom: 7vw;
  }
  .soudan .slider li {
    width: 40.263vw;
    padding: 3.947vw 0 0 0;
    margin: 0 3vw;
  }
  .soudan .slider em {
    position: absolute;
    top: 0;
    left: 0;
    display: inline-block;
    padding: 1.316vw 2.632vw;
    font-size: 2.895vw;
    background-color: #02ac4d;
    color: #FFFFFF;
  }
  .soudan .slider.slick-slider .slick-track,
  .soudan .slider .slick-slider .slick-list {
    background: #fff;
  }
  .soudan .slider.slick-initialized .slick-slide {
    opacity: 0.6;
    /* 両サイドの画像を透過 */
  }
  .soudan .slider.slick-initialized .slick-slide.slick-active {
    opacity: 1;
    /* センター画像を非透過 */
  }
  .soudan .slider .slick-prev::before {
    content: "";
    width: 8.921vw;
    height: 8.789vw;
    background-size: 8.921vw 8.789vw;
  }
  .soudan .slider .slick-next::before {
    content: "";
    width: 8.921vw;
    height: 8.789vw;
    background-size: 8.921vw 8.789vw;
  }
  .soudan .slider .slick-prev {
    width: 8.921vw;
    height: 8.789vw;
    left: 16.5vw;
  }
  .soudan .slider .slick-next {
    width: 8.921vw;
    height: 8.789vw;
    right: 17vw;
  }
  .soudan {
    /*slider*/
  }
  .soudan .btbox {
    margin-bottom: 9.211vw;
    margin: 0 auto 20vw auto;
  }
  .soudan .btbox.short {
    margin: 0 auto 14vw auto;
  }
  .soudan .btbox i {
    font-size: 110%;
  }
  .soudan .btbox b {
    font-size: 110%;
  }
  .soudan .btbox p,
  .soudan .btbox ul {
    margin-bottom: 3.947vw;
  }
  .soudan .btbox ul li {
    margin-left: 1.5em;
    text-indent: 0;
  }
  .soudan .btbox p.c img {
    width: 45vw;
  }
  .soudan .btbox .bt {
    padding: 3.947vw 0 5.263vw 0;
    font-size: 4.5vw;
    border-radius: 1.842vw;
    -webkit-border-radius: 1.842vw;
    -moz-border-radius: 1.842vw;
    text-shadow: 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff, 0 0 3px #fff;
  }
  .soudan .btbox .bt:hover {
    text-decoration: none;
  }
  .soudan .btbox .bx {
    border-bottom: 6px solid #fbda03;
    border-right: 6px solid #fbda03;
    border-left: 6px solid #fbda03;
    padding: 5.789vw;
    margin-top: -1.316vw;
  }
  .soudan .btbox label:after {
    content: "";
    top: 4vw;
    right: 6vw;
    width: 5.921vw;
    height: 5.789vw;
    background-size: 5.921vw 5.789vw;
  }
  .soudan {
    /*btbox*/
  }
  /*soudan*/
}
/*20210520更新*/
.area2 {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  align-items: flex-start;
  padding: 60px 0 60px 0;
}
.area2 img {
  margin-right: 50px;
}
.area2 .bx {
  padding: 50px 0 0 0;
}
.area2 h2 {
  margin-bottom: 40px;
}

.entry.flat {
  z-index: 1;
}
.entry.flat a {
  bottom: 96px;
  right: 39px;
}

@media screen and (max-width: 1024px) {
  .area2 {
    padding: 4vw 0 4vw 0;
  }
  .area2 img {
    margin-right: 5vw;
    width: 40%;
  }
  .area2 .bx {
    padding: 6vw 0 0 0;
    width: 40%;
  }
  .area2 h2 {
    margin-bottom: 4vw;
  }
  .entry.flat {
    background: url(../images/entry_bg_sp_new.png) no-repeat top;
    background-size: contain;
    position: relative;
    height: 66vw;
    margin-bottom: 2vw;
  }
  .entry.flat a {
    bottom: auto;
    right: auto;
  }
  .entry.flat a.bt01 {
    bottom: 9.5vw;
    left: 13.5vw;
  }
  .entry.flat a.bt02 {
    bottom: 8vw;
    right: 2vw;
  }
}
.entry {
  background: url(../images/entry_bg_new.png) no-repeat top;
  position: relative;
  height: 799px;
  margin-bottom: 60px;
}
@media screen and (max-width: 1024px) {
  .entry {
    background: url(../images/entry_bg_sp_new.png) no-repeat top;
    background-size: cover;
    height: 66vw;
    margin-bottom: 60px;
  }
}

@media screen and (min-width: 376px) and (max-width: 429px) {
  article {
    margin-top: -48px;
  }
  .entry {
    background: url(../images/entry_bg_sp_new.png) no-repeat top;
    background-size: contain;
    height: 66vw;
    margin-bottom: 60px;
  }
}
@media screen and (min-width: 430px) and (max-width: 620px) {
  .entry {
    background: url(../images/entry_bg_sp_new.png) no-repeat top;
    background-size: contain;
    height: 66vw;
    margin-bottom: 60px;
  }
}
@media screen and (min-width: 621px) and (max-width: 760px) {
  .entry {
    background: url(../images/entry_bg_sp_new.png) no-repeat top;
    background-size: contain;
    height: 66vw;
    margin-bottom: 60px;
  }
}
@media screen and (min-width: 761px) and (max-width: 1024px) {
  body {
    font-size: 18px;
  }
  h2 img {
    width: 50px;
  }
  .imgbx {
    margin: -60px auto 90px auto;
  }
  header img,
  .imgbx img,
  img.tab {
    width: 100%;
  }
  header p {
    width: 390px;
  }
  header p a {
    text-align: right;
  }
  header p a img {
    width: 85%;
  }
  header p img {
    width: 50%;
  }
  header,
  article,
  footer,
  .in {
    width: 100% !important;
  }
  article {
    margin-top: -70px;
  }
  .point .box {
    width: 98%;
    margin: 0 auto 40px auto;
  }
  .entry {
    background-size: contain;
    height: 66vw;
  }
  .entry a {
    bottom: 8.5vw;
    right: auto;
  }
  .entry a img {
    width: 40vw;
  }
  .entry a.bt01 {
    left: 13.5vw;
  }
  .entry a.bt02 {
    right: 2vw;
  }
  .entry.msp {
    margin: -40px 0 20px 0;
  }
  h2 {
    font-size: 60px;
  }
  .caution {
    font-size: 26px;
  }
  .point .box {
    align-items: flex-start;
  }
  .point .box img {
    width: 53%;
  }
  .point .box h3 {
    font-size: 26px;
    margin-bottom: 20px;
  }
  .point .box h3 img {
    width: 40px;
  }
  .point .box h3 img.s {
    width: 25px;
  }
  .point .box .tx {
    padding: 10px 0 0 0;
  }
  .ex {
    padding: 70px 0 60px 0;
  }
  .ex .in .box {
    width: 48%;
  }
  .ex .in .box img {
    max-width: 100%;
  }
  .ex .in .box .imbx {
    height: 201px;
  }
  .ex .in .box .imbx h3 {
    font-size: 40px;
    margin: -140px auto 0 auto;
  }
  .ex .in .box .imbx h3.ssp, .ex .in .box .imbx h3.sssp {
    margin: -120px auto 0 auto;
  }
  .faq dl {
    margin-bottom: 30px;
  }
  .faq dl dt {
    padding: 20px 30px 15px 30px;
  }
  .faq dl dt p {
    padding-right: 60px;
    font-size: 20px;
  }
  .faq dl dt.ssp {
    top: 20px;
  }
}
.commitment .btbox label::after {
  background: url(../images/click-p.png) no-repeat top;
  transform: rotate(0deg);
  background-size: 100%;
  width: 64px;
  height: 64px;
}

.commitment ul li .btbox label:after {
  right: 23px;
}

.commitment .btbox input:checked ~ label:after {
  transform: rotate(0deg);
}

@media screen and (max-width: 1024px) {
  .commitment .box ul li .btbox label:after {
    background-size: 100%;
    width: 12.5vw;
    height: 12.5vw;
    right: 5vw;
    top: 5vw;
  }
  .commitment .box ul li .btbox .bt {
    text-align: left;
    padding: 3.947vw 0 5.263vw 10vw;
  }
  .commitment .box ul li:nth-child(4) .btbox label:after {
    top: 8vw;
  }
}
/*  ご利用の流れ202603追加*/
.flow {
  display: flex;
  padding: 80px 0;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 30px;
  background: #D3F1E4;
  position: relative;
  background-image: url("../images/Subtract.jpg");
  background-repeat: repeat-x;
  background-position: bottom;
  background-size: auto 20px;
  margin-top: -6vw;
}
.flow h2 {
  border-bottom: 5px #fff dashed;
}
.flow ul {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 60px;
}
.flow ul li {
  width: 90%;
  margin: 0 auto;
  position: relative;
}
.flow ul li.flow-li::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 50%;
  border-style: solid;
  border-width: 26px 26px 0 26px;
  border-color: #fff transparent transparent;
  translate: -50% 100%;
}
.flow ul li img {
  width: 100%;
  height: auto;
}
.flow ul li .w-box {
  display: flex;
  padding: 24px 20px;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  gap: 12px;
  background: #fff;
}
.flow ul li .w-box h3 {
  color: #02B757;
  font-size: 24px;
  font-weight: 700;
  line-height: 100%;
}
.flow ul li .w-box p {
  color: #464547;
  text-align: justify;
  font-size: 15px;
  font-weight: 400;
  line-height: 170%;
}

@media screen and (min-width: 768px) {
  .flow {
    padding: 100px 0 70px 0;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 40px;
    margin-top: -6vw;
  }
  .flow h2 {
    border-bottom: 10px #fff dashed;
  }
  .flow ul {
    gap: 80px;
  }
  .flow ul li {
    display: flex;
    flex-direction: row-reverse;
  }
  .flow ul li.flow-li::after {
    border-width: 38px 36.5px 0 36.5px;
  }
  .flow ul li.kokomade img {
    width: 100%;
  }
  .flow ul li img {
    width: 38%;
  }
  .flow ul li .w-box {
    padding: 0 32px 0 40px;
    gap: 24px;
  }
  .flow ul li .w-box h3 {
    font-size: 26px;
  }
  .flow ul li .w-box p {
    font-size: 18px;
  }
}
@media screen and (min-width: 1024px) {
  .flow {
    margin-top: -105px;
  }
  .flow ul li .w-box h3 {
    font-size: 40px;
  }
  .flow ul li .w-box p {
    font-size: 22px;
  }
}/*# sourceMappingURL=plus.css.map */