@charset "UTF-8";

body { /*  font-family: 'Noto Sans Japanese', 'Open Sans', sans-serif;*/ }

button, input, select, textarea {
  font-family: inherit;
}

/* body
--------------------------------------------------------- */
body {
  /*background-color: #333;*/
  color: #333;
}

/* button（ボタン）
--------------------------------------------------------- */
.lp-c-button {
  background-color: #339900;
  color: #FFF;
}

a.btn-social-twitter {
    color: #FFF;
    border-radius: 7px;
    display: inline-block;
    width: 85%;
    max-width: 500px;
    height: 53px;
    text-align: center;
    font-size: 25px;
    background: #1da1f3;
    overflow: hidden;
    text-decoration: none;
    box-shadow: 0px 6px 0px 0px rgba(40, 40, 40, 0.1);
    border-radius: 20px;
    display: flex;
    margin: 0 auto;
    min-width: 300px;
}

a.btn-social-twitter span, a.lp-square-button span {
    font-size: 16px;
    margin: auto;
    position: relative;
}


a.lp-square-button{
    width: 95%;
    max-width: 500px;
    height: 53px;
    text-align: center;
    font-size: 25px;
    background: #d11026;
    color: #fff;
    overflow: hidden;
    text-decoration: none;
    box-shadow: 0px 6px 0px 0px rgba(40, 40, 40, 0.1);
    border-radius: 7px;
    display: flex;
    margin: 0 auto;
}

a.lp-square-button span:before,
a.lp-square-button-line span:before {
    display: block;
    position: absolute;
    content: "";
    width: 20px;
    height: 20px;
    border-radius: 20px;
    border: 2px solid #fff;
    top: -2px;
    bottom: 0;
    right: -30px;
    margin: auto;
    z-index: 10;

    /*width: 27px;
    height: 27px;
    border-radius: 27px;
    border: 2px solid #fff;
    right: -35px;*/
}

a.lp-square-button span:after,
a.lp-square-button-line span:after {
    display: block;
    position: absolute;
    content: "";
    width: 6px;
    height: 6px;
    border-top: 2px solid #fff;
    border-right: 2px solid #fff;
    top: -2px;
    bottom: 0;
    right: -22px;
    margin: auto;
    transform: rotate(45deg);
    z-index: 10;
}

a.lp-square-button-line{
    width: 240px;
    max-width: 500px;
    height: auto;
    text-align: center;
    font-size: 25px;
    background: #fff;
    overflow: hidden;
    text-decoration: none;
    border: 1px solid #333;
    border-radius: 7px;
    display: flex;
    margin: 10px auto 5px;
}

a.lp-square-button-line span{
    font-size: 16px;
    letter-spacing: 1px;
    margin: auto;
    position: relative;
}
a.lp-square-button-line span:after {
    border-top: 2px solid #333;
    border-right: 2px solid #333;

}
a.lp-square-button-line span:before {
    border: 1px solid #333;
}



.lp-sec-sky02 .lp-button-cm {
  background: rgba(132,132,132,0.7);
  color: #505050;
  border: 2px solid #565656;
  border-radius: 100px;
  display: inline-block;
}

.lp-sec-sky02 .lp-button-bll {
  background: #d11026;
  /*background: rgba(255,255,255,0.2);*/
  color: #fff;
  border: 2px solid #d11026;
  box-shadow: 0px 6px 0px 0px rgba(0, 0, 0, 0.7);
  border-radius: 100px;
  display: inline-block;
}


/* 囲み文字
--------------------------------------------------------- */
.lp-block-corners{
  background-color: #d11026;
  padding:10px; 
  border-radius: 10px;
  margin: 10px auto 35px;
  min-height: 90px;
  color: #fff;
  display: flex;
}

.lp-block-corners.rCorners{
  background-color: #739ec5;
  color: #fff;
}

.lp-block-step{
  background-color: #fff;
  padding:10px; 
  border-radius: 10px;
  margin: 10px auto 55px;
  min-height: 190px;
  position: relative;
  width: 95%;
  display: flex;
}

.lp-block-step.step-last{ margin-bottom: 15px; }

.lp-block-corners .lp-block-corners-valine,
.lp-block-step .lp-block-step-valine{
  margin: auto;
}

.lp-block-step .lp-block-step-cir--red,
.lp-block-step .lp-block-step-cir--gry{
  -webkit-border-radius: 50%;
    -ms-border-radius: 50%;
    border-radius: 50%;
    display: -webkit-box;
    display: flex;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-align-items: center;
    align-items: center;
    color: #fff;
    font-size: 2rem;
    font-weight: 700;
    line-height: 1.26;
    height: 4rem;
    position: absolute;
    width: 4rem;
    left: -1rem;
    top: -2rem;
    background-color: #d11026;
}

.lp-block-step .lp-block-step-cir--gry{
    background-color: #739ec5; 
}

@media only screen and (min-width: 769px){
  .lp-block-step .lp-block-step-cir--red,
  .lp-block-step .lp-block-step-cir--gry {
      font-size: 2rem;
      height: 4rem;
      width: 4rem;
      top: -1.5rem;
  }
}



/* tagNavi
--------------------------------------------------------- */
#tagNavi {
  position: fixed;
  top: 0;
  right: 0;
  -webkit-transition: bottom 0.5s ease-out;
  -moz-transition: bottom 0.5s ease-out;
  -ms-transition: bottom 0.5s ease-out;
  transition: bottom 0.5s ease-out;
  z-index: 10000;
}

@media screen and (max-width: 560px) {
  #tagNavi {display: none;}
}


