body {
    background:#fff9f0;
}

main {
    max-width: 800px;
    margin: auto;
    padding: 0 0 2rem;
    width: 100%;
    background: #fff2d5;
    box-sizing: border-box;
}

img {
    display: block;
    vertical-align: bottom;
    width: 100%;
    height: auto;
}

video {
    width: 100%;
}

main p,
main h1,
main h2,
main h3,
main li {
    /*color: #485157; */
    color:#414141;
    font-weight: 500;
}

main p {
    font-size: 4vw;
    line-height: 1.5;
    letter-spacing: 0.02rem;
}

.notice-title {
    margin: 1rem auto 0.2rem;
}

.notice {
    font-size:3vw;
}

main ul {
    padding:0;
}

main li {
    font-size: 3.5vw;
    line-height: 1.5;
    letter-spacing: 0.02rem;
    margin: 0.3rem auto;
    list-style: none;
}

.content2 li {
    font-size:4vw;
}

main h2 {
    font-size: 5vw;
    font-weight: bold;
    margin: 1rem auto;
}

main h3 {
    font-size: 4.5vw;
    font-weight: bold;
    margin: 0 auto 0.2rem;
}

.description {
    text-align: center;
    font-size: 4vw;
    margin-bottom: 2rem;
    font-weight:bold;
    line-height:1.6;
}

.center {
    text-align:center;
}

@media screen and (min-width:720px) {

    main p,
    main li {
        font-size: 1.2rem;
    }
    
    .content2 li {
        font-size: 1.2rem;
    }
    
    .notice {
        font-size: 1rem;
    }

    main h2 {
        font-size: 2rem;
    }

    main h3 {
        font-size: 1.6rem;
    }

    .description {
        text-align: center;
        font-size: 1.7rem;;
    }
}

.content {
    margin: 2rem 1rem;
    /* background: #fbfbfb; */
    padding: 2rem 1rem;
    border-radius: 10px;
   /* box-shadow: 0px 0px 8px rgb(0, 0, 0, 0.2); */
    box-shadow: 0px 0px 15px rgb(206, 170, 51, 0.3);
}

.bkw {
    background: #fff;
}

.content1 {
    margin: 0 1rem 2rem;
    padding:0;
    box-shadow:none;
}

@media screen and (min-width:720px) {
    .content {
        margin: 2rem auto;
        max-width:600px;
    }
    
    .content1 {
       margin: 0 auto 2rem;
    }
}

.content1 div {
    padding:2rem;
    border-radius: 10px;
    box-shadow: 0px 0px 15px rgb(206, 170, 51, 0.3);
}

.content1 div h3 {
    margin-top:1rem;
}
.content1 div h3:nth-child(1){
    margin-top:0;
}

.content2 img,
.content3 img {
    margin: 1rem 0 2rem;
}

.content4 h2 {
    text-align: center;
    position: relative;
}

.content4 .under-line {
    background-image: linear-gradient(to top, #fbd25e 6px, transparent 6px);
    background-repeat: no-repeat;
    background-size: 100% 6px;
    background-position: center 95%;
}
@media screen and (min-width:720px) {
    .content4 .under-line {
    background-image: linear-gradient(to top, #fbd25e 10px, transparent 10px);
    background-repeat: no-repeat;
    background-size: 100% 10px;
    background-position: center 95%;
    }
}

/* btn */
.line-link {
    text-align: center;
    background: #fff;
    padding: 1rem;
    margin: 1rem;
    border-radius: 10px;
    box-shadow: 0px 0px 15px rgb(206, 170, 51, 0.3);
}

.line-link-back>.line-link {
    margin:0;
}

.line-link-back {
    /*background: #f7c058;*/
    margin:0;
    padding: 1rem;
    border-radius:0;
}

@media screen and (min-width:720px) {
    .line-link-back {
        max-width:632px;
        margin: auto;
    }
    .line-link {
        padding: 1rem 0;
    }
}

.line-link-btn {
    max-width: 500px;
    display: block;
    margin: auto;
}

.line-link-tx1,
.line-link-tx2 {
    margin: auto;
}

.line-link-tx1 {
    font-size: 3vw;
}

@media screen and (min-width:720px) {
    .line-link-tx1 {
        font-size: 1rem;
    }
}


/* アニメーション */
.line {
    text-decoration: underline;
}

.is-active {
    opacity: 0;
    transition: 0.5s;
}

.line-back {
    height: 100%;
    position: relative;
}

.line-back.is-active {
    opacity: 1;
}

.line-back::before {
    content: "";
    position: absolute;
    display: block;
    top: 12%;
    left: 20%;
    width: 0%;
    height: 15px;
    transition: 0.8s;
    background:url(https://d2w53g1q050m78.cloudfront.net/ssrabemashopping/uploads/hareno/crosssell/01/assets/img/lp03_09-elm01_01.png)no-repeat;
}

.line-back.is-active::before {
    width: 50%;
}

@media screen and (max-width:640px) {
    .line-back::before {
        height: 10px;
    }
}

.llw {
    max-width: 100%;
    background: #fff2d5;
}

.posAbs {
    width: 100%;
}

.green-t {
    color: #85c5ab;
    font-size: 23px;
    font-weight: 700;
}

.red-t {
    color: #cb5858;
    font-weight: 700;
    letter-spacing: 0.05rem;
    font-size: 21px;
}



.lp03_03 .elm01_01 {
    width: 100%;
    inset: auto auto 0 0
}

.lp03_07 {
    margin-bottom: -5px;
}

.lp03_07 .elm01_01 {
    width: 100%;
    inset: auto auto .5% 0
}

.lp03_08 .elm01 {
    width: 52.9333333333%;
    inset: 62.7% auto auto 18%
}

.lp03_09 .elm01 {
    width: 100%;
    height: 25%;
    inset: 67.6% auto auto 0
}

.lp03_09 .elm01_01 {
    width: 51.3333333333%;
    inset: 12% auto auto 19.7%
}

.lp03_09 .elm01_02 {
    width: 68.2666666667%;
    inset: 0 auto auto 16.1%
}

.lp03_11 .elm01 {
    width: 46.1333333333%;
    inset: 24.2% auto auto 16.4%
}