@charset "utf-8";

/* ==================================================
Common CSS
================================================== */

@media(max-width:999px){

/*STYLE*/
.pc {
    display:none;
}

.cts {
    width:90%;
}

.titles {
    padding-bottom:20px;
    text-align:center;
}

.titles h2 {
    font-size:150%;
    font-weight:bold;
    line-height:135%;
}

.titles .icon {
    width:60px;
    margin:0 auto 10px;
}

.maintitles .icon {
    width:60px;
    margin:0 auto 10px;
}

.titles .copy {
    font-size:100%;
    font-weight:600;
}



/*FIXED CTA*/
.fixed_cta {
    position:fixed;
    top:0;
    right:0;
    z-index:9999;
}

.fixed_cta a {
    width:70px;
    height:70px;
    background:#00b900;
    display:flex;
    justify-content:center;
    flex-direction:column;
    align-items:center;
}

.fixed_cta a img {
    width:25px;
    margin:0 auto 7px;
}

.fixed_cta a p {
    font-size:70%;
    font-weight:600;
    line-height:100%;
    color:#fff;
    text-align:center;
}





/*MV*/
#mv {
width:100%;
background:linear-gradient(#26B7C5,#86D8E3,#C9E9F2);
overflow:hidden;
position:relative;
}

#mv .logo {
width:150px;
position:absolute;
top:15px;
left:15px;
z-index:1000;
}

#mv .cts {
position:relative;
width:100%;
display:block;
height:auto;
margin-top:70px;
}

#mv .images {
width:60%;
position:relative;
margin:0;
padding:0;
}

#mv .images .mv {
position:relative;
width:100%;
left:-30px;
bottom:0;
}

#mv .images .mv img {
}

#mv .copies {
position: absolute;
top:50%;
right:0;
transform: translateY(-50%);
width:60%;
z-index:10;
padding-top:0;
margin-bottom:0;
}

#mv .copies .maincopy {
margin-bottom:30px;
text-align:center;
}

#mv .copies .maincopy .maincopies {
width:100%;
}

#mv .copies .maincopy .maincopies .copy {
position:relative;
}

#mv .copies .maincopy .maincopies .copy img {
width:100%;
height:auto;
}



/*TOP CTA*/
.top_cta {
    width:100%;
    padding:10px 0 20px;
    background:#f5f5f5;
}

.top_cta .cts {
    width:92%;
}

.top_cta .btns {
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
}

.top_cta .cta_lead_img {
    width:80%;
    margin-bottom:15px;
    text-align:center;
}

.top_cta .cta_lead_img img {
    width:100%;
    height:auto;
}

.top_cta .btns .btn {
    width:100%;
}

.top_cta .btns .btn a {
    width:100%;
    border-radius:6px;
    display:flex;
    justify-content:center;
    align-items:center;
    padding:10px;
}

.top_cta .btns .btn a img {
    width:25px;
    margin-right:7px;
}

.top_cta .btns .btn a p {
    font-weight:600;
    color:#fff;
}

.top_cta .btns .btn.line a {
    background:#00b900;
}



/*INTRO*/
#intro {
    padding:50px 0;
}

#intro .titles .icon {
    width:35px;
    margin-bottom:5px;
}

#intro .titles h2 {
    font-size:150%;
}

#intro .details {
}

#intro .details .detail {
    width:100%;
    margin-bottom:35px;
}

#intro .details .detail .photo {
    margin-bottom:20px;
}

#intro .details .detail h3 {
    display:flex;
    flex-direction:column;
    align-items:center;
    font-size:150%;
    font-weight:600;
    line-height:135%;
    text-align:center;
    padding-bottom:10px;
}

#intro .details .detail h3 img {
    width:30px;
    margin-right:5px;
}

#intro .messages {
}

#intro .messages p {
    font-size:80%;
    font-weight:600;
    text-align:center;
}




/*FEATURE*/
#feature {
    padding:70px 0;
    background:#f2fbfc;
}

#feature .titles .icon {
    width:70px;
    margin-bottom:5px;
}

#feature .maintitles {
    text-align:center;
    margin-bottom:30px;
}

#feature .maintitles h1 {
    font-size:300%;
    font-weight:bold;
    line-height:100%;
    margin-bottom:10px;
}

#feature .maintitles .copy {
    font-size:110%;
    font-weight:600;
}

#feature .kickbacks {
}

#feature .kickbacks .kickback {
    display:flex;
    justify-content:center;
    align-items:center;
}

#feature .kickbacks .kickback img {
}

#feature .systems {
    margin-bottom:70px;
}

