@charset "UTF-8";
/* CSS Document */

/*reset*/
.u-margin__bottom--100 {
    margin-bottom: 0px;
}
.u-margin__top--60 {
    margin-top: 0px;
}
.p-page_content {
    padding-right: 0px;
    padding-left: 0px;
}
.p-page_content__inner {
    width: 100%;
    margin: 0 auto;
    max-width: none;
  }


/* 共通スタイル設定 */
.scroll-container {
  scroll-behavior: smooth;
  overflow-y: scroll;
  height: 100vh;
}
#container .common-w {
    width: 90%;
    margin: 0 auto;
    max-width: 768px;
}
#container img {
    width: 100%;
    height: auto;
    display: block;
    margin: 0 auto;
}
#container a img {
    opacity: 1.0;
    transition: 0.3s;
}
#container a img:hover {
    opacity: 0.5;
}


/*header ---------------------------*/
#container .header {
    background-color:#b4b5af;
    background-color:#b5b5ae;
    position: relative;
}
#container .header .logo-wrap {
    position: absolute;
    bottom:0;
    right:0;
    z-index: 20;
    width: 100%;
    height: 100%;
}
#container .header .logo-wrap .logo-position {
    max-width: 980px;
    height: 100%;
    margin: 0 auto;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: flex-end;
}
#container .header .logo-wrap .logo-position img.logo {
    position: absolute;
    z-index: 3;
    width: 20%;
    max-width: 180px;
    left:2.75%;
    top:1.25%;
}
#container .header .logo-wrap .logo-position img.heart {
    position: absolute;
    z-index: 3;
    width: 32%;
    max-width: 250px;
    right:3%;
    top:7%;
}
#container .header .logo-wrap .logo-position .title {
    max-width: 620px;
}
#container .header .top {
    width: 100%;
}
@media screen and (min-width: 768px) {
    #container .header .top {
        padding-bottom: 0px;
    }
}
/*section-01 ---------------------------*/
#container .section-01 {
    margin: 0 auto;
    background-image: linear-gradient(0deg, #dbe3e6, #e5dbcf);
    padding-bottom: 20px;
}
#container .section-01 ul {
    max-width: 880px;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between
}
#container .section-01 li {
    width: 48%;
    margin-bottom:6%;
}
/*section-02 ---------------------------*/
#container .section-02 {
    background-color: #faf7f0;
}
#container .section-02 .common-w {
    max-width: 650px;
}
/*section-03 ---------------------------*/
#container .section-03 {
    background-color: #fff;
} 
#container .section-03 .common-w {
    max-width: 880px;
}
/*section-04 ---------------------------*/
#container .section-04 {
    margin: 0 auto;
    background-image: url("../img/cta-background.jpg");
    background-size: cover;
    background-repeat: repeat-x;
    background-position: left;
}
#container .section-04 .cover {
    margin: 0 auto;
    max-width: 1024px;
    background-image: url("../img/cta-pc-image.jpg");
    background-size: cover;
    background-position: center;
}
#container .section-04 .common-w {
    position: relative;
    width:calc(100% - 0px);
    max-width: 1024px;
    padding: 0 0;
}
#container .section-04 .button {
    position: absolute;
    bottom:0;
    left:0;
    z-index:3;
    width: 65%;
    min-width: 220px;
}
#container .section-04 .button img {
    padding: 3% 1.5%;
}