@charset "UTF-8";
/* =======================================
description 説明
======================================= */
#description h2 + div {
text-align: center;
width: 90%;
max-width: 1280px;
margin: 0 auto;
position: relative;
}

#description h2 + div:before,
#description h2 + div:after {
display: block;
content: "";
position: absolute;
background: url("../img/coupon/baloon02.png") no-repeat;
background-size: contain;
width: 120px;
height: 300px;
top: -70%;

}

#description h2 + div:after {
background: url("../img/coupon/baloon01.png") no-repeat;
background-size: contain;
width: 200px;
height: 370px;
right: 0;
top: -100%;
}

#description h2 + div > p {
display: inline-block;
text-align: left;
margin: 3rem auto 0;
}

@media screen and (max-width: 1024px) {
#description h2 + div:after {
width: 140px;
}
#description h2 + div:before {
width: 100px;
top: -100%;
z-index: -1;
}
}

@media screen and (max-width: 812px) {
#description h2 + div:after {
top: -80%;
z-index: -1;
}
#description h2 + div:before {
top: -50%;
}
}

@media screen and (max-width: 480px) {
#description h2 + div:after {
width: 100px;
top: -50%;
}
#description h2 + div:before {
width: 60px;
top: -30%;
z-index: -1;
}
}

/* =======================================
#detail 詳細
======================================= */
#detail {
background-image: url("../img/common/line-flag.svg"),url("../img/coupon/paper_bg.jpg");
background-position: top,center;
background-repeat: repeat-x,repeat;
}

#detail > div {
width: 90%;
max-width: 1280px;
margin: 0 auto;
padding: 4rem 0;
position: relative;
}

#detail > div .txtBox {
width: 60%;
}

#detail > div .txtBox h3 {
font-size: 1.5rem;
font-size: 1.3rem;
line-height: 150%;
font-weight: 700;
color: #80D5AE;
padding: 10px 0 30px 100px;
background: url("../img/coupon/icon_present.svg") no-repeat;
background-size: 80px;
margin-bottom: 1.5rem;
position: relative;
}
#detail > div .txtBox h3:after {
content: "";
display: block;
width: 200px;
height: 20px;
background: url("../img/common/dot_line.svg") repeat-x;
position: absolute;
bottom: -5px;
}

#detail > div figure {
width: 40%;
max-width:400px;
padding: 2rem;
background: url("../img/coupon/paper_bg2.jpg");
position: absolute;
right: 0;
top: -3.5rem;
}

#detail > div figure img {
position: relative;
}

#detail > div figure:before {
content: "▲";
color: #fff;
margin-top: -50px;
margin-left: -50px;
font-size: 80px;
position: absolute;
transform: rotate(80deg);
}

@media screen and (max-width: 1024px) {
#detail > div .txtBox {
width: 55%;
}
#detail > div figure {
top: 4rem;
padding: 1rem;
}
#detail > div figure:before {
display: none;
}
}
@media screen and (max-width: 480px){
#detail > div .txtBox h3 {
font-size: 1.3rem;
}
#detail > div .txtBox,
#detail > div figure {
width: 100%;
position: relative;
}
#detail > div figure {
top: 2rem;
}
}