

#wrapper {
    width: 100%;
    overflow: hidden;
}

/* ========================
    section共通
=========================*/

.section-padding {
    padding: 90px 0 0 0;
}

.section-title {
    text-align: center;
    font-size: 50px;
    font-weight: bold;
    color: #72777B;
    margin-bottom: 40px;
    /* font-family: "M PLUS Rounded 1c"; */
    /* font-family: "M PLUS 1p"; */
}


/* ========================
    TOP
=========================*/

.tp-caption {
    color: #545454;
}


.tp-img-pc {
    background-image: url(../images_add/top-image.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    background-color:rgba(255,255,255,0.3);
    background-blend-mode:lighten;
    display: block !important;
    width: 100vw;
    height: 100%;
}



/* ========================
    ABOUT 
=========================*/


.about-list {
    width: 95%;
}

.about-list ul {
    padding: 0;
    position: relative;
  }
  
.about-list ul li {
    color: white;
    background: #E7D4B5;
    line-height: 1.5;
    padding: 0.5em 0.5em 0.5em 2em;
    border-bottom: 2px solid white;
    list-style-type: none!important;
    font-weight: bold; /*好みで太字に*/
  }
  
.about-list ul li:before {
    font-family: "Font Awesome 5 Free";
    content: "\f14a";
    position: absolute;
    left : 0.5em; /*左端からのアイコンまでの距離*/
    color: white; /*アイコン色*/
  }

/* ========================
    service 
=========================*/

.section-service-item {
    padding: 40px 0;
    text-align: center;
    border-radius: 10px;
    background-color: #E3CDC1;
}

.service-item1 img{
    width: 40%;
}

.service-item2 img{
    width: 40%;
}

.service-item-text {
    text-align: center;
    width: 90%;
    margin: 0 auto;
}

.service-img {
    opacity: 0.6;
}

/* ========================
    Price
=========================*/


.price-bg-img {
    background-image: url(../images_add/service-img.jpg);
    background-color:rgba(255,255,255,0.6);
    background-blend-mode:lighten;
    background-size: cover;
    background-position: bottom;
    width: 100%;
    height: auto;
    padding: 100px;
}

.price-list {
    text-align: center;
}

.price-list-item {
    font-size: 50px;
    font-weight: bold;
}

.price-list-item2 {
    font-size: 30px;
}




/* ========================
    flow
=========================*/

.flow-item {
    padding: 20px 10px;
    border: #E7D4B5 solid 5px;
    border-radius: 10px;
    margin: 20px 10px;
    text-align: center;
}

.flow-list {
    list-style: none;
}

.flow-list-icon {
    display: inline-block;
    background-color: #E7D4B5;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    text-align: center;
    line-height: 50px;
    color: white;
    font-weight: bold;
}

.flow-icon {

    text-align: center;
}

.material-icons.flow-icons {
    color: #E7D4B5;
    font-size: 48px;
}


.end-message {
    display: none;
  }
  
  .false-message {
    display: none;
  }
  




  .contact-bg-img {
    background-image: url(../images_add/contact.jpg);
    background-color:rgba(255,255,255,0.8);
    background-blend-mode:lighten;
    background-size: cover;
    background-position: bottom;
    padding: 100px 10px;
}

.btn-style {
    background-color: #E5B299;
    border: white 1px solid;
    padding: 10px 50px;
    border-radius: 10px;
    color: white;
    font-weight: bold;
    display: block;
    margin: auto;
}

.form-control {
    padding: 20px 10px;
    border: lightgrey solid 2px ;
}


@media only screen and (max-width: 767px) {

    .section-padding {
        padding: 70px 0 0 0;
    }

    .section-title {
        font-size: 30px;
        margin-bottom: 20px;
    }


    /* ========================
    TOP
    =========================*/


    .tp-img-pc {
        background-image: url(../images_add/top-image-smartphone.png);
        background-size: cover;
        background-repeat: no-repeat;
        background-color:rgba(255,255,255,0.3);
        background-blend-mode:lighten;
        display: block !important;
        width: 100vw;
        height: 100%;
    }

    .tp-img-smartphone img {
        height: 100vh;
    }

    /* ========================
    ABOUT 
    =========================*/

    .about-message {
        margin-bottom: 15px;
    }



    .section-service-item {
        margin-bottom: 20px;
    }

    /* ========================
    Price
    =========================*/

    .price-bg-img {
        padding: 120px 20px;
    }

    .price-list-item {
        font-size: 35px;
        font-weight: bold;
    }

    /* ========================
    Service
    =========================*/

    .section-service-item {
        margin-bottom: 30px;
    }


    }


    