/* ----------------------------------
キャンペーン フレーム
-------------------------------- */
.shipping-campaign {
position: relative;
margin:0 auto;
padding: 4rem 0 3rem 0;
border: 2px solid var(--color-gold1);
background:var(--color-gold3);
text-align: center;
max-width:600px;
}

/* SP */
@media (max-width:600px) {
.shipping-campaign {
margin: 4rem auto 0 auto;
}

}

/* --------------------------------
リボン
---------------------------------- */
.shipping-campaign__ribbon {
position: absolute;
top: -1px;
left: 50%;
padding:1rem 2rem;
transform: translate(-50%, -50%);
background:var(--color-gold1);
color: #FFF;
font-size: 2rem;
line-height: 1.5;
font-family:"mincho", serif;
letter-spacing: 0.12em;
white-space: nowrap;
}

.shipping-campaign__ribbon::before,
.shipping-campaign__ribbon::after {
position: absolute;
top: 0;
width: 3rem;
height: 100%;
background: inherit;
content: "";
}

.shipping-campaign__ribbon::before {
left: -2.5rem;
clip-path: polygon(100% 0, 100% 100%, 0 100%, 38% 50%, 0 0);
}

.shipping-campaign__ribbon::after {
right: -2.5rem;
clip-path: polygon(0 0, 100% 0, 62% 50%, 100% 100%, 0 100%);
}


/* --------------------------------
装飾
----------------------------------- */
.shipping-campaign::before,
.shipping-campaign::after {
position: absolute;
width: 5rem;
height: 5rem;
opacity: .3;
content: "";
}

.shipping-campaign::before {
right: 1.5rem;
top: 1.5rem;
border-top: 2px solid var(--color-gold1);
border-right: 2px solid var(--color-gold1);
}

.shipping-campaign::after {
bottom: 1.5rem;
left: 1.5rem;
border-bottom: 2px solid var(--color-gold1);
border-left: 2px solid var(--color-gold1);
}



/* --------------------------------
内容
---------------------------------- */
.shipping-campaign__inner {
display: flex;
align-items: center;
justify-content: center;
gap:2rem;
}

.shipping-campaign__icon {
display: grid;
flex: 0 0 7rem;
width: 7rem;
height: 7rem;
place-items: center;
border-radius: 50%;
background: var(--color-gold1);
color: var(--color-gold1);
color: #FFF;
}

.shipping-campaign__icon svg {
width: 4.7rem;
height: 4.7rem;
fill: none;
stroke: currentColor;
stroke-width: 2;
stroke-linecap: round;
stroke-linejoin: round;
}

.shipping-campaign__content {
text-align: left;
}

.shipping-campaign__title {
margin: 0;
font-family:"mincho", serif;
font-size: 2rem;
font-weight: 500;
line-height: 1.55;
letter-spacing: 0.04em;
}

.shipping-campaign__title span {
font-family:"number", serif;
color: var(--color-gold1);
}

.shipping-campaign__sub {
margin: .5rem 0 0;
font-family:"mincho", serif;
line-height: 1.7;
letter-spacing: 0.04em;
}

.shipping-campaign__note {
margin: 1rem 0 0;
color: var(--color-gray3);
font-size: 1.3rem;
line-height: 1.7;
letter-spacing: 0.03em;
}


/* SP */
@media (max-width:600px) {
.shipping-campaign__inner {
flex-direction: column;
gap: 14px;
}

.shipping-campaign__icon {
display:none;
}

.shipping-campaign__content {
text-align: center;
}

.shipping-campaign__note {
margin-top: 17px;
}

}