#feature .systems .system {
    margin-bottom:70px;
    display:flex;
    flex-direction:column;
    align-items:center;
    background:#fff;
    padding:20px;
}

#feature .systems .system img {
}

#feature .systems .system .attention {
    display:flex;
    font-size:70%;
    color:#aaa;
}

#feature .features {
}

#feature .features .feature {
    margin-bottom:70px;
    display:flex;
    flex-direction:column;
    align-items:center;
    background:#fff;
    padding:20px;
}

#feature .features .feature .photo {
    width:250px;
    height:250px;
    margin-right:20px;
}

#feature .features .feature .detail {
}

#feature .features .feature .detail h3 {
    font-size:150%;
    font-weight:600;
    line-height:135%;
    padding-bottom:10px;
}

#feature .features .feature .detail .answers {
}

#feature .features .feature .detail .answers .answer {
display:flex;
background:#C9E9F2;
padding:10px 15px;
margin-bottom:10px;
}

#feature .features .feature .detail .answers .answer img {
width:22px;
}

#feature .features .feature .detail .answers .answer p {
font-size:90%;
padding-left:10px;
}

#feature .supports {
}

#feature .supports .support {
    display:flex;
    flex-direction:column;
    align-items:center;
    background:#fff;
    padding:20px;
}

#feature .supports .support .photo {
    width:250px;
}

#feature .supports .support .detail {
}

#feature .supports .support .detail h3 {
    font-size:150%;
    font-weight:600;
    line-height:135%;
    padding-bottom:10px;
}

#feature .supports .support .detail .answers {
}

#feature .supports .support .detail .answers .answer {
display:flex;
background:#C9E9F2;
padding:10px 15px;
margin-bottom:10px;
}

#feature .supports .support .detail .answers .answer img {
width:22px;
}

#feature .supports .support .detail .answers .answer p {
font-size:90%;
padding-left:10px;
}



/*RESULT*/
#result {
padding:40px 0;
background:#f2fbfc;
}

#result .maintitles {
    text-align:center;
    margin-bottom:50px;
}

#result .maintitles h1 {
    font-size:200%;
    font-weight:bold;
    line-height:100%;
    margin-bottom:10px;
}

#result .titles {
}

#result .titles h2 {
    font-size:150%;
    font-weight:bold;
    line-height:135%;
}

#result .results {
padding-top:50px;
}

#result .results .result {
width:100%;
background:#fff;
border-radius:20px;
position:relative;
padding:30px 25px 20px;
margin-bottom:45px;
}

#result .results .result:last-child {
margin-bottom:20px;
}

#result .results .result .item {
width:240px;
height:40px;
background:#26B7C5;
border-radius:10vw;
color:#fff;
text-align:center;
display:flex;
justify-content:center;
align-items:center;
position:absolute;
top:-20px;
left:0;
right:0;
margin:auto;
}

#result .attention {
    margin:auto;
}

#result .attention p {
    display:flex;
    font-size:70%;
    justify-content:center;
    color:#aaa;
}



/*PROCESS*/
#process {
    padding:50px 0 25px;
}

#process .titles {
    padding-bottom:40px;
}

#process .titles .icon {
    width:45px;
    margin-bottom:5px;
}

#process .conditions {
display:flex;
flex-direction: column;
align-items: center;
background:#26B7C5;
padding:10px 20px 10px 20px;
margin-bottom:70px;
}

#process .conditions .title {
    text-align:center;
    margin-bottom:10px;
}

#process .conditions .title h2 {
    font-size:200%;
    color:#fff;
    font-weight:bold;
    line-height:135%;
}

#process .conditions .condition {
width:100%;
text-align:center;
padding:0 0 10px 0;
}

#process .conditions .condition .item {
font-size:90%;
font-weight:600;
background:#fff;
color:#26B7C5;
}

#process .steps {
    display:flex;
    justify-content:space-between;
    flex-direction:column;
    position:relative;
    margin-bottom:50px;
}

#process .steps .flowline {
    width:20px;
    height:100%;
    background:#e1e1e1;
    position:absolute;
    top:0;
    left:0;
    right:0;
    margin:auto;
}

#process .steps .step {
    width:100%;
    position:relative;
    background:#fff;
    border:#ccc 1px solid;
    margin-bottom:30px;
    display:flex;
    justify-content:center;
    align-items:center;
}

#process .steps .step:last-child {
    margin-bottom:0;
}

#process .steps .step .number {
    width:40px;
    height:40px;
    background:#26B7C5;
    color:#fff;
    border-radius:20vw;
    display:flex;
    justify-content:center;
    align-items:center;
    text-align:center;
    position:absolute;
    top:-20px;
    left:0;
    right:0;
    margin:auto;
}