/* header
--------------------------------------------------------- */
.bottomNavi {
    position: fixed;
    bottom: 0;
    right: 0;
    left: 0;
    background-color: #fff;
    box-shadow: 0px -2px 5px 0px rgba(4, 0, 0, 0.25);
    -webkit-transition: bottom 0.5s ease-out;
    -moz-transition: bottom 0.5s ease-out;
    -ms-transition: bottom 0.5s ease-out;
    transition: bottom 0.5s ease-out;
    z-index: 1200;
}


/* band
   bandArrow
--------------------------------------------------------- */
.lp-sec-band > .lp-block {
  background-color: #0048A8;
  color: #fff;
}

.lp-sec-band--arrow > .lp-block::after {
  color: #0048A8;
}

/* BigCenter
   BigLeft
   BigRight
   BigText
--------------------------------------------------------- */
.lp-sec-big {
  background-color: #fff;
  background-image: url(../img/header_cp_pc.jpg);
}

.lp-sec-sky{ padding: 5vw; }

.lp-sec-sky,.lp-sec-sky02 {
  background-color: #fff;
  background-image: url(../img/bg_sky.jpg);
}

.lp-sec-big--center > .lp-block > .lp-title {
  color: #fff;
}

.lp-sec-big--center > .lp-block > .lp-text {
  color: #fff;
}

.lp-sec-big--left > .lp-block > .lp-title {
  color: #333;
}

.lp-sec-big--left > .lp-block > .lp-text {
  color: #333;
}

.lp-sec-big--right > .lp-block > .lp-title {
  color: #fff;
}

.lp-sec-big--right > .lp-block > .lp-text {
  color: #333;
}

.lp-sec-big--text > .lp-block > .lp-title {
  color: #333;
}

.lp-sec-big--text > .lp-block > .lp-text {
  color: #333;
}

.lp-sec-big--center .lp-c-button {
  background: rgba(255,255,255,0.2);
  color: #fff;
  border: 2px solid #fff;
}

  .lp-sec-sky02 #FtCopy{
    padding: 25px 0;
    font-size: 10px;
    text-align: center;
  }




/* ImageCenter
   ImageLeft
   ImageRight
--------------------------------------------------------- */
.lp-sec-image {
  background-color: #fff;
}

.lp-sec-image > .lp-block > .lp-title {
  color: #333;
}

.lp-sec-image > .lp-block > .lp-text {
  color: #333;
}

.lp-sec-image--center > .lp-block > .lp-item .lp-item__contents > .lp-title {
  color: #333;
}

.lp-sec-image--center > .lp-block > .lp-item .lp-item__contents > .lp-text {
  color: #333;
}

.lp-sec-image--left > .lp-block > .lp-item .lp-item__contents > .lp-title {
  color: #333;
}

.lp-sec-image--left > .lp-block > .lp-item .lp-item__contents > .lp-text {
  color: #333;
}

.lp-sec-image--right > .lp-block > .lp-item .lp-item__contents > .lp-title {
  color: #333;
}

.lp-sec-image--right > .lp-block > .lp-item .lp-item__contents > .lp-text {
  color: #333;
}

/* FullImageCenter
   FullImageLeft
   FullImageRight
--------------------------------------------------------- */
.lp-sec-fullimage {
  background-color: #eee;
}

.lp-sec-fullimage--center > .lp-block > .lp-item .lp-item__contents > .lp-title {
  color: #333;
}

.lp-sec-fullimage--center > .lp-block > .lp-item .lp-item__contents > .lp-text {
  color: #333;
}

.lp-sec-fullimage--left > .lp-block > .lp-item .lp-item__contents > .lp-title {
  color: #333;
}

.lp-sec-fullimage--left > .lp-block > .lp-item .lp-item__contents > .lp-text {
  color: #333;
}

.lp-sec-fullimage--right > .lp-block > .lp-item .lp-item__contents > .lp-title {
  color: #333;
}

.lp-sec-fullimage--right > .lp-block > .lp-item .lp-item__contents > .lp-text {
  color: #333;
}

/* Inline2
   Inline2Arrow
   Inline3
   Inline3Arrow
   Inline4
   Inline4Arrow
   Inline5
   Inline5Arrow
   Inline2Circle
   Inline2CircleArrow
   Inline3Circle
   Inline3CircleArrow
   Inline4Circle
   Inline4CircleArrow
   Inline5Circle
   Inline5CircleArrow
--------------------------------------------------------- */
.lp-sec-inline {
  background-color: #eee;
}

.lp-sec-inline > .lp-block > .lp-title {
  color: #333;
}

.lp-sec-inline > .lp-block > .lp-text {
  color: #333;
}

.lp-sec-inline > .lp-block > .lp-list .lp-list__item > .lp-item .lp-item__contents > .lp-title {
  color: #333;
}

.lp-sec-inline > .lp-block > .lp-list .lp-list__item > .lp-item .lp-item__contents > .lp-text {
  color: #333;
}

.lp-sec-inline--arrow > .lp-block > .lp-list .lp-list__item::before {
  color: #333;
}

/* List
--------------------------------------------------------- */
.lp-sec-list {
  background-color: #fff;
}

.lp-sec-list > .lp-block > .lp-title {
  color: #333;
}

.lp-sec-list > .lp-block > .lp-text {
  color: #333;
}

.lp-sec-list > .lp-block > .lp-list > .lp-item {
  color: #333;
}

.lp-sec-list > .lp-block > .lp-list > .lp-item::before {
  color: #333;
}

/* footer
--------------------------------------------------------- */
.lp-sec-footer {
  background-color: #333;
}

.lp-sec-footer > .lp-block .lp-copyright {
  color: #fff;
  font-size: 16px;
}

@media screen and (max-width: 560px) {
  .lp-sec-footer > .lp-block .lp-copyright {
    font-size: 12px;
  }
}
