header{
    margin: 0px 0px 0px 0px;
    background: linear-gradient(90deg,#0450a3 0%,#0450a3 40%,#64abdf 40%,#64abdf 100%);
    border-bottom: solid 5px #aaaaaa;
}

.headerBox{
    margin: 0px auto;
    max-width: 527px;
    display:flex;
}

.headerBox h1{
    width: 314px;
}

.headerBox p.tel{
    width: 213px;
}



.key{
    background: url("../images/lp/mb/key_bg.png") no-repeat center center;
    
}



@media screen and (min-width: 1200px) {
    .key{
        background-size: 100% auto;
    }
    
}

@media screen and (max-width: 1200px) {
    .key{
        background-size: auto 400px;
    }
    
}

@media screen and (max-width: 560px) {
    .key{
        background:none;
    }
    
}



.key p{
    margin: 0px auto;
    padding:  9px 0px 0px 0px;
    max-width: 985px;
}



.key p img{
    width: 100%;
}

.name{
    background-color: #0450a3;
}

.name p{
    margin: 0px auto;
    padding: 18px 0px 18px 0px;
    max-width: 401px;
}

.name p img{
    width: 100%;
}


.contents01{
    background: url("../images/lp/arrow_bg.png") no-repeat center top;
    background-size: 72px auto;
}

.contents01 .pic01{
    margin: 0px auto;
    padding: 38px 0px 0px 0px;
    max-width: 1002px;
}

.contents01 .pic02{
    margin: 0px auto 17px;
    padding: 0px 0px 0px 0px;
    max-width: 776px;
}

.contents01 .pic03{
    margin: 0px auto 24px;
    padding: 0px 0px 0px 0px;
    max-width: 452px;
}

.contents01 .txtBox{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 30px 0px;
}

.contents01 .txtBox p{
    text-align: center;
    line-height: 1.6em;
}


.contents02{
    background-color: #e6eff4;
}

.contents02 .boxIn{
    margin: 0px auto;
    padding: 26px 0px 26px 0px;
    max-width: 700px;
}


.contents02 .boxIn h2{
    margin: 0px 0px 26px 0px;
    padding:  12px 0px 12px 0px;
    background-color: #0450a3;
    color: #fff799;
    text-align: center;
    font-size: 24px;
    border-radius: 30px;
}

.contents02 .boxIn h2 span{
    color: #ffffff;
}

.contents02 .boxIn .section .boxL{
    margin: 0px 1% 0px 1%;
    max-width: 182px;
    width: 28%;
    float: left;
}

.contents02 .boxIn .section .boxR{
    max-width: 488px;
    width: 70%;
    float: right;
    line-height: 2em;
}


.contents02 .boxIn .section .boxR p.txt01{
    color: #0450a3;
    font-size: 16px;
}

.contents02 .boxIn .section .boxR p.txt01 span{
    color: #e33146;
    font-weight: bold;
}

.contents02 .boxIn .section .boxR p.txt01 span br{
    display:none;
}

.contents02 .boxIn .section .boxR p.txt01 em{
}

.contents02 .boxIn .section .boxR p.txt02{
    margin: 0px 0px 10px 0px;
    color: #0450a3;
    font-weight: bold;
}

.contents02 .boxIn .section .boxR .txtbox{
    margin: 0px 0px 10px 0px;
    padding: 0px 0px 10px 0px;
    border-bottom: solid 1px #0450a3;
}

.contents02 .boxIn .section .boxR .txtbox .btn-mb{
    
}

.contents02 .boxIn .section .boxR .txtbox .btn-mb a{
    margin: 0px 20px 0px 20px;
    padding: 4px 10px 4px 10px;
    display:block;
    background-color: #0450a3;
    color: #ffffff;
    text-decoration: none;
    text-align: center;
}

.contents02 .boxIn .section .boxR .txtbox .btn-mb a:before{
    content: "▶︎ ";
    color: #fff799;
}

@media screen and (max-width: 560px) {
    
    .key p{
        padding: 0px 0px 0px 0px;
    }
    
    
    .name p{
        margin: 0px auto;
        padding: 18px 0px 18px 0px;
        max-width: 401px;
        width: 84.3%;
    }
    
    .contents01{
        background-size: 40px auto;
    }
    
    .contents01 .pic01{
        margin: 0px auto 28px;
        padding: 30px 0px 0px 0px;
        max-width: 1002px;
    }
    
    .contents01 .pic03{
        margin: 0px auto 24px;
        padding: 0px 0px 0px 0px;
        max-width: 452px;
        width: 96%;
    }
    
    .contents01 .txtBox p{
        text-align: center;
        line-height: 1.6em;
        font-size: 3vw;
    }
    
    
    .contents01 .pic02{
        width: 98%;
    }
    
    
    .contents02 .boxIn h2{
        margin: 0px auto 26px;
        width: 96%;
        font-size: 20px;
        line-height: 1.1em;
    }
    
    
    .contents02 .boxIn .section .boxL{
        margin: 0px auto 20px;
        max-width:none;
        width: 38.5%;
        float: none;
    }
    
    .contents02 .boxIn .section .boxR{
        margin: 0px auto 20px;
        width: 96%;
        float: none;
    }
    
    .contents02 .boxIn .section .boxR p.txt02 br{
        display:none;
    }
    
    .contents02 .boxIn .section .boxR p.txt01{
        font-size: 14px;
    }
    
    .contents02 .boxIn .section .boxR p.txt01 span br{
        display:block;
    }
    
    
    
    
}


.contents03{
    background: url("../images/lp/dot_bg.png") repeat left 20px;
    background-size: 25px auto; 
}


.contents03 .boxIn{
    margin: 0px auto;
    padding: 50px 0px 50px 0px;
    max-width: 806px;
}




.contents04{
    background: linear-gradient(90deg,#0450a3 0%,#0450a3 40%,#a0e0eb 40%,#a0e0eb 100%);
}


.contents04 .boxIn{
    margin: 0px auto;
    padding: 0px 0px 0px 0px;
    max-width: 987px;
}



.contents05{
    background: url("../images/lp/mb/arrow_mb04.png") no-repeat center top;
    background-size: 65px auto;
}

.contents05 .boxIn{
    margin: 0px auto;
    padding: 42px 0px 20px 0px;
    max-width: 800px;
}


.contents05 .boxIn .boxL{
    margin: 0px 0px 0px 0px;
    max-width: 252px;
    float: left;
}

.contents05 .boxIn .boxR{
    margin: 0px 0px 0px 0px;
    padding: 30px 0px 0px 0px;
    max-width: 520px;
    float: right;
}


.contents05 .boxIn .boxR .txtbox p{
    margin: 0px 0px 20px 0px;
    font-size: 15px;
    line-height: 1.6em;
}

.contents05 .boxIn .boxR .txtbox p span{
    color: #fd4254;
}


@media screen and (max-width: 560px) {
    .contents03 .boxIn{
        margin: 0px auto;
        padding: 30px 0px 30px 0px;
        max-width: 806px;
        width: 90%;
    }
    
    
    .contents04{
        background:none;
    }
    
    .contents05{
        background: none;

    }
    
    .contents05 .boxIn{
        padding: 14px 0px 30px 0px;
        width: 96%;
    }
    
    .contents05 .boxIn .boxR{
        margin: 0px 0px 0px 0px;
        padding: 0px 0px 0px 0px;
        float: none;
    }
    
    .contents05 .boxIn .boxL{
        margin: 0px auto;
        float: none;
        width: 54%;
        
    }

    
}


.contents06 .boxIn h2 br{
    display:none;
}

.contents06 .boxIn .boxR .txtbox p.txt03{
    font-size: 14px;
    line-height: 1.5em;
    color: #0450a3;
}



.contents07{
    background: url("../images/lp/dot_bg.png") repeat left 20px;
    background-size: 25px auto; 
}

.contents07 .boxIn{
    margin: 0px auto;
    padding: 50px 0px 50px 0px;
    max-width: 999px;
}


.contents07 .boxIn h2{
    margin: 0px auto 20px auto;
    padding: 0px 30px 10px 30px;
    width: 70%;
    font-size: 30px;
    font-weight: bold;
    color: #fd4254;
    text-align:center;
    border-bottom: solid 1px #fd4254;
    font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
}


.contents07 .boxIn .txtbox{
    margin: 0px auto 20px;
    width: 55%;
}

.contents07 .boxIn .txtbox p{
    font-size: 15px;
    line-height: 1.5em;
    color: #262626;
}


.contents07 .boxIn .pic{
    margin: 0px auto 40px;
    max-width: 800px;
}

.contents07 .boxIn .pic02{
    margin: 0px auto;
    max-width: 680px;
}


.contents08 .boxIn{
    max-width: 760px;
}

.contents08 .boxIn h2 br{
    display:none;
}


.contents08.contents02 .boxIn .section .boxL{
    margin: 0px 1% 0px 4%;
    max-width: 221px;
    width: 30%;
}

.contents08.contents02 .boxIn .section .boxR{
    margin: 0px 4% 0px 0%;
    max-width: 434px;
}


.contents08.contents02 .boxIn .section .boxR .txtbox p{
    color: #0450a3;
    font-size: 16px;
    font-weight: bold;
}

.contents08.contents02 .boxIn .section .boxR .txtbox p span{
    color: #fd4254;
    font-size: 18px;
}


.contents09{
    
}

.contents09 .boxIn{
    margin: 0px auto;
    padding: 60px 0px 40px 0px;
    max-width: 1000px;
}

.contents09 .boxIn h2{
    margin: 0px 0px 30px 0px;
    font-size: 30px;
    text-align:center;
    font-family: "游明朝", YuMincho, "Hiragino Mincho ProN W3", "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝"
}

.contents09 .boxIn h2 br{
    display:none;
}

.contents09 .boxIn .txtbox{
    margin: 0px auto 35px;
    width: 84%;
}

.contents09 .boxIn .txtbox p{
    line-height: 1.6em;
}


.contents09 .boxIn .section{
    margin: 0px 0px 0px 0px;
}

.contents09 .boxIn .section .boxL{
    width: 48%;
    float: left;
}

.contents09 .boxIn .section p{
    margin: 0px 0px 20px 0px;
}


.contents09 .boxIn .section .boxR{
    width: 48%;
    float: right;
}


.contents09 .boxIn .section dl{
     display:flex;
}

.contents09 .boxIn .section dl dt{
    margin-right: 2%;
    width: 10%;
    max-width: 46px;
}

.contents09 .boxIn .section dl dd{
    width: 90%;
    line-height: 1.6em;
    font-size: 14px;
}

.contents09 .boxIn .section dl dd span{
    color: #0d52a1;
}


@media screen and (max-width: 560px) {
    
    .contents06 .boxIn h2{
        line-height: 1.1em;
    }
    
    .contents06 .boxIn h2 br{
        display:block;
    }
    
    
    .contents07 .boxIn{
        padding-top: 34px;
    }
    
    
    .contents07 .boxIn h2{
        margin: 0px auto 20px auto;
        padding: 0px 1% 10px 1%;
        width: 98%;
        font-size: 6vw;
        
    }
    
    .contents07 .boxIn .txtbox{
        margin: 0px auto 20px;
        width: 90%;
    }
    
    .contents07 .boxIn .txtbox p br{
        display:none;
    }
    
    .contents07 .boxIn .pic{
        margin: 0px auto 30px;
        width: 98%;
    }
    
    .contents07 .boxIn .pic02{
        margin: 0px auto;
        width: 98%;
    }
    
    .contents08 .boxIn h2 br{
        display:block;
    }
    
    
    .contents08.contents02 .boxIn .section .boxL{
        margin: 0px auto 0px;
        width: 50%;
        
    }
    
    .contents08.contents02 .boxIn .section .boxR{
        width: 100%;
    }
    
    .contents08.contents02 .boxIn .section .boxR .txtbox{
        border:none;
        
    }
    
    .contents08.contents02 .boxIn .section .boxR .txtbox p{
        font-size: 3.8vw;
        text-align: center;
    }
    
    .contents08.contents02 .boxIn .section .boxR .txtbox p span{
        font-size: 4.5vw;
    }
    
    .contents08.contents02 .boxIn .section .boxR .contact{
        margin: 0px auto;
        width: 98%;
    }
    
    .contents09 .boxIn{
        padding: 30px 0px 0px 0px;
    }
    
    .contents09 .boxIn h2{
        font-size: 6vw;
    }
    
    .contents09 .boxIn h2 br{
        display:block;
    }
    
    .contents09 .boxIn .txtbox{
        margin: 0px auto 28px;
        width: 96%;
    }
    
    
    .contents09 .boxIn .section .boxL{
        margin: 0px auto 20px;
        width: 98%;
        float: none;
    }
    
    .contents09 .boxIn .section .boxR{
        margin: 0px auto 20px;
        width: 98%;
        float: none;
    }
    
    .contents09 .boxIn .section p{
        margin: 0px 0px 10px 0px;
    }

    
    
}


.contents10{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 46px 0px;
    background-color: #ffffff;
}

.contents10 .boxIn{
    margin: 0px auto;
    max-width: 1000px;
}

.contents10 .boxIn h2{
    margin: 0px auto 26px auto;
    padding: 12px 0px 12px 0px;
    max-width: 80%;
    background-color: #0450a3;
   color: #ffffff;
    text-align: center;
    font-size: 24px;
    border-radius: 30px;
}

.contents10 .boxIn h2 span{
     color: #fff799;
}

.contents10 .boxIn h2 br{
    display:none;
}

.contents10 .boxIn .section{
    
}

.contents10 .boxIn .section .boxL{
    margin: 0px 0px 0px 0px;
    padding: 30px 50px 30px 50px;
    float: left;
    width: 48%;
    background-color: #d4e9f4;
}

.contents10 .boxIn .section .boxR{
    margin: 0px 0px 0px 0px;
    padding: 30px 50px 30px 50px;
    float: right;
    width: 48%;
    background-color: #d4e9f4;
}

.contents10 .boxIn .section .txt{
    margin: 0px 0px 14px 0px;
    text-align:center;
    font-size:18px;
    font-weight: bold;
    line-height: 1.6em;
}

/*********************************************/

.contents03.download{
    display:none;
}

.contents10 .download{
    display:none;
}

.contents10 .boxIn .section .boxL{
    margin: 0px auto;
    float:none;
}



/*********************************************/


.contents11{
    margin: 0px 0px 0px 0px;
    padding: 50px 0px 50px 0px;
    background-color: #e5e5e5;
}

.contents11 .boxIn{
    margin: 0px auto;
    max-width: 1000px;
}

.contents11 .boxIn h2{
    margin: 0px auto 36px;
    
    text-align: center;
    max-width: 40%;
    font-size: 18px;
    font-weight: bold;
    
}

.contents11 .boxIn h2 span{
    padding: 10px 20px 10px 20px;
    background-color: #ffffff;
    border-radius: 50px;
}


.contents11 .boxIn dl{
    margin: 0px 0px 35px 0px;
    font-size: 14px;
}

.contents11 .boxIn dl dt{
    margin: 0px 0px 20px 0px;   
}

.contents11 .boxIn dl dt:before{
    content: "■ ";
}

.contents11 .boxIn dl dd{
    line-height: 1.6em;
}

.contents11 .boxIn dl dd ol{
    margin: 10px 0px 0px 0px;
    padding: 10px 0px 10px 30px;
    max-width: 400px;
    border-top: solid 1px #1b1b1b;
    border-bottom: solid 1px #1b1b1b;
    list-style: decimal;
}

.contents11 .boxIn dl dd ol li{
    
}

.contents11 .boxIn .system{
    margin: 0px auto 56px;
    max-width: 998px;
}

.contents11 .boxIn .flow{
    margin: 0px auto 56px;
    max-width: 916px;
}

.contents11 .boxIn .mark{
    margin: 0px auto;
    max-width: 998px;
}

.contents11 .boxIn .mark p{
    margin: 0px 0px 40px 0px;
}

.contents11 .boxIn .mark p.pic{
    margin: 0px 0px 40px 0px;
}


.contents12{
    padding: 50px 0px 50px 0px;
}




@media screen and (max-width: 560px) {
    .contents10 .boxIn h2 br{
        display:block;
    }
    
    .contents10 .boxIn h2{
        max-width: 98%;
        font-size: 5vw;
        line-height: 1.1em;
    }
    
    .contents10 .boxIn .section .boxL{
        margin: 0px auto;
        padding: 30px 10px 20px 10px;
        float: none;
        width: 98%;
        border-bottom: solid 1px #535353;
    }
    
    .contents10 .boxIn .section .boxR{
        margin: 0px auto;
        padding: 24px 10px 30px 10px;
        float: none;
        width: 98%;
    }
    
    
    .contents10 .boxIn .section .txt{
        font-size: 4.8vw;
    }
    
    
    
    .contents11{
        margin: 0px 0px 0px 0px;
        padding: 50px 0px 20px 0px;
    }
    
    
    .contents11 .boxIn h2{
        margin: 0px auto 36px;

        text-align: center;
        max-width: 98%;
        font-size: 16px;
        font-weight: bold;

    }
    
    .contents11 .boxIn .system{
        margin: 0px auto 42px;
        max-width: 98%;
    }
    
    .contents11 .boxIn .flow{
        margin: 0px auto 42px;
        max-width: 98%;
    }
    
    
    .contents11 .boxIn .mark p{
        margin: 0px 0px 20px 0px;
    }
    
    .contents11 .boxIn .mark p.pic{
        margin: 0px 0px 20px 0px;
    }
    
    .contents11 .boxIn dl{
        margin: 0px auto 15px;
        font-size: 14px;
        width: 90%;
    }

    .contents11 .boxIn dl dt{
        margin: 0px 0px 10px 0px;   
    }

    .contents11 .boxIn dl dt:before{
        content: "■ ";
    }

    .contents11 .boxIn dl dd{
        line-height: 1.6em;
    }
    
    
    .contents12{
        padding: 30px 0px 50px 0px;
    }
    
     .contents12 br{
        display:block;
    }
    
    
    
    
    
}




footer{
    margin: 0px 0px 0px 0px;
    padding: 35px 0px 0px 0px;
    background-color: #e5e5e5;
}

.footerBox{
    margin: 0px 0px 0px 0px;
    padding: 0px 0px 30px 0px;
    background-color: #e5e5e5;


}

.footerBox p.flogo{
    margin: 0px auto 18px;
    text-align: center;
    max-width: 385px;
     

}

.footerBox .flink{
    text-align:center;
    
}


.footerBox .flink li{
    margin: 0px 10px 10px 0px;
    font-size: 14px;
    display:inline-block;
}

.footerBox .flink li:before{
    content: "・";
}


.copyright{
    margin: 0px 0px 0px 0px;
    padding: 10px 0px 100px 0px;
    text-align: center;
    background-color: #0450a3;
    color: #ffffff;
    font-size: 13px;
}

.copyright br{
    display:none;
}

.footer_fix_btn {
  position:fixed;
  bottom:0;
  width:100%;
  text-align:center;
  background: url("../images/lp/mb/bg_footer_btn.png") repeat-x left top;
    background-size: 32px 90px;
    padding-bottom: env(safe-area-inset-bottom);
  
}

.footer_fix_btn p{
    margin: 0px auto;
    max-width: 627px;
}


.footer_fix_btn a {
  display:block;
  width:100%;
  text-decoration:none;
}
.footer_fix_btn a:hover {
  opacity:0.8;
}


.outlineBox{
    margin: 0px auto;
    padding: 65px 0px 20px 0px;
    max-width: 650px;
}


.outlineBox h2{
    margin: 0px auto 32px;
    padding: 10px 10px 10px 10px;
    max-width: 50%;
    background-color: #e5e5e5;
    color: #1b1b1b;
    font-weight: bold;
    border-radius: 20px;
    text-align: center;
    font-size: 18px;
}

.outlineBox dl{
    margin: 0px 0px 24px 0px;
    padding: 0px 0px 14px 0px;
    display:flex;
    border-bottom: solid 1px #434343;
}


.outlineBox dl dt{
    width: 30%;
}

.outlineBox dl dt:before{
    content: "■ ";
}


.outlineBox dl dd{
    width: 70%;
}



@media screen and (max-width: 560px) {
    
    .footerBox p.flogo{
        margin: 0px auto 20px;
        width: 98%;
    }
    
    
    .footer_fix_btn p{
        margin: 0px auto;
        width: 98%;
    }
    
    .copyright{
        margin: 0px 0px 0px 0px;
        padding: 10px 0px 80px 0px;
        line-height: 1.6em;
    }
    
    .copyright br{
        display:block;
    }
    
    .outlineBox{
        margin: 0px auto;
        padding: 30px 0px 20px 0px;
        max-width: 96%;
    }
    
    .outlineBox h2{
        margin: 0px auto 32px;
        padding: 10px 10px 10px 10px;
        max-width: 80%;
        font-size: 5vw;
    }
    
    
    .outlineBox dl{
        margin: 0px auto 24px;
        max-width: 96%;
        display:block;
    }
    
    .outlineBox dl dt{
        margin: 0px 0px 10px 0px;
        width: 100%;
    }
    
    .outlineBox dl dd{
        width: 100%;
        line-height: 1.4em;
    }
    
    

}