#process .steps .step .illust {
    width:100px;
    height:100px;
    margin-right:20px;
}

#process .steps .step .illust img {
}

#process .steps .step .detail {
    width:220px;
}

#process .steps .step .detail .status {
    font-size:75%;
    font-weight:600;
}

#process .attention h2 {
    font-size:200%;
    font-weight:bold;
    line-height:135%;
    text-align: center;
    margin-bottom: 25px;
}

#process .attention {
    width:100%;
    margin:auto;
}

#process .attention p {
    display:flex;
    font-size:60%;
    font-weight:600;
    justify-content:center;
    background: #26B7C5;
    color:#fff;
}

#process .attention .arrow {
    display:flex;
    font-size:70%;
    font-weight:600;
    justify-content:center;
    color:#26B7C5;
}



/*LINE BTN*/
.linebtn {
    width:280px;
    position:fixed;
    bottom:0;
    left:0;
    right:0;
    margin:auto;
    z-index:1000;
}



/*PRIVACY POLICY*/
#privacypolicy {
    padding:50px 0 30px;
    position:relative;
    background:#e1e1e1;
}

#privacypolicy .cts {
}

#privacypolicy .titles {
    padding-bottom:10px;
}

#privacypolicy .privacypolicies {
    position:relative;
    background:#fff;
    box-shadow:0 0 20px rgba(0,0,0,0.1);
}

#privacypolicy .privacypolicies .privacypolicy_cts {
    padding:25px 25px 25px;
}

#privacypolicy .privacypolicies .privacypolicy {
    padding-bottom: 20px;
    margin-bottom: 20px;
    border-bottom: #333 1px solid;
}

#privacypolicy .privacypolicies .privacypolicy .item {
    font-size:110%;
    font-weight:900;
}

#privacypolicy .backbtn {
    margin-top:50px;
    text-align:center;
}

#privacypolicy .backbtn .btn {
    display:inline-block;
}

#privacypolicy .backbtn .btn a {
    display:flex;
    justify-content:center;
    align-items:center;
    border:#000 1px solid;
    padding:10px 20px;
}

#privacypolicy .backbtn .btn a p {
    font-weight:500;
    color:#000;
    padding-left:10px;
}

#privacypolicy .backbtn .btn a .arrow {
    width:10px;
    height:10px;
    border-top:#000 1px solid;
    border-right:#000 1px solid;
    transform:rotate(-135deg);
}



/*CTA*/
.cta {
    width:100%;
    padding:30px 0;
    background:linear-gradient(#26B7C5,#86D8E3,#C9E9F2);
    background-size:cover;
    overflow:hidden;
}

.cta .cts {
    display:flex;
    justify-content:flex-end;
    align-items:center;
    position:relative;
}

.cta .copies {
    width:450px;
    text-align:center;
}

.cta .copies .photos {
    width:100%;
    position:relative;
    display:flex;
    justify-content:center;
    align-items:center;
}

.cta .copies .photos .photo {
    width:70%;
    position:relative;
    left:0;
    right:0;
    margin:auto;
}

.cta .cta_btn {
    width:100%;
    display:inline-block;
    animation:cta linear 1s infinite alternate;
    -webkit-animation:cta linear 1s infinite alternate;
}

.cta .cta_btn a {
    width:100%;
    margin:auto;
    display:flex;
    justify-content:center;
    align-items:center;
    position:relative;
    background:#00b900;
    border-radius:5px;
    padding:20px 25px;
}

.cta .cta_btn a p {
    font-size:110%;
    font-weight:bold;
    line-height:100%;
    color:#fff;
}

.cta .cta_btn a img {
    width:50px;
    position:relative;
    right:10px;
}



/*BACK TO TOP*/
.BackToTop {
position:fixed;
width:40px;
height:40px;
right:15px;
bottom:15px;
z-index:100;
display:none;
}



/*FOOTER*/
footer {
padding:30px 0 15px;
}

footer .info {
    text-align:center;
    padding-bottom:30px;
}

footer .info .logo {
    width:160px;
    margin:0 auto 15px;
}

footer .info .company {
    font-size:100%;
    font-weight:bold;
}

footer .info .address {
    font-size:80%;
}

footer .info .tel {
    font-size:80%;
}

footer .info .mail {
    font-size:80%;
}

footer .privacypolicy {
    font-size:60%;
    text-align:center;
    color:#aaa;
}

footer .copyright {
font-size:60%;
text-align:center;
color:#aaa;
}

















